@economic/taco 2.45.4 → 2.46.0

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

@@ -1 +1 @@
-{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n    Select2Children,\n    Select2CreateHandler,\n    Select2CreateDialogRenderer,\n    Select2DeleteHandler,\n    Select2EditHandler,\n    Select2OptionValue,\n    Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, filterOption, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\nimport { debounce } from '../../utils/debounce';\n\ntype Select2Texts = {\n    allSelect: string;\n    allDeselect: string;\n    cancel: string;\n    chooseColor: string;\n    create: string;\n    delete: string;\n    save: string;\n    search: string;\n    searchOrCreate: string;\n    selectAll: string;\n    selectAllResults: string;\n    deselectAll: string;\n    deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    /** Autofocus Select2 when loaded **/\n    autoFocus?: boolean;\n    /** Array of options in Select2 */\n    children: Select2Children;\n    /** Initial value of the input in Select2 */\n    defaultValue?: Select2Value;\n    /** Set what value should have an empty option in Select2 */\n    emptyValue?: Select2OptionValue;\n    /** Whether the Select2 is in a disabled state **/\n    disabled?: boolean;\n    /** Font size of text in Select2 **/\n    fontSize?: FontSize;\n    /** Draws attention to the Select2 by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** Whether the Select2 is in an invalid state **/\n    invalid?: boolean;\n    /** Whether the Select2 is loading the data **/\n    loading?: boolean;\n    /** Whether the Select2 allows selecting multiple values **/\n    multiple?: boolean;\n    /** Whether the Select2 is in an invalid state **/\n    name?: string;\n    /** Handler called when user chooses an option from the provided options **/\n    onChange?: (value: Select2Value) => void;\n    /** Handler called when user creates a new option **/\n    onCreate?: Select2CreateHandler;\n    /** Handler called when user deletes an option **/\n    onDelete?: Select2DeleteHandler;\n    /** Handler called when user edits an option **/\n    onEdit?: Select2EditHandler;\n    /** Placeholder showed when nothing is selected **/\n    placeholder?: string;\n    /** Whether the Select2 is in a readonly state **/\n    readOnly?: boolean;\n    required?: boolean;\n    /** Renders select options as tags **/\n    tags?: boolean;\n    /** Value of the input in select2 */\n    value?: Select2Value;\n    /** Create dialog component, if specified, then create button will become always visible in the bottom of options dropdown,\n     * when clicked, it will open create dialog and wait for 'onCreate' handler to be triggered from the dialog */\n    createDialog?: Select2CreateDialogRenderer;\n    /** Create button text */\n    createTriggerText?: string;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n    Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n    Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n    Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n    const {\n        children: initChildren,\n        defaultValue: defaultProp,\n        disabled = false,\n        emptyValue = undefined,\n        fontSize,\n        highlighted = false,\n        invalid = false,\n        loading,\n        multiple = false,\n        name,\n        onChange,\n        onCreate,\n        onDelete,\n        onEdit,\n        placeholder,\n        readOnly = false,\n        tags = false,\n        value: prop,\n        createDialog,\n        createTriggerText,\n        ...otherProps\n    } = props;\n\n    const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n        if (emptyValue !== undefined && !multiple) {\n            // Empty option has 0px height, because it's empty, so need to apply height manually\n            return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n        }\n        return;\n    }, [emptyValue, multiple]);\n\n    const initialChildren = React.useMemo(() => {\n        if (emptyOption) {\n            return [emptyOption, ...initChildren] as Select2Children;\n        }\n        return initChildren;\n    }, [emptyOption, initChildren]);\n\n    // refs\n    const internalRef = useMergedRef<HTMLButtonElement>(ref);\n    const listboxRef = React.useRef<CollectionRef>(null);\n    const searchRef = React.useRef<HTMLInputElement>(null);\n    const { texts } = useLocalization();\n    // align the listbox min width with the width of the input - it should never be smaller\n    const dimensions = useBoundingClientRectListener(internalRef);\n\n    // state\n    const [open, setOpen] = React.useState(false);\n    const [value, _setValue] = useControllableState<Select2Value>({\n        // uncontrolled\n        defaultProp,\n        // controlled\n        onChange,\n        prop,\n    });\n    const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n    const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n    const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n        children: initialChildren,\n        emptyValue,\n        multiple,\n        open,\n        setValue,\n        value,\n    });\n\n    // context\n    const context = {\n        disabled,\n        highlighted,\n        invalid,\n        listboxRef,\n        multiple,\n        onCreate,\n        onDelete,\n        onEdit,\n        open,\n        readOnly,\n        ref: internalRef,\n        searchQuery,\n        searchRef,\n        setOpen,\n        setSearchQuery,\n        setValidationError,\n        setValue,\n        shouldPauseHoverState,\n        setShouldPauseHoverState,\n        tags,\n        fontSize,\n        validationError,\n        value,\n        createDialog,\n        createTriggerText,\n    };\n\n    const hasInlineCreation = onCreate && !createDialog;\n    const hasSearch = flattenedChildren.length > 5 || hasInlineCreation;\n    const visibleChildren = searchQuery === '' ? initialChildren : filteredChildren;\n    const selectOptions =\n        searchQuery === ''\n            ? flattenedChildren.map(child => child.props.value)\n            : filteredChildren\n                  .map(child =>\n                      isGroup(child)\n                          ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n                          : child.props.value\n                  )\n                  .flatMap(c => c) || [];\n\n    // support typeahead functionality when search isn't available\n    const queryTimeoutRef = React.useRef('');\n\n    const typeahead = debounce(function () {\n        if (!queryTimeoutRef.current) {\n            return;\n        }\n\n        const matchedValueIndex = visibleChildren.findIndex(child =>\n            filterOption(child as React.ReactElement<Select2OptionProps>, queryTimeoutRef.current)\n        );\n\n        if (matchedValueIndex > -1) {\n            setValue(selectOptions[matchedValueIndex]);\n        }\n\n        queryTimeoutRef.current = '';\n    }, 200);\n\n    const setValueIfMatched = (query: string) => {\n        queryTimeoutRef.current = queryTimeoutRef.current + query;\n        typeahead();\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\n        } else if (isElementInsideTable3OrReport(event.currentTarget)) {\n            return;\n        } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n            setOpen(true);\n\n            if (!hasSearch) {\n                setValueIfMatched(event.key);\n            }\n        }\n\n        // the focus should always remain on the input, so we forward events on to the listbox\n        listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n    };\n\n    const shouldFocusNextRef = React.useRef<boolean>(false);\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (isAriaDirectionKey(event)) {\n            setShouldPauseHoverState(true);\n            return;\n        }\n\n        if (event.key === 'Tab') {\n            shouldFocusNextRef.current = true;\n            setOpen(false);\n            return;\n        }\n\n        // support typeahead to set the value by typing its text\n        if (!hasSearch && /^[a-z0-9]$/i.test(event.key)) {\n            setValueIfMatched(event.key);\n            return;\n        }\n    };\n\n    // popover closes and unmounts before any event can be used to focus next, so prevent focusing the trigger and focus next\n    const handleCloseAutoFocus = event => {\n        if (shouldFocusNextRef.current) {\n            event.preventDefault();\n            shouldFocusNextRef.current = false;\n            otherProps.onBlur?.(event as any);\n            getNextFocussableElement(internalRef.current)?.focus();\n            return;\n        }\n    };\n\n    const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n    const selectAllText = React.useMemo(() => {\n        if (searchQuery === '') {\n            if (areAllSelected) {\n                return texts.select2.deselectAll;\n            } else {\n                return texts.select2.selectAll;\n            }\n        } else if (areAllSelected) {\n            return texts.select2.deselectAllResults;\n        } else {\n            return texts.select2.selectAllResults;\n        }\n    }, [areAllSelected, searchQuery]);\n\n    const selectAll = () => {\n        if (!Array.isArray(value) || value.length === 0) {\n            setValue(selectOptions);\n        } else {\n            // array of all available options which are not selected\n            const preselectedValues = selectOptions.filter(option => !value.includes(option));\n            setValue([...value, ...preselectedValues]);\n        }\n    };\n\n    const deselectAll = () => {\n        if (searchQuery === '') {\n            setValue([]);\n        } else {\n            const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n            setValue(nextValue);\n        }\n    };\n\n    const className = cn(\n        'border-grey-300 rounded border bg-white py-1.5 shadow-md ',\n        {\n            'focus-within:yt-focus': !hasSearch,\n            'outline-none': hasSearch,\n        },\n        createCollectionClassName()\n    );\n\n    return (\n        <Select2Context.Provider value={context}>\n            <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n                <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        emptyValue={emptyValue}\n                        onKeyDown={handleKeyDown}\n                        placeholder={placeholder}\n                        ref={internalRef}>\n                        {flattenedChildren}\n                    </Trigger>\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Content\n                        asChild\n                        align=\"start\"\n                        onCloseAutoFocus={handleCloseAutoFocus}\n                        onPointerDownOutside={otherProps.onBlur as any}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {hasSearch ? (\n                                <>\n                                    <Search\n                                        placeholder={hasInlineCreation ? texts.select2.searchOrCreate : texts.select2.search}\n                                        ref={searchRef}\n                                    />\n                                    {multiple && selectOptions.length > 1 && (\n                                        <>\n                                            <Button\n                                                className=\"!justify-start\"\n                                                appearance=\"discrete\"\n                                                onClick={areAllSelected ? deselectAll : selectAll}>\n                                                {selectAllText}\n                                            </Button>\n                                            <div className=\"border-grey-300 mx-3 rounded border-t\" />\n                                        </>\n                                    )}\n                                </>\n                            ) : null}\n                            {loading ? (\n                                <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n                                    <span>\n                                        <Spinner\n                                            delay={0}\n                                            className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n                                                '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n                                                '!h-4 !w-4': fontSize === FontSizes.medium,\n                                                '!h-5 !w-5': fontSize === FontSizes.large,\n                                            })}\n                                        />\n                                    </span>\n                                    <span>{texts.listbox.loading}</span>\n                                </span>\n                            ) : flattenedChildren.length <= 0 ? (\n                                <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n                                    {texts.listbox.empty}\n                                </div>\n                            ) : (\n                                <ListboxPrimitive.Root\n                                    className=\"flex flex-col gap-0.5 focus-visible:outline-none\"\n                                    customSelector=\":scope > button\"\n                                    disabled={disabled}\n                                    multiple={multiple}\n                                    onKeyDown={handleListboxKeyDown}\n                                    readOnly={readOnly}\n                                    ref={listboxRef}\n                                    setValue={setValue}\n                                    value={value}>\n                                    <Collection>{visibleChildren}</Collection>\n                                    {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n                                </ListboxPrimitive.Root>\n                            )}\n                        </div>\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\n                <ControlledHiddenField\n                    emptyValue={emptyValue}\n                    multiple={multiple || tags}\n                    name={name}\n                    options={flattenedChildren.map(child => child.props.value)}\n                    parentRef={internalRef}\n                    setValue={setValue}\n                    value={value}\n                />\n            </PopoverPrimitive.Root>\n        </Select2Context.Provider>\n    );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n    const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n    const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n    let bubbleValue;\n\n    if (isFormControl) {\n        if (value !== undefined) {\n            if (multiple) {\n                bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n            } else {\n                bubbleValue = value === null ? '' : String(value);\n            }\n        }\n\n        return (\n            <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} tabIndex={-1} value={bubbleValue}>\n                {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n                {options.map(option => (\n                    <option key={String(option)} value={String(option)} />\n                ))}\n            </BubbleSelect>\n        );\n    }\n\n    return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n    Select2Texts,\n    Select2GroupProps,\n    Select2OptionProps,\n    Select2OptionValue,\n    Select2Value,\n    Select2Props,\n    Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","createDialog","createTriggerText","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","open","setOpen","useState","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","hasInlineCreation","hasSearch","length","visibleChildren","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","queryTimeoutRef","typeahead","debounce","current","matchedValueIndex","findIndex","filterOption","setValueIfMatched","query","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","dispatchEvent","createCustomKeyboardEvent","shouldFocusNextRef","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","_otherProps$onBlur","_getNextFocussableEle","onBlur","call","getNextFocussableElement","focus","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","asChild","Trigger","onKeyDown","align","onCloseAutoFocus","onPointerDownOutside","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","empty","customSelector","Collection","Create","options","ControlledHiddenField","parentRef","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}
+{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n    Select2Children,\n    Select2CreateHandler,\n    Select2CreateDialogRenderer,\n    Select2DeleteHandler,\n    Select2EditHandler,\n    Select2OptionValue,\n    Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, filterOption, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\nimport { debounce } from '../../utils/debounce';\n\ntype Select2Texts = {\n    allSelect: string;\n    allDeselect: string;\n    cancel: string;\n    chooseColor: string;\n    create: string;\n    delete: string;\n    save: string;\n    search: string;\n    searchOrCreate: string;\n    selectAll: string;\n    selectAllResults: string;\n    deselectAll: string;\n    deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    /** Autofocus Select2 when loaded **/\n    autoFocus?: boolean;\n    /** Array of options in Select2 */\n    children: Select2Children;\n    /** Initial value of the input in Select2 */\n    defaultValue?: Select2Value;\n    /** Set what value should have an empty option in Select2 */\n    emptyValue?: Select2OptionValue;\n    /** Whether the Select2 is in a disabled state **/\n    disabled?: boolean;\n    /** Font size of text in Select2 **/\n    fontSize?: FontSize;\n    /** Draws attention to the Select2 by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** Whether the Select2 is in an invalid state **/\n    invalid?: boolean;\n    /** Whether the Select2 is loading the data **/\n    loading?: boolean;\n    /** Whether the Select2 allows selecting multiple values **/\n    multiple?: boolean;\n    /** Whether the Select2 is in an invalid state **/\n    name?: string;\n    /** Handler called when user chooses an option from the provided options **/\n    onChange?: (value: Select2Value) => void;\n    /** Handler called when user creates a new option **/\n    onCreate?: Select2CreateHandler;\n    /** Handler called when user deletes an option **/\n    onDelete?: Select2DeleteHandler;\n    /** Handler called when user edits an option **/\n    onEdit?: Select2EditHandler;\n    /** Placeholder showed when nothing is selected **/\n    placeholder?: string;\n    /** Whether the Select2 is in a readonly state **/\n    readOnly?: boolean;\n    required?: boolean;\n    /** Renders select options as tags **/\n    tags?: boolean;\n    /** Value of the input in select2 */\n    value?: Select2Value;\n    /** Create dialog component, if specified, then create button will become always visible in the bottom of options dropdown,\n     * when clicked, it will open create dialog and wait for 'onCreate' handler to be triggered from the dialog */\n    createDialog?: Select2CreateDialogRenderer;\n    /** Create button text */\n    createTriggerText?: string;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n    Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n    Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n    Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n    const {\n        children: initChildren,\n        defaultValue: defaultProp,\n        disabled = false,\n        emptyValue = undefined,\n        fontSize,\n        highlighted = false,\n        invalid = false,\n        loading,\n        multiple = false,\n        name,\n        onChange,\n        onCreate,\n        onDelete,\n        onEdit,\n        placeholder,\n        readOnly = false,\n        tags = false,\n        value: prop,\n        createDialog,\n        createTriggerText,\n        ...otherProps\n    } = props;\n\n    const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n        if (emptyValue !== undefined && !multiple) {\n            // Empty option has 0px height, because it's empty, so need to apply height manually\n            return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n        }\n        return;\n    }, [emptyValue, multiple]);\n\n    const initialChildren = React.useMemo(() => {\n        if (emptyOption) {\n            return [emptyOption, ...initChildren] as Select2Children;\n        }\n        return initChildren;\n    }, [emptyOption, initChildren]);\n\n    // refs\n    const internalRef = useMergedRef<HTMLButtonElement>(ref);\n    const listboxRef = React.useRef<CollectionRef>(null);\n    const searchRef = React.useRef<HTMLInputElement>(null);\n    const { texts } = useLocalization();\n    // align the listbox min width with the width of the input - it should never be smaller\n    const dimensions = useBoundingClientRectListener(internalRef);\n\n    // state\n    const [open, setOpen] = React.useState(false);\n    const [value, _setValue] = useControllableState<Select2Value>({\n        // uncontrolled\n        defaultProp,\n        // controlled\n        onChange,\n        prop,\n    });\n    const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n    const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n    const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n        children: initialChildren,\n        emptyValue,\n        multiple,\n        open,\n        setValue,\n        value,\n    });\n\n    // context\n    const context = {\n        disabled,\n        highlighted,\n        invalid,\n        listboxRef,\n        multiple,\n        onCreate,\n        onDelete,\n        onEdit,\n        open,\n        readOnly,\n        ref: internalRef,\n        searchQuery,\n        searchRef,\n        setOpen,\n        setSearchQuery,\n        setValidationError,\n        setValue,\n        shouldPauseHoverState,\n        setShouldPauseHoverState,\n        tags,\n        fontSize,\n        validationError,\n        value,\n        createDialog,\n        createTriggerText,\n    };\n\n    const hasInlineCreation = onCreate && !createDialog;\n    const hasSearch = flattenedChildren.length > 5 || hasInlineCreation;\n    const visibleChildren = searchQuery === '' ? initialChildren : filteredChildren;\n    const selectOptions =\n        searchQuery === ''\n            ? flattenedChildren.map(child => child.props.value)\n            : filteredChildren\n                  .map(child =>\n                      isGroup(child)\n                          ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n                          : child.props.value\n                  )\n                  .flatMap(c => c) || [];\n\n    // support typeahead functionality when search isn't available\n    const queryTimeoutRef = React.useRef('');\n\n    const typeahead = debounce(function () {\n        if (!queryTimeoutRef.current) {\n            return;\n        }\n\n        const matchedValueIndex = visibleChildren.findIndex(child =>\n            filterOption(child as React.ReactElement<Select2OptionProps>, queryTimeoutRef.current)\n        );\n\n        if (matchedValueIndex > -1) {\n            setValue(selectOptions[matchedValueIndex]);\n        }\n\n        queryTimeoutRef.current = '';\n    }, 200);\n\n    const setValueIfMatched = (query: string) => {\n        queryTimeoutRef.current = queryTimeoutRef.current + query;\n        typeahead();\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\n        } else if (isElementInsideTable3OrReport(event.currentTarget) && isAriaDirectionKey(event)) {\n            return;\n        } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n            setOpen(true);\n\n            if (!hasSearch) {\n                setValueIfMatched(event.key);\n            }\n        }\n\n        // the focus should always remain on the input, so we forward events on to the listbox\n        listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n    };\n\n    const shouldFocusNextRef = React.useRef<boolean>(false);\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (isAriaDirectionKey(event)) {\n            setShouldPauseHoverState(true);\n            return;\n        }\n\n        if (event.key === 'Tab') {\n            shouldFocusNextRef.current = true;\n            setOpen(false);\n            return;\n        }\n\n        // support typeahead to set the value by typing its text\n        if (!hasSearch && /^[a-z0-9]$/i.test(event.key)) {\n            setValueIfMatched(event.key);\n            return;\n        }\n    };\n\n    // popover closes and unmounts before any event can be used to focus next, so prevent focusing the trigger and focus next\n    const handleCloseAutoFocus = event => {\n        if (shouldFocusNextRef.current) {\n            event.preventDefault();\n            shouldFocusNextRef.current = false;\n            otherProps.onBlur?.(event as any);\n            getNextFocussableElement(internalRef.current)?.focus();\n            return;\n        }\n    };\n\n    const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n    const selectAllText = React.useMemo(() => {\n        if (searchQuery === '') {\n            if (areAllSelected) {\n                return texts.select2.deselectAll;\n            } else {\n                return texts.select2.selectAll;\n            }\n        } else if (areAllSelected) {\n            return texts.select2.deselectAllResults;\n        } else {\n            return texts.select2.selectAllResults;\n        }\n    }, [areAllSelected, searchQuery]);\n\n    const selectAll = () => {\n        if (!Array.isArray(value) || value.length === 0) {\n            setValue(selectOptions);\n        } else {\n            // array of all available options which are not selected\n            const preselectedValues = selectOptions.filter(option => !value.includes(option));\n            setValue([...value, ...preselectedValues]);\n        }\n    };\n\n    const deselectAll = () => {\n        if (searchQuery === '') {\n            setValue([]);\n        } else {\n            const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n            setValue(nextValue);\n        }\n    };\n\n    const className = cn(\n        'border-grey-300 rounded border bg-white py-1.5 shadow-md ',\n        {\n            'focus-within:yt-focus': !hasSearch,\n            'outline-none': hasSearch,\n        },\n        createCollectionClassName()\n    );\n\n    return (\n        <Select2Context.Provider value={context}>\n            <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n                <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        emptyValue={emptyValue}\n                        onKeyDown={handleKeyDown}\n                        placeholder={placeholder}\n                        ref={internalRef}>\n                        {flattenedChildren}\n                    </Trigger>\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Content\n                        asChild\n                        align=\"start\"\n                        onCloseAutoFocus={handleCloseAutoFocus}\n                        onPointerDownOutside={otherProps.onBlur as any}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {hasSearch ? (\n                                <>\n                                    <Search\n                                        placeholder={hasInlineCreation ? texts.select2.searchOrCreate : texts.select2.search}\n                                        ref={searchRef}\n                                    />\n                                    {multiple && selectOptions.length > 1 && (\n                                        <>\n                                            <Button\n                                                className=\"!justify-start\"\n                                                appearance=\"discrete\"\n                                                onClick={areAllSelected ? deselectAll : selectAll}>\n                                                {selectAllText}\n                                            </Button>\n                                            <div className=\"border-grey-300 mx-3 rounded border-t\" />\n                                        </>\n                                    )}\n                                </>\n                            ) : null}\n                            {loading ? (\n                                <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n                                    <span>\n                                        <Spinner\n                                            delay={0}\n                                            className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n                                                '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n                                                '!h-4 !w-4': fontSize === FontSizes.medium,\n                                                '!h-5 !w-5': fontSize === FontSizes.large,\n                                            })}\n                                        />\n                                    </span>\n                                    <span>{texts.listbox.loading}</span>\n                                </span>\n                            ) : flattenedChildren.length <= 0 ? (\n                                <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n                                    {texts.listbox.empty}\n                                </div>\n                            ) : (\n                                <ListboxPrimitive.Root\n                                    className=\"flex flex-col gap-0.5 focus-visible:outline-none\"\n                                    customSelector=\":scope > button\"\n                                    disabled={disabled}\n                                    multiple={multiple}\n                                    onKeyDown={handleListboxKeyDown}\n                                    readOnly={readOnly}\n                                    ref={listboxRef}\n                                    setValue={setValue}\n                                    value={value}>\n                                    <Collection>{visibleChildren}</Collection>\n                                    {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n                                </ListboxPrimitive.Root>\n                            )}\n                        </div>\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\n                <ControlledHiddenField\n                    emptyValue={emptyValue}\n                    multiple={multiple || tags}\n                    name={name}\n                    options={flattenedChildren.map(child => child.props.value)}\n                    parentRef={internalRef}\n                    setValue={setValue}\n                    value={value}\n                />\n            </PopoverPrimitive.Root>\n        </Select2Context.Provider>\n    );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n    const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n    const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n    let bubbleValue;\n\n    if (isFormControl) {\n        if (value !== undefined) {\n            if (multiple) {\n                bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n            } else {\n                bubbleValue = value === null ? '' : String(value);\n            }\n        }\n\n        return (\n            <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} tabIndex={-1} value={bubbleValue}>\n                {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n                {options.map(option => (\n                    <option key={String(option)} value={String(option)} />\n                ))}\n            </BubbleSelect>\n        );\n    }\n\n    return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n    Select2Texts,\n    Select2GroupProps,\n    Select2OptionProps,\n    Select2OptionValue,\n    Select2Value,\n    Select2Props,\n    Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","createDialog","createTriggerText","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","open","setOpen","useState","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","hasInlineCreation","hasSearch","length","visibleChildren","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","queryTimeoutRef","typeahead","debounce","current","matchedValueIndex","findIndex","filterOption","setValueIfMatched","query","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","isAriaDirectionKey","ctrlKey","metaKey","test","_listboxRef$current","dispatchEvent","createCustomKeyboardEvent","shouldFocusNextRef","handleListboxKeyDown","handleCloseAutoFocus","_otherProps$onBlur","_getNextFocussableEle","onBlur","call","getNextFocussableElement","focus","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","asChild","Trigger","onKeyDown","align","onCloseAutoFocus","onPointerDownOutside","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","empty","customSelector","Collection","Create","options","ControlledHiddenField","parentRef","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}

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

@@ -28,7 +28,7 @@ const Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
     onCheckedChange: onChange,
     ref: ref
   }), /*#__PURE__*/createElement(Thumb, {
-    className: "'will-change-transform mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50 group-aria-checked:translate-x-[1.1rem]"
+    className: "pointer-events-none mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform will-change-transform group-disabled:opacity-50 group-aria-checked:translate-x-[1.1rem]"
   }));
   if (label) {
     const labelContainerClassName = cn('flex self-start cursor-pointer', {

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

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../../../../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\nimport { useId } from '../../hooks/useId';\n\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\n    /** Label for the switch */\n    label?: React.ReactNode;\n    /* Whether user input is required */\n    required?: boolean;\n};\n\nexport interface UncontrolledSwitchProps extends SwitchBaseProps {\n    checked?: never;\n    onChange?: never;\n    /* The default checked state (uncontrolled) */\n    defaultChecked?: boolean;\n}\n\nexport interface ControlledSwitchProps extends SwitchBaseProps {\n    defaultChecked?: never;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean) => void;\n}\n\nexport type SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\n\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\n    const { label, onChange, ...otherProps } = props;\n    const id = useId(props.id);\n\n    const className = cn(\n        'group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex focus-visible:yt-focus',\n        {\n            'mr-2': !!label,\n            'bg-grey-500 hover:bg-grey-700 aria-checked:bg-blue-500 aria-checked:hover:bg-blue-700': !props.disabled,\n            'bg-grey-500/50 aria-checked:bg-blue-500/50 cursor-not-allowed': props.disabled,\n        },\n        props.className\n    );\n\n    let labelledByProps: Record<string, string> | null = null;\n\n    if (label) {\n        labelledByProps = {\n            'aria-labelledby': `${id}-label`,\n            id,\n        };\n    }\n\n    const element = (\n        <PrimitiveSwitch.Root\n            {...otherProps}\n            {...labelledByProps}\n            className={className}\n            data-taco=\"switch\"\n            onCheckedChange={onChange}\n            ref={ref}>\n            <PrimitiveSwitch.Thumb className=\"'will-change-transform mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50 group-aria-checked:translate-x-[1.1rem]\" />\n        </PrimitiveSwitch.Root>\n    );\n\n    if (label) {\n        const labelContainerClassName = cn('flex self-start cursor-pointer', {\n            'cursor-not-allowed text-grey-300': props.disabled,\n        });\n\n        return (\n            <span className={labelContainerClassName} data-taco=\"switch-container\">\n                {element}\n                <label htmlFor={id} id={`${id}-label`}>\n                    {label}\n                </label>\n            </span>\n        );\n    }\n\n    return element;\n});\nSwitch.displayName = 'Switch';\n"],"names":["Switch","React","props","ref","label","onChange","otherProps","id","useId","className","cn","disabled","labelledByProps","element","PrimitiveSwitch","onCheckedChange","labelContainerClassName","htmlFor","displayName"],"mappings":";;;;;MA6BaA,MAAM,gBAAGC,UAAgB,CAAC,SAASD,MAAMA,CAACE,KAAkB,EAAEC,GAAiC;EACxG,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGJ,KAAK;EAChD,MAAMK,EAAE,GAAGC,KAAK,CAACN,KAAK,CAACK,EAAE,CAAC;EAE1B,MAAME,SAAS,GAAGC,EAAE,CAChB,kFAAkF,EAClF;IACI,MAAM,EAAE,CAAC,CAACN,KAAK;IACf,uFAAuF,EAAE,CAACF,KAAK,CAACS,QAAQ;IACxG,+DAA+D,EAAET,KAAK,CAACS;GAC1E,EACDT,KAAK,CAACO,SAAS,CAClB;EAED,IAAIG,eAAe,GAAkC,IAAI;EAEzD,IAAIR,KAAK,EAAE;IACPQ,eAAe,GAAG;MACd,iBAAiB,EAAE,GAAGL,EAAE,QAAQ;MAChCA;KACH;;EAGL,MAAMM,OAAO,gBACTZ,cAACa,IAAoB,oBACbR,UAAU,EACVM,eAAe;IACnBH,SAAS,EAAEA,SAAS;iBACV,QAAQ;IAClBM,eAAe,EAAEV,QAAQ;IACzBF,GAAG,EAAEA;mBACLF,cAACa,KAAqB;IAACL,SAAS,EAAC;IAA6K,CAErN;EAED,IAAIL,KAAK,EAAE;IACP,MAAMY,uBAAuB,GAAGN,EAAE,CAAC,gCAAgC,EAAE;MACjE,kCAAkC,EAAER,KAAK,CAACS;KAC7C,CAAC;IAEF,oBACIV;MAAMQ,SAAS,EAAEO,uBAAuB;mBAAY;OAC/CH,OAAO,eACRZ;MAAOgB,OAAO,EAAEV,EAAE;MAAEA,EAAE,EAAE,GAAGA,EAAE;OACxBH,KAAK,CACF,CACL;;EAIf,OAAOS,OAAO;AAClB,CAAC;AACDb,MAAM,CAACkB,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"Switch.js","sources":["../../../../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\nimport { useId } from '../../hooks/useId';\n\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\n    /** Label for the switch */\n    label?: React.ReactNode;\n    /* Whether user input is required */\n    required?: boolean;\n};\n\nexport interface UncontrolledSwitchProps extends SwitchBaseProps {\n    checked?: never;\n    onChange?: never;\n    /* The default checked state (uncontrolled) */\n    defaultChecked?: boolean;\n}\n\nexport interface ControlledSwitchProps extends SwitchBaseProps {\n    defaultChecked?: never;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean) => void;\n}\n\nexport type SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\n\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\n    const { label, onChange, ...otherProps } = props;\n    const id = useId(props.id);\n\n    const className = cn(\n        'group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex focus-visible:yt-focus',\n        {\n            'mr-2': !!label,\n            'bg-grey-500 hover:bg-grey-700 aria-checked:bg-blue-500 aria-checked:hover:bg-blue-700': !props.disabled,\n            'bg-grey-500/50 aria-checked:bg-blue-500/50 cursor-not-allowed': props.disabled,\n        },\n        props.className\n    );\n\n    let labelledByProps: Record<string, string> | null = null;\n\n    if (label) {\n        labelledByProps = {\n            'aria-labelledby': `${id}-label`,\n            id,\n        };\n    }\n\n    const element = (\n        <PrimitiveSwitch.Root\n            {...otherProps}\n            {...labelledByProps}\n            className={className}\n            data-taco=\"switch\"\n            onCheckedChange={onChange}\n            ref={ref}>\n            <PrimitiveSwitch.Thumb className=\"pointer-events-none mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform will-change-transform group-disabled:opacity-50 group-aria-checked:translate-x-[1.1rem]\" />\n        </PrimitiveSwitch.Root>\n    );\n\n    if (label) {\n        const labelContainerClassName = cn('flex self-start cursor-pointer', {\n            'cursor-not-allowed text-grey-300': props.disabled,\n        });\n\n        return (\n            <span className={labelContainerClassName} data-taco=\"switch-container\">\n                {element}\n                <label htmlFor={id} id={`${id}-label`}>\n                    {label}\n                </label>\n            </span>\n        );\n    }\n\n    return element;\n});\nSwitch.displayName = 'Switch';\n"],"names":["Switch","React","props","ref","label","onChange","otherProps","id","useId","className","cn","disabled","labelledByProps","element","PrimitiveSwitch","onCheckedChange","labelContainerClassName","htmlFor","displayName"],"mappings":";;;;;MA6BaA,MAAM,gBAAGC,UAAgB,CAAC,SAASD,MAAMA,CAACE,KAAkB,EAAEC,GAAiC;EACxG,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGJ,KAAK;EAChD,MAAMK,EAAE,GAAGC,KAAK,CAACN,KAAK,CAACK,EAAE,CAAC;EAE1B,MAAME,SAAS,GAAGC,EAAE,CAChB,kFAAkF,EAClF;IACI,MAAM,EAAE,CAAC,CAACN,KAAK;IACf,uFAAuF,EAAE,CAACF,KAAK,CAACS,QAAQ;IACxG,+DAA+D,EAAET,KAAK,CAACS;GAC1E,EACDT,KAAK,CAACO,SAAS,CAClB;EAED,IAAIG,eAAe,GAAkC,IAAI;EAEzD,IAAIR,KAAK,EAAE;IACPQ,eAAe,GAAG;MACd,iBAAiB,EAAE,GAAGL,EAAE,QAAQ;MAChCA;KACH;;EAGL,MAAMM,OAAO,gBACTZ,cAACa,IAAoB,oBACbR,UAAU,EACVM,eAAe;IACnBH,SAAS,EAAEA,SAAS;iBACV,QAAQ;IAClBM,eAAe,EAAEV,QAAQ;IACzBF,GAAG,EAAEA;mBACLF,cAACa,KAAqB;IAACL,SAAS,EAAC;IAAgM,CAExO;EAED,IAAIL,KAAK,EAAE;IACP,MAAMY,uBAAuB,GAAGN,EAAE,CAAC,gCAAgC,EAAE;MACjE,kCAAkC,EAAER,KAAK,CAACS;KAC7C,CAAC;IAEF,oBACIV;MAAMQ,SAAS,EAAEO,uBAAuB;mBAAY;OAC/CH,OAAO,eACRZ;MAAOgB,OAAO,EAAEV,EAAE;MAAEA,EAAE,EAAE,GAAGA,EAAE;OACxBH,KAAK,CACF,CACL;;EAIf,OAAOS,OAAO;AAClB,CAAC;AACDb,MAAM,CAACkB,WAAW,GAAG,QAAQ;;;;"}

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

@@ -3,8 +3,9 @@ import { fixedForwardRef } from '../../types.js';
 import { Table } from '../../primitives/Table/Core/Table.js';
 import { useTable3 } from './useTable3.js';
 import { Alert } from './components/Editing/Alert.js';
-import CreateNewRowButton from './components/Row/Editing/CreateRowButton.js';
 import { Editing } from './components/Toolbar/Editing/Editing.js';
+import { CreateNewRow } from './components/Row/Editing/CreateNewRow.js';
+import { TemporaryRow } from './components/Row/Editing/TemporaryRow.js';
 
 function Column(_) {
   return null;
@@ -21,8 +22,8 @@ const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref)
     'data-table-editing-mode': (_table3$meta$editing = table3.meta.editing) !== null && _table3$meta$editing !== void 0 && _table3$meta$editing.isEditing ? (_table3$meta$editing2 = table3.meta.editing) !== null && _table3$meta$editing2 !== void 0 && _table3$meta$editing2.isDetailedMode ? 'detailed' : 'normal' : undefined,
     enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing
   };
