@spectrum-web-components/accordion 1.1.0 → 1.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/accordion",
-    "version": "1.1.0",
+    "version": "1.1.2",
     "publishConfig": {
         "access": "public"
     },
@@ -68,11 +68,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^1.1.0",
-        "@spectrum-web-components/icon": "^1.1.0",
-        "@spectrum-web-components/icons-ui": "^1.1.0",
-        "@spectrum-web-components/reactive-controllers": "^1.1.0",
-        "@spectrum-web-components/shared": "^1.1.0"
+        "@spectrum-web-components/base": "^1.1.2",
+        "@spectrum-web-components/icon": "^1.1.2",
+        "@spectrum-web-components/icons-ui": "^1.1.2",
+        "@spectrum-web-components/reactive-controllers": "^1.1.2",
+        "@spectrum-web-components/shared": "^1.1.2"
     },
     "devDependencies": {
         "@spectrum-css/accordion": "6.0.0-s2-foundations.16"
@@ -83,5 +83,5 @@
         "./sp-*.js",
         "./**/*.dev.js"
     ],
-    "gitHead": "e3c6e52501451acc6fa85b10dd718267b80a01ab"
+    "gitHead": "9ee45f2dfd3ac1939072726d00195c6c05d9a562"
 }

package/sp-accordion-item.d.ts

@@ -0,0 +1,6 @@
+import { AccordionItem } from './src/AccordionItem.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'sp-accordion-item': AccordionItem;
+    }
+}

package/sp-accordion-item.dev.js

@@ -0,0 +1,5 @@
+"use strict";
+import { AccordionItem } from "./src/AccordionItem.dev.js";
+import { defineElement } from "@spectrum-web-components/base/src/define-element.js";
+defineElement("sp-accordion-item", AccordionItem);
+//# sourceMappingURL=sp-accordion-item.dev.js.map

package/sp-accordion-item.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sp-accordion-item.ts"],
+  "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*/\nimport { AccordionItem } from './src/AccordionItem.dev.js'\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-accordion-item', AccordionItem);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion-item': AccordionItem;\n    }\n}\n"],
+  "mappings": ";AAWA,SAAS,qBAAqB;AAC9B,SAAS,qBAAqB;AAE9B,cAAc,qBAAqB,aAAa;",
+  "names": []
+}

package/sp-accordion-item.js

@@ -0,0 +1,2 @@
+"use strict";import{AccordionItem as e}from"./src/AccordionItem.js";import{defineElement as o}from"@spectrum-web-components/base/src/define-element.js";o("sp-accordion-item",e);
+//# sourceMappingURL=sp-accordion-item.js.map

package/sp-accordion-item.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sp-accordion-item.ts"],
+  "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*/\nimport { AccordionItem } from './src/AccordionItem.js';\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-accordion-item', AccordionItem);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion-item': AccordionItem;\n    }\n}\n"],
+  "mappings": "aAWA,OAAS,iBAAAA,MAAqB,yBAC9B,OAAS,iBAAAC,MAAqB,sDAE9BA,EAAc,oBAAqBD,CAAa",
+  "names": ["AccordionItem", "defineElement"]
+}

package/sp-accordion.d.ts

@@ -0,0 +1,6 @@
+import { Accordion } from './src/Accordion.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'sp-accordion': Accordion;
+    }
+}

package/sp-accordion.dev.js

@@ -0,0 +1,5 @@
+"use strict";
+import { Accordion } from "./src/Accordion.dev.js";
+import { defineElement } from "@spectrum-web-components/base/src/define-element.js";
+defineElement("sp-accordion", Accordion);
+//# sourceMappingURL=sp-accordion.dev.js.map

package/sp-accordion.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sp-accordion.ts"],
+  "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*/\nimport { Accordion } from './src/Accordion.dev.js'\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-accordion', Accordion);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion': Accordion;\n    }\n}\n"],
+  "mappings": ";AAWA,SAAS,iBAAiB;AAC1B,SAAS,qBAAqB;AAE9B,cAAc,gBAAgB,SAAS;",
+  "names": []
+}

package/sp-accordion.js

@@ -0,0 +1,2 @@
+"use strict";import{Accordion as o}from"./src/Accordion.js";import{defineElement as e}from"@spectrum-web-components/base/src/define-element.js";e("sp-accordion",o);
+//# sourceMappingURL=sp-accordion.js.map

package/sp-accordion.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sp-accordion.ts"],
+  "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*/\nimport { Accordion } from './src/Accordion.js';\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-accordion', Accordion);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion': Accordion;\n    }\n}\n"],
+  "mappings": "aAWA,OAAS,aAAAA,MAAiB,qBAC1B,OAAS,iBAAAC,MAAqB,sDAE9BA,EAAc,eAAgBD,CAAS",
+  "names": ["Accordion", "defineElement"]
+}

package/src/Accordion.d.ts

@@ -0,0 +1,31 @@
+import { CSSResultArray, PropertyValues, SpectrumElement, TemplateResult } from '@spectrum-web-components/base';
+import { FocusGroupController } from '@spectrum-web-components/reactive-controllers/src/FocusGroup.js';
+import { AccordionItem } from './AccordionItem.js';
+declare const Accordion_base: typeof SpectrumElement & {
+    new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
+    prototype: import("@spectrum-web-components/base").SizedElementInterface;
+};
+/**
+ * @element sp-accordion
+ * @slot - The sp-accordion-item children to display.
+ */
+export declare class Accordion extends Accordion_base {
+    static get styles(): CSSResultArray;
+    /**
+     * Allows multiple accordion items to be opened at the same time
+     */
+    allowMultiple: boolean;
+    /**
+     * Sets the spacing between the content to borders of an accordion item
+     */
+    density?: 'compact' | 'spacious';
+    private defaultNodes;
+    private get items();
+    focusGroupController: FocusGroupController<AccordionItem>;
+    focus(): void;
+    private onToggle;
+    private handleSlotchange;
+    protected updated(changed: PropertyValues<this>): void;
+    protected render(): TemplateResult;
+}
+export {};

package/src/Accordion.dev.js

@@ -0,0 +1,94 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+import {
+  html,
+  SizedMixin,
+  SpectrumElement
+} from "@spectrum-web-components/base";
+import {
+  property,
+  queryAssignedNodes
+} from "@spectrum-web-components/base/src/decorators.js";
+import { FocusGroupController } from "@spectrum-web-components/reactive-controllers/src/FocusGroup.js";
+import styles from "./accordion.css.js";
+export class Accordion extends SizedMixin(SpectrumElement, {
+  noDefaultSize: true
+}) {
+  constructor() {
+    super(...arguments);
+    this.allowMultiple = false;
+    this.focusGroupController = new FocusGroupController(this, {
+      direction: "vertical",
+      elements: () => this.items,
+      isFocusableElement: (el) => !el.disabled
+    });
+  }
+  static get styles() {
+    return [styles];
+  }
+  get items() {
+    return [...this.defaultNodes || []].filter(
+      (node) => typeof node.tagName !== "undefined"
+    );
+  }
+  focus() {
+    this.focusGroupController.focus();
+  }
+  async onToggle(event) {
+    const target = event.target;
+    await 0;
+    if (this.allowMultiple || event.defaultPrevented) {
+      return;
+    }
+    const items = [...this.items];
+    if (items && !items.length) {
+      return;
+    }
+    items.forEach((item) => {
+      if (item !== target) {
+        item.open = false;
+      }
+    });
+  }
+  handleSlotchange() {
+    this.focusGroupController.clearElementCache();
+    this.items.forEach((item) => {
+      item.size = this.size;
+    });
+  }
+  updated(changed) {
+    super.updated(changed);
+    if (changed.has("size") && (!!changed.get("size") || this.size !== "m")) {
+      this.items.forEach((item) => {
+        item.size = this.size;
+      });
+    }
+  }
+  render() {
+    return html`
+            <slot
+                @slotchange=${this.handleSlotchange}
+                @sp-accordion-item-toggle=${this.onToggle}
+            ></slot>
+        `;
+  }
+}
+__decorateClass([
+  property({ type: Boolean, reflect: true, attribute: "allow-multiple" })
+], Accordion.prototype, "allowMultiple", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], Accordion.prototype, "density", 2);
+__decorateClass([
+  queryAssignedNodes()
+], Accordion.prototype, "defaultNodes", 2);
+//# sourceMappingURL=Accordion.dev.js.map

package/src/Accordion.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["Accordion.ts"],
+  "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 {\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 { AccordionItem } from './AccordionItem.dev.js'\n\nimport styles from './accordion.css.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    @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        });\n    }\n\n    protected override updated(changed: PropertyValues<this>): void {\n        super.updated(changed);\n        if (\n            changed.has('size') &&\n            (!!changed.get('size') || this.size !== 'm')\n        ) {\n            this.items.forEach((item) => {\n                item.size = this.size;\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"],
+  "mappings": ";;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EAEA;AAAA,EACA;AAAA,OAEG;AACP;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,4BAA4B;AAIrC,OAAO,YAAY;AAMZ,aAAM,kBAAkB,WAAW,iBAAiB;AAAA,EACvD,eAAe;AACnB,CAAC,EAAE;AAAA,EAFI;AAAA;AAWH,SAAO,gBAAgB;AAiBvB,gCAAuB,IAAI,qBAAoC,MAAM;AAAA,MACjE,WAAW;AAAA,MACX,UAAU,MAAM,KAAK;AAAA,MACrB,oBAAoB,CAAC,OAAsB,CAAC,GAAG;AAAA,IACnD,CAAC;AAAA;AAAA,EA7BD,WAA2B,SAAyB;AAChD,WAAO,CAAC,MAAM;AAAA,EAClB;AAAA,EAiBA,IAAY,QAAyB;AACjC,WAAO,CAAC,GAAI,KAAK,gBAAgB,CAAC,CAAE,EAAE;AAAA,MAClC,CAAC,SAAsB,OAAO,KAAK,YAAY;AAAA,IACnD;AAAA,EACJ;AAAA,EAQgB,QAAc;AAC1B,SAAK,qBAAqB,MAAM;AAAA,EACpC;AAAA,EAEA,MAAc,SAAS,OAA6B;AAChD,UAAM,SAAS,MAAM;AAGrB,UAAM;AACN,QAAI,KAAK,iBAAiB,MAAM,kBAAkB;AAE9C;AAAA,IACJ;AACA,UAAM,QAAQ,CAAC,GAAG,KAAK,KAAK;AAE5B,QAAI,SAAS,CAAC,MAAM,QAAQ;AAExB;AAAA,IACJ;AACA,UAAM,QAAQ,CAAC,SAAS;AACpB,UAAI,SAAS,QAAQ;AAEjB,aAAK,OAAO;AAAA,MAChB;AAAA,IACJ,CAAC;AAAA,EACL;AAAA,EAEQ,mBAAyB;AAC7B,SAAK,qBAAqB,kBAAkB;AAC5C,SAAK,MAAM,QAAQ,CAAC,SAAS;AACzB,WAAK,OAAO,KAAK;AAAA,IACrB,CAAC;AAAA,EACL;AAAA,EAEmB,QAAQ,SAAqC;AAC5D,UAAM,QAAQ,OAAO;AACrB,QACI,QAAQ,IAAI,MAAM,MACjB,CAAC,CAAC,QAAQ,IAAI,MAAM,KAAK,KAAK,SAAS,MAC1C;AACE,WAAK,MAAM,QAAQ,CAAC,SAAS;AACzB,aAAK,OAAO,KAAK;AAAA,MACrB,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEmB,SAAyB;AACxC,WAAO;AAAA;AAAA,8BAEe,KAAK,gBAAgB;AAAA,4CACP,KAAK,QAAQ;AAAA;AAAA;AAAA,EAGrD;AACJ;AA7EW;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,iBAAiB,CAAC;AAAA,GAV9D,UAWF;AAMA;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAhBhC,UAiBF;AAGC;AAAA,EADP,mBAAmB;AAAA,GAnBX,UAoBD;",
+  "names": []
+}

