@cloudscape-design/components 3.0.995 → 3.0.997

package/time-input/interfaces.d.ts

@@ -2,32 +2,31 @@ import { BaseChangeDetail, BaseInputProps, InputAutoCorrect } from '../input/int
 import { BaseComponentProps } from '../internal/base-component';
 import { FormFieldValidationControlProps } from '../internal/context/form-field-context';
 export interface TimeInputProps extends BaseInputProps, InputAutoCorrect, FormFieldValidationControlProps, BaseComponentProps {
-    /**
-     * Specifies the format of the time input.
-     *
-     * Use it to restrict the granularity of time that the user can enter.
-     */
-    format?: TimeInputProps.Format;
-    /**
-     * Specifies whether the component should use 12-hour or 24-hour format.
-     * When using 12-hour format, there is no option for picking AM or PM.
-     */
-    use24Hour?: boolean;
-    /**
-     * Specifies whether to enable a browser's autocomplete functionality for this input.
-     * In some cases it might be appropriate to disable autocomplete (for
-     * example, for security-sensitive fields). To use it correctly, set the `name` property.
-     */
-    autoComplete?: boolean;
+  /**
+   * Specifies the format of the time input.
+   *
+   * Use it to restrict the granularity of time that the user can enter.
+   */
+  format?: TimeInputProps.Format;
+  /**
+   * Specifies whether the component should use 12-hour or 24-hour format.
+   * When using 12-hour format, there is no option for picking AM or PM.
+   */
+  use24Hour?: boolean;
+  /**
+   * Specifies whether to enable a browser's autocomplete functionality for this input.
+   * In some cases it might be appropriate to disable autocomplete (for
+   * example, for security-sensitive fields). To use it correctly, set the `name` property.
+   */
+  autoComplete?: boolean;
 }
 export declare namespace TimeInputProps {
-    type Format = 'hh' | 'hh:mm' | 'hh:mm:ss';
-    type ChangeDetail = BaseChangeDetail;
-    interface Ref {
-        /**
-         * Sets input focus on the input control.
-         */
-        focus(): void;
-    }
-}
-//# sourceMappingURL=interfaces.d.ts.map
+  type Format = 'hh' | 'hh:mm' | 'hh:mm:ss';
+  type ChangeDetail = BaseChangeDetail;
+  interface Ref {
+    /**
+     * Sets input focus on the input control.
+     */
+    focus(): void;
+  }
+}

package/time-input/internal.d.ts

@@ -2,5 +2,4 @@ import React from 'react';
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { TimeInputProps } from './interfaces';
 declare const InternalTimeInput: React.ForwardRefExoticComponent<TimeInputProps & InternalBaseComponentProps<any> & React.RefAttributes<HTMLInputElement>>;
-export default InternalTimeInput;
-//# sourceMappingURL=internal.d.ts.map
+export default InternalTimeInput;

package/toggle/analytics-metadata/interfaces.d.ts

@@ -1,18 +1,17 @@
 import { LabelIdentifier } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 export interface GeneratedAnalyticsMetadataToggleSelect {
-    action: 'select';
-    detail: {
-        label: string;
-    };
+  action: 'select';
+  detail: {
+    label: string;
+  };
 }
 export interface GeneratedAnalyticsMetadataToggleDeselect {
-    action: 'deselect';
-    detail: {
-        label: string;
-    };
+  action: 'deselect';
+  detail: {
+    label: string;
+  };
 }
 export interface GeneratedAnalyticsMetadataToggleComponent {
-    name: 'awsui.Toggle';
-    label: string | LabelIdentifier;
-}
-//# sourceMappingURL=interfaces.d.ts.map
+  name: 'awsui.Toggle';
+  label: string | LabelIdentifier;
+}

package/toggle/index.d.ts

@@ -2,5 +2,4 @@ import React from 'react';
 import { ToggleProps } from './interfaces';
 export { ToggleProps };
 declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<ToggleProps.Ref>>;
-export default Toggle;
-//# sourceMappingURL=index.d.ts.map
+export default Toggle;

package/toggle/interfaces.d.ts

