@cloudscape-design/components 3.0.259 → 3.0.261
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/attribute-editor/row.d.ts.map +1 -1
- package/attribute-editor/row.js +3 -1
- package/attribute-editor/row.js.map +1 -1
- package/code-editor/index.d.ts.map +1 -1
- package/code-editor/index.js +1 -14
- package/code-editor/index.js.map +1 -1
- package/code-editor/pane.d.ts +1 -2
- package/code-editor/pane.d.ts.map +1 -1
- package/code-editor/pane.js +8 -3
- package/code-editor/pane.js.map +1 -1
- package/code-editor/status-bar.d.ts +3 -3
- package/code-editor/status-bar.d.ts.map +1 -1
- package/code-editor/status-bar.js +5 -3
- package/code-editor/status-bar.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/manifest.json +1 -1
- package/modal/internal.d.ts +1 -1
- package/modal/internal.d.ts.map +1 -1
- package/modal/internal.js +24 -15
- package/modal/internal.js.map +1 -1
- package/package.json +1 -1
- package/table/body-cell/index.d.ts +2 -1
- package/table/body-cell/index.d.ts.map +1 -1
- package/table/body-cell/index.js +9 -4
- package/table/body-cell/index.js.map +1 -1
- package/table/body-cell/inline-editor.d.ts +1 -1
- package/table/body-cell/inline-editor.d.ts.map +1 -1
- package/table/body-cell/inline-editor.js +5 -3
- package/table/body-cell/inline-editor.js.map +1 -1
- package/table/body-cell/styles.css.js +40 -18
- package/table/body-cell/styles.scoped.css +222 -52
- package/table/body-cell/styles.selectors.js +40 -18
- package/table/header-cell/index.js +1 -1
- package/table/header-cell/index.js.map +1 -1
- package/table/interfaces.d.ts +6 -0
- package/table/interfaces.d.ts.map +1 -1
- package/table/interfaces.js.map +1 -1
- package/table/internal.d.ts.map +1 -1
- package/table/internal.js +20 -18
- package/table/internal.js.map +1 -1
- package/table/selection-control/index.d.ts +2 -8
- package/table/selection-control/index.d.ts.map +1 -1
- package/table/selection-control/index.js.map +1 -1
- package/table/table-wrapper.d.ts +13 -0
- package/table/table-wrapper.d.ts.map +1 -0
- package/table/table-wrapper.js +15 -0
- package/table/table-wrapper.js.map +1 -0
- package/table/thead.d.ts +2 -2
- package/table/thead.d.ts.map +1 -1
- package/table/thead.js +3 -3
- package/table/thead.js.map +1 -1
- package/table/use-column-widths.js +1 -1
- package/table/use-column-widths.js.map +1 -1
- package/table/use-selection.d.ts +12 -18
- package/table/use-selection.d.ts.map +1 -1
- package/table/use-selection.js +20 -12
- package/table/use-selection.js.map +1 -1
- package/table/use-table-focus-navigation.d.ts.map +1 -1
- package/table/use-table-focus-navigation.js +9 -34
- package/table/use-table-focus-navigation.js.map +1 -1
- package/test-utils/dom/table/index.d.ts +3 -0
- package/test-utils/dom/table/index.js +16 -15
- package/test-utils/dom/table/index.js.map +1 -1
- package/test-utils/selectors/table/index.d.ts +3 -0
- package/test-utils/selectors/table/index.js +16 -15
- package/test-utils/selectors/table/index.js.map +1 -1
- package/test-utils/tsconfig.tsbuildinfo +1 -1
- package/table/header-cell/styles.css.js +0 -24
- package/table/header-cell/styles.scoped.css +0 -252
- package/table/header-cell/styles.selectors.js +0 -25
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-column-widths.js","sourceRoot":"lib/default/","sources":["table/use-column-widths.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,gBAAgB,MAAM,
|
|
1
|
+
{"version":3,"file":"use-column-widths.js","sourceRoot":"lib/default/","sources":["table/use-column-widths.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState, createContext, useContext } from 'react';\nimport { TableProps } from './interfaces';\nimport { getColumnKey } from './utils';\nimport headerCellStyles from './body-cell/styles.css.js';\nimport { warnOnce } from '../internal/logging';\n\nexport const DEFAULT_WIDTH = 120;\nconst SELECTION_CELL_WIDTH = 54;\n\nfunction checkProperty(column: TableProps.ColumnDefinition<any>, name: 'width' | 'minWidth') {\n const value = column[name];\n if (typeof value !== 'number' && typeof value !== 'undefined') {\n warnOnce(\n 'Table',\n `resizableColumns feature requires ${name} property to be a number, got ${value}. The component may work incorrectly.`\n );\n }\n}\n\nexport function checkColumnWidths(columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>) {\n for (const column of columnDefinitions) {\n checkProperty(column, 'minWidth');\n checkProperty(column, 'width');\n }\n}\n\nfunction readWidths(\n headerEl: HTMLElement,\n columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>,\n hasSelection: boolean\n) {\n const result: Record<string, number> = {};\n for (let index = 0; index < columnDefinitions.length; index++) {\n const column = columnDefinitions[index];\n const id = getColumnKey(columnDefinitions[index], index);\n let width = (column.width as number) || 0;\n const minWidth = (column.minWidth as number) || width || DEFAULT_WIDTH;\n if (\n !width && // read width from the DOM if it is missing in the config\n index !== columnDefinitions.length - 1 // skip reading for the last column, because it expands to fully fit the container\n ) {\n const colIndex = hasSelection ? index + 2 : index + 1;\n const colEl = headerEl.querySelector<HTMLElement>(`.${headerCellStyles['header-cell']}:nth-child(${colIndex})`)!;\n width = colEl.getBoundingClientRect().width;\n }\n result[id] = Math.max(width, minWidth);\n }\n return result;\n}\n\nfunction updateWidths(\n columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>,\n oldWidths: Record<string, number>,\n newWidth: number,\n colIndex: number\n) {\n const definition = columnDefinitions[colIndex];\n const id = getColumnKey(definition, colIndex);\n const minWidth = typeof definition.minWidth === 'number' ? definition.minWidth : DEFAULT_WIDTH;\n newWidth = Math.max(newWidth, minWidth);\n if (oldWidths[id] === newWidth) {\n return oldWidths;\n }\n return { ...oldWidths, [id]: newWidth };\n}\n\ninterface WidthsContext {\n totalWidth: number;\n columnWidths: Record<string, number>;\n updateColumn: (colIndex: number, newWidth: number) => void;\n}\n\nconst WidthsContext = createContext<WidthsContext>({\n totalWidth: 0,\n columnWidths: {},\n updateColumn: () => {},\n});\n\ninterface WidthProviderProps {\n tableRef: React.MutableRefObject<HTMLElement | null>;\n visibleColumnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n resizableColumns: boolean | undefined;\n hasSelection: boolean;\n children: React.ReactNode;\n}\n\nexport function ColumnWidthsProvider({\n tableRef,\n visibleColumnDefinitions,\n resizableColumns,\n hasSelection,\n children,\n}: WidthProviderProps) {\n const visibleColumns = useRef<(string | undefined)[] | null>(null);\n const [columnWidths, setColumnWidths] = useState<Record<string, number>>({});\n\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n const lastVisible = visibleColumns.current;\n if (lastVisible) {\n for (let index = 0; index < visibleColumnDefinitions.length; index++) {\n const column = visibleColumnDefinitions[index];\n const id = getColumnKey(column, index);\n if (!columnWidths[id] && lastVisible.indexOf(column.id) === -1) {\n setColumnWidths(columnWidths => ({ ...columnWidths, [id]: (column.width as number) || DEFAULT_WIDTH }));\n }\n }\n }\n visibleColumns.current = visibleColumnDefinitions.map(column => column.id);\n }, [columnWidths, resizableColumns, visibleColumnDefinitions]);\n\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n setColumnWidths(() => readWidths(tableRef.current!, visibleColumnDefinitions, hasSelection));\n // This code is intended to run only at the first render and should not re-run when table props change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n function updateColumn(colIndex: number, newWidth: number) {\n setColumnWidths(columnWidths => updateWidths(visibleColumnDefinitions, columnWidths, newWidth, colIndex));\n }\n\n let totalWidth = visibleColumnDefinitions.reduce(\n (total, column, index) => total + (columnWidths[getColumnKey(column, index)] || DEFAULT_WIDTH),\n 0\n );\n if (hasSelection) {\n totalWidth += SELECTION_CELL_WIDTH;\n }\n\n return <WidthsContext.Provider value={{ columnWidths, totalWidth, updateColumn }}>{children}</WidthsContext.Provider>;\n}\n\nexport function useColumnWidths() {\n return useContext(WidthsContext);\n}\n"]}
|
package/table/use-selection.d.ts
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
import { KeyboardEvent } from 'react';
|
|
2
2
|
import { TableProps } from './interfaces';
|
|
3
|
+
export interface SelectionProps {
|
|
4
|
+
name: string;
|
|
5
|
+
disabled: boolean;
|
|
6
|
+
selectionType: 'single' | 'multi';
|
|
7
|
+
indeterminate?: boolean;
|
|
8
|
+
checked: boolean;
|
|
9
|
+
onChange: () => void;
|
|
10
|
+
ariaLabel?: string;
|
|
11
|
+
}
|
|
3
12
|
export declare function useFocusMove(selectionType: TableProps['selectionType'], totalItems: number): {
|
|
4
13
|
moveFocusDown?: undefined;
|
|
5
14
|
moveFocusUp?: undefined;
|
|
@@ -20,25 +29,10 @@ export declare const focusMarkers: {
|
|
|
20
29
|
[x: string]: string;
|
|
21
30
|
};
|
|
22
31
|
};
|
|
23
|
-
export declare function useSelection<T>({ items, selectedItems, selectionType, isItemDisabled, trackBy, onSelectionChange, ariaLabels, }: Pick<TableProps<T>, 'ariaLabels' | 'items' | 'selectedItems' | 'selectionType' | 'isItemDisabled' | 'trackBy' | 'onSelectionChange'>): {
|
|
32
|
+
export declare function useSelection<T>({ items, selectedItems, selectionType, isItemDisabled, trackBy, onSelectionChange, ariaLabels, loading, }: Pick<TableProps<T>, 'ariaLabels' | 'items' | 'selectedItems' | 'selectionType' | 'isItemDisabled' | 'trackBy' | 'onSelectionChange' | 'loading'>): {
|
|
24
33
|
isItemSelected: (item: T) => boolean;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
disabled: boolean;
|
|
28
|
-
selectionType: TableProps.SelectionType | undefined;
|
|
29
|
-
indeterminate: boolean;
|
|
30
|
-
checked: boolean;
|
|
31
|
-
onChange: () => void;
|
|
32
|
-
ariaLabel: string | undefined;
|
|
33
|
-
};
|
|
34
|
-
getItemSelectionProps: (item: T) => {
|
|
35
|
-
name: string;
|
|
36
|
-
selectionType: TableProps.SelectionType | undefined;
|
|
37
|
-
ariaLabel: string | undefined;
|
|
38
|
-
onChange: () => void;
|
|
39
|
-
checked: boolean;
|
|
40
|
-
disabled: boolean;
|
|
41
|
-
};
|
|
34
|
+
getSelectAllProps: () => SelectionProps;
|
|
35
|
+
getItemSelectionProps: (item: T) => SelectionProps;
|
|
42
36
|
updateShiftToggle: (value: boolean) => void;
|
|
43
37
|
};
|
|
44
38
|
//# sourceMappingURL=use-selection.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-selection.d.ts","sourceRoot":"lib/default/","sources":["table/use-selection.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAY,MAAM,OAAO,CAAC;AAIhD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"use-selection.d.ts","sourceRoot":"lib/default/","sources":["table/use-selection.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAY,MAAM,OAAO,CAAC;AAIhD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAK1C,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,QAAQ,GAAG,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAqBD,wBAAgB,YAAY,CAAC,aAAa,EAAE,UAAU,CAAC,eAAe,CAAC,EAAE,UAAU,EAAE,MAAM;;;;;2BAkBxE,aAAa;yBAAb,aAAa;+BAdI,WAAW,aAAa,MAAM,aAAa,CAAC,CAAC,GAAG,CAAC;EA0BpF;AAeD,eAAO,MAAM,YAAY;;;;;;;;;;CAIxB,CAAC;AAEF,wBAAgB,YAAY,CAAC,CAAC,EAAE,EAC9B,KAAK,EACL,aAAkB,EAClB,aAAa,EACb,cAA4B,EAC5B,OAAO,EACP,iBAAiB,EACjB,UAAU,EACV,OAAO,GACR,EAAE,IAAI,CACL,UAAU,CAAC,CAAC,CAAC,EACX,YAAY,GACZ,OAAO,GACP,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,mBAAmB,GACnB,SAAS,CACZ;;6BA8F0B,cAAc;kCAiBP,CAAC,KAAG,cAAc;+BAgBrB,OAAO;EAIrC"}
|
package/table/use-selection.js
CHANGED
|
@@ -65,8 +65,7 @@ export const focusMarkers = {
|
|
|
65
65
|
all: { ['data-' + SELECTION_ITEM]: 'all' },
|
|
66
66
|
root: { ['data-' + SELECTION_ROOT]: 'true' },
|
|
67
67
|
};
|
|
68
|
-
export function useSelection({ items, selectedItems = [], selectionType, isItemDisabled = () => false, trackBy, onSelectionChange, ariaLabels, }) {
|
|
69
|
-
var _a;
|
|
68
|
+
export function useSelection({ items, selectedItems = [], selectionType, isItemDisabled = () => false, trackBy, onSelectionChange, ariaLabels, loading, }) {
|
|
70
69
|
const [shiftPressed, setShiftPressed] = useState(false);
|
|
71
70
|
const [lastClickedItem, setLastClickedItem] = useState(null);
|
|
72
71
|
const selectionName = useUniqueId();
|
|
@@ -151,25 +150,34 @@ export function useSelection({ items, selectedItems = [], selectionType, isItemD
|
|
|
151
150
|
};
|
|
152
151
|
return {
|
|
153
152
|
isItemSelected,
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
153
|
+
getSelectAllProps: () => {
|
|
154
|
+
var _a;
|
|
155
|
+
if (!selectionType) {
|
|
156
|
+
throw new Error('Invariant violation: calling selection props with missing selection type.');
|
|
157
|
+
}
|
|
158
|
+
return {
|
|
159
|
+
name: selectionName,
|
|
160
|
+
disabled: allDisabled || !!loading,
|
|
161
|
+
selectionType: selectionType,
|
|
162
|
+
indeterminate: hasSelected && !allEnabledSelected,
|
|
163
|
+
checked: hasSelected && allEnabledSelected,
|
|
164
|
+
onChange: handleToggleAll,
|
|
165
|
+
ariaLabel: joinStrings(ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.selectionGroupLabel, (_a = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.allItemsSelectionLabel) === null || _a === void 0 ? void 0 : _a.call(ariaLabels, { selectedItems })),
|
|
166
|
+
};
|
|
162
167
|
},
|
|
163
168
|
getItemSelectionProps: (item) => {
|
|
164
169
|
var _a;
|
|
165
|
-
|
|
170
|
+
if (!selectionType) {
|
|
171
|
+
throw new Error('Invariant violation: calling selection props with missing selection type.');
|
|
172
|
+
}
|
|
173
|
+
return {
|
|
166
174
|
name: selectionName,
|
|
167
175
|
selectionType: selectionType,
|
|
168
176
|
ariaLabel: joinStrings(ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.selectionGroupLabel, (_a = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.itemSelectionLabel) === null || _a === void 0 ? void 0 : _a.call(ariaLabels, { selectedItems }, item)),
|
|
169
177
|
onChange: handleToggleItem(item),
|
|
170
178
|
checked: isItemSelected(item),
|
|
171
179
|
disabled: isItemDisabled(item),
|
|
172
|
-
}
|
|
180
|
+
};
|
|
173
181
|
},
|
|
174
182
|
updateShiftToggle: (value) => {
|
|
175
183
|
setShiftPressed(value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-selection.js","sourceRoot":"lib/default/","sources":["table/use-selection.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { KeyboardEvent, useState } from 'react';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { findUpUntil } from '../internal/utils/dom';\nimport { TableProps } from './interfaces';\nimport { getTrackableValue } from './utils';\nimport selectionStyles from './selection-control/styles.css.js';\nimport { joinStrings } from '../internal/utils/strings';\n\nconst SELECTION_ITEM = 'selection-item';\nconst SELECTION_ROOT = 'selection-root';\n\nfunction findSelectionControlByIndex(rootContainer: HTMLElement, index: number) {\n if (index === -1) {\n // find \"select all\" checkbox\n return rootContainer.querySelector<HTMLInputElement>(\n `[data-${SELECTION_ITEM}=\"all\"] .${selectionStyles.root} input`\n );\n }\n return rootContainer.querySelectorAll<HTMLInputElement>(\n `[data-${SELECTION_ITEM}=\"item\"] .${selectionStyles.root} input`\n )[index];\n}\n\nfunction findRootContainer(element: HTMLElement) {\n return findUpUntil(element, node => node.dataset.selectionRoot === 'true')!;\n}\n\nexport function useFocusMove(selectionType: TableProps['selectionType'], totalItems: number) {\n if (selectionType !== 'multi') {\n return {};\n }\n function moveFocus(sourceElement: HTMLElement, fromIndex: number, direction: -1 | 1) {\n let index = fromIndex;\n const rootContainer = findRootContainer(sourceElement);\n\n while (index >= -1 && index < totalItems) {\n index += direction;\n const control = findSelectionControlByIndex(rootContainer, index);\n if (control && !control.disabled) {\n control.focus();\n break;\n }\n }\n }\n const [moveFocusDown, moveFocusUp] = ([1, -1] as const).map(direction => {\n return (event: KeyboardEvent) => {\n const target = event.currentTarget as HTMLElement;\n const itemNode = findUpUntil(target, node => node.dataset.selectionItem === 'item')!;\n const fromIndex = Array.prototype.indexOf.call(itemNode.parentElement!.children, itemNode);\n moveFocus(target, fromIndex, direction);\n };\n });\n return {\n moveFocusDown,\n moveFocusUp,\n moveFocus,\n };\n}\n\n// A set, that compares items by their \"trackables\" (the results of applying `trackBy` to them)\nclass ItemSet<T> {\n constructor(trackBy: TableProps.TrackBy<T> | undefined, items: ReadonlyArray<T>) {\n this.trackBy = trackBy;\n items.forEach(this.put);\n }\n private trackBy: TableProps.TrackBy<T> | undefined;\n private map: Map<unknown, T> = new Map();\n put = (item: T) => this.map.set.call(this.map, getTrackableValue(this.trackBy, item), item);\n has = (item: T) => this.map.has.call(this.map, getTrackableValue(this.trackBy, item));\n forEach = this.map.forEach.bind(this.map);\n}\n\nexport const focusMarkers = {\n item: { ['data-' + SELECTION_ITEM]: 'item' },\n all: { ['data-' + SELECTION_ITEM]: 'all' },\n root: { ['data-' + SELECTION_ROOT]: 'true' },\n};\n\nexport function useSelection<T>({\n items,\n selectedItems = [],\n selectionType,\n isItemDisabled = () => false,\n trackBy,\n onSelectionChange,\n ariaLabels,\n}: Pick<\n TableProps<T>,\n 'ariaLabels' | 'items' | 'selectedItems' | 'selectionType' | 'isItemDisabled' | 'trackBy' | 'onSelectionChange'\n>) {\n const [shiftPressed, setShiftPressed] = useState(false);\n const [lastClickedItem, setLastClickedItem] = useState<T | null>(null);\n const selectionName = useUniqueId();\n const finalSelectedItems = selectionType === 'single' ? selectedItems.slice(0, 1) : selectedItems;\n const selectedSet = new ItemSet(trackBy, finalSelectedItems);\n const itemIndexesMap = new Map();\n items.forEach((item, i) => itemIndexesMap.set(getTrackableValue(trackBy, item), i));\n const isItemSelected = selectedSet.has.bind(selectedSet);\n const getItemState = (item: T) => ({\n disabled: isItemDisabled(item),\n selected: isItemSelected(item),\n });\n const [allDisabled, allEnabledSelected] = selectionType\n ? items.reduce(\n ([allDisabled, allEnabledSelected], item) => {\n const { disabled, selected } = getItemState(item);\n return [\n // all items are disabled (or none are present)\n allDisabled && disabled,\n // all enabled items are selected (or none are present)\n allEnabledSelected && (selected || disabled),\n ];\n },\n [true, true]\n )\n : [true, true];\n\n // the page has at least one selected item\n const hasSelected = finalSelectedItems.length > 0;\n\n const handleToggleAll = () => {\n const requestedItems = new ItemSet(trackBy, items);\n const newSelectedItems = allEnabledSelected ? deselectItems(requestedItems) : selectItems(requestedItems);\n fireNonCancelableEvent(onSelectionChange, { selectedItems: newSelectedItems });\n };\n\n const getRequestedItems = (item: T) => {\n const requestedItems = new ItemSet(trackBy, [item]);\n let lastClickedItemIndex = lastClickedItem ? itemIndexesMap.get(getTrackableValue(trackBy, lastClickedItem)) : -1;\n if (lastClickedItemIndex === undefined) {\n lastClickedItemIndex = -1;\n }\n // we use lastClickedItemIndex to determine if filtering/sorting/pagination\n // made previously selected item invisible, therefore we reset state for shift-select\n if (shiftPressed && lastClickedItemIndex !== -1) {\n // item is always in items\n const currentItemIndex = itemIndexesMap.get(getTrackableValue(trackBy, item)) as number;\n const start = Math.min(currentItemIndex, lastClickedItemIndex);\n const end = Math.max(currentItemIndex, lastClickedItemIndex);\n items.slice(start, end + 1).forEach(item => requestedItems.put(item));\n }\n return requestedItems;\n };\n\n const deselectItems = (requestedItems: ItemSet<T>) => {\n const newSelectedItems: Array<T> = [];\n selectedItems.forEach(selectedItem => {\n const toUnselect = requestedItems.has(selectedItem);\n if (!toUnselect || isItemDisabled(selectedItem)) {\n newSelectedItems.push(selectedItem);\n }\n });\n return newSelectedItems;\n };\n\n const selectItems = (requestedItems: ItemSet<T>) => {\n const newSelectedItems = [...selectedItems];\n requestedItems.forEach(newItem => {\n const { selected, disabled } = getItemState(newItem);\n if (!selected && !disabled) {\n newSelectedItems.push(newItem);\n }\n });\n return newSelectedItems;\n };\n\n const handleToggleItem = (item: T) => () => {\n const { disabled, selected } = getItemState(item);\n if (disabled || (selectionType === 'single' && selected)) {\n return;\n }\n if (selectionType === 'single') {\n fireNonCancelableEvent(onSelectionChange, { selectedItems: [item] });\n } else {\n const requestedItems = getRequestedItems(item);\n const selectedItems = selected ? deselectItems(requestedItems) : selectItems(requestedItems);\n fireNonCancelableEvent(onSelectionChange, { selectedItems });\n setLastClickedItem(item);\n }\n };\n return {\n isItemSelected,\n selectAllProps: {\n name: selectionName,\n disabled: allDisabled,\n selectionType: selectionType,\n indeterminate: hasSelected && !allEnabledSelected,\n checked: hasSelected && allEnabledSelected,\n onChange: handleToggleAll,\n ariaLabel: joinStrings(ariaLabels?.selectionGroupLabel, ariaLabels?.allItemsSelectionLabel?.({ selectedItems })),\n },\n getItemSelectionProps: (item: T) => ({\n name: selectionName,\n selectionType: selectionType,\n ariaLabel: joinStrings(\n ariaLabels?.selectionGroupLabel,\n ariaLabels?.itemSelectionLabel?.({ selectedItems }, item)\n ),\n onChange: handleToggleItem(item),\n checked: isItemSelected(item),\n disabled: isItemDisabled(item),\n }),\n updateShiftToggle: (value: boolean) => {\n setShiftPressed(value);\n },\n };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"use-selection.js","sourceRoot":"lib/default/","sources":["table/use-selection.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { KeyboardEvent, useState } from 'react';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { findUpUntil } from '../internal/utils/dom';\nimport { TableProps } from './interfaces';\nimport { getTrackableValue } from './utils';\nimport selectionStyles from './selection-control/styles.css.js';\nimport { joinStrings } from '../internal/utils/strings';\n\nexport interface SelectionProps {\n name: string;\n disabled: boolean;\n selectionType: 'single' | 'multi';\n indeterminate?: boolean;\n checked: boolean;\n onChange: () => void;\n ariaLabel?: string;\n}\n\nconst SELECTION_ITEM = 'selection-item';\nconst SELECTION_ROOT = 'selection-root';\n\nfunction findSelectionControlByIndex(rootContainer: HTMLElement, index: number) {\n if (index === -1) {\n // find \"select all\" checkbox\n return rootContainer.querySelector<HTMLInputElement>(\n `[data-${SELECTION_ITEM}=\"all\"] .${selectionStyles.root} input`\n );\n }\n return rootContainer.querySelectorAll<HTMLInputElement>(\n `[data-${SELECTION_ITEM}=\"item\"] .${selectionStyles.root} input`\n )[index];\n}\n\nfunction findRootContainer(element: HTMLElement) {\n return findUpUntil(element, node => node.dataset.selectionRoot === 'true')!;\n}\n\nexport function useFocusMove(selectionType: TableProps['selectionType'], totalItems: number) {\n if (selectionType !== 'multi') {\n return {};\n }\n function moveFocus(sourceElement: HTMLElement, fromIndex: number, direction: -1 | 1) {\n let index = fromIndex;\n const rootContainer = findRootContainer(sourceElement);\n\n while (index >= -1 && index < totalItems) {\n index += direction;\n const control = findSelectionControlByIndex(rootContainer, index);\n if (control && !control.disabled) {\n control.focus();\n break;\n }\n }\n }\n const [moveFocusDown, moveFocusUp] = ([1, -1] as const).map(direction => {\n return (event: KeyboardEvent) => {\n const target = event.currentTarget as HTMLElement;\n const itemNode = findUpUntil(target, node => node.dataset.selectionItem === 'item')!;\n const fromIndex = Array.prototype.indexOf.call(itemNode.parentElement!.children, itemNode);\n moveFocus(target, fromIndex, direction);\n };\n });\n return {\n moveFocusDown,\n moveFocusUp,\n moveFocus,\n };\n}\n\n// A set, that compares items by their \"trackables\" (the results of applying `trackBy` to them)\nclass ItemSet<T> {\n constructor(trackBy: TableProps.TrackBy<T> | undefined, items: ReadonlyArray<T>) {\n this.trackBy = trackBy;\n items.forEach(this.put);\n }\n private trackBy: TableProps.TrackBy<T> | undefined;\n private map: Map<unknown, T> = new Map();\n put = (item: T) => this.map.set.call(this.map, getTrackableValue(this.trackBy, item), item);\n has = (item: T) => this.map.has.call(this.map, getTrackableValue(this.trackBy, item));\n forEach = this.map.forEach.bind(this.map);\n}\n\nexport const focusMarkers = {\n item: { ['data-' + SELECTION_ITEM]: 'item' },\n all: { ['data-' + SELECTION_ITEM]: 'all' },\n root: { ['data-' + SELECTION_ROOT]: 'true' },\n};\n\nexport function useSelection<T>({\n items,\n selectedItems = [],\n selectionType,\n isItemDisabled = () => false,\n trackBy,\n onSelectionChange,\n ariaLabels,\n loading,\n}: Pick<\n TableProps<T>,\n | 'ariaLabels'\n | 'items'\n | 'selectedItems'\n | 'selectionType'\n | 'isItemDisabled'\n | 'trackBy'\n | 'onSelectionChange'\n | 'loading'\n>) {\n const [shiftPressed, setShiftPressed] = useState(false);\n const [lastClickedItem, setLastClickedItem] = useState<T | null>(null);\n const selectionName = useUniqueId();\n const finalSelectedItems = selectionType === 'single' ? selectedItems.slice(0, 1) : selectedItems;\n const selectedSet = new ItemSet(trackBy, finalSelectedItems);\n const itemIndexesMap = new Map();\n items.forEach((item, i) => itemIndexesMap.set(getTrackableValue(trackBy, item), i));\n const isItemSelected = selectedSet.has.bind(selectedSet);\n const getItemState = (item: T) => ({\n disabled: isItemDisabled(item),\n selected: isItemSelected(item),\n });\n const [allDisabled, allEnabledSelected] = selectionType\n ? items.reduce(\n ([allDisabled, allEnabledSelected], item) => {\n const { disabled, selected } = getItemState(item);\n return [\n // all items are disabled (or none are present)\n allDisabled && disabled,\n // all enabled items are selected (or none are present)\n allEnabledSelected && (selected || disabled),\n ];\n },\n [true, true]\n )\n : [true, true];\n\n // the page has at least one selected item\n const hasSelected = finalSelectedItems.length > 0;\n\n const handleToggleAll = () => {\n const requestedItems = new ItemSet(trackBy, items);\n const newSelectedItems = allEnabledSelected ? deselectItems(requestedItems) : selectItems(requestedItems);\n fireNonCancelableEvent(onSelectionChange, { selectedItems: newSelectedItems });\n };\n\n const getRequestedItems = (item: T) => {\n const requestedItems = new ItemSet(trackBy, [item]);\n let lastClickedItemIndex = lastClickedItem ? itemIndexesMap.get(getTrackableValue(trackBy, lastClickedItem)) : -1;\n if (lastClickedItemIndex === undefined) {\n lastClickedItemIndex = -1;\n }\n // we use lastClickedItemIndex to determine if filtering/sorting/pagination\n // made previously selected item invisible, therefore we reset state for shift-select\n if (shiftPressed && lastClickedItemIndex !== -1) {\n // item is always in items\n const currentItemIndex = itemIndexesMap.get(getTrackableValue(trackBy, item)) as number;\n const start = Math.min(currentItemIndex, lastClickedItemIndex);\n const end = Math.max(currentItemIndex, lastClickedItemIndex);\n items.slice(start, end + 1).forEach(item => requestedItems.put(item));\n }\n return requestedItems;\n };\n\n const deselectItems = (requestedItems: ItemSet<T>) => {\n const newSelectedItems: Array<T> = [];\n selectedItems.forEach(selectedItem => {\n const toUnselect = requestedItems.has(selectedItem);\n if (!toUnselect || isItemDisabled(selectedItem)) {\n newSelectedItems.push(selectedItem);\n }\n });\n return newSelectedItems;\n };\n\n const selectItems = (requestedItems: ItemSet<T>) => {\n const newSelectedItems = [...selectedItems];\n requestedItems.forEach(newItem => {\n const { selected, disabled } = getItemState(newItem);\n if (!selected && !disabled) {\n newSelectedItems.push(newItem);\n }\n });\n return newSelectedItems;\n };\n\n const handleToggleItem = (item: T) => () => {\n const { disabled, selected } = getItemState(item);\n if (disabled || (selectionType === 'single' && selected)) {\n return;\n }\n if (selectionType === 'single') {\n fireNonCancelableEvent(onSelectionChange, { selectedItems: [item] });\n } else {\n const requestedItems = getRequestedItems(item);\n const selectedItems = selected ? deselectItems(requestedItems) : selectItems(requestedItems);\n fireNonCancelableEvent(onSelectionChange, { selectedItems });\n setLastClickedItem(item);\n }\n };\n\n return {\n isItemSelected,\n getSelectAllProps: (): SelectionProps => {\n if (!selectionType) {\n throw new Error('Invariant violation: calling selection props with missing selection type.');\n }\n return {\n name: selectionName,\n disabled: allDisabled || !!loading,\n selectionType: selectionType,\n indeterminate: hasSelected && !allEnabledSelected,\n checked: hasSelected && allEnabledSelected,\n onChange: handleToggleAll,\n ariaLabel: joinStrings(\n ariaLabels?.selectionGroupLabel,\n ariaLabels?.allItemsSelectionLabel?.({ selectedItems })\n ),\n };\n },\n getItemSelectionProps: (item: T): SelectionProps => {\n if (!selectionType) {\n throw new Error('Invariant violation: calling selection props with missing selection type.');\n }\n return {\n name: selectionName,\n selectionType: selectionType,\n ariaLabel: joinStrings(\n ariaLabels?.selectionGroupLabel,\n ariaLabels?.itemSelectionLabel?.({ selectedItems }, item)\n ),\n onChange: handleToggleItem(item),\n checked: isItemSelected(item),\n disabled: isItemDisabled(item),\n };\n },\n updateShiftToggle: (value: boolean) => {\n setShiftPressed(value);\n },\n };\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-focus-navigation.d.ts","sourceRoot":"lib/default/","sources":["table/use-table-focus-navigation.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"use-table-focus-navigation.d.ts","sourceRoot":"lib/default/","sources":["table/use-table-focus-navigation.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAmC,MAAM,OAAO,CAAC;AAEnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAa1C;;;;;;;;GAQG;AACH,iBAAS,uBAAuB,CAAC,CAAC,SAAS;IAAE,UAAU,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,GAAG,CAAC,CAAA;CAAE,EACpF,aAAa,EAAE,UAAU,CAAC,eAAe,CAAC,EAC1C,SAAS,EAAE,SAAS,CAAC,gBAAgB,CAAC,EACtC,iBAAiB,EAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,EAChC,OAAO,EAAE,MAAM,QA4GhB;AAED,eAAe,uBAAuB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import { useCallback, useEffect, useMemo
|
|
3
|
+
import { useCallback, useEffect, useMemo } from 'react';
|
|
4
4
|
import { scrollElementIntoView } from '../internal/utils/scrollable-containers';
|
|
5
5
|
function iterateTableCells(table, func) {
|
|
6
6
|
table.querySelectorAll('tr').forEach((row, rowIndex) => {
|
|
@@ -19,7 +19,6 @@ function iterateTableCells(table, func) {
|
|
|
19
19
|
* @param numRows - The number of rows in the table.
|
|
20
20
|
*/
|
|
21
21
|
function useTableFocusNavigation(selectionType, tableRoot, columnDefinitions, numRows) {
|
|
22
|
-
const currentFocusCell = useRef(null);
|
|
23
22
|
const focusableColumns = useMemo(() => {
|
|
24
23
|
const cols = columnDefinitions.map(column => !!column.editConfig);
|
|
25
24
|
if (selectionType) {
|
|
@@ -44,11 +43,13 @@ function useTableFocusNavigation(selectionType, tableRoot, columnDefinitions, nu
|
|
|
44
43
|
}
|
|
45
44
|
}, [tableRoot]);
|
|
46
45
|
const shiftFocus = useCallback((vertical, horizontal) => {
|
|
47
|
-
|
|
48
|
-
|
|
46
|
+
var _a;
|
|
47
|
+
const focusedCell = (_a = tableRoot.current) === null || _a === void 0 ? void 0 : _a.querySelector('td:focus-within');
|
|
48
|
+
if (!focusedCell) {
|
|
49
49
|
return;
|
|
50
50
|
}
|
|
51
|
-
const
|
|
51
|
+
const columnIndex = focusedCell.cellIndex;
|
|
52
|
+
const rowIndex = focusedCell.parentElement.rowIndex;
|
|
52
53
|
let newRowIndex = rowIndex;
|
|
53
54
|
let newColumnIndex = columnIndex;
|
|
54
55
|
if (vertical !== 0) {
|
|
@@ -62,9 +63,7 @@ function useTableFocusNavigation(selectionType, tableRoot, columnDefinitions, nu
|
|
|
62
63
|
}
|
|
63
64
|
}
|
|
64
65
|
}
|
|
65
|
-
if ((rowIndex !== newRowIndex || columnIndex !== newColumnIndex) &&
|
|
66
|
-
currentFocusCell.current &&
|
|
67
|
-
tableRoot.current) {
|
|
66
|
+
if ((rowIndex !== newRowIndex || columnIndex !== newColumnIndex) && tableRoot.current) {
|
|
68
67
|
focusCell(newRowIndex, newColumnIndex);
|
|
69
68
|
}
|
|
70
69
|
}, [focusCell, focusableColumns, maxColumnIndex, minColumnIndex, numRows, tableRoot]);
|
|
@@ -98,36 +97,12 @@ function useTableFocusNavigation(selectionType, tableRoot, columnDefinitions, nu
|
|
|
98
97
|
}
|
|
99
98
|
}, [shiftFocus, tableRoot]);
|
|
100
99
|
useEffect(() => {
|
|
101
|
-
const eventListeners = new Map();
|
|
102
|
-
// istanbul ignore if
|
|
103
100
|
if (!tableRoot.current) {
|
|
104
101
|
return;
|
|
105
102
|
}
|
|
106
103
|
const tableElement = tableRoot.current;
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
iterateTableCells(tableElement, (cell, rowIndex, columnIndex) => {
|
|
110
|
-
const listeners = eventListeners.get([rowIndex, columnIndex]);
|
|
111
|
-
if (listeners === null || listeners === void 0 ? void 0 : listeners.focusin) {
|
|
112
|
-
cell.removeEventListener('focusin', listeners.focusin);
|
|
113
|
-
}
|
|
114
|
-
});
|
|
115
|
-
tableElement.removeEventListener('keydown', handleArrowKeyEvents);
|
|
116
|
-
}
|
|
117
|
-
iterateTableCells(tableElement, (cell, rowIndex, cellIndex) => {
|
|
118
|
-
if (!focusableColumns[cellIndex]) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
const listenerFns = {
|
|
122
|
-
focusin: () => {
|
|
123
|
-
currentFocusCell.current = [rowIndex, cellIndex];
|
|
124
|
-
},
|
|
125
|
-
};
|
|
126
|
-
eventListeners.set([rowIndex, cellIndex], listenerFns);
|
|
127
|
-
cell.addEventListener('focusin', listenerFns.focusin, { passive: true });
|
|
128
|
-
});
|
|
129
|
-
tableElement.addEventListener('keydown', handleArrowKeyEvents);
|
|
130
|
-
return () => tableElement && cleanUpListeners();
|
|
104
|
+
tableRoot.current.addEventListener('keydown', handleArrowKeyEvents);
|
|
105
|
+
return () => tableElement && tableElement.removeEventListener('keydown', handleArrowKeyEvents);
|
|
131
106
|
}, [focusableColumns, handleArrowKeyEvents, tableRoot]);
|
|
132
107
|
}
|
|
133
108
|
export default useTableFocusNavigation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-focus-navigation.js","sourceRoot":"lib/default/","sources":["table/use-table-focus-navigation.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAa,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;AAGhF,SAAS,iBAAiB,CACxB,KAAQ,EACR,IAAiF;IAEjF,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,GAAwB,EAAE,QAAgB,EAAE,EAAE;QAClF,GAAG,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE;YACrD,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;QAClC,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC;AAED;;;;;;;;GAQG;AACH,SAAS,uBAAuB,CAC9B,aAA0C,EAC1C,SAAsC,EACtC,iBAAgC,EAChC,OAAe;IAEf,MAAM,gBAAgB,GAAG,MAAM,CAA0B,IAAI,CAAC,CAAC;IAE/D,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE;QACpC,MAAM,IAAI,GAAG,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;QAClE,IAAI,aAAa,EAAE;YACjB,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;SACrB;QACD,OAAO,IAAI,CAAC;IACd,CAAC,EAAE,CAAC,iBAAiB,EAAE,aAAa,CAAC,CAAC,CAAC;IAEvC,MAAM,cAAc,GAAG,gBAAgB,CAAC,MAAM,GAAG,CAAC,CAAC;IACnD,MAAM,cAAc,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE7C,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,QAAgB,EAAE,WAAmB,EAAE,EAAE;QACxC,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;YACtB,iBAAiB,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;;gBAC5D,IAAI,MAAM,KAAK,QAAQ,IAAI,MAAM,KAAK,WAAW,EAAE;oBACjD,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAA6B,CAAC;oBAEvF,IAAI,UAAU,EAAE;wBACd,MAAA,UAAU,CAAC,KAAK,0DAAI,CAAC;wBACrB,qBAAqB,CAAC,UAAU,CAAC,CAAC;qBACnC;iBACF;YACH,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,EACD,CAAC,SAAS,CAAC,CACZ,CAAC;IAEF,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,QAAoB,EAAE,UAAsB,EAAE,EAAE;QAC/C,0BAA0B;QAC1B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE;YAC7B,OAAO;SACR;QACD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,gBAAgB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;QACjE,IAAI,WAAW,GAAG,QAAQ,CAAC;QAC3B,IAAI,cAAc,GAAG,WAAW,CAAC;QAEjC,IAAI,QAAQ,KAAK,CAAC,EAAE;YAClB,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC;SACnE;QAED,IAAI,UAAU,KAAK,CAAC,EAAE;YACpB,OAAO,cAAc,IAAI,cAAc,IAAI,cAAc,IAAI,cAAc,EAAE;gBAC3E,cAAc,IAAI,UAAU,CAAC;gBAC7B,IAAI,gBAAgB,CAAC,cAAc,CAAC,EAAE;oBACpC,MAAM;iBACP;aACF;SACF;QAED,IACE,CAAC,QAAQ,KAAK,WAAW,IAAI,WAAW,KAAK,cAAc,CAAC;YAC5D,gBAAgB,CAAC,OAAO;YACxB,SAAS,CAAC,OAAO,EACjB;YACA,SAAS,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;SACxC;IACH,CAAC,EACD,CAAC,SAAS,EAAE,gBAAgB,EAAE,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,SAAS,CAAC,CAClF,CAAC;IAEF,MAAM,oBAAoB,GAAG,WAAW,CACtC,CAAC,KAAoB,EAAE,EAAE;;QACvB,MAAM,KAAK,GACT,CAAC,CAAC,CAAA,MAAA,SAAS,CAAC,OAAO,0CAAE,aAAa,CAAC,uCAAuC,CAAC,CAAA;YAC3E,CAAC,CAAA,MAAA,QAAQ,CAAC,aAAa,0CAAE,OAAO,CAAC,8BAA8B,CAAC,CAAA,CAAC;QAEnE,IAAI,KAAK,EAAE;YACT,OAAO;SACR;QACD,QAAQ,KAAK,CAAC,GAAG,EAAE;YACjB,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;gBAClB,MAAM;YACR,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;gBACjB,MAAM;YACR,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;gBAClB,MAAM;YACR,KAAK,YAAY;gBACf,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;gBACjB,MAAM;YACR,iEAAiE;YACjE;gBACE,OAAO;SACV;IACH,CAAC,EACD,CAAC,UAAU,EAAE,SAAS,CAAC,CACxB,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,IAAI,GAAG,EAAiD,CAAC;QAChF,qBAAqB;QACrB,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE;YACtB,OAAO;SACR;QAED,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO,CAAC;QAEvC,sEAAsE;QACtE,SAAS,gBAAgB;YACvB,iBAAiB,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE;gBAC9D,MAAM,SAAS,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC;gBAC9D,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;oBACtB,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;iBACxD;YACH,CAAC,CAAC,CAAC;YACH,YAAY,CAAC,mBAAmB,CAAC,SAAS,EAAE,oBAAoB,CAAC,CAAC;QACpE,CAAC;QAED,iBAAiB,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;YAC5D,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC,EAAE;gBAChC,OAAO;aACR;YACD,MAAM,WAAW,GAAG;gBAClB,OAAO,EAAE,GAAG,EAAE;oBACZ,gBAAgB,CAAC,OAAO,GAAG,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;gBACnD,CAAC;aACF,CAAC;YACF,cAAc,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAE,WAAW,CAAC,CAAC;YACvD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QAC3E,CAAC,CAAC,CAAC;QACH,YAAY,CAAC,gBAAgB,CAAC,SAAS,EAAE,oBAAoB,CAAC,CAAC;QAE/D,OAAO,GAAG,EAAE,CAAC,YAAY,IAAI,gBAAgB,EAAE,CAAC;IAClD,CAAC,EAAE,CAAC,gBAAgB,EAAE,oBAAoB,EAAE,SAAS,CAAC,CAAC,CAAC;AAC1D,CAAC;AAED,eAAe,uBAAuB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { RefObject, useCallback, useEffect, useMemo, useRef } from 'react';\nimport { scrollElementIntoView } from '../internal/utils/scrollable-containers';\nimport { TableProps } from './interfaces';\n\nfunction iterateTableCells<T extends HTMLElement>(\n table: T,\n func: (cell: HTMLTableCellElement, rowIndex: number, columnIndex: number) => void\n) {\n table.querySelectorAll('tr').forEach((row: HTMLTableRowElement, rowIndex: number) => {\n row.querySelectorAll('td').forEach((cell, cellIndex) => {\n func(cell, rowIndex, cellIndex);\n });\n });\n}\n\n/**\n * This hook is used to navigate between table cells using the keyboard arrow keys.\n * All the functionality is implemented in the hook, so the table component does not\n * need to implement any keyboard event handlers.\n * @param enable - Toggle functionality of the hook\n * @param tableRoot - A ref to a table container. Ideally the root element of the table (<table>); tbody is also acceptable.\n * @param columnDefinitions - The column definitions for the table.\n * @param numRows - The number of rows in the table.\n */\nfunction useTableFocusNavigation<T extends { editConfig?: TableProps.EditConfig<any> }>(\n selectionType: TableProps['selectionType'],\n tableRoot: RefObject<HTMLTableElement>,\n columnDefinitions: Readonly<T[]>,\n numRows: number\n) {\n const currentFocusCell = useRef<[number, number] | null>(null);\n\n const focusableColumns = useMemo(() => {\n const cols = columnDefinitions.map(column => !!column.editConfig);\n if (selectionType) {\n cols.unshift(false);\n }\n return cols;\n }, [columnDefinitions, selectionType]);\n\n const maxColumnIndex = focusableColumns.length - 1;\n const minColumnIndex = selectionType ? 1 : 0;\n\n const focusCell = useCallback(\n (rowIndex: number, columnIndex: number) => {\n if (tableRoot?.current) {\n iterateTableCells(tableRoot.current, (cell, rIndex, cIndex) => {\n if (rIndex === rowIndex && cIndex === columnIndex) {\n const editButton = cell.querySelector('button:last-child') as HTMLButtonElement | null;\n\n if (editButton) {\n editButton.focus?.();\n scrollElementIntoView(editButton);\n }\n }\n });\n }\n },\n [tableRoot]\n );\n\n const shiftFocus = useCallback(\n (vertical: -1 | 0 | 1, horizontal: -1 | 0 | 1) => {\n // istanbul ignore if next\n if (!currentFocusCell.current) {\n return;\n }\n const [rowIndex, columnIndex] = currentFocusCell.current.slice();\n let newRowIndex = rowIndex;\n let newColumnIndex = columnIndex;\n\n if (vertical !== 0) {\n newRowIndex = Math.min(numRows, Math.max(rowIndex + vertical, 0));\n }\n\n if (horizontal !== 0) {\n while (newColumnIndex <= maxColumnIndex && newColumnIndex >= minColumnIndex) {\n newColumnIndex += horizontal;\n if (focusableColumns[newColumnIndex]) {\n break;\n }\n }\n }\n\n if (\n (rowIndex !== newRowIndex || columnIndex !== newColumnIndex) &&\n currentFocusCell.current &&\n tableRoot.current\n ) {\n focusCell(newRowIndex, newColumnIndex);\n }\n },\n [focusCell, focusableColumns, maxColumnIndex, minColumnIndex, numRows, tableRoot]\n );\n\n const handleArrowKeyEvents = useCallback(\n (event: KeyboardEvent) => {\n const abort =\n !!tableRoot.current?.querySelector('[data-inline-editing-active = \"true\"]') ||\n !document.activeElement?.closest('[data-inline-editing-active]');\n\n if (abort) {\n return;\n }\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n shiftFocus(-1, 0);\n break;\n case 'ArrowDown':\n event.preventDefault();\n shiftFocus(1, 0);\n break;\n case 'ArrowLeft':\n event.preventDefault();\n shiftFocus(0, -1);\n break;\n case 'ArrowRight':\n event.preventDefault();\n shiftFocus(0, 1);\n break;\n // istanbul ignore next (default case = do nothing, not testable)\n default:\n return;\n }\n },\n [shiftFocus, tableRoot]\n );\n\n useEffect(() => {\n const eventListeners = new Map<[number, number], { focusin(evt: any): void }>();\n // istanbul ignore if\n if (!tableRoot.current) {\n return;\n }\n\n const tableElement = tableRoot.current;\n\n // istanbul ignore next (tested in use-focus-navigation.test.tsx#L210)\n function cleanUpListeners() {\n iterateTableCells(tableElement, (cell, rowIndex, columnIndex) => {\n const listeners = eventListeners.get([rowIndex, columnIndex]);\n if (listeners?.focusin) {\n cell.removeEventListener('focusin', listeners.focusin);\n }\n });\n tableElement.removeEventListener('keydown', handleArrowKeyEvents);\n }\n\n iterateTableCells(tableElement, (cell, rowIndex, cellIndex) => {\n if (!focusableColumns[cellIndex]) {\n return;\n }\n const listenerFns = {\n focusin: () => {\n currentFocusCell.current = [rowIndex, cellIndex];\n },\n };\n eventListeners.set([rowIndex, cellIndex], listenerFns);\n cell.addEventListener('focusin', listenerFns.focusin, { passive: true });\n });\n tableElement.addEventListener('keydown', handleArrowKeyEvents);\n\n return () => tableElement && cleanUpListeners();\n }, [focusableColumns, handleArrowKeyEvents, tableRoot]);\n}\n\nexport default useTableFocusNavigation;\n"]}
|
|
1
|
+
{"version":3,"file":"use-table-focus-navigation.js","sourceRoot":"lib/default/","sources":["table/use-table-focus-navigation.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { RefObject, useCallback, useEffect, useMemo } from 'react';\nimport { scrollElementIntoView } from '../internal/utils/scrollable-containers';\nimport { TableProps } from './interfaces';\n\nfunction iterateTableCells<T extends HTMLElement>(\n table: T,\n func: (cell: HTMLTableCellElement, rowIndex: number, columnIndex: number) => void\n) {\n table.querySelectorAll('tr').forEach((row: HTMLTableRowElement, rowIndex: number) => {\n row.querySelectorAll('td').forEach((cell, cellIndex) => {\n func(cell, rowIndex, cellIndex);\n });\n });\n}\n\n/**\n * This hook is used to navigate between table cells using the keyboard arrow keys.\n * All the functionality is implemented in the hook, so the table component does not\n * need to implement any keyboard event handlers.\n * @param enable - Toggle functionality of the hook\n * @param tableRoot - A ref to a table container. Ideally the root element of the table (<table>); tbody is also acceptable.\n * @param columnDefinitions - The column definitions for the table.\n * @param numRows - The number of rows in the table.\n */\nfunction useTableFocusNavigation<T extends { editConfig?: TableProps.EditConfig<any> }>(\n selectionType: TableProps['selectionType'],\n tableRoot: RefObject<HTMLTableElement>,\n columnDefinitions: Readonly<T[]>,\n numRows: number\n) {\n const focusableColumns = useMemo(() => {\n const cols = columnDefinitions.map(column => !!column.editConfig);\n if (selectionType) {\n cols.unshift(false);\n }\n return cols;\n }, [columnDefinitions, selectionType]);\n\n const maxColumnIndex = focusableColumns.length - 1;\n const minColumnIndex = selectionType ? 1 : 0;\n\n const focusCell = useCallback(\n (rowIndex: number, columnIndex: number) => {\n if (tableRoot?.current) {\n iterateTableCells(tableRoot.current, (cell, rIndex, cIndex) => {\n if (rIndex === rowIndex && cIndex === columnIndex) {\n const editButton = cell.querySelector('button:last-child') as HTMLButtonElement | null;\n\n if (editButton) {\n editButton.focus?.();\n scrollElementIntoView(editButton);\n }\n }\n });\n }\n },\n [tableRoot]\n );\n\n const shiftFocus = useCallback(\n (vertical: -1 | 0 | 1, horizontal: -1 | 0 | 1) => {\n const focusedCell = tableRoot.current?.querySelector<HTMLTableCellElement>('td:focus-within');\n if (!focusedCell) {\n return;\n }\n\n const columnIndex = focusedCell.cellIndex;\n const rowIndex = (focusedCell.parentElement as HTMLTableRowElement).rowIndex;\n\n let newRowIndex = rowIndex;\n let newColumnIndex = columnIndex;\n\n if (vertical !== 0) {\n newRowIndex = Math.min(numRows, Math.max(rowIndex + vertical, 0));\n }\n\n if (horizontal !== 0) {\n while (newColumnIndex <= maxColumnIndex && newColumnIndex >= minColumnIndex) {\n newColumnIndex += horizontal;\n if (focusableColumns[newColumnIndex]) {\n break;\n }\n }\n }\n\n if ((rowIndex !== newRowIndex || columnIndex !== newColumnIndex) && tableRoot.current) {\n focusCell(newRowIndex, newColumnIndex);\n }\n },\n [focusCell, focusableColumns, maxColumnIndex, minColumnIndex, numRows, tableRoot]\n );\n\n const handleArrowKeyEvents = useCallback(\n (event: KeyboardEvent) => {\n const abort =\n !!tableRoot.current?.querySelector('[data-inline-editing-active = \"true\"]') ||\n !document.activeElement?.closest('[data-inline-editing-active]');\n\n if (abort) {\n return;\n }\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n shiftFocus(-1, 0);\n break;\n case 'ArrowDown':\n event.preventDefault();\n shiftFocus(1, 0);\n break;\n case 'ArrowLeft':\n event.preventDefault();\n shiftFocus(0, -1);\n break;\n case 'ArrowRight':\n event.preventDefault();\n shiftFocus(0, 1);\n break;\n // istanbul ignore next (default case = do nothing, not testable)\n default:\n return;\n }\n },\n [shiftFocus, tableRoot]\n );\n\n useEffect(() => {\n if (!tableRoot.current) {\n return;\n }\n\n const tableElement = tableRoot.current;\n tableRoot.current.addEventListener('keydown', handleArrowKeyEvents);\n\n return () => tableElement && tableElement.removeEventListener('keydown', handleArrowKeyEvents);\n }, [focusableColumns, handleArrowKeyEvents, tableRoot]);\n}\n\nexport default useTableFocusNavigation;\n"]}
|
|
@@ -2,6 +2,7 @@ import { ComponentWrapper, ElementWrapper } from '@cloudscape-design/test-utils-
|
|
|
2
2
|
import CollectionPreferencesWrapper from '../collection-preferences';
|
|
3
3
|
import PaginationWrapper from '../pagination';
|
|
4
4
|
import TextFilterWrapper from '../text-filter';
|
|
5
|
+
import PropertyFilterWrapper from '../property-filter';
|
|
5
6
|
export default class TableWrapper extends ComponentWrapper {
|
|
6
7
|
static rootSelector: string;
|
|
7
8
|
private containerWrapper;
|
|
@@ -54,6 +55,8 @@ export default class TableWrapper extends ComponentWrapper {
|
|
|
54
55
|
findRowSelectionArea(rowIndex: number): ElementWrapper | null;
|
|
55
56
|
findSelectAllTrigger(): ElementWrapper | null;
|
|
56
57
|
findTextFilter(): TextFilterWrapper | null;
|
|
58
|
+
findPropertyFilter(): PropertyFilterWrapper | null;
|
|
59
|
+
findFilterSlot(): ElementWrapper | null;
|
|
57
60
|
findCollectionPreferences(): CollectionPreferencesWrapper | null;
|
|
58
61
|
findPagination(): PaginationWrapper | null;
|
|
59
62
|
/**
|
|
@@ -4,14 +4,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
// SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
const dom_1 = require("@cloudscape-design/test-utils-core/dom");
|
|
6
6
|
const styles_selectors_js_1 = require("../../../table/styles.selectors.js");
|
|
7
|
-
const styles_selectors_js_2 = require("../../../table/
|
|
8
|
-
const styles_selectors_js_3 = require("../../../table/
|
|
9
|
-
const styles_selectors_js_4 = require("../../../table/
|
|
10
|
-
const styles_selectors_js_5 = require("../../../table/resizer/styles.selectors.js");
|
|
7
|
+
const styles_selectors_js_2 = require("../../../table/body-cell/styles.selectors.js");
|
|
8
|
+
const styles_selectors_js_3 = require("../../../table/selection-control/styles.selectors.js");
|
|
9
|
+
const styles_selectors_js_4 = require("../../../table/resizer/styles.selectors.js");
|
|
11
10
|
const collection_preferences_1 = require("../collection-preferences");
|
|
12
11
|
const container_1 = require("../container");
|
|
13
12
|
const pagination_1 = require("../pagination");
|
|
14
13
|
const text_filter_1 = require("../text-filter");
|
|
14
|
+
const property_filter_1 = require("../property-filter");
|
|
15
15
|
class TableWrapper extends dom_1.ComponentWrapper {
|
|
16
16
|
constructor() {
|
|
17
17
|
super(...arguments);
|
|
@@ -45,7 +45,7 @@ class TableWrapper extends dom_1.ComponentWrapper {
|
|
|
45
45
|
* @param columnIndex 1-based index of the column containing the resizer.
|
|
46
46
|
*/
|
|
47
47
|
findColumnResizer(columnIndex) {
|
|
48
|
-
return this.findActiveTHead().find(`th:nth-child(${columnIndex}) .${
|
|
48
|
+
return this.findActiveTHead().find(`th:nth-child(${columnIndex}) .${styles_selectors_js_4.default.resizer}`);
|
|
49
49
|
}
|
|
50
50
|
/**
|
|
51
51
|
* Returns a table cell based on given row and column indices.
|
|
@@ -96,19 +96,20 @@ class TableWrapper extends dom_1.ComponentWrapper {
|
|
|
96
96
|
* @param rowIndex 1-based index of the row selection area to return.
|
|
97
97
|
*/
|
|
98
98
|
findRowSelectionArea(rowIndex) {
|
|
99
|
-
return this.findNativeTable().find(`tbody tr:nth-child(${rowIndex}) .${
|
|
99
|
+
return this.findNativeTable().find(`tbody tr:nth-child(${rowIndex}) .${styles_selectors_js_3.default.root}`);
|
|
100
100
|
}
|
|
101
101
|
findSelectAllTrigger() {
|
|
102
|
-
return this.findActiveTHead().find(`.${
|
|
102
|
+
return this.findActiveTHead().find(`.${styles_selectors_js_3.default.root}`);
|
|
103
103
|
}
|
|
104
104
|
findTextFilter() {
|
|
105
105
|
return this.findComponent(`.${styles_selectors_js_1.default['tools-filtering']}`, text_filter_1.default);
|
|
106
106
|
}
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
107
|
+
findPropertyFilter() {
|
|
108
|
+
return this.findComponent(`.${styles_selectors_js_1.default['tools-filtering']}`, property_filter_1.default);
|
|
109
|
+
}
|
|
110
|
+
findFilterSlot() {
|
|
111
|
+
return this.findComponent(`.${styles_selectors_js_1.default['tools-filtering']}`, dom_1.ElementWrapper);
|
|
112
|
+
}
|
|
112
113
|
findCollectionPreferences() {
|
|
113
114
|
return this.findComponent(`.${styles_selectors_js_1.default['tools-preferences']}`, collection_preferences_1.default);
|
|
114
115
|
}
|
|
@@ -123,14 +124,14 @@ class TableWrapper extends dom_1.ComponentWrapper {
|
|
|
123
124
|
*/
|
|
124
125
|
findEditCellButton(rowIndex, columnIndex) {
|
|
125
126
|
var _a, _b;
|
|
126
|
-
return (_b = (_a = this.findBodyCell(rowIndex, columnIndex)) === null || _a === void 0 ? void 0 : _a.findByClassName(
|
|
127
|
+
return (_b = (_a = this.findBodyCell(rowIndex, columnIndex)) === null || _a === void 0 ? void 0 : _a.findByClassName(styles_selectors_js_2.default['body-cell-editor'])) !== null && _b !== void 0 ? _b : null;
|
|
127
128
|
}
|
|
128
129
|
findEditingCell() {
|
|
129
|
-
return this.findNativeTable().findByClassName(
|
|
130
|
+
return this.findNativeTable().findByClassName(styles_selectors_js_2.default['body-cell-edit-active']);
|
|
130
131
|
}
|
|
131
132
|
_findEditingCellControls() {
|
|
132
133
|
var _a, _b;
|
|
133
|
-
return (_b = (_a = this.findEditingCell()) === null || _a === void 0 ? void 0 : _a.findByClassName(
|
|
134
|
+
return (_b = (_a = this.findEditingCell()) === null || _a === void 0 ? void 0 : _a.findByClassName(styles_selectors_js_2.default['body-cell-editor-controls'])) !== null && _b !== void 0 ? _b : null;
|
|
134
135
|
}
|
|
135
136
|
findEditingCellSaveButton() {
|
|
136
137
|
var _a, _b;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/table/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAC1F,4EAAwD;AACxD,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/table/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -2,6 +2,7 @@ import { ComponentWrapper, ElementWrapper } from "@cloudscape-design/test-utils-
|
|
|
2
2
|
import CollectionPreferencesWrapper from '../collection-preferences';
|
|
3
3
|
import PaginationWrapper from '../pagination';
|
|
4
4
|
import TextFilterWrapper from '../text-filter';
|
|
5
|
+
import PropertyFilterWrapper from '../property-filter';
|
|
5
6
|
export default class TableWrapper extends ComponentWrapper {
|
|
6
7
|
static rootSelector: string;
|
|
7
8
|
private containerWrapper;
|
|
@@ -54,6 +55,8 @@ export default class TableWrapper extends ComponentWrapper {
|
|
|
54
55
|
findRowSelectionArea(rowIndex: number): ElementWrapper;
|
|
55
56
|
findSelectAllTrigger(): ElementWrapper;
|
|
56
57
|
findTextFilter(): TextFilterWrapper;
|
|
58
|
+
findPropertyFilter(): PropertyFilterWrapper;
|
|
59
|
+
findFilterSlot(): ElementWrapper;
|
|
57
60
|
findCollectionPreferences(): CollectionPreferencesWrapper;
|
|
58
61
|
findPagination(): PaginationWrapper;
|
|
59
62
|
/**
|
|
@@ -4,14 +4,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
// SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
const selectors_1 = require("@cloudscape-design/test-utils-core/selectors");
|
|
6
6
|
const styles_selectors_js_1 = require("../../../table/styles.selectors.js");
|
|
7
|
-
const styles_selectors_js_2 = require("../../../table/
|
|
8
|
-
const styles_selectors_js_3 = require("../../../table/
|
|
9
|
-
const styles_selectors_js_4 = require("../../../table/
|
|
10
|
-
const styles_selectors_js_5 = require("../../../table/resizer/styles.selectors.js");
|
|
7
|
+
const styles_selectors_js_2 = require("../../../table/body-cell/styles.selectors.js");
|
|
8
|
+
const styles_selectors_js_3 = require("../../../table/selection-control/styles.selectors.js");
|
|
9
|
+
const styles_selectors_js_4 = require("../../../table/resizer/styles.selectors.js");
|
|
11
10
|
const collection_preferences_1 = require("../collection-preferences");
|
|
12
11
|
const container_1 = require("../container");
|
|
13
12
|
const pagination_1 = require("../pagination");
|
|
14
13
|
const text_filter_1 = require("../text-filter");
|
|
14
|
+
const property_filter_1 = require("../property-filter");
|
|
15
15
|
class TableWrapper extends selectors_1.ComponentWrapper {
|
|
16
16
|
constructor() {
|
|
17
17
|
super(...arguments);
|
|
@@ -45,7 +45,7 @@ class TableWrapper extends selectors_1.ComponentWrapper {
|
|
|
45
45
|
* @param columnIndex 1-based index of the column containing the resizer.
|
|
46
46
|
*/
|
|
47
47
|
findColumnResizer(columnIndex) {
|
|
48
|
-
return this.findActiveTHead().find(`th:nth-child(${columnIndex}) .${
|
|
48
|
+
return this.findActiveTHead().find(`th:nth-child(${columnIndex}) .${styles_selectors_js_4.default.resizer}`);
|
|
49
49
|
}
|
|
50
50
|
/**
|
|
51
51
|
* Returns a table cell based on given row and column indices.
|
|
@@ -96,19 +96,20 @@ class TableWrapper extends selectors_1.ComponentWrapper {
|
|
|
96
96
|
* @param rowIndex 1-based index of the row selection area to return.
|
|
97
97
|
*/
|
|
98
98
|
findRowSelectionArea(rowIndex) {
|
|
99
|
-
return this.findNativeTable().find(`tbody tr:nth-child(${rowIndex}) .${
|
|
99
|
+
return this.findNativeTable().find(`tbody tr:nth-child(${rowIndex}) .${styles_selectors_js_3.default.root}`);
|
|
100
100
|
}
|
|
101
101
|
findSelectAllTrigger() {
|
|
102
|
-
return this.findActiveTHead().find(`.${
|
|
102
|
+
return this.findActiveTHead().find(`.${styles_selectors_js_3.default.root}`);
|
|
103
103
|
}
|
|
104
104
|
findTextFilter() {
|
|
105
105
|
return this.findComponent(`.${styles_selectors_js_1.default['tools-filtering']}`, text_filter_1.default);
|
|
106
106
|
}
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
107
|
+
findPropertyFilter() {
|
|
108
|
+
return this.findComponent(`.${styles_selectors_js_1.default['tools-filtering']}`, property_filter_1.default);
|
|
109
|
+
}
|
|
110
|
+
findFilterSlot() {
|
|
111
|
+
return this.findComponent(`.${styles_selectors_js_1.default['tools-filtering']}`, selectors_1.ElementWrapper);
|
|
112
|
+
}
|
|
112
113
|
findCollectionPreferences() {
|
|
113
114
|
return this.findComponent(`.${styles_selectors_js_1.default['tools-preferences']}`, collection_preferences_1.default);
|
|
114
115
|
}
|
|
@@ -123,14 +124,14 @@ class TableWrapper extends selectors_1.ComponentWrapper {
|
|
|
123
124
|
*/
|
|
124
125
|
findEditCellButton(rowIndex, columnIndex) {
|
|
125
126
|
var _a, _b;
|
|
126
|
-
return (_b = (_a = this.findBodyCell(rowIndex, columnIndex)) === null || _a === void 0 ? void 0 : _a.findByClassName(
|
|
127
|
+
return (_b = (_a = this.findBodyCell(rowIndex, columnIndex)) === null || _a === void 0 ? void 0 : _a.findByClassName(styles_selectors_js_2.default['body-cell-editor'])) !== null && _b !== void 0 ? _b : null;
|
|
127
128
|
}
|
|
128
129
|
findEditingCell() {
|
|
129
|
-
return this.findNativeTable().findByClassName(
|
|
130
|
+
return this.findNativeTable().findByClassName(styles_selectors_js_2.default['body-cell-edit-active']);
|
|
130
131
|
}
|
|
131
132
|
_findEditingCellControls() {
|
|
132
133
|
var _a, _b;
|
|
133
|
-
return (_b = (_a = this.findEditingCell()) === null || _a === void 0 ? void 0 : _a.findByClassName(
|
|
134
|
+
return (_b = (_a = this.findEditingCell()) === null || _a === void 0 ? void 0 : _a.findByClassName(styles_selectors_js_2.default['body-cell-editor-controls'])) !== null && _b !== void 0 ? _b : null;
|
|
134
135
|
}
|
|
135
136
|
findEditingCellSaveButton() {
|
|
136
137
|
var _a, _b;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/table/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,4EAAwD;AACxD,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/table/index.ts"],"names":[],"mappings":"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"}
|