Skip to content

Commit 5fbdb71

Browse files
geospatialembenelan
authored andcommitted
revert(fab): add component tokens (#11805)
**Related Issue:** #7180 ## Summary Reverts the `fab` component tokens for release. This reverts commit 5f97278.
1 parent 6ebd117 commit 5fbdb71

File tree

4 files changed

+3
-43
lines changed

4 files changed

+3
-43
lines changed

packages/calcite-components/src/components/fab/fab.e2e.ts

+1-15
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { newE2EPage } from "@arcgis/lumina-compiler/puppeteerTesting";
22
import { describe, expect, it } from "vitest";
3-
import { accessible, defaults, disabled, hidden, renders, themed } from "../../tests/commonTests";
3+
import { accessible, defaults, disabled, hidden, renders } from "../../tests/commonTests";
44
import { findAll } from "../../tests/utils";
5-
import { html } from "../../../support/formatting";
65
import { CSS } from "./resources";
76

87
describe("calcite-fab", () => {
@@ -149,17 +148,4 @@ describe("calcite-fab", () => {
149148
});
150149
});
151150
});
152-
153-
describe("theme", () => {
154-
describe("default", () => {
155-
themed(html`<calcite-fab></calcite-fab>`, {
156-
"--calcite-fab-background-color": {
157-
targetProp: "--calcite-fab-background-color",
158-
},
159-
"--calcite-fab-shadow": {
160-
targetProp: "--calcite-fab-shadow",
161-
},
162-
});
163-
});
164-
});
165151
});

packages/calcite-components/src/components/fab/fab.scss

+2-15
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,11 @@
1-
/**
2-
* CSS Custom Properties
3-
*
4-
* These properties can be overridden using the component's tag as selector.
5-
*
6-
* @prop --calcite-fab-background-color: Specifies the component's background color.
7-
* @prop --calcite-fab-shadow: Specifies the component's shadow.
8-
*/
9-
101
:host {
11-
@apply flex;
12-
13-
background-color: var(--calcite-fab-background-color, transparent);
2+
@apply flex bg-transparent;
143
}
154

165
@include disabled();
176

187
calcite-button {
19-
--calcite-fab-shadow-internal: 0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);
20-
box-shadow: var(--calcite-fab-shadow, var(--calcite-fab-shadow-internal));
21-
8+
@apply shadow-2;
229
&:hover {
2310
@apply shadow-2-lg;
2411
}

packages/calcite-components/src/custom-theme.stories.ts

-5
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ import { chips, chipTokens } from "./custom-theme/chips";
2424
import { comboboxItem, comboboxItemTokens, selectedComboboxItem } from "./custom-theme/combobox-item";
2525
import { datePicker, datePickerRange, datePickerTokens } from "./custom-theme/date-picker";
2626
import { dropdown, DropdownGroupTokens, DropdownItemTokens, DropdownTokens } from "./custom-theme/dropdown";
27-
import { fab, fabTokens } from "./custom-theme/fab";
2827
import { flow, flowTokens } from "./custom-theme/flow";
2928
import { graph, graphTokens } from "./custom-theme/graph";
3029
import { handle, handleTokens } from "./custom-theme/handle";
@@ -166,9 +165,6 @@ const kitchenSink = (args: Record<string, string>, useTestValues = false) =>
166165
<div class="demo-column">${datePicker}</div>
167166
<div class="demo-column">${datePickerRange}</div>
168167
</div>
169-
<div class="demo-row">
170-
<div class="demo-column">${fab}</div>
171-
</div>
172168
</div>`;
173169

174170
const componentTokens = {
@@ -194,7 +190,6 @@ const componentTokens = {
194190
...DropdownTokens,
195191
...DropdownItemTokens,
196192
...DropdownGroupTokens,
197-
...fabTokens,
198193
...flowTokens,
199194
...handleTokens,
200195
...inlineEditableTokens,

packages/calcite-components/src/custom-theme/fab.ts

-8
This file was deleted.

0 commit comments

Comments
 (0)