@cloudscape-design/components 3.0.839 → 3.0.841

package/slider/styles.scoped.css

@@ -146,7 +146,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_pcgz5_1g7w1_149:not(#\9) {
+.awsui_root_pcgz5_17clr_149:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -155,12 +155,9 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   direction: inherit;
   empty-cells: show;
   font-family: serif;
-  font-size: medium;
   font-style: normal;
   font-variant: normal;
-  font-weight: 400;
   font-stretch: normal;
-  line-height: normal;
   -webkit-hyphens: none;
           hyphens: none;
   letter-spacing: normal;
@@ -187,11 +184,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline: calc(var(--space-m-udix3p, 16px) / 2);
 }
 
-.awsui_slider_pcgz5_1g7w1_189:not(#\9) {
+.awsui_slider_pcgz5_17clr_186:not(#\9) {
   display: flex;
   align-items: center;
 }
-.awsui_slider-track_pcgz5_1g7w1_193:not(#\9), .awsui_slider-range_pcgz5_1g7w1_193:not(#\9) {
+.awsui_slider-track_pcgz5_17clr_190:not(#\9), .awsui_slider-range_pcgz5_17clr_190:not(#\9) {
   position: absolute;
   border-start-start-radius: 3px;
   border-start-end-radius: 3px;
@@ -200,71 +197,71 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-start: var(--space-xs-zb16t3, 8px);
   margin-inline: calc(var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_slider-track_pcgz5_1g7w1_193:not(#\9) {
+.awsui_slider-track_pcgz5_17clr_190:not(#\9) {
   background-color: var(--color-background-slider-track-uhckut, #8c8c94);
   inline-size: calc(100% + var(--space-m-udix3p, 16px));
   block-size: 2px;
   cursor: pointer;
 }
-.awsui_slider-track_pcgz5_1g7w1_193.awsui_disabled_pcgz5_1g7w1_208:not(#\9) {
+.awsui_slider-track_pcgz5_17clr_190.awsui_disabled_pcgz5_17clr_205:not(#\9) {
   cursor: default;
   background-color: var(--color-background-control-disabled-5cbvij, #dedee3);
 }
-.awsui_slider-track_pcgz5_1g7w1_193.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_slider-track_pcgz5_1g7w1_193.awsui_disabled_pcgz5_1g7w1_208) {
+.awsui_slider-track_pcgz5_17clr_190.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_slider-track_pcgz5_17clr_190.awsui_disabled_pcgz5_17clr_205) {
   cursor: default;
   background-color: var(--color-background-control-disabled-5cbvij, #dedee3);
 }
-.awsui_slider-range_pcgz5_1g7w1_193:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190:not(#\9) {
   background-color: var(--color-background-slider-handle-default-94lnn1, #006ce0);
   block-size: 4px;
   inline-size: calc(var(--awsui-slider-range-inline-size-g964ok) + var(--space-m-udix3p, 16px));
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_error_pcgz5_1g7w1_221:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_error_pcgz5_17clr_218:not(#\9) {
   background-color: var(--color-text-status-error-5676bj, #db0000);
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_warning_pcgz5_1g7w1_224:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_warning_pcgz5_17clr_221:not(#\9) {
   background-color: var(--color-text-status-warning-csaw41, #855900);
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_active_pcgz5_1g7w1_227:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_active_pcgz5_17clr_224:not(#\9) {
   background-color: var(--color-background-slider-handle-active-7w7xg0, #004a9e);
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_error-active_pcgz5_1g7w1_230:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_error-active_pcgz5_17clr_227:not(#\9) {
   background-color: var(--color-background-slider-error-pressed-j572od, #700000);
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_warning-active_pcgz5_1g7w1_233:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_warning-active_pcgz5_17clr_230:not(#\9) {
   background-color: var(--color-background-slider-warning-pressed-pg5aih, #855900);
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_disabled_pcgz5_1g7w1_208:not(#\9) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_disabled_pcgz5_17clr_205:not(#\9) {
   background-color: var(--color-background-control-disabled-5cbvij, #dedee3);
 }
-.awsui_slider-range_pcgz5_1g7w1_193.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_slider-range_pcgz5_1g7w1_193.awsui_disabled_pcgz5_1g7w1_208) {
+.awsui_slider-range_pcgz5_17clr_190.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_slider-range_pcgz5_17clr_190.awsui_disabled_pcgz5_17clr_205) {
   inline-size: calc(var(--awsui-slider-range-inline-size-g964ok) + var(--space-s-34lx8l, 12px));
   background-color: var(--color-foreground-control-read-only-e43ooq, #656871);
 }
 
-.awsui_labels_pcgz5_1g7w1_244:not(#\9) {
+.awsui_labels_pcgz5_17clr_241:not(#\9) {
   display: grid;
   grid-template-columns: 3fr repeat(calc((var(--awsui-slider-label-count-g964ok) - 2) / 2 + (var(--awsui-slider-label-count-g964ok) - 2) / 2 - 1), 2fr) 3fr;
   grid-auto-rows: 100%;
   padding-block-start: var(--space-m-udix3p, 16px);
 }
-.awsui_labels-noref_pcgz5_1g7w1_250:not(#\9) {
+.awsui_labels-noref_pcgz5_17clr_247:not(#\9) {
   grid-template-columns: 1fr 1fr;
 }
-.awsui_labels-reference_pcgz5_1g7w1_253:not(#\9) {
+.awsui_labels-reference_pcgz5_17clr_250:not(#\9) {
   grid-column-start: var(--awsui-slider-reference-column-g964ok);
   grid-column-end: var(--awsui-slider-next-reference-column-g964ok);
   grid-row: 1;
   justify-self: center;
   text-align: center;
 }
-.awsui_labels-min_pcgz5_1g7w1_260:not(#\9) {
+.awsui_labels-min_pcgz5_17clr_257:not(#\9) {
   grid-column: 1;
   grid-row: 1;
   grid-column-end: var(--awsui-slider-min-end-g964ok);
   margin-inline-start: calc(var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_labels-max_pcgz5_1g7w1_266:not(#\9) {
+.awsui_labels-max_pcgz5_17clr_263:not(#\9) {
   text-align: end;
   justify-content: flex-end;
   grid-row: 1;
@@ -272,37 +269,37 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-column-start: var(--awsui-slider-max-start-g964ok);
   margin-inline-end: calc(var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_labels-aria-description_pcgz5_1g7w1_274:not(#\9) {
+.awsui_labels-aria-description_pcgz5_17clr_271:not(#\9) {
   display: none;
 }
 @media (max-width: 576px) {
-  .awsui_labels_pcgz5_1g7w1_244:not(#\9) {
+  .awsui_labels_pcgz5_17clr_241:not(#\9) {
     grid-template-columns: 1fr 1fr;
   }
-  .awsui_labels-min_pcgz5_1g7w1_260:not(#\9) {
+  .awsui_labels-min_pcgz5_17clr_257:not(#\9) {
     grid-column: 1;
   }
-  .awsui_labels-max_pcgz5_1g7w1_266:not(#\9) {
+  .awsui_labels-max_pcgz5_17clr_263:not(#\9) {
     grid-column: 2;
   }
-  .awsui_labels_pcgz5_1g7w1_244 > .awsui_labels-reference_pcgz5_1g7w1_253:not(#\9) {
+  .awsui_labels_pcgz5_17clr_241 > .awsui_labels-reference_pcgz5_17clr_250:not(#\9) {
     display: none;
   }
 }
 
-.awsui_ticks_pcgz5_1g7w1_292:not(#\9) {
+.awsui_ticks_pcgz5_17clr_289:not(#\9) {
   display: grid;
   grid-template-columns: repeat(var(--awsui-slider-tick-count-g964ok), 1fr);
   inline-size: calc(100% - var(--space-m-udix3p, 16px));
   margin-inline: calc(var(--space-m-udix3p, 16px) / 2);
 }
-.awsui_ticks-wrapper_pcgz5_1g7w1_298:not(#\9) {
+.awsui_ticks-wrapper_pcgz5_17clr_295:not(#\9) {
   block-size: 0;
   display: flex;
   margin-inline: calc(var(--space-m-udix3p, 16px) / -2);
 }
 
-.awsui_tick_pcgz5_1g7w1_292:not(#\9) {
+.awsui_tick_pcgz5_17clr_289:not(#\9) {
   grid-row: 1;
   block-size: var(--space-xs-zb16t3, 8px);
   inline-size: var(--space-xxxs-zbmxqb, 2px);
@@ -311,51 +308,51 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background: var(--color-background-slider-track-uhckut, #8c8c94);
   inset-block-start: -4px;
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_middle_pcgz5_1g7w1_313:not(#\9):first-child, .awsui_tick_pcgz5_1g7w1_292.awsui_middle_pcgz5_1g7w1_313:not(#\9):last-child {
+.awsui_tick_pcgz5_17clr_289.awsui_middle_pcgz5_17clr_310:not(#\9):first-child, .awsui_tick_pcgz5_17clr_289.awsui_middle_pcgz5_17clr_310:not(#\9):last-child {
   visibility: hidden;
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_filled_pcgz5_1g7w1_316:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_filled_pcgz5_17clr_313:not(#\9) {
   background: var(--color-background-slider-handle-default-94lnn1, #006ce0);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_filled_pcgz5_1g7w1_316.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208) {
+.awsui_tick_pcgz5_17clr_289.awsui_filled_pcgz5_17clr_313.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205) {
   background: var(--color-foreground-control-read-only-e43ooq, #656871);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_active_pcgz5_1g7w1_227:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_active_pcgz5_17clr_224:not(#\9) {
   background: var(--color-background-slider-handle-active-7w7xg0, #004a9e);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_error_pcgz5_1g7w1_221:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_error_pcgz5_17clr_218:not(#\9) {
   background: var(--color-text-status-error-5676bj, #db0000);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_warning_pcgz5_1g7w1_224:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_warning_pcgz5_17clr_221:not(#\9) {
   background: var(--color-text-status-warning-csaw41, #855900);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_error-active_pcgz5_1g7w1_230:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_error-active_pcgz5_17clr_227:not(#\9) {
   background-color: var(--color-background-slider-error-pressed-j572od, #700000);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_warning-active_pcgz5_1g7w1_233:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_warning-active_pcgz5_17clr_230:not(#\9) {
   background-color: var(--color-background-slider-warning-pressed-pg5aih, #855900);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_disabled_pcgz5_1g7w1_208:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_disabled_pcgz5_17clr_205:not(#\9) {
   background: var(--color-background-control-disabled-5cbvij, #dedee3);
 }
-.awsui_tick_pcgz5_1g7w1_292.awsui_readonly_pcgz5_1g7w1_212:not(#\9) {
+.awsui_tick_pcgz5_17clr_289.awsui_readonly_pcgz5_17clr_209:not(#\9) {
   background: var(--color-background-control-disabled-5cbvij, #dedee3);
 }
 
-.awsui_tooltip-thumb_pcgz5_1g7w1_344:not(#\9) {
+.awsui_tooltip-thumb_pcgz5_17clr_341:not(#\9) {
   position: absolute;
   inline-size: var(--space-xxl-cu2m1r, 32px);
   block-size: var(--space-xxl-cu2m1r, 32px);
   margin-block-start: calc(var(--space-s-34lx8l, 12px) / -1);
   inset-inline-start: var(--awsui-slider-tooltip-position-g964ok);
 }
-.awsui_tooltip-thumb_pcgz5_1g7w1_344.awsui_readonly_pcgz5_1g7w1_212:not(#\9) {
+.awsui_tooltip-thumb_pcgz5_17clr_341.awsui_readonly_pcgz5_17clr_209:not(#\9) {
   inline-size: var(--space-xl-lmui9r, 24px);
   block-size: var(--space-xl-lmui9r, 24px);
   margin-block-start: calc(var(--space-xs-zb16t3, 8px) / -1);
 }
 
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9) {
+.awsui_thumb_pcgz5_17clr_354:not(#\9) {
   background: transparent;
   -webkit-appearance: none;
           appearance: none;
@@ -368,13 +365,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   cursor: pointer;
   touch-action: none;
 }
-.awsui_thumb_pcgz5_1g7w1_357.awsui_disabled_pcgz5_1g7w1_208:not(#\9) {
+.awsui_thumb_pcgz5_17clr_354.awsui_disabled_pcgz5_17clr_205:not(#\9) {
   cursor: default;
 }
-.awsui_thumb_pcgz5_1g7w1_357.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_thumb_pcgz5_1g7w1_357.awsui_disabled_pcgz5_1g7w1_208) {
+.awsui_thumb_pcgz5_17clr_354.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_thumb_pcgz5_17clr_354.awsui_disabled_pcgz5_17clr_205) {
   cursor: default;
 }
-.awsui_thumb_pcgz5_1g7w1_357.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_thumb_pcgz5_1g7w1_357.awsui_disabled_pcgz5_1g7w1_208):focus::-webkit-slider-thumb, .awsui_thumb_pcgz5_1g7w1_357.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_thumb_pcgz5_1g7w1_357.awsui_disabled_pcgz5_1g7w1_208):active::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_17clr_354.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_thumb_pcgz5_17clr_354.awsui_disabled_pcgz5_17clr_205):focus::-webkit-slider-thumb, .awsui_thumb_pcgz5_17clr_354.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_thumb_pcgz5_17clr_354.awsui_disabled_pcgz5_17clr_205):active::-webkit-slider-thumb {
   block-size: var(--space-s-34lx8l, 12px);
   inline-size: var(--space-s-34lx8l, 12px);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-foreground-control-read-only-e43ooq, #656871);
@@ -383,7 +380,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-block-width: 2px;
   border-inline-width: 2px;
 }
-.awsui_thumb_pcgz5_1g7w1_357.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_thumb_pcgz5_1g7w1_357.awsui_disabled_pcgz5_1g7w1_208):focus::-moz-range-thumb, .awsui_thumb_pcgz5_1g7w1_357.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_thumb_pcgz5_1g7w1_357.awsui_disabled_pcgz5_1g7w1_208):active::-moz-range-thumb {
+.awsui_thumb_pcgz5_17clr_354.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_thumb_pcgz5_17clr_354.awsui_disabled_pcgz5_17clr_205):focus::-moz-range-thumb, .awsui_thumb_pcgz5_17clr_354.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_thumb_pcgz5_17clr_354.awsui_disabled_pcgz5_17clr_205):active::-moz-range-thumb {
   block-size: var(--space-s-34lx8l, 12px);
   inline-size: var(--space-s-34lx8l, 12px);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-foreground-control-read-only-e43ooq, #656871);
@@ -392,13 +389,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-block-width: 2px;
   border-inline-width: 2px;
 }
-.awsui_thumb_pcgz5_1g7w1_357.awsui_min_pcgz5_1g7w1_393:not(#\9) {
+.awsui_thumb_pcgz5_17clr_354.awsui_min_pcgz5_17clr_390:not(#\9) {
   margin-inline-start: calc(-1px + var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_thumb_pcgz5_1g7w1_357.awsui_max_pcgz5_1g7w1_396:not(#\9) {
+.awsui_thumb_pcgz5_17clr_354.awsui_max_pcgz5_17clr_393:not(#\9) {
   margin-inline-start: calc(1px + var(--space-m-udix3p, 16px) / -2);
 }
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9)::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_17clr_354:not(#\9)::-webkit-slider-thumb {
   -webkit-appearance: none;
           appearance: none;
   appearance: none;
@@ -417,7 +414,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: all;
   position: relative;
 }
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9)::-moz-range-thumb {
+.awsui_thumb_pcgz5_17clr_354:not(#\9)::-moz-range-thumb {
   appearance: none;
   appearance: none;
   background: var(--color-background-slider-handle-default-94lnn1, #006ce0);
@@ -435,13 +432,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: all;
   position: relative;
 }
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9):hover::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_17clr_354:not(#\9):hover::-webkit-slider-thumb {
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-handle-default-94lnn1, #006ce0);
 }
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9):hover::-moz-range-thumb {
+.awsui_thumb_pcgz5_17clr_354:not(#\9):hover::-moz-range-thumb {
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-handle-default-94lnn1, #006ce0);
 }
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9):focus::-webkit-slider-thumb, .awsui_thumb_pcgz5_1g7w1_357:not(#\9):active::-webkit-slider-thumb {
+.awsui_thumb_pcgz5_17clr_354:not(#\9):focus::-webkit-slider-thumb, .awsui_thumb_pcgz5_17clr_354:not(#\9):active::-webkit-slider-thumb {
   block-size: 20px;
   inline-size: 20px;
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-handle-active-7w7xg0, #004a9e);
@@ -450,7 +447,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-block-width: 2px;
   border-inline-width: 2px;
 }
-.awsui_thumb_pcgz5_1g7w1_357:not(#\9):focus::-moz-range-thumb, .awsui_thumb_pcgz5_1g7w1_357:not(#\9):active::-moz-range-thumb {
+.awsui_thumb_pcgz5_17clr_354:not(#\9):focus::-moz-range-thumb, .awsui_thumb_pcgz5_17clr_354:not(#\9):active::-moz-range-thumb {
   block-size: 20px;
   inline-size: 20px;
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-handle-active-7w7xg0, #004a9e);
@@ -460,30 +457,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-inline-width: 2px;
 }
 
-.awsui_error_pcgz5_1g7w1_221:not(#\9)::-webkit-slider-thumb {
+.awsui_error_pcgz5_17clr_218:not(#\9)::-webkit-slider-thumb {
   background-color: var(--color-text-status-error-5676bj, #db0000);
   border-color: var(--color-text-status-error-5676bj, #db0000);
 }
-.awsui_error_pcgz5_1g7w1_221:not(#\9)::-moz-range-thumb {
+.awsui_error_pcgz5_17clr_218:not(#\9)::-moz-range-thumb {
   background-color: var(--color-text-status-error-5676bj, #db0000);
   border-color: var(--color-text-status-error-5676bj, #db0000);
 }
-.awsui_error_pcgz5_1g7w1_221:not(#\9):hover::-webkit-slider-thumb {
+.awsui_error_pcgz5_17clr_218:not(#\9):hover::-webkit-slider-thumb {
   background-color: var(--color-text-status-error-5676bj, #db0000);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-text-status-error-5676bj, #db0000);
 }
-.awsui_error_pcgz5_1g7w1_221:not(#\9):hover::-moz-range-thumb {
+.awsui_error_pcgz5_17clr_218:not(#\9):hover::-moz-range-thumb {
   background-color: var(--color-text-status-error-5676bj, #db0000);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-text-status-error-5676bj, #db0000);
 }
-.awsui_error_pcgz5_1g7w1_221:not(#\9):focus::-webkit-slider-thumb, .awsui_error_pcgz5_1g7w1_221:not(#\9):active::-webkit-slider-thumb {
+.awsui_error_pcgz5_17clr_218:not(#\9):focus::-webkit-slider-thumb, .awsui_error_pcgz5_17clr_218:not(#\9):active::-webkit-slider-thumb {
   background-color: var(--color-background-slider-error-pressed-j572od, #700000);
   border-block-width: 2px;
   border-inline-width: 2px;
   border-color: var(--color-background-slider-error-pressed-j572od, #700000);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-error-pressed-j572od, #700000);
 }
-.awsui_error_pcgz5_1g7w1_221:not(#\9):focus::-moz-range-thumb, .awsui_error_pcgz5_1g7w1_221:not(#\9):active::-moz-range-thumb {
+.awsui_error_pcgz5_17clr_218:not(#\9):focus::-moz-range-thumb, .awsui_error_pcgz5_17clr_218:not(#\9):active::-moz-range-thumb {
   background-color: var(--color-background-slider-error-pressed-j572od, #700000);
   border-block-width: 2px;
   border-inline-width: 2px;
@@ -491,30 +488,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-error-pressed-j572od, #700000);
 }
 
-.awsui_warning_pcgz5_1g7w1_224:not(#\9)::-webkit-slider-thumb {
+.awsui_warning_pcgz5_17clr_221:not(#\9)::-webkit-slider-thumb {
   background-color: var(--color-text-status-warning-csaw41, #855900);
   border-color: var(--color-text-status-warning-csaw41, #855900);
 }
-.awsui_warning_pcgz5_1g7w1_224:not(#\9)::-moz-range-thumb {
+.awsui_warning_pcgz5_17clr_221:not(#\9)::-moz-range-thumb {
   background-color: var(--color-text-status-warning-csaw41, #855900);
   border-color: var(--color-text-status-warning-csaw41, #855900);
 }
-.awsui_warning_pcgz5_1g7w1_224:not(#\9):hover::-webkit-slider-thumb {
+.awsui_warning_pcgz5_17clr_221:not(#\9):hover::-webkit-slider-thumb {
   background-color: var(--color-text-status-warning-csaw41, #855900);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-text-status-warning-csaw41, #855900);
 }
-.awsui_warning_pcgz5_1g7w1_224:not(#\9):hover::-moz-range-thumb {
+.awsui_warning_pcgz5_17clr_221:not(#\9):hover::-moz-range-thumb {
   background-color: var(--color-text-status-warning-csaw41, #855900);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-text-status-warning-csaw41, #855900);
 }
-.awsui_warning_pcgz5_1g7w1_224:not(#\9):focus::-webkit-slider-thumb, .awsui_warning_pcgz5_1g7w1_224:not(#\9):active::-webkit-slider-thumb {
+.awsui_warning_pcgz5_17clr_221:not(#\9):focus::-webkit-slider-thumb, .awsui_warning_pcgz5_17clr_221:not(#\9):active::-webkit-slider-thumb {
   background-color: var(--color-background-slider-warning-pressed-pg5aih, #855900);
   border-block-width: 2px;
   border-inline-width: 2px;
   border-color: var(--color-background-slider-warning-pressed-pg5aih, #855900);
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-warning-pressed-pg5aih, #855900);
 }
-.awsui_warning_pcgz5_1g7w1_224:not(#\9):focus::-moz-range-thumb, .awsui_warning_pcgz5_1g7w1_224:not(#\9):active::-moz-range-thumb {
+.awsui_warning_pcgz5_17clr_221:not(#\9):focus::-moz-range-thumb, .awsui_warning_pcgz5_17clr_221:not(#\9):active::-moz-range-thumb {
   background-color: var(--color-background-slider-warning-pressed-pg5aih, #855900);
   border-block-width: 2px;
   border-inline-width: 2px;
@@ -522,9 +519,9 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-shadow: 0px 0 0 2px var(--color-background-slider-handle-ring-nibud6, #ffffff), 0 0 0 4px var(--color-background-slider-warning-pressed-pg5aih, #855900);
 }
 
-.awsui_disabled_pcgz5_1g7w1_208:not(#\9)::-webkit-slider-thumb,
-.awsui_disabled_pcgz5_1g7w1_208:not(#\9):hover::-webkit-slider-thumb,
-.awsui_disabled_pcgz5_1g7w1_208:not(#\9):active::-webkit-slider-thumb {
+.awsui_disabled_pcgz5_17clr_205:not(#\9)::-webkit-slider-thumb,
+.awsui_disabled_pcgz5_17clr_205:not(#\9):hover::-webkit-slider-thumb,
+.awsui_disabled_pcgz5_17clr_205:not(#\9):active::-webkit-slider-thumb {
   block-size: var(--space-m-udix3p, 16px);
   inline-size: var(--space-m-udix3p, 16px);
   background-color: var(--color-background-control-disabled-5cbvij, #dedee3);
@@ -532,9 +529,9 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-shadow: none;
   pointer-events: none;
 }
-.awsui_disabled_pcgz5_1g7w1_208:not(#\9)::-moz-range-thumb,
-.awsui_disabled_pcgz5_1g7w1_208:not(#\9):hover::-moz-range-thumb,
-.awsui_disabled_pcgz5_1g7w1_208:not(#\9):active::-moz-range-thumb {
+.awsui_disabled_pcgz5_17clr_205:not(#\9)::-moz-range-thumb,
+.awsui_disabled_pcgz5_17clr_205:not(#\9):hover::-moz-range-thumb,
+.awsui_disabled_pcgz5_17clr_205:not(#\9):active::-moz-range-thumb {
   block-size: var(--space-m-udix3p, 16px);
   inline-size: var(--space-m-udix3p, 16px);
   background-color: var(--color-background-control-disabled-5cbvij, #dedee3);
@@ -543,9 +540,9 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: none;
 }
 
-.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208)::-webkit-slider-thumb,
-.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208):hover::-webkit-slider-thumb,
-.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208):active::-webkit-slider-thumb {
+.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205)::-webkit-slider-thumb,
+.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205):hover::-webkit-slider-thumb,
+.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205):active::-webkit-slider-thumb {
   block-size: var(--space-s-34lx8l, 12px);
   inline-size: var(--space-s-34lx8l, 12px);
   background-color: var(--color-foreground-control-read-only-e43ooq, #656871);
@@ -554,9 +551,9 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: none;
   cursor: initial;
 }
-.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208)::-moz-range-thumb,
-.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208):hover::-moz-range-thumb,
-.awsui_readonly_pcgz5_1g7w1_212:not(#\9):not(.awsui_disabled_pcgz5_1g7w1_208):active::-moz-range-thumb {
+.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205)::-moz-range-thumb,
+.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205):hover::-moz-range-thumb,
+.awsui_readonly_pcgz5_17clr_209:not(#\9):not(.awsui_disabled_pcgz5_17clr_205):active::-moz-range-thumb {
   block-size: var(--space-s-34lx8l, 12px);
   inline-size: var(--space-s-34lx8l, 12px);
   background-color: var(--color-foreground-control-read-only-e43ooq, #656871);

package/slider/styles.selectors.js

@@ -2,31 +2,31 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_pcgz5_1g7w1_149",
-  "slider": "awsui_slider_pcgz5_1g7w1_189",
-  "slider-track": "awsui_slider-track_pcgz5_1g7w1_193",
-  "slider-range": "awsui_slider-range_pcgz5_1g7w1_193",
-  "disabled": "awsui_disabled_pcgz5_1g7w1_208",
-  "readonly": "awsui_readonly_pcgz5_1g7w1_212",
-  "error": "awsui_error_pcgz5_1g7w1_221",
-  "warning": "awsui_warning_pcgz5_1g7w1_224",
-  "active": "awsui_active_pcgz5_1g7w1_227",
-  "error-active": "awsui_error-active_pcgz5_1g7w1_230",
-  "warning-active": "awsui_warning-active_pcgz5_1g7w1_233",
-  "labels": "awsui_labels_pcgz5_1g7w1_244",
-  "labels-noref": "awsui_labels-noref_pcgz5_1g7w1_250",
-  "labels-reference": "awsui_labels-reference_pcgz5_1g7w1_253",
-  "labels-min": "awsui_labels-min_pcgz5_1g7w1_260",
-  "labels-max": "awsui_labels-max_pcgz5_1g7w1_266",
-  "labels-aria-description": "awsui_labels-aria-description_pcgz5_1g7w1_274",
-  "ticks": "awsui_ticks_pcgz5_1g7w1_292",
-  "ticks-wrapper": "awsui_ticks-wrapper_pcgz5_1g7w1_298",
-  "tick": "awsui_tick_pcgz5_1g7w1_292",
-  "middle": "awsui_middle_pcgz5_1g7w1_313",
-  "filled": "awsui_filled_pcgz5_1g7w1_316",
-  "tooltip-thumb": "awsui_tooltip-thumb_pcgz5_1g7w1_344",
-  "thumb": "awsui_thumb_pcgz5_1g7w1_357",
-  "min": "awsui_min_pcgz5_1g7w1_393",
-  "max": "awsui_max_pcgz5_1g7w1_396"
+  "root": "awsui_root_pcgz5_17clr_149",
+  "slider": "awsui_slider_pcgz5_17clr_186",
+  "slider-track": "awsui_slider-track_pcgz5_17clr_190",
+  "slider-range": "awsui_slider-range_pcgz5_17clr_190",
+  "disabled": "awsui_disabled_pcgz5_17clr_205",
+  "readonly": "awsui_readonly_pcgz5_17clr_209",
+  "error": "awsui_error_pcgz5_17clr_218",
+  "warning": "awsui_warning_pcgz5_17clr_221",
+  "active": "awsui_active_pcgz5_17clr_224",
+  "error-active": "awsui_error-active_pcgz5_17clr_227",
+  "warning-active": "awsui_warning-active_pcgz5_17clr_230",
+  "labels": "awsui_labels_pcgz5_17clr_241",
+  "labels-noref": "awsui_labels-noref_pcgz5_17clr_247",
+  "labels-reference": "awsui_labels-reference_pcgz5_17clr_250",
+  "labels-min": "awsui_labels-min_pcgz5_17clr_257",
+  "labels-max": "awsui_labels-max_pcgz5_17clr_263",
+  "labels-aria-description": "awsui_labels-aria-description_pcgz5_17clr_271",
+  "ticks": "awsui_ticks_pcgz5_17clr_289",
+  "ticks-wrapper": "awsui_ticks-wrapper_pcgz5_17clr_295",
+  "tick": "awsui_tick_pcgz5_17clr_289",
+  "middle": "awsui_middle_pcgz5_17clr_310",
+  "filled": "awsui_filled_pcgz5_17clr_313",
+  "tooltip-thumb": "awsui_tooltip-thumb_pcgz5_17clr_341",
+  "thumb": "awsui_thumb_pcgz5_17clr_354",
+  "min": "awsui_min_pcgz5_17clr_390",
+  "max": "awsui_max_pcgz5_17clr_393"
 };
   

package/slider/tick-marks.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export interface SliderTicksProps {
+interface SliderTicksProps {
     hideFillLine?: boolean;
     value: number;
     isActive: boolean;
@@ -11,8 +11,6 @@ export interface SliderTicksProps {
     max: number;
     step: number;
 }
-export interface SliderTickMarkProps extends SliderTicksProps {
-    type: 'min' | 'max' | 'step';
-}
 export default function SliderTickMarks(props: SliderTicksProps): JSX.Element;
+export {};
 //# sourceMappingURL=tick-marks.d.ts.map

package/slider/tick-marks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tick-marks.d.ts","sourceRoot":"","sources":["../../../src/slider/tick-marks.tsx"],"names":[],"mappings":";AAUA,MAAM,WAAW,gBAAgB;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB;IAC3D,IAAI,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,CAAC;CAC9B;AAkCD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,gBAAgB,eAmB9D"}
+{"version":3,"file":"tick-marks.d.ts","sourceRoot":"","sources":["../../../src/slider/tick-marks.tsx"],"names":[],"mappings":";AAUA,UAAU,gBAAgB;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;CACd;AAsCD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,gBAAgB,eAmB9D"}

package/slider/tick-marks.js.map

@@ -1 +1 @@
-{"version":3,"file":"tick-marks.js","sourceRoot":"","sources":["../../../src/slider/tick-marks.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,cAAc,MAAM,sDAAsD,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAmBrC,SAAS,QAAQ,CAAC,KAA0B;IAC1C,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAE5G,MAAM,WAAW,GAAG,OAAO,IAAI,CAAC,OAAO,CAAC;IAExC,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,IAAI,IAAI,KAAK,KAAK,EAAE;YAClB,OAAO,GAAG,CAAC;SACZ;QACD,IAAI,IAAI,KAAK,KAAK,EAAE;YAClB,OAAO,GAAG,CAAC;SACZ;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAC3B,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACnD,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,YAAY,IAAI,QAAQ,IAAI,KAAK,GAAG,OAAO,EAAE;YAC/D,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,OAAO,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YAC7D,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,WAAW,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACnE,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,OAAO,IAAI,QAAQ,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACnF,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,WAAW,IAAI,QAAQ,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACzF,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC3B,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC3B,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,MAAM;SACjC,CAAC,GACF,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAuB;IAC7D,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAEjC,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC;QACrC,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAC,KAAK,IAAG;QAClC,6BACE,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,KAAK,EAAE;gBACL,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC;aACjE,IAEA,YAAY,CAAC,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACnD,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,KAAK,EAAE,IAAI,CACtE,CAAC,CACE;QACN,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAC,KAAK,IAAG,CAC9B,CACP,CAAC;AACJ,CAAC","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';\n\nimport customCssProps from '../internal/generated/custom-css-properties/index.js';\nimport { getStepArray } from './utils.js';\n\nimport styles from './styles.css.js';\n\nexport interface SliderTicksProps {\n  hideFillLine?: boolean;\n  value: number;\n  isActive: boolean;\n  invalid?: boolean;\n  warning?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  min: number;\n  max: number;\n  step: number;\n}\n\nexport interface SliderTickMarkProps extends SliderTicksProps {\n  type: 'min' | 'max' | 'step';\n}\n\nfunction TickMark(props: SliderTickMarkProps) {\n  const { hideFillLine, value, isActive, invalid, warning, disabled, type, min, max, step, readOnly } = props;\n\n  const showWarning = warning && !invalid;\n\n  const getType = () => {\n    if (type === 'min') {\n      return min;\n    }\n    if (type === 'max') {\n      return max;\n    }\n    return step;\n  };\n\n  return (\n    <div\n      className={clsx(styles.tick, {\n        [styles.filled]: !hideFillLine && value > getType(),\n        [styles.active]: !hideFillLine && isActive && value > getType(),\n        [styles.error]: invalid && !hideFillLine && value > getType(),\n        [styles.warning]: showWarning && !hideFillLine && value > getType(),\n        [styles['error-active']]: invalid && isActive && !hideFillLine && value > getType(),\n        [styles['warning-active']]: showWarning && isActive && !hideFillLine && value > getType(),\n        [styles.disabled]: disabled,\n        [styles.readonly]: readOnly,\n        [styles.middle]: type === 'step',\n      })}\n    />\n  );\n}\n\nexport default function SliderTickMarks(props: SliderTicksProps) {\n  const { min, max, step } = props;\n\n  return (\n    <div className={styles['ticks-wrapper']}>\n      <TickMark {...props} type=\"min\" />\n      <div\n        className={styles.ticks}\n        style={{\n          [customCssProps.sliderTickCount]: Math.round((max - min) / step),\n        }}\n      >\n        {getStepArray(step, [min, max]).map((step, index) => (\n          <TickMark {...props} type=\"step\" step={step} key={`step-${index}`} />\n        ))}\n      </div>\n      <TickMark {...props} type=\"max\" />\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"tick-marks.js","sourceRoot":"","sources":["../../../src/slider/tick-marks.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,cAAc,MAAM,sDAAsD,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAmBrC,SAAS,QAAQ,CAAC,KAA0B;IAC1C,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAE5G,MAAM,WAAW,GAAG,OAAO,IAAI,CAAC,OAAO,CAAC;IAExC,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,IAAI,IAAI,KAAK,KAAK,EAAE;YAClB,OAAO,GAAG,CAAC;SACZ;QACD,IAAI,IAAI,KAAK,KAAK,EAAE;YAClB,OAAO,GAAG,CAAC;SACZ;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAC3B,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACnD,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,YAAY,IAAI,QAAQ,IAAI,KAAK,GAAG,OAAO,EAAE;YAC/D,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,OAAO,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YAC7D,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,WAAW,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACnE,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,OAAO,IAAI,QAAQ,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACnF,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,WAAW,IAAI,QAAQ,IAAI,CAAC,YAAY,IAAI,KAAK,GAAG,OAAO,EAAE;YACzF,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC3B,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC3B,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,IAAI,KAAK,MAAM;SACjC,CAAC,GACF,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAuB;IAC7D,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAEjC,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC;QACrC,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAC,KAAK,IAAG;QAClC,6BACE,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,KAAK,EAAE;gBACL,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC;aACjE,IAEA,YAAY,CAAC,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACnD,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,KAAK,EAAE,IAAI,CACtE,CAAC,CACE;QACN,oBAAC,QAAQ,oBAAK,KAAK,IAAE,IAAI,EAAC,KAAK,IAAG,CAC9B,CACP,CAAC;AACJ,CAAC","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';\n\nimport customCssProps from '../internal/generated/custom-css-properties/index.js';\nimport { getStepArray } from './utils.js';\n\nimport styles from './styles.css.js';\n\ninterface SliderTicksProps {\n  hideFillLine?: boolean;\n  value: number;\n  isActive: boolean;\n  invalid?: boolean;\n  warning?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  min: number;\n  max: number;\n  step: number;\n}\n\ninterface SliderTickMarkProps extends SliderTicksProps {\n  type: 'min' | 'max' | 'step';\n}\n\nfunction TickMark(props: SliderTickMarkProps) {\n  const { hideFillLine, value, isActive, invalid, warning, disabled, type, min, max, step, readOnly } = props;\n\n  const showWarning = warning && !invalid;\n\n  const getType = () => {\n    if (type === 'min') {\n      return min;\n    }\n    if (type === 'max') {\n      return max;\n    }\n    return step;\n  };\n\n  return (\n    <div\n      className={clsx(styles.tick, {\n        [styles.filled]: !hideFillLine && value > getType(),\n        [styles.active]: !hideFillLine && isActive && value > getType(),\n        [styles.error]: invalid && !hideFillLine && value > getType(),\n        [styles.warning]: showWarning && !hideFillLine && value > getType(),\n        [styles['error-active']]: invalid && isActive && !hideFillLine && value > getType(),\n        [styles['warning-active']]: showWarning && isActive && !hideFillLine && value > getType(),\n        [styles.disabled]: disabled,\n        [styles.readonly]: readOnly,\n        [styles.middle]: type === 'step',\n      })}\n    />\n  );\n}\n\nexport default function SliderTickMarks(props: SliderTicksProps) {\n  const { min, max, step } = props;\n\n  return (\n    <div className={styles['ticks-wrapper']}>\n      <TickMark {...props} type=\"min\" />\n      <div\n        className={styles.ticks}\n        style={{\n          [customCssProps.sliderTickCount]: Math.round((max - min) / step),\n        }}\n      >\n        {getStepArray(step, [min, max]).map((step, index) => (\n          <TickMark {...props} type=\"step\" step={step} key={`step-${index}`} />\n        ))}\n      </div>\n      <TickMark {...props} type=\"max\" />\n    </div>\n  );\n}\n"]}

package/split-panel/bottom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAMtD,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,EAAE,4BAA4B,eA8D9B"}
+{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAU3D,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAMtD,UAAU,4BAA6B,SAAQ,sBAAsB;IACnE,iBAAiB,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,EAAE,4BAA4B,eAyE9B"}

package/split-panel/bottom.js

@@ -1,10 +1,11 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import clsx from 'clsx';
 import { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';
 import { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';
 import { useSplitPanelContext } from '../internal/context/split-panel-context';
+import * as tokens from '../internal/generated/styles/tokens';
 import { useMobile } from '../internal/hooks/use-mobile';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
 import sharedStyles from '../app-layout/resize/styles.css.js';
@@ -16,7 +17,12 @@ export function SplitPanelContentBottom({ baseProps, isOpen, splitPanelRef, capp
     const { bottomOffset, leftOffset, rightOffset, disableContentPaddings, contentWrapperPaddings, reportHeaderHeight, animationDisabled, } = useSplitPanelContext();
     const isMobile = useMobile();
     const headerRef = useRef(null);
-    useResizeObserver(headerRef, entry => reportHeaderHeight(entry.borderBoxHeight));
+    const [headerBlockSize, setHeaderBlockSize] = useState();
+    useResizeObserver(headerRef, entry => {
+        const { borderBoxHeight } = entry;
+        setHeaderBlockSize(borderBoxHeight);
+        reportHeaderHeight(borderBoxHeight);
+    });
     useEffect(() => {
         // report empty height when unmounting the panel
         return () => reportHeaderHeight(0);
@@ -39,7 +45,11 @@ export function SplitPanelContentBottom({ baseProps, isOpen, splitPanelRef, capp
             insetBlockEnd: bottomOffset,
             insetInlineStart: leftOffset,
             insetInlineEnd: rightOffset,
-            blockSize: isOpen ? cappedSize : isToolbar ? '0px' : undefined,
+            blockSize: isOpen
+                ? cappedSize
+                : isToolbar && headerBlockSize !== undefined
+                    ? `calc(${headerBlockSize}px + ${tokens.borderPanelTopWidth})`
+                    : undefined,
         }, ref: splitPanelRef }),
         isOpen && React.createElement("div", { className: styles['slider-wrapper-bottom'] }, resizeHandle),
         React.createElement("div", { className: styles['drawer-content-bottom'], "aria-labelledby": panelHeaderId, role: "region" },

package/split-panel/bottom.js.map

@@ -1 +1 @@
-{"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,YAAY,MAAM,oCAAoC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAM1D,MAAM,UAAU,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACqB;IAC7B,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,sBAAsB,EACtB,kBAAkB,EAClB,iBAAiB,GAClB,GAAG,oBAAoB,EAAE,CAAC;IAC3B,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAE7B,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,iBAAiB,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC;IACjF,SAAS,CAAC,GAAG,EAAE;QACb,gDAAgD;QAChD,OAAO,GAAG,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;QACnC,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,uBAAuB,GAAG,IAAI,CAAC;QACnC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,SAAS;QAC/C,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,SAAS;QAC9E,CAAC,MAAM,CAAC,mCAAmC,CAAC,CAAC,EAAE,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,WAAW;KACnF,CAAC,CAAC;IAEH,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC,EAAE,cAAc,CAAC,IAAI,EAAE;YAClG,CAAC,YAAY,CAAC,sBAAsB,CAAC,CAAC,EAAE,CAAC,iBAAiB;YAC1D,CAAC,cAAc,CAAC,sBAAsB,CAAC,CAAC,EAAE,MAAM;YAChD,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,MAAM;YAClC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,QAAQ;YACnC,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,sBAAsB;YACnE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS;YAC3B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,SAAS;SACpC,CAAC,EACF,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,QAAQ,EAAE,EACpC,KAAK,EAAE;YACL,aAAa,EAAE,YAAY;YAC3B,gBAAgB,EAAE,UAAU;YAC5B,cAAc,EAAE,WAAW;YAC3B,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;SAC/D,EACD,GAAG,EAAE,aAAa;QAEjB,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,IAAG,YAAY,CAAO;QAChF,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,qBAAmB,aAAa,EAAE,IAAI,EAAC,QAAQ;YAC5F,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,4BAA4B,CAAC,EAAE,uBAAuB,CAAC,EAAE,GAAG,EAAE,SAAS,IAChG,MAAM,CACH;YACN,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,EAAE,uBAAuB,CAAC,iBAAe,CAAC,MAAM;gBAC3F,6BAAK,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,iBAAiB,IAChG,QAAQ,CACL,CACF,CACF,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps } from './interfaces';\n\nimport sharedStyles from '../app-layout/resize/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentBottomProps extends SplitPanelContentProps {\n  appLayoutMaxWidth: React.CSSProperties | undefined;\n}\n\nexport function SplitPanelContentBottom({\n  baseProps,\n  isOpen,\n  splitPanelRef,\n  cappedSize,\n  header,\n  resizeHandle,\n  children,\n  appLayoutMaxWidth,\n  panelHeaderId,\n  onToggle,\n}: SplitPanelContentBottomProps) {\n  const isRefresh = useVisualRefresh();\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const {\n    bottomOffset,\n    leftOffset,\n    rightOffset,\n    disableContentPaddings,\n    contentWrapperPaddings,\n    reportHeaderHeight,\n    animationDisabled,\n  } = useSplitPanelContext();\n  const isMobile = useMobile();\n\n  const headerRef = useRef<HTMLDivElement>(null);\n  useResizeObserver(headerRef, entry => reportHeaderHeight(entry.borderBoxHeight));\n  useEffect(() => {\n    // report empty height when unmounting the panel\n    return () => reportHeaderHeight(0);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const centeredMaxWidthClasses = clsx({\n    [styles['pane-bottom-center-align']]: isRefresh,\n    [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n    [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n  });\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root, {\n        [sharedStyles['with-motion-vertical']]: !animationDisabled,\n        [testUtilStyles['open-position-bottom']]: isOpen,\n        [styles['drawer-closed']]: !isOpen,\n        [styles['drawer-mobile']]: isMobile,\n        [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n        [styles.refresh]: isRefresh,\n        [styles['with-toolbar']]: isToolbar,\n      })}\n      onClick={() => !isOpen && onToggle()}\n      style={{\n        insetBlockEnd: bottomOffset,\n        insetInlineStart: leftOffset,\n        insetInlineEnd: rightOffset,\n        blockSize: isOpen ? cappedSize : isToolbar ? '0px' : undefined,\n      }}\n      ref={splitPanelRef}\n    >\n      {isOpen && <div className={styles['slider-wrapper-bottom']}>{resizeHandle}</div>}\n      <div className={styles['drawer-content-bottom']} aria-labelledby={panelHeaderId} role=\"region\">\n        <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={headerRef}>\n          {header}\n        </div>\n        <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n          <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n            {children}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../../src/split-panel/bottom.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,KAAK,MAAM,MAAM,qCAAqC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,YAAY,MAAM,oCAAoC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAM1D,MAAM,UAAU,uBAAuB,CAAC,EACtC,SAAS,EACT,MAAM,EACN,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACqB;IAC7B,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,EACJ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,sBAAsB,EACtB,kBAAkB,EAClB,iBAAiB,GAClB,GAAG,oBAAoB,EAAE,CAAC;IAC3B,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAE7B,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,EAAU,CAAC;IAEjE,iBAAiB,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE;QACnC,MAAM,EAAE,eAAe,EAAE,GAAG,KAAK,CAAC;QAClC,kBAAkB,CAAC,eAAe,CAAC,CAAC;QACpC,kBAAkB,CAAC,eAAe,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,gDAAgD;QAChD,OAAO,GAAG,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;QACnC,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,uBAAuB,GAAG,IAAI,CAAC;QACnC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,SAAS;QAC/C,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,SAAS;QAC9E,CAAC,MAAM,CAAC,mCAAmC,CAAC,CAAC,EAAE,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,WAAW;KACnF,CAAC,CAAC;IAEH,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC,EAAE,cAAc,CAAC,IAAI,EAAE;YAClG,CAAC,YAAY,CAAC,sBAAsB,CAAC,CAAC,EAAE,CAAC,iBAAiB;YAC1D,CAAC,cAAc,CAAC,sBAAsB,CAAC,CAAC,EAAE,MAAM;YAChD,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,MAAM;YAClC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,QAAQ;YACnC,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC,EAAE,sBAAsB;YACnE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,SAAS;YAC3B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,SAAS;SACpC,CAAC,EACF,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,QAAQ,EAAE,EACpC,KAAK,EAAE;YACL,aAAa,EAAE,YAAY;YAC3B,gBAAgB,EAAE,UAAU;YAC5B,cAAc,EAAE,WAAW;YAC3B,SAAS,EAAE,MAAM;gBACf,CAAC,CAAC,UAAU;gBACZ,CAAC,CAAC,SAAS,IAAI,eAAe,KAAK,SAAS;oBAC1C,CAAC,CAAC,QAAQ,eAAe,QAAQ,MAAM,CAAC,mBAAmB,GAAG;oBAC9D,CAAC,CAAC,SAAS;SAChB,EACD,GAAG,EAAE,aAAa;QAEjB,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,IAAG,YAAY,CAAO;QAChF,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,qBAAmB,aAAa,EAAE,IAAI,EAAC,QAAQ;YAC5F,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,4BAA4B,CAAC,EAAE,uBAAuB,CAAC,EAAE,GAAG,EAAE,SAAS,IAChG,MAAM,CACH;YACN,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,EAAE,uBAAuB,CAAC,iBAAe,CAAC,MAAM;gBAC3F,6BAAK,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,iBAAiB,IAChG,QAAQ,CACL,CACF,CACF,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps } from './interfaces';\n\nimport sharedStyles from '../app-layout/resize/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentBottomProps extends SplitPanelContentProps {\n  appLayoutMaxWidth: React.CSSProperties | undefined;\n}\n\nexport function SplitPanelContentBottom({\n  baseProps,\n  isOpen,\n  splitPanelRef,\n  cappedSize,\n  header,\n  resizeHandle,\n  children,\n  appLayoutMaxWidth,\n  panelHeaderId,\n  onToggle,\n}: SplitPanelContentBottomProps) {\n  const isRefresh = useVisualRefresh();\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const {\n    bottomOffset,\n    leftOffset,\n    rightOffset,\n    disableContentPaddings,\n    contentWrapperPaddings,\n    reportHeaderHeight,\n    animationDisabled,\n  } = useSplitPanelContext();\n  const isMobile = useMobile();\n\n  const headerRef = useRef<HTMLDivElement>(null);\n  const [headerBlockSize, setHeaderBlockSize] = useState<number>();\n\n  useResizeObserver(headerRef, entry => {\n    const { borderBoxHeight } = entry;\n    setHeaderBlockSize(borderBoxHeight);\n    reportHeaderHeight(borderBoxHeight);\n  });\n\n  useEffect(() => {\n    // report empty height when unmounting the panel\n    return () => reportHeaderHeight(0);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const centeredMaxWidthClasses = clsx({\n    [styles['pane-bottom-center-align']]: isRefresh,\n    [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n    [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n  });\n\n  return (\n    <div\n      {...baseProps}\n      className={clsx(baseProps.className, styles.drawer, styles['position-bottom'], testUtilStyles.root, {\n        [sharedStyles['with-motion-vertical']]: !animationDisabled,\n        [testUtilStyles['open-position-bottom']]: isOpen,\n        [styles['drawer-closed']]: !isOpen,\n        [styles['drawer-mobile']]: isMobile,\n        [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n        [styles.refresh]: isRefresh,\n        [styles['with-toolbar']]: isToolbar,\n      })}\n      onClick={() => !isOpen && onToggle()}\n      style={{\n        insetBlockEnd: bottomOffset,\n        insetInlineStart: leftOffset,\n        insetInlineEnd: rightOffset,\n        blockSize: isOpen\n          ? cappedSize\n          : isToolbar && headerBlockSize !== undefined\n            ? `calc(${headerBlockSize}px + ${tokens.borderPanelTopWidth})`\n            : undefined,\n      }}\n      ref={splitPanelRef}\n    >\n      {isOpen && <div className={styles['slider-wrapper-bottom']}>{resizeHandle}</div>}\n      <div className={styles['drawer-content-bottom']} aria-labelledby={panelHeaderId} role=\"region\">\n        <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={headerRef}>\n          {header}\n        </div>\n        <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n          <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n            {children}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"]}