npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.332 → 3.0.334 - Mend

@cloudscape-design/components-themeable 3.0.332 → 3.0.334

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (111) hide show

package/lib/internal/template/table/styles.selectors.js CHANGED Viewed

@@ -2,37 +2,39 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_wih1l_1737l_97",
-  "tools": "awsui_tools_wih1l_1737l_108",
-  "tools-filtering": "awsui_tools-filtering_wih1l_1737l_114",
-  "tools-align-right": "awsui_tools-align-right_wih1l_1737l_128",
-  "tools-pagination": "awsui_tools-pagination_wih1l_1737l_132",
-  "tools-preferences": "awsui_tools-preferences_wih1l_1737l_132",
-  "tools-small": "awsui_tools-small_wih1l_1737l_138",
-  "table": "awsui_table_wih1l_1737l_144",
-  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_1737l_150",
-  "wrapper": "awsui_wrapper_wih1l_1737l_154",
-  "variant-stacked": "awsui_variant-stacked_wih1l_1737l_163",
-  "variant-container": "awsui_variant-container_wih1l_1737l_163",
-  "variant-embedded": "awsui_variant-embedded_wih1l_1737l_167",
-  "variant-borderless": "awsui_variant-borderless_wih1l_1737l_167",
-  "has-header": "awsui_has-header_wih1l_1737l_170",
-  "has-footer": "awsui_has-footer_wih1l_1737l_173",
-  "cell-merged": "awsui_cell-merged_wih1l_1737l_190",
-  "cell-merged-content": "awsui_cell-merged-content_wih1l_1737l_201",
-  "empty": "awsui_empty_wih1l_1737l_216",
-  "loading": "awsui_loading_wih1l_1737l_220",
-  "selection-control": "awsui_selection-control_wih1l_1737l_229",
-  "selection-control-header": "awsui_selection-control-header_wih1l_1737l_236",
-  "dark-header": "awsui_dark-header_wih1l_1737l_245",
-  "header-secondary": "awsui_header-secondary_wih1l_1737l_250",
-  "table-has-header": "awsui_table-has-header_wih1l_1737l_266",
-  "header-controls": "awsui_header-controls_wih1l_1737l_270",
-  "variant-full-page": "awsui_variant-full-page_wih1l_1737l_274",
-  "footer-wrapper": "awsui_footer-wrapper_wih1l_1737l_287",
-  "footer": "awsui_footer_wih1l_1737l_287",
-  "thead-active": "awsui_thead-active_wih1l_1737l_296",
-  "row": "awsui_row_wih1l_1737l_297",
-  "row-selected": "awsui_row-selected_wih1l_1737l_298"
+  "root": "awsui_root_wih1l_wgtok_97",
+  "tools": "awsui_tools_wih1l_wgtok_108",
+  "tools-filtering": "awsui_tools-filtering_wih1l_wgtok_114",
+  "tools-align-right": "awsui_tools-align-right_wih1l_wgtok_128",
+  "tools-pagination": "awsui_tools-pagination_wih1l_wgtok_132",
+  "tools-preferences": "awsui_tools-preferences_wih1l_wgtok_132",
+  "tools-small": "awsui_tools-small_wih1l_wgtok_138",
+  "table": "awsui_table_wih1l_wgtok_144",
+  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_wgtok_150",
+  "wrapper": "awsui_wrapper_wih1l_wgtok_154",
+  "variant-stacked": "awsui_variant-stacked_wih1l_wgtok_163",
+  "variant-container": "awsui_variant-container_wih1l_wgtok_163",
+  "variant-embedded": "awsui_variant-embedded_wih1l_wgtok_167",
+  "variant-borderless": "awsui_variant-borderless_wih1l_wgtok_167",
+  "has-header": "awsui_has-header_wih1l_wgtok_170",
+  "has-footer": "awsui_has-footer_wih1l_wgtok_173",
+  "cell-merged": "awsui_cell-merged_wih1l_wgtok_190",
+  "cell-merged-content": "awsui_cell-merged-content_wih1l_wgtok_201",
+  "empty": "awsui_empty_wih1l_wgtok_216",
+  "loading": "awsui_loading_wih1l_wgtok_220",
+  "selection-control": "awsui_selection-control_wih1l_wgtok_229",
+  "selection-control-header": "awsui_selection-control-header_wih1l_wgtok_236",
+  "dark-header": "awsui_dark-header_wih1l_wgtok_245",
+  "header-secondary": "awsui_header-secondary_wih1l_wgtok_250",
+  "table-has-header": "awsui_table-has-header_wih1l_wgtok_266",
+  "header-controls": "awsui_header-controls_wih1l_wgtok_270",
+  "variant-full-page": "awsui_variant-full-page_wih1l_wgtok_274",
+  "footer-wrapper": "awsui_footer-wrapper_wih1l_wgtok_287",
+  "footer": "awsui_footer_wih1l_wgtok_287",
+  "footer-with-pagination": "awsui_footer-with-pagination_wih1l_wgtok_295",
+  "footer-pagination": "awsui_footer-pagination_wih1l_wgtok_303",
+  "thead-active": "awsui_thead-active_wih1l_wgtok_307",
+  "row": "awsui_row_wih1l_wgtok_308",
+  "row-selected": "awsui_row-selected_wih1l_wgtok_309"
 };