package/src/Accordion.js

@@ -0,0 +1,7 @@
+"use strict";var n=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var s=(l,i,e,o)=>{for(var t=o>1?void 0:o?u(i,e):i,r=l.length-1,a;r>=0;r--)(a=l[r])&&(t=(o?a(i,e,t):a(t))||t);return o&&t&&n(i,e,t),t};import{html as p,SizedMixin as d,SpectrumElement as m}from"@spectrum-web-components/base";import{property as c,queryAssignedNodes as f}from"@spectrum-web-components/base/src/decorators.js";import{FocusGroupController as h}from"@spectrum-web-components/reactive-controllers/src/FocusGroup.js";import g from"./accordion.css.js";export class Accordion extends d(m,{noDefaultSize:!0}){constructor(){super(...arguments);this.allowMultiple=!1;this.focusGroupController=new h(this,{direction:"vertical",elements:()=>this.items,isFocusableElement:e=>!e.disabled})}static get styles(){return[g]}get items(){return[...this.defaultNodes||[]].filter(e=>typeof e.tagName!="undefined")}focus(){this.focusGroupController.focus()}async onToggle(e){const o=e.target;if(await 0,this.allowMultiple||e.defaultPrevented)return;const t=[...this.items];t&&!t.length||t.forEach(r=>{r!==o&&(r.open=!1)})}handleSlotchange(){this.focusGroupController.clearElementCache(),this.items.forEach(e=>{e.size=this.size})}updated(e){super.updated(e),e.has("size")&&(e.get("size")||this.size!=="m")&&this.items.forEach(o=>{o.size=this.size})}render(){return p`
+            <slot
+                @slotchange=${this.handleSlotchange}
+                @sp-accordion-item-toggle=${this.onToggle}
+            ></slot>
+        `}}s([c({type:Boolean,reflect:!0,attribute:"allow-multiple"})],Accordion.prototype,"allowMultiple",2),s([c({type:String,reflect:!0})],Accordion.prototype,"density",2),s([f()],Accordion.prototype,"defaultNodes",2);
+//# sourceMappingURL=Accordion.js.map

package/src/Accordion.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["Accordion.ts"],
+  "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 {\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 { AccordionItem } from './AccordionItem.js';\n\nimport styles from './accordion.css.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    @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        });\n    }\n\n    protected override updated(changed: PropertyValues<this>): void {\n        super.updated(changed);\n        if (\n            changed.has('size') &&\n            (!!changed.get('size') || this.size !== 'm')\n        ) {\n            this.items.forEach((item) => {\n                item.size = this.size;\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"],
+  "mappings": "qNAYA,OAEI,QAAAA,EAEA,cAAAC,EACA,mBAAAC,MAEG,gCACP,OACI,YAAAC,EACA,sBAAAC,MACG,kDACP,OAAS,wBAAAC,MAA4B,kEAIrC,OAAOC,MAAY,qBAMZ,aAAM,kBAAkBL,EAAWC,EAAiB,CACvD,cAAe,EACnB,CAAC,CAAE,CAFI,kCAWH,KAAO,cAAgB,GAiBvB,0BAAuB,IAAIG,EAAoC,KAAM,CACjE,UAAW,WACX,SAAU,IAAM,KAAK,MACrB,mBAAqBE,GAAsB,CAACA,EAAG,QACnD,CAAC,EA7BD,WAA2B,QAAyB,CAChD,MAAO,CAACD,CAAM,CAClB,CAiBA,IAAY,OAAyB,CACjC,MAAO,CAAC,GAAI,KAAK,cAAgB,CAAC,CAAE,EAAE,OACjCE,GAAsB,OAAOA,EAAK,SAAY,WACnD,CACJ,CAQgB,OAAc,CAC1B,KAAK,qBAAqB,MAAM,CACpC,CAEA,MAAc,SAASC,EAA6B,CAChD,MAAMC,EAASD,EAAM,OAIrB,GADA,KAAM,GACF,KAAK,eAAiBA,EAAM,iBAE5B,OAEJ,MAAME,EAAQ,CAAC,GAAG,KAAK,KAAK,EAExBA,GAAS,CAACA,EAAM,QAIpBA,EAAM,QAASC,GAAS,CAChBA,IAASF,IAETE,EAAK,KAAO,GAEpB,CAAC,CACL,CAEQ,kBAAyB,CAC7B,KAAK,qBAAqB,kBAAkB,EAC5C,KAAK,MAAM,QAASA,GAAS,CACzBA,EAAK,KAAO,KAAK,IACrB,CAAC,CACL,CAEmB,QAAQC,EAAqC,CAC5D,MAAM,QAAQA,CAAO,EAEjBA,EAAQ,IAAI,MAAM,IACfA,EAAQ,IAAI,MAAM,GAAK,KAAK,OAAS,MAExC,KAAK,MAAM,QAASD,GAAS,CACzBA,EAAK,KAAO,KAAK,IACrB,CAAC,CAET,CAEmB,QAAyB,CACxC,OAAOZ;AAAA;AAAA,8BAEe,KAAK,gBAAgB;AAAA,4CACP,KAAK,QAAQ;AAAA;AAAA,SAGrD,CACJ,CA7EWc,EAAA,CADNX,EAAS,CAAE,KAAM,QAAS,QAAS,GAAM,UAAW,gBAAiB,CAAC,GAV9D,UAWF,6BAMAW,EAAA,CADNX,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAhBhC,UAiBF,uBAGCW,EAAA,CADPV,EAAmB,GAnBX,UAoBD",
+  "names": ["html", "SizedMixin", "SpectrumElement", "property", "queryAssignedNodes", "FocusGroupController", "styles", "el", "node", "event", "target", "items", "item", "changed", "__decorateClass"]
+}

package/src/AccordionItem.d.ts

@@ -0,0 +1,25 @@
+import { CSSResultArray, PropertyValues, TemplateResult } from '@spectrum-web-components/base';
+import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
+import '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';
+declare const AccordionItem_base: typeof Focusable & {
+    new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
+    prototype: import("@spectrum-web-components/base").SizedElementInterface;
+};
+/**
+ * @element sp-accordion-item
+ * @slot - The content of the item that is hidden when the item is not open
+ * @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled.
+ */
+export declare class AccordionItem extends AccordionItem_base {
+    static get styles(): CSSResultArray;
+    open: boolean;
+    label: string;
+    disabled: boolean;
+    get focusElement(): HTMLElement;
+    private onClick;
+    private toggle;
+    protected renderChevronIcon: () => TemplateResult;
+    protected render(): TemplateResult;
+    protected updated(changes: PropertyValues): void;
+}
+export {};

package/src/AccordionItem.dev.js

@@ -0,0 +1,133 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+import {
+  html,
+  SizedMixin
+} from "@spectrum-web-components/base";
+import { property } from "@spectrum-web-components/base/src/decorators.js";
+import { Focusable } from "@spectrum-web-components/shared/src/focusable.js";
+import { when } from "@spectrum-web-components/base/src/directives.js";
+import "@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js";
+import chevronIconStyles from "@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js";
+import chevronIconOverrides from "@spectrum-web-components/icon/src/icon-chevron-overrides.css.js";
+import styles from "./accordion-item.css.js";
+const chevronIcon = {
+  s: () => html`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight75"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `,
+  m: () => html`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight100"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `,
+  l: () => html`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight200"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `,
+  xl: () => html`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight300"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `
+};
+export class AccordionItem extends SizedMixin(Focusable, {
+  noDefaultSize: true
+}) {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.label = "";
+    this.disabled = false;
+    this.renderChevronIcon = () => {
+      return chevronIcon[this.size || "m"]();
+    };
+  }
+  static get styles() {
+    return [styles, chevronIconStyles, chevronIconOverrides];
+  }
+  get focusElement() {
+    return this.shadowRoot.querySelector("#header");
+  }
+  onClick() {
+    if (this.disabled) {
+      return;
+    }
+    this.toggle();
+  }
+  toggle() {
+    this.open = !this.open;
+    const applyDefault = this.dispatchEvent(
+      new CustomEvent("sp-accordion-item-toggle", {
+        bubbles: true,
+        composed: true,
+        cancelable: true
+      })
+    );
+    if (!applyDefault) {
+      this.open = !this.open;
+    }
+  }
+  render() {
+    return html`
+            <h3 id="heading">
+                ${when(this.size, this.renderChevronIcon)}
+                <button
+                    id="header"
+                    @click=${this.onClick}
+                    aria-expanded=${this.open}
+                    aria-controls="content"
+                    ?disabled=${this.disabled}
+                >
+                    ${this.label}
+                </button>
+            </h3>
+            <div id="content" role="region" aria-labelledby="header">
+                <slot></slot>
+            </div>
+        `;
+  }
+  updated(changes) {
+    super.updated(changes);
+    if (changes.has("disabled")) {
+      if (this.disabled) {
+        this.setAttribute("aria-disabled", "true");
+      } else {
+        this.removeAttribute("aria-disabled");
+      }
+    }
+  }
+}
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], AccordionItem.prototype, "open", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], AccordionItem.prototype, "label", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], AccordionItem.prototype, "disabled", 2);
+//# sourceMappingURL=AccordionItem.dev.js.map

