@cloudscape-design/components 3.0.1130 → 3.0.1132

package/radio-group/internal.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { RadioGroupProps } from './interfaces';
-declare const InternalRadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & InternalBaseComponentProps & React.RefAttributes<RadioGroupProps.Ref>>;
+declare const InternalRadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & InternalBaseComponentProps & React.RefAttributes<import("../internal/components/radio-button/interfaces").RadioButtonProps.Ref>>;
 export default InternalRadioGroup;

package/radio-group/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAQ/C,QAAA,MAAM,kBAAkB,0HAmEvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAQ/C,QAAA,MAAM,kBAAkB,oLA4EvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/radio-group/internal.js

@@ -5,25 +5,31 @@ import clsx from 'clsx';
 import { useUniqueId } from '@cloudscape-design/component-toolkit/internal';
 import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import { getBaseProps } from '../internal/base-component';
+import RadioButton from '../internal/components/radio-button';
 import { useFormFieldContext } from '../internal/context/form-field-context';
+import { fireNonCancelableEvent } from '../internal/events';
 import useRadioGroupForwardFocus from '../internal/hooks/forward-focus/radio-group';
-import RadioButton from './radio-button';
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
+import testUtilStyles from './test-classes/styles.css.js';
 const InternalRadioGroup = React.forwardRef(({ name, value, items, ariaLabel, ariaRequired, ariaControls, onChange, readOnly, __internalRootRef, style, ...props }, ref) => {
     const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(props);
     const baseProps = getBaseProps(props);
     const generatedName = useUniqueId('awsui-radio-');
     const [radioButtonRef, radioButtonRefIndex] = useRadioGroupForwardFocus(ref, items, value);
-    return (React.createElement("div", { role: "radiogroup", "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel, "aria-describedby": ariaDescribedby, "aria-required": ariaRequired, "aria-controls": ariaControls, "aria-readonly": readOnly ? 'true' : undefined, ...baseProps, className: clsx(baseProps.className, styles.root), ref: __internalRootRef }, items &&
-        items.map((item, index) => (React.createElement(RadioButton, { key: item.value, ref: index === radioButtonRefIndex ? radioButtonRef : undefined, className: clsx(item.value === value && analyticsSelectors.selected), checked: item.value === value, name: name || generatedName, value: item.value, label: item.label, description: item.description, disabled: item.disabled, onChange: onChange, controlId: item.controlId, readOnly: readOnly, style: style, ...getAnalyticsMetadataAttribute(!item.disabled && !readOnly
+    return (React.createElement("div", { role: "radiogroup", "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel, "aria-describedby": ariaDescribedby, "aria-required": ariaRequired, "aria-controls": ariaControls, "aria-readonly": readOnly ? 'true' : undefined, ...baseProps, className: clsx(baseProps.className, testUtilStyles.root, styles['radio-group']), ref: __internalRootRef }, items &&
+        items.map((item, index) => (React.createElement(RadioButton, { key: item.value, ref: index === radioButtonRefIndex ? radioButtonRef : undefined, className: clsx(styles.radio, item.description && styles['radio--has-description'], item.value === value && analyticsSelectors.selected), checked: item.value === value, name: name || generatedName, value: item.value, description: item.description, disabled: item.disabled, onChange: ({ detail }) => {
+                if (onChange && detail.checked) {
+                    fireNonCancelableEvent(onChange, { value: item.value });
+                }
+            }, controlId: item.controlId, readOnly: readOnly, style: style, ...getAnalyticsMetadataAttribute(!item.disabled && !readOnly
                 ? {
                     detail: {
                         position: `${index + 1}`,
                         value: item.value,
                     },
                 }
-                : {}) })))));
+                : {}) }, item.label)))));
 });
 export default InternalRadioGroup;
 //# sourceMappingURL=internal.js.map

package/radio-group/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAC5E,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,yBAAyB,MAAM,6CAA6C,CAAC;AAIpF,OAAO,WAAW,MAAM,gBAAgB,CAAC;AAEzC,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CACzC,CACE,EACE,IAAI,EACJ,KAAK,EACL,KAAK,EACL,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,KAAK,EACL,GAAG,KAAK,EACgB,EAC1B,GAAmC,EACnC,EAAE;IACF,MAAM,EAAE,eAAe,EAAE,cAAc,EAAE,GAAG,mBAAmB,CAAC,KAAK,CAAC,CAAC;IACvE,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,MAAM,aAAa,GAAG,WAAW,CAAC,cAAc,CAAC,CAAC;IAElD,MAAM,CAAC,cAAc,EAAE,mBAAmB,CAAC,GAAG,yBAAyB,CAAC,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IAE3F,OAAO,CACL,6BACE,IAAI,EAAC,YAAY,qBACA,cAAc,gBACnB,SAAS,sBACH,eAAe,mBAClB,YAAY,mBACZ,YAAY,mBACZ,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,KACxC,SAAS,EACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EACjD,GAAG,EAAE,iBAAiB,IAErB,KAAK;QACJ,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACzB,oBAAC,WAAW,IACV,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,GAAG,EAAE,KAAK,KAAK,mBAAmB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EAC/D,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,IAAI,kBAAkB,CAAC,QAAQ,CAAC,EACpE,OAAO,EAAE,IAAI,CAAC,KAAK,KAAK,KAAK,EAC7B,IAAI,EAAE,IAAI,IAAI,aAAa,EAC3B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,KACR,6BAA6B,CAC/B,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ;gBACzB,CAAC,CAAC;oBACE,MAAM,EAAE;wBACN,QAAQ,EAAE,GAAG,KAAK,GAAG,CAAC,EAAE;wBACxB,KAAK,EAAE,IAAI,CAAC,KAAK;qBAC+C;iBACnE;gBACH,CAAC,CAAC,EAAE,CACP,GACD,CACH,CAAC,CACA,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport useRadioGroupForwardFocus from '../internal/hooks/forward-focus/radio-group';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { GeneratedAnalyticsMetadataRadioGroupSelect } from './analytics-metadata/interfaces';\nimport { RadioGroupProps } from './interfaces';\nimport RadioButton from './radio-button';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ntype InternalRadioGroupProps = RadioGroupProps & InternalBaseComponentProps;\n\nconst InternalRadioGroup = React.forwardRef(\n  (\n    {\n      name,\n      value,\n      items,\n      ariaLabel,\n      ariaRequired,\n      ariaControls,\n      onChange,\n      readOnly,\n      __internalRootRef,\n      style,\n      ...props\n    }: InternalRadioGroupProps,\n    ref: React.Ref<RadioGroupProps.Ref>\n  ) => {\n    const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(props);\n    const baseProps = getBaseProps(props);\n    const generatedName = useUniqueId('awsui-radio-');\n\n    const [radioButtonRef, radioButtonRefIndex] = useRadioGroupForwardFocus(ref, items, value);\n\n    return (\n      <div\n        role=\"radiogroup\"\n        aria-labelledby={ariaLabelledby}\n        aria-label={ariaLabel}\n        aria-describedby={ariaDescribedby}\n        aria-required={ariaRequired}\n        aria-controls={ariaControls}\n        aria-readonly={readOnly ? 'true' : undefined}\n        {...baseProps}\n        className={clsx(baseProps.className, styles.root)}\n        ref={__internalRootRef}\n      >\n        {items &&\n          items.map((item, index) => (\n            <RadioButton\n              key={item.value}\n              ref={index === radioButtonRefIndex ? radioButtonRef : undefined}\n              className={clsx(item.value === value && analyticsSelectors.selected)}\n              checked={item.value === value}\n              name={name || generatedName}\n              value={item.value}\n              label={item.label}\n              description={item.description}\n              disabled={item.disabled}\n              onChange={onChange}\n              controlId={item.controlId}\n              readOnly={readOnly}\n              style={style}\n              {...getAnalyticsMetadataAttribute(\n                !item.disabled && !readOnly\n                  ? {\n                      detail: {\n                        position: `${index + 1}`,\n                        value: item.value,\n                      } as Partial<GeneratedAnalyticsMetadataRadioGroupSelect['detail']>,\n                    }\n                  : {}\n              )}\n            />\n          ))}\n      </div>\n    );\n  }\n);\n\nexport default InternalRadioGroup;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { getBaseProps } from '../internal/base-component';\nimport RadioButton from '../internal/components/radio-button';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useRadioGroupForwardFocus from '../internal/hooks/forward-focus/radio-group';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { GeneratedAnalyticsMetadataRadioGroupSelect } from './analytics-metadata/interfaces';\nimport { RadioGroupProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ntype InternalRadioGroupProps = RadioGroupProps & InternalBaseComponentProps;\n\nconst InternalRadioGroup = React.forwardRef(\n  (\n    {\n      name,\n      value,\n      items,\n      ariaLabel,\n      ariaRequired,\n      ariaControls,\n      onChange,\n      readOnly,\n      __internalRootRef,\n      style,\n      ...props\n    }: InternalRadioGroupProps,\n    ref: React.Ref<RadioGroupProps.Ref>\n  ) => {\n    const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(props);\n    const baseProps = getBaseProps(props);\n    const generatedName = useUniqueId('awsui-radio-');\n\n    const [radioButtonRef, radioButtonRefIndex] = useRadioGroupForwardFocus(ref, items, value);\n\n    return (\n      <div\n        role=\"radiogroup\"\n        aria-labelledby={ariaLabelledby}\n        aria-label={ariaLabel}\n        aria-describedby={ariaDescribedby}\n        aria-required={ariaRequired}\n        aria-controls={ariaControls}\n        aria-readonly={readOnly ? 'true' : undefined}\n        {...baseProps}\n        className={clsx(baseProps.className, testUtilStyles.root, styles['radio-group'])}\n        ref={__internalRootRef}\n      >\n        {items &&\n          items.map((item, index) => (\n            <RadioButton\n              key={item.value}\n              ref={index === radioButtonRefIndex ? radioButtonRef : undefined}\n              className={clsx(\n                styles.radio,\n                item.description && styles['radio--has-description'],\n                item.value === value && analyticsSelectors.selected\n              )}\n              checked={item.value === value}\n              name={name || generatedName}\n              value={item.value}\n              description={item.description}\n              disabled={item.disabled}\n              onChange={({ detail }) => {\n                if (onChange && detail.checked) {\n                  fireNonCancelableEvent(onChange, { value: item.value });\n                }\n              }}\n              controlId={item.controlId}\n              readOnly={readOnly}\n              style={style}\n              {...getAnalyticsMetadataAttribute(\n                !item.disabled && !readOnly\n                  ? {\n                      detail: {\n                        position: `${index + 1}`,\n                        value: item.value,\n                      } as Partial<GeneratedAnalyticsMetadataRadioGroupSelect['detail']>,\n                    }\n                  : {}\n              )}\n            >\n              {item.label}\n            </RadioButton>\n          ))}\n      </div>\n    );\n  }\n);\n\nexport default InternalRadioGroup;\n"]}

package/radio-group/styles.css.js

@@ -1,15 +1,8 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_1mabk_4nbo6_145",
-  "radio": "awsui_radio_1mabk_4nbo6_178",
-  "radio--has-description": "awsui_radio--has-description_1mabk_4nbo6_186",
-  "radio-control": "awsui_radio-control_1mabk_4nbo6_190",
-  "outline": "awsui_outline_1mabk_4nbo6_198",
-  "styled-circle-border": "awsui_styled-circle-border_1mabk_4nbo6_221",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1mabk_4nbo6_225",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1mabk_4nbo6_225",
-  "styled-circle-fill": "awsui_styled-circle-fill_1mabk_4nbo6_230",
-  "styled-circle-checked": "awsui_styled-circle-checked_1mabk_4nbo6_246"
+  "radio-group": "awsui_radio-group_1mabk_188d6_145",
+  "radio": "awsui_radio_1mabk_188d6_145",
+  "radio--has-description": "awsui_radio--has-description_1mabk_188d6_182"
 };
   

package/radio-group/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* 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_root_1mabk_4nbo6_145:not(#\9) {
+.awsui_radio-group_1mabk_188d6_145:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -175,82 +175,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   display: block;
 }
 
-.awsui_radio_1mabk_4nbo6_178:not(#\9) {
-  /*used in test-utils*/
-}
-
-.awsui_radio_1mabk_4nbo6_178 + .awsui_radio_1mabk_4nbo6_178:not(#\9) {
+.awsui_radio_1mabk_188d6_145 + .awsui_radio_1mabk_188d6_145:not(#\9) {
   margin-block-start: var(--space-scaled-xxs-pfm1nx, 4px);
 }
 
-.awsui_radio--has-description_1mabk_4nbo6_186 + .awsui_radio_1mabk_4nbo6_178:not(#\9) {
+.awsui_radio--has-description_1mabk_188d6_182 + .awsui_radio_1mabk_188d6_145:not(#\9) {
   margin-block-start: var(--space-scaled-xs-xwoogq, 8px);
-}
-
-.awsui_radio-control_1mabk_4nbo6_190:not(#\9) {
-  margin-block-start: calc((var(--line-height-body-m-2mh3ke, 20px) - var(--size-control-adm93y, 16px)) / 2);
-  min-block-size: var(--size-control-adm93y, 16px);
-  min-inline-size: var(--size-control-adm93y, 16px);
-  block-size: var(--size-control-adm93y, 16px);
-  inline-size: var(--size-control-adm93y, 16px);
-}
-
-.awsui_outline_1mabk_4nbo6_198:not(#\9) {
-  --awsui-style-focus-ring-box-shadow-d43v8n: 0 0 0 var(--awsui-style-focus-ring-border-width-d43v8n, 2px) var(--awsui-style-focus-ring-border-color-d43v8n, var(--color-border-item-focused-uk47pl, #006ce0));
-  position: relative;
-}
-.awsui_outline_1mabk_4nbo6_198:not(#\9) {
-  outline: 2px dotted transparent;
-  outline-offset: calc(2px - 1px);
-}
-.awsui_outline_1mabk_4nbo6_198: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-d43v8n, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  border-start-end-radius: var(--awsui-style-focus-ring-border-radius-d43v8n, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  border-end-start-radius: var(--awsui-style-focus-ring-border-radius-d43v8n, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  border-end-end-radius: var(--awsui-style-focus-ring-border-radius-d43v8n, var(--border-radius-control-circular-focus-ring-yjhscw, 4px));
-  box-shadow: var(--awsui-style-focus-ring-box-shadow-d43v8n);
-}
-
-.awsui_styled-circle-border_1mabk_4nbo6_221:not(#\9) {
-  stroke: var(--color-border-control-default-sh3548, #8c8c94);
-  fill: var(--color-background-control-default-4jb21l, #ffffff);
-}
-.awsui_styled-circle-border_1mabk_4nbo6_221.awsui_styled-circle-disabled_1mabk_4nbo6_225:not(#\9), .awsui_styled-circle-border_1mabk_4nbo6_221.awsui_styled-circle-readonly_1mabk_4nbo6_225:not(#\9) {
-  fill: var(--color-background-control-disabled-1f3718, #dedee3);
-  stroke: var(--color-background-control-disabled-1f3718, #dedee3);
-}
-
-.awsui_styled-circle-fill_1mabk_4nbo6_230:not(#\9) {
-  stroke: var(--color-background-control-checked-ka7kc2, #006ce0);
-  fill: var(--color-foreground-control-default-eto4wy, #ffffff);
-  opacity: 0;
-  transition: opacity var(--motion-duration-transition-quick-mcm2y0, 90ms) var(--motion-easing-transition-quick-qxak3i, linear);
-}
-@media (prefers-reduced-motion: reduce) {
-  .awsui_styled-circle-fill_1mabk_4nbo6_230:not(#\9) {
-    animation: none;
-    transition: none;
-  }
-}
-.awsui-motion-disabled .awsui_styled-circle-fill_1mabk_4nbo6_230:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1mabk_4nbo6_230:not(#\9) {
-  animation: none;
-  transition: none;
-}
-.awsui_styled-circle-fill_1mabk_4nbo6_230.awsui_styled-circle-checked_1mabk_4nbo6_246:not(#\9) {
-  opacity: 1;
-}
-.awsui_styled-circle-fill_1mabk_4nbo6_230.awsui_styled-circle-disabled_1mabk_4nbo6_225:not(#\9) {
-  fill: var(--color-foreground-control-disabled-txi6cf, #ffffff);
-  stroke: var(--color-background-control-disabled-1f3718, #dedee3);
-}
-.awsui_styled-circle-fill_1mabk_4nbo6_230.awsui_styled-circle-readonly_1mabk_4nbo6_225:not(#\9) {
-  fill: var(--color-foreground-control-read-only-7ydvuj, #656871);
-  stroke: var(--color-background-control-disabled-1f3718, #dedee3);
 }

package/radio-group/styles.selectors.js

@@ -2,15 +2,8 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_1mabk_4nbo6_145",
-  "radio": "awsui_radio_1mabk_4nbo6_178",
-  "radio--has-description": "awsui_radio--has-description_1mabk_4nbo6_186",
-  "radio-control": "awsui_radio-control_1mabk_4nbo6_190",
-  "outline": "awsui_outline_1mabk_4nbo6_198",
-  "styled-circle-border": "awsui_styled-circle-border_1mabk_4nbo6_221",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1mabk_4nbo6_225",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1mabk_4nbo6_225",
-  "styled-circle-fill": "awsui_styled-circle-fill_1mabk_4nbo6_230",
-  "styled-circle-checked": "awsui_styled-circle-checked_1mabk_4nbo6_246"
+  "radio-group": "awsui_radio-group_1mabk_188d6_145",
+  "radio": "awsui_radio_1mabk_188d6_145",
+  "radio--has-description": "awsui_radio--has-description_1mabk_188d6_182"
 };
   

package/radio-group/test-classes/styles.css.js

@@ -0,0 +1,6 @@
+
+    import './styles.scoped.css';
+    export default {
+  "root": "awsui_root_1np5w_1q93l_5"
+};
+  

package/radio-group/test-classes/styles.scoped.css

@@ -0,0 +1,7 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+.awsui_root_1np5w_1q93l_5:not(#\9) {
+  /*used in test-utils*/
+}

package/radio-group/test-classes/styles.selectors.js

@@ -0,0 +1,7 @@
+
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "root": "awsui_root_1np5w_1q93l_5"
+};
+  

package/table/selection/selection-control.js

@@ -5,8 +5,8 @@ import clsx from 'clsx';
 import { useSingleTabStopNavigation, useUniqueId } from '@cloudscape-design/component-toolkit/internal';
 import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import InternalCheckbox from '../../checkbox/internal';
+import RadioButton from '../../internal/components/radio-button';
 import { KeyCode } from '../../internal/keycode';
-import RadioButton from '../../radio-group/radio-button';
 import styles from './styles.css.js';
 export function SelectionControl({ selectionType, indeterminate = false, onShiftToggle, onFocusUp, onFocusDown, name, ariaLabel, focusedComponent, rowIndex, itemKey, verticalAlign = 'middle', ...sharedProps }) {
     const controlId = useUniqueId();
@@ -46,7 +46,7 @@ export function SelectionControl({ selectionType, indeterminate = false, onShift
         // Clicking on input, does not focus it on Firefox (AWSUI-11345)
         nativeInput === null || nativeInput === void 0 ? void 0 : nativeInput.focus();
     };
-    const selector = isMultiSelection ? (React.createElement(InternalCheckbox, { ...sharedProps, showOutline: focusedComponent === 'selection-control', controlId: controlId, "data-focus-id": "selection-control", indeterminate: indeterminate })) : (React.createElement(RadioButton, { ...sharedProps, controlId: controlId, name: name, value: '', label: '' }));
+    const selector = isMultiSelection ? (React.createElement(InternalCheckbox, { ...sharedProps, showOutline: focusedComponent === 'selection-control', controlId: controlId, "data-focus-id": "selection-control", indeterminate: indeterminate })) : (React.createElement(RadioButton, { ...sharedProps, controlId: controlId, name: name, value: '' }));
     return (React.createElement(React.Fragment, null,
         React.createElement("label", { onKeyDown: handleKeyDown, onKeyUp: setShiftState, onMouseDown: onMouseDownHandler, onMouseUp: setShiftState, onClick: handleClick, htmlFor: controlId, className: clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top']), "aria-label": ariaLabel, title: ariaLabel, ...(rowIndex !== undefined && !sharedProps.disabled
                 ? getAnalyticsMetadataAttribute({

package/table/selection/selection-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../../src/table/selection/selection-control.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, { KeyboardEvent, KeyboardEventHandler, MouseEvent } from 'react';\nimport clsx from 'clsx';\n\nimport { useSingleTabStopNavigation, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalCheckbox from '../../checkbox/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport RadioButton from '../../radio-group/radio-button';\nimport { SelectionProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface SelectionControlProps extends SelectionProps {\n  onShiftToggle?(shiftPressed: boolean): void;\n  onFocusUp?: KeyboardEventHandler;\n  onFocusDown?: KeyboardEventHandler;\n  ariaLabel?: string;\n  tabIndex?: -1;\n  focusedComponent?: null | string;\n  rowIndex?: number;\n  itemKey?: string;\n  verticalAlign?: 'middle' | 'top';\n}\n\nexport function SelectionControl({\n  selectionType,\n  indeterminate = false,\n  onShiftToggle,\n  onFocusUp,\n  onFocusDown,\n  name,\n  ariaLabel,\n  focusedComponent,\n  rowIndex,\n  itemKey,\n  verticalAlign = 'middle',\n  ...sharedProps\n}: SelectionControlProps) {\n  const controlId = useUniqueId();\n  const isMultiSelection = selectionType === 'multi';\n  const { navigationActive } = useSingleTabStopNavigation(null);\n\n  const setShiftState = (event: KeyboardEvent | MouseEvent) => {\n    if (isMultiSelection) {\n      onShiftToggle?.(event.shiftKey);\n    }\n  };\n\n  const onMouseDownHandler = (event: MouseEvent) => {\n    setShiftState(event);\n    if (isMultiSelection) {\n      // To overcome an issue\n      // If you shift+click or ctrl+click on a label for a checkbox, checkbox is not checked.\n      // https://bugzilla.mozilla.org/show_bug.cgi?id=559506\n      event.preventDefault();\n    }\n  };\n\n  // native checkboxes do not have focus move via keyboard, we implement it here programmatically\n  const handleKeyDown = (event: KeyboardEvent) => {\n    setShiftState(event);\n    if (isMultiSelection && !navigationActive) {\n      if (event.keyCode === KeyCode.up) {\n        event.preventDefault();\n        onFocusUp?.(event);\n      }\n      if (event.keyCode === KeyCode.down) {\n        event.preventDefault();\n        onFocusDown?.(event);\n      }\n    }\n  };\n\n  const handleClick = (event: MouseEvent) => {\n    const target = event.currentTarget;\n    const nativeInput = (target.tagName === 'INPUT' ? target : target.querySelector('input')) as HTMLInputElement;\n    // Clicking on input, does not focus it on Firefox (AWSUI-11345)\n    nativeInput?.focus();\n  };\n\n  const selector = isMultiSelection ? (\n    <InternalCheckbox\n      {...sharedProps}\n      showOutline={focusedComponent === 'selection-control'}\n      controlId={controlId}\n      data-focus-id=\"selection-control\"\n      indeterminate={indeterminate}\n    />\n  ) : (\n    <RadioButton {...sharedProps} controlId={controlId} name={name} value={''} label={''} />\n  );\n\n  return (\n    <>\n      <label\n        onKeyDown={handleKeyDown}\n        onKeyUp={setShiftState}\n        onMouseDown={onMouseDownHandler}\n        onMouseUp={setShiftState}\n        onClick={handleClick}\n        htmlFor={controlId}\n        className={clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top'])}\n        aria-label={ariaLabel}\n        title={ariaLabel}\n        {...(rowIndex !== undefined && !sharedProps.disabled\n          ? getAnalyticsMetadataAttribute({\n              detail: {\n                position: `${rowIndex + 1}`,\n                item: itemKey || '',\n              },\n            })\n          : {})}\n      >\n        {selector}\n      </label>\n      <span className={styles.stud} aria-hidden={true}>\n        &nbsp;\n      </span>\n    </>\n  );\n}\n"]}
+{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../../src/table/selection/selection-control.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, { KeyboardEvent, KeyboardEventHandler, MouseEvent } from 'react';\nimport clsx from 'clsx';\n\nimport { useSingleTabStopNavigation, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalCheckbox from '../../checkbox/internal';\nimport RadioButton from '../../internal/components/radio-button';\nimport { KeyCode } from '../../internal/keycode';\nimport { SelectionProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface SelectionControlProps extends SelectionProps {\n  onShiftToggle?(shiftPressed: boolean): void;\n  onFocusUp?: KeyboardEventHandler;\n  onFocusDown?: KeyboardEventHandler;\n  ariaLabel?: string;\n  tabIndex?: -1;\n  focusedComponent?: null | string;\n  rowIndex?: number;\n  itemKey?: string;\n  verticalAlign?: 'middle' | 'top';\n}\n\nexport function SelectionControl({\n  selectionType,\n  indeterminate = false,\n  onShiftToggle,\n  onFocusUp,\n  onFocusDown,\n  name,\n  ariaLabel,\n  focusedComponent,\n  rowIndex,\n  itemKey,\n  verticalAlign = 'middle',\n  ...sharedProps\n}: SelectionControlProps) {\n  const controlId = useUniqueId();\n  const isMultiSelection = selectionType === 'multi';\n  const { navigationActive } = useSingleTabStopNavigation(null);\n\n  const setShiftState = (event: KeyboardEvent | MouseEvent) => {\n    if (isMultiSelection) {\n      onShiftToggle?.(event.shiftKey);\n    }\n  };\n\n  const onMouseDownHandler = (event: MouseEvent) => {\n    setShiftState(event);\n    if (isMultiSelection) {\n      // To overcome an issue\n      // If you shift+click or ctrl+click on a label for a checkbox, checkbox is not checked.\n      // https://bugzilla.mozilla.org/show_bug.cgi?id=559506\n      event.preventDefault();\n    }\n  };\n\n  // native checkboxes do not have focus move via keyboard, we implement it here programmatically\n  const handleKeyDown = (event: KeyboardEvent) => {\n    setShiftState(event);\n    if (isMultiSelection && !navigationActive) {\n      if (event.keyCode === KeyCode.up) {\n        event.preventDefault();\n        onFocusUp?.(event);\n      }\n      if (event.keyCode === KeyCode.down) {\n        event.preventDefault();\n        onFocusDown?.(event);\n      }\n    }\n  };\n\n  const handleClick = (event: MouseEvent) => {\n    const target = event.currentTarget;\n    const nativeInput = (target.tagName === 'INPUT' ? target : target.querySelector('input')) as HTMLInputElement;\n    // Clicking on input, does not focus it on Firefox (AWSUI-11345)\n    nativeInput?.focus();\n  };\n\n  const selector = isMultiSelection ? (\n    <InternalCheckbox\n      {...sharedProps}\n      showOutline={focusedComponent === 'selection-control'}\n      controlId={controlId}\n      data-focus-id=\"selection-control\"\n      indeterminate={indeterminate}\n    />\n  ) : (\n    <RadioButton {...sharedProps} controlId={controlId} name={name} value={''} />\n  );\n\n  return (\n    <>\n      <label\n        onKeyDown={handleKeyDown}\n        onKeyUp={setShiftState}\n        onMouseDown={onMouseDownHandler}\n        onMouseUp={setShiftState}\n        onClick={handleClick}\n        htmlFor={controlId}\n        className={clsx(styles.label, styles.root, verticalAlign === 'top' && styles['label-top'])}\n        aria-label={ariaLabel}\n        title={ariaLabel}\n        {...(rowIndex !== undefined && !sharedProps.disabled\n          ? getAnalyticsMetadataAttribute({\n              detail: {\n                position: `${rowIndex + 1}`,\n                item: itemKey || '',\n              },\n            })\n          : {})}\n      >\n        {selector}\n      </label>\n      <span className={styles.stud} aria-hidden={true}>\n        &nbsp;\n      </span>\n    </>\n  );\n}\n"]}

package/test-utils/dom/radio-group/index.js

@@ -5,16 +5,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const dom_1 = require("@cloudscape-design/test-utils-core/dom");
 const utils_1 = require("@cloudscape-design/test-utils-core/utils");
 const radio_button_1 = require("./radio-button");
-const styles_selectors_js_1 = require("../../../radio-group/styles.selectors.js");
+const styles_selectors_js_1 = require("../../../internal/components/radio-button/test-classes/styles.selectors.js");
+const styles_selectors_js_2 = require("../../../radio-group/test-classes/styles.selectors.js");
 class RadioGroupWrapper extends dom_1.ComponentWrapper {
     findButtons() {
-        return this.findAllByClassName(styles_selectors_js_1.default.radio).map(r => new radio_button_1.default(r.getElement()));
+        return this.findAllByClassName(styles_selectors_js_1.default.root).map(r => new radio_button_1.default(r.getElement()));
     }
     findInputByValue(value) {
         const safeValue = (0, utils_1.escapeSelector)(value);
         return this.find(`input[value="${safeValue}"]`);
     }
 }
-RadioGroupWrapper.rootSelector = styles_selectors_js_1.default.root;
+RadioGroupWrapper.rootSelector = styles_selectors_js_2.default.root;
 exports.default = RadioGroupWrapper;
 //# sourceMappingURL=index.js.map

package/test-utils/dom/radio-group/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/radio-group/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAC1F,oEAA0E;AAE1E,iDAAgD;AAEhD,kFAA8D;AAE9D,MAAqB,iBAAkB,SAAQ,sBAAgB;IAG7D,WAAW;QACT,OAAO,IAAI,CAAC,kBAAkB,CAAC,6BAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,sBAAkB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;IAChG,CAAC;IAED,gBAAgB,CAAC,KAAa;QAC5B,MAAM,SAAS,GAAG,IAAA,sBAAc,EAAC,KAAK,CAAC,CAAC;QACxC,OAAO,IAAI,CAAC,IAAI,CAAC,gBAAgB,SAAS,IAAI,CAAC,CAAC;IAClD,CAAC;;AATM,8BAAY,GAAW,6BAAM,CAAC,IAAI,CAAC;kBADvB,iBAAiB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/radio-group/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAC1F,oEAA0E;AAE1E,iDAAgD;AAEhD,oHAA2G;AAC3G,+FAA2E;AAE3E,MAAqB,iBAAkB,SAAQ,sBAAgB;IAG7D,WAAW;QACT,OAAO,IAAI,CAAC,kBAAkB,CAAC,6BAAiB,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,sBAAkB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;IAC1G,CAAC;IAED,gBAAgB,CAAC,KAAa;QAC5B,MAAM,SAAS,GAAG,IAAA,sBAAc,EAAC,KAAK,CAAC,CAAC;QACxC,OAAO,IAAI,CAAC,IAAI,CAAC,gBAAgB,SAAS,IAAI,CAAC,CAAC;IAClD,CAAC;;AATM,8BAAY,GAAW,6BAAM,CAAC,IAAI,CAAC;kBADvB,iBAAiB"}

package/test-utils/dom/radio-group/radio-button.d.ts

@@ -1,5 +1,6 @@
 import { ComponentWrapper, ElementWrapper } from '@cloudscape-design/test-utils-core/dom';
 export default class RadioButtonWrapper extends ComponentWrapper {
+  static rootSelector: string;
   private findAbstractSwitch;
   findLabel(): ElementWrapper;
   findNativeInput(): ElementWrapper<HTMLInputElement>;

package/test-utils/dom/radio-group/radio-button.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // SPDX-License-Identifier: Apache-2.0
 const dom_1 = require("@cloudscape-design/test-utils-core/dom");
 const abstract_switch_1 = require("../internal/abstract-switch");
+const styles_selectors_js_1 = require("../../../internal/components/radio-button/test-classes/styles.selectors.js");
 class RadioButtonWrapper extends dom_1.ComponentWrapper {
     findAbstractSwitch() {
         return new abstract_switch_1.default(this.getElement());
@@ -18,5 +19,6 @@ class RadioButtonWrapper extends dom_1.ComponentWrapper {
         return this.findAbstractSwitch().findDescription();
     }
 }
+RadioButtonWrapper.rootSelector = styles_selectors_js_1.default.root;
 exports.default = RadioButtonWrapper;
 //# sourceMappingURL=radio-button.js.map

package/test-utils/dom/radio-group/radio-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/radio-group/radio-button.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAE1F,iEAAgE;AAEhE,MAAqB,kBAAmB,SAAQ,sBAAgB;IACtD,kBAAkB;QACxB,OAAO,IAAI,yBAAqB,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;IACtD,CAAC;IAED,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,SAAS,EAAE,CAAC;IAC/C,CAAC;IAED,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;IAED,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;CACF;AAhBD,qCAgBC"}
+{"version":3,"file":"radio-button.js","sourceRoot":"","sources":["../../../../../src/test-utils/dom/radio-group/radio-button.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,gEAA0F;AAE1F,iEAAgE;AAEhE,oHAAgG;AAEhG,MAAqB,kBAAmB,SAAQ,sBAAgB;IAGtD,kBAAkB;QACxB,OAAO,IAAI,yBAAqB,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;IACtD,CAAC;IAED,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,SAAS,EAAE,CAAC;IAC/C,CAAC;IAED,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;IAED,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;;AAhBM,+BAAY,GAAW,6BAAM,CAAC,IAAI,CAAC;kBADvB,kBAAkB"}

package/test-utils/selectors/radio-group/index.js

@@ -5,16 +5,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const selectors_1 = require("@cloudscape-design/test-utils-core/selectors");
 const utils_1 = require("@cloudscape-design/test-utils-core/utils");
 const radio_button_1 = require("./radio-button");
-const styles_selectors_js_1 = require("../../../radio-group/styles.selectors.js");
+const styles_selectors_js_1 = require("../../../internal/components/radio-button/test-classes/styles.selectors.js");
+const styles_selectors_js_2 = require("../../../radio-group/test-classes/styles.selectors.js");
 class RadioGroupWrapper extends selectors_1.ComponentWrapper {
     findButtons() {
-        return this.findAllByClassName(styles_selectors_js_1.default.radio).map(r => new radio_button_1.default(r.getElement()));
+        return this.findAllByClassName(styles_selectors_js_1.default.root).map(r => new radio_button_1.default(r.getElement()));
     }
     findInputByValue(value) {
         const safeValue = (0, utils_1.escapeSelector)(value);
         return this.find(`input[value="${safeValue}"]`);
     }
 }
-RadioGroupWrapper.rootSelector = styles_selectors_js_1.default.root;
+RadioGroupWrapper.rootSelector = styles_selectors_js_2.default.root;
 exports.default = RadioGroupWrapper;
 //# sourceMappingURL=index.js.map

package/test-utils/selectors/radio-group/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/radio-group/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,oEAA0E;AAC1E,iDAAgD;AAChD,kFAA8D;AAC9D,MAAqB,iBAAkB,SAAQ,4BAAgB;IAE7D,WAAW;QACT,OAAO,IAAI,CAAC,kBAAkB,CAAC,6BAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,sBAAkB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;IAChG,CAAC;IACD,gBAAgB,CAAC,KAAa;QAC5B,MAAM,SAAS,GAAG,IAAA,sBAAc,EAAC,KAAK,CAAC,CAAC;QACxC,OAAO,IAAI,CAAC,IAAI,CAAC,gBAAgB,SAAS,IAAI,CAAC,CAAC;IAClD,CAAC;;AAPM,8BAAY,GAAW,6BAAM,CAAC,IAAI,CAAC;kBADvB,iBAAiB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/radio-group/index.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,oEAA0E;AAC1E,iDAAgD;AAChD,oHAA2G;AAC3G,+FAA2E;AAC3E,MAAqB,iBAAkB,SAAQ,4BAAgB;IAE7D,WAAW;QACT,OAAO,IAAI,CAAC,kBAAkB,CAAC,6BAAiB,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,sBAAkB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;IAC1G,CAAC;IACD,gBAAgB,CAAC,KAAa;QAC5B,MAAM,SAAS,GAAG,IAAA,sBAAc,EAAC,KAAK,CAAC,CAAC;QACxC,OAAO,IAAI,CAAC,IAAI,CAAC,gBAAgB,SAAS,IAAI,CAAC,CAAC;IAClD,CAAC;;AAPM,8BAAY,GAAW,6BAAM,CAAC,IAAI,CAAC;kBADvB,iBAAiB"}

package/test-utils/selectors/radio-group/radio-button.d.ts

@@ -1,5 +1,6 @@
 import { ComponentWrapper, ElementWrapper } from "@cloudscape-design/test-utils-core/selectors";
 export default class RadioButtonWrapper extends ComponentWrapper {
+  static rootSelector: string;
   private findAbstractSwitch;
   findLabel(): ElementWrapper;
   findNativeInput(): ElementWrapper;

package/test-utils/selectors/radio-group/radio-button.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // SPDX-License-Identifier: Apache-2.0
 const selectors_1 = require("@cloudscape-design/test-utils-core/selectors");
 const abstract_switch_1 = require("../internal/abstract-switch");
+const styles_selectors_js_1 = require("../../../internal/components/radio-button/test-classes/styles.selectors.js");
 class RadioButtonWrapper extends selectors_1.ComponentWrapper {
     findAbstractSwitch() {
         return new abstract_switch_1.default(this.getElement());
@@ -18,5 +19,6 @@ class RadioButtonWrapper extends selectors_1.ComponentWrapper {
         return this.findAbstractSwitch().findDescription();
     }
 }
+RadioButtonWrapper.rootSelector = styles_selectors_js_1.default.root;
 exports.default = RadioButtonWrapper;
 //# sourceMappingURL=radio-button.js.map

package/test-utils/selectors/radio-group/radio-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/radio-group/radio-button.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,iEAAgE;AAChE,MAAqB,kBAAmB,SAAQ,4BAAgB;IACtD,kBAAkB;QACxB,OAAO,IAAI,yBAAqB,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;IACtD,CAAC;IACD,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,SAAS,EAAE,CAAC;IAC/C,CAAC;IACD,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;IACD,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;CACF;AAbD,qCAaC"}
+{"version":3,"file":"radio-button.js","sourceRoot":"","sources":["../../../../../src/test-utils/selectors/radio-group/radio-button.ts"],"names":[],"mappings":";;AAAA,qEAAqE;AACrE,sCAAsC;AACtC,4EAAgG;AAChG,iEAAgE;AAChE,oHAAgG;AAChG,MAAqB,kBAAmB,SAAQ,4BAAgB;IAEtD,kBAAkB;QACxB,OAAO,IAAI,yBAAqB,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;IACtD,CAAC;IACD,SAAS;QACP,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,SAAS,EAAE,CAAC;IAC/C,CAAC;IACD,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;IACD,eAAe;QACb,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC,eAAe,EAAE,CAAC;IACrD,CAAC;;AAZM,+BAAY,GAAW,6BAAM,CAAC,IAAI,CAAC;kBADvB,kBAAkB"}

package/tiles/tile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tile.d.ts","sourceRoot":"","sources":["../../../src/tiles/tile.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAOtC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAG9E,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAK1C,UAAU,SAAS;IACjB,IAAI,EAAE,UAAU,CAAC,eAAe,CAAC;IACjC,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1D,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,IAAI,oFAmDhB,CAAC"}
+{"version":3,"file":"tile.d.ts","sourceRoot":"","sources":["../../../src/tiles/tile.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAQtC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAE9E,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAK1C,UAAU,SAAS;IACjB,IAAI,EAAE,UAAU,CAAC,eAAe,CAAC;IACjC,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1D,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,IAAI,oFAoDhB,CAAC"}

package/tiles/tile.js

@@ -4,9 +4,9 @@ import React, { useRef } from 'react';
 import clsx from 'clsx';
 import { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';
 import { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
+import RadioButton from '../internal/components/radio-button';
 import { fireNonCancelableEvent } from '../internal/events';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
-import RadioButton from '../radio-group/radio-button';
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
 export const Tile = React.forwardRef(({ item, selected, name, breakpoint, onChange, readOnly, ...rest }, forwardedRef) => {
@@ -24,7 +24,7 @@ export const Tile = React.forwardRef(({ item, selected, name, breakpoint, onChan
             }
         }, ...copyAnalyticsMetadataAttribute(rest) },
         React.createElement("div", { className: clsx(styles.control, { [styles['no-image']]: !item.image }) },
-            React.createElement(RadioButton, { checked: selected, ref: mergedRef, name: name, value: item.value, label: item.label, description: item.description, disabled: item.disabled, controlId: item.controlId, readOnly: readOnly, className: analyticsSelectors['radio-button'] })),
+            React.createElement(RadioButton, { checked: selected, ref: mergedRef, name: name, value: item.value, description: item.description, disabled: item.disabled, controlId: item.controlId, readOnly: readOnly, className: analyticsSelectors['radio-button'] }, item.label)),
         item.image && React.createElement("div", { className: clsx(styles.image, { [styles.disabled]: !!item.disabled }) }, item.image)));
 });
 //# sourceMappingURL=tile.js.map

package/tiles/tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile.js","sourceRoot":"","sources":["../../../src/tiles/tile.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 { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport RadioButton from '../radio-group/radio-button';\nimport { TilesProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface TileProps {\n  item: TilesProps.TilesDefinition;\n  selected: boolean;\n  name: string;\n  breakpoint: ReturnType<typeof useContainerBreakpoints>[0];\n  onChange: TilesProps['onChange'];\n  readOnly?: boolean;\n}\n\nexport const Tile = React.forwardRef(\n  (\n    { item, selected, name, breakpoint, onChange, readOnly, ...rest }: TileProps,\n    forwardedRef: React.Ref<HTMLInputElement>\n  ) => {\n    const internalRef = useRef<HTMLInputElement>(null);\n    const isVisualRefresh = useVisualRefresh();\n\n    const mergedRef = useMergeRefs(internalRef, forwardedRef);\n\n    return (\n      <div\n        className={clsx(\n          styles['tile-container'],\n          { [styles['has-metadata']]: item.description || item.image },\n          { [styles.selected]: selected },\n          { [styles.disabled]: !!item.disabled },\n          { [styles.readonly]: readOnly },\n          { [styles.refresh]: isVisualRefresh },\n          styles[`breakpoint-${breakpoint}`]\n        )}\n        data-value={item.value}\n        onClick={() => {\n          if (item.disabled || readOnly) {\n            return;\n          }\n          internalRef.current?.focus();\n          if (!selected) {\n            fireNonCancelableEvent(onChange, { value: item.value });\n          }\n        }}\n        {...copyAnalyticsMetadataAttribute(rest)}\n      >\n        <div className={clsx(styles.control, { [styles['no-image']]: !item.image })}>\n          <RadioButton\n            checked={selected}\n            ref={mergedRef}\n            name={name}\n            value={item.value}\n            label={item.label}\n            description={item.description}\n            disabled={item.disabled}\n            controlId={item.controlId}\n            readOnly={readOnly}\n            className={analyticsSelectors['radio-button']}\n          />\n        </div>\n        {item.image && <div className={clsx(styles.image, { [styles.disabled]: !!item.disabled })}>{item.image}</div>}\n      </div>\n    );\n  }\n);\n"]}
+{"version":3,"file":"tile.js","sourceRoot":"","sources":["../../../src/tiles/tile.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 { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport RadioButton from '../internal/components/radio-button';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { TilesProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface TileProps {\n  item: TilesProps.TilesDefinition;\n  selected: boolean;\n  name: string;\n  breakpoint: ReturnType<typeof useContainerBreakpoints>[0];\n  onChange: TilesProps['onChange'];\n  readOnly?: boolean;\n}\n\nexport const Tile = React.forwardRef(\n  (\n    { item, selected, name, breakpoint, onChange, readOnly, ...rest }: TileProps,\n    forwardedRef: React.Ref<HTMLInputElement>\n  ) => {\n    const internalRef = useRef<HTMLInputElement>(null);\n    const isVisualRefresh = useVisualRefresh();\n\n    const mergedRef = useMergeRefs(internalRef, forwardedRef);\n\n    return (\n      <div\n        className={clsx(\n          styles['tile-container'],\n          { [styles['has-metadata']]: item.description || item.image },\n          { [styles.selected]: selected },\n          { [styles.disabled]: !!item.disabled },\n          { [styles.readonly]: readOnly },\n          { [styles.refresh]: isVisualRefresh },\n          styles[`breakpoint-${breakpoint}`]\n        )}\n        data-value={item.value}\n        onClick={() => {\n          if (item.disabled || readOnly) {\n            return;\n          }\n          internalRef.current?.focus();\n          if (!selected) {\n            fireNonCancelableEvent(onChange, { value: item.value });\n          }\n        }}\n        {...copyAnalyticsMetadataAttribute(rest)}\n      >\n        <div className={clsx(styles.control, { [styles['no-image']]: !item.image })}>\n          <RadioButton\n            checked={selected}\n            ref={mergedRef}\n            name={name}\n            value={item.value}\n            description={item.description}\n            disabled={item.disabled}\n            controlId={item.controlId}\n            readOnly={readOnly}\n            className={analyticsSelectors['radio-button']}\n          >\n            {item.label}\n          </RadioButton>\n        </div>\n        {item.image && <div className={clsx(styles.image, { [styles.disabled]: !!item.disabled })}>{item.image}</div>}\n      </div>\n    );\n  }\n);\n"]}

package/tree-view/tree-item/styles.css.js

@@ -1,14 +1,14 @@
 
     import './styles.scoped.css';
     export default {
-  "treeitem-group": "awsui_treeitem-group_1agpu_c0siv_185",
-  "treeitem": "awsui_treeitem_1agpu_c0siv_185",
-  "offset": "awsui_offset_1agpu_c0siv_202",
-  "treeitem-content-wrapper": "awsui_treeitem-content-wrapper_1agpu_c0siv_205",
-  "tree-item-focus-target": "awsui_tree-item-focus-target_1agpu_c0siv_210",
-  "expand-toggle-wrapper": "awsui_expand-toggle-wrapper_1agpu_c0siv_231",
-  "toggle": "awsui_toggle_1agpu_c0siv_236",
-  "structured-item-wrapper": "awsui_structured-item-wrapper_1agpu_c0siv_241",
-  "tree-item-structured-item": "awsui_tree-item-structured-item_1agpu_c0siv_248"
+  "treeitem-group": "awsui_treeitem-group_1agpu_g9cri_185",
+  "treeitem": "awsui_treeitem_1agpu_g9cri_185",
+  "offset": "awsui_offset_1agpu_g9cri_202",
+  "treeitem-content-wrapper": "awsui_treeitem-content-wrapper_1agpu_g9cri_205",
+  "tree-item-focus-target": "awsui_tree-item-focus-target_1agpu_g9cri_210",
+  "expand-toggle-wrapper": "awsui_expand-toggle-wrapper_1agpu_g9cri_231",
+  "toggle": "awsui_toggle_1agpu_g9cri_237",
+  "structured-item-wrapper": "awsui_structured-item-wrapper_1agpu_g9cri_242",
+  "tree-item-structured-item": "awsui_tree-item-structured-item_1agpu_g9cri_249"
 };
   

package/tree-view/tree-item/styles.scoped.css

@@ -182,7 +182,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_treeitem-group_1agpu_c0siv_185:not(#\9) {
+.awsui_treeitem-group_1agpu_g9cri_185:not(#\9) {
   list-style: none;
   margin-block: 0;
   margin-inline: 0;
@@ -191,7 +191,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   position: relative;
 }
 
-.awsui_treeitem_1agpu_c0siv_185:not(#\9) {
+.awsui_treeitem_1agpu_g9cri_185:not(#\9) {
   list-style: none;
   margin-block: 0;
   margin-inline: 0;
@@ -199,22 +199,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline: 0;
   position: relative;
 }
-.awsui_treeitem_1agpu_c0siv_185.awsui_offset_1agpu_c0siv_202:not(#\9) {
+.awsui_treeitem_1agpu_g9cri_185.awsui_offset_1agpu_g9cri_202:not(#\9) {
   margin-inline-start: 28px;
 }
-.awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205:not(#\9) {
+.awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205:not(#\9) {
   display: grid;
   grid-template-columns: 28px 1fr;
   align-items: baseline;
 }
-body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_c0siv_210:focus) {
+body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_g9cri_210:focus) {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_c0siv_210:focus) {
+body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_g9cri_210:focus) {
   outline: 2px dotted transparent;
   outline-offset: calc(0px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_c0siv_210:focus)::before {
+body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_g9cri_210:focus)::before {
   content: " ";
   display: block;
   position: absolute;
@@ -228,24 +228,28 @@ body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_c0siv_185 > .awsui_tre
   border-end-end-radius: var(--border-radius-control-default-focus-ring-1uabki, 4px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-uk47pl, #006ce0);
 }
-.awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205 > .awsui_expand-toggle-wrapper_1agpu_c0siv_231:not(#\9) {
+.awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205 > .awsui_expand-toggle-wrapper_1agpu_g9cri_231:not(#\9) {
+  display: grid;
   grid-column: 1;
   grid-row: 1;
   padding-inline-end: var(--space-scaled-xxs-pfm1nx, 4px);
 }
-.awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205 > .awsui_expand-toggle-wrapper_1agpu_c0siv_231 > .awsui_toggle_1agpu_c0siv_236:not(#\9) {
+.awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205 > .awsui_expand-toggle-wrapper_1agpu_g9cri_231 > .awsui_toggle_1agpu_g9cri_237:not(#\9) {
   justify-self: center;
   position: relative;
   inset-block-start: 2px;
 }
-.awsui_treeitem_1agpu_c0siv_185 > .awsui_treeitem-content-wrapper_1agpu_c0siv_205 > .awsui_structured-item-wrapper_1agpu_c0siv_241:not(#\9) {
+.awsui_treeitem_1agpu_g9cri_185 > .awsui_treeitem-content-wrapper_1agpu_g9cri_205 > .awsui_structured-item-wrapper_1agpu_g9cri_242:not(#\9) {
   grid-column: 2;
   grid-row: 1/span 2;
   padding-block: var(--space-scaled-xxs-pfm1nx, 4px);
   position: relative;
 }
 
-.awsui_tree-item-structured-item_1agpu_c0siv_248:not(#\9),
-.awsui_tree-item-focus-target_1agpu_c0siv_210:not(#\9) {
+.awsui_tree-item-structured-item_1agpu_g9cri_249:not(#\9) {
   /* used in keyboard navigation */
+}
+
+.awsui_tree-item-focus-target_1agpu_g9cri_210:not(#\9) {
+  outline: none;
 }