@spectrum-web-components/accordion 0.6.13 → 0.6.15-devmode.7

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/accordion",
-    "version": "0.6.13",
+    "version": "0.6.15-devmode.7+8303f3a2a",
     "publishConfig": {
         "access": "public"
     },
@@ -20,13 +20,33 @@
     "module": "./src/index.js",
     "type": "module",
     "exports": {
-        ".": "./src/index.js",
-        "./src/*": "./src/*",
+        ".": {
+            "development": "./src/index.dev.js",
+            "default": "./src/index.js"
+        },
         "./package.json": "./package.json",
-        "./sp-accordion": "./sp-accordion.js",
-        "./sp-accordion.js": "./sp-accordion.js",
-        "./sp-accordion-item": "./sp-accordion-item.js",
-        "./sp-accordion-item.js": "./sp-accordion-item.js"
+        "./src/Accordion.js": {
+            "development": "./src/Accordion.dev.js",
+            "default": "./src/Accordion.js"
+        },
+        "./src/AccordionItem.js": {
+            "development": "./src/AccordionItem.dev.js",
+            "default": "./src/AccordionItem.js"
+        },
+        "./src/accordion-item.css.js": "./src/accordion-item.css.js",
+        "./src/accordion.css.js": "./src/accordion.css.js",
+        "./src/index.js": {
+            "development": "./src/index.dev.js",
+            "default": "./src/index.js"
+        },
+        "./sp-accordion.js": {
+            "development": "./sp-accordion.dev.js",
+            "default": "./sp-accordion.js"
+        },
+        "./sp-accordion-item.js": {
+            "development": "./sp-accordion-item.dev.js",
+            "default": "./sp-accordion-item.js"
+        }
     },
     "scripts": {
         "test": "karma start --coverage"
@@ -46,19 +66,20 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.5.8",
-        "@spectrum-web-components/icon": "^0.11.10",
-        "@spectrum-web-components/icons-ui": "^0.8.10",
-        "@spectrum-web-components/shared": "^0.14.3",
+        "@spectrum-web-components/base": "^0.5.9-devmode.31+8303f3a2a",
+        "@spectrum-web-components/icon": "^0.11.12-devmode.7+8303f3a2a",
+        "@spectrum-web-components/icons-ui": "^0.8.12-devmode.7+8303f3a2a",
+        "@spectrum-web-components/reactive-controllers": "^0.2.5-devmode.86+8303f3a2a",
+        "@spectrum-web-components/shared": "^0.14.5-devmode.7+8303f3a2a",
         "tslib": "^2.0.0"
     },
     "devDependencies": {
-        "@spectrum-css/accordion": "^3.0.22"
+        "@spectrum-css/accordion": "^3.0.24"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
     "sideEffects": [
         "./sp-*.js"
     ],
-    "gitHead": "e5cd4a0db2201b8126eb9133ac3c24172d086359"
+    "gitHead": "8303f3a2a90b0aedc15158797662ccfa8f4a2031"
 }

package/sp-accordion-item.dev.js

@@ -0,0 +1,3 @@
+import { AccordionItem } from "./src/AccordionItem.dev.js";
+customElements.define("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'\n\ncustomElements.define('sp-accordion-item', AccordionItem);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion-item': AccordionItem;\n    }\n}\n"],
+  "mappings": "AAWA;AAEA,eAAe,OAAO,qBAAqB,aAAa;",
+  "names": []
+}

package/sp-accordion-item.js

@@ -1,14 +1,3 @@
-/*
-Copyright 2020 Adobe. All rights reserved.
-This file is licensed to you under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License. You may obtain a copy
-of the License at http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software distributed under
-the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
-OF ANY KIND, either express or implied. See the License for the specific language
-governing permissions and limitations under the License.
-*/
-import { AccordionItem } from './src/AccordionItem.js';
-customElements.define('sp-accordion-item', AccordionItem);
-//# sourceMappingURL=sp-accordion-item.js.map
+import { AccordionItem } from "./src/AccordionItem.js";
+customElements.define("sp-accordion-item", AccordionItem);
+//# sourceMappingURL=sp-accordion-item.js.map

package/sp-accordion-item.js.map

@@ -1 +1,7 @@
-{"version":3,"file":"sp-accordion-item.js","sourceRoot":"","sources":["sp-accordion-item.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,cAAc,CAAC,MAAM,CAAC,mBAAmB,EAAE,aAAa,CAAC,CAAC","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';\n\ncustomElements.define('sp-accordion-item', AccordionItem);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion-item': AccordionItem;\n    }\n}\n"]}
+{
+  "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';\n\ncustomElements.define('sp-accordion-item', AccordionItem);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion-item': AccordionItem;\n    }\n}\n"],
+  "mappings": "AAWA;AAEA,eAAe,OAAO,qBAAqB,aAAa;",
+  "names": []
+}