package/src/AccordionItem.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["AccordionItem.ts"],
+  "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    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport { when } from '@spectrum-web-components/base/src/directives.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport chevronIconOverrides from '@spectrum-web-components/icon/src/icon-chevron-overrides.css.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.\n */\nexport class AccordionItem extends SizedMixin(Focusable, {\n    noDefaultSize: true,\n}) {\n    public static override get styles(): CSSResultArray {\n        return [styles, chevronIconStyles, chevronIconOverrides];\n    }\n\n    @property({ type: Boolean, reflect: true })\n    public open = false;\n\n    @property({ type: String, reflect: true })\n    public label = '';\n\n    @property({ type: Boolean, reflect: true })\n    public override disabled = false;\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        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    protected override render(): TemplateResult {\n        return html`\n            <h3 id=\"heading\">\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            </h3>\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    }\n}\n"],
+  "mappings": ";;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EAEA;AAAA,OAEG;AACP,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,YAAY;AACrB,OAAO;AACP,OAAO,uBAAuB;AAC9B,OAAO,0BAA0B;AAEjC,OAAO,YAAY;AAEnB,MAAM,cAAoD;AAAA,EACtD,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;AAQd;AAOO,aAAM,sBAAsB,WAAW,WAAW;AAAA,EACrD,eAAe;AACnB,CAAC,EAAE;AAAA,EAFI;AAAA;AAQH,SAAO,OAAO;AAGd,SAAO,QAAQ;AAGf,SAAgB,WAAW;AA4B3B,SAAU,oBAAoB,MAAsB;AAChD,aAAO,YAAY,KAAK,QAAQ,GAAG,EAAE;AAAA,IACzC;AAAA;AAAA,EAzCA,WAA2B,SAAyB;AAChD,WAAO,CAAC,QAAQ,mBAAmB,oBAAoB;AAAA,EAC3D;AAAA,EAWA,IAAoB,eAA4B;AAC5C,WAAO,KAAK,WAAW,cAAc,SAAS;AAAA,EAClD;AAAA,EAEQ,UAAgB;AAEpB,QAAI,KAAK,UAAU;AACf;AAAA,IACJ;AACA,SAAK,OAAO;AAAA,EAChB;AAAA,EAEQ,SAAe;AACnB,SAAK,OAAO,CAAC,KAAK;AAClB,UAAM,eAAe,KAAK;AAAA,MACtB,IAAI,YAAY,4BAA4B;AAAA,QACxC,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,MAChB,CAAC;AAAA,IACL;AACA,QAAI,CAAC,cAAc;AACf,WAAK,OAAO,CAAC,KAAK;AAAA,IACtB;AAAA,EACJ;AAAA,EAMmB,SAAyB;AACxC,WAAO;AAAA;AAAA,kBAEG,KAAK,KAAK,MAAM,KAAK,iBAAiB,CAAC;AAAA;AAAA;AAAA,6BAG5B,KAAK,OAAO;AAAA,oCACL,KAAK,IAAI;AAAA;AAAA,gCAEb,KAAK,QAAQ;AAAA;AAAA,sBAEvB,KAAK,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO5B;AAAA,EAEmB,QAAQ,SAA+B;AACtD,UAAM,QAAQ,OAAO;AACrB,QAAI,QAAQ,IAAI,UAAU,GAAG;AACzB,UAAI,KAAK,UAAU;AACf,aAAK,aAAa,iBAAiB,MAAM;AAAA,MAC7C,OAAO;AACH,aAAK,gBAAgB,eAAe;AAAA,MACxC;AAAA,IACJ;AAAA,EACJ;AACJ;AApEW;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAPjC,cAQF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAVhC,cAWF;AAGS;AAAA,EADf,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAbjC,cAcO;",
+  "names": []
+}

package/src/AccordionItem.js

@@ -0,0 +1,46 @@
+"use strict";var p=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var s=(n,o,e,i)=>{for(var t=i>1?void 0:i?d(o,e):o,l=n.length-1,a;l>=0;l--)(a=n[l])&&(t=(i?a(o,e,t):a(t))||t);return i&&t&&p(o,e,t),t};import{html as r,SizedMixin as h}from"@spectrum-web-components/base";import{property as c}from"@spectrum-web-components/base/src/decorators.js";import{Focusable as u}from"@spectrum-web-components/shared/src/focusable.js";import{when as v}from"@spectrum-web-components/base/src/directives.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js";import m from"@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js";import b from"@spectrum-web-components/icon/src/icon-chevron-overrides.css.js";import f from"./accordion-item.css.js";const g={s:()=>r`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight75"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `,m:()=>r`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight100"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `,l:()=>r`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight200"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `,xl:()=>r`
+        <span class="iconContainer">
+            <sp-icon-chevron100
+                class="indicator spectrum-UIIcon-ChevronRight300"
+                slot="icon"
+            ></sp-icon-chevron100>
+        </span>
+    `};export class AccordionItem extends h(u,{noDefaultSize:!0}){constructor(){super(...arguments);this.open=!1;this.label="";this.disabled=!1;this.renderChevronIcon=()=>g[this.size||"m"]()}static get styles(){return[f,m,b]}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)}render(){return r`
+            <h3 id="heading">
+                ${v(this.size,this.renderChevronIcon)}
+                <button
+                    id="header"
+                    @click=${this.onClick}
+                    aria-expanded=${this.open}
+                    aria-controls="content"
+                    ?disabled=${this.disabled}
+                >
+                    ${this.label}
+                </button>
+            </h3>
+            <div id="content" role="region" aria-labelledby="header">
+                <slot></slot>
+            </div>
+        `}updated(e){super.updated(e),e.has("disabled")&&(this.disabled?this.setAttribute("aria-disabled","true"):this.removeAttribute("aria-disabled"))}}s([c({type:Boolean,reflect:!0})],AccordionItem.prototype,"open",2),s([c({type:String,reflect:!0})],AccordionItem.prototype,"label",2),s([c({type:Boolean,reflect:!0})],AccordionItem.prototype,"disabled",2);
+//# sourceMappingURL=AccordionItem.js.map

package/src/AccordionItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["AccordionItem.ts"],
+  "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    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport { when } from '@spectrum-web-components/base/src/directives.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\nimport chevronIconOverrides from '@spectrum-web-components/icon/src/icon-chevron-overrides.css.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.\n */\nexport class AccordionItem extends SizedMixin(Focusable, {\n    noDefaultSize: true,\n}) {\n    public static override get styles(): CSSResultArray {\n        return [styles, chevronIconStyles, chevronIconOverrides];\n    }\n\n    @property({ type: Boolean, reflect: true })\n    public open = false;\n\n    @property({ type: String, reflect: true })\n    public label = '';\n\n    @property({ type: Boolean, reflect: true })\n    public override disabled = false;\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        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    protected override render(): TemplateResult {\n        return html`\n            <h3 id=\"heading\">\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            </h3>\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    }\n}\n"],
+  "mappings": "qNAYA,OAEI,QAAAA,EAEA,cAAAC,MAEG,gCACP,OAAS,YAAAC,MAAgB,kDACzB,OAAS,aAAAC,MAAiB,mDAC1B,OAAS,QAAAC,MAAY,kDACrB,MAAO,gEACP,OAAOC,MAAuB,iEAC9B,OAAOC,MAA0B,kEAEjC,OAAOC,MAAY,0BAEnB,MAAMC,EAAoD,CACtD,EAAG,IAAMR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQT,EAAG,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQT,EAAG,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQT,GAAI,IAAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAQd,EAOO,aAAM,sBAAsBC,EAAWE,EAAW,CACrD,cAAe,EACnB,CAAC,CAAE,CAFI,kCAQH,KAAO,KAAO,GAGd,KAAO,MAAQ,GAGf,KAAgB,SAAW,GA4B3B,KAAU,kBAAoB,IACnBK,EAAY,KAAK,MAAQ,GAAG,EAAE,EAxCzC,WAA2B,QAAyB,CAChD,MAAO,CAACD,EAAQF,EAAmBC,CAAoB,CAC3D,CAWA,IAAoB,cAA4B,CAC5C,OAAO,KAAK,WAAW,cAAc,SAAS,CAClD,CAEQ,SAAgB,CAEhB,KAAK,UAGT,KAAK,OAAO,CAChB,CAEQ,QAAe,CACnB,KAAK,KAAO,CAAC,KAAK,KACG,KAAK,cACtB,IAAI,YAAY,2BAA4B,CACxC,QAAS,GACT,SAAU,GACV,WAAY,EAChB,CAAC,CACL,IAEI,KAAK,KAAO,CAAC,KAAK,KAE1B,CAMmB,QAAyB,CACxC,OAAON;AAAA;AAAA,kBAEGI,EAAK,KAAK,KAAM,KAAK,iBAAiB,CAAC;AAAA;AAAA;AAAA,6BAG5B,KAAK,OAAO;AAAA,oCACL,KAAK,IAAI;AAAA;AAAA,gCAEb,KAAK,QAAQ;AAAA;AAAA,sBAEvB,KAAK,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAO5B,CAEmB,QAAQK,EAA+B,CACtD,MAAM,QAAQA,CAAO,EACjBA,EAAQ,IAAI,UAAU,IAClB,KAAK,SACL,KAAK,aAAa,gBAAiB,MAAM,EAEzC,KAAK,gBAAgB,eAAe,EAGhD,CACJ,CApEWC,EAAA,CADNR,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAPjC,cAQF,oBAGAQ,EAAA,CADNR,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAVhC,cAWF,qBAGSQ,EAAA,CADfR,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAbjC,cAcO",
+  "names": ["html", "SizedMixin", "property", "Focusable", "when", "chevronIconStyles", "chevronIconOverrides", "styles", "chevronIcon", "changes", "__decorateClass"]
+}

package/src/accordion-item-overrides.css.d.ts

@@ -0,0 +1,2 @@
+declare const styles: import("@spectrum-web-components/base").CSSResult;
+export default styles;

package/src/accordion-item-overrides.css.dev.js

@@ -0,0 +1,7 @@
+"use strict";
+import { css } from "@spectrum-web-components/base";
+const styles = css`
+    .spectrum-Accordion--sizeM{--spectrum-accordion-item-height:var(--system-accordion-size-m-item-height);--spectrum-accordion-disclosure-indicator-height:var(--system-accordion-size-m-disclosure-indicator-height);--spectrum-accordion-component-edge-to-text:var(--system-accordion-size-m-component-edge-to-text);--spectrum-accordion-item-header-font-size:var(--system-accordion-size-m-item-header-font-size);--spectrum-accordion-item-content-font-size:var(--system-accordion-size-m-item-content-font-size);--spectrum-accordion-item-header-top-to-text-space:var(--system-accordion-size-m-item-header-top-to-text-space);--spectrum-accordion-item-header-bottom-to-text-space:var(--system-accordion-size-m-item-header-bottom-to-text-space)}
+`;
+export default styles;
+//# sourceMappingURL=accordion-item-overrides.css.dev.js.map

