@cloudscape-design/components-themeable 3.0.285 → 3.0.287

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "a1bd4b19f8739e1e750b28ec16aa81b484ced6c5"
+  "commit": "5be17e483a93ab82d657d8c366697812b7ed6177"
 }

package/lib/internal/scss/collection-preferences/content-display/content-display-option.scss

@@ -40,7 +40,6 @@ $border-radius: awsui.$border-radius-item;
   border-top: awsui.$border-divider-list-width solid awsui.$color-border-divider-default;
   &:not(.placeholder).sorting {
     @include animated;
-    z-index: 1;
   }
   &.placeholder {
     > .content-display-option-content {

package/lib/internal/scss/collection-preferences/styles.scss

@@ -26,6 +26,11 @@
 .content-density,
 .page-size,
 .page-size-form-field,
-.page-size-radio-group {
+.page-size-radio-group,
+.sticky-columns,
+.sticky-columns-form-field,
+.sticky-columns-radio-group,
+.sticky-columns-first,
+.sticky-columns-last {
   /* used in test-utils */
 }

package/lib/internal/scss/table/body-cell/styles.scss

@@ -53,6 +53,9 @@ $border-placeholder: awsui.$border-item-width solid transparent;
       */
     &:first-child.has-striped-rows {
       padding-left: awsui.$space-xxs;
+      &-sticky-cell-pad-left {
+        padding-left: awsui.$space-table-horizontal;
+      }
     }
 
     /*
@@ -102,6 +105,48 @@ $border-placeholder: awsui.$border-item-width solid transparent;
     }
   }
 
+  &.sticky-cell {
+    position: sticky;
+    background: awsui.$color-background-container-content;
+    z-index: 798; // Our sticky elements should have z-index in the range of 800-850, this value needs to be lower
+    &-pad-left:not(.has-selection):not(.is-visual-refresh.body-cell:first-child.has-striped-rows) {
+      padding-left: awsui.$space-table-horizontal;
+    }
+    &.body-cell-shaded {
+      background: awsui.$color-background-cell-shaded;
+    }
+    &.body-cell-selected {
+      background-color: awsui.$color-background-item-selected;
+
+      // Create a background using box-shadow and clip path to hide underlying elements
+      &:first-child {
+        box-shadow: 0 0 0 4px awsui.$color-background-container-content;
+        clip-path: inset(0 0 0 0);
+      }
+      &:last-child {
+        box-shadow: 4px 0 0 0 awsui.$color-background-container-content;
+        clip-path: inset(0 0 0 0);
+        &.sticky-cell-last-right {
+          box-shadow: awsui.$shadow-sticky-column-last, 8px 0 0 0 awsui.$color-background-container-content;
+          clip-path: inset(0 0 0 -24px);
+        }
+      }
+    }
+    &-last-left {
+      box-shadow: awsui.$shadow-sticky-column-first;
+      clip-path: inset(0px -24px 0px 0px);
+    }
+    &-last-right {
+      box-shadow: awsui.$shadow-sticky-column-last;
+      clip-path: inset(0 0 0 -24px);
+    }
+    @include styles.with-motion {
+      transition-property: padding;
+      transition-duration: awsui.$motion-duration-transition-show-quick;
+      transition-timing-function: awsui.$motion-easing-sticky;
+    }
+  }
+
   // Use padding as a selected border placeholder to make sure rows don't change height on selection (visual refresh)
   &-selected:not(:first-child) {
     padding-top: $cell-vertical-padding-w-border;
@@ -193,8 +238,15 @@ $border-placeholder: awsui.$border-item-width solid transparent;
     position: relative;
     cursor: pointer;
 
+    &.sticky-cell {
+      position: sticky;
+    }
+
     &.body-cell-edit-active {
       overflow: visible;
+      &.sticky-cell {
+        position: sticky;
+      }
     }
 
     &:not(.body-cell-edit-active) {

package/lib/internal/scss/table/header-cell/styles.scss

@@ -31,6 +31,31 @@
     padding-right: awsui.$space-xs;
   }
 
+  &.sticky-cell {
+    position: sticky;
+    background: awsui.$color-background-table-header;
+    z-index: 798; // Lower than the AppLayout's notification slot z-index(799)
+    &-pad-left:not(.has-selection) {
+      padding-left: awsui.$space-table-horizontal;
+    }
+    &-last-left {
+      box-shadow: awsui.$shadow-sticky-column-first;
+      clip-path: inset(0px -24px 0px 0px);
+      &:not(.header-cell-resizable):before {
+        display: none;
+      }
+    }
+    &-last-right {
+      box-shadow: awsui.$shadow-sticky-column-last;
+      clip-path: inset(0 0 0 -24px);
+    }
+    @include styles.with-motion {
+      transition-property: padding;
+      transition-duration: awsui.$motion-duration-transition-show-quick;
+      transition-timing-function: awsui.$motion-easing-sticky;
+    }
+  }
+
   &:not(:last-child):before {
     $gap: calc(2 * #{awsui.$space-xs} + #{awsui.$space-xxxs});
 
@@ -139,6 +164,9 @@ settings icon in the pagination slot.
 .header-cell.is-visual-refresh {
   &:first-child:not(.has-striped-rows) {
     padding-left: awsui.$space-xxxs;
+    &.sticky-cell-pad-left {
+      padding-left: awsui.$space-table-horizontal;
+    }
   }
 
   /*

package/lib/internal/template/checkbox/base-checkbox.d.ts

@@ -41,5 +41,10 @@ export interface BaseCheckboxProps extends BaseComponentProps, FormFieldControlP
      * Description that appears below the label.
      */
     description?: React.ReactNode;
+    /**
+     * Adds `aria-controls` attribute to the component.
+     * If the component controls any secondary content (for example, another form field), use this to provide an ID referring to the secondary content.
+     */
+    ariaControls?: string;
 }
 //# sourceMappingURL=base-checkbox.d.ts.map

package/lib/internal/template/checkbox/base-checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base-checkbox.d.ts","sourceRoot":"lib/default/","sources":["checkbox/base-checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAE/E,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB,EAAE,qBAAqB;IAClF;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,yBAAyB,CAAC;IAEpC;;OAEG;IACH,MAAM,CAAC,EAAE,yBAAyB,CAAC;IAEnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B"}
+{"version":3,"file":"base-checkbox.d.ts","sourceRoot":"lib/default/","sources":["checkbox/base-checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAE/E,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB,EAAE,qBAAqB;IAClF;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,yBAAyB,CAAC;IAEpC;;OAEG;IACH,MAAM,CAAC,EAAE,yBAAyB,CAAC;IAEnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB"}

package/lib/internal/template/checkbox/base-checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-checkbox.js","sourceRoot":"lib/default/","sources":["checkbox/base-checkbox.tsx"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { FormFieldControlProps } from '../internal/context/form-field-context';\n\nexport interface BaseCheckboxProps extends BaseComponentProps, FormFieldControlProps {\n  /**\n   * Specifies if the component is selected.\n   */\n  checked: boolean;\n\n  /**\n   * Specifies the name of the control used in HTML forms.\n   */\n  name?: string;\n\n  /**\n   * Specifies if the control is disabled, which prevents the\n   * user from modifying the value and prevents the value from\n   * being included in a form submission. A disabled control can't\n   * receive focus.\n   */\n  disabled?: boolean;\n\n  /**\n   * Specifies the ID of the native form element. By default, it uses an automatically generated ID.\n   */\n  controlId?: string;\n\n  /**\n   * Adds an `aria-label` to the native control.\n   *\n   * Use this if you don't have a visible label for this control.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Called when input focus is moved to the UI control.\n   */\n  onFocus?: NonCancelableEventHandler;\n\n  /**\n   * Called when input focus is removed from the UI control.\n   */\n  onBlur?: NonCancelableEventHandler;\n\n  children?: React.ReactNode;\n\n  /**\n   * Description that appears below the label.\n   */\n  description?: React.ReactNode;\n}\n"]}
+{"version":3,"file":"base-checkbox.js","sourceRoot":"lib/default/","sources":["checkbox/base-checkbox.tsx"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { FormFieldControlProps } from '../internal/context/form-field-context';\n\nexport interface BaseCheckboxProps extends BaseComponentProps, FormFieldControlProps {\n  /**\n   * Specifies if the component is selected.\n   */\n  checked: boolean;\n\n  /**\n   * Specifies the name of the control used in HTML forms.\n   */\n  name?: string;\n\n  /**\n   * Specifies if the control is disabled, which prevents the\n   * user from modifying the value and prevents the value from\n   * being included in a form submission. A disabled control can't\n   * receive focus.\n   */\n  disabled?: boolean;\n\n  /**\n   * Specifies the ID of the native form element. By default, it uses an automatically generated ID.\n   */\n  controlId?: string;\n\n  /**\n   * Adds an `aria-label` to the native control.\n   *\n   * Use this if you don't have a visible label for this control.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Called when input focus is moved to the UI control.\n   */\n  onFocus?: NonCancelableEventHandler;\n\n  /**\n   * Called when input focus is removed from the UI control.\n   */\n  onBlur?: NonCancelableEventHandler;\n\n  children?: React.ReactNode;\n\n  /**\n   * Description that appears below the label.\n   */\n  description?: React.ReactNode;\n\n  /**\n   * Adds `aria-controls` attribute to the component.\n   * If the component controls any secondary content (for example, another form field), use this to provide an ID referring to the secondary content.\n   */\n  ariaControls?: string;\n}\n"]}

package/lib/internal/template/checkbox/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["checkbox/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,UAAU,aAAc,SAAQ,aAAa,EAAE,0BAA0B;IACvE,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,gBAAgB,yFA2ErB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["checkbox/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,UAAU,aAAc,SAAQ,aAAa,EAAE,0BAA0B;IACvE,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,gBAAgB,yFA6ErB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/internal/template/checkbox/internal.js

@@ -11,7 +11,7 @@ import styles from './styles.css.js';
 import CheckboxIcon from '../internal/components/checkbox-icon';
 import { useFormFieldContext } from '../internal/context/form-field-context';
 const InternalCheckbox = React.forwardRef((_a, ref) => {
-    var { controlId, name, checked, disabled, ariaRequired, indeterminate, children, description, ariaLabel, onFocus, onBlur, onChange, tabIndex, showOutline, __internalRootRef } = _a, rest = __rest(_a, ["controlId", "name", "checked", "disabled", "ariaRequired", "indeterminate", "children", "description", "ariaLabel", "onFocus", "onBlur", "onChange", "tabIndex", "showOutline", "__internalRootRef"]);
+    var { controlId, name, checked, disabled, ariaRequired, indeterminate, children, description, ariaLabel, onFocus, onBlur, onChange, tabIndex, showOutline, ariaControls, __internalRootRef } = _a, rest = __rest(_a, ["controlId", "name", "checked", "disabled", "ariaRequired", "indeterminate", "children", "description", "ariaLabel", "onFocus", "onBlur", "onChange", "tabIndex", "showOutline", "ariaControls", "__internalRootRef"]);
     const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(rest);
     const baseProps = getBaseProps(rest);
     const checkboxRef = useRef(null);
@@ -21,7 +21,7 @@ const InternalCheckbox = React.forwardRef((_a, ref) => {
             checkboxRef.current.indeterminate = Boolean(indeterminate);
         }
     });
-    return (React.createElement(AbstractSwitch, Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className), controlClassName: styles['checkbox-control'], outlineClassName: styles.outline, controlId: controlId, disabled: disabled, label: children, description: description, descriptionBottomPadding: true, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, showOutline: showOutline, nativeControl: nativeControlProps => (React.createElement("input", Object.assign({}, nativeControlProps, { ref: checkboxRef, type: "checkbox", checked: checked, name: name, "aria-required": ariaRequired ? 'true' : undefined, tabIndex: tabIndex, onFocus: () => fireNonCancelableEvent(onFocus), onBlur: () => fireNonCancelableEvent(onBlur), 
+    return (React.createElement(AbstractSwitch, Object.assign({}, baseProps, { className: clsx(styles.root, baseProps.className), controlClassName: styles['checkbox-control'], outlineClassName: styles.outline, controlId: controlId, disabled: disabled, label: children, description: description, descriptionBottomPadding: true, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, ariaControls: ariaControls, showOutline: showOutline, nativeControl: nativeControlProps => (React.createElement("input", Object.assign({}, nativeControlProps, { ref: checkboxRef, type: "checkbox", checked: checked, name: name, "aria-required": ariaRequired ? 'true' : undefined, tabIndex: tabIndex, onFocus: () => fireNonCancelableEvent(onFocus), onBlur: () => fireNonCancelableEvent(onBlur), 
             // empty handler to suppress React controllability warning
             onChange: () => { } }))), onClick: () => {
             var _a;

package/lib/internal/template/checkbox/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["checkbox/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { getBaseProps } from '../internal/base-component';\nimport AbstractSwitch from '../internal/components/abstract-switch';\nimport { CheckboxProps } from './interfaces';\nimport styles from './styles.css.js';\nimport CheckboxIcon from '../internal/components/checkbox-icon';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\n\ninterface InternalProps extends CheckboxProps, InternalBaseComponentProps {\n  tabIndex?: -1;\n  showOutline?: boolean;\n}\n\nconst InternalCheckbox = React.forwardRef<CheckboxProps.Ref, InternalProps>(\n  (\n    {\n      controlId,\n      name,\n      checked,\n      disabled,\n      ariaRequired,\n      indeterminate,\n      children,\n      description,\n      ariaLabel,\n      onFocus,\n      onBlur,\n      onChange,\n      tabIndex,\n      showOutline,\n      __internalRootRef,\n      ...rest\n    },\n    ref\n  ) => {\n    const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(rest);\n    const baseProps = getBaseProps(rest);\n    const checkboxRef = useRef<HTMLInputElement>(null);\n    useForwardFocus(ref, checkboxRef);\n    useEffect(() => {\n      if (checkboxRef.current) {\n        checkboxRef.current.indeterminate = Boolean(indeterminate);\n      }\n    });\n\n    return (\n      <AbstractSwitch\n        {...baseProps}\n        className={clsx(styles.root, baseProps.className)}\n        controlClassName={styles['checkbox-control']}\n        outlineClassName={styles.outline}\n        controlId={controlId}\n        disabled={disabled}\n        label={children}\n        description={description}\n        descriptionBottomPadding={true}\n        ariaLabel={ariaLabel}\n        ariaLabelledby={ariaLabelledby}\n        ariaDescribedby={ariaDescribedby}\n        showOutline={showOutline}\n        nativeControl={nativeControlProps => (\n          <input\n            {...nativeControlProps}\n            ref={checkboxRef}\n            type=\"checkbox\"\n            checked={checked}\n            name={name}\n            aria-required={ariaRequired ? 'true' : undefined}\n            tabIndex={tabIndex}\n            onFocus={() => fireNonCancelableEvent(onFocus)}\n            onBlur={() => fireNonCancelableEvent(onBlur)}\n            // empty handler to suppress React controllability warning\n            onChange={() => {}}\n          />\n        )}\n        onClick={() => {\n          checkboxRef.current?.focus();\n          fireNonCancelableEvent(\n            onChange,\n            // for deterministic transitions \"indeterminate\" -> \"checked\" -> \"unchecked\"\n            indeterminate ? { checked: true, indeterminate: false } : { checked: !checked, indeterminate: false }\n          );\n        }}\n        styledControl={<CheckboxIcon checked={checked} indeterminate={indeterminate} disabled={disabled} />}\n        __internalRootRef={__internalRootRef}\n      />\n    );\n  }\n);\n\nexport default InternalCheckbox;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["checkbox/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { getBaseProps } from '../internal/base-component';\nimport AbstractSwitch from '../internal/components/abstract-switch';\nimport { CheckboxProps } from './interfaces';\nimport styles from './styles.css.js';\nimport CheckboxIcon from '../internal/components/checkbox-icon';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\n\ninterface InternalProps extends CheckboxProps, InternalBaseComponentProps {\n  tabIndex?: -1;\n  showOutline?: boolean;\n}\n\nconst InternalCheckbox = React.forwardRef<CheckboxProps.Ref, InternalProps>(\n  (\n    {\n      controlId,\n      name,\n      checked,\n      disabled,\n      ariaRequired,\n      indeterminate,\n      children,\n      description,\n      ariaLabel,\n      onFocus,\n      onBlur,\n      onChange,\n      tabIndex,\n      showOutline,\n      ariaControls,\n      __internalRootRef,\n      ...rest\n    },\n    ref\n  ) => {\n    const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(rest);\n    const baseProps = getBaseProps(rest);\n    const checkboxRef = useRef<HTMLInputElement>(null);\n    useForwardFocus(ref, checkboxRef);\n    useEffect(() => {\n      if (checkboxRef.current) {\n        checkboxRef.current.indeterminate = Boolean(indeterminate);\n      }\n    });\n\n    return (\n      <AbstractSwitch\n        {...baseProps}\n        className={clsx(styles.root, baseProps.className)}\n        controlClassName={styles['checkbox-control']}\n        outlineClassName={styles.outline}\n        controlId={controlId}\n        disabled={disabled}\n        label={children}\n        description={description}\n        descriptionBottomPadding={true}\n        ariaLabel={ariaLabel}\n        ariaLabelledby={ariaLabelledby}\n        ariaDescribedby={ariaDescribedby}\n        ariaControls={ariaControls}\n        showOutline={showOutline}\n        nativeControl={nativeControlProps => (\n          <input\n            {...nativeControlProps}\n            ref={checkboxRef}\n            type=\"checkbox\"\n            checked={checked}\n            name={name}\n            aria-required={ariaRequired ? 'true' : undefined}\n            tabIndex={tabIndex}\n            onFocus={() => fireNonCancelableEvent(onFocus)}\n            onBlur={() => fireNonCancelableEvent(onBlur)}\n            // empty handler to suppress React controllability warning\n            onChange={() => {}}\n          />\n        )}\n        onClick={() => {\n          checkboxRef.current?.focus();\n          fireNonCancelableEvent(\n            onChange,\n            // for deterministic transitions \"indeterminate\" -> \"checked\" -> \"unchecked\"\n            indeterminate ? { checked: true, indeterminate: false } : { checked: !checked, indeterminate: false }\n          );\n        }}\n        styledControl={<CheckboxIcon checked={checked} indeterminate={indeterminate} disabled={disabled} />}\n        __internalRootRef={__internalRootRef}\n      />\n    );\n  }\n);\n\nexport default InternalCheckbox;\n"]}

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

@@ -1,16 +1,16 @@
 
     import './styles.scoped.css';
     export default {
-  "content-display-option-toggle": "awsui_content-display-option-toggle_1f3h0_p05e7_185",
-  "content-display-option-content": "awsui_content-display-option-content_1f3h0_p05e7_189",
-  "content-display-option": "awsui_content-display-option_1f3h0_p05e7_185",
-  "placeholder": "awsui_placeholder_1f3h0_p05e7_212",
-  "sorting": "awsui_sorting_1f3h0_p05e7_212",
-  "content-display-option-label": "awsui_content-display-option-label_1f3h0_p05e7_240",
-  "drag-overlay": "awsui_drag-overlay_1f3h0_p05e7_248",
-  "content-display": "awsui_content-display_1f3h0_p05e7_185",
-  "content-display-title": "awsui_content-display-title_1f3h0_p05e7_275",
-  "content-display-description": "awsui_content-display-description_1f3h0_p05e7_283",
-  "content-display-option-list": "awsui_content-display-option-list_1f3h0_p05e7_291"
+  "content-display-option-toggle": "awsui_content-display-option-toggle_1f3h0_vuun8_185",
+  "content-display-option-content": "awsui_content-display-option-content_1f3h0_vuun8_189",
+  "content-display-option": "awsui_content-display-option_1f3h0_vuun8_185",
+  "placeholder": "awsui_placeholder_1f3h0_vuun8_212",
+  "sorting": "awsui_sorting_1f3h0_vuun8_212",
+  "content-display-option-label": "awsui_content-display-option-label_1f3h0_vuun8_239",
+  "drag-overlay": "awsui_drag-overlay_1f3h0_vuun8_247",
+  "content-display": "awsui_content-display_1f3h0_vuun8_185",
+  "content-display-title": "awsui_content-display-title_1f3h0_vuun8_274",
+  "content-display-description": "awsui_content-display-description_1f3h0_vuun8_282",
+  "content-display-option-list": "awsui_content-display-option-list_1f3h0_vuun8_290"
 };
   

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

@@ -182,11 +182,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_1f3h0_p05e7_185:not(#\9) {
+.awsui_content-display-option-toggle_1f3h0_vuun8_185:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_content-display-option-content_1f3h0_p05e7_189:not(#\9) {
+.awsui_content-display-option-content_1f3h0_vuun8_189:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -230,29 +230,28 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-item-wjpc1f, 0px);
 }
 
-.awsui_content-display-option_1f3h0_p05e7_185:not(#\9) {
+.awsui_content-display-option_1f3h0_vuun8_185:not(#\9) {
   list-style: none;
   position: relative;
   border-top: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
 }
-.awsui_content-display-option_1f3h0_p05e7_185:not(#\9):not(.awsui_placeholder_1f3h0_p05e7_212).awsui_sorting_1f3h0_p05e7_212 {
+.awsui_content-display-option_1f3h0_vuun8_185:not(#\9):not(.awsui_placeholder_1f3h0_vuun8_212).awsui_sorting_1f3h0_vuun8_212 {
   transition: transform var(--motion-duration-transition-quick-x85tae, 90ms) var(--motion-easing-transition-quick-lukbd8, linear);
-  z-index: 1;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_content-display-option_1f3h0_p05e7_185:not(#\9):not(.awsui_placeholder_1f3h0_p05e7_212).awsui_sorting_1f3h0_p05e7_212 {
+  .awsui_content-display-option_1f3h0_vuun8_185:not(#\9):not(.awsui_placeholder_1f3h0_vuun8_212).awsui_sorting_1f3h0_vuun8_212 {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_content-display-option_1f3h0_p05e7_185:not(#\9):not(.awsui_placeholder_1f3h0_p05e7_212).awsui_sorting_1f3h0_p05e7_212, .awsui-mode-entering .awsui_content-display-option_1f3h0_p05e7_185:not(#\9):not(.awsui_placeholder_1f3h0_p05e7_212).awsui_sorting_1f3h0_p05e7_212 {
+.awsui-motion-disabled .awsui_content-display-option_1f3h0_vuun8_185:not(#\9):not(.awsui_placeholder_1f3h0_vuun8_212).awsui_sorting_1f3h0_vuun8_212, .awsui-mode-entering .awsui_content-display-option_1f3h0_vuun8_185:not(#\9):not(.awsui_placeholder_1f3h0_vuun8_212).awsui_sorting_1f3h0_vuun8_212 {
   animation: none;
   transition: none;
 }
-.awsui_content-display-option_1f3h0_p05e7_185.awsui_placeholder_1f3h0_p05e7_212 > .awsui_content-display-option-content_1f3h0_p05e7_189:not(#\9) {
+.awsui_content-display-option_1f3h0_vuun8_185.awsui_placeholder_1f3h0_vuun8_212 > .awsui_content-display-option-content_1f3h0_vuun8_189:not(#\9) {
   position: relative;
 }
-.awsui_content-display-option_1f3h0_p05e7_185.awsui_placeholder_1f3h0_p05e7_212 > .awsui_content-display-option-content_1f3h0_p05e7_189:not(#\9):after {
+.awsui_content-display-option_1f3h0_vuun8_185.awsui_placeholder_1f3h0_vuun8_212 > .awsui_content-display-option-content_1f3h0_vuun8_189:not(#\9):after {
   content: " ";
   position: absolute;
   top: 0;
@@ -263,7 +262,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-item-wjpc1f, 0px);
 }
 
-.awsui_content-display-option-label_1f3h0_p05e7_240:not(#\9) {
+.awsui_content-display-option-label_1f3h0_vuun8_239:not(#\9) {
   flex-grow: 1;
   min-width: 0;
   -ms-word-break: break-all;
@@ -271,18 +270,18 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-right: var(--space-l-4vl6xu, 20px);
 }
 
-.awsui_drag-overlay_1f3h0_p05e7_248:not(#\9) {
+.awsui_drag-overlay_1f3h0_vuun8_247:not(#\9) {
   box-shadow: var(--shadow-container-active-h4jsj2, 0px 4px 8px rgba(0, 28, 36, 0.45));
   border-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_p05e7_248:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_vuun8_247:not(#\9) {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_p05e7_248:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_vuun8_247:not(#\9) {
   outline: 2px dotted transparent;
   outline-offset: calc(0px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_p05e7_248:not(#\9)::before {
+body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_vuun8_247:not(#\9)::before {
   content: " ";
   display: block;
   position: absolute;
@@ -294,11 +293,11 @@ body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_p05e7_248:not(#\9)
   box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
 }
 
-.awsui_content-display_1f3h0_p05e7_185:not(#\9) {
+.awsui_content-display_1f3h0_vuun8_185:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_content-display-title_1f3h0_p05e7_275:not(#\9) {
+.awsui_content-display-title_1f3h0_vuun8_274:not(#\9) {
   font-size: var(--font-body-m-size-sregvd, 14px);
   line-height: var(--font-body-m-line-height-i7xxvv, 22px);
   font-weight: var(--font-display-label-weight-tjy9e4, 400);
@@ -306,7 +305,7 @@ body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_p05e7_248:not(#\9)
   margin: 0;
 }
 
-.awsui_content-display-description_1f3h0_p05e7_283:not(#\9) {
+.awsui_content-display-description_1f3h0_vuun8_282:not(#\9) {
   color: var(--color-text-form-secondary-1c3szk, #687078);
   font-size: var(--font-body-s-size-ukw2p9, 12px);
   line-height: var(--font-body-s-line-height-kdsbrl, 16px);
@@ -314,7 +313,7 @@ body[data-awsui-focus-visible=true] .awsui_drag-overlay_1f3h0_p05e7_248:not(#\9)
   margin-top: var(--space-scaled-xxxs-lo883m, 2px);
 }
 
-.awsui_content-display-option-list_1f3h0_p05e7_291:not(#\9) {
+.awsui_content-display-option-list_1f3h0_vuun8_290:not(#\9) {
   position: relative;
   list-style: none;
   padding: 0;

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

@@ -2,16 +2,16 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "content-display-option-toggle": "awsui_content-display-option-toggle_1f3h0_p05e7_185",
-  "content-display-option-content": "awsui_content-display-option-content_1f3h0_p05e7_189",
-  "content-display-option": "awsui_content-display-option_1f3h0_p05e7_185",
-  "placeholder": "awsui_placeholder_1f3h0_p05e7_212",
-  "sorting": "awsui_sorting_1f3h0_p05e7_212",
-  "content-display-option-label": "awsui_content-display-option-label_1f3h0_p05e7_240",
-  "drag-overlay": "awsui_drag-overlay_1f3h0_p05e7_248",
-  "content-display": "awsui_content-display_1f3h0_p05e7_185",
-  "content-display-title": "awsui_content-display-title_1f3h0_p05e7_275",
-  "content-display-description": "awsui_content-display-description_1f3h0_p05e7_283",
-  "content-display-option-list": "awsui_content-display-option-list_1f3h0_p05e7_291"
+  "content-display-option-toggle": "awsui_content-display-option-toggle_1f3h0_vuun8_185",
+  "content-display-option-content": "awsui_content-display-option-content_1f3h0_vuun8_189",
+  "content-display-option": "awsui_content-display-option_1f3h0_vuun8_185",
+  "placeholder": "awsui_placeholder_1f3h0_vuun8_212",
+  "sorting": "awsui_sorting_1f3h0_vuun8_212",
+  "content-display-option-label": "awsui_content-display-option-label_1f3h0_vuun8_239",
+  "drag-overlay": "awsui_drag-overlay_1f3h0_vuun8_247",
+  "content-display": "awsui_content-display_1f3h0_vuun8_185",
+  "content-display-title": "awsui_content-display-title_1f3h0_vuun8_274",
+  "content-display-description": "awsui_content-display-description_1f3h0_vuun8_282",
+  "content-display-option-list": "awsui_content-display-option-list_1f3h0_vuun8_290"
 };
   

package/lib/internal/template/collection-preferences/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { CollectionPreferencesProps } from './interfaces';
 export { CollectionPreferencesProps };
-export default function CollectionPreferences({ title, confirmLabel, cancelLabel, disabled, onConfirm, onCancel, visibleContentPreference, contentDisplayPreference, pageSizePreference, wrapLinesPreference, stripedRowsPreference, contentDensityPreference, preferences, customPreference, ...rest }: CollectionPreferencesProps): JSX.Element;
+export default function CollectionPreferences({ title, confirmLabel, cancelLabel, disabled, onConfirm, onCancel, visibleContentPreference, contentDisplayPreference, pageSizePreference, wrapLinesPreference, stripedRowsPreference, contentDensityPreference, stickyColumnsPreference, preferences, customPreference, ...rest }: CollectionPreferencesProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["collection-preferences/index.tsx"],"names":[],"mappings":";AAuBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAO1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,WAAW,EACX,gBAAgB,EAChB,GAAG,IAAI,EACR,EAAE,0BAA0B,eA4J5B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["collection-preferences/index.tsx"],"names":[],"mappings":";AAwBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAO1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EAEvB,WAAW,EACX,gBAAgB,EAChB,GAAG,IAAI,EACR,EAAE,0BAA0B,eAoK5B"}

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

@@ -9,7 +9,7 @@ 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, StripedRowsPreference, ContentDensityPreference, CustomPreference, } from './utils';
+import { copyPreferences, mergePreferences, ModalContentLayout, PageSizePreference, WrapLinesPreference, StripedRowsPreference, ContentDensityPreference, StickyColumnsPreference, CustomPreference, } from './utils';
 import VisibleContentPreference from './visible-content';
 import checkControlled from '../internal/hooks/check-controlled';
 import styles from './styles.css.js';
@@ -19,9 +19,9 @@ import ContentDisplayPreference from './content-display';
 import { warnOnce } from '../internal/logging';
 const componentName = 'CollectionPreferences';
 export default function CollectionPreferences(_a) {
-    var { title, confirmLabel, cancelLabel, disabled = false, onConfirm, onCancel, visibleContentPreference, contentDisplayPreference, pageSizePreference, wrapLinesPreference, stripedRowsPreference, contentDensityPreference, preferences, customPreference } = _a, rest = __rest(_a, ["title", "confirmLabel", "cancelLabel", "disabled", "onConfirm", "onCancel", "visibleContentPreference", "contentDisplayPreference", "pageSizePreference", "wrapLinesPreference", "stripedRowsPreference", "contentDensityPreference", "preferences", "customPreference"]);
-    const { __internalRootRef } = useBaseComponent(componentName);
-    checkControlled(componentName, 'preferences', preferences, 'onConfirm', onConfirm);
+    var { title, confirmLabel, cancelLabel, disabled = false, onConfirm, onCancel, visibleContentPreference, contentDisplayPreference, pageSizePreference, wrapLinesPreference, stripedRowsPreference, contentDensityPreference, stickyColumnsPreference, preferences, customPreference } = _a, rest = __rest(_a, ["title", "confirmLabel", "cancelLabel", "disabled", "onConfirm", "onCancel", "visibleContentPreference", "contentDisplayPreference", "pageSizePreference", "wrapLinesPreference", "stripedRowsPreference", "contentDensityPreference", "stickyColumnsPreference", "preferences", "customPreference"]);
+    const { __internalRootRef } = useBaseComponent('CollectionPreferences');
+    checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);
     const baseProps = getBaseProps(rest);
     const [modalVisible, setModalVisible] = useState(false);
     const [temporaryPreferences, setTemporaryPreferences] = useState(copyPreferences(preferences || {}));
@@ -48,6 +48,7 @@ export default function CollectionPreferences(_a) {
         wrapLinesPreference ||
         stripedRowsPreference ||
         contentDensityPreference ||
+        stickyColumnsPreference ||
         customPreference);
     const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);
     const onChange = (changedPreferences) => setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));
@@ -68,6 +69,7 @@ export default function CollectionPreferences(_a) {
                     wrapLinesPreference && (React.createElement(WrapLinesPreference, Object.assign({ value: temporaryPreferences.wrapLines }, wrapLinesPreference, { onChange: wrapLines => onChange({ wrapLines }) }))),
                     stripedRowsPreference && (React.createElement(StripedRowsPreference, Object.assign({ value: temporaryPreferences.stripedRows }, stripedRowsPreference, { onChange: stripedRows => onChange({ stripedRows }) }))),
                     contentDensityPreference && (React.createElement(ContentDensityPreference, Object.assign({ value: temporaryPreferences.contentDensity }, contentDensityPreference, { onChange: contentDensity => onChange({ contentDensity }) }))),
+                    stickyColumnsPreference && (React.createElement(StickyColumnsPreference, Object.assign({ value: temporaryPreferences.stickyColumns }, stickyColumnsPreference, { onChange: stickyColumns => onChange({ stickyColumns }) }))),
                     customPreference && (React.createElement(CustomPreference, { value: temporaryPreferences.custom, customPreference: customPreference, onChange: custom => onChange({ custom }) })))), right: contentDisplayPreference ? (React.createElement(ContentDisplayPreference, Object.assign({}, contentDisplayPreference, { value: temporaryPreferences.contentDisplay, onChange: contentDisplay => onChange({ contentDisplay }) }))) : (visibleContentPreference && (React.createElement(VisibleContentPreference, Object.assign({ value: temporaryPreferences.visibleContent }, visibleContentPreference, { onChange: visibleItems => onChange({ visibleContent: visibleItems }) })))) })))));
 }
 applyDisplayName(CollectionPreferences, componentName);

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["collection-preferences/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport 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  StripedRowsPreference,\n  ContentDensityPreference,\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';\nimport ContentDisplayPreference from './content-display';\nimport { warnOnce } from '../internal/logging';\n\nexport { CollectionPreferencesProps };\n\nconst componentName = 'CollectionPreferences';\n\nexport default function CollectionPreferences({\n  title,\n  confirmLabel,\n  cancelLabel,\n  disabled = false,\n  onConfirm,\n  onCancel,\n  visibleContentPreference,\n  contentDisplayPreference,\n  pageSizePreference,\n  wrapLinesPreference,\n  stripedRowsPreference,\n  contentDensityPreference,\n  preferences,\n  customPreference,\n  ...rest\n}: CollectionPreferencesProps) {\n  const { __internalRootRef } = useBaseComponent(componentName);\n  checkControlled(componentName, '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  const hasContentOnTheLeft = !!(\n    pageSizePreference ||\n    wrapLinesPreference ||\n    stripedRowsPreference ||\n    contentDensityPreference ||\n    customPreference\n  );\n  const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);\n\n  const onChange = (changedPreferences: CollectionPreferencesProps.Preferences) =>\n    setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));\n\n  if (visibleContentPreference && contentDisplayPreference) {\n    warnOnce(\n      componentName,\n      'You provided both `visibleContentPreference` and `contentDisplayPreference` props. `visibleContentPreference` will be ignored and only `contentDisplayPreference` will be rendered.'\n    );\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={hasContentOnTheLeft && hasContentOnTheRight ? 'large' : 'medium'}\n          onDismiss={onCancelListener}\n        >\n          <ModalContentLayout\n            left={\n              hasContentOnTheLeft && (\n                <InternalSpaceBetween size=\"l\">\n                  {pageSizePreference && (\n                    <PageSizePreference\n                      value={temporaryPreferences.pageSize}\n                      {...pageSizePreference}\n                      onChange={pageSize => onChange({ pageSize })}\n                    />\n                  )}\n                  {wrapLinesPreference && (\n                    <WrapLinesPreference\n                      value={temporaryPreferences.wrapLines}\n                      {...wrapLinesPreference}\n                      onChange={wrapLines => onChange({ wrapLines })}\n                    />\n                  )}\n                  {stripedRowsPreference && (\n                    <StripedRowsPreference\n                      value={temporaryPreferences.stripedRows}\n                      {...stripedRowsPreference}\n                      onChange={stripedRows => onChange({ stripedRows })}\n                    />\n                  )}\n                  {contentDensityPreference && (\n                    <ContentDensityPreference\n                      value={temporaryPreferences.contentDensity}\n                      {...contentDensityPreference}\n                      onChange={contentDensity => onChange({ contentDensity })}\n                    />\n                  )}\n                  {customPreference && (\n                    <CustomPreference\n                      value={temporaryPreferences.custom}\n                      customPreference={customPreference}\n                      onChange={custom => onChange({ custom })}\n                    />\n                  )}\n                </InternalSpaceBetween>\n              )\n            }\n            right={\n              contentDisplayPreference ? (\n                <ContentDisplayPreference\n                  {...contentDisplayPreference}\n                  value={temporaryPreferences.contentDisplay}\n                  onChange={contentDisplay => onChange({ contentDisplay })}\n                />\n              ) : (\n                visibleContentPreference && (\n                  <VisibleContentPreference\n                    value={temporaryPreferences.visibleContent}\n                    {...visibleContentPreference}\n                    onChange={visibleItems => onChange({ visibleContent: visibleItems })}\n                  />\n                )\n              )\n            }\n          />\n        </InternalModal>\n      )}\n    </div>\n  );\n}\n\napplyDisplayName(CollectionPreferences, componentName);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["collection-preferences/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport 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  StripedRowsPreference,\n  ContentDensityPreference,\n  StickyColumnsPreference,\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';\nimport ContentDisplayPreference from './content-display';\nimport { warnOnce } from '../internal/logging';\n\nexport { CollectionPreferencesProps };\n\nconst componentName = 'CollectionPreferences';\n\nexport default function CollectionPreferences({\n  title,\n  confirmLabel,\n  cancelLabel,\n  disabled = false,\n  onConfirm,\n  onCancel,\n  visibleContentPreference,\n  contentDisplayPreference,\n  pageSizePreference,\n  wrapLinesPreference,\n  stripedRowsPreference,\n  contentDensityPreference,\n  stickyColumnsPreference,\n\n  preferences,\n  customPreference,\n  ...rest\n}: CollectionPreferencesProps) {\n  const { __internalRootRef } = useBaseComponent('CollectionPreferences');\n  checkControlled('CollectionPreferences', '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  const hasContentOnTheLeft = !!(\n    pageSizePreference ||\n    wrapLinesPreference ||\n    stripedRowsPreference ||\n    contentDensityPreference ||\n    stickyColumnsPreference ||\n    customPreference\n  );\n  const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);\n\n  const onChange = (changedPreferences: CollectionPreferencesProps.Preferences) =>\n    setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));\n\n  if (visibleContentPreference && contentDisplayPreference) {\n    warnOnce(\n      componentName,\n      'You provided both `visibleContentPreference` and `contentDisplayPreference` props. `visibleContentPreference` will be ignored and only `contentDisplayPreference` will be rendered.'\n    );\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={hasContentOnTheLeft && hasContentOnTheRight ? 'large' : 'medium'}\n          onDismiss={onCancelListener}\n        >\n          <ModalContentLayout\n            left={\n              hasContentOnTheLeft && (\n                <InternalSpaceBetween size=\"l\">\n                  {pageSizePreference && (\n                    <PageSizePreference\n                      value={temporaryPreferences.pageSize}\n                      {...pageSizePreference}\n                      onChange={pageSize => onChange({ pageSize })}\n                    />\n                  )}\n                  {wrapLinesPreference && (\n                    <WrapLinesPreference\n                      value={temporaryPreferences.wrapLines}\n                      {...wrapLinesPreference}\n                      onChange={wrapLines => onChange({ wrapLines })}\n                    />\n                  )}\n                  {stripedRowsPreference && (\n                    <StripedRowsPreference\n                      value={temporaryPreferences.stripedRows}\n                      {...stripedRowsPreference}\n                      onChange={stripedRows => onChange({ stripedRows })}\n                    />\n                  )}\n                  {contentDensityPreference && (\n                    <ContentDensityPreference\n                      value={temporaryPreferences.contentDensity}\n                      {...contentDensityPreference}\n                      onChange={contentDensity => onChange({ contentDensity })}\n                    />\n                  )}\n                  {stickyColumnsPreference && (\n                    <StickyColumnsPreference\n                      value={temporaryPreferences.stickyColumns}\n                      {...stickyColumnsPreference}\n                      onChange={stickyColumns => onChange({ stickyColumns })}\n                    />\n                  )}\n                  {customPreference && (\n                    <CustomPreference\n                      value={temporaryPreferences.custom}\n                      customPreference={customPreference}\n                      onChange={custom => onChange({ custom })}\n                    />\n                  )}\n                </InternalSpaceBetween>\n              )\n            }\n            right={\n              contentDisplayPreference ? (\n                <ContentDisplayPreference\n                  {...contentDisplayPreference}\n                  value={temporaryPreferences.contentDisplay}\n                  onChange={contentDisplay => onChange({ contentDisplay })}\n                />\n              ) : (\n                visibleContentPreference && (\n                  <VisibleContentPreference\n                    value={temporaryPreferences.visibleContent}\n                    {...visibleContentPreference}\n                    onChange={visibleItems => onChange({ visibleContent: visibleItems })}\n                  />\n                )\n              )\n            }\n          />\n        </InternalModal>\n      )}\n    </div>\n  );\n}\n\napplyDisplayName(CollectionPreferences, componentName);\n"]}