@ni/nimble-components 21.5.1 → 21.5.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/all-components-bundle.js +52 -31
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +572 -570
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/table/models/expansion-manager.d.ts +3 -2
- package/dist/esm/table/models/expansion-manager.js +50 -29
- package/dist/esm/table/models/expansion-manager.js.map +1 -1
- package/dist/esm/table-column/anchor/cell-view/template.js +1 -1
- package/dist/esm/table-column/anchor/cell-view/template.js.map +1 -1
- package/package.json +1 -1
|
@@ -13,10 +13,10 @@ import { type TableNode, type TableRecord, type TableSetRecordHierarchyOptions }
|
|
|
13
13
|
*/
|
|
14
14
|
export declare class ExpansionManager<TData extends TableRecord> {
|
|
15
15
|
private readonly tanStackTable;
|
|
16
|
-
private
|
|
17
|
-
private collapsedRows;
|
|
16
|
+
private explicitExpansionStates;
|
|
18
17
|
private hierarchyOptions;
|
|
19
18
|
private isHierarchyEnabled;
|
|
19
|
+
private parentRowsWithChildren;
|
|
20
20
|
constructor(tanStackTable: TanStackTable<TableNode<TData>>);
|
|
21
21
|
isRowExpanded(row: TanStackRow<TableNode<TData>>): boolean;
|
|
22
22
|
toggleRowExpansion(row: TanStackRow<TableNode<TData>>): void;
|
|
@@ -29,4 +29,5 @@ export declare class ExpansionManager<TData extends TableRecord> {
|
|
|
29
29
|
setHierarchyEnabled(isHierarchyEnabled: boolean): void;
|
|
30
30
|
isLoadingChildren(id: string): boolean;
|
|
31
31
|
private canLoadDelayedChildren;
|
|
32
|
+
private getDefaultExpansionState;
|
|
32
33
|
}
|
|
@@ -13,79 +13,94 @@ import { TableRecordDelayedHierarchyState } from '../types';
|
|
|
13
13
|
export class ExpansionManager {
|
|
14
14
|
constructor(tanStackTable) {
|
|
15
15
|
this.tanStackTable = tanStackTable;
|
|
16
|
-
|
|
17
|
-
// state or not. Note that the default expanded state for a particular row type (group vs parent) can
|
|
18
|
-
// potentially be different (e.g. expanded for groups and collapsed for parent rows).
|
|
19
|
-
this.isInDefaultState = true;
|
|
20
|
-
this.collapsedRows = new Set();
|
|
16
|
+
this.explicitExpansionStates = new Map();
|
|
21
17
|
this.hierarchyOptions = new Map();
|
|
22
18
|
this.isHierarchyEnabled = false;
|
|
19
|
+
this.parentRowsWithChildren = new Set();
|
|
23
20
|
}
|
|
24
21
|
isRowExpanded(row) {
|
|
25
22
|
if (!this.isRowExpandable(row)) {
|
|
26
23
|
return false;
|
|
27
24
|
}
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
}
|
|
31
|
-
return this.isInDefaultState || !this.collapsedRows.has(row.id);
|
|
25
|
+
const expansionState = this.explicitExpansionStates.get(row.id);
|
|
26
|
+
return expansionState ?? this.getDefaultExpansionState(row);
|
|
32
27
|
}
|
|
33
28
|
toggleRowExpansion(row) {
|
|
34
29
|
if (!this.isRowExpandable(row)) {
|
|
35
30
|
return;
|
|
36
31
|
}
|
|
37
32
|
const wasExpanded = this.isRowExpanded(row);
|
|
38
|
-
this.
|
|
39
|
-
if (wasExpanded) {
|
|
40
|
-
this.collapsedRows.add(row.id);
|
|
41
|
-
}
|
|
42
|
-
else {
|
|
43
|
-
this.collapsedRows.delete(row.id);
|
|
44
|
-
}
|
|
33
|
+
this.explicitExpansionStates.set(row.id, !wasExpanded);
|
|
45
34
|
row.toggleExpanded();
|
|
46
35
|
}
|
|
47
36
|
collapseAll() {
|
|
48
37
|
this.resetExpansionState();
|
|
49
|
-
this.isInDefaultState = false;
|
|
50
38
|
const rows = this.tanStackTable.getRowModel().flatRows;
|
|
51
39
|
for (const row of rows) {
|
|
52
40
|
if (this.isRowExpandable(row)) {
|
|
53
|
-
this.
|
|
41
|
+
this.explicitExpansionStates.set(row.id, false);
|
|
54
42
|
}
|
|
55
43
|
}
|
|
56
44
|
this.tanStackTable.toggleAllRowsExpanded(false);
|
|
57
45
|
}
|
|
58
46
|
resetExpansionState() {
|
|
59
|
-
this.
|
|
60
|
-
this.isInDefaultState = true;
|
|
47
|
+
this.explicitExpansionStates.clear();
|
|
61
48
|
}
|
|
62
49
|
resetHierarchyOptions() {
|
|
63
50
|
this.hierarchyOptions.clear();
|
|
64
51
|
}
|
|
65
52
|
processDataUpdate(rows) {
|
|
66
|
-
if (this.
|
|
53
|
+
if (this.explicitExpansionStates.size === 0
|
|
54
|
+
&& this.hierarchyOptions.size === 0) {
|
|
67
55
|
return;
|
|
68
56
|
}
|
|
69
|
-
const
|
|
57
|
+
const updatedExplicitExpansionStates = new Map();
|
|
70
58
|
const updatedHierarchyOptions = new Map();
|
|
59
|
+
const updatedParentRowsWithChildren = new Set();
|
|
71
60
|
for (const row of rows) {
|
|
72
61
|
const rowId = row.id;
|
|
73
|
-
|
|
74
|
-
updatedCollapsedRows.add(rowId);
|
|
75
|
-
}
|
|
62
|
+
const isGroupRow = row.getIsGrouped();
|
|
76
63
|
const rowHierarchyOptions = this.hierarchyOptions.get(rowId);
|
|
77
|
-
if (!
|
|
64
|
+
if (!isGroupRow && rowHierarchyOptions) {
|
|
78
65
|
updatedHierarchyOptions.set(rowId, rowHierarchyOptions);
|
|
79
66
|
}
|
|
67
|
+
if (this.isRowExpandable(row)) {
|
|
68
|
+
const expansionState = this.explicitExpansionStates.get(rowId);
|
|
69
|
+
if (expansionState !== undefined) {
|
|
70
|
+
updatedExplicitExpansionStates.set(rowId, expansionState);
|
|
71
|
+
}
|
|
72
|
+
if (!isGroupRow) {
|
|
73
|
+
const hasChildRows = row.subRows.length !== 0;
|
|
74
|
+
if (hasChildRows) {
|
|
75
|
+
updatedParentRowsWithChildren.add(rowId);
|
|
76
|
+
}
|
|
77
|
+
else if (this.parentRowsWithChildren.has(rowId)) {
|
|
78
|
+
// The row used to have children, but now it does not. Therefore,
|
|
79
|
+
// collapse the row.
|
|
80
|
+
updatedExplicitExpansionStates.set(rowId, false);
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}
|
|
80
84
|
}
|
|
81
|
-
this.
|
|
85
|
+
this.explicitExpansionStates = updatedExplicitExpansionStates;
|
|
82
86
|
this.hierarchyOptions = updatedHierarchyOptions;
|
|
87
|
+
this.parentRowsWithChildren = updatedParentRowsWithChildren;
|
|
83
88
|
}
|
|
84
89
|
setHierarchyOptions(hierarchyOptions) {
|
|
85
|
-
|
|
90
|
+
const updatedHierarchyOptions = new Map();
|
|
86
91
|
for (const { recordId, options } of hierarchyOptions) {
|
|
87
|
-
|
|
92
|
+
updatedHierarchyOptions.set(recordId, options);
|
|
93
|
+
const oldState = this.hierarchyOptions.get(recordId)?.delayedHierarchyState;
|
|
94
|
+
const newState = options.delayedHierarchyState;
|
|
95
|
+
if (oldState === TableRecordDelayedHierarchyState.loadingChildren
|
|
96
|
+
&& newState === TableRecordDelayedHierarchyState.canLoadChildren
|
|
97
|
+
&& !this.parentRowsWithChildren.has(recordId)) {
|
|
98
|
+
// If a row without children transitions from loadingChildren to canLoadChildren,
|
|
99
|
+
// put it back in its default state of collapsed.
|
|
100
|
+
this.explicitExpansionStates.delete(recordId);
|
|
101
|
+
}
|
|
88
102
|
}
|
|
103
|
+
this.hierarchyOptions = updatedHierarchyOptions;
|
|
89
104
|
}
|
|
90
105
|
isRowExpandable(row) {
|
|
91
106
|
return row.subRows.length > 0 || this.canLoadDelayedChildren(row.id);
|
|
@@ -107,5 +122,11 @@ export class ExpansionManager {
|
|
|
107
122
|
const delayedHierarchyState = this.hierarchyOptions.get(id)?.delayedHierarchyState;
|
|
108
123
|
return delayedHierarchyState !== TableRecordDelayedHierarchyState.none;
|
|
109
124
|
}
|
|
125
|
+
getDefaultExpansionState(row) {
|
|
126
|
+
// Rows with children (group rows and parent rows with populated children)
|
|
127
|
+
// default to expanded. Other rows (parent rows with lazy-loaded children)
|
|
128
|
+
// default to collapsed.
|
|
129
|
+
return row.subRows.length !== 0;
|
|
130
|
+
}
|
|
110
131
|
}
|
|
111
132
|
//# sourceMappingURL=expansion-manager.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expansion-manager.js","sourceRoot":"","sources":["../../../../src/table/models/expansion-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import type {\n Row as TanStackRow,\n Table as TanStackTable\n} from '@tanstack/table-core';\nimport {\n type TableNode,\n type TableRecord,\n type TableSetRecordHierarchyOptions,\n type TableRecordHierarchyOptions,\n TableRecordDelayedHierarchyState\n} from '../types';\n\n/**\n * Manages the expanded/collapsed state of rows in the table.\n *\n * We must track the expansion state separately from TanStack because:\n * 1. TanStack does not support having a different initial expansion state per row unless explicitly\n * specified for each row by ID. This causes problems in the nimble-table because we could have\n * a different initial expansion state for group rows, parent rows, and parent rows with delay-loaded\n * children.\n * 2. TanStack does not remove entries from its expanded state when those rows are no longer present\n * in the data. This is not ideal because the object maintaining the expansion state can grow unbounded.\n */\nexport class ExpansionManager<TData extends TableRecord> {\n // This field represents whether or not the expanded state of **all** rows is in the default expanded\n // state or not. Note that the default expanded state for a particular row type (group vs parent) can\n // potentially be different (e.g. expanded for groups and collapsed for parent rows).\n private isInDefaultState = true;\n private collapsedRows = new Set<string>();\n private hierarchyOptions = new Map<string, TableRecordHierarchyOptions>();\n private isHierarchyEnabled = false;\n\n public constructor(\n private readonly tanStackTable: TanStackTable<TableNode<TData>>\n ) {}\n\n public isRowExpanded(row: TanStackRow<TableNode<TData>>): boolean {\n if (!this.isRowExpandable(row)) {\n return false;\n }\n\n if (row.subRows.length === 0) {\n return false;\n }\n return this.isInDefaultState || !this.collapsedRows.has(row.id);\n }\n\n public toggleRowExpansion(row: TanStackRow<TableNode<TData>>): void {\n if (!this.isRowExpandable(row)) {\n return;\n }\n\n const wasExpanded = this.isRowExpanded(row);\n this.isInDefaultState = false;\n if (wasExpanded) {\n this.collapsedRows.add(row.id);\n } else {\n this.collapsedRows.delete(row.id);\n }\n\n row.toggleExpanded();\n }\n\n public collapseAll(): void {\n this.resetExpansionState();\n\n this.isInDefaultState = false;\n const rows = this.tanStackTable.getRowModel().flatRows;\n for (const row of rows) {\n if (this.isRowExpandable(row)) {\n this.collapsedRows.add(row.id);\n }\n }\n this.tanStackTable.toggleAllRowsExpanded(false);\n }\n\n public resetExpansionState(): void {\n this.collapsedRows.clear();\n this.isInDefaultState = true;\n }\n\n public resetHierarchyOptions(): void {\n this.hierarchyOptions.clear();\n }\n\n public processDataUpdate(rows: TanStackRow<TableNode<TData>>[]): void {\n if (this.collapsedRows.size === 0 && this.hierarchyOptions.size === 0) {\n return;\n }\n\n const updatedCollapsedRows = new Set<string>();\n const updatedHierarchyOptions = new Map<\n string,\n TableRecordHierarchyOptions\n >();\n for (const row of rows) {\n const rowId = row.id;\n if (this.collapsedRows.has(rowId)) {\n updatedCollapsedRows.add(rowId);\n }\n\n const rowHierarchyOptions = this.hierarchyOptions.get(rowId);\n if (!row.getIsGrouped() && rowHierarchyOptions) {\n updatedHierarchyOptions.set(rowId, rowHierarchyOptions);\n }\n }\n\n this.collapsedRows = updatedCollapsedRows;\n this.hierarchyOptions = updatedHierarchyOptions;\n }\n\n public setHierarchyOptions(\n hierarchyOptions: TableSetRecordHierarchyOptions[]\n ): void {\n this.hierarchyOptions.clear();\n for (const { recordId, options } of hierarchyOptions) {\n this.hierarchyOptions.set(recordId, options);\n }\n }\n\n public isRowExpandable(row: TanStackRow<TableNode<TData>>): boolean {\n return row.subRows.length > 0 || this.canLoadDelayedChildren(row.id);\n }\n\n public setHierarchyEnabled(isHierarchyEnabled: boolean): void {\n this.isHierarchyEnabled = isHierarchyEnabled;\n }\n\n public isLoadingChildren(id: string): boolean {\n if (!this.isHierarchyEnabled) {\n return false;\n }\n\n return (\n this.hierarchyOptions.get(id)?.delayedHierarchyState\n === TableRecordDelayedHierarchyState.loadingChildren ?? false\n );\n }\n\n private canLoadDelayedChildren(id: string): boolean {\n if (!this.isHierarchyEnabled) {\n return false;\n }\n\n const delayedHierarchyState = this.hierarchyOptions.get(id)?.delayedHierarchyState;\n return delayedHierarchyState !== TableRecordDelayedHierarchyState.none;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"expansion-manager.js","sourceRoot":"","sources":["../../../../src/table/models/expansion-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import type {\n Row as TanStackRow,\n Table as TanStackTable\n} from '@tanstack/table-core';\nimport {\n type TableNode,\n type TableRecord,\n type TableSetRecordHierarchyOptions,\n type TableRecordHierarchyOptions,\n TableRecordDelayedHierarchyState\n} from '../types';\n\n/**\n * Manages the expanded/collapsed state of rows in the table.\n *\n * We must track the expansion state separately from TanStack because:\n * 1. TanStack does not support having a different initial expansion state per row unless explicitly\n * specified for each row by ID. This causes problems in the nimble-table because we could have\n * a different initial expansion state for group rows, parent rows, and parent rows with delay-loaded\n * children.\n * 2. TanStack does not remove entries from its expanded state when those rows are no longer present\n * in the data. This is not ideal because the object maintaining the expansion state can grow unbounded.\n */\nexport class ExpansionManager<TData extends TableRecord> {\n private explicitExpansionStates = new Map<string, boolean>();\n private hierarchyOptions = new Map<string, TableRecordHierarchyOptions>();\n private isHierarchyEnabled = false;\n private parentRowsWithChildren = new Set<string>();\n\n public constructor(\n private readonly tanStackTable: TanStackTable<TableNode<TData>>\n ) {}\n\n public isRowExpanded(row: TanStackRow<TableNode<TData>>): boolean {\n if (!this.isRowExpandable(row)) {\n return false;\n }\n\n const expansionState = this.explicitExpansionStates.get(row.id);\n return expansionState ?? this.getDefaultExpansionState(row);\n }\n\n public toggleRowExpansion(row: TanStackRow<TableNode<TData>>): void {\n if (!this.isRowExpandable(row)) {\n return;\n }\n\n const wasExpanded = this.isRowExpanded(row);\n this.explicitExpansionStates.set(row.id, !wasExpanded);\n\n row.toggleExpanded();\n }\n\n public collapseAll(): void {\n this.resetExpansionState();\n\n const rows = this.tanStackTable.getRowModel().flatRows;\n for (const row of rows) {\n if (this.isRowExpandable(row)) {\n this.explicitExpansionStates.set(row.id, false);\n }\n }\n this.tanStackTable.toggleAllRowsExpanded(false);\n }\n\n public resetExpansionState(): void {\n this.explicitExpansionStates.clear();\n }\n\n public resetHierarchyOptions(): void {\n this.hierarchyOptions.clear();\n }\n\n public processDataUpdate(rows: TanStackRow<TableNode<TData>>[]): void {\n if (\n this.explicitExpansionStates.size === 0\n && this.hierarchyOptions.size === 0\n ) {\n return;\n }\n\n const updatedExplicitExpansionStates = new Map<string, boolean>();\n const updatedHierarchyOptions = new Map<\n string,\n TableRecordHierarchyOptions\n >();\n const updatedParentRowsWithChildren = new Set<string>();\n for (const row of rows) {\n const rowId = row.id;\n const isGroupRow = row.getIsGrouped();\n const rowHierarchyOptions = this.hierarchyOptions.get(rowId);\n if (!isGroupRow && rowHierarchyOptions) {\n updatedHierarchyOptions.set(rowId, rowHierarchyOptions);\n }\n\n if (this.isRowExpandable(row)) {\n const expansionState = this.explicitExpansionStates.get(rowId);\n if (expansionState !== undefined) {\n updatedExplicitExpansionStates.set(rowId, expansionState);\n }\n\n if (!isGroupRow) {\n const hasChildRows = row.subRows.length !== 0;\n if (hasChildRows) {\n updatedParentRowsWithChildren.add(rowId);\n } else if (this.parentRowsWithChildren.has(rowId)) {\n // The row used to have children, but now it does not. Therefore,\n // collapse the row.\n updatedExplicitExpansionStates.set(rowId, false);\n }\n }\n }\n }\n\n this.explicitExpansionStates = updatedExplicitExpansionStates;\n this.hierarchyOptions = updatedHierarchyOptions;\n this.parentRowsWithChildren = updatedParentRowsWithChildren;\n }\n\n public setHierarchyOptions(\n hierarchyOptions: TableSetRecordHierarchyOptions[]\n ): void {\n const updatedHierarchyOptions = new Map<\n string,\n TableRecordHierarchyOptions\n >();\n for (const { recordId, options } of hierarchyOptions) {\n updatedHierarchyOptions.set(recordId, options);\n\n const oldState = this.hierarchyOptions.get(recordId)?.delayedHierarchyState;\n const newState = options.delayedHierarchyState;\n if (\n oldState === TableRecordDelayedHierarchyState.loadingChildren\n && newState === TableRecordDelayedHierarchyState.canLoadChildren\n && !this.parentRowsWithChildren.has(recordId)\n ) {\n // If a row without children transitions from loadingChildren to canLoadChildren,\n // put it back in its default state of collapsed.\n this.explicitExpansionStates.delete(recordId);\n }\n }\n this.hierarchyOptions = updatedHierarchyOptions;\n }\n\n public isRowExpandable(row: TanStackRow<TableNode<TData>>): boolean {\n return row.subRows.length > 0 || this.canLoadDelayedChildren(row.id);\n }\n\n public setHierarchyEnabled(isHierarchyEnabled: boolean): void {\n this.isHierarchyEnabled = isHierarchyEnabled;\n }\n\n public isLoadingChildren(id: string): boolean {\n if (!this.isHierarchyEnabled) {\n return false;\n }\n\n return (\n this.hierarchyOptions.get(id)?.delayedHierarchyState\n === TableRecordDelayedHierarchyState.loadingChildren ?? false\n );\n }\n\n private canLoadDelayedChildren(id: string): boolean {\n if (!this.isHierarchyEnabled) {\n return false;\n }\n\n const delayedHierarchyState = this.hierarchyOptions.get(id)?.delayedHierarchyState;\n return delayedHierarchyState !== TableRecordDelayedHierarchyState.none;\n }\n\n private getDefaultExpansionState(\n row: TanStackRow<TableNode<TData>>\n ): boolean {\n // Rows with children (group rows and parent rows with populated children)\n // default to expanded. Other rows (parent rows with lazy-loaded children)\n // default to collapsed.\n return row.subRows.length !== 0;\n }\n}\n"]}
|
|
@@ -24,7 +24,7 @@ export const template = html `
|
|
|
24
24
|
target="${x => x.columnConfig?.target}"
|
|
25
25
|
type="${x => x.columnConfig?.type}"
|
|
26
26
|
download="${x => x.columnConfig?.download}"
|
|
27
|
-
underline-hidden="${x => x.columnConfig?.underlineHidden}"
|
|
27
|
+
?underline-hidden="${x => x.columnConfig?.underlineHidden}"
|
|
28
28
|
appearance="${x => x.columnConfig?.appearance}"
|
|
29
29
|
title=${x => (x.hasOverflow ? x.text : null)}
|
|
30
30
|
>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table-column/anchor/cell-view/template.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AAEjE,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAA2B;;kBAErC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;IACf,IAAI,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE;QACxC,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;KAC7B;IACD,OAAO,IAAI,CAAC;AAChB,CAAC;;UAEC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE,IAAI,CAA2B;eAC5E,SAAS;kBACN,GAAG,CAAC,QAAQ,CAAC;kBACb,QAAQ,CAAC,aAAa,CAAC;wBACjB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI;4BACnB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;wBACjC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;kCACf,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,cAAc;uBAC9C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,GAAG;0BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,MAAM;wBAC7B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;4BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;
|
|
1
|
+
{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table-column/anchor/cell-view/template.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AAEjE,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAA2B;;kBAErC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;IACf,IAAI,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE;QACxC,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;KAC7B;IACD,OAAO,IAAI,CAAC;AAChB,CAAC;;UAEC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE,IAAI,CAA2B;eAC5E,SAAS;kBACN,GAAG,CAAC,QAAQ,CAAC;kBACb,QAAQ,CAAC,aAAa,CAAC;wBACjB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI;4BACnB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;wBACjC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;kCACf,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,cAAc;uBAC9C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,GAAG;0BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,MAAM;wBAC7B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;4BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;qCACpB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,eAAe;8BAC3C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,UAAU;wBACrC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;;kBAE1C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;gBACb,SAAS,GAAG,CAAC;UACnB,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE,IAAI,CAA2B;;kBAEzE,QAAQ,CAAC,aAAa,CAAC;wBACjB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;;kBAE1C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;oBACT,CAAC;;CAEpB,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/indent */\nimport { html, ref, when } from '@microsoft/fast-element';\nimport type { TableColumnAnchorCellView } from '.';\nimport { anchorTag } from '../../../anchor';\nimport { overflow } from '../../../utilities/directive/overflow';\n\n// prettier-ignore\nexport const template = html<TableColumnAnchorCellView>`\n <template\n @click=\"${(x, c) => {\n if (typeof x.cellRecord?.href === 'string') {\n c.event.stopPropagation();\n }\n return true;\n }}\"\n >\n ${when(x => typeof x.cellRecord?.href === 'string', html<TableColumnAnchorCellView>`\n <${anchorTag}\n ${ref('anchor')}\n ${overflow('hasOverflow')}\n href=\"${x => x.cellRecord?.href}\"\n hreflang=\"${x => x.columnConfig?.hreflang}\"\n ping=\"${x => x.columnConfig?.ping}\"\n referrerpolicy=\"${x => x.columnConfig?.referrerpolicy}\"\n rel=\"${x => x.columnConfig?.rel}\"\n target=\"${x => x.columnConfig?.target}\"\n type=\"${x => x.columnConfig?.type}\"\n download=\"${x => x.columnConfig?.download}\"\n ?underline-hidden=\"${x => x.columnConfig?.underlineHidden}\"\n appearance=\"${x => x.columnConfig?.appearance}\"\n title=${x => (x.hasOverflow ? x.text : null)}\n >\n ${x => x.text}\n </${anchorTag}>`)}\n ${when(x => typeof x.cellRecord?.href !== 'string', html<TableColumnAnchorCellView>`\n <span\n ${overflow('hasOverflow')}\n title=${x => (x.hasOverflow ? x.text : null)}\n >\n ${x => x.text}\n </span>`)}\n </template>\n`;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ni/nimble-components",
|
|
3
|
-
"version": "21.5.
|
|
3
|
+
"version": "21.5.3",
|
|
4
4
|
"description": "Styled web components for the NI Nimble Design System",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",
|