package/src/accordion-item-overrides.css.dev.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["accordion-item-overrides.css.ts"],
+  "sourcesContent": ["/*\nCopyright 2025 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*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n    .spectrum-Accordion--sizeM{--spectrum-accordion-item-height:var(--system-accordion-size-m-item-height);--spectrum-accordion-disclosure-indicator-height:var(--system-accordion-size-m-disclosure-indicator-height);--spectrum-accordion-component-edge-to-text:var(--system-accordion-size-m-component-edge-to-text);--spectrum-accordion-item-header-font-size:var(--system-accordion-size-m-item-header-font-size);--spectrum-accordion-item-content-font-size:var(--system-accordion-size-m-item-content-font-size);--spectrum-accordion-item-header-top-to-text-space:var(--system-accordion-size-m-item-header-top-to-text-space);--spectrum-accordion-item-header-bottom-to-text-space:var(--system-accordion-size-m-item-header-bottom-to-text-space)}\n`;\nexport default styles;"],
+  "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
+  "names": []
+}

package/src/accordion-item-overrides.css.js

@@ -0,0 +1,4 @@
+"use strict";import{css as e}from"@spectrum-web-components/base";const t=e`
+    .spectrum-Accordion--sizeM{--spectrum-accordion-item-height:var(--system-accordion-size-m-item-height);--spectrum-accordion-disclosure-indicator-height:var(--system-accordion-size-m-disclosure-indicator-height);--spectrum-accordion-component-edge-to-text:var(--system-accordion-size-m-component-edge-to-text);--spectrum-accordion-item-header-font-size:var(--system-accordion-size-m-item-header-font-size);--spectrum-accordion-item-content-font-size:var(--system-accordion-size-m-item-content-font-size);--spectrum-accordion-item-header-top-to-text-space:var(--system-accordion-size-m-item-header-top-to-text-space);--spectrum-accordion-item-header-bottom-to-text-space:var(--system-accordion-size-m-item-header-bottom-to-text-space)}
+`;export default t;
+//# sourceMappingURL=accordion-item-overrides.css.js.map

package/src/accordion-item-overrides.css.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["accordion-item-overrides.css.ts"],
+  "sourcesContent": ["/*\nCopyright 2025 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*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n    .spectrum-Accordion--sizeM{--spectrum-accordion-item-height:var(--system-accordion-size-m-item-height);--spectrum-accordion-disclosure-indicator-height:var(--system-accordion-size-m-disclosure-indicator-height);--spectrum-accordion-component-edge-to-text:var(--system-accordion-size-m-component-edge-to-text);--spectrum-accordion-item-header-font-size:var(--system-accordion-size-m-item-header-font-size);--spectrum-accordion-item-content-font-size:var(--system-accordion-size-m-item-content-font-size);--spectrum-accordion-item-header-top-to-text-space:var(--system-accordion-size-m-item-header-top-to-text-space);--spectrum-accordion-item-header-bottom-to-text-space:var(--system-accordion-size-m-item-header-bottom-to-text-space)}\n`;\nexport default styles;"],
+  "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
+  "names": ["css", "styles"]
+}

package/src/accordion-item.css.d.ts

@@ -0,0 +1,2 @@
+declare const styles: import("@spectrum-web-components/base").CSSResult;
+export default styles;

package/src/accordion-item.css.dev.js

