@ni/nimble-components 30.0.0 → 30.0.2
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 +29 -73
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +16 -29
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/table/components/row/index.d.ts +0 -1
- package/dist/esm/table/components/row/index.js +1 -9
- package/dist/esm/table/components/row/index.js.map +1 -1
- package/dist/esm/table/index.d.ts +4 -9
- package/dist/esm/table/index.js +23 -39
- package/dist/esm/table/index.js.map +1 -1
- package/dist/esm/table/models/keyboard-navigation-manager.d.ts +0 -1
- package/dist/esm/table/models/keyboard-navigation-manager.js +4 -8
- package/dist/esm/table/models/keyboard-navigation-manager.js.map +1 -1
- package/dist/esm/table/models/virtualizer.js +0 -1
- package/dist/esm/table/models/virtualizer.js.map +1 -1
- package/dist/esm/table/template.js +1 -9
- package/dist/esm/table/template.js.map +1 -1
- package/dist/esm/table/types.d.ts +1 -1
- package/dist/esm/table/types.js.map +1 -1
- package/dist/esm/table-column/anchor/cell-view/index.d.ts +0 -1
- package/dist/esm/table-column/anchor/cell-view/index.js +0 -3
- package/dist/esm/table-column/anchor/cell-view/index.js.map +1 -1
- package/dist/esm/table-column/base/cell-view/index.d.ts +0 -6
- package/dist/esm/table-column/base/cell-view/index.js +0 -6
- package/dist/esm/table-column/base/cell-view/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -78,7 +78,6 @@ export declare class TableRow<TDataRecord extends TableDataRecord = TableDataRec
|
|
|
78
78
|
onCellActionMenuBeforeToggle(event: CustomEvent<MenuButtonToggleEventDetail>, column: TableColumn): void;
|
|
79
79
|
/** @internal */
|
|
80
80
|
onCellActionMenuToggle(event: CustomEvent<MenuButtonToggleEventDetail>, column: TableColumn): void;
|
|
81
|
-
closeOpenActionMenus(): void;
|
|
82
81
|
/** @internal */
|
|
83
82
|
handleChange(source: unknown, args: unknown): void;
|
|
84
83
|
/** @internal */
|
|
@@ -3,7 +3,7 @@ import { Observable, attr, observable, volatile } from '@microsoft/fast-element'
|
|
|
3
3
|
import { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';
|
|
4
4
|
import { styles } from './styles';
|
|
5
5
|
import { template } from './template';
|
|
6
|
-
import {
|
|
6
|
+
import { tableCellTag } from '../cell';
|
|
7
7
|
import { ColumnInternals, isColumnInternalsProperty } from '../../../table-column/base/models/column-internals';
|
|
8
8
|
/**
|
|
9
9
|
* A styled row that is used within the nimble-table.
|
|
@@ -96,14 +96,6 @@ export class TableRow extends FoundationElement {
|
|
|
96
96
|
this.menuOpen = event.detail.newState;
|
|
97
97
|
this.emitActionMenuToggleEvent('row-action-menu-toggle', event.detail, column);
|
|
98
98
|
}
|
|
99
|
-
closeOpenActionMenus() {
|
|
100
|
-
if (this.menuOpen) {
|
|
101
|
-
const cellWithMenuOpen = Array.from(this.cellContainer.children).find(c => c instanceof TableCell && c.menuOpen);
|
|
102
|
-
if (cellWithMenuOpen?.actionMenuButton?.open) {
|
|
103
|
-
cellWithMenuOpen.actionMenuButton.toggleButton.control.click();
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
99
|
/** @internal */
|
|
108
100
|
handleChange(source, args) {
|
|
109
101
|
if (source instanceof ColumnInternals
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/row/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Notifier,\n Observable,\n attr,\n observable,\n volatile\n} from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport { styles } from './styles';\nimport { template } from './template';\nimport type { TableCellState } from '../../../table-column/base/types';\nimport type {\n CellViewSlotRequestEventDetail,\n RowSlotRequestEventDetail,\n TableActionMenuToggleEventDetail,\n TableFieldName,\n TableRecord,\n TableRowExpansionToggleEventDetail,\n TableRowFocusableElements,\n TableRowSelectionToggleEventDetail\n} from '../../types';\nimport type { TableColumn } from '../../../table-column/base';\nimport type { MenuButtonToggleEventDetail } from '../../../menu-button/types';\nimport { TableCell, tableCellTag } from '../cell';\nimport {\n ColumnInternals,\n isColumnInternalsProperty\n} from '../../../table-column/base/models/column-internals';\nimport type { Checkbox } from '../../../checkbox';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-table-row': TableRow;\n }\n}\n\n/** Represents a single row (element) in the Table's data */\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface TableDataRecord extends TableRecord {}\n\n/**\n * A styled row that is used within the nimble-table.\n * @internal\n */\nexport class TableRow<\n TDataRecord extends TableDataRecord = TableDataRecord\n> extends FoundationElement {\n @attr({ attribute: 'record-id' })\n public recordId?: string;\n\n @attr({ mode: 'boolean' })\n public selectable = false;\n\n @attr({ mode: 'boolean' })\n public selected = false;\n\n @attr({ attribute: 'hide-selection', mode: 'boolean' })\n public hideSelection = false;\n\n @attr({ mode: 'boolean' })\n public expanded = false;\n\n @observable\n public dataRecord?: TDataRecord;\n\n /**\n * @internal\n * */\n public columnNotifiers: Notifier[] = [];\n\n @observable\n public columns: TableColumn[] = [];\n\n @observable\n public currentActionMenuColumn?: TableColumn;\n\n @observable\n public nestingLevel = 0;\n\n /**\n * Row index in the flattened set of all regular and group header rows.\n * Represents the index in table.tableData (TableRowState[]).\n */\n @observable\n public resolvedRowIndex?: number;\n\n @attr({ attribute: 'is-parent-row', mode: 'boolean' })\n public isParentRow = false;\n\n @attr({ attribute: 'menu-open', mode: 'boolean' })\n public menuOpen = false;\n\n @attr({ attribute: 'row-operation-grid-cell-hidden', mode: 'boolean' })\n public rowOperationGridCellHidden = false;\n\n @attr({ mode: 'boolean' })\n public loading = false;\n\n /**\n * @internal\n * An array that parallels the `columns` array and contains the indent\n * level of each column's cell.\n * */\n @observable\n public cellIndentLevels: number[] = [];\n\n /**\n * @internal\n * An array that parallels the `columns` array and contains the cell state\n * of each column's cell.\n * */\n @observable\n public cellStates: (TableCellState | undefined)[] = [];\n\n /** @internal */\n @observable\n public readonly selectionCheckbox?: Checkbox;\n\n /** @internal */\n public readonly cellContainer!: HTMLSpanElement;\n\n /**\n * @internal\n */\n public readonly expandIcon?: HTMLElement;\n\n /**\n * @internal\n */\n @observable\n public animationClass = '';\n\n @volatile\n public get isTopLevelParentRow(): boolean {\n return this.isParentRow && this.nestingLevel === 0;\n }\n\n @volatile\n public get isNestedParent(): boolean {\n return this.isParentRow && this.nestingLevel > 0;\n }\n\n /** @internal */\n @volatile\n public get showSelectionCheckbox(): boolean {\n return this.selectable && !this.hideSelection;\n }\n\n // Programmatically updating the selection state of a checkbox fires the 'change' event.\n // Therefore, selection change events that occur due to programmatically updating\n // the selection checkbox 'checked' value should be ingored.\n // https://github.com/microsoft/fast/issues/5750\n private ignoreSelectionChangeEvents = false;\n\n @volatile\n public override get ariaSelected(): 'true' | 'false' | null {\n if (this.selectable) {\n return this.selected ? 'true' : 'false';\n }\n\n return null;\n }\n\n /** @internal */\n public onSelectionCheckboxChange(event: CustomEvent): void {\n if (this.ignoreSelectionChangeEvents) {\n return;\n }\n\n const checkbox = event.target as Checkbox;\n const checked = checkbox.checked;\n this.onSelectionChange(!checked, checked);\n }\n\n /** @internal */\n public onSelectionChange(oldState: boolean, newState: boolean): void {\n this.selected = newState;\n const detail: TableRowSelectionToggleEventDetail = {\n oldState,\n newState\n };\n this.$emit('row-selection-toggle', detail);\n }\n\n /** @internal */\n public onCellActionMenuBeforeToggle(\n event: CustomEvent<MenuButtonToggleEventDetail>,\n column: TableColumn\n ): void {\n this.currentActionMenuColumn = column;\n this.emitActionMenuToggleEvent(\n 'row-action-menu-beforetoggle',\n event.detail,\n column\n );\n }\n\n /** @internal */\n public onCellActionMenuToggle(\n event: CustomEvent<MenuButtonToggleEventDetail>,\n column: TableColumn\n ): void {\n this.menuOpen = event.detail.newState;\n this.emitActionMenuToggleEvent(\n 'row-action-menu-toggle',\n event.detail,\n column\n );\n }\n\n public closeOpenActionMenus(): void {\n if (this.menuOpen) {\n const cellWithMenuOpen = Array.from(\n this.cellContainer.children\n ).find(c => c instanceof TableCell && c.menuOpen) as TableCell;\n if (cellWithMenuOpen?.actionMenuButton?.open) {\n cellWithMenuOpen.actionMenuButton.toggleButton!.control.click();\n }\n }\n }\n\n /** @internal */\n public handleChange(source: unknown, args: unknown): void {\n if (\n source instanceof ColumnInternals\n && typeof args === 'string'\n && (isColumnInternalsProperty(args, 'columnConfig')\n || isColumnInternalsProperty(args, 'dataRecordFieldNames'))\n ) {\n this.updateCellStates();\n }\n }\n\n /** @internal */\n public getFocusableElements(): TableRowFocusableElements {\n return {\n selectionCheckbox: this.showSelectionCheckbox\n ? this.selectionCheckbox\n : undefined,\n cells: Array.from(\n this.cellContainer.querySelectorAll(tableCellTag)\n ).map(cell => ({\n cell,\n actionMenuButton: cell.hasActionMenu\n ? cell.actionMenuButton\n : undefined\n }))\n };\n }\n\n public onRowExpandToggle(event?: Event): void {\n const expandEventDetail: TableRowExpansionToggleEventDetail = {\n oldState: this.expanded,\n newState: !this.expanded,\n recordId: this.recordId!\n };\n this.$emit('row-expand-toggle', expandEventDetail);\n event?.stopImmediatePropagation();\n // To avoid a visual glitch with improper expand/collapse icons performing an\n // animation (due to visual re-use apparently), we apply a class to the\n // contained expand-collapse button temporarily. We use the 'transitionend' event\n // to remove the temporary class and register a function reference as the handler\n // to avoid issues that may result from the 'transitionend' event not firing, as it\n // will never result in multiple event listeners being registered.\n this.animationClass = 'animating';\n this.expandIcon?.addEventListener(\n 'transitionend',\n this.removeAnimatingClass\n );\n }\n\n public onCellViewSlotsRequest(\n column: TableColumn,\n event: CustomEvent<CellViewSlotRequestEventDetail>\n ): void {\n event.stopImmediatePropagation();\n if (typeof this.recordId !== 'string') {\n // The recordId is expected to be defined on any row that can be interacted with, but if\n // it isn't defined, nothing can be done with the request to slot content into the row.\n return;\n }\n\n const eventDetails: RowSlotRequestEventDetail = {\n recordId: this.recordId,\n columnInternalId: column.columnInternals.uniqueId,\n slots: event.detail.slots\n };\n this.$emit('row-slots-request', eventDetails);\n }\n\n private readonly removeAnimatingClass = (): void => {\n this.animationClass = '';\n this.expandIcon?.removeEventListener(\n 'transitionend',\n this.removeAnimatingClass\n );\n };\n\n private emitActionMenuToggleEvent(\n eventType: string,\n menuButtonEventDetail: MenuButtonToggleEventDetail,\n column: TableColumn\n ): void {\n const detail: TableActionMenuToggleEventDetail = {\n newState: menuButtonEventDetail.newState,\n oldState: menuButtonEventDetail.oldState,\n recordIds: [this.recordId!],\n columnId: column.columnId\n };\n this.$emit(eventType, detail);\n }\n\n private columnsChanged(): void {\n this.updateCellIndentLevels();\n this.updateCellStates();\n\n this.observeColumns();\n }\n\n private dataRecordChanged(): void {\n this.updateCellStates();\n }\n\n private nestingLevelChanged(): void {\n this.updateCellIndentLevels();\n }\n\n private updateCellIndentLevels(): void {\n this.cellIndentLevels = this.columns.map((_, i) => {\n return i === 0 ? this.nestingLevel : 0;\n });\n }\n\n private removeColumnObservers(): void {\n this.columnNotifiers.forEach(notifier => {\n notifier.unsubscribe(this);\n });\n this.columnNotifiers = [];\n }\n\n private observeColumns(): void {\n this.removeColumnObservers();\n\n this.columnNotifiers = this.columns.map(column => {\n const notifier = Observable.getNotifier(column.columnInternals);\n notifier.subscribe(this);\n return notifier;\n });\n }\n\n private updateCellStates(): void {\n this.cellStates = this.columns.map(column => {\n const fieldNames = column.columnInternals.dataRecordFieldNames;\n let cellState: TableCellState | undefined;\n if (this.hasValidFieldNames(fieldNames) && this.dataRecord) {\n const cellDataValues = fieldNames.map(\n field => this.dataRecord![field]\n );\n const cellRecord = Object.fromEntries(\n column.columnInternals.cellRecordFieldNames.map((k, j) => [\n k,\n cellDataValues[j]\n ])\n );\n const columnConfig = column.columnInternals.columnConfig;\n cellState = {\n cellRecord,\n columnConfig\n };\n }\n return cellState;\n });\n }\n\n private hasValidFieldNames(\n keys: readonly (TableFieldName | undefined)[]\n ): keys is TableFieldName[] {\n return keys.every(key => key !== undefined);\n }\n\n private selectedChanged(): void {\n this.setSelectionCheckboxState();\n }\n\n private selectionCheckboxChanged(): void {\n this.setSelectionCheckboxState();\n }\n\n private setSelectionCheckboxState(): void {\n if (this.selectionCheckbox) {\n this.ignoreSelectionChangeEvents = true;\n this.selectionCheckbox.checked = this.selected;\n this.ignoreSelectionChangeEvents = false;\n }\n }\n}\n\nconst nimbleTableRow = TableRow.compose({\n baseName: 'table-row',\n template,\n styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableRow());\nexport const tableRowTag = 'nimble-table-row';\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/table/components/row/index.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Notifier,\n Observable,\n attr,\n observable,\n volatile\n} from '@microsoft/fast-element';\nimport { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';\nimport { styles } from './styles';\nimport { template } from './template';\nimport type { TableCellState } from '../../../table-column/base/types';\nimport type {\n CellViewSlotRequestEventDetail,\n RowSlotRequestEventDetail,\n TableActionMenuToggleEventDetail,\n TableFieldName,\n TableRecord,\n TableRowExpansionToggleEventDetail,\n TableRowFocusableElements,\n TableRowSelectionToggleEventDetail\n} from '../../types';\nimport type { TableColumn } from '../../../table-column/base';\nimport type { MenuButtonToggleEventDetail } from '../../../menu-button/types';\nimport { tableCellTag } from '../cell';\nimport {\n ColumnInternals,\n isColumnInternalsProperty\n} from '../../../table-column/base/models/column-internals';\nimport type { Checkbox } from '../../../checkbox';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-table-row': TableRow;\n }\n}\n\n/** Represents a single row (element) in the Table's data */\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface TableDataRecord extends TableRecord {}\n\n/**\n * A styled row that is used within the nimble-table.\n * @internal\n */\nexport class TableRow<\n TDataRecord extends TableDataRecord = TableDataRecord\n> extends FoundationElement {\n @attr({ attribute: 'record-id' })\n public recordId?: string;\n\n @attr({ mode: 'boolean' })\n public selectable = false;\n\n @attr({ mode: 'boolean' })\n public selected = false;\n\n @attr({ attribute: 'hide-selection', mode: 'boolean' })\n public hideSelection = false;\n\n @attr({ mode: 'boolean' })\n public expanded = false;\n\n @observable\n public dataRecord?: TDataRecord;\n\n /**\n * @internal\n * */\n public columnNotifiers: Notifier[] = [];\n\n @observable\n public columns: TableColumn[] = [];\n\n @observable\n public currentActionMenuColumn?: TableColumn;\n\n @observable\n public nestingLevel = 0;\n\n /**\n * Row index in the flattened set of all regular and group header rows.\n * Represents the index in table.tableData (TableRowState[]).\n */\n @observable\n public resolvedRowIndex?: number;\n\n @attr({ attribute: 'is-parent-row', mode: 'boolean' })\n public isParentRow = false;\n\n @attr({ attribute: 'menu-open', mode: 'boolean' })\n public menuOpen = false;\n\n @attr({ attribute: 'row-operation-grid-cell-hidden', mode: 'boolean' })\n public rowOperationGridCellHidden = false;\n\n @attr({ mode: 'boolean' })\n public loading = false;\n\n /**\n * @internal\n * An array that parallels the `columns` array and contains the indent\n * level of each column's cell.\n * */\n @observable\n public cellIndentLevels: number[] = [];\n\n /**\n * @internal\n * An array that parallels the `columns` array and contains the cell state\n * of each column's cell.\n * */\n @observable\n public cellStates: (TableCellState | undefined)[] = [];\n\n /** @internal */\n @observable\n public readonly selectionCheckbox?: Checkbox;\n\n /** @internal */\n public readonly cellContainer!: HTMLSpanElement;\n\n /**\n * @internal\n */\n public readonly expandIcon?: HTMLElement;\n\n /**\n * @internal\n */\n @observable\n public animationClass = '';\n\n @volatile\n public get isTopLevelParentRow(): boolean {\n return this.isParentRow && this.nestingLevel === 0;\n }\n\n @volatile\n public get isNestedParent(): boolean {\n return this.isParentRow && this.nestingLevel > 0;\n }\n\n /** @internal */\n @volatile\n public get showSelectionCheckbox(): boolean {\n return this.selectable && !this.hideSelection;\n }\n\n // Programmatically updating the selection state of a checkbox fires the 'change' event.\n // Therefore, selection change events that occur due to programmatically updating\n // the selection checkbox 'checked' value should be ingored.\n // https://github.com/microsoft/fast/issues/5750\n private ignoreSelectionChangeEvents = false;\n\n @volatile\n public override get ariaSelected(): 'true' | 'false' | null {\n if (this.selectable) {\n return this.selected ? 'true' : 'false';\n }\n\n return null;\n }\n\n /** @internal */\n public onSelectionCheckboxChange(event: CustomEvent): void {\n if (this.ignoreSelectionChangeEvents) {\n return;\n }\n\n const checkbox = event.target as Checkbox;\n const checked = checkbox.checked;\n this.onSelectionChange(!checked, checked);\n }\n\n /** @internal */\n public onSelectionChange(oldState: boolean, newState: boolean): void {\n this.selected = newState;\n const detail: TableRowSelectionToggleEventDetail = {\n oldState,\n newState\n };\n this.$emit('row-selection-toggle', detail);\n }\n\n /** @internal */\n public onCellActionMenuBeforeToggle(\n event: CustomEvent<MenuButtonToggleEventDetail>,\n column: TableColumn\n ): void {\n this.currentActionMenuColumn = column;\n this.emitActionMenuToggleEvent(\n 'row-action-menu-beforetoggle',\n event.detail,\n column\n );\n }\n\n /** @internal */\n public onCellActionMenuToggle(\n event: CustomEvent<MenuButtonToggleEventDetail>,\n column: TableColumn\n ): void {\n this.menuOpen = event.detail.newState;\n this.emitActionMenuToggleEvent(\n 'row-action-menu-toggle',\n event.detail,\n column\n );\n }\n\n /** @internal */\n public handleChange(source: unknown, args: unknown): void {\n if (\n source instanceof ColumnInternals\n && typeof args === 'string'\n && (isColumnInternalsProperty(args, 'columnConfig')\n || isColumnInternalsProperty(args, 'dataRecordFieldNames'))\n ) {\n this.updateCellStates();\n }\n }\n\n /** @internal */\n public getFocusableElements(): TableRowFocusableElements {\n return {\n selectionCheckbox: this.showSelectionCheckbox\n ? this.selectionCheckbox\n : undefined,\n cells: Array.from(\n this.cellContainer.querySelectorAll(tableCellTag)\n ).map(cell => ({\n cell,\n actionMenuButton: cell.hasActionMenu\n ? cell.actionMenuButton\n : undefined\n }))\n };\n }\n\n public onRowExpandToggle(event?: Event): void {\n const expandEventDetail: TableRowExpansionToggleEventDetail = {\n oldState: this.expanded,\n newState: !this.expanded,\n recordId: this.recordId!\n };\n this.$emit('row-expand-toggle', expandEventDetail);\n event?.stopImmediatePropagation();\n // To avoid a visual glitch with improper expand/collapse icons performing an\n // animation (due to visual re-use apparently), we apply a class to the\n // contained expand-collapse button temporarily. We use the 'transitionend' event\n // to remove the temporary class and register a function reference as the handler\n // to avoid issues that may result from the 'transitionend' event not firing, as it\n // will never result in multiple event listeners being registered.\n this.animationClass = 'animating';\n this.expandIcon?.addEventListener(\n 'transitionend',\n this.removeAnimatingClass\n );\n }\n\n public onCellViewSlotsRequest(\n column: TableColumn,\n event: CustomEvent<CellViewSlotRequestEventDetail>\n ): void {\n event.stopImmediatePropagation();\n if (typeof this.recordId !== 'string') {\n // The recordId is expected to be defined on any row that can be interacted with, but if\n // it isn't defined, nothing can be done with the request to slot content into the row.\n return;\n }\n\n const eventDetails: RowSlotRequestEventDetail = {\n recordId: this.recordId,\n columnInternalId: column.columnInternals.uniqueId,\n slots: event.detail.slots\n };\n this.$emit('row-slots-request', eventDetails);\n }\n\n private readonly removeAnimatingClass = (): void => {\n this.animationClass = '';\n this.expandIcon?.removeEventListener(\n 'transitionend',\n this.removeAnimatingClass\n );\n };\n\n private emitActionMenuToggleEvent(\n eventType: string,\n menuButtonEventDetail: MenuButtonToggleEventDetail,\n column: TableColumn\n ): void {\n const detail: TableActionMenuToggleEventDetail = {\n newState: menuButtonEventDetail.newState,\n oldState: menuButtonEventDetail.oldState,\n recordIds: [this.recordId!],\n columnId: column.columnId\n };\n this.$emit(eventType, detail);\n }\n\n private columnsChanged(): void {\n this.updateCellIndentLevels();\n this.updateCellStates();\n\n this.observeColumns();\n }\n\n private dataRecordChanged(): void {\n this.updateCellStates();\n }\n\n private nestingLevelChanged(): void {\n this.updateCellIndentLevels();\n }\n\n private updateCellIndentLevels(): void {\n this.cellIndentLevels = this.columns.map((_, i) => {\n return i === 0 ? this.nestingLevel : 0;\n });\n }\n\n private removeColumnObservers(): void {\n this.columnNotifiers.forEach(notifier => {\n notifier.unsubscribe(this);\n });\n this.columnNotifiers = [];\n }\n\n private observeColumns(): void {\n this.removeColumnObservers();\n\n this.columnNotifiers = this.columns.map(column => {\n const notifier = Observable.getNotifier(column.columnInternals);\n notifier.subscribe(this);\n return notifier;\n });\n }\n\n private updateCellStates(): void {\n this.cellStates = this.columns.map(column => {\n const fieldNames = column.columnInternals.dataRecordFieldNames;\n let cellState: TableCellState | undefined;\n if (this.hasValidFieldNames(fieldNames) && this.dataRecord) {\n const cellDataValues = fieldNames.map(\n field => this.dataRecord![field]\n );\n const cellRecord = Object.fromEntries(\n column.columnInternals.cellRecordFieldNames.map((k, j) => [\n k,\n cellDataValues[j]\n ])\n );\n const columnConfig = column.columnInternals.columnConfig;\n cellState = {\n cellRecord,\n columnConfig\n };\n }\n return cellState;\n });\n }\n\n private hasValidFieldNames(\n keys: readonly (TableFieldName | undefined)[]\n ): keys is TableFieldName[] {\n return keys.every(key => key !== undefined);\n }\n\n private selectedChanged(): void {\n this.setSelectionCheckboxState();\n }\n\n private selectionCheckboxChanged(): void {\n this.setSelectionCheckboxState();\n }\n\n private setSelectionCheckboxState(): void {\n if (this.selectionCheckbox) {\n this.ignoreSelectionChangeEvents = true;\n this.selectionCheckbox.checked = this.selected;\n this.ignoreSelectionChangeEvents = false;\n }\n }\n}\n\nconst nimbleTableRow = TableRow.compose({\n baseName: 'table-row',\n template,\n styles\n});\n\nDesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableRow());\nexport const tableRowTag = 'nimble-table-row';\n"]}
|
|
@@ -4,7 +4,7 @@ import { TableColumn } from '../table-column/base';
|
|
|
4
4
|
import { TableNode, TableActionMenuToggleEventDetail, TableRecord, TableRowSelectionMode, TableRowSelectionState, TableRowSelectionToggleEventDetail, TableRowState, TableValidity, TableSetRecordHierarchyOptions, RowSlotRequestEventDetail } from './types';
|
|
5
5
|
import { Virtualizer } from './models/virtualizer';
|
|
6
6
|
import { TableLayoutManager } from './models/table-layout-manager';
|
|
7
|
-
import { TableRow } from './components/row';
|
|
7
|
+
import type { TableRow } from './components/row';
|
|
8
8
|
import type { TableGroupRow } from './components/group-row';
|
|
9
9
|
import { KeyboardNavigationManager } from './models/keyboard-navigation-manager';
|
|
10
10
|
declare global {
|
|
@@ -35,10 +35,6 @@ export declare class Table<TData extends TableRecord = TableRecord> extends Foun
|
|
|
35
35
|
* @internal
|
|
36
36
|
*/
|
|
37
37
|
readonly rowElements: (TableRow | TableGroupRow)[];
|
|
38
|
-
/**
|
|
39
|
-
* @internal
|
|
40
|
-
*/
|
|
41
|
-
actionMenuSlots: string[];
|
|
42
38
|
/**
|
|
43
39
|
* @internal
|
|
44
40
|
*/
|
|
@@ -130,7 +126,8 @@ export declare class Table<TData extends TableRecord = TableRecord> extends Foun
|
|
|
130
126
|
private readonly layoutManagerNotifier;
|
|
131
127
|
private isInitialized;
|
|
132
128
|
private ignoreSelectionChangeEvents;
|
|
133
|
-
private readonly
|
|
129
|
+
private readonly requestedSlots;
|
|
130
|
+
private actionMenuSlots;
|
|
134
131
|
constructor();
|
|
135
132
|
setData(newData: readonly TData[]): Promise<void>;
|
|
136
133
|
getSelectedRecordIds(): Promise<string[]>;
|
|
@@ -198,13 +195,11 @@ export declare class Table<TData extends TableRecord = TableRecord> extends Foun
|
|
|
198
195
|
* @internal
|
|
199
196
|
*/
|
|
200
197
|
calculateTanStackData(data: readonly TData[]): Partial<TanStackTableOptionsResolved<TableNode<TData>>>;
|
|
201
|
-
/** @internal */
|
|
202
|
-
handleFocusedCellRecycling(): void;
|
|
203
198
|
protected selectionModeChanged(_prev: string | undefined, _next: string | undefined): void;
|
|
204
199
|
protected idFieldNameChanged(_prev: string | undefined, _next: string | undefined): void;
|
|
205
200
|
protected parentIdFieldNameChanged(_prev: string | undefined, _next: string | undefined): void;
|
|
206
201
|
protected columnsChanged(_prev: TableColumn[] | undefined, _next: TableColumn[]): void;
|
|
207
|
-
private
|
|
202
|
+
private updateRequestedSlotsForOpeningActionMenu;
|
|
208
203
|
private handleActionMenuBeforeToggleEvent;
|
|
209
204
|
private handleRowActionMenuToggleEvent;
|
|
210
205
|
private getActionMenuToggleEventDetail;
|
package/dist/esm/table/index.js
CHANGED
|
@@ -12,7 +12,6 @@ import { Virtualizer } from './models/virtualizer';
|
|
|
12
12
|
import { getTanStackSortingFunction } from './models/sort-operations';
|
|
13
13
|
import { TableLayoutManager } from './models/table-layout-manager';
|
|
14
14
|
import { TableUpdateTracker } from './models/table-update-tracker';
|
|
15
|
-
import { TableRow } from './components/row';
|
|
16
15
|
import { ColumnInternals } from '../table-column/base/models/column-internals';
|
|
17
16
|
import { InteractiveSelectionManager } from './models/interactive-selection-manager';
|
|
18
17
|
import { DataHierarchyManager } from './models/data-hierarchy-manager';
|
|
@@ -21,7 +20,6 @@ import { waitUntilCustomElementsDefinedAsync } from '../utilities/wait-until-cus
|
|
|
21
20
|
import { ColumnValidator } from '../table-column/base/models/column-validator';
|
|
22
21
|
import { uniquifySlotNameForColumnId } from './models/utilities';
|
|
23
22
|
import { KeyboardNavigationManager } from './models/keyboard-navigation-manager';
|
|
24
|
-
import { TableCellView } from '../table-column/base/cell-view';
|
|
25
23
|
/**
|
|
26
24
|
* A nimble-styled table.
|
|
27
25
|
*/
|
|
@@ -55,10 +53,6 @@ export class Table extends FoundationElement {
|
|
|
55
53
|
* @internal
|
|
56
54
|
*/
|
|
57
55
|
this.rowElements = [];
|
|
58
|
-
/**
|
|
59
|
-
* @internal
|
|
60
|
-
*/
|
|
61
|
-
this.actionMenuSlots = [];
|
|
62
56
|
/**
|
|
63
57
|
* @internal
|
|
64
58
|
*/
|
|
@@ -97,7 +91,8 @@ export class Table extends FoundationElement {
|
|
|
97
91
|
this.ignoreSelectionChangeEvents = false;
|
|
98
92
|
// Map from the external slot name to the record ID of the row that should have the slot
|
|
99
93
|
// and the unique slot name that the slot should be slotted into.
|
|
100
|
-
this.
|
|
94
|
+
this.requestedSlots = new Map();
|
|
95
|
+
this.actionMenuSlots = [];
|
|
101
96
|
this.onViewPortScroll = (event) => {
|
|
102
97
|
this.scrollX = event.target.scrollLeft;
|
|
103
98
|
};
|
|
@@ -295,7 +290,7 @@ export class Table extends FoundationElement {
|
|
|
295
290
|
event.stopImmediatePropagation();
|
|
296
291
|
for (const slotMetadata of event.detail.slots) {
|
|
297
292
|
const uniqueSlot = uniquifySlotNameForColumnId(event.detail.columnInternalId, slotMetadata.slot);
|
|
298
|
-
this.
|
|
293
|
+
this.requestedSlots.set(slotMetadata.name, {
|
|
299
294
|
recordId: event.detail.recordId,
|
|
300
295
|
uniqueSlot
|
|
301
296
|
});
|
|
@@ -449,29 +444,6 @@ export class Table extends FoundationElement {
|
|
|
449
444
|
}
|
|
450
445
|
return tanStackUpdates;
|
|
451
446
|
}
|
|
452
|
-
/** @internal */
|
|
453
|
-
handleFocusedCellRecycling() {
|
|
454
|
-
const hadActiveRowOrCellFocus = this.keyboardNavigationManager.hasActiveRowOrCellFocus;
|
|
455
|
-
let tableFocusedElement = this.shadowRoot.activeElement;
|
|
456
|
-
while (tableFocusedElement !== null
|
|
457
|
-
&& !(tableFocusedElement instanceof TableCellView)) {
|
|
458
|
-
if (tableFocusedElement.shadowRoot) {
|
|
459
|
-
tableFocusedElement = tableFocusedElement.shadowRoot.activeElement;
|
|
460
|
-
}
|
|
461
|
-
else {
|
|
462
|
-
break;
|
|
463
|
-
}
|
|
464
|
-
}
|
|
465
|
-
if (tableFocusedElement instanceof TableCellView) {
|
|
466
|
-
tableFocusedElement.focusedRecycleCallback();
|
|
467
|
-
}
|
|
468
|
-
if (this.openActionMenuRecordId !== undefined) {
|
|
469
|
-
const activeRow = this.rowElements.find(row => row instanceof TableRow
|
|
470
|
-
&& row.recordId === this.openActionMenuRecordId);
|
|
471
|
-
activeRow?.closeOpenActionMenus();
|
|
472
|
-
}
|
|
473
|
-
this.keyboardNavigationManager.handleFocusedCellRecycling(hadActiveRowOrCellFocus);
|
|
474
|
-
}
|
|
475
447
|
selectionModeChanged(_prev, _next) {
|
|
476
448
|
if (!this.$fastController.isConnected) {
|
|
477
449
|
return;
|
|
@@ -497,9 +469,12 @@ export class Table extends FoundationElement {
|
|
|
497
469
|
this.observeColumns();
|
|
498
470
|
this.tableUpdateTracker.trackColumnInstancesChanged();
|
|
499
471
|
}
|
|
500
|
-
|
|
472
|
+
updateRequestedSlotsForOpeningActionMenu(openActionMenuRecordId) {
|
|
501
473
|
for (const actionMenuSlot of this.actionMenuSlots) {
|
|
502
|
-
this.
|
|
474
|
+
this.requestedSlots.set(actionMenuSlot, {
|
|
475
|
+
recordId: openActionMenuRecordId,
|
|
476
|
+
uniqueSlot: `row-action-menu-${actionMenuSlot}`
|
|
477
|
+
});
|
|
503
478
|
}
|
|
504
479
|
this.refreshRows();
|
|
505
480
|
}
|
|
@@ -509,7 +484,7 @@ export class Table extends FoundationElement {
|
|
|
509
484
|
await this.emitSelectionChangeEvent();
|
|
510
485
|
}
|
|
511
486
|
this.openActionMenuRecordId = event.detail.recordIds[0];
|
|
512
|
-
this.
|
|
487
|
+
this.updateRequestedSlotsForOpeningActionMenu(this.openActionMenuRecordId);
|
|
513
488
|
const detail = await this.getActionMenuToggleEventDetail(event);
|
|
514
489
|
this.$emit('action-menu-beforetoggle', detail);
|
|
515
490
|
}
|
|
@@ -637,6 +612,13 @@ export class Table extends FoundationElement {
|
|
|
637
612
|
this.updateTableOptions(updatedOptions);
|
|
638
613
|
}
|
|
639
614
|
updateActionMenuSlots() {
|
|
615
|
+
if (this.openActionMenuRecordId !== undefined) {
|
|
616
|
+
// If the action menu is open, delete all the slots associated
|
|
617
|
+
// with the old action menu slots.
|
|
618
|
+
for (const actionMenuSlot of this.actionMenuSlots) {
|
|
619
|
+
this.requestedSlots.delete(actionMenuSlot);
|
|
620
|
+
}
|
|
621
|
+
}
|
|
640
622
|
const slots = new Set();
|
|
641
623
|
for (const column of this.columns) {
|
|
642
624
|
if (column.actionMenuSlot) {
|
|
@@ -644,6 +626,11 @@ export class Table extends FoundationElement {
|
|
|
644
626
|
}
|
|
645
627
|
}
|
|
646
628
|
this.actionMenuSlots = Array.from(slots);
|
|
629
|
+
if (this.openActionMenuRecordId !== undefined) {
|
|
630
|
+
// If the action menu is open, create slots for all the new
|
|
631
|
+
// action menu slots.
|
|
632
|
+
this.updateRequestedSlotsForOpeningActionMenu(this.openActionMenuRecordId);
|
|
633
|
+
}
|
|
647
634
|
}
|
|
648
635
|
validate() {
|
|
649
636
|
this.tableValidator.validateIdFieldConfiguration(this.selectionMode, this.idFieldName, this.parentIdFieldName);
|
|
@@ -728,7 +715,7 @@ export class Table extends FoundationElement {
|
|
|
728
715
|
groupColumn: this.getGroupRowColumn(row),
|
|
729
716
|
resolvedRowIndex: row.index,
|
|
730
717
|
isLoadingChildren: this.expansionManager.isLoadingChildren(row.id),
|
|
731
|
-
|
|
718
|
+
requestedSlots: slotsByRecordId[row.id] ?? []
|
|
732
719
|
};
|
|
733
720
|
hasDataHierarchy = hasDataHierarchy || isParent;
|
|
734
721
|
return rowState;
|
|
@@ -740,7 +727,7 @@ export class Table extends FoundationElement {
|
|
|
740
727
|
getRequestedSlotsByRecordId() {
|
|
741
728
|
const slotsByRecordId = {};
|
|
742
729
|
for (const [slotName, { recordId, uniqueSlot }] of this
|
|
743
|
-
.
|
|
730
|
+
.requestedSlots) {
|
|
744
731
|
if (!Object.prototype.hasOwnProperty.call(slotsByRecordId, recordId)) {
|
|
745
732
|
slotsByRecordId[recordId] = [];
|
|
746
733
|
}
|
|
@@ -888,9 +875,6 @@ __decorate([
|
|
|
888
875
|
__decorate([
|
|
889
876
|
observable
|
|
890
877
|
], Table.prototype, "rowElements", void 0);
|
|
891
|
-
__decorate([
|
|
892
|
-
observable
|
|
893
|
-
], Table.prototype, "actionMenuSlots", void 0);
|
|
894
878
|
__decorate([
|
|
895
879
|
observable
|
|
896
880
|
], Table.prototype, "openActionMenuRecordId", void 0);
|