@cloudscape-design/components 3.0.596 → 3.0.598

package/token-group/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/token-group/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { IconProps } from '../icon/interfaces';\n\nexport interface TokenGroupProps extends BaseComponentProps {\n  /**\n   * An object containing all the necessary localized strings required by the component.\n   * @i18n\n   */\n  i18nStrings?: TokenGroupProps.I18nStrings;\n\n  /**\n   * Specifies the maximum number of displayed tokens. If the property isn't set, all of the tokens are displayed.\n   */\n  limit?: number;\n\n  /**\n   * Specifies the direction in which tokens are aligned (`horizontal | vertical`).\n   */\n  alignment?: TokenGroupProps.Alignment;\n\n  /**\n   * Removes any outer padding from the component.\n   * We recommend to always enable this property.\n   */\n  disableOuterPadding?: boolean;\n\n  /**\n   *\n   * An array of objects representing token items. Each token has the following properties:\n   *\n   * - `label` (string) - Title text of the token.\n   * - `description` (string) - (Optional) Further information about the token that appears below the label.\n   * - `disabled` [boolean] - (Optional) Determines whether the token is disabled.\n   * - `labelTag` (string) - (Optional) A label tag that provides additional guidance, shown next to the label.\n   * - `tags` [string[]] - (Optional) A list of tags giving further guidance about the token.\n   * - `dismissLabel` (string) - (Optional) Adds an `aria-label` to the dismiss button.\n   * - `iconName` (string) - (Optional) Specifies the name of an [icon](/components/icon/) to display in the token.\n   * - `iconAlt` (string) - (Optional) Specifies alternate text for a custom icon, for use with `iconUrl`.\n   * - `iconUrl` (string) - (Optional) URL of a custom icon.\n   * - `iconSvg` (ReactNode) - (Optional) Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   */\n  items?: ReadonlyArray<TokenGroupProps.Item>;\n  /**\n   *  Called when the user clicks on the dismiss button. The token won't be automatically removed.\n   *  Make sure that you add a listener to this event to update your application state.\n   */\n  onDismiss?: NonCancelableEventHandler<TokenGroupProps.DismissDetail>;\n}\n\nexport namespace TokenGroupProps {\n  export type Alignment = 'horizontal' | 'vertical';\n  export interface Item {\n    label?: string;\n    disabled?: boolean;\n    labelTag?: string;\n    description?: string;\n    iconAlt?: string;\n    iconName?: IconProps.Name;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n    tags?: ReadonlyArray<string>;\n    dismissLabel?: string;\n  }\n\n  export interface DismissDetail {\n    itemIndex: number;\n  }\n\n  export interface I18nStrings {\n    limitShowFewer?: string;\n    limitShowMore?: string;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/token-group/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { IconProps } from '../icon/interfaces';\n\nexport interface TokenGroupProps extends BaseComponentProps {\n  /**\n   * An object containing all the necessary localized strings required by the component.\n   * @i18n\n   */\n  i18nStrings?: TokenGroupProps.I18nStrings;\n\n  /**\n   * Specifies the maximum number of displayed tokens. If the property isn't set, all of the tokens are displayed.\n   */\n  limit?: number;\n\n  /**\n   * Specifies the direction in which tokens are aligned (`horizontal | vertical`).\n   */\n  alignment?: TokenGroupProps.Alignment;\n\n  /**\n   * Removes any outer padding from the component.\n   * We recommend to always enable this property.\n   */\n  disableOuterPadding?: boolean;\n\n  /**\n   *\n   * An array of objects representing token items. Each token has the following properties:\n   *\n   * - `label` (string) - Title text of the token.\n   * - `description` (string) - (Optional) Further information about the token that appears below the label.\n   * - `disabled` [boolean] - (Optional) Determines whether the token is disabled.\n   * - `labelTag` (string) - (Optional) A label tag that provides additional guidance, shown next to the label.\n   * - `tags` [string[]] - (Optional) A list of tags giving further guidance about the token.\n   * - `dismissLabel` (string) - (Optional) Adds an `aria-label` to the dismiss button.\n   * - `iconName` (string) - (Optional) Specifies the name of an [icon](/components/icon/) to display in the token.\n   * - `iconAlt` (string) - (Optional) Specifies alternate text for a custom icon, for use with `iconUrl`.\n   * - `iconUrl` (string) - (Optional) URL of a custom icon.\n   * - `iconSvg` (ReactNode) - (Optional) Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   */\n  items?: ReadonlyArray<TokenGroupProps.Item>;\n  /**\n   *  Called when the user clicks on the dismiss button. The token won't be automatically removed.\n   *  Make sure that you add a listener to this event to update your application state.\n   */\n  onDismiss?: NonCancelableEventHandler<TokenGroupProps.DismissDetail>;\n  /**\n   * Adds an `aria-label` to the \"Show fewer\" button.\n   * Use to assign unique labels when there are multiple token groups with the same `limitShowFewer` label on one page.\n   */\n  limitShowFewerAriaLabel?: string;\n  /**\n   * Adds an `aria-label` to the \"Show more\" button.\n   * Use to assign unique labels when there are multiple token groups with the same `limitShowMore` label on one page.\n   */\n  limitShowMoreAriaLabel?: string;\n}\n\nexport namespace TokenGroupProps {\n  export type Alignment = 'horizontal' | 'vertical';\n  export interface Item {\n    label?: string;\n    disabled?: boolean;\n    labelTag?: string;\n    description?: string;\n    iconAlt?: string;\n    iconName?: IconProps.Name;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n    tags?: ReadonlyArray<string>;\n    dismissLabel?: string;\n  }\n\n  export interface DismissDetail {\n    itemIndex: number;\n  }\n\n  export interface I18nStrings {\n    limitShowFewer?: string;\n    limitShowMore?: string;\n  }\n}\n"]}

package/token-group/internal.d.ts

@@ -3,6 +3,6 @@ import { InternalBaseComponentProps } from '../internal/hooks/use-base-component
 import { TokenGroupProps } from './interfaces';
 import { SomeRequired } from '../internal/types';
 type InternalTokenGroupProps = SomeRequired<TokenGroupProps, 'items' | 'alignment'> & InternalBaseComponentProps;
-export default function InternalTokenGroup({ alignment, items, onDismiss, limit, i18nStrings, disableOuterPadding, __internalRootRef, ...props }: InternalTokenGroupProps): JSX.Element;
+export default function InternalTokenGroup({ alignment, items, onDismiss, limit, i18nStrings, disableOuterPadding, limitShowFewerAriaLabel, limitShowMoreAriaLabel, __internalRootRef, ...props }: InternalTokenGroupProps): JSX.Element;
 export {};
 //# sourceMappingURL=internal.d.ts.map

package/token-group/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/token-group/internal.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAOjD,KAAK,uBAAuB,GAAG,YAAY,CAAC,eAAe,EAAE,OAAO,GAAG,WAAW,CAAC,GAAG,0BAA0B,CAAC;AAEjH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,SAAS,EACT,KAAK,EACL,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,EACnB,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,uBAAuB,eA+CzB"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/token-group/internal.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAOjD,KAAK,uBAAuB,GAAG,YAAY,CAAC,eAAe,EAAE,OAAO,GAAG,WAAW,CAAC,GAAG,0BAA0B,CAAC;AAEjH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,SAAS,EACT,KAAK,EACL,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,EACnB,uBAAuB,EACvB,sBAAsB,EACtB,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,uBAAuB,eAiDzB"}

package/token-group/internal.js

@@ -11,7 +11,7 @@ import styles from './styles.css.js';
 import TokenList from '../internal/components/token-list';
 import { Token } from './token';
 export default function InternalTokenGroup(_a) {
-    var { alignment, items, onDismiss, limit, i18nStrings, disableOuterPadding, __internalRootRef } = _a, props = __rest(_a, ["alignment", "items", "onDismiss", "limit", "i18nStrings", "disableOuterPadding", "__internalRootRef"]);
+    var { alignment, items, onDismiss, limit, i18nStrings, disableOuterPadding, limitShowFewerAriaLabel, limitShowMoreAriaLabel, __internalRootRef } = _a, props = __rest(_a, ["alignment", "items", "onDismiss", "limit", "i18nStrings", "disableOuterPadding", "limitShowFewerAriaLabel", "limitShowMoreAriaLabel", "__internalRootRef"]);
     checkControlled('TokenGroup', 'items', items, 'onDismiss', onDismiss);
     const [removedItemIndex, setRemovedItemIndex] = useState(null);
     const baseProps = getBaseProps(props);
@@ -21,7 +21,7 @@ export default function InternalTokenGroup(_a) {
                     fireNonCancelableEvent(onDismiss, { itemIndex });
                     setRemovedItemIndex(itemIndex);
                 }, disabled: item.disabled },
-                React.createElement(Option, { option: item, isGenericGroup: false }))), i18nStrings: i18nStrings, moveFocusNextToIndex: removedItemIndex, onExpandedClick: isExpanded => {
+                React.createElement(Option, { option: item, isGenericGroup: false }))), i18nStrings: i18nStrings, limitShowFewerAriaLabel: limitShowFewerAriaLabel, limitShowMoreAriaLabel: limitShowMoreAriaLabel, moveFocusNextToIndex: removedItemIndex, onExpandedClick: isExpanded => {
                 if (isExpanded && limit) {
                     setRemovedItemIndex(limit);
                 }

package/token-group/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/token-group/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAKjE,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,SAAS,MAAM,mCAAmC,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAIhC,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EASjB;QATiB,EACzC,SAAS,EACT,KAAK,EACL,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,EACnB,iBAAiB,OAEO,EADrB,KAAK,cARiC,uGAS1C,CADS;IAER,eAAe,CAAC,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAEtE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAE9E,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAClC,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CACb,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,IAAI,EACX,QAAQ,IAAI,MAAM,CAAC,WAAW,CAAC,EAC/B,mBAAmB,IAAI,MAAM,CAAC,YAAY,CAAC,CAC5C,EACD,GAAG,EAAE,iBAAiB;QAEtB,oBAAC,SAAS,IACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,CAC/B,oBAAC,KAAK,IACJ,SAAS,EAAE,IAAI,CAAC,KAAK,EACrB,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,SAAS,EAAE,GAAG,EAAE;oBACd,sBAAsB,CAAC,SAAS,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC;oBACjD,mBAAmB,CAAC,SAAS,CAAC,CAAC;gBACjC,CAAC,EACD,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAEvB,oBAAC,MAAM,IAAC,MAAM,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,GAAI,CACzC,CACT,EACD,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,gBAAgB,EACtC,eAAe,EAAE,UAAU,CAAC,EAAE;gBAC5B,IAAI,UAAU,IAAI,KAAK,EAAE;oBACvB,mBAAmB,CAAC,KAAK,CAAC,CAAC;iBAC5B;qBAAM;oBACL,mBAAmB,CAAC,IAAI,CAAC,CAAC;iBAC3B;YACH,CAAC,GACD,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\n\nimport Option from '../internal/components/option';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nimport { TokenGroupProps } from './interfaces';\nimport { SomeRequired } from '../internal/types';\nimport { getBaseProps } from '../internal/base-component';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport TokenList from '../internal/components/token-list';\nimport { Token } from './token';\n\ntype InternalTokenGroupProps = SomeRequired<TokenGroupProps, 'items' | 'alignment'> & InternalBaseComponentProps;\n\nexport default function InternalTokenGroup({\n  alignment,\n  items,\n  onDismiss,\n  limit,\n  i18nStrings,\n  disableOuterPadding,\n  __internalRootRef,\n  ...props\n}: InternalTokenGroupProps) {\n  checkControlled('TokenGroup', 'items', items, 'onDismiss', onDismiss);\n\n  const [removedItemIndex, setRemovedItemIndex] = useState<null | number>(null);\n\n  const baseProps = getBaseProps(props);\n  const hasItems = items.length > 0;\n  return (\n    <div\n      {...baseProps}\n      className={clsx(\n        baseProps.className,\n        styles.root,\n        hasItems && styles['has-items'],\n        disableOuterPadding && styles['no-padding']\n      )}\n      ref={__internalRootRef}\n    >\n      <TokenList\n        alignment={alignment}\n        items={items}\n        limit={limit}\n        renderItem={(item, itemIndex) => (\n          <Token\n            ariaLabel={item.label}\n            dismissLabel={item.dismissLabel}\n            onDismiss={() => {\n              fireNonCancelableEvent(onDismiss, { itemIndex });\n              setRemovedItemIndex(itemIndex);\n            }}\n            disabled={item.disabled}\n          >\n            <Option option={item} isGenericGroup={false} />\n          </Token>\n        )}\n        i18nStrings={i18nStrings}\n        moveFocusNextToIndex={removedItemIndex}\n        onExpandedClick={isExpanded => {\n          if (isExpanded && limit) {\n            setRemovedItemIndex(limit);\n          } else {\n            setRemovedItemIndex(null);\n          }\n        }}\n      />\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/token-group/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAKjE,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,SAAS,MAAM,mCAAmC,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAIhC,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EAWjB;QAXiB,EACzC,SAAS,EACT,KAAK,EACL,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,EACnB,uBAAuB,EACvB,sBAAsB,EACtB,iBAAiB,OAEO,EADrB,KAAK,cAViC,4JAW1C,CADS;IAER,eAAe,CAAC,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAEtE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAE9E,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAClC,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CACb,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,IAAI,EACX,QAAQ,IAAI,MAAM,CAAC,WAAW,CAAC,EAC/B,mBAAmB,IAAI,MAAM,CAAC,YAAY,CAAC,CAC5C,EACD,GAAG,EAAE,iBAAiB;QAEtB,oBAAC,SAAS,IACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,CAC/B,oBAAC,KAAK,IACJ,SAAS,EAAE,IAAI,CAAC,KAAK,EACrB,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,SAAS,EAAE,GAAG,EAAE;oBACd,sBAAsB,CAAC,SAAS,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC;oBACjD,mBAAmB,CAAC,SAAS,CAAC,CAAC;gBACjC,CAAC,EACD,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAEvB,oBAAC,MAAM,IAAC,MAAM,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,GAAI,CACzC,CACT,EACD,WAAW,EAAE,WAAW,EACxB,uBAAuB,EAAE,uBAAuB,EAChD,sBAAsB,EAAE,sBAAsB,EAC9C,oBAAoB,EAAE,gBAAgB,EACtC,eAAe,EAAE,UAAU,CAAC,EAAE;gBAC5B,IAAI,UAAU,IAAI,KAAK,EAAE;oBACvB,mBAAmB,CAAC,KAAK,CAAC,CAAC;iBAC5B;qBAAM;oBACL,mBAAmB,CAAC,IAAI,CAAC,CAAC;iBAC3B;YACH,CAAC,GACD,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\n\nimport Option from '../internal/components/option';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nimport { TokenGroupProps } from './interfaces';\nimport { SomeRequired } from '../internal/types';\nimport { getBaseProps } from '../internal/base-component';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport TokenList from '../internal/components/token-list';\nimport { Token } from './token';\n\ntype InternalTokenGroupProps = SomeRequired<TokenGroupProps, 'items' | 'alignment'> & InternalBaseComponentProps;\n\nexport default function InternalTokenGroup({\n  alignment,\n  items,\n  onDismiss,\n  limit,\n  i18nStrings,\n  disableOuterPadding,\n  limitShowFewerAriaLabel,\n  limitShowMoreAriaLabel,\n  __internalRootRef,\n  ...props\n}: InternalTokenGroupProps) {\n  checkControlled('TokenGroup', 'items', items, 'onDismiss', onDismiss);\n\n  const [removedItemIndex, setRemovedItemIndex] = useState<null | number>(null);\n\n  const baseProps = getBaseProps(props);\n  const hasItems = items.length > 0;\n  return (\n    <div\n      {...baseProps}\n      className={clsx(\n        baseProps.className,\n        styles.root,\n        hasItems && styles['has-items'],\n        disableOuterPadding && styles['no-padding']\n      )}\n      ref={__internalRootRef}\n    >\n      <TokenList\n        alignment={alignment}\n        items={items}\n        limit={limit}\n        renderItem={(item, itemIndex) => (\n          <Token\n            ariaLabel={item.label}\n            dismissLabel={item.dismissLabel}\n            onDismiss={() => {\n              fireNonCancelableEvent(onDismiss, { itemIndex });\n              setRemovedItemIndex(itemIndex);\n            }}\n            disabled={item.disabled}\n          >\n            <Option option={item} isGenericGroup={false} />\n          </Token>\n        )}\n        i18nStrings={i18nStrings}\n        limitShowFewerAriaLabel={limitShowFewerAriaLabel}\n        limitShowMoreAriaLabel={limitShowMoreAriaLabel}\n        moveFocusNextToIndex={removedItemIndex}\n        onExpandedClick={isExpanded => {\n          if (isExpanded && limit) {\n            setRemovedItemIndex(limit);\n          } else {\n            setRemovedItemIndex(null);\n          }\n        }}\n      />\n    </div>\n  );\n}\n"]}