@cloudscape-design/components-themeable 3.0.1138 → 3.0.1139

package/lib/internal/template/table/selection/selection-control.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -9,8 +8,7 @@ import InternalCheckbox from '../../checkbox/internal';
 import { KeyCode } from '../../internal/keycode';
 import RadioButton from '../../radio-group/radio-button';
 import styles from './styles.css.js';
-export function SelectionControl(_a) {
-    var { selectionType, indeterminate = false, onShiftToggle, onFocusUp, onFocusDown, name, ariaLabel, focusedComponent, rowIndex, itemKey, verticalAlign = 'middle' } = _a, sharedProps = __rest(_a, ["selectionType", "indeterminate", "onShiftToggle", "onFocusUp", "onFocusDown", "name", "ariaLabel", "focusedComponent", "rowIndex", "itemKey", "verticalAlign"]);
+export function SelectionControl({ selectionType, indeterminate = false, onShiftToggle, onFocusUp, onFocusDown, name, ariaLabel, focusedComponent, rowIndex, itemKey, verticalAlign = 'middle', ...sharedProps }) {
     const controlId = useUniqueId();
     const isMultiSelection = selectionType === 'multi';
     const { navigationActive } = useSingleTabStopNavigation(null);
@@ -48,16 +46,16 @@ export function SelectionControl(_a) {
         // Clicking on input, does not focus it on Firefox (AWSUI-11345)
         nativeInput === null || nativeInput === void 0 ? void 0 : nativeInput.focus();
     };
-    const selector = isMultiSelection ? (React.createElement(InternalCheckbox, Object.assign({}, sharedProps, { showOutline: focusedComponent === 'selection-control', controlId: controlId, "data-focus-id": "selection-control", indeterminate: indeterminate }))) : (React.createElement(RadioButton, Object.assign({}, sharedProps, { controlId: controlId, name: name, value: '', label: '' })));
+    const selector = isMultiSelection ? (React.createElement(InternalCheckbox, { ...sharedProps, showOutline: focusedComponent === 'selection-control', controlId: controlId, "data-focus-id": "selection-control", indeterminate: indeterminate })) : (React.createElement(RadioButton, { ...sharedProps, controlId: controlId, name: name, value: '', label: '' }));
     return (React.createElement(React.Fragment, null,
-        React.createElement("label", Object.assign({ onKeyDown: handleKeyDown, onKeyUp: setShiftState, onMouseDown: onMouseDownHandler, onMouseUp: setShiftState, onClick: handleClick, htmlFor: controlId, className: clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top']), "aria-label": ariaLabel, title: ariaLabel }, (rowIndex !== undefined && !sharedProps.disabled
-            ? getAnalyticsMetadataAttribute({
-                detail: {
-                    position: `${rowIndex + 1}`,
-                    item: itemKey || '',
-                },
-            })
-            : {})), selector),
+        React.createElement("label", { onKeyDown: handleKeyDown, onKeyUp: setShiftState, onMouseDown: onMouseDownHandler, onMouseUp: setShiftState, onClick: handleClick, htmlFor: controlId, className: clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top']), "aria-label": ariaLabel, title: ariaLabel, ...(rowIndex !== undefined && !sharedProps.disabled
+                ? getAnalyticsMetadataAttribute({
+                    detail: {
+                        position: `${rowIndex + 1}`,
+                        item: itemKey || '',
+                    },
+                })
+                : {}) }, selector),
         React.createElement("span", { className: styles.stud, "aria-hidden": true }, "\u00A0")));
 }
 //# sourceMappingURL=selection-control.js.map

package/lib/internal/template/table/selection/selection-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../../src/table/selection/selection-control.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, { KeyboardEvent, KeyboardEventHandler, MouseEvent } from 'react';\nimport clsx from 'clsx';\n\nimport { useSingleTabStopNavigation, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalCheckbox from '../../checkbox/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport RadioButton from '../../radio-group/radio-button';\nimport { SelectionProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface SelectionControlProps extends SelectionProps {\n  onShiftToggle?(shiftPressed: boolean): void;\n  onFocusUp?: KeyboardEventHandler;\n  onFocusDown?: KeyboardEventHandler;\n  ariaLabel?: string;\n  tabIndex?: -1;\n  focusedComponent?: null | string;\n  rowIndex?: number;\n  itemKey?: string;\n  verticalAlign?: 'middle' | 'top';\n}\n\nexport function SelectionControl({\n  selectionType,\n  indeterminate = false,\n  onShiftToggle,\n  onFocusUp,\n  onFocusDown,\n  name,\n  ariaLabel,\n  focusedComponent,\n  rowIndex,\n  itemKey,\n  verticalAlign = 'middle',\n  ...sharedProps\n}: SelectionControlProps) {\n  const controlId = useUniqueId();\n  const isMultiSelection = selectionType === 'multi';\n  const { navigationActive } = useSingleTabStopNavigation(null);\n\n  const setShiftState = (event: KeyboardEvent | MouseEvent) => {\n    if (isMultiSelection) {\n      onShiftToggle?.(event.shiftKey);\n    }\n  };\n\n  const onMouseDownHandler = (event: MouseEvent) => {\n    setShiftState(event);\n    if (isMultiSelection) {\n      // To overcome an issue\n      // If you shift+click or ctrl+click on a label for a checkbox, checkbox is not checked.\n      // https://bugzilla.mozilla.org/show_bug.cgi?id=559506\n      event.preventDefault();\n    }\n  };\n\n  // native checkboxes do not have focus move via keyboard, we implement it here programmatically\n  const handleKeyDown = (event: KeyboardEvent) => {\n    setShiftState(event);\n    if (isMultiSelection && !navigationActive) {\n      if (event.keyCode === KeyCode.up) {\n        event.preventDefault();\n        onFocusUp?.(event);\n      }\n      if (event.keyCode === KeyCode.down) {\n        event.preventDefault();\n        onFocusDown?.(event);\n      }\n    }\n  };\n\n  const handleClick = (event: MouseEvent) => {\n    const target = event.currentTarget;\n    const nativeInput = (target.tagName === 'INPUT' ? target : target.querySelector('input')) as HTMLInputElement;\n    // Clicking on input, does not focus it on Firefox (AWSUI-11345)\n    nativeInput?.focus();\n  };\n\n  const selector = isMultiSelection ? (\n    <InternalCheckbox\n      {...sharedProps}\n      showOutline={focusedComponent === 'selection-control'}\n      controlId={controlId}\n      data-focus-id=\"selection-control\"\n      indeterminate={indeterminate}\n    />\n  ) : (\n    <RadioButton {...sharedProps} controlId={controlId} name={name} value={''} label={''} />\n  );\n\n  return (\n    <>\n      <label\n        onKeyDown={handleKeyDown}\n        onKeyUp={setShiftState}\n        onMouseDown={onMouseDownHandler}\n        onMouseUp={setShiftState}\n        onClick={handleClick}\n        htmlFor={controlId}\n        className={clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top'])}\n        aria-label={ariaLabel}\n        title={ariaLabel}\n        {...(rowIndex !== undefined && !sharedProps.disabled\n          ? getAnalyticsMetadataAttribute({\n              detail: {\n                position: `${rowIndex + 1}`,\n                item: itemKey || '',\n              },\n            })\n          : {})}\n      >\n        {selector}\n      </label>\n      <span className={styles.stud} aria-hidden={true}>\n        &nbsp;\n      </span>\n    </>\n  );\n}\n"]}
+{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../../src/table/selection/selection-control.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, { KeyboardEvent, KeyboardEventHandler, MouseEvent } from 'react';\nimport clsx from 'clsx';\n\nimport { useSingleTabStopNavigation, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalCheckbox from '../../checkbox/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport RadioButton from '../../radio-group/radio-button';\nimport { SelectionProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface SelectionControlProps extends SelectionProps {\n  onShiftToggle?(shiftPressed: boolean): void;\n  onFocusUp?: KeyboardEventHandler;\n  onFocusDown?: KeyboardEventHandler;\n  ariaLabel?: string;\n  tabIndex?: -1;\n  focusedComponent?: null | string;\n  rowIndex?: number;\n  itemKey?: string;\n  verticalAlign?: 'middle' | 'top';\n}\n\nexport function SelectionControl({\n  selectionType,\n  indeterminate = false,\n  onShiftToggle,\n  onFocusUp,\n  onFocusDown,\n  name,\n  ariaLabel,\n  focusedComponent,\n  rowIndex,\n  itemKey,\n  verticalAlign = 'middle',\n  ...sharedProps\n}: SelectionControlProps) {\n  const controlId = useUniqueId();\n  const isMultiSelection = selectionType === 'multi';\n  const { navigationActive } = useSingleTabStopNavigation(null);\n\n  const setShiftState = (event: KeyboardEvent | MouseEvent) => {\n    if (isMultiSelection) {\n      onShiftToggle?.(event.shiftKey);\n    }\n  };\n\n  const onMouseDownHandler = (event: MouseEvent) => {\n    setShiftState(event);\n    if (isMultiSelection) {\n      // To overcome an issue\n      // If you shift+click or ctrl+click on a label for a checkbox, checkbox is not checked.\n      // https://bugzilla.mozilla.org/show_bug.cgi?id=559506\n      event.preventDefault();\n    }\n  };\n\n  // native checkboxes do not have focus move via keyboard, we implement it here programmatically\n  const handleKeyDown = (event: KeyboardEvent) => {\n    setShiftState(event);\n    if (isMultiSelection && !navigationActive) {\n      if (event.keyCode === KeyCode.up) {\n        event.preventDefault();\n        onFocusUp?.(event);\n      }\n      if (event.keyCode === KeyCode.down) {\n        event.preventDefault();\n        onFocusDown?.(event);\n      }\n    }\n  };\n\n  const handleClick = (event: MouseEvent) => {\n    const target = event.currentTarget;\n    const nativeInput = (target.tagName === 'INPUT' ? target : target.querySelector('input')) as HTMLInputElement;\n    // Clicking on input, does not focus it on Firefox (AWSUI-11345)\n    nativeInput?.focus();\n  };\n\n  const selector = isMultiSelection ? (\n    <InternalCheckbox\n      {...sharedProps}\n      showOutline={focusedComponent === 'selection-control'}\n      controlId={controlId}\n      data-focus-id=\"selection-control\"\n      indeterminate={indeterminate}\n    />\n  ) : (\n    <RadioButton {...sharedProps} controlId={controlId} name={name} value={''} label={''} />\n  );\n\n  return (\n    <>\n      <label\n        onKeyDown={handleKeyDown}\n        onKeyUp={setShiftState}\n        onMouseDown={onMouseDownHandler}\n        onMouseUp={setShiftState}\n        onClick={handleClick}\n        htmlFor={controlId}\n        className={clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top'])}\n        aria-label={ariaLabel}\n        title={ariaLabel}\n        {...(rowIndex !== undefined && !sharedProps.disabled\n          ? getAnalyticsMetadataAttribute({\n              detail: {\n                position: `${rowIndex + 1}`,\n                item: itemKey || '',\n              },\n            })\n          : {})}\n      >\n        {selector}\n      </label>\n      <span className={styles.stud} aria-hidden={true}>\n        &nbsp;\n      </span>\n    </>\n  );\n}\n"]}

package/lib/internal/template/table/sticky-columns/use-sticky-columns.js