package/lib/internal/template/table/thead.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"thead.d.ts","sourceRoot":"lib/default/","sources":["table/thead.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAgB,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AASvF,OAAO,EAAE,kBAAkB,EAAuB,MAAM,kBAAkB,CAAC;AAE3E,MAAM,MAAM,oBAAoB,GAC5B;IAAE,IAAI,EAAE,WAAW,CAAA;CAAE,GACrB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,MAAM,WAAW,UAAU;IACzB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,aAAa,EAAE,UAAU,CAAC,aAAa,GAAG,SAAS,CAAC;IACpD,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;IACnE,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IACzD,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,iBAAiB,EAAE,MAAM,cAAc,CAAC;IACxC,WAAW,EAAE,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtG,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC5D,eAAe,EAAE,yBAAyB,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;IACrF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC/C,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3E;AAED,QAAA,MAAM,KAAK,~~wFAgIV~~,CAAC;AAEF,eAAe,KAAK,CAAC"}
1	+ {"version":3,"file":"thead.d.ts","sourceRoot":"lib/default/","sources":["table/thead.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAgB,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AASvF,OAAO,EAAE,kBAAkB,EAAuB,MAAM,kBAAkB,CAAC;AAE3E,MAAM,MAAM,oBAAoB,GAC5B;IAAE,IAAI,EAAE,WAAW,CAAA;CAAE,GACrB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,MAAM,WAAW,UAAU;IACzB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,aAAa,EAAE,UAAU,CAAC,aAAa,GAAG,SAAS,CAAC;IACpD,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC;IACnE,aAAa,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IACzD,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,UAAU,CAAC,OAAO,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,iBAAiB,EAAE,MAAM,cAAc,CAAC;IACxC,WAAW,EAAE,CAAC,CAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACtG,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC5D,eAAe,EAAE,yBAAyB,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;IACrF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC/C,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3E;AAED,QAAA,MAAM,KAAK,wFAmIV,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/internal/template/table/thead.js CHANGED Viewed

@@ -18,7 +18,7 @@ const Thead = React.forwardRef(({ containerWidth, selectionType, getSelectAllPro
     const isVisualRefresh = useVisualRefresh();
     const headerCellClass = clsx(headerCellStyles['header-cell'], headerCellStyles[`header-cell-variant-${variant}`], sticky && headerCellStyles['header-cell-sticky'], stuck && headerCellStyles['header-cell-stuck'], stripedRows && headerCellStyles['has-striped-rows'], isVisualRefresh && headerCellStyles['is-visual-refresh']);
     const selectionCellClass = clsx(styles['selection-control'], styles['selection-control-header'], isVisualRefresh && styles['is-visual-refresh']);
-    const { columnWidths, totalWidth, updateColumn } = useColumnWidths();
+    const { columnWidths, totalWidth, updateColumn, setCell } = useColumnWidths();
     const stickyStyles = useStickyCellStyles({
         stickyColumns: stickyState,
         columnId: selectionColumnId,
@@ -30,23 +30,23 @@ const Thead = React.forwardRef(({ containerWidth, selectionType, getSelectAllPro
                     onFocusMove(event.target, -1, +1);
                 }, focusedComponent: focusedComponent, onFocusedComponentChange: onFocusedComponentChange }, getSelectAllProps(), (sticky ? { tabIndex: -1 } : {})))) : (React.createElement(ScreenreaderOnly, null, singleSelectionHeaderAriaLabel)))) : null,
             columnDefinitions.map((column, colIndex) => {
-                var _a;
+                const columnId = getColumnKey(column, colIndex);
                 let widthOverride;
                 if (resizableColumns) {
                     if (columnWidths) {
                         // use stateful value if available
-                        widthOverride = columnWidths[getColumnKey(column, colIndex)];
+                        widthOverride = columnWidths[columnId];
                     }
                     if (colIndex === columnDefinitions.length - 1 && containerWidth && containerWidth > totalWidth) {
                         // let the last column grow and fill the container width
                         widthOverride = 'auto';
                     }
                 }
-                return (React.createElement(TableHeaderCell, { key: getColumnKey(column, colIndex), className: headerCellClass, style: {
+                return (React.createElement(TableHeaderCell, { key: columnId, className: headerCellClass, style: {
                         width: widthOverride || column.width,
                         minWidth: sticky ? undefined : column.minWidth,
                         maxWidth: resizableColumns || sticky ? undefined : column.maxWidth,
-                    }, tabIndex: sticky ? -1 : 0, focusedComponent: focusedComponent, onFocusedComponentChange: onFocusedComponentChange, column: column, activeSortingColumn: sortingColumn, sortingDescending: sortingDescending, sortingDisabled: sortingDisabled, wrapLines: wrapLines, hidden: hidden, colIndex: colIndex, columnId: (_a = column.id) !== null && _a !== void 0 ? _a : colIndex, updateColumn: updateColumn, onResizeFinish: () => onResizeFinish(columnWidths), resizableColumns: resizableColumns, onClick: detail => fireNonCancelableEvent(onSortingChange, detail), isEditable: !!column.editConfig, stickyState: stickyState }));
+                    }, tabIndex: sticky ? -1 : 0, focusedComponent: focusedComponent, onFocusedComponentChange: onFocusedComponentChange, column: column, activeSortingColumn: sortingColumn, sortingDescending: sortingDescending, sortingDisabled: sortingDisabled, wrapLines: wrapLines, hidden: hidden, colIndex: colIndex, columnId: columnId, updateColumn: updateColumn, onResizeFinish: () => onResizeFinish(columnWidths), resizableColumns: resizableColumns, onClick: detail => fireNonCancelableEvent(onSortingChange, detail), isEditable: !!column.editConfig, stickyState: stickyState, cellRef: node => setCell(columnId, node) }));
             }))));
 });
 export default Thead;

package/lib/internal/template/table/thead.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"thead.js","sourceRoot":"lib/default/","sources":["table/thead.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 clsx from 'clsx';\nimport React from 'react';\nimport { TableProps } from './interfaces';\nimport SelectionControl from './selection-control';\nimport { focusMarkers, SelectionProps } from './use-selection';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { getColumnKey, getStickyClassNames } from './utils';\nimport { TableHeaderCell } from './header-cell';\nimport { useColumnWidths } from './use-column-widths';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport cellStyles from './header-cell/styles.css.js';\nimport headerCellStyles from './header-cell/styles.css.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { StickyColumnsModel, useStickyCellStyles } from './sticky-columns';\n\nexport type InteractiveComponent =\n \| { type: 'selection' }\n \| { type: 'column'; col: number }\n \| { type: 'resizer'; col: number };\n\nexport interface TheadProps {\n containerWidth: number \| null;\n selectionType: TableProps.SelectionType \| undefined;\n columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n sortingColumn: TableProps.SortingColumn<any> \| undefined;\n sortingDescending: boolean \| undefined;\n sortingDisabled: boolean \| undefined;\n variant: TableProps.Variant;\n wrapLines: boolean \| undefined;\n resizableColumns: boolean \| undefined;\n getSelectAllProps: () => SelectionProps;\n onFocusMove: ((sourceElement: HTMLElement, fromIndex: number, direction: -1 \| 1) => void) \| undefined;\n onResizeFinish: (newWidths: Record<string, number>) => void;\n onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> \| undefined;\n sticky?: boolean;\n hidden?: boolean;\n stuck?: boolean;\n singleSelectionHeaderAriaLabel?: string;\n stripedRows?: boolean;\n stickyState: StickyColumnsModel;\n selectionColumnId: PropertyKey;\n focusedComponent?: InteractiveComponent \| null;\n onFocusedComponentChange?: (element: InteractiveComponent \| null) => void;\n}\n\nconst Thead = React.forwardRef(\n (\n {\n containerWidth,\n selectionType,\n getSelectAllProps,\n columnDefinitions,\n sortingColumn,\n sortingDisabled,\n sortingDescending,\n resizableColumns,\n variant,\n wrapLines,\n onFocusMove,\n onSortingChange,\n onResizeFinish,\n singleSelectionHeaderAriaLabel,\n stripedRows,\n sticky = false,\n hidden = false,\n stuck = false,\n stickyState,\n selectionColumnId,\n focusedComponent,\n onFocusedComponentChange,\n }: TheadProps,\n outerRef: React.Ref<HTMLTableRowElement>\n ) => {\n const isVisualRefresh = useVisualRefresh();\n\n const headerCellClass = clsx(\n headerCellStyles['header-cell'],\n headerCellStyles[`header-cell-variant-${variant}`],\n sticky && headerCellStyles['header-cell-sticky'],\n stuck && headerCellStyles['header-cell-stuck'],\n stripedRows && headerCellStyles['has-striped-rows'],\n isVisualRefresh && headerCellStyles['is-visual-refresh']\n );\n\n const selectionCellClass = clsx(\n styles['selection-control'],\n styles['selection-control-header'],\n isVisualRefresh && styles['is-visual-refresh']\n );\n\n const { columnWidths, totalWidth, updateColumn } = useColumnWidths();\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId: selectionColumnId,\n getClassName: props => getStickyClassNames(cellStyles, props),\n });\n return (\n <thead className={clsx(!hidden && styles['thead-active'])}>\n <tr {...focusMarkers.all} ref={outerRef} aria-rowindex={1}>\n {selectionType ? (\n <th\n className={clsx(\n headerCellClass,\n selectionCellClass,\n hidden && headerCellStyles['header-cell-hidden'],\n stickyStyles.className\n )}\n style={stickyStyles.style}\n ref={stickyStyles.ref}\n scope=\"col\"\n >\n {selectionType === 'multi' ? (\n <SelectionControl\n onFocusDown={event => {\n onFocusMove!(event.target as HTMLElement, -1, +1);\n }}\n focusedComponent={focusedComponent}\n onFocusedComponentChange={onFocusedComponentChange}\n {...getSelectAllProps()}\n {...(sticky ? { tabIndex: -1 } : {})}\n />\n ) : (\n <ScreenreaderOnly>{singleSelectionHeaderAriaLabel}</ScreenreaderOnly>\n )}\n </th>\n ) : null}\n\n {columnDefinitions.map((column, colIndex) => {\n let widthOverride;\n if (resizableColumns) {\n if (columnWidths) {\n // use stateful value if available\n widthOverride = columnWidths[getColumnKey(column, colIndex)];\n }\n if (colIndex === columnDefinitions.length - 1 && containerWidth && containerWidth > totalWidth) {\n // let the last column grow and fill the container width\n widthOverride = 'auto';\n }\n }\n return (\n <TableHeaderCell\n key={getColumnKey(column, colIndex)}\n className={headerCellClass}\n style={{\n width: widthOverride \|\| column.width,\n minWidth: sticky ? undefined : column.minWidth,\n maxWidth: resizableColumns \|\| sticky ? undefined : column.maxWidth,\n }}\n tabIndex={sticky ? -1 : 0}\n focusedComponent={focusedComponent}\n onFocusedComponentChange={onFocusedComponentChange}\n column={column}\n activeSortingColumn={sortingColumn}\n sortingDescending={sortingDescending}\n sortingDisabled={sortingDisabled}\n wrapLines={wrapLines}\n hidden={hidden}\n colIndex={colIndex}\n columnId={column.id ?? colIndex}\n updateColumn={updateColumn}\n onResizeFinish={() => onResizeFinish(columnWidths)}\n resizableColumns={resizableColumns}\n onClick={detail => fireNonCancelableEvent(onSortingChange, detail)}\n isEditable={!!column.editConfig}\n stickyState={stickyState}\n />\n );\n })}\n </tr>\n </thead>\n );\n }\n);\n\nexport default Thead;\n"]}
1	+ {"version":3,"file":"thead.js","sourceRoot":"lib/default/","sources":["table/thead.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 clsx from 'clsx';\nimport React from 'react';\nimport { TableProps } from './interfaces';\nimport SelectionControl from './selection-control';\nimport { focusMarkers, SelectionProps } from './use-selection';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { getColumnKey, getStickyClassNames } from './utils';\nimport { TableHeaderCell } from './header-cell';\nimport { useColumnWidths } from './use-column-widths';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport cellStyles from './header-cell/styles.css.js';\nimport headerCellStyles from './header-cell/styles.css.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { StickyColumnsModel, useStickyCellStyles } from './sticky-columns';\n\nexport type InteractiveComponent =\n \| { type: 'selection' }\n \| { type: 'column'; col: number }\n \| { type: 'resizer'; col: number };\n\nexport interface TheadProps {\n containerWidth: number \| null;\n selectionType: TableProps.SelectionType \| undefined;\n columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>;\n sortingColumn: TableProps.SortingColumn<any> \| undefined;\n sortingDescending: boolean \| undefined;\n sortingDisabled: boolean \| undefined;\n variant: TableProps.Variant;\n wrapLines: boolean \| undefined;\n resizableColumns: boolean \| undefined;\n getSelectAllProps: () => SelectionProps;\n onFocusMove: ((sourceElement: HTMLElement, fromIndex: number, direction: -1 \| 1) => void) \| undefined;\n onResizeFinish: (newWidths: Record<string, number>) => void;\n onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> \| undefined;\n sticky?: boolean;\n hidden?: boolean;\n stuck?: boolean;\n singleSelectionHeaderAriaLabel?: string;\n stripedRows?: boolean;\n stickyState: StickyColumnsModel;\n selectionColumnId: PropertyKey;\n focusedComponent?: InteractiveComponent \| null;\n onFocusedComponentChange?: (element: InteractiveComponent \| null) => void;\n}\n\nconst Thead = React.forwardRef(\n (\n {\n containerWidth,\n selectionType,\n getSelectAllProps,\n columnDefinitions,\n sortingColumn,\n sortingDisabled,\n sortingDescending,\n resizableColumns,\n variant,\n wrapLines,\n onFocusMove,\n onSortingChange,\n onResizeFinish,\n singleSelectionHeaderAriaLabel,\n stripedRows,\n sticky = false,\n hidden = false,\n stuck = false,\n stickyState,\n selectionColumnId,\n focusedComponent,\n onFocusedComponentChange,\n }: TheadProps,\n outerRef: React.Ref<HTMLTableRowElement>\n ) => {\n const isVisualRefresh = useVisualRefresh();\n\n const headerCellClass = clsx(\n headerCellStyles['header-cell'],\n headerCellStyles[`header-cell-variant-${variant}`],\n sticky && headerCellStyles['header-cell-sticky'],\n stuck && headerCellStyles['header-cell-stuck'],\n stripedRows && headerCellStyles['has-striped-rows'],\n isVisualRefresh && headerCellStyles['is-visual-refresh']\n );\n\n const selectionCellClass = clsx(\n styles['selection-control'],\n styles['selection-control-header'],\n isVisualRefresh && styles['is-visual-refresh']\n );\n\n const { columnWidths, totalWidth, updateColumn, setCell } = useColumnWidths();\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId: selectionColumnId,\n getClassName: props => getStickyClassNames(cellStyles, props),\n });\n return (\n <thead className={clsx(!hidden && styles['thead-active'])}>\n <tr {...focusMarkers.all} ref={outerRef} aria-rowindex={1}>\n {selectionType ? (\n <th\n className={clsx(\n headerCellClass,\n selectionCellClass,\n hidden && headerCellStyles['header-cell-hidden'],\n stickyStyles.className\n )}\n style={stickyStyles.style}\n ref={stickyStyles.ref}\n scope=\"col\"\n >\n {selectionType === 'multi' ? (\n <SelectionControl\n onFocusDown={event => {\n onFocusMove!(event.target as HTMLElement, -1, +1);\n }}\n focusedComponent={focusedComponent}\n onFocusedComponentChange={onFocusedComponentChange}\n {...getSelectAllProps()}\n {...(sticky ? { tabIndex: -1 } : {})}\n />\n ) : (\n <ScreenreaderOnly>{singleSelectionHeaderAriaLabel}</ScreenreaderOnly>\n )}\n </th>\n ) : null}\n\n {columnDefinitions.map((column, colIndex) => {\n const columnId = getColumnKey(column, colIndex);\n\n let widthOverride;\n if (resizableColumns) {\n if (columnWidths) {\n // use stateful value if available\n widthOverride = columnWidths[columnId];\n }\n if (colIndex === columnDefinitions.length - 1 && containerWidth && containerWidth > totalWidth) {\n // let the last column grow and fill the container width\n widthOverride = 'auto';\n }\n }\n return (\n <TableHeaderCell\n key={columnId}\n className={headerCellClass}\n style={{\n width: widthOverride \|\| column.width,\n minWidth: sticky ? undefined : column.minWidth,\n maxWidth: resizableColumns \|\| sticky ? undefined : column.maxWidth,\n }}\n tabIndex={sticky ? -1 : 0}\n focusedComponent={focusedComponent}\n onFocusedComponentChange={onFocusedComponentChange}\n column={column}\n activeSortingColumn={sortingColumn}\n sortingDescending={sortingDescending}\n sortingDisabled={sortingDisabled}\n wrapLines={wrapLines}\n hidden={hidden}\n colIndex={colIndex}\n columnId={columnId}\n updateColumn={updateColumn}\n onResizeFinish={() => onResizeFinish(columnWidths)}\n resizableColumns={resizableColumns}\n onClick={detail => fireNonCancelableEvent(onSortingChange, detail)}\n isEditable={!!column.editConfig}\n stickyState={stickyState}\n cellRef={node => setCell(columnId, node)}\n />\n );\n })}\n </tr>\n </thead>\n );\n }\n);\n\nexport default Thead;\n"]}

