@cloudscape-design/components 3.0.245 → 3.0.247

package/internal/components/filtering-token/styles.scoped.css

@@ -94,12 +94,12 @@ 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_10m3l_jlr8x_97:not(#\9) {
+.awsui_root_10m3l_ujfpz_97:not(#\9) {
   display: flex;
   align-content: stretch;
 }
 
-.awsui_token_10m3l_jlr8x_102:not(#\9) {
+.awsui_token_10m3l_ujfpz_102:not(#\9) {
   border: var(--border-field-width-idlekx, 2px) solid var(--color-border-item-selected-ppkssz, #0972d3);
   display: flex;
   align-items: stretch;
@@ -110,21 +110,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-sizing: border-box;
 }
 
-.awsui_show-operation_10m3l_jlr8x_113:not(#\9) {
+.awsui_show-operation_10m3l_ujfpz_113:not(#\9) {
   border-left: none;
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
 
-.awsui_select_10m3l_jlr8x_119:not(#\9) {
+.awsui_select_10m3l_ujfpz_119:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_token-content_10m3l_jlr8x_123:not(#\9) {
+.awsui_token-content_10m3l_ujfpz_123:not(#\9) {
   padding: var(--space-scaled-xxs-95dhkm, 4px) var(--space-field-horizontal-89h2yr, 12px);
 }
 
-.awsui_dismiss-button_10m3l_jlr8x_127:not(#\9) {
+.awsui_dismiss-button_10m3l_ujfpz_127:not(#\9) {
   width: 30px;
   margin: 0;
   border: none;
@@ -133,14 +133,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background-color: transparent;
   border-left: var(--border-field-width-idlekx, 2px) solid var(--color-border-item-selected-ppkssz, #0972d3);
 }
-.awsui_dismiss-button_10m3l_jlr8x_127[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_dismiss-button_10m3l_ujfpz_127:not(#\9):focus {
   position: relative;
 }
-.awsui_dismiss-button_10m3l_jlr8x_127[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_dismiss-button_10m3l_ujfpz_127:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-filtering-token-dismiss-button-focus-outline-gutter-itb5fd, -5px) - 1px);
 }
-.awsui_dismiss-button_10m3l_jlr8x_127[data-awsui-focus-visible=true]:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_dismiss-button_10m3l_ujfpz_127:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -151,22 +151,22 @@ 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_dismiss-button_10m3l_jlr8x_127:not(#\9):focus {
+.awsui_dismiss-button_10m3l_ujfpz_127:not(#\9):focus {
   outline: none;
   text-decoration: none;
 }
-.awsui_dismiss-button_10m3l_jlr8x_127:not(#\9):hover {
+.awsui_dismiss-button_10m3l_ujfpz_127:not(#\9):hover {
   cursor: pointer;
   color: var(--color-text-interactive-hover-v3lasm, #000716);
 }
 
-.awsui_token-disabled_10m3l_jlr8x_163:not(#\9) {
+.awsui_token-disabled_10m3l_ujfpz_163:not(#\9) {
   border-color: var(--color-border-control-disabled-vx8bco, #d1d5db);
   background-color: var(--color-background-container-content-i8i4a0, #ffffff);
   color: var(--color-text-disabled-a2nkh4, #9ba7b6);
   pointer-events: none;
 }
-.awsui_token-disabled_10m3l_jlr8x_163 > .awsui_dismiss-button_10m3l_jlr8x_127:not(#\9) {
+.awsui_token-disabled_10m3l_ujfpz_163 > .awsui_dismiss-button_10m3l_ujfpz_127:not(#\9) {
   color: var(--color-text-interactive-disabled-3pbb07, #9ba7b6);
   border-color: var(--color-border-control-disabled-vx8bco, #d1d5db);
 }

package/internal/components/filtering-token/styles.selectors.js

@@ -2,12 +2,12 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_10m3l_jlr8x_97",
-  "token": "awsui_token_10m3l_jlr8x_102",
-  "show-operation": "awsui_show-operation_10m3l_jlr8x_113",
-  "select": "awsui_select_10m3l_jlr8x_119",
-  "token-content": "awsui_token-content_10m3l_jlr8x_123",
-  "dismiss-button": "awsui_dismiss-button_10m3l_jlr8x_127",
-  "token-disabled": "awsui_token-disabled_10m3l_jlr8x_163"
+  "root": "awsui_root_10m3l_ujfpz_97",
+  "token": "awsui_token_10m3l_ujfpz_102",
+  "show-operation": "awsui_show-operation_10m3l_ujfpz_113",
+  "select": "awsui_select_10m3l_ujfpz_119",
+  "token-content": "awsui_token-content_10m3l_ujfpz_123",
+  "dismiss-button": "awsui_dismiss-button_10m3l_ujfpz_127",
+  "token-disabled": "awsui_token-disabled_10m3l_ujfpz_163"
 };
   

package/internal/components/menu-dropdown/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/menu-dropdown/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AASrE,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B,eAAO,MAAM,aAAa,gFAuDzB,CAAC;AAEF,QAAA,MAAM,YAAY,+FAUf,iBAAiB,gBAgCnB,CAAC;AAGF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/menu-dropdown/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAQrE,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B,eAAO,MAAM,aAAa,gFAqDzB,CAAC;AAEF,QAAA,MAAM,YAAY,+FAUf,iBAAiB,gBAgCnB,CAAC;AAGF,eAAe,YAAY,CAAC"}

package/internal/components/menu-dropdown/index.js

@@ -5,18 +5,16 @@ import clsx from 'clsx';
 import React from 'react';
 import { getBaseProps } from '../../base-component';
 import { applyDisplayName } from '../../utils/apply-display-name';
-import useFocusVisible from '../../hooks/focus-visible';
 import InternalButtonDropdown from '../../../button-dropdown/internal';
 import InternalIcon from '../../../icon/internal';
 import buttonDropdownStyles from '../../../button-dropdown/styles.css.js';
 import styles from './styles.css.js';
 export const ButtonTrigger = React.forwardRef(({ iconName, iconUrl, iconAlt, iconSvg, badge, ariaLabel, offsetRight, disabled, expanded, children, onClick, }, ref) => {
-    const focusVisible = useFocusVisible();
     const hasIcon = iconName || iconUrl || iconSvg;
-    return (React.createElement("button", Object.assign({}, focusVisible, { ref: ref, type: "button", className: clsx(styles.button, styles[`offset-right-${offsetRight}`], { [styles.expanded]: expanded }), "aria-label": ariaLabel, "aria-expanded": !!expanded, "aria-haspopup": true, disabled: disabled, onClick: event => {
+    return (React.createElement("button", { ref: ref, type: "button", className: clsx(styles.button, styles[`offset-right-${offsetRight}`], { [styles.expanded]: expanded }), "aria-label": ariaLabel, "aria-expanded": !!expanded, "aria-haspopup": true, disabled: disabled, onClick: event => {
             event.preventDefault();
             onClick && onClick();
-        } }),
+        } },
         hasIcon && (React.createElement(InternalIcon, { className: styles.icon, name: iconName, url: iconUrl, alt: iconAlt, svg: iconSvg, badge: badge })),
         children && React.createElement("span", { className: styles.text }, children),
         children && (React.createElement(InternalIcon, { name: "caret-down-filled", className: expanded ? buttonDropdownStyles['rotate-up'] : buttonDropdownStyles['rotate-down'] }))));

package/internal/components/menu-dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/menu-dropdown/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\n\nimport { MenuDropdownProps, ButtonTriggerProps } from './interfaces';\nimport { getBaseProps } from '../../base-component';\nimport { applyDisplayName } from '../../utils/apply-display-name';\nimport useFocusVisible from '../../hooks/focus-visible';\nimport InternalButtonDropdown from '../../../button-dropdown/internal';\nimport InternalIcon from '../../../icon/internal';\nimport buttonDropdownStyles from '../../../button-dropdown/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { MenuDropdownProps };\n\nexport const ButtonTrigger = React.forwardRef(\n  (\n    {\n      iconName,\n      iconUrl,\n      iconAlt,\n      iconSvg,\n      badge,\n      ariaLabel,\n      offsetRight,\n      disabled,\n      expanded,\n      children,\n      onClick,\n    }: ButtonTriggerProps,\n    ref: React.Ref<any>\n  ) => {\n    const focusVisible = useFocusVisible();\n    const hasIcon = iconName || iconUrl || iconSvg;\n\n    return (\n      <button\n        {...focusVisible}\n        ref={ref}\n        type=\"button\"\n        className={clsx(styles.button, styles[`offset-right-${offsetRight}`], { [styles.expanded]: expanded })}\n        aria-label={ariaLabel}\n        aria-expanded={!!expanded}\n        aria-haspopup={true}\n        disabled={disabled}\n        onClick={event => {\n          event.preventDefault();\n          onClick && onClick();\n        }}\n      >\n        {hasIcon && (\n          <InternalIcon\n            className={styles.icon}\n            name={iconName}\n            url={iconUrl}\n            alt={iconAlt}\n            svg={iconSvg}\n            badge={badge}\n          />\n        )}\n        {children && <span className={styles.text}>{children}</span>}\n        {children && (\n          <InternalIcon\n            name=\"caret-down-filled\"\n            className={expanded ? buttonDropdownStyles['rotate-up'] : buttonDropdownStyles['rotate-down']}\n          />\n        )}\n      </button>\n    );\n  }\n);\n\nconst MenuDropdown = ({\n  iconName,\n  iconUrl,\n  iconAlt,\n  iconSvg,\n  badge,\n  ariaLabel,\n  offsetRight,\n  children,\n  ...props\n}: MenuDropdownProps) => {\n  const baseProps = getBaseProps(props);\n\n  const dropdownTrigger = (clickHandler: () => void, ref: React.Ref<any>, isDisabled: boolean, isExpanded: boolean) => {\n    return (\n      <ButtonTrigger\n        ref={ref}\n        disabled={isDisabled}\n        expanded={isExpanded}\n        iconName={iconName}\n        iconUrl={iconUrl}\n        iconAlt={iconAlt}\n        iconSvg={iconSvg}\n        badge={badge}\n        ariaLabel={ariaLabel}\n        offsetRight={offsetRight}\n        onClick={clickHandler}\n      >\n        {children}\n      </ButtonTrigger>\n    );\n  };\n\n  return (\n    <InternalButtonDropdown\n      {...baseProps}\n      {...props}\n      variant=\"navigation\"\n      customTriggerBuilder={dropdownTrigger}\n      preferCenter={true}\n    />\n  );\n};\n\napplyDisplayName(MenuDropdown, 'MenuDropdown');\nexport default MenuDropdown;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/menu-dropdown/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\n\nimport { MenuDropdownProps, ButtonTriggerProps } from './interfaces';\nimport { getBaseProps } from '../../base-component';\nimport { applyDisplayName } from '../../utils/apply-display-name';\nimport InternalButtonDropdown from '../../../button-dropdown/internal';\nimport InternalIcon from '../../../icon/internal';\nimport buttonDropdownStyles from '../../../button-dropdown/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { MenuDropdownProps };\n\nexport const ButtonTrigger = React.forwardRef(\n  (\n    {\n      iconName,\n      iconUrl,\n      iconAlt,\n      iconSvg,\n      badge,\n      ariaLabel,\n      offsetRight,\n      disabled,\n      expanded,\n      children,\n      onClick,\n    }: ButtonTriggerProps,\n    ref: React.Ref<any>\n  ) => {\n    const hasIcon = iconName || iconUrl || iconSvg;\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={clsx(styles.button, styles[`offset-right-${offsetRight}`], { [styles.expanded]: expanded })}\n        aria-label={ariaLabel}\n        aria-expanded={!!expanded}\n        aria-haspopup={true}\n        disabled={disabled}\n        onClick={event => {\n          event.preventDefault();\n          onClick && onClick();\n        }}\n      >\n        {hasIcon && (\n          <InternalIcon\n            className={styles.icon}\n            name={iconName}\n            url={iconUrl}\n            alt={iconAlt}\n            svg={iconSvg}\n            badge={badge}\n          />\n        )}\n        {children && <span className={styles.text}>{children}</span>}\n        {children && (\n          <InternalIcon\n            name=\"caret-down-filled\"\n            className={expanded ? buttonDropdownStyles['rotate-up'] : buttonDropdownStyles['rotate-down']}\n          />\n        )}\n      </button>\n    );\n  }\n);\n\nconst MenuDropdown = ({\n  iconName,\n  iconUrl,\n  iconAlt,\n  iconSvg,\n  badge,\n  ariaLabel,\n  offsetRight,\n  children,\n  ...props\n}: MenuDropdownProps) => {\n  const baseProps = getBaseProps(props);\n\n  const dropdownTrigger = (clickHandler: () => void, ref: React.Ref<any>, isDisabled: boolean, isExpanded: boolean) => {\n    return (\n      <ButtonTrigger\n        ref={ref}\n        disabled={isDisabled}\n        expanded={isExpanded}\n        iconName={iconName}\n        iconUrl={iconUrl}\n        iconAlt={iconAlt}\n        iconSvg={iconSvg}\n        badge={badge}\n        ariaLabel={ariaLabel}\n        offsetRight={offsetRight}\n        onClick={clickHandler}\n      >\n        {children}\n      </ButtonTrigger>\n    );\n  };\n\n  return (\n    <InternalButtonDropdown\n      {...baseProps}\n      {...props}\n      variant=\"navigation\"\n      customTriggerBuilder={dropdownTrigger}\n      preferCenter={true}\n    />\n  );\n};\n\napplyDisplayName(MenuDropdown, 'MenuDropdown');\nexport default MenuDropdown;\n"]}

package/internal/components/menu-dropdown/styles.css.js

@@ -1,12 +1,12 @@
 
     import './styles.scoped.css';
     export default {
-  "button": "awsui_button_m5h9f_5k6gw_93",
-  "expanded": "awsui_expanded_m5h9f_5k6gw_127",
-  "offset-right-none": "awsui_offset-right-none_m5h9f_5k6gw_138",
-  "offset-right-l": "awsui_offset-right-l_m5h9f_5k6gw_141",
-  "offset-right-xxl": "awsui_offset-right-xxl_m5h9f_5k6gw_144",
-  "text": "awsui_text_m5h9f_5k6gw_166",
-  "icon": "awsui_icon_m5h9f_5k6gw_170"
+  "button": "awsui_button_m5h9f_1yya9_93",
+  "expanded": "awsui_expanded_m5h9f_1yya9_127",
+  "offset-right-none": "awsui_offset-right-none_m5h9f_1yya9_138",
+  "offset-right-l": "awsui_offset-right-l_m5h9f_1yya9_141",
+  "offset-right-xxl": "awsui_offset-right-xxl_m5h9f_1yya9_144",
+  "text": "awsui_text_m5h9f_1yya9_166",
+  "icon": "awsui_icon_m5h9f_1yya9_170"
 };
   

package/internal/components/menu-dropdown/styles.scoped.css

@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_button_m5h9f_5k6gw_93:not(#\9) {
+.awsui_button_m5h9f_1yya9_93:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -146,38 +146,38 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background: transparent;
   color: var(--color-text-interactive-default-eg5fsa, #414d5c);
 }
-.awsui_button_m5h9f_5k6gw_93:not(#\9):hover {
+.awsui_button_m5h9f_1yya9_93:not(#\9):hover {
   color: var(--color-text-interactive-hover-v3lasm, #000716);
   text-decoration: none;
 }
-.awsui_button_m5h9f_5k6gw_93:not(#\9):active, .awsui_button_m5h9f_5k6gw_93.awsui_expanded_m5h9f_5k6gw_127:not(#\9) {
+.awsui_button_m5h9f_1yya9_93:not(#\9):active, .awsui_button_m5h9f_1yya9_93.awsui_expanded_m5h9f_1yya9_127:not(#\9) {
   background: transparent;
   color: var(--color-text-interactive-active-vol84d, #000716);
 }
-.awsui_button_m5h9f_5k6gw_93.awsui_expanded_m5h9f_5k6gw_127:not(#\9) {
+.awsui_button_m5h9f_1yya9_93.awsui_expanded_m5h9f_1yya9_127:not(#\9) {
   color: var(--color-text-accent-s1eqko, #0972d3);
 }
-.awsui_button_m5h9f_5k6gw_93:not(#\9):focus {
+.awsui_button_m5h9f_1yya9_93:not(#\9):focus {
   outline: none;
   text-decoration: none;
 }
-.awsui_button_m5h9f_5k6gw_93.awsui_offset-right-none_m5h9f_5k6gw_138:not(#\9) {
+.awsui_button_m5h9f_1yya9_93.awsui_offset-right-none_m5h9f_1yya9_138:not(#\9) {
   margin-right: 0;
 }
-.awsui_button_m5h9f_5k6gw_93.awsui_offset-right-l_m5h9f_5k6gw_141:not(#\9) {
+.awsui_button_m5h9f_1yya9_93.awsui_offset-right-l_m5h9f_1yya9_141:not(#\9) {
   margin-right: var(--space-s-hv8c1d, 12px);
 }
-.awsui_button_m5h9f_5k6gw_93.awsui_offset-right-xxl_m5h9f_5k6gw_144:not(#\9) {
+.awsui_button_m5h9f_1yya9_93.awsui_offset-right-xxl_m5h9f_1yya9_144:not(#\9) {
   margin-right: var(--space-xl-a39hup, 24px);
 }
-.awsui_button_m5h9f_5k6gw_93[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_button_m5h9f_1yya9_93:not(#\9):focus {
   position: relative;
 }
-.awsui_button_m5h9f_5k6gw_93[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_button_m5h9f_1yya9_93:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(-1px - 1px);
 }
-.awsui_button_m5h9f_5k6gw_93[data-awsui-focus-visible=true]:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_button_m5h9f_1yya9_93:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -189,10 +189,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
 }
 
-.awsui_text_m5h9f_5k6gw_166:not(#\9) {
+.awsui_text_m5h9f_1yya9_166:not(#\9) {
   margin-right: var(--space-xs-rsr2qu, 8px);
 }
 
-.awsui_icon_m5h9f_5k6gw_170 + .awsui_text_m5h9f_5k6gw_166:not(#\9) {
+.awsui_icon_m5h9f_1yya9_170 + .awsui_text_m5h9f_1yya9_166:not(#\9) {
   margin-left: var(--space-xs-rsr2qu, 8px);
 }

package/internal/components/menu-dropdown/styles.selectors.js

@@ -2,12 +2,12 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "button": "awsui_button_m5h9f_5k6gw_93",
-  "expanded": "awsui_expanded_m5h9f_5k6gw_127",
-  "offset-right-none": "awsui_offset-right-none_m5h9f_5k6gw_138",
-  "offset-right-l": "awsui_offset-right-l_m5h9f_5k6gw_141",
-  "offset-right-xxl": "awsui_offset-right-xxl_m5h9f_5k6gw_144",
-  "text": "awsui_text_m5h9f_5k6gw_166",
-  "icon": "awsui_icon_m5h9f_5k6gw_170"
+  "button": "awsui_button_m5h9f_1yya9_93",
+  "expanded": "awsui_expanded_m5h9f_1yya9_127",
+  "offset-right-none": "awsui_offset-right-none_m5h9f_1yya9_138",
+  "offset-right-l": "awsui_offset-right-l_m5h9f_1yya9_141",
+  "offset-right-xxl": "awsui_offset-right-xxl_m5h9f_1yya9_144",
+  "text": "awsui_text_m5h9f_1yya9_166",
+  "icon": "awsui_icon_m5h9f_1yya9_170"
 };
   

package/internal/components/token-list/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { TokenListProps } from './interfaces';
-export default function TokenList<Item>({ items, alignment, renderItem, itemAttributes, limit, after, i18nStrings, removedItemIndex, }: TokenListProps<Item>): JSX.Element;
+export default function TokenList<Item>({ items, alignment, renderItem, limit, after, i18nStrings, removedItemIndex, }: TokenListProps<Item>): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/internal/components/token-list/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/token-list/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,IAAI,EAAE,EACtC,KAAK,EACL,SAAS,EACT,UAAU,EACV,cAAc,EACd,KAAK,EACL,KAAK,EACL,WAAW,EACX,gBAAgB,GACjB,EAAE,cAAc,CAAC,IAAI,CAAC,eAqEtB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/token-list/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,IAAI,EAAE,EACtC,KAAK,EACL,SAAS,EACT,UAAU,EACV,KAAK,EACL,KAAK,EACL,WAAW,EACX,gBAAgB,GACjB,EAAE,cAAc,CAAC,IAAI,CAAC,eAmEtB"}

package/internal/components/token-list/index.js

@@ -6,7 +6,7 @@ import styles from './styles.css.js';
 import { useUniqueId } from '../../hooks/use-unique-id';
 import clsx from 'clsx';
 import { useTokenFocusController } from './token-focus-controller';
-export default function TokenList({ items, alignment, renderItem, itemAttributes, limit, after, i18nStrings, removedItemIndex, }) {
+export default function TokenList({ items, alignment, renderItem, limit, after, i18nStrings, removedItemIndex, }) {
     const tokenListRef = useTokenFocusController({ removedItemIndex });
     const controlId = useUniqueId();
     const [expanded, setExpanded] = useState(false);
@@ -18,13 +18,13 @@ export default function TokenList({ items, alignment, renderItem, itemAttributes
         React.createElement(TokenLimitToggle, { controlId: hasVisibleItems ? controlId : undefined, allHidden: limit === 0, expanded: expanded, numberOfHiddenOptions: items.length - visibleItems.length, i18nStrings: i18nStrings, onClick: () => setExpanded(!expanded) }))) : null;
     if (alignment === 'inline') {
         return (React.createElement("div", { ref: tokenListRef, className: clsx(styles.root, styles.horizontal) },
-            hasItems && (React.createElement("ul", { id: controlId, className: styles.list }, visibleItems.map((item, itemIndex) => (React.createElement("li", Object.assign({ key: itemIndex, className: styles['list-item'] }, itemAttributes === null || itemAttributes === void 0 ? void 0 : itemAttributes(item, itemIndex), { "aria-setsize": items.length, "aria-posinset": itemIndex + 1 }), renderItem(item, itemIndex)))))),
+            hasItems && (React.createElement("ul", { id: controlId, className: styles.list }, visibleItems.map((item, itemIndex) => (React.createElement("li", { key: itemIndex, className: styles['list-item'], "aria-setsize": items.length, "aria-posinset": itemIndex + 1 }, renderItem(item, itemIndex)))))),
             toggle,
             after && React.createElement("div", { className: styles.separator }),
             after));
     }
     return (React.createElement("div", { ref: tokenListRef, className: clsx(styles.root, styles.vertical) },
-        hasVisibleItems && (React.createElement("ul", { id: controlId, className: clsx(styles.list, styles[alignment]) }, visibleItems.map((item, itemIndex) => (React.createElement("li", Object.assign({ key: itemIndex, className: styles['list-item'] }, itemAttributes === null || itemAttributes === void 0 ? void 0 : itemAttributes(item, itemIndex), { "aria-setsize": items.length, "aria-posinset": itemIndex + 1 }), renderItem(item, itemIndex)))))),
+        hasVisibleItems && (React.createElement("ul", { id: controlId, className: clsx(styles.list, styles[alignment]) }, visibleItems.map((item, itemIndex) => (React.createElement("li", { key: itemIndex, className: styles['list-item'], "aria-setsize": items.length, "aria-posinset": itemIndex + 1 }, renderItem(item, itemIndex)))))),
         toggle,
         after));
 }

package/internal/components/token-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/token-list/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useState } from 'react';\n\nimport TokenLimitToggle from './token-limit-toggle';\nimport styles from './styles.css.js';\nimport { TokenListProps } from './interfaces';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport clsx from 'clsx';\nimport { useTokenFocusController } from './token-focus-controller';\n\nexport default function TokenList<Item>({\n  items,\n  alignment,\n  renderItem,\n  itemAttributes,\n  limit,\n  after,\n  i18nStrings,\n  removedItemIndex,\n}: TokenListProps<Item>) {\n  const tokenListRef = useTokenFocusController({ removedItemIndex });\n  const controlId = useUniqueId();\n\n  const [expanded, setExpanded] = useState(false);\n  const hasItems = items.length > 0;\n  const hasHiddenItems = hasItems && limit !== undefined && items.length > limit;\n  const visibleItems = hasHiddenItems && !expanded ? items.slice(0, limit) : items;\n  const hasVisibleItems = visibleItems.length > 0;\n\n  const toggle = hasHiddenItems ? (\n    <div className={styles[`toggle-container-${alignment}`]}>\n      <TokenLimitToggle\n        controlId={hasVisibleItems ? controlId : undefined}\n        allHidden={limit === 0}\n        expanded={expanded}\n        numberOfHiddenOptions={items.length - visibleItems.length}\n        i18nStrings={i18nStrings}\n        onClick={() => setExpanded(!expanded)}\n      />\n    </div>\n  ) : null;\n\n  if (alignment === 'inline') {\n    return (\n      <div ref={tokenListRef} className={clsx(styles.root, styles.horizontal)}>\n        {hasItems && (\n          <ul id={controlId} className={styles.list}>\n            {visibleItems.map((item, itemIndex) => (\n              <li\n                key={itemIndex}\n                className={styles['list-item']}\n                {...itemAttributes?.(item, itemIndex)}\n                aria-setsize={items.length}\n                aria-posinset={itemIndex + 1}\n              >\n                {renderItem(item, itemIndex)}\n              </li>\n            ))}\n          </ul>\n        )}\n        {toggle}\n        {after && <div className={styles.separator} />}\n        {after}\n      </div>\n    );\n  }\n\n  return (\n    <div ref={tokenListRef} className={clsx(styles.root, styles.vertical)}>\n      {hasVisibleItems && (\n        <ul id={controlId} className={clsx(styles.list, styles[alignment])}>\n          {visibleItems.map((item, itemIndex) => (\n            <li\n              key={itemIndex}\n              className={styles['list-item']}\n              {...itemAttributes?.(item, itemIndex)}\n              aria-setsize={items.length}\n              aria-posinset={itemIndex + 1}\n            >\n              {renderItem(item, itemIndex)}\n            </li>\n          ))}\n        </ul>\n      )}\n      {toggle}\n      {after}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/token-list/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useState } from 'react';\n\nimport TokenLimitToggle from './token-limit-toggle';\nimport styles from './styles.css.js';\nimport { TokenListProps } from './interfaces';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport clsx from 'clsx';\nimport { useTokenFocusController } from './token-focus-controller';\n\nexport default function TokenList<Item>({\n  items,\n  alignment,\n  renderItem,\n  limit,\n  after,\n  i18nStrings,\n  removedItemIndex,\n}: TokenListProps<Item>) {\n  const tokenListRef = useTokenFocusController({ removedItemIndex });\n  const controlId = useUniqueId();\n\n  const [expanded, setExpanded] = useState(false);\n  const hasItems = items.length > 0;\n  const hasHiddenItems = hasItems && limit !== undefined && items.length > limit;\n  const visibleItems = hasHiddenItems && !expanded ? items.slice(0, limit) : items;\n  const hasVisibleItems = visibleItems.length > 0;\n\n  const toggle = hasHiddenItems ? (\n    <div className={styles[`toggle-container-${alignment}`]}>\n      <TokenLimitToggle\n        controlId={hasVisibleItems ? controlId : undefined}\n        allHidden={limit === 0}\n        expanded={expanded}\n        numberOfHiddenOptions={items.length - visibleItems.length}\n        i18nStrings={i18nStrings}\n        onClick={() => setExpanded(!expanded)}\n      />\n    </div>\n  ) : null;\n\n  if (alignment === 'inline') {\n    return (\n      <div ref={tokenListRef} className={clsx(styles.root, styles.horizontal)}>\n        {hasItems && (\n          <ul id={controlId} className={styles.list}>\n            {visibleItems.map((item, itemIndex) => (\n              <li\n                key={itemIndex}\n                className={styles['list-item']}\n                aria-setsize={items.length}\n                aria-posinset={itemIndex + 1}\n              >\n                {renderItem(item, itemIndex)}\n              </li>\n            ))}\n          </ul>\n        )}\n        {toggle}\n        {after && <div className={styles.separator} />}\n        {after}\n      </div>\n    );\n  }\n\n  return (\n    <div ref={tokenListRef} className={clsx(styles.root, styles.vertical)}>\n      {hasVisibleItems && (\n        <ul id={controlId} className={clsx(styles.list, styles[alignment])}>\n          {visibleItems.map((item, itemIndex) => (\n            <li\n              key={itemIndex}\n              className={styles['list-item']}\n              aria-setsize={items.length}\n              aria-posinset={itemIndex + 1}\n            >\n              {renderItem(item, itemIndex)}\n            </li>\n          ))}\n        </ul>\n      )}\n      {toggle}\n      {after}\n    </div>\n  );\n}\n"]}

package/internal/components/token-list/interfaces.d.ts

@@ -5,7 +5,6 @@ export interface TokenListProps<Item> {
     limit?: number;
     after?: React.ReactNode;
     renderItem: (item: Item, itemIndex: number) => React.ReactNode;
-    itemAttributes?: (item: Item, itemIndex: number) => React.HTMLAttributes<HTMLLIElement>;
     i18nStrings?: I18nStrings;
     removedItemIndex?: null | number;
 }

package/internal/components/token-list/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["internal/components/token-list/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,cAAc,CAAC,IAAI;IAClC,SAAS,EAAE,UAAU,GAAG,YAAY,GAAG,QAAQ,CAAC;IAChD,KAAK,EAAE,SAAS,IAAI,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/D,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;IACxF,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;CAClC;AAED,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["internal/components/token-list/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,cAAc,CAAC,IAAI;IAClC,SAAS,EAAE,UAAU,GAAG,YAAY,GAAG,QAAQ,CAAC;IAChD,KAAK,EAAE,SAAS,IAAI,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/D,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,gBAAgB,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;CAClC;AAED,MAAM,WAAW,WAAW;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB"}

package/internal/components/token-list/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["internal/components/token-list/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\n\nexport interface TokenListProps<Item> {\n  alignment: 'vertical' | 'horizontal' | 'inline';\n  items: readonly Item[];\n  limit?: number;\n  after?: React.ReactNode;\n  renderItem: (item: Item, itemIndex: number) => React.ReactNode;\n  itemAttributes?: (item: Item, itemIndex: number) => React.HTMLAttributes<HTMLLIElement>;\n  i18nStrings?: I18nStrings;\n  removedItemIndex?: null | number;\n}\n\nexport interface I18nStrings {\n  limitShowFewer?: string;\n  limitShowMore?: string;\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["internal/components/token-list/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\n\nexport interface TokenListProps<Item> {\n  alignment: 'vertical' | 'horizontal' | 'inline';\n  items: readonly Item[];\n  limit?: number;\n  after?: React.ReactNode;\n  renderItem: (item: Item, itemIndex: number) => React.ReactNode;\n  i18nStrings?: I18nStrings;\n  removedItemIndex?: null | number;\n}\n\nexport interface I18nStrings {\n  limitShowFewer?: string;\n  limitShowMore?: string;\n}\n"]}

package/internal/components/token-list/styles.css.js

@@ -1,14 +1,14 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_gfwv3_bhz29_93",
-  "horizontal": "awsui_horizontal_gfwv3_bhz29_98",
-  "vertical": "awsui_vertical_gfwv3_bhz29_102",
-  "list": "awsui_list_gfwv3_bhz29_106",
-  "list-item": "awsui_list-item_gfwv3_bhz29_124",
-  "toggle-container-inline": "awsui_toggle-container-inline_gfwv3_bhz29_128",
-  "toggle": "awsui_toggle_gfwv3_bhz29_128",
-  "description": "awsui_description_gfwv3_bhz29_196",
-  "separator": "awsui_separator_gfwv3_bhz29_200"
+  "root": "awsui_root_gfwv3_sgio_93",
+  "horizontal": "awsui_horizontal_gfwv3_sgio_98",
+  "vertical": "awsui_vertical_gfwv3_sgio_102",
+  "list": "awsui_list_gfwv3_sgio_106",
+  "list-item": "awsui_list-item_gfwv3_sgio_124",
+  "toggle-container-inline": "awsui_toggle-container-inline_gfwv3_sgio_128",
+  "toggle": "awsui_toggle_gfwv3_sgio_128",
+  "description": "awsui_description_gfwv3_sgio_196",
+  "separator": "awsui_separator_gfwv3_sgio_200"
 };
   

package/internal/components/token-list/styles.scoped.css

@@ -90,48 +90,48 @@ 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_gfwv3_bhz29_93:not(#\9) {
+.awsui_root_gfwv3_sgio_93:not(#\9) {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-scaled-xs-6859qs, 8px);
 }
-.awsui_root_gfwv3_bhz29_93.awsui_horizontal_gfwv3_bhz29_98:not(#\9) {
+.awsui_root_gfwv3_sgio_93.awsui_horizontal_gfwv3_sgio_98:not(#\9) {
   gap: var(--space-xs-rsr2qu, 8px);
   flex-direction: row;
 }
-.awsui_root_gfwv3_bhz29_93.awsui_vertical_gfwv3_bhz29_102:not(#\9) {
+.awsui_root_gfwv3_sgio_93.awsui_vertical_gfwv3_sgio_102:not(#\9) {
   flex-direction: column;
 }
 
-.awsui_list_gfwv3_bhz29_106:not(#\9) {
+.awsui_list_gfwv3_sgio_106:not(#\9) {
   display: contents;
   list-style: none;
   padding: 0;
   margin: 0;
 }
-.awsui_list_gfwv3_bhz29_106.awsui_horizontal_gfwv3_bhz29_98:not(#\9), .awsui_list_gfwv3_bhz29_106.awsui_vertical_gfwv3_bhz29_102:not(#\9) {
+.awsui_list_gfwv3_sgio_106.awsui_horizontal_gfwv3_sgio_98:not(#\9), .awsui_list_gfwv3_sgio_106.awsui_vertical_gfwv3_sgio_102:not(#\9) {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-xs-rsr2qu, 8px);
 }
-.awsui_list_gfwv3_bhz29_106.awsui_horizontal_gfwv3_bhz29_98:not(#\9) {
+.awsui_list_gfwv3_sgio_106.awsui_horizontal_gfwv3_sgio_98:not(#\9) {
   flex-direction: row;
 }
-.awsui_list_gfwv3_bhz29_106.awsui_vertical_gfwv3_bhz29_102:not(#\9) {
+.awsui_list_gfwv3_sgio_106.awsui_vertical_gfwv3_sgio_102:not(#\9) {
   flex-direction: column;
 }
 
-.awsui_list-item_gfwv3_bhz29_124:not(#\9) {
+.awsui_list-item_gfwv3_sgio_124:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_toggle-container-inline_gfwv3_bhz29_128:not(#\9) {
+.awsui_toggle-container-inline_gfwv3_sgio_128:not(#\9) {
   padding-left: var(--space-xs-rsr2qu, 8px);
   display: flex;
   align-items: center;
 }
 
-.awsui_toggle_gfwv3_bhz29_128:not(#\9) {
+.awsui_toggle_gfwv3_sgio_128:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -186,46 +186,46 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-left: -1px;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_toggle_gfwv3_bhz29_128:not(#\9) {
+  .awsui_toggle_gfwv3_sgio_128:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_toggle_gfwv3_bhz29_128:not(#\9), .awsui-mode-entering .awsui_toggle_gfwv3_bhz29_128:not(#\9) {
+.awsui-motion-disabled .awsui_toggle_gfwv3_sgio_128:not(#\9), .awsui-mode-entering .awsui_toggle_gfwv3_sgio_128:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_toggle_gfwv3_bhz29_128:not(#\9):hover {
+.awsui_toggle_gfwv3_sgio_128:not(#\9):hover {
   cursor: pointer;
   color: var(--color-text-link-hover-kololx, #033160);
 }
-.awsui_toggle_gfwv3_bhz29_128:not(#\9):focus {
+.awsui_toggle_gfwv3_sgio_128:not(#\9):focus {
   outline: none;
 }
-.awsui_toggle_gfwv3_bhz29_128:not(#\9):active {
+.awsui_toggle_gfwv3_sgio_128:not(#\9):active {
   color: var(--color-text-link-hover-kololx, #033160);
 }
-.awsui_toggle_gfwv3_bhz29_128:not(#\9):active, .awsui_toggle_gfwv3_bhz29_128:not(#\9):focus, .awsui_toggle_gfwv3_bhz29_128:not(#\9):hover {
+.awsui_toggle_gfwv3_sgio_128:not(#\9):active, .awsui_toggle_gfwv3_sgio_128:not(#\9):focus, .awsui_toggle_gfwv3_sgio_128:not(#\9):hover {
   text-decoration: underline;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   text-decoration-color: currentColor;
 }
-.awsui_toggle_gfwv3_bhz29_128:not(#\9):active, .awsui_toggle_gfwv3_bhz29_128:not(#\9):focus, .awsui_toggle_gfwv3_bhz29_128:not(#\9):hover {
+.awsui_toggle_gfwv3_sgio_128:not(#\9):active, .awsui_toggle_gfwv3_sgio_128:not(#\9):focus, .awsui_toggle_gfwv3_sgio_128:not(#\9):hover {
   text-decoration: none;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   text-decoration-color: transparent;
 }
-.awsui_toggle_gfwv3_bhz29_128[data-awsui-focus-visible=true]:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_toggle_gfwv3_sgio_128:not(#\9):focus {
   outline: 2px dotted transparent;
   border: var(--border-field-width-idlekx, 2px) solid var(--color-border-item-focused-ap3b6s, #0972d3);
   border-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
   box-shadow: 0 0 0 var(--border-control-focus-ring-shadow-spread-srzyiu, 0px) var(--color-border-item-focused-ap3b6s, #0972d3);
 }
-.awsui_toggle_gfwv3_bhz29_128 > .awsui_description_gfwv3_bhz29_196:not(#\9) {
+.awsui_toggle_gfwv3_sgio_128 > .awsui_description_gfwv3_sgio_196:not(#\9) {
   margin-left: var(--space-xxs-ynfts5, 4px);
 }
 
-.awsui_separator_gfwv3_bhz29_200:not(#\9) {
+.awsui_separator_gfwv3_sgio_200:not(#\9) {
   margin: 0px var(--space-scaled-m-pv0fmt, 16px);
   width: var(--border-divider-section-width-4wm2it, 2px);
   background-color: var(--color-border-divider-default-7s2wjw, #e9ebed);

package/internal/components/token-list/styles.selectors.js

@@ -2,14 +2,14 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_gfwv3_bhz29_93",
-  "horizontal": "awsui_horizontal_gfwv3_bhz29_98",
-  "vertical": "awsui_vertical_gfwv3_bhz29_102",
-  "list": "awsui_list_gfwv3_bhz29_106",
-  "list-item": "awsui_list-item_gfwv3_bhz29_124",
-  "toggle-container-inline": "awsui_toggle-container-inline_gfwv3_bhz29_128",
-  "toggle": "awsui_toggle_gfwv3_bhz29_128",
-  "description": "awsui_description_gfwv3_bhz29_196",
-  "separator": "awsui_separator_gfwv3_bhz29_200"
+  "root": "awsui_root_gfwv3_sgio_93",
+  "horizontal": "awsui_horizontal_gfwv3_sgio_98",
+  "vertical": "awsui_vertical_gfwv3_sgio_102",
+  "list": "awsui_list_gfwv3_sgio_106",
+  "list-item": "awsui_list-item_gfwv3_sgio_124",
+  "toggle-container-inline": "awsui_toggle-container-inline_gfwv3_sgio_128",
+  "toggle": "awsui_toggle_gfwv3_sgio_128",
+  "description": "awsui_description_gfwv3_sgio_196",
+  "separator": "awsui_separator_gfwv3_sgio_200"
 };
   

package/internal/components/token-list/token-focus-controller.js

@@ -16,7 +16,7 @@ export function useTokenFocusController({ removedItemIndex }) {
         const toggleButton = tokenListRef.current.querySelector(toggleButtonSelector);
         const activeItemIndices = [];
         for (let i = 0; i < tokenElements.length; i++) {
-            if (tokenElements[i].getAttribute('aria-disabled') !== 'true') {
+            if (!tokenElements[i].querySelector('[aria-disabled="true"]')) {
                 activeItemIndices.push(i);
             }
         }

package/internal/components/token-list/token-focus-controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"token-focus-controller.js","sourceRoot":"lib/default/","sources":["internal/components/token-list/token-focus-controller.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,aAAa,GAAG,IAAI,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;AAChD,MAAM,oBAAoB,GAAG,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC;AAEjD,MAAM,UAAU,uBAAuB,CAAC,EAAE,gBAAgB,EAAwC;IAChG,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;;QACb,IAAI,gBAAgB,KAAK,SAAS,IAAI,gBAAgB,KAAK,IAAI,IAAI,YAAY,CAAC,OAAO,KAAK,IAAI,EAAE;YAChG,OAAO;SACR;QAED,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAC3E,MAAM,YAAY,GAAG,YAAY,CAAC,OAAO,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;QAE9E,MAAM,iBAAiB,GAAa,EAAE,CAAC;QACvC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC7C,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,MAAM,EAAE;gBAC7D,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aAC3B;SACF;QAED,IAAI,gBAAgB,GAAG,MAAM,CAAC,iBAAiB,CAAC;QAChD,IAAI,gBAAgB,GAAG,MAAM,CAAC,iBAAiB,CAAC;QAEhD,KAAK,MAAM,WAAW,IAAI,iBAAiB,EAAE;YAC3C,IAAI,WAAW,GAAG,gBAAgB,EAAE;gBAClC,gBAAgB;oBACd,gBAAgB,GAAG,WAAW,GAAG,gBAAgB,GAAG,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC;aACzG;iBAAM;gBACL,gBAAgB;oBACd,WAAW,GAAG,gBAAgB,GAAG,gBAAgB,GAAG,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC;aACzG;SACF;QAED,MAAM,WAAW,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;QACpD,MAAM,WAAW,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAEpD,IAAI,WAAW,YAAY,WAAW,EAAE;YACtC,MAAA,iBAAiB,CAAC,WAAW,CAAC,0CAAE,KAAK,EAAE,CAAC;SACzC;aAAM,IAAI,WAAW,YAAY,WAAW,EAAE;YAC7C,MAAA,iBAAiB,CAAC,WAAW,CAAC,0CAAE,KAAK,EAAE,CAAC;SACzC;aAAM,IAAI,YAAY,YAAY,WAAW,EAAE;YAC9C,YAAY,CAAC,KAAK,EAAE,CAAC;SACtB;IACH,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,OAAO,YAAY,CAAC;AACtB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect, useRef } from 'react';\nimport { getFirstFocusable } from '../focus-lock/utils.js';\nimport styles from './styles.css.js';\n\nconst tokenSelector = `.${styles['list-item']}`;\nconst toggleButtonSelector = `.${styles.toggle}`;\n\nexport function useTokenFocusController({ removedItemIndex }: { removedItemIndex?: null | number }) {\n  const tokenListRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (removedItemIndex === undefined || removedItemIndex === null || tokenListRef.current === null) {\n      return;\n    }\n\n    const tokenElements = tokenListRef.current.querySelectorAll(tokenSelector);\n    const toggleButton = tokenListRef.current.querySelector(toggleButtonSelector);\n\n    const activeItemIndices: number[] = [];\n    for (let i = 0; i < tokenElements.length; i++) {\n      if (tokenElements[i].getAttribute('aria-disabled') !== 'true') {\n        activeItemIndices.push(i);\n      }\n    }\n\n    let closestPrevIndex = Number.NEGATIVE_INFINITY;\n    let closestNextIndex = Number.POSITIVE_INFINITY;\n\n    for (const activeIndex of activeItemIndices) {\n      if (activeIndex < removedItemIndex) {\n        closestPrevIndex =\n          removedItemIndex - activeIndex < removedItemIndex - closestPrevIndex ? activeIndex : closestPrevIndex;\n      } else {\n        closestNextIndex =\n          activeIndex - removedItemIndex < closestNextIndex - removedItemIndex ? activeIndex : closestNextIndex;\n      }\n    }\n\n    const nextElement = tokenElements[closestNextIndex];\n    const prevElement = tokenElements[closestPrevIndex];\n\n    if (nextElement instanceof HTMLElement) {\n      getFirstFocusable(nextElement)?.focus();\n    } else if (prevElement instanceof HTMLElement) {\n      getFirstFocusable(prevElement)?.focus();\n    } else if (toggleButton instanceof HTMLElement) {\n      toggleButton.focus();\n    }\n  }, [removedItemIndex]);\n\n  return tokenListRef;\n}\n"]}
+{"version":3,"file":"token-focus-controller.js","sourceRoot":"lib/default/","sources":["internal/components/token-list/token-focus-controller.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,aAAa,GAAG,IAAI,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;AAChD,MAAM,oBAAoB,GAAG,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC;AAEjD,MAAM,UAAU,uBAAuB,CAAC,EAAE,gBAAgB,EAAwC;IAChG,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;;QACb,IAAI,gBAAgB,KAAK,SAAS,IAAI,gBAAgB,KAAK,IAAI,IAAI,YAAY,CAAC,OAAO,KAAK,IAAI,EAAE;YAChG,OAAO;SACR;QAED,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAC3E,MAAM,YAAY,GAAG,YAAY,CAAC,OAAO,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;QAE9E,MAAM,iBAAiB,GAAa,EAAE,CAAC;QACvC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC7C,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,wBAAwB,CAAC,EAAE;gBAC7D,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aAC3B;SACF;QAED,IAAI,gBAAgB,GAAG,MAAM,CAAC,iBAAiB,CAAC;QAChD,IAAI,gBAAgB,GAAG,MAAM,CAAC,iBAAiB,CAAC;QAEhD,KAAK,MAAM,WAAW,IAAI,iBAAiB,EAAE;YAC3C,IAAI,WAAW,GAAG,gBAAgB,EAAE;gBAClC,gBAAgB;oBACd,gBAAgB,GAAG,WAAW,GAAG,gBAAgB,GAAG,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC;aACzG;iBAAM;gBACL,gBAAgB;oBACd,WAAW,GAAG,gBAAgB,GAAG,gBAAgB,GAAG,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC;aACzG;SACF;QAED,MAAM,WAAW,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;QACpD,MAAM,WAAW,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAEpD,IAAI,WAAW,YAAY,WAAW,EAAE;YACtC,MAAA,iBAAiB,CAAC,WAAW,CAAC,0CAAE,KAAK,EAAE,CAAC;SACzC;aAAM,IAAI,WAAW,YAAY,WAAW,EAAE;YAC7C,MAAA,iBAAiB,CAAC,WAAW,CAAC,0CAAE,KAAK,EAAE,CAAC;SACzC;aAAM,IAAI,YAAY,YAAY,WAAW,EAAE;YAC9C,YAAY,CAAC,KAAK,EAAE,CAAC;SACtB;IACH,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,OAAO,YAAY,CAAC;AACtB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect, useRef } from 'react';\nimport { getFirstFocusable } from '../focus-lock/utils.js';\nimport styles from './styles.css.js';\n\nconst tokenSelector = `.${styles['list-item']}`;\nconst toggleButtonSelector = `.${styles.toggle}`;\n\nexport function useTokenFocusController({ removedItemIndex }: { removedItemIndex?: null | number }) {\n  const tokenListRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (removedItemIndex === undefined || removedItemIndex === null || tokenListRef.current === null) {\n      return;\n    }\n\n    const tokenElements = tokenListRef.current.querySelectorAll(tokenSelector);\n    const toggleButton = tokenListRef.current.querySelector(toggleButtonSelector);\n\n    const activeItemIndices: number[] = [];\n    for (let i = 0; i < tokenElements.length; i++) {\n      if (!tokenElements[i].querySelector('[aria-disabled=\"true\"]')) {\n        activeItemIndices.push(i);\n      }\n    }\n\n    let closestPrevIndex = Number.NEGATIVE_INFINITY;\n    let closestNextIndex = Number.POSITIVE_INFINITY;\n\n    for (const activeIndex of activeItemIndices) {\n      if (activeIndex < removedItemIndex) {\n        closestPrevIndex =\n          removedItemIndex - activeIndex < removedItemIndex - closestPrevIndex ? activeIndex : closestPrevIndex;\n      } else {\n        closestNextIndex =\n          activeIndex - removedItemIndex < closestNextIndex - removedItemIndex ? activeIndex : closestNextIndex;\n      }\n    }\n\n    const nextElement = tokenElements[closestNextIndex];\n    const prevElement = tokenElements[closestPrevIndex];\n\n    if (nextElement instanceof HTMLElement) {\n      getFirstFocusable(nextElement)?.focus();\n    } else if (prevElement instanceof HTMLElement) {\n      getFirstFocusable(prevElement)?.focus();\n    } else if (toggleButton instanceof HTMLElement) {\n      toggleButton.focus();\n    }\n  }, [removedItemIndex]);\n\n  return tokenListRef;\n}\n"]}

package/internal/components/token-list/token-limit-toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"token-limit-toggle.d.ts","sourceRoot":"lib/default/","sources":["internal/components/token-list/token-limit-toggle.tsx"],"names":[],"mappings":";AAKA,OAAO,EAA0B,yBAAyB,EAAE,MAAM,cAAc,CAAC;AAEjF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAG3C,UAAU,qBAAqB;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,OAAO,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;IAC1C,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAAS,EACT,SAAS,EACT,QAAQ,EACR,qBAAqB,EACrB,OAAO,EACP,WAAgB,GACjB,EAAE,qBAAqB,eAwBvB"}
+{"version":3,"file":"token-limit-toggle.d.ts","sourceRoot":"lib/default/","sources":["internal/components/token-list/token-limit-toggle.tsx"],"names":[],"mappings":";AAKA,OAAO,EAA0B,yBAAyB,EAAE,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAG3C,UAAU,qBAAqB;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,OAAO,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;IAC1C,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAAS,EACT,SAAS,EACT,QAAQ,EACR,qBAAqB,EACrB,OAAO,EACP,WAAgB,GACjB,EAAE,qBAAqB,eAsBvB"}

package/internal/components/token-list/token-limit-toggle.js

@@ -3,10 +3,8 @@
 import React, { useCallback } from 'react';
 import InternalIcon from '../../../icon/internal';
 import { fireNonCancelableEvent } from '../../events';
-import useFocusVisible from '../../hooks/focus-visible';
 import styles from './styles.css.js';
 export default function TokenLimitToggle({ controlId, allHidden, expanded, numberOfHiddenOptions, onClick, i18nStrings = {}, }) {
-    const focusVisible = useFocusVisible();
     const numberOfHiddenOptionLabel = allHidden ? numberOfHiddenOptions : `+${numberOfHiddenOptions}`;
     const description = expanded
         ? i18nStrings.limitShowFewer
@@ -14,7 +12,7 @@ export default function TokenLimitToggle({ controlId, allHidden, expanded, numbe
     const handleClick = useCallback(() => {
         fireNonCancelableEvent(onClick, null);
     }, [onClick]);
-    return (React.createElement("button", Object.assign({ type: "button", className: styles.toggle, onClick: handleClick, "aria-controls": controlId, "aria-expanded": expanded }, focusVisible),
+    return (React.createElement("button", { type: "button", className: styles.toggle, onClick: handleClick, "aria-controls": controlId, "aria-expanded": expanded },
         React.createElement(InternalIcon, { name: expanded ? 'treeview-collapse' : 'treeview-expand' }),
         React.createElement("span", { className: styles.description }, description)));
 }