-  const hasAlertErrors = table3.meta.editing.hasAlertErrors();
-  const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;
+  const hasAlertErrors = table3.meta.editing.getErrorsShownInAlert().length;
+  const hasCreateWorkflow = table3.meta.editing.isEnabled && props.onEditingCreate;
   return /*#__PURE__*/React__default.createElement(Table, null, /*#__PURE__*/React__default.createElement(Table.Toolbar, {
     table: table3
   }, table3.meta.editing.isEnabled ? (/*#__PURE__*/React__default.createElement(Editing, {
@@ -36,12 +37,19 @@ const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref)
   })) : null, /*#__PURE__*/React__default.createElement(Table.Grid, Object.assign({}, gridAttributes, {
     "data-taco": "table3",
     table: table3
-  }), showCreateRowButton && (/*#__PURE__*/React__default.createElement(CreateNewRowButton, {
+  }), hasCreateWorkflow ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TemporaryRow, {
+    createRowButtonRef: table3.meta.editing.createRowButtonRef,
     table: table3.instance,
     tableMeta: table3.meta,
+    tableRef: table3.ref
+  }), /*#__PURE__*/React__default.createElement(CreateNewRow, {
+    buttonRef: table3.meta.editing.createRowButtonRef,
     onEditingCreate: props.onEditingCreate,
-    scrollToIndex: table3.renderer.scrollToIndex
-  }))));
+    scrollToIndex: table3.renderer.scrollToIndex,
+    table: table3.instance,
+    tableMeta: table3.meta,
+    tableRef: table3.ref
+  }))) : null));
 });
 const Table3 = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
   const stringifiedChildren = String(props.children);

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

