@cloudscape-design/components-themeable 3.0.327 → 3.0.329

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

@@ -1,90 +1,73 @@
 // 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 { getColumnKey } from './utils';
 import headerCellStyles from './header-cell/styles.css.js';
-import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
-export const DEFAULT_WIDTH = 120;
-const SELECTION_CELL_WIDTH = 54;
-function checkProperty(column, name) {
-    const value = column[name];
-    if (typeof value !== 'number' && typeof value !== 'undefined') {
-        warnOnce('Table', `resizableColumns feature requires ${name} property to be a number, got ${value}. The component may work incorrectly.`);
-    }
-}
-export function checkColumnWidths(columnDefinitions) {
-    for (const column of columnDefinitions) {
-        checkProperty(column, 'minWidth');
-        checkProperty(column, 'width');
-    }
-}
-function readWidths(headerEl, columnDefinitions, hasSelection) {
+export const DEFAULT_COLUMN_WIDTH = 120;
+function readWidths(headerEl, visibleColumns) {
     const result = {};
-    for (let index = 0; index < columnDefinitions.length; index++) {
-        const column = columnDefinitions[index];
-        const id = getColumnKey(columnDefinitions[index], index);
+    for (let index = 0; index < visibleColumns.length; index++) {
+        const column = visibleColumns[index];
         let width = column.width || 0;
-        const minWidth = column.minWidth || width || DEFAULT_WIDTH;
+        const minWidth = column.minWidth || width || DEFAULT_COLUMN_WIDTH;
         if (!width && // read width from the DOM if it is missing in the config
-            index !== columnDefinitions.length - 1 // skip reading for the last column, because it expands to fully fit the container
+            index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container
         ) {
-            const colIndex = hasSelection ? index + 2 : index + 1;
+            const colIndex = index + 1;
             const colEl = headerEl.querySelector(`.${headerCellStyles['header-cell']}:nth-child(${colIndex})`);
             width = colEl.getBoundingClientRect().width;
         }
-        result[id] = Math.max(width, minWidth);
+        result[column.id] = Math.max(width, minWidth);
     }
     return result;
 }
-function updateWidths(columnDefinitions, oldWidths, newWidth, colIndex) {
-    const definition = columnDefinitions[colIndex];
-    const id = getColumnKey(definition, colIndex);
-    const minWidth = typeof definition.minWidth === 'number' ? definition.minWidth : DEFAULT_WIDTH;
+function updateWidths(visibleColumns, oldWidths, newWidth, columnId) {
+    const column = visibleColumns.find(column => column.id === columnId);
+    const minWidth = typeof (column === null || column === void 0 ? void 0 : column.minWidth) === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;
     newWidth = Math.max(newWidth, minWidth);
-    if (oldWidths[id] === newWidth) {
+    if (oldWidths[columnId] === newWidth) {
         return oldWidths;
     }
-    return Object.assign(Object.assign({}, oldWidths), { [id]: newWidth });
+    return Object.assign(Object.assign({}, oldWidths), { [columnId]: newWidth });
 }
 const WidthsContext = createContext({
     totalWidth: 0,
     columnWidths: {},
     updateColumn: () => { },
 });
-export function ColumnWidthsProvider({ tableRef, visibleColumnDefinitions, resizableColumns, hasSelection, children, }) {
-    const visibleColumns = useRef(null);
+export function ColumnWidthsProvider({ tableRef, visibleColumns, resizableColumns, children }) {
+    const visibleColumnsRef = useRef(null);
     const [columnWidths, setColumnWidths] = useState({});
+    // 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 lastVisible = visibleColumns.current;
+        const lastVisible = visibleColumnsRef.current;
         if (lastVisible) {
-            for (let index = 0; index < visibleColumnDefinitions.length; index++) {
-                const column = visibleColumnDefinitions[index];
-                const id = getColumnKey(column, index);
-                if (!columnWidths[id] && lastVisible.indexOf(column.id) === -1) {
-                    setColumnWidths(columnWidths => (Object.assign(Object.assign({}, columnWidths), { [id]: column.width || DEFAULT_WIDTH })));
+            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 })));
                 }
             }
         }
-        visibleColumns.current = visibleColumnDefinitions.map(column => column.id);
-    }, [columnWidths, resizableColumns, visibleColumnDefinitions]);
+        visibleColumnsRef.current = visibleColumns.map(column => column.id);
+    }, [columnWidths, resizableColumns, visibleColumns]);
+    // Read the actual column widths after the first render to employ the browser defaults for
+    // those columns without explicit width.
     useEffect(() => {
         if (!resizableColumns) {
             return;
         }
-        setColumnWidths(() => readWidths(tableRef.current, visibleColumnDefinitions, hasSelection));
+        setColumnWidths(() => readWidths(tableRef.current, 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
     }, []);
-    function updateColumn(colIndex, newWidth) {
-        setColumnWidths(columnWidths => updateWidths(visibleColumnDefinitions, columnWidths, newWidth, colIndex));
-    }
-    let totalWidth = visibleColumnDefinitions.reduce((total, column, index) => total + (columnWidths[getColumnKey(column, index)] || DEFAULT_WIDTH), 0);
-    if (hasSelection) {
-        totalWidth += SELECTION_CELL_WIDTH;
+    function updateColumn(columnId, newWidth) {
+        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);
 }
 export function useColumnWidths() {

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

@@ -1 +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 './header-cell/styles.css.js';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\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"]}
+{"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 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"]}

package/lib/internal/template/table/utils.d.ts

@@ -1,6 +1,6 @@
 import { InternalContainerProps } from '../container/internal';
+import { StickyColumnsCellState } from './sticky-columns';
 import { TableProps } from './interfaces';
-import { StickyColumnsCellState } from './use-sticky-columns';
 export declare const applyTrackBy: <T>(trackBy: TableProps.TrackBy<T>, item: T) => any;
 export declare const getItemKey: <T>(trackBy: TableProps.TrackBy<T> | undefined, item: T, index: number) => any;
 export declare const getTrackableValue: <T>(trackBy: TableProps.TrackBy<T> | undefined, item: T) => any;

package/lib/internal/template/table/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"lib/default/","sources":["table/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,eAAO,MAAM,YAAY,qDAKxB,CAAC;AAEF,eAAO,MAAM,UAAU,kEAAmE,MAAM,QAK/F,CAAC;AAEF,eAAO,MAAM,iBAAiB,iEAK7B,CAAC;AAEF,eAAO,MAAM,YAAY,qDAAsD,MAAM,oBAEpF,CAAC;AAEF,eAAO,MAAM,kBAAkB,YAAa,WAAW,OAAO,GAAG,SAAS,KAAG,sBAAsB,CAAC,SAAS,CAG5G,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,CAAC,EACjC,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,EAChE,iBAAiB,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC,QASpE;AAED,wBAAgB,2BAA2B,CAAC,CAAC,EAAE,EAC7C,aAAa,EACb,cAAc,EACd,iBAAiB,GAClB,EAAE;IACD,aAAa,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACvC,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;CAClE,6CASA;AA8BD,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,sBAAsB,GAAG,IAAI;;EAOvG"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"lib/default/","sources":["table/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,eAAO,MAAM,YAAY,qDAKxB,CAAC;AAEF,eAAO,MAAM,UAAU,kEAAmE,MAAM,QAK/F,CAAC;AAEF,eAAO,MAAM,iBAAiB,iEAK7B,CAAC;AAEF,eAAO,MAAM,YAAY,qDAAsD,MAAM,oBAEpF,CAAC;AAEF,eAAO,MAAM,kBAAkB,YAAa,WAAW,OAAO,GAAG,SAAS,KAAG,sBAAsB,CAAC,SAAS,CAG5G,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,CAAC,EACjC,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,EAChE,iBAAiB,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC,QASpE;AAED,wBAAgB,2BAA2B,CAAC,CAAC,EAAE,EAC7C,aAAa,EACb,cAAc,EACd,iBAAiB,GAClB,EAAE;IACD,aAAa,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACvC,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;CAClE,6CASA;AA8BD,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,sBAAsB,GAAG,IAAI;;EAOvG"}

package/lib/internal/template/table/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"lib/default/","sources":["table/utils.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 { InternalContainerProps } from '../container/internal';\nimport { TableProps } from './interfaces';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { StickyColumnsCellState } from './use-sticky-columns';\n\nexport const applyTrackBy = <T>(trackBy: TableProps.TrackBy<T>, item: T) => {\n  if (typeof trackBy === 'function') {\n    return trackBy(item);\n  }\n  return (item as any)[trackBy];\n};\n\nexport const getItemKey = <T>(trackBy: TableProps.TrackBy<T> | undefined, item: T, index: number) => {\n  if (!trackBy) {\n    return index;\n  }\n  return applyTrackBy(trackBy, item);\n};\n\nexport const getTrackableValue = <T>(trackBy: TableProps.TrackBy<T> | undefined, item: T) => {\n  if (!trackBy) {\n    return item;\n  }\n  return applyTrackBy(trackBy, item);\n};\n\nexport const getColumnKey = <T>(column: TableProps.ColumnDefinition<T>, index: number) => {\n  return column.id || index;\n};\n\nexport const toContainerVariant = (variant: TableProps.Variant | undefined): InternalContainerProps['variant'] => {\n  const isDefaultVariant = !variant || variant === 'container';\n  return isDefaultVariant ? 'default' : variant === 'borderless' ? 'embedded' : variant;\n};\n\nexport function checkSortingState<T>(\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>,\n  sortingComparator: TableProps.SortingColumn<T>['sortingComparator']\n) {\n  const matchedColumn = columnDefinitions.filter(column => column.sortingComparator === sortingComparator)[0];\n  if (!matchedColumn) {\n    warnOnce(\n      'Table',\n      'Currently active sorting comparator was not found in any columns. Make sure to provide the same comparator function instance on each render.'\n    );\n  }\n}\n\nexport function getVisibleColumnDefinitions<T>({\n  columnDisplay,\n  visibleColumns,\n  columnDefinitions,\n}: {\n  columnDisplay?: ReadonlyArray<TableProps.ColumnDisplayProperties>;\n  visibleColumns?: ReadonlyArray<string>;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>;\n}) {\n  // columnsDisplay has a precedence over visibleColumns.\n  if (columnDisplay) {\n    return getVisibleColumnDefinitionsFromColumnDisplay({ columnDisplay, columnDefinitions });\n  } else if (visibleColumns) {\n    return getVisibleColumnDefinitionsFromVisibleColumns({ visibleColumns, columnDefinitions });\n  } else {\n    return columnDefinitions;\n  }\n}\n\nfunction getVisibleColumnDefinitionsFromColumnDisplay<T>({\n  columnDisplay,\n  columnDefinitions,\n}: {\n  columnDisplay: ReadonlyArray<TableProps.ColumnDisplayProperties>;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>;\n}) {\n  const columnDefinitionsById: Record<string, TableProps.ColumnDefinition<T>> = columnDefinitions.reduce(\n    (accumulator, item) => (item.id === undefined ? accumulator : { ...accumulator, [item.id]: item }),\n    {}\n  );\n  return columnDisplay\n    .filter(item => item.visible)\n    .map(item => columnDefinitionsById[item.id])\n    .filter(Boolean);\n}\n\nfunction getVisibleColumnDefinitionsFromVisibleColumns<T>({\n  visibleColumns,\n  columnDefinitions,\n}: {\n  visibleColumns: ReadonlyArray<string>;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>;\n}) {\n  const ids = new Set(visibleColumns);\n  return columnDefinitions.filter(({ id }) => id !== undefined && ids.has(id));\n}\n\nexport function getStickyClassNames(styles: Record<string, string>, props: StickyColumnsCellState | null) {\n  return {\n    [styles['sticky-cell']]: !!props,\n    [styles['sticky-cell-pad-left']]: !!props?.padLeft,\n    [styles['sticky-cell-last-left']]: !!props?.lastLeft,\n    [styles['sticky-cell-last-right']]: !!props?.lastRight,\n  };\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"lib/default/","sources":["table/utils.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 { InternalContainerProps } from '../container/internal';\nimport { StickyColumnsCellState } from './sticky-columns';\nimport { TableProps } from './interfaces';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nexport const applyTrackBy = <T>(trackBy: TableProps.TrackBy<T>, item: T) => {\n  if (typeof trackBy === 'function') {\n    return trackBy(item);\n  }\n  return (item as any)[trackBy];\n};\n\nexport const getItemKey = <T>(trackBy: TableProps.TrackBy<T> | undefined, item: T, index: number) => {\n  if (!trackBy) {\n    return index;\n  }\n  return applyTrackBy(trackBy, item);\n};\n\nexport const getTrackableValue = <T>(trackBy: TableProps.TrackBy<T> | undefined, item: T) => {\n  if (!trackBy) {\n    return item;\n  }\n  return applyTrackBy(trackBy, item);\n};\n\nexport const getColumnKey = <T>(column: TableProps.ColumnDefinition<T>, index: number) => {\n  return column.id || index;\n};\n\nexport const toContainerVariant = (variant: TableProps.Variant | undefined): InternalContainerProps['variant'] => {\n  const isDefaultVariant = !variant || variant === 'container';\n  return isDefaultVariant ? 'default' : variant === 'borderless' ? 'embedded' : variant;\n};\n\nexport function checkSortingState<T>(\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>,\n  sortingComparator: TableProps.SortingColumn<T>['sortingComparator']\n) {\n  const matchedColumn = columnDefinitions.filter(column => column.sortingComparator === sortingComparator)[0];\n  if (!matchedColumn) {\n    warnOnce(\n      'Table',\n      'Currently active sorting comparator was not found in any columns. Make sure to provide the same comparator function instance on each render.'\n    );\n  }\n}\n\nexport function getVisibleColumnDefinitions<T>({\n  columnDisplay,\n  visibleColumns,\n  columnDefinitions,\n}: {\n  columnDisplay?: ReadonlyArray<TableProps.ColumnDisplayProperties>;\n  visibleColumns?: ReadonlyArray<string>;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>;\n}) {\n  // columnsDisplay has a precedence over visibleColumns.\n  if (columnDisplay) {\n    return getVisibleColumnDefinitionsFromColumnDisplay({ columnDisplay, columnDefinitions });\n  } else if (visibleColumns) {\n    return getVisibleColumnDefinitionsFromVisibleColumns({ visibleColumns, columnDefinitions });\n  } else {\n    return columnDefinitions;\n  }\n}\n\nfunction getVisibleColumnDefinitionsFromColumnDisplay<T>({\n  columnDisplay,\n  columnDefinitions,\n}: {\n  columnDisplay: ReadonlyArray<TableProps.ColumnDisplayProperties>;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>;\n}) {\n  const columnDefinitionsById: Record<string, TableProps.ColumnDefinition<T>> = columnDefinitions.reduce(\n    (accumulator, item) => (item.id === undefined ? accumulator : { ...accumulator, [item.id]: item }),\n    {}\n  );\n  return columnDisplay\n    .filter(item => item.visible)\n    .map(item => columnDefinitionsById[item.id])\n    .filter(Boolean);\n}\n\nfunction getVisibleColumnDefinitionsFromVisibleColumns<T>({\n  visibleColumns,\n  columnDefinitions,\n}: {\n  visibleColumns: ReadonlyArray<string>;\n  columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<T>>;\n}) {\n  const ids = new Set(visibleColumns);\n  return columnDefinitions.filter(({ id }) => id !== undefined && ids.has(id));\n}\n\nexport function getStickyClassNames(styles: Record<string, string>, props: StickyColumnsCellState | null) {\n  return {\n    [styles['sticky-cell']]: !!props,\n    [styles['sticky-cell-pad-left']]: !!props?.padLeft,\n    [styles['sticky-cell-last-left']]: !!props?.lastLeft,\n    [styles['sticky-cell-last-right']]: !!props?.lastRight,\n  };\n}\n"]}

package/lib/internal/template/test-utils/dom/app-layout/index.d.ts

@@ -16,6 +16,6 @@ export default class AppLayoutWrapper extends ComponentWrapper {
     findActiveDrawerCloseButton(): ElementWrapper<HTMLButtonElement> | null;
     findDrawersDesktopTriggersContainer(): ElementWrapper | null;
     findDrawersMobileTriggersContainer(): ElementWrapper | null;
-    findDrawersTriggers(): ElementWrapper<HTMLButtonElement>[] | null;
+    findDrawersTriggers(): ElementWrapper<HTMLButtonElement>[];
     findDrawersSlider(): ElementWrapper | null;
 }