npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.1325 → 3.0.1327 - Mend

@cloudscape-design/components-themeable 3.0.1325 → 3.0.1327

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 (153) hide show

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

@@ -1,6 +1,6 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { useEffect, useImperativeHandle, useRef } from 'react';
+import React, { useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 import clsx from 'clsx';
 import { isThemeActive, Theme, useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';
 import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
@@ -9,21 +9,28 @@ import { InternalButton } from '../button/internal';
 import Dropdown from '../dropdown/internal';
 import { useFunnel } from '../internal/analytics/hooks/use-funnel.js';
 import { getBaseProps } from '../internal/base-component';
+import DropdownFooter from '../internal/components/dropdown-footer';
+import { useDropdownStatus } from '../internal/components/dropdown-status';
 import OptionsList from '../internal/components/options-list';
+import useHiddenDescription from '../internal/hooks/use-hidden-description';
 import { useMobile } from '../internal/hooks/use-mobile';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';
 import { isDevelopment } from '../internal/is-development';
 import { spinWhenOpen } from '../internal/styles/motion/utils';
 import { checkSafeUrl } from '../internal/utils/check-safe-url';
+import ButtonDropdownFilter from './filter';
 import ItemsList from './items-list';
+import { countLeafItems } from './utils/filter-items';
 import { useButtonDropdown } from './utils/use-button-dropdown';
 import { isLinkItem } from './utils/utils.js';
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
-const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', loading = false, loadingText, disabled = false, disabledReason, expandableGroups = false, children, onItemClick, onItemFollow, customTriggerBuilder, expandToViewport, ariaLabel, iconName, iconAlt, iconUrl, iconSvg, title, description, preferCenter, mainAction, showMainActionOnly, __internalRootRef, analyticsMetadataTransformer, linkStyle, fullWidth, position, nativeMainActionAttributes, nativeTriggerAttributes, renderItem, ...props }, ref) => {
+const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', loading = false, loadingText, disabled = false, disabledReason, expandableGroups = false, children, onItemClick, onItemFollow, customTriggerBuilder, expandToViewport, ariaLabel, iconName, iconAlt, iconUrl, iconSvg, title, description, preferCenter, mainAction, showMainActionOnly, __internalRootRef, analyticsMetadataTransformer, linkStyle, fullWidth, position, nativeMainActionAttributes, nativeTriggerAttributes, renderItem, filteringType, filteringPlaceholder, filteringAriaLabel, filteringClearAriaLabel, filteringResultsText, noMatch, i18nStrings, ...props }, ref) => {
     var _a;
     const isInRestrictedView = useMobile();
     const dropdownId = useUniqueId('dropdown');
+    const menuId = useUniqueId('button-dropdown-menu');
+    const hasFiltering = filteringType === 'auto';
     for (const item of items) {
         if (isLinkItem(item)) {
             checkSafeUrl('ButtonDropdown', item.href);
@@ -44,7 +51,7 @@ const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', lo
     const hasMainAction = mainAction && (variant === 'primary' || variant === 'normal');
     const isVisualRefresh = useVisualRefresh();
     const isOneTheme = isThemeActive(Theme.OneTheme);
-    const { isOpen, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, highlightItem, onKeyDown, onKeyUp, onItemActivate, onGroupToggle, toggleDropdown, closeDropdown, setIsUsingMouse, } = useButtonDropdown({
+    const { isOpen, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, highlightItem, onKeyDown, onKeyUp, onItemActivate, onGroupToggle, onDropdownFocusLeave, toggleDropdown, closeDropdown, setIsUsingMouse, filteringValue, setFilteringValue, filteredItems, showExpandableGroups, } = useButtonDropdown({
         items,
         onItemClick,
         onItemFollow,
@@ -53,7 +60,16 @@ const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', lo
         expandToViewport,
         hasExpandableGroups: expandableGroups,
         isInRestrictedView,
+        hasFiltering,
     });
+    const filterRef = useRef(null);
+    useEffect(() => {
+        var _a;
+        // Focus the filter input when it opens.
+        if (isOpen && hasFiltering) {
+            (_a = filterRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    }, [isOpen, hasFiltering]);
     const handleMouseEvent = () => {
         setIsUsingMouse(true);
     };
@@ -107,7 +123,7 @@ const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', lo
         ariaLabel,
         ariaExpanded: canBeOpened && isOpen,
         formAction: 'none',
-        ariaHaspopup: true,
+        ariaHaspopup: hasFiltering ? 'dialog' : true,
         nativeButtonAttributes: nativeTriggerAttributes,
     };
     const triggerId = useUniqueId('awsui-button-dropdown__trigger');
@@ -183,7 +199,29 @@ const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', lo
     }
     const hasHeader = title || description;
     const headerId = useUniqueId('awsui-button-dropdown__header');
+    const footerId = useUniqueId('awsui-button-dropdown__footer');
+    const isNoMatch = hasFiltering && !!filteringValue && filteredItems.length === 0;
+    const isFiltered = hasFiltering && !!filteringValue && filteredItems.length > 0;
+    const totalCount = useMemo(() => countLeafItems(items), [items]);
+    const matchesCount = useMemo(() => countLeafItems(filteredItems), [filteredItems]);
+    const filteredText = isFiltered ? filteringResultsText === null || filteringResultsText === void 0 ? void 0 : filteringResultsText(matchesCount, totalCount) : undefined;
+    const dropdownStatus = useDropdownStatus({
+        statusType: 'finished',
+        isNoMatch,
+        noMatch,
+        filteringResultsText: filteredText,
+    });
+    // Only create a filteringDescription element if filtering is actually enabled,
+    // not just if the string is provided.
+    const filteringItemDescription = hasFiltering ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filteringItemAriaDescription : undefined;
+    const { descriptionEl: filteringDescriptionEl, descriptionId: filteringDescriptionId } = useHiddenDescription(hasFiltering ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filteringItemAriaDescription : undefined);
     const shouldLabelWithTrigger = !ariaLabel && !mainAction && variant !== 'icon' && variant !== 'inline-icon';
+    const highlightedItemId = targetItem && targetItem.id ? `${menuId}-${targetItem.id}` : undefined;
+    const filterElement = hasFiltering ? (React.createElement(ButtonDropdownFilter, { ref: filterRef, value: filteringValue, onChange: event => setFilteringValue(event.detail.value), placeholder: filteringPlaceholder, ariaLabel: filteringAriaLabel, clearAriaLabel: filteringClearAriaLabel, nativeInputAttributes: {
+            'aria-activedescendant': highlightedItemId !== null && highlightedItemId !== void 0 ? highlightedItemId : '',
+            'aria-owns': menuId,
+            'aria-controls': menuId,
+        } })) : null;
     const { loadingButtonCount } = useFunnel();
     useEffect(() => {
         if (loading) {
@@ -195,14 +233,15 @@ const InternalButtonDropdown = React.forwardRef(({ items, variant = 'normal', lo
         }
     }, [loading, loadingButtonCount]);
     return (React.createElement("div", { ...baseProps, onKeyDown: onKeyDown, onKeyUp: onKeyUp, onMouseDown: handleMouseEvent, onMouseMove: handleMouseEvent, className: clsx(styles['button-dropdown'], styles[`variant-${variant}`], canBeFullWidth && styles['full-width'], baseProps.className), "aria-owns": expandToViewport && isOpen ? dropdownId : undefined, ref: __internalRootRef },
-        React.createElement(Dropdown, { open: canBeOpened && isOpen, stretchTriggerHeight: variant === 'navigation', minWidth: expandToViewport ? undefined : 'trigger', hideBlockBorder: false, expandToViewport: expandToViewport, preferredAlignment: preferCenter ? 'center' : 'start', onOutsideClick: () => toggleDropdown(), trigger: trigger, dropdownId: dropdownId, content: React.createElement(React.Fragment, null,
+        React.createElement(Dropdown, { open: canBeOpened && isOpen, stretchTriggerHeight: variant === 'navigation', minWidth: expandToViewport ? undefined : 'trigger', hideBlockBorder: false, expandToViewport: expandToViewport, preferredAlignment: preferCenter ? 'center' : 'start', onOutsideClick: () => toggleDropdown(), onFocusLeave: onDropdownFocusLeave, trigger: trigger, dropdownId: dropdownId, header: filterElement, ariaRole: hasFiltering ? 'dialog' : undefined, ariaLabel: hasFiltering ? ariaLabel : undefined, footer: dropdownStatus.content ? (React.createElement(DropdownFooter, { content: isOpen ? dropdownStatus.content : null, id: footerId, hasItems: !isNoMatch })) : null, content: React.createElement(React.Fragment, null,
                 hasHeader && (React.createElement("div", { className: styles.header, id: headerId },
                     title && (React.createElement("div", { className: styles.title },
                         React.createElement(InternalBox, { fontSize: "heading-s", fontWeight: "bold", color: "inherit", tagOverride: "h2", margin: { vertical: 'n', horizontal: 'n' } }, title))),
                     description && (React.createElement(InternalBox, { fontSize: "body-s" },
                         React.createElement("span", { className: styles.description }, description))))),
-                React.createElement(OptionsList, { open: canBeOpened && isOpen, position: "static", role: "menu", tagOverride: "ul", decreaseBlockMargin: true, ariaLabel: ariaLabel, ariaLabelledby: hasHeader ? headerId : shouldLabelWithTrigger ? triggerId : undefined, statusType: "finished" },
-                    React.createElement(ItemsList, { items: items, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, hasExpandableGroups: expandableGroups, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, lastInDropdown: true, highlightItem: highlightItem, expandToViewport: expandToViewport, variant: variant, analyticsMetadataTransformer: analyticsMetadataTransformer, linkStyle: linkStyle, position: position, renderItem: renderItem }))) })));
+                React.createElement(OptionsList, { open: canBeOpened && isOpen, position: "static", role: "menu", nativeAttributes: { id: menuId }, tagOverride: "ul", decreaseBlockMargin: true, ariaLabel: ariaLabel, ariaLabelledby: hasHeader ? headerId : shouldLabelWithTrigger ? triggerId : undefined, ariaDescribedby: dropdownStatus.content ? footerId : undefined, statusType: "finished" },
+                    React.createElement(ItemsList, { items: filteredItems, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, hasExpandableGroups: showExpandableGroups, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, lastInDropdown: true, highlightItem: highlightItem, expandToViewport: expandToViewport, variant: variant, analyticsMetadataTransformer: analyticsMetadataTransformer, linkStyle: linkStyle, position: position, renderItem: renderItem, filteringText: filteringValue, filteringEnabled: hasFiltering, menuId: hasFiltering ? menuId : undefined, filteringDescriptionId: filteringItemDescription ? filteringDescriptionId : undefined })),
+                filteringDescriptionEl) })));
 });
 export default InternalButtonDropdown;
 //# sourceMappingURL=internal.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-dropdown/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { isThemeActive, Theme, useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton, InternalButtonProps } from '../button/internal';\nimport Dropdown from '../dropdown/internal';\nimport { IconProps } from '../icon/interfaces';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel.js';\nimport { getBaseProps } from '../internal/base-component';\nimport OptionsList from '../internal/components/options-list';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';\nimport { isDevelopment } from '../internal/is-development';\nimport { spinWhenOpen } from '../internal/styles/motion/utils';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport {\n GeneratedAnalyticsMetadataButtonDropdownCollapse,\n GeneratedAnalyticsMetadataButtonDropdownExpand,\n} from './analytics-metadata/interfaces.js';\nimport { ButtonDropdownProps } from './interfaces';\nimport { InternalButtonDropdownProps, InternalItem } from './internal-interfaces';\nimport ItemsList from './items-list';\nimport { useButtonDropdown } from './utils/use-button-dropdown';\nimport { isLinkItem } from './utils/utils.js';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst InternalButtonDropdown = React.forwardRef(\n (\n {\n items,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n disabledReason,\n expandableGroups = false,\n children,\n onItemClick,\n onItemFollow,\n customTriggerBuilder,\n expandToViewport,\n ariaLabel,\n iconName,\n iconAlt,\n iconUrl,\n iconSvg,\n title,\n description,\n preferCenter,\n mainAction,\n showMainActionOnly,\n __internalRootRef,\n analyticsMetadataTransformer,\n linkStyle,\n fullWidth,\n position,\n nativeMainActionAttributes,\n nativeTriggerAttributes,\n renderItem,\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 if (isLinkItem(item)) {\n checkSafeUrl('ButtonDropdown', item.href);\n }\n }\n if (mainAction) {\n checkSafeUrl('ButtonDropdown', mainAction.href);\n }\n\n const hasCustomTriggerIcon = !!(iconName \|\| iconUrl \|\| iconSvg);\n\n if (isDevelopment) {\n if (mainAction && variant !== 'primary' && variant !== 'normal') {\n warnOnce('ButtonDropdown', 'Main action is only supported for \"primary\" and \"normal\" component variant.');\n }\n if (hasCustomTriggerIcon && variant !== 'icon' && variant !== 'inline-icon') {\n warnOnce('ButtonDropdown', 'Custom icon is only supported for \"icon\" and \"inline-icon\" component variant.');\n }\n }\n const hasMainAction = mainAction && (variant === 'primary' \|\| variant === 'normal');\n const isVisualRefresh = useVisualRefresh();\n const isOneTheme = isThemeActive(Theme.OneTheme);\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 // Scroll is unnecessary when moving focus back to the dropdown trigger.\n onReturnFocus: () => triggerRef.current?.focus({ preventScroll: true }),\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 useImperativeHandle(\n ref,\n () => ({\n focus(...args) {\n (hasMainAction ? mainActionRef : triggerRef).current?.focus(...args);\n },\n focusDropdownTrigger(...args) {\n triggerRef.current?.focus(...args);\n },\n }),\n [mainActionRef, triggerRef, hasMainAction]\n );\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 canBeFullWidth = !!fullWidth && (variant === 'primary' \|\| variant === 'normal');\n\n const triggerVariant = variant === 'navigation' ? undefined : variant === 'inline-icon' ? 'inline-icon' : variant;\n const iconProps: Partial<ButtonProps & { __iconClass?: string; __iconSize?: IconProps.Size }> =\n variant === 'icon' \|\| variant === 'inline-icon'\n ? {\n iconName: hasCustomTriggerIcon ? iconName : 'ellipsis',\n iconAlt,\n iconUrl,\n iconSvg,\n }\n : {\n iconName: isOneTheme ? 'angle-down' : 'caret-down-filled',\n __iconSize: isOneTheme ? 'x-small' : 'normal',\n iconAlign: 'right',\n __iconClass: spinWhenOpen(styles, 'rotate', canBeOpened && isOpen),\n };\n\n const baseTriggerProps: InternalButtonProps = {\n className: clsx(\n styles['trigger-button'],\n styles['test-utils-button-trigger'],\n analyticsSelectors['trigger-label']\n ),\n ...iconProps,\n variant: triggerVariant,\n loading,\n loadingText,\n disabled,\n disabledReason,\n onClick: (event: Event) => {\n event.preventDefault();\n clickHandler();\n },\n ariaLabel,\n ariaExpanded: canBeOpened && isOpen,\n formAction: 'none',\n ariaHaspopup: true,\n nativeButtonAttributes: nativeTriggerAttributes,\n };\n\n const triggerId = useUniqueId('awsui-button-dropdown__trigger');\n\n const triggerHasBadge = () => {\n const groupKey: keyof ButtonDropdownProps.ItemGroup = 'items';\n const flatItems = items.flatMap(item => {\n if (groupKey in item) {\n return item.items;\n }\n return item;\n });\n\n const badgeKey: keyof InternalItem = 'badge';\n return (\n variant === 'icon' &&\n !!flatItems?.find(item => {\n if (badgeKey in item) {\n return (item as InternalItem).badge;\n }\n })\n );\n };\n\n let trigger: React.ReactNode = null;\n\n const analyticsMetadata:\n \| GeneratedAnalyticsMetadataButtonDropdownExpand\n \| GeneratedAnalyticsMetadataButtonDropdownCollapse\n \| Record<string, never> = disabled\n ? {}\n : {\n action: !isOpen ? 'expand' : 'collapse',\n detail: {\n label: `.${analyticsSelectors['trigger-label']}`,\n },\n };\n\n if (customTriggerBuilder) {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n {customTriggerBuilder({\n testUtilsClass: styles['test-utils-button-trigger'],\n ariaExpanded: canBeOpened && isOpen,\n onClick: clickHandler,\n triggerRef,\n ariaLabel,\n disabled,\n disabledReason,\n isOpen,\n })}\n </div>\n );\n } else if (hasMainAction) {\n const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel, ...mainActionProps } =\n mainAction;\n const mainActionIconProps = external\n ? ({ iconName: 'external', iconAlign: 'right', target: '_blank', rel: 'noopener noreferrer' } as const)\n : ({ iconName, iconAlt, iconSvg, iconUrl } as const);\n const mainActionAriaLabel = externalIconAriaLabel\n ? `${mainAction.ariaLabel ?? mainAction.text} ${mainAction.externalIconAriaLabel}`\n : mainAction.ariaLabel;\n const hasNoText = !text;\n const mainActionButton = (\n <InternalButton\n ref={mainActionRef}\n {...mainActionProps}\n {...mainActionIconProps}\n fullWidth={canBeFullWidth}\n className={clsx(\n styles['trigger-button'],\n hasNoText && styles['has-no-text'],\n isVisualRefresh && styles['visual-refresh'],\n canBeFullWidth && styles['main-action-full-width']\n )}\n variant={variant}\n ariaLabel={mainActionAriaLabel}\n formAction=\"none\"\n nativeAnchorAttributes={nativeMainActionAttributes?.anchor}\n nativeButtonAttributes={nativeMainActionAttributes?.button}\n >\n {text}\n </InternalButton>\n );\n trigger = (\n <div role=\"group\" aria-label={ariaLabel} className={styles['split-trigger-wrapper']}>\n <div\n className={clsx(\n styles['trigger-item'],\n styles['split-trigger'],\n styles[`variant-${variant}`],\n mainActionProps.loading && styles.loading\n )}\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 {...getAnalyticsMetadataAttribute({\n action: 'click',\n detail: {\n label: `.${analyticsSelectors['main-action-label']}`,\n },\n })}\n >\n {mainActionButton}\n </div>\n {!showMainActionOnly && (\n <div\n className={clsx(\n styles['trigger-item'],\n styles['dropdown-trigger'],\n isVisualRefresh && styles['visual-refresh'],\n !!children && styles['has-trigger-text'],\n styles[`variant-${variant}`],\n baseTriggerProps.loading && styles.loading\n )}\n {...getAnalyticsMetadataAttribute(analyticsMetadata)}\n >\n <InternalButton\n ref={triggerRef}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['main-action-trigger-full-width']]: canBeFullWidth,\n })}\n __emitPerformanceMarks={false}\n >\n {children}\n </InternalButton>\n </div>\n )}\n </div>\n );\n } else {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n <InternalButton\n ref={triggerRef}\n id={triggerId}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['full-width']]: canBeFullWidth,\n [styles.loading]: canBeFullWidth && !!loading,\n })}\n badge={triggerHasBadge()}\n fullWidth={fullWidth}\n >\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 shouldLabelWithTrigger = !ariaLabel && !mainAction && variant !== 'icon' && variant !== 'inline-icon';\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(\n styles['button-dropdown'],\n styles[`variant-${variant}`],\n canBeFullWidth && styles['full-width'],\n baseProps.className\n )}\n aria-owns={expandToViewport && isOpen ? dropdownId : undefined}\n ref={__internalRootRef}\n >\n <Dropdown\n open={canBeOpened && isOpen}\n stretchTriggerHeight={variant === 'navigation'}\n minWidth={expandToViewport ? undefined : 'trigger'}\n hideBlockBorder={false}\n expandToViewport={expandToViewport}\n preferredAlignment={preferCenter ? 'center' : 'start'}\n onOutsideClick={() => toggleDropdown()}\n trigger={trigger}\n dropdownId={dropdownId}\n content={\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 tagOverride=\"ul\"\n decreaseBlockMargin={true}\n ariaLabel={ariaLabel}\n ariaLabelledby={hasHeader ? headerId : shouldLabelWithTrigger ? triggerId : 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 lastInDropdown={true}\n highlightItem={highlightItem}\n expandToViewport={expandToViewport}\n variant={variant}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n linkStyle={linkStyle}\n position={position}\n renderItem={renderItem}\n />\n </OptionsList>\n </>\n }\n />\n </div>\n );\n }\n);\n\nexport default InternalButtonDropdown;\n"]}
1	+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-dropdown/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { isThemeActive, Theme, useUniqueId, warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton, InternalButtonProps } from '../button/internal';\nimport Dropdown from '../dropdown/internal';\nimport { IconProps } from '../icon/interfaces';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel.js';\nimport { getBaseProps } from '../internal/base-component';\nimport DropdownFooter from '../internal/components/dropdown-footer';\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport OptionsList from '../internal/components/options-list';\nimport useHiddenDescription from '../internal/hooks/use-hidden-description';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';\nimport { isDevelopment } from '../internal/is-development';\nimport { spinWhenOpen } from '../internal/styles/motion/utils';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport {\n GeneratedAnalyticsMetadataButtonDropdownCollapse,\n GeneratedAnalyticsMetadataButtonDropdownExpand,\n} from './analytics-metadata/interfaces.js';\nimport ButtonDropdownFilter from './filter';\nimport { ButtonDropdownProps } from './interfaces';\nimport { InternalButtonDropdownProps, InternalItem } from './internal-interfaces';\nimport ItemsList from './items-list';\nimport { countLeafItems } from './utils/filter-items';\nimport { useButtonDropdown } from './utils/use-button-dropdown';\nimport { isLinkItem } from './utils/utils.js';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst InternalButtonDropdown = React.forwardRef(\n (\n {\n items,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n disabledReason,\n expandableGroups = false,\n children,\n onItemClick,\n onItemFollow,\n customTriggerBuilder,\n expandToViewport,\n ariaLabel,\n iconName,\n iconAlt,\n iconUrl,\n iconSvg,\n title,\n description,\n preferCenter,\n mainAction,\n showMainActionOnly,\n __internalRootRef,\n analyticsMetadataTransformer,\n linkStyle,\n fullWidth,\n position,\n nativeMainActionAttributes,\n nativeTriggerAttributes,\n renderItem,\n filteringType,\n filteringPlaceholder,\n filteringAriaLabel,\n filteringClearAriaLabel,\n filteringResultsText,\n noMatch,\n i18nStrings,\n ...props\n }: InternalButtonDropdownProps,\n ref: React.Ref<ButtonDropdownProps.Ref>\n ) => {\n const isInRestrictedView = useMobile();\n const dropdownId = useUniqueId('dropdown');\n const menuId = useUniqueId('button-dropdown-menu');\n const hasFiltering = filteringType === 'auto';\n for (const item of items) {\n if (isLinkItem(item)) {\n checkSafeUrl('ButtonDropdown', item.href);\n }\n }\n if (mainAction) {\n checkSafeUrl('ButtonDropdown', mainAction.href);\n }\n\n const hasCustomTriggerIcon = !!(iconName \|\| iconUrl \|\| iconSvg);\n\n if (isDevelopment) {\n if (mainAction && variant !== 'primary' && variant !== 'normal') {\n warnOnce('ButtonDropdown', 'Main action is only supported for \"primary\" and \"normal\" component variant.');\n }\n if (hasCustomTriggerIcon && variant !== 'icon' && variant !== 'inline-icon') {\n warnOnce('ButtonDropdown', 'Custom icon is only supported for \"icon\" and \"inline-icon\" component variant.');\n }\n }\n const hasMainAction = mainAction && (variant === 'primary' \|\| variant === 'normal');\n const isVisualRefresh = useVisualRefresh();\n const isOneTheme = isThemeActive(Theme.OneTheme);\n\n const {\n isOpen,\n targetItem,\n isHighlighted,\n isKeyboardHighlight,\n isExpanded,\n highlightItem,\n onKeyDown,\n onKeyUp,\n onItemActivate,\n onGroupToggle,\n onDropdownFocusLeave,\n toggleDropdown,\n closeDropdown,\n setIsUsingMouse,\n filteringValue,\n setFilteringValue,\n filteredItems,\n showExpandableGroups,\n } = useButtonDropdown({\n items,\n onItemClick,\n onItemFollow,\n // Scroll is unnecessary when moving focus back to the dropdown trigger.\n onReturnFocus: () => triggerRef.current?.focus({ preventScroll: true }),\n expandToViewport,\n hasExpandableGroups: expandableGroups,\n isInRestrictedView,\n hasFiltering,\n });\n\n const filterRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n // Focus the filter input when it opens.\n if (isOpen && hasFiltering) {\n filterRef.current?.focus();\n }\n }, [isOpen, hasFiltering]);\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 useImperativeHandle(\n ref,\n () => ({\n focus(...args) {\n (hasMainAction ? mainActionRef : triggerRef).current?.focus(...args);\n },\n focusDropdownTrigger(...args) {\n triggerRef.current?.focus(...args);\n },\n }),\n [mainActionRef, triggerRef, hasMainAction]\n );\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 canBeFullWidth = !!fullWidth && (variant === 'primary' \|\| variant === 'normal');\n\n const triggerVariant = variant === 'navigation' ? undefined : variant === 'inline-icon' ? 'inline-icon' : variant;\n const iconProps: Partial<ButtonProps & { __iconClass?: string; __iconSize?: IconProps.Size }> =\n variant === 'icon' \|\| variant === 'inline-icon'\n ? {\n iconName: hasCustomTriggerIcon ? iconName : 'ellipsis',\n iconAlt,\n iconUrl,\n iconSvg,\n }\n : {\n iconName: isOneTheme ? 'angle-down' : 'caret-down-filled',\n __iconSize: isOneTheme ? 'x-small' : 'normal',\n iconAlign: 'right',\n __iconClass: spinWhenOpen(styles, 'rotate', canBeOpened && isOpen),\n };\n\n const baseTriggerProps: InternalButtonProps = {\n className: clsx(\n styles['trigger-button'],\n styles['test-utils-button-trigger'],\n analyticsSelectors['trigger-label']\n ),\n ...iconProps,\n variant: triggerVariant,\n loading,\n loadingText,\n disabled,\n disabledReason,\n onClick: (event: Event) => {\n event.preventDefault();\n clickHandler();\n },\n ariaLabel,\n ariaExpanded: canBeOpened && isOpen,\n formAction: 'none',\n ariaHaspopup: hasFiltering ? 'dialog' : true,\n nativeButtonAttributes: nativeTriggerAttributes,\n };\n\n const triggerId = useUniqueId('awsui-button-dropdown__trigger');\n\n const triggerHasBadge = () => {\n const groupKey: keyof ButtonDropdownProps.ItemGroup = 'items';\n const flatItems = items.flatMap(item => {\n if (groupKey in item) {\n return item.items;\n }\n return item;\n });\n\n const badgeKey: keyof InternalItem = 'badge';\n return (\n variant === 'icon' &&\n !!flatItems?.find(item => {\n if (badgeKey in item) {\n return (item as InternalItem).badge;\n }\n })\n );\n };\n\n let trigger: React.ReactNode = null;\n\n const analyticsMetadata:\n \| GeneratedAnalyticsMetadataButtonDropdownExpand\n \| GeneratedAnalyticsMetadataButtonDropdownCollapse\n \| Record<string, never> = disabled\n ? {}\n : {\n action: !isOpen ? 'expand' : 'collapse',\n detail: {\n label: `.${analyticsSelectors['trigger-label']}`,\n },\n };\n\n if (customTriggerBuilder) {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n {customTriggerBuilder({\n testUtilsClass: styles['test-utils-button-trigger'],\n ariaExpanded: canBeOpened && isOpen,\n onClick: clickHandler,\n triggerRef,\n ariaLabel,\n disabled,\n disabledReason,\n isOpen,\n })}\n </div>\n );\n } else if (hasMainAction) {\n const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel, ...mainActionProps } =\n mainAction;\n const mainActionIconProps = external\n ? ({ iconName: 'external', iconAlign: 'right', target: '_blank', rel: 'noopener noreferrer' } as const)\n : ({ iconName, iconAlt, iconSvg, iconUrl } as const);\n const mainActionAriaLabel = externalIconAriaLabel\n ? `${mainAction.ariaLabel ?? mainAction.text} ${mainAction.externalIconAriaLabel}`\n : mainAction.ariaLabel;\n const hasNoText = !text;\n const mainActionButton = (\n <InternalButton\n ref={mainActionRef}\n {...mainActionProps}\n {...mainActionIconProps}\n fullWidth={canBeFullWidth}\n className={clsx(\n styles['trigger-button'],\n hasNoText && styles['has-no-text'],\n isVisualRefresh && styles['visual-refresh'],\n canBeFullWidth && styles['main-action-full-width']\n )}\n variant={variant}\n ariaLabel={mainActionAriaLabel}\n formAction=\"none\"\n nativeAnchorAttributes={nativeMainActionAttributes?.anchor}\n nativeButtonAttributes={nativeMainActionAttributes?.button}\n >\n {text}\n </InternalButton>\n );\n trigger = (\n <div role=\"group\" aria-label={ariaLabel} className={styles['split-trigger-wrapper']}>\n <div\n className={clsx(\n styles['trigger-item'],\n styles['split-trigger'],\n styles[`variant-${variant}`],\n mainActionProps.loading && styles.loading\n )}\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 {...getAnalyticsMetadataAttribute({\n action: 'click',\n detail: {\n label: `.${analyticsSelectors['main-action-label']}`,\n },\n })}\n >\n {mainActionButton}\n </div>\n {!showMainActionOnly && (\n <div\n className={clsx(\n styles['trigger-item'],\n styles['dropdown-trigger'],\n isVisualRefresh && styles['visual-refresh'],\n !!children && styles['has-trigger-text'],\n styles[`variant-${variant}`],\n baseTriggerProps.loading && styles.loading\n )}\n {...getAnalyticsMetadataAttribute(analyticsMetadata)}\n >\n <InternalButton\n ref={triggerRef}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['main-action-trigger-full-width']]: canBeFullWidth,\n })}\n __emitPerformanceMarks={false}\n >\n {children}\n </InternalButton>\n </div>\n )}\n </div>\n );\n } else {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n <InternalButton\n ref={triggerRef}\n id={triggerId}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['full-width']]: canBeFullWidth,\n [styles.loading]: canBeFullWidth && !!loading,\n })}\n badge={triggerHasBadge()}\n fullWidth={fullWidth}\n >\n {children}\n </InternalButton>\n </div>\n );\n }\n\n const hasHeader = title \|\| description;\n const headerId = useUniqueId('awsui-button-dropdown__header');\n const footerId = useUniqueId('awsui-button-dropdown__footer');\n\n const isNoMatch = hasFiltering && !!filteringValue && filteredItems.length === 0;\n const isFiltered = hasFiltering && !!filteringValue && filteredItems.length > 0;\n\n const totalCount = useMemo(() => countLeafItems(items), [items]);\n const matchesCount = useMemo(() => countLeafItems(filteredItems), [filteredItems]);\n const filteredText = isFiltered ? filteringResultsText?.(matchesCount, totalCount) : undefined;\n\n const dropdownStatus = useDropdownStatus({\n statusType: 'finished',\n isNoMatch,\n noMatch,\n filteringResultsText: filteredText,\n });\n\n // Only create a filteringDescription element if filtering is actually enabled,\n // not just if the string is provided.\n const filteringItemDescription = hasFiltering ? i18nStrings?.filteringItemAriaDescription : undefined;\n const { descriptionEl: filteringDescriptionEl, descriptionId: filteringDescriptionId } = useHiddenDescription(\n hasFiltering ? i18nStrings?.filteringItemAriaDescription : undefined\n );\n\n const shouldLabelWithTrigger = !ariaLabel && !mainAction && variant !== 'icon' && variant !== 'inline-icon';\n\n const highlightedItemId = targetItem && targetItem.id ? `${menuId}-${targetItem.id}` : undefined;\n\n const filterElement = hasFiltering ? (\n <ButtonDropdownFilter\n ref={filterRef}\n value={filteringValue}\n onChange={event => setFilteringValue(event.detail.value)}\n placeholder={filteringPlaceholder}\n ariaLabel={filteringAriaLabel}\n clearAriaLabel={filteringClearAriaLabel}\n nativeInputAttributes={{\n 'aria-activedescendant': highlightedItemId ?? '',\n 'aria-owns': menuId,\n 'aria-controls': menuId,\n }}\n />\n ) : null;\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(\n styles['button-dropdown'],\n styles[`variant-${variant}`],\n canBeFullWidth && styles['full-width'],\n baseProps.className\n )}\n aria-owns={expandToViewport && isOpen ? dropdownId : undefined}\n ref={__internalRootRef}\n >\n <Dropdown\n open={canBeOpened && isOpen}\n stretchTriggerHeight={variant === 'navigation'}\n minWidth={expandToViewport ? undefined : 'trigger'}\n hideBlockBorder={false}\n expandToViewport={expandToViewport}\n preferredAlignment={preferCenter ? 'center' : 'start'}\n onOutsideClick={() => toggleDropdown()}\n onFocusLeave={onDropdownFocusLeave}\n trigger={trigger}\n dropdownId={dropdownId}\n header={filterElement}\n ariaRole={hasFiltering ? 'dialog' : undefined}\n ariaLabel={hasFiltering ? ariaLabel : undefined}\n footer={\n dropdownStatus.content ? (\n <DropdownFooter content={isOpen ? dropdownStatus.content : null} id={footerId} hasItems={!isNoMatch} />\n ) : null\n }\n content={\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 nativeAttributes={{ id: menuId }}\n tagOverride=\"ul\"\n decreaseBlockMargin={true}\n ariaLabel={ariaLabel}\n ariaLabelledby={hasHeader ? headerId : shouldLabelWithTrigger ? triggerId : undefined}\n ariaDescribedby={dropdownStatus.content ? footerId : undefined}\n statusType=\"finished\"\n >\n <ItemsList\n items={filteredItems}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n hasExpandableGroups={showExpandableGroups}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={true}\n highlightItem={highlightItem}\n expandToViewport={expandToViewport}\n variant={variant}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n linkStyle={linkStyle}\n position={position}\n renderItem={renderItem}\n filteringText={filteringValue}\n filteringEnabled={hasFiltering}\n menuId={hasFiltering ? menuId : undefined}\n filteringDescriptionId={filteringItemDescription ? filteringDescriptionId : undefined}\n />\n </OptionsList>\n {filteringDescriptionEl}\n </>\n }\n />\n </div>\n );\n }\n);\n\nexport default InternalButtonDropdown;\n"]}

package/lib/internal/template/button-dropdown/item-element/index.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 import { ItemProps } from '../internal-interfaces';
-declare const ItemElement: ({ position, index, item, disabled, onItemActivate, highlighted, highlightItem, showDivider, hasCategoryHeader, isKeyboardHighlighted, analyticsMetadataTransformer, variant, linkStyle, renderItem, parentProps, }: ItemProps) => JSX.Element;
+declare const ItemElement: ({ position, index, item, disabled, onItemActivate, highlighted, highlightItem, showDivider, hasCategoryHeader, isKeyboardHighlighted, analyticsMetadataTransformer, variant, linkStyle, renderItem, parentProps, filteringText, filteringEnabled, menuId, filteringDescriptionId, }: ItemProps) => JSX.Element;
 export default ItemElement;
 //# sourceMappingURL=index.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/item-element/index.tsx"],"names":[],"mappings":"~~AAiBA~~,OAAO,EAAsC,SAAS,EAAE,MAAM,wBAAwB,CAAC;AASvF,QAAA,MAAM,WAAW,GAAI,~~oNAgBlB~~,SAAS,~~gBAgEX~~,CAAC;~~AAoLF~~,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/item-element/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAsC,SAAS,EAAE,MAAM,wBAAwB,CAAC;AASvF,QAAA,MAAM,WAAW,GAAI,qRAoBlB,SAAS,gBAoEX,CAAC;AAqOF,eAAe,WAAW,CAAC"}

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

@@ -5,16 +5,19 @@ import clsx from 'clsx';
 import { getAnalyticsMetadataAttribute, } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import { useDropdownContext } from '../../dropdown/context';
 import InternalIcon from '../../icon/internal';
+import HighlightMatch from '../../internal/components/option/highlight-match';
 import useHiddenDescription from '../../internal/hooks/use-hidden-description';
 import { useVisualRefresh } from '../../internal/hooks/use-visual-mode';
 import { getDataAttributes } from '../../internal/utils/data-attributes';
+import { scrollElementIntoView } from '../../internal/utils/scrollable-containers';
+import { joinStrings } from '../../internal/utils/strings';
 import Tooltip from '../tooltip';
 import { getMenuItemCheckboxProps, getMenuItemProps } from '../utils/menu-item';
 import { isCheckboxItem, isLinkItem } from '../utils/utils';
 import { getItemTarget } from '../utils/utils';
 import analyticsLabels from '../analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
-const ItemElement = ({ position = '1', index, item, disabled, onItemActivate, highlighted, highlightItem, showDivider, hasCategoryHeader, isKeyboardHighlighted = false, analyticsMetadataTransformer = (metadata) => metadata, variant = 'normal', linkStyle, renderItem, parentProps, }) => {
+const ItemElement = ({ position = '1', index, item, disabled, onItemActivate, highlighted, highlightItem, showDivider, hasCategoryHeader, isKeyboardHighlighted = false, analyticsMetadataTransformer = (metadata) => metadata, variant = 'normal', linkStyle, renderItem, parentProps, filteringText, filteringEnabled, menuId, filteringDescriptionId, }) => {
     const isLink = isLinkItem(item);
     const isCheckbox = isCheckboxItem(item);
     const onClick = (event) => {
@@ -51,18 +54,25 @@ const ItemElement = ({ position = '1', index, item, disabled, onItemActivate, hi
                     href: item.href || '',
                 },
             })) },
-        React.createElement(MenuItem, { index: index, item: item, disabled: disabled, highlighted: highlighted, linkStyle: linkStyle, renderItem: renderItem, parentProps: parentProps })));
+        React.createElement(MenuItem, { index: index, item: item, disabled: disabled, highlighted: highlighted, linkStyle: linkStyle, renderItem: renderItem, parentProps: parentProps, filteringText: filteringText, filteringEnabled: filteringEnabled, menuId: menuId, filteringDescriptionId: filteringDescriptionId })));
 };
-function MenuItem({ index, item, disabled, highlighted, linkStyle, renderItem, parentProps }) {
+function MenuItem({ index, item, disabled, highlighted, linkStyle, renderItem, parentProps, filteringText, filteringEnabled, menuId, filteringDescriptionId, }) {
     var _a;
     const menuItemRef = useRef(null);
     const isCheckbox = isCheckboxItem(item);
     const isCurrentBreadcrumb = !isCheckbox && item.isCurrentBreadcrumb;
     useEffect(() => {
         if (highlighted && menuItemRef.current) {
-            menuItemRef.current.focus();
+            if (filteringEnabled) {
+                // In filtering mode focus stays on the filter input, so we scroll the
+                // highlighted item into view manually instead of relying on focus().
+                scrollElementIntoView(menuItemRef.current);
+            }
+            else {
+                menuItemRef.current.focus();
+            }
         }
-    }, [highlighted]);
+    }, [highlighted, filteringEnabled]);
     let itemProps;
     if (isCheckbox) {
         itemProps = {
@@ -75,6 +85,7 @@ function MenuItem({ index, item, disabled, highlighted, linkStyle, renderItem, p
                 checked: item.checked,
                 parent: parentProps !== null && parentProps !== void 0 ? parentProps : null,
             },
+            filterText: filteringText,
         };
     }
     else {
@@ -87,32 +98,38 @@ function MenuItem({ index, item, disabled, highlighted, linkStyle, renderItem, p
                 highlighted: highlighted,
                 parent: parentProps !== null && parentProps !== void 0 ? parentProps : null,
             },
+            filterText: filteringText,
         };
     }
     const renderResult = (_a = renderItem === null || renderItem === void 0 ? void 0 : renderItem(itemProps)) !== null && _a !== void 0 ? _a : null;
     const isDisabledWithReason = disabled && item.disabledReason;
     const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);
+    const itemDomId = menuId && item.id ? `${menuId}-${item.id}` : undefined;
+    const ariaDescribedby = joinStrings(isDisabledWithReason ? targetProps['aria-describedby'] : undefined, filteringDescriptionId);
     const menuItemProps = {
+        id: itemDomId,
         'aria-label': item.ariaLabel,
+        'aria-describedby': ariaDescribedby,
         className: clsx(styles['menu-item'], !!renderResult && styles['no-content-styling'], analyticsLabels['menu-item'], linkStyle && styles['link-style'], linkStyle && highlighted && styles['link-style-highlighted'], isCurrentBreadcrumb && styles['current-breadcrumb']),
         'aria-current': isCurrentBreadcrumb,
         lang: item.lang,
         ref: menuItemRef,
-        // We are using the roving tabindex technique to manage the focus state of the dropdown.
-        // The current element will always have tabindex=0 which means that it can be tabbed to,
-        // while all other items have tabindex=-1 so we can focus them when necessary.
-        tabIndex: highlighted ? 0 : -1,
+        // When filtering is enabled, we use aria-activedescendant on the filter input and provide
+        // the `id` of the item to select it. When filtering is disabled, we are using the roving
+        // tabindex technique to manage the focus state of the dropdown. The current element will
+        // have tabindex=0 which means that it can be tabbed to, while all other items have
+        // tabindex=-1 so we can focus them when necessary.
+        tabIndex: filteringEnabled ? -1 : highlighted ? 0 : -1,
         ...(isCheckbox ? getMenuItemCheckboxProps({ disabled, checked: item.checked }) : getMenuItemProps({ disabled })),
-        ...(isDisabledWithReason ? targetProps : {}),
     };
-    const menuItem = isLinkItem(item) ? (React.createElement("a", { ...menuItemProps, href: !disabled ? item.href : undefined, download: !disabled && item.download ? item.download : undefined, target: getItemTarget(item), rel: item.external ? 'noopener noreferrer' : undefined }, renderResult ? renderResult : React.createElement(MenuItemContent, { item: item, disabled: disabled, highlighted: highlighted }))) : (React.createElement("span", { ...menuItemProps }, renderResult ? renderResult : React.createElement(MenuItemContent, { item: item, disabled: disabled, highlighted: highlighted })));
+    const menuItem = isLinkItem(item) ? (React.createElement("a", { ...menuItemProps, href: !disabled ? item.href : undefined, download: !disabled && item.download ? item.download : undefined, target: getItemTarget(item), rel: item.external ? 'noopener noreferrer' : undefined }, renderResult ? (renderResult) : (React.createElement(MenuItemContent, { item: item, disabled: disabled, highlighted: highlighted, filteringText: filteringText })))) : (React.createElement("span", { ...menuItemProps }, renderResult ? (renderResult) : (React.createElement(MenuItemContent, { item: item, disabled: disabled, highlighted: highlighted, filteringText: filteringText }))));
     const { position } = useDropdownContext();
     const tooltipPosition = position === 'bottom-left' || position === 'top-left' ? 'left' : 'right';
-    return isDisabledWithReason ? (React.createElement(Tooltip, { content: item.disabledReason, position: tooltipPosition, className: styles['item-tooltip-wrapper'] },
+    return isDisabledWithReason ? (React.createElement(Tooltip, { content: item.disabledReason, position: tooltipPosition, className: styles['item-tooltip-wrapper'], controlledOpen: filteringEnabled ? highlighted : undefined },
         menuItem,
         descriptionEl)) : (menuItem);
 }
-const MenuItemContent = ({ item, disabled, highlighted, }) => {
+const MenuItemContent = ({ item, disabled, highlighted, filteringText, }) => {
     const hasIcon = !!(item.iconName || item.iconUrl || item.iconSvg);
     const hasExternal = isLinkItem(item) && item.external;
     const isCheckbox = isCheckboxItem(item);
@@ -122,10 +139,12 @@ const MenuItemContent = ({ item, disabled, highlighted, }) => {
         React.createElement("div", { className: styles['content-wrapper'] },
             React.createElement("div", { className: styles['main-row'] },
                 React.createElement("div", null,
-                    React.createElement("span", null, item.text),
+                    React.createElement(HighlightMatch, { str: item.text, highlightText: filteringText }),
                     hasExternal && React.createElement(ExternalIcon, { disabled: disabled, ariaLabel: item.externalIconAriaLabel })),
-                item.labelTag && (React.createElement("div", { className: clsx(styles['label-tag'], disabled && styles.disabled) }, item.labelTag))),
-            item.secondaryText && (React.createElement("div", { className: clsx(styles['secondary-text'], highlighted && styles.highlighted, disabled && styles.disabled) }, item.secondaryText)))));
+                item.labelTag && (React.createElement("div", { className: clsx(styles['label-tag'], disabled && styles.disabled) },
+                    React.createElement(HighlightMatch, { str: item.labelTag, highlightText: filteringText })))),
+            item.secondaryText && (React.createElement("div", { className: clsx(styles['secondary-text'], highlighted && styles.highlighted, disabled && styles.disabled) },
+                React.createElement(HighlightMatch, { str: item.secondaryText, highlightText: filteringText }))))));
 };
 const MenuItemIcon = (props) => (React.createElement("span", { className: styles.icon },
     React.createElement(InternalIcon, { ...props })));

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 { useDropdownContext } from '../../dropdown/context';\nimport InternalIcon, { InternalIconProps } from '../../icon/internal';\nimport useHiddenDescription from '../../internal/hooks/use-hidden-description';\nimport { useVisualRefresh } from '../../internal/hooks/use-visual-mode';\nimport { getDataAttributes } from '../../internal/utils/data-attributes';\nimport { GeneratedAnalyticsMetadataButtonDropdownClick } from '../analytics-metadata/interfaces';\nimport { ButtonDropdownProps, LinkItem } from '../interfaces';\nimport { InternalCheckboxItem, InternalItem, ItemProps } from '../internal-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 index,\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 renderItem,\n parentProps,\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 const isVisualRefresh = useVisualRefresh();\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 [styles['visual-refresh']]: isVisualRefresh,\n })}\n role=\"presentation\"\n data-testid={item.id}\n data-description={item.description}\n {...getDataAttributes(item.dataAttributes, ['testid'])}\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\n index={index}\n item={item}\n disabled={disabled}\n highlighted={highlighted}\n linkStyle={linkStyle}\n renderItem={renderItem}\n parentProps={parentProps}\n />\n </li>\n );\n};\n\ninterface MenuItemProps {\n index?: number;\n item: InternalItem \| InternalCheckboxItem;\n disabled: boolean;\n highlighted: boolean;\n linkStyle?: boolean;\n renderItem?: ButtonDropdownProps.ItemRenderer;\n parentProps?: ButtonDropdownProps.GroupRenderItem;\n}\n\nfunction MenuItem({ index, item, disabled, highlighted, linkStyle, renderItem, parentProps }: MenuItemProps) {\n const menuItemRef = useRef<(HTMLSpanElement & HTMLAnchorElement) \| null>(null);\n const isCheckbox = isCheckboxItem(item);\n const isCurrentBreadcrumb = !isCheckbox && item.isCurrentBreadcrumb;\n\n useEffect(() => {\n if (highlighted && menuItemRef.current) {\n menuItemRef.current.focus();\n }\n }, [highlighted]);\n\n let itemProps: { item: ButtonDropdownProps.RenderItem };\n\n if (isCheckbox) {\n itemProps = {\n item: {\n index: index ?? 0,\n type: 'checkbox',\n option: item as ButtonDropdownProps.CheckboxItem,\n disabled: disabled,\n highlighted: highlighted,\n checked: item.checked,\n parent: parentProps ?? null,\n },\n };\n } else {\n itemProps = {\n item: {\n index: index ?? 0,\n type: 'action',\n option: item as ButtonDropdownProps.Item,\n disabled: disabled,\n highlighted: highlighted,\n parent: parentProps ?? null,\n },\n };\n }\n\n const renderResult = renderItem?.(itemProps) ?? null;\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(\n styles['menu-item'],\n !!renderResult && styles['no-content-styling'],\n analyticsLabels['menu-item'],\n linkStyle && styles['link-style'],\n linkStyle && highlighted && styles['link-style-highlighted'],\n isCurrentBreadcrumb && styles['current-breadcrumb']\n ),\n 'aria-current': isCurrentBreadcrumb,\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 download={!disabled && item.download ? item.download : undefined}\n target={getItemTarget(item)}\n rel={item.external ? 'noopener noreferrer' : undefined}\n >\n {renderResult ? renderResult : <MenuItemContent item={item} disabled={disabled} highlighted={highlighted} />}\n </a>\n ) : (\n <span {...menuItemProps}>\n {renderResult ? renderResult : <MenuItemContent item={item} disabled={disabled} highlighted={highlighted} />}\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 highlighted,\n}: {\n item: InternalItem \| InternalCheckboxItem;\n disabled: boolean;\n highlighted: 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 <div className={styles['content-wrapper']}>\n <div className={styles['main-row']}>\n <div>\n <span>{item.text}</span>\n {hasExternal && <ExternalIcon disabled={disabled} ariaLabel={item.externalIconAriaLabel} />}\n </div>\n {item.labelTag && (\n <div className={clsx(styles['label-tag'], disabled && styles.disabled)}>{item.labelTag}</div>\n )}\n </div>\n {item.secondaryText && (\n <div\n className={clsx(styles['secondary-text'], highlighted && styles.highlighted, disabled && styles.disabled)}\n >\n {item.secondaryText}\n </div>\n )}\n </div>\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 { useDropdownContext } from '../../dropdown/context';\nimport InternalIcon, { InternalIconProps } from '../../icon/internal';\nimport HighlightMatch from '../../internal/components/option/highlight-match';\nimport useHiddenDescription from '../../internal/hooks/use-hidden-description';\nimport { useVisualRefresh } from '../../internal/hooks/use-visual-mode';\nimport { getDataAttributes } from '../../internal/utils/data-attributes';\nimport { scrollElementIntoView } from '../../internal/utils/scrollable-containers';\nimport { joinStrings } from '../../internal/utils/strings';\nimport { GeneratedAnalyticsMetadataButtonDropdownClick } from '../analytics-metadata/interfaces';\nimport { ButtonDropdownProps, LinkItem } from '../interfaces';\nimport { InternalCheckboxItem, InternalItem, ItemProps } from '../internal-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 index,\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 renderItem,\n parentProps,\n filteringText,\n filteringEnabled,\n menuId,\n filteringDescriptionId,\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 const isVisualRefresh = useVisualRefresh();\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 [styles['visual-refresh']]: isVisualRefresh,\n })}\n role=\"presentation\"\n data-testid={item.id}\n data-description={item.description}\n {...getDataAttributes(item.dataAttributes, ['testid'])}\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\n index={index}\n item={item}\n disabled={disabled}\n highlighted={highlighted}\n linkStyle={linkStyle}\n renderItem={renderItem}\n parentProps={parentProps}\n filteringText={filteringText}\n filteringEnabled={filteringEnabled}\n menuId={menuId}\n filteringDescriptionId={filteringDescriptionId}\n />\n </li>\n );\n};\n\ninterface MenuItemProps {\n index?: number;\n item: InternalItem \| InternalCheckboxItem;\n disabled: boolean;\n highlighted: boolean;\n linkStyle?: boolean;\n renderItem?: ButtonDropdownProps.ItemRenderer;\n parentProps?: ButtonDropdownProps.GroupRenderItem;\n filteringText?: string;\n filteringEnabled?: boolean;\n menuId?: string;\n filteringDescriptionId?: string;\n}\n\nfunction MenuItem({\n index,\n item,\n disabled,\n highlighted,\n linkStyle,\n renderItem,\n parentProps,\n filteringText,\n filteringEnabled,\n menuId,\n filteringDescriptionId,\n}: MenuItemProps) {\n const menuItemRef = useRef<(HTMLSpanElement & HTMLAnchorElement) \| null>(null);\n const isCheckbox = isCheckboxItem(item);\n const isCurrentBreadcrumb = !isCheckbox && item.isCurrentBreadcrumb;\n\n useEffect(() => {\n if (highlighted && menuItemRef.current) {\n if (filteringEnabled) {\n // In filtering mode focus stays on the filter input, so we scroll the\n // highlighted item into view manually instead of relying on focus().\n scrollElementIntoView(menuItemRef.current);\n } else {\n menuItemRef.current.focus();\n }\n }\n }, [highlighted, filteringEnabled]);\n\n let itemProps: { item: ButtonDropdownProps.RenderItem; filterText?: string };\n\n if (isCheckbox) {\n itemProps = {\n item: {\n index: index ?? 0,\n type: 'checkbox',\n option: item as ButtonDropdownProps.CheckboxItem,\n disabled: disabled,\n highlighted: highlighted,\n checked: item.checked,\n parent: parentProps ?? null,\n },\n filterText: filteringText,\n };\n } else {\n itemProps = {\n item: {\n index: index ?? 0,\n type: 'action',\n option: item as ButtonDropdownProps.Item,\n disabled: disabled,\n highlighted: highlighted,\n parent: parentProps ?? null,\n },\n filterText: filteringText,\n };\n }\n\n const renderResult = renderItem?.(itemProps) ?? null;\n\n const isDisabledWithReason = disabled && item.disabledReason;\n const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n const itemDomId = menuId && item.id ? `${menuId}-${item.id}` : undefined;\n const ariaDescribedby = joinStrings(\n isDisabledWithReason ? targetProps['aria-describedby'] : undefined,\n filteringDescriptionId\n );\n const menuItemProps: React.HTMLAttributes<HTMLSpanElement & HTMLAnchorElement> = {\n id: itemDomId,\n 'aria-label': item.ariaLabel,\n 'aria-describedby': ariaDescribedby,\n className: clsx(\n styles['menu-item'],\n !!renderResult && styles['no-content-styling'],\n analyticsLabels['menu-item'],\n linkStyle && styles['link-style'],\n linkStyle && highlighted && styles['link-style-highlighted'],\n isCurrentBreadcrumb && styles['current-breadcrumb']\n ),\n 'aria-current': isCurrentBreadcrumb,\n lang: item.lang,\n ref: menuItemRef,\n // When filtering is enabled, we use aria-activedescendant on the filter input and provide\n // the `id` of the item to select it. When filtering is disabled, we are using the roving\n // tabindex technique to manage the focus state of the dropdown. The current element will\n // have tabindex=0 which means that it can be tabbed to, while all other items have\n // tabindex=-1 so we can focus them when necessary.\n tabIndex: filteringEnabled ? -1 : highlighted ? 0 : -1,\n ...(isCheckbox ? getMenuItemCheckboxProps({ disabled, checked: item.checked }) : getMenuItemProps({ disabled })),\n };\n\n const menuItem = isLinkItem(item) ? (\n <a\n {...menuItemProps}\n href={!disabled ? item.href : undefined}\n download={!disabled && item.download ? item.download : undefined}\n target={getItemTarget(item)}\n rel={item.external ? 'noopener noreferrer' : undefined}\n >\n {renderResult ? (\n renderResult\n ) : (\n <MenuItemContent item={item} disabled={disabled} highlighted={highlighted} filteringText={filteringText} />\n )}\n </a>\n ) : (\n <span {...menuItemProps}>\n {renderResult ? (\n renderResult\n ) : (\n <MenuItemContent item={item} disabled={disabled} highlighted={highlighted} filteringText={filteringText} />\n )}\n </span>\n );\n\n const { position } = useDropdownContext();\n const tooltipPosition = position === 'bottom-left' \|\| position === 'top-left' ? 'left' : 'right';\n return isDisabledWithReason ? (\n <Tooltip\n content={item.disabledReason}\n position={tooltipPosition}\n className={styles['item-tooltip-wrapper']}\n controlledOpen={filteringEnabled ? highlighted : undefined}\n >\n {menuItem}\n {descriptionEl}\n </Tooltip>\n ) : (\n menuItem\n );\n}\n\nconst MenuItemContent = ({\n item,\n disabled,\n highlighted,\n filteringText,\n}: {\n item: InternalItem \| InternalCheckboxItem;\n disabled: boolean;\n highlighted: boolean;\n filteringText?: string;\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 <div className={styles['content-wrapper']}>\n <div className={styles['main-row']}>\n <div>\n <HighlightMatch str={item.text} highlightText={filteringText} />\n {hasExternal && <ExternalIcon disabled={disabled} ariaLabel={item.externalIconAriaLabel} />}\n </div>\n {item.labelTag && (\n <div className={clsx(styles['label-tag'], disabled && styles.disabled)}>\n <HighlightMatch str={item.labelTag} highlightText={filteringText} />\n </div>\n )}\n </div>\n {item.secondaryText && (\n <div\n className={clsx(styles['secondary-text'], highlighted && styles.highlighted, disabled && styles.disabled)}\n >\n <HighlightMatch str={item.secondaryText} highlightText={filteringText} />\n </div>\n )}\n </div>\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/items-list.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 import { ItemListProps } from './internal-interfaces';
-export default function ItemsList({ items, onItemActivate, onGroupToggle, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, lastInDropdown, highlightItem, categoryDisabled, hasExpandableGroups, hasCategoryHeader, expandToViewport, variant, analyticsMetadataTransformer, position, linkStyle, renderItem, parentProps, }: ItemListProps): JSX.Element;
+export default function ItemsList({ items, onItemActivate, onGroupToggle, targetItem, isHighlighted, isKeyboardHighlight, isExpanded, lastInDropdown, highlightItem, categoryDisabled, hasExpandableGroups, hasCategoryHeader, expandToViewport, variant, analyticsMetadataTransformer, position, linkStyle, renderItem, parentProps, filteringText, filteringEnabled, menuId, filteringDescriptionId, }: 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,uBAAuB,CAAC;AAItD,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,EACT,UAAU,EACV,WAAW,~~GACZ~~,EAAE,aAAa,~~eA4Ff~~"}
1	+ {"version":3,"file":"items-list.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAItD,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,EACT,UAAU,EACV,WAAW,EACX,aAAa,EACb,gBAAgB,EAChB,MAAM,EACN,sBAAsB,GACvB,EAAE,aAAa,eA4Gf"}

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

@@ -7,18 +7,18 @@ 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, linkStyle, renderItem, parentProps, }) {
+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, renderItem, parentProps, filteringText, filteringEnabled, menuId, filteringDescriptionId, }) {
     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, index: 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, renderItem: renderItem, parentProps: parentProps }));
