npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.516 → 3.0.518 - Mend

@cloudscape-design/components-themeable 3.0.516 → 3.0.518

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (227) hide show

package/lib/internal/template/split-panel/styles.scoped.css CHANGED Viewed

@@ -186,31 +186,31 @@ 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_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189:not(#\9) {
+.awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189:not(#\9) {
   transition-duration: var(--motion-duration-refresh-only-fast-y7h37k, 115ms);
   transition-property: none;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189:not(#\9) {
+  .awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189:not(#\9), .awsui-mode-entering .awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189:not(#\9) {
+.awsui-motion-disabled .awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189:not(#\9), .awsui-mode-entering .awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189.awsui_animating_1r9lg_aq665_203:not(#\9) {
+.awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189.awsui_animating_1r9lg_tvb2m_203:not(#\9) {
   transition-property: transform;
   transition-timing-function: var(--motion-easing-refresh-only-a-liv5su, cubic-bezier(0, 0, 0, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189.awsui_animating_1r9lg_aq665_203:not(#\9) {
+  .awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189.awsui_animating_1r9lg_tvb2m_203:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189.awsui_animating_1r9lg_aq665_203:not(#\9), .awsui-mode-entering .awsui_drawer_1r9lg_aq665_189.awsui_refresh_1r9lg_aq665_189.awsui_animating_1r9lg_aq665_203:not(#\9) {
+.awsui-motion-disabled .awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189.awsui_animating_1r9lg_tvb2m_203:not(#\9), .awsui-mode-entering .awsui_drawer_1r9lg_tvb2m_189.awsui_refresh_1r9lg_tvb2m_189.awsui_animating_1r9lg_tvb2m_203:not(#\9) {
   animation: none;
   transition: none;
 }
@@ -223,72 +223,72 @@ 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_preference-icon--layout-border_1r9lg_aq665_226:not(#\9) {
+.awsui_preference-icon--layout-border_1r9lg_tvb2m_226:not(#\9) {
   stroke: var(--color-background-home-header-zm6w39, #000000);
   fill: var(--color-background-container-content-il2pe5, #ffffff);
 }
-.awsui_preference-icon--layout-background_1r9lg_aq665_230:not(#\9) {
+.awsui_preference-icon--layout-background_1r9lg_tvb2m_230:not(#\9) {
   fill: var(--color-background-layout-main-td853a, #f2f3f3);
 }
-.awsui_preference-icon--layout-header_1r9lg_aq665_233:not(#\9) {
+.awsui_preference-icon--layout-header_1r9lg_tvb2m_233:not(#\9) {
   fill: var(--color-background-home-header-zm6w39, #000000);
 }
-.awsui_preference-icon--border_1r9lg_aq665_236:not(#\9) {
+.awsui_preference-icon--border_1r9lg_tvb2m_236:not(#\9) {
   stroke: var(--color-text-group-label-kysf47, #545b64);
   fill: var(--color-background-container-content-il2pe5, #ffffff);
 }
-.awsui_preference-icon--primary-button_1r9lg_aq665_240:not(#\9) {
+.awsui_preference-icon--primary-button_1r9lg_tvb2m_240:not(#\9) {
   fill: var(--color-background-button-primary-default-f3veih, #0073bb);
 }
-.awsui_preference-icon--secondary_1r9lg_aq665_243:not(#\9) {
+.awsui_preference-icon--secondary_1r9lg_tvb2m_243:not(#\9) {
   fill: var(--color-text-group-label-kysf47, #545b64);
 }
-.awsui_preference-icon--disabled-element_1r9lg_aq665_246:not(#\9) {
+.awsui_preference-icon--disabled-element_1r9lg_tvb2m_246:not(#\9) {
   fill: var(--color-background-control-disabled-dsn0t2, #d5dbdb);
 }
-.awsui_preference-icon--separator_1r9lg_aq665_249:not(#\9) {
+.awsui_preference-icon--separator_1r9lg_tvb2m_249:not(#\9) {
   stroke: var(--color-background-control-disabled-dsn0t2, #d5dbdb);
 }
-.awsui_preference-icon--focus-text_1r9lg_aq665_252:not(#\9) {
+.awsui_preference-icon--focus-text_1r9lg_tvb2m_252:not(#\9) {
   fill: var(--color-text-interactive-default-dt26aj, #545b64);
 }
-.awsui_preference-icon-refresh--layout-top_1r9lg_aq665_256:not(#\9) {
+.awsui_preference-icon-refresh--layout-top_1r9lg_tvb2m_256:not(#\9) {
   fill: var(--color-background-button-primary-disabled-lba03m, #ffffff);
 }
-.awsui_preference-icon-refresh--layout-main_1r9lg_aq665_259:not(#\9) {
+.awsui_preference-icon-refresh--layout-main_1r9lg_tvb2m_259:not(#\9) {
   fill: var(--color-background-layout-main-td853a, #f2f3f3);
 }
-.awsui_preference-icon-refresh--primary_1r9lg_aq665_262:not(#\9) {
+.awsui_preference-icon-refresh--primary_1r9lg_tvb2m_262:not(#\9) {
   fill: var(--color-background-button-primary-default-f3veih, #0073bb);
 }
-.awsui_preference-icon-refresh--disabled_1r9lg_aq665_265:not(#\9) {
+.awsui_preference-icon-refresh--disabled_1r9lg_tvb2m_265:not(#\9) {
   fill: var(--color-background-control-disabled-dsn0t2, #d5dbdb);
 }
-.awsui_preference-icon-refresh--column-header_1r9lg_aq665_268:not(#\9) {
+.awsui_preference-icon-refresh--column-header_1r9lg_tvb2m_268:not(#\9) {
   fill: var(--color-text-input-disabled-c1yp62, #879596);
 }
-.awsui_preference-icon-refresh--window_1r9lg_aq665_271:not(#\9) {
+.awsui_preference-icon-refresh--window_1r9lg_tvb2m_271:not(#\9) {
   stroke: var(--color-background-home-header-zm6w39, #000000);
   fill: var(--color-background-container-content-il2pe5, #ffffff);
 }
-.awsui_preference-icon-refresh--secondary_1r9lg_aq665_275:not(#\9) {
+.awsui_preference-icon-refresh--secondary_1r9lg_tvb2m_275:not(#\9) {
   fill: var(--color-text-body-secondary-6ysfsn, #545b64);
 }
-.awsui_preference-icon-refresh--default_1r9lg_aq665_278:not(#\9) {
+.awsui_preference-icon-refresh--default_1r9lg_tvb2m_278:not(#\9) {
   fill: var(--color-text-body-default-ffdwgg, #16191f);
 }
-.awsui_preference-icon-refresh--separator_1r9lg_aq665_281:not(#\9) {
+.awsui_preference-icon-refresh--separator_1r9lg_tvb2m_281:not(#\9) {
   stroke: var(--color-border-divider-default-in8dkg, #eaeded);
 }
-.awsui_preference-icon-refresh--input-default_1r9lg_aq665_284:not(#\9) {
+.awsui_preference-icon-refresh--input-default_1r9lg_tvb2m_284:not(#\9) {
   fill: var(--color-border-input-default-aksbt5, #687078);
 }
-.awsui_preference-icon-refresh--heading_1r9lg_aq665_287:not(#\9) {
+.awsui_preference-icon-refresh--heading_1r9lg_tvb2m_287:not(#\9) {
   fill: var(--color-text-heading-default-tsgvby, #16191f);
 }
-.awsui_root_1r9lg_aq665_291:not(#\9) {
+.awsui_root_1r9lg_tvb2m_291:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -308,7 +308,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   letter-spacing: normal;
   list-style: disc outside none;
   tab-size: 8;
-  text-align: left;
+  text-align: start;
   text-indent: 0;
   text-shadow: none;
   text-transform: none;
@@ -324,15 +324,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -moz-osx-font-smoothing: auto;
 }
-.awsui_preferences-button_1r9lg_aq665_326:not(#\9) {
+.awsui_preferences-button_1r9lg_tvb2m_326:not(#\9) {
   /* used in test-utils */
 }
-.awsui_close-button_1r9lg_aq665_330:not(#\9) {
+.awsui_close-button_1r9lg_tvb2m_330:not(#\9) {
   /* used in test-utils */
 }
-.awsui_drawer_1r9lg_aq665_189:not(#\9) {
+.awsui_drawer_1r9lg_tvb2m_189:not(#\9) {
   flex-shrink: 0;
   position: relative;
   min-width: 0;
@@ -340,28 +340,28 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background-color: var(--color-background-layout-panel-content-ml98gw, #ffffff);
   z-index: 840;
 }
-.awsui_drawer-closed_1r9lg_aq665_342:not(#\9) {
+.awsui_drawer-closed_1r9lg_tvb2m_342:not(#\9) {
   cursor: pointer;
   min-width: 40px;
 }
-.awsui_drawer-content-side_1r9lg_aq665_347:not(#\9) {
+.awsui_drawer-content-side_1r9lg_tvb2m_347:not(#\9) {
   display: flex;
   align-items: center;
   height: 100%;
   overflow: auto;
 }
-.awsui_drawer-closed_1r9lg_aq665_342 > .awsui_drawer-content-side_1r9lg_aq665_347:not(#\9) {
+.awsui_drawer-closed_1r9lg_tvb2m_342 > .awsui_drawer-content-side_1r9lg_tvb2m_347:not(#\9) {
   width: 40px;
 }
-.awsui_drawer-closed_1r9lg_aq665_342 > .awsui_drawer-content-side_1r9lg_aq665_347:not(#\9):hover {
+.awsui_drawer-closed_1r9lg_tvb2m_342 > .awsui_drawer-content-side_1r9lg_tvb2m_347:not(#\9):hover {
   background: var(--color-background-layout-panel-hover-58t7r5, #eaeded);
 }
-.awsui_drawer-content-side_1r9lg_aq665_347 > [aria-hidden=true]:not(#\9) {
+.awsui_drawer-content-side_1r9lg_tvb2m_347 > [aria-hidden=true]:not(#\9) {
   display: none;
 }
-:not(#\9):not(.awsui_drawer-closed_1r9lg_aq665_342) > .awsui_drawer-content-bottom_1r9lg_aq665_363 {
+:not(#\9):not(.awsui_drawer-closed_1r9lg_tvb2m_342) > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 {
   overflow-y: auto;
   position: absolute;
   top: 0;
@@ -370,7 +370,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   bottom: 0;
 }
-.awsui_position-bottom_1r9lg_aq665_372:not(#\9) {
+.awsui_position-bottom_1r9lg_tvb2m_372:not(#\9) {
   position: fixed;
   overflow-y: auto;
   border-top: var(--border-panel-top-width-vktuvo, 0px) solid var(--color-border-divider-panel-bottom-sc2k0v, rgba(0, 28, 36, 0.15));
@@ -379,48 +379,48 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   SplitPanel is no longer in fixed position in the DOM.
   */
 }
-.awsui_position-bottom_1r9lg_aq665_372:not(#\9):not(.awsui_refresh_1r9lg_aq665_189) {
+.awsui_position-bottom_1r9lg_tvb2m_372:not(#\9):not(.awsui_refresh_1r9lg_tvb2m_189) {
   box-shadow: var(--shadow-split-bottom-nfmseg, 0 -2px 1px -1px rgba(0, 28, 36, 0.15), 0 -1px 1px -1px rgba(0, 28, 36, 0.3));
   border-left: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-divider-panel-bottom-sc2k0v, rgba(0, 28, 36, 0.15));
   border-right: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-divider-panel-bottom-sc2k0v, rgba(0, 28, 36, 0.15));
 }
-.awsui_position-bottom_1r9lg_aq665_372.awsui_drawer-closed_1r9lg_aq665_342:not(#\9) {
+.awsui_position-bottom_1r9lg_tvb2m_372.awsui_drawer-closed_1r9lg_tvb2m_342:not(#\9) {
   overflow: hidden;
 }
-.awsui_position-bottom_1r9lg_aq665_372.awsui_drawer-closed_1r9lg_aq665_342:not(#\9):hover {
+.awsui_position-bottom_1r9lg_tvb2m_372.awsui_drawer-closed_1r9lg_tvb2m_342:not(#\9):hover {
   background: var(--color-background-layout-panel-hover-58t7r5, #eaeded);
 }
-.awsui_position-bottom_1r9lg_aq665_372 > .awsui_drawer-content-bottom_1r9lg_aq665_363 > [aria-hidden=true]:not(#\9) {
+.awsui_position-bottom_1r9lg_tvb2m_372 > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 > [aria-hidden=true]:not(#\9) {
   display: none;
 }
-.awsui_position-bottom_1r9lg_aq665_372.awsui_refresh_1r9lg_aq665_189:not(#\9) {
+.awsui_position-bottom_1r9lg_tvb2m_372.awsui_refresh_1r9lg_tvb2m_189:not(#\9) {
   position: relative;
 }
-.awsui_position-side_1r9lg_aq665_399:not(#\9) {
+.awsui_position-side_1r9lg_tvb2m_399:not(#\9) {
   border-top: none;
   box-shadow: var(--shadow-split-side-q8jr2v, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
   height: 100%;
 }
-.awsui_slider_1r9lg_aq665_405:not(#\9) {
+.awsui_slider_1r9lg_tvb2m_405:not(#\9) {
   padding: 0;
   cursor: ns-resize;
   margin: 2px 0 0 0;
   height: 16px;
   touch-action: none;
 }
-.awsui_slider_1r9lg_aq665_405:not(#\9):focus {
+.awsui_slider_1r9lg_tvb2m_405:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_tvb2m_405:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_tvb2m_405:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(0px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_tvb2m_405:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -432,12 +432,12 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
 }
-.awsui_slider-side_1r9lg_aq665_434:not(#\9) {
+.awsui_slider-side_1r9lg_tvb2m_434:not(#\9) {
   cursor: ew-resize;
   margin: 0 0 0 2px;
 }
-.awsui_slider-wrapper-bottom_1r9lg_aq665_439:not(#\9) {
+.awsui_slider-wrapper-bottom_1r9lg_tvb2m_439:not(#\9) {
   position: absolute;
   top: 0;
   left: 0;
@@ -448,7 +448,7 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   z-index: 2;
 }
-.awsui_slider-wrapper-side_1r9lg_aq665_450:not(#\9) {
+.awsui_slider-wrapper-side_1r9lg_tvb2m_450:not(#\9) {
   position: absolute;
   left: 0;
   top: 0;
@@ -459,31 +459,31 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   z-index: 1;
 }
-.awsui_open-button_1r9lg_aq665_461:not(#\9) {
+.awsui_open-button_1r9lg_tvb2m_461:not(#\9) {
   /* used in test-utils */
 }
-.awsui_open-button-side_1r9lg_aq665_465:not(#\9) {
+.awsui_open-button-side_1r9lg_tvb2m_465:not(#\9) {
   flex: 0 0 auto;
   align-self: flex-start;
   box-sizing: border-box;
   margin: var(--space-xxs-9rrxti, 4px) auto 0;
 }
-.awsui_slider-icon_1r9lg_aq665_472:not(#\9) {
+.awsui_slider-icon_1r9lg_tvb2m_472:not(#\9) {
   stroke: var(--color-text-interactive-default-dt26aj, #545b64);
 }
-.awsui_slider-icon_1r9lg_aq665_472:not(#\9):hover {
+.awsui_slider-icon_1r9lg_tvb2m_472:not(#\9):hover {
   stroke: var(--color-text-interactive-hover-7who0l, #16191f);
 }
-.awsui_slider-icon-bottom_1r9lg_aq665_478:not(#\9) {
+.awsui_slider-icon-bottom_1r9lg_tvb2m_478:not(#\9) {
   margin: auto;
 }
-.awsui_slider-icon-side_1r9lg_aq665_481:not(#\9) {
+.awsui_slider-icon-side_1r9lg_tvb2m_481:not(#\9) {
   transform: rotate(90deg);
 }
-.awsui_pane-header-wrapper-bottom_1r9lg_aq665_485:not(#\9) {
+.awsui_pane-header-wrapper-bottom_1r9lg_tvb2m_485:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   position: sticky;
   top: 0;
@@ -493,49 +493,49 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   z-index: 1;
   padding: 0 var(--space-layout-content-horizontal-sin989, 40px);
 }
-.awsui_drawer-mobile_1r9lg_aq665_495 > .awsui_drawer-content-bottom_1r9lg_aq665_363 > .awsui_pane-header-wrapper-bottom_1r9lg_aq665_485:not(#\9) {
+.awsui_drawer-mobile_1r9lg_tvb2m_495 > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 > .awsui_pane-header-wrapper-bottom_1r9lg_tvb2m_485:not(#\9) {
   padding: 0 var(--space-l-xu1x80, 20px);
 }
-.awsui_drawer-disable-content-paddings_1r9lg_aq665_498 > .awsui_drawer-content-bottom_1r9lg_aq665_363 > .awsui_pane-header-wrapper-bottom_1r9lg_aq665_485:not(#\9) {
+.awsui_drawer-disable-content-paddings_1r9lg_tvb2m_498 > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 > .awsui_pane-header-wrapper-bottom_1r9lg_tvb2m_485:not(#\9) {
   padding: 0 var(--space-l-xu1x80, 20px);
 }
-:not(#\9):not(.awsui_drawer-closed_1r9lg_aq665_342) > .awsui_drawer-content-bottom_1r9lg_aq665_363 > .awsui_pane-header-wrapper-bottom_1r9lg_aq665_485 {
+:not(#\9):not(.awsui_drawer-closed_1r9lg_tvb2m_342) > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 > .awsui_pane-header-wrapper-bottom_1r9lg_tvb2m_485 {
   background-color: var(--color-background-layout-panel-content-ml98gw, #ffffff);
   border-bottom: var(--border-panel-header-width-xo2sbi, 0px) solid var(--color-border-divider-default-in8dkg, #eaeded);
 }
-.awsui_content-bottom_1r9lg_aq665_506:not(#\9) {
+.awsui_content-bottom_1r9lg_tvb2m_506:not(#\9) {
   padding: 0 var(--space-layout-content-horizontal-sin989, 40px);
   margin-top: var(--space-panel-split-top-517tlt, 0px);
   position: relative;
   z-index: 0;
 }
-.awsui_drawer-mobile_1r9lg_aq665_495 > .awsui_drawer-content-bottom_1r9lg_aq665_363 > .awsui_content-bottom_1r9lg_aq665_506:not(#\9) {
+.awsui_drawer-mobile_1r9lg_tvb2m_495 > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 > .awsui_content-bottom_1r9lg_tvb2m_506:not(#\9) {
   padding: 0 var(--space-l-xu1x80, 20px);
 }
-.awsui_drawer-disable-content-paddings_1r9lg_aq665_498 > .awsui_drawer-content-bottom_1r9lg_aq665_363 > .awsui_content-bottom_1r9lg_aq665_506:not(#\9) {
+.awsui_drawer-disable-content-paddings_1r9lg_tvb2m_498 > .awsui_drawer-content-bottom_1r9lg_tvb2m_363 > .awsui_content-bottom_1r9lg_tvb2m_506:not(#\9) {
   padding: 0;
 }
-.awsui_pane-bottom-center-align_1r9lg_aq665_519:not(#\9) {
+.awsui_pane-bottom-center-align_1r9lg_tvb2m_519:not(#\9) {
   display: flex;
   justify-content: center;
 }
-.awsui_pane-bottom-content-nav-padding_1r9lg_aq665_524:not(#\9) {
+.awsui_pane-bottom-content-nav-padding_1r9lg_tvb2m_524:not(#\9) {
   padding-left: calc(var(--space-layout-toggle-diameter-ugv12v, 36px) + 2 * var(--space-layout-toggle-padding-k1jpy8, 12px));
 }
-.awsui_pane-bottom-content-tools-padding_1r9lg_aq665_528:not(#\9) {
+.awsui_pane-bottom-content-tools-padding_1r9lg_tvb2m_528:not(#\9) {
   padding-right: calc(var(--space-layout-toggle-diameter-ugv12v, 36px) + 2 * var(--space-layout-toggle-padding-k1jpy8, 12px));
 }
-.awsui_content-bottom-max-width_1r9lg_aq665_532:not(#\9) {
+.awsui_content-bottom-max-width_1r9lg_tvb2m_532:not(#\9) {
   flex-grow: 1;
   max-width: 100%;
 }
-.awsui_content-side_1r9lg_aq665_537:not(#\9) {
+.awsui_content-side_1r9lg_tvb2m_537:not(#\9) {
   flex: auto;
   align-self: flex-start;
   box-sizing: border-box;
@@ -546,16 +546,16 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   right: 0;
   height: 100%;
 }
-.awsui_content-side_1r9lg_aq665_537 > .awsui_pane-header-wrapper-side_1r9lg_aq665_548:not(#\9) {
+.awsui_content-side_1r9lg_tvb2m_537 > .awsui_pane-header-wrapper-side_1r9lg_tvb2m_548:not(#\9) {
   padding: 0 var(--space-m-kpg8id, 16px) 0 var(--space-panel-side-left-wmxosk, 32px);
   border-bottom: var(--border-panel-header-width-xo2sbi, 0px) solid var(--color-border-divider-default-in8dkg, #eaeded);
 }
-.awsui_content-side_1r9lg_aq665_537 > .awsui_pane-content-wrapper-side_1r9lg_aq665_552:not(#\9) {
+.awsui_content-side_1r9lg_tvb2m_537 > .awsui_pane-content-wrapper-side_1r9lg_tvb2m_552:not(#\9) {
   padding: 0 var(--space-panel-side-right-23w8pv, 32px) 0 var(--space-panel-side-left-wmxosk, 32px);
   margin-top: var(--space-panel-split-top-517tlt, 0px);
 }
-.awsui_header_1r9lg_aq665_557:not(#\9) {
+.awsui_header_1r9lg_tvb2m_557:not(#\9) {
   display: flex;
   flex: auto;
   flex-direction: row;
@@ -564,7 +564,7 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   width: 100%;
   margin: var(--size-vertical-panel-icon-offset-04nxf8, 15px) 0;
 }
-.awsui_header-text_1r9lg_aq665_566:not(#\9) {
+.awsui_header-text_1r9lg_tvb2m_566:not(#\9) {
   font-size: var(--font-panel-header-size-tbwmfr, 18px);
   line-height: var(--font-panel-header-line-height-leujyg, 22px);
   font-weight: var(--font-weight-heading-l-1hf845, 700);
@@ -575,7 +575,7 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   margin-top: calc(var(--space-scaled-xxs-t7ij38, 4px) + 1px);
 }
-.awsui_header-actions_1r9lg_aq665_577:not(#\9) {
+.awsui_header-actions_1r9lg_tvb2m_577:not(#\9) {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
@@ -583,7 +583,7 @@ body[data-awsui-focus-visible=true] .awsui_slider_1r9lg_aq665_405:not(#\9):focus
   margin-left: var(--space-xs-xf5ch3, 8px);
 }
-.awsui_divider_1r9lg_aq665_585:not(#\9) {
+.awsui_divider_1r9lg_tvb2m_585:not(#\9) {
   border-right: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-divider-default-in8dkg, #eaeded);
   margin: var(--space-scaled-xxs-t7ij38, 4px) var(--space-scaled-xs-x91h81, 8px);
 }

package/lib/internal/template/split-panel/styles.selectors.js CHANGED Viewed

@@ -2,60 +2,60 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "drawer": "awsui_drawer_1r9lg_aq665_189",
-  "refresh": "awsui_refresh_1r9lg_aq665_189",
-  "animating": "awsui_animating_1r9lg_aq665_203",
-  "preference-icon--layout-border": "awsui_preference-icon--layout-border_1r9lg_aq665_226",
-  "preference-icon--layout-background": "awsui_preference-icon--layout-background_1r9lg_aq665_230",
-  "preference-icon--layout-header": "awsui_preference-icon--layout-header_1r9lg_aq665_233",
-  "preference-icon--border": "awsui_preference-icon--border_1r9lg_aq665_236",
-  "preference-icon--primary-button": "awsui_preference-icon--primary-button_1r9lg_aq665_240",
-  "preference-icon--secondary": "awsui_preference-icon--secondary_1r9lg_aq665_243",
-  "preference-icon--disabled-element": "awsui_preference-icon--disabled-element_1r9lg_aq665_246",
-  "preference-icon--separator": "awsui_preference-icon--separator_1r9lg_aq665_249",
-  "preference-icon--focus-text": "awsui_preference-icon--focus-text_1r9lg_aq665_252",
-  "preference-icon-refresh--layout-top": "awsui_preference-icon-refresh--layout-top_1r9lg_aq665_256",
-  "preference-icon-refresh--layout-main": "awsui_preference-icon-refresh--layout-main_1r9lg_aq665_259",
-  "preference-icon-refresh--primary": "awsui_preference-icon-refresh--primary_1r9lg_aq665_262",
-  "preference-icon-refresh--disabled": "awsui_preference-icon-refresh--disabled_1r9lg_aq665_265",
-  "preference-icon-refresh--column-header": "awsui_preference-icon-refresh--column-header_1r9lg_aq665_268",
-  "preference-icon-refresh--window": "awsui_preference-icon-refresh--window_1r9lg_aq665_271",
-  "preference-icon-refresh--secondary": "awsui_preference-icon-refresh--secondary_1r9lg_aq665_275",
-  "preference-icon-refresh--default": "awsui_preference-icon-refresh--default_1r9lg_aq665_278",
-  "preference-icon-refresh--separator": "awsui_preference-icon-refresh--separator_1r9lg_aq665_281",
-  "preference-icon-refresh--input-default": "awsui_preference-icon-refresh--input-default_1r9lg_aq665_284",
-  "preference-icon-refresh--heading": "awsui_preference-icon-refresh--heading_1r9lg_aq665_287",
-  "root": "awsui_root_1r9lg_aq665_291",
-  "preferences-button": "awsui_preferences-button_1r9lg_aq665_326",
-  "close-button": "awsui_close-button_1r9lg_aq665_330",
-  "drawer-closed": "awsui_drawer-closed_1r9lg_aq665_342",
-  "drawer-content-side": "awsui_drawer-content-side_1r9lg_aq665_347",
-  "drawer-content-bottom": "awsui_drawer-content-bottom_1r9lg_aq665_363",
-  "position-bottom": "awsui_position-bottom_1r9lg_aq665_372",
-  "position-side": "awsui_position-side_1r9lg_aq665_399",
-  "slider": "awsui_slider_1r9lg_aq665_405",
-  "slider-side": "awsui_slider-side_1r9lg_aq665_434",
-  "slider-wrapper-bottom": "awsui_slider-wrapper-bottom_1r9lg_aq665_439",
-  "slider-wrapper-side": "awsui_slider-wrapper-side_1r9lg_aq665_450",
-  "open-button": "awsui_open-button_1r9lg_aq665_461",
-  "open-button-side": "awsui_open-button-side_1r9lg_aq665_465",
-  "slider-icon": "awsui_slider-icon_1r9lg_aq665_472",
-  "slider-icon-bottom": "awsui_slider-icon-bottom_1r9lg_aq665_478",
-  "slider-icon-side": "awsui_slider-icon-side_1r9lg_aq665_481",
-  "pane-header-wrapper-bottom": "awsui_pane-header-wrapper-bottom_1r9lg_aq665_485",
-  "drawer-mobile": "awsui_drawer-mobile_1r9lg_aq665_495",
-  "drawer-disable-content-paddings": "awsui_drawer-disable-content-paddings_1r9lg_aq665_498",
-  "content-bottom": "awsui_content-bottom_1r9lg_aq665_506",
-  "pane-bottom-center-align": "awsui_pane-bottom-center-align_1r9lg_aq665_519",
-  "pane-bottom-content-nav-padding": "awsui_pane-bottom-content-nav-padding_1r9lg_aq665_524",
-  "pane-bottom-content-tools-padding": "awsui_pane-bottom-content-tools-padding_1r9lg_aq665_528",
-  "content-bottom-max-width": "awsui_content-bottom-max-width_1r9lg_aq665_532",
-  "content-side": "awsui_content-side_1r9lg_aq665_537",
-  "pane-header-wrapper-side": "awsui_pane-header-wrapper-side_1r9lg_aq665_548",
-  "pane-content-wrapper-side": "awsui_pane-content-wrapper-side_1r9lg_aq665_552",
-  "header": "awsui_header_1r9lg_aq665_557",
-  "header-text": "awsui_header-text_1r9lg_aq665_566",
-  "header-actions": "awsui_header-actions_1r9lg_aq665_577",
-  "divider": "awsui_divider_1r9lg_aq665_585"
+  "drawer": "awsui_drawer_1r9lg_tvb2m_189",
+  "refresh": "awsui_refresh_1r9lg_tvb2m_189",
+  "animating": "awsui_animating_1r9lg_tvb2m_203",
+  "preference-icon--layout-border": "awsui_preference-icon--layout-border_1r9lg_tvb2m_226",
+  "preference-icon--layout-background": "awsui_preference-icon--layout-background_1r9lg_tvb2m_230",
+  "preference-icon--layout-header": "awsui_preference-icon--layout-header_1r9lg_tvb2m_233",
+  "preference-icon--border": "awsui_preference-icon--border_1r9lg_tvb2m_236",
+  "preference-icon--primary-button": "awsui_preference-icon--primary-button_1r9lg_tvb2m_240",
+  "preference-icon--secondary": "awsui_preference-icon--secondary_1r9lg_tvb2m_243",
+  "preference-icon--disabled-element": "awsui_preference-icon--disabled-element_1r9lg_tvb2m_246",
+  "preference-icon--separator": "awsui_preference-icon--separator_1r9lg_tvb2m_249",
+  "preference-icon--focus-text": "awsui_preference-icon--focus-text_1r9lg_tvb2m_252",
+  "preference-icon-refresh--layout-top": "awsui_preference-icon-refresh--layout-top_1r9lg_tvb2m_256",
+  "preference-icon-refresh--layout-main": "awsui_preference-icon-refresh--layout-main_1r9lg_tvb2m_259",
+  "preference-icon-refresh--primary": "awsui_preference-icon-refresh--primary_1r9lg_tvb2m_262",
+  "preference-icon-refresh--disabled": "awsui_preference-icon-refresh--disabled_1r9lg_tvb2m_265",
+  "preference-icon-refresh--column-header": "awsui_preference-icon-refresh--column-header_1r9lg_tvb2m_268",
+  "preference-icon-refresh--window": "awsui_preference-icon-refresh--window_1r9lg_tvb2m_271",
+  "preference-icon-refresh--secondary": "awsui_preference-icon-refresh--secondary_1r9lg_tvb2m_275",
+  "preference-icon-refresh--default": "awsui_preference-icon-refresh--default_1r9lg_tvb2m_278",
+  "preference-icon-refresh--separator": "awsui_preference-icon-refresh--separator_1r9lg_tvb2m_281",
+  "preference-icon-refresh--input-default": "awsui_preference-icon-refresh--input-default_1r9lg_tvb2m_284",
+  "preference-icon-refresh--heading": "awsui_preference-icon-refresh--heading_1r9lg_tvb2m_287",
+  "root": "awsui_root_1r9lg_tvb2m_291",
+  "preferences-button": "awsui_preferences-button_1r9lg_tvb2m_326",
+  "close-button": "awsui_close-button_1r9lg_tvb2m_330",
+  "drawer-closed": "awsui_drawer-closed_1r9lg_tvb2m_342",
+  "drawer-content-side": "awsui_drawer-content-side_1r9lg_tvb2m_347",
+  "drawer-content-bottom": "awsui_drawer-content-bottom_1r9lg_tvb2m_363",
+  "position-bottom": "awsui_position-bottom_1r9lg_tvb2m_372",
+  "position-side": "awsui_position-side_1r9lg_tvb2m_399",
+  "slider": "awsui_slider_1r9lg_tvb2m_405",
+  "slider-side": "awsui_slider-side_1r9lg_tvb2m_434",
+  "slider-wrapper-bottom": "awsui_slider-wrapper-bottom_1r9lg_tvb2m_439",
+  "slider-wrapper-side": "awsui_slider-wrapper-side_1r9lg_tvb2m_450",
+  "open-button": "awsui_open-button_1r9lg_tvb2m_461",
+  "open-button-side": "awsui_open-button-side_1r9lg_tvb2m_465",
+  "slider-icon": "awsui_slider-icon_1r9lg_tvb2m_472",
+  "slider-icon-bottom": "awsui_slider-icon-bottom_1r9lg_tvb2m_478",
+  "slider-icon-side": "awsui_slider-icon-side_1r9lg_tvb2m_481",
+  "pane-header-wrapper-bottom": "awsui_pane-header-wrapper-bottom_1r9lg_tvb2m_485",
+  "drawer-mobile": "awsui_drawer-mobile_1r9lg_tvb2m_495",
+  "drawer-disable-content-paddings": "awsui_drawer-disable-content-paddings_1r9lg_tvb2m_498",
+  "content-bottom": "awsui_content-bottom_1r9lg_tvb2m_506",
+  "pane-bottom-center-align": "awsui_pane-bottom-center-align_1r9lg_tvb2m_519",
+  "pane-bottom-content-nav-padding": "awsui_pane-bottom-content-nav-padding_1r9lg_tvb2m_524",
+  "pane-bottom-content-tools-padding": "awsui_pane-bottom-content-tools-padding_1r9lg_tvb2m_528",
+  "content-bottom-max-width": "awsui_content-bottom-max-width_1r9lg_tvb2m_532",
+  "content-side": "awsui_content-side_1r9lg_tvb2m_537",
+  "pane-header-wrapper-side": "awsui_pane-header-wrapper-side_1r9lg_tvb2m_548",
+  "pane-content-wrapper-side": "awsui_pane-content-wrapper-side_1r9lg_tvb2m_552",
+  "header": "awsui_header_1r9lg_tvb2m_557",
+  "header-text": "awsui_header-text_1r9lg_tvb2m_566",
+  "header-actions": "awsui_header-actions_1r9lg_tvb2m_577",
+  "divider": "awsui_divider_1r9lg_tvb2m_585"
 };

package/lib/internal/template/table/body-cell/disabled-inline-editor.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { TableBodyCellProps } from './index';
+interface DisabledInlineEditorProps<ItemType> extends TableBodyCellProps<ItemType> {
+    editDisabledReason: string;
+}
+export declare function DisabledInlineEditor<ItemType>({ className, item, column, ariaLabels, isEditing, onEditStart, onEditEnd, editDisabledReason, isVisualRefresh, ...rest }: DisabledInlineEditorProps<ItemType>): JSX.Element;
+export {};
+//# sourceMappingURL=disabled-inline-editor.d.ts.map

package/lib/internal/template/table/body-cell/disabled-inline-editor.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"disabled-inline-editor.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/disabled-inline-editor.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAG7C,UAAU,yBAAyB,CAAC,QAAQ,CAAE,SAAQ,kBAAkB,CAAC,QAAQ,CAAC;IAChF,kBAAkB,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,EAC7C,SAAS,EACT,IAAI,EACJ,MAAM,EACN,UAAU,EACV,SAAS,EACT,WAAW,EACX,SAAS,EACT,kBAAkB,EAClB,eAAe,EACf,GAAG,IAAI,EACR,EAAE,yBAAyB,CAAC,QAAQ,CAAC,eA6FrC"}

package/lib/internal/template/table/body-cell/disabled-inline-editor.js ADDED Viewed

@@ -0,0 +1,54 @@
+import { __rest } from "tslib";
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { useRef, useState } from 'react';
+import clsx from 'clsx';
+import useHiddenDescription from '../../button-dropdown/utils/use-hidden-description';
+import Icon from '../../icon/internal';
+import PopoverContainer from '../../popover/container';
+import PopoverBody from '../../popover/body';
+import Portal from '../../internal/components/portal';
+import { usePortalModeClasses } from '../../internal/hooks/use-portal-mode-classes';
+import Arrow from '../../popover/arrow';
+import { useClickAway } from './click-away';
+import { TableTdElement } from './td-element';
+import styles from './styles.css.js';
+export function DisabledInlineEditor(_a) {
+    var _b;
+    var { className, item, column, ariaLabels, isEditing, onEditStart, onEditEnd, editDisabledReason, isVisualRefresh } = _a, rest = __rest(_a, ["className", "item", "column", "ariaLabels", "isEditing", "onEditStart", "onEditEnd", "editDisabledReason", "isVisualRefresh"]);
+    const clickAwayRef = useClickAway(() => {
+        if (isEditing) {
+            onEditEnd(true);
+        }
+    });
+    const [hasHover, setHasHover] = useState(false);
+    const [hasFocus, setHasFocus] = useState(false);
+    const showIcon = hasHover || hasFocus || isEditing;
+    const iconRef = useRef(null);
+    const buttonRef = useRef(null);
+    const portalRef = useRef(null);
+    function handleEscape(event) {
+        if (event.key === 'Escape') {
+            onEditEnd(true);
+        }
+    }
+    const onClick = () => {
+        var _a;
+        onEditStart();
+        (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    };
+    const { targetProps, descriptionEl } = useHiddenDescription(editDisabledReason);
+    const portalClasses = usePortalModeClasses(portalRef);
+    return (React.createElement(TableTdElement, Object.assign({}, rest, { nativeAttributes: { 'data-inline-editing-active': isEditing.toString() }, className: clsx(className, styles['body-cell-editable'], styles['body-cell-disabled-edit'], isEditing && styles['body-cell-edit-disabled-popover'], isVisualRefresh && styles['is-visual-refresh']), onClick: !isEditing ? onClick : undefined, onMouseEnter: () => setHasHover(true), onMouseLeave: () => setHasHover(false), ref: clickAwayRef }),
+        column.cell(item),
+        React.createElement("button", Object.assign({ ref: buttonRef, tabIndex: 0, className: styles['body-cell-editor'], "aria-label": (_b = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.activateEditLabel) === null || _b === void 0 ? void 0 : _b.call(ariaLabels, column, item), "aria-haspopup": "dialog", "aria-disabled": "true", onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false), onKeyDown: handleEscape }, targetProps),
+            showIcon && React.createElement(Icon, { name: "lock-private", variant: "normal", __internalRootRef: iconRef }),
+            descriptionEl),
+        isEditing && (React.createElement("span", { ref: portalRef },
+            React.createElement(Portal, null,
+                React.createElement("span", { className: portalClasses },
+                    React.createElement(PopoverContainer, { size: "medium", fixedWidth: false, position: "top", trackRef: iconRef, arrow: position => React.createElement(Arrow, { position: position }), renderWithPortal: true, zIndex: 2000 },
+                        React.createElement(PopoverBody, { dismissButton: false, dismissAriaLabel: undefined, header: null, onDismiss: () => { }, overflowVisible: "both" },
+                            React.createElement("span", { "aria-live": "polite" }, editDisabledReason)))))))));
+}
+//# sourceMappingURL=disabled-inline-editor.js.map

package/lib/internal/template/table/body-cell/disabled-inline-editor.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"disabled-inline-editor.js","sourceRoot":"lib/default/","sources":["table/body-cell/disabled-inline-editor.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport useHiddenDescription from '../../button-dropdown/utils/use-hidden-description';\nimport Icon from '../../icon/internal';\nimport PopoverContainer from '../../popover/container';\nimport PopoverBody from '../../popover/body';\nimport Portal from '../../internal/components/portal';\nimport { usePortalModeClasses } from '../../internal/hooks/use-portal-mode-classes';\nimport Arrow from '../../popover/arrow';\nimport { useClickAway } from './click-away';\nimport { TableTdElement, TableTdElementProps } from './td-element';\nimport { TableBodyCellProps } from './index';\nimport styles from './styles.css.js';\n\ninterface DisabledInlineEditorProps<ItemType> extends TableBodyCellProps<ItemType> {\n editDisabledReason: string;\n}\n\nexport function DisabledInlineEditor<ItemType>({\n className,\n item,\n column,\n ariaLabels,\n isEditing,\n onEditStart,\n onEditEnd,\n editDisabledReason,\n isVisualRefresh,\n ...rest\n}: DisabledInlineEditorProps<ItemType>) {\n const clickAwayRef = useClickAway(() => {\n if (isEditing) {\n onEditEnd(true);\n }\n });\n\n const [hasHover, setHasHover] = useState(false);\n const [hasFocus, setHasFocus] = useState(false);\n const showIcon = hasHover || hasFocus || isEditing;\n\n const iconRef = useRef(null);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const portalRef = useRef<HTMLSpanElement>(null);\n\n function handleEscape(event: React.KeyboardEvent): void {\n if (event.key === 'Escape') {\n onEditEnd(true);\n }\n }\n\n const onClick = () => {\n onEditStart();\n buttonRef.current?.focus();\n };\n\n const { targetProps, descriptionEl } = useHiddenDescription(editDisabledReason);\n const portalClasses = usePortalModeClasses(portalRef);\n\n return (\n <TableTdElement\n {...rest}\n nativeAttributes={\n { 'data-inline-editing-active': isEditing.toString() } as TableTdElementProps['nativeAttributes']\n }\n className={clsx(\n className,\n styles['body-cell-editable'],\n styles['body-cell-disabled-edit'],\n isEditing && styles['body-cell-edit-disabled-popover'],\n isVisualRefresh && styles['is-visual-refresh']\n )}\n onClick={!isEditing ? onClick : undefined}\n onMouseEnter={() => setHasHover(true)}\n onMouseLeave={() => setHasHover(false)}\n ref={clickAwayRef}\n >\n {column.cell(item)}\n\n <button\n ref={buttonRef}\n tabIndex={0}\n className={styles['body-cell-editor']}\n aria-label={ariaLabels?.activateEditLabel?.(column, item)}\n aria-haspopup=\"dialog\"\n aria-disabled=\"true\"\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n onKeyDown={handleEscape}\n {...targetProps}\n >\n {showIcon && <Icon name=\"lock-private\" variant=\"normal\" __internalRootRef={iconRef} />}\n {descriptionEl}\n </button>\n {isEditing && (\n <span ref={portalRef}>\n <Portal>\n <span className={portalClasses}>\n <PopoverContainer\n size=\"medium\"\n fixedWidth={false}\n position=\"top\"\n trackRef={iconRef}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={true}\n zIndex={2000}\n >\n <PopoverBody\n dismissButton={false}\n dismissAriaLabel={undefined}\n header={null}\n onDismiss={() => {}}\n overflowVisible=\"both\"\n >\n <span aria-live=\"polite\">{editDisabledReason}</span>\n </PopoverBody>\n </PopoverContainer>\n </span>\n </Portal>\n </span>\n )}\n </TableTdElement>\n );\n}\n"]}