@economic/taco 12.0.0 → 14.0.0-tanstack-virtual-update.0

package/dist/components/Combobox/useCombobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCombobox.js","sources":["../../../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["import debounce from 'lodash/debounce';\nimport { nanoid } from 'nanoid';\nimport * as React from 'react';\n\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { isElementInsideTable3OrReport } from '../../utils/dom';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport type { InputProps } from '../Input/Input';\nimport type { ScrollableListItem, ScrollableListItemValue, ScrollableListPropsWithRef } from '../Listbox/ScrollableList';\nimport { getId } from '../Listbox/ScrollableList';\nimport {\n    setInputValueByRef,\n    getIndexFromValue,\n    findByValue,\n    useFlattenedData,\n    sanitizeItem,\n    getOptionParents,\n    filterData,\n} from '../Listbox/util';\n\nimport type { ComboboxProps } from './Combobox';\n\nconst debouncer = debounce(f => f(), 200);\n\nconst defaultConvertToInputValue = (value: ScrollableListItemValue | undefined) => String(value ?? '');\n\ntype useCombobox = Omit<React.HTMLAttributes<HTMLDivElement>, 'popover'> & {\n    combobox: React.HTMLAttributes<HTMLSpanElement>;\n    input: Omit<InputProps, 'defaultValue'> & { ref: React.RefObject<HTMLInputElement> };\n    list: ScrollableListPropsWithRef;\n    button: { ref: any };\n    popover: { open: boolean; onOpenChange: (open: boolean) => void };\n};\n\nexport const useCombobox = (props: Omit<ComboboxProps, 'dialog'>, ref: React.Ref<HTMLInputElement>): useCombobox => {\n    const {\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data: unfilteredData = [],\n        defaultValue,\n        disabled,\n        id: _nativeId,\n        inline,\n        loading: __,\n        onChange,\n        onClick,\n        onKeyDown,\n        onSearch,\n        readOnly,\n        value,\n        valueRenderer,\n        ...otherProps\n    } = props;\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const buttonRef = React.useRef<HTMLButtonElement>(null);\n    const listRef = React.useRef<HTMLUListElement>(null);\n    const [open, setOpen] = React.useState(false);\n    const listId = React.useMemo(() => nanoid(), []);\n    const flattenedData = useFlattenedData(unfilteredData);\n\n    const convertToInputValue = React.useCallback(\n        (val: ScrollableListItemValue | undefined): string => {\n            const option = findByValue(flattenedData, val);\n            if (typeof valueRenderer === 'function' && option) {\n                return valueRenderer(option);\n            }\n            return defaultConvertToInputValue(val);\n        },\n        [valueRenderer, flattenedData]\n    );\n\n    const [inputValue, setInputValue] = React.useState<string>(convertToInputValue(value));\n    const shouldFilterData = !onSearch && (!inline || (inline && inputValue !== convertToInputValue(value)));\n    const data = React.useMemo(\n        () => (shouldFilterData ? filterData(flattenedData, inputValue) : flattenedData),\n        [shouldFilterData, inputValue, flattenedData]\n    );\n    // listbox/select change value _with_ the index, but combobox changes on select of an index (click/enter), so we need state\n    const [currentIndex, setCurrentIndex] = React.useState<number | undefined>(\n        inputValue === undefined ? undefined : getIndexFromValue(data, inputValue)\n    );\n\n    const setInputValueByIndex = (index: number | undefined, event?: string): void => {\n        if (index !== undefined) {\n            const option = data[index];\n\n            if (option && !option.disabled) {\n                const eventType = event ?? 'focusout';\n                setInputValueByRef(inputRef.current, option.value, eventType);\n            }\n        }\n    };\n\n    const setCurrentValue = (index: number | undefined, event?: string) => {\n        if (index === undefined) {\n            return;\n        }\n\n        const option = data[index];\n\n        if (option?.value === value) {\n            // if the selected option is already selected, refill input with its value\n            setInputValue(convertToInputValue(value));\n        } else {\n            // if the selected option is not already selected, trigger blur event\n            setInputValueByIndex(index, event);\n        }\n    };\n\n    // ensure the external value is synced with the internal value when mounting, e.g. incase a default value was set\n    React.useEffect(() => {\n        if (defaultValue && !value) {\n            setInputValueByIndex(getIndexFromValue(data, defaultValue));\n        }\n    }, [data]);\n\n    // Sync input text when `value` changes externally, during render (not in an effect) so it's correct before the\n    // \"show listbox\" effect below — otherwise a one-render stale-text window can open the popover on reset.\n    const [prevValue, setPrevValue] = React.useState(value);\n    if (value !== prevValue) {\n        setPrevValue(value);\n\n        if (value !== undefined) {\n            // Compare rendered values to handle valueRenderer (e.g. \"1000\" renders as \"1000 - Account Name\").\n            const renderedValue = convertToInputValue(value);\n            if (renderedValue !== inputValue) {\n                setInputValue(renderedValue);\n            }\n        } else if (prevValue !== undefined && inputValue === convertToInputValue(prevValue)) {\n            // `value` was cleared externally and the input still shows its previous rendered text (not user-typed),\n            // so clear it. Text the user typed never matches the previous render, so it's preserved.\n            if (inputValue !== '') {\n                setInputValue('');\n            }\n        }\n    }\n\n    React.useEffect(() => {\n        if (onSearch) {\n            debouncer(() => {\n                onSearch(inputValue);\n            });\n        }\n    }, [inputValue]);\n\n    // show listbox based on input value\n    React.useEffect(() => {\n        // don't show the popover if the internal (input) value already is the current value\n        // this prevents the popover showing after selecting a value or pressing escape\n        const isCurrentValue = value !== undefined && value !== null && inputValue === convertToInputValue(value);\n\n        if (inputValue && data.length && !isCurrentValue) {\n            setCurrentIndex(getIndexFromValue(data, inputValue) || 0);\n\n            if (!open) {\n                setOpen(true);\n            }\n        } else {\n            setOpen(false);\n        }\n    }, [inputValue, data]);\n\n    React.useEffect(() => {\n        if (open) {\n            setCurrentIndex(getIndexFromValue(data, inputValue) || 0);\n        } else {\n            setCurrentIndex(undefined);\n        }\n    }, [open]);\n\n    const findOption = React.useCallback(\n        (inputVal: string): ScrollableListItem | undefined => {\n            // First try to find by raw value\n            const itemByValue = findByValue(flattenedData, inputVal);\n            if (itemByValue) {\n                return itemByValue;\n            }\n\n            // If valueRenderer is provided, also try to match against rendered values\n            if (valueRenderer) {\n                return flattenedData.find(option => valueRenderer(option) === inputVal);\n            }\n\n            return undefined;\n        },\n        [flattenedData, valueRenderer]\n    );\n\n    // event handlers\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n        if (listRef.current && event.relatedTarget === listRef.current) {\n            event.preventDefault();\n            return;\n        }\n\n        const item = findOption(event.target.value);\n\n        // If the found item's value equals the current value, just update the display to rendered format\n        // This handles the case where user types the raw value but valueRenderer shows something different\n        // (e.g., user types \"1000\" but display should be \"1000 - Account Name\")\n        if (item && item.value === value) {\n            setInputValue(convertToInputValue(value));\n            if (props.onBlur) {\n                props.onBlur(event);\n            }\n            return;\n        }\n\n        // event.target.value is always a string so it is important to cast value to a string (convertToInputValue) before checking the equality\n        if (onChange && event.target.value !== convertToInputValue(value)) {\n            (event as any).detail = sanitizeItem(item);\n\n            const parents = getOptionParents(flattenedData, item?.path);\n\n            if (parents !== null && parents.length > 0) {\n                (event as any).detail.parents = parents;\n            }\n\n            onChange(event);\n        }\n\n        if (props.onBlur) {\n            props.onBlur(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        setInputValue(event.target.value);\n    };\n\n    const handleInputClick = (event: React.MouseEvent<HTMLInputElement>): void => {\n        if (inline || (!open && inputValue && data.length)) {\n            setOpen(true);\n        }\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        // Explicitly stop propagation for arrow keys when Combobox is in open state and inside Table3\n        // This ensures Table3 won't react to these keys when using the Combobox\n        if (\n            isElementInsideTable3OrReport(event.currentTarget) &&\n            (event.key === 'ArrowUp' || event.key === 'ArrowDown') &&\n            open\n        ) {\n            event.stopPropagation();\n        }\n\n        if (!event.ctrlKey && !event.metaKey) {\n            switch (event.key) {\n                case 'Backspace': {\n                    return;\n                }\n\n                case 'Escape': {\n                    event.preventDefault();\n                    if (open) {\n                        // as focus is on input, need to prevent propagation to not close dialog.\n                        event.stopPropagation();\n                    }\n                    setInputValue(convertToInputValue(value));\n                    setOpen(false);\n                    return;\n                }\n\n                case 'Tab': {\n                    // default focusout will trigger onBlur and we don't want to trigger it twice\n                    setCurrentValue(currentIndex, 'change');\n                    setOpen(false);\n                    return;\n                }\n\n                case 'Enter': {\n                    event.preventDefault();\n\n                    if (isElementInsideTable3OrReport(event.currentTarget)) {\n                        if (inline && !open) {\n                            setOpen(true);\n                        } else if (buttonRef.current && !open) {\n                            buttonRef.current.click();\n                        }\n                    }\n\n                    if (open) {\n                        // we need to focusout to trigger onBlur as we are not actually blurring the input\n                        setCurrentValue(currentIndex, 'focusout');\n                        setOpen(false);\n                    }\n\n                    return;\n                }\n\n                case 'ArrowDown':\n                    if (open) {\n                        event.preventDefault();\n                    } else if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {\n                        buttonRef.current.click();\n                    }\n                    break;\n\n                case 'ArrowUp':\n                case 'Home':\n                case 'End': {\n                    if (open) {\n                        event.preventDefault();\n                    }\n                    break;\n                }\n\n                default:\n            }\n\n            // we aren't focused on the list, so manually forward the keydown event to it\n            if (listRef.current) {\n                listRef.current.dispatchEvent(createCustomKeyboardEvent(event));\n            }\n\n            if (\n                inline &&\n                !open &&\n                (event.key === 'ArrowUp' || event.key === 'ArrowDown') &&\n                !isElementInsideTable3OrReport(event.currentTarget)\n            ) {\n                event.preventDefault();\n                const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;\n                setCurrentIndex(currentIndex === undefined ? initialIndex : currentIndex);\n                setOpen(true);\n            }\n        }\n\n        if (!event.isDefaultPrevented() && onKeyDown) {\n            onKeyDown(event);\n        }\n    };\n\n    const handleListboxChange = (index: number): void => {\n        setCurrentIndex(index);\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>, index: number): void => {\n        event.preventDefault();\n        setCurrentValue(index);\n        setOpen(false);\n    };\n\n    const combobox = {\n        'aria-expanded': open,\n        'aria-owns': listId,\n        'aria-haspopup': 'listbox' as const,\n        role: 'combobox',\n    };\n\n    const input = {\n        ...otherProps,\n        'aria-controls': listId,\n        // Indicates that the autocomplete behavior of the text input is to suggest a list of possible values in a popup and that the suggestions\n        // are related to the string that is present in the textbox\n        'aria-autocomplete': 'list' as const,\n        // Enables assistive technologies to know which element the application regards as focused while DOM focus remains on the input element\n        'aria-activedescendant':\n            currentIndex !== undefined && data[currentIndex] ? getId(listId, String(data[currentIndex].value)) : undefined,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        disabled,\n        onBlur: !disabled && !readOnly ? handleInputBlur : undefined,\n        onChange: !disabled && !readOnly ? handleInputChange : undefined,\n        onClick: !disabled && !readOnly ? handleInputClick : undefined,\n        onKeyDownCapture: !disabled && !readOnly ? handleInputKeyDown : undefined,\n        readOnly,\n        ref: inputRef,\n        type: 'text',\n        value: inputValue ?? '',\n    };\n\n    const list: ScrollableListPropsWithRef = {\n        'aria-labelledby': ariaLabelledBy,\n        data,\n        disabled,\n        id: listId,\n        onChange: handleListboxChange,\n        onClick: handleListboxClick,\n        ref: listRef,\n        scrollOnFocus: false,\n        tabIndex: -1,\n        value: currentIndex,\n    };\n\n    const button = {\n        ref: buttonRef,\n    };\n\n    return {\n        combobox,\n        input,\n        list,\n        button,\n        popover: {\n            open,\n            onOpenChange: setOpen,\n            //visible: !data.length ? false : open,\n        },\n    };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useCombobox.js","sources":["../../../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["import debounce from 'lodash/debounce';\nimport { nanoid } from 'nanoid';\nimport * as React from 'react';\n\nimport type { InputProps } from '@/components';\nimport type {\n    ScrollableListItem,\n    ScrollableListItemValue,\n    ScrollableListPropsWithRef,\n} from '@/components/Listbox/ScrollableList';\nimport { getId } from '@/components/Listbox/ScrollableList';\nimport {\n    setInputValueByRef,\n    getIndexFromValue,\n    findByValue,\n    useFlattenedData,\n    sanitizeItem,\n    getOptionParents,\n    filterData,\n} from '@/components/Listbox/util';\nimport { useMergedRef } from '@/hooks/useMergedRef';\nimport { isElementInsideTable3OrReport } from '@/utils/dom';\nimport { createCustomKeyboardEvent } from '@/utils/input';\n\nimport type { ComboboxProps } from './Combobox';\n\nconst debouncer = debounce(f => f(), 200);\n\nconst defaultConvertToInputValue = (value: ScrollableListItemValue | undefined) => String(value ?? '');\n\ntype useCombobox = Omit<React.HTMLAttributes<HTMLDivElement>, 'popover'> & {\n    combobox: React.HTMLAttributes<HTMLSpanElement>;\n    input: Omit<InputProps, 'defaultValue'> & { ref: React.RefObject<HTMLInputElement> };\n    list: ScrollableListPropsWithRef;\n    button: { ref: any };\n    popover: { open: boolean; onOpenChange: (open: boolean) => void };\n};\n\nexport const useCombobox = (props: Omit<ComboboxProps, 'dialog'>, ref: React.Ref<HTMLInputElement>): useCombobox => {\n    const {\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data: unfilteredData = [],\n        defaultValue,\n        disabled,\n        id: _nativeId,\n        inline,\n        loading: __,\n        onChange,\n        onClick,\n        onKeyDown,\n        onSearch,\n        readOnly,\n        value,\n        valueRenderer,\n        ...otherProps\n    } = props;\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const buttonRef = React.useRef<HTMLButtonElement>(null);\n    const listRef = React.useRef<HTMLUListElement>(null);\n    const [open, setOpen] = React.useState(false);\n    const listId = React.useMemo(() => nanoid(), []);\n    const flattenedData = useFlattenedData(unfilteredData);\n\n    const convertToInputValue = React.useCallback(\n        (val: ScrollableListItemValue | undefined): string => {\n            const option = findByValue(flattenedData, val);\n            if (typeof valueRenderer === 'function' && option) {\n                return valueRenderer(option);\n            }\n            return defaultConvertToInputValue(val);\n        },\n        [valueRenderer, flattenedData]\n    );\n\n    const [inputValue, setInputValue] = React.useState<string>(convertToInputValue(value));\n    const shouldFilterData = !onSearch && (!inline || (inline && inputValue !== convertToInputValue(value)));\n    const data = React.useMemo(\n        () => (shouldFilterData ? filterData(flattenedData, inputValue) : flattenedData),\n        [shouldFilterData, inputValue, flattenedData]\n    );\n    // listbox/select change value _with_ the index, but combobox changes on select of an index (click/enter), so we need state\n    const [currentIndex, setCurrentIndex] = React.useState<number | undefined>(\n        inputValue === undefined ? undefined : getIndexFromValue(data, inputValue)\n    );\n\n    const setInputValueByIndex = (index: number | undefined, event?: string): void => {\n        if (index !== undefined) {\n            const option = data[index];\n\n            if (option && !option.disabled) {\n                const eventType = event ?? 'focusout';\n                setInputValueByRef(inputRef.current, option.value, eventType);\n            }\n        }\n    };\n\n    const setCurrentValue = (index: number | undefined, event?: string) => {\n        if (index === undefined) {\n            return;\n        }\n\n        const option = data[index];\n\n        if (option?.value === value) {\n            // if the selected option is already selected, refill input with its value\n            setInputValue(convertToInputValue(value));\n        } else {\n            // if the selected option is not already selected, trigger blur event\n            setInputValueByIndex(index, event);\n        }\n    };\n\n    // ensure the external value is synced with the internal value when mounting, e.g. incase a default value was set\n    React.useEffect(() => {\n        if (defaultValue && !value) {\n            setInputValueByIndex(getIndexFromValue(data, defaultValue));\n        }\n    }, [data]);\n\n    // Sync input text when `value` changes externally, during render (not in an effect) so it's correct before the\n    // \"show listbox\" effect below — otherwise a one-render stale-text window can open the popover on reset.\n    const [prevValue, setPrevValue] = React.useState(value);\n    if (value !== prevValue) {\n        setPrevValue(value);\n\n        if (value !== undefined) {\n            // Compare rendered values to handle valueRenderer (e.g. \"1000\" renders as \"1000 - Account Name\").\n            const renderedValue = convertToInputValue(value);\n            if (renderedValue !== inputValue) {\n                setInputValue(renderedValue);\n            }\n        } else if (prevValue !== undefined && inputValue === convertToInputValue(prevValue)) {\n            // `value` was cleared externally and the input still shows its previous rendered text (not user-typed),\n            // so clear it. Text the user typed never matches the previous render, so it's preserved.\n            if (inputValue !== '') {\n                setInputValue('');\n            }\n        }\n    }\n\n    React.useEffect(() => {\n        if (onSearch) {\n            debouncer(() => {\n                onSearch(inputValue);\n            });\n        }\n    }, [inputValue]);\n\n    // show listbox based on input value\n    React.useEffect(() => {\n        // don't show the popover if the internal (input) value already is the current value\n        // this prevents the popover showing after selecting a value or pressing escape\n        const isCurrentValue = value !== undefined && value !== null && inputValue === convertToInputValue(value);\n\n        if (inputValue && data.length && !isCurrentValue) {\n            setCurrentIndex(getIndexFromValue(data, inputValue) || 0);\n\n            if (!open) {\n                setOpen(true);\n            }\n        } else {\n            setOpen(false);\n        }\n        // `value` commits one render after the input on Tab/select; without it in the deps the guard\n        // reopens the popover with a stale `value` and never re-runs to close it. EC-83328\n    }, [inputValue, data, value]);\n\n    React.useEffect(() => {\n        if (open) {\n            setCurrentIndex(getIndexFromValue(data, inputValue) || 0);\n        } else {\n            setCurrentIndex(undefined);\n        }\n    }, [open]);\n\n    const findOption = React.useCallback(\n        (inputVal: string): ScrollableListItem | undefined => {\n            // First try to find by raw value\n            const itemByValue = findByValue(flattenedData, inputVal);\n            if (itemByValue) {\n                return itemByValue;\n            }\n\n            // If valueRenderer is provided, also try to match against rendered values\n            if (valueRenderer) {\n                return flattenedData.find(option => valueRenderer(option) === inputVal);\n            }\n\n            return undefined;\n        },\n        [flattenedData, valueRenderer]\n    );\n\n    // event handlers\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n        if (listRef.current && event.relatedTarget === listRef.current) {\n            event.preventDefault();\n            return;\n        }\n\n        const item = findOption(event.target.value);\n\n        // If the found item's value equals the current value, just update the display to rendered format\n        // This handles the case where user types the raw value but valueRenderer shows something different\n        // (e.g., user types \"1000\" but display should be \"1000 - Account Name\")\n        if (item && item.value === value) {\n            setInputValue(convertToInputValue(value));\n            if (props.onBlur) {\n                props.onBlur(event);\n            }\n            return;\n        }\n\n        // event.target.value is always a string so it is important to cast value to a string (convertToInputValue) before checking the equality\n        if (onChange && event.target.value !== convertToInputValue(value)) {\n            (event as any).detail = sanitizeItem(item);\n\n            const parents = getOptionParents(flattenedData, item?.path);\n\n            if (parents !== null && parents.length > 0) {\n                (event as any).detail.parents = parents;\n            }\n\n            onChange(event);\n        }\n\n        if (props.onBlur) {\n            props.onBlur(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        setInputValue(event.target.value);\n    };\n\n    const handleInputClick = (event: React.MouseEvent<HTMLInputElement>): void => {\n        if (inline || (!open && inputValue && data.length)) {\n            setOpen(true);\n        }\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        // Explicitly stop propagation for arrow keys when Combobox is in open state and inside Table3\n        // This ensures Table3 won't react to these keys when using the Combobox\n        if (\n            isElementInsideTable3OrReport(event.currentTarget) &&\n            (event.key === 'ArrowUp' || event.key === 'ArrowDown') &&\n            open\n        ) {\n            event.stopPropagation();\n        }\n\n        if (!event.ctrlKey && !event.metaKey) {\n            switch (event.key) {\n                case 'Backspace': {\n                    return;\n                }\n\n                case 'Escape': {\n                    event.preventDefault();\n                    if (open) {\n                        // as focus is on input, need to prevent propagation to not close dialog.\n                        event.stopPropagation();\n                    }\n                    setInputValue(convertToInputValue(value));\n                    setOpen(false);\n                    return;\n                }\n\n                case 'Tab': {\n                    // default focusout will trigger onBlur and we don't want to trigger it twice\n                    setCurrentValue(currentIndex, 'change');\n                    setOpen(false);\n                    return;\n                }\n\n                case 'Enter': {\n                    event.preventDefault();\n\n                    if (isElementInsideTable3OrReport(event.currentTarget)) {\n                        if (inline && !open) {\n                            setOpen(true);\n                        } else if (buttonRef.current && !open) {\n                            buttonRef.current.click();\n                        }\n                    }\n\n                    if (open) {\n                        // we need to focusout to trigger onBlur as we are not actually blurring the input\n                        setCurrentValue(currentIndex, 'focusout');\n                        setOpen(false);\n                    }\n\n                    return;\n                }\n\n                case 'ArrowDown':\n                    if (open) {\n                        event.preventDefault();\n                    } else if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {\n                        buttonRef.current.click();\n                    }\n                    break;\n\n                case 'ArrowUp':\n                case 'Home':\n                case 'End': {\n                    if (open) {\n                        event.preventDefault();\n                    }\n                    break;\n                }\n\n                default:\n            }\n\n            // we aren't focused on the list, so manually forward the keydown event to it\n            if (listRef.current) {\n                listRef.current.dispatchEvent(createCustomKeyboardEvent(event));\n            }\n\n            if (\n                inline &&\n                !open &&\n                (event.key === 'ArrowUp' || event.key === 'ArrowDown') &&\n                !isElementInsideTable3OrReport(event.currentTarget)\n            ) {\n                event.preventDefault();\n                const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;\n                setCurrentIndex(currentIndex === undefined ? initialIndex : currentIndex);\n                setOpen(true);\n            }\n        }\n\n        if (!event.isDefaultPrevented() && onKeyDown) {\n            onKeyDown(event);\n        }\n    };\n\n    const handleListboxChange = (index: number): void => {\n        setCurrentIndex(index);\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>, index: number): void => {\n        event.preventDefault();\n        setCurrentValue(index);\n        setOpen(false);\n    };\n\n    const combobox = {\n        'aria-expanded': open,\n        'aria-owns': listId,\n        'aria-haspopup': 'listbox' as const,\n        role: 'combobox',\n    };\n\n    const input = {\n        ...otherProps,\n        'aria-controls': listId,\n        // Indicates that the autocomplete behavior of the text input is to suggest a list of possible values in a popup and that the suggestions\n        // are related to the string that is present in the textbox\n        'aria-autocomplete': 'list' as const,\n        // Enables assistive technologies to know which element the application regards as focused while DOM focus remains on the input element\n        'aria-activedescendant':\n            currentIndex !== undefined && data[currentIndex] ? getId(listId, String(data[currentIndex].value)) : undefined,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        disabled,\n        onBlur: !disabled && !readOnly ? handleInputBlur : undefined,\n        onChange: !disabled && !readOnly ? handleInputChange : undefined,\n        onClick: !disabled && !readOnly ? handleInputClick : undefined,\n        onKeyDownCapture: !disabled && !readOnly ? handleInputKeyDown : undefined,\n        readOnly,\n        ref: inputRef,\n        type: 'text',\n        value: inputValue ?? '',\n    };\n\n    const list: ScrollableListPropsWithRef = {\n        'aria-labelledby': ariaLabelledBy,\n        data,\n        disabled,\n        id: listId,\n        onChange: handleListboxChange,\n        onClick: handleListboxClick,\n        ref: listRef,\n        scrollOnFocus: false,\n        tabIndex: -1,\n        value: currentIndex,\n    };\n\n    const button = {\n        ref: buttonRef,\n    };\n\n    return {\n        combobox,\n        input,\n        list,\n        button,\n        popover: {\n            open,\n            onOpenChange: setOpen,\n            //visible: !data.length ? false : open,\n        },\n    };\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Datepicker/Datepicker.cjs

@@ -3,11 +3,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const popover = require("@base-ui/react/popover");
 const cn = require("clsx");
 const React = require("react");
-const Calendar = require("../Calendar/Calendar.cjs");
+const useDatepicker = require("./useDatepicker.cjs");
+const Localization = require("../Provider/Localization.cjs");
 const Input = require("../Input/Input.cjs");
 const IconButton = require("../LegacyComponents/IconButton/IconButton.cjs");
-const Localization = require("../Provider/Localization.cjs");
-const useDatepicker = require("./useDatepicker.cjs");
+const Calendar = require("../Calendar/Calendar.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {

package/dist/components/Datepicker/Datepicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Datepicker.cjs","sources":["../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { CalendarProps } from '../Calendar/Calendar';\nimport { Calendar } from '../Calendar/Calendar';\nimport type { InputProps } from '../Input/Input';\nimport { Input } from '../Input/Input';\nimport { LegacyIconButton } from '../LegacyComponents/IconButton/IconButton';\nimport { useLocalization } from '../Provider/Localization';\n\nimport { useDatepicker } from './useDatepicker';\n\nexport type DatepickerTexts = {\n    /** Aria-label for calendar */\n    calendar: string;\n    /** Clear button text */\n    clear: string;\n    /**\n     * Aria-label for calendar icon button in the input.\n     * Calendar will open when user clicks this icon button.\n     */\n    expand: string;\n    /** Shortcut heading text */\n    shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n    onClick: (event: React.MouseEvent) => void;\n    text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n    /** [Calendar](component:calendar) component associated with the DatePicker */\n    calendar?: CalendarProps;\n    /** List of shortcuts */\n    shortcuts?: DatePickerShortcut[];\n    /** Title for the shortcuts panel */\n    shortcutsText?: string;\n    /** Handler to be called when the clear button is clicked */\n    onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    /**\n     * Date value of the calendar.\n     * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n     */\n    value?: Date | string;\n};\n\nconst PopoverArrow = () => (\n    <PopoverPrimitive.Arrow className=\"data-[side=bottom]:top-[-8px] data-[side=left]:right-[-13px] data-[side=right]:left-[-13px] data-[side=top]:bottom-[-8px] data-[side=left]:rotate-90 data-[side=right]:-rotate-90 data-[side=top]:rotate-180\">\n        <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\">\n            <path\n                d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n                className=\"fill-[canvas]\"\n            />\n            <path\n                d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n                className=\"fill-gray-200\"\n            />\n            <path d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\" />\n        </svg>\n    </PopoverPrimitive.Arrow>\n);\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n    const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n    const { calendar, input } = useDatepicker(otherProps, ref);\n    const [open, setOpen] = React.useState(false);\n\n    const { texts } = useLocalization();\n    const className = cn('inline-flex w-full font-normal text-black', externalClassName);\n    const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n    const handlePopoverClick = React.useCallback((event: React.MouseEvent) => {\n        // Prevent the mouse click event from bubbling up to the parent element\n        event.stopPropagation();\n    }, []);\n\n    const handleCloseAutoFocus = () => input.ref.current;\n\n    const handleOpenAutoFocus = () => {\n        const currentDay: HTMLButtonElement | null = popoverContentRef?.current?.querySelector('td.rdp-selected button') ?? null;\n\n        return currentDay;\n    };\n\n    // Allow preventing default keyDown behaviour if consumer (in our internal case it's Table3) wants to handle it.\n    // We need to have this option for the situations, when Datepicker is used as inline edititng control in Table3,\n    // without it, datepicker cannot be set into detailed editing mode by pressing \"Enter\",\n    // because input.onKeydown is triggering 'focusout', which resets the detailed edititng mode.\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        props.onKeyDown?.(event);\n\n        if (!event.defaultPrevented) {\n            input.onKeyDown?.(event);\n        }\n    };\n\n    return (\n        <span className={className} data-taco=\"datepicker\" style={style}>\n            <PopoverPrimitive.Root modal=\"trap-focus\" open={open} onOpenChange={setOpen}>\n                <Input\n                    {...input}\n                    onKeyDown={handleInputKeyDown}\n                    button={\n                        input.readOnly ? undefined : (\n                            <PopoverPrimitive.Trigger\n                                render={\n                                    <LegacyIconButton\n                                        aria-label={texts.datepicker.expand}\n                                        data-taco=\"toggle-calendar-button\"\n                                        disabled={input.disabled || input.readOnly}\n                                        icon=\"calendar\"\n                                        tabIndex={-1}\n                                        tooltip={texts.datepicker.calendar}\n                                    />\n                                }\n                            />\n                        )\n                    }\n                />\n\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Positioner sideOffset={8}>\n                        <PopoverPrimitive.Popup\n                            initialFocus={handleOpenAutoFocus}\n                            finalFocus={handleCloseAutoFocus}\n                            className=\"group rounded border border-transparent bg-white p-3 outline-none yt-shadow\">\n                            <PopoverArrow />\n                            <div ref={popoverContentRef} className=\"-m-3 flex\" onClick={handlePopoverClick}>\n                                <Calendar\n                                    {...calendar}\n                                    onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n                                        calendar.onChange(date, event);\n                                        setOpen(false);\n                                    }}\n                                />\n                                {shortcuts && (\n                                    <div className=\"flex flex-col border-l border-gray-100\">\n                                        <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n                                            {shortcutsText ?? texts.datepicker.shortcuts}\n                                        </span>\n                                        <ul>\n                                            {shortcuts.map(shortcut => (\n                                                <li key={shortcut.text}>\n                                                    <button\n                                                        type=\"button\"\n                                                        className=\"flex w-full items-start px-4 py-1 text-xs hover:bg-gray-100 hover:text-black\"\n                                                        data-taco=\"datepicker-shortcut\"\n                                                        onClick={event => {\n                                                            shortcut.onClick(event);\n                                                            setOpen(false);\n                                                        }}>\n                                                        {shortcut.text}\n                                                    </button>\n                                                </li>\n                                            ))}\n                                        </ul>\n                                        {handleReset && (\n                                            <button\n                                                type=\"button\"\n                                                className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n                                                data-taco=\"datepicker-clear-button\"\n                                                onClick={event => {\n                                                    handleReset(event);\n                                                    setOpen(false);\n                                                }}>\n                                                {texts.datepicker.clear}\n                                            </button>\n                                        )}\n                                    </div>\n                                )}\n                            </div>\n                        </PopoverPrimitive.Popup>\n                    </PopoverPrimitive.Positioner>\n                </PopoverPrimitive.Portal>\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["React","PopoverPrimitive","Datepicker","useDatepicker","useLocalization","Input","LegacyIconButton","Calendar"],"mappings":"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"}
+{"version":3,"file":"Datepicker.cjs","sources":["../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { CalendarProps, InputProps } from '@/components';\nimport { Calendar, Input, LegacyIconButton, useLocalization } from '@/components';\n\nimport { useDatepicker } from './useDatepicker';\n\nexport type DatepickerTexts = {\n    /** Aria-label for calendar */\n    calendar: string;\n    /** Clear button text */\n    clear: string;\n    /**\n     * Aria-label for calendar icon button in the input.\n     * Calendar will open when user clicks this icon button.\n     */\n    expand: string;\n    /** Shortcut heading text */\n    shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n    onClick: (event: React.MouseEvent) => void;\n    text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n    /** [Calendar](component:calendar) component associated with the DatePicker */\n    calendar?: CalendarProps;\n    /** List of shortcuts */\n    shortcuts?: DatePickerShortcut[];\n    /** Title for the shortcuts panel */\n    shortcutsText?: string;\n    /** Handler to be called when the clear button is clicked */\n    onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    /**\n     * Date value of the calendar.\n     * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n     */\n    value?: Date | string;\n};\n\nconst PopoverArrow = () => (\n    <PopoverPrimitive.Arrow className=\"data-[side=bottom]:top-[-8px] data-[side=left]:right-[-13px] data-[side=right]:left-[-13px] data-[side=top]:bottom-[-8px] data-[side=left]:rotate-90 data-[side=right]:-rotate-90 data-[side=top]:rotate-180\">\n        <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\">\n            <path\n                d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n                className=\"fill-[canvas]\"\n            />\n            <path\n                d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n                className=\"fill-gray-200\"\n            />\n            <path d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\" />\n        </svg>\n    </PopoverPrimitive.Arrow>\n);\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n    const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n    const { calendar, input } = useDatepicker(otherProps, ref);\n    const [open, setOpen] = React.useState(false);\n\n    const { texts } = useLocalization();\n    const className = cn('inline-flex w-full font-normal text-black', externalClassName);\n    const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n    const handlePopoverClick = React.useCallback((event: React.MouseEvent) => {\n        // Prevent the mouse click event from bubbling up to the parent element\n        event.stopPropagation();\n    }, []);\n\n    const handleCloseAutoFocus = () => input.ref.current;\n\n    const handleOpenAutoFocus = () => {\n        const currentDay: HTMLButtonElement | null = popoverContentRef?.current?.querySelector('td.rdp-selected button') ?? null;\n\n        return currentDay;\n    };\n\n    // Allow preventing default keyDown behaviour if consumer (in our internal case it's Table3) wants to handle it.\n    // We need to have this option for the situations, when Datepicker is used as inline edititng control in Table3,\n    // without it, datepicker cannot be set into detailed editing mode by pressing \"Enter\",\n    // because input.onKeydown is triggering 'focusout', which resets the detailed edititng mode.\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        props.onKeyDown?.(event);\n\n        if (!event.defaultPrevented) {\n            input.onKeyDown?.(event);\n        }\n    };\n\n    return (\n        <span className={className} data-taco=\"datepicker\" style={style}>\n            <PopoverPrimitive.Root modal=\"trap-focus\" open={open} onOpenChange={setOpen}>\n                <Input\n                    {...input}\n                    onKeyDown={handleInputKeyDown}\n                    button={\n                        input.readOnly ? undefined : (\n                            <PopoverPrimitive.Trigger\n                                render={\n                                    <LegacyIconButton\n                                        aria-label={texts.datepicker.expand}\n                                        data-taco=\"toggle-calendar-button\"\n                                        disabled={input.disabled || input.readOnly}\n                                        icon=\"calendar\"\n                                        tabIndex={-1}\n                                        tooltip={texts.datepicker.calendar}\n                                    />\n                                }\n                            />\n                        )\n                    }\n                />\n\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Positioner sideOffset={8}>\n                        <PopoverPrimitive.Popup\n                            initialFocus={handleOpenAutoFocus}\n                            finalFocus={handleCloseAutoFocus}\n                            className=\"group rounded border border-transparent bg-white p-3 outline-none yt-shadow\">\n                            <PopoverArrow />\n                            <div ref={popoverContentRef} className=\"-m-3 flex\" onClick={handlePopoverClick}>\n                                <Calendar\n                                    {...calendar}\n                                    onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n                                        calendar.onChange(date, event);\n                                        setOpen(false);\n                                    }}\n                                />\n                                {shortcuts && (\n                                    <div className=\"flex flex-col border-l border-gray-100\">\n                                        <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n                                            {shortcutsText ?? texts.datepicker.shortcuts}\n                                        </span>\n                                        <ul>\n                                            {shortcuts.map(shortcut => (\n                                                <li key={shortcut.text}>\n                                                    <button\n                                                        type=\"button\"\n                                                        className=\"flex w-full items-start px-4 py-1 text-xs hover:bg-gray-100 hover:text-black\"\n                                                        data-taco=\"datepicker-shortcut\"\n                                                        onClick={event => {\n                                                            shortcut.onClick(event);\n                                                            setOpen(false);\n                                                        }}>\n                                                        {shortcut.text}\n                                                    </button>\n                                                </li>\n                                            ))}\n                                        </ul>\n                                        {handleReset && (\n                                            <button\n                                                type=\"button\"\n                                                className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n                                                data-taco=\"datepicker-clear-button\"\n                                                onClick={event => {\n                                                    handleReset(event);\n                                                    setOpen(false);\n                                                }}>\n                                                {texts.datepicker.clear}\n                                            </button>\n                                        )}\n                                    </div>\n                                )}\n                            </div>\n                        </PopoverPrimitive.Popup>\n                    </PopoverPrimitive.Positioner>\n                </PopoverPrimitive.Portal>\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["React","PopoverPrimitive","Datepicker","useDatepicker","useLocalization","Input","LegacyIconButton","Calendar"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,MAAM,eAAe,MACjBA,iCAAA,cAACC,QAAAA,QAAiB,OAAjB,EAAuB,WAAU,kNAC9BD,iCAAA,cAAC,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,UACjDA,iCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,GAAE;AAAA,IACF,WAAU;AAAA,EAAA;AACd,GACAA,iCAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,GAAE;AAAA,IACF,WAAU;AAAA,EAAA;AACd,GACAA,iCAAA,cAAC,QAAA,EAAK,GAAE,uTAAA,CAAuT,CACnU,CACJ;AAGG,MAAM,aAAaA,iBAAM,WAAW,SAASE,YAAW,OAAwB,KAAkC;AACrH,QAAM,EAAE,WAAW,mBAAmB,SAAS,aAAa,OAAO,WAAW,eAAe,GAAG,WAAA,IAAe;AAC/G,QAAM,EAAE,UAAU,MAAA,IAAUC,cAAAA,cAAc,YAAY,GAAG;AACzD,QAAM,CAAC,MAAM,OAAO,IAAIH,iBAAM,SAAS,KAAK;AAE5C,QAAM,EAAE,MAAA,IAAUI,6BAAA;AAClB,QAAM,YAAY,GAAG,6CAA6C,iBAAiB;AACnF,QAAM,oBAAoBJ,iBAAM,OAAuB,IAAI;AAE3D,QAAM,qBAAqBA,iBAAM,YAAY,CAAC,UAA4B;AAEtE,UAAM,gBAAA;AAAA,EACV,GAAG,CAAA,CAAE;AAEL,QAAM,uBAAuB,MAAM,MAAM,IAAI;AAE7C,QAAM,sBAAsB,MAAM;AAC9B,UAAM,aAAuC,mBAAmB,SAAS,cAAc,wBAAwB,KAAK;AAEpH,WAAO;AAAA,EACX;AAMA,QAAM,qBAAqB,CAAC,UAAiD;AACzE,UAAM,YAAY,KAAK;AAEvB,QAAI,CAAC,MAAM,kBAAkB;AACzB,YAAM,YAAY,KAAK;AAAA,IAC3B;AAAA,EACJ;AAEA,SACIA,iCAAA,cAAC,QAAA,EAAK,WAAsB,aAAU,cAAa,MAAA,GAC/CA,iCAAA,cAACC,gBAAiB,MAAjB,EAAsB,OAAM,cAAa,MAAY,cAAc,WAChED,iCAAA;AAAA,IAACK,MAAAA;AAAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,WAAW;AAAA,MACX,QACI,MAAM,WAAW,SACbL,iCAAA;AAAA,QAACC,QAAAA,QAAiB;AAAA,QAAjB;AAAA,UACG,QACID,iCAAA;AAAA,YAACM,WAAAA;AAAAA,YAAA;AAAA,cACG,cAAY,MAAM,WAAW;AAAA,cAC7B,aAAU;AAAA,cACV,UAAU,MAAM,YAAY,MAAM;AAAA,cAClC,MAAK;AAAA,cACL,UAAU;AAAA,cACV,SAAS,MAAM,WAAW;AAAA,YAAA;AAAA,UAAA;AAAA,QAC9B;AAAA,MAAA;AAAA,IAER;AAAA,EAAA,GAKZN,iCAAA,cAACC,QAAAA,QAAiB,QAAjB,qDACIA,QAAAA,QAAiB,YAAjB,EAA4B,YAAY,EAAA,GACrCD,iCAAA;AAAA,IAACC,QAAAA,QAAiB;AAAA,IAAjB;AAAA,MACG,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,WAAU;AAAA,IAAA;AAAA,mDACT,cAAA,IAAa;AAAA,mDACb,OAAA,EAAI,KAAK,mBAAmB,WAAU,aAAY,SAAS,mBAAA,GACxDD,iCAAA;AAAA,MAACO,SAAAA;AAAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,UAAU,CAAC,MAAY,UAAsC;AACzD,mBAAS,SAAS,MAAM,KAAK;AAC7B,kBAAQ,KAAK;AAAA,QACjB;AAAA,MAAA;AAAA,IAAA,GAEH,aACGP,iCAAA,cAAC,OAAA,EAAI,WAAU,4CACXA,iCAAA,cAAC,QAAA,EAAK,WAAU,4DAAA,GACX,iBAAiB,MAAM,WAAW,SACvC,GACAA,iCAAA,cAAC,MAAA,MACI,UAAU,IAAI,cACXA,iCAAA,cAAC,MAAA,EAAG,KAAK,SAAS,KAAA,GACdA,iCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,WAAU;AAAA,QACV,aAAU;AAAA,QACV,SAAS,CAAA,UAAS;AACd,mBAAS,QAAQ,KAAK;AACtB,kBAAQ,KAAK;AAAA,QACjB;AAAA,MAAA;AAAA,MACC,SAAS;AAAA,IAAA,CAElB,CACH,CACL,GACC,eACGA,iCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,WAAU;AAAA,QACV,aAAU;AAAA,QACV,SAAS,CAAA,UAAS;AACd,sBAAY,KAAK;AACjB,kBAAQ,KAAK;AAAA,QACjB;AAAA,MAAA;AAAA,MACC,MAAM,WAAW;AAAA,IAAA,CAG9B,CAER;AAAA,EAAA,CAER,CACJ,CACJ,CACJ;AAER,CAAC;AACD,WAAW,cAAc;;"}

package/dist/components/Datepicker/Datepicker.d.ts

@@ -1,5 +1,4 @@
-import { CalendarProps } from '../Calendar/Calendar';
-import { InputProps } from '../Input/Input';
+import { CalendarProps, InputProps } from '..';
 import * as React from 'react';
 export type DatepickerTexts = {
     /** Aria-label for calendar */

package/dist/components/Datepicker/Datepicker.js

@@ -1,11 +1,11 @@
 import { Popover } from "@base-ui/react/popover";
 import cn from "clsx";
 import * as React from "react";
-import { Calendar } from "../Calendar/Calendar.js";
+import { useDatepicker } from "./useDatepicker.js";
+import { useLocalization } from "../Provider/Localization.js";
 import { Input } from "../Input/Input.js";
 import { LegacyIconButton } from "../LegacyComponents/IconButton/IconButton.js";
-import { useLocalization } from "../Provider/Localization.js";
-import { useDatepicker } from "./useDatepicker.js";
+import { Calendar } from "../Calendar/Calendar.js";
 const PopoverArrow = () => /* @__PURE__ */ React.createElement(Popover.Arrow, { className: "data-[side=bottom]:top-[-8px] data-[side=left]:right-[-13px] data-[side=right]:left-[-13px] data-[side=top]:bottom-[-8px] data-[side=left]:rotate-90 data-[side=right]:-rotate-90 data-[side=top]:rotate-180" }, /* @__PURE__ */ React.createElement("svg", { width: "20", height: "10", viewBox: "0 0 20 10", fill: "none" }, /* @__PURE__ */ React.createElement(
   "path",
   {

package/dist/components/Datepicker/Datepicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"Datepicker.js","sources":["../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { CalendarProps } from '../Calendar/Calendar';\nimport { Calendar } from '../Calendar/Calendar';\nimport type { InputProps } from '../Input/Input';\nimport { Input } from '../Input/Input';\nimport { LegacyIconButton } from '../LegacyComponents/IconButton/IconButton';\nimport { useLocalization } from '../Provider/Localization';\n\nimport { useDatepicker } from './useDatepicker';\n\nexport type DatepickerTexts = {\n    /** Aria-label for calendar */\n    calendar: string;\n    /** Clear button text */\n    clear: string;\n    /**\n     * Aria-label for calendar icon button in the input.\n     * Calendar will open when user clicks this icon button.\n     */\n    expand: string;\n    /** Shortcut heading text */\n    shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n    onClick: (event: React.MouseEvent) => void;\n    text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n    /** [Calendar](component:calendar) component associated with the DatePicker */\n    calendar?: CalendarProps;\n    /** List of shortcuts */\n    shortcuts?: DatePickerShortcut[];\n    /** Title for the shortcuts panel */\n    shortcutsText?: string;\n    /** Handler to be called when the clear button is clicked */\n    onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    /**\n     * Date value of the calendar.\n     * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n     */\n    value?: Date | string;\n};\n\nconst PopoverArrow = () => (\n    <PopoverPrimitive.Arrow className=\"data-[side=bottom]:top-[-8px] data-[side=left]:right-[-13px] data-[side=right]:left-[-13px] data-[side=top]:bottom-[-8px] data-[side=left]:rotate-90 data-[side=right]:-rotate-90 data-[side=top]:rotate-180\">\n        <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\">\n            <path\n                d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n                className=\"fill-[canvas]\"\n            />\n            <path\n                d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n                className=\"fill-gray-200\"\n            />\n            <path d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\" />\n        </svg>\n    </PopoverPrimitive.Arrow>\n);\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n    const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n    const { calendar, input } = useDatepicker(otherProps, ref);\n    const [open, setOpen] = React.useState(false);\n\n    const { texts } = useLocalization();\n    const className = cn('inline-flex w-full font-normal text-black', externalClassName);\n    const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n    const handlePopoverClick = React.useCallback((event: React.MouseEvent) => {\n        // Prevent the mouse click event from bubbling up to the parent element\n        event.stopPropagation();\n    }, []);\n\n    const handleCloseAutoFocus = () => input.ref.current;\n\n    const handleOpenAutoFocus = () => {\n        const currentDay: HTMLButtonElement | null = popoverContentRef?.current?.querySelector('td.rdp-selected button') ?? null;\n\n        return currentDay;\n    };\n\n    // Allow preventing default keyDown behaviour if consumer (in our internal case it's Table3) wants to handle it.\n    // We need to have this option for the situations, when Datepicker is used as inline edititng control in Table3,\n    // without it, datepicker cannot be set into detailed editing mode by pressing \"Enter\",\n    // because input.onKeydown is triggering 'focusout', which resets the detailed edititng mode.\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        props.onKeyDown?.(event);\n\n        if (!event.defaultPrevented) {\n            input.onKeyDown?.(event);\n        }\n    };\n\n    return (\n        <span className={className} data-taco=\"datepicker\" style={style}>\n            <PopoverPrimitive.Root modal=\"trap-focus\" open={open} onOpenChange={setOpen}>\n                <Input\n                    {...input}\n                    onKeyDown={handleInputKeyDown}\n                    button={\n                        input.readOnly ? undefined : (\n                            <PopoverPrimitive.Trigger\n                                render={\n                                    <LegacyIconButton\n                                        aria-label={texts.datepicker.expand}\n                                        data-taco=\"toggle-calendar-button\"\n                                        disabled={input.disabled || input.readOnly}\n                                        icon=\"calendar\"\n                                        tabIndex={-1}\n                                        tooltip={texts.datepicker.calendar}\n                                    />\n                                }\n                            />\n                        )\n                    }\n                />\n\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Positioner sideOffset={8}>\n                        <PopoverPrimitive.Popup\n                            initialFocus={handleOpenAutoFocus}\n                            finalFocus={handleCloseAutoFocus}\n                            className=\"group rounded border border-transparent bg-white p-3 outline-none yt-shadow\">\n                            <PopoverArrow />\n                            <div ref={popoverContentRef} className=\"-m-3 flex\" onClick={handlePopoverClick}>\n                                <Calendar\n                                    {...calendar}\n                                    onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n                                        calendar.onChange(date, event);\n                                        setOpen(false);\n                                    }}\n                                />\n                                {shortcuts && (\n                                    <div className=\"flex flex-col border-l border-gray-100\">\n                                        <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n                                            {shortcutsText ?? texts.datepicker.shortcuts}\n                                        </span>\n                                        <ul>\n                                            {shortcuts.map(shortcut => (\n                                                <li key={shortcut.text}>\n                                                    <button\n                                                        type=\"button\"\n                                                        className=\"flex w-full items-start px-4 py-1 text-xs hover:bg-gray-100 hover:text-black\"\n                                                        data-taco=\"datepicker-shortcut\"\n                                                        onClick={event => {\n                                                            shortcut.onClick(event);\n                                                            setOpen(false);\n                                                        }}>\n                                                        {shortcut.text}\n                                                    </button>\n                                                </li>\n                                            ))}\n                                        </ul>\n                                        {handleReset && (\n                                            <button\n                                                type=\"button\"\n                                                className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n                                                data-taco=\"datepicker-clear-button\"\n                                                onClick={event => {\n                                                    handleReset(event);\n                                                    setOpen(false);\n                                                }}>\n                                                {texts.datepicker.clear}\n                                            </button>\n                                        )}\n                                    </div>\n                                )}\n                            </div>\n                        </PopoverPrimitive.Popup>\n                    </PopoverPrimitive.Positioner>\n                </PopoverPrimitive.Portal>\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["PopoverPrimitive","Datepicker"],"mappings":"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"}
+{"version":3,"file":"Datepicker.js","sources":["../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { CalendarProps, InputProps } from '@/components';\nimport { Calendar, Input, LegacyIconButton, useLocalization } from '@/components';\n\nimport { useDatepicker } from './useDatepicker';\n\nexport type DatepickerTexts = {\n    /** Aria-label for calendar */\n    calendar: string;\n    /** Clear button text */\n    clear: string;\n    /**\n     * Aria-label for calendar icon button in the input.\n     * Calendar will open when user clicks this icon button.\n     */\n    expand: string;\n    /** Shortcut heading text */\n    shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n    onClick: (event: React.MouseEvent) => void;\n    text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n    /** [Calendar](component:calendar) component associated with the DatePicker */\n    calendar?: CalendarProps;\n    /** List of shortcuts */\n    shortcuts?: DatePickerShortcut[];\n    /** Title for the shortcuts panel */\n    shortcutsText?: string;\n    /** Handler to be called when the clear button is clicked */\n    onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    /**\n     * Date value of the calendar.\n     * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n     */\n    value?: Date | string;\n};\n\nconst PopoverArrow = () => (\n    <PopoverPrimitive.Arrow className=\"data-[side=bottom]:top-[-8px] data-[side=left]:right-[-13px] data-[side=right]:left-[-13px] data-[side=top]:bottom-[-8px] data-[side=left]:rotate-90 data-[side=right]:-rotate-90 data-[side=top]:rotate-180\">\n        <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\">\n            <path\n                d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n                className=\"fill-[canvas]\"\n            />\n            <path\n                d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n                className=\"fill-gray-200\"\n            />\n            <path d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\" />\n        </svg>\n    </PopoverPrimitive.Arrow>\n);\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n    const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n    const { calendar, input } = useDatepicker(otherProps, ref);\n    const [open, setOpen] = React.useState(false);\n\n    const { texts } = useLocalization();\n    const className = cn('inline-flex w-full font-normal text-black', externalClassName);\n    const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n    const handlePopoverClick = React.useCallback((event: React.MouseEvent) => {\n        // Prevent the mouse click event from bubbling up to the parent element\n        event.stopPropagation();\n    }, []);\n\n    const handleCloseAutoFocus = () => input.ref.current;\n\n    const handleOpenAutoFocus = () => {\n        const currentDay: HTMLButtonElement | null = popoverContentRef?.current?.querySelector('td.rdp-selected button') ?? null;\n\n        return currentDay;\n    };\n\n    // Allow preventing default keyDown behaviour if consumer (in our internal case it's Table3) wants to handle it.\n    // We need to have this option for the situations, when Datepicker is used as inline edititng control in Table3,\n    // without it, datepicker cannot be set into detailed editing mode by pressing \"Enter\",\n    // because input.onKeydown is triggering 'focusout', which resets the detailed edititng mode.\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        props.onKeyDown?.(event);\n\n        if (!event.defaultPrevented) {\n            input.onKeyDown?.(event);\n        }\n    };\n\n    return (\n        <span className={className} data-taco=\"datepicker\" style={style}>\n            <PopoverPrimitive.Root modal=\"trap-focus\" open={open} onOpenChange={setOpen}>\n                <Input\n                    {...input}\n                    onKeyDown={handleInputKeyDown}\n                    button={\n                        input.readOnly ? undefined : (\n                            <PopoverPrimitive.Trigger\n                                render={\n                                    <LegacyIconButton\n                                        aria-label={texts.datepicker.expand}\n                                        data-taco=\"toggle-calendar-button\"\n                                        disabled={input.disabled || input.readOnly}\n                                        icon=\"calendar\"\n                                        tabIndex={-1}\n                                        tooltip={texts.datepicker.calendar}\n                                    />\n                                }\n                            />\n                        )\n                    }\n                />\n\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Positioner sideOffset={8}>\n                        <PopoverPrimitive.Popup\n                            initialFocus={handleOpenAutoFocus}\n                            finalFocus={handleCloseAutoFocus}\n                            className=\"group rounded border border-transparent bg-white p-3 outline-none yt-shadow\">\n                            <PopoverArrow />\n                            <div ref={popoverContentRef} className=\"-m-3 flex\" onClick={handlePopoverClick}>\n                                <Calendar\n                                    {...calendar}\n                                    onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n                                        calendar.onChange(date, event);\n                                        setOpen(false);\n                                    }}\n                                />\n                                {shortcuts && (\n                                    <div className=\"flex flex-col border-l border-gray-100\">\n                                        <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n                                            {shortcutsText ?? texts.datepicker.shortcuts}\n                                        </span>\n                                        <ul>\n                                            {shortcuts.map(shortcut => (\n                                                <li key={shortcut.text}>\n                                                    <button\n                                                        type=\"button\"\n                                                        className=\"flex w-full items-start px-4 py-1 text-xs hover:bg-gray-100 hover:text-black\"\n                                                        data-taco=\"datepicker-shortcut\"\n                                                        onClick={event => {\n                                                            shortcut.onClick(event);\n                                                            setOpen(false);\n                                                        }}>\n                                                        {shortcut.text}\n                                                    </button>\n                                                </li>\n                                            ))}\n                                        </ul>\n                                        {handleReset && (\n                                            <button\n                                                type=\"button\"\n                                                className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n                                                data-taco=\"datepicker-clear-button\"\n                                                onClick={event => {\n                                                    handleReset(event);\n                                                    setOpen(false);\n                                                }}>\n                                                {texts.datepicker.clear}\n                                            </button>\n                                        )}\n                                    </div>\n                                )}\n                            </div>\n                        </PopoverPrimitive.Popup>\n                    </PopoverPrimitive.Positioner>\n                </PopoverPrimitive.Portal>\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["PopoverPrimitive","Datepicker"],"mappings":"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"}

package/dist/components/Datepicker/useDatepicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useDatepicker.cjs","sources":["../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isMatch } from 'react-day-picker';\n\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { format, parse, parseFromCustomString } from '../../utils/date';\nimport { setInputValueByRef } from '../../utils/input';\nimport type { CalendarProps } from '../Calendar/Calendar';\nimport type { InputProps as BaseInputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\n\nimport type { DatepickerProps } from './Datepicker';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n    calendar: CalendarProps;\n    input: InputProps;\n};\n\nexport const useDatepicker = (\n    { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n    ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const { formatting } = useLocalization();\n    const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n    const originalValueAsDate = parse(value);\n\n    // update internal value if it changed 'externally'\n    React.useEffect(() => {\n        const formattedValue = format(value, formatting.date);\n\n        if (formattedValue !== internalValue) {\n            setInternalValue(formattedValue ?? '');\n        }\n    }, [value]);\n\n    const isDisabledDay = React.useMemo(() => {\n        if (originalValueAsDate && calendar?.disabledDays) {\n            return isMatch(originalValueAsDate, calendar?.disabledDays); // can happen if you type a disabled date in input.\n        }\n\n        return false;\n    }, [originalValueAsDate]);\n\n    // event handlers\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        const valueAsDate = parseFromCustomString(\n            event.target.value,\n            'dd.mm.yy',\n            originalValueAsDate?.getMonth(),\n            originalValueAsDate?.getFullYear()\n        );\n        const formattedValue = valueAsDate ? format(valueAsDate) || '' : '';\n\n        event.target.value = formattedValue;\n\n        const isEmpty = !event.target.value.trim();\n\n        if (onChange) {\n            (event as any).detail = isEmpty ? null : valueAsDate;\n            onChange(event);\n        } else {\n            // update the internal value to use the formatted date\n            setInternalValue(isEmpty ? '' : formattedValue);\n        }\n\n        if (onBlur) {\n            onBlur(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        setInternalValue(event.target.value);\n    };\n\n    const handleChange = (date: Date) => {\n        setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        if (props.onKeyDown) {\n            props.onKeyDown(event);\n        }\n\n        if (event.key === 'Enter') {\n            event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n        }\n    };\n\n    const inputProps: InputProps = {\n        ...props,\n        autoComplete: 'off',\n        invalid: props.invalid || isDisabledDay,\n        onBlur: handleInputBlur,\n        onChange: handleInputChange,\n        onKeyDown: handleKeyDown,\n        ref: inputRef,\n        type: 'text',\n        value: internalValue,\n    };\n\n    const calendarProps: CalendarProps = {\n        ...calendar,\n        onChange: handleChange,\n        value: originalValueAsDate,\n    };\n\n    return {\n        input: inputProps,\n        calendar: calendarProps,\n    };\n};\n"],"names":["useMergedRef","useLocalization","React","format","parse","isMatch","parseFromCustomString","date","setInputValueByRef"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAM,gBAAgB,CACzB,EAAE,cAAc,GAAG,UAAU,QAAQ,UAAU,OAAO,GAAG,MAAA,GACzD,QACgB;AAChB,QAAM,WAAWA,aAAAA,aAA+B,GAAG;AACnD,QAAM,EAAE,WAAA,IAAeC,6BAAA;AACvB,QAAM,CAAC,eAAe,gBAAgB,IAAIC,iBAAM,SAASC,KAAAA,OAAO,OAAO,WAAW,IAAI,KAAK,EAAE;AAC7F,QAAM,sBAAsBC,KAAAA,MAAM,KAAK;AAGvCF,mBAAM,UAAU,MAAM;AAClB,UAAM,iBAAiBC,KAAAA,OAAO,OAAO,WAAW,IAAI;AAEpD,QAAI,mBAAmB,eAAe;AAClC,uBAAiB,kBAAkB,EAAE;AAAA,IACzC;AAAA,EACJ,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,gBAAgBD,iBAAM,QAAQ,MAAM;AACtC,QAAI,uBAAuB,UAAU,cAAc;AAC/C,aAAOG,uBAAQ,qBAAqB,UAAU,YAAY;AAAA,IAC9D;AAEA,WAAO;AAAA,EACX,GAAG,CAAC,mBAAmB,CAAC;AAGxB,QAAM,kBAAkB,CAAC,UAAoD;AACzE,UAAM,QAAA;AAEN,UAAM,cAAcC,KAAAA;AAAAA,MAChB,MAAM,OAAO;AAAA,MACb;AAAA,MACA,qBAAqB,SAAA;AAAA,MACrB,qBAAqB,YAAA;AAAA,IAAY;AAErC,UAAM,iBAAiB,cAAcH,KAAAA,OAAO,WAAW,KAAK,KAAK;AAEjE,UAAM,OAAO,QAAQ;AAErB,UAAM,UAAU,CAAC,MAAM,OAAO,MAAM,KAAA;AAEpC,QAAI,UAAU;AACT,YAAc,SAAS,UAAU,OAAO;AACzC,eAAS,KAAK;AAAA,IAClB,OAAO;AAEH,uBAAiB,UAAU,KAAK,cAAc;AAAA,IAClD;AAEA,QAAI,QAAQ;AACR,aAAO,KAAK;AAAA,IAChB;AAAA,EACJ;AAEA,QAAM,oBAAoB,CAAC,UAAqD;AAC5E,qBAAiB,MAAM,OAAO,KAAK;AAAA,EACvC;AAEA,QAAM,eAAe,CAACI,WAAe;AACjCC,6BAAmB,SAAS,SAASL,KAAAA,OAAOI,QAAM,WAAW,IAAI,GAAG,UAAU;AAAA,EAClF;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AACpE,QAAI,MAAM,WAAW;AACjB,YAAM,UAAU,KAAK;AAAA,IACzB;AAEA,QAAI,MAAM,QAAQ,SAAS;AACvB,YAAM,OAAO,cAAc,IAAI,MAAM,YAAY,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACvE;AAAA,EACJ;AAEA,QAAM,aAAyB;AAAA,IAC3B,GAAG;AAAA,IACH,cAAc;AAAA,IACd,SAAS,MAAM,WAAW;AAAA,IAC1B,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,WAAW;AAAA,IACX,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAGX,QAAM,gBAA+B;AAAA,IACjC,GAAG;AAAA,IACH,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAGX,SAAO;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,EAAA;AAElB;;"}
+{"version":3,"file":"useDatepicker.cjs","sources":["../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isMatch } from 'react-day-picker';\n\nimport type { CalendarProps, InputProps as BaseInputProps } from '@/components';\nimport { useLocalization } from '@/components';\nimport { useMergedRef } from '@/hooks/useMergedRef';\nimport { format, parse, parseFromCustomString } from '@/utils/date';\nimport { setInputValueByRef } from '@/utils/input';\n\nimport type { DatepickerProps } from './Datepicker';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n    calendar: CalendarProps;\n    input: InputProps;\n};\n\nexport const useDatepicker = (\n    { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n    ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const { formatting } = useLocalization();\n    const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n    const originalValueAsDate = parse(value);\n\n    // update internal value if it changed 'externally'\n    React.useEffect(() => {\n        const formattedValue = format(value, formatting.date);\n\n        if (formattedValue !== internalValue) {\n            setInternalValue(formattedValue ?? '');\n        }\n    }, [value]);\n\n    const isDisabledDay = React.useMemo(() => {\n        if (originalValueAsDate && calendar?.disabledDays) {\n            return isMatch(originalValueAsDate, calendar?.disabledDays); // can happen if you type a disabled date in input.\n        }\n\n        return false;\n    }, [originalValueAsDate]);\n\n    // event handlers\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        const valueAsDate = parseFromCustomString(\n            event.target.value,\n            'dd.mm.yy',\n            originalValueAsDate?.getMonth(),\n            originalValueAsDate?.getFullYear()\n        );\n        const formattedValue = valueAsDate ? format(valueAsDate) || '' : '';\n\n        event.target.value = formattedValue;\n\n        const isEmpty = !event.target.value.trim();\n\n        if (onChange) {\n            (event as any).detail = isEmpty ? null : valueAsDate;\n            onChange(event);\n        } else {\n            // update the internal value to use the formatted date\n            setInternalValue(isEmpty ? '' : formattedValue);\n        }\n\n        if (onBlur) {\n            onBlur(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        setInternalValue(event.target.value);\n    };\n\n    const handleChange = (date: Date) => {\n        setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        if (props.onKeyDown) {\n            props.onKeyDown(event);\n        }\n\n        if (event.key === 'Enter') {\n            event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n        }\n    };\n\n    const inputProps: InputProps = {\n        ...props,\n        autoComplete: 'off',\n        invalid: props.invalid || isDisabledDay,\n        onBlur: handleInputBlur,\n        onChange: handleInputChange,\n        onKeyDown: handleKeyDown,\n        ref: inputRef,\n        type: 'text',\n        value: internalValue,\n    };\n\n    const calendarProps: CalendarProps = {\n        ...calendar,\n        onChange: handleChange,\n        value: originalValueAsDate,\n    };\n\n    return {\n        input: inputProps,\n        calendar: calendarProps,\n    };\n};\n"],"names":["useMergedRef","useLocalization","React","format","parse","isMatch","parseFromCustomString","date","setInputValueByRef"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAiBO,MAAM,gBAAgB,CACzB,EAAE,cAAc,GAAG,UAAU,QAAQ,UAAU,OAAO,GAAG,MAAA,GACzD,QACgB;AAChB,QAAM,WAAWA,aAAAA,aAA+B,GAAG;AACnD,QAAM,EAAE,WAAA,IAAeC,6BAAA;AACvB,QAAM,CAAC,eAAe,gBAAgB,IAAIC,iBAAM,SAASC,KAAAA,OAAO,OAAO,WAAW,IAAI,KAAK,EAAE;AAC7F,QAAM,sBAAsBC,KAAAA,MAAM,KAAK;AAGvCF,mBAAM,UAAU,MAAM;AAClB,UAAM,iBAAiBC,KAAAA,OAAO,OAAO,WAAW,IAAI;AAEpD,QAAI,mBAAmB,eAAe;AAClC,uBAAiB,kBAAkB,EAAE;AAAA,IACzC;AAAA,EACJ,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,gBAAgBD,iBAAM,QAAQ,MAAM;AACtC,QAAI,uBAAuB,UAAU,cAAc;AAC/C,aAAOG,uBAAQ,qBAAqB,UAAU,YAAY;AAAA,IAC9D;AAEA,WAAO;AAAA,EACX,GAAG,CAAC,mBAAmB,CAAC;AAGxB,QAAM,kBAAkB,CAAC,UAAoD;AACzE,UAAM,QAAA;AAEN,UAAM,cAAcC,KAAAA;AAAAA,MAChB,MAAM,OAAO;AAAA,MACb;AAAA,MACA,qBAAqB,SAAA;AAAA,MACrB,qBAAqB,YAAA;AAAA,IAAY;AAErC,UAAM,iBAAiB,cAAcH,KAAAA,OAAO,WAAW,KAAK,KAAK;AAEjE,UAAM,OAAO,QAAQ;AAErB,UAAM,UAAU,CAAC,MAAM,OAAO,MAAM,KAAA;AAEpC,QAAI,UAAU;AACT,YAAc,SAAS,UAAU,OAAO;AACzC,eAAS,KAAK;AAAA,IAClB,OAAO;AAEH,uBAAiB,UAAU,KAAK,cAAc;AAAA,IAClD;AAEA,QAAI,QAAQ;AACR,aAAO,KAAK;AAAA,IAChB;AAAA,EACJ;AAEA,QAAM,oBAAoB,CAAC,UAAqD;AAC5E,qBAAiB,MAAM,OAAO,KAAK;AAAA,EACvC;AAEA,QAAM,eAAe,CAACI,WAAe;AACjCC,6BAAmB,SAAS,SAASL,KAAAA,OAAOI,QAAM,WAAW,IAAI,GAAG,UAAU;AAAA,EAClF;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AACpE,QAAI,MAAM,WAAW;AACjB,YAAM,UAAU,KAAK;AAAA,IACzB;AAEA,QAAI,MAAM,QAAQ,SAAS;AACvB,YAAM,OAAO,cAAc,IAAI,MAAM,YAAY,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACvE;AAAA,EACJ;AAEA,QAAM,aAAyB;AAAA,IAC3B,GAAG;AAAA,IACH,cAAc;AAAA,IACd,SAAS,MAAM,WAAW;AAAA,IAC1B,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,WAAW;AAAA,IACX,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAGX,QAAM,gBAA+B;AAAA,IACjC,GAAG;AAAA,IACH,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAGX,SAAO;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,EAAA;AAElB;;"}

package/dist/components/Datepicker/useDatepicker.d.ts

@@ -1,5 +1,4 @@
-import { CalendarProps } from '../Calendar/Calendar';
-import { InputProps as BaseInputProps } from '../Input/Input';
+import { CalendarProps, InputProps as BaseInputProps } from '..';
 import { DatepickerProps } from './Datepicker';
 import * as React from 'react';
 type InputProps = BaseInputProps & {

package/dist/components/Datepicker/useDatepicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDatepicker.js","sources":["../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isMatch } from 'react-day-picker';\n\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { format, parse, parseFromCustomString } from '../../utils/date';\nimport { setInputValueByRef } from '../../utils/input';\nimport type { CalendarProps } from '../Calendar/Calendar';\nimport type { InputProps as BaseInputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\n\nimport type { DatepickerProps } from './Datepicker';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n    calendar: CalendarProps;\n    input: InputProps;\n};\n\nexport const useDatepicker = (\n    { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n    ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const { formatting } = useLocalization();\n    const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n    const originalValueAsDate = parse(value);\n\n    // update internal value if it changed 'externally'\n    React.useEffect(() => {\n        const formattedValue = format(value, formatting.date);\n\n        if (formattedValue !== internalValue) {\n            setInternalValue(formattedValue ?? '');\n        }\n    }, [value]);\n\n    const isDisabledDay = React.useMemo(() => {\n        if (originalValueAsDate && calendar?.disabledDays) {\n            return isMatch(originalValueAsDate, calendar?.disabledDays); // can happen if you type a disabled date in input.\n        }\n\n        return false;\n    }, [originalValueAsDate]);\n\n    // event handlers\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        const valueAsDate = parseFromCustomString(\n            event.target.value,\n            'dd.mm.yy',\n            originalValueAsDate?.getMonth(),\n            originalValueAsDate?.getFullYear()\n        );\n        const formattedValue = valueAsDate ? format(valueAsDate) || '' : '';\n\n        event.target.value = formattedValue;\n\n        const isEmpty = !event.target.value.trim();\n\n        if (onChange) {\n            (event as any).detail = isEmpty ? null : valueAsDate;\n            onChange(event);\n        } else {\n            // update the internal value to use the formatted date\n            setInternalValue(isEmpty ? '' : formattedValue);\n        }\n\n        if (onBlur) {\n            onBlur(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        setInternalValue(event.target.value);\n    };\n\n    const handleChange = (date: Date) => {\n        setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        if (props.onKeyDown) {\n            props.onKeyDown(event);\n        }\n\n        if (event.key === 'Enter') {\n            event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n        }\n    };\n\n    const inputProps: InputProps = {\n        ...props,\n        autoComplete: 'off',\n        invalid: props.invalid || isDisabledDay,\n        onBlur: handleInputBlur,\n        onChange: handleInputChange,\n        onKeyDown: handleKeyDown,\n        ref: inputRef,\n        type: 'text',\n        value: internalValue,\n    };\n\n    const calendarProps: CalendarProps = {\n        ...calendar,\n        onChange: handleChange,\n        value: originalValueAsDate,\n    };\n\n    return {\n        input: inputProps,\n        calendar: calendarProps,\n    };\n};\n"],"names":[],"mappings":";;;;;;AAkBO,MAAM,gBAAgB,CACzB,EAAE,cAAc,GAAG,UAAU,QAAQ,UAAU,OAAO,GAAG,MAAA,GACzD,QACgB;AAChB,QAAM,WAAW,aAA+B,GAAG;AACnD,QAAM,EAAE,WAAA,IAAe,gBAAA;AACvB,QAAM,CAAC,eAAe,gBAAgB,IAAI,MAAM,SAAS,OAAO,OAAO,WAAW,IAAI,KAAK,EAAE;AAC7F,QAAM,sBAAsB,MAAM,KAAK;AAGvC,QAAM,UAAU,MAAM;AAClB,UAAM,iBAAiB,OAAO,OAAO,WAAW,IAAI;AAEpD,QAAI,mBAAmB,eAAe;AAClC,uBAAiB,kBAAkB,EAAE;AAAA,IACzC;AAAA,EACJ,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,gBAAgB,MAAM,QAAQ,MAAM;AACtC,QAAI,uBAAuB,UAAU,cAAc;AAC/C,aAAO,QAAQ,qBAAqB,UAAU,YAAY;AAAA,IAC9D;AAEA,WAAO;AAAA,EACX,GAAG,CAAC,mBAAmB,CAAC;AAGxB,QAAM,kBAAkB,CAAC,UAAoD;AACzE,UAAM,QAAA;AAEN,UAAM,cAAc;AAAA,MAChB,MAAM,OAAO;AAAA,MACb;AAAA,MACA,qBAAqB,SAAA;AAAA,MACrB,qBAAqB,YAAA;AAAA,IAAY;AAErC,UAAM,iBAAiB,cAAc,OAAO,WAAW,KAAK,KAAK;AAEjE,UAAM,OAAO,QAAQ;AAErB,UAAM,UAAU,CAAC,MAAM,OAAO,MAAM,KAAA;AAEpC,QAAI,UAAU;AACT,YAAc,SAAS,UAAU,OAAO;AACzC,eAAS,KAAK;AAAA,IAClB,OAAO;AAEH,uBAAiB,UAAU,KAAK,cAAc;AAAA,IAClD;AAEA,QAAI,QAAQ;AACR,aAAO,KAAK;AAAA,IAChB;AAAA,EACJ;AAEA,QAAM,oBAAoB,CAAC,UAAqD;AAC5E,qBAAiB,MAAM,OAAO,KAAK;AAAA,EACvC;AAEA,QAAM,eAAe,CAAC,SAAe;AACjC,uBAAmB,SAAS,SAAS,OAAO,MAAM,WAAW,IAAI,GAAG,UAAU;AAAA,EAClF;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AACpE,QAAI,MAAM,WAAW;AACjB,YAAM,UAAU,KAAK;AAAA,IACzB;AAEA,QAAI,MAAM,QAAQ,SAAS;AACvB,YAAM,OAAO,cAAc,IAAI,MAAM,YAAY,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACvE;AAAA,EACJ;AAEA,QAAM,aAAyB;AAAA,IAC3B,GAAG;AAAA,IACH,cAAc;AAAA,IACd,SAAS,MAAM,WAAW;AAAA,IAC1B,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,WAAW;AAAA,IACX,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAGX,QAAM,gBAA+B;AAAA,IACjC,GAAG;AAAA,IACH,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAGX,SAAO;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,EAAA;AAElB;"}
+{"version":3,"file":"useDatepicker.js","sources":["../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isMatch } from 'react-day-picker';\n\nimport type { CalendarProps, InputProps as BaseInputProps } from '@/components';\nimport { useLocalization } from '@/components';\nimport { useMergedRef } from '@/hooks/useMergedRef';\nimport { format, parse, parseFromCustomString } from '@/utils/date';\nimport { setInputValueByRef } from '@/utils/input';\n\nimport type { DatepickerProps } from './Datepicker';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n    calendar: CalendarProps;\n    input: InputProps;\n};\n\nexport const useDatepicker = (\n    { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n    ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n    const inputRef = useMergedRef<HTMLInputElement>(ref);\n    const { formatting } = useLocalization();\n    const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n    const originalValueAsDate = parse(value);\n\n    // update internal value if it changed 'externally'\n    React.useEffect(() => {\n        const formattedValue = format(value, formatting.date);\n\n        if (formattedValue !== internalValue) {\n            setInternalValue(formattedValue ?? '');\n        }\n    }, [value]);\n\n    const isDisabledDay = React.useMemo(() => {\n        if (originalValueAsDate && calendar?.disabledDays) {\n            return isMatch(originalValueAsDate, calendar?.disabledDays); // can happen if you type a disabled date in input.\n        }\n\n        return false;\n    }, [originalValueAsDate]);\n\n    // event handlers\n    const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        const valueAsDate = parseFromCustomString(\n            event.target.value,\n            'dd.mm.yy',\n            originalValueAsDate?.getMonth(),\n            originalValueAsDate?.getFullYear()\n        );\n        const formattedValue = valueAsDate ? format(valueAsDate) || '' : '';\n\n        event.target.value = formattedValue;\n\n        const isEmpty = !event.target.value.trim();\n\n        if (onChange) {\n            (event as any).detail = isEmpty ? null : valueAsDate;\n            onChange(event);\n        } else {\n            // update the internal value to use the formatted date\n            setInternalValue(isEmpty ? '' : formattedValue);\n        }\n\n        if (onBlur) {\n            onBlur(event);\n        }\n    };\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        setInternalValue(event.target.value);\n    };\n\n    const handleChange = (date: Date) => {\n        setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        if (props.onKeyDown) {\n            props.onKeyDown(event);\n        }\n\n        if (event.key === 'Enter') {\n            event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n        }\n    };\n\n    const inputProps: InputProps = {\n        ...props,\n        autoComplete: 'off',\n        invalid: props.invalid || isDisabledDay,\n        onBlur: handleInputBlur,\n        onChange: handleInputChange,\n        onKeyDown: handleKeyDown,\n        ref: inputRef,\n        type: 'text',\n        value: internalValue,\n    };\n\n    const calendarProps: CalendarProps = {\n        ...calendar,\n        onChange: handleChange,\n        value: originalValueAsDate,\n    };\n\n    return {\n        input: inputProps,\n        calendar: calendarProps,\n    };\n};\n"],"names":[],"mappings":";;;;;;AAiBO,MAAM,gBAAgB,CACzB,EAAE,cAAc,GAAG,UAAU,QAAQ,UAAU,OAAO,GAAG,MAAA,GACzD,QACgB;AAChB,QAAM,WAAW,aAA+B,GAAG;AACnD,QAAM,EAAE,WAAA,IAAe,gBAAA;AACvB,QAAM,CAAC,eAAe,gBAAgB,IAAI,MAAM,SAAS,OAAO,OAAO,WAAW,IAAI,KAAK,EAAE;AAC7F,QAAM,sBAAsB,MAAM,KAAK;AAGvC,QAAM,UAAU,MAAM;AAClB,UAAM,iBAAiB,OAAO,OAAO,WAAW,IAAI;AAEpD,QAAI,mBAAmB,eAAe;AAClC,uBAAiB,kBAAkB,EAAE;AAAA,IACzC;AAAA,EACJ,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,gBAAgB,MAAM,QAAQ,MAAM;AACtC,QAAI,uBAAuB,UAAU,cAAc;AAC/C,aAAO,QAAQ,qBAAqB,UAAU,YAAY;AAAA,IAC9D;AAEA,WAAO;AAAA,EACX,GAAG,CAAC,mBAAmB,CAAC;AAGxB,QAAM,kBAAkB,CAAC,UAAoD;AACzE,UAAM,QAAA;AAEN,UAAM,cAAc;AAAA,MAChB,MAAM,OAAO;AAAA,MACb;AAAA,MACA,qBAAqB,SAAA;AAAA,MACrB,qBAAqB,YAAA;AAAA,IAAY;AAErC,UAAM,iBAAiB,cAAc,OAAO,WAAW,KAAK,KAAK;AAEjE,UAAM,OAAO,QAAQ;AAErB,UAAM,UAAU,CAAC,MAAM,OAAO,MAAM,KAAA;AAEpC,QAAI,UAAU;AACT,YAAc,SAAS,UAAU,OAAO;AACzC,eAAS,KAAK;AAAA,IAClB,OAAO;AAEH,uBAAiB,UAAU,KAAK,cAAc;AAAA,IAClD;AAEA,QAAI,QAAQ;AACR,aAAO,KAAK;AAAA,IAChB;AAAA,EACJ;AAEA,QAAM,oBAAoB,CAAC,UAAqD;AAC5E,qBAAiB,MAAM,OAAO,KAAK;AAAA,EACvC;AAEA,QAAM,eAAe,CAAC,SAAe;AACjC,uBAAmB,SAAS,SAAS,OAAO,MAAM,WAAW,IAAI,GAAG,UAAU;AAAA,EAClF;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AACpE,QAAI,MAAM,WAAW;AACjB,YAAM,UAAU,KAAK;AAAA,IACzB;AAEA,QAAI,MAAM,QAAQ,SAAS;AACvB,YAAM,OAAO,cAAc,IAAI,MAAM,YAAY,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACvE;AAAA,EACJ;AAEA,QAAM,aAAyB;AAAA,IAC3B,GAAG;AAAA,IACH,cAAc;AAAA,IACd,SAAS,MAAM,WAAW;AAAA,IAC1B,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,WAAW;AAAA,IACX,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAGX,QAAM,gBAA+B;AAAA,IACjC,GAAG;AAAA,IACH,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAGX,SAAO;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,EAAA;AAElB;"}

package/dist/components/Dialog/components/Content.cjs

@@ -5,11 +5,11 @@ const cn = require("clsx");
 const React = require("react");
 const useDraggable = require("../../../utils/hooks/useDraggable.cjs");
 const mergeRefs = require("../../../utils/mergeRefs.cjs");
-const Backdrop = require("../../Backdrop/Backdrop.cjs");
-const IconButton = require("../../LegacyComponents/IconButton/IconButton.cjs");
-const Localization = require("../../Provider/Localization.cjs");
 const Context = require("../Context.cjs");
 const util = require("../util.cjs");
+const Localization = require("../../Provider/Localization.cjs");
+const Backdrop = require("../../Backdrop/Backdrop.cjs");
+const IconButton = require("../../LegacyComponents/IconButton/IconButton.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {

package/dist/components/Dialog/components/Content.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Content.cjs","sources":["../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { mergeRefs } from '../../../utils/mergeRefs';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport { useLocalization } from '../../Provider/Localization';\nimport type { DialogContext } from '../Context';\nimport { useCurrentDialog } from '../Context';\nimport { DIALOG_POSITION_CLASSNAMES, DIALOG_SIZE_CLASSNAME } from '../util';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    const className = cn('text-center', props.className);\n    return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('mt-8 flex justify-end', props.className);\n    return (\n        <div {...props} className={className} ref={ref}>\n            {props.children}\n        </div>\n    );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('close'));\n    };\n\n    return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible label to be announced when the dialog is opened */\n    'aria-label': string;\n    children: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    // Popup ref lives on the Dialog root so descendants can read it via `useDialogScope`;\n    // we attach it to the popup node here and merge in any forwarded ref.\n    const popupRef = dialog.popupRef as React.MutableRefObject<HTMLDivElement | null>;\n    const setPopupRef = React.useMemo(() => mergeRefs<HTMLDivElement>([popupRef, forwardedRef]), [popupRef, forwardedRef]);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative animate-[fade-in_150ms] rounded bg-white print:!static',\n        DIALOG_POSITION_CLASSNAMES,\n        DIALOG_SIZE_CLASSNAME[dialog.size],\n        'print:m-0 print:h-max print:w-full print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'relative z-10 rounded bg-white p-6 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:!inset-0 print:!m-0 print:h-max print:!transform-none print:overflow-visible',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={setPopupRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center absolute-center-x print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <LegacyIconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["React","DialogPrimitive","dialog","useCurrentDialog","RenderPropWrapper","mergeRefs","useDraggable","useLocalization","DIALOG_POSITION_CLASSNAMES","DIALOG_SIZE_CLASSNAME","Backdrop","LegacyIconButton"],"mappings":"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"}
+{"version":3,"file":"Content.cjs","sources":["../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { Backdrop, LegacyIconButton, useLocalization } from '@/components';\nimport { useDraggable } from '@/utils/hooks/useDraggable';\nimport { mergeRefs } from '@/utils/mergeRefs';\n\nimport type { DialogContext } from '../Context';\nimport { useCurrentDialog } from '../Context';\nimport { DIALOG_POSITION_CLASSNAMES, DIALOG_SIZE_CLASSNAME } from '../util';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    const className = cn('text-center', props.className);\n    return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('mt-8 flex justify-end', props.className);\n    return (\n        <div {...props} className={className} ref={ref}>\n            {props.children}\n        </div>\n    );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('close'));\n    };\n\n    return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible label to be announced when the dialog is opened */\n    'aria-label': string;\n    children: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    // Popup ref lives on the Dialog root so descendants can read it via `useDialogScope`;\n    // we attach it to the popup node here and merge in any forwarded ref.\n    const popupRef = dialog.popupRef as React.MutableRefObject<HTMLDivElement | null>;\n    const setPopupRef = React.useMemo(() => mergeRefs<HTMLDivElement>([popupRef, forwardedRef]), [popupRef, forwardedRef]);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative animate-[fade-in_150ms] rounded bg-white print:!static',\n        DIALOG_POSITION_CLASSNAMES,\n        DIALOG_SIZE_CLASSNAME[dialog.size],\n        'print:m-0 print:h-max print:w-full print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'relative z-10 rounded bg-white p-6 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:!inset-0 print:!m-0 print:h-max print:!transform-none print:overflow-visible',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={setPopupRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center absolute-center-x print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <LegacyIconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["React","DialogPrimitive","dialog","useCurrentDialog","RenderPropWrapper","mergeRefs","useDraggable","useLocalization","DIALOG_POSITION_CLASSNAMES","DIALOG_SIZE_CLASSNAME","Backdrop","LegacyIconButton"],"mappings":"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"}

package/dist/components/Dialog/components/Content.js

@@ -3,11 +3,11 @@ import cn from "clsx";
 import * as React from "react";
 import { useDraggable } from "../../../utils/hooks/useDraggable.js";
 import { mergeRefs } from "../../../utils/mergeRefs.js";
-import { Backdrop } from "../../Backdrop/Backdrop.js";
-import { LegacyIconButton } from "../../LegacyComponents/IconButton/IconButton.js";
-import { useLocalization } from "../../Provider/Localization.js";
 import { useCurrentDialog } from "../Context.js";
 import { DIALOG_POSITION_CLASSNAMES, DIALOG_SIZE_CLASSNAME } from "../util.js";
+import { useLocalization } from "../../Provider/Localization.js";
+import { Backdrop } from "../../Backdrop/Backdrop.js";
+import { LegacyIconButton } from "../../LegacyComponents/IconButton/IconButton.js";
 const Title = React.forwardRef(function DialogTitle(props, ref) {
   const className = cn("text-center", props.className);
   return /* @__PURE__ */ React.createElement(Dialog.Title, { ...props, className, ref });

package/dist/components/Dialog/components/Content.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sources":["../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { mergeRefs } from '../../../utils/mergeRefs';\nimport { Backdrop } from '../../Backdrop/Backdrop';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport { useLocalization } from '../../Provider/Localization';\nimport type { DialogContext } from '../Context';\nimport { useCurrentDialog } from '../Context';\nimport { DIALOG_POSITION_CLASSNAMES, DIALOG_SIZE_CLASSNAME } from '../util';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    const className = cn('text-center', props.className);\n    return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('mt-8 flex justify-end', props.className);\n    return (\n        <div {...props} className={className} ref={ref}>\n            {props.children}\n        </div>\n    );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('close'));\n    };\n\n    return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible label to be announced when the dialog is opened */\n    'aria-label': string;\n    children: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    // Popup ref lives on the Dialog root so descendants can read it via `useDialogScope`;\n    // we attach it to the popup node here and merge in any forwarded ref.\n    const popupRef = dialog.popupRef as React.MutableRefObject<HTMLDivElement | null>;\n    const setPopupRef = React.useMemo(() => mergeRefs<HTMLDivElement>([popupRef, forwardedRef]), [popupRef, forwardedRef]);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative animate-[fade-in_150ms] rounded bg-white print:!static',\n        DIALOG_POSITION_CLASSNAMES,\n        DIALOG_SIZE_CLASSNAME[dialog.size],\n        'print:m-0 print:h-max print:w-full print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'relative z-10 rounded bg-white p-6 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:!inset-0 print:!m-0 print:h-max print:!transform-none print:overflow-visible',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={setPopupRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center absolute-center-x print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <LegacyIconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["DialogPrimitive","RenderPropWrapper"],"mappings":"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"}
+{"version":3,"file":"Content.js","sources":["../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { Backdrop, LegacyIconButton, useLocalization } from '@/components';\nimport { useDraggable } from '@/utils/hooks/useDraggable';\nimport { mergeRefs } from '@/utils/mergeRefs';\n\nimport type { DialogContext } from '../Context';\nimport { useCurrentDialog } from '../Context';\nimport { DIALOG_POSITION_CLASSNAMES, DIALOG_SIZE_CLASSNAME } from '../util';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    const className = cn('text-center', props.className);\n    return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('mt-8 flex justify-end', props.className);\n    return (\n        <div {...props} className={className} ref={ref}>\n            {props.children}\n        </div>\n    );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick, renderProps }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('close'));\n    };\n\n    return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible label to be announced when the dialog is opened */\n    'aria-label': string;\n    children: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    // Popup ref lives on the Dialog root so descendants can read it via `useDialogScope`;\n    // we attach it to the popup node here and merge in any forwarded ref.\n    const popupRef = dialog.popupRef as React.MutableRefObject<HTMLDivElement | null>;\n    const setPopupRef = React.useMemo(() => mergeRefs<HTMLDivElement>([popupRef, forwardedRef]), [popupRef, forwardedRef]);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative animate-[fade-in_150ms] rounded bg-white print:!static',\n        DIALOG_POSITION_CLASSNAMES,\n        DIALOG_SIZE_CLASSNAME[dialog.size],\n        'print:m-0 print:h-max print:w-full print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'relative z-10 rounded bg-white p-6 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:!inset-0 print:!m-0 print:h-max print:!transform-none print:overflow-visible',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={setPopupRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center absolute-center-x print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <LegacyIconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["DialogPrimitive","RenderPropWrapper"],"mappings":";;;;;;;;;;AAoBO,MAAM,QAAQ,MAAM,WAAW,SAAS,YAAY,OAAyB,KAAoC;AACpH,QAAM,YAAY,GAAG,eAAe,MAAM,SAAS;AACnD,6CAAQA,OAAgB,OAAhB,EAAuB,GAAG,OAAO,WAAsB,KAAU;AAC7E,CAAC;AAGM,MAAM,SAAS,MAAM,WAAW,SAAS,aAAa,OAA0B,KAAgC;AACnH,QAAM,YAAY,GAAG,yBAAyB,MAAM,SAAS;AAC7D,6CACK,OAAA,EAAK,GAAG,OAAO,WAAsB,IAAA,GACjC,MAAM,QACX;AAER,CAAC;AAMM,MAAM,QAAQ,MAAM,WAAW,SAAS,YAAY,OAAyB,KAAmC;AACnH,QAAM,SAAS,iBAAA;AACf,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AAEnC,SAAO,sBAAA,cAACA,OAAgB,OAAhB,EAAuB,GAAG,WAAW,SAAS,OAAO,SAAS,KAAU,QAAQ,SAAA,CAAU;AACtG,CAAC;AAED,MAAM,oBAAoB,MAAM,WAAW,SAASC,mBAAkB,EAAE,UAAU,SAAS,YAAA,GAAoB,KAAK;AAChH,QAAM,QAAQ,MAAM;AAChB,YAAQ,IAAI,YAAY,OAAO,CAAC;AAAA,EACpC;AAEA,SAAO,SAAS,EAAE,OAAO,KAAK,GAAG,aAAa;AAClD,CAAC;AASM,MAAM,UAAU,MAAM,WAAW,SAAS,cAC7C,OACA,cACF;AACE,QAAM,SAAS,iBAAA;AAGf,QAAM,WAAW,OAAO;AACxB,QAAM,cAAc,MAAM,QAAQ,MAAM,UAA0B,CAAC,UAAU,YAAY,CAAC,GAAG,CAAC,UAAU,YAAY,CAAC;AACrH,QAAM,EAAE,UAAU,UAAU,aAAa,gBAAA,IAAoB,aAAa,QAAQ;AAClF,QAAM,EAAE,MAAA,IAAU,gBAAA;AAElB,QAAM,YAAY;AAAA,IACd;AAAA,IACA;AAAA,IACA,sBAAsB,OAAO,IAAI;AAAA,IACjC;AAAA,EAAA;AAGJ,QAAM,qBAAqB;AAAA,IACvB;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,MACI,kBAAkB,CAAC,CAAC,OAAO,SAAS;AAAA,IAAA;AAAA,IAExC,MAAM;AAAA,EAAA;AAGV,MAAI;AAEJ,MAAI,OAAO,MAAM,aAAa,YAAY;AACtC,aACI,sBAAA,cAAC,OAAA,MACG,sBAAA,cAAC,mBAAA,EAAkB,aAAa,EAAE,QAAQ,OAAO,OAAA,EAAO,GAAI,MAAM,QAAS,CAC/E;AAAA,EAER,OAAO;AACH,aAAS,MAAM;AAAA,EACnB;AACA,SACI,sBAAA,cAACD,OAAgB,QAAhB,0CACI,UAAA,MACG,sBAAA;AAAA,IAACA,OAAgB;AAAA,IAAhB;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,KAAK;AAAA,MACL,OAAO;AAAA,QACH,GAAG,MAAM;AAAA,QACT,MAAM,OAAO,YAAY,GAAG,SAAS,CAAC,OAAO;AAAA,QAC7C,KAAK,OAAO,YAAY,GAAG,SAAS,CAAC,OAAO;AAAA,MAAA;AAAA,IAChD;AAAA,IACA,sBAAA,cAAC,SAAI,WAAW,oBAAoB,aAAU,SAAA,GACzC,QACA,OAAO,aACJ,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,MAAK;AAAA,QACL,WAAS;AAAA,QACT,gBAAc;AAAA,QACd,cAAY,MAAM,OAAO;AAAA,QACzB,WAAU;AAAA,MAAA;AAAA,IAAA,GAGjB,OAAO,kBACJ,sBAAA;AAAA,MAACA,OAAgB;AAAA,MAAhB;AAAA,QACG,SAAS,OAAO;AAAA,QAChB,QACI,sBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,YAAW;AAAA,YACX,cAAY,MAAM,OAAO;AAAA,YACzB,WAAU;AAAA,YACV,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,IAAA,IAER,IACR;AAAA,IACC,OAAO,SAAS;AAAA,IAChB,OAAO,SAAS;AAAA,EAAA,CAEzB,CACJ;AAER,CAAC;"}

package/dist/components/Dialog/components/Trigger.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.cjs","sources":["../../../../src/components/Dialog/components/Trigger.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport * as React from 'react';\n\nimport { mergeRefs } from '../../../utils/mergeRefs';\nimport { useCurrentDialog } from '../Context';\n\nexport type DialogTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\nexport const Trigger = React.forwardRef(function DialogTrigger(\n    props: DialogTriggerProps,\n    externalRef: React.Ref<HTMLButtonElement>\n) {\n    const { children, ...restProps } = props;\n    const { ref: parentRef } = useCurrentDialog();\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    // if it's an object, it's a react component and we have to assume it eventually renders a button.\n    const isNativeButton = props.children.type === 'button' || typeof props.children.type === 'object';\n\n    return <DialogPrimitive.Trigger {...restProps} ref={refCallback} nativeButton={isNativeButton} render={children} />;\n});\n"],"names":["React","useCurrentDialog","mergeRefs","DialogPrimitive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AASO,MAAM,UAAUA,iBAAM,WAAW,SAAS,cAC7C,OACA,aACF;AACE,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AACnC,QAAM,EAAE,KAAK,UAAA,IAAcC,yBAAA;AAC3B,QAAM,cAAcC,UAAAA,UAAU,CAAC,WAAW,WAAW,CAAC;AAGtD,QAAM,iBAAiB,MAAM,SAAS,SAAS,YAAY,OAAO,MAAM,SAAS,SAAS;AAE1F,SAAOF,iCAAA,cAACG,cAAgB,SAAhB,EAAyB,GAAG,WAAW,KAAK,aAAa,cAAc,gBAAgB,QAAQ,SAAA,CAAU;AACrH,CAAC;;"}
+{"version":3,"file":"Trigger.cjs","sources":["../../../../src/components/Dialog/components/Trigger.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport * as React from 'react';\n\nimport { mergeRefs } from '@/utils/mergeRefs';\n\nimport { useCurrentDialog } from '../Context';\n\nexport type DialogTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\nexport const Trigger = React.forwardRef(function DialogTrigger(\n    props: DialogTriggerProps,\n    externalRef: React.Ref<HTMLButtonElement>\n) {\n    const { children, ...restProps } = props;\n    const { ref: parentRef } = useCurrentDialog();\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    // if it's an object, it's a react component and we have to assume it eventually renders a button.\n    const isNativeButton = props.children.type === 'button' || typeof props.children.type === 'object';\n\n    return <DialogPrimitive.Trigger {...restProps} ref={refCallback} nativeButton={isNativeButton} render={children} />;\n});\n"],"names":["React","useCurrentDialog","mergeRefs","DialogPrimitive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAUO,MAAM,UAAUA,iBAAM,WAAW,SAAS,cAC7C,OACA,aACF;AACE,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AACnC,QAAM,EAAE,KAAK,UAAA,IAAcC,yBAAA;AAC3B,QAAM,cAAcC,UAAAA,UAAU,CAAC,WAAW,WAAW,CAAC;AAGtD,QAAM,iBAAiB,MAAM,SAAS,SAAS,YAAY,OAAO,MAAM,SAAS,SAAS;AAE1F,SAAOF,iCAAA,cAACG,cAAgB,SAAhB,EAAyB,GAAG,WAAW,KAAK,aAAa,cAAc,gBAAgB,QAAQ,SAAA,CAAU;AACrH,CAAC;;"}

package/dist/components/Dialog/components/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.js","sources":["../../../../src/components/Dialog/components/Trigger.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport * as React from 'react';\n\nimport { mergeRefs } from '../../../utils/mergeRefs';\nimport { useCurrentDialog } from '../Context';\n\nexport type DialogTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\nexport const Trigger = React.forwardRef(function DialogTrigger(\n    props: DialogTriggerProps,\n    externalRef: React.Ref<HTMLButtonElement>\n) {\n    const { children, ...restProps } = props;\n    const { ref: parentRef } = useCurrentDialog();\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    // if it's an object, it's a react component and we have to assume it eventually renders a button.\n    const isNativeButton = props.children.type === 'button' || typeof props.children.type === 'object';\n\n    return <DialogPrimitive.Trigger {...restProps} ref={refCallback} nativeButton={isNativeButton} render={children} />;\n});\n"],"names":["DialogPrimitive"],"mappings":";;;;AASO,MAAM,UAAU,MAAM,WAAW,SAAS,cAC7C,OACA,aACF;AACE,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AACnC,QAAM,EAAE,KAAK,UAAA,IAAc,iBAAA;AAC3B,QAAM,cAAc,UAAU,CAAC,WAAW,WAAW,CAAC;AAGtD,QAAM,iBAAiB,MAAM,SAAS,SAAS,YAAY,OAAO,MAAM,SAAS,SAAS;AAE1F,SAAO,sBAAA,cAACA,OAAgB,SAAhB,EAAyB,GAAG,WAAW,KAAK,aAAa,cAAc,gBAAgB,QAAQ,SAAA,CAAU;AACrH,CAAC;"}
+{"version":3,"file":"Trigger.js","sources":["../../../../src/components/Dialog/components/Trigger.tsx"],"sourcesContent":["import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport * as React from 'react';\n\nimport { mergeRefs } from '@/utils/mergeRefs';\n\nimport { useCurrentDialog } from '../Context';\n\nexport type DialogTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.JSX.Element;\n};\nexport const Trigger = React.forwardRef(function DialogTrigger(\n    props: DialogTriggerProps,\n    externalRef: React.Ref<HTMLButtonElement>\n) {\n    const { children, ...restProps } = props;\n    const { ref: parentRef } = useCurrentDialog();\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    // if it's an object, it's a react component and we have to assume it eventually renders a button.\n    const isNativeButton = props.children.type === 'button' || typeof props.children.type === 'object';\n\n    return <DialogPrimitive.Trigger {...restProps} ref={refCallback} nativeButton={isNativeButton} render={children} />;\n});\n"],"names":["DialogPrimitive"],"mappings":";;;;AAUO,MAAM,UAAU,MAAM,WAAW,SAAS,cAC7C,OACA,aACF;AACE,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AACnC,QAAM,EAAE,KAAK,UAAA,IAAc,iBAAA;AAC3B,QAAM,cAAc,UAAU,CAAC,WAAW,WAAW,CAAC;AAGtD,QAAM,iBAAiB,MAAM,SAAS,SAAS,YAAY,OAAO,MAAM,SAAS,SAAS;AAE1F,SAAO,sBAAA,cAACA,OAAgB,SAAhB,EAAyB,GAAG,WAAW,KAAK,aAAa,cAAc,gBAAgB,QAAQ,SAAA,CAAU;AACrH,CAAC;"}

package/dist/components/Drawer/Drawer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.cjs","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { Drawer as DrawerPrimitive } from '@base-ui/react/drawer';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useControlled } from '../../hooks/useControlled';\nimport type { GroupProps } from '../Group/Group';\n\nimport type {\n    DrawerInnerContentProps,\n    DrawerFooterProps,\n    DrawerTitleProps,\n    DrawerContentProps,\n    DrawerCloseProps,\n} from './components/Content';\nimport { Actions, Footer, InnerContent, Title, Close, Content } from './components/Content';\nimport type { DrawerTriggerProps } from './components/Trigger';\nimport { Trigger } from './components/Trigger';\nimport type { OnOpenHandle } from './Context';\nimport { DrawerContext } from './Context';\nimport type { DrawerSize, DrawerVariant } from './types';\nimport { useDrawerStack } from './useDrawerStack';\n\nexport type DrawerTexts = {\n    /** Aria-label for back icon button in drawer. */\n    back: string;\n    /** Aria-label for close icon button in drawer. */\n    close: string;\n};\n\nexport type DrawerProps = {\n    children: React.ReactNode | React.ReactNode[];\n    /** Size of the drawer. This is the recommended way to set a size for drawer component. */\n    size?: DrawerSize;\n    /** Set whether the drawer is open by default or not, use when not providing a trigger  */\n    defaultOpen?: boolean;\n    /** Handles the back button click and determines its visibility */\n    onClickBack?: () => void;\n    /** Handler called when drawer closes by user interaction */\n    onClose?: () => void;\n    /** Called when the drawer opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n    /** Control the open state of the drawer from outside the component  */\n    open?: boolean;\n    /** A trigger to be used for the drawer, should not be set if `children` already contains a trigger */\n    trigger?: React.JSX.Element;\n    /** Triggers when resizing, can be throttled or debounced for better performances */\n    onResize?: (delta: number) => void;\n    /** Rendering variant of the drawer */\n    variant?: DrawerVariant;\n    /** className for children container, needed for embedded version, in cases where we might need to control children height */\n    className?: string;\n    /** When 'true' renders close button in topr right cornenr of drawer content */\n    showCloseButton?: boolean;\n    /** Target specific named outlet allowing you to render a drawer to a specific outlet */\n    outletName?: string;\n};\n\nexport type OutletProps = React.HTMLAttributes<HTMLDivElement> & {\n    name?: string;\n};\n\nconst DEFAULT_OUTLET_NAME = 'default';\n\nconst Outlet = React.forwardRef(function Outlet(props: OutletProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('ml-auto h-full flex-shrink-0 overflow-hidden', props.className);\n    return (\n        <div\n            {...props}\n            className={className}\n            data-taco=\"drawer-outlet\"\n            data-taco-outlet-name={props.name ?? DEFAULT_OUTLET_NAME}\n            ref={ref}\n        />\n    );\n});\n\nexport type ForwardedDrawerWithStatics = React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<DrawerTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n    Content: React.ForwardRefExoticComponent<DrawerContentProps & React.RefAttributes<HTMLDivElement>>;\n    InnerContent: React.ForwardRefExoticComponent<DrawerInnerContentProps & React.RefAttributes<HTMLDivElement>>;\n    Title: React.ForwardRefExoticComponent<DrawerTitleProps & React.RefAttributes<HTMLHeadingElement>>;\n    Footer: React.ForwardRefExoticComponent<DrawerFooterProps & React.RefAttributes<HTMLDivElement>>;\n    Close: React.ForwardRefExoticComponent<DrawerCloseProps & React.RefAttributes<HTMLButtonElement>>;\n    Actions: React.ForwardRefExoticComponent<GroupProps & React.RefAttributes<HTMLDivElement>>;\n    Outlet: React.ForwardRefExoticComponent<OutletProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Drawer = React.forwardRef(function Drawer(props: DrawerProps, ref: React.Ref<HTMLElement>) {\n    const {\n        onChange,\n        variant = 'embedded',\n        className: _1,\n        onResize,\n        onClose,\n        onClickBack,\n        size = 'md',\n        trigger,\n        children,\n        showCloseButton = true,\n        outletName,\n        ...otherProps\n    } = props;\n\n    const [outlet, setOutlet] = React.useState<HTMLElement>();\n    const containerRef = React.useRef<OnOpenHandle>(null);\n\n    const [open, setOpen] = useControlled<boolean>({\n        value: props.open,\n        defaultValue: props.defaultOpen ?? false,\n        onChange,\n    });\n\n    useDrawerStack({\n        open,\n        setOpen,\n        onClose,\n        onOpen: () => {\n            // sets container width for resizing.\n            containerRef.current?.onOpen();\n        },\n    });\n\n    const context = React.useMemo(\n        () => ({\n            containerRef,\n            onClickBack,\n            onClose,\n            onResize,\n            props: otherProps,\n            size,\n            ref,\n            variant,\n            showCloseButton,\n            outlet,\n        }),\n        [containerRef, otherProps, variant, onResize, onClose, size, showCloseButton, outlet, onClickBack]\n    );\n\n    const handleOpenChange = (open: boolean, eventDetails: DrawerPrimitive.Root.ChangeEventDetails) => {\n        if (eventDetails.reason === 'escape-key') {\n            const triggeredFromRadixPortal = (eventDetails.event.target as HTMLElement)?.closest(\n                'div[data-radix-popper-content-wrapper]'\n            );\n\n            if (triggeredFromRadixPortal) {\n                // TODO: This could be removed when all radix overlays are replaced with base UI components, but currently it propagates through and closes the dialog.\n\n                // cancel closing the dialog\n                eventDetails.cancel();\n                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            } else if (variant === 'embedded') {\n                eventDetails.cancel();\n                return;\n            }\n        }\n\n        setOpen?.(open);\n\n        if (open === false) {\n            onClose?.();\n        }\n    };\n\n    React.useEffect(() => {\n        const outletSelector = `[data-taco=\"drawer-outlet\"][data-taco-outlet-name=\"${outletName ?? DEFAULT_OUTLET_NAME}\"]`;\n        const outletElement = document.querySelector<HTMLElement>(outletSelector) ?? document.body;\n        setOutlet(outletElement);\n    }, [outletName]);\n\n    return (\n        <DrawerContext.Provider value={context}>\n            <DrawerPrimitive.Root\n                disablePointerDismissal={variant === 'embedded'}\n                modal={variant === 'overlay'}\n                open={open}\n                onOpenChange={handleOpenChange}\n                swipeDirection=\"right\">\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </DrawerPrimitive.Root>\n        </DrawerContext.Provider>\n    );\n}) as ForwardedDrawerWithStatics;\n\nDrawer.Trigger = Trigger;\nDrawer.Content = Content;\nDrawer.InnerContent = InnerContent;\nDrawer.Title = Title;\nDrawer.Footer = Footer;\nDrawer.Close = Close;\nDrawer.Actions = Actions;\nDrawer.Outlet = Outlet;\n"],"names":["React","Outlet","Drawer","useControlled","useDrawerStack","open","DrawerContext","DrawerPrimitive","Trigger","Content","InnerContent","Title","Footer","Close","Actions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DA,MAAM,sBAAsB;AAE5B,MAAM,SAASA,iBAAM,WAAW,SAASC,QAAO,OAAoB,KAAgC;AAChG,QAAM,YAAY,GAAG,gDAAgD,MAAM,SAAS;AACpF,SACID,iCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,aAAU;AAAA,MACV,yBAAuB,MAAM,QAAQ;AAAA,MACrC;AAAA,IAAA;AAAA,EAAA;AAGZ,CAAC;AAaM,MAAM,SAASA,iBAAM,WAAW,SAASE,QAAO,OAAoB,KAA6B;AACpG,QAAM;AAAA,IACF;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,CAAC,QAAQ,SAAS,IAAIF,iBAAM,SAAA;AAClC,QAAM,eAAeA,iBAAM,OAAqB,IAAI;AAEpD,QAAM,CAAC,MAAM,OAAO,IAAIG,4BAAuB;AAAA,IAC3C,OAAO,MAAM;AAAA,IACb,cAAc,MAAM,eAAe;AAAA,IACnC;AAAA,EAAA,CACH;AAEDC,gCAAe;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ,MAAM;AAEV,mBAAa,SAAS,OAAA;AAAA,IAC1B;AAAA,EAAA,CACH;AAED,QAAM,UAAUJ,iBAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEJ,CAAC,cAAc,YAAY,SAAS,UAAU,SAAS,MAAM,iBAAiB,QAAQ,WAAW;AAAA,EAAA;AAGrG,QAAM,mBAAmB,CAACK,OAAe,iBAA0D;AAC/F,QAAI,aAAa,WAAW,cAAc;AACtC,YAAM,2BAA4B,aAAa,MAAM,QAAwB;AAAA,QACzE;AAAA,MAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAA;AAEb,qBAAa,iBAAA;AACb;AAAA,MACJ,WAAW,YAAY,YAAY;AAC/B,qBAAa,OAAA;AACb;AAAA,MACJ;AAAA,IACJ;AAEA,cAAUA,KAAI;AAEd,QAAIA,UAAS,OAAO;AAChB,gBAAA;AAAA,IACJ;AAAA,EACJ;AAEAL,mBAAM,UAAU,MAAM;AAClB,UAAM,iBAAiB,sDAAsD,cAAc,mBAAmB;AAC9G,UAAM,gBAAgB,SAAS,cAA2B,cAAc,KAAK,SAAS;AACtF,cAAU,aAAa;AAAA,EAC3B,GAAG,CAAC,UAAU,CAAC;AAEf,SACIA,iCAAA,cAACM,sBAAc,UAAd,EAAuB,OAAO,WAC3BN,iCAAA;AAAA,IAACO,OAAAA,OAAgB;AAAA,IAAhB;AAAA,MACG,yBAAyB,YAAY;AAAA,MACrC,OAAO,YAAY;AAAA,MACnB;AAAA,MACA,cAAc;AAAA,MACd,gBAAe;AAAA,IAAA;AAAA,IACd,WAAWP,iCAAA,cAACQ,QAAAA,SAAA,MAAS,OAAQ;AAAA,IAC7B;AAAA,EAAA,CAET;AAER,CAAC;AAED,OAAO,UAAUA,QAAAA;AACjB,OAAO,UAAUC,QAAAA;AACjB,OAAO,eAAeC,QAAAA;AACtB,OAAO,QAAQC,QAAAA;AACf,OAAO,SAASC,QAAAA;AAChB,OAAO,QAAQC,QAAAA;AACf,OAAO,UAAUC,QAAAA;AACjB,OAAO,SAAS;;"}
+{"version":3,"file":"Drawer.cjs","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { Drawer as DrawerPrimitive } from '@base-ui/react/drawer';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { GroupProps } from '@/components';\nimport { useControlled } from '@/hooks/useControlled';\n\nimport type {\n    DrawerInnerContentProps,\n    DrawerFooterProps,\n    DrawerTitleProps,\n    DrawerContentProps,\n    DrawerCloseProps,\n} from './components/Content';\nimport { Actions, Footer, InnerContent, Title, Close, Content } from './components/Content';\nimport type { DrawerTriggerProps } from './components/Trigger';\nimport { Trigger } from './components/Trigger';\nimport type { OnOpenHandle } from './Context';\nimport { DrawerContext } from './Context';\nimport type { DrawerSize, DrawerVariant } from './types';\nimport { useDrawerStack } from './useDrawerStack';\n\nexport type DrawerTexts = {\n    /** Aria-label for back icon button in drawer. */\n    back: string;\n    /** Aria-label for close icon button in drawer. */\n    close: string;\n};\n\nexport type DrawerProps = {\n    children: React.ReactNode | React.ReactNode[];\n    /** Size of the drawer. This is the recommended way to set a size for drawer component. */\n    size?: DrawerSize;\n    /** Set whether the drawer is open by default or not, use when not providing a trigger  */\n    defaultOpen?: boolean;\n    /** Handles the back button click and determines its visibility */\n    onClickBack?: () => void;\n    /** Handler called when drawer closes by user interaction */\n    onClose?: () => void;\n    /** Called when the drawer opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n    /** Control the open state of the drawer from outside the component  */\n    open?: boolean;\n    /** A trigger to be used for the drawer, should not be set if `children` already contains a trigger */\n    trigger?: React.JSX.Element;\n    /** Triggers when resizing, can be throttled or debounced for better performances */\n    onResize?: (delta: number) => void;\n    /** Rendering variant of the drawer */\n    variant?: DrawerVariant;\n    /** className for children container, needed for embedded version, in cases where we might need to control children height */\n    className?: string;\n    /** When 'true' renders close button in topr right cornenr of drawer content */\n    showCloseButton?: boolean;\n    /** Target specific named outlet allowing you to render a drawer to a specific outlet */\n    outletName?: string;\n};\n\nexport type OutletProps = React.HTMLAttributes<HTMLDivElement> & {\n    name?: string;\n};\n\nconst DEFAULT_OUTLET_NAME = 'default';\n\nconst Outlet = React.forwardRef(function Outlet(props: OutletProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('ml-auto h-full flex-shrink-0 overflow-hidden', props.className);\n    return (\n        <div\n            {...props}\n            className={className}\n            data-taco=\"drawer-outlet\"\n            data-taco-outlet-name={props.name ?? DEFAULT_OUTLET_NAME}\n            ref={ref}\n        />\n    );\n});\n\nexport type ForwardedDrawerWithStatics = React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<DrawerTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n    Content: React.ForwardRefExoticComponent<DrawerContentProps & React.RefAttributes<HTMLDivElement>>;\n    InnerContent: React.ForwardRefExoticComponent<DrawerInnerContentProps & React.RefAttributes<HTMLDivElement>>;\n    Title: React.ForwardRefExoticComponent<DrawerTitleProps & React.RefAttributes<HTMLHeadingElement>>;\n    Footer: React.ForwardRefExoticComponent<DrawerFooterProps & React.RefAttributes<HTMLDivElement>>;\n    Close: React.ForwardRefExoticComponent<DrawerCloseProps & React.RefAttributes<HTMLButtonElement>>;\n    Actions: React.ForwardRefExoticComponent<GroupProps & React.RefAttributes<HTMLDivElement>>;\n    Outlet: React.ForwardRefExoticComponent<OutletProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Drawer = React.forwardRef(function Drawer(props: DrawerProps, ref: React.Ref<HTMLElement>) {\n    const {\n        onChange,\n        variant = 'embedded',\n        className: _1,\n        onResize,\n        onClose,\n        onClickBack,\n        size = 'md',\n        trigger,\n        children,\n        showCloseButton = true,\n        outletName,\n        ...otherProps\n    } = props;\n\n    const [outlet, setOutlet] = React.useState<HTMLElement>();\n    const containerRef = React.useRef<OnOpenHandle>(null);\n\n    const [open, setOpen] = useControlled<boolean>({\n        value: props.open,\n        defaultValue: props.defaultOpen ?? false,\n        onChange,\n    });\n\n    useDrawerStack({\n        open,\n        setOpen,\n        onClose,\n        onOpen: () => {\n            // sets container width for resizing.\n            containerRef.current?.onOpen();\n        },\n    });\n\n    const context = React.useMemo(\n        () => ({\n            containerRef,\n            onClickBack,\n            onClose,\n            onResize,\n            props: otherProps,\n            size,\n            ref,\n            variant,\n            showCloseButton,\n            outlet,\n        }),\n        [containerRef, otherProps, variant, onResize, onClose, size, showCloseButton, outlet, onClickBack]\n    );\n\n    const handleOpenChange = (open: boolean, eventDetails: DrawerPrimitive.Root.ChangeEventDetails) => {\n        if (eventDetails.reason === 'escape-key') {\n            const triggeredFromRadixPortal = (eventDetails.event.target as HTMLElement)?.closest(\n                'div[data-radix-popper-content-wrapper]'\n            );\n\n            if (triggeredFromRadixPortal) {\n                // TODO: This could be removed when all radix overlays are replaced with base UI components, but currently it propagates through and closes the dialog.\n\n                // cancel closing the dialog\n                eventDetails.cancel();\n                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            } else if (variant === 'embedded') {\n                eventDetails.cancel();\n                return;\n            }\n        }\n\n        setOpen?.(open);\n\n        if (open === false) {\n            onClose?.();\n        }\n    };\n\n    React.useEffect(() => {\n        const outletSelector = `[data-taco=\"drawer-outlet\"][data-taco-outlet-name=\"${outletName ?? DEFAULT_OUTLET_NAME}\"]`;\n        const outletElement = document.querySelector<HTMLElement>(outletSelector) ?? document.body;\n        setOutlet(outletElement);\n    }, [outletName]);\n\n    return (\n        <DrawerContext.Provider value={context}>\n            <DrawerPrimitive.Root\n                disablePointerDismissal={variant === 'embedded'}\n                modal={variant === 'overlay'}\n                open={open}\n                onOpenChange={handleOpenChange}\n                swipeDirection=\"right\">\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </DrawerPrimitive.Root>\n        </DrawerContext.Provider>\n    );\n}) as ForwardedDrawerWithStatics;\n\nDrawer.Trigger = Trigger;\nDrawer.Content = Content;\nDrawer.InnerContent = InnerContent;\nDrawer.Title = Title;\nDrawer.Footer = Footer;\nDrawer.Close = Close;\nDrawer.Actions = Actions;\nDrawer.Outlet = Outlet;\n"],"names":["React","Outlet","Drawer","useControlled","useDrawerStack","open","DrawerContext","DrawerPrimitive","Trigger","Content","InnerContent","Title","Footer","Close","Actions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DA,MAAM,sBAAsB;AAE5B,MAAM,SAASA,iBAAM,WAAW,SAASC,QAAO,OAAoB,KAAgC;AAChG,QAAM,YAAY,GAAG,gDAAgD,MAAM,SAAS;AACpF,SACID,iCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,aAAU;AAAA,MACV,yBAAuB,MAAM,QAAQ;AAAA,MACrC;AAAA,IAAA;AAAA,EAAA;AAGZ,CAAC;AAaM,MAAM,SAASA,iBAAM,WAAW,SAASE,QAAO,OAAoB,KAA6B;AACpG,QAAM;AAAA,IACF;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,CAAC,QAAQ,SAAS,IAAIF,iBAAM,SAAA;AAClC,QAAM,eAAeA,iBAAM,OAAqB,IAAI;AAEpD,QAAM,CAAC,MAAM,OAAO,IAAIG,4BAAuB;AAAA,IAC3C,OAAO,MAAM;AAAA,IACb,cAAc,MAAM,eAAe;AAAA,IACnC;AAAA,EAAA,CACH;AAEDC,gCAAe;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ,MAAM;AAEV,mBAAa,SAAS,OAAA;AAAA,IAC1B;AAAA,EAAA,CACH;AAED,QAAM,UAAUJ,iBAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEJ,CAAC,cAAc,YAAY,SAAS,UAAU,SAAS,MAAM,iBAAiB,QAAQ,WAAW;AAAA,EAAA;AAGrG,QAAM,mBAAmB,CAACK,OAAe,iBAA0D;AAC/F,QAAI,aAAa,WAAW,cAAc;AACtC,YAAM,2BAA4B,aAAa,MAAM,QAAwB;AAAA,QACzE;AAAA,MAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAA;AAEb,qBAAa,iBAAA;AACb;AAAA,MACJ,WAAW,YAAY,YAAY;AAC/B,qBAAa,OAAA;AACb;AAAA,MACJ;AAAA,IACJ;AAEA,cAAUA,KAAI;AAEd,QAAIA,UAAS,OAAO;AAChB,gBAAA;AAAA,IACJ;AAAA,EACJ;AAEAL,mBAAM,UAAU,MAAM;AAClB,UAAM,iBAAiB,sDAAsD,cAAc,mBAAmB;AAC9G,UAAM,gBAAgB,SAAS,cAA2B,cAAc,KAAK,SAAS;AACtF,cAAU,aAAa;AAAA,EAC3B,GAAG,CAAC,UAAU,CAAC;AAEf,SACIA,iCAAA,cAACM,sBAAc,UAAd,EAAuB,OAAO,WAC3BN,iCAAA;AAAA,IAACO,OAAAA,OAAgB;AAAA,IAAhB;AAAA,MACG,yBAAyB,YAAY;AAAA,MACrC,OAAO,YAAY;AAAA,MACnB;AAAA,MACA,cAAc;AAAA,MACd,gBAAe;AAAA,IAAA;AAAA,IACd,WAAWP,iCAAA,cAACQ,QAAAA,SAAA,MAAS,OAAQ;AAAA,IAC7B;AAAA,EAAA,CAET;AAER,CAAC;AAED,OAAO,UAAUA,QAAAA;AACjB,OAAO,UAAUC,QAAAA;AACjB,OAAO,eAAeC,QAAAA;AACtB,OAAO,QAAQC,QAAAA;AACf,OAAO,SAASC,QAAAA;AAChB,OAAO,QAAQC,QAAAA;AACf,OAAO,UAAUC,QAAAA;AACjB,OAAO,SAAS;;"}

package/dist/components/Drawer/Drawer.d.ts

@@ -1,4 +1,4 @@
-import { GroupProps } from '../Group/Group';
+import { GroupProps } from '..';
 import { DrawerInnerContentProps, DrawerFooterProps, DrawerTitleProps, DrawerContentProps, DrawerCloseProps } from './components/Content';
 import { DrawerTriggerProps } from './components/Trigger';
 import { DrawerSize, DrawerVariant } from './types';