@cloudscape-design/components 3.0.1135 → 3.0.1137

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 (40) hide show
  1. package/button-dropdown/interfaces.d.ts +11 -2
  2. package/button-dropdown/interfaces.d.ts.map +1 -1
  3. package/button-dropdown/interfaces.js.map +1 -1
  4. package/button-dropdown/item-element/index.d.ts.map +1 -1
  5. package/button-dropdown/item-element/index.js +10 -5
  6. package/button-dropdown/item-element/index.js.map +1 -1
  7. package/button-dropdown/item-element/styles.css.js +20 -16
  8. package/button-dropdown/item-element/styles.scoped.css +57 -24
  9. package/button-dropdown/item-element/styles.selectors.js +20 -16
  10. package/internal/base-component/styles.scoped.css +1 -1
  11. package/internal/components/option/utils/unflatten-options.js +1 -1
  12. package/internal/components/option/utils/unflatten-options.js.map +1 -1
  13. package/internal/components/selectable-item/styles.css.js +22 -22
  14. package/internal/components/selectable-item/styles.scoped.css +42 -74
  15. package/internal/components/selectable-item/styles.selectors.js +22 -22
  16. package/internal/environment.js +2 -2
  17. package/internal/environment.json +2 -2
  18. package/internal/manifest.json +1 -1
  19. package/internal/plugins/widget/index.d.ts.map +1 -1
  20. package/internal/plugins/widget/index.js +8 -1
  21. package/internal/plugins/widget/index.js.map +1 -1
  22. package/package.json +1 -1
  23. package/radio-group/index.d.ts.map +1 -1
  24. package/radio-group/interfaces.d.ts +5 -0
  25. package/radio-group/interfaces.d.ts.map +1 -1
  26. package/radio-group/interfaces.js.map +1 -1
  27. package/radio-group/internal-do-not-use-core.js +4 -1
  28. package/radio-group/internal-do-not-use-core.js.map +1 -1
  29. package/radio-group/internal.d.ts.map +1 -1
  30. package/radio-group/internal.js +3 -3
  31. package/radio-group/internal.js.map +1 -1
  32. package/radio-group/styles.css.js +5 -3
  33. package/radio-group/styles.scoped.css +15 -3
  34. package/radio-group/styles.selectors.js +5 -3
  35. package/select/parts/virtual-list.d.ts.map +1 -1
  36. package/select/parts/virtual-list.js +1 -4
  37. package/select/parts/virtual-list.js.map +1 -1
  38. package/select/utils/render-options.d.ts.map +1 -1
  39. package/select/utils/render-options.js +1 -4
  40. package/select/utils/render-options.js.map +1 -1
@@ -1,8 +1,10 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "radio-group": "awsui_radio-group_1mabk_188d6_145",
5
- "radio": "awsui_radio_1mabk_188d6_145",
6
- "radio--has-description": "awsui_radio--has-description_1mabk_188d6_182"
4
+ "radio-group": "awsui_radio-group_1mabk_ye5o0_145",
5
+ "horizontal-group": "awsui_horizontal-group_1mabk_ye5o0_176",
6
+ "radio": "awsui_radio_1mabk_ye5o0_145",
7
+ "horizontal": "awsui_horizontal_1mabk_ye5o0_176",
8
+ "radio--has-description": "awsui_radio--has-description_1mabk_ye5o0_190"
7
9
  };
8
10
 
@@ -142,7 +142,7 @@
142
142
  */
143
143
  /* Style used for links in slots/components that are text heavy, to help links stand out among
144
144
  surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
145
- .awsui_radio-group_1mabk_188d6_145:not(#\9) {
145
+ .awsui_radio-group_1mabk_ye5o0_145:not(#\9) {
146
146
  border-collapse: separate;
147
147
  border-spacing: 0;
148
148
  box-sizing: border-box;
@@ -172,13 +172,25 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
172
172
  font-family: var(--font-family-base-gmnpzl, "Open Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
173
173
  -webkit-font-smoothing: auto;
174
174
  -moz-osx-font-smoothing: auto;
175
+ }
176
+ .awsui_radio-group_1mabk_ye5o0_145:not(#\9):not(.awsui_horizontal-group_1mabk_ye5o0_176) {
175
177
  display: block;
176
178
  }
179
+ .awsui_radio-group_1mabk_ye5o0_145.awsui_horizontal-group_1mabk_ye5o0_176:not(#\9) {
180
+ display: flex;
181
+ align-items: start;
182
+ flex-wrap: wrap;
183
+ gap: var(--space-scaled-l-sej05l, 20px);
184
+ }
177
185
 
178
- .awsui_radio_1mabk_188d6_145 + .awsui_radio_1mabk_188d6_145:not(#\9) {
186
+ .awsui_radio_1mabk_ye5o0_145 + .awsui_radio_1mabk_ye5o0_145:not(#\9):not(.awsui_horizontal_1mabk_ye5o0_176) {
179
187
  margin-block-start: var(--space-scaled-xxs-pfm1nx, 4px);
180
188
  }
181
189
 
182
- .awsui_radio--has-description_1mabk_188d6_182 + .awsui_radio_1mabk_188d6_145:not(#\9) {
190
+ .awsui_radio--has-description_1mabk_ye5o0_190 + .awsui_radio_1mabk_ye5o0_145:not(#\9):not(.awsui_horizontal_1mabk_ye5o0_176) {
183
191
  margin-block-start: var(--space-scaled-xs-xwoogq, 8px);
192
+ }
193
+
194
+ .awsui_radio_1mabk_ye5o0_145.awsui_horizontal_1mabk_ye5o0_176:not(#\9) {
195
+ max-inline-size: calc(16 * var(--space-scaled-xxl-6wgq96, 32px));
184
196
  }
@@ -2,8 +2,10 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "radio-group": "awsui_radio-group_1mabk_188d6_145",
6
- "radio": "awsui_radio_1mabk_188d6_145",
7
- "radio--has-description": "awsui_radio--has-description_1mabk_188d6_182"
5
+ "radio-group": "awsui_radio-group_1mabk_ye5o0_145",
6
+ "horizontal-group": "awsui_horizontal-group_1mabk_ye5o0_176",
7
+ "radio": "awsui_radio_1mabk_ye5o0_145",
8
+ "horizontal": "awsui_horizontal_1mabk_ye5o0_176",
9
+ "radio--has-description": "awsui_radio--has-description_1mabk_ye5o0_190"
8
10
  };
9
11
 
@@ -1 +1 @@
1
- {"version":3,"file":"virtual-list.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAUpF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;;AAgI/C,wBAAuC"}
1
+ {"version":3,"file":"virtual-list.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAUpF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;;AA4H/C,wBAAuC"}
@@ -67,12 +67,9 @@ const VirtualListOpen = forwardRef(({ menuProps, getOptionProps, filteredOptions
67
67
  firstOptionSticky,
68
68
  withScrollbar,
69
69
  });
70
- // Adjust totalSize to account for 1px overlap per item (matching the position adjustment in renderOptions)
71
- const overlapAdjustment = filteredOptions.length;
72
- const adjustedTotalSize = totalSize - overlapAdjustment;
73
70
  return (React.createElement(OptionsList, { ...menuProps, stickyItemBlockSize: stickySize, ref: menuRef },
74
71
  finalOptions,
75
- React.createElement("div", { "aria-hidden": "true", key: "total-size", className: styles['layout-strut'], style: { height: adjustedTotalSize - stickySize } }),
72
+ React.createElement("div", { "aria-hidden": "true", key: "total-size", className: styles['layout-strut'], style: { height: totalSize - stickySize } }),
76
73
  listBottom ? (React.createElement("div", { role: "option", className: styles['list-bottom'] }, listBottom)) : null));
77
74
  });
78
75
  const VirtualListClosed = forwardRef(({ menuProps, listBottom }, ref) => {
@@ -1 +1 @@
1
- {"version":3,"file":"virtual-list.js","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.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, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport OptionsList from '../../internal/components/options-list';\nimport { useVirtual } from '../../internal/hooks/use-virtual';\nimport { renderOptions } from '../utils/render-options';\nimport customScrollToIndex from '../utils/scroll-to-index';\nimport { fallbackItemHeight } from './common';\nimport { SelectListProps } from './plain-list';\n\nimport styles from './styles.css.js';\n\nconst VirtualList = (props: SelectListProps, ref: React.Ref<SelectListProps.SelectListRef>) => {\n return props.menuProps.open ? <VirtualListOpen {...props} ref={ref} /> : <VirtualListClosed {...props} ref={ref} />;\n};\n\nconst VirtualListOpen = forwardRef(\n (\n {\n menuProps,\n getOptionProps,\n filteredOptions,\n filteringValue,\n highlightType,\n checkboxes,\n hasDropdownStatus,\n listBottom,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n }: SelectListProps,\n ref: React.Ref<SelectListProps.SelectListRef>\n ) => {\n // update component, when it gets wider or narrower to reposition items\n const [width, menuMeasureRef] = useContainerQuery(\n rect => ({ inner: rect.contentBoxWidth, outer: rect.borderBoxWidth }),\n []\n );\n const menuRefObject = useRef(null);\n const menuRef = useMergeRefs(menuMeasureRef, menuRefObject, menuProps.ref);\n const previousHighlightedIndex = useRef<number>();\n const { virtualItems, totalSize, scrollToIndex } = useVirtual({\n items: filteredOptions,\n parentRef: menuRefObject,\n // estimateSize is a dependency of measurements memo. We update it to force full recalculation\n // when the height of any option could have changed:\n // 1: because the component got resized (width property got updated)\n // 2: because the option changed its content (filteringValue property controls the highlight and the visibility of hidden tags)\n // eslint-disable-next-line react-hooks/exhaustive-deps\n estimateSize: useCallback(() => fallbackItemHeight, [width?.inner, filteringValue]),\n firstItemSticky: firstOptionSticky,\n });\n\n useImperativeHandle(\n ref,\n () => (index: number) => {\n if (highlightType.moveFocus) {\n const movingUp = previousHighlightedIndex.current !== undefined && index < previousHighlightedIndex.current;\n if (firstOptionSticky && movingUp && index !== 0 && menuRefObject.current) {\n // React-Virtual v2 does not offer a proper way to handle sticky elements when scrolling,\n // so until we upgrade to v3, use our own scroll implementation\n // to prevent newly highlighted element from being covered by the sticky element\n // when moving the highlight upwards in the list.\n\n // Scrolling behavior is covered by integration tests.\n // istanbul ignore next\n customScrollToIndex({\n index,\n menuEl: menuRefObject?.current,\n });\n } else {\n scrollToIndex(index);\n }\n }\n previousHighlightedIndex.current = index;\n },\n [firstOptionSticky, highlightType.moveFocus, scrollToIndex]\n );\n\n const stickySize = firstOptionSticky ? virtualItems[0].size : 0;\n const withScrollbar = !!width && width.inner < width.outer;\n\n const idPrefix = useUniqueId('select-list-');\n const finalOptions = renderOptions({\n options: virtualItems.map(({ index }) => filteredOptions[index]),\n getOptionProps,\n filteringValue,\n highlightType,\n idPrefix,\n checkboxes,\n hasDropdownStatus,\n virtualItems,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n withScrollbar,\n });\n\n // Adjust totalSize to account for 1px overlap per item (matching the position adjustment in renderOptions)\n const overlapAdjustment = filteredOptions.length;\n const adjustedTotalSize = totalSize - overlapAdjustment;\n\n return (\n <OptionsList {...menuProps} stickyItemBlockSize={stickySize} ref={menuRef}>\n {finalOptions}\n <div\n aria-hidden=\"true\"\n key=\"total-size\"\n className={styles['layout-strut']}\n style={{ height: adjustedTotalSize - stickySize }}\n />\n {listBottom ? (\n <div role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </div>\n ) : null}\n </OptionsList>\n );\n }\n);\n\nconst VirtualListClosed = forwardRef(\n ({ menuProps, listBottom }: SelectListProps, ref: React.Ref<SelectListProps.SelectListRef>) => {\n useImperativeHandle(ref, () => () => {}, []);\n return (\n <OptionsList {...menuProps} ref={menuProps.ref}>\n {listBottom ? (\n <div role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </div>\n ) : null}\n </OptionsList>\n );\n }\n);\n\nexport default forwardRef(VirtualList);\n"]}
1
+ {"version":3,"file":"virtual-list.js","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.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, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport OptionsList from '../../internal/components/options-list';\nimport { useVirtual } from '../../internal/hooks/use-virtual';\nimport { renderOptions } from '../utils/render-options';\nimport customScrollToIndex from '../utils/scroll-to-index';\nimport { fallbackItemHeight } from './common';\nimport { SelectListProps } from './plain-list';\n\nimport styles from './styles.css.js';\n\nconst VirtualList = (props: SelectListProps, ref: React.Ref<SelectListProps.SelectListRef>) => {\n return props.menuProps.open ? <VirtualListOpen {...props} ref={ref} /> : <VirtualListClosed {...props} ref={ref} />;\n};\n\nconst VirtualListOpen = forwardRef(\n (\n {\n menuProps,\n getOptionProps,\n filteredOptions,\n filteringValue,\n highlightType,\n checkboxes,\n hasDropdownStatus,\n listBottom,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n }: SelectListProps,\n ref: React.Ref<SelectListProps.SelectListRef>\n ) => {\n // update component, when it gets wider or narrower to reposition items\n const [width, menuMeasureRef] = useContainerQuery(\n rect => ({ inner: rect.contentBoxWidth, outer: rect.borderBoxWidth }),\n []\n );\n const menuRefObject = useRef(null);\n const menuRef = useMergeRefs(menuMeasureRef, menuRefObject, menuProps.ref);\n const previousHighlightedIndex = useRef<number>();\n const { virtualItems, totalSize, scrollToIndex } = useVirtual({\n items: filteredOptions,\n parentRef: menuRefObject,\n // estimateSize is a dependency of measurements memo. We update it to force full recalculation\n // when the height of any option could have changed:\n // 1: because the component got resized (width property got updated)\n // 2: because the option changed its content (filteringValue property controls the highlight and the visibility of hidden tags)\n // eslint-disable-next-line react-hooks/exhaustive-deps\n estimateSize: useCallback(() => fallbackItemHeight, [width?.inner, filteringValue]),\n firstItemSticky: firstOptionSticky,\n });\n\n useImperativeHandle(\n ref,\n () => (index: number) => {\n if (highlightType.moveFocus) {\n const movingUp = previousHighlightedIndex.current !== undefined && index < previousHighlightedIndex.current;\n if (firstOptionSticky && movingUp && index !== 0 && menuRefObject.current) {\n // React-Virtual v2 does not offer a proper way to handle sticky elements when scrolling,\n // so until we upgrade to v3, use our own scroll implementation\n // to prevent newly highlighted element from being covered by the sticky element\n // when moving the highlight upwards in the list.\n\n // Scrolling behavior is covered by integration tests.\n // istanbul ignore next\n customScrollToIndex({\n index,\n menuEl: menuRefObject?.current,\n });\n } else {\n scrollToIndex(index);\n }\n }\n previousHighlightedIndex.current = index;\n },\n [firstOptionSticky, highlightType.moveFocus, scrollToIndex]\n );\n\n const stickySize = firstOptionSticky ? virtualItems[0].size : 0;\n const withScrollbar = !!width && width.inner < width.outer;\n\n const idPrefix = useUniqueId('select-list-');\n const finalOptions = renderOptions({\n options: virtualItems.map(({ index }) => filteredOptions[index]),\n getOptionProps,\n filteringValue,\n highlightType,\n idPrefix,\n checkboxes,\n hasDropdownStatus,\n virtualItems,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n withScrollbar,\n });\n\n return (\n <OptionsList {...menuProps} stickyItemBlockSize={stickySize} ref={menuRef}>\n {finalOptions}\n <div\n aria-hidden=\"true\"\n key=\"total-size\"\n className={styles['layout-strut']}\n style={{ height: totalSize - stickySize }}\n />\n {listBottom ? (\n <div role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </div>\n ) : null}\n </OptionsList>\n );\n }\n);\n\nconst VirtualListClosed = forwardRef(\n ({ menuProps, listBottom }: SelectListProps, ref: React.Ref<SelectListProps.SelectListRef>) => {\n useImperativeHandle(ref, () => () => {}, []);\n return (\n <OptionsList {...menuProps} ref={menuProps.ref}>\n {listBottom ? (\n <div role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </div>\n ) : null}\n </OptionsList>\n );\n }\n);\n\nexport default forwardRef(VirtualList);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"render-options.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/render-options.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAE7E,OAAO,EAAE,aAAa,EAAE,MAAM,mEAAmE,CAAC;AAClG,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAMlE,UAAU,iBAAiB;IACzB,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,cAAc,EAAE,GAAG,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CAC7C;AAED,eAAO,MAAM,aAAa,GAAI,+NAe3B,iBAAiB,kBAoEnB,CAAC"}
1
+ {"version":3,"file":"render-options.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/render-options.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAE7E,OAAO,EAAE,aAAa,EAAE,MAAM,mEAAmE,CAAC;AAClG,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAMlE,UAAU,iBAAiB;IACzB,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,cAAc,EAAE,GAAG,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CAC7C;AAED,eAAO,MAAM,aAAa,GAAI,+NAe3B,iBAAiB,kBAgEnB,CAAC"}
@@ -25,10 +25,7 @@ export const renderOptions = ({ options, getOptionProps, filteringValue, highlig
25
25
  const padBottom = !hasDropdownStatus && isLastItem;
26
26
  const ListItem = useInteractiveGroups ? MultiselectItem : Item;
27
27
  const isSticky = firstOptionSticky && globalIndex === 0;
28
- // Adjust virtual position to create 1px overlap between items (matching non-virtual behavior)
29
- // Subtract globalIndex to shift each item up by 1px per item
30
- const adjustedVirtualPosition = virtualItem ? virtualItem.start - globalIndex : undefined;
31
- return (React.createElement(ListItem, { key: globalIndex, ...props, virtualPosition: adjustedVirtualPosition, ref: isSticky && stickyOptionRef ? stickyOptionRef : virtualItem && virtualItem.measureRef, padBottom: padBottom, screenReaderContent: screenReaderContent, ariaPosinset: globalIndex + 1, ariaSetsize: ariaSetsize, highlightType: highlightType.type, withScrollbar: withScrollbar, sticky: isSticky }));
28
+ return (React.createElement(ListItem, { key: globalIndex, ...props, virtualPosition: virtualItem && virtualItem.start, ref: isSticky && stickyOptionRef ? stickyOptionRef : virtualItem && virtualItem.measureRef, padBottom: padBottom, screenReaderContent: screenReaderContent, ariaPosinset: globalIndex + 1, ariaSetsize: ariaSetsize, highlightType: highlightType.type, withScrollbar: withScrollbar, sticky: isSticky }));
32
29
  };
33
30
  const unflattenedOptions = unflattenOptions(options);
34
31
  return unflattenedOptions.map(nestedDropdownOption => {
@@ -1 +1 @@
1
- {"version":3,"file":"render-options.js","sourceRoot":"","sources":["../../../../src/select/utils/render-options.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';\n\nimport { DropdownOption } from '../../internal/components/option/interfaces';\nimport { NestedDropdownOption, unflattenOptions } from '../../internal/components/option/utils/unflatten-options';\nimport { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { VirtualItem } from '../../internal/vendor/react-virtual';\nimport Item from '../parts/item';\nimport MultiselectItem from '../parts/multiselect-item';\nimport OptionGroup from '../parts/option-group';\nimport { getItemProps } from './get-item-props';\n\ninterface RenderOptionProps {\n options: ReadonlyArray<DropdownOption>;\n getOptionProps: any;\n filteringValue: string;\n highlightType: HighlightType;\n idPrefix: string;\n checkboxes?: boolean;\n hasDropdownStatus?: boolean;\n virtualItems?: VirtualItem[];\n useInteractiveGroups?: boolean;\n screenReaderContent?: string;\n ariaSetsize?: number;\n withScrollbar: boolean;\n firstOptionSticky?: boolean;\n stickyOptionRef?: React.Ref<HTMLDivElement>;\n}\n\nexport const renderOptions = ({\n options,\n getOptionProps,\n filteringValue,\n highlightType,\n idPrefix,\n checkboxes = false,\n hasDropdownStatus,\n virtualItems,\n useInteractiveGroups,\n screenReaderContent,\n ariaSetsize,\n withScrollbar,\n firstOptionSticky,\n stickyOptionRef,\n}: RenderOptionProps) => {\n const getNestedItemProps = ({ index, option }: NestedDropdownOption) => {\n const virtualItem = virtualItems && virtualItems[index];\n const globalIndex = virtualItem ? virtualItem.index : index;\n return getItemProps({\n option,\n index: globalIndex,\n getOptionProps,\n filteringValue: option.type === 'select-all' ? '' : filteringValue,\n checkboxes,\n });\n };\n\n const renderListItem = (props: any, index: number) => {\n const virtualItem = virtualItems && virtualItems[index];\n const globalIndex = virtualItem ? virtualItem.index : index;\n\n const isLastItem = index === options.length - 1;\n const padBottom = !hasDropdownStatus && isLastItem;\n const ListItem = useInteractiveGroups ? MultiselectItem : Item;\n const isSticky = firstOptionSticky && globalIndex === 0;\n\n // Adjust virtual position to create 1px overlap between items (matching non-virtual behavior)\n // Subtract globalIndex to shift each item up by 1px per item\n const adjustedVirtualPosition = virtualItem ? virtualItem.start - globalIndex : undefined;\n\n return (\n <ListItem\n key={globalIndex}\n {...props}\n virtualPosition={adjustedVirtualPosition}\n ref={isSticky && stickyOptionRef ? stickyOptionRef : virtualItem && virtualItem.measureRef}\n padBottom={padBottom}\n screenReaderContent={screenReaderContent}\n ariaPosinset={globalIndex + 1}\n ariaSetsize={ariaSetsize}\n highlightType={highlightType.type}\n withScrollbar={withScrollbar}\n sticky={isSticky}\n />\n );\n };\n\n const unflattenedOptions = unflattenOptions(options);\n return unflattenedOptions.map(nestedDropdownOption => {\n const index = nestedDropdownOption.index;\n const props = getNestedItemProps(nestedDropdownOption);\n\n if (nestedDropdownOption.type === 'parent') {\n const { children } = nestedDropdownOption;\n const optionId = props.id ?? `${idPrefix}-option-${index}`;\n return (\n <OptionGroup\n key={index}\n virtual={virtualItems?.[index] !== undefined}\n ariaLabelledby={optionId}\n ariaDisabled={props['aria-disabled']}\n >\n {renderListItem(props, index)}\n {children.map(child => (\n <React.Fragment key={child.index}>{renderListItem(getNestedItemProps(child), child.index)}</React.Fragment>\n ))}\n </OptionGroup>\n );\n }\n\n return renderListItem(props, index);\n });\n};\n"]}
1
+ {"version":3,"file":"render-options.js","sourceRoot":"","sources":["../../../../src/select/utils/render-options.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';\n\nimport { DropdownOption } from '../../internal/components/option/interfaces';\nimport { NestedDropdownOption, unflattenOptions } from '../../internal/components/option/utils/unflatten-options';\nimport { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { VirtualItem } from '../../internal/vendor/react-virtual';\nimport Item from '../parts/item';\nimport MultiselectItem from '../parts/multiselect-item';\nimport OptionGroup from '../parts/option-group';\nimport { getItemProps } from './get-item-props';\n\ninterface RenderOptionProps {\n options: ReadonlyArray<DropdownOption>;\n getOptionProps: any;\n filteringValue: string;\n highlightType: HighlightType;\n idPrefix: string;\n checkboxes?: boolean;\n hasDropdownStatus?: boolean;\n virtualItems?: VirtualItem[];\n useInteractiveGroups?: boolean;\n screenReaderContent?: string;\n ariaSetsize?: number;\n withScrollbar: boolean;\n firstOptionSticky?: boolean;\n stickyOptionRef?: React.Ref<HTMLDivElement>;\n}\n\nexport const renderOptions = ({\n options,\n getOptionProps,\n filteringValue,\n highlightType,\n idPrefix,\n checkboxes = false,\n hasDropdownStatus,\n virtualItems,\n useInteractiveGroups,\n screenReaderContent,\n ariaSetsize,\n withScrollbar,\n firstOptionSticky,\n stickyOptionRef,\n}: RenderOptionProps) => {\n const getNestedItemProps = ({ index, option }: NestedDropdownOption) => {\n const virtualItem = virtualItems && virtualItems[index];\n const globalIndex = virtualItem ? virtualItem.index : index;\n return getItemProps({\n option,\n index: globalIndex,\n getOptionProps,\n filteringValue: option.type === 'select-all' ? '' : filteringValue,\n checkboxes,\n });\n };\n\n const renderListItem = (props: any, index: number) => {\n const virtualItem = virtualItems && virtualItems[index];\n const globalIndex = virtualItem ? virtualItem.index : index;\n\n const isLastItem = index === options.length - 1;\n const padBottom = !hasDropdownStatus && isLastItem;\n const ListItem = useInteractiveGroups ? MultiselectItem : Item;\n const isSticky = firstOptionSticky && globalIndex === 0;\n\n return (\n <ListItem\n key={globalIndex}\n {...props}\n virtualPosition={virtualItem && virtualItem.start}\n ref={isSticky && stickyOptionRef ? stickyOptionRef : virtualItem && virtualItem.measureRef}\n padBottom={padBottom}\n screenReaderContent={screenReaderContent}\n ariaPosinset={globalIndex + 1}\n ariaSetsize={ariaSetsize}\n highlightType={highlightType.type}\n withScrollbar={withScrollbar}\n sticky={isSticky}\n />\n );\n };\n\n const unflattenedOptions = unflattenOptions(options);\n return unflattenedOptions.map(nestedDropdownOption => {\n const index = nestedDropdownOption.index;\n const props = getNestedItemProps(nestedDropdownOption);\n\n if (nestedDropdownOption.type === 'parent') {\n const { children } = nestedDropdownOption;\n const optionId = props.id ?? `${idPrefix}-option-${index}`;\n return (\n <OptionGroup\n key={index}\n virtual={virtualItems?.[index] !== undefined}\n ariaLabelledby={optionId}\n ariaDisabled={props['aria-disabled']}\n >\n {renderListItem(props, index)}\n {children.map(child => (\n <React.Fragment key={child.index}>{renderListItem(getNestedItemProps(child), child.index)}</React.Fragment>\n ))}\n </OptionGroup>\n );\n }\n\n return renderListItem(props, index);\n });\n};\n"]}