package/lib/internal/template/table/use-column-widths.d.ts CHANGED Viewed

@@ -1,23 +1,23 @@
 import React from 'react';
 export declare const DEFAULT_COLUMN_WIDTH = 120;
+export interface ColumnWidthDefinition {
+    id: PropertyKey;
+    minWidth?: string | number;
+    width?: string | number;
+}
 interface WidthsContext {
     totalWidth: number;
     columnWidths: Record<PropertyKey, number>;
     updateColumn: (columnId: PropertyKey, newWidth: number) => void;
+    setCell: (columnId: PropertyKey, node: null | HTMLElement) => void;
 }
 declare const WidthsContext: React.Context<WidthsContext>;
 interface WidthProviderProps {
-    tableRef: React.MutableRefObject<HTMLElement | null>;
-    visibleColumns: readonly Column[];
+    visibleColumns: readonly ColumnWidthDefinition[];
     resizableColumns: boolean | undefined;
     children: React.ReactNode;
 }
-interface Column {
-    id: PropertyKey;
-    minWidth?: string | number;
-    width?: string | number;
-}
-export declare function ColumnWidthsProvider({ tableRef, visibleColumns, resizableColumns, children }: WidthProviderProps): JSX.Element;
+export declare function ColumnWidthsProvider({ visibleColumns, resizableColumns, children }: WidthProviderProps): JSX.Element;
 export declare function useColumnWidths(): WidthsContext;
 export {};
 //# sourceMappingURL=use-column-widths.d.ts.map