@@ -83,7 +83,7 @@ export function useStickyColumns({ visibleColumns, stickyColumnsFirst, stickyCol
         store,
         style: {
             // Provide wrapper styles as props so that a re-render won't cause invalidation.
-            wrapper: hasStickyColumns ? Object.assign({}, store.get().wrapperState) : undefined,
+            wrapper: hasStickyColumns ? { ...store.get().wrapperState } : undefined,
         },
         refs: { wrapper: setWrapper, table: setTable, cell: setCell },
     };

package/lib/internal/template/table/sticky-columns/use-sticky-columns.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-sticky-columns.js","sourceRoot":"","sources":["../../../../src/table/sticky-columns/use-sticky-columns.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 React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver, useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { getLogicalBoundingClientRect, getScrollInlineStart } from '@cloudscape-design/component-toolkit/internal';\n\nimport AsyncStore, { ReadonlyAsyncStore } from '../../area-chart/async-store';\nimport {\n  CellOffsets,\n  StickyColumnsCellState,\n  StickyColumnsProps,\n  StickyColumnsState,\n  StickyColumnsWrapperState,\n} from './interfaces';\nimport { isCellStatesEqual, isWrapperStatesEqual, updateCellOffsets } from './utils';\n\n// We allow the table to have a minimum of 148px of available space besides the sum of the widths of the sticky columns\n// This value is an UX recommendation and is approximately 1/3 of our smallest breakpoint (465px)\nconst MINIMUM_SCROLLABLE_SPACE = 148;\n\nexport interface StickyColumnsModel {\n  store: ReadonlyAsyncStore<StickyColumnsState>;\n  style: {\n    wrapper?: React.CSSProperties;\n  };\n  refs: {\n    table: React.RefCallback<HTMLElement>;\n    wrapper: React.RefCallback<HTMLElement>;\n    cell: (columnId: PropertyKey, node: null | HTMLElement) => void;\n  };\n}\n\nexport function useStickyColumns({\n  visibleColumns,\n  stickyColumnsFirst,\n  stickyColumnsLast,\n}: StickyColumnsProps): StickyColumnsModel {\n  const store = useMemo(() => new StickyColumnsStore(), []);\n  const wrapperRef = useRef<HTMLElement>(null) as React.MutableRefObject<null | HTMLElement>;\n  const tableRef = useRef<HTMLElement>(null) as React.MutableRefObject<null | HTMLElement>;\n  const cellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n\n  const hasStickyColumns = stickyColumnsFirst + stickyColumnsLast > 0;\n\n  const updateStickyStyles = useStableCallback(() => {\n    if (wrapperRef.current && tableRef.current) {\n      store.updateCellStyles({\n        wrapper: wrapperRef.current,\n        table: tableRef.current,\n        cells: cellsRef.current,\n        visibleColumns,\n        stickyColumnsFirst,\n        stickyColumnsLast,\n      });\n    }\n  });\n\n  useResizeObserver(wrapperRef, updateStickyStyles);\n\n  useResizeObserver(tableRef, updateStickyStyles);\n\n  useEffect(() => {\n    if (wrapperRef.current && tableRef.current) {\n      store.updateCellStyles({\n        wrapper: wrapperRef.current,\n        table: tableRef.current,\n        cells: cellsRef.current,\n        visibleColumns,\n        stickyColumnsFirst,\n        stickyColumnsLast,\n      });\n    }\n  }, [store, stickyColumnsFirst, stickyColumnsLast, visibleColumns]);\n\n  // Update wrapper styles imperatively to avoid unnecessary re-renders.\n  useEffect(() => {\n    if (!hasStickyColumns) {\n      return;\n    }\n\n    const selector = (state: StickyColumnsState) => state.wrapperState;\n\n    const updateWrapperStyles = (state: StickyColumnsWrapperState, prev: StickyColumnsWrapperState) => {\n      if (isWrapperStatesEqual(state, prev)) {\n        return;\n      }\n\n      if (wrapperRef.current) {\n        wrapperRef.current.style.scrollPaddingInlineStart = state.scrollPaddingInlineStart + 'px';\n        wrapperRef.current.style.scrollPaddingInlineEnd = state.scrollPaddingInlineEnd + 'px';\n      }\n    };\n\n    const unsubscribe = store.subscribe(selector, (newState, prevState) =>\n      updateWrapperStyles(selector(newState), selector(prevState))\n    );\n    return unsubscribe;\n  }, [store, hasStickyColumns]);\n\n  const setWrapper = useCallback(\n    (node: null | HTMLElement) => {\n      if (wrapperRef.current) {\n        wrapperRef.current.removeEventListener('scroll', updateStickyStyles);\n      }\n      if (node && hasStickyColumns) {\n        node.addEventListener('scroll', updateStickyStyles);\n      }\n      wrapperRef.current = node;\n    },\n    [hasStickyColumns, updateStickyStyles]\n  );\n\n  const setTable = useCallback((node: null | HTMLElement) => {\n    tableRef.current = node;\n  }, []);\n\n  const setCell = useCallback((columnId: PropertyKey, node: null | HTMLElement) => {\n    if (node) {\n      cellsRef.current.set(columnId, node);\n    } else {\n      cellsRef.current.delete(columnId);\n    }\n  }, []);\n\n  return {\n    store,\n    style: {\n      // Provide wrapper styles as props so that a re-render won't cause invalidation.\n      wrapper: hasStickyColumns ? { ...store.get().wrapperState } : undefined,\n    },\n    refs: { wrapper: setWrapper, table: setTable, cell: setCell },\n  };\n}\n\ninterface UseStickyCellStylesProps {\n  stickyColumns: StickyColumnsModel;\n  columnId: PropertyKey;\n  getClassName: (styles: null | StickyColumnsCellState) => Record<string, boolean>;\n}\n\ninterface StickyCellStyles {\n  ref: React.RefCallback<HTMLElement>;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function useStickyCellStyles({\n  stickyColumns,\n  columnId,\n  getClassName,\n}: UseStickyCellStylesProps): StickyCellStyles {\n  const setCell = stickyColumns.refs.cell;\n\n  // unsubscribeRef to hold the function to unsubscribe from the store's updates\n  const unsubscribeRef = useRef<null | (() => void)>(null);\n\n  // refCallback updates the cell ref and sets up the store subscription\n  const refCallback = useCallback(\n    (cellElement: null | HTMLElement) => {\n      if (unsubscribeRef.current) {\n        // Unsubscribe before we do any updates to avoid leaving any subscriptions hanging\n        unsubscribeRef.current();\n      }\n\n      // Update cellRef and the store's state to point to the new DOM node\n      setCell(columnId, cellElement);\n\n      // Update cell styles imperatively to avoid unnecessary re-renders.\n      const selector = (state: StickyColumnsState) => state.cellState.get(columnId) ?? null;\n\n      const updateCellStyles = (state: null | StickyColumnsCellState, prev: null | StickyColumnsCellState) => {\n        if (isCellStatesEqual(state, prev)) {\n          return;\n        }\n\n        const className = getClassName(state);\n        if (cellElement) {\n          Object.keys(className).forEach(key => {\n            if (className[key]) {\n              cellElement.classList.add(key);\n            } else {\n              cellElement.classList.remove(key);\n            }\n          });\n          cellElement.style.insetInlineStart =\n            state?.offset.insetInlineStart !== undefined ? `${state.offset.insetInlineStart}px` : '';\n          cellElement.style.insetInlineEnd =\n            state?.offset.insetInlineEnd !== undefined ? `${state.offset.insetInlineEnd}px` : '';\n        }\n      };\n\n      // If the node is not null (i.e., the table cell is being mounted or updated, not unmounted),\n      // set up a new subscription to the store's updates\n      if (cellElement) {\n        unsubscribeRef.current = stickyColumns.store.subscribe(selector, (newState, prevState) => {\n          updateCellStyles(selector(newState), selector(prevState));\n        });\n      }\n    },\n\n    // getClassName is expected to be pure\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [columnId, setCell, stickyColumns.store]\n  );\n\n  // Provide cell styles as props so that a re-render won't cause invalidation.\n  const cellStyles = stickyColumns.store.get().cellState.get(columnId);\n  return {\n    ref: refCallback,\n    className: cellStyles ? clsx(getClassName(cellStyles)) : undefined,\n    style: cellStyles?.offset ?? undefined,\n  };\n}\n\ninterface UpdateCellStylesProps {\n  wrapper: HTMLElement;\n  table: HTMLElement;\n  cells: Map<PropertyKey, HTMLElement>;\n  visibleColumns: readonly PropertyKey[];\n  stickyColumnsFirst: number;\n  stickyColumnsLast: number;\n}\n\nclass StickyColumnsStore extends AsyncStore<StickyColumnsState> {\n  private cellOffsets: CellOffsets = {\n    offsets: new Map(),\n    stickyWidthInlineStart: 0,\n    stickyWidthInlineEnd: 0,\n  };\n  private isStuckToTheInlineStart = false;\n  private isStuckToTheInlineEnd = false;\n  private padInlineStart = false;\n\n  constructor() {\n    super({ cellState: new Map(), wrapperState: { scrollPaddingInlineStart: 0, scrollPaddingInlineEnd: 0 } });\n  }\n\n  public updateCellStyles(props: UpdateCellStylesProps) {\n    const hasStickyColumns = props.stickyColumnsFirst + props.stickyColumnsLast > 0;\n    const hadStickyColumns = this.cellOffsets.offsets.size > 0;\n\n    if (hasStickyColumns || hadStickyColumns) {\n      this.updateScroll(props);\n      this.updateCellOffsets(props);\n      this.set(() => ({\n        cellState: this.generateCellStyles(props),\n        wrapperState: {\n          scrollPaddingInlineStart: this.cellOffsets.stickyWidthInlineStart,\n          scrollPaddingInlineEnd: this.cellOffsets.stickyWidthInlineEnd,\n        },\n      }));\n    }\n  }\n\n  private updateScroll(props: UpdateCellStylesProps) {\n    const wrapperScrollInlineStart = getScrollInlineStart(props.wrapper);\n    const wrapperScrollWidth = props.wrapper.scrollWidth;\n    const wrapperClientWidth = props.wrapper.clientWidth;\n    const tablePaddingInlineStart = parseFloat(getComputedStyle(props.table).paddingInlineStart) || 0;\n    const tablePaddingInlineEnd = parseFloat(getComputedStyle(props.table).paddingInlineEnd) || 0;\n\n    this.isStuckToTheInlineStart = wrapperScrollInlineStart > tablePaddingInlineStart;\n\n    // Math.ceil() is used here to address an edge-case in certain browsers, where they return non-integer wrapperScrollInlineStart values\n    // which are lower than expected (sub-pixel difference), resulting in the table always being in the \"stuck to the right\" state\n    this.isStuckToTheInlineEnd =\n      Math.ceil(wrapperScrollInlineStart) < wrapperScrollWidth - wrapperClientWidth - tablePaddingInlineEnd;\n\n    this.padInlineStart = tablePaddingInlineStart !== 0 && this.isStuckToTheInlineStart;\n  }\n\n  private generateCellStyles = (props: UpdateCellStylesProps): Map<PropertyKey, StickyColumnsCellState> => {\n    const isEnabled = this.isEnabled(props);\n    const lastLeftStickyColumnIndex = props.stickyColumnsFirst - 1;\n    const lastRightStickyColumnIndex = props.visibleColumns.length - props.stickyColumnsLast;\n\n    return props.visibleColumns.reduce((acc, columnId, index) => {\n      let stickySide = 'non-sticky';\n      if (index < props.stickyColumnsFirst) {\n        stickySide = 'inline-start';\n      } else if (index >= props.visibleColumns.length - props.stickyColumnsLast) {\n        stickySide = 'inline-end';\n      }\n\n      if (!isEnabled || stickySide === 'non-sticky') {\n        return acc;\n      }\n\n      // Determine the offset of the sticky column using the `cellOffsets` state object\n      const isFirstColumn = index === 0;\n      const stickyColumnOffsetLeft = this.cellOffsets.offsets.get(columnId)?.first ?? 0;\n      const stickyColumnOffsetRight = this.cellOffsets.offsets.get(columnId)?.last ?? 0;\n\n      acc.set(columnId, {\n        padInlineStart: isFirstColumn && this.padInlineStart,\n        lastInsetInlineStart: this.isStuckToTheInlineStart && lastLeftStickyColumnIndex === index,\n        lastInsetInlineEnd: this.isStuckToTheInlineEnd && lastRightStickyColumnIndex === index,\n        offset: {\n          insetInlineStart: stickySide === 'inline-start' ? stickyColumnOffsetLeft : undefined,\n          insetInlineEnd: stickySide === 'inline-end' ? stickyColumnOffsetRight : undefined,\n        },\n      });\n      return acc;\n    }, new Map<PropertyKey, StickyColumnsCellState>());\n  };\n\n  private updateCellOffsets = (props: UpdateCellStylesProps): void => {\n    this.cellOffsets = updateCellOffsets(props.cells, props);\n  };\n\n  private isEnabled = (props: UpdateCellStylesProps): boolean => {\n    const noStickyColumns = props.stickyColumnsFirst + props.stickyColumnsLast === 0;\n    if (noStickyColumns) {\n      return false;\n    }\n\n    const wrapperWidth = getLogicalBoundingClientRect(props.wrapper).inlineSize;\n    const tableWidth = getLogicalBoundingClientRect(props.table).inlineSize;\n    const isWrapperScrollable = tableWidth > wrapperWidth;\n    if (!isWrapperScrollable) {\n      return false;\n    }\n\n    const totalStickySpace = this.cellOffsets.stickyWidthInlineStart + this.cellOffsets.stickyWidthInlineEnd;\n    const tablePaddingLeft = parseFloat(getComputedStyle(props.table).paddingLeft) || 0;\n    const tablePaddingRight = parseFloat(getComputedStyle(props.table).paddingRight) || 0;\n    const hasEnoughScrollableSpace =\n      totalStickySpace + MINIMUM_SCROLLABLE_SPACE + tablePaddingLeft + tablePaddingRight < wrapperWidth;\n    if (!hasEnoughScrollableSpace) {\n      return false;\n    }\n\n    return true;\n  };\n}\n"]}
+{"version":3,"file":"use-sticky-columns.js","sourceRoot":"","sources":["../../../../src/table/sticky-columns/use-sticky-columns.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 React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver, useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { getLogicalBoundingClientRect, getScrollInlineStart } from '@cloudscape-design/component-toolkit/internal';\n\nimport AsyncStore, { ReadonlyAsyncStore } from '../../area-chart/async-store';\nimport {\n  CellOffsets,\n  StickyColumnsCellState,\n  StickyColumnsProps,\n  StickyColumnsState,\n  StickyColumnsWrapperState,\n} from './interfaces';\nimport { isCellStatesEqual, isWrapperStatesEqual, updateCellOffsets } from './utils';\n\n// We allow the table to have a minimum of 148px of available space besides the sum of the widths of the sticky columns\n// This value is an UX recommendation and is approximately 1/3 of our smallest breakpoint (465px)\nconst MINIMUM_SCROLLABLE_SPACE = 148;\n\nexport interface StickyColumnsModel {\n  store: ReadonlyAsyncStore<StickyColumnsState>;\n  style: {\n    wrapper?: React.CSSProperties;\n  };\n  refs: {\n    table: React.RefCallback<HTMLElement>;\n    wrapper: React.RefCallback<HTMLElement>;\n    cell: (columnId: PropertyKey, node: null | HTMLElement) => void;\n  };\n}\n\nexport function useStickyColumns({\n  visibleColumns,\n  stickyColumnsFirst,\n  stickyColumnsLast,\n}: StickyColumnsProps): StickyColumnsModel {\n  const store = useMemo(() => new StickyColumnsStore(), []);\n  const wrapperRef = useRef<HTMLElement>(null) as React.MutableRefObject<null | HTMLElement>;\n  const tableRef = useRef<HTMLElement>(null) as React.MutableRefObject<null | HTMLElement>;\n  const cellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n\n  const hasStickyColumns = stickyColumnsFirst + stickyColumnsLast > 0;\n\n  const updateStickyStyles = useStableCallback(() => {\n    if (wrapperRef.current && tableRef.current) {\n      store.updateCellStyles({\n        wrapper: wrapperRef.current,\n        table: tableRef.current,\n        cells: cellsRef.current,\n        visibleColumns,\n        stickyColumnsFirst,\n        stickyColumnsLast,\n      });\n    }\n  });\n\n  useResizeObserver(wrapperRef, updateStickyStyles);\n\n  useResizeObserver(tableRef, updateStickyStyles);\n\n  useEffect(() => {\n    if (wrapperRef.current && tableRef.current) {\n      store.updateCellStyles({\n        wrapper: wrapperRef.current,\n        table: tableRef.current,\n        cells: cellsRef.current,\n        visibleColumns,\n        stickyColumnsFirst,\n        stickyColumnsLast,\n      });\n    }\n  }, [store, stickyColumnsFirst, stickyColumnsLast, visibleColumns]);\n\n  // Update wrapper styles imperatively to avoid unnecessary re-renders.\n  useEffect(() => {\n    if (!hasStickyColumns) {\n      return;\n    }\n\n    const selector = (state: StickyColumnsState) => state.wrapperState;\n\n    const updateWrapperStyles = (state: StickyColumnsWrapperState, prev: StickyColumnsWrapperState) => {\n      if (isWrapperStatesEqual(state, prev)) {\n        return;\n      }\n\n      if (wrapperRef.current) {\n        wrapperRef.current.style.scrollPaddingInlineStart = state.scrollPaddingInlineStart + 'px';\n        wrapperRef.current.style.scrollPaddingInlineEnd = state.scrollPaddingInlineEnd + 'px';\n      }\n    };\n\n    const unsubscribe = store.subscribe(selector, (newState, prevState) =>\n      updateWrapperStyles(selector(newState), selector(prevState))\n    );\n    return unsubscribe;\n  }, [store, hasStickyColumns]);\n\n  const setWrapper = useCallback(\n    (node: null | HTMLElement) => {\n      if (wrapperRef.current) {\n        wrapperRef.current.removeEventListener('scroll', updateStickyStyles);\n      }\n      if (node && hasStickyColumns) {\n        node.addEventListener('scroll', updateStickyStyles);\n      }\n      wrapperRef.current = node;\n    },\n    [hasStickyColumns, updateStickyStyles]\n  );\n\n  const setTable = useCallback((node: null | HTMLElement) => {\n    tableRef.current = node;\n  }, []);\n\n  const setCell = useCallback((columnId: PropertyKey, node: null | HTMLElement) => {\n    if (node) {\n      cellsRef.current.set(columnId, node);\n    } else {\n      cellsRef.current.delete(columnId);\n    }\n  }, []);\n\n  return {\n    store,\n    style: {\n      // Provide wrapper styles as props so that a re-render won't cause invalidation.\n      wrapper: hasStickyColumns ? { ...store.get().wrapperState } : undefined,\n    },\n    refs: { wrapper: setWrapper, table: setTable, cell: setCell },\n  };\n}\n\ninterface UseStickyCellStylesProps {\n  stickyColumns: StickyColumnsModel;\n  columnId: PropertyKey;\n  getClassName: (styles: null | StickyColumnsCellState) => Record<string, boolean>;\n}\n\ninterface StickyCellStyles {\n  ref: React.RefCallback<HTMLElement>;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function useStickyCellStyles({\n  stickyColumns,\n  columnId,\n  getClassName,\n}: UseStickyCellStylesProps): StickyCellStyles {\n  const setCell = stickyColumns.refs.cell;\n\n  // unsubscribeRef to hold the function to unsubscribe from the store's updates\n  const unsubscribeRef = useRef<null | (() => void)>(null);\n\n  // refCallback updates the cell ref and sets up the store subscription\n  const refCallback = useCallback(\n    (cellElement: null | HTMLElement) => {\n      if (unsubscribeRef.current) {\n        // Unsubscribe before we do any updates to avoid leaving any subscriptions hanging\n        unsubscribeRef.current();\n      }\n\n      // Update cellRef and the store's state to point to the new DOM node\n      setCell(columnId, cellElement);\n\n      // Update cell styles imperatively to avoid unnecessary re-renders.\n      const selector = (state: StickyColumnsState) => state.cellState.get(columnId) ?? null;\n\n      const updateCellStyles = (state: null | StickyColumnsCellState, prev: null | StickyColumnsCellState) => {\n        if (isCellStatesEqual(state, prev)) {\n          return;\n        }\n\n        const className = getClassName(state);\n        if (cellElement) {\n          Object.keys(className).forEach(key => {\n            if (className[key]) {\n              cellElement.classList.add(key);\n            } else {\n              cellElement.classList.remove(key);\n            }\n          });\n          cellElement.style.insetInlineStart =\n            state?.offset.insetInlineStart !== undefined ? `${state.offset.insetInlineStart}px` : '';\n          cellElement.style.insetInlineEnd =\n            state?.offset.insetInlineEnd !== undefined ? `${state.offset.insetInlineEnd}px` : '';\n        }\n      };\n\n      // If the node is not null (i.e., the table cell is being mounted or updated, not unmounted),\n      // set up a new subscription to the store's updates\n      if (cellElement) {\n        unsubscribeRef.current = stickyColumns.store.subscribe(selector, (newState, prevState) => {\n          updateCellStyles(selector(newState), selector(prevState));\n        });\n      }\n    },\n\n    // getClassName is expected to be pure\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [columnId, setCell, stickyColumns.store]\n  );\n\n  // Provide cell styles as props so that a re-render won't cause invalidation.\n  const cellStyles = stickyColumns.store.get().cellState.get(columnId);\n  return {\n    ref: refCallback,\n    className: cellStyles ? clsx(getClassName(cellStyles)) : undefined,\n    style: cellStyles?.offset ?? undefined,\n  };\n}\n\ninterface UpdateCellStylesProps {\n  wrapper: HTMLElement;\n  table: HTMLElement;\n  cells: Map<PropertyKey, HTMLElement>;\n  visibleColumns: readonly PropertyKey[];\n  stickyColumnsFirst: number;\n  stickyColumnsLast: number;\n}\n\nclass StickyColumnsStore extends AsyncStore<StickyColumnsState> {\n  private cellOffsets: CellOffsets = {\n    offsets: new Map(),\n    stickyWidthInlineStart: 0,\n    stickyWidthInlineEnd: 0,\n  };\n  private isStuckToTheInlineStart = false;\n  private isStuckToTheInlineEnd = false;\n  private padInlineStart = false;\n\n  constructor() {\n    super({ cellState: new Map(), wrapperState: { scrollPaddingInlineStart: 0, scrollPaddingInlineEnd: 0 } });\n  }\n\n  public updateCellStyles(props: UpdateCellStylesProps) {\n    const hasStickyColumns = props.stickyColumnsFirst + props.stickyColumnsLast > 0;\n    const hadStickyColumns = this.cellOffsets.offsets.size > 0;\n\n    if (hasStickyColumns || hadStickyColumns) {\n      this.updateScroll(props);\n      this.updateCellOffsets(props);\n      this.set(() => ({\n        cellState: this.generateCellStyles(props),\n        wrapperState: {\n          scrollPaddingInlineStart: this.cellOffsets.stickyWidthInlineStart,\n          scrollPaddingInlineEnd: this.cellOffsets.stickyWidthInlineEnd,\n        },\n      }));\n    }\n  }\n\n  private updateScroll(props: UpdateCellStylesProps) {\n    const wrapperScrollInlineStart = getScrollInlineStart(props.wrapper);\n    const wrapperScrollWidth = props.wrapper.scrollWidth;\n    const wrapperClientWidth = props.wrapper.clientWidth;\n    const tablePaddingInlineStart = parseFloat(getComputedStyle(props.table).paddingInlineStart) || 0;\n    const tablePaddingInlineEnd = parseFloat(getComputedStyle(props.table).paddingInlineEnd) || 0;\n\n    this.isStuckToTheInlineStart = wrapperScrollInlineStart > tablePaddingInlineStart;\n\n    // Math.ceil() is used here to address an edge-case in certain browsers, where they return non-integer wrapperScrollInlineStart values\n    // which are lower than expected (sub-pixel difference), resulting in the table always being in the \"stuck to the right\" state\n    this.isStuckToTheInlineEnd =\n      Math.ceil(wrapperScrollInlineStart) < wrapperScrollWidth - wrapperClientWidth - tablePaddingInlineEnd;\n\n    this.padInlineStart = tablePaddingInlineStart !== 0 && this.isStuckToTheInlineStart;\n  }\n\n  private generateCellStyles = (props: UpdateCellStylesProps): Map<PropertyKey, StickyColumnsCellState> => {\n    const isEnabled = this.isEnabled(props);\n    const lastLeftStickyColumnIndex = props.stickyColumnsFirst - 1;\n    const lastRightStickyColumnIndex = props.visibleColumns.length - props.stickyColumnsLast;\n\n    return props.visibleColumns.reduce((acc, columnId, index) => {\n      let stickySide = 'non-sticky';\n      if (index < props.stickyColumnsFirst) {\n        stickySide = 'inline-start';\n      } else if (index >= props.visibleColumns.length - props.stickyColumnsLast) {\n        stickySide = 'inline-end';\n      }\n\n      if (!isEnabled || stickySide === 'non-sticky') {\n        return acc;\n      }\n\n      // Determine the offset of the sticky column using the `cellOffsets` state object\n      const isFirstColumn = index === 0;\n      const stickyColumnOffsetLeft = this.cellOffsets.offsets.get(columnId)?.first ?? 0;\n      const stickyColumnOffsetRight = this.cellOffsets.offsets.get(columnId)?.last ?? 0;\n\n      acc.set(columnId, {\n        padInlineStart: isFirstColumn && this.padInlineStart,\n        lastInsetInlineStart: this.isStuckToTheInlineStart && lastLeftStickyColumnIndex === index,\n        lastInsetInlineEnd: this.isStuckToTheInlineEnd && lastRightStickyColumnIndex === index,\n        offset: {\n          insetInlineStart: stickySide === 'inline-start' ? stickyColumnOffsetLeft : undefined,\n          insetInlineEnd: stickySide === 'inline-end' ? stickyColumnOffsetRight : undefined,\n        },\n      });\n      return acc;\n    }, new Map<PropertyKey, StickyColumnsCellState>());\n  };\n\n  private updateCellOffsets = (props: UpdateCellStylesProps): void => {\n    this.cellOffsets = updateCellOffsets(props.cells, props);\n  };\n\n  private isEnabled = (props: UpdateCellStylesProps): boolean => {\n    const noStickyColumns = props.stickyColumnsFirst + props.stickyColumnsLast === 0;\n    if (noStickyColumns) {\n      return false;\n    }\n\n    const wrapperWidth = getLogicalBoundingClientRect(props.wrapper).inlineSize;\n    const tableWidth = getLogicalBoundingClientRect(props.table).inlineSize;\n    const isWrapperScrollable = tableWidth > wrapperWidth;\n    if (!isWrapperScrollable) {\n      return false;\n    }\n\n    const totalStickySpace = this.cellOffsets.stickyWidthInlineStart + this.cellOffsets.stickyWidthInlineEnd;\n    const tablePaddingLeft = parseFloat(getComputedStyle(props.table).paddingLeft) || 0;\n    const tablePaddingRight = parseFloat(getComputedStyle(props.table).paddingRight) || 0;\n    const hasEnoughScrollableSpace =\n      totalStickySpace + MINIMUM_SCROLLABLE_SPACE + tablePaddingLeft + tablePaddingRight < wrapperWidth;\n    if (!hasEnoughScrollableSpace) {\n      return false;\n    }\n\n    return true;\n  };\n}\n"]}

package/lib/internal/template/table/sticky-header.js

@@ -26,7 +26,7 @@ function StickyHeader({ variant, theadProps, wrapperRef, theadRef, secondaryWrap
         // Prevents receiving focus in Firefox. Focus on the overflowing table is sufficient
         // to scroll the table horizontally
         tabIndex: -1, ref: secondaryWrapperRef, onScroll: onScroll },
-        React.createElement("table", Object.assign({ className: clsx(styles.table, styles['table-layout-fixed'], contentDensity === 'compact' && getVisualContextClassname('compact-table')), ref: secondaryTableRef }, getTableRoleProps({ tableRole })),
-            React.createElement(Thead, Object.assign({ ref: secondaryTheadRef, sticky: true, stuck: isStuck, focusedComponent: focusedComponent }, theadProps)))));
+        React.createElement("table", { className: clsx(styles.table, styles['table-layout-fixed'], contentDensity === 'compact' && getVisualContextClassname('compact-table')), ref: secondaryTableRef, ...getTableRoleProps({ tableRole }) },
+            React.createElement(Thead, { ref: secondaryTheadRef, sticky: true, stuck: isStuck, focusedComponent: focusedComponent, ...theadProps }))));
 }
 //# sourceMappingURL=sticky-header.js.map

