@cloudscape-design/components-themeable 3.0.1381 → 3.0.1383

package/lib/internal/template/internal/components/option/styles.selectors.js

@@ -2,22 +2,22 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "option": "awsui_option_1p2cx_ovly3_13",
-  "disabled": "awsui_disabled_1p2cx_ovly3_50",
-  "parent": "awsui_parent_1p2cx_ovly3_53",
-  "highlighted": "awsui_highlighted_1p2cx_ovly3_56",
-  "content": "awsui_content_1p2cx_ovly3_60",
-  "label-content": "awsui_label-content_1p2cx_ovly3_67",
-  "label": "awsui_label_1p2cx_ovly3_67",
-  "tag": "awsui_tag_1p2cx_ovly3_74",
-  "label-tag": "awsui_label-tag_1p2cx_ovly3_75",
-  "label-prefix": "awsui_label-prefix_1p2cx_ovly3_85",
-  "tags": "awsui_tags_1p2cx_ovly3_98",
-  "description": "awsui_description_1p2cx_ovly3_99",
-  "selected": "awsui_selected_1p2cx_ovly3_110",
-  "icon": "awsui_icon_1p2cx_ovly3_124",
-  "filtering-match-highlight": "awsui_filtering-match-highlight_1p2cx_ovly3_131",
-  "trigger-variant": "awsui_trigger-variant_1p2cx_ovly3_146",
-  "custom-content": "awsui_custom-content_1p2cx_ovly3_152"
+  "option": "awsui_option_1p2cx_12phk_13",
+  "disabled": "awsui_disabled_1p2cx_12phk_50",
+  "parent": "awsui_parent_1p2cx_12phk_53",
+  "highlighted": "awsui_highlighted_1p2cx_12phk_56",
+  "content": "awsui_content_1p2cx_12phk_60",
+  "label-content": "awsui_label-content_1p2cx_12phk_67",
+  "label": "awsui_label_1p2cx_12phk_67",
+  "tag": "awsui_tag_1p2cx_12phk_74",
+  "label-tag": "awsui_label-tag_1p2cx_12phk_75",
+  "label-prefix": "awsui_label-prefix_1p2cx_12phk_85",
+  "tags": "awsui_tags_1p2cx_12phk_98",
+  "description": "awsui_description_1p2cx_12phk_99",
+  "selected": "awsui_selected_1p2cx_12phk_110",
+  "icon": "awsui_icon_1p2cx_12phk_124",
+  "filtering-match-highlight": "awsui_filtering-match-highlight_1p2cx_12phk_131",
+  "trigger-variant": "awsui_trigger-variant_1p2cx_12phk_146",
+  "custom-content": "awsui_custom-content_1p2cx_12phk_152"
 };
   

package/lib/internal/template/internal/components/radio-button/index.d.ts

@@ -3,8 +3,12 @@ import { RadioButtonProps } from '../../../radio-button/interfaces';
 import { InternalBaseComponentProps } from '../../hooks/use-base-component';
 import { SkipWarnings } from '../../utils/with-native-attributes';
 export interface InternalRadioButtonProps extends RadioButtonProps, InternalBaseComponentProps {
+    styleClassNames?: StyleClassNames;
     __skipNativeAttributesWarnings?: SkipWarnings;
 }
+interface StyleClassNames {
+    control?: string;
+}
 declare const _default: React.ForwardRefExoticComponent<InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>;
 export default _default;
 //# sourceMappingURL=index.d.ts.map

package/lib/internal/template/internal/components/radio-button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAOtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAIpE,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAA6B,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAMxF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;IAC5F,8BAA8B,CAAC,EAAE,YAAY,CAAC;CAC/C;;AAED,wBAkGG"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAOhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAIpE,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAA6B,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAMxF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;IAC5F,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,8BAA8B,CAAC,EAAE,YAAY,CAAC;CAC/C;AAGD,UAAU,eAAe;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;;AAED,wBA2GG"}

package/lib/internal/template/internal/components/radio-button/index.js

@@ -1,6 +1,6 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { useRef } from 'react';
+import React, { useRef, useState } from 'react';
 import clsx from 'clsx';
 import { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';
 import { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';
@@ -12,12 +12,18 @@ import WithNativeAttributes from '../../utils/with-native-attributes';
 import { getAbstractSwitchStyles, getInnerCircleStyle, getOuterCircleStyle } from './style';
 import styles from './styles.css.js';
 import testUtilStyles from './test-classes/styles.css.js';
-export default React.forwardRef(function RadioButton({ name, children, value, checked, ariaLabel, ariaLabelledby, ariaDescribedby, description, disabled, controlId, readOnly, className, style, nativeInputAttributes, onSelect, __skipNativeAttributesWarnings, ...rest }, ref) {
+export default React.forwardRef(function RadioButton({ name, children, value, checked, ariaLabel, ariaLabelledby, ariaDescribedby, description, disabled, controlId, readOnly, className, style, styleClassNames, nativeInputAttributes, onSelect, __skipNativeAttributesWarnings, ...rest }, ref) {
     const radioButtonRef = useRef(null);
     const mergedRefs = useMergeRefs(radioButtonRef, ref);
     const { tabIndex } = useSingleTabStopNavigation(radioButtonRef);
     const baseProps = getBaseProps(rest);
-    return (React.createElement(AbstractSwitch, { ...baseProps, className: clsx(testUtilStyles.root, className), controlClassName: styles['radio-control'], outlineClassName: styles.outline, label: children, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, description: description, disabled: disabled, readOnly: readOnly, controlId: controlId, style: getAbstractSwitchStyles(style, checked, disabled, readOnly), __internalRootRef: rest.__internalRootRef, ...copyAnalyticsMetadataAttribute(rest), nativeControl: nativeControlProps => (React.createElement(WithNativeAttributes, { ...nativeControlProps, tag: "input", componentName: "RadioButton", nativeAttributes: nativeInputAttributes, skipWarnings: __skipNativeAttributesWarnings, tabIndex: tabIndex, type: "radio", ref: mergedRefs, name: name, value: value, checked: checked, "aria-disabled": readOnly && !disabled ? 'true' : undefined, 
+    // The select animation only plays once the state has changed since mount.
+    const [initialChecked] = useState(!!checked);
+    const [hasChanged, setHasChanged] = useState(false);
+    if (!hasChanged && !!checked !== initialChecked) {
+        setHasChanged(true);
+    }
+    return (React.createElement(AbstractSwitch, { ...baseProps, className: clsx(testUtilStyles.root, className), controlClassName: clsx(styleClassNames === null || styleClassNames === void 0 ? void 0 : styleClassNames.control, styles['radio-control']), outlineClassName: styles.outline, label: children, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, description: description, disabled: disabled, readOnly: readOnly, controlId: controlId, style: getAbstractSwitchStyles(style, checked, disabled, readOnly), __internalRootRef: rest.__internalRootRef, ...copyAnalyticsMetadataAttribute(rest), nativeControl: nativeControlProps => (React.createElement(WithNativeAttributes, { ...nativeControlProps, tag: "input", componentName: "RadioButton", nativeAttributes: nativeInputAttributes, skipWarnings: __skipNativeAttributesWarnings, tabIndex: tabIndex, type: "radio", ref: mergedRefs, name: name, value: value, checked: checked, "aria-disabled": readOnly && !disabled ? 'true' : undefined, 
             // empty handler to suppress React controllability warning
             onChange: () => { } })), onClick: () => {
             var _a;
@@ -34,6 +40,6 @@ export default React.forwardRef(function RadioButton({ name, children, value, ch
                     [styles['styled-circle-disabled']]: disabled,
                     [styles['styled-circle-checked']]: checked,
                     [styles['styled-circle-readonly']]: readOnly,
-                }), strokeWidth: 30, cx: 50, cy: 50, r: 35, style: getInnerCircleStyle(style, checked, disabled, readOnly) })) }));
+                }), "data-awsui-motion-ready": hasChanged ? '' : undefined, strokeWidth: 30, cx: 50, cy: 50, r: 35, style: getInnerCircleStyle(style, checked, disabled, readOnly) })) }));
 });
 //# sourceMappingURL=index.js.map

package/lib/internal/template/internal/components/radio-button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/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, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { RadioButtonProps } from '../../../radio-button/interfaces';\nimport { getBaseProps } from '../../base-component';\nimport AbstractSwitch from '../../components/abstract-switch';\nimport { fireNonCancelableEvent } from '../../events';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component';\nimport WithNativeAttributes, { SkipWarnings } from '../../utils/with-native-attributes';\nimport { getAbstractSwitchStyles, getInnerCircleStyle, getOuterCircleStyle } from './style';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport interface InternalRadioButtonProps extends RadioButtonProps, InternalBaseComponentProps {\n  __skipNativeAttributesWarnings?: SkipWarnings;\n}\n\nexport default React.forwardRef(function RadioButton(\n  {\n    name,\n    children,\n    value,\n    checked,\n    ariaLabel,\n    ariaLabelledby,\n    ariaDescribedby,\n    description,\n    disabled,\n    controlId,\n    readOnly,\n    className,\n    style,\n    nativeInputAttributes,\n    onSelect,\n    __skipNativeAttributesWarnings,\n    ...rest\n  }: InternalRadioButtonProps,\n  ref: React.Ref<HTMLInputElement>\n) {\n  const radioButtonRef = useRef<HTMLInputElement>(null);\n  const mergedRefs = useMergeRefs(radioButtonRef, ref);\n\n  const { tabIndex } = useSingleTabStopNavigation(radioButtonRef);\n  const baseProps = getBaseProps(rest);\n\n  return (\n    <AbstractSwitch\n      {...baseProps}\n      className={clsx(testUtilStyles.root, className)}\n      controlClassName={styles['radio-control']}\n      outlineClassName={styles.outline}\n      label={children}\n      ariaLabel={ariaLabel}\n      ariaLabelledby={ariaLabelledby}\n      ariaDescribedby={ariaDescribedby}\n      description={description}\n      disabled={disabled}\n      readOnly={readOnly}\n      controlId={controlId}\n      style={getAbstractSwitchStyles(style, checked, disabled, readOnly)}\n      __internalRootRef={rest.__internalRootRef}\n      {...copyAnalyticsMetadataAttribute(rest)}\n      nativeControl={nativeControlProps => (\n        <WithNativeAttributes<HTMLInputElement, React.InputHTMLAttributes<HTMLInputElement>>\n          {...nativeControlProps}\n          tag=\"input\"\n          componentName=\"RadioButton\"\n          nativeAttributes={nativeInputAttributes}\n          skipWarnings={__skipNativeAttributesWarnings}\n          tabIndex={tabIndex}\n          type=\"radio\"\n          ref={mergedRefs}\n          name={name}\n          value={value}\n          checked={checked}\n          aria-disabled={readOnly && !disabled ? 'true' : undefined}\n          // empty handler to suppress React controllability warning\n          onChange={() => {}}\n        />\n      )}\n      onClick={() => {\n        radioButtonRef.current?.focus();\n        if (!checked) {\n          fireNonCancelableEvent(onSelect);\n        }\n      }}\n      styledControl={\n        <svg viewBox=\"0 0 100 100\" focusable=\"false\" aria-hidden=\"true\">\n          <circle\n            className={clsx(styles['styled-circle-border'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={6.25}\n            cx={50}\n            cy={50}\n            r={46}\n            style={getOuterCircleStyle(style, checked, disabled, readOnly)}\n          />\n          <circle\n            className={clsx(styles['styled-circle-fill'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-checked']]: checked,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={30}\n            cx={50}\n            cy={50}\n            r={35}\n            style={getInnerCircleStyle(style, checked, disabled, readOnly)}\n          />\n        </svg>\n      }\n    />\n  );\n});\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,+CAA+C,CAAC;AAC7E,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAC3F,OAAO,EAAE,8BAA8B,EAAE,MAAM,kEAAkE,CAAC;AAGlH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAEtD,OAAO,oBAAsC,MAAM,oCAAoC,CAAC;AACxF,OAAO,EAAE,uBAAuB,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE5F,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAY1D,eAAe,KAAK,CAAC,UAAU,CAAC,SAAS,WAAW,CAClD,EACE,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,OAAO,EACP,SAAS,EACT,cAAc,EACd,eAAe,EACf,WAAW,EACX,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,SAAS,EACT,KAAK,EACL,eAAe,EACf,qBAAqB,EACrB,QAAQ,EACR,8BAA8B,EAC9B,GAAG,IAAI,EACkB,EAC3B,GAAgC;IAEhC,MAAM,cAAc,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,YAAY,CAAC,cAAc,EAAE,GAAG,CAAC,CAAC;IAErD,MAAM,EAAE,QAAQ,EAAE,GAAG,0BAA0B,CAAC,cAAc,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,0EAA0E;IAC1E,MAAM,CAAC,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAC7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC,OAAO,KAAK,cAAc,EAAE,CAAC;QAChD,aAAa,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;IAED,OAAO,CACL,oBAAC,cAAc,OACT,SAAS,EACb,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,SAAS,CAAC,EAC/C,gBAAgB,EAAE,IAAI,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,OAAO,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,EACzE,gBAAgB,EAAE,MAAM,CAAC,OAAO,EAChC,KAAK,EAAE,QAAQ,EACf,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,uBAAuB,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAClE,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,KACrC,8BAA8B,CAAC,IAAI,CAAC,EACxC,aAAa,EAAE,kBAAkB,CAAC,EAAE,CAAC,CACnC,oBAAC,oBAAoB,OACf,kBAAkB,EACtB,GAAG,EAAC,OAAO,EACX,aAAa,EAAC,aAAa,EAC3B,gBAAgB,EAAE,qBAAqB,EACvC,YAAY,EAAE,8BAA8B,EAC5C,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,UAAU,EACf,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,mBACD,QAAQ,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YACzD,0DAA0D;YAC1D,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,GAClB,CACH,EACD,OAAO,EAAE,GAAG,EAAE;;YACZ,MAAA,cAAc,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YAChC,IAAI,CAAC,OAAO,EAAE,CAAC;gBACb,sBAAsB,CAAC,QAAQ,CAAC,CAAC;YACnC,CAAC;QACH,CAAC,EACD,aAAa,EACX,6BAAK,OAAO,EAAC,aAAa,EAAC,SAAS,EAAC,OAAO,iBAAa,MAAM;YAC7D,gCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,sBAAsB,CAAC,EAAE;oBAC9C,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,QAAQ;oBAC5C,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,QAAQ;iBAC7C,CAAC,EACF,WAAW,EAAE,IAAI,EACjB,EAAE,EAAE,EAAE,EACN,EAAE,EAAE,EAAE,EACN,CAAC,EAAE,EAAE,EACL,KAAK,EAAE,mBAAmB,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,GAC9D;YACF,gCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,oBAAoB,CAAC,EAAE;oBAC5C,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,QAAQ;oBAC5C,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,OAAO;oBAC1C,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,QAAQ;iBAC7C,CAAC,6BACuB,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EACpD,WAAW,EAAE,EAAE,EACf,EAAE,EAAE,EAAE,EACN,EAAE,EAAE,EAAE,EACN,CAAC,EAAE,EAAE,EACL,KAAK,EAAE,mBAAmB,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,GAC9D,CACE,GAER,CACH,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { RadioButtonProps } from '../../../radio-button/interfaces';\nimport { getBaseProps } from '../../base-component';\nimport AbstractSwitch from '../../components/abstract-switch';\nimport { fireNonCancelableEvent } from '../../events';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component';\nimport WithNativeAttributes, { SkipWarnings } from '../../utils/with-native-attributes';\nimport { getAbstractSwitchStyles, getInnerCircleStyle, getOuterCircleStyle } from './style';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport interface InternalRadioButtonProps extends RadioButtonProps, InternalBaseComponentProps {\n  styleClassNames?: StyleClassNames;\n  __skipNativeAttributesWarnings?: SkipWarnings;\n}\n\n// Style API v2\ninterface StyleClassNames {\n  control?: string;\n}\n\nexport default React.forwardRef(function RadioButton(\n  {\n    name,\n    children,\n    value,\n    checked,\n    ariaLabel,\n    ariaLabelledby,\n    ariaDescribedby,\n    description,\n    disabled,\n    controlId,\n    readOnly,\n    className,\n    style,\n    styleClassNames,\n    nativeInputAttributes,\n    onSelect,\n    __skipNativeAttributesWarnings,\n    ...rest\n  }: InternalRadioButtonProps,\n  ref: React.Ref<HTMLInputElement>\n) {\n  const radioButtonRef = useRef<HTMLInputElement>(null);\n  const mergedRefs = useMergeRefs(radioButtonRef, ref);\n\n  const { tabIndex } = useSingleTabStopNavigation(radioButtonRef);\n  const baseProps = getBaseProps(rest);\n\n  // The select animation only plays once the state has changed since mount.\n  const [initialChecked] = useState(!!checked);\n  const [hasChanged, setHasChanged] = useState(false);\n  if (!hasChanged && !!checked !== initialChecked) {\n    setHasChanged(true);\n  }\n\n  return (\n    <AbstractSwitch\n      {...baseProps}\n      className={clsx(testUtilStyles.root, className)}\n      controlClassName={clsx(styleClassNames?.control, styles['radio-control'])}\n      outlineClassName={styles.outline}\n      label={children}\n      ariaLabel={ariaLabel}\n      ariaLabelledby={ariaLabelledby}\n      ariaDescribedby={ariaDescribedby}\n      description={description}\n      disabled={disabled}\n      readOnly={readOnly}\n      controlId={controlId}\n      style={getAbstractSwitchStyles(style, checked, disabled, readOnly)}\n      __internalRootRef={rest.__internalRootRef}\n      {...copyAnalyticsMetadataAttribute(rest)}\n      nativeControl={nativeControlProps => (\n        <WithNativeAttributes<HTMLInputElement, React.InputHTMLAttributes<HTMLInputElement>>\n          {...nativeControlProps}\n          tag=\"input\"\n          componentName=\"RadioButton\"\n          nativeAttributes={nativeInputAttributes}\n          skipWarnings={__skipNativeAttributesWarnings}\n          tabIndex={tabIndex}\n          type=\"radio\"\n          ref={mergedRefs}\n          name={name}\n          value={value}\n          checked={checked}\n          aria-disabled={readOnly && !disabled ? 'true' : undefined}\n          // empty handler to suppress React controllability warning\n          onChange={() => {}}\n        />\n      )}\n      onClick={() => {\n        radioButtonRef.current?.focus();\n        if (!checked) {\n          fireNonCancelableEvent(onSelect);\n        }\n      }}\n      styledControl={\n        <svg viewBox=\"0 0 100 100\" focusable=\"false\" aria-hidden=\"true\">\n          <circle\n            className={clsx(styles['styled-circle-border'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={6.25}\n            cx={50}\n            cy={50}\n            r={46}\n            style={getOuterCircleStyle(style, checked, disabled, readOnly)}\n          />\n          <circle\n            className={clsx(styles['styled-circle-fill'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-checked']]: checked,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            data-awsui-motion-ready={hasChanged ? '' : undefined}\n            strokeWidth={30}\n            cx={50}\n            cy={50}\n            r={35}\n            style={getInnerCircleStyle(style, checked, disabled, readOnly)}\n          />\n        </svg>\n      }\n    />\n  );\n});\n"]}

package/lib/internal/template/internal/components/radio-button/styles.css.js

@@ -1,12 +1,12 @@
 
     import './styles.scoped.css';
     export default {
-  "radio-control": "awsui_radio-control_1v1hk_1jz0c_9",
-  "outline": "awsui_outline_1v1hk_1jz0c_17",
-  "styled-circle-border": "awsui_styled-circle-border_1v1hk_1jz0c_40",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_1jz0c_44",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_1jz0c_44",
-  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_1jz0c_49",
-  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_1jz0c_65"
+  "radio-control": "awsui_radio-control_1v1hk_m3ny1_9",
+  "outline": "awsui_outline_1v1hk_m3ny1_25",
+  "styled-circle-border": "awsui_styled-circle-border_1v1hk_m3ny1_47",
+  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_m3ny1_51",
+  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_m3ny1_51",
+  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_m3ny1_56",
+  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_m3ny1_72"
 };
   

package/lib/internal/template/internal/components/radio-button/styles.scoped.css

@@ -6,7 +6,15 @@
 /* stylelint-enable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_radio-control_1v1hk_1jz0c_9:not(#\9) {
+.awsui_radio-control_1v1hk_m3ny1_9:not(#\9) {
+  --awsui-internal-style-color: var(--awsui-style-color);
+  --awsui-internal-style-background-color: var(--awsui-style-background-color);
+  --awsui-internal-style-border-color: var(--awsui-style-border-color);
+  --awsui-internal-style-focus-ring-color: var(--awsui-style-focus-ring-color);
+  --awsui-internal-style-focus-ring-width: var(--awsui-style-focus-ring-width);
+  --awsui-internal-style-focus-ring-radius: var(--awsui-style-focus-ring-radius);
+  --awsui-internal-style-focus-ring-gutter-block: var(--awsui-style-focus-ring-gutter-block);
+  --awsui-internal-style-focus-ring-gutter-inline: var(--awsui-style-focus-ring-gutter-inline);
   margin-block-start: calc((var(--line-height-body-m-5xw6xo, 22px) - var(--size-control-jpgj8e, 14px)) / 2);
   min-block-size: var(--size-control-jpgj8e, 14px);
   min-inline-size: var(--size-control-jpgj8e, 14px);
@@ -14,62 +22,61 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inline-size: var(--size-control-jpgj8e, 14px);
 }
 
-.awsui_outline_1v1hk_1jz0c_17:not(#\9) {
-  --awsui-style-focus-ring-box-shadow-66120l: 0 0 0 var(--awsui-style-focus-ring-border-width-66120l, 2px) var(--awsui-style-focus-ring-border-color-66120l, var(--color-border-item-focused-sewkzn, #0073bb));
+.awsui_outline_1v1hk_m3ny1_25:not(#\9) {
   position: relative;
 }
-.awsui_outline_1v1hk_1jz0c_17:not(#\9) {
+.awsui_outline_1v1hk_m3ny1_25:not(#\9) {
   outline: 2px dotted transparent;
-  outline-offset: calc(2px - 1px);
+  outline-offset: calc(var(--awsui-internal-style-focus-ring-gutter-inline, 2px) - 1px);
 }
-.awsui_outline_1v1hk_1jz0c_17:not(#\9)::before {
+.awsui_outline_1v1hk_m3ny1_25:not(#\9)::before {
   content: " ";
   display: block;
   position: absolute;
-  inset-inline-start: calc(-1 * 2px);
-  inset-block-start: calc(-1 * 2px);
-  inline-size: calc(100% + 2px + 2px);
-  block-size: calc(100% + 2px + 2px);
-  border-start-start-radius: var(--awsui-style-focus-ring-border-radius-66120l, var(--border-radius-control-circular-focus-ring-go6crh, 50%));
-  border-start-end-radius: var(--awsui-style-focus-ring-border-radius-66120l, var(--border-radius-control-circular-focus-ring-go6crh, 50%));
-  border-end-start-radius: var(--awsui-style-focus-ring-border-radius-66120l, var(--border-radius-control-circular-focus-ring-go6crh, 50%));
-  border-end-end-radius: var(--awsui-style-focus-ring-border-radius-66120l, var(--border-radius-control-circular-focus-ring-go6crh, 50%));
-  box-shadow: var(--awsui-style-focus-ring-box-shadow-66120l);
+  inset-inline-start: calc(-1 * var(--awsui-internal-style-focus-ring-gutter-inline, 2px));
+  inset-block-start: calc(-1 * var(--awsui-internal-style-focus-ring-gutter-block, 2px));
+  inline-size: calc(100% + var(--awsui-internal-style-focus-ring-gutter-inline, 2px) + var(--awsui-internal-style-focus-ring-gutter-inline, 2px));
+  block-size: calc(100% + var(--awsui-internal-style-focus-ring-gutter-block, 2px) + var(--awsui-internal-style-focus-ring-gutter-block, 2px));
+  border-start-start-radius: var(--awsui-internal-style-focus-ring-radius, var(--awsui-style-focus-ring-border-radius-ka4djm, var(--border-radius-control-circular-focus-ring-go6crh, 50%)));
+  border-start-end-radius: var(--awsui-internal-style-focus-ring-radius, var(--awsui-style-focus-ring-border-radius-ka4djm, var(--border-radius-control-circular-focus-ring-go6crh, 50%)));
+  border-end-start-radius: var(--awsui-internal-style-focus-ring-radius, var(--awsui-style-focus-ring-border-radius-ka4djm, var(--border-radius-control-circular-focus-ring-go6crh, 50%)));
+  border-end-end-radius: var(--awsui-internal-style-focus-ring-radius, var(--awsui-style-focus-ring-border-radius-ka4djm, var(--border-radius-control-circular-focus-ring-go6crh, 50%)));
+  box-shadow: 0 0 0 var(--awsui-internal-style-focus-ring-width, var(--awsui-style-focus-ring-border-width-ka4djm, 2px)) var(--awsui-internal-style-focus-ring-color, var(--awsui-style-focus-ring-border-color-ka4djm, var(--color-border-item-focused-sewkzn, #0073bb)));
 }
 
-.awsui_styled-circle-border_1v1hk_1jz0c_40:not(#\9) {
-  stroke: var(--color-border-control-default-9qbus4, #687078);
-  fill: var(--color-background-control-default-9p1s17, #ffffff);
+.awsui_styled-circle-border_1v1hk_m3ny1_47:not(#\9) {
+  stroke: var(--awsui-internal-style-border-color, var(--color-border-control-default-9qbus4, #687078));
+  fill: var(--awsui-internal-style-background-color, var(--color-background-control-default-9p1s17, #ffffff));
 }
-.awsui_styled-circle-border_1v1hk_1jz0c_40.awsui_styled-circle-disabled_1v1hk_1jz0c_44:not(#\9), .awsui_styled-circle-border_1v1hk_1jz0c_40.awsui_styled-circle-readonly_1v1hk_1jz0c_44:not(#\9) {
-  fill: var(--color-background-control-disabled-m61b8s, #d5dbdb);
-  stroke: var(--color-background-control-disabled-m61b8s, #d5dbdb);
+.awsui_styled-circle-border_1v1hk_m3ny1_47.awsui_styled-circle-disabled_1v1hk_m3ny1_51:not(#\9), .awsui_styled-circle-border_1v1hk_m3ny1_47.awsui_styled-circle-readonly_1v1hk_m3ny1_51:not(#\9) {
+  fill: var(--awsui-internal-style-background-color, var(--color-background-control-disabled-m61b8s, #d5dbdb));
+  stroke: var(--awsui-internal-style-border-color, var(--color-background-control-disabled-m61b8s, #d5dbdb));
 }
 
-.awsui_styled-circle-fill_1v1hk_1jz0c_49:not(#\9) {
-  stroke: var(--color-background-control-checked-ksqwhc, #0073bb);
-  fill: var(--color-foreground-control-default-poakg0, #ffffff);
+.awsui_styled-circle-fill_1v1hk_m3ny1_56:not(#\9) {
+  stroke: var(--awsui-internal-style-background-color, var(--color-background-control-checked-ksqwhc, #0073bb));
+  fill: var(--awsui-internal-style-color, var(--color-foreground-control-default-poakg0, #ffffff));
   opacity: 0;
   transition: opacity var(--motion-duration-transition-quick-1p8yzt, 90ms) var(--motion-easing-transition-quick-afgcka, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_styled-circle-fill_1v1hk_1jz0c_49:not(#\9) {
+  .awsui_styled-circle-fill_1v1hk_m3ny1_56:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_styled-circle-fill_1v1hk_1jz0c_49:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1v1hk_1jz0c_49:not(#\9) {
+.awsui-motion-disabled .awsui_styled-circle-fill_1v1hk_m3ny1_56:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1v1hk_m3ny1_56:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_styled-circle-fill_1v1hk_1jz0c_49.awsui_styled-circle-checked_1v1hk_1jz0c_65:not(#\9) {
+.awsui_styled-circle-fill_1v1hk_m3ny1_56.awsui_styled-circle-checked_1v1hk_m3ny1_72:not(#\9) {
   opacity: 1;
 }
-.awsui_styled-circle-fill_1v1hk_1jz0c_49.awsui_styled-circle-disabled_1v1hk_1jz0c_44:not(#\9) {
-  fill: var(--color-foreground-control-disabled-bikivj, #ffffff);
-  stroke: var(--color-background-control-disabled-m61b8s, #d5dbdb);
+.awsui_styled-circle-fill_1v1hk_m3ny1_56.awsui_styled-circle-disabled_1v1hk_m3ny1_51:not(#\9) {
+  fill: var(--awsui-internal-style-color, var(--color-foreground-control-disabled-bikivj, #ffffff));
+  stroke: var(--awsui-internal-style-background-color, var(--color-background-control-disabled-m61b8s, #d5dbdb));
 }
-.awsui_styled-circle-fill_1v1hk_1jz0c_49.awsui_styled-circle-readonly_1v1hk_1jz0c_44:not(#\9) {
-  fill: var(--color-foreground-control-read-only-8sqxyy, #687078);
-  stroke: var(--color-background-control-disabled-m61b8s, #d5dbdb);
+.awsui_styled-circle-fill_1v1hk_m3ny1_56.awsui_styled-circle-readonly_1v1hk_m3ny1_51:not(#\9) {
+  fill: var(--awsui-internal-style-color, var(--color-foreground-control-read-only-8sqxyy, #687078));
+  stroke: var(--awsui-internal-style-background-color, var(--color-background-control-disabled-m61b8s, #d5dbdb));
 }

package/lib/internal/template/internal/components/radio-button/styles.selectors.js

@@ -2,12 +2,12 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "radio-control": "awsui_radio-control_1v1hk_1jz0c_9",
-  "outline": "awsui_outline_1v1hk_1jz0c_17",
-  "styled-circle-border": "awsui_styled-circle-border_1v1hk_1jz0c_40",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_1jz0c_44",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_1jz0c_44",
-  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_1jz0c_49",
-  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_1jz0c_65"
+  "radio-control": "awsui_radio-control_1v1hk_m3ny1_9",
+  "outline": "awsui_outline_1v1hk_m3ny1_25",
+  "styled-circle-border": "awsui_styled-circle-border_1v1hk_m3ny1_47",
+  "styled-circle-disabled": "awsui_styled-circle-disabled_1v1hk_m3ny1_51",
+  "styled-circle-readonly": "awsui_styled-circle-readonly_1v1hk_m3ny1_51",
+  "styled-circle-fill": "awsui_styled-circle-fill_1v1hk_m3ny1_56",
+  "styled-circle-checked": "awsui_styled-circle-checked_1v1hk_m3ny1_72"
 };
   

package/lib/internal/template/internal/components/selectable-item/styles.css.js

@@ -1,27 +1,27 @@
 
     import './styles.scoped.css';
     export default {
-  "selectable-item": "awsui_selectable-item_15o6u_1mhnc_9",
-  "parent": "awsui_parent_15o6u_1mhnc_28",
-  "interactiveGroups": "awsui_interactiveGroups_15o6u_1mhnc_28",
-  "highlighted": "awsui_highlighted_15o6u_1mhnc_28",
-  "selected": "awsui_selected_15o6u_1mhnc_28",
-  "selectable-item-content": "awsui_selectable-item-content_15o6u_1mhnc_31",
-  "pad-bottom": "awsui_pad-bottom_15o6u_1mhnc_35",
-  "virtual": "awsui_virtual_15o6u_1mhnc_42",
-  "has-background": "awsui_has-background_15o6u_1mhnc_45",
-  "child": "awsui_child_15o6u_1mhnc_48",
-  "disabled": "awsui_disabled_15o6u_1mhnc_54",
-  "is-keyboard": "awsui_is-keyboard_15o6u_1mhnc_73",
-  "visual-refresh": "awsui_visual-refresh_15o6u_1mhnc_83",
-  "next-item-selected": "awsui_next-item-selected_15o6u_1mhnc_97",
-  "previous-item-selected": "awsui_previous-item-selected_15o6u_1mhnc_107",
-  "sticky": "awsui_sticky_15o6u_1mhnc_139",
-  "with-scrollbar": "awsui_with-scrollbar_15o6u_1mhnc_158",
-  "after-header": "awsui_after-header_15o6u_1mhnc_161",
-  "measure-strut": "awsui_measure-strut_15o6u_1mhnc_190",
-  "screenreader-content": "awsui_screenreader-content_15o6u_1mhnc_202",
-  "option-content": "awsui_option-content_15o6u_1mhnc_208",
-  "select-all": "awsui_select-all_15o6u_1mhnc_212"
+  "selectable-item": "awsui_selectable-item_15o6u_161ir_9",
+  "parent": "awsui_parent_15o6u_161ir_28",
+  "interactiveGroups": "awsui_interactiveGroups_15o6u_161ir_28",
+  "highlighted": "awsui_highlighted_15o6u_161ir_28",
+  "selected": "awsui_selected_15o6u_161ir_28",
+  "selectable-item-content": "awsui_selectable-item-content_15o6u_161ir_31",
+  "pad-bottom": "awsui_pad-bottom_15o6u_161ir_35",
+  "virtual": "awsui_virtual_15o6u_161ir_42",
+  "has-background": "awsui_has-background_15o6u_161ir_45",
+  "child": "awsui_child_15o6u_161ir_48",
+  "disabled": "awsui_disabled_15o6u_161ir_54",
+  "is-keyboard": "awsui_is-keyboard_15o6u_161ir_73",
+  "visual-refresh": "awsui_visual-refresh_15o6u_161ir_83",
+  "next-item-selected": "awsui_next-item-selected_15o6u_161ir_97",
+  "previous-item-selected": "awsui_previous-item-selected_15o6u_161ir_107",
+  "sticky": "awsui_sticky_15o6u_161ir_139",
+  "with-scrollbar": "awsui_with-scrollbar_15o6u_161ir_158",
+  "after-header": "awsui_after-header_15o6u_161ir_161",
+  "measure-strut": "awsui_measure-strut_15o6u_161ir_190",
+  "screenreader-content": "awsui_screenreader-content_15o6u_161ir_202",
+  "option-content": "awsui_option-content_15o6u_161ir_208",
+  "select-all": "awsui_select-all_15o6u_161ir_212"
 };