@spectrum-web-components/table 0.37.0 → 0.38.0

package/README.md

@@ -246,8 +246,11 @@ For large amounts of data, the `<sp-table>` can be virtualised to easily add tab
         return items;
     }
 
-    const initTable = () => {
+    const initTable = async () => {
         const table = document.querySelector('#table-virtualized-demo');
+
+        await table.updateComplete;
+        await table.closest('code-example')?.updateComplete;
         table.items = initItems(50);
 
         table.renderItem = (item, index) => { 
@@ -260,8 +263,10 @@ For large amounts of data, the `<sp-table>` can be virtualised to easily add tab
             return [cell1, cell2, cell3];
         }
     };
-    customElements.whenDefined('sp-table').then(() => {
-        initTable();
+    customElements.whenDefined('code-example').then(() => {
+        customElements.whenDefined('sp-table').then(() => {
+            initTable();
+        });
     });
 </script>
 
@@ -373,8 +378,11 @@ By default the `selected` property will surface an array of item indexes that ar
         return items;
     }
 
-    const initTable = () => {
+    const initTable = async () => {
         const table = document.querySelector('#table-item-value-demo');
+
+        await table.updateComplete;
+        await table.closest('code-example')?.updateComplete;
         table.items = initItems(50);
         table.itemValue = (item) => item.id;
 
@@ -393,8 +401,10 @@ By default the `selected` property will surface an array of item indexes that ar
             selected.textContent = `Selected: ${JSON.stringify(event.target.selected, null, ' ')}`;
         });
     };
-    customElements.whenDefined('sp-table').then(() => {
-        initTable();
+    customElements.whenDefined('code-example').then(() => {
+        customElements.whenDefined('sp-table').then(() => {
+            initTable();
+        });
     });
 </script>
 
@@ -472,8 +482,11 @@ All values in the item array are assumed to be homogenous by default. This means
         return items;
     }
 
-    const initTable = () => {
+    const initTable = async () => {
         const table = document.querySelector('#table-row-type-demo');
+
+        await table.updateComplete;
+        await table.closest('code-example')?.updateComplete;
         const items = initItems(50);
         items.splice(3, 0, {
             _$rowType$: 1,
@@ -496,8 +509,10 @@ All values in the item array are assumed to be homogenous by default. This means
             return [cell1, cell2, cell3];
         };
     };
-    customElements.whenDefined('sp-table').then(() => {
-        initTable();
+    customElements.whenDefined('code-example').then(() => {
+        customElements.whenDefined('sp-table').then(() => {
+            initTable();
+        });
     });
 </script>
 
@@ -591,9 +606,12 @@ For each table column you want to sort, use the `sortable` attribute in its resp
 
     let items = initItems(50);
 
-    const initTable = () => {
+    const initTable = async () => {
         const table = document.querySelector('#sorted-virtualized-table');
 
+        await table.updateComplete;
+        await table.closest('code-example')?.updateComplete;
+
         table.items = items;
 
         table.renderItem = (item, index) => { 
@@ -618,7 +636,9 @@ For each table column you want to sort, use the `sortable` attribute in its resp
         });
     };
 
-    customElements.whenDefined('sp-table').then(() => {
-        initTable();
+    customElements.whenDefined('code-example').then(() => {
+        customElements.whenDefined('sp-table').then(() => {
+            initTable();
+        });
     });
 </script>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/table",
-    "version": "0.37.0",
+    "version": "0.38.0",
     "publishConfig": {
         "access": "public"
     },
@@ -116,11 +116,11 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@lit-labs/virtualizer": "^2.0.2",
-        "@spectrum-web-components/base": "^0.37.0",
-        "@spectrum-web-components/checkbox": "^0.37.0",
-        "@spectrum-web-components/icon": "^0.37.0",
-        "@spectrum-web-components/icons-ui": "^0.37.0"
+        "@lit-labs/virtualizer": "^2.0.6",
+        "@spectrum-web-components/base": "^0.38.0",
+        "@spectrum-web-components/checkbox": "^0.38.0",
+        "@spectrum-web-components/icon": "^0.38.0",
+        "@spectrum-web-components/icons-ui": "^0.38.0"
     },
     "devDependencies": {
         "@spectrum-css/table": "^4.0.66"
@@ -132,5 +132,5 @@
         "./elements.js",
         "./**/*.dev.js"
     ],
-    "gitHead": "d771f62f0d8063070af43283bb0fd5e3400bad06"
+    "gitHead": "9a099b7543672f2fd4030833ab813b16c2cad62e"
 }

package/src/Table.dev.js

@@ -12,6 +12,7 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 import {
   html,
+  nothing,
   render,
   SizedMixin,
   SpectrumElement
@@ -36,7 +37,7 @@ export var RowType = /* @__PURE__ */ ((RowType2) => {
 })(RowType || {});
 export class Table extends SizedMixin(SpectrumElement, {
   validSizes: ["s", "m"],
-  defaultSize: "m"
+  noDefaultSize: true
 }) {
   constructor() {
     super(...arguments);
@@ -72,7 +73,7 @@ export class Table extends SizedMixin(SpectrumElement, {
                               <sp-table-checkbox-cell
                                   ?checked=${selected}
                               ></sp-table-checkbox-cell>
-                          ` : html``}
+                          ` : nothing}
                     ${fn(item, index)}
                 </sp-table-row>
             `;
@@ -134,6 +135,7 @@ export class Table extends SizedMixin(SpectrumElement, {
     this.tableHeadCheckboxCell.indeterminate = false;
   }
   manageSelects() {
+    var _a;
     const checkboxes = this.querySelectorAll("sp-table-checkbox-cell");
     const checkbox = document.createElement("sp-table-checkbox-cell");
     if (!!this.selects) {
@@ -155,7 +157,7 @@ export class Table extends SizedMixin(SpectrumElement, {
         this.tableHeadCheckboxCell = document.createElement(
           "sp-table-checkbox-cell"
         );
-        this.tableHead.insertAdjacentElement(
+        (_a = this.tableHead) == null ? void 0 : _a.insertAdjacentElement(
           "afterbegin",
           this.tableHeadCheckboxCell
         );
@@ -207,14 +209,14 @@ export class Table extends SizedMixin(SpectrumElement, {
     }
   }
   manageCheckboxes() {
-    var _a;
+    var _a, _b, _c;
     if (!!this.selects) {
       this.tableHeadCheckboxCell = document.createElement(
         "sp-table-checkbox-cell"
       );
       const allSelected = this.selected.length === this.tableRows.length;
       this.manageHeadCheckbox(allSelected);
-      this.tableHead.insertAdjacentElement(
+      (_a = this.tableHead) == null ? void 0 : _a.insertAdjacentElement(
         "afterbegin",
         this.tableHeadCheckboxCell
       );
@@ -227,7 +229,7 @@ export class Table extends SizedMixin(SpectrumElement, {
         checkbox.checked = row.selected;
       });
     } else {
-      (_a = this.tableHead.querySelector("sp-table-checkbox-cell")) == null ? void 0 : _a.remove();
+      (_c = (_b = this.tableHead) == null ? void 0 : _b.querySelector("sp-table-checkbox-cell")) == null ? void 0 : _c.remove();
       this.tableRows.forEach((row) => {
         var _a2;
         (_a2 = row.checkboxCells[0]) == null ? void 0 : _a2.remove();

package/src/Table.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Table.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 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    render,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\n// Leveraged in build systems that use aliasing to prevent multiple registrations: https://github.com/adobe/spectrum-web-components/pull/3225\nimport '@spectrum-web-components/table/sp-table-body.js';\nimport '@spectrum-web-components/table/sp-table-row.js';\nimport '@spectrum-web-components/table/sp-table-checkbox-cell.js';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport styles from './table.css.js';\nimport { TableBody } from './TableBody.dev.js'\nimport type { TableCheckboxCell } from './TableCheckboxCell.dev.js'\nimport type { TableHead } from './TableHead.dev.js'\nimport type { TableHeadCell } from './TableHeadCell.dev.js'\nimport type { TableRow } from './TableRow.dev.js'\nimport {\n    virtualize,\n    VirtualizeDirectiveConfig,\n    virtualizerRef,\n} from '@lit-labs/virtualizer/virtualize.js';\nimport { Virtualizer } from '@lit-labs/virtualizer/Virtualizer.js';\nimport {\n    RangeChangedEvent,\n    VisibilityChangedEvent,\n} from '@lit-labs/virtualizer/events.js';\n\nexport enum RowType {\n    ITEM = 0,\n    INFORMATION = 1,\n}\n\nexport interface TableItem extends Record<string, unknown> {\n    _$rowType$?: RowType;\n}\n\n/**\n * @element sp-table\n *\n * @fires rangeChanged - Announces a change in the range of visible cells on the table body\n * @event change - Announces a change in the `selected` property of a table row\n */\n\nexport class Table extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm'],\n    defaultSize: 'm',\n}) {\n    public static override get styles(): CSSResultArray {\n        return [styles];\n    }\n\n    get renderItem(): (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult {\n        return this._renderItem;\n    }\n\n    set renderItem(\n        fn: (item: Record<string, unknown>, index: number) => TemplateResult\n    ) {\n        this._renderItem = (\n            item: Record<string, unknown>,\n            index: number\n        ): TemplateResult => {\n            const value = this.itemValue(item, index);\n            const selected = this.selected.includes(value);\n            const hasCheckbox = this.selects && item?._$rowType$ !== 1;\n\n            return html`\n                <sp-table-row\n                    value=${value}\n                    aria-rowindex=${index + 1}\n                    ?selected=${selected}\n                >\n                    ${hasCheckbox\n                        ? html`\n                              <sp-table-checkbox-cell\n                                  ?checked=${selected}\n                              ></sp-table-checkbox-cell>\n                          `\n                        : html``}\n                    ${fn(item, index)}\n                </sp-table-row>\n            `;\n        };\n    }\n\n    private _renderItem: (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult = /* c8 ignore next */ () => html``;\n\n    @property({ reflect: true })\n    public role = 'grid';\n\n    /**\n     * Whether the Table allows users to select a row or rows, and thus controls whether or not the Table also renders checkboxes.\n     */\n    @property({ type: String, reflect: true })\n    public selects: undefined | 'single' | 'multiple';\n\n    /**\n     * An array of <sp-row> values that have been selected.\n     */\n    @property({ type: Array })\n    public selected: string[] = [];\n\n    private selectedSet = new Set<string>();\n\n    /**\n     * The content of the rows rendered by the virtualized table. The key is the value of the sp-table-row, and the value is the sp-table-row's content (not the row itself).\n     */\n    @property({ type: Array })\n    public items: Record<string, unknown>[] = [];\n\n    /**\n     * The value of an item. By default, it is set to the index of the sp-table-row.\n     */\n    @property({ type: Object })\n    public itemValue = (_item: unknown, index: number): string => {\n        return `${index}`;\n    };\n\n    /**\n     * Whether or not the virtualized table has a scroll bar. If this is set to true, make sure to specify a height in the sp-table's inline styles.\n     */\n    @property({ type: Boolean, reflect: true })\n    public scroller = false;\n\n    private tableBody?: TableBody;\n\n    private tableHeadCheckboxCell?: TableCheckboxCell;\n\n    private get tableHead(): TableHead {\n        return this.querySelector('sp-table-head') as TableHead;\n    }\n\n    private get tableRows(): TableRow[] {\n        if (this.isVirtualized) {\n            return [];\n        }\n        return [...this.querySelectorAll('sp-table-row')] as TableRow[];\n    }\n\n    private get isVirtualized(): boolean {\n        return !!this.items.length;\n    }\n\n    public override focus(): void {\n        const sortableHeadCell = this.querySelector(\n            'sp-table-head-cell[sortable]'\n        ) as TableHeadCell;\n        if (sortableHeadCell) {\n            sortableHeadCell.focus();\n        }\n    }\n\n    private selectAllRows(): void {\n        if (this.isVirtualized) {\n            this.items.forEach((item, index: number) => {\n                if (item._$rowType$ !== 1) {\n                    this.selectedSet.add(this.itemValue(item, index));\n                }\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                row.selected = true; // Visually\n                this.selectedSet.add(row.value); // Prepares table state\n            });\n        }\n        this.selected = [...this.selectedSet];\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = true;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    private deselectAllRows(): void {\n        this.selectedSet.clear();\n        this.selected = [];\n\n        if (!this.isVirtualized) {\n            const selectedRows = [\n                ...this.querySelectorAll('[selected]'),\n            ] as TableRow[];\n\n            selectedRows.forEach((row) => {\n                row.selected = false;\n            });\n        }\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = false;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    protected manageSelects(): void {\n        const checkboxes = this.querySelectorAll('sp-table-checkbox-cell');\n        const checkbox = document.createElement('sp-table-checkbox-cell');\n        if (!!this.selects) {\n            let allSelected = false;\n            if (this.isVirtualized) {\n                allSelected =\n                    this.selected.length > 0 &&\n                    this.selected.length === this.items.length;\n            } else {\n                this.tableRows.forEach((row) => {\n                    row.selected = this.selectedSet.has(row.value);\n                    if (!row.querySelector(':scope > sp-table-checkbox-cell')) {\n                        const clonedCheckbox =\n                            checkbox.cloneNode() as TableCheckboxCell;\n                        row.insertAdjacentElement('afterbegin', clonedCheckbox);\n                        checkbox.checked = row.selected;\n                    }\n                });\n                allSelected = this.selected.length === this.tableRows.length;\n            }\n\n            if (!this.tableHeadCheckboxCell) {\n                this.tableHeadCheckboxCell = document.createElement(\n                    'sp-table-checkbox-cell'\n                ) as TableCheckboxCell;\n                this.tableHead.insertAdjacentElement(\n                    'afterbegin',\n                    this.tableHeadCheckboxCell\n                );\n            }\n            this.manageHeadCheckbox(allSelected);\n        } else {\n            checkboxes.forEach((box) => {\n                box.remove();\n            });\n            delete this.tableHeadCheckboxCell;\n        }\n    }\n\n    protected validateSelected(): void {\n        const rowValues = new Set<string>();\n\n        if (this.isVirtualized) {\n            this.items.forEach((item, index) => {\n                const value = this.itemValue(item, index);\n                rowValues.add(value);\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                rowValues.add(row.value);\n            });\n        }\n\n        const oldSelectedCount = this.selected.length;\n\n        this.selected = this.selected.filter((selectedItem) =>\n            rowValues.has(selectedItem)\n        );\n        if (oldSelectedCount !== this.selected.length) {\n            this.dispatchEvent(\n                new Event('change', {\n                    cancelable: true,\n                    bubbles: true,\n                    composed: true,\n                })\n            );\n        }\n        this.selectedSet = new Set(this.selected);\n    }\n\n    protected manageSelected(): void {\n        this.validateSelected();\n\n        if (this.isVirtualized) return;\n\n        this.tableRows.forEach((row) => {\n            row.selected = this.selectedSet.has(row.value);\n        });\n        if (this.tableHeadCheckboxCell) {\n            this.tableHeadCheckboxCell.checked =\n                this.selected.length === this.tableRows.length;\n        }\n    }\n\n    protected manageCheckboxes(): void {\n        if (!!this.selects) {\n            this.tableHeadCheckboxCell = document.createElement(\n                'sp-table-checkbox-cell'\n            );\n            const allSelected = this.selected.length === this.tableRows.length;\n\n            this.manageHeadCheckbox(allSelected);\n\n            this.tableHead.insertAdjacentElement(\n                'afterbegin',\n                this.tableHeadCheckboxCell\n            );\n\n            this.tableRows.forEach((row) => {\n                const checkbox = document.createElement(\n                    'sp-table-checkbox-cell'\n                );\n                row.insertAdjacentElement('afterbegin', checkbox);\n                row.selected = this.selectedSet.has(row.value);\n                checkbox.checked = row.selected;\n            });\n        } else {\n            this.tableHead.querySelector('sp-table-checkbox-cell')?.remove();\n            this.tableRows.forEach((row) => {\n                row.checkboxCells[0]?.remove();\n                if (this.selected.length) {\n                    row.selected = this.selectedSet.has(row.value);\n                }\n            });\n        }\n    }\n\n    protected manageHeadCheckbox(allSelected: boolean): void {\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n\n        this.tableHeadCheckboxCell.selectsSingle = this.selects === 'single';\n        this.tableHeadCheckboxCell.checked = allSelected;\n        this.tableHeadCheckboxCell.indeterminate =\n            this.selected.length > 0 && !allSelected;\n    }\n\n    protected handleChange(event: Event): void {\n        event.stopPropagation();\n\n        const previousSelectedSet = new Set(this.selectedSet);\n        const previousSelected = [...this.selected];\n\n        const { target } = event;\n        const { parentElement: rowItem } = target as HTMLElement & {\n            parentElement: TableRow;\n        };\n        if (!rowItem.value) {\n            const { checkbox } = target as TableCheckboxCell;\n            if (!checkbox) return;\n            if (checkbox.checked || checkbox.indeterminate) {\n                this.selectAllRows();\n            } else {\n                this.deselectAllRows();\n            }\n        } else {\n            switch (this.selects) {\n                case 'single': {\n                    this.deselectAllRows();\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                        this.selected = [...this.selectedSet];\n                    }\n                    break;\n                }\n                case 'multiple': {\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                    } else {\n                        this.selectedSet.delete(rowItem.value);\n                    }\n                    this.selected = [...this.selectedSet];\n\n                    const allSelected =\n                        this.selected.length === this.tableRows.length;\n\n                    if (!this.tableHeadCheckboxCell)\n                        /* c8 ignore next */ return;\n                    this.tableHeadCheckboxCell.checked = allSelected;\n                    this.tableHeadCheckboxCell.indeterminate =\n                        this.selected.length > 0 && !allSelected;\n                    break;\n                }\n                default: {\n                    break;\n                }\n            }\n        }\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                cancelable: true,\n                bubbles: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault) {\n            event.preventDefault();\n            this.selectedSet = previousSelectedSet;\n            this.selected = previousSelected;\n        }\n    }\n\n    public scrollToIndex(index?: number): void {\n        if (index && !!this.tableBody) {\n            const virtualizerParent = this.tableBody as unknown as {\n                [virtualizerRef]: Virtualizer;\n            };\n            const item = virtualizerParent[virtualizerRef].element(index);\n            if (item) {\n                item.scrollIntoView();\n            }\n        }\n    }\n\n    protected override render(): TemplateResult {\n        return html`\n            <slot @change=${this.handleChange}></slot>\n        `;\n    }\n\n    protected override willUpdate(changed: PropertyValues<this>): void {\n        if (!this.hasUpdated) {\n            this.validateSelected();\n            this.manageCheckboxes();\n        }\n        if (changed.has('selects')) {\n            this.manageSelects();\n        }\n\n        if (changed.has('selected') && this.hasUpdated) {\n            this.manageSelected();\n        }\n    }\n\n    protected override updated(): void {\n        if (this.items.length) {\n            this.renderVirtualizedItems();\n        }\n    }\n\n    protected renderVirtualizedItems(): void {\n        // Rendering updates into the table while disconnected can\n        // cause runaway event binding in ancestor elements.\n        if (!this.isConnected) return;\n        if (!this.tableBody) {\n            this.tableBody = this.querySelector('sp-table-body') as TableBody;\n            if (!this.tableBody) {\n                this.tableBody = document.createElement('sp-table-body');\n                this.append(this.tableBody);\n            }\n            this.tableBody.addEventListener(\n                'rangeChanged',\n                (event: RangeChangedEvent) => {\n                    this.dispatchEvent(\n                        new RangeChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n            this.tableBody.addEventListener(\n                'visibilityChanged',\n                (event: VisibilityChangedEvent) => {\n                    this.dispatchEvent(\n                        new VisibilityChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n        }\n        const config: VirtualizeDirectiveConfig<Record<string, unknown>> = {\n            items: this.items,\n            renderItem: this.renderItem,\n            scroller: this.scroller,\n        };\n        render(\n            html`\n                ${virtualize(config)}\n            `,\n            this.tableBody\n        );\n    }\n\n    public override disconnectedCallback(): void {\n        super.disconnectedCallback();\n    }\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/*\nCopyright 2022 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    nothing,\n    PropertyValues,\n    render,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\n// Leveraged in build systems that use aliasing to prevent multiple registrations: https://github.com/adobe/spectrum-web-components/pull/3225\nimport '@spectrum-web-components/table/sp-table-body.js';\nimport '@spectrum-web-components/table/sp-table-row.js';\nimport '@spectrum-web-components/table/sp-table-checkbox-cell.js';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport styles from './table.css.js';\nimport { TableBody } from './TableBody.dev.js'\nimport type { TableCheckboxCell } from './TableCheckboxCell.dev.js'\nimport type { TableHead } from './TableHead.dev.js'\nimport type { TableHeadCell } from './TableHeadCell.dev.js'\nimport type { TableRow } from './TableRow.dev.js'\nimport {\n    virtualize,\n    VirtualizeDirectiveConfig,\n    virtualizerRef,\n} from '@lit-labs/virtualizer/virtualize.js';\nimport { Virtualizer } from '@lit-labs/virtualizer/Virtualizer.js';\nimport {\n    RangeChangedEvent,\n    VisibilityChangedEvent,\n} from '@lit-labs/virtualizer/events.js';\n\nexport enum RowType {\n    ITEM = 0,\n    INFORMATION = 1,\n}\n\nexport interface TableItem extends Record<string, unknown> {\n    _$rowType$?: RowType;\n}\n\n/**\n * @element sp-table\n *\n * @fires rangeChanged - Announces a change in the range of visible cells on the table body\n * @event change - Announces a change in the `selected` property of a table row\n */\n\nexport class Table extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm'],\n    noDefaultSize: true,\n}) {\n    public static override get styles(): CSSResultArray {\n        return [styles];\n    }\n\n    get renderItem(): (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult {\n        return this._renderItem;\n    }\n\n    set renderItem(\n        fn: (item: Record<string, unknown>, index: number) => TemplateResult\n    ) {\n        this._renderItem = (\n            item: Record<string, unknown>,\n            index: number\n        ): TemplateResult => {\n            const value = this.itemValue(item, index);\n            const selected = this.selected.includes(value);\n            const hasCheckbox = this.selects && item?._$rowType$ !== 1;\n\n            return html`\n                <sp-table-row\n                    value=${value}\n                    aria-rowindex=${index + 1}\n                    ?selected=${selected}\n                >\n                    ${hasCheckbox\n                        ? html`\n                              <sp-table-checkbox-cell\n                                  ?checked=${selected}\n                              ></sp-table-checkbox-cell>\n                          `\n                        : nothing}\n                    ${fn(item, index)}\n                </sp-table-row>\n            `;\n        };\n    }\n\n    private _renderItem: (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult = /* c8 ignore next */ () => html``;\n\n    @property({ reflect: true })\n    public role = 'grid';\n\n    /**\n     * Whether the Table allows users to select a row or rows, and thus controls whether or not the Table also renders checkboxes.\n     */\n    @property({ type: String, reflect: true })\n    public selects: undefined | 'single' | 'multiple';\n\n    /**\n     * An array of <sp-row> values that have been selected.\n     */\n    @property({ type: Array })\n    public selected: string[] = [];\n\n    private selectedSet = new Set<string>();\n\n    /**\n     * The content of the rows rendered by the virtualized table. The key is the value of the sp-table-row, and the value is the sp-table-row's content (not the row itself).\n     */\n    @property({ type: Array })\n    public items: Record<string, unknown>[] = [];\n\n    /**\n     * The value of an item. By default, it is set to the index of the sp-table-row.\n     */\n    @property({ type: Object })\n    public itemValue = (_item: unknown, index: number): string => {\n        return `${index}`;\n    };\n\n    /**\n     * Whether or not the virtualized table has a scroll bar. If this is set to true, make sure to specify a height in the sp-table's inline styles.\n     */\n    @property({ type: Boolean, reflect: true })\n    public scroller = false;\n\n    private tableBody?: TableBody;\n\n    private tableHeadCheckboxCell?: TableCheckboxCell;\n\n    private get tableHead(): TableHead {\n        return this.querySelector('sp-table-head') as TableHead;\n    }\n\n    private get tableRows(): TableRow[] {\n        if (this.isVirtualized) {\n            return [];\n        }\n        return [...this.querySelectorAll('sp-table-row')] as TableRow[];\n    }\n\n    private get isVirtualized(): boolean {\n        return !!this.items.length;\n    }\n\n    public override focus(): void {\n        const sortableHeadCell = this.querySelector(\n            'sp-table-head-cell[sortable]'\n        ) as TableHeadCell;\n        if (sortableHeadCell) {\n            sortableHeadCell.focus();\n        }\n    }\n\n    private selectAllRows(): void {\n        if (this.isVirtualized) {\n            this.items.forEach((item, index: number) => {\n                if (item._$rowType$ !== 1) {\n                    this.selectedSet.add(this.itemValue(item, index));\n                }\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                row.selected = true; // Visually\n                this.selectedSet.add(row.value); // Prepares table state\n            });\n        }\n        this.selected = [...this.selectedSet];\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = true;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    private deselectAllRows(): void {\n        this.selectedSet.clear();\n        this.selected = [];\n\n        if (!this.isVirtualized) {\n            const selectedRows = [\n                ...this.querySelectorAll('[selected]'),\n            ] as TableRow[];\n\n            selectedRows.forEach((row) => {\n                row.selected = false;\n            });\n        }\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = false;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    protected manageSelects(): void {\n        const checkboxes = this.querySelectorAll('sp-table-checkbox-cell');\n        const checkbox = document.createElement('sp-table-checkbox-cell');\n        if (!!this.selects) {\n            let allSelected = false;\n            if (this.isVirtualized) {\n                allSelected =\n                    this.selected.length > 0 &&\n                    this.selected.length === this.items.length;\n            } else {\n                this.tableRows.forEach((row) => {\n                    row.selected = this.selectedSet.has(row.value);\n                    if (!row.querySelector(':scope > sp-table-checkbox-cell')) {\n                        const clonedCheckbox =\n                            checkbox.cloneNode() as TableCheckboxCell;\n                        row.insertAdjacentElement('afterbegin', clonedCheckbox);\n                        checkbox.checked = row.selected;\n                    }\n                });\n                allSelected = this.selected.length === this.tableRows.length;\n            }\n\n            if (!this.tableHeadCheckboxCell) {\n                this.tableHeadCheckboxCell = document.createElement(\n                    'sp-table-checkbox-cell'\n                ) as TableCheckboxCell;\n                this.tableHead?.insertAdjacentElement(\n                    'afterbegin',\n                    this.tableHeadCheckboxCell\n                );\n            }\n            this.manageHeadCheckbox(allSelected);\n        } else {\n            checkboxes.forEach((box) => {\n                box.remove();\n            });\n            delete this.tableHeadCheckboxCell;\n        }\n    }\n\n    protected validateSelected(): void {\n        const rowValues = new Set<string>();\n\n        if (this.isVirtualized) {\n            this.items.forEach((item, index) => {\n                const value = this.itemValue(item, index);\n                rowValues.add(value);\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                rowValues.add(row.value);\n            });\n        }\n\n        const oldSelectedCount = this.selected.length;\n\n        this.selected = this.selected.filter((selectedItem) =>\n            rowValues.has(selectedItem)\n        );\n        if (oldSelectedCount !== this.selected.length) {\n            this.dispatchEvent(\n                new Event('change', {\n                    cancelable: true,\n                    bubbles: true,\n                    composed: true,\n                })\n            );\n        }\n        this.selectedSet = new Set(this.selected);\n    }\n\n    protected manageSelected(): void {\n        this.validateSelected();\n\n        if (this.isVirtualized) return;\n\n        this.tableRows.forEach((row) => {\n            row.selected = this.selectedSet.has(row.value);\n        });\n        if (this.tableHeadCheckboxCell) {\n            this.tableHeadCheckboxCell.checked =\n                this.selected.length === this.tableRows.length;\n        }\n    }\n\n    protected manageCheckboxes(): void {\n        if (!!this.selects) {\n            this.tableHeadCheckboxCell = document.createElement(\n                'sp-table-checkbox-cell'\n            );\n            const allSelected = this.selected.length === this.tableRows.length;\n\n            this.manageHeadCheckbox(allSelected);\n\n            this.tableHead?.insertAdjacentElement(\n                'afterbegin',\n                this.tableHeadCheckboxCell\n            );\n\n            this.tableRows.forEach((row) => {\n                const checkbox = document.createElement(\n                    'sp-table-checkbox-cell'\n                );\n                row.insertAdjacentElement('afterbegin', checkbox);\n                row.selected = this.selectedSet.has(row.value);\n                checkbox.checked = row.selected;\n            });\n        } else {\n            this.tableHead?.querySelector('sp-table-checkbox-cell')?.remove();\n            this.tableRows.forEach((row) => {\n                row.checkboxCells[0]?.remove();\n                if (this.selected.length) {\n                    row.selected = this.selectedSet.has(row.value);\n                }\n            });\n        }\n    }\n\n    protected manageHeadCheckbox(allSelected: boolean): void {\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n\n        this.tableHeadCheckboxCell.selectsSingle = this.selects === 'single';\n        this.tableHeadCheckboxCell.checked = allSelected;\n        this.tableHeadCheckboxCell.indeterminate =\n            this.selected.length > 0 && !allSelected;\n    }\n\n    protected handleChange(event: Event): void {\n        event.stopPropagation();\n\n        const previousSelectedSet = new Set(this.selectedSet);\n        const previousSelected = [...this.selected];\n\n        const { target } = event;\n        const { parentElement: rowItem } = target as HTMLElement & {\n            parentElement: TableRow;\n        };\n        if (!rowItem.value) {\n            const { checkbox } = target as TableCheckboxCell;\n            if (!checkbox) return;\n            if (checkbox.checked || checkbox.indeterminate) {\n                this.selectAllRows();\n            } else {\n                this.deselectAllRows();\n            }\n        } else {\n            switch (this.selects) {\n                case 'single': {\n                    this.deselectAllRows();\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                        this.selected = [...this.selectedSet];\n                    }\n                    break;\n                }\n                case 'multiple': {\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                    } else {\n                        this.selectedSet.delete(rowItem.value);\n                    }\n                    this.selected = [...this.selectedSet];\n\n                    const allSelected =\n                        this.selected.length === this.tableRows.length;\n\n                    if (!this.tableHeadCheckboxCell)\n                        /* c8 ignore next */ return;\n                    this.tableHeadCheckboxCell.checked = allSelected;\n                    this.tableHeadCheckboxCell.indeterminate =\n                        this.selected.length > 0 && !allSelected;\n                    break;\n                }\n                default: {\n                    break;\n                }\n            }\n        }\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                cancelable: true,\n                bubbles: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault) {\n            event.preventDefault();\n            this.selectedSet = previousSelectedSet;\n            this.selected = previousSelected;\n        }\n    }\n\n    public scrollToIndex(index?: number): void {\n        if (index && !!this.tableBody) {\n            const virtualizerParent = this.tableBody as unknown as {\n                [virtualizerRef]: Virtualizer;\n            };\n            const item = virtualizerParent[virtualizerRef].element(index);\n            if (item) {\n                item.scrollIntoView();\n            }\n        }\n    }\n\n    protected override render(): TemplateResult {\n        return html`\n            <slot @change=${this.handleChange}></slot>\n        `;\n    }\n\n    protected override willUpdate(changed: PropertyValues<this>): void {\n        if (!this.hasUpdated) {\n            this.validateSelected();\n            this.manageCheckboxes();\n        }\n        if (changed.has('selects')) {\n            this.manageSelects();\n        }\n\n        if (changed.has('selected') && this.hasUpdated) {\n            this.manageSelected();\n        }\n    }\n\n    protected override updated(): void {\n        if (this.items.length) {\n            this.renderVirtualizedItems();\n        }\n    }\n\n    protected renderVirtualizedItems(): void {\n        // Rendering updates into the table while disconnected can\n        // cause runaway event binding in ancestor elements.\n        if (!this.isConnected) return;\n        if (!this.tableBody) {\n            this.tableBody = this.querySelector('sp-table-body') as TableBody;\n            if (!this.tableBody) {\n                this.tableBody = document.createElement('sp-table-body');\n                this.append(this.tableBody);\n            }\n            this.tableBody.addEventListener(\n                'rangeChanged',\n                (event: RangeChangedEvent) => {\n                    this.dispatchEvent(\n                        new RangeChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n            this.tableBody.addEventListener(\n                'visibilityChanged',\n                (event: VisibilityChangedEvent) => {\n                    this.dispatchEvent(\n                        new VisibilityChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n        }\n        const config: VirtualizeDirectiveConfig<Record<string, unknown>> = {\n            items: this.items,\n            renderItem: this.renderItem,\n            scroller: this.scroller,\n        };\n        render(\n            html`\n                ${virtualize(config)}\n            `,\n            this.tableBody\n        );\n    }\n\n    public override disconnectedCallback(): void {\n        super.disconnectedCallback();\n    }\n}\n"],
+  "mappings": "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",
   "names": ["RowType", "_a"]
 }

package/src/Table.js

@@ -1,19 +1,19 @@
-"use strict";var b=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var a=(h,o,e,t)=>{for(var l=t>1?void 0:t?u(o,e):o,s=h.length-1,i;s>=0;s--)(i=h[s])&&(l=(t?i(o,e,l):i(l))||l);return t&&l&&b(o,e,l),l};import{html as r,render as p,SizedMixin as m,SpectrumElement as f}from"@spectrum-web-components/base";import"@spectrum-web-components/table/sp-table-body.js";import"@spectrum-web-components/table/sp-table-row.js";import"@spectrum-web-components/table/sp-table-checkbox-cell.js";import{property as d}from"@spectrum-web-components/base/src/decorators.js";import C from"./table.css.js";import{virtualize as k,virtualizerRef as g}from"@lit-labs/virtualizer/virtualize.js";import{RangeChangedEvent as v,VisibilityChangedEvent as x}from"@lit-labs/virtualizer/events.js";export var RowType=(e=>(e[e.ITEM=0]="ITEM",e[e.INFORMATION=1]="INFORMATION",e))(RowType||{});export class Table extends m(f,{validSizes:["s","m"],defaultSize:"m"}){constructor(){super(...arguments);this._renderItem=()=>r``;this.role="grid";this.selected=[];this.selectedSet=new Set;this.items=[];this.itemValue=(e,t)=>`${t}`;this.scroller=!1}static get styles(){return[C]}get renderItem(){return this._renderItem}set renderItem(e){this._renderItem=(t,l)=>{const s=this.itemValue(t,l),i=this.selected.includes(s),n=this.selects&&(t==null?void 0:t._$rowType$)!==1;return r`
+"use strict";var b=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var c=(n,o,e,t)=>{for(var s=t>1?void 0:t?u(o,e):o,i=n.length-1,l;i>=0;i--)(l=n[i])&&(s=(t?l(o,e,s):l(s))||s);return t&&s&&b(o,e,s),s};import{html as h,nothing as p,render as m,SizedMixin as f,SpectrumElement as C}from"@spectrum-web-components/base";import"@spectrum-web-components/table/sp-table-body.js";import"@spectrum-web-components/table/sp-table-row.js";import"@spectrum-web-components/table/sp-table-checkbox-cell.js";import{property as d}from"@spectrum-web-components/base/src/decorators.js";import g from"./table.css.js";import{virtualize as k,virtualizerRef as v}from"@lit-labs/virtualizer/virtualize.js";import{RangeChangedEvent as x,VisibilityChangedEvent as S}from"@lit-labs/virtualizer/events.js";export var RowType=(e=>(e[e.ITEM=0]="ITEM",e[e.INFORMATION=1]="INFORMATION",e))(RowType||{});export class Table extends f(C,{validSizes:["s","m"],noDefaultSize:!0}){constructor(){super(...arguments);this._renderItem=()=>h``;this.role="grid";this.selected=[];this.selectedSet=new Set;this.items=[];this.itemValue=(e,t)=>`${t}`;this.scroller=!1}static get styles(){return[g]}get renderItem(){return this._renderItem}set renderItem(e){this._renderItem=(t,s)=>{const i=this.itemValue(t,s),l=this.selected.includes(i),a=this.selects&&(t==null?void 0:t._$rowType$)!==1;return h`
                 <sp-table-row
-                    value=${s}
-                    aria-rowindex=${l+1}
-                    ?selected=${i}
+                    value=${i}
+                    aria-rowindex=${s+1}
+                    ?selected=${l}
                 >
-                    ${n?r`
+                    ${a?h`
                               <sp-table-checkbox-cell
-                                  ?checked=${i}
+                                  ?checked=${l}
                               ></sp-table-checkbox-cell>
-                          `:r``}
-                    ${e(t,l)}
+                          `:p}
+                    ${e(t,s)}
                 </sp-table-row>
-            `}}get tableHead(){return this.querySelector("sp-table-head")}get tableRows(){return this.isVirtualized?[]:[...this.querySelectorAll("sp-table-row")]}get isVirtualized(){return!!this.items.length}focus(){const e=this.querySelector("sp-table-head-cell[sortable]");e&&e.focus()}selectAllRows(){this.isVirtualized?this.items.forEach((e,t)=>{e._$rowType$!==1&&this.selectedSet.add(this.itemValue(e,t))}):this.tableRows.forEach(e=>{e.selected=!0,this.selectedSet.add(e.value)}),this.selected=[...this.selectedSet],this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=!0,this.tableHeadCheckboxCell.indeterminate=!1)}deselectAllRows(){this.selectedSet.clear(),this.selected=[],this.isVirtualized||[...this.querySelectorAll("[selected]")].forEach(t=>{t.selected=!1}),this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=!1,this.tableHeadCheckboxCell.indeterminate=!1)}manageSelects(){const e=this.querySelectorAll("sp-table-checkbox-cell"),t=document.createElement("sp-table-checkbox-cell");if(this.selects){let l=!1;this.isVirtualized?l=this.selected.length>0&&this.selected.length===this.items.length:(this.tableRows.forEach(s=>{if(s.selected=this.selectedSet.has(s.value),!s.querySelector(":scope > sp-table-checkbox-cell")){const i=t.cloneNode();s.insertAdjacentElement("afterbegin",i),t.checked=s.selected}}),l=this.selected.length===this.tableRows.length),this.tableHeadCheckboxCell||(this.tableHeadCheckboxCell=document.createElement("sp-table-checkbox-cell"),this.tableHead.insertAdjacentElement("afterbegin",this.tableHeadCheckboxCell)),this.manageHeadCheckbox(l)}else e.forEach(l=>{l.remove()}),delete this.tableHeadCheckboxCell}validateSelected(){const e=new Set;this.isVirtualized?this.items.forEach((l,s)=>{const i=this.itemValue(l,s);e.add(i)}):this.tableRows.forEach(l=>{e.add(l.value)});const t=this.selected.length;this.selected=this.selected.filter(l=>e.has(l)),t!==this.selected.length&&this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0,composed:!0})),this.selectedSet=new Set(this.selected)}manageSelected(){this.validateSelected(),!this.isVirtualized&&(this.tableRows.forEach(e=>{e.selected=this.selectedSet.has(e.value)}),this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=this.selected.length===this.tableRows.length))}manageCheckboxes(){var e;if(this.selects){this.tableHeadCheckboxCell=document.createElement("sp-table-checkbox-cell");const t=this.selected.length===this.tableRows.length;this.manageHeadCheckbox(t),this.tableHead.insertAdjacentElement("afterbegin",this.tableHeadCheckboxCell),this.tableRows.forEach(l=>{const s=document.createElement("sp-table-checkbox-cell");l.insertAdjacentElement("afterbegin",s),l.selected=this.selectedSet.has(l.value),s.checked=l.selected})}else(e=this.tableHead.querySelector("sp-table-checkbox-cell"))==null||e.remove(),this.tableRows.forEach(t=>{var l;(l=t.checkboxCells[0])==null||l.remove(),this.selected.length&&(t.selected=this.selectedSet.has(t.value))})}manageHeadCheckbox(e){this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.selectsSingle=this.selects==="single",this.tableHeadCheckboxCell.checked=e,this.tableHeadCheckboxCell.indeterminate=this.selected.length>0&&!e)}handleChange(e){e.stopPropagation();const t=new Set(this.selectedSet),l=[...this.selected],{target:s}=e,{parentElement:i}=s;if(i.value)switch(this.selects){case"single":{this.deselectAllRows(),i.selected&&(this.selectedSet.add(i.value),this.selected=[...this.selectedSet]);break}case"multiple":{i.selected?this.selectedSet.add(i.value):this.selectedSet.delete(i.value),this.selected=[...this.selectedSet];const c=this.selected.length===this.tableRows.length;if(!this.tableHeadCheckboxCell)return;this.tableHeadCheckboxCell.checked=c,this.tableHeadCheckboxCell.indeterminate=this.selected.length>0&&!c;break}default:break}else{const{checkbox:c}=s;if(!c)return;c.checked||c.indeterminate?this.selectAllRows():this.deselectAllRows()}this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0,composed:!0}))||(e.preventDefault(),this.selectedSet=t,this.selected=l)}scrollToIndex(e){if(e&&this.tableBody){const l=this.tableBody[g].element(e);l&&l.scrollIntoView()}}render(){return r`
+            `}}get tableHead(){return this.querySelector("sp-table-head")}get tableRows(){return this.isVirtualized?[]:[...this.querySelectorAll("sp-table-row")]}get isVirtualized(){return!!this.items.length}focus(){const e=this.querySelector("sp-table-head-cell[sortable]");e&&e.focus()}selectAllRows(){this.isVirtualized?this.items.forEach((e,t)=>{e._$rowType$!==1&&this.selectedSet.add(this.itemValue(e,t))}):this.tableRows.forEach(e=>{e.selected=!0,this.selectedSet.add(e.value)}),this.selected=[...this.selectedSet],this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=!0,this.tableHeadCheckboxCell.indeterminate=!1)}deselectAllRows(){this.selectedSet.clear(),this.selected=[],this.isVirtualized||[...this.querySelectorAll("[selected]")].forEach(t=>{t.selected=!1}),this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=!1,this.tableHeadCheckboxCell.indeterminate=!1)}manageSelects(){var s;const e=this.querySelectorAll("sp-table-checkbox-cell"),t=document.createElement("sp-table-checkbox-cell");if(this.selects){let i=!1;this.isVirtualized?i=this.selected.length>0&&this.selected.length===this.items.length:(this.tableRows.forEach(l=>{if(l.selected=this.selectedSet.has(l.value),!l.querySelector(":scope > sp-table-checkbox-cell")){const a=t.cloneNode();l.insertAdjacentElement("afterbegin",a),t.checked=l.selected}}),i=this.selected.length===this.tableRows.length),this.tableHeadCheckboxCell||(this.tableHeadCheckboxCell=document.createElement("sp-table-checkbox-cell"),(s=this.tableHead)==null||s.insertAdjacentElement("afterbegin",this.tableHeadCheckboxCell)),this.manageHeadCheckbox(i)}else e.forEach(i=>{i.remove()}),delete this.tableHeadCheckboxCell}validateSelected(){const e=new Set;this.isVirtualized?this.items.forEach((s,i)=>{const l=this.itemValue(s,i);e.add(l)}):this.tableRows.forEach(s=>{e.add(s.value)});const t=this.selected.length;this.selected=this.selected.filter(s=>e.has(s)),t!==this.selected.length&&this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0,composed:!0})),this.selectedSet=new Set(this.selected)}manageSelected(){this.validateSelected(),!this.isVirtualized&&(this.tableRows.forEach(e=>{e.selected=this.selectedSet.has(e.value)}),this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=this.selected.length===this.tableRows.length))}manageCheckboxes(){var e,t,s;if(this.selects){this.tableHeadCheckboxCell=document.createElement("sp-table-checkbox-cell");const i=this.selected.length===this.tableRows.length;this.manageHeadCheckbox(i),(e=this.tableHead)==null||e.insertAdjacentElement("afterbegin",this.tableHeadCheckboxCell),this.tableRows.forEach(l=>{const a=document.createElement("sp-table-checkbox-cell");l.insertAdjacentElement("afterbegin",a),l.selected=this.selectedSet.has(l.value),a.checked=l.selected})}else(s=(t=this.tableHead)==null?void 0:t.querySelector("sp-table-checkbox-cell"))==null||s.remove(),this.tableRows.forEach(i=>{var l;(l=i.checkboxCells[0])==null||l.remove(),this.selected.length&&(i.selected=this.selectedSet.has(i.value))})}manageHeadCheckbox(e){this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.selectsSingle=this.selects==="single",this.tableHeadCheckboxCell.checked=e,this.tableHeadCheckboxCell.indeterminate=this.selected.length>0&&!e)}handleChange(e){e.stopPropagation();const t=new Set(this.selectedSet),s=[...this.selected],{target:i}=e,{parentElement:l}=i;if(l.value)switch(this.selects){case"single":{this.deselectAllRows(),l.selected&&(this.selectedSet.add(l.value),this.selected=[...this.selectedSet]);break}case"multiple":{l.selected?this.selectedSet.add(l.value):this.selectedSet.delete(l.value),this.selected=[...this.selectedSet];const r=this.selected.length===this.tableRows.length;if(!this.tableHeadCheckboxCell)return;this.tableHeadCheckboxCell.checked=r,this.tableHeadCheckboxCell.indeterminate=this.selected.length>0&&!r;break}default:break}else{const{checkbox:r}=i;if(!r)return;r.checked||r.indeterminate?this.selectAllRows():this.deselectAllRows()}this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0,composed:!0}))||(e.preventDefault(),this.selectedSet=t,this.selected=s)}scrollToIndex(e){if(e&&this.tableBody){const s=this.tableBody[v].element(e);s&&s.scrollIntoView()}}render(){return h`
             <slot @change=${this.handleChange}></slot>
-        `}willUpdate(e){this.hasUpdated||(this.validateSelected(),this.manageCheckboxes()),e.has("selects")&&this.manageSelects(),e.has("selected")&&this.hasUpdated&&this.manageSelected()}updated(){this.items.length&&this.renderVirtualizedItems()}renderVirtualizedItems(){if(!this.isConnected)return;this.tableBody||(this.tableBody=this.querySelector("sp-table-body"),this.tableBody||(this.tableBody=document.createElement("sp-table-body"),this.append(this.tableBody)),this.tableBody.addEventListener("rangeChanged",t=>{this.dispatchEvent(new v({first:t.first,last:t.last}))}),this.tableBody.addEventListener("visibilityChanged",t=>{this.dispatchEvent(new x({first:t.first,last:t.last}))}));const e={items:this.items,renderItem:this.renderItem,scroller:this.scroller};p(r`
+        `}willUpdate(e){this.hasUpdated||(this.validateSelected(),this.manageCheckboxes()),e.has("selects")&&this.manageSelects(),e.has("selected")&&this.hasUpdated&&this.manageSelected()}updated(){this.items.length&&this.renderVirtualizedItems()}renderVirtualizedItems(){if(!this.isConnected)return;this.tableBody||(this.tableBody=this.querySelector("sp-table-body"),this.tableBody||(this.tableBody=document.createElement("sp-table-body"),this.append(this.tableBody)),this.tableBody.addEventListener("rangeChanged",t=>{this.dispatchEvent(new x({first:t.first,last:t.last}))}),this.tableBody.addEventListener("visibilityChanged",t=>{this.dispatchEvent(new S({first:t.first,last:t.last}))}));const e={items:this.items,renderItem:this.renderItem,scroller:this.scroller};m(h`
                 ${k(e)}
-            `,this.tableBody)}disconnectedCallback(){super.disconnectedCallback()}}a([d({reflect:!0})],Table.prototype,"role",2),a([d({type:String,reflect:!0})],Table.prototype,"selects",2),a([d({type:Array})],Table.prototype,"selected",2),a([d({type:Array})],Table.prototype,"items",2),a([d({type:Object})],Table.prototype,"itemValue",2),a([d({type:Boolean,reflect:!0})],Table.prototype,"scroller",2);
+            `,this.tableBody)}disconnectedCallback(){super.disconnectedCallback()}}c([d({reflect:!0})],Table.prototype,"role",2),c([d({type:String,reflect:!0})],Table.prototype,"selects",2),c([d({type:Array})],Table.prototype,"selected",2),c([d({type:Array})],Table.prototype,"items",2),c([d({type:Object})],Table.prototype,"itemValue",2),c([d({type:Boolean,reflect:!0})],Table.prototype,"scroller",2);
 //# sourceMappingURL=Table.js.map

package/src/Table.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Table.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 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    render,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\n// Leveraged in build systems that use aliasing to prevent multiple registrations: https://github.com/adobe/spectrum-web-components/pull/3225\nimport '@spectrum-web-components/table/sp-table-body.js';\nimport '@spectrum-web-components/table/sp-table-row.js';\nimport '@spectrum-web-components/table/sp-table-checkbox-cell.js';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport styles from './table.css.js';\nimport { TableBody } from './TableBody.js';\nimport type { TableCheckboxCell } from './TableCheckboxCell.js';\nimport type { TableHead } from './TableHead.js';\nimport type { TableHeadCell } from './TableHeadCell.js';\nimport type { TableRow } from './TableRow.js';\nimport {\n    virtualize,\n    VirtualizeDirectiveConfig,\n    virtualizerRef,\n} from '@lit-labs/virtualizer/virtualize.js';\nimport { Virtualizer } from '@lit-labs/virtualizer/Virtualizer.js';\nimport {\n    RangeChangedEvent,\n    VisibilityChangedEvent,\n} from '@lit-labs/virtualizer/events.js';\n\nexport enum RowType {\n    ITEM = 0,\n    INFORMATION = 1,\n}\n\nexport interface TableItem extends Record<string, unknown> {\n    _$rowType$?: RowType;\n}\n\n/**\n * @element sp-table\n *\n * @fires rangeChanged - Announces a change in the range of visible cells on the table body\n * @event change - Announces a change in the `selected` property of a table row\n */\n\nexport class Table extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm'],\n    defaultSize: 'm',\n}) {\n    public static override get styles(): CSSResultArray {\n        return [styles];\n    }\n\n    get renderItem(): (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult {\n        return this._renderItem;\n    }\n\n    set renderItem(\n        fn: (item: Record<string, unknown>, index: number) => TemplateResult\n    ) {\n        this._renderItem = (\n            item: Record<string, unknown>,\n            index: number\n        ): TemplateResult => {\n            const value = this.itemValue(item, index);\n            const selected = this.selected.includes(value);\n            const hasCheckbox = this.selects && item?._$rowType$ !== 1;\n\n            return html`\n                <sp-table-row\n                    value=${value}\n                    aria-rowindex=${index + 1}\n                    ?selected=${selected}\n                >\n                    ${hasCheckbox\n                        ? html`\n                              <sp-table-checkbox-cell\n                                  ?checked=${selected}\n                              ></sp-table-checkbox-cell>\n                          `\n                        : html``}\n                    ${fn(item, index)}\n                </sp-table-row>\n            `;\n        };\n    }\n\n    private _renderItem: (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult = /* c8 ignore next */ () => html``;\n\n    @property({ reflect: true })\n    public role = 'grid';\n\n    /**\n     * Whether the Table allows users to select a row or rows, and thus controls whether or not the Table also renders checkboxes.\n     */\n    @property({ type: String, reflect: true })\n    public selects: undefined | 'single' | 'multiple';\n\n    /**\n     * An array of <sp-row> values that have been selected.\n     */\n    @property({ type: Array })\n    public selected: string[] = [];\n\n    private selectedSet = new Set<string>();\n\n    /**\n     * The content of the rows rendered by the virtualized table. The key is the value of the sp-table-row, and the value is the sp-table-row's content (not the row itself).\n     */\n    @property({ type: Array })\n    public items: Record<string, unknown>[] = [];\n\n    /**\n     * The value of an item. By default, it is set to the index of the sp-table-row.\n     */\n    @property({ type: Object })\n    public itemValue = (_item: unknown, index: number): string => {\n        return `${index}`;\n    };\n\n    /**\n     * Whether or not the virtualized table has a scroll bar. If this is set to true, make sure to specify a height in the sp-table's inline styles.\n     */\n    @property({ type: Boolean, reflect: true })\n    public scroller = false;\n\n    private tableBody?: TableBody;\n\n    private tableHeadCheckboxCell?: TableCheckboxCell;\n\n    private get tableHead(): TableHead {\n        return this.querySelector('sp-table-head') as TableHead;\n    }\n\n    private get tableRows(): TableRow[] {\n        if (this.isVirtualized) {\n            return [];\n        }\n        return [...this.querySelectorAll('sp-table-row')] as TableRow[];\n    }\n\n    private get isVirtualized(): boolean {\n        return !!this.items.length;\n    }\n\n    public override focus(): void {\n        const sortableHeadCell = this.querySelector(\n            'sp-table-head-cell[sortable]'\n        ) as TableHeadCell;\n        if (sortableHeadCell) {\n            sortableHeadCell.focus();\n        }\n    }\n\n    private selectAllRows(): void {\n        if (this.isVirtualized) {\n            this.items.forEach((item, index: number) => {\n                if (item._$rowType$ !== 1) {\n                    this.selectedSet.add(this.itemValue(item, index));\n                }\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                row.selected = true; // Visually\n                this.selectedSet.add(row.value); // Prepares table state\n            });\n        }\n        this.selected = [...this.selectedSet];\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = true;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    private deselectAllRows(): void {\n        this.selectedSet.clear();\n        this.selected = [];\n\n        if (!this.isVirtualized) {\n            const selectedRows = [\n                ...this.querySelectorAll('[selected]'),\n            ] as TableRow[];\n\n            selectedRows.forEach((row) => {\n                row.selected = false;\n            });\n        }\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = false;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    protected manageSelects(): void {\n        const checkboxes = this.querySelectorAll('sp-table-checkbox-cell');\n        const checkbox = document.createElement('sp-table-checkbox-cell');\n        if (!!this.selects) {\n            let allSelected = false;\n            if (this.isVirtualized) {\n                allSelected =\n                    this.selected.length > 0 &&\n                    this.selected.length === this.items.length;\n            } else {\n                this.tableRows.forEach((row) => {\n                    row.selected = this.selectedSet.has(row.value);\n                    if (!row.querySelector(':scope > sp-table-checkbox-cell')) {\n                        const clonedCheckbox =\n                            checkbox.cloneNode() as TableCheckboxCell;\n                        row.insertAdjacentElement('afterbegin', clonedCheckbox);\n                        checkbox.checked = row.selected;\n                    }\n                });\n                allSelected = this.selected.length === this.tableRows.length;\n            }\n\n            if (!this.tableHeadCheckboxCell) {\n                this.tableHeadCheckboxCell = document.createElement(\n                    'sp-table-checkbox-cell'\n                ) as TableCheckboxCell;\n                this.tableHead.insertAdjacentElement(\n                    'afterbegin',\n                    this.tableHeadCheckboxCell\n                );\n            }\n            this.manageHeadCheckbox(allSelected);\n        } else {\n            checkboxes.forEach((box) => {\n                box.remove();\n            });\n            delete this.tableHeadCheckboxCell;\n        }\n    }\n\n    protected validateSelected(): void {\n        const rowValues = new Set<string>();\n\n        if (this.isVirtualized) {\n            this.items.forEach((item, index) => {\n                const value = this.itemValue(item, index);\n                rowValues.add(value);\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                rowValues.add(row.value);\n            });\n        }\n\n        const oldSelectedCount = this.selected.length;\n\n        this.selected = this.selected.filter((selectedItem) =>\n            rowValues.has(selectedItem)\n        );\n        if (oldSelectedCount !== this.selected.length) {\n            this.dispatchEvent(\n                new Event('change', {\n                    cancelable: true,\n                    bubbles: true,\n                    composed: true,\n                })\n            );\n        }\n        this.selectedSet = new Set(this.selected);\n    }\n\n    protected manageSelected(): void {\n        this.validateSelected();\n\n        if (this.isVirtualized) return;\n\n        this.tableRows.forEach((row) => {\n            row.selected = this.selectedSet.has(row.value);\n        });\n        if (this.tableHeadCheckboxCell) {\n            this.tableHeadCheckboxCell.checked =\n                this.selected.length === this.tableRows.length;\n        }\n    }\n\n    protected manageCheckboxes(): void {\n        if (!!this.selects) {\n            this.tableHeadCheckboxCell = document.createElement(\n                'sp-table-checkbox-cell'\n            );\n            const allSelected = this.selected.length === this.tableRows.length;\n\n            this.manageHeadCheckbox(allSelected);\n\n            this.tableHead.insertAdjacentElement(\n                'afterbegin',\n                this.tableHeadCheckboxCell\n            );\n\n            this.tableRows.forEach((row) => {\n                const checkbox = document.createElement(\n                    'sp-table-checkbox-cell'\n                );\n                row.insertAdjacentElement('afterbegin', checkbox);\n                row.selected = this.selectedSet.has(row.value);\n                checkbox.checked = row.selected;\n            });\n        } else {\n            this.tableHead.querySelector('sp-table-checkbox-cell')?.remove();\n            this.tableRows.forEach((row) => {\n                row.checkboxCells[0]?.remove();\n                if (this.selected.length) {\n                    row.selected = this.selectedSet.has(row.value);\n                }\n            });\n        }\n    }\n\n    protected manageHeadCheckbox(allSelected: boolean): void {\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n\n        this.tableHeadCheckboxCell.selectsSingle = this.selects === 'single';\n        this.tableHeadCheckboxCell.checked = allSelected;\n        this.tableHeadCheckboxCell.indeterminate =\n            this.selected.length > 0 && !allSelected;\n    }\n\n    protected handleChange(event: Event): void {\n        event.stopPropagation();\n\n        const previousSelectedSet = new Set(this.selectedSet);\n        const previousSelected = [...this.selected];\n\n        const { target } = event;\n        const { parentElement: rowItem } = target as HTMLElement & {\n            parentElement: TableRow;\n        };\n        if (!rowItem.value) {\n            const { checkbox } = target as TableCheckboxCell;\n            if (!checkbox) return;\n            if (checkbox.checked || checkbox.indeterminate) {\n                this.selectAllRows();\n            } else {\n                this.deselectAllRows();\n            }\n        } else {\n            switch (this.selects) {\n                case 'single': {\n                    this.deselectAllRows();\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                        this.selected = [...this.selectedSet];\n                    }\n                    break;\n                }\n                case 'multiple': {\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                    } else {\n                        this.selectedSet.delete(rowItem.value);\n                    }\n                    this.selected = [...this.selectedSet];\n\n                    const allSelected =\n                        this.selected.length === this.tableRows.length;\n\n                    if (!this.tableHeadCheckboxCell)\n                        /* c8 ignore next */ return;\n                    this.tableHeadCheckboxCell.checked = allSelected;\n                    this.tableHeadCheckboxCell.indeterminate =\n                        this.selected.length > 0 && !allSelected;\n                    break;\n                }\n                default: {\n                    break;\n                }\n            }\n        }\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                cancelable: true,\n                bubbles: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault) {\n            event.preventDefault();\n            this.selectedSet = previousSelectedSet;\n            this.selected = previousSelected;\n        }\n    }\n\n    public scrollToIndex(index?: number): void {\n        if (index && !!this.tableBody) {\n            const virtualizerParent = this.tableBody as unknown as {\n                [virtualizerRef]: Virtualizer;\n            };\n            const item = virtualizerParent[virtualizerRef].element(index);\n            if (item) {\n                item.scrollIntoView();\n            }\n        }\n    }\n\n    protected override render(): TemplateResult {\n        return html`\n            <slot @change=${this.handleChange}></slot>\n        `;\n    }\n\n    protected override willUpdate(changed: PropertyValues<this>): void {\n        if (!this.hasUpdated) {\n            this.validateSelected();\n            this.manageCheckboxes();\n        }\n        if (changed.has('selects')) {\n            this.manageSelects();\n        }\n\n        if (changed.has('selected') && this.hasUpdated) {\n            this.manageSelected();\n        }\n    }\n\n    protected override updated(): void {\n        if (this.items.length) {\n            this.renderVirtualizedItems();\n        }\n    }\n\n    protected renderVirtualizedItems(): void {\n        // Rendering updates into the table while disconnected can\n        // cause runaway event binding in ancestor elements.\n        if (!this.isConnected) return;\n        if (!this.tableBody) {\n            this.tableBody = this.querySelector('sp-table-body') as TableBody;\n            if (!this.tableBody) {\n                this.tableBody = document.createElement('sp-table-body');\n                this.append(this.tableBody);\n            }\n            this.tableBody.addEventListener(\n                'rangeChanged',\n                (event: RangeChangedEvent) => {\n                    this.dispatchEvent(\n                        new RangeChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n            this.tableBody.addEventListener(\n                'visibilityChanged',\n                (event: VisibilityChangedEvent) => {\n                    this.dispatchEvent(\n                        new VisibilityChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n        }\n        const config: VirtualizeDirectiveConfig<Record<string, unknown>> = {\n            items: this.items,\n            renderItem: this.renderItem,\n            scroller: this.scroller,\n        };\n        render(\n            html`\n                ${virtualize(config)}\n            `,\n            this.tableBody\n        );\n    }\n\n    public override disconnectedCallback(): void {\n        super.disconnectedCallback();\n    }\n}\n"],
-  "mappings": "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",
-  "names": ["html", "render", "SizedMixin", "SpectrumElement", "property", "styles", "virtualize", "virtualizerRef", "RangeChangedEvent", "VisibilityChangedEvent", "RowType", "_item", "index", "fn", "item", "value", "selected", "hasCheckbox", "sortableHeadCell", "row", "checkboxes", "checkbox", "allSelected", "clonedCheckbox", "box", "rowValues", "oldSelectedCount", "selectedItem", "_a", "event", "previousSelectedSet", "previousSelected", "target", "rowItem", "changed", "config", "__decorateClass"]
+  "sourcesContent": ["/*\nCopyright 2022 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    nothing,\n    PropertyValues,\n    render,\n    SizedMixin,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\n// Leveraged in build systems that use aliasing to prevent multiple registrations: https://github.com/adobe/spectrum-web-components/pull/3225\nimport '@spectrum-web-components/table/sp-table-body.js';\nimport '@spectrum-web-components/table/sp-table-row.js';\nimport '@spectrum-web-components/table/sp-table-checkbox-cell.js';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport styles from './table.css.js';\nimport { TableBody } from './TableBody.js';\nimport type { TableCheckboxCell } from './TableCheckboxCell.js';\nimport type { TableHead } from './TableHead.js';\nimport type { TableHeadCell } from './TableHeadCell.js';\nimport type { TableRow } from './TableRow.js';\nimport {\n    virtualize,\n    VirtualizeDirectiveConfig,\n    virtualizerRef,\n} from '@lit-labs/virtualizer/virtualize.js';\nimport { Virtualizer } from '@lit-labs/virtualizer/Virtualizer.js';\nimport {\n    RangeChangedEvent,\n    VisibilityChangedEvent,\n} from '@lit-labs/virtualizer/events.js';\n\nexport enum RowType {\n    ITEM = 0,\n    INFORMATION = 1,\n}\n\nexport interface TableItem extends Record<string, unknown> {\n    _$rowType$?: RowType;\n}\n\n/**\n * @element sp-table\n *\n * @fires rangeChanged - Announces a change in the range of visible cells on the table body\n * @event change - Announces a change in the `selected` property of a table row\n */\n\nexport class Table extends SizedMixin(SpectrumElement, {\n    validSizes: ['s', 'm'],\n    noDefaultSize: true,\n}) {\n    public static override get styles(): CSSResultArray {\n        return [styles];\n    }\n\n    get renderItem(): (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult {\n        return this._renderItem;\n    }\n\n    set renderItem(\n        fn: (item: Record<string, unknown>, index: number) => TemplateResult\n    ) {\n        this._renderItem = (\n            item: Record<string, unknown>,\n            index: number\n        ): TemplateResult => {\n            const value = this.itemValue(item, index);\n            const selected = this.selected.includes(value);\n            const hasCheckbox = this.selects && item?._$rowType$ !== 1;\n\n            return html`\n                <sp-table-row\n                    value=${value}\n                    aria-rowindex=${index + 1}\n                    ?selected=${selected}\n                >\n                    ${hasCheckbox\n                        ? html`\n                              <sp-table-checkbox-cell\n                                  ?checked=${selected}\n                              ></sp-table-checkbox-cell>\n                          `\n                        : nothing}\n                    ${fn(item, index)}\n                </sp-table-row>\n            `;\n        };\n    }\n\n    private _renderItem: (\n        item: Record<string, unknown>,\n        index: number\n    ) => TemplateResult = /* c8 ignore next */ () => html``;\n\n    @property({ reflect: true })\n    public role = 'grid';\n\n    /**\n     * Whether the Table allows users to select a row or rows, and thus controls whether or not the Table also renders checkboxes.\n     */\n    @property({ type: String, reflect: true })\n    public selects: undefined | 'single' | 'multiple';\n\n    /**\n     * An array of <sp-row> values that have been selected.\n     */\n    @property({ type: Array })\n    public selected: string[] = [];\n\n    private selectedSet = new Set<string>();\n\n    /**\n     * The content of the rows rendered by the virtualized table. The key is the value of the sp-table-row, and the value is the sp-table-row's content (not the row itself).\n     */\n    @property({ type: Array })\n    public items: Record<string, unknown>[] = [];\n\n    /**\n     * The value of an item. By default, it is set to the index of the sp-table-row.\n     */\n    @property({ type: Object })\n    public itemValue = (_item: unknown, index: number): string => {\n        return `${index}`;\n    };\n\n    /**\n     * Whether or not the virtualized table has a scroll bar. If this is set to true, make sure to specify a height in the sp-table's inline styles.\n     */\n    @property({ type: Boolean, reflect: true })\n    public scroller = false;\n\n    private tableBody?: TableBody;\n\n    private tableHeadCheckboxCell?: TableCheckboxCell;\n\n    private get tableHead(): TableHead {\n        return this.querySelector('sp-table-head') as TableHead;\n    }\n\n    private get tableRows(): TableRow[] {\n        if (this.isVirtualized) {\n            return [];\n        }\n        return [...this.querySelectorAll('sp-table-row')] as TableRow[];\n    }\n\n    private get isVirtualized(): boolean {\n        return !!this.items.length;\n    }\n\n    public override focus(): void {\n        const sortableHeadCell = this.querySelector(\n            'sp-table-head-cell[sortable]'\n        ) as TableHeadCell;\n        if (sortableHeadCell) {\n            sortableHeadCell.focus();\n        }\n    }\n\n    private selectAllRows(): void {\n        if (this.isVirtualized) {\n            this.items.forEach((item, index: number) => {\n                if (item._$rowType$ !== 1) {\n                    this.selectedSet.add(this.itemValue(item, index));\n                }\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                row.selected = true; // Visually\n                this.selectedSet.add(row.value); // Prepares table state\n            });\n        }\n        this.selected = [...this.selectedSet];\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = true;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    private deselectAllRows(): void {\n        this.selectedSet.clear();\n        this.selected = [];\n\n        if (!this.isVirtualized) {\n            const selectedRows = [\n                ...this.querySelectorAll('[selected]'),\n            ] as TableRow[];\n\n            selectedRows.forEach((row) => {\n                row.selected = false;\n            });\n        }\n\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n        this.tableHeadCheckboxCell.checked = false;\n        this.tableHeadCheckboxCell.indeterminate = false;\n    }\n\n    protected manageSelects(): void {\n        const checkboxes = this.querySelectorAll('sp-table-checkbox-cell');\n        const checkbox = document.createElement('sp-table-checkbox-cell');\n        if (!!this.selects) {\n            let allSelected = false;\n            if (this.isVirtualized) {\n                allSelected =\n                    this.selected.length > 0 &&\n                    this.selected.length === this.items.length;\n            } else {\n                this.tableRows.forEach((row) => {\n                    row.selected = this.selectedSet.has(row.value);\n                    if (!row.querySelector(':scope > sp-table-checkbox-cell')) {\n                        const clonedCheckbox =\n                            checkbox.cloneNode() as TableCheckboxCell;\n                        row.insertAdjacentElement('afterbegin', clonedCheckbox);\n                        checkbox.checked = row.selected;\n                    }\n                });\n                allSelected = this.selected.length === this.tableRows.length;\n            }\n\n            if (!this.tableHeadCheckboxCell) {\n                this.tableHeadCheckboxCell = document.createElement(\n                    'sp-table-checkbox-cell'\n                ) as TableCheckboxCell;\n                this.tableHead?.insertAdjacentElement(\n                    'afterbegin',\n                    this.tableHeadCheckboxCell\n                );\n            }\n            this.manageHeadCheckbox(allSelected);\n        } else {\n            checkboxes.forEach((box) => {\n                box.remove();\n            });\n            delete this.tableHeadCheckboxCell;\n        }\n    }\n\n    protected validateSelected(): void {\n        const rowValues = new Set<string>();\n\n        if (this.isVirtualized) {\n            this.items.forEach((item, index) => {\n                const value = this.itemValue(item, index);\n                rowValues.add(value);\n            });\n        } else {\n            this.tableRows.forEach((row) => {\n                rowValues.add(row.value);\n            });\n        }\n\n        const oldSelectedCount = this.selected.length;\n\n        this.selected = this.selected.filter((selectedItem) =>\n            rowValues.has(selectedItem)\n        );\n        if (oldSelectedCount !== this.selected.length) {\n            this.dispatchEvent(\n                new Event('change', {\n                    cancelable: true,\n                    bubbles: true,\n                    composed: true,\n                })\n            );\n        }\n        this.selectedSet = new Set(this.selected);\n    }\n\n    protected manageSelected(): void {\n        this.validateSelected();\n\n        if (this.isVirtualized) return;\n\n        this.tableRows.forEach((row) => {\n            row.selected = this.selectedSet.has(row.value);\n        });\n        if (this.tableHeadCheckboxCell) {\n            this.tableHeadCheckboxCell.checked =\n                this.selected.length === this.tableRows.length;\n        }\n    }\n\n    protected manageCheckboxes(): void {\n        if (!!this.selects) {\n            this.tableHeadCheckboxCell = document.createElement(\n                'sp-table-checkbox-cell'\n            );\n            const allSelected = this.selected.length === this.tableRows.length;\n\n            this.manageHeadCheckbox(allSelected);\n\n            this.tableHead?.insertAdjacentElement(\n                'afterbegin',\n                this.tableHeadCheckboxCell\n            );\n\n            this.tableRows.forEach((row) => {\n                const checkbox = document.createElement(\n                    'sp-table-checkbox-cell'\n                );\n                row.insertAdjacentElement('afterbegin', checkbox);\n                row.selected = this.selectedSet.has(row.value);\n                checkbox.checked = row.selected;\n            });\n        } else {\n            this.tableHead?.querySelector('sp-table-checkbox-cell')?.remove();\n            this.tableRows.forEach((row) => {\n                row.checkboxCells[0]?.remove();\n                if (this.selected.length) {\n                    row.selected = this.selectedSet.has(row.value);\n                }\n            });\n        }\n    }\n\n    protected manageHeadCheckbox(allSelected: boolean): void {\n        if (!this.tableHeadCheckboxCell) /* c8 ignore next */ return;\n\n        this.tableHeadCheckboxCell.selectsSingle = this.selects === 'single';\n        this.tableHeadCheckboxCell.checked = allSelected;\n        this.tableHeadCheckboxCell.indeterminate =\n            this.selected.length > 0 && !allSelected;\n    }\n\n    protected handleChange(event: Event): void {\n        event.stopPropagation();\n\n        const previousSelectedSet = new Set(this.selectedSet);\n        const previousSelected = [...this.selected];\n\n        const { target } = event;\n        const { parentElement: rowItem } = target as HTMLElement & {\n            parentElement: TableRow;\n        };\n        if (!rowItem.value) {\n            const { checkbox } = target as TableCheckboxCell;\n            if (!checkbox) return;\n            if (checkbox.checked || checkbox.indeterminate) {\n                this.selectAllRows();\n            } else {\n                this.deselectAllRows();\n            }\n        } else {\n            switch (this.selects) {\n                case 'single': {\n                    this.deselectAllRows();\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                        this.selected = [...this.selectedSet];\n                    }\n                    break;\n                }\n                case 'multiple': {\n                    if (rowItem.selected) {\n                        this.selectedSet.add(rowItem.value);\n                    } else {\n                        this.selectedSet.delete(rowItem.value);\n                    }\n                    this.selected = [...this.selectedSet];\n\n                    const allSelected =\n                        this.selected.length === this.tableRows.length;\n\n                    if (!this.tableHeadCheckboxCell)\n                        /* c8 ignore next */ return;\n                    this.tableHeadCheckboxCell.checked = allSelected;\n                    this.tableHeadCheckboxCell.indeterminate =\n                        this.selected.length > 0 && !allSelected;\n                    break;\n                }\n                default: {\n                    break;\n                }\n            }\n        }\n        const applyDefault = this.dispatchEvent(\n            new Event('change', {\n                cancelable: true,\n                bubbles: true,\n                composed: true,\n            })\n        );\n        if (!applyDefault) {\n            event.preventDefault();\n            this.selectedSet = previousSelectedSet;\n            this.selected = previousSelected;\n        }\n    }\n\n    public scrollToIndex(index?: number): void {\n        if (index && !!this.tableBody) {\n            const virtualizerParent = this.tableBody as unknown as {\n                [virtualizerRef]: Virtualizer;\n            };\n            const item = virtualizerParent[virtualizerRef].element(index);\n            if (item) {\n                item.scrollIntoView();\n            }\n        }\n    }\n\n    protected override render(): TemplateResult {\n        return html`\n            <slot @change=${this.handleChange}></slot>\n        `;\n    }\n\n    protected override willUpdate(changed: PropertyValues<this>): void {\n        if (!this.hasUpdated) {\n            this.validateSelected();\n            this.manageCheckboxes();\n        }\n        if (changed.has('selects')) {\n            this.manageSelects();\n        }\n\n        if (changed.has('selected') && this.hasUpdated) {\n            this.manageSelected();\n        }\n    }\n\n    protected override updated(): void {\n        if (this.items.length) {\n            this.renderVirtualizedItems();\n        }\n    }\n\n    protected renderVirtualizedItems(): void {\n        // Rendering updates into the table while disconnected can\n        // cause runaway event binding in ancestor elements.\n        if (!this.isConnected) return;\n        if (!this.tableBody) {\n            this.tableBody = this.querySelector('sp-table-body') as TableBody;\n            if (!this.tableBody) {\n                this.tableBody = document.createElement('sp-table-body');\n                this.append(this.tableBody);\n            }\n            this.tableBody.addEventListener(\n                'rangeChanged',\n                (event: RangeChangedEvent) => {\n                    this.dispatchEvent(\n                        new RangeChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n            this.tableBody.addEventListener(\n                'visibilityChanged',\n                (event: VisibilityChangedEvent) => {\n                    this.dispatchEvent(\n                        new VisibilityChangedEvent({\n                            first: event.first,\n                            last: event.last,\n                        })\n                    );\n                }\n            );\n        }\n        const config: VirtualizeDirectiveConfig<Record<string, unknown>> = {\n            items: this.items,\n            renderItem: this.renderItem,\n            scroller: this.scroller,\n        };\n        render(\n            html`\n                ${virtualize(config)}\n            `,\n            this.tableBody\n        );\n    }\n\n    public override disconnectedCallback(): void {\n        super.disconnectedCallback();\n    }\n}\n"],
+  "mappings": "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",
+  "names": ["html", "nothing", "render", "SizedMixin", "SpectrumElement", "property", "styles", "virtualize", "virtualizerRef", "RangeChangedEvent", "VisibilityChangedEvent", "RowType", "_item", "index", "fn", "item", "value", "selected", "hasCheckbox", "sortableHeadCell", "row", "_a", "checkboxes", "checkbox", "allSelected", "clonedCheckbox", "box", "rowValues", "oldSelectedCount", "selectedItem", "_b", "_c", "event", "previousSelectedSet", "previousSelected", "target", "rowItem", "changed", "config", "__decorateClass"]
 }

package/src/TableHeadCell.dev.js

@@ -12,6 +12,7 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 import {
   html,
+  nothing,
   SpectrumElement
 } from "@spectrum-web-components/base";
 import { property } from "@spectrum-web-components/base/src/decorators.js";
@@ -61,7 +62,7 @@ export class TableHeadCell extends SpectrumElement {
                       <sp-icon-arrow100
                           class="sortedIcon spectrum-UIIcon-ArrowDown100"
                       ></sp-icon-arrow100>
-                  ` : html``}
+                  ` : nothing}
         `;
   }
   firstUpdated(changes) {

package/src/TableHeadCell.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["TableHeadCell.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 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 {\n    CSSResultArray,\n    html,\n    PropertyValues,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-arrow100.js';\n\nimport styles from './table-head-cell.css.js';\nimport arrowStyles from '@spectrum-web-components/icon/src/spectrum-icon-arrow.css.js';\n\nexport type SortedEventDetails = {\n    sortDirection: 'asc' | 'desc';\n    sortKey: string;\n};\n\nconst ariaSortValue = (sortDirection?: 'asc' | 'desc'): string => {\n    const values = {\n        asc: 'ascending',\n        desc: 'descending',\n    };\n    return values[sortDirection as 'asc' | 'desc'] || 'none';\n};\n\n/**\n * @element sp-table-head-cell\n *\n * @fires sorted - Announces that the table head has been sorted and handles the sorted event\n */\nexport class TableHeadCell extends SpectrumElement {\n    public static override get styles(): CSSResultArray {\n        return [styles, arrowStyles];\n    }\n\n    @property({ reflect: true })\n    public role = 'columnheader';\n\n    @property({ type: Boolean, reflect: true })\n    public sortable = false;\n\n    @property({ reflect: true, attribute: 'sort-direction' })\n    public sortDirection: 'asc' | 'desc' | undefined;\n\n    @property({ attribute: 'sort-key' })\n    public sortKey = '';\n\n    protected handleClick(): void {\n        if (!this.sortable) return;\n        if (this.sortDirection) {\n            this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n        } else {\n            this.sortDirection = 'asc';\n        }\n        this.dispatchEvent(\n            new CustomEvent<SortedEventDetails>('sorted', {\n                bubbles: true,\n                detail: {\n                    sortDirection: this.sortDirection,\n                    sortKey: this.sortKey,\n                },\n            })\n        );\n    }\n\n    protected override render(): TemplateResult {\n        const visiblySorted = this.sortable && !!this.sortDirection;\n        return html`\n            <slot></slot>\n            ${visiblySorted\n                ? html`\n                      <sp-icon-arrow100\n                          class=\"sortedIcon spectrum-UIIcon-ArrowDown100\"\n                      ></sp-icon-arrow100>\n                  `\n                : html``}\n        `;\n    }\n\n    protected override firstUpdated(changes: PropertyValues): void {\n        super.firstUpdated(changes);\n        this.addEventListener('click', this.handleClick);\n    }\n\n    protected override update(changes: PropertyValues): void {\n        if (changes.has('sortDirection')) {\n            this.setAttribute('aria-sort', ariaSortValue(this.sortDirection));\n        }\n        if (changes.has('sortable')) {\n            this.tabIndex = this.sortable ? 0 : -1;\n        }\n        super.update(changes);\n    }\n}\n"],
-  "mappings": ";;;;;;;;;;;;AAWA;AAAA,EAEI;AAAA,EAEA;AAAA,OAEG;AACP,SAAS,gBAAgB;AACzB,OAAO;AAEP,OAAO,YAAY;AACnB,OAAO,iBAAiB;AAOxB,MAAM,gBAAgB,CAAC,kBAA2C;AAC9D,QAAM,SAAS;AAAA,IACX,KAAK;AAAA,IACL,MAAM;AAAA,EACV;AACA,SAAO,OAAO,aAA+B,KAAK;AACtD;AAOO,aAAM,sBAAsB,gBAAgB;AAAA,EAA5C;AAAA;AAMH,SAAO,OAAO;AAGd,SAAO,WAAW;AAMlB,SAAO,UAAU;AAAA;AAAA,EAdjB,WAA2B,SAAyB;AAChD,WAAO,CAAC,QAAQ,WAAW;AAAA,EAC/B;AAAA,EAcU,cAAoB;AAC1B,QAAI,CAAC,KAAK;AAAU;AACpB,QAAI,KAAK,eAAe;AACpB,WAAK,gBAAgB,KAAK,kBAAkB,QAAQ,SAAS;AAAA,IACjE,OAAO;AACH,WAAK,gBAAgB;AAAA,IACzB;AACA,SAAK;AAAA,MACD,IAAI,YAAgC,UAAU;AAAA,QAC1C,SAAS;AAAA,QACT,QAAQ;AAAA,UACJ,eAAe,KAAK;AAAA,UACpB,SAAS,KAAK;AAAA,QAClB;AAAA,MACJ,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEmB,SAAyB;AACxC,UAAM,gBAAgB,KAAK,YAAY,CAAC,CAAC,KAAK;AAC9C,WAAO;AAAA;AAAA,cAED,gBACI;AAAA;AAAA;AAAA;AAAA,sBAKA,MAAM;AAAA;AAAA,EAEpB;AAAA,EAEmB,aAAa,SAA+B;AAC3D,UAAM,aAAa,OAAO;AAC1B,SAAK,iBAAiB,SAAS,KAAK,WAAW;AAAA,EACnD;AAAA,EAEmB,OAAO,SAA+B;AACrD,QAAI,QAAQ,IAAI,eAAe,GAAG;AAC9B,WAAK,aAAa,aAAa,cAAc,KAAK,aAAa,CAAC;AAAA,IACpE;AACA,QAAI,QAAQ,IAAI,UAAU,GAAG;AACzB,WAAK,WAAW,KAAK,WAAW,IAAI;AAAA,IACxC;AACA,UAAM,OAAO,OAAO;AAAA,EACxB;AACJ;AAzDW;AAAA,EADN,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GALlB,cAMF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GARjC,cASF;AAGA;AAAA,EADN,SAAS,EAAE,SAAS,MAAM,WAAW,iBAAiB,CAAC;AAAA,GAX/C,cAYF;AAGA;AAAA,EADN,SAAS,EAAE,WAAW,WAAW,CAAC;AAAA,GAd1B,cAeF;",
+  "sourcesContent": ["/*\nCopyright 2022 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 {\n    CSSResultArray,\n    html,\n    nothing,\n    PropertyValues,\n    SpectrumElement,\n    TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-arrow100.js';\n\nimport styles from './table-head-cell.css.js';\nimport arrowStyles from '@spectrum-web-components/icon/src/spectrum-icon-arrow.css.js';\n\nexport type SortedEventDetails = {\n    sortDirection: 'asc' | 'desc';\n    sortKey: string;\n};\n\nconst ariaSortValue = (sortDirection?: 'asc' | 'desc'): string => {\n    const values = {\n        asc: 'ascending',\n        desc: 'descending',\n    };\n    return values[sortDirection as 'asc' | 'desc'] || 'none';\n};\n\n/**\n * @element sp-table-head-cell\n *\n * @fires sorted - Announces that the table head has been sorted and handles the sorted event\n */\nexport class TableHeadCell extends SpectrumElement {\n    public static override get styles(): CSSResultArray {\n        return [styles, arrowStyles];\n    }\n\n    @property({ reflect: true })\n    public role = 'columnheader';\n\n    @property({ type: Boolean, reflect: true })\n    public sortable = false;\n\n    @property({ reflect: true, attribute: 'sort-direction' })\n    public sortDirection: 'asc' | 'desc' | undefined;\n\n    @property({ attribute: 'sort-key' })\n    public sortKey = '';\n\n    protected handleClick(): void {\n        if (!this.sortable) return;\n        if (this.sortDirection) {\n            this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n        } else {\n            this.sortDirection = 'asc';\n        }\n        this.dispatchEvent(\n            new CustomEvent<SortedEventDetails>('sorted', {\n                bubbles: true,\n                detail: {\n                    sortDirection: this.sortDirection,\n                    sortKey: this.sortKey,\n                },\n            })\n        );\n    }\n\n    protected override render(): TemplateResult {\n        const visiblySorted = this.sortable && !!this.sortDirection;\n        return html`\n            <slot></slot>\n            ${visiblySorted\n                ? html`\n                      <sp-icon-arrow100\n                          class=\"sortedIcon spectrum-UIIcon-ArrowDown100\"\n                      ></sp-icon-arrow100>\n                  `\n                : nothing}\n        `;\n    }\n\n    protected override firstUpdated(changes: PropertyValues): void {\n        super.firstUpdated(changes);\n        this.addEventListener('click', this.handleClick);\n    }\n\n    protected override update(changes: PropertyValues): void {\n        if (changes.has('sortDirection')) {\n            this.setAttribute('aria-sort', ariaSortValue(this.sortDirection));\n        }\n        if (changes.has('sortable')) {\n            this.tabIndex = this.sortable ? 0 : -1;\n        }\n        super.update(changes);\n    }\n}\n"],
+  "mappings": ";;;;;;;;;;;;AAWA;AAAA,EAEI;AAAA,EACA;AAAA,EAEA;AAAA,OAEG;AACP,SAAS,gBAAgB;AACzB,OAAO;AAEP,OAAO,YAAY;AACnB,OAAO,iBAAiB;AAOxB,MAAM,gBAAgB,CAAC,kBAA2C;AAC9D,QAAM,SAAS;AAAA,IACX,KAAK;AAAA,IACL,MAAM;AAAA,EACV;AACA,SAAO,OAAO,aAA+B,KAAK;AACtD;AAOO,aAAM,sBAAsB,gBAAgB;AAAA,EAA5C;AAAA;AAMH,SAAO,OAAO;AAGd,SAAO,WAAW;AAMlB,SAAO,UAAU;AAAA;AAAA,EAdjB,WAA2B,SAAyB;AAChD,WAAO,CAAC,QAAQ,WAAW;AAAA,EAC/B;AAAA,EAcU,cAAoB;AAC1B,QAAI,CAAC,KAAK;AAAU;AACpB,QAAI,KAAK,eAAe;AACpB,WAAK,gBAAgB,KAAK,kBAAkB,QAAQ,SAAS;AAAA,IACjE,OAAO;AACH,WAAK,gBAAgB;AAAA,IACzB;AACA,SAAK;AAAA,MACD,IAAI,YAAgC,UAAU;AAAA,QAC1C,SAAS;AAAA,QACT,QAAQ;AAAA,UACJ,eAAe,KAAK;AAAA,UACpB,SAAS,KAAK;AAAA,QAClB;AAAA,MACJ,CAAC;AAAA,IACL;AAAA,EACJ;AAAA,EAEmB,SAAyB;AACxC,UAAM,gBAAgB,KAAK,YAAY,CAAC,CAAC,KAAK;AAC9C,WAAO;AAAA;AAAA,cAED,gBACI;AAAA;AAAA;AAAA;AAAA,sBAKA,OAAO;AAAA;AAAA,EAErB;AAAA,EAEmB,aAAa,SAA+B;AAC3D,UAAM,aAAa,OAAO;AAC1B,SAAK,iBAAiB,SAAS,KAAK,WAAW;AAAA,EACnD;AAAA,EAEmB,OAAO,SAA+B;AACrD,QAAI,QAAQ,IAAI,eAAe,GAAG;AAC9B,WAAK,aAAa,aAAa,cAAc,KAAK,aAAa,CAAC;AAAA,IACpE;AACA,QAAI,QAAQ,IAAI,UAAU,GAAG;AACzB,WAAK,WAAW,KAAK,WAAW,IAAI;AAAA,IACxC;AACA,UAAM,OAAO,OAAO;AAAA,EACxB;AACJ;AAzDW;AAAA,EADN,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,GALlB,cAMF;AAGA;AAAA,EADN,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GARjC,cASF;AAGA;AAAA,EADN,SAAS,EAAE,SAAS,MAAM,WAAW,iBAAiB,CAAC;AAAA,GAX/C,cAYF;AAGA;AAAA,EADN,SAAS,EAAE,WAAW,WAAW,CAAC;AAAA,GAd1B,cAeF;",
   "names": []
 }

package/src/TableHeadCell.js

@@ -1,9 +1,9 @@
-"use strict";var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(s,r,t,i)=>{for(var e=i>1?void 0:i?p(r,t):r,n=s.length-1,a;n>=0;n--)(a=s[n])&&(e=(i?a(r,t,e):a(e))||e);return i&&e&&l(r,t,e),e};import{html as d,SpectrumElement as u}from"@spectrum-web-components/base";import{property as c}from"@spectrum-web-components/base/src/decorators.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-arrow100.js";import h from"./table-head-cell.css.js";import m from"@spectrum-web-components/icon/src/spectrum-icon-arrow.css.js";const y=s=>({asc:"ascending",desc:"descending"})[s]||"none";export class TableHeadCell extends u{constructor(){super(...arguments);this.role="columnheader";this.sortable=!1;this.sortKey=""}static get styles(){return[h,m]}handleClick(){this.sortable&&(this.sortDirection?this.sortDirection=this.sortDirection==="asc"?"desc":"asc":this.sortDirection="asc",this.dispatchEvent(new CustomEvent("sorted",{bubbles:!0,detail:{sortDirection:this.sortDirection,sortKey:this.sortKey}})))}render(){const t=this.sortable&&!!this.sortDirection;return d`
+"use strict";var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var o=(s,r,t,i)=>{for(var e=i>1?void 0:i?p(r,t):r,n=s.length-1,a;n>=0;n--)(a=s[n])&&(e=(i?a(r,t,e):a(e))||e);return i&&e&&l(r,t,e),e};import{html as d,nothing as u,SpectrumElement as h}from"@spectrum-web-components/base";import{property as c}from"@spectrum-web-components/base/src/decorators.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-arrow100.js";import m from"./table-head-cell.css.js";import y from"@spectrum-web-components/icon/src/spectrum-icon-arrow.css.js";const b=s=>({asc:"ascending",desc:"descending"})[s]||"none";export class TableHeadCell extends h{constructor(){super(...arguments);this.role="columnheader";this.sortable=!1;this.sortKey=""}static get styles(){return[m,y]}handleClick(){this.sortable&&(this.sortDirection?this.sortDirection=this.sortDirection==="asc"?"desc":"asc":this.sortDirection="asc",this.dispatchEvent(new CustomEvent("sorted",{bubbles:!0,detail:{sortDirection:this.sortDirection,sortKey:this.sortKey}})))}render(){const t=this.sortable&&!!this.sortDirection;return d`
             <slot></slot>
             ${t?d`
                       <sp-icon-arrow100
                           class="sortedIcon spectrum-UIIcon-ArrowDown100"
                       ></sp-icon-arrow100>
-                  `:d``}
-        `}firstUpdated(t){super.firstUpdated(t),this.addEventListener("click",this.handleClick)}update(t){t.has("sortDirection")&&this.setAttribute("aria-sort",y(this.sortDirection)),t.has("sortable")&&(this.tabIndex=this.sortable?0:-1),super.update(t)}}o([c({reflect:!0})],TableHeadCell.prototype,"role",2),o([c({type:Boolean,reflect:!0})],TableHeadCell.prototype,"sortable",2),o([c({reflect:!0,attribute:"sort-direction"})],TableHeadCell.prototype,"sortDirection",2),o([c({attribute:"sort-key"})],TableHeadCell.prototype,"sortKey",2);
+                  `:u}
+        `}firstUpdated(t){super.firstUpdated(t),this.addEventListener("click",this.handleClick)}update(t){t.has("sortDirection")&&this.setAttribute("aria-sort",b(this.sortDirection)),t.has("sortable")&&(this.tabIndex=this.sortable?0:-1),super.update(t)}}o([c({reflect:!0})],TableHeadCell.prototype,"role",2),o([c({type:Boolean,reflect:!0})],TableHeadCell.prototype,"sortable",2),o([c({reflect:!0,attribute:"sort-direction"})],TableHeadCell.prototype,"sortDirection",2),o([c({attribute:"sort-key"})],TableHeadCell.prototype,"sortKey",2);
 //# sourceMappingURL=TableHeadCell.js.map