package/lib/internal/template/table/sticky-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"sticky-header.js","sourceRoot":"","sources":["../../../src/table/sticky-header.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAC;AAElF,OAAO,EAAE,iBAAiB,EAAa,MAAM,cAAc,CAAC;AAC5D,OAAO,KAAqB,MAAM,SAAS,CAAC;AAC5C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAqBrC,eAAe,UAAU,CAAC,YAAY,CAAC,CAAC;AAExC,SAAS,YAAY,CACnB,EACE,OAAO,EACP,UAAU,EACV,UAAU,EACV,QAAQ,EACR,mBAAmB,EACnB,QAAQ,EACR,QAAQ,EACR,cAAc,EACd,cAAc,EACd,SAAS,GACS,EACpB,GAA+B;IAE/B,MAAM,iBAAiB,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACzD,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAEpD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC9E,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,eAAe,CAClD,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,iBAAiB,EACjB,UAAU,CACX,CAAC;IAEF,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;QAC9B,WAAW;QACX,WAAW;QACX,QAAQ,EAAE,mBAAmB;KAC9B,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC,WAAW,OAAO,EAAE,CAAC,EAAE;YACxE,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAAE,cAAc;SAC7C,CAAC,iBACW,IAAI;QACjB,oFAAoF;QACpF,mCAAmC;QACnC,QAAQ,EAAE,CAAC,CAAC,EACZ,GAAG,EAAE,mBAAmB,EACxB,QAAQ,EAAE,QAAQ;QAElB,6CACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,KAAK,EACZ,MAAM,CAAC,oBAAoB,CAAC,EAC5B,cAAc,KAAK,SAAS,IAAI,yBAAyB,CAAC,eAAe,CAAC,CAC3E,EACD,GAAG,EAAE,iBAAiB,IAClB,iBAAiB,CAAC,EAAE,SAAS,EAAE,CAAC;YAEpC,oBAAC,KAAK,kBACJ,GAAG,EAAE,iBAAiB,EACtB,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,OAAO,EACd,gBAAgB,EAAE,gBAAgB,IAC9B,UAAU,EACd,CACI,CACJ,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useContext, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { StickyHeaderContext } from '../container/use-sticky-header';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport { TableProps } from './interfaces';\nimport { getTableRoleProps, TableRole } from './table-role';\nimport Thead, { TheadProps } from './thead';\nimport { useStickyHeader } from './use-sticky-header';\n\nimport styles from './styles.css.js';\n\nexport interface StickyHeaderRef {\n  scrollToTop(): void;\n  scrollToRow(node: null | HTMLElement): void;\n  setFocus(focusId: null | string): void;\n}\n\ninterface StickyHeaderProps {\n  variant: TableProps.Variant;\n  theadProps: TheadProps;\n  wrapperRef: React.RefObject<HTMLDivElement>;\n  theadRef: React.RefObject<HTMLTableRowElement>;\n  secondaryWrapperRef: React.RefObject<HTMLDivElement>;\n  tableRef: React.RefObject<HTMLTableElement>;\n  onScroll?: React.UIEventHandler<HTMLDivElement>;\n  contentDensity?: 'comfortable' | 'compact';\n  tableHasHeader?: boolean;\n  tableRole: TableRole;\n}\n\nexport default forwardRef(StickyHeader);\n\nfunction StickyHeader(\n  {\n    variant,\n    theadProps,\n    wrapperRef,\n    theadRef,\n    secondaryWrapperRef,\n    onScroll,\n    tableRef,\n    tableHasHeader,\n    contentDensity,\n    tableRole,\n  }: StickyHeaderProps,\n  ref: React.Ref<StickyHeaderRef>\n) {\n  const secondaryTheadRef = useRef<HTMLTableRowElement>(null);\n  const secondaryTableRef = useRef<HTMLTableElement>(null);\n  const { isStuck } = useContext(StickyHeaderContext);\n\n  const [focusedComponent, setFocusedComponent] = useState<null | string>(null);\n  const { scrollToRow, scrollToTop } = useStickyHeader(\n    tableRef,\n    theadRef,\n    secondaryTheadRef,\n    secondaryTableRef,\n    wrapperRef\n  );\n\n  useImperativeHandle(ref, () => ({\n    scrollToTop,\n    scrollToRow,\n    setFocus: setFocusedComponent,\n  }));\n\n  return (\n    <div\n      className={clsx(styles['header-secondary'], styles[`variant-${variant}`], {\n        [styles['table-has-header']]: tableHasHeader,\n      })}\n      aria-hidden={true}\n      // Prevents receiving focus in Firefox. Focus on the overflowing table is sufficient\n      // to scroll the table horizontally\n      tabIndex={-1}\n      ref={secondaryWrapperRef}\n      onScroll={onScroll}\n    >\n      <table\n        className={clsx(\n          styles.table,\n          styles['table-layout-fixed'],\n          contentDensity === 'compact' && getVisualContextClassname('compact-table')\n        )}\n        ref={secondaryTableRef}\n        {...getTableRoleProps({ tableRole })}\n      >\n        <Thead\n          ref={secondaryTheadRef}\n          sticky={true}\n          stuck={isStuck}\n          focusedComponent={focusedComponent}\n          {...theadProps}\n        />\n      </table>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"sticky-header.js","sourceRoot":"","sources":["../../../src/table/sticky-header.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAC;AAElF,OAAO,EAAE,iBAAiB,EAAa,MAAM,cAAc,CAAC;AAC5D,OAAO,KAAqB,MAAM,SAAS,CAAC;AAC5C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAqBrC,eAAe,UAAU,CAAC,YAAY,CAAC,CAAC;AAExC,SAAS,YAAY,CACnB,EACE,OAAO,EACP,UAAU,EACV,UAAU,EACV,QAAQ,EACR,mBAAmB,EACnB,QAAQ,EACR,QAAQ,EACR,cAAc,EACd,cAAc,EACd,SAAS,GACS,EACpB,GAA+B;IAE/B,MAAM,iBAAiB,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACzD,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAEpD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC9E,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,eAAe,CAClD,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,iBAAiB,EACjB,UAAU,CACX,CAAC;IAEF,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;QAC9B,WAAW;QACX,WAAW;QACX,QAAQ,EAAE,mBAAmB;KAC9B,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC,WAAW,OAAO,EAAE,CAAC,EAAE;YACxE,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAAE,cAAc;SAC7C,CAAC,iBACW,IAAI;QACjB,oFAAoF;QACpF,mCAAmC;QACnC,QAAQ,EAAE,CAAC,CAAC,EACZ,GAAG,EAAE,mBAAmB,EACxB,QAAQ,EAAE,QAAQ;QAElB,+BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,KAAK,EACZ,MAAM,CAAC,oBAAoB,CAAC,EAC5B,cAAc,KAAK,SAAS,IAAI,yBAAyB,CAAC,eAAe,CAAC,CAC3E,EACD,GAAG,EAAE,iBAAiB,KAClB,iBAAiB,CAAC,EAAE,SAAS,EAAE,CAAC;YAEpC,oBAAC,KAAK,IACJ,GAAG,EAAE,iBAAiB,EACtB,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,OAAO,EACd,gBAAgB,EAAE,gBAAgB,KAC9B,UAAU,GACd,CACI,CACJ,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useContext, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { StickyHeaderContext } from '../container/use-sticky-header';\nimport { getVisualContextClassname } from '../internal/components/visual-context';\nimport { TableProps } from './interfaces';\nimport { getTableRoleProps, TableRole } from './table-role';\nimport Thead, { TheadProps } from './thead';\nimport { useStickyHeader } from './use-sticky-header';\n\nimport styles from './styles.css.js';\n\nexport interface StickyHeaderRef {\n  scrollToTop(): void;\n  scrollToRow(node: null | HTMLElement): void;\n  setFocus(focusId: null | string): void;\n}\n\ninterface StickyHeaderProps {\n  variant: TableProps.Variant;\n  theadProps: TheadProps;\n  wrapperRef: React.RefObject<HTMLDivElement>;\n  theadRef: React.RefObject<HTMLTableRowElement>;\n  secondaryWrapperRef: React.RefObject<HTMLDivElement>;\n  tableRef: React.RefObject<HTMLTableElement>;\n  onScroll?: React.UIEventHandler<HTMLDivElement>;\n  contentDensity?: 'comfortable' | 'compact';\n  tableHasHeader?: boolean;\n  tableRole: TableRole;\n}\n\nexport default forwardRef(StickyHeader);\n\nfunction StickyHeader(\n  {\n    variant,\n    theadProps,\n    wrapperRef,\n    theadRef,\n    secondaryWrapperRef,\n    onScroll,\n    tableRef,\n    tableHasHeader,\n    contentDensity,\n    tableRole,\n  }: StickyHeaderProps,\n  ref: React.Ref<StickyHeaderRef>\n) {\n  const secondaryTheadRef = useRef<HTMLTableRowElement>(null);\n  const secondaryTableRef = useRef<HTMLTableElement>(null);\n  const { isStuck } = useContext(StickyHeaderContext);\n\n  const [focusedComponent, setFocusedComponent] = useState<null | string>(null);\n  const { scrollToRow, scrollToTop } = useStickyHeader(\n    tableRef,\n    theadRef,\n    secondaryTheadRef,\n    secondaryTableRef,\n    wrapperRef\n  );\n\n  useImperativeHandle(ref, () => ({\n    scrollToTop,\n    scrollToRow,\n    setFocus: setFocusedComponent,\n  }));\n\n  return (\n    <div\n      className={clsx(styles['header-secondary'], styles[`variant-${variant}`], {\n        [styles['table-has-header']]: tableHasHeader,\n      })}\n      aria-hidden={true}\n      // Prevents receiving focus in Firefox. Focus on the overflowing table is sufficient\n      // to scroll the table horizontally\n      tabIndex={-1}\n      ref={secondaryWrapperRef}\n      onScroll={onScroll}\n    >\n      <table\n        className={clsx(\n          styles.table,\n          styles['table-layout-fixed'],\n          contentDensity === 'compact' && getVisualContextClassname('compact-table')\n        )}\n        ref={secondaryTableRef}\n        {...getTableRoleProps({ tableRole })}\n      >\n        <Thead\n          ref={secondaryTheadRef}\n          sticky={true}\n          stuck={isStuck}\n          focusedComponent={focusedComponent}\n          {...theadProps}\n        />\n      </table>\n    </div>\n  );\n}\n"]}

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

@@ -24,22 +24,22 @@ const Thead = React.forwardRef(({ selectionType, getSelectAllProps, columnDefini
         stickyState,
     };
     return (React.createElement("thead", { className: clsx(!hidden && styles['thead-active']) },
-        React.createElement("tr", Object.assign({}, focusMarkers.all, { ref: outerRef, "aria-rowindex": 1 }, getTableHeaderRowRoleProps({ tableRole }), { onFocus: event => {
+        React.createElement("tr", { ...focusMarkers.all, ref: outerRef, "aria-rowindex": 1, ...getTableHeaderRowRoleProps({ tableRole }), onFocus: event => {
                 var _a;
                 const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));
                 const focusId = (_a = focusControlElement === null || focusControlElement === void 0 ? void 0 : focusControlElement.getAttribute('data-focus-id')) !== null && _a !== void 0 ? _a : null;
                 onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange(focusId);
-            }, onBlur: () => onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange(null) }),
-            selectionType ? (React.createElement(TableHeaderSelectionCell, Object.assign({}, commonCellProps, { focusedComponent: focusedComponent, columnId: selectionColumnId, getSelectAllProps: getSelectAllProps, onFocusMove: onFocusMove, singleSelectionHeaderAriaLabel: singleSelectionHeaderAriaLabel }))) : null,
+            }, onBlur: () => onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange(null) },
+            selectionType ? (React.createElement(TableHeaderSelectionCell, { ...commonCellProps, focusedComponent: focusedComponent, columnId: selectionColumnId, getSelectAllProps: getSelectAllProps, onFocusMove: onFocusMove, singleSelectionHeaderAriaLabel: singleSelectionHeaderAriaLabel })) : null,
             columnDefinitions.map((column, colIndex) => {
                 const columnId = getColumnKey(column, colIndex);
-                return (React.createElement(TableHeaderCell, Object.assign({}, commonCellProps, { key: columnId, tabIndex: sticky ? -1 : 0, focusedComponent: focusedComponent, column: column, activeSortingColumn: sortingColumn, sortingDescending: sortingDescending, sortingDisabled: sortingDisabled, wrapLines: wrapLines, colIndex: selectionType ? colIndex + 1 : colIndex, columnId: columnId, updateColumn: updateColumn, onResizeFinish: () => onResizeFinish(columnWidths), resizableColumns: resizableColumns, resizableStyle: getColumnStyles(sticky, columnId), onClick: detail => {
+                return (React.createElement(TableHeaderCell, { ...commonCellProps, key: columnId, tabIndex: sticky ? -1 : 0, focusedComponent: focusedComponent, column: column, activeSortingColumn: sortingColumn, sortingDescending: sortingDescending, sortingDisabled: sortingDisabled, wrapLines: wrapLines, colIndex: selectionType ? colIndex + 1 : colIndex, columnId: columnId, updateColumn: updateColumn, onResizeFinish: () => onResizeFinish(columnWidths), resizableColumns: resizableColumns, resizableStyle: getColumnStyles(sticky, columnId), onClick: detail => {
                         setLastUserAction('sorting');
                         fireNonCancelableEvent(onSortingChange, detail);
                     }, isEditable: !!column.editConfig, cellRef: node => setCell(sticky, columnId, node), tableRole: tableRole, resizerRoleDescription: resizerRoleDescription, resizerTooltipText: resizerTooltipText, 
                     // Expandable option is only applicable to the first data column of the table.
                     // When present, the header content receives extra padding to match the first offset in the data cells.
-                    isExpandable: colIndex === 0 && isExpandable, hasDynamicContent: hidden && !resizableColumns && column.hasDynamicContent })));
+                    isExpandable: colIndex === 0 && isExpandable, hasDynamicContent: hidden && !resizableColumns && column.hasDynamicContent }));
             }))));
 });
 export default Thead;

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

@@ -1 +1 @@
-{"version":3,"file":"thead.js","sourceRoot":"","sources":["../../../src/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 React from 'react';\nimport clsx from 'clsx';\n\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\n\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { TableHeaderCell } from './header-cell';\nimport { TableProps } from './interfaces';\nimport { focusMarkers, SelectionProps } from './selection';\nimport { TableHeaderSelectionCell } from './selection/selection-cell';\nimport { StickyColumnsModel } from './sticky-columns';\nimport { getTableHeaderRowRoleProps, TableRole } from './table-role';\nimport { useColumnWidths } from './use-column-widths';\nimport { getColumnKey } from './utils';\n\nimport styles from './styles.css.js';\n\nexport interface TheadProps {\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  tableVariant?: string;\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: Map<PropertyKey, number>) => void;\n  onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> | undefined;\n  sticky?: boolean;\n  hidden?: boolean;\n  stuck?: boolean;\n  singleSelectionHeaderAriaLabel?: string;\n  resizerRoleDescription?: string;\n  resizerTooltipText?: string;\n  stripedRows?: boolean;\n  stickyState: StickyColumnsModel;\n  selectionColumnId: PropertyKey;\n  focusedComponent?: null | string;\n  onFocusedComponentChange?: (focusId: null | string) => void;\n  tableRole: TableRole;\n  isExpandable?: boolean;\n  setLastUserAction: (name: string) => void;\n}\n\nconst Thead = React.forwardRef(\n  (\n    {\n      selectionType,\n      getSelectAllProps,\n      columnDefinitions,\n      sortingColumn,\n      sortingDisabled,\n      sortingDescending,\n      resizableColumns,\n      variant,\n      tableVariant,\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      tableRole,\n      resizerRoleDescription,\n      resizerTooltipText,\n      isExpandable,\n      setLastUserAction,\n    }: TheadProps,\n    outerRef: React.Ref<HTMLTableRowElement>\n  ) => {\n    const { getColumnStyles, columnWidths, updateColumn, setCell } = useColumnWidths();\n\n    const commonCellProps = {\n      stuck,\n      sticky,\n      hidden,\n      stripedRows,\n      tableRole,\n      variant,\n      tableVariant,\n      stickyState,\n    };\n\n    return (\n      <thead className={clsx(!hidden && styles['thead-active'])}>\n        <tr\n          {...focusMarkers.all}\n          ref={outerRef}\n          aria-rowindex={1}\n          {...getTableHeaderRowRoleProps({ tableRole })}\n          onFocus={event => {\n            const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));\n            const focusId = focusControlElement?.getAttribute('data-focus-id') ?? null;\n            onFocusedComponentChange?.(focusId);\n          }}\n          onBlur={() => onFocusedComponentChange?.(null)}\n        >\n          {selectionType ? (\n            <TableHeaderSelectionCell\n              {...commonCellProps}\n              focusedComponent={focusedComponent}\n              columnId={selectionColumnId}\n              getSelectAllProps={getSelectAllProps}\n              onFocusMove={onFocusMove}\n              singleSelectionHeaderAriaLabel={singleSelectionHeaderAriaLabel}\n            />\n          ) : null}\n\n          {columnDefinitions.map((column, colIndex) => {\n            const columnId = getColumnKey(column, colIndex);\n            return (\n              <TableHeaderCell\n                {...commonCellProps}\n                key={columnId}\n                tabIndex={sticky ? -1 : 0}\n                focusedComponent={focusedComponent}\n                column={column}\n                activeSortingColumn={sortingColumn}\n                sortingDescending={sortingDescending}\n                sortingDisabled={sortingDisabled}\n                wrapLines={wrapLines}\n                colIndex={selectionType ? colIndex + 1 : colIndex}\n                columnId={columnId}\n                updateColumn={updateColumn}\n                onResizeFinish={() => onResizeFinish(columnWidths)}\n                resizableColumns={resizableColumns}\n                resizableStyle={getColumnStyles(sticky, columnId)}\n                onClick={detail => {\n                  setLastUserAction('sorting');\n                  fireNonCancelableEvent(onSortingChange, detail);\n                }}\n                isEditable={!!column.editConfig}\n                cellRef={node => setCell(sticky, columnId, node)}\n                tableRole={tableRole}\n                resizerRoleDescription={resizerRoleDescription}\n                resizerTooltipText={resizerTooltipText}\n                // Expandable option is only applicable to the first data column of the table.\n                // When present, the header content receives extra padding to match the first offset in the data cells.\n                isExpandable={colIndex === 0 && isExpandable}\n                hasDynamicContent={hidden && !resizableColumns && column.hasDynamicContent}\n              />\n            );\n          })}\n        </tr>\n      </thead>\n    );\n  }\n);\n\nexport default Thead;\n"]}
+{"version":3,"file":"thead.js","sourceRoot":"","sources":["../../../src/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 React from 'react';\nimport clsx from 'clsx';\n\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\n\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { TableHeaderCell } from './header-cell';\nimport { TableProps } from './interfaces';\nimport { focusMarkers, SelectionProps } from './selection';\nimport { TableHeaderSelectionCell } from './selection/selection-cell';\nimport { StickyColumnsModel } from './sticky-columns';\nimport { getTableHeaderRowRoleProps, TableRole } from './table-role';\nimport { useColumnWidths } from './use-column-widths';\nimport { getColumnKey } from './utils';\n\nimport styles from './styles.css.js';\n\nexport interface TheadProps {\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  tableVariant?: string;\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: Map<PropertyKey, number>) => void;\n  onSortingChange: NonCancelableEventHandler<TableProps.SortingState<any>> | undefined;\n  sticky?: boolean;\n  hidden?: boolean;\n  stuck?: boolean;\n  singleSelectionHeaderAriaLabel?: string;\n  resizerRoleDescription?: string;\n  resizerTooltipText?: string;\n  stripedRows?: boolean;\n  stickyState: StickyColumnsModel;\n  selectionColumnId: PropertyKey;\n  focusedComponent?: null | string;\n  onFocusedComponentChange?: (focusId: null | string) => void;\n  tableRole: TableRole;\n  isExpandable?: boolean;\n  setLastUserAction: (name: string) => void;\n}\n\nconst Thead = React.forwardRef(\n  (\n    {\n      selectionType,\n      getSelectAllProps,\n      columnDefinitions,\n      sortingColumn,\n      sortingDisabled,\n      sortingDescending,\n      resizableColumns,\n      variant,\n      tableVariant,\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      tableRole,\n      resizerRoleDescription,\n      resizerTooltipText,\n      isExpandable,\n      setLastUserAction,\n    }: TheadProps,\n    outerRef: React.Ref<HTMLTableRowElement>\n  ) => {\n    const { getColumnStyles, columnWidths, updateColumn, setCell } = useColumnWidths();\n\n    const commonCellProps = {\n      stuck,\n      sticky,\n      hidden,\n      stripedRows,\n      tableRole,\n      variant,\n      tableVariant,\n      stickyState,\n    };\n\n    return (\n      <thead className={clsx(!hidden && styles['thead-active'])}>\n        <tr\n          {...focusMarkers.all}\n          ref={outerRef}\n          aria-rowindex={1}\n          {...getTableHeaderRowRoleProps({ tableRole })}\n          onFocus={event => {\n            const focusControlElement = findUpUntil(event.target, element => !!element.getAttribute('data-focus-id'));\n            const focusId = focusControlElement?.getAttribute('data-focus-id') ?? null;\n            onFocusedComponentChange?.(focusId);\n          }}\n          onBlur={() => onFocusedComponentChange?.(null)}\n        >\n          {selectionType ? (\n            <TableHeaderSelectionCell\n              {...commonCellProps}\n              focusedComponent={focusedComponent}\n              columnId={selectionColumnId}\n              getSelectAllProps={getSelectAllProps}\n              onFocusMove={onFocusMove}\n              singleSelectionHeaderAriaLabel={singleSelectionHeaderAriaLabel}\n            />\n          ) : null}\n\n          {columnDefinitions.map((column, colIndex) => {\n            const columnId = getColumnKey(column, colIndex);\n            return (\n              <TableHeaderCell\n                {...commonCellProps}\n                key={columnId}\n                tabIndex={sticky ? -1 : 0}\n                focusedComponent={focusedComponent}\n                column={column}\n                activeSortingColumn={sortingColumn}\n                sortingDescending={sortingDescending}\n                sortingDisabled={sortingDisabled}\n                wrapLines={wrapLines}\n                colIndex={selectionType ? colIndex + 1 : colIndex}\n                columnId={columnId}\n                updateColumn={updateColumn}\n                onResizeFinish={() => onResizeFinish(columnWidths)}\n                resizableColumns={resizableColumns}\n                resizableStyle={getColumnStyles(sticky, columnId)}\n                onClick={detail => {\n                  setLastUserAction('sorting');\n                  fireNonCancelableEvent(onSortingChange, detail);\n                }}\n                isEditable={!!column.editConfig}\n                cellRef={node => setCell(sticky, columnId, node)}\n                tableRole={tableRole}\n                resizerRoleDescription={resizerRoleDescription}\n                resizerTooltipText={resizerTooltipText}\n                // Expandable option is only applicable to the first data column of the table.\n                // When present, the header content receives extra padding to match the first offset in the data cells.\n                isExpandable={colIndex === 0 && isExpandable}\n                hasDynamicContent={hidden && !resizableColumns && column.hasDynamicContent}\n              />\n            );\n          })}\n        </tr>\n      </thead>\n    );\n  }\n);\n\nexport default Thead;\n"]}

package/lib/internal/template/table/use-cell-editing.js

@@ -1,6 +1,5 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { __awaiter } from "tslib";
 import { useCallback, useState } from 'react';
 import { fireCancelableEvent } from '../internal/events';
 export function useCellEditing({ onCancel, onSubmit }) {
@@ -24,15 +23,15 @@ export function useCellEditing({ onCancel, onSubmit }) {
     const checkEditing = ({ row, col }) => row === (currentEditCell === null || currentEditCell === void 0 ? void 0 : currentEditCell.row) && col === currentEditCell.col;
     const checkLastSuccessfulEdit = ({ row, col }) => row === (lastSuccessfulEditCell === null || lastSuccessfulEditCell === void 0 ? void 0 : lastSuccessfulEditCell.row) && col === lastSuccessfulEditCell.col;
     const submitEdit = onSubmit
-        ? (...args) => __awaiter(this, void 0, void 0, function* () {
+        ? async (...args) => {
             setCurrentEditLoading(true);
             try {
-                yield onSubmit(...args);
+                await onSubmit(...args);
             }
             finally {
                 setCurrentEditLoading(false);
             }
-        })
+        }
         : undefined;
     return {
         isLoading: currentEditLoading,

package/lib/internal/template/table/use-cell-editing.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-cell-editing.js","sourceRoot":"","sources":["../../../src/table/use-cell-editing.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAA0B,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAajF,MAAM,UAAU,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAoB;IACrE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC5E,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC1F,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpE,MAAM,SAAS,GAAG,CAAC,MAAc,EAAE,EAAE;QACnC,yBAAyB,CAAC,IAAI,CAAC,CAAC;QAChC,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IAEnE,MAAM,YAAY,GAAG,CAAC,MAAc,EAAE,aAAsB,EAAE,EAAE;QAC9D,MAAM,cAAc,GAAG,mBAAmB,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;QACzD,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,kBAAkB,CAAC,IAAI,CAAC,CAAC;YACzB,IAAI,CAAC,aAAa,EAAE,CAAC;gBACnB,yBAAyB,CAAC,MAAM,CAAC,CAAC;YACpC,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAU,EAAE,EAAE,CAAC,GAAG,MAAK,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,GAAG,CAAA,IAAI,GAAG,KAAK,eAAe,CAAC,GAAG,CAAC;IAE3G,MAAM,uBAAuB,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAU,EAAE,EAAE,CACvD,GAAG,MAAK,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,GAAG,CAAA,IAAI,GAAG,KAAK,sBAAsB,CAAC,GAAG,CAAC;IAE5E,MAAM,UAAU,GAAG,QAAQ;QACzB,CAAC,CAAC,CAAO,GAAG,IAAiC,EAAE,EAAE;YAC7C,qBAAqB,CAAC,IAAI,CAAC,CAAC;YAC5B,IAAI,CAAC;gBACH,MAAM,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;YAC1B,CAAC;oBAAS,CAAC;gBACT,qBAAqB,CAAC,KAAK,CAAC,CAAC;YAC/B,CAAC;QACH,CAAC,CAAA;QACH,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO;QACL,SAAS,EAAE,kBAAkB;QAC7B,SAAS;QACT,UAAU;QACV,YAAY;QACZ,uBAAuB;QACvB,YAAY;QACZ,UAAU;KACX,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useCallback, useState } from 'react';\n\nimport { CancelableEventHandler, fireCancelableEvent } from '../internal/events';\nimport { TableProps } from './interfaces';\n\ninterface CellId {\n  row: string; // Item ID (from trackBy) or row index\n  col: string; // Column ID or column index\n}\n\ninterface CellEditingProps {\n  onCancel?: CancelableEventHandler;\n  onSubmit?: TableProps.SubmitEditFunction<any>;\n}\n\nexport function useCellEditing({ onCancel, onSubmit }: CellEditingProps) {\n  const [currentEditCell, setCurrentEditCell] = useState<null | CellId>(null);\n  const [lastSuccessfulEditCell, setLastSuccessfulEditCell] = useState<null | CellId>(null);\n  const [currentEditLoading, setCurrentEditLoading] = useState(false);\n\n  const startEdit = (cellId: CellId) => {\n    setLastSuccessfulEditCell(null);\n    setCurrentEditCell(cellId);\n  };\n\n  const cancelEdit = useCallback(() => setCurrentEditCell(null), []);\n\n  const completeEdit = (cellId: CellId, editCancelled: boolean) => {\n    const eventCancelled = fireCancelableEvent(onCancel, {});\n    if (!eventCancelled) {\n      setCurrentEditCell(null);\n      if (!editCancelled) {\n        setLastSuccessfulEditCell(cellId);\n      }\n    }\n  };\n\n  const checkEditing = ({ row, col }: CellId) => row === currentEditCell?.row && col === currentEditCell.col;\n\n  const checkLastSuccessfulEdit = ({ row, col }: CellId) =>\n    row === lastSuccessfulEditCell?.row && col === lastSuccessfulEditCell.col;\n\n  const submitEdit = onSubmit\n    ? async (...args: Parameters<typeof onSubmit>) => {\n        setCurrentEditLoading(true);\n        try {\n          await onSubmit(...args);\n        } finally {\n          setCurrentEditLoading(false);\n        }\n      }\n    : undefined;\n\n  return {\n    isLoading: currentEditLoading,\n    startEdit,\n    cancelEdit,\n    checkEditing,\n    checkLastSuccessfulEdit,\n    completeEdit,\n    submitEdit,\n  };\n}\n"]}
+{"version":3,"file":"use-cell-editing.js","sourceRoot":"","sources":["../../../src/table/use-cell-editing.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAA0B,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAajF,MAAM,UAAU,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAoB;IACrE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC5E,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC1F,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpE,MAAM,SAAS,GAAG,CAAC,MAAc,EAAE,EAAE;QACnC,yBAAyB,CAAC,IAAI,CAAC,CAAC;QAChC,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IAEnE,MAAM,YAAY,GAAG,CAAC,MAAc,EAAE,aAAsB,EAAE,EAAE;QAC9D,MAAM,cAAc,GAAG,mBAAmB,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;QACzD,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,kBAAkB,CAAC,IAAI,CAAC,CAAC;YACzB,IAAI,CAAC,aAAa,EAAE,CAAC;gBACnB,yBAAyB,CAAC,MAAM,CAAC,CAAC;YACpC,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAU,EAAE,EAAE,CAAC,GAAG,MAAK,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,GAAG,CAAA,IAAI,GAAG,KAAK,eAAe,CAAC,GAAG,CAAC;IAE3G,MAAM,uBAAuB,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAU,EAAE,EAAE,CACvD,GAAG,MAAK,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,GAAG,CAAA,IAAI,GAAG,KAAK,sBAAsB,CAAC,GAAG,CAAC;IAE5E,MAAM,UAAU,GAAG,QAAQ;QACzB,CAAC,CAAC,KAAK,EAAE,GAAG,IAAiC,EAAE,EAAE;YAC7C,qBAAqB,CAAC,IAAI,CAAC,CAAC;YAC5B,IAAI,CAAC;gBACH,MAAM,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;YAC1B,CAAC;oBAAS,CAAC;gBACT,qBAAqB,CAAC,KAAK,CAAC,CAAC;YAC/B,CAAC;QACH,CAAC;QACH,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO;QACL,SAAS,EAAE,kBAAkB;QAC7B,SAAS;QACT,UAAU;QACV,YAAY;QACZ,uBAAuB;QACvB,YAAY;QACZ,UAAU;KACX,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useCallback, useState } from 'react';\n\nimport { CancelableEventHandler, fireCancelableEvent } from '../internal/events';\nimport { TableProps } from './interfaces';\n\ninterface CellId {\n  row: string; // Item ID (from trackBy) or row index\n  col: string; // Column ID or column index\n}\n\ninterface CellEditingProps {\n  onCancel?: CancelableEventHandler;\n  onSubmit?: TableProps.SubmitEditFunction<any>;\n}\n\nexport function useCellEditing({ onCancel, onSubmit }: CellEditingProps) {\n  const [currentEditCell, setCurrentEditCell] = useState<null | CellId>(null);\n  const [lastSuccessfulEditCell, setLastSuccessfulEditCell] = useState<null | CellId>(null);\n  const [currentEditLoading, setCurrentEditLoading] = useState(false);\n\n  const startEdit = (cellId: CellId) => {\n    setLastSuccessfulEditCell(null);\n    setCurrentEditCell(cellId);\n  };\n\n  const cancelEdit = useCallback(() => setCurrentEditCell(null), []);\n\n  const completeEdit = (cellId: CellId, editCancelled: boolean) => {\n    const eventCancelled = fireCancelableEvent(onCancel, {});\n    if (!eventCancelled) {\n      setCurrentEditCell(null);\n      if (!editCancelled) {\n        setLastSuccessfulEditCell(cellId);\n      }\n    }\n  };\n\n  const checkEditing = ({ row, col }: CellId) => row === currentEditCell?.row && col === currentEditCell.col;\n\n  const checkLastSuccessfulEdit = ({ row, col }: CellId) =>\n    row === lastSuccessfulEditCell?.row && col === lastSuccessfulEditCell.col;\n\n  const submitEdit = onSubmit\n    ? async (...args: Parameters<typeof onSubmit>) => {\n        setCurrentEditLoading(true);\n        try {\n          await onSubmit(...args);\n        } finally {\n          setCurrentEditLoading(false);\n        }\n      }\n    : undefined;\n\n  return {\n    isLoading: currentEditLoading,\n    startEdit,\n    cancelEdit,\n    checkEditing,\n    checkLastSuccessfulEdit,\n    completeEdit,\n    submitEdit,\n  };\n}\n"]}

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

@@ -45,7 +45,7 @@ export function getVisibleColumnDefinitions({ columnDisplay, visibleColumns, col
     }
 }
 function getVisibleColumnDefinitionsFromColumnDisplay({ columnDisplay, columnDefinitions, }) {
-    const columnDefinitionsById = columnDefinitions.reduce((accumulator, item) => (item.id === undefined ? accumulator : Object.assign(Object.assign({}, accumulator), { [item.id]: item })), {});
+    const columnDefinitionsById = columnDefinitions.reduce((accumulator, item) => (item.id === undefined ? accumulator : { ...accumulator, [item.id]: item }), {});
     return columnDisplay
         .filter(item => item.visible)
         .map(item => columnDefinitionsById[item.id])

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

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/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 { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { InternalContainerProps } from '../container/internal';\nimport { TableProps } from './interfaces';\nimport { StickyColumnsCellState } from './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-inline-start']]: !!props?.padInlineStart,\n    [styles['sticky-cell-last-inline-start']]: !!props?.lastInsetInlineStart,\n    [styles['sticky-cell-last-inline-end']]: !!props?.lastInsetInlineEnd,\n  };\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/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 { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { InternalContainerProps } from '../container/internal';\nimport { TableProps } from './interfaces';\nimport { StickyColumnsCellState } from './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-inline-start']]: !!props?.padInlineStart,\n    [styles['sticky-cell-last-inline-start']]: !!props?.lastInsetInlineStart,\n    [styles['sticky-cell-last-inline-end']]: !!props?.lastInsetInlineEnd,\n  };\n}\n"]}

package/lib/internal/template/tabs/index.js

@@ -1,7 +1,6 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 'use client';
-import { __rest } from "tslib";
 import React, { useRef } from 'react';
 import clsx from 'clsx';
 import { useUniqueId } from '@cloudscape-design/component-toolkit/internal';
@@ -34,9 +33,8 @@ function shouldRenderTabContent(tab, viewedTabs) {
     }
     return false;
 }
-export default function Tabs(_a) {
-    var _b, _c;
-    var { tabs, variant = 'default', onChange, activeTabId: controlledTabId, ariaLabel, ariaLabelledby, disableContentPaddings = false, i18nStrings, fitHeight, keyboardActivationMode = 'automatic', actions } = _a, rest = __rest(_a, ["tabs", "variant", "onChange", "activeTabId", "ariaLabel", "ariaLabelledby", "disableContentPaddings", "i18nStrings", "fitHeight", "keyboardActivationMode", "actions"]);
+export default function Tabs({ tabs, variant = 'default', onChange, activeTabId: controlledTabId, ariaLabel, ariaLabelledby, disableContentPaddings = false, i18nStrings, fitHeight, keyboardActivationMode = 'automatic', actions, ...rest }) {
+    var _a, _b;
     for (const tab of tabs) {
         checkSafeUrl('Tabs', tab.href);
     }
@@ -51,7 +49,7 @@ export default function Tabs(_a) {
         },
     });
     const idNamespace = useUniqueId('awsui-tabs-');
-    const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, (_c = (_b = firstEnabledTab(tabs)) === null || _b === void 0 ? void 0 : _b.id) !== null && _c !== void 0 ? _c : '', {
+    const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, (_b = (_a = firstEnabledTab(tabs)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '', {
         componentName: 'Tabs',
         controlledProp: 'activeTabId',
         changeHandler: 'onChange',
@@ -90,7 +88,7 @@ export default function Tabs(_a) {
                 'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),
             };
             const isContentShown = !tab.disabled && (isTabSelected || shouldRenderTabContent(tab, viewedTabs.current));
-            return React.createElement("div", Object.assign({}, contentAttributes), isContentShown && tab.content);
+            return React.createElement("div", { ...contentAttributes }, isContentShown && tab.content);
         };
         return (React.createElement("div", { className: clsx(variant === 'container' || variant === 'stacked'
                 ? styles['tabs-container-content-wrapper']
@@ -103,9 +101,9 @@ export default function Tabs(_a) {
             fireNonCancelableEvent(onChange, changeDetail);
         }, i18nStrings: i18nStrings, keyboardActivationMode: keyboardActivationMode }));
     if (variant === 'container' || variant === 'stacked') {
-        return (React.createElement(InternalContainer, Object.assign({ header: header, disableHeaderPaddings: true }, baseProps, { className: clsx(baseProps.className, styles.root), __internalRootRef: __internalRootRef, disableContentPaddings: true, variant: variant === 'stacked' ? 'stacked' : 'default', fitHeight: fitHeight }, getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })), content()));
+        return (React.createElement(InternalContainer, { header: header, disableHeaderPaddings: true, ...baseProps, className: clsx(baseProps.className, styles.root), __internalRootRef: __internalRootRef, disableContentPaddings: true, variant: variant === 'stacked' ? 'stacked' : 'default', fitHeight: fitHeight, ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }) }, content()));
     }
-    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root, styles.tabs, { [styles['fit-height']]: fitHeight }), ref: __internalRootRef }, getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })),
+    return (React.createElement("div", { ...baseProps, className: clsx(baseProps.className, styles.root, styles.tabs, { [styles['fit-height']]: fitHeight }), ref: __internalRootRef, ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }) },
         header,
         content()));
 }

