@cloudscape-design/components-themeable 3.0.1139 → 3.0.1141

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 (62) hide show
  1. package/lib/internal/manifest.json +1 -1
  2. package/lib/internal/scss/internal/components/radio-button/styles.scss +57 -0
  3. package/lib/internal/scss/internal/components/radio-button/test-classes/styles.scss +8 -0
  4. package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +1 -1
  5. package/lib/internal/scss/radio-group/styles.scss +1 -56
  6. package/lib/internal/scss/radio-group/test-classes/styles.scss +8 -0
  7. package/lib/internal/scss/tree-view/tree-item/styles.scss +6 -2
  8. package/lib/internal/template/internal/base-component/styles.scoped.css +1 -1
  9. package/lib/internal/template/internal/components/radio-button/index.d.ts +6 -0
  10. package/lib/internal/template/internal/components/radio-button/index.d.ts.map +1 -0
  11. package/lib/internal/template/{radio-group/radio-button.js → internal/components/radio-button/index.js} +10 -10
  12. package/lib/internal/template/internal/components/radio-button/index.js.map +1 -0
  13. package/lib/internal/template/internal/components/radio-button/interfaces.d.ts +127 -0
  14. package/lib/internal/template/internal/components/radio-button/interfaces.d.ts.map +1 -0
  15. package/lib/internal/template/internal/components/radio-button/interfaces.js +2 -0
  16. package/lib/internal/template/internal/components/radio-button/interfaces.js.map +1 -0
  17. package/lib/internal/template/internal/components/radio-button/styles.css.js +12 -0
  18. package/lib/internal/template/internal/components/radio-button/styles.scoped.css +211 -0
  19. package/lib/internal/template/internal/components/radio-button/styles.selectors.js +13 -0
  20. package/lib/internal/template/internal/components/radio-button/test-classes/styles.css.js +6 -0
  21. package/lib/internal/template/internal/components/radio-button/test-classes/styles.scoped.css +7 -0
  22. package/lib/internal/template/internal/components/radio-button/test-classes/styles.selectors.js +7 -0
  23. package/lib/internal/template/internal/environment.js +2 -2
  24. package/lib/internal/template/internal/environment.json +2 -2
  25. package/lib/internal/template/radio-group/index.d.ts +1 -1
  26. package/lib/internal/template/radio-group/index.d.ts.map +1 -1
  27. package/lib/internal/template/radio-group/interfaces.d.ts +3 -50
  28. package/lib/internal/template/radio-group/interfaces.d.ts.map +1 -1
  29. package/lib/internal/template/radio-group/interfaces.js +2 -0
  30. package/lib/internal/template/radio-group/interfaces.js.map +1 -1
  31. package/lib/internal/template/radio-group/internal.d.ts +1 -1
  32. package/lib/internal/template/radio-group/internal.d.ts.map +1 -1
  33. package/lib/internal/template/radio-group/internal.js +10 -4
  34. package/lib/internal/template/radio-group/internal.js.map +1 -1
  35. package/lib/internal/template/radio-group/styles.css.js +3 -10
  36. package/lib/internal/template/radio-group/styles.scoped.css +3 -75
  37. package/lib/internal/template/radio-group/styles.selectors.js +3 -10
  38. package/lib/internal/template/radio-group/test-classes/styles.css.js +6 -0
  39. package/lib/internal/template/radio-group/test-classes/styles.scoped.css +7 -0
  40. package/lib/internal/template/radio-group/test-classes/styles.selectors.js +7 -0
  41. package/lib/internal/template/table/selection/selection-control.js +2 -2
  42. package/lib/internal/template/table/selection/selection-control.js.map +1 -1
  43. package/lib/internal/template/test-utils/dom/radio-group/index.js +4 -3
  44. package/lib/internal/template/test-utils/dom/radio-group/index.js.map +1 -1
  45. package/lib/internal/template/test-utils/dom/radio-group/radio-button.d.ts +1 -0
  46. package/lib/internal/template/test-utils/dom/radio-group/radio-button.js +2 -0
  47. package/lib/internal/template/test-utils/dom/radio-group/radio-button.js.map +1 -1
  48. package/lib/internal/template/test-utils/selectors/radio-group/index.js +4 -3
  49. package/lib/internal/template/test-utils/selectors/radio-group/index.js.map +1 -1
  50. package/lib/internal/template/test-utils/selectors/radio-group/radio-button.d.ts +1 -0
  51. package/lib/internal/template/test-utils/selectors/radio-group/radio-button.js +2 -0
  52. package/lib/internal/template/test-utils/selectors/radio-group/radio-button.js.map +1 -1
  53. package/lib/internal/template/tiles/tile.d.ts.map +1 -1
  54. package/lib/internal/template/tiles/tile.js +2 -2
  55. package/lib/internal/template/tiles/tile.js.map +1 -1
  56. package/lib/internal/template/tree-view/tree-item/styles.css.js +9 -9
  57. package/lib/internal/template/tree-view/tree-item/styles.scoped.css +16 -12
  58. package/lib/internal/template/tree-view/tree-item/styles.selectors.js +9 -9
  59. package/package.json +1 -1
  60. package/lib/internal/template/radio-group/radio-button.d.ts +0 -14
  61. package/lib/internal/template/radio-group/radio-button.d.ts.map +0 -1
  62. package/lib/internal/template/radio-group/radio-button.js.map +0 -1
@@ -4,9 +4,9 @@ import React, { useRef } from 'react';
4
4
  import clsx from 'clsx';
5
5
  import { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';
6
6
  import { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
7
+ import RadioButton from '../internal/components/radio-button';
7
8
  import { fireNonCancelableEvent } from '../internal/events';
8
9
  import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
9
- import RadioButton from '../radio-group/radio-button';
10
10
  import analyticsSelectors from './analytics-metadata/styles.css.js';
11
11
  import styles from './styles.css.js';
12
12
  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
24
24
  }
25
25
  }, ...copyAnalyticsMetadataAttribute(rest) },
26
26
  React.createElement("div", { className: clsx(styles.control, { [styles['no-image']]: !item.image }) },
27
- 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'] })),
27
+ 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)),
28
28
  item.image && React.createElement("div", { className: clsx(styles.image, { [styles.disabled]: !!item.disabled }) }, item.image)));
29
29
  });
30
30
  //# sourceMappingURL=tile.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tile.js","sourceRoot":"","sources":["../../../src/tiles/tile.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,+CAA+C,CAAC;AAC7E,OAAO,EAAE,8BAA8B,EAAE,MAAM,kEAAkE,CAAC;AAElH,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,WAAW,MAAM,6BAA6B,CAAC;AAGtD,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAWrC,MAAM,CAAC,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAa,EAC5E,YAAyC,EACzC,EAAE;IACF,MAAM,WAAW,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACnD,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;IAE3C,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;IAE1D,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,gBAAgB,CAAC,EACxB,EAAE,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,KAAK,EAAE,EAC5D,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAC/B,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,EACtC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAC/B,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,eAAe,EAAE,EACrC,MAAM,CAAC,cAAc,UAAU,EAAE,CAAC,CACnC,gBACW,IAAI,CAAC,KAAK,EACtB,OAAO,EAAE,GAAG,EAAE;;YACZ,IAAI,IAAI,CAAC,QAAQ,IAAI,QAAQ,EAAE,CAAC;gBAC9B,OAAO;YACT,CAAC;YACD,MAAA,WAAW,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YAC7B,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACd,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;YAC1D,CAAC;QACH,CAAC,KACG,8BAA8B,CAAC,IAAI,CAAC;QAExC,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YACzE,oBAAC,WAAW,IACV,OAAO,EAAE,QAAQ,EACjB,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,kBAAkB,CAAC,cAAc,CAAC,GAC7C,CACE;QACL,IAAI,CAAC,KAAK,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,IAAG,IAAI,CAAC,KAAK,CAAO,CACzG,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { 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"]}
1
+ {"version":3,"file":"tile.js","sourceRoot":"","sources":["../../../src/tiles/tile.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,+CAA+C,CAAC;AAC7E,OAAO,EAAE,8BAA8B,EAAE,MAAM,kEAAkE,CAAC;AAElH,OAAO,WAAW,MAAM,qCAAqC,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAWrC,MAAM,CAAC,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAa,EAC5E,YAAyC,EACzC,EAAE;IACF,MAAM,WAAW,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACnD,MAAM,eAAe,GAAG,gBAAgB,EAAE,CAAC;IAE3C,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;IAE1D,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,gBAAgB,CAAC,EACxB,EAAE,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,KAAK,EAAE,EAC5D,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAC/B,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,EACtC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAC/B,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,eAAe,EAAE,EACrC,MAAM,CAAC,cAAc,UAAU,EAAE,CAAC,CACnC,gBACW,IAAI,CAAC,KAAK,EACtB,OAAO,EAAE,GAAG,EAAE;;YACZ,IAAI,IAAI,CAAC,QAAQ,IAAI,QAAQ,EAAE,CAAC;gBAC9B,OAAO;YACT,CAAC;YACD,MAAA,WAAW,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YAC7B,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACd,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;YAC1D,CAAC;QACH,CAAC,KACG,8BAA8B,CAAC,IAAI,CAAC;QAExC,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YACzE,oBAAC,WAAW,IACV,OAAO,EAAE,QAAQ,EACjB,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,kBAAkB,CAAC,cAAc,CAAC,IAE5C,IAAI,CAAC,KAAK,CACC,CACV;QACL,IAAI,CAAC,KAAK,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,IAAG,IAAI,CAAC,KAAK,CAAO,CACzG,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { 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"]}
@@ -1,14 +1,14 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "treeitem-group": "awsui_treeitem-group_1agpu_1hpjs_185",
5
- "treeitem": "awsui_treeitem_1agpu_1hpjs_185",
6
- "offset": "awsui_offset_1agpu_1hpjs_202",
7
- "treeitem-content-wrapper": "awsui_treeitem-content-wrapper_1agpu_1hpjs_205",
8
- "tree-item-focus-target": "awsui_tree-item-focus-target_1agpu_1hpjs_210",
9
- "expand-toggle-wrapper": "awsui_expand-toggle-wrapper_1agpu_1hpjs_231",
10
- "toggle": "awsui_toggle_1agpu_1hpjs_236",
11
- "structured-item-wrapper": "awsui_structured-item-wrapper_1agpu_1hpjs_241",
12
- "tree-item-structured-item": "awsui_tree-item-structured-item_1agpu_1hpjs_248"
4
+ "treeitem-group": "awsui_treeitem-group_1agpu_601dz_185",
5
+ "treeitem": "awsui_treeitem_1agpu_601dz_185",
6
+ "offset": "awsui_offset_1agpu_601dz_202",
7
+ "treeitem-content-wrapper": "awsui_treeitem-content-wrapper_1agpu_601dz_205",
8
+ "tree-item-focus-target": "awsui_tree-item-focus-target_1agpu_601dz_210",
9
+ "expand-toggle-wrapper": "awsui_expand-toggle-wrapper_1agpu_601dz_231",
10
+ "toggle": "awsui_toggle_1agpu_601dz_237",
11
+ "structured-item-wrapper": "awsui_structured-item-wrapper_1agpu_601dz_242",
12
+ "tree-item-structured-item": "awsui_tree-item-structured-item_1agpu_601dz_249"
13
13
  };
14
14
 
@@ -182,7 +182,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
182
182
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
183
183
  SPDX-License-Identifier: Apache-2.0
184
184
  */
185
- .awsui_treeitem-group_1agpu_1hpjs_185:not(#\9) {
185
+ .awsui_treeitem-group_1agpu_601dz_185:not(#\9) {
186
186
  list-style: none;
187
187
  margin-block: 0;
188
188
  margin-inline: 0;
@@ -191,7 +191,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
191
191
  position: relative;
192
192
  }
193
193
 
194
- .awsui_treeitem_1agpu_1hpjs_185:not(#\9) {
194
+ .awsui_treeitem_1agpu_601dz_185:not(#\9) {
195
195
  list-style: none;
196
196
  margin-block: 0;
197
197
  margin-inline: 0;
@@ -199,22 +199,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
199
199
  padding-inline: 0;
200
200
  position: relative;
201
201
  }
202
- .awsui_treeitem_1agpu_1hpjs_185.awsui_offset_1agpu_1hpjs_202:not(#\9) {
202
+ .awsui_treeitem_1agpu_601dz_185.awsui_offset_1agpu_601dz_202:not(#\9) {
203
203
  margin-inline-start: 28px;
204
204
  }
205
- .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205:not(#\9) {
205
+ .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205:not(#\9) {
206
206
  display: grid;
207
207
  grid-template-columns: 28px 1fr;
208
208
  align-items: baseline;
209
209
  }
210
- body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_1hpjs_210:focus) {
210
+ body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_601dz_210:focus) {
211
211
  position: relative;
212
212
  }
213
- body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_1hpjs_210:focus) {
213
+ body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_601dz_210:focus) {
214
214
  outline: 2px dotted transparent;
215
215
  outline-offset: calc(0px - 1px);
216
216
  }
217
- body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_1hpjs_210:focus)::before {
217
+ body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205:not(#\9):has(.awsui_tree-item-focus-target_1agpu_601dz_210:focus)::before {
218
218
  content: " ";
219
219
  display: block;
220
220
  position: absolute;
@@ -228,24 +228,28 @@ body[data-awsui-focus-visible=true] .awsui_treeitem_1agpu_1hpjs_185 > .awsui_tre
228
228
  border-end-end-radius: var(--border-radius-control-default-focus-ring-9xsko1, 2px);
229
229
  box-shadow: 0 0 0 2px var(--color-border-item-focused-r5f6xl, #0073bb);
230
230
  }
231
- .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205 > .awsui_expand-toggle-wrapper_1agpu_1hpjs_231:not(#\9) {
231
+ .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205 > .awsui_expand-toggle-wrapper_1agpu_601dz_231:not(#\9) {
232
+ display: grid;
232
233
  grid-column: 1;
233
234
  grid-row: 1;
234
235
  padding-inline-end: var(--space-scaled-xxs-jatbiv, 4px);
235
236
  }
236
- .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205 > .awsui_expand-toggle-wrapper_1agpu_1hpjs_231 > .awsui_toggle_1agpu_1hpjs_236:not(#\9) {
237
+ .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205 > .awsui_expand-toggle-wrapper_1agpu_601dz_231 > .awsui_toggle_1agpu_601dz_237:not(#\9) {
237
238
  justify-self: center;
238
239
  position: relative;
239
240
  inset-block-start: 2px;
240
241
  }
241
- .awsui_treeitem_1agpu_1hpjs_185 > .awsui_treeitem-content-wrapper_1agpu_1hpjs_205 > .awsui_structured-item-wrapper_1agpu_1hpjs_241:not(#\9) {
242
+ .awsui_treeitem_1agpu_601dz_185 > .awsui_treeitem-content-wrapper_1agpu_601dz_205 > .awsui_structured-item-wrapper_1agpu_601dz_242:not(#\9) {
242
243
  grid-column: 2;
243
244
  grid-row: 1/span 2;
244
245
  padding-block: var(--space-scaled-xxs-jatbiv, 4px);
245
246
  position: relative;
246
247
  }
247
248
 
248
- .awsui_tree-item-structured-item_1agpu_1hpjs_248:not(#\9),
249
- .awsui_tree-item-focus-target_1agpu_1hpjs_210:not(#\9) {
249
+ .awsui_tree-item-structured-item_1agpu_601dz_249:not(#\9) {
250
250
  /* used in keyboard navigation */
251
+ }
252
+
253
+ .awsui_tree-item-focus-target_1agpu_601dz_210:not(#\9) {
254
+ outline: none;
251
255
  }
@@ -2,14 +2,14 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "treeitem-group": "awsui_treeitem-group_1agpu_1hpjs_185",
6
- "treeitem": "awsui_treeitem_1agpu_1hpjs_185",
7
- "offset": "awsui_offset_1agpu_1hpjs_202",
8
- "treeitem-content-wrapper": "awsui_treeitem-content-wrapper_1agpu_1hpjs_205",
9
- "tree-item-focus-target": "awsui_tree-item-focus-target_1agpu_1hpjs_210",
10
- "expand-toggle-wrapper": "awsui_expand-toggle-wrapper_1agpu_1hpjs_231",
11
- "toggle": "awsui_toggle_1agpu_1hpjs_236",
12
- "structured-item-wrapper": "awsui_structured-item-wrapper_1agpu_1hpjs_241",
13
- "tree-item-structured-item": "awsui_tree-item-structured-item_1agpu_1hpjs_248"
5
+ "treeitem-group": "awsui_treeitem-group_1agpu_601dz_185",
6
+ "treeitem": "awsui_treeitem_1agpu_601dz_185",
7
+ "offset": "awsui_offset_1agpu_601dz_202",
8
+ "treeitem-content-wrapper": "awsui_treeitem-content-wrapper_1agpu_601dz_205",
9
+ "tree-item-focus-target": "awsui_tree-item-focus-target_1agpu_601dz_210",
10
+ "expand-toggle-wrapper": "awsui_expand-toggle-wrapper_1agpu_601dz_231",
11
+ "toggle": "awsui_toggle_1agpu_601dz_237",
12
+ "structured-item-wrapper": "awsui_structured-item-wrapper_1agpu_601dz_242",
13
+ "tree-item-structured-item": "awsui_tree-item-structured-item_1agpu_601dz_249"
14
14
  };
15
15
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloudscape-design/components-themeable",
3
- "version": "3.0.1139",
3
+ "version": "3.0.1141",
4
4
  "files": [
5
5
  "lib"
6
6
  ],
@@ -1,14 +0,0 @@
1
- import React from 'react';
2
- import { NonCancelableEventHandler } from '../internal/events';
3
- import { RadioGroupProps } from './interfaces';
4
- interface RadioButtonProps extends RadioGroupProps.RadioButtonDefinition {
5
- name: string;
6
- checked: boolean;
7
- onChange?: NonCancelableEventHandler<RadioGroupProps.ChangeDetail>;
8
- readOnly?: boolean;
9
- className?: string;
10
- style?: RadioGroupProps.Style;
11
- }
12
- declare const _default: React.ForwardRefExoticComponent<RadioButtonProps & React.RefAttributes<HTMLInputElement>>;
13
- export default _default;
14
- //# sourceMappingURL=radio-button.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"radio-button.d.ts","sourceRoot":"","sources":["../../../src/radio-group/radio-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAQtC,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AACvF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAK/C,UAAU,gBAAiB,SAAQ,eAAe,CAAC,qBAAqB;IACtE,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC;CAC/B;;AAED,wBAoFG"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"radio-button.js","sourceRoot":"","sources":["../../../src/radio-group/radio-button.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 AbstractSwitch from '../internal/components/abstract-switch';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { RadioGroupProps } from './interfaces';\nimport { getAbstractSwitchStyles, getInnerCircleStyle, getOuterCircleStyle } from './style';\n\nimport styles from './styles.css.js';\n\ninterface RadioButtonProps extends RadioGroupProps.RadioButtonDefinition {\n name: string;\n checked: boolean;\n onChange?: NonCancelableEventHandler<RadioGroupProps.ChangeDetail>;\n readOnly?: boolean;\n className?: string;\n style?: RadioGroupProps.Style;\n}\n\nexport default React.forwardRef(function RadioButton(\n {\n name,\n label,\n value,\n checked,\n description,\n disabled,\n controlId,\n onChange,\n readOnly,\n className,\n style,\n ...rest\n }: RadioButtonProps,\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\n return (\n <AbstractSwitch\n className={clsx(styles.radio, description && styles['radio--has-description'], className)}\n controlClassName={styles['radio-control']}\n outlineClassName={styles.outline}\n label={label}\n description={description}\n disabled={disabled}\n readOnly={readOnly}\n controlId={controlId}\n style={getAbstractSwitchStyles(style, checked, disabled, readOnly)}\n {...copyAnalyticsMetadataAttribute(rest)}\n nativeControl={nativeControlProps => (\n <input\n {...nativeControlProps}\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 return;\n }\n fireNonCancelableEvent(onChange, { value });\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"]}