@economic/taco 1.14.2 → 1.15.0

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';\nimport { v4 as uuid } from 'uuid';\nimport { ListboxProps } from './Listbox';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\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 = useProxiedRef<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","useProxiedRef","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,7 +1,7 @@
 import { useMemo, useState, useEffect } from 'react';
 import { v4 } from 'uuid';
 import { useLocalization } from '../Provider/Provider.js';
-import { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { getIndexFromValue, getSelectedIndexesFromValue, setInputValueByRef, getActiveDescendant, findByValue } from './util.js';
 import { useTypeahead } from './useTypeahead.js';
 
@@ -23,7 +23,7 @@ const useMultiListbox = ({
     texts
   } = useLocalization();
   const id = useMemo(() => nativeId || v4(), [nativeId]);
-  const inputRef = useProxiedRef(ref);
+  const inputRef = useMergedRef(ref);
   const data = useMemo(() => {
     return [{
       text: texts.listbox.allOption,

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';\nimport { v4 as uuid } from 'uuid';\nimport { useLocalization } from '../Provider/Provider';\nimport { ListboxProps } from './Listbox';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\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 = useProxiedRef<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","useProxiedRef","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/Provider';\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":"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"}

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

@@ -1,11 +1,11 @@
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
-import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../../hooks/useMergedRef.js';
 import { Portal, Content as Content$1 } from '@radix-ui/react-dropdown-menu';
 import { useCurrentMenu } from '../Context.js';
 
 const Content = /*#__PURE__*/forwardRef(function MenuContent(props, ref) {
-  const internalRef = useProxiedRef(ref);
+  const internalRef = useMergedRef(ref);
   const menu = useCurrentMenu();
   const {
     children,

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';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { Placement } from '../../../types';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { useCurrentMenu } from '../Context';\n\nexport type MenuContentProps = Omit<DropdownMenuPrimitive.DropdownMenuContentProps, 'children' | 'side'> & {\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 = useProxiedRef<any>(ref);\n    const menu = useCurrentMenu();\n    const { children, placement: side, ...otherProps } = props;\n    const className = cn('border rounded block outline-none p-1 wcag-white border-grey yt-shadow', props.className);\n\n    return (\n        <DropdownMenuPrimitive.Portal>\n            <DropdownMenuPrimitive.Content\n                {...otherProps}\n                align=\"start\"\n                className={className}\n                data-taco=\"menu\"\n                side={side}\n                sideOffset={2}\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","useProxiedRef","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,aAAa,CAAMF,GAAG,CAAC;EAC3C,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 { Placement } from '../../../types';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useCurrentMenu } from '../Context';\n\nexport type MenuContentProps = Omit<DropdownMenuPrimitive.DropdownMenuContentProps, 'children' | 'side'> & {\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 { children, placement: side, ...otherProps } = props;\n    const className = cn('border rounded block outline-none p-1 wcag-white border-grey yt-shadow', props.className);\n\n    return (\n        <DropdownMenuPrimitive.Portal>\n            <DropdownMenuPrimitive.Content\n                {...otherProps}\n                align=\"start\"\n                className={className}\n                data-taco=\"menu\"\n                side={side}\n                sideOffset={2}\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","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;;;;"}

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

@@ -1,11 +1,11 @@
 import { forwardRef, useEffect, createElement } from 'react';
-import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../../hooks/useMergedRef.js';
 import { Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
 import { useCurrentMenu } from '../Context.js';
 
 const Trigger = /*#__PURE__*/forwardRef(function MenuTrigger(props, ref) {
   const menu = useCurrentMenu();
-  const internalRef = useProxiedRef(ref);
+  const internalRef = useMergedRef(ref);
   useEffect(() => {
     if (internalRef.current) {
       menu === null || menu === void 0 ? void 0 : menu.setMinWidth(internalRef.current.getBoundingClientRect().width);

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';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\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 = useProxiedRef<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","useProxiedRef","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,aAAa,CAAoBJ,GAAG,CAAC;EAEzDH,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

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import cn from 'classnames';
 import { Icon } from '../Icon/Icon.js';
-import { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { Treeview } from '../Treeview/Treeview.js';
 import { useDropTarget } from '../../utils/hooks/useDropTarget.js';
 
@@ -15,7 +15,7 @@ const Item = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
     role,
     ...otherProps
   } = props;
-  const proxyRef = useProxiedRef(ref);
+  const proxyRef = useMergedRef(ref);
   const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);
   const isTreeitem = role === 'treeitem';
   const className = cn('yt-navigation__item cursor-pointer', {

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';\nimport cn from 'classnames';\nimport { TreeviewProps, Treeview, TreeviewGroupProps, TreeviewItemProps } from '../Treeview/Treeview';\nimport { Icon } from '../Icon/Icon';\nimport { useDropTarget } from '../../utils/hooks/useDropTarget';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\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 = useProxiedRef<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","useProxiedRef","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/Popover/Popover.js

@@ -70,7 +70,10 @@ const Close = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/createElement
 const Popover = /*#__PURE__*/forwardRef(function Popover(props, ref) {
   const {
     children,
+    defaultOpen,
     modal = false,
+    open,
+    onChange,
     trigger,
     ...otherProps
   } = props;
@@ -81,7 +84,10 @@ const Popover = /*#__PURE__*/forwardRef(function Popover(props, ref) {
   return /*#__PURE__*/createElement(PopoverContext.Provider, {
     value: context
   }, /*#__PURE__*/createElement(Root, {
-    modal: modal
+    defaultOpen: defaultOpen,
+    modal: modal,
+    open: open,
+    onOpenChange: onChange
   }, trigger && /*#__PURE__*/createElement(Trigger, null, trigger), children));
 });
 Popover.Trigger = Trigger;

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

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Placement } from '../..';\nimport { UnstyledArrow } from './Primitives';\nimport { mergeRefs } from '../../utils/mergeRefs';\nimport { getPopoverStyleClassnames } from './util';\n\ntype PopoverContextValue = { props: any; ref: React.Ref<HTMLElement> };\n\nconst PopoverContext = React.createContext<PopoverContextValue>({\n    props: {},\n    ref: null,\n});\n\nexport type PopoverTriggerProps = React.HTMLAttributes<HTMLElement>;\nconst Trigger = React.forwardRef(function PopoverAnchor(props: PopoverTriggerProps, externalRef: React.Ref<HTMLElement>) {\n    const { ref: parentRef, props: parentProps } = React.useContext(PopoverContext);\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    let children = props.children;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        console.warn(\n            `Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return <PopoverPrimitive.Trigger {...parentProps} {...props} children={children} ref={refCallback} asChild />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('hide'));\n    };\n\n    return children({ close, ref });\n});\n\nexport type PopoverContentRenderProps = { close: () => void };\nexport type PopoverContentProps = Omit<PopoverPrimitive.PopoverContentProps, 'side'> & {\n    children: React.ReactNode | ((props: PopoverContentRenderProps) => React.ReactNode);\n    /** Set the position of the Popover relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef(function PopoverContent(props: PopoverContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { placement: side, ...popoverContentProps } = props;\n    const className = cn(getPopoverStyleClassnames(), props.className);\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <PopoverPrimitive.Close asChild>\n                <RenderPropWrapper>{props.children}</RenderPropWrapper>\n            </PopoverPrimitive.Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <PopoverPrimitive.Portal>\n            <PopoverPrimitive.Content\n                {...popoverContentProps}\n                className={className}\n                data-taco=\"popover\"\n                side={side}\n                sideOffset={1}\n                ref={ref}>\n                {output}\n                <UnstyledArrow className=\"text-white\" />\n            </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n    );\n});\n\nexport type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement>;\nconst Close = React.forwardRef(\n    (props: PopoverCloseProps, ref: React.Ref<HTMLButtonElement>): JSX.Element => (\n        <PopoverPrimitive.Close {...props} ref={ref} asChild />\n    )\n);\n\nexport type PopoverProps = React.PropsWithChildren<{\n    modal?: boolean;\n    /** A trigger to be used for the popover, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n}>;\nexport type ForwardedPopoverWithStatics = React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<PopoverTriggerProps>;\n    Content: React.ForwardRefExoticComponent<PopoverContentProps>;\n    Close: React.ForwardRefExoticComponent<PopoverCloseProps>;\n    Portal: React.FunctionComponent<PopoverPrimitive.PortalProps>;\n};\n\nexport const Popover = React.forwardRef<HTMLElement, PopoverProps>(function Popover(props, ref) {\n    const { children, modal = false, trigger, ...otherProps } = props;\n    const context = React.useMemo(() => ({ props: otherProps, ref }), [otherProps]);\n\n    return (\n        <PopoverContext.Provider value={context}>\n            <PopoverPrimitive.Root modal={modal}>\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </PopoverPrimitive.Root>\n        </PopoverContext.Provider>\n    );\n}) as ForwardedPopoverWithStatics;\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\nPopover.Portal = PopoverPrimitive.Portal;\n"],"names":["PopoverContext","React","props","ref","Trigger","PopoverAnchor","externalRef","parentRef","parentProps","refCallback","mergeRefs","children","type","console","warn","name","PopoverPrimitive","asChild","RenderPropWrapper","onClick","close","CustomEvent","Content","PopoverContent","placement","side","popoverContentProps","className","cn","getPopoverStyleClassnames","output","sideOffset","UnstyledArrow","Close","Popover","modal","trigger","otherProps","context","Provider","value","Portal"],"mappings":"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"}
+{"version":3,"file":"Popover.js","sources":["../../../../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Placement } from '../..';\nimport { UnstyledArrow } from './Primitives';\nimport { mergeRefs } from '../../utils/mergeRefs';\nimport { getPopoverStyleClassnames } from './util';\n\ntype PopoverContextValue = { props: any; ref: React.Ref<HTMLElement> };\n\nconst PopoverContext = React.createContext<PopoverContextValue>({\n    props: {},\n    ref: null,\n});\n\nexport type PopoverTriggerProps = React.HTMLAttributes<HTMLElement>;\nconst Trigger = React.forwardRef(function PopoverAnchor(props: PopoverTriggerProps, externalRef: React.Ref<HTMLElement>) {\n    const { ref: parentRef, props: parentProps } = React.useContext(PopoverContext);\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    let children = props.children;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        console.warn(\n            `Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return <PopoverPrimitive.Trigger {...parentProps} {...props} children={children} ref={refCallback} asChild />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('hide'));\n    };\n\n    return children({ close, ref });\n});\n\nexport type PopoverContentRenderProps = { close: () => void };\nexport type PopoverContentProps = Omit<PopoverPrimitive.PopoverContentProps, 'side'> & {\n    children: React.ReactNode | ((props: PopoverContentRenderProps) => React.ReactNode);\n    /** Set the position of the Popover relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef(function PopoverContent(props: PopoverContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { placement: side, ...popoverContentProps } = props;\n    const className = cn(getPopoverStyleClassnames(), props.className);\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <PopoverPrimitive.Close asChild>\n                <RenderPropWrapper>{props.children}</RenderPropWrapper>\n            </PopoverPrimitive.Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <PopoverPrimitive.Portal>\n            <PopoverPrimitive.Content\n                {...popoverContentProps}\n                className={className}\n                data-taco=\"popover\"\n                side={side}\n                sideOffset={1}\n                ref={ref}>\n                {output}\n                <UnstyledArrow className=\"text-white\" />\n            </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n    );\n});\n\nexport type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement>;\nconst Close = React.forwardRef(\n    (props: PopoverCloseProps, ref: React.Ref<HTMLButtonElement>): JSX.Element => (\n        <PopoverPrimitive.Close {...props} ref={ref} asChild />\n    )\n);\n\nexport type PopoverProps = React.PropsWithChildren<{\n    modal?: boolean;\n    /** A trigger to be used for the popover, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n    /** Set whether the popover is open by default or not, use when not providing a trigger  */\n    defaultOpen?: boolean;\n    /** Control the open state of the popover from outside the component  */\n    open?: boolean;\n    /** Called when the popover opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n}>;\nexport type ForwardedPopoverWithStatics = React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<PopoverTriggerProps>;\n    Content: React.ForwardRefExoticComponent<PopoverContentProps>;\n    Close: React.ForwardRefExoticComponent<PopoverCloseProps>;\n    Portal: React.FunctionComponent<PopoverPrimitive.PortalProps>;\n};\n\nexport const Popover = React.forwardRef<HTMLElement, PopoverProps>(function Popover(props, ref) {\n    const { children, defaultOpen, modal = false, open, onChange, trigger, ...otherProps } = props;\n    const context = React.useMemo(() => ({ props: otherProps, ref }), [otherProps]);\n\n    return (\n        <PopoverContext.Provider value={context}>\n            <PopoverPrimitive.Root defaultOpen={defaultOpen} modal={modal} open={open} onOpenChange={onChange}>\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </PopoverPrimitive.Root>\n        </PopoverContext.Provider>\n    );\n}) as ForwardedPopoverWithStatics;\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\nPopover.Portal = PopoverPrimitive.Portal;\n"],"names":["PopoverContext","React","props","ref","Trigger","PopoverAnchor","externalRef","parentRef","parentProps","refCallback","mergeRefs","children","type","console","warn","name","PopoverPrimitive","asChild","RenderPropWrapper","onClick","close","CustomEvent","Content","PopoverContent","placement","side","popoverContentProps","className","cn","getPopoverStyleClassnames","output","sideOffset","UnstyledArrow","Close","Popover","defaultOpen","modal","open","onChange","trigger","otherProps","context","Provider","value","onOpenChange","Portal"],"mappings":"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"}

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

@@ -17,6 +17,7 @@ import { useLocalization } from '../Provider/Provider.js';
 import '../Calendar/Calendar.js';
 import '../Card/Card.js';
 import '../Checkbox/Checkbox.js';
+import '../../hooks/useMergedRef.js';
 import { Input } from '../Input/Input.js';
 import '../../utils/hooks/useListKeyboardNavigation.js';
 import '../../utils/hooks/useListScrollTo.js';
@@ -41,7 +42,6 @@ import '../Select/Select.js';
 import '../Pagination/usePagination.js';
 import '../Pagination/Pagination.js';
 import '../Progress/Progress.js';
-import '../../hooks/useMergedRef.js';
 import '../Tag/Tag.js';
 import '../Select2/Select2.js';
 import '../Table/components/Table.js';

package/dist/esm/packages/taco/src/components/Select/useSelect.js

@@ -2,7 +2,7 @@ import { useState, useMemo, useRef, useEffect, createElement, Fragment, cloneEle
 import cn from 'classnames';
 import { v4 } from 'uuid';
 import { useLocalization } from '../Provider/Provider.js';
-import { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { createCustomEvent } from '../../utils/input.js';
 import { useFlattenedData, findByValue, setInputValueByRef, sanitizeItem } from '../Listbox/util.js';
 
@@ -26,7 +26,7 @@ const useSelect = ({
     texts
   } = useLocalization();
   const flattenedData = useFlattenedData(data);
-  const listboxInputRef = useProxiedRef(ref);
+  const listboxInputRef = useMergedRef(ref);
   const [open, setOpen] = useState(false);
   const id = useMemo(() => nativeId || `select_${v4()}`, [nativeId]);
   const inputRef = useRef(null);

package/dist/esm/packages/taco/src/components/Select/useSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSelect.js","sources":["../../../../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { v4 as uuid } from 'uuid';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { useLocalization } from '../Provider/Provider';\nimport { SelectProps } from './Select';\nimport { ListboxProps } from '../Listbox/Listbox';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\nimport { createCustomEvent } from '../../utils/input';\n\ntype InternalButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\ntype InternalListboxProps = ListboxProps & { ref: React.ForwardedRef<HTMLInputElement> };\ntype InternalInputProps = React.InputHTMLAttributes<HTMLInputElement> & { ref: React.ForwardedRef<HTMLInputElement> };\n\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\n    button: InternalButtonProps;\n    listbox: InternalListboxProps;\n    input: InternalInputProps;\n    popover: Pick<PopoverPrimitive.PopoverProps, 'onOpenChange' | 'open'>;\n    text: string | JSX.Element;\n    more?: number;\n};\n\nexport const useSelect = (\n    {\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data = [],\n        defaultValue,\n        disabled,\n        emptyValue,\n        id: nativeId,\n        multiselect,\n        onBlur,\n        onClick,\n        onChange,\n        readOnly,\n        value,\n        ...otherProps\n    }: SelectProps,\n    ref: React.Ref<HTMLInputElement>\n): useSelect => {\n    const { texts } = useLocalization();\n    const flattenedData = useFlattenedData(data);\n    const listboxInputRef = useProxiedRef<HTMLInputElement>(ref);\n    const [open, setOpen] = React.useState(false);\n    const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const buttonId = `${id}-button`;\n    // support 'escape' resetting to the value that was set when the listbox opened\n    const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\n\n    React.useEffect(() => {\n        setLastValue(value);\n    }, [open]);\n\n    React.useEffect(() => {\n        if (value === undefined) {\n            if (defaultValue !== undefined && findByValue(flattenedData, defaultValue)) {\n                setInputValueByRef(inputRef.current, defaultValue);\n            } else {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        } else {\n            if (!multiselect && !findByValue(flattenedData, value)) {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        }\n    }, []);\n\n    // event handlers\n    const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\n        if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n            event.preventDefault();\n            setOpen(true);\n        }\n    };\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        switch (event.key) {\n            case 'Escape': {\n                event.preventDefault();\n                if (lastValue !== undefined) {\n                    setInputValueByRef(listboxInputRef.current, lastValue);\n                }\n\n                setOpen(false);\n                break;\n            }\n\n            case 'Tab':\n            case 'Enter': {\n                if (event.key !== 'Tab') {\n                    event.preventDefault();\n                }\n                setOpen(false);\n                break;\n            }\n\n            default:\n        }\n\n        if (otherProps.onKeyDown) {\n            otherProps.onKeyDown(event);\n        }\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\n        event.preventDefault();\n        if (!multiselect) {\n            setOpen(false);\n            if (onBlur) {\n                onBlur(createCustomEvent('blur'));\n            }\n        }\n    };\n\n    let text: string | JSX.Element = '';\n    let more = 0;\n\n    if (value !== undefined) {\n        if (multiselect) {\n            const selectedValues = value?.toString().split(',') || [];\n\n            if (selectedValues.length === flattenedData.filter(item => !item.disabled).length) {\n                text = texts.select.allOptionsSelected;\n            } else {\n                text = findByValue(flattenedData, selectedValues[0])?.text ?? '';\n                more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\n            }\n        } else {\n            const item = findByValue(flattenedData, value);\n\n            if (item) {\n                text = item.icon ? (\n                    <>\n                        {React.cloneElement(item.icon, {\n                            className: cn(item.icon.props.className, 'mr-1 -mt-px'),\n                        })}\n                        {item.text}\n                    </>\n                ) : (\n                    item.text\n                );\n            }\n        }\n    }\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        if (onChange) {\n            const item = findByValue(flattenedData, 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(flattenedData.find(i => i.path === lastPath));\n                });\n            }\n\n            onChange(event);\n        }\n    };\n\n    const button: InternalButtonProps = {\n        'aria-haspopup': 'listbox' as const,\n        'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\n        'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\n        disabled: disabled || readOnly,\n        id: buttonId,\n        onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\n        type: 'button',\n    };\n\n    const listbox: InternalListboxProps = {\n        ...otherProps,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data,\n        disabled,\n        emptyValue,\n        onBlur,\n        onClick: handleListboxClick,\n        onChange: event => {\n            setInputValueByRef(inputRef.current, event.target.value);\n        },\n        onKeyDown: handleListboxKeyDown,\n        ref: listboxInputRef,\n        value,\n    };\n\n    const input: InternalInputProps = {\n        onChange: handleInputChange,\n        ref: inputRef,\n        value: String(value ?? ''),\n    };\n\n    return {\n        button,\n        listbox,\n        input,\n        popover: {\n            open,\n            onOpenChange: open => {\n                if (!open && onBlur) {\n                    onBlur(createCustomEvent('blur'));\n                }\n                setOpen(open);\n            },\n        },\n        text,\n        more,\n    };\n};\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onBlur","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","flattenedData","useFlattenedData","listboxInputRef","useProxiedRef","open","setOpen","React","uuid","inputRef","buttonId","lastValue","setLastValue","undefined","findByValue","setInputValueByRef","current","length","handleButtonKeyDown","event","key","preventDefault","handleListboxKeyDown","onKeyDown","handleListboxClick","createCustomEvent","text","more","selectedValues","toString","split","filter","item","select","allOptionsSelected","icon","className","cn","props","handleInputChange","persist","target","detail","sanitizeItem","indexes","path","pop","lastPath","parents","map","i","join","find","button","type","listbox","input","String","popover","onOpenChange"],"mappings":";;;;;;;;MAyBaA,SAAS,GAAG,CACrB;EACI,YAAY,EAAEC,SAAS;EACvB,iBAAiB,EAAEC,cAAc;EACjCC,IAAI,GAAG,EAAE;EACTC,YAAY;EACZC,QAAQ;EACRC,UAAU;EACVC,EAAE,EAAEC,QAAQ;EACZC,WAAW;EACXC,MAAM;EACNC,OAAO;EACPC,QAAQ;EACRC,QAAQ;EACRC,KAAK;EACL,GAAGC;CACO,EACdC,GAAgC;EAEhC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,aAAa,GAAGC,gBAAgB,CAACjB,IAAI,CAAC;EAC5C,MAAMkB,eAAe,GAAGC,aAAa,CAAmBN,GAAG,CAAC;EAC5D,MAAM,CAACO,IAAI,EAAEC,OAAO,CAAC,GAAGC,QAAc,CAAC,KAAK,CAAC;EAC7C,MAAMlB,EAAE,GAAGkB,OAAa,CAAC,MAAMjB,QAAQ,cAAckB,EAAI,IAAI,EAAE,CAAClB,QAAQ,CAAC,CAAC;EAC1E,MAAMmB,QAAQ,GAAGF,MAAY,CAAmB,IAAI,CAAC;EACrD,MAAMG,QAAQ,MAAMrB,WAAW;;EAE/B,MAAM,CAACsB,SAAS,EAAEC,YAAY,CAAC,GAAGL,QAAc,CAAsCX,KAAK,CAAC;EAE5FW,SAAe,CAAC;IACZK,YAAY,CAAChB,KAAK,CAAC;GACtB,EAAE,CAACS,IAAI,CAAC,CAAC;EAEVE,SAAe,CAAC;IACZ,IAAIX,KAAK,KAAKiB,SAAS,EAAE;MACrB,IAAI3B,YAAY,KAAK2B,SAAS,IAAIC,WAAW,CAACb,aAAa,EAAEf,YAAY,CAAC,EAAE;QACxE6B,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE9B,YAAY,CAAC;OACrD,MAAM;QACH,IAAIE,UAAU,KAAKyB,SAAS,EAAE;UAC1BE,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE5B,UAAU,CAAC;SACnD,MAAM,IAAIH,IAAI,CAACgC,MAAM,GAAG,CAAC,EAAE;UACxBF,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE/B,IAAI,CAAC,CAAC,CAAC,CAACW,KAAK,CAAC;;;KAG9D,MAAM;MACH,IAAI,CAACL,WAAW,IAAI,CAACuB,WAAW,CAACb,aAAa,EAAEL,KAAK,CAAC,EAAE;QACpD,IAAIR,UAAU,KAAKyB,SAAS,EAAE;UAC1BE,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE5B,UAAU,CAAC;SACnD,MAAM,IAAIH,IAAI,CAACgC,MAAM,GAAG,CAAC,EAAE;UACxBF,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE/B,IAAI,CAAC,CAAC,CAAC,CAACW,KAAK,CAAC;;;;GAIlE,EAAE,EAAE,CAAC;;EAGN,MAAMsB,mBAAmB,GAAIC,KAA6C;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,SAAS,IAAID,KAAK,CAACC,GAAG,KAAK,WAAW,EAAE;MACtDD,KAAK,CAACE,cAAc,EAAE;MACtBf,OAAO,CAAC,IAAI,CAAC;;GAEpB;EAED,MAAMgB,oBAAoB,GAAIH,KAAuC;IACjE,QAAQA,KAAK,CAACC,GAAG;MACb,KAAK,QAAQ;QAAE;UACXD,KAAK,CAACE,cAAc,EAAE;UACtB,IAAIV,SAAS,KAAKE,SAAS,EAAE;YACzBE,kBAAkB,CAACZ,eAAe,CAACa,OAAO,EAAEL,SAAS,CAAC;;UAG1DL,OAAO,CAAC,KAAK,CAAC;UACd;;MAGJ,KAAK,KAAK;MACV,KAAK,OAAO;QAAE;UACV,IAAIa,KAAK,CAACC,GAAG,KAAK,KAAK,EAAE;YACrBD,KAAK,CAACE,cAAc,EAAE;;UAE1Bf,OAAO,CAAC,KAAK,CAAC;UACd;;;IAMR,IAAIT,UAAU,CAAC0B,SAAS,EAAE;MACtB1B,UAAU,CAAC0B,SAAS,CAACJ,KAAK,CAAC;;GAElC;EAED,MAAMK,kBAAkB,GAAIL,KAAsC;IAC9DA,KAAK,CAACE,cAAc,EAAE;IACtB,IAAI,CAAC9B,WAAW,EAAE;MACde,OAAO,CAAC,KAAK,CAAC;MACd,IAAId,MAAM,EAAE;QACRA,MAAM,CAACiC,iBAAiB,CAAC,MAAM,CAAC,CAAC;;;GAG5C;EAED,IAAIC,IAAI,GAAyB,EAAE;EACnC,IAAIC,IAAI,GAAG,CAAC;EAEZ,IAAI/B,KAAK,KAAKiB,SAAS,EAAE;IACrB,IAAItB,WAAW,EAAE;MACb,MAAMqC,cAAc,GAAG,CAAAhC,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEiC,QAAQ,EAAE,CAACC,KAAK,CAAC,GAAG,CAAC,KAAI,EAAE;MAEzD,IAAIF,cAAc,CAACX,MAAM,KAAKhB,aAAa,CAAC8B,MAAM,CAACC,IAAI,IAAI,CAACA,IAAI,CAAC7C,QAAQ,CAAC,CAAC8B,MAAM,EAAE;QAC/ES,IAAI,GAAG3B,KAAK,CAACkC,MAAM,CAACC,kBAAkB;OACzC,MAAM;QAAA;QACHR,IAAI,wCAAGZ,WAAW,CAACb,aAAa,EAAE2B,cAAc,CAAC,CAAC,CAAC,CAAC,iDAA7C,aAA+CF,IAAI,iEAAI,EAAE;QAChEC,IAAI,GAAGC,cAAc,CAACX,MAAM,GAAG,CAAC,GAAGW,cAAc,CAACX,MAAM,GAAG,CAAC,GAAG,CAAC;;KAEvE,MAAM;MACH,MAAMe,IAAI,GAAGlB,WAAW,CAACb,aAAa,EAAEL,KAAK,CAAC;MAE9C,IAAIoC,IAAI,EAAE;QACNN,IAAI,GAAGM,IAAI,CAACG,IAAI,gBACZ5B,2CACKA,YAAkB,CAACyB,IAAI,CAACG,IAAI,EAAE;UAC3BC,SAAS,EAAEC,EAAE,CAACL,IAAI,CAACG,IAAI,CAACG,KAAK,CAACF,SAAS,EAAE,aAAa;SACzD,CAAC,EACDJ,IAAI,CAACN,IAAI,CACX,GAEHM,IAAI,CAACN,IACR;;;;EAKb,MAAMa,iBAAiB,GAAIpB,KAA0C;IACjEA,KAAK,CAACqB,OAAO,EAAE;IAEf,IAAI9C,QAAQ,EAAE;MAAA;MACV,MAAMsC,IAAI,GAAGlB,WAAW,CAACb,aAAa,EAAEkB,KAAK,CAACsB,MAAM,CAAC7C,KAAK,CAAC;MAC1DuB,KAAa,CAACuB,MAAM,GAAGC,YAAY,CAACX,IAAI,CAAC;MAE1C,MAAMY,OAAO,uBAAGZ,IAAI,aAAJA,IAAI,qCAAJA,IAAI,CAAEa,IAAI,+CAAV,WAAYf,KAAK,CAAC,GAAG,CAAC,+DAAI,EAAE;MAE5C,IAAIc,OAAO,CAAC3B,MAAM,GAAG,CAAC,EAAE;;QAEpB2B,OAAO,CAACE,GAAG,EAAE;;QAEb,IAAIC,QAAgB;QAEnB5B,KAAa,CAACuB,MAAM,CAACM,OAAO,GAAGJ,OAAO,CAACK,GAAG,CAACC,CAAC;UACzCH,QAAQ,GAAGA,QAAQ,GAAG,CAACA,QAAQ,EAAEG,CAAC,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,GAAGD,CAAC;UACjD,OAAOP,YAAY,CAAC1C,aAAa,CAACmD,IAAI,CAACF,CAAC,IAAIA,CAAC,CAACL,IAAI,KAAKE,QAAQ,CAAC,CAAC;SACpE,CAAC;;MAGNrD,QAAQ,CAACyB,KAAK,CAAC;;GAEtB;EAED,MAAMkC,MAAM,GAAwB;IAChC,eAAe,EAAE,SAAkB;IACnC,YAAY,EAAEtE,SAAS,MAAMA,aAAa2C,MAAM,GAAGb,SAAS;IAC5D,iBAAiB,EAAE7B,cAAc,MAAMA,kBAAkB0B,UAAU,GAAGG,SAAS;IAC/E1B,QAAQ,EAAEA,QAAQ,IAAIQ,QAAQ;IAC9BN,EAAE,EAAEqB,QAAQ;IACZa,SAAS,EAAE,CAACpC,QAAQ,IAAI,CAACQ,QAAQ,GAAGuB,mBAAmB,GAAGL,SAAS;IACnEyC,IAAI,EAAE;GACT;EAED,MAAMC,OAAO,GAAyB;IAClC,GAAG1D,UAAU;IACb,YAAY,EAAEd,SAAS;IACvB,iBAAiB,EAAEC,cAAc;IACjCC,IAAI;IACJE,QAAQ;IACRC,UAAU;IACVI,MAAM;IACNC,OAAO,EAAE+B,kBAAkB;IAC3B9B,QAAQ,EAAEyB,KAAK;MACXJ,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAEG,KAAK,CAACsB,MAAM,CAAC7C,KAAK,CAAC;KAC3D;IACD2B,SAAS,EAAED,oBAAoB;IAC/BxB,GAAG,EAAEK,eAAe;IACpBP;GACH;EAED,MAAM4D,KAAK,GAAuB;IAC9B9D,QAAQ,EAAE6C,iBAAiB;IAC3BzC,GAAG,EAAEW,QAAQ;IACbb,KAAK,EAAE6D,MAAM,CAAC7D,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE;GAC5B;EAED,OAAO;IACHyD,MAAM;IACNE,OAAO;IACPC,KAAK;IACLE,OAAO,EAAE;MACLrD,IAAI;MACJsD,YAAY,EAAEtD,IAAI;QACd,IAAI,CAACA,IAAI,IAAIb,MAAM,EAAE;UACjBA,MAAM,CAACiC,iBAAiB,CAAC,MAAM,CAAC,CAAC;;QAErCnB,OAAO,CAACD,IAAI,CAAC;;KAEpB;IACDqB,IAAI;IACJC;GACH;AACL;;;;"}
+{"version":3,"file":"useSelect.js","sources":["../../../../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { v4 as uuid } from 'uuid';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { useLocalization } from '../Provider/Provider';\nimport { SelectProps } from './Select';\nimport { ListboxProps } from '../Listbox/Listbox';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\nimport { createCustomEvent } from '../../utils/input';\n\ntype InternalButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\ntype InternalListboxProps = ListboxProps & { ref: React.ForwardedRef<HTMLInputElement> };\ntype InternalInputProps = React.InputHTMLAttributes<HTMLInputElement> & { ref: React.ForwardedRef<HTMLInputElement> };\n\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\n    button: InternalButtonProps;\n    listbox: InternalListboxProps;\n    input: InternalInputProps;\n    popover: Pick<PopoverPrimitive.PopoverProps, 'onOpenChange' | 'open'>;\n    text: string | JSX.Element;\n    more?: number;\n};\n\nexport const useSelect = (\n    {\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data = [],\n        defaultValue,\n        disabled,\n        emptyValue,\n        id: nativeId,\n        multiselect,\n        onBlur,\n        onClick,\n        onChange,\n        readOnly,\n        value,\n        ...otherProps\n    }: SelectProps,\n    ref: React.Ref<HTMLInputElement>\n): useSelect => {\n    const { texts } = useLocalization();\n    const flattenedData = useFlattenedData(data);\n    const listboxInputRef = useMergedRef<HTMLInputElement>(ref);\n    const [open, setOpen] = React.useState(false);\n    const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const buttonId = `${id}-button`;\n    // support 'escape' resetting to the value that was set when the listbox opened\n    const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\n\n    React.useEffect(() => {\n        setLastValue(value);\n    }, [open]);\n\n    React.useEffect(() => {\n        if (value === undefined) {\n            if (defaultValue !== undefined && findByValue(flattenedData, defaultValue)) {\n                setInputValueByRef(inputRef.current, defaultValue);\n            } else {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        } else {\n            if (!multiselect && !findByValue(flattenedData, value)) {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        }\n    }, []);\n\n    // event handlers\n    const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\n        if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n            event.preventDefault();\n            setOpen(true);\n        }\n    };\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        switch (event.key) {\n            case 'Escape': {\n                event.preventDefault();\n                if (lastValue !== undefined) {\n                    setInputValueByRef(listboxInputRef.current, lastValue);\n                }\n\n                setOpen(false);\n                break;\n            }\n\n            case 'Tab':\n            case 'Enter': {\n                if (event.key !== 'Tab') {\n                    event.preventDefault();\n                }\n                setOpen(false);\n                break;\n            }\n\n            default:\n        }\n\n        if (otherProps.onKeyDown) {\n            otherProps.onKeyDown(event);\n        }\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\n        event.preventDefault();\n        if (!multiselect) {\n            setOpen(false);\n            if (onBlur) {\n                onBlur(createCustomEvent('blur'));\n            }\n        }\n    };\n\n    let text: string | JSX.Element = '';\n    let more = 0;\n\n    if (value !== undefined) {\n        if (multiselect) {\n            const selectedValues = value?.toString().split(',') || [];\n\n            if (selectedValues.length === flattenedData.filter(item => !item.disabled).length) {\n                text = texts.select.allOptionsSelected;\n            } else {\n                text = findByValue(flattenedData, selectedValues[0])?.text ?? '';\n                more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\n            }\n        } else {\n            const item = findByValue(flattenedData, value);\n\n            if (item) {\n                text = item.icon ? (\n                    <>\n                        {React.cloneElement(item.icon, {\n                            className: cn(item.icon.props.className, 'mr-1 -mt-px'),\n                        })}\n                        {item.text}\n                    </>\n                ) : (\n                    item.text\n                );\n            }\n        }\n    }\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        if (onChange) {\n            const item = findByValue(flattenedData, 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(flattenedData.find(i => i.path === lastPath));\n                });\n            }\n\n            onChange(event);\n        }\n    };\n\n    const button: InternalButtonProps = {\n        'aria-haspopup': 'listbox' as const,\n        'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\n        'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\n        disabled: disabled || readOnly,\n        id: buttonId,\n        onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\n        type: 'button',\n    };\n\n    const listbox: InternalListboxProps = {\n        ...otherProps,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data,\n        disabled,\n        emptyValue,\n        onBlur,\n        onClick: handleListboxClick,\n        onChange: event => {\n            setInputValueByRef(inputRef.current, event.target.value);\n        },\n        onKeyDown: handleListboxKeyDown,\n        ref: listboxInputRef,\n        value,\n    };\n\n    const input: InternalInputProps = {\n        onChange: handleInputChange,\n        ref: inputRef,\n        value: String(value ?? ''),\n    };\n\n    return {\n        button,\n        listbox,\n        input,\n        popover: {\n            open,\n            onOpenChange: open => {\n                if (!open && onBlur) {\n                    onBlur(createCustomEvent('blur'));\n                }\n                setOpen(open);\n            },\n        },\n        text,\n        more,\n    };\n};\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onBlur","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","flattenedData","useFlattenedData","listboxInputRef","useMergedRef","open","setOpen","React","uuid","inputRef","buttonId","lastValue","setLastValue","undefined","findByValue","setInputValueByRef","current","length","handleButtonKeyDown","event","key","preventDefault","handleListboxKeyDown","onKeyDown","handleListboxClick","createCustomEvent","text","more","selectedValues","toString","split","filter","item","select","allOptionsSelected","icon","className","cn","props","handleInputChange","persist","target","detail","sanitizeItem","indexes","path","pop","lastPath","parents","map","i","join","find","button","type","listbox","input","String","popover","onOpenChange"],"mappings":"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"}

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

@@ -2,10 +2,10 @@ import React__default from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../Provider/Provider.js';
 import { Root, Trigger, Portal, Content } from '@radix-ui/react-popover';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { createCustomKeyboardEvent } from '../../utils/input.js';
 import { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener.js';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
-import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { Root as Root$1, createListboxValueSetter } from '../../primitives/Listbox2/components/Root.js';
 import '../../primitives/Listbox2/components/Option.js';
 import '../../primitives/Listbox2/components/Group.js';

package/dist/esm/packages/taco/src/components/Table/components/BaseTable.js

@@ -1,11 +1,11 @@
 import React__default from 'react';
 import cn from 'classnames';
-import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../../hooks/useMergedRef.js';
 import { Column } from '../util/renderColumn.js';
 
 const DefaultEmptyState = () => null;
 const BaseTable = /*#__PURE__*/React__default.forwardRef(function BaseTable(props, ref) {
-  const tableRef = useProxiedRef(ref);
+  const tableRef = useMergedRef(ref);
   const {
     autoFocus,
     children,

package/dist/esm/packages/taco/src/components/Table/components/BaseTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseTable.js","sources":["../../../../../../../../src/components/Table/components/BaseTable.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { HeaderGroup } from 'react-table';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { InternalBaseTable } from '../types';\nimport './Table.css';\nimport { Column } from '../util/renderColumn';\n\nexport const DefaultEmptyState = (): React.ReactNode => null;\n\nexport const BaseTable = React.forwardRef(function BaseTable(props: InternalBaseTable, ref: React.Ref<HTMLDivElement>) {\n    const tableRef = useProxiedRef<HTMLDivElement>(ref);\n    const { autoFocus, children, disableSorting: _, headerGroups, headerRef, bodyRef, ...otherProps } = props;\n\n    React.useEffect(() => {\n        if (autoFocus && tableRef.current) {\n            tableRef.current.focus();\n        }\n    }, []);\n\n    const className = cn('yt-table flex flex-col focus:yt-focus focus:rounded-sm', props.className);\n\n    return (\n        <div {...otherProps} role=\"table\" className={className} ref={tableRef}>\n            <div role=\"rowgroup\" className=\"yt-table__head\" ref={headerRef}>\n                {headerGroups?.map((headerGroup: HeaderGroup<object>, index: number) => (\n                    <div\n                        key={index}\n                        role=\"row\"\n                        className=\"border-grey-light flex h-auto min-h-[2.5rem] w-full select-none border-t-0 border-b-2 font-bold\">\n                        {headerGroup.headers.map((cell: any, index: number) => (\n                            <Column key={index} index={index} cell={cell} />\n                        ))}\n                    </div>\n                ))}\n            </div>\n\n            <div role=\"rowgroup\" className=\"yt-table__body\" ref={bodyRef}>\n                {children}\n            </div>\n        </div>\n    );\n});\n"],"names":["DefaultEmptyState","BaseTable","React","forwardRef","props","ref","tableRef","useProxiedRef","autoFocus","children","disableSorting","_","headerGroups","headerRef","bodyRef","otherProps","useEffect","current","focus","className","cn","role","map","headerGroup","index","key","headers","cell","Column"],"mappings":";;;;;MAQaA,iBAAiB,GAAG,MAAuB;MAE3CC,SAAS,gBAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,SAAS,CAACG,KAAwB,EAAEC,GAA8B;EACjH,MAAMC,QAAQ,GAAGC,aAAa,CAAiBF,GAAG,CAAC;EACnD,MAAM;IAAEG,SAAS;IAAEC,QAAQ;IAAEC,cAAc,EAAEC,CAAC;IAAEC,YAAY;IAAEC,SAAS;IAAEC,OAAO;IAAE,GAAGC;GAAY,GAAGX,KAAK;EAEzGF,cAAK,CAACc,SAAS,CAAC;IACZ,IAAIR,SAAS,IAAIF,QAAQ,CAACW,OAAO,EAAE;MAC/BX,QAAQ,CAACW,OAAO,CAACC,KAAK,EAAE;;GAE/B,EAAE,EAAE,CAAC;EAEN,MAAMC,SAAS,GAAGC,EAAE,CAAC,wDAAwD,EAAEhB,KAAK,CAACe,SAAS,CAAC;EAE/F,oBACIjB,sDAASa,UAAU;IAAEM,IAAI,EAAC,OAAO;IAACF,SAAS,EAAEA,SAAS;IAAEd,GAAG,EAAEC;mBACzDJ;IAAKmB,IAAI,EAAC,UAAU;IAACF,SAAS,EAAC,gBAAgB;IAACd,GAAG,EAAEQ;KAChDD,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAEU,GAAG,CAAC,CAACC,WAAgC,EAAEC,KAAa,kBAC/DtB;IACIuB,GAAG,EAAED,KAAK;IACVH,IAAI,EAAC,KAAK;IACVF,SAAS,EAAC;KACTI,WAAW,CAACG,OAAO,CAACJ,GAAG,CAAC,CAACK,IAAS,EAAEH,KAAa,kBAC9CtB,6BAAC0B,MAAM;IAACH,GAAG,EAAED,KAAK;IAAEA,KAAK,EAAEA,KAAK;IAAEG,IAAI,EAAEA;IAC3C,CAAC,CAET,CAAC,CACA,eAENzB;IAAKmB,IAAI,EAAC,UAAU;IAACF,SAAS,EAAC,gBAAgB;IAACd,GAAG,EAAES;KAChDL,QAAQ,CACP,CACJ;AAEd,CAAC;;;;"}
+{"version":3,"file":"BaseTable.js","sources":["../../../../../../../../src/components/Table/components/BaseTable.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { HeaderGroup } from 'react-table';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { InternalBaseTable } from '../types';\nimport './Table.css';\nimport { Column } from '../util/renderColumn';\n\nexport const DefaultEmptyState = (): React.ReactNode => null;\n\nexport const BaseTable = React.forwardRef(function BaseTable(props: InternalBaseTable, ref: React.Ref<HTMLDivElement>) {\n    const tableRef = useMergedRef<HTMLDivElement>(ref);\n    const { autoFocus, children, disableSorting: _, headerGroups, headerRef, bodyRef, ...otherProps } = props;\n\n    React.useEffect(() => {\n        if (autoFocus && tableRef.current) {\n            tableRef.current.focus();\n        }\n    }, []);\n\n    const className = cn('yt-table flex flex-col focus:yt-focus focus:rounded-sm', props.className);\n\n    return (\n        <div {...otherProps} role=\"table\" className={className} ref={tableRef}>\n            <div role=\"rowgroup\" className=\"yt-table__head\" ref={headerRef}>\n                {headerGroups?.map((headerGroup: HeaderGroup<object>, index: number) => (\n                    <div\n                        key={index}\n                        role=\"row\"\n                        className=\"border-grey-light flex h-auto min-h-[2.5rem] w-full select-none border-t-0 border-b-2 font-bold\">\n                        {headerGroup.headers.map((cell: any, index: number) => (\n                            <Column key={index} index={index} cell={cell} />\n                        ))}\n                    </div>\n                ))}\n            </div>\n\n            <div role=\"rowgroup\" className=\"yt-table__body\" ref={bodyRef}>\n                {children}\n            </div>\n        </div>\n    );\n});\n"],"names":["DefaultEmptyState","BaseTable","React","forwardRef","props","ref","tableRef","useMergedRef","autoFocus","children","disableSorting","_","headerGroups","headerRef","bodyRef","otherProps","useEffect","current","focus","className","cn","role","map","headerGroup","index","key","headers","cell","Column"],"mappings":";;;;;MAQaA,iBAAiB,GAAG,MAAuB;MAE3CC,SAAS,gBAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,SAAS,CAACG,KAAwB,EAAEC,GAA8B;EACjH,MAAMC,QAAQ,GAAGC,YAAY,CAAiBF,GAAG,CAAC;EAClD,MAAM;IAAEG,SAAS;IAAEC,QAAQ;IAAEC,cAAc,EAAEC,CAAC;IAAEC,YAAY;IAAEC,SAAS;IAAEC,OAAO;IAAE,GAAGC;GAAY,GAAGX,KAAK;EAEzGF,cAAK,CAACc,SAAS,CAAC;IACZ,IAAIR,SAAS,IAAIF,QAAQ,CAACW,OAAO,EAAE;MAC/BX,QAAQ,CAACW,OAAO,CAACC,KAAK,EAAE;;GAE/B,EAAE,EAAE,CAAC;EAEN,MAAMC,SAAS,GAAGC,EAAE,CAAC,wDAAwD,EAAEhB,KAAK,CAACe,SAAS,CAAC;EAE/F,oBACIjB,sDAASa,UAAU;IAAEM,IAAI,EAAC,OAAO;IAACF,SAAS,EAAEA,SAAS;IAAEd,GAAG,EAAEC;mBACzDJ;IAAKmB,IAAI,EAAC,UAAU;IAACF,SAAS,EAAC,gBAAgB;IAACd,GAAG,EAAEQ;KAChDD,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAEU,GAAG,CAAC,CAACC,WAAgC,EAAEC,KAAa,kBAC/DtB;IACIuB,GAAG,EAAED,KAAK;IACVH,IAAI,EAAC,KAAK;IACVF,SAAS,EAAC;KACTI,WAAW,CAACG,OAAO,CAACJ,GAAG,CAAC,CAACK,IAAS,EAAEH,KAAa,kBAC9CtB,6BAAC0B,MAAM;IAACH,GAAG,EAAED,KAAK;IAAEA,KAAK,EAAEA,KAAK;IAAEG,IAAI,EAAEA;IAC3C,CAAC,CAET,CAAC,CACA,eAENzB;IAAKmB,IAAI,EAAC,UAAU;IAACF,SAAS,EAAC,gBAAgB;IAACd,GAAG,EAAES;KAChDL,QAAQ,CACP,CACJ;AAEd,CAAC;;;;"}

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

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../../hooks/useMergedRef.js';
 import { Pagination } from '../../Pagination/Pagination.js';
 import { useTable } from '../hooks/useTable.js';
 import { Row } from '../util/renderRow.js';
@@ -10,7 +10,7 @@ const Table = /*#__PURE__*/React__default.forwardRef(function Table(props, ref)
     emptyStateRenderer = DefaultEmptyState,
     ...otherProps
   } = props;
-  const tableRef = useProxiedRef(ref);
+  const tableRef = useMergedRef(ref);
   const {
     rowProps,
     tableProps,

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

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../../../../../../src/components/Table/components/Table.tsx"],"sourcesContent":["import React from 'react';\nimport { PluginHook } from 'react-table';\nimport { TableProps, InternalTableRow, ForwardedGenericTableWithStatics, TableRef } from '../types';\nimport { useTable } from '../hooks/useTable';\nimport { Pagination } from '../../Pagination/Pagination';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { Row } from '../util/renderRow';\nimport { DefaultEmptyState, BaseTable } from './BaseTable';\n\nexport const Table = React.forwardRef(function Table<T>(\n    props: TableProps<T> & { plugins: PluginHook<{}>[] },\n    ref: React.Ref<TableRef>\n) {\n    const { emptyStateRenderer = DefaultEmptyState, ...otherProps } = props;\n    const tableRef: any = useProxiedRef<HTMLDivElement>(ref);\n    const { rowProps, tableProps, rows, prepareRow, pagination, instance } = useTable(otherProps, tableRef);\n\n    let paginationElement;\n\n    if (pagination) {\n        paginationElement = (\n            <Pagination\n                className=\"my-4 w-full\"\n                length={pagination.length}\n                pageIndex={pagination.pageIndex}\n                pageSize={pagination.pageSize}\n                setPageIndex={pagination.setPageIndex}\n                setPageSize={pagination.setPageSize}\n                showPageControls={pagination.length > pagination.pageSize}\n                dangerouslyHijackGlobalKeyboardNavigation={props.dangerouslyHijackGlobalKeyboardNavigation}\n            />\n        );\n    }\n\n    return (\n        <>\n            {paginationElement}\n            <BaseTable {...tableProps} ref={tableRef}>\n                {rows.length\n                    ? rows.map((row: InternalTableRow, index: number) => {\n                          prepareRow(row, index);\n                          return (\n                              <Row\n                                  {...rowProps}\n                                  key={index}\n                                  index={index}\n                                  row={row}\n                                  instance={instance}\n                                  headerGroups={tableProps.headerGroups}\n                              />\n                          );\n                      })\n                    : emptyStateRenderer()}\n            </BaseTable>\n            {paginationElement}\n        </>\n    );\n}) as ForwardedGenericTableWithStatics;\n\nTable.Column = () => null;\nTable.Group = () => null;\n"],"names":["Table","React","forwardRef","props","ref","emptyStateRenderer","DefaultEmptyState","otherProps","tableRef","useProxiedRef","rowProps","tableProps","rows","prepareRow","pagination","instance","useTable","paginationElement","Pagination","className","length","pageIndex","pageSize","setPageIndex","setPageSize","showPageControls","dangerouslyHijackGlobalKeyboardNavigation","BaseTable","map","row","index","Row","key","headerGroups","Column","Group"],"mappings":";;;;;;;MASaA,KAAK,gBAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,KAAK,CAChDG,KAAoD,EACpDC,GAAwB;EAExB,MAAM;IAAEC,kBAAkB,GAAGC,iBAAiB;IAAE,GAAGC;GAAY,GAAGJ,KAAK;EACvE,MAAMK,QAAQ,GAAQC,aAAa,CAAiBL,GAAG,CAAC;EACxD,MAAM;IAAEM,QAAQ;IAAEC,UAAU;IAAEC,IAAI;IAAEC,UAAU;IAAEC,UAAU;IAAEC;GAAU,GAAGC,QAAQ,CAACT,UAAU,EAAEC,QAAQ,CAAC;EAEvG,IAAIS,iBAAiB;EAErB,IAAIH,UAAU,EAAE;IACZG,iBAAiB,gBACbhB,6BAACiB,UAAU;MACPC,SAAS,EAAC,aAAa;MACvBC,MAAM,EAAEN,UAAU,CAACM,MAAM;MACzBC,SAAS,EAAEP,UAAU,CAACO,SAAS;MAC/BC,QAAQ,EAAER,UAAU,CAACQ,QAAQ;MAC7BC,YAAY,EAAET,UAAU,CAACS,YAAY;MACrCC,WAAW,EAAEV,UAAU,CAACU,WAAW;MACnCC,gBAAgB,EAAEX,UAAU,CAACM,MAAM,GAAGN,UAAU,CAACQ,QAAQ;MACzDI,yCAAyC,EAAEvB,KAAK,CAACuB;MAExD;;EAGL,oBACIzB,4DACKgB,iBAAiB,eAClBhB,6BAAC0B,SAAS,oBAAKhB,UAAU;IAAEP,GAAG,EAAEI;MAC3BI,IAAI,CAACQ,MAAM,GACNR,IAAI,CAACgB,GAAG,CAAC,CAACC,GAAqB,EAAEC,KAAa;IAC1CjB,UAAU,CAACgB,GAAG,EAAEC,KAAK,CAAC;IACtB,oBACI7B,6BAAC8B,GAAG,oBACIrB,QAAQ;MACZsB,GAAG,EAAEF,KAAK;MACVA,KAAK,EAAEA,KAAK;MACZD,GAAG,EAAEA,GAAG;MACRd,QAAQ,EAAEA,QAAQ;MAClBkB,YAAY,EAAEtB,UAAU,CAACsB;OAC3B;GAET,CAAC,GACF5B,kBAAkB,EAAE,CAClB,EACXY,iBAAiB,CACnB;AAEX,CAAC;AAEDjB,KAAK,CAACkC,MAAM,GAAG,MAAM,IAAI;AACzBlC,KAAK,CAACmC,KAAK,GAAG,MAAM,IAAI;;;;"}
+{"version":3,"file":"Table.js","sources":["../../../../../../../../src/components/Table/components/Table.tsx"],"sourcesContent":["import React from 'react';\nimport { PluginHook } from 'react-table';\nimport { TableProps, InternalTableRow, ForwardedGenericTableWithStatics, TableRef } from '../types';\nimport { useTable } from '../hooks/useTable';\nimport { Pagination } from '../../Pagination/Pagination';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { Row } from '../util/renderRow';\nimport { DefaultEmptyState, BaseTable } from './BaseTable';\n\nexport const Table = React.forwardRef(function Table<T>(\n    props: TableProps<T> & { plugins: PluginHook<{}>[] },\n    ref: React.Ref<TableRef>\n) {\n    const { emptyStateRenderer = DefaultEmptyState, ...otherProps } = props;\n    const tableRef: any = useMergedRef<HTMLDivElement>(ref);\n    const { rowProps, tableProps, rows, prepareRow, pagination, instance } = useTable(otherProps, tableRef);\n\n    let paginationElement;\n\n    if (pagination) {\n        paginationElement = (\n            <Pagination\n                className=\"my-4 w-full\"\n                length={pagination.length}\n                pageIndex={pagination.pageIndex}\n                pageSize={pagination.pageSize}\n                setPageIndex={pagination.setPageIndex}\n                setPageSize={pagination.setPageSize}\n                showPageControls={pagination.length > pagination.pageSize}\n                dangerouslyHijackGlobalKeyboardNavigation={props.dangerouslyHijackGlobalKeyboardNavigation}\n            />\n        );\n    }\n\n    return (\n        <>\n            {paginationElement}\n            <BaseTable {...tableProps} ref={tableRef}>\n                {rows.length\n                    ? rows.map((row: InternalTableRow, index: number) => {\n                          prepareRow(row, index);\n                          return (\n                              <Row\n                                  {...rowProps}\n                                  key={index}\n                                  index={index}\n                                  row={row}\n                                  instance={instance}\n                                  headerGroups={tableProps.headerGroups}\n                              />\n                          );\n                      })\n                    : emptyStateRenderer()}\n            </BaseTable>\n            {paginationElement}\n        </>\n    );\n}) as ForwardedGenericTableWithStatics;\n\nTable.Column = () => null;\nTable.Group = () => null;\n"],"names":["Table","React","forwardRef","props","ref","emptyStateRenderer","DefaultEmptyState","otherProps","tableRef","useMergedRef","rowProps","tableProps","rows","prepareRow","pagination","instance","useTable","paginationElement","Pagination","className","length","pageIndex","pageSize","setPageIndex","setPageSize","showPageControls","dangerouslyHijackGlobalKeyboardNavigation","BaseTable","map","row","index","Row","key","headerGroups","Column","Group"],"mappings":";;;;;;;MASaA,KAAK,gBAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,KAAK,CAChDG,KAAoD,EACpDC,GAAwB;EAExB,MAAM;IAAEC,kBAAkB,GAAGC,iBAAiB;IAAE,GAAGC;GAAY,GAAGJ,KAAK;EACvE,MAAMK,QAAQ,GAAQC,YAAY,CAAiBL,GAAG,CAAC;EACvD,MAAM;IAAEM,QAAQ;IAAEC,UAAU;IAAEC,IAAI;IAAEC,UAAU;IAAEC,UAAU;IAAEC;GAAU,GAAGC,QAAQ,CAACT,UAAU,EAAEC,QAAQ,CAAC;EAEvG,IAAIS,iBAAiB;EAErB,IAAIH,UAAU,EAAE;IACZG,iBAAiB,gBACbhB,6BAACiB,UAAU;MACPC,SAAS,EAAC,aAAa;MACvBC,MAAM,EAAEN,UAAU,CAACM,MAAM;MACzBC,SAAS,EAAEP,UAAU,CAACO,SAAS;MAC/BC,QAAQ,EAAER,UAAU,CAACQ,QAAQ;MAC7BC,YAAY,EAAET,UAAU,CAACS,YAAY;MACrCC,WAAW,EAAEV,UAAU,CAACU,WAAW;MACnCC,gBAAgB,EAAEX,UAAU,CAACM,MAAM,GAAGN,UAAU,CAACQ,QAAQ;MACzDI,yCAAyC,EAAEvB,KAAK,CAACuB;MAExD;;EAGL,oBACIzB,4DACKgB,iBAAiB,eAClBhB,6BAAC0B,SAAS,oBAAKhB,UAAU;IAAEP,GAAG,EAAEI;MAC3BI,IAAI,CAACQ,MAAM,GACNR,IAAI,CAACgB,GAAG,CAAC,CAACC,GAAqB,EAAEC,KAAa;IAC1CjB,UAAU,CAACgB,GAAG,EAAEC,KAAK,CAAC;IACtB,oBACI7B,6BAAC8B,GAAG,oBACIrB,QAAQ;MACZsB,GAAG,EAAEF,KAAK;MACVA,KAAK,EAAEA,KAAK;MACZD,GAAG,EAAEA,GAAG;MACRd,QAAQ,EAAEA,QAAQ;MAClBkB,YAAY,EAAEtB,UAAU,CAACsB;OAC3B;GAET,CAAC,GACF5B,kBAAkB,EAAE,CAClB,EACXY,iBAAiB,CACnB;AAEX,CAAC;AAEDjB,KAAK,CAACkC,MAAM,GAAG,MAAM,IAAI;AACzBlC,KAAK,CAACmC,KAAK,GAAG,MAAM,IAAI;;;;"}

package/dist/esm/packages/taco/src/components/Table/components/WindowedTable.js

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../../Provider/Provider.js';
-import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useMergedRef } from '../../../hooks/useMergedRef.js';
 import { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener.js';
 import { useTable } from '../hooks/useTable.js';
 import { Row } from '../util/renderRow.js';
@@ -64,7 +64,7 @@ const getAverageRowHeight = (rowHeights = {}) => {
   return estimatedHeight / keys.length;
 };
 const WindowedTable = /*#__PURE__*/React__default.forwardRef(function WindowedTable(props, ref) {
-  const tableRef = useProxiedRef(ref);
+  const tableRef = useMergedRef(ref);
   const {
     emptyStateRenderer = DefaultEmptyState,
     length,