@@ -2,22 +2,21 @@ import React from 'react';
 import { BaseCheckboxProps } from '../checkbox/base-checkbox';
 import { NonCancelableEventHandler } from '../internal/events';
 export interface ToggleProps extends BaseCheckboxProps {
-    /**
-     * The control's label that's displayed next to the toggle. Clicking this will invoke a state change.
-     * @displayname label
-     */
-    children?: React.ReactNode;
-    onChange?: NonCancelableEventHandler<ToggleProps.ChangeDetail>;
+  /**
+   * The control's label that's displayed next to the toggle. Clicking this will invoke a state change.
+   * @displayname label
+   */
+  children?: React.ReactNode;
+  onChange?: NonCancelableEventHandler<ToggleProps.ChangeDetail>;
 }
 export declare namespace ToggleProps {
-    interface Ref {
-        /**
-         * Sets input focus onto the UI control.
-         */
-        focus(): void;
-    }
-    interface ChangeDetail {
-        checked: boolean;
-    }
-}
-//# sourceMappingURL=interfaces.d.ts.map
+  interface Ref {
+    /**
+     * Sets input focus onto the UI control.
+     */
+    focus(): void;
+  }
+  interface ChangeDetail {
+    checked: boolean;
+  }
+}

package/toggle/internal.d.ts

@@ -2,8 +2,7 @@ import React from 'react';
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { ToggleProps } from './interfaces';
 interface InternalToggleProps extends ToggleProps, InternalBaseComponentProps {
-    __injectAnalyticsComponentMetadata?: boolean;
+  __injectAnalyticsComponentMetadata?: boolean;
 }
 declare const InternalToggle: React.ForwardRefExoticComponent<InternalToggleProps & React.RefAttributes<ToggleProps.Ref>>;
-export default InternalToggle;
-//# sourceMappingURL=internal.d.ts.map
+export default InternalToggle;

package/toggle-button/index.d.ts

@@ -2,5 +2,4 @@ import React from 'react';
 import { ToggleButtonProps } from './interfaces';
 export { ToggleButtonProps };
 declare const ToggleButton: React.ForwardRefExoticComponent<ToggleButtonProps & React.RefAttributes<ToggleButtonProps.Ref>>;
-export default ToggleButton;
-//# sourceMappingURL=index.d.ts.map
+export default ToggleButton;

package/toggle-button/index.js

