@cloudscape-design/components 3.0.220 → 3.0.222

package/input/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/input/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,WAAW,EAAa,MAAM,OAAO,CAAC;AAG/C,MAAM,CAAC,IAAM,cAAc,GAAG,UAC5B,IAAY,EACZ,QAA6B,EAC7B,QAA6B,EAC7B,KAAa,EACb,QAAqC,EACrC,QAAiC;IAEjC,IAAM,WAAW,GAAgC,EAAE,CAAC;IACpD,IAAM,eAAe,GAAG,WAAW,CAAC;;QAClC,MAAA,QAAQ,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC;IACf,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IACzB,IAAI,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,cAAc,EAAE;QAChD,WAAW,CAAC,UAAU,GAAG,QAAQ,CAAC;QAElC,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,IAAI,KAAK,EAAE;YACnC,WAAW,CAAC,WAAW,GAAG,OAAO,CAAC;YAClC,WAAW,CAAC,kBAAkB,GAAG,eAAe,CAAC;SAClD;KACF;IACD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,aAAuC;IAAvC,8BAAA,EAAA,qBAAuC;IACzE,IAAI,aAAa,KAAK,IAAI,EAAE;QAC1B,OAAO,IAAI,CAAC;KACb;IACD,OAAO,aAAa,IAAI,KAAK,CAAC;AAChC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useCallback, RefObject } from 'react';\nimport { InternalInputProps } from './internal';\n\nexport const useSearchProps = (\n  type: string,\n  disabled: boolean | undefined,\n  readOnly: boolean | undefined,\n  value: string,\n  inputRef: RefObject<HTMLInputElement>,\n  onChange: (value: string) => void\n) => {\n  const searchProps: Partial<InternalInputProps> = {};\n  const handleIconClick = useCallback(() => {\n    inputRef.current?.focus();\n    onChange('');\n  }, [inputRef, onChange]);\n  if (type === 'search' || type === 'visualSearch') {\n    searchProps.__leftIcon = 'search';\n\n    if (!disabled && !readOnly && value) {\n      searchProps.__rightIcon = 'close';\n      searchProps.__onRightIconClick = handleIconClick;\n    }\n  }\n  return searchProps;\n};\n\n/**\n * Converts the boolean or string value of the `autoComplete` property to the correct `autocomplete` attribute value.\n */\nexport const convertAutoComplete = (propertyValue: boolean | string = false): string => {\n  if (propertyValue === true) {\n    return 'on';\n  }\n  return propertyValue || 'off';\n};\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/input/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,WAAW,EAAa,MAAM,OAAO,CAAC;AAG/C,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,IAAY,EACZ,QAA6B,EAC7B,QAA6B,EAC7B,KAAa,EACb,QAAqC,EACrC,QAAiC,EACjC,EAAE;IACF,MAAM,WAAW,GAAgC,EAAE,CAAC;IACpD,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;;QACvC,MAAA,QAAQ,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC;IACf,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IACzB,IAAI,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,cAAc,EAAE;QAChD,WAAW,CAAC,UAAU,GAAG,QAAQ,CAAC;QAElC,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,IAAI,KAAK,EAAE;YACnC,WAAW,CAAC,WAAW,GAAG,OAAO,CAAC;YAClC,WAAW,CAAC,kBAAkB,GAAG,eAAe,CAAC;SAClD;KACF;IACD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,gBAAkC,KAAK,EAAU,EAAE;IACrF,IAAI,aAAa,KAAK,IAAI,EAAE;QAC1B,OAAO,IAAI,CAAC;KACb;IACD,OAAO,aAAa,IAAI,KAAK,CAAC;AAChC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useCallback, RefObject } from 'react';\nimport { InternalInputProps } from './internal';\n\nexport const useSearchProps = (\n  type: string,\n  disabled: boolean | undefined,\n  readOnly: boolean | undefined,\n  value: string,\n  inputRef: RefObject<HTMLInputElement>,\n  onChange: (value: string) => void\n) => {\n  const searchProps: Partial<InternalInputProps> = {};\n  const handleIconClick = useCallback(() => {\n    inputRef.current?.focus();\n    onChange('');\n  }, [inputRef, onChange]);\n  if (type === 'search' || type === 'visualSearch') {\n    searchProps.__leftIcon = 'search';\n\n    if (!disabled && !readOnly && value) {\n      searchProps.__rightIcon = 'close';\n      searchProps.__onRightIconClick = handleIconClick;\n    }\n  }\n  return searchProps;\n};\n\n/**\n * Converts the boolean or string value of the `autoComplete` property to the correct `autocomplete` attribute value.\n */\nexport const convertAutoComplete = (propertyValue: boolean | string = false): string => {\n  if (propertyValue === true) {\n    return 'on';\n  }\n  return propertyValue || 'off';\n};\n"]}

package/internal/animate.js

@@ -1,10 +1,9 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { __assign } from "tslib";
 export function getDOMRects(elements) {
-    var rects = {};
-    for (var id in elements) {
-        var element = elements[id];
+    const rects = {};
+    for (const id in elements) {
+        const element = elements[id];
         if (element) {
             rects[id] = element.getBoundingClientRect();
         }
@@ -22,31 +21,30 @@ export function getDOMRects(elements) {
   Caveat: this currently does not support elements having CSS transforms in the end state.
   These would be overridden in the animation instead of combined.
  */
-export function animate(_a) {
-    var oldState = _a.oldState, elements = _a.elements, onTransitionsEnd = _a.onTransitionsEnd, newElementInitialState = _a.newElementInitialState;
+export function animate({ oldState, elements, onTransitionsEnd, newElementInitialState, }) {
     // First, apply the transform that will make the elements "look like" in the start position
-    for (var id in elements) {
-        var element = elements[id];
-        var oldRect = oldState[id];
+    for (const id in elements) {
+        const element = elements[id];
+        const oldRect = oldState[id];
         if (element) {
-            var newRect = element.getBoundingClientRect();
-            var noOpTransform = { scale: 1, x: 0, y: 0 };
+            const newRect = element.getBoundingClientRect();
+            const noOpTransform = { scale: 1, x: 0, y: 0 };
             // Calculate initial position.
             // If the element didn't exist previously, use the newElementInitialState function if provided.
             // If not, default to no transitions (scale: 1, y: 0)
-            var calculatedInverseTransform = oldRect
+            const calculatedInverseTransform = oldRect
                 ? {
                     scale: oldRect.width / newRect.width,
                     x: (oldRect.left + oldRect.right) / 2 - (newRect.left + newRect.right) / 2,
-                    y: (oldRect.top + oldRect.bottom) / 2 - (newRect.top + newRect.bottom) / 2
+                    y: (oldRect.top + oldRect.bottom) / 2 - (newRect.top + newRect.bottom) / 2,
                 }
                 : newElementInitialState
                     ? newElementInitialState(newRect)
                     : {};
-            var inverseTransform = __assign(__assign({}, noOpTransform), calculatedInverseTransform);
+            const inverseTransform = Object.assign(Object.assign({}, noOpTransform), calculatedInverseTransform);
             // Apply this initial change, without animating
             element.style.transitionProperty = 'none';
-            element.style.transform = "scale(".concat(inverseTransform.scale, ") translate(").concat(inverseTransform.x, "px, ").concat(inverseTransform.y, "px)");
+            element.style.transform = `scale(${inverseTransform.scale}) translate(${inverseTransform.x}px, ${inverseTransform.y}px)`;
             if (!oldRect) {
                 // If the element didn't exist, then fade it in
                 // (besides any other possibly defined transitions based on `newElementInitialState`)
@@ -55,49 +53,46 @@ export function animate(_a) {
         }
     }
     // Animate from the initial state to the end state
-    requestAnimationFrame(function () {
-        var ongoingAnimations = new Set();
-        var _loop_1 = function (id) {
-            var element = elements[id];
+    requestAnimationFrame(() => {
+        const ongoingAnimations = new Set();
+        for (const id in elements) {
+            const element = elements[id];
             if (element) {
-                var oldRect = oldState[id];
+                const oldRect = oldState[id];
                 if (oldRect) {
                     // Animate from here on
-                    element.style.transitionProperty = "transform";
+                    element.style.transitionProperty = `transform`;
                     // Unset inline CSS transforms so that the final state is applied
                     element.style.transform = '';
                 }
                 else {
                     // If the element didn't exist previously, fade in as well
-                    element.style.transitionProperty = "transform, opacity";
+                    element.style.transitionProperty = `transform, opacity`;
                     element.style.transform = '';
                     element.style.opacity = '';
                 }
-                var onTransitionStart_1 = function (event) {
+                const onTransitionStart = (event) => {
                     if (event.target === element) {
                         ongoingAnimations.add(id);
-                        element.removeEventListener('transitionstart', onTransitionStart_1);
+                        element.removeEventListener('transitionstart', onTransitionStart);
                     }
                 };
-                var onTransitionEnd_1 = function (event) {
+                const onTransitionEnd = (event) => {
                     if (event.target === element) {
                         // Clean up remaining inline styles
                         element.style.transitionProperty = '';
-                        element.removeEventListener('transitionstart', onTransitionEnd_1);
+                        element.removeEventListener('transitionstart', onTransitionEnd);
                         if (onTransitionsEnd) {
-                            ongoingAnimations["delete"](id);
+                            ongoingAnimations.delete(id);
                             if (ongoingAnimations.size === 0) {
                                 onTransitionsEnd();
                             }
                         }
                     }
                 };
-                element.addEventListener('transitionstart', onTransitionStart_1);
-                element.addEventListener('transitionend', onTransitionEnd_1);
+                element.addEventListener('transitionstart', onTransitionStart);
+                element.addEventListener('transitionend', onTransitionEnd);
             }
-        };
-        for (var id in elements) {
-            _loop_1(id);
         }
     });
 }

package/internal/animate.js.map

@@ -1 +1 @@
-{"version":3,"file":"animate.js","sourceRoot":"","sources":["../../../src/internal/animate.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport function getDOMRects(elements: Record<string | number, HTMLElement | null>) {\n  const rects: Record<string, DOMRect> = {};\n  for (const id in elements) {\n    const element = elements[id];\n    if (element) {\n      rects[id] = element.getBoundingClientRect();\n    }\n  }\n  return rects;\n}\n\n/*\n  Animate DOM elements based on the FLIP technique\n  - https://aerotwist.com/blog/flip-your-animations/\n  - https://css-tricks.com/animating-layouts-with-the-flip-technique/\n\n  This can be useful when the initial dimensions or position of the element is not known,\n  so the initial offset or scaling needs to be retrieved via JS.\n\n  Caveat: this currently does not support elements having CSS transforms in the end state.\n  These would be overridden in the animation instead of combined.\n */\nexport function animate({\n  oldState,\n  elements,\n  onTransitionsEnd,\n  newElementInitialState,\n}: {\n  elements: Record<string | number, HTMLElement | null>;\n  oldState: Record<string | number, DOMRect>;\n  onTransitionsEnd?: () => void;\n  newElementInitialState?: (newRect: DOMRect) => { scale?: number; y?: number };\n}) {\n  // First, apply the transform that will make the elements \"look like\" in the start position\n  for (const id in elements) {\n    const element = elements[id];\n    const oldRect = oldState[id];\n    if (element) {\n      const newRect = element.getBoundingClientRect();\n      const noOpTransform = { scale: 1, x: 0, y: 0 };\n      // Calculate initial position.\n      // If the element didn't exist previously, use the newElementInitialState function if provided.\n      // If not, default to no transitions (scale: 1, y: 0)\n      const calculatedInverseTransform = oldRect\n        ? {\n            scale: oldRect.width / newRect.width,\n            x: (oldRect.left + oldRect.right) / 2 - (newRect.left + newRect.right) / 2,\n            y: (oldRect.top + oldRect.bottom) / 2 - (newRect.top + newRect.bottom) / 2,\n          }\n        : newElementInitialState\n        ? newElementInitialState(newRect)\n        : {};\n      const inverseTransform = { ...noOpTransform, ...calculatedInverseTransform };\n      // Apply this initial change, without animating\n      element.style.transitionProperty = 'none';\n      element.style.transform = `scale(${inverseTransform.scale}) translate(${inverseTransform.x}px, ${inverseTransform.y}px)`;\n      if (!oldRect) {\n        // If the element didn't exist, then fade it in\n        // (besides any other possibly defined transitions based on `newElementInitialState`)\n        element.style.opacity = '0';\n      }\n    }\n  }\n\n  // Animate from the initial state to the end state\n  requestAnimationFrame(() => {\n    const ongoingAnimations = new Set();\n    for (const id in elements) {\n      const element = elements[id];\n      if (element) {\n        const oldRect = oldState[id];\n        if (oldRect) {\n          // Animate from here on\n          element.style.transitionProperty = `transform`;\n          // Unset inline CSS transforms so that the final state is applied\n          element.style.transform = '';\n        } else {\n          // If the element didn't exist previously, fade in as well\n          element.style.transitionProperty = `transform, opacity`;\n          element.style.transform = '';\n          element.style.opacity = '';\n        }\n        const onTransitionStart = (event: TransitionEvent) => {\n          if (event.target === element) {\n            ongoingAnimations.add(id);\n            element.removeEventListener('transitionstart', onTransitionStart);\n          }\n        };\n        const onTransitionEnd = (event: TransitionEvent) => {\n          if (event.target === element) {\n            // Clean up remaining inline styles\n            element.style.transitionProperty = '';\n            element.removeEventListener('transitionstart', onTransitionEnd);\n            if (onTransitionsEnd) {\n              ongoingAnimations.delete(id);\n              if (ongoingAnimations.size === 0) {\n                onTransitionsEnd();\n              }\n            }\n          }\n        };\n        element.addEventListener('transitionstart', onTransitionStart);\n        element.addEventListener('transitionend', onTransitionEnd);\n      }\n    }\n  });\n}\n"]}
+{"version":3,"file":"animate.js","sourceRoot":"","sources":["../../../src/internal/animate.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,MAAM,UAAU,WAAW,CAAC,QAAqD;IAC/E,MAAM,KAAK,GAA4B,EAAE,CAAC;IAC1C,KAAK,MAAM,EAAE,IAAI,QAAQ,EAAE;QACzB,MAAM,OAAO,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC7B,IAAI,OAAO,EAAE;YACX,KAAK,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;SAC7C;KACF;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,QAAQ,EACR,gBAAgB,EAChB,sBAAsB,GAMvB;IACC,2FAA2F;IAC3F,KAAK,MAAM,EAAE,IAAI,QAAQ,EAAE;QACzB,MAAM,OAAO,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC7B,MAAM,OAAO,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC7B,IAAI,OAAO,EAAE;YACX,MAAM,OAAO,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;YAChD,MAAM,aAAa,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;YAC/C,8BAA8B;YAC9B,+FAA+F;YAC/F,qDAAqD;YACrD,MAAM,0BAA0B,GAAG,OAAO;gBACxC,CAAC,CAAC;oBACE,KAAK,EAAE,OAAO,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK;oBACpC,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC;oBAC1E,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC;iBAC3E;gBACH,CAAC,CAAC,sBAAsB;oBACxB,CAAC,CAAC,sBAAsB,CAAC,OAAO,CAAC;oBACjC,CAAC,CAAC,EAAE,CAAC;YACP,MAAM,gBAAgB,mCAAQ,aAAa,GAAK,0BAA0B,CAAE,CAAC;YAC7E,+CAA+C;YAC/C,OAAO,CAAC,KAAK,CAAC,kBAAkB,GAAG,MAAM,CAAC;YAC1C,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,SAAS,gBAAgB,CAAC,KAAK,eAAe,gBAAgB,CAAC,CAAC,OAAO,gBAAgB,CAAC,CAAC,KAAK,CAAC;YACzH,IAAI,CAAC,OAAO,EAAE;gBACZ,+CAA+C;gBAC/C,qFAAqF;gBACrF,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC;aAC7B;SACF;KACF;IAED,kDAAkD;IAClD,qBAAqB,CAAC,GAAG,EAAE;QACzB,MAAM,iBAAiB,GAAG,IAAI,GAAG,EAAE,CAAC;QACpC,KAAK,MAAM,EAAE,IAAI,QAAQ,EAAE;YACzB,MAAM,OAAO,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;YAC7B,IAAI,OAAO,EAAE;gBACX,MAAM,OAAO,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;gBAC7B,IAAI,OAAO,EAAE;oBACX,uBAAuB;oBACvB,OAAO,CAAC,KAAK,CAAC,kBAAkB,GAAG,WAAW,CAAC;oBAC/C,iEAAiE;oBACjE,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;iBAC9B;qBAAM;oBACL,0DAA0D;oBAC1D,OAAO,CAAC,KAAK,CAAC,kBAAkB,GAAG,oBAAoB,CAAC;oBACxD,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;oBAC7B,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;iBAC5B;gBACD,MAAM,iBAAiB,GAAG,CAAC,KAAsB,EAAE,EAAE;oBACnD,IAAI,KAAK,CAAC,MAAM,KAAK,OAAO,EAAE;wBAC5B,iBAAiB,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;wBAC1B,OAAO,CAAC,mBAAmB,CAAC,iBAAiB,EAAE,iBAAiB,CAAC,CAAC;qBACnE;gBACH,CAAC,CAAC;gBACF,MAAM,eAAe,GAAG,CAAC,KAAsB,EAAE,EAAE;oBACjD,IAAI,KAAK,CAAC,MAAM,KAAK,OAAO,EAAE;wBAC5B,mCAAmC;wBACnC,OAAO,CAAC,KAAK,CAAC,kBAAkB,GAAG,EAAE,CAAC;wBACtC,OAAO,CAAC,mBAAmB,CAAC,iBAAiB,EAAE,eAAe,CAAC,CAAC;wBAChE,IAAI,gBAAgB,EAAE;4BACpB,iBAAiB,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;4BAC7B,IAAI,iBAAiB,CAAC,IAAI,KAAK,CAAC,EAAE;gCAChC,gBAAgB,EAAE,CAAC;6BACpB;yBACF;qBACF;gBACH,CAAC,CAAC;gBACF,OAAO,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,iBAAiB,CAAC,CAAC;gBAC/D,OAAO,CAAC,gBAAgB,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC;aAC5D;SACF;IACH,CAAC,CAAC,CAAC;AACL,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport function getDOMRects(elements: Record<string | number, HTMLElement | null>) {\n  const rects: Record<string, DOMRect> = {};\n  for (const id in elements) {\n    const element = elements[id];\n    if (element) {\n      rects[id] = element.getBoundingClientRect();\n    }\n  }\n  return rects;\n}\n\n/*\n  Animate DOM elements based on the FLIP technique\n  - https://aerotwist.com/blog/flip-your-animations/\n  - https://css-tricks.com/animating-layouts-with-the-flip-technique/\n\n  This can be useful when the initial dimensions or position of the element is not known,\n  so the initial offset or scaling needs to be retrieved via JS.\n\n  Caveat: this currently does not support elements having CSS transforms in the end state.\n  These would be overridden in the animation instead of combined.\n */\nexport function animate({\n  oldState,\n  elements,\n  onTransitionsEnd,\n  newElementInitialState,\n}: {\n  elements: Record<string | number, HTMLElement | null>;\n  oldState: Record<string | number, DOMRect>;\n  onTransitionsEnd?: () => void;\n  newElementInitialState?: (newRect: DOMRect) => { scale?: number; y?: number };\n}) {\n  // First, apply the transform that will make the elements \"look like\" in the start position\n  for (const id in elements) {\n    const element = elements[id];\n    const oldRect = oldState[id];\n    if (element) {\n      const newRect = element.getBoundingClientRect();\n      const noOpTransform = { scale: 1, x: 0, y: 0 };\n      // Calculate initial position.\n      // If the element didn't exist previously, use the newElementInitialState function if provided.\n      // If not, default to no transitions (scale: 1, y: 0)\n      const calculatedInverseTransform = oldRect\n        ? {\n            scale: oldRect.width / newRect.width,\n            x: (oldRect.left + oldRect.right) / 2 - (newRect.left + newRect.right) / 2,\n            y: (oldRect.top + oldRect.bottom) / 2 - (newRect.top + newRect.bottom) / 2,\n          }\n        : newElementInitialState\n        ? newElementInitialState(newRect)\n        : {};\n      const inverseTransform = { ...noOpTransform, ...calculatedInverseTransform };\n      // Apply this initial change, without animating\n      element.style.transitionProperty = 'none';\n      element.style.transform = `scale(${inverseTransform.scale}) translate(${inverseTransform.x}px, ${inverseTransform.y}px)`;\n      if (!oldRect) {\n        // If the element didn't exist, then fade it in\n        // (besides any other possibly defined transitions based on `newElementInitialState`)\n        element.style.opacity = '0';\n      }\n    }\n  }\n\n  // Animate from the initial state to the end state\n  requestAnimationFrame(() => {\n    const ongoingAnimations = new Set();\n    for (const id in elements) {\n      const element = elements[id];\n      if (element) {\n        const oldRect = oldState[id];\n        if (oldRect) {\n          // Animate from here on\n          element.style.transitionProperty = `transform`;\n          // Unset inline CSS transforms so that the final state is applied\n          element.style.transform = '';\n        } else {\n          // If the element didn't exist previously, fade in as well\n          element.style.transitionProperty = `transform, opacity`;\n          element.style.transform = '';\n          element.style.opacity = '';\n        }\n        const onTransitionStart = (event: TransitionEvent) => {\n          if (event.target === element) {\n            ongoingAnimations.add(id);\n            element.removeEventListener('transitionstart', onTransitionStart);\n          }\n        };\n        const onTransitionEnd = (event: TransitionEvent) => {\n          if (event.target === element) {\n            // Clean up remaining inline styles\n            element.style.transitionProperty = '';\n            element.removeEventListener('transitionstart', onTransitionEnd);\n            if (onTransitionsEnd) {\n              ongoingAnimations.delete(id);\n              if (ongoingAnimations.size === 0) {\n                onTransitionsEnd();\n              }\n            }\n          }\n        };\n        element.addEventListener('transitionstart', onTransitionStart);\n        element.addEventListener('transitionend', onTransitionEnd);\n      }\n    }\n  });\n}\n"]}

package/internal/base-component/index.js

@@ -6,8 +6,8 @@ import { PACKAGE_SOURCE, PACKAGE_VERSION } from '../environment';
 import { initAwsUiVersions } from './init-awsui-versions.js';
 initAwsUiVersions(PACKAGE_SOURCE, PACKAGE_VERSION);
 export function getBaseProps(props) {
-    var baseProps = {};
-    Object.keys(props).forEach(function (prop) {
+    const baseProps = {};
+    Object.keys(props).forEach(prop => {
         if (prop === 'id' || prop === 'className' || prop.match(/^data-/)) {
             baseProps[prop] = props[prop];
         }

package/internal/base-component/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/base-component/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,gEAAgE;AAChE,OAAO,iBAAiB,CAAC;AACzB,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,iBAAiB,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;AAkBnD,MAAM,UAAU,YAAY,CAAC,KAAyB;IACpD,IAAM,SAAS,GAAwB,EAAE,CAAC;IAC1C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAA,IAAI;QAC7B,IAAI,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,WAAW,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE;YACjE,SAAS,CAAC,IAAI,CAAC,GAAI,KAA6B,CAAC,IAAI,CAAC,CAAC;SACxD;IACH,CAAC,CAAC,CAAC;IACH,OAAO,SAA+B,CAAC;AACzC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n// these styles needed to be imported for every public component\nimport './styles.css.js';\nimport { PACKAGE_SOURCE, PACKAGE_VERSION } from '../environment';\nimport { initAwsUiVersions } from './init-awsui-versions.js';\n\ninitAwsUiVersions(PACKAGE_SOURCE, PACKAGE_VERSION);\n\nexport interface BaseComponentProps {\n  /**\n   * Adds the specified classes to the root element of the component.\n   * @deprecated Custom CSS is not supported. For other use cases, use [data attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes).\n   */\n  className?: string;\n  /**\n   * Adds the specified ID to the root element of the component.\n   * @deprecated Custom CSS is not supported. For other use cases, use [data attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes).\n   */\n  id?: string;\n  // we also support data-* attributes, but they are always implicitly allowed by typescript\n  // http://www.typescriptlang.org/docs/handbook/jsx.html#attribute-type-checking\n  // \"Note: If an attribute name is not a valid JS identifier (like a data-* attribute), it is not considered to be an error\"\n}\n\nexport function getBaseProps(props: BaseComponentProps) {\n  const baseProps: Record<string, any> = {};\n  Object.keys(props).forEach(prop => {\n    if (prop === 'id' || prop === 'className' || prop.match(/^data-/)) {\n      baseProps[prop] = (props as Record<string, any>)[prop];\n    }\n  });\n  return baseProps as BaseComponentProps;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal/base-component/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,gEAAgE;AAChE,OAAO,iBAAiB,CAAC;AACzB,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE7D,iBAAiB,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;AAkBnD,MAAM,UAAU,YAAY,CAAC,KAAyB;IACpD,MAAM,SAAS,GAAwB,EAAE,CAAC;IAC1C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QAChC,IAAI,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,WAAW,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE;YACjE,SAAS,CAAC,IAAI,CAAC,GAAI,KAA6B,CAAC,IAAI,CAAC,CAAC;SACxD;IACH,CAAC,CAAC,CAAC;IACH,OAAO,SAA+B,CAAC;AACzC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n// these styles needed to be imported for every public component\nimport './styles.css.js';\nimport { PACKAGE_SOURCE, PACKAGE_VERSION } from '../environment';\nimport { initAwsUiVersions } from './init-awsui-versions.js';\n\ninitAwsUiVersions(PACKAGE_SOURCE, PACKAGE_VERSION);\n\nexport interface BaseComponentProps {\n  /**\n   * Adds the specified classes to the root element of the component.\n   * @deprecated Custom CSS is not supported. For other use cases, use [data attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes).\n   */\n  className?: string;\n  /**\n   * Adds the specified ID to the root element of the component.\n   * @deprecated Custom CSS is not supported. For other use cases, use [data attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes).\n   */\n  id?: string;\n  // we also support data-* attributes, but they are always implicitly allowed by typescript\n  // http://www.typescriptlang.org/docs/handbook/jsx.html#attribute-type-checking\n  // \"Note: If an attribute name is not a valid JS identifier (like a data-* attribute), it is not considered to be an error\"\n}\n\nexport function getBaseProps(props: BaseComponentProps) {\n  const baseProps: Record<string, any> = {};\n  Object.keys(props).forEach(prop => {\n    if (prop === 'id' || prop === 'className' || prop.match(/^data-/)) {\n      baseProps[prop] = (props as Record<string, any>)[prop];\n    }\n  });\n  return baseProps as BaseComponentProps;\n}\n"]}

package/internal/breakpoints.js

@@ -1,4 +1,4 @@
-var BREAKPOINT_MAPPING = [
+const BREAKPOINT_MAPPING = [
     ['xl', 1840],
     ['l', 1320],
     ['m', 1120],
@@ -7,19 +7,15 @@ var BREAKPOINT_MAPPING = [
     ['xxs', 465],
     ['default', -1],
 ];
-export var mobileBreakpoint = BREAKPOINT_MAPPING.filter(function (b) { return b[0] === 'xs'; })[0][1];
-var BREAKPOINTS_DESCENDING = BREAKPOINT_MAPPING.map(function (_a) {
-    var bp = _a[0];
-    return bp;
-});
+export const mobileBreakpoint = BREAKPOINT_MAPPING.filter(b => b[0] === 'xs')[0][1];
+const BREAKPOINTS_DESCENDING = BREAKPOINT_MAPPING.map(([bp]) => bp);
 /**
  * Take a breakpoint mapping and return the breakpoint value that most closely matches the actual breakpoint.
  */
 export function matchBreakpointMapping(subset, actual) {
-    var qualifyingBreakpoints = BREAKPOINT_MAPPING.slice(BREAKPOINTS_DESCENDING.indexOf(actual));
-    for (var _i = 0, qualifyingBreakpoints_1 = qualifyingBreakpoints; _i < qualifyingBreakpoints_1.length; _i++) {
-        var breakpoint = qualifyingBreakpoints_1[_i][0];
-        var breakpointValue = subset[breakpoint];
+    const qualifyingBreakpoints = BREAKPOINT_MAPPING.slice(BREAKPOINTS_DESCENDING.indexOf(actual));
+    for (const [breakpoint] of qualifyingBreakpoints) {
+        const breakpointValue = subset[breakpoint];
         if (breakpointValue !== undefined) {
             return breakpointValue;
         }
@@ -30,8 +26,7 @@ export function matchBreakpointMapping(subset, actual) {
  * Get the named breakpoint for a provided width, optionally filtering to a subset of breakpoints.
  */
 export function getMatchingBreakpoint(width, breakpointFilter) {
-    for (var _i = 0, BREAKPOINT_MAPPING_1 = BREAKPOINT_MAPPING; _i < BREAKPOINT_MAPPING_1.length; _i++) {
-        var _a = BREAKPOINT_MAPPING_1[_i], breakpoint = _a[0], breakpointWidth = _a[1];
+    for (const [breakpoint, breakpointWidth] of BREAKPOINT_MAPPING) {
         if (width > breakpointWidth && (!breakpointFilter || breakpointFilter.indexOf(breakpoint) !== -1)) {
             return breakpoint;
         }

package/internal/breakpoints.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoints.js","sourceRoot":"","sources":["../../../src/internal/breakpoints.ts"],"names":[],"mappings":"AAIA,IAAM,kBAAkB,GAA2B;IACjD,CAAC,IAAI,EAAE,IAAI,CAAC;IACZ,CAAC,GAAG,EAAE,IAAI,CAAC;IACX,CAAC,GAAG,EAAE,IAAI,CAAC;IACX,CAAC,GAAG,EAAE,GAAG,CAAC;IACV,CAAC,IAAI,EAAE,GAAG,CAAC;IACX,CAAC,KAAK,EAAE,GAAG,CAAC;IACZ,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;CAChB,CAAC;AAEF,MAAM,CAAC,IAAM,gBAAgB,GAAG,kBAAkB,CAAC,MAAM,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,EAAb,CAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAEpF,IAAM,sBAAsB,GAAG,kBAAkB,CAAC,GAAG,CAAC,UAAC,EAAI;QAAH,EAAE,QAAA;IAAM,OAAA,EAAE;AAAF,CAAE,CAAC,CAAC;AAEpE;;GAEG;AACH,MAAM,UAAU,sBAAsB,CAAI,MAAsC,EAAE,MAAkB;IAClG,IAAM,qBAAqB,GAAG,kBAAkB,CAAC,KAAK,CAAC,sBAAsB,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/F,KAA2B,UAAqB,EAArB,+CAAqB,EAArB,mCAAqB,EAArB,IAAqB,EAAE;QAAtC,IAAA,UAAU,iCAAA;QACpB,IAAM,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;QAC3C,IAAI,eAAe,KAAK,SAAS,EAAE;YACjC,OAAO,eAAe,CAAC;SACxB;KACF;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,qBAAqB,CAAC,KAAa,EAAE,gBAAwC;IAC3F,KAA4C,UAAkB,EAAlB,yCAAkB,EAAlB,gCAAkB,EAAlB,IAAkB,EAAE;QAArD,IAAA,6BAA6B,EAA5B,UAAU,QAAA,EAAE,eAAe,QAAA;QACrC,IAAI,KAAK,GAAG,eAAe,IAAI,CAAC,CAAC,gBAAgB,IAAI,gBAAgB,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;YACjG,OAAO,UAAU,CAAC;SACnB;KACF;IACD,OAAO,SAAS,CAAC;AACnB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nexport type Breakpoint = 'default' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';\n\nconst BREAKPOINT_MAPPING: [Breakpoint, number][] = [\n  ['xl', 1840],\n  ['l', 1320],\n  ['m', 1120],\n  ['s', 912],\n  ['xs', 688],\n  ['xxs', 465],\n  ['default', -1],\n];\n\nexport const mobileBreakpoint = BREAKPOINT_MAPPING.filter(b => b[0] === 'xs')[0][1];\n\nconst BREAKPOINTS_DESCENDING = BREAKPOINT_MAPPING.map(([bp]) => bp);\n\n/**\n * Take a breakpoint mapping and return the breakpoint value that most closely matches the actual breakpoint.\n */\nexport function matchBreakpointMapping<T>(subset: Partial<Record<Breakpoint, T>>, actual: Breakpoint): T | null {\n  const qualifyingBreakpoints = BREAKPOINT_MAPPING.slice(BREAKPOINTS_DESCENDING.indexOf(actual));\n  for (const [breakpoint] of qualifyingBreakpoints) {\n    const breakpointValue = subset[breakpoint];\n    if (breakpointValue !== undefined) {\n      return breakpointValue;\n    }\n  }\n  return null;\n}\n\n/**\n * Get the named breakpoint for a provided width, optionally filtering to a subset of breakpoints.\n */\nexport function getMatchingBreakpoint(width: number, breakpointFilter?: readonly Breakpoint[]): Breakpoint {\n  for (const [breakpoint, breakpointWidth] of BREAKPOINT_MAPPING) {\n    if (width > breakpointWidth && (!breakpointFilter || breakpointFilter.indexOf(breakpoint) !== -1)) {\n      return breakpoint;\n    }\n  }\n  return 'default';\n}\n"]}
+{"version":3,"file":"breakpoints.js","sourceRoot":"","sources":["../../../src/internal/breakpoints.ts"],"names":[],"mappings":"AAIA,MAAM,kBAAkB,GAA2B;IACjD,CAAC,IAAI,EAAE,IAAI,CAAC;IACZ,CAAC,GAAG,EAAE,IAAI,CAAC;IACX,CAAC,GAAG,EAAE,IAAI,CAAC;IACX,CAAC,GAAG,EAAE,GAAG,CAAC;IACV,CAAC,IAAI,EAAE,GAAG,CAAC;IACX,CAAC,KAAK,EAAE,GAAG,CAAC;IACZ,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAEpF,MAAM,sBAAsB,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC;AAEpE;;GAEG;AACH,MAAM,UAAU,sBAAsB,CAAI,MAAsC,EAAE,MAAkB;IAClG,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,KAAK,CAAC,sBAAsB,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/F,KAAK,MAAM,CAAC,UAAU,CAAC,IAAI,qBAAqB,EAAE;QAChD,MAAM,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;QAC3C,IAAI,eAAe,KAAK,SAAS,EAAE;YACjC,OAAO,eAAe,CAAC;SACxB;KACF;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,qBAAqB,CAAC,KAAa,EAAE,gBAAwC;IAC3F,KAAK,MAAM,CAAC,UAAU,EAAE,eAAe,CAAC,IAAI,kBAAkB,EAAE;QAC9D,IAAI,KAAK,GAAG,eAAe,IAAI,CAAC,CAAC,gBAAgB,IAAI,gBAAgB,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;YACjG,OAAO,UAAU,CAAC;SACnB;KACF;IACD,OAAO,SAAS,CAAC;AACnB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nexport type Breakpoint = 'default' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';\n\nconst BREAKPOINT_MAPPING: [Breakpoint, number][] = [\n  ['xl', 1840],\n  ['l', 1320],\n  ['m', 1120],\n  ['s', 912],\n  ['xs', 688],\n  ['xxs', 465],\n  ['default', -1],\n];\n\nexport const mobileBreakpoint = BREAKPOINT_MAPPING.filter(b => b[0] === 'xs')[0][1];\n\nconst BREAKPOINTS_DESCENDING = BREAKPOINT_MAPPING.map(([bp]) => bp);\n\n/**\n * Take a breakpoint mapping and return the breakpoint value that most closely matches the actual breakpoint.\n */\nexport function matchBreakpointMapping<T>(subset: Partial<Record<Breakpoint, T>>, actual: Breakpoint): T | null {\n  const qualifyingBreakpoints = BREAKPOINT_MAPPING.slice(BREAKPOINTS_DESCENDING.indexOf(actual));\n  for (const [breakpoint] of qualifyingBreakpoints) {\n    const breakpointValue = subset[breakpoint];\n    if (breakpointValue !== undefined) {\n      return breakpointValue;\n    }\n  }\n  return null;\n}\n\n/**\n * Get the named breakpoint for a provided width, optionally filtering to a subset of breakpoints.\n */\nexport function getMatchingBreakpoint(width: number, breakpointFilter?: readonly Breakpoint[]): Breakpoint {\n  for (const [breakpoint, breakpointWidth] of BREAKPOINT_MAPPING) {\n    if (width > breakpointWidth && (!breakpointFilter || breakpointFilter.indexOf(breakpoint) !== -1)) {\n      return breakpoint;\n    }\n  }\n  return 'default';\n}\n"]}

package/internal/components/abstract-switch/index.d.ts

@@ -4,6 +4,7 @@ export interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>,
     controlId?: string;
     controlClassName: string;
     outlineClassName: string;
+    showOutline?: boolean;
     disabled?: boolean;
     nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;
     styledControl: React.ReactElement;
@@ -15,5 +16,5 @@ export interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>,
     ariaDescribedby?: string;
     onClick: () => void;
 }
-export default function AbstractSwitch({ controlId, controlClassName, outlineClassName, disabled, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, onClick, __internalRootRef, ...rest }: AbstractSwitchProps): JSX.Element;
+export default function AbstractSwitch({ controlId, controlClassName, outlineClassName, showOutline, disabled, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, onClick, __internalRootRef, ...rest }: AbstractSwitchProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/internal/components/abstract-switch/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,0BAA0B;IACxG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1F,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAMD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,OAAO,EACP,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eAiErB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,0BAA0B;IACxG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1F,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAMD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,OAAO,EACP,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eAiErB"}

package/internal/components/abstract-switch/index.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
@@ -7,41 +7,41 @@ import styles from './styles.css.js';
 import useFocusVisible from '../../hooks/focus-visible';
 import { useUniqueId } from '../../hooks/use-unique-id';
 function joinString(values) {
-    return values.filter(function (value) { return !!value; }).join(' ');
+    return values.filter((value) => !!value).join(' ');
 }
 export default function AbstractSwitch(_a) {
-    var _b, _c;
-    var controlId = _a.controlId, controlClassName = _a.controlClassName, outlineClassName = _a.outlineClassName, disabled = _a.disabled, nativeControl = _a.nativeControl, styledControl = _a.styledControl, label = _a.label, description = _a.description, descriptionBottomPadding = _a.descriptionBottomPadding, ariaLabel = _a.ariaLabel, ariaLabelledby = _a.ariaLabelledby, ariaDescribedby = _a.ariaDescribedby, onClick = _a.onClick, __internalRootRef = _a.__internalRootRef, rest = __rest(_a, ["controlId", "controlClassName", "outlineClassName", "disabled", "nativeControl", "styledControl", "label", "description", "descriptionBottomPadding", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "onClick", "__internalRootRef"]);
-    var uniqueId = useUniqueId();
-    var id = controlId || uniqueId;
-    var focusVisible = useFocusVisible();
-    var labelId = "".concat(id, "-label");
-    var descriptionId = "".concat(id, "-description");
-    var ariaLabelledByIds = [];
+    var { controlId, controlClassName, outlineClassName, showOutline, disabled, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, onClick, __internalRootRef } = _a, rest = __rest(_a, ["controlId", "controlClassName", "outlineClassName", "showOutline", "disabled", "nativeControl", "styledControl", "label", "description", "descriptionBottomPadding", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "onClick", "__internalRootRef"]);
+    const uniqueId = useUniqueId();
+    const id = controlId || uniqueId;
+    const focusVisible = useFocusVisible();
+    const labelId = `${id}-label`;
+    const descriptionId = `${id}-description`;
+    const ariaLabelledByIds = [];
     if (label) {
         ariaLabelledByIds.push(labelId);
     }
     if (ariaLabelledby) {
         ariaLabelledByIds.push(ariaLabelledby);
     }
-    var ariaDescriptons = [];
+    const ariaDescriptons = [];
     if (ariaDescribedby) {
         ariaDescriptons.push(ariaDescribedby);
     }
     if (description) {
         ariaDescriptons.push(descriptionId);
     }
-    return (React.createElement("span", __assign({}, rest, { className: clsx(styles.wrapper, rest.className), ref: __internalRootRef }),
+    return (React.createElement("span", Object.assign({}, rest, { className: clsx(styles.wrapper, rest.className), ref: __internalRootRef }),
         React.createElement("span", { className: styles['label-wrapper'], "aria-disabled": disabled ? 'true' : undefined, onClick: disabled ? undefined : onClick },
             React.createElement("span", { className: clsx(styles.control, controlClassName) },
                 styledControl,
-                nativeControl(__assign(__assign({}, focusVisible), { id: id, disabled: disabled, className: styles['native-input'], 'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined, 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined, 'aria-label': ariaLabel })),
-                React.createElement("span", { className: clsx(styles.outline, outlineClassName) })),
+                nativeControl(Object.assign(Object.assign({}, focusVisible), { id,
+                    disabled, className: styles['native-input'], 'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined, 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined, 'aria-label': ariaLabel })),
+                React.createElement("span", { className: clsx(styles.outline, outlineClassName, showOutline && styles['show-outline']) })),
             React.createElement("span", { className: clsx(styles.content, !label && !description && styles['empty-content']) },
-                label && (React.createElement("span", { id: labelId, className: clsx(styles.label, (_b = {}, _b[styles['label-disabled']] = disabled, _b)) }, label)),
-                description && (React.createElement("span", { id: descriptionId, className: clsx(styles.description, (_c = {},
-                        _c[styles['description-disabled']] = disabled,
-                        _c[styles['description-bottom-padding']] = descriptionBottomPadding,
-                        _c)) }, description))))));
+                label && (React.createElement("span", { id: labelId, className: clsx(styles.label, { [styles['label-disabled']]: disabled }) }, label)),
+                description && (React.createElement("span", { id: descriptionId, className: clsx(styles.description, {
+                        [styles['description-disabled']]: disabled,
+                        [styles['description-bottom-padding']]: descriptionBottomPadding,
+                    }) }, description))))));
 }
 //# sourceMappingURL=index.js.map

package/internal/components/abstract-switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/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';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport useFocusVisible from '../../hooks/focus-visible';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\n\nexport interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>, InternalBaseComponentProps {\n  controlId?: string;\n  controlClassName: string;\n  outlineClassName: string;\n  disabled?: boolean;\n  nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;\n  styledControl: React.ReactElement;\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n  descriptionBottomPadding?: boolean;\n  ariaLabel?: string;\n  ariaLabelledby?: string;\n  ariaDescribedby?: string;\n  onClick: () => void;\n}\n\nfunction joinString(values: (string | undefined)[]) {\n  return values.filter((value): value is string => !!value).join(' ');\n}\n\nexport default function AbstractSwitch({\n  controlId,\n  controlClassName,\n  outlineClassName,\n  disabled,\n  nativeControl,\n  styledControl,\n  label,\n  description,\n  descriptionBottomPadding,\n  ariaLabel,\n  ariaLabelledby,\n  ariaDescribedby,\n  onClick,\n  __internalRootRef,\n  ...rest\n}: AbstractSwitchProps) {\n  const uniqueId = useUniqueId();\n  const id = controlId || uniqueId;\n\n  const focusVisible = useFocusVisible();\n  const labelId = `${id}-label`;\n  const descriptionId = `${id}-description`;\n\n  const ariaLabelledByIds = [];\n  if (label) {\n    ariaLabelledByIds.push(labelId);\n  }\n  if (ariaLabelledby) {\n    ariaLabelledByIds.push(ariaLabelledby);\n  }\n\n  const ariaDescriptons = [];\n  if (ariaDescribedby) {\n    ariaDescriptons.push(ariaDescribedby);\n  }\n  if (description) {\n    ariaDescriptons.push(descriptionId);\n  }\n\n  return (\n    <span {...rest} className={clsx(styles.wrapper, rest.className)} ref={__internalRootRef}>\n      <span\n        className={styles['label-wrapper']}\n        aria-disabled={disabled ? 'true' : undefined}\n        onClick={disabled ? undefined : onClick}\n      >\n        <span className={clsx(styles.control, controlClassName)}>\n          {styledControl}\n          {nativeControl({\n            ...focusVisible,\n            id,\n            disabled,\n            className: styles['native-input'],\n            'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined,\n            'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined,\n            'aria-label': ariaLabel,\n          })}\n          <span className={clsx(styles.outline, outlineClassName)} />\n        </span>\n        <span className={clsx(styles.content, !label && !description && styles['empty-content'])}>\n          {label && (\n            <span id={labelId} className={clsx(styles.label, { [styles['label-disabled']]: disabled })}>\n              {label}\n            </span>\n          )}\n          {description && (\n            <span\n              id={descriptionId}\n              className={clsx(styles.description, {\n                [styles['description-disabled']]: disabled,\n                [styles['description-bottom-padding']]: descriptionBottomPadding,\n              })}\n            >\n              {description}\n            </span>\n          )}\n        </span>\n      </span>\n    </span>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/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';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport useFocusVisible from '../../hooks/focus-visible';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\n\nexport interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>, InternalBaseComponentProps {\n  controlId?: string;\n  controlClassName: string;\n  outlineClassName: string;\n  showOutline?: boolean;\n  disabled?: boolean;\n  nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;\n  styledControl: React.ReactElement;\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n  descriptionBottomPadding?: boolean;\n  ariaLabel?: string;\n  ariaLabelledby?: string;\n  ariaDescribedby?: string;\n  onClick: () => void;\n}\n\nfunction joinString(values: (string | undefined)[]) {\n  return values.filter((value): value is string => !!value).join(' ');\n}\n\nexport default function AbstractSwitch({\n  controlId,\n  controlClassName,\n  outlineClassName,\n  showOutline,\n  disabled,\n  nativeControl,\n  styledControl,\n  label,\n  description,\n  descriptionBottomPadding,\n  ariaLabel,\n  ariaLabelledby,\n  ariaDescribedby,\n  onClick,\n  __internalRootRef,\n  ...rest\n}: AbstractSwitchProps) {\n  const uniqueId = useUniqueId();\n  const id = controlId || uniqueId;\n\n  const focusVisible = useFocusVisible();\n  const labelId = `${id}-label`;\n  const descriptionId = `${id}-description`;\n\n  const ariaLabelledByIds = [];\n  if (label) {\n    ariaLabelledByIds.push(labelId);\n  }\n  if (ariaLabelledby) {\n    ariaLabelledByIds.push(ariaLabelledby);\n  }\n\n  const ariaDescriptons = [];\n  if (ariaDescribedby) {\n    ariaDescriptons.push(ariaDescribedby);\n  }\n  if (description) {\n    ariaDescriptons.push(descriptionId);\n  }\n\n  return (\n    <span {...rest} className={clsx(styles.wrapper, rest.className)} ref={__internalRootRef}>\n      <span\n        className={styles['label-wrapper']}\n        aria-disabled={disabled ? 'true' : undefined}\n        onClick={disabled ? undefined : onClick}\n      >\n        <span className={clsx(styles.control, controlClassName)}>\n          {styledControl}\n          {nativeControl({\n            ...focusVisible,\n            id,\n            disabled,\n            className: styles['native-input'],\n            'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined,\n            'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined,\n            'aria-label': ariaLabel,\n          })}\n          <span className={clsx(styles.outline, outlineClassName, showOutline && styles['show-outline'])} />\n        </span>\n        <span className={clsx(styles.content, !label && !description && styles['empty-content'])}>\n          {label && (\n            <span id={labelId} className={clsx(styles.label, { [styles['label-disabled']]: disabled })}>\n              {label}\n            </span>\n          )}\n          {description && (\n            <span\n              id={descriptionId}\n              className={clsx(styles.description, {\n                [styles['description-disabled']]: disabled,\n                [styles['description-bottom-padding']]: descriptionBottomPadding,\n              })}\n            >\n              {description}\n            </span>\n          )}\n        </span>\n      </span>\n    </span>\n  );\n}\n"]}

package/internal/components/abstract-switch/styles.css.js

@@ -1,17 +1,18 @@
 
     import './styles.scoped.css';
     export default {
-  "content": "awsui_content_1wepg_voiq5_93",
-  "description": "awsui_description_1wepg_voiq5_94",
-  "label": "awsui_label_1wepg_voiq5_95",
-  "outline": "awsui_outline_1wepg_voiq5_99",
-  "native-input": "awsui_native-input_1wepg_voiq5_103",
-  "wrapper": "awsui_wrapper_1wepg_voiq5_110",
-  "label-wrapper": "awsui_label-wrapper_1wepg_voiq5_117",
-  "empty-content": "awsui_empty-content_1wepg_voiq5_129",
-  "description-bottom-padding": "awsui_description-bottom-padding_1wepg_voiq5_139",
-  "label-disabled": "awsui_label-disabled_1wepg_voiq5_147",
-  "description-disabled": "awsui_description-disabled_1wepg_voiq5_148",
-  "control": "awsui_control_1wepg_voiq5_153"
+  "content": "awsui_content_1wepg_w9dfp_93",
+  "description": "awsui_description_1wepg_w9dfp_94",
+  "label": "awsui_label_1wepg_w9dfp_95",
+  "outline": "awsui_outline_1wepg_w9dfp_99",
+  "show-outline": "awsui_show-outline_1wepg_w9dfp_102",
+  "native-input": "awsui_native-input_1wepg_w9dfp_106",
+  "wrapper": "awsui_wrapper_1wepg_w9dfp_110",
+  "label-wrapper": "awsui_label-wrapper_1wepg_w9dfp_117",
+  "empty-content": "awsui_empty-content_1wepg_w9dfp_129",
+  "description-bottom-padding": "awsui_description-bottom-padding_1wepg_w9dfp_139",
+  "label-disabled": "awsui_label-disabled_1wepg_w9dfp_147",
+  "description-disabled": "awsui_description-disabled_1wepg_w9dfp_148",
+  "control": "awsui_control_1wepg_w9dfp_153"
 };
   

package/internal/components/abstract-switch/styles.scoped.css

@@ -90,77 +90,77 @@ 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_content_1wepg_voiq5_93:not(#\9),
-.awsui_description_1wepg_voiq5_94:not(#\9),
-.awsui_label_1wepg_voiq5_95:not(#\9) {
+.awsui_content_1wepg_w9dfp_93:not(#\9),
+.awsui_description_1wepg_w9dfp_94:not(#\9),
+.awsui_label_1wepg_w9dfp_95:not(#\9) {
   display: block;
 }
 
-.awsui_outline_1wepg_voiq5_99:not(#\9) {
+.awsui_outline_1wepg_w9dfp_99:not(#\9) {
   display: none;
 }
-
-.awsui_native-input_1wepg_voiq5_103[data-awsui-focus-visible=true]:not(#\9):focus {
-  /* stylelint-disable-next-line selector-max-type, @cloudscape-design/no-implicit-descendant */
+.awsui_outline_1wepg_w9dfp_99.awsui_show-outline_1wepg_w9dfp_102:not(#\9) {
+  display: block;
 }
-.awsui_native-input_1wepg_voiq5_103[data-awsui-focus-visible=true]:not(#\9):focus + .awsui_outline_1wepg_voiq5_99 {
+
+.awsui_native-input_1wepg_w9dfp_106[data-awsui-focus-visible=true]:not(#\9):focus + .awsui_outline_1wepg_w9dfp_99 {
   display: block;
 }
 
-.awsui_wrapper_1wepg_voiq5_110:not(#\9) {
+.awsui_wrapper_1wepg_w9dfp_110:not(#\9) {
   min-width: 0;
   -ms-word-break: break-all;
   word-break: break-word;
   display: flex;
 }
 
-.awsui_label-wrapper_1wepg_voiq5_117:not(#\9) {
+.awsui_label-wrapper_1wepg_w9dfp_117:not(#\9) {
   position: relative;
   display: flex;
   cursor: default;
 }
 
-.awsui_content_1wepg_voiq5_93:not(#\9) {
+.awsui_content_1wepg_w9dfp_93:not(#\9) {
   min-width: 0;
   -ms-word-break: break-all;
   word-break: break-word;
 }
 
-.awsui_empty-content_1wepg_voiq5_129:not(#\9) {
+.awsui_empty-content_1wepg_w9dfp_129:not(#\9) {
   width: 0px;
 }
 
-.awsui_description_1wepg_voiq5_94:not(#\9) {
+.awsui_description_1wepg_w9dfp_94:not(#\9) {
   color: var(--color-text-form-secondary-ih9x7l, #5f6b7a);
   font-size: var(--font-body-s-size-ukw2p9, 12px);
   line-height: var(--font-body-s-line-height-kdsbrl, 16px);
   letter-spacing: var(--font-body-s-letter-spacing-cy0oxj, 0.005em);
 }
-.awsui_description-bottom-padding_1wepg_voiq5_139:not(#\9) {
+.awsui_description-bottom-padding_1wepg_w9dfp_139:not(#\9) {
   padding-bottom: var(--space-scaled-xxs-95dhkm, 4px);
 }
 
-.awsui_label_1wepg_voiq5_95:not(#\9),
-.awsui_description_1wepg_voiq5_94:not(#\9) {
+.awsui_label_1wepg_w9dfp_95:not(#\9),
+.awsui_description_1wepg_w9dfp_94:not(#\9) {
   padding-left: var(--space-xs-rsr2qu, 8px);
 }
-.awsui_label-disabled_1wepg_voiq5_147:not(#\9),
-.awsui_description-disabled_1wepg_voiq5_148:not(#\9) {
+.awsui_label-disabled_1wepg_w9dfp_147:not(#\9),
+.awsui_description-disabled_1wepg_w9dfp_148:not(#\9) {
   color: var(--color-text-control-disabled-3z3eul, #9ba7b6);
 }
 
 /* stylelint-disable selector-max-type */
-.awsui_control_1wepg_voiq5_153:not(#\9) {
+.awsui_control_1wepg_w9dfp_153:not(#\9) {
   position: relative;
 }
-.awsui_control_1wepg_voiq5_153 > input:not(#\9), .awsui_control_1wepg_voiq5_153 > svg:not(#\9), .awsui_control_1wepg_voiq5_153 > .awsui_outline_1wepg_voiq5_99:not(#\9) {
+.awsui_control_1wepg_w9dfp_153 > input:not(#\9), .awsui_control_1wepg_w9dfp_153 > svg:not(#\9), .awsui_control_1wepg_w9dfp_153 > .awsui_outline_1wepg_w9dfp_99:not(#\9) {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
 }
-.awsui_control_1wepg_voiq5_153 > input:not(#\9) {
+.awsui_control_1wepg_w9dfp_153 > input:not(#\9) {
   opacity: 0;
   z-index: 1;
   -webkit-user-select: none;

package/internal/components/abstract-switch/styles.selectors.js

@@ -2,17 +2,18 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "content": "awsui_content_1wepg_voiq5_93",
-  "description": "awsui_description_1wepg_voiq5_94",
-  "label": "awsui_label_1wepg_voiq5_95",
-  "outline": "awsui_outline_1wepg_voiq5_99",
-  "native-input": "awsui_native-input_1wepg_voiq5_103",
-  "wrapper": "awsui_wrapper_1wepg_voiq5_110",
-  "label-wrapper": "awsui_label-wrapper_1wepg_voiq5_117",
-  "empty-content": "awsui_empty-content_1wepg_voiq5_129",
-  "description-bottom-padding": "awsui_description-bottom-padding_1wepg_voiq5_139",
-  "label-disabled": "awsui_label-disabled_1wepg_voiq5_147",
-  "description-disabled": "awsui_description-disabled_1wepg_voiq5_148",
-  "control": "awsui_control_1wepg_voiq5_153"
+  "content": "awsui_content_1wepg_w9dfp_93",
+  "description": "awsui_description_1wepg_w9dfp_94",
+  "label": "awsui_label_1wepg_w9dfp_95",
+  "outline": "awsui_outline_1wepg_w9dfp_99",
+  "show-outline": "awsui_show-outline_1wepg_w9dfp_102",
+  "native-input": "awsui_native-input_1wepg_w9dfp_106",
+  "wrapper": "awsui_wrapper_1wepg_w9dfp_110",
+  "label-wrapper": "awsui_label-wrapper_1wepg_w9dfp_117",
+  "empty-content": "awsui_empty-content_1wepg_w9dfp_129",
+  "description-bottom-padding": "awsui_description-bottom-padding_1wepg_w9dfp_139",
+  "label-disabled": "awsui_label-disabled_1wepg_w9dfp_147",
+  "description-disabled": "awsui_description-disabled_1wepg_w9dfp_148",
+  "control": "awsui_control_1wepg_w9dfp_153"
 };