@cloudscape-design/components 3.0.245 → 3.0.246

package/tabs/styles.scoped.css

@@ -183,13 +183,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  SPDX-License-Identifier: Apache-2.0
 */
 /* stylelint-disable selector-max-type */
-.awsui_tabs-header_14rmt_14l19_186:not(#\9) {
+.awsui_tabs-header_14rmt_174dr_186:not(#\9) {
   margin: 0;
   padding: 0;
   display: flex;
 }
 
-.awsui_tabs-header-list_14rmt_14l19_192:not(#\9) {
+.awsui_tabs-header-list_14rmt_174dr_192:not(#\9) {
   margin: 0;
   padding: 0;
   display: flex;
@@ -200,42 +200,42 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -ms-overflow-style: none; /* Internet Explorer 10+ */
   scrollbar-width: none; /* Firefox */
 }
-.awsui_tabs-header-list_14rmt_14l19_192:not(#\9)::-webkit-scrollbar {
+.awsui_tabs-header-list_14rmt_174dr_192:not(#\9)::-webkit-scrollbar {
   display: none; /* Safari and Chrome */
 }
 
-.awsui_pagination-button_14rmt_14l19_207:not(#\9) {
+.awsui_pagination-button_14rmt_174dr_207:not(#\9) {
   margin: var(--space-scaled-s-cu1hzn, 12px) 0;
   padding: 0 var(--space-xxs-ynfts5, 4px);
   display: flex;
 }
-.awsui_pagination-button-left_14rmt_14l19_212:not(#\9) {
+.awsui_pagination-button-left_14rmt_174dr_212:not(#\9) {
   border-right: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-control-disabled-vx8bco, #d1d5db);
 }
-.awsui_pagination-button-left-scrollable_14rmt_14l19_215:not(#\9) {
+.awsui_pagination-button-left-scrollable_14rmt_174dr_215:not(#\9) {
   z-index: 1;
   box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-4lmh2z, rgba(0, 7, 22, 0.12)), 1px 0px 0px 0px var(--color-border-tabs-shadow-4lmh2z, rgba(0, 7, 22, 0.12));
 }
-.awsui_pagination-button-right_14rmt_14l19_219:not(#\9) {
+.awsui_pagination-button-right_14rmt_174dr_219:not(#\9) {
   border-left: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-control-disabled-vx8bco, #d1d5db);
 }
-.awsui_pagination-button-right-scrollable_14rmt_14l19_222:not(#\9) {
+.awsui_pagination-button-right-scrollable_14rmt_174dr_222:not(#\9) {
   z-index: 1;
   box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-4lmh2z, rgba(0, 7, 22, 0.12)), -1px 0px 0px 0 var(--color-border-tabs-shadow-4lmh2z, rgba(0, 7, 22, 0.12));
 }
 
-.awsui_tabs-tab_14rmt_14l19_227:not(#\9) {
+.awsui_tabs-tab_14rmt_174dr_227:not(#\9) {
   list-style: none;
   padding: 0;
   flex-shrink: 0;
   display: flex;
   max-width: calc(90% - var(--space-l-4vl6xu, 20px));
 }
-.awsui_tabs-tab_14rmt_14l19_227 > button:not(#\9) {
+.awsui_tabs-tab_14rmt_174dr_227 > button:not(#\9) {
   background-color: transparent;
 }
 
-.awsui_tabs-tab-label_14rmt_14l19_238:not(#\9) {
+.awsui_tabs-tab-label_14rmt_174dr_238:not(#\9) {
   display: flex;
   align-items: center;
   padding: var(--space-scaled-2x-xxs-40awim, 4px) var(--space-l-4vl6xu, 20px);
@@ -246,12 +246,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   word-break: break-word;
 }
 
-.awsui_tabs-tab_14rmt_14l19_227:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_14l19_238, .awsui_tabs-tab_14rmt_14l19_227:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_14l19_238 {
+.awsui_tabs-tab_14rmt_174dr_227:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_174dr_238, .awsui_tabs-tab_14rmt_174dr_227:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_174dr_238 {
   margin-right: calc(-1 * var(--border-divider-section-width-4wm2it, 2px));
   border-right: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-tabs-divider-69fx5i, #e9ebed);
 }
 
-.awsui_tabs-tab-link_14rmt_14l19_254:not(#\9) {
+.awsui_tabs-tab-link_14rmt_174dr_254:not(#\9) {
   position: relative;
   display: flex;
   align-items: stretch;
@@ -267,21 +267,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-nkh1jb, grayscale);
   color: var(--color-text-interactive-default-eg5fsa, #414d5c);
 }
-.awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):hover {
+.awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):hover {
   color: var(--color-text-accent-s1eqko, #0972d3);
 }
-.awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):focus {
+.awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):focus {
   outline: none;
 }
-.awsui_tabs-tab-link_14rmt_14l19_254[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):focus {
   z-index: 1;
   position: relative;
 }
-.awsui_tabs-tab-link_14rmt_14l19_254[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-tabs-focus-outline-gutter-64zu5e, -8px) - 1px);
 }
-.awsui_tabs-tab-link_14rmt_14l19_254[data-awsui-focus-visible=true]:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -292,32 +292,32 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
 }
-.awsui_tabs-tab-link_14rmt_14l19_254[data-awsui-focus-visible=true]:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_14l19_238, .awsui_tabs-tab-link_14rmt_14l19_254[data-awsui-focus-visible=true]:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_14l19_238 {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_174dr_238, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_174dr_238 {
   border-right-color: transparent;
 }
 
-.awsui_tabs-tab_14rmt_14l19_227:not(#\9):first-child {
+.awsui_tabs-tab_14rmt_174dr_227:not(#\9):first-child {
   margin-left: 1px;
 }
-.awsui_tabs-tab_14rmt_14l19_227:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_14l19_238, .awsui_tabs-tab_14rmt_14l19_227:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_14l19_238 {
+.awsui_tabs-tab_14rmt_174dr_227:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_174dr_238, .awsui_tabs-tab_14rmt_174dr_227:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_174dr_238 {
   padding-left: calc(var(--space-l-4vl6xu, 20px) - 1px);
 }
 
-.awsui_tabs-tab_14rmt_14l19_227:not(#\9):last-child {
+.awsui_tabs-tab_14rmt_174dr_227:not(#\9):last-child {
   margin-right: 1px;
 }
-.awsui_tabs-tab_14rmt_14l19_227:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_14l19_238, .awsui_tabs-tab_14rmt_14l19_227:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_14l19_238 {
+.awsui_tabs-tab_14rmt_174dr_227:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_174dr_238, .awsui_tabs-tab_14rmt_174dr_227:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_174dr_238 {
   padding-right: calc(var(--space-l-4vl6xu, 20px) - 1px);
 }
 
-.awsui_tabs-tab-disabled_14rmt_14l19_313:not(#\9), .awsui_tabs-tab-disabled_14rmt_14l19_313:not(#\9):hover {
+.awsui_tabs-tab-disabled_14rmt_174dr_313:not(#\9), .awsui_tabs-tab-disabled_14rmt_174dr_313:not(#\9):hover {
   pointer-events: none;
   cursor: default;
   color: var(--color-text-interactive-disabled-3pbb07, #9ba7b6);
   font-weight: var(--font-tabs-disabled-weight-imwq16, 800);
 }
 
-.awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313):after {
+.awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313):after {
   content: "";
   position: absolute;
   left: 0;
@@ -328,36 +328,36 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background: var(--color-border-tabs-underline-9bcfzu, #0972d3);
   opacity: 0;
 }
-.awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313).awsui_refresh_14rmt_14l19_331:after {
+.awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313).awsui_refresh_14rmt_174dr_331:after {
   transition: opacity var(--motion-duration-refresh-only-medium-5flen2, 165ms) var(--motion-easing-refresh-only-c-ic6jr0, cubic-bezier(0.84, 0, 0.16, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313).awsui_refresh_14rmt_14l19_331:after {
+  .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313).awsui_refresh_14rmt_174dr_331:after {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313).awsui_refresh_14rmt_14l19_331:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_14l19_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313).awsui_refresh_14rmt_14l19_331:after {
+.awsui-motion-disabled .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313).awsui_refresh_14rmt_174dr_331:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_174dr_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313).awsui_refresh_14rmt_174dr_331:after {
   animation: none;
   transition: none;
 }
 
-.awsui_tabs-tab-active_14rmt_14l19_345:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313) {
+.awsui_tabs-tab-active_14rmt_174dr_345:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313) {
   color: var(--color-text-accent-s1eqko, #0972d3);
 }
-.awsui_tabs-tab-active_14rmt_14l19_345:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14l19_313):after {
+.awsui_tabs-tab-active_14rmt_174dr_345:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_174dr_313):after {
   opacity: 1;
 }
 
-.awsui_tabs-header-with-divider_14rmt_14l19_352:not(#\9) {
+.awsui_tabs-header-with-divider_14rmt_174dr_352:not(#\9) {
   border-bottom: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-tabs-divider-69fx5i, #e9ebed);
 }
 
-.awsui_root_14rmt_14l19_356:not(#\9) {
+.awsui_root_14rmt_174dr_356:not(#\9) {
   /* used in test-utils or tests */
 }
 
-.awsui_tabs_14rmt_14l19_186:not(#\9) {
+.awsui_tabs_14rmt_174dr_186:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -398,24 +398,24 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   width: 100%;
 }
 
-.awsui_tabs-content_14rmt_14l19_375:not(#\9) {
+.awsui_tabs-content_14rmt_174dr_375:not(#\9) {
   display: none;
 }
 
-.awsui_tabs-content-active_14rmt_14l19_379:not(#\9) {
+.awsui_tabs-content-active_14rmt_174dr_379:not(#\9) {
   display: block;
 }
-.awsui_tabs-content-active_14rmt_14l19_379[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_174dr_379:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: 2px;
   border-radius: var(--border-radius-container-gh9ysk, 16px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
 }
 
-.awsui_tabs-content-wrapper_14rmt_14l19_389.awsui_with-paddings_14rmt_14l19_389 > .awsui_tabs-content_14rmt_14l19_375:not(#\9) {
+.awsui_tabs-content-wrapper_14rmt_174dr_389.awsui_with-paddings_14rmt_174dr_389 > .awsui_tabs-content_14rmt_174dr_375:not(#\9) {
   padding: var(--space-scaled-m-pv0fmt, 16px) 0;
 }
 
-.awsui_tabs-container-content-wrapper_14rmt_14l19_393.awsui_with-paddings_14rmt_14l19_389 > .awsui_tabs-content_14rmt_14l19_375:not(#\9) {
+.awsui_tabs-container-content-wrapper_14rmt_174dr_393.awsui_with-paddings_14rmt_174dr_389 > .awsui_tabs-content_14rmt_174dr_375:not(#\9) {
   padding: var(--space-tabs-content-top-mn4c9x, 12px) var(--space-container-horizontal-tlw03i, 20px) var(--space-scaled-l-t03y3z, 20px);
 }

package/tabs/styles.selectors.js

@@ -2,26 +2,26 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "tabs-header": "awsui_tabs-header_14rmt_14l19_186",
-  "tabs-header-list": "awsui_tabs-header-list_14rmt_14l19_192",
-  "pagination-button": "awsui_pagination-button_14rmt_14l19_207",
-  "pagination-button-left": "awsui_pagination-button-left_14rmt_14l19_212",
-  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_14l19_215",
-  "pagination-button-right": "awsui_pagination-button-right_14rmt_14l19_219",
-  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_14l19_222",
-  "tabs-tab": "awsui_tabs-tab_14rmt_14l19_227",
-  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_14l19_238",
-  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_14l19_254",
-  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_14l19_313",
-  "refresh": "awsui_refresh_14rmt_14l19_331",
-  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_14l19_345",
-  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_14l19_352",
-  "root": "awsui_root_14rmt_14l19_356",
-  "tabs": "awsui_tabs_14rmt_14l19_186",
-  "tabs-content": "awsui_tabs-content_14rmt_14l19_375",
-  "tabs-content-active": "awsui_tabs-content-active_14rmt_14l19_379",
-  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_14l19_389",
-  "with-paddings": "awsui_with-paddings_14rmt_14l19_389",
-  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_14l19_393"
+  "tabs-header": "awsui_tabs-header_14rmt_174dr_186",
+  "tabs-header-list": "awsui_tabs-header-list_14rmt_174dr_192",
+  "pagination-button": "awsui_pagination-button_14rmt_174dr_207",
+  "pagination-button-left": "awsui_pagination-button-left_14rmt_174dr_212",
+  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_174dr_215",
+  "pagination-button-right": "awsui_pagination-button-right_14rmt_174dr_219",
+  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_174dr_222",
+  "tabs-tab": "awsui_tabs-tab_14rmt_174dr_227",
+  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_174dr_238",
+  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_174dr_254",
+  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_174dr_313",
+  "refresh": "awsui_refresh_14rmt_174dr_331",
+  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_174dr_345",
+  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_174dr_352",
+  "root": "awsui_root_14rmt_174dr_356",
+  "tabs": "awsui_tabs_14rmt_174dr_186",
+  "tabs-content": "awsui_tabs-content_14rmt_174dr_375",
+  "tabs-content-active": "awsui_tabs-content-active_14rmt_174dr_379",
+  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_174dr_389",
+  "with-paddings": "awsui_with-paddings_14rmt_174dr_389",
+  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_174dr_393"
 };
   

package/tabs/tab-header-bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tab-header-bar.d.ts","sourceRoot":"lib/default/","sources":["tabs/tab-header-bar.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAiBzC,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,YAAY,KAAK,IAAI,CAAC;IACzD,WAAW,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACtC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACxB,OAAO,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CACrC;AAED,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,OAAO,EACP,WAAW,EACX,SAAS,EACT,cAAc,EACd,WAAW,GACZ,EAAE,iBAAiB,eAgRnB;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,UAEzF"}
+{"version":3,"file":"tab-header-bar.d.ts","sourceRoot":"lib/default/","sources":["tabs/tab-header-bar.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAgBzC,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,YAAY,KAAK,IAAI,CAAC;IACzD,WAAW,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACtC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACxB,OAAO,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CACrC;AAED,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,OAAO,EACP,WAAW,EACX,SAAS,EACT,cAAc,EACd,WAAW,GACZ,EAAE,iBAAiB,eA6QnB;AAED,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,UAEzF"}

package/tabs/tab-header-bar.js

@@ -4,14 +4,12 @@ import React, { useRef, useState, useEffect } from 'react';
 import clsx from 'clsx';
 import styles from './styles.css.js';
 import { InternalButton } from '../button/internal';
-import useFocusVisible from '../internal/hooks/focus-visible';
 import { useContainerQuery } from '../internal/hooks/container-queries';
 import { KeyCode } from '../internal/keycode';
 import { onPaginationClick, hasHorizontalOverflow, hasLeftOverflow, hasRightOverflow, scrollIntoView, } from './scroll-utils';
 import { hasModifierKeys, isPlainLeftClick } from '../internal/events';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
 export function TabHeaderBar({ onChange, activeTabId, tabs, variant, idNamespace, ariaLabel, ariaLabelledby, i18nStrings, }) {
-    const focusVisible = useFocusVisible();
     const headerBarRef = useRef(null);
     const activeTabHeaderRef = useRef(null);
     const leftOverflowButton = useRef(null);
@@ -176,7 +174,15 @@ export function TabHeaderBar({ onChange, activeTabId, tabs, variant, idNamespace
             [styles['tabs-tab-active']]: activeTabId === tab.id && !tab.disabled,
             [styles['tabs-tab-disabled']]: tab.disabled,
         });
-        const commonProps = Object.assign(Object.assign({ className: classes }, focusVisible), { role: 'tab', 'aria-selected': tab.id === activeTabId, 'aria-controls': `${idNamespace}-${tab.id}-panel`, 'data-testid': tab.id, id: getTabElementId({ namespace: idNamespace, tabId: tab.id }), children: React.createElement("span", { className: styles['tabs-tab-label'] }, tab.label) });
+        const commonProps = {
+            className: classes,
+            role: 'tab',
+            'aria-selected': tab.id === activeTabId,
+            'aria-controls': `${idNamespace}-${tab.id}-panel`,
+            'data-testid': tab.id,
+            id: getTabElementId({ namespace: idNamespace, tabId: tab.id }),
+            children: React.createElement("span", { className: styles['tabs-tab-label'] }, tab.label),
+        };
         if (tab.disabled) {
             commonProps['aria-disabled'] = 'true';
         }

package/tabs/tab-header-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-header-bar.js","sourceRoot":"lib/default/","sources":["tabs/tab-header-bar.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, useEffect } from 'react';\nimport { TabsProps } from './interfaces';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { InternalButton } from '../button/internal';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport { useContainerQuery } from '../internal/hooks/container-queries';\nimport { KeyCode } from '../internal/keycode';\nimport {\n  onPaginationClick,\n  hasHorizontalOverflow,\n  hasLeftOverflow,\n  hasRightOverflow,\n  scrollIntoView,\n} from './scroll-utils';\nimport { hasModifierKeys, isPlainLeftClick } from '../internal/events';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nexport interface TabHeaderBarProps {\n  onChange: (changeDetail: TabsProps.ChangeDetail) => void;\n  activeTabId: TabsProps['activeTabId'];\n  tabs: TabsProps['tabs'];\n  variant: TabsProps['variant'];\n  idNamespace: string;\n  ariaLabel?: string;\n  ariaLabelledby?: string;\n  i18nStrings?: TabsProps.I18nStrings;\n}\n\nexport function TabHeaderBar({\n  onChange,\n  activeTabId,\n  tabs,\n  variant,\n  idNamespace,\n  ariaLabel,\n  ariaLabelledby,\n  i18nStrings,\n}: TabHeaderBarProps) {\n  const focusVisible = useFocusVisible();\n\n  const headerBarRef = useRef<HTMLUListElement>(null);\n  const activeTabHeaderRef = useRef<HTMLAnchorElement>(null);\n  const leftOverflowButton = useRef<HTMLElement>(null);\n\n  const isVisualRefresh = useVisualRefresh();\n\n  const [widthChange, containerRef] = useContainerQuery<number>(rect => rect.width);\n  const tabRefs = useRef<Map<string, HTMLElement>>(new Map());\n  const [horizontalOverflow, setHorizontalOverflow] = useState(false);\n  const [leftOverflow, setLeftOverflow] = useState(false);\n  const [rightOverflow, setRightOverflow] = useState(false);\n\n  useEffect(() => {\n    if (headerBarRef.current) {\n      setHorizontalOverflow(hasHorizontalOverflow(headerBarRef.current, leftOverflowButton));\n      setLeftOverflow(hasLeftOverflow(headerBarRef.current));\n      setRightOverflow(hasRightOverflow(headerBarRef.current));\n    }\n  }, [widthChange, tabs]);\n\n  const scrollIntoViewIfPossible = (smooth: boolean) => {\n    if (!activeTabId) {\n      return;\n    }\n    const activeTabRef = tabRefs.current.get(activeTabId);\n    if (activeTabRef && headerBarRef.current) {\n      scrollIntoView(activeTabRef, headerBarRef.current, smooth);\n    }\n  };\n\n  useEffect(() => {\n    // Delay scrollIntoView as the position is depending on parent elements\n    // (effects are called inside-out in the component tree).\n    // Wait one frame to allow parents to complete it's calculation.\n    requestAnimationFrame(() => {\n      scrollIntoViewIfPossible(false);\n    });\n    // Non-smooth scrolling should not be called upon activeId change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [horizontalOverflow, widthChange, tabs.length]);\n\n  useEffect(() => {\n    scrollIntoViewIfPossible(true);\n    // Smooth scrolling should only be called upon activeId change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [activeTabId]);\n\n  useEffect(() => {\n    /*\n     When the selected tab changes and we are currently already focused on a tab,\n     move the focus to the newly selected tab.\n    */\n    if (headerBarRef.current?.contains(document.activeElement)) {\n      if (document.activeElement !== activeTabHeaderRef.current) {\n        activeTabHeaderRef.current?.focus({ preventScroll: true });\n      }\n    }\n  }, [activeTabId]);\n\n  const onScroll = () => {\n    if (headerBarRef.current) {\n      setLeftOverflow(hasLeftOverflow(headerBarRef.current));\n      setRightOverflow(hasRightOverflow(headerBarRef.current));\n    }\n  };\n\n  const classes = clsx({\n    [styles['tabs-header']]: true,\n    [styles['tabs-header-with-divider']]: variant === 'default' || isVisualRefresh,\n  });\n\n  const leftButtonClasses = clsx({\n    [styles['pagination-button']]: true,\n    [styles['pagination-button-left']]: true,\n    [styles['pagination-button-left-scrollable']]: leftOverflow,\n  });\n\n  const rightButtonClasses = clsx({\n    [styles['pagination-button']]: true,\n    [styles['pagination-button-right']]: true,\n    [styles['pagination-button-right-scrollable']]: rightOverflow,\n  });\n\n  return (\n    //converted span to div as list should not be a child of span for HTML validation\n    <div className={classes} ref={containerRef}>\n      {horizontalOverflow && (\n        <span ref={leftOverflowButton} className={leftButtonClasses}>\n          <InternalButton\n            formAction=\"none\"\n            variant=\"icon\"\n            iconName=\"angle-left\"\n            disabled={!leftOverflow}\n            onClick={() => onPaginationClick(headerBarRef, -1)}\n            ariaLabel={i18nStrings?.scrollLeftAriaLabel}\n          />\n        </span>\n      )}\n      <ul\n        role=\"tablist\"\n        className={styles['tabs-header-list']}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        ref={headerBarRef}\n        onScroll={onScroll}\n      >\n        {tabs.map(renderTabHeader)}\n      </ul>\n      {horizontalOverflow && (\n        <span className={rightButtonClasses}>\n          <InternalButton\n            formAction=\"none\"\n            variant=\"icon\"\n            iconName=\"angle-right\"\n            disabled={!rightOverflow}\n            onClick={() => onPaginationClick(headerBarRef, 1)}\n            ariaLabel={i18nStrings?.scrollRightAriaLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n\n  function renderTabHeader(tab: TabsProps.Tab) {\n    const enabledTabsWithCurrentTab = tabs.filter(tab => !tab.disabled || tab.id === activeTabId);\n\n    const highlightTab = function (enabledTabIndex: number) {\n      const tab = enabledTabsWithCurrentTab[enabledTabIndex];\n      if (tab.id === activeTabId) {\n        return;\n      }\n\n      onChange({ activeTabId: tab.id, activeTabHref: tab.href });\n    };\n\n    const handleKeyDown = function (\n      event: React.KeyboardEvent<HTMLAnchorElement> | React.KeyboardEvent<HTMLButtonElement>\n    ) {\n      const { keyCode } = event;\n      const specialKeys = [KeyCode.right, KeyCode.left, KeyCode.end, KeyCode.home, KeyCode.pageUp, KeyCode.pageDown];\n      if (hasModifierKeys(event) || specialKeys.indexOf(keyCode) === -1) {\n        return;\n      }\n      event.preventDefault();\n      const activeIndex = enabledTabsWithCurrentTab.indexOf(tab);\n      switch (keyCode) {\n        case KeyCode.right:\n          if (activeIndex + 1 === enabledTabsWithCurrentTab.length) {\n            highlightTab(0);\n          } else {\n            highlightTab(activeIndex + 1);\n          }\n          return;\n        case KeyCode.left:\n          if (activeIndex === 0) {\n            highlightTab(enabledTabsWithCurrentTab.length - 1);\n          } else {\n            highlightTab(activeIndex - 1);\n          }\n          return;\n        case KeyCode.end:\n          highlightTab(enabledTabsWithCurrentTab.length - 1);\n          return;\n        case KeyCode.home:\n          highlightTab(0);\n          return;\n        case KeyCode.pageDown:\n          if (rightOverflow) {\n            onPaginationClick(headerBarRef, 1);\n          }\n          return;\n        case KeyCode.pageUp:\n          if (leftOverflow) {\n            onPaginationClick(headerBarRef, -1);\n          }\n          return;\n      }\n    };\n\n    const clickTab = (event: React.MouseEvent) => {\n      if (tab.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      // if the primary mouse button is clicked with a modifier key, the browser will handle opening a new tab\n      const specialKey = !isPlainLeftClick(event);\n      if (specialKey && tab.href) {\n        return;\n      }\n\n      event.preventDefault();\n      // for browsers that do not focus buttons on button click\n      if (!tab.href) {\n        const clickedTabRef = tabRefs.current.get(tab.id);\n        if (clickedTabRef) {\n          const childElement = clickedTabRef.firstChild as HTMLButtonElement;\n          if (childElement && childElement !== document.activeElement) {\n            childElement.focus({ preventScroll: true });\n          }\n        }\n      }\n\n      if (tab.id === activeTabId) {\n        return;\n      }\n\n      onChange({ activeTabId: tab.id, activeTabHref: tab.href });\n    };\n\n    const classes = clsx({\n      [styles['tabs-tab-link']]: true,\n      [styles.refresh]: isVisualRefresh,\n      [styles['tabs-tab-active']]: activeTabId === tab.id && !tab.disabled,\n      [styles['tabs-tab-disabled']]: tab.disabled,\n    });\n\n    const commonProps: (JSX.IntrinsicElements['a'] | JSX.IntrinsicElements['button']) & { 'data-testid': string } = {\n      className: classes,\n      ...focusVisible,\n      role: 'tab',\n      'aria-selected': tab.id === activeTabId,\n      'aria-controls': `${idNamespace}-${tab.id}-panel`,\n      'data-testid': tab.id,\n      id: getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n      children: <span className={styles['tabs-tab-label']}>{tab.label}</span>,\n    };\n\n    if (tab.disabled) {\n      commonProps['aria-disabled'] = 'true';\n    } else {\n      commonProps.onClick = clickTab;\n    }\n\n    if (tab.id === activeTabId) {\n      commonProps.ref = activeTabHeaderRef;\n      commonProps.tabIndex = 0;\n      commonProps.onKeyDown = (\n        event: React.KeyboardEvent<HTMLAnchorElement> | React.KeyboardEvent<HTMLButtonElement>\n      ) => handleKeyDown(event);\n    } else {\n      commonProps.tabIndex = -1;\n    }\n\n    let trigger = null;\n    if (tab.href) {\n      const anchorProps = commonProps as JSX.IntrinsicElements['a'];\n      anchorProps.href = tab.href;\n      trigger = <a {...anchorProps} />;\n    } else {\n      const buttonProps = commonProps as JSX.IntrinsicElements['button'];\n      buttonProps.type = 'button';\n      if (tab.disabled) {\n        buttonProps.disabled = true;\n      }\n      trigger = <button {...buttonProps} />;\n    }\n\n    return (\n      <li\n        ref={element => tabRefs.current.set(tab.id, element as HTMLElement)}\n        className={styles['tabs-tab']}\n        role=\"presentation\"\n        key={tab.id}\n      >\n        {trigger}\n      </li>\n    );\n  }\n}\n\nexport function getTabElementId({ namespace, tabId }: { namespace: string; tabId: string }) {\n  return namespace + '-' + tabId;\n}\n"]}
+{"version":3,"file":"tab-header-bar.js","sourceRoot":"lib/default/","sources":["tabs/tab-header-bar.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AACxE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EACL,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,gBAAgB,EAChB,cAAc,GACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAarE,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,OAAO,EACP,WAAW,EACX,SAAS,EACT,cAAc,EACd,WAAW,GACO;IAClB,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACpD,MAAM,kBAAkB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAC3D,MAAM,kBAAkB,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAErD,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;IAE3C,MAAM,CAAC,WAAW,EAAE,YAAY,CAAC,GAAG,iBAAiB,CAAS,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAClF,MAAM,OAAO,GAAG,MAAM,CAA2B,IAAI,GAAG,EAAE,CAAC,CAAC;IAC5D,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,qBAAqB,CAAC,qBAAqB,CAAC,YAAY,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC;YACvF,eAAe,CAAC,eAAe,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;YACvD,gBAAgB,CAAC,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;SAC1D;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC;IAExB,MAAM,wBAAwB,GAAG,CAAC,MAAe,EAAE,EAAE;QACnD,IAAI,CAAC,WAAW,EAAE;YAChB,OAAO;SACR;QACD,MAAM,YAAY,GAAG,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QACtD,IAAI,YAAY,IAAI,YAAY,CAAC,OAAO,EAAE;YACxC,cAAc,CAAC,YAAY,EAAE,YAAY,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;SAC5D;IACH,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,uEAAuE;QACvE,yDAAyD;QACzD,gEAAgE;QAChE,qBAAqB,CAAC,GAAG,EAAE;YACzB,wBAAwB,CAAC,KAAK,CAAC,CAAC;QAClC,CAAC,CAAC,CAAC;QACH,iEAAiE;QACjE,uDAAuD;IACzD,CAAC,EAAE,CAAC,kBAAkB,EAAE,WAAW,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnD,SAAS,CAAC,GAAG,EAAE;QACb,wBAAwB,CAAC,IAAI,CAAC,CAAC;QAC/B,8DAA8D;QAC9D,uDAAuD;IACzD,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,SAAS,CAAC,GAAG,EAAE;;QACb;;;UAGE;QACF,IAAI,MAAA,YAAY,CAAC,OAAO,0CAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;YAC1D,IAAI,QAAQ,CAAC,aAAa,KAAK,kBAAkB,CAAC,OAAO,EAAE;gBACzD,MAAA,kBAAkB,CAAC,OAAO,0CAAE,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;aAC5D;SACF;IACH,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,eAAe,CAAC,eAAe,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;YACvD,gBAAgB,CAAC,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;SAC1D;IACH,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,IAAI,CAAC;QACnB,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,IAAI;QAC7B,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,OAAO,KAAK,SAAS,IAAI,eAAe;KAC/E,CAAC,CAAC;IAEH,MAAM,iBAAiB,GAAG,IAAI,CAAC;QAC7B,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,IAAI;QACnC,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,IAAI;QACxC,CAAC,MAAM,CAAC,mCAAmC,CAAC,CAAC,EAAE,YAAY;KAC5D,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,IAAI,CAAC;QAC9B,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,IAAI;QACnC,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,IAAI;QACzC,CAAC,MAAM,CAAC,oCAAoC,CAAC,CAAC,EAAE,aAAa;KAC9D,CAAC,CAAC;IAEH,OAAO;IACL,iFAAiF;IACjF,6BAAK,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,YAAY;QACvC,kBAAkB,IAAI,CACrB,8BAAM,GAAG,EAAE,kBAAkB,EAAE,SAAS,EAAE,iBAAiB;YACzD,oBAAC,cAAc,IACb,UAAU,EAAC,MAAM,EACjB,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,YAAY,EACrB,QAAQ,EAAE,CAAC,YAAY,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,EAClD,SAAS,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,mBAAmB,GAC3C,CACG,CACR;QACD,4BACE,IAAI,EAAC,SAAS,EACd,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,gBACzB,SAAS,qBACJ,cAAc,EAC/B,GAAG,EAAE,YAAY,EACjB,QAAQ,EAAE,QAAQ,IAEjB,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,CACvB;QACJ,kBAAkB,IAAI,CACrB,8BAAM,SAAS,EAAE,kBAAkB;YACjC,oBAAC,cAAc,IACb,UAAU,EAAC,MAAM,EACjB,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,aAAa,EACtB,QAAQ,EAAE,CAAC,aAAa,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,YAAY,EAAE,CAAC,CAAC,EACjD,SAAS,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,oBAAoB,GAC5C,CACG,CACR,CACG,CACP,CAAC;IAEF,SAAS,eAAe,CAAC,GAAkB;QACzC,MAAM,yBAAyB,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,QAAQ,IAAI,GAAG,CAAC,EAAE,KAAK,WAAW,CAAC,CAAC;QAE9F,MAAM,YAAY,GAAG,UAAU,eAAuB;YACpD,MAAM,GAAG,GAAG,yBAAyB,CAAC,eAAe,CAAC,CAAC;YACvD,IAAI,GAAG,CAAC,EAAE,KAAK,WAAW,EAAE;gBAC1B,OAAO;aACR;YAED,QAAQ,CAAC,EAAE,WAAW,EAAE,GAAG,CAAC,EAAE,EAAE,aAAa,EAAE,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC;QAC7D,CAAC,CAAC;QAEF,MAAM,aAAa,GAAG,UACpB,KAAsF;YAEtF,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;YAC1B,MAAM,WAAW,GAAG,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;YAC/G,IAAI,eAAe,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE;gBACjE,OAAO;aACR;YACD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,WAAW,GAAG,yBAAyB,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;YAC3D,QAAQ,OAAO,EAAE;gBACf,KAAK,OAAO,CAAC,KAAK;oBAChB,IAAI,WAAW,GAAG,CAAC,KAAK,yBAAyB,CAAC,MAAM,EAAE;wBACxD,YAAY,CAAC,CAAC,CAAC,CAAC;qBACjB;yBAAM;wBACL,YAAY,CAAC,WAAW,GAAG,CAAC,CAAC,CAAC;qBAC/B;oBACD,OAAO;gBACT,KAAK,OAAO,CAAC,IAAI;oBACf,IAAI,WAAW,KAAK,CAAC,EAAE;wBACrB,YAAY,CAAC,yBAAyB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;qBACpD;yBAAM;wBACL,YAAY,CAAC,WAAW,GAAG,CAAC,CAAC,CAAC;qBAC/B;oBACD,OAAO;gBACT,KAAK,OAAO,CAAC,GAAG;oBACd,YAAY,CAAC,yBAAyB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;oBACnD,OAAO;gBACT,KAAK,OAAO,CAAC,IAAI;oBACf,YAAY,CAAC,CAAC,CAAC,CAAC;oBAChB,OAAO;gBACT,KAAK,OAAO,CAAC,QAAQ;oBACnB,IAAI,aAAa,EAAE;wBACjB,iBAAiB,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC;qBACpC;oBACD,OAAO;gBACT,KAAK,OAAO,CAAC,MAAM;oBACjB,IAAI,YAAY,EAAE;wBAChB,iBAAiB,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;qBACrC;oBACD,OAAO;aACV;QACH,CAAC,CAAC;QAEF,MAAM,QAAQ,GAAG,CAAC,KAAuB,EAAE,EAAE;YAC3C,IAAI,GAAG,CAAC,QAAQ,EAAE;gBAChB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,wGAAwG;YACxG,MAAM,UAAU,GAAG,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;YAC5C,IAAI,UAAU,IAAI,GAAG,CAAC,IAAI,EAAE;gBAC1B,OAAO;aACR;YAED,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,yDAAyD;YACzD,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE;gBACb,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;gBAClD,IAAI,aAAa,EAAE;oBACjB,MAAM,YAAY,GAAG,aAAa,CAAC,UAA+B,CAAC;oBACnE,IAAI,YAAY,IAAI,YAAY,KAAK,QAAQ,CAAC,aAAa,EAAE;wBAC3D,YAAY,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;qBAC7C;iBACF;aACF;YAED,IAAI,GAAG,CAAC,EAAE,KAAK,WAAW,EAAE;gBAC1B,OAAO;aACR;YAED,QAAQ,CAAC,EAAE,WAAW,EAAE,GAAG,CAAC,EAAE,EAAE,aAAa,EAAE,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC;QAC7D,CAAC,CAAC;QAEF,MAAM,OAAO,GAAG,IAAI,CAAC;YACnB,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,IAAI;YAC/B,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,eAAe;YACjC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,WAAW,KAAK,GAAG,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ;YACpE,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,GAAG,CAAC,QAAQ;SAC5C,CAAC,CAAC;QAEH,MAAM,WAAW,GAA+F;YAC9G,SAAS,EAAE,OAAO;YAClB,IAAI,EAAE,KAAK;YACX,eAAe,EAAE,GAAG,CAAC,EAAE,KAAK,WAAW;YACvC,eAAe,EAAE,GAAG,WAAW,IAAI,GAAG,CAAC,EAAE,QAAQ;YACjD,aAAa,EAAE,GAAG,CAAC,EAAE;YACrB,EAAE,EAAE,eAAe,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC;YAC9D,QAAQ,EAAE,8BAAM,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,IAAG,GAAG,CAAC,KAAK,CAAQ;SACxE,CAAC;QAEF,IAAI,GAAG,CAAC,QAAQ,EAAE;YAChB,WAAW,CAAC,eAAe,CAAC,GAAG,MAAM,CAAC;SACvC;aAAM;YACL,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;SAChC;QAED,IAAI,GAAG,CAAC,EAAE,KAAK,WAAW,EAAE;YAC1B,WAAW,CAAC,GAAG,GAAG,kBAAkB,CAAC;YACrC,WAAW,CAAC,QAAQ,GAAG,CAAC,CAAC;YACzB,WAAW,CAAC,SAAS,GAAG,CACtB,KAAsF,EACtF,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;SAC3B;aAAM;YACL,WAAW,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;SAC3B;QAED,IAAI,OAAO,GAAG,IAAI,CAAC;QACnB,IAAI,GAAG,CAAC,IAAI,EAAE;YACZ,MAAM,WAAW,GAAG,WAAyC,CAAC;YAC9D,WAAW,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC;YAC5B,OAAO,GAAG,2CAAO,WAAW,EAAI,CAAC;SAClC;aAAM;YACL,MAAM,WAAW,GAAG,WAA8C,CAAC;YACnE,WAAW,CAAC,IAAI,GAAG,QAAQ,CAAC;YAC5B,IAAI,GAAG,CAAC,QAAQ,EAAE;gBAChB,WAAW,CAAC,QAAQ,GAAG,IAAI,CAAC;aAC7B;YACD,OAAO,GAAG,gDAAY,WAAW,EAAI,CAAC;SACvC;QAED,OAAO,CACL,4BACE,GAAG,EAAE,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,EAAE,OAAsB,CAAC,EACnE,SAAS,EAAE,MAAM,CAAC,UAAU,CAAC,EAC7B,IAAI,EAAC,cAAc,EACnB,GAAG,EAAE,GAAG,CAAC,EAAE,IAEV,OAAO,CACL,CACN,CAAC;IACJ,CAAC;AACH,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,EAAE,SAAS,EAAE,KAAK,EAAwC;IACxF,OAAO,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC;AACjC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef, useState, useEffect } from 'react';\nimport { TabsProps } from './interfaces';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { InternalButton } from '../button/internal';\nimport { useContainerQuery } from '../internal/hooks/container-queries';\nimport { KeyCode } from '../internal/keycode';\nimport {\n  onPaginationClick,\n  hasHorizontalOverflow,\n  hasLeftOverflow,\n  hasRightOverflow,\n  scrollIntoView,\n} from './scroll-utils';\nimport { hasModifierKeys, isPlainLeftClick } from '../internal/events';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\n\nexport interface TabHeaderBarProps {\n  onChange: (changeDetail: TabsProps.ChangeDetail) => void;\n  activeTabId: TabsProps['activeTabId'];\n  tabs: TabsProps['tabs'];\n  variant: TabsProps['variant'];\n  idNamespace: string;\n  ariaLabel?: string;\n  ariaLabelledby?: string;\n  i18nStrings?: TabsProps.I18nStrings;\n}\n\nexport function TabHeaderBar({\n  onChange,\n  activeTabId,\n  tabs,\n  variant,\n  idNamespace,\n  ariaLabel,\n  ariaLabelledby,\n  i18nStrings,\n}: TabHeaderBarProps) {\n  const headerBarRef = useRef<HTMLUListElement>(null);\n  const activeTabHeaderRef = useRef<HTMLAnchorElement>(null);\n  const leftOverflowButton = useRef<HTMLElement>(null);\n\n  const isVisualRefresh = useVisualRefresh();\n\n  const [widthChange, containerRef] = useContainerQuery<number>(rect => rect.width);\n  const tabRefs = useRef<Map<string, HTMLElement>>(new Map());\n  const [horizontalOverflow, setHorizontalOverflow] = useState(false);\n  const [leftOverflow, setLeftOverflow] = useState(false);\n  const [rightOverflow, setRightOverflow] = useState(false);\n\n  useEffect(() => {\n    if (headerBarRef.current) {\n      setHorizontalOverflow(hasHorizontalOverflow(headerBarRef.current, leftOverflowButton));\n      setLeftOverflow(hasLeftOverflow(headerBarRef.current));\n      setRightOverflow(hasRightOverflow(headerBarRef.current));\n    }\n  }, [widthChange, tabs]);\n\n  const scrollIntoViewIfPossible = (smooth: boolean) => {\n    if (!activeTabId) {\n      return;\n    }\n    const activeTabRef = tabRefs.current.get(activeTabId);\n    if (activeTabRef && headerBarRef.current) {\n      scrollIntoView(activeTabRef, headerBarRef.current, smooth);\n    }\n  };\n\n  useEffect(() => {\n    // Delay scrollIntoView as the position is depending on parent elements\n    // (effects are called inside-out in the component tree).\n    // Wait one frame to allow parents to complete it's calculation.\n    requestAnimationFrame(() => {\n      scrollIntoViewIfPossible(false);\n    });\n    // Non-smooth scrolling should not be called upon activeId change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [horizontalOverflow, widthChange, tabs.length]);\n\n  useEffect(() => {\n    scrollIntoViewIfPossible(true);\n    // Smooth scrolling should only be called upon activeId change\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [activeTabId]);\n\n  useEffect(() => {\n    /*\n     When the selected tab changes and we are currently already focused on a tab,\n     move the focus to the newly selected tab.\n    */\n    if (headerBarRef.current?.contains(document.activeElement)) {\n      if (document.activeElement !== activeTabHeaderRef.current) {\n        activeTabHeaderRef.current?.focus({ preventScroll: true });\n      }\n    }\n  }, [activeTabId]);\n\n  const onScroll = () => {\n    if (headerBarRef.current) {\n      setLeftOverflow(hasLeftOverflow(headerBarRef.current));\n      setRightOverflow(hasRightOverflow(headerBarRef.current));\n    }\n  };\n\n  const classes = clsx({\n    [styles['tabs-header']]: true,\n    [styles['tabs-header-with-divider']]: variant === 'default' || isVisualRefresh,\n  });\n\n  const leftButtonClasses = clsx({\n    [styles['pagination-button']]: true,\n    [styles['pagination-button-left']]: true,\n    [styles['pagination-button-left-scrollable']]: leftOverflow,\n  });\n\n  const rightButtonClasses = clsx({\n    [styles['pagination-button']]: true,\n    [styles['pagination-button-right']]: true,\n    [styles['pagination-button-right-scrollable']]: rightOverflow,\n  });\n\n  return (\n    //converted span to div as list should not be a child of span for HTML validation\n    <div className={classes} ref={containerRef}>\n      {horizontalOverflow && (\n        <span ref={leftOverflowButton} className={leftButtonClasses}>\n          <InternalButton\n            formAction=\"none\"\n            variant=\"icon\"\n            iconName=\"angle-left\"\n            disabled={!leftOverflow}\n            onClick={() => onPaginationClick(headerBarRef, -1)}\n            ariaLabel={i18nStrings?.scrollLeftAriaLabel}\n          />\n        </span>\n      )}\n      <ul\n        role=\"tablist\"\n        className={styles['tabs-header-list']}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        ref={headerBarRef}\n        onScroll={onScroll}\n      >\n        {tabs.map(renderTabHeader)}\n      </ul>\n      {horizontalOverflow && (\n        <span className={rightButtonClasses}>\n          <InternalButton\n            formAction=\"none\"\n            variant=\"icon\"\n            iconName=\"angle-right\"\n            disabled={!rightOverflow}\n            onClick={() => onPaginationClick(headerBarRef, 1)}\n            ariaLabel={i18nStrings?.scrollRightAriaLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n\n  function renderTabHeader(tab: TabsProps.Tab) {\n    const enabledTabsWithCurrentTab = tabs.filter(tab => !tab.disabled || tab.id === activeTabId);\n\n    const highlightTab = function (enabledTabIndex: number) {\n      const tab = enabledTabsWithCurrentTab[enabledTabIndex];\n      if (tab.id === activeTabId) {\n        return;\n      }\n\n      onChange({ activeTabId: tab.id, activeTabHref: tab.href });\n    };\n\n    const handleKeyDown = function (\n      event: React.KeyboardEvent<HTMLAnchorElement> | React.KeyboardEvent<HTMLButtonElement>\n    ) {\n      const { keyCode } = event;\n      const specialKeys = [KeyCode.right, KeyCode.left, KeyCode.end, KeyCode.home, KeyCode.pageUp, KeyCode.pageDown];\n      if (hasModifierKeys(event) || specialKeys.indexOf(keyCode) === -1) {\n        return;\n      }\n      event.preventDefault();\n      const activeIndex = enabledTabsWithCurrentTab.indexOf(tab);\n      switch (keyCode) {\n        case KeyCode.right:\n          if (activeIndex + 1 === enabledTabsWithCurrentTab.length) {\n            highlightTab(0);\n          } else {\n            highlightTab(activeIndex + 1);\n          }\n          return;\n        case KeyCode.left:\n          if (activeIndex === 0) {\n            highlightTab(enabledTabsWithCurrentTab.length - 1);\n          } else {\n            highlightTab(activeIndex - 1);\n          }\n          return;\n        case KeyCode.end:\n          highlightTab(enabledTabsWithCurrentTab.length - 1);\n          return;\n        case KeyCode.home:\n          highlightTab(0);\n          return;\n        case KeyCode.pageDown:\n          if (rightOverflow) {\n            onPaginationClick(headerBarRef, 1);\n          }\n          return;\n        case KeyCode.pageUp:\n          if (leftOverflow) {\n            onPaginationClick(headerBarRef, -1);\n          }\n          return;\n      }\n    };\n\n    const clickTab = (event: React.MouseEvent) => {\n      if (tab.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      // if the primary mouse button is clicked with a modifier key, the browser will handle opening a new tab\n      const specialKey = !isPlainLeftClick(event);\n      if (specialKey && tab.href) {\n        return;\n      }\n\n      event.preventDefault();\n      // for browsers that do not focus buttons on button click\n      if (!tab.href) {\n        const clickedTabRef = tabRefs.current.get(tab.id);\n        if (clickedTabRef) {\n          const childElement = clickedTabRef.firstChild as HTMLButtonElement;\n          if (childElement && childElement !== document.activeElement) {\n            childElement.focus({ preventScroll: true });\n          }\n        }\n      }\n\n      if (tab.id === activeTabId) {\n        return;\n      }\n\n      onChange({ activeTabId: tab.id, activeTabHref: tab.href });\n    };\n\n    const classes = clsx({\n      [styles['tabs-tab-link']]: true,\n      [styles.refresh]: isVisualRefresh,\n      [styles['tabs-tab-active']]: activeTabId === tab.id && !tab.disabled,\n      [styles['tabs-tab-disabled']]: tab.disabled,\n    });\n\n    const commonProps: (JSX.IntrinsicElements['a'] | JSX.IntrinsicElements['button']) & { 'data-testid': string } = {\n      className: classes,\n      role: 'tab',\n      'aria-selected': tab.id === activeTabId,\n      'aria-controls': `${idNamespace}-${tab.id}-panel`,\n      'data-testid': tab.id,\n      id: getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n      children: <span className={styles['tabs-tab-label']}>{tab.label}</span>,\n    };\n\n    if (tab.disabled) {\n      commonProps['aria-disabled'] = 'true';\n    } else {\n      commonProps.onClick = clickTab;\n    }\n\n    if (tab.id === activeTabId) {\n      commonProps.ref = activeTabHeaderRef;\n      commonProps.tabIndex = 0;\n      commonProps.onKeyDown = (\n        event: React.KeyboardEvent<HTMLAnchorElement> | React.KeyboardEvent<HTMLButtonElement>\n      ) => handleKeyDown(event);\n    } else {\n      commonProps.tabIndex = -1;\n    }\n\n    let trigger = null;\n    if (tab.href) {\n      const anchorProps = commonProps as JSX.IntrinsicElements['a'];\n      anchorProps.href = tab.href;\n      trigger = <a {...anchorProps} />;\n    } else {\n      const buttonProps = commonProps as JSX.IntrinsicElements['button'];\n      buttonProps.type = 'button';\n      if (tab.disabled) {\n        buttonProps.disabled = true;\n      }\n      trigger = <button {...buttonProps} />;\n    }\n\n    return (\n      <li\n        ref={element => tabRefs.current.set(tab.id, element as HTMLElement)}\n        className={styles['tabs-tab']}\n        role=\"presentation\"\n        key={tab.id}\n      >\n        {trigger}\n      </li>\n    );\n  }\n}\n\nexport function getTabElementId({ namespace, tabId }: { namespace: string; tabId: string }) {\n  return namespace + '-' + tabId;\n}\n"]}

package/tag-editor/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["tag-editor/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE7D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAajD,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,cAAc,EAAE,gBAAgB,CAAC,OAAO,CAAC;IACzC,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,SAAS,MAAM,EAAE,CAAC,CAAC;IAE1D,iBAAiB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;CACtE;AAED,eAAO,MAAM,UAAU,wFA6FtB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,2FAgCtB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["tag-editor/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE7D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAYjD,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,cAAc,EAAE,gBAAgB,CAAC,OAAO,CAAC;IACzC,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,SAAS,MAAM,EAAE,CAAC,CAAC;IAE1D,iBAAiB,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;CACtE;AAED,eAAO,MAAM,UAAU,wFA6FtB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,2FA6BtB,CAAC"}

package/tag-editor/internal.js

@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 import React, { useRef, useState } from 'react';
 import InternalAutosuggest from '../autosuggest/internal';
-import useFocusVisible from '../internal/hooks/focus-visible';
 import { KeyCode } from '../internal/keycode';
 import { makeCancellable, PromiseCancelledSignal } from '../internal/utils/promises';
 import styles from './styles.css.js';
@@ -54,8 +53,7 @@ export const TagControl = React.forwardRef(({ row, value, readOnly, defaultOptio
         } }));
 });
 export const UndoButton = React.forwardRef(({ children, onClick }, ref) => {
-    const focusVisible = useFocusVisible();
-    return (React.createElement("a", Object.assign({}, focusVisible, { ref: ref, role: "button", tabIndex: 0, className: styles['undo-button'], onClick: onClick, onKeyDown: event => {
+    return (React.createElement("a", { ref: ref, role: "button", tabIndex: 0, className: styles['undo-button'], onClick: onClick, onKeyDown: event => {
             if (event.keyCode === KeyCode.space || event.keyCode === KeyCode.enter) {
                 event.preventDefault();
             }
@@ -68,6 +66,6 @@ export const UndoButton = React.forwardRef(({ children, onClick }, ref) => {
             if (event.keyCode === KeyCode.space) {
                 onClick();
             }
-        } }), children));
+        } }, children));
 });
 //# sourceMappingURL=internal.js.map

package/tag-editor/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["tag-editor/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGhD,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAI1D,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAErF,OAAO,MAAM,MAAM,iBAAiB,CAAC;AA2BrC,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CACxC,CACE,EACE,GAAG,EACH,KAAK,EACL,QAAQ,EACR,cAAc,EACd,WAAW,EACX,SAAS,EACT,WAAW,EACX,cAAc,EACd,qBAAqB,EACrB,KAAK,EACL,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,QAAQ,EACR,MAAM,EACN,SAAS,EACT,iBAAiB,GACD,EAClB,GAA8B,EAC9B,EAAE;IACF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAA2B,cAAc,CAAC,CAAC;IACjF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,EAAkC,CAAC;IAC/E,MAAM,kBAAkB,GAAG,MAAM,CAAqD;QACpF,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;QAChB,WAAW,EAAE,GAAG,EAAE,CAAC,KAAK;KACzB,CAAC,CAAC;IAEH,MAAM,oBAAoB,GAAG,MAAM,CAAkB,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;IAC3F,MAAM,WAAW,GAAG,CAAC,GAAuB,EAAE,KAAa,EAAE,EAAE,CAC7D,oBAAoB,CAAC,OAAO,CAAC,GAAG,KAAK,GAAG,IAAI,oBAAoB,CAAC,OAAO,CAAC,KAAK,KAAK,KAAK,CAAC;IAE3F,MAAM,WAAW,GAAG,CAAC,aAAqB,EAAE,EAAE;QAC5C,IAAI,CAAC,SAAS,IAAI,WAAW,CAAC,YAAY,EAAE,aAAa,CAAC,IAAI,kBAAkB,CAAC,OAAO,CAAC,WAAW,EAAE,EAAE;YACtG,OAAO;SACR;QACD,kBAAkB,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;QAEpC,IAAI,oBAAoB,CAAC,OAAO,CAAC,GAAG,KAAK,YAAY,EAAE;YACrD,wDAAwD;YACxD,UAAU,CAAC,EAAE,CAAC,CAAC;SAChB;aAAM,IAAI,aAAa,KAAK,EAAE,KAAI,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,OAAO,CAAA,IAAI,iBAAiB,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YACrG,iFAAiF;YACjF,UAAU,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC;SACvC;QAED,aAAa,CAAC,SAAS,CAAC,CAAC;QACzB,oBAAoB,CAAC,OAAO,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;QAE3E,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,eAAe,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC;QACnF,OAAO;aACJ,IAAI,CAAC,SAAS,CAAC,EAAE;YAChB,MAAM,UAAU,GAAG,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;YACvD,aAAa,CAAC,SAAS,CAAC,CAAC;YACzB,UAAU,CAAC,UAAU,CAAC,CAAC;YACvB,IAAI,iBAAiB,EAAE;gBACrB,iBAAiB,CAAC,OAAO,GAAG,UAAU,CAAC;aACxC;QACH,CAAC,CAAC;aACD,KAAK,CAAC,GAAG,CAAC,EAAE;YACX,IAAI,CAAC,CAAC,GAAG,YAAY,sBAAsB,CAAC,EAAE;gBAC5C,aAAa,CAAC,OAAO,CAAC,CAAC;aACxB;QACH,CAAC,CAAC,CAAC;QACL,kBAAkB,CAAC,OAAO,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC;IACvD,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,IAClB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAC9C,KAAK,EAAE,OAAO,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,qBAAqB,EACtE,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,EACrD,MAAM,EAAE,GAAG,EAAE,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,GAAG,CAAC,EAC3B,OAAO,EAAE,GAAG,EAAE;YACZ,WAAW,CAAC,EAAE,CAAC,CAAC;QAClB,CAAC,EACD,WAAW,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;YAC1B,WAAW,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;QACpC,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAOF,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CACxC,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAmB,EAAE,GAAiC,EAAE,EAAE;IAC5E,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,OAAO,CACL,2CACM,YAAY,IAChB,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,EAChC,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAK,CAAC,EAAE;YACjB,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,EAAE;gBACtE,KAAK,CAAC,cAAc,EAAE,CAAC;aACxB;YACD,4DAA4D;YAC5D,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,EAAE;gBACnC,OAAO,EAAE,CAAC;aACX;QACH,CAAC,EACD,OAAO,EAAE,KAAK,CAAC,EAAE;YACf,sDAAsD;YACtD,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,KAAK,EAAE;gBACnC,OAAO,EAAE,CAAC;aACX;QACH,CAAC,KAEA,QAAQ,CACP,CACL,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef, useState } from 'react';\n\nimport { AutosuggestProps } from '../autosuggest/interfaces';\nimport InternalAutosuggest from '../autosuggest/internal';\nimport { InputProps } from '../input/interfaces';\nimport { DropdownStatusProps } from '../internal/components/dropdown-status';\n\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport { KeyCode } from '../internal/keycode';\nimport { makeCancellable, PromiseCancelledSignal } from '../internal/utils/promises';\n\nimport styles from './styles.css.js';\n\ninterface FilteringParams {\n  key?: string;\n  value?: string;\n}\nexport interface TagControlProps {\n  row: number;\n  value: string;\n  readOnly: boolean;\n  defaultOptions: AutosuggestProps.Options;\n  placeholder: string;\n  errorText: string;\n  loadingText: string;\n  suggestionText: string;\n  tooManySuggestionText: string;\n  limit: number;\n  filteringKey?: string;\n  clearAriaLabel?: string;\n  enteredTextLabel: (value: string) => string;\n  onChange: (value: string, row: number) => void;\n  onBlur?: (row: number) => void;\n  onRequest?: (value: string) => Promise<readonly string[]>;\n\n  initialOptionsRef?: React.MutableRefObject<AutosuggestProps.Options>;\n}\n\nexport const TagControl = React.forwardRef(\n  (\n    {\n      row,\n      value,\n      readOnly,\n      defaultOptions,\n      placeholder,\n      errorText,\n      loadingText,\n      suggestionText,\n      tooManySuggestionText,\n      limit,\n      filteringKey,\n      enteredTextLabel,\n      clearAriaLabel,\n      onChange,\n      onBlur,\n      onRequest,\n      initialOptionsRef,\n    }: TagControlProps,\n    ref: React.Ref<InputProps.Ref>\n  ) => {\n    const [options, setOptions] = useState<AutosuggestProps.Options>(defaultOptions);\n    const [statusType, setStatusType] = useState<DropdownStatusProps.StatusType>();\n    const requestCancelFnRef = useRef<{ cancel: () => void; isCancelled: () => boolean }>({\n      cancel: () => {},\n      isCancelled: () => false,\n    });\n\n    const latestFilteringQuery = useRef<FilteringParams>({ key: undefined, value: undefined });\n    const isSameQuery = (key: string | undefined, value: string) =>\n      latestFilteringQuery.current.key === key && latestFilteringQuery.current.value === value;\n\n    const onLoadItems = (filteringText: string) => {\n      if (!onRequest || isSameQuery(filteringKey, filteringText) || requestCancelFnRef.current.isCancelled()) {\n        return;\n      }\n      requestCancelFnRef.current.cancel();\n\n      if (latestFilteringQuery.current.key !== filteringKey) {\n        // Reset suggestions for values if the key is different.\n        setOptions([]);\n      } else if (filteringText === '' && initialOptionsRef?.current && initialOptionsRef.current.length > 0) {\n        // Load in the background, if the value is empty and we already have suggestions.\n        setOptions(initialOptionsRef.current);\n      }\n\n      setStatusType('loading');\n      latestFilteringQuery.current = { key: filteringKey, value: filteringText };\n\n      const { promise, cancel, isCancelled } = makeCancellable(onRequest(filteringText));\n      promise\n        .then(newValues => {\n          const newOptions = newValues.map(value => ({ value }));\n          setStatusType(undefined);\n          setOptions(newOptions);\n          if (initialOptionsRef) {\n            initialOptionsRef.current = newOptions;\n          }\n        })\n        .catch(err => {\n          if (!(err instanceof PromiseCancelledSignal)) {\n            setStatusType('error');\n          }\n        });\n      requestCancelFnRef.current = { cancel, isCancelled };\n    };\n\n    return (\n      <InternalAutosuggest\n        ref={ref}\n        value={value}\n        readOnly={readOnly}\n        statusType={statusType}\n        options={options.length < limit ? options : []}\n        empty={options.length < limit ? suggestionText : tooManySuggestionText}\n        placeholder={placeholder}\n        errorText={errorText}\n        loadingText={loadingText}\n        enteredTextLabel={enteredTextLabel}\n        clearAriaLabel={clearAriaLabel}\n        onChange={({ detail }) => onChange(detail.value, row)}\n        onBlur={() => onBlur?.(row)}\n        onFocus={() => {\n          onLoadItems('');\n        }}\n        onLoadItems={({ detail }) => {\n          onLoadItems(detail.filteringText);\n        }}\n      />\n    );\n  }\n);\n\nexport interface UndoButtonProps {\n  children: React.ReactNode;\n  onClick: () => void;\n}\n\nexport const UndoButton = React.forwardRef(\n  ({ children, onClick }: UndoButtonProps, ref: React.Ref<HTMLAnchorElement>) => {\n    const focusVisible = useFocusVisible();\n\n    return (\n      <a\n        {...focusVisible}\n        ref={ref}\n        role=\"button\"\n        tabIndex={0}\n        className={styles['undo-button']}\n        onClick={onClick}\n        onKeyDown={event => {\n          if (event.keyCode === KeyCode.space || event.keyCode === KeyCode.enter) {\n            event.preventDefault();\n          }\n          // Enter activates the button on key down instead of key up.\n          if (event.keyCode === KeyCode.enter) {\n            onClick();\n          }\n        }}\n        onKeyUp={event => {\n          // Emulate button behavior, which also fires on space.\n          if (event.keyCode === KeyCode.space) {\n            onClick();\n          }\n        }}\n      >\n        {children}\n      </a>\n    );\n  }\n);\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["tag-editor/internal.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';\n\nimport { AutosuggestProps } from '../autosuggest/interfaces';\nimport InternalAutosuggest from '../autosuggest/internal';\nimport { InputProps } from '../input/interfaces';\nimport { DropdownStatusProps } from '../internal/components/dropdown-status';\n\nimport { KeyCode } from '../internal/keycode';\nimport { makeCancellable, PromiseCancelledSignal } from '../internal/utils/promises';\n\nimport styles from './styles.css.js';\n\ninterface FilteringParams {\n  key?: string;\n  value?: string;\n}\nexport interface TagControlProps {\n  row: number;\n  value: string;\n  readOnly: boolean;\n  defaultOptions: AutosuggestProps.Options;\n  placeholder: string;\n  errorText: string;\n  loadingText: string;\n  suggestionText: string;\n  tooManySuggestionText: string;\n  limit: number;\n  filteringKey?: string;\n  clearAriaLabel?: string;\n  enteredTextLabel: (value: string) => string;\n  onChange: (value: string, row: number) => void;\n  onBlur?: (row: number) => void;\n  onRequest?: (value: string) => Promise<readonly string[]>;\n\n  initialOptionsRef?: React.MutableRefObject<AutosuggestProps.Options>;\n}\n\nexport const TagControl = React.forwardRef(\n  (\n    {\n      row,\n      value,\n      readOnly,\n      defaultOptions,\n      placeholder,\n      errorText,\n      loadingText,\n      suggestionText,\n      tooManySuggestionText,\n      limit,\n      filteringKey,\n      enteredTextLabel,\n      clearAriaLabel,\n      onChange,\n      onBlur,\n      onRequest,\n      initialOptionsRef,\n    }: TagControlProps,\n    ref: React.Ref<InputProps.Ref>\n  ) => {\n    const [options, setOptions] = useState<AutosuggestProps.Options>(defaultOptions);\n    const [statusType, setStatusType] = useState<DropdownStatusProps.StatusType>();\n    const requestCancelFnRef = useRef<{ cancel: () => void; isCancelled: () => boolean }>({\n      cancel: () => {},\n      isCancelled: () => false,\n    });\n\n    const latestFilteringQuery = useRef<FilteringParams>({ key: undefined, value: undefined });\n    const isSameQuery = (key: string | undefined, value: string) =>\n      latestFilteringQuery.current.key === key && latestFilteringQuery.current.value === value;\n\n    const onLoadItems = (filteringText: string) => {\n      if (!onRequest || isSameQuery(filteringKey, filteringText) || requestCancelFnRef.current.isCancelled()) {\n        return;\n      }\n      requestCancelFnRef.current.cancel();\n\n      if (latestFilteringQuery.current.key !== filteringKey) {\n        // Reset suggestions for values if the key is different.\n        setOptions([]);\n      } else if (filteringText === '' && initialOptionsRef?.current && initialOptionsRef.current.length > 0) {\n        // Load in the background, if the value is empty and we already have suggestions.\n        setOptions(initialOptionsRef.current);\n      }\n\n      setStatusType('loading');\n      latestFilteringQuery.current = { key: filteringKey, value: filteringText };\n\n      const { promise, cancel, isCancelled } = makeCancellable(onRequest(filteringText));\n      promise\n        .then(newValues => {\n          const newOptions = newValues.map(value => ({ value }));\n          setStatusType(undefined);\n          setOptions(newOptions);\n          if (initialOptionsRef) {\n            initialOptionsRef.current = newOptions;\n          }\n        })\n        .catch(err => {\n          if (!(err instanceof PromiseCancelledSignal)) {\n            setStatusType('error');\n          }\n        });\n      requestCancelFnRef.current = { cancel, isCancelled };\n    };\n\n    return (\n      <InternalAutosuggest\n        ref={ref}\n        value={value}\n        readOnly={readOnly}\n        statusType={statusType}\n        options={options.length < limit ? options : []}\n        empty={options.length < limit ? suggestionText : tooManySuggestionText}\n        placeholder={placeholder}\n        errorText={errorText}\n        loadingText={loadingText}\n        enteredTextLabel={enteredTextLabel}\n        clearAriaLabel={clearAriaLabel}\n        onChange={({ detail }) => onChange(detail.value, row)}\n        onBlur={() => onBlur?.(row)}\n        onFocus={() => {\n          onLoadItems('');\n        }}\n        onLoadItems={({ detail }) => {\n          onLoadItems(detail.filteringText);\n        }}\n      />\n    );\n  }\n);\n\nexport interface UndoButtonProps {\n  children: React.ReactNode;\n  onClick: () => void;\n}\n\nexport const UndoButton = React.forwardRef(\n  ({ children, onClick }: UndoButtonProps, ref: React.Ref<HTMLAnchorElement>) => {\n    return (\n      <a\n        ref={ref}\n        role=\"button\"\n        tabIndex={0}\n        className={styles['undo-button']}\n        onClick={onClick}\n        onKeyDown={event => {\n          if (event.keyCode === KeyCode.space || event.keyCode === KeyCode.enter) {\n            event.preventDefault();\n          }\n          // Enter activates the button on key down instead of key up.\n          if (event.keyCode === KeyCode.enter) {\n            onClick();\n          }\n        }}\n        onKeyUp={event => {\n          // Emulate button behavior, which also fires on space.\n          if (event.keyCode === KeyCode.space) {\n            onClick();\n          }\n        }}\n      >\n        {children}\n      </a>\n    );\n  }\n);\n"]}

package/tag-editor/styles.css.js

@@ -1,8 +1,8 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_brdst_xzf8v_93",
-  "loading": "awsui_loading_brdst_xzf8v_97",
-  "undo-button": "awsui_undo-button_brdst_xzf8v_101"
+  "root": "awsui_root_brdst_1sizh_93",
+  "loading": "awsui_loading_brdst_1sizh_97",
+  "undo-button": "awsui_undo-button_brdst_1sizh_101"
 };
   

package/tag-editor/styles.scoped.css

@@ -90,15 +90,15 @@ 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_brdst_xzf8v_93:not(#\9) {
+.awsui_root_brdst_1sizh_93:not(#\9) {
   /* used in test utils */
 }
 
-.awsui_loading_brdst_xzf8v_97:not(#\9) {
+.awsui_loading_brdst_1sizh_97:not(#\9) {
   /* used in test utils */
 }
 
-.awsui_undo-button_brdst_xzf8v_101:not(#\9) {
+.awsui_undo-button_brdst_1sizh_101:not(#\9) {
   -webkit-font-smoothing: var(--font-smoothing-webkit-vu3hx4, antialiased);
   -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-nkh1jb, grayscale);
   color: var(--color-text-link-default-5f186r, #0972d3);
@@ -113,31 +113,31 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   transition-duration: var(--motion-duration-refresh-only-medium-5flen2, 165ms);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_undo-button_brdst_xzf8v_101:not(#\9) {
+  .awsui_undo-button_brdst_1sizh_101:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_undo-button_brdst_xzf8v_101:not(#\9), .awsui-mode-entering .awsui_undo-button_brdst_xzf8v_101:not(#\9) {
+.awsui-motion-disabled .awsui_undo-button_brdst_1sizh_101:not(#\9), .awsui-mode-entering .awsui_undo-button_brdst_1sizh_101:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_undo-button_brdst_xzf8v_101:not(#\9):hover {
+.awsui_undo-button_brdst_1sizh_101:not(#\9):hover {
   cursor: pointer;
   color: var(--color-text-link-hover-kololx, #033160);
 }
-.awsui_undo-button_brdst_xzf8v_101:not(#\9):focus {
+.awsui_undo-button_brdst_1sizh_101:not(#\9):focus {
   outline: none;
 }
-.awsui_undo-button_brdst_xzf8v_101:not(#\9):active {
+.awsui_undo-button_brdst_1sizh_101:not(#\9):active {
   color: var(--color-text-link-hover-kololx, #033160);
 }
-.awsui_undo-button_brdst_xzf8v_101:not(#\9):active, .awsui_undo-button_brdst_xzf8v_101:not(#\9):focus, .awsui_undo-button_brdst_xzf8v_101:not(#\9):hover {
+.awsui_undo-button_brdst_1sizh_101:not(#\9):active, .awsui_undo-button_brdst_1sizh_101:not(#\9):focus, .awsui_undo-button_brdst_1sizh_101:not(#\9):hover {
   text-decoration: underline;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   text-decoration-color: var(--color-text-link-button-underline-hover-ei09le, transparent);
 }
-.awsui_undo-button_brdst_xzf8v_101[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_undo-button_brdst_1sizh_101:not(#\9):focus {
   outline: thin dotted;
   outline: var(--border-link-focus-ring-outline-k2wccv, 0);
   outline-offset: 2px;

package/tag-editor/styles.selectors.js

@@ -2,8 +2,8 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_brdst_xzf8v_93",
-  "loading": "awsui_loading_brdst_xzf8v_97",
-  "undo-button": "awsui_undo-button_brdst_xzf8v_101"
+  "root": "awsui_root_brdst_1sizh_93",
+  "loading": "awsui_loading_brdst_1sizh_97",
+  "undo-button": "awsui_undo-button_brdst_1sizh_101"
 };
   

package/token-group/dismiss-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dismiss-button.d.ts","sourceRoot":"lib/default/","sources":["token-group/dismiss-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAO/C,UAAU,kBAAkB;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;;AAED,wBAAyC"}
+{"version":3,"file":"dismiss-button.d.ts","sourceRoot":"lib/default/","sources":["token-group/dismiss-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAK/C,UAAU,kBAAkB;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;;AAED,wBAAyC"}

package/token-group/dismiss-button.js

@@ -4,11 +4,9 @@ import React, { forwardRef } from 'react';
 import clsx from 'clsx';
 import styles from './styles.css.js';
 import InternalIcon from '../icon/internal';
-import useFocusVisible from '../internal/hooks/focus-visible';
 export default forwardRef(DismissButton);
 function DismissButton({ disabled, dismissLabel, onDismiss }, ref) {
-    const focusVisible = useFocusVisible();
-    return (React.createElement("button", Object.assign({ ref: ref, type: "button", className: clsx(styles['dismiss-button']), disabled: disabled, onClick: onDismiss, "aria-label": dismissLabel }, focusVisible),
+    return (React.createElement("button", { ref: ref, type: "button", className: clsx(styles['dismiss-button']), disabled: disabled, onClick: onDismiss, "aria-label": dismissLabel },
         React.createElement(InternalIcon, { name: "close" })));
 }
 //# sourceMappingURL=dismiss-button.js.map

package/token-group/dismiss-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"dismiss-button.js","sourceRoot":"lib/default/","sources":["token-group/dismiss-button.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAC/C,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAE5C,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAQ9D,eAAe,UAAU,CAAC,aAAa,CAAC,CAAC;AAEzC,SAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAsB,EAAE,GAA2B;IAC3G,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,OAAO,CACL,8CACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EACzC,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,SAAS,gBACN,YAAY,IACpB,YAAY;QAEhB,oBAAC,YAAY,IAAC,IAAI,EAAC,OAAO,GAAG,CACtB,CACV,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, Ref } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalIcon from '../icon/internal';\n\nimport useFocusVisible from '../internal/hooks/focus-visible';\n\ninterface DismissButtonProps {\n  disabled?: boolean;\n  onDismiss?: () => void;\n  dismissLabel?: string;\n}\n\nexport default forwardRef(DismissButton);\n\nfunction DismissButton({ disabled, dismissLabel, onDismiss }: DismissButtonProps, ref: Ref<HTMLButtonElement>) {\n  const focusVisible = useFocusVisible();\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      className={clsx(styles['dismiss-button'])}\n      disabled={disabled}\n      onClick={onDismiss}\n      aria-label={dismissLabel}\n      {...focusVisible}\n    >\n      <InternalIcon name=\"close\" />\n    </button>\n  );\n}\n"]}
+{"version":3,"file":"dismiss-button.js","sourceRoot":"lib/default/","sources":["token-group/dismiss-button.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAC/C,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAQ5C,eAAe,UAAU,CAAC,aAAa,CAAC,CAAC;AAEzC,SAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAsB,EAAE,GAA2B;IAC3G,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EACzC,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,SAAS,gBACN,YAAY;QAExB,oBAAC,YAAY,IAAC,IAAI,EAAC,OAAO,GAAG,CACtB,CACV,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, Ref } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalIcon from '../icon/internal';\n\ninterface DismissButtonProps {\n  disabled?: boolean;\n  onDismiss?: () => void;\n  dismissLabel?: string;\n}\n\nexport default forwardRef(DismissButton);\n\nfunction DismissButton({ disabled, dismissLabel, onDismiss }: DismissButtonProps, ref: Ref<HTMLButtonElement>) {\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      className={clsx(styles['dismiss-button'])}\n      disabled={disabled}\n      onClick={onDismiss}\n      aria-label={dismissLabel}\n    >\n      <InternalIcon name=\"close\" />\n    </button>\n  );\n}\n"]}