@spectrum-web-components/accordion 0.5.0 → 0.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +2 -1
- package/package.json +7 -7
- package/src/Accordion.d.ts +1 -1
- package/src/Accordion.js +2 -1
- package/src/Accordion.js.map +1 -1
- package/src/AccordionItem.d.ts +2 -1
- package/src/AccordionItem.js +3 -1
- package/src/AccordionItem.js.map +1 -1
package/custom-elements.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/accordion",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.1",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -46,19 +46,19 @@
|
|
|
46
46
|
"lit-html"
|
|
47
47
|
],
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@spectrum-web-components/base": "^0.
|
|
50
|
-
"@spectrum-web-components/icon": "^0.
|
|
51
|
-
"@spectrum-web-components/icons-ui": "^0.
|
|
52
|
-
"@spectrum-web-components/shared": "^0.
|
|
49
|
+
"@spectrum-web-components/base": "^0.5.1",
|
|
50
|
+
"@spectrum-web-components/icon": "^0.11.1",
|
|
51
|
+
"@spectrum-web-components/icons-ui": "^0.8.1",
|
|
52
|
+
"@spectrum-web-components/shared": "^0.13.1",
|
|
53
53
|
"tslib": "^2.0.0"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
|
-
"@spectrum-css/accordion": "^3.0.
|
|
56
|
+
"@spectrum-css/accordion": "^3.0.10"
|
|
57
57
|
},
|
|
58
58
|
"types": "./src/index.d.ts",
|
|
59
59
|
"customElements": "custom-elements.json",
|
|
60
60
|
"sideEffects": [
|
|
61
61
|
"./sp-*.js"
|
|
62
62
|
],
|
|
63
|
-
"gitHead": "
|
|
63
|
+
"gitHead": "df3f333ee26a45f9fc247716b6e8ef051dca630b"
|
|
64
64
|
}
|
package/src/Accordion.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CSSResultArray,
|
|
1
|
+
import { CSSResultArray, PropertyValues, TemplateResult } from '@spectrum-web-components/base';
|
|
2
2
|
import { AccordionItem } from './AccordionItem.js';
|
|
3
3
|
import { Focusable } from '@spectrum-web-components/shared';
|
|
4
4
|
/**
|
package/src/Accordion.js
CHANGED
|
@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
|
|
|
10
10
|
governing permissions and limitations under the License.
|
|
11
11
|
*/
|
|
12
12
|
import { __decorate } from "tslib";
|
|
13
|
-
import { html,
|
|
13
|
+
import { html, } from '@spectrum-web-components/base';
|
|
14
|
+
import { property, queryAssignedNodes, } from '@spectrum-web-components/base/src/decorators.js';
|
|
14
15
|
import styles from './accordion.css.js';
|
|
15
16
|
import { Focusable, getActiveElement } from '@spectrum-web-components/shared';
|
|
16
17
|
/**
|
package/src/Accordion.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["Accordion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;;AAEF,OAAO,
|
|
1
|
+
{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["Accordion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;;AAEF,OAAO,EAEH,IAAI,GAGP,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACH,QAAQ,EACR,kBAAkB,GACrB,MAAM,iDAAiD,CAAC;AAIzD,OAAO,MAAM,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAE9E;;;GAGG;AACH,MAAM,OAAO,SAAU,SAAQ,SAAS;IAAxC;;QAKI;;WAEG;QAEI,kBAAa,GAAG,KAAK,CAAC;IAmHjC,CAAC;IA3HU,MAAM,KAAK,MAAM;QACpB,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;IAEM,KAAK;QACR,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,EAAE;YAC5B,OAAO;SACV;QAED,KAAK,CAAC,KAAK,EAAE,CAAC;IAClB,CAAC;IAED;;OAEG;IACH,IAAW,YAAY;QACnB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACxB,OAAO,IAAI,CAAC;SACf;QACD,IAAI,KAAK,GAAG,CAAC,CAAC;QACd,OAAO,KAAK,GAAG,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;YAClE,KAAK,IAAI,CAAC,CAAC;SACd;QACD,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE;YACd,OAAO,KAAK,CAAC,KAAK,CAAC,CAAC;SACvB;QACD,oBAAoB;QACpB,OAAO,IAAI,CAAC;IAChB,CAAC;IAEM,wBAAwB;QAC3B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,sBAAsB;QACtB,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACxB,OAAO;SACV;QACD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACzD,CAAC;IAEM,uBAAuB;QAC1B,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC5D,CAAC;IAEO,aAAa,CAAC,KAAoB;QACtC,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;QACvB,sBAAsB;QACtB,IAAI,IAAI,KAAK,WAAW,IAAI,IAAI,KAAK,SAAS,EAAE;YAC5C,OAAO;SACV;QACD,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,MAAM,SAAS,GAAG,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAChD,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC;IACtC,CAAC;IAEO,iBAAiB,CAAC,SAAiB;QACvC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAkB,CAAC,CAAC;QACvE,IAAI,IAAI,GAAG,OAAO,CAAC;QACnB,IAAI,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;QAC3B,uGAAuG;QACvG,OAAO,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,IAAI,IAAI,KAAK,OAAO,CAAC,EAAE;YACxD,IAAI,GAAG,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC;YACxD,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;SAC1B;QACD,qEAAqE;QACrE,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,IAAI,IAAI,KAAK,OAAO,EAAE;YACpD,OAAO;SACV;QACD,QAAQ,CAAC,KAAK,EAAE,CAAC;IACrB,CAAC;IAEO,KAAK,CAAC,QAAQ,CAAC,KAAY;QAC/B,uDAAuD;QACvD,mDAAmD;QACnD,MAAM,CAAC,CAAC;QACR,IAAI,IAAI,CAAC,aAAa,IAAI,KAAK,CAAC,gBAAgB,EAAE;YAC9C,4DAA4D;YAC5D,OAAO;SACV;QACD,MAAM,MAAM,GAAG,KAAK,CAAC,MAAuB,CAAC;QAC7C,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;IAES,MAAM;QACZ,OAAO,IAAI,CAAA;;SAEV,CAAC;IACN,CAAC;IAES,YAAY,CAAC,OAAuB;QAC1C,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAE5B,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAChE,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,uBAAuB,CAAC,CAAC;QAChE,IAAI,CAAC,gBAAgB,CAAC,0BAA0B,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACrE,CAAC;CACJ;AAnHG;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 PropertyValues,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n property,\n queryAssignedNodes,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { AccordionItem } from './AccordionItem.js';\n\nimport styles from './accordion.css.js';\nimport { Focusable, getActiveElement } from '@spectrum-web-components/shared';\n\n/**\n * @element sp-accordion\n * @slot - The sp-accordion-item children to display.\n */\nexport class Accordion extends Focusable {\n public static 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 public focus(): void {\n if (this.focusElement === this) {\n return;\n }\n\n super.focus();\n }\n\n /**\n * @private\n */\n public get focusElement(): Accordion | AccordionItem {\n const items = this.items;\n if (items && !items.length) {\n return this;\n }\n let index = 0;\n while (index < items.length && items[index] && items[index].disabled) {\n index += 1;\n }\n if (items[index]) {\n return items[index];\n }\n /* c8 ignore next */\n return this;\n }\n\n public startListeningToKeyboard(): void {\n const items = this.items;\n /* c8 ignore next 3 */\n if (items && !items.length) {\n return;\n }\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n public stopListeningToKeyboard(): void {\n this.removeEventListener('keydown', this.handleKeydown);\n }\n\n private handleKeydown(event: KeyboardEvent): void {\n const { code } = event;\n /* c8 ignore next 3 */\n if (code !== 'ArrowDown' && code !== 'ArrowUp') {\n return;\n }\n event.preventDefault();\n const direction = code === 'ArrowDown' ? 1 : -1;\n this.focusItemByOffset(direction);\n }\n\n private focusItemByOffset(direction: number): void {\n const items = this.items;\n const focused = items.indexOf(getActiveElement(this) as AccordionItem);\n let next = focused;\n let nextItem = items[next];\n // cycle through the available items in the directions of the offset to find the next non-disabled item\n while (nextItem && (nextItem.disabled || next === focused)) {\n next = (items.length + next + direction) % items.length;\n nextItem = items[next];\n }\n // if there are no non-disabled items, skip the work to focus a child\n if (!nextItem || nextItem.disabled || next === focused) {\n return;\n }\n nextItem.focus();\n }\n\n private async onToggle(event: Event): Promise<void> {\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 target = event.target as AccordionItem;\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 protected render(): TemplateResult {\n return html`\n <slot></slot>\n `;\n }\n\n protected firstUpdated(changed: PropertyValues): void {\n super.firstUpdated(changed);\n\n this.addEventListener('focusin', this.startListeningToKeyboard);\n this.addEventListener('focusout', this.stopListeningToKeyboard);\n this.addEventListener('sp-accordion-item-toggle', this.onToggle);\n }\n}\n"]}
|
package/src/AccordionItem.d.ts
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
import { CSSResultArray,
|
|
1
|
+
import { CSSResultArray, PropertyValues, TemplateResult } from '@spectrum-web-components/base';
|
|
2
2
|
import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
|
|
3
3
|
import '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';
|
|
4
4
|
/**
|
|
5
5
|
* @element sp-accordion-item
|
|
6
6
|
* @slot - The content of the item that is hidden when the item is not open
|
|
7
|
+
* @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled.
|
|
7
8
|
*/
|
|
8
9
|
export declare class AccordionItem extends Focusable {
|
|
9
10
|
static get styles(): CSSResultArray;
|
package/src/AccordionItem.js
CHANGED
|
@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
|
|
|
10
10
|
governing permissions and limitations under the License.
|
|
11
11
|
*/
|
|
12
12
|
import { __decorate } from "tslib";
|
|
13
|
-
import { html,
|
|
13
|
+
import { html, } from '@spectrum-web-components/base';
|
|
14
|
+
import { property } from '@spectrum-web-components/base/src/decorators.js';
|
|
14
15
|
import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
|
|
15
16
|
import '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';
|
|
16
17
|
import chevronIconStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';
|
|
@@ -18,6 +19,7 @@ import styles from './accordion-item.css.js';
|
|
|
18
19
|
/**
|
|
19
20
|
* @element sp-accordion-item
|
|
20
21
|
* @slot - The content of the item that is hidden when the item is not open
|
|
22
|
+
* @fires sp-accordion-item-toggle - Announce that an accordion item has been toggled while allowing the event to be cancelled.
|
|
21
23
|
*/
|
|
22
24
|
export class AccordionItem extends Focusable {
|
|
23
25
|
constructor() {
|
package/src/AccordionItem.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["AccordionItem.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;;AAEF,OAAO,
|
|
1
|
+
{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["AccordionItem.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;;AAEF,OAAO,EAEH,IAAI,GAGP,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,iDAAiD,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,MAAM,kDAAkD,CAAC;AAC7E,OAAO,+DAA+D,CAAC;AACvE,OAAO,iBAAiB,MAAM,gEAAgE,CAAC;AAE/F,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAE7C;;;;GAIG;AACH,MAAM,OAAO,aAAc,SAAQ,SAAS;IAkBxC;QACI,KAAK,EAAE,CAAC;QAbL,SAAI,GAAG,KAAK,CAAC;QAGb,UAAK,GAAG,EAAE,CAAC;QAGX,aAAQ,GAAG,KAAK,CAAC;QAQpB,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;IACrD,CAAC;IApBM,MAAM,KAAK,MAAM;QACpB,OAAO,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;IACvC,CAAC;IAWD,IAAW,YAAY;QACnB,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAgB,CAAC;IACnE,CAAC;IAOO,SAAS,CAAC,KAAoB;QAClC,sBAAsB;QACtB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,OAAO;SACV;QACD,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAClD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,MAAM,EAAE,CAAC;SACjB;IACL,CAAC;IAEO,OAAO;QACX,sBAAsB;QACtB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,OAAO;SACV;QACD,IAAI,CAAC,MAAM,EAAE,CAAC;IAClB,CAAC;IAEO,MAAM;QACV,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;QACvB,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CACnC,IAAI,WAAW,CAAC,0BAA0B,EAAE;YACxC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,UAAU,EAAE,IAAI;SACnB,CAAC,CACL,CAAC;QACF,IAAI,CAAC,YAAY,EAAE;YACf,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;SAC1B;IACL,CAAC;IAES,MAAM;QACZ,OAAO,IAAI,CAAA;;;;6BAIU,IAAI,CAAC,OAAO;oCACL,IAAI,CAAC,IAAI;;;sBAGvB,IAAI,CAAC,KAAK;;;;;;;;;;SAUvB,CAAC;IACN,CAAC;IAES,OAAO,CAAC,OAAuB;QACrC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QACvB,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;YACzB,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACf,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;aAC9C;iBAAM;gBACH,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;aACzC;SACJ;IACL,CAAC;CACJ;AAlFG;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CACvB;AAGpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CACxB;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CACnB","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 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 disabled = false;\n\n public get focusElement(): HTMLElement {\n return this.shadowRoot.querySelector('#header') as HTMLElement;\n }\n\n constructor() {\n super();\n this.addEventListener('keydown', this.onKeyDown);\n }\n\n private onKeyDown(event: KeyboardEvent): void {\n /* c8 ignore next 3 */\n if (this.disabled) {\n return;\n }\n if (event.code === 'Enter' || event.code === 'Space') {\n event.preventDefault();\n this.toggle();\n }\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 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 >\n ${this.label}\n </button>\n <sp-icon-chevron100\n id=\"indicator\"\n class=\"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 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"]}
|