@cloudscape-design/components-themeable 3.0.785 → 3.0.787

package/lib/internal/template/collection-preferences/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/collection-preferences/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { BaseModalProps } from '../modal/interfaces';\n\nexport interface CollectionPreferencesProps<CustomPreferenceType = any> extends BaseComponentProps, BaseModalProps {\n  /**\n   * Specifies the title of the preferences modal dialog. It is also used as an `aria-label` for the trigger button.\n   * @i18n\n   */\n  title?: string;\n  /**\n   * Label of the confirm button in the modal footer.\n   * @i18n\n   */\n  confirmLabel?: string;\n  /**\n   * Label of the cancel button in the modal footer.\n   * @i18n\n   */\n  cancelLabel?: string;\n  /**\n   * Determines whether the preferences trigger button is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Configures the built-in \"page size selection\" preference.\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `title` (string) - Specifies the text displayed at the top of the preference.\n   * - `options` - Specifies an array of options for page size selection. Each entry contains:\n   *   - `value` (number) - The value for the radio button (that is, the number of items per page).\n   *   - `label` (string) - A label for the radio button (for example, \"10 resources\").\n   *\n   * You must set the current value in the `preferences.pageSize` property.\n   * @i18n\n   */\n  pageSizePreference?: CollectionPreferencesProps.PageSizePreference;\n  /**\n   * Configures the built-in \"wrap lines\" preference.\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for the option checkbox.\n   * - `description` (string) - Specifies the text displayed below the checkbox label.\n   *\n   * You must set the current value in the `preferences.wrapLines` property.\n   * @i18n\n   */\n  wrapLinesPreference?: CollectionPreferencesProps.WrapLinesPreference;\n  /**\n   * Configures the built-in \"striped rows\" preference.\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for the option checkbox.\n   * - `description` (string) - Specifies the text displayed below the checkbox label.\n   *\n   * You must set the current value in the `preferences.stripedRows` property.\n   * @i18n\n   */\n  stripedRowsPreference?: CollectionPreferencesProps.StripedRowsPreference;\n  /**\n   * Configures the content density preference (Comfortable / Compact).\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for the option checkbox.\n   * - `description` (string) - Specifies the text displayed below the checkbox label.\n   *\n   * You must set the current value in the `preferences.contentDensity` property.\n   * @i18n\n   */\n  contentDensityPreference?: CollectionPreferencesProps.ContentDensityPreference;\n  /**\n   * Configures the sticky columns preference.\n   *\n   * You can set it for both left and right columns.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for each radio group.\n   * - `description` (string) - Specifies the text displayed below each radio group label.\n   *\n   * You must set the current value in the `preferences.stickyColumns` property.\n   */\n  stickyColumnsPreference?: CollectionPreferencesProps.StickyColumnsPreference;\n  /**\n   * Configures the built-in content display preference for order and visibility of columns in a table.\n   *\n   * Once set, the component displays this preference in the modal.\n   * Cannot be used together with `visibleContentPreference`.\n   *\n   * It contains the following:\n   * - `title` (string) - Specifies the text displayed at the top of the preference.\n   * - `description` (string) - Specifies the description displayed below the title.\n   * - `liveAnnouncementDndStarted` ((position: number, total: number) => string) - (Optional) Adds a message to be announced by screen readers when an option is picked.\n   * - `liveAnnouncementDndDiscarded` (string) - (Optional) Adds a message to be announced by screen readers when a reordering action is canceled.\n   * - `liveAnnouncementDndItemReordered` ((initialPosition: number, currentPosition: number, total: number) => string) - (Optional) Adds a message to be announced by screen readers when an item is being moved.\n   * - `liveAnnouncementDndItemCommitted` ((initialPosition: number, finalPosition: number, total: number) => string) - (Optional) Adds a message to be announced by screen readers when a reordering action is committed.\n   * - `dragHandleAriaDescription` (string) - (Optional) Adds an ARIA description for the drag handle.\n   * - `dragHandleAriaLabel` (string) - (Optional) Adds an ARIA label for the drag handle.\n   * - `options` - Specifies an array of options for reordering and visible content selection.\n   *\n   * Each option contains the following:\n   * - `id` (string) - Corresponds to a table column `id`.\n   * - `label` (string) - Specifies a short description of the content.\n   * - `alwaysVisible` (boolean) - (Optional) Determines whether the visibility is always on and therefore cannot be toggled. This is set to `false` by default.\n   *\n   * You must provide an ordered list of the items to display in the `preferences.contentDisplay` property.\n   * @i18n\n   */\n  contentDisplayPreference?: CollectionPreferencesProps.ContentDisplayPreference;\n  /**\n   * Configures the built-in \"visible content selection\" preference (for example, visible sections in cards).\n   *\n   * If you set it, the component displays this preference in the modal.\n   * Cannot be used together with `contentDisplayPreference`.\n   *\n   * It contains the following:\n   * - `title` (string) - Specifies the text displayed at the top of the preference.\n   * - `options` - Specifies an array of groups of options for visible content selection.\n   *\n   * Each group of options contains the following:\n   * - `label` (string) - The text to display as a title for the options group.\n   * - `options` - Specifies an aray of options in the group. Each option contains the following:\n   *   - `id` (string) - Corresponds to a column `id` for tables or to a section `id` for cards.\n   *   - `label` (string) - Specifies a short description of the content.\n   *   - `editable` (boolean) - (Optional) Determines whether the user is able to toggle its visibility. This is `true` by default.\n   *\n   * You must set the current list of visible content `id`s in the `preferences.visibleContent` property.\n   *\n   * **Deprecated** in table, replaced by `contentDisplayPreference`.\n   */\n  visibleContentPreference?: CollectionPreferencesProps.VisibleContentPreference;\n  /**\n   * Specifies the current preference values. This includes both built-in and custom preferences.\n   *\n   * It contains the following:\n   * - `pageSize` (number) - (Optional)\n   * - `wrapLines` (boolean) - (Optional)\n   * - `contentDisplay` (ReadonlyArray<ContentDisplayItem>) - (Optional) Specifies the list of content and their visibility. The order of the elements influences the display.\n   * - `visibleContent` (ReadonlyArray<string>) - Specifies the list of visible content `id`s. The order of the `id`s does not influence the display. If the `contentDisplay` property is set, this property is ignored.\n   * - `custom` (CustomPreferenceType) - Specifies the value for your custom preference.\n   */\n  preferences?: CollectionPreferencesProps.Preferences<CustomPreferenceType>;\n  /**\n   * Configures custom preferences. The function receives two parameters:\n   *\n   * - `customValue` (CustomPreferenceType) - Current value for your custom preference. It is initialized using the value you provide in `preferences.custom`.\n   * - `setCustomValue` - A function that is called to notify a state update.\n   *\n   * It should return the content of your custom preference, for example:\n   * ```\n   * (customValue, setCustomValue) => (\n   *   <Checkbox checked={customValue} onChange={({ detail }) => setCustomValue(detail.checked)} />\n   * )\n   * ```\n   *\n   * When the user confirms the changes, the new value is passed in the `detail.custom` property of the `onConfirm` listener.\n   * When the user cancels the changes, the `customValue` is reset to the one present in `preferences.custom` property.\n   *\n   * **Display**\n   * - If any of the built-in preferences (`pageSizePreference`, `wrapLinesPreference`, or `visibleContentPreference`) are displayed,\n   * the custom content is displayed at the bottom of the left column within the modal.\n   * - If no built-in preference is displayed, the custom content occupies the whole modal.\n   */\n  customPreference?: (\n    customValue: CustomPreferenceType,\n    setCustomValue: React.Dispatch<CustomPreferenceType>\n  ) => React.ReactNode;\n  /**\n   * Called when the user cancels a preference change using the cancel button in the modal footer or by dismissing the modal.\n   */\n  onCancel?: NonCancelableEventHandler;\n  /**\n   * Called when the user confirms a preference change using the confirm button in the modal footer.\n   *\n   * The event `detail` contains the following:\n   * - `contentDensity` (boolean) - (Optional) The current content density preference value. Available only if you specify the `contentDensityPreference` property.\n   * - `contentDisplay` (ReadonlyArray<ContentDisplayItem>) - (Optional) The ordered list of table columns and their visibility. Available only if you specify the `contentDisplayPreference` property.\n   * - `custom` (CustomPreferenceType) - (Optional) The selected value for your custom preference.\n   * - `pageSize` (number) - (Optional) The selected page size value. Available only if you specify the `pageSizePreference` property.\n   * - `stickyColumns` (CollectionPreferencesProps.StickyColumns) - (Optional) The current sticky columns preference value. Available only if you specify the `stickyColumnsPreference` property.\n   * - `stripedRows` (boolean) - (Optional) The current striped rows preference value. Available only if you specify the `stripedRowsPreference` property.\n   * - `visibleContent` (ReadonlyArray<string>) - (Optional) The list of selected content `id`s. Available only if you specify the `visibleContentPreference` property.\n   * - `wrapLines` (boolean) - (Optional) The current line wrapping preference value. Available only if you specify the `wrapLinesPreference` property.\n   *\n   * The values for all configured preferences are present even if the user didn't change their values.\n   */\n  onConfirm?: NonCancelableEventHandler<CollectionPreferencesProps.Preferences<CustomPreferenceType>>;\n}\n\nexport namespace CollectionPreferencesProps {\n  export interface Preferences<CustomPreferenceType = any> {\n    pageSize?: number;\n    wrapLines?: boolean;\n    stripedRows?: boolean;\n    contentDensity?: 'comfortable' | 'compact';\n    visibleContent?: ReadonlyArray<string>;\n    stickyColumns?: StickyColumns;\n    contentDisplay?: ReadonlyArray<ContentDisplayItem>;\n    custom?: CustomPreferenceType;\n  }\n\n  export interface ContentDisplayPreference {\n    title?: string;\n    description?: string;\n    options: ReadonlyArray<CollectionPreferencesProps.ContentDisplayOption>;\n    liveAnnouncementDndStarted?: (position: number, total: number) => string;\n    liveAnnouncementDndItemReordered?: (initialPosition: number, currentPosition: number, total: number) => string;\n    liveAnnouncementDndItemCommitted?: (initialPosition: number, finalPosition: number, total: number) => string;\n    liveAnnouncementDndDiscarded?: string;\n    dragHandleAriaLabel?: string;\n    dragHandleAriaDescription?: string;\n  }\n\n  export interface ContentDisplayOption {\n    id: string;\n    label: string;\n    alwaysVisible?: boolean;\n  }\n\n  export interface ContentDisplayItem {\n    id: string;\n    visible: boolean;\n  }\n\n  export interface VisibleContentPreference {\n    title: string;\n    options: ReadonlyArray<CollectionPreferencesProps.VisibleContentOptionsGroup>;\n  }\n\n  export interface VisibleContentOptionsGroup {\n    label: string;\n    options: ReadonlyArray<CollectionPreferencesProps.VisibleContentOption>;\n  }\n\n  export interface VisibleContentOption {\n    id: string;\n    label: string;\n    editable?: boolean;\n  }\n\n  export interface PageSizePreference {\n    title?: string;\n    options: ReadonlyArray<PageSizeOption>;\n  }\n\n  export interface PageSizeOption {\n    value: number;\n    label?: string;\n  }\n\n  export interface WrapLinesPreference {\n    label?: string;\n    description?: string;\n  }\n\n  export interface StripedRowsPreference {\n    label?: string;\n    description?: string;\n  }\n\n  export interface ContentDensityPreference {\n    label?: string;\n    description?: string;\n  }\n\n  interface StickyColumns {\n    first?: number;\n    last?: number;\n  }\n\n  interface StickyColumnPreference {\n    title: string;\n    description: string;\n    options: ReadonlyArray<{\n      label: string;\n      value: number;\n    }>;\n  }\n  export interface StickyColumnsPreference {\n    firstColumns?: StickyColumnPreference;\n    lastColumns?: StickyColumnPreference;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/collection-preferences/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { BaseModalProps } from '../modal/interfaces';\n\nexport interface CollectionPreferencesProps<CustomPreferenceType = any> extends BaseComponentProps, BaseModalProps {\n  /**\n   * Specifies the title of the preferences modal dialog. It is also used as an `aria-label` for the trigger button.\n   * @i18n\n   */\n  title?: string;\n  /**\n   * Label of the confirm button in the modal footer.\n   * @i18n\n   */\n  confirmLabel?: string;\n  /**\n   * Label of the cancel button in the modal footer.\n   * @i18n\n   */\n  cancelLabel?: string;\n  /**\n   * Determines whether the preferences trigger button is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Configures the built-in \"page size selection\" preference.\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `title` (string) - Specifies the text displayed at the top of the preference.\n   * - `options` - Specifies an array of options for page size selection. Each entry contains:\n   *   - `value` (number) - The value for the radio button (that is, the number of items per page).\n   *   - `label` (string) - A label for the radio button (for example, \"10 resources\").\n   *\n   * You must set the current value in the `preferences.pageSize` property.\n   * @i18n\n   */\n  pageSizePreference?: CollectionPreferencesProps.PageSizePreference;\n  /**\n   * Configures the built-in \"wrap lines\" preference.\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for the option checkbox.\n   * - `description` (string) - Specifies the text displayed below the checkbox label.\n   *\n   * You must set the current value in the `preferences.wrapLines` property.\n   * @i18n\n   */\n  wrapLinesPreference?: CollectionPreferencesProps.WrapLinesPreference;\n  /**\n   * Configures the built-in \"striped rows\" preference.\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for the option checkbox.\n   * - `description` (string) - Specifies the text displayed below the checkbox label.\n   *\n   * You must set the current value in the `preferences.stripedRows` property.\n   * @i18n\n   */\n  stripedRowsPreference?: CollectionPreferencesProps.StripedRowsPreference;\n  /**\n   * Configures the content density preference (Comfortable / Compact).\n   *\n   * If you set it, the component displays this preference in the modal.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for the option checkbox.\n   * - `description` (string) - Specifies the text displayed below the checkbox label.\n   *\n   * You must set the current value in the `preferences.contentDensity` property.\n   * @i18n\n   */\n  contentDensityPreference?: CollectionPreferencesProps.ContentDensityPreference;\n  /**\n   * Configures the sticky columns preference.\n   *\n   * You can set it for both left and right columns.\n   *\n   * It contains the following:\n   * - `label` (string) - Specifies the label for each radio group.\n   * - `description` (string) - Specifies the text displayed below each radio group label.\n   *\n   * You must set the current value in the `preferences.stickyColumns` property.\n   */\n  stickyColumnsPreference?: CollectionPreferencesProps.StickyColumnsPreference;\n  /**\n   * Configures the built-in content display preference for order and visibility of columns in a table.\n   *\n   * Once set, the component displays this preference in the modal.\n   * Cannot be used together with `visibleContentPreference`.\n   *\n   * It contains the following:\n   * - `title` (string) - Specifies the text displayed at the top of the preference.\n   * - `description` (string) - Specifies the description displayed below the title.\n   * - `liveAnnouncementDndStarted` ((position: number, total: number) => string) - (Optional) Adds a message to be announced by screen readers when an option is picked.\n   * - `liveAnnouncementDndDiscarded` (string) - (Optional) Adds a message to be announced by screen readers when a reordering action is canceled.\n   * - `liveAnnouncementDndItemReordered` ((initialPosition: number, currentPosition: number, total: number) => string) - (Optional) Adds a message to be announced by screen readers when an item is being moved.\n   * - `liveAnnouncementDndItemCommitted` ((initialPosition: number, finalPosition: number, total: number) => string) - (Optional) Adds a message to be announced by screen readers when a reordering action is committed.\n   * - `dragHandleAriaDescription` (string) - (Optional) Adds an ARIA description for the drag handle.\n   * - `dragHandleAriaLabel` (string) - (Optional) Adds an ARIA label for the drag handle.\n   * - `options` - Specifies an array of options for reordering and visible content selection.\n   *\n   * Each option contains the following:\n   * - `id` (string) - Corresponds to a table column `id`.\n   * - `label` (string) - Specifies a short description of the content.\n   * - `alwaysVisible` (boolean) - (Optional) Determines whether the visibility is always on and therefore cannot be toggled. This is set to `false` by default.\n   *\n   * You must provide an ordered list of the items to display in the `preferences.contentDisplay` property.\n   * @i18n\n   */\n  contentDisplayPreference?: CollectionPreferencesProps.ContentDisplayPreference;\n  /**\n   * Configures the built-in \"visible content selection\" preference (for example, visible sections in cards).\n   *\n   * If you set it, the component displays this preference in the modal.\n   * Cannot be used together with `contentDisplayPreference`.\n   *\n   * It contains the following:\n   * - `title` (string) - Specifies the text displayed at the top of the preference.\n   * - `options` - Specifies an array of groups of options for visible content selection.\n   *\n   * Each group of options contains the following:\n   * - `label` (string) - The text to display as a title for the options group.\n   * - `options` - Specifies an aray of options in the group. Each option contains the following:\n   *   - `id` (string) - Corresponds to a column `id` for tables or to a section `id` for cards.\n   *   - `label` (string) - Specifies a short description of the content.\n   *   - `editable` (boolean) - (Optional) Determines whether the user is able to toggle its visibility. This is `true` by default.\n   *\n   * You must set the current list of visible content `id`s in the `preferences.visibleContent` property.\n   *\n   * **Deprecated** in table, replaced by `contentDisplayPreference`.\n   */\n  visibleContentPreference?: CollectionPreferencesProps.VisibleContentPreference;\n  /**\n   * Specifies the current preference values. This includes both built-in and custom preferences.\n   *\n   * It contains the following:\n   * - `pageSize` (number) - (Optional)\n   * - `wrapLines` (boolean) - (Optional)\n   * - `contentDisplay` (ReadonlyArray<ContentDisplayItem>) - (Optional) Specifies the list of content and their visibility. The order of the elements influences the display.\n   * - `visibleContent` (ReadonlyArray<string>) - Specifies the list of visible content `id`s. The order of the `id`s does not influence the display. If the `contentDisplay` property is set, this property is ignored.\n   * - `custom` (CustomPreferenceType) - Specifies the value for your custom preference.\n   */\n  preferences?: CollectionPreferencesProps.Preferences<CustomPreferenceType>;\n  /**\n   * Configures custom preferences. The function receives two parameters:\n   *\n   * - `customValue` (CustomPreferenceType) - Current value for your custom preference. It is initialized using the value you provide in `preferences.custom`.\n   * - `setCustomValue` - A function that is called to notify a state update.\n   *\n   * It should return the content of your custom preference, for example:\n   * ```\n   * (customValue, setCustomValue) => (\n   *   <Checkbox checked={customValue} onChange={({ detail }) => setCustomValue(detail.checked)} />\n   * )\n   * ```\n   *\n   * When the user confirms the changes, the new value is passed in the `detail.custom` property of the `onConfirm` listener.\n   * When the user cancels the changes, the `customValue` is reset to the one present in `preferences.custom` property.\n   *\n   * **Display**\n   * - If any of the built-in preferences (`pageSizePreference`, `wrapLinesPreference`, or `visibleContentPreference`) are displayed,\n   * the custom content is displayed at the bottom of the left column within the modal.\n   * - If no built-in preference is displayed, the custom content occupies the whole modal.\n   */\n  customPreference?: (\n    customValue: CustomPreferenceType,\n    setCustomValue: React.Dispatch<CustomPreferenceType>\n  ) => React.ReactNode;\n  /**\n   * Called when the user cancels a preference change using the cancel button in the modal footer or by dismissing the modal.\n   */\n  onCancel?: NonCancelableEventHandler;\n  /**\n   * Called when the user confirms a preference change using the confirm button in the modal footer.\n   *\n   * The event `detail` contains the following:\n   * - `contentDensity` (boolean) - (Optional) The current content density preference value. Available only if you specify the `contentDensityPreference` property.\n   * - `contentDisplay` (ReadonlyArray<ContentDisplayItem>) - (Optional) The ordered list of table columns and their visibility. Available only if you specify the `contentDisplayPreference` property.\n   * - `custom` (CustomPreferenceType) - (Optional) The selected value for your custom preference.\n   * - `pageSize` (number) - (Optional) The selected page size value. Available only if you specify the `pageSizePreference` property.\n   * - `stickyColumns` (CollectionPreferencesProps.StickyColumns) - (Optional) The current sticky columns preference value. Available only if you specify the `stickyColumnsPreference` property.\n   * - `stripedRows` (boolean) - (Optional) The current striped rows preference value. Available only if you specify the `stripedRowsPreference` property.\n   * - `visibleContent` (ReadonlyArray<string>) - (Optional) The list of selected content `id`s. Available only if you specify the `visibleContentPreference` property.\n   * - `wrapLines` (boolean) - (Optional) The current line wrapping preference value. Available only if you specify the `wrapLinesPreference` property.\n   *\n   * The values for all configured preferences are present even if the user didn't change their values.\n   */\n  onConfirm?: NonCancelableEventHandler<CollectionPreferencesProps.Preferences<CustomPreferenceType>>;\n}\n\nexport namespace CollectionPreferencesProps {\n  export interface Preferences<CustomPreferenceType = any> {\n    pageSize?: number;\n    wrapLines?: boolean;\n    stripedRows?: boolean;\n    contentDensity?: 'comfortable' | 'compact';\n    visibleContent?: ReadonlyArray<string>;\n    stickyColumns?: StickyColumns;\n    contentDisplay?: ReadonlyArray<ContentDisplayItem>;\n    custom?: CustomPreferenceType;\n  }\n\n  export interface ContentDisplayPreference {\n    title?: string;\n    description?: string;\n    options: ReadonlyArray<CollectionPreferencesProps.ContentDisplayOption>;\n    liveAnnouncementDndStarted?: (position: number, total: number) => string;\n    liveAnnouncementDndItemReordered?: (initialPosition: number, currentPosition: number, total: number) => string;\n    liveAnnouncementDndItemCommitted?: (initialPosition: number, finalPosition: number, total: number) => string;\n    liveAnnouncementDndDiscarded?: string;\n    dragHandleAriaLabel?: string;\n    dragHandleAriaDescription?: string;\n    enableColumnFiltering?: boolean;\n    i18nStrings?: ContentDisplayPreferenceI18nStrings;\n  }\n\n  export interface ContentDisplayOption {\n    id: string;\n    label: string;\n    alwaysVisible?: boolean;\n  }\n\n  export interface ContentDisplayItem {\n    id: string;\n    visible: boolean;\n  }\n\n  export interface VisibleContentPreference {\n    title: string;\n    options: ReadonlyArray<CollectionPreferencesProps.VisibleContentOptionsGroup>;\n  }\n\n  export interface VisibleContentOptionsGroup {\n    label: string;\n    options: ReadonlyArray<CollectionPreferencesProps.VisibleContentOption>;\n  }\n\n  export interface VisibleContentOption {\n    id: string;\n    label: string;\n    editable?: boolean;\n  }\n\n  export interface PageSizePreference {\n    title?: string;\n    options: ReadonlyArray<PageSizeOption>;\n  }\n\n  export interface PageSizeOption {\n    value: number;\n    label?: string;\n  }\n\n  export interface WrapLinesPreference {\n    label?: string;\n    description?: string;\n  }\n\n  export interface StripedRowsPreference {\n    label?: string;\n    description?: string;\n  }\n\n  export interface ContentDensityPreference {\n    label?: string;\n    description?: string;\n  }\n\n  interface StickyColumns {\n    first?: number;\n    last?: number;\n  }\n\n  interface StickyColumnPreference {\n    title: string;\n    description: string;\n    options: ReadonlyArray<{\n      label: string;\n      value: number;\n    }>;\n  }\n  export interface StickyColumnsPreference {\n    firstColumns?: StickyColumnPreference;\n    lastColumns?: StickyColumnPreference;\n  }\n\n  export interface ContentDisplayPreferenceI18nStrings {\n    /**\n     * Specifies a `placeholder` for the filtering input.\n     * @i18n\n     */\n    columnFilteringPlaceholder?: string;\n\n    /**\n     * Specifies an `aria-label` for the filtering input.\n     * @i18n\n     */\n    columnFilteringAriaLabel?: string;\n\n    /**\n     * Specifies the `count text` for the filtering input to reflect matches found.\n     * @i18n\n     */\n    columnFilteringCountText?: (count: number) => string;\n\n    /**\n     * Specifies the `no match` text for when there are no matching options in the filtering.\n     * @i18n\n     */\n    columnFilteringNoMatchText?: string;\n\n    /**\n     * Specifies both an `aria-label` for the clear filtering input action and the `clear filter button` text for the no match button.\n     * @i18n\n     */\n    columnFilteringClearFilterText?: string;\n  }\n}\n"]}

package/lib/internal/template/collection-preferences/styles.css.js

@@ -1,42 +1,44 @@
 
     import './styles.scoped.css';
     export default {
-  "visible-content": "awsui_visible-content_tc96w_1dvoj_281",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_1dvoj_282",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_1dvoj_283",
-  "visible-content-group": "awsui_visible-content-group_tc96w_1dvoj_283",
-  "visible-content-title": "awsui_visible-content-title_tc96w_1dvoj_288",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_1dvoj_298",
-  "visible-content-option": "awsui_visible-content-option_tc96w_1dvoj_304",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_1dvoj_317",
-  "content-display-option-toggle": "awsui_content-display-option-toggle_tc96w_1dvoj_604",
-  "content-display-option-content": "awsui_content-display-option-content_tc96w_1dvoj_608",
-  "content-display-option": "awsui_content-display-option_tc96w_1dvoj_604",
-  "placeholder": "awsui_placeholder_tc96w_1dvoj_658",
-  "sorting": "awsui_sorting_tc96w_1dvoj_658",
-  "content-display-option-label": "awsui_content-display-option-label_tc96w_1dvoj_685",
-  "drag-overlay": "awsui_drag-overlay_tc96w_1dvoj_692",
-  "content-display": "awsui_content-display_tc96w_1dvoj_604",
-  "content-display-title": "awsui_content-display-title_tc96w_1dvoj_725",
-  "content-display-description": "awsui_content-display-description_tc96w_1dvoj_734",
-  "content-display-option-list": "awsui_content-display-option-list_tc96w_1dvoj_742",
-  "root": "awsui_root_tc96w_1dvoj_749",
-  "modal-root": "awsui_modal-root_tc96w_1dvoj_750",
-  "trigger-button": "awsui_trigger-button_tc96w_1dvoj_751",
-  "cancel-button": "awsui_cancel-button_tc96w_1dvoj_752",
-  "confirm-button": "awsui_confirm-button_tc96w_1dvoj_753",
-  "custom": "awsui_custom_tc96w_1dvoj_754",
-  "second-column-small": "awsui_second-column-small_tc96w_1dvoj_758",
-  "wrap-lines": "awsui_wrap-lines_tc96w_1dvoj_762",
-  "striped-rows": "awsui_striped-rows_tc96w_1dvoj_763",
-  "content-density": "awsui_content-density_tc96w_1dvoj_764",
-  "page-size": "awsui_page-size_tc96w_1dvoj_765",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_1dvoj_766",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_1dvoj_767",
-  "sticky-columns": "awsui_sticky-columns_tc96w_1dvoj_768",
-  "sticky-columns-form-field": "awsui_sticky-columns-form-field_tc96w_1dvoj_769",
-  "sticky-columns-radio-group": "awsui_sticky-columns-radio-group_tc96w_1dvoj_770",
-  "sticky-columns-first": "awsui_sticky-columns-first_tc96w_1dvoj_771",
-  "sticky-columns-last": "awsui_sticky-columns-last_tc96w_1dvoj_772"
+  "visible-content": "awsui_visible-content_tc96w_zaew1_281",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_zaew1_282",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_zaew1_283",
+  "visible-content-group": "awsui_visible-content-group_tc96w_zaew1_283",
+  "visible-content-title": "awsui_visible-content-title_tc96w_zaew1_288",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_zaew1_298",
+  "visible-content-option": "awsui_visible-content-option_tc96w_zaew1_304",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_zaew1_317",
+  "content-display-option-toggle": "awsui_content-display-option-toggle_tc96w_zaew1_604",
+  "content-display-option-content": "awsui_content-display-option-content_tc96w_zaew1_608",
+  "content-display-option": "awsui_content-display-option_tc96w_zaew1_604",
+  "placeholder": "awsui_placeholder_tc96w_zaew1_658",
+  "sorting": "awsui_sorting_tc96w_zaew1_658",
+  "content-display-option-label": "awsui_content-display-option-label_tc96w_zaew1_685",
+  "drag-overlay": "awsui_drag-overlay_tc96w_zaew1_692",
+  "content-display": "awsui_content-display_tc96w_zaew1_604",
+  "content-display-text-filter": "awsui_content-display-text-filter_tc96w_zaew1_722",
+  "content-display-no-match": "awsui_content-display-no-match_tc96w_zaew1_723",
+  "content-display-title": "awsui_content-display-title_tc96w_zaew1_727",
+  "content-display-description": "awsui_content-display-description_tc96w_zaew1_736",
+  "content-display-option-list": "awsui_content-display-option-list_tc96w_zaew1_744",
+  "root": "awsui_root_tc96w_zaew1_751",
+  "modal-root": "awsui_modal-root_tc96w_zaew1_752",
+  "trigger-button": "awsui_trigger-button_tc96w_zaew1_753",
+  "cancel-button": "awsui_cancel-button_tc96w_zaew1_754",
+  "confirm-button": "awsui_confirm-button_tc96w_zaew1_755",
+  "custom": "awsui_custom_tc96w_zaew1_756",
+  "second-column-small": "awsui_second-column-small_tc96w_zaew1_760",
+  "wrap-lines": "awsui_wrap-lines_tc96w_zaew1_764",
+  "striped-rows": "awsui_striped-rows_tc96w_zaew1_765",
+  "content-density": "awsui_content-density_tc96w_zaew1_766",
+  "page-size": "awsui_page-size_tc96w_zaew1_767",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_zaew1_768",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_zaew1_769",
+  "sticky-columns": "awsui_sticky-columns_tc96w_zaew1_770",
+  "sticky-columns-form-field": "awsui_sticky-columns-form-field_tc96w_zaew1_771",
+  "sticky-columns-radio-group": "awsui_sticky-columns-radio-group_tc96w_zaew1_772",
+  "sticky-columns-first": "awsui_sticky-columns-first_tc96w_zaew1_773",
+  "sticky-columns-last": "awsui_sticky-columns-last_tc96w_zaew1_774"
 };
   

package/lib/internal/template/collection-preferences/styles.scoped.css

@@ -278,14 +278,14 @@ 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_visible-content_tc96w_1dvoj_281:not(#\9),
-.awsui_visible-content-toggle_tc96w_1dvoj_282:not(#\9),
-.awsui_visible-content-groups_tc96w_1dvoj_283:not(#\9),
-.awsui_visible-content-group_tc96w_1dvoj_283:not(#\9) {
+.awsui_visible-content_tc96w_zaew1_281:not(#\9),
+.awsui_visible-content-toggle_tc96w_zaew1_282:not(#\9),
+.awsui_visible-content-groups_tc96w_zaew1_283:not(#\9),
+.awsui_visible-content-group_tc96w_zaew1_283:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_visible-content-title_tc96w_1dvoj_288:not(#\9) {
+.awsui_visible-content-title_tc96w_zaew1_288:not(#\9) {
   font-size: var(--font-size-body-m-6wxxs5, 14px);
   line-height: var(--line-height-body-m-gw0130, 22px);
   font-weight: var(--font-display-label-weight-5p8eav, 400);
@@ -295,13 +295,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline: 0;
 }
 
-.awsui_visible-content-group-label_tc96w_1dvoj_298:not(#\9) {
+.awsui_visible-content-group-label_tc96w_zaew1_298:not(#\9) {
   color: var(--color-text-group-label-eorpbe, #545b64);
   padding-block-end: var(--space-xs-6dgkww, 8px);
   border-block-end: var(--border-divider-list-width-x6rz7e, 1px) solid var(--color-border-divider-secondary-1xu6lb, #eaeded);
 }
 
-.awsui_visible-content-option_tc96w_1dvoj_304:not(#\9) {
+.awsui_visible-content-option_tc96w_zaew1_304:not(#\9) {
   display: flex;
   flex-wrap: nowrap;
   justify-content: space-between;
@@ -310,11 +310,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline-end: 0px;
   border-block-end: var(--border-divider-list-width-x6rz7e, 1px) solid var(--color-border-divider-secondary-1xu6lb, #eaeded);
 }
-.awsui_visible-content-option_tc96w_1dvoj_304:not(#\9):last-child {
+.awsui_visible-content-option_tc96w_zaew1_304:not(#\9):last-child {
   border-block-end: none;
 }
 
-.awsui_visible-content-option-label_tc96w_1dvoj_317:not(#\9) {
+.awsui_visible-content-option-label_tc96w_zaew1_317:not(#\9) {
   overflow: hidden;
   text-overflow: ellipsis;
   padding-inline-end: var(--space-l-eenfqd, 20px);
@@ -601,11 +601,11 @@ 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_content-display-option-toggle_tc96w_1dvoj_604:not(#\9) {
+.awsui_content-display-option-toggle_tc96w_zaew1_604:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_content-display-option-content_tc96w_1dvoj_608:not(#\9) {
+.awsui_content-display-option-content_tc96w_zaew1_608:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -651,28 +651,28 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-item-q4wr0w, 0px);
 }
 
-.awsui_content-display-option_tc96w_1dvoj_604:not(#\9) {
+.awsui_content-display-option_tc96w_zaew1_604:not(#\9) {
   list-style: none;
   position: relative;
   border-block-start: var(--border-divider-list-width-x6rz7e, 1px) solid var(--color-border-divider-secondary-1xu6lb, #eaeded);
 }
-.awsui_content-display-option_tc96w_1dvoj_604:not(#\9):not(.awsui_placeholder_tc96w_1dvoj_658).awsui_sorting_tc96w_1dvoj_658 {
+.awsui_content-display-option_tc96w_zaew1_604:not(#\9):not(.awsui_placeholder_tc96w_zaew1_658).awsui_sorting_tc96w_zaew1_658 {
   transition: transform var(--motion-duration-transition-quick-1ym1ir, 90ms) var(--motion-easing-transition-quick-c2tqbv, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_content-display-option_tc96w_1dvoj_604:not(#\9):not(.awsui_placeholder_tc96w_1dvoj_658).awsui_sorting_tc96w_1dvoj_658 {
+  .awsui_content-display-option_tc96w_zaew1_604:not(#\9):not(.awsui_placeholder_tc96w_zaew1_658).awsui_sorting_tc96w_zaew1_658 {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_content-display-option_tc96w_1dvoj_604:not(#\9):not(.awsui_placeholder_tc96w_1dvoj_658).awsui_sorting_tc96w_1dvoj_658, .awsui-mode-entering .awsui_content-display-option_tc96w_1dvoj_604:not(#\9):not(.awsui_placeholder_tc96w_1dvoj_658).awsui_sorting_tc96w_1dvoj_658 {
+.awsui-motion-disabled .awsui_content-display-option_tc96w_zaew1_604:not(#\9):not(.awsui_placeholder_tc96w_zaew1_658).awsui_sorting_tc96w_zaew1_658, .awsui-mode-entering .awsui_content-display-option_tc96w_zaew1_604:not(#\9):not(.awsui_placeholder_tc96w_zaew1_658).awsui_sorting_tc96w_zaew1_658 {
   animation: none;
   transition: none;
 }
-.awsui_content-display-option_tc96w_1dvoj_604.awsui_placeholder_tc96w_1dvoj_658 > .awsui_content-display-option-content_tc96w_1dvoj_608:not(#\9) {
+.awsui_content-display-option_tc96w_zaew1_604.awsui_placeholder_tc96w_zaew1_658 > .awsui_content-display-option-content_tc96w_zaew1_608:not(#\9) {
   position: relative;
 }
-.awsui_content-display-option_tc96w_1dvoj_604.awsui_placeholder_tc96w_1dvoj_658 > .awsui_content-display-option-content_tc96w_1dvoj_608:not(#\9):after {
+.awsui_content-display-option_tc96w_zaew1_604.awsui_placeholder_tc96w_zaew1_658 > .awsui_content-display-option-content_tc96w_zaew1_608:not(#\9):after {
   content: " ";
   position: absolute;
   inset: 0;
@@ -683,28 +683,28 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-item-q4wr0w, 0px);
 }
 
-.awsui_content-display-option-label_tc96w_1dvoj_685:not(#\9) {
+.awsui_content-display-option-label_tc96w_zaew1_685:not(#\9) {
   flex-grow: 1;
   min-inline-size: 0;
   word-break: break-word;
   padding-inline-end: var(--space-l-eenfqd, 20px);
 }
 
-.awsui_drag-overlay_tc96w_1dvoj_692:not(#\9) {
+.awsui_drag-overlay_tc96w_zaew1_692:not(#\9) {
   box-shadow: var(--shadow-container-active-b0dn3h, 0px 4px 8px rgba(0, 28, 36, 0.45));
   border-start-start-radius: var(--border-radius-item-q4wr0w, 0px);
   border-start-end-radius: var(--border-radius-item-q4wr0w, 0px);
   border-end-start-radius: var(--border-radius-item-q4wr0w, 0px);
   border-end-end-radius: var(--border-radius-item-q4wr0w, 0px);
 }
-body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_1dvoj_692:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_zaew1_692:not(#\9) {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_1dvoj_692:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_zaew1_692:not(#\9) {
   outline: 2px dotted transparent;
   outline-offset: calc(0px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_1dvoj_692:not(#\9)::before {
+body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_zaew1_692:not(#\9)::before {
   content: " ";
   display: block;
   position: absolute;
@@ -719,11 +719,13 @@ body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_1dvoj_692:not(#\9)
   box-shadow: 0 0 0 2px var(--color-border-item-focused-q68bgg, #0073bb);
 }
 
-.awsui_content-display_tc96w_1dvoj_604:not(#\9) {
+.awsui_content-display_tc96w_zaew1_604:not(#\9),
+.awsui_content-display-text-filter_tc96w_zaew1_722:not(#\9),
+.awsui_content-display-no-match_tc96w_zaew1_723:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_content-display-title_tc96w_1dvoj_725:not(#\9) {
+.awsui_content-display-title_tc96w_zaew1_727:not(#\9) {
   font-size: var(--font-size-body-m-6wxxs5, 14px);
   line-height: var(--line-height-body-m-gw0130, 22px);
   font-weight: var(--font-display-label-weight-5p8eav, 400);
@@ -732,7 +734,7 @@ body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_1dvoj_692:not(#\9)
   margin-inline: 0;
 }
 
-.awsui_content-display-description_tc96w_1dvoj_734:not(#\9) {
+.awsui_content-display-description_tc96w_zaew1_736:not(#\9) {
   color: var(--color-text-form-secondary-5q4khe, #687078);
   font-size: var(--font-size-body-s-4dzx5q, 12px);
   line-height: var(--line-height-body-s-egzl4q, 16px);
@@ -740,36 +742,36 @@ body[data-awsui-focus-visible=true] .awsui_drag-overlay_tc96w_1dvoj_692:not(#\9)
   margin-block-start: var(--space-scaled-xxxs-6vyqo7, 2px);
 }
 
-.awsui_content-display-option-list_tc96w_1dvoj_742:not(#\9) {
+.awsui_content-display-option-list_tc96w_zaew1_744:not(#\9) {
   position: relative;
   list-style: none;
   padding-block: 0;
   padding-inline: 0;
 }
 
-.awsui_root_tc96w_1dvoj_749:not(#\9),
-.awsui_modal-root_tc96w_1dvoj_750:not(#\9),
-.awsui_trigger-button_tc96w_1dvoj_751:not(#\9),
-.awsui_cancel-button_tc96w_1dvoj_752:not(#\9),
-.awsui_confirm-button_tc96w_1dvoj_753:not(#\9),
-.awsui_custom_tc96w_1dvoj_754:not(#\9) {
+.awsui_root_tc96w_zaew1_751:not(#\9),
+.awsui_modal-root_tc96w_zaew1_752:not(#\9),
+.awsui_trigger-button_tc96w_zaew1_753:not(#\9),
+.awsui_cancel-button_tc96w_zaew1_754:not(#\9),
+.awsui_confirm-button_tc96w_zaew1_755:not(#\9),
+.awsui_custom_tc96w_zaew1_756:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_second-column-small_tc96w_1dvoj_758:not(#\9) {
+.awsui_second-column-small_tc96w_zaew1_760:not(#\9) {
   padding-block-start: calc(2 * var(--space-scaled-l-7e51pg, 20px));
 }
 
-.awsui_wrap-lines_tc96w_1dvoj_762:not(#\9),
-.awsui_striped-rows_tc96w_1dvoj_763:not(#\9),
-.awsui_content-density_tc96w_1dvoj_764:not(#\9),
-.awsui_page-size_tc96w_1dvoj_765:not(#\9),
-.awsui_page-size-form-field_tc96w_1dvoj_766:not(#\9),
-.awsui_page-size-radio-group_tc96w_1dvoj_767:not(#\9),
-.awsui_sticky-columns_tc96w_1dvoj_768:not(#\9),
-.awsui_sticky-columns-form-field_tc96w_1dvoj_769:not(#\9),
-.awsui_sticky-columns-radio-group_tc96w_1dvoj_770:not(#\9),
-.awsui_sticky-columns-first_tc96w_1dvoj_771:not(#\9),
-.awsui_sticky-columns-last_tc96w_1dvoj_772:not(#\9) {
+.awsui_wrap-lines_tc96w_zaew1_764:not(#\9),
+.awsui_striped-rows_tc96w_zaew1_765:not(#\9),
+.awsui_content-density_tc96w_zaew1_766:not(#\9),
+.awsui_page-size_tc96w_zaew1_767:not(#\9),
+.awsui_page-size-form-field_tc96w_zaew1_768:not(#\9),
+.awsui_page-size-radio-group_tc96w_zaew1_769:not(#\9),
+.awsui_sticky-columns_tc96w_zaew1_770:not(#\9),
+.awsui_sticky-columns-form-field_tc96w_zaew1_771:not(#\9),
+.awsui_sticky-columns-radio-group_tc96w_zaew1_772:not(#\9),
+.awsui_sticky-columns-first_tc96w_zaew1_773:not(#\9),
+.awsui_sticky-columns-last_tc96w_zaew1_774:not(#\9) {
   /* used in test-utils */
 }

package/lib/internal/template/collection-preferences/styles.selectors.js

@@ -2,42 +2,44 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "visible-content": "awsui_visible-content_tc96w_1dvoj_281",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_1dvoj_282",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_1dvoj_283",
-  "visible-content-group": "awsui_visible-content-group_tc96w_1dvoj_283",
-  "visible-content-title": "awsui_visible-content-title_tc96w_1dvoj_288",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_1dvoj_298",
-  "visible-content-option": "awsui_visible-content-option_tc96w_1dvoj_304",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_1dvoj_317",
-  "content-display-option-toggle": "awsui_content-display-option-toggle_tc96w_1dvoj_604",
-  "content-display-option-content": "awsui_content-display-option-content_tc96w_1dvoj_608",
-  "content-display-option": "awsui_content-display-option_tc96w_1dvoj_604",
-  "placeholder": "awsui_placeholder_tc96w_1dvoj_658",
-  "sorting": "awsui_sorting_tc96w_1dvoj_658",
-  "content-display-option-label": "awsui_content-display-option-label_tc96w_1dvoj_685",
-  "drag-overlay": "awsui_drag-overlay_tc96w_1dvoj_692",
-  "content-display": "awsui_content-display_tc96w_1dvoj_604",
-  "content-display-title": "awsui_content-display-title_tc96w_1dvoj_725",
-  "content-display-description": "awsui_content-display-description_tc96w_1dvoj_734",
-  "content-display-option-list": "awsui_content-display-option-list_tc96w_1dvoj_742",
-  "root": "awsui_root_tc96w_1dvoj_749",
-  "modal-root": "awsui_modal-root_tc96w_1dvoj_750",
-  "trigger-button": "awsui_trigger-button_tc96w_1dvoj_751",
-  "cancel-button": "awsui_cancel-button_tc96w_1dvoj_752",
-  "confirm-button": "awsui_confirm-button_tc96w_1dvoj_753",
-  "custom": "awsui_custom_tc96w_1dvoj_754",
-  "second-column-small": "awsui_second-column-small_tc96w_1dvoj_758",
-  "wrap-lines": "awsui_wrap-lines_tc96w_1dvoj_762",
-  "striped-rows": "awsui_striped-rows_tc96w_1dvoj_763",
-  "content-density": "awsui_content-density_tc96w_1dvoj_764",
-  "page-size": "awsui_page-size_tc96w_1dvoj_765",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_1dvoj_766",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_1dvoj_767",
-  "sticky-columns": "awsui_sticky-columns_tc96w_1dvoj_768",
-  "sticky-columns-form-field": "awsui_sticky-columns-form-field_tc96w_1dvoj_769",
-  "sticky-columns-radio-group": "awsui_sticky-columns-radio-group_tc96w_1dvoj_770",
-  "sticky-columns-first": "awsui_sticky-columns-first_tc96w_1dvoj_771",
-  "sticky-columns-last": "awsui_sticky-columns-last_tc96w_1dvoj_772"
+  "visible-content": "awsui_visible-content_tc96w_zaew1_281",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_zaew1_282",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_zaew1_283",
+  "visible-content-group": "awsui_visible-content-group_tc96w_zaew1_283",
+  "visible-content-title": "awsui_visible-content-title_tc96w_zaew1_288",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_zaew1_298",
+  "visible-content-option": "awsui_visible-content-option_tc96w_zaew1_304",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_zaew1_317",
+  "content-display-option-toggle": "awsui_content-display-option-toggle_tc96w_zaew1_604",
+  "content-display-option-content": "awsui_content-display-option-content_tc96w_zaew1_608",
+  "content-display-option": "awsui_content-display-option_tc96w_zaew1_604",
+  "placeholder": "awsui_placeholder_tc96w_zaew1_658",
+  "sorting": "awsui_sorting_tc96w_zaew1_658",
+  "content-display-option-label": "awsui_content-display-option-label_tc96w_zaew1_685",
+  "drag-overlay": "awsui_drag-overlay_tc96w_zaew1_692",
+  "content-display": "awsui_content-display_tc96w_zaew1_604",
+  "content-display-text-filter": "awsui_content-display-text-filter_tc96w_zaew1_722",
+  "content-display-no-match": "awsui_content-display-no-match_tc96w_zaew1_723",
+  "content-display-title": "awsui_content-display-title_tc96w_zaew1_727",
+  "content-display-description": "awsui_content-display-description_tc96w_zaew1_736",
+  "content-display-option-list": "awsui_content-display-option-list_tc96w_zaew1_744",
+  "root": "awsui_root_tc96w_zaew1_751",
+  "modal-root": "awsui_modal-root_tc96w_zaew1_752",
+  "trigger-button": "awsui_trigger-button_tc96w_zaew1_753",
+  "cancel-button": "awsui_cancel-button_tc96w_zaew1_754",
+  "confirm-button": "awsui_confirm-button_tc96w_zaew1_755",
+  "custom": "awsui_custom_tc96w_zaew1_756",
+  "second-column-small": "awsui_second-column-small_tc96w_zaew1_760",
+  "wrap-lines": "awsui_wrap-lines_tc96w_zaew1_764",
+  "striped-rows": "awsui_striped-rows_tc96w_zaew1_765",
+  "content-density": "awsui_content-density_tc96w_zaew1_766",
+  "page-size": "awsui_page-size_tc96w_zaew1_767",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_zaew1_768",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_zaew1_769",
+  "sticky-columns": "awsui_sticky-columns_tc96w_zaew1_770",
+  "sticky-columns-form-field": "awsui_sticky-columns-form-field_tc96w_zaew1_771",
+  "sticky-columns-radio-group": "awsui_sticky-columns-radio-group_tc96w_zaew1_772",
+  "sticky-columns-first": "awsui_sticky-columns-first_tc96w_zaew1_773",
+  "sticky-columns-last": "awsui_sticky-columns-last_tc96w_zaew1_774"
 };
   

package/lib/internal/template/collection-preferences/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/utils.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAUxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAI1D,eAAO,MAAM,eAAe,iHASzB,2BAA2B,WAAW,KAAG,2BAA2B,WASrE,CAAC;AAIH,eAAO,MAAM,gBAAgB,YAClB,2BAA2B,WAAW,WACtC,2BAA2B,WAAW,KAC9C,2BAA2B,WAkB7B,CAAC;AAEF,UAAU,uBAAuB;IAC/B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB,oBAAqB,uBAAuB,gBAsB1E,CAAC;AAEF,UAAU,uBAAwB,SAAQ,0BAA0B,CAAC,kBAAkB;IACrF,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,wCAAyC,uBAAuB,gBAkB9F,CAAC;AAEF,UAAU,wBAAyB,SAAQ,0BAA0B,CAAC,mBAAmB;IACvF,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,mBAAmB,4CAA6C,wBAAwB,gBAYpG,CAAC;AAEF,UAAU,0BAA2B,SAAQ,0BAA0B,CAAC,qBAAqB;IAC3F,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,0BAA0B,eAYxG;AAED,UAAU,6BAA8B,SAAQ,0BAA0B,CAAC,wBAAwB;IACjG,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,KAAK,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;CACnC;AAED,eAAO,MAAM,wBAAwB,4CAA6C,6BAA6B,gBAY9G,CAAC;AAEF,UAAU,4BAA6B,SAAQ,0BAA0B,CAAC,uBAAuB;IAC/F,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC9D,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3C;AA+BD,eAAO,MAAM,uBAAuB,oDAKjC,4BAA4B,gBAqB9B,CAAC;AAEF,UAAU,qBAAqB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAAE,kBAAkB,CAAC;IACtG,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,KAAK,EAAE,CAAC,CAAC;CACV;AACD,eAAO,MAAM,gBAAgB,0CAA2C,qBAAqB,uBAc5F,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/utils.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAWxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAI1D,eAAO,MAAM,eAAe,iHASzB,2BAA2B,WAAW,KAAG,2BAA2B,WASrE,CAAC;AAIH,eAAO,MAAM,gBAAgB,YAClB,2BAA2B,WAAW,WACtC,2BAA2B,WAAW,KAC9C,2BAA2B,WAkB7B,CAAC;AAEF,UAAU,uBAAuB;IAC/B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,kBAAkB,oBAAqB,uBAAuB,gBAa1E,CAAC;AAEF,UAAU,uBAAwB,SAAQ,0BAA0B,CAAC,kBAAkB;IACrF,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,wCAAyC,uBAAuB,gBAkB9F,CAAC;AAEF,UAAU,wBAAyB,SAAQ,0BAA0B,CAAC,mBAAmB;IACvF,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,mBAAmB,4CAA6C,wBAAwB,gBAcpG,CAAC;AAEF,UAAU,0BAA2B,SAAQ,0BAA0B,CAAC,qBAAqB;IAC3F,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,0BAA0B,eAcxG;AAED,UAAU,6BAA8B,SAAQ,0BAA0B,CAAC,wBAAwB;IACjG,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,KAAK,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;CACnC;AAED,eAAO,MAAM,wBAAwB,4CAA6C,6BAA6B,gBAc9G,CAAC;AAEF,UAAU,4BAA6B,SAAQ,0BAA0B,CAAC,uBAAuB;IAC/F,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC9D,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3C;AA+BD,eAAO,MAAM,uBAAuB,oDAKjC,4BAA4B,gBAqB9B,CAAC;AAEF,UAAU,qBAAqB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAAE,kBAAkB,CAAC;IACtG,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,KAAK,EAAE,CAAC,CAAC;CACV;AACD,eAAO,MAAM,gBAAgB,0CAA2C,qBAAqB,uBAc5F,CAAC"}

package/lib/internal/template/collection-preferences/utils.js

@@ -9,6 +9,7 @@ import { useInternalI18n } from '../i18n/context';
 import { useContainerBreakpoints } from '../internal/hooks/container-queries';
 import InternalRadioGroup from '../radio-group/internal';
 import InternalSpaceBetween from '../space-between/internal';
+import { getAnalyticsInnerContextAttribute } from './analytics-metadata/utils';
 import styles from './styles.css.js';
 export const copyPreferences = ({ pageSize, wrapLines, stripedRows, contentDensity, visibleContent, contentDisplay, stickyColumns, custom, }) => ({
     pageSize,
@@ -42,38 +43,36 @@ export const mergePreferences = (newPref, oldPref) => {
 export const ModalContentLayout = ({ left, right }) => {
     const [breakpoint, ref] = useContainerBreakpoints(['xs']);
     const smallContainer = breakpoint === 'default';
-    if (smallContainer) {
-        return (React.createElement("div", { ref: ref },
-            left && React.createElement("div", null, left),
-            right && React.createElement("div", { className: clsx(left && styles['second-column-small']) }, right)));
-    }
     const columns = left && right ? 2 : 1;
     return (React.createElement("div", { ref: ref },
-        React.createElement(InternalColumnLayout, { columns: columns, variant: "text-grid" },
+        React.createElement(InternalColumnLayout, { columns: smallContainer ? 1 : columns, variant: "text-grid" },
             left && React.createElement("div", null, left),
-            right && React.createElement("div", null, right))));
+            right && React.createElement("div", { className: clsx(left && smallContainer && styles['second-column-small']) }, right))));
 };
 export const PageSizePreference = ({ title, options, value, onChange }) => {
     const i18n = useInternalI18n('collection-preferences');
-    return (React.createElement("div", { className: styles['page-size'] },
+    return (React.createElement("div", Object.assign({ className: styles['page-size'] }, getAnalyticsInnerContextAttribute('pageSize')),
         React.createElement(InternalFormField, { label: i18n('pageSizePreference.title', title), stretch: true, className: styles['page-size-form-field'] },
             React.createElement(InternalRadioGroup, { className: styles['page-size-radio-group'], value: `${value}`, items: options.map(({ label, value }) => ({ label, value: `${value}` })), onChange: ({ detail }) => onChange(parseInt(detail.value, 10)) }))));
 };
 export const WrapLinesPreference = ({ label, description, value, onChange }) => {
     const i18n = useInternalI18n('collection-preferences');
-    return (React.createElement(InternalCheckbox, { checked: !!value, description: i18n('wrapLinesPreference.description', description), onChange: ({ detail }) => onChange(detail.checked), className: styles['wrap-lines'] }, i18n('wrapLinesPreference.label', label)));
+    return (React.createElement("div", Object.assign({}, getAnalyticsInnerContextAttribute('wrapLines')),
+        React.createElement(InternalCheckbox, { checked: !!value, description: i18n('wrapLinesPreference.description', description), onChange: ({ detail }) => onChange(detail.checked), className: styles['wrap-lines'] }, i18n('wrapLinesPreference.label', label))));
 };
 export function StripedRowsPreference({ label, description, value, onChange }) {
     const i18n = useInternalI18n('collection-preferences');
-    return (React.createElement(InternalCheckbox, { checked: !!value, description: i18n('stripedRowsPreference.description', description), onChange: ({ detail }) => onChange(detail.checked), className: styles['striped-rows'] }, i18n('stripedRowsPreference.label', label)));
+    return (React.createElement("div", Object.assign({}, getAnalyticsInnerContextAttribute('stripedRows')),
+        React.createElement(InternalCheckbox, { checked: !!value, description: i18n('stripedRowsPreference.description', description), onChange: ({ detail }) => onChange(detail.checked), className: styles['striped-rows'] }, i18n('stripedRowsPreference.label', label))));
 }
 export const ContentDensityPreference = ({ label, description, value, onChange }) => {
     const i18n = useInternalI18n('collection-preferences');
-    return (React.createElement(InternalCheckbox, { checked: value === 'compact', description: i18n('contentDensityPreference.description', description), onChange: ({ detail }) => onChange(detail.checked ? 'compact' : 'comfortable'), className: styles['content-density'] }, i18n('contentDensityPreference.label', label)));
+    return (React.createElement("div", Object.assign({}, getAnalyticsInnerContextAttribute('contentDensity')),
+        React.createElement(InternalCheckbox, { checked: value === 'compact', description: i18n('contentDensityPreference.description', description), onChange: ({ detail }) => onChange(detail.checked ? 'compact' : 'comfortable'), className: styles['content-density'] }, i18n('contentDensityPreference.label', label))));
 };
 const StickyPreference = ({ firstOrLast, preference, value, onChange }) => {
     const { title, description, options } = preference;
-    return (React.createElement("div", { className: styles[`sticky-columns-${firstOrLast}`] },
+    return (React.createElement("div", Object.assign({ className: styles[`sticky-columns-${firstOrLast}`] }, getAnalyticsInnerContextAttribute('stickyColumns')),
         React.createElement(InternalFormField, { className: styles['sticky-columns-form-field'], label: title, description: description },
             React.createElement(InternalRadioGroup, { className: styles['sticky-columns-radio-group'], value: typeof value !== 'undefined' ? `${value}` : null, items: options.map(({ label, value }) => ({ label, value: `${value}` })), onChange: ({ detail }) => onChange(Number(detail.value)) }))));
 };
@@ -85,7 +84,7 @@ export const StickyColumnsPreference = ({ firstColumns, lastColumns, onChange, v
 export const CustomPreference = ({ value, customPreference, onChange }) => {
     const [customState, setCustomState] = useState(value);
     if (customPreference) {
-        return (React.createElement("div", { className: styles.custom }, customPreference(customState, value => {
+        return (React.createElement("div", Object.assign({ className: styles.custom }, getAnalyticsInnerContextAttribute('custom')), customPreference(customState, value => {
             // prevent value to be treated as a functional callback
             setCustomState(() => value);
             onChange(value);

package/lib/internal/template/collection-preferences/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/collection-preferences/utils.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\n\nimport InternalCheckbox from '../checkbox/internal';\nimport InternalColumnLayout from '../column-layout/internal';\nimport InternalFormField from '../form-field/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport InternalRadioGroup from '../radio-group/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport { CollectionPreferencesProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport const copyPreferences = ({\n  pageSize,\n  wrapLines,\n  stripedRows,\n  contentDensity,\n  visibleContent,\n  contentDisplay,\n  stickyColumns,\n  custom,\n}: CollectionPreferencesProps.Preferences): CollectionPreferencesProps.Preferences => ({\n  pageSize,\n  wrapLines,\n  stripedRows,\n  contentDensity,\n  visibleContent,\n  contentDisplay,\n  stickyColumns,\n  custom,\n});\n\ntype CopyPreferenceName = keyof CollectionPreferencesProps.Preferences;\n\nexport const mergePreferences = (\n  newPref: CollectionPreferencesProps.Preferences,\n  oldPref: CollectionPreferencesProps.Preferences\n): CollectionPreferencesProps.Preferences => {\n  const newObj = { ...oldPref };\n  const prefNames: CopyPreferenceName[] = [\n    'pageSize',\n    'wrapLines',\n    'stripedRows',\n    'contentDensity',\n    'visibleContent',\n    'custom',\n    'contentDisplay',\n    'stickyColumns',\n  ];\n  for (const prefName of prefNames) {\n    if (newPref[prefName] !== undefined) {\n      newObj[prefName] = newPref[prefName];\n    }\n  }\n  return newObj;\n};\n\ninterface ModalContentLayoutProps {\n  left: React.ReactNode;\n  right: React.ReactNode;\n}\n\nexport const ModalContentLayout = ({ left, right }: ModalContentLayoutProps) => {\n  const [breakpoint, ref] = useContainerBreakpoints(['xs']);\n  const smallContainer = breakpoint === 'default';\n\n  if (smallContainer) {\n    return (\n      <div ref={ref}>\n        {left && <div>{left}</div>}\n        {right && <div className={clsx(left && styles['second-column-small'])}>{right}</div>}\n      </div>\n    );\n  }\n\n  const columns = left && right ? 2 : 1;\n  return (\n    <div ref={ref}>\n      <InternalColumnLayout columns={columns} variant=\"text-grid\">\n        {left && <div>{left}</div>}\n        {right && <div>{right}</div>}\n      </InternalColumnLayout>\n    </div>\n  );\n};\n\ninterface PageSizePreferenceProps extends CollectionPreferencesProps.PageSizePreference {\n  onChange: (value: number) => void;\n  value?: number;\n}\n\nexport const PageSizePreference = ({ title, options, value, onChange }: PageSizePreferenceProps) => {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <div className={styles['page-size']}>\n      <InternalFormField\n        label={i18n('pageSizePreference.title', title)}\n        stretch={true}\n        className={styles['page-size-form-field']}\n      >\n        <InternalRadioGroup\n          className={styles['page-size-radio-group']}\n          value={`${value}`}\n          items={options.map(({ label, value }) => ({ label, value: `${value}` }))}\n          onChange={({ detail }) => onChange(parseInt(detail.value, 10))}\n        />\n      </InternalFormField>\n    </div>\n  );\n};\n\ninterface WrapLinesPreferenceProps extends CollectionPreferencesProps.WrapLinesPreference {\n  onChange: (value: boolean) => void;\n  value?: boolean;\n}\n\nexport const WrapLinesPreference = ({ label, description, value, onChange }: WrapLinesPreferenceProps) => {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <InternalCheckbox\n      checked={!!value}\n      description={i18n('wrapLinesPreference.description', description)}\n      onChange={({ detail }) => onChange(detail.checked)}\n      className={styles['wrap-lines']}\n    >\n      {i18n('wrapLinesPreference.label', label)}\n    </InternalCheckbox>\n  );\n};\n\ninterface StripedRowsPreferenceProps extends CollectionPreferencesProps.StripedRowsPreference {\n  onChange: (value: boolean) => void;\n  value?: boolean;\n}\n\nexport function StripedRowsPreference({ label, description, value, onChange }: StripedRowsPreferenceProps) {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <InternalCheckbox\n      checked={!!value}\n      description={i18n('stripedRowsPreference.description', description)}\n      onChange={({ detail }) => onChange(detail.checked)}\n      className={styles['striped-rows']}\n    >\n      {i18n('stripedRowsPreference.label', label)}\n    </InternalCheckbox>\n  );\n}\n\ninterface ContentDensityPreferenceProps extends CollectionPreferencesProps.ContentDensityPreference {\n  onChange: (value: 'comfortable' | 'compact') => void;\n  value?: 'comfortable' | 'compact';\n}\n\nexport const ContentDensityPreference = ({ label, description, value, onChange }: ContentDensityPreferenceProps) => {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <InternalCheckbox\n      checked={value === 'compact'}\n      description={i18n('contentDensityPreference.description', description)}\n      onChange={({ detail }) => onChange(detail.checked ? 'compact' : 'comfortable')}\n      className={styles['content-density']}\n    >\n      {i18n('contentDensityPreference.label', label)}\n    </InternalCheckbox>\n  );\n};\n\ninterface StickyColumnsPreferenceProps extends CollectionPreferencesProps.StickyColumnsPreference {\n  onChange: (value?: { first?: number; last?: number }) => void;\n  value?: { first?: number; last?: number };\n}\ninterface StickyPreference extends CollectionPreferencesProps.StickyColumnsPreference {\n  onChange: (value: number) => void;\n  preference: {\n    title: string;\n    description: string;\n    options: ReadonlyArray<{\n      label: string;\n      value: number;\n    }>;\n  };\n  value?: number;\n  firstOrLast: 'first' | 'last';\n}\n\nconst StickyPreference = ({ firstOrLast, preference, value, onChange }: StickyPreference) => {\n  const { title, description, options } = preference;\n  return (\n    <div className={styles[`sticky-columns-${firstOrLast}`]}>\n      <InternalFormField className={styles['sticky-columns-form-field']} label={title} description={description}>\n        <InternalRadioGroup\n          className={styles['sticky-columns-radio-group']}\n          value={typeof value !== 'undefined' ? `${value}` : null}\n          items={options.map(({ label, value }) => ({ label, value: `${value}` }))}\n          onChange={({ detail }) => onChange(Number(detail.value))}\n        />\n      </InternalFormField>\n    </div>\n  );\n};\n\nexport const StickyColumnsPreference = ({\n  firstColumns,\n  lastColumns,\n  onChange,\n  value,\n}: StickyColumnsPreferenceProps) => {\n  return (\n    <InternalSpaceBetween className={styles['sticky-columns']} size=\"l\">\n      {firstColumns && (\n        <StickyPreference\n          firstOrLast=\"first\"\n          preference={firstColumns}\n          value={value?.first}\n          onChange={newValue => onChange({ ...value, first: newValue })}\n        />\n      )}\n      {lastColumns && (\n        <StickyPreference\n          firstOrLast=\"last\"\n          preference={lastColumns}\n          value={value?.last}\n          onChange={newValue => onChange({ ...value, last: newValue })}\n        />\n      )}\n    </InternalSpaceBetween>\n  );\n};\n\ninterface CustomPreferenceProps<T = any> extends Pick<CollectionPreferencesProps<T>, 'customPreference'> {\n  onChange: (value: T) => void;\n  value: T;\n}\nexport const CustomPreference = ({ value, customPreference, onChange }: CustomPreferenceProps) => {\n  const [customState, setCustomState] = useState(value);\n  if (customPreference) {\n    return (\n      <div className={styles.custom}>\n        {customPreference(customState, value => {\n          // prevent value to be treated as a functional callback\n          setCustomState(() => value);\n          onChange(value);\n        })}\n      </div>\n    );\n  }\n  return null;\n};\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/collection-preferences/utils.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\n\nimport InternalCheckbox from '../checkbox/internal';\nimport InternalColumnLayout from '../column-layout/internal';\nimport InternalFormField from '../form-field/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport InternalRadioGroup from '../radio-group/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport { getAnalyticsInnerContextAttribute } from './analytics-metadata/utils';\nimport { CollectionPreferencesProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport const copyPreferences = ({\n  pageSize,\n  wrapLines,\n  stripedRows,\n  contentDensity,\n  visibleContent,\n  contentDisplay,\n  stickyColumns,\n  custom,\n}: CollectionPreferencesProps.Preferences): CollectionPreferencesProps.Preferences => ({\n  pageSize,\n  wrapLines,\n  stripedRows,\n  contentDensity,\n  visibleContent,\n  contentDisplay,\n  stickyColumns,\n  custom,\n});\n\ntype CopyPreferenceName = keyof CollectionPreferencesProps.Preferences;\n\nexport const mergePreferences = (\n  newPref: CollectionPreferencesProps.Preferences,\n  oldPref: CollectionPreferencesProps.Preferences\n): CollectionPreferencesProps.Preferences => {\n  const newObj = { ...oldPref };\n  const prefNames: CopyPreferenceName[] = [\n    'pageSize',\n    'wrapLines',\n    'stripedRows',\n    'contentDensity',\n    'visibleContent',\n    'custom',\n    'contentDisplay',\n    'stickyColumns',\n  ];\n  for (const prefName of prefNames) {\n    if (newPref[prefName] !== undefined) {\n      newObj[prefName] = newPref[prefName];\n    }\n  }\n  return newObj;\n};\n\ninterface ModalContentLayoutProps {\n  left: React.ReactNode;\n  right: React.ReactNode;\n}\n\nexport const ModalContentLayout = ({ left, right }: ModalContentLayoutProps) => {\n  const [breakpoint, ref] = useContainerBreakpoints(['xs']);\n  const smallContainer = breakpoint === 'default';\n\n  const columns = left && right ? 2 : 1;\n  return (\n    <div ref={ref}>\n      <InternalColumnLayout columns={smallContainer ? 1 : columns} variant=\"text-grid\">\n        {left && <div>{left}</div>}\n        {right && <div className={clsx(left && smallContainer && styles['second-column-small'])}>{right}</div>}\n      </InternalColumnLayout>\n    </div>\n  );\n};\n\ninterface PageSizePreferenceProps extends CollectionPreferencesProps.PageSizePreference {\n  onChange: (value: number) => void;\n  value?: number;\n}\n\nexport const PageSizePreference = ({ title, options, value, onChange }: PageSizePreferenceProps) => {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <div className={styles['page-size']} {...getAnalyticsInnerContextAttribute('pageSize')}>\n      <InternalFormField\n        label={i18n('pageSizePreference.title', title)}\n        stretch={true}\n        className={styles['page-size-form-field']}\n      >\n        <InternalRadioGroup\n          className={styles['page-size-radio-group']}\n          value={`${value}`}\n          items={options.map(({ label, value }) => ({ label, value: `${value}` }))}\n          onChange={({ detail }) => onChange(parseInt(detail.value, 10))}\n        />\n      </InternalFormField>\n    </div>\n  );\n};\n\ninterface WrapLinesPreferenceProps extends CollectionPreferencesProps.WrapLinesPreference {\n  onChange: (value: boolean) => void;\n  value?: boolean;\n}\n\nexport const WrapLinesPreference = ({ label, description, value, onChange }: WrapLinesPreferenceProps) => {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <div {...getAnalyticsInnerContextAttribute('wrapLines')}>\n      <InternalCheckbox\n        checked={!!value}\n        description={i18n('wrapLinesPreference.description', description)}\n        onChange={({ detail }) => onChange(detail.checked)}\n        className={styles['wrap-lines']}\n      >\n        {i18n('wrapLinesPreference.label', label)}\n      </InternalCheckbox>\n    </div>\n  );\n};\n\ninterface StripedRowsPreferenceProps extends CollectionPreferencesProps.StripedRowsPreference {\n  onChange: (value: boolean) => void;\n  value?: boolean;\n}\n\nexport function StripedRowsPreference({ label, description, value, onChange }: StripedRowsPreferenceProps) {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <div {...getAnalyticsInnerContextAttribute('stripedRows')}>\n      <InternalCheckbox\n        checked={!!value}\n        description={i18n('stripedRowsPreference.description', description)}\n        onChange={({ detail }) => onChange(detail.checked)}\n        className={styles['striped-rows']}\n      >\n        {i18n('stripedRowsPreference.label', label)}\n      </InternalCheckbox>\n    </div>\n  );\n}\n\ninterface ContentDensityPreferenceProps extends CollectionPreferencesProps.ContentDensityPreference {\n  onChange: (value: 'comfortable' | 'compact') => void;\n  value?: 'comfortable' | 'compact';\n}\n\nexport const ContentDensityPreference = ({ label, description, value, onChange }: ContentDensityPreferenceProps) => {\n  const i18n = useInternalI18n('collection-preferences');\n  return (\n    <div {...getAnalyticsInnerContextAttribute('contentDensity')}>\n      <InternalCheckbox\n        checked={value === 'compact'}\n        description={i18n('contentDensityPreference.description', description)}\n        onChange={({ detail }) => onChange(detail.checked ? 'compact' : 'comfortable')}\n        className={styles['content-density']}\n      >\n        {i18n('contentDensityPreference.label', label)}\n      </InternalCheckbox>\n    </div>\n  );\n};\n\ninterface StickyColumnsPreferenceProps extends CollectionPreferencesProps.StickyColumnsPreference {\n  onChange: (value?: { first?: number; last?: number }) => void;\n  value?: { first?: number; last?: number };\n}\ninterface StickyPreference extends CollectionPreferencesProps.StickyColumnsPreference {\n  onChange: (value: number) => void;\n  preference: {\n    title: string;\n    description: string;\n    options: ReadonlyArray<{\n      label: string;\n      value: number;\n    }>;\n  };\n  value?: number;\n  firstOrLast: 'first' | 'last';\n}\n\nconst StickyPreference = ({ firstOrLast, preference, value, onChange }: StickyPreference) => {\n  const { title, description, options } = preference;\n  return (\n    <div className={styles[`sticky-columns-${firstOrLast}`]} {...getAnalyticsInnerContextAttribute('stickyColumns')}>\n      <InternalFormField className={styles['sticky-columns-form-field']} label={title} description={description}>\n        <InternalRadioGroup\n          className={styles['sticky-columns-radio-group']}\n          value={typeof value !== 'undefined' ? `${value}` : null}\n          items={options.map(({ label, value }) => ({ label, value: `${value}` }))}\n          onChange={({ detail }) => onChange(Number(detail.value))}\n        />\n      </InternalFormField>\n    </div>\n  );\n};\n\nexport const StickyColumnsPreference = ({\n  firstColumns,\n  lastColumns,\n  onChange,\n  value,\n}: StickyColumnsPreferenceProps) => {\n  return (\n    <InternalSpaceBetween className={styles['sticky-columns']} size=\"l\">\n      {firstColumns && (\n        <StickyPreference\n          firstOrLast=\"first\"\n          preference={firstColumns}\n          value={value?.first}\n          onChange={newValue => onChange({ ...value, first: newValue })}\n        />\n      )}\n      {lastColumns && (\n        <StickyPreference\n          firstOrLast=\"last\"\n          preference={lastColumns}\n          value={value?.last}\n          onChange={newValue => onChange({ ...value, last: newValue })}\n        />\n      )}\n    </InternalSpaceBetween>\n  );\n};\n\ninterface CustomPreferenceProps<T = any> extends Pick<CollectionPreferencesProps<T>, 'customPreference'> {\n  onChange: (value: T) => void;\n  value: T;\n}\nexport const CustomPreference = ({ value, customPreference, onChange }: CustomPreferenceProps) => {\n  const [customState, setCustomState] = useState(value);\n  if (customPreference) {\n    return (\n      <div className={styles.custom} {...getAnalyticsInnerContextAttribute('custom')}>\n        {customPreference(customState, value => {\n          // prevent value to be treated as a functional callback\n          setCustomState(() => value);\n          onChange(value);\n        })}\n      </div>\n    );\n  }\n  return null;\n};\n"]}