@cloudscape-design/components 3.0.365 → 3.0.367

package/button-dropdown/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["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, InternalButtonProps } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport InternalBox from '../box/internal';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel.js';\n\nconst InternalButtonDropdown = React.forwardRef(\n  (\n    {\n      items,\n      variant = 'normal',\n      loading = false,\n      loadingText,\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      mainAction,\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    if (mainAction) {\n      checkSafeUrl('ButtonDropdown', mainAction.href);\n    }\n\n    if (isDevelopment) {\n      if (mainAction && variant !== 'primary') {\n        warnOnce('ButtonDropdown', 'Main action is only supported for \"primary\" component variant.');\n      }\n    }\n    const isMainAction = mainAction && variant === 'primary';\n    const isVisualRefresh = useVisualRefresh();\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      closeDropdown,\n      setIsUsingMouse,\n    } = useButtonDropdown({\n      items,\n      onItemClick,\n      onItemFollow,\n      onReturnFocus: () => triggerRef.current?.focus(),\n      expandToViewport,\n      hasExpandableGroups: expandableGroups,\n      isInRestrictedView,\n    });\n\n    const handleMouseEvent = () => {\n      setIsUsingMouse(true);\n    };\n\n    const baseProps = getBaseProps(props);\n\n    const mainActionRef = useRef<HTMLElement>(null);\n    const triggerRef = useRef<HTMLElement>(null);\n\n    useForwardFocus(ref, isMainAction ? mainActionRef : triggerRef);\n\n    const clickHandler = () => {\n      if (!loading && !disabled) {\n        // Prevent moving highlight on mobiles to avoid disabled state reason popup if defined.\n        toggleDropdown({ moveHighlightOnOpen: !isInRestrictedView });\n      }\n    };\n\n    const canBeOpened = !loading && !disabled;\n\n    const triggerVariant = variant === 'navigation' ? undefined : variant === 'inline-icon' ? 'inline-icon' : variant;\n    const iconProps: Partial<ButtonProps & { __iconClass?: string }> =\n      variant === 'icon' || variant === 'inline-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 baseTriggerProps: InternalButtonProps = {\n      className: clsx(styles['trigger-button'], styles['test-utils-button-trigger']),\n      ...iconProps,\n      variant: triggerVariant,\n      loading,\n      loadingText,\n      disabled,\n      onClick: (event: Event) => {\n        event.preventDefault();\n        clickHandler();\n      },\n      ariaLabel,\n      ariaExpanded: canBeOpened && isOpen,\n      formAction: 'none',\n      __nativeAttributes: {\n        'aria-haspopup': true,\n      },\n    };\n\n    let trigger: React.ReactNode = null;\n    if (customTriggerBuilder) {\n      trigger = (\n        <div className={styles['dropdown-trigger']}>\n          {customTriggerBuilder({\n            testUtilsClass: styles['test-utils-button-trigger'],\n            onClick: clickHandler,\n            triggerRef,\n            ariaLabel,\n            disabled,\n            isOpen,\n          })}\n        </div>\n      );\n    } else if (isMainAction) {\n      const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel, ...mainActionProps } =\n        mainAction;\n      const mainActionIconProps = external\n        ? ({ iconName: 'external', iconAlign: 'right' } as const)\n        : ({ iconName, iconAlt, iconSvg, iconUrl } as const);\n      const mainActionAriaLabel = externalIconAriaLabel\n        ? `${mainAction.ariaLabel ?? mainAction.text} ${mainAction.externalIconAriaLabel}`\n        : undefined;\n\n      trigger = (\n        <div role=\"group\" aria-label={ariaLabel} className={styles['split-trigger-wrapper']}>\n          <div\n            className={clsx(styles['trigger-item'], styles['split-trigger'])}\n            // Close dropdown upon main action click unless event is cancelled.\n            onClick={closeDropdown}\n            // Prevent keyboard events from propagation to the button dropdown handler.\n            onKeyDown={e => e.stopPropagation()}\n            onKeyUp={e => e.stopPropagation()}\n          >\n            <InternalButton\n              ref={mainActionRef}\n              {...mainActionProps}\n              {...mainActionIconProps}\n              className={styles['trigger-button']}\n              variant=\"primary\"\n              ariaLabel={mainActionAriaLabel}\n              formAction=\"none\"\n            >\n              {text}\n            </InternalButton>\n          </div>\n          <div\n            className={clsx(\n              styles['trigger-item'],\n              styles['dropdown-trigger'],\n              isVisualRefresh && styles['visual-refresh']\n            )}\n          >\n            <InternalButton ref={triggerRef} {...baseTriggerProps} />\n          </div>\n        </div>\n      );\n    } else {\n      trigger = (\n        <div className={styles['dropdown-trigger']}>\n          <InternalButton ref={triggerRef} {...baseTriggerProps}>\n            {children}\n          </InternalButton>\n        </div>\n      );\n    }\n\n    const hasHeader = title || description;\n    const headerId = useUniqueId('awsui-button-dropdown__header');\n\n    const { loadingButtonCount } = useFunnel();\n    useEffect(() => {\n      if (loading) {\n        loadingButtonCount.current++;\n        return () => {\n          // eslint-disable-next-line react-hooks/exhaustive-deps\n          loadingButtonCount.current--;\n        };\n      }\n    }, [loading, loadingButtonCount]);\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={() => toggleDropdown()}\n          trigger={trigger}\n          dropdownId={dropdownId}\n        >\n          {hasHeader && (\n            <div className={styles.header} id={headerId}>\n              {title && (\n                <div className={styles.title}>\n                  <InternalBox\n                    fontSize=\"heading-s\"\n                    fontWeight=\"bold\"\n                    color=\"inherit\"\n                    tagOverride=\"h2\"\n                    margin={{ vertical: 'n', horizontal: 'n' }}\n                  >\n                    {title}\n                  </InternalBox>\n                </div>\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            statusType=\"finished\"\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"]}
+{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["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, InternalButtonProps } from '../button/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport InternalBox from '../box/internal';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel.js';\n\nconst InternalButtonDropdown = React.forwardRef(\n  (\n    {\n      items,\n      variant = 'normal',\n      loading = false,\n      loadingText,\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      mainAction,\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    if (mainAction) {\n      checkSafeUrl('ButtonDropdown', mainAction.href);\n    }\n\n    if (isDevelopment) {\n      if (mainAction && variant !== 'primary') {\n        warnOnce('ButtonDropdown', 'Main action is only supported for \"primary\" component variant.');\n      }\n    }\n    const isMainAction = mainAction && variant === 'primary';\n    const isVisualRefresh = useVisualRefresh();\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      closeDropdown,\n      setIsUsingMouse,\n    } = useButtonDropdown({\n      items,\n      onItemClick,\n      onItemFollow,\n      onReturnFocus: () => triggerRef.current?.focus(),\n      expandToViewport,\n      hasExpandableGroups: expandableGroups,\n      isInRestrictedView,\n    });\n\n    const handleMouseEvent = () => {\n      setIsUsingMouse(true);\n    };\n\n    const baseProps = getBaseProps(props);\n\n    const mainActionRef = useRef<HTMLElement>(null);\n    const triggerRef = useRef<HTMLElement>(null);\n\n    useForwardFocus(ref, isMainAction ? mainActionRef : triggerRef);\n\n    const clickHandler = () => {\n      if (!loading && !disabled) {\n        // Prevent moving highlight on mobiles to avoid disabled state reason popup if defined.\n        toggleDropdown({ moveHighlightOnOpen: !isInRestrictedView });\n      }\n    };\n\n    const canBeOpened = !loading && !disabled;\n\n    const triggerVariant = variant === 'navigation' ? undefined : variant === 'inline-icon' ? 'inline-icon' : variant;\n    const iconProps: Partial<ButtonProps & { __iconClass?: string }> =\n      variant === 'icon' || variant === 'inline-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 baseTriggerProps: InternalButtonProps = {\n      className: clsx(styles['trigger-button'], styles['test-utils-button-trigger']),\n      ...iconProps,\n      variant: triggerVariant,\n      loading,\n      loadingText,\n      disabled,\n      onClick: (event: Event) => {\n        event.preventDefault();\n        clickHandler();\n      },\n      ariaLabel,\n      ariaExpanded: canBeOpened && isOpen,\n      formAction: 'none',\n      __nativeAttributes: {\n        'aria-haspopup': true,\n      },\n    };\n\n    const triggerHasBadge = () => {\n      const flatItems = items.flatMap(item => {\n        if ('items' in item) {\n          return item.items;\n        }\n        return item;\n      });\n\n      return (\n        variant === 'icon' &&\n        !!flatItems?.find(item => {\n          if ('badge' in item) {\n            return item.badge;\n          }\n        })\n      );\n    };\n\n    let trigger: React.ReactNode = null;\n    if (customTriggerBuilder) {\n      trigger = (\n        <div className={styles['dropdown-trigger']}>\n          {customTriggerBuilder({\n            testUtilsClass: styles['test-utils-button-trigger'],\n            onClick: clickHandler,\n            triggerRef,\n            ariaLabel,\n            disabled,\n            isOpen,\n          })}\n        </div>\n      );\n    } else if (isMainAction) {\n      const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel, ...mainActionProps } =\n        mainAction;\n      const mainActionIconProps = external\n        ? ({ iconName: 'external', iconAlign: 'right' } as const)\n        : ({ iconName, iconAlt, iconSvg, iconUrl } as const);\n      const mainActionAriaLabel = externalIconAriaLabel\n        ? `${mainAction.ariaLabel ?? mainAction.text} ${mainAction.externalIconAriaLabel}`\n        : undefined;\n\n      trigger = (\n        <div role=\"group\" aria-label={ariaLabel} className={styles['split-trigger-wrapper']}>\n          <div\n            className={clsx(styles['trigger-item'], styles['split-trigger'])}\n            // Close dropdown upon main action click unless event is cancelled.\n            onClick={closeDropdown}\n            // Prevent keyboard events from propagation to the button dropdown handler.\n            onKeyDown={e => e.stopPropagation()}\n            onKeyUp={e => e.stopPropagation()}\n          >\n            <InternalButton\n              ref={mainActionRef}\n              {...mainActionProps}\n              {...mainActionIconProps}\n              className={styles['trigger-button']}\n              variant=\"primary\"\n              ariaLabel={mainActionAriaLabel}\n              formAction=\"none\"\n            >\n              {text}\n            </InternalButton>\n          </div>\n          <div\n            className={clsx(\n              styles['trigger-item'],\n              styles['dropdown-trigger'],\n              isVisualRefresh && styles['visual-refresh']\n            )}\n          >\n            <InternalButton ref={triggerRef} {...baseTriggerProps} />\n          </div>\n        </div>\n      );\n    } else {\n      trigger = (\n        <div className={styles['dropdown-trigger']}>\n          <InternalButton ref={triggerRef} {...baseTriggerProps} badge={triggerHasBadge()}>\n            {children}\n          </InternalButton>\n        </div>\n      );\n    }\n\n    const hasHeader = title || description;\n    const headerId = useUniqueId('awsui-button-dropdown__header');\n\n    const { loadingButtonCount } = useFunnel();\n    useEffect(() => {\n      if (loading) {\n        loadingButtonCount.current++;\n        return () => {\n          // eslint-disable-next-line react-hooks/exhaustive-deps\n          loadingButtonCount.current--;\n        };\n      }\n    }, [loading, loadingButtonCount]);\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={() => toggleDropdown()}\n          trigger={trigger}\n          dropdownId={dropdownId}\n        >\n          {hasHeader && (\n            <div className={styles.header} id={headerId}>\n              {title && (\n                <div className={styles.title}>\n                  <InternalBox\n                    fontSize=\"heading-s\"\n                    fontWeight=\"bold\"\n                    color=\"inherit\"\n                    tagOverride=\"h2\"\n                    margin={{ vertical: 'n', horizontal: 'n' }}\n                  >\n                    {title}\n                  </InternalBox>\n                </div>\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            statusType=\"finished\"\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,5 +1,9 @@
 /// <reference types="react" />
 import { ItemProps } from '../interfaces';
+import { ButtonDropdownProps } from '../interfaces';
 declare const ItemElement: ({ item, disabled, onItemActivate, highlighted, highlightItem, first, last, hasCategoryHeader, isKeyboardHighlighted, variant, }: ItemProps) => JSX.Element;
+export type InternalItemProps = ButtonDropdownProps.Item & {
+    badge?: boolean;
+};
 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":"lib/default/","sources":["button-dropdown/item-element/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAY1C,QAAA,MAAM,WAAW,oIAWd,SAAS,gBAuCX,CAAC;AAoFF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["button-dropdown/item-element/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAK1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAOpD,QAAA,MAAM,WAAW,oIAWd,SAAS,gBAuCX,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,mBAAmB,CAAC,IAAI,GAAG;IACzD,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AA4FF,eAAe,WAAW,CAAC"}

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

@@ -64,7 +64,7 @@ const MenuItemContent = ({ item, disabled }) => {
     const hasIcon = !!(item.iconName || item.iconUrl || item.iconSvg);
     const hasExternal = isLinkItem(item) && item.external;
     return (React.createElement(React.Fragment, null,
-        hasIcon && React.createElement(MenuItemIcon, { name: item.iconName, url: item.iconUrl, svg: item.iconSvg, alt: item.iconAlt }),
+        hasIcon && (React.createElement(MenuItemIcon, { name: item.iconName, url: item.iconUrl, svg: item.iconSvg, alt: item.iconAlt, badge: item.badge })),
         ' ',
         item.text,
         " ",

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["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>(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.HTMLAttributes<HTMLSpanElement & HTMLAnchorElement> = {\n    className: styles['menu-item'],\n    lang: item.lang,\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\n  const menuItem = isLinkItem(item) ? (\n    <a\n      {...menuItemProps}\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":"lib/default/","sources":["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\nexport type InternalItemProps = ButtonDropdownProps.Item & {\n  badge?: boolean;\n};\n\ninterface MenuItemProps {\n  item: InternalItemProps;\n  disabled: boolean;\n  highlighted: boolean;\n}\n\nfunction MenuItem({ item, disabled, highlighted }: MenuItemProps) {\n  const menuItemRef = useRef<(HTMLSpanElement & HTMLAnchorElement) | null>(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.HTMLAttributes<HTMLSpanElement & HTMLAnchorElement> = {\n    className: styles['menu-item'],\n    lang: item.lang,\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\n  const menuItem = isLinkItem(item) ? (\n    <a\n      {...menuItemProps}\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: InternalItemProps; disabled: boolean }) => {\n  const hasIcon = !!(item.iconName || item.iconUrl || item.iconSvg);\n  const hasExternal = isLinkItem(item) && item.external;\n  return (\n    <>\n      {hasIcon && (\n        <MenuItemIcon\n          name={item.iconName}\n          url={item.iconUrl}\n          svg={item.iconSvg}\n          alt={item.iconAlt}\n          badge={item.badge}\n        />\n      )}{' '}\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/icon/styles.css.js

@@ -1,26 +1,26 @@
 
     import './styles.scoped.css';
     export default {
-  "icon": "awsui_icon_h11ix_gi1za_98",
-  "icon-flex-height": "awsui_icon-flex-height_h11ix_gi1za_104",
-  "size-small": "awsui_size-small_h11ix_gi1za_129",
-  "size-small-mapped-height": "awsui_size-small-mapped-height_h11ix_gi1za_133",
-  "size-normal": "awsui_size-normal_h11ix_gi1za_147",
-  "size-normal-mapped-height": "awsui_size-normal-mapped-height_h11ix_gi1za_151",
-  "size-medium": "awsui_size-medium_h11ix_gi1za_165",
-  "size-medium-mapped-height": "awsui_size-medium-mapped-height_h11ix_gi1za_169",
-  "size-big": "awsui_size-big_h11ix_gi1za_183",
-  "size-big-mapped-height": "awsui_size-big-mapped-height_h11ix_gi1za_187",
-  "size-large": "awsui_size-large_h11ix_gi1za_201",
-  "size-large-mapped-height": "awsui_size-large-mapped-height_h11ix_gi1za_205",
-  "variant-normal": "awsui_variant-normal_h11ix_gi1za_219",
-  "variant-disabled": "awsui_variant-disabled_h11ix_gi1za_222",
-  "variant-inverted": "awsui_variant-inverted_h11ix_gi1za_225",
-  "variant-subtle": "awsui_variant-subtle_h11ix_gi1za_228",
-  "variant-warning": "awsui_variant-warning_h11ix_gi1za_231",
-  "variant-error": "awsui_variant-error_h11ix_gi1za_234",
-  "variant-success": "awsui_variant-success_h11ix_gi1za_237",
-  "variant-link": "awsui_variant-link_h11ix_gi1za_240",
-  "badge": "awsui_badge_h11ix_gi1za_244"
+  "icon": "awsui_icon_h11ix_9i0b9_98",
+  "icon-flex-height": "awsui_icon-flex-height_h11ix_9i0b9_104",
+  "size-small": "awsui_size-small_h11ix_9i0b9_129",
+  "size-small-mapped-height": "awsui_size-small-mapped-height_h11ix_9i0b9_133",
+  "size-normal": "awsui_size-normal_h11ix_9i0b9_147",
+  "size-normal-mapped-height": "awsui_size-normal-mapped-height_h11ix_9i0b9_151",
+  "size-medium": "awsui_size-medium_h11ix_9i0b9_165",
+  "size-medium-mapped-height": "awsui_size-medium-mapped-height_h11ix_9i0b9_169",
+  "size-big": "awsui_size-big_h11ix_9i0b9_183",
+  "size-big-mapped-height": "awsui_size-big-mapped-height_h11ix_9i0b9_187",
+  "size-large": "awsui_size-large_h11ix_9i0b9_201",
+  "size-large-mapped-height": "awsui_size-large-mapped-height_h11ix_9i0b9_205",
+  "variant-normal": "awsui_variant-normal_h11ix_9i0b9_219",
+  "variant-disabled": "awsui_variant-disabled_h11ix_9i0b9_222",
+  "variant-inverted": "awsui_variant-inverted_h11ix_9i0b9_225",
+  "variant-subtle": "awsui_variant-subtle_h11ix_9i0b9_228",
+  "variant-warning": "awsui_variant-warning_h11ix_9i0b9_231",
+  "variant-error": "awsui_variant-error_h11ix_9i0b9_234",
+  "variant-success": "awsui_variant-success_h11ix_9i0b9_237",
+  "variant-link": "awsui_variant-link_h11ix_9i0b9_240",
+  "badge": "awsui_badge_h11ix_9i0b9_244"
 };
   

package/icon/styles.scoped.css

@@ -95,159 +95,159 @@ 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_icon_h11ix_gi1za_98:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98:not(#\9) {
   position: relative;
   display: inline-block;
   vertical-align: top;
   /* stylelint-disable-next-line selector-max-type */
 }
-.awsui_icon-flex-height_h11ix_gi1za_104:not(#\9) {
+.awsui_icon-flex-height_h11ix_9i0b9_104:not(#\9) {
   display: inline-flex;
   align-items: center;
 }
-.awsui_icon_h11ix_gi1za_98 > svg:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg:not(#\9) {
   pointer-events: none;
 }
-.awsui_icon_h11ix_gi1za_98 > svg:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg:not(#\9) {
   fill: none;
 }
-.awsui_icon_h11ix_gi1za_98 > svg *:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg *:not(#\9) {
   stroke: currentColor;
 }
-.awsui_icon_h11ix_gi1za_98 > svg .stroke-linejoin-round:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg .stroke-linejoin-round:not(#\9) {
   stroke-linejoin: round;
 }
-.awsui_icon_h11ix_gi1za_98 > svg .stroke-linecap-square:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg .stroke-linecap-square:not(#\9) {
   stroke-linecap: square;
 }
-.awsui_icon_h11ix_gi1za_98 > svg .stroke-linecap-round:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg .stroke-linecap-round:not(#\9) {
   stroke-linecap: round;
 }
-.awsui_icon_h11ix_gi1za_98 > svg .filled:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98 > svg .filled:not(#\9) {
   fill: currentColor;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-small_h11ix_gi1za_129:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-small_h11ix_9i0b9_129:not(#\9) {
   width: var(--size-icon-normal-0m1722, 16px);
   box-sizing: border-box;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-small-mapped-height_h11ix_gi1za_133:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-small-mapped-height_h11ix_9i0b9_133:not(#\9) {
   height: var(--font-body-s-line-height-uztvf6, 16px);
   padding: calc((var(--font-body-s-line-height-uztvf6, 16px) - var(--size-icon-normal-0m1722, 16px)) / 2) 0;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-small_h11ix_gi1za_129 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-small_h11ix_gi1za_129 > img:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-small_h11ix_9i0b9_129 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-small_h11ix_9i0b9_129 > img:not(#\9) {
   width: var(--size-icon-normal-0m1722, 16px);
   height: var(--size-icon-normal-0m1722, 16px);
   vertical-align: top;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-small_h11ix_gi1za_129 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-small_h11ix_gi1za_129 > svg *:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-small_h11ix_9i0b9_129 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-small_h11ix_9i0b9_129 > svg *:not(#\9) {
   stroke-width: 2px;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-normal_h11ix_gi1za_147:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-normal_h11ix_9i0b9_147:not(#\9) {
   width: var(--size-icon-normal-0m1722, 16px);
   box-sizing: border-box;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-normal-mapped-height_h11ix_gi1za_151:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-normal-mapped-height_h11ix_9i0b9_151:not(#\9) {
   height: var(--font-body-m-line-height-5wv9x1, 20px);
   padding: calc((var(--font-body-m-line-height-5wv9x1, 20px) - var(--size-icon-normal-0m1722, 16px)) / 2) 0;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-normal_h11ix_gi1za_147 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-normal_h11ix_gi1za_147 > img:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-normal_h11ix_9i0b9_147 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-normal_h11ix_9i0b9_147 > img:not(#\9) {
   width: var(--size-icon-normal-0m1722, 16px);
   height: var(--size-icon-normal-0m1722, 16px);
   vertical-align: top;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-normal_h11ix_gi1za_147 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-normal_h11ix_gi1za_147 > svg *:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-normal_h11ix_9i0b9_147 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-normal_h11ix_9i0b9_147 > svg *:not(#\9) {
   stroke-width: 2px;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-medium_h11ix_gi1za_165:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-medium_h11ix_9i0b9_165:not(#\9) {
   width: var(--size-icon-medium-y9xuoq, 20px);
   box-sizing: border-box;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-medium-mapped-height_h11ix_gi1za_169:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-medium-mapped-height_h11ix_9i0b9_169:not(#\9) {
   height: var(--font-heading-l-line-height-thvd8z, 24px);
   padding: calc((var(--font-heading-l-line-height-thvd8z, 24px) - var(--size-icon-medium-y9xuoq, 20px)) / 2) 0;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-medium_h11ix_gi1za_165 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-medium_h11ix_gi1za_165 > img:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-medium_h11ix_9i0b9_165 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-medium_h11ix_9i0b9_165 > img:not(#\9) {
   width: var(--size-icon-medium-y9xuoq, 20px);
   height: var(--size-icon-medium-y9xuoq, 20px);
   vertical-align: top;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-medium_h11ix_gi1za_165 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-medium_h11ix_gi1za_165 > svg *:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-medium_h11ix_9i0b9_165 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-medium_h11ix_9i0b9_165 > svg *:not(#\9) {
   stroke-width: 2px;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-big_h11ix_gi1za_183:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-big_h11ix_9i0b9_183:not(#\9) {
   width: var(--size-icon-big-zkdryd, 32px);
   box-sizing: border-box;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-big-mapped-height_h11ix_gi1za_187:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-big-mapped-height_h11ix_9i0b9_187:not(#\9) {
   height: var(--font-heading-xl-line-height-qs40h8, 30px);
   padding: calc((var(--font-heading-xl-line-height-qs40h8, 30px) - var(--size-icon-big-zkdryd, 32px)) / 2) 0;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-big_h11ix_gi1za_183 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-big_h11ix_gi1za_183 > img:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-big_h11ix_9i0b9_183 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-big_h11ix_9i0b9_183 > img:not(#\9) {
   width: var(--size-icon-big-zkdryd, 32px);
   height: var(--size-icon-big-zkdryd, 32px);
   vertical-align: top;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-big_h11ix_gi1za_183 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-big_h11ix_gi1za_183 > svg *:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-big_h11ix_9i0b9_183 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-big_h11ix_9i0b9_183 > svg *:not(#\9) {
   stroke-width: 2px;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-large_h11ix_gi1za_201:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-large_h11ix_9i0b9_201:not(#\9) {
   width: var(--size-icon-large-bivhmh, 48px);
   box-sizing: border-box;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-large-mapped-height_h11ix_gi1za_205:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-large-mapped-height_h11ix_9i0b9_205:not(#\9) {
   height: var(--font-display-l-line-height-07o0h7, 48px);
   padding: calc((var(--font-display-l-line-height-07o0h7, 48px) - var(--size-icon-large-bivhmh, 48px)) / 2) 0;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-large_h11ix_gi1za_201 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-large_h11ix_gi1za_201 > img:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-large_h11ix_9i0b9_201 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-large_h11ix_9i0b9_201 > img:not(#\9) {
   width: var(--size-icon-large-bivhmh, 48px);
   height: var(--size-icon-large-bivhmh, 48px);
   vertical-align: top;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_size-large_h11ix_gi1za_201 > svg:not(#\9),
-.awsui_icon_h11ix_gi1za_98.awsui_size-large_h11ix_gi1za_201 > svg *:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_size-large_h11ix_9i0b9_201 > svg:not(#\9),
+.awsui_icon_h11ix_9i0b9_98.awsui_size-large_h11ix_9i0b9_201 > svg *:not(#\9) {
   stroke-width: 1.2px;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-normal_h11ix_gi1za_219:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-normal_h11ix_9i0b9_219:not(#\9) {
   color: currentColor;
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-disabled_h11ix_gi1za_222:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-disabled_h11ix_9i0b9_222:not(#\9) {
   color: var(--color-text-interactive-disabled-z7a3t4, #9ba7b6);
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-inverted_h11ix_gi1za_225:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-inverted_h11ix_9i0b9_225:not(#\9) {
   color: var(--color-text-inverted-70cpkk, #ffffff);
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-subtle_h11ix_gi1za_228:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-subtle_h11ix_9i0b9_228:not(#\9) {
   color: var(--color-text-icon-subtle-c4qyia, #5f6b7a);
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-warning_h11ix_gi1za_231:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-warning_h11ix_9i0b9_231:not(#\9) {
   color: var(--color-text-status-warning-yik8vi, #8d6605);
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-error_h11ix_gi1za_234:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-error_h11ix_9i0b9_234:not(#\9) {
   color: var(--color-text-status-error-wdvepn, #d91515);
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-success_h11ix_gi1za_237:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-success_h11ix_9i0b9_237:not(#\9) {
   color: var(--color-text-status-success-bpiyjm, #037f0c);
 }
-.awsui_icon_h11ix_gi1za_98.awsui_variant-link_h11ix_gi1za_240:not(#\9) {
+.awsui_icon_h11ix_9i0b9_98.awsui_variant-link_h11ix_9i0b9_240:not(#\9) {
   color: var(--color-text-link-default-latg1a, #0972d3);
 }
 
-.awsui_badge_h11ix_gi1za_244:not(#\9)::after {
+.awsui_badge_h11ix_9i0b9_244:not(#\9)::after {
   content: "";
   position: absolute;
-  width: 8px;
-  height: 8px;
-  border-radius: 8px;
-  background-color: var(--color-text-status-info-ahz8zp, #0972d3);
-  top: 2px;
-  right: -2px;
+  width: 6px;
+  height: 6px;
+  border-radius: 4px;
+  background-color: var(--color-background-badge-icon-q1kfox, #d91515);
+  top: 0px;
+  right: -3px;
 }

package/icon/styles.selectors.js

@@ -2,26 +2,26 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "icon": "awsui_icon_h11ix_gi1za_98",
-  "icon-flex-height": "awsui_icon-flex-height_h11ix_gi1za_104",
-  "size-small": "awsui_size-small_h11ix_gi1za_129",
-  "size-small-mapped-height": "awsui_size-small-mapped-height_h11ix_gi1za_133",
-  "size-normal": "awsui_size-normal_h11ix_gi1za_147",
-  "size-normal-mapped-height": "awsui_size-normal-mapped-height_h11ix_gi1za_151",
-  "size-medium": "awsui_size-medium_h11ix_gi1za_165",
-  "size-medium-mapped-height": "awsui_size-medium-mapped-height_h11ix_gi1za_169",
-  "size-big": "awsui_size-big_h11ix_gi1za_183",
-  "size-big-mapped-height": "awsui_size-big-mapped-height_h11ix_gi1za_187",
-  "size-large": "awsui_size-large_h11ix_gi1za_201",
-  "size-large-mapped-height": "awsui_size-large-mapped-height_h11ix_gi1za_205",
-  "variant-normal": "awsui_variant-normal_h11ix_gi1za_219",
-  "variant-disabled": "awsui_variant-disabled_h11ix_gi1za_222",
-  "variant-inverted": "awsui_variant-inverted_h11ix_gi1za_225",
-  "variant-subtle": "awsui_variant-subtle_h11ix_gi1za_228",
-  "variant-warning": "awsui_variant-warning_h11ix_gi1za_231",
-  "variant-error": "awsui_variant-error_h11ix_gi1za_234",
-  "variant-success": "awsui_variant-success_h11ix_gi1za_237",
-  "variant-link": "awsui_variant-link_h11ix_gi1za_240",
-  "badge": "awsui_badge_h11ix_gi1za_244"
+  "icon": "awsui_icon_h11ix_9i0b9_98",
+  "icon-flex-height": "awsui_icon-flex-height_h11ix_9i0b9_104",
+  "size-small": "awsui_size-small_h11ix_9i0b9_129",
+  "size-small-mapped-height": "awsui_size-small-mapped-height_h11ix_9i0b9_133",
+  "size-normal": "awsui_size-normal_h11ix_9i0b9_147",
+  "size-normal-mapped-height": "awsui_size-normal-mapped-height_h11ix_9i0b9_151",
+  "size-medium": "awsui_size-medium_h11ix_9i0b9_165",
+  "size-medium-mapped-height": "awsui_size-medium-mapped-height_h11ix_9i0b9_169",
+  "size-big": "awsui_size-big_h11ix_9i0b9_183",
+  "size-big-mapped-height": "awsui_size-big-mapped-height_h11ix_9i0b9_187",
+  "size-large": "awsui_size-large_h11ix_9i0b9_201",
+  "size-large-mapped-height": "awsui_size-large-mapped-height_h11ix_9i0b9_205",
+  "variant-normal": "awsui_variant-normal_h11ix_9i0b9_219",
+  "variant-disabled": "awsui_variant-disabled_h11ix_9i0b9_222",
+  "variant-inverted": "awsui_variant-inverted_h11ix_9i0b9_225",
+  "variant-subtle": "awsui_variant-subtle_h11ix_9i0b9_228",
+  "variant-warning": "awsui_variant-warning_h11ix_9i0b9_231",
+  "variant-error": "awsui_variant-error_h11ix_9i0b9_234",
+  "variant-success": "awsui_variant-success_h11ix_9i0b9_237",
+  "variant-link": "awsui_variant-link_h11ix_9i0b9_240",
+  "badge": "awsui_badge_h11ix_9i0b9_244"
 };
   

package/internal/base-component/styles.scoped.css

@@ -154,6 +154,7 @@
   --color-charts-palette-categorical-48-tptw1p:#014b44;
   --color-charts-palette-categorical-49-6lrkes:#431d84;
   --color-charts-palette-categorical-50-mqbaxr:#732c02;
+  --color-background-badge-icon-q1kfox:#d91515;
   --color-background-button-link-active-cbd6sf:#d3e7f9;
   --color-background-button-link-hover-t0fnno:#f2f8fd;
   --color-background-button-normal-active-qmds3y:#d3e7f9;
@@ -758,6 +759,7 @@
     --color-charts-palette-categorical-48-tptw1p:#ace9db;
     --color-charts-palette-categorical-49-6lrkes:#f5edff;
     --color-charts-palette-categorical-50-mqbaxr:#ffd4bb;
+    --color-background-badge-icon-q1kfox:#eb6f6f;
     --color-background-button-link-active-cbd6sf:#354150;
     --color-background-button-link-hover-t0fnno:#192534;
     --color-background-button-normal-active-qmds3y:#354150;
@@ -1035,6 +1037,7 @@
 }
 
 .awsui-context-top-navigation:not(#\9) {
+  --color-background-badge-icon-q1kfox:#eb6f6f;
   --color-background-button-link-active-cbd6sf:#354150;
   --color-background-button-link-hover-t0fnno:#192534;
   --color-background-button-normal-active-qmds3y:#354150;
@@ -1217,6 +1220,7 @@
 }
 
 .awsui-context-content-header:not(#\9) {
+  --color-background-badge-icon-q1kfox:#eb6f6f;
   --color-background-button-link-active-cbd6sf:#354150;
   --color-background-button-link-hover-t0fnno:#192534;
   --color-background-button-normal-active-qmds3y:#354150;
@@ -1497,6 +1501,7 @@
 }
 
 .awsui-context-content-header .awsui-context-alert:not(#\9) {
+  --color-background-badge-icon-q1kfox:#eb6f6f;
   --color-background-button-link-active-cbd6sf:#354150;
   --color-background-button-link-hover-t0fnno:#192534;
   --color-background-button-normal-active-qmds3y:rgba(255, 255, 255, 0.15);

package/internal/environment.js

@@ -1,4 +1,4 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (2b28f237)";
+export var PACKAGE_VERSION = "3.0.0 (7940b142)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;

package/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (2b28f237)",
+  "PACKAGE_VERSION": "3.0.0 (7940b142)",
   "THEME": "default",
   "ALWAYS_VISUAL_REFRESH": false
 }