@cloudscape-design/components 3.0.29 → 3.0.32

package/button-dropdown/category-elements/mobile-expandable-category-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobile-expandable-category-element.js","sourceRoot":"","sources":["../../../../src/button-dropdown/category-elements/mobile-expandable-category-element.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,SAAS,MAAM,eAAe,CAAC;AACtC,OAAO,qBAAqB,MAAM,oDAAoD,CAAC;AAEvF,OAAO,OAAO,MAAM,eAAe,CAAC;AACpC,OAAO,oBAAoB,MAAM,oCAAoC,CAAC;AACtE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,IAAM,+BAA+B,GAAG,UAAC,EAUzB;;QATd,IAAI,UAAA,EACJ,cAAc,oBAAA,EACd,aAAa,mBAAA,EACb,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,QAAQ,cAAA,EACR,OAAO,aAAA;IAEP,IAAM,WAAW,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IACxC,IAAM,QAAQ,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;IAClC,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAkB,IAAI,CAAC,CAAC;IAEvD,SAAS,CAAC;QACR,IAAI,UAAU,CAAC,OAAO,IAAI,WAAW,IAAI,CAAC,QAAQ,EAAE;YAClD,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAC5B;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC;IAE5B,IAAM,OAAO,GAAG,UAAC,CAAmB;QAClC,IAAI,CAAC,QAAQ,EAAE;YACb,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IAEF,IAAM,OAAO,GAAG,UAAC,KAA2B;QAC1C,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,aAAa,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,IAAM,oBAAoB,GAAG,CAAC,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,QAAQ,CAAC;IAC9D,IAAA,KAAiC,oBAAoB,CAAC,IAAI,CAAC,cAAc,CAAC,EAAxE,WAAW,iBAAA,EAAE,aAAa,mBAA8C,CAAC;IACjF,IAAM,OAAO,GAAG,IAAI,CAAC,IAAI,IAAI,CAC3B,uCACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC,kBAAW,OAAO,CAAE,CAAC;YACtF,GAAC,MAAM,CAAC,WAAW,IAAG,WAAW;YACjC,GAAC,MAAM,CAAC,aAAa,CAAC,IAAG,QAAQ;YACjC,GAAC,MAAM,CAAC,QAAQ,IAAG,QAAQ;gBAC3B;QACF,wFAAwF;QACxF,wFAAwF;QACxF,8EAA8E;QAC9E,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC9B,GAAG,EAAE,UAAU,IACX,gBAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,UAAA,EAAE,QAAQ,UAAA,EAAE,CAAC,EACtD,CAAC,oBAAoB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;QAE5C,IAAI,CAAC,IAAI;QACV,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;gBACnC,GAAC,MAAM,CAAC,gBAAgB,CAAC,IAAG,QAAQ;oBACpC;YAEF,oBAAC,YAAY,IAAC,IAAI,EAAC,mBAAmB,GAAG,CACpC,CACF,CACR,CAAC;IAEF,IAAI,OAAwB,CAAC;IAE7B,IAAI,oBAAoB,EAAE;QACxB,OAAO,GAAG,CACR;YACG,aAAa;YACd,oBAAC,OAAO,IAAC,OAAO,EAAE,IAAI,CAAC,cAAc,IAAG,OAAO,CAAW,CACzD,CACJ,CAAC;KACH;SAAM,IAAI,QAAQ,EAAE;QACnB,OAAO,GAAG,OAAO,CAAC;KACnB;SAAM;QACL,OAAO,GAAG,CACR,oBAAC,qBAAqB,IAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,IACpD,IAAI,CAAC,KAAK,IAAI,QAAQ,IAAI,CACzB,4BAAI,IAAI,EAAC,MAAM,gBAAa,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC;YACpF,oBAAC,SAAS,IACR,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,IAAI,EACvB,OAAO,EAAE,OAAO,GAChB,CACC,CACN,CACqB,CACzB,CAAC;KACH;IAED,OAAO,CACL,4BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,kBAAW,OAAO,CAAE,CAAC,EAAE,MAAM,CAAC,UAAU;YAC9E,GAAC,MAAM,CAAC,QAAQ,IAAG,QAAQ;YAC3B,GAAC,MAAM,CAAC,QAAQ,IAAG,QAAQ;YAC3B,GAAC,MAAM,CAAC,WAAW,IAAG,WAAW,IAAI,QAAQ;YAC7C,GAAC,MAAM,CAAC,UAAU,IAAG,IAAI;gBACzB,EACF,IAAI,EAAC,cAAc,EACnB,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,OAAO,EACrB,YAAY,EAAE,OAAO,iBACR,IAAI,CAAC,EAAE,IAEnB,OAAO,CACL,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,+BAA+B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\n\nimport InternalIcon from '../../icon/internal';\nimport ItemsList from '../items-list';\nimport MobileExpandableGroup from '../mobile-expandable-group/mobile-expandable-group';\nimport { CategoryProps } from '../interfaces';\nimport Tooltip from '../tooltip.js';\nimport useHiddenDescription from '../utils/use-hidden-description.js';\nimport { getMenuItemProps } from '../utils/menu-item.js';\n\nconst MobileExpandableCategoryElement = ({\n  item,\n  onItemActivate,\n  onGroupToggle,\n  targetItem,\n  isHighlighted,\n  isExpanded,\n  highlightItem,\n  disabled,\n  variant,\n}: CategoryProps) => {\n  const highlighted = isHighlighted(item);\n  const expanded = isExpanded(item);\n  const triggerRef = React.useRef<HTMLSpanElement>(null);\n\n  useEffect(() => {\n    if (triggerRef.current && highlighted && !expanded) {\n      triggerRef.current.focus();\n    }\n  }, [expanded, highlighted]);\n\n  const onClick = (e: React.MouseEvent) => {\n    if (!disabled) {\n      e.preventDefault();\n      onGroupToggle(item, e);\n    }\n  };\n\n  const onHover = (event: React.SyntheticEvent) => {\n    event.preventDefault();\n    highlightItem(item);\n  };\n\n  const isDisabledWithReason = !!item.disabledReason && item.disabled;\n  const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n  const trigger = item.text && (\n    <span\n      className={clsx(styles.header, styles['expandable-header'], styles[`variant-${variant}`], {\n        [styles.highlighted]: highlighted,\n        [styles['rolled-down']]: expanded,\n        [styles.disabled]: disabled,\n      })}\n      // We are using the roving tabindex technique to manage the focus state of the dropdown.\n      // The current element will always have tabindex=0 which means that it can be tabbed to,\n      // while all other items have tabindex=-1 so we can focus them when necessary.\n      tabIndex={highlighted ? 0 : -1}\n      ref={triggerRef}\n      {...getMenuItemProps({ parent: true, disabled, expanded })}\n      {...(isDisabledWithReason ? targetProps : {})}\n    >\n      {item.text}\n      <span\n        className={clsx(styles['expand-icon'], {\n          [styles['expand-icon-up']]: expanded,\n        })}\n      >\n        <InternalIcon name=\"caret-down-filled\" />\n      </span>\n    </span>\n  );\n\n  let content: React.ReactNode;\n\n  if (isDisabledWithReason) {\n    content = (\n      <>\n        {descriptionEl}\n        <Tooltip content={item.disabledReason}>{trigger}</Tooltip>\n      </>\n    );\n  } else if (disabled) {\n    content = trigger;\n  } else {\n    content = (\n      <MobileExpandableGroup open={expanded} trigger={trigger}>\n        {item.items && expanded && (\n          <ul role=\"menu\" aria-label={item.text} className={clsx(styles['items-list-container'])}>\n            <ItemsList\n              items={item.items}\n              onItemActivate={onItemActivate}\n              onGroupToggle={onGroupToggle}\n              targetItem={targetItem}\n              isHighlighted={isHighlighted}\n              isExpanded={isExpanded}\n              highlightItem={highlightItem}\n              hasCategoryHeader={true}\n              variant={variant}\n            />\n          </ul>\n        )}\n      </MobileExpandableGroup>\n    );\n  }\n\n  return (\n    <li\n      className={clsx(styles.category, styles[`variant-${variant}`], styles.expandable, {\n        [styles.expanded]: expanded,\n        [styles.disabled]: disabled,\n        [styles.highlighted]: highlighted || expanded,\n        [styles.expandable]: true,\n      })}\n      role=\"presentation\"\n      onClick={onClick}\n      onMouseEnter={onHover}\n      onTouchStart={onHover}\n      data-testid={item.id}\n    >\n      {content}\n    </li>\n  );\n};\n\nexport default MobileExpandableCategoryElement;\n"]}
+{"version":3,"file":"mobile-expandable-category-element.js","sourceRoot":"","sources":["../../../../src/button-dropdown/category-elements/mobile-expandable-category-element.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, { useEffect } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\n\nimport InternalIcon from '../../icon/internal';\nimport ItemsList from '../items-list';\nimport MobileExpandableGroup from '../mobile-expandable-group/mobile-expandable-group';\nimport { CategoryProps } from '../interfaces';\nimport Tooltip from '../tooltip.js';\nimport useHiddenDescription from '../utils/use-hidden-description.js';\nimport { getMenuItemProps } from '../utils/menu-item.js';\n\nconst MobileExpandableCategoryElement = ({\n  item,\n  onItemActivate,\n  onGroupToggle,\n  targetItem,\n  isHighlighted,\n  isKeyboardHighlight,\n  isExpanded,\n  highlightItem,\n  disabled,\n  variant,\n}: CategoryProps) => {\n  const highlighted = isHighlighted(item);\n  const expanded = isExpanded(item);\n  const isKeyboardHighlighted = isKeyboardHighlight(item);\n  const triggerRef = React.useRef<HTMLSpanElement>(null);\n\n  useEffect(() => {\n    if (triggerRef.current && highlighted && !expanded) {\n      triggerRef.current.focus();\n    }\n  }, [expanded, highlighted]);\n\n  const onClick = (e: React.MouseEvent) => {\n    if (!disabled) {\n      e.preventDefault();\n      onGroupToggle(item, e);\n    }\n  };\n\n  const onHover = (event: React.SyntheticEvent) => {\n    event.preventDefault();\n    highlightItem(item);\n  };\n\n  const isDisabledWithReason = !!item.disabledReason && item.disabled;\n  const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n  const trigger = item.text && (\n    <span\n      className={clsx(styles.header, styles['expandable-header'], styles[`variant-${variant}`], {\n        [styles.highlighted]: highlighted,\n        [styles['rolled-down']]: expanded,\n        [styles.disabled]: disabled,\n        [styles['is-focused']]: isKeyboardHighlighted,\n      })}\n      // We are using the roving tabindex technique to manage the focus state of the dropdown.\n      // The current element will always have tabindex=0 which means that it can be tabbed to,\n      // while all other items have tabindex=-1 so we can focus them when necessary.\n      tabIndex={highlighted ? 0 : -1}\n      ref={triggerRef}\n      {...getMenuItemProps({ parent: true, disabled, expanded })}\n      {...(isDisabledWithReason ? targetProps : {})}\n    >\n      {item.text}\n      <span\n        className={clsx(styles['expand-icon'], {\n          [styles['expand-icon-up']]: expanded,\n        })}\n      >\n        <InternalIcon name=\"caret-down-filled\" />\n      </span>\n    </span>\n  );\n\n  let content: React.ReactNode;\n\n  if (isDisabledWithReason) {\n    content = (\n      <>\n        {descriptionEl}\n        <Tooltip content={item.disabledReason}>{trigger}</Tooltip>\n      </>\n    );\n  } else if (disabled) {\n    content = trigger;\n  } else {\n    content = (\n      <MobileExpandableGroup open={expanded} trigger={trigger}>\n        {item.items && expanded && (\n          <ul role=\"menu\" aria-label={item.text} className={clsx(styles['items-list-container'])}>\n            <ItemsList\n              items={item.items}\n              onItemActivate={onItemActivate}\n              onGroupToggle={onGroupToggle}\n              targetItem={targetItem}\n              isHighlighted={isHighlighted}\n              isKeyboardHighlight={isKeyboardHighlight}\n              isExpanded={isExpanded}\n              highlightItem={highlightItem}\n              hasCategoryHeader={true}\n              variant={variant}\n            />\n          </ul>\n        )}\n      </MobileExpandableGroup>\n    );\n  }\n\n  return (\n    <li\n      className={clsx(styles.category, styles[`variant-${variant}`], styles.expandable, {\n        [styles.expanded]: expanded,\n        [styles.disabled]: disabled,\n        [styles.highlighted]: highlighted || expanded,\n        [styles.expandable]: true,\n      })}\n      role=\"presentation\"\n      onClick={onClick}\n      onMouseEnter={onHover}\n      onTouchStart={onHover}\n      data-testid={item.id}\n    >\n      {content}\n    </li>\n  );\n};\n\nexport default MobileExpandableCategoryElement;\n"]}

package/button-dropdown/category-elements/styles.css.js

@@ -1,17 +1,18 @@
 
     import './styles.scoped.css';
     export default {
-  "header": "awsui_header_16mm3_o5wv1_93",
-  "disabled": "awsui_disabled_16mm3_o5wv1_108",
-  "expandable-header": "awsui_expandable-header_16mm3_o5wv1_112",
-  "rolled-down": "awsui_rolled-down_16mm3_o5wv1_123",
-  "highlighted": "awsui_highlighted_16mm3_o5wv1_126",
-  "variant-navigation": "awsui_variant-navigation_16mm3_o5wv1_139",
-  "category": "awsui_category_16mm3_o5wv1_151",
-  "expandable": "awsui_expandable_16mm3_o5wv1_112",
-  "expand-icon": "awsui_expand-icon_16mm3_o5wv1_172",
-  "expand-icon-up": "awsui_expand-icon-up_16mm3_o5wv1_179",
-  "expand-icon-right": "awsui_expand-icon-right_16mm3_o5wv1_182",
-  "items-list-container": "awsui_items-list-container_16mm3_o5wv1_196"
+  "header": "awsui_header_16mm3_qwnia_93",
+  "disabled": "awsui_disabled_16mm3_qwnia_108",
+  "expandable-header": "awsui_expandable-header_16mm3_qwnia_112",
+  "rolled-down": "awsui_rolled-down_16mm3_qwnia_123",
+  "highlighted": "awsui_highlighted_16mm3_qwnia_126",
+  "is-focused": "awsui_is-focused_16mm3_qwnia_139",
+  "variant-navigation": "awsui_variant-navigation_16mm3_qwnia_143",
+  "category": "awsui_category_16mm3_qwnia_155",
+  "expandable": "awsui_expandable_16mm3_qwnia_112",
+  "expand-icon": "awsui_expand-icon_16mm3_qwnia_176",
+  "expand-icon-up": "awsui_expand-icon-up_16mm3_qwnia_183",
+  "expand-icon-right": "awsui_expand-icon-right_16mm3_qwnia_186",
+  "items-list-container": "awsui_items-list-container_16mm3_qwnia_200"
 };
   

package/button-dropdown/category-elements/styles.scoped.css

@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_header_16mm3_o5wv1_93:not(#\9) {
+.awsui_header_16mm3_qwnia_93:not(#\9) {
   position: relative;
   margin: 0;
   color: var(--color-text-dropdown-group-label-eaqlcl, #414d5c);
@@ -105,25 +105,25 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 ) calc(var(--space-l-4vl6xu, 20px) + var(--border-item-width-qbbbsa, 2px));
   z-index: 1;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_disabled_16mm3_o5wv1_108:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_disabled_16mm3_qwnia_108:not(#\9) {
   color: var(--color-text-dropdown-item-disabled-varol7, #9ba7b6);
   cursor: default;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112:not(#\9) {
   border-top-color: var(--color-border-dropdown-group-0utpsr, #e9ebed);
   border-bottom-color: var(--color-border-dropdown-group-0utpsr, #e9ebed);
   cursor: pointer;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112.awsui_disabled_16mm3_o5wv1_108:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_disabled_16mm3_qwnia_108:not(#\9) {
   cursor: default;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112:not(#\9):focus {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112:not(#\9):focus {
   outline: none;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112.awsui_rolled-down_16mm3_o5wv1_123:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_rolled-down_16mm3_qwnia_123:not(#\9) {
   border-bottom-color: transparent;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112.awsui_highlighted_16mm3_o5wv1_126:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_highlighted_16mm3_qwnia_126:not(#\9) {
   background-color: var(--color-background-dropdown-item-hover-mqsxkv, #f4f4f4);
   color: var(--color-text-dropdown-item-highlighted-oaabyk, #000716);
   padding: var(--space-xxs-ynfts5, 4px) var(--space-l-4vl6xu, 20px);
@@ -131,16 +131,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-item-u2ibpi, 8px);
   z-index: 2;
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112.awsui_highlighted_16mm3_o5wv1_126.awsui_disabled_16mm3_o5wv1_108:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_highlighted_16mm3_qwnia_126.awsui_disabled_16mm3_qwnia_108:not(#\9) {
   background-color: var(--color-background-dropdown-item-dimmed-qw48ma, transparent);
   border-color: var(--color-border-dropdown-item-dimmed-hover-6dhy15, #7d8998);
   color: var(--color-text-dropdown-item-dimmed-jyqdrs, #9ba7b6);
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112.awsui_variant-navigation_16mm3_o5wv1_139:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_highlighted_16mm3_qwnia_126.awsui_is-focused_16mm3_qwnia_139:not(#\9) {
+  border-color: var(--color-border-item-focused-ap3b6s, #0972d3);
+  box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-srzyiu, 0px) var(--color-border-item-focused-ap3b6s, #0972d3);
+}
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_variant-navigation_16mm3_qwnia_143:not(#\9) {
   padding-top: var(--space-xs-rsr2qu, 8px);
   padding-bottom: var(--space-xs-rsr2qu, 8px);
 }
-.awsui_header_16mm3_o5wv1_93.awsui_expandable-header_16mm3_o5wv1_112.awsui_variant-navigation_16mm3_o5wv1_139.awsui_highlighted_16mm3_o5wv1_126:not(#\9) {
+.awsui_header_16mm3_qwnia_93.awsui_expandable-header_16mm3_qwnia_112.awsui_variant-navigation_16mm3_qwnia_143.awsui_highlighted_16mm3_qwnia_126:not(#\9) {
   border-color: transparent;
   border-top-color: var(--color-border-dropdown-group-0utpsr, #e9ebed);
   border-bottom-color: var(--color-border-dropdown-group-0utpsr, #e9ebed);
@@ -148,52 +152,52 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-accent-s1eqko, #0972d3);
 }
 
-.awsui_category_16mm3_o5wv1_151:not(#\9) {
+.awsui_category_16mm3_qwnia_155:not(#\9) {
   list-style: none;
   margin-top: calc(-1 * var(--border-divider-list-width-hacikr, 1px));
   padding: 0;
 }
-.awsui_category_16mm3_o5wv1_151:not(#\9):first-child {
+.awsui_category_16mm3_qwnia_155:not(#\9):first-child {
   margin-top: 0;
 }
-.awsui_category_16mm3_o5wv1_151.awsui_expandable_16mm3_o5wv1_112:not(#\9) {
+.awsui_category_16mm3_qwnia_155.awsui_expandable_16mm3_qwnia_112:not(#\9) {
   border-top: 0;
 }
-.awsui_category_16mm3_o5wv1_151:not(#\9):last-child {
+.awsui_category_16mm3_qwnia_155:not(#\9):last-child {
   border-bottom: none;
 }
-.awsui_category_16mm3_o5wv1_151.awsui_variant-navigation_16mm3_o5wv1_139:not(#\9) {
+.awsui_category_16mm3_qwnia_155.awsui_variant-navigation_16mm3_qwnia_143:not(#\9) {
   padding-top: var(--space-xxs-ynfts5, 4px);
 }
-.awsui_category_16mm3_o5wv1_151.awsui_variant-navigation_16mm3_o5wv1_139.awsui_expandable_16mm3_o5wv1_112:not(#\9) {
+.awsui_category_16mm3_qwnia_155.awsui_variant-navigation_16mm3_qwnia_143.awsui_expandable_16mm3_qwnia_112:not(#\9) {
   padding-top: 0;
 }
 
-.awsui_expand-icon_16mm3_o5wv1_172:not(#\9) {
+.awsui_expand-icon_16mm3_qwnia_176:not(#\9) {
   position: relative;
   left: var(--space-s-hv8c1d, 12px);
   width: var(--space-m-17eucw, 16px);
   display: inline-block;
   transition: transform var(--motion-duration-rotate-180-ofa1ir, 135ms) var(--motion-easing-rotate-180-3rbbga, cubic-bezier(0.165, 0.84, 0.44, 1));
 }
-.awsui_expand-icon-up_16mm3_o5wv1_179:not(#\9) {
+.awsui_expand-icon-up_16mm3_qwnia_183:not(#\9) {
   transform: rotate(-180deg);
 }
-.awsui_expand-icon-right_16mm3_o5wv1_182:not(#\9) {
+.awsui_expand-icon-right_16mm3_qwnia_186:not(#\9) {
   transform: rotate(-90deg);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_expand-icon_16mm3_o5wv1_172:not(#\9) {
+  .awsui_expand-icon_16mm3_qwnia_176:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_expand-icon_16mm3_o5wv1_172:not(#\9), .awsui-mode-entering .awsui_expand-icon_16mm3_o5wv1_172:not(#\9) {
+.awsui-motion-disabled .awsui_expand-icon_16mm3_qwnia_176:not(#\9), .awsui-mode-entering .awsui_expand-icon_16mm3_qwnia_176:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_items-list-container_16mm3_o5wv1_196:not(#\9) {
+.awsui_items-list-container_16mm3_qwnia_200:not(#\9) {
   padding: 0;
   margin: -1px 0 0 0;
   overflow-y: auto;

package/button-dropdown/category-elements/styles.selectors.js

@@ -2,17 +2,18 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "header": "awsui_header_16mm3_o5wv1_93",
-  "disabled": "awsui_disabled_16mm3_o5wv1_108",
-  "expandable-header": "awsui_expandable-header_16mm3_o5wv1_112",
-  "rolled-down": "awsui_rolled-down_16mm3_o5wv1_123",
-  "highlighted": "awsui_highlighted_16mm3_o5wv1_126",
-  "variant-navigation": "awsui_variant-navigation_16mm3_o5wv1_139",
-  "category": "awsui_category_16mm3_o5wv1_151",
-  "expandable": "awsui_expandable_16mm3_o5wv1_112",
-  "expand-icon": "awsui_expand-icon_16mm3_o5wv1_172",
-  "expand-icon-up": "awsui_expand-icon-up_16mm3_o5wv1_179",
-  "expand-icon-right": "awsui_expand-icon-right_16mm3_o5wv1_182",
-  "items-list-container": "awsui_items-list-container_16mm3_o5wv1_196"
+  "header": "awsui_header_16mm3_qwnia_93",
+  "disabled": "awsui_disabled_16mm3_qwnia_108",
+  "expandable-header": "awsui_expandable-header_16mm3_qwnia_112",
+  "rolled-down": "awsui_rolled-down_16mm3_qwnia_123",
+  "highlighted": "awsui_highlighted_16mm3_qwnia_126",
+  "is-focused": "awsui_is-focused_16mm3_qwnia_139",
+  "variant-navigation": "awsui_variant-navigation_16mm3_qwnia_143",
+  "category": "awsui_category_16mm3_qwnia_155",
+  "expandable": "awsui_expandable_16mm3_qwnia_112",
+  "expand-icon": "awsui_expand-icon_16mm3_qwnia_176",
+  "expand-icon-up": "awsui_expand-icon-up_16mm3_qwnia_183",
+  "expand-icon-right": "awsui_expand-icon-right_16mm3_qwnia_186",
+  "items-list-container": "awsui_items-list-container_16mm3_qwnia_200"
 };
   

package/button-dropdown/interfaces.d.ts

@@ -129,6 +129,7 @@ export interface ButtonDropdownSettings {
 export interface HighlightProps {
     targetItem: ButtonDropdownProps.ItemOrGroup | null;
     isHighlighted: (item: ButtonDropdownProps.ItemOrGroup) => boolean;
+    isKeyboardHighlight: (item: ButtonDropdownProps.ItemOrGroup) => boolean;
     isExpanded: (group: ButtonDropdownProps.ItemGroup) => boolean;
     highlightItem: (item: ButtonDropdownProps.ItemOrGroup) => void;
 }
@@ -164,6 +165,7 @@ export interface ItemProps {
     first?: boolean;
     last: boolean;
     hasCategoryHeader: boolean;
+    isKeyboardHighlighted?: boolean;
     variant?: ItemListProps['variant'];
 }
 export interface InternalButtonDropdownProps extends Omit<ButtonDropdownProps, 'variant'>, InternalBaseComponentProps {

package/button-dropdown/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/interfaces.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/interfaces.ts"],"names":[],"mappings":"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"}

package/button-dropdown/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/button-dropdown/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { BaseNavigationDetail, CancelableEventHandler } from '../internal/events';\nimport { IconProps } from '../icon/interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nexport interface ButtonDropdownProps extends BaseComponentProps {\n  /**\n   * Array of objects, each having the following properties:\n\n   * - `id` (string) - allows to identify the item that the user clicked on. Mandatory for individual items, optional for categories.\n\n   * - `text` (string) - description shown in the menu for this item. Mandatory for individual items, optional for categories.\n\n   * - `disabled` (boolean) - whether the item is disabled. Disabled items are not clickable, but they can be highlighted with the keyboard to make them accessible.\n\n   * - `disabledReason` (string) - (Optional) Displays text near the `text` property when item is disabled. Use to provide additional context.\n\n   * - `items` (ReadonlyArray<Item>): an array of item objects. Items will be rendered as nested menu items but only for the first nesting level, multi-nesting is not supported.\n   * An item which belongs to nested group has the following properties: `id`, `text`, `disabled` and `description`.\n\n   * - `description` (string) - additional data that will be passed to a `data-description` attribute.\n\n   * - `href` (string) - (Optional) Defines the target URL of the menu item, turning it into a link.\n\n   * - `external` (boolean) - Marks a menu item as external by adding an icon after the menu item text. The link will open in a new tab when clicked. Note that this only works when `href` is also provided.\n\n   * - `externalIconAriaLabel` (string) - Adds an `aria-label` to the external icon.\n\n   * - `iconName` (string) - (Optional) Specifies the name of the icon, used with the [icon component](/components/icon/).\n\n   * - `iconAlt` (string) - (Optional) Specifies alternate text for the icon when using `iconUrl`.\n\n   * - `iconUrl` (string) - (Optional) Specifies the URL of a custom icon.\n\n   * - `iconSvg` (ReactNode) - (Optional) Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n\n   */\n  items: ReadonlyArray<ButtonDropdownProps.ItemOrGroup>;\n  /**\n   * Determines whether the button dropdown is disabled. Users cannot interact with the control if it's disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Renders the button as being in a loading state. It takes precedence over the `disabled` if both are set to `true`.\n   * It prevents clicks.\n   */\n  loading?: boolean;\n  /** Determines the general styling of the button dropdown.\n   * * `primary` for primary buttons\n   * * `normal` for secondary buttons\n   * * `icon` for icon buttons\n   */\n  variant?: ButtonDropdownProps.Variant;\n  /**\n   * Controls expandability of the item groups.\n   */\n  expandableGroups?: boolean;\n  /**\n   * By default, the dropdown height is constrained to fit inside the height of its parent element.\n   * Enabling this property will allow the dropdown to extend beyond its parent by using fixed positioning and\n   * [React Portals](https://reactjs.org/docs/portals.html).\n   * If you want the dropdown to ignore the `overflow` CSS property of its parents,\n   * such as in a split view layout, enable this property.\n   * However, use discretion.\n   * If you don't need to, we recommend you don't enable this property because there is a known issue with\n   * the '[aria-owns](https://a11ysupport.io/tech/aria/aria-owns_attribute)' attribute in Safari with VoiceOver that\n   * prevents VO specific controls (CTRL+OPT+Left/Right) from entering a dropdown on Safari due to its position in the DOM.\n   * If you don't need to, we also recommend you don't enable this property because fixed positioning results\n   * in a slight, visible lag when scrolling complex pages.\n   */\n  expandToViewport?: boolean;\n  /**\n   * Adds `aria-label` to the button dropdown trigger.\n   * It should be used in buttons that don't have text in order to make them accessible.\n   */\n  ariaLabel?: string;\n  /**\n   * Text displayed in the button dropdown trigger.\n   * @displayname text\n   */\n  children?: React.ReactNode;\n  /**\n   * Called when the user clicks on an item, and the item is not disabled.  The event detail object contains the id of the clicked item.\n   */\n  onItemClick?: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;\n  /**\n   * Called when the user clicks on an item with the left mouse button without pressing\n   * modifier keys (that is, CTRL, ALT, SHIFT, META), and the item has an `href` set.\n   */\n  onItemFollow?: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;\n}\n\nexport namespace ButtonDropdownProps {\n  export type Variant = 'normal' | 'primary' | 'icon';\n\n  export interface Item {\n    id: string;\n    text: string;\n    disabled?: boolean;\n    disabledReason?: string;\n    description?: string;\n    href?: string;\n    external?: boolean;\n    externalIconAriaLabel?: string;\n    iconAlt?: string;\n    iconName?: IconProps.Name;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n  }\n\n  export interface ItemGroup extends Omit<Item, 'id' | 'text'> {\n    id?: string;\n    text?: string;\n    items: Items;\n  }\n\n  export type ItemOrGroup = Item | ItemGroup;\n\n  export type Items = ReadonlyArray<ItemOrGroup>;\n\n  export interface ItemClickDetails extends BaseNavigationDetail {\n    id: string;\n  }\n\n  export interface Ref {\n    /**\n     * Focuses the underlying native button.\n     */\n    focus(): void;\n  }\n}\n\nexport interface ButtonDropdownSettings {\n  // this means whether action is required to make group expand\n  hasExpandableGroups: boolean;\n  // on smaller screens expandable groups are integrated into parent dropdown\n  // this changes keyboard navigation, highlight and activation behavior for parent dropdown\n  isInRestrictedView?: boolean;\n}\n\nexport interface HighlightProps {\n  targetItem: ButtonDropdownProps.ItemOrGroup | null;\n  isHighlighted: (item: ButtonDropdownProps.ItemOrGroup) => boolean;\n  isExpanded: (group: ButtonDropdownProps.ItemGroup) => boolean;\n  highlightItem: (item: ButtonDropdownProps.ItemOrGroup) => void;\n}\n\nexport type GroupToggle = (item: ButtonDropdownProps.ItemGroup, event: React.SyntheticEvent) => void;\nexport type ItemActivate = (item: ButtonDropdownProps.Item, event: React.MouseEvent | React.KeyboardEvent) => void;\n\nexport interface CategoryProps extends HighlightProps {\n  item: ButtonDropdownProps.ItemGroup;\n  onGroupToggle: GroupToggle;\n  onItemActivate: ItemActivate;\n  disabled: boolean;\n  expandToViewport?: boolean;\n  variant?: ItemListProps['variant'];\n}\n\nexport interface ItemListProps extends HighlightProps {\n  items: ButtonDropdownProps.Items;\n  onGroupToggle: GroupToggle;\n  onItemActivate: ItemActivate;\n  categoryDisabled?: boolean;\n  hasExpandableGroups?: boolean;\n  hasCategoryHeader?: boolean;\n  expandToViewport?: boolean;\n  variant?: InternalButtonDropdownProps['variant'];\n}\n\nexport interface LinkItem extends ButtonDropdownProps.Item {\n  href: string;\n}\n\nexport interface ItemProps {\n  item: ButtonDropdownProps.Item | LinkItem;\n  disabled: boolean;\n  highlighted: boolean;\n  onItemActivate: ItemActivate;\n  highlightItem: (item: ButtonDropdownProps.ItemOrGroup) => void;\n  first?: boolean;\n  last: boolean;\n  hasCategoryHeader: boolean;\n  variant?: ItemListProps['variant'];\n}\n\nexport interface InternalButtonDropdownProps extends Omit<ButtonDropdownProps, 'variant'>, InternalBaseComponentProps {\n  customTriggerBuilder?: (\n    clickHandler: () => void,\n    ref: React.Ref<any>,\n    isDisabled: boolean,\n    isExpanded: boolean,\n    ariaLabel?: string\n  ) => React.ReactNode;\n  variant?: ButtonDropdownProps['variant'] | 'navigation';\n\n  /**\n   * Optional text that is displayed as the title at the top of the dropdown.\n   */\n  title?: string;\n\n  /**\n   * Optional text that is displayed underneath the title at the top of the dropdown.\n   */\n  description?: string;\n\n  /**\n   * Determines that the dropdown should preferably be aligned to the center of the trigger\n   * instead of dropping left or right.\n   */\n  preferCenter?: boolean;\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/button-dropdown/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { BaseNavigationDetail, CancelableEventHandler } from '../internal/events';\nimport { IconProps } from '../icon/interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nexport interface ButtonDropdownProps extends BaseComponentProps {\n  /**\n   * Array of objects, each having the following properties:\n\n   * - `id` (string) - allows to identify the item that the user clicked on. Mandatory for individual items, optional for categories.\n\n   * - `text` (string) - description shown in the menu for this item. Mandatory for individual items, optional for categories.\n\n   * - `disabled` (boolean) - whether the item is disabled. Disabled items are not clickable, but they can be highlighted with the keyboard to make them accessible.\n\n   * - `disabledReason` (string) - (Optional) Displays text near the `text` property when item is disabled. Use to provide additional context.\n\n   * - `items` (ReadonlyArray<Item>): an array of item objects. Items will be rendered as nested menu items but only for the first nesting level, multi-nesting is not supported.\n   * An item which belongs to nested group has the following properties: `id`, `text`, `disabled` and `description`.\n\n   * - `description` (string) - additional data that will be passed to a `data-description` attribute.\n\n   * - `href` (string) - (Optional) Defines the target URL of the menu item, turning it into a link.\n\n   * - `external` (boolean) - Marks a menu item as external by adding an icon after the menu item text. The link will open in a new tab when clicked. Note that this only works when `href` is also provided.\n\n   * - `externalIconAriaLabel` (string) - Adds an `aria-label` to the external icon.\n\n   * - `iconName` (string) - (Optional) Specifies the name of the icon, used with the [icon component](/components/icon/).\n\n   * - `iconAlt` (string) - (Optional) Specifies alternate text for the icon when using `iconUrl`.\n\n   * - `iconUrl` (string) - (Optional) Specifies the URL of a custom icon.\n\n   * - `iconSvg` (ReactNode) - (Optional) Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n\n   */\n  items: ReadonlyArray<ButtonDropdownProps.ItemOrGroup>;\n  /**\n   * Determines whether the button dropdown is disabled. Users cannot interact with the control if it's disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Renders the button as being in a loading state. It takes precedence over the `disabled` if both are set to `true`.\n   * It prevents clicks.\n   */\n  loading?: boolean;\n  /** Determines the general styling of the button dropdown.\n   * * `primary` for primary buttons\n   * * `normal` for secondary buttons\n   * * `icon` for icon buttons\n   */\n  variant?: ButtonDropdownProps.Variant;\n  /**\n   * Controls expandability of the item groups.\n   */\n  expandableGroups?: boolean;\n  /**\n   * By default, the dropdown height is constrained to fit inside the height of its parent element.\n   * Enabling this property will allow the dropdown to extend beyond its parent by using fixed positioning and\n   * [React Portals](https://reactjs.org/docs/portals.html).\n   * If you want the dropdown to ignore the `overflow` CSS property of its parents,\n   * such as in a split view layout, enable this property.\n   * However, use discretion.\n   * If you don't need to, we recommend you don't enable this property because there is a known issue with\n   * the '[aria-owns](https://a11ysupport.io/tech/aria/aria-owns_attribute)' attribute in Safari with VoiceOver that\n   * prevents VO specific controls (CTRL+OPT+Left/Right) from entering a dropdown on Safari due to its position in the DOM.\n   * If you don't need to, we also recommend you don't enable this property because fixed positioning results\n   * in a slight, visible lag when scrolling complex pages.\n   */\n  expandToViewport?: boolean;\n  /**\n   * Adds `aria-label` to the button dropdown trigger.\n   * It should be used in buttons that don't have text in order to make them accessible.\n   */\n  ariaLabel?: string;\n  /**\n   * Text displayed in the button dropdown trigger.\n   * @displayname text\n   */\n  children?: React.ReactNode;\n  /**\n   * Called when the user clicks on an item, and the item is not disabled.  The event detail object contains the id of the clicked item.\n   */\n  onItemClick?: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;\n  /**\n   * Called when the user clicks on an item with the left mouse button without pressing\n   * modifier keys (that is, CTRL, ALT, SHIFT, META), and the item has an `href` set.\n   */\n  onItemFollow?: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;\n}\n\nexport namespace ButtonDropdownProps {\n  export type Variant = 'normal' | 'primary' | 'icon';\n\n  export interface Item {\n    id: string;\n    text: string;\n    disabled?: boolean;\n    disabledReason?: string;\n    description?: string;\n    href?: string;\n    external?: boolean;\n    externalIconAriaLabel?: string;\n    iconAlt?: string;\n    iconName?: IconProps.Name;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n  }\n\n  export interface ItemGroup extends Omit<Item, 'id' | 'text'> {\n    id?: string;\n    text?: string;\n    items: Items;\n  }\n\n  export type ItemOrGroup = Item | ItemGroup;\n\n  export type Items = ReadonlyArray<ItemOrGroup>;\n\n  export interface ItemClickDetails extends BaseNavigationDetail {\n    id: string;\n  }\n\n  export interface Ref {\n    /**\n     * Focuses the underlying native button.\n     */\n    focus(): void;\n  }\n}\n\nexport interface ButtonDropdownSettings {\n  // this means whether action is required to make group expand\n  hasExpandableGroups: boolean;\n  // on smaller screens expandable groups are integrated into parent dropdown\n  // this changes keyboard navigation, highlight and activation behavior for parent dropdown\n  isInRestrictedView?: boolean;\n}\n\nexport interface HighlightProps {\n  targetItem: ButtonDropdownProps.ItemOrGroup | null;\n  isHighlighted: (item: ButtonDropdownProps.ItemOrGroup) => boolean;\n  isKeyboardHighlight: (item: ButtonDropdownProps.ItemOrGroup) => boolean;\n  isExpanded: (group: ButtonDropdownProps.ItemGroup) => boolean;\n  highlightItem: (item: ButtonDropdownProps.ItemOrGroup) => void;\n}\n\nexport type GroupToggle = (item: ButtonDropdownProps.ItemGroup, event: React.SyntheticEvent) => void;\nexport type ItemActivate = (item: ButtonDropdownProps.Item, event: React.MouseEvent | React.KeyboardEvent) => void;\n\nexport interface CategoryProps extends HighlightProps {\n  item: ButtonDropdownProps.ItemGroup;\n  onGroupToggle: GroupToggle;\n  onItemActivate: ItemActivate;\n  disabled: boolean;\n  expandToViewport?: boolean;\n  variant?: ItemListProps['variant'];\n}\n\nexport interface ItemListProps extends HighlightProps {\n  items: ButtonDropdownProps.Items;\n  onGroupToggle: GroupToggle;\n  onItemActivate: ItemActivate;\n  categoryDisabled?: boolean;\n  hasExpandableGroups?: boolean;\n  hasCategoryHeader?: boolean;\n  expandToViewport?: boolean;\n  variant?: InternalButtonDropdownProps['variant'];\n}\n\nexport interface LinkItem extends ButtonDropdownProps.Item {\n  href: string;\n}\n\nexport interface ItemProps {\n  item: ButtonDropdownProps.Item | LinkItem;\n  disabled: boolean;\n  highlighted: boolean;\n  onItemActivate: ItemActivate;\n  highlightItem: (item: ButtonDropdownProps.ItemOrGroup) => void;\n  first?: boolean;\n  last: boolean;\n  hasCategoryHeader: boolean;\n  isKeyboardHighlighted?: boolean;\n  variant?: ItemListProps['variant'];\n}\n\nexport interface InternalButtonDropdownProps extends Omit<ButtonDropdownProps, 'variant'>, InternalBaseComponentProps {\n  customTriggerBuilder?: (\n    clickHandler: () => void,\n    ref: React.Ref<any>,\n    isDisabled: boolean,\n    isExpanded: boolean,\n    ariaLabel?: string\n  ) => React.ReactNode;\n  variant?: ButtonDropdownProps['variant'] | 'navigation';\n\n  /**\n   * Optional text that is displayed as the title at the top of the dropdown.\n   */\n  title?: string;\n\n  /**\n   * Optional text that is displayed underneath the title at the top of the dropdown.\n   */\n  description?: string;\n\n  /**\n   * Determines that the dropdown should preferably be aligned to the center of the trigger\n   * instead of dropping left or right.\n   */\n  preferCenter?: boolean;\n}\n"]}

package/button-dropdown/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,EAAE,mBAAmB,EAAE,2BAA2B,EAAE,MAAM,cAAc,CAAC;AAehF,QAAA,MAAM,sBAAsB,6GAgL3B,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,EAAE,mBAAmB,EAAE,2BAA2B,EAAE,MAAM,cAAc,CAAC;AAehF,QAAA,MAAM,sBAAsB,6GA+K3B,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/button-dropdown/internal.js

@@ -19,7 +19,6 @@ import { checkSafeUrl } from '../internal/utils/check-safe-url';
 var InternalButtonDropdown = React.forwardRef(function (_a, ref) {
     var items = _a.items, _b = _a.variant, variant = _b === void 0 ? 'normal' : _b, _c = _a.loading, loading = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.expandableGroups, expandableGroups = _e === void 0 ? false : _e, children = _a.children, onItemClick = _a.onItemClick, onItemFollow = _a.onItemFollow, customTriggerBuilder = _a.customTriggerBuilder, expandToViewport = _a.expandToViewport, ariaLabel = _a.ariaLabel, title = _a.title, description = _a.description, preferCenter = _a.preferCenter, __internalRootRef = _a.__internalRootRef, props = __rest(_a, ["items", "variant", "loading", "disabled", "expandableGroups", "children", "onItemClick", "onItemFollow", "customTriggerBuilder", "expandToViewport", "ariaLabel", "title", "description", "preferCenter", "__internalRootRef"]);
     var isInRestrictedView = useMobile();
-    var usingMouse = useRef(true);
     var dropdownId = useUniqueId('dropdown');
     for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
         var item = items_1[_i];
@@ -30,19 +29,15 @@ var InternalButtonDropdown = React.forwardRef(function (_a, ref) {
         onItemClick: onItemClick,
         onItemFollow: onItemFollow,
         hasExpandableGroups: expandableGroups,
-        isInRestrictedView: isInRestrictedView,
-        usingMouse: usingMouse
-    }), isOpen = _f.isOpen, targetItem = _f.targetItem, isHighlighted = _f.isHighlighted, isExpanded = _f.isExpanded, highlightItem = _f.highlightItem, onKeyDown = _f.onKeyDown, onKeyUp = _f.onKeyUp, onItemActivate = _f.onItemActivate, onGroupToggle = _f.onGroupToggle, toggleDropdown = _f.toggleDropdown;
+        isInRestrictedView: isInRestrictedView
+    }), isOpen = _f.isOpen, targetItem = _f.targetItem, isHighlighted = _f.isHighlighted, isKeyboardHighlight = _f.isKeyboardHighlight, isExpanded = _f.isExpanded, highlightItem = _f.highlightItem, onKeyDown = _f.onKeyDown, onKeyUp = _f.onKeyUp, onItemActivate = _f.onItemActivate, onGroupToggle = _f.onGroupToggle, toggleDropdown = _f.toggleDropdown, setIsUsingMouse = _f.setIsUsingMouse;
     var handleMouseEvent = function () {
-        usingMouse.current = true;
+        setIsUsingMouse(true);
     };
     var baseProps = getBaseProps(props);
     var dropdownRef = useRef(null);
     useForwardFocus(ref, dropdownRef);
     var clickHandler = function () {
-        if (!usingMouse.current) {
-            return;
-        }
         if (!loading && !disabled) {
             toggleDropdown();
             if (dropdownRef.current) {
@@ -73,7 +68,7 @@ var InternalButtonDropdown = React.forwardRef(function (_a, ref) {
         }, ariaLabel: ariaLabel, "aria-haspopup": true, ariaExpanded: canBeOpened && isOpen, formAction: "none" }), children));
     var hasHeader = title || description;
     var headerId = useUniqueId('awsui-button-dropdown__header');
-    return (React.createElement("div", __assign({}, baseProps, { onKeyDown: onKeyDown, onKeyUp: onKeyUp, onMouseDown: handleMouseEvent, className: clsx(styles['button-dropdown'], styles["variant-".concat(variant)], baseProps.className), "aria-owns": expandToViewport && isOpen ? dropdownId : undefined, ref: __internalRootRef }),
+    return (React.createElement("div", __assign({}, baseProps, { onKeyDown: onKeyDown, onKeyUp: onKeyUp, onMouseDown: handleMouseEvent, onMouseMove: handleMouseEvent, className: clsx(styles['button-dropdown'], styles["variant-".concat(variant)], baseProps.className), "aria-owns": expandToViewport && isOpen ? dropdownId : undefined, ref: __internalRootRef }),
         React.createElement(Dropdown, { open: canBeOpened && isOpen, stretchWidth: false, stretchTriggerHeight: variant === 'navigation', expandToViewport: expandToViewport, preferCenter: preferCenter, onDropdownClose: function () {
                 toggleDropdown();
             }, trigger: trigger, dropdownId: dropdownId },
@@ -83,7 +78,7 @@ var InternalButtonDropdown = React.forwardRef(function (_a, ref) {
                 description && (React.createElement(InternalBox, { fontSize: "body-s" },
                     React.createElement("span", { className: styles.description }, description))))),
             React.createElement(OptionsList, { open: canBeOpened && isOpen, position: "static", role: "menu", decreaseTopMargin: true, ariaLabelledby: hasHeader ? headerId : undefined },
-                React.createElement(ItemsList, { items: items, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, hasExpandableGroups: expandableGroups, targetItem: targetItem, isHighlighted: isHighlighted, isExpanded: isExpanded, highlightItem: highlightItem, expandToViewport: expandToViewport, variant: variant })))));
+                React.createElement(ItemsList, { items: items, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, hasExpandableGroups: expandableGroups, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, highlightItem: highlightItem, expandToViewport: expandToViewport, variant: variant })))));
 });
 export default InternalButtonDropdown;
 //# sourceMappingURL=internal.js.map

package/button-dropdown/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-dropdown/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { ButtonDropdownProps, InternalButtonDropdownProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport Dropdown from '../internal/components/dropdown';\nimport ItemsList from './items-list';\nimport { useButtonDropdown } from './utils/use-button-dropdown';\nimport OptionsList from '../internal/components/options-list';\nimport { InternalButton } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { usePrevious } from '../internal/hooks/use-previous';\nimport InternalBox from '../box/internal';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\n\nconst InternalButtonDropdown = React.forwardRef(\n  (\n    {\n      items,\n      variant = 'normal',\n      loading = false,\n      disabled = false,\n      expandableGroups = false,\n      children,\n      onItemClick,\n      onItemFollow,\n      customTriggerBuilder,\n      expandToViewport,\n      ariaLabel,\n      title,\n      description,\n      preferCenter,\n      __internalRootRef,\n      ...props\n    }: InternalButtonDropdownProps,\n    ref: React.Ref<ButtonDropdownProps.Ref>\n  ) => {\n    const isInRestrictedView = useMobile();\n    const usingMouse = useRef(true);\n    const dropdownId = useUniqueId('dropdown');\n    for (const item of items) {\n      checkSafeUrl('ButtonDropdown', item.href);\n    }\n\n    const {\n      isOpen,\n      targetItem,\n      isHighlighted,\n      isExpanded,\n      highlightItem,\n      onKeyDown,\n      onKeyUp,\n      onItemActivate,\n      onGroupToggle,\n      toggleDropdown,\n    } = useButtonDropdown({\n      items,\n      onItemClick,\n      onItemFollow,\n      hasExpandableGroups: expandableGroups,\n      isInRestrictedView,\n      usingMouse,\n    });\n\n    const handleMouseEvent = () => {\n      usingMouse.current = true;\n    };\n\n    const baseProps = getBaseProps(props);\n\n    const dropdownRef = useRef<HTMLElement>(null);\n    useForwardFocus(ref, dropdownRef);\n\n    const clickHandler = () => {\n      if (!usingMouse.current) {\n        return;\n      }\n      if (!loading && !disabled) {\n        toggleDropdown();\n        if (dropdownRef.current) {\n          dropdownRef.current.focus();\n        }\n      }\n    };\n\n    const canBeOpened = !loading && !disabled;\n    const wasOpen = usePrevious(isOpen);\n\n    useEffect(() => {\n      if (!isOpen && dropdownRef.current && wasOpen) {\n        dropdownRef.current.focus();\n      }\n    }, [isOpen, wasOpen]);\n\n    const triggerVariant = variant === 'navigation' ? undefined : variant;\n    const iconProps: Partial<ButtonProps & { __iconClass?: string }> =\n      variant === 'icon'\n        ? {\n            iconName: 'ellipsis',\n          }\n        : {\n            iconName: 'caret-down-filled',\n            iconAlign: 'right',\n            __iconClass: canBeOpened && isOpen ? styles['rotate-up'] : styles['rotate-down'],\n          };\n\n    const trigger = customTriggerBuilder ? (\n      customTriggerBuilder(clickHandler, dropdownRef, disabled, isOpen, ariaLabel)\n    ) : (\n      <InternalButton\n        ref={dropdownRef}\n        {...iconProps}\n        variant={triggerVariant}\n        loading={loading}\n        disabled={disabled}\n        onClick={(event: Event) => {\n          event.preventDefault();\n          clickHandler();\n        }}\n        ariaLabel={ariaLabel}\n        aria-haspopup={true}\n        ariaExpanded={canBeOpened && isOpen}\n        formAction=\"none\"\n      >\n        {children}\n      </InternalButton>\n    );\n\n    const hasHeader = title || description;\n    const headerId = useUniqueId('awsui-button-dropdown__header');\n\n    return (\n      <div\n        {...baseProps}\n        onKeyDown={onKeyDown}\n        onKeyUp={onKeyUp}\n        onMouseDown={handleMouseEvent}\n        className={clsx(styles['button-dropdown'], styles[`variant-${variant}`], baseProps.className)}\n        aria-owns={expandToViewport && isOpen ? dropdownId : undefined}\n        ref={__internalRootRef}\n      >\n        <Dropdown\n          open={canBeOpened && isOpen}\n          stretchWidth={false}\n          stretchTriggerHeight={variant === 'navigation'}\n          expandToViewport={expandToViewport}\n          preferCenter={preferCenter}\n          onDropdownClose={() => {\n            toggleDropdown();\n          }}\n          trigger={trigger}\n          dropdownId={dropdownId}\n        >\n          {hasHeader && (\n            <div className={styles.header} id={headerId}>\n              {title && (\n                <InternalBox fontSize=\"heading-s\" fontWeight=\"bold\">\n                  <span className={styles.title}>{title}</span>\n                </InternalBox>\n              )}\n              {description && (\n                <InternalBox fontSize=\"body-s\">\n                  <span className={styles.description}>{description}</span>\n                </InternalBox>\n              )}\n            </div>\n          )}\n          <OptionsList\n            open={canBeOpened && isOpen}\n            position=\"static\"\n            role=\"menu\"\n            decreaseTopMargin={true}\n            ariaLabelledby={hasHeader ? headerId : undefined}\n          >\n            <ItemsList\n              items={items}\n              onItemActivate={onItemActivate}\n              onGroupToggle={onGroupToggle}\n              hasExpandableGroups={expandableGroups}\n              targetItem={targetItem}\n              isHighlighted={isHighlighted}\n              isExpanded={isExpanded}\n              highlightItem={highlightItem}\n              expandToViewport={expandToViewport}\n              variant={variant}\n            />\n          </OptionsList>\n        </Dropdown>\n      </div>\n    );\n  }\n);\n\nexport default InternalButtonDropdown;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-dropdown/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { ButtonDropdownProps, InternalButtonDropdownProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport Dropdown from '../internal/components/dropdown';\nimport ItemsList from './items-list';\nimport { useButtonDropdown } from './utils/use-button-dropdown';\nimport OptionsList from '../internal/components/options-list';\nimport { InternalButton } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { usePrevious } from '../internal/hooks/use-previous';\nimport InternalBox from '../box/internal';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\n\nconst InternalButtonDropdown = React.forwardRef(\n  (\n    {\n      items,\n      variant = 'normal',\n      loading = false,\n      disabled = false,\n      expandableGroups = false,\n      children,\n      onItemClick,\n      onItemFollow,\n      customTriggerBuilder,\n      expandToViewport,\n      ariaLabel,\n      title,\n      description,\n      preferCenter,\n      __internalRootRef,\n      ...props\n    }: InternalButtonDropdownProps,\n    ref: React.Ref<ButtonDropdownProps.Ref>\n  ) => {\n    const isInRestrictedView = useMobile();\n    const dropdownId = useUniqueId('dropdown');\n    for (const item of items) {\n      checkSafeUrl('ButtonDropdown', item.href);\n    }\n\n    const {\n      isOpen,\n      targetItem,\n      isHighlighted,\n      isKeyboardHighlight,\n      isExpanded,\n      highlightItem,\n      onKeyDown,\n      onKeyUp,\n      onItemActivate,\n      onGroupToggle,\n      toggleDropdown,\n      setIsUsingMouse,\n    } = useButtonDropdown({\n      items,\n      onItemClick,\n      onItemFollow,\n      hasExpandableGroups: expandableGroups,\n      isInRestrictedView,\n    });\n\n    const handleMouseEvent = () => {\n      setIsUsingMouse(true);\n    };\n\n    const baseProps = getBaseProps(props);\n\n    const dropdownRef = useRef<HTMLElement>(null);\n    useForwardFocus(ref, dropdownRef);\n\n    const clickHandler = () => {\n      if (!loading && !disabled) {\n        toggleDropdown();\n        if (dropdownRef.current) {\n          dropdownRef.current.focus();\n        }\n      }\n    };\n\n    const canBeOpened = !loading && !disabled;\n    const wasOpen = usePrevious(isOpen);\n\n    useEffect(() => {\n      if (!isOpen && dropdownRef.current && wasOpen) {\n        dropdownRef.current.focus();\n      }\n    }, [isOpen, wasOpen]);\n\n    const triggerVariant = variant === 'navigation' ? undefined : variant;\n    const iconProps: Partial<ButtonProps & { __iconClass?: string }> =\n      variant === 'icon'\n        ? {\n            iconName: 'ellipsis',\n          }\n        : {\n            iconName: 'caret-down-filled',\n            iconAlign: 'right',\n            __iconClass: canBeOpened && isOpen ? styles['rotate-up'] : styles['rotate-down'],\n          };\n\n    const trigger = customTriggerBuilder ? (\n      customTriggerBuilder(clickHandler, dropdownRef, disabled, isOpen, ariaLabel)\n    ) : (\n      <InternalButton\n        ref={dropdownRef}\n        {...iconProps}\n        variant={triggerVariant}\n        loading={loading}\n        disabled={disabled}\n        onClick={(event: Event) => {\n          event.preventDefault();\n          clickHandler();\n        }}\n        ariaLabel={ariaLabel}\n        aria-haspopup={true}\n        ariaExpanded={canBeOpened && isOpen}\n        formAction=\"none\"\n      >\n        {children}\n      </InternalButton>\n    );\n\n    const hasHeader = title || description;\n    const headerId = useUniqueId('awsui-button-dropdown__header');\n\n    return (\n      <div\n        {...baseProps}\n        onKeyDown={onKeyDown}\n        onKeyUp={onKeyUp}\n        onMouseDown={handleMouseEvent}\n        onMouseMove={handleMouseEvent}\n        className={clsx(styles['button-dropdown'], styles[`variant-${variant}`], baseProps.className)}\n        aria-owns={expandToViewport && isOpen ? dropdownId : undefined}\n        ref={__internalRootRef}\n      >\n        <Dropdown\n          open={canBeOpened && isOpen}\n          stretchWidth={false}\n          stretchTriggerHeight={variant === 'navigation'}\n          expandToViewport={expandToViewport}\n          preferCenter={preferCenter}\n          onDropdownClose={() => {\n            toggleDropdown();\n          }}\n          trigger={trigger}\n          dropdownId={dropdownId}\n        >\n          {hasHeader && (\n            <div className={styles.header} id={headerId}>\n              {title && (\n                <InternalBox fontSize=\"heading-s\" fontWeight=\"bold\">\n                  <span className={styles.title}>{title}</span>\n                </InternalBox>\n              )}\n              {description && (\n                <InternalBox fontSize=\"body-s\">\n                  <span className={styles.description}>{description}</span>\n                </InternalBox>\n              )}\n            </div>\n          )}\n          <OptionsList\n            open={canBeOpened && isOpen}\n            position=\"static\"\n            role=\"menu\"\n            decreaseTopMargin={true}\n            ariaLabelledby={hasHeader ? headerId : undefined}\n          >\n            <ItemsList\n              items={items}\n              onItemActivate={onItemActivate}\n              onGroupToggle={onGroupToggle}\n              hasExpandableGroups={expandableGroups}\n              targetItem={targetItem}\n              isHighlighted={isHighlighted}\n              isKeyboardHighlight={isKeyboardHighlight}\n              isExpanded={isExpanded}\n              highlightItem={highlightItem}\n              expandToViewport={expandToViewport}\n              variant={variant}\n            />\n          </OptionsList>\n        </Dropdown>\n      </div>\n    );\n  }\n);\n\nexport default InternalButtonDropdown;\n"]}

package/button-dropdown/item-element/index.d.ts

@@ -1,4 +1,4 @@
 import { ItemProps } from '../interfaces';
-declare const ItemElement: ({ item, disabled, onItemActivate, highlighted, highlightItem, first, last, hasCategoryHeader, variant, }: ItemProps) => JSX.Element;
+declare const ItemElement: ({ item, disabled, onItemActivate, highlighted, highlightItem, first, last, hasCategoryHeader, isKeyboardHighlighted, variant, }: ItemProps) => JSX.Element;
 export default ItemElement;
 //# sourceMappingURL=index.d.ts.map

package/button-dropdown/item-element/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/item-element/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAY1C,QAAA,MAAM,WAAW,6GAUd,SAAS,gBAsCX,CAAC;AAkFF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/item-element/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAY1C,QAAA,MAAM,WAAW,oIAWd,SAAS,gBAuCX,CAAC;AAkFF,eAAe,WAAW,CAAC"}

package/button-dropdown/item-element/index.js

@@ -13,7 +13,7 @@ import { useDropdownContext } from '../../internal/components/dropdown/context';
 import { getMenuItemProps } from '../utils/menu-item';
 var ItemElement = function (_a) {
     var _b;
-    var item = _a.item, disabled = _a.disabled, onItemActivate = _a.onItemActivate, highlighted = _a.highlighted, highlightItem = _a.highlightItem, _c = _a.first, first = _c === void 0 ? false : _c, last = _a.last, hasCategoryHeader = _a.hasCategoryHeader, _d = _a.variant, variant = _d === void 0 ? 'normal' : _d;
+    var item = _a.item, disabled = _a.disabled, onItemActivate = _a.onItemActivate, highlighted = _a.highlighted, highlightItem = _a.highlightItem, _c = _a.first, first = _c === void 0 ? false : _c, last = _a.last, hasCategoryHeader = _a.hasCategoryHeader, _d = _a.isKeyboardHighlighted, isKeyboardHighlighted = _d === void 0 ? false : _d, _e = _a.variant, variant = _e === void 0 ? 'normal' : _e;
     var isLink = isLinkItem(item);
     var onClick = function (event) {
         // Stop propagation to parent node and handle event exclusively in here. This ensures
@@ -36,6 +36,7 @@ var ItemElement = function (_a) {
             _b[styles.first] = first,
             _b[styles.last] = last,
             _b[styles['has-category-header']] = hasCategoryHeader,
+            _b[styles['is-focused']] = isKeyboardHighlighted,
             _b)), role: "presentation", "data-testid": item.id, "data-description": item.description, onClick: onClick, onMouseEnter: onHover, onTouchStart: onHover },
         React.createElement(MenuItem, { item: item, disabled: disabled, highlighted: highlighted })));
 };

package/button-dropdown/item-element/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/button-dropdown/item-element/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, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\nimport { ItemProps } from '../interfaces';\nimport { isLinkItem } from '../utils/utils';\nimport styles from './styles.css.js';\nimport Tooltip from '../tooltip';\n\nimport { ButtonDropdownProps } from '../interfaces';\nimport { getItemTarget } from '../utils/utils';\nimport useHiddenDescription from '../utils/use-hidden-description';\nimport InternalIcon, { InternalIconProps } from '../../icon/internal';\nimport { useDropdownContext } from '../../internal/components/dropdown/context';\nimport { getMenuItemProps } from '../utils/menu-item';\n\nconst ItemElement = ({\n  item,\n  disabled,\n  onItemActivate,\n  highlighted,\n  highlightItem,\n  first = false,\n  last,\n  hasCategoryHeader,\n  variant = 'normal',\n}: ItemProps) => {\n  const isLink = isLinkItem(item);\n  const onClick = (event: React.MouseEvent) => {\n    // Stop propagation to parent node and handle event exclusively in here. This ensures\n    // that no group will interfere with the default behavior of links\n    event.stopPropagation();\n    if (!isLink) {\n      event.preventDefault();\n    }\n    if (!disabled) {\n      onItemActivate(item, event);\n    }\n  };\n\n  const onHover = (event: React.SyntheticEvent) => {\n    event.preventDefault();\n    highlightItem(item);\n  };\n\n  return (\n    <li\n      className={clsx(styles['item-element'], styles[`variant-${variant}`], {\n        [styles.highlighted]: highlighted,\n        [styles.disabled]: disabled,\n        [styles.first]: first,\n        [styles.last]: last,\n        [styles['has-category-header']]: hasCategoryHeader,\n      })}\n      role=\"presentation\"\n      data-testid={item.id}\n      data-description={item.description}\n      onClick={onClick}\n      onMouseEnter={onHover}\n      onTouchStart={onHover}\n    >\n      <MenuItem item={item} disabled={disabled} highlighted={highlighted} />\n    </li>\n  );\n};\n\ninterface MenuItemProps {\n  item: ButtonDropdownProps.Item;\n  disabled: boolean;\n  highlighted: boolean;\n}\n\nfunction MenuItem({ item, disabled, highlighted }: MenuItemProps) {\n  const menuItemRef = useRef<HTMLSpanElement | HTMLAnchorElement>(null);\n\n  useEffect(() => {\n    if (highlighted && menuItemRef.current) {\n      menuItemRef.current.focus();\n    }\n  }, [highlighted]);\n\n  const isDisabledWithReason = disabled && item.disabledReason;\n  const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n  const menuItemProps: React.HTMLProps<HTMLSpanElement | HTMLAnchorElement> = {\n    className: styles['menu-item'],\n    ref: menuItemRef,\n    // We are using the roving tabindex technique to manage the focus state of the dropdown.\n    // The current element will always have tabindex=0 which means that it can be tabbed to,\n    // while all other items have tabindex=-1 so we can focus them when necessary.\n    tabIndex: highlighted ? 0 : -1,\n    ...getMenuItemProps({ disabled }),\n    ...(isDisabledWithReason ? targetProps : {}),\n  };\n  const menuItem = isLinkItem(item) ? (\n    <a\n      {...(menuItemProps as React.HTMLProps<HTMLAnchorElement>)}\n      href={!disabled ? item.href : undefined}\n      target={getItemTarget(item)}\n      rel={item.external ? 'noopener noreferrer' : undefined}\n    >\n      <MenuItemContent item={item} disabled={disabled} />\n    </a>\n  ) : (\n    <span {...menuItemProps}>\n      <MenuItemContent item={item} disabled={disabled} />\n    </span>\n  );\n\n  const { position } = useDropdownContext();\n  const tooltipPosition = position === 'bottom-left' || position === 'top-left' ? 'left' : 'right';\n  return isDisabledWithReason ? (\n    <Tooltip content={item.disabledReason} position={tooltipPosition}>\n      {menuItem}\n      {descriptionEl}\n    </Tooltip>\n  ) : (\n    menuItem\n  );\n}\n\nconst MenuItemContent = ({ item, disabled }: { item: ButtonDropdownProps.Item; disabled: boolean }) => {\n  const hasIcon = !!(item.iconName || item.iconUrl || item.iconSvg);\n  const hasExternal = isLinkItem(item) && item.external;\n  return (\n    <>\n      {hasIcon && <MenuItemIcon name={item.iconName} url={item.iconUrl} svg={item.iconSvg} alt={item.iconAlt} />}{' '}\n      {item.text} {hasExternal && <ExternalIcon disabled={disabled} ariaLabel={item.externalIconAriaLabel} />}\n    </>\n  );\n};\n\nconst MenuItemIcon = (props: InternalIconProps) => (\n  <span className={styles.icon}>\n    <InternalIcon {...props} />\n  </span>\n);\n\nconst ExternalIcon = ({ disabled, ariaLabel }: { disabled: boolean; ariaLabel?: string }) => {\n  const icon = <InternalIcon variant={disabled ? 'disabled' : 'normal'} name=\"external\" />;\n  return (\n    <span className={styles['external-icon']} role={ariaLabel ? 'img' : undefined} aria-label={ariaLabel}>\n      {icon}\n    </span>\n  );\n};\n\nexport default ItemElement;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/button-dropdown/item-element/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, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\nimport { ItemProps } from '../interfaces';\nimport { isLinkItem } from '../utils/utils';\nimport styles from './styles.css.js';\nimport Tooltip from '../tooltip';\n\nimport { ButtonDropdownProps } from '../interfaces';\nimport { getItemTarget } from '../utils/utils';\nimport useHiddenDescription from '../utils/use-hidden-description';\nimport InternalIcon, { InternalIconProps } from '../../icon/internal';\nimport { useDropdownContext } from '../../internal/components/dropdown/context';\nimport { getMenuItemProps } from '../utils/menu-item';\n\nconst ItemElement = ({\n  item,\n  disabled,\n  onItemActivate,\n  highlighted,\n  highlightItem,\n  first = false,\n  last,\n  hasCategoryHeader,\n  isKeyboardHighlighted = false,\n  variant = 'normal',\n}: ItemProps) => {\n  const isLink = isLinkItem(item);\n  const onClick = (event: React.MouseEvent) => {\n    // Stop propagation to parent node and handle event exclusively in here. This ensures\n    // that no group will interfere with the default behavior of links\n    event.stopPropagation();\n    if (!isLink) {\n      event.preventDefault();\n    }\n    if (!disabled) {\n      onItemActivate(item, event);\n    }\n  };\n\n  const onHover = (event: React.SyntheticEvent) => {\n    event.preventDefault();\n    highlightItem(item);\n  };\n\n  return (\n    <li\n      className={clsx(styles['item-element'], styles[`variant-${variant}`], {\n        [styles.highlighted]: highlighted,\n        [styles.disabled]: disabled,\n        [styles.first]: first,\n        [styles.last]: last,\n        [styles['has-category-header']]: hasCategoryHeader,\n        [styles['is-focused']]: isKeyboardHighlighted,\n      })}\n      role=\"presentation\"\n      data-testid={item.id}\n      data-description={item.description}\n      onClick={onClick}\n      onMouseEnter={onHover}\n      onTouchStart={onHover}\n    >\n      <MenuItem item={item} disabled={disabled} highlighted={highlighted} />\n    </li>\n  );\n};\n\ninterface MenuItemProps {\n  item: ButtonDropdownProps.Item;\n  disabled: boolean;\n  highlighted: boolean;\n}\n\nfunction MenuItem({ item, disabled, highlighted }: MenuItemProps) {\n  const menuItemRef = useRef<HTMLSpanElement | HTMLAnchorElement>(null);\n\n  useEffect(() => {\n    if (highlighted && menuItemRef.current) {\n      menuItemRef.current.focus();\n    }\n  }, [highlighted]);\n\n  const isDisabledWithReason = disabled && item.disabledReason;\n  const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n  const menuItemProps: React.HTMLProps<HTMLSpanElement | HTMLAnchorElement> = {\n    className: styles['menu-item'],\n    ref: menuItemRef,\n    // We are using the roving tabindex technique to manage the focus state of the dropdown.\n    // The current element will always have tabindex=0 which means that it can be tabbed to,\n    // while all other items have tabindex=-1 so we can focus them when necessary.\n    tabIndex: highlighted ? 0 : -1,\n    ...getMenuItemProps({ disabled }),\n    ...(isDisabledWithReason ? targetProps : {}),\n  };\n  const menuItem = isLinkItem(item) ? (\n    <a\n      {...(menuItemProps as React.HTMLProps<HTMLAnchorElement>)}\n      href={!disabled ? item.href : undefined}\n      target={getItemTarget(item)}\n      rel={item.external ? 'noopener noreferrer' : undefined}\n    >\n      <MenuItemContent item={item} disabled={disabled} />\n    </a>\n  ) : (\n    <span {...menuItemProps}>\n      <MenuItemContent item={item} disabled={disabled} />\n    </span>\n  );\n\n  const { position } = useDropdownContext();\n  const tooltipPosition = position === 'bottom-left' || position === 'top-left' ? 'left' : 'right';\n  return isDisabledWithReason ? (\n    <Tooltip content={item.disabledReason} position={tooltipPosition}>\n      {menuItem}\n      {descriptionEl}\n    </Tooltip>\n  ) : (\n    menuItem\n  );\n}\n\nconst MenuItemContent = ({ item, disabled }: { item: ButtonDropdownProps.Item; disabled: boolean }) => {\n  const hasIcon = !!(item.iconName || item.iconUrl || item.iconSvg);\n  const hasExternal = isLinkItem(item) && item.external;\n  return (\n    <>\n      {hasIcon && <MenuItemIcon name={item.iconName} url={item.iconUrl} svg={item.iconSvg} alt={item.iconAlt} />}{' '}\n      {item.text} {hasExternal && <ExternalIcon disabled={disabled} ariaLabel={item.externalIconAriaLabel} />}\n    </>\n  );\n};\n\nconst MenuItemIcon = (props: InternalIconProps) => (\n  <span className={styles.icon}>\n    <InternalIcon {...props} />\n  </span>\n);\n\nconst ExternalIcon = ({ disabled, ariaLabel }: { disabled: boolean; ariaLabel?: string }) => {\n  const icon = <InternalIcon variant={disabled ? 'disabled' : 'normal'} name=\"external\" />;\n  return (\n    <span className={styles['external-icon']} role={ariaLabel ? 'img' : undefined} aria-label={ariaLabel}>\n      {icon}\n    </span>\n  );\n};\n\nexport default ItemElement;\n"]}

package/button-dropdown/item-element/styles.css.js

@@ -1,18 +1,19 @@
 
     import './styles.scoped.css';
     export default {
-  "item-element": "awsui_item-element_93a1u_1cg8g_93",
-  "disabled": "awsui_disabled_93a1u_1cg8g_103",
-  "last": "awsui_last_93a1u_1cg8g_110",
-  "highlighted": "awsui_highlighted_93a1u_1cg8g_113",
-  "variant-icon": "awsui_variant-icon_93a1u_1cg8g_117",
-  "variant-normal": "awsui_variant-normal_93a1u_1cg8g_117",
-  "variant-primary": "awsui_variant-primary_93a1u_1cg8g_117",
-  "variant-navigation": "awsui_variant-navigation_93a1u_1cg8g_127",
-  "first": "awsui_first_93a1u_1cg8g_130",
-  "has-category-header": "awsui_has-category-header_93a1u_1cg8g_130",
-  "menu-item": "awsui_menu-item_93a1u_1cg8g_144",
-  "icon": "awsui_icon_93a1u_1cg8g_162",
-  "external-icon": "awsui_external-icon_93a1u_1cg8g_167"
+  "item-element": "awsui_item-element_93a1u_lwral_93",
+  "disabled": "awsui_disabled_93a1u_lwral_103",
+  "last": "awsui_last_93a1u_lwral_110",
+  "highlighted": "awsui_highlighted_93a1u_lwral_113",
+  "variant-icon": "awsui_variant-icon_93a1u_lwral_117",
+  "variant-normal": "awsui_variant-normal_93a1u_lwral_117",
+  "variant-primary": "awsui_variant-primary_93a1u_lwral_117",
+  "is-focused": "awsui_is-focused_93a1u_lwral_127",
+  "variant-navigation": "awsui_variant-navigation_93a1u_lwral_131",
+  "first": "awsui_first_93a1u_lwral_134",
+  "has-category-header": "awsui_has-category-header_93a1u_lwral_134",
+  "menu-item": "awsui_menu-item_93a1u_lwral_148",
+  "icon": "awsui_icon_93a1u_lwral_166",
+  "external-icon": "awsui_external-icon_93a1u_lwral_171"
 };