@@ -1 +1 @@
-{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport CreateNewRowButton from './components/Row/Editing/CreateRowButton';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n    return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n    return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const table3 = useTable3<TType>(props, ref);\n\n    const gridAttributes = {\n        'data-table-editing-mode': table3.meta.editing?.isEditing\n            ? table3.meta.editing?.isDetailedMode\n                ? 'detailed'\n                : 'normal'\n            : undefined,\n        enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n    };\n\n    const hasAlertErrors = table3.meta.editing.hasAlertErrors();\n    const showCreateRowButton = table3.meta.editing.isEnabled && props.onEditingCreate;\n\n    return (\n        <Table>\n            <Table.Toolbar<TType> table={table3}>\n                {table3.meta.editing.isEnabled ? (\n                    <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n                ) : null}\n            </Table.Toolbar>\n            {hasAlertErrors ? (\n                <Alert\n                    className=\"mb-4\"\n                    scrollToIndex={table3.renderer.scrollToIndex}\n                    table={table3.instance}\n                    tableRef={table3.ref}\n                />\n            ) : null}\n            <Table.Grid<TType> {...gridAttributes} data-taco=\"table3\" table={table3}>\n                {showCreateRowButton && (\n                    <CreateNewRowButton\n                        table={table3.instance}\n                        tableMeta={table3.meta}\n                        onEditingCreate={props.onEditingCreate}\n                        scrollToIndex={table3.renderer.scrollToIndex}\n                    />\n                )}\n            </Table.Grid>\n        </Table>\n    );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const stringifiedChildren = String(props.children);\n    // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n    // this is cheaper from a complexity perspective, and probably performance wise as well\n    const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n    return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n    Column: typeof Column;\n    Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n    Table3Props,\n    Table3Ref,\n    Table3ColumnProps,\n    Table3GroupProps,\n    Table3EditingSaveHandler,\n    Table3EditingValidatorFn,\n    Table3FeatureProps,\n    Table3Texts,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasAlertErrors","showCreateRowButton","isEnabled","onEditingCreate","React","Table","Toolbar","table","Editing","scrollToIndex","renderer","instance","Alert","className","tableRef","Grid","CreateNewRowButton","tableMeta","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":";;;;;;;;AAUA,SAASA,MAAMA,CAAkBC,CAA2B;EACxD,OAAO,IAAI;AACf;AACAD,MAAM,CAACE,WAAW,GAAG,cAAc;AAEnC,SAASC,KAAKA,CAACF,CAAmB;EAC9B,OAAO,IAAI;AACf;AACAE,KAAK,CAACD,WAAW,GAAG,aAAa;AAEjC,MAAME,UAAU,gBAAGC,eAAe,CAAC,SAASD,UAAUA,CAAkBE,KAAyB,EAAEC,GAAyB;;EACxH,MAAMC,MAAM,GAAGC,SAAS,CAAQH,KAAK,EAAEC,GAAG,CAAC;EAE3C,MAAMG,cAAc,GAAG;IACnB,yBAAyB,EAAE,CAAAC,oBAAA,GAAAH,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAF,oBAAA,eAAnBA,oBAAA,CAAqBG,SAAS,GACnD,CAAAC,qBAAA,GAAAP,MAAM,CAACI,IAAI,CAACC,OAAO,cAAAE,qBAAA,eAAnBA,qBAAA,CAAqBC,cAAc,GAC/B,UAAU,GACV,QAAQ,GACZC,SAAS;IACfC,kCAAkC,EAAEV,MAAM,CAACI,IAAI,CAACC,OAAO,CAACC;GAC3D;EAED,MAAMK,cAAc,GAAGX,MAAM,CAACI,IAAI,CAACC,OAAO,CAACM,cAAc,EAAE;EAC3D,MAAMC,mBAAmB,GAAGZ,MAAM,CAACI,IAAI,CAACC,OAAO,CAACQ,SAAS,IAAIf,KAAK,CAACgB,eAAe;EAElF,oBACIC,6BAACC,KAAK,qBACFD,6BAACC,KAAK,CAACC,OAAO;IAAQC,KAAK,EAAElB;KACxBA,MAAM,CAACI,IAAI,CAACC,OAAO,CAACQ,SAAS,iBAC1BE,6BAACI,OAAO;IAACC,aAAa,EAAEpB,MAAM,CAACqB,QAAQ,CAACD,aAAa;IAAEF,KAAK,EAAElB,MAAM,CAACsB;IAAY,IACjF,IAAI,CACI,EACfX,cAAc,iBACXI,6BAACQ,KAAK;IACFC,SAAS,EAAC,MAAM;IAChBJ,aAAa,EAAEpB,MAAM,CAACqB,QAAQ,CAACD,aAAa;IAC5CF,KAAK,EAAElB,MAAM,CAACsB,QAAQ;IACtBG,QAAQ,EAAEzB,MAAM,CAACD;IACnB,IACF,IAAI,eACRgB,6BAACC,KAAK,CAACU,IAAI,oBAAYxB,cAAc;iBAAY,QAAQ;IAACgB,KAAK,EAAElB;MAC5DY,mBAAmB,kBAChBG,6BAACY,kBAAkB;IACfT,KAAK,EAAElB,MAAM,CAACsB,QAAQ;IACtBM,SAAS,EAAE5B,MAAM,CAACI,IAAI;IACtBU,eAAe,EAAEhB,KAAK,CAACgB,eAAe;IACtCM,aAAa,EAAEpB,MAAM,CAACqB,QAAQ,CAACD;IACjC,CACL,CACQ,CACT;AAEhB,CAAC,CAAC;MAEWS,MAAM,gBAAGhC,eAAe,CAAC,SAASgC,MAAMA,CAAkB/B,KAAyB,EAAEC,GAAyB;EACvH,MAAM+B,mBAAmB,GAAGC,MAAM,CAACjC,KAAK,CAACkC,QAAQ,CAAC;;;EAGlD,MAAMC,GAAG,GAAGlB,cAAK,CAACmB,OAAO,CAAC,MAAMH,MAAM,CAAC,WAAW,GAAGD,mBAAmB,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EACjG,oBAAOf,6BAACnB,UAAU,oBAAYE,KAAK;IAAEmC,GAAG,EAAEA,GAAG;IAAElC,GAAG,EAAEA;KAAO;AAC/D,CAAC;AAID8B,MAAM,CAACrC,MAAM,GAAGA,MAAM;AACtBqC,MAAM,CAAClC,KAAK,GAAGA,KAAK;;;;"}
+{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport { CreateNewRow } from './components/Row/Editing/CreateNewRow';\nimport { TemporaryRow } from './components/Row/Editing/TemporaryRow';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n    return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n    return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const table3 = useTable3<TType>(props, ref);\n\n    const gridAttributes = {\n        'data-table-editing-mode': table3.meta.editing?.isEditing\n            ? table3.meta.editing?.isDetailedMode\n                ? 'detailed'\n                : 'normal'\n            : undefined,\n        enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n    };\n\n    const hasAlertErrors = table3.meta.editing.getErrorsShownInAlert().length;\n    const hasCreateWorkflow = table3.meta.editing.isEnabled && props.onEditingCreate;\n\n    return (\n        <Table>\n            <Table.Toolbar<TType> table={table3}>\n                {table3.meta.editing.isEnabled ? (\n                    <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n                ) : null}\n            </Table.Toolbar>\n            {hasAlertErrors ? (\n                <Alert\n                    className=\"mb-4\"\n                    scrollToIndex={table3.renderer.scrollToIndex}\n                    table={table3.instance}\n                    tableRef={table3.ref}\n                />\n            ) : null}\n            <Table.Grid<TType> {...gridAttributes} data-taco=\"table3\" table={table3}>\n                {hasCreateWorkflow ? (\n                    <>\n                        <TemporaryRow\n                            createRowButtonRef={table3.meta.editing.createRowButtonRef}\n                            table={table3.instance}\n                            tableMeta={table3.meta}\n                            tableRef={table3.ref}\n                        />\n                        <CreateNewRow\n                            buttonRef={table3.meta.editing.createRowButtonRef}\n                            onEditingCreate={props.onEditingCreate}\n                            scrollToIndex={table3.renderer.scrollToIndex}\n                            table={table3.instance}\n                            tableMeta={table3.meta}\n                            tableRef={table3.ref}\n                        />\n                    </>\n                ) : null}\n            </Table.Grid>\n        </Table>\n    );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const stringifiedChildren = String(props.children);\n    // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n    // this is cheaper from a complexity perspective, and probably performance wise as well\n    const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n    return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n    Column: typeof Column;\n    Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n    Table3Ref,\n    Table3Props,\n    Table3ColumnProps,\n    Table3GroupProps,\n    Table3EditingSaveHandler,\n    Table3EditingValidatorFn,\n    Table3Texts,\n    Table3FeatureProps,\n    Table3CommonProps,\n    Table3WithoutEditingWithClientProps,\n    Table3WithoutEditingWithServerProps,\n    Table3WithEditingProps,\n    Table3WithEditingWithClientProps,\n    Table3WithEditingWithServerProps,\n    Table3EditingChangeHandler,\n    Table3EditingCreateHandler,\n} from './types';\n"],"names":["Column","_","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasAlertErrors","getErrorsShownInAlert","length","hasCreateWorkflow","isEnabled","onEditingCreate","React","Table","Toolbar","table","Editing","scrollToIndex","renderer","instance","Alert","className","tableRef","Grid","TemporaryRow","createRowButtonRef","tableMeta","CreateNewRow","buttonRef","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js

@@ -43,7 +43,6 @@ function RowMoveIndicator(props) {
   if (!show) {
     return null;
   }
-  const className = 'wcag-blue-500 absolute left-0 top-full ml-1 whitespace-nowrap rounded-b-md px-1 py-1 text-xs font-bold z-10';
   const {
     title,
     description
@@ -52,7 +51,7 @@ function RowMoveIndicator(props) {
     placement: "bottom",
     title: description.replace('[COLUMN]', columnMeta.header)
   }, /*#__PURE__*/React__default.createElement("span", {
-    className: className
+    "data-row-move-indicator": true
   }, /*#__PURE__*/React__default.createElement(Icon, {
     name: "info",
     className: "-mt-0.5 mr-1 !h-4 !w-4 rounded-full bg-white !p-0 text-blue-500"

package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowMoveIndicator.js","sources":["../../../../../../../../../../../src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport { Cell as ReactTableCell, TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { Tooltip } from '../../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { Icon } from '../../../../../Icon/Icon';\n\ntype TableRowMoveIndicatorProps<TType = unknown> = {\n    cell: ReactTableCell<TType, unknown>;\n    cellRef: React.RefObject<HTMLTableCellElement>;\n    isActiveRow: boolean;\n};\n\nexport function RowMoveIndicator<TType = unknown>(props: TableRowMoveIndicatorProps<TType>) {\n    const { cell, cellRef, isActiveRow } = props;\n    const { texts } = useLocalization();\n    const [show, setShow] = React.useState(false);\n    const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n    const columnMeta = (cell.column.columnDef.meta ?? {}) as ReactTableColumnMeta<TType, unknown>;\n    const moveReason = tableMeta.editing.getRowMoveReason(cell.row.id);\n\n    React.useEffect(() => {\n        if (cellRef.current) {\n            if (isActiveRow && !!moveReason) {\n                const firstChild = cellRef.current.parentElement?.querySelector(`td[data-taco=\"cell-control\"]`);\n\n                if (cellRef.current === firstChild) {\n                    setShow(true);\n                    cellRef.current.parentElement?.setAttribute('data-row-editing-move', 'true');\n                }\n            } else {\n                setShow(false);\n                cellRef.current.parentElement?.removeAttribute('data-row-editing-move');\n            }\n        }\n\n        return () => {\n            if (cellRef.current) {\n                cellRef.current.parentElement?.removeAttribute('data-row-editing-move');\n            }\n        };\n    }, [cellRef, isActiveRow, moveReason]);\n\n    if (!show) {\n        return null;\n    }\n\n    const className =\n        'wcag-blue-500 absolute left-0 top-full ml-1 whitespace-nowrap rounded-b-md px-1 py-1 text-xs font-bold z-10';\n\n    const { title, description } = getMessageFromReason(texts, moveReason);\n\n    return (\n        <Tooltip placement=\"bottom\" title={description.replace('[COLUMN]', columnMeta.header)}>\n            <span className={className}>\n                <Icon name=\"info\" className=\"-mt-0.5 mr-1 !h-4 !w-4 rounded-full bg-white !p-0 text-blue-500\" />\n                {title}\n            </span>\n        </Tooltip>\n    );\n}\n\nfunction getMessageFromReason(texts, reason) {\n    let title = '';\n    let description = '';\n\n    switch (reason) {\n        case 'filter':\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonFilter;\n            break;\n\n        case 'search':\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSearch;\n            break;\n\n        case 'sorting':\n            title = texts.table3.editing.rowIndicator.rowWillMove;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSorting;\n            break;\n    }\n\n    return { title, description };\n}\n"],"names":["RowMoveIndicator","props","cell","cellRef","isActiveRow","texts","useLocalization","show","setShow","React","useState","tableMeta","getContext","table","options","meta","columnMeta","_cell$column$columnDe","column","columnDef","moveReason","editing","getRowMoveReason","row","id","useEffect","current","_cellRef$current$pare","firstChild","parentElement","querySelector","_cellRef$current$pare2","setAttribute","_cellRef$current$pare3","removeAttribute","_cellRef$current$pare4","className","title","description","getMessageFromReason","Tooltip","placement","replace","header","Icon","name","reason","table3","rowIndicator","rowWillBeHidden","rowWillMoveReasonFilter","rowWillMoveReasonSearch","rowWillMove","rowWillMoveReasonSorting"],"mappings":"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"}
+{"version":3,"file":"RowMoveIndicator.js","sources":["../../../../../../../../../../../src/components/Table3/components/Columns/Cell/Editing/RowMoveIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport { Cell as ReactTableCell, TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { Tooltip } from '../../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { Icon } from '../../../../../Icon/Icon';\n\ntype TableRowMoveIndicatorProps<TType = unknown> = {\n    cell: ReactTableCell<TType, unknown>;\n    cellRef: React.RefObject<HTMLTableCellElement>;\n    isActiveRow: boolean;\n};\n\nexport function RowMoveIndicator<TType = unknown>(props: TableRowMoveIndicatorProps<TType>) {\n    const { cell, cellRef, isActiveRow } = props;\n    const { texts } = useLocalization();\n    const [show, setShow] = React.useState(false);\n    const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n    const columnMeta = (cell.column.columnDef.meta ?? {}) as ReactTableColumnMeta<TType, unknown>;\n    const moveReason = tableMeta.editing.getRowMoveReason(cell.row.id);\n\n    React.useEffect(() => {\n        if (cellRef.current) {\n            if (isActiveRow && !!moveReason) {\n                const firstChild = cellRef.current.parentElement?.querySelector(`td[data-taco=\"cell-control\"]`);\n\n                if (cellRef.current === firstChild) {\n                    setShow(true);\n                    cellRef.current.parentElement?.setAttribute('data-row-editing-move', 'true');\n                }\n            } else {\n                setShow(false);\n                cellRef.current.parentElement?.removeAttribute('data-row-editing-move');\n            }\n        }\n\n        return () => {\n            if (cellRef.current) {\n                cellRef.current.parentElement?.removeAttribute('data-row-editing-move');\n            }\n        };\n    }, [cellRef, isActiveRow, moveReason]);\n\n    if (!show) {\n        return null;\n    }\n\n    const { title, description } = getMessageFromReason(texts, moveReason);\n\n    return (\n        <Tooltip placement=\"bottom\" title={description.replace('[COLUMN]', columnMeta.header)}>\n            <span data-row-move-indicator>\n                <Icon name=\"info\" className=\"-mt-0.5 mr-1 !h-4 !w-4 rounded-full bg-white !p-0 text-blue-500\" />\n                {title}\n            </span>\n        </Tooltip>\n    );\n}\n\nfunction getMessageFromReason(texts, reason) {\n    let title = '';\n    let description = '';\n\n    switch (reason) {\n        case 'filter':\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonFilter;\n            break;\n\n        case 'search':\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSearch;\n            break;\n\n        case 'sorting':\n            title = texts.table3.editing.rowIndicator.rowWillMove;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSorting;\n            break;\n    }\n\n    return { title, description };\n}\n"],"names":["RowMoveIndicator","props","cell","cellRef","isActiveRow","texts","useLocalization","show","setShow","React","useState","tableMeta","getContext","table","options","meta","columnMeta","_cell$column$columnDe","column","columnDef","moveReason","editing","getRowMoveReason","row","id","useEffect","current","_cellRef$current$pare","firstChild","parentElement","querySelector","_cellRef$current$pare2","setAttribute","_cellRef$current$pare3","removeAttribute","_cellRef$current$pare4","title","description","getMessageFromReason","Tooltip","placement","replace","header","Icon","name","className","reason","table3","rowIndicator","rowWillBeHidden","rowWillMoveReasonFilter","rowWillMoveReasonSearch","rowWillMove","rowWillMoveReasonSorting"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js

@@ -25,13 +25,31 @@ function EditingControlCell(props) {
   const {
     rowIndex
   } = React__default.useContext(RowContext);
-  const tableMeta = cell.getContext().table.options.meta;
+  const {
+    table
+  } = cell.getContext();
+  const tableMeta = table.options.meta;
   const columnMeta = cell.column.columnDef.meta;
   const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;
+  const type = (_columnMeta$control = columnMeta.control) !== null && _columnMeta$control !== void 0 ? _columnMeta$control : 'input';
   const handleFocus = useEditingCellAutofocus(props);
+  const value = cell.getValue();
+  // some controls, like select2, should trigger cell changed (validation, updates) as the value changes
+  const hasNonTextControl = React__default.useMemo(() => {
+    var _cellRef$current;
+    return typeof type === 'function' && !!((_cellRef$current = cellRef.current) !== null && _cellRef$current !== void 0 && _cellRef$current.querySelector('[data-taco="Select2"],[data-taco="switch"],[data-taco="checkbox"]'));
+  }, [cellRef.current]);
+  const handleChange = nextValue => {
+    if (nextValue !== value) {
+      tableMeta.editing.setCellValue(cell, nextValue);
+      if (hasNonTextControl) {
+        tableMeta.editing.onCellChanged(cell, rowIndex);
+      }
+    }
+  };
   const handleBlur = () => {
     tableMeta.editing.toggleDetailedMode(false);
-    tableMeta.editing.validateCell(cell);
+    tableMeta.editing.onCellChanged(cell, rowIndex, !hasNonTextControl);
   };
   // ensure that blur runs when the cell gets unmounted (when vertically arrow key navigating)
   React__default.useEffect(() => {
@@ -51,14 +69,13 @@ function EditingControlCell(props) {
     isDetailedMode: tableMeta.editing.isDetailedMode,
     isTruncated: !!columnMeta.enableTruncate,
     onBlur: handleBlur,
-    onChange: value => tableMeta.editing.setCellValue(cell, value, rowIndex),
+    onChange: handleChange,
     row: cell.row.original,
-    rowPendingChanges: tableMeta.editing.getRowPendingChange(cell.row.id),
+    rowPendingChanges: tableMeta.editing.getRowValue(cell.row.id),
     tabIndex: isActiveRow ? 0 : -1,
-    toggleEditing: tableMeta.editing.toggleEditing,
     toggleDetailedMode: tableMeta.editing.toggleDetailedMode,
-    type: (_columnMeta$control = columnMeta.control) !== null && _columnMeta$control !== void 0 ? _columnMeta$control : 'input',
-    value: cell.getValue()
+    type,
+    value
   };
   const cellAttributes = {
     ...getCellAttributes(cell, index, isHighlighted),
@@ -90,7 +107,6 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
     row,
     rowPendingChanges,
     tabIndex = -1,
-    toggleEditing,
     toggleDetailedMode,
     type = 'input',
     value
@@ -156,8 +172,8 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
     }
     // reset the value, or exit edit mode when pressing escape
     if (event.key === 'Escape') {
-      event.preventDefault();
       if (isDetailedMode) {
+        event.preventDefault();
         toggleDetailedMode(false);
         if (value !== currentValue) {
           props.onChange(currentValue);
@@ -167,8 +183,6 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
           var _target$select2;
           return (_target$select2 = target.select) === null || _target$select2 === void 0 ? void 0 : _target$select2.call(target);
         });
-      } else {
-        toggleEditing(false);
       }
       return;
     }

package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditingControlCell.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Cell/EditingControlCell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { isDate } from 'date-fns';\nimport { Datepicker } from '../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../Switch/Switch';\nimport { Input } from '../../../../Input/Input';\nimport { TableColumnDataType, TableColumnRendererControl, TableFontSize } from '../../../../../primitives/Table/types';\nimport * as date from '../../../../../utils/date';\nimport { RowMoveIndicator } from './Editing/RowMoveIndicator';\nimport { TextareaWithAutosizing } from './Editing/TextareaWithAutosizing';\nimport { Field } from '../../../../Field/Field';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../../../utils/dom';\nimport { TableCellRendererProps } from '../../../../../primitives/Table/Core/types';\nimport { RowContext } from '../../../../../primitives/Table/Core/components/Row/RowContext';\nimport { getCellAttributes } from '../../../../../primitives/Table/Core/components/Columns/Cell/util';\nimport { useEditingCellAutofocus } from './util';\nimport { isPressingMetaKey } from '../../../../../utils/keyboard';\nimport { Checkbox } from '../../../../Checkbox/Checkbox';\n\nexport function EditingControlCell<TType = unknown>(props: TableCellRendererProps<TType>) {\n    const { cell, cellRef, isHighlighted, index } = props;\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n    const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n    const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n\n    const handleFocus = useEditingCellAutofocus<TType>(props);\n\n    const handleBlur = () => {\n        tableMeta.editing.toggleDetailedMode(false);\n        tableMeta.editing.validateCell(cell);\n    };\n\n    // ensure that blur runs when the cell gets unmounted (when vertically arrow key navigating)\n    React.useEffect(() => {\n        const ref = cellRef.current;\n\n        return () => {\n            if (document.activeElement === ref || isElementInsideOrTriggeredFromContainer(document.activeElement, ref)) {\n                handleBlur();\n            }\n        };\n    }, []);\n\n    const error = tableMeta.editing.getCellError<TType>(cell);\n\n    const controlProps = {\n        dataType: columnMeta.dataType,\n        fontSize: tableMeta.fontSize.size,\n        id: cell.column.id,\n        invalid: !!error,\n        isDetailedMode: tableMeta.editing.isDetailedMode,\n        isTruncated: !!columnMeta.enableTruncate,\n        onBlur: handleBlur,\n        onChange: (value: unknown) => tableMeta.editing.setCellValue(cell, value, rowIndex),\n        row: cell.row.original,\n        rowPendingChanges: tableMeta.editing.getRowPendingChange(cell.row.id),\n        tabIndex: isActiveRow ? 0 : -1,\n        toggleEditing: tableMeta.editing.toggleEditing,\n        toggleDetailedMode: tableMeta.editing.toggleDetailedMode,\n        type: columnMeta.control ?? 'input',\n        value: cell.getValue(),\n    };\n\n    const cellAttributes = {\n        ...getCellAttributes(cell, index, isHighlighted),\n        'data-cell-editing-invalid': error ? true : undefined,\n        'data-taco': 'cell-control',\n        onFocus: handleFocus,\n        ref: cellRef,\n        tabIndex: -1,\n    };\n\n    return (\n        <td {...cellAttributes}>\n            <Field invalid={!!error} message={error}>\n                <MemoedEditingCell<TType> {...controlProps} />\n            </Field>\n            {\n                // we show row move indicator here within the cell rather than the row because it is\n                // an editing only feature, and we don't want to leak editing into the shared row component\n            }\n            <RowMoveIndicator cell={cell} cellRef={cellRef} isActiveRow={isActiveRow} />\n        </td>\n    );\n}\n\ntype MemoedEditingCellProps<TType = unknown, TValue = unknown> = {\n    dataType?: TableColumnDataType;\n    fontSize: TableFontSize;\n    id: string;\n    invalid: boolean;\n    isDetailedMode: boolean;\n    isTruncated: boolean;\n    onBlur: () => void;\n    onChange: (value: TValue) => void;\n    row: TType;\n    rowPendingChanges: Partial<TType> | undefined;\n    tabIndex?: number;\n    toggleEditing: (editing: React.SetStateAction<boolean>) => void;\n    toggleDetailedMode: (detailed: React.SetStateAction<boolean>) => void;\n    type: TableColumnRendererControl<TType>;\n    value: TValue;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n    const {\n        dataType,\n        fontSize,\n        id,\n        invalid,\n        isDetailedMode,\n        isTruncated,\n        onBlur,\n        onChange,\n        row,\n        rowPendingChanges,\n        tabIndex = -1,\n        toggleEditing,\n        toggleDetailedMode,\n        type = 'input',\n        value,\n    } = props;\n    const controlRef = React.useRef<HTMLElement>(null);\n    const currentValue = row[id];\n    const commonProps = {\n        onBlur,\n        ref: controlRef,\n        tabIndex,\n    };\n\n    if (typeof type === 'function') {\n        const controlFnProps = {\n            ...commonProps,\n            invalid,\n            setValue: onChange,\n            value,\n        };\n\n        return type(controlFnProps, { ...row, ...rowPendingChanges });\n    }\n\n    if (type === 'switch') {\n        return (\n            <Switch\n                {...commonProps}\n                checked={Boolean(value)}\n                onChange={onChange}\n                ref={controlRef as React.RefObject<HTMLButtonElement>}\n            />\n        );\n    }\n\n    if (type === 'checkbox') {\n        return (\n            <Checkbox\n                {...commonProps}\n                checked={Boolean(value)}\n                onChange={onChange}\n                ref={controlRef as React.RefObject<HTMLButtonElement>}\n            />\n        );\n    }\n\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n        const target = event.target as HTMLInputElement | HTMLTextAreaElement;\n\n        if (target.readOnly) {\n            return;\n        }\n\n        // prevent active row navigation while in detailed mode\n        if (\n            isDetailedMode &&\n            (event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === 'ArrowLeft' || event.key === 'ArrowRight')\n        ) {\n            event.stopPropagation();\n        }\n\n        // enter or exit detail mode when pressing enter\n        if (event.key === 'Enter') {\n            // textareas support shift and enter, don't prevent default in that case\n            if (event.shiftKey && isDetailedMode) {\n                return;\n            }\n\n            event.preventDefault();\n\n            if (isDetailedMode) {\n                target.select?.();\n            } else {\n                target.setSelectionRange?.(target.value?.length, target.value?.length);\n            }\n\n            toggleDetailedMode(editing => !editing);\n            return;\n        }\n\n        // reset the value, or exit edit mode when pressing escape\n        if (event.key === 'Escape') {\n            event.preventDefault();\n\n            if (isDetailedMode) {\n                toggleDetailedMode(false);\n\n                if (value !== currentValue) {\n                    props.onChange(currentValue);\n                }\n\n                // have to let onChange run before selecting, otherwise the value changes\n                requestAnimationFrame(() => target.select?.());\n            } else {\n                toggleEditing(false);\n            }\n\n            return;\n        }\n\n        // toggle into detailed mode when actually inputting something\n        if (!isPressingMetaKey(event) && (/^[a-z0-9]$/i.test(event.key) || event.key === 'Backspace')) {\n            toggleDetailedMode(true);\n        }\n    };\n\n    const handleFocus = (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n        if (!isDetailedMode) {\n            event.target.select();\n        }\n    };\n\n    if (type === 'datepicker') {\n        const valueAsDate = date.parse(value as Date | string | undefined);\n\n        const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n            const newDate = (event as any).detail as Date;\n\n            if (!valueAsDate || !newDate || (isDate(valueAsDate) && isDate(newDate) && !date.isWeakEqual(valueAsDate, newDate))) {\n                props.onChange(newDate);\n            }\n        };\n\n        return (\n            <Datepicker\n                {...commonProps}\n                invalid={invalid}\n                onChange={handleChange}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={controlRef as React.RefObject<HTMLInputElement>}\n                value={valueAsDate}\n            />\n        );\n    }\n\n    if (type === 'textarea') {\n        const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n            onChange(event.target.value);\n        };\n\n        return (\n            <TextareaWithAutosizing\n                {...commonProps}\n                fontSize={fontSize}\n                invalid={invalid}\n                isTruncated={isTruncated}\n                onChange={handleChange}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={controlRef as React.RefObject<HTMLTextAreaElement>}\n                value={String(value ?? '')}\n            />\n        );\n    }\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        onChange(dataType === 'number' && event.target.value ? Number.parseInt(event.target.value) : event.target.value);\n    };\n\n    return (\n        <Input\n            {...commonProps}\n            invalid={invalid}\n            onChange={handleChange}\n            onFocus={handleFocus}\n            onKeyDown={handleInputKeyDown}\n            ref={controlRef as React.RefObject<HTMLInputElement>}\n            type={dataType === 'number' ? 'number' : undefined}\n            value={dataType === 'number' ? (value as number) : String(value ?? '')}\n        />\n    );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n"],"names":["EditingControlCell","props","cell","cellRef","isHighlighted","index","rowIndex","React","useContext","RowContext","tableMeta","getContext","table","options","meta","columnMeta","column","columnDef","isActiveRow","rowActive","rowActiveIndex","handleFocus","useEditingCellAutofocus","handleBlur","editing","toggleDetailedMode","validateCell","useEffect","ref","current","document","activeElement","isElementInsideOrTriggeredFromContainer","error","getCellError","controlProps","dataType","fontSize","size","id","invalid","isDetailedMode","isTruncated","enableTruncate","onBlur","onChange","value","setCellValue","row","original","rowPendingChanges","getRowPendingChange","tabIndex","toggleEditing","type","_columnMeta$control","control","getValue","cellAttributes","getCellAttributes","undefined","onFocus","Field","message","MemoedEditingCell","RowMoveIndicator","memo","controlRef","useRef","currentValue","commonProps","controlFnProps","setValue","Switch","checked","Boolean","Checkbox","handleInputKeyDown","event","target","readOnly","key","stopPropagation","shiftKey","preventDefault","_target$select","select","call","_target$setSelectionR","_target$value","_target$value2","setSelectionRange","length","requestAnimationFrame","_target$select2","isPressingMetaKey","test","valueAsDate","date","handleChange","newDate","detail","isDate","Datepicker","onKeyDown","TextareaWithAutosizing","String","Number","parseInt","Input"],"mappings":"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"}
+{"version":3,"file":"EditingControlCell.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Cell/EditingControlCell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { isDate } from 'date-fns';\nimport { Datepicker } from '../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../Switch/Switch';\nimport { Input } from '../../../../Input/Input';\nimport { TableColumnDataType, TableColumnRendererControl, TableFontSize } from '../../../../../primitives/Table/types';\nimport * as date from '../../../../../utils/date';\nimport { RowMoveIndicator } from './Editing/RowMoveIndicator';\nimport { TextareaWithAutosizing } from './Editing/TextareaWithAutosizing';\nimport { Field } from '../../../../Field/Field';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../../../utils/dom';\nimport { TableCellRendererProps } from '../../../../../primitives/Table/Core/types';\nimport { RowContext } from '../../../../../primitives/Table/Core/components/Row/RowContext';\nimport { getCellAttributes } from '../../../../../primitives/Table/Core/components/Columns/Cell/util';\nimport { useEditingCellAutofocus } from './util';\nimport { isPressingMetaKey } from '../../../../../utils/keyboard';\nimport { Checkbox } from '../../../../Checkbox/Checkbox';\n\nexport function EditingControlCell<TType = unknown>(props: TableCellRendererProps<TType>) {\n    const { cell, cellRef, isHighlighted, index } = props;\n    const { rowIndex } = React.useContext(RowContext);\n    const { table } = cell.getContext();\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n    const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n    const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n    const type = columnMeta.control ?? 'input';\n    const handleFocus = useEditingCellAutofocus<TType>(props);\n    const value = cell.getValue();\n\n    // some controls, like select2, should trigger cell changed (validation, updates) as the value changes\n    const hasNonTextControl = React.useMemo(() => {\n        return (\n            typeof type === 'function' &&\n            !!cellRef.current?.querySelector('[data-taco=\"Select2\"],[data-taco=\"switch\"],[data-taco=\"checkbox\"]')\n        );\n    }, [cellRef.current]);\n\n    const handleChange = (nextValue: unknown) => {\n        if (nextValue !== value) {\n            tableMeta.editing.setCellValue(cell, nextValue);\n\n            if (hasNonTextControl) {\n                tableMeta.editing.onCellChanged(cell, rowIndex);\n            }\n        }\n    };\n\n    const handleBlur = () => {\n        tableMeta.editing.toggleDetailedMode(false);\n        tableMeta.editing.onCellChanged(cell, rowIndex, !hasNonTextControl);\n    };\n\n    // ensure that blur runs when the cell gets unmounted (when vertically arrow key navigating)\n    React.useEffect(() => {\n        const ref = cellRef.current;\n\n        return () => {\n            if (document.activeElement === ref || isElementInsideOrTriggeredFromContainer(document.activeElement, ref)) {\n                handleBlur();\n            }\n        };\n    }, []);\n\n    const error = tableMeta.editing.getCellError<TType>(cell);\n\n    const controlProps = {\n        dataType: columnMeta.dataType,\n        fontSize: tableMeta.fontSize.size,\n        id: cell.column.id,\n        invalid: !!error,\n        isDetailedMode: tableMeta.editing.isDetailedMode,\n        isTruncated: !!columnMeta.enableTruncate,\n        onBlur: handleBlur,\n        onChange: handleChange,\n        row: cell.row.original,\n        rowPendingChanges: tableMeta.editing.getRowValue(cell.row.id),\n        tabIndex: isActiveRow ? 0 : -1,\n        toggleDetailedMode: tableMeta.editing.toggleDetailedMode,\n        type,\n        value,\n    };\n\n    const cellAttributes = {\n        ...getCellAttributes(cell, index, isHighlighted),\n        'data-cell-editing-invalid': error ? true : undefined,\n        'data-taco': 'cell-control',\n        onFocus: handleFocus,\n        ref: cellRef,\n        tabIndex: -1,\n    };\n\n    return (\n        <td {...cellAttributes}>\n            <Field invalid={!!error} message={error}>\n                <MemoedEditingCell<TType> {...controlProps} />\n            </Field>\n            {\n                // we show row move indicator here within the cell rather than the row because it is\n                // an editing only feature, and we don't want to leak editing into the shared row component\n            }\n            <RowMoveIndicator cell={cell} cellRef={cellRef} isActiveRow={isActiveRow} />\n        </td>\n    );\n}\n\ntype MemoedEditingCellProps<TType = unknown, TValue = unknown> = {\n    dataType?: TableColumnDataType;\n    fontSize: TableFontSize;\n    id: string;\n    invalid: boolean;\n    isDetailedMode: boolean;\n    isTruncated: boolean;\n    onBlur: () => void;\n    onChange: (value: TValue) => void;\n    row: TType;\n    rowPendingChanges: Partial<TType> | undefined;\n    tabIndex?: number;\n    toggleDetailedMode: (detailed: React.SetStateAction<boolean>) => void;\n    type: TableColumnRendererControl<TType>;\n    value: TValue;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n    const {\n        dataType,\n        fontSize,\n        id,\n        invalid,\n        isDetailedMode,\n        isTruncated,\n        onBlur,\n        onChange,\n        row,\n        rowPendingChanges,\n        tabIndex = -1,\n        toggleDetailedMode,\n        type = 'input',\n        value,\n    } = props;\n    const controlRef = React.useRef<HTMLElement>(null);\n    const currentValue = row[id];\n    const commonProps = {\n        onBlur,\n        ref: controlRef,\n        tabIndex,\n    };\n\n    if (typeof type === 'function') {\n        const controlFnProps = {\n            ...commonProps,\n            invalid,\n            setValue: onChange,\n            value,\n        };\n\n        return type(controlFnProps, { ...row, ...rowPendingChanges });\n    }\n\n    if (type === 'switch') {\n        return (\n            <Switch\n                {...commonProps}\n                checked={Boolean(value)}\n                onChange={onChange}\n                ref={controlRef as React.RefObject<HTMLButtonElement>}\n            />\n        );\n    }\n\n    if (type === 'checkbox') {\n        return (\n            <Checkbox\n                {...commonProps}\n                checked={Boolean(value)}\n                onChange={onChange}\n                ref={controlRef as React.RefObject<HTMLButtonElement>}\n            />\n        );\n    }\n\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n        const target = event.target as HTMLInputElement | HTMLTextAreaElement;\n\n        if (target.readOnly) {\n            return;\n        }\n\n        // prevent active row navigation while in detailed mode\n        if (\n            isDetailedMode &&\n            (event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === 'ArrowLeft' || event.key === 'ArrowRight')\n        ) {\n            event.stopPropagation();\n        }\n\n        // enter or exit detail mode when pressing enter\n        if (event.key === 'Enter') {\n            // textareas support shift and enter, don't prevent default in that case\n            if (event.shiftKey && isDetailedMode) {\n                return;\n            }\n\n            event.preventDefault();\n\n            if (isDetailedMode) {\n                target.select?.();\n            } else {\n                target.setSelectionRange?.(target.value?.length, target.value?.length);\n            }\n\n            toggleDetailedMode(editing => !editing);\n            return;\n        }\n\n        // reset the value, or exit edit mode when pressing escape\n        if (event.key === 'Escape') {\n            if (isDetailedMode) {\n                event.preventDefault();\n                toggleDetailedMode(false);\n\n                if (value !== currentValue) {\n                    props.onChange(currentValue);\n                }\n\n                // have to let onChange run before selecting, otherwise the value changes\n                requestAnimationFrame(() => target.select?.());\n            }\n\n            return;\n        }\n\n        // toggle into detailed mode when actually inputting something\n        if (!isPressingMetaKey(event) && (/^[a-z0-9]$/i.test(event.key) || event.key === 'Backspace')) {\n            toggleDetailedMode(true);\n        }\n    };\n\n    const handleFocus = (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n        if (!isDetailedMode) {\n            event.target.select();\n        }\n    };\n\n    if (type === 'datepicker') {\n        const valueAsDate = date.parse(value as Date | string | undefined);\n\n        const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n            const newDate = (event as any).detail as Date;\n\n            if (!valueAsDate || !newDate || (isDate(valueAsDate) && isDate(newDate) && !date.isWeakEqual(valueAsDate, newDate))) {\n                props.onChange(newDate);\n            }\n        };\n\n        return (\n            <Datepicker\n                {...commonProps}\n                invalid={invalid}\n                onChange={handleChange}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={controlRef as React.RefObject<HTMLInputElement>}\n                value={valueAsDate}\n            />\n        );\n    }\n\n    if (type === 'textarea') {\n        const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n            onChange(event.target.value);\n        };\n\n        return (\n            <TextareaWithAutosizing\n                {...commonProps}\n                fontSize={fontSize}\n                invalid={invalid}\n                isTruncated={isTruncated}\n                onChange={handleChange}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={controlRef as React.RefObject<HTMLTextAreaElement>}\n                value={String(value ?? '')}\n            />\n        );\n    }\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        onChange(dataType === 'number' && event.target.value ? Number.parseInt(event.target.value) : event.target.value);\n    };\n\n    return (\n        <Input\n            {...commonProps}\n            invalid={invalid}\n            onChange={handleChange}\n            onFocus={handleFocus}\n            onKeyDown={handleInputKeyDown}\n            ref={controlRef as React.RefObject<HTMLInputElement>}\n            type={dataType === 'number' ? 'number' : undefined}\n            value={dataType === 'number' ? (value as number) : String(value ?? '')}\n        />\n    );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n"],"names":["EditingControlCell","props","cell","cellRef","isHighlighted","index","rowIndex","React","useContext","RowContext","table","getContext","tableMeta","options","meta","columnMeta","column","columnDef","isActiveRow","rowActive","rowActiveIndex","type","_columnMeta$control","control","handleFocus","useEditingCellAutofocus","value","getValue","hasNonTextControl","useMemo","_cellRef$current","current","querySelector","handleChange","nextValue","editing","setCellValue","onCellChanged","handleBlur","toggleDetailedMode","useEffect","ref","document","activeElement","isElementInsideOrTriggeredFromContainer","error","getCellError","controlProps","dataType","fontSize","size","id","invalid","isDetailedMode","isTruncated","enableTruncate","onBlur","onChange","row","original","rowPendingChanges","getRowValue","tabIndex","cellAttributes","getCellAttributes","undefined","onFocus","Field","message","MemoedEditingCell","RowMoveIndicator","memo","controlRef","useRef","currentValue","commonProps","controlFnProps","setValue","Switch","checked","Boolean","Checkbox","handleInputKeyDown","event","target","readOnly","key","stopPropagation","shiftKey","preventDefault","_target$select","select","call","_target$setSelectionR","_target$value","_target$value2","setSelectionRange","length","requestAnimationFrame","_target$select2","isPressingMetaKey","test","valueAsDate","date","newDate","detail","isDate","Datepicker","onKeyDown","TextareaWithAutosizing","String","Number","parseInt","Input"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/Columns/Internal/EditingActionsMenu.js

@@ -1,17 +1,14 @@
 import React__default from 'react';
 import { IconButton } from '../../../../IconButton/IconButton.js';
 import { useLocalization } from '../../../../Provider/Localization.js';
-import { Button } from '../../../../Button/Button.js';
-import { Dialog } from '../../../../Dialog/Dialog.js';
-import { Group } from '../../../../Group/Group.js';
 import { Menu } from '../../../../Menu/Menu.js';
+import { DiscardChangesConfirmationDialog } from '../../Editing/DiscardChangesConfirmationDialog.js';
 
 function EditingActionMenu(props) {
   const {
     hasChanges,
     hasErrors,
-    onClear: handleClear,
-    onExit: handleExit,
+    onDiscard: handleDiscard,
     onEditingSave: handleSave,
     isLastRow
   } = props;
@@ -33,7 +30,6 @@ function EditingActionMenu(props) {
   return /*#__PURE__*/React__default.createElement(IconButton, {
     appearance: "transparent",
     "aria-label": texts.table3.editing.actions.tooltip,
-    className: "group-[[data-row-editing-status]]/row:hidden",
     icon: "more",
     onKeyDown: handleKeyDown,
     menu: menuProps => (/*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, {
@@ -45,40 +41,12 @@ function EditingActionMenu(props) {
     }, texts.table3.editing.actions.save), /*#__PURE__*/React__default.createElement(Menu.Item, {
       icon: "close",
       disabled: !hasChanges,
-      dialog: props => /*#__PURE__*/React__default.createElement(ConfirmClearChangesDialog, Object.assign({}, props, {
-        onClear: handleClear
+      dialog: props => /*#__PURE__*/React__default.createElement(DiscardChangesConfirmationDialog, Object.assign({}, props, {
+        onDiscard: handleDiscard
       }))
-    }, texts.table3.editing.actions.clear), /*#__PURE__*/React__default.createElement(Menu.Item, {
-      icon: "undo",
-      onClick: handleExit
-    }, texts.table3.editing.actions.exit))))
+    }, texts.table3.editing.actions.clear))))
   });
 }
-function ConfirmClearChangesDialog(props) {
-  const {
-    onClear: handleClear,
-    ...dialogProps
-  } = props;
-  const {
-    texts
-  } = useLocalization();
-  const handleClickInsideDialogContent = event => {
-    // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs
-    // inside the dialog
-    event.stopPropagation();
-  };
-  return /*#__PURE__*/React__default.createElement(Dialog, Object.assign({}, dialogProps), /*#__PURE__*/React__default.createElement(Dialog.Content, {
-    "aria-label": texts.table3.editing.clearChangesConfirmationDialog.title,
-    onClick: handleClickInsideDialogContent
-  }, /*#__PURE__*/React__default.createElement(Dialog.Title, null, texts.table3.editing.clearChangesConfirmationDialog.title), /*#__PURE__*/React__default.createElement("p", null, texts.table3.editing.clearChangesConfirmationDialog.description), /*#__PURE__*/React__default.createElement(Dialog.Footer, null, /*#__PURE__*/React__default.createElement(Group, null, /*#__PURE__*/React__default.createElement(Dialog.Close, null, /*#__PURE__*/React__default.createElement(Button, {
-    tabIndex: 0
-  }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /*#__PURE__*/React__default.createElement(Dialog.Close, null, /*#__PURE__*/React__default.createElement(Button, {
-    autoFocus: true,
-    tabIndex: 0,
-    appearance: "primary",
-    onClick: handleClear
-  }, texts.table3.editing.clearChangesConfirmationDialog.confirm))))));
-}
 
 export { EditingActionMenu };
 //# sourceMappingURL=EditingActionsMenu.js.map