@cloudscape-design/components 3.0.333 → 3.0.335

package/internal/generated/theming/index.js

@@ -1628,7 +1628,7 @@ export var preset = {
         "light": "{colorBlue800}",
         "dark": "{colorWhite}"
       },
-      "fontBodyMLineHeight": "22px",
+      "fontBodyMLineHeight": "20px",
       "fontBodyMSize": "14px",
       "fontBodySLetterSpacing": "0.005em",
       "fontBodySLineHeight": "16px",
@@ -1898,8 +1898,8 @@ export var preset = {
         "compact": "40px"
       },
       "sizeVerticalInput": {
-        "comfortable": "34px",
-        "compact": "30px"
+        "comfortable": "32px",
+        "compact": "28px"
       },
       "sizeVerticalPanelIconOffset": {
         "comfortable": "15px",
@@ -1930,8 +1930,8 @@ export var preset = {
         "compact": "0px"
       },
       "spaceButtonIconOnlyHorizontal": {
-        "comfortable": "7px",
-        "compact": "5px"
+        "comfortable": "6px",
+        "compact": "{spaceXxs}"
       },
       "spaceButtonInlineIconFocusOutlineGutter": {
         "comfortable": "0px",
@@ -2033,6 +2033,10 @@ export var preset = {
         "comfortable": "{spaceContainerHorizontal}",
         "compact": "{spaceContainerHorizontal}"
       },
+      "spaceOptionIconBigTop": {
+        "comfortable": "0px",
+        "compact": "0px"
+      },
       "spacePanelNavLeft": {
         "comfortable": "28px",
         "compact": "28px"
@@ -2348,8 +2352,8 @@ export var preset = {
             "compact": "0px"
           },
           "spaceButtonIconOnlyHorizontal": {
-            "comfortable": "7px",
-            "compact": "5px"
+            "comfortable": "6px",
+            "compact": "{spaceXxs}"
           },
           "spaceButtonInlineIconFocusOutlineGutter": {
             "comfortable": "0px",
@@ -2451,6 +2455,10 @@ export var preset = {
             "comfortable": "{spaceContainerHorizontal}",
             "compact": "{spaceContainerHorizontal}"
           },
+          "spaceOptionIconBigTop": {
+            "comfortable": "0px",
+            "compact": "0px"
+          },
           "spacePanelNavLeft": {
             "comfortable": "28px",
             "compact": "28px"
@@ -2668,8 +2676,8 @@ export var preset = {
             "compact": "40px"
           },
           "sizeVerticalInput": {
-            "comfortable": "30px",
-            "compact": "30px"
+            "comfortable": "28px",
+            "compact": "28px"
           }
         }
       },
@@ -7878,6 +7886,7 @@ export var preset = {
       "spaceLayoutTogglePadding": "density",
       "spaceModalContentBottom": "density",
       "spaceModalHorizontal": "density",
+      "spaceOptionIconBigTop": "density",
       "spacePanelNavLeft": "density",
       "spacePanelSideLeft": "density",
       "spacePanelSideRight": "density",
@@ -9041,6 +9050,7 @@ export var preset = {
     "spaceLayoutTogglePadding": "space-layout-toggle-padding",
     "spaceModalContentBottom": "space-modal-content-bottom",
     "spaceModalHorizontal": "space-modal-horizontal",
+    "spaceOptionIconBigTop": "space-option-icon-big-top",
     "spacePanelNavLeft": "space-panel-nav-left",
     "spacePanelSideLeft": "space-panel-side-left",
     "spacePanelSideRight": "space-panel-side-right",
@@ -9545,7 +9555,7 @@ export var preset = {
     "colorDropzoneBackgroundHover": "--color-dropzone-background-hover-tz97i0",
     "colorDropzoneTextActive": "--color-dropzone-text-active-ixkxdz",
     "colorDropzoneTextHover": "--color-dropzone-text-hover-iptg3q",
-    "fontBodyMLineHeight": "--font-body-m-line-height-rfgrp9",
+    "fontBodyMLineHeight": "--font-body-m-line-height-ghizru",
     "fontBodyMSize": "--font-body-m-size-7dign1",
     "fontBodySLetterSpacing": "--font-body-s-letter-spacing-v8bwhi",
     "fontBodySLineHeight": "--font-body-s-line-height-ga8tt7",
@@ -9560,7 +9570,7 @@ export var preset = {
     "fontExpandableHeadingSize": "--font-expandable-heading-size-mkp9vq",
     "fontFamilyBase": "--font-family-base-wn913o",
     "fontFamilyMonospace": "--font-family-monospace-froq9j",
-    "fontHeaderH2DescriptionLineHeight": "--font-header-h2-description-line-height-pc00ga",
+    "fontHeaderH2DescriptionLineHeight": "--font-header-h2-description-line-height-9j5c3z",
     "fontHeaderH2DescriptionSize": "--font-header-h2-description-size-nsq214",
     "fontHeadingLLetterSpacing": "--font-heading-l-letter-spacing-usq225",
     "fontHeadingLLineHeight": "--font-heading-l-line-height-l1pmir",
@@ -9679,7 +9689,7 @@ export var preset = {
     "sizeIconMedium": "--size-icon-medium-x0iee8",
     "sizeIconNormal": "--size-icon-normal-jq6jat",
     "sizeTableSelectionHorizontal": "--size-table-selection-horizontal-jcyaue",
-    "sizeVerticalInput": "--size-vertical-input-u93i5u",
+    "sizeVerticalInput": "--size-vertical-input-pta06y",
     "sizeVerticalPanelIconOffset": "--size-vertical-panel-icon-offset-zd2rli",
     "spaceAlertActionLeft": "--space-alert-action-left-j65qap",
     "spaceAlertHorizontal": "--space-alert-horizontal-xg2h48",
@@ -9687,7 +9697,7 @@ export var preset = {
     "spaceAlertVertical": "--space-alert-vertical-83u3il",
     "spaceButtonFocusOutlineGutter": "--space-button-focus-outline-gutter-txnpcq",
     "spaceButtonIconFocusOutlineGutterVertical": "--space-button-icon-focus-outline-gutter-vertical-omhhky",
-    "spaceButtonIconOnlyHorizontal": "--space-button-icon-only-horizontal-fs1yp5",
+    "spaceButtonIconOnlyHorizontal": "--space-button-icon-only-horizontal-k5a18g",
     "spaceButtonInlineIconFocusOutlineGutter": "--space-button-inline-icon-focus-outline-gutter-0bswpj",
     "spaceButtonModalDismissVertical": "--space-button-modal-dismiss-vertical-tjnxlz",
     "spaceCalendarGridFocusOutlineGutter": "--space-calendar-grid-focus-outline-gutter-reev1c",
@@ -9713,6 +9723,7 @@ export var preset = {
     "spaceLayoutTogglePadding": "--space-layout-toggle-padding-dhzjwp",
     "spaceModalContentBottom": "--space-modal-content-bottom-4lprrr",
     "spaceModalHorizontal": "--space-modal-horizontal-rzqrfo",
+    "spaceOptionIconBigTop": "--space-option-icon-big-top-lfkz5s",
     "spacePanelNavLeft": "--space-panel-nav-left-kdx5qt",
     "spacePanelSideLeft": "--space-panel-side-left-ob0rxs",
     "spacePanelSideRight": "--space-panel-side-right-zzgkuy",

package/internal/hooks/container-queries/index.d.ts

@@ -1,5 +1,3 @@
-export { ContainerQueryEntry } from './interfaces';
-export * from './use-container-query';
 export * from './use-container-breakpoints';
 export * from './use-resize-observer';
 //# sourceMappingURL=index.d.ts.map

package/internal/hooks/container-queries/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACnD,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/index.ts"],"names":[],"mappings":"AAGA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC"}

package/internal/hooks/container-queries/index.js

@@ -1,4 +1,5 @@
-export * from './use-container-query';
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
 export * from './use-container-breakpoints';
 export * from './use-resize-observer';
 //# sourceMappingURL=index.js.map

package/internal/hooks/container-queries/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/index.ts"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nexport { ContainerQueryEntry } from './interfaces';\nexport * from './use-container-query';\nexport * from './use-container-breakpoints';\nexport * from './use-resize-observer';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport * from './use-container-breakpoints';\nexport * from './use-resize-observer';\n"]}

package/internal/hooks/container-queries/use-container-breakpoints.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-container-breakpoints.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-container-breakpoints.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAyB,MAAM,mBAAmB,CAAC;AAEtE;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CAAC,CAAC,SAAS,SAAS,UAAU,EAAE,EACrE,QAAQ,CAAC,EAAE,CAAC,GACX,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,SAAS,GAAG,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAKhD"}
+{"version":3,"file":"use-container-breakpoints.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-container-breakpoints.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAyB,MAAM,mBAAmB,CAAC;AAGtE;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CAAC,CAAC,SAAS,SAAS,UAAU,EAAE,EACrE,QAAQ,CAAC,EAAE,CAAC,GACX,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,SAAS,GAAG,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAKhD"}

package/internal/hooks/container-queries/use-container-breakpoints.js

@@ -1,5 +1,5 @@
-import { useContainerQuery } from './use-container-query';
 import { getMatchingBreakpoint } from '../../breakpoints';
+import { useContainerQuery } from '@cloudscape-design/component-toolkit';
 /**
  * Re-renders the component when the breakpoint for the component changes. Scopes the re-renders to the specific
  * breakpoints you want to break at. "default" is always included as a fallback, so ["xs"] would trigger for
@@ -11,6 +11,6 @@ export function useContainerBreakpoints(triggers) {
     // triggers.join() gives us a stable value to use for the dependencies argument
     const triggersDep = triggers === null || triggers === void 0 ? void 0 : triggers.join();
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    return useContainerQuery(rect => getMatchingBreakpoint(rect.width, triggers), [triggersDep]);
+    return useContainerQuery(rect => getMatchingBreakpoint(rect.contentBoxWidth, triggers), [triggersDep]);
 }
 //# sourceMappingURL=use-container-breakpoints.js.map

package/internal/hooks/container-queries/use-container-breakpoints.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-container-breakpoints.js","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-container-breakpoints.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAc,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEtE;;;;;;GAMG;AACH,MAAM,UAAU,uBAAuB,CACrC,QAAY;IAEZ,+EAA+E;IAC/E,MAAM,WAAW,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,EAAE,CAAC;IACrC,uDAAuD;IACvD,OAAO,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,qBAAqB,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;AAC/F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { useContainerQuery } from './use-container-query';\nimport { Breakpoint, getMatchingBreakpoint } from '../../breakpoints';\n\n/**\n * Re-renders the component when the breakpoint for the component changes. Scopes the re-renders to the specific\n * breakpoints you want to break at. \"default\" is always included as a fallback, so [\"xs\"] would trigger for\n * \"default\" and \"xs\".\n *\n * @param triggers The relevant breakpoints to trigger for.\n */\nexport function useContainerBreakpoints<T extends readonly Breakpoint[]>(\n  triggers?: T\n): [T[number] | 'default' | null, React.Ref<any>] {\n  // triggers.join() gives us a stable value to use for the dependencies argument\n  const triggersDep = triggers?.join();\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useContainerQuery(rect => getMatchingBreakpoint(rect.width, triggers), [triggersDep]);\n}\n"]}
+{"version":3,"file":"use-container-breakpoints.js","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-container-breakpoints.ts"],"names":[],"mappings":"AAGA,OAAO,EAAc,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAEzE;;;;;;GAMG;AACH,MAAM,UAAU,uBAAuB,CACrC,QAAY;IAEZ,+EAA+E;IAC/E,MAAM,WAAW,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,EAAE,CAAC;IACrC,uDAAuD;IACvD,OAAO,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,qBAAqB,CAAC,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;AACzG,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { Breakpoint, getMatchingBreakpoint } from '../../breakpoints';\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\n/**\n * Re-renders the component when the breakpoint for the component changes. Scopes the re-renders to the specific\n * breakpoints you want to break at. \"default\" is always included as a fallback, so [\"xs\"] would trigger for\n * \"default\" and \"xs\".\n *\n * @param triggers The relevant breakpoints to trigger for.\n */\nexport function useContainerBreakpoints<T extends readonly Breakpoint[]>(\n  triggers?: T\n): [T[number] | 'default' | null, React.Ref<any>] {\n  // triggers.join() gives us a stable value to use for the dependencies argument\n  const triggersDep = triggers?.join();\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useContainerQuery(rect => getMatchingBreakpoint(rect.contentBoxWidth, triggers), [triggersDep]);\n}\n"]}

package/internal/hooks/container-queries/use-resize-observer.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ContainerQueryEntry } from './interfaces';
+import { ContainerQueryEntry } from '@cloudscape-design/component-toolkit';
 type ElementReference = (() => Element | null) | React.RefObject<Element>;
 /**
  * Attaches resize-observer to the referenced element.

package/internal/hooks/container-queries/use-resize-observer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-resize-observer.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-resize-observer.ts"],"names":[],"mappings":"AAGA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAEnD,KAAK,gBAAgB,GAAG,CAAC,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AAE1E;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,gBAAgB,EAAE,SAAS,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,QAmC9G"}
+{"version":3,"file":"use-resize-observer.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-resize-observer.ts"],"names":[],"mappings":"AAGA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAE3E,KAAK,gBAAgB,GAAG,CAAC,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AAE1E;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,gBAAgB,EAAE,SAAS,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,QAmC9G"}

package/internal/hooks/container-queries/use-resize-observer.js

@@ -57,8 +57,6 @@ function convertResizeObserverEntry(entry) {
         contentBoxHeight: entry.contentBoxSize[0].blockSize,
         borderBoxWidth: entry.borderBoxSize[0].inlineSize,
         borderBoxHeight: entry.borderBoxSize[0].blockSize,
-        width: entry.contentBoxSize[0].inlineSize,
-        height: entry.contentBoxSize[0].blockSize,
     };
 }
 //# sourceMappingURL=use-resize-observer.js.map

package/internal/hooks/container-queries/use-resize-observer.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-resize-observer.js","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-resize-observer.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9E,OAAc,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAKpE;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,iBAAiB,CAAC,UAA4B,EAAE,SAA+C;IAC7G,MAAM,eAAe,GAAG,qBAAqB,CAAC,SAAS,CAAC,CAAC;IAEzD,qIAAqI;IACrI,+GAA+G;IAC/G,iIAAiI;IACjI,eAAe,CACb,GAAG,EAAE;QACH,MAAM,OAAO,GAAG,OAAO,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO,CAAC;QACtF,IAAI,OAAO,EAAE;YACX,SAAS,CAAC,0BAA0B,CAAC,IAAI,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;SACzE;IACH,CAAC;IACD,mFAAmF;IACnF,uDAAuD;IACvD,EAAE,CACH,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,OAAO,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO,CAAC;QACtF,IAAI,OAAO,EAAE;YACX,IAAI,SAAS,GAAG,IAAI,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;gBAC5C,gEAAgE;gBAChE,IAAI,SAAS,EAAE;oBACb,eAAe,CAAC,0BAA0B,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBACzD;YACH,CAAC,CAAC,CAAC;YACH,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YAC1B,OAAO,GAAG,EAAE;gBACV,SAAS,GAAG,KAAK,CAAC;gBAClB,QAAQ,CAAC,UAAU,EAAE,CAAC;YACxB,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,eAAe,CAAC,CAAC,CAAC;AACpC,CAAC;AAED,SAAS,0BAA0B,CAAC,KAA0B;IAC5D,OAAO;QACL,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,eAAe,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,UAAU;QACnD,gBAAgB,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,SAAS;QACnD,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,UAAU;QACjD,eAAe,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,SAAS;QACjD,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,UAAU;QACzC,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,SAAS;KAC1C,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ResizeObserver, ResizeObserverEntry } from '@juggle/resize-observer';\nimport React, { useEffect, useLayoutEffect } from 'react';\nimport { useStableEventHandler } from '../use-stable-event-handler';\nimport { ContainerQueryEntry } from './interfaces';\n\ntype ElementReference = (() => Element | null) | React.RefObject<Element>;\n\n/**\n * Attaches resize-observer to the referenced element.\n *\n * Examples:\n *     // With React reference\n *     const ref = useRef(null)\n *     useResizeObserver(ref, (entry) => setState(getWidth(entry)))\n *\n *     // With ID reference\n *     const getElement = useCallback(() => document.getElementById(id), [id])\n *     useResizeObserver(getElement, (entry) => setState(getWidth(entry)))\n *\n * @param elementRef React reference or memoized getter for the target element\n * @param onObserve Function to fire when observation occurs\n */\nexport function useResizeObserver(elementRef: ElementReference, onObserve: (entry: ContainerQueryEntry) => void) {\n  const stableOnObserve = useStableEventHandler(onObserve);\n\n  // This effect provides a synchronous update required to prevent flakiness when initial state and first observed state are different.\n  // Can potentially conflict with React concurrent mode: https://17.reactjs.org/docs/concurrent-mode-intro.html.\n  // A possible solution would be to make consumers not render any content until the first (asynchronous) observation is available.\n  useLayoutEffect(\n    () => {\n      const element = typeof elementRef === 'function' ? elementRef() : elementRef?.current;\n      if (element) {\n        onObserve(convertResizeObserverEntry(new ResizeObserverEntry(element)));\n      }\n    },\n    // This effect is only needed for the first render to provide a synchronous update.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    []\n  );\n\n  useEffect(() => {\n    const element = typeof elementRef === 'function' ? elementRef() : elementRef?.current;\n    if (element) {\n      let connected = true;\n      const observer = new ResizeObserver(entries => {\n        // Prevent observe notifications on already unmounted component.\n        if (connected) {\n          stableOnObserve(convertResizeObserverEntry(entries[0]));\n        }\n      });\n      observer.observe(element);\n      return () => {\n        connected = false;\n        observer.disconnect();\n      };\n    }\n  }, [elementRef, stableOnObserve]);\n}\n\nfunction convertResizeObserverEntry(entry: ResizeObserverEntry): ContainerQueryEntry {\n  return {\n    target: entry.target,\n    contentBoxWidth: entry.contentBoxSize[0].inlineSize,\n    contentBoxHeight: entry.contentBoxSize[0].blockSize,\n    borderBoxWidth: entry.borderBoxSize[0].inlineSize,\n    borderBoxHeight: entry.borderBoxSize[0].blockSize,\n    width: entry.contentBoxSize[0].inlineSize,\n    height: entry.contentBoxSize[0].blockSize,\n  };\n}\n"]}
+{"version":3,"file":"use-resize-observer.js","sourceRoot":"lib/default/","sources":["internal/hooks/container-queries/use-resize-observer.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9E,OAAc,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAKpE;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,iBAAiB,CAAC,UAA4B,EAAE,SAA+C;IAC7G,MAAM,eAAe,GAAG,qBAAqB,CAAC,SAAS,CAAC,CAAC;IAEzD,qIAAqI;IACrI,+GAA+G;IAC/G,iIAAiI;IACjI,eAAe,CACb,GAAG,EAAE;QACH,MAAM,OAAO,GAAG,OAAO,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO,CAAC;QACtF,IAAI,OAAO,EAAE;YACX,SAAS,CAAC,0BAA0B,CAAC,IAAI,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;SACzE;IACH,CAAC;IACD,mFAAmF;IACnF,uDAAuD;IACvD,EAAE,CACH,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,OAAO,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO,CAAC;QACtF,IAAI,OAAO,EAAE;YACX,IAAI,SAAS,GAAG,IAAI,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;gBAC5C,gEAAgE;gBAChE,IAAI,SAAS,EAAE;oBACb,eAAe,CAAC,0BAA0B,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBACzD;YACH,CAAC,CAAC,CAAC;YACH,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YAC1B,OAAO,GAAG,EAAE;gBACV,SAAS,GAAG,KAAK,CAAC;gBAClB,QAAQ,CAAC,UAAU,EAAE,CAAC;YACxB,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,eAAe,CAAC,CAAC,CAAC;AACpC,CAAC;AAED,SAAS,0BAA0B,CAAC,KAA0B;IAC5D,OAAO;QACL,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,eAAe,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,UAAU;QACnD,gBAAgB,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,SAAS;QACnD,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,UAAU;QACjD,eAAe,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,SAAS;KAClD,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ResizeObserver, ResizeObserverEntry } from '@juggle/resize-observer';\nimport React, { useEffect, useLayoutEffect } from 'react';\nimport { useStableEventHandler } from '../use-stable-event-handler';\nimport { ContainerQueryEntry } from '@cloudscape-design/component-toolkit';\n\ntype ElementReference = (() => Element | null) | React.RefObject<Element>;\n\n/**\n * Attaches resize-observer to the referenced element.\n *\n * Examples:\n *     // With React reference\n *     const ref = useRef(null)\n *     useResizeObserver(ref, (entry) => setState(getWidth(entry)))\n *\n *     // With ID reference\n *     const getElement = useCallback(() => document.getElementById(id), [id])\n *     useResizeObserver(getElement, (entry) => setState(getWidth(entry)))\n *\n * @param elementRef React reference or memoized getter for the target element\n * @param onObserve Function to fire when observation occurs\n */\nexport function useResizeObserver(elementRef: ElementReference, onObserve: (entry: ContainerQueryEntry) => void) {\n  const stableOnObserve = useStableEventHandler(onObserve);\n\n  // This effect provides a synchronous update required to prevent flakiness when initial state and first observed state are different.\n  // Can potentially conflict with React concurrent mode: https://17.reactjs.org/docs/concurrent-mode-intro.html.\n  // A possible solution would be to make consumers not render any content until the first (asynchronous) observation is available.\n  useLayoutEffect(\n    () => {\n      const element = typeof elementRef === 'function' ? elementRef() : elementRef?.current;\n      if (element) {\n        onObserve(convertResizeObserverEntry(new ResizeObserverEntry(element)));\n      }\n    },\n    // This effect is only needed for the first render to provide a synchronous update.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    []\n  );\n\n  useEffect(() => {\n    const element = typeof elementRef === 'function' ? elementRef() : elementRef?.current;\n    if (element) {\n      let connected = true;\n      const observer = new ResizeObserver(entries => {\n        // Prevent observe notifications on already unmounted component.\n        if (connected) {\n          stableOnObserve(convertResizeObserverEntry(entries[0]));\n        }\n      });\n      observer.observe(element);\n      return () => {\n        connected = false;\n        observer.disconnect();\n      };\n    }\n  }, [elementRef, stableOnObserve]);\n}\n\nfunction convertResizeObserverEntry(entry: ResizeObserverEntry): ContainerQueryEntry {\n  return {\n    target: entry.target,\n    contentBoxWidth: entry.contentBoxSize[0].inlineSize,\n    contentBoxHeight: entry.contentBoxSize[0].blockSize,\n    borderBoxWidth: entry.borderBoxSize[0].inlineSize,\n    borderBoxHeight: entry.borderBoxSize[0].blockSize,\n  };\n}\n"]}

package/internal/hooks/use-dynamic-overlap/index.js

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 import { useContext, useLayoutEffect } from 'react';
 import { DynamicOverlapContext } from '../../context/dynamic-overlap-context';
-import { useContainerQuery } from '../container-queries';
+import { useContainerQuery } from '@cloudscape-design/component-toolkit';
 /**
  * Observes the height of an element referenced by the returning ref and sets the value as overlapping
  * height for the surrounding AppLayout component.
@@ -13,7 +13,7 @@ export function useDynamicOverlap(props) {
     var _a;
     const disabled = (_a = props === null || props === void 0 ? void 0 : props.disabled) !== null && _a !== void 0 ? _a : false;
     const setDynamicOverlapHeight = useContext(DynamicOverlapContext);
-    const [overlapHeight, overlapElementRef] = useContainerQuery(rect => rect.height);
+    const [overlapHeight, overlapElementRef] = useContainerQuery(rect => rect.contentBoxHeight);
     useLayoutEffect(function handleDynamicOverlapHeight() {
         if (!disabled) {
             setDynamicOverlapHeight(overlapHeight !== null && overlapHeight !== void 0 ? overlapHeight : 0);

package/internal/hooks/use-dynamic-overlap/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-dynamic-overlap/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,uCAAuC,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AASzD;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB,CAAC,KAA8B;;IAC9D,MAAM,QAAQ,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,mCAAI,KAAK,CAAC;IAC1C,MAAM,uBAAuB,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAC;IAClE,MAAM,CAAC,aAAa,EAAE,iBAAiB,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAElF,eAAe,CACb,SAAS,0BAA0B;QACjC,IAAI,CAAC,QAAQ,EAAE;YACb,uBAAuB,CAAC,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,CAAC,CAAC,CAAC;SAC7C;QAED,OAAO,GAAG,EAAE;YACV,IAAI,CAAC,QAAQ,EAAE;gBACb,uBAAuB,CAAC,CAAC,CAAC,CAAC;aAC5B;QACH,CAAC,CAAC;IACJ,CAAC,EACD,CAAC,QAAQ,EAAE,aAAa,EAAE,uBAAuB,CAAC,CACnD,CAAC;IAEF,OAAO,iBAAiB,CAAC;AAC3B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useContext, useLayoutEffect } from 'react';\n\nimport { DynamicOverlapContext } from '../../context/dynamic-overlap-context';\nimport { useContainerQuery } from '../container-queries';\n\nexport interface UseDynamicOverlapProps {\n  /**\n   * Disables hook if not needed. By default, `false`.\n   */\n  disabled?: boolean;\n}\n\n/**\n * Observes the height of an element referenced by the returning ref and sets the value as overlapping\n * height for the surrounding AppLayout component.\n * @param props.disabled disables hook if not applicable\n * @returns ref to be measured as overlapping height\n */\nexport function useDynamicOverlap(props?: UseDynamicOverlapProps) {\n  const disabled = props?.disabled ?? false;\n  const setDynamicOverlapHeight = useContext(DynamicOverlapContext);\n  const [overlapHeight, overlapElementRef] = useContainerQuery(rect => rect.height);\n\n  useLayoutEffect(\n    function handleDynamicOverlapHeight() {\n      if (!disabled) {\n        setDynamicOverlapHeight(overlapHeight ?? 0);\n      }\n\n      return () => {\n        if (!disabled) {\n          setDynamicOverlapHeight(0);\n        }\n      };\n    },\n    [disabled, overlapHeight, setDynamicOverlapHeight]\n  );\n\n  return overlapElementRef;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-dynamic-overlap/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,uCAAuC,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AASzE;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB,CAAC,KAA8B;;IAC9D,MAAM,QAAQ,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,mCAAI,KAAK,CAAC;IAC1C,MAAM,uBAAuB,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAC;IAClE,MAAM,CAAC,aAAa,EAAE,iBAAiB,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAE5F,eAAe,CACb,SAAS,0BAA0B;QACjC,IAAI,CAAC,QAAQ,EAAE;YACb,uBAAuB,CAAC,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,CAAC,CAAC,CAAC;SAC7C;QAED,OAAO,GAAG,EAAE;YACV,IAAI,CAAC,QAAQ,EAAE;gBACb,uBAAuB,CAAC,CAAC,CAAC,CAAC;aAC5B;QACH,CAAC,CAAC;IACJ,CAAC,EACD,CAAC,QAAQ,EAAE,aAAa,EAAE,uBAAuB,CAAC,CACnD,CAAC;IAEF,OAAO,iBAAiB,CAAC;AAC3B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useContext, useLayoutEffect } from 'react';\n\nimport { DynamicOverlapContext } from '../../context/dynamic-overlap-context';\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nexport interface UseDynamicOverlapProps {\n  /**\n   * Disables hook if not needed. By default, `false`.\n   */\n  disabled?: boolean;\n}\n\n/**\n * Observes the height of an element referenced by the returning ref and sets the value as overlapping\n * height for the surrounding AppLayout component.\n * @param props.disabled disables hook if not applicable\n * @returns ref to be measured as overlapping height\n */\nexport function useDynamicOverlap(props?: UseDynamicOverlapProps) {\n  const disabled = props?.disabled ?? false;\n  const setDynamicOverlapHeight = useContext(DynamicOverlapContext);\n  const [overlapHeight, overlapElementRef] = useContainerQuery(rect => rect.contentBoxHeight);\n\n  useLayoutEffect(\n    function handleDynamicOverlapHeight() {\n      if (!disabled) {\n        setDynamicOverlapHeight(overlapHeight ?? 0);\n      }\n\n      return () => {\n        if (!disabled) {\n          setDynamicOverlapHeight(0);\n        }\n      };\n    },\n    [disabled, overlapHeight, setDynamicOverlapHeight]\n  );\n\n  return overlapElementRef;\n}\n"]}

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "3e5f509722e3ee7282527ea5e83f9555c21657e6"
+  "commit": "abfb46343bce81c5b7b2794794646325caaf909a"
 }

package/internal/utils/use-container-width.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-container-width.d.ts","sourceRoot":"lib/default/","sources":["internal/utils/use-container-width.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,YAAY,SAAI,EAChB,SAAS,SAAI,GACZ,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CASjD"}
+{"version":3,"file":"use-container-width.d.ts","sourceRoot":"lib/default/","sources":["internal/utils/use-container-width.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,YAAY,SAAI,EAChB,SAAS,SAAI,GACZ,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CASjD"}

package/internal/utils/use-container-width.js

@@ -1,10 +1,12 @@
-import { useContainerQuery } from '../hooks/container-queries';
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { useContainerQuery } from '@cloudscape-design/component-toolkit';
 export default function useContainerWidth(defaultValue = 0, threshold = 1) {
     const [width, ref] = useContainerQuery((rect, prev) => {
         if (prev === null) {
-            return rect.width;
+            return rect.contentBoxWidth;
         }
-        return Math.abs(prev - rect.width) >= threshold ? rect.width : prev;
+        return Math.abs(prev - rect.contentBoxWidth) >= threshold ? rect.contentBoxWidth : prev;
     });
     return [width !== null && width !== void 0 ? width : defaultValue, ref];
 }

package/internal/utils/use-container-width.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-container-width.js","sourceRoot":"lib/default/","sources":["internal/utils/use-container-width.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAE/D,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,YAAY,GAAG,CAAC,EAChB,SAAS,GAAG,CAAC;IAEb,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,iBAAiB,CAAS,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;QAC5D,IAAI,IAAI,KAAK,IAAI,EAAE;YACjB,OAAO,IAAI,CAAC,KAAK,CAAC;SACnB;QACD,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IACtE,CAAC,CAAC,CAAC;IAEH,OAAO,CAAC,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,YAAY,EAAE,GAAG,CAAC,CAAC;AACtC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { useContainerQuery } from '../hooks/container-queries';\n\nexport default function useContainerWidth(\n  defaultValue = 0,\n  threshold = 1\n): [width: number, ref: React.Ref<HTMLDivElement>] {\n  const [width, ref] = useContainerQuery<number>((rect, prev) => {\n    if (prev === null) {\n      return rect.width;\n    }\n    return Math.abs(prev - rect.width) >= threshold ? rect.width : prev;\n  });\n\n  return [width ?? defaultValue, ref];\n}\n"]}
+{"version":3,"file":"use-container-width.js","sourceRoot":"lib/default/","sources":["internal/utils/use-container-width.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAGzE,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,YAAY,GAAG,CAAC,EAChB,SAAS,GAAG,CAAC;IAEb,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,iBAAiB,CAAS,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;QAC5D,IAAI,IAAI,KAAK,IAAI,EAAE;YACjB,OAAO,IAAI,CAAC,eAAe,CAAC;SAC7B;QACD,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC;IAC1F,CAAC,CAAC,CAAC;IAEH,OAAO,CAAC,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,YAAY,EAAE,GAAG,CAAC,CAAC;AACtC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport React from 'react';\n\nexport default function useContainerWidth(\n  defaultValue = 0,\n  threshold = 1\n): [width: number, ref: React.Ref<HTMLDivElement>] {\n  const [width, ref] = useContainerQuery<number>((rect, prev) => {\n    if (prev === null) {\n      return rect.contentBoxWidth;\n    }\n    return Math.abs(prev - rect.contentBoxWidth) >= threshold ? rect.contentBoxWidth : prev;\n  });\n\n  return [width ?? defaultValue, ref];\n}\n"]}

package/link/styles.css.js

@@ -1,25 +1,25 @@
 
     import './styles.scoped.css';
     export default {
-  "link": "awsui_link_4c84z_15goh_93",
-  "variant-secondary": "awsui_variant-secondary_4c84z_15goh_140",
-  "variant-primary": "awsui_variant-primary_4c84z_15goh_177",
-  "variant-info": "awsui_variant-info_4c84z_15goh_212",
-  "variant-value-large": "awsui_variant-value-large_4c84z_15goh_249",
-  "variant-top-navigation": "awsui_variant-top-navigation_4c84z_15goh_283",
-  "variant-recovery": "awsui_variant-recovery_4c84z_15goh_318",
-  "button": "awsui_button_4c84z_15goh_353",
-  "color-inverted": "awsui_color-inverted_4c84z_15goh_390",
-  "font-size-body-s": "awsui_font-size-body-s_4c84z_15goh_409",
-  "font-size-body-m": "awsui_font-size-body-m_4c84z_15goh_414",
-  "font-size-heading-xs": "awsui_font-size-heading-xs_4c84z_15goh_418",
-  "font-size-heading-s": "awsui_font-size-heading-s_4c84z_15goh_422",
-  "font-size-heading-m": "awsui_font-size-heading-m_4c84z_15goh_427",
-  "font-size-heading-l": "awsui_font-size-heading-l_4c84z_15goh_432",
-  "font-size-heading-xl": "awsui_font-size-heading-xl_4c84z_15goh_437",
-  "font-size-display-l": "awsui_font-size-display-l_4c84z_15goh_442",
-  "font-size-inherit": "awsui_font-size-inherit_4c84z_15goh_447",
-  "icon-wrapper": "awsui_icon-wrapper_4c84z_15goh_453",
-  "icon": "awsui_icon_4c84z_15goh_453"
+  "link": "awsui_link_4c84z_1saw7_93",
+  "variant-secondary": "awsui_variant-secondary_4c84z_1saw7_140",
+  "variant-primary": "awsui_variant-primary_4c84z_1saw7_177",
+  "variant-info": "awsui_variant-info_4c84z_1saw7_212",
+  "variant-value-large": "awsui_variant-value-large_4c84z_1saw7_249",
+  "variant-top-navigation": "awsui_variant-top-navigation_4c84z_1saw7_283",
+  "variant-recovery": "awsui_variant-recovery_4c84z_1saw7_318",
+  "button": "awsui_button_4c84z_1saw7_353",
+  "color-inverted": "awsui_color-inverted_4c84z_1saw7_390",
+  "font-size-body-s": "awsui_font-size-body-s_4c84z_1saw7_409",
+  "font-size-body-m": "awsui_font-size-body-m_4c84z_1saw7_414",
+  "font-size-heading-xs": "awsui_font-size-heading-xs_4c84z_1saw7_418",
+  "font-size-heading-s": "awsui_font-size-heading-s_4c84z_1saw7_422",
+  "font-size-heading-m": "awsui_font-size-heading-m_4c84z_1saw7_427",
+  "font-size-heading-l": "awsui_font-size-heading-l_4c84z_1saw7_432",
+  "font-size-heading-xl": "awsui_font-size-heading-xl_4c84z_1saw7_437",
+  "font-size-display-l": "awsui_font-size-display-l_4c84z_1saw7_442",
+  "font-size-inherit": "awsui_font-size-inherit_4c84z_1saw7_447",
+  "icon-wrapper": "awsui_icon-wrapper_4c84z_1saw7_453",
+  "icon": "awsui_icon_4c84z_1saw7_453"
 };