@@ -1,22 +1,18 @@
-import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
-import { getBaseProps } from '../internal/base-component';
-import useBaseComponent from '../internal/hooks/use-base-component';
+
+import CoreComponent from './internal-do-not-use-core';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
-import { InternalToggleButton } from './internal';
-const ToggleButton = React.forwardRef((_a, ref) => {
-    var { children, iconName, pressedIconName, iconUrl, pressedIconUrl, iconSvg, pressedIconSvg, variant = 'normal', loading = false, loadingText, disabled = false, disabledReason, wrapText = true, ariaLabel, ariaDescribedby, ariaControls, pressed = false, onChange } = _a, props = __rest(_a, ["children", "iconName", "pressedIconName", "iconUrl", "pressedIconUrl", "iconSvg", "pressedIconSvg", "variant", "loading", "loadingText", "disabled", "disabledReason", "wrapText", "ariaLabel", "ariaDescribedby", "ariaControls", "pressed", "onChange"]);
-    const baseComponentProps = useBaseComponent('ToggleButton', {
-        props: { iconName, pressedIconName, pressed, variant, wrapText },
-        metadata: {
-            hasDisabledReason: Boolean(disabledReason),
-        },
-    });
-    const baseProps = getBaseProps(props);
-    return (React.createElement(InternalToggleButton, Object.assign({}, baseProps, baseComponentProps, { ref: ref, iconName: iconName, iconUrl: iconUrl, iconSvg: iconSvg, variant: variant, loading: loading, loadingText: loadingText, disabled: disabled, disabledReason: disabledReason, wrapText: wrapText, ariaLabel: ariaLabel, ariaDescribedby: ariaDescribedby, ariaControls: ariaControls, pressedIconName: pressedIconName, pressedIconUrl: pressedIconUrl, pressedIconSvg: pressedIconSvg, pressed: pressed, onChange: onChange }), children));
+import { validateProps } from '../internal/base-component';
+
+
+
+const ToggleButton = React.forwardRef((props, ref) => {
+    validateProps('ToggleButton', props, ["style"], {});
+    return React.createElement(CoreComponent, {ref,...props});
 });
+
+
 applyDisplayName(ToggleButton, 'ToggleButton');
 export default ToggleButton;
-//# sourceMappingURL=index.js.map

package/toggle-button/interfaces.d.ts

@@ -4,75 +4,74 @@ import { IconProps } from '../icon/interfaces';
 import { BaseComponentProps } from '../internal/base-component';
 import { NonCancelableEventHandler } from '../internal/events';
 export interface ToggleButtonProps extends BaseComponentProps, BaseButtonProps {
-    /** Determines the general styling of the toggle button as follows:
-     * * `normal` for secondary buttons.
-     * * `icon` to display an icon only (no text).
-     *
-     * Defaults to `normal` if not specified.
-     */
-    variant?: ToggleButtonProps.Variant;
-    /**
-     * Displays an icon next to the text.
-     */
-    iconName?: IconProps.Name;
-    /**
-     * Displays an icon next to the text in pressed state.
-     */
-    pressedIconName?: IconProps.Name;
-    /**
-     * Specifies the URL of a custom icon in pressed state. Use this property if the icon needed for your use case isn't available.
-     *
-     * `pressedIconSvg` will take precedence if you set both `pressedIconUrl` and `pressedIconSvg`.
-     */
-    pressedIconUrl?: string;
-    /**
-     * Specifies the SVG of a custom icon in pressed state.
-     *
-     * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.
-     * When this property is set, the component will be decorated with `aria-hidden="true"`. Ensure that the `svg` element:
-     * - has attribute `focusable="false"`
-     * - has `viewBox="0 0 16 16"`
-     *
-     * If you set the `svg` element as the root node of the slot, the component will automatically:
-     * - set `stroke="currentColor"`, `fill="none"`, and `vertical-align="top"`.
-     * - set the stroke width based on the size of the icon.
-     * - set the width and height of the SVG element based on the size of the icon.
-     *
-     * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.
-     * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.
-     *
-     * If you set both `pressedIconUrl` and `pressedIconSvg`, `pressedIconSvg` will take precedence.
-     *
-     * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.
-     * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.
-     */
-    pressedIconSvg?: React.ReactNode;
-    /**
-     * Sets the toggle button to pressed state.
-     */
+  /** Determines the general styling of the toggle button as follows:
+   * * `normal` for secondary buttons.
+   * * `icon` to display an icon only (no text).
+   *
+   * Defaults to `normal` if not specified.
+   */
+  variant?: ToggleButtonProps.Variant;
+  /**
+   * Displays an icon next to the text.
+   */
+  iconName?: IconProps.Name;
+  /**
+   * Displays an icon next to the text in pressed state.
+   */
+  pressedIconName?: IconProps.Name;
+  /**
+   * Specifies the URL of a custom icon in pressed state. Use this property if the icon needed for your use case isn't available.
+   *
+   * `pressedIconSvg` will take precedence if you set both `pressedIconUrl` and `pressedIconSvg`.
+   */
+  pressedIconUrl?: string;
+  /**
+   * Specifies the SVG of a custom icon in pressed state.
+   *
+   * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.
+   * When this property is set, the component will be decorated with `aria-hidden="true"`. Ensure that the `svg` element:
+   * - has attribute `focusable="false"`
+   * - has `viewBox="0 0 16 16"`
+   *
+   * If you set the `svg` element as the root node of the slot, the component will automatically:
+   * - set `stroke="currentColor"`, `fill="none"`, and `vertical-align="top"`.
+   * - set the stroke width based on the size of the icon.
+   * - set the width and height of the SVG element based on the size of the icon.
+   *
+   * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.
+   * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.
+   *
+   * If you set both `pressedIconUrl` and `pressedIconSvg`, `pressedIconSvg` will take precedence.
+   *
+   * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.
+   * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.
+   */
+  pressedIconSvg?: React.ReactNode;
+  /**
+   * Sets the toggle button to pressed state.
+   */
+  pressed: boolean;
+  /**
+   * Provides a reason why the button is disabled (only when `disabled` is `true`).
+   * If provided, the button becomes focusable.
+   * Applicable only for the normal variant.
+   */
+  disabledReason?: string;
+  /**
+   * Called when the user changes their selection.
+   * The event `detail` contains the current value for the `pressed` property.
+   */
+  onChange?: NonCancelableEventHandler<ToggleButtonProps.ChangeDetail>;
+}
+export declare namespace ToggleButtonProps {
+  type Variant = 'normal' | 'icon';
+  interface ChangeDetail {
     pressed: boolean;
+  }
+  interface Ref {
     /**
-     * Provides a reason why the button is disabled (only when `disabled` is `true`).
-     * If provided, the button becomes focusable.
-     * Applicable only for the normal variant.
+     * Focuses the underlying native button.
      */
-    disabledReason?: string;
-    /**
-     * Called when the user changes their selection.
-     * The event `detail` contains the current value for the `pressed` property.
-     */
-    onChange?: NonCancelableEventHandler<ToggleButtonProps.ChangeDetail>;
-}
-export declare namespace ToggleButtonProps {
-    type Variant = 'normal' | 'icon';
-    interface ChangeDetail {
-        pressed: boolean;
-    }
-    interface Ref {
-        /**
-         * Focuses the underlying native button.
-         */
-        focus(options?: FocusOptions): void;
-    }
-}
-//# sourceMappingURL=interfaces.d.ts.map
+    focus(options?: FocusOptions): void;
+  }
+}

package/toggle-button/internal-do-not-use-core.js

@@ -0,0 +1,22 @@
+import { __rest } from "tslib";
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import { getBaseProps } from '../internal/base-component';
+import useBaseComponent from '../internal/hooks/use-base-component';
+import { applyDisplayName } from '../internal/utils/apply-display-name';
+import { InternalToggleButton } from './internal';
+const ToggleButton = React.forwardRef((_a, ref) => {
+    var { children, iconName, pressedIconName, iconUrl, pressedIconUrl, iconSvg, pressedIconSvg, variant = 'normal', loading = false, loadingText, disabled = false, disabledReason, wrapText = true, ariaLabel, ariaDescribedby, ariaControls, pressed = false, onChange } = _a, props = __rest(_a, ["children", "iconName", "pressedIconName", "iconUrl", "pressedIconUrl", "iconSvg", "pressedIconSvg", "variant", "loading", "loadingText", "disabled", "disabledReason", "wrapText", "ariaLabel", "ariaDescribedby", "ariaControls", "pressed", "onChange"]);
+    const baseComponentProps = useBaseComponent('ToggleButton', {
+        props: { iconName, pressedIconName, pressed, variant, wrapText },
+        metadata: {
+            hasDisabledReason: Boolean(disabledReason),
+        },
+    });
+    const baseProps = getBaseProps(props);
+    return (React.createElement(InternalToggleButton, Object.assign({}, baseProps, baseComponentProps, { ref: ref, iconName: iconName, iconUrl: iconUrl, iconSvg: iconSvg, variant: variant, loading: loading, loadingText: loadingText, disabled: disabled, disabledReason: disabledReason, wrapText: wrapText, ariaLabel: ariaLabel, ariaDescribedby: ariaDescribedby, ariaControls: ariaControls, pressedIconName: pressedIconName, pressedIconUrl: pressedIconUrl, pressedIconSvg: pressedIconSvg, pressed: pressed, onChange: onChange }), children));
+});
+applyDisplayName(ToggleButton, 'ToggleButton');
+export default ToggleButton;
+//# sourceMappingURL=index.js.map

package/toggle-button/internal.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import { ToggleButtonProps } from './interfaces';
 export declare const InternalToggleButton: React.ForwardRefExoticComponent<ToggleButtonProps & {
-    __title?: string | undefined;
-} & React.RefAttributes<ToggleButtonProps.Ref>>;
-//# sourceMappingURL=internal.d.ts.map
+  __title?: string | undefined;
+} & React.RefAttributes<ToggleButtonProps.Ref>>;