package/sp-accordion.dev.js

@@ -0,0 +1,3 @@
+import { Accordion } from "./src/Accordion.dev.js";
+customElements.define("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'\n\ncustomElements.define('sp-accordion', Accordion);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion': Accordion;\n    }\n}\n"],
+  "mappings": "AAWA;AAEA,eAAe,OAAO,gBAAgB,SAAS;",
+  "names": []
+}

package/sp-accordion.js

@@ -1,14 +1,3 @@
-/*
-Copyright 2020 Adobe. All rights reserved.
-This file is licensed to you under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License. You may obtain a copy
-of the License at http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software distributed under
-the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
-OF ANY KIND, either express or implied. See the License for the specific language
-governing permissions and limitations under the License.
-*/
-import { Accordion } from './src/Accordion.js';
-customElements.define('sp-accordion', Accordion);
-//# sourceMappingURL=sp-accordion.js.map
+import { Accordion } from "./src/Accordion.js";
+customElements.define("sp-accordion", Accordion);
+//# sourceMappingURL=sp-accordion.js.map

package/sp-accordion.js.map

@@ -1 +1,7 @@
-{"version":3,"file":"sp-accordion.js","sourceRoot":"","sources":["sp-accordion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,cAAc,CAAC,MAAM,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC","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';\n\ncustomElements.define('sp-accordion', Accordion);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion': Accordion;\n    }\n}\n"]}
+{
+  "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';\n\ncustomElements.define('sp-accordion', Accordion);\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        'sp-accordion': Accordion;\n    }\n}\n"],
+  "mappings": "AAWA;AAEA,eAAe,OAAO,gBAAgB,SAAS;",
+  "names": []
+}

package/src/Accordion.dev.js

