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

package/dist/components/Select2/components/Edit.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Edit.cjs","sources":["../../../../src/components/Select2/components/Edit.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { Color } from '../../../types';\nimport { AVAILABLE_COLORS, SUBTLE_COLOR_SHADE_CLASSNAME } from '../../../utils/tailwind';\nimport { Field } from '../../Field/Field';\nimport { Icon } from '../../Icon/Icon';\nimport { Inline } from '../../Inline/Inline';\nimport { Input } from '../../Input/Input';\nimport { LegacyButton } from '../../LegacyComponents/Button/Button';\nimport type { PopoverProps } from '../../Popover/Popover';\nimport { Popover } from '../../Popover/Popover';\nimport { useLocalization } from '../../Provider/Localization';\nimport type { Select2OptionValue } from '../types';\n\nimport { useSelect2Context } from './Context';\n\nexport type EditPopoverProps = PopoverProps & {\n    color?: Color;\n    text: string;\n    value: Select2OptionValue;\n};\n\nexport const EditPopover = (props: EditPopoverProps) => {\n    const { color: initialColor, text: initialName, value, ...popoverProps } = props;\n    const ref = React.useRef<HTMLInputElement>(null);\n    const { onDelete, onEdit, searchRef, ref: selectRef } = useSelect2Context();\n    const { texts } = useLocalization();\n    const [name, setName] = React.useState(initialName);\n    const [color, setColor] = React.useState(initialColor);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        setName(event.target.value);\n        setValidationError(undefined);\n    };\n\n    const handleInputKeyDown = (close: () => void) => async (event: React.KeyboardEvent<HTMLInputElement>) => {\n        event.stopPropagation();\n\n        if (event.key === 'Escape') {\n            close();\n        } else if (event.key === 'Enter') {\n            const fn = handleSave(close);\n            await fn(event);\n        }\n    };\n\n    const handleDelete = (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement>) => {\n        event.stopPropagation();\n        close();\n\n        if (onDelete) {\n            await onDelete(value);\n        }\n    };\n\n    const handleSave =\n        (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>) => {\n            if (onEdit && (name !== initialName || color !== initialColor)) {\n                try {\n                    await onEdit(value, name, color);\n                    close();\n                } catch (error) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    setValidationError(error as Error);\n                    ref.current?.focus();\n                }\n            } else {\n                close();\n            }\n        };\n\n    const handleCloseAutoFocus = () => {\n        setName(initialName);\n        setColor(initialColor);\n        setValidationError(undefined);\n\n        if (searchRef?.current) {\n            searchRef.current?.focus();\n        } else {\n            selectRef.current?.focus();\n        }\n    };\n\n    const preventKeyDownPropagation = (event: React.KeyboardEvent) => {\n        // Need to allow 'Escape', 'Tab', 'Shift + Tab' to support default focus and close behaviour of Radix Popover.\n        if (event.key === 'Escape' || event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            return;\n        }\n        event.stopPropagation();\n    };\n\n    const popoverContentKeyDown = (event: React.KeyboardEvent) => {\n        // Need to stop propagation of 'Tab', 'Shift + Tab' keys out of Popover content,\n        // to avoid 'Tab' key execution on Option component and closing the dropdown.\n        if (event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} modal={false}>\n            <Popover.Content\n                finalFocus={handleCloseAutoFocus}\n                onClick={event => event.stopPropagation()}\n                onKeyDown={popoverContentKeyDown}\n                placement=\"right\"\n                tabIndex={-1}\n                className=\"focus:!shadow-none\">\n                {({ close }) => (\n                    <>\n                        <div className=\"flex w-32 flex-col space-y-2\" data-taco=\"edit-popover\">\n                            {onEdit ? (\n                                <>\n                                    <Field\n                                        className={cn('!min-h-fit', { '!pb-0': !validationError })}\n                                        invalid={!!validationError}\n                                        message={validationError?.message}>\n                                        <Input\n                                            invalid={!!validationError}\n                                            onChange={handleInputChange}\n                                            onKeyDown={handleInputKeyDown(close)}\n                                            ref={ref}\n                                            value={name}\n                                        />\n                                    </Field>\n                                    {initialColor ? (\n                                        <>\n                                            <h5>Colours</h5>\n                                            <Colours\n                                                color={color}\n                                                onChangeColor={setColor}\n                                                onKeyDown={preventKeyDownPropagation}\n                                            />\n                                        </>\n                                    ) : null}\n                                    <Inline spacing={4} noWrap>\n                                        <LegacyButton onClick={close}>{texts.select2.cancel}</LegacyButton>\n                                        <LegacyButton\n                                            appearance=\"primary\"\n                                            onClick={handleSave(close) as (event: React.MouseEvent<HTMLButtonElement>) => void}>\n                                            {texts.select2.save}\n                                        </LegacyButton>\n                                    </Inline>\n                                </>\n                            ) : null}\n                            {onEdit && onDelete ? <hr /> : null}\n                            {onDelete ? (\n                                <button\n                                    className=\"flex items-center justify-start gap-1 hover:text-gray-700\"\n                                    onClick={handleDelete(close)}\n                                    onKeyDown={preventKeyDownPropagation}>\n                                    <Icon className=\"!h-5 !w-5\" name=\"delete-permanently\" /> {texts.select2.delete}\n                                </button>\n                            ) : null}\n                        </div>\n                    </>\n                )}\n            </Popover.Content>\n        </Popover>\n    );\n};\n\ntype Props = {\n    color: string | undefined;\n    onChangeColor: React.Dispatch<React.SetStateAction<Color | undefined>>;\n    onKeyDown: (event: React.KeyboardEvent) => void;\n};\n\nconst Colours = (props: Props) => {\n    const { color, onChangeColor, onKeyDown } = props;\n    const { texts } = useLocalization();\n\n    const name = React.useId();\n\n    return (\n        <div role=\"radiogroup\" aria-label={texts.select2.chooseColor} className=\"grid grid-cols-4 gap-2 focus:outline-none\">\n            {AVAILABLE_COLORS.map((availableColor: Color) => {\n                const isSelected = color === availableColor;\n\n                return (\n                    <label\n                        key={availableColor}\n                        aria-label={color}\n                        data-taco={`${availableColor}-radio`}\n                        className=\"cursor-pointer\">\n                        <input\n                            type=\"radio\"\n                            name={name}\n                            value={availableColor}\n                            checked={isSelected}\n                            onChange={() => onChangeColor(availableColor)}\n                            onKeyDown={onKeyDown}\n                            className=\"peer sr-only\"\n                        />\n                        <div\n                            className={cn(\n                                'flex h-6 w-6 cursor-pointer items-center justify-center rounded',\n                                SUBTLE_COLOR_SHADE_CLASSNAME[availableColor],\n                                'peer-focus-visible:ring-2 peer-focus-visible:ring-blue-500'\n                            )}>\n                            {isSelected && <Icon name=\"tick\" className=\"!h-5 !w-5\" />}\n                        </div>\n                    </label>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["useSelect2Context","useLocalization","Popover","Field","Input","Inline","LegacyButton","Icon","AVAILABLE_COLORS","SUBTLE_COLOR_SHADE_CLASSNAME"],"mappings":"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"}
+{"version":3,"file":"Edit.cjs","sources":["../../../../src/components/Select2/components/Edit.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { PopoverProps } from '@/components';\nimport { Field, Icon, Inline, Input, LegacyButton, Popover, useLocalization } from '@/components';\nimport type { Color } from '@/types';\nimport { AVAILABLE_COLORS, SUBTLE_COLOR_SHADE_CLASSNAME } from '@/utils/tailwind';\n\nimport type { Select2OptionValue } from '../types';\n\nimport { useSelect2Context } from './Context';\n\nexport type EditPopoverProps = PopoverProps & {\n    color?: Color;\n    text: string;\n    value: Select2OptionValue;\n};\n\nexport const EditPopover = (props: EditPopoverProps) => {\n    const { color: initialColor, text: initialName, value, ...popoverProps } = props;\n    const ref = React.useRef<HTMLInputElement>(null);\n    const { onDelete, onEdit, searchRef, ref: selectRef } = useSelect2Context();\n    const { texts } = useLocalization();\n    const [name, setName] = React.useState(initialName);\n    const [color, setColor] = React.useState(initialColor);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        setName(event.target.value);\n        setValidationError(undefined);\n    };\n\n    const handleInputKeyDown = (close: () => void) => async (event: React.KeyboardEvent<HTMLInputElement>) => {\n        event.stopPropagation();\n\n        if (event.key === 'Escape') {\n            close();\n        } else if (event.key === 'Enter') {\n            const fn = handleSave(close);\n            await fn(event);\n        }\n    };\n\n    const handleDelete = (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement>) => {\n        event.stopPropagation();\n        close();\n\n        if (onDelete) {\n            await onDelete(value);\n        }\n    };\n\n    const handleSave =\n        (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>) => {\n            if (onEdit && (name !== initialName || color !== initialColor)) {\n                try {\n                    await onEdit(value, name, color);\n                    close();\n                } catch (error) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    setValidationError(error as Error);\n                    ref.current?.focus();\n                }\n            } else {\n                close();\n            }\n        };\n\n    const handleCloseAutoFocus = () => {\n        setName(initialName);\n        setColor(initialColor);\n        setValidationError(undefined);\n\n        if (searchRef?.current) {\n            searchRef.current?.focus();\n        } else {\n            selectRef.current?.focus();\n        }\n    };\n\n    const preventKeyDownPropagation = (event: React.KeyboardEvent) => {\n        // Need to allow 'Escape', 'Tab', 'Shift + Tab' to support default focus and close behaviour of Radix Popover.\n        if (event.key === 'Escape' || event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            return;\n        }\n        event.stopPropagation();\n    };\n\n    const popoverContentKeyDown = (event: React.KeyboardEvent) => {\n        // Need to stop propagation of 'Tab', 'Shift + Tab' keys out of Popover content,\n        // to avoid 'Tab' key execution on Option component and closing the dropdown.\n        if (event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} modal={false}>\n            <Popover.Content\n                finalFocus={handleCloseAutoFocus}\n                onClick={event => event.stopPropagation()}\n                onKeyDown={popoverContentKeyDown}\n                placement=\"right\"\n                tabIndex={-1}\n                className=\"focus:!shadow-none\">\n                {({ close }) => (\n                    <>\n                        <div className=\"flex w-32 flex-col space-y-2\" data-taco=\"edit-popover\">\n                            {onEdit ? (\n                                <>\n                                    <Field\n                                        className={cn('!min-h-fit', { '!pb-0': !validationError })}\n                                        invalid={!!validationError}\n                                        message={validationError?.message}>\n                                        <Input\n                                            invalid={!!validationError}\n                                            onChange={handleInputChange}\n                                            onKeyDown={handleInputKeyDown(close)}\n                                            ref={ref}\n                                            value={name}\n                                        />\n                                    </Field>\n                                    {initialColor ? (\n                                        <>\n                                            <h5>Colours</h5>\n                                            <Colours\n                                                color={color}\n                                                onChangeColor={setColor}\n                                                onKeyDown={preventKeyDownPropagation}\n                                            />\n                                        </>\n                                    ) : null}\n                                    <Inline spacing={4} noWrap>\n                                        <LegacyButton onClick={close}>{texts.select2.cancel}</LegacyButton>\n                                        <LegacyButton\n                                            appearance=\"primary\"\n                                            onClick={handleSave(close) as (event: React.MouseEvent<HTMLButtonElement>) => void}>\n                                            {texts.select2.save}\n                                        </LegacyButton>\n                                    </Inline>\n                                </>\n                            ) : null}\n                            {onEdit && onDelete ? <hr /> : null}\n                            {onDelete ? (\n                                <button\n                                    className=\"flex items-center justify-start gap-1 hover:text-gray-700\"\n                                    onClick={handleDelete(close)}\n                                    onKeyDown={preventKeyDownPropagation}>\n                                    <Icon className=\"!h-5 !w-5\" name=\"delete-permanently\" /> {texts.select2.delete}\n                                </button>\n                            ) : null}\n                        </div>\n                    </>\n                )}\n            </Popover.Content>\n        </Popover>\n    );\n};\n\ntype Props = {\n    color: string | undefined;\n    onChangeColor: React.Dispatch<React.SetStateAction<Color | undefined>>;\n    onKeyDown: (event: React.KeyboardEvent) => void;\n};\n\nconst Colours = (props: Props) => {\n    const { color, onChangeColor, onKeyDown } = props;\n    const { texts } = useLocalization();\n\n    const name = React.useId();\n\n    return (\n        <div role=\"radiogroup\" aria-label={texts.select2.chooseColor} className=\"grid grid-cols-4 gap-2 focus:outline-none\">\n            {AVAILABLE_COLORS.map((availableColor: Color) => {\n                const isSelected = color === availableColor;\n\n                return (\n                    <label\n                        key={availableColor}\n                        aria-label={color}\n                        data-taco={`${availableColor}-radio`}\n                        className=\"cursor-pointer\">\n                        <input\n                            type=\"radio\"\n                            name={name}\n                            value={availableColor}\n                            checked={isSelected}\n                            onChange={() => onChangeColor(availableColor)}\n                            onKeyDown={onKeyDown}\n                            className=\"peer sr-only\"\n                        />\n                        <div\n                            className={cn(\n                                'flex h-6 w-6 cursor-pointer items-center justify-center rounded',\n                                SUBTLE_COLOR_SHADE_CLASSNAME[availableColor],\n                                'peer-focus-visible:ring-2 peer-focus-visible:ring-blue-500'\n                            )}>\n                            {isSelected && <Icon name=\"tick\" className=\"!h-5 !w-5\" />}\n                        </div>\n                    </label>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["useSelect2Context","useLocalization","Popover","Field","Input","Inline","LegacyButton","Icon","AVAILABLE_COLORS","SUBTLE_COLOR_SHADE_CLASSNAME"],"mappings":"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"}

package/dist/components/Select2/components/Edit.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
+import { PopoverProps } from '../..';
 import { Color } from '../../../types';
-import { PopoverProps } from '../../Popover/Popover';
 import { Select2OptionValue } from '../types';
 export type EditPopoverProps = PopoverProps & {
     color?: Color;

package/dist/components/Select2/components/Edit.js

@@ -1,14 +1,14 @@
 import cn from "clsx";
 import React__default from "react";
 import { AVAILABLE_COLORS, SUBTLE_COLOR_SHADE_CLASSNAME } from "../../../utils/tailwind.js";
+import { useSelect2Context } from "./Context.js";
+import { useLocalization } from "../../Provider/Localization.js";
+import { Popover } from "../../Popover/Popover.js";
 import { Field } from "../../Field/Field.js";
-import { Icon } from "../../Icon/Icon.js";
-import { Inline } from "../../Inline/Inline.js";
 import { Input } from "../../Input/Input.js";
+import { Inline } from "../../Inline/Inline.js";
 import { LegacyButton } from "../../LegacyComponents/Button/Button.js";
-import { Popover } from "../../Popover/Popover.js";
-import { useLocalization } from "../../Provider/Localization.js";
-import { useSelect2Context } from "./Context.js";
+import { Icon } from "../../Icon/Icon.js";
 const EditPopover = (props) => {
   const { color: initialColor, text: initialName, value, ...popoverProps } = props;
   const ref = React__default.useRef(null);

package/dist/components/Select2/components/Edit.js.map

@@ -1 +1 @@
-{"version":3,"file":"Edit.js","sources":["../../../../src/components/Select2/components/Edit.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { Color } from '../../../types';\nimport { AVAILABLE_COLORS, SUBTLE_COLOR_SHADE_CLASSNAME } from '../../../utils/tailwind';\nimport { Field } from '../../Field/Field';\nimport { Icon } from '../../Icon/Icon';\nimport { Inline } from '../../Inline/Inline';\nimport { Input } from '../../Input/Input';\nimport { LegacyButton } from '../../LegacyComponents/Button/Button';\nimport type { PopoverProps } from '../../Popover/Popover';\nimport { Popover } from '../../Popover/Popover';\nimport { useLocalization } from '../../Provider/Localization';\nimport type { Select2OptionValue } from '../types';\n\nimport { useSelect2Context } from './Context';\n\nexport type EditPopoverProps = PopoverProps & {\n    color?: Color;\n    text: string;\n    value: Select2OptionValue;\n};\n\nexport const EditPopover = (props: EditPopoverProps) => {\n    const { color: initialColor, text: initialName, value, ...popoverProps } = props;\n    const ref = React.useRef<HTMLInputElement>(null);\n    const { onDelete, onEdit, searchRef, ref: selectRef } = useSelect2Context();\n    const { texts } = useLocalization();\n    const [name, setName] = React.useState(initialName);\n    const [color, setColor] = React.useState(initialColor);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        setName(event.target.value);\n        setValidationError(undefined);\n    };\n\n    const handleInputKeyDown = (close: () => void) => async (event: React.KeyboardEvent<HTMLInputElement>) => {\n        event.stopPropagation();\n\n        if (event.key === 'Escape') {\n            close();\n        } else if (event.key === 'Enter') {\n            const fn = handleSave(close);\n            await fn(event);\n        }\n    };\n\n    const handleDelete = (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement>) => {\n        event.stopPropagation();\n        close();\n\n        if (onDelete) {\n            await onDelete(value);\n        }\n    };\n\n    const handleSave =\n        (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>) => {\n            if (onEdit && (name !== initialName || color !== initialColor)) {\n                try {\n                    await onEdit(value, name, color);\n                    close();\n                } catch (error) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    setValidationError(error as Error);\n                    ref.current?.focus();\n                }\n            } else {\n                close();\n            }\n        };\n\n    const handleCloseAutoFocus = () => {\n        setName(initialName);\n        setColor(initialColor);\n        setValidationError(undefined);\n\n        if (searchRef?.current) {\n            searchRef.current?.focus();\n        } else {\n            selectRef.current?.focus();\n        }\n    };\n\n    const preventKeyDownPropagation = (event: React.KeyboardEvent) => {\n        // Need to allow 'Escape', 'Tab', 'Shift + Tab' to support default focus and close behaviour of Radix Popover.\n        if (event.key === 'Escape' || event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            return;\n        }\n        event.stopPropagation();\n    };\n\n    const popoverContentKeyDown = (event: React.KeyboardEvent) => {\n        // Need to stop propagation of 'Tab', 'Shift + Tab' keys out of Popover content,\n        // to avoid 'Tab' key execution on Option component and closing the dropdown.\n        if (event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} modal={false}>\n            <Popover.Content\n                finalFocus={handleCloseAutoFocus}\n                onClick={event => event.stopPropagation()}\n                onKeyDown={popoverContentKeyDown}\n                placement=\"right\"\n                tabIndex={-1}\n                className=\"focus:!shadow-none\">\n                {({ close }) => (\n                    <>\n                        <div className=\"flex w-32 flex-col space-y-2\" data-taco=\"edit-popover\">\n                            {onEdit ? (\n                                <>\n                                    <Field\n                                        className={cn('!min-h-fit', { '!pb-0': !validationError })}\n                                        invalid={!!validationError}\n                                        message={validationError?.message}>\n                                        <Input\n                                            invalid={!!validationError}\n                                            onChange={handleInputChange}\n                                            onKeyDown={handleInputKeyDown(close)}\n                                            ref={ref}\n                                            value={name}\n                                        />\n                                    </Field>\n                                    {initialColor ? (\n                                        <>\n                                            <h5>Colours</h5>\n                                            <Colours\n                                                color={color}\n                                                onChangeColor={setColor}\n                                                onKeyDown={preventKeyDownPropagation}\n                                            />\n                                        </>\n                                    ) : null}\n                                    <Inline spacing={4} noWrap>\n                                        <LegacyButton onClick={close}>{texts.select2.cancel}</LegacyButton>\n                                        <LegacyButton\n                                            appearance=\"primary\"\n                                            onClick={handleSave(close) as (event: React.MouseEvent<HTMLButtonElement>) => void}>\n                                            {texts.select2.save}\n                                        </LegacyButton>\n                                    </Inline>\n                                </>\n                            ) : null}\n                            {onEdit && onDelete ? <hr /> : null}\n                            {onDelete ? (\n                                <button\n                                    className=\"flex items-center justify-start gap-1 hover:text-gray-700\"\n                                    onClick={handleDelete(close)}\n                                    onKeyDown={preventKeyDownPropagation}>\n                                    <Icon className=\"!h-5 !w-5\" name=\"delete-permanently\" /> {texts.select2.delete}\n                                </button>\n                            ) : null}\n                        </div>\n                    </>\n                )}\n            </Popover.Content>\n        </Popover>\n    );\n};\n\ntype Props = {\n    color: string | undefined;\n    onChangeColor: React.Dispatch<React.SetStateAction<Color | undefined>>;\n    onKeyDown: (event: React.KeyboardEvent) => void;\n};\n\nconst Colours = (props: Props) => {\n    const { color, onChangeColor, onKeyDown } = props;\n    const { texts } = useLocalization();\n\n    const name = React.useId();\n\n    return (\n        <div role=\"radiogroup\" aria-label={texts.select2.chooseColor} className=\"grid grid-cols-4 gap-2 focus:outline-none\">\n            {AVAILABLE_COLORS.map((availableColor: Color) => {\n                const isSelected = color === availableColor;\n\n                return (\n                    <label\n                        key={availableColor}\n                        aria-label={color}\n                        data-taco={`${availableColor}-radio`}\n                        className=\"cursor-pointer\">\n                        <input\n                            type=\"radio\"\n                            name={name}\n                            value={availableColor}\n                            checked={isSelected}\n                            onChange={() => onChangeColor(availableColor)}\n                            onKeyDown={onKeyDown}\n                            className=\"peer sr-only\"\n                        />\n                        <div\n                            className={cn(\n                                'flex h-6 w-6 cursor-pointer items-center justify-center rounded',\n                                SUBTLE_COLOR_SHADE_CLASSNAME[availableColor],\n                                'peer-focus-visible:ring-2 peer-focus-visible:ring-blue-500'\n                            )}>\n                            {isSelected && <Icon name=\"tick\" className=\"!h-5 !w-5\" />}\n                        </div>\n                    </label>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"Edit.js","sources":["../../../../src/components/Select2/components/Edit.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { PopoverProps } from '@/components';\nimport { Field, Icon, Inline, Input, LegacyButton, Popover, useLocalization } from '@/components';\nimport type { Color } from '@/types';\nimport { AVAILABLE_COLORS, SUBTLE_COLOR_SHADE_CLASSNAME } from '@/utils/tailwind';\n\nimport type { Select2OptionValue } from '../types';\n\nimport { useSelect2Context } from './Context';\n\nexport type EditPopoverProps = PopoverProps & {\n    color?: Color;\n    text: string;\n    value: Select2OptionValue;\n};\n\nexport const EditPopover = (props: EditPopoverProps) => {\n    const { color: initialColor, text: initialName, value, ...popoverProps } = props;\n    const ref = React.useRef<HTMLInputElement>(null);\n    const { onDelete, onEdit, searchRef, ref: selectRef } = useSelect2Context();\n    const { texts } = useLocalization();\n    const [name, setName] = React.useState(initialName);\n    const [color, setColor] = React.useState(initialColor);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        setName(event.target.value);\n        setValidationError(undefined);\n    };\n\n    const handleInputKeyDown = (close: () => void) => async (event: React.KeyboardEvent<HTMLInputElement>) => {\n        event.stopPropagation();\n\n        if (event.key === 'Escape') {\n            close();\n        } else if (event.key === 'Enter') {\n            const fn = handleSave(close);\n            await fn(event);\n        }\n    };\n\n    const handleDelete = (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement>) => {\n        event.stopPropagation();\n        close();\n\n        if (onDelete) {\n            await onDelete(value);\n        }\n    };\n\n    const handleSave =\n        (close: () => void) => async (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>) => {\n            if (onEdit && (name !== initialName || color !== initialColor)) {\n                try {\n                    await onEdit(value, name, color);\n                    close();\n                } catch (error) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    setValidationError(error as Error);\n                    ref.current?.focus();\n                }\n            } else {\n                close();\n            }\n        };\n\n    const handleCloseAutoFocus = () => {\n        setName(initialName);\n        setColor(initialColor);\n        setValidationError(undefined);\n\n        if (searchRef?.current) {\n            searchRef.current?.focus();\n        } else {\n            selectRef.current?.focus();\n        }\n    };\n\n    const preventKeyDownPropagation = (event: React.KeyboardEvent) => {\n        // Need to allow 'Escape', 'Tab', 'Shift + Tab' to support default focus and close behaviour of Radix Popover.\n        if (event.key === 'Escape' || event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            return;\n        }\n        event.stopPropagation();\n    };\n\n    const popoverContentKeyDown = (event: React.KeyboardEvent) => {\n        // Need to stop propagation of 'Tab', 'Shift + Tab' keys out of Popover content,\n        // to avoid 'Tab' key execution on Option component and closing the dropdown.\n        if (event.key === 'Tab' || (event.key === 'Tab' && event.shiftKey)) {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} modal={false}>\n            <Popover.Content\n                finalFocus={handleCloseAutoFocus}\n                onClick={event => event.stopPropagation()}\n                onKeyDown={popoverContentKeyDown}\n                placement=\"right\"\n                tabIndex={-1}\n                className=\"focus:!shadow-none\">\n                {({ close }) => (\n                    <>\n                        <div className=\"flex w-32 flex-col space-y-2\" data-taco=\"edit-popover\">\n                            {onEdit ? (\n                                <>\n                                    <Field\n                                        className={cn('!min-h-fit', { '!pb-0': !validationError })}\n                                        invalid={!!validationError}\n                                        message={validationError?.message}>\n                                        <Input\n                                            invalid={!!validationError}\n                                            onChange={handleInputChange}\n                                            onKeyDown={handleInputKeyDown(close)}\n                                            ref={ref}\n                                            value={name}\n                                        />\n                                    </Field>\n                                    {initialColor ? (\n                                        <>\n                                            <h5>Colours</h5>\n                                            <Colours\n                                                color={color}\n                                                onChangeColor={setColor}\n                                                onKeyDown={preventKeyDownPropagation}\n                                            />\n                                        </>\n                                    ) : null}\n                                    <Inline spacing={4} noWrap>\n                                        <LegacyButton onClick={close}>{texts.select2.cancel}</LegacyButton>\n                                        <LegacyButton\n                                            appearance=\"primary\"\n                                            onClick={handleSave(close) as (event: React.MouseEvent<HTMLButtonElement>) => void}>\n                                            {texts.select2.save}\n                                        </LegacyButton>\n                                    </Inline>\n                                </>\n                            ) : null}\n                            {onEdit && onDelete ? <hr /> : null}\n                            {onDelete ? (\n                                <button\n                                    className=\"flex items-center justify-start gap-1 hover:text-gray-700\"\n                                    onClick={handleDelete(close)}\n                                    onKeyDown={preventKeyDownPropagation}>\n                                    <Icon className=\"!h-5 !w-5\" name=\"delete-permanently\" /> {texts.select2.delete}\n                                </button>\n                            ) : null}\n                        </div>\n                    </>\n                )}\n            </Popover.Content>\n        </Popover>\n    );\n};\n\ntype Props = {\n    color: string | undefined;\n    onChangeColor: React.Dispatch<React.SetStateAction<Color | undefined>>;\n    onKeyDown: (event: React.KeyboardEvent) => void;\n};\n\nconst Colours = (props: Props) => {\n    const { color, onChangeColor, onKeyDown } = props;\n    const { texts } = useLocalization();\n\n    const name = React.useId();\n\n    return (\n        <div role=\"radiogroup\" aria-label={texts.select2.chooseColor} className=\"grid grid-cols-4 gap-2 focus:outline-none\">\n            {AVAILABLE_COLORS.map((availableColor: Color) => {\n                const isSelected = color === availableColor;\n\n                return (\n                    <label\n                        key={availableColor}\n                        aria-label={color}\n                        data-taco={`${availableColor}-radio`}\n                        className=\"cursor-pointer\">\n                        <input\n                            type=\"radio\"\n                            name={name}\n                            value={availableColor}\n                            checked={isSelected}\n                            onChange={() => onChangeColor(availableColor)}\n                            onKeyDown={onKeyDown}\n                            className=\"peer sr-only\"\n                        />\n                        <div\n                            className={cn(\n                                'flex h-6 w-6 cursor-pointer items-center justify-center rounded',\n                                SUBTLE_COLOR_SHADE_CLASSNAME[availableColor],\n                                'peer-focus-visible:ring-2 peer-focus-visible:ring-blue-500'\n                            )}>\n                            {isSelected && <Icon name=\"tick\" className=\"!h-5 !w-5\" />}\n                        </div>\n                    </label>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/components/Select2/components/Group.cjs

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const cn = require("clsx");
 const React = require("react");
-const utilities = require("../utilities.cjs");
 const Group$1 = require("../../../primitives/Listbox2/components/Group.cjs");
 const Title = require("../../../primitives/Listbox2/components/Title.cjs");
+const utilities = require("../utilities.cjs");
 const Group = React.forwardRef(function Select2Group(props, ref) {
   const { children, heading, hasSeparator, ...attributes } = props;
   const className = cn(

package/dist/components/Select2/components/Group.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Group.cjs","sources":["../../../../src/components/Select2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\nimport { createCollectionClassName } from '../utilities';\n\nimport type { Select2OptionProps } from './Option';\n\nexport type Select2GroupProps = Omit<ListboxPrimitive.Listbox2GroupProps, 'children'> & {\n    children: React.ReactElement<Select2OptionProps>[];\n    hasSeparator?: boolean;\n    heading?: string;\n};\n\nexport const Group = React.forwardRef<HTMLDivElement, Select2GroupProps>(function Select2Group(props, ref) {\n    const { children, heading, hasSeparator, ...attributes } = props;\n    const className = cn(\n        createCollectionClassName(),\n        {\n            \"after:mx-2 after:my-1 after:h-px after:bg-gray-300 after:content-[''] last:after:content-none\":\n                hasSeparator && children.length,\n        },\n        props.className\n    );\n\n    return (\n        <ListboxPrimitive.Group {...attributes} className={className} ref={ref}>\n            <ListboxPrimitive.Title className=\"sticky top-0 bg-white px-2 font-bold leading-8\">{heading}</ListboxPrimitive.Title>\n            {children}\n        </ListboxPrimitive.Group>\n    );\n});\n"],"names":["createCollectionClassName","ListboxPrimitive.Group","ListboxPrimitive.Title"],"mappings":";;;;;;;AAcO,MAAM,QAAQ,MAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,EAAE,UAAU,SAAS,cAAc,GAAG,eAAe;AAC3D,QAAM,YAAY;AAAA,IACdA,oCAAA;AAAA,IACA;AAAA,MACI,iGACI,gBAAgB,SAAS;AAAA,IAAA;AAAA,IAEjC,MAAM;AAAA,EAAA;AAGV,6CACKC,QAAAA,OAAA,EAAwB,GAAG,YAAY,WAAsB,IAAA,GAC1D,sBAAA,cAACC,MAAAA,OAAA,EAAuB,WAAU,iDAAA,GAAkD,OAAQ,GAC3F,QACL;AAER,CAAC;;"}
+{"version":3,"file":"Group.cjs","sources":["../../../../src/components/Select2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '@/primitives/Listbox2/Listbox2';\n\nimport { createCollectionClassName } from '../utilities';\n\nimport type { Select2OptionProps } from './Option';\n\nexport type Select2GroupProps = Omit<ListboxPrimitive.Listbox2GroupProps, 'children'> & {\n    children: React.ReactElement<Select2OptionProps>[];\n    hasSeparator?: boolean;\n    heading?: string;\n};\n\nexport const Group = React.forwardRef<HTMLDivElement, Select2GroupProps>(function Select2Group(props, ref) {\n    const { children, heading, hasSeparator, ...attributes } = props;\n    const className = cn(\n        createCollectionClassName(),\n        {\n            \"after:mx-2 after:my-1 after:h-px after:bg-gray-300 after:content-[''] last:after:content-none\":\n                hasSeparator && children.length,\n        },\n        props.className\n    );\n\n    return (\n        <ListboxPrimitive.Group {...attributes} className={className} ref={ref}>\n            <ListboxPrimitive.Title className=\"sticky top-0 bg-white px-2 font-bold leading-8\">{heading}</ListboxPrimitive.Title>\n            {children}\n        </ListboxPrimitive.Group>\n    );\n});\n"],"names":["createCollectionClassName","ListboxPrimitive.Group","ListboxPrimitive.Title"],"mappings":";;;;;;;AAeO,MAAM,QAAQ,MAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,EAAE,UAAU,SAAS,cAAc,GAAG,eAAe;AAC3D,QAAM,YAAY;AAAA,IACdA,oCAAA;AAAA,IACA;AAAA,MACI,iGACI,gBAAgB,SAAS;AAAA,IAAA;AAAA,IAEjC,MAAM;AAAA,EAAA;AAGV,6CACKC,QAAAA,OAAA,EAAwB,GAAG,YAAY,WAAsB,IAAA,GAC1D,sBAAA,cAACC,MAAAA,OAAA,EAAuB,WAAU,iDAAA,GAAkD,OAAQ,GAC3F,QACL;AAER,CAAC;;"}

package/dist/components/Select2/components/Group.js

@@ -1,8 +1,8 @@
 import cn from "clsx";
 import React__default from "react";
-import { createCollectionClassName } from "../utilities.js";
 import { Group as Group$1 } from "../../../primitives/Listbox2/components/Group.js";
 import { Title } from "../../../primitives/Listbox2/components/Title.js";
+import { createCollectionClassName } from "../utilities.js";
 const Group = React__default.forwardRef(function Select2Group(props, ref) {
   const { children, heading, hasSeparator, ...attributes } = props;
   const className = cn(

package/dist/components/Select2/components/Group.js.map

@@ -1 +1 @@
-{"version":3,"file":"Group.js","sources":["../../../../src/components/Select2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\nimport { createCollectionClassName } from '../utilities';\n\nimport type { Select2OptionProps } from './Option';\n\nexport type Select2GroupProps = Omit<ListboxPrimitive.Listbox2GroupProps, 'children'> & {\n    children: React.ReactElement<Select2OptionProps>[];\n    hasSeparator?: boolean;\n    heading?: string;\n};\n\nexport const Group = React.forwardRef<HTMLDivElement, Select2GroupProps>(function Select2Group(props, ref) {\n    const { children, heading, hasSeparator, ...attributes } = props;\n    const className = cn(\n        createCollectionClassName(),\n        {\n            \"after:mx-2 after:my-1 after:h-px after:bg-gray-300 after:content-[''] last:after:content-none\":\n                hasSeparator && children.length,\n        },\n        props.className\n    );\n\n    return (\n        <ListboxPrimitive.Group {...attributes} className={className} ref={ref}>\n            <ListboxPrimitive.Title className=\"sticky top-0 bg-white px-2 font-bold leading-8\">{heading}</ListboxPrimitive.Title>\n            {children}\n        </ListboxPrimitive.Group>\n    );\n});\n"],"names":["React","ListboxPrimitive.Group","ListboxPrimitive.Title"],"mappings":";;;;;AAcO,MAAM,QAAQA,eAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,EAAE,UAAU,SAAS,cAAc,GAAG,eAAe;AAC3D,QAAM,YAAY;AAAA,IACd,0BAAA;AAAA,IACA;AAAA,MACI,iGACI,gBAAgB,SAAS;AAAA,IAAA;AAAA,IAEjC,MAAM;AAAA,EAAA;AAGV,sDACKC,SAAA,EAAwB,GAAG,YAAY,WAAsB,IAAA,GAC1DD,+BAAA,cAACE,OAAA,EAAuB,WAAU,iDAAA,GAAkD,OAAQ,GAC3F,QACL;AAER,CAAC;"}
+{"version":3,"file":"Group.js","sources":["../../../../src/components/Select2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '@/primitives/Listbox2/Listbox2';\n\nimport { createCollectionClassName } from '../utilities';\n\nimport type { Select2OptionProps } from './Option';\n\nexport type Select2GroupProps = Omit<ListboxPrimitive.Listbox2GroupProps, 'children'> & {\n    children: React.ReactElement<Select2OptionProps>[];\n    hasSeparator?: boolean;\n    heading?: string;\n};\n\nexport const Group = React.forwardRef<HTMLDivElement, Select2GroupProps>(function Select2Group(props, ref) {\n    const { children, heading, hasSeparator, ...attributes } = props;\n    const className = cn(\n        createCollectionClassName(),\n        {\n            \"after:mx-2 after:my-1 after:h-px after:bg-gray-300 after:content-[''] last:after:content-none\":\n                hasSeparator && children.length,\n        },\n        props.className\n    );\n\n    return (\n        <ListboxPrimitive.Group {...attributes} className={className} ref={ref}>\n            <ListboxPrimitive.Title className=\"sticky top-0 bg-white px-2 font-bold leading-8\">{heading}</ListboxPrimitive.Title>\n            {children}\n        </ListboxPrimitive.Group>\n    );\n});\n"],"names":["React","ListboxPrimitive.Group","ListboxPrimitive.Title"],"mappings":";;;;;AAeO,MAAM,QAAQA,eAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,EAAE,UAAU,SAAS,cAAc,GAAG,eAAe;AAC3D,QAAM,YAAY;AAAA,IACd,0BAAA;AAAA,IACA;AAAA,MACI,iGACI,gBAAgB,SAAS;AAAA,IAAA;AAAA,IAEjC,MAAM;AAAA,EAAA;AAGV,sDACKC,SAAA,EAAwB,GAAG,YAAY,WAAsB,IAAA,GAC1DD,+BAAA,cAACE,OAAA,EAAuB,WAAU,iDAAA,GAAkD,OAAQ,GAC3F,QACL;AAER,CAAC;"}

package/dist/components/Select2/components/Option.cjs

@@ -2,16 +2,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const cn = require("clsx");
 const React = require("react");
+const Option$1 = require("../../../primitives/Listbox2/components/Option.cjs");
 const types = require("../../../types.cjs");
 const aria = require("../../../utils/aria.cjs");
 const device = require("../../../utils/device.cjs");
-const Icon = require("../../Icon/Icon.cjs");
-const IconButton = require("../../LegacyComponents/IconButton/IconButton.cjs");
-const Tag = require("../../Tag/Tag.cjs");
 const utilities = require("../utilities.cjs");
 const Context = require("./Context.cjs");
 const Edit = require("./Edit.cjs");
-const Option$1 = require("../../../primitives/Listbox2/components/Option.cjs");
+const Icon = require("../../Icon/Icon.cjs");
+const Tag = require("../../Tag/Tag.cjs");
+const IconButton = require("../../LegacyComponents/IconButton/IconButton.cjs");
 const Option = types.fixedForwardRef(function Select2Option(props, ref) {
   const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;
   const {

package/dist/components/Select2/components/Option.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Option.cjs","sources":["../../../../src/components/Select2/components/Option.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\nimport type { Color, FontSize } from '../../../types';\nimport { fixedForwardRef } from '../../../types';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { isMobileDevice } from '../../../utils/device';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon } from '../../Icon/Icon';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport { Tag } from '../../Tag/Tag';\nimport type { Select2OptionValue } from '../types';\nimport { createOptionClassName, FONT_SIZE_CLASSNAME } from '../utilities';\n\nimport { useSelect2Context } from './Context';\nimport type { EditPopoverProps } from './Edit';\nimport { EditPopover } from './Edit';\n\nexport type Select2OptionProps<T extends Select2OptionValue = Select2OptionValue> = Omit<\n    ListboxPrimitive.Listbox2OptionProps<T>,\n    'children' | 'prefix'\n> & {\n    children: string | React.JSX.Element;\n    color?: Color;\n    description?: string;\n    fontSize?: FontSize;\n    prefix?: IconName | React.JSX.Element;\n    postfix?: IconName | React.JSX.Element;\n    textValue?: string;\n};\n\nexport const Option = fixedForwardRef(function Select2Option<T extends Select2OptionValue>(\n    props: Select2OptionProps<T>,\n    ref: React.Ref<HTMLDivElement>\n) {\n    const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;\n    const {\n        fontSize = 'medium',\n        listboxRef,\n        multiple,\n        onDelete,\n        onEdit,\n        ref: selectRef,\n        setOpen,\n        shouldPauseHoverState,\n        tags,\n        value,\n    } = useSelect2Context();\n    const className = cn(createOptionClassName(shouldPauseHoverState), FONT_SIZE_CLASSNAME[fontSize], cName);\n\n    const hasValue = Array.isArray(value) ? !!value.length : value !== undefined;\n    const isTag = tags && !!color;\n\n    const handleClick = () => {\n        if (multiple) {\n            selectRef.current?.focus();\n        } else {\n            setOpen(false);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (isAriaSelectionKey(event) && (!multiple || event.key === 'Tab')) {\n            setOpen(false);\n        }\n    };\n\n    const isEmptyOption = children !== '';\n\n    const popover =\n        isEmptyOption && (onEdit || onDelete)\n            ? (popoverProps: Partial<EditPopoverProps>) => (\n                  <EditPopover\n                      {...popoverProps}\n                      color={props.color}\n                      key={props.textValue ?? String(props.children)}\n                      text={props.textValue ?? String(props.children)}\n                      value={props.value}\n                  />\n              )\n            : undefined;\n\n    return (\n        <ListboxPrimitive.Option {...otherProps} className={className} onClick={handleClick} onKeyDown={handleKeyDown} ref={ref}>\n            {hasValue ? (\n                <Icon name=\"tick\" className=\"pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible\" />\n            ) : (\n                <span className=\"-mx-0.5 inline-flex h-4 w-4 flex-shrink-0\" aria-hidden />\n            )}\n\n            {typeof children === 'string' ? (\n                isTag ? (\n                    <Tag className=\"pointer-events-none my-1\" color={color} icon={prefix}>\n                        {children}\n                    </Tag>\n                ) : (\n                    <>\n                        {prefix ? typeof prefix === 'string' ? <Icon name={prefix} className=\"!h-5 !w-5\" /> : prefix : null}\n                        <span className=\"flex w-full justify-between\">\n                            <span className=\"flex flex-col\">\n                                <span>{children}</span>\n                                {description ? (\n                                    <span className=\"-mt-1.5 mb-1.5 text-xs text-gray-700\" data-taco=\"description\">\n                                        {description}\n                                    </span>\n                                ) : null}\n                            </span>\n                            <span className=\"flex flex-col self-center\">\n                                {postfix ? (\n                                    typeof postfix === 'string' ? (\n                                        <Icon name={postfix} className=\"!h-5 !w-5\" />\n                                    ) : (\n                                        postfix\n                                    )\n                                ) : null}\n                            </span>\n                        </span>\n                    </>\n                )\n            ) : (\n                <span className=\"w-full\">{children}</span>\n            )}\n            {popover ? (\n                <LegacyIconButton\n                    icon=\"ellipsis-vertical\"\n                    appearance=\"discrete\"\n                    className={cn(\n                        'invisible -mr-1 ml-auto !h-5 min-h-[theme(spacing.6)] !w-5 min-w-[theme(spacing.6)] hover:!bg-black-subtle focus:!shadow-none group-hover:visible group-aria-current:visible',\n                        {\n                            '!visible': isMobileDevice(window?.navigator),\n                        }\n                    )}\n                    onClick={event => {\n                        event.stopPropagation();\n                        listboxRef?.current?.setActiveIndexByElement(event.currentTarget.parentElement as HTMLDivElement);\n                    }}\n                    popover={popover}\n                    tabIndex={-1}\n                />\n            ) : null}\n        </ListboxPrimitive.Option>\n    );\n});\n"],"names":["fixedForwardRef","useSelect2Context","createOptionClassName","FONT_SIZE_CLASSNAME","isAriaSelectionKey","EditPopover","ListboxPrimitive.Option","Icon","Tag","LegacyIconButton","isMobileDevice"],"mappings":";;;;;;;;;;;;;;AAgCO,MAAM,SAASA,MAAAA,gBAAgB,SAAS,cAC3C,OACA,KACF;AACE,QAAM,EAAE,UAAU,OAAO,aAAa,QAAQ,SAAS,WAAW,OAAO,GAAG,WAAA,IAAe;AAC3F,QAAM;AAAA,IACF,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACAC,0BAAA;AACJ,QAAM,YAAY,GAAGC,gCAAsB,qBAAqB,GAAGC,8BAAoB,QAAQ,GAAG,KAAK;AAEvG,QAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,CAAC,CAAC,MAAM,SAAS,UAAU;AACnE,QAAM,QAAQ,QAAQ,CAAC,CAAC;AAExB,QAAM,cAAc,MAAM;AACtB,QAAI,UAAU;AACV,gBAAU,SAAS,MAAA;AAAA,IACvB,OAAO;AACH,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AAClD,QAAIC,KAAAA,mBAAmB,KAAK,MAAM,CAAC,YAAY,MAAM,QAAQ,QAAQ;AACjE,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,aAAa;AAEnC,QAAM,UACF,kBAAkB,UAAU,YACtB,CAAC,iBACG,sBAAA;AAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,OAAO,MAAM;AAAA,MACb,KAAK,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC7C,MAAM,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC9C,OAAO,MAAM;AAAA,IAAA;AAAA,EAAA,IAGrB;AAEV,SACI,sBAAA,cAACC,SAAAA,QAAA,EAAyB,GAAG,YAAY,WAAsB,SAAS,aAAa,WAAW,eAAe,OAC1G,WACG,sBAAA,cAACC,KAAAA,QAAK,MAAK,QAAO,WAAU,8EAAA,CAA8E,IAE1G,sBAAA,cAAC,QAAA,EAAK,WAAU,6CAA4C,eAAW,KAAA,CAAC,GAG3E,OAAO,aAAa,WACjB,QACI,sBAAA,cAACC,IAAAA,KAAA,EAAI,WAAU,4BAA2B,OAAc,MAAM,UACzD,QACL,IAEA,sBAAA,cAAA,MAAA,UAAA,MACK,SAAS,OAAO,WAAW,WAAW,sBAAA,cAACD,KAAAA,MAAA,EAAK,MAAM,QAAQ,WAAU,YAAA,CAAY,IAAK,SAAS,0CAC9F,QAAA,EAAK,WAAU,iCACZ,sBAAA,cAAC,QAAA,EAAK,WAAU,gBAAA,GACZ,sBAAA,cAAC,QAAA,MAAM,QAAS,GACf,cACG,sBAAA,cAAC,QAAA,EAAK,WAAU,wCAAuC,aAAU,cAAA,GAC5D,WACL,IACA,IACR,GACA,sBAAA,cAAC,UAAK,WAAU,4BAAA,GACX,UACG,OAAO,YAAY,WACf,sBAAA,cAACA,KAAAA,MAAA,EAAK,MAAM,SAAS,WAAU,YAAA,CAAY,IAE3C,UAEJ,IACR,CACJ,CACJ,IAGJ,sBAAA,cAAC,UAAK,WAAU,SAAA,GAAU,QAAS,GAEtC,UACG,sBAAA;AAAA,IAACE,WAAAA;AAAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,YAAW;AAAA,MACX,WAAW;AAAA,QACP;AAAA,QACA;AAAA,UACI,YAAYC,OAAAA,eAAe,QAAQ,SAAS;AAAA,QAAA;AAAA,MAChD;AAAA,MAEJ,SAAS,CAAA,UAAS;AACd,cAAM,gBAAA;AACN,oBAAY,SAAS,wBAAwB,MAAM,cAAc,aAA+B;AAAA,MACpG;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EAAA,IAEd,IACR;AAER,CAAC;;"}
+{"version":3,"file":"Option.cjs","sources":["../../../../src/components/Select2/components/Option.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { IconName } from '@/components';\nimport { Icon, LegacyIconButton, Tag } from '@/components';\nimport * as ListboxPrimitive from '@/primitives/Listbox2/Listbox2';\nimport type { Color, FontSize } from '@/types';\nimport { fixedForwardRef } from '@/types';\nimport { isAriaSelectionKey } from '@/utils/aria';\nimport { isMobileDevice } from '@/utils/device';\n\nimport type { Select2OptionValue } from '../types';\nimport { createOptionClassName, FONT_SIZE_CLASSNAME } from '../utilities';\n\nimport { useSelect2Context } from './Context';\nimport type { EditPopoverProps } from './Edit';\nimport { EditPopover } from './Edit';\n\nexport type Select2OptionProps<T extends Select2OptionValue = Select2OptionValue> = Omit<\n    ListboxPrimitive.Listbox2OptionProps<T>,\n    'children' | 'prefix'\n> & {\n    children: string | React.JSX.Element;\n    color?: Color;\n    description?: string;\n    fontSize?: FontSize;\n    prefix?: IconName | React.JSX.Element;\n    postfix?: IconName | React.JSX.Element;\n    textValue?: string;\n};\n\nexport const Option = fixedForwardRef(function Select2Option<T extends Select2OptionValue>(\n    props: Select2OptionProps<T>,\n    ref: React.Ref<HTMLDivElement>\n) {\n    const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;\n    const {\n        fontSize = 'medium',\n        listboxRef,\n        multiple,\n        onDelete,\n        onEdit,\n        ref: selectRef,\n        setOpen,\n        shouldPauseHoverState,\n        tags,\n        value,\n    } = useSelect2Context();\n    const className = cn(createOptionClassName(shouldPauseHoverState), FONT_SIZE_CLASSNAME[fontSize], cName);\n\n    const hasValue = Array.isArray(value) ? !!value.length : value !== undefined;\n    const isTag = tags && !!color;\n\n    const handleClick = () => {\n        if (multiple) {\n            selectRef.current?.focus();\n        } else {\n            setOpen(false);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (isAriaSelectionKey(event) && (!multiple || event.key === 'Tab')) {\n            setOpen(false);\n        }\n    };\n\n    const isEmptyOption = children !== '';\n\n    const popover =\n        isEmptyOption && (onEdit || onDelete)\n            ? (popoverProps: Partial<EditPopoverProps>) => (\n                  <EditPopover\n                      {...popoverProps}\n                      color={props.color}\n                      key={props.textValue ?? String(props.children)}\n                      text={props.textValue ?? String(props.children)}\n                      value={props.value}\n                  />\n              )\n            : undefined;\n\n    return (\n        <ListboxPrimitive.Option {...otherProps} className={className} onClick={handleClick} onKeyDown={handleKeyDown} ref={ref}>\n            {hasValue ? (\n                <Icon name=\"tick\" className=\"pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible\" />\n            ) : (\n                <span className=\"-mx-0.5 inline-flex h-4 w-4 flex-shrink-0\" aria-hidden />\n            )}\n\n            {typeof children === 'string' ? (\n                isTag ? (\n                    <Tag className=\"pointer-events-none my-1\" color={color} icon={prefix}>\n                        {children}\n                    </Tag>\n                ) : (\n                    <>\n                        {prefix ? typeof prefix === 'string' ? <Icon name={prefix} className=\"!h-5 !w-5\" /> : prefix : null}\n                        <span className=\"flex w-full justify-between\">\n                            <span className=\"flex flex-col\">\n                                <span>{children}</span>\n                                {description ? (\n                                    <span className=\"-mt-1.5 mb-1.5 text-xs text-gray-700\" data-taco=\"description\">\n                                        {description}\n                                    </span>\n                                ) : null}\n                            </span>\n                            <span className=\"flex flex-col self-center\">\n                                {postfix ? (\n                                    typeof postfix === 'string' ? (\n                                        <Icon name={postfix} className=\"!h-5 !w-5\" />\n                                    ) : (\n                                        postfix\n                                    )\n                                ) : null}\n                            </span>\n                        </span>\n                    </>\n                )\n            ) : (\n                <span className=\"w-full\">{children}</span>\n            )}\n            {popover ? (\n                <LegacyIconButton\n                    icon=\"ellipsis-vertical\"\n                    appearance=\"discrete\"\n                    className={cn(\n                        'invisible -mr-1 ml-auto !h-5 min-h-[theme(spacing.6)] !w-5 min-w-[theme(spacing.6)] hover:!bg-black-subtle focus:!shadow-none group-hover:visible group-aria-current:visible',\n                        {\n                            '!visible': isMobileDevice(window?.navigator),\n                        }\n                    )}\n                    onClick={event => {\n                        event.stopPropagation();\n                        listboxRef?.current?.setActiveIndexByElement(event.currentTarget.parentElement as HTMLDivElement);\n                    }}\n                    popover={popover}\n                    tabIndex={-1}\n                />\n            ) : null}\n        </ListboxPrimitive.Option>\n    );\n});\n"],"names":["fixedForwardRef","useSelect2Context","createOptionClassName","FONT_SIZE_CLASSNAME","isAriaSelectionKey","EditPopover","ListboxPrimitive.Option","Icon","Tag","LegacyIconButton","isMobileDevice"],"mappings":";;;;;;;;;;;;;;AA+BO,MAAM,SAASA,MAAAA,gBAAgB,SAAS,cAC3C,OACA,KACF;AACE,QAAM,EAAE,UAAU,OAAO,aAAa,QAAQ,SAAS,WAAW,OAAO,GAAG,WAAA,IAAe;AAC3F,QAAM;AAAA,IACF,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACAC,0BAAA;AACJ,QAAM,YAAY,GAAGC,gCAAsB,qBAAqB,GAAGC,8BAAoB,QAAQ,GAAG,KAAK;AAEvG,QAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,CAAC,CAAC,MAAM,SAAS,UAAU;AACnE,QAAM,QAAQ,QAAQ,CAAC,CAAC;AAExB,QAAM,cAAc,MAAM;AACtB,QAAI,UAAU;AACV,gBAAU,SAAS,MAAA;AAAA,IACvB,OAAO;AACH,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AAClD,QAAIC,KAAAA,mBAAmB,KAAK,MAAM,CAAC,YAAY,MAAM,QAAQ,QAAQ;AACjE,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,aAAa;AAEnC,QAAM,UACF,kBAAkB,UAAU,YACtB,CAAC,iBACG,sBAAA;AAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,OAAO,MAAM;AAAA,MACb,KAAK,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC7C,MAAM,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC9C,OAAO,MAAM;AAAA,IAAA;AAAA,EAAA,IAGrB;AAEV,SACI,sBAAA,cAACC,SAAAA,QAAA,EAAyB,GAAG,YAAY,WAAsB,SAAS,aAAa,WAAW,eAAe,OAC1G,WACG,sBAAA,cAACC,KAAAA,QAAK,MAAK,QAAO,WAAU,8EAAA,CAA8E,IAE1G,sBAAA,cAAC,QAAA,EAAK,WAAU,6CAA4C,eAAW,KAAA,CAAC,GAG3E,OAAO,aAAa,WACjB,QACI,sBAAA,cAACC,IAAAA,KAAA,EAAI,WAAU,4BAA2B,OAAc,MAAM,UACzD,QACL,IAEA,sBAAA,cAAA,MAAA,UAAA,MACK,SAAS,OAAO,WAAW,WAAW,sBAAA,cAACD,KAAAA,MAAA,EAAK,MAAM,QAAQ,WAAU,YAAA,CAAY,IAAK,SAAS,0CAC9F,QAAA,EAAK,WAAU,iCACZ,sBAAA,cAAC,QAAA,EAAK,WAAU,gBAAA,GACZ,sBAAA,cAAC,QAAA,MAAM,QAAS,GACf,cACG,sBAAA,cAAC,QAAA,EAAK,WAAU,wCAAuC,aAAU,cAAA,GAC5D,WACL,IACA,IACR,GACA,sBAAA,cAAC,UAAK,WAAU,4BAAA,GACX,UACG,OAAO,YAAY,WACf,sBAAA,cAACA,KAAAA,MAAA,EAAK,MAAM,SAAS,WAAU,YAAA,CAAY,IAE3C,UAEJ,IACR,CACJ,CACJ,IAGJ,sBAAA,cAAC,UAAK,WAAU,SAAA,GAAU,QAAS,GAEtC,UACG,sBAAA;AAAA,IAACE,WAAAA;AAAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,YAAW;AAAA,MACX,WAAW;AAAA,QACP;AAAA,QACA;AAAA,UACI,YAAYC,OAAAA,eAAe,QAAQ,SAAS;AAAA,QAAA;AAAA,MAChD;AAAA,MAEJ,SAAS,CAAA,UAAS;AACd,cAAM,gBAAA;AACN,oBAAY,SAAS,wBAAwB,MAAM,cAAc,aAA+B;AAAA,MACpG;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EAAA,IAEd,IACR;AAER,CAAC;;"}

package/dist/components/Select2/components/Option.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
+import { IconName } from '../..';
 import { Color, FontSize } from '../../../types';
-import { IconName } from '../../Icon/Icon';
 import { Select2OptionValue } from '../types';
 import * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';
 export type Select2OptionProps<T extends Select2OptionValue = Select2OptionValue> = Omit<ListboxPrimitive.Listbox2OptionProps<T>, 'children' | 'prefix'> & {

package/dist/components/Select2/components/Option.js

@@ -1,15 +1,15 @@
 import cn from "clsx";
 import React__default from "react";
+import { Option as Option$1 } from "../../../primitives/Listbox2/components/Option.js";
 import { fixedForwardRef } from "../../../types.js";
 import { isAriaSelectionKey } from "../../../utils/aria.js";
 import { isMobileDevice } from "../../../utils/device.js";
-import { Icon } from "../../Icon/Icon.js";
-import { LegacyIconButton } from "../../LegacyComponents/IconButton/IconButton.js";
-import { Tag } from "../../Tag/Tag.js";
 import { createOptionClassName, FONT_SIZE_CLASSNAME } from "../utilities.js";
 import { useSelect2Context } from "./Context.js";
 import { EditPopover } from "./Edit.js";
-import { Option as Option$1 } from "../../../primitives/Listbox2/components/Option.js";
+import { Icon } from "../../Icon/Icon.js";
+import { Tag } from "../../Tag/Tag.js";
+import { LegacyIconButton } from "../../LegacyComponents/IconButton/IconButton.js";
 const Option = fixedForwardRef(function Select2Option(props, ref) {
   const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;
   const {

package/dist/components/Select2/components/Option.js.map

@@ -1 +1 @@
-{"version":3,"file":"Option.js","sources":["../../../../src/components/Select2/components/Option.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\nimport type { Color, FontSize } from '../../../types';\nimport { fixedForwardRef } from '../../../types';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { isMobileDevice } from '../../../utils/device';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon } from '../../Icon/Icon';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport { Tag } from '../../Tag/Tag';\nimport type { Select2OptionValue } from '../types';\nimport { createOptionClassName, FONT_SIZE_CLASSNAME } from '../utilities';\n\nimport { useSelect2Context } from './Context';\nimport type { EditPopoverProps } from './Edit';\nimport { EditPopover } from './Edit';\n\nexport type Select2OptionProps<T extends Select2OptionValue = Select2OptionValue> = Omit<\n    ListboxPrimitive.Listbox2OptionProps<T>,\n    'children' | 'prefix'\n> & {\n    children: string | React.JSX.Element;\n    color?: Color;\n    description?: string;\n    fontSize?: FontSize;\n    prefix?: IconName | React.JSX.Element;\n    postfix?: IconName | React.JSX.Element;\n    textValue?: string;\n};\n\nexport const Option = fixedForwardRef(function Select2Option<T extends Select2OptionValue>(\n    props: Select2OptionProps<T>,\n    ref: React.Ref<HTMLDivElement>\n) {\n    const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;\n    const {\n        fontSize = 'medium',\n        listboxRef,\n        multiple,\n        onDelete,\n        onEdit,\n        ref: selectRef,\n        setOpen,\n        shouldPauseHoverState,\n        tags,\n        value,\n    } = useSelect2Context();\n    const className = cn(createOptionClassName(shouldPauseHoverState), FONT_SIZE_CLASSNAME[fontSize], cName);\n\n    const hasValue = Array.isArray(value) ? !!value.length : value !== undefined;\n    const isTag = tags && !!color;\n\n    const handleClick = () => {\n        if (multiple) {\n            selectRef.current?.focus();\n        } else {\n            setOpen(false);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (isAriaSelectionKey(event) && (!multiple || event.key === 'Tab')) {\n            setOpen(false);\n        }\n    };\n\n    const isEmptyOption = children !== '';\n\n    const popover =\n        isEmptyOption && (onEdit || onDelete)\n            ? (popoverProps: Partial<EditPopoverProps>) => (\n                  <EditPopover\n                      {...popoverProps}\n                      color={props.color}\n                      key={props.textValue ?? String(props.children)}\n                      text={props.textValue ?? String(props.children)}\n                      value={props.value}\n                  />\n              )\n            : undefined;\n\n    return (\n        <ListboxPrimitive.Option {...otherProps} className={className} onClick={handleClick} onKeyDown={handleKeyDown} ref={ref}>\n            {hasValue ? (\n                <Icon name=\"tick\" className=\"pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible\" />\n            ) : (\n                <span className=\"-mx-0.5 inline-flex h-4 w-4 flex-shrink-0\" aria-hidden />\n            )}\n\n            {typeof children === 'string' ? (\n                isTag ? (\n                    <Tag className=\"pointer-events-none my-1\" color={color} icon={prefix}>\n                        {children}\n                    </Tag>\n                ) : (\n                    <>\n                        {prefix ? typeof prefix === 'string' ? <Icon name={prefix} className=\"!h-5 !w-5\" /> : prefix : null}\n                        <span className=\"flex w-full justify-between\">\n                            <span className=\"flex flex-col\">\n                                <span>{children}</span>\n                                {description ? (\n                                    <span className=\"-mt-1.5 mb-1.5 text-xs text-gray-700\" data-taco=\"description\">\n                                        {description}\n                                    </span>\n                                ) : null}\n                            </span>\n                            <span className=\"flex flex-col self-center\">\n                                {postfix ? (\n                                    typeof postfix === 'string' ? (\n                                        <Icon name={postfix} className=\"!h-5 !w-5\" />\n                                    ) : (\n                                        postfix\n                                    )\n                                ) : null}\n                            </span>\n                        </span>\n                    </>\n                )\n            ) : (\n                <span className=\"w-full\">{children}</span>\n            )}\n            {popover ? (\n                <LegacyIconButton\n                    icon=\"ellipsis-vertical\"\n                    appearance=\"discrete\"\n                    className={cn(\n                        'invisible -mr-1 ml-auto !h-5 min-h-[theme(spacing.6)] !w-5 min-w-[theme(spacing.6)] hover:!bg-black-subtle focus:!shadow-none group-hover:visible group-aria-current:visible',\n                        {\n                            '!visible': isMobileDevice(window?.navigator),\n                        }\n                    )}\n                    onClick={event => {\n                        event.stopPropagation();\n                        listboxRef?.current?.setActiveIndexByElement(event.currentTarget.parentElement as HTMLDivElement);\n                    }}\n                    popover={popover}\n                    tabIndex={-1}\n                />\n            ) : null}\n        </ListboxPrimitive.Option>\n    );\n});\n"],"names":["React","ListboxPrimitive.Option"],"mappings":";;;;;;;;;;;;AAgCO,MAAM,SAAS,gBAAgB,SAAS,cAC3C,OACA,KACF;AACE,QAAM,EAAE,UAAU,OAAO,aAAa,QAAQ,SAAS,WAAW,OAAO,GAAG,WAAA,IAAe;AAC3F,QAAM;AAAA,IACF,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACA,kBAAA;AACJ,QAAM,YAAY,GAAG,sBAAsB,qBAAqB,GAAG,oBAAoB,QAAQ,GAAG,KAAK;AAEvG,QAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,CAAC,CAAC,MAAM,SAAS,UAAU;AACnE,QAAM,QAAQ,QAAQ,CAAC,CAAC;AAExB,QAAM,cAAc,MAAM;AACtB,QAAI,UAAU;AACV,gBAAU,SAAS,MAAA;AAAA,IACvB,OAAO;AACH,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AAClD,QAAI,mBAAmB,KAAK,MAAM,CAAC,YAAY,MAAM,QAAQ,QAAQ;AACjE,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,aAAa;AAEnC,QAAM,UACF,kBAAkB,UAAU,YACtB,CAAC,iBACGA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,OAAO,MAAM;AAAA,MACb,KAAK,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC7C,MAAM,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC9C,OAAO,MAAM;AAAA,IAAA;AAAA,EAAA,IAGrB;AAEV,SACIA,+BAAA,cAACC,UAAA,EAAyB,GAAG,YAAY,WAAsB,SAAS,aAAa,WAAW,eAAe,OAC1G,WACGD,+BAAA,cAAC,QAAK,MAAK,QAAO,WAAU,8EAAA,CAA8E,IAE1GA,+BAAA,cAAC,QAAA,EAAK,WAAU,6CAA4C,eAAW,KAAA,CAAC,GAG3E,OAAO,aAAa,WACjB,QACIA,+BAAA,cAAC,KAAA,EAAI,WAAU,4BAA2B,OAAc,MAAM,UACzD,QACL,IAEAA,+BAAA,cAAAA,eAAA,UAAA,MACK,SAAS,OAAO,WAAW,WAAWA,+BAAA,cAAC,MAAA,EAAK,MAAM,QAAQ,WAAU,YAAA,CAAY,IAAK,SAAS,mDAC9F,QAAA,EAAK,WAAU,iCACZA,+BAAA,cAAC,QAAA,EAAK,WAAU,gBAAA,GACZA,+BAAA,cAAC,QAAA,MAAM,QAAS,GACf,cACGA,+BAAA,cAAC,QAAA,EAAK,WAAU,wCAAuC,aAAU,cAAA,GAC5D,WACL,IACA,IACR,GACAA,+BAAA,cAAC,UAAK,WAAU,4BAAA,GACX,UACG,OAAO,YAAY,WACfA,+BAAA,cAAC,MAAA,EAAK,MAAM,SAAS,WAAU,YAAA,CAAY,IAE3C,UAEJ,IACR,CACJ,CACJ,IAGJA,+BAAA,cAAC,UAAK,WAAU,SAAA,GAAU,QAAS,GAEtC,UACGA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,YAAW;AAAA,MACX,WAAW;AAAA,QACP;AAAA,QACA;AAAA,UACI,YAAY,eAAe,QAAQ,SAAS;AAAA,QAAA;AAAA,MAChD;AAAA,MAEJ,SAAS,CAAA,UAAS;AACd,cAAM,gBAAA;AACN,oBAAY,SAAS,wBAAwB,MAAM,cAAc,aAA+B;AAAA,MACpG;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EAAA,IAEd,IACR;AAER,CAAC;"}
+{"version":3,"file":"Option.js","sources":["../../../../src/components/Select2/components/Option.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { IconName } from '@/components';\nimport { Icon, LegacyIconButton, Tag } from '@/components';\nimport * as ListboxPrimitive from '@/primitives/Listbox2/Listbox2';\nimport type { Color, FontSize } from '@/types';\nimport { fixedForwardRef } from '@/types';\nimport { isAriaSelectionKey } from '@/utils/aria';\nimport { isMobileDevice } from '@/utils/device';\n\nimport type { Select2OptionValue } from '../types';\nimport { createOptionClassName, FONT_SIZE_CLASSNAME } from '../utilities';\n\nimport { useSelect2Context } from './Context';\nimport type { EditPopoverProps } from './Edit';\nimport { EditPopover } from './Edit';\n\nexport type Select2OptionProps<T extends Select2OptionValue = Select2OptionValue> = Omit<\n    ListboxPrimitive.Listbox2OptionProps<T>,\n    'children' | 'prefix'\n> & {\n    children: string | React.JSX.Element;\n    color?: Color;\n    description?: string;\n    fontSize?: FontSize;\n    prefix?: IconName | React.JSX.Element;\n    postfix?: IconName | React.JSX.Element;\n    textValue?: string;\n};\n\nexport const Option = fixedForwardRef(function Select2Option<T extends Select2OptionValue>(\n    props: Select2OptionProps<T>,\n    ref: React.Ref<HTMLDivElement>\n) {\n    const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;\n    const {\n        fontSize = 'medium',\n        listboxRef,\n        multiple,\n        onDelete,\n        onEdit,\n        ref: selectRef,\n        setOpen,\n        shouldPauseHoverState,\n        tags,\n        value,\n    } = useSelect2Context();\n    const className = cn(createOptionClassName(shouldPauseHoverState), FONT_SIZE_CLASSNAME[fontSize], cName);\n\n    const hasValue = Array.isArray(value) ? !!value.length : value !== undefined;\n    const isTag = tags && !!color;\n\n    const handleClick = () => {\n        if (multiple) {\n            selectRef.current?.focus();\n        } else {\n            setOpen(false);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (isAriaSelectionKey(event) && (!multiple || event.key === 'Tab')) {\n            setOpen(false);\n        }\n    };\n\n    const isEmptyOption = children !== '';\n\n    const popover =\n        isEmptyOption && (onEdit || onDelete)\n            ? (popoverProps: Partial<EditPopoverProps>) => (\n                  <EditPopover\n                      {...popoverProps}\n                      color={props.color}\n                      key={props.textValue ?? String(props.children)}\n                      text={props.textValue ?? String(props.children)}\n                      value={props.value}\n                  />\n              )\n            : undefined;\n\n    return (\n        <ListboxPrimitive.Option {...otherProps} className={className} onClick={handleClick} onKeyDown={handleKeyDown} ref={ref}>\n            {hasValue ? (\n                <Icon name=\"tick\" className=\"pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible\" />\n            ) : (\n                <span className=\"-mx-0.5 inline-flex h-4 w-4 flex-shrink-0\" aria-hidden />\n            )}\n\n            {typeof children === 'string' ? (\n                isTag ? (\n                    <Tag className=\"pointer-events-none my-1\" color={color} icon={prefix}>\n                        {children}\n                    </Tag>\n                ) : (\n                    <>\n                        {prefix ? typeof prefix === 'string' ? <Icon name={prefix} className=\"!h-5 !w-5\" /> : prefix : null}\n                        <span className=\"flex w-full justify-between\">\n                            <span className=\"flex flex-col\">\n                                <span>{children}</span>\n                                {description ? (\n                                    <span className=\"-mt-1.5 mb-1.5 text-xs text-gray-700\" data-taco=\"description\">\n                                        {description}\n                                    </span>\n                                ) : null}\n                            </span>\n                            <span className=\"flex flex-col self-center\">\n                                {postfix ? (\n                                    typeof postfix === 'string' ? (\n                                        <Icon name={postfix} className=\"!h-5 !w-5\" />\n                                    ) : (\n                                        postfix\n                                    )\n                                ) : null}\n                            </span>\n                        </span>\n                    </>\n                )\n            ) : (\n                <span className=\"w-full\">{children}</span>\n            )}\n            {popover ? (\n                <LegacyIconButton\n                    icon=\"ellipsis-vertical\"\n                    appearance=\"discrete\"\n                    className={cn(\n                        'invisible -mr-1 ml-auto !h-5 min-h-[theme(spacing.6)] !w-5 min-w-[theme(spacing.6)] hover:!bg-black-subtle focus:!shadow-none group-hover:visible group-aria-current:visible',\n                        {\n                            '!visible': isMobileDevice(window?.navigator),\n                        }\n                    )}\n                    onClick={event => {\n                        event.stopPropagation();\n                        listboxRef?.current?.setActiveIndexByElement(event.currentTarget.parentElement as HTMLDivElement);\n                    }}\n                    popover={popover}\n                    tabIndex={-1}\n                />\n            ) : null}\n        </ListboxPrimitive.Option>\n    );\n});\n"],"names":["React","ListboxPrimitive.Option"],"mappings":";;;;;;;;;;;;AA+BO,MAAM,SAAS,gBAAgB,SAAS,cAC3C,OACA,KACF;AACE,QAAM,EAAE,UAAU,OAAO,aAAa,QAAQ,SAAS,WAAW,OAAO,GAAG,WAAA,IAAe;AAC3F,QAAM;AAAA,IACF,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACA,kBAAA;AACJ,QAAM,YAAY,GAAG,sBAAsB,qBAAqB,GAAG,oBAAoB,QAAQ,GAAG,KAAK;AAEvG,QAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,CAAC,CAAC,MAAM,SAAS,UAAU;AACnE,QAAM,QAAQ,QAAQ,CAAC,CAAC;AAExB,QAAM,cAAc,MAAM;AACtB,QAAI,UAAU;AACV,gBAAU,SAAS,MAAA;AAAA,IACvB,OAAO;AACH,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AAClD,QAAI,mBAAmB,KAAK,MAAM,CAAC,YAAY,MAAM,QAAQ,QAAQ;AACjE,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,QAAM,gBAAgB,aAAa;AAEnC,QAAM,UACF,kBAAkB,UAAU,YACtB,CAAC,iBACGA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,OAAO,MAAM;AAAA,MACb,KAAK,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC7C,MAAM,MAAM,aAAa,OAAO,MAAM,QAAQ;AAAA,MAC9C,OAAO,MAAM;AAAA,IAAA;AAAA,EAAA,IAGrB;AAEV,SACIA,+BAAA,cAACC,UAAA,EAAyB,GAAG,YAAY,WAAsB,SAAS,aAAa,WAAW,eAAe,OAC1G,WACGD,+BAAA,cAAC,QAAK,MAAK,QAAO,WAAU,8EAAA,CAA8E,IAE1GA,+BAAA,cAAC,QAAA,EAAK,WAAU,6CAA4C,eAAW,KAAA,CAAC,GAG3E,OAAO,aAAa,WACjB,QACIA,+BAAA,cAAC,KAAA,EAAI,WAAU,4BAA2B,OAAc,MAAM,UACzD,QACL,IAEAA,+BAAA,cAAAA,eAAA,UAAA,MACK,SAAS,OAAO,WAAW,WAAWA,+BAAA,cAAC,MAAA,EAAK,MAAM,QAAQ,WAAU,YAAA,CAAY,IAAK,SAAS,mDAC9F,QAAA,EAAK,WAAU,iCACZA,+BAAA,cAAC,QAAA,EAAK,WAAU,gBAAA,GACZA,+BAAA,cAAC,QAAA,MAAM,QAAS,GACf,cACGA,+BAAA,cAAC,QAAA,EAAK,WAAU,wCAAuC,aAAU,cAAA,GAC5D,WACL,IACA,IACR,GACAA,+BAAA,cAAC,UAAK,WAAU,4BAAA,GACX,UACG,OAAO,YAAY,WACfA,+BAAA,cAAC,MAAA,EAAK,MAAM,SAAS,WAAU,YAAA,CAAY,IAE3C,UAEJ,IACR,CACJ,CACJ,IAGJA,+BAAA,cAAC,UAAK,WAAU,SAAA,GAAU,QAAS,GAEtC,UACGA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,YAAW;AAAA,MACX,WAAW;AAAA,QACP;AAAA,QACA;AAAA,UACI,YAAY,eAAe,QAAQ,SAAS;AAAA,QAAA;AAAA,MAChD;AAAA,MAEJ,SAAS,CAAA,UAAS;AACd,cAAM,gBAAA;AACN,oBAAY,SAAS,wBAAwB,MAAM,cAAc,aAA+B;AAAA,MACpG;AAAA,MACA;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EAAA,IAEd,IACR;AAER,CAAC;"}

package/dist/components/Select2/components/Search.cjs

@@ -4,9 +4,9 @@ const cn = require("clsx");
 const React = require("react");
 const aria = require("../../../utils/aria.cjs");
 const input = require("../../../utils/input.cjs");
+const Context = require("./Context.cjs");
 const Field = require("../../Field/Field.cjs");
 const Input = require("../../Input/Input.cjs");
-const Context = require("./Context.cjs");
 const Search = React.forwardRef(function ListboxSearch(props, ref) {
   const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError } = Context.useSelect2Context();
   const handleChange = (event) => {

package/dist/components/Select2/components/Search.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Search.cjs","sources":["../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\nimport { Field } from '../../Field/Field';\nimport type { InputProps } from '../../Input/Input';\nimport { Input } from '../../Input/Input';\n\nimport { useSelect2Context } from './Context';\n\nexport const Search = React.forwardRef<HTMLInputElement, InputProps>(function ListboxSearch(props, ref) {\n    const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError } = useSelect2Context();\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (validationError) {\n            setValidationError(undefined);\n        }\n\n        setSearchQuery(event.target.value);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        // space is an aria selection key, so we have to remove it to allow spaces\n        if (event.key === ' ') {\n            return;\n        }\n\n        // don't bubble if there is a search value, it would prevent cursor navigation inside the input\n        if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight') && event.currentTarget.value.length) {\n            event.stopPropagation();\n        }\n\n        if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n            event.preventDefault();\n            // forward navigation events onto the underlying collection - we want arrow keys to work from inside the filter input\n            listboxRef?.current?.dispatchEvent(createCustomKeyboardEvent(event));\n            return;\n        }\n    };\n\n    return (\n        <Field\n            // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n            className={cn('mx-1.5 mb-1.5 !min-h-fit', { '!pb-0': !validationError })}\n            invalid={!!validationError}\n            message={validationError?.message}>\n            <Input\n                {...props}\n                invalid={!!validationError}\n                onChange={handleChange}\n                onKeyDown={handleKeyDown}\n                ref={ref}\n                value={searchQuery}\n            />\n        </Field>\n    );\n});\n"],"names":["useSelect2Context","isAriaSelectionKey","createCustomKeyboardEvent","Field","Input"],"mappings":";;;;;;;;;AAWO,MAAM,SAAS,MAAM,WAAyC,SAAS,cAAc,OAAO,KAAK;AACpG,QAAM,EAAE,YAAY,aAAa,gBAAgB,oBAAoB,gBAAA,IAAoBA,0BAAA;AAEzF,QAAM,eAAe,CAAC,UAA+C;AACjE,QAAI,iBAAiB;AACjB,yBAAmB,MAAS;AAAA,IAChC;AAEA,mBAAe,MAAM,OAAO,KAAK;AAAA,EACrC;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AAEpE,QAAI,MAAM,QAAQ,KAAK;AACnB;AAAA,IACJ;AAGA,SAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,iBAAiB,MAAM,cAAc,MAAM,QAAQ;AAC/F,YAAM,gBAAA;AAAA,IACV;AAEA,QAAIC,KAAAA,mBAAmB,KAAK,KAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;AACnF,YAAM,eAAA;AAEN,kBAAY,SAAS,cAAcC,MAAAA,0BAA0B,KAAK,CAAC;AACnE;AAAA,IACJ;AAAA,EACJ;AAEA,SACI,sBAAA;AAAA,IAACC,MAAAA;AAAAA,IAAA;AAAA,MAEG,WAAW,GAAG,4BAA4B,EAAE,SAAS,CAAC,iBAAiB;AAAA,MACvE,SAAS,CAAC,CAAC;AAAA,MACX,SAAS,iBAAiB;AAAA,IAAA;AAAA,IAC1B,sBAAA;AAAA,MAACC,MAAAA;AAAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,SAAS,CAAC,CAAC;AAAA,QACX,UAAU;AAAA,QACV,WAAW;AAAA,QACX;AAAA,QACA,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACX;AAGZ,CAAC;;"}
+{"version":3,"file":"Search.cjs","sources":["../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { InputProps } from '@/components';\nimport { Field, Input } from '@/components';\nimport { isAriaSelectionKey } from '@/utils/aria';\nimport { createCustomKeyboardEvent } from '@/utils/input';\n\nimport { useSelect2Context } from './Context';\n\nexport const Search = React.forwardRef<HTMLInputElement, InputProps>(function ListboxSearch(props, ref) {\n    const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError } = useSelect2Context();\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (validationError) {\n            setValidationError(undefined);\n        }\n\n        setSearchQuery(event.target.value);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        // space is an aria selection key, so we have to remove it to allow spaces\n        if (event.key === ' ') {\n            return;\n        }\n\n        // don't bubble if there is a search value, it would prevent cursor navigation inside the input\n        if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight') && event.currentTarget.value.length) {\n            event.stopPropagation();\n        }\n\n        if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n            event.preventDefault();\n            // forward navigation events onto the underlying collection - we want arrow keys to work from inside the filter input\n            listboxRef?.current?.dispatchEvent(createCustomKeyboardEvent(event));\n            return;\n        }\n    };\n\n    return (\n        <Field\n            // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n            className={cn('mx-1.5 mb-1.5 !min-h-fit', { '!pb-0': !validationError })}\n            invalid={!!validationError}\n            message={validationError?.message}>\n            <Input\n                {...props}\n                invalid={!!validationError}\n                onChange={handleChange}\n                onKeyDown={handleKeyDown}\n                ref={ref}\n                value={searchQuery}\n            />\n        </Field>\n    );\n});\n"],"names":["useSelect2Context","isAriaSelectionKey","createCustomKeyboardEvent","Field","Input"],"mappings":";;;;;;;;;AAUO,MAAM,SAAS,MAAM,WAAyC,SAAS,cAAc,OAAO,KAAK;AACpG,QAAM,EAAE,YAAY,aAAa,gBAAgB,oBAAoB,gBAAA,IAAoBA,0BAAA;AAEzF,QAAM,eAAe,CAAC,UAA+C;AACjE,QAAI,iBAAiB;AACjB,yBAAmB,MAAS;AAAA,IAChC;AAEA,mBAAe,MAAM,OAAO,KAAK;AAAA,EACrC;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AAEpE,QAAI,MAAM,QAAQ,KAAK;AACnB;AAAA,IACJ;AAGA,SAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,iBAAiB,MAAM,cAAc,MAAM,QAAQ;AAC/F,YAAM,gBAAA;AAAA,IACV;AAEA,QAAIC,KAAAA,mBAAmB,KAAK,KAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;AACnF,YAAM,eAAA;AAEN,kBAAY,SAAS,cAAcC,MAAAA,0BAA0B,KAAK,CAAC;AACnE;AAAA,IACJ;AAAA,EACJ;AAEA,SACI,sBAAA;AAAA,IAACC,MAAAA;AAAAA,IAAA;AAAA,MAEG,WAAW,GAAG,4BAA4B,EAAE,SAAS,CAAC,iBAAiB;AAAA,MACvE,SAAS,CAAC,CAAC;AAAA,MACX,SAAS,iBAAiB;AAAA,IAAA;AAAA,IAC1B,sBAAA;AAAA,MAACC,MAAAA;AAAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,SAAS,CAAC,CAAC;AAAA,QACX,UAAU;AAAA,QACV,WAAW;AAAA,QACX;AAAA,QACA,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACX;AAGZ,CAAC;;"}

package/dist/components/Select2/components/Search.js

@@ -2,9 +2,9 @@ import cn from "clsx";
 import React__default from "react";
 import { isAriaSelectionKey } from "../../../utils/aria.js";
 import { createCustomKeyboardEvent } from "../../../utils/input.js";
+import { useSelect2Context } from "./Context.js";
 import { Field } from "../../Field/Field.js";
 import { Input } from "../../Input/Input.js";
-import { useSelect2Context } from "./Context.js";
 const Search = React__default.forwardRef(function ListboxSearch(props, ref) {
   const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError } = useSelect2Context();
   const handleChange = (event) => {

package/dist/components/Select2/components/Search.js.map

@@ -1 +1 @@
-{"version":3,"file":"Search.js","sources":["../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\nimport { Field } from '../../Field/Field';\nimport type { InputProps } from '../../Input/Input';\nimport { Input } from '../../Input/Input';\n\nimport { useSelect2Context } from './Context';\n\nexport const Search = React.forwardRef<HTMLInputElement, InputProps>(function ListboxSearch(props, ref) {\n    const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError } = useSelect2Context();\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (validationError) {\n            setValidationError(undefined);\n        }\n\n        setSearchQuery(event.target.value);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        // space is an aria selection key, so we have to remove it to allow spaces\n        if (event.key === ' ') {\n            return;\n        }\n\n        // don't bubble if there is a search value, it would prevent cursor navigation inside the input\n        if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight') && event.currentTarget.value.length) {\n            event.stopPropagation();\n        }\n\n        if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n            event.preventDefault();\n            // forward navigation events onto the underlying collection - we want arrow keys to work from inside the filter input\n            listboxRef?.current?.dispatchEvent(createCustomKeyboardEvent(event));\n            return;\n        }\n    };\n\n    return (\n        <Field\n            // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n            className={cn('mx-1.5 mb-1.5 !min-h-fit', { '!pb-0': !validationError })}\n            invalid={!!validationError}\n            message={validationError?.message}>\n            <Input\n                {...props}\n                invalid={!!validationError}\n                onChange={handleChange}\n                onKeyDown={handleKeyDown}\n                ref={ref}\n                value={searchQuery}\n            />\n        </Field>\n    );\n});\n"],"names":["React"],"mappings":";;;;;;;AAWO,MAAM,SAASA,eAAM,WAAyC,SAAS,cAAc,OAAO,KAAK;AACpG,QAAM,EAAE,YAAY,aAAa,gBAAgB,oBAAoB,gBAAA,IAAoB,kBAAA;AAEzF,QAAM,eAAe,CAAC,UAA+C;AACjE,QAAI,iBAAiB;AACjB,yBAAmB,MAAS;AAAA,IAChC;AAEA,mBAAe,MAAM,OAAO,KAAK;AAAA,EACrC;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AAEpE,QAAI,MAAM,QAAQ,KAAK;AACnB;AAAA,IACJ;AAGA,SAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,iBAAiB,MAAM,cAAc,MAAM,QAAQ;AAC/F,YAAM,gBAAA;AAAA,IACV;AAEA,QAAI,mBAAmB,KAAK,KAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;AACnF,YAAM,eAAA;AAEN,kBAAY,SAAS,cAAc,0BAA0B,KAAK,CAAC;AACnE;AAAA,IACJ;AAAA,EACJ;AAEA,SACIA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,WAAW,GAAG,4BAA4B,EAAE,SAAS,CAAC,iBAAiB;AAAA,MACvE,SAAS,CAAC,CAAC;AAAA,MACX,SAAS,iBAAiB;AAAA,IAAA;AAAA,IAC1BA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,SAAS,CAAC,CAAC;AAAA,QACX,UAAU;AAAA,QACV,WAAW;AAAA,QACX;AAAA,QACA,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACX;AAGZ,CAAC;"}
+{"version":3,"file":"Search.js","sources":["../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { InputProps } from '@/components';\nimport { Field, Input } from '@/components';\nimport { isAriaSelectionKey } from '@/utils/aria';\nimport { createCustomKeyboardEvent } from '@/utils/input';\n\nimport { useSelect2Context } from './Context';\n\nexport const Search = React.forwardRef<HTMLInputElement, InputProps>(function ListboxSearch(props, ref) {\n    const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError } = useSelect2Context();\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (validationError) {\n            setValidationError(undefined);\n        }\n\n        setSearchQuery(event.target.value);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        // space is an aria selection key, so we have to remove it to allow spaces\n        if (event.key === ' ') {\n            return;\n        }\n\n        // don't bubble if there is a search value, it would prevent cursor navigation inside the input\n        if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight') && event.currentTarget.value.length) {\n            event.stopPropagation();\n        }\n\n        if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n            event.preventDefault();\n            // forward navigation events onto the underlying collection - we want arrow keys to work from inside the filter input\n            listboxRef?.current?.dispatchEvent(createCustomKeyboardEvent(event));\n            return;\n        }\n    };\n\n    return (\n        <Field\n            // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n            className={cn('mx-1.5 mb-1.5 !min-h-fit', { '!pb-0': !validationError })}\n            invalid={!!validationError}\n            message={validationError?.message}>\n            <Input\n                {...props}\n                invalid={!!validationError}\n                onChange={handleChange}\n                onKeyDown={handleKeyDown}\n                ref={ref}\n                value={searchQuery}\n            />\n        </Field>\n    );\n});\n"],"names":["React"],"mappings":";;;;;;;AAUO,MAAM,SAASA,eAAM,WAAyC,SAAS,cAAc,OAAO,KAAK;AACpG,QAAM,EAAE,YAAY,aAAa,gBAAgB,oBAAoB,gBAAA,IAAoB,kBAAA;AAEzF,QAAM,eAAe,CAAC,UAA+C;AACjE,QAAI,iBAAiB;AACjB,yBAAmB,MAAS;AAAA,IAChC;AAEA,mBAAe,MAAM,OAAO,KAAK;AAAA,EACrC;AAEA,QAAM,gBAAgB,CAAC,UAAiD;AAEpE,QAAI,MAAM,QAAQ,KAAK;AACnB;AAAA,IACJ;AAGA,SAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,iBAAiB,MAAM,cAAc,MAAM,QAAQ;AAC/F,YAAM,gBAAA;AAAA,IACV;AAEA,QAAI,mBAAmB,KAAK,KAAK,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;AACnF,YAAM,eAAA;AAEN,kBAAY,SAAS,cAAc,0BAA0B,KAAK,CAAC;AACnE;AAAA,IACJ;AAAA,EACJ;AAEA,SACIA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,WAAW,GAAG,4BAA4B,EAAE,SAAS,CAAC,iBAAiB;AAAA,MACvE,SAAS,CAAC,CAAC;AAAA,MACX,SAAS,iBAAiB;AAAA,IAAA;AAAA,IAC1BA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,SAAS,CAAC,CAAC;AAAA,QACX,UAAU;AAAA,QACV,WAAW;AAAA,QACX;AAAA,QACA,OAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACX;AAGZ,CAAC;"}

package/dist/components/Select2/components/Title.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Title.cjs","sources":["../../../../src/components/Select2/components/Title.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\n\nexport type Select2TitleProps = ListboxPrimitive.Listbox2TitleProps;\n\nexport const Title = React.forwardRef<HTMLDivElement, Select2TitleProps>(function Select2Title(props, ref) {\n    const className = cn('flex h-8 items-center pl-2 text-xs', props.className);\n    return <ListboxPrimitive.Title {...props} className={className} ref={ref} />;\n});\n"],"names":["ListboxPrimitive.Title"],"mappings":";;;;;AAOO,MAAM,QAAQ,MAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,YAAY,GAAG,sCAAsC,MAAM,SAAS;AAC1E,6CAAQA,QAAAA,OAAA,EAAwB,GAAG,OAAO,WAAsB,KAAU;AAC9E,CAAC;;"}
+{"version":3,"file":"Title.cjs","sources":["../../../../src/components/Select2/components/Title.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '@/primitives/Listbox2/Listbox2';\n\nexport type Select2TitleProps = ListboxPrimitive.Listbox2TitleProps;\n\nexport const Title = React.forwardRef<HTMLDivElement, Select2TitleProps>(function Select2Title(props, ref) {\n    const className = cn('flex h-8 items-center pl-2 text-xs', props.className);\n    return <ListboxPrimitive.Title {...props} className={className} ref={ref} />;\n});\n"],"names":["ListboxPrimitive.Title"],"mappings":";;;;;AAOO,MAAM,QAAQ,MAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,YAAY,GAAG,sCAAsC,MAAM,SAAS;AAC1E,6CAAQA,QAAAA,OAAA,EAAwB,GAAG,OAAO,WAAsB,KAAU;AAC9E,CAAC;;"}

package/dist/components/Select2/components/Title.js.map

@@ -1 +1 @@
-{"version":3,"file":"Title.js","sources":["../../../../src/components/Select2/components/Title.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\n\nexport type Select2TitleProps = ListboxPrimitive.Listbox2TitleProps;\n\nexport const Title = React.forwardRef<HTMLDivElement, Select2TitleProps>(function Select2Title(props, ref) {\n    const className = cn('flex h-8 items-center pl-2 text-xs', props.className);\n    return <ListboxPrimitive.Title {...props} className={className} ref={ref} />;\n});\n"],"names":["React","ListboxPrimitive.Title"],"mappings":";;;AAOO,MAAM,QAAQA,eAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,YAAY,GAAG,sCAAsC,MAAM,SAAS;AAC1E,sDAAQC,SAAA,EAAwB,GAAG,OAAO,WAAsB,KAAU;AAC9E,CAAC;"}
+{"version":3,"file":"Title.js","sources":["../../../../src/components/Select2/components/Title.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport * as ListboxPrimitive from '@/primitives/Listbox2/Listbox2';\n\nexport type Select2TitleProps = ListboxPrimitive.Listbox2TitleProps;\n\nexport const Title = React.forwardRef<HTMLDivElement, Select2TitleProps>(function Select2Title(props, ref) {\n    const className = cn('flex h-8 items-center pl-2 text-xs', props.className);\n    return <ListboxPrimitive.Title {...props} className={className} ref={ref} />;\n});\n"],"names":["React","ListboxPrimitive.Title"],"mappings":";;;AAOO,MAAM,QAAQA,eAAM,WAA8C,SAAS,aAAa,OAAO,KAAK;AACvG,QAAM,YAAY,GAAG,sCAAsC,MAAM,SAAS;AAC1E,sDAAQC,SAAA,EAAwB,GAAG,OAAO,WAAsB,KAAU;AAC9E,CAAC;"}

package/dist/components/Select2/components/Trigger.cjs

@@ -2,16 +2,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const cn = require("clsx");
 const React = require("react");
-const useMergedRef = require("../../../hooks/useMergedRef.cjs");
-const dom = require("../../../utils/dom.cjs");
-const Badge = require("../../Badge/Badge.cjs");
-const Icon = require("../../Icon/Icon.cjs");
 const util = require("../../Input/util.cjs");
 const ScrollArea = require("../../ScrollArea/ScrollArea.cjs");
-const Tag = require("../../Tag/Tag.cjs");
-const Tooltip = require("../../Tooltip/Tooltip.cjs");
+const useMergedRef = require("../../../hooks/useMergedRef.cjs");
+const dom = require("../../../utils/dom.cjs");
 const utilities = require("../utilities.cjs");
 const Context = require("./Context.cjs");
+const Tag = require("../../Tag/Tag.cjs");
+const Icon = require("../../Icon/Icon.cjs");
+const Tooltip = require("../../Tooltip/Tooltip.cjs");
+const Badge = require("../../Badge/Badge.cjs");
 const Placeholder = ({ disabled, readOnly, ...props }) => {
   if (readOnly) {
     return null;

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

@@ -1 +1 @@
-{"version":3,"file":"Trigger.cjs","sources":["../../../../src/components/Select2/components/Trigger.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { getIndexOfFirstChildOverflowingParent, isElementInsideOrTriggeredFromContainer } from '../../../utils/dom';\nimport type { BadgeProps } from '../../Badge/Badge';\nimport { Badge } from '../../Badge/Badge';\nimport { Icon } from '../../Icon/Icon';\nimport { getInputClasses } from '../../Input/util';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { Tag } from '../../Tag/Tag';\nimport { Tooltip } from '../../Tooltip/Tooltip';\nimport type { Select2OptionValue } from '../types';\nimport { FONT_SIZE_CLASSNAME } from '../utilities';\n\nimport { useSelect2Context } from './Context';\nimport type { Select2OptionProps } from './Option';\n\ntype Select2TriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    emptyValue?: Select2OptionValue;\n    placeholder?: string;\n    children: React.ReactElement<Select2OptionProps>[];\n};\n\ntype PlaceholderProps = React.PropsWithChildren<{\n    disabled: boolean;\n    readOnly: boolean;\n}>;\n\nconst Placeholder = ({ disabled, readOnly, ...props }: PlaceholderProps) => {\n    if (readOnly) {\n        return null;\n    }\n    return (\n        <div\n            {...props}\n            className={cn({ 'text-gray-500': disabled, 'text-gray-700': !disabled })}\n            data-taco=\"select2-placeholder\"\n        />\n    );\n};\n\nexport const Trigger = React.forwardRef<HTMLButtonElement, Select2TriggerProps>(function Select2Trigger(props, ref) {\n    const { multiple, value } = useSelect2Context();\n\n    if (Array.isArray(value) || multiple) {\n        const values = Array.isArray(value) ? value : value === undefined ? undefined : [value];\n        return <Multiple {...props} ref={ref} values={values} />;\n    }\n\n    return <Single {...props} ref={ref} value={value} />;\n});\n\ntype ButtonProps = React.HTMLAttributes<HTMLButtonElement> &\n    Omit<Select2TriggerProps, 'children' | 'open' | 'setValue' | 'value'>;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Select2TriggerButton(props, ref) {\n    const { children, onBlur, onClick, onFocus, tabIndex = 0, ...otherProps } = props;\n    const { disabled, fontSize = 'medium', highlighted, invalid, open, readOnly } = useSelect2Context();\n\n    const className = cn(\n        'h-fit px-1.5',\n        getInputClasses({ ...props, disabled, highlighted, invalid, readOnly })\n            .replace('w-full', '')\n            .replace('px-2', ''),\n        FONT_SIZE_CLASSNAME[fontSize],\n        {\n            'select-text': readOnly,\n            'w-full': !props.className?.includes('w-'),\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        if (disabled || readOnly) {\n            event.preventDefault();\n            return;\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    let handleBlur;\n\n    if (typeof onBlur === 'function') {\n        // we might be focusing on an input or something inside the dropdown that was triggered by the select\n        // so see if the element gaining focus is inside a portal and look up its controller\n        // if we don't do this, things like validate on blur occur while simply opening the select\n        handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n            if (isElementInsideOrTriggeredFromContainer(event.relatedTarget, event.currentTarget)) {\n                return;\n            }\n\n            onBlur(event);\n        };\n    }\n\n    // select the value text if the select is readonly\n    const handleFocus = (event: React.FocusEvent<HTMLButtonElement>) => {\n        if (readOnly) {\n            const value = event.currentTarget.querySelector(':first-child');\n\n            if (value) {\n                window.getSelection()?.selectAllChildren?.(value);\n            }\n        }\n\n        if (typeof onFocus === 'function') {\n            onFocus(event);\n        }\n    };\n\n    return (\n        <button\n            {...otherProps}\n            aria-invalid={invalid ? true : undefined}\n            aria-readonly={readOnly ? true : undefined}\n            className={className}\n            disabled={disabled}\n            onClick={handleClick}\n            onBlur={handleBlur}\n            onFocus={handleFocus}\n            ref={ref}\n            role=\"combobox\"\n            tabIndex={disabled ? -1 : tabIndex}\n            type=\"button\">\n            {children}\n            {readOnly ? null : <Icon name={open ? 'chevron-up' : 'chevron-down'} className=\"pointer-events-none -mr-1 ml-auto\" />}\n        </button>\n    );\n});\n\ntype SingleProps = Omit<Select2TriggerProps, 'value'> & { value?: Select2OptionValue; placeholder?: string };\n\nconst Single = React.forwardRef<HTMLButtonElement, SingleProps>(function Select2TriggerSingle(props, ref) {\n    const { children, emptyValue, value, placeholder, ...buttonProps } = props;\n    const { disabled, readOnly, tags } = useSelect2Context();\n    const contentClassName = cn('flex items-center gap-1 truncate');\n\n    const currentValue = children.find(matchesValue(value));\n\n    let output;\n\n    if (placeholder && currentValue === undefined) {\n        output = (\n            <Placeholder disabled={disabled} readOnly={readOnly}>\n                {placeholder}\n            </Placeholder>\n        );\n    } else if (currentValue) {\n        if (tags && emptyValue !== value) {\n            if (typeof currentValue.props.children === 'string')\n                output = (\n                    <Tag\n                        className=\"truncate\"\n                        color={currentValue.props.color}\n                        disabled={disabled}\n                        icon={currentValue.props.prefix}\n                        readOnly={readOnly}>\n                        {currentValue.props.children}\n                    </Tag>\n                );\n            else output = currentValue.props.children;\n        } else {\n            output = (\n                <>\n                    {currentValue.props.prefix ? (\n                        typeof currentValue.props.prefix === 'string' ? (\n                            <Icon name={currentValue.props.prefix} className=\"mr-1 !h-5 !w-5\" />\n                        ) : (\n                            currentValue.props.prefix\n                        )\n                    ) : null}\n                    {currentValue.props.children}\n                </>\n            );\n        }\n    }\n\n    return (\n        <Button {...buttonProps} ref={ref}>\n            <div className={contentClassName} data-taco={placeholder ? undefined : 'select2-value'}>\n                {output}\n            </div>\n        </Button>\n    );\n});\n\ntype MultipleProps = Omit<Select2TriggerProps, 'value'> & {\n    values?: Select2OptionValue[];\n};\n\nconst Multiple = React.forwardRef<HTMLButtonElement, MultipleProps>(function Select2TriggerMultiple(props, ref) {\n    const { children, emptyValue: _, values = [], placeholder, ...buttonProps } = props;\n    const { disabled, open, readOnly, setValue, tags } = useSelect2Context();\n    const buttonRef = useMergedRef<HTMLButtonElement>(ref);\n\n    const valuesAsChildren = values\n        .map(value => children.find(c => c.props.value === value))\n        .filter(c => !!c) as React.ReactElement<Select2OptionProps>[];\n\n    const forwardClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        event.preventDefault();\n        buttonRef.current?.click();\n    };\n\n    let content;\n    let { className } = buttonProps;\n\n    if (open) {\n        const hasValues = valuesAsChildren.length > 0;\n        className = cn('!absolute z-20 !h-fit', buttonProps.className);\n        content = (\n            <ScrollArea className=\"my-1 flex max-h-[5.5rem] flex-col\" onClick={forwardClick}>\n                <div className=\"flex flex-wrap gap-1\" data-taco=\"select2-value\">\n                    {hasValues ? (\n                        valuesAsChildren.map(child =>\n                            typeof child.props.children === 'string' ? (\n                                <Tag\n                                    key={String(child.props.value)}\n                                    className=\"truncate\"\n                                    color={tags ? child.props.color : undefined}\n                                    disabled={disabled}\n                                    icon={child.props.prefix}\n                                    onDelete={event => {\n                                        event?.stopPropagation();\n                                        event?.preventDefault();\n\n                                        if (!disabled && !readOnly) {\n                                            setValue(child.props.value);\n                                        }\n                                    }}\n                                    readOnly={readOnly}>\n                                    {child.props.children}\n                                </Tag>\n                            ) : (\n                                React.cloneElement(\n                                    child.props.children as React.ReactElement<\n                                        typeof Badge & {\n                                            children: BadgeProps['children'];\n                                            className: BadgeProps['className'];\n                                        }\n                                    >,\n                                    {\n                                        key: String(child.props.value),\n                                        className: '!pr-0 !pl-1.5',\n                                        children: (\n                                            <span className=\"flex items-center\" data-taco=\"select2-value\">\n                                                {\n                                                    (child.props.children as React.ReactElement<{ children?: React.ReactNode }>)\n                                                        .props.children\n                                                }\n                                                <Icon\n                                                    name=\"close\"\n                                                    onClick={event => {\n                                                        event?.stopPropagation();\n                                                        event?.preventDefault();\n\n                                                        if (!disabled && !readOnly) {\n                                                            setValue(child.props.value);\n                                                        }\n                                                    }}\n                                                    className=\"ml-0.5 !h-5 !w-5 shrink-0 cursor-pointer rounded-r p-0.5 hover:bg-black/5\"\n                                                />\n                                            </span>\n                                        ),\n                                    }\n                                )\n                            )\n                        )\n                    ) : (\n                        <Placeholder disabled={disabled} readOnly={readOnly}>\n                            {placeholder}\n                        </Placeholder>\n                    )}\n                </div>\n            </ScrollArea>\n        );\n    } else {\n        content = <MultipleValue onClick={forwardClick} valuesAsChildren={valuesAsChildren} placeholder={placeholder} />;\n    }\n\n    return (\n        <div\n            className=\"relative inline-flex h-fit flex-grow\"\n            data-taco=\"select2-container\"\n            style={{ width: open ? buttonRef.current?.offsetWidth : undefined }}>\n            <Button {...buttonProps} className={className} ref={buttonRef}>\n                {content}\n            </Button>\n        </div>\n    );\n});\n\ntype MultipleValueProps = Omit<Select2TriggerProps, 'value' | 'children' | 'onClick'> & {\n    valuesAsChildren: React.ReactElement<Select2OptionProps>[];\n    placeholder?: string;\n    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nconst MultipleValue = ({ onClick, valuesAsChildren, placeholder }: MultipleValueProps) => {\n    const { disabled, readOnly, tags } = useSelect2Context();\n    const [contentRef, setContentRef] = React.useState<HTMLDivElement | null>(null);\n    const boundaryIndex = contentRef ? getIndexOfFirstChildOverflowingParent(contentRef, 30) : undefined;\n\n    // Retrieves the relevant text content from any React.JSX.Element passed as a select option, handling nested elements, arrays, and direct text\n    const getTooltipTitle = (child: React.ReactElement<{ children?: React.ReactNode }>): string | string[] => {\n        const children = child.props.children;\n\n        if (typeof children === 'string') return children;\n\n        if (React.isValidElement<{ children?: React.ReactNode }>(children)) {\n            const nested = children.props.children;\n\n            if (typeof nested === 'string') return nested;\n\n            if (Array.isArray(nested)) {\n                return nested.filter((item: React.ReactNode) => typeof item === 'string');\n            }\n        }\n\n        return '';\n    };\n\n    return (\n        <div className=\"relative flex w-full items-center gap-1 overflow-hidden\" onClick={onClick}>\n            <div className=\"flex flex-1 gap-1 truncate\" ref={ref => setContentRef(ref)} data-taco=\"select2-value\">\n                {valuesAsChildren.length === 0 ? (\n                    <Placeholder disabled={disabled} readOnly={readOnly}>\n                        {placeholder}\n                    </Placeholder>\n                ) : (\n                    valuesAsChildren.map((child, index) => {\n                        const classNames = {\n                            truncate: index === boundaryIndex,\n                            hidden: boundaryIndex !== undefined && boundaryIndex !== null ? index > boundaryIndex : false,\n                        };\n                        let output;\n                        if (typeof child.props.children === 'string') {\n                            output = (\n                                <Tag\n                                    key={String(child.props.value)}\n                                    className={cn('cursor-pointer', classNames)}\n                                    color={tags ? child.props.color : undefined}\n                                    disabled={disabled}\n                                    icon={child.props.prefix}\n                                    readOnly={readOnly}>\n                                    {child.props.children}\n                                </Tag>\n                            );\n                        } else\n                            output = React.cloneElement(\n                                child.props.children as React.ReactElement<\n                                    typeof Badge & {\n                                        className: BadgeProps['className'];\n                                    }\n                                >,\n                                {\n                                    className: cn('cursor-pointer', { 'shrink-0': index !== boundaryIndex }, classNames),\n                                    key: String(child.props.value),\n                                }\n                            );\n\n                        if (index === boundaryIndex) {\n                            return (\n                                <Tooltip key={String(child.props.value)} title={String(getTooltipTitle(child))}>\n                                    {output}\n                                </Tooltip>\n                            );\n                        }\n\n                        return output;\n                    })\n                )}\n            </div>\n\n            {boundaryIndex !== undefined && boundaryIndex !== null && boundaryIndex < valuesAsChildren.length - 1 ? (\n                <Tooltip\n                    title={valuesAsChildren\n                        .slice(boundaryIndex + 1)\n                        .map(child => (child ? String(getTooltipTitle(child)) : ''))\n                        .join(', ')}>\n                    <Badge className=\"flex-shrink-0\">+{valuesAsChildren.length - (boundaryIndex + 1)}</Badge>\n                </Tooltip>\n            ) : null}\n        </div>\n    );\n};\n\nconst matchesValue = (value: undefined | any | any[]) => (child: React.ReactElement<any>) => {\n    if (Array.isArray(value)) {\n        return value.includes(child.props.value);\n    }\n\n    return child.props.value === value;\n};\n"],"names":["useSelect2Context","getInputClasses","FONT_SIZE_CLASSNAME","isElementInsideOrTriggeredFromContainer","Icon","Tag","useMergedRef","ScrollArea","getIndexOfFirstChildOverflowingParent","Tooltip","Badge"],"mappings":"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"}
+{"version":3,"file":"Trigger.cjs","sources":["../../../../src/components/Select2/components/Trigger.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport type { BadgeProps } from '@/components';\nimport { Badge, Icon, Tag, Tooltip } from '@/components';\nimport { getInputClasses } from '@/components/Input/util';\nimport { ScrollArea } from '@/components/ScrollArea/ScrollArea';\nimport { useMergedRef } from '@/hooks/useMergedRef';\nimport { getIndexOfFirstChildOverflowingParent, isElementInsideOrTriggeredFromContainer } from '@/utils/dom';\n\nimport type { Select2OptionValue } from '../types';\nimport { FONT_SIZE_CLASSNAME } from '../utilities';\n\nimport { useSelect2Context } from './Context';\nimport type { Select2OptionProps } from './Option';\n\ntype Select2TriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    emptyValue?: Select2OptionValue;\n    placeholder?: string;\n    children: React.ReactElement<Select2OptionProps>[];\n};\n\ntype PlaceholderProps = React.PropsWithChildren<{\n    disabled: boolean;\n    readOnly: boolean;\n}>;\n\nconst Placeholder = ({ disabled, readOnly, ...props }: PlaceholderProps) => {\n    if (readOnly) {\n        return null;\n    }\n    return (\n        <div\n            {...props}\n            className={cn({ 'text-gray-500': disabled, 'text-gray-700': !disabled })}\n            data-taco=\"select2-placeholder\"\n        />\n    );\n};\n\nexport const Trigger = React.forwardRef<HTMLButtonElement, Select2TriggerProps>(function Select2Trigger(props, ref) {\n    const { multiple, value } = useSelect2Context();\n\n    if (Array.isArray(value) || multiple) {\n        const values = Array.isArray(value) ? value : value === undefined ? undefined : [value];\n        return <Multiple {...props} ref={ref} values={values} />;\n    }\n\n    return <Single {...props} ref={ref} value={value} />;\n});\n\ntype ButtonProps = React.HTMLAttributes<HTMLButtonElement> &\n    Omit<Select2TriggerProps, 'children' | 'open' | 'setValue' | 'value'>;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Select2TriggerButton(props, ref) {\n    const { children, onBlur, onClick, onFocus, tabIndex = 0, ...otherProps } = props;\n    const { disabled, fontSize = 'medium', highlighted, invalid, open, readOnly } = useSelect2Context();\n\n    const className = cn(\n        'h-fit px-1.5',\n        getInputClasses({ ...props, disabled, highlighted, invalid, readOnly })\n            .replace('w-full', '')\n            .replace('px-2', ''),\n        FONT_SIZE_CLASSNAME[fontSize],\n        {\n            'select-text': readOnly,\n            'w-full': !props.className?.includes('w-'),\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        if (disabled || readOnly) {\n            event.preventDefault();\n            return;\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    let handleBlur;\n\n    if (typeof onBlur === 'function') {\n        // we might be focusing on an input or something inside the dropdown that was triggered by the select\n        // so see if the element gaining focus is inside a portal and look up its controller\n        // if we don't do this, things like validate on blur occur while simply opening the select\n        handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n            if (isElementInsideOrTriggeredFromContainer(event.relatedTarget, event.currentTarget)) {\n                return;\n            }\n\n            onBlur(event);\n        };\n    }\n\n    // select the value text if the select is readonly\n    const handleFocus = (event: React.FocusEvent<HTMLButtonElement>) => {\n        if (readOnly) {\n            const value = event.currentTarget.querySelector(':first-child');\n\n            if (value) {\n                window.getSelection()?.selectAllChildren?.(value);\n            }\n        }\n\n        if (typeof onFocus === 'function') {\n            onFocus(event);\n        }\n    };\n\n    return (\n        <button\n            {...otherProps}\n            aria-invalid={invalid ? true : undefined}\n            aria-readonly={readOnly ? true : undefined}\n            className={className}\n            disabled={disabled}\n            onClick={handleClick}\n            onBlur={handleBlur}\n            onFocus={handleFocus}\n            ref={ref}\n            role=\"combobox\"\n            tabIndex={disabled ? -1 : tabIndex}\n            type=\"button\">\n            {children}\n            {readOnly ? null : <Icon name={open ? 'chevron-up' : 'chevron-down'} className=\"pointer-events-none -mr-1 ml-auto\" />}\n        </button>\n    );\n});\n\ntype SingleProps = Omit<Select2TriggerProps, 'value'> & { value?: Select2OptionValue; placeholder?: string };\n\nconst Single = React.forwardRef<HTMLButtonElement, SingleProps>(function Select2TriggerSingle(props, ref) {\n    const { children, emptyValue, value, placeholder, ...buttonProps } = props;\n    const { disabled, readOnly, tags } = useSelect2Context();\n    const contentClassName = cn('flex items-center gap-1 truncate');\n\n    const currentValue = children.find(matchesValue(value));\n\n    let output;\n\n    if (placeholder && currentValue === undefined) {\n        output = (\n            <Placeholder disabled={disabled} readOnly={readOnly}>\n                {placeholder}\n            </Placeholder>\n        );\n    } else if (currentValue) {\n        if (tags && emptyValue !== value) {\n            if (typeof currentValue.props.children === 'string')\n                output = (\n                    <Tag\n                        className=\"truncate\"\n                        color={currentValue.props.color}\n                        disabled={disabled}\n                        icon={currentValue.props.prefix}\n                        readOnly={readOnly}>\n                        {currentValue.props.children}\n                    </Tag>\n                );\n            else output = currentValue.props.children;\n        } else {\n            output = (\n                <>\n                    {currentValue.props.prefix ? (\n                        typeof currentValue.props.prefix === 'string' ? (\n                            <Icon name={currentValue.props.prefix} className=\"mr-1 !h-5 !w-5\" />\n                        ) : (\n                            currentValue.props.prefix\n                        )\n                    ) : null}\n                    {currentValue.props.children}\n                </>\n            );\n        }\n    }\n\n    return (\n        <Button {...buttonProps} ref={ref}>\n            <div className={contentClassName} data-taco={placeholder ? undefined : 'select2-value'}>\n                {output}\n            </div>\n        </Button>\n    );\n});\n\ntype MultipleProps = Omit<Select2TriggerProps, 'value'> & {\n    values?: Select2OptionValue[];\n};\n\nconst Multiple = React.forwardRef<HTMLButtonElement, MultipleProps>(function Select2TriggerMultiple(props, ref) {\n    const { children, emptyValue: _, values = [], placeholder, ...buttonProps } = props;\n    const { disabled, open, readOnly, setValue, tags } = useSelect2Context();\n    const buttonRef = useMergedRef<HTMLButtonElement>(ref);\n\n    const valuesAsChildren = values\n        .map(value => children.find(c => c.props.value === value))\n        .filter(c => !!c) as React.ReactElement<Select2OptionProps>[];\n\n    const forwardClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        event.preventDefault();\n        buttonRef.current?.click();\n    };\n\n    let content;\n    let { className } = buttonProps;\n\n    if (open) {\n        const hasValues = valuesAsChildren.length > 0;\n        className = cn('!absolute z-20 !h-fit', buttonProps.className);\n        content = (\n            <ScrollArea className=\"my-1 flex max-h-[5.5rem] flex-col\" onClick={forwardClick}>\n                <div className=\"flex flex-wrap gap-1\" data-taco=\"select2-value\">\n                    {hasValues ? (\n                        valuesAsChildren.map(child =>\n                            typeof child.props.children === 'string' ? (\n                                <Tag\n                                    key={String(child.props.value)}\n                                    className=\"truncate\"\n                                    color={tags ? child.props.color : undefined}\n                                    disabled={disabled}\n                                    icon={child.props.prefix}\n                                    onDelete={event => {\n                                        event?.stopPropagation();\n                                        event?.preventDefault();\n\n                                        if (!disabled && !readOnly) {\n                                            setValue(child.props.value);\n                                        }\n                                    }}\n                                    readOnly={readOnly}>\n                                    {child.props.children}\n                                </Tag>\n                            ) : (\n                                React.cloneElement(\n                                    child.props.children as React.ReactElement<\n                                        typeof Badge & {\n                                            children: BadgeProps['children'];\n                                            className: BadgeProps['className'];\n                                        }\n                                    >,\n                                    {\n                                        key: String(child.props.value),\n                                        className: '!pr-0 !pl-1.5',\n                                        children: (\n                                            <span className=\"flex items-center\" data-taco=\"select2-value\">\n                                                {\n                                                    (child.props.children as React.ReactElement<{ children?: React.ReactNode }>)\n                                                        .props.children\n                                                }\n                                                <Icon\n                                                    name=\"close\"\n                                                    onClick={event => {\n                                                        event?.stopPropagation();\n                                                        event?.preventDefault();\n\n                                                        if (!disabled && !readOnly) {\n                                                            setValue(child.props.value);\n                                                        }\n                                                    }}\n                                                    className=\"ml-0.5 !h-5 !w-5 shrink-0 cursor-pointer rounded-r p-0.5 hover:bg-black/5\"\n                                                />\n                                            </span>\n                                        ),\n                                    }\n                                )\n                            )\n                        )\n                    ) : (\n                        <Placeholder disabled={disabled} readOnly={readOnly}>\n                            {placeholder}\n                        </Placeholder>\n                    )}\n                </div>\n            </ScrollArea>\n        );\n    } else {\n        content = <MultipleValue onClick={forwardClick} valuesAsChildren={valuesAsChildren} placeholder={placeholder} />;\n    }\n\n    return (\n        <div\n            className=\"relative inline-flex h-fit flex-grow\"\n            data-taco=\"select2-container\"\n            style={{ width: open ? buttonRef.current?.offsetWidth : undefined }}>\n            <Button {...buttonProps} className={className} ref={buttonRef}>\n                {content}\n            </Button>\n        </div>\n    );\n});\n\ntype MultipleValueProps = Omit<Select2TriggerProps, 'value' | 'children' | 'onClick'> & {\n    valuesAsChildren: React.ReactElement<Select2OptionProps>[];\n    placeholder?: string;\n    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nconst MultipleValue = ({ onClick, valuesAsChildren, placeholder }: MultipleValueProps) => {\n    const { disabled, readOnly, tags } = useSelect2Context();\n    const [contentRef, setContentRef] = React.useState<HTMLDivElement | null>(null);\n    const boundaryIndex = contentRef ? getIndexOfFirstChildOverflowingParent(contentRef, 30) : undefined;\n\n    // Retrieves the relevant text content from any React.JSX.Element passed as a select option, handling nested elements, arrays, and direct text\n    const getTooltipTitle = (child: React.ReactElement<{ children?: React.ReactNode }>): string | string[] => {\n        const children = child.props.children;\n\n        if (typeof children === 'string') return children;\n\n        if (React.isValidElement<{ children?: React.ReactNode }>(children)) {\n            const nested = children.props.children;\n\n            if (typeof nested === 'string') return nested;\n\n            if (Array.isArray(nested)) {\n                return nested.filter((item: React.ReactNode) => typeof item === 'string');\n            }\n        }\n\n        return '';\n    };\n\n    return (\n        <div className=\"relative flex w-full items-center gap-1 overflow-hidden\" onClick={onClick}>\n            <div className=\"flex flex-1 gap-1 truncate\" ref={ref => setContentRef(ref)} data-taco=\"select2-value\">\n                {valuesAsChildren.length === 0 ? (\n                    <Placeholder disabled={disabled} readOnly={readOnly}>\n                        {placeholder}\n                    </Placeholder>\n                ) : (\n                    valuesAsChildren.map((child, index) => {\n                        const classNames = {\n                            truncate: index === boundaryIndex,\n                            hidden: boundaryIndex !== undefined && boundaryIndex !== null ? index > boundaryIndex : false,\n                        };\n                        let output;\n                        if (typeof child.props.children === 'string') {\n                            output = (\n                                <Tag\n                                    key={String(child.props.value)}\n                                    className={cn('cursor-pointer', classNames)}\n                                    color={tags ? child.props.color : undefined}\n                                    disabled={disabled}\n                                    icon={child.props.prefix}\n                                    readOnly={readOnly}>\n                                    {child.props.children}\n                                </Tag>\n                            );\n                        } else\n                            output = React.cloneElement(\n                                child.props.children as React.ReactElement<\n                                    typeof Badge & {\n                                        className: BadgeProps['className'];\n                                    }\n                                >,\n                                {\n                                    className: cn('cursor-pointer', { 'shrink-0': index !== boundaryIndex }, classNames),\n                                    key: String(child.props.value),\n                                }\n                            );\n\n                        if (index === boundaryIndex) {\n                            return (\n                                <Tooltip key={String(child.props.value)} title={String(getTooltipTitle(child))}>\n                                    {output}\n                                </Tooltip>\n                            );\n                        }\n\n                        return output;\n                    })\n                )}\n            </div>\n\n            {boundaryIndex !== undefined && boundaryIndex !== null && boundaryIndex < valuesAsChildren.length - 1 ? (\n                <Tooltip\n                    title={valuesAsChildren\n                        .slice(boundaryIndex + 1)\n                        .map(child => (child ? String(getTooltipTitle(child)) : ''))\n                        .join(', ')}>\n                    <Badge className=\"flex-shrink-0\">+{valuesAsChildren.length - (boundaryIndex + 1)}</Badge>\n                </Tooltip>\n            ) : null}\n        </div>\n    );\n};\n\nconst matchesValue = (value: undefined | any | any[]) => (child: React.ReactElement<any>) => {\n    if (Array.isArray(value)) {\n        return value.includes(child.props.value);\n    }\n\n    return child.props.value === value;\n};\n"],"names":["useSelect2Context","getInputClasses","FONT_SIZE_CLASSNAME","isElementInsideOrTriggeredFromContainer","Icon","Tag","useMergedRef","ScrollArea","getIndexOfFirstChildOverflowingParent","Tooltip","Badge"],"mappings":"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"}