Skip to content

Commit 74ddbd9

Browse files
castastrophecastastrophe
committed
fix: full update for css packages
1 parent c9eb6ec commit 74ddbd9

File tree

114 files changed

+2578
-9142
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

114 files changed

+2578
-9142
lines changed

‎packages/action-button/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@
7171
"@spectrum-web-components/shared": "1.4.0"
7272
},
7373
"devDependencies": {
74-
"@spectrum-css/actionbutton": "7.1.2"
74+
"@spectrum-css/actionbutton": "7.1.3"
7575
},
7676
"types": "./src/index.d.ts",
7777
"customElements": "custom-elements.json",

‎packages/action-button/src/action-button-overrides.css

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,32 +63,32 @@ governing permissions and limitations under the License.
6363
}
6464

6565
:host {
66-
--spectrum-actionbutton-border-radius: var(
67-
--system-action-button-size-m-border-radius
66+
--spectrum-actionbutton-border-radius-default: var(
67+
--system-action-button-size-m-border-radius-default
6868
);
6969
}
7070

7171
:host([size='xs']) {
72-
--spectrum-actionbutton-border-radius: var(
73-
--system-action-button-size-xs-border-radius
72+
--spectrum-actionbutton-border-radius-default: var(
73+
--system-action-button-size-xs-border-radius-default
7474
);
7575
}
7676

7777
:host([size='s']) {
78-
--spectrum-actionbutton-border-radius: var(
79-
--system-action-button-size-s-border-radius
78+
--spectrum-actionbutton-border-radius-default: var(
79+
--system-action-button-size-s-border-radius-default
8080
);
8181
}
8282

8383
:host([size='l']) {
84-
--spectrum-actionbutton-border-radius: var(
85-
--system-action-button-size-l-border-radius
84+
--spectrum-actionbutton-border-radius-default: var(
85+
--system-action-button-size-l-border-radius-default
8686
);
8787
}
8888

8989
:host([size='xl']) {
90-
--spectrum-actionbutton-border-radius: var(
91-
--system-action-button-size-xl-border-radius
90+
--spectrum-actionbutton-border-radius-default: var(
91+
--system-action-button-size-xl-border-radius-default
9292
);
9393
}
9494

‎packages/action-button/src/spectrum-action-button.css

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ governing permissions and limitations under the License.
9595
--spectrum-actionbutton-background-color: var(--highcontrast-actionbutton-background-color, var(--mod-actionbutton-background-color-default, var(--spectrum-actionbutton-background-color-default)));
9696
--spectrum-actionbutton-border-color: var(--highcontrast-actionbutton-border-color, var(--mod-actionbutton-border-color-default, var(--spectrum-actionbutton-border-color-default)));
9797
--spectrum-actionbutton-content-color: var(--highcontrast-actionbutton-content-color, var(--mod-actionbutton-content-color-default, var(--spectrum-neutral-content-color-default)));
98-
--spectrum-actionbutton-border-radius: var(--mod-actionbutton-border-radius, var(--spectrum-actionbutton-border-radius));
98+
--spectrum-actionbutton-border-radius: var(--mod-actionbutton-border-radius, var(--spectrum-actionbutton-border-radius-default));
9999
--spectrum-actionbutton-border-width: var(--mod-actionbutton-border-width, var(--spectrum-border-width-100));
100100
--spectrum-actionbutton-focus-indicator-gap: var(--mod-actionbutton-focus-indicator-gap, var(--spectrum-focus-indicator-gap));
101101
--spectrum-actionbutton-focus-indicator-thickness: var(--mod-actionbutton-focus-indicator-thickness, var(--spectrum-focus-indicator-thickness));
@@ -315,7 +315,6 @@ governing permissions and limitations under the License.
315315
line-height: var(--spectrum-actionbutton-height);
316316
font-size: var(--spectrum-actionbutton-font-size);
317317
white-space: nowrap;
318-
color: inherit;
319318
color: var(--mod-actionbutton-label-color, inherit);
320319
text-overflow: ellipsis;
321320
overflow: hidden;

‎packages/action-group/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@
7171
"@spectrum-web-components/reactive-controllers": "1.4.0"
7272
},
7373
"devDependencies": {
74-
"@spectrum-css/actiongroup": "6.0.0-s2-foundations.17"
74+
"@spectrum-css/actiongroup": "6.1.0"
7575
},
7676
"types": "./src/index.d.ts",
7777
"customElements": "custom-elements.json",

‎packages/action-menu/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@
7575
"@spectrum-web-components/shared": "1.4.0"
7676
},
7777
"devDependencies": {
78-
"@spectrum-css/actionmenu": "7.0.0-s2-foundations.15"
78+
"@spectrum-css/actionmenu": "7.1.1"
7979
},
8080
"types": "./src/index.d.ts",
8181
"customElements": "custom-elements.json",

‎packages/button/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@
9999
"@spectrum-web-components/shared": "1.4.0"
100100
},
101101
"devDependencies": {
102-
"@spectrum-css/button": "14.1.1"
102+
"@spectrum-css/button": "14.1.3"
103103
},
104104
"types": "./src/index.d.ts",
105105
"customElements": "custom-elements.json",

‎packages/button/src/button-overrides.css

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -205,6 +205,9 @@ governing permissions and limitations under the License.
205205
}
206206

207207
:host([static-color='white'][treatment='outline']:not([variant='secondary'])) {
208+
--mod-button-background-color-default: var(
209+
--system-button-static-white-outline-not-secondary-background-color-default
210+
);
208211
--mod-button-background-color-hover: var(
209212
--system-button-static-white-outline-not-secondary-background-color-hover
210213
);
@@ -307,15 +310,6 @@ governing permissions and limitations under the License.
307310
}
308311

309312
:host([static-color='black'][variant='secondary'][treatment='outline']) {
310-
--mod-button-background-color-hover: var(
311-
--system-button-static-black-secondary-outline-background-color-hover
312-
);
313-
--mod-button-background-color-down: var(
314-
--system-button-static-black-secondary-outline-background-color-down
315-
);
316-
--mod-button-background-color-focus: var(
317-
--system-button-static-black-secondary-outline-background-color-focus
318-
);
319313
--mod-button-border-color-default: var(
320314
--system-button-static-black-secondary-outline-border-color-default
321315
);
@@ -331,6 +325,9 @@ governing permissions and limitations under the License.
331325
}
332326

333327
:host([static-color='black'][treatment='outline']:not([variant='secondary'])) {
328+
--mod-button-background-color-default: var(
329+
--system-button-static-black-outline-not-secondary-background-color-default
330+
);
334331
--mod-button-background-color-hover: var(
335332
--system-button-static-black-outline-not-secondary-background-color-hover
336333
);

‎packages/clear-button/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
"@spectrum-web-components/base": "1.4.0"
5353
},
5454
"devDependencies": {
55-
"@spectrum-css/clearbutton": "7.0.0-s2-foundations.16"
55+
"@spectrum-css/clearbutton": "7.2.0"
5656
},
5757
"types": "./src/index.d.ts",
5858
"customElements": "custom-elements.json",

‎packages/clear-button/src/clear-button-overrides.css

Lines changed: 4 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -24,90 +24,16 @@ governing permissions and limitations under the License.
2424
--spectrum-clear-button-background-color-key-focus: var(
2525
--system-clear-button-background-color-key-focus
2626
);
27-
--spectrum-clear-button-height: var(--system-clear-button-height);
28-
--spectrum-clear-button-width: var(--system-clear-button-width);
29-
--spectrum-clear-button-padding: var(--system-clear-button-padding);
30-
--spectrum-clear-button-icon-color: var(--system-clear-button-icon-color);
31-
--spectrum-clear-button-icon-color-hover: var(
32-
--system-clear-button-icon-color-hover
33-
);
34-
--spectrum-clear-button-icon-color-down: var(
35-
--system-clear-button-icon-color-down
36-
);
37-
--spectrum-clear-button-icon-color-key-focus: var(
38-
--system-clear-button-icon-color-key-focus
39-
);
40-
}
41-
42-
:host([size='s']) {
43-
--spectrum-clear-button-height: var(--system-clear-button-size-s-height);
44-
--spectrum-clear-button-width: var(--system-clear-button-size-s-width);
45-
}
46-
47-
:host([size='l']) {
48-
--spectrum-clear-button-height: var(--system-clear-button-size-l-height);
49-
--spectrum-clear-button-width: var(--system-clear-button-size-l-width);
50-
}
51-
52-
:host([size='xl']) {
53-
--spectrum-clear-button-height: var(--system-clear-button-size-xl-height);
54-
--spectrum-clear-button-width: var(--system-clear-button-size-xl-width);
55-
}
56-
57-
:host .spectrum-ClearButton--quiet {
58-
--spectrum-clear-button-background-color: var(
59-
--system-clear-button-quiet-background-color
60-
);
61-
--spectrum-clear-button-background-color-hover: var(
62-
--system-clear-button-quiet-background-color-hover
63-
);
64-
--spectrum-clear-button-background-color-down: var(
65-
--system-clear-button-quiet-background-color-down
66-
);
67-
--spectrum-clear-button-background-color-key-focus: var(
68-
--system-clear-button-quiet-background-color-key-focus
69-
);
7027
}
7128

72-
:host([variant='overBackground']) {
73-
--spectrum-clear-button-icon-color: var(
74-
--system-clear-button-over-background-icon-color
75-
);
76-
--spectrum-clear-button-icon-color-hover: var(
77-
--system-clear-button-over-background-icon-color-hover
78-
);
79-
--spectrum-clear-button-icon-color-down: var(
80-
--system-clear-button-over-background-icon-color-down
81-
);
82-
--spectrum-clear-button-icon-color-key-focus: var(
83-
--system-clear-button-over-background-icon-color-key-focus
84-
);
85-
--spectrum-clear-button-background-color: var(
86-
--system-clear-button-over-background-background-color
87-
);
29+
:host .spectrum-ClearButton--staticWhite {
8830
--spectrum-clear-button-background-color-hover: var(
89-
--system-clear-button-over-background-background-color-hover
31+
--system-clear-button-static-white-background-color-hover
9032
);
9133
--spectrum-clear-button-background-color-down: var(
92-
--system-clear-button-over-background-background-color-down
34+
--system-clear-button-static-white-background-color-down
9335
);
9436
--spectrum-clear-button-background-color-key-focus: var(
95-
--system-clear-button-over-background-background-color-key-focus
96-
);
97-
}
98-
99-
:host([disabled]),
100-
:host([disabled]) {
101-
--spectrum-clear-button-icon-color: var(
102-
--system-clear-button-disabled-icon-color
103-
);
104-
--spectrum-clear-button-icon-color-hover: var(
105-
--system-clear-button-disabled-icon-color-hover
106-
);
107-
--spectrum-clear-button-icon-color-down: var(
108-
--system-clear-button-disabled-icon-color-down
109-
);
110-
--spectrum-clear-button-background-color: var(
111-
--system-clear-button-disabled-background-color
37+
--system-clear-button-static-white-background-color-key-focus
11238
);
11339
}

‎packages/clear-button/src/spectrum-clear-button.css

Lines changed: 62 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,15 @@ governing permissions and limitations under the License.
1212

1313
/* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */
1414
:host {
15+
--spectrum-clear-button-height: var(--spectrum-component-height-100);
16+
--spectrum-clear-button-width: var(--spectrum-component-height-100);
17+
--spectrum-clear-button-padding: var(--spectrum-in-field-button-edge-to-fill);
18+
--spectrum-clear-button-icon-color: var(--spectrum-neutral-content-color-default);
19+
--spectrum-clear-button-icon-color-hover: var(--spectrum-neutral-content-color-hover);
20+
--spectrum-clear-button-icon-color-down: var(--spectrum-neutral-content-color-down);
21+
--spectrum-clear-button-icon-color-key-focus: var(--spectrum-neutral-content-color-key-focus);
1522
block-size: var(--mod-clear-button-height, var(--spectrum-clear-button-height));
1623
inline-size: var(--mod-clear-button-width, var(--spectrum-clear-button-width));
17-
cursor: pointer;
18-
background-color: initial;
1924
background-color: var(--mod-clear-button-background-color, transparent);
2025
padding: var(--mod-clear-button-padding, var(--spectrum-clear-button-padding));
2126
color: var(--mod-clear-button-icon-color, var(--spectrum-clear-button-icon-color));
@@ -24,47 +29,84 @@ governing permissions and limitations under the License.
2429
margin: 0;
2530
}
2631

32+
:host([size='s']) {
33+
--spectrum-clear-button-height: var(--spectrum-component-height-75);
34+
--spectrum-clear-button-width: var(--spectrum-component-height-75);
35+
}
36+
37+
:host([size='l']) {
38+
--spectrum-clear-button-height: var(--spectrum-component-height-200);
39+
--spectrum-clear-button-width: var(--spectrum-component-height-200);
40+
}
41+
42+
:host([size='xl']) {
43+
--spectrum-clear-button-height: var(--spectrum-component-height-300);
44+
--spectrum-clear-button-width: var(--spectrum-component-height-300);
45+
}
46+
47+
:host .spectrum-ClearButton--quiet {
48+
--mod-clear-button-background-color: transparent;
49+
--mod-clear-button-background-color-hover: transparent;
50+
--mod-clear-button-background-color-down: transparent;
51+
--mod-clear-button-background-color-key-focus: transparent;
52+
}
53+
54+
:host .spectrum-ClearButton--staticWhite {
55+
--mod-clear-button-icon-color: var(--spectrum-white);
56+
--mod-clear-button-icon-color-hover: var(--spectrum-white);
57+
--mod-clear-button-icon-color-down: var(--spectrum-white);
58+
--mod-clear-button-icon-color-key-focus: var(--spectrum-white);
59+
--mod-clear-button-icon-color-disabled: var(--spectrum-disabled-static-white-content-color);
60+
--mod-clear-button-background-color: transparent;
61+
}
62+
63+
:host([disabled]),
64+
:host([disabled]) {
65+
--mod-clear-button-icon-color: var(--mod-clear-button-icon-color-disabled, var(--spectrum-disabled-content-color));
66+
--mod-clear-button-icon-color-hover: var(--spectrum-disabled-content-color);
67+
--mod-clear-button-icon-color-down: var(--spectrum-disabled-content-color);
68+
--mod-clear-button-background-color: var(--mod-clear-button-background-color-disabled, transparent);
69+
}
70+
71+
:host:not(:disabled) {
72+
cursor: pointer;
73+
}
74+
2775
.icon {
2876
margin-block: 0;
2977
margin-inline: auto;
3078
}
3179

3280
@media (hover: hover) {
33-
:host(:hover) {
81+
:host:not(:disabled):hover {
3482
color: var(--highcontrast-clear-button-icon-color-hover, var(--mod-clear-button-icon-color-hover, var(--spectrum-clear-button-icon-color-hover)));
3583
}
3684

37-
:host(:hover) .fill {
85+
:host:not(:disabled):hover .fill {
3886
background-color: var(--mod-clear-button-background-color-hover, var(--spectrum-clear-button-background-color-hover));
3987
}
4088
}
4189

42-
:host(:is(:active, [active])) {
90+
:host(:is(:active, [active])):not(:disabled) {
4391
color: var(--mod-clear-button-icon-color-down, var(--spectrum-clear-button-icon-color-down));
4492
}
4593

46-
:host(:is(:active, [active])) .fill {
94+
:host(:is(:active, [active])):not(:disabled) .fill {
4795
background-color: var(--mod-clear-button-background-color-down, var(--spectrum-clear-button-background-color-down));
4896
}
4997

50-
:host([focus-within]) .js-focus-within,
51-
:host(:focus-visible),
52-
:host:focus-within,
53-
:host([focus-within]) .js-focus-within {
98+
:host:not(:disabled):focus-visible,
99+
:host:not(:disabled):focus-within {
54100
color: var(--mod-clear-button-icon-color-key-focus, var(--spectrum-clear-button-icon-color-key-focus));
55101
}
56102

57-
:host([focus-within]) .js-focus-within .fill,
58-
:host(:focus-visible) .fill,
59-
:host:focus-within .fill,
60-
:host([focus-within]) .js-focus-within .fill {
103+
:host:not(:disabled):focus-visible .fill,
104+
:host:not(:disabled):focus-within .fill {
61105
background-color: var(--mod-clear-button-background-color-key-focus, var(--spectrum-clear-button-background-color-key-focus));
62106
}
63107

64-
:host([disabled]),
65-
:host([disabled]) {
66-
--spectrum-clear-button-icon-color: var(--mod-clear-button-icon-color-disabled, var(--spectrum-disabled-content-color));
67-
--spectrum-clear-button-background-color: var(--mod-clear-button-background-color-disabled, transparent);
108+
.spectrum-ClearButton-icon {
109+
color: inherit;
68110
}
69111

70112
.fill {
@@ -77,7 +119,8 @@ governing permissions and limitations under the License.
77119
display: flex;
78120
}
79121

80-
:host([variant='overBackground']:focus-visible) {
122+
:host([variant='overBackground']:focus-visible),
123+
.spectrum-ClearButton--staticWhite:focus-visible {
81124
outline: none;
82125
}
83126

‎packages/close-button/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
"@spectrum-web-components/base": "1.4.0"
5353
},
5454
"devDependencies": {
55-
"@spectrum-css/closebutton": "6.0.0-s2-foundations.16"
55+
"@spectrum-css/closebutton": "6.1.0"
5656
},
5757
"types": "./src/index.d.ts",
5858
"customElements": "custom-elements.json",

0 commit comments

Comments
 (0)