@spectrum-web-components/action-group 0.31.1-react.3 → 0.32.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +129 -2
- package/custom-elements.json +13 -4
- package/package.json +7 -6
- package/src/ActionGroup.dev.js +13 -7
- package/src/ActionGroup.dev.js.map +2 -2
- package/src/ActionGroup.js +1 -1
- package/src/ActionGroup.js.map +2 -2
- package/test/action-group.test.js +56 -2
- package/test/action-group.test.js.map +2 -2
package/README.md
CHANGED
|
@@ -92,7 +92,7 @@ When a selection can be made, it is a good idea to supply the group of options w
|
|
|
92
92
|
|
|
93
93
|
### Single
|
|
94
94
|
|
|
95
|
-
An `<sp-action-group selects="single">` will manage its `<sp-action-button>` children as "radio buttons" allowing the user to select a _single_ one of the buttons presented. The `<sp-action-button>` children will only be able to turn their `selected` value on while maintaining a single selection after an
|
|
95
|
+
An `<sp-action-group selects="single">` will manage its `<sp-action-button>` children as "radio buttons" allowing the user to select a _single_ one of the buttons presented. The `<sp-action-button>` children will only be able to turn their `selected` value on while maintaining a single selection after an initial selection is made.
|
|
96
96
|
|
|
97
97
|
```html
|
|
98
98
|
<sp-action-group
|
|
@@ -117,7 +117,7 @@ An `<sp-action-group selects="single">` will manage its `<sp-action-button>` chi
|
|
|
117
117
|
|
|
118
118
|
### Multiple
|
|
119
119
|
|
|
120
|
-
An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` children as "
|
|
120
|
+
An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` children as "checkboxes" allowing the user to select a _multiple_ of the buttons presented. The `<sp-action-button>` children will toggle their `selected` value on and off when clicked successively.
|
|
121
121
|
|
|
122
122
|
```html
|
|
123
123
|
<sp-action-group
|
|
@@ -349,3 +349,130 @@ The `justified` attribute will cause the `<sp-action-group>` element to fill the
|
|
|
349
349
|
</sp-action-button>
|
|
350
350
|
</sp-action-group>
|
|
351
351
|
```
|
|
352
|
+
|
|
353
|
+
## Accessibility
|
|
354
|
+
|
|
355
|
+
The accessibility `role` for an `<sp-action-group>` element depends on the manner in which items are selected. By default, `<sp-action-group selects="single">` will have `role="radiogroup"`, because it manages its children as a "radio group", while `<sp-action-group>` or `<sp-action-group selects="multiple">` will have `role="toolbar"`, which makes sense for a group of buttons or checkboxes between which one can navigate using the arrow keys.
|
|
356
|
+
|
|
357
|
+
When more than one `<sp-action-group>` elements are combined together with in a toolbar, the `role` attribute for `<sp-action-group>` or `<sp-action-group selects="multiple">` should be overwritten using `role="group"` or `role="presentation"`, so that toolbars are not nested, as demonstrated in the following example of a hypothetical toolbar for formatting text within a rich text editor:
|
|
358
|
+
|
|
359
|
+
<script type="module">
|
|
360
|
+
import '@spectrum-web-components/divider/sp-divider.js';
|
|
361
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-bold.js';
|
|
362
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-italic.js';
|
|
363
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-underline.js';
|
|
364
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-align-left.js';
|
|
365
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-align-center.js';
|
|
366
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-align-justify.js';
|
|
367
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-align-right.js';
|
|
368
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-bulleted.js';
|
|
369
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-text-numbered.js';
|
|
370
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-copy.js';
|
|
371
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-paste.js';
|
|
372
|
+
import '@spectrum-web-components/icons-workflow/icons/sp-icon-cut.js';
|
|
373
|
+
</script>
|
|
374
|
+
|
|
375
|
+
```html
|
|
376
|
+
<div
|
|
377
|
+
aria-label="Text Formatting"
|
|
378
|
+
role="toolbar"
|
|
379
|
+
style="height: 32px; display: flex; gap: 6px"
|
|
380
|
+
>
|
|
381
|
+
<sp-action-group
|
|
382
|
+
aria-label="Text Style"
|
|
383
|
+
selects="multiple"
|
|
384
|
+
role="group"
|
|
385
|
+
compact
|
|
386
|
+
emphasized
|
|
387
|
+
>
|
|
388
|
+
<sp-action-button label="Bold" value="bold">
|
|
389
|
+
<sp-icon-text-bold slot="icon"></sp-icon-text-bold>
|
|
390
|
+
</sp-action-button>
|
|
391
|
+
<sp-action-button label="Italic" value="italic">
|
|
392
|
+
<sp-icon-text-italic slot="icon"></sp-icon-text-italic>
|
|
393
|
+
</sp-action-button>
|
|
394
|
+
<sp-action-button label="Underline" value="underline">
|
|
395
|
+
<sp-icon-text-underline slot="icon"></sp-icon-text-underline>
|
|
396
|
+
</sp-action-button>
|
|
397
|
+
</sp-action-group>
|
|
398
|
+
<sp-divider
|
|
399
|
+
size="s"
|
|
400
|
+
style="align-self: stretch; height: auto;"
|
|
401
|
+
vertical
|
|
402
|
+
></sp-divider>
|
|
403
|
+
<sp-action-group
|
|
404
|
+
aria-label="Text Align"
|
|
405
|
+
selects="single"
|
|
406
|
+
compact
|
|
407
|
+
emphasized
|
|
408
|
+
>
|
|
409
|
+
<sp-action-button label="Left" value="left" selected>
|
|
410
|
+
<sp-icon-text-align-left slot="icon"></sp-icon-text-align-left>
|
|
411
|
+
</sp-action-button>
|
|
412
|
+
<sp-action-button label="Center" value="center">
|
|
413
|
+
<sp-icon-text-align-center slot="icon"></sp-icon-text-align-center>
|
|
414
|
+
</sp-action-button>
|
|
415
|
+
<sp-action-button label="Right" value="right">
|
|
416
|
+
<sp-icon-text-align-right slot="icon"></sp-icon-text-align-right>
|
|
417
|
+
</sp-action-button>
|
|
418
|
+
<sp-action-button label="Justify" value="justify">
|
|
419
|
+
<sp-icon-text-align-justify
|
|
420
|
+
slot="icon"
|
|
421
|
+
></sp-icon-text-align-justify>
|
|
422
|
+
</sp-action-button>
|
|
423
|
+
</sp-action-group>
|
|
424
|
+
<sp-divider
|
|
425
|
+
size="s"
|
|
426
|
+
style="align-self: stretch; height: auto;"
|
|
427
|
+
vertical
|
|
428
|
+
></sp-divider>
|
|
429
|
+
<sp-action-group
|
|
430
|
+
aria-label="List Style"
|
|
431
|
+
selects="multiple"
|
|
432
|
+
role="group"
|
|
433
|
+
compact
|
|
434
|
+
emphasized
|
|
435
|
+
>
|
|
436
|
+
<sp-action-button
|
|
437
|
+
label="Bulleted"
|
|
438
|
+
value="bulleted"
|
|
439
|
+
onclick="
|
|
440
|
+
/* makes mutually exclusive checkbox */
|
|
441
|
+
this.selected &&
|
|
442
|
+
requestAnimationFrame(() => this.parentElement.selected = []);
|
|
443
|
+
this.parentElement.selected = [];
|
|
444
|
+
"
|
|
445
|
+
>
|
|
446
|
+
<sp-icon-text-bulleted slot="icon"></sp-icon-text-bulleted>
|
|
447
|
+
</sp-action-button>
|
|
448
|
+
<sp-action-button
|
|
449
|
+
label="Numbering"
|
|
450
|
+
value="numbering"
|
|
451
|
+
onclick="
|
|
452
|
+
/* makes mutually exclusive checkbox */
|
|
453
|
+
this.selected &&
|
|
454
|
+
requestAnimationFrame(() => this.parentElement.selected = []);
|
|
455
|
+
this.parentElement.selected = [];
|
|
456
|
+
"
|
|
457
|
+
>
|
|
458
|
+
<sp-icon-text-numbered slot="icon"></sp-icon-text-numbered>
|
|
459
|
+
</sp-action-button>
|
|
460
|
+
</sp-action-group>
|
|
461
|
+
<sp-divider
|
|
462
|
+
size="s"
|
|
463
|
+
style="align-self: stretch; height: auto;"
|
|
464
|
+
vertical
|
|
465
|
+
></sp-divider>
|
|
466
|
+
<sp-action-group role="presentation" compact>
|
|
467
|
+
<sp-action-button disabled label="Copy" value="copy">
|
|
468
|
+
<sp-icon-copy slot="icon"></sp-icon-copy>
|
|
469
|
+
</sp-action-button>
|
|
470
|
+
<sp-action-button disabled label="Paste" value="paste">
|
|
471
|
+
<sp-icon-paste slot="icon"></sp-icon-paste>
|
|
472
|
+
</sp-action-button>
|
|
473
|
+
<sp-action-button disabled label="Cut" value="cut">
|
|
474
|
+
<sp-icon-cut slot="icon"></sp-icon-cut>
|
|
475
|
+
</sp-action-button>
|
|
476
|
+
</sp-action-group>
|
|
477
|
+
</div>
|
|
478
|
+
```
|
package/custom-elements.json
CHANGED
|
@@ -4,13 +4,22 @@
|
|
|
4
4
|
"modules": [
|
|
5
5
|
{
|
|
6
6
|
"kind": "javascript-module",
|
|
7
|
-
"path": "sp-action-group.
|
|
7
|
+
"path": "sp-action-group.js",
|
|
8
8
|
"declarations": [],
|
|
9
|
-
"exports": [
|
|
9
|
+
"exports": [
|
|
10
|
+
{
|
|
11
|
+
"kind": "custom-element-definition",
|
|
12
|
+
"name": "sp-action-group",
|
|
13
|
+
"declaration": {
|
|
14
|
+
"name": "ActionGroup",
|
|
15
|
+
"module": "/src/ActionGroup.js"
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
]
|
|
10
19
|
},
|
|
11
20
|
{
|
|
12
21
|
"kind": "javascript-module",
|
|
13
|
-
"path": "src/ActionGroup.
|
|
22
|
+
"path": "src/ActionGroup.js",
|
|
14
23
|
"declarations": [
|
|
15
24
|
{
|
|
16
25
|
"kind": "class",
|
|
@@ -373,7 +382,7 @@
|
|
|
373
382
|
"name": "ActionGroup",
|
|
374
383
|
"declaration": {
|
|
375
384
|
"name": "ActionGroup",
|
|
376
|
-
"module": "src/ActionGroup.
|
|
385
|
+
"module": "src/ActionGroup.js"
|
|
377
386
|
}
|
|
378
387
|
}
|
|
379
388
|
]
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/action-group",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.32.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -58,12 +58,13 @@
|
|
|
58
58
|
],
|
|
59
59
|
"dependencies": {
|
|
60
60
|
"@lit-labs/observers": "^2.0.0",
|
|
61
|
-
"@spectrum-web-components/action-button": "^0.
|
|
62
|
-
"@spectrum-web-components/base": "^0.
|
|
63
|
-
"@spectrum-web-components/
|
|
61
|
+
"@spectrum-web-components/action-button": "^0.32.0",
|
|
62
|
+
"@spectrum-web-components/base": "^0.32.0",
|
|
63
|
+
"@spectrum-web-components/icons-workflow": "^0.32.0",
|
|
64
|
+
"@spectrum-web-components/reactive-controllers": "^0.32.0"
|
|
64
65
|
},
|
|
65
66
|
"devDependencies": {
|
|
66
|
-
"@spectrum-css/actiongroup": "^3.0.
|
|
67
|
+
"@spectrum-css/actiongroup": "^3.0.44"
|
|
67
68
|
},
|
|
68
69
|
"types": "./src/index.d.ts",
|
|
69
70
|
"customElements": "custom-elements.json",
|
|
@@ -71,5 +72,5 @@
|
|
|
71
72
|
"./sp-*.js",
|
|
72
73
|
"./**/*.dev.js"
|
|
73
74
|
],
|
|
74
|
-
"gitHead": "
|
|
75
|
+
"gitHead": "c5f67662ac54d0e37debaf7cbd7c2df60e8b294e"
|
|
75
76
|
}
|
package/src/ActionGroup.dev.js
CHANGED
|
@@ -146,7 +146,10 @@ export class ActionGroup extends SizedMixin(SpectrumElement, {
|
|
|
146
146
|
selected.forEach((el) => {
|
|
147
147
|
el.selected = false;
|
|
148
148
|
el.tabIndex = -1;
|
|
149
|
-
el.setAttribute(
|
|
149
|
+
el.setAttribute(
|
|
150
|
+
!this.selects ? "aria-pressed" : "aria-checked",
|
|
151
|
+
"false"
|
|
152
|
+
);
|
|
150
153
|
});
|
|
151
154
|
}
|
|
152
155
|
handleClick(event) {
|
|
@@ -220,7 +223,9 @@ export class ActionGroup extends SizedMixin(SpectrumElement, {
|
|
|
220
223
|
break;
|
|
221
224
|
}
|
|
222
225
|
case "multiple": {
|
|
223
|
-
this.
|
|
226
|
+
if (this.getAttribute("role") === "radiogroup") {
|
|
227
|
+
this.removeAttribute("role");
|
|
228
|
+
}
|
|
224
229
|
const selection = [];
|
|
225
230
|
const selections = [];
|
|
226
231
|
const updates = options.map(async (option) => {
|
|
@@ -247,13 +252,12 @@ export class ActionGroup extends SizedMixin(SpectrumElement, {
|
|
|
247
252
|
const selections = [];
|
|
248
253
|
const updates = options.map(async (option) => {
|
|
249
254
|
await option.updateComplete;
|
|
250
|
-
option.setAttribute(
|
|
251
|
-
"aria-checked",
|
|
252
|
-
option.selected ? "true" : "false"
|
|
253
|
-
);
|
|
254
255
|
option.setAttribute("role", "button");
|
|
255
256
|
if (option.selected) {
|
|
257
|
+
option.setAttribute("aria-pressed", "true");
|
|
256
258
|
selections.push(option);
|
|
259
|
+
} else {
|
|
260
|
+
option.removeAttribute("aria-pressed");
|
|
257
261
|
}
|
|
258
262
|
});
|
|
259
263
|
if (applied)
|
|
@@ -268,10 +272,12 @@ export class ActionGroup extends SizedMixin(SpectrumElement, {
|
|
|
268
272
|
this.buttons.forEach((option) => {
|
|
269
273
|
option.setAttribute("role", "button");
|
|
270
274
|
});
|
|
271
|
-
this.removeAttribute("role");
|
|
272
275
|
break;
|
|
273
276
|
}
|
|
274
277
|
}
|
|
278
|
+
if (!this.hasAttribute("role")) {
|
|
279
|
+
this.setAttribute("role", "toolbar");
|
|
280
|
+
}
|
|
275
281
|
}
|
|
276
282
|
render() {
|
|
277
283
|
return html`
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["ActionGroup.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport type { ActionButton } from '@spectrum-web-components/action-button';\nimport { RovingTabindexController } from '@spectrum-web-components/reactive-controllers/src/RovingTabindex.js';\nimport { MutationController } from '@lit-labs/observers/mutation-controller.js';\n\nimport styles from './action-group.css.js';\n\nconst EMPTY_SELECTION: string[] = [];\n\n/**\n * @element sp-action-group\n * @slot - the sp-action-button elements that make up the group\n *\n * @fires change - Announces that selection state has been changed by user\n */\nexport class ActionGroup extends SizedMixin(SpectrumElement, {\n validSizes: ['xs', 's', 'm', 'l', 'xl'],\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n public set buttons(tabs: ActionButton[]) {\n if (tabs === this.buttons) return;\n this._buttons = tabs;\n this.rovingTabindexController.clearElementCache();\n }\n\n public get buttons(): ActionButton[] {\n return this._buttons;\n }\n\n public _buttons: ActionButton[] = [];\n\n protected _buttonSelector = 'sp-action-button';\n\n constructor() {\n super();\n\n new MutationController(this, {\n config: {\n childList: true,\n subtree: true,\n },\n callback: () => {\n this.manageButtons();\n },\n });\n }\n\n rovingTabindexController = new RovingTabindexController<ActionButton>(\n this,\n {\n focusInIndex: (elements: ActionButton[]) => {\n let firstEnabledIndex = -1;\n const firstSelectedIndex = elements.findIndex((el, index) => {\n if (!elements[firstEnabledIndex] && !el.disabled) {\n firstEnabledIndex = index;\n }\n return el.selected && !el.disabled;\n });\n return elements[firstSelectedIndex]\n ? firstSelectedIndex\n : firstEnabledIndex;\n },\n elements: () => this.buttons,\n isFocusableElement: (el: ActionButton) => !el.disabled,\n }\n );\n\n @property({ type: Boolean, reflect: true })\n public compact = false;\n\n @property({ type: Boolean, reflect: true })\n public emphasized = false;\n\n @property({ type: Boolean, reflect: true })\n public justified = false;\n\n @property({ type: String })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public selects: undefined | 'single' | 'multiple';\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n private _selected: string[] = EMPTY_SELECTION;\n\n set selected(selected: string[]) {\n this.requestUpdate('selected', this._selected);\n this._selected = selected;\n this.updateComplete.then(() => {\n this.applySelects();\n this.manageChildren();\n });\n }\n\n @property({ type: Array })\n get selected(): string[] {\n return this._selected;\n }\n\n private dispatchChange(old: string[]): void {\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n\n if (!applyDefault) {\n this.setSelected(old);\n this.buttons.map((button) => {\n button.selected = this.selected.includes(button.value);\n });\n }\n }\n\n private setSelected(selected: string[], announce?: boolean): void {\n if (selected === this.selected) return;\n\n const old = this.selected;\n this.requestUpdate('selected', old);\n this._selected = selected;\n if (!announce) return;\n this.dispatchChange(old);\n }\n\n public override focus(options?: FocusOptions): void {\n this.rovingTabindexController.focus(options);\n }\n\n private deselectSelectedButtons(): void {\n const selected = [\n ...this.querySelectorAll('[selected]'),\n ] as ActionButton[];\n selected.forEach((el) => {\n el.selected = false;\n el.tabIndex = -1;\n el.setAttribute('aria-checked', 'false');\n });\n }\n\n private handleClick(event: Event): void {\n const target = event.target as ActionButton;\n if (typeof target.value === 'undefined') {\n return;\n }\n switch (this.selects) {\n case 'single': {\n this.deselectSelectedButtons();\n target.selected = true;\n target.tabIndex = 0;\n target.setAttribute('aria-checked', 'true');\n this.setSelected([target.value], true);\n target.focus();\n break;\n }\n case 'multiple': {\n const selected = [...this.selected];\n target.selected = !target.selected;\n target.setAttribute(\n 'aria-checked',\n target.selected ? 'true' : 'false'\n );\n if (target.selected) {\n selected.push(target.value);\n } else {\n selected.splice(this.selected.indexOf(target.value), 1);\n }\n this.setSelected(selected, true);\n\n this.buttons.forEach((button) => {\n button.tabIndex = -1;\n });\n\n target.tabIndex = 0;\n\n break;\n }\n default:\n break;\n }\n }\n\n private async applySelects(): Promise<void> {\n await this.manageSelects(true);\n }\n\n private async manageSelects(applied?: boolean): Promise<void> {\n if (!this.buttons.length) {\n return;\n }\n\n const options = this.buttons;\n switch (this.selects) {\n case 'single': {\n this.setAttribute('role', 'radiogroup');\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'radio');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n const selected = selections.map((button) => {\n return button.value;\n });\n\n this.setSelected(selected || EMPTY_SELECTION);\n break;\n }\n case 'multiple': {\n this.setAttribute('role', 'group');\n const selection: string[] = [];\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'checkbox');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selection.push(option.value);\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n const selected = !!selection.length\n ? selection\n : EMPTY_SELECTION;\n this.setSelected(selected);\n break;\n }\n default:\n // if user defines .selected\n if (this.selected.length) {\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n option.setAttribute('role', 'button');\n if (option.selected) {\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n this.setSelected(\n selections.map((button) => {\n return button.value;\n })\n );\n } else {\n this.buttons.forEach((option) => {\n option.setAttribute('role', 'button');\n });\n this.removeAttribute('role');\n break;\n }\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot role=\"presentation\" @slotchange=${this.manageButtons}></slot>\n `;\n }\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('click', this.handleClick);\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('selects')) {\n this.manageSelects();\n this.manageChildren();\n }\n if (\n (changes.has('quiet') && this.quiet) ||\n (changes.has('emphasized') && this.emphasized) ||\n (changes.has('size') && this.size)\n ) {\n this.manageChildren();\n }\n // Update `aria-label` when `label` available or not first `updated`\n if (\n changes.has('label') &&\n (this.label || typeof changes.get('label') !== 'undefined')\n ) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else {\n this.removeAttribute('aria-label');\n }\n }\n }\n\n private manageChildren(): void {\n this.buttons.forEach((button) => {\n button.quiet = this.quiet;\n button.emphasized = this.emphasized;\n button.selected = this.selected.includes(button.value);\n button.size = this.size;\n });\n }\n\n private manageButtons = (): void => {\n const slot = this.shadowRoot.querySelector('slot');\n if (!slot) return;\n const assignedElements = slot.assignedElements({ flatten: true });\n const buttons = assignedElements.reduce((acc: unknown[], el) => {\n if (el.matches(this._buttonSelector)) {\n acc.push(el);\n } else {\n const buttonDescendents = Array.from(\n el.querySelectorAll(`:scope > ${this._buttonSelector}`)\n );\n acc.push(...buttonDescendents);\n }\n return acc;\n }, []);\n this.buttons = buttons as ActionButton[];\n // <selected> element merges selected so following paradigm here\n const currentlySelectedButtons: string[] = [];\n this.buttons.forEach((button: ActionButton) => {\n if (button.selected) {\n currentlySelectedButtons.push(button.value);\n }\n });\n this.setSelected(this.selected.concat(currentlySelectedButtons));\n this.manageChildren();\n this.manageSelects();\n };\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EAEA;AAAA,EACA;AAAA,OAEG;AACP,SAAS,gBAAgB;AAEzB,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AAEnC,OAAO,YAAY;AAEnB,MAAM,kBAA4B,CAAC;AAQ5B,aAAM,oBAAoB,WAAW,iBAAiB;AAAA,EACzD,YAAY,CAAC,MAAM,KAAK,KAAK,KAAK,IAAI;AAC1C,CAAC,EAAE;AAAA,EAmBC,cAAc;AACV,UAAM;AALV,SAAO,WAA2B,CAAC;AAEnC,SAAU,kBAAkB;AAgB5B,oCAA2B,IAAI;AAAA,MAC3B;AAAA,MACA;AAAA,QACI,cAAc,CAAC,aAA6B;AACxC,cAAI,oBAAoB;AACxB,gBAAM,qBAAqB,SAAS,UAAU,CAAC,IAAI,UAAU;AACzD,gBAAI,CAAC,SAAS,iBAAiB,KAAK,CAAC,GAAG,UAAU;AAC9C,kCAAoB;AAAA,YACxB;AACA,mBAAO,GAAG,YAAY,CAAC,GAAG;AAAA,UAC9B,CAAC;AACD,iBAAO,SAAS,kBAAkB,IAC5B,qBACA;AAAA,QACV;AAAA,QACA,UAAU,MAAM,KAAK;AAAA,QACrB,oBAAoB,CAAC,OAAqB,CAAC,GAAG;AAAA,MAClD;AAAA,IACJ;AAGA,SAAO,UAAU;AAGjB,SAAO,aAAa;AAGpB,SAAO,YAAY;AAGnB,SAAO,QAAQ;AAGf,SAAO,QAAQ;AAMf,SAAO,WAAW;AAElB,SAAQ,YAAsB;
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport type { ActionButton } from '@spectrum-web-components/action-button';\nimport { RovingTabindexController } from '@spectrum-web-components/reactive-controllers/src/RovingTabindex.js';\nimport { MutationController } from '@lit-labs/observers/mutation-controller.js';\n\nimport styles from './action-group.css.js';\n\nconst EMPTY_SELECTION: string[] = [];\n\n/**\n * @element sp-action-group\n * @slot - the sp-action-button elements that make up the group\n *\n * @fires change - Announces that selection state has been changed by user\n */\nexport class ActionGroup extends SizedMixin(SpectrumElement, {\n validSizes: ['xs', 's', 'm', 'l', 'xl'],\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n public set buttons(tabs: ActionButton[]) {\n if (tabs === this.buttons) return;\n this._buttons = tabs;\n this.rovingTabindexController.clearElementCache();\n }\n\n public get buttons(): ActionButton[] {\n return this._buttons;\n }\n\n public _buttons: ActionButton[] = [];\n\n protected _buttonSelector = 'sp-action-button';\n\n constructor() {\n super();\n\n new MutationController(this, {\n config: {\n childList: true,\n subtree: true,\n },\n callback: () => {\n this.manageButtons();\n },\n });\n }\n\n rovingTabindexController = new RovingTabindexController<ActionButton>(\n this,\n {\n focusInIndex: (elements: ActionButton[]) => {\n let firstEnabledIndex = -1;\n const firstSelectedIndex = elements.findIndex((el, index) => {\n if (!elements[firstEnabledIndex] && !el.disabled) {\n firstEnabledIndex = index;\n }\n return el.selected && !el.disabled;\n });\n return elements[firstSelectedIndex]\n ? firstSelectedIndex\n : firstEnabledIndex;\n },\n elements: () => this.buttons,\n isFocusableElement: (el: ActionButton) => !el.disabled,\n }\n );\n\n @property({ type: Boolean, reflect: true })\n public compact = false;\n\n @property({ type: Boolean, reflect: true })\n public emphasized = false;\n\n @property({ type: Boolean, reflect: true })\n public justified = false;\n\n @property({ type: String })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public selects: undefined | 'single' | 'multiple';\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n private _selected: string[] = EMPTY_SELECTION;\n\n set selected(selected: string[]) {\n this.requestUpdate('selected', this._selected);\n this._selected = selected;\n this.updateComplete.then(() => {\n this.applySelects();\n this.manageChildren();\n });\n }\n\n @property({ type: Array })\n get selected(): string[] {\n return this._selected;\n }\n\n private dispatchChange(old: string[]): void {\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n\n if (!applyDefault) {\n this.setSelected(old);\n this.buttons.map((button) => {\n button.selected = this.selected.includes(button.value);\n });\n }\n }\n\n private setSelected(selected: string[], announce?: boolean): void {\n if (selected === this.selected) return;\n\n const old = this.selected;\n this.requestUpdate('selected', old);\n this._selected = selected;\n if (!announce) return;\n this.dispatchChange(old);\n }\n\n public override focus(options?: FocusOptions): void {\n this.rovingTabindexController.focus(options);\n }\n\n private deselectSelectedButtons(): void {\n const selected = [\n ...this.querySelectorAll('[selected]'),\n ] as ActionButton[];\n selected.forEach((el) => {\n el.selected = false;\n el.tabIndex = -1;\n el.setAttribute(\n !this.selects ? 'aria-pressed' : 'aria-checked',\n 'false'\n );\n });\n }\n\n private handleClick(event: Event): void {\n const target = event.target as ActionButton;\n if (typeof target.value === 'undefined') {\n return;\n }\n switch (this.selects) {\n case 'single': {\n this.deselectSelectedButtons();\n target.selected = true;\n target.tabIndex = 0;\n target.setAttribute('aria-checked', 'true');\n this.setSelected([target.value], true);\n target.focus();\n break;\n }\n case 'multiple': {\n const selected = [...this.selected];\n target.selected = !target.selected;\n target.setAttribute(\n 'aria-checked',\n target.selected ? 'true' : 'false'\n );\n if (target.selected) {\n selected.push(target.value);\n } else {\n selected.splice(this.selected.indexOf(target.value), 1);\n }\n this.setSelected(selected, true);\n\n this.buttons.forEach((button) => {\n button.tabIndex = -1;\n });\n\n target.tabIndex = 0;\n\n break;\n }\n default:\n break;\n }\n }\n\n private async applySelects(): Promise<void> {\n await this.manageSelects(true);\n }\n\n private async manageSelects(applied?: boolean): Promise<void> {\n if (!this.buttons.length) {\n return;\n }\n\n const options = this.buttons;\n switch (this.selects) {\n case 'single': {\n // single behaves as a radio group\n this.setAttribute('role', 'radiogroup');\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'radio');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n const selected = selections.map((button) => {\n return button.value;\n });\n\n this.setSelected(selected || EMPTY_SELECTION);\n break;\n }\n case 'multiple': {\n // switching from single to multiple, remove role=\"radiogroup\"\n if (this.getAttribute('role') === 'radiogroup') {\n this.removeAttribute('role');\n }\n const selection: string[] = [];\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'checkbox');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selection.push(option.value);\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n const selected = !!selection.length\n ? selection\n : EMPTY_SELECTION;\n this.setSelected(selected);\n break;\n }\n default:\n // if user defines .selected\n if (this.selected.length) {\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'button');\n if (option.selected) {\n option.setAttribute('aria-pressed', 'true');\n selections.push(option);\n } else {\n option.removeAttribute('aria-pressed');\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n this.setSelected(\n selections.map((button) => {\n return button.value;\n })\n );\n } else {\n this.buttons.forEach((option) => {\n option.setAttribute('role', 'button');\n });\n break;\n }\n }\n\n // When no other role is defined, use role=\"toolbar\", which is appropriate with roving tabindex.\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'toolbar');\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot role=\"presentation\" @slotchange=${this.manageButtons}></slot>\n `;\n }\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('click', this.handleClick);\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('selects')) {\n this.manageSelects();\n this.manageChildren();\n }\n if (\n (changes.has('quiet') && this.quiet) ||\n (changes.has('emphasized') && this.emphasized) ||\n (changes.has('size') && this.size)\n ) {\n this.manageChildren();\n }\n // Update `aria-label` when `label` available or not first `updated`\n if (\n changes.has('label') &&\n (this.label || typeof changes.get('label') !== 'undefined')\n ) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else {\n this.removeAttribute('aria-label');\n }\n }\n }\n\n private manageChildren(): void {\n this.buttons.forEach((button) => {\n button.quiet = this.quiet;\n button.emphasized = this.emphasized;\n button.selected = this.selected.includes(button.value);\n button.size = this.size;\n });\n }\n\n private manageButtons = (): void => {\n const slot = this.shadowRoot.querySelector('slot');\n if (!slot) return;\n const assignedElements = slot.assignedElements({ flatten: true });\n const buttons = assignedElements.reduce((acc: unknown[], el) => {\n if (el.matches(this._buttonSelector)) {\n acc.push(el);\n } else {\n const buttonDescendents = Array.from(\n el.querySelectorAll(`:scope > ${this._buttonSelector}`)\n );\n acc.push(...buttonDescendents);\n }\n return acc;\n }, []);\n this.buttons = buttons as ActionButton[];\n // <selected> element merges selected so following paradigm here\n const currentlySelectedButtons: string[] = [];\n this.buttons.forEach((button: ActionButton) => {\n if (button.selected) {\n currentlySelectedButtons.push(button.value);\n }\n });\n this.setSelected(this.selected.concat(currentlySelectedButtons));\n this.manageChildren();\n this.manageSelects();\n };\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EAEA;AAAA,EACA;AAAA,OAEG;AACP,SAAS,gBAAgB;AAEzB,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AAEnC,OAAO,YAAY;AAEnB,MAAM,kBAA4B,CAAC;AAQ5B,aAAM,oBAAoB,WAAW,iBAAiB;AAAA,EACzD,YAAY,CAAC,MAAM,KAAK,KAAK,KAAK,IAAI;AAC1C,CAAC,EAAE;AAAA,EAmBC,cAAc;AACV,UAAM;AALV,SAAO,WAA2B,CAAC;AAEnC,SAAU,kBAAkB;AAgB5B,oCAA2B,IAAI;AAAA,MAC3B;AAAA,MACA;AAAA,QACI,cAAc,CAAC,aAA6B;AACxC,cAAI,oBAAoB;AACxB,gBAAM,qBAAqB,SAAS,UAAU,CAAC,IAAI,UAAU;AACzD,gBAAI,CAAC,SAAS,iBAAiB,KAAK,CAAC,GAAG,UAAU;AAC9C,kCAAoB;AAAA,YACxB;AACA,mBAAO,GAAG,YAAY,CAAC,GAAG;AAAA,UAC9B,CAAC;AACD,iBAAO,SAAS,kBAAkB,IAC5B,qBACA;AAAA,QACV;AAAA,QACA,UAAU,MAAM,KAAK;AAAA,QACrB,oBAAoB,CAAC,OAAqB,CAAC,GAAG;AAAA,MAClD;AAAA,IACJ;AAGA,SAAO,UAAU;AAGjB,SAAO,aAAa;AAGpB,SAAO,YAAY;AAGnB,SAAO,QAAQ;AAGf,SAAO,QAAQ;AAMf,SAAO,WAAW;AAElB,SAAQ,YAAsB;AAwP9B,SAAQ,gBAAgB,MAAY;AAChC,YAAM,OAAO,KAAK,WAAW,cAAc,MAAM;AACjD,UAAI,CAAC;AAAM;AACX,YAAM,mBAAmB,KAAK,iBAAiB,EAAE,SAAS,KAAK,CAAC;AAChE,YAAM,UAAU,iBAAiB,OAAO,CAAC,KAAgB,OAAO;AAC5D,YAAI,GAAG,QAAQ,KAAK,eAAe,GAAG;AAClC,cAAI,KAAK,EAAE;AAAA,QACf,OAAO;AACH,gBAAM,oBAAoB,MAAM;AAAA,YAC5B,GAAG,iBAAiB,YAAY,KAAK,iBAAiB;AAAA,UAC1D;AACA,cAAI,KAAK,GAAG,iBAAiB;AAAA,QACjC;AACA,eAAO;AAAA,MACX,GAAG,CAAC,CAAC;AACL,WAAK,UAAU;AAEf,YAAM,2BAAqC,CAAC;AAC5C,WAAK,QAAQ,QAAQ,CAAC,WAAyB;AAC3C,YAAI,OAAO,UAAU;AACjB,mCAAyB,KAAK,OAAO,KAAK;AAAA,QAC9C;AAAA,MACJ,CAAC;AACD,WAAK,YAAY,KAAK,SAAS,OAAO,wBAAwB,CAAC;AAC/D,WAAK,eAAe;AACpB,WAAK,cAAc;AAAA,IACvB;AAtUI,QAAI,mBAAmB,MAAM;AAAA,MACzB,QAAQ;AAAA,QACJ,WAAW;AAAA,QACX,SAAS;AAAA,MACb;AAAA,MACA,UAAU,MAAM;AACZ,aAAK,cAAc;AAAA,MACvB;AAAA,IACJ,CAAC;AAAA,EACL;AAAA,EA9BA,WAA2B,SAAyB;AAChD,WAAO,CAAC,MAAM;AAAA,EAClB;AAAA,EAEA,IAAW,QAAQ,MAAsB;AACrC,QAAI,SAAS,KAAK;AAAS;AAC3B,SAAK,WAAW;AAChB,SAAK,yBAAyB,kBAAkB;AAAA,EACpD;AAAA,EAEA,IAAW,UAA0B;AACjC,WAAO,KAAK;AAAA,EAChB;AAAA,EA+DA,IAAI,SAAS,UAAoB;AAC7B,SAAK,cAAc,YAAY,KAAK,SAAS;AAC7C,SAAK,YAAY;AACjB,SAAK,eAAe,KAAK,MAAM;AAC3B,WAAK,aAAa;AAClB,WAAK,eAAe;AAAA,IACxB,CAAC;AAAA,EACL;AAAA,EAGA,IAAI,WAAqB;AACrB,WAAO,KAAK;AAAA,EAChB;AAAA,EAEQ,eAAe,KAAqB;AACxC,UAAM,eAAe,KAAK;AAAA,MACtB,IAAI,MAAM,UAAU;AAAA,QAChB,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,MAChB,CAAC;AAAA,IACL;AAEA,QAAI,CAAC,cAAc;AACf,WAAK,YAAY,GAAG;AACpB,WAAK,QAAQ,IAAI,CAAC,WAAW;AACzB,eAAO,WAAW,KAAK,SAAS,SAAS,OAAO,KAAK;AAAA,MACzD,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEQ,YAAY,UAAoB,UAA0B;AAC9D,QAAI,aAAa,KAAK;AAAU;AAEhC,UAAM,MAAM,KAAK;AACjB,SAAK,cAAc,YAAY,GAAG;AAClC,SAAK,YAAY;AACjB,QAAI,CAAC;AAAU;AACf,SAAK,eAAe,GAAG;AAAA,EAC3B;AAAA,EAEgB,MAAM,SAA8B;AAChD,SAAK,yBAAyB,MAAM,OAAO;AAAA,EAC/C;AAAA,EAEQ,0BAAgC;AACpC,UAAM,WAAW;AAAA,MACb,GAAG,KAAK,iBAAiB,YAAY;AAAA,IACzC;AACA,aAAS,QAAQ,CAAC,OAAO;AACrB,SAAG,WAAW;AACd,SAAG,WAAW;AACd,SAAG;AAAA,QACC,CAAC,KAAK,UAAU,iBAAiB;AAAA,QACjC;AAAA,MACJ;AAAA,IACJ,CAAC;AAAA,EACL;AAAA,EAEQ,YAAY,OAAoB;AACpC,UAAM,SAAS,MAAM;AACrB,QAAI,OAAO,OAAO,UAAU,aAAa;AACrC;AAAA,IACJ;AACA,YAAQ,KAAK,SAAS;AAAA,MAClB,KAAK,UAAU;AACX,aAAK,wBAAwB;AAC7B,eAAO,WAAW;AAClB,eAAO,WAAW;AAClB,eAAO,aAAa,gBAAgB,MAAM;AAC1C,aAAK,YAAY,CAAC,OAAO,KAAK,GAAG,IAAI;AACrC,eAAO,MAAM;AACb;AAAA,MACJ;AAAA,MACA,KAAK,YAAY;AACb,cAAM,WAAW,CAAC,GAAG,KAAK,QAAQ;AAClC,eAAO,WAAW,CAAC,OAAO;AAC1B,eAAO;AAAA,UACH;AAAA,UACA,OAAO,WAAW,SAAS;AAAA,QAC/B;AACA,YAAI,OAAO,UAAU;AACjB,mBAAS,KAAK,OAAO,KAAK;AAAA,QAC9B,OAAO;AACH,mBAAS,OAAO,KAAK,SAAS,QAAQ,OAAO,KAAK,GAAG,CAAC;AAAA,QAC1D;AACA,aAAK,YAAY,UAAU,IAAI;AAE/B,aAAK,QAAQ,QAAQ,CAAC,WAAW;AAC7B,iBAAO,WAAW;AAAA,QACtB,CAAC;AAED,eAAO,WAAW;AAElB;AAAA,MACJ;AAAA,MACA;AACI;AAAA,IACR;AAAA,EACJ;AAAA,EAEA,MAAc,eAA8B;AACxC,UAAM,KAAK,cAAc,IAAI;AAAA,EACjC;AAAA,EAEA,MAAc,cAAc,SAAkC;AAC1D,QAAI,CAAC,KAAK,QAAQ,QAAQ;AACtB;AAAA,IACJ;AAEA,UAAM,UAAU,KAAK;AACrB,YAAQ,KAAK,SAAS;AAAA,MAClB,KAAK,UAAU;AAEX,aAAK,aAAa,QAAQ,YAAY;AACtC,cAAM,aAA6B,CAAC;AACpC,cAAM,UAAU,QAAQ,IAAI,OAAO,WAAW;AAC1C,gBAAM,OAAO;AACb,iBAAO,aAAa,QAAQ,OAAO;AACnC,iBAAO;AAAA,YACH;AAAA,YACA,OAAO,WAAW,SAAS;AAAA,UAC/B;AACA,cAAI,OAAO,UAAU;AACjB,uBAAW,KAAK,MAAM;AAAA,UAC1B;AAAA,QACJ,CAAC;AACD,YAAI;AAAS;AACb,cAAM,QAAQ,IAAI,OAAO;AAEzB,cAAM,WAAW,WAAW,IAAI,CAAC,WAAW;AACxC,iBAAO,OAAO;AAAA,QAClB,CAAC;AAED,aAAK,YAAY,YAAY,eAAe;AAC5C;AAAA,MACJ;AAAA,MACA,KAAK,YAAY;AAEb,YAAI,KAAK,aAAa,MAAM,MAAM,cAAc;AAC5C,eAAK,gBAAgB,MAAM;AAAA,QAC/B;AACA,cAAM,YAAsB,CAAC;AAC7B,cAAM,aAA6B,CAAC;AACpC,cAAM,UAAU,QAAQ,IAAI,OAAO,WAAW;AAC1C,gBAAM,OAAO;AACb,iBAAO,aAAa,QAAQ,UAAU;AACtC,iBAAO;AAAA,YACH;AAAA,YACA,OAAO,WAAW,SAAS;AAAA,UAC/B;AACA,cAAI,OAAO,UAAU;AACjB,sBAAU,KAAK,OAAO,KAAK;AAC3B,uBAAW,KAAK,MAAM;AAAA,UAC1B;AAAA,QACJ,CAAC;AACD,YAAI;AAAS;AACb,cAAM,QAAQ,IAAI,OAAO;AACzB,cAAM,WAAW,CAAC,CAAC,UAAU,SACvB,YACA;AACN,aAAK,YAAY,QAAQ;AACzB;AAAA,MACJ;AAAA,MACA;AAEI,YAAI,KAAK,SAAS,QAAQ;AACtB,gBAAM,aAA6B,CAAC;AACpC,gBAAM,UAAU,QAAQ,IAAI,OAAO,WAAW;AAC1C,kBAAM,OAAO;AACb,mBAAO,aAAa,QAAQ,QAAQ;AACpC,gBAAI,OAAO,UAAU;AACjB,qBAAO,aAAa,gBAAgB,MAAM;AAC1C,yBAAW,KAAK,MAAM;AAAA,YAC1B,OAAO;AACH,qBAAO,gBAAgB,cAAc;AAAA,YACzC;AAAA,UACJ,CAAC;AACD,cAAI;AAAS;AACb,gBAAM,QAAQ,IAAI,OAAO;AAEzB,eAAK;AAAA,YACD,WAAW,IAAI,CAAC,WAAW;AACvB,qBAAO,OAAO;AAAA,YAClB,CAAC;AAAA,UACL;AAAA,QACJ,OAAO;AACH,eAAK,QAAQ,QAAQ,CAAC,WAAW;AAC7B,mBAAO,aAAa,QAAQ,QAAQ;AAAA,UACxC,CAAC;AACD;AAAA,QACJ;AAAA,IACR;AAGA,QAAI,CAAC,KAAK,aAAa,MAAM,GAAG;AAC5B,WAAK,aAAa,QAAQ,SAAS;AAAA,IACvC;AAAA,EACJ;AAAA,EAEmB,SAAyB;AACxC,WAAO;AAAA,oDACqC,KAAK;AAAA;AAAA,EAErD;AAAA,EAEmB,aAAa,SAA+B;AAC3D,UAAM,aAAa,OAAO;AAC1B,SAAK,iBAAiB,SAAS,KAAK,WAAW;AAAA,EACnD;AAAA,EAEmB,QAAQ,SAA+B;AACtD,UAAM,QAAQ,OAAO;AACrB,QAAI,QAAQ,IAAI,SAAS,GAAG;AACxB,WAAK,cAAc;AACnB,WAAK,eAAe;AAAA,IACxB;AACA,QACK,QAAQ,IAAI,OAAO,KAAK,KAAK,SAC7B,QAAQ,IAAI,YAAY,KAAK,KAAK,cAClC,QAAQ,IAAI,MAAM,KAAK,KAAK,MAC/B;AACE,WAAK,eAAe;AAAA,IACxB;AAEA,QACI,QAAQ,IAAI,OAAO,MAClB,KAAK,SAAS,OAAO,QAAQ,IAAI,OAAO,MAAM,cACjD;AACE,UAAI,KAAK,MAAM,QAAQ;AACnB,aAAK,aAAa,cAAc,KAAK,KAAK;AAAA,MAC9C,OAAO;AACH,aAAK,gBAAgB,YAAY;AAAA,MACrC;AAAA,IACJ;AAAA,EACJ;AAAA,EAEQ,iBAAuB;AAC3B,SAAK,QAAQ,QAAQ,CAAC,WAAW;AAC7B,aAAO,QAAQ,KAAK;AACpB,aAAO,aAAa,KAAK;AACzB,aAAO,WAAW,KAAK,SAAS,SAAS,OAAO,KAAK;AACrD,aAAO,OAAO,KAAK;AAAA,IACvB,CAAC;AAAA,EACL;AA6BJ;AAvSW;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAvDjC,YAwDF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GA1DjC,YA2DF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GA7DjC,YA8DF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAhEjB,YAiEF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAnEjC,YAoEF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAtEjB,YAuEF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAzEjC,YA0EF;AAcH;AAAA,EADH,SAAS,EAAE,MAAM,MAAM,CAAC;AAAA,GAvFhB,YAwFL;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/ActionGroup.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var h=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var n=(o,
|
|
1
|
+
"use strict";var h=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var n=(u,o,e,t)=>{for(var s=t>1?void 0:t?p(o,e):o,l=u.length-1,i;l>=0;l--)(i=u[l])&&(s=(t?i(o,e,s):i(s))||s);return t&&s&&h(o,e,s),s};import{html as b,SizedMixin as f,SpectrumElement as m}from"@spectrum-web-components/base";import{property as c}from"@spectrum-web-components/base/src/decorators.js";import{RovingTabindexController as v}from"@spectrum-web-components/reactive-controllers/src/RovingTabindex.js";import{MutationController as g}from"@lit-labs/observers/mutation-controller.js";import y from"./action-group.css.js";const d=[];export class ActionGroup extends f(m,{validSizes:["xs","s","m","l","xl"]}){constructor(){super();this._buttons=[];this._buttonSelector="sp-action-button";this.rovingTabindexController=new v(this,{focusInIndex:e=>{let t=-1;const s=e.findIndex((l,i)=>(!e[t]&&!l.disabled&&(t=i),l.selected&&!l.disabled));return e[s]?s:t},elements:()=>this.buttons,isFocusableElement:e=>!e.disabled});this.compact=!1;this.emphasized=!1;this.justified=!1;this.label="";this.quiet=!1;this.vertical=!1;this._selected=d;this.manageButtons=()=>{const e=this.shadowRoot.querySelector("slot");if(!e)return;const s=e.assignedElements({flatten:!0}).reduce((i,r)=>{if(r.matches(this._buttonSelector))i.push(r);else{const a=Array.from(r.querySelectorAll(`:scope > ${this._buttonSelector}`));i.push(...a)}return i},[]);this.buttons=s;const l=[];this.buttons.forEach(i=>{i.selected&&l.push(i.value)}),this.setSelected(this.selected.concat(l)),this.manageChildren(),this.manageSelects()};new g(this,{config:{childList:!0,subtree:!0},callback:()=>{this.manageButtons()}})}static get styles(){return[y]}set buttons(e){e!==this.buttons&&(this._buttons=e,this.rovingTabindexController.clearElementCache())}get buttons(){return this._buttons}set selected(e){this.requestUpdate("selected",this._selected),this._selected=e,this.updateComplete.then(()=>{this.applySelects(),this.manageChildren()})}get selected(){return this._selected}dispatchChange(e){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||(this.setSelected(e),this.buttons.map(s=>{s.selected=this.selected.includes(s.value)}))}setSelected(e,t){if(e===this.selected)return;const s=this.selected;this.requestUpdate("selected",s),this._selected=e,t&&this.dispatchChange(s)}focus(e){this.rovingTabindexController.focus(e)}deselectSelectedButtons(){[...this.querySelectorAll("[selected]")].forEach(t=>{t.selected=!1,t.tabIndex=-1,t.setAttribute(this.selects?"aria-checked":"aria-pressed","false")})}handleClick(e){const t=e.target;if(typeof t.value!="undefined")switch(this.selects){case"single":{this.deselectSelectedButtons(),t.selected=!0,t.tabIndex=0,t.setAttribute("aria-checked","true"),this.setSelected([t.value],!0),t.focus();break}case"multiple":{const s=[...this.selected];t.selected=!t.selected,t.setAttribute("aria-checked",t.selected?"true":"false"),t.selected?s.push(t.value):s.splice(this.selected.indexOf(t.value),1),this.setSelected(s,!0),this.buttons.forEach(l=>{l.tabIndex=-1}),t.tabIndex=0;break}default:break}}async applySelects(){await this.manageSelects(!0)}async manageSelects(e){if(!this.buttons.length)return;const t=this.buttons;switch(this.selects){case"single":{this.setAttribute("role","radiogroup");const s=[],l=t.map(async r=>{await r.updateComplete,r.setAttribute("role","radio"),r.setAttribute("aria-checked",r.selected?"true":"false"),r.selected&&s.push(r)});if(e)break;await Promise.all(l);const i=s.map(r=>r.value);this.setSelected(i||d);break}case"multiple":{this.getAttribute("role")==="radiogroup"&&this.removeAttribute("role");const s=[],l=[],i=t.map(async a=>{await a.updateComplete,a.setAttribute("role","checkbox"),a.setAttribute("aria-checked",a.selected?"true":"false"),a.selected&&(s.push(a.value),l.push(a))});if(e)break;await Promise.all(i);const r=s.length?s:d;this.setSelected(r);break}default:if(this.selected.length){const s=[],l=t.map(async i=>{await i.updateComplete,i.setAttribute("role","button"),i.selected?(i.setAttribute("aria-pressed","true"),s.push(i)):i.removeAttribute("aria-pressed")});if(e)break;await Promise.all(l),this.setSelected(s.map(i=>i.value))}else{this.buttons.forEach(s=>{s.setAttribute("role","button")});break}}this.hasAttribute("role")||this.setAttribute("role","toolbar")}render(){return b`
|
|
2
2
|
<slot role="presentation" @slotchange=${this.manageButtons}></slot>
|
|
3
3
|
`}firstUpdated(e){super.firstUpdated(e),this.addEventListener("click",this.handleClick)}updated(e){super.updated(e),e.has("selects")&&(this.manageSelects(),this.manageChildren()),(e.has("quiet")&&this.quiet||e.has("emphasized")&&this.emphasized||e.has("size")&&this.size)&&this.manageChildren(),e.has("label")&&(this.label||typeof e.get("label")!="undefined")&&(this.label.length?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"))}manageChildren(){this.buttons.forEach(e=>{e.quiet=this.quiet,e.emphasized=this.emphasized,e.selected=this.selected.includes(e.value),e.size=this.size})}}n([c({type:Boolean,reflect:!0})],ActionGroup.prototype,"compact",2),n([c({type:Boolean,reflect:!0})],ActionGroup.prototype,"emphasized",2),n([c({type:Boolean,reflect:!0})],ActionGroup.prototype,"justified",2),n([c({type:String})],ActionGroup.prototype,"label",2),n([c({type:Boolean,reflect:!0})],ActionGroup.prototype,"quiet",2),n([c({type:String})],ActionGroup.prototype,"selects",2),n([c({type:Boolean,reflect:!0})],ActionGroup.prototype,"vertical",2),n([c({type:Array})],ActionGroup.prototype,"selected",1);
|
|
4
4
|
//# sourceMappingURL=ActionGroup.js.map
|
package/src/ActionGroup.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["ActionGroup.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport type { ActionButton } from '@spectrum-web-components/action-button';\nimport { RovingTabindexController } from '@spectrum-web-components/reactive-controllers/src/RovingTabindex.js';\nimport { MutationController } from '@lit-labs/observers/mutation-controller.js';\n\nimport styles from './action-group.css.js';\n\nconst EMPTY_SELECTION: string[] = [];\n\n/**\n * @element sp-action-group\n * @slot - the sp-action-button elements that make up the group\n *\n * @fires change - Announces that selection state has been changed by user\n */\nexport class ActionGroup extends SizedMixin(SpectrumElement, {\n validSizes: ['xs', 's', 'm', 'l', 'xl'],\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n public set buttons(tabs: ActionButton[]) {\n if (tabs === this.buttons) return;\n this._buttons = tabs;\n this.rovingTabindexController.clearElementCache();\n }\n\n public get buttons(): ActionButton[] {\n return this._buttons;\n }\n\n public _buttons: ActionButton[] = [];\n\n protected _buttonSelector = 'sp-action-button';\n\n constructor() {\n super();\n\n new MutationController(this, {\n config: {\n childList: true,\n subtree: true,\n },\n callback: () => {\n this.manageButtons();\n },\n });\n }\n\n rovingTabindexController = new RovingTabindexController<ActionButton>(\n this,\n {\n focusInIndex: (elements: ActionButton[]) => {\n let firstEnabledIndex = -1;\n const firstSelectedIndex = elements.findIndex((el, index) => {\n if (!elements[firstEnabledIndex] && !el.disabled) {\n firstEnabledIndex = index;\n }\n return el.selected && !el.disabled;\n });\n return elements[firstSelectedIndex]\n ? firstSelectedIndex\n : firstEnabledIndex;\n },\n elements: () => this.buttons,\n isFocusableElement: (el: ActionButton) => !el.disabled,\n }\n );\n\n @property({ type: Boolean, reflect: true })\n public compact = false;\n\n @property({ type: Boolean, reflect: true })\n public emphasized = false;\n\n @property({ type: Boolean, reflect: true })\n public justified = false;\n\n @property({ type: String })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public selects: undefined | 'single' | 'multiple';\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n private _selected: string[] = EMPTY_SELECTION;\n\n set selected(selected: string[]) {\n this.requestUpdate('selected', this._selected);\n this._selected = selected;\n this.updateComplete.then(() => {\n this.applySelects();\n this.manageChildren();\n });\n }\n\n @property({ type: Array })\n get selected(): string[] {\n return this._selected;\n }\n\n private dispatchChange(old: string[]): void {\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n\n if (!applyDefault) {\n this.setSelected(old);\n this.buttons.map((button) => {\n button.selected = this.selected.includes(button.value);\n });\n }\n }\n\n private setSelected(selected: string[], announce?: boolean): void {\n if (selected === this.selected) return;\n\n const old = this.selected;\n this.requestUpdate('selected', old);\n this._selected = selected;\n if (!announce) return;\n this.dispatchChange(old);\n }\n\n public override focus(options?: FocusOptions): void {\n this.rovingTabindexController.focus(options);\n }\n\n private deselectSelectedButtons(): void {\n const selected = [\n ...this.querySelectorAll('[selected]'),\n ] as ActionButton[];\n selected.forEach((el) => {\n el.selected = false;\n el.tabIndex = -1;\n el.setAttribute('aria-checked', 'false');\n });\n }\n\n private handleClick(event: Event): void {\n const target = event.target as ActionButton;\n if (typeof target.value === 'undefined') {\n return;\n }\n switch (this.selects) {\n case 'single': {\n this.deselectSelectedButtons();\n target.selected = true;\n target.tabIndex = 0;\n target.setAttribute('aria-checked', 'true');\n this.setSelected([target.value], true);\n target.focus();\n break;\n }\n case 'multiple': {\n const selected = [...this.selected];\n target.selected = !target.selected;\n target.setAttribute(\n 'aria-checked',\n target.selected ? 'true' : 'false'\n );\n if (target.selected) {\n selected.push(target.value);\n } else {\n selected.splice(this.selected.indexOf(target.value), 1);\n }\n this.setSelected(selected, true);\n\n this.buttons.forEach((button) => {\n button.tabIndex = -1;\n });\n\n target.tabIndex = 0;\n\n break;\n }\n default:\n break;\n }\n }\n\n private async applySelects(): Promise<void> {\n await this.manageSelects(true);\n }\n\n private async manageSelects(applied?: boolean): Promise<void> {\n if (!this.buttons.length) {\n return;\n }\n\n const options = this.buttons;\n switch (this.selects) {\n case 'single': {\n this.setAttribute('role', 'radiogroup');\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'radio');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n const selected = selections.map((button) => {\n return button.value;\n });\n\n this.setSelected(selected || EMPTY_SELECTION);\n break;\n }\n case 'multiple': {\n this.setAttribute('role', 'group');\n const selection: string[] = [];\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'checkbox');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selection.push(option.value);\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n const selected = !!selection.length\n ? selection\n : EMPTY_SELECTION;\n this.setSelected(selected);\n break;\n }\n default:\n // if user defines .selected\n if (this.selected.length) {\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n option.setAttribute('role', 'button');\n if (option.selected) {\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n this.setSelected(\n selections.map((button) => {\n return button.value;\n })\n );\n } else {\n this.buttons.forEach((option) => {\n option.setAttribute('role', 'button');\n });\n this.removeAttribute('role');\n break;\n }\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot role=\"presentation\" @slotchange=${this.manageButtons}></slot>\n `;\n }\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('click', this.handleClick);\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('selects')) {\n this.manageSelects();\n this.manageChildren();\n }\n if (\n (changes.has('quiet') && this.quiet) ||\n (changes.has('emphasized') && this.emphasized) ||\n (changes.has('size') && this.size)\n ) {\n this.manageChildren();\n }\n // Update `aria-label` when `label` available or not first `updated`\n if (\n changes.has('label') &&\n (this.label || typeof changes.get('label') !== 'undefined')\n ) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else {\n this.removeAttribute('aria-label');\n }\n }\n }\n\n private manageChildren(): void {\n this.buttons.forEach((button) => {\n button.quiet = this.quiet;\n button.emphasized = this.emphasized;\n button.selected = this.selected.includes(button.value);\n button.size = this.size;\n });\n }\n\n private manageButtons = (): void => {\n const slot = this.shadowRoot.querySelector('slot');\n if (!slot) return;\n const assignedElements = slot.assignedElements({ flatten: true });\n const buttons = assignedElements.reduce((acc: unknown[], el) => {\n if (el.matches(this._buttonSelector)) {\n acc.push(el);\n } else {\n const buttonDescendents = Array.from(\n el.querySelectorAll(`:scope > ${this._buttonSelector}`)\n );\n acc.push(...buttonDescendents);\n }\n return acc;\n }, []);\n this.buttons = buttons as ActionButton[];\n // <selected> element merges selected so following paradigm here\n const currentlySelectedButtons: string[] = [];\n this.buttons.forEach((button: ActionButton) => {\n if (button.selected) {\n currentlySelectedButtons.push(button.value);\n }\n });\n this.setSelected(this.selected.concat(currentlySelectedButtons));\n this.manageChildren();\n this.manageSelects();\n };\n}\n"],
|
|
5
|
-
"mappings": "qNAYA,OAEI,QAAAA,EAEA,cAAAC,EACA,mBAAAC,MAEG,gCACP,OAAS,YAAAC,MAAgB,kDAEzB,OAAS,4BAAAC,MAAgC,sEACzC,OAAS,sBAAAC,MAA0B,6CAEnC,OAAOC,MAAY,wBAEnB,MAAMC,EAA4B,CAAC,EAQ5B,aAAM,oBAAoBN,EAAWC,EAAiB,CACzD,WAAY,CAAC,KAAM,IAAK,IAAK,IAAK,IAAI,CAC1C,CAAC,CAAE,CAmBC,aAAc,CACV,MAAM,EALV,KAAO,SAA2B,CAAC,EAEnC,KAAU,gBAAkB,mBAgB5B,8BAA2B,IAAIE,EAC3B,KACA,CACI,aAAeI,GAA6B,CACxC,IAAIC,EAAoB,GACxB,MAAMC,EAAqBF,EAAS,UAAU,CAACG,EAAIC,KAC3C,CAACJ,EAASC,CAAiB,GAAK,CAACE,EAAG,WACpCF,EAAoBG,GAEjBD,EAAG,UAAY,CAACA,EAAG,SAC7B,EACD,OAAOH,EAASE,CAAkB,EAC5BA,EACAD,CACV,EACA,SAAU,IAAM,KAAK,QACrB,mBAAqBE,GAAqB,CAACA,EAAG,QAClD,CACJ,EAGA,KAAO,QAAU,GAGjB,KAAO,WAAa,GAGpB,KAAO,UAAY,GAGnB,KAAO,MAAQ,GAGf,KAAO,MAAQ,GAMf,KAAO,SAAW,GAElB,KAAQ,UAAsBJ,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport type { ActionButton } from '@spectrum-web-components/action-button';\nimport { RovingTabindexController } from '@spectrum-web-components/reactive-controllers/src/RovingTabindex.js';\nimport { MutationController } from '@lit-labs/observers/mutation-controller.js';\n\nimport styles from './action-group.css.js';\n\nconst EMPTY_SELECTION: string[] = [];\n\n/**\n * @element sp-action-group\n * @slot - the sp-action-button elements that make up the group\n *\n * @fires change - Announces that selection state has been changed by user\n */\nexport class ActionGroup extends SizedMixin(SpectrumElement, {\n validSizes: ['xs', 's', 'm', 'l', 'xl'],\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n public set buttons(tabs: ActionButton[]) {\n if (tabs === this.buttons) return;\n this._buttons = tabs;\n this.rovingTabindexController.clearElementCache();\n }\n\n public get buttons(): ActionButton[] {\n return this._buttons;\n }\n\n public _buttons: ActionButton[] = [];\n\n protected _buttonSelector = 'sp-action-button';\n\n constructor() {\n super();\n\n new MutationController(this, {\n config: {\n childList: true,\n subtree: true,\n },\n callback: () => {\n this.manageButtons();\n },\n });\n }\n\n rovingTabindexController = new RovingTabindexController<ActionButton>(\n this,\n {\n focusInIndex: (elements: ActionButton[]) => {\n let firstEnabledIndex = -1;\n const firstSelectedIndex = elements.findIndex((el, index) => {\n if (!elements[firstEnabledIndex] && !el.disabled) {\n firstEnabledIndex = index;\n }\n return el.selected && !el.disabled;\n });\n return elements[firstSelectedIndex]\n ? firstSelectedIndex\n : firstEnabledIndex;\n },\n elements: () => this.buttons,\n isFocusableElement: (el: ActionButton) => !el.disabled,\n }\n );\n\n @property({ type: Boolean, reflect: true })\n public compact = false;\n\n @property({ type: Boolean, reflect: true })\n public emphasized = false;\n\n @property({ type: Boolean, reflect: true })\n public justified = false;\n\n @property({ type: String })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public selects: undefined | 'single' | 'multiple';\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n private _selected: string[] = EMPTY_SELECTION;\n\n set selected(selected: string[]) {\n this.requestUpdate('selected', this._selected);\n this._selected = selected;\n this.updateComplete.then(() => {\n this.applySelects();\n this.manageChildren();\n });\n }\n\n @property({ type: Array })\n get selected(): string[] {\n return this._selected;\n }\n\n private dispatchChange(old: string[]): void {\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n\n if (!applyDefault) {\n this.setSelected(old);\n this.buttons.map((button) => {\n button.selected = this.selected.includes(button.value);\n });\n }\n }\n\n private setSelected(selected: string[], announce?: boolean): void {\n if (selected === this.selected) return;\n\n const old = this.selected;\n this.requestUpdate('selected', old);\n this._selected = selected;\n if (!announce) return;\n this.dispatchChange(old);\n }\n\n public override focus(options?: FocusOptions): void {\n this.rovingTabindexController.focus(options);\n }\n\n private deselectSelectedButtons(): void {\n const selected = [\n ...this.querySelectorAll('[selected]'),\n ] as ActionButton[];\n selected.forEach((el) => {\n el.selected = false;\n el.tabIndex = -1;\n el.setAttribute(\n !this.selects ? 'aria-pressed' : 'aria-checked',\n 'false'\n );\n });\n }\n\n private handleClick(event: Event): void {\n const target = event.target as ActionButton;\n if (typeof target.value === 'undefined') {\n return;\n }\n switch (this.selects) {\n case 'single': {\n this.deselectSelectedButtons();\n target.selected = true;\n target.tabIndex = 0;\n target.setAttribute('aria-checked', 'true');\n this.setSelected([target.value], true);\n target.focus();\n break;\n }\n case 'multiple': {\n const selected = [...this.selected];\n target.selected = !target.selected;\n target.setAttribute(\n 'aria-checked',\n target.selected ? 'true' : 'false'\n );\n if (target.selected) {\n selected.push(target.value);\n } else {\n selected.splice(this.selected.indexOf(target.value), 1);\n }\n this.setSelected(selected, true);\n\n this.buttons.forEach((button) => {\n button.tabIndex = -1;\n });\n\n target.tabIndex = 0;\n\n break;\n }\n default:\n break;\n }\n }\n\n private async applySelects(): Promise<void> {\n await this.manageSelects(true);\n }\n\n private async manageSelects(applied?: boolean): Promise<void> {\n if (!this.buttons.length) {\n return;\n }\n\n const options = this.buttons;\n switch (this.selects) {\n case 'single': {\n // single behaves as a radio group\n this.setAttribute('role', 'radiogroup');\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'radio');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n const selected = selections.map((button) => {\n return button.value;\n });\n\n this.setSelected(selected || EMPTY_SELECTION);\n break;\n }\n case 'multiple': {\n // switching from single to multiple, remove role=\"radiogroup\"\n if (this.getAttribute('role') === 'radiogroup') {\n this.removeAttribute('role');\n }\n const selection: string[] = [];\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'checkbox');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n if (option.selected) {\n selection.push(option.value);\n selections.push(option);\n }\n });\n if (applied) break;\n await Promise.all(updates);\n const selected = !!selection.length\n ? selection\n : EMPTY_SELECTION;\n this.setSelected(selected);\n break;\n }\n default:\n // if user defines .selected\n if (this.selected.length) {\n const selections: ActionButton[] = [];\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'button');\n if (option.selected) {\n option.setAttribute('aria-pressed', 'true');\n selections.push(option);\n } else {\n option.removeAttribute('aria-pressed');\n }\n });\n if (applied) break;\n await Promise.all(updates);\n\n this.setSelected(\n selections.map((button) => {\n return button.value;\n })\n );\n } else {\n this.buttons.forEach((option) => {\n option.setAttribute('role', 'button');\n });\n break;\n }\n }\n\n // When no other role is defined, use role=\"toolbar\", which is appropriate with roving tabindex.\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'toolbar');\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot role=\"presentation\" @slotchange=${this.manageButtons}></slot>\n `;\n }\n\n protected override firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('click', this.handleClick);\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('selects')) {\n this.manageSelects();\n this.manageChildren();\n }\n if (\n (changes.has('quiet') && this.quiet) ||\n (changes.has('emphasized') && this.emphasized) ||\n (changes.has('size') && this.size)\n ) {\n this.manageChildren();\n }\n // Update `aria-label` when `label` available or not first `updated`\n if (\n changes.has('label') &&\n (this.label || typeof changes.get('label') !== 'undefined')\n ) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else {\n this.removeAttribute('aria-label');\n }\n }\n }\n\n private manageChildren(): void {\n this.buttons.forEach((button) => {\n button.quiet = this.quiet;\n button.emphasized = this.emphasized;\n button.selected = this.selected.includes(button.value);\n button.size = this.size;\n });\n }\n\n private manageButtons = (): void => {\n const slot = this.shadowRoot.querySelector('slot');\n if (!slot) return;\n const assignedElements = slot.assignedElements({ flatten: true });\n const buttons = assignedElements.reduce((acc: unknown[], el) => {\n if (el.matches(this._buttonSelector)) {\n acc.push(el);\n } else {\n const buttonDescendents = Array.from(\n el.querySelectorAll(`:scope > ${this._buttonSelector}`)\n );\n acc.push(...buttonDescendents);\n }\n return acc;\n }, []);\n this.buttons = buttons as ActionButton[];\n // <selected> element merges selected so following paradigm here\n const currentlySelectedButtons: string[] = [];\n this.buttons.forEach((button: ActionButton) => {\n if (button.selected) {\n currentlySelectedButtons.push(button.value);\n }\n });\n this.setSelected(this.selected.concat(currentlySelectedButtons));\n this.manageChildren();\n this.manageSelects();\n };\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["html", "SizedMixin", "SpectrumElement", "property", "RovingTabindexController", "MutationController", "styles", "EMPTY_SELECTION", "elements", "firstEnabledIndex", "firstSelectedIndex", "el", "index", "slot", "buttons", "acc", "buttonDescendents", "currentlySelectedButtons", "button", "tabs", "selected", "old", "announce", "options", "event", "target", "applied", "selections", "updates", "option", "selection", "changes", "__decorateClass"]
|
|
7
7
|
}
|
|
@@ -115,7 +115,7 @@ describe("ActionGroup", () => {
|
|
|
115
115
|
await elementUpdated(el);
|
|
116
116
|
await expect(el).to.be.accessible();
|
|
117
117
|
expect(el.getAttribute("aria-label")).to.equal("Default Group");
|
|
118
|
-
expect(el.
|
|
118
|
+
expect(el.getAttribute("role")).to.equal("toolbar");
|
|
119
119
|
expect(el.children[0].getAttribute("role")).to.equal("button");
|
|
120
120
|
});
|
|
121
121
|
it("applies `quiet` attribute to its children", async () => {
|
|
@@ -274,7 +274,7 @@ describe("ActionGroup", () => {
|
|
|
274
274
|
expect(el.getAttribute("aria-label")).to.equal(
|
|
275
275
|
"Selects Multiple Group"
|
|
276
276
|
);
|
|
277
|
-
expect(el.getAttribute("role")).to.equal("
|
|
277
|
+
expect(el.getAttribute("role")).to.equal("toolbar");
|
|
278
278
|
expect(el.children[0].getAttribute("role")).to.equal("checkbox");
|
|
279
279
|
});
|
|
280
280
|
it('loads [selects="multiple"] action-group w/ selection accessibly', async () => {
|
|
@@ -633,16 +633,49 @@ describe("ActionGroup", () => {
|
|
|
633
633
|
`
|
|
634
634
|
);
|
|
635
635
|
await elementUpdated(el);
|
|
636
|
+
expect(el.getAttribute("role")).to.equal("toolbar");
|
|
636
637
|
expect(el.selected.length).to.equal(2);
|
|
637
638
|
const firstButton = el.querySelector(".first");
|
|
638
639
|
expect(firstButton.selected, "first button selected").to.be.true;
|
|
640
|
+
expect(firstButton.hasAttribute("aria-checked")).to.be.false;
|
|
641
|
+
expect(
|
|
642
|
+
firstButton.getAttribute("aria-pressed"),
|
|
643
|
+
"first button aria-pressed"
|
|
644
|
+
).to.eq("true");
|
|
645
|
+
expect(firstButton.getAttribute("role"), "first button role").to.eq(
|
|
646
|
+
"button"
|
|
647
|
+
);
|
|
639
648
|
const secondButton = el.querySelector(".second");
|
|
640
649
|
expect(secondButton.selected, "second button selected").to.be.true;
|
|
650
|
+
expect(secondButton.hasAttribute("aria-checked")).to.be.false;
|
|
651
|
+
expect(
|
|
652
|
+
secondButton.getAttribute("aria-pressed"),
|
|
653
|
+
"second button aria-pressed"
|
|
654
|
+
).to.eq("true");
|
|
655
|
+
expect(secondButton.getAttribute("role"), "first button role").to.eq(
|
|
656
|
+
"button"
|
|
657
|
+
);
|
|
641
658
|
firstButton.click();
|
|
642
659
|
await elementUpdated(el);
|
|
643
660
|
expect(el.selected.length).to.equal(2);
|
|
644
661
|
expect(firstButton.selected, "first button selected").to.be.true;
|
|
662
|
+
expect(firstButton.hasAttribute("aria-checked")).to.be.false;
|
|
663
|
+
expect(
|
|
664
|
+
firstButton.getAttribute("aria-pressed"),
|
|
665
|
+
"first button aria-pressed"
|
|
666
|
+
).to.eq("true");
|
|
667
|
+
expect(firstButton.getAttribute("role"), "first button role").to.eq(
|
|
668
|
+
"button"
|
|
669
|
+
);
|
|
645
670
|
expect(secondButton.selected, "second button selected").to.be.true;
|
|
671
|
+
expect(secondButton.hasAttribute("aria-checked")).to.be.false;
|
|
672
|
+
expect(
|
|
673
|
+
secondButton.getAttribute("aria-pressed"),
|
|
674
|
+
"second button aria-pressed"
|
|
675
|
+
).to.eq("true");
|
|
676
|
+
expect(secondButton.getAttribute("role"), "first button role").to.eq(
|
|
677
|
+
"button"
|
|
678
|
+
);
|
|
646
679
|
});
|
|
647
680
|
it('will not change .selected state if event is prevented while [selects="multiple"]', async () => {
|
|
648
681
|
const el = await fixture(
|
|
@@ -785,6 +818,27 @@ describe("ActionGroup", () => {
|
|
|
785
818
|
expect(firstElement.selected, "first child selected").to.be.true;
|
|
786
819
|
expect(secondElement.selected, "second child selected").to.be.false;
|
|
787
820
|
});
|
|
821
|
+
it("accepts role attribute override", async () => {
|
|
822
|
+
const el = await fixture(
|
|
823
|
+
html`
|
|
824
|
+
<sp-action-group role="group">
|
|
825
|
+
<sp-action-button>Button</sp-action-button>
|
|
826
|
+
</sp-action-group>
|
|
827
|
+
`
|
|
828
|
+
);
|
|
829
|
+
await elementUpdated(el);
|
|
830
|
+
expect(el.getAttribute("role")).to.equal("group");
|
|
831
|
+
el.setAttribute("selects", "single");
|
|
832
|
+
await elementUpdated(el);
|
|
833
|
+
expect(el.getAttribute("role")).to.equal("radiogroup");
|
|
834
|
+
el.setAttribute("selects", "multiple");
|
|
835
|
+
await elementUpdated(el);
|
|
836
|
+
expect(el.getAttribute("role")).to.equal("toolbar");
|
|
837
|
+
el.removeAttribute("role");
|
|
838
|
+
el.removeAttribute("selects");
|
|
839
|
+
await elementUpdated(el);
|
|
840
|
+
expect(el.getAttribute("role")).to.equal("toolbar");
|
|
841
|
+
});
|
|
788
842
|
const acceptKeyboardInput = async (el) => {
|
|
789
843
|
const thirdElement = el.querySelector(".third");
|
|
790
844
|
await elementUpdated(el);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["action-group.test.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n waitUntil,\n} from '@open-wc/testing';\n\nimport { ActionButton } from '@spectrum-web-components/action-button';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport { LitElement, TemplateResult } from '@spectrum-web-components/base';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport { ActionGroup } from '@spectrum-web-components/action-group';\nimport {\n arrowDownEvent,\n arrowLeftEvent,\n arrowRightEvent,\n arrowUpEvent,\n endEvent,\n homeEvent,\n testForLitDevWarnings,\n} from '../../../test/testing-helpers';\nimport { sendKeys } from '@web/test-runner-commands';\nimport '@spectrum-web-components/action-group/sp-action-group.js';\n\nclass QuietActionGroup extends LitElement {\n protected override render(): TemplateResult {\n return html`\n <sp-action-group quiet>\n <slot name=\"first\"></slot>\n <slot name=\"second\"></slot>\n </sp-action-group>\n `;\n }\n}\ncustomElements.define('quiet-action-group', QuietActionGroup);\n\nclass EmphasizedActionGroup extends LitElement {\n protected override render(): TemplateResult {\n return html`\n <sp-action-group emphasized>\n <slot name=\"first\"></slot>\n <slot name=\"second\"></slot>\n </sp-action-group>\n `;\n }\n}\ncustomElements.define('emphasized-action-group', EmphasizedActionGroup);\n\nasync function singleSelectedActionGroup(\n selected: string[]\n): Promise<ActionGroup> {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n selects=\"single\"\n .selected=${selected}\n >\n <sp-action-button value=\"first\" class=\"first\">\n First\n </sp-action-button>\n <sp-action-button value=\"second\" class=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n return el;\n}\n\nasync function multipleSelectedActionGroup(\n selected: string[]\n): Promise<ActionGroup> {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n selects=\"multiple\"\n .selected=${selected}\n >\n <sp-action-button value=\"first\" class=\"first\">\n First\n </sp-action-button>\n <sp-action-button value=\"second\" class=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n return el;\n}\n\ndescribe('ActionGroup', () => {\n it('loads empty action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group></sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n testForLitDevWarnings(\n async () =>\n await fixture<ActionGroup>(\n html`\n <sp-action-group aria-label=\"Default Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n )\n );\n it('loads default action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group aria-label=\"Default Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal('Default Group');\n expect(el.hasAttribute('role')).to.be.false;\n expect(el.children[0].getAttribute('role')).to.equal('button');\n });\n it('applies `quiet` attribute to its children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group quiet>\n <sp-action-button id=\"first\">First</sp-action-button>\n <sp-action-button id=\"second\">Second</sp-action-button>\n </sp-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `quiet` attribute to its slotted children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <quiet-action-group>\n <sp-action-button slot=\"first\" id=\"first\">\n First\n </sp-action-button>\n <sp-action-button slot=\"second\" id=\"second\">\n Second\n </sp-action-button>\n </quiet-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `emphasized` attribute to its slotted children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <emphasized-action-group>\n <sp-action-button slot=\"first\" id=\"first\">\n First\n </sp-action-button>\n <sp-action-button slot=\"second\" id=\"second\">\n Second\n </sp-action-button>\n </emphasized-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('emphasized')).to.be.true;\n expect(firstButton.emphasized).to.be.true;\n expect(secondButton.hasAttribute('emphasized')).to.be.true;\n expect(secondButton.emphasized).to.be.true;\n });\n it('applies `quiet` attribute to slotted children with overlays', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <quiet-action-group>\n <overlay-trigger slot=\"first\">\n <sp-action-button slot=\"trigger\" id=\"first\">\n First\n </sp-action-button>\n </overlay-trigger>\n <overlay-trigger slot=\"second\">\n <sp-action-button slot=\"trigger\" id=\"second\">\n Second\n </sp-action-button>\n </overlay-trigger>\n </quiet-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `emphasized` attribute to slotted children with overlays', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <emphasized-action-group>\n <overlay-trigger slot=\"first\">\n <sp-action-button slot=\"trigger\" id=\"first\">\n First\n </sp-action-button>\n </overlay-trigger>\n <overlay-trigger slot=\"second\">\n <sp-action-button slot=\"trigger\" id=\"second\">\n Second\n </sp-action-button>\n </overlay-trigger>\n </emphasized-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('emphasized')).to.be.true;\n expect(firstButton.emphasized).to.be.true;\n expect(secondButton.hasAttribute('emphasized')).to.be.true;\n expect(secondButton.emphasized).to.be.true;\n });\n it('loads [selects=\"single\"] action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal('Selects Single Group');\n expect(el.getAttribute('role')).to.equal('radiogroup');\n expect(el.children[0].getAttribute('role')).to.equal('radio');\n });\n it('loads [selects=\"single\"] action-group w/ selection accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('loads [selects=\"multiple\"] action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal(\n 'Selects Multiple Group'\n );\n expect(el.getAttribute('role')).to.equal('group');\n expect(el.children[0].getAttribute('role')).to.equal('checkbox');\n });\n it('loads [selects=\"multiple\"] action-group w/ selection accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('sets tab stop when [selects=\"single\"] and the initial button is [disabled]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button disabled>First</sp-action-button>\n <sp-action-button class=\"second\">Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n const secondButton = el.querySelector('.second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(secondButton.hasAttribute('tabindex'));\n expect(secondButton.getAttribute('tabindex')).to.equal('0');\n });\n it('surfaces [selects=\"single\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected, '\"Third\" selected').to.deep.equal(['Third']);\n });\n it('surfaces [selects=\"multiple\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected, '\"Second\" and \"Third\" selected').to.deep.equal([\n 'Second',\n 'Third',\n ]);\n });\n it('does not select without [selects]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"No Selects Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n });\n it('selects via `click` while [selects=\"single\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button value=\"first\">First</sp-action-button>\n <sp-action-button value=\"second\" selected>\n Second\n </sp-action-button>\n <sp-action-button value=\"third\" class=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected.includes('second'));\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n\n await waitUntil(\n () => el.selected.length === 1 && el.selected.includes('third'),\n 'Updates value of `selected`'\n );\n });\n it('selects via `click` while [selects=\"multiple\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button selected class=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\">Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected.includes('First'));\n\n firstElement.click();\n secondElement.click();\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second child selected').to.be.true;\n expect(thirdElement.selected, 'third child selected').to.be.true;\n\n await waitUntil(\n () =>\n el.selected.length === 2 &&\n el.selected.includes('Second') &&\n el.selected.includes('Third'),\n 'Updates value of `selected`'\n );\n });\n it('does not respond to clicks on itself', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n el.click();\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(0);\n });\n it('selection can be prevented', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child not selected').to.be.false;\n expect(el.selected.length).to.equal(0);\n });\n\n it('selects user-passed value while [selects=\"single\"]', async () => {\n const el = await singleSelectedActionGroup(['first']);\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button not selected').to.be.false;\n\n secondButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('selects can be updated while [selects=\"single\"]', async () => {\n const el = await singleSelectedActionGroup(['first']);\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button not selected').to.be.false;\n\n el.selected = ['second'];\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('selects user-passed value while [selects=\"multiple\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n .selected=${['first', 'second']}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n <sp-action-button class=\"third \" value=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n const thirdButton = el.querySelector('.third') as ActionButton;\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button not selected').to.be.false;\n\n thirdButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(3);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n\n firstButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n });\n\n it('selects can be updated while [selects=\"multiple\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n .selected=${['first', 'second']}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n <sp-action-button class=\"third \" value=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n const thirdButton = el.querySelector('.third') as ActionButton;\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button not selected').to.be.false;\n\n el.selected = ['first', 'second', 'third'];\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(3);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n\n el.selected = ['second', 'third'];\n await elementUpdated(el);\n\n expect(el.selected.length, JSON.stringify(el.selected)).to.equal(2);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n });\n\n it('selects multiple user-passed values while [selects=\"single\"], but then proceeds with radio-button style functionality', async () => {\n const el = await singleSelectedActionGroup(['first', 'second']);\n await elementUpdated(el);\n expect(el.selected.length).to.equal(2);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n\n secondButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('only selects user-passed buttons if present in action-group while [selects=\"multiple\"]', async () => {\n const el = await multipleSelectedActionGroup(['second', 'fourth']);\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(secondButton.selected, 'second button selected').to.be.true;\n\n const firstButton = el.querySelector('.first') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.false;\n });\n\n it('selects user-passed values with no .selects value, but does not allow interaction afterwards', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n .selected=${['first']}\n >\n <sp-action-button value=\"first\" class=\"first\">\n First\n </sp-action-button>\n <sp-action-button value=\"second\" class=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.false;\n\n secondButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.false;\n });\n\n it('selects multiple buttons if .selected is passed in, but does not allow further interaction afterwards', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n .selected=${['first', 'second']}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(2);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(secondButton.selected, 'second button selected').to.be.true;\n\n firstButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('will not change .selected state if event is prevented while [selects=\"multiple\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n .selected=${['first', 'second']}\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n <sp-action-button class=\"third \" value=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n // checking if the first and second are selected\n await elementUpdated(el);\n expect(el.selected.length).to.equal(2);\n expect(firstElement.selected, 'first child selected').to.be.true;\n expect(secondElement.selected, 'second child selected').to.be.true;\n\n // making sure third element isn't selected\n thirdElement.click();\n await elementUpdated(el);\n expect(thirdElement.selected, 'third child not selected').to.be.false;\n expect(el.selected.length).to.equal(2);\n\n // making sure already-selected elements are not de-selected\n secondElement.click();\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second element still selected').to.be\n .true;\n });\n\n it('will not change .selected state if event is prevented while [selects=\"single\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n .selected=${['first']}\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n // checking if the first element is selected\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n\n // making sure third element isn't selected\n secondElement.click();\n\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second child not selected').to.be.false;\n expect(el.selected.length).to.equal(1);\n\n // making sure already-selected elements are not de-selected\n firstElement.click();\n await elementUpdated(el);\n\n expect(firstElement.selected, 'first element still selected').to.be\n .true;\n });\n\n it('will not change .selected state if event is prevented while selects is undefined', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n .selected=${['first']}\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n // checking if the first element is selected\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n\n secondElement.click();\n await elementUpdated(el);\n\n // state should be exactly the same\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n expect(secondElement.selected, 'second child not selected').to.be.false;\n });\n\n it('maintains a `size` attribute', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group>\n <sp-action-button>Button</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n expect(el.size).to.equal('m');\n expect(el.getAttribute('size')).to.equal('m');\n el.removeAttribute('size');\n await elementUpdated(el);\n expect(el.size).to.equal('m');\n expect(el.getAttribute('size')).to.equal('m');\n });\n\n it('will accept selected as a JSON string', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n selected='[\"first\"]'\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n // checking if the first element is selected\n await elementUpdated(el);\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n expect(secondElement.selected, 'second child selected').to.be.false;\n });\n\n const acceptKeyboardInput = async (el: ActionGroup): Promise<void> => {\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n el.dispatchEvent(arrowRightEvent());\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowLeftEvent());\n el.dispatchEvent(arrowUpEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n\n el.dispatchEvent(endEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n await sendKeys({ press: 'Enter' });\n\n el.dispatchEvent(homeEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowDownEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n };\n it('accepts keybord input', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n await acceptKeyboardInput(el);\n });\n it('accepts keybord input with tooltip', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">\n First\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n Definitely the first one.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" selected>\n Second\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n Not the first, not the last.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" class=\"third\">\n Third\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">Select me.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n `\n );\n await acceptKeyboardInput(el);\n });\n it('accepts keybord input when [dir=\"ltr\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n dir=\"ltr\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button disabled>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n el.dispatchEvent(arrowRightEvent());\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowUpEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n });\n});\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n waitUntil,\n} from '@open-wc/testing';\n\nimport { ActionButton } from '@spectrum-web-components/action-button';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport { LitElement, TemplateResult } from '@spectrum-web-components/base';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport { ActionGroup } from '@spectrum-web-components/action-group';\nimport {\n arrowDownEvent,\n arrowLeftEvent,\n arrowRightEvent,\n arrowUpEvent,\n endEvent,\n homeEvent,\n testForLitDevWarnings,\n} from '../../../test/testing-helpers';\nimport { sendKeys } from '@web/test-runner-commands';\nimport '@spectrum-web-components/action-group/sp-action-group.js';\n\nclass QuietActionGroup extends LitElement {\n protected override render(): TemplateResult {\n return html`\n <sp-action-group quiet>\n <slot name=\"first\"></slot>\n <slot name=\"second\"></slot>\n </sp-action-group>\n `;\n }\n}\ncustomElements.define('quiet-action-group', QuietActionGroup);\n\nclass EmphasizedActionGroup extends LitElement {\n protected override render(): TemplateResult {\n return html`\n <sp-action-group emphasized>\n <slot name=\"first\"></slot>\n <slot name=\"second\"></slot>\n </sp-action-group>\n `;\n }\n}\ncustomElements.define('emphasized-action-group', EmphasizedActionGroup);\n\nasync function singleSelectedActionGroup(\n selected: string[]\n): Promise<ActionGroup> {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n selects=\"single\"\n .selected=${selected}\n >\n <sp-action-button value=\"first\" class=\"first\">\n First\n </sp-action-button>\n <sp-action-button value=\"second\" class=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n return el;\n}\n\nasync function multipleSelectedActionGroup(\n selected: string[]\n): Promise<ActionGroup> {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n selects=\"multiple\"\n .selected=${selected}\n >\n <sp-action-button value=\"first\" class=\"first\">\n First\n </sp-action-button>\n <sp-action-button value=\"second\" class=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n return el;\n}\n\ndescribe('ActionGroup', () => {\n it('loads empty action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group></sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n testForLitDevWarnings(\n async () =>\n await fixture<ActionGroup>(\n html`\n <sp-action-group aria-label=\"Default Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n )\n );\n it('loads default action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group aria-label=\"Default Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal('Default Group');\n expect(el.getAttribute('role')).to.equal('toolbar');\n expect(el.children[0].getAttribute('role')).to.equal('button');\n });\n it('applies `quiet` attribute to its children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group quiet>\n <sp-action-button id=\"first\">First</sp-action-button>\n <sp-action-button id=\"second\">Second</sp-action-button>\n </sp-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `quiet` attribute to its slotted children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <quiet-action-group>\n <sp-action-button slot=\"first\" id=\"first\">\n First\n </sp-action-button>\n <sp-action-button slot=\"second\" id=\"second\">\n Second\n </sp-action-button>\n </quiet-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `emphasized` attribute to its slotted children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <emphasized-action-group>\n <sp-action-button slot=\"first\" id=\"first\">\n First\n </sp-action-button>\n <sp-action-button slot=\"second\" id=\"second\">\n Second\n </sp-action-button>\n </emphasized-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('emphasized')).to.be.true;\n expect(firstButton.emphasized).to.be.true;\n expect(secondButton.hasAttribute('emphasized')).to.be.true;\n expect(secondButton.emphasized).to.be.true;\n });\n it('applies `quiet` attribute to slotted children with overlays', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <quiet-action-group>\n <overlay-trigger slot=\"first\">\n <sp-action-button slot=\"trigger\" id=\"first\">\n First\n </sp-action-button>\n </overlay-trigger>\n <overlay-trigger slot=\"second\">\n <sp-action-button slot=\"trigger\" id=\"second\">\n Second\n </sp-action-button>\n </overlay-trigger>\n </quiet-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `emphasized` attribute to slotted children with overlays', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <emphasized-action-group>\n <overlay-trigger slot=\"first\">\n <sp-action-button slot=\"trigger\" id=\"first\">\n First\n </sp-action-button>\n </overlay-trigger>\n <overlay-trigger slot=\"second\">\n <sp-action-button slot=\"trigger\" id=\"second\">\n Second\n </sp-action-button>\n </overlay-trigger>\n </emphasized-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('emphasized')).to.be.true;\n expect(firstButton.emphasized).to.be.true;\n expect(secondButton.hasAttribute('emphasized')).to.be.true;\n expect(secondButton.emphasized).to.be.true;\n });\n it('loads [selects=\"single\"] action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal('Selects Single Group');\n expect(el.getAttribute('role')).to.equal('radiogroup');\n expect(el.children[0].getAttribute('role')).to.equal('radio');\n });\n it('loads [selects=\"single\"] action-group w/ selection accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('loads [selects=\"multiple\"] action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal(\n 'Selects Multiple Group'\n );\n expect(el.getAttribute('role')).to.equal('toolbar');\n expect(el.children[0].getAttribute('role')).to.equal('checkbox');\n });\n it('loads [selects=\"multiple\"] action-group w/ selection accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('sets tab stop when [selects=\"single\"] and the initial button is [disabled]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button disabled>First</sp-action-button>\n <sp-action-button class=\"second\">Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n const secondButton = el.querySelector('.second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(secondButton.hasAttribute('tabindex'));\n expect(secondButton.getAttribute('tabindex')).to.equal('0');\n });\n it('surfaces [selects=\"single\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected, '\"Third\" selected').to.deep.equal(['Third']);\n });\n it('surfaces [selects=\"multiple\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected, '\"Second\" and \"Third\" selected').to.deep.equal([\n 'Second',\n 'Third',\n ]);\n });\n it('does not select without [selects]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"No Selects Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n });\n it('selects via `click` while [selects=\"single\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button value=\"first\">First</sp-action-button>\n <sp-action-button value=\"second\" selected>\n Second\n </sp-action-button>\n <sp-action-button value=\"third\" class=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected.includes('second'));\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n\n await waitUntil(\n () => el.selected.length === 1 && el.selected.includes('third'),\n 'Updates value of `selected`'\n );\n });\n it('selects via `click` while [selects=\"multiple\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button selected class=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\">Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected.includes('First'));\n\n firstElement.click();\n secondElement.click();\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second child selected').to.be.true;\n expect(thirdElement.selected, 'third child selected').to.be.true;\n\n await waitUntil(\n () =>\n el.selected.length === 2 &&\n el.selected.includes('Second') &&\n el.selected.includes('Third'),\n 'Updates value of `selected`'\n );\n });\n it('does not respond to clicks on itself', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n el.click();\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(0);\n });\n it('selection can be prevented', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child not selected').to.be.false;\n expect(el.selected.length).to.equal(0);\n });\n\n it('selects user-passed value while [selects=\"single\"]', async () => {\n const el = await singleSelectedActionGroup(['first']);\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button not selected').to.be.false;\n\n secondButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('selects can be updated while [selects=\"single\"]', async () => {\n const el = await singleSelectedActionGroup(['first']);\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button not selected').to.be.false;\n\n el.selected = ['second'];\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('selects user-passed value while [selects=\"multiple\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n .selected=${['first', 'second']}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n <sp-action-button class=\"third \" value=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n const thirdButton = el.querySelector('.third') as ActionButton;\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button not selected').to.be.false;\n\n thirdButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(3);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n\n firstButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n });\n\n it('selects can be updated while [selects=\"multiple\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n .selected=${['first', 'second']}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n <sp-action-button class=\"third \" value=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n const thirdButton = el.querySelector('.third') as ActionButton;\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button not selected').to.be.false;\n\n el.selected = ['first', 'second', 'third'];\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(3);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n\n el.selected = ['second', 'third'];\n await elementUpdated(el);\n\n expect(el.selected.length, JSON.stringify(el.selected)).to.equal(2);\n expect(firstButton.selected, 'first button not selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(thirdButton.selected, 'third button selected').to.be.true;\n });\n\n it('selects multiple user-passed values while [selects=\"single\"], but then proceeds with radio-button style functionality', async () => {\n const el = await singleSelectedActionGroup(['first', 'second']);\n await elementUpdated(el);\n expect(el.selected.length).to.equal(2);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.true;\n\n secondButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button selected').to.be.false;\n expect(secondButton.selected, 'second button selected').to.be.true;\n });\n\n it('only selects user-passed buttons if present in action-group while [selects=\"multiple\"]', async () => {\n const el = await multipleSelectedActionGroup(['second', 'fourth']);\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(secondButton.selected, 'second button selected').to.be.true;\n\n const firstButton = el.querySelector('.first') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.false;\n });\n\n it('selects user-passed values with no .selects value, but does not allow interaction afterwards', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n .selected=${['first']}\n >\n <sp-action-button value=\"first\" class=\"first\">\n First\n </sp-action-button>\n <sp-action-button value=\"second\" class=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n const firstButton = el.querySelector('.first') as ActionButton;\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.false;\n\n secondButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(secondButton.selected, 'second button selected').to.be.false;\n });\n\n it('selects multiple buttons if .selected is passed in, but does not allow further interaction afterwards', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects User-Chosen Buttons\"\n .selected=${['first', 'second']}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('toolbar');\n expect(el.selected.length).to.equal(2);\n\n const firstButton = el.querySelector('.first') as ActionButton;\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(firstButton.hasAttribute('aria-checked')).to.be.false;\n expect(\n firstButton.getAttribute('aria-pressed'),\n 'first button aria-pressed'\n ).to.eq('true');\n expect(firstButton.getAttribute('role'), 'first button role').to.eq(\n 'button'\n );\n\n const secondButton = el.querySelector('.second') as ActionButton;\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(secondButton.hasAttribute('aria-checked')).to.be.false;\n expect(\n secondButton.getAttribute('aria-pressed'),\n 'second button aria-pressed'\n ).to.eq('true');\n expect(secondButton.getAttribute('role'), 'first button role').to.eq(\n 'button'\n );\n\n firstButton.click();\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(2);\n expect(firstButton.selected, 'first button selected').to.be.true;\n expect(firstButton.hasAttribute('aria-checked')).to.be.false;\n expect(\n firstButton.getAttribute('aria-pressed'),\n 'first button aria-pressed'\n ).to.eq('true');\n expect(firstButton.getAttribute('role'), 'first button role').to.eq(\n 'button'\n );\n\n expect(secondButton.selected, 'second button selected').to.be.true;\n expect(secondButton.hasAttribute('aria-checked')).to.be.false;\n expect(\n secondButton.getAttribute('aria-pressed'),\n 'second button aria-pressed'\n ).to.eq('true');\n expect(secondButton.getAttribute('role'), 'first button role').to.eq(\n 'button'\n );\n });\n\n it('will not change .selected state if event is prevented while [selects=\"multiple\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n .selected=${['first', 'second']}\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n <sp-action-button class=\"third \" value=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n // checking if the first and second are selected\n await elementUpdated(el);\n expect(el.selected.length).to.equal(2);\n expect(firstElement.selected, 'first child selected').to.be.true;\n expect(secondElement.selected, 'second child selected').to.be.true;\n\n // making sure third element isn't selected\n thirdElement.click();\n await elementUpdated(el);\n expect(thirdElement.selected, 'third child not selected').to.be.false;\n expect(el.selected.length).to.equal(2);\n\n // making sure already-selected elements are not de-selected\n secondElement.click();\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second element still selected').to.be\n .true;\n });\n\n it('will not change .selected state if event is prevented while [selects=\"single\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n .selected=${['first']}\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n // checking if the first element is selected\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n\n // making sure third element isn't selected\n secondElement.click();\n\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second child not selected').to.be.false;\n expect(el.selected.length).to.equal(1);\n\n // making sure already-selected elements are not de-selected\n firstElement.click();\n await elementUpdated(el);\n\n expect(firstElement.selected, 'first element still selected').to.be\n .true;\n });\n\n it('will not change .selected state if event is prevented while selects is undefined', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n .selected=${['first']}\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n // checking if the first element is selected\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n\n secondElement.click();\n await elementUpdated(el);\n\n // state should be exactly the same\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n expect(secondElement.selected, 'second child not selected').to.be.false;\n });\n\n it('maintains a `size` attribute', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group>\n <sp-action-button>Button</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n expect(el.size).to.equal('m');\n expect(el.getAttribute('size')).to.equal('m');\n el.removeAttribute('size');\n await elementUpdated(el);\n expect(el.size).to.equal('m');\n expect(el.getAttribute('size')).to.equal('m');\n });\n\n it('will accept selected as a JSON string', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n selected='[\"first\"]'\n >\n <sp-action-button class=\"first\" value=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\" value=\"second\">\n Second\n </sp-action-button>\n </sp-action-group>\n `\n );\n // checking if the first element is selected\n await elementUpdated(el);\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n expect(el.selected.length).to.equal(1);\n expect(firstElement.selected, 'first child selected').to.be.true;\n expect(secondElement.selected, 'second child selected').to.be.false;\n });\n\n it('accepts role attribute override', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group role=\"group\">\n <sp-action-button>Button</sp-action-button>\n </sp-action-group>\n `\n );\n\n // with a role of group, the role should not be overridden\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('group');\n\n // setting selects to single should override role to radiogroup\n el.setAttribute('selects', 'single');\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('radiogroup');\n\n // setting selects to multiple should override role to toolbar\n el.setAttribute('selects', 'multiple');\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('toolbar');\n\n // by default, role should be toolbar\n el.removeAttribute('role');\n el.removeAttribute('selects');\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('toolbar');\n });\n\n const acceptKeyboardInput = async (el: ActionGroup): Promise<void> => {\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n el.dispatchEvent(arrowRightEvent());\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowLeftEvent());\n el.dispatchEvent(arrowUpEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n\n el.dispatchEvent(endEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n await sendKeys({ press: 'Enter' });\n\n el.dispatchEvent(homeEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowDownEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n };\n it('accepts keybord input', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n await acceptKeyboardInput(el);\n });\n it('accepts keybord input with tooltip', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">\n First\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n Definitely the first one.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" selected>\n Second\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n Not the first, not the last.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" class=\"third\">\n Third\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">Select me.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n `\n );\n await acceptKeyboardInput(el);\n });\n it('accepts keybord input when [dir=\"ltr\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n dir=\"ltr\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button disabled>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n el.dispatchEvent(arrowRightEvent());\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowUpEvent());\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n });\n});\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|