package/lib/internal/template/tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tabs/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAC5E,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,iBAAiB,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAGhE,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEjE,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,SAAS,eAAe,CAAC,IAAkC;IACzD,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACtD,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC3B,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC;IACxB,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,SAAS,sBAAsB,CAAC,GAAkB,EAAE,UAAuB;IACzE,QAAQ,GAAG,CAAC,qBAAqB,EAAE,CAAC;QAClC,KAAK,QAAQ;YACX,OAAO,KAAK,CAAC,CAAC,wDAAwD;QACxE,KAAK,OAAO;YACV,OAAO,IAAI,CAAC;QACd,KAAK,MAAM;YACT,OAAO,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAClC,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAajB;;QAbiB,EAC3B,IAAI,EACJ,OAAO,GAAG,SAAS,EACnB,QAAQ,EACR,WAAW,EAAE,eAAe,EAC5B,SAAS,EACT,cAAc,EACd,sBAAsB,GAAG,KAAK,EAC9B,WAAW,EACX,SAAS,EACT,sBAAsB,GAAG,WAAW,EACpC,OAAO,OAEG,EADP,IAAI,cAZoB,wKAa5B,CADQ;IAEP,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE,CAAC;QACvB,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;IACD,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,MAAM,EAAE;QACrD,KAAK,EAAE,EAAE,sBAAsB,EAAE,OAAO,EAAE,SAAS,EAAE,sBAAsB,EAAE;QAC7E,QAAQ,EAAE;YACR,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC;YAC1C,gBAAgB,EAAE,CAAC,CAAC,OAAO;YAC3B,kBAAkB,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,cAAc,CAAC;YAC1D,kBAAkB,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,qBAAqB,KAAK,OAAO,CAAC;YAC3E,iBAAiB,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,qBAAqB,KAAK,MAAM,CAAC;SAC1E;KACF,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IAE/C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,eAAe,CAAC,eAAe,EAAE,QAAQ,EAAE,MAAA,MAAA,eAAe,CAAC,IAAI,CAAC,0CAAE,EAAE,mCAAI,EAAE,EAAE;QAChH,aAAa,EAAE,MAAM;QACrB,cAAc,EAAE,aAAa;QAC7B,aAAa,EAAE,UAAU;KAC1B,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,GAAG,EAAU,CAAC,CAAC;IAC7C,IAAI,WAAW,KAAK,SAAS,EAAE,CAAC;QAC9B,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IACtC,CAAC;IAED,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,MAAM,0BAA0B,GAA4C;QAC1E,IAAI,EAAE,YAAY;QAClB,KAAK,EAAE,IAAI,kBAAkB,CAAC,kBAAkB,CAAC,EAAE;KACpD,CAAC;IAEF,IAAI,WAAW,EAAE,CAAC;QAChB,0BAA0B,CAAC,UAAU,GAAG;YACtC,WAAW;YACX,cAAc,EAAE,IAAI,kBAAkB,CAAC,mBAAmB,CAAC,KAAK,kBAAkB,CAAC,WAAW,CAAC,EAAE;YACjG,iBAAiB,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,WAAW,CAAC,GAAG,CAAC,EAAE;YACzE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE;SAC5B,CAAC;IACJ,CAAC;IAED,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;QAClE,MAAM,aAAa,GAAG,CAAC,GAAkB,EAAE,EAAE;YAC3C,MAAM,aAAa,GAAG,GAAG,KAAK,WAAW,CAAC;YAE1C,MAAM,OAAO,GAAG,IAAI,CAAC;gBACnB,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,IAAI;gBAC9B,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,aAAa;aAC/C,CAAC,CAAC;YAEH,MAAM,iBAAiB,GAAiC;gBACtD,SAAS,EAAE,OAAO;gBAClB,IAAI,EAAE,UAAU;gBAChB,EAAE,EAAE,GAAG,WAAW,IAAI,GAAG,CAAC,EAAE,QAAQ;gBACpC,GAAG,EAAE,GAAG,WAAW,IAAI,GAAG,CAAC,EAAE,QAAQ;gBACrC,QAAQ,EAAE,CAAC;gBACX,iBAAiB,EAAE,eAAe,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC;aAC9E,CAAC;YAEF,MAAM,cAAc,GAAG,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,aAAa,IAAI,sBAAsB,CAAC,GAAG,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC;YAE3G,OAAO,6CAAS,iBAAiB,GAAG,cAAc,IAAI,GAAG,CAAC,OAAO,CAAO,CAAC;QAC3E,CAAC,CAAC;QAEF,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CACb,OAAO,KAAK,WAAW,IAAI,OAAO,KAAK,SAAS;gBAC9C,CAAC,CAAC,MAAM,CAAC,gCAAgC,CAAC;gBAC1C,CAAC,CAAC,MAAM,CAAC,sBAAsB,CAAC,EAClC;gBACE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,sBAAsB;aACnD,CACF,IAEA,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,CACpB,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CACb,oBAAC,YAAY,IACX,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,YAAY,CAAC,EAAE;YACvB,cAAc,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;YACzC,sBAAsB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QACjD,CAAC,EACD,WAAW,EAAE,WAAW,EACxB,sBAAsB,EAAE,sBAAsB,GAC9C,CACH,CAAC;IAEF,IAAI,OAAO,KAAK,WAAW,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QACrD,OAAO,CACL,oBAAC,iBAAiB,kBAChB,MAAM,EAAE,MAAM,EACd,qBAAqB,EAAE,IAAI,IACvB,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EACjD,iBAAiB,EAAE,iBAAiB,EACpC,sBAAsB,EAAE,IAAI,EAC5B,OAAO,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACtD,SAAS,EAAE,SAAS,IAChB,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC,GAE3E,OAAO,EAAE,CACQ,CACrB,CAAC;IACJ,CAAC;IAED,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EACrG,GAAG,EAAE,iBAAiB,IAClB,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC;QAE3E,MAAM;QACN,OAAO,EAAE,CACN,CACP,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalContainer from '../container/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { GeneratedAnalyticsMetadataTabsComponent } from './analytics-metadata/interfaces';\nimport { TabsProps } from './interfaces';\nimport { getTabElementId, TabHeaderBar } from './tab-header-bar';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { TabsProps };\n\nfunction firstEnabledTab(tabs: ReadonlyArray<TabsProps.Tab>) {\n  const enabledTabs = tabs.filter(tab => !tab.disabled);\n  if (enabledTabs.length > 0) {\n    return enabledTabs[0];\n  }\n  return null;\n}\n\nfunction shouldRenderTabContent(tab: TabsProps.Tab, viewedTabs: Set<string>) {\n  switch (tab.contentRenderStrategy) {\n    case 'active':\n      return false; // rendering active tab is handled directly in component\n    case 'eager':\n      return true;\n    case 'lazy':\n      return viewedTabs.has(tab.id);\n  }\n  return false;\n}\n\nexport default function Tabs({\n  tabs,\n  variant = 'default',\n  onChange,\n  activeTabId: controlledTabId,\n  ariaLabel,\n  ariaLabelledby,\n  disableContentPaddings = false,\n  i18nStrings,\n  fitHeight,\n  keyboardActivationMode = 'automatic',\n  actions,\n  ...rest\n}: TabsProps) {\n  for (const tab of tabs) {\n    checkSafeUrl('Tabs', tab.href);\n  }\n  const { __internalRootRef } = useBaseComponent('Tabs', {\n    props: { disableContentPaddings, variant, fitHeight, keyboardActivationMode },\n    metadata: {\n      hasActions: tabs.some(tab => !!tab.action),\n      hasHeaderActions: !!actions,\n      hasDisabledReasons: tabs.some(tab => !!tab.disabledReason),\n      hasEagerLoadedTabs: tabs.some(tab => tab.contentRenderStrategy === 'eager'),\n      hasLazyLoadedTabs: tabs.some(tab => tab.contentRenderStrategy === 'lazy'),\n    },\n  });\n  const idNamespace = useUniqueId('awsui-tabs-');\n\n  const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, firstEnabledTab(tabs)?.id ?? '', {\n    componentName: 'Tabs',\n    controlledProp: 'activeTabId',\n    changeHandler: 'onChange',\n  });\n\n  const viewedTabs = useRef(new Set<string>());\n  if (activeTabId !== undefined) {\n    viewedTabs.current.add(activeTabId);\n  }\n\n  const baseProps = getBaseProps(rest);\n\n  const analyticsComponentMetadata: GeneratedAnalyticsMetadataTabsComponent = {\n    name: 'awsui.Tabs',\n    label: `.${analyticsSelectors['tabs-header-list']}`,\n  };\n\n  if (activeTabId) {\n    analyticsComponentMetadata.properties = {\n      activeTabId,\n      activeTabLabel: `.${analyticsSelectors['active-tab-header']} .${analyticsSelectors['tab-label']}`,\n      activeTabPosition: `${tabs.findIndex(tab => tab.id === activeTabId) + 1}`,\n      tabsCount: `${tabs.length}`,\n    };\n  }\n\n  const content = () => {\n    const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];\n    const renderContent = (tab: TabsProps.Tab) => {\n      const isTabSelected = tab === selectedTab;\n\n      const classes = clsx({\n        [styles['tabs-content']]: true,\n        [styles['tabs-content-active']]: isTabSelected,\n      });\n\n      const contentAttributes: JSX.IntrinsicElements['div'] = {\n        className: classes,\n        role: 'tabpanel',\n        id: `${idNamespace}-${tab.id}-panel`,\n        key: `${idNamespace}-${tab.id}-panel`,\n        tabIndex: 0,\n        'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n      };\n\n      const isContentShown = !tab.disabled && (isTabSelected || shouldRenderTabContent(tab, viewedTabs.current));\n\n      return <div {...contentAttributes}>{isContentShown && tab.content}</div>;\n    };\n\n    return (\n      <div\n        className={clsx(\n          variant === 'container' || variant === 'stacked'\n            ? styles['tabs-container-content-wrapper']\n            : styles['tabs-content-wrapper'],\n          {\n            [styles['with-paddings']]: !disableContentPaddings,\n          }\n        )}\n      >\n        {tabs.map(renderContent)}\n      </div>\n    );\n  };\n\n  const header = (\n    <TabHeaderBar\n      activeTabId={activeTabId}\n      variant={variant}\n      idNamespace={idNamespace}\n      ariaLabel={ariaLabel}\n      ariaLabelledby={ariaLabelledby}\n      tabs={tabs}\n      actions={actions}\n      onChange={changeDetail => {\n        setActiveTabId(changeDetail.activeTabId);\n        fireNonCancelableEvent(onChange, changeDetail);\n      }}\n      i18nStrings={i18nStrings}\n      keyboardActivationMode={keyboardActivationMode}\n    />\n  );\n\n  if (variant === 'container' || variant === 'stacked') {\n    return (\n      <InternalContainer\n        header={header}\n        disableHeaderPaddings={true}\n        {...baseProps}\n        className={clsx(baseProps.className, styles.root)}\n        __internalRootRef={__internalRootRef}\n        disableContentPaddings={true}\n        variant={variant === 'stacked' ? 'stacked' : 'default'}\n        fitHeight={fitHeight}\n        {...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })}\n      >\n        {content()}\n      </InternalContainer>\n    );\n  }\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(baseProps.className, styles.root, styles.tabs, { [styles['fit-height']]: fitHeight })}\n      ref={__internalRootRef}\n      {...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })}\n    >\n      {header}\n      {content()}\n    </div>\n  );\n}\n\napplyDisplayName(Tabs, 'Tabs');\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tabs/index.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\n'use client';\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalContainer from '../container/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { GeneratedAnalyticsMetadataTabsComponent } from './analytics-metadata/interfaces';\nimport { TabsProps } from './interfaces';\nimport { getTabElementId, TabHeaderBar } from './tab-header-bar';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { TabsProps };\n\nfunction firstEnabledTab(tabs: ReadonlyArray<TabsProps.Tab>) {\n  const enabledTabs = tabs.filter(tab => !tab.disabled);\n  if (enabledTabs.length > 0) {\n    return enabledTabs[0];\n  }\n  return null;\n}\n\nfunction shouldRenderTabContent(tab: TabsProps.Tab, viewedTabs: Set<string>) {\n  switch (tab.contentRenderStrategy) {\n    case 'active':\n      return false; // rendering active tab is handled directly in component\n    case 'eager':\n      return true;\n    case 'lazy':\n      return viewedTabs.has(tab.id);\n  }\n  return false;\n}\n\nexport default function Tabs({\n  tabs,\n  variant = 'default',\n  onChange,\n  activeTabId: controlledTabId,\n  ariaLabel,\n  ariaLabelledby,\n  disableContentPaddings = false,\n  i18nStrings,\n  fitHeight,\n  keyboardActivationMode = 'automatic',\n  actions,\n  ...rest\n}: TabsProps) {\n  for (const tab of tabs) {\n    checkSafeUrl('Tabs', tab.href);\n  }\n  const { __internalRootRef } = useBaseComponent('Tabs', {\n    props: { disableContentPaddings, variant, fitHeight, keyboardActivationMode },\n    metadata: {\n      hasActions: tabs.some(tab => !!tab.action),\n      hasHeaderActions: !!actions,\n      hasDisabledReasons: tabs.some(tab => !!tab.disabledReason),\n      hasEagerLoadedTabs: tabs.some(tab => tab.contentRenderStrategy === 'eager'),\n      hasLazyLoadedTabs: tabs.some(tab => tab.contentRenderStrategy === 'lazy'),\n    },\n  });\n  const idNamespace = useUniqueId('awsui-tabs-');\n\n  const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, firstEnabledTab(tabs)?.id ?? '', {\n    componentName: 'Tabs',\n    controlledProp: 'activeTabId',\n    changeHandler: 'onChange',\n  });\n\n  const viewedTabs = useRef(new Set<string>());\n  if (activeTabId !== undefined) {\n    viewedTabs.current.add(activeTabId);\n  }\n\n  const baseProps = getBaseProps(rest);\n\n  const analyticsComponentMetadata: GeneratedAnalyticsMetadataTabsComponent = {\n    name: 'awsui.Tabs',\n    label: `.${analyticsSelectors['tabs-header-list']}`,\n  };\n\n  if (activeTabId) {\n    analyticsComponentMetadata.properties = {\n      activeTabId,\n      activeTabLabel: `.${analyticsSelectors['active-tab-header']} .${analyticsSelectors['tab-label']}`,\n      activeTabPosition: `${tabs.findIndex(tab => tab.id === activeTabId) + 1}`,\n      tabsCount: `${tabs.length}`,\n    };\n  }\n\n  const content = () => {\n    const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];\n    const renderContent = (tab: TabsProps.Tab) => {\n      const isTabSelected = tab === selectedTab;\n\n      const classes = clsx({\n        [styles['tabs-content']]: true,\n        [styles['tabs-content-active']]: isTabSelected,\n      });\n\n      const contentAttributes: JSX.IntrinsicElements['div'] = {\n        className: classes,\n        role: 'tabpanel',\n        id: `${idNamespace}-${tab.id}-panel`,\n        key: `${idNamespace}-${tab.id}-panel`,\n        tabIndex: 0,\n        'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n      };\n\n      const isContentShown = !tab.disabled && (isTabSelected || shouldRenderTabContent(tab, viewedTabs.current));\n\n      return <div {...contentAttributes}>{isContentShown && tab.content}</div>;\n    };\n\n    return (\n      <div\n        className={clsx(\n          variant === 'container' || variant === 'stacked'\n            ? styles['tabs-container-content-wrapper']\n            : styles['tabs-content-wrapper'],\n          {\n            [styles['with-paddings']]: !disableContentPaddings,\n          }\n        )}\n      >\n        {tabs.map(renderContent)}\n      </div>\n    );\n  };\n\n  const header = (\n    <TabHeaderBar\n      activeTabId={activeTabId}\n      variant={variant}\n      idNamespace={idNamespace}\n      ariaLabel={ariaLabel}\n      ariaLabelledby={ariaLabelledby}\n      tabs={tabs}\n      actions={actions}\n      onChange={changeDetail => {\n        setActiveTabId(changeDetail.activeTabId);\n        fireNonCancelableEvent(onChange, changeDetail);\n      }}\n      i18nStrings={i18nStrings}\n      keyboardActivationMode={keyboardActivationMode}\n    />\n  );\n\n  if (variant === 'container' || variant === 'stacked') {\n    return (\n      <InternalContainer\n        header={header}\n        disableHeaderPaddings={true}\n        {...baseProps}\n        className={clsx(baseProps.className, styles.root)}\n        __internalRootRef={__internalRootRef}\n        disableContentPaddings={true}\n        variant={variant === 'stacked' ? 'stacked' : 'default'}\n        fitHeight={fitHeight}\n        {...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })}\n      >\n        {content()}\n      </InternalContainer>\n    );\n  }\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(baseProps.className, styles.root, styles.tabs, { [styles['fit-height']]: fitHeight })}\n      ref={__internalRootRef}\n      {...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })}\n    >\n      {header}\n      {content()}\n    </div>\n  );\n}\n\napplyDisplayName(Tabs, 'Tabs');\n"]}

