@cloudscape-design/components-themeable 3.0.373 → 3.0.375

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

@@ -2,39 +2,39 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_wih1l_17u0m_97",
-  "tools": "awsui_tools_wih1l_17u0m_108",
-  "tools-filtering": "awsui_tools-filtering_wih1l_17u0m_114",
-  "tools-align-right": "awsui_tools-align-right_wih1l_17u0m_128",
-  "tools-pagination": "awsui_tools-pagination_wih1l_17u0m_132",
-  "tools-preferences": "awsui_tools-preferences_wih1l_17u0m_132",
-  "tools-small": "awsui_tools-small_wih1l_17u0m_138",
-  "table": "awsui_table_wih1l_17u0m_144",
-  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_17u0m_150",
-  "wrapper": "awsui_wrapper_wih1l_17u0m_154",
-  "variant-stacked": "awsui_variant-stacked_wih1l_17u0m_161",
-  "variant-container": "awsui_variant-container_wih1l_17u0m_161",
-  "has-footer": "awsui_has-footer_wih1l_17u0m_165",
-  "has-header": "awsui_has-header_wih1l_17u0m_168",
-  "cell-merged": "awsui_cell-merged_wih1l_17u0m_182",
-  "cell-merged-content": "awsui_cell-merged-content_wih1l_17u0m_193",
-  "empty": "awsui_empty_wih1l_17u0m_208",
-  "loading": "awsui_loading_wih1l_17u0m_212",
-  "selection-control": "awsui_selection-control_wih1l_17u0m_221",
-  "selection-control-header": "awsui_selection-control-header_wih1l_17u0m_228",
-  "dark-header": "awsui_dark-header_wih1l_17u0m_237",
-  "header-secondary": "awsui_header-secondary_wih1l_17u0m_242",
-  "table-has-header": "awsui_table-has-header_wih1l_17u0m_258",
-  "header-controls": "awsui_header-controls_wih1l_17u0m_262",
-  "variant-full-page": "awsui_variant-full-page_wih1l_17u0m_266",
-  "variant-embedded": "awsui_variant-embedded_wih1l_17u0m_274",
-  "variant-borderless": "awsui_variant-borderless_wih1l_17u0m_274",
-  "footer-wrapper": "awsui_footer-wrapper_wih1l_17u0m_280",
-  "footer": "awsui_footer_wih1l_17u0m_280",
-  "footer-with-pagination": "awsui_footer-with-pagination_wih1l_17u0m_288",
-  "footer-pagination": "awsui_footer-pagination_wih1l_17u0m_296",
-  "thead-active": "awsui_thead-active_wih1l_17u0m_300",
-  "row": "awsui_row_wih1l_17u0m_301",
-  "row-selected": "awsui_row-selected_wih1l_17u0m_302"
+  "root": "awsui_root_wih1l_18u8t_97",
+  "tools": "awsui_tools_wih1l_18u8t_108",
+  "tools-filtering": "awsui_tools-filtering_wih1l_18u8t_114",
+  "tools-align-right": "awsui_tools-align-right_wih1l_18u8t_128",
+  "tools-pagination": "awsui_tools-pagination_wih1l_18u8t_132",
+  "tools-preferences": "awsui_tools-preferences_wih1l_18u8t_132",
+  "tools-small": "awsui_tools-small_wih1l_18u8t_138",
+  "table": "awsui_table_wih1l_18u8t_144",
+  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_18u8t_150",
+  "wrapper": "awsui_wrapper_wih1l_18u8t_154",
+  "variant-stacked": "awsui_variant-stacked_wih1l_18u8t_161",
+  "variant-container": "awsui_variant-container_wih1l_18u8t_161",
+  "has-footer": "awsui_has-footer_wih1l_18u8t_165",
+  "has-header": "awsui_has-header_wih1l_18u8t_168",
+  "cell-merged": "awsui_cell-merged_wih1l_18u8t_182",
+  "cell-merged-content": "awsui_cell-merged-content_wih1l_18u8t_193",
+  "empty": "awsui_empty_wih1l_18u8t_208",
+  "loading": "awsui_loading_wih1l_18u8t_212",
+  "selection-control": "awsui_selection-control_wih1l_18u8t_221",
+  "selection-control-header": "awsui_selection-control-header_wih1l_18u8t_228",
+  "dark-header": "awsui_dark-header_wih1l_18u8t_237",
+  "header-secondary": "awsui_header-secondary_wih1l_18u8t_242",
+  "table-has-header": "awsui_table-has-header_wih1l_18u8t_258",
+  "header-controls": "awsui_header-controls_wih1l_18u8t_262",
+  "variant-full-page": "awsui_variant-full-page_wih1l_18u8t_266",
+  "variant-embedded": "awsui_variant-embedded_wih1l_18u8t_274",
+  "variant-borderless": "awsui_variant-borderless_wih1l_18u8t_274",
+  "footer-wrapper": "awsui_footer-wrapper_wih1l_18u8t_280",
+  "footer": "awsui_footer_wih1l_18u8t_280",
+  "footer-with-pagination": "awsui_footer-with-pagination_wih1l_18u8t_288",
+  "footer-pagination": "awsui_footer-pagination_wih1l_18u8t_296",
+  "thead-active": "awsui_thead-active_wih1l_18u8t_300",
+  "row": "awsui_row_wih1l_18u8t_301",
+  "row-selected": "awsui_row-selected_wih1l_18u8t_302"
 };
   

package/lib/internal/template/table/use-sticky-header.js

@@ -1,9 +1,9 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import { useLayoutEffect, useCallback } from 'react';
-import { useResizeObserver } from '../internal/hooks/container-queries/use-resize-observer';
 import stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';
 import { useMobile } from '../internal/hooks/use-mobile';
+import { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';
 function syncSizes(from, to) {
     const fromCells = Array.prototype.slice.apply(from.children);
     const toCells = Array.prototype.slice.apply(to.children);

package/lib/internal/template/table/use-sticky-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-sticky-header.js","sourceRoot":"lib/default/","sources":["table/use-sticky-header.ts"],"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 { useLayoutEffect, RefObject, useCallback } from 'react';\nimport { useResizeObserver } from '../internal/hooks/container-queries/use-resize-observer';\nimport stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';\nimport { useMobile } from '../internal/hooks/use-mobile';\n\nfunction syncSizes(from: HTMLElement, to: HTMLElement) {\n  const fromCells = Array.prototype.slice.apply(from.children);\n  const toCells = Array.prototype.slice.apply(to.children);\n  for (let i = 0; i < fromCells.length; i++) {\n    let width = fromCells[i].style.width;\n    // use auto if it is set by resizable columns or real size otherwise\n    if (width !== 'auto') {\n      width = `${fromCells[i].offsetWidth}px`;\n    }\n    toCells[i].style.width = width;\n  }\n}\n\nexport const useStickyHeader = (\n  tableRef: RefObject<HTMLElement>,\n  theadRef: RefObject<HTMLElement>,\n  secondaryTheadRef: RefObject<HTMLElement>,\n  secondaryTableRef: RefObject<HTMLElement>,\n  tableWrapperRef: RefObject<HTMLElement>\n) => {\n  const isMobile = useMobile();\n  // Sync the sizes of the column header copies in the sticky header with the originals\n  const syncColumnHeaderWidths = useCallback(() => {\n    if (\n      tableRef.current &&\n      theadRef.current &&\n      secondaryTheadRef.current &&\n      secondaryTableRef.current &&\n      tableWrapperRef.current\n    ) {\n      syncSizes(theadRef.current, secondaryTheadRef.current);\n\n      // Using the tableRef offsetWidth instead of the theadRef because in VR\n      // the tableRef adds extra padding to the table and by default the theadRef will have a width\n      // without the padding and will make the sticky header width incorrect.\n      secondaryTableRef.current.style.width = `${tableRef.current.offsetWidth}px`;\n\n      tableWrapperRef.current.style.marginTop = `-${theadRef.current.offsetHeight}px`;\n    }\n  }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);\n  useLayoutEffect(() => {\n    syncColumnHeaderWidths();\n  });\n  useResizeObserver(theadRef, syncColumnHeaderWidths);\n  const scrollToTop = () => {\n    if (!isMobile && theadRef.current && secondaryTheadRef.current && tableWrapperRef.current) {\n      const scrollDist = calculateScrollingOffset(theadRef.current, secondaryTheadRef.current);\n      if (scrollDist > 0) {\n        scrollUpBy(scrollDist, tableWrapperRef.current);\n      }\n    }\n  };\n  const { scrollToItem } = stickyScrolling(tableWrapperRef, secondaryTheadRef);\n  const scrollToRow = (itemNode: HTMLElement | null) => {\n    if (!isMobile) {\n      scrollToItem(itemNode);\n    }\n  };\n  return { scrollToRow, scrollToTop };\n};\n"]}
+{"version":3,"file":"use-sticky-header.js","sourceRoot":"lib/default/","sources":["table/use-sticky-header.ts"],"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 { useLayoutEffect, RefObject, useCallback } from 'react';\nimport stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nfunction syncSizes(from: HTMLElement, to: HTMLElement) {\n  const fromCells = Array.prototype.slice.apply(from.children);\n  const toCells = Array.prototype.slice.apply(to.children);\n  for (let i = 0; i < fromCells.length; i++) {\n    let width = fromCells[i].style.width;\n    // use auto if it is set by resizable columns or real size otherwise\n    if (width !== 'auto') {\n      width = `${fromCells[i].offsetWidth}px`;\n    }\n    toCells[i].style.width = width;\n  }\n}\n\nexport const useStickyHeader = (\n  tableRef: RefObject<HTMLElement>,\n  theadRef: RefObject<HTMLElement>,\n  secondaryTheadRef: RefObject<HTMLElement>,\n  secondaryTableRef: RefObject<HTMLElement>,\n  tableWrapperRef: RefObject<HTMLElement>\n) => {\n  const isMobile = useMobile();\n  // Sync the sizes of the column header copies in the sticky header with the originals\n  const syncColumnHeaderWidths = useCallback(() => {\n    if (\n      tableRef.current &&\n      theadRef.current &&\n      secondaryTheadRef.current &&\n      secondaryTableRef.current &&\n      tableWrapperRef.current\n    ) {\n      syncSizes(theadRef.current, secondaryTheadRef.current);\n\n      // Using the tableRef offsetWidth instead of the theadRef because in VR\n      // the tableRef adds extra padding to the table and by default the theadRef will have a width\n      // without the padding and will make the sticky header width incorrect.\n      secondaryTableRef.current.style.width = `${tableRef.current.offsetWidth}px`;\n\n      tableWrapperRef.current.style.marginTop = `-${theadRef.current.offsetHeight}px`;\n    }\n  }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);\n  useLayoutEffect(() => {\n    syncColumnHeaderWidths();\n  });\n  useResizeObserver(theadRef, syncColumnHeaderWidths);\n  const scrollToTop = () => {\n    if (!isMobile && theadRef.current && secondaryTheadRef.current && tableWrapperRef.current) {\n      const scrollDist = calculateScrollingOffset(theadRef.current, secondaryTheadRef.current);\n      if (scrollDist > 0) {\n        scrollUpBy(scrollDist, tableWrapperRef.current);\n      }\n    }\n  };\n  const { scrollToItem } = stickyScrolling(tableWrapperRef, secondaryTheadRef);\n  const scrollToRow = (itemNode: HTMLElement | null) => {\n    if (!isMobile) {\n      scrollToItem(itemNode);\n    }\n  };\n  return { scrollToRow, scrollToTop };\n};\n"]}

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

@@ -1,26 +1,26 @@
 
     import './styles.scoped.css';
     export default {
-  "tabs-header": "awsui_tabs-header_14rmt_14dfh_186",
-  "tabs-header-list": "awsui_tabs-header-list_14rmt_14dfh_192",
-  "pagination-button": "awsui_pagination-button_14rmt_14dfh_207",
-  "pagination-button-left": "awsui_pagination-button-left_14rmt_14dfh_212",
-  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_14dfh_215",
-  "pagination-button-right": "awsui_pagination-button-right_14rmt_14dfh_219",
-  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_14dfh_222",
-  "tabs-tab": "awsui_tabs-tab_14rmt_14dfh_227",
-  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_14dfh_238",
-  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_14dfh_254",
-  "refresh": "awsui_refresh_14rmt_14dfh_270",
-  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_14dfh_316",
-  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_14dfh_348",
-  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_14dfh_355",
-  "root": "awsui_root_14rmt_14dfh_359",
-  "tabs": "awsui_tabs_14rmt_14dfh_186",
-  "tabs-content": "awsui_tabs-content_14rmt_14dfh_378",
-  "tabs-content-active": "awsui_tabs-content-active_14rmt_14dfh_382",
-  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_14dfh_392",
-  "with-paddings": "awsui_with-paddings_14rmt_14dfh_392",
-  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_14dfh_396"
+  "tabs-header": "awsui_tabs-header_14rmt_e9gho_186",
+  "tabs-header-list": "awsui_tabs-header-list_14rmt_e9gho_192",
+  "pagination-button": "awsui_pagination-button_14rmt_e9gho_207",
+  "pagination-button-left": "awsui_pagination-button-left_14rmt_e9gho_212",
+  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_e9gho_215",
+  "pagination-button-right": "awsui_pagination-button-right_14rmt_e9gho_219",
+  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_e9gho_222",
+  "tabs-tab": "awsui_tabs-tab_14rmt_e9gho_227",
+  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_e9gho_238",
+  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_e9gho_254",
+  "refresh": "awsui_refresh_14rmt_e9gho_270",
+  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_e9gho_316",
+  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_e9gho_348",
+  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_e9gho_355",
+  "root": "awsui_root_14rmt_e9gho_359",
+  "tabs": "awsui_tabs_14rmt_e9gho_186",
+  "tabs-content": "awsui_tabs-content_14rmt_e9gho_378",
+  "tabs-content-active": "awsui_tabs-content-active_14rmt_e9gho_382",
+  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_e9gho_392",
+  "with-paddings": "awsui_with-paddings_14rmt_e9gho_392",
+  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_e9gho_396"
 };
   

package/lib/internal/template/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_14dfh_186:not(#\9) {
+.awsui_tabs-header_14rmt_e9gho_186:not(#\9) {
   margin: 0;
   padding: 0;
   display: flex;
 }
 
-.awsui_tabs-header-list_14rmt_14dfh_192:not(#\9) {
+.awsui_tabs-header-list_14rmt_e9gho_192:not(#\9) {
   margin: 0;
   padding: 0;
   display: flex;
@@ -200,45 +200,45 @@ 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_14dfh_192:not(#\9)::-webkit-scrollbar {
+.awsui_tabs-header-list_14rmt_e9gho_192:not(#\9)::-webkit-scrollbar {
   display: none; /* Safari and Chrome */
 }
 
-.awsui_pagination-button_14rmt_14dfh_207:not(#\9) {
-  margin: var(--space-scaled-s-eyzx9z, 12px) 0;
-  padding: 0 var(--space-xxs-1wmjb0, 4px);
+.awsui_pagination-button_14rmt_e9gho_207:not(#\9) {
+  margin: var(--space-scaled-s-9q8n2q, 12px) 0;
+  padding: 0 var(--space-xxs-9rrxti, 4px);
   display: flex;
 }
-.awsui_pagination-button-left_14rmt_14dfh_212:not(#\9) {
-  border-right: var(--border-divider-section-width-uu4597, 1px) solid var(--color-border-control-disabled-5bx7s1, #d5dbdb);
+.awsui_pagination-button-left_14rmt_e9gho_212:not(#\9) {
+  border-right: var(--border-divider-section-width-4ozgf3, 1px) solid var(--color-border-control-disabled-4hz3mo, #d5dbdb);
 }
-.awsui_pagination-button-left-scrollable_14rmt_14dfh_215:not(#\9) {
+.awsui_pagination-button-left-scrollable_14rmt_e9gho_215:not(#\9) {
   z-index: 1;
-  box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-1kpk8v, #eaeded), 1px 0px 0px 0px var(--color-border-tabs-shadow-1kpk8v, #eaeded);
+  box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-vlaodw, #eaeded), 1px 0px 0px 0px var(--color-border-tabs-shadow-vlaodw, #eaeded);
 }
-.awsui_pagination-button-right_14rmt_14dfh_219:not(#\9) {
-  border-left: var(--border-divider-section-width-uu4597, 1px) solid var(--color-border-control-disabled-5bx7s1, #d5dbdb);
+.awsui_pagination-button-right_14rmt_e9gho_219:not(#\9) {
+  border-left: var(--border-divider-section-width-4ozgf3, 1px) solid var(--color-border-control-disabled-4hz3mo, #d5dbdb);
 }
-.awsui_pagination-button-right-scrollable_14rmt_14dfh_222:not(#\9) {
+.awsui_pagination-button-right-scrollable_14rmt_e9gho_222:not(#\9) {
   z-index: 1;
-  box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-1kpk8v, #eaeded), -1px 0px 0px 0 var(--color-border-tabs-shadow-1kpk8v, #eaeded);
+  box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-vlaodw, #eaeded), -1px 0px 0px 0 var(--color-border-tabs-shadow-vlaodw, #eaeded);
 }
 
-.awsui_tabs-tab_14rmt_14dfh_227:not(#\9) {
+.awsui_tabs-tab_14rmt_e9gho_227:not(#\9) {
   list-style: none;
   padding: 0;
   flex-shrink: 0;
   display: flex;
-  max-width: calc(90% - var(--space-l-q5p9hz, 20px));
+  max-width: calc(90% - var(--space-l-xu1x80, 20px));
 }
-.awsui_tabs-tab_14rmt_14dfh_227 > button:not(#\9) {
+.awsui_tabs-tab_14rmt_e9gho_227 > button:not(#\9) {
   background-color: transparent;
 }
 
-.awsui_tabs-tab-label_14rmt_14dfh_238:not(#\9) {
+.awsui_tabs-tab-label_14rmt_e9gho_238:not(#\9) {
   display: flex;
   align-items: center;
-  padding: var(--space-scaled-2x-xxs-kfgdvb, 4px) var(--space-l-q5p9hz, 20px);
+  padding: var(--space-scaled-2x-xxs-r5f1ts, 4px) var(--space-l-xu1x80, 20px);
   text-align: left;
   position: relative;
   min-width: 0;
@@ -246,121 +246,121 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   word-break: break-word;
 }
 
-.awsui_tabs-tab_14rmt_14dfh_227:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_14dfh_238, .awsui_tabs-tab_14rmt_14dfh_227:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_14dfh_238 {
-  margin-right: calc(-1 * var(--border-divider-section-width-uu4597, 1px));
-  border-right: var(--border-divider-section-width-uu4597, 1px) solid var(--color-border-tabs-divider-0tx1ii, #aab7b8);
+.awsui_tabs-tab_14rmt_e9gho_227:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_e9gho_238, .awsui_tabs-tab_14rmt_e9gho_227:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_e9gho_238 {
+  margin-right: calc(-1 * var(--border-divider-section-width-4ozgf3, 1px));
+  border-right: var(--border-divider-section-width-4ozgf3, 1px) solid var(--color-border-tabs-divider-xx5u11, #aab7b8);
 }
 
-.awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9) {
+.awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9) {
   position: relative;
   display: flex;
   align-items: stretch;
   text-decoration: none;
   cursor: pointer;
-  padding: calc(var(--space-scaled-s-eyzx9z, 12px) - 1px) 0 var(--space-scaled-s-eyzx9z, 12px) 0;
+  padding: calc(var(--space-scaled-s-9q8n2q, 12px) - 1px) 0 var(--space-scaled-s-9q8n2q, 12px) 0;
   margin-top: 1px;
-  border: var(--border-divider-section-width-uu4597, 1px) solid transparent;
-  font-size: var(--font-tabs-size-6tohqk, 14px);
-  line-height: var(--font-tabs-line-height-lcruno, 22px);
-  font-weight: var(--font-wayfinding-link-active-weight-chnmnu, 700);
-  color: var(--color-text-interactive-default-7wc1ct, #545b64);
-  -webkit-font-smoothing: var(--font-smoothing-webkit-r8w2d6, auto);
-  -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-ypl7oc, auto);
+  border: var(--border-divider-section-width-4ozgf3, 1px) solid transparent;
+  font-size: var(--font-tabs-size-0kyoli, 14px);
+  line-height: var(--font-tabs-line-height-om7l0p, 22px);
+  font-weight: var(--font-wayfinding-link-active-weight-wec2dg, 700);
+  color: var(--color-text-interactive-default-dt26aj, #545b64);
+  -webkit-font-smoothing: var(--font-smoothing-webkit-8fiijr, auto);
+  -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-fw8n0n, auto);
 }
-.awsui_tabs-tab-link_14rmt_14dfh_254.awsui_refresh_14rmt_14dfh_270:not(#\9) {
-  padding: calc(var(--space-static-xs-j5hxr8, 8px) - 1px) 0 var(--space-static-xs-j5hxr8, 8px) 0;
+.awsui_tabs-tab-link_14rmt_e9gho_254.awsui_refresh_14rmt_e9gho_270:not(#\9) {
+  padding: calc(var(--space-static-xs-fdj8ix, 8px) - 1px) 0 var(--space-static-xs-fdj8ix, 8px) 0;
 }
-.awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):hover {
-  color: var(--color-text-accent-qtjwdy, #0073bb);
+.awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):hover {
+  color: var(--color-text-accent-yy9054, #0073bb);
 }
-.awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):focus {
+.awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):focus {
   z-index: 1;
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):focus {
   outline: 2px dotted transparent;
-  outline-offset: calc(var(--space-tabs-focus-outline-gutter-7fxuzv, 0px) - 1px);
+  outline-offset: calc(var(--space-tabs-focus-outline-gutter-2tu8wb, 0px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
-  left: calc(-1 * var(--space-tabs-focus-outline-gutter-7fxuzv, 0px));
-  top: calc(-1 * var(--space-tabs-focus-outline-gutter-7fxuzv, 0px));
-  width: calc(100% + 2 * var(--space-tabs-focus-outline-gutter-7fxuzv, 0px));
-  height: calc(100% + 2 * var(--space-tabs-focus-outline-gutter-7fxuzv, 0px));
-  border-radius: var(--border-radius-control-default-focus-ring-awoa2s, 2px);
-  box-shadow: 0 0 0 2px var(--color-border-item-focused-gjqsnp, #0073bb);
-}
-body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_14dfh_238, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_14dfh_238 {
+  left: calc(-1 * var(--space-tabs-focus-outline-gutter-2tu8wb, 0px));
+  top: calc(-1 * var(--space-tabs-focus-outline-gutter-2tu8wb, 0px));
+  width: calc(100% + 2 * var(--space-tabs-focus-outline-gutter-2tu8wb, 0px));
+  height: calc(100% + 2 * var(--space-tabs-focus-outline-gutter-2tu8wb, 0px));
+  border-radius: var(--border-radius-control-default-focus-ring-a78bgq, 2px);
+  box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
+}
+body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_e9gho_238, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_e9gho_238 {
   border-right-color: transparent;
 }
 
-.awsui_tabs-tab_14rmt_14dfh_227:not(#\9):first-child {
+.awsui_tabs-tab_14rmt_e9gho_227:not(#\9):first-child {
   margin-left: 1px;
 }
-.awsui_tabs-tab_14rmt_14dfh_227:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_14dfh_238, .awsui_tabs-tab_14rmt_14dfh_227:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_14dfh_238 {
-  padding-left: calc(var(--space-l-q5p9hz, 20px) - 1px);
+.awsui_tabs-tab_14rmt_e9gho_227:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_e9gho_238, .awsui_tabs-tab_14rmt_e9gho_227:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_e9gho_238 {
+  padding-left: calc(var(--space-l-xu1x80, 20px) - 1px);
 }
 
-.awsui_tabs-tab_14rmt_14dfh_227:not(#\9):last-child {
+.awsui_tabs-tab_14rmt_e9gho_227:not(#\9):last-child {
   margin-right: 1px;
 }
-.awsui_tabs-tab_14rmt_14dfh_227:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_14dfh_238, .awsui_tabs-tab_14rmt_14dfh_227:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_14dfh_238 {
-  padding-right: calc(var(--space-l-q5p9hz, 20px) - 1px);
+.awsui_tabs-tab_14rmt_e9gho_227:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_e9gho_238, .awsui_tabs-tab_14rmt_e9gho_227:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_e9gho_238 {
+  padding-right: calc(var(--space-l-xu1x80, 20px) - 1px);
 }
 
-.awsui_tabs-tab-disabled_14rmt_14dfh_316:not(#\9), .awsui_tabs-tab-disabled_14rmt_14dfh_316:not(#\9):hover {
+.awsui_tabs-tab-disabled_14rmt_e9gho_316:not(#\9), .awsui_tabs-tab-disabled_14rmt_e9gho_316:not(#\9):hover {
   pointer-events: none;
   cursor: default;
-  color: var(--color-text-interactive-disabled-as5h1g, #aab7b8);
-  font-weight: var(--font-tabs-disabled-weight-1p0jc1, 400);
+  color: var(--color-text-interactive-disabled-e23z4j, #aab7b8);
+  font-weight: var(--font-tabs-disabled-weight-uew17o, 400);
 }
 
-.awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316):after {
+.awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316):after {
   content: "";
   position: absolute;
   left: 0;
   width: 100%;
-  bottom: calc(-1 * var(--border-divider-section-width-uu4597, 1px));
-  height: var(--border-active-width-7je8um, 2px);
-  border-radius: var(--border-radius-tabs-focus-ring-f0b317, 0px);
-  background: var(--color-border-tabs-underline-l8wr4z, #16191f);
+  bottom: calc(-1 * var(--border-divider-section-width-4ozgf3, 1px));
+  height: var(--border-active-width-lk35x8, 2px);
+  border-radius: var(--border-radius-tabs-focus-ring-7k0vsi, 0px);
+  background: var(--color-border-tabs-underline-vxhq31, #16191f);
   opacity: 0;
 }
-.awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316).awsui_refresh_14rmt_14dfh_270:after {
-  transition: opacity var(--motion-duration-refresh-only-medium-1aoout, 165ms) var(--motion-easing-refresh-only-c-n3xy8d, cubic-bezier(0.84, 0, 0.16, 1));
+.awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316).awsui_refresh_14rmt_e9gho_270:after {
+  transition: opacity var(--motion-duration-refresh-only-medium-0rwzu1, 165ms) var(--motion-easing-refresh-only-c-2mltoq, cubic-bezier(0.84, 0, 0.16, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316).awsui_refresh_14rmt_14dfh_270:after {
+  .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316).awsui_refresh_14rmt_e9gho_270:after {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316).awsui_refresh_14rmt_14dfh_270:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316).awsui_refresh_14rmt_14dfh_270:after {
+.awsui-motion-disabled .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316).awsui_refresh_14rmt_e9gho_270:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_e9gho_254:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316).awsui_refresh_14rmt_e9gho_270:after {
   animation: none;
   transition: none;
 }
 
-.awsui_tabs-tab-active_14rmt_14dfh_348:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316) {
-  color: var(--color-text-accent-qtjwdy, #0073bb);
+.awsui_tabs-tab-active_14rmt_e9gho_348:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316) {
+  color: var(--color-text-accent-yy9054, #0073bb);
 }
-.awsui_tabs-tab-active_14rmt_14dfh_348:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_14dfh_316):after {
+.awsui_tabs-tab-active_14rmt_e9gho_348:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_e9gho_316):after {
   opacity: 1;
 }
 
-.awsui_tabs-header-with-divider_14rmt_14dfh_355:not(#\9) {
-  border-bottom: var(--border-divider-section-width-uu4597, 1px) solid var(--color-border-tabs-divider-0tx1ii, #aab7b8);
+.awsui_tabs-header-with-divider_14rmt_e9gho_355:not(#\9) {
+  border-bottom: var(--border-divider-section-width-4ozgf3, 1px) solid var(--color-border-tabs-divider-xx5u11, #aab7b8);
 }
 
-.awsui_root_14rmt_14dfh_359:not(#\9) {
+.awsui_root_14rmt_e9gho_359:not(#\9) {
   /* used in test-utils or tests */
 }
 
-.awsui_tabs_14rmt_14dfh_186:not(#\9) {
+.awsui_tabs_14rmt_e9gho_186:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -390,35 +390,35 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_14dfh_254:not(#\9
   widows: 2;
   word-spacing: normal;
   box-sizing: border-box;
-  font-size: var(--font-body-m-size-q2y4dq, 14px);
-  line-height: var(--font-body-m-line-height-7pedlt, 22px);
-  color: var(--color-text-body-default-rcjsde, #16191f);
+  font-size: var(--font-body-m-size-bf8hby, 14px);
+  line-height: var(--font-body-m-line-height-wmg6vk, 22px);
+  color: var(--color-text-body-default-ki9w9u, #16191f);
   font-weight: 400;
-  font-family: var(--font-family-base-8fp8i6, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
+  font-family: var(--font-family-base-0nmw8v, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
   display: block;
   width: 100%;
 }
 
-.awsui_tabs-content_14rmt_14dfh_378:not(#\9) {
+.awsui_tabs-content_14rmt_e9gho_378:not(#\9) {
   display: none;
 }
 
-.awsui_tabs-content-active_14rmt_14dfh_382:not(#\9) {
+.awsui_tabs-content-active_14rmt_e9gho_382:not(#\9) {
   display: block;
 }
-body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_14dfh_382:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_e9gho_382:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: 2px;
-  border-radius: var(--border-radius-container-2j9fta, 0px);
-  box-shadow: 0 0 0 2px var(--color-border-item-focused-gjqsnp, #0073bb);
+  border-radius: var(--border-radius-container-jm6teg, 0px);
+  box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
 }
 
-.awsui_tabs-content-wrapper_14rmt_14dfh_392.awsui_with-paddings_14rmt_14dfh_392 > .awsui_tabs-content_14rmt_14dfh_378:not(#\9) {
-  padding: var(--space-scaled-m-wu03sm, 16px) 0;
+.awsui_tabs-content-wrapper_14rmt_e9gho_392.awsui_with-paddings_14rmt_e9gho_392 > .awsui_tabs-content_14rmt_e9gho_378:not(#\9) {
+  padding: var(--space-scaled-m-er48cl, 16px) 0;
 }
 
-.awsui_tabs-container-content-wrapper_14rmt_14dfh_396.awsui_with-paddings_14rmt_14dfh_392 > .awsui_tabs-content_14rmt_14dfh_378:not(#\9) {
-  padding: var(--space-tabs-content-top-z1siiv, 16px) var(--space-container-horizontal-67gbm5, 20px) var(--space-scaled-l-udxpzh, 20px);
+.awsui_tabs-container-content-wrapper_14rmt_e9gho_396.awsui_with-paddings_14rmt_e9gho_392 > .awsui_tabs-content_14rmt_e9gho_378:not(#\9) {
+  padding: var(--space-tabs-content-top-53djlo, 16px) var(--space-container-horizontal-oebwqe, 20px) var(--space-scaled-l-08jb88, 20px);
 }

package/lib/internal/template/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_14dfh_186",
-  "tabs-header-list": "awsui_tabs-header-list_14rmt_14dfh_192",
-  "pagination-button": "awsui_pagination-button_14rmt_14dfh_207",
-  "pagination-button-left": "awsui_pagination-button-left_14rmt_14dfh_212",
-  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_14dfh_215",
-  "pagination-button-right": "awsui_pagination-button-right_14rmt_14dfh_219",
-  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_14dfh_222",
-  "tabs-tab": "awsui_tabs-tab_14rmt_14dfh_227",
-  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_14dfh_238",
-  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_14dfh_254",
-  "refresh": "awsui_refresh_14rmt_14dfh_270",
-  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_14dfh_316",
-  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_14dfh_348",
-  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_14dfh_355",
-  "root": "awsui_root_14rmt_14dfh_359",
-  "tabs": "awsui_tabs_14rmt_14dfh_186",
-  "tabs-content": "awsui_tabs-content_14rmt_14dfh_378",
-  "tabs-content-active": "awsui_tabs-content-active_14rmt_14dfh_382",
-  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_14dfh_392",
-  "with-paddings": "awsui_with-paddings_14rmt_14dfh_392",
-  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_14dfh_396"
+  "tabs-header": "awsui_tabs-header_14rmt_e9gho_186",
+  "tabs-header-list": "awsui_tabs-header-list_14rmt_e9gho_192",
+  "pagination-button": "awsui_pagination-button_14rmt_e9gho_207",
+  "pagination-button-left": "awsui_pagination-button-left_14rmt_e9gho_212",
+  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_e9gho_215",
+  "pagination-button-right": "awsui_pagination-button-right_14rmt_e9gho_219",
+  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_e9gho_222",
+  "tabs-tab": "awsui_tabs-tab_14rmt_e9gho_227",
+  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_e9gho_238",
+  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_e9gho_254",
+  "refresh": "awsui_refresh_14rmt_e9gho_270",
+  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_e9gho_316",
+  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_e9gho_348",
+  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_e9gho_355",
+  "root": "awsui_root_14rmt_e9gho_359",
+  "tabs": "awsui_tabs_14rmt_e9gho_186",
+  "tabs-content": "awsui_tabs-content_14rmt_e9gho_378",
+  "tabs-content-active": "awsui_tabs-content-active_14rmt_e9gho_382",
+  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_e9gho_392",
+  "with-paddings": "awsui_with-paddings_14rmt_e9gho_392",
+  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_e9gho_396"
 };
   

package/lib/internal/template/tag-editor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["tag-editor/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAgBlG,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAU9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAS1B,QAAA,MAAM,SAAS,2FAkSd,CAAC;AAGF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["tag-editor/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAelG,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAW9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAS1B,QAAA,MAAM,SAAS,2FAkSd,CAAC;AAGF,eAAe,SAAS,CAAC"}

package/lib/internal/template/tag-editor/index.js

@@ -5,7 +5,6 @@ import React, { useCallback, useImperativeHandle, useLayoutEffect, useMemo, useR
 import clsx from 'clsx';
 import { getBaseProps } from '../internal/base-component';
 import { fireNonCancelableEvent } from '../internal/events';
-import { useStableEventHandler } from '../internal/hooks/use-stable-event-handler';
 import InternalAttributeEditor from '../attribute-editor/internal';
 import InternalStatusIndicator from '../status-indicator/internal';
 import InternalBox from '../box/internal';
@@ -18,6 +17,7 @@ import { applyDisplayName } from '../internal/utils/apply-display-name';
 import useBaseComponent from '../internal/hooks/use-base-component';
 import LiveRegion from '../internal/components/live-region';
 import { useInternalI18n } from '../i18n/context';
+import { useStableCallback } from '@cloudscape-design/component-toolkit/internal';
 const isItemRemovable = ({ tag }) => !tag.markedForRemoval;
 const TagEditor = React.forwardRef((_a, ref) => {
     var _b, _c, _d, _e, _f, _g;
@@ -65,7 +65,7 @@ const TagEditor = React.forwardRef((_a, ref) => {
             (_a = keyInputRefs.current[tags.length]) === null || _a === void 0 ? void 0 : _a.focus();
         };
     };
-    const onRemoveButtonClick = useStableEventHandler(({ detail }) => {
+    const onRemoveButtonClick = useStableCallback(({ detail }) => {
         var _a, _b, _c, _d, _e;
         const existing = tags[detail.itemIndex].existing;
         validateAndFire([
@@ -107,19 +107,19 @@ const TagEditor = React.forwardRef((_a, ref) => {
             }
         }
     });
-    const onKeyChange = useStableEventHandler((value, row) => {
+    const onKeyChange = useStableCallback((value, row) => {
         keyDirtyStateRef.current[row] = true;
         validateAndFire([...tags.slice(0, row), Object.assign(Object.assign({}, tags[row]), { key: value }), ...tags.slice(row + 1)]);
     });
-    const onKeyBlur = useStableEventHandler((row) => {
+    const onKeyBlur = useStableCallback((row) => {
         keyDirtyStateRef.current[row] = true;
         // Force re-render by providing a new array reference
         validateAndFire([...tags]);
     });
-    const onValueChange = useStableEventHandler((value, row) => {
+    const onValueChange = useStableCallback((value, row) => {
         validateAndFire([...tags.slice(0, row), Object.assign(Object.assign({}, tags[row]), { value }), ...tags.slice(row + 1)]);
     });
-    const onUndoRemoval = useStableEventHandler((row) => {
+    const onUndoRemoval = useStableCallback((row) => {
         validateAndFire([...tags.slice(0, row), Object.assign(Object.assign({}, tags[row]), { markedForRemoval: false }), ...tags.slice(row + 1)]);
         focusEventRef.current = () => {
             var _a;