npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.251 → 3.0.253 - Mend

@cloudscape-design/components-themeable 3.0.251 → 3.0.253

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 (356) hide show

package/lib/internal/template/table/styles.scoped.css CHANGED Viewed

@@ -94,7 +94,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_wih1l_duqmq_97:not(#\9) {
+.awsui_root_wih1l_15efi_97:not(#\9) {
   font-size: var(--font-body-m-size-sregvd, 14px);
   line-height: var(--font-body-m-line-height-i7xxvv, 22px);
   color: var(--color-text-body-default-7m2b3r, #16191f);
@@ -105,53 +105,53 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   width: 100%;
 }
-.awsui_tools_wih1l_duqmq_108:not(#\9) {
+.awsui_tools_wih1l_15efi_108:not(#\9) {
   display: flex;
   align-items: flex-start;
   flex-wrap: wrap;
   padding: var(--space-scaled-xs-6859qs, 8px) 0 var(--space-scaled-xxs-95dhkm, 4px);
 }
-.awsui_tools-filtering_wih1l_duqmq_114:not(#\9) {
+.awsui_tools-filtering_wih1l_15efi_114:not(#\9) {
   max-width: 100%;
   margin-right: var(--space-l-4vl6xu, 20px);
 }
 @supports (flex-basis: fit-content) {
-  .awsui_tools-filtering_wih1l_duqmq_114:not(#\9) {
+  .awsui_tools-filtering_wih1l_15efi_114:not(#\9) {
     flex: 1 1 fit-content;
   }
 }
 @supports not (flex-basis: fit-content) {
-  .awsui_tools-filtering_wih1l_duqmq_114:not(#\9) {
+  .awsui_tools-filtering_wih1l_15efi_114:not(#\9) {
     flex: 1 1 auto;
   }
 }
-.awsui_tools-align-right_wih1l_duqmq_128:not(#\9) {
+.awsui_tools-align-right_wih1l_15efi_128:not(#\9) {
   display: flex;
   margin-left: auto;
 }
-.awsui_tools-pagination_wih1l_duqmq_132 + .awsui_tools-preferences_wih1l_duqmq_132:not(#\9) {
+.awsui_tools-pagination_wih1l_15efi_132 + .awsui_tools-preferences_wih1l_15efi_132:not(#\9) {
   border-left: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
   box-sizing: border-box;
   margin-left: var(--space-xs-rsr2qu, 8px);
   padding-left: var(--space-xs-rsr2qu, 8px);
 }
-.awsui_tools-small_wih1l_duqmq_138 > .awsui_tools-filtering_wih1l_duqmq_114:not(#\9) {
+.awsui_tools-small_wih1l_15efi_138 > .awsui_tools-filtering_wih1l_15efi_114:not(#\9) {
   margin-right: 0;
   margin-bottom: var(--space-scaled-xs-6859qs, 8px);
   flex-basis: 100%;
 }
-.awsui_table_wih1l_duqmq_144:not(#\9) {
+.awsui_table_wih1l_15efi_144:not(#\9) {
   width: 100%;
   border-spacing: 0;
   position: relative;
   box-sizing: border-box;
 }
-.awsui_table-layout-fixed_wih1l_duqmq_150:not(#\9) {
+.awsui_table-layout-fixed_wih1l_15efi_150:not(#\9) {
   table-layout: fixed;
 }
-.awsui_wrapper_wih1l_duqmq_154:not(#\9) {
+.awsui_wrapper_wih1l_15efi_154:not(#\9) {
   position: relative;
   box-sizing: border-box;
   width: 100%;
@@ -159,42 +159,42 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-bottom: var(--space-table-content-bottom-2l75ve, 0px);
   overflow-x: auto;
 }
-.awsui_wrapper_wih1l_duqmq_154.awsui_variant-stacked_wih1l_duqmq_162 > .awsui_table_wih1l_duqmq_144:not(#\9), .awsui_wrapper_wih1l_duqmq_154.awsui_variant-container_wih1l_duqmq_162 > .awsui_table_wih1l_duqmq_144:not(#\9) {
+.awsui_wrapper_wih1l_15efi_154.awsui_variant-stacked_wih1l_15efi_162 > .awsui_table_wih1l_15efi_144:not(#\9), .awsui_wrapper_wih1l_15efi_154.awsui_variant-container_wih1l_15efi_162 > .awsui_table_wih1l_15efi_144:not(#\9) {
   padding-left: var(--space-table-horizontal-njdbej, 0px);
   padding-right: var(--space-table-horizontal-njdbej, 0px);
 }
-.awsui_wrapper_wih1l_duqmq_154.awsui_variant-embedded_wih1l_duqmq_166:not(#\9) {
+.awsui_wrapper_wih1l_15efi_154.awsui_variant-embedded_wih1l_15efi_166:not(#\9) {
   padding-bottom: var(--space-table-embedded-content-bottom-7vc5vt, 0px);
 }
-.awsui_wrapper_wih1l_duqmq_154.awsui_has-header_wih1l_duqmq_169:not(#\9) {
+.awsui_wrapper_wih1l_15efi_154.awsui_has-header_wih1l_15efi_169:not(#\9) {
   padding-top: 0px;
 }
-.awsui_wrapper_wih1l_duqmq_154.awsui_has-footer_wih1l_duqmq_172:not(#\9) {
+.awsui_wrapper_wih1l_15efi_154.awsui_has-footer_wih1l_15efi_172:not(#\9) {
   padding-bottom: 0px;
 }
-.awsui_wrapper_wih1l_duqmq_154:not(#\9):not(.awsui_has-header_wih1l_duqmq_169) {
+.awsui_wrapper_wih1l_15efi_154:not(#\9):not(.awsui_has-header_wih1l_15efi_169) {
   border-top-right-radius: var(--border-radius-container-1aveko, 0px);
   border-top-left-radius: var(--border-radius-container-1aveko, 0px);
 }
-.awsui_wrapper_wih1l_duqmq_154[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_wrapper_wih1l_15efi_154:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: 2px;
   border-radius: var(--border-radius-container-1aveko, 0px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
 }
-.awsui_cell-merged_wih1l_duqmq_186:not(#\9) {
+.awsui_cell-merged_wih1l_15efi_186:not(#\9) {
   text-align: center;
   padding: 0;
 }
-.awsui_cell-merged_wih1l_duqmq_186.awsui_has-footer_wih1l_duqmq_172:not(#\9) {
+.awsui_cell-merged_wih1l_15efi_186.awsui_has-footer_wih1l_15efi_172:not(#\9) {
   /*
   Add a bottom border to the body cell of an empty table as a separator between the
   table and the footer
   */
   border-bottom: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
 }
-.awsui_cell-merged-content_wih1l_duqmq_197:not(#\9) {
+.awsui_cell-merged-content_wih1l_15efi_197:not(#\9) {
   box-sizing: border-box;
   width: 100%;
   padding: var(--space-scaled-m-pv0fmt, 16px) var(--space-l-4vl6xu, 20px) var(--space-scaled-l-t03y3z, 20px);
@@ -202,18 +202,18 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   /* stylelint-enable plugin/no-unsupported-browser-features */
 }
 @supports (position: sticky) {
-  .awsui_cell-merged-content_wih1l_duqmq_197:not(#\9) {
+  .awsui_cell-merged-content_wih1l_15efi_197:not(#\9) {
     position: sticky;
     left: 0;
     margin: 0 calc(-2 * var(--space-table-horizontal-njdbej, 0px));
   }
 }
-.awsui_empty_wih1l_duqmq_212:not(#\9) {
+.awsui_empty_wih1l_15efi_212:not(#\9) {
   color: var(--color-text-empty-izapdt, #687078);
 }
-.awsui_loading_wih1l_duqmq_216:not(#\9) {
+.awsui_loading_wih1l_15efi_216:not(#\9) {
   /* used in test-utils */
 }
@@ -222,19 +222,19 @@ The min/max/width token values in Visual Refresh should align
 the table header and body cells selection control with the table
 filter search icon.
 */
-.awsui_selection-control_wih1l_duqmq_225:not(#\9) {
+.awsui_selection-control_wih1l_15efi_225:not(#\9) {
   box-sizing: border-box;
   max-width: var(--size-table-selection-horizontal-bjirww, 54px);
   min-width: var(--size-table-selection-horizontal-bjirww, 54px);
   position: relative;
   width: var(--size-table-selection-horizontal-bjirww, 54px);
 }
-.awsui_selection-control_wih1l_duqmq_225.awsui_selection-control-header_wih1l_duqmq_232:not(#\9) {
+.awsui_selection-control_wih1l_15efi_225.awsui_selection-control-header_wih1l_15efi_232:not(#\9) {
   padding: var(--space-scaled-xs-6859qs, 8px) var(--space-scaled-l-t03y3z, 20px);
   border-left: var(--border-item-width-yvnixs, 1px) solid transparent;
 }
-.awsui_sticky-scrollbar_wih1l_duqmq_237:not(#\9) {
+.awsui_sticky-scrollbar_wih1l_15efi_237:not(#\9) {
   height: 15px;
   position: fixed;
   display: none;
@@ -244,10 +244,10 @@ filter search icon.
   bottom: 0;
   width: 100%;
 }
-.awsui_sticky-scrollbar-content_wih1l_duqmq_247:not(#\9) {
+.awsui_sticky-scrollbar-content_wih1l_15efi_247:not(#\9) {
   height: 15px;
 }
-.awsui_sticky-scrollbar-visible_wih1l_duqmq_250:not(#\9) {
+.awsui_sticky-scrollbar-visible_wih1l_15efi_250:not(#\9) {
   display: block;
 }
@@ -255,12 +255,12 @@ filter search icon.
 The dynamic height dark header needs a background that will cover
 the default white background of the container component.
 */
-.awsui_dark-header_wih1l_duqmq_258:not(#\9) {
+.awsui_dark-header_wih1l_15efi_258:not(#\9) {
   background-color: var(--color-background-layout-main-q0tbxx, #f2f3f3);
   color: var(--color-text-body-default-7m2b3r, #16191f);
 }
-.awsui_header-secondary_wih1l_duqmq_263:not(#\9) {
+.awsui_header-secondary_wih1l_15efi_263:not(#\9) {
   overflow: auto;
   -ms-overflow-style: none; /* Internet Explorer 10+ */
   scrollbar-width: none; /* Firefox */
@@ -269,42 +269,42 @@ the default white background of the container component.
   border-radius: 0;
   background: var(--color-background-table-header-mryayf, #fafafa);
 }
-.awsui_header-secondary_wih1l_duqmq_263.awsui_variant-stacked_wih1l_duqmq_162 > .awsui_table_wih1l_duqmq_144:not(#\9), .awsui_header-secondary_wih1l_duqmq_263.awsui_variant-container_wih1l_duqmq_162 > .awsui_table_wih1l_duqmq_144:not(#\9) {
+.awsui_header-secondary_wih1l_15efi_263.awsui_variant-stacked_wih1l_15efi_162 > .awsui_table_wih1l_15efi_144:not(#\9), .awsui_header-secondary_wih1l_15efi_263.awsui_variant-container_wih1l_15efi_162 > .awsui_table_wih1l_15efi_144:not(#\9) {
   padding-left: var(--space-table-horizontal-njdbej, 0px);
   padding-right: var(--space-table-horizontal-njdbej, 0px);
 }
-.awsui_header-secondary_wih1l_duqmq_263:not(#\9)::-webkit-scrollbar {
+.awsui_header-secondary_wih1l_15efi_263:not(#\9)::-webkit-scrollbar {
   display: none; /* Safari and Chrome */
 }
-.awsui_header-secondary_wih1l_duqmq_263.awsui_table-has-header_wih1l_duqmq_279:not(#\9) {
+.awsui_header-secondary_wih1l_15efi_263.awsui_table-has-header_wih1l_15efi_279:not(#\9) {
   border-top: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-container-divider-z203b8, #eaeded);
 }
-.awsui_header-controls_wih1l_duqmq_283:not(#\9) {
+.awsui_header-controls_wih1l_15efi_283:not(#\9) {
   padding-top: var(--space-container-header-vertical-0bd19u, 12px);
   padding-bottom: var(--space-container-header-vertical-0bd19u, 12px);
 }
-.awsui_header-controls_wih1l_duqmq_283.awsui_variant-stacked_wih1l_duqmq_162:not(#\9), .awsui_header-controls_wih1l_duqmq_283.awsui_variant-container_wih1l_duqmq_162:not(#\9) {
+.awsui_header-controls_wih1l_15efi_283.awsui_variant-stacked_wih1l_15efi_162:not(#\9), .awsui_header-controls_wih1l_15efi_283.awsui_variant-container_wih1l_15efi_162:not(#\9) {
   padding-left: calc(var(--space-table-horizontal-njdbej, 0px) + var(--space-table-header-horizontal-4u689g, 20px));
   padding-right: calc(var(--space-table-horizontal-njdbej, 0px) + var(--space-table-header-horizontal-4u689g, 20px));
 }
-.awsui_header-controls_wih1l_duqmq_283.awsui_variant-embedded_wih1l_duqmq_166:not(#\9) {
+.awsui_header-controls_wih1l_15efi_283.awsui_variant-embedded_wih1l_15efi_166:not(#\9) {
   padding-left: var(--space-table-header-horizontal-4u689g, 20px);
   padding-right: var(--space-table-header-horizontal-4u689g, 20px);
   padding-top: var(--space-table-embedded-header-top-1yxc8d, 12px);
 }
-.awsui_footer-wrapper_wih1l_duqmq_297.awsui_variant-stacked_wih1l_duqmq_162:not(#\9), .awsui_footer-wrapper_wih1l_duqmq_297.awsui_variant-container_wih1l_duqmq_162:not(#\9) {
+.awsui_footer-wrapper_wih1l_15efi_297.awsui_variant-stacked_wih1l_15efi_162:not(#\9), .awsui_footer-wrapper_wih1l_15efi_297.awsui_variant-container_wih1l_15efi_162:not(#\9) {
   padding-left: var(--space-table-horizontal-njdbej, 0px);
   padding-right: var(--space-table-horizontal-njdbej, 0px);
 }
-.awsui_footer_wih1l_duqmq_297:not(#\9) {
+.awsui_footer_wih1l_15efi_297:not(#\9) {
   padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-table-footer-horizontal-m6qo87, 20px);
 }
-.awsui_thead-active_wih1l_duqmq_306:not(#\9),
-.awsui_row_wih1l_duqmq_307:not(#\9),
-.awsui_row-selected_wih1l_duqmq_308:not(#\9) {
+.awsui_thead-active_wih1l_15efi_306:not(#\9),
+.awsui_row_wih1l_15efi_307:not(#\9),
+.awsui_row-selected_wih1l_15efi_308:not(#\9) {
   /* used in test-utils */
 }

package/lib/internal/template/table/styles.selectors.js CHANGED Viewed

@@ -2,38 +2,38 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_wih1l_duqmq_97",
-  "tools": "awsui_tools_wih1l_duqmq_108",
-  "tools-filtering": "awsui_tools-filtering_wih1l_duqmq_114",
-  "tools-align-right": "awsui_tools-align-right_wih1l_duqmq_128",
-  "tools-pagination": "awsui_tools-pagination_wih1l_duqmq_132",
-  "tools-preferences": "awsui_tools-preferences_wih1l_duqmq_132",
-  "tools-small": "awsui_tools-small_wih1l_duqmq_138",
-  "table": "awsui_table_wih1l_duqmq_144",
-  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_duqmq_150",
-  "wrapper": "awsui_wrapper_wih1l_duqmq_154",
-  "variant-stacked": "awsui_variant-stacked_wih1l_duqmq_162",
-  "variant-container": "awsui_variant-container_wih1l_duqmq_162",
-  "variant-embedded": "awsui_variant-embedded_wih1l_duqmq_166",
-  "has-header": "awsui_has-header_wih1l_duqmq_169",
-  "has-footer": "awsui_has-footer_wih1l_duqmq_172",
-  "cell-merged": "awsui_cell-merged_wih1l_duqmq_186",
-  "cell-merged-content": "awsui_cell-merged-content_wih1l_duqmq_197",
-  "empty": "awsui_empty_wih1l_duqmq_212",
-  "loading": "awsui_loading_wih1l_duqmq_216",
-  "selection-control": "awsui_selection-control_wih1l_duqmq_225",
-  "selection-control-header": "awsui_selection-control-header_wih1l_duqmq_232",
-  "sticky-scrollbar": "awsui_sticky-scrollbar_wih1l_duqmq_237",
-  "sticky-scrollbar-content": "awsui_sticky-scrollbar-content_wih1l_duqmq_247",
-  "sticky-scrollbar-visible": "awsui_sticky-scrollbar-visible_wih1l_duqmq_250",
-  "dark-header": "awsui_dark-header_wih1l_duqmq_258",
-  "header-secondary": "awsui_header-secondary_wih1l_duqmq_263",
-  "table-has-header": "awsui_table-has-header_wih1l_duqmq_279",
-  "header-controls": "awsui_header-controls_wih1l_duqmq_283",
-  "footer-wrapper": "awsui_footer-wrapper_wih1l_duqmq_297",
-  "footer": "awsui_footer_wih1l_duqmq_297",
-  "thead-active": "awsui_thead-active_wih1l_duqmq_306",
-  "row": "awsui_row_wih1l_duqmq_307",
-  "row-selected": "awsui_row-selected_wih1l_duqmq_308"
+  "root": "awsui_root_wih1l_15efi_97",
+  "tools": "awsui_tools_wih1l_15efi_108",
+  "tools-filtering": "awsui_tools-filtering_wih1l_15efi_114",
+  "tools-align-right": "awsui_tools-align-right_wih1l_15efi_128",
+  "tools-pagination": "awsui_tools-pagination_wih1l_15efi_132",
+  "tools-preferences": "awsui_tools-preferences_wih1l_15efi_132",
+  "tools-small": "awsui_tools-small_wih1l_15efi_138",
+  "table": "awsui_table_wih1l_15efi_144",
+  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_15efi_150",
+  "wrapper": "awsui_wrapper_wih1l_15efi_154",
+  "variant-stacked": "awsui_variant-stacked_wih1l_15efi_162",
+  "variant-container": "awsui_variant-container_wih1l_15efi_162",
+  "variant-embedded": "awsui_variant-embedded_wih1l_15efi_166",
+  "has-header": "awsui_has-header_wih1l_15efi_169",
+  "has-footer": "awsui_has-footer_wih1l_15efi_172",
+  "cell-merged": "awsui_cell-merged_wih1l_15efi_186",
+  "cell-merged-content": "awsui_cell-merged-content_wih1l_15efi_197",
+  "empty": "awsui_empty_wih1l_15efi_212",
+  "loading": "awsui_loading_wih1l_15efi_216",
+  "selection-control": "awsui_selection-control_wih1l_15efi_225",
+  "selection-control-header": "awsui_selection-control-header_wih1l_15efi_232",
+  "sticky-scrollbar": "awsui_sticky-scrollbar_wih1l_15efi_237",
+  "sticky-scrollbar-content": "awsui_sticky-scrollbar-content_wih1l_15efi_247",
+  "sticky-scrollbar-visible": "awsui_sticky-scrollbar-visible_wih1l_15efi_250",
+  "dark-header": "awsui_dark-header_wih1l_15efi_258",
+  "header-secondary": "awsui_header-secondary_wih1l_15efi_263",
+  "table-has-header": "awsui_table-has-header_wih1l_15efi_279",
+  "header-controls": "awsui_header-controls_wih1l_15efi_283",
+  "footer-wrapper": "awsui_footer-wrapper_wih1l_15efi_297",
+  "footer": "awsui_footer_wih1l_15efi_297",
+  "thead-active": "awsui_thead-active_wih1l_15efi_306",
+  "row": "awsui_row_wih1l_15efi_307",
+  "row-selected": "awsui_row-selected_wih1l_15efi_308"
 };

package/lib/internal/template/tabs/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["tabs/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;~~AAUzC~~,OAAO,EAAE,SAAS,EAAE,CAAC;AAGrB,eAAO,MAAM,eAAe,cAA+E,CAAC;AAU5G,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,IAAI,EACJ,OAAmB,EACnB,QAAQ,EACR,WAAW,EAAE,eAAe,EAC5B,SAAS,EACT,cAAc,EACd,sBAA8B,EAC9B,WAAW,EACX,GAAG,IAAI,EACR,EAAE,SAAS,~~eA4FX~~"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["tabs/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AASzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAGrB,eAAO,MAAM,eAAe,cAA+E,CAAC;AAU5G,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,IAAI,EACJ,OAAmB,EACnB,QAAQ,EACR,WAAW,EAAE,eAAe,EAC5B,SAAS,EACT,cAAc,EACd,sBAA8B,EAC9B,WAAW,EACX,GAAG,IAAI,EACR,EAAE,SAAS,eAyFX"}

package/lib/internal/template/tabs/index.js CHANGED Viewed

@@ -12,7 +12,6 @@ import { useControllable } from '../internal/hooks/use-controllable';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 import useBaseComponent from '../internal/hooks/use-base-component';
 import { checkSafeUrl } from '../internal/utils/check-safe-url';
-import useFocusVisible from '../internal/hooks/focus-visible';
 let lastGeneratedId = 0;
 export const nextGeneratedId = () => `awsui-tabs-${lastGeneratedId++}-${Math.round(Math.random() * 10000)}`;
 function firstEnabledTab(tabs) {
@@ -36,7 +35,6 @@ export default function Tabs(_a) {
         changeHandler: 'onChange',
     });
     const baseProps = getBaseProps(rest);
-    const focusVisible = useFocusVisible();
     const content = () => {
         const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];
         const renderContent = (tab) => {
@@ -45,7 +43,14 @@ export default function Tabs(_a) {
                 [styles['tabs-content']]: true,
                 [styles['tabs-content-active']]: isTabSelected,
             });
-            const contentAttributes = Object.assign(Object.assign({}, focusVisible), { className: classes, role: 'tabpanel', id: `${idNamespace}-${tab.id}-panel`, key: `${idNamespace}-${tab.id}-panel`, tabIndex: 0, 'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }) });
+            const contentAttributes = {
+                className: classes,
+                role: 'tabpanel',
+                id: `${idNamespace}-${tab.id}-panel`,
+                key: `${idNamespace}-${tab.id}-panel`,
+                tabIndex: 0,
+                'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),
+            };
             const isContentShown = isTabSelected && !selectedTab.disabled;
             return React.createElement("div", Object.assign({}, contentAttributes), isContentShown && selectedTab.content);
         };

package/lib/internal/template/tabs/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["tabs/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,iBAAiB,MAAM,uBAAuB,CAAC;AAEtD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;~~AAChE~~,~~OAAO,eAAe,MAAM,iCAAiC,CAAC;AAI9D,~~IAAI,eAAe,GAAG,CAAC,CAAC;AACxB,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,cAAc,eAAe,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;AAE5G,SAAS,eAAe,CAAC,IAAkC;IACzD,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACtD,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE;QAC1B,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC;KACvB;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAUjB;;QAViB,EAC3B,IAAI,EACJ,OAAO,GAAG,SAAS,EACnB,QAAQ,EACR,WAAW,EAAE,eAAe,EAC5B,SAAS,EACT,cAAc,EACd,sBAAsB,GAAG,KAAK,EAC9B,WAAW,OAED,EADP,IAAI,cAToB,sHAU5B,CADQ;IAEP,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE;QACtB,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;KAChC;IACD,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACvD,MAAM,CAAC,WAAW,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,eAAe,EAAE,CAAC,CAAC;IAExD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,eAAe,CAAC,eAAe,EAAE,QAAQ,EAAE,MAAA,MAAA,eAAe,CAAC,IAAI,CAAC,0CAAE,EAAE,mCAAI,EAAE,EAAE;QAChH,aAAa,EAAE,MAAM;QACrB,cAAc,EAAE,aAAa;QAC7B,aAAa,EAAE,UAAU;KAC1B,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,MAAM,~~YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,~~OAAO,GAAG,GAAG,EAAE;QACnB,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;QAClE,MAAM,aAAa,GAAG,CAAC,GAAkB,EAAE,EAAE;YAC3C,MAAM,aAAa,GAAG,GAAG,KAAK,WAAW,CAAC;YAE1C,MAAM,OAAO,GAAG,IAAI,CAAC;gBACnB,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,IAAI;gBAC9B,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,aAAa;aAC/C,CAAC,CAAC;YAEH,MAAM,iBAAiB,~~mCAClB~~,~~YAAY,KACf,~~SAAS,EAAE,OAAO,~~EAClB,~~IAAI,EAAE,UAAU,~~EAChB,~~EAAE,EAAE,GAAG,WAAW,IAAI,GAAG,CAAC,EAAE,QAAQ,~~EACpC,~~GAAG,EAAE,GAAG,WAAW,IAAI,GAAG,CAAC,EAAE,QAAQ,~~EACrC,~~QAAQ,EAAE,CAAC,~~EACX,~~iBAAiB,EAAE,eAAe,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,~~GAC9E,~~CAAC;YAEF,MAAM,cAAc,GAAG,aAAa,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC;YAC9D,OAAO,6CAAS,iBAAiB,GAAG,cAAc,IAAI,WAAW,CAAC,OAAO,CAAO,CAAC;QACnF,CAAC,CAAC;QAEF,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CACb,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,gCAAgC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,sBAAsB,CAAC,EACnG;gBACE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,sBAAsB;aACnD,CACF,IAEA,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,CACpB,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CACb,oBAAC,YAAY,IACX,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,YAAY,CAAC,EAAE;YACvB,cAAc,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC;YACzC,sBAAsB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QACjD,CAAC,EACD,WAAW,EAAE,WAAW,GACxB,CACH,CAAC;IAEF,IAAI,OAAO,KAAK,WAAW,EAAE;QAC3B,OAAO,CACL,oBAAC,iBAAiB,kBAChB,MAAM,EAAE,MAAM,EACd,qBAAqB,EAAE,IAAI,IACvB,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EACjD,iBAAiB,EAAE,iBAAiB,EACpC,sBAAsB,EAAE,IAAI,KAE3B,OAAO,EAAE,CACQ,CACrB,CAAC;KACH;IAED,OAAO,CACL,6CAAS,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,iBAAiB;QACvG,MAAM;QACN,OAAO,EAAE,CACN,CACP,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport InternalContainer from '../container/internal';\nimport { TabsProps } from './interfaces';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { getTabElementId, TabHeaderBar } from './tab-header-bar';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\~~nimport useFocusVisible from '../internal/hooks/focus-visible';\~~n\nexport { TabsProps };\n\nlet lastGeneratedId = 0;\nexport const nextGeneratedId = () => `awsui-tabs-${lastGeneratedId++}-${Math.round(Math.random() * 10000)}`;\n\nfunction firstEnabledTab(tabs: ReadonlyArray<TabsProps.Tab>) {\n const enabledTabs = tabs.filter(tab => !tab.disabled);\n if (enabledTabs.length > 0) {\n return enabledTabs[0];\n }\n return null;\n}\n\nexport default function Tabs({\n tabs,\n variant = 'default',\n onChange,\n activeTabId: controlledTabId,\n ariaLabel,\n ariaLabelledby,\n disableContentPaddings = false,\n i18nStrings,\n ...rest\n}: TabsProps) {\n for (const tab of tabs) {\n checkSafeUrl('Tabs', tab.href);\n }\n const { __internalRootRef } = useBaseComponent('Tabs');\n const [idNamespace] = useState(() => nextGeneratedId());\n\n const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, firstEnabledTab(tabs)?.id ?? '', {\n componentName: 'Tabs',\n controlledProp: 'activeTabId',\n changeHandler: 'onChange',\n });\n\n const baseProps = getBaseProps(rest);\n\n const ~~focusVisible = useFocusVisible();\n\n const~~ content = () => {\n const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];\n const renderContent = (tab: TabsProps.Tab) => {\n const isTabSelected = tab === selectedTab;\n\n const classes = clsx({\n [styles['tabs-content']]: true,\n [styles['tabs-content-active']]: isTabSelected,\n });\n\n const contentAttributes: JSX.IntrinsicElements['div'] = {\n ~~...focusVisible,\n~~ className: classes,\n role: 'tabpanel',\n id: `${idNamespace}-${tab.id}-panel`,\n key: `${idNamespace}-${tab.id}-panel`,\n tabIndex: 0,\n 'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n };\n\n const isContentShown = isTabSelected && !selectedTab.disabled;\n return <div {...contentAttributes}>{isContentShown && selectedTab.content}</div>;\n };\n\n return (\n <div\n className={clsx(\n variant === 'container' ? styles['tabs-container-content-wrapper'] : styles['tabs-content-wrapper'],\n {\n [styles['with-paddings']]: !disableContentPaddings,\n }\n )}\n >\n {tabs.map(renderContent)}\n </div>\n );\n };\n\n const header = (\n <TabHeaderBar\n activeTabId={activeTabId}\n variant={variant}\n idNamespace={idNamespace}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n tabs={tabs}\n onChange={changeDetail => {\n setActiveTabId(changeDetail.activeTabId);\n fireNonCancelableEvent(onChange, changeDetail);\n }}\n i18nStrings={i18nStrings}\n />\n );\n\n if (variant === 'container') {\n return (\n <InternalContainer\n header={header}\n disableHeaderPaddings={true}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n __internalRootRef={__internalRootRef}\n disableContentPaddings={true}\n >\n {content()}\n </InternalContainer>\n );\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root, styles.tabs)} ref={__internalRootRef}>\n {header}\n {content()}\n </div>\n );\n}\n\napplyDisplayName(Tabs, 'Tabs');\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["tabs/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport InternalContainer from '../container/internal';\nimport { TabsProps } from './interfaces';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { getTabElementId, TabHeaderBar } from './tab-header-bar';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\n\nexport { TabsProps };\n\nlet lastGeneratedId = 0;\nexport const nextGeneratedId = () => `awsui-tabs-${lastGeneratedId++}-${Math.round(Math.random() * 10000)}`;\n\nfunction firstEnabledTab(tabs: ReadonlyArray<TabsProps.Tab>) {\n const enabledTabs = tabs.filter(tab => !tab.disabled);\n if (enabledTabs.length > 0) {\n return enabledTabs[0];\n }\n return null;\n}\n\nexport default function Tabs({\n tabs,\n variant = 'default',\n onChange,\n activeTabId: controlledTabId,\n ariaLabel,\n ariaLabelledby,\n disableContentPaddings = false,\n i18nStrings,\n ...rest\n}: TabsProps) {\n for (const tab of tabs) {\n checkSafeUrl('Tabs', tab.href);\n }\n const { __internalRootRef } = useBaseComponent('Tabs');\n const [idNamespace] = useState(() => nextGeneratedId());\n\n const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, firstEnabledTab(tabs)?.id ?? '', {\n componentName: 'Tabs',\n controlledProp: 'activeTabId',\n changeHandler: 'onChange',\n });\n\n const baseProps = getBaseProps(rest);\n\n const content = () => {\n const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];\n const renderContent = (tab: TabsProps.Tab) => {\n const isTabSelected = tab === selectedTab;\n\n const classes = clsx({\n [styles['tabs-content']]: true,\n [styles['tabs-content-active']]: isTabSelected,\n });\n\n const contentAttributes: JSX.IntrinsicElements['div'] = {\n className: classes,\n role: 'tabpanel',\n id: `${idNamespace}-${tab.id}-panel`,\n key: `${idNamespace}-${tab.id}-panel`,\n tabIndex: 0,\n 'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n };\n\n const isContentShown = isTabSelected && !selectedTab.disabled;\n return <div {...contentAttributes}>{isContentShown && selectedTab.content}</div>;\n };\n\n return (\n <div\n className={clsx(\n variant === 'container' ? styles['tabs-container-content-wrapper'] : styles['tabs-content-wrapper'],\n {\n [styles['with-paddings']]: !disableContentPaddings,\n }\n )}\n >\n {tabs.map(renderContent)}\n </div>\n );\n };\n\n const header = (\n <TabHeaderBar\n activeTabId={activeTabId}\n variant={variant}\n idNamespace={idNamespace}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n tabs={tabs}\n onChange={changeDetail => {\n setActiveTabId(changeDetail.activeTabId);\n fireNonCancelableEvent(onChange, changeDetail);\n }}\n i18nStrings={i18nStrings}\n />\n );\n\n if (variant === 'container') {\n return (\n <InternalContainer\n header={header}\n disableHeaderPaddings={true}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n __internalRootRef={__internalRootRef}\n disableContentPaddings={true}\n >\n {content()}\n </InternalContainer>\n );\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root, styles.tabs)} ref={__internalRootRef}>\n {header}\n {content()}\n </div>\n );\n}\n\napplyDisplayName(Tabs, 'Tabs');\n"]}

package/lib/internal/template/tabs/styles.css.js CHANGED Viewed

@@ -1,26 +1,26 @@
     import './styles.scoped.css';
     export default {
-  "tabs-header": "awsui_tabs-header_14rmt_1c9xc_186",
-  "tabs-header-list": "awsui_tabs-header-list_14rmt_1c9xc_192",
-  "pagination-button": "awsui_pagination-button_14rmt_1c9xc_207",
-  "pagination-button-left": "awsui_pagination-button-left_14rmt_1c9xc_212",
-  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_1c9xc_215",
-  "pagination-button-right": "awsui_pagination-button-right_14rmt_1c9xc_219",
-  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_1c9xc_222",
-  "tabs-tab": "awsui_tabs-tab_14rmt_1c9xc_227",
-  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_1c9xc_238",
-  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_1c9xc_254",
-  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_1c9xc_313",
-  "refresh": "awsui_refresh_14rmt_1c9xc_331",
-  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_1c9xc_345",
-  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_1c9xc_352",
-  "root": "awsui_root_14rmt_1c9xc_356",
-  "tabs": "awsui_tabs_14rmt_1c9xc_186",
-  "tabs-content": "awsui_tabs-content_14rmt_1c9xc_375",
-  "tabs-content-active": "awsui_tabs-content-active_14rmt_1c9xc_379",
-  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_1c9xc_389",
-  "with-paddings": "awsui_with-paddings_14rmt_1c9xc_389",
-  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_1c9xc_393"
+  "tabs-header": "awsui_tabs-header_14rmt_p5f4r_186",
+  "tabs-header-list": "awsui_tabs-header-list_14rmt_p5f4r_192",
+  "pagination-button": "awsui_pagination-button_14rmt_p5f4r_207",
+  "pagination-button-left": "awsui_pagination-button-left_14rmt_p5f4r_212",
+  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_p5f4r_215",
+  "pagination-button-right": "awsui_pagination-button-right_14rmt_p5f4r_219",
+  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_p5f4r_222",
+  "tabs-tab": "awsui_tabs-tab_14rmt_p5f4r_227",
+  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_p5f4r_238",
+  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_p5f4r_254",
+  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_p5f4r_313",
+  "refresh": "awsui_refresh_14rmt_p5f4r_331",
+  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_p5f4r_345",
+  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_p5f4r_352",
+  "root": "awsui_root_14rmt_p5f4r_356",
+  "tabs": "awsui_tabs_14rmt_p5f4r_186",
+  "tabs-content": "awsui_tabs-content_14rmt_p5f4r_375",
+  "tabs-content-active": "awsui_tabs-content-active_14rmt_p5f4r_379",
+  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_p5f4r_389",
+  "with-paddings": "awsui_with-paddings_14rmt_p5f4r_389",
+  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_p5f4r_393"
 };