npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.762 → 3.0.763 - Mend

@cloudscape-design/components-themeable 3.0.762 → 3.0.763

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (116) hide show

package/lib/internal/template/button-dropdown/item-element/index.js.map CHANGED Viewed

	@@ -1 +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';\n\nimport {\n GeneratedAnalyticsMetadataFragment,\n getAnalyticsMetadataAttribute,\n} from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalIcon, { InternalIconProps } from '../../icon/internal';\nimport { useDropdownContext } from '../../internal/components/dropdown/context';\nimport useHiddenDescription from '../../internal/hooks/use-hidden-description';\nimport { GeneratedAnalyticsMetadataButtonDropdownClick } from '../analytics-metadata/interfaces';\nimport { ItemProps, LinkItem } from '../interfaces';\nimport { ButtonDropdownProps } from '../interfaces';\nimport Tooltip from '../tooltip';\nimport { getMenuItemCheckboxProps, getMenuItemProps } from '../utils/menu-item';\nimport { isCheckboxItem, isLinkItem } from '../utils/utils';\nimport { getItemTarget } from '../utils/utils';\n\nimport analyticsLabels from '../analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst ItemElement = ({\n position = '1',\n item,\n disabled,\n onItemActivate,\n highlighted,\n highlightItem,\n showDivider,\n hasCategoryHeader,\n isKeyboardHighlighted = false,\n analyticsMetadataTransformer = (metadata: GeneratedAnalyticsMetadataFragment) => metadata,\n variant = 'normal',\n}: ItemProps) => {\n const isLink = isLinkItem(item);\n const isCheckbox = isCheckboxItem(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 = () => {\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['has-category-header']]: hasCategoryHeader,\n [styles['has-checkmark']]: isCheckbox,\n [styles['show-divider']]: showDivider,\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 {...getAnalyticsMetadataAttribute(\n disabled\n ? {}\n : (analyticsMetadataTransformer!({\n action: 'click',\n detail: {\n position,\n id: item.id,\n label: `.${analyticsLabels['menu-item']}`,\n href: (item as LinkItem).href \|\| '',\n },\n }) as GeneratedAnalyticsMetadataButtonDropdownClick)\n )}\n >\n <MenuItem item={item} disabled={disabled} highlighted={highlighted} />\n </li>\n );\n};\n\nexport type InternalItemProps = ButtonDropdownProps.Item & {\n badge?: boolean;\n};\n\nexport type InternalCheckboxItemProps = ButtonDropdownProps.CheckboxItem & {\n badge?: boolean;\n};\n\ninterface MenuItemProps {\n item: InternalItemProps \| InternalCheckboxItemProps;\n disabled: boolean;\n highlighted: boolean;\n}\n\nfunction MenuItem({ item, disabled, highlighted }: MenuItemProps) {\n const menuItemRef = useRef<(HTMLSpanElement & HTMLAnchorElement) \| null>(null);\n const isCheckbox = isCheckboxItem(item);\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 'aria-label': item.ariaLabel,\n className: clsx(styles['menu-item'], analyticsLabels['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 ...(isCheckbox ? getMenuItemCheckboxProps({ disabled, checked: item.checked }) : 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} className={styles['item-tooltip-wrapper']}>\n {menuItem}\n {descriptionEl}\n </Tooltip>\n ) : (\n menuItem\n );\n}\n\nconst MenuItemContent = ({\n item,\n disabled,\n}: {\n item: InternalItemProps \| InternalCheckboxItemProps;\n disabled: boolean;\n}) => {\n const hasIcon = !!(item.iconName \|\| item.iconUrl \|\| item.iconSvg);\n const hasExternal = isLinkItem(item) && item.external;\n const isCheckbox = isCheckboxItem(item);\n return (\n <>\n {isCheckbox && <MenuItemCheckmark checked={item.checked} disabled={disabled} />}\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}\n {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\n// Toggle has aria-hidden set because it's just used as a graphical element,\n// a11y attributes for the checkmark are communicated through the role and aria-checked state\n// of the menu element item.\nconst MenuItemCheckmark = ({ disabled, checked }: { disabled: boolean; checked: boolean }) => {\n const checkmark = <InternalIcon variant={disabled ? 'disabled' : 'normal'} name=\"check\" />;\n return (\n <span\n className={clsx(styles.icon, styles.checkmark, { [styles.disabled]: disabled })}\n aria-hidden=\"true\"\n style={{ visibility: checked ? 'visible' : 'hidden' }}\n >\n {checkmark}\n </span>\n );\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"]}
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';\n\nimport {\n GeneratedAnalyticsMetadataFragment,\n getAnalyticsMetadataAttribute,\n} from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalIcon, { InternalIconProps } from '../../icon/internal';\nimport { useDropdownContext } from '../../internal/components/dropdown/context';\nimport useHiddenDescription from '../../internal/hooks/use-hidden-description';\nimport { GeneratedAnalyticsMetadataButtonDropdownClick } from '../analytics-metadata/interfaces';\nimport { ItemProps, LinkItem } from '../interfaces';\nimport { ButtonDropdownProps } from '../interfaces';\nimport Tooltip from '../tooltip';\nimport { getMenuItemCheckboxProps, getMenuItemProps } from '../utils/menu-item';\nimport { isCheckboxItem, isLinkItem } from '../utils/utils';\nimport { getItemTarget } from '../utils/utils';\n\nimport analyticsLabels from '../analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst ItemElement = ({\n position = '1',\n item,\n disabled,\n onItemActivate,\n highlighted,\n highlightItem,\n showDivider,\n hasCategoryHeader,\n isKeyboardHighlighted = false,\n analyticsMetadataTransformer = (metadata: GeneratedAnalyticsMetadataFragment) => metadata,\n variant = 'normal',\n linkStyle,\n}: ItemProps) => {\n const isLink = isLinkItem(item);\n const isCheckbox = isCheckboxItem(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 = () => {\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['has-category-header']]: hasCategoryHeader,\n [styles['has-checkmark']]: isCheckbox,\n [styles['show-divider']]: showDivider,\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 {...getAnalyticsMetadataAttribute(\n disabled\n ? {}\n : (analyticsMetadataTransformer!({\n action: 'click',\n detail: {\n position,\n id: item.id,\n label: `.${analyticsLabels['menu-item']}`,\n href: (item as LinkItem).href \|\| '',\n },\n }) as GeneratedAnalyticsMetadataButtonDropdownClick)\n )}\n >\n <MenuItem item={item} disabled={disabled} highlighted={highlighted} linkStyle={linkStyle} />\n </li>\n );\n};\n\nexport type InternalItemProps = ButtonDropdownProps.Item & {\n badge?: boolean;\n};\n\nexport type InternalCheckboxItemProps = ButtonDropdownProps.CheckboxItem & {\n badge?: boolean;\n};\n\ninterface MenuItemProps {\n item: InternalItemProps \| InternalCheckboxItemProps;\n disabled: boolean;\n highlighted: boolean;\n linkStyle?: boolean;\n}\n\nfunction MenuItem({ item, disabled, highlighted, linkStyle }: MenuItemProps) {\n const menuItemRef = useRef<(HTMLSpanElement & HTMLAnchorElement) \| null>(null);\n const isCheckbox = isCheckboxItem(item);\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 'aria-label': item.ariaLabel,\n className: clsx(styles['menu-item'], analyticsLabels['menu-item'], linkStyle && styles['link-style']),\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 ...(isCheckbox ? getMenuItemCheckboxProps({ disabled, checked: item.checked }) : 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} className={styles['item-tooltip-wrapper']}>\n {menuItem}\n {descriptionEl}\n </Tooltip>\n ) : (\n menuItem\n );\n}\n\nconst MenuItemContent = ({\n item,\n disabled,\n}: {\n item: InternalItemProps \| InternalCheckboxItemProps;\n disabled: boolean;\n}) => {\n const hasIcon = !!(item.iconName \|\| item.iconUrl \|\| item.iconSvg);\n const hasExternal = isLinkItem(item) && item.external;\n const isCheckbox = isCheckboxItem(item);\n return (\n <>\n {isCheckbox && <MenuItemCheckmark checked={item.checked} disabled={disabled} />}\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}\n {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\n// Toggle has aria-hidden set because it's just used as a graphical element,\n// a11y attributes for the checkmark are communicated through the role and aria-checked state\n// of the menu element item.\nconst MenuItemCheckmark = ({ disabled, checked }: { disabled: boolean; checked: boolean }) => {\n const checkmark = <InternalIcon variant={disabled ? 'disabled' : 'normal'} name=\"check\" />;\n return (\n <span\n className={clsx(styles.icon, styles.checkmark, { [styles.disabled]: disabled })}\n aria-hidden=\"true\"\n style={{ visibility: checked ? 'visible' : 'hidden' }}\n >\n {checkmark}\n </span>\n );\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/lib/internal/template/button-dropdown/item-element/styles.css.js CHANGED Viewed

@@ -1,17 +1,18 @@
     import './styles.scoped.css';
     export default {
-  "item-element": "awsui_item-element_93a1u_1j8bb_141",
-  "disabled": "awsui_disabled_93a1u_1j8bb_153",
-  "show-divider": "awsui_show-divider_93a1u_1j8bb_160",
-  "highlighted": "awsui_highlighted_93a1u_1j8bb_163",
-  "is-focused": "awsui_is-focused_93a1u_1j8bb_178",
-  "menu-item": "awsui_menu-item_93a1u_1j8bb_183",
-  "has-category-header": "awsui_has-category-header_93a1u_1j8bb_198",
-  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_1j8bb_198",
-  "has-checkmark": "awsui_has-checkmark_93a1u_1j8bb_198",
-  "icon": "awsui_icon_93a1u_1j8bb_202",
-  "checkmark": "awsui_checkmark_93a1u_1j8bb_206",
-  "external-icon": "awsui_external-icon_93a1u_1j8bb_213"
+  "item-element": "awsui_item-element_93a1u_l092x_141",
+  "disabled": "awsui_disabled_93a1u_l092x_153",
+  "show-divider": "awsui_show-divider_93a1u_l092x_160",
+  "highlighted": "awsui_highlighted_93a1u_l092x_163",
+  "is-focused": "awsui_is-focused_93a1u_l092x_178",
+  "menu-item": "awsui_menu-item_93a1u_l092x_183",
+  "link-style": "awsui_link-style_93a1u_l092x_195",
+  "has-category-header": "awsui_has-category-header_93a1u_l092x_234",
+  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_l092x_234",
+  "has-checkmark": "awsui_has-checkmark_93a1u_l092x_234",
+  "icon": "awsui_icon_93a1u_l092x_238",
+  "checkmark": "awsui_checkmark_93a1u_l092x_242",
+  "external-icon": "awsui_external-icon_93a1u_l092x_249"
 };

package/lib/internal/template/button-dropdown/item-element/styles.scoped.css CHANGED Viewed

@@ -138,7 +138,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_item-element_93a1u_1j8bb_141:not(#\9) {
+.awsui_item-element_93a1u_l092x_141:not(#\9) {
   position: relative;
   z-index: 1;
   border-block: var(--border-item-width-0zxiwv, 1px) solid transparent;
@@ -150,17 +150,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-start: calc(-1 * var(--border-field-width-yoy972, 1px));
   cursor: pointer;
 }
-.awsui_item-element_93a1u_1j8bb_141.awsui_disabled_93a1u_1j8bb_153:not(#\9) {
+.awsui_item-element_93a1u_l092x_141.awsui_disabled_93a1u_l092x_153:not(#\9) {
   cursor: default;
   color: var(--color-text-dropdown-item-disabled-nf1b1j, #aab7b8);
 }
-.awsui_item-element_93a1u_1j8bb_141:not(#\9):first-child {
+.awsui_item-element_93a1u_l092x_141:not(#\9):first-child {
   margin-block-start: 0;
 }
-.awsui_item-element_93a1u_1j8bb_141.awsui_show-divider_93a1u_1j8bb_160:not(#\9) {
+.awsui_item-element_93a1u_l092x_141.awsui_show-divider_93a1u_l092x_160:not(#\9) {
   border-block-end: var(--border-item-width-0zxiwv, 1px) solid var(--color-border-dropdown-group-mkqzrv, #eaeded);
 }
-.awsui_item-element_93a1u_1j8bb_141.awsui_highlighted_93a1u_1j8bb_163:not(#\9) {
+.awsui_item-element_93a1u_l092x_141.awsui_highlighted_93a1u_l092x_163:not(#\9) {
   color: var(--color-text-dropdown-item-highlighted-ek38zi, #16191f);
   z-index: 2;
   background-color: var(--color-background-dropdown-item-hover-i8ac7r, #f2f3f3);
@@ -170,17 +170,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-start-radius: var(--border-radius-item-jsz3j8, 0px);
   border-end-end-radius: var(--border-radius-item-jsz3j8, 0px);
 }
-.awsui_item-element_93a1u_1j8bb_141.awsui_highlighted_93a1u_1j8bb_163.awsui_disabled_93a1u_1j8bb_153:not(#\9) {
+.awsui_item-element_93a1u_l092x_141.awsui_highlighted_93a1u_l092x_163.awsui_disabled_93a1u_l092x_153:not(#\9) {
   color: var(--color-text-dropdown-item-dimmed-oru6hf, #aab7b8);
   border-color: var(--color-border-dropdown-item-dimmed-hover-ydzhss, #879596);
   background-color: var(--color-background-dropdown-item-dimmed-e83q5u, transparent);
 }
-.awsui_item-element_93a1u_1j8bb_141.awsui_highlighted_93a1u_1j8bb_163.awsui_is-focused_93a1u_1j8bb_178:not(#\9) {
+.awsui_item-element_93a1u_l092x_141.awsui_highlighted_93a1u_l092x_163.awsui_is-focused_93a1u_l092x_178:not(#\9) {
   border-color: var(--color-border-dropdown-item-focused-3o10kx, #0073bb);
   box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-0k725q, 1px) var(--color-border-item-focused-v8nq2m, #0073bb);
 }
-.awsui_menu-item_93a1u_1j8bb_183:not(#\9) {
+.awsui_menu-item_93a1u_l092x_183:not(#\9) {
   min-inline-size: 0;
   word-break: break-word;
   display: flex;
@@ -192,24 +192,62 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   /* stylelint-disable selector-max-type */
   /* stylelint-enable selector-max-type */
 }
-.awsui_menu-item_93a1u_1j8bb_183:not(#\9):focus {
+.awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9) {
+  color: var(--color-text-link-default-hop3gv, #0073bb);
+  font-weight: inherit;
+  letter-spacing: normal;
+  text-decoration-line: underline;
+  text-decoration-color: currentColor;
+  transition-property: color, -webkit-text-decoration;
+  transition-property: color, text-decoration;
+  transition-property: color, text-decoration, -webkit-text-decoration;
+  transition-duration: var(--motion-duration-refresh-only-medium-i6gkfs, 0ms);
+  text-underline-offset: 0.25em;
+  text-decoration-thickness: 1px;
+  padding-block-end: calc(var(--space-xxs-9rrxti, 4px) + var(--space-xxxs-z28114, 2px));
+}
+@media (prefers-reduced-motion: reduce) {
+  .awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9) {
+    animation: none;
+    transition: none;
+  }
+}
+.awsui-motion-disabled .awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9), .awsui-mode-entering .awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9) {
+  animation: none;
+  transition: none;
+}
+.awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9):hover {
+  cursor: pointer;
+  color: var(--color-text-link-hover-8s5z9d, #0a4a74);
+}
+.awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9):focus {
+  outline: none;
+}
+.awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9):active {
+  color: var(--color-text-link-hover-8s5z9d, #0a4a74);
+}
+.awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9):active, .awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9):focus, .awsui_menu-item_93a1u_l092x_183.awsui_link-style_93a1u_l092x_195:not(#\9):hover {
+  text-decoration-line: underline;
+  text-decoration-color: currentColor;
+}
+.awsui_menu-item_93a1u_l092x_183:not(#\9):focus {
   outline: none;
 }
-.awsui_has-category-header_93a1u_1j8bb_198 > .awsui_menu-item_93a1u_1j8bb_183:not(#\9), .awsui_has-category-header_93a1u_1j8bb_198 > .awsui_item-tooltip-wrapper_93a1u_1j8bb_198 > .awsui_menu-item_93a1u_1j8bb_183:not(#\9), .awsui_has-category-header_93a1u_1j8bb_198:not(#\9):not(.awsui_has-checkmark_93a1u_1j8bb_198) > span > .awsui_menu-item_93a1u_1j8bb_183 {
+.awsui_has-category-header_93a1u_l092x_234 > .awsui_menu-item_93a1u_l092x_183:not(#\9), .awsui_has-category-header_93a1u_l092x_234 > .awsui_item-tooltip-wrapper_93a1u_l092x_234 > .awsui_menu-item_93a1u_l092x_183:not(#\9), .awsui_has-category-header_93a1u_l092x_234:not(#\9):not(.awsui_has-checkmark_93a1u_l092x_234) > span > .awsui_menu-item_93a1u_l092x_183 {
   padding-inline-start: calc(var(--space-xs-xf5ch3, 8px) + var(--space-l-xu1x80, 20px));
 }
-.awsui_icon_93a1u_1j8bb_202:not(#\9) {
+.awsui_icon_93a1u_l092x_238:not(#\9) {
   padding-inline-end: var(--space-xxs-9rrxti, 4px);
   flex-shrink: 0;
 }
-.awsui_icon_93a1u_1j8bb_202.awsui_checkmark_93a1u_1j8bb_206:not(#\9) {
+.awsui_icon_93a1u_l092x_238.awsui_checkmark_93a1u_l092x_242:not(#\9) {
   color: var(--color-text-status-info-aq7yd6, #0073bb);
 }
-.awsui_icon_93a1u_1j8bb_202.awsui_disabled_93a1u_1j8bb_153:not(#\9) {
+.awsui_icon_93a1u_l092x_238.awsui_disabled_93a1u_l092x_153:not(#\9) {
   color: var(--color-text-interactive-disabled-e23z4j, #aab7b8);
 }
-.awsui_external-icon_93a1u_1j8bb_213:not(#\9) {
+.awsui_external-icon_93a1u_l092x_249:not(#\9) {
   margin-inline-start: var(--space-xxs-9rrxti, 4px);
 }

package/lib/internal/template/button-dropdown/item-element/styles.selectors.js CHANGED Viewed

@@ -2,17 +2,18 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "item-element": "awsui_item-element_93a1u_1j8bb_141",
-  "disabled": "awsui_disabled_93a1u_1j8bb_153",
-  "show-divider": "awsui_show-divider_93a1u_1j8bb_160",
-  "highlighted": "awsui_highlighted_93a1u_1j8bb_163",
-  "is-focused": "awsui_is-focused_93a1u_1j8bb_178",
-  "menu-item": "awsui_menu-item_93a1u_1j8bb_183",
-  "has-category-header": "awsui_has-category-header_93a1u_1j8bb_198",
-  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_1j8bb_198",
-  "has-checkmark": "awsui_has-checkmark_93a1u_1j8bb_198",
-  "icon": "awsui_icon_93a1u_1j8bb_202",
-  "checkmark": "awsui_checkmark_93a1u_1j8bb_206",
-  "external-icon": "awsui_external-icon_93a1u_1j8bb_213"
+  "item-element": "awsui_item-element_93a1u_l092x_141",
+  "disabled": "awsui_disabled_93a1u_l092x_153",
+  "show-divider": "awsui_show-divider_93a1u_l092x_160",
+  "highlighted": "awsui_highlighted_93a1u_l092x_163",
+  "is-focused": "awsui_is-focused_93a1u_l092x_178",
+  "menu-item": "awsui_menu-item_93a1u_l092x_183",
+  "link-style": "awsui_link-style_93a1u_l092x_195",
+  "has-category-header": "awsui_has-category-header_93a1u_l092x_234",
+  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_l092x_234",
+  "has-checkmark": "awsui_has-checkmark_93a1u_l092x_234",
+  "icon": "awsui_icon_93a1u_l092x_238",
+  "checkmark": "awsui_checkmark_93a1u_l092x_242",
+  "external-icon": "awsui_external-icon_93a1u_l092x_249"
 };

package/lib/internal/template/button-dropdown/items-list.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { ItemListProps } from './interfaces';
-export default function ItemsList({ items, onItemActivate, onGroupToggle, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, lastInDropdown, highlightItem, categoryDisabled, hasExpandableGroups, hasCategoryHeader, expandToViewport, variant, analyticsMetadataTransformer, position, }: ItemListProps): JSX.Element;
+export default function ItemsList({ items, onItemActivate, onGroupToggle, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, lastInDropdown, highlightItem, categoryDisabled, hasExpandableGroups, hasCategoryHeader, expandToViewport, variant, analyticsMetadataTransformer, position, linkStyle, }: ItemListProps): JSX.Element;
 //# sourceMappingURL=items-list.d.ts.map

package/lib/internal/template/button-dropdown/items-list.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"items-list.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,KAAK,EACL,cAAc,EACd,aAAa,EACb,UAAU,EACV,aAAa,EACb,mBAAmB,EACnB,UAAU,EACV,cAAc,EACd,aAAa,EACb,gBAAwB,EACxB,mBAA2B,EAC3B,iBAAyB,EACzB,gBAAwB,EACxB,OAAkB,EAClB,4BAA4B,EAC5B,QAAQ,~~GACT~~,EAAE,aAAa,~~eAkFf~~"}
1	+ {"version":3,"file":"items-list.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,KAAK,EACL,cAAc,EACd,aAAa,EACb,UAAU,EACV,aAAa,EACb,mBAAmB,EACnB,UAAU,EACV,cAAc,EACd,aAAa,EACb,gBAAwB,EACxB,mBAA2B,EAC3B,iBAAyB,EACzB,gBAAwB,EACxB,OAAkB,EAClB,4BAA4B,EAC5B,QAAQ,EACR,SAAS,GACV,EAAE,aAAa,eAmFf"}

package/lib/internal/template/button-dropdown/items-list.js CHANGED Viewed

@@ -7,13 +7,13 @@ import ExpandableCategoryElement from './category-elements/expandable-category-e
 import MobileExpandableCategoryElement from './category-elements/mobile-expandable-category-element';
 import ItemElement from './item-element';
 import { isItemGroup } from './utils/utils';
-export default function ItemsList({ items, onItemActivate, onGroupToggle, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, lastInDropdown, highlightItem, categoryDisabled = false, hasExpandableGroups = false, hasCategoryHeader = false, expandToViewport = false, variant = 'normal', analyticsMetadataTransformer, position, }) {
+export default function ItemsList({ items, onItemActivate, onGroupToggle, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, lastInDropdown, highlightItem, categoryDisabled = false, hasExpandableGroups = false, hasCategoryHeader = false, expandToViewport = false, variant = 'normal', analyticsMetadataTransformer, position, linkStyle, }) {
     const isMobile = useMobile();
     const elements = items.map((item, index) => {
         var _a, _b, _c, _d;
         if (!isItemGroup(item)) {
             const showDivider = (index === items.length - 1 && !lastInDropdown) || isItemGroup(items[index + 1]);
-            return (React.createElement(ItemElement, { key: index, item: item, onItemActivate: onItemActivate, disabled: (_a = item.disabled) !== null && _a !== void 0 ? _a : categoryDisabled, highlighted: isHighlighted(item), isKeyboardHighlighted: isKeyboardHighlight(item), highlightItem: highlightItem, showDivider: showDivider, hasCategoryHeader: hasCategoryHeader, variant: variant, position: `${position ? `${position},` : ''}${index + 1}`, analyticsMetadataTransformer: analyticsMetadataTransformer }));
+            return (React.createElement(ItemElement, { key: index, item: item, onItemActivate: onItemActivate, disabled: (_a = item.disabled) !== null && _a !== void 0 ? _a : categoryDisabled, highlighted: isHighlighted(item), isKeyboardHighlighted: isKeyboardHighlight(item), highlightItem: highlightItem, showDivider: showDivider, hasCategoryHeader: hasCategoryHeader, variant: variant, position: `${position ? `${position},` : ''}${index + 1}`, analyticsMetadataTransformer: analyticsMetadataTransformer, linkStyle: linkStyle }));
         }
         if (hasExpandableGroups) {
             return item.text ? (isMobile ? (React.createElement(MobileExpandableCategoryElement, { key: index, item: item, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, lastInDropdown: lastInDropdown && index === items.length - 1, highlightItem: highlightItem, disabled: (_b = item.disabled) !== null && _b !== void 0 ? _b : false, variant: variant, position: `${position ? `${position},` : ''}${index + 1}` })) : (React.createElement(ExpandableCategoryElement, { key: index, item: item, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, lastInDropdown: true, highlightItem: highlightItem, disabled: (_c = item.disabled) !== null && _c !== void 0 ? _c : false, expandToViewport: expandToViewport, variant: variant, position: `${position ? `${position},` : ''}${index + 1}` }))) : null;

package/lib/internal/template/button-dropdown/items-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"items-list.js","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,eAAe,MAAM,sCAAsC,CAAC;AACnE,OAAO,yBAAyB,MAAM,iDAAiD,CAAC;AACxF,OAAO,+BAA+B,MAAM,wDAAwD,CAAC;AAErG,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,KAAK,EACL,cAAc,EACd,aAAa,EACb,UAAU,EACV,aAAa,EACb,mBAAmB,EACnB,UAAU,EACV,cAAc,EACd,aAAa,EACb,gBAAgB,GAAG,KAAK,EACxB,mBAAmB,GAAG,KAAK,EAC3B,iBAAiB,GAAG,KAAK,EACzB,gBAAgB,GAAG,KAAK,EACxB,OAAO,GAAG,QAAQ,EAClB,4BAA4B,EAC5B,QAAQ,~~GACM~~;IACd,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAE7B,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;;QACzC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE;YACtB,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;YAErG,OAAO,CACL,oBAAC,WAAW,IACV,GAAG,EAAE,KAAK,EACV,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,cAAc,EAC9B,QAAQ,EAAE,MAAA,IAAI,CAAC,QAAQ,mCAAI,gBAAgB,EAC3C,WAAW,EAAE,aAAa,CAAC,IAAI,CAAC,EAChC,qBAAqB,EAAE,mBAAmB,CAAC,IAAI,CAAC,EAChD,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,GAAG,CAAC,EAAE,EACzD,4BAA4B,EAAE,4BAA4B,~~GAC1D~~,CACH,CAAC;SACH;QACD,IAAI,mBAAmB,EAAE;YACvB,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACjB,QAAQ,CAAC,CAAC,CAAC,CACT,oBAAC,+BAA+B,IAC9B,GAAG,EAAE,KAAK,EACV,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,mBAAmB,EAAE,mBAAmB,EACxC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAC5D,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,MAAA,IAAI,CAAC,QAAQ,mCAAI,KAAK,EAChC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,GAAG,CAAC,EAAE,GACzD,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,yBAAyB,IACxB,GAAG,EAAE,KAAK,EACV,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,mBAAmB,EAAE,mBAAmB,EACxC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,IAAI,EACpB,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,MAAA,IAAI,CAAC,QAAQ,mCAAI,KAAK,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,GAAG,CAAC,EAAE,GACzD,CACH,CACF,CAAC,CAAC,CAAC,IAAI,CAAC;SACV;QACD,OAAO,CACL,oBAAC,eAAe,IACd,GAAG,EAAE,KAAK,EACV,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,mBAAmB,EAAE,mBAAmB,EACxC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAC5D,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,MAAA,IAAI,CAAC,QAAQ,mCAAI,KAAK,EAChC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,GAAG,CAAC,EAAE,GACzD,CACH,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,OAAO,0CAAG,QAAQ,CAAI,CAAC;AACzB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport CategoryElement from './category-elements/category-element';\nimport ExpandableCategoryElement from './category-elements/expandable-category-element';\nimport MobileExpandableCategoryElement from './category-elements/mobile-expandable-category-element';\nimport { ItemListProps } from './interfaces';\nimport ItemElement from './item-element';\nimport { isItemGroup } from './utils/utils';\n\nexport default function ItemsList({\n items,\n onItemActivate,\n onGroupToggle,\n targetItem,\n isHighlighted,\n isKeyboardHighlight,\n isExpanded,\n lastInDropdown,\n highlightItem,\n categoryDisabled = false,\n hasExpandableGroups = false,\n hasCategoryHeader = false,\n expandToViewport = false,\n variant = 'normal',\n analyticsMetadataTransformer,\n position,\n}: ItemListProps) {\n const isMobile = useMobile();\n\n const elements = items.map((item, index) => {\n if (!isItemGroup(item)) {\n const showDivider = (index === items.length - 1 && !lastInDropdown) \|\| isItemGroup(items[index + 1]);\n\n return (\n <ItemElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n disabled={item.disabled ?? categoryDisabled}\n highlighted={isHighlighted(item)}\n isKeyboardHighlighted={isKeyboardHighlight(item)}\n highlightItem={highlightItem}\n showDivider={showDivider}\n hasCategoryHeader={hasCategoryHeader}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n />\n );\n }\n if (hasExpandableGroups) {\n return item.text ? (\n isMobile ? (\n <MobileExpandableCategoryElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={lastInDropdown && index === items.length - 1}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n />\n ) : (\n <ExpandableCategoryElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={true}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n expandToViewport={expandToViewport}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n />\n )\n ) : null;\n }\n return (\n <CategoryElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={lastInDropdown && index === items.length - 1}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n />\n );\n });\n\n return <>{elements}</>;\n}\n"]}
1	+ {"version":3,"file":"items-list.js","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport CategoryElement from './category-elements/category-element';\nimport ExpandableCategoryElement from './category-elements/expandable-category-element';\nimport MobileExpandableCategoryElement from './category-elements/mobile-expandable-category-element';\nimport { ItemListProps } from './interfaces';\nimport ItemElement from './item-element';\nimport { isItemGroup } from './utils/utils';\n\nexport default function ItemsList({\n items,\n onItemActivate,\n onGroupToggle,\n targetItem,\n isHighlighted,\n isKeyboardHighlight,\n isExpanded,\n lastInDropdown,\n highlightItem,\n categoryDisabled = false,\n hasExpandableGroups = false,\n hasCategoryHeader = false,\n expandToViewport = false,\n variant = 'normal',\n analyticsMetadataTransformer,\n position,\n linkStyle,\n}: ItemListProps) {\n const isMobile = useMobile();\n\n const elements = items.map((item, index) => {\n if (!isItemGroup(item)) {\n const showDivider = (index === items.length - 1 && !lastInDropdown) \|\| isItemGroup(items[index + 1]);\n\n return (\n <ItemElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n disabled={item.disabled ?? categoryDisabled}\n highlighted={isHighlighted(item)}\n isKeyboardHighlighted={isKeyboardHighlight(item)}\n highlightItem={highlightItem}\n showDivider={showDivider}\n hasCategoryHeader={hasCategoryHeader}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n linkStyle={linkStyle}\n />\n );\n }\n if (hasExpandableGroups) {\n return item.text ? (\n isMobile ? (\n <MobileExpandableCategoryElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={lastInDropdown && index === items.length - 1}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n />\n ) : (\n <ExpandableCategoryElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={true}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n expandToViewport={expandToViewport}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n />\n )\n ) : null;\n }\n return (\n <CategoryElement\n key={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={lastInDropdown && index === items.length - 1}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n />\n );\n });\n\n return <>{elements}</>;\n}\n"]}

package/lib/internal/template/flashbar/analytics-metadata/interfaces.d.ts ADDED Viewed

@@ -0,0 +1,36 @@
+import { LabelIdentifier } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
+export interface GeneratedAnalyticsMetadataFlashbarDismiss {
+    action: 'dismiss';
+    detail: {
+        label: string;
+    };
+}
+export interface GeneratedAnalyticsMetadataFlashbarButtonClick {
+    action: 'buttonClick';
+    detail: {
+        label: string;
+    };
+}
+export interface GeneratedAnalyticsMetadataFlashbarExpand {
+    action: 'expand';
+    detail: {
+        label: string;
+        expanded: string;
+    };
+}
+export interface GeneratedAnalyticsMetadataFlashbarComponent {
+    name: 'awsui.Flashbar';
+    label: LabelIdentifier;
+    properties: {
+        itemsCount: string;
+        stackItems: string;
+        expanded?: string;
+    };
+    innerContext?: {
+        itemPosition: string;
+        itemLabel: string;
+        itemType: string;
+        itemId?: string;
+    };
+}
+//# sourceMappingURL=interfaces.d.ts.map

package/lib/internal/template/flashbar/analytics-metadata/interfaces.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/flashbar/analytics-metadata/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,kEAAkE,CAAC;AAEnG,MAAM,WAAW,yCAAyC;IACxD,MAAM,EAAE,SAAS,CAAC;IAClB,MAAM,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;CACH;AAED,MAAM,WAAW,6CAA6C;IAC5D,MAAM,EAAE,aAAa,CAAC;IACtB,MAAM,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;CACH;AAED,MAAM,WAAW,wCAAwC;IACvD,MAAM,EAAE,QAAQ,CAAC;IACjB,MAAM,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,2CAA2C;IAC1D,IAAI,EAAE,gBAAgB,CAAC;IACvB,KAAK,EAAE,eAAe,CAAC;IACvB,UAAU,EAAE;QACV,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;QACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,YAAY,CAAC,EAAE;QACb,YAAY,EAAE,MAAM,CAAC;QACrB,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,MAAM,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;CACH"}

package/lib/internal/template/flashbar/analytics-metadata/interfaces.js ADDED Viewed

@@ -0,0 +1,4 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+export {};
+//# sourceMappingURL=interfaces.js.map

package/lib/internal/template/flashbar/analytics-metadata/interfaces.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/flashbar/analytics-metadata/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LabelIdentifier } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nexport interface GeneratedAnalyticsMetadataFlashbarDismiss {\n action: 'dismiss';\n detail: {\n label: string;\n };\n}\n\nexport interface GeneratedAnalyticsMetadataFlashbarButtonClick {\n action: 'buttonClick';\n detail: {\n label: string;\n };\n}\n\nexport interface GeneratedAnalyticsMetadataFlashbarExpand {\n action: 'expand';\n detail: {\n label: string;\n expanded: string;\n };\n}\n\nexport interface GeneratedAnalyticsMetadataFlashbarComponent {\n name: 'awsui.Flashbar';\n label: LabelIdentifier;\n properties: {\n itemsCount: string;\n stackItems: string;\n expanded?: string;\n };\n innerContext?: {\n itemPosition: string;\n itemLabel: string;\n itemType: string;\n itemId?: string;\n };\n}\n"]}

package/lib/internal/template/flashbar/analytics-metadata/styles.css.js ADDED Viewed

@@ -0,0 +1,6 @@
+    import './styles.scoped.css';
+    export default {
+  "flash-header": "awsui_flash-header_4c95g_vov7p_5"
+};

package/lib/internal/template/flashbar/analytics-metadata/styles.scoped.css ADDED Viewed

@@ -0,0 +1,7 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+.awsui_flash-header_4c95g_vov7p_5:not(#\9) {
+  /* used in analytics metadata */
+}

package/lib/internal/template/flashbar/analytics-metadata/styles.selectors.js ADDED Viewed

@@ -0,0 +1,7 @@
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "flash-header": "awsui_flash-header_4c95g_vov7p_5"
+};

package/lib/internal/template/flashbar/analytics-metadata/utils.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import { GeneratedAnalyticsMetadataFragment } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
+import { GeneratedAnalyticsMetadataFlashbarComponent } from './interfaces';
+export declare const getComponentsAnalyticsMetadata: (itemsCount: number, stackItems: boolean, expanded?: boolean) => {
+    component: GeneratedAnalyticsMetadataFlashbarComponent;
+};
+export declare const getItemAnalyticsMetadata: (position: number, type: string, id?: string) => GeneratedAnalyticsMetadataFragment;
+//# sourceMappingURL=utils.d.ts.map

package/lib/internal/template/flashbar/analytics-metadata/utils.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/flashbar/analytics-metadata/utils.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kCAAkC,EAAE,MAAM,kEAAkE,CAAC;AAEtH,OAAO,EAAE,2CAA2C,EAAE,MAAM,cAAc,CAAC;AAI3E,eAAO,MAAM,8BAA8B,eAC7B,MAAM,cACN,OAAO,aACR,OAAO,KACjB;IAAE,SAAS,EAAE,2CAA2C,CAAA;CAgB1D,CAAC;AAEF,eAAO,MAAM,wBAAwB,aACzB,MAAM,QACV,MAAM,OACP,MAAM,KACV,kCAYF,CAAC"}

package/lib/internal/template/flashbar/analytics-metadata/utils.js ADDED Viewed

@@ -0,0 +1,33 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import analyticsSelectors from './styles.css.js';
+export const getComponentsAnalyticsMetadata = (itemsCount, stackItems, expanded) => {
+    const metadata = {
+        component: {
+            name: 'awsui.Flashbar',
+            label: stackItems ? { root: 'self', selector: 'ul' } : { root: 'self' },
+            properties: {
+                itemsCount: `${itemsCount}`,
+                stackItems: `${stackItems}`,
+            },
+        },
+    };
+    if (expanded !== undefined) {
+        metadata.component.properties.expanded = `${expanded}`;
+    }
+    return metadata;
+};
+export const getItemAnalyticsMetadata = (position, type, id) => {
+    const baseMetadata = {
+        itemLabel: `.${analyticsSelectors['flash-header']}`,
+        itemPosition: `${position}`,
+        itemType: type,
+    };
+    if (id) {
+        baseMetadata.itemId = id;
+    }
+    return {
+        component: { innerContext: baseMetadata },
+    };
+};
+//# sourceMappingURL=utils.js.map

package/lib/internal/template/flashbar/analytics-metadata/utils.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/flashbar/analytics-metadata/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAMtC,OAAO,kBAAkB,MAAM,iBAAiB,CAAC;AAEjD,MAAM,CAAC,MAAM,8BAA8B,GAAG,CAC5C,UAAkB,EAClB,UAAmB,EACnB,QAAkB,EAC0C,EAAE;IAC9D,MAAM,QAAQ,GAA+D;QAC3E,SAAS,EAAE;YACT,IAAI,EAAE,gBAAgB;YACtB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;YACvE,UAAU,EAAE;gBACV,UAAU,EAAE,GAAG,UAAU,EAAE;gBAC3B,UAAU,EAAE,GAAG,UAAU,EAAE;aAC5B;SACF;KACF,CAAC;IAEF,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,QAAQ,CAAC,SAAS,CAAC,UAAU,CAAC,QAAQ,GAAG,GAAG,QAAQ,EAAE,CAAC;KACxD;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG,CACtC,QAAgB,EAChB,IAAY,EACZ,EAAW,EACyB,EAAE;IACtC,MAAM,YAAY,GAAgE;QAChF,SAAS,EAAE,IAAI,kBAAkB,CAAC,cAAc,CAAC,EAAE;QACnD,YAAY,EAAE,GAAG,QAAQ,EAAE;QAC3B,QAAQ,EAAE,IAAI;KACf,CAAC;IACF,IAAI,EAAE,EAAE;QACN,YAAY,CAAC,MAAM,GAAG,EAAE,CAAC;KAC1B;IACD,OAAO;QACL,SAAS,EAAE,EAAE,YAAY,EAAE,YAAY,EAAE;KAC1C,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { GeneratedAnalyticsMetadataFragment } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { GeneratedAnalyticsMetadataFlashbarComponent } from './interfaces';\n\nimport analyticsSelectors from './styles.css.js';\n\nexport const getComponentsAnalyticsMetadata = (\n itemsCount: number,\n stackItems: boolean,\n expanded?: boolean\n): { component: GeneratedAnalyticsMetadataFlashbarComponent } => {\n const metadata: { component: GeneratedAnalyticsMetadataFlashbarComponent } = {\n component: {\n name: 'awsui.Flashbar',\n label: stackItems ? { root: 'self', selector: 'ul' } : { root: 'self' },\n properties: {\n itemsCount: `${itemsCount}`,\n stackItems: `${stackItems}`,\n },\n },\n };\n\n if (expanded !== undefined) {\n metadata.component.properties.expanded = `${expanded}`;\n }\n return metadata;\n};\n\nexport const getItemAnalyticsMetadata = (\n position: number,\n type: string,\n id?: string\n): GeneratedAnalyticsMetadataFragment => {\n const baseMetadata: GeneratedAnalyticsMetadataFlashbarComponent['innerContext'] = {\n itemLabel: `.${analyticsSelectors['flash-header']}`,\n itemPosition: `${position}`,\n itemType: type,\n };\n if (id) {\n baseMetadata.itemId = id;\n }\n return {\n component: { innerContext: baseMetadata },\n };\n};\n"]}

package/lib/internal/template/flashbar/collapsible-flashbar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.tsx"],"names":[],"mappings":";~~AAoBA~~,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAM7C,OAAO,EAAE,aAAa,EAAE,CAAC;AAQzB,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,~~eA8TjF~~"}
1	+ {"version":3,"file":"collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.tsx"],"names":[],"mappings":";AAwBA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAM7C,OAAO,EAAE,aAAa,EAAE,CAAC;AAQzB,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,eAuUjF"}

package/lib/internal/template/flashbar/collapsible-flashbar.js CHANGED Viewed

@@ -4,6 +4,7 @@ import { __rest } from "tslib";
 import React, { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { TransitionGroup } from 'react-transition-group';
 import clsx from 'clsx';
+import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import { useInternalI18n } from '../i18n/context';
 import InternalIcon from '../icon/internal';
 import { animate, getDOMRects } from '../internal/animate';
@@ -15,6 +16,7 @@ import { useUniqueId } from '../internal/hooks/use-unique-id';
 import { findUpUntil } from '../internal/utils/dom';
 import { scrollElementIntoView } from '../internal/utils/scrollable-containers';
 import { throttle } from '../internal/utils/throttle';
+import { getComponentsAnalyticsMetadata, getItemAnalyticsMetadata } from './analytics-metadata/utils';
 import { useFlashbar } from './common';
 import { Flash, focusFlashById } from './flash';
 import { sendToggleMetric } from './internal/analytics';
@@ -172,7 +174,7 @@ export default function CollapsibleFlashbar(_a) {
                 }
             } }, (state, transitionRootElement) => {
             var _a, _b, _c;
-            return (React.createElement("li", { "aria-hidden": !showInnerContent(item), className: showInnerContent(item)
+            return (React.createElement("li", Object.assign({ "aria-hidden": !showInnerContent(item), className: showInnerContent(item)
                     ? clsx(styles['flash-list-item'], !isFlashbarStackExpanded && styles.item, !collapsedItemRefs.current[getAnimationElementId(item)] && styles['expanded-only'])
                     : clsx(styles.flash, styles[`flash-type-${(_a = item.type) !== null && _a !== void 0 ? _a : 'info'}`], styles.item), ref: element => {
                     if (isFlashbarStackExpanded) {
@@ -185,16 +187,22 @@ export default function CollapsibleFlashbar(_a) {
                     ? {
                         [customCssProps.flashbarStackIndex]: (_c = (_b = item.collapsedIndex) !== null && _b !== void 0 ? _b : item.expandedIndex) !== null && _c !== void 0 ? _c : index,
                     }
-                    : undefined, key: getItemId(item) }, showInnerContent(item) && (React.createElement(Flash
+                    : undefined, key: getItemId(item) }, getAnalyticsMetadataAttribute(getItemAnalyticsMetadata(index + 1, item.type || 'info', item.id))), showInnerContent(item) && (React.createElement(Flash
             // eslint-disable-next-line react/forbid-component-props
             , Object.assign({
                 // eslint-disable-next-line react/forbid-component-props
                 className: clsx(animateFlash && styles['flash-with-motion'], isVisualRefresh && styles['flash-refresh']), key: getItemId(item), ref: shouldUseStandardAnimation(item, index) ? transitionRootElement : undefined, transitionState: shouldUseStandardAnimation(item, index) ? state : undefined, i18nStrings: iconAriaLabels }, item)))));
         }))))));
-    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.flashbar, styles[`breakpoint-${breakpoint}`], styles.stack, isCollapsible && styles.collapsible, items.length === 2 && styles['short-list'], isFlashbarStackExpanded && styles.expanded, isVisualRefresh && styles['visual-refresh']), ref: mergedRef }),
+    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.flashbar, styles[`breakpoint-${breakpoint}`], styles.stack, isCollapsible && styles.collapsible, items.length === 2 && styles['short-list'], isFlashbarStackExpanded && styles.expanded, isVisualRefresh && styles['visual-refresh']), ref: mergedRef }, getAnalyticsMetadataAttribute(getComponentsAnalyticsMetadata(items.length, true, isFlashbarStackExpanded))),
         isFlashbarStackExpanded && renderList(),
-        isCollapsible && (React.createElement("div", { className: clsx(styles['notification-bar'], isVisualRefresh && styles['visual-refresh'], isFlashbarStackExpanded ? styles.expanded : styles.collapsed, transitioning && styles['animation-running'], items.length === 2 && styles['short-list'], getVisualContextClassname('flashbar') // Visual context is needed for focus ring to be white
-            ), onClick: toggleCollapseExpand, ref: notificationBarRef },
+        isCollapsible && (React.createElement("div", Object.assign({ className: clsx(styles['notification-bar'], isVisualRefresh && styles['visual-refresh'], isFlashbarStackExpanded ? styles.expanded : styles.collapsed, transitioning && styles['animation-running'], items.length === 2 && styles['short-list'], getVisualContextClassname('flashbar') // Visual context is needed for focus ring to be white
+            ), onClick: toggleCollapseExpand, ref: notificationBarRef }, getAnalyticsMetadataAttribute({
+            action: 'expand',
+            detail: {
+                label: 'h2',
+                expanded: `${!isFlashbarStackExpanded}`,
+            },
+        })),
             React.createElement("span", { "aria-live": "polite", className: styles.status, role: "status", id: itemCountElementId },
                 notificationBarText && React.createElement("h2", { className: styles.header }, notificationBarText),
                 React.createElement("span", { className: styles['item-count'] }, counterTypes.map(({ type, labelName, iconName }) => (React.createElement(NotificationTypeCount, { key: type, iconName: iconName, label: iconAriaLabels[labelName], count: countByType[type] }))))),