@spectrum-web-components/table 0.31.1-react.3 → 0.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/custom-elements.json +97 -73
  2. package/package.json +8 -8
  3. package/src/Table.d.ts +3 -13
  4. package/src/Table.dev.js +18 -12
  5. package/src/Table.dev.js.map +2 -2
  6. package/src/Table.js +9 -9
  7. package/src/Table.js.map +3 -3
  8. package/stories/table-virtualized.stories.js.map +2 -2
package/custom-elements.json CHANGED
@@ -4,84 +4,113 @@
4
4
  "modules": [
5
5
  {
6
6
  "kind": "javascript-module",
7
- "path": "sp-table-body.ts",
7
+ "path": "sp-table-body.js",
8
8
  "declarations": [],
9
- "exports": []
9
+ "exports": [
10
+ {
11
+ "kind": "custom-element-definition",
12
+ "name": "sp-table-body",
13
+ "declaration": {
14
+ "name": "TableBody",
15
+ "module": "/src/TableBody.js"
16
+ }
17
+ }
18
+ ]
10
19
  },
11
20
  {
12
21
  "kind": "javascript-module",
13
- "path": "sp-table-cell.ts",
22
+ "path": "sp-table-cell.js",
14
23
  "declarations": [],
15
- "exports": []
24
+ "exports": [
25
+ {
26
+ "kind": "custom-element-definition",
27
+ "name": "sp-table-cell",
28
+ "declaration": {
29
+ "name": "TableCell",
30
+ "module": "/src/TableCell.js"
31
+ }
32
+ }
33
+ ]
16
34
  },
17
35
  {
18
36
  "kind": "javascript-module",
19
- "path": "sp-table-checkbox-cell.ts",
37
+ "path": "sp-table-checkbox-cell.js",
20
38
  "declarations": [],
21
- "exports": []
39
+ "exports": [
40
+ {
41
+ "kind": "custom-element-definition",
42
+ "name": "sp-table-checkbox-cell",
43
+ "declaration": {
44
+ "name": "TableCheckboxCell",
45
+ "module": "/src/TableCheckboxCell.js"
46
+ }
47
+ }
48
+ ]
22
49
  },
23
50
  {
24
51
  "kind": "javascript-module",
25
- "path": "sp-table-head-cell.ts",
52
+ "path": "sp-table-head-cell.js",
26
53
  "declarations": [],
27
- "exports": []
54
+ "exports": [
55
+ {
56
+ "kind": "custom-element-definition",
57
+ "name": "sp-table-head-cell",
58
+ "declaration": {
59
+ "name": "TableHeadCell",
60
+ "module": "/src/TableHeadCell.js"
61
+ }
62
+ }
63
+ ]
28
64
  },
29
65
  {
30
66
  "kind": "javascript-module",
31
- "path": "sp-table-head.ts",
67
+ "path": "sp-table-head.js",
32
68
  "declarations": [],
33
- "exports": []
69
+ "exports": [
70
+ {
71
+ "kind": "custom-element-definition",
72
+ "name": "sp-table-head",
73
+ "declaration": {
74
+ "name": "TableHead",
75
+ "module": "/src/TableHead.js"
76
+ }
77
+ }
78
+ ]
34
79
  },
35
80
  {
36
81
  "kind": "javascript-module",
37
- "path": "sp-table-row.ts",
82
+ "path": "sp-table-row.js",
38
83
  "declarations": [],
39
- "exports": []
84
+ "exports": [
85
+ {
86
+ "kind": "custom-element-definition",
87
+ "name": "sp-table-row",
88
+ "declaration": {
89
+ "name": "TableRow",
90
+ "module": "/src/TableRow.js"
91
+ }
92
+ }
93
+ ]
40
94
  },
41
95
  {
42
96
  "kind": "javascript-module",
43
- "path": "sp-table.ts",
97
+ "path": "sp-table.js",
44
98
  "declarations": [],
45
- "exports": []
99
+ "exports": [
100
+ {
101
+ "kind": "custom-element-definition",
102
+ "name": "sp-table",
103
+ "declaration": {
104
+ "name": "Table",
105
+ "module": "/src/Table.js"
106
+ }
107
+ }
108
+ ]
46
109
  },
47
110
  {
48
111
  "kind": "javascript-module",
49
- "path": "src/Table.ts",
112
+ "path": "src/Table.js",
50
113
  "declarations": [
51
- {
52
- "kind": "class",
53
- "description": "",
54
- "name": "RangeChangedEvent",
55
- "members": [
56
- {
57
- "kind": "field",
58
- "name": "eventName",
59
- "type": {
60
- "text": "string"
61
- },
62
- "static": true,
63
- "default": "'rangeChanged'"
64
- },
65
- {
66
- "kind": "field",
67
- "name": "first",
68
- "type": {
69
- "text": "number"
70
- }
71
- },
72
- {
73
- "kind": "field",
74
- "name": "last",
75
- "type": {
76
- "text": "number"
77
- }
78
- }
79
- ],
80
- "superclass": {
81
- "name": "Event",
82
- "module": "src/Table.ts"
83
- }
84
- },
85
114
  {
86
115
  "kind": "class",
87
116
  "description": "",
@@ -193,7 +222,8 @@
193
222
  "type": {
194
223
  "text": "TableHead"
195
224
  },
196
- "privacy": "private"
225
+ "privacy": "private",
226
+ "readonly": true
197
227
  },
198
228
  {
199
229
  "kind": "field",
@@ -201,7 +231,8 @@
201
231
  "type": {
202
232
  "text": "TableRow[]"
203
233
  },
204
- "privacy": "private"
234
+ "privacy": "private",
235
+ "readonly": true
205
236
  },
206
237
  {
207
238
  "kind": "field",
@@ -209,7 +240,8 @@
209
240
  "type": {
210
241
  "text": "boolean"
211
242
  },
212
- "privacy": "private"
243
+ "privacy": "private",
244
+ "readonly": true
213
245
  },
214
246
  {
215
247
  "kind": "method",
@@ -430,27 +462,19 @@
430
462
  }
431
463
  ],
432
464
  "exports": [
433
- {
434
- "kind": "js",
435
- "name": "RangeChangedEvent",
436
- "declaration": {
437
- "name": "RangeChangedEvent",
438
- "module": "src/Table.ts"
439
- }
440
- },
441
465
  {
442
466
  "kind": "js",
443
467
  "name": "Table",
444
468
  "declaration": {
445
469
  "name": "Table",
446
- "module": "src/Table.ts"
470
+ "module": "src/Table.js"
447
471
  }
448
472
  }
449
473
  ]
450
474
  },
451
475
  {
452
476
  "kind": "javascript-module",
453
- "path": "src/TableBody.ts",
477
+ "path": "src/TableBody.js",
454
478
  "declarations": [
455
479
  {
456
480
  "kind": "class",
@@ -503,14 +527,14 @@
503
527
  "name": "TableBody",
504
528
  "declaration": {
505
529
  "name": "TableBody",
506
- "module": "src/TableBody.ts"
530
+ "module": "src/TableBody.js"
507
531
  }
508
532
  }
509
533
  ]
510
534
  },
511
535
  {
512
536
  "kind": "javascript-module",
513
- "path": "src/TableCell.ts",
537
+ "path": "src/TableCell.js",
514
538
  "declarations": [
515
539
  {
516
540
  "kind": "class",
@@ -553,14 +577,14 @@
553
577
  "name": "TableCell",
554
578
  "declaration": {
555
579
  "name": "TableCell",
556
- "module": "src/TableCell.ts"
580
+ "module": "src/TableCell.js"
557
581
  }
558
582
  }
559
583
  ]
560
584
  },
561
585
  {
562
586
  "kind": "javascript-module",
563
- "path": "src/TableCheckboxCell.ts",
587
+ "path": "src/TableCheckboxCell.js",
564
588
  "declarations": [
565
589
  {
566
590
  "kind": "class",
@@ -694,14 +718,14 @@
694
718
  "name": "TableCheckboxCell",
695
719
  "declaration": {
696
720
  "name": "TableCheckboxCell",
697
- "module": "src/TableCheckboxCell.ts"
721
+ "module": "src/TableCheckboxCell.js"
698
722
  }
699
723
  }
700
724
  ]
701
725
  },
702
726
  {
703
727
  "kind": "javascript-module",
704
- "path": "src/TableHead.ts",
728
+ "path": "src/TableHead.js",
705
729
  "declarations": [
706
730
  {
707
731
  "kind": "class",
@@ -797,14 +821,14 @@
797
821
  "name": "TableHead",
798
822
  "declaration": {
799
823
  "name": "TableHead",
800
- "module": "src/TableHead.ts"
824
+ "module": "src/TableHead.js"
801
825
  }
802
826
  }
803
827
  ]
804
828
  },
805
829
  {
806
830
  "kind": "javascript-module",
807
- "path": "src/TableHeadCell.ts",
831
+ "path": "src/TableHeadCell.js",
808
832
  "declarations": [
809
833
  {
810
834
  "kind": "class",
@@ -920,14 +944,14 @@
920
944
  "name": "TableHeadCell",
921
945
  "declaration": {
922
946
  "name": "TableHeadCell",
923
- "module": "src/TableHeadCell.ts"
947
+ "module": "src/TableHeadCell.js"
924
948
  }
925
949
  }
926
950
  ]
927
951
  },
928
952
  {
929
953
  "kind": "javascript-module",
930
- "path": "src/TableRow.ts",
954
+ "path": "src/TableRow.js",
931
955
  "declarations": [
932
956
  {
933
957
  "kind": "class",
@@ -1102,7 +1126,7 @@
1102
1126
  "name": "TableRow",
1103
1127
  "declaration": {
1104
1128
  "name": "TableRow",
1105
- "module": "src/TableRow.ts"
1129
+ "module": "src/TableRow.js"
1106
1130
  }
1107
1131
  }
1108
1132
  ]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/table",
3
- "version": "0.31.1-react.3+886f51591",
3
+ "version": "0.32.0",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -115,14 +115,14 @@
115
115
  "lit-html"
116
116
  ],
117
117
  "dependencies": {
118
- "@lit-labs/virtualizer": "^1.0.1",
119
- "@spectrum-web-components/base": "^0.31.1-react.3+886f51591",
120
- "@spectrum-web-components/checkbox": "^0.31.1-react.3+886f51591",
121
- "@spectrum-web-components/icon": "^0.31.1-react.3+886f51591",
122
- "@spectrum-web-components/icons-ui": "^0.31.1-react.3+886f51591"
118
+ "@lit-labs/virtualizer": "^2.0.2",
119
+ "@spectrum-web-components/base": "^0.32.0",
120
+ "@spectrum-web-components/checkbox": "^0.32.0",
121
+ "@spectrum-web-components/icon": "^0.32.0",
122
+ "@spectrum-web-components/icons-ui": "^0.32.0"
123
123
  },
124
124
  "devDependencies": {
125
- "@spectrum-css/table": "^4.0.41"
125
+ "@spectrum-css/table": "^4.0.50"
126
126
  },
127
127
  "types": "./src/index.d.ts",
128
128
  "customElements": "custom-elements.json",
@@ -131,5 +131,5 @@
131
131
  "./elements.js",
132
132
  "./**/*.dev.js"
133
133
  ],
134
- "gitHead": "886f515919ca0e8a1cec52a00babb1d4a195ae01"
134
+ "gitHead": "c5f67662ac54d0e37debaf7cbd7c2df60e8b294e"
135
135
  }
package/src/Table.d.ts CHANGED
@@ -1,11 +1,7 @@
1
1
  import { CSSResultArray, PropertyValues, SpectrumElement, TemplateResult } from '@spectrum-web-components/base';
2
- import '../sp-table-row.js';
3
- import '../sp-table-checkbox-cell.js';
4
- import '../sp-table-body.js';
5
- interface Range {
6
- first: number;
7
- last: number;
8
- }
2
+ import '@spectrum-web-components/table/sp-table-body.js';
3
+ import '@spectrum-web-components/table/sp-table-row.js';
4
+ import '@spectrum-web-components/table/sp-table-checkbox-cell.js';
9
5
  export declare enum RowType {
10
6
  ITEM = 0,
11
7
  INFORMATION = 1
@@ -13,12 +9,6 @@ export declare enum RowType {
13
9
  export interface TableItem extends Record<string, unknown> {
14
10
  _$rowType$?: RowType;
15
11
  }
16
- export declare class RangeChangedEvent extends Event {
17
- static eventName: string;
18
- first: number;
19
- last: number;
20
- constructor(range: Range);
21
- }
22
12
  declare const Table_base: typeof SpectrumElement & {
23
13
  new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
24
14
  prototype: import("@spectrum-web-components/base").SizedElementInterface;
package/src/Table.dev.js CHANGED
@@ -16,29 +16,24 @@ import {
16
16
  SizedMixin,
17
17
  SpectrumElement
18
18
  } from "@spectrum-web-components/base";
19
- import "../sp-table-row.dev.js";
20
- import "../sp-table-checkbox-cell.dev.js";
21
- import "../sp-table-body.dev.js";
19
+ import "@spectrum-web-components/table/sp-table-body.js";
20
+ import "@spectrum-web-components/table/sp-table-row.js";
21
+ import "@spectrum-web-components/table/sp-table-checkbox-cell.js";
22
22
  import { property } from "@spectrum-web-components/base/src/decorators.js";
23
23
  import styles from "./table.css.js";
24
24
  import {
25
25
  virtualize,
26
26
  virtualizerRef
27
27
  } from "@lit-labs/virtualizer/virtualize.js";
28
+ import {
29
+ RangeChangedEvent,
30
+ VisibilityChangedEvent
31
+ } from "@lit-labs/virtualizer/events.js";
28
32
  export var RowType = /* @__PURE__ */ ((RowType2) => {
29
33
  RowType2[RowType2["ITEM"] = 0] = "ITEM";
30
34
  RowType2[RowType2["INFORMATION"] = 1] = "INFORMATION";
31
35
  return RowType2;
32
36
  })(RowType || {});
33
- const _RangeChangedEvent = class extends Event {
34
- constructor(range) {
35
- super(_RangeChangedEvent.eventName, { bubbles: true });
36
- this.first = range.first;
37
- this.last = range.last;
38
- }
39
- };
40
- export let RangeChangedEvent = _RangeChangedEvent;
41
- RangeChangedEvent.eventName = "rangeChanged";
42
37
  export class Table extends SizedMixin(SpectrumElement, {
43
38
  validSizes: ["s", "m"],
44
39
  defaultSize: "m"
@@ -357,6 +352,17 @@ export class Table extends SizedMixin(SpectrumElement, {
357
352
  );
358
353
  }
359
354
  );
355
+ this.tableBody.addEventListener(
356
+ "visibilityChanged",
357
+ (event) => {
358
+ this.dispatchEvent(
359
+ new VisibilityChangedEvent({
360
+ first: event.first,
361
+ last: event.last
362
+ })
363
+ );
364
+ }
365
+ );
360
366
  }
361
367
  const config = {
362
368
  items: this.items,
package/src/Table.dev.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Table.ts"],
4
- "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';\nimport '../sp-table-row.dev.js'\nimport '../sp-table-checkbox-cell.dev.js'\nimport '../sp-table-body.dev.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';\n\ninterface Range {\n first: number;\n last: number;\n}\n\nexport enum RowType {\n ITEM = 0,\n INFORMATION = 1,\n}\n\nexport interface TableItem extends Record<string, unknown> {\n _$rowType$?: RowType;\n}\n\nexport class RangeChangedEvent extends Event {\n static eventName = 'rangeChanged';\n\n first: number;\n last: number;\n\n constructor(range: Range) {\n super(RangeChangedEvent.eventName, { bubbles: true });\n this.first = range.first;\n this.last = range.last;\n }\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 }\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"],
5
- "mappings": "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",
4
+ "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"],
5
+ "mappings": "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",
6
6
  "names": ["RowType", "_a"]
7
7
  }
package/src/Table.js CHANGED
@@ -1,19 +1,19 @@
1
- "use strict";var u=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var a=(h,c,e,l)=>{for(var t=l>1?void 0:l?p(c,e):c,s=h.length-1,i;s>=0;s--)(i=h[s])&&(t=(l?i(c,e,t):i(t))||t);return l&&t&&u(c,e,t),t};import{html as d,render as m,SizedMixin as f,SpectrumElement as C}from"@spectrum-web-components/base";import"../sp-table-row.js";import"../sp-table-checkbox-cell.js";import"../sp-table-body.js";import{property as o}from"@spectrum-web-components/base/src/decorators.js";import k from"./table.css.js";import{virtualize as g,virtualizerRef as v}from"@lit-labs/virtualizer/virtualize.js";export var RowType=(e=>(e[e.ITEM=0]="ITEM",e[e.INFORMATION=1]="INFORMATION",e))(RowType||{});const n=class extends Event{constructor(e){super(n.eventName,{bubbles:!0});this.first=e.first,this.last=e.last}};export let RangeChangedEvent=n;RangeChangedEvent.eventName="rangeChanged";export class Table extends f(C,{validSizes:["s","m"],defaultSize:"m"}){constructor(){super(...arguments);this._renderItem=()=>d``;this.role="grid";this.selected=[];this.selectedSet=new Set;this.items=[];this.itemValue=(e,l)=>`${l}`;this.scroller=!1}static get styles(){return[k]}get renderItem(){return this._renderItem}set renderItem(e){this._renderItem=(l,t)=>{const s=this.itemValue(l,t),i=this.selected.includes(s),b=this.selects&&(l==null?void 0:l._$rowType$)!==1;return d`
1
+ "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`
2
2
  <sp-table-row
3
3
  value=${s}
4
- aria-rowindex=${t+1}
4
+ aria-rowindex=${l+1}
5
5
  ?selected=${i}
6
6
  >
7
- ${b?d`
7
+ ${n?r`
8
8
  <sp-table-checkbox-cell
9
9
  ?checked=${i}
10
10
  ></sp-table-checkbox-cell>
11
- `:d``}
12
- ${e(l,t)}
11
+ `:r``}
12
+ ${e(t,l)}
13
13
  </sp-table-row>
14
- `}}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,l)=>{e._$rowType$!==1&&this.selectedSet.add(this.itemValue(e,l))}):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(l=>{l.selected=!1}),this.tableHeadCheckboxCell&&(this.tableHeadCheckboxCell.checked=!1,this.tableHeadCheckboxCell.indeterminate=!1)}manageSelects(){const e=this.querySelectorAll("sp-table-checkbox-cell"),l=document.createElement("sp-table-checkbox-cell");if(this.selects){let t=!1;this.isVirtualized?t=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=l.cloneNode();s.insertAdjacentElement("afterbegin",i),l.checked=s.selected}}),t=this.selected.length===this.tableRows.length),this.tableHeadCheckboxCell||(this.tableHeadCheckboxCell=document.createElement("sp-table-checkbox-cell"),this.tableHead.insertAdjacentElement("afterbegin",this.tableHeadCheckboxCell)),this.manageHeadCheckbox(t)}else e.forEach(t=>{t.remove()}),delete this.tableHeadCheckboxCell}validateSelected(){const e=new Set;this.isVirtualized?this.items.forEach((t,s)=>{const i=this.itemValue(t,s);e.add(i)}):this.tableRows.forEach(t=>{e.add(t.value)});const l=this.selected.length;this.selected=this.selected.filter(t=>e.has(t)),l!==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 l=this.selected.length===this.tableRows.length;this.manageHeadCheckbox(l),this.tableHead.insertAdjacentElement("afterbegin",this.tableHeadCheckboxCell),this.tableRows.forEach(t=>{const s=document.createElement("sp-table-checkbox-cell");t.insertAdjacentElement("afterbegin",s),t.selected=this.selectedSet.has(t.value),s.checked=t.selected})}else(e=this.tableHead.querySelector("sp-table-checkbox-cell"))==null||e.remove(),this.tableRows.forEach(l=>{var t;(t=l.checkboxCells[0])==null||t.remove(),this.selected.length&&(l.selected=this.selectedSet.has(l.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 l=new Set(this.selectedSet),t=[...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 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}=s;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=l,this.selected=t)}scrollToIndex(e){if(e&&this.tableBody){const t=this.tableBody[v].element(e);t&&t.scrollIntoView()}}render(){return d`
14
+ `}}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`
15
15
  <slot @change=${this.handleChange}></slot>
16
- `}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",l=>{this.dispatchEvent(new RangeChangedEvent({first:l.first,last:l.last}))}));const e={items:this.items,renderItem:this.renderItem,scroller:this.scroller};m(d`
17
- ${g(e)}
18
- `,this.tableBody)}disconnectedCallback(){super.disconnectedCallback()}}a([o({reflect:!0})],Table.prototype,"role",2),a([o({type:String,reflect:!0})],Table.prototype,"selects",2),a([o({type:Array})],Table.prototype,"selected",2),a([o({type:Array})],Table.prototype,"items",2),a([o({type:Object})],Table.prototype,"itemValue",2),a([o({type:Boolean,reflect:!0})],Table.prototype,"scroller",2);
16
+ `}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`
17
+ ${k(e)}
18
+ `,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);
19
19
  //# sourceMappingURL=Table.js.map
package/src/Table.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["Table.ts"],
4
- "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';\nimport '../sp-table-row.js';\nimport '../sp-table-checkbox-cell.js';\nimport '../sp-table-body.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';\n\ninterface Range {\n first: number;\n last: number;\n}\n\nexport enum RowType {\n ITEM = 0,\n INFORMATION = 1,\n}\n\nexport interface TableItem extends Record<string, unknown> {\n _$rowType$?: RowType;\n}\n\nexport class RangeChangedEvent extends Event {\n static eventName = 'rangeChanged';\n\n first: number;\n last: number;\n\n constructor(range: Range) {\n super(RangeChangedEvent.eventName, { bubbles: true });\n this.first = range.first;\n this.last = range.last;\n }\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 }\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"],
5
- "mappings": "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",
6
- "names": ["html", "render", "SizedMixin", "SpectrumElement", "property", "styles", "virtualize", "virtualizerRef", "RowType", "_RangeChangedEvent", "range", "_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"]
4
+ "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"],
5
+ "mappings": "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",
6
+ "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"]
7
7
  }
package/stories/table-virtualized.stories.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["table-virtualized.stories.ts"],
4
- "sourcesContent": ["/* STORIES\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 html,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\n\nimport '@spectrum-web-components/table/sp-table.js';\nimport '@spectrum-web-components/table/sp-table-checkbox-cell.js';\nimport '@spectrum-web-components/table/sp-table-head.js';\nimport '@spectrum-web-components/table/sp-table-head-cell.js';\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-cell.js';\nimport { Item, makeItems, Properties, renderItem } from './index.js';\nimport type {\n RangeChangedEvent,\n SortedEventDetails,\n Table,\n} from '@spectrum-web-components/table';\n\nexport default {\n title: 'Table/Virtualized',\n component: 'sp-table',\n argTypes: {\n onChange: { action: 'change' },\n selected: {\n name: 'selected',\n description: 'The array of item values selected by the Table.',\n type: { name: '', required: false },\n control: 'text',\n },\n selects: {\n name: 'selects',\n description:\n 'If the Table accepts a \"single\" or \"multiple\" selection.',\n control: {\n type: 'inline-radio',\n options: ['', 'single', 'multiple'],\n },\n },\n },\n args: {\n selects: '',\n selected: [],\n },\n};\n\nclass VirtualTable extends SpectrumElement {\n @property({ type: Array })\n public items: {\n name: string;\n date: number;\n }[] = makeItems(50);\n\n constructor() {\n super();\n this.items.sort(this.compareItems('name', 'desc'));\n }\n\n compareItems =\n (sortKey: 'name' | 'date', sortDirection: 'asc' | 'desc') =>\n (\n a: {\n name: string;\n date: number;\n },\n b: {\n name: string;\n date: number;\n }\n ): number => {\n const doSortKey = sortKey;\n if (!isNaN(Number(a[doSortKey]))) {\n const first = Number(a[doSortKey]);\n const second = Number(b[doSortKey]);\n return sortDirection === 'asc'\n ? first - second\n : second - first;\n } else {\n const first = String(a[doSortKey]);\n const second = String(b[doSortKey]);\n return sortDirection === 'asc'\n ? first.localeCompare(second)\n : second.localeCompare(first);\n }\n };\n\n protected override render(): TemplateResult {\n return html`\n <sp-table\n aria-rowcount=\"50\"\n .items=${this.items}\n .renderItem=${renderItem}\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n @sorted=${(event: CustomEvent<SortedEventDetails>): void => {\n const { sortKey, sortDirection } = event.detail; // leveraged CustomEvent().detail, works across shadow boundaries\n const items = [...this.items];\n // depending on the column, sort asc or desc depending on the arrow direction\n items.sort(\n this.compareItems(\n sortKey as 'name' | 'date',\n sortDirection\n )\n );\n this.items = items;\n }}\n >\n <sp-table-head>\n <sp-table-head-cell\n sortable\n sort-key=\"name\"\n sort-direction=\"desc\"\n >\n Column Title\n </sp-table-head-cell>\n <sp-table-head-cell sortable sort-key=\"date\">\n Column Title\n </sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n `;\n }\n}\n\ncustomElements.define('virtual-table', VirtualTable);\n\nconst virtualItems = makeItems(50);\n\nexport const virtualized = (): TemplateResult => {\n return html`\n <virtual-table></virtual-table>\n `;\n};\n\nexport const virtualizedSingle = (args: Properties): TemplateResult => {\n const onChange =\n (args.onChange as (eventData: {\n first: number;\n last: number;\n type: string;\n }) => void) ||\n (() => {\n return;\n });\n\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 300px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n .items=${virtualItems}\n .renderItem=${renderItem}\n @visibilityChanged=${(event: RangeChangedEvent) =>\n onChange({\n first: event.first,\n last: event.last,\n type: 'visibility',\n })}\n @rangeChanged=${(event: RangeChangedEvent) =>\n onChange({\n first: event.first,\n last: event.last,\n type: 'range',\n })}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n <div>Selected: [\"49\"]</div>\n `;\n};\nvirtualizedSingle.args = {\n selects: 'single',\n selected: ['49'],\n};\n\nexport const virtualizedMultiple = (args: Properties): TemplateResult => {\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected,\n null,\n ' '\n )}`;\n const nextNext = next.nextElementSibling as HTMLDivElement;\n nextNext.textContent = `Selected Count: ${target.selected.length}`;\n }}\n .items=${virtualItems}\n .renderItem=${renderItem}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n <div>Selected: [\"0\", \"48\"]</div>\n <div>Selected Count: 2</div>\n `;\n};\nvirtualizedMultiple.args = {\n selects: 'multiple',\n selected: ['0', '48'],\n};\n\nexport const virtualizedCustomValue = (args: Properties): TemplateResult => {\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${args.onChange}\n .items=${virtualItems}\n .itemValue=${(item: Item) => 'applied-' + item.date}\n .renderItem=${renderItem}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n <sp-table-body></sp-table-body>\n </sp-table>\n <div>Selected: [\"0\", \"48\", \"applied-47\"]</div>\n <div>Selected Count: 2</div>\n `;\n};\nvirtualizedCustomValue.args = {\n selected: ['0', '48', 'applied-47'],\n selects: 'multiple',\n onChange: ({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected,\n null,\n ' '\n )}`;\n const nextNext = next.nextElementSibling as HTMLDivElement;\n nextNext.textContent = `Selected Count: ${target.selected.length}`;\n },\n};\n\nexport const virtualizedCustomRow = (args: Properties): TemplateResult => {\n virtualItems.splice(3, 1, { name: 'Scoobert', date: 2, _$rowType$: 1 });\n\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected,\n null,\n ' '\n )}`;\n const nextNext = next.nextElementSibling as HTMLDivElement;\n nextNext.textContent = `Selected Count: ${target.selected.length}`;\n }}\n scroller?=\"false\"\n .items=${virtualItems}\n .renderItem=${renderItem}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n <div>Selected: [\"0\", \"48\"]</div>\n <div>Selected Count: 2</div>\n `;\n};\nvirtualizedCustomRow.args = {\n selects: 'multiple',\n selected: ['0', '48'],\n};\n\nexport const virtualizedNoScroller = (): TemplateResult => {\n return html`\n <sp-table size=\"m\" .items=${virtualItems} .renderItem=${renderItem}>\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n `;\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* STORIES\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 html,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport { property } from '@spectrum-web-components/base/src/decorators.js';\n\nimport '@spectrum-web-components/table/sp-table.js';\nimport '@spectrum-web-components/table/sp-table-checkbox-cell.js';\nimport '@spectrum-web-components/table/sp-table-head.js';\nimport '@spectrum-web-components/table/sp-table-head-cell.js';\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-cell.js';\nimport { Item, makeItems, Properties, renderItem } from './index.js';\nimport type { SortedEventDetails, Table } from '@spectrum-web-components/table';\nimport { RangeChangedEvent } from '@lit-labs/virtualizer/events.js';\n\nexport default {\n title: 'Table/Virtualized',\n component: 'sp-table',\n argTypes: {\n onChange: { action: 'change' },\n selected: {\n name: 'selected',\n description: 'The array of item values selected by the Table.',\n type: { name: '', required: false },\n control: 'text',\n },\n selects: {\n name: 'selects',\n description:\n 'If the Table accepts a \"single\" or \"multiple\" selection.',\n control: {\n type: 'inline-radio',\n options: ['', 'single', 'multiple'],\n },\n },\n },\n args: {\n selects: '',\n selected: [],\n },\n};\n\nclass VirtualTable extends SpectrumElement {\n @property({ type: Array })\n public items: {\n name: string;\n date: number;\n }[] = makeItems(50);\n\n constructor() {\n super();\n this.items.sort(this.compareItems('name', 'desc'));\n }\n\n compareItems =\n (sortKey: 'name' | 'date', sortDirection: 'asc' | 'desc') =>\n (\n a: {\n name: string;\n date: number;\n },\n b: {\n name: string;\n date: number;\n }\n ): number => {\n const doSortKey = sortKey;\n if (!isNaN(Number(a[doSortKey]))) {\n const first = Number(a[doSortKey]);\n const second = Number(b[doSortKey]);\n return sortDirection === 'asc'\n ? first - second\n : second - first;\n } else {\n const first = String(a[doSortKey]);\n const second = String(b[doSortKey]);\n return sortDirection === 'asc'\n ? first.localeCompare(second)\n : second.localeCompare(first);\n }\n };\n\n protected override render(): TemplateResult {\n return html`\n <sp-table\n aria-rowcount=\"50\"\n .items=${this.items}\n .renderItem=${renderItem}\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n @sorted=${(event: CustomEvent<SortedEventDetails>): void => {\n const { sortKey, sortDirection } = event.detail; // leveraged CustomEvent().detail, works across shadow boundaries\n const items = [...this.items];\n // depending on the column, sort asc or desc depending on the arrow direction\n items.sort(\n this.compareItems(\n sortKey as 'name' | 'date',\n sortDirection\n )\n );\n this.items = items;\n }}\n >\n <sp-table-head>\n <sp-table-head-cell\n sortable\n sort-key=\"name\"\n sort-direction=\"desc\"\n >\n Column Title\n </sp-table-head-cell>\n <sp-table-head-cell sortable sort-key=\"date\">\n Column Title\n </sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n `;\n }\n}\n\ncustomElements.define('virtual-table', VirtualTable);\n\nconst virtualItems = makeItems(50);\n\nexport const virtualized = (): TemplateResult => {\n return html`\n <virtual-table></virtual-table>\n `;\n};\n\nexport const virtualizedSingle = (args: Properties): TemplateResult => {\n const onChange =\n (args.onChange as (eventData: {\n first: number;\n last: number;\n type: string;\n }) => void) ||\n (() => {\n return;\n });\n\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 300px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n .items=${virtualItems}\n .renderItem=${renderItem}\n @visibilityChanged=${(event: RangeChangedEvent) =>\n onChange({\n first: event.first,\n last: event.last,\n type: 'visibility',\n })}\n @rangeChanged=${(event: RangeChangedEvent) =>\n onChange({\n first: event.first,\n last: event.last,\n type: 'range',\n })}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n <div>Selected: [\"49\"]</div>\n `;\n};\nvirtualizedSingle.args = {\n selects: 'single',\n selected: ['49'],\n};\n\nexport const virtualizedMultiple = (args: Properties): TemplateResult => {\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected,\n null,\n ' '\n )}`;\n const nextNext = next.nextElementSibling as HTMLDivElement;\n nextNext.textContent = `Selected Count: ${target.selected.length}`;\n }}\n .items=${virtualItems}\n .renderItem=${renderItem}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n <div>Selected: [\"0\", \"48\"]</div>\n <div>Selected Count: 2</div>\n `;\n};\nvirtualizedMultiple.args = {\n selects: 'multiple',\n selected: ['0', '48'],\n};\n\nexport const virtualizedCustomValue = (args: Properties): TemplateResult => {\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${args.onChange}\n .items=${virtualItems}\n .itemValue=${(item: Item) => 'applied-' + item.date}\n .renderItem=${renderItem}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n <sp-table-body></sp-table-body>\n </sp-table>\n <div>Selected: [\"0\", \"48\", \"applied-47\"]</div>\n <div>Selected Count: 2</div>\n `;\n};\nvirtualizedCustomValue.args = {\n selected: ['0', '48', 'applied-47'],\n selects: 'multiple',\n onChange: ({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected,\n null,\n ' '\n )}`;\n const nextNext = next.nextElementSibling as HTMLDivElement;\n nextNext.textContent = `Selected Count: ${target.selected.length}`;\n },\n};\n\nexport const virtualizedCustomRow = (args: Properties): TemplateResult => {\n virtualItems.splice(3, 1, { name: 'Scoobert', date: 2, _$rowType$: 1 });\n\n return html`\n <sp-table\n size=\"m\"\n scroller=\"true\"\n style=\"height: 200px\"\n selects=${args.selects}\n .selected=${args.selected}\n @change=${({ target }: Event & { target: Table }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected,\n null,\n ' '\n )}`;\n const nextNext = next.nextElementSibling as HTMLDivElement;\n nextNext.textContent = `Selected Count: ${target.selected.length}`;\n }}\n scroller?=\"false\"\n .items=${virtualItems}\n .renderItem=${renderItem}\n >\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n <div>Selected: [\"0\", \"48\"]</div>\n <div>Selected Count: 2</div>\n `;\n};\nvirtualizedCustomRow.args = {\n selects: 'multiple',\n selected: ['0', '48'],\n};\n\nexport const virtualizedNoScroller = (): TemplateResult => {\n return html`\n <sp-table size=\"m\" .items=${virtualItems} .renderItem=${renderItem}>\n <sp-table-head>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n <sp-table-head-cell>Column Title</sp-table-head-cell>\n </sp-table-head>\n </sp-table>\n `;\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }