@economic/taco 1.15.1 → 1.16.1

package/dist/esm/packages/taco/src/components/Listbox/ScrollableList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollableList.js","sources":["../../../../../../../src/components/Listbox/ScrollableList.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { useMergedRef } from '../../hooks/useMergedRef';\r\nimport { getNextIndexFromKey } from '../../utils/hooks/useListKeyboardNavigation';\r\nimport { useListScrollTo } from '../../utils/hooks/useListScrollTo';\r\nimport './ScrollableList.css';\r\nimport { Spinner } from '../Spinner/Spinner';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { Checkbox } from '../Checkbox/Checkbox';\r\nimport { getInputClasses } from '../Input/util';\r\n\r\nexport type ScrollableListItemValue = string | number | boolean | null;\r\n\r\nexport type ScrollableListItem = {\r\n    /**\r\n     * Set whether the item is disabled.\r\n     * This will both change the style and make the item unselectable\r\n     */\r\n    disabled?: boolean;\r\n    /* Specifies whether the item has child items -- intended for internal use only */\r\n    hasChildren?: boolean;\r\n    /** Place an icon before the item's text */\r\n    icon?: React.ReactElement;\r\n    /* The index path to the item -- intended for internal use only */\r\n    path?: string;\r\n    /** Text describing the item */\r\n    text: string | JSX.Element;\r\n    /** Value of the item */\r\n    value: ScrollableListItemValue;\r\n    /** Child items to show hierarchical data */\r\n    children?: ScrollableListItem[];\r\n};\r\n\r\n/** @internal */\r\nexport type ScrollableListProps = Omit<\r\n    React.HTMLAttributes<HTMLUListElement>,\r\n    'defaultValue' | 'id' | 'onChange' | 'onClick' | 'onKeyDown'\r\n> & {\r\n    /** Data indicating the options in scrollable list */\r\n    data: ScrollableListItem[];\r\n    /** Sets the list to be disabled */\r\n    disabled?: boolean;\r\n    /** Draws attention to the scrollable list by changing its style and making it visually prominent */\r\n    highlighted?: boolean;\r\n    /** Set an id for the scrollable list */\r\n    id: string;\r\n    /* Whether the input is in an invalid state */\r\n    invalid?: boolean;\r\n    /**\r\n     * Shows a loading indicator with a text next to it.\r\n     * Read more about how to provide the text in `Provider` component.\r\n     */\r\n    loading?: boolean;\r\n    /**\r\n     * Handler called when current active/selected option changes in a scrollable list.\r\n     * @param index indicates the index of the current active option\r\n     */\r\n    onChange: (index: number) => void;\r\n    /** Handler called when option is clicked */\r\n    onClick?: (event: React.MouseEvent<HTMLLIElement>, index: number) => void;\r\n    /**\r\n     * Set whether the selected item should be scrolled into view when listbox is focused.\r\n     * Default value is `false`\r\n     */\r\n    scrollOnFocus?: boolean;\r\n    /** Handler called when a key is pressed */\r\n    onKeyDown?: (event: React.KeyboardEvent<HTMLUListElement>, index: number | undefined) => void;\r\n    /* Sets the list to read only mode */\r\n    readOnly?: boolean;\r\n    /**\r\n     * Value of the scrollable list representing the selected item.\r\n     * It needs to be an existing value from the provided data.\r\n     */\r\n    value: number | undefined;\r\n    /**\r\n     * Allows to select multiple items from the list\r\n     */\r\n    multiselect?: boolean;\r\n    /**\r\n     * Contains the currently selected values when multiselect mode is ON.\r\n     */\r\n    selectedIndexes?: number[];\r\n    /**\r\n     * True when all available (not disabled) options are selected\r\n     */\r\n    allOptionsSelected?: boolean;\r\n};\r\n\r\n/** @internal */\r\nexport type ScrollableListPropsWithRef = ScrollableListProps & React.RefAttributes<HTMLUListElement>;\r\n\r\nexport const getId = (id: string, value: ScrollableListItemValue): string => `${id}_${value}`;\r\n\r\nconst getNextEnabledItem = (\r\n    event: React.KeyboardEvent<HTMLElement>,\r\n    data: ScrollableListItem[],\r\n    index: number | undefined\r\n): number | undefined => {\r\n    const nextIndex = getNextIndexFromKey(event.key, data.length, index);\r\n\r\n    if (nextIndex) {\r\n        if (nextIndex === index) {\r\n            return index;\r\n        } else if (data[nextIndex] && data[nextIndex].disabled) {\r\n            return getNextEnabledItem(event, data, nextIndex);\r\n        }\r\n    }\r\n\r\n    return nextIndex;\r\n};\r\n\r\nexport const ScrollableList = React.forwardRef(function ScrollableList(\r\n    props: ScrollableListProps,\r\n    ref: React.Ref<HTMLUListElement>\r\n) {\r\n    const {\r\n        data,\r\n        disabled,\r\n        highlighted,\r\n        id,\r\n        invalid: _,\r\n        loading,\r\n        onChange: setCurrentIndex,\r\n        onClick,\r\n        onFocus,\r\n        onKeyDown,\r\n        readOnly,\r\n        scrollOnFocus = false,\r\n        value: currentIndex,\r\n        multiselect,\r\n        selectedIndexes = [],\r\n        allOptionsSelected = false,\r\n        ...otherProps\r\n    } = props;\r\n    const listRef = useMergedRef<HTMLUListElement>(ref);\r\n    const itemRefs = React.useMemo(() => data.map(() => React.createRef<HTMLLIElement>()), [data]);\r\n    const { texts } = useLocalization();\r\n    const { scrollTo } = useListScrollTo(listRef, itemRefs);\r\n\r\n    React.useEffect(() => {\r\n        if (currentIndex && itemRefs[currentIndex]?.current) {\r\n            itemRefs[currentIndex].current?.scrollIntoView({\r\n                block: 'center',\r\n            });\r\n        }\r\n    }, []);\r\n\r\n    React.useEffect(() => {\r\n        scrollTo(currentIndex);\r\n    }, [currentIndex]);\r\n\r\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLUListElement>): void => {\r\n        const nextIndex = getNextEnabledItem(event, data, currentIndex);\r\n\r\n        if (nextIndex !== undefined && nextIndex !== currentIndex) {\r\n            event.preventDefault();\r\n            scrollTo(nextIndex);\r\n            setCurrentIndex(nextIndex);\r\n        }\r\n\r\n        if (onKeyDown) {\r\n            event.persist();\r\n            const index = nextIndex !== undefined ? nextIndex : currentIndex;\r\n            onKeyDown(event, index);\r\n        }\r\n    };\r\n\r\n    const handleClick = (index: number) => (event: React.MouseEvent<HTMLLIElement>) => {\r\n        setCurrentIndex(index);\r\n\r\n        if (onClick) {\r\n            event.persist();\r\n            onClick(event, index);\r\n        }\r\n    };\r\n\r\n    const handleFocus = (event: React.FocusEvent<HTMLUListElement>): void => {\r\n        if (scrollOnFocus) {\r\n            scrollTo(currentIndex);\r\n        }\r\n\r\n        if (onFocus) {\r\n            event.persist();\r\n            onFocus(event);\r\n        }\r\n    };\r\n\r\n    const getOptionCheckedState = (optionValue: string, index: number): boolean => {\r\n        if (optionValue === '#ALL-OPTIONS#') {\r\n            return allOptionsSelected;\r\n        } else if (!optionValue || !selectedIndexes) {\r\n            return false;\r\n        } else {\r\n            return selectedIndexes.findIndex(i => i === index) !== -1;\r\n        }\r\n    };\r\n\r\n    const list: React.HTMLAttributes<HTMLUListElement> &\r\n        React.RefAttributes<HTMLUListElement> & { disabled?: boolean; readOnly?: boolean } = {\r\n        ...otherProps,\r\n        className: cn(\r\n            'inline-flex flex-col list-none !p-0 m-0 overflow-y-auto h-auto',\r\n            getInputClasses(props),\r\n            {\r\n                'yt-list--multiselect': multiselect,\r\n                'pointer-events-none': disabled,\r\n                'cursor-not-allowed': disabled || readOnly,\r\n            },\r\n            otherProps.className\r\n        ),\r\n        disabled,\r\n        id,\r\n        onFocus: !disabled && !readOnly ? handleFocus : undefined,\r\n        onKeyDown: !disabled && !readOnly ? handleKeyDown : undefined,\r\n        readOnly,\r\n        ref: listRef,\r\n        role: 'listbox',\r\n        tabIndex: otherProps.tabIndex || 0,\r\n    };\r\n\r\n    const options = data.map((option, index) => {\r\n        const depth = option.path ? option.path.split('.').length - 1 : 0;\r\n\r\n        return {\r\n            'aria-selected': multiselect ? getOptionCheckedState(String(option.value), index) : currentIndex === index,\r\n            'data-focused': currentIndex === index,\r\n            children: option.text,\r\n            className: cn(\r\n                'flex items-center px-3 w-full cursor-pointer bg-white flex-[0_0_2rem] focus:wcag-blue focus:border-blue',\r\n                {\r\n                    'sticky top-0 font-bold': depth === 0 && !!option.hasChildren,\r\n                }\r\n            ),\r\n            disabled: option.disabled,\r\n            icon: option.icon,\r\n            id: getId(id, option.value),\r\n            key: getId(id, option.value),\r\n            onClick: !disabled && !readOnly ? handleClick(index) : undefined,\r\n            ref: itemRefs[index],\r\n            role: 'option',\r\n            style:\r\n                depth > 0\r\n                    ? {\r\n                          paddingLeft: `${depth + 1}rem`,\r\n                      }\r\n                    : undefined,\r\n        };\r\n    });\r\n\r\n    return (\r\n        <ul {...list} data-taco=\"scrollable-list\">\r\n            {loading ? (\r\n                <li className=\"yt-list__empty\">\r\n                    <span>\r\n                        <Spinner delay={0} />\r\n                    </span>\r\n                    <span>{texts.listbox.loading}</span>\r\n                </li>\r\n            ) : options.length ? (\r\n                options.map(({ children, icon, ...optionProps }) => (\r\n                    <li {...optionProps}>\r\n                        {icon}\r\n                        <span className=\"flex-grow truncate text-left\">{children}</span>\r\n                        {multiselect && (\r\n                            <Checkbox\r\n                                checked={optionProps['aria-selected']}\r\n                                onChange={() => null}\r\n                                className=\"pointer-events-none ml-2 self-center p-px\"\r\n                            />\r\n                        )}\r\n                    </li>\r\n                ))\r\n            ) : (\r\n                <li className=\"yt-list__empty\">\r\n                    <span>{texts.listbox.empty}</span>\r\n                </li>\r\n            )}\r\n        </ul>\r\n    );\r\n});\r\n"],"names":["getId","id","value","getNextEnabledItem","event","data","index","nextIndex","getNextIndexFromKey","key","length","disabled","ScrollableList","React","props","ref","highlighted","invalid","_","loading","onChange","setCurrentIndex","onClick","onFocus","onKeyDown","readOnly","scrollOnFocus","currentIndex","multiselect","selectedIndexes","allOptionsSelected","otherProps","listRef","useMergedRef","itemRefs","map","texts","useLocalization","scrollTo","useListScrollTo","current","scrollIntoView","block","handleKeyDown","undefined","preventDefault","persist","handleClick","handleFocus","getOptionCheckedState","optionValue","findIndex","i","list","className","cn","getInputClasses","role","tabIndex","options","option","depth","path","split","String","children","text","hasChildren","icon","style","paddingLeft","Spinner","delay","listbox","optionProps","Checkbox","checked","empty"],"mappings":"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"}
+{"version":3,"file":"ScrollableList.js","sources":["../../../../../../../src/components/Listbox/ScrollableList.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { getNextIndexFromKey } from '../../utils/hooks/useListKeyboardNavigation';\nimport { useListScrollTo } from '../../utils/hooks/useListScrollTo';\nimport './ScrollableList.css';\nimport { Spinner } from '../Spinner/Spinner';\nimport { useLocalization } from '../Provider/Localization';\nimport { Checkbox } from '../Checkbox/Checkbox';\nimport { getInputClasses } from '../Input/util';\n\nexport type ScrollableListItemValue = string | number | boolean | null;\n\nexport type ScrollableListItem = {\n    /**\n     * Set whether the item is disabled.\n     * This will both change the style and make the item unselectable\n     */\n    disabled?: boolean;\n    /* Specifies whether the item has child items -- intended for internal use only */\n    hasChildren?: boolean;\n    /** Place an icon before the item's text */\n    icon?: React.ReactElement;\n    /* The index path to the item -- intended for internal use only */\n    path?: string;\n    /** Text describing the item */\n    text: string | JSX.Element;\n    /** Value of the item */\n    value: ScrollableListItemValue;\n    /** Child items to show hierarchical data */\n    children?: ScrollableListItem[];\n};\n\n/** @internal */\nexport type ScrollableListProps = Omit<\n    React.HTMLAttributes<HTMLUListElement>,\n    'defaultValue' | 'id' | 'onChange' | 'onClick' | 'onKeyDown'\n> & {\n    /** Data indicating the options in scrollable list */\n    data: ScrollableListItem[];\n    /** Sets the list to be disabled */\n    disabled?: boolean;\n    /** Draws attention to the scrollable list by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** Set an id for the scrollable list */\n    id: string;\n    /* Whether the input is in an invalid state */\n    invalid?: boolean;\n    /**\n     * Shows a loading indicator with a text next to it.\n     * Read more about how to provide the text in `Provider` component.\n     */\n    loading?: boolean;\n    /**\n     * Handler called when current active/selected option changes in a scrollable list.\n     * @param index indicates the index of the current active option\n     */\n    onChange: (index: number) => void;\n    /** Handler called when option is clicked */\n    onClick?: (event: React.MouseEvent<HTMLLIElement>, index: number) => void;\n    /**\n     * Set whether the selected item should be scrolled into view when listbox is focused.\n     * Default value is `false`\n     */\n    scrollOnFocus?: boolean;\n    /** Handler called when a key is pressed */\n    onKeyDown?: (event: React.KeyboardEvent<HTMLUListElement>, index: number | undefined) => void;\n    /* Sets the list to read only mode */\n    readOnly?: boolean;\n    /**\n     * Value of the scrollable list representing the selected item.\n     * It needs to be an existing value from the provided data.\n     */\n    value: number | undefined;\n    /**\n     * Allows to select multiple items from the list\n     */\n    multiselect?: boolean;\n    /**\n     * Contains the currently selected values when multiselect mode is ON.\n     */\n    selectedIndexes?: number[];\n    /**\n     * True when all available (not disabled) options are selected\n     */\n    allOptionsSelected?: boolean;\n};\n\n/** @internal */\nexport type ScrollableListPropsWithRef = ScrollableListProps & React.RefAttributes<HTMLUListElement>;\n\nexport const getId = (id: string, value: ScrollableListItemValue): string => `${id}_${value}`;\n\nconst getNextEnabledItem = (\n    event: React.KeyboardEvent<HTMLElement>,\n    data: ScrollableListItem[],\n    index: number | undefined\n): number | undefined => {\n    const nextIndex = getNextIndexFromKey(event.key, data.length, index);\n\n    if (nextIndex) {\n        if (nextIndex === index) {\n            return index;\n        } else if (data[nextIndex] && data[nextIndex].disabled) {\n            return getNextEnabledItem(event, data, nextIndex);\n        }\n    }\n\n    return nextIndex;\n};\n\nexport const ScrollableList = React.forwardRef(function ScrollableList(\n    props: ScrollableListProps,\n    ref: React.Ref<HTMLUListElement>\n) {\n    const {\n        data,\n        disabled,\n        highlighted,\n        id,\n        invalid: _,\n        loading,\n        onChange: setCurrentIndex,\n        onClick,\n        onFocus,\n        onKeyDown,\n        readOnly,\n        scrollOnFocus = false,\n        value: currentIndex,\n        multiselect,\n        selectedIndexes = [],\n        allOptionsSelected = false,\n        ...otherProps\n    } = props;\n    const listRef = useMergedRef<HTMLUListElement>(ref);\n    const itemRefs = React.useMemo(() => data.map(() => React.createRef<HTMLLIElement>()), [data]);\n    const { texts } = useLocalization();\n    const { scrollTo } = useListScrollTo(listRef, itemRefs);\n\n    React.useEffect(() => {\n        if (currentIndex && itemRefs[currentIndex]?.current) {\n            itemRefs[currentIndex].current?.scrollIntoView({\n                block: 'center',\n            });\n        }\n    }, []);\n\n    React.useEffect(() => {\n        scrollTo(currentIndex);\n    }, [currentIndex]);\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLUListElement>): void => {\n        const nextIndex = getNextEnabledItem(event, data, currentIndex);\n\n        if (nextIndex !== undefined && nextIndex !== currentIndex) {\n            event.preventDefault();\n            scrollTo(nextIndex);\n            setCurrentIndex(nextIndex);\n        }\n\n        if (onKeyDown) {\n            event.persist();\n            const index = nextIndex !== undefined ? nextIndex : currentIndex;\n            onKeyDown(event, index);\n        }\n    };\n\n    const handleClick = (index: number) => (event: React.MouseEvent<HTMLLIElement>) => {\n        setCurrentIndex(index);\n\n        if (onClick) {\n            event.persist();\n            onClick(event, index);\n        }\n    };\n\n    const handleFocus = (event: React.FocusEvent<HTMLUListElement>): void => {\n        if (scrollOnFocus) {\n            scrollTo(currentIndex);\n        }\n\n        if (onFocus) {\n            event.persist();\n            onFocus(event);\n        }\n    };\n\n    const getOptionCheckedState = (optionValue: string, index: number): boolean => {\n        if (optionValue === '#ALL-OPTIONS#') {\n            return allOptionsSelected;\n        } else if (!optionValue || !selectedIndexes) {\n            return false;\n        } else {\n            return selectedIndexes.findIndex(i => i === index) !== -1;\n        }\n    };\n\n    const options = data.map((option, index) => {\n        const depth = option.path ? option.path.split('.').length - 1 : 0;\n\n        return {\n            'aria-selected': multiselect ? getOptionCheckedState(String(option.value), index) : currentIndex === index,\n            'data-focused': currentIndex === index,\n            children: option.text,\n            className: cn(\n                'flex items-center px-3 w-full cursor-pointer bg-white flex-[0_0_2rem] focus:wcag-blue focus:border-blue',\n                {\n                    'sticky top-0 font-bold': depth === 0 && !!option.hasChildren,\n                }\n            ),\n            disabled: option.disabled,\n            icon: option.icon,\n            id: getId(id, option.value),\n            key: getId(id, option.value),\n            onClick: !disabled && !readOnly ? handleClick(index) : undefined,\n            ref: itemRefs[index],\n            role: 'option',\n            style:\n                depth > 0\n                    ? {\n                          paddingLeft: `${depth + 1}rem`,\n                      }\n                    : undefined,\n        };\n    });\n\n    const list: React.HTMLAttributes<HTMLUListElement> &\n        React.RefAttributes<HTMLUListElement> & { disabled?: boolean; readOnly?: boolean } = {\n        ...otherProps,\n        className: cn(\n            'inline-flex flex-col list-none !p-0 m-0 overflow-y-auto h-auto',\n            getInputClasses(props),\n            {\n                'yt-list--multiselect': multiselect,\n                'pointer-events-none': disabled,\n                'cursor-not-allowed': disabled || readOnly,\n            },\n            otherProps.className\n        ),\n        disabled,\n        id,\n        onFocus: !disabled && !readOnly ? handleFocus : undefined,\n        onKeyDown: !disabled && !readOnly ? handleKeyDown : undefined,\n        readOnly,\n        ref: listRef,\n        role: options.length <= 0 || loading ? 'presentation' : 'listbox',\n        tabIndex: otherProps.tabIndex || 0,\n    };\n\n    return (\n        <ul {...list} data-taco=\"scrollable-list\">\n            {loading ? (\n                <li className=\"yt-list__empty\">\n                    <span>\n                        <Spinner delay={0} />\n                    </span>\n                    <span>{texts.listbox.loading}</span>\n                </li>\n            ) : options.length ? (\n                options.map(({ children, icon, ...optionProps }) => (\n                    <li {...optionProps}>\n                        {icon}\n                        <span className=\"flex-grow truncate text-left\">{children}</span>\n                        {multiselect && (\n                            <Checkbox\n                                // In multiselect variant, this checkbox only acts as visual representation of item being selected,\n                                // so need to be taken out of screen reader scope.\n                                aria-hidden={true}\n                                tabIndex={-1}\n                                checked={optionProps['aria-selected']}\n                                onChange={() => null}\n                                className=\"pointer-events-none ml-2 self-center p-px\"\n                            />\n                        )}\n                    </li>\n                ))\n            ) : (\n                <li className=\"yt-list__empty\">\n                    <span>{texts.listbox.empty}</span>\n                </li>\n            )}\n        </ul>\n    );\n});\n"],"names":["getId","id","value","getNextEnabledItem","event","data","index","nextIndex","getNextIndexFromKey","key","length","disabled","ScrollableList","React","props","ref","highlighted","invalid","_","loading","onChange","setCurrentIndex","onClick","onFocus","onKeyDown","readOnly","scrollOnFocus","currentIndex","multiselect","selectedIndexes","allOptionsSelected","otherProps","listRef","useMergedRef","itemRefs","map","texts","useLocalization","scrollTo","useListScrollTo","current","scrollIntoView","block","handleKeyDown","undefined","preventDefault","persist","handleClick","handleFocus","getOptionCheckedState","optionValue","findIndex","i","options","option","depth","path","split","String","children","text","className","cn","hasChildren","icon","role","style","paddingLeft","list","getInputClasses","tabIndex","Spinner","delay","listbox","optionProps","Checkbox","checked","empty"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Listbox/useListbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useListbox.js","sources":["../../../../../../../src/components/Listbox/useListbox.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { v4 as uuid } from 'uuid';\r\nimport { ListboxProps } from './Listbox';\r\nimport { useMergedRef } from '../../hooks/useMergedRef';\r\nimport { setInputValueByRef, getIndexFromValue, findByValue, getActiveDescendant, useFlattenedData, sanitizeItem } from './util';\r\nimport { ScrollableListProps } from './ScrollableList';\r\nimport { useTypeahead } from './useTypeahead';\r\n\r\ntype useListbox = {\r\n    list: ScrollableListProps;\r\n    input: Omit<React.HTMLAttributes<HTMLInputElement>, 'defaultValue'>;\r\n};\r\n\r\nexport const useListbox = (\r\n    {\r\n        data: externalData = [],\r\n        defaultValue,\r\n        disabled,\r\n        emptyValue,\r\n        id: nativeId,\r\n        invalid,\r\n        name,\r\n        onChange,\r\n        onFocus,\r\n        onKeyDown,\r\n        value = emptyValue,\r\n        ...otherProps\r\n    }: ListboxProps,\r\n    ref: React.Ref<HTMLInputElement>\r\n): useListbox => {\r\n    const data = useFlattenedData(emptyValue !== undefined ? [{ text: '', value: emptyValue }, ...externalData] : externalData);\r\n    const id = React.useMemo(() => nativeId || uuid(), [nativeId]);\r\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\r\n    const currentIndex = value !== undefined ? getIndexFromValue(data, value) : undefined;\r\n    const { getNextIndex } = useTypeahead({ data, currentIndex });\r\n\r\n    const setInputValueByIndex = (index: number | undefined): void => {\r\n        if (index !== undefined) {\r\n            const option = data[index];\r\n\r\n            if (option && !option.disabled) {\r\n                setInputValueByRef(inputRef.current, option.value);\r\n            }\r\n        }\r\n    };\r\n\r\n    const handleListboxChange = (index: number): void => {\r\n        setInputValueByIndex(index);\r\n    };\r\n\r\n    React.useEffect(() => {\r\n        if (data.length && currentIndex === undefined) {\r\n            if (defaultValue !== undefined) {\r\n                const defaultValueIndex = getIndexFromValue(data, defaultValue);\r\n\r\n                if (defaultValueIndex !== undefined) {\r\n                    setInputValueByIndex(defaultValueIndex);\r\n                }\r\n            } else {\r\n                setInputValueByIndex(0);\r\n            }\r\n        }\r\n    }, [data]);\r\n\r\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\r\n        const charKey = event.key;\r\n\r\n        // event.key always returns the whole string (String.fromCharCode(event.keyCode) does not)\r\n        // We need to filter out only alphabetical or numeric letters, that's why that condition has been changed\r\n        if (charKey.length === 1 && /(\\w)/g.test(charKey)) {\r\n            const nextIndex = getNextIndex(charKey);\r\n\r\n            if (nextIndex > -1 && nextIndex !== currentIndex) {\r\n                setInputValueByIndex(nextIndex);\r\n            }\r\n            return;\r\n        }\r\n\r\n        if (onKeyDown) {\r\n            event.persist();\r\n            onKeyDown(event);\r\n        }\r\n    };\r\n\r\n    const handleListboxFocus = (event: React.FocusEvent<HTMLElement>): void => {\r\n        if (currentIndex === undefined && data.length) {\r\n            setInputValueByIndex(0);\r\n        }\r\n\r\n        if (onFocus) {\r\n            event.persist();\r\n            onFocus(event);\r\n        }\r\n    };\r\n\r\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\r\n        event.persist();\r\n\r\n        if (onChange) {\r\n            const item = findByValue(data, event.target.value);\r\n            (event as any).detail = sanitizeItem(item);\r\n\r\n            const indexes = item?.path?.split('.') ?? [];\r\n\r\n            if (indexes.length > 1) {\r\n                // we don't want to map the current item\r\n                indexes.pop();\r\n                // we need to rebuild the path as we map\r\n                let lastPath: string;\r\n\r\n                (event as any).detail.parents = indexes.map(i => {\r\n                    lastPath = lastPath ? [lastPath, i].join('.') : i;\r\n                    return sanitizeItem(data.find(i => i.path === lastPath));\r\n                });\r\n            }\r\n\r\n            onChange(event);\r\n        }\r\n    };\r\n\r\n    const list: ScrollableListProps = {\r\n        ...otherProps,\r\n        'aria-activedescendant': getActiveDescendant(data, currentIndex, id),\r\n        data,\r\n        disabled,\r\n        id,\r\n        invalid,\r\n        onChange: handleListboxChange,\r\n        onFocus: handleListboxFocus,\r\n        onKeyDown: handleListboxKeyDown,\r\n        scrollOnFocus: true,\r\n        tabIndex: disabled ? -1 : otherProps.tabIndex ? otherProps.tabIndex : 0,\r\n        value: currentIndex,\r\n    };\r\n\r\n    const input = {\r\n        name,\r\n        onChange: handleInputChange,\r\n        ref: inputRef,\r\n        tabIndex: -1,\r\n        value: value ?? '',\r\n    };\r\n\r\n    return { list, input };\r\n};\r\n"],"names":["useListbox","data","externalData","defaultValue","disabled","emptyValue","id","nativeId","invalid","name","onChange","onFocus","onKeyDown","value","otherProps","ref","useFlattenedData","undefined","text","React","uuid","inputRef","useMergedRef","currentIndex","getIndexFromValue","getNextIndex","useTypeahead","setInputValueByIndex","index","option","setInputValueByRef","current","handleListboxChange","length","defaultValueIndex","handleListboxKeyDown","event","charKey","key","test","nextIndex","persist","handleListboxFocus","handleInputChange","item","findByValue","target","detail","sanitizeItem","indexes","path","split","pop","lastPath","parents","map","i","join","find","list","getActiveDescendant","scrollOnFocus","tabIndex","input"],"mappings":"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"}
+{"version":3,"file":"useListbox.js","sources":["../../../../../../../src/components/Listbox/useListbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { v4 as uuid } from 'uuid';\nimport { ListboxProps } from './Listbox';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef, getIndexFromValue, findByValue, getActiveDescendant, useFlattenedData, sanitizeItem } from './util';\nimport { ScrollableListProps } from './ScrollableList';\nimport { useTypeahead } from './useTypeahead';\n\ntype useListbox = {\n    list: ScrollableListProps;\n    input: Omit<React.HTMLAttributes<HTMLInputElement>, 'defaultValue'>;\n};\n\nexport const useListbox = (\n    {\n        data: externalData = [],\n        defaultValue,\n        disabled,\n        emptyValue,\n        id: nativeId,\n        invalid,\n        name,\n        onChange,\n        onFocus,\n        onKeyDown,\n        value = emptyValue,\n        ...otherProps\n    }: ListboxProps,\n    ref: React.Ref<HTMLInputElement>\n): useListbox => {\n    const data = useFlattenedData(emptyValue !== undefined ? [{ text: '', value: emptyValue }, ...externalData] : externalData);\n    const id = React.useMemo(() => nativeId || uuid(), [nativeId]);\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const currentIndex = value !== undefined ? getIndexFromValue(data, value) : undefined;\n    const { getNextIndex } = useTypeahead({ data, currentIndex });\n\n    const setInputValueByIndex = (index: number | undefined): void => {\n        if (index !== undefined) {\n            const option = data[index];\n\n            if (option && !option.disabled) {\n                setInputValueByRef(inputRef.current, option.value);\n            }\n        }\n    };\n\n    const handleListboxChange = (index: number): void => {\n        setInputValueByIndex(index);\n    };\n\n    React.useEffect(() => {\n        if (data.length && currentIndex === undefined) {\n            if (defaultValue !== undefined) {\n                const defaultValueIndex = getIndexFromValue(data, defaultValue);\n\n                if (defaultValueIndex !== undefined) {\n                    setInputValueByIndex(defaultValueIndex);\n                }\n            } else {\n                setInputValueByIndex(0);\n            }\n        }\n    }, [data]);\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        const charKey = event.key;\n\n        // event.key always returns the whole string (String.fromCharCode(event.keyCode) does not)\n        // We need to filter out only alphabetical or numeric letters, that's why that condition has been changed\n        if (charKey.length === 1 && /(\\w)/g.test(charKey)) {\n            const nextIndex = getNextIndex(charKey);\n\n            if (nextIndex > -1 && nextIndex !== currentIndex) {\n                setInputValueByIndex(nextIndex);\n            }\n            return;\n        }\n\n        if (onKeyDown) {\n            event.persist();\n            onKeyDown(event);\n        }\n    };\n\n    const handleListboxFocus = (event: React.FocusEvent<HTMLElement>): void => {\n        if (currentIndex === undefined && data.length) {\n            setInputValueByIndex(0);\n        }\n\n        if (onFocus) {\n            event.persist();\n            onFocus(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        if (onChange) {\n            const item = findByValue(data, event.target.value);\n            (event as any).detail = sanitizeItem(item);\n\n            const indexes = item?.path?.split('.') ?? [];\n\n            if (indexes.length > 1) {\n                // we don't want to map the current item\n                indexes.pop();\n                // we need to rebuild the path as we map\n                let lastPath: string;\n\n                (event as any).detail.parents = indexes.map(i => {\n                    lastPath = lastPath ? [lastPath, i].join('.') : i;\n                    return sanitizeItem(data.find(i => i.path === lastPath));\n                });\n            }\n\n            onChange(event);\n        }\n    };\n\n    const list: ScrollableListProps = {\n        ...otherProps,\n        'aria-activedescendant': getActiveDescendant(data, currentIndex, id),\n        data,\n        disabled,\n        id,\n        invalid,\n        onChange: handleListboxChange,\n        onFocus: handleListboxFocus,\n        onKeyDown: handleListboxKeyDown,\n        scrollOnFocus: true,\n        tabIndex: disabled ? -1 : otherProps.tabIndex ? otherProps.tabIndex : 0,\n        value: currentIndex,\n    };\n\n    const input = {\n        name,\n        onChange: handleInputChange,\n        ref: inputRef,\n        tabIndex: -1,\n        value: value ?? '',\n    };\n\n    return { list, input };\n};\n"],"names":["useListbox","data","externalData","defaultValue","disabled","emptyValue","id","nativeId","invalid","name","onChange","onFocus","onKeyDown","value","otherProps","ref","useFlattenedData","undefined","text","React","uuid","inputRef","useMergedRef","currentIndex","getIndexFromValue","getNextIndex","useTypeahead","setInputValueByIndex","index","option","setInputValueByRef","current","handleListboxChange","length","defaultValueIndex","handleListboxKeyDown","event","charKey","key","test","nextIndex","persist","handleListboxFocus","handleInputChange","item","findByValue","target","detail","sanitizeItem","indexes","path","split","pop","lastPath","parents","map","i","join","find","list","getActiveDescendant","scrollOnFocus","tabIndex","input"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Listbox/useMultiListbox.js

@@ -1,6 +1,6 @@
 import { useMemo, useState, useEffect } from 'react';
+import { useLocalization } from '../Provider/Localization.js';
 import { v4 } from 'uuid';
-import { useLocalization } from '../Provider/Provider.js';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { getIndexFromValue, getSelectedIndexesFromValue, setInputValueByRef, getActiveDescendant, findByValue } from './util.js';
 import { useTypeahead } from './useTypeahead.js';

package/dist/esm/packages/taco/src/components/Listbox/useMultiListbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMultiListbox.js","sources":["../../../../../../../src/components/Listbox/useMultiListbox.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { v4 as uuid } from 'uuid';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { ListboxProps } from './Listbox';\r\nimport { useMergedRef } from '../../hooks/useMergedRef';\r\nimport { setInputValueByRef, getIndexFromValue, getSelectedIndexesFromValue, findByValue, getActiveDescendant } from './util';\r\nimport { ScrollableListProps, ScrollableListItem, ScrollableListItemValue } from './ScrollableList';\r\nimport { useTypeahead } from './useTypeahead';\r\n\r\ntype useListbox = {\r\n    list: ScrollableListProps;\r\n    input: Omit<React.HTMLAttributes<HTMLInputElement>, 'defaultValue'>;\r\n};\r\n\r\nexport const useMultiListbox = (\r\n    {\r\n        data: externalData = [],\r\n        defaultValue,\r\n        disabled,\r\n        emptyValue: _,\r\n        id: nativeId,\r\n        name,\r\n        onClick,\r\n        onChange,\r\n        onFocus,\r\n        onKeyDown,\r\n        value,\r\n        ...otherProps\r\n    }: ListboxProps,\r\n    ref: React.Ref<HTMLInputElement>\r\n): useListbox => {\r\n    const { texts } = useLocalization();\r\n    const id = React.useMemo(() => nativeId || uuid(), [nativeId]);\r\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\r\n    const data = React.useMemo(() => {\r\n        return [{ text: texts.listbox.allOption, value: '#ALL-OPTIONS#' }, ...externalData];\r\n    }, [externalData]);\r\n    const [currentIndex, setCurrentIndex] = React.useState(getIndexFromValue(data, value) || 0);\r\n    const [allOptionsSelected, setAllOptionsSelected] = React.useState(false);\r\n    const { getNextIndex } = useTypeahead({ data, currentIndex });\r\n    const [selectedIndexes, setSelectedIndexes] = React.useState(getSelectedIndexesFromValue(data, value));\r\n\r\n    React.useEffect(() => {\r\n        if (defaultValue && !value) {\r\n            setInputValueByRef(inputRef.current, defaultValue.toString());\r\n        }\r\n    }, []);\r\n\r\n    React.useEffect(() => {\r\n        const selectableItemsCount = data.filter(item => !item.disabled).length - 1;\r\n\r\n        if (selectableItemsCount === selectedIndexes.length) {\r\n            setAllOptionsSelected(true);\r\n        } else {\r\n            setAllOptionsSelected(false);\r\n        }\r\n    }, [selectedIndexes, data]);\r\n\r\n    const setInputValueByIndex = (index: number | undefined): void => {\r\n        if (index !== undefined) {\r\n            const option = data[index];\r\n\r\n            if (option && !option.disabled) {\r\n                let newInputValue: ScrollableListItemValue = '';\r\n                const currentInputValue = inputRef.current?.value;\r\n                const currentValuesArray = currentInputValue?.split(',') || [];\r\n                const optionAlreadySelected = currentValuesArray.findIndex(val => val === String(option.value)) !== -1;\r\n\r\n                // Handling the select_all option\r\n                if (option.value === '#ALL-OPTIONS#') {\r\n                    if (!allOptionsSelected) {\r\n                        newInputValue = data\r\n                            .filter((option, index) => index !== 0 && !option.disabled)\r\n                            .map(option => option.value)\r\n                            .join(',');\r\n                    } else {\r\n                        newInputValue = '';\r\n                    }\r\n                } else {\r\n                    // Handling rest options\r\n                    if (optionAlreadySelected) {\r\n                        newInputValue = currentValuesArray.filter(val => val !== String(option.value)).join(',');\r\n                    } else {\r\n                        newInputValue = currentInputValue ? `${currentInputValue},${option.value}` : option.value;\r\n                    }\r\n                }\r\n\r\n                setInputValueByRef(inputRef.current, newInputValue);\r\n            }\r\n        }\r\n    };\r\n\r\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>, index: number): void => {\r\n        event.preventDefault();\r\n\r\n        if (!data[index].disabled) {\r\n            setCurrentIndex(index);\r\n            setInputValueByIndex(index);\r\n        }\r\n\r\n        if (onClick) {\r\n            onClick(event);\r\n        }\r\n    };\r\n\r\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>, index?: number): void => {\r\n        const charKey = event.key;\r\n\r\n        // event.key always returns the whole string (String.fromCharCode(event.keyCode) does not)\r\n        // We need to filter out only alphabetical or numeric letters, that's why that condition has been changed\r\n        if (charKey.length === 1 && /(\\w)/g.test(charKey)) {\r\n            const nextIndex = getNextIndex(charKey);\r\n\r\n            if (nextIndex > -1 && nextIndex !== currentIndex) {\r\n                setCurrentIndex(nextIndex);\r\n            }\r\n            return;\r\n        }\r\n\r\n        switch (event.key) {\r\n            case ' ': {\r\n                event.preventDefault();\r\n                setInputValueByIndex(index);\r\n                break;\r\n            }\r\n\r\n            case 'Enter': {\r\n                setInputValueByIndex(index);\r\n                break;\r\n            }\r\n\r\n            default:\r\n        }\r\n        setCurrentIndex(index !== undefined ? index : 0);\r\n\r\n        if (onKeyDown) {\r\n            event.persist();\r\n            onKeyDown(event);\r\n        }\r\n    };\r\n\r\n    const handleListboxFocus = (event: React.FocusEvent<HTMLElement>): void => {\r\n        if (onFocus) {\r\n            event.persist();\r\n            onFocus(event);\r\n        }\r\n    };\r\n\r\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\r\n        event.persist();\r\n\r\n        setSelectedIndexes(getSelectedIndexesFromValue(data, event.target.value));\r\n\r\n        if (onChange) {\r\n            const detail: ScrollableListItem[] = [];\r\n            const valuesArray = event.target.value.split(',');\r\n\r\n            valuesArray.forEach(val => {\r\n                const item = findByValue(data, val);\r\n                if (item) {\r\n                    detail.push(item);\r\n                }\r\n            });\r\n            (event as any).detail = detail;\r\n\r\n            onChange(event);\r\n        }\r\n    };\r\n\r\n    const list = {\r\n        ...otherProps,\r\n        'aria-activedescendant': getActiveDescendant(data, currentIndex, id),\r\n        'aria-multiselectable': true,\r\n        data,\r\n        disabled,\r\n        id,\r\n        onChange: () => null,\r\n        onClick: handleListboxClick,\r\n        onFocus: handleListboxFocus,\r\n        onKeyDown: handleListboxKeyDown,\r\n        scrollOnFocus: false,\r\n        tabIndex: disabled ? -1 : otherProps.tabIndex ? otherProps.tabIndex : 0,\r\n        value: currentIndex,\r\n        selectedIndexes,\r\n        multiselect: true,\r\n        allOptionsSelected,\r\n    };\r\n\r\n    const input = {\r\n        name,\r\n        onChange: handleInputChange,\r\n        ref: inputRef,\r\n        tabIndex: -1,\r\n        value: value ?? '',\r\n    };\r\n\r\n    return { list, input };\r\n};\r\n"],"names":["useMultiListbox","data","externalData","defaultValue","disabled","emptyValue","_","id","nativeId","name","onClick","onChange","onFocus","onKeyDown","value","otherProps","ref","texts","useLocalization","React","uuid","inputRef","useMergedRef","text","listbox","allOption","currentIndex","setCurrentIndex","getIndexFromValue","allOptionsSelected","setAllOptionsSelected","getNextIndex","useTypeahead","selectedIndexes","setSelectedIndexes","getSelectedIndexesFromValue","setInputValueByRef","current","toString","selectableItemsCount","filter","item","length","setInputValueByIndex","index","undefined","option","newInputValue","currentInputValue","currentValuesArray","split","optionAlreadySelected","findIndex","val","String","map","join","handleListboxClick","event","preventDefault","handleListboxKeyDown","charKey","key","test","nextIndex","persist","handleListboxFocus","handleInputChange","target","detail","valuesArray","forEach","findByValue","push","list","getActiveDescendant","scrollOnFocus","tabIndex","multiselect","input"],"mappings":"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"}
+{"version":3,"file":"useMultiListbox.js","sources":["../../../../../../../src/components/Listbox/useMultiListbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { v4 as uuid } from 'uuid';\nimport { useLocalization } from '../Provider/Localization';\nimport { ListboxProps } from './Listbox';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef, getIndexFromValue, getSelectedIndexesFromValue, findByValue, getActiveDescendant } from './util';\nimport { ScrollableListProps, ScrollableListItem, ScrollableListItemValue } from './ScrollableList';\nimport { useTypeahead } from './useTypeahead';\n\ntype useListbox = {\n    list: ScrollableListProps;\n    input: Omit<React.HTMLAttributes<HTMLInputElement>, 'defaultValue'>;\n};\n\nexport const useMultiListbox = (\n    {\n        data: externalData = [],\n        defaultValue,\n        disabled,\n        emptyValue: _,\n        id: nativeId,\n        name,\n        onClick,\n        onChange,\n        onFocus,\n        onKeyDown,\n        value,\n        ...otherProps\n    }: ListboxProps,\n    ref: React.Ref<HTMLInputElement>\n): useListbox => {\n    const { texts } = useLocalization();\n    const id = React.useMemo(() => nativeId || uuid(), [nativeId]);\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const data = React.useMemo(() => {\n        return [{ text: texts.listbox.allOption, value: '#ALL-OPTIONS#' }, ...externalData];\n    }, [externalData]);\n    const [currentIndex, setCurrentIndex] = React.useState(getIndexFromValue(data, value) || 0);\n    const [allOptionsSelected, setAllOptionsSelected] = React.useState(false);\n    const { getNextIndex } = useTypeahead({ data, currentIndex });\n    const [selectedIndexes, setSelectedIndexes] = React.useState(getSelectedIndexesFromValue(data, value));\n\n    React.useEffect(() => {\n        if (defaultValue && !value) {\n            setInputValueByRef(inputRef.current, defaultValue.toString());\n        }\n    }, []);\n\n    React.useEffect(() => {\n        const selectableItemsCount = data.filter(item => !item.disabled).length - 1;\n\n        if (selectableItemsCount === selectedIndexes.length) {\n            setAllOptionsSelected(true);\n        } else {\n            setAllOptionsSelected(false);\n        }\n    }, [selectedIndexes, data]);\n\n    const setInputValueByIndex = (index: number | undefined): void => {\n        if (index !== undefined) {\n            const option = data[index];\n\n            if (option && !option.disabled) {\n                let newInputValue: ScrollableListItemValue = '';\n                const currentInputValue = inputRef.current?.value;\n                const currentValuesArray = currentInputValue?.split(',') || [];\n                const optionAlreadySelected = currentValuesArray.findIndex(val => val === String(option.value)) !== -1;\n\n                // Handling the select_all option\n                if (option.value === '#ALL-OPTIONS#') {\n                    if (!allOptionsSelected) {\n                        newInputValue = data\n                            .filter((option, index) => index !== 0 && !option.disabled)\n                            .map(option => option.value)\n                            .join(',');\n                    } else {\n                        newInputValue = '';\n                    }\n                } else {\n                    // Handling rest options\n                    if (optionAlreadySelected) {\n                        newInputValue = currentValuesArray.filter(val => val !== String(option.value)).join(',');\n                    } else {\n                        newInputValue = currentInputValue ? `${currentInputValue},${option.value}` : option.value;\n                    }\n                }\n\n                setInputValueByRef(inputRef.current, newInputValue);\n            }\n        }\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>, index: number): void => {\n        event.preventDefault();\n\n        if (!data[index].disabled) {\n            setCurrentIndex(index);\n            setInputValueByIndex(index);\n        }\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>, index?: number): void => {\n        const charKey = event.key;\n\n        // event.key always returns the whole string (String.fromCharCode(event.keyCode) does not)\n        // We need to filter out only alphabetical or numeric letters, that's why that condition has been changed\n        if (charKey.length === 1 && /(\\w)/g.test(charKey)) {\n            const nextIndex = getNextIndex(charKey);\n\n            if (nextIndex > -1 && nextIndex !== currentIndex) {\n                setCurrentIndex(nextIndex);\n            }\n            return;\n        }\n\n        switch (event.key) {\n            case ' ': {\n                event.preventDefault();\n                setInputValueByIndex(index);\n                break;\n            }\n\n            case 'Enter': {\n                setInputValueByIndex(index);\n                break;\n            }\n\n            default:\n        }\n        setCurrentIndex(index !== undefined ? index : 0);\n\n        if (onKeyDown) {\n            event.persist();\n            onKeyDown(event);\n        }\n    };\n\n    const handleListboxFocus = (event: React.FocusEvent<HTMLElement>): void => {\n        if (onFocus) {\n            event.persist();\n            onFocus(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        setSelectedIndexes(getSelectedIndexesFromValue(data, event.target.value));\n\n        if (onChange) {\n            const detail: ScrollableListItem[] = [];\n            const valuesArray = event.target.value.split(',');\n\n            valuesArray.forEach(val => {\n                const item = findByValue(data, val);\n                if (item) {\n                    detail.push(item);\n                }\n            });\n            (event as any).detail = detail;\n\n            onChange(event);\n        }\n    };\n\n    const list = {\n        ...otherProps,\n        'aria-activedescendant': getActiveDescendant(data, currentIndex, id),\n        'aria-multiselectable': true,\n        data,\n        disabled,\n        id,\n        onChange: () => null,\n        onClick: handleListboxClick,\n        onFocus: handleListboxFocus,\n        onKeyDown: handleListboxKeyDown,\n        scrollOnFocus: false,\n        tabIndex: disabled ? -1 : otherProps.tabIndex ? otherProps.tabIndex : 0,\n        value: currentIndex,\n        selectedIndexes,\n        multiselect: true,\n        allOptionsSelected,\n    };\n\n    const input = {\n        name,\n        onChange: handleInputChange,\n        ref: inputRef,\n        tabIndex: -1,\n        value: value ?? '',\n    };\n\n    return { list, input };\n};\n"],"names":["useMultiListbox","data","externalData","defaultValue","disabled","emptyValue","_","id","nativeId","name","onClick","onChange","onFocus","onKeyDown","value","otherProps","ref","texts","useLocalization","React","uuid","inputRef","useMergedRef","text","listbox","allOption","currentIndex","setCurrentIndex","getIndexFromValue","allOptionsSelected","setAllOptionsSelected","getNextIndex","useTypeahead","selectedIndexes","setSelectedIndexes","getSelectedIndexesFromValue","setInputValueByRef","current","toString","selectableItemsCount","filter","item","length","setInputValueByIndex","index","undefined","option","newInputValue","currentInputValue","currentValuesArray","split","optionAlreadySelected","findIndex","val","String","map","join","handleListboxClick","event","preventDefault","handleListboxKeyDown","charKey","key","test","nextIndex","persist","handleListboxFocus","handleInputChange","target","detail","valuesArray","forEach","findByValue","push","list","getActiveDescendant","scrollOnFocus","tabIndex","multiselect","input"],"mappings":";;;;;;;MAcaA,eAAe,GAAG,CAC3B;EACIC,IAAI,EAAEC,YAAY,GAAG,EAAE;EACvBC,YAAY;EACZC,QAAQ;EACRC,UAAU,EAAEC,CAAC;EACbC,EAAE,EAAEC,QAAQ;EACZC,IAAI;EACJC,OAAO;EACPC,QAAQ;EACRC,OAAO;EACPC,SAAS;EACTC,KAAK;EACL,GAAGC;CACQ,EACfC,GAAgC;EAEhC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMX,EAAE,GAAGY,OAAa,CAAC,MAAMX,QAAQ,IAAIY,EAAI,EAAE,EAAE,CAACZ,QAAQ,CAAC,CAAC;EAC9D,MAAMa,QAAQ,GAAGC,YAAY,CAAmBN,GAAG,CAAC;EACpD,MAAMf,IAAI,GAAGkB,OAAa,CAAC;IACvB,OAAO,CAAC;MAAEI,IAAI,EAAEN,KAAK,CAACO,OAAO,CAACC,SAAS;MAAEX,KAAK,EAAE;KAAiB,EAAE,GAAGZ,YAAY,CAAC;GACtF,EAAE,CAACA,YAAY,CAAC,CAAC;EAClB,MAAM,CAACwB,YAAY,EAAEC,eAAe,CAAC,GAAGR,QAAc,CAACS,iBAAiB,CAAC3B,IAAI,EAAEa,KAAK,CAAC,IAAI,CAAC,CAAC;EAC3F,MAAM,CAACe,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGX,QAAc,CAAC,KAAK,CAAC;EACzE,MAAM;IAAEY;GAAc,GAAGC,YAAY,CAAC;IAAE/B,IAAI;IAAEyB;GAAc,CAAC;EAC7D,MAAM,CAACO,eAAe,EAAEC,kBAAkB,CAAC,GAAGf,QAAc,CAACgB,2BAA2B,CAAClC,IAAI,EAAEa,KAAK,CAAC,CAAC;EAEtGK,SAAe,CAAC;IACZ,IAAIhB,YAAY,IAAI,CAACW,KAAK,EAAE;MACxBsB,kBAAkB,CAACf,QAAQ,CAACgB,OAAO,EAAElC,YAAY,CAACmC,QAAQ,EAAE,CAAC;;GAEpE,EAAE,EAAE,CAAC;EAENnB,SAAe,CAAC;IACZ,MAAMoB,oBAAoB,GAAGtC,IAAI,CAACuC,MAAM,CAACC,IAAI,IAAI,CAACA,IAAI,CAACrC,QAAQ,CAAC,CAACsC,MAAM,GAAG,CAAC;IAE3E,IAAIH,oBAAoB,KAAKN,eAAe,CAACS,MAAM,EAAE;MACjDZ,qBAAqB,CAAC,IAAI,CAAC;KAC9B,MAAM;MACHA,qBAAqB,CAAC,KAAK,CAAC;;GAEnC,EAAE,CAACG,eAAe,EAAEhC,IAAI,CAAC,CAAC;EAE3B,MAAM0C,oBAAoB,GAAIC,KAAyB;IACnD,IAAIA,KAAK,KAAKC,SAAS,EAAE;MACrB,MAAMC,MAAM,GAAG7C,IAAI,CAAC2C,KAAK,CAAC;MAE1B,IAAIE,MAAM,IAAI,CAACA,MAAM,CAAC1C,QAAQ,EAAE;QAAA;QAC5B,IAAI2C,aAAa,GAA4B,EAAE;QAC/C,MAAMC,iBAAiB,wBAAG3B,QAAQ,CAACgB,OAAO,sDAAhB,kBAAkBvB,KAAK;QACjD,MAAMmC,kBAAkB,GAAG,CAAAD,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEE,KAAK,CAAC,GAAG,CAAC,KAAI,EAAE;QAC9D,MAAMC,qBAAqB,GAAGF,kBAAkB,CAACG,SAAS,CAACC,GAAG,IAAIA,GAAG,KAAKC,MAAM,CAACR,MAAM,CAAChC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;;QAGtG,IAAIgC,MAAM,CAAChC,KAAK,KAAK,eAAe,EAAE;UAClC,IAAI,CAACe,kBAAkB,EAAE;YACrBkB,aAAa,GAAG9C,IAAI,CACfuC,MAAM,CAAC,CAACM,MAAM,EAAEF,KAAK,KAAKA,KAAK,KAAK,CAAC,IAAI,CAACE,MAAM,CAAC1C,QAAQ,CAAC,CAC1DmD,GAAG,CAACT,MAAM,IAAIA,MAAM,CAAChC,KAAK,CAAC,CAC3B0C,IAAI,CAAC,GAAG,CAAC;WACjB,MAAM;YACHT,aAAa,GAAG,EAAE;;SAEzB,MAAM;;UAEH,IAAII,qBAAqB,EAAE;YACvBJ,aAAa,GAAGE,kBAAkB,CAACT,MAAM,CAACa,GAAG,IAAIA,GAAG,KAAKC,MAAM,CAACR,MAAM,CAAChC,KAAK,CAAC,CAAC,CAAC0C,IAAI,CAAC,GAAG,CAAC;WAC3F,MAAM;YACHT,aAAa,GAAGC,iBAAiB,MAAMA,qBAAqBF,MAAM,CAAChC,OAAO,GAAGgC,MAAM,CAAChC,KAAK;;;QAIjGsB,kBAAkB,CAACf,QAAQ,CAACgB,OAAO,EAAEU,aAAa,CAAC;;;GAG9D;EAED,MAAMU,kBAAkB,GAAG,CAACC,KAAsC,EAAEd,KAAa;IAC7Ec,KAAK,CAACC,cAAc,EAAE;IAEtB,IAAI,CAAC1D,IAAI,CAAC2C,KAAK,CAAC,CAACxC,QAAQ,EAAE;MACvBuB,eAAe,CAACiB,KAAK,CAAC;MACtBD,oBAAoB,CAACC,KAAK,CAAC;;IAG/B,IAAIlC,OAAO,EAAE;MACTA,OAAO,CAACgD,KAAK,CAAC;;GAErB;EAED,MAAME,oBAAoB,GAAG,CAACF,KAAuC,EAAEd,KAAc;IACjF,MAAMiB,OAAO,GAAGH,KAAK,CAACI,GAAG;;;IAIzB,IAAID,OAAO,CAACnB,MAAM,KAAK,CAAC,IAAI,OAAO,CAACqB,IAAI,CAACF,OAAO,CAAC,EAAE;MAC/C,MAAMG,SAAS,GAAGjC,YAAY,CAAC8B,OAAO,CAAC;MAEvC,IAAIG,SAAS,GAAG,CAAC,CAAC,IAAIA,SAAS,KAAKtC,YAAY,EAAE;QAC9CC,eAAe,CAACqC,SAAS,CAAC;;MAE9B;;IAGJ,QAAQN,KAAK,CAACI,GAAG;MACb,KAAK,GAAG;QAAE;UACNJ,KAAK,CAACC,cAAc,EAAE;UACtBhB,oBAAoB,CAACC,KAAK,CAAC;UAC3B;;MAGJ,KAAK,OAAO;QAAE;UACVD,oBAAoB,CAACC,KAAK,CAAC;UAC3B;;;IAKRjB,eAAe,CAACiB,KAAK,KAAKC,SAAS,GAAGD,KAAK,GAAG,CAAC,CAAC;IAEhD,IAAI/B,SAAS,EAAE;MACX6C,KAAK,CAACO,OAAO,EAAE;MACfpD,SAAS,CAAC6C,KAAK,CAAC;;GAEvB;EAED,MAAMQ,kBAAkB,GAAIR,KAAoC;IAC5D,IAAI9C,OAAO,EAAE;MACT8C,KAAK,CAACO,OAAO,EAAE;MACfrD,OAAO,CAAC8C,KAAK,CAAC;;GAErB;EAED,MAAMS,iBAAiB,GAAIT,KAA0C;IACjEA,KAAK,CAACO,OAAO,EAAE;IAEf/B,kBAAkB,CAACC,2BAA2B,CAAClC,IAAI,EAAEyD,KAAK,CAACU,MAAM,CAACtD,KAAK,CAAC,CAAC;IAEzE,IAAIH,QAAQ,EAAE;MACV,MAAM0D,MAAM,GAAyB,EAAE;MACvC,MAAMC,WAAW,GAAGZ,KAAK,CAACU,MAAM,CAACtD,KAAK,CAACoC,KAAK,CAAC,GAAG,CAAC;MAEjDoB,WAAW,CAACC,OAAO,CAAClB,GAAG;QACnB,MAAMZ,IAAI,GAAG+B,WAAW,CAACvE,IAAI,EAAEoD,GAAG,CAAC;QACnC,IAAIZ,IAAI,EAAE;UACN4B,MAAM,CAACI,IAAI,CAAChC,IAAI,CAAC;;OAExB,CAAC;MACDiB,KAAa,CAACW,MAAM,GAAGA,MAAM;MAE9B1D,QAAQ,CAAC+C,KAAK,CAAC;;GAEtB;EAED,MAAMgB,IAAI,GAAG;IACT,GAAG3D,UAAU;IACb,uBAAuB,EAAE4D,mBAAmB,CAAC1E,IAAI,EAAEyB,YAAY,EAAEnB,EAAE,CAAC;IACpE,sBAAsB,EAAE,IAAI;IAC5BN,IAAI;IACJG,QAAQ;IACRG,EAAE;IACFI,QAAQ,EAAE,MAAM,IAAI;IACpBD,OAAO,EAAE+C,kBAAkB;IAC3B7C,OAAO,EAAEsD,kBAAkB;IAC3BrD,SAAS,EAAE+C,oBAAoB;IAC/BgB,aAAa,EAAE,KAAK;IACpBC,QAAQ,EAAEzE,QAAQ,GAAG,CAAC,CAAC,GAAGW,UAAU,CAAC8D,QAAQ,GAAG9D,UAAU,CAAC8D,QAAQ,GAAG,CAAC;IACvE/D,KAAK,EAAEY,YAAY;IACnBO,eAAe;IACf6C,WAAW,EAAE,IAAI;IACjBjD;GACH;EAED,MAAMkD,KAAK,GAAG;IACVtE,IAAI;IACJE,QAAQ,EAAEwD,iBAAiB;IAC3BnD,GAAG,EAAEK,QAAQ;IACbwD,QAAQ,EAAE,CAAC,CAAC;IACZ/D,KAAK,EAAEA,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI;GACnB;EAED,OAAO;IAAE4D,IAAI;IAAEK;GAAO;AAC1B;;;;"}

package/dist/esm/packages/taco/src/components/Listbox/useTypeahead.js

@@ -1,6 +1,6 @@
 import { useRef } from 'react';
-import useTimer from '../../utils/hooks/useTimer.js';
 import { findNextIndexByValue } from './util.js';
+import useTimer from '../../utils/hooks/useTimer.js';
 
 const useTypeahead = ({
   data,

package/dist/esm/packages/taco/src/components/Listbox/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sources":["../../../../../../../src/components/Listbox/util.ts"],"sourcesContent":["import React from 'react';\r\nimport { ScrollableListItem, ScrollableListItemValue, getId } from './ScrollableList';\r\nimport { setInputValueByRef as setInputValueByRefBase } from '../../utils/input';\r\n\r\nconst getValue = (value: ScrollableListItemValue | undefined): string => String(value ?? '');\r\n\r\nexport const setInputValueByRef = (input: HTMLInputElement | null, value: ScrollableListItemValue, event = 'change'): void => {\r\n    setInputValueByRefBase(input, getValue(value), event);\r\n};\r\n\r\nexport const getIndexFromValue = (data: ScrollableListItem[], value: ScrollableListItemValue | undefined): number | undefined => {\r\n    const index = data.findIndex(option => getValue(option.value) === getValue(value));\r\n    return index > -1 ? index : undefined;\r\n};\r\n\r\nexport const getSelectedIndexesFromValue = (data: ScrollableListItem[], value: ScrollableListItemValue | undefined): number[] => {\r\n    if (typeof value !== 'string') return [];\r\n\r\n    return value\r\n        .split(',')\r\n        .map(v => data.findIndex(o => String(o.value) === v))\r\n        .filter(v => v !== -1);\r\n};\r\n\r\nexport const findByValue = (data: ScrollableListItem[], value: ScrollableListItemValue): ScrollableListItem | undefined => {\r\n    return data.find(option => getValue(option.value) === getValue(value));\r\n};\r\n\r\nexport const searchForString = (child: JSX.Element | string, value: string, strategy = 'includes'): boolean => {\r\n    try {\r\n        if (typeof child !== 'string' && child.props?.children) {\r\n            if (Array.isArray(child.props?.children)) {\r\n                return !!child.props.children.find((subChild: JSX.Element | string) =>\r\n                    searchForString(subChild, value, strategy)\r\n                );\r\n            }\r\n\r\n            return searchForString(child.props?.children, value, strategy);\r\n        } else {\r\n            return child.toString().toLowerCase()[strategy](String(value).toLowerCase());\r\n        }\r\n    } catch {\r\n        return false;\r\n    }\r\n};\r\n\r\nconst getIndexInRangeByValue = (\r\n    data: ScrollableListItem[],\r\n    query: string,\r\n    firstIndex: number,\r\n    lastIndex: number = data.length\r\n): number => {\r\n    const index = data.slice(firstIndex, lastIndex).findIndex(option => {\r\n        if (option.disabled) {\r\n            return false;\r\n        }\r\n\r\n        return searchForString(option.text, query, 'startsWith');\r\n    });\r\n\r\n    return index > -1 ? index + firstIndex : -1;\r\n};\r\n\r\nexport const findNextIndexByValue = (data: ScrollableListItem[], query: string, activeIndex: number | undefined): number => {\r\n    const firstIndex = activeIndex === undefined ? 0 : activeIndex + 1;\r\n    let index = getIndexInRangeByValue(data, query, firstIndex);\r\n\r\n    if (index === -1) {\r\n        index = getIndexInRangeByValue(data, query, 0, activeIndex);\r\n    }\r\n\r\n    return index;\r\n};\r\n\r\nexport const getActiveDescendant = (data: ScrollableListItem[], currentIndex: number | undefined, id: string): any => {\r\n    return currentIndex !== undefined && data[currentIndex] ? getId(id, data[currentIndex].value) : undefined;\r\n};\r\n\r\nexport const useFlattenedData = (data: ScrollableListItem[]): ScrollableListItem[] => {\r\n    return React.useMemo(() => {\r\n        const items: ScrollableListItem[] = [];\r\n\r\n        const flatten = (item: ScrollableListItem, path: number, parentPath?: string, parentDisabled?: boolean) => {\r\n            const currentPath = parentPath ? `${parentPath}.${path}` : `${path}`;\r\n            const isItemDisabled = parentDisabled || item.disabled;\r\n\r\n            items.push({\r\n                ...item,\r\n                disabled: isItemDisabled,\r\n                path: currentPath,\r\n                hasChildren: !!item.children,\r\n            });\r\n\r\n            if (item.children) {\r\n                item.children.forEach((childItem: ScrollableListItem, childPath: number) =>\r\n                    flatten(childItem, childPath, currentPath, isItemDisabled)\r\n                );\r\n            }\r\n        };\r\n\r\n        data.forEach((item, index) => {\r\n            flatten(item, index);\r\n        });\r\n\r\n        return items;\r\n    }, [data]);\r\n};\r\n\r\nexport const sanitizeItem = (item: ScrollableListItem | undefined) => {\r\n    if (item) {\r\n        const { hasChildren: _1, path: _2, ...rest } = item;\r\n        return rest;\r\n    }\r\n\r\n    return undefined;\r\n};\r\n\r\nexport const getOptionParents = (data: ScrollableListItem[], path?: string) => {\r\n    const indexes = path?.split('.') ?? [];\r\n\r\n    if (indexes.length > 1) {\r\n        // we don't want to map the current item\r\n        indexes.pop();\r\n        // we need to rebuild the path as we map\r\n        let lastPath: string;\r\n\r\n        return indexes.map(i => {\r\n            lastPath = lastPath ? [lastPath, i].join('.') : i;\r\n            return sanitizeItem(data.find((i: ScrollableListItem) => i.path === lastPath));\r\n        });\r\n    }\r\n\r\n    return null;\r\n};\r\n\r\nexport const filterData = (data: ScrollableListItem[], value: ScrollableListItemValue = ''): ScrollableListItem[] => {\r\n    if (value === '' || value === null) {\r\n        return data;\r\n    }\r\n\r\n    const filteredOptionValues = new Set();\r\n    const shouldFilterOption = (option: ScrollableListItem): boolean => {\r\n        if (option.disabled) {\r\n            return false;\r\n        }\r\n\r\n        return searchForString(option.text, String(value));\r\n    };\r\n\r\n    data.forEach(option => {\r\n        if (shouldFilterOption(option)) {\r\n            const parents = getOptionParents(data, option.path);\r\n\r\n            filteredOptionValues.add(option.value);\r\n\r\n            if (parents !== null) {\r\n                parents.forEach(option => filteredOptionValues.add(option?.value));\r\n            }\r\n        }\r\n    });\r\n\r\n    return data.filter(({ value }) => filteredOptionValues.has(value));\r\n};\r\n"],"names":["getValue","value","String","setInputValueByRef","input","event","setInputValueByRefBase","getIndexFromValue","data","index","findIndex","option","undefined","getSelectedIndexesFromValue","split","map","v","o","filter","findByValue","find","searchForString","child","strategy","props","children","Array","isArray","subChild","toString","toLowerCase","getIndexInRangeByValue","query","firstIndex","lastIndex","length","slice","disabled","text","findNextIndexByValue","activeIndex","getActiveDescendant","currentIndex","id","getId","useFlattenedData","React","useMemo","items","flatten","item","path","parentPath","parentDisabled","currentPath","isItemDisabled","push","hasChildren","forEach","childItem","childPath","sanitizeItem","_1","_2","rest","getOptionParents","indexes","pop","lastPath","i","join","filterData","filteredOptionValues","Set","shouldFilterOption","parents","add","has"],"mappings":"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"}
+{"version":3,"file":"util.js","sources":["../../../../../../../src/components/Listbox/util.ts"],"sourcesContent":["import React from 'react';\nimport { ScrollableListItem, ScrollableListItemValue, getId } from './ScrollableList';\nimport { setInputValueByRef as setInputValueByRefBase } from '../../utils/input';\n\nconst getValue = (value: ScrollableListItemValue | undefined): string => String(value ?? '');\n\nexport const setInputValueByRef = (input: HTMLInputElement | null, value: ScrollableListItemValue, event = 'change'): void => {\n    setInputValueByRefBase(input, getValue(value), event);\n};\n\nexport const getIndexFromValue = (data: ScrollableListItem[], value: ScrollableListItemValue | undefined): number | undefined => {\n    const index = data.findIndex(option => getValue(option.value) === getValue(value));\n    return index > -1 ? index : undefined;\n};\n\nexport const getSelectedIndexesFromValue = (data: ScrollableListItem[], value: ScrollableListItemValue | undefined): number[] => {\n    if (typeof value !== 'string') return [];\n\n    return value\n        .split(',')\n        .map(v => data.findIndex(o => String(o.value) === v))\n        .filter(v => v !== -1);\n};\n\nexport const findByValue = (data: ScrollableListItem[], value: ScrollableListItemValue): ScrollableListItem | undefined => {\n    return data.find(option => getValue(option.value) === getValue(value));\n};\n\nexport const searchForString = (child: JSX.Element | string, value: string, strategy = 'includes'): boolean => {\n    try {\n        if (typeof child !== 'string' && child.props?.children) {\n            if (Array.isArray(child.props?.children)) {\n                return !!child.props.children.find((subChild: JSX.Element | string) =>\n                    searchForString(subChild, value, strategy)\n                );\n            }\n\n            return searchForString(child.props?.children, value, strategy);\n        } else {\n            return child.toString().toLowerCase()[strategy](String(value).toLowerCase());\n        }\n    } catch {\n        return false;\n    }\n};\n\nconst getIndexInRangeByValue = (\n    data: ScrollableListItem[],\n    query: string,\n    firstIndex: number,\n    lastIndex: number = data.length\n): number => {\n    const index = data.slice(firstIndex, lastIndex).findIndex(option => {\n        if (option.disabled) {\n            return false;\n        }\n\n        return searchForString(option.text, query, 'startsWith');\n    });\n\n    return index > -1 ? index + firstIndex : -1;\n};\n\nexport const findNextIndexByValue = (data: ScrollableListItem[], query: string, activeIndex: number | undefined): number => {\n    const firstIndex = activeIndex === undefined ? 0 : activeIndex + 1;\n    let index = getIndexInRangeByValue(data, query, firstIndex);\n\n    if (index === -1) {\n        index = getIndexInRangeByValue(data, query, 0, activeIndex);\n    }\n\n    return index;\n};\n\nexport const getActiveDescendant = (data: ScrollableListItem[], currentIndex: number | undefined, id: string): any => {\n    return currentIndex !== undefined && data[currentIndex] ? getId(id, data[currentIndex].value) : undefined;\n};\n\nexport const useFlattenedData = (data: ScrollableListItem[]): ScrollableListItem[] => {\n    return React.useMemo(() => {\n        const items: ScrollableListItem[] = [];\n\n        const flatten = (item: ScrollableListItem, path: number, parentPath?: string, parentDisabled?: boolean) => {\n            const currentPath = parentPath ? `${parentPath}.${path}` : `${path}`;\n            const isItemDisabled = parentDisabled || item.disabled;\n\n            items.push({\n                ...item,\n                disabled: isItemDisabled,\n                path: currentPath,\n                hasChildren: !!item.children,\n            });\n\n            if (item.children) {\n                item.children.forEach((childItem: ScrollableListItem, childPath: number) =>\n                    flatten(childItem, childPath, currentPath, isItemDisabled)\n                );\n            }\n        };\n\n        data.forEach((item, index) => {\n            flatten(item, index);\n        });\n\n        return items;\n    }, [data]);\n};\n\nexport const sanitizeItem = (item: ScrollableListItem | undefined) => {\n    if (item) {\n        const { hasChildren: _1, path: _2, ...rest } = item;\n        return rest;\n    }\n\n    return undefined;\n};\n\nexport const getOptionParents = (data: ScrollableListItem[], path?: string) => {\n    const indexes = path?.split('.') ?? [];\n\n    if (indexes.length > 1) {\n        // we don't want to map the current item\n        indexes.pop();\n        // we need to rebuild the path as we map\n        let lastPath: string;\n\n        return indexes.map(i => {\n            lastPath = lastPath ? [lastPath, i].join('.') : i;\n            return sanitizeItem(data.find((i: ScrollableListItem) => i.path === lastPath));\n        });\n    }\n\n    return null;\n};\n\nexport const filterData = (data: ScrollableListItem[], value: ScrollableListItemValue = ''): ScrollableListItem[] => {\n    if (value === '' || value === null) {\n        return data;\n    }\n\n    const filteredOptionValues = new Set();\n    const shouldFilterOption = (option: ScrollableListItem): boolean => {\n        if (option.disabled) {\n            return false;\n        }\n\n        return searchForString(option.text, String(value));\n    };\n\n    data.forEach(option => {\n        if (shouldFilterOption(option)) {\n            const parents = getOptionParents(data, option.path);\n\n            filteredOptionValues.add(option.value);\n\n            if (parents !== null) {\n                parents.forEach(option => filteredOptionValues.add(option?.value));\n            }\n        }\n    });\n\n    return data.filter(({ value }) => filteredOptionValues.has(value));\n};\n"],"names":["getValue","value","String","setInputValueByRef","input","event","setInputValueByRefBase","getIndexFromValue","data","index","findIndex","option","undefined","getSelectedIndexesFromValue","split","map","v","o","filter","findByValue","find","searchForString","child","strategy","props","children","Array","isArray","subChild","toString","toLowerCase","getIndexInRangeByValue","query","firstIndex","lastIndex","length","slice","disabled","text","findNextIndexByValue","activeIndex","getActiveDescendant","currentIndex","id","getId","useFlattenedData","React","useMemo","items","flatten","item","path","parentPath","parentDisabled","currentPath","isItemDisabled","push","hasChildren","forEach","childItem","childPath","sanitizeItem","_1","_2","rest","getOptionParents","indexes","pop","lastPath","i","join","filterData","filteredOptionValues","Set","shouldFilterOption","parents","add","has"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Menu/Menu.js

@@ -1,5 +1,6 @@
 import { forwardRef, useState, useMemo, createElement } from 'react';
 import { Root } from '@radix-ui/react-dropdown-menu';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { MenuContext } from './Context.js';
 import { Content } from './components/Content.js';
 import { Item } from './components/Item.js';
@@ -13,12 +14,21 @@ import { Header } from './components/Header.js';
 const Menu = /*#__PURE__*/forwardRef(function Menu(externalProps, ref) {
   const {
     children,
+    defaultOpen: defaultProp,
+    onChange,
+    open: prop,
     trigger,
     ...props
   } = externalProps;
-  const [open, setOpen] = useState(false);
   const [indented, setIndented] = useState(false);
   const [minWidth, setMinWidth] = useState(undefined);
+  const [open, setOpen] = useControllableState({
+    // uncontrolled
+    defaultProp,
+    // controlled
+    onChange,
+    prop
+  });
   const context = useMemo(() => ({
     indented,
     registerIndentation: () => setIndented(true),

package/dist/esm/packages/taco/src/components/Menu/Menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","sources":["../../../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport { MenuContext } from './Context';\r\nimport { Content, MenuContentProps } from './components/Content';\r\nimport { Item, MenuItemProps } from './components/Item';\r\nimport { Link, MenuLinkItemProps } from './components/Link';\r\nimport { Trigger, MenuTriggerProps } from './components/Trigger';\r\nimport { Checkbox, MenuCheckboxItemProps } from './components/Checkbox';\r\nimport { ForwardedMenuRadioGroupWithStatics, RadioGroup } from './components/RadioGroup';\r\nimport { Separator } from './components/Separator';\r\nimport { Header, MenuHeaderProps } from './components/Header';\r\n\r\nexport type MenuProps = {\r\n    children: React.ReactNode;\r\n    id?: string;\r\n    /** A trigger to be used for the menu, should not be set if `children` already contains a trigger */\r\n    trigger?: JSX.Element;\r\n};\r\nexport type ForwardedMenuWithStatics = React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLElement>> & {\r\n    Trigger: React.ForwardRefExoticComponent<MenuTriggerProps>;\r\n    Content: React.ForwardRefExoticComponent<MenuContentProps>;\r\n    Item: React.ForwardRefExoticComponent<MenuItemProps>;\r\n    Link: React.ForwardRefExoticComponent<MenuLinkItemProps>;\r\n    Checkbox: React.ForwardRefExoticComponent<MenuCheckboxItemProps>;\r\n    Separator: React.FunctionComponent;\r\n    Header: React.ForwardRefExoticComponent<MenuHeaderProps>;\r\n    RadioGroup: ForwardedMenuRadioGroupWithStatics;\r\n};\r\n\r\nexport const Menu = React.forwardRef<HTMLButtonElement, MenuProps>(function Menu(externalProps, ref) {\r\n    const { children, trigger, ...props } = externalProps;\r\n    const [open, setOpen] = React.useState(false);\r\n    const [indented, setIndented] = React.useState(false);\r\n    const [minWidth, setMinWidth] = React.useState<number | undefined>(undefined);\r\n\r\n    const context = React.useMemo(\r\n        () => ({\r\n            indented,\r\n            registerIndentation: () => setIndented(true),\r\n            minWidth,\r\n            setMinWidth: (width: number) => setMinWidth(width),\r\n            close: () => setOpen(false),\r\n        }),\r\n        [indented, minWidth]\r\n    );\r\n\r\n    return (\r\n        <MenuContext.Provider value={context}>\r\n            <DropdownMenuPrimitive.Root {...props} modal={false} open={open} onOpenChange={setOpen}>\r\n                {trigger && <Trigger ref={ref}>{trigger}</Trigger>}\r\n                {children}\r\n            </DropdownMenuPrimitive.Root>\r\n        </MenuContext.Provider>\r\n    );\r\n}) as ForwardedMenuWithStatics;\r\nMenu.Trigger = Trigger;\r\nMenu.Content = Content;\r\nMenu.Item = Item;\r\nMenu.Link = Link;\r\nMenu.Checkbox = Checkbox;\r\nMenu.Separator = Separator;\r\nMenu.Header = Header;\r\nMenu.RadioGroup = RadioGroup;\r\n"],"names":["Menu","React","externalProps","ref","children","trigger","props","open","setOpen","indented","setIndented","minWidth","setMinWidth","undefined","context","registerIndentation","width","close","MenuContext","Provider","value","DropdownMenuPrimitive","modal","onOpenChange","Trigger","Content","Item","Link","Checkbox","Separator","Header","RadioGroup"],"mappings":";;;;;;;;;;;;MA6BaA,IAAI,gBAAGC,UAAgB,CAA+B,SAASD,IAAI,CAACE,aAAa,EAAEC,GAAG;EAC/F,MAAM;IAAEC,QAAQ;IAAEC,OAAO;IAAE,GAAGC;GAAO,GAAGJ,aAAa;EACrD,MAAM,CAACK,IAAI,EAAEC,OAAO,CAAC,GAAGP,QAAc,CAAC,KAAK,CAAC;EAC7C,MAAM,CAACQ,QAAQ,EAAEC,WAAW,CAAC,GAAGT,QAAc,CAAC,KAAK,CAAC;EACrD,MAAM,CAACU,QAAQ,EAAEC,WAAW,CAAC,GAAGX,QAAc,CAAqBY,SAAS,CAAC;EAE7E,MAAMC,OAAO,GAAGb,OAAa,CACzB,OAAO;IACHQ,QAAQ;IACRM,mBAAmB,EAAE,MAAML,WAAW,CAAC,IAAI,CAAC;IAC5CC,QAAQ;IACRC,WAAW,EAAGI,KAAa,IAAKJ,WAAW,CAACI,KAAK,CAAC;IAClDC,KAAK,EAAE,MAAMT,OAAO,CAAC,KAAK;GAC7B,CAAC,EACF,CAACC,QAAQ,EAAEE,QAAQ,CAAC,CACvB;EAED,oBACIV,cAACiB,WAAW,CAACC,QAAQ;IAACC,KAAK,EAAEN;kBACzBb,cAACoB,IAA0B,oBAAKf,KAAK;IAAEgB,KAAK,EAAE,KAAK;IAAEf,IAAI,EAAEA,IAAI;IAAEgB,YAAY,EAAEf;MAC1EH,OAAO,iBAAIJ,cAACuB,OAAO;IAACrB,GAAG,EAAEA;KAAME,OAAO,CAAW,EACjDD,QAAQ,CACgB,CACV;AAE/B,CAAC;AACDJ,IAAI,CAACwB,OAAO,GAAGA,OAAO;AACtBxB,IAAI,CAACyB,OAAO,GAAGA,OAAO;AACtBzB,IAAI,CAAC0B,IAAI,GAAGA,IAAI;AAChB1B,IAAI,CAAC2B,IAAI,GAAGA,IAAI;AAChB3B,IAAI,CAAC4B,QAAQ,GAAGA,QAAQ;AACxB5B,IAAI,CAAC6B,SAAS,GAAGA,SAAS;AAC1B7B,IAAI,CAAC8B,MAAM,GAAGA,MAAM;AACpB9B,IAAI,CAAC+B,UAAU,GAAGA,UAAU;;;;"}
+{"version":3,"file":"Menu.js","sources":["../../../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { MenuContext } from './Context';\nimport { Content, MenuContentProps } from './components/Content';\nimport { Item, MenuItemProps } from './components/Item';\nimport { Link, MenuLinkItemProps } from './components/Link';\nimport { Trigger, MenuTriggerProps } from './components/Trigger';\nimport { Checkbox, MenuCheckboxItemProps } from './components/Checkbox';\nimport { ForwardedMenuRadioGroupWithStatics, RadioGroup } from './components/RadioGroup';\nimport { Separator } from './components/Separator';\nimport { Header, MenuHeaderProps } from './components/Header';\n\nexport type MenuProps = {\n    children: React.ReactNode;\n    /** Set whether the menu is open by default or not  */\n    defaultOpen?: boolean;\n    /** Called when the menu opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n    /** Control the open state of the menu from outside the component  */\n    open?: boolean;\n    /** A trigger to be used for the menu, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n};\nexport type ForwardedMenuWithStatics = React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<MenuTriggerProps>;\n    Content: React.ForwardRefExoticComponent<MenuContentProps>;\n    Item: React.ForwardRefExoticComponent<MenuItemProps>;\n    Link: React.ForwardRefExoticComponent<MenuLinkItemProps>;\n    Checkbox: React.ForwardRefExoticComponent<MenuCheckboxItemProps>;\n    Separator: React.FunctionComponent;\n    Header: React.ForwardRefExoticComponent<MenuHeaderProps>;\n    RadioGroup: ForwardedMenuRadioGroupWithStatics;\n};\n\nexport const Menu = React.forwardRef<HTMLButtonElement, MenuProps>(function Menu(externalProps, ref) {\n    const { children, defaultOpen: defaultProp, onChange, open: prop, trigger, ...props } = externalProps;\n    const [indented, setIndented] = React.useState(false);\n    const [minWidth, setMinWidth] = React.useState<number | undefined>(undefined);\n\n    const [open, setOpen] = useControllableState<boolean>({\n        // uncontrolled\n        defaultProp,\n        // controlled\n        onChange,\n        prop,\n    });\n\n    const context = React.useMemo(\n        () => ({\n            indented,\n            registerIndentation: () => setIndented(true),\n            minWidth,\n            setMinWidth: (width: number) => setMinWidth(width),\n            close: () => setOpen(false),\n        }),\n        [indented, minWidth]\n    );\n\n    return (\n        <MenuContext.Provider value={context}>\n            <DropdownMenuPrimitive.Root {...props} modal={false} open={open} onOpenChange={setOpen}>\n                {trigger && <Trigger ref={ref}>{trigger}</Trigger>}\n                {children}\n            </DropdownMenuPrimitive.Root>\n        </MenuContext.Provider>\n    );\n}) as ForwardedMenuWithStatics;\nMenu.Trigger = Trigger;\nMenu.Content = Content;\nMenu.Item = Item;\nMenu.Link = Link;\nMenu.Checkbox = Checkbox;\nMenu.Separator = Separator;\nMenu.Header = Header;\nMenu.RadioGroup = RadioGroup;\n"],"names":["Menu","React","externalProps","ref","children","defaultOpen","defaultProp","onChange","open","prop","trigger","props","indented","setIndented","minWidth","setMinWidth","undefined","setOpen","useControllableState","context","registerIndentation","width","close","MenuContext","Provider","value","DropdownMenuPrimitive","modal","onOpenChange","Trigger","Content","Item","Link","Checkbox","Separator","Header","RadioGroup"],"mappings":";;;;;;;;;;;;;MAmCaA,IAAI,gBAAGC,UAAgB,CAA+B,SAASD,IAAI,CAACE,aAAa,EAAEC,GAAG;EAC/F,MAAM;IAAEC,QAAQ;IAAEC,WAAW,EAAEC,WAAW;IAAEC,QAAQ;IAAEC,IAAI,EAAEC,IAAI;IAAEC,OAAO;IAAE,GAAGC;GAAO,GAAGT,aAAa;EACrG,MAAM,CAACU,QAAQ,EAAEC,WAAW,CAAC,GAAGZ,QAAc,CAAC,KAAK,CAAC;EACrD,MAAM,CAACa,QAAQ,EAAEC,WAAW,CAAC,GAAGd,QAAc,CAAqBe,SAAS,CAAC;EAE7E,MAAM,CAACR,IAAI,EAAES,OAAO,CAAC,GAAGC,oBAAoB,CAAU;;IAElDZ,WAAW;;IAEXC,QAAQ;IACRE;GACH,CAAC;EAEF,MAAMU,OAAO,GAAGlB,OAAa,CACzB,OAAO;IACHW,QAAQ;IACRQ,mBAAmB,EAAE,MAAMP,WAAW,CAAC,IAAI,CAAC;IAC5CC,QAAQ;IACRC,WAAW,EAAGM,KAAa,IAAKN,WAAW,CAACM,KAAK,CAAC;IAClDC,KAAK,EAAE,MAAML,OAAO,CAAC,KAAK;GAC7B,CAAC,EACF,CAACL,QAAQ,EAAEE,QAAQ,CAAC,CACvB;EAED,oBACIb,cAACsB,WAAW,CAACC,QAAQ;IAACC,KAAK,EAAEN;kBACzBlB,cAACyB,IAA0B,oBAAKf,KAAK;IAAEgB,KAAK,EAAE,KAAK;IAAEnB,IAAI,EAAEA,IAAI;IAAEoB,YAAY,EAAEX;MAC1EP,OAAO,iBAAIT,cAAC4B,OAAO;IAAC1B,GAAG,EAAEA;KAAMO,OAAO,CAAW,EACjDN,QAAQ,CACgB,CACV;AAE/B,CAAC;AACDJ,IAAI,CAAC6B,OAAO,GAAGA,OAAO;AACtB7B,IAAI,CAAC8B,OAAO,GAAGA,OAAO;AACtB9B,IAAI,CAAC+B,IAAI,GAAGA,IAAI;AAChB/B,IAAI,CAACgC,IAAI,GAAGA,IAAI;AAChBhC,IAAI,CAACiC,QAAQ,GAAGA,QAAQ;AACxBjC,IAAI,CAACkC,SAAS,GAAGA,SAAS;AAC1BlC,IAAI,CAACmC,MAAM,GAAGA,MAAM;AACpBnC,IAAI,CAACoC,UAAU,GAAGA,UAAU;;;;"}

package/dist/esm/packages/taco/src/components/Menu/components/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../../../../../src/components/Menu/components/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport { Icon } from '../../Icon/Icon';\r\nimport { useItemStyling } from './Item';\r\n\r\nexport type MenuCheckboxItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\r\n    /* Whether the checkbox item is disabled */\r\n    disabled?: boolean;\r\n    /* The current checked state (controlled) */\r\n    checked: boolean;\r\n    /* Handler called when the checked state changes */\r\n    onChange: (checked: boolean | 'indeterminate') => void;\r\n};\r\n\r\nexport const Checkbox = React.forwardRef<HTMLDivElement, MenuCheckboxItemProps>(function MenuCheckboxItem(props, ref) {\r\n    const { checked, children, onChange, ...otherProps } = props;\r\n    const className = useItemStyling({\r\n        disabled: props.disabled,\r\n        indented: true,\r\n        className: props.className,\r\n    });\r\n\r\n    return (\r\n        <DropdownMenuPrimitive.CheckboxItem\r\n            {...otherProps}\r\n            checked={checked}\r\n            className={className}\r\n            onCheckedChange={onChange}\r\n            ref={ref}>\r\n            <DropdownMenuPrimitive.ItemIndicator className=\"absolute left-0 ml-1.5\">\r\n                <Icon name=\"tick\" className=\"-ml-px !h-4 !w-4\" />\r\n            </DropdownMenuPrimitive.ItemIndicator>\r\n            {children}\r\n        </DropdownMenuPrimitive.CheckboxItem>\r\n    );\r\n});\r\n"],"names":["Checkbox","React","MenuCheckboxItem","props","ref","checked","children","onChange","otherProps","className","useItemStyling","disabled","indented","DropdownMenuPrimitive","onCheckedChange","Icon","name"],"mappings":";;;;;MAcaA,QAAQ,gBAAGC,UAAgB,CAAwC,SAASC,gBAAgB,CAACC,KAAK,EAAEC,GAAG;EAChH,MAAM;IAAEC,OAAO;IAAEC,QAAQ;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAC5D,MAAMM,SAAS,GAAGC,cAAc,CAAC;IAC7BC,QAAQ,EAAER,KAAK,CAACQ,QAAQ;IACxBC,QAAQ,EAAE,IAAI;IACdH,SAAS,EAAEN,KAAK,CAACM;GACpB,CAAC;EAEF,oBACIR,cAACY,YAAkC,oBAC3BL,UAAU;IACdH,OAAO,EAAEA,OAAO;IAChBI,SAAS,EAAEA,SAAS;IACpBK,eAAe,EAAEP,QAAQ;IACzBH,GAAG,EAAEA;mBACLH,cAACY,aAAmC;IAACJ,SAAS,EAAC;kBAC3CR,cAACc,IAAI;IAACC,IAAI,EAAC,MAAM;IAACP,SAAS,EAAC;IAAqB,CACf,EACrCH,QAAQ,CACwB;AAE7C,CAAC;;;;"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../../../../../src/components/Menu/components/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { Icon } from '../../Icon/Icon';\nimport { useItemStyling } from './Item';\n\nexport type MenuCheckboxItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    /* Whether the checkbox item is disabled */\n    disabled?: boolean;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean | 'indeterminate') => void;\n};\n\nexport const Checkbox = React.forwardRef<HTMLDivElement, MenuCheckboxItemProps>(function MenuCheckboxItem(props, ref) {\n    const { checked, children, onChange, ...otherProps } = props;\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: true,\n        className: props.className,\n    });\n\n    return (\n        <DropdownMenuPrimitive.CheckboxItem\n            {...otherProps}\n            checked={checked}\n            className={className}\n            onCheckedChange={onChange}\n            ref={ref}>\n            <DropdownMenuPrimitive.ItemIndicator className=\"absolute left-0 ml-1.5\">\n                <Icon name=\"tick\" className=\"-ml-px !h-4 !w-4\" />\n            </DropdownMenuPrimitive.ItemIndicator>\n            {children}\n        </DropdownMenuPrimitive.CheckboxItem>\n    );\n});\n"],"names":["Checkbox","React","MenuCheckboxItem","props","ref","checked","children","onChange","otherProps","className","useItemStyling","disabled","indented","DropdownMenuPrimitive","onCheckedChange","Icon","name"],"mappings":";;;;;MAcaA,QAAQ,gBAAGC,UAAgB,CAAwC,SAASC,gBAAgB,CAACC,KAAK,EAAEC,GAAG;EAChH,MAAM;IAAEC,OAAO;IAAEC,QAAQ;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAC5D,MAAMM,SAAS,GAAGC,cAAc,CAAC;IAC7BC,QAAQ,EAAER,KAAK,CAACQ,QAAQ;IACxBC,QAAQ,EAAE,IAAI;IACdH,SAAS,EAAEN,KAAK,CAACM;GACpB,CAAC;EAEF,oBACIR,cAACY,YAAkC,oBAC3BL,UAAU;IACdH,OAAO,EAAEA,OAAO;IAChBI,SAAS,EAAEA,SAAS;IACpBK,eAAe,EAAEP,QAAQ;IACzBH,GAAG,EAAEA;mBACLH,cAACY,aAAmC;IAACJ,SAAS,EAAC;kBAC3CR,cAACc,IAAI;IAACC,IAAI,EAAC,MAAM;IAACP,SAAS,EAAC;IAAqB,CACf,EACrCH,QAAQ,CACwB;AAE7C,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Menu/components/Content.js

@@ -8,17 +8,18 @@ const Content = /*#__PURE__*/forwardRef(function MenuContent(props, ref) {
   const internalRef = useMergedRef(ref);
   const menu = useCurrentMenu();
   const {
+    align = 'start',
     children,
     placement: side,
     ...otherProps
   } = props;
-  const className = cn('border rounded block outline-none p-1 wcag-white border-grey yt-shadow', props.className);
+  const className = cn('border border-transparent rounded block outline-none p-1 yt-shadow wcag-white', props.className);
   return /*#__PURE__*/createElement(Portal, null, /*#__PURE__*/createElement(Content$1, Object.assign({}, otherProps, {
-    align: "start",
+    align: align,
     className: className,
     "data-taco": "menu",
     side: side,
-    sideOffset: 2,
+    sideOffset: 3,
     style: {
       minWidth: menu === null || menu === void 0 ? void 0 : menu.minWidth
     },

package/dist/esm/packages/taco/src/components/Menu/components/Content.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Menu/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport cn from 'classnames';\r\nimport { Placement } from '../../../types';\r\nimport { useMergedRef } from '../../../hooks/useMergedRef';\r\nimport { useCurrentMenu } from '../Context';\r\n\r\nexport type MenuContentProps = Omit<DropdownMenuPrimitive.DropdownMenuContentProps, 'children' | 'side'> & {\r\n    children: React.ReactNode;\r\n    /** Set the position of the Menu relative to its trigger. Default value is `bottom` */\r\n    placement?: Placement;\r\n};\r\n\r\nexport const Content = React.forwardRef(function MenuContent(props: MenuContentProps, ref: React.Ref<HTMLDivElement>) {\r\n    const internalRef = useMergedRef<any>(ref);\r\n    const menu = useCurrentMenu();\r\n    const { children, placement: side, ...otherProps } = props;\r\n    const className = cn('border rounded block outline-none p-1 wcag-white border-grey yt-shadow', props.className);\r\n\r\n    return (\r\n        <DropdownMenuPrimitive.Portal>\r\n            <DropdownMenuPrimitive.Content\r\n                {...otherProps}\r\n                align=\"start\"\r\n                className={className}\r\n                data-taco=\"menu\"\r\n                side={side}\r\n                sideOffset={2}\r\n                style={{ minWidth: menu?.minWidth }}\r\n                ref={internalRef}>\r\n                {children}\r\n            </DropdownMenuPrimitive.Content>\r\n        </DropdownMenuPrimitive.Portal>\r\n    );\r\n});\r\n"],"names":["Content","React","MenuContent","props","ref","internalRef","useMergedRef","menu","useCurrentMenu","children","placement","side","otherProps","className","cn","DropdownMenuPrimitive","align","sideOffset","style","minWidth"],"mappings":";;;;;;MAaaA,OAAO,gBAAGC,UAAgB,CAAC,SAASC,WAAW,CAACC,KAAuB,EAAEC,GAA8B;EAChH,MAAMC,WAAW,GAAGC,YAAY,CAAMF,GAAG,CAAC;EAC1C,MAAMG,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAM;IAAEC,QAAQ;IAAEC,SAAS,EAAEC,IAAI;IAAE,GAAGC;GAAY,GAAGT,KAAK;EAC1D,MAAMU,SAAS,GAAGC,EAAE,CAAC,wEAAwE,EAAEX,KAAK,CAACU,SAAS,CAAC;EAE/G,oBACIZ,cAACc,MAA4B,qBACzBd,cAACc,SAA6B,oBACtBH,UAAU;IACdI,KAAK,EAAC,OAAO;IACbH,SAAS,EAAEA,SAAS;iBACV,MAAM;IAChBF,IAAI,EAAEA,IAAI;IACVM,UAAU,EAAE,CAAC;IACbC,KAAK,EAAE;MAAEC,QAAQ,EAAEZ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEY;KAAU;IACnCf,GAAG,EAAEC;MACJI,QAAQ,CACmB,CACL;AAEvC,CAAC;;;;"}
+{"version":3,"file":"Content.js","sources":["../../../../../../../../src/components/Menu/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { Align, Placement } from '../../../types';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useCurrentMenu } from '../Context';\n\nexport type MenuContentProps = Omit<DropdownMenuPrimitive.DropdownMenuContentProps, 'children' | 'side'> & {\n    align?: Align;\n    children: React.ReactNode;\n    /** Set the position of the Menu relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\n\nexport const Content = React.forwardRef(function MenuContent(props: MenuContentProps, ref: React.Ref<HTMLDivElement>) {\n    const internalRef = useMergedRef<any>(ref);\n    const menu = useCurrentMenu();\n    const { align = 'start', children, placement: side, ...otherProps } = props;\n    const className = cn('border border-transparent rounded block outline-none p-1 yt-shadow wcag-white', props.className);\n\n    return (\n        <DropdownMenuPrimitive.Portal>\n            <DropdownMenuPrimitive.Content\n                {...otherProps}\n                align={align}\n                className={className}\n                data-taco=\"menu\"\n                side={side}\n                sideOffset={3}\n                style={{ minWidth: menu?.minWidth }}\n                ref={internalRef}>\n                {children}\n            </DropdownMenuPrimitive.Content>\n        </DropdownMenuPrimitive.Portal>\n    );\n});\n"],"names":["Content","React","MenuContent","props","ref","internalRef","useMergedRef","menu","useCurrentMenu","align","children","placement","side","otherProps","className","cn","DropdownMenuPrimitive","sideOffset","style","minWidth"],"mappings":";;;;;;MAcaA,OAAO,gBAAGC,UAAgB,CAAC,SAASC,WAAW,CAACC,KAAuB,EAAEC,GAA8B;EAChH,MAAMC,WAAW,GAAGC,YAAY,CAAMF,GAAG,CAAC;EAC1C,MAAMG,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAM;IAAEC,KAAK,GAAG,OAAO;IAAEC,QAAQ;IAAEC,SAAS,EAAEC,IAAI;IAAE,GAAGC;GAAY,GAAGV,KAAK;EAC3E,MAAMW,SAAS,GAAGC,EAAE,CAAC,+EAA+E,EAAEZ,KAAK,CAACW,SAAS,CAAC;EAEtH,oBACIb,cAACe,MAA4B,qBACzBf,cAACe,SAA6B,oBACtBH,UAAU;IACdJ,KAAK,EAAEA,KAAK;IACZK,SAAS,EAAEA,SAAS;iBACV,MAAM;IAChBF,IAAI,EAAEA,IAAI;IACVK,UAAU,EAAE,CAAC;IACbC,KAAK,EAAE;MAAEC,QAAQ,EAAEZ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEY;KAAU;IACnCf,GAAG,EAAEC;MACJK,QAAQ,CACmB,CACL;AAEvC,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Menu/components/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../../../../../src/components/Menu/components/Header.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport cn from 'classnames';\r\nimport { useCurrentMenu } from '../Context';\r\n\r\nexport type MenuHeaderProps = React.HTMLAttributes<HTMLDivElement>;\r\n\r\nexport const Header = React.forwardRef<HTMLDivElement, MenuHeaderProps>(function MenuHeader(props, ref) {\r\n    const menu = useCurrentMenu();\r\n    const className = cn(\r\n        'flex items-center justify-start h-7 pr-1.5 text-xs text-grey-darkest',\r\n        {\r\n            'pl-7': menu?.indented,\r\n            'pl-1.5': !menu?.indented,\r\n        },\r\n        props.className\r\n    );\r\n\r\n    return <DropdownMenuPrimitive.Label {...props} className={className} ref={ref} />;\r\n});\r\n"],"names":["Header","React","MenuHeader","props","ref","menu","useCurrentMenu","className","cn","indented","DropdownMenuPrimitive"],"mappings":";;;;;MAOaA,MAAM,gBAAGC,UAAgB,CAAkC,SAASC,UAAU,CAACC,KAAK,EAAEC,GAAG;EAClG,MAAMC,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMC,SAAS,GAAGC,EAAE,CAChB,sEAAsE,EACtE;IACI,MAAM,EAAEH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEI,QAAQ;IACtB,QAAQ,EAAE,EAACJ,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEI,QAAQ;GAC5B,EACDN,KAAK,CAACI,SAAS,CAClB;EAED,oBAAON,cAACS,KAA2B,oBAAKP,KAAK;IAAEI,SAAS,EAAEA,SAAS;IAAEH,GAAG,EAAEA;KAAO;AACrF,CAAC;;;;"}
+{"version":3,"file":"Header.js","sources":["../../../../../../../../src/components/Menu/components/Header.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { useCurrentMenu } from '../Context';\n\nexport type MenuHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const Header = React.forwardRef<HTMLDivElement, MenuHeaderProps>(function MenuHeader(props, ref) {\n    const menu = useCurrentMenu();\n    const className = cn(\n        'flex items-center justify-start h-7 pr-1.5 text-xs text-grey-darkest',\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n        },\n        props.className\n    );\n\n    return <DropdownMenuPrimitive.Label {...props} className={className} ref={ref} />;\n});\n"],"names":["Header","React","MenuHeader","props","ref","menu","useCurrentMenu","className","cn","indented","DropdownMenuPrimitive"],"mappings":";;;;;MAOaA,MAAM,gBAAGC,UAAgB,CAAkC,SAASC,UAAU,CAACC,KAAK,EAAEC,GAAG;EAClG,MAAMC,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMC,SAAS,GAAGC,EAAE,CAChB,sEAAsE,EACtE;IACI,MAAM,EAAEH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEI,QAAQ;IACtB,QAAQ,EAAE,EAACJ,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEI,QAAQ;GAC5B,EACDN,KAAK,CAACI,SAAS,CAClB;EAED,oBAAON,cAACS,KAA2B,oBAAKP,KAAK;IAAEI,SAAS,EAAEA,SAAS;IAAEH,GAAG,EAAEA;KAAO;AACrF,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Menu/components/Item.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.js","sources":["../../../../../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport cn from 'classnames';\r\nimport { IconName } from '../../Icon/Icon';\r\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\r\nimport { useCurrentMenu } from '../Context';\r\nimport { DialogProps } from '../../Dialog/Dialog';\r\n\r\nexport const Icon = ({ name }) => (\r\n    <span className=\"absolute left-0 ml-1\">\r\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\r\n    </span>\r\n);\r\n\r\nexport const useItemStyling = ({ disabled, indented, className }) => {\r\n    const menu = useCurrentMenu();\r\n\r\n    React.useEffect(() => {\r\n        if (indented && !menu?.indented) {\r\n            menu?.registerIndentation();\r\n        }\r\n    }, [indented]);\r\n\r\n    return cn(\r\n        'flex items-center justify-start h-8 pr-1.5 relative rounded w-full focus:outline-none group',\r\n        {\r\n            'pl-7': menu?.indented,\r\n            'pl-1.5': !menu?.indented,\r\n            'cursor-pointer hover:bg-grey-light text-black hover:text-black': !disabled,\r\n            'cursor-not-allowed hover:bg-white text-grey-dark': disabled,\r\n        },\r\n        className\r\n    );\r\n};\r\n\r\nexport const Shortcut = props => {\r\n    return <span {...props} className=\"text-grey-darkest ml-auto pl-3\" />;\r\n};\r\n\r\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\r\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\r\n    disabled?: boolean;\r\n    icon?: IconName;\r\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\r\n    shortcut?: string;\r\n};\r\n\r\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\r\n    const { dialog, icon, onClick, shortcut, ...otherProps } = props;\r\n    const menu = useCurrentMenu();\r\n    const className = useItemStyling({\r\n        disabled: props.disabled,\r\n        indented: !!icon,\r\n        className: props.className,\r\n    });\r\n\r\n    const disabled = props.disabled ?? props['aria-disabled'];\r\n\r\n    let handleClick;\r\n\r\n    // radix has a bug that does not disable clicks when disabled is set on items\r\n    if (disabled) {\r\n        handleClick = event => {\r\n            event.preventDefault();\r\n            event.stopPropagation();\r\n        };\r\n    }\r\n\r\n    const handleSelect = event => {\r\n        if (onClick) {\r\n            onClick(event);\r\n        }\r\n\r\n        if (props['aria-haspopup'] || typeof dialog === 'function') {\r\n            event.preventDefault();\r\n        }\r\n    };\r\n\r\n    let button = (\r\n        <DropdownMenuPrimitive.Item {...otherProps} className={className} onClick={handleClick} onSelect={handleSelect} ref={ref}>\r\n            {icon && <Icon name={icon} />}\r\n            {props.children}\r\n            {shortcut && <Shortcut>{shortcut}</Shortcut>}\r\n        </DropdownMenuPrimitive.Item>\r\n    );\r\n\r\n    if (typeof dialog === 'function') {\r\n        button = dialog({ trigger: button, onClose: menu?.close });\r\n    }\r\n\r\n    return button;\r\n});\r\n"],"names":["Icon","name","React","className","IconPrimitive","useItemStyling","disabled","indented","menu","useCurrentMenu","registerIndentation","cn","Shortcut","props","Item","MenuItem","ref","dialog","icon","onClick","shortcut","otherProps","handleClick","event","preventDefault","stopPropagation","handleSelect","button","DropdownMenuPrimitive","onSelect","children","trigger","onClose","close"],"mappings":";;;;;;MAQaA,IAAI,GAAG,CAAC;EAAEC;CAAM,kBACzBC;EAAMC,SAAS,EAAC;gBACZD,cAACE,MAAa;EAACD,SAAS,EAAC,yBAAyB;EAACF,IAAI,EAAEA;EAAQ;MAI5DI,cAAc,GAAG,CAAC;EAAEC,QAAQ;EAAEC,QAAQ;EAAEJ;CAAW;EAC5D,MAAMK,IAAI,GAAGC,cAAc,EAAE;EAE7BP,SAAe,CAAC;IACZ,IAAIK,QAAQ,IAAI,EAACC,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAED,QAAQ,GAAE;MAC7BC,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,mBAAmB,EAAE;;GAElC,EAAE,CAACH,QAAQ,CAAC,CAAC;EAEd,OAAOI,EAAE,CACL,6FAA6F,EAC7F;IACI,MAAM,EAAEH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAED,QAAQ;IACtB,QAAQ,EAAE,EAACC,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAED,QAAQ;IACzB,gEAAgE,EAAE,CAACD,QAAQ;IAC3E,kDAAkD,EAAEA;GACvD,EACDH,SAAS,CACZ;AACL;MAEaS,QAAQ,GAAGC,KAAK;EACzB,oBAAOX,wCAAUW,KAAK;IAAEV,SAAS,EAAC;KAAmC;AACzE;MAUaW,IAAI,gBAAGZ,UAAgB,CAAC,SAASa,QAAQ,CAACF,KAAoB,EAAEG,GAA8B;;EACvG,MAAM;IAAEC,MAAM;IAAEC,IAAI;IAAEC,OAAO;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGR,KAAK;EAChE,MAAML,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMN,SAAS,GAAGE,cAAc,CAAC;IAC7BC,QAAQ,EAAEO,KAAK,CAACP,QAAQ;IACxBC,QAAQ,EAAE,CAAC,CAACW,IAAI;IAChBf,SAAS,EAAEU,KAAK,CAACV;GACpB,CAAC;EAEF,MAAMG,QAAQ,sBAAGO,KAAK,CAACP,QAAQ,6DAAIO,KAAK,CAAC,eAAe,CAAC;EAEzD,IAAIS,WAAW;;EAGf,IAAIhB,QAAQ,EAAE;IACVgB,WAAW,GAAGC,KAAK;MACfA,KAAK,CAACC,cAAc,EAAE;MACtBD,KAAK,CAACE,eAAe,EAAE;KAC1B;;EAGL,MAAMC,YAAY,GAAGH,KAAK;IACtB,IAAIJ,OAAO,EAAE;MACTA,OAAO,CAACI,KAAK,CAAC;;IAGlB,IAAIV,KAAK,CAAC,eAAe,CAAC,IAAI,OAAOI,MAAM,KAAK,UAAU,EAAE;MACxDM,KAAK,CAACC,cAAc,EAAE;;GAE7B;EAED,IAAIG,MAAM,gBACNzB,cAAC0B,MAA0B,oBAAKP,UAAU;IAAElB,SAAS,EAAEA,SAAS;IAAEgB,OAAO,EAAEG,WAAW;IAAEO,QAAQ,EAAEH,YAAY;IAAEV,GAAG,EAAEA;MAChHE,IAAI,iBAAIhB,cAACF,IAAI;IAACC,IAAI,EAAEiB;IAAQ,EAC5BL,KAAK,CAACiB,QAAQ,EACdV,QAAQ,iBAAIlB,cAACU,QAAQ,QAAEQ,QAAQ,CAAY,CAEnD;EAED,IAAI,OAAOH,MAAM,KAAK,UAAU,EAAE;IAC9BU,MAAM,GAAGV,MAAM,CAAC;MAAEc,OAAO,EAAEJ,MAAM;MAAEK,OAAO,EAAExB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEyB;KAAO,CAAC;;EAG9D,OAAON,MAAM;AACjB,CAAC;;;;"}
+{"version":3,"file":"Item.js","sources":["../../../../../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { useCurrentMenu } from '../Context';\nimport { DialogProps } from '../../Dialog/Dialog';\n\nexport const Icon = ({ name }) => (\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nexport const useItemStyling = ({ disabled, indented, className }) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'flex items-center justify-start h-8 pr-1.5 relative rounded w-full focus:outline-none group',\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            'cursor-pointer hover:bg-grey-light text-black hover:text-black': !disabled,\n            'cursor-not-allowed hover:bg-white text-grey-dark': disabled,\n        },\n        className\n    );\n};\n\nexport const Shortcut = props => {\n    return <span {...props} className=\"text-grey-darkest ml-auto pl-3\" />;\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, ...otherProps } = props;\n    const menu = useCurrentMenu();\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    const disabled = props.disabled ?? props['aria-disabled'];\n\n    let handleClick;\n\n    // radix has a bug that does not disable clicks when disabled is set on items\n    if (disabled) {\n        handleClick = event => {\n            event.preventDefault();\n            event.stopPropagation();\n        };\n    }\n\n    const handleSelect = event => {\n        if (onClick) {\n            onClick(event);\n        }\n\n        if (props['aria-haspopup'] || typeof dialog === 'function') {\n            event.preventDefault();\n        }\n    };\n\n    let button = (\n        <DropdownMenuPrimitive.Item {...otherProps} className={className} onClick={handleClick} onSelect={handleSelect} ref={ref}>\n            {icon && <Icon name={icon} />}\n            {props.children}\n            {shortcut && <Shortcut>{shortcut}</Shortcut>}\n        </DropdownMenuPrimitive.Item>\n    );\n\n    if (typeof dialog === 'function') {\n        button = dialog({ trigger: button, onClose: menu?.close });\n    }\n\n    return button;\n});\n"],"names":["Icon","name","React","className","IconPrimitive","useItemStyling","disabled","indented","menu","useCurrentMenu","registerIndentation","cn","Shortcut","props","Item","MenuItem","ref","dialog","icon","onClick","shortcut","otherProps","handleClick","event","preventDefault","stopPropagation","handleSelect","button","DropdownMenuPrimitive","onSelect","children","trigger","onClose","close"],"mappings":";;;;;;MAQaA,IAAI,GAAG,CAAC;EAAEC;CAAM,kBACzBC;EAAMC,SAAS,EAAC;gBACZD,cAACE,MAAa;EAACD,SAAS,EAAC,yBAAyB;EAACF,IAAI,EAAEA;EAAQ;MAI5DI,cAAc,GAAG,CAAC;EAAEC,QAAQ;EAAEC,QAAQ;EAAEJ;CAAW;EAC5D,MAAMK,IAAI,GAAGC,cAAc,EAAE;EAE7BP,SAAe,CAAC;IACZ,IAAIK,QAAQ,IAAI,EAACC,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAED,QAAQ,GAAE;MAC7BC,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEE,mBAAmB,EAAE;;GAElC,EAAE,CAACH,QAAQ,CAAC,CAAC;EAEd,OAAOI,EAAE,CACL,6FAA6F,EAC7F;IACI,MAAM,EAAEH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAED,QAAQ;IACtB,QAAQ,EAAE,EAACC,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAED,QAAQ;IACzB,gEAAgE,EAAE,CAACD,QAAQ;IAC3E,kDAAkD,EAAEA;GACvD,EACDH,SAAS,CACZ;AACL;MAEaS,QAAQ,GAAGC,KAAK;EACzB,oBAAOX,wCAAUW,KAAK;IAAEV,SAAS,EAAC;KAAmC;AACzE;MAUaW,IAAI,gBAAGZ,UAAgB,CAAC,SAASa,QAAQ,CAACF,KAAoB,EAAEG,GAA8B;;EACvG,MAAM;IAAEC,MAAM;IAAEC,IAAI;IAAEC,OAAO;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGR,KAAK;EAChE,MAAML,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMN,SAAS,GAAGE,cAAc,CAAC;IAC7BC,QAAQ,EAAEO,KAAK,CAACP,QAAQ;IACxBC,QAAQ,EAAE,CAAC,CAACW,IAAI;IAChBf,SAAS,EAAEU,KAAK,CAACV;GACpB,CAAC;EAEF,MAAMG,QAAQ,sBAAGO,KAAK,CAACP,QAAQ,6DAAIO,KAAK,CAAC,eAAe,CAAC;EAEzD,IAAIS,WAAW;;EAGf,IAAIhB,QAAQ,EAAE;IACVgB,WAAW,GAAGC,KAAK;MACfA,KAAK,CAACC,cAAc,EAAE;MACtBD,KAAK,CAACE,eAAe,EAAE;KAC1B;;EAGL,MAAMC,YAAY,GAAGH,KAAK;IACtB,IAAIJ,OAAO,EAAE;MACTA,OAAO,CAACI,KAAK,CAAC;;IAGlB,IAAIV,KAAK,CAAC,eAAe,CAAC,IAAI,OAAOI,MAAM,KAAK,UAAU,EAAE;MACxDM,KAAK,CAACC,cAAc,EAAE;;GAE7B;EAED,IAAIG,MAAM,gBACNzB,cAAC0B,MAA0B,oBAAKP,UAAU;IAAElB,SAAS,EAAEA,SAAS;IAAEgB,OAAO,EAAEG,WAAW;IAAEO,QAAQ,EAAEH,YAAY;IAAEV,GAAG,EAAEA;MAChHE,IAAI,iBAAIhB,cAACF,IAAI;IAACC,IAAI,EAAEiB;IAAQ,EAC5BL,KAAK,CAACiB,QAAQ,EACdV,QAAQ,iBAAIlB,cAACU,QAAQ,QAAEQ,QAAQ,CAAY,CAEnD;EAED,IAAI,OAAOH,MAAM,KAAK,UAAU,EAAE;IAC9BU,MAAM,GAAGV,MAAM,CAAC;MAAEc,OAAO,EAAEJ,MAAM;MAAEK,OAAO,EAAExB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEyB;KAAO,CAAC;;EAG9D,OAAON,MAAM;AACjB,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Menu/components/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../../../../../../src/components/Menu/components/RadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport cn from 'classnames';\r\nimport { getRadioGroupItemValueAsString, RadioGroupItemProps, RadioGroupProps, useRadioGroup } from '../../RadioGroup/RadioGroup';\r\nimport { useItemStyling } from './Item';\r\n\r\nexport type MenuRadioGroupItemProps = RadioGroupItemProps<HTMLDivElement>;\r\n\r\nexport const RadioItem = (props: MenuRadioGroupItemProps) => {\r\n    const context = React.useContext(MenuRadioGroupContext);\r\n    const { children, value, ...otherProps } = props;\r\n    const disabled = context.disabled || props.disabled;\r\n    const className = useItemStyling({\r\n        disabled: disabled,\r\n        indented: true,\r\n        className: props.className,\r\n    });\r\n\r\n    return (\r\n        <DropdownMenuPrimitive.RadioItem\r\n            {...otherProps}\r\n            className={className}\r\n            disabled={disabled}\r\n            value={getRadioGroupItemValueAsString(value)}>\r\n            <DropdownMenuPrimitive.ItemIndicator className=\"absolute left-0 ml-1.5\">\r\n                <span className=\"ml-1 flex h-1.5 w-1.5 rounded-full bg-current \" />\r\n            </DropdownMenuPrimitive.ItemIndicator>\r\n            {children}\r\n        </DropdownMenuPrimitive.RadioItem>\r\n    );\r\n};\r\n\r\nconst MenuRadioGroupContext = React.createContext({ disabled: false });\r\n\r\nexport type MenuRadioGroupProps = RadioGroupProps;\r\n\r\nexport type ForwardedMenuRadioGroupWithStatics = React.ForwardRefExoticComponent<\r\n    MenuRadioGroupProps & React.RefAttributes<HTMLElement>\r\n> & {\r\n    Item: React.FunctionComponent<MenuRadioGroupItemProps>;\r\n};\r\n\r\nexport const RadioGroup = React.forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioItem(props, ref) {\r\n    const { context, props: otherProps } = useRadioGroup(props);\r\n    const className = cn('flex flex-col', props.className);\r\n\r\n    return (\r\n        <MenuRadioGroupContext.Provider value={context}>\r\n            <DropdownMenuPrimitive.RadioGroup {...otherProps} className={className} ref={ref} />\r\n        </MenuRadioGroupContext.Provider>\r\n    );\r\n}) as ForwardedMenuRadioGroupWithStatics;\r\nRadioGroup.Item = RadioItem;\r\n"],"names":["RadioItem","props","context","React","MenuRadioGroupContext","children","value","otherProps","disabled","className","useItemStyling","indented","DropdownMenuPrimitive","getRadioGroupItemValueAsString","RadioGroup","MenuRadioItem","ref","useRadioGroup","cn","Provider","Item"],"mappings":";;;;;;MAQaA,SAAS,GAAIC,KAA8B;EACpD,MAAMC,OAAO,GAAGC,UAAgB,CAACC,qBAAqB,CAAC;EACvD,MAAM;IAAEC,QAAQ;IAAEC,KAAK;IAAE,GAAGC;GAAY,GAAGN,KAAK;EAChD,MAAMO,QAAQ,GAAGN,OAAO,CAACM,QAAQ,IAAIP,KAAK,CAACO,QAAQ;EACnD,MAAMC,SAAS,GAAGC,cAAc,CAAC;IAC7BF,QAAQ,EAAEA,QAAQ;IAClBG,QAAQ,EAAE,IAAI;IACdF,SAAS,EAAER,KAAK,CAACQ;GACpB,CAAC;EAEF,oBACIN,cAACS,WAA+B,oBACxBL,UAAU;IACdE,SAAS,EAAEA,SAAS;IACpBD,QAAQ,EAAEA,QAAQ;IAClBF,KAAK,EAAEO,8BAA8B,CAACP,KAAK;mBAC3CH,cAACS,aAAmC;IAACH,SAAS,EAAC;kBAC3CN;IAAMM,SAAS,EAAC;IAAmD,CACjC,EACrCJ,QAAQ,CACqB;AAE1C;AAEA,MAAMD,qBAAqB,gBAAGD,aAAmB,CAAC;EAAEK,QAAQ,EAAE;CAAO,CAAC;MAUzDM,UAAU,gBAAGX,UAAgB,CAAsC,SAASY,aAAa,CAACd,KAAK,EAAEe,GAAG;EAC7G,MAAM;IAAEd,OAAO;IAAED,KAAK,EAAEM;GAAY,GAAGU,aAAa,CAAChB,KAAK,CAAC;EAC3D,MAAMQ,SAAS,GAAGS,EAAE,CAAC,eAAe,EAAEjB,KAAK,CAACQ,SAAS,CAAC;EAEtD,oBACIN,cAACC,qBAAqB,CAACe,QAAQ;IAACb,KAAK,EAAEJ;kBACnCC,cAACS,YAAgC,oBAAKL,UAAU;IAAEE,SAAS,EAAEA,SAAS;IAAEO,GAAG,EAAEA;KAAO,CACvD;AAEzC,CAAC;AACDF,UAAU,CAACM,IAAI,GAAGpB,SAAS;;;;"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../../../../../../src/components/Menu/components/RadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { getRadioGroupItemValueAsString, RadioGroupItemProps, RadioGroupProps, useRadioGroup } from '../../RadioGroup/RadioGroup';\nimport { useItemStyling } from './Item';\n\nexport type MenuRadioGroupItemProps = RadioGroupItemProps<HTMLDivElement>;\n\nexport const RadioItem = (props: MenuRadioGroupItemProps) => {\n    const context = React.useContext(MenuRadioGroupContext);\n    const { children, value, ...otherProps } = props;\n    const disabled = context.disabled || props.disabled;\n    const className = useItemStyling({\n        disabled: disabled,\n        indented: true,\n        className: props.className,\n    });\n\n    return (\n        <DropdownMenuPrimitive.RadioItem\n            {...otherProps}\n            className={className}\n            disabled={disabled}\n            value={getRadioGroupItemValueAsString(value)}>\n            <DropdownMenuPrimitive.ItemIndicator className=\"absolute left-0 ml-1.5\">\n                <span className=\"ml-1 flex h-1.5 w-1.5 rounded-full bg-current \" />\n            </DropdownMenuPrimitive.ItemIndicator>\n            {children}\n        </DropdownMenuPrimitive.RadioItem>\n    );\n};\n\nconst MenuRadioGroupContext = React.createContext({ disabled: false });\n\nexport type MenuRadioGroupProps = RadioGroupProps;\n\nexport type ForwardedMenuRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    MenuRadioGroupProps & React.RefAttributes<HTMLElement>\n> & {\n    Item: React.FunctionComponent<MenuRadioGroupItemProps>;\n};\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioItem(props, ref) {\n    const { context, props: otherProps } = useRadioGroup(props);\n    const className = cn('flex flex-col', props.className);\n\n    return (\n        <MenuRadioGroupContext.Provider value={context}>\n            <DropdownMenuPrimitive.RadioGroup {...otherProps} className={className} ref={ref} />\n        </MenuRadioGroupContext.Provider>\n    );\n}) as ForwardedMenuRadioGroupWithStatics;\nRadioGroup.Item = RadioItem;\n"],"names":["RadioItem","props","context","React","MenuRadioGroupContext","children","value","otherProps","disabled","className","useItemStyling","indented","DropdownMenuPrimitive","getRadioGroupItemValueAsString","RadioGroup","MenuRadioItem","ref","useRadioGroup","cn","Provider","Item"],"mappings":";;;;;;MAQaA,SAAS,GAAIC,KAA8B;EACpD,MAAMC,OAAO,GAAGC,UAAgB,CAACC,qBAAqB,CAAC;EACvD,MAAM;IAAEC,QAAQ;IAAEC,KAAK;IAAE,GAAGC;GAAY,GAAGN,KAAK;EAChD,MAAMO,QAAQ,GAAGN,OAAO,CAACM,QAAQ,IAAIP,KAAK,CAACO,QAAQ;EACnD,MAAMC,SAAS,GAAGC,cAAc,CAAC;IAC7BF,QAAQ,EAAEA,QAAQ;IAClBG,QAAQ,EAAE,IAAI;IACdF,SAAS,EAAER,KAAK,CAACQ;GACpB,CAAC;EAEF,oBACIN,cAACS,WAA+B,oBACxBL,UAAU;IACdE,SAAS,EAAEA,SAAS;IACpBD,QAAQ,EAAEA,QAAQ;IAClBF,KAAK,EAAEO,8BAA8B,CAACP,KAAK;mBAC3CH,cAACS,aAAmC;IAACH,SAAS,EAAC;kBAC3CN;IAAMM,SAAS,EAAC;IAAmD,CACjC,EACrCJ,QAAQ,CACqB;AAE1C;AAEA,MAAMD,qBAAqB,gBAAGD,aAAmB,CAAC;EAAEK,QAAQ,EAAE;CAAO,CAAC;MAUzDM,UAAU,gBAAGX,UAAgB,CAAsC,SAASY,aAAa,CAACd,KAAK,EAAEe,GAAG;EAC7G,MAAM;IAAEd,OAAO;IAAED,KAAK,EAAEM;GAAY,GAAGU,aAAa,CAAChB,KAAK,CAAC;EAC3D,MAAMQ,SAAS,GAAGS,EAAE,CAAC,eAAe,EAAEjB,KAAK,CAACQ,SAAS,CAAC;EAEtD,oBACIN,cAACC,qBAAqB,CAACe,QAAQ;IAACb,KAAK,EAAEJ;kBACnCC,cAACS,YAAgC,oBAAKL,UAAU;IAAEE,SAAS,EAAEA,SAAS;IAAEO,GAAG,EAAEA;KAAO,CACvD;AAEzC,CAAC;AACDF,UAAU,CAACM,IAAI,GAAGpB,SAAS;;;;"}

package/dist/esm/packages/taco/src/components/Menu/components/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.js","sources":["../../../../../../../../src/components/Menu/components/Trigger.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\r\nimport { useMergedRef } from '../../../hooks/useMergedRef';\r\nimport { useCurrentMenu } from '../Context';\r\n\r\nexport type MenuTriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children'> & {\r\n    children: React.ReactElement;\r\n};\r\n\r\nexport const Trigger = React.forwardRef(function MenuTrigger(props: MenuTriggerProps, ref: React.Ref<HTMLButtonElement>) {\r\n    const menu = useCurrentMenu();\r\n    const internalRef = useMergedRef<HTMLButtonElement>(ref);\r\n\r\n    React.useEffect(() => {\r\n        if (internalRef.current) {\r\n            menu?.setMinWidth(internalRef.current.getBoundingClientRect().width);\r\n        }\r\n    }, [internalRef]);\r\n\r\n    return <DropdownMenuPrimitive.Trigger {...props} asChild ref={internalRef} />;\r\n});\r\n"],"names":["Trigger","React","MenuTrigger","props","ref","menu","useCurrentMenu","internalRef","useMergedRef","current","setMinWidth","getBoundingClientRect","width","DropdownMenuPrimitive","asChild"],"mappings":";;;;;MASaA,OAAO,gBAAGC,UAAgB,CAAC,SAASC,WAAW,CAACC,KAAuB,EAAEC,GAAiC;EACnH,MAAMC,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMC,WAAW,GAAGC,YAAY,CAAoBJ,GAAG,CAAC;EAExDH,SAAe,CAAC;IACZ,IAAIM,WAAW,CAACE,OAAO,EAAE;MACrBJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK,WAAW,CAACH,WAAW,CAACE,OAAO,CAACE,qBAAqB,EAAE,CAACC,KAAK,CAAC;;GAE3E,EAAE,CAACL,WAAW,CAAC,CAAC;EAEjB,oBAAON,cAACY,SAA6B,oBAAKV,KAAK;IAAEW,OAAO;IAACV,GAAG,EAAEG;KAAe;AACjF,CAAC;;;;"}
+{"version":3,"file":"Trigger.js","sources":["../../../../../../../../src/components/Menu/components/Trigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useCurrentMenu } from '../Context';\n\nexport type MenuTriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children'> & {\n    children: React.ReactElement;\n};\n\nexport const Trigger = React.forwardRef(function MenuTrigger(props: MenuTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n    const menu = useCurrentMenu();\n    const internalRef = useMergedRef<HTMLButtonElement>(ref);\n\n    React.useEffect(() => {\n        if (internalRef.current) {\n            menu?.setMinWidth(internalRef.current.getBoundingClientRect().width);\n        }\n    }, [internalRef]);\n\n    return <DropdownMenuPrimitive.Trigger {...props} asChild ref={internalRef} />;\n});\n"],"names":["Trigger","React","MenuTrigger","props","ref","menu","useCurrentMenu","internalRef","useMergedRef","current","setMinWidth","getBoundingClientRect","width","DropdownMenuPrimitive","asChild"],"mappings":";;;;;MASaA,OAAO,gBAAGC,UAAgB,CAAC,SAASC,WAAW,CAACC,KAAuB,EAAEC,GAAiC;EACnH,MAAMC,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMC,WAAW,GAAGC,YAAY,CAAoBJ,GAAG,CAAC;EAExDH,SAAe,CAAC;IACZ,IAAIM,WAAW,CAACE,OAAO,EAAE;MACrBJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK,WAAW,CAACH,WAAW,CAACE,OAAO,CAACE,qBAAqB,EAAE,CAACC,KAAK,CAAC;;GAE3E,EAAE,CAACL,WAAW,CAAC,CAAC;EAEjB,oBAAON,cAACY,SAA6B,oBAAKV,KAAK;IAAEW,OAAO;IAACV,GAAG,EAAEG;KAAe;AACjF,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Navigation/Navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sources":["../../../../../../../src/components/Navigation/Navigation.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport { TreeviewProps, Treeview, TreeviewGroupProps, TreeviewItemProps } from '../Treeview/Treeview';\r\nimport { Icon } from '../Icon/Icon';\r\nimport { useDropTarget } from '../../utils/hooks/useDropTarget';\r\nimport { useMergedRef } from '../../hooks/useMergedRef';\r\nimport './Navigation.css';\r\n\r\n// Item\r\nexport type NavigationItemProps = Omit<TreeviewItemProps, 'prefix'> & {\r\n    /** Change the style to indicate the link is selected */\r\n    active?: boolean;\r\n    /** Handler to be used when dropping a dragged element over the navigation link */\r\n    onDrop?: React.DragEventHandler;\r\n    /**\r\n     * Small amount of information placed next to the text of the link.\r\n     * This can be any valid react element, for e.g. a `span`.\r\n     * Should be used to indicate a relevant information of the link,\r\n     * for e.g. the number of unread notifications\r\n     */\r\n    postfix?: React.ReactNode;\r\n    /**\r\n     * Small amount of information placed before the text of the link.\r\n     * This can be any valid react element, for e.g. a `span`.\r\n     * Should be used to indicate a feedback for user,\r\n     * for e.g. display some sort of visual informational state or a relevant icon.\r\n     */\r\n    prefix?: React.ReactNode;\r\n    /** Target of the link */\r\n    target?: string;\r\n};\r\n\r\nconst Item = React.forwardRef(function Item(props: NavigationItemProps, ref: React.Ref<HTMLAnchorElement>) {\r\n    const { active, children, onDrop, postfix, prefix, role, ...otherProps } = props;\r\n    const proxyRef = useMergedRef<HTMLAnchorElement>(ref);\r\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\r\n    const isTreeitem = role === 'treeitem';\r\n    const className = cn(\r\n        'yt-navigation__item cursor-pointer',\r\n        {\r\n            'w-full mb-px py-1 px-3 flex items-center hover:bg-grey-dark': isTreeitem,\r\n            'bg-white w-full h-10 px-3 flex-shrink-0 flex items-center justify-between cursor-pointer': !isTreeitem,\r\n            'yt-navigation__item--active': active && !isDraggedOver,\r\n            'bg-grey-dark': isTreeitem && active && !isDraggedOver,\r\n            'yt-navigation__item--dropping bg-blue': isDraggedOver,\r\n        },\r\n        props.className\r\n    );\r\n\r\n    const handleClick = (event: React.MouseEvent<HTMLSpanElement>): void => {\r\n        if (event.target instanceof HTMLAnchorElement || event.target instanceof HTMLButtonElement) {\r\n            return;\r\n        }\r\n\r\n        if (proxyRef.current) {\r\n            proxyRef.current.click();\r\n        }\r\n    };\r\n\r\n    return (\r\n        <span {...dropTargetProps} className={className} onClick={handleClick} role={role}>\r\n            {prefix && <span className=\"yt-navigation__item__prefix flex items-center\">{prefix}</span>}\r\n            <a {...otherProps} className=\"block flex-grow truncate\" ref={proxyRef}>\r\n                {children}\r\n            </a>\r\n            {postfix && <span className=\"yt-navigation__item__postfix ml-1\">{postfix}</span>}\r\n        </span>\r\n    );\r\n});\r\n\r\n// Panel\r\nexport type NavigationPanelProps = React.HTMLAttributes<HTMLDivElement>;\r\n\r\nconst Panel = React.forwardRef(function Panel(props: NavigationPanelProps, ref: React.Ref<HTMLDivElement>) {\r\n    return <div {...props} className={cn('w-full bg-white p-3', props.className)} ref={ref} />;\r\n});\r\n\r\n// Group\r\nexport type NavigationMenuGroupProps = TreeviewGroupProps;\r\n\r\nconst MenuGroup = React.forwardRef(function MenuGroup(props: NavigationMenuGroupProps, ref: React.Ref<HTMLDivElement>) {\r\n    const className = cn(\r\n        'flex-shrink-0 space-y-1 outline-none',\r\n        {\r\n            'bg-white pb-2': props.fixed,\r\n        },\r\n        typeof props.className === 'function' ? props.className(false) : props.className\r\n    );\r\n    const title = (expanded: boolean): JSX.Element => {\r\n        const className = cn('bg-white h-10 pl-3 pr-1 flex items-center justify-between w-full', {\r\n            'mb-1': expanded,\r\n            'cursor-pointer hover:text-blue': !props.fixed,\r\n        });\r\n\r\n        return (\r\n            <span className={className}>\r\n                {typeof props.title === 'function' ? props.title(expanded) : props.title}\r\n                {!props.fixed && <Icon name={expanded ? 'chevron-up' : 'chevron-down'} />}\r\n            </span>\r\n        );\r\n    };\r\n\r\n    return <Treeview.Group {...props} className={className} title={title} ref={ref} />;\r\n});\r\n\r\n// Menu\r\nexport type NavigationMenuProps = React.PropsWithChildren<TreeviewProps>;\r\n\r\nexport type ForwardedNavigationMenuWithStatics = React.ForwardRefExoticComponent<\r\n    NavigationMenuProps & React.RefAttributes<HTMLDivElement>\r\n> & {\r\n    /** Expandable region reprezenting a group of related links */\r\n    Group: React.ForwardRefExoticComponent<NavigationMenuGroupProps & React.RefAttributes<HTMLDivElement>>;\r\n};\r\n\r\nconst Menu = React.forwardRef(function Menu(props: NavigationMenuProps, ref: React.Ref<HTMLDivElement>) {\r\n    const scrollableAreas = React.useMemo(() => {\r\n        const scrollableAreas: any[] = [];\r\n\r\n        const children = React.Children.toArray(props.children).filter(\r\n            child => !!child\r\n        ) as React.ReactElement<NavigationMenuGroupProps>[];\r\n\r\n        children.forEach(child => {\r\n            if (child.props.fixed) {\r\n                scrollableAreas.push(child);\r\n            } else {\r\n                const x = scrollableAreas[scrollableAreas.length - 1];\r\n                if (Array.isArray(x)) {\r\n                    x.push(child);\r\n                } else {\r\n                    scrollableAreas.push([child]);\r\n                }\r\n            }\r\n        });\r\n\r\n        return scrollableAreas;\r\n    }, [props.children]);\r\n\r\n    return (\r\n        <Treeview\r\n            {...props}\r\n            className={cn('divide-grey-light flex flex-grow flex-col divide-y-2 overflow-y-auto', props.className)}\r\n            ref={ref}>\r\n            {scrollableAreas.map((area, i) =>\r\n                Array.isArray(area) ? (\r\n                    <div\r\n                        className=\"divide-grey-light flex h-0 flex-auto flex-shrink-0 flex-grow flex-col divide-y-2 overflow-y-auto\"\r\n                        key={i}>\r\n                        {area}\r\n                    </div>\r\n                ) : (\r\n                    area\r\n                )\r\n            )}\r\n        </Treeview>\r\n    );\r\n}) as ForwardedNavigationMenuWithStatics;\r\n\r\nMenu.Group = MenuGroup;\r\n\r\n// Navigation\r\nexport type NavigationProps = React.HTMLAttributes<HTMLDivElement>;\r\n\r\nexport type ForwardedNavigationWithStatics = React.ForwardRefExoticComponent<\r\n    NavigationProps & React.RefAttributes<HTMLDivElement>\r\n> & {\r\n    /** Navigation link */\r\n    Item: React.ForwardRefExoticComponent<NavigationItemProps & React.RefAttributes<HTMLAnchorElement>>;\r\n    /**\r\n     * Container for the expandable groups that hold navigation links.\r\n     * Should be used as a direct child of Navigation component, e.g. `Navigation.Menu`.\r\n     * Should have the menu groups as a direct child, e.g. `Navigation.Menu.Group`\r\n     */\r\n    Menu: ForwardedNavigationMenuWithStatics;\r\n    /**\r\n     * Isolated container within the Navigation.\r\n     * This can be used to create a region in the Navigation that is usually not scrollable, nor expandable,\r\n     * containing useful information for user and quick actions\r\n     */\r\n    Panel: React.ForwardRefExoticComponent<NavigationPanelProps & React.RefAttributes<HTMLDivElement>>;\r\n};\r\n\r\nexport const Navigation = React.forwardRef(function Navigation(props: NavigationProps, ref: React.Ref<HTMLDivElement>) {\r\n    const { children, ...otherProps } = props;\r\n    const className = cn('h-full flex flex-col bg-grey-light divide-y-2 divide-grey-light', props.className);\r\n\r\n    return (\r\n        <div {...otherProps} className={className} data-taco=\"navigation\" ref={ref}>\r\n            {children}\r\n        </div>\r\n    );\r\n}) as ForwardedNavigationWithStatics;\r\n\r\nNavigation.Menu = Menu;\r\nNavigation.Item = Item;\r\nNavigation.Panel = Panel;\r\n"],"names":["Item","React","forwardRef","props","ref","active","children","onDrop","postfix","prefix","role","otherProps","proxyRef","useMergedRef","isDraggedOver","dropTargetProps","useDropTarget","isTreeitem","className","cn","handleClick","event","target","HTMLAnchorElement","HTMLButtonElement","current","click","onClick","Panel","MenuGroup","fixed","title","expanded","Icon","name","Treeview","Group","Menu","scrollableAreas","useMemo","Children","toArray","filter","child","forEach","push","x","length","Array","isArray","map","area","i","key","Navigation"],"mappings":"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"}
+{"version":3,"file":"Navigation.js","sources":["../../../../../../../src/components/Navigation/Navigation.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { TreeviewProps, Treeview, TreeviewGroupProps, TreeviewItemProps } from '../Treeview/Treeview';\nimport { Icon } from '../Icon/Icon';\nimport { useDropTarget } from '../../utils/hooks/useDropTarget';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport './Navigation.css';\n\n// Item\nexport type NavigationItemProps = Omit<TreeviewItemProps, 'prefix'> & {\n    /** Change the style to indicate the link is selected */\n    active?: boolean;\n    /** Handler to be used when dropping a dragged element over the navigation link */\n    onDrop?: React.DragEventHandler;\n    /**\n     * Small amount of information placed next to the text of the link.\n     * This can be any valid react element, for e.g. a `span`.\n     * Should be used to indicate a relevant information of the link,\n     * for e.g. the number of unread notifications\n     */\n    postfix?: React.ReactNode;\n    /**\n     * Small amount of information placed before the text of the link.\n     * This can be any valid react element, for e.g. a `span`.\n     * Should be used to indicate a feedback for user,\n     * for e.g. display some sort of visual informational state or a relevant icon.\n     */\n    prefix?: React.ReactNode;\n    /** Target of the link */\n    target?: string;\n};\n\nconst Item = React.forwardRef(function Item(props: NavigationItemProps, ref: React.Ref<HTMLAnchorElement>) {\n    const { active, children, onDrop, postfix, prefix, role, ...otherProps } = props;\n    const proxyRef = useMergedRef<HTMLAnchorElement>(ref);\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n    const isTreeitem = role === 'treeitem';\n    const className = cn(\n        'yt-navigation__item cursor-pointer',\n        {\n            'w-full mb-px py-1 px-3 flex items-center hover:bg-grey-dark': isTreeitem,\n            'bg-white w-full h-10 px-3 flex-shrink-0 flex items-center justify-between cursor-pointer': !isTreeitem,\n            'yt-navigation__item--active': active && !isDraggedOver,\n            'bg-grey-dark': isTreeitem && active && !isDraggedOver,\n            'yt-navigation__item--dropping bg-blue': isDraggedOver,\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLSpanElement>): void => {\n        if (event.target instanceof HTMLAnchorElement || event.target instanceof HTMLButtonElement) {\n            return;\n        }\n\n        if (proxyRef.current) {\n            proxyRef.current.click();\n        }\n    };\n\n    return (\n        <span {...dropTargetProps} className={className} onClick={handleClick} role={role}>\n            {prefix && <span className=\"yt-navigation__item__prefix flex items-center\">{prefix}</span>}\n            <a {...otherProps} className=\"block flex-grow truncate\" ref={proxyRef}>\n                {children}\n            </a>\n            {postfix && <span className=\"yt-navigation__item__postfix ml-1\">{postfix}</span>}\n        </span>\n    );\n});\n\n// Panel\nexport type NavigationPanelProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst Panel = React.forwardRef(function Panel(props: NavigationPanelProps, ref: React.Ref<HTMLDivElement>) {\n    return <div {...props} className={cn('w-full bg-white p-3', props.className)} ref={ref} />;\n});\n\n// Group\nexport type NavigationMenuGroupProps = TreeviewGroupProps;\n\nconst MenuGroup = React.forwardRef(function MenuGroup(props: NavigationMenuGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn(\n        'flex-shrink-0 space-y-1 outline-none',\n        {\n            'bg-white pb-2': props.fixed,\n        },\n        typeof props.className === 'function' ? props.className(false) : props.className\n    );\n    const title = (expanded: boolean): JSX.Element => {\n        const className = cn('bg-white h-10 pl-3 pr-1 flex items-center justify-between w-full', {\n            'mb-1': expanded,\n            'cursor-pointer hover:text-blue': !props.fixed,\n        });\n\n        return (\n            <span className={className}>\n                {typeof props.title === 'function' ? props.title(expanded) : props.title}\n                {!props.fixed && <Icon name={expanded ? 'chevron-up' : 'chevron-down'} />}\n            </span>\n        );\n    };\n\n    return <Treeview.Group {...props} className={className} title={title} ref={ref} />;\n});\n\n// Menu\nexport type NavigationMenuProps = React.PropsWithChildren<TreeviewProps>;\n\nexport type ForwardedNavigationMenuWithStatics = React.ForwardRefExoticComponent<\n    NavigationMenuProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Expandable region reprezenting a group of related links */\n    Group: React.ForwardRefExoticComponent<NavigationMenuGroupProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nconst Menu = React.forwardRef(function Menu(props: NavigationMenuProps, ref: React.Ref<HTMLDivElement>) {\n    const scrollableAreas = React.useMemo(() => {\n        const scrollableAreas: any[] = [];\n\n        const children = React.Children.toArray(props.children).filter(\n            child => !!child\n        ) as React.ReactElement<NavigationMenuGroupProps>[];\n\n        children.forEach(child => {\n            if (child.props.fixed) {\n                scrollableAreas.push(child);\n            } else {\n                const x = scrollableAreas[scrollableAreas.length - 1];\n                if (Array.isArray(x)) {\n                    x.push(child);\n                } else {\n                    scrollableAreas.push([child]);\n                }\n            }\n        });\n\n        return scrollableAreas;\n    }, [props.children]);\n\n    return (\n        <Treeview\n            {...props}\n            className={cn('divide-grey-light flex flex-grow flex-col divide-y-2 overflow-y-auto', props.className)}\n            ref={ref}>\n            {scrollableAreas.map((area, i) =>\n                Array.isArray(area) ? (\n                    <div\n                        className=\"divide-grey-light flex h-0 flex-auto flex-shrink-0 flex-grow flex-col divide-y-2 overflow-y-auto\"\n                        key={i}>\n                        {area}\n                    </div>\n                ) : (\n                    area\n                )\n            )}\n        </Treeview>\n    );\n}) as ForwardedNavigationMenuWithStatics;\n\nMenu.Group = MenuGroup;\n\n// Navigation\nexport type NavigationProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type ForwardedNavigationWithStatics = React.ForwardRefExoticComponent<\n    NavigationProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Navigation link */\n    Item: React.ForwardRefExoticComponent<NavigationItemProps & React.RefAttributes<HTMLAnchorElement>>;\n    /**\n     * Container for the expandable groups that hold navigation links.\n     * Should be used as a direct child of Navigation component, e.g. `Navigation.Menu`.\n     * Should have the menu groups as a direct child, e.g. `Navigation.Menu.Group`\n     */\n    Menu: ForwardedNavigationMenuWithStatics;\n    /**\n     * Isolated container within the Navigation.\n     * This can be used to create a region in the Navigation that is usually not scrollable, nor expandable,\n     * containing useful information for user and quick actions\n     */\n    Panel: React.ForwardRefExoticComponent<NavigationPanelProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Navigation = React.forwardRef(function Navigation(props: NavigationProps, ref: React.Ref<HTMLDivElement>) {\n    const { children, ...otherProps } = props;\n    const className = cn('h-full flex flex-col bg-grey-light divide-y-2 divide-grey-light', props.className);\n\n    return (\n        <div {...otherProps} className={className} data-taco=\"navigation\" ref={ref}>\n            {children}\n        </div>\n    );\n}) as ForwardedNavigationWithStatics;\n\nNavigation.Menu = Menu;\nNavigation.Item = Item;\nNavigation.Panel = Panel;\n"],"names":["Item","React","forwardRef","props","ref","active","children","onDrop","postfix","prefix","role","otherProps","proxyRef","useMergedRef","isDraggedOver","dropTargetProps","useDropTarget","isTreeitem","className","cn","handleClick","event","target","HTMLAnchorElement","HTMLButtonElement","current","click","onClick","Panel","MenuGroup","fixed","title","expanded","Icon","name","Treeview","Group","Menu","scrollableAreas","useMemo","Children","toArray","filter","child","forEach","push","x","length","Array","isArray","map","area","i","key","Navigation"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Pagination/PageNumbers.js

@@ -1,6 +1,6 @@
 import { createElement, Fragment } from 'react';
+import { useLocalization } from '../Provider/Localization.js';
 import { Button } from '../Button/Button.js';
-import { useLocalization } from '../Provider/Provider.js';
 
 const createPageRange = (pageCount, pageNumber) => {
   let lowerLimit = Math.min(pageNumber, pageCount);