@cloudscape-design/components 3.0.1146 → 3.0.1148

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\nimport { useSingleTabStopNavigation } from '@cloudscape-design/component-toolkit/internal';\nimport { copyAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { getAbstractSwitchStyles, getInnerCircleStyle, getOuterCircleStyle } from '../../../radio-group/style';\nimport { getBaseProps } from '../../base-component';\nimport AbstractSwitch from '../../components/abstract-switch';\nimport { fireNonCancelableEvent } from '../../events';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component';\nimport WithNativeAttributes from '../../utils/with-native-attributes';\nimport { RadioButtonProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport default React.forwardRef(function RadioButton(\n  {\n    name,\n    children,\n    value,\n    checked,\n    description,\n    disabled,\n    controlId,\n    readOnly,\n    className,\n    style,\n    nativeInputAttributes,\n    onSelect,\n    ...rest\n  }: RadioButtonProps & InternalBaseComponentProps,\n  ref: React.Ref<HTMLInputElement>\n) {\n  const radioButtonRef = useRef<HTMLInputElement>(null);\n  const mergedRefs = useMergeRefs(radioButtonRef, ref);\n\n  const { tabIndex } = useSingleTabStopNavigation(radioButtonRef);\n  const baseProps = getBaseProps(rest);\n\n  return (\n    <AbstractSwitch\n      {...baseProps}\n      className={clsx(testUtilStyles.root, className)}\n      controlClassName={styles['radio-control']}\n      outlineClassName={styles.outline}\n      label={children}\n      description={description}\n      disabled={disabled}\n      readOnly={readOnly}\n      controlId={controlId}\n      style={getAbstractSwitchStyles(style, checked, disabled, readOnly)}\n      __internalRootRef={rest.__internalRootRef}\n      {...copyAnalyticsMetadataAttribute(rest)}\n      nativeControl={nativeControlProps => (\n        <WithNativeAttributes<HTMLInputElement, React.InputHTMLAttributes<HTMLInputElement>>\n          {...nativeControlProps}\n          tag=\"input\"\n          componentName=\"RadioButton\"\n          nativeAttributes={nativeInputAttributes}\n          tabIndex={tabIndex}\n          type=\"radio\"\n          ref={mergedRefs}\n          name={name}\n          value={value}\n          checked={checked}\n          aria-disabled={readOnly && !disabled ? 'true' : undefined}\n          // empty handler to suppress React controllability warning\n          onChange={() => {}}\n        />\n      )}\n      onClick={() => {\n        radioButtonRef.current?.focus();\n        if (!checked) {\n          fireNonCancelableEvent(onSelect);\n        }\n      }}\n      styledControl={\n        <svg viewBox=\"0 0 100 100\" focusable=\"false\" aria-hidden=\"true\">\n          <circle\n            className={clsx(styles['styled-circle-border'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={6.25}\n            cx={50}\n            cy={50}\n            r={46}\n            style={getOuterCircleStyle(style, checked, disabled, readOnly)}\n          />\n          <circle\n            className={clsx(styles['styled-circle-fill'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-checked']]: checked,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={30}\n            cx={50}\n            cy={50}\n            r={35}\n            style={getInnerCircleStyle(style, checked, disabled, readOnly)}\n          />\n        </svg>\n      }\n    />\n  );\n});\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/index.tsx"],"names":[],"mappings":"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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 { getBaseProps } from '../../base-component';\nimport AbstractSwitch from '../../components/abstract-switch';\nimport { fireNonCancelableEvent } from '../../events';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component';\nimport WithNativeAttributes from '../../utils/with-native-attributes';\nimport { RadioButtonProps } from './interfaces';\nimport { getAbstractSwitchStyles, getInnerCircleStyle, getOuterCircleStyle } from './style';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport default React.forwardRef(function RadioButton(\n  {\n    name,\n    children,\n    value,\n    checked,\n    description,\n    disabled,\n    controlId,\n    readOnly,\n    className,\n    style,\n    nativeInputAttributes,\n    onSelect,\n    ...rest\n  }: RadioButtonProps & InternalBaseComponentProps,\n  ref: React.Ref<HTMLInputElement>\n) {\n  const radioButtonRef = useRef<HTMLInputElement>(null);\n  const mergedRefs = useMergeRefs(radioButtonRef, ref);\n\n  const { tabIndex } = useSingleTabStopNavigation(radioButtonRef);\n  const baseProps = getBaseProps(rest);\n\n  return (\n    <AbstractSwitch\n      {...baseProps}\n      className={clsx(testUtilStyles.root, className)}\n      controlClassName={styles['radio-control']}\n      outlineClassName={styles.outline}\n      label={children}\n      description={description}\n      disabled={disabled}\n      readOnly={readOnly}\n      controlId={controlId}\n      style={getAbstractSwitchStyles(style, checked, disabled, readOnly)}\n      __internalRootRef={rest.__internalRootRef}\n      {...copyAnalyticsMetadataAttribute(rest)}\n      nativeControl={nativeControlProps => (\n        <WithNativeAttributes<HTMLInputElement, React.InputHTMLAttributes<HTMLInputElement>>\n          {...nativeControlProps}\n          tag=\"input\"\n          componentName=\"RadioButton\"\n          nativeAttributes={nativeInputAttributes}\n          tabIndex={tabIndex}\n          type=\"radio\"\n          ref={mergedRefs}\n          name={name}\n          value={value}\n          checked={checked}\n          aria-disabled={readOnly && !disabled ? 'true' : undefined}\n          // empty handler to suppress React controllability warning\n          onChange={() => {}}\n        />\n      )}\n      onClick={() => {\n        radioButtonRef.current?.focus();\n        if (!checked) {\n          fireNonCancelableEvent(onSelect);\n        }\n      }}\n      styledControl={\n        <svg viewBox=\"0 0 100 100\" focusable=\"false\" aria-hidden=\"true\">\n          <circle\n            className={clsx(styles['styled-circle-border'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={6.25}\n            cx={50}\n            cy={50}\n            r={46}\n            style={getOuterCircleStyle(style, checked, disabled, readOnly)}\n          />\n          <circle\n            className={clsx(styles['styled-circle-fill'], {\n              [styles['styled-circle-disabled']]: disabled,\n              [styles['styled-circle-checked']]: checked,\n              [styles['styled-circle-readonly']]: readOnly,\n            })}\n            strokeWidth={30}\n            cx={50}\n            cy={50}\n            r={35}\n            style={getInnerCircleStyle(style, checked, disabled, readOnly)}\n          />\n        </svg>\n      }\n    />\n  );\n});\n"]}

package/{radio-group → internal/components/radio-button}/style.d.ts

@@ -1,4 +1,4 @@
-import { RadioGroupProps } from './interfaces';
+import { RadioGroupProps } from '../../../radio-group/interfaces';
 export declare function getOuterCircleStyle(style: RadioGroupProps.Style | undefined, checked: boolean | undefined, disabled: boolean | undefined, readOnly: boolean | undefined): {
   fill: string | undefined;
   stroke: string | undefined;

package/internal/components/radio-button/style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/style.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAIlE,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,eAAe,CAAC,KAAK,GAAG,SAAS,EACxC,OAAO,EAAE,OAAO,GAAG,SAAS,EAC5B,QAAQ,EAAE,OAAO,GAAG,SAAS,EAC7B,QAAQ,EAAE,OAAO,GAAG,SAAS;;;cAc9B;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,eAAe,CAAC,KAAK,GAAG,SAAS,EACxC,OAAO,EAAE,OAAO,GAAG,SAAS,EAC5B,QAAQ,EAAE,OAAO,GAAG,SAAS,EAC7B,QAAQ,EAAE,OAAO,GAAG,SAAS;;;cAc9B;AAED,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,eAAe,CAAC,KAAK,GAAG,SAAS,EACxC,OAAO,EAAE,OAAO,GAAG,SAAS,EAC5B,QAAQ,EAAE,OAAO,GAAG,SAAS,EAC7B,QAAQ,EAAE,OAAO,GAAG,SAAS,MAwB9B"}

package/{radio-group → internal/components/radio-button}/style.js

@@ -1,7 +1,5 @@
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// SPDX-License-Identifier: Apache-2.0
-import { SYSTEM } from '../internal/environment';
-import { getComputedAbstractSwitchState } from '../internal/utils/style';
+import { SYSTEM } from '../../environment';
+import { getComputedAbstractSwitchState } from '../../utils/style';
 export function getOuterCircleStyle(style, checked, disabled, readOnly) {
     var _a, _b;
     let properties;

package/internal/components/radio-button/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../../../src/internal/components/radio-button/style.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 { RadioGroupProps } from '../../../radio-group/interfaces';\nimport { SYSTEM } from '../../environment';\nimport { getComputedAbstractSwitchState } from '../../utils/style';\n\nexport function getOuterCircleStyle(\n  style: RadioGroupProps.Style | undefined,\n  checked: boolean | undefined,\n  disabled: boolean | undefined,\n  readOnly: boolean | undefined\n) {\n  let properties;\n\n  if (SYSTEM === 'core' && style?.input) {\n    const computedState = getComputedAbstractSwitchState(checked, disabled, readOnly, undefined);\n\n    properties = {\n      fill: style.input?.fill && style.input.fill[computedState as keyof typeof style.input.fill],\n      stroke: style.input?.stroke && style.input.stroke[computedState as keyof typeof style.input.stroke],\n    };\n  }\n\n  return properties;\n}\n\nexport function getInnerCircleStyle(\n  style: RadioGroupProps.Style | undefined,\n  checked: boolean | undefined,\n  disabled: boolean | undefined,\n  readOnly: boolean | undefined\n) {\n  let properties;\n\n  if (SYSTEM === 'core' && style?.input) {\n    const computedState = getComputedAbstractSwitchState(checked, disabled, readOnly, undefined);\n\n    properties = {\n      fill: style.input?.circle?.fill && style.input.circle.fill[computedState as keyof typeof style.input.circle.fill],\n      stroke: style.input?.fill && style.input.fill[computedState as keyof typeof style.input.fill],\n    };\n  }\n\n  return properties;\n}\n\nexport function getAbstractSwitchStyles(\n  style: RadioGroupProps.Style | undefined,\n  checked: boolean | undefined,\n  disabled: boolean | undefined,\n  readOnly: boolean | undefined\n) {\n  let properties = {};\n\n  if (SYSTEM === 'core' && (style?.label || style?.description || style?.input)) {\n    const computedState = getComputedAbstractSwitchState(checked, disabled, readOnly, undefined);\n\n    properties = {\n      label: {\n        color: style?.label?.color && style.label.color[computedState as keyof typeof style.label.color],\n      },\n      description: {\n        color:\n          style?.description?.color && style.description.color[computedState as keyof typeof style.description.color],\n      },\n      focusRing: {\n        borderColor: style?.input?.focusRing?.borderColor,\n        borderRadius: style?.input?.focusRing?.borderRadius,\n        borderWidth: style?.input?.focusRing?.borderWidth,\n      },\n    };\n  }\n\n  return properties;\n}\n"]}

package/internal/components/selectable-item/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAQvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKnD,OAAO,EAAE,mBAAmB,EAAE,CAAC;;AA8H/B,wBAAgD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAQvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKnD,OAAO,EAAE,mBAAmB,EAAE,CAAC;;AAmI/B,wBAAgD"}

package/internal/components/selectable-item/index.js

@@ -8,7 +8,7 @@ import { getBaseProps } from '../../base-component';
 import { getAnalyticsSelectActionMetadata } from './analytics-metadata/utils';
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
-const SelectableItem = ({ children: content, ariaSelected, ariaChecked, selected, highlighted, disabled, hasBackground, isParent, isChild, isSelectAll, virtualPosition, padBottom, isNextSelected, isPreviousSelected, useInteractiveGroups, screenReaderContent, ariaPosinset, ariaSetsize, highlightType, value, sticky, afterHeader, withScrollbar, ...restProps }, ref) => {
+const SelectableItem = ({ children: content, ariaSelected, ariaChecked, selected, highlighted, disabled, hasBackground, isParent, isChild, isSelectAll, virtualPosition, padBottom, disableContentStyling, isNextSelected, isPreviousSelected, useInteractiveGroups, screenReaderContent, ariaPosinset, ariaSetsize, highlightType, value, sticky, afterHeader, withScrollbar, ...restProps }, ref) => {
     const isVisualRefresh = useVisualRefresh();
     const { className, ...rest } = getBaseProps(restProps);
     const classNames = clsx(className, styles['selectable-item'], {
@@ -31,6 +31,9 @@ const SelectableItem = ({ children: content, ariaSelected, ariaChecked, selected
         [styles['with-scrollbar']]: withScrollbar,
         [styles['visual-refresh']]: isVisualRefresh,
     });
+    const contentClassNames = clsx(styles['option-content'], analyticsSelectors['option-content'], {
+        [styles['selectable-item-content']]: !disableContentStyling,
+    });
     const contentRef = useRef(null);
     const screenReaderContentRef = useRef(null);
     useLayoutEffect(() => {
@@ -78,7 +81,7 @@ const SelectableItem = ({ children: content, ariaSelected, ariaChecked, selected
     return (React.createElement("div", { className: classNames, style: style, ...a11yProperties, ...rest, ...(isParent || disabled
             ? {}
             : getAnalyticsMetadataAttribute(getAnalyticsSelectActionMetadata({ isChild, value, ...restProps }))) },
-        React.createElement("div", { className: clsx(styles['option-content'], analyticsSelectors['option-content']), ref: contentRef }, content),
+        React.createElement("div", { className: contentClassNames, ref: contentRef }, content),
         React.createElement("div", { className: styles['measure-strut'], ref: ref }),
         React.createElement("div", { className: styles['screenreader-content'], ref: screenReaderContentRef })));
 };

package/internal/components/selectable-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';\nimport { getBaseProps } from '../../base-component';\nimport { getAnalyticsSelectActionMetadata } from './analytics-metadata/utils';\nimport { SelectableItemProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { SelectableItemProps };\n\nconst SelectableItem = (\n  {\n    children: content,\n    ariaSelected,\n    ariaChecked,\n    selected,\n    highlighted,\n    disabled,\n    hasBackground,\n    isParent,\n    isChild,\n    isSelectAll,\n    virtualPosition,\n    padBottom,\n    isNextSelected,\n    isPreviousSelected,\n    useInteractiveGroups,\n    screenReaderContent,\n    ariaPosinset,\n    ariaSetsize,\n    highlightType,\n    value,\n    sticky,\n    afterHeader,\n    withScrollbar,\n    ...restProps\n  }: SelectableItemProps,\n  ref: React.Ref<HTMLDivElement>\n) => {\n  const isVisualRefresh = useVisualRefresh();\n  const { className, ...rest } = getBaseProps(restProps);\n  const classNames = clsx(className, styles['selectable-item'], {\n    [styles.selected]: selected,\n    [styles.highlighted]: highlighted,\n    [styles['has-background']]: hasBackground,\n    [styles.parent]: isParent,\n    [analyticsSelectors.parent]: isParent,\n    [styles.child]: isChild,\n    [styles['select-all']]: isSelectAll,\n    [styles['is-keyboard']]: highlightType === 'keyboard',\n    [styles.disabled]: disabled,\n    [styles.virtual]: virtualPosition !== undefined && !sticky,\n    [styles['pad-bottom']]: padBottom,\n    [styles['next-item-selected']]: isNextSelected,\n    [styles['previous-item-selected']]: isPreviousSelected,\n    [styles.interactiveGroups]: useInteractiveGroups,\n    [styles.sticky]: sticky,\n    [styles['after-header']]: !!afterHeader,\n    [styles['with-scrollbar']]: withScrollbar,\n    [styles['visual-refresh']]: isVisualRefresh,\n  });\n\n  const contentRef = useRef<HTMLDivElement>(null);\n  const screenReaderContentRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    // the state of aria-hidden and announcement is not set back because NVDA+Firefox would announce\n    // the item which lost highlight\n    // set aria-hidden true when there is announcement content, so that screen reader still announce\n    // meaningful content when navigate with screen reader cursor\n    // imperatively update to avoid announcement made multiple times when content updates\n    if (highlighted && screenReaderContent) {\n      if (contentRef.current) {\n        contentRef.current.setAttribute('aria-hidden', 'true');\n      }\n      if (screenReaderContentRef.current) {\n        screenReaderContentRef.current.textContent = screenReaderContent;\n      }\n    }\n  }, [highlighted, screenReaderContent, contentRef, screenReaderContentRef]);\n\n  const style =\n    virtualPosition !== undefined\n      ? {\n          transform: `translateY(${virtualPosition}px)`,\n        }\n      : undefined;\n\n  const a11yProperties: Record<string, string | number | boolean | undefined> = {};\n\n  if (isParent && ariaChecked === undefined) {\n    a11yProperties.role = 'presentation';\n  } else {\n    a11yProperties.role = 'option';\n    a11yProperties['aria-disabled'] = disabled;\n\n    if (ariaSelected !== undefined) {\n      a11yProperties['aria-selected'] = ariaSelected;\n    }\n\n    // Safari+VO needs aria-checked for multi-selection. Otherwise it only announces selected option even though another option is highlighted.\n    if (ariaChecked !== undefined) {\n      a11yProperties['aria-checked'] = ariaChecked;\n    }\n\n    if (ariaPosinset && ariaSetsize) {\n      a11yProperties['aria-posinset'] = ariaPosinset;\n      a11yProperties['aria-setsize'] = ariaSetsize;\n    }\n\n    if (restProps.ariaDescribedby) {\n      a11yProperties['aria-describedby'] = restProps.ariaDescribedby;\n    }\n  }\n\n  return (\n    <div\n      className={classNames}\n      style={style}\n      {...a11yProperties}\n      {...rest}\n      {...(isParent || disabled\n        ? {}\n        : getAnalyticsMetadataAttribute(getAnalyticsSelectActionMetadata({ isChild, value, ...restProps })))}\n    >\n      <div className={clsx(styles['option-content'], analyticsSelectors['option-content'])} ref={contentRef}>\n        {content}\n      </div>\n      <div className={styles['measure-strut']} ref={ref} />\n      <div className={styles['screenreader-content']} ref={screenReaderContentRef}></div>\n    </div>\n  );\n};\n\nexport default React.forwardRef(SelectableItem);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useVisualRefresh } from '../../../internal/hooks/use-visual-mode';\nimport { getBaseProps } from '../../base-component';\nimport { getAnalyticsSelectActionMetadata } from './analytics-metadata/utils';\nimport { SelectableItemProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { SelectableItemProps };\n\nconst SelectableItem = (\n  {\n    children: content,\n    ariaSelected,\n    ariaChecked,\n    selected,\n    highlighted,\n    disabled,\n    hasBackground,\n    isParent,\n    isChild,\n    isSelectAll,\n    virtualPosition,\n    padBottom,\n    disableContentStyling,\n    isNextSelected,\n    isPreviousSelected,\n    useInteractiveGroups,\n    screenReaderContent,\n    ariaPosinset,\n    ariaSetsize,\n    highlightType,\n    value,\n    sticky,\n    afterHeader,\n    withScrollbar,\n    ...restProps\n  }: SelectableItemProps,\n  ref: React.Ref<HTMLDivElement>\n) => {\n  const isVisualRefresh = useVisualRefresh();\n  const { className, ...rest } = getBaseProps(restProps);\n  const classNames = clsx(className, styles['selectable-item'], {\n    [styles.selected]: selected,\n    [styles.highlighted]: highlighted,\n    [styles['has-background']]: hasBackground,\n    [styles.parent]: isParent,\n    [analyticsSelectors.parent]: isParent,\n    [styles.child]: isChild,\n    [styles['select-all']]: isSelectAll,\n    [styles['is-keyboard']]: highlightType === 'keyboard',\n    [styles.disabled]: disabled,\n    [styles.virtual]: virtualPosition !== undefined && !sticky,\n    [styles['pad-bottom']]: padBottom,\n    [styles['next-item-selected']]: isNextSelected,\n    [styles['previous-item-selected']]: isPreviousSelected,\n    [styles.interactiveGroups]: useInteractiveGroups,\n    [styles.sticky]: sticky,\n    [styles['after-header']]: !!afterHeader,\n    [styles['with-scrollbar']]: withScrollbar,\n    [styles['visual-refresh']]: isVisualRefresh,\n  });\n\n  const contentClassNames = clsx(styles['option-content'], analyticsSelectors['option-content'], {\n    [styles['selectable-item-content']]: !disableContentStyling,\n  });\n\n  const contentRef = useRef<HTMLDivElement>(null);\n  const screenReaderContentRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    // the state of aria-hidden and announcement is not set back because NVDA+Firefox would announce\n    // the item which lost highlight\n    // set aria-hidden true when there is announcement content, so that screen reader still announce\n    // meaningful content when navigate with screen reader cursor\n    // imperatively update to avoid announcement made multiple times when content updates\n    if (highlighted && screenReaderContent) {\n      if (contentRef.current) {\n        contentRef.current.setAttribute('aria-hidden', 'true');\n      }\n      if (screenReaderContentRef.current) {\n        screenReaderContentRef.current.textContent = screenReaderContent;\n      }\n    }\n  }, [highlighted, screenReaderContent, contentRef, screenReaderContentRef]);\n\n  const style =\n    virtualPosition !== undefined\n      ? {\n          transform: `translateY(${virtualPosition}px)`,\n        }\n      : undefined;\n\n  const a11yProperties: Record<string, string | number | boolean | undefined> = {};\n\n  if (isParent && ariaChecked === undefined) {\n    a11yProperties.role = 'presentation';\n  } else {\n    a11yProperties.role = 'option';\n    a11yProperties['aria-disabled'] = disabled;\n\n    if (ariaSelected !== undefined) {\n      a11yProperties['aria-selected'] = ariaSelected;\n    }\n\n    // Safari+VO needs aria-checked for multi-selection. Otherwise it only announces selected option even though another option is highlighted.\n    if (ariaChecked !== undefined) {\n      a11yProperties['aria-checked'] = ariaChecked;\n    }\n\n    if (ariaPosinset && ariaSetsize) {\n      a11yProperties['aria-posinset'] = ariaPosinset;\n      a11yProperties['aria-setsize'] = ariaSetsize;\n    }\n\n    if (restProps.ariaDescribedby) {\n      a11yProperties['aria-describedby'] = restProps.ariaDescribedby;\n    }\n  }\n\n  return (\n    <div\n      className={classNames}\n      style={style}\n      {...a11yProperties}\n      {...rest}\n      {...(isParent || disabled\n        ? {}\n        : getAnalyticsMetadataAttribute(getAnalyticsSelectActionMetadata({ isChild, value, ...restProps })))}\n    >\n      <div className={contentClassNames} ref={contentRef}>\n        {content}\n      </div>\n      <div className={styles['measure-strut']} ref={ref} />\n      <div className={styles['screenreader-content']} ref={screenReaderContentRef}></div>\n    </div>\n  );\n};\n\nexport default React.forwardRef(SelectableItem);\n"]}

package/internal/components/selectable-item/interfaces.d.ts

@@ -11,6 +11,7 @@ export type SelectableItemProps = BaseComponentProps & {
   isSelectAll?: boolean;
   virtualPosition?: number;
   padBottom?: boolean;
+  disableContentStyling?: boolean;
   isPreviousSelected?: boolean;
   isNextSelected?: boolean;
   useInteractiveGroups?: boolean;

package/internal/components/selectable-item/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,GAAG;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,GAAG,CAAC;IAAE,YAAY,CAAC,EAAE,OAAO,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,GAAG;IAAE,YAAY,CAAC,EAAE,KAAK,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;CAAE,CAAC,CAAC;AAElH,MAAM,WAAW,kBAAkB;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,GAAG;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,GAAG,CAAC;IAAE,YAAY,CAAC,EAAE,OAAO,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,GAAG;IAAE,YAAY,CAAC,EAAE,KAAK,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;CAAE,CAAC,CAAC;AAElH,MAAM,WAAW,kBAAkB;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B"}

package/internal/components/selectable-item/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseComponentProps } from '../../base-component';\nimport { HighlightType } from '../options-list/utils/use-highlight-option';\n\nexport type SelectableItemProps = BaseComponentProps & {\n  children: React.ReactNode;\n  selected?: boolean;\n  highlighted?: boolean;\n  disabled?: boolean;\n  hasBackground?: boolean;\n  isParent?: boolean;\n  isChild?: boolean;\n  isSelectAll?: boolean;\n  virtualPosition?: number;\n  padBottom?: boolean;\n  isPreviousSelected?: boolean;\n  isNextSelected?: boolean;\n  useInteractiveGroups?: boolean;\n  screenReaderContent?: string;\n  ariaPosinset?: number;\n  ariaSetsize?: number;\n  highlightType?: HighlightType['type'];\n  ariaDescribedby?: string;\n  value?: string;\n  sticky?: boolean;\n  afterHeader?: boolean;\n  withScrollbar?: boolean;\n} & ({ ariaSelected?: boolean; ariaChecked?: never } | { ariaSelected?: never; ariaChecked?: boolean | 'mixed' });\n\nexport interface ItemDataAttributes {\n  'data-group-index'?: string;\n  'data-child-index'?: string;\n  'data-in-group-index'?: string;\n  'data-test-index'?: string;\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseComponentProps } from '../../base-component';\nimport { HighlightType } from '../options-list/utils/use-highlight-option';\n\nexport type SelectableItemProps = BaseComponentProps & {\n  children: React.ReactNode;\n  selected?: boolean;\n  highlighted?: boolean;\n  disabled?: boolean;\n  hasBackground?: boolean;\n  isParent?: boolean;\n  isChild?: boolean;\n  isSelectAll?: boolean;\n  virtualPosition?: number;\n  padBottom?: boolean;\n  disableContentStyling?: boolean;\n  isPreviousSelected?: boolean;\n  isNextSelected?: boolean;\n  useInteractiveGroups?: boolean;\n  screenReaderContent?: string;\n  ariaPosinset?: number;\n  ariaSetsize?: number;\n  highlightType?: HighlightType['type'];\n  ariaDescribedby?: string;\n  value?: string;\n  sticky?: boolean;\n  afterHeader?: boolean;\n  withScrollbar?: boolean;\n} & ({ ariaSelected?: boolean; ariaChecked?: never } | { ariaSelected?: never; ariaChecked?: boolean | 'mixed' });\n\nexport interface ItemDataAttributes {\n  'data-group-index'?: string;\n  'data-child-index'?: string;\n  'data-in-group-index'?: string;\n  'data-test-index'?: string;\n}\n"]}

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

@@ -1,27 +1,28 @@
 
     import './styles.scoped.css';
     export default {
-  "selectable-item": "awsui_selectable-item_15o6u_d2ghy_145",
-  "pad-bottom": "awsui_pad-bottom_15o6u_d2ghy_167",
-  "virtual": "awsui_virtual_15o6u_d2ghy_171",
-  "has-background": "awsui_has-background_15o6u_d2ghy_174",
-  "highlighted": "awsui_highlighted_15o6u_d2ghy_177",
-  "selected": "awsui_selected_15o6u_d2ghy_177",
-  "disabled": "awsui_disabled_15o6u_d2ghy_195",
-  "is-keyboard": "awsui_is-keyboard_15o6u_d2ghy_200",
-  "visual-refresh": "awsui_visual-refresh_15o6u_d2ghy_203",
-  "next-item-selected": "awsui_next-item-selected_15o6u_d2ghy_211",
-  "previous-item-selected": "awsui_previous-item-selected_15o6u_d2ghy_232",
-  "parent": "awsui_parent_15o6u_d2ghy_236",
-  "interactiveGroups": "awsui_interactiveGroups_15o6u_d2ghy_240",
-  "child": "awsui_child_15o6u_d2ghy_256",
-  "sticky": "awsui_sticky_15o6u_d2ghy_262",
-  "with-scrollbar": "awsui_with-scrollbar_15o6u_d2ghy_274",
-  "after-header": "awsui_after-header_15o6u_d2ghy_280",
-  "measure-strut": "awsui_measure-strut_15o6u_d2ghy_315",
-  "measure-strut-first": "awsui_measure-strut-first_15o6u_d2ghy_324",
-  "screenreader-content": "awsui_screenreader-content_15o6u_d2ghy_328",
-  "option-content": "awsui_option-content_15o6u_d2ghy_334",
-  "select-all": "awsui_select-all_15o6u_d2ghy_338"
+  "selectable-item": "awsui_selectable-item_15o6u_z9adt_145",
+  "selectable-item-content": "awsui_selectable-item-content_15o6u_z9adt_168",
+  "pad-bottom": "awsui_pad-bottom_15o6u_z9adt_172",
+  "virtual": "awsui_virtual_15o6u_z9adt_179",
+  "has-background": "awsui_has-background_15o6u_z9adt_182",
+  "child": "awsui_child_15o6u_z9adt_185",
+  "disabled": "awsui_disabled_15o6u_z9adt_191",
+  "highlighted": "awsui_highlighted_15o6u_z9adt_194",
+  "selected": "awsui_selected_15o6u_z9adt_194",
+  "is-keyboard": "awsui_is-keyboard_15o6u_z9adt_232",
+  "visual-refresh": "awsui_visual-refresh_15o6u_z9adt_235",
+  "next-item-selected": "awsui_next-item-selected_15o6u_z9adt_243",
+  "previous-item-selected": "awsui_previous-item-selected_15o6u_z9adt_264",
+  "parent": "awsui_parent_15o6u_z9adt_268",
+  "interactiveGroups": "awsui_interactiveGroups_15o6u_z9adt_271",
+  "sticky": "awsui_sticky_15o6u_z9adt_301",
+  "with-scrollbar": "awsui_with-scrollbar_15o6u_z9adt_316",
+  "after-header": "awsui_after-header_15o6u_z9adt_322",
+  "measure-strut": "awsui_measure-strut_15o6u_z9adt_354",
+  "measure-strut-first": "awsui_measure-strut-first_15o6u_z9adt_363",
+  "screenreader-content": "awsui_screenreader-content_15o6u_z9adt_367",
+  "option-content": "awsui_option-content_15o6u_z9adt_373",
+  "select-all": "awsui_select-all_15o6u_z9adt_377"
 };
   

package/internal/components/selectable-item/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_selectable-item_15o6u_d2ghy_145:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145:not(#\9) {
   font-size: var(--font-size-body-m-a7nh2n, 14px);
   line-height: var(--line-height-body-m-2mh3ke, 20px);
   color: var(--color-text-body-default-vvtq8u, #0f141a);
@@ -161,158 +161,197 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-dropdown-item-default-f1jr9u, #0f141a);
   border-inline-start-width: 0;
   border-inline-end-width: 0;
-  padding-block: calc(var(--space-xxs-hwfkai, 4px) + var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
-  padding-inline: calc(var(--space-field-horizontal-0aq2ch, 12px) + var(--border-item-width-miijiw, 2px));
+  padding-block: calc(var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
+  padding-inline: var(--border-item-width-miijiw, 2px);
+  overflow: hidden;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_pad-bottom_15o6u_d2ghy_167:not(#\9) {
-  padding-block-end: calc(calc(var(--space-xxs-hwfkai, 4px) + var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px)) + var(--space-xxxs-pajhad, 2px));
+.awsui_selectable-item_15o6u_z9adt_145 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  padding-block: var(--space-xxs-hwfkai, 4px);
+  padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_pad-bottom_15o6u_z9adt_172:not(#\9) {
+  padding-block-end: calc(var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
   border-block-end-color: transparent;
 }
-.awsui_selectable-item_15o6u_d2ghy_145:not(#\9):not(:first-child), .awsui_selectable-item_15o6u_d2ghy_145.awsui_virtual_15o6u_d2ghy_171:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_pad-bottom_15o6u_z9adt_172 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  padding-block-end: calc(var(--space-xxs-hwfkai, 4px) + var(--space-xxxs-pajhad, 2px));
+}
+.awsui_selectable-item_15o6u_z9adt_145:not(#\9):not(:first-child), .awsui_selectable-item_15o6u_z9adt_145.awsui_virtual_15o6u_z9adt_179:not(#\9) {
   margin-block-start: calc(-1 * var(--border-item-width-miijiw, 2px));
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_has-background_15o6u_d2ghy_174:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_has-background_15o6u_z9adt_182:not(#\9) {
   background-color: var(--color-background-dropdown-item-hover-yunepc, #f3f3f7);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_highlighted_15o6u_d2ghy_177:not(#\9), .awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_child_15o6u_z9adt_185:not(#\9) {
+  padding-inline-start: var(--border-item-width-miijiw, 2px);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_child_15o6u_z9adt_185 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  padding-inline-start: var(--space-xxl-32srm4, 32px);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_disabled_15o6u_z9adt_191 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  color: var(--color-text-dropdown-item-disabled-8m65hf, #b4b4bb);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194:not(#\9) {
   color: var(--color-text-dropdown-item-highlighted-yr1px8, #0f141a);
   border-width: var(--border-item-width-miijiw, 2px);
   border-start-start-radius: var(--border-radius-item-iwaia5, 8px);
   border-start-end-radius: var(--border-radius-item-iwaia5, 8px);
   border-end-start-radius: var(--border-radius-item-iwaia5, 8px);
   border-end-end-radius: var(--border-radius-item-iwaia5, 8px);
+  padding-block: 0;
+  padding-inline: 0;
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
   padding-block: var(--space-xxs-hwfkai, 4px);
   padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_highlighted_15o6u_d2ghy_177.awsui_pad-bottom_15o6u_d2ghy_167:not(#\9), .awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_pad-bottom_15o6u_d2ghy_167:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_child_15o6u_z9adt_185:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_child_15o6u_z9adt_185:not(#\9) {
+  padding-inline-start: 0;
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_child_15o6u_z9adt_185 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_child_15o6u_z9adt_185 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  padding-inline-start: var(--space-xxl-32srm4, 32px);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_pad-bottom_15o6u_z9adt_172:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_pad-bottom_15o6u_z9adt_172:not(#\9) {
+  padding-block-end: 0;
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_pad-bottom_15o6u_z9adt_172 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_pad-bottom_15o6u_z9adt_172 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
   padding-block-end: calc(var(--space-xxs-hwfkai, 4px) + var(--space-xxxs-pajhad, 2px));
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_highlighted_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194:not(#\9) {
   z-index: 3;
   background-color: var(--color-background-dropdown-item-hover-yunepc, #f3f3f7);
   border-color: var(--color-border-dropdown-item-hover-aqfuxq, #8c8c94);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_highlighted_15o6u_d2ghy_177.awsui_disabled_15o6u_d2ghy_195:not(#\9) {
-  color: var(--color-text-dropdown-item-dimmed-tq8vh3, #b4b4bb);
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_disabled_15o6u_z9adt_191:not(#\9) {
   border-color: var(--color-border-dropdown-item-dimmed-hover-ga9sch, #8c8c94);
   background-color: var(--color-background-dropdown-item-dimmed-dhho03, transparent);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_highlighted_15o6u_d2ghy_177.awsui_is-keyboard_15o6u_d2ghy_200:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_disabled_15o6u_z9adt_191 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  color: var(--color-text-dropdown-item-dimmed-tq8vh3, #b4b4bb);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_is-keyboard_15o6u_z9adt_232:not(#\9) {
   border-color: var(--color-border-dropdown-item-focused-zacqlp, #424650);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_highlighted_15o6u_d2ghy_177.awsui_is-keyboard_15o6u_d2ghy_200:not(#\9):not(.awsui_visual-refresh_15o6u_d2ghy_203) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_highlighted_15o6u_z9adt_194.awsui_is-keyboard_15o6u_z9adt_232:not(#\9):not(.awsui_visual-refresh_15o6u_z9adt_235) {
   box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-9mjajk, 1px) var(--color-border-item-focused-uk47pl, #006ce0);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194:not(#\9) {
   z-index: 2;
   background-color: var(--color-background-dropdown-item-selected-f3v6te, #f0fbff);
   border-color: var(--color-border-dropdown-item-selected-dl2ezh, #006ce0);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_next-item-selected_15o6u_d2ghy_211:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_next-item-selected_15o6u_z9adt_243:not(#\9) {
   border-end-start-radius: 0;
   border-end-end-radius: 0;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_highlighted_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_highlighted_15o6u_z9adt_194:not(#\9) {
   border-color: var(--color-border-dropdown-item-selected-dl2ezh, #006ce0);
   z-index: 3;
   outline: var(--border-item-width-miijiw, 2px) solid var(--color-border-dropdown-item-hover-aqfuxq, #8c8c94);
   outline-offset: calc(-2 * var(--border-item-width-miijiw, 2px));
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_highlighted_15o6u_d2ghy_177.awsui_is-keyboard_15o6u_d2ghy_200:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_highlighted_15o6u_z9adt_194.awsui_is-keyboard_15o6u_z9adt_232:not(#\9) {
   border-color: var(--color-border-dropdown-item-selected-dl2ezh, #006ce0);
   outline-color: var(--color-border-dropdown-item-focused-zacqlp, #424650);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_highlighted_15o6u_d2ghy_177:not(#\9):not(.awsui_visual-refresh_15o6u_d2ghy_203) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_highlighted_15o6u_z9adt_194:not(#\9):not(.awsui_visual-refresh_15o6u_z9adt_235) {
   border-color: var(--color-border-dropdown-item-hover-aqfuxq, #8c8c94);
   outline: none;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_highlighted_15o6u_d2ghy_177:not(#\9):not(.awsui_visual-refresh_15o6u_d2ghy_203).awsui_is-keyboard_15o6u_d2ghy_200 {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_highlighted_15o6u_z9adt_194:not(#\9):not(.awsui_visual-refresh_15o6u_z9adt_235).awsui_is-keyboard_15o6u_z9adt_232 {
   border-color: var(--color-border-dropdown-item-focused-zacqlp, #424650);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177 + .awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177:not(#\9), .awsui_selectable-item_15o6u_d2ghy_145.awsui_selected_15o6u_d2ghy_177.awsui_previous-item-selected_15o6u_d2ghy_232:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194 + .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_selected_15o6u_z9adt_194.awsui_previous-item-selected_15o6u_z9adt_264:not(#\9) {
   border-start-start-radius: 0;
   border-start-end-radius: 0;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_parent_15o6u_d2ghy_236:not(#\9) {
-  font-weight: bold;
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268:not(#\9):not(.awsui_disabled_15o6u_z9adt_191) > .awsui_selectable-item-content_15o6u_z9adt_168 {
   color: var(--color-text-dropdown-group-label-2tmyik, #424650);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_parent_15o6u_d2ghy_236:not(#\9):not(.awsui_interactiveGroups_15o6u_d2ghy_240) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268:not(#\9):not(.awsui_interactiveGroups_15o6u_z9adt_271) {
   border-block-start-color: var(--color-border-dropdown-group-ylcnh8, #c6c6cd);
+  padding-block: 0;
+  padding-inline: 0;
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268:not(#\9):not(.awsui_interactiveGroups_15o6u_z9adt_271):not(:has(> .awsui_selectable-item-content_15o6u_z9adt_168)) {
+  padding-block: calc(var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
+  padding-inline: var(--border-item-width-miijiw, 2px);
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268:not(#\9):not(.awsui_interactiveGroups_15o6u_z9adt_271) > .awsui_selectable-item-content_15o6u_z9adt_168 {
   padding-block: var(--space-xs-ymlm0b, 8px);
   padding-inline: var(--space-xs-ymlm0b, 8px);
+  font-weight: bold;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_parent_15o6u_d2ghy_236.awsui_interactiveGroups_15o6u_d2ghy_240:not(#\9) {
-  padding-block: calc(var(--space-xs-ymlm0b, 8px) + var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
-  padding-inline: calc(var(--space-field-horizontal-0aq2ch, 12px) + var(--border-item-width-miijiw, 2px));
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268.awsui_interactiveGroups_15o6u_z9adt_271 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
+  padding-block: var(--space-xs-ymlm0b, 8px);
+  padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
+  font-weight: bold;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_parent_15o6u_d2ghy_236.awsui_interactiveGroups_15o6u_d2ghy_240.awsui_highlighted_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268.awsui_interactiveGroups_15o6u_z9adt_271.awsui_highlighted_15o6u_z9adt_194 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
   color: var(--color-text-dropdown-item-highlighted-yr1px8, #0f141a);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_parent_15o6u_d2ghy_236.awsui_interactiveGroups_15o6u_d2ghy_240.awsui_highlighted_15o6u_d2ghy_177:not(#\9), .awsui_selectable-item_15o6u_d2ghy_145.awsui_parent_15o6u_d2ghy_236.awsui_interactiveGroups_15o6u_d2ghy_240.awsui_selected_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268.awsui_interactiveGroups_15o6u_z9adt_271.awsui_highlighted_15o6u_z9adt_194:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268.awsui_interactiveGroups_15o6u_z9adt_271.awsui_selected_15o6u_z9adt_194:not(#\9) {
+  padding-block: 0;
+  padding-inline: 0;
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268.awsui_interactiveGroups_15o6u_z9adt_271.awsui_highlighted_15o6u_z9adt_194 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_parent_15o6u_z9adt_268.awsui_interactiveGroups_15o6u_z9adt_271.awsui_selected_15o6u_z9adt_194 > .awsui_selectable-item-content_15o6u_z9adt_168:not(#\9) {
   padding-block: var(--space-xs-ymlm0b, 8px);
   padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_child_15o6u_d2ghy_256:not(#\9) {
-  padding-inline-start: calc(var(--space-xxl-32srm4, 32px) + var(--border-item-width-miijiw, 2px));
-}
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_child_15o6u_d2ghy_256.awsui_highlighted_15o6u_d2ghy_177:not(#\9), .awsui_selectable-item_15o6u_d2ghy_145.awsui_child_15o6u_d2ghy_256.awsui_selected_15o6u_d2ghy_177:not(#\9) {
-  padding-inline-start: var(--space-xxl-32srm4, 32px);
-}
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9) {
   position: sticky;
   inset-block-start: 0;
   margin-block-end: calc(var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
   z-index: 4;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9):not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194) {
   border-inline-start-width: var(--border-item-width-miijiw, 2px);
   border-inline-start-color: var(--color-border-dropdown-container-cmthq7, #b4b4bb);
   border-inline-end-color: var(--color-border-dropdown-container-cmthq7, #b4b4bb);
+  padding-inline: 0;
+}
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194) > .awsui_selectable-item-content_15o6u_z9adt_168 {
   padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9):not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177):not(.awsui_with-scrollbar_15o6u_d2ghy_274) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194):not(.awsui_with-scrollbar_15o6u_z9adt_316) {
   border-inline-end-width: var(--border-item-width-miijiw, 2px);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9):not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177).awsui_with-scrollbar_15o6u_d2ghy_274 {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194).awsui_with-scrollbar_15o6u_z9adt_316 {
   border-inline-end-width: 0;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9):not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177):not(.awsui_after-header_15o6u_d2ghy_280) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194):not(.awsui_after-header_15o6u_z9adt_322) {
   border-start-start-radius: var(--border-radius-item-iwaia5, 8px);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9):not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177):not(.awsui_after-header_15o6u_d2ghy_280):not(.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177):not(.awsui_after-header_15o6u_d2ghy_280).awsui_with-scrollbar_15o6u_d2ghy_274) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194):not(.awsui_after-header_15o6u_z9adt_322):not(.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194):not(.awsui_after-header_15o6u_z9adt_322).awsui_with-scrollbar_15o6u_z9adt_316) {
   border-start-end-radius: var(--border-radius-item-iwaia5, 8px);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262:not(#\9):not(.awsui_highlighted_15o6u_d2ghy_177):not(.awsui_selected_15o6u_d2ghy_177).awsui_after-header_15o6u_d2ghy_280 {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301:not(#\9):not(.awsui_highlighted_15o6u_z9adt_194):not(.awsui_selected_15o6u_z9adt_194).awsui_after-header_15o6u_z9adt_322 {
   border-block-start-color: var(--color-background-dropdown-item-default-qmc033, #ffffff);
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262.awsui_disabled_15o6u_d2ghy_195.awsui_highlighted_15o6u_d2ghy_177:not(#\9), .awsui_selectable-item_15o6u_d2ghy_145.awsui_sticky_15o6u_d2ghy_262.awsui_disabled_15o6u_d2ghy_195.awsui_selected_15o6u_d2ghy_177:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301.awsui_disabled_15o6u_z9adt_191.awsui_highlighted_15o6u_z9adt_194:not(#\9), .awsui_selectable-item_15o6u_z9adt_145.awsui_sticky_15o6u_z9adt_301.awsui_disabled_15o6u_z9adt_191.awsui_selected_15o6u_z9adt_194:not(#\9) {
   border-block-end-color: transparent;
   border-block-start-color: transparent;
   border-inline-start-color: transparent;
   border-inline-end-color: transparent;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_disabled_15o6u_d2ghy_195:not(#\9) {
-  color: var(--color-text-dropdown-item-disabled-8m65hf, #b4b4bb);
-}
-.awsui_selectable-item_15o6u_d2ghy_145:not(#\9):not(.awsui_disabled_15o6u_d2ghy_195):not(.awsui_parent_15o6u_d2ghy_236) {
+.awsui_selectable-item_15o6u_z9adt_145:not(#\9):not(.awsui_disabled_15o6u_z9adt_191):not(.awsui_parent_15o6u_z9adt_268) {
   cursor: pointer;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_interactiveGroups_15o6u_d2ghy_240:not(#\9):not(.awsui_disabled_15o6u_d2ghy_195) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_interactiveGroups_15o6u_z9adt_271:not(#\9):not(.awsui_disabled_15o6u_z9adt_191) {
   cursor: pointer;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_virtual_15o6u_d2ghy_171:not(#\9) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_virtual_15o6u_z9adt_179:not(#\9) {
   position: absolute;
   inset-block-start: var(--border-dropdown-virtual-offset-width-3wp954, 2px);
   inset-inline-start: 0;
   inline-size: 100%;
   box-sizing: border-box;
 }
-.awsui_selectable-item_15o6u_d2ghy_145.awsui_virtual_15o6u_d2ghy_171:not(#\9):first-of-type:not(.awsui_selected_15o6u_d2ghy_177, .awsui_highlighted_15o6u_d2ghy_177) {
+.awsui_selectable-item_15o6u_z9adt_145.awsui_virtual_15o6u_z9adt_179:not(#\9):first-of-type:not(.awsui_selected_15o6u_z9adt_194, .awsui_highlighted_15o6u_z9adt_194) {
   border-block-start-color: var(--color-border-dropdown-item-top-gp2d1p, transparent);
 }
 
-.awsui_measure-strut_15o6u_d2ghy_315:not(#\9) {
+.awsui_measure-strut_15o6u_z9adt_354:not(#\9) {
   position: absolute;
   pointer-events: none;
   block-size: 100%;
@@ -321,20 +360,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inset-inline-start: 0;
   padding-block-start: var(--border-divider-list-width-tdfx1x, 1px);
 }
-.awsui_measure-strut-first_15o6u_d2ghy_324:not(#\9) {
+.awsui_measure-strut-first_15o6u_z9adt_363:not(#\9) {
   padding-block-end: var(--border-divider-list-width-tdfx1x, 1px);
 }
 
-.awsui_screenreader-content_15o6u_d2ghy_328:not(#\9) {
+.awsui_screenreader-content_15o6u_z9adt_367:not(#\9) {
   position: absolute !important;
   inset-block-start: -9999px !important;
   inset-inline-start: -9999px !important;
 }
 
-.awsui_option-content_15o6u_d2ghy_334:not(#\9) {
+.awsui_option-content_15o6u_z9adt_373:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_select-all_15o6u_d2ghy_338:not(#\9) {
+.awsui_select-all_15o6u_z9adt_377:not(#\9) {
   /* used in test-utils */
 }

package/internal/components/selectable-item/styles.selectors.js

@@ -2,27 +2,28 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "selectable-item": "awsui_selectable-item_15o6u_d2ghy_145",
-  "pad-bottom": "awsui_pad-bottom_15o6u_d2ghy_167",
-  "virtual": "awsui_virtual_15o6u_d2ghy_171",
-  "has-background": "awsui_has-background_15o6u_d2ghy_174",
-  "highlighted": "awsui_highlighted_15o6u_d2ghy_177",
-  "selected": "awsui_selected_15o6u_d2ghy_177",
-  "disabled": "awsui_disabled_15o6u_d2ghy_195",
-  "is-keyboard": "awsui_is-keyboard_15o6u_d2ghy_200",
-  "visual-refresh": "awsui_visual-refresh_15o6u_d2ghy_203",
-  "next-item-selected": "awsui_next-item-selected_15o6u_d2ghy_211",
-  "previous-item-selected": "awsui_previous-item-selected_15o6u_d2ghy_232",
-  "parent": "awsui_parent_15o6u_d2ghy_236",
-  "interactiveGroups": "awsui_interactiveGroups_15o6u_d2ghy_240",
-  "child": "awsui_child_15o6u_d2ghy_256",
-  "sticky": "awsui_sticky_15o6u_d2ghy_262",
-  "with-scrollbar": "awsui_with-scrollbar_15o6u_d2ghy_274",
-  "after-header": "awsui_after-header_15o6u_d2ghy_280",
-  "measure-strut": "awsui_measure-strut_15o6u_d2ghy_315",
-  "measure-strut-first": "awsui_measure-strut-first_15o6u_d2ghy_324",
-  "screenreader-content": "awsui_screenreader-content_15o6u_d2ghy_328",
-  "option-content": "awsui_option-content_15o6u_d2ghy_334",
-  "select-all": "awsui_select-all_15o6u_d2ghy_338"
+  "selectable-item": "awsui_selectable-item_15o6u_z9adt_145",
+  "selectable-item-content": "awsui_selectable-item-content_15o6u_z9adt_168",
+  "pad-bottom": "awsui_pad-bottom_15o6u_z9adt_172",
+  "virtual": "awsui_virtual_15o6u_z9adt_179",
+  "has-background": "awsui_has-background_15o6u_z9adt_182",
+  "child": "awsui_child_15o6u_z9adt_185",
+  "disabled": "awsui_disabled_15o6u_z9adt_191",
+  "highlighted": "awsui_highlighted_15o6u_z9adt_194",
+  "selected": "awsui_selected_15o6u_z9adt_194",
+  "is-keyboard": "awsui_is-keyboard_15o6u_z9adt_232",
+  "visual-refresh": "awsui_visual-refresh_15o6u_z9adt_235",
+  "next-item-selected": "awsui_next-item-selected_15o6u_z9adt_243",
+  "previous-item-selected": "awsui_previous-item-selected_15o6u_z9adt_264",
+  "parent": "awsui_parent_15o6u_z9adt_268",
+  "interactiveGroups": "awsui_interactiveGroups_15o6u_z9adt_271",
+  "sticky": "awsui_sticky_15o6u_z9adt_301",
+  "with-scrollbar": "awsui_with-scrollbar_15o6u_z9adt_316",
+  "after-header": "awsui_after-header_15o6u_z9adt_322",
+  "measure-strut": "awsui_measure-strut_15o6u_z9adt_354",
+  "measure-strut-first": "awsui_measure-strut-first_15o6u_z9adt_363",
+  "screenreader-content": "awsui_screenreader-content_15o6u_z9adt_367",
+  "option-content": "awsui_option-content_15o6u_z9adt_373",
+  "select-all": "awsui_select-all_15o6u_z9adt_377"
 };
   

package/internal/environment.js

@@ -1,6 +1,6 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (c02fc0dc)";
-export var GIT_SHA = "c02fc0dc";
+export var PACKAGE_VERSION = "3.0.0 (83500f35)";
+export var GIT_SHA = "83500f35";
 export var THEME = "open-source-visual-refresh";
 export var SYSTEM = "console";
 export var ALWAYS_VISUAL_REFRESH = true;