@cloudscape-design/components 3.0.1302 → 3.0.1303

package/internal/components/drag-handle-wrapper/styles.scoped.css

@@ -150,27 +150,27 @@ 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
 */
-@keyframes awsui_drag-handle-entry_155yk_1cu1s_1 {
+@keyframes awsui_drag-handle-entry_155yk_1rpq3_1 {
   from {
-    transform: translate(var(--awsui-drag-handle-animation-inline-offset-jsjyte), var(--awsui-drag-handle-animation-block-offset-jsjyte));
+    transform: translate(var(--awsui-drag-handle-animation-inline-offset-6b9ypa), var(--awsui-drag-handle-animation-block-offset-6b9ypa));
   }
   to {
     transform: translate(0, 0);
   }
 }
-@keyframes awsui_drag-handle-exit_155yk_1cu1s_1 {
+@keyframes awsui_drag-handle-exit_155yk_1rpq3_1 {
   from {
     transform: translate(0, 0);
   }
   to {
-    transform: translate(var(--awsui-drag-handle-animation-inline-offset-jsjyte), var(--awsui-drag-handle-animation-block-offset-jsjyte));
+    transform: translate(var(--awsui-drag-handle-animation-inline-offset-6b9ypa), var(--awsui-drag-handle-animation-block-offset-6b9ypa));
   }
 }
-.awsui_direction-button-wrapper_155yk_1cu1s_169:not(#\9) {
-  --awsui-drag-handle-animation-inline-offset-jsjyte: 0;
-  --awsui-drag-handle-animation-block-offset-jsjyte: 0;
+.awsui_direction-button-wrapper_155yk_1rpq3_169:not(#\9) {
+  --awsui-drag-handle-animation-inline-offset-6b9ypa: 0;
+  --awsui-drag-handle-animation-block-offset-6b9ypa: 0;
 }
-@keyframes awsui_awsui-motion-fade-in_155yk_1cu1s_1 {
+@keyframes awsui_awsui-motion-fade-in_155yk_1rpq3_1 {
   from {
     opacity: 0.2;
   }
@@ -178,7 +178,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
     opacity: 1;
   }
 }
-@keyframes awsui_awsui-motion-fade-out-0_155yk_1cu1s_1 {
+@keyframes awsui_awsui-motion-fade-out-0_155yk_1rpq3_1 {
   from {
     opacity: 1;
   }
@@ -186,81 +186,81 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
     opacity: 0;
   }
 }
-.awsui_direction-button-wrapper-motion-enter_155yk_1cu1s_189:not(#\9), .awsui_direction-button-wrapper-motion-entering_155yk_1cu1s_189:not(#\9), .awsui_direction-button-wrapper-motion-exit_155yk_1cu1s_189:not(#\9), .awsui_direction-button-wrapper-motion-exiting_155yk_1cu1s_189:not(#\9) {
+.awsui_direction-button-wrapper-motion-enter_155yk_1rpq3_189:not(#\9), .awsui_direction-button-wrapper-motion-entering_155yk_1rpq3_189:not(#\9), .awsui_direction-button-wrapper-motion-exit_155yk_1rpq3_189:not(#\9), .awsui_direction-button-wrapper-motion-exiting_155yk_1rpq3_189:not(#\9) {
   pointer-events: none;
 }
-.awsui_direction-button-wrapper-motion-entering_155yk_1cu1s_189:not(#\9) {
-  animation: awsui_drag-handle-entry_155yk_1cu1s_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1)), awsui_awsui-motion-fade-in_155yk_1cu1s_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1));
+.awsui_direction-button-wrapper-motion-entering_155yk_1rpq3_189:not(#\9) {
+  animation: awsui_drag-handle-entry_155yk_1rpq3_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1)), awsui_awsui-motion-fade-in_155yk_1rpq3_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_direction-button-wrapper-motion-entering_155yk_1cu1s_189:not(#\9) {
+  .awsui_direction-button-wrapper-motion-entering_155yk_1rpq3_189:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_direction-button-wrapper-motion-entering_155yk_1cu1s_189:not(#\9), .awsui-mode-entering .awsui_direction-button-wrapper-motion-entering_155yk_1cu1s_189:not(#\9) {
+.awsui-motion-disabled .awsui_direction-button-wrapper-motion-entering_155yk_1rpq3_189:not(#\9), .awsui-mode-entering .awsui_direction-button-wrapper-motion-entering_155yk_1rpq3_189:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_direction-button-wrapper-motion-exiting_155yk_1cu1s_189:not(#\9) {
-  animation: awsui_drag-handle-exit_155yk_1cu1s_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1)) forwards, awsui_awsui-motion-fade-out-0_155yk_1cu1s_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1)) forwards;
+.awsui_direction-button-wrapper-motion-exiting_155yk_1rpq3_189:not(#\9) {
+  animation: awsui_drag-handle-exit_155yk_1rpq3_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1)) forwards, awsui_awsui-motion-fade-out-0_155yk_1rpq3_1 var(--motion-duration-complex-tbdo30, 250ms) var(--motion-easing-responsive-hjj3ai, cubic-bezier(0, 0, 0, 1)) forwards;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_direction-button-wrapper-motion-exiting_155yk_1cu1s_189:not(#\9) {
+  .awsui_direction-button-wrapper-motion-exiting_155yk_1rpq3_189:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_direction-button-wrapper-motion-exiting_155yk_1cu1s_189:not(#\9), .awsui-mode-entering .awsui_direction-button-wrapper-motion-exiting_155yk_1cu1s_189:not(#\9) {
+.awsui-motion-disabled .awsui_direction-button-wrapper-motion-exiting_155yk_1rpq3_189:not(#\9), .awsui-mode-entering .awsui_direction-button-wrapper-motion-exiting_155yk_1rpq3_189:not(#\9) {
   animation: none;
   transition: none;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_direction-button-wrapper_155yk_1cu1s_169:not(#\9) {
+  .awsui_direction-button-wrapper_155yk_1rpq3_169:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_direction-button-wrapper_155yk_1cu1s_169:not(#\9), .awsui-mode-entering .awsui_direction-button-wrapper_155yk_1cu1s_169:not(#\9) {
+.awsui-motion-disabled .awsui_direction-button-wrapper_155yk_1rpq3_169:not(#\9), .awsui-mode-entering .awsui_direction-button-wrapper_155yk_1rpq3_169:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_direction-button-wrapper-block-start_155yk_1cu1s_229:not(#\9) {
-  --awsui-drag-handle-animation-block-offset-jsjyte: 20px;
+.awsui_direction-button-wrapper-block-start_155yk_1rpq3_229:not(#\9) {
+  --awsui-drag-handle-animation-block-offset-6b9ypa: 20px;
 }
 
-.awsui_direction-button-wrapper-block-end_155yk_1cu1s_233:not(#\9) {
-  --awsui-drag-handle-animation-block-offset-jsjyte: -20px;
+.awsui_direction-button-wrapper-block-end_155yk_1rpq3_233:not(#\9) {
+  --awsui-drag-handle-animation-block-offset-6b9ypa: -20px;
 }
 
-.awsui_direction-button-wrapper-inline-start_155yk_1cu1s_237:not(#\9) {
+.awsui_direction-button-wrapper-inline-start_155yk_1rpq3_237:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
 }
-.awsui_direction-button-wrapper-inline-start_155yk_1cu1s_237:not(#\9):dir(ltr) {
-  --awsui-drag-handle-animation-inline-offset-jsjyte: 20px;
+.awsui_direction-button-wrapper-inline-start_155yk_1rpq3_237:not(#\9):dir(ltr) {
+  --awsui-drag-handle-animation-inline-offset-6b9ypa: 20px;
 }
-.awsui_direction-button-wrapper-inline-start_155yk_1cu1s_237:not(#\9):dir(rtl) {
-  --awsui-drag-handle-animation-inline-offset-jsjyte: -20px;
+.awsui_direction-button-wrapper-inline-start_155yk_1rpq3_237:not(#\9):dir(rtl) {
+  --awsui-drag-handle-animation-inline-offset-6b9ypa: -20px;
 }
 
-.awsui_direction-button-wrapper-inline-end_155yk_1cu1s_248:not(#\9) {
+.awsui_direction-button-wrapper-inline-end_155yk_1rpq3_248:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
 }
-.awsui_direction-button-wrapper-inline-end_155yk_1cu1s_248:not(#\9):dir(ltr) {
-  --awsui-drag-handle-animation-inline-offset-jsjyte: -20px;
+.awsui_direction-button-wrapper-inline-end_155yk_1rpq3_248:not(#\9):dir(ltr) {
+  --awsui-drag-handle-animation-inline-offset-6b9ypa: -20px;
 }
-.awsui_direction-button-wrapper-inline-end_155yk_1cu1s_248:not(#\9):dir(rtl) {
-  --awsui-drag-handle-animation-inline-offset-jsjyte: 20px;
+.awsui_direction-button-wrapper-inline-end_155yk_1rpq3_248:not(#\9):dir(rtl) {
+  --awsui-drag-handle-animation-inline-offset-6b9ypa: 20px;
 }
 
-.awsui_contents_155yk_1cu1s_259:not(#\9) {
+.awsui_contents_155yk_1rpq3_259:not(#\9) {
   display: contents;
 }
 
-.awsui_portal-overlay_155yk_1cu1s_263:not(#\9) {
+.awsui_portal-overlay_155yk_1rpq3_263:not(#\9) {
   position: absolute;
   inset-block-start: 0;
   inset-inline-start: 0;
@@ -268,20 +268,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   z-index: 7000;
 }
 
-.awsui_portal-overlay-disabled_155yk_1cu1s_271:not(#\9) {
+.awsui_portal-overlay-disabled_155yk_1rpq3_271:not(#\9) {
   display: none;
 }
 
-.awsui_portal-overlay-contents_155yk_1cu1s_275:not(#\9) {
+.awsui_portal-overlay-contents_155yk_1rpq3_275:not(#\9) {
   pointer-events: auto;
 }
 
-.awsui_drag-handle_155yk_1cu1s_279:not(#\9) {
+.awsui_drag-handle_155yk_1rpq3_279:not(#\9) {
   position: relative;
   display: inline-flex;
 }
 
-.awsui_direction-button-wrapper_155yk_1cu1s_169:not(#\9) {
+.awsui_direction-button-wrapper_155yk_1rpq3_169:not(#\9) {
   position: absolute;
   block-size: var(--space-static-xl-4tedi6, 24px);
   inline-size: var(--space-static-xl-4tedi6, 24px);
@@ -289,67 +289,67 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline: var(--space-static-xxs-ns94dp, 4px);
 }
 
-.awsui_direction-button-wrapper-hidden_155yk_1cu1s_292:not(#\9) {
+.awsui_direction-button-wrapper-hidden_155yk_1rpq3_292:not(#\9) {
   display: none;
 }
 
-.awsui_direction-button-wrapper-block-start_155yk_1cu1s_229:not(#\9) {
+.awsui_direction-button-wrapper-block-start_155yk_1rpq3_229:not(#\9) {
   inset-block-start: calc(-1 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
   inset-inline-start: calc(50% - (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)) / 2);
 }
 
-.awsui_direction-button-wrapper-block-end_155yk_1cu1s_233:not(#\9) {
+.awsui_direction-button-wrapper-block-end_155yk_1rpq3_233:not(#\9) {
   inset-block-end: calc(-1 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
   inset-inline-start: calc(50% - (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)) / 2);
 }
 
-.awsui_direction-button-wrapper-inline-start_155yk_1cu1s_237:not(#\9) {
+.awsui_direction-button-wrapper-inline-start_155yk_1rpq3_237:not(#\9) {
   inset-inline-start: calc(-1 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
   inset-block-start: calc(50% - (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)) / 2);
 }
 
-.awsui_direction-button-wrapper-inline-end_155yk_1cu1s_248:not(#\9) {
+.awsui_direction-button-wrapper-inline-end_155yk_1rpq3_248:not(#\9) {
   inset-inline-end: calc(-1 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
   inset-block-start: calc(50% - (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)) / 2);
 }
 
-.awsui_direction-button-wrapper-forced_155yk_1cu1s_316:not(#\9) {
+.awsui_direction-button-wrapper-forced_155yk_1rpq3_316:not(#\9) {
   inset-inline-start: calc(50% - (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)) / 2);
 }
 
-.awsui_direction-button-wrapper-forced-top-0_155yk_1cu1s_320:not(#\9) {
+.awsui_direction-button-wrapper-forced-top-0_155yk_1rpq3_320:not(#\9) {
   inset-block-start: calc(-1 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-top-1_155yk_1cu1s_324:not(#\9) {
+.awsui_direction-button-wrapper-forced-top-1_155yk_1rpq3_324:not(#\9) {
   inset-block-start: calc(-2 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-top-2_155yk_1cu1s_328:not(#\9) {
+.awsui_direction-button-wrapper-forced-top-2_155yk_1rpq3_328:not(#\9) {
   inset-block-start: calc(-3 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-top-3_155yk_1cu1s_332:not(#\9) {
+.awsui_direction-button-wrapper-forced-top-3_155yk_1rpq3_332:not(#\9) {
   inset-block-start: calc(-4 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-bottom-0_155yk_1cu1s_336:not(#\9) {
+.awsui_direction-button-wrapper-forced-bottom-0_155yk_1rpq3_336:not(#\9) {
   inset-block-start: calc(1 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-bottom-1_155yk_1cu1s_340:not(#\9) {
+.awsui_direction-button-wrapper-forced-bottom-1_155yk_1rpq3_340:not(#\9) {
   inset-block-start: calc(2 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-bottom-2_155yk_1cu1s_344:not(#\9) {
+.awsui_direction-button-wrapper-forced-bottom-2_155yk_1rpq3_344:not(#\9) {
   inset-block-start: calc(3 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button-wrapper-forced-bottom-3_155yk_1cu1s_348:not(#\9) {
+.awsui_direction-button-wrapper-forced-bottom-3_155yk_1rpq3_348:not(#\9) {
   inset-block-start: calc(4 * (var(--space-static-xl-4tedi6, 24px) + 2 * var(--space-static-xxs-ns94dp, 4px)));
 }
 
-.awsui_direction-button_155yk_1cu1s_169:not(#\9) {
+.awsui_direction-button_155yk_1rpq3_169:not(#\9) {
   position: absolute;
   border-width: 0;
   cursor: pointer;
@@ -368,14 +368,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-direction-button-default-p88lvb, #ffffff);
   box-shadow: var(--shadow-dropdown-isf0w4, 0px 4px 20px 1px rgba(0, 7, 22, 0.1));
 }
-.awsui_direction-button_155yk_1cu1s_169:not(#\9):not(.awsui_direction-button-disabled_155yk_1cu1s_371):hover {
+.awsui_direction-button_155yk_1rpq3_169:not(#\9):not(.awsui_direction-button-disabled_155yk_1rpq3_371):hover {
   background-color: var(--color-background-direction-button-hover-74n5o1, #333843);
 }
-.awsui_direction-button_155yk_1cu1s_169:not(#\9):not(.awsui_direction-button-disabled_155yk_1cu1s_371):active {
+.awsui_direction-button_155yk_1rpq3_169:not(#\9):not(.awsui_direction-button-disabled_155yk_1rpq3_371):active {
   background-color: var(--color-background-direction-button-active-lvo0dy, #232b37);
 }
 
-.awsui_direction-button-disabled_155yk_1cu1s_371:not(#\9) {
+.awsui_direction-button-disabled_155yk_1rpq3_371:not(#\9) {
   cursor: default;
   background-color: var(--color-background-direction-button-disabled-s9x4zq, #ebebf0);
   color: var(--color-text-direction-button-disabled-2jds36, #b4b4bb);

package/internal/components/drag-handle-wrapper/styles.selectors.js

@@ -2,35 +2,35 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "direction-button-wrapper": "awsui_direction-button-wrapper_155yk_1cu1s_169",
-  "direction-button-wrapper-motion-enter": "awsui_direction-button-wrapper-motion-enter_155yk_1cu1s_189",
-  "direction-button-wrapper-motion-entering": "awsui_direction-button-wrapper-motion-entering_155yk_1cu1s_189",
-  "direction-button-wrapper-motion-exit": "awsui_direction-button-wrapper-motion-exit_155yk_1cu1s_189",
-  "direction-button-wrapper-motion-exiting": "awsui_direction-button-wrapper-motion-exiting_155yk_1cu1s_189",
-  "drag-handle-entry": "awsui_drag-handle-entry_155yk_1cu1s_1",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_155yk_1cu1s_1",
-  "drag-handle-exit": "awsui_drag-handle-exit_155yk_1cu1s_1",
-  "awsui-motion-fade-out-0": "awsui_awsui-motion-fade-out-0_155yk_1cu1s_1",
-  "direction-button-wrapper-block-start": "awsui_direction-button-wrapper-block-start_155yk_1cu1s_229",
-  "direction-button-wrapper-block-end": "awsui_direction-button-wrapper-block-end_155yk_1cu1s_233",
-  "direction-button-wrapper-inline-start": "awsui_direction-button-wrapper-inline-start_155yk_1cu1s_237",
-  "direction-button-wrapper-inline-end": "awsui_direction-button-wrapper-inline-end_155yk_1cu1s_248",
-  "contents": "awsui_contents_155yk_1cu1s_259",
-  "portal-overlay": "awsui_portal-overlay_155yk_1cu1s_263",
-  "portal-overlay-disabled": "awsui_portal-overlay-disabled_155yk_1cu1s_271",
-  "portal-overlay-contents": "awsui_portal-overlay-contents_155yk_1cu1s_275",
-  "drag-handle": "awsui_drag-handle_155yk_1cu1s_279",
-  "direction-button-wrapper-hidden": "awsui_direction-button-wrapper-hidden_155yk_1cu1s_292",
-  "direction-button-wrapper-forced": "awsui_direction-button-wrapper-forced_155yk_1cu1s_316",
-  "direction-button-wrapper-forced-top-0": "awsui_direction-button-wrapper-forced-top-0_155yk_1cu1s_320",
-  "direction-button-wrapper-forced-top-1": "awsui_direction-button-wrapper-forced-top-1_155yk_1cu1s_324",
-  "direction-button-wrapper-forced-top-2": "awsui_direction-button-wrapper-forced-top-2_155yk_1cu1s_328",
-  "direction-button-wrapper-forced-top-3": "awsui_direction-button-wrapper-forced-top-3_155yk_1cu1s_332",
-  "direction-button-wrapper-forced-bottom-0": "awsui_direction-button-wrapper-forced-bottom-0_155yk_1cu1s_336",
-  "direction-button-wrapper-forced-bottom-1": "awsui_direction-button-wrapper-forced-bottom-1_155yk_1cu1s_340",
-  "direction-button-wrapper-forced-bottom-2": "awsui_direction-button-wrapper-forced-bottom-2_155yk_1cu1s_344",
-  "direction-button-wrapper-forced-bottom-3": "awsui_direction-button-wrapper-forced-bottom-3_155yk_1cu1s_348",
-  "direction-button": "awsui_direction-button_155yk_1cu1s_169",
-  "direction-button-disabled": "awsui_direction-button-disabled_155yk_1cu1s_371"
+  "direction-button-wrapper": "awsui_direction-button-wrapper_155yk_1rpq3_169",
+  "direction-button-wrapper-motion-enter": "awsui_direction-button-wrapper-motion-enter_155yk_1rpq3_189",
+  "direction-button-wrapper-motion-entering": "awsui_direction-button-wrapper-motion-entering_155yk_1rpq3_189",
+  "direction-button-wrapper-motion-exit": "awsui_direction-button-wrapper-motion-exit_155yk_1rpq3_189",
+  "direction-button-wrapper-motion-exiting": "awsui_direction-button-wrapper-motion-exiting_155yk_1rpq3_189",
+  "drag-handle-entry": "awsui_drag-handle-entry_155yk_1rpq3_1",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_155yk_1rpq3_1",
+  "drag-handle-exit": "awsui_drag-handle-exit_155yk_1rpq3_1",
+  "awsui-motion-fade-out-0": "awsui_awsui-motion-fade-out-0_155yk_1rpq3_1",
+  "direction-button-wrapper-block-start": "awsui_direction-button-wrapper-block-start_155yk_1rpq3_229",
+  "direction-button-wrapper-block-end": "awsui_direction-button-wrapper-block-end_155yk_1rpq3_233",
+  "direction-button-wrapper-inline-start": "awsui_direction-button-wrapper-inline-start_155yk_1rpq3_237",
+  "direction-button-wrapper-inline-end": "awsui_direction-button-wrapper-inline-end_155yk_1rpq3_248",
+  "contents": "awsui_contents_155yk_1rpq3_259",
+  "portal-overlay": "awsui_portal-overlay_155yk_1rpq3_263",
+  "portal-overlay-disabled": "awsui_portal-overlay-disabled_155yk_1rpq3_271",
+  "portal-overlay-contents": "awsui_portal-overlay-contents_155yk_1rpq3_275",
+  "drag-handle": "awsui_drag-handle_155yk_1rpq3_279",
+  "direction-button-wrapper-hidden": "awsui_direction-button-wrapper-hidden_155yk_1rpq3_292",
+  "direction-button-wrapper-forced": "awsui_direction-button-wrapper-forced_155yk_1rpq3_316",
+  "direction-button-wrapper-forced-top-0": "awsui_direction-button-wrapper-forced-top-0_155yk_1rpq3_320",
+  "direction-button-wrapper-forced-top-1": "awsui_direction-button-wrapper-forced-top-1_155yk_1rpq3_324",
+  "direction-button-wrapper-forced-top-2": "awsui_direction-button-wrapper-forced-top-2_155yk_1rpq3_328",
+  "direction-button-wrapper-forced-top-3": "awsui_direction-button-wrapper-forced-top-3_155yk_1rpq3_332",
+  "direction-button-wrapper-forced-bottom-0": "awsui_direction-button-wrapper-forced-bottom-0_155yk_1rpq3_336",
+  "direction-button-wrapper-forced-bottom-1": "awsui_direction-button-wrapper-forced-bottom-1_155yk_1rpq3_340",
+  "direction-button-wrapper-forced-bottom-2": "awsui_direction-button-wrapper-forced-bottom-2_155yk_1rpq3_344",
+  "direction-button-wrapper-forced-bottom-3": "awsui_direction-button-wrapper-forced-bottom-3_155yk_1rpq3_348",
+  "direction-button": "awsui_direction-button_155yk_1rpq3_169",
+  "direction-button-disabled": "awsui_direction-button-disabled_155yk_1rpq3_371"
 };
   

package/internal/components/radio-button/styles.css.js

@@ -1,12 +1,12 @@
 
     import './styles.scoped.css';
     export default {
-  "radio-control": "awsui_radio-control_1v1hk_d0161_145",
-  "outline": "awsui_outline_1v1hk_d0161_153",
-  "styled-circle-border": "awsui_styled-circle-border_1v1hk_d0161_176",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_d0161_180",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_d0161_180",
-  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_d0161_185",
-  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_d0161_201"
+  "radio-control": "awsui_radio-control_1v1hk_ykhrv_145",
+  "outline": "awsui_outline_1v1hk_ykhrv_153",
+  "styled-circle-border": "awsui_styled-circle-border_1v1hk_ykhrv_176",
+  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_ykhrv_180",
+  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_ykhrv_180",
+  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_ykhrv_185",
+  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_ykhrv_201"
 };
   

package/internal/components/radio-button/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_radio-control_1v1hk_d0161_145:not(#\9) {
+.awsui_radio-control_1v1hk_ykhrv_145:not(#\9) {
   margin-block-start: calc((var(--line-height-body-m-2mh3ke, 20px) - var(--size-control-adm93y, 16px)) / 2);
   min-block-size: var(--size-control-adm93y, 16px);
   min-inline-size: var(--size-control-adm93y, 16px);
@@ -150,15 +150,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inline-size: var(--size-control-adm93y, 16px);
 }
 
-.awsui_outline_1v1hk_d0161_153:not(#\9) {
-  --awsui-style-focus-ring-box-shadow-jsjyte: 0 0 0 var(--awsui-style-focus-ring-border-width-jsjyte, 2px) var(--awsui-style-focus-ring-border-color-jsjyte, var(--color-border-item-focused-uk47pl, #006ce0));
+.awsui_outline_1v1hk_ykhrv_153:not(#\9) {
+  --awsui-style-focus-ring-box-shadow-6b9ypa: 0 0 0 var(--awsui-style-focus-ring-border-width-6b9ypa, 2px) var(--awsui-style-focus-ring-border-color-6b9ypa, var(--color-border-item-focused-uk47pl, #006ce0));
   position: relative;
 }
-.awsui_outline_1v1hk_d0161_153:not(#\9) {
+.awsui_outline_1v1hk_ykhrv_153:not(#\9) {
   outline: 2px dotted transparent;
   outline-offset: calc(2px - 1px);
 }
-.awsui_outline_1v1hk_d0161_153:not(#\9)::before {
+.awsui_outline_1v1hk_ykhrv_153:not(#\9)::before {
   content: " ";
   display: block;
   position: absolute;
@@ -166,46 +166,46 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inset-block-start: calc(-1 * 2px);
   inline-size: calc(100% + 2px + 2px);
   block-size: calc(100% + 2px + 2px);
-  border-start-start-radius: var(--awsui-style-focus-ring-border-radius-jsjyte, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  border-start-end-radius: var(--awsui-style-focus-ring-border-radius-jsjyte, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  border-end-start-radius: var(--awsui-style-focus-ring-border-radius-jsjyte, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  border-end-end-radius: var(--awsui-style-focus-ring-border-radius-jsjyte, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  box-shadow: var(--awsui-style-focus-ring-box-shadow-jsjyte);
+  border-start-start-radius: var(--awsui-style-focus-ring-border-radius-6b9ypa, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
+  border-start-end-radius: var(--awsui-style-focus-ring-border-radius-6b9ypa, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
+  border-end-start-radius: var(--awsui-style-focus-ring-border-radius-6b9ypa, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
+  border-end-end-radius: var(--awsui-style-focus-ring-border-radius-6b9ypa, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
+  box-shadow: var(--awsui-style-focus-ring-box-shadow-6b9ypa);
 }
 
-.awsui_styled-circle-border_1v1hk_d0161_176:not(#\9) {
+.awsui_styled-circle-border_1v1hk_ykhrv_176:not(#\9) {
   stroke: var(--color-border-control-default-sh3548, #8c8c94);
   fill: var(--color-background-control-default-4jb21l, #ffffff);
 }
-.awsui_styled-circle-border_1v1hk_d0161_176.awsui_styled-circle-disabled_1v1hk_d0161_180:not(#\9), .awsui_styled-circle-border_1v1hk_d0161_176.awsui_styled-circle-readonly_1v1hk_d0161_180:not(#\9) {
+.awsui_styled-circle-border_1v1hk_ykhrv_176.awsui_styled-circle-disabled_1v1hk_ykhrv_180:not(#\9), .awsui_styled-circle-border_1v1hk_ykhrv_176.awsui_styled-circle-readonly_1v1hk_ykhrv_180:not(#\9) {
   fill: var(--color-background-control-disabled-1f3718, #dedee3);
   stroke: var(--color-background-control-disabled-1f3718, #dedee3);
 }
 
-.awsui_styled-circle-fill_1v1hk_d0161_185:not(#\9) {
+.awsui_styled-circle-fill_1v1hk_ykhrv_185:not(#\9) {
   stroke: var(--color-background-control-checked-ka7kc2, #006ce0);
   fill: var(--color-foreground-control-default-eto4wy, #ffffff);
   opacity: 0;
   transition: opacity var(--motion-duration-transition-quick-mcm2y0, 90ms) var(--motion-easing-transition-quick-qxak3i, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_styled-circle-fill_1v1hk_d0161_185:not(#\9) {
+  .awsui_styled-circle-fill_1v1hk_ykhrv_185:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_styled-circle-fill_1v1hk_d0161_185:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1v1hk_d0161_185:not(#\9) {
+.awsui-motion-disabled .awsui_styled-circle-fill_1v1hk_ykhrv_185:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1v1hk_ykhrv_185:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_styled-circle-fill_1v1hk_d0161_185.awsui_styled-circle-checked_1v1hk_d0161_201:not(#\9) {
+.awsui_styled-circle-fill_1v1hk_ykhrv_185.awsui_styled-circle-checked_1v1hk_ykhrv_201:not(#\9) {
   opacity: 1;
 }
-.awsui_styled-circle-fill_1v1hk_d0161_185.awsui_styled-circle-disabled_1v1hk_d0161_180:not(#\9) {
+.awsui_styled-circle-fill_1v1hk_ykhrv_185.awsui_styled-circle-disabled_1v1hk_ykhrv_180:not(#\9) {
   fill: var(--color-foreground-control-disabled-txi6cf, #ffffff);
   stroke: var(--color-background-control-disabled-1f3718, #dedee3);
 }
-.awsui_styled-circle-fill_1v1hk_d0161_185.awsui_styled-circle-readonly_1v1hk_d0161_180:not(#\9) {
+.awsui_styled-circle-fill_1v1hk_ykhrv_185.awsui_styled-circle-readonly_1v1hk_ykhrv_180:not(#\9) {
   fill: var(--color-foreground-control-read-only-7ydvuj, #656871);
   stroke: var(--color-background-control-disabled-1f3718, #dedee3);
 }

package/internal/components/radio-button/styles.selectors.js

@@ -2,12 +2,12 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "radio-control": "awsui_radio-control_1v1hk_d0161_145",
-  "outline": "awsui_outline_1v1hk_d0161_153",
-  "styled-circle-border": "awsui_styled-circle-border_1v1hk_d0161_176",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_d0161_180",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_d0161_180",
-  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_d0161_185",
-  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_d0161_201"
+  "radio-control": "awsui_radio-control_1v1hk_ykhrv_145",
+  "outline": "awsui_outline_1v1hk_ykhrv_153",
+  "styled-circle-border": "awsui_styled-circle-border_1v1hk_ykhrv_176",
+  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_ykhrv_180",
+  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_ykhrv_180",
+  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_ykhrv_185",
+  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_ykhrv_201"
 };
   

package/internal/components/sortable-area/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/sortable-area/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAOjD,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,IAAI,EAAE,EACzC,KAAK,EACL,cAAc,EACd,UAAU,EACV,aAAa,EACb,cAAc,EACd,WAAW,GACZ,EAAE,iBAAiB,CAAC,IAAI,CAAC,eAiFzB;AAgGD,wBAAgB,sBAAsB,CACpC,cAAc,EAAE,iBAAiB,CAAC,cAAc,CAAC,GAAG,CAAC,GACpD,iBAAiB,CAAC,mBAAmB,CAEvC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/sortable-area/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAOjD,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,IAAI,EAAE,EACzC,KAAK,EACL,cAAc,EACd,UAAU,EACV,aAAa,EACb,cAAc,EACd,WAAW,GACZ,EAAE,iBAAiB,CAAC,IAAI,CAAC,eAiFzB;AA+FD,wBAAgB,sBAAsB,CACpC,cAAc,EAAE,iBAAiB,CAAC,cAAc,CAAC,GAAG,CAAC,GACpD,iBAAiB,CAAC,mBAAmB,CAEvC"}

package/internal/components/sortable-area/index.js

@@ -105,7 +105,6 @@ function DraggableItem({ item, itemDefinition, dragHandleAriaLabel, showDirectio
         isDragGhost: false,
         dragHandleProps: {
             ...dragHandleListeners,
-            active: isDragging,
             ariaLabel: (_a = joinStrings(dragHandleAriaLabel, itemDefinition.label(item))) !== null && _a !== void 0 ? _a : '',
             ariaDescribedby: attributes['aria-describedby'],
             disabled: attributes['aria-disabled'],

package/internal/components/sortable-area/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/sortable-area/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useEffect, useRef } from 'react';\nimport { DndContext, DragOverlay } from '@dnd-kit/core';\nimport { arrayMove, SortableContext, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport clsx from 'clsx';\n\nimport { Portal } from '@cloudscape-design/component-toolkit/internal';\n\nimport { fireNonCancelableEvent } from '../../events';\nimport { joinStrings } from '../../utils/strings';\nimport { SortableAreaProps } from './interfaces';\nimport { EventName } from './keyboard-sensor/utilities/events';\nimport useDragAndDropReorder from './use-drag-and-drop-reorder';\nimport useLiveAnnouncements from './use-live-announcements';\n\nimport styles from './styles.css.js';\n\nexport { SortableAreaProps };\n\nexport default function SortableArea<Item>({\n  items,\n  itemDefinition,\n  renderItem,\n  onItemsChange,\n  disableReorder,\n  i18nStrings,\n}: SortableAreaProps<Item>) {\n  const { activeItemId, setActiveItemId, collisionDetection, handleKeyDown, sensors, isKeyboard } =\n    useDragAndDropReorder({\n      items,\n      itemDefinition,\n    });\n  const activeItem = activeItemId ? items.find(item => itemDefinition.id(item) === activeItemId) : null;\n  const isDragging = activeItemId !== null;\n  const announcements = useLiveAnnouncements({ items, itemDefinition, isDragging, ...i18nStrings });\n  const portalContainer = usePortalContainer();\n  return (\n    <DndContext\n      sensors={sensors}\n      collisionDetection={collisionDetection}\n      accessibility={{\n        announcements,\n        restoreFocus: false,\n        screenReaderInstructions: i18nStrings?.dragHandleAriaDescription\n          ? { draggable: i18nStrings.dragHandleAriaDescription }\n          : undefined,\n        container: portalContainer ?? undefined,\n      }}\n      onDragStart={({ active }) => setActiveItemId(active.id)}\n      onDragEnd={event => {\n        setActiveItemId(null);\n        const { active, over } = event;\n        if (over && active.id !== over.id) {\n          const movedItem = items.find(item => itemDefinition.id(item) === active.id)!;\n          const oldIndex = items.findIndex(item => itemDefinition.id(item) === active.id);\n          const newIndex = items.findIndex(item => itemDefinition.id(item) === over.id);\n          fireNonCancelableEvent(onItemsChange, { items: arrayMove([...items], oldIndex, newIndex), movedItem });\n        }\n      }}\n      onDragCancel={() => setActiveItemId(null)}\n    >\n      <SortableContext\n        disabled={disableReorder}\n        items={items.map(item => itemDefinition.id(item))}\n        strategy={verticalListSortingStrategy}\n      >\n        {items.map(item => (\n          <DraggableItem\n            key={itemDefinition.id(item)}\n            item={item}\n            itemDefinition={itemDefinition}\n            showDirectionButtons={item === activeItem && isKeyboard.current}\n            renderItem={renderItem}\n            onKeyDown={handleKeyDown}\n            dragHandleAriaLabel={i18nStrings?.dragHandleAriaLabel}\n          />\n        ))}\n      </SortableContext>\n\n      <Portal container={portalContainer}>\n        {/* Make sure that the drag overlay is above the modal  by assigning the z-index as inline style\n            so that it prevails over dnd-kit's inline z-index of 999 */}\n        <DragOverlay\n          className={clsx(styles['drag-overlay'], styles[`drag-overlay-${getBorderRadiusVariant(itemDefinition)}`])}\n          dropAnimation={null}\n          style={{ zIndex: 5000 }}\n          transition={isKeyboard.current ? 'transform 250ms' : ''}\n        >\n          {activeItem &&\n            renderItem({\n              item: activeItem,\n              id: activeItemId!.toString(),\n              style: {},\n              className: styles.active,\n              isDropPlaceholder: true,\n              isSortingActive: false,\n              isDragGhost: true,\n              dragHandleProps: {\n                ariaLabel: joinStrings(i18nStrings?.dragHandleAriaLabel, itemDefinition.label(activeItem)) ?? '',\n                active: true,\n                onKeyDown: handleKeyDown,\n              },\n            })}\n        </DragOverlay>\n      </Portal>\n    </DndContext>\n  );\n}\n\nfunction usePortalContainer() {\n  const portalContainerRef = useRef(typeof document !== 'undefined' ? document.createElement('div') : null);\n  useEffect(() => {\n    const container = portalContainerRef.current;\n    if (container && !container.isConnected) {\n      document.body.appendChild(container);\n    }\n    return () => {\n      if (container && container.isConnected) {\n        document.body.removeChild(container);\n      }\n    };\n  }, []);\n  return portalContainerRef.current;\n}\n\nfunction DraggableItem<Item>({\n  item,\n  itemDefinition,\n  dragHandleAriaLabel,\n  showDirectionButtons,\n  onKeyDown,\n  renderItem,\n}: {\n  item: Item;\n  itemDefinition: SortableAreaProps.ItemDefinition<Item>;\n  dragHandleAriaLabel?: string;\n  showDirectionButtons: boolean;\n  onKeyDown: (event: React.KeyboardEvent) => void;\n  renderItem: (props: SortableAreaProps.RenderItemProps<Item>) => React.ReactNode;\n}) {\n  const id = itemDefinition.id(item);\n  const { isDragging, isSorting, listeners, setNodeRef, transform, attributes } = useSortable({\n    id,\n  });\n  const style = { transform: CSS.Translate.toString(transform) };\n  const dragHandleListeners = attributes['aria-disabled']\n    ? {}\n    : {\n        ...listeners,\n        onKeyDown: (event: React.KeyboardEvent) => {\n          if (onKeyDown) {\n            onKeyDown(event);\n          }\n          if (listeners?.onKeyDown) {\n            listeners.onKeyDown(event);\n          }\n        },\n      };\n  const className = clsx(\n    isDragging && clsx(styles.placeholder, styles[`placeholder-${getBorderRadiusVariant(itemDefinition)}`]),\n    isSorting && styles.sorting\n  );\n  const dragHandleRef = useRef<HTMLElement>(null);\n  return (\n    <>\n      {renderItem({\n        item,\n        id,\n        ref: setNodeRef,\n        style,\n        className,\n        isDropPlaceholder: isDragging,\n        isSortingActive: isSorting,\n        isDragGhost: false,\n        dragHandleProps: {\n          ...dragHandleListeners,\n          active: isDragging,\n          ariaLabel: joinStrings(dragHandleAriaLabel, itemDefinition.label(item)) ?? '',\n          ariaDescribedby: attributes['aria-describedby'],\n          disabled: attributes['aria-disabled'],\n          triggerMode: 'controlled',\n          controlledShowButtons: showDirectionButtons,\n          ref: dragHandleRef,\n          directions: showDirectionButtons\n            ? {\n                'block-start': 'active',\n                'block-end': 'active',\n              }\n            : undefined,\n          onDirectionClick: direction => {\n            const event = new Event(direction === 'block-start' ? EventName.CustomUp : EventName.CustomDown, {\n              bubbles: true,\n              cancelable: true,\n            });\n            onKeyDown(event as any);\n            dragHandleRef.current?.dispatchEvent(event);\n          },\n        },\n      })}\n    </>\n  );\n}\n\nexport function getBorderRadiusVariant(\n  itemDefinition: SortableAreaProps.ItemDefinition<any>\n): SortableAreaProps.BorderRadiusVariant {\n  return itemDefinition.borderRadius ?? 'item';\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/sortable-area/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useEffect, useRef } from 'react';\nimport { DndContext, DragOverlay } from '@dnd-kit/core';\nimport { arrayMove, SortableContext, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport clsx from 'clsx';\n\nimport { Portal } from '@cloudscape-design/component-toolkit/internal';\n\nimport { fireNonCancelableEvent } from '../../events';\nimport { joinStrings } from '../../utils/strings';\nimport { SortableAreaProps } from './interfaces';\nimport { EventName } from './keyboard-sensor/utilities/events';\nimport useDragAndDropReorder from './use-drag-and-drop-reorder';\nimport useLiveAnnouncements from './use-live-announcements';\n\nimport styles from './styles.css.js';\n\nexport { SortableAreaProps };\n\nexport default function SortableArea<Item>({\n  items,\n  itemDefinition,\n  renderItem,\n  onItemsChange,\n  disableReorder,\n  i18nStrings,\n}: SortableAreaProps<Item>) {\n  const { activeItemId, setActiveItemId, collisionDetection, handleKeyDown, sensors, isKeyboard } =\n    useDragAndDropReorder({\n      items,\n      itemDefinition,\n    });\n  const activeItem = activeItemId ? items.find(item => itemDefinition.id(item) === activeItemId) : null;\n  const isDragging = activeItemId !== null;\n  const announcements = useLiveAnnouncements({ items, itemDefinition, isDragging, ...i18nStrings });\n  const portalContainer = usePortalContainer();\n  return (\n    <DndContext\n      sensors={sensors}\n      collisionDetection={collisionDetection}\n      accessibility={{\n        announcements,\n        restoreFocus: false,\n        screenReaderInstructions: i18nStrings?.dragHandleAriaDescription\n          ? { draggable: i18nStrings.dragHandleAriaDescription }\n          : undefined,\n        container: portalContainer ?? undefined,\n      }}\n      onDragStart={({ active }) => setActiveItemId(active.id)}\n      onDragEnd={event => {\n        setActiveItemId(null);\n        const { active, over } = event;\n        if (over && active.id !== over.id) {\n          const movedItem = items.find(item => itemDefinition.id(item) === active.id)!;\n          const oldIndex = items.findIndex(item => itemDefinition.id(item) === active.id);\n          const newIndex = items.findIndex(item => itemDefinition.id(item) === over.id);\n          fireNonCancelableEvent(onItemsChange, { items: arrayMove([...items], oldIndex, newIndex), movedItem });\n        }\n      }}\n      onDragCancel={() => setActiveItemId(null)}\n    >\n      <SortableContext\n        disabled={disableReorder}\n        items={items.map(item => itemDefinition.id(item))}\n        strategy={verticalListSortingStrategy}\n      >\n        {items.map(item => (\n          <DraggableItem\n            key={itemDefinition.id(item)}\n            item={item}\n            itemDefinition={itemDefinition}\n            showDirectionButtons={item === activeItem && isKeyboard.current}\n            renderItem={renderItem}\n            onKeyDown={handleKeyDown}\n            dragHandleAriaLabel={i18nStrings?.dragHandleAriaLabel}\n          />\n        ))}\n      </SortableContext>\n\n      <Portal container={portalContainer}>\n        {/* Make sure that the drag overlay is above the modal  by assigning the z-index as inline style\n            so that it prevails over dnd-kit's inline z-index of 999 */}\n        <DragOverlay\n          className={clsx(styles['drag-overlay'], styles[`drag-overlay-${getBorderRadiusVariant(itemDefinition)}`])}\n          dropAnimation={null}\n          style={{ zIndex: 5000 }}\n          transition={isKeyboard.current ? 'transform 250ms' : ''}\n        >\n          {activeItem &&\n            renderItem({\n              item: activeItem,\n              id: activeItemId!.toString(),\n              style: {},\n              className: styles.active,\n              isDropPlaceholder: true,\n              isSortingActive: false,\n              isDragGhost: true,\n              dragHandleProps: {\n                ariaLabel: joinStrings(i18nStrings?.dragHandleAriaLabel, itemDefinition.label(activeItem)) ?? '',\n                active: true,\n                onKeyDown: handleKeyDown,\n              },\n            })}\n        </DragOverlay>\n      </Portal>\n    </DndContext>\n  );\n}\n\nfunction usePortalContainer() {\n  const portalContainerRef = useRef(typeof document !== 'undefined' ? document.createElement('div') : null);\n  useEffect(() => {\n    const container = portalContainerRef.current;\n    if (container && !container.isConnected) {\n      document.body.appendChild(container);\n    }\n    return () => {\n      if (container && container.isConnected) {\n        document.body.removeChild(container);\n      }\n    };\n  }, []);\n  return portalContainerRef.current;\n}\n\nfunction DraggableItem<Item>({\n  item,\n  itemDefinition,\n  dragHandleAriaLabel,\n  showDirectionButtons,\n  onKeyDown,\n  renderItem,\n}: {\n  item: Item;\n  itemDefinition: SortableAreaProps.ItemDefinition<Item>;\n  dragHandleAriaLabel?: string;\n  showDirectionButtons: boolean;\n  onKeyDown: (event: React.KeyboardEvent) => void;\n  renderItem: (props: SortableAreaProps.RenderItemProps<Item>) => React.ReactNode;\n}) {\n  const id = itemDefinition.id(item);\n  const { isDragging, isSorting, listeners, setNodeRef, transform, attributes } = useSortable({\n    id,\n  });\n  const style = { transform: CSS.Translate.toString(transform) };\n  const dragHandleListeners = attributes['aria-disabled']\n    ? {}\n    : {\n        ...listeners,\n        onKeyDown: (event: React.KeyboardEvent) => {\n          if (onKeyDown) {\n            onKeyDown(event);\n          }\n          if (listeners?.onKeyDown) {\n            listeners.onKeyDown(event);\n          }\n        },\n      };\n  const className = clsx(\n    isDragging && clsx(styles.placeholder, styles[`placeholder-${getBorderRadiusVariant(itemDefinition)}`]),\n    isSorting && styles.sorting\n  );\n  const dragHandleRef = useRef<HTMLElement>(null);\n  return (\n    <>\n      {renderItem({\n        item,\n        id,\n        ref: setNodeRef,\n        style,\n        className,\n        isDropPlaceholder: isDragging,\n        isSortingActive: isSorting,\n        isDragGhost: false,\n        dragHandleProps: {\n          ...dragHandleListeners,\n          ariaLabel: joinStrings(dragHandleAriaLabel, itemDefinition.label(item)) ?? '',\n          ariaDescribedby: attributes['aria-describedby'],\n          disabled: attributes['aria-disabled'],\n          triggerMode: 'controlled',\n          controlledShowButtons: showDirectionButtons,\n          ref: dragHandleRef,\n          directions: showDirectionButtons\n            ? {\n                'block-start': 'active',\n                'block-end': 'active',\n              }\n            : undefined,\n          onDirectionClick: direction => {\n            const event = new Event(direction === 'block-start' ? EventName.CustomUp : EventName.CustomDown, {\n              bubbles: true,\n              cancelable: true,\n            });\n            onKeyDown(event as any);\n            dragHandleRef.current?.dispatchEvent(event);\n          },\n        },\n      })}\n    </>\n  );\n}\n\nexport function getBorderRadiusVariant(\n  itemDefinition: SortableAreaProps.ItemDefinition<any>\n): SortableAreaProps.BorderRadiusVariant {\n  return itemDefinition.borderRadius ?? 'item';\n}\n"]}

package/internal/components/token-list/styles.css.js

@@ -1,15 +1,15 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_gfwv3_18bsb_193",
-  "horizontal": "awsui_horizontal_gfwv3_18bsb_196",
-  "vertical": "awsui_vertical_gfwv3_18bsb_202",
-  "list": "awsui_list_gfwv3_18bsb_207",
-  "grid": "awsui_grid_gfwv3_18bsb_226",
-  "list-item": "awsui_list-item_gfwv3_18bsb_238",
-  "toggle-container-inline": "awsui_toggle-container-inline_gfwv3_18bsb_245",
-  "toggle": "awsui_toggle_gfwv3_18bsb_245",
-  "description": "awsui_description_gfwv3_18bsb_338",
-  "separator": "awsui_separator_gfwv3_18bsb_342"
+  "root": "awsui_root_gfwv3_vu63l_193",
+  "horizontal": "awsui_horizontal_gfwv3_vu63l_196",
+  "vertical": "awsui_vertical_gfwv3_vu63l_202",
+  "list": "awsui_list_gfwv3_vu63l_207",
+  "grid": "awsui_grid_gfwv3_vu63l_226",
+  "list-item": "awsui_list-item_gfwv3_vu63l_238",
+  "toggle-container-inline": "awsui_toggle-container-inline_gfwv3_vu63l_245",
+  "toggle": "awsui_toggle_gfwv3_vu63l_245",
+  "description": "awsui_description_gfwv3_vu63l_338",
+  "separator": "awsui_separator_gfwv3_vu63l_342"
 };