@cloudscape-design/components 3.0.0

package/code-editor/styles.selectors.js

@@ -0,0 +1,39 @@
+
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "code-editor": "awsui_code-editor_1gl9c_16dw6_98",
+  "code-editor-refresh": "awsui_code-editor-refresh_1gl9c_16dw6_342",
+  "pane": "awsui_pane_1gl9c_16dw6_354",
+  "pane__close-container": "awsui_pane__close-container_1gl9c_16dw6_365",
+  "pane__list": "awsui_pane__list_1gl9c_16dw6_370",
+  "pane__table": "awsui_pane__table_1gl9c_16dw6_377",
+  "pane__item": "awsui_pane__item_1gl9c_16dw6_382",
+  "pane__cell": "awsui_pane__cell_1gl9c_16dw6_382",
+  "pane__item--highlighted": "awsui_pane__item--highlighted_1gl9c_16dw6_396",
+  "pane__location": "awsui_pane__location_1gl9c_16dw6_417",
+  "pane__description": "awsui_pane__description_1gl9c_16dw6_417",
+  "focus-lock": "awsui_focus-lock_1gl9c_16dw6_432",
+  "resizable-box": "awsui_resizable-box_1gl9c_16dw6_455",
+  "resizable-box-handle": "awsui_resizable-box-handle_1gl9c_16dw6_460",
+  "editor": "awsui_editor_1gl9c_16dw6_485",
+  "status-bar": "awsui_status-bar_1gl9c_16dw6_518",
+  "status-bar-with-hidden-pane": "awsui_status-bar-with-hidden-pane_1gl9c_16dw6_527",
+  "status-bar__left": "awsui_status-bar__left_1gl9c_16dw6_531",
+  "status-bar__left-virtual": "awsui_status-bar__left-virtual_1gl9c_16dw6_538",
+  "status-bar__right": "awsui_status-bar__right_1gl9c_16dw6_542",
+  "status-bar__language-mode": "awsui_status-bar__language-mode_1gl9c_16dw6_546",
+  "status-bar__cursor-position": "awsui_status-bar__cursor-position_1gl9c_16dw6_546",
+  "status-bar__cog-button": "awsui_status-bar__cog-button_1gl9c_16dw6_551",
+  "status-bar-virtual": "awsui_status-bar-virtual_1gl9c_16dw6_555",
+  "tab-button": "awsui_tab-button_1gl9c_16dw6_561",
+  "tab-button--refresh": "awsui_tab-button--refresh_1gl9c_16dw6_574",
+  "tab-button--active": "awsui_tab-button--active_1gl9c_16dw6_588",
+  "tab-button--disabled": "awsui_tab-button--disabled_1gl9c_16dw6_608",
+  "tab-button--divider": "awsui_tab-button--divider_1gl9c_16dw6_638",
+  "tab-button--errors": "awsui_tab-button--errors_1gl9c_16dw6_645",
+  "tab-button--warnings": "awsui_tab-button--warnings_1gl9c_16dw6_645",
+  "loading-screen": "awsui_loading-screen_1gl9c_16dw6_649",
+  "error-screen": "awsui_error-screen_1gl9c_16dw6_650"
+};
+  

package/code-editor/tab-button.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { IconProps } from '../icon/interfaces';
+interface TabButtonProps {
+    text: string;
+    iconName: IconProps.Name;
+    active: boolean;
+    disabled: boolean;
+    tabIndex?: number;
+    ariaHidden?: boolean;
+    ariaLabel?: string;
+    paneId: string;
+    isRefresh: boolean;
+    className: string;
+    onClick: () => void;
+    onFocus?: React.FocusEventHandler<HTMLButtonElement>;
+    onBlur?: React.FocusEventHandler<HTMLButtonElement>;
+}
+export declare const TabButton: React.ForwardRefExoticComponent<TabButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export {};
+//# sourceMappingURL=tab-button.d.ts.map

package/code-editor/tab-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-button.d.ts","sourceRoot":"","sources":["../../../src/code-editor/tab-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAK/C,UAAU,cAAc;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,SAAS,CAAC,IAAI,CAAC;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IAEnB,SAAS,EAAE,MAAM,CAAC;IAElB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACrD,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,SAAS,0FA4CrB,CAAC"}

package/code-editor/tab-button.js

@@ -0,0 +1,22 @@
+import { __assign } from "tslib";
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import clsx from 'clsx';
+import useFocusVisible from '../internal/hooks/focus-visible';
+import InternalIcon from '../icon/internal';
+import styles from './styles.css.js';
+export var TabButton = React.forwardRef(function (_a, ref) {
+    var _b;
+    var active = _a.active, disabled = _a.disabled, iconName = _a.iconName, onClick = _a.onClick, onFocus = _a.onFocus, onBlur = _a.onBlur, tabIndex = _a.tabIndex, ariaHidden = _a.ariaHidden, ariaLabel = _a.ariaLabel, paneId = _a.paneId, isRefresh = _a.isRefresh, text = _a.text, className = _a.className;
+    var focusVisible = useFocusVisible();
+    return (React.createElement("button", __assign({ className: clsx([styles['tab-button'], className], (_b = {},
+            _b[styles['tab-button--active']] = active,
+            _b[styles['tab-button--disabled']] = disabled,
+            _b[styles['tab-button--refresh']] = isRefresh,
+            _b)), onClick: onClick, onFocus: onFocus, onBlur: onBlur, disabled: disabled, ref: ref, tabIndex: tabIndex, role: "tab", "aria-selected": active, "aria-controls": paneId, "aria-hidden": ariaHidden, "aria-label": ariaLabel }, focusVisible),
+        React.createElement(InternalIcon, { name: iconName }),
+        " ",
+        text));
+});
+//# sourceMappingURL=tab-button.js.map

package/code-editor/tab-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-button.js","sourceRoot":"","sources":["../../../src/code-editor/tab-button.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAE9D,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAE5C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAoBrC,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACvC,UACE,EAciB,EACjB,GAAiC;;QAd/B,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,OAAO,aAAA,EACP,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,MAAM,YAAA,EACN,SAAS,eAAA,EACT,IAAI,UAAA,EACJ,SAAS,eAAA;IAIX,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,OAAO,CACL,yCACE,SAAS,EAAE,IAAI,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,CAAC;YAC/C,GAAC,MAAM,CAAC,oBAAoB,CAAC,IAAG,MAAM;YACtC,GAAC,MAAM,CAAC,sBAAsB,CAAC,IAAG,QAAQ;YAC1C,GAAC,MAAM,CAAC,qBAAqB,CAAC,IAAG,SAAS;gBAC1C,EACF,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,KAAK,mBACK,MAAM,mBACN,MAAM,iBACR,UAAU,gBACX,SAAS,IACjB,YAAY;QAEhB,oBAAC,YAAY,IAAC,IAAI,EAAE,QAAQ,GAAI;;QAAE,IAAI,CAC/B,CACV,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\n\nimport styles from './styles.css.js';\n\ninterface TabButtonProps {\n  text: string;\n  iconName: IconProps.Name;\n  active: boolean;\n  disabled: boolean;\n  tabIndex?: number;\n  ariaHidden?: boolean;\n  ariaLabel?: string;\n  paneId: string;\n  isRefresh: boolean;\n\n  className: string;\n\n  onClick: () => void;\n  onFocus?: React.FocusEventHandler<HTMLButtonElement>;\n  onBlur?: React.FocusEventHandler<HTMLButtonElement>;\n}\n\nexport const TabButton = React.forwardRef(\n  (\n    {\n      active,\n      disabled,\n      iconName,\n      onClick,\n      onFocus,\n      onBlur,\n      tabIndex,\n      ariaHidden,\n      ariaLabel,\n      paneId,\n      isRefresh,\n      text,\n      className,\n    }: TabButtonProps,\n    ref: React.Ref<HTMLButtonElement>\n  ) => {\n    const focusVisible = useFocusVisible();\n    return (\n      <button\n        className={clsx([styles['tab-button'], className], {\n          [styles['tab-button--active']]: active,\n          [styles['tab-button--disabled']]: disabled,\n          [styles['tab-button--refresh']]: isRefresh,\n        })}\n        onClick={onClick}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        disabled={disabled}\n        ref={ref}\n        tabIndex={tabIndex}\n        role=\"tab\"\n        aria-selected={active}\n        aria-controls={paneId}\n        aria-hidden={ariaHidden}\n        aria-label={ariaLabel}\n        {...focusVisible}\n      >\n        <InternalIcon name={iconName} /> {text}\n      </button>\n    );\n  }\n);\n"]}

package/code-editor/util.d.ts

@@ -0,0 +1,11 @@
+import { Ace } from 'ace-builds';
+import { LightThemes, DarkThemes } from './ace-themes';
+import { CodeEditorProps } from './interfaces';
+export declare type PaneStatus = 'error' | 'warning' | 'hidden';
+export declare const DEFAULT_LIGHT_THEME: typeof LightThemes[number]['value'];
+export declare const DEFAULT_DARK_THEME: typeof DarkThemes[number]['value'];
+export declare function getDefaultConfig(): Partial<Ace.EditorOptions>;
+export declare function getDefaultTheme(element: HTMLElement): CodeEditorProps.Theme;
+export declare function getAceTheme(theme: CodeEditorProps.Theme): string;
+export declare function getLanguageLabel(language: CodeEditorProps.Language): string;
+//# sourceMappingURL=util.d.ts.map

package/code-editor/util.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/code-editor/util.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAGjC,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAG/C,oBAAY,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAExD,eAAO,MAAM,mBAAmB,EAAE,OAAO,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAU,CAAC;AAC/E,eAAO,MAAM,kBAAkB,EAAE,OAAO,UAAU,CAAC,MAAM,CAAC,CAAC,OAAO,CAA2B,CAAC;AAE9F,wBAAgB,gBAAgB,IAAI,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,CAI7D;AAED,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,eAAe,CAAC,KAAK,CAM3E;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,eAAe,CAAC,KAAK,UAEvD;AAED,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,eAAe,CAAC,QAAQ,GAAG,MAAM,CAE3E"}

package/code-editor/util.js

@@ -0,0 +1,21 @@
+import { AceModes } from './ace-modes';
+import { findUpUntil } from '../internal/utils/dom';
+export var DEFAULT_LIGHT_THEME = 'dawn';
+export var DEFAULT_DARK_THEME = 'tomorrow_night_bright';
+export function getDefaultConfig() {
+    return {
+        behavioursEnabled: true
+    };
+}
+export function getDefaultTheme(element) {
+    var isDarkMode = !!findUpUntil(element, function (node) { return node.classList.contains('awsui-polaris-dark-mode') || node.classList.contains('awsui-dark-mode'); });
+    return isDarkMode ? DEFAULT_DARK_THEME : DEFAULT_LIGHT_THEME;
+}
+export function getAceTheme(theme) {
+    return "ace/theme/".concat(theme);
+}
+export function getLanguageLabel(language) {
+    var _a;
+    return ((_a = AceModes.filter(function (mode) { return mode.value === language; })[0]) === null || _a === void 0 ? void 0 : _a.label) || '';
+}
+//# sourceMappingURL=util.js.map

package/code-editor/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../../../src/code-editor/util.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGvC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAIpD,MAAM,CAAC,IAAM,mBAAmB,GAAwC,MAAM,CAAC;AAC/E,MAAM,CAAC,IAAM,kBAAkB,GAAuC,uBAAuB,CAAC;AAE9F,MAAM,UAAU,gBAAgB;IAC9B,OAAO;QACL,iBAAiB,EAAE,IAAI;KACxB,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,OAAoB;IAClD,IAAM,UAAU,GAAG,CAAC,CAAC,WAAW,CAC9B,OAAO,EACP,UAAA,IAAI,IAAI,OAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,yBAAyB,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EAAhG,CAAgG,CACzG,CAAC;IACF,OAAO,UAAU,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,mBAAmB,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAA4B;IACtD,OAAO,oBAAa,KAAK,CAAE,CAAC;AAC9B,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,QAAkC;;IACjE,OAAO,CAAA,MAAA,QAAQ,CAAC,MAAM,CAAC,UAAC,IAAuB,IAAK,OAAA,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAvB,CAAuB,CAAC,CAAC,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC;AAC/F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { Ace } from 'ace-builds';\n\nimport { AceModes } from './ace-modes';\nimport { LightThemes, DarkThemes } from './ace-themes';\nimport { CodeEditorProps } from './interfaces';\nimport { findUpUntil } from '../internal/utils/dom';\n\nexport type PaneStatus = 'error' | 'warning' | 'hidden';\n\nexport const DEFAULT_LIGHT_THEME: typeof LightThemes[number]['value'] = 'dawn';\nexport const DEFAULT_DARK_THEME: typeof DarkThemes[number]['value'] = 'tomorrow_night_bright';\n\nexport function getDefaultConfig(): Partial<Ace.EditorOptions> {\n  return {\n    behavioursEnabled: true,\n  };\n}\n\nexport function getDefaultTheme(element: HTMLElement): CodeEditorProps.Theme {\n  const isDarkMode = !!findUpUntil(\n    element,\n    node => node.classList.contains('awsui-polaris-dark-mode') || node.classList.contains('awsui-dark-mode')\n  );\n  return isDarkMode ? DEFAULT_DARK_THEME : DEFAULT_LIGHT_THEME;\n}\n\nexport function getAceTheme(theme: CodeEditorProps.Theme) {\n  return `ace/theme/${theme}`;\n}\n\nexport function getLanguageLabel(language: CodeEditorProps.Language): string {\n  return AceModes.filter((mode: { value: string }) => mode.value === language)[0]?.label || '';\n}\n"]}

package/collection-preferences/index.d.ts

@@ -0,0 +1,4 @@
+import { CollectionPreferencesProps } from './interfaces';
+export { CollectionPreferencesProps };
+export default function CollectionPreferences({ title, confirmLabel, cancelLabel, disabled, onConfirm, onCancel, visibleContentPreference, pageSizePreference, wrapLinesPreference, preferences, customPreference, ...rest }: CollectionPreferencesProps): JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/collection-preferences/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAK1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAmEtC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,WAAW,EACX,gBAAgB,EAChB,GAAG,IAAI,EACR,EAAE,0BAA0B,eAuF5B"}

package/collection-preferences/index.js

@@ -0,0 +1,68 @@
+import { __assign, __rest } from "tslib";
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { useEffect, useRef, useState } from 'react';
+import clsx from 'clsx';
+import { fireNonCancelableEvent } from '../internal/events';
+import { getBaseProps } from '../internal/base-component';
+import InternalBox from '../box/internal';
+import { InternalButton } from '../button/internal';
+import InternalModal from '../modal/internal';
+import InternalSpaceBetween from '../space-between/internal';
+import { copyPreferences, mergePreferences, ModalContentLayout, PageSizePreference, WrapLinesPreference, CustomPreference, } from './utils';
+import VisibleContentPreference from './visible-content';
+import checkControlled from '../internal/hooks/check-controlled';
+import styles from './styles.css.js';
+import { applyDisplayName } from '../internal/utils/apply-display-name';
+import useBaseComponent from '../internal/hooks/use-base-component';
+var ModalContent = function (_a) {
+    var _b = _a.preferences, preferences = _b === void 0 ? {} : _b, pageSizePreference = _a.pageSizePreference, wrapLinesPreference = _a.wrapLinesPreference, customPreference = _a.customPreference, visibleContentPreference = _a.visibleContentPreference, onChange = _a.onChange;
+    if (!visibleContentPreference && !pageSizePreference && !wrapLinesPreference && customPreference) {
+        return (React.createElement(CustomPreference, { value: preferences.custom, customPreference: customPreference, onChange: function (custom) { return onChange({ custom: custom }); } }));
+    }
+    return (React.createElement(ModalContentLayout, { left: React.createElement(InternalSpaceBetween, { size: "l" },
+            pageSizePreference && (React.createElement(PageSizePreference, __assign({ value: preferences.pageSize }, pageSizePreference, { onChange: function (pageSize) { return onChange({ pageSize: pageSize }); } }))),
+            wrapLinesPreference && (React.createElement(WrapLinesPreference, __assign({ value: preferences.wrapLines }, wrapLinesPreference, { onChange: function (wrapLines) { return onChange({ wrapLines: wrapLines }); } }))),
+            customPreference && (React.createElement(CustomPreference, { value: preferences.custom, customPreference: customPreference, onChange: function (custom) { return onChange({ custom: custom }); } }))), right: visibleContentPreference && (React.createElement(VisibleContentPreference, __assign({ value: preferences.visibleContent }, visibleContentPreference, { onChange: function (visibleContent) { return onChange({ visibleContent: visibleContent }); } }))) }));
+};
+export default function CollectionPreferences(_a) {
+    var title = _a.title, confirmLabel = _a.confirmLabel, cancelLabel = _a.cancelLabel, _b = _a.disabled, disabled = _b === void 0 ? false : _b, onConfirm = _a.onConfirm, onCancel = _a.onCancel, visibleContentPreference = _a.visibleContentPreference, pageSizePreference = _a.pageSizePreference, wrapLinesPreference = _a.wrapLinesPreference, preferences = _a.preferences, customPreference = _a.customPreference, rest = __rest(_a, ["title", "confirmLabel", "cancelLabel", "disabled", "onConfirm", "onCancel", "visibleContentPreference", "pageSizePreference", "wrapLinesPreference", "preferences", "customPreference"]);
+    var __internalRootRef = useBaseComponent('CollectionPreferences').__internalRootRef;
+    checkControlled('CollectioPreferences', 'preferences', preferences, 'onConfirm', onConfirm);
+    var baseProps = getBaseProps(rest);
+    var _c = useState(false), modalVisible = _c[0], setModalVisible = _c[1];
+    var _d = useState(copyPreferences(preferences || {})), temporaryPreferences = _d[0], setTemporaryPreferences = _d[1];
+    var triggerRef = useRef(null);
+    var dialogPreviouslyOpen = useRef(false);
+    useEffect(function () {
+        if (!modalVisible) {
+            dialogPreviouslyOpen.current && triggerRef.current && triggerRef.current.focus();
+        }
+        else {
+            dialogPreviouslyOpen.current = true;
+        }
+    }, [modalVisible]);
+    var onConfirmListener = function () {
+        setModalVisible(false);
+        fireNonCancelableEvent(onConfirm, temporaryPreferences);
+    };
+    var onCancelListener = function () {
+        fireNonCancelableEvent(onCancel, {});
+        setModalVisible(false);
+        setTemporaryPreferences(copyPreferences(preferences || {}));
+    };
+    return (React.createElement("div", __assign({}, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }),
+        React.createElement(InternalButton, { ref: triggerRef, className: styles['trigger-button'], disabled: disabled, ariaLabel: title, onClick: function () {
+                setTemporaryPreferences(copyPreferences(preferences || {}));
+                setModalVisible(true);
+            }, variant: "icon", iconName: "settings", formAction: "none" }),
+        !disabled && modalVisible && (React.createElement(InternalModal, { className: styles['modal-root'], visible: true, header: title, footer: React.createElement(InternalBox, { float: "right" },
+                React.createElement(InternalSpaceBetween, { direction: "horizontal", size: "xs" },
+                    React.createElement(InternalButton, { className: styles['cancel-button'], variant: "link", formAction: "none", onClick: onCancelListener }, cancelLabel),
+                    React.createElement(InternalButton, { className: styles['confirm-button'], variant: "primary", formAction: "none", onClick: onConfirmListener }, confirmLabel))), closeAriaLabel: cancelLabel, size: "large", onDismiss: onCancelListener },
+            React.createElement(ModalContent, { preferences: temporaryPreferences, visibleContentPreference: visibleContentPreference, pageSizePreference: pageSizePreference, wrapLinesPreference: wrapLinesPreference, customPreference: customPreference, onChange: function (changedPreferences) {
+                    return setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));
+                } })))));
+}
+applyDisplayName(CollectionPreferences, 'CollectionPreferences');
+//# sourceMappingURL=index.js.map

package/collection-preferences/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAE1C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAC9C,OAAO,oBAAoB,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EACL,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,SAAS,CAAC;AACjB,OAAO,wBAAwB,MAAM,mBAAmB,CAAC;AACzD,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAEjE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAYpE,IAAM,YAAY,GAAG,UAAC,EAOF;QANlB,mBAAgB,EAAhB,WAAW,mBAAG,EAAE,KAAA,EAChB,kBAAkB,wBAAA,EAClB,mBAAmB,yBAAA,EACnB,gBAAgB,sBAAA,EAChB,wBAAwB,8BAAA,EACxB,QAAQ,cAAA;IAER,IAAI,CAAC,wBAAwB,IAAI,CAAC,kBAAkB,IAAI,CAAC,mBAAmB,IAAI,gBAAgB,EAAE;QAChG,OAAO,CACL,oBAAC,gBAAgB,IACf,KAAK,EAAE,WAAW,CAAC,MAAM,EACzB,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EAAE,UAAA,MAAM,IAAI,OAAA,QAAQ,CAAC,EAAE,MAAM,QAAA,EAAE,CAAC,EAApB,CAAoB,GACxC,CACH,CAAC;KACH;IACD,OAAO,CACL,oBAAC,kBAAkB,IACjB,IAAI,EACF,oBAAC,oBAAoB,IAAC,IAAI,EAAC,GAAG;YAC3B,kBAAkB,IAAI,CACrB,oBAAC,kBAAkB,aACjB,KAAK,EAAE,WAAW,CAAC,QAAQ,IACvB,kBAAkB,IACtB,QAAQ,EAAE,UAAA,QAAQ,IAAI,OAAA,QAAQ,CAAC,EAAE,QAAQ,UAAA,EAAE,CAAC,EAAtB,CAAsB,IAC5C,CACH;YACA,mBAAmB,IAAI,CACtB,oBAAC,mBAAmB,aAClB,KAAK,EAAE,WAAW,CAAC,SAAS,IACxB,mBAAmB,IACvB,QAAQ,EAAE,UAAA,SAAS,IAAI,OAAA,QAAQ,CAAC,EAAE,SAAS,WAAA,EAAE,CAAC,EAAvB,CAAuB,IAC9C,CACH;YACA,gBAAgB,IAAI,CACnB,oBAAC,gBAAgB,IACf,KAAK,EAAE,WAAW,CAAC,MAAM,EACzB,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EAAE,UAAA,MAAM,IAAI,OAAA,QAAQ,CAAC,EAAE,MAAM,QAAA,EAAE,CAAC,EAApB,CAAoB,GACxC,CACH,CACoB,EAEzB,KAAK,EACH,wBAAwB,IAAI,CAC1B,oBAAC,wBAAwB,aACvB,KAAK,EAAE,WAAW,CAAC,cAAc,IAC7B,wBAAwB,IAC5B,QAAQ,EAAE,UAAA,cAAc,IAAI,OAAA,QAAQ,CAAC,EAAE,cAAc,gBAAA,EAAE,CAAC,EAA5B,CAA4B,IACxD,CACH,GAEH,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAajB;IAZ3B,IAAA,KAAK,WAAA,EACL,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,wBAAwB,8BAAA,EACxB,kBAAkB,wBAAA,EAClB,mBAAmB,yBAAA,EACnB,WAAW,iBAAA,EACX,gBAAgB,sBAAA,EACb,IAAI,cAZqC,yLAa7C,CADQ;IAEC,IAAA,iBAAiB,GAAK,gBAAgB,CAAC,uBAAuB,CAAC,kBAA9C,CAA+C;IACxE,eAAe,CAAC,sBAAsB,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAC5F,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAC/B,IAAA,KAAkC,QAAQ,CAAC,KAAK,CAAC,EAAhD,YAAY,QAAA,EAAE,eAAe,QAAmB,CAAC;IAClD,IAAA,KAAkD,QAAQ,CAAC,eAAe,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,EAA7F,oBAAoB,QAAA,EAAE,uBAAuB,QAAgD,CAAC;IACrG,IAAM,UAAU,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IACjD,IAAM,oBAAoB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC3C,SAAS,CAAC;QACR,IAAI,CAAC,YAAY,EAAE;YACjB,oBAAoB,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAClF;aAAM;YACL,oBAAoB,CAAC,OAAO,GAAG,IAAI,CAAC;SACrC;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,IAAM,iBAAiB,GAAG;QACxB,eAAe,CAAC,KAAK,CAAC,CAAC;QACvB,sBAAsB,CAAC,SAAS,EAAE,oBAAoB,CAAC,CAAC;IAC1D,CAAC,CAAC;IAEF,IAAM,gBAAgB,GAAG;QACvB,sBAAsB,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;QACrC,eAAe,CAAC,KAAK,CAAC,CAAC;QACvB,uBAAuB,CAAC,eAAe,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,CAAC;IAC9D,CAAC,CAAC;IAEF,OAAO,CACL,wCAAS,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,iBAAiB;QAC3F,oBAAC,cAAc,IACb,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,KAAK,EAChB,OAAO,EAAE;gBACP,uBAAuB,CAAC,eAAe,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,CAAC;gBAC5D,eAAe,CAAC,IAAI,CAAC,CAAC;YACxB,CAAC,EACD,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,UAAU,EACnB,UAAU,EAAC,MAAM,GACjB;QACD,CAAC,QAAQ,IAAI,YAAY,IAAI,CAC5B,oBAAC,aAAa,IACZ,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAC/B,OAAO,EAAE,IAAI,EACb,MAAM,EAAE,KAAK,EACb,MAAM,EACJ,oBAAC,WAAW,IAAC,KAAK,EAAC,OAAO;gBACxB,oBAAC,oBAAoB,IAAC,SAAS,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI;oBACpD,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,EAClC,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,OAAO,EAAE,gBAAgB,IAExB,WAAW,CACG;oBACjB,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,OAAO,EAAC,SAAS,EACjB,UAAU,EAAC,MAAM,EACjB,OAAO,EAAE,iBAAiB,IAEzB,YAAY,CACE,CACI,CACX,EAEhB,cAAc,EAAE,WAAW,EAC3B,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,gBAAgB;YAE3B,oBAAC,YAAY,IACX,WAAW,EAAE,oBAAoB,EACjC,wBAAwB,EAAE,wBAAwB,EAClD,kBAAkB,EAAE,kBAAkB,EACtC,mBAAmB,EAAE,mBAAmB,EACxC,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EAAE,UAAA,kBAAkB;oBAC1B,OAAA,uBAAuB,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,oBAAoB,CAAC,CAAC;gBAAnF,CAAmF,GAErF,CACY,CACjB,CACG,CACP,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,qBAAqB,EAAE,uBAAuB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { getBaseProps } from '../internal/base-component';\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport InternalModal from '../modal/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport {\n  copyPreferences,\n  mergePreferences,\n  ModalContentLayout,\n  PageSizePreference,\n  WrapLinesPreference,\n  CustomPreference,\n} from './utils';\nimport VisibleContentPreference from './visible-content';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { CollectionPreferencesProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { CollectionPreferencesProps };\n\ninterface ModalContentProps\n  extends Pick<\n    CollectionPreferencesProps,\n    'preferences' | 'visibleContentPreference' | 'pageSizePreference' | 'wrapLinesPreference' | 'customPreference'\n  > {\n  onChange: (preferences: CollectionPreferencesProps.Preferences) => void;\n}\n\nconst ModalContent = ({\n  preferences = {},\n  pageSizePreference,\n  wrapLinesPreference,\n  customPreference,\n  visibleContentPreference,\n  onChange,\n}: ModalContentProps) => {\n  if (!visibleContentPreference && !pageSizePreference && !wrapLinesPreference && customPreference) {\n    return (\n      <CustomPreference\n        value={preferences.custom}\n        customPreference={customPreference}\n        onChange={custom => onChange({ custom })}\n      />\n    );\n  }\n  return (\n    <ModalContentLayout\n      left={\n        <InternalSpaceBetween size=\"l\">\n          {pageSizePreference && (\n            <PageSizePreference\n              value={preferences.pageSize}\n              {...pageSizePreference}\n              onChange={pageSize => onChange({ pageSize })}\n            />\n          )}\n          {wrapLinesPreference && (\n            <WrapLinesPreference\n              value={preferences.wrapLines}\n              {...wrapLinesPreference}\n              onChange={wrapLines => onChange({ wrapLines })}\n            />\n          )}\n          {customPreference && (\n            <CustomPreference\n              value={preferences.custom}\n              customPreference={customPreference}\n              onChange={custom => onChange({ custom })}\n            />\n          )}\n        </InternalSpaceBetween>\n      }\n      right={\n        visibleContentPreference && (\n          <VisibleContentPreference\n            value={preferences.visibleContent}\n            {...visibleContentPreference}\n            onChange={visibleContent => onChange({ visibleContent })}\n          />\n        )\n      }\n    />\n  );\n};\n\nexport default function CollectionPreferences({\n  title,\n  confirmLabel,\n  cancelLabel,\n  disabled = false,\n  onConfirm,\n  onCancel,\n  visibleContentPreference,\n  pageSizePreference,\n  wrapLinesPreference,\n  preferences,\n  customPreference,\n  ...rest\n}: CollectionPreferencesProps) {\n  const { __internalRootRef } = useBaseComponent('CollectionPreferences');\n  checkControlled('CollectioPreferences', 'preferences', preferences, 'onConfirm', onConfirm);\n  const baseProps = getBaseProps(rest);\n  const [modalVisible, setModalVisible] = useState(false);\n  const [temporaryPreferences, setTemporaryPreferences] = useState(copyPreferences(preferences || {}));\n  const triggerRef = useRef<ButtonProps.Ref>(null);\n  const dialogPreviouslyOpen = useRef(false);\n  useEffect(() => {\n    if (!modalVisible) {\n      dialogPreviouslyOpen.current && triggerRef.current && triggerRef.current.focus();\n    } else {\n      dialogPreviouslyOpen.current = true;\n    }\n  }, [modalVisible]);\n\n  const onConfirmListener = () => {\n    setModalVisible(false);\n    fireNonCancelableEvent(onConfirm, temporaryPreferences);\n  };\n\n  const onCancelListener = () => {\n    fireNonCancelableEvent(onCancel, {});\n    setModalVisible(false);\n    setTemporaryPreferences(copyPreferences(preferences || {}));\n  };\n\n  return (\n    <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n      <InternalButton\n        ref={triggerRef}\n        className={styles['trigger-button']}\n        disabled={disabled}\n        ariaLabel={title}\n        onClick={() => {\n          setTemporaryPreferences(copyPreferences(preferences || {}));\n          setModalVisible(true);\n        }}\n        variant=\"icon\"\n        iconName=\"settings\"\n        formAction=\"none\"\n      />\n      {!disabled && modalVisible && (\n        <InternalModal\n          className={styles['modal-root']}\n          visible={true}\n          header={title}\n          footer={\n            <InternalBox float=\"right\">\n              <InternalSpaceBetween direction=\"horizontal\" size=\"xs\">\n                <InternalButton\n                  className={styles['cancel-button']}\n                  variant=\"link\"\n                  formAction=\"none\"\n                  onClick={onCancelListener}\n                >\n                  {cancelLabel}\n                </InternalButton>\n                <InternalButton\n                  className={styles['confirm-button']}\n                  variant=\"primary\"\n                  formAction=\"none\"\n                  onClick={onConfirmListener}\n                >\n                  {confirmLabel}\n                </InternalButton>\n              </InternalSpaceBetween>\n            </InternalBox>\n          }\n          closeAriaLabel={cancelLabel}\n          size=\"large\"\n          onDismiss={onCancelListener}\n        >\n          <ModalContent\n            preferences={temporaryPreferences}\n            visibleContentPreference={visibleContentPreference}\n            pageSizePreference={pageSizePreference}\n            wrapLinesPreference={wrapLinesPreference}\n            customPreference={customPreference}\n            onChange={changedPreferences =>\n              setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences))\n            }\n          />\n        </InternalModal>\n      )}\n    </div>\n  );\n}\n\napplyDisplayName(CollectionPreferences, 'CollectionPreferences');\n"]}

package/collection-preferences/interfaces.d.ts

@@ -0,0 +1,147 @@
+import { BaseComponentProps } from '../internal/base-component';
+import { NonCancelableEventHandler } from '../internal/events';
+export interface CollectionPreferencesProps<CustomPreferenceType = any> extends BaseComponentProps {
+    /**
+     * Specifies the title of the preferences modal dialog. It is also used as an `aria-label` for the trigger button.
+     */
+    title: string;
+    /**
+     * Label of the confirm button in the modal footer.
+     */
+    confirmLabel: string;
+    /**
+     * Label of the cancel button in the modal footer.
+     */
+    cancelLabel: string;
+    /**
+     * Determines whether the preferences trigger button is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Configures the built-in "page size selection" preference.
+     *
+     * If you set it, the component displays this preference in the modal.
+     *
+     * It contains the following:
+     * - `title` (string) - Specifies the text displayed at the top of the preference.
+     * - `options` - Specifies an array of options for page size selection. Each entry contains:
+     *   - `value` (number) - The value for the radio button (that is, the number of items per page).
+     *   - `label` (string) - A label for the radio button (for example, "10 resources").
+     *
+     * You must set the current value in the `preferences.pageSize` property.
+     */
+    pageSizePreference?: CollectionPreferencesProps.PageSizePreference;
+    /**
+     * Configures the built-in "wrap lines" preference.
+     *
+     * If you set it, the component displays this preference in the modal.
+     *
+     * It contains the following:
+     * - `label` (string) - Specifies the label for the option checkbox.
+     * - `description` (string) - Specifies the text displayed below the checkbox label.
+     *
+     * You must set the current value in the `preferences.wrapLines` property.
+     */
+    wrapLinesPreference?: CollectionPreferencesProps.WrapLinesPreference;
+    /**
+     * Configures the built-in "visible content selection" preference (for example, visible columns in a table).
+     *
+     * If you set it, the component displays this preference in the modal.
+     *
+     * It contains the following:
+     * - `title` (string) - Specifies the text displayed at the top of the preference.
+     * - `options` - Specifies an array of groups of options for visible content selection.
+     *
+     * Each group of options contains the following:
+     * - `label` (string) - The text to display as a title for the options group.
+     * - `options` - Specifies an aray of options in the group. Each option contains the following:
+     *   - `id` (string) - Corresponds to a column `id` for tables or to a section `id` for cards.
+     *   - `label` (string) - Specifies a short description of the content.
+     *   - `editable` (boolean) - (Optional) Determines whether the user is able to toggle its visibility. This is `true` by default.
+     *
+     * You must set the current list of visible content `id`s in the `preferences.visibleContent` property.
+     */
+    visibleContentPreference?: CollectionPreferencesProps.VisibleContentPreference;
+    /**
+     * Specifies the current preference values. This includes both built-in and custom preferences.
+     *
+     * It contains the following:
+     * - `pageSize` (number) - (Optional)
+     * - `wrapLines` (boolean) - (Optional)
+     * - `visibleContent` (ReadonlyArray<string>) - Specifies the list of visible content `id`s. The order of the `id`s does not influence the display.
+     * - `custom` (CustomPreferenceType) - Specifies the value for your custom preference.
+     */
+    preferences?: CollectionPreferencesProps.Preferences<CustomPreferenceType>;
+    /**
+     * Configures custom preferences. The function receives two parameters:
+     *
+     * - `customValue` (CustomPreferenceType) - Current value for your custom preference. It is initialized using the value you provide in `preferences.custom`.
+     * - `setCustomValue` - A function that is called to notify a state update.
+     *
+     * It should return the content of your custom preference, for example:
+     * ```
+     * (customValue, setCustomValue) => (
+     *   <Checkbox checked={customValue} onChange={({ detail }) => setCustomValue(detail.checked)} />
+     * )
+     * ```
+     *
+     * When the user confirms the changes, the new value is passed in the `detail.custom` property of the `onConfirm` listener.
+     * When the user cancels the changes, the `customValue` is reset to the one present in `preferences.custom` property.
+     *
+     * **Display**
+     * - If any of the built-in preferences (`pageSizePreference`, `wrapLinesPreference`, or `visibleContentPreference`) are displayed,
+     * the custom content is displayed at the bottom of the left column within the modal.
+     * - If no built-in preference is displayed, the custom content occupies the whole modal.
+     */
+    customPreference?: (customValue: CustomPreferenceType, setCustomValue: React.Dispatch<CustomPreferenceType>) => React.ReactNode;
+    /**
+     * Called when the user cancels a preference change using the cancel button in the modal footer or by dismissing the modal.
+     */
+    onCancel?: NonCancelableEventHandler;
+    /**
+     * Called when the user confirms a preference change using the confirm button in the modal footer.
+     *
+     * The event `detail` contains the following:
+     * - `pageSize` (number) - (Optional) The selected page size value. Available only if you specify the `pageSizePreference` property.
+     * - `wrapLines` (boolean) - (Optional) The current line wrapping preference value. Available only if you specify the `wrapLinesPreference` property.
+     * - `visibleContent` (ReadonlyArray<string>) - (Optional) The list of selected content `id`s. Available only if you specify the `visibleContentPreference` property.
+     * - `custom` (CustomPreferenceType) - (Optional) The selected value for your custom preference.
+     *
+     * The values for all configured preferences are present even if the user didn't change their values.
+     */
+    onConfirm?: NonCancelableEventHandler<CollectionPreferencesProps.Preferences<CustomPreferenceType>>;
+}
+export declare namespace CollectionPreferencesProps {
+    interface Preferences<CustomPreferenceType = any> {
+        pageSize?: number;
+        wrapLines?: boolean;
+        visibleContent?: ReadonlyArray<string>;
+        custom?: CustomPreferenceType;
+    }
+    interface VisibleContentPreference {
+        title: string;
+        options: ReadonlyArray<CollectionPreferencesProps.VisibleContentOptionsGroup>;
+    }
+    interface VisibleContentOptionsGroup {
+        label: string;
+        options: ReadonlyArray<CollectionPreferencesProps.VisibleContentOption>;
+    }
+    interface VisibleContentOption {
+        id: string;
+        label: string;
+        editable?: boolean;
+    }
+    interface PageSizePreference {
+        title: string;
+        options: ReadonlyArray<PageSizeOption>;
+    }
+    interface PageSizeOption {
+        value: number;
+        label: string;
+    }
+    interface WrapLinesPreference {
+        label: string;
+        description: string;
+    }
+}
+//# sourceMappingURL=interfaces.d.ts.map

package/collection-preferences/interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,0BAA0B,CAAC,oBAAoB,GAAG,GAAG,CAAE,SAAQ,kBAAkB;IAChG;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;;;;OAYG;IACH,kBAAkB,CAAC,EAAE,0BAA0B,CAAC,kBAAkB,CAAC;IACnE;;;;;;;;;;OAUG;IACH,mBAAmB,CAAC,EAAE,0BAA0B,CAAC,mBAAmB,CAAC;IACrE;;;;;;;;;;;;;;;;;OAiBG;IACH,wBAAwB,CAAC,EAAE,0BAA0B,CAAC,wBAAwB,CAAC;IAC/E;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,0BAA0B,CAAC,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAC3E;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,gBAAgB,CAAC,EAAE,CACjB,WAAW,EAAE,oBAAoB,EACjC,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,oBAAoB,CAAC,KACjD,KAAK,CAAC,SAAS,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;IACrC;;;;;;;;;;OAUG;IACH,SAAS,CAAC,EAAE,yBAAyB,CAAC,0BAA0B,CAAC,WAAW,CAAC,oBAAoB,CAAC,CAAC,CAAC;CACrG;AAED,yBAAiB,0BAA0B,CAAC;IAC1C,UAAiB,WAAW,CAAC,oBAAoB,GAAG,GAAG;QACrD,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB,cAAc,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QACvC,MAAM,CAAC,EAAE,oBAAoB,CAAC;KAC/B;IAED,UAAiB,wBAAwB;QACvC,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,aAAa,CAAC,0BAA0B,CAAC,0BAA0B,CAAC,CAAC;KAC/E;IAED,UAAiB,0BAA0B;QACzC,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,aAAa,CAAC,0BAA0B,CAAC,oBAAoB,CAAC,CAAC;KACzE;IAED,UAAiB,oBAAoB;QACnC,EAAE,EAAE,MAAM,CAAC;QACX,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB;IAED,UAAiB,kBAAkB;QACjC,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;KACxC;IAED,UAAiB,cAAc;QAC7B,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,mBAAmB;QAClC,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;KACrB;CACF"}

package/collection-preferences/interfaces.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=interfaces.js.map

package/collection-preferences/interfaces.js.map

@@ -0,0 +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';\n\nexport interface CollectionPreferencesProps<CustomPreferenceType = any> extends BaseComponentProps {\n  /**\n   * Specifies the title of the preferences modal dialog. It is also used as an `aria-label` for the trigger button.\n   */\n  title: string;\n  /**\n   * Label of the confirm button in the modal footer.\n   */\n  confirmLabel: string;\n  /**\n   * Label of the cancel button in the modal footer.\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   */\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   */\n  wrapLinesPreference?: CollectionPreferencesProps.WrapLinesPreference;\n  /**\n   * Configures the built-in \"visible content selection\" preference (for example, visible columns in a table).\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 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  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   * - `visibleContent` (ReadonlyArray<string>) - Specifies the list of visible content `id`s. The order of the `id`s does not influence the display.\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   * - `pageSize` (number) - (Optional) The selected page size value. Available only if you specify the `pageSizePreference` property.\n   * - `wrapLines` (boolean) - (Optional) The current line wrapping preference value. Available only if you specify the `wrapLinesPreference` property.\n   * - `visibleContent` (ReadonlyArray<string>) - (Optional) The list of selected content `id`s. Available only if you specify the `visibleContentPreference` property.\n   * - `custom` (CustomPreferenceType) - (Optional) The selected value for your custom preference.\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    visibleContent?: ReadonlyArray<string>;\n    custom?: CustomPreferenceType;\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"]}

package/collection-preferences/styles.css.js

@@ -0,0 +1,24 @@
+
+    import './styles.scoped.css';
+    export default {
+  "visible-content": "awsui_visible-content_tc96w_d6ntf_185",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_d6ntf_186",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_d6ntf_187",
+  "visible-content-group": "awsui_visible-content-group_tc96w_d6ntf_187",
+  "visible-content-title": "awsui_visible-content-title_tc96w_d6ntf_192",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_d6ntf_200",
+  "visible-content-option": "awsui_visible-content-option_tc96w_d6ntf_206",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_d6ntf_217",
+  "root": "awsui_root_tc96w_d6ntf_225",
+  "modal-root": "awsui_modal-root_tc96w_d6ntf_226",
+  "trigger-button": "awsui_trigger-button_tc96w_d6ntf_227",
+  "cancel-button": "awsui_cancel-button_tc96w_d6ntf_228",
+  "confirm-button": "awsui_confirm-button_tc96w_d6ntf_229",
+  "custom": "awsui_custom_tc96w_d6ntf_230",
+  "second-column-small": "awsui_second-column-small_tc96w_d6ntf_234",
+  "wrap-lines": "awsui_wrap-lines_tc96w_d6ntf_238",
+  "page-size": "awsui_page-size_tc96w_d6ntf_239",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_d6ntf_240",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_d6ntf_241"
+};
+