@cloudscape-design/components-themeable 3.0.1125 → 3.0.1127

package/lib/internal/template/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_bzyg7_145:not(#\9) {
+.awsui_root_1mabk_1avid_145:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -175,19 +175,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   display: block;
 }
 
-.awsui_radio_1mabk_bzyg7_178:not(#\9) {
+.awsui_radio_1mabk_1avid_178:not(#\9) {
   /*used in test-utils*/
 }
 
-.awsui_radio_1mabk_bzyg7_178 + .awsui_radio_1mabk_bzyg7_178:not(#\9) {
+.awsui_radio_1mabk_1avid_178 + .awsui_radio_1mabk_1avid_178:not(#\9) {
   margin-block-start: var(--space-scaled-xxs-jatbiv, 4px);
 }
 
-.awsui_radio--has-description_1mabk_bzyg7_186 + .awsui_radio_1mabk_bzyg7_178:not(#\9) {
+.awsui_radio--has-description_1mabk_1avid_186 + .awsui_radio_1mabk_1avid_178:not(#\9) {
   margin-block-start: var(--space-scaled-xs-sppte9, 8px);
 }
 
-.awsui_radio-control_1mabk_bzyg7_190:not(#\9) {
+.awsui_radio-control_1mabk_1avid_190:not(#\9) {
   margin-block-start: calc((var(--line-height-body-m-bedeoh, 22px) - var(--size-control-lkpwjy, 14px)) / 2);
   min-block-size: var(--size-control-lkpwjy, 14px);
   min-inline-size: var(--size-control-lkpwjy, 14px);
@@ -195,15 +195,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inline-size: var(--size-control-lkpwjy, 14px);
 }
 
-.awsui_outline_1mabk_bzyg7_198:not(#\9) {
-  --awsui-style-focus-ring-box-shadow-vl73au: 0 0 0 var(--awsui-style-focus-ring-border-width-vl73au, 2px) var(--awsui-style-focus-ring-border-color-vl73au, var(--color-border-item-focused-r5f6xl, #0073bb));
+.awsui_outline_1mabk_1avid_198:not(#\9) {
+  --awsui-style-focus-ring-box-shadow-lqnbqg: 0 0 0 var(--awsui-style-focus-ring-border-width-lqnbqg, 2px) var(--awsui-style-focus-ring-border-color-lqnbqg, var(--color-border-item-focused-r5f6xl, #0073bb));
   position: relative;
 }
-.awsui_outline_1mabk_bzyg7_198:not(#\9) {
+.awsui_outline_1mabk_1avid_198:not(#\9) {
   outline: 2px dotted transparent;
   outline-offset: calc(2px - 1px);
 }
-.awsui_outline_1mabk_bzyg7_198:not(#\9)::before {
+.awsui_outline_1mabk_1avid_198:not(#\9)::before {
   content: " ";
   display: block;
   position: absolute;
@@ -211,46 +211,46 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   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-vl73au, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
-  border-start-end-radius: var(--awsui-style-focus-ring-border-radius-vl73au, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
-  border-end-start-radius: var(--awsui-style-focus-ring-border-radius-vl73au, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
-  border-end-end-radius: var(--awsui-style-focus-ring-border-radius-vl73au, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
-  box-shadow: var(--awsui-style-focus-ring-box-shadow-vl73au);
+  border-start-start-radius: var(--awsui-style-focus-ring-border-radius-lqnbqg, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
+  border-start-end-radius: var(--awsui-style-focus-ring-border-radius-lqnbqg, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
+  border-end-start-radius: var(--awsui-style-focus-ring-border-radius-lqnbqg, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
+  border-end-end-radius: var(--awsui-style-focus-ring-border-radius-lqnbqg, var(--border-radius-control-circular-focus-ring-0v2apg, 50%));
+  box-shadow: var(--awsui-style-focus-ring-box-shadow-lqnbqg);
 }
 
-.awsui_styled-circle-border_1mabk_bzyg7_221:not(#\9) {
+.awsui_styled-circle-border_1mabk_1avid_221:not(#\9) {
   stroke: var(--color-border-control-default-e686ow, #687078);
   fill: var(--color-background-control-default-wjdczs, #ffffff);
 }
-.awsui_styled-circle-border_1mabk_bzyg7_221.awsui_styled-circle-disabled_1mabk_bzyg7_225:not(#\9), .awsui_styled-circle-border_1mabk_bzyg7_221.awsui_styled-circle-readonly_1mabk_bzyg7_225:not(#\9) {
+.awsui_styled-circle-border_1mabk_1avid_221.awsui_styled-circle-disabled_1mabk_1avid_225:not(#\9), .awsui_styled-circle-border_1mabk_1avid_221.awsui_styled-circle-readonly_1mabk_1avid_225:not(#\9) {
   fill: var(--color-background-control-disabled-2ixett, #d5dbdb);
   stroke: var(--color-background-control-disabled-2ixett, #d5dbdb);
 }
 
-.awsui_styled-circle-fill_1mabk_bzyg7_230:not(#\9) {
+.awsui_styled-circle-fill_1mabk_1avid_230:not(#\9) {
   stroke: var(--color-background-control-checked-se0x0e, #0073bb);
   fill: var(--color-foreground-control-default-rf7v4a, #ffffff);
   opacity: 0;
   transition: opacity var(--motion-duration-transition-quick-ucajl5, 90ms) var(--motion-easing-transition-quick-034duw, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_styled-circle-fill_1mabk_bzyg7_230:not(#\9) {
+  .awsui_styled-circle-fill_1mabk_1avid_230:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_styled-circle-fill_1mabk_bzyg7_230:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1mabk_bzyg7_230:not(#\9) {
+.awsui-motion-disabled .awsui_styled-circle-fill_1mabk_1avid_230:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1mabk_1avid_230:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_styled-circle-fill_1mabk_bzyg7_230.awsui_styled-circle-checked_1mabk_bzyg7_246:not(#\9) {
+.awsui_styled-circle-fill_1mabk_1avid_230.awsui_styled-circle-checked_1mabk_1avid_246:not(#\9) {
   opacity: 1;
 }
-.awsui_styled-circle-fill_1mabk_bzyg7_230.awsui_styled-circle-disabled_1mabk_bzyg7_225:not(#\9) {
+.awsui_styled-circle-fill_1mabk_1avid_230.awsui_styled-circle-disabled_1mabk_1avid_225:not(#\9) {
   fill: var(--color-foreground-control-disabled-kj751b, #ffffff);
   stroke: var(--color-background-control-disabled-2ixett, #d5dbdb);
 }
-.awsui_styled-circle-fill_1mabk_bzyg7_230.awsui_styled-circle-readonly_1mabk_bzyg7_225:not(#\9) {
+.awsui_styled-circle-fill_1mabk_1avid_230.awsui_styled-circle-readonly_1mabk_1avid_225:not(#\9) {
   fill: var(--color-foreground-control-read-only-cgy3yn, #687078);
   stroke: var(--color-background-control-disabled-2ixett, #d5dbdb);
 }

package/lib/internal/template/radio-group/styles.selectors.js

@@ -2,15 +2,15 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_1mabk_bzyg7_145",
-  "radio": "awsui_radio_1mabk_bzyg7_178",
-  "radio--has-description": "awsui_radio--has-description_1mabk_bzyg7_186",
-  "radio-control": "awsui_radio-control_1mabk_bzyg7_190",
-  "outline": "awsui_outline_1mabk_bzyg7_198",
-  "styled-circle-border": "awsui_styled-circle-border_1mabk_bzyg7_221",
-  "styled-circle-disabled": "awsui_styled-circle-disabled_1mabk_bzyg7_225",
-  "styled-circle-readonly": "awsui_styled-circle-readonly_1mabk_bzyg7_225",
-  "styled-circle-fill": "awsui_styled-circle-fill_1mabk_bzyg7_230",
-  "styled-circle-checked": "awsui_styled-circle-checked_1mabk_bzyg7_246"
+  "root": "awsui_root_1mabk_1avid_145",
+  "radio": "awsui_radio_1mabk_1avid_178",
+  "radio--has-description": "awsui_radio--has-description_1mabk_1avid_186",
+  "radio-control": "awsui_radio-control_1mabk_1avid_190",
+  "outline": "awsui_outline_1mabk_1avid_198",
+  "styled-circle-border": "awsui_styled-circle-border_1mabk_1avid_221",
+  "styled-circle-disabled": "awsui_styled-circle-disabled_1mabk_1avid_225",
+  "styled-circle-readonly": "awsui_styled-circle-readonly_1mabk_1avid_225",
+  "styled-circle-fill": "awsui_styled-circle-fill_1mabk_1avid_230",
+  "styled-circle-checked": "awsui_styled-circle-checked_1mabk_1avid_246"
 };
   

package/lib/internal/template/select/parts/virtual-list.d.ts.map

@@ -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;;AA4H/C,wBAAuC"}
+{"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"}

package/lib/internal/template/select/parts/virtual-list.js

@@ -67,9 +67,12 @@ const VirtualListOpen = forwardRef(({ menuProps, getOptionProps, filteredOptions
         firstOptionSticky,
         withScrollbar,
     });
+    // Adjust totalSize to account for 1px overlap per item (matching the position adjustment in renderOptions)
+    const overlapAdjustment = filteredOptions.length;
+    const adjustedTotalSize = totalSize - overlapAdjustment;
     return (React.createElement(OptionsList, Object.assign({}, menuProps, { stickyItemBlockSize: stickySize, ref: menuRef }),
         finalOptions,
-        React.createElement("div", { "aria-hidden": "true", key: "total-size", className: styles['layout-strut'], style: { height: totalSize - stickySize } }),
+        React.createElement("div", { "aria-hidden": "true", key: "total-size", className: styles['layout-strut'], style: { height: adjustedTotalSize - stickySize } }),
         listBottom ? (React.createElement("div", { role: "option", className: styles['list-bottom'] }, listBottom)) : null));
 });
 const VirtualListClosed = forwardRef(({ menuProps, listBottom }, ref) => {

package/lib/internal/template/select/parts/virtual-list.js.map

@@ -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    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"]}
+{"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"]}

package/lib/internal/template/select/utils/render-options.d.ts.map

@@ -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,kOAevB,iBAAiB,kBAgEnB,CAAC"}
+{"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,kOAevB,iBAAiB,kBAoEnB,CAAC"}

package/lib/internal/template/select/utils/render-options.js

@@ -25,7 +25,10 @@ export const renderOptions = ({ options, getOptionProps, filteringValue, highlig
         const padBottom = !hasDropdownStatus && isLastItem;
         const ListItem = useInteractiveGroups ? MultiselectItem : Item;
         const isSticky = firstOptionSticky && globalIndex === 0;
-        return (React.createElement(ListItem, Object.assign({ 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 })));
+        // Adjust virtual position to create 1px overlap between items (matching non-virtual behavior)
+        // Subtract globalIndex to shift each item up by 1px per item
+        const adjustedVirtualPosition = virtualItem ? virtualItem.start - globalIndex : undefined;
+        return (React.createElement(ListItem, Object.assign({ 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 })));
     };
     const unflattenedOptions = unflattenOptions(options);
     return unflattenedOptions.map(nestedDropdownOption => {

package/lib/internal/template/select/utils/render-options.js.map

@@ -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    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"]}
+{"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"]}

package/lib/internal/template/slider/styles.css.js

@@ -1,31 +1,31 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_pcgz5_1s8qe_153",
-  "slider": "awsui_slider_pcgz5_1s8qe_190",
-  "slider-track": "awsui_slider-track_pcgz5_1s8qe_194",
-  "slider-range": "awsui_slider-range_pcgz5_1s8qe_194",
-  "disabled": "awsui_disabled_pcgz5_1s8qe_209",
-  "readonly": "awsui_readonly_pcgz5_1s8qe_213",
-  "error": "awsui_error_pcgz5_1s8qe_222",
-  "warning": "awsui_warning_pcgz5_1s8qe_225",
-  "active": "awsui_active_pcgz5_1s8qe_228",
-  "error-active": "awsui_error-active_pcgz5_1s8qe_231",
-  "warning-active": "awsui_warning-active_pcgz5_1s8qe_234",
-  "labels": "awsui_labels_pcgz5_1s8qe_245",
-  "labels-noref": "awsui_labels-noref_pcgz5_1s8qe_251",
-  "labels-reference": "awsui_labels-reference_pcgz5_1s8qe_254",
-  "labels-min": "awsui_labels-min_pcgz5_1s8qe_261",
-  "labels-max": "awsui_labels-max_pcgz5_1s8qe_267",
-  "labels-aria-description": "awsui_labels-aria-description_pcgz5_1s8qe_275",
-  "ticks": "awsui_ticks_pcgz5_1s8qe_293",
-  "ticks-wrapper": "awsui_ticks-wrapper_pcgz5_1s8qe_299",
-  "tick": "awsui_tick_pcgz5_1s8qe_293",
-  "middle": "awsui_middle_pcgz5_1s8qe_314",
-  "filled": "awsui_filled_pcgz5_1s8qe_317",
-  "tooltip-thumb": "awsui_tooltip-thumb_pcgz5_1s8qe_345",
-  "thumb": "awsui_thumb_pcgz5_1s8qe_358",
-  "min": "awsui_min_pcgz5_1s8qe_394",
-  "max": "awsui_max_pcgz5_1s8qe_397"
+  "root": "awsui_root_pcgz5_1c7j1_153",
+  "slider": "awsui_slider_pcgz5_1c7j1_190",
+  "slider-track": "awsui_slider-track_pcgz5_1c7j1_194",
+  "slider-range": "awsui_slider-range_pcgz5_1c7j1_194",
+  "disabled": "awsui_disabled_pcgz5_1c7j1_209",
+  "readonly": "awsui_readonly_pcgz5_1c7j1_213",
+  "error": "awsui_error_pcgz5_1c7j1_222",
+  "warning": "awsui_warning_pcgz5_1c7j1_225",
+  "active": "awsui_active_pcgz5_1c7j1_228",
+  "error-active": "awsui_error-active_pcgz5_1c7j1_231",
+  "warning-active": "awsui_warning-active_pcgz5_1c7j1_234",
+  "labels": "awsui_labels_pcgz5_1c7j1_245",
+  "labels-noref": "awsui_labels-noref_pcgz5_1c7j1_251",
+  "labels-reference": "awsui_labels-reference_pcgz5_1c7j1_254",
+  "labels-min": "awsui_labels-min_pcgz5_1c7j1_261",
+  "labels-max": "awsui_labels-max_pcgz5_1c7j1_267",
+  "labels-aria-description": "awsui_labels-aria-description_pcgz5_1c7j1_275",
+  "ticks": "awsui_ticks_pcgz5_1c7j1_293",
+  "ticks-wrapper": "awsui_ticks-wrapper_pcgz5_1c7j1_299",
+  "tick": "awsui_tick_pcgz5_1c7j1_293",
+  "middle": "awsui_middle_pcgz5_1c7j1_314",
+  "filled": "awsui_filled_pcgz5_1c7j1_317",
+  "tooltip-thumb": "awsui_tooltip-thumb_pcgz5_1c7j1_345",
+  "thumb": "awsui_thumb_pcgz5_1c7j1_358",
+  "min": "awsui_min_pcgz5_1c7j1_394",
+  "max": "awsui_max_pcgz5_1c7j1_397"
 };