@@ -0,0 +1,7 @@
+"use strict";
+import { css } from "@spectrum-web-components/base";
+const styles = css`
+    :host{z-index:inherit;min-block-size:var(--mod-accordion-item-height,var(--spectrum-accordion-item-height));min-inline-size:var(--mod-accordion-item-width,var(--spectrum-accordion-item-width));border-block-end:1px solid #0000;border-color:var(--mod-accordion-divider-color,var(--spectrum-accordion-divider-color));border-width:var(--mod-accordion-divider-thickness,var(--spectrum-divider-thickness-small));margin:0;position:relative}:host(:first-child){border-block-start:1px solid #0000;border-color:var(--mod-accordion-divider-color,var(--spectrum-accordion-divider-color));border-width:var(--mod-accordion-divider-thickness,var(--spectrum-divider-thickness-small))}#heading{box-sizing:border-box;margin:0;position:relative}.iconContainer{inline-size:var(--mod-accordion-disclosure-indicator-height,var(--spectrum-accordion-disclosure-indicator-height));block-size:var(--mod-accordion-disclosure-indicator-height,var(--spectrum-accordion-disclosure-indicator-height));color:var(--mod-accordion-item-header-color-default,var(--spectrum-accordion-item-header-color-default));justify-content:center;align-items:center;padding-inline-start:var(--mod-accordion-edge-to-disclosure-indicator-space,var(--spectrum-accordion-edge-to-disclosure-indicator-space));display:flex;position:absolute;inset-block-start:max(0px,calc(( var(--mod-accordion-min-block-size,var(--spectrum-accordion-min-block-size)) - var(--mod-accordion-disclosure-indicator-height,var(--spectrum-accordion-disclosure-indicator-height)))/2))}.iconContainer:dir(rtl),:host([dir=rtl]) .iconContainer{transform:scaleX(-1)}#content{padding-block:var(--mod-accordion-item-content-area-top-to-content,var(--spectrum-accordion-item-content-area-top-to-content))var(--mod-accordion-item-content-area-bottom-to-content,var(--spectrum-accordion-item-content-area-bottom-to-content));padding-inline:var(--mod-accordion-component-edge-to-text,var(--spectrum-accordion-component-edge-to-text))var(--mod-accordion-component-edge-to-text,var(--spectrum-accordion-component-edge-to-text));color:var(--mod-accordion-item-content-color,var(--spectrum-accordion-item-content-color));font-weight:var(--mod-accordion-item-content-font-weight,var(--spectrum-accordion-item-content-font-weight));font-style:var(--mod-accordion-item-content-font-style,var(--spectrum-accordion-item-content-font-style));font-size:var(--mod-accordion-item-content-font-size,var(--spectrum-accordion-item-content-font-size));font-family:var(--mod-accordion-item-content-font,var(--spectrum-accordion-item-content-font));line-height:var(--mod-accordion-item-content-line-height,var(--spectrum-accordion-item-content-line-height));display:none}#header{box-sizing:border-box;padding-block:var(--mod-accordion-item-header-top-to-text-space,var(--spectrum-accordion-item-header-top-to-text-space))var(--mod-accordion-item-header-bottom-to-text-space,var(--spectrum-accordion-item-header-bottom-to-text-space));min-block-size:var(--mod-accordion-min-block-size,var(--spectrum-accordion-min-block-size));line-height:var(--mod-accordion-item-header-line-height,var(--spectrum-accordion-item-header-line-height));text-overflow:ellipsis;cursor:pointer;font-size:var(--mod-accordion-item-header-font-size,var(--spectrum-accordion-item-header-font-size));font-weight:var(--mod-accordion-item-header-font-weight,var(--spectrum-accordion-item-header-font-weight));font-style:var(--mod-accordion-item-header-font-style,var(--spectrum-accordion-item-header-font-style));font-family:var(--mod-accordion-item-header-font,var(--spectrum-accordion-item-header-font));appearance:none;text-align:start;inline-size:100%;color:var(--mod-accordion-item-header-color-default,var(--spectrum-accordion-item-header-color-default));background-color:var(--mod-accordion-background-color-default,var(--spectrum-accordion-background-color-default));border:0;justify-content:flex-start;align-items:center;padding-inline-start:calc(var(--mod-accordion-disclosure-indicator-to-text-space,var(--spectrum-accordion-disclosure-indicator-to-text-space)) + var(--mod-accordion-disclosure-indicator-height,var(--spectrum-accordion-disclosure-indicator-height)));padding-inline-end:var(--mod-accordion-edge-to-text-space,var(--spectrum-accordion-edge-to-text-space));display:flex;position:relative}#header:focus{outline:none}#header:focus:after{content:"";position:absolute;inset-inline-start:0}#header:focus-visible{border-radius:var(--mod-accordion-corner-radius,var(--spectrum-accordion-corner-radius));outline:var(--mod-accordion-focus-indicator-thickness,var(--spectrum-accordion-focus-indicator-thickness))solid var(--mod-accordion-focus-indicator-color,var(--spectrum-accordion-focus-indicator-color));background-color:var(--mod-accordion-background-color-key-focus,var(--spectrum-accordion-background-color-key-focus));color:var(--mod-accordion-item-header-color-key-focus,var(--spectrum-accordion-item-header-color-key-focus));outline-offset:calc(var(--mod-accordion-focus-indicator-gap,var(--spectrum-accordion-focus-indicator-gap))*-1)}#header:active{background-color:var(--mod-accordion-background-color-down,var(--spectrum-accordion-background-color-down));color:var(--mod-accordion-item-header-color-down,var(--spectrum-accordion-item-header-color-down))}:host([disabled]) #header,:host([disabled]) #header:focus-visible{color:var(--mod-accordion-item-header-disabled-color,var(--spectrum-accordion-item-header-disabled-color));background-color:initial}@media (hover:hover){#header:hover{background-color:var(--mod-accordion-background-color-hover,var(--spectrum-accordion-background-color-hover))}#header:hover,#header:hover+.iconContainer{color:var(--mod-accordion-item-header-color-hover,var(--spectrum-accordion-item-header-color-hover))}:host([open]) #header:hover{background-color:var(--mod-accordion-background-color-hover,var(--spectrum-accordion-background-color-hover))}:host([disabled]) #header:hover{color:var(--mod-accordion-item-header-disabled-color,var(--spectrum-accordion-item-header-disabled-color));background-color:initial}}:host([disabled]) #header+.iconContainer{color:var(--mod-accordion-item-header-disabled-color,var(--spectrum-accordion-item-header-disabled-color))}:host([disabled]) #content{color:var(--mod-accordion-item-content-disabled-color,var(--spectrum-accordion-item-content-disabled-color))}:host([open])>#heading>.iconContainer>.indicator,:host([open])>.iconContainer>.indicator{transform:rotate(90deg);transform:var(--spectrum-logical-rotation,)rotate(90deg)}:host([open])>#content{display:block}:host([disabled]) #header{cursor:default}@media (forced-colors:active){#header:after{forced-color-adjust:none;content:"";position:absolute;inset-inline-start:0}}:host{display:block}#heading{height:auto;position:relative}:host([disabled]) #heading .indicator{color:var(--mod-accordion-item-header-disabled-color,var(--spectrum-accordion-item-header-disabled-color))}
+`;
+export default styles;
+//# sourceMappingURL=accordion-item.css.dev.js.map