package/lib/internal/template/tabs/tab-header-bar.js

@@ -241,7 +241,7 @@ export function TabHeaderBar({ onChange, activeTabId, tabs, variant, idNamespace
             horizontalOverflow && (React.createElement("span", { ref: inlineStartOverflowButton, className: leftButtonClasses },
                 React.createElement(InternalButton, { formAction: "none", variant: "icon", iconName: "angle-left", disabled: !inlineStartOverflow, __focusable: true, onClick: () => onPaginationClick(headerBarRef, 'backward'), ariaLabel: i18n('i18nStrings.scrollLeftAriaLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.scrollLeftAriaLabel) }))),
             React.createElement(SingleTabStopNavigationProvider, { ref: navigationAPI, navigationActive: true, getNextFocusTarget: getNextFocusTarget, onUnregisterActive: onUnregisterActive },
-                React.createElement(TabList, Object.assign({}, tabActionAttributes, { className: clsx(styles['tabs-header-list'], analyticsSelectors['tabs-header-list']), "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ref: headerBarRef, onScroll: onScroll, onKeyDown: onKeyDown, onFocus: onFocus, onBlur: onBlur }), tabs.map(renderTabHeader))),
+                React.createElement(TabList, { ...tabActionAttributes, className: clsx(styles['tabs-header-list'], analyticsSelectors['tabs-header-list']), "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ref: headerBarRef, onScroll: onScroll, onKeyDown: onKeyDown, onFocus: onFocus, onBlur: onBlur }, tabs.map(renderTabHeader))),
             horizontalOverflow && (React.createElement("span", { className: rightButtonClasses },
                 React.createElement(InternalButton, { formAction: "none", variant: "icon", iconName: "angle-right", disabled: !inlineEndOverflow, __focusable: true, onClick: () => onPaginationClick(headerBarRef, 'forward'), ariaLabel: i18n('i18nStrings.scrollRightAriaLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.scrollRightAriaLabel) })))),
         actions && React.createElement("div", { className: styles['actions-container'] }, actions)));
@@ -364,10 +364,10 @@ export function TabHeaderBar({ onChange, activeTabId, tabs, variant, idNamespace
             },
         };
         return (React.createElement(TabItem, { ref: (element) => tabRefs.current.set(tab.id, element), className: styles['tabs-tab'], role: "presentation", key: tab.id },
-            React.createElement("div", Object.assign({ className: tabHeaderContainerClasses }, tabHeaderContainerAriaProps, getAnalyticsMetadataAttribute({ component: analyticsComponentMetadataInnerContext })),
+            React.createElement("div", { className: tabHeaderContainerClasses, ...tabHeaderContainerAriaProps, ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadataInnerContext }) },
                 React.createElement(TabTrigger, { ref: setElement, tab: tab, elementProps: commonProps, activeTabId: activeTabId, index: index }),
                 action && React.createElement("span", { className: tabActionClasses }, action),
-                dismissible && (React.createElement("span", Object.assign({ className: styles['tabs-tab-dismiss'] }, getAnalyticsMetadataAttribute(analyticsDismissMetadata)), dismissButton({ dismissLabel, dismissDisabled, onDismiss: handleDismiss, tabId: tab.id }))))));
+                dismissible && (React.createElement("span", { className: styles['tabs-tab-dismiss'], ...getAnalyticsMetadataAttribute(analyticsDismissMetadata) }, dismissButton({ dismissLabel, dismissDisabled, onDismiss: handleDismiss, tabId: tab.id }))))));
     }
 }
 const TabTrigger = forwardRef(({ tab, elementProps, activeTabId, index }, ref) => {
@@ -399,8 +399,15 @@ const TabTrigger = forwardRef(({ tab, elementProps, activeTabId, index }, ref) =
             originTabId: activeTabId || '',
         },
     };
-    const commonProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, elementProps), (isDisabledWithReason ? targetProps : {})), (isDisabledWithReason ? handlers : {})), { ref: mergedRef, tabIndex: tabIndex }), (tab.disabled || tab.id === activeTabId ? {} : getAnalyticsMetadataAttribute(analyticsSelectMetadata)));
-    return tab.href ? (React.createElement("a", Object.assign({}, commonProps, { href: tab.href }), children)) : (React.createElement("button", Object.assign({}, commonProps, { type: "button", disabled: tab.disabled && !isDisabledWithReason }), children));
+    const commonProps = {
+        ...elementProps,
+        ...(isDisabledWithReason ? targetProps : {}),
+        ...(isDisabledWithReason ? handlers : {}),
+        ref: mergedRef,
+        tabIndex: tabIndex,
+        ...(tab.disabled || tab.id === activeTabId ? {} : getAnalyticsMetadataAttribute(analyticsSelectMetadata)),
+    };
+    return tab.href ? (React.createElement("a", { ...commonProps, href: tab.href }, children)) : (React.createElement("button", { ...commonProps, type: "button", disabled: tab.disabled && !isDisabledWithReason }, children));
 });
 export function getTabElementId({ namespace, tabId }) {
     return namespace + '-' + tabId;