@cloudscape-design/components-themeable 3.0.736 → 3.0.738

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "b99e6ee1bafb94d1edc073cf73d54e7ce54a3fed"
+  "commit": "343bfdf412eacb7a734c641343fd41641b00ccde"
 }

package/lib/internal/scss/app-layout/visual-refresh-toolbar/toolbar/styles.scss

@@ -13,6 +13,8 @@
   box-sizing: border-box;
   padding-block: 0;
   padding-inline: awsui.$space-m;
+  //right padding set in child trigger-container below for focus indicator to show correctly
+  padding-inline-end: 0;
   position: sticky;
   z-index: 840;
   @include styles.with-motion {
@@ -53,13 +55,18 @@
       column-gap: awsui.$space-static-xs;
       display: flex;
       justify-content: flex-end;
+      block-size: 100%;
     }
   }
 }
 
-.drawers-desktop-triggers-container {
+.drawers-desktop-triggers-container,
+.drawers-mobile-triggers-container {
   @include styles.styles-reset;
   background-color: transparent;
+  padding-inline: 0;
+  //matches the left padding of .universal-toolbar but allows for focus indicator to show correctly
+  padding-inline-end: awsui.$space-m;
   box-sizing: border-box;
   overflow-y: hidden;
   overflow-x: hidden;
@@ -71,6 +78,7 @@
 }
 
 .drawers-trigger-content {
+  block-size: 100%;
   align-items: center;
   display: flex;
   flex-direction: row;

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.css.js

@@ -1,17 +1,18 @@
 
     import './styles.scoped.css';
     export default {
-  "universal-toolbar": "awsui_universal-toolbar_1kzri_jqocx_97",
-  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_jqocx_118",
-  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_jqocx_121",
-  "toolbar-container": "awsui_toolbar-container_1kzri_jqocx_124",
-  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_jqocx_133",
-  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_jqocx_137",
-  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_jqocx_142",
-  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_jqocx_149",
-  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_jqocx_193",
-  "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_jqocx_200",
-  "has-open-drawer": "awsui_has-open-drawer_1kzri_jqocx_200",
-  "drawers-trigger": "awsui_drawers-trigger_1kzri_jqocx_193"
+  "universal-toolbar": "awsui_universal-toolbar_1kzri_uwwzs_97",
+  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_uwwzs_119",
+  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_uwwzs_122",
+  "toolbar-container": "awsui_toolbar-container_1kzri_uwwzs_125",
+  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_uwwzs_134",
+  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_uwwzs_138",
+  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_uwwzs_143",
+  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_uwwzs_151",
+  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_uwwzs_152",
+  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_uwwzs_198",
+  "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_uwwzs_206",
+  "has-open-drawer": "awsui_has-open-drawer_1kzri_uwwzs_206",
+  "drawers-trigger": "awsui_drawers-trigger_1kzri_uwwzs_198"
 };
   

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.scoped.css

@@ -94,34 +94,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_universal-toolbar_1kzri_jqocx_97:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97:not(#\9) {
   background-color: var(--color-background-layout-panel-content-ml98gw, #ffffff);
   border-block-end: 1px solid var(--color-border-divider-panel-bottom-sc2k0v, rgba(0, 28, 36, 0.15));
   box-sizing: border-box;
   padding-block: 0;
   padding-inline: var(--space-m-kpg8id, 16px);
+  padding-inline-end: 0;
   position: sticky;
   z-index: 840;
   transition: ease var(--motion-duration-refresh-only-slow-zaoigb, 250ms);
   transition-property: inset-block-start, opacity;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_universal-toolbar_1kzri_jqocx_97:not(#\9) {
+  .awsui_universal-toolbar_1kzri_uwwzs_97:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_universal-toolbar_1kzri_jqocx_97:not(#\9), .awsui-mode-entering .awsui_universal-toolbar_1kzri_jqocx_97:not(#\9) {
+.awsui-motion-disabled .awsui_universal-toolbar_1kzri_uwwzs_97:not(#\9), .awsui-mode-entering .awsui_universal-toolbar_1kzri_uwwzs_97:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_universal-toolbar_1kzri_jqocx_97.awsui_disable-body-scroll_1kzri_jqocx_118:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97.awsui_disable-body-scroll_1kzri_uwwzs_119:not(#\9) {
   inset-block-start: 0px;
 }
-.awsui_universal-toolbar_1kzri_jqocx_97.awsui_toolbar-hidden_1kzri_jqocx_121:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97.awsui_toolbar-hidden_1kzri_uwwzs_122:not(#\9) {
   opacity: 0;
 }
-.awsui_universal-toolbar_1kzri_jqocx_97 > .awsui_toolbar-container_1kzri_jqocx_124:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97 > .awsui_toolbar-container_1kzri_uwwzs_125:not(#\9) {
   block-size: 48px;
   align-items: center;
   display: grid;
@@ -130,23 +131,25 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-template-columns: min-content auto minmax(140px, 1fr);
   grid-template-rows: 1fr;
 }
-.awsui_universal-toolbar_1kzri_jqocx_97 > .awsui_toolbar-container_1kzri_jqocx_124 > .awsui_universal-toolbar-nav_1kzri_jqocx_133:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97 > .awsui_toolbar-container_1kzri_uwwzs_125 > .awsui_universal-toolbar-nav_1kzri_uwwzs_134:not(#\9) {
   grid-column: 1;
   padding-inline-end: var(--space-static-xxs-z6w5bq, 4px);
 }
-.awsui_universal-toolbar_1kzri_jqocx_97 > .awsui_toolbar-container_1kzri_jqocx_124 > .awsui_universal-toolbar-breadcrumbs_1kzri_jqocx_137:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97 > .awsui_toolbar-container_1kzri_uwwzs_125 > .awsui_universal-toolbar-breadcrumbs_1kzri_uwwzs_138:not(#\9) {
   grid-column: 2;
   background-color: transparent;
   flex: 1 0;
 }
-.awsui_universal-toolbar_1kzri_jqocx_97 > .awsui_toolbar-container_1kzri_jqocx_124 > .awsui_universal-toolbar-drawers_1kzri_jqocx_142:not(#\9) {
+.awsui_universal-toolbar_1kzri_uwwzs_97 > .awsui_toolbar-container_1kzri_uwwzs_125 > .awsui_universal-toolbar-drawers_1kzri_uwwzs_143:not(#\9) {
   grid-column: 3;
   column-gap: var(--space-static-xs-fdj8ix, 8px);
   display: flex;
   justify-content: flex-end;
+  block-size: 100%;
 }
 
-.awsui_drawers-desktop-triggers-container_1kzri_jqocx_149:not(#\9) {
+.awsui_drawers-desktop-triggers-container_1kzri_uwwzs_151:not(#\9),
+.awsui_drawers-mobile-triggers-container_1kzri_uwwzs_152:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -181,6 +184,8 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
   background-color: transparent;
+  padding-inline: 0;
+  padding-inline-end: var(--space-m-kpg8id, 16px);
   box-sizing: border-box;
   overflow-y: hidden;
   overflow-x: hidden;
@@ -191,22 +196,23 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inline-size: 100%;
 }
 
-.awsui_drawers-trigger-content_1kzri_jqocx_193:not(#\9) {
+.awsui_drawers-trigger-content_1kzri_uwwzs_198:not(#\9) {
+  block-size: 100%;
   align-items: center;
   display: flex;
   flex-direction: row;
   gap: var(--space-xs-xf5ch3, 8px);
   justify-content: flex-end;
 }
-.awsui_drawers-trigger-content_1kzri_jqocx_193:not(#\9):not(.awsui_has-multiple-triggers_1kzri_jqocx_200).awsui_has-open-drawer_1kzri_jqocx_200 {
+.awsui_drawers-trigger-content_1kzri_uwwzs_198:not(#\9):not(.awsui_has-multiple-triggers_1kzri_uwwzs_206).awsui_has-open-drawer_1kzri_uwwzs_206 {
   opacity: 0;
 }
-.awsui_drawers-trigger-content_1kzri_jqocx_193:not(#\9):not(.awsui_has-multiple-triggers_1kzri_jqocx_200):not(.awsui_has-open-drawer_1kzri_jqocx_200) {
+.awsui_drawers-trigger-content_1kzri_uwwzs_198:not(#\9):not(.awsui_has-multiple-triggers_1kzri_uwwzs_206):not(.awsui_has-open-drawer_1kzri_uwwzs_206) {
   opacity: 1;
 }
 
 @media (max-width: 688px) {
-  .awsui_drawers-trigger_1kzri_jqocx_193:not(#\9) {
+  .awsui_drawers-trigger_1kzri_uwwzs_198:not(#\9) {
     display: flex;
     justify-content: center;
     align-items: center;

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.selectors.js

@@ -2,17 +2,18 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "universal-toolbar": "awsui_universal-toolbar_1kzri_jqocx_97",
-  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_jqocx_118",
-  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_jqocx_121",
-  "toolbar-container": "awsui_toolbar-container_1kzri_jqocx_124",
-  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_jqocx_133",
-  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_jqocx_137",
-  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_jqocx_142",
-  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_jqocx_149",
-  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_jqocx_193",
-  "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_jqocx_200",
-  "has-open-drawer": "awsui_has-open-drawer_1kzri_jqocx_200",
-  "drawers-trigger": "awsui_drawers-trigger_1kzri_jqocx_193"
+  "universal-toolbar": "awsui_universal-toolbar_1kzri_uwwzs_97",
+  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_uwwzs_119",
+  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_uwwzs_122",
+  "toolbar-container": "awsui_toolbar-container_1kzri_uwwzs_125",
+  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_uwwzs_134",
+  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_uwwzs_138",
+  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_uwwzs_143",
+  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_uwwzs_151",
+  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_uwwzs_152",
+  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_uwwzs_198",
+  "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_uwwzs_206",
+  "has-open-drawer": "awsui_has-open-drawer_1kzri_uwwzs_206",
+  "drawers-trigger": "awsui_drawers-trigger_1kzri_uwwzs_198"
 };
   

package/lib/internal/template/collection-preferences/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAgB1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EAEvB,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,eAAe,EACf,GAAG,IAAI,EACR,EAAE,0BAA0B,eAyK5B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":";AAoBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAgB1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EAEvB,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,eAAe,EACf,GAAG,IAAI,EACR,EAAE,0BAA0B,eAoL5B"}

package/lib/internal/template/collection-preferences/index.js

@@ -1,13 +1,14 @@
 import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useRef, useState } from 'react';
 import clsx from 'clsx';
 import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
 import InternalBox from '../box/internal';
 import { InternalButton } from '../button/internal';
 import { useInternalI18n } from '../i18n/context';
 import { getBaseProps } from '../internal/base-component';
+import { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';
 import { fireNonCancelableEvent } from '../internal/events';
 import checkControlled from '../internal/hooks/check-controlled';
 import useBaseComponent from '../internal/hooks/use-base-component';
@@ -21,7 +22,11 @@ import styles from './styles.css.js';
 const componentName = 'CollectionPreferences';
 export default function CollectionPreferences(_a) {
     var { title, confirmLabel, cancelLabel, disabled = false, onConfirm, onCancel, visibleContentPreference, contentDisplayPreference, pageSizePreference, wrapLinesPreference, stripedRowsPreference, contentDensityPreference, stickyColumnsPreference, preferences, customPreference, getModalRoot, removeModalRoot } = _a, rest = __rest(_a, ["title", "confirmLabel", "cancelLabel", "disabled", "onConfirm", "onCancel", "visibleContentPreference", "contentDisplayPreference", "pageSizePreference", "wrapLinesPreference", "stripedRowsPreference", "contentDensityPreference", "stickyColumnsPreference", "preferences", "customPreference", "getModalRoot", "removeModalRoot"]);
-    const { __internalRootRef } = useBaseComponent('CollectionPreferences');
+    const parentMetadata = useContext(CollectionPreferencesMetadata);
+    const { __internalRootRef } = useBaseComponent('CollectionPreferences', {
+        props: {},
+        metadata: Object.assign(Object.assign({}, parentMetadata), { hasStripedRowsPreference: !!stripedRowsPreference, hasVisibleContentPreference: !!visibleContentPreference, hasContentDisplayPreference: !!contentDisplayPreference, hasContentDensityPreference: !!contentDensityPreference, hasStickyColumnsPreference: !!stickyColumnsPreference }),
+    });
     checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);
     const i18n = useInternalI18n('collection-preferences');
     const baseProps = getBaseProps(rest);

package/lib/internal/template/collection-preferences/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/collection-preferences/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\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalModal from '../modal/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport ContentDisplayPreference from './content-display';\nimport { CollectionPreferencesProps } from './interfaces';\nimport {\n  ContentDensityPreference,\n  copyPreferences,\n  CustomPreference,\n  mergePreferences,\n  ModalContentLayout,\n  PageSizePreference,\n  StickyColumnsPreference,\n  StripedRowsPreference,\n  WrapLinesPreference,\n} from './utils';\nimport VisibleContentPreference from './visible-content';\n\nimport styles from './styles.css.js';\n\nexport { CollectionPreferencesProps };\n\nconst componentName = 'CollectionPreferences';\n\nexport default function CollectionPreferences({\n  title,\n  confirmLabel,\n  cancelLabel,\n  disabled = false,\n  onConfirm,\n  onCancel,\n  visibleContentPreference,\n  contentDisplayPreference,\n  pageSizePreference,\n  wrapLinesPreference,\n  stripedRowsPreference,\n  contentDensityPreference,\n  stickyColumnsPreference,\n\n  preferences,\n  customPreference,\n  getModalRoot,\n  removeModalRoot,\n  ...rest\n}: CollectionPreferencesProps) {\n  const { __internalRootRef } = useBaseComponent('CollectionPreferences');\n  checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);\n\n  const i18n = useInternalI18n('collection-preferences');\n  const baseProps = getBaseProps(rest);\n  const [modalVisible, setModalVisible] = useState(false);\n  const [temporaryPreferences, setTemporaryPreferences] = useState(copyPreferences(preferences || {}));\n  const triggerRef = useRef<ButtonProps.Ref>(null);\n  const dialogPreviouslyOpen = useRef(false);\n\n  useEffect(() => {\n    if (!modalVisible) {\n      dialogPreviouslyOpen.current && triggerRef.current && triggerRef.current.focus();\n    } else {\n      dialogPreviouslyOpen.current = true;\n    }\n  }, [modalVisible]);\n\n  const onConfirmListener = () => {\n    setModalVisible(false);\n    fireNonCancelableEvent(onConfirm, temporaryPreferences);\n  };\n\n  const onCancelListener = () => {\n    fireNonCancelableEvent(onCancel, {});\n    setModalVisible(false);\n    setTemporaryPreferences(copyPreferences(preferences || {}));\n  };\n\n  const hasContentOnTheLeft = !!(\n    pageSizePreference ||\n    wrapLinesPreference ||\n    stripedRowsPreference ||\n    contentDensityPreference ||\n    stickyColumnsPreference ||\n    customPreference\n  );\n  const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);\n\n  const onChange = (changedPreferences: CollectionPreferencesProps.Preferences) =>\n    setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));\n\n  if (visibleContentPreference && contentDisplayPreference) {\n    warnOnce(\n      componentName,\n      'You provided both `visibleContentPreference` and `contentDisplayPreference` props. `visibleContentPreference` will be ignored and only `contentDisplayPreference` will be rendered.'\n    );\n  }\n\n  return (\n    <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n      <InternalButton\n        ref={triggerRef}\n        className={styles['trigger-button']}\n        disabled={disabled}\n        ariaLabel={i18n('title', title)}\n        onClick={() => {\n          setTemporaryPreferences(copyPreferences(preferences || {}));\n          setModalVisible(true);\n        }}\n        variant=\"icon\"\n        iconName=\"settings\"\n        formAction=\"none\"\n      />\n      {!disabled && modalVisible && (\n        <InternalModal\n          className={styles['modal-root']}\n          visible={true}\n          getModalRoot={getModalRoot}\n          removeModalRoot={removeModalRoot}\n          header={i18n('title', title)}\n          footer={\n            <InternalBox float=\"right\">\n              <InternalSpaceBetween direction=\"horizontal\" size=\"xs\">\n                <InternalButton\n                  className={styles['cancel-button']}\n                  variant=\"link\"\n                  formAction=\"none\"\n                  onClick={onCancelListener}\n                >\n                  {i18n('cancelLabel', cancelLabel)}\n                </InternalButton>\n                <InternalButton\n                  className={styles['confirm-button']}\n                  variant=\"primary\"\n                  formAction=\"none\"\n                  onClick={onConfirmListener}\n                >\n                  {i18n('confirmLabel', confirmLabel)}\n                </InternalButton>\n              </InternalSpaceBetween>\n            </InternalBox>\n          }\n          closeAriaLabel={cancelLabel}\n          size={hasContentOnTheLeft && hasContentOnTheRight ? 'large' : 'medium'}\n          onDismiss={onCancelListener}\n        >\n          <ModalContentLayout\n            left={\n              hasContentOnTheLeft && (\n                <InternalSpaceBetween size=\"l\">\n                  {pageSizePreference && (\n                    <PageSizePreference\n                      value={temporaryPreferences.pageSize}\n                      {...pageSizePreference}\n                      onChange={pageSize => onChange({ pageSize })}\n                    />\n                  )}\n                  {wrapLinesPreference && (\n                    <WrapLinesPreference\n                      value={temporaryPreferences.wrapLines}\n                      {...wrapLinesPreference}\n                      onChange={wrapLines => onChange({ wrapLines })}\n                    />\n                  )}\n                  {stripedRowsPreference && (\n                    <StripedRowsPreference\n                      value={temporaryPreferences.stripedRows}\n                      {...stripedRowsPreference}\n                      onChange={stripedRows => onChange({ stripedRows })}\n                    />\n                  )}\n                  {contentDensityPreference && (\n                    <ContentDensityPreference\n                      value={temporaryPreferences.contentDensity}\n                      {...contentDensityPreference}\n                      onChange={contentDensity => onChange({ contentDensity })}\n                    />\n                  )}\n                  {stickyColumnsPreference && (\n                    <StickyColumnsPreference\n                      value={temporaryPreferences.stickyColumns}\n                      {...stickyColumnsPreference}\n                      onChange={stickyColumns => onChange({ stickyColumns })}\n                    />\n                  )}\n                  {customPreference && (\n                    <CustomPreference\n                      value={temporaryPreferences.custom}\n                      customPreference={customPreference}\n                      onChange={custom => onChange({ custom })}\n                    />\n                  )}\n                </InternalSpaceBetween>\n              )\n            }\n            right={\n              contentDisplayPreference ? (\n                <ContentDisplayPreference\n                  {...contentDisplayPreference}\n                  value={temporaryPreferences.contentDisplay}\n                  onChange={contentDisplay => onChange({ contentDisplay })}\n                />\n              ) : (\n                visibleContentPreference && (\n                  <VisibleContentPreference\n                    value={temporaryPreferences.visibleContent}\n                    {...visibleContentPreference}\n                    onChange={visibleItems => onChange({ visibleContent: visibleItems })}\n                  />\n                )\n              )\n            }\n          />\n        </InternalModal>\n      )}\n    </div>\n  );\n}\n\napplyDisplayName(CollectionPreferences, componentName);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/collection-preferences/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\nimport React, { useContext, useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalModal from '../modal/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport ContentDisplayPreference from './content-display';\nimport { CollectionPreferencesProps } from './interfaces';\nimport {\n  ContentDensityPreference,\n  copyPreferences,\n  CustomPreference,\n  mergePreferences,\n  ModalContentLayout,\n  PageSizePreference,\n  StickyColumnsPreference,\n  StripedRowsPreference,\n  WrapLinesPreference,\n} from './utils';\nimport VisibleContentPreference from './visible-content';\n\nimport styles from './styles.css.js';\n\nexport { CollectionPreferencesProps };\n\nconst componentName = 'CollectionPreferences';\n\nexport default function CollectionPreferences({\n  title,\n  confirmLabel,\n  cancelLabel,\n  disabled = false,\n  onConfirm,\n  onCancel,\n  visibleContentPreference,\n  contentDisplayPreference,\n  pageSizePreference,\n  wrapLinesPreference,\n  stripedRowsPreference,\n  contentDensityPreference,\n  stickyColumnsPreference,\n\n  preferences,\n  customPreference,\n  getModalRoot,\n  removeModalRoot,\n  ...rest\n}: CollectionPreferencesProps) {\n  const parentMetadata = useContext(CollectionPreferencesMetadata);\n  const { __internalRootRef } = useBaseComponent('CollectionPreferences', {\n    props: {},\n    metadata: {\n      ...parentMetadata,\n      hasStripedRowsPreference: !!stripedRowsPreference,\n      hasVisibleContentPreference: !!visibleContentPreference,\n      hasContentDisplayPreference: !!contentDisplayPreference,\n      hasContentDensityPreference: !!contentDensityPreference,\n      hasStickyColumnsPreference: !!stickyColumnsPreference,\n    },\n  });\n  checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);\n\n  const i18n = useInternalI18n('collection-preferences');\n  const baseProps = getBaseProps(rest);\n  const [modalVisible, setModalVisible] = useState(false);\n  const [temporaryPreferences, setTemporaryPreferences] = useState(copyPreferences(preferences || {}));\n  const triggerRef = useRef<ButtonProps.Ref>(null);\n  const dialogPreviouslyOpen = useRef(false);\n\n  useEffect(() => {\n    if (!modalVisible) {\n      dialogPreviouslyOpen.current && triggerRef.current && triggerRef.current.focus();\n    } else {\n      dialogPreviouslyOpen.current = true;\n    }\n  }, [modalVisible]);\n\n  const onConfirmListener = () => {\n    setModalVisible(false);\n    fireNonCancelableEvent(onConfirm, temporaryPreferences);\n  };\n\n  const onCancelListener = () => {\n    fireNonCancelableEvent(onCancel, {});\n    setModalVisible(false);\n    setTemporaryPreferences(copyPreferences(preferences || {}));\n  };\n\n  const hasContentOnTheLeft = !!(\n    pageSizePreference ||\n    wrapLinesPreference ||\n    stripedRowsPreference ||\n    contentDensityPreference ||\n    stickyColumnsPreference ||\n    customPreference\n  );\n  const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);\n\n  const onChange = (changedPreferences: CollectionPreferencesProps.Preferences) =>\n    setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));\n\n  if (visibleContentPreference && contentDisplayPreference) {\n    warnOnce(\n      componentName,\n      'You provided both `visibleContentPreference` and `contentDisplayPreference` props. `visibleContentPreference` will be ignored and only `contentDisplayPreference` will be rendered.'\n    );\n  }\n\n  return (\n    <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n      <InternalButton\n        ref={triggerRef}\n        className={styles['trigger-button']}\n        disabled={disabled}\n        ariaLabel={i18n('title', title)}\n        onClick={() => {\n          setTemporaryPreferences(copyPreferences(preferences || {}));\n          setModalVisible(true);\n        }}\n        variant=\"icon\"\n        iconName=\"settings\"\n        formAction=\"none\"\n      />\n      {!disabled && modalVisible && (\n        <InternalModal\n          className={styles['modal-root']}\n          visible={true}\n          getModalRoot={getModalRoot}\n          removeModalRoot={removeModalRoot}\n          header={i18n('title', title)}\n          footer={\n            <InternalBox float=\"right\">\n              <InternalSpaceBetween direction=\"horizontal\" size=\"xs\">\n                <InternalButton\n                  className={styles['cancel-button']}\n                  variant=\"link\"\n                  formAction=\"none\"\n                  onClick={onCancelListener}\n                >\n                  {i18n('cancelLabel', cancelLabel)}\n                </InternalButton>\n                <InternalButton\n                  className={styles['confirm-button']}\n                  variant=\"primary\"\n                  formAction=\"none\"\n                  onClick={onConfirmListener}\n                >\n                  {i18n('confirmLabel', confirmLabel)}\n                </InternalButton>\n              </InternalSpaceBetween>\n            </InternalBox>\n          }\n          closeAriaLabel={cancelLabel}\n          size={hasContentOnTheLeft && hasContentOnTheRight ? 'large' : 'medium'}\n          onDismiss={onCancelListener}\n        >\n          <ModalContentLayout\n            left={\n              hasContentOnTheLeft && (\n                <InternalSpaceBetween size=\"l\">\n                  {pageSizePreference && (\n                    <PageSizePreference\n                      value={temporaryPreferences.pageSize}\n                      {...pageSizePreference}\n                      onChange={pageSize => onChange({ pageSize })}\n                    />\n                  )}\n                  {wrapLinesPreference && (\n                    <WrapLinesPreference\n                      value={temporaryPreferences.wrapLines}\n                      {...wrapLinesPreference}\n                      onChange={wrapLines => onChange({ wrapLines })}\n                    />\n                  )}\n                  {stripedRowsPreference && (\n                    <StripedRowsPreference\n                      value={temporaryPreferences.stripedRows}\n                      {...stripedRowsPreference}\n                      onChange={stripedRows => onChange({ stripedRows })}\n                    />\n                  )}\n                  {contentDensityPreference && (\n                    <ContentDensityPreference\n                      value={temporaryPreferences.contentDensity}\n                      {...contentDensityPreference}\n                      onChange={contentDensity => onChange({ contentDensity })}\n                    />\n                  )}\n                  {stickyColumnsPreference && (\n                    <StickyColumnsPreference\n                      value={temporaryPreferences.stickyColumns}\n                      {...stickyColumnsPreference}\n                      onChange={stickyColumns => onChange({ stickyColumns })}\n                    />\n                  )}\n                  {customPreference && (\n                    <CustomPreference\n                      value={temporaryPreferences.custom}\n                      customPreference={customPreference}\n                      onChange={custom => onChange({ custom })}\n                    />\n                  )}\n                </InternalSpaceBetween>\n              )\n            }\n            right={\n              contentDisplayPreference ? (\n                <ContentDisplayPreference\n                  {...contentDisplayPreference}\n                  value={temporaryPreferences.contentDisplay}\n                  onChange={contentDisplay => onChange({ contentDisplay })}\n                />\n              ) : (\n                visibleContentPreference && (\n                  <VisibleContentPreference\n                    value={temporaryPreferences.visibleContent}\n                    {...visibleContentPreference}\n                    onChange={visibleItems => onChange({ visibleContent: visibleItems })}\n                  />\n                )\n              )\n            }\n          />\n        </InternalModal>\n      )}\n    </div>\n  );\n}\n\napplyDisplayName(CollectionPreferences, componentName);\n"]}

package/lib/internal/template/internal/context/collection-preferences-metadata-context.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+interface CollectionPreferencesMetadataInterface {
+    tableHasStripedRows?: boolean;
+    tableHasHiddenColumns?: boolean;
+    tableHasStickyColumns?: boolean;
+    tableContentDensity?: string;
+}
+export declare const CollectionPreferencesMetadata: import("react").Context<CollectionPreferencesMetadataInterface>;
+export {};
+//# sourceMappingURL=collection-preferences-metadata-context.d.ts.map

package/lib/internal/template/internal/context/collection-preferences-metadata-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection-preferences-metadata-context.d.ts","sourceRoot":"","sources":["../../../../src/internal/context/collection-preferences-metadata-context.ts"],"names":[],"mappings":";AAIA,UAAU,sCAAsC;IAC9C,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED,eAAO,MAAM,6BAA6B,iEAA4D,CAAC"}

package/lib/internal/template/internal/context/collection-preferences-metadata-context.js

@@ -0,0 +1,5 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { createContext } from 'react';
+export const CollectionPreferencesMetadata = createContext({});
+//# sourceMappingURL=collection-preferences-metadata-context.js.map

package/lib/internal/template/internal/context/collection-preferences-metadata-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection-preferences-metadata-context.js","sourceRoot":"","sources":["../../../../src/internal/context/collection-preferences-metadata-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAStC,MAAM,CAAC,MAAM,6BAA6B,GAAG,aAAa,CAAyC,EAAE,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { createContext } from 'react';\n\ninterface CollectionPreferencesMetadataInterface {\n  tableHasStripedRows?: boolean;\n  tableHasHiddenColumns?: boolean;\n  tableHasStickyColumns?: boolean;\n  tableContentDensity?: string;\n}\n\nexport const CollectionPreferencesMetadata = createContext<CollectionPreferencesMetadataInterface>({});\n"]}

package/lib/internal/template/internal/environment.js

@@ -1,4 +1,4 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (b99e6ee1)";
+export var PACKAGE_VERSION = "3.0.0 (343bfdf4)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;

package/lib/internal/template/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (b99e6ee1)",
+  "PACKAGE_VERSION": "3.0.0 (343bfdf4)",
   "THEME": "default",
   "ALWAYS_VISUAL_REFRESH": false
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/table/index.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG/D,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,QAAA,MAAM,KAAK,qBAsEa,CAAC;AAGzB,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/table/index.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG/D,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,QAAA,MAAM,KAAK,qBA8Fa,CAAC;AAGzB,eAAe,KAAK,CAAC"}

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

@@ -4,12 +4,17 @@ import { __rest } from "tslib";
 import React from 'react';
 import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';
+import { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';
 import useBaseComponent from '../internal/hooks/use-base-component';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import { getSortingColumnId } from './header-cell/utils';
 import InternalTable, { InternalTableAsSubstep } from './internal';
 const Table = React.forwardRef((_a, ref) => {
+    var _b, _c, _d;
     var { items = [], selectedItems = [], variant = 'container', contentDensity = 'comfortable', firstIndex = 1 } = _a, props = __rest(_a, ["items", "selectedItems", "variant", "contentDensity", "firstIndex"]);
+    const hasHiddenColumns = (props.visibleColumns && props.visibleColumns.length < props.columnDefinitions.length) ||
+        ((_b = props.columnDisplay) === null || _b === void 0 ? void 0 : _b.some(col => !col.visible));
+    const hasStickyColumns = !!((_c = props.stickyColumns) === null || _c === void 0 ? void 0 : _c.first) || !!((_d = props.stickyColumns) === null || _d === void 0 ? void 0 : _d.last);
     const baseComponentProps = useBaseComponent('Table', {
         props: {
             contentDensity,
@@ -20,12 +25,19 @@ const Table = React.forwardRef((_a, ref) => {
             variant,
             wrapLines: props.wrapLines,
             enableKeyboardNavigation: props.enableKeyboardNavigation,
+            totalItemsCount: props.totalItemsCount,
         },
         metadata: {
             expandableRows: !!props.expandableRows,
             progressiveLoading: !!props.getLoadingStatus,
             inlineEdit: props.columnDefinitions.some(def => !!def.editConfig),
             disabledInlineEdit: props.columnDefinitions.some(def => { var _a; return !!((_a = def.editConfig) === null || _a === void 0 ? void 0 : _a.disabledReason); }),
+            hasSortableColumns: props.columnDefinitions.some(def => def.sortingField || def.sortingComparator),
+            hasHiddenColumns,
+            hasStickyColumns,
+            hasFilterSlot: !!props.filter,
+            hasPaginationSlot: !!props.pagination,
+            itemsCount: items.length,
         },
     });
     const analyticsComponentMetadata = {
@@ -48,11 +60,19 @@ const Table = React.forwardRef((_a, ref) => {
         variant,
         contentDensity,
         firstIndex }, props), baseComponentProps), { ref }), getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }));
+    const collectionPreferencesMetadata = {
+        tableContentDensity: contentDensity,
+        tableHasStripedRows: !!props.stripedRows,
+        tableHasHiddenColumns: hasHiddenColumns,
+        tableHasStickyColumns: hasStickyColumns,
+    };
     if (variant === 'borderless' || variant === 'embedded') {
-        return React.createElement(InternalTable, Object.assign({}, tableProps));
+        return (React.createElement(CollectionPreferencesMetadata.Provider, { value: collectionPreferencesMetadata },
+            React.createElement(InternalTable, Object.assign({}, tableProps))));
     }
-    return (React.createElement(AnalyticsFunnelSubStep, null,
-        React.createElement(InternalTableAsSubstep, Object.assign({}, tableProps))));
+    return (React.createElement(CollectionPreferencesMetadata.Provider, { value: collectionPreferencesMetadata },
+        React.createElement(AnalyticsFunnelSubStep, null,
+            React.createElement(InternalTableAsSubstep, Object.assign({}, tableProps)))));
 });
 applyDisplayName(Table, 'Table');
 export default Table;

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/table/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\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataTableComponent } from './analytics-metadata/interfaces';\nimport { getSortingColumnId } from './header-cell/utils';\nimport { TableForwardRefType, TableProps } from './interfaces';\nimport InternalTable, { InternalTableAsSubstep } from './internal';\n\nexport { TableProps };\nconst Table = React.forwardRef(\n  <T,>(\n    {\n      items = [],\n      selectedItems = [],\n      variant = 'container',\n      contentDensity = 'comfortable',\n      firstIndex = 1,\n      ...props\n    }: TableProps<T>,\n    ref: React.Ref<TableProps.Ref>\n  ) => {\n    const baseComponentProps = useBaseComponent('Table', {\n      props: {\n        contentDensity,\n        resizableColumns: props.resizableColumns,\n        selectionType: props.selectionType,\n        stickyHeader: props.stickyHeader,\n        stripedRows: props.stripedRows,\n        variant,\n        wrapLines: props.wrapLines,\n        enableKeyboardNavigation: props.enableKeyboardNavigation,\n      },\n      metadata: {\n        expandableRows: !!props.expandableRows,\n        progressiveLoading: !!props.getLoadingStatus,\n        inlineEdit: props.columnDefinitions.some(def => !!def.editConfig),\n        disabledInlineEdit: props.columnDefinitions.some(def => !!def.editConfig?.disabledReason),\n      },\n    });\n\n    const analyticsComponentMetadata: GeneratedAnalyticsMetadataTableComponent = {\n      name: 'awsui.Table',\n      label: { root: 'self' },\n      properties: {\n        selectionType: props.selectionType || 'none',\n        itemsCount: `${items.length}`,\n        selectedItemsCount: `${selectedItems.length}`,\n        variant,\n      },\n    };\n\n    const sortingColumnId = getSortingColumnId(props.columnDefinitions, props.sortingColumn);\n    if (sortingColumnId) {\n      analyticsComponentMetadata.properties.sortingColumnId = sortingColumnId;\n      analyticsComponentMetadata.properties.sortingDescending = `${props.sortingDescending || false}`;\n    }\n\n    const tableProps: Parameters<typeof InternalTable<T>>[0] = {\n      items,\n      selectedItems,\n      variant,\n      contentDensity,\n      firstIndex,\n      ...props,\n      ...baseComponentProps,\n      ref,\n      ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }),\n    };\n\n    if (variant === 'borderless' || variant === 'embedded') {\n      return <InternalTable {...tableProps} />;\n    }\n\n    return (\n      <AnalyticsFunnelSubStep>\n        <InternalTableAsSubstep {...tableProps} />\n      </AnalyticsFunnelSubStep>\n    );\n  }\n) as TableForwardRefType;\n\napplyDisplayName(Table, 'Table');\nexport default Table;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/table/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\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';\nimport { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataTableComponent } from './analytics-metadata/interfaces';\nimport { getSortingColumnId } from './header-cell/utils';\nimport { TableForwardRefType, TableProps } from './interfaces';\nimport InternalTable, { InternalTableAsSubstep } from './internal';\n\nexport { TableProps };\nconst Table = React.forwardRef(\n  <T,>(\n    {\n      items = [],\n      selectedItems = [],\n      variant = 'container',\n      contentDensity = 'comfortable',\n      firstIndex = 1,\n      ...props\n    }: TableProps<T>,\n    ref: React.Ref<TableProps.Ref>\n  ) => {\n    const hasHiddenColumns =\n      (props.visibleColumns && props.visibleColumns.length < props.columnDefinitions.length) ||\n      props.columnDisplay?.some(col => !col.visible);\n    const hasStickyColumns = !!props.stickyColumns?.first || !!props.stickyColumns?.last;\n    const baseComponentProps = useBaseComponent('Table', {\n      props: {\n        contentDensity,\n        resizableColumns: props.resizableColumns,\n        selectionType: props.selectionType,\n        stickyHeader: props.stickyHeader,\n        stripedRows: props.stripedRows,\n        variant,\n        wrapLines: props.wrapLines,\n        enableKeyboardNavigation: props.enableKeyboardNavigation,\n        totalItemsCount: props.totalItemsCount,\n      },\n      metadata: {\n        expandableRows: !!props.expandableRows,\n        progressiveLoading: !!props.getLoadingStatus,\n        inlineEdit: props.columnDefinitions.some(def => !!def.editConfig),\n        disabledInlineEdit: props.columnDefinitions.some(def => !!def.editConfig?.disabledReason),\n        hasSortableColumns: props.columnDefinitions.some(def => def.sortingField || def.sortingComparator),\n        hasHiddenColumns,\n        hasStickyColumns,\n        hasFilterSlot: !!props.filter,\n        hasPaginationSlot: !!props.pagination,\n        itemsCount: items.length,\n      },\n    });\n\n    const analyticsComponentMetadata: GeneratedAnalyticsMetadataTableComponent = {\n      name: 'awsui.Table',\n      label: { root: 'self' },\n      properties: {\n        selectionType: props.selectionType || 'none',\n        itemsCount: `${items.length}`,\n        selectedItemsCount: `${selectedItems.length}`,\n        variant,\n      },\n    };\n\n    const sortingColumnId = getSortingColumnId(props.columnDefinitions, props.sortingColumn);\n    if (sortingColumnId) {\n      analyticsComponentMetadata.properties.sortingColumnId = sortingColumnId;\n      analyticsComponentMetadata.properties.sortingDescending = `${props.sortingDescending || false}`;\n    }\n\n    const tableProps: Parameters<typeof InternalTable<T>>[0] = {\n      items,\n      selectedItems,\n      variant,\n      contentDensity,\n      firstIndex,\n      ...props,\n      ...baseComponentProps,\n      ref,\n      ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }),\n    };\n\n    const collectionPreferencesMetadata = {\n      tableContentDensity: contentDensity,\n      tableHasStripedRows: !!props.stripedRows,\n      tableHasHiddenColumns: hasHiddenColumns,\n      tableHasStickyColumns: hasStickyColumns,\n    };\n\n    if (variant === 'borderless' || variant === 'embedded') {\n      return (\n        <CollectionPreferencesMetadata.Provider value={collectionPreferencesMetadata}>\n          <InternalTable {...tableProps} />\n        </CollectionPreferencesMetadata.Provider>\n      );\n    }\n\n    return (\n      <CollectionPreferencesMetadata.Provider value={collectionPreferencesMetadata}>\n        <AnalyticsFunnelSubStep>\n          <InternalTableAsSubstep {...tableProps} />\n        </AnalyticsFunnelSubStep>\n      </CollectionPreferencesMetadata.Provider>\n    );\n  }\n) as TableForwardRefType;\n\napplyDisplayName(Table, 'Table');\nexport default Table;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"use-column-widths.d.ts","sourceRoot":"","sources":["../../../src/table/use-column-widths.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAOtF,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAwCD,UAAU,aAAa;IACrB,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC;IAC7E,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IACvC,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,GAAG,WAAW,KAAK,IAAI,CAAC;CACrF;AAED,QAAA,MAAM,aAAa,8BAKjB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,cAAc,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACjD,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eAoHpH;AAED,wBAAgB,eAAe,kBAE9B"}
+{"version":3,"file":"use-column-widths.d.ts","sourceRoot":"","sources":["../../../src/table/use-column-widths.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAOtF,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAwCD,UAAU,aAAa;IACrB,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC;IAC7E,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IACvC,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,GAAG,WAAW,KAAK,IAAI,CAAC;CACrF;AAED,QAAA,MAAM,aAAa,8BAKjB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,cAAc,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACjD,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eAwHpH;AAED,wBAAgB,eAAe,kBAE9B"}

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

@@ -61,7 +61,10 @@ export function ColumnWidthsProvider({ visibleColumns, resizableColumns, contain
             return {};
         }
         if (sticky) {
-            return { width: ((_a = cellsRef.current.get(column.id)) === null || _a === void 0 ? void 0 : _a.offsetWidth) || ((_b = columnWidths === null || columnWidths === void 0 ? void 0 : columnWidths.get(column.id)) !== null && _b !== void 0 ? _b : column.width) };
+            return {
+                width: ((_a = cellsRef.current.get(column.id)) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) ||
+                    ((_b = columnWidths === null || columnWidths === void 0 ? void 0 : columnWidths.get(column.id)) !== null && _b !== void 0 ? _b : column.width),
+            };
         }
         if (resizableColumns && columnWidths) {
             const isLastColumn = column.id === ((_c = visibleColumns[visibleColumns.length - 1]) === null || _c === void 0 ? void 0 : _c.id);
@@ -99,7 +102,7 @@ export function ColumnWidthsProvider({ visibleColumns, resizableColumns, contain
     // Observes container size and requests an update to the last cell width as it depends on the container's width.
     useResizeObserver(containerRef, ({ contentBoxWidth: containerWidth }) => {
         containerWidthRef.current = containerWidth;
-        updateColumnWidths();
+        requestAnimationFrame(() => updateColumnWidths());
     });
     // The widths of the dynamically added columns (after the first render) if not set explicitly
     // will default to the DEFAULT_COLUMN_WIDTH.

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

@@ -1 +1 @@
-{"version":3,"file":"use-column-widths.js","sourceRoot":"","sources":["../../../src/table/use-column-widths.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { createContext, useContext, useEffect, useRef, useState } from 'react';\n\nimport { useResizeObserver, useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { getLogicalBoundingClientRect } from '@cloudscape-design/component-toolkit/internal';\n\nimport { setElementWidths } from './column-widths-utils';\n\nexport const DEFAULT_COLUMN_WIDTH = 120;\n\nexport interface ColumnWidthDefinition {\n  id: PropertyKey;\n  minWidth?: string | number;\n  maxWidth?: string | number;\n  width?: string | number;\n}\n\nfunction readWidths(\n  getCell: (columnId: PropertyKey) => null | HTMLElement,\n  visibleColumns: readonly ColumnWidthDefinition[]\n) {\n  const result = new Map<PropertyKey, number>();\n  for (let index = 0; index < visibleColumns.length; index++) {\n    const column = visibleColumns[index];\n    let width = (column.width as number) || 0;\n    const minWidth = (column.minWidth as number) || width || DEFAULT_COLUMN_WIDTH;\n    if (\n      !width && // read width from the DOM if it is missing in the config\n      index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container\n    ) {\n      const colEl = getCell(column.id);\n      width = colEl ? getLogicalBoundingClientRect(colEl).inlineSize : DEFAULT_COLUMN_WIDTH;\n    }\n    result.set(column.id, Math.max(width, minWidth));\n  }\n  return result;\n}\n\nfunction updateWidths(\n  visibleColumns: readonly ColumnWidthDefinition[],\n  oldWidths: Map<PropertyKey, number>,\n  newWidth: number,\n  columnId: PropertyKey\n) {\n  const column = visibleColumns.find(column => column.id === columnId);\n  const minWidth = typeof column?.minWidth === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;\n  newWidth = Math.max(newWidth, minWidth);\n  if (oldWidths.get(columnId) === newWidth) {\n    return oldWidths;\n  }\n  const newWidths = new Map(oldWidths);\n  newWidths.set(columnId, newWidth);\n  return newWidths;\n}\n\ninterface WidthsContext {\n  getColumnStyles(sticky: boolean, columnId: PropertyKey): React.CSSProperties;\n  columnWidths: Map<PropertyKey, number>;\n  updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n  setCell: (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => void;\n}\n\nconst WidthsContext = createContext<WidthsContext>({\n  getColumnStyles: () => ({}),\n  columnWidths: new Map(),\n  updateColumn: () => {},\n  setCell: () => {},\n});\n\ninterface WidthProviderProps {\n  visibleColumns: readonly ColumnWidthDefinition[];\n  resizableColumns: boolean | undefined;\n  containerRef: React.RefObject<HTMLElement>;\n  children: React.ReactNode;\n}\n\nexport function ColumnWidthsProvider({ visibleColumns, resizableColumns, containerRef, children }: WidthProviderProps) {\n  const visibleColumnsRef = useRef<PropertyKey[] | null>(null);\n  const containerWidthRef = useRef(0);\n  const [columnWidths, setColumnWidths] = useState<null | Map<PropertyKey, number>>(null);\n\n  const cellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n  const stickyCellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n  const getCell = (columnId: PropertyKey): null | HTMLElement => cellsRef.current.get(columnId) ?? null;\n  const setCell = (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => {\n    const ref = sticky ? stickyCellsRef : cellsRef;\n    if (node) {\n      ref.current.set(columnId, node);\n    } else {\n      ref.current.delete(columnId);\n    }\n  };\n\n  const getColumnStyles = (sticky: boolean, columnId: PropertyKey): React.CSSProperties => {\n    const column = visibleColumns.find(column => column.id === columnId);\n    if (!column) {\n      return {};\n    }\n\n    if (sticky) {\n      return { width: cellsRef.current.get(column.id)?.offsetWidth || (columnWidths?.get(column.id) ?? column.width) };\n    }\n\n    if (resizableColumns && columnWidths) {\n      const isLastColumn = column.id === visibleColumns[visibleColumns.length - 1]?.id;\n      const totalWidth = visibleColumns.reduce(\n        (sum, { id }) => sum + (columnWidths.get(id) || DEFAULT_COLUMN_WIDTH),\n        0\n      );\n      if (isLastColumn && containerWidthRef.current > totalWidth) {\n        return { width: 'auto', minWidth: column?.minWidth };\n      } else {\n        return { width: columnWidths.get(column.id), minWidth: column?.minWidth };\n      }\n    }\n    return {\n      width: column.width,\n      minWidth: column.minWidth,\n      maxWidth: !resizableColumns ? column.maxWidth : undefined,\n    };\n  };\n\n  // Imperatively sets width style for a cell avoiding React state.\n  // This allows setting the style as soon container's size change is observed.\n  const updateColumnWidths = useStableCallback(() => {\n    for (const { id } of visibleColumns) {\n      const element = cellsRef.current.get(id);\n      if (element) {\n        setElementWidths(element, getColumnStyles(false, id));\n      }\n    }\n    // Sticky column widths must be synchronized once all real column widths are assigned.\n    for (const { id } of visibleColumns) {\n      const element = stickyCellsRef.current.get(id);\n      if (element) {\n        setElementWidths(element, getColumnStyles(true, id));\n      }\n    }\n  });\n\n  // Observes container size and requests an update to the last cell width as it depends on the container's width.\n  useResizeObserver(containerRef, ({ contentBoxWidth: containerWidth }) => {\n    containerWidthRef.current = containerWidth;\n    updateColumnWidths();\n  });\n\n  // The widths of the dynamically added columns (after the first render) if not set explicitly\n  // will default to the DEFAULT_COLUMN_WIDTH.\n  useEffect(() => {\n    updateColumnWidths();\n\n    if (!resizableColumns) {\n      return;\n    }\n    let updated = false;\n    const newColumnWidths = new Map(columnWidths);\n    const lastVisible = visibleColumnsRef.current;\n    if (lastVisible) {\n      for (let index = 0; index < visibleColumns.length; index++) {\n        const column = visibleColumns[index];\n        if (!columnWidths?.get(column.id) && lastVisible.indexOf(column.id) === -1) {\n          updated = true;\n          newColumnWidths.set(column.id, (column.width as number) || DEFAULT_COLUMN_WIDTH);\n        }\n      }\n      if (updated) {\n        setColumnWidths(newColumnWidths);\n      }\n    }\n    visibleColumnsRef.current = visibleColumns.map(column => column.id);\n  }, [columnWidths, resizableColumns, visibleColumns, updateColumnWidths]);\n\n  // Read the actual column widths after the first render to employ the browser defaults for\n  // those columns without explicit width.\n  useEffect(() => {\n    if (!resizableColumns) {\n      return;\n    }\n    setColumnWidths(() => readWidths(getCell, visibleColumns));\n    // This code is intended to run only at the first render and should not re-run when table props change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  function updateColumn(columnId: PropertyKey, newWidth: number) {\n    setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths ?? new Map(), newWidth, columnId));\n  }\n\n  return (\n    <WidthsContext.Provider value={{ getColumnStyles, columnWidths: columnWidths ?? new Map(), updateColumn, setCell }}>\n      {children}\n    </WidthsContext.Provider>\n  );\n}\n\nexport function useColumnWidths() {\n  return useContext(WidthsContext);\n}\n"]}
+{"version":3,"file":"use-column-widths.js","sourceRoot":"","sources":["../../../src/table/use-column-widths.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AACrG,OAAO,EAAE,4BAA4B,EAAE,MAAM,+CAA+C,CAAC;AAE7F,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAC;AASxC,SAAS,UAAU,CACjB,OAAsD,EACtD,cAAgD;IAEhD,MAAM,MAAM,GAAG,IAAI,GAAG,EAAuB,CAAC;IAC9C,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;QAC1D,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;QACrC,IAAI,KAAK,GAAI,MAAM,CAAC,KAAgB,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAI,MAAM,CAAC,QAAmB,IAAI,KAAK,IAAI,oBAAoB,CAAC;QAC9E,IACE,CAAC,KAAK,IAAI,yDAAyD;YACnE,KAAK,KAAK,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,kFAAkF;UACtH;YACA,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;YACjC,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,4BAA4B,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,oBAAoB,CAAC;SACvF;QACD,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;KAClD;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,YAAY,CACnB,cAAgD,EAChD,SAAmC,EACnC,QAAgB,EAChB,QAAqB;IAErB,MAAM,MAAM,GAAG,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;IACrE,MAAM,QAAQ,GAAG,OAAO,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,CAAA,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC;IAC/F,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IACxC,IAAI,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,QAAQ,EAAE;QACxC,OAAO,SAAS,CAAC;KAClB;IACD,MAAM,SAAS,GAAG,IAAI,GAAG,CAAC,SAAS,CAAC,CAAC;IACrC,SAAS,CAAC,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAClC,OAAO,SAAS,CAAC;AACnB,CAAC;AASD,MAAM,aAAa,GAAG,aAAa,CAAgB;IACjD,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC;IAC3B,YAAY,EAAE,IAAI,GAAG,EAAE;IACvB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;CAClB,CAAC,CAAC;AASH,MAAM,UAAU,oBAAoB,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,QAAQ,EAAsB;IACnH,MAAM,iBAAiB,GAAG,MAAM,CAAuB,IAAI,CAAC,CAAC;IAC7D,MAAM,iBAAiB,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IACpC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAkC,IAAI,CAAC,CAAC;IAExF,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,GAAG,EAA4B,CAAC,CAAC;IAC7D,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,GAAG,EAA4B,CAAC,CAAC;IACnE,MAAM,OAAO,GAAG,CAAC,QAAqB,EAAsB,EAAE,WAAC,OAAA,MAAA,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,mCAAI,IAAI,CAAA,EAAA,CAAC;IACtG,MAAM,OAAO,GAAG,CAAC,MAAe,EAAE,QAAqB,EAAE,IAAwB,EAAE,EAAE;QACnF,MAAM,GAAG,GAAG,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,QAAQ,CAAC;QAC/C,IAAI,IAAI,EAAE;YACR,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;SACjC;aAAM;YACL,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;SAC9B;IACH,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,MAAe,EAAE,QAAqB,EAAuB,EAAE;;QACtF,MAAM,MAAM,GAAG,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;QACrE,IAAI,CAAC,MAAM,EAAE;YACX,OAAO,EAAE,CAAC;SACX;QAED,IAAI,MAAM,EAAE;YACV,OAAO;gBACL,KAAK,EACH,CAAA,MAAA,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,0CAAE,qBAAqB,GAAG,KAAK;oBAC9D,CAAC,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,mCAAI,MAAM,CAAC,KAAK,CAAC;aACjD,CAAC;SACH;QAED,IAAI,gBAAgB,IAAI,YAAY,EAAE;YACpC,MAAM,YAAY,GAAG,MAAM,CAAC,EAAE,MAAK,MAAA,cAAc,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,0CAAE,EAAE,CAAA,CAAC;YACjF,MAAM,UAAU,GAAG,cAAc,CAAC,MAAM,CACtC,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,oBAAoB,CAAC,EACrE,CAAC,CACF,CAAC;YACF,IAAI,YAAY,IAAI,iBAAiB,CAAC,OAAO,GAAG,UAAU,EAAE;gBAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,EAAE,CAAC;aACtD;iBAAM;gBACL,OAAO,EAAE,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,EAAE,CAAC;aAC3E;SACF;QACD,OAAO;YACL,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,QAAQ,EAAE,MAAM,CAAC,QAAQ;YACzB,QAAQ,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;SAC1D,CAAC;IACJ,CAAC,CAAC;IAEF,iEAAiE;IACjE,6EAA6E;IAC7E,MAAM,kBAAkB,GAAG,iBAAiB,CAAC,GAAG,EAAE;QAChD,KAAK,MAAM,EAAE,EAAE,EAAE,IAAI,cAAc,EAAE;YACnC,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;YACzC,IAAI,OAAO,EAAE;gBACX,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC;aACvD;SACF;QACD,sFAAsF;QACtF,KAAK,MAAM,EAAE,EAAE,EAAE,IAAI,cAAc,EAAE;YACnC,MAAM,OAAO,GAAG,cAAc,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;YAC/C,IAAI,OAAO,EAAE;gBACX,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;aACtD;SACF;IACH,CAAC,CAAC,CAAC;IAEH,gHAAgH;IAChH,iBAAiB,CAAC,YAAY,EAAE,CAAC,EAAE,eAAe,EAAE,cAAc,EAAE,EAAE,EAAE;QACtE,iBAAiB,CAAC,OAAO,GAAG,cAAc,CAAC;QAC3C,qBAAqB,CAAC,GAAG,EAAE,CAAC,kBAAkB,EAAE,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;IAEH,6FAA6F;IAC7F,4CAA4C;IAC5C,SAAS,CAAC,GAAG,EAAE;QACb,kBAAkB,EAAE,CAAC;QAErB,IAAI,CAAC,gBAAgB,EAAE;YACrB,OAAO;SACR;QACD,IAAI,OAAO,GAAG,KAAK,CAAC;QACpB,MAAM,eAAe,GAAG,IAAI,GAAG,CAAC,YAAY,CAAC,CAAC;QAC9C,MAAM,WAAW,GAAG,iBAAiB,CAAC,OAAO,CAAC;QAC9C,IAAI,WAAW,EAAE;YACf,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBAC1D,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;gBACrC,IAAI,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,IAAI,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE;oBAC1E,OAAO,GAAG,IAAI,CAAC;oBACf,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,EAAG,MAAM,CAAC,KAAgB,IAAI,oBAAoB,CAAC,CAAC;iBAClF;aACF;YACD,IAAI,OAAO,EAAE;gBACX,eAAe,CAAC,eAAe,CAAC,CAAC;aAClC;SACF;QACD,iBAAiB,CAAC,OAAO,GAAG,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACtE,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAEzE,0FAA0F;IAC1F,wCAAwC;IACxC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,gBAAgB,EAAE;YACrB,OAAO;SACR;QACD,eAAe,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC;QAC3D,sGAAsG;QACtG,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,YAAY,CAAC,QAAqB,EAAE,QAAgB;QAC3D,eAAe,CAAC,YAAY,CAAC,EAAE,CAAC,YAAY,CAAC,cAAc,EAAE,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,IAAI,GAAG,EAAE,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC/G,CAAC;IAED,OAAO,CACL,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,IAAI,GAAG,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,IAC/G,QAAQ,CACc,CAC1B,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe;IAC7B,OAAO,UAAU,CAAC,aAAa,CAAC,CAAC;AACnC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { createContext, useContext, useEffect, useRef, useState } from 'react';\n\nimport { useResizeObserver, useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { getLogicalBoundingClientRect } from '@cloudscape-design/component-toolkit/internal';\n\nimport { setElementWidths } from './column-widths-utils';\n\nexport const DEFAULT_COLUMN_WIDTH = 120;\n\nexport interface ColumnWidthDefinition {\n  id: PropertyKey;\n  minWidth?: string | number;\n  maxWidth?: string | number;\n  width?: string | number;\n}\n\nfunction readWidths(\n  getCell: (columnId: PropertyKey) => null | HTMLElement,\n  visibleColumns: readonly ColumnWidthDefinition[]\n) {\n  const result = new Map<PropertyKey, number>();\n  for (let index = 0; index < visibleColumns.length; index++) {\n    const column = visibleColumns[index];\n    let width = (column.width as number) || 0;\n    const minWidth = (column.minWidth as number) || width || DEFAULT_COLUMN_WIDTH;\n    if (\n      !width && // read width from the DOM if it is missing in the config\n      index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container\n    ) {\n      const colEl = getCell(column.id);\n      width = colEl ? getLogicalBoundingClientRect(colEl).inlineSize : DEFAULT_COLUMN_WIDTH;\n    }\n    result.set(column.id, Math.max(width, minWidth));\n  }\n  return result;\n}\n\nfunction updateWidths(\n  visibleColumns: readonly ColumnWidthDefinition[],\n  oldWidths: Map<PropertyKey, number>,\n  newWidth: number,\n  columnId: PropertyKey\n) {\n  const column = visibleColumns.find(column => column.id === columnId);\n  const minWidth = typeof column?.minWidth === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;\n  newWidth = Math.max(newWidth, minWidth);\n  if (oldWidths.get(columnId) === newWidth) {\n    return oldWidths;\n  }\n  const newWidths = new Map(oldWidths);\n  newWidths.set(columnId, newWidth);\n  return newWidths;\n}\n\ninterface WidthsContext {\n  getColumnStyles(sticky: boolean, columnId: PropertyKey): React.CSSProperties;\n  columnWidths: Map<PropertyKey, number>;\n  updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n  setCell: (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => void;\n}\n\nconst WidthsContext = createContext<WidthsContext>({\n  getColumnStyles: () => ({}),\n  columnWidths: new Map(),\n  updateColumn: () => {},\n  setCell: () => {},\n});\n\ninterface WidthProviderProps {\n  visibleColumns: readonly ColumnWidthDefinition[];\n  resizableColumns: boolean | undefined;\n  containerRef: React.RefObject<HTMLElement>;\n  children: React.ReactNode;\n}\n\nexport function ColumnWidthsProvider({ visibleColumns, resizableColumns, containerRef, children }: WidthProviderProps) {\n  const visibleColumnsRef = useRef<PropertyKey[] | null>(null);\n  const containerWidthRef = useRef(0);\n  const [columnWidths, setColumnWidths] = useState<null | Map<PropertyKey, number>>(null);\n\n  const cellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n  const stickyCellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n  const getCell = (columnId: PropertyKey): null | HTMLElement => cellsRef.current.get(columnId) ?? null;\n  const setCell = (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => {\n    const ref = sticky ? stickyCellsRef : cellsRef;\n    if (node) {\n      ref.current.set(columnId, node);\n    } else {\n      ref.current.delete(columnId);\n    }\n  };\n\n  const getColumnStyles = (sticky: boolean, columnId: PropertyKey): React.CSSProperties => {\n    const column = visibleColumns.find(column => column.id === columnId);\n    if (!column) {\n      return {};\n    }\n\n    if (sticky) {\n      return {\n        width:\n          cellsRef.current.get(column.id)?.getBoundingClientRect().width ||\n          (columnWidths?.get(column.id) ?? column.width),\n      };\n    }\n\n    if (resizableColumns && columnWidths) {\n      const isLastColumn = column.id === visibleColumns[visibleColumns.length - 1]?.id;\n      const totalWidth = visibleColumns.reduce(\n        (sum, { id }) => sum + (columnWidths.get(id) || DEFAULT_COLUMN_WIDTH),\n        0\n      );\n      if (isLastColumn && containerWidthRef.current > totalWidth) {\n        return { width: 'auto', minWidth: column?.minWidth };\n      } else {\n        return { width: columnWidths.get(column.id), minWidth: column?.minWidth };\n      }\n    }\n    return {\n      width: column.width,\n      minWidth: column.minWidth,\n      maxWidth: !resizableColumns ? column.maxWidth : undefined,\n    };\n  };\n\n  // Imperatively sets width style for a cell avoiding React state.\n  // This allows setting the style as soon container's size change is observed.\n  const updateColumnWidths = useStableCallback(() => {\n    for (const { id } of visibleColumns) {\n      const element = cellsRef.current.get(id);\n      if (element) {\n        setElementWidths(element, getColumnStyles(false, id));\n      }\n    }\n    // Sticky column widths must be synchronized once all real column widths are assigned.\n    for (const { id } of visibleColumns) {\n      const element = stickyCellsRef.current.get(id);\n      if (element) {\n        setElementWidths(element, getColumnStyles(true, id));\n      }\n    }\n  });\n\n  // Observes container size and requests an update to the last cell width as it depends on the container's width.\n  useResizeObserver(containerRef, ({ contentBoxWidth: containerWidth }) => {\n    containerWidthRef.current = containerWidth;\n    requestAnimationFrame(() => updateColumnWidths());\n  });\n\n  // The widths of the dynamically added columns (after the first render) if not set explicitly\n  // will default to the DEFAULT_COLUMN_WIDTH.\n  useEffect(() => {\n    updateColumnWidths();\n\n    if (!resizableColumns) {\n      return;\n    }\n    let updated = false;\n    const newColumnWidths = new Map(columnWidths);\n    const lastVisible = visibleColumnsRef.current;\n    if (lastVisible) {\n      for (let index = 0; index < visibleColumns.length; index++) {\n        const column = visibleColumns[index];\n        if (!columnWidths?.get(column.id) && lastVisible.indexOf(column.id) === -1) {\n          updated = true;\n          newColumnWidths.set(column.id, (column.width as number) || DEFAULT_COLUMN_WIDTH);\n        }\n      }\n      if (updated) {\n        setColumnWidths(newColumnWidths);\n      }\n    }\n    visibleColumnsRef.current = visibleColumns.map(column => column.id);\n  }, [columnWidths, resizableColumns, visibleColumns, updateColumnWidths]);\n\n  // Read the actual column widths after the first render to employ the browser defaults for\n  // those columns without explicit width.\n  useEffect(() => {\n    if (!resizableColumns) {\n      return;\n    }\n    setColumnWidths(() => readWidths(getCell, visibleColumns));\n    // This code is intended to run only at the first render and should not re-run when table props change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  function updateColumn(columnId: PropertyKey, newWidth: number) {\n    setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths ?? new Map(), newWidth, columnId));\n  }\n\n  return (\n    <WidthsContext.Provider value={{ getColumnStyles, columnWidths: columnWidths ?? new Map(), updateColumn, setCell }}>\n      {children}\n    </WidthsContext.Provider>\n  );\n}\n\nexport function useColumnWidths() {\n  return useContext(WidthsContext);\n}\n"]}

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

@@ -13,11 +13,11 @@ export const useStickyHeader = (tableRef, theadRef, secondaryTheadRef, secondary
             secondaryTheadRef.current &&
             secondaryTableRef.current &&
             tableWrapperRef.current) {
-            // Using the tableRef offsetWidth instead of the theadRef because in VR
+            // Using the tableRef getBoundingClientRect().width instead of the theadRef because in VR
             // the tableRef adds extra padding to the table and by default the theadRef will have a width
             // without the padding and will make the sticky header width incorrect.
-            secondaryTableRef.current.style.inlineSize = `${tableRef.current.offsetWidth}px`;
-            tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.offsetHeight}px`;
+            secondaryTableRef.current.style.inlineSize = `${tableRef.current.getBoundingClientRect().width}px`;
+            tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.getBoundingClientRect().height}px`;
         }
     }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);
     useLayoutEffect(() => {

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

@@ -1 +1 @@
-{"version":3,"file":"use-sticky-header.js","sourceRoot":"","sources":["../../../src/table/use-sticky-header.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAa,WAAW,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,eAAe,EAAE,EAAE,wBAAwB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE3F,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,QAAgC,EAChC,QAAgC,EAChC,iBAAyC,EACzC,iBAAyC,EACzC,eAAuC,EACvC,EAAE;IACF,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,qFAAqF;IACrF,MAAM,sBAAsB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9C,IACE,QAAQ,CAAC,OAAO;YAChB,QAAQ,CAAC,OAAO;YAChB,iBAAiB,CAAC,OAAO;YACzB,iBAAiB,CAAC,OAAO;YACzB,eAAe,CAAC,OAAO,EACvB;YACA,uEAAuE;YACvE,6FAA6F;YAC7F,uEAAuE;YACvE,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,WAAW,IAAI,CAAC;YAEjF,eAAe,CAAC,OAAO,CAAC,KAAK,CAAC,gBAAgB,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,YAAY,IAAI,CAAC;SACxF;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;IAChF,eAAe,CAAC,GAAG,EAAE;QACnB,sBAAsB,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;IACH,iBAAiB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;IACpD,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,IAAI,eAAe,CAAC,OAAO,EAAE;YACzF,MAAM,UAAU,GAAG,wBAAwB,CAAC,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;YACzF,IAAI,UAAU,GAAG,CAAC,EAAE;gBAClB,UAAU,CAAC,UAAU,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;aACjD;SACF;IACH,CAAC,CAAC;IACF,MAAM,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC;IAC7E,MAAM,WAAW,GAAG,CAAC,QAA4B,EAAE,EAAE;QACnD,IAAI,CAAC,QAAQ,EAAE;YACb,YAAY,CAAC,QAAQ,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IACF,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC;AACtC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { RefObject, useCallback, useLayoutEffect } from 'react';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';\n\nexport const useStickyHeader = (\n  tableRef: RefObject<HTMLElement>,\n  theadRef: RefObject<HTMLElement>,\n  secondaryTheadRef: RefObject<HTMLElement>,\n  secondaryTableRef: RefObject<HTMLElement>,\n  tableWrapperRef: RefObject<HTMLElement>\n) => {\n  const isMobile = useMobile();\n  // Sync the sizes of the column header copies in the sticky header with the originals\n  const syncColumnHeaderWidths = useCallback(() => {\n    if (\n      tableRef.current &&\n      theadRef.current &&\n      secondaryTheadRef.current &&\n      secondaryTableRef.current &&\n      tableWrapperRef.current\n    ) {\n      // Using the tableRef offsetWidth instead of the theadRef because in VR\n      // the tableRef adds extra padding to the table and by default the theadRef will have a width\n      // without the padding and will make the sticky header width incorrect.\n      secondaryTableRef.current.style.inlineSize = `${tableRef.current.offsetWidth}px`;\n\n      tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.offsetHeight}px`;\n    }\n  }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);\n  useLayoutEffect(() => {\n    syncColumnHeaderWidths();\n  });\n  useResizeObserver(theadRef, syncColumnHeaderWidths);\n  const scrollToTop = () => {\n    if (!isMobile && theadRef.current && secondaryTheadRef.current && tableWrapperRef.current) {\n      const scrollDist = calculateScrollingOffset(theadRef.current, secondaryTheadRef.current);\n      if (scrollDist > 0) {\n        scrollUpBy(scrollDist, tableWrapperRef.current);\n      }\n    }\n  };\n  const { scrollToItem } = stickyScrolling(tableWrapperRef, secondaryTheadRef);\n  const scrollToRow = (itemNode: HTMLElement | null) => {\n    if (!isMobile) {\n      scrollToItem(itemNode);\n    }\n  };\n  return { scrollToRow, scrollToTop };\n};\n"]}
+{"version":3,"file":"use-sticky-header.js","sourceRoot":"","sources":["../../../src/table/use-sticky-header.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAa,WAAW,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,eAAe,EAAE,EAAE,wBAAwB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE3F,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,QAAgC,EAChC,QAAgC,EAChC,iBAAyC,EACzC,iBAAyC,EACzC,eAAuC,EACvC,EAAE;IACF,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,qFAAqF;IACrF,MAAM,sBAAsB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9C,IACE,QAAQ,CAAC,OAAO;YAChB,QAAQ,CAAC,OAAO;YAChB,iBAAiB,CAAC,OAAO;YACzB,iBAAiB,CAAC,OAAO;YACzB,eAAe,CAAC,OAAO,EACvB;YACA,yFAAyF;YACzF,6FAA6F;YAC7F,uEAAuE;YACvE,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAAC;YAEnG,eAAe,CAAC,OAAO,CAAC,KAAK,CAAC,gBAAgB,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC;SAC1G;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;IAChF,eAAe,CAAC,GAAG,EAAE;QACnB,sBAAsB,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;IACH,iBAAiB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;IACpD,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,IAAI,eAAe,CAAC,OAAO,EAAE;YACzF,MAAM,UAAU,GAAG,wBAAwB,CAAC,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;YACzF,IAAI,UAAU,GAAG,CAAC,EAAE;gBAClB,UAAU,CAAC,UAAU,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;aACjD;SACF;IACH,CAAC,CAAC;IACF,MAAM,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC;IAC7E,MAAM,WAAW,GAAG,CAAC,QAA4B,EAAE,EAAE;QACnD,IAAI,CAAC,QAAQ,EAAE;YACb,YAAY,CAAC,QAAQ,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IACF,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC;AACtC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { RefObject, useCallback, useLayoutEffect } from 'react';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';\n\nexport const useStickyHeader = (\n  tableRef: RefObject<HTMLElement>,\n  theadRef: RefObject<HTMLElement>,\n  secondaryTheadRef: RefObject<HTMLElement>,\n  secondaryTableRef: RefObject<HTMLElement>,\n  tableWrapperRef: RefObject<HTMLElement>\n) => {\n  const isMobile = useMobile();\n  // Sync the sizes of the column header copies in the sticky header with the originals\n  const syncColumnHeaderWidths = useCallback(() => {\n    if (\n      tableRef.current &&\n      theadRef.current &&\n      secondaryTheadRef.current &&\n      secondaryTableRef.current &&\n      tableWrapperRef.current\n    ) {\n      // Using the tableRef getBoundingClientRect().width instead of the theadRef because in VR\n      // the tableRef adds extra padding to the table and by default the theadRef will have a width\n      // without the padding and will make the sticky header width incorrect.\n      secondaryTableRef.current.style.inlineSize = `${tableRef.current.getBoundingClientRect().width}px`;\n\n      tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.getBoundingClientRect().height}px`;\n    }\n  }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);\n  useLayoutEffect(() => {\n    syncColumnHeaderWidths();\n  });\n  useResizeObserver(theadRef, syncColumnHeaderWidths);\n  const scrollToTop = () => {\n    if (!isMobile && theadRef.current && secondaryTheadRef.current && tableWrapperRef.current) {\n      const scrollDist = calculateScrollingOffset(theadRef.current, secondaryTheadRef.current);\n      if (scrollDist > 0) {\n        scrollUpBy(scrollDist, tableWrapperRef.current);\n      }\n    }\n  };\n  const { scrollToItem } = stickyScrolling(tableWrapperRef, secondaryTheadRef);\n  const scrollToRow = (itemNode: HTMLElement | null) => {\n    if (!isMobile) {\n      scrollToItem(itemNode);\n    }\n  };\n  return { scrollToRow, scrollToTop };\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/components-themeable",
-  "version": "3.0.736",
+  "version": "3.0.738",
   "files": [
     "lib"
   ],