npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.686 → 3.0.688 - Mend

@cloudscape-design/components-themeable 3.0.686 → 3.0.688

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (134) hide show

package/lib/internal/template/internal/base-component/styles.scoped.css CHANGED Viewed

@@ -289,6 +289,7 @@
   --color-border-tutorial-sux9fj:#aab7b8;
   --color-foreground-control-default-8qoldl:#ffffff;
   --color-foreground-control-disabled-fcoqdk:#ffffff;
+  --color-foreground-control-read-only-egnjey:#687078;
   --color-shadow-default-9hs6xx:rgba(0, 28, 36, 0.5);
   --color-stroke-chart-line-917j1w:#879596;
   --color-text-accent-yy9054:#0073bb;
@@ -887,6 +888,7 @@
     --color-border-tiles-disabled-o1okbc:#414750;
     --color-border-tutorial-sux9fj:#879596;
     --color-foreground-control-disabled-fcoqdk:#687078;
+    --color-foreground-control-read-only-egnjey:#95a5a6;
     --color-shadow-default-9hs6xx:rgba(0, 0, 0, 0.5);
     --color-text-accent-yy9054:#44b9d6;
     --color-text-body-default-ffdwgg:#d5dbdb;
@@ -1189,6 +1191,7 @@
   --color-border-tiles-disabled-o1okbc:#414750;
   --color-border-tutorial-sux9fj:#879596;
   --color-foreground-control-disabled-fcoqdk:#687078;
+  --color-foreground-control-read-only-egnjey:#95a5a6;
   --color-shadow-default-9hs6xx:rgba(0, 0, 0, 0.5);
   --color-text-accent-yy9054:#44b9d6;
   --color-text-body-default-ffdwgg:#d5dbdb;
@@ -1501,6 +1504,7 @@
   --color-border-tabs-underline-vxhq31:#0972d3;
   --color-border-tiles-disabled-o1okbc:#e9ebed;
   --color-border-tutorial-sux9fj:#d1d5db;
+  --color-foreground-control-read-only-egnjey:#5f6b7a;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 0.12);
   --color-stroke-chart-line-917j1w:#7d8998;
   --color-text-accent-yy9054:#0972d3;
@@ -1843,6 +1847,7 @@
     --color-border-tutorial-sux9fj:#414d5c;
     --color-foreground-control-default-8qoldl:#000716;
     --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+    --color-foreground-control-read-only-egnjey:#8d99a8;
     --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
     --color-text-accent-yy9054:#539fe5;
     --color-text-body-default-ffdwgg:#b6bec9;
@@ -2110,6 +2115,7 @@
   --color-border-tutorial-sux9fj:#414d5c;
   --color-foreground-control-default-8qoldl:#000716;
   --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+  --color-foreground-control-read-only-egnjey:#8d99a8;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
   --color-text-accent-yy9054:#539fe5;
   --color-text-body-default-ffdwgg:#b6bec9;
@@ -2303,6 +2309,7 @@
   --color-border-tutorial-sux9fj:#414d5c;
   --color-foreground-control-default-8qoldl:#000716;
   --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+  --color-foreground-control-read-only-egnjey:#8d99a8;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
   --color-text-accent-yy9054:#539fe5;
   --color-text-body-default-ffdwgg:#b6bec9;
@@ -2497,6 +2504,7 @@
   --color-border-tutorial-sux9fj:#414d5c;
   --color-foreground-control-default-8qoldl:#000716;
   --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+  --color-foreground-control-read-only-egnjey:#8d99a8;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
   --color-text-accent-yy9054:#539fe5;
   --color-text-body-default-ffdwgg:#b6bec9;
@@ -2704,6 +2712,7 @@
   --color-border-tutorial-sux9fj:#414d5c;
   --color-foreground-control-default-8qoldl:#000716;
   --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+  --color-foreground-control-read-only-egnjey:#8d99a8;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
   --color-text-accent-yy9054:#539fe5;
   --color-text-body-default-ffdwgg:#b6bec9;
@@ -3103,6 +3112,7 @@
   --color-border-tutorial-sux9fj:#414d5c;
   --color-foreground-control-default-8qoldl:#000716;
   --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+  --color-foreground-control-read-only-egnjey:#8d99a8;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
   --color-text-accent-yy9054:#539fe5;
   --color-text-body-default-ffdwgg:#b6bec9;
@@ -3298,6 +3308,7 @@
   --color-border-tutorial-sux9fj:#414d5c;
   --color-foreground-control-default-8qoldl:#000716;
   --color-foreground-control-disabled-fcoqdk:#0f1b2a;
+  --color-foreground-control-read-only-egnjey:#8d99a8;
   --color-shadow-default-9hs6xx:rgba(0, 7, 22, 1);
   --color-text-accent-yy9054:#539fe5;
   --color-text-body-default-ffdwgg:#b6bec9;

package/lib/internal/template/internal/components/abstract-switch/index.d.ts CHANGED Viewed

@@ -6,6 +6,7 @@ export interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>,
     outlineClassName: string;
     showOutline?: boolean;
     disabled?: boolean;
+    readOnly?: boolean;
     nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;
     styledControl: React.ReactElement;
     label?: React.ReactNode;
@@ -17,5 +18,5 @@ export interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>,
     ariaControls?: string;
     onClick: () => void;
 }
-export default function AbstractSwitch({ controlId, controlClassName, outlineClassName, showOutline, disabled, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, ariaControls, onClick, __internalRootRef, ...rest }: AbstractSwitchProps): JSX.Element;
+export default function AbstractSwitch({ controlId, controlClassName, outlineClassName, showOutline, disabled, readOnly, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, ariaControls, onClick, __internalRootRef, ...rest }: AbstractSwitchProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/lib/internal/template/internal/components/abstract-switch/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,0BAA0B;IACxG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1F,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAMD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,OAAO,EACP,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eAgErB"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,0BAA0B;IACxG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1F,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAMD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,OAAO,EACP,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eAgErB"}

package/lib/internal/template/internal/components/abstract-switch/index.js CHANGED Viewed

@@ -9,7 +9,7 @@ function joinString(values) {
     return values.filter((value) => !!value).join(' ');
 }
 export default function AbstractSwitch(_a) {
-    var { controlId, controlClassName, outlineClassName, showOutline, disabled, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, ariaControls, onClick, __internalRootRef } = _a, rest = __rest(_a, ["controlId", "controlClassName", "outlineClassName", "showOutline", "disabled", "nativeControl", "styledControl", "label", "description", "descriptionBottomPadding", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "ariaControls", "onClick", "__internalRootRef"]);
+    var { controlId, controlClassName, outlineClassName, showOutline, disabled, readOnly, nativeControl, styledControl, label, description, descriptionBottomPadding, ariaLabel, ariaLabelledby, ariaDescribedby, ariaControls, onClick, __internalRootRef } = _a, rest = __rest(_a, ["controlId", "controlClassName", "outlineClassName", "showOutline", "disabled", "readOnly", "nativeControl", "styledControl", "label", "description", "descriptionBottomPadding", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "ariaControls", "onClick", "__internalRootRef"]);
     const uniqueId = useUniqueId();
     const id = controlId || uniqueId;
     const labelId = `${id}-label`;
@@ -29,7 +29,7 @@ export default function AbstractSwitch(_a) {
         ariaDescriptions.push(descriptionId);
     }
     return (React.createElement("span", Object.assign({}, rest, { className: clsx(styles.wrapper, rest.className), ref: __internalRootRef }),
-        React.createElement("span", { className: styles['label-wrapper'], "aria-disabled": disabled ? 'true' : undefined, onClick: disabled ? undefined : onClick },
+        React.createElement("span", { className: styles['label-wrapper'], "aria-disabled": disabled ? 'true' : undefined, onClick: disabled || readOnly ? undefined : onClick },
             React.createElement("span", { className: clsx(styles.control, controlClassName) },
                 styledControl,
                 nativeControl({

package/lib/internal/template/internal/components/abstract-switch/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;~~AAqBxD~~,SAAS,UAAU,CAAC,MAA8B;IAChD,OAAO,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAmB,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACtE,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,~~EAkBjB~~;~~QAlBiB~~,EACrC,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,OAAO,EACP,iBAAiB,OAEG,EADjB,IAAI,~~cAjB8B~~,~~wQAkBtC~~,CADQ;IAEP,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,EAAE,GAAG,SAAS,IAAI,QAAQ,CAAC;IAEjC,MAAM,OAAO,GAAG,GAAG,EAAE,QAAQ,CAAC;IAC9B,MAAM,aAAa,GAAG,GAAG,EAAE,cAAc,CAAC;IAE1C,MAAM,iBAAiB,GAAG,EAAE,CAAC;IAC7B,IAAI,KAAK,IAAI,CAAC,SAAS,EAAE;QACvB,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACjC;IACD,IAAI,cAAc,EAAE;QAClB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KACxC;IAED,MAAM,gBAAgB,GAAG,EAAE,CAAC;IAC5B,IAAI,eAAe,EAAE;QACnB,gBAAgB,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;KACxC;IACD,IAAI,WAAW,EAAE;QACf,gBAAgB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KACtC;IAED,OAAO,CACL,8CAAU,IAAI,IAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,iBAAiB;QACrF,8BACE,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,mBACnB,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC5C,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO;~~YAEvC~~,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,CAAC;gBACpD,aAAa;gBACb,aAAa,CAAC;oBACb,EAAE;oBACF,QAAQ;oBACR,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC;oBACjC,kBAAkB,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS;oBACtF,iBAAiB,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,SAAS;oBACvF,YAAY,EAAE,SAAS;oBACvB,eAAe,EAAE,YAAY;iBAC9B,CAAC;gBACF,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,EAAE,WAAW,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GAAI,CAC7F;YACP,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,KAAK,IAAI,CAAC,WAAW,IAAI,MAAM,CAAC,eAAe,CAAC,CAAC;gBACrF,KAAK,IAAI,CACR,8BAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,IACvF,KAAK,CACD,CACR;gBACA,WAAW,IAAI,CACd,8BACE,EAAE,EAAE,aAAa,EACjB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE;wBAClC,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,QAAQ;wBAC1C,CAAC,MAAM,CAAC,4BAA4B,CAAC,CAAC,EAAE,wBAAwB;qBACjE,CAAC,IAED,WAAW,CACP,CACR,CACI,CACF,CACF,CACR,CAAC;AACJ,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';\nimport styles from './styles.css.js';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\n\nexport interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>, InternalBaseComponentProps {\n controlId?: string;\n controlClassName: string;\n outlineClassName: string;\n showOutline?: boolean;\n disabled?: boolean;\n nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;\n styledControl: React.ReactElement;\n label?: React.ReactNode;\n description?: React.ReactNode;\n descriptionBottomPadding?: boolean;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n ariaControls?: string;\n onClick: () => void;\n}\n\nfunction joinString(values: (string \| undefined)[]) {\n return values.filter((value): value is string => !!value).join(' ');\n}\n\nexport default function AbstractSwitch({\n controlId,\n controlClassName,\n outlineClassName,\n showOutline,\n disabled,\n nativeControl,\n styledControl,\n label,\n description,\n descriptionBottomPadding,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n ariaControls,\n onClick,\n __internalRootRef,\n ...rest\n}: AbstractSwitchProps) {\n const uniqueId = useUniqueId();\n const id = controlId \|\| uniqueId;\n\n const labelId = `${id}-label`;\n const descriptionId = `${id}-description`;\n\n const ariaLabelledByIds = [];\n if (label && !ariaLabel) {\n ariaLabelledByIds.push(labelId);\n }\n if (ariaLabelledby) {\n ariaLabelledByIds.push(ariaLabelledby);\n }\n\n const ariaDescriptions = [];\n if (ariaDescribedby) {\n ariaDescriptions.push(ariaDescribedby);\n }\n if (description) {\n ariaDescriptions.push(descriptionId);\n }\n\n return (\n <span {...rest} className={clsx(styles.wrapper, rest.className)} ref={__internalRootRef}>\n <span\n className={styles['label-wrapper']}\n aria-disabled={disabled ? 'true' : undefined}\n onClick={disabled ? undefined : onClick}\n >\n <span className={clsx(styles.control, controlClassName)}>\n {styledControl}\n {nativeControl({\n id,\n disabled,\n className: styles['native-input'],\n 'aria-describedby': ariaDescriptions.length ? joinString(ariaDescriptions) : undefined,\n 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined,\n 'aria-label': ariaLabel,\n 'aria-controls': ariaControls,\n })}\n <span className={clsx(styles.outline, outlineClassName, showOutline && styles['show-outline'])} />\n </span>\n <span className={clsx(styles.content, !label && !description && styles['empty-content'])}>\n {label && (\n <span id={labelId} className={clsx(styles.label, { [styles['label-disabled']]: disabled })}>\n {label}\n </span>\n )}\n {description && (\n <span\n id={descriptionId}\n className={clsx(styles.description, {\n [styles['description-disabled']]: disabled,\n [styles['description-bottom-padding']]: descriptionBottomPadding,\n })}\n >\n {description}\n </span>\n )}\n </span>\n </span>\n </span>\n );\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/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 from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\n\nexport interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>, InternalBaseComponentProps {\n controlId?: string;\n controlClassName: string;\n outlineClassName: string;\n showOutline?: boolean;\n disabled?: boolean;\n readOnly?: boolean;\n nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;\n styledControl: React.ReactElement;\n label?: React.ReactNode;\n description?: React.ReactNode;\n descriptionBottomPadding?: boolean;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n ariaControls?: string;\n onClick: () => void;\n}\n\nfunction joinString(values: (string \| undefined)[]) {\n return values.filter((value): value is string => !!value).join(' ');\n}\n\nexport default function AbstractSwitch({\n controlId,\n controlClassName,\n outlineClassName,\n showOutline,\n disabled,\n readOnly,\n nativeControl,\n styledControl,\n label,\n description,\n descriptionBottomPadding,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n ariaControls,\n onClick,\n __internalRootRef,\n ...rest\n}: AbstractSwitchProps) {\n const uniqueId = useUniqueId();\n const id = controlId \|\| uniqueId;\n\n const labelId = `${id}-label`;\n const descriptionId = `${id}-description`;\n\n const ariaLabelledByIds = [];\n if (label && !ariaLabel) {\n ariaLabelledByIds.push(labelId);\n }\n if (ariaLabelledby) {\n ariaLabelledByIds.push(ariaLabelledby);\n }\n\n const ariaDescriptions = [];\n if (ariaDescribedby) {\n ariaDescriptions.push(ariaDescribedby);\n }\n if (description) {\n ariaDescriptions.push(descriptionId);\n }\n\n return (\n <span {...rest} className={clsx(styles.wrapper, rest.className)} ref={__internalRootRef}>\n <span\n className={styles['label-wrapper']}\n aria-disabled={disabled ? 'true' : undefined}\n onClick={disabled \|\| readOnly ? undefined : onClick}\n >\n <span className={clsx(styles.control, controlClassName)}>\n {styledControl}\n {nativeControl({\n id,\n disabled,\n className: styles['native-input'],\n 'aria-describedby': ariaDescriptions.length ? joinString(ariaDescriptions) : undefined,\n 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined,\n 'aria-label': ariaLabel,\n 'aria-controls': ariaControls,\n })}\n <span className={clsx(styles.outline, outlineClassName, showOutline && styles['show-outline'])} />\n </span>\n <span className={clsx(styles.content, !label && !description && styles['empty-content'])}>\n {label && (\n <span id={labelId} className={clsx(styles.label, { [styles['label-disabled']]: disabled })}>\n {label}\n </span>\n )}\n {description && (\n <span\n id={descriptionId}\n className={clsx(styles.description, {\n [styles['description-disabled']]: disabled,\n [styles['description-bottom-padding']]: descriptionBottomPadding,\n })}\n >\n {description}\n </span>\n )}\n </span>\n </span>\n </span>\n );\n}\n"]}

package/lib/internal/template/internal/components/button-trigger/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/button-trigger/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAGxE,OAAO,EAA0C,sBAAsB,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7G,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAClD,OAAO,CAAC,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAChD,WAAW,CAAC,EAAE,sBAAsB,CAAC;IACrC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,MAAM,CAAC,EAAE,sBAAsB,CAAC;QAAE,aAAa,EAAE,IAAI,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IAChE,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;~~AA6ED~~,yBAAiB,kBAAkB,CAAC;IAClC,UAAiB,GAAG;QAClB,KAAK,IAAI,IAAI,CAAC;KACf;CACF;;AAED,wBAA+C"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/button-trigger/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAGxE,OAAO,EAA0C,sBAAsB,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7G,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAClD,OAAO,CAAC,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAChD,WAAW,CAAC,EAAE,sBAAsB,CAAC;IACrC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,MAAM,CAAC,EAAE,sBAAsB,CAAC;QAAE,aAAa,EAAE,IAAI,GAAG,IAAI,CAAA;KAAE,CAAC,CAAC;IAChE,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAoFD,yBAAiB,kBAAkB,CAAC;IAClC,UAAiB,GAAG;QAClB,KAAK,IAAI,IAAI,CAAC;KACf;CACF;;AAED,wBAA+C"}

package/lib/internal/template/internal/components/button-trigger/index.js CHANGED Viewed

@@ -10,14 +10,17 @@ import { fireKeyboardEvent, fireCancelableEvent } from '../../events';
 const ButtonTrigger = (_a, ref) => {
     var { children, pressed = false, hideCaret = false, disabled = false, readOnly = false, invalid = false, warning = false, inlineTokens, inFilteringToken, ariaHasPopup, ariaLabel, ariaLabelledby, ariaDescribedby, ariaControls, onKeyDown, onKeyUp, onMouseDown, onClick, onFocus, onBlur, autoFocus } = _a, restProps = __rest(_a, ["children", "pressed", "hideCaret", "disabled", "readOnly", "invalid", "warning", "inlineTokens", "inFilteringToken", "ariaHasPopup", "ariaLabel", "ariaLabelledby", "ariaDescribedby", "ariaControls", "onKeyDown", "onKeyUp", "onMouseDown", "onClick", "onFocus", "onBlur", "autoFocus"]);
     const baseProps = getBaseProps(restProps);
-    const attributes = Object.assign(Object.assign({}, baseProps), { type: 'button', className: clsx(styles['button-trigger'], baseProps.className, pressed && styles.pressed, disabled && styles.disabled, invalid && styles.invalid, warning && !invalid && styles.warning, !hideCaret && styles['has-caret'], readOnly && styles['read-only'], inFilteringToken && styles['in-filtering-token'], inlineTokens && styles['inline-tokens']), disabled: disabled || readOnly, 'aria-expanded': pressed, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'aria-describedby': ariaDescribedby, 'aria-haspopup': ariaHasPopup !== null && ariaHasPopup !== void 0 ? ariaHasPopup : 'listbox', 'aria-controls': ariaControls, onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)), onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)), onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)), onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)), onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)), onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)), autoFocus });
+    let attributes = Object.assign(Object.assign({}, baseProps), { type: 'button', className: clsx(styles['button-trigger'], baseProps.className, pressed && styles.pressed, disabled && styles.disabled, invalid && styles.invalid, warning && !invalid && styles.warning, !hideCaret && styles['has-caret'], readOnly && styles.readonly, inFilteringToken && styles['in-filtering-token'], inlineTokens && styles['inline-tokens']), disabled: disabled, 'aria-expanded': pressed, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'aria-describedby': ariaDescribedby, 'aria-haspopup': ariaHasPopup !== null && ariaHasPopup !== void 0 ? ariaHasPopup : 'listbox', 'aria-controls': ariaControls, 'aria-disabled': readOnly && !disabled ? 'true' : undefined, autoFocus });
+    if (!readOnly) {
+        attributes = Object.assign(Object.assign({}, attributes), { onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)), onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)), onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)), onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)), onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)), onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)) });
+    }
     if (invalid) {
         attributes['aria-invalid'] = invalid;
     }
     return (React.createElement("button", Object.assign({ ref: ref }, attributes),
         children,
         !hideCaret && (React.createElement("span", { className: styles.arrow },
-            React.createElement(InternalIcon, { name: "caret-down-filled", variant: disabled ? 'disabled' : 'normal' })))));
+            React.createElement(InternalIcon, { name: "caret-down-filled", variant: disabled || readOnly ? 'disabled' : 'normal' })))));
 };
 export default React.forwardRef(ButtonTrigger);
 //# sourceMappingURL=index.js.map

package/lib/internal/template/internal/components/button-trigger/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/button-trigger/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAClD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAyC,MAAM,cAAc,CAAC;AA0B7G,MAAM,aAAa,GAAG,CACpB,EAuBqB,EACrB,GAAiC,EACjC,EAAE;QAzBF,EACE,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,SAAS,GAAG,KAAK,EACjB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,OAAO,GAAG,KAAK,EACf,YAAY,EACZ,gBAAgB,EAChB,YAAY,EACZ,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,SAAS,EACT,OAAO,EACP,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,EACN,SAAS,OAEU,EADhB,SAAS,cAtBd,4RAuBC,CADa;IAId,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,~~MAAM~~,UAAU,~~mCACX~~,SAAS,KACZ,IAAI,EAAE,QAAQ,EACd,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,gBAAgB,CAAC,EACxB,SAAS,CAAC,SAAS,EACnB,OAAO,IAAI,MAAM,CAAC,OAAO,EACzB,QAAQ,IAAI,MAAM,CAAC,QAAQ,EAC3B,OAAO,IAAI,MAAM,CAAC,OAAO,EACzB,OAAO,IAAI,CAAC,OAAO,IAAI,MAAM,CAAC,OAAO,EACrC,CAAC,SAAS,IAAI,MAAM,CAAC,WAAW,CAAC,EACjC,QAAQ,IAAI,MAAM,CAAC,~~WAAW~~,~~CAAC~~,~~EAC/B,~~gBAAgB,IAAI,MAAM,CAAC,oBAAoB,CAAC,EAChD,YAAY,IAAI,MAAM,CAAC,eAAe,CAAC,CACxC,EACD,QAAQ,EAAE,QAAQ,~~IAAI~~,~~QAAQ,EAC9B,~~eAAe,EAAE,OAAO,EACxB,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,SAAS,EAC1C,eAAe,EAAE,YAAY,EAC7B,SAAS,EAAE,SAAS,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,EACtE,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,EAChE,WAAW,EAAE,WAAW,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,WAAW,EAAE,EAAE,EAAE,KAAK,CAAC,CAAC,EAClF,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,EAAE,EAAE,KAAK,CAAC,CAAC,EACtE,OAAO,EAAE,OAAO,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,EAAE,EAAE,KAAK,CAAC,CAAC,EACtE,MAAM,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,EAAE,aAAa,EAAE,KAAK,CAAC,aAAa,EAAE,EAAE,KAAK,CAAC,CAAC,~~EACvG~~,~~SAAS,GACV,~~CAAC;~~IAEF~~,IAAI,OAAO,EAAE;QACX,UAAU,CAAC,cAAc,CAAC,GAAG,OAAO,CAAC;KACtC;IAED,OAAO,CACL,8CAAQ,GAAG,EAAE,GAAG,IAAM,UAAU;QAC7B,QAAQ;QACR,CAAC,SAAS,IAAI,CACb,8BAAM,SAAS,EAAE,MAAM,CAAC,KAAK;YAC3B,oBAAC,YAAY,IAAC,IAAI,EAAC,mBAAmB,EAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,GAAI,~~CAC/E~~,CACR,CACM,CACV,CAAC;AACJ,CAAC,CAAC;AAQF,eAAe,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { ButtonHTMLAttributes } from 'react';\nimport clsx from 'clsx';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport InternalIcon from '../../../icon/internal';\nimport styles from './styles.css.js';\nimport { fireKeyboardEvent, fireCancelableEvent, CancelableEventHandler, BaseKeyDetail } from '../../events';\n\nexport interface ButtonTriggerProps extends BaseComponentProps {\n children?: React.ReactNode;\n pressed?: boolean;\n hideCaret?: boolean;\n disabled?: boolean;\n readOnly?: boolean;\n invalid?: boolean;\n warning?: boolean;\n inFilteringToken?: boolean;\n inlineTokens?: boolean;\n ariaHasPopup?: 'true' \| 'listbox' \| 'dialog';\n ariaControls?: string;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n onKeyDown?: CancelableEventHandler<BaseKeyDetail>;\n onKeyUp?: CancelableEventHandler<BaseKeyDetail>;\n onMouseDown?: CancelableEventHandler;\n onClick?: CancelableEventHandler;\n onFocus?: CancelableEventHandler;\n onBlur?: CancelableEventHandler<{ relatedTarget: Node \| null }>;\n autoFocus?: boolean;\n}\n\nconst ButtonTrigger = (\n {\n children,\n pressed = false,\n hideCaret = false,\n disabled = false,\n readOnly = false,\n invalid = false,\n warning = false,\n inlineTokens,\n inFilteringToken,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n ariaControls,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onClick,\n onFocus,\n onBlur,\n autoFocus,\n ...restProps\n }: ButtonTriggerProps,\n ref: React.Ref<HTMLButtonElement>\n) => {\n const baseProps = getBaseProps(restProps);\n ~~const~~ attributes: ButtonHTMLAttributes<HTMLButtonElement> = {\n ...baseProps,\n type: 'button',\n className: clsx(\n styles['button-trigger'],\n baseProps.className,\n pressed && styles.pressed,\n disabled && styles.disabled,\n invalid && styles.invalid,\n warning && !invalid && styles.warning,\n !hideCaret && styles['has-caret'],\n readOnly && styles~~['read-only']~~,\n inFilteringToken && styles['in-filtering-token'],\n inlineTokens && styles['inline-tokens']\n ),\n disabled: disabled ~~\|\| readOnly~~,\n 'aria-expanded': pressed,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-haspopup': ariaHasPopup ?? 'listbox',\n 'aria-controls': ariaControls,\n onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)),\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)),\n onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)),\n onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)),\n onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)),\n ~~autoFocus,\~~n };\n\n if (invalid) {\n attributes['aria-invalid'] = invalid;\n }\n\n return (\n <button ref={ref} {...attributes}>\n {children}\n {!hideCaret && (\n <span className={styles.arrow}>\n <InternalIcon name=\"caret-down-filled\" variant={disabled ? 'disabled' : 'normal'} />\n </span>\n )}\n </button>\n );\n};\n\nexport namespace ButtonTriggerProps {\n export interface Ref {\n focus(): void;\n }\n}\n\nexport default React.forwardRef(ButtonTrigger);\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/button-trigger/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, { ButtonHTMLAttributes } from 'react';\nimport clsx from 'clsx';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport InternalIcon from '../../../icon/internal';\nimport styles from './styles.css.js';\nimport { fireKeyboardEvent, fireCancelableEvent, CancelableEventHandler, BaseKeyDetail } from '../../events';\n\nexport interface ButtonTriggerProps extends BaseComponentProps {\n children?: React.ReactNode;\n pressed?: boolean;\n hideCaret?: boolean;\n disabled?: boolean;\n readOnly?: boolean;\n invalid?: boolean;\n warning?: boolean;\n inFilteringToken?: boolean;\n inlineTokens?: boolean;\n ariaHasPopup?: 'true' \| 'listbox' \| 'dialog';\n ariaControls?: string;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n onKeyDown?: CancelableEventHandler<BaseKeyDetail>;\n onKeyUp?: CancelableEventHandler<BaseKeyDetail>;\n onMouseDown?: CancelableEventHandler;\n onClick?: CancelableEventHandler;\n onFocus?: CancelableEventHandler;\n onBlur?: CancelableEventHandler<{ relatedTarget: Node \| null }>;\n autoFocus?: boolean;\n}\n\nconst ButtonTrigger = (\n {\n children,\n pressed = false,\n hideCaret = false,\n disabled = false,\n readOnly = false,\n invalid = false,\n warning = false,\n inlineTokens,\n inFilteringToken,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n ariaControls,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onClick,\n onFocus,\n onBlur,\n autoFocus,\n ...restProps\n }: ButtonTriggerProps,\n ref: React.Ref<HTMLButtonElement>\n) => {\n const baseProps = getBaseProps(restProps);\n let attributes: ButtonHTMLAttributes<HTMLButtonElement> = {\n ...baseProps,\n type: 'button',\n className: clsx(\n styles['button-trigger'],\n baseProps.className,\n pressed && styles.pressed,\n disabled && styles.disabled,\n invalid && styles.invalid,\n warning && !invalid && styles.warning,\n !hideCaret && styles['has-caret'],\n readOnly && styles.readonly,\n inFilteringToken && styles['in-filtering-token'],\n inlineTokens && styles['inline-tokens']\n ),\n disabled: disabled,\n 'aria-expanded': pressed,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-haspopup': ariaHasPopup ?? 'listbox',\n 'aria-controls': ariaControls,\n 'aria-disabled': readOnly && !disabled ? 'true' : undefined,\n autoFocus,\n };\n\n if (!readOnly) {\n attributes = {\n ...attributes,\n onKeyDown: onKeyDown && (event => fireKeyboardEvent(onKeyDown, event)),\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n onMouseDown: onMouseDown && (event => fireCancelableEvent(onMouseDown, {}, event)),\n onClick: onClick && (event => fireCancelableEvent(onClick, {}, event)),\n onFocus: onFocus && (event => fireCancelableEvent(onFocus, {}, event)),\n onBlur: onBlur && (event => fireCancelableEvent(onBlur, { relatedTarget: event.relatedTarget }, event)),\n };\n }\n\n if (invalid) {\n attributes['aria-invalid'] = invalid;\n }\n\n return (\n <button ref={ref} {...attributes}>\n {children}\n {!hideCaret && (\n <span className={styles.arrow}>\n <InternalIcon name=\"caret-down-filled\" variant={disabled \|\| readOnly ? 'disabled' : 'normal'} />\n </span>\n )}\n </button>\n );\n};\n\nexport namespace ButtonTriggerProps {\n export interface Ref {\n focus(): void;\n }\n}\n\nexport default React.forwardRef(ButtonTrigger);\n"]}

package/lib/internal/template/internal/components/button-trigger/styles.css.js CHANGED Viewed

@@ -1,16 +1,16 @@
     import './styles.scoped.css';
     export default {
-  "button-trigger": "awsui_button-trigger_18eso_2pvdv_101",
-  "arrow": "awsui_arrow_18eso_2pvdv_101",
-  "has-caret": "awsui_has-caret_18eso_2pvdv_168",
-  "placeholder": "awsui_placeholder_18eso_2pvdv_171",
-  "pressed": "awsui_pressed_18eso_2pvdv_184",
-  "disabled": "awsui_disabled_18eso_2pvdv_187",
-  "in-filtering-token": "awsui_in-filtering-token_18eso_2pvdv_197",
-  "read-only": "awsui_read-only_18eso_2pvdv_203",
-  "invalid": "awsui_invalid_18eso_2pvdv_225",
-  "warning": "awsui_warning_18eso_2pvdv_236",
-  "inline-tokens": "awsui_inline-tokens_18eso_2pvdv_274"
+  "button-trigger": "awsui_button-trigger_18eso_svu85_101",
+  "arrow": "awsui_arrow_18eso_svu85_101",
+  "has-caret": "awsui_has-caret_18eso_svu85_168",
+  "placeholder": "awsui_placeholder_18eso_svu85_171",
+  "pressed": "awsui_pressed_18eso_svu85_184",
+  "disabled": "awsui_disabled_18eso_svu85_187",
+  "in-filtering-token": "awsui_in-filtering-token_18eso_svu85_197",
+  "readonly": "awsui_readonly_18eso_svu85_203",
+  "invalid": "awsui_invalid_18eso_svu85_225",
+  "warning": "awsui_warning_18eso_svu85_236",
+  "inline-tokens": "awsui_inline-tokens_18eso_svu85_274"
 };

package/lib/internal/template/internal/components/button-trigger/styles.scoped.css CHANGED Viewed

@@ -98,16 +98,16 @@ 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_button-trigger_18eso_2pvdv_101 > .awsui_arrow_18eso_2pvdv_101:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101 > .awsui_arrow_18eso_svu85_101:not(#\9) {
   transition: transform var(--motion-duration-rotate-180-6z1h8e, 135ms) var(--motion-easing-rotate-180-l3wboa, cubic-bezier(0.165, 0.84, 0.44, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_button-trigger_18eso_2pvdv_101 > .awsui_arrow_18eso_2pvdv_101:not(#\9) {
+  .awsui_button-trigger_18eso_svu85_101 > .awsui_arrow_18eso_svu85_101:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_button-trigger_18eso_2pvdv_101 > .awsui_arrow_18eso_2pvdv_101:not(#\9), .awsui-mode-entering .awsui_button-trigger_18eso_2pvdv_101 > .awsui_arrow_18eso_2pvdv_101:not(#\9) {
+.awsui-motion-disabled .awsui_button-trigger_18eso_svu85_101 > .awsui_arrow_18eso_svu85_101:not(#\9), .awsui-mode-entering .awsui_button-trigger_18eso_svu85_101 > .awsui_arrow_18eso_svu85_101:not(#\9) {
   animation: none;
   transition: none;
 }
@@ -116,7 +116,7 @@ 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_button-trigger_18eso_2pvdv_101:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -166,51 +166,51 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-inline: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-default-aksbt5, #687078);
   min-block-size: var(--size-vertical-input-ubbp77, 32px);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_has-caret_18eso_2pvdv_168:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_has-caret_18eso_svu85_168:not(#\9) {
   padding-inline-end: var(--space-field-icon-offset-llp3ak, 32px);
 }
-.awsui_button-trigger_18eso_2pvdv_101 > .awsui_placeholder_18eso_2pvdv_171:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101 > .awsui_placeholder_18eso_svu85_171:not(#\9) {
   color: var(--color-text-input-placeholder-epedqe, #687078);
   font-style: italic;
 }
-.awsui_button-trigger_18eso_2pvdv_101 > .awsui_arrow_18eso_2pvdv_101:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101 > .awsui_arrow_18eso_svu85_101:not(#\9) {
   position: absolute;
   inset-inline-end: var(--space-field-horizontal-cy5q05, 8px);
   inset-block-start: calc(50% - var(--line-height-body-m-2zx78l, 22px) / 2);
   color: var(--color-text-button-inline-icon-default-870ilx, #545b64);
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):hover > .awsui_arrow_18eso_2pvdv_101 {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):hover > .awsui_arrow_18eso_svu85_101 {
   color: var(--color-text-button-inline-icon-hover-gmrtb4, #16191f);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_pressed_18eso_2pvdv_184 > .awsui_arrow_18eso_2pvdv_101:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_pressed_18eso_svu85_184 > .awsui_arrow_18eso_svu85_101:not(#\9) {
   transform: rotate(-180deg);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_disabled_18eso_2pvdv_187:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_disabled_18eso_svu85_187:not(#\9) {
   background-color: var(--color-background-input-disabled-zfoobi, #eaeded);
   border-block: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-disabled-v8bsvq, #eaeded);
   border-inline: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-disabled-v8bsvq, #eaeded);
   color: var(--color-text-input-disabled-c1yp62, #879596);
   cursor: auto;
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_disabled_18eso_2pvdv_187 > .awsui_arrow_18eso_2pvdv_101:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_disabled_18eso_svu85_187 > .awsui_arrow_18eso_svu85_101:not(#\9) {
   color: var(--color-text-button-inline-icon-disabled-m6lq35, #aab7b8);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_disabled_18eso_2pvdv_187.awsui_in-filtering-token_18eso_2pvdv_197:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_disabled_18eso_svu85_187.awsui_in-filtering-token_18eso_svu85_197:not(#\9) {
   border-color: var(--color-border-control-disabled-4hz3mo, #d5dbdb);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_disabled_18eso_2pvdv_187 > .awsui_placeholder_18eso_2pvdv_171:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_disabled_18eso_svu85_187 > .awsui_placeholder_18eso_svu85_171:not(#\9) {
   color: var(--color-text-input-placeholder-disabled-ovndcz, #687078);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_read-only_18eso_2pvdv_203:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_readonly_18eso_svu85_203:not(#\9):not(.awsui_button-trigger_18eso_svu85_101.awsui_disabled_18eso_svu85_187) {
   background-color: var(--color-background-input-default-w7mbz6, #ffffff);
   border-block: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-disabled-v8bsvq, #eaeded);
   border-inline: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-disabled-v8bsvq, #eaeded);
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):focus {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):focus {
   outline: none;
   text-decoration: none;
 }
-body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197):focus {
+body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197):focus {
   outline: 2px dotted transparent;
   border-block: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-focused-v6z9fd, #0073bb);
   border-inline: var(--border-field-width-yoy972, 1px) solid var(--color-border-input-focused-v6z9fd, #0073bb);
@@ -220,10 +220,10 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101:not(#\
   border-end-end-radius: var(--border-radius-input-hy50dp, 2px);
   box-shadow: 0 0 0 var(--border-control-focus-ring-shadow-spread-0k725q, 1px) var(--color-border-item-focused-v8nq2m, #0073bb);
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197):invalid {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197):invalid {
   box-shadow: none;
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_invalid_18eso_2pvdv_225, .awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_invalid_18eso_2pvdv_225:focus {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_invalid_18eso_svu85_225, .awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_invalid_18eso_svu85_225:focus {
   color: var(--color-text-status-error-ofc4yr, #d13212);
   border-color: var(--color-text-status-error-ofc4yr, #d13212);
   padding-inline-start: calc(
@@ -231,10 +231,10 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101:not(#\
 );
   border-inline-start-width: var(--border-invalid-width-hp6noi, 4px);
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_invalid_18eso_2pvdv_225:focus, .awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_invalid_18eso_2pvdv_225:focus:focus {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_invalid_18eso_svu85_225:focus, .awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_invalid_18eso_svu85_225:focus:focus {
   box-shadow: 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-v3635w, 1px) var(--color-border-item-focused-v8nq2m, #0073bb);
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_warning_18eso_2pvdv_236, .awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_warning_18eso_2pvdv_236:focus {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_warning_18eso_svu85_236, .awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_warning_18eso_svu85_236:focus {
   color: var(--color-text-status-warning-azn00c, #906806);
   border-color: var(--color-text-status-warning-azn00c, #906806);
   padding-inline-start: calc(
@@ -242,23 +242,23 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101:not(#\
 );
   border-inline-start-width: var(--border-invalid-width-hp6noi, 4px);
 }
-.awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_warning_18eso_2pvdv_236:focus, .awsui_button-trigger_18eso_2pvdv_101:not(#\9):not(.awsui_in-filtering-token_18eso_2pvdv_197).awsui_warning_18eso_2pvdv_236:focus:focus {
+.awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_warning_18eso_svu85_236:focus, .awsui_button-trigger_18eso_svu85_101:not(#\9):not(.awsui_in-filtering-token_18eso_svu85_197).awsui_warning_18eso_svu85_236:focus:focus {
   box-shadow: 0 0 0 var(--border-control-invalid-focus-ring-shadow-spread-v3635w, 1px) var(--color-border-item-focused-v8nq2m, #0073bb);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_in-filtering-token_18eso_2pvdv_197:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_in-filtering-token_18eso_svu85_197:not(#\9) {
   border-color: var(--color-border-item-selected-20gejb, #0073bb);
   border-start-end-radius: 0;
   border-end-end-radius: 0;
   block-size: 100%;
 }
-body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101.awsui_in-filtering-token_18eso_2pvdv_197:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_svu85_101.awsui_in-filtering-token_18eso_svu85_197:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101.awsui_in-filtering-token_18eso_2pvdv_197:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_svu85_101.awsui_in-filtering-token_18eso_svu85_197:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-filtering-token-operation-select-focus-outline-gutter-lr5vk6, 0px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101.awsui_in-filtering-token_18eso_2pvdv_197:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_svu85_101.awsui_in-filtering-token_18eso_svu85_197:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -272,6 +272,6 @@ body[data-awsui-focus-visible=true] .awsui_button-trigger_18eso_2pvdv_101.awsui_
   border-end-end-radius: var(--border-radius-control-default-focus-ring-a78bgq, 2px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
 }
-.awsui_button-trigger_18eso_2pvdv_101.awsui_inline-tokens_18eso_2pvdv_274:not(#\9) {
+.awsui_button-trigger_18eso_svu85_101.awsui_inline-tokens_18eso_svu85_274:not(#\9) {
   padding-block: 0;
 }

package/lib/internal/template/internal/components/button-trigger/styles.selectors.js CHANGED Viewed

@@ -2,16 +2,16 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "button-trigger": "awsui_button-trigger_18eso_2pvdv_101",
-  "arrow": "awsui_arrow_18eso_2pvdv_101",
-  "has-caret": "awsui_has-caret_18eso_2pvdv_168",
-  "placeholder": "awsui_placeholder_18eso_2pvdv_171",
-  "pressed": "awsui_pressed_18eso_2pvdv_184",
-  "disabled": "awsui_disabled_18eso_2pvdv_187",
-  "in-filtering-token": "awsui_in-filtering-token_18eso_2pvdv_197",
-  "read-only": "awsui_read-only_18eso_2pvdv_203",
-  "invalid": "awsui_invalid_18eso_2pvdv_225",
-  "warning": "awsui_warning_18eso_2pvdv_236",
-  "inline-tokens": "awsui_inline-tokens_18eso_2pvdv_274"
+  "button-trigger": "awsui_button-trigger_18eso_svu85_101",
+  "arrow": "awsui_arrow_18eso_svu85_101",
+  "has-caret": "awsui_has-caret_18eso_svu85_168",
+  "placeholder": "awsui_placeholder_18eso_svu85_171",
+  "pressed": "awsui_pressed_18eso_svu85_184",
+  "disabled": "awsui_disabled_18eso_svu85_187",
+  "in-filtering-token": "awsui_in-filtering-token_18eso_svu85_197",
+  "readonly": "awsui_readonly_18eso_svu85_203",
+  "invalid": "awsui_invalid_18eso_svu85_225",
+  "warning": "awsui_warning_18eso_svu85_236",
+  "inline-tokens": "awsui_inline-tokens_18eso_svu85_274"
 };

package/lib/internal/template/internal/components/checkbox-icon/index.d.ts CHANGED Viewed

@@ -4,6 +4,7 @@ export interface CheckboxIconProps extends BaseComponentProps {
     checked?: boolean;
     indeterminate?: boolean;
     disabled?: boolean;
+    readOnly?: boolean;
 }
 export interface Dimension {
     viewBox: string;
@@ -14,6 +15,6 @@ export interface Dimension {
     size: number;
 }
 export declare const dimensionsByTheme: Record<NonNullable<'default' | 'refresh'>, Dimension>;
-declare const CheckboxIcon: ({ checked, indeterminate, disabled, ...restProps }: CheckboxIconProps) => JSX.Element;
+declare const CheckboxIcon: ({ checked, indeterminate, disabled, readOnly, ...restProps }: CheckboxIconProps) => JSX.Element;
 export default CheckboxIcon;
 //# sourceMappingURL=index.d.ts.map

package/lib/internal/template/internal/components/checkbox-icon/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/checkbox-icon/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAIxE,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AACD,MAAM,WAAW,SAAS;IACxB,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd;AAGD,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,WAAW,CAAC,SAAS,GAAG,SAAS,CAAC,EAAE,SAAS,CAiBnF,CAAC;AAEF,QAAA,MAAM,YAAY,~~uDAAgE~~,iBAAiB,~~gBA2BlG~~,CAAC;AAEF,eAAe,YAAY,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/checkbox-icon/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAIxE,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AACD,MAAM,WAAW,SAAS;IACxB,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;CACd;AAGD,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,WAAW,CAAC,SAAS,GAAG,SAAS,CAAC,EAAE,SAAS,CAiBnF,CAAC;AAEF,QAAA,MAAM,YAAY,iEAMf,iBAAiB,gBA+BnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/internal/template/internal/components/checkbox-icon/index.js CHANGED Viewed

@@ -26,7 +26,7 @@ export const dimensionsByTheme = {
     },
 };
 const CheckboxIcon = (_a) => {
-    var { checked, indeterminate, disabled = false } = _a, restProps = __rest(_a, ["checked", "indeterminate", "disabled"]);
+    var { checked, indeterminate, disabled = false, readOnly = false } = _a, restProps = __rest(_a, ["checked", "indeterminate", "disabled", "readOnly"]);
     const baseProps = getBaseProps(restProps);
     const theme = useVisualRefresh() ? 'refresh' : 'default';
     const dimensions = dimensionsByTheme[theme];
@@ -35,8 +35,12 @@ const CheckboxIcon = (_a) => {
                 [styles['styled-box-checked']]: checked,
                 [styles['styled-box-indeterminate']]: indeterminate,
                 [styles['styled-box-disabled']]: disabled,
+                [styles['styled-box-readonly']]: readOnly,
             }), x: dimensions.xy, y: dimensions.xy, rx: dimensions.r, ry: dimensions.r, width: dimensions.size, height: dimensions.size }),
-        checked || indeterminate ? (React.createElement("polyline", { className: clsx(styles['styled-line'], { [styles['styled-line-disabled']]: disabled }), points: indeterminate ? dimensions.indeterminate : dimensions.checked })) : null));
+        checked || indeterminate ? (React.createElement("polyline", { className: clsx(styles['styled-line'], {
+                [styles['styled-line-disabled']]: disabled,
+                [styles['styled-line-readonly']]: readOnly,
+            }), points: indeterminate ? dimensions.indeterminate : dimensions.checked })) : null));
 };
 export default CheckboxIcon;
 //# sourceMappingURL=index.js.map

package/lib/internal/template/internal/components/checkbox-icon/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/checkbox-icon/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;~~AAgBrC~~,6CAA6C;AAC7C,MAAM,CAAC,MAAM,iBAAiB,GAA0D;IACtF,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,GAAG;QACP,CAAC,EAAE,GAAG;QACN,IAAI,EAAE,EAAE;KACT;IACD,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,CAAC;QACL,CAAC,EAAE,CAAC;QACJ,IAAI,EAAE,EAAE;KACT;CACF,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,~~EAA6E~~,EAAE,EAAE;~~QAAjF~~,~~EAAE~~,OAAO,~~EAAE~~,aAAa,~~EAAE~~,QAAQ,GAAG,KAAK,~~OAAmC~~,~~EAA9B~~,SAAS,~~cAAxD~~,~~wCAA0D~~,~~CAAF~~;~~IAC5E~~,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,KAAK,GAAG,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,MAAM,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC5C,OAAO,CACL,2CAAK,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,OAAO,iBAAc,MAAM,EAAC,SAAS,EAAC,OAAO,IAAK,SAAS;QAC1G,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE;gBACpC,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,OAAO;gBACvC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,aAAa;gBACnD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,QAAQ;aAC1C,CAAC,EACF,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,KAAK,EAAE,UAAU,CAAC,IAAI,EACtB,MAAM,EAAE,UAAU,CAAC,IAAI,GACvB;QACD,OAAO,IAAI,aAAa,CAAC,CAAC,CAAC,CAC1B,kCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,QAAQ,~~EAAE,~~CAAC,~~EACtF~~,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,GACrE,CACH,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\nexport interface CheckboxIconProps extends BaseComponentProps {\n checked?: boolean;\n indeterminate?: boolean;\n disabled?: boolean;\n}\nexport interface Dimension {\n viewBox: string;\n indeterminate: string;\n checked: string;\n xy: number;\n r: number;\n size: number;\n}\n\n// Can't use css variables for svg attributes\nexport const dimensionsByTheme: Record<NonNullable<'default' \| 'refresh'>, Dimension> = {\n default: {\n viewBox: '0 0 14 14',\n indeterminate: '2.5,7 11.5,7',\n checked: '2.5,7 6,10 11,3',\n xy: 0.5,\n r: 1.5,\n size: 13,\n },\n refresh: {\n viewBox: '0 0 16 16',\n indeterminate: '3.5,8 12.5,8',\n checked: '3.5,8 7,11 12,4',\n xy: 1,\n r: 2,\n size: 14,\n },\n};\n\nconst CheckboxIcon = ({ checked, indeterminate, disabled = false, ...restProps }: CheckboxIconProps) => {\n const baseProps = getBaseProps(restProps);\n const theme = useVisualRefresh() ? 'refresh' : 'default';\n const dimensions = dimensionsByTheme[theme];\n return (\n <svg className={styles.root} viewBox={dimensions.viewBox} aria-hidden=\"true\" focusable=\"false\" {...baseProps}>\n <rect\n className={clsx(styles['styled-box'], {\n [styles['styled-box-checked']]: checked,\n [styles['styled-box-indeterminate']]: indeterminate,\n [styles['styled-box-disabled']]: disabled,\n })}\n x={dimensions.xy}\n y={dimensions.xy}\n rx={dimensions.r}\n ry={dimensions.r}\n width={dimensions.size}\n height={dimensions.size}\n />\n {checked \|\| indeterminate ? (\n <polyline\n className={clsx(styles['styled-line'], { [styles['styled-line-disabled']]: disabled })}\n points={indeterminate ? dimensions.indeterminate : dimensions.checked}\n />\n ) : null}\n </svg>\n );\n};\n\nexport default CheckboxIcon;\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/checkbox-icon/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAiBrC,6CAA6C;AAC7C,MAAM,CAAC,MAAM,iBAAiB,GAA0D;IACtF,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,GAAG;QACP,CAAC,EAAE,GAAG;QACN,IAAI,EAAE,EAAE;KACT;IACD,OAAO,EAAE;QACP,OAAO,EAAE,WAAW;QACpB,aAAa,EAAE,cAAc;QAC7B,OAAO,EAAE,iBAAiB;QAC1B,EAAE,EAAE,CAAC;QACL,CAAC,EAAE,CAAC;QACJ,IAAI,EAAE,EAAE;KACT;CACF,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EAMF,EAAE,EAAE;QANF,EACpB,OAAO,EACP,aAAa,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,OAEE,EADf,SAAS,cALQ,oDAMrB,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,KAAK,GAAG,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,MAAM,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC5C,OAAO,CACL,2CAAK,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC,OAAO,iBAAc,MAAM,EAAC,SAAS,EAAC,OAAO,IAAK,SAAS;QAC1G,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE;gBACpC,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,OAAO;gBACvC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAAE,aAAa;gBACnD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,QAAQ;gBACzC,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,QAAQ;aAC1C,CAAC,EACF,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,CAAC,EAAE,UAAU,CAAC,EAAE,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,EAAE,EAAE,UAAU,CAAC,CAAC,EAChB,KAAK,EAAE,UAAU,CAAC,IAAI,EACtB,MAAM,EAAE,UAAU,CAAC,IAAI,GACvB;QACD,OAAO,IAAI,aAAa,CAAC,CAAC,CAAC,CAC1B,kCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE;gBACrC,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,QAAQ;gBAC1C,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,QAAQ;aAC3C,CAAC,EACF,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,GACrE,CACH,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { useVisualRefresh } from '../../hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\nexport interface CheckboxIconProps extends BaseComponentProps {\n checked?: boolean;\n indeterminate?: boolean;\n disabled?: boolean;\n readOnly?: boolean;\n}\nexport interface Dimension {\n viewBox: string;\n indeterminate: string;\n checked: string;\n xy: number;\n r: number;\n size: number;\n}\n\n// Can't use css variables for svg attributes\nexport const dimensionsByTheme: Record<NonNullable<'default' \| 'refresh'>, Dimension> = {\n default: {\n viewBox: '0 0 14 14',\n indeterminate: '2.5,7 11.5,7',\n checked: '2.5,7 6,10 11,3',\n xy: 0.5,\n r: 1.5,\n size: 13,\n },\n refresh: {\n viewBox: '0 0 16 16',\n indeterminate: '3.5,8 12.5,8',\n checked: '3.5,8 7,11 12,4',\n xy: 1,\n r: 2,\n size: 14,\n },\n};\n\nconst CheckboxIcon = ({\n checked,\n indeterminate,\n disabled = false,\n readOnly = false,\n ...restProps\n}: CheckboxIconProps) => {\n const baseProps = getBaseProps(restProps);\n const theme = useVisualRefresh() ? 'refresh' : 'default';\n const dimensions = dimensionsByTheme[theme];\n return (\n <svg className={styles.root} viewBox={dimensions.viewBox} aria-hidden=\"true\" focusable=\"false\" {...baseProps}>\n <rect\n className={clsx(styles['styled-box'], {\n [styles['styled-box-checked']]: checked,\n [styles['styled-box-indeterminate']]: indeterminate,\n [styles['styled-box-disabled']]: disabled,\n [styles['styled-box-readonly']]: readOnly,\n })}\n x={dimensions.xy}\n y={dimensions.xy}\n rx={dimensions.r}\n ry={dimensions.r}\n width={dimensions.size}\n height={dimensions.size}\n />\n {checked \|\| indeterminate ? (\n <polyline\n className={clsx(styles['styled-line'], {\n [styles['styled-line-disabled']]: disabled,\n [styles['styled-line-readonly']]: readOnly,\n })}\n points={indeterminate ? dimensions.indeterminate : dimensions.checked}\n />\n ) : null}\n </svg>\n );\n};\n\nexport default CheckboxIcon;\n"]}

package/lib/internal/template/internal/components/checkbox-icon/styles.css.js CHANGED Viewed

@@ -1,12 +1,14 @@
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_1fn7j_1f4q9_97",
-  "styled-box": "awsui_styled-box_1fn7j_1f4q9_104",
-  "styled-box-checked": "awsui_styled-box-checked_1fn7j_1f4q9_110",
-  "styled-box-indeterminate": "awsui_styled-box-indeterminate_1fn7j_1f4q9_110",
-  "styled-box-disabled": "awsui_styled-box-disabled_1fn7j_1f4q9_114",
-  "styled-line": "awsui_styled-line_1fn7j_1f4q9_128",
-  "styled-line-disabled": "awsui_styled-line-disabled_1fn7j_1f4q9_133"
+  "root": "awsui_root_1fn7j_gwq17_97",
+  "styled-box": "awsui_styled-box_1fn7j_gwq17_104",
+  "styled-box-checked": "awsui_styled-box-checked_1fn7j_gwq17_110",
+  "styled-box-indeterminate": "awsui_styled-box-indeterminate_1fn7j_gwq17_110",
+  "styled-box-disabled": "awsui_styled-box-disabled_1fn7j_gwq17_114",
+  "styled-box-readonly": "awsui_styled-box-readonly_1fn7j_gwq17_114",
+  "styled-line": "awsui_styled-line_1fn7j_gwq17_128",
+  "styled-line-disabled": "awsui_styled-line-disabled_1fn7j_gwq17_133",
+  "styled-line-readonly": "awsui_styled-line-readonly_1fn7j_gwq17_136"
 };

package/lib/internal/template/internal/components/checkbox-icon/styles.scoped.css CHANGED Viewed

@@ -94,42 +94,45 @@ 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_root_1fn7j_1f4q9_97:not(#\9) {
+.awsui_root_1fn7j_gwq17_97:not(#\9) {
   position: absolute;
   inline-size: 100%;
   block-size: 100%;
   inset-block-start: 0;
   inset-inline-start: 0;
 }
-.awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box_1fn7j_1f4q9_104:not(#\9) {
+.awsui_root_1fn7j_gwq17_97 > .awsui_styled-box_1fn7j_gwq17_104:not(#\9) {
   fill: var(--color-background-control-default-n6yadr, #ffffff);
   stroke: var(--color-border-control-default-8uhjl0, #687078);
   stroke-width: var(--border-field-width-yoy972, 1px);
   transition: fill var(--motion-duration-transition-quick-j01tkg, 90ms) var(--motion-easing-transition-quick-9ktw66, linear), stroke var(--motion-duration-transition-quick-j01tkg, 90ms) var(--motion-easing-transition-quick-9ktw66, linear);
 }
-.awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box-checked_1fn7j_1f4q9_110:not(#\9), .awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box-indeterminate_1fn7j_1f4q9_110:not(#\9) {
+.awsui_root_1fn7j_gwq17_97 > .awsui_styled-box-checked_1fn7j_gwq17_110:not(#\9), .awsui_root_1fn7j_gwq17_97 > .awsui_styled-box-indeterminate_1fn7j_gwq17_110:not(#\9) {
   fill: var(--color-background-control-checked-pvanxo, #0073bb);
   stroke: var(--color-border-control-checked-bqdl6s, #0073bb);
 }
-.awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box-disabled_1fn7j_1f4q9_114:not(#\9) {
+.awsui_root_1fn7j_gwq17_97 > .awsui_styled-box-disabled_1fn7j_gwq17_114:not(#\9), .awsui_root_1fn7j_gwq17_97 > .awsui_styled-box-readonly_1fn7j_gwq17_114:not(#\9) {
   fill: var(--color-background-control-disabled-dsn0t2, #d5dbdb);
   stroke: var(--color-border-control-disabled-4hz3mo, #d5dbdb);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box_1fn7j_1f4q9_104:not(#\9) {
+  .awsui_root_1fn7j_gwq17_97 > .awsui_styled-box_1fn7j_gwq17_104:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box_1fn7j_1f4q9_104:not(#\9), .awsui-mode-entering .awsui_root_1fn7j_1f4q9_97 > .awsui_styled-box_1fn7j_1f4q9_104:not(#\9) {
+.awsui-motion-disabled .awsui_root_1fn7j_gwq17_97 > .awsui_styled-box_1fn7j_gwq17_104:not(#\9), .awsui-mode-entering .awsui_root_1fn7j_gwq17_97 > .awsui_styled-box_1fn7j_gwq17_104:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_root_1fn7j_1f4q9_97 > .awsui_styled-line_1fn7j_1f4q9_128:not(#\9) {
+.awsui_root_1fn7j_gwq17_97 > .awsui_styled-line_1fn7j_gwq17_128:not(#\9) {
   stroke: var(--color-foreground-control-default-8qoldl, #ffffff);
   stroke-width: 2;
   fill: none;
 }
-.awsui_root_1fn7j_1f4q9_97 > .awsui_styled-line-disabled_1fn7j_1f4q9_133:not(#\9) {
+.awsui_root_1fn7j_gwq17_97 > .awsui_styled-line-disabled_1fn7j_gwq17_133:not(#\9) {
   stroke: var(--color-foreground-control-disabled-fcoqdk, #ffffff);
+}
+.awsui_root_1fn7j_gwq17_97 > .awsui_styled-line-readonly_1fn7j_gwq17_136:not(#\9) {
+  stroke: var(--color-foreground-control-read-only-egnjey, #687078);
 }