@@ -0,0 +1,75 @@
+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,
+  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 SpectrumElement {
+  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();
+  }
+  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([
+  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    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 SpectrumElement {\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    @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    }\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;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAIA;AAIA;AAMO,aAAM,kBAAkB,gBAAgB;AAAA,EAAxC;AAAA;AASI,yBAAgB;AAWvB,gCAAuB,IAAI,qBAAoC,MAAM;AAAA,MACjE,WAAW;AAAA,MACX,UAAU,MAAM,KAAK;AAAA,MACrB,oBAAoB,CAAC,OAAsB,CAAC,GAAG;AAAA,IACnD,CAAC;AAAA;AAAA,aAvB0B,SAAyB;AAChD,WAAO,CAAC,MAAM;AAAA,EAClB;AAAA,MAWY,QAAyB;AACjC,WAAO,CAAC,GAAI,KAAK,gBAAgB,CAAC,CAAE,EAAE,OAClC,CAAC,SAAsB,OAAO,KAAK,YAAY,WACnD;AAAA,EACJ;AAAA,EAQgB,QAAc;AAC1B,SAAK,qBAAqB,MAAM;AAAA,EACpC;AAAA,QAEc,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;AAAA,EAChD;AAAA,EAEmB,SAAyB;AACxC,WAAO;AAAA;AAAA,8BAEe,KAAK;AAAA,4CACS,KAAK;AAAA;AAAA;AAAA,EAG7C;AACJ;AAxDW;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,iBAAiB,CAAC;AAAA,GAChE,AATJ,UASI;AAGC;AAAA,EADR,AAAC,mBAAmB;AAAA,GACZ,AAZL,UAYK;",
+  "names": []
+}

package/src/Accordion.js

@@ -1,83 +1,75 @@
-/*
-Copyright 2020 Adobe. All rights reserved.
-This file is licensed to you under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License. You may obtain a copy
-of the License at http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software distributed under
-the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
-OF ANY KIND, either express or implied. See the License for the specific language
-governing permissions and limitations under the License.
-*/
-import { __decorate } from "tslib";
-import { html, 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';
-/**
- * @element sp-accordion
- * @slot - The sp-accordion-item children to display.
- */
+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,
+  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 SpectrumElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * Allows multiple accordion items to be opened at the same time
-         */
-        this.allowMultiple = false;
-        this.focusGroupController = new FocusGroupController(this, {
-            direction: 'vertical',
-            elements: () => this.items,
-            isFocusableElement: (el) => !el.disabled,
-        });
+  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;
     }
-    static get styles() {
-        return [styles];
+    const items = [...this.items];
+    if (items && !items.length) {
+      return;
     }
-    get items() {
-        return [...(this.defaultNodes || [])].filter((node) => typeof node.tagName !== 'undefined');
-    }
-    focus() {
-        this.focusGroupController.focus();
-    }
-    async onToggle(event) {
-        const target = event.target;
-        // Let the event pass through the DOM so that it can be
-        // prevented from the outside if a user so desires.
-        await 0;
-        if (this.allowMultiple || event.defaultPrevented) {
-            // No toggling when `allowMultiple` or the user prevents it.
-            return;
-        }
-        const items = [...this.items];
-        /* c8 ignore next 3 */
-        if (items && !items.length) {
-            // no toggling when there aren't items.
-            return;
-        }
-        items.forEach((item) => {
-            if (item !== target) {
-                // Close all the items that didn't dispatch the event.
-                item.open = false;
-            }
-        });
-    }
-    handleSlotchange() {
-        this.focusGroupController.clearElementCache();
-    }
-    render() {
-        return html `
+    items.forEach((item) => {
+      if (item !== target) {
+        item.open = false;
+      }
+    });
+  }
+  handleSlotchange() {
+    this.focusGroupController.clearElementCache();
+  }
+  render() {
+    return html`
             <slot
                 @slotchange=${this.handleSlotchange}
                 @sp-accordion-item-toggle=${this.onToggle}
             ></slot>
         `;
-    }
+  }
 }
-__decorate([
-    property({ type: Boolean, reflect: true, attribute: 'allow-multiple' })
-], Accordion.prototype, "allowMultiple", void 0);
-__decorate([
-    queryAssignedNodes()
-], Accordion.prototype, "defaultNodes", void 0);
-//# sourceMappingURL=Accordion.js.map
+__decorateClass([
+  property({ type: Boolean, reflect: true, attribute: "allow-multiple" })
+], Accordion.prototype, "allowMultiple", 2);
+__decorateClass([
+  queryAssignedNodes()
+], Accordion.prototype, "defaultNodes", 2);
+//# sourceMappingURL=Accordion.js.map

package/src/Accordion.js.map

@@ -1 +1,7 @@
-{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["Accordion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;;AAEF,OAAO,EAEH,IAAI,EACJ,eAAe,GAElB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACH,QAAQ,EACR,kBAAkB,GACrB,MAAM,iDAAiD,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iEAAiE,CAAC;AAIvG,OAAO,MAAM,MAAM,oBAAoB,CAAC;AAExC;;;GAGG;AACH,MAAM,OAAO,SAAU,SAAQ,eAAe;IAA9C;;QAKI;;WAEG;QAEI,kBAAa,GAAG,KAAK,CAAC;QAW7B,yBAAoB,GAAG,IAAI,oBAAoB,CAAgB,IAAI,EAAE;YACjE,SAAS,EAAE,UAAU;YACrB,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK;YAC1B,kBAAkB,EAAE,CAAC,EAAiB,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ;SAC1D,CAAC,CAAC;IAyCP,CAAC;IAhEU,MAAM,KAAc,MAAM;QAC7B,OAAO,CAAC,MAAM,CAAC,CAAC;IACpB,CAAC;IAWD,IAAY,KAAK;QACb,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CACxC,CAAC,IAAiB,EAAE,EAAE,CAAC,OAAO,IAAI,CAAC,OAAO,KAAK,WAAW,CAC1C,CAAC;IACzB,CAAC;IAQe,KAAK;QACjB,IAAI,CAAC,oBAAoB,CAAC,KAAK,EAAE,CAAC;IACtC,CAAC;IAEO,KAAK,CAAC,QAAQ,CAAC,KAAY;QAC/B,MAAM,MAAM,GAAG,KAAK,CAAC,MAAuB,CAAC;QAC7C,uDAAuD;QACvD,mDAAmD;QACnD,MAAM,CAAC,CAAC;QACR,IAAI,IAAI,CAAC,aAAa,IAAI,KAAK,CAAC,gBAAgB,EAAE;YAC9C,4DAA4D;YAC5D,OAAO;SACV;QACD,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAoB,CAAC;QACjD,sBAAsB;QACtB,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACxB,uCAAuC;YACvC,OAAO;SACV;QACD,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;YACnB,IAAI,IAAI,KAAK,MAAM,EAAE;gBACjB,sDAAsD;gBACtD,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;aACrB;QACL,CAAC,CAAC,CAAC;IACP,CAAC;IAEO,gBAAgB;QACpB,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,EAAE,CAAC;IAClD,CAAC;IAEkB,MAAM;QACrB,OAAO,IAAI,CAAA;;8BAEW,IAAI,CAAC,gBAAgB;4CACP,IAAI,CAAC,QAAQ;;SAEhD,CAAC;IACN,CAAC;CACJ;AAxDG;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;gDAC3C;AAG7B;IADC,kBAAkB,EAAE;+CAC4B","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    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 SpectrumElement {\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    @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    }\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"]}
+{
+  "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    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 SpectrumElement {\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    @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    }\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;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAIA;AAIA;AAMO,aAAM,kBAAkB,gBAAgB;AAAA,EAAxC;AAAA;AASI,yBAAgB;AAWvB,gCAAuB,IAAI,qBAAoC,MAAM;AAAA,MACjE,WAAW;AAAA,MACX,UAAU,MAAM,KAAK;AAAA,MACrB,oBAAoB,CAAC,OAAsB,CAAC,GAAG;AAAA,IACnD,CAAC;AAAA;AAAA,aAvB0B,SAAyB;AAChD,WAAO,CAAC,MAAM;AAAA,EAClB;AAAA,MAWY,QAAyB;AACjC,WAAO,CAAC,GAAI,KAAK,gBAAgB,CAAC,CAAE,EAAE,OAClC,CAAC,SAAsB,OAAO,KAAK,YAAY,WACnD;AAAA,EACJ;AAAA,EAQgB,QAAc;AAC1B,SAAK,qBAAqB,MAAM;AAAA,EACpC;AAAA,QAEc,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;AAAA,EAChD;AAAA,EAEmB,SAAyB;AACxC,WAAO;AAAA;AAAA,8BAEe,KAAK;AAAA,4CACS,KAAK;AAAA;AAAA;AAAA,EAG7C;AACJ;AAxDW;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,iBAAiB,CAAC;AAAA,GAChE,AATJ,UASI;AAGC;AAAA,EADR,AAAC,mBAAmB;AAAA,GACZ,AAZL,UAYK;",
+  "names": []
+}

package/src/AccordionItem.dev.js

@@ -0,0 +1,91 @@
+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
+} 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 "@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js";
+import chevronIconStyles from "@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js";
+import styles from "./accordion-item.css.js";
+export class AccordionItem extends Focusable {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.label = "";
+    this.disabled = false;
+  }
+  static get styles() {
+    return [styles, chevronIconStyles];
+  }
+  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">
+                <button
+                    id="header"
+                    @click=${this.onClick}
+                    aria-expanded=${this.open}
+                    aria-controls="content"
+                    ?disabled=${this.disabled}
+                >
+                    ${this.label}
+                </button>
+                <sp-icon-chevron100
+                    class="indicator spectrum-UIIcon-ChevronRight100"
+                ></sp-icon-chevron100>
+            </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    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 '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';\nimport chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';\n\nimport styles from './accordion-item.css.js';\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 Focusable {\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    @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 override render(): TemplateResult {\n        return html`\n            <h3 id=\"heading\">\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                <sp-icon-chevron100\n                    class=\"indicator spectrum-UIIcon-ChevronRight100\"\n                ></sp-icon-chevron100>\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;AAAA;AAMA;AACA;AACA;AACA;AAEA;AAOO,aAAM,sBAAsB,UAAU;AAAA,EAAtC;AAAA;AAMI,gBAAO;AAGP,iBAAQ;AAGC,oBAAW;AAAA;AAAA,aAXA,SAAyB;AAChD,WAAO,CAAC,QAAQ,iBAAiB;AAAA,EACrC;AAAA,MAWoB,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,cACtB,IAAI,YAAY,4BAA4B;AAAA,MACxC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,YAAY;AAAA,IAChB,CAAC,CACL;AACA,QAAI,CAAC,cAAc;AACf,WAAK,OAAO,CAAC,KAAK;AAAA,IACtB;AAAA,EACJ;AAAA,EAEmB,SAAyB;AACxC,WAAO;AAAA;AAAA;AAAA;AAAA,6BAIc,KAAK;AAAA,oCACE,KAAK;AAAA;AAAA,gCAET,KAAK;AAAA;AAAA,sBAEf,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUvB;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;AAlEW;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GACnC,AANJ,cAMI;AAGA;AAAA,EADP,AAAC,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAClC,AATJ,cASI;AAGS;AAAA,EADhB,AAAC,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAC1B,AAZb,cAYa;",
+  "names": []
+}