@spectrum-web-components/accordion 1.12.1 → 1.12.2
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/custom-elements.json +7 -2
- package/package.json +6 -6
- package/src/Accordion.d.ts +4 -0
- package/src/Accordion.dev.js +29 -0
- package/src/Accordion.dev.js.map +2 -2
- package/src/Accordion.js +2 -2
- package/src/Accordion.js.map +3 -3
- package/src/AccordionItem.d.ts +8 -1
- package/src/AccordionItem.dev.js +17 -0
- package/src/AccordionItem.dev.js.map +2 -2
- package/src/AccordionItem.js +11 -11
- package/src/AccordionItem.js.map +3 -3
package/custom-elements.json
CHANGED
|
@@ -112,7 +112,8 @@
|
|
|
112
112
|
"type": {
|
|
113
113
|
"text": "void"
|
|
114
114
|
}
|
|
115
|
-
}
|
|
115
|
+
},
|
|
116
|
+
"deprecated": "`focus()` on `<sp-accordion>` is deprecated and will be removed\nin Spectrum 2. Focus the header button inside `<sp-accordion-item>` instead."
|
|
116
117
|
},
|
|
117
118
|
{
|
|
118
119
|
"kind": "method",
|
|
@@ -230,6 +231,7 @@
|
|
|
230
231
|
},
|
|
231
232
|
"privacy": "public",
|
|
232
233
|
"default": "''",
|
|
234
|
+
"deprecated": "The `label` attribute is deprecated and will be removed in\nSpectrum 2.",
|
|
233
235
|
"attribute": "label",
|
|
234
236
|
"reflects": true
|
|
235
237
|
},
|
|
@@ -253,6 +255,7 @@
|
|
|
253
255
|
"privacy": "public",
|
|
254
256
|
"default": "3",
|
|
255
257
|
"description": "The heading level (2-6) to use for the accordion item title.\nThis property is set by the parent sp-accordion element.\nDefaults to 3.",
|
|
258
|
+
"deprecated": "The `level` attribute on accordion items is deprecated and will\nbe removed in Spectrum 2. Use `level` on `<sp-accordion>` instead.",
|
|
256
259
|
"attribute": "level",
|
|
257
260
|
"reflects": true
|
|
258
261
|
},
|
|
@@ -317,7 +320,7 @@
|
|
|
317
320
|
"type": {
|
|
318
321
|
"text": "CustomEvent"
|
|
319
322
|
},
|
|
320
|
-
"description": "Announce that an accordion item has been toggled while allowing the event to be cancelled."
|
|
323
|
+
"description": "Announce that an accordion item has been toggled while allowing the event to be cancelled. In Spectrum 2, this event is renamed to `swc-accordion-item-toggle`."
|
|
321
324
|
}
|
|
322
325
|
],
|
|
323
326
|
"attributes": [
|
|
@@ -335,6 +338,7 @@
|
|
|
335
338
|
"text": "string"
|
|
336
339
|
},
|
|
337
340
|
"default": "''",
|
|
341
|
+
"deprecated": "The `label` attribute is deprecated and will be removed in\nSpectrum 2.",
|
|
338
342
|
"fieldName": "label"
|
|
339
343
|
},
|
|
340
344
|
{
|
|
@@ -352,6 +356,7 @@
|
|
|
352
356
|
},
|
|
353
357
|
"default": "3",
|
|
354
358
|
"description": "The heading level (2-6) to use for the accordion item title.\nThis property is set by the parent sp-accordion element.\nDefaults to 3.",
|
|
359
|
+
"deprecated": "The `level` attribute on accordion items is deprecated and will\nbe removed in Spectrum 2. Use `level` on `<sp-accordion>` instead.",
|
|
355
360
|
"fieldName": "level"
|
|
356
361
|
}
|
|
357
362
|
],
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/accordion",
|
|
3
|
-
"version": "1.12.
|
|
3
|
+
"version": "1.12.2",
|
|
4
4
|
"description": "",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Adobe",
|
|
@@ -64,11 +64,11 @@
|
|
|
64
64
|
],
|
|
65
65
|
"types": "./src/index.d.ts",
|
|
66
66
|
"dependencies": {
|
|
67
|
-
"@spectrum-web-components/base": "1.12.
|
|
68
|
-
"@spectrum-web-components/icon": "1.12.
|
|
69
|
-
"@spectrum-web-components/icons-ui": "1.12.
|
|
70
|
-
"@spectrum-web-components/reactive-controllers": "1.12.
|
|
71
|
-
"@spectrum-web-components/shared": "1.12.
|
|
67
|
+
"@spectrum-web-components/base": "1.12.2",
|
|
68
|
+
"@spectrum-web-components/icon": "1.12.2",
|
|
69
|
+
"@spectrum-web-components/icons-ui": "1.12.2",
|
|
70
|
+
"@spectrum-web-components/reactive-controllers": "1.12.2",
|
|
71
|
+
"@spectrum-web-components/shared": "1.12.2"
|
|
72
72
|
},
|
|
73
73
|
"keywords": [
|
|
74
74
|
"design-system",
|
package/src/Accordion.d.ts
CHANGED
|
@@ -35,6 +35,10 @@ export declare class Accordion extends Accordion_base {
|
|
|
35
35
|
private defaultNodes;
|
|
36
36
|
private get items();
|
|
37
37
|
focusGroupController: FocusGroupController<AccordionItem>;
|
|
38
|
+
/**
|
|
39
|
+
* @deprecated `focus()` on `<sp-accordion>` is deprecated and will be removed
|
|
40
|
+
* in Spectrum 2. Focus the header button inside `<sp-accordion-item>` instead.
|
|
41
|
+
*/
|
|
38
42
|
focus(): void;
|
|
39
43
|
private onToggle;
|
|
40
44
|
private handleSlotchange;
|
package/src/Accordion.dev.js
CHANGED
|
@@ -20,6 +20,7 @@ import {
|
|
|
20
20
|
} from "@spectrum-web-components/base/src/decorators.js";
|
|
21
21
|
import { FocusGroupController } from "@spectrum-web-components/reactive-controllers/src/FocusGroup.js";
|
|
22
22
|
import styles from "./accordion.css.js";
|
|
23
|
+
const ACCORDION_MIGRATION_DOC_URL = "https://opensource.adobe.com/spectrum-web-components/components/accordion/";
|
|
23
24
|
export class Accordion extends SizedMixin(SpectrumElement, {
|
|
24
25
|
noDefaultSize: true
|
|
25
26
|
}) {
|
|
@@ -41,7 +42,19 @@ export class Accordion extends SizedMixin(SpectrumElement, {
|
|
|
41
42
|
(node) => typeof node.tagName !== "undefined"
|
|
42
43
|
);
|
|
43
44
|
}
|
|
45
|
+
/**
|
|
46
|
+
* @deprecated `focus()` on `<sp-accordion>` is deprecated and will be removed
|
|
47
|
+
* in Spectrum 2. Focus the header button inside `<sp-accordion-item>` instead.
|
|
48
|
+
*/
|
|
44
49
|
focus() {
|
|
50
|
+
if (true) {
|
|
51
|
+
window.__swc.warn(
|
|
52
|
+
this,
|
|
53
|
+
`<${this.localName}> focus() is deprecated and will be removed in Spectrum 2. Focus the header button inside <sp-accordion-item> instead.`,
|
|
54
|
+
ACCORDION_MIGRATION_DOC_URL,
|
|
55
|
+
{ level: "deprecation" }
|
|
56
|
+
);
|
|
57
|
+
}
|
|
45
58
|
this.focusGroupController.focus();
|
|
46
59
|
}
|
|
47
60
|
async onToggle(event) {
|
|
@@ -63,6 +76,14 @@ export class Accordion extends SizedMixin(SpectrumElement, {
|
|
|
63
76
|
handleSlotchange() {
|
|
64
77
|
this.focusGroupController.clearElementCache();
|
|
65
78
|
this.items.forEach((item) => {
|
|
79
|
+
if (item.level !== this.level) {
|
|
80
|
+
window.__swc.warn(
|
|
81
|
+
item,
|
|
82
|
+
`<${item.localName}> the "level" attribute is deprecated on accordion items and will be removed in Spectrum 2. Use "level" on <${this.localName}> instead.`,
|
|
83
|
+
ACCORDION_MIGRATION_DOC_URL,
|
|
84
|
+
{ level: "deprecation" }
|
|
85
|
+
);
|
|
86
|
+
}
|
|
66
87
|
item.size = this.size;
|
|
67
88
|
item.level = this.level;
|
|
68
89
|
});
|
|
@@ -76,6 +97,14 @@ export class Accordion extends SizedMixin(SpectrumElement, {
|
|
|
76
97
|
}
|
|
77
98
|
if (changed.has("level")) {
|
|
78
99
|
this.items.forEach((item) => {
|
|
100
|
+
if (item.level !== this.level) {
|
|
101
|
+
window.__swc.warn(
|
|
102
|
+
item,
|
|
103
|
+
`<${item.localName}> the "level" attribute is deprecated on accordion items and will be removed in Spectrum 2. Use "level" on <${this.localName}> instead.`,
|
|
104
|
+
ACCORDION_MIGRATION_DOC_URL,
|
|
105
|
+
{ level: "deprecation" }
|
|
106
|
+
);
|
|
107
|
+
}
|
|
79
108
|
item.level = this.level;
|
|
80
109
|
});
|
|
81
110
|
}
|
package/src/Accordion.dev.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Accordion.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 {\n property,\n queryAssignedNodes,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { FocusGroupController } from '@spectrum-web-components/reactive-controllers/src/FocusGroup.js';\n\nimport styles from './accordion.css.js';\nimport { AccordionItem } from './AccordionItem.dev.js'\n\n/**\n * @element sp-accordion\n * @slot - The sp-accordion-item children to display.\n */\nexport class Accordion extends SizedMixin(SpectrumElement, {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n /**\n * Allows multiple accordion items to be opened at the same time\n */\n @property({ type: Boolean, reflect: true, attribute: 'allow-multiple' })\n public allowMultiple = false;\n\n /**\n * Sets the spacing between the content to borders of an accordion item\n */\n @property({ type: String, reflect: true })\n public density?: 'compact' | 'spacious';\n\n /**\n * The heading level (2-6) to use for all accordion item titles.\n * Defaults to 3.\n */\n @property({ type: Number, reflect: true })\n public level: number = 3;\n\n @queryAssignedNodes()\n private defaultNodes!: NodeListOf<AccordionItem>;\n\n private get items(): AccordionItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== 'undefined'\n ) as AccordionItem[];\n }\n\n focusGroupController = new FocusGroupController<AccordionItem>(this, {\n direction: 'vertical',\n elements: () => this.items,\n isFocusableElement: (el: AccordionItem) => !el.disabled,\n });\n\n public override focus(): void {\n this.focusGroupController.focus();\n }\n\n private async onToggle(event: Event): Promise<void> {\n const target = event.target as AccordionItem;\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n await 0;\n if (this.allowMultiple || event.defaultPrevented) {\n // No toggling when `allowMultiple` or the user prevents it.\n return;\n }\n const items = [...this.items] as AccordionItem[];\n /* c8 ignore next 3 */\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach((item) => {\n if (item !== target) {\n // Close all the items that didn't dispatch the event.\n item.open = false;\n }\n });\n }\n\n private handleSlotchange(): void {\n this.focusGroupController.clearElementCache();\n this.items.forEach((item) => {\n item.size = this.size;\n item.level = this.level;\n });\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n super.updated(changed);\n if (changed.has('size')) {\n this.items.forEach((item) => {\n item.size = this.size;\n });\n }\n if (changed.has('level')) {\n this.items.forEach((item) => {\n item.level = this.level;\n });\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot\n @slotchange=${this.handleSlotchange}\n @sp-accordion-item-toggle=${this.onToggle}\n ></slot>\n `;\n }\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;AAYA;AAAA,EAEE;AAAA,EAEA;AAAA,EACA;AAAA,OAEK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,4BAA4B;AAErC,OAAO,YAAY;
|
|
4
|
+
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 {\n property,\n queryAssignedNodes,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { FocusGroupController } from '@spectrum-web-components/reactive-controllers/src/FocusGroup.js';\n\nimport styles from './accordion.css.js';\nimport { AccordionItem } from './AccordionItem.dev.js'\n\nconst ACCORDION_MIGRATION_DOC_URL =\n 'https://opensource.adobe.com/spectrum-web-components/components/accordion/';\n\n/**\n * @element sp-accordion\n * @slot - The sp-accordion-item children to display.\n */\nexport class Accordion extends SizedMixin(SpectrumElement, {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n /**\n * Allows multiple accordion items to be opened at the same time\n */\n @property({ type: Boolean, reflect: true, attribute: 'allow-multiple' })\n public allowMultiple = false;\n\n /**\n * Sets the spacing between the content to borders of an accordion item\n */\n @property({ type: String, reflect: true })\n public density?: 'compact' | 'spacious';\n\n /**\n * The heading level (2-6) to use for all accordion item titles.\n * Defaults to 3.\n */\n @property({ type: Number, reflect: true })\n public level: number = 3;\n\n @queryAssignedNodes()\n private defaultNodes!: NodeListOf<AccordionItem>;\n\n private get items(): AccordionItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== 'undefined'\n ) as AccordionItem[];\n }\n\n focusGroupController = new FocusGroupController<AccordionItem>(this, {\n direction: 'vertical',\n elements: () => this.items,\n isFocusableElement: (el: AccordionItem) => !el.disabled,\n });\n\n /**\n * @deprecated `focus()` on `<sp-accordion>` is deprecated and will be removed\n * in Spectrum 2. Focus the header button inside `<sp-accordion-item>` instead.\n */\n public override focus(): void {\n if (window.__swc?.DEBUG) {\n window.__swc.warn(\n this,\n `<${this.localName}> focus() is deprecated and will be removed in Spectrum 2. Focus the header button inside <sp-accordion-item> instead.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n this.focusGroupController.focus();\n }\n\n private async onToggle(event: Event): Promise<void> {\n const target = event.target as AccordionItem;\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n await 0;\n if (this.allowMultiple || event.defaultPrevented) {\n // No toggling when `allowMultiple` or the user prevents it.\n return;\n }\n const items = [...this.items] as AccordionItem[];\n /* c8 ignore next 3 */\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach((item) => {\n if (item !== target) {\n // Close all the items that didn't dispatch the event.\n item.open = false;\n }\n });\n }\n\n private handleSlotchange(): void {\n this.focusGroupController.clearElementCache();\n this.items.forEach((item) => {\n if (window.__swc?.DEBUG && item.level !== this.level) {\n window.__swc.warn(\n item,\n `<${item.localName}> the \"level\" attribute is deprecated on accordion items and will be removed in Spectrum 2. Use \"level\" on <${this.localName}> instead.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n item.size = this.size;\n item.level = this.level;\n });\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n super.updated(changed);\n if (changed.has('size')) {\n this.items.forEach((item) => {\n item.size = this.size;\n });\n }\n if (changed.has('level')) {\n this.items.forEach((item) => {\n if (window.__swc?.DEBUG && item.level !== this.level) {\n window.__swc.warn(\n item,\n `<${item.localName}> the \"level\" attribute is deprecated on accordion items and will be removed in Spectrum 2. Use \"level\" on <${this.localName}> instead.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n item.level = this.level;\n });\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot\n @slotchange=${this.handleSlotchange}\n @sp-accordion-item-toggle=${this.onToggle}\n ></slot>\n `;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/Accordion.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var n=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var r=(s,l,e,i)=>{for(var t=i>1?void 0:i?d(l,e):l,o=s.length-1,a;o>=0;o--)(a=s[o])&&(t=(i?a(l,e,t):a(t))||t);return i&&t&&n(l,e,t),t};import{html as m,SizedMixin as u,SpectrumElement as p}from"@spectrum-web-components/base";import{property as c,queryAssignedNodes as h}from"@spectrum-web-components/base/src/decorators.js";import{FocusGroupController as f}from"@spectrum-web-components/reactive-controllers/src/FocusGroup.js";import v from"./accordion.css.js";const y="https://opensource.adobe.com/spectrum-web-components/components/accordion/";export class Accordion extends u(p,{noDefaultSize:!0}){constructor(){super(...arguments);this.allowMultiple=!1;this.level=3;this.focusGroupController=new f(this,{direction:"vertical",elements:()=>this.items,isFocusableElement:e=>!e.disabled})}static get styles(){return[v]}get items(){return[...this.defaultNodes||[]].filter(e=>typeof e.tagName!="undefined")}focus(){this.focusGroupController.focus()}async onToggle(e){const i=e.target;if(await 0,this.allowMultiple||e.defaultPrevented)return;const t=[...this.items];t&&!t.length||t.forEach(o=>{o!==i&&(o.open=!1)})}handleSlotchange(){this.focusGroupController.clearElementCache(),this.items.forEach(e=>{e.size=this.size,e.level=this.level})}updated(e){super.updated(e),e.has("size")&&this.items.forEach(i=>{i.size=this.size}),e.has("level")&&this.items.forEach(i=>{i.level=this.level})}render(){return m`
|
|
2
2
|
<slot
|
|
3
3
|
@slotchange=${this.handleSlotchange}
|
|
4
4
|
@sp-accordion-item-toggle=${this.onToggle}
|
|
5
5
|
></slot>
|
|
6
|
-
`}}
|
|
6
|
+
`}}r([c({type:Boolean,reflect:!0,attribute:"allow-multiple"})],Accordion.prototype,"allowMultiple",2),r([c({type:String,reflect:!0})],Accordion.prototype,"density",2),r([c({type:Number,reflect:!0})],Accordion.prototype,"level",2),r([h()],Accordion.prototype,"defaultNodes",2);
|
|
7
7
|
//# sourceMappingURL=Accordion.js.map
|
package/src/Accordion.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Accordion.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 {\n property,\n queryAssignedNodes,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { FocusGroupController } from '@spectrum-web-components/reactive-controllers/src/FocusGroup.js';\n\nimport styles from './accordion.css.js';\nimport { AccordionItem } from './AccordionItem.js';\n\n/**\n * @element sp-accordion\n * @slot - The sp-accordion-item children to display.\n */\nexport class Accordion extends SizedMixin(SpectrumElement, {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n /**\n * Allows multiple accordion items to be opened at the same time\n */\n @property({ type: Boolean, reflect: true, attribute: 'allow-multiple' })\n public allowMultiple = false;\n\n /**\n * Sets the spacing between the content to borders of an accordion item\n */\n @property({ type: String, reflect: true })\n public density?: 'compact' | 'spacious';\n\n /**\n * The heading level (2-6) to use for all accordion item titles.\n * Defaults to 3.\n */\n @property({ type: Number, reflect: true })\n public level: number = 3;\n\n @queryAssignedNodes()\n private defaultNodes!: NodeListOf<AccordionItem>;\n\n private get items(): AccordionItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== 'undefined'\n ) as AccordionItem[];\n }\n\n focusGroupController = new FocusGroupController<AccordionItem>(this, {\n direction: 'vertical',\n elements: () => this.items,\n isFocusableElement: (el: AccordionItem) => !el.disabled,\n });\n\n public override focus(): void {\n this.focusGroupController.focus();\n }\n\n private async onToggle(event: Event): Promise<void> {\n const target = event.target as AccordionItem;\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n await 0;\n if (this.allowMultiple || event.defaultPrevented) {\n // No toggling when `allowMultiple` or the user prevents it.\n return;\n }\n const items = [...this.items] as AccordionItem[];\n /* c8 ignore next 3 */\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach((item) => {\n if (item !== target) {\n // Close all the items that didn't dispatch the event.\n item.open = false;\n }\n });\n }\n\n private handleSlotchange(): void {\n this.focusGroupController.clearElementCache();\n this.items.forEach((item) => {\n item.size = this.size;\n item.level = this.level;\n });\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n super.updated(changed);\n if (changed.has('size')) {\n this.items.forEach((item) => {\n item.size = this.size;\n });\n }\n if (changed.has('level')) {\n this.items.forEach((item) => {\n item.level = this.level;\n });\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot\n @slotchange=${this.handleSlotchange}\n @sp-accordion-item-toggle=${this.onToggle}\n ></slot>\n `;\n }\n}\n"],
|
|
5
|
-
"mappings": "qNAYA,OAEE,QAAAA,EAEA,cAAAC,EACA,mBAAAC,MAEK,gCACP,OACE,YAAAC,EACA,sBAAAC,MACK,kDACP,OAAS,wBAAAC,MAA4B,kEAErC,OAAOC,MAAY,
|
|
6
|
-
"names": ["html", "SizedMixin", "SpectrumElement", "property", "queryAssignedNodes", "FocusGroupController", "styles", "el", "node", "event", "target", "items", "item", "changed", "__decorateClass"]
|
|
4
|
+
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing 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 {\n property,\n queryAssignedNodes,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { FocusGroupController } from '@spectrum-web-components/reactive-controllers/src/FocusGroup.js';\n\nimport styles from './accordion.css.js';\nimport { AccordionItem } from './AccordionItem.js';\n\nconst ACCORDION_MIGRATION_DOC_URL =\n 'https://opensource.adobe.com/spectrum-web-components/components/accordion/';\n\n/**\n * @element sp-accordion\n * @slot - The sp-accordion-item children to display.\n */\nexport class Accordion extends SizedMixin(SpectrumElement, {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n /**\n * Allows multiple accordion items to be opened at the same time\n */\n @property({ type: Boolean, reflect: true, attribute: 'allow-multiple' })\n public allowMultiple = false;\n\n /**\n * Sets the spacing between the content to borders of an accordion item\n */\n @property({ type: String, reflect: true })\n public density?: 'compact' | 'spacious';\n\n /**\n * The heading level (2-6) to use for all accordion item titles.\n * Defaults to 3.\n */\n @property({ type: Number, reflect: true })\n public level: number = 3;\n\n @queryAssignedNodes()\n private defaultNodes!: NodeListOf<AccordionItem>;\n\n private get items(): AccordionItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== 'undefined'\n ) as AccordionItem[];\n }\n\n focusGroupController = new FocusGroupController<AccordionItem>(this, {\n direction: 'vertical',\n elements: () => this.items,\n isFocusableElement: (el: AccordionItem) => !el.disabled,\n });\n\n /**\n * @deprecated `focus()` on `<sp-accordion>` is deprecated and will be removed\n * in Spectrum 2. Focus the header button inside `<sp-accordion-item>` instead.\n */\n public override focus(): void {\n if (window.__swc?.DEBUG) {\n window.__swc.warn(\n this,\n `<${this.localName}> focus() is deprecated and will be removed in Spectrum 2. Focus the header button inside <sp-accordion-item> instead.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n this.focusGroupController.focus();\n }\n\n private async onToggle(event: Event): Promise<void> {\n const target = event.target as AccordionItem;\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n await 0;\n if (this.allowMultiple || event.defaultPrevented) {\n // No toggling when `allowMultiple` or the user prevents it.\n return;\n }\n const items = [...this.items] as AccordionItem[];\n /* c8 ignore next 3 */\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach((item) => {\n if (item !== target) {\n // Close all the items that didn't dispatch the event.\n item.open = false;\n }\n });\n }\n\n private handleSlotchange(): void {\n this.focusGroupController.clearElementCache();\n this.items.forEach((item) => {\n if (window.__swc?.DEBUG && item.level !== this.level) {\n window.__swc.warn(\n item,\n `<${item.localName}> the \"level\" attribute is deprecated on accordion items and will be removed in Spectrum 2. Use \"level\" on <${this.localName}> instead.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n item.size = this.size;\n item.level = this.level;\n });\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n super.updated(changed);\n if (changed.has('size')) {\n this.items.forEach((item) => {\n item.size = this.size;\n });\n }\n if (changed.has('level')) {\n this.items.forEach((item) => {\n if (window.__swc?.DEBUG && item.level !== this.level) {\n window.__swc.warn(\n item,\n `<${item.localName}> the \"level\" attribute is deprecated on accordion items and will be removed in Spectrum 2. Use \"level\" on <${this.localName}> instead.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n item.level = this.level;\n });\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n <slot\n @slotchange=${this.handleSlotchange}\n @sp-accordion-item-toggle=${this.onToggle}\n ></slot>\n `;\n }\n}\n"],
|
|
5
|
+
"mappings": "qNAYA,OAEE,QAAAA,EAEA,cAAAC,EACA,mBAAAC,MAEK,gCACP,OACE,YAAAC,EACA,sBAAAC,MACK,kDACP,OAAS,wBAAAC,MAA4B,kEAErC,OAAOC,MAAY,qBAGnB,MAAMC,EACJ,6EAMK,aAAM,kBAAkBN,EAAWC,EAAiB,CACzD,cAAe,EACjB,CAAC,CAAE,CAFI,kCAWL,KAAO,cAAgB,GAavB,KAAO,MAAgB,EAWvB,0BAAuB,IAAIG,EAAoC,KAAM,CACnE,UAAW,WACX,SAAU,IAAM,KAAK,MACrB,mBAAqBG,GAAsB,CAACA,EAAG,QACjD,CAAC,EApCD,WAA2B,QAAyB,CAClD,MAAO,CAACF,CAAM,CAChB,CAwBA,IAAY,OAAyB,CACnC,MAAO,CAAC,GAAI,KAAK,cAAgB,CAAC,CAAE,EAAE,OACnCG,GAAsB,OAAOA,EAAK,SAAY,WACjD,CACF,CAYgB,OAAc,CAS5B,KAAK,qBAAqB,MAAM,CAClC,CAEA,MAAc,SAASC,EAA6B,CAClD,MAAMC,EAASD,EAAM,OAIrB,GADA,KAAM,GACF,KAAK,eAAiBA,EAAM,iBAE9B,OAEF,MAAME,EAAQ,CAAC,GAAG,KAAK,KAAK,EAExBA,GAAS,CAACA,EAAM,QAIpBA,EAAM,QAASC,GAAS,CAClBA,IAASF,IAEXE,EAAK,KAAO,GAEhB,CAAC,CACH,CAEQ,kBAAyB,CAC/B,KAAK,qBAAqB,kBAAkB,EAC5C,KAAK,MAAM,QAASA,GAAS,CAS3BA,EAAK,KAAO,KAAK,KACjBA,EAAK,MAAQ,KAAK,KACpB,CAAC,CACH,CAEmB,QAAQC,EAAqC,CAC9D,MAAM,QAAQA,CAAO,EACjBA,EAAQ,IAAI,MAAM,GACpB,KAAK,MAAM,QAASD,GAAS,CAC3BA,EAAK,KAAO,KAAK,IACnB,CAAC,EAECC,EAAQ,IAAI,OAAO,GACrB,KAAK,MAAM,QAASD,GAAS,CAS3BA,EAAK,MAAQ,KAAK,KACpB,CAAC,CAEL,CAEmB,QAAyB,CAC1C,OAAOb;AAAA;AAAA,sBAEW,KAAK,gBAAgB;AAAA,oCACP,KAAK,QAAQ;AAAA;AAAA,KAG/C,CACF,CAnHSe,EAAA,CADNZ,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,gBAAiB,CAAC,GAV5D,UAWJ,6BAMAY,EAAA,CADNZ,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAhB9B,UAiBJ,uBAOAY,EAAA,CADNZ,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAvB9B,UAwBJ,qBAGCY,EAAA,CADPX,EAAmB,GA1BT,UA2BH",
|
|
6
|
+
"names": ["html", "SizedMixin", "SpectrumElement", "property", "queryAssignedNodes", "FocusGroupController", "styles", "ACCORDION_MIGRATION_DOC_URL", "el", "node", "event", "target", "items", "item", "changed", "__decorateClass"]
|
|
7
7
|
}
|
package/src/AccordionItem.d.ts
CHANGED
|
@@ -16,17 +16,24 @@ declare const AccordionItem_base: typeof Focusable & import("@spectrum-web-compo
|
|
|
16
16
|
/**
|
|
17
17
|
* @element sp-accordion-item
|
|
18
18
|
* @slot - The content of the item that is hidden when the item is not open
|
|
19
|
-
* @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled.
|
|
19
|
+
* @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled. In Spectrum 2, this event is renamed to `swc-accordion-item-toggle`.
|
|
20
20
|
*/
|
|
21
21
|
export declare class AccordionItem extends AccordionItem_base {
|
|
22
22
|
static get styles(): CSSResultArray;
|
|
23
23
|
open: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* @deprecated The `label` attribute is deprecated and will be removed in
|
|
26
|
+
* Spectrum 2.
|
|
27
|
+
*/
|
|
24
28
|
label: string;
|
|
25
29
|
disabled: boolean;
|
|
26
30
|
/**
|
|
27
31
|
* The heading level (2-6) to use for the accordion item title.
|
|
28
32
|
* This property is set by the parent sp-accordion element.
|
|
29
33
|
* Defaults to 3.
|
|
34
|
+
*
|
|
35
|
+
* @deprecated The `level` attribute on accordion items is deprecated and will
|
|
36
|
+
* be removed in Spectrum 2. Use `level` on `<sp-accordion>` instead.
|
|
30
37
|
*/
|
|
31
38
|
level: number;
|
|
32
39
|
get focusElement(): HTMLElement;
|
package/src/AccordionItem.dev.js
CHANGED
|
@@ -53,6 +53,7 @@ const chevronIcon = {
|
|
|
53
53
|
</span>
|
|
54
54
|
`
|
|
55
55
|
};
|
|
56
|
+
const ACCORDION_MIGRATION_DOC_URL = "https://opensource.adobe.com/spectrum-web-components/components/accordion/";
|
|
56
57
|
export class AccordionItem extends SizedMixin(Focusable, {
|
|
57
58
|
noDefaultSize: true
|
|
58
59
|
}) {
|
|
@@ -80,6 +81,14 @@ export class AccordionItem extends SizedMixin(Focusable, {
|
|
|
80
81
|
}
|
|
81
82
|
toggle() {
|
|
82
83
|
this.open = !this.open;
|
|
84
|
+
if (true) {
|
|
85
|
+
window.__swc.warn(
|
|
86
|
+
this,
|
|
87
|
+
`<${this.localName}> the "sp-accordion-item-toggle" event is deprecated and will be renamed to "swc-accordion-item-toggle" in Spectrum 2.`,
|
|
88
|
+
ACCORDION_MIGRATION_DOC_URL,
|
|
89
|
+
{ level: "deprecation" }
|
|
90
|
+
);
|
|
91
|
+
}
|
|
83
92
|
const applyDefault = this.dispatchEvent(
|
|
84
93
|
new CustomEvent("sp-accordion-item-toggle", {
|
|
85
94
|
bubbles: true,
|
|
@@ -150,6 +159,14 @@ export class AccordionItem extends SizedMixin(Focusable, {
|
|
|
150
159
|
this.removeAttribute("aria-disabled");
|
|
151
160
|
}
|
|
152
161
|
}
|
|
162
|
+
if (changes.has("label") && this.label) {
|
|
163
|
+
window.__swc.warn(
|
|
164
|
+
this,
|
|
165
|
+
`<${this.localName}> the "label" attribute is deprecated and will be removed in Spectrum 2.`,
|
|
166
|
+
ACCORDION_MIGRATION_DOC_URL,
|
|
167
|
+
{ level: "deprecation" }
|
|
168
|
+
);
|
|
169
|
+
}
|
|
153
170
|
}
|
|
154
171
|
}
|
|
155
172
|
__decorateClass([
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["AccordionItem.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { when } from '@spectrum-web-components/base/src/directives.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\n\nimport styles from './accordion-item.css.js';\n\nconst chevronIcon: Record<string, () => TemplateResult> = {\n s: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight75\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n m: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight100\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n l: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight200\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n xl: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight300\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n};\n\n/**\n * @element sp-accordion-item\n * @slot - The content of the item that is hidden when the item is not open\n * @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled
|
|
5
|
-
"mappings": ";;;;;;;;;;;AAYA;AAAA,EAEE;AAAA,EAEA;AAAA,OAEK;AACP,SAAS,gBAAgB;AACzB,SAAS,YAAY;AACrB,OAAO,uBAAuB;AAC9B,SAAS,iBAAiB;AAE1B,OAAO;AAEP,OAAO,YAAY;AAEnB,MAAM,cAAoD;AAAA,EACxD,GAAG,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQT,GAAG,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQT,GAAG,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQT,IAAI,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQZ;
|
|
4
|
+
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { when } from '@spectrum-web-components/base/src/directives.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\n\nimport styles from './accordion-item.css.js';\n\nconst chevronIcon: Record<string, () => TemplateResult> = {\n s: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight75\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n m: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight100\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n l: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight200\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n xl: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight300\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n};\n\nconst ACCORDION_MIGRATION_DOC_URL =\n 'https://opensource.adobe.com/spectrum-web-components/components/accordion/';\n\n/**\n * @element sp-accordion-item\n * @slot - The content of the item that is hidden when the item is not open\n * @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled. In Spectrum 2, this event is renamed to `swc-accordion-item-toggle`.\n */\nexport class AccordionItem extends SizedMixin(Focusable, {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles, chevronIconStyles];\n }\n\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * @deprecated The `label` attribute is deprecated and will be removed in\n * Spectrum 2.\n */\n @property({ type: String, reflect: true })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public override disabled = false;\n\n /**\n * The heading level (2-6) to use for the accordion item title.\n * This property is set by the parent sp-accordion element.\n * Defaults to 3.\n *\n * @deprecated The `level` attribute on accordion items is deprecated and will\n * be removed in Spectrum 2. Use `level` on `<sp-accordion>` instead.\n */\n @property({ type: Number, reflect: true })\n public level: number = 3;\n\n public override get focusElement(): HTMLElement {\n return this.shadowRoot.querySelector('#header') as HTMLElement;\n }\n\n private onClick(): void {\n /* c8 ignore next 3 */\n if (this.disabled) {\n return;\n }\n this.toggle();\n }\n\n private toggle(): void {\n this.open = !this.open;\n if (window.__swc?.DEBUG) {\n window.__swc.warn(\n this,\n `<${this.localName}> the \"sp-accordion-item-toggle\" event is deprecated and will be renamed to \"swc-accordion-item-toggle\" in Spectrum 2.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n const applyDefault = this.dispatchEvent(\n new CustomEvent('sp-accordion-item-toggle', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n if (!applyDefault) {\n this.open = !this.open;\n }\n }\n\n protected renderChevronIcon = (): TemplateResult => {\n return chevronIcon[this.size || 'm']();\n };\n\n private getHeadingLevel(): number {\n const level = this.level ?? 3;\n return Math.max(2, Math.min(6, level));\n }\n\n private renderHeading(): TemplateResult {\n const level = this.getHeadingLevel();\n const headingContent = html`\n ${when(this.size, this.renderChevronIcon)}\n <button\n id=\"header\"\n @click=${this.onClick}\n aria-expanded=${this.open}\n aria-controls=\"content\"\n ?disabled=${this.disabled}\n >\n ${this.label}\n </button>\n `;\n\n switch (level) {\n case 2:\n return html`\n <h2 id=\"heading\">${headingContent}</h2>\n `;\n case 4:\n return html`\n <h4 id=\"heading\">${headingContent}</h4>\n `;\n case 5:\n return html`\n <h5 id=\"heading\">${headingContent}</h5>\n `;\n case 6:\n return html`\n <h6 id=\"heading\">${headingContent}</h6>\n `;\n default:\n return html`\n <h3 id=\"heading\">${headingContent}</h3>\n `;\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderHeading()}\n <div id=\"content\" role=\"region\" aria-labelledby=\"header\">\n <slot></slot>\n </div>\n `;\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('disabled')) {\n if (this.disabled) {\n this.setAttribute('aria-disabled', 'true');\n } else {\n this.removeAttribute('aria-disabled');\n }\n }\n if (window.__swc?.DEBUG && changes.has('label') && this.label) {\n window.__swc.warn(\n this,\n `<${this.localName}> the \"label\" attribute is deprecated and will be removed in Spectrum 2.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/AccordionItem.js
CHANGED
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var d=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(a,n,t,e)=>{for(var r=e>1?void 0:e?p(n,t):n,l=a.length-1,c;l>=0;l--)(c=a[l])&&(r=(e?c(n,t,r):c(r))||r);return e&&r&&d(n,t,r),r};import{html as i,SizedMixin as h}from"@spectrum-web-components/base";import{property as s}from"@spectrum-web-components/base/src/decorators.js";import{when as u}from"@spectrum-web-components/base/src/directives.js";import m from"@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js";import{Focusable as v}from"@spectrum-web-components/shared/src/focusable.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js";import b from"./accordion-item.css.js";const g={s:()=>i`
|
|
2
2
|
<span class="iconContainer">
|
|
3
3
|
<sp-icon-chevron100
|
|
4
4
|
class="indicator spectrum-UIIcon-ChevronRight75"
|
|
5
5
|
slot="icon"
|
|
6
6
|
></sp-icon-chevron100>
|
|
7
7
|
</span>
|
|
8
|
-
`,m:()=>
|
|
8
|
+
`,m:()=>i`
|
|
9
9
|
<span class="iconContainer">
|
|
10
10
|
<sp-icon-chevron100
|
|
11
11
|
class="indicator spectrum-UIIcon-ChevronRight100"
|
|
12
12
|
slot="icon"
|
|
13
13
|
></sp-icon-chevron100>
|
|
14
14
|
</span>
|
|
15
|
-
`,l:()=>
|
|
15
|
+
`,l:()=>i`
|
|
16
16
|
<span class="iconContainer">
|
|
17
17
|
<sp-icon-chevron100
|
|
18
18
|
class="indicator spectrum-UIIcon-ChevronRight200"
|
|
19
19
|
slot="icon"
|
|
20
20
|
></sp-icon-chevron100>
|
|
21
21
|
</span>
|
|
22
|
-
`,xl:()=>
|
|
22
|
+
`,xl:()=>i`
|
|
23
23
|
<span class="iconContainer">
|
|
24
24
|
<sp-icon-chevron100
|
|
25
25
|
class="indicator spectrum-UIIcon-ChevronRight300"
|
|
26
26
|
slot="icon"
|
|
27
27
|
></sp-icon-chevron100>
|
|
28
28
|
</span>
|
|
29
|
-
`};export class AccordionItem extends h(
|
|
29
|
+
`},T="https://opensource.adobe.com/spectrum-web-components/components/accordion/";export class AccordionItem extends h(v,{noDefaultSize:!0}){constructor(){super(...arguments);this.open=!1;this.label="";this.disabled=!1;this.level=3;this.renderChevronIcon=()=>g[this.size||"m"]()}static get styles(){return[b,m]}get focusElement(){return this.shadowRoot.querySelector("#header")}onClick(){this.disabled||this.toggle()}toggle(){this.open=!this.open,this.dispatchEvent(new CustomEvent("sp-accordion-item-toggle",{bubbles:!0,composed:!0,cancelable:!0}))||(this.open=!this.open)}getHeadingLevel(){var e;const t=(e=this.level)!=null?e:3;return Math.max(2,Math.min(6,t))}renderHeading(){const t=this.getHeadingLevel(),e=i`
|
|
30
30
|
${u(this.size,this.renderChevronIcon)}
|
|
31
31
|
<button
|
|
32
32
|
id="header"
|
|
@@ -37,17 +37,17 @@
|
|
|
37
37
|
>
|
|
38
38
|
${this.label}
|
|
39
39
|
</button>
|
|
40
|
-
`;switch(t){case 2:return
|
|
40
|
+
`;switch(t){case 2:return i`
|
|
41
41
|
<h2 id="heading">${e}</h2>
|
|
42
|
-
`;case 4:return
|
|
42
|
+
`;case 4:return i`
|
|
43
43
|
<h4 id="heading">${e}</h4>
|
|
44
|
-
`;case 5:return
|
|
44
|
+
`;case 5:return i`
|
|
45
45
|
<h5 id="heading">${e}</h5>
|
|
46
|
-
`;case 6:return
|
|
46
|
+
`;case 6:return i`
|
|
47
47
|
<h6 id="heading">${e}</h6>
|
|
48
|
-
`;default:return
|
|
48
|
+
`;default:return i`
|
|
49
49
|
<h3 id="heading">${e}</h3>
|
|
50
|
-
`}}render(){return
|
|
50
|
+
`}}render(){return i`
|
|
51
51
|
${this.renderHeading()}
|
|
52
52
|
<div id="content" role="region" aria-labelledby="header">
|
|
53
53
|
<slot></slot>
|
package/src/AccordionItem.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["AccordionItem.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { when } from '@spectrum-web-components/base/src/directives.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\n\nimport styles from './accordion-item.css.js';\n\nconst chevronIcon: Record<string, () => TemplateResult> = {\n s: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight75\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n m: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight100\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n l: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight200\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n xl: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight300\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n};\n\n/**\n * @element sp-accordion-item\n * @slot - The content of the item that is hidden when the item is not open\n * @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled
|
|
5
|
-
"mappings": "qNAYA,OAEE,QAAAA,EAEA,cAAAC,MAEK,gCACP,OAAS,YAAAC,MAAgB,kDACzB,OAAS,QAAAC,MAAY,kDACrB,OAAOC,MAAuB,iEAC9B,OAAS,aAAAC,MAAiB,mDAE1B,MAAO,gEAEP,OAAOC,MAAY,0BAEnB,MAAMC,EAAoD,CACxD,EAAG,IAAMP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQT,EAAG,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQT,EAAG,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQT,GAAI,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQZ,
|
|
6
|
-
"names": ["html", "SizedMixin", "property", "when", "chevronIconStyles", "Focusable", "styles", "chevronIcon", "_a", "level", "headingContent", "changes", "__decorateClass"]
|
|
4
|
+
"sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n CSSResultArray,\n html,\n PropertyValues,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { when } from '@spectrum-web-components/base/src/directives.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\n\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\n\nimport styles from './accordion-item.css.js';\n\nconst chevronIcon: Record<string, () => TemplateResult> = {\n s: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight75\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n m: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight100\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n l: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight200\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n xl: () => html`\n <span class=\"iconContainer\">\n <sp-icon-chevron100\n class=\"indicator spectrum-UIIcon-ChevronRight300\"\n slot=\"icon\"\n ></sp-icon-chevron100>\n </span>\n `,\n};\n\nconst ACCORDION_MIGRATION_DOC_URL =\n 'https://opensource.adobe.com/spectrum-web-components/components/accordion/';\n\n/**\n * @element sp-accordion-item\n * @slot - The content of the item that is hidden when the item is not open\n * @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled. In Spectrum 2, this event is renamed to `swc-accordion-item-toggle`.\n */\nexport class AccordionItem extends SizedMixin(Focusable, {\n noDefaultSize: true,\n}) {\n public static override get styles(): CSSResultArray {\n return [styles, chevronIconStyles];\n }\n\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * @deprecated The `label` attribute is deprecated and will be removed in\n * Spectrum 2.\n */\n @property({ type: String, reflect: true })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public override disabled = false;\n\n /**\n * The heading level (2-6) to use for the accordion item title.\n * This property is set by the parent sp-accordion element.\n * Defaults to 3.\n *\n * @deprecated The `level` attribute on accordion items is deprecated and will\n * be removed in Spectrum 2. Use `level` on `<sp-accordion>` instead.\n */\n @property({ type: Number, reflect: true })\n public level: number = 3;\n\n public override get focusElement(): HTMLElement {\n return this.shadowRoot.querySelector('#header') as HTMLElement;\n }\n\n private onClick(): void {\n /* c8 ignore next 3 */\n if (this.disabled) {\n return;\n }\n this.toggle();\n }\n\n private toggle(): void {\n this.open = !this.open;\n if (window.__swc?.DEBUG) {\n window.__swc.warn(\n this,\n `<${this.localName}> the \"sp-accordion-item-toggle\" event is deprecated and will be renamed to \"swc-accordion-item-toggle\" in Spectrum 2.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n const applyDefault = this.dispatchEvent(\n new CustomEvent('sp-accordion-item-toggle', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n if (!applyDefault) {\n this.open = !this.open;\n }\n }\n\n protected renderChevronIcon = (): TemplateResult => {\n return chevronIcon[this.size || 'm']();\n };\n\n private getHeadingLevel(): number {\n const level = this.level ?? 3;\n return Math.max(2, Math.min(6, level));\n }\n\n private renderHeading(): TemplateResult {\n const level = this.getHeadingLevel();\n const headingContent = html`\n ${when(this.size, this.renderChevronIcon)}\n <button\n id=\"header\"\n @click=${this.onClick}\n aria-expanded=${this.open}\n aria-controls=\"content\"\n ?disabled=${this.disabled}\n >\n ${this.label}\n </button>\n `;\n\n switch (level) {\n case 2:\n return html`\n <h2 id=\"heading\">${headingContent}</h2>\n `;\n case 4:\n return html`\n <h4 id=\"heading\">${headingContent}</h4>\n `;\n case 5:\n return html`\n <h5 id=\"heading\">${headingContent}</h5>\n `;\n case 6:\n return html`\n <h6 id=\"heading\">${headingContent}</h6>\n `;\n default:\n return html`\n <h3 id=\"heading\">${headingContent}</h3>\n `;\n }\n }\n\n protected override render(): TemplateResult {\n return html`\n ${this.renderHeading()}\n <div id=\"content\" role=\"region\" aria-labelledby=\"header\">\n <slot></slot>\n </div>\n `;\n }\n\n protected override updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('disabled')) {\n if (this.disabled) {\n this.setAttribute('aria-disabled', 'true');\n } else {\n this.removeAttribute('aria-disabled');\n }\n }\n if (window.__swc?.DEBUG && changes.has('label') && this.label) {\n window.__swc.warn(\n this,\n `<${this.localName}> the \"label\" attribute is deprecated and will be removed in Spectrum 2.`,\n ACCORDION_MIGRATION_DOC_URL,\n { level: 'deprecation' }\n );\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "qNAYA,OAEE,QAAAA,EAEA,cAAAC,MAEK,gCACP,OAAS,YAAAC,MAAgB,kDACzB,OAAS,QAAAC,MAAY,kDACrB,OAAOC,MAAuB,iEAC9B,OAAS,aAAAC,MAAiB,mDAE1B,MAAO,gEAEP,OAAOC,MAAY,0BAEnB,MAAMC,EAAoD,CACxD,EAAG,IAAMP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQT,EAAG,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQT,EAAG,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQT,GAAI,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQZ,EAEMQ,EACJ,6EAOK,aAAM,sBAAsBP,EAAWI,EAAW,CACvD,cAAe,EACjB,CAAC,CAAE,CAFI,kCAQL,KAAO,KAAO,GAOd,KAAO,MAAQ,GAGf,KAAgB,SAAW,GAW3B,KAAO,MAAgB,EAoCvB,KAAU,kBAAoB,IACrBE,EAAY,KAAK,MAAQ,GAAG,EAAE,EA/DvC,WAA2B,QAAyB,CAClD,MAAO,CAACD,EAAQF,CAAiB,CACnC,CA0BA,IAAoB,cAA4B,CAC9C,OAAO,KAAK,WAAW,cAAc,SAAS,CAChD,CAEQ,SAAgB,CAElB,KAAK,UAGT,KAAK,OAAO,CACd,CAEQ,QAAe,CACrB,KAAK,KAAO,CAAC,KAAK,KASG,KAAK,cACxB,IAAI,YAAY,2BAA4B,CAC1C,QAAS,GACT,SAAU,GACV,WAAY,EACd,CAAC,CACH,IAEE,KAAK,KAAO,CAAC,KAAK,KAEtB,CAMQ,iBAA0B,CA5IpC,IAAAK,EA6II,MAAMC,GAAQD,EAAA,KAAK,QAAL,KAAAA,EAAc,EAC5B,OAAO,KAAK,IAAI,EAAG,KAAK,IAAI,EAAGC,CAAK,CAAC,CACvC,CAEQ,eAAgC,CACtC,MAAMA,EAAQ,KAAK,gBAAgB,EAC7BC,EAAiBX;AAAA,QACnBG,EAAK,KAAK,KAAM,KAAK,iBAAiB,CAAC;AAAA;AAAA;AAAA,iBAG9B,KAAK,OAAO;AAAA,wBACL,KAAK,IAAI;AAAA;AAAA,oBAEb,KAAK,QAAQ;AAAA;AAAA,UAEvB,KAAK,KAAK;AAAA;AAAA,MAIhB,OAAQO,EAAO,CACb,IAAK,GACH,OAAOV;AAAA,6BACcW,CAAc;AAAA,UAErC,IAAK,GACH,OAAOX;AAAA,6BACcW,CAAc;AAAA,UAErC,IAAK,GACH,OAAOX;AAAA,6BACcW,CAAc;AAAA,UAErC,IAAK,GACH,OAAOX;AAAA,6BACcW,CAAc;AAAA,UAErC,QACE,OAAOX;AAAA,6BACcW,CAAc;AAAA,SAEvC,CACF,CAEmB,QAAyB,CAC1C,OAAOX;AAAA,QACH,KAAK,cAAc,CAAC;AAAA;AAAA;AAAA;AAAA,KAK1B,CAEmB,QAAQY,EAA+B,CACxD,MAAM,QAAQA,CAAO,EACjBA,EAAQ,IAAI,UAAU,IACpB,KAAK,SACP,KAAK,aAAa,gBAAiB,MAAM,EAEzC,KAAK,gBAAgB,eAAe,EAW1C,CACF,CApISC,EAAA,CADNX,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAP/B,cAQJ,oBAOAW,EAAA,CADNX,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAd9B,cAeJ,qBAGSW,EAAA,CADfX,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAjB/B,cAkBK,wBAWTW,EAAA,CADNX,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GA5B9B,cA6BJ",
|
|
6
|
+
"names": ["html", "SizedMixin", "property", "when", "chevronIconStyles", "Focusable", "styles", "chevronIcon", "ACCORDION_MIGRATION_DOC_URL", "_a", "level", "headingContent", "changes", "__decorateClass"]
|
|
7
7
|
}
|