@cloudscape-design/components 3.0.637 → 3.0.638

package/internal/generated/theming/index.cjs

@@ -2147,6 +2147,10 @@ module.exports.preset = {
         "comfortable": "{spaceScaledL}",
         "compact": "{spaceScaledL}"
       },
+      "spacePanelSplitBottom": {
+        "comfortable": "{spaceScaledL}",
+        "compact": "{spaceScaledL}"
+      },
       "spaceSegmentedControlFocusOutlineGutter": {
         "comfortable": "4px",
         "compact": "4px"
@@ -2609,6 +2613,10 @@ module.exports.preset = {
             "comfortable": "{spaceScaledL}",
             "compact": "{spaceScaledL}"
           },
+          "spacePanelSplitBottom": {
+            "comfortable": "{spaceScaledL}",
+            "compact": "{spaceScaledL}"
+          },
           "spaceSegmentedControlFocusOutlineGutter": {
             "comfortable": "4px",
             "compact": "4px"
@@ -9271,6 +9279,7 @@ module.exports.preset = {
       "spacePanelSideLeft": "density",
       "spacePanelSideRight": "density",
       "spacePanelSplitTop": "density",
+      "spacePanelSplitBottom": "density",
       "spaceSegmentedControlFocusOutlineGutter": "density",
       "spaceTabsContentTop": "density",
       "spaceTabsFocusOutlineGutter": "density",
@@ -10542,6 +10551,7 @@ module.exports.preset = {
     "spacePanelSideLeft": "space-panel-side-left",
     "spacePanelSideRight": "space-panel-side-right",
     "spacePanelSplitTop": "space-panel-split-top",
+    "spacePanelSplitBottom": "space-panel-split-bottom",
     "spaceSegmentedControlFocusOutlineGutter": "space-segmented-control-focus-outline-gutter",
     "spaceTabsContentTop": "space-tabs-content-top",
     "spaceTabsFocusOutlineGutter": "space-tabs-focus-outline-gutter",
@@ -11243,6 +11253,7 @@ module.exports.preset = {
     "spacePanelSideLeft": "--space-panel-side-left-5t0who",
     "spacePanelSideRight": "--space-panel-side-right-xofg51",
     "spacePanelSplitTop": "--space-panel-split-top-q1pux4",
+    "spacePanelSplitBottom": "--space-panel-split-bottom-qwdduf",
     "spaceSegmentedControlFocusOutlineGutter": "--space-segmented-control-focus-outline-gutter-gbye20",
     "spaceTabsContentTop": "--space-tabs-content-top-dedu0k",
     "spaceTabsFocusOutlineGutter": "--space-tabs-focus-outline-gutter-xm37ly",

package/internal/generated/theming/index.js

@@ -2147,6 +2147,10 @@ export var preset = {
         "comfortable": "{spaceScaledL}",
         "compact": "{spaceScaledL}"
       },
+      "spacePanelSplitBottom": {
+        "comfortable": "{spaceScaledL}",
+        "compact": "{spaceScaledL}"
+      },
       "spaceSegmentedControlFocusOutlineGutter": {
         "comfortable": "4px",
         "compact": "4px"
@@ -2609,6 +2613,10 @@ export var preset = {
             "comfortable": "{spaceScaledL}",
             "compact": "{spaceScaledL}"
           },
+          "spacePanelSplitBottom": {
+            "comfortable": "{spaceScaledL}",
+            "compact": "{spaceScaledL}"
+          },
           "spaceSegmentedControlFocusOutlineGutter": {
             "comfortable": "4px",
             "compact": "4px"
@@ -9271,6 +9279,7 @@ export var preset = {
       "spacePanelSideLeft": "density",
       "spacePanelSideRight": "density",
       "spacePanelSplitTop": "density",
+      "spacePanelSplitBottom": "density",
       "spaceSegmentedControlFocusOutlineGutter": "density",
       "spaceTabsContentTop": "density",
       "spaceTabsFocusOutlineGutter": "density",
@@ -10542,6 +10551,7 @@ export var preset = {
     "spacePanelSideLeft": "space-panel-side-left",
     "spacePanelSideRight": "space-panel-side-right",
     "spacePanelSplitTop": "space-panel-split-top",
+    "spacePanelSplitBottom": "space-panel-split-bottom",
     "spaceSegmentedControlFocusOutlineGutter": "space-segmented-control-focus-outline-gutter",
     "spaceTabsContentTop": "space-tabs-content-top",
     "spaceTabsFocusOutlineGutter": "space-tabs-focus-outline-gutter",
@@ -11243,6 +11253,7 @@ export var preset = {
     "spacePanelSideLeft": "--space-panel-side-left-5t0who",
     "spacePanelSideRight": "--space-panel-side-right-xofg51",
     "spacePanelSplitTop": "--space-panel-split-top-q1pux4",
+    "spacePanelSplitBottom": "--space-panel-split-bottom-qwdduf",
     "spaceSegmentedControlFocusOutlineGutter": "--space-segmented-control-focus-outline-gutter-gbye20",
     "spaceTabsContentTop": "--space-tabs-content-top-dedu0k",
     "spaceTabsFocusOutlineGutter": "--space-tabs-focus-outline-gutter-xm37ly",

package/internal/hooks/use-performance-marks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-performance-marks.d.ts","sourceRoot":"","sources":["../../../../src/internal/hooks/use-performance-marks.ts"],"names":[],"mappings":";AAOA,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EACxC,UAAU,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC,EACvE,YAAY,EAAE,KAAK,CAAC,cAAc,QAsDnC"}
+{"version":3,"file":"use-performance-marks.d.ts","sourceRoot":"","sources":["../../../../src/internal/hooks/use-performance-marks.ts"],"names":[],"mappings":";AAQA,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EACxC,UAAU,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC,EACvE,YAAY,EAAE,KAAK,CAAC,cAAc,QAuDnC"}

package/internal/hooks/use-performance-marks.js

@@ -3,10 +3,12 @@
 import { useEffect } from 'react';
 import { useUniqueId } from './use-unique-id';
 import { useEffectOnUpdate } from './use-effect-on-update';
+import { useModalContext } from '../context/modal-context';
 export function usePerformanceMarks(name, enabled, elementRef, getDetails, dependencies) {
     const id = useUniqueId();
+    const { isInModal } = useModalContext();
     useEffect(() => {
-        if (!enabled || !elementRef.current) {
+        if (!enabled || !elementRef.current || isInModal) {
             return;
         }
         const elementVisible = elementRef.current.offsetWidth > 0 &&
@@ -22,7 +24,7 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
     useEffectOnUpdate(() => {
-        if (!enabled || !elementRef.current) {
+        if (!enabled || !elementRef.current || isInModal) {
             return;
         }
         const elementVisible = elementRef.current.offsetWidth > 0 &&

package/internal/hooks/use-performance-marks.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-performance-marks.js","sourceRoot":"","sources":["../../../../src/internal/hooks/use-performance-marks.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,MAAM,UAAU,mBAAmB,CACjC,IAAY,EACZ,OAAgB,EAChB,UAAwC,EACxC,UAAuE,EACvE,YAAkC;IAElC,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE;YACnC,OAAO;SACR;QAED,MAAM,cAAc,GAClB,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC;YAClC,UAAU,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC;YACnC,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,UAAU,KAAK,QAAQ,CAAC;QAE/D,IAAI,CAAC,cAAc,EAAE;YACnB,OAAO;SACR;QAED,MAAM,gBAAgB,GAAG,GAAG,IAAI,UAAU,CAAC;QAE3C,WAAW,CAAC,IAAI,CAAC,gBAAgB,EAAE;YACjC,MAAM,kBACJ,MAAM,EAAE,OAAO,EACf,kBAAkB,EAAE,EAAE,IACnB,UAAU,EAAE,CAChB;SACF,CAAC,CAAC;QACH,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,iBAAiB,CAAC,GAAG,EAAE;QACrB,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE;YACnC,OAAO;SACR;QACD,MAAM,cAAc,GAClB,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC;YAClC,UAAU,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC;YACnC,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,UAAU,KAAK,QAAQ,CAAC;QAE/D,IAAI,CAAC,cAAc,EAAE;YACnB,OAAO;SACR;QAED,MAAM,eAAe,GAAG,GAAG,IAAI,SAAS,CAAC;QAEzC,WAAW,CAAC,IAAI,CAAC,eAAe,EAAE;YAChC,MAAM,kBACJ,MAAM,EAAE,OAAO,EACf,kBAAkB,EAAE,EAAE,IACnB,UAAU,EAAE,CAChB;SACF,CAAC,CAAC;QACH,uDAAuD;IACzD,CAAC,EAAE,YAAY,CAAC,CAAC;AACnB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect } from 'react';\nimport { useUniqueId } from './use-unique-id';\nimport { useEffectOnUpdate } from './use-effect-on-update';\n\nexport function usePerformanceMarks(\n  name: string,\n  enabled: boolean,\n  elementRef: React.RefObject<HTMLElement>,\n  getDetails: () => Record<string, string | boolean | number | undefined>,\n  dependencies: React.DependencyList\n) {\n  const id = useUniqueId();\n\n  useEffect(() => {\n    if (!enabled || !elementRef.current) {\n      return;\n    }\n\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const renderedMarkName = `${name}Rendered`;\n\n    performance.mark(renderedMarkName, {\n      detail: {\n        source: 'awsui',\n        instanceIdentifier: id,\n        ...getDetails(),\n      },\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffectOnUpdate(() => {\n    if (!enabled || !elementRef.current) {\n      return;\n    }\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const updatedMarkName = `${name}Updated`;\n\n    performance.mark(updatedMarkName, {\n      detail: {\n        source: 'awsui',\n        instanceIdentifier: id,\n        ...getDetails(),\n      },\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, dependencies);\n}\n"]}
+{"version":3,"file":"use-performance-marks.js","sourceRoot":"","sources":["../../../../src/internal/hooks/use-performance-marks.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAE3D,MAAM,UAAU,mBAAmB,CACjC,IAAY,EACZ,OAAgB,EAChB,UAAwC,EACxC,UAAuE,EACvE,YAAkC;IAElC,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,EAAE,SAAS,EAAE,GAAG,eAAe,EAAE,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,IAAI,SAAS,EAAE;YAChD,OAAO;SACR;QAED,MAAM,cAAc,GAClB,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC;YAClC,UAAU,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC;YACnC,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,UAAU,KAAK,QAAQ,CAAC;QAE/D,IAAI,CAAC,cAAc,EAAE;YACnB,OAAO;SACR;QAED,MAAM,gBAAgB,GAAG,GAAG,IAAI,UAAU,CAAC;QAE3C,WAAW,CAAC,IAAI,CAAC,gBAAgB,EAAE;YACjC,MAAM,kBACJ,MAAM,EAAE,OAAO,EACf,kBAAkB,EAAE,EAAE,IACnB,UAAU,EAAE,CAChB;SACF,CAAC,CAAC;QACH,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,iBAAiB,CAAC,GAAG,EAAE;QACrB,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,IAAI,SAAS,EAAE;YAChD,OAAO;SACR;QACD,MAAM,cAAc,GAClB,UAAU,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC;YAClC,UAAU,CAAC,OAAO,CAAC,YAAY,GAAG,CAAC;YACnC,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,UAAU,KAAK,QAAQ,CAAC;QAE/D,IAAI,CAAC,cAAc,EAAE;YACnB,OAAO;SACR;QAED,MAAM,eAAe,GAAG,GAAG,IAAI,SAAS,CAAC;QAEzC,WAAW,CAAC,IAAI,CAAC,eAAe,EAAE;YAChC,MAAM,kBACJ,MAAM,EAAE,OAAO,EACf,kBAAkB,EAAE,EAAE,IACnB,UAAU,EAAE,CAChB;SACF,CAAC,CAAC;QACH,uDAAuD;IACzD,CAAC,EAAE,YAAY,CAAC,CAAC;AACnB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect } from 'react';\nimport { useUniqueId } from './use-unique-id';\nimport { useEffectOnUpdate } from './use-effect-on-update';\nimport { useModalContext } from '../context/modal-context';\n\nexport function usePerformanceMarks(\n  name: string,\n  enabled: boolean,\n  elementRef: React.RefObject<HTMLElement>,\n  getDetails: () => Record<string, string | boolean | number | undefined>,\n  dependencies: React.DependencyList\n) {\n  const id = useUniqueId();\n  const { isInModal } = useModalContext();\n\n  useEffect(() => {\n    if (!enabled || !elementRef.current || isInModal) {\n      return;\n    }\n\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const renderedMarkName = `${name}Rendered`;\n\n    performance.mark(renderedMarkName, {\n      detail: {\n        source: 'awsui',\n        instanceIdentifier: id,\n        ...getDetails(),\n      },\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffectOnUpdate(() => {\n    if (!enabled || !elementRef.current || isInModal) {\n      return;\n    }\n    const elementVisible =\n      elementRef.current.offsetWidth > 0 &&\n      elementRef.current.offsetHeight > 0 &&\n      getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n    if (!elementVisible) {\n      return;\n    }\n\n    const updatedMarkName = `${name}Updated`;\n\n    performance.mark(updatedMarkName, {\n      detail: {\n        source: 'awsui',\n        instanceIdentifier: id,\n        ...getDetails(),\n      },\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, dependencies);\n}\n"]}

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "9bc6032bbd39139f58508164f6e4659c3a7a2f32"
+  "commit": "0968bb6fcef93e54e3b891fa984fa5c13ab68216"
 }

package/internal/utils/dom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../../../src/internal/utils/dom.ts"],"names":[],"mappings":"AAKA,wBAAgB,WAAW,CAAC,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,OAAO,GAAG,WAAW,GAAG,IAAI,CAY9G;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,YAMrC;AAsBD;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,WAAW,GAAG,WAAW,GAAG,IAAI,CAchF;AAID;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,UAiB7C"}
+{"version":3,"file":"dom.d.ts","sourceRoot":"","sources":["../../../../src/internal/utils/dom.ts"],"names":[],"mappings":"AAKA,wBAAgB,WAAW,CAAC,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,OAAO,GAAG,WAAW,GAAG,IAAI,CAY9G;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,YAMrC;AAsBD;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,YAAY,EAAE,WAAW,GAAG,WAAW,GAAG,IAAI,CAgBhF;AAID;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,UAiB7C"}

package/internal/utils/dom.js

@@ -56,7 +56,9 @@ export function getContainingBlock(startElement) {
         ? findUpUntil(startElement.parentElement, element => {
             const computedStyle = getComputedStyle(element);
             return ((!!computedStyle.transform && computedStyle.transform !== 'none') ||
-                (!!computedStyle.perspective && computedStyle.perspective !== 'none'));
+                (!!computedStyle.perspective && computedStyle.perspective !== 'none') ||
+                (!!computedStyle.containerType && computedStyle.containerType !== 'normal') ||
+                computedStyle.contain.split(' ').some(s => ['layout', 'paint', 'strict', 'content'].includes(s)));
         })
         : null;
 }

package/internal/utils/dom.js.map

@@ -1 +1 @@
-{"version":3,"file":"dom.js","sourceRoot":"","sources":["../../../../src/internal/utils/dom.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,MAAM,UAAU,WAAW,CAAC,IAAiB,EAAE,QAA2C;IACxF,IAAI,OAAO,GAAuB,IAAI,CAAC;IACvC,OAAO,OAAO,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;QACpC,OAAO,GAAG,OAAO,CAAC,aAAa,CAAC;QAChC,6EAA6E;QAC7E,uEAAuE;QACvE,0DAA0D;QAC1D,OAAO,OAAO,IAAI,CAAC,CAAC,OAAO,YAAY,WAAW,CAAC,EAAE;YACnD,OAAO,GAAI,OAAmB,CAAC,aAAa,CAAC;SAC9C;KACF;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,sBAAsB;;IACpC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,qCAAqC;QACrC,OAAO,KAAK,CAAC;KACd;IACD,OAAO,MAAA,MAAA,MAAA,MAAM,CAAC,GAAG,0CAAE,QAAQ,mDAAG,UAAU,EAAE,QAAQ,CAAC,mCAAI,KAAK,CAAC;AAC/D,CAAC;AAED;;;;GAIG;AACH,MAAM,kCAAkC,GAAG,aAAa,CAAC,GAAG,EAAE;IAC5D,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7C,MAAM,CAAC,KAAK,CAAC,SAAS,GAAG,iBAAiB,CAAC;IAC3C,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAElC,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5C,KAAK,CAAC,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAC;IAC/B,KAAK,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;IACtB,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAE1B,MAAM,MAAM,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC,GAAG,KAAK,KAAK,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;IACxF,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC,CAAC;AAEH;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,YAAyB;IAC1D,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE;QAC/B,OAAO,IAAI,CAAC;KACb;IAED,OAAO,kCAAkC,EAAE;QACzC,CAAC,CAAE,WAAW,CAAC,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC,EAAE;YACjD,MAAM,aAAa,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;YAChD,OAAO,CACL,CAAC,CAAC,CAAC,aAAa,CAAC,SAAS,IAAI,aAAa,CAAC,SAAS,KAAK,MAAM,CAAC;gBACjE,CAAC,CAAC,CAAC,aAAa,CAAC,WAAW,IAAI,aAAa,CAAC,WAAW,KAAK,MAAM,CAAC,CACtE,CAAC;QACJ,CAAC,CAAiB;QACpB,CAAC,CAAC,IAAI,CAAC;AACX,CAAC;AAED,MAAM,qBAAqB,GAAG,kBAAkB,CAAC;AAEjD;;;;;GAKG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAa;;IAC5C,IAAI,MAAA,MAAA,MAAA,MAAM,CAAC,GAAG,0CAAE,QAAQ,mDAAG,OAAO,EAAE,oBAAoB,CAAC,mCAAI,KAAK,EAAE;QAClE,OAAO,KAAK,CAAC;KACd;IAED,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3C,IAAI,QAAQ,KAAK,CAAC,CAAC,EAAE;QACnB,OAAO,KAAK,CAAC;KACd;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;IACxD,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,KAAK,CAAC;KACd;IAED,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC;IACrD,OAAO,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;AAClC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport balanced from 'balanced-match';\nimport { calculateOnce } from './calculate-once';\n\nexport function findUpUntil(node: HTMLElement, callback: (element: HTMLElement) => boolean): HTMLElement | null {\n  let current: HTMLElement | null = node;\n  while (current && !callback(current)) {\n    current = current.parentElement;\n    // If a component is used within an svg (i.e. as foreignObject), then it will\n    // have some ancestor nodes that are SVGElement. We want to skip those,\n    // as they have very different properties to HTMLElements.\n    while (current && !(current instanceof HTMLElement)) {\n      current = (current as Element).parentElement;\n    }\n  }\n  return current;\n}\n\n/**\n * Returns whether the browser supports CSS position sticky.\n * In our list of supported browsers, only returns false for IE11.\n */\nexport function supportsStickyPosition() {\n  if (typeof window === 'undefined') {\n    // render no-sticky UI on server-side\n    return false;\n  }\n  return window.CSS?.supports?.('position', 'sticky') ?? false;\n}\n\n/**\n * Returns whether `position: fixed` can be relative to transformed parents or\n * whether it's always relative to the viewport. Returns `true` on all browsers\n * except IE.\n */\nconst supportsContainingBlockPositioning = calculateOnce(() => {\n  const parent = document.createElement('div');\n  parent.style.transform = 'translateY(5px)';\n  document.body.appendChild(parent);\n\n  const child = document.createElement('div');\n  child.style.position = 'fixed';\n  child.style.top = '0';\n  parent.appendChild(child);\n\n  const result = parent.getBoundingClientRect().top === child.getBoundingClientRect().top;\n  document.body.removeChild(parent);\n  return result;\n});\n\n/**\n * Returns an element that is used to position the given element.\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block\n */\nexport function getContainingBlock(startElement: HTMLElement): HTMLElement | null {\n  if (!startElement.parentElement) {\n    return null;\n  }\n\n  return supportsContainingBlockPositioning()\n    ? (findUpUntil(startElement.parentElement, element => {\n        const computedStyle = getComputedStyle(element);\n        return (\n          (!!computedStyle.transform && computedStyle.transform !== 'none') ||\n          (!!computedStyle.perspective && computedStyle.perspective !== 'none')\n        );\n      }) as HTMLElement)\n    : null;\n}\n\nconst cssVariableExpression = /--.+?\\s*,\\s*(.+)/;\n\n/**\n * Parses a CSS color value that might contain CSS Custom Properties\n * and returns a value that will be understood by the browser, no matter of support level.\n * If the browser support CSS Custom Properties, the value will be return as is. Otherwise,\n * the fallback value will be extracted and returned instead.\n */\nexport function parseCssVariable(value: string) {\n  if (window.CSS?.supports?.('color', 'var(--dummy, #000)') ?? false) {\n    return value;\n  }\n\n  const varIndex = value.lastIndexOf('var(');\n  if (varIndex === -1) {\n    return value;\n  }\n\n  const expr = balanced('(', ')', value.substr(varIndex));\n  if (!expr) {\n    return value;\n  }\n\n  const match = expr.body.match(cssVariableExpression);\n  return match ? match[1] : value;\n}\n"]}
+{"version":3,"file":"dom.js","sourceRoot":"","sources":["../../../../src/internal/utils/dom.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport balanced from 'balanced-match';\nimport { calculateOnce } from './calculate-once';\n\nexport function findUpUntil(node: HTMLElement, callback: (element: HTMLElement) => boolean): HTMLElement | null {\n  let current: HTMLElement | null = node;\n  while (current && !callback(current)) {\n    current = current.parentElement;\n    // If a component is used within an svg (i.e. as foreignObject), then it will\n    // have some ancestor nodes that are SVGElement. We want to skip those,\n    // as they have very different properties to HTMLElements.\n    while (current && !(current instanceof HTMLElement)) {\n      current = (current as Element).parentElement;\n    }\n  }\n  return current;\n}\n\n/**\n * Returns whether the browser supports CSS position sticky.\n * In our list of supported browsers, only returns false for IE11.\n */\nexport function supportsStickyPosition() {\n  if (typeof window === 'undefined') {\n    // render no-sticky UI on server-side\n    return false;\n  }\n  return window.CSS?.supports?.('position', 'sticky') ?? false;\n}\n\n/**\n * Returns whether `position: fixed` can be relative to transformed parents or\n * whether it's always relative to the viewport. Returns `true` on all browsers\n * except IE.\n */\nconst supportsContainingBlockPositioning = calculateOnce(() => {\n  const parent = document.createElement('div');\n  parent.style.transform = 'translateY(5px)';\n  document.body.appendChild(parent);\n\n  const child = document.createElement('div');\n  child.style.position = 'fixed';\n  child.style.top = '0';\n  parent.appendChild(child);\n\n  const result = parent.getBoundingClientRect().top === child.getBoundingClientRect().top;\n  document.body.removeChild(parent);\n  return result;\n});\n\n/**\n * Returns an element that is used to position the given element.\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block\n */\nexport function getContainingBlock(startElement: HTMLElement): HTMLElement | null {\n  if (!startElement.parentElement) {\n    return null;\n  }\n\n  return supportsContainingBlockPositioning()\n    ? (findUpUntil(startElement.parentElement, element => {\n        const computedStyle = getComputedStyle(element);\n        return (\n          (!!computedStyle.transform && computedStyle.transform !== 'none') ||\n          (!!computedStyle.perspective && computedStyle.perspective !== 'none') ||\n          (!!computedStyle.containerType && computedStyle.containerType !== 'normal') ||\n          computedStyle.contain.split(' ').some(s => ['layout', 'paint', 'strict', 'content'].includes(s))\n        );\n      }) as HTMLElement)\n    : null;\n}\n\nconst cssVariableExpression = /--.+?\\s*,\\s*(.+)/;\n\n/**\n * Parses a CSS color value that might contain CSS Custom Properties\n * and returns a value that will be understood by the browser, no matter of support level.\n * If the browser support CSS Custom Properties, the value will be return as is. Otherwise,\n * the fallback value will be extracted and returned instead.\n */\nexport function parseCssVariable(value: string) {\n  if (window.CSS?.supports?.('color', 'var(--dummy, #000)') ?? false) {\n    return value;\n  }\n\n  const varIndex = value.lastIndexOf('var(');\n  if (varIndex === -1) {\n    return value;\n  }\n\n  const expr = balanced('(', ')', value.substr(varIndex));\n  if (!expr) {\n    return value;\n  }\n\n  const match = expr.body.match(cssVariableExpression);\n  return match ? match[1] : value;\n}\n"]}

package/package.json

@@ -117,7 +117,7 @@
     "./internal/base-component/index.js",
     "./internal/base-component/styles.css.js"
   ],
-  "version": "3.0.637",
+  "version": "3.0.638",
   "repository": {
     "type": "git",
     "url": "https://github.com/cloudscape-design/components.git"

package/slider/styles.css.js

@@ -1,30 +1,30 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_pcgz5_2nlcl_103",
-  "slider": "awsui_slider_pcgz5_2nlcl_143",
-  "slider-track": "awsui_slider-track_pcgz5_2nlcl_147",
-  "slider-range": "awsui_slider-range_pcgz5_2nlcl_147",
-  "disabled": "awsui_disabled_pcgz5_2nlcl_162",
-  "error": "awsui_error_pcgz5_2nlcl_171",
-  "warning": "awsui_warning_pcgz5_2nlcl_174",
-  "active": "awsui_active_pcgz5_2nlcl_177",
-  "error-active": "awsui_error-active_pcgz5_2nlcl_180",
-  "warning-active": "awsui_warning-active_pcgz5_2nlcl_183",
-  "labels": "awsui_labels_pcgz5_2nlcl_190",
-  "labels-noref": "awsui_labels-noref_pcgz5_2nlcl_196",
-  "labels-reference": "awsui_labels-reference_pcgz5_2nlcl_199",
-  "labels-min": "awsui_labels-min_pcgz5_2nlcl_206",
-  "labels-max": "awsui_labels-max_pcgz5_2nlcl_212",
-  "labels-aria-description": "awsui_labels-aria-description_pcgz5_2nlcl_220",
-  "ticks": "awsui_ticks_pcgz5_2nlcl_238",
-  "ticks-wrapper": "awsui_ticks-wrapper_pcgz5_2nlcl_244",
-  "tick": "awsui_tick_pcgz5_2nlcl_238",
-  "middle": "awsui_middle_pcgz5_2nlcl_259",
-  "filled": "awsui_filled_pcgz5_2nlcl_262",
-  "tooltip-thumb": "awsui_tooltip-thumb_pcgz5_2nlcl_284",
-  "thumb": "awsui_thumb_pcgz5_2nlcl_292",
-  "min": "awsui_min_pcgz5_2nlcl_307",
-  "max": "awsui_max_pcgz5_2nlcl_310"
+  "root": "awsui_root_pcgz5_4cmyk_103",
+  "slider": "awsui_slider_pcgz5_4cmyk_143",
+  "slider-track": "awsui_slider-track_pcgz5_4cmyk_147",
+  "slider-range": "awsui_slider-range_pcgz5_4cmyk_147",
+  "disabled": "awsui_disabled_pcgz5_4cmyk_162",
+  "error": "awsui_error_pcgz5_4cmyk_171",
+  "warning": "awsui_warning_pcgz5_4cmyk_174",
+  "active": "awsui_active_pcgz5_4cmyk_177",
+  "error-active": "awsui_error-active_pcgz5_4cmyk_180",
+  "warning-active": "awsui_warning-active_pcgz5_4cmyk_183",
+  "labels": "awsui_labels_pcgz5_4cmyk_190",
+  "labels-noref": "awsui_labels-noref_pcgz5_4cmyk_196",
+  "labels-reference": "awsui_labels-reference_pcgz5_4cmyk_199",
+  "labels-min": "awsui_labels-min_pcgz5_4cmyk_206",
+  "labels-max": "awsui_labels-max_pcgz5_4cmyk_212",
+  "labels-aria-description": "awsui_labels-aria-description_pcgz5_4cmyk_220",
+  "ticks": "awsui_ticks_pcgz5_4cmyk_238",
+  "ticks-wrapper": "awsui_ticks-wrapper_pcgz5_4cmyk_244",
+  "tick": "awsui_tick_pcgz5_4cmyk_238",
+  "middle": "awsui_middle_pcgz5_4cmyk_259",
+  "filled": "awsui_filled_pcgz5_4cmyk_262",
+  "tooltip-thumb": "awsui_tooltip-thumb_pcgz5_4cmyk_284",
+  "thumb": "awsui_thumb_pcgz5_4cmyk_292",
+  "min": "awsui_min_pcgz5_4cmyk_307",
+  "max": "awsui_max_pcgz5_4cmyk_310"
 };
   

package/slider/styles.scoped.css

@@ -100,7 +100,7 @@ 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_root_pcgz5_2nlcl_103:not(#\9) {
+.awsui_root_pcgz5_4cmyk_103:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -141,11 +141,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline: calc(var(--space-m-udix3p, 16px) / 2);
 }
 
-.awsui_slider_pcgz5_2nlcl_143:not(#\9) {
+.awsui_slider_pcgz5_4cmyk_143:not(#\9) {
   display: flex;
   align-items: center;
 }
-.awsui_slider-track_pcgz5_2nlcl_147:not(#\9), .awsui_slider-range_pcgz5_2nlcl_147:not(#\9) {
+.awsui_slider-track_pcgz5_4cmyk_147:not(#\9), .awsui_slider-range_pcgz5_4cmyk_147:not(#\9) {
   position: absolute;
   border-start-start-radius: 3px;
   border-start-end-radius: 3px;
@@ -154,101 +154,101 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-start: var(--space-xs-zb16t3, 8px);
   margin-inline: calc(var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_slider-track_pcgz5_2nlcl_147:not(#\9) {
+.awsui_slider-track_pcgz5_4cmyk_147:not(#\9) {
   background-color: var(--color-background-slider-track-3m68rn, #7d8998);
   inline-size: calc(100% + var(--space-m-udix3p, 16px));
   block-size: 2px;
   cursor: pointer;
 }
-.awsui_slider-track_pcgz5_2nlcl_147.awsui_disabled_pcgz5_2nlcl_162:not(#\9) {
+.awsui_slider-track_pcgz5_4cmyk_147.awsui_disabled_pcgz5_4cmyk_162:not(#\9) {
   cursor: default;
   background-color: var(--color-background-control-disabled-pwkvgd, #d1d5db);
 }
-.awsui_slider-range_pcgz5_2nlcl_147:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147:not(#\9) {
   background-color: var(--color-background-slider-handle-default-atrlod, #0972d3);
   block-size: 4px;
-  inline-size: calc(var(--awsui-slider-range-inline-size-tkr9yl) + var(--space-m-udix3p, 16px));
+  inline-size: calc(var(--awsui-slider-range-inline-size-epuq3n) + var(--space-m-udix3p, 16px));
 }
-.awsui_slider-range_pcgz5_2nlcl_147.awsui_error_pcgz5_2nlcl_171:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147.awsui_error_pcgz5_4cmyk_171:not(#\9) {
   background-color: var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_slider-range_pcgz5_2nlcl_147.awsui_warning_pcgz5_2nlcl_174:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147.awsui_warning_pcgz5_4cmyk_174:not(#\9) {
   background-color: var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_slider-range_pcgz5_2nlcl_147.awsui_active_pcgz5_2nlcl_177:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147.awsui_active_pcgz5_4cmyk_177:not(#\9) {
   background-color: var(--color-background-slider-handle-active-ccegzg, #065299);
 }
-.awsui_slider-range_pcgz5_2nlcl_147.awsui_error-active_pcgz5_2nlcl_180:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147.awsui_error-active_pcgz5_4cmyk_180:not(#\9) {
   background-color: var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
 }
-.awsui_slider-range_pcgz5_2nlcl_147.awsui_warning-active_pcgz5_2nlcl_183:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147.awsui_warning-active_pcgz5_4cmyk_183:not(#\9) {
   background-color: var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
 }
-.awsui_slider-range_pcgz5_2nlcl_147.awsui_disabled_pcgz5_2nlcl_162:not(#\9) {
+.awsui_slider-range_pcgz5_4cmyk_147.awsui_disabled_pcgz5_4cmyk_162:not(#\9) {
   background-color: var(--color-background-control-disabled-pwkvgd, #d1d5db);
 }
 
-.awsui_labels_pcgz5_2nlcl_190:not(#\9) {
+.awsui_labels_pcgz5_4cmyk_190:not(#\9) {
   display: grid;
-  grid-template-columns: 3fr repeat(calc((var(--awsui-slider-label-count-tkr9yl) - 2) / 2 + (var(--awsui-slider-label-count-tkr9yl) - 2) / 2 - 1), 2fr) 3fr;
+  grid-template-columns: 3fr repeat(calc((var(--awsui-slider-label-count-epuq3n) - 2) / 2 + (var(--awsui-slider-label-count-epuq3n) - 2) / 2 - 1), 2fr) 3fr;
   grid-auto-rows: 100%;
   padding-block-start: var(--space-m-udix3p, 16px);
 }
-.awsui_labels-noref_pcgz5_2nlcl_196:not(#\9) {
+.awsui_labels-noref_pcgz5_4cmyk_196:not(#\9) {
   grid-template-columns: 1fr 1fr;
 }
-.awsui_labels-reference_pcgz5_2nlcl_199:not(#\9) {
-  grid-column-start: var(--awsui-slider-reference-column-tkr9yl);
-  grid-column-end: var(--awsui-slider-next-reference-column-tkr9yl);
+.awsui_labels-reference_pcgz5_4cmyk_199:not(#\9) {
+  grid-column-start: var(--awsui-slider-reference-column-epuq3n);
+  grid-column-end: var(--awsui-slider-next-reference-column-epuq3n);
   grid-row: 1;
   justify-self: center;
   text-align: center;
 }
-.awsui_labels-min_pcgz5_2nlcl_206:not(#\9) {
+.awsui_labels-min_pcgz5_4cmyk_206:not(#\9) {
   grid-column: 1;
   grid-row: 1;
-  grid-column-end: var(--awsui-slider-min-end-tkr9yl);
+  grid-column-end: var(--awsui-slider-min-end-epuq3n);
   margin-inline-start: calc(var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_labels-max_pcgz5_2nlcl_212:not(#\9) {
+.awsui_labels-max_pcgz5_4cmyk_212:not(#\9) {
   text-align: end;
   justify-content: flex-end;
   grid-row: 1;
-  grid-column-end: calc(var(--awsui-slider-label-count-tkr9yl) + 1);
-  grid-column-start: var(--awsui-slider-max-start-tkr9yl);
+  grid-column-end: calc(var(--awsui-slider-label-count-epuq3n) + 1);
+  grid-column-start: var(--awsui-slider-max-start-epuq3n);
   margin-inline-end: calc(var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_labels-aria-description_pcgz5_2nlcl_220:not(#\9) {
+.awsui_labels-aria-description_pcgz5_4cmyk_220:not(#\9) {
   display: none;
 }
 @media (max-width: 576px) {
-  .awsui_labels_pcgz5_2nlcl_190:not(#\9) {
+  .awsui_labels_pcgz5_4cmyk_190:not(#\9) {
     grid-template-columns: 1fr 1fr;
   }
-  .awsui_labels-min_pcgz5_2nlcl_206:not(#\9) {
+  .awsui_labels-min_pcgz5_4cmyk_206:not(#\9) {
     grid-column: 1;
   }
-  .awsui_labels-max_pcgz5_2nlcl_212:not(#\9) {
+  .awsui_labels-max_pcgz5_4cmyk_212:not(#\9) {
     grid-column: 2;
   }
-  .awsui_labels_pcgz5_2nlcl_190 > .awsui_labels-reference_pcgz5_2nlcl_199:not(#\9) {
+  .awsui_labels_pcgz5_4cmyk_190 > .awsui_labels-reference_pcgz5_4cmyk_199:not(#\9) {
     display: none;
   }
 }
 
-.awsui_ticks_pcgz5_2nlcl_238:not(#\9) {
+.awsui_ticks_pcgz5_4cmyk_238:not(#\9) {
   display: grid;
-  grid-template-columns: repeat(var(--awsui-slider-tick-count-tkr9yl), 1fr);
+  grid-template-columns: repeat(var(--awsui-slider-tick-count-epuq3n), 1fr);
   inline-size: calc(100% - var(--space-m-udix3p, 16px));
   margin-inline: calc(var(--space-m-udix3p, 16px) / 2);
 }
-.awsui_ticks-wrapper_pcgz5_2nlcl_244:not(#\9) {
+.awsui_ticks-wrapper_pcgz5_4cmyk_244:not(#\9) {
   block-size: 0;
   display: flex;
   margin-inline: calc(var(--space-m-udix3p, 16px) / -2);
 }
 
-.awsui_tick_pcgz5_2nlcl_238:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238:not(#\9) {
   grid-row: 1;
   block-size: var(--space-xs-zb16t3, 8px);
   inline-size: var(--space-xxxs-zbmxqb, 2px);
@@ -257,40 +257,40 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background: var(--color-background-slider-track-3m68rn, #7d8998);
   inset-block-start: -4px;
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_middle_pcgz5_2nlcl_259:not(#\9):first-child, .awsui_tick_pcgz5_2nlcl_238.awsui_middle_pcgz5_2nlcl_259:not(#\9):last-child {
+.awsui_tick_pcgz5_4cmyk_238.awsui_middle_pcgz5_4cmyk_259:not(#\9):first-child, .awsui_tick_pcgz5_4cmyk_238.awsui_middle_pcgz5_4cmyk_259:not(#\9):last-child {
   visibility: hidden;
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_filled_pcgz5_2nlcl_262:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_filled_pcgz5_4cmyk_262:not(#\9) {
   background: var(--color-background-slider-handle-default-atrlod, #0972d3);
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_active_pcgz5_2nlcl_177:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_active_pcgz5_4cmyk_177:not(#\9) {
   background: var(--color-background-slider-handle-active-ccegzg, #065299);
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_error_pcgz5_2nlcl_171:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_error_pcgz5_4cmyk_171:not(#\9) {
   background: var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_warning_pcgz5_2nlcl_174:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_warning_pcgz5_4cmyk_174:not(#\9) {
   background: var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_error-active_pcgz5_2nlcl_180:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_error-active_pcgz5_4cmyk_180:not(#\9) {
   background-color: var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_warning-active_pcgz5_2nlcl_183:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_warning-active_pcgz5_4cmyk_183:not(#\9) {
   background-color: var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
 }
-.awsui_tick_pcgz5_2nlcl_238.awsui_disabled_pcgz5_2nlcl_162:not(#\9) {
+.awsui_tick_pcgz5_4cmyk_238.awsui_disabled_pcgz5_4cmyk_162:not(#\9) {
   background: var(--color-background-control-disabled-pwkvgd, #d1d5db);
 }
 
-.awsui_tooltip-thumb_pcgz5_2nlcl_284:not(#\9) {
+.awsui_tooltip-thumb_pcgz5_4cmyk_284:not(#\9) {
   position: absolute;
   inline-size: var(--space-xxl-cu2m1r, 32px);
   block-size: var(--space-xxl-cu2m1r, 32px);
   margin-block-start: calc(var(--space-s-34lx8l, 12px) / -1);
-  inset-inline-start: var(--awsui-slider-tooltip-position-tkr9yl);
+  inset-inline-start: var(--awsui-slider-tooltip-position-epuq3n);
 }
 
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9) {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9) {
   background: transparent;
   -webkit-appearance: none;
           appearance: none;
@@ -303,16 +303,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   cursor: pointer;
   touch-action: none;
 }
-.awsui_thumb_pcgz5_2nlcl_292.awsui_disabled_pcgz5_2nlcl_162:not(#\9) {
+.awsui_thumb_pcgz5_4cmyk_292.awsui_disabled_pcgz5_4cmyk_162:not(#\9) {
   cursor: default;
 }
-.awsui_thumb_pcgz5_2nlcl_292.awsui_min_pcgz5_2nlcl_307:not(#\9) {
+.awsui_thumb_pcgz5_4cmyk_292.awsui_min_pcgz5_4cmyk_307:not(#\9) {
   margin-inline-start: calc(-1px + var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_thumb_pcgz5_2nlcl_292.awsui_max_pcgz5_2nlcl_310:not(#\9) {
+.awsui_thumb_pcgz5_4cmyk_292.awsui_max_pcgz5_4cmyk_310:not(#\9) {
   margin-inline-start: calc(1px + var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9)::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9)::-webkit-slider-thumb {
   -webkit-appearance: none;
           appearance: none;
   appearance: none;
@@ -331,7 +331,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: all;
   position: relative;
 }
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9)::-moz-range-thumb {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9)::-moz-range-thumb {
   appearance: none;
   appearance: none;
   background: var(--color-background-slider-handle-default-atrlod, #0972d3);
@@ -349,13 +349,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: all;
   position: relative;
 }
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9):hover::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9):hover::-webkit-slider-thumb {
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-handle-default-atrlod, #0972d3);
 }
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9):hover::-moz-range-thumb {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9):hover::-moz-range-thumb {
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-handle-default-atrlod, #0972d3);
 }
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9):focus::-webkit-slider-thumb, .awsui_thumb_pcgz5_2nlcl_292:not(#\9):active::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9):focus::-webkit-slider-thumb, .awsui_thumb_pcgz5_4cmyk_292:not(#\9):active::-webkit-slider-thumb {
   block-size: 20px;
   inline-size: 20px;
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-handle-active-ccegzg, #065299);
@@ -364,7 +364,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-block-width: 2px;
   border-inline-width: 2px;
 }
-.awsui_thumb_pcgz5_2nlcl_292:not(#\9):focus::-moz-range-thumb, .awsui_thumb_pcgz5_2nlcl_292:not(#\9):active::-moz-range-thumb {
+.awsui_thumb_pcgz5_4cmyk_292:not(#\9):focus::-moz-range-thumb, .awsui_thumb_pcgz5_4cmyk_292:not(#\9):active::-moz-range-thumb {
   block-size: 20px;
   inline-size: 20px;
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-handle-active-ccegzg, #065299);
@@ -374,30 +374,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-inline-width: 2px;
 }
 
-.awsui_error_pcgz5_2nlcl_171:not(#\9)::-webkit-slider-thumb {
+.awsui_error_pcgz5_4cmyk_171:not(#\9)::-webkit-slider-thumb {
   background-color: var(--color-text-status-error-wdvepn, #d91515);
   border-color: var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_error_pcgz5_2nlcl_171:not(#\9)::-moz-range-thumb {
+.awsui_error_pcgz5_4cmyk_171:not(#\9)::-moz-range-thumb {
   background-color: var(--color-text-status-error-wdvepn, #d91515);
   border-color: var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_error_pcgz5_2nlcl_171:not(#\9):hover::-webkit-slider-thumb {
+.awsui_error_pcgz5_4cmyk_171:not(#\9):hover::-webkit-slider-thumb {
   background-color: var(--color-text-status-error-wdvepn, #d91515);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_error_pcgz5_2nlcl_171:not(#\9):hover::-moz-range-thumb {
+.awsui_error_pcgz5_4cmyk_171:not(#\9):hover::-moz-range-thumb {
   background-color: var(--color-text-status-error-wdvepn, #d91515);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_error_pcgz5_2nlcl_171:not(#\9):focus::-webkit-slider-thumb, .awsui_error_pcgz5_2nlcl_171:not(#\9):active::-webkit-slider-thumb {
+.awsui_error_pcgz5_4cmyk_171:not(#\9):focus::-webkit-slider-thumb, .awsui_error_pcgz5_4cmyk_171:not(#\9):active::-webkit-slider-thumb {
   background-color: var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
   border-block-width: 2px;
   border-inline-width: 2px;
   border-color: var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
 }
-.awsui_error_pcgz5_2nlcl_171:not(#\9):focus::-moz-range-thumb, .awsui_error_pcgz5_2nlcl_171:not(#\9):active::-moz-range-thumb {
+.awsui_error_pcgz5_4cmyk_171:not(#\9):focus::-moz-range-thumb, .awsui_error_pcgz5_4cmyk_171:not(#\9):active::-moz-range-thumb {
   background-color: var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
   border-block-width: 2px;
   border-inline-width: 2px;
@@ -405,30 +405,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-error-pressed-g7oqnt, #7c2718);
 }
 
-.awsui_warning_pcgz5_2nlcl_174:not(#\9)::-webkit-slider-thumb {
+.awsui_warning_pcgz5_4cmyk_174:not(#\9)::-webkit-slider-thumb {
   background-color: var(--color-text-status-warning-yik8vi, #8d6605);
   border-color: var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_warning_pcgz5_2nlcl_174:not(#\9)::-moz-range-thumb {
+.awsui_warning_pcgz5_4cmyk_174:not(#\9)::-moz-range-thumb {
   background-color: var(--color-text-status-warning-yik8vi, #8d6605);
   border-color: var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_warning_pcgz5_2nlcl_174:not(#\9):hover::-webkit-slider-thumb {
+.awsui_warning_pcgz5_4cmyk_174:not(#\9):hover::-webkit-slider-thumb {
   background-color: var(--color-text-status-warning-yik8vi, #8d6605);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_warning_pcgz5_2nlcl_174:not(#\9):hover::-moz-range-thumb {
+.awsui_warning_pcgz5_4cmyk_174:not(#\9):hover::-moz-range-thumb {
   background-color: var(--color-text-status-warning-yik8vi, #8d6605);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_warning_pcgz5_2nlcl_174:not(#\9):focus::-webkit-slider-thumb, .awsui_warning_pcgz5_2nlcl_174:not(#\9):active::-webkit-slider-thumb {
+.awsui_warning_pcgz5_4cmyk_174:not(#\9):focus::-webkit-slider-thumb, .awsui_warning_pcgz5_4cmyk_174:not(#\9):active::-webkit-slider-thumb {
   background-color: var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
   border-block-width: 2px;
   border-inline-width: 2px;
   border-color: var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
 }
-.awsui_warning_pcgz5_2nlcl_174:not(#\9):focus::-moz-range-thumb, .awsui_warning_pcgz5_2nlcl_174:not(#\9):active::-moz-range-thumb {
+.awsui_warning_pcgz5_4cmyk_174:not(#\9):focus::-moz-range-thumb, .awsui_warning_pcgz5_4cmyk_174:not(#\9):active::-moz-range-thumb {
   background-color: var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
   border-block-width: 2px;
   border-inline-width: 2px;
@@ -436,17 +436,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-31445h, #ffffff), 0 0 0 4px var(--color-background-slider-warning-pressed-9xuhwf, #8d6605);
 }
 
-.awsui_disabled_pcgz5_2nlcl_162:not(#\9)::-webkit-slider-thumb,
-.awsui_disabled_pcgz5_2nlcl_162:not(#\9):hover::-webkit-slider-thumb,
-.awsui_disabled_pcgz5_2nlcl_162:not(#\9):active::-webkit-slider-thumb {
+.awsui_disabled_pcgz5_4cmyk_162:not(#\9)::-webkit-slider-thumb,
+.awsui_disabled_pcgz5_4cmyk_162:not(#\9):hover::-webkit-slider-thumb,
+.awsui_disabled_pcgz5_4cmyk_162:not(#\9):active::-webkit-slider-thumb {
   background-color: var(--color-background-control-disabled-pwkvgd, #d1d5db);
   border-color: var(--color-background-control-disabled-pwkvgd, #d1d5db);
   box-shadow: none;
   pointer-events: none;
 }
-.awsui_disabled_pcgz5_2nlcl_162:not(#\9)::-moz-range-thumb,
-.awsui_disabled_pcgz5_2nlcl_162:not(#\9):hover::-moz-range-thumb,
-.awsui_disabled_pcgz5_2nlcl_162:not(#\9):active::-moz-range-thumb {
+.awsui_disabled_pcgz5_4cmyk_162:not(#\9)::-moz-range-thumb,
+.awsui_disabled_pcgz5_4cmyk_162:not(#\9):hover::-moz-range-thumb,
+.awsui_disabled_pcgz5_4cmyk_162:not(#\9):active::-moz-range-thumb {
   background-color: var(--color-background-control-disabled-pwkvgd, #d1d5db);
   border-color: var(--color-background-control-disabled-pwkvgd, #d1d5db);
   box-shadow: none;