Skip to content

Commit 9632409

Browse files
marissahuysentruytmarissahuysentruyt
committed
fix(stepper): fix focus and focus hover states
- fixes the focus & focus hover states, so that hovering over either element (the textfield OR the stepper buttons) will trigger the SAME border color for both elements. - removed some of the :not(disabled) to simplify selectors. - add keyboardfocused+hovered test - keyboardfocused+hovered states showcase hovering over any part of the element triggers the SAME border color for the textfield and the infield buttons - metadata updated and removal of code/TODO comments
1 parent 22fb88d commit 9632409

File tree

4 files changed

+113
-98
lines changed

4 files changed

+113
-98
lines changed

‎components/stepper/dist/metadata.json

+36-28
Original file line numberDiff line numberDiff line change
@@ -6,48 +6,68 @@
66
".spectrum-Stepper--quiet.hide-stepper .spectrum-Stepper-input",
77
".spectrum-Stepper--quiet.is-keyboardFocused:not(.is-disabled)",
88
".spectrum-Stepper--quiet:after",
9+
".spectrum-Stepper--quiet:not(.is-disabled):focus-visible",
910
".spectrum-Stepper-button",
1011
".spectrum-Stepper-buttons",
1112
".spectrum-Stepper-input",
1213
".spectrum-Stepper.hide-stepper .spectrum-Stepper-input",
1314
".spectrum-Stepper.is-disabled",
15+
".spectrum-Stepper.is-focused",
16+
".spectrum-Stepper.is-focused.is-hover",
17+
".spectrum-Stepper.is-focused:hover",
1418
".spectrum-Stepper.is-focused:not(.is-disabled)",
1519
".spectrum-Stepper.is-focused:not(.is-disabled):hover",
20+
".spectrum-Stepper.is-hover:focus",
21+
".spectrum-Stepper.is-hover:focus-visible",
22+
".spectrum-Stepper.is-hover:not(.is-disabled)",
1623
".spectrum-Stepper.is-invalid",
1724
".spectrum-Stepper.is-invalid.is-focused",
25+
".spectrum-Stepper.is-invalid.is-focused.is-hover",
1826
".spectrum-Stepper.is-invalid.is-focused:hover",
27+
".spectrum-Stepper.is-invalid.is-hover:focus",
1928
".spectrum-Stepper.is-invalid.is-keyboardFocused",
29+
".spectrum-Stepper.is-invalid.is-keyboardFocused:hover",
2030
".spectrum-Stepper.is-invalid:focus",
2131
".spectrum-Stepper.is-invalid:focus-visible",
32+
".spectrum-Stepper.is-invalid:focus-visible:hover",
2233
".spectrum-Stepper.is-invalid:focus:hover",
23-
".spectrum-Stepper.is-invalid:hover",
34+
".spectrum-Stepper.is-keyboardFocused",
35+
".spectrum-Stepper.is-keyboardFocused.is-hover",
36+
".spectrum-Stepper.is-keyboardFocused:hover",
2437
".spectrum-Stepper.is-keyboardFocused:not(.is-disabled)",
2538
".spectrum-Stepper.spectrum-Stepper--quiet",
26-
".spectrum-Stepper.spectrum-Stepper--quiet.is-focused:not(.is-disabled)",
27-
".spectrum-Stepper.spectrum-Stepper--quiet.is-focused:not(.is-disabled):hover",
39+
".spectrum-Stepper.spectrum-Stepper--quiet.is-disabled",
40+
".spectrum-Stepper.spectrum-Stepper--quiet.is-focused",
41+
".spectrum-Stepper.spectrum-Stepper--quiet.is-focused:hover",
2842
".spectrum-Stepper.spectrum-Stepper--quiet.is-invalid",
43+
".spectrum-Stepper.spectrum-Stepper--quiet.is-keyboardFocused",
44+
".spectrum-Stepper.spectrum-Stepper--quiet.is-keyboardFocused:hover",
2945
".spectrum-Stepper.spectrum-Stepper--quiet.is-keyboardFocused:not(.is-disabled)",
30-
".spectrum-Stepper.spectrum-Stepper--quiet.is-keyboardFocused:not(.is-disabled):hover",
31-
".spectrum-Stepper.spectrum-Stepper--quiet:not(.is-disabled):focus",
32-
".spectrum-Stepper.spectrum-Stepper--quiet:not(.is-disabled):focus:hover",
46+
".spectrum-Stepper.spectrum-Stepper--quiet:focus",
47+
".spectrum-Stepper.spectrum-Stepper--quiet:focus-visible",
48+
".spectrum-Stepper.spectrum-Stepper--quiet:focus-visible:hover",
49+
".spectrum-Stepper.spectrum-Stepper--quiet:focus:hover",
3350
".spectrum-Stepper.spectrum-Stepper--quiet:not(.is-disabled):hover",
3451
".spectrum-Stepper.spectrum-Stepper--sizeL",
3552
".spectrum-Stepper.spectrum-Stepper--sizeM",
3653
".spectrum-Stepper.spectrum-Stepper--sizeS",
3754
".spectrum-Stepper.spectrum-Stepper--sizeXL",
3855
".spectrum-Stepper:before",
39-
".spectrum-Stepper:hover:not(.is-invalid, .is-disabled, .is-focused)",
40-
".spectrum-Stepper:not(.is-disabled) .is-focused",
41-
".spectrum-Stepper:not(.is-disabled) .is-focused:hover",
56+
".spectrum-Stepper:focus",
57+
".spectrum-Stepper:focus-visible",
58+
".spectrum-Stepper:focus-visible:hover",
59+
".spectrum-Stepper:focus:hover",
4260
".spectrum-Stepper:not(.is-disabled):focus",
4361
".spectrum-Stepper:not(.is-disabled):focus-visible",
4462
".spectrum-Stepper:not(.is-disabled):focus:hover",
4563
".spectrum-Stepper:not(.is-disabled):hover",
4664
".spectrum-Stepper:not(.spectrum-Stepper--quiet)"
4765
],
4866
"modifiers": [
67+
"--mod-spectrum-stepper-border-color",
4968
"--mod-stepper-animation-duration",
5069
"--mod-stepper-border-color",
70+
"--mod-stepper-border-color-disabled",
5171
"--mod-stepper-border-color-focus",
5272
"--mod-stepper-border-color-focus-hover",
5373
"--mod-stepper-border-color-focus-hover-invalid",
@@ -64,10 +84,6 @@
6484
"--mod-stepper-button-width-quiet",
6585
"--mod-stepper-buttons-background-color",
6686
"--mod-stepper-buttons-border-color",
67-
"--mod-stepper-buttons-border-color-focus",
68-
"--mod-stepper-buttons-border-color-focus-hover",
69-
"--mod-stepper-buttons-border-color-hover",
70-
"--mod-stepper-buttons-border-color-keyboard-focus",
7187
"--mod-stepper-buttons-border-style",
7288
"--mod-stepper-buttons-border-width",
7389
"--mod-stepper-focus-indicator-color",
@@ -88,6 +104,7 @@
88104
"--spectrum-stepper-border-color-focus-hover-invalid",
89105
"--spectrum-stepper-border-color-focus-invalid",
90106
"--spectrum-stepper-border-color-hover",
107+
"--spectrum-stepper-border-color-hover-invalid",
91108
"--spectrum-stepper-border-color-invalid",
92109
"--spectrum-stepper-border-color-keyboard-focus",
93110
"--spectrum-stepper-border-color-keyboard-focus-invalid",
@@ -99,11 +116,6 @@
99116
"--spectrum-stepper-button-width",
100117
"--spectrum-stepper-buttons-background-color",
101118
"--spectrum-stepper-buttons-background-color-disabled",
102-
"--spectrum-stepper-buttons-border-color",
103-
"--spectrum-stepper-buttons-border-color-focus",
104-
"--spectrum-stepper-buttons-border-color-focus-hover",
105-
"--spectrum-stepper-buttons-border-color-hover",
106-
"--spectrum-stepper-buttons-border-color-keyboard-focus",
107119
"--spectrum-stepper-buttons-border-style",
108120
"--spectrum-stepper-buttons-border-width",
109121
"--spectrum-stepper-focus-indicator-color",
@@ -121,11 +133,9 @@
121133
"--spectrum-component-height-300",
122134
"--spectrum-component-height-75",
123135
"--spectrum-corner-radius-100",
124-
"--spectrum-disabled-border-color",
125136
"--spectrum-focus-indicator-color",
126137
"--spectrum-focus-indicator-gap",
127138
"--spectrum-focus-indicator-thickness",
128-
"--spectrum-gray-100",
129139
"--spectrum-gray-300",
130140
"--spectrum-gray-50",
131141
"--spectrum-gray-500",
@@ -151,22 +161,16 @@
151161
"--system-stepper-border-color-focus-hover-invalid",
152162
"--system-stepper-border-color-focus-invalid",
153163
"--system-stepper-border-color-hover",
164+
"--system-stepper-border-color-hover-invalid",
154165
"--system-stepper-border-color-invalid",
155166
"--system-stepper-border-color-keyboard-focus",
156167
"--system-stepper-border-color-keyboard-focus-invalid",
157168
"--system-stepper-border-width",
158169
"--system-stepper-button-border-width",
159170
"--system-stepper-button-border-width-disabled",
160-
"--system-stepper-buttons-background-color",
161171
"--system-stepper-buttons-background-color-disabled",
162-
"--system-stepper-buttons-border-color",
163-
"--system-stepper-buttons-border-color-focus",
164-
"--system-stepper-buttons-border-color-hover",
165-
"--system-stepper-buttons-border-color-keyboard-focus",
166172
"--system-stepper-buttons-border-style",
167-
"--system-stepper-buttons-border-width",
168-
"--system-stepper-quiet-button-edge-to-fill",
169-
"--system-stepper-quiet-buttons-border-style"
173+
"--system-stepper-buttons-border-width"
170174
],
171175
"passthroughs": [
172176
"--mod-infield-button-border-block-end-width",
@@ -184,7 +188,11 @@
184188
"--mod-textfield-background-color",
185189
"--mod-textfield-border-color",
186190
"--mod-textfield-border-color-disabled",
191+
"--mod-textfield-border-color-focus",
187192
"--mod-textfield-border-color-hover",
193+
"--mod-textfield-border-color-invalid-focus",
194+
"--mod-textfield-border-color-invalid-hover",
195+
"--mod-textfield-border-color-keyboard-focus",
188196
"--mod-textfield-border-width",
189197
"--mod-textfield-focus-indicator-color",
190198
"--mod-textfield-focus-indicator-width",

‎components/stepper/index.css

+57-63
Original file line numberDiff line numberDiff line change
@@ -116,23 +116,30 @@
116116
--mod-stepper-border-color-keyboard-focus: var(--mod-stepper-border-color-keyboard-focus-invalid, var(--spectrum-negative-border-color-key-focus));
117117
}
118118

119+
&:not(.is-disabled).is-hover,
119120
&:not(.is-disabled):hover {
120121
--mod-stepper-border-color: var(--highcontrast-stepper-border-color-hover, var(--mod-stepper-border-color-hover, var(--spectrum-stepper-border-color-hover)));
121122
}
122123

123-
&:not(.is-disabled).is-focused,
124-
&:not(.is-disabled):focus {
124+
&.is-focused,
125+
&:focus {
125126
--mod-stepper-border-color: var(--highcontrast-stepper-border-color-focus, var(--mod-stepper-border-color-focus, var(--spectrum-stepper-border-color-focus)));
126-
--mod-stepper-buttons-border-color: var(--highcontrast-stepper-border-color-focus, var(--mod-stepper-border-color-focus, var(--spectrum-stepper-border-color-focus)));
127127

128+
&.is-hover,
128129
&:hover {
129130
--mod-stepper-border-color: var(--highcontrast-stepper-border-color-focus-hover, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
130131
--mod-stepper-buttons-border-color: var(--highcontrast-stepper-border-color-focus-hover, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
131132
}
132133
}
133134

134-
&:not(.is-disabled).is-keyboardFocused {
135+
&.is-keyboardFocused,
136+
&:focus-visible {
135137
--mod-stepper-border-color: var(--highcontrast-stepper-border-color-focus, var(--mod-stepper-border-color-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
138+
139+
&.is-hover,
140+
&:hover {
141+
--mod-stepper-border-color: var(--highcontrast-stepper-border-color-focus-hover, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
142+
}
136143
}
137144

138145
&.spectrum-Stepper--quiet {
@@ -151,76 +158,64 @@
151158
}
152159

153160
&.is-invalid {
154-
--mod-stepper-border-color: var(--mod-stepper-border-color-invalid, var(--spectrum-negative-border-color-default));
161+
--mod-stepper-border-color: var(--mod-stepper-border-color-invalid, var(--spectrum-stepper-border-color-invalid));
155162
}
156163
}
157164
}
158165

159166
/* --- Component-level passthroughs for nested components --- */
160167
/* @passthrough start -- MODS for sub components */
161168
.spectrum-Stepper {
162-
--mod-infield-button-border-color: var(--mod-stepper-buttons-border-color, var(--spectrum-stepper-buttons-border-color));
163-
--mod-infield-button-border-color-quiet-disabled: var(--spectrum-disabled-border-color);
169+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color, var(--spectrum-stepper-border-color)));
164170
--mod-infield-button-border-width: var(--mod-stepper-button-border-width, var(--spectrum-stepper-button-border-width));
165171

166172
--mod-textfield-border-width: var(--mod-stepper-border-width, var(--spectrum-stepper-border-width));
167-
--mod-textfield-border-color: var(--spectrum-stepper-border-color);
173+
--mod-textfield-border-color: var(--mod-stepper-border-color, var(--spectrum-stepper-border-color));
174+
--mod-textfield-border-color-hover: var(--mod-stepper-border-color, var(--spectrum-stepper-border-color-hover));
175+
--mod-textfield-border-color-focus: var(--mod-stepper-border-color, var(--spectrum-stepper-border-color-focus));
176+
--mod-textfield-border-color-keyboard-focus: var(--mod-stepper-border-color, var(--spectrum-stepper-border-color-keyboard-focus));
168177

169178
&:not(.spectrum-Stepper--quiet) {
170179
--mod-textfield-border-color-disabled: var(--spectrum-stepper-border-color-disabled);
171180
}
172181

173-
&:hover:not(.is-invalid, .is-disabled, .is-focused) {
174-
--mod-infield-button-border-color: var(--mod-stepper-buttons-border-color-hover, var(--spectrum-stepper-buttons-border-color-hover));
175-
}
176-
177-
&:not(.is-disabled) {
178-
.is-focused,
179-
&:focus {
180-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color-focus, var(--mod-stepper-buttons-border-color-focus, var(--spectrum-stepper-buttons-border-color-focus)));
181-
--mod-textfield-focus-indicator-width: 0;
182-
183-
&:hover {
184-
/* stylelint-disable-next-line spectrum-tools/no-unknown-custom-properties -- allows for --spectrum-stepper-buttons-border-color-focus-hover to be defined outside of current context */
185-
--mod-infield-button-border-color: var(--mod-stepper-buttons-border-color-focus-hover, var(--spectrum-stepper-buttons-border-color-focus-hover));
186-
--mod-textfield-focus-indicator-width: 0;
187-
--mod-textfield-border-color: var(--highcontrast-stepper-border-color-focus-hover, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
188-
}
189-
}
182+
&:not(.is-disabled).is-keyboardFocused,
183+
&:focus-visible {
184+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color-keyboard-focus, var(--mod-stepper-border-color-keyboard-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
185+
--mod-textfield-focus-indicator-width: 0;
186+
--mod-textfield-border-color: var(--highcontrast-stepper-border-color-keyboard-focus, var(--mod-stepper-border-color-keyboard-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
190187

191-
&.is-keyboardFocused,
192-
&:focus-visible {
193-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color-keyboard-focus, var(--mod-stepper-buttons-border-color-keyboard-focus, var(--spectrum-stepper-buttons-border-color-keyboard-focus)));
194-
--mod-textfield-focus-indicator-width: 0;
195-
--mod-textfield-border-color: var(--highcontrast-stepper-border-color-keyboard-focus, var(--mod-stepper-border-color-keyboard-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
196-
197-
/* keyboard focus indicator is visible */
198-
outline: var(--spectrum-stepper-focus-indicator-width) solid;
199-
outline-color: var(--spectrum-stepper-focus-indicator-color);
200-
outline-offset: var(--spectrum-stepper-focus-indicator-gap);
201-
}
188+
/* keyboard focus indicator is visible */
189+
outline: var(--spectrum-stepper-focus-indicator-width) solid;
190+
outline-color: var(--spectrum-stepper-focus-indicator-color);
191+
outline-offset: var(--spectrum-stepper-focus-indicator-gap);
202192
}
203193

204194
&.is-invalid {
205-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-invalid, var(--spectrum-stepper-border-color-invalid)));
195+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color, var(--spectrum-stepper-border-color-invalid)));
206196
--mod-textfield-icon-spacing-inline-start-invalid: 0;
207-
208-
&:hover {
209-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-hover-invalid, var(--spectrum-negative-border-color-hover)));
210-
}
197+
--mod-textfield-border-color-invalid-focus: var(--mod-spectrum-stepper-border-color);
211198

212199
&.is-focused,
213200
&:focus {
214-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-invalid, var(--spectrum-stepper-border-color-focus-invalid)));
201+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color, var(--spectrum-stepper-border-color-focus-invalid)));
215202

203+
&.is-hover,
216204
&:hover {
217205
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover-invalid, var(--spectrum-stepper-border-color-focus-hover-invalid)));
206+
--mod-textfield-border-color-invalid-hover: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover-invalid, var(--spectrum-stepper-border-color-focus-hover-invalid)));
218207
}
219208
}
220209

221210
&.is-keyboardFocused,
222211
&:focus-visible {
223212
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-keyboard-focus-invalid, var(--spectrum-stepper-border-color-keyboard-focus-invalid)));
213+
--mod-textfield-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-keyboard-focus-invalid, var(--spectrum-stepper-border-color-keyboard-focus-invalid)));
214+
215+
&:hover {
216+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover-invalid, var(--spectrum-stepper-border-color-focus-hover-invalid)));
217+
--mod-textfield-border-color-invalid-hover: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover-invalid, var(--spectrum-stepper-border-color-focus-hover-invalid)));
218+
}
224219
}
225220
}
226221

@@ -240,30 +235,28 @@
240235
--mod-textfield-background-color: transparent;
241236
--mod-textfield-border-color-hover: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-hover, var(--spectrum-stepper-border-color-hover)));
242237

243-
&:not(.is-disabled) {
244-
&:hover {
245-
--mod-textfield-border-color-hover: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-hover, var(--spectrum-stepper-border-color-hover)));
246-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-hover, var(--spectrum-stepper-border-color-hover)));
247-
}
238+
&.is-disabled {
239+
--mod-infield-button-border-color-quiet-disabled: var(--mod-stepper-border-color-disabled, var(--spectrum-stepper-border-color-disabled));
240+
}
248241

249-
/* quiet focus */
250-
&.is-focused,
251-
&:focus {
252-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus, var(--spectrum-stepper-border-color-focus)));
242+
/* quiet focus */
243+
&.is-focused,
244+
&:focus {
245+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus, var(--spectrum-stepper-border-color-focus)));
253246

254-
/* stylelint-disable-next-line max-nesting-depth -- @todo reduce complexity of selectors */
255-
&:hover {
256-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
257-
}
247+
&:hover {
248+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
258249
}
250+
}
259251

260-
&.is-keyboardFocused {
261-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-keyboard-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
252+
&.is-keyboardFocused,
253+
&:focus-visible {
254+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-keyboard-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
255+
--mod-textfield-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-keyboard-focus, var(--spectrum-stepper-border-color-keyboard-focus)));
262256

263-
/* stylelint-disable-next-line max-nesting-depth -- @todo reduce complexity of selectors */
264-
&:hover {
265-
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-hover, var(--spectrum-stepper-border-color-hover)));
266-
}
257+
&:hover {
258+
--mod-infield-button-border-color: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
259+
--mod-textfield-border-color-hover: var(--highcontrast-stepper-border-color, var(--mod-stepper-border-color-focus-hover, var(--spectrum-stepper-border-color-focus-hover)));
267260
}
268261
}
269262
}
@@ -305,7 +298,7 @@
305298
block-size: var(--spectrum-stepper-height);
306299
inline-size: var(--spectrum-stepper-button-width);
307300

308-
border-color: var(--spectrum-stepper-border-color);
301+
border-color: var(--mod-stepper-border-color, var(--spectrum-stepper-border-color));
309302
border-style: var(--mod-stepper-buttons-border-style, var(--spectrum-stepper-buttons-border-style));
310303
border-width: var(--highcontrast-stepper-buttons-border-width, var(--mod-stepper-buttons-border-width, var(--spectrum-stepper-buttons-border-width)));
311304
border-inline-start-width: 0;
@@ -352,7 +345,8 @@
352345
}
353346

354347
/* quiet hover */
355-
&.is-keyboardFocused:not(.is-disabled) {
348+
&:not(.is-disabled).is-keyboardFocused,
349+
&:not(.is-disabled):focus-visible {
356350
outline: none;
357351
}
358352
}

‎components/stepper/stories/stepper.test.js

+5
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,11 @@ export const StepperGroup = Variants({
4747
testHeading: "Keyboard-focused",
4848
isKeyboardFocused: true,
4949
},
50+
{
51+
testHeading: "Keyboard-focused + hovered",
52+
isKeyboardFocused: true,
53+
isHovered: true,
54+
},
5055
{
5156
testHeading: "Disabled + hovered",
5257
isDisabled: true,

0 commit comments

Comments
 (0)