package/lib/internal/template/table/use-column-widths.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-column-widths.d.ts","sourceRoot":"lib/default/","sources":["table/use-column-widths.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;~~AAGtF~~,eAAO,MAAM,oBAAoB,MAAM,CAAC;~~AAoCxC~~,UAAU,aAAa;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IAC1C,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;~~CACjE;AAED~~,~~QAAA~~,~~MAAM~~,~~aAAa,8BAIjB,~~CAAC~~;AAEH~~,~~UAAU~~,~~kBAAkB;IAC1B~~,~~QAAQ~~,EAAE,~~KAAK~~,~~CAAC~~,~~gBAAgB~~,~~CAAC~~,WAAW,~~GAAG~~,IAAI,CAAC,CAAC;~~IACrD~~,cAAc,EAAE,SAAS,~~MAAM~~,EAAE,CAAC;~~IAClC~~,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,~~UAAU,MAAM;IACd,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,~~wBAAgB,oBAAoB,CAAC,EAAE,~~QAAQ,EAAE,~~cAAc,EAAE,gBAAgB,EAAE,QAAQ,EAAE,EAAE,kBAAkB,~~eA8ChH~~;AAED,wBAAgB,eAAe,kBAE9B"}
1	+ {"version":3,"file":"use-column-widths.d.ts","sourceRoot":"lib/default/","sources":["table/use-column-widths.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAEtF,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAsCD,UAAU,aAAa;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IAC1C,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,GAAG,WAAW,KAAK,IAAI,CAAC;CACpE;AAED,QAAA,MAAM,aAAa,8BAKjB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,cAAc,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACjD,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eA6DtG;AAED,wBAAgB,eAAe,kBAE9B"}

package/lib/internal/template/table/use-column-widths.js CHANGED Viewed

@@ -1,9 +1,9 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { useEffect, useRef, useState, createContext, useContext } from 'react';
-import headerCellStyles from './header-cell/styles.css.js';
 export const DEFAULT_COLUMN_WIDTH = 120;
-function readWidths(headerEl, visibleColumns) {
+function readWidths(getCell, visibleColumns) {
+    var _a;
     const result = {};
     for (let index = 0; index < visibleColumns.length; index++) {
         const column = visibleColumns[index];
@@ -12,9 +12,8 @@ function readWidths(headerEl, visibleColumns) {
         if (!width && // read width from the DOM if it is missing in the config
             index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container
         ) {
-            const colIndex = index + 1;
-            const colEl = headerEl.querySelector(`.${headerCellStyles['header-cell']}:nth-child(${colIndex})`);
-            width = colEl.getBoundingClientRect().width;
+            const colEl = getCell(column.id);
+            width = (_a = colEl === null || colEl === void 0 ? void 0 : colEl.getBoundingClientRect().width) !== null && _a !== void 0 ? _a : DEFAULT_COLUMN_WIDTH;
         }
         result[column.id] = Math.max(width, minWidth);
     }
@@ -33,24 +32,39 @@ const WidthsContext = createContext({
     totalWidth: 0,
     columnWidths: {},
     updateColumn: () => { },
+    setCell: () => { },
 });
-export function ColumnWidthsProvider({ tableRef, visibleColumns, resizableColumns, children }) {
+export function ColumnWidthsProvider({ visibleColumns, resizableColumns, children }) {
     const visibleColumnsRef = useRef(null);
     const [columnWidths, setColumnWidths] = useState({});
+    const cellsRef = useRef({});
+    const getCell = (columnId) => { var _a; return (_a = cellsRef.current[columnId]) !== null && _a !== void 0 ? _a : null; };
+    const setCell = (columnId, node) => {
+        if (node) {
+            cellsRef.current[columnId] = node;
+        }
+        else {
+            delete cellsRef.current[columnId];
+        }
+    };
     // The widths of the dynamically added columns (after the first render) if not set explicitly
     // will default to the DEFAULT_COLUMN_WIDTH.
     useEffect(() => {
         if (!resizableColumns) {
             return;
         }
+        const updates = {};
         const lastVisible = visibleColumnsRef.current;
         if (lastVisible) {
             for (let index = 0; index < visibleColumns.length; index++) {
                 const column = visibleColumns[index];
                 if (!columnWidths[column.id] && lastVisible.indexOf(column.id) === -1) {
-                    setColumnWidths(columnWidths => (Object.assign(Object.assign({}, columnWidths), { [column.id]: column.width || DEFAULT_COLUMN_WIDTH })));
+                    updates[column.id] = column.width || DEFAULT_COLUMN_WIDTH;
                 }
             }
+            if (Object.keys(updates).length > 0) {
+                setColumnWidths(columnWidths => (Object.assign(Object.assign({}, columnWidths), updates)));
+            }
         }
         visibleColumnsRef.current = visibleColumns.map(column => column.id);
     }, [columnWidths, resizableColumns, visibleColumns]);
@@ -60,7 +74,7 @@ export function ColumnWidthsProvider({ tableRef, visibleColumns, resizableColumn
         if (!resizableColumns) {
             return;
         }
-        setColumnWidths(() => readWidths(tableRef.current, visibleColumns));
+        setColumnWidths(() => readWidths(getCell, visibleColumns));
         // This code is intended to run only at the first render and should not re-run when table props change
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
@@ -68,7 +82,7 @@ export function ColumnWidthsProvider({ tableRef, visibleColumns, resizableColumn
         setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths, newWidth, columnId));
     }
     const totalWidth = visibleColumns.reduce((total, column) => total + (columnWidths[column.id] || DEFAULT_COLUMN_WIDTH), 0);
-    return React.createElement(WidthsContext.Provider, { value: { columnWidths, totalWidth, updateColumn } }, children);
+    return (React.createElement(WidthsContext.Provider, { value: { columnWidths, totalWidth, updateColumn, setCell } }, children));
 }
 export function useColumnWidths() {
     return useContext(WidthsContext);

package/lib/internal/template/table/use-column-widths.js.map CHANGED Viewed

	@@ -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;~~AACtF~~,~~OAAO,gBAAgB,~~MAAM,~~6BAA6B,~~CAAC~~;AAE3D~~,MAAM,~~CAAC,MAAM,~~oBAAoB,GAAG,GAAG,CAAC;~~AAExC~~,SAAS,UAAU,~~CAAC~~,~~QAAqB~~,~~EAAE~~,~~cAAiC;IAC1E~~,MAAM,MAAM,GAAgC,EAAE,CAAC;IAC/C,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;QAC1D,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;QACrC,IAAI,KAAK,GAAI,MAAM,CAAC,KAAgB,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAI,MAAM,CAAC,QAAmB,IAAI,KAAK,IAAI,oBAAoB,CAAC;QAC9E,IACE,CAAC,KAAK,IAAI,yDAAyD;YACnE,KAAK,KAAK,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,kFAAkF;UACtH;YACA,MAAM,~~QAAQ,GAAG,~~KAAK,GAAG,~~CAAC~~,CAAC~~;YAC3B~~,MAAM,~~KAAK,GAAG,QAAQ,~~CAAC,~~aAAa~~,~~CAAc,IAAI,gBAAgB,~~CAAC,~~aAAa,~~CAAC,~~cAAc~~,~~QAAQ,~~GAAG,~~CAAE~~,~~CAAC;YACjH~~,KAAK,~~GAAG~~,KAAK,~~CAAC~~,qBAAqB,~~EAAE~~,~~CAAC,~~KAAK,CAAC;~~SAC7C~~;QACD,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;KAC/C;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,YAAY,CACnB,~~cAAiC~~,~~EACjC~~,SAAsC,EACtC,QAAgB,EAChB,QAAqB;IAErB,MAAM,MAAM,GAAG,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;IACrE,MAAM,QAAQ,GAAG,OAAO,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,CAAA,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC;IAC/F,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IACxC,IAAI,SAAS,CAAC,QAAQ,CAAC,KAAK,QAAQ,EAAE;QACpC,OAAO,SAAS,CAAC;KAClB;IACD,uCAAY,SAAS,KAAE,CAAC,QAAQ,CAAC,EAAE,QAAQ,IAAG;AAChD,CAAC;~~AAQD~~,MAAM,aAAa,GAAG,aAAa,CAAgB;IACjD,UAAU,EAAE,CAAC;IACb,YAAY,EAAE,EAAE;IAChB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;~~CACvB~~,CAAC,CAAC;~~AAeH~~,MAAM,UAAU,oBAAoB,CAAC,EAAE,~~QAAQ,EAAE,~~cAAc,EAAE,gBAAgB,EAAE,QAAQ,EAAsB;~~IAC/G~~,MAAM,iBAAiB,GAAG,MAAM,CAAqC,IAAI,CAAC,CAAC;IAC3E,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAA8B,EAAE,CAAC,CAAC;IAElF,6FAA6F;IAC7F,4CAA4C;IAC5C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,gBAAgB,EAAE;YACrB,OAAO;SACR;QACD,MAAM,WAAW,GAAG,iBAAiB,CAAC,OAAO,CAAC;QAC9C,IAAI,WAAW,EAAE;YACf,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBAC1D,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;gBACrC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE;oBACrE,~~eAAe~~,CAAC,~~YAAY~~,CAAC,EAAE,CAAC,~~iCAC3B~~,~~YAAY~~,~~KACf~~,CAAC,MAAM,CAAC,~~EAAE~~,CAAC,~~EAAG~~,MAAM,CAAC,~~KAAgB~~,~~IAAI~~,~~oBAAoB~~,~~IAC7D~~,CAAC,CAAC;~~iBACL~~;~~aACF;~~SACF;QACD,iBAAiB,CAAC,OAAO,GAAG,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACtE,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,EAAE,cAAc,CAAC,CAAC,CAAC;IAErD,0FAA0F;IAC1F,wCAAwC;IACxC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,gBAAgB,EAAE;YACrB,OAAO;SACR;QACD,eAAe,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,~~QAAQ~~,~~CAAC,OAAQ,~~EAAE,cAAc,CAAC,CAAC,CAAC;~~QACrE~~,sGAAsG;QACtG,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,YAAY,CAAC,QAAqB,EAAE,QAAgB;QAC3D,eAAe,CAAC,YAAY,CAAC,EAAE,CAAC,YAAY,CAAC,cAAc,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAClG,CAAC;IAED,MAAM,UAAU,GAAG,cAAc,CAAC,MAAM,CACtC,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,CAAC,KAAK,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,oBAAoB,CAAC,EAC5E,CAAC,CACF,CAAC;IAEF,OAAO,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,~~IAAG~~,QAAQ,~~CAA0B~~,CAAC;~~AACxH~~,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,OAAO,UAAU,CAAC,aAAa,CAAC,CAAC;AACnC,CAAC","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 headerCellStyles from './header-cell/styles.css.js';\~~n\nexport const DEFAULT_COLUMN_WIDTH = 120;\n\nfunction readWidths(~~headerEl~~: HTMLElement, visibleColumns: readonly ~~Column~~[]) {\n const result: Record<PropertyKey, number> = {};\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n let width = (column.width as number) \|\| 0;\n const minWidth = (column.minWidth as number) \|\| width \|\| DEFAULT_COLUMN_WIDTH;\n if (\n !width && // read width from the DOM if it is missing in the config\n index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container\n ) {\n const ~~colIndex = index + 1;\n const~~ colEl = ~~headerEl~~.~~querySelector<HTMLElement>(`.${headerCellStyles['header-cell']}:nth-child(${colIndex}~~)~~`)!;\~~n width = colEl.getBoundingClientRect().width;\n }\n result[column.id] = Math.max(width, minWidth);\n }\n return result;\n}\n\nfunction updateWidths(\n visibleColumns: readonly ~~Column~~[],\n oldWidths: Record<PropertyKey, number>,\n newWidth: number,\n columnId: PropertyKey\n) {\n const column = visibleColumns.find(column => column.id === columnId);\n const minWidth = typeof column?.minWidth === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;\n newWidth = Math.max(newWidth, minWidth);\n if (oldWidths[columnId] === newWidth) {\n return oldWidths;\n }\n return { ...oldWidths, [columnId]: newWidth };\n}\n\ninterface WidthsContext {\n totalWidth: number;\n columnWidths: Record<PropertyKey, number>;\n updateColumn: (columnId: PropertyKey, 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~~ visibleColumns: readonly ~~Column~~[];\n resizableColumns: boolean \| undefined;\n children: React.ReactNode;\n}\n\~~ninterface Column {\n id: PropertyKey;\n minWidth?: string \| number;\n width?: string \| number;\n}\n\~~nexport function ColumnWidthsProvider({ ~~tableRef,~~ visibleColumns, resizableColumns, children }: WidthProviderProps) {\n const visibleColumnsRef = useRef<(PropertyKey \| undefined)[] \| null>(null);\n const [columnWidths, setColumnWidths] = useState<Record<PropertyKey, number>>({});\n\n // The widths of the dynamically added columns (after the first render) if not set explicitly\n // will default to the DEFAULT_COLUMN_WIDTH.\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n const lastVisible = visibleColumnsRef.current;\n if (lastVisible) {\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n if (!columnWidths[column.id] && lastVisible.indexOf(column.id) === -1) {\n ~~setColumnWidths(columnWidths => ({\n ...columnWidths,\n~~ [column.id]: (column.width as number) \|\| DEFAULT_COLUMN_WIDTH,\n }));\n }\n }\n }\n visibleColumnsRef.current = visibleColumns.map(column => column.id);\n }, [columnWidths, resizableColumns, visibleColumns]);\n\n // Read the actual column widths after the first render to employ the browser defaults for\n // those columns without explicit width.\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n setColumnWidths(() => readWidths(~~tableRef.current!,~~ visibleColumns));\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(columnId: PropertyKey, newWidth: number) {\n setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths, newWidth, columnId));\n }\n\n const totalWidth = visibleColumns.reduce(\n (total, column) => total + (columnWidths[column.id] \|\| DEFAULT_COLUMN_WIDTH),\n 0\n );\n\n return <WidthsContext.Provider value={{ columnWidths, totalWidth, updateColumn }}>{children}</WidthsContext.Provider~~>;\~~n}\n\nexport function useColumnWidths() {\n return useContext(WidthsContext);\n}\n"]}
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';\n\nexport const DEFAULT_COLUMN_WIDTH = 120;\n\nexport interface ColumnWidthDefinition {\n id: PropertyKey;\n minWidth?: string \| number;\n width?: string \| number;\n}\n\nfunction readWidths(\n getCell: (columnId: PropertyKey) => null \| HTMLElement,\n visibleColumns: readonly ColumnWidthDefinition[]\n) {\n const result: Record<PropertyKey, number> = {};\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n let width = (column.width as number) \|\| 0;\n const minWidth = (column.minWidth as number) \|\| width \|\| DEFAULT_COLUMN_WIDTH;\n if (\n !width && // read width from the DOM if it is missing in the config\n index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container\n ) {\n const colEl = getCell(column.id);\n width = colEl?.getBoundingClientRect().width ?? DEFAULT_COLUMN_WIDTH;\n }\n result[column.id] = Math.max(width, minWidth);\n }\n return result;\n}\n\nfunction updateWidths(\n visibleColumns: readonly ColumnWidthDefinition[],\n oldWidths: Record<PropertyKey, number>,\n newWidth: number,\n columnId: PropertyKey\n) {\n const column = visibleColumns.find(column => column.id === columnId);\n const minWidth = typeof column?.minWidth === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;\n newWidth = Math.max(newWidth, minWidth);\n if (oldWidths[columnId] === newWidth) {\n return oldWidths;\n }\n return { ...oldWidths, [columnId]: newWidth };\n}\n\ninterface WidthsContext {\n totalWidth: number;\n columnWidths: Record<PropertyKey, number>;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n setCell: (columnId: PropertyKey, node: null \| HTMLElement) => void;\n}\n\nconst WidthsContext = createContext<WidthsContext>({\n totalWidth: 0,\n columnWidths: {},\n updateColumn: () => {},\n setCell: () => {},\n});\n\ninterface WidthProviderProps {\n visibleColumns: readonly ColumnWidthDefinition[];\n resizableColumns: boolean \| undefined;\n children: React.ReactNode;\n}\n\nexport function ColumnWidthsProvider({ visibleColumns, resizableColumns, children }: WidthProviderProps) {\n const visibleColumnsRef = useRef<(PropertyKey \| undefined)[] \| null>(null);\n const [columnWidths, setColumnWidths] = useState<Record<PropertyKey, number>>({});\n\n const cellsRef = useRef<Record<PropertyKey, HTMLElement>>({});\n const getCell = (columnId: PropertyKey): null \| HTMLElement => cellsRef.current[columnId] ?? null;\n const setCell = (columnId: PropertyKey, node: null \| HTMLElement) => {\n if (node) {\n cellsRef.current[columnId] = node;\n } else {\n delete cellsRef.current[columnId];\n }\n };\n\n // The widths of the dynamically added columns (after the first render) if not set explicitly\n // will default to the DEFAULT_COLUMN_WIDTH.\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n const updates: Record<PropertyKey, number> = {};\n const lastVisible = visibleColumnsRef.current;\n if (lastVisible) {\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n if (!columnWidths[column.id] && lastVisible.indexOf(column.id) === -1) {\n updates[column.id] = (column.width as number) \|\| DEFAULT_COLUMN_WIDTH;\n }\n }\n if (Object.keys(updates).length > 0) {\n setColumnWidths(columnWidths => ({ ...columnWidths, ...updates }));\n }\n }\n visibleColumnsRef.current = visibleColumns.map(column => column.id);\n }, [columnWidths, resizableColumns, visibleColumns]);\n\n // Read the actual column widths after the first render to employ the browser defaults for\n // those columns without explicit width.\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n setColumnWidths(() => readWidths(getCell, visibleColumns));\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(columnId: PropertyKey, newWidth: number) {\n setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths, newWidth, columnId));\n }\n\n const totalWidth = visibleColumns.reduce(\n (total, column) => total + (columnWidths[column.id] \|\| DEFAULT_COLUMN_WIDTH),\n 0\n );\n\n return (\n <WidthsContext.Provider value={{ columnWidths, totalWidth, updateColumn, setCell }}>\n {children}\n </WidthsContext.Provider>\n );\n}\n\nexport function useColumnWidths() {\n return useContext(WidthsContext);\n}\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/components-themeable",
-  "version": "3.0.332",
+  "version": "3.0.334",
   "files": [
     "lib",
     "package.json",