+            return (React.createElement(ItemElement, { key: index, index: 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, renderItem: renderItem, parentProps: parentProps, filteringText: filteringText, filteringEnabled: filteringEnabled, menuId: menuId, filteringDescriptionId: filteringDescriptionId }));
         }
         if (hasExpandableGroups) {
-            return item.text ? (isMobile ? (React.createElement(MobileExpandableCategoryElement, { key: index, index: 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}`, renderItem: renderItem })) : (React.createElement(ExpandableCategoryElement, { key: index, index: 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}`, renderItem: renderItem }))) : null;
+            return item.text ? (isMobile ? (React.createElement(MobileExpandableCategoryElement, { key: index, index: 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}`, renderItem: renderItem, filteringText: filteringText, filteringEnabled: filteringEnabled, menuId: menuId, filteringDescriptionId: filteringDescriptionId })) : (React.createElement(ExpandableCategoryElement, { key: index, index: 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}`, renderItem: renderItem, filteringText: filteringText, filteringEnabled: filteringEnabled, menuId: menuId, filteringDescriptionId: filteringDescriptionId }))) : null;
         }
-        return (React.createElement(CategoryElement, { key: index, index: index, item: item, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, lastInDropdown: lastInDropdown && index === items.length - 1, highlightItem: highlightItem, disabled: (_d = item.disabled) !== null && _d !== void 0 ? _d : false, variant: variant, position: `${position ? `${position},` : ''}${index + 1}`, renderItem: renderItem }));
+        return (React.createElement(CategoryElement, { key: index, index: index, item: item, onItemActivate: onItemActivate, onGroupToggle: onGroupToggle, targetItem: targetItem, isHighlighted: isHighlighted, isKeyboardHighlight: isKeyboardHighlight, isExpanded: isExpanded, lastInDropdown: lastInDropdown && index === items.length - 1, highlightItem: highlightItem, disabled: (_d = item.disabled) !== null && _d !== void 0 ? _d : false, variant: variant, position: `${position ? `${position},` : ''}${index + 1}`, renderItem: renderItem, filteringText: filteringText, filteringEnabled: filteringEnabled, menuId: menuId, filteringDescriptionId: filteringDescriptionId }));
     });
     return React.createElement(React.Fragment, null, elements);
 }