package/toggle-button/util.d.ts

@@ -1,2 +1 @@
-export declare function getToggleIcon<T>(pressed: boolean, defaultIcon?: T, pressedIcon?: T): T | undefined;
-//# sourceMappingURL=util.d.ts.map
+export declare function getToggleIcon<T>(pressed: boolean, defaultIcon?: T, pressedIcon?: T): T | undefined;

package/token-group/analytics-metadata/interfaces.d.ts

@@ -1,19 +1,18 @@
 import { LabelIdentifier } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import { GeneratedAnalyticsMetadataTokenListShowLess, GeneratedAnalyticsMetadataTokenListShowMore } from '../../internal/components/token-list/analytics-metadata/interfaces';
 export interface GeneratedAnalyticsMetadataTokenGroupDismiss {
-    action: 'dismiss';
-    detail: {
-        label: LabelIdentifier;
-        position?: string;
-    };
+  action: 'dismiss';
+  detail: {
+    label: LabelIdentifier;
+    position?: string;
+  };
 }
 export type GeneratedAnalyticsMetadataTokenGroupShowMore = GeneratedAnalyticsMetadataTokenListShowMore;
 export type GeneratedAnalyticsMetadataTokenGroupShowLess = GeneratedAnalyticsMetadataTokenListShowLess;
 export interface GeneratedAnalyticsMetadataTokenGroupComponent {
-    name: 'awsui.TokenGroup';
-    label: string;
-    properties: {
-        itemsCount: string;
-    };
-}
-//# sourceMappingURL=interfaces.d.ts.map
+  name: 'awsui.TokenGroup';
+  label: string;
+  properties: {
+    itemsCount: string;
+  };
+}

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

@@ -1,10 +1,9 @@
 import React from 'react';
 interface DismissButtonProps {
-    disabled?: boolean;
-    readOnly?: boolean;
-    onDismiss?: () => void;
-    dismissLabel?: string;
+  disabled?: boolean;
+  readOnly?: boolean;
+  onDismiss?: () => void;
+  dismissLabel?: string;
 }
 declare const _default: React.ForwardRefExoticComponent<DismissButtonProps & React.RefAttributes<HTMLButtonElement>>;
-export default _default;
-//# sourceMappingURL=dismiss-button.d.ts.map
+export default _default;

package/token-group/index.d.ts

@@ -1,5 +1,8 @@
 /// <reference types="react" />
 import { TokenGroupProps } from './interfaces';
 export { TokenGroupProps };
-export default function TokenGroup({ items, alignment, ...props }: TokenGroupProps): JSX.Element;
-//# sourceMappingURL=index.d.ts.map
+export default function TokenGroup({
+  items,
+  alignment,
+  ...props
+}: TokenGroupProps): JSX.Element;

package/token-group/interfaces.d.ts

@@ -3,81 +3,80 @@ import { IconProps } from '../icon/interfaces';
 import { BaseComponentProps } from '../internal/base-component';
 import { NonCancelableEventHandler } from '../internal/events';
 export interface TokenGroupProps extends BaseComponentProps {
-    /**
-     * An object containing all the necessary localized strings required by the component.
-     * @i18n
-     */
-    i18nStrings?: TokenGroupProps.I18nStrings;
-    /**
-     * Specifies the maximum number of displayed tokens. If the property isn't set, all of the tokens are displayed.
-     */
-    limit?: number;
-    /**
-     * Specifies the direction in which tokens are aligned (`horizontal | vertical`).
-     */
-    alignment?: TokenGroupProps.Alignment;
-    /**
-     * Removes any outer padding from the component.
-     * We recommend to always enable this property.
-     */
-    disableOuterPadding?: boolean;
-    /**
-     *
-     * An array of objects representing token items. Each token has the following properties:
-     *
-     * - `label` (string) - Title text of the token.
-     * - `description` (string) - (Optional) Further information about the token that appears below the label.
-     * - `disabled` [boolean] - (Optional) Determines whether the token is disabled.
-     * - `labelTag` (string) - (Optional) A label tag that provides additional guidance, shown next to the label.
-     * - `tags` [string[]] - (Optional) A list of tags giving further guidance about the token.
-     * - `dismissLabel` (string) - (Optional) Adds an `aria-label` to the dismiss button.
-     * - `iconName` (string) - (Optional) Specifies the name of an [icon](/components/icon/) to display in the token.
-     * - `iconAlt` (string) - (Optional) Specifies alternate text for a custom icon, for use with `iconUrl`.
-     * - `iconUrl` (string) - (Optional) URL of a custom icon.
-     * - `iconSvg` (ReactNode) - (Optional) Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).
-     */
-    items?: ReadonlyArray<TokenGroupProps.Item>;
-    /**
-     *  Called when the user clicks on the dismiss button. The token won't be automatically removed.
-     *  Make sure that you add a listener to this event to update your application state.
-     */
-    onDismiss?: NonCancelableEventHandler<TokenGroupProps.DismissDetail>;
-    /**
-     * Adds an `aria-label` to the "Show fewer" button.
-     * Use to assign unique labels when there are multiple token groups with the same `limitShowFewer` label on one page.
-     */
-    limitShowFewerAriaLabel?: string;
-    /**
-     * Adds an `aria-label` to the "Show more" button.
-     * Use to assign unique labels when there are multiple token groups with the same `limitShowMore` label on one page.
-     */
-    limitShowMoreAriaLabel?: string;
-    /**
-     * Specifies if the control is read-only, which prevents the
-     * user from modifying the value. A read-only control is still focusable.
-     */
-    readOnly?: boolean;
+  /**
+   * An object containing all the necessary localized strings required by the component.
+   * @i18n
+   */
+  i18nStrings?: TokenGroupProps.I18nStrings;
+  /**
+   * Specifies the maximum number of displayed tokens. If the property isn't set, all of the tokens are displayed.
+   */
+  limit?: number;
+  /**
+   * Specifies the direction in which tokens are aligned (`horizontal | vertical`).
+   */
+  alignment?: TokenGroupProps.Alignment;
+  /**
+   * Removes any outer padding from the component.
+   * We recommend to always enable this property.
+   */
+  disableOuterPadding?: boolean;
+  /**
+   *
+   * An array of objects representing token items. Each token has the following properties:
+   *
+   * - `label` (string) - Title text of the token.
+   * - `description` (string) - (Optional) Further information about the token that appears below the label.
+   * - `disabled` [boolean] - (Optional) Determines whether the token is disabled.
+   * - `labelTag` (string) - (Optional) A label tag that provides additional guidance, shown next to the label.
+   * - `tags` [string[]] - (Optional) A list of tags giving further guidance about the token.
+   * - `dismissLabel` (string) - (Optional) Adds an `aria-label` to the dismiss button.
+   * - `iconName` (string) - (Optional) Specifies the name of an [icon](/components/icon/) to display in the token.
+   * - `iconAlt` (string) - (Optional) Specifies alternate text for a custom icon, for use with `iconUrl`.
+   * - `iconUrl` (string) - (Optional) URL of a custom icon.
+   * - `iconSvg` (ReactNode) - (Optional) Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).
+   */
+  items?: ReadonlyArray<TokenGroupProps.Item>;
+  /**
+   *  Called when the user clicks on the dismiss button. The token won't be automatically removed.
+   *  Make sure that you add a listener to this event to update your application state.
+   */
+  onDismiss?: NonCancelableEventHandler<TokenGroupProps.DismissDetail>;
+  /**
+   * Adds an `aria-label` to the "Show fewer" button.
+   * Use to assign unique labels when there are multiple token groups with the same `limitShowFewer` label on one page.
+   */
+  limitShowFewerAriaLabel?: string;
+  /**
+   * Adds an `aria-label` to the "Show more" button.
+   * Use to assign unique labels when there are multiple token groups with the same `limitShowMore` label on one page.
+   */
+  limitShowMoreAriaLabel?: string;
+  /**
+   * Specifies if the control is read-only, which prevents the
+   * user from modifying the value. A read-only control is still focusable.
+   */
+  readOnly?: boolean;
 }
 export declare namespace TokenGroupProps {
-    type Alignment = 'horizontal' | 'vertical';
-    interface Item {
-        label?: string;
-        disabled?: boolean;
-        labelTag?: string;
-        description?: string;
-        iconAlt?: string;
-        iconName?: IconProps.Name;
-        iconUrl?: string;
-        iconSvg?: React.ReactNode;
-        tags?: ReadonlyArray<string>;
-        dismissLabel?: string;
-    }
-    interface DismissDetail {
-        itemIndex: number;
-    }
-    interface I18nStrings {
-        limitShowFewer?: string;
-        limitShowMore?: string;
-    }
-}
-//# sourceMappingURL=interfaces.d.ts.map
+  type Alignment = 'horizontal' | 'vertical';
+  interface Item {
+    label?: string;
+    disabled?: boolean;
+    labelTag?: string;
+    description?: string;
+    iconAlt?: string;
+    iconName?: IconProps.Name;
+    iconUrl?: string;
+    iconSvg?: React.ReactNode;
+    tags?: ReadonlyArray<string>;
+    dismissLabel?: string;
+  }
+  interface DismissDetail {
+    itemIndex: number;
+  }
+  interface I18nStrings {
+    limitShowFewer?: string;
+    limitShowMore?: string;
+  }
+}

package/token-group/internal.d.ts

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