@economic/taco 2.30.1 → 2.31.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    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, 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';\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};\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        ...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 [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\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    };\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\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    let handleBlur;\n\n    if (otherProps.onBlur) {\n        // we might be focusing on an input or something inside the dropdown that was triggered by the select\n        // so see if the element gaining focus is inside a portal and look up its controller\n        // if we don't do this, things like validate on blur occur while simply opening the select\n        handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n            const elementGainingFocus = event.relatedTarget;\n\n            if (elementGainingFocus === undefined) {\n                return;\n            }\n\n            const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n            if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n                otherProps.onBlur?.(event);\n            }\n        };\n    }\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (isAriaDirectionKey(event)) {\n            setShouldPauseHoverState(true);\n        }\n    };\n\n    const handleCloseAutoFocus = (event: Event) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (tabTriggeredClose) {\n            const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n            if (nextFocussableElement) {\n                // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n                nextFocussableElement.focus();\n                // Reset the tabTriggeredClose state\n                setTabTriggeredClose(false);\n            }\n        } else {\n            internalRef.current?.focus();\n        }\n    };\n\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    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('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none\"', createCollectionClassName());\n\n    return (\n        <Select2Context.Provider value={context}>\n            <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\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.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        emptyValue={emptyValue}\n                        onBlur={handleBlur}\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                        onOpenAutoFocus={() => {\n                            internalRef.current?.focus();\n                        }}\n                        onCloseAutoFocus={handleCloseAutoFocus}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {flattenedChildren.length > 0 || onCreate ? (\n                                <>\n                                    <Search\n                                        placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n                                        ref={searchRef}\n                                        onTabKeyPress={() => setTabTriggeredClose(true)}\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                                    No results found...\n                                </div>\n                            ) : (\n                                <ListboxPrimitive.Root\n                                    className=\"flex flex-col gap-0.5\"\n                                    customSelector=\":scope > button\"\n                                    disabled={disabled}\n                                    multiple={multiple}\n                                    onKeyDown={handleListboxKeyDown}\n                                    readOnly={readOnly}\n                                    ref={listboxRef}\n                                    setValue={setValue}\n                                    tabIndex={-1}\n                                    value={value}>\n                                    {searchQuery === '' ? (\n                                        <Collection>{initialChildren}</Collection>\n                                    ) : (\n                                        <Collection>{filteredChildren}</Collection>\n                                    )}\n                                    {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n                                </ListboxPrimitive.Root>\n                            )}\n                        </div>\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\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} 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","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","customSelector","Collection","Create","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    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, 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 } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\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};\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        ...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 [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\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    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\n        } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n            setOpen(true);\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    let handleBlur;\n\n    if (otherProps.onBlur) {\n        // we might be focusing on an input or something inside the dropdown that was triggered by the select\n        // so see if the element gaining focus is inside a portal and look up its controller\n        // if we don't do this, things like validate on blur occur while simply opening the select\n        handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n            const elementGainingFocus = event.relatedTarget;\n\n            if (elementGainingFocus === undefined) {\n                return;\n            }\n\n            const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n            if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n                otherProps.onBlur?.(event);\n            }\n        };\n    }\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (isAriaDirectionKey(event)) {\n            setShouldPauseHoverState(true);\n        }\n    };\n\n    const handleCloseAutoFocus = (event: Event) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        if (tabTriggeredClose) {\n            const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n            if (nextFocussableElement) {\n                // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n                nextFocussableElement.focus();\n                // Reset the tabTriggeredClose state\n                setTabTriggeredClose(false);\n            }\n        } else {\n            internalRef.current?.focus();\n        }\n    };\n\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    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('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none\"', createCollectionClassName());\n\n    return (\n        <Select2Context.Provider value={context}>\n            <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\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.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        emptyValue={emptyValue}\n                        onBlur={handleBlur}\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                        onOpenAutoFocus={() => {\n                            internalRef.current?.focus();\n                        }}\n                        onCloseAutoFocus={handleCloseAutoFocus}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {flattenedChildren.length > 0 || onCreate ? (\n                                <>\n                                    <Search\n                                        placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n                                        ref={searchRef}\n                                        onTabKeyPress={() => setTabTriggeredClose(true)}\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                                    No results found...\n                                </div>\n                            ) : (\n                                <ListboxPrimitive.Root\n                                    className=\"flex flex-col gap-0.5\"\n                                    customSelector=\":scope > button\"\n                                    disabled={disabled}\n                                    multiple={multiple}\n                                    onKeyDown={handleListboxKeyDown}\n                                    readOnly={readOnly}\n                                    ref={listboxRef}\n                                    setValue={setValue}\n                                    tabIndex={-1}\n                                    value={value}>\n                                    {searchQuery === '' ? (\n                                        <Collection>{initialChildren}</Collection>\n                                    ) : (\n                                        <Collection>{filteredChildren}</Collection>\n                                    )}\n                                    {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n                                </ListboxPrimitive.Root>\n                            )}\n                        </div>\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\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} 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","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","currentTarget","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","customSelector","Collection","Create","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAqGMA,OAAO,gBAAGC,cAAK,CAACC,UAAU,CAAkC,SAASF,OAAOA,CAACG,KAAK,EAAEC,GAAG;EACzF,MAAM;IACFC,QAAQ,EAAEC,YAAY;IACtBC,YAAY,EAAEC,WAAW;IACzBC,QAAQ,GAAG,KAAK;IAChBC,UAAU,GAAGC,SAAS;IACtBC,QAAQ;IACRC,WAAW,GAAG,KAAK;IACnBC,OAAO,GAAG,KAAK;IACfC,OAAO;IACPC,QAAQ,GAAG,KAAK;IAChBC,IAAI;IACJC,QAAQ;IACRC,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNC,WAAW;IACXC,QAAQ,GAAG,KAAK;IAChBC,IAAI,GAAG,KAAK;IACZC,KAAK,EAAEC,IAAI;IACX,GAAGC;GACN,GAAGxB,KAAK;EAET,MAAMyB,WAAW,GAAuD3B,cAAK,CAAC4B,OAAO,CAAC;IAClF,IAAInB,UAAU,KAAKC,SAAS,IAAI,CAACK,QAAQ,EAAE;;MAEvC,oBAAOf,6BAAC6B,MAAM;QAACC,GAAG,EAAC,SAAS;QAAC1B,QAAQ,EAAC,EAAE;QAACoB,KAAK,EAAEf,UAAU;QAAEsB,SAAS,EAAC;QAAQ;;IAElF;GACH,EAAE,CAACtB,UAAU,EAAEM,QAAQ,CAAC,CAAC;EAE1B,MAAMiB,eAAe,GAAGhC,cAAK,CAAC4B,OAAO,CAAC;IAClC,IAAID,WAAW,EAAE;MACb,OAAO,CAACA,WAAW,EAAE,GAAGtB,YAAY,CAAoB;;IAE5D,OAAOA,YAAY;GACtB,EAAE,CAACsB,WAAW,EAAEtB,YAAY,CAAC,CAAC;;EAG/B,MAAM4B,WAAW,GAAGC,YAAY,CAAoB/B,GAAG,CAAC;EACxD,MAAMgC,UAAU,GAAGnC,cAAK,CAACoC,MAAM,CAAgB,IAAI,CAAC;EACpD,MAAMC,SAAS,GAAGrC,cAAK,CAACoC,MAAM,CAAmB,IAAI,CAAC;EACtD,MAAM;IAAEE;GAAO,GAAGC,eAAe,EAAE;;EAEnC,MAAMC,UAAU,GAAGC,6BAA6B,CAACR,WAAW,CAAC;;EAG7D,MAAM,CAACS,iBAAiB,EAAEC,oBAAoB,CAAC,GAAG3C,cAAK,CAAC4C,QAAQ,CAAC,KAAK,CAAC;EACvE,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAG9C,cAAK,CAAC4C,QAAQ,CAAC,KAAK,CAAC;EAC7C,MAAM,CAACpB,KAAK,EAAEuB,SAAS,CAAC,GAAGC,oBAAoB,CAAe;;IAE1DzC,WAAW;;IAEXU,QAAQ;IACRQ;GACH,CAAC;EACF,MAAMwB,QAAQ,GAAGC,wBAAyC,CAACnC,QAAQ,EAAEgC,SAAS,CAAC;EAC/E,MAAM,CAACI,eAAe,EAAEC,kBAAkB,CAAC,GAAGpD,cAAK,CAAC4C,QAAQ,EAAqB;EACjF,MAAM,CAACS,qBAAqB,EAAEC,wBAAwB,CAAC,GAAGC,qBAAqB,EAAE;EAEjF,MAAM;IAAEC,iBAAiB;IAAEC,gBAAgB;IAAEC,WAAW;IAAEC;GAAgB,GAAGC,WAAW,CAAC;IACrFxD,QAAQ,EAAE4B,eAAe;IACzBvB,UAAU;IACVM,QAAQ;IACR8B,IAAI;IACJI,QAAQ;IACRzB;GACH,CAAC;;EAGF,MAAMqC,OAAO,GAAG;IACZrD,QAAQ;IACRI,WAAW;IACXC,OAAO;IACPsB,UAAU;IACVpB,QAAQ;IACRG,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNyB,IAAI;IACJvB,QAAQ;IACRnB,GAAG,EAAE8B,WAAW;IAChByB,WAAW;IACXrB,SAAS;IACTS,OAAO;IACPa,cAAc;IACdP,kBAAkB;IAClBH,QAAQ;IACRI,qBAAqB;IACrBC,wBAAwB;IACxB/B,IAAI;IACJZ,QAAQ;IACRwC,eAAe;IACf3B;GACH;EAED,MAAMsC,aAAa,GAAIC,KAAuC;;IAC1D,IAAIlB,IAAI,EAAE;MACNkB,KAAK,CAACC,cAAc,EAAE;KACzB,MAAM,IAAI,CAACD,KAAK,CAACE,OAAO,IAAI,CAACF,KAAK,CAACG,OAAO,KAAKH,KAAK,CAACjC,GAAG,KAAK,WAAW,IAAI,aAAa,CAACqC,IAAI,CAACJ,KAAK,CAACjC,GAAG,CAAC,CAAC,EAAE;MACzGgB,OAAO,CAAC,IAAI,CAAC;;;IAIjB,CAAAsB,mBAAA,GAAAjC,UAAU,CAACkC,OAAO,cAAAD,mBAAA,uBAAlBA,mBAAA,CAAoBE,aAAa,CAACC,yBAAyB,CAACR,KAA8C,CAAC,CAAC;GAC/G;EAED,IAAIS,UAAU;EAEd,IAAI9C,UAAU,CAAC+C,MAAM,EAAE;;;;IAInBD,UAAU,GAAIT,KAA0C;;MACpD,MAAMW,mBAAmB,GAAGX,KAAK,CAACY,aAAa;MAE/C,IAAID,mBAAmB,KAAKhE,SAAS,EAAE;QACnC;;MAGJ,MAAMkE,QAAQ,GAAGF,mBAAmB,aAAnBA,mBAAmB,wBAAAG,qBAAA,GAAnBH,mBAAmB,CAAEI,OAAO,CAAC,oDAAoD,CAAC,cAAAD,qBAAA,uBAAlFA,qBAAA,CAAoFE,EAAE;MAEvG,IAAI,CAACH,QAAQ,IAAIb,KAAK,CAACiB,aAAa,CAACC,YAAY,gBAAgB,CAAC,KAAKL,QAAQ,EAAE;QAAA,IAAAM,kBAAA;QAC7E,CAAAA,kBAAA,GAAAxD,UAAU,CAAC+C,MAAM,cAAAS,kBAAA,uBAAjBA,kBAAA,CAAAC,IAAA,CAAAzD,UAAU,EAAUqC,KAAK,CAAC;;KAEjC;;EAGL,MAAMqB,oBAAoB,GAAIrB,KAAuC;IACjE,IAAIsB,kBAAkB,CAACtB,KAAK,CAAC,EAAE;MAC3BT,wBAAwB,CAAC,IAAI,CAAC;;GAErC;EAED,MAAMgC,oBAAoB,GAAIvB,KAAY;IACtCA,KAAK,CAACC,cAAc,EAAE;IACtBD,KAAK,CAACwB,eAAe,EAAE;IAEvB,IAAI7C,iBAAiB,EAAE;MACnB,MAAM8C,qBAAqB,GAAGC,wBAAwB,CAACxD,WAAW,CAACoC,OAAO,CAAC;MAE3E,IAAImB,qBAAqB,EAAE;;QAEvBA,qBAAqB,CAACE,KAAK,EAAE;;QAE7B/C,oBAAoB,CAAC,KAAK,CAAC;;KAElC,MAAM;MAAA,IAAAgD,oBAAA;MACH,CAAAA,oBAAA,GAAA1D,WAAW,CAACoC,OAAO,cAAAsB,oBAAA,uBAAnBA,oBAAA,CAAqBD,KAAK,EAAE;;GAEnC;EAED,MAAME,aAAa,GACflC,WAAW,KAAK,EAAE,GACZF,iBAAiB,CAACqC,GAAG,CAACC,KAAK,IAAIA,KAAK,CAAC5F,KAAK,CAACsB,KAAK,CAAC,GACjDiC,gBAAgB,CACXoC,GAAG,CAACC,KAAK,IACNC,OAAO,CAACD,KAAK,CAAC,GACRE,KAAK,CAACC,OAAO,CAACH,KAAK,CAAC5F,KAAK,CAACE,QAAQ,CAAC,IAAI0F,KAAK,CAAC5F,KAAK,CAACE,QAAQ,CAACyF,GAAG,CAACK,QAAQ,IAAIA,QAAQ,CAAChG,KAAK,CAACsB,KAAK,CAAC,GACjGsE,KAAK,CAAC5F,KAAK,CAACsB,KAAK,CAC1B,CACA2E,OAAO,CAACC,CAAC,IAAIA,CAAC,CAAC,IAAI,EAAE;EAEpC,MAAMC,cAAc,GAAGL,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,IAAIoE,aAAa,CAACU,KAAK,CAACC,MAAM,IAAI/E,KAAK,CAACgF,QAAQ,CAACD,MAAgB,CAAC,CAAC;EAE9G,MAAME,aAAa,GAAGzG,cAAK,CAAC4B,OAAO,CAAC;IAChC,IAAI8B,WAAW,KAAK,EAAE,EAAE;MACpB,IAAI2C,cAAc,EAAE;QAChB,OAAO/D,KAAK,CAACoE,OAAO,CAACC,WAAW;OACnC,MAAM;QACH,OAAOrE,KAAK,CAACoE,OAAO,CAACE,SAAS;;KAErC,MAAM,IAAIP,cAAc,EAAE;MACvB,OAAO/D,KAAK,CAACoE,OAAO,CAACG,kBAAkB;KAC1C,MAAM;MACH,OAAOvE,KAAK,CAACoE,OAAO,CAACI,gBAAgB;;GAE5C,EAAE,CAACT,cAAc,EAAE3C,WAAW,CAAC,CAAC;EAEjC,MAAMkD,SAAS,GAAGA;IACd,IAAI,CAACZ,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,IAAIA,KAAK,CAACuF,MAAM,KAAK,CAAC,EAAE;MAC7C9D,QAAQ,CAAC2C,aAAa,CAAC;KAC1B,MAAM;;MAEH,MAAMoB,iBAAiB,GAAGpB,aAAa,CAACqB,MAAM,CAACV,MAAM,IAAI,CAAC/E,KAAK,CAACgF,QAAQ,CAACD,MAAM,CAAC,CAAC;MACjFtD,QAAQ,CAAC,CAAC,GAAGzB,KAAK,EAAE,GAAGwF,iBAAiB,CAAC,CAAC;;GAEjD;EAED,MAAML,WAAW,GAAGA;IAChB,IAAIjD,WAAW,KAAK,EAAE,EAAE;MACpBT,QAAQ,CAAC,EAAE,CAAC;KACf,MAAM;MACH,MAAMiE,SAAS,GAAGlB,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,IAAIA,KAAK,CAACyF,MAAM,CAACE,QAAQ,IAAI,CAACvB,aAAa,CAACY,QAAQ,CAACW,QAAkB,CAAC,CAAC;MAC/GlE,QAAQ,CAACiE,SAAS,CAAC;;GAE1B;EAED,MAAMnF,SAAS,GAAGqF,EAAE,CAAC,wEAAwE,EAAEC,yBAAyB,EAAE,CAAC;EAE3H,oBACIrH,6BAACsH,cAAc,CAACC,QAAQ;IAAC/F,KAAK,EAAEqC;kBAC5B7D,6BAACwH,IAAqB;IAAC3E,IAAI,EAAEA,IAAI;IAAE4E,YAAY,EAAE3E;kBAC7C9C,6BAAC0H,qBAAqB;IAClBjH,UAAU,EAAEA,UAAU;IACtBM,QAAQ,EAAEA,QAAQ,IAAIQ,IAAI;IAC1BP,IAAI,EAAEA,IAAI;IACV2G,OAAO,EAAEnE,iBAAiB,CAACqC,GAAG,CAACC,KAAK,IAAIA,KAAK,CAAC5F,KAAK,CAACsB,KAAK,CAAC;IAC1DoG,SAAS,EAAE3F,WAAW;IACtBgB,QAAQ,EAAEA,QAAQ;IAClBzB,KAAK,EAAEA;IACT,eACFxB,6BAACwH,OAAwB;IAACK,OAAO;iBAAW;kBACxC7H,6BAAC8H,SAAO,oBACApG,UAAU;qBACA,SAAS;IACvBjB,UAAU,EAAEA,UAAU;IACtBgE,MAAM,EAAED,UAAU;IAClBuD,SAAS,EAAEjE,aAAa;IACxBzC,WAAW,EAAEA,WAAW;IACxBlB,GAAG,EAAE8B;MACJuB,iBAAiB,CACZ,CACa,eAC3BxD,6BAACwH,MAAuB,qBACpBxH,6BAACwH,OAAwB;IACrBK,OAAO;IACPG,KAAK,EAAC,OAAO;IACbC,eAAe,EAAEA;;MACb,CAAAC,qBAAA,GAAAjG,WAAW,CAACoC,OAAO,cAAA6D,qBAAA,uBAAnBA,qBAAA,CAAqBxC,KAAK,EAAE;KAC/B;IACDyC,gBAAgB,EAAE7C,oBAAoB;IACtC8C,UAAU,EAAE,CAAC;IACbC,QAAQ,EAAE,CAAC;kBACXrI;IAAK+B,SAAS,EAAEA,SAAS;IAAEuG,KAAK,EAAE;MAAEC,QAAQ,EAAE/F,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEgG,KAAK,MAAMhG,UAAU,CAACgG,SAAS,GAAG9H;;KACvF8C,iBAAiB,CAACuD,MAAM,GAAG,CAAC,IAAI7F,QAAQ,kBACrClB,yEACIA,6BAACyI,MAAM;IACHpH,WAAW,EAAEH,QAAQ,GAAGoB,KAAK,CAACoE,OAAO,CAACgC,cAAc,GAAGpG,KAAK,CAACoE,OAAO,CAACiC,MAAM;IAC3ExI,GAAG,EAAEkC,SAAS;IACduG,aAAa,EAAEA,MAAMjG,oBAAoB,CAAC,IAAI;IAChD,EACD5B,QAAQ,IAAI6E,aAAa,CAACmB,MAAM,GAAG,CAAC,mBACjC/G,yEACIA,6BAAC6I,MAAM;IACH9G,SAAS,EAAC,gBAAgB;IAC1B+G,UAAU,EAAC,UAAU;IACrBC,OAAO,EAAE1C,cAAc,GAAGM,WAAW,GAAGC;KACvCH,aAAa,CACT,eACTzG;IAAK+B,SAAS,EAAC;IAA0C,CAC1D,CACN,CACF,IACH,IAAI,EACPjB,OAAO,kBACJd;IAAM+B,SAAS,EAAEqF,EAAE,CAAC,wCAAwC,EAAEzG,QAAQ,IAAIqI,WAAW,CAACrI,QAAQ,CAAC;kBAC3FX,wDACIA,6BAACiJ,OAAO;IACJC,KAAK,EAAE,CAAC;IACRnH,SAAS,EAAEqF,EAAE,CAAC,0BAA0B,EAAE;MACtC,qBAAqB,EAAEzG,QAAQ,KAAKwI,SAAS,CAACC,KAAK;MACnD,WAAW,EAAEzI,QAAQ,KAAKwI,SAAS,CAACE,MAAM;MAC1C,WAAW,EAAE1I,QAAQ,KAAKwI,SAAS,CAACG;KACvC;IACH,CACC,eACPtJ,2CAAOsC,KAAK,CAACiH,OAAO,CAACzI,OAAO,CAAQ,CACjC,IACP0C,iBAAiB,CAACuD,MAAM,IAAI,CAAC,kBAC7B/G;IAAK+B,SAAS,EAAC,kDAAkD;IAACyH,IAAI,EAAC;2BAEjE,mBAENxJ,6BAACkD,MAAqB;IAClBnB,SAAS,EAAC,uBAAuB;IACjC0H,cAAc,EAAC,iBAAiB;IAChCjJ,QAAQ,EAAEA,QAAQ;IAClBO,QAAQ,EAAEA,QAAQ;IAClBgH,SAAS,EAAE3C,oBAAoB;IAC/B9D,QAAQ,EAAEA,QAAQ;IAClBnB,GAAG,EAAEgC,UAAU;IACfc,QAAQ,EAAEA,QAAQ;IAClBoF,QAAQ,EAAE,CAAC,CAAC;IACZ7G,KAAK,EAAEA;KACNkC,WAAW,KAAK,EAAE,kBACf1D,6BAAC0J,UAAU,QAAE1H,eAAe,CAAc,mBAE1ChC,6BAAC0J,UAAU,QAAEjG,gBAAgB,CAAc,CAC9C,EACAvC,QAAQ,gBAAGlB,6BAAC2J,MAAM;IAACzI,QAAQ,EAAEA,QAAQ;IAAEyG,OAAO,EAAEnE;IAAqB,GAAG,IAAI,CACzD,CAC3B,CACC,CACiB,CACL,CACN,CACF;AAElC,CAAC;AACDzD,OAAO,CAAC8B,MAAM,GAAGA,MAAM;AACvB9B,OAAO,CAAC6J,KAAK,GAAGA,KAAK;AACrB7J,OAAO,CAAC8J,KAAK,GAAGA,KAAK;AAErB,MAAMnC,qBAAqB,GAAGxH,KAAK;EAC/B,MAAM;IAAEO,UAAU;IAAEM,QAAQ;IAAEC,IAAI;IAAE2G,OAAO;IAAEC,SAAS;IAAEpG,KAAK;IAAEyB;GAAU,GAAG/C,KAAK;EACjF,MAAM4J,aAAa,GAAGC,gBAAgB,CAACnC,SAAS,EAAE,MAAM3E,QAAQ,CAAClC,QAAQ,GAAG,EAAE,GAAGL,SAAS,CAAC,CAAC;EAE5F,IAAIsJ,WAAW;EAEf,IAAIF,aAAa,EAAE;IACf,IAAItI,KAAK,KAAKd,SAAS,EAAE;MACrB,IAAIK,QAAQ,EAAE;QACViJ,WAAW,GAAGhE,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,GAAGA,KAAK,CAACqE,GAAG,CAACoE,MAAM,CAAC,GAAG,CAACzI,KAAK,KAAK,IAAI,GAAG,EAAE,GAAGyI,MAAM,CAACzI,KAAK,CAAC,CAAC;OACjG,MAAM;QACHwI,WAAW,GAAGxI,KAAK,KAAK,IAAI,GAAG,EAAE,GAAGyI,MAAM,CAACzI,KAAK,CAAC;;;IAIzD,oBACIxB,6BAACkK,YAAY;;MAAapI,GAAG,EAAEmI,MAAM,CAACD,WAAW,CAAC;MAAEjJ,QAAQ,EAAEA,QAAQ;MAAEC,IAAI,EAAEA,IAAI;MAAEQ,KAAK,EAAEwI;OACtFvJ,UAAU,KAAKC,SAAS,gBAAGV;MAAQwB,KAAK,EAAEf;MAAc,GAAG,IAAI,EAC/DkH,OAAO,CAAC9B,GAAG,CAACU,MAAM,mBACfvG;MAAQ8B,GAAG,EAAEmI,MAAM,CAAC1D,MAAM,CAAC;MAAE/E,KAAK,EAAEyI,MAAM,CAAC1D,MAAM;MAAK,CACzD,CAAC,CACS;;EAIvB,OAAO,IAAI;AACf,CAAC;AACDxG,OAAO,CAACoK,WAAW,GAAG,SAAS;;;;"}

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

@@ -13,13 +13,19 @@ import { useSelect2Context } from './Context.js';
 
 const Placeholder = ({
   disabled,
+  readOnly,
   ...props
-}) => ( /*#__PURE__*/React__default.createElement("div", Object.assign({}, props, {
-  className: cn({
-    'text-grey-700': disabled,
-    'text-grey-500': !disabled
-  })
-})));
+}) => {
+  if (readOnly) {
+    return null;
+  }
+  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, props, {
+    className: cn({
+      'text-grey-700': disabled,
+      'text-grey-500': !disabled
+    })
+  }));
+};
 const Trigger = /*#__PURE__*/React__default.forwardRef(function Select2Trigger(props, ref) {
   const {
     multiple,
@@ -53,13 +59,14 @@ const Button = /*#__PURE__*/React__default.forwardRef(function Select2TriggerBut
     open,
     readOnly
   } = useSelect2Context();
-  const className = cn('cursor-pointer px-1.5 h-fit', getInputClasses({
+  const className = cn('px-1.5 h-fit', getInputClasses({
     ...props,
     disabled,
     highlighted,
     invalid,
     readOnly
   }).replace('w-full', '').replace('px-2', ''), getFontSize(fontSize), {
+    'select-text': readOnly,
     'w-full': !((_props$className = props.className) !== null && _props$className !== void 0 && _props$className.includes('w-'))
   }, props.className);
   const handleClick = event => {
@@ -71,17 +78,28 @@ const Button = /*#__PURE__*/React__default.forwardRef(function Select2TriggerBut
       onClick(event);
     }
   };
+  // select the value text if the select is readonly
+  const handleFocus = event => {
+    if (readOnly) {
+      const value = event.currentTarget.querySelector(':first-child');
+      if (value) {
+        var _window$getSelection, _window$getSelection$;
+        (_window$getSelection = window.getSelection()) === null || _window$getSelection === void 0 ? void 0 : (_window$getSelection$ = _window$getSelection.selectAllChildren) === null || _window$getSelection$ === void 0 ? void 0 : _window$getSelection$.call(_window$getSelection, value);
+      }
+    }
+  };
   return /*#__PURE__*/React__default.createElement("button", Object.assign({}, otherProps, {
     "aria-invalid": invalid ? true : undefined,
     "aria-readonly": readOnly ? true : undefined,
     className: className,
     disabled: disabled,
     onClick: handleClick,
+    onFocus: handleFocus,
     ref: ref,
     role: "combobox",
-    tabIndex: disabled || readOnly ? -1 : tabIndex,
+    tabIndex: disabled ? -1 : tabIndex,
     type: "button"
-  }), children, /*#__PURE__*/React__default.createElement(Icon, {
+  }), children, readOnly ? null : /*#__PURE__*/React__default.createElement(Icon, {
     name: open ? 'chevron-up' : 'chevron-down',
     className: "pointer-events-none -mr-1 ml-auto"
   }));
@@ -104,7 +122,8 @@ const Single = /*#__PURE__*/React__default.forwardRef(function Select2TriggerSin
   let output;
   if (placeholder && currentValue === undefined) {
     output = /*#__PURE__*/React__default.createElement(Placeholder, {
-      disabled: disabled
+      disabled: disabled,
+      readOnly: readOnly
     }, placeholder);
   } else if (currentValue) {
     if (tags && emptyValue !== value) {
@@ -157,7 +176,8 @@ const Multiple = /*#__PURE__*/React__default.forwardRef(function Select2TriggerM
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "flex flex-wrap gap-1"
     }, valuesAsChildren.length === 0 ? ( /*#__PURE__*/React__default.createElement(Placeholder, {
-      disabled: disabled
+      disabled: disabled,
+      readOnly: readOnly
     }, placeholder)) : valuesAsChildren.map(child => ( /*#__PURE__*/React__default.createElement(Tag, {
       key: String(child.props.value),
       className: "truncate",
@@ -217,7 +237,8 @@ const MultipleValue = ({
     className: "flex gap-1 truncate",
     ref: el => setContentRef(el)
   }, valuesAsChildren.length === 0 ? ( /*#__PURE__*/React__default.createElement(Placeholder, {
-    disabled: disabled
+    disabled: disabled,
+    readOnly: readOnly
   }, placeholder)) : valuesAsChildren.map((child, index) => {
     const tag = /*#__PURE__*/React__default.createElement(Tag, {
       key: String(child.props.value),

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

@@ -1 +1 @@
-{"version":3,"file":"Trigger.js","sources":["../../../../../../../../src/components/Select2/components/Trigger.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Tag } from '../../Tag/Tag';\nimport { Tooltip } from '../../Tooltip/Tooltip';\nimport { Icon } from '../../Icon/Icon';\nimport { Badge } from '../../Badge/Badge';\nimport { getInputClasses } from '../../Input/util';\nimport { Select2OptionValue } from '../types';\nimport { useSelect2Context } from './Context';\nimport { Select2OptionProps } from './Option';\nimport { getIndexOfFirstChildOverflowingParent } from '../../../utils/dom';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { getFontSize } from '../utilities';\n\ntype Select2TriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    emptyValue?: Select2OptionValue;\n    placeholder?: string;\n    children: React.ReactElement<Select2OptionProps>[];\n};\n\nconst Placeholder = ({ disabled, ...props }) => (\n    <div {...props} className={cn({ 'text-grey-700': disabled, 'text-grey-500': !disabled })} />\n);\n\nexport const Trigger = React.forwardRef<HTMLButtonElement, Select2TriggerProps>(function Select2Trigger(props, ref) {\n    const { multiple, value } = useSelect2Context();\n\n    if (Array.isArray(value) || multiple) {\n        const values = Array.isArray(value) ? value : value !== undefined ? [value] : undefined;\n        return <Multiple {...props} ref={ref} values={values} />;\n    }\n\n    return <Single {...props} ref={ref} value={value} />;\n});\n\ntype ButtonProps = React.HTMLAttributes<HTMLButtonElement> &\n    Omit<Select2TriggerProps, 'children' | 'open' | 'setValue' | 'value'>;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Select2TriggerButton(props, ref) {\n    const { children, onClick, tabIndex = 0, ...otherProps } = props;\n    const { disabled, fontSize, highlighted, invalid, open, readOnly } = useSelect2Context();\n\n    const className = cn(\n        'cursor-pointer px-1.5 h-fit',\n        getInputClasses({ ...props, disabled, highlighted, invalid, readOnly })\n            .replace('w-full', '')\n            .replace('px-2', ''),\n        getFontSize(fontSize),\n        {\n            'w-full': !props.className?.includes('w-'),\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        if (disabled || readOnly) {\n            event.preventDefault();\n            return;\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    return (\n        <button\n            {...otherProps}\n            aria-invalid={invalid ? true : undefined}\n            aria-readonly={readOnly ? true : undefined}\n            className={className}\n            disabled={disabled}\n            onClick={handleClick}\n            ref={ref}\n            role=\"combobox\"\n            tabIndex={disabled || readOnly ? -1 : tabIndex}\n            type=\"button\">\n            {children}\n            <Icon name={open ? 'chevron-up' : 'chevron-down'} className=\"pointer-events-none -mr-1 ml-auto\" />\n        </button>\n    );\n});\n\ntype SingleProps = Omit<Select2TriggerProps, 'value'> & { value?: Select2OptionValue; placeholder?: string };\n\nconst Single = React.forwardRef<HTMLButtonElement, SingleProps>(function Select2TriggerSingle(props, ref) {\n    const { children, emptyValue, value, placeholder, ...buttonProps } = props;\n    const { disabled, readOnly, tags } = useSelect2Context();\n    const contentClassName = cn('truncate items-center gap-1');\n\n    const currentValue = children.find(matchesValue(value));\n\n    let output;\n\n    if (placeholder && currentValue === undefined) {\n        output = <Placeholder disabled={disabled}>{placeholder}</Placeholder>;\n    } else if (currentValue) {\n        if (tags && emptyValue !== value) {\n            output = (\n                <Tag\n                    className=\"truncate\"\n                    color={currentValue.props.color}\n                    disabled={disabled}\n                    icon={currentValue.props.prefix}\n                    readOnly={readOnly}>\n                    {currentValue.props.children}\n                </Tag>\n            );\n        } else {\n            output = (\n                <>\n                    {currentValue.props.prefix ? (\n                        typeof currentValue.props.prefix === 'string' ? (\n                            <Icon name={currentValue.props.prefix} className=\"mr-1 !h-5 !w-5\" />\n                        ) : (\n                            currentValue.props.prefix\n                        )\n                    ) : null}\n                    {currentValue.props.children}\n                </>\n            );\n        }\n    }\n\n    return (\n        <Button {...buttonProps} ref={ref}>\n            <div className={contentClassName}>{output}</div>\n        </Button>\n    );\n});\n\ntype MultipleProps = Omit<Select2TriggerProps, 'value'> & {\n    values?: Select2OptionValue[];\n};\n\nconst Multiple = React.forwardRef<HTMLButtonElement, MultipleProps>(function Select2TriggerMultiple(props, ref) {\n    const { children, emptyValue: _, values = [], placeholder, ...buttonProps } = props;\n    const { disabled, open, readOnly, setValue, tags } = useSelect2Context();\n    const buttonRef = useMergedRef<HTMLButtonElement>(ref);\n\n    const valuesAsChildren = values\n        .map(value => children.find(c => c.props.value === value))\n        .filter(c => !!c) as React.ReactElement<Select2OptionProps>[];\n\n    let content;\n    let { className } = buttonProps;\n\n    if (open) {\n        className = cn('!absolute z-20 !h-fit', buttonProps.className);\n        content = (\n            <ScrollArea className=\"my-1 flex max-h-[5.5rem] flex-col\">\n                <div className=\"flex flex-wrap gap-1\">\n                    {valuesAsChildren.length === 0 ? (\n                        <Placeholder disabled={disabled}>{placeholder}</Placeholder>\n                    ) : (\n                        valuesAsChildren.map(child => (\n                            <Tag\n                                key={String(child.props.value)}\n                                className=\"truncate\"\n                                color={tags ? child.props.color : undefined}\n                                disabled={disabled}\n                                icon={child.props.prefix}\n                                onDelete={event => {\n                                    event?.stopPropagation();\n                                    event?.preventDefault();\n\n                                    if (!disabled && !readOnly) {\n                                        setValue(child.props.value);\n                                    }\n                                }}\n                                readOnly={readOnly}>\n                                {child.props.children}\n                            </Tag>\n                        ))\n                    )}\n                </div>\n            </ScrollArea>\n        );\n    } else {\n        content = <MultipleValue key={String(open)} valuesAsChildren={valuesAsChildren} placeholder={placeholder} />;\n    }\n\n    return (\n        <div\n            className=\"relative inline-flex h-fit flex-grow\"\n            data-taco=\"select2-container\"\n            style={{ width: open ? buttonRef.current?.offsetWidth : undefined }}>\n            <Button {...buttonProps} className={className} ref={buttonRef}>\n                {content}\n            </Button>\n        </div>\n    );\n});\n\ntype MultipleValueProps = Omit<Select2TriggerProps, 'value' | 'children'> & {\n    valuesAsChildren: React.ReactElement<Select2OptionProps>[];\n    placeholder?: string;\n};\n\nconst MultipleValue = ({ valuesAsChildren, placeholder }: MultipleValueProps) => {\n    const { disabled, open, readOnly, setValue, tags } = useSelect2Context();\n    const [contentRef, setContentRef] = React.useState<HTMLDivElement | null>(null);\n    const boundaryIndex = contentRef ? getIndexOfFirstChildOverflowingParent(contentRef, 30) : undefined;\n\n    const createClickHandler = tagValue => event => {\n        event?.stopPropagation();\n        event?.preventDefault();\n\n        if (!disabled && !readOnly) {\n            setValue(tagValue);\n        }\n    };\n\n    return (\n        <div className=\"relative flex items-center gap-1 overflow-hidden\">\n            <div className=\"flex gap-1 truncate\" ref={el => setContentRef(el)}>\n                {valuesAsChildren.length === 0 ? (\n                    <Placeholder disabled={disabled}>{placeholder}</Placeholder>\n                ) : (\n                    valuesAsChildren.map((child, index) => {\n                        const tag = (\n                            <Tag\n                                key={String(child.props.value)}\n                                className={cn('cursor-pointer', {\n                                    truncate: index === boundaryIndex,\n                                    hidden: boundaryIndex !== undefined && boundaryIndex !== null ? index > boundaryIndex : false,\n                                })}\n                                color={tags ? child.props.color : undefined}\n                                disabled={disabled}\n                                icon={child.props.prefix}\n                                onDelete={open ? createClickHandler(child.props.value) : undefined}\n                                readOnly={readOnly}>\n                                {child.props.children}\n                            </Tag>\n                        );\n\n                        if (index === boundaryIndex) {\n                            return (\n                                <Tooltip key={String(child.props.value)} title={String(child.props.children)}>\n                                    {tag}\n                                </Tooltip>\n                            );\n                        }\n\n                        return tag;\n                    })\n                )}\n            </div>\n            {boundaryIndex !== undefined && boundaryIndex !== null && boundaryIndex < valuesAsChildren.length - 1 ? (\n                <Tooltip\n                    title={valuesAsChildren\n                        .slice(boundaryIndex + 1)\n                        .map(child => (child ? String(child.props.children) : ''))\n                        .join(', ')}>\n                    <Badge className=\"flex-shrink-0\">+{valuesAsChildren.length - (boundaryIndex + 1)}</Badge>\n                </Tooltip>\n            ) : null}\n        </div>\n    );\n};\n\nconst matchesValue = (value: undefined | any | any[]) => (child: React.ReactElement<any>) => {\n    if (Array.isArray(value)) {\n        return value.includes(child.props.value);\n    }\n\n    return child.props.value === value;\n};\n"],"names":["Placeholder","disabled","props","React","className","cn","Trigger","forwardRef","Select2Trigger","ref","multiple","value","useSelect2Context","Array","isArray","values","undefined","Multiple","Single","Button","Select2TriggerButton","children","onClick","tabIndex","otherProps","fontSize","highlighted","invalid","open","readOnly","getInputClasses","replace","getFontSize","_props$className","includes","handleClick","event","preventDefault","role","type","Icon","name","Select2TriggerSingle","emptyValue","placeholder","buttonProps","tags","contentClassName","currentValue","find","matchesValue","output","Tag","color","icon","prefix","Select2TriggerMultiple","_","setValue","buttonRef","useMergedRef","valuesAsChildren","map","c","filter","content","ScrollArea","length","child","key","String","onDelete","stopPropagation","MultipleValue","style","width","_buttonRef$current","current","offsetWidth","contentRef","setContentRef","useState","boundaryIndex","getIndexOfFirstChildOverflowingParent","createClickHandler","tagValue","el","index","tag","truncate","hidden","Tooltip","title","slice","join","Badge"],"mappings":"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"}
+{"version":3,"file":"Trigger.js","sources":["../../../../../../../../src/components/Select2/components/Trigger.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Tag } from '../../Tag/Tag';\nimport { Tooltip } from '../../Tooltip/Tooltip';\nimport { Icon } from '../../Icon/Icon';\nimport { Badge } from '../../Badge/Badge';\nimport { getInputClasses } from '../../Input/util';\nimport { Select2OptionValue } from '../types';\nimport { useSelect2Context } from './Context';\nimport { Select2OptionProps } from './Option';\nimport { getIndexOfFirstChildOverflowingParent } from '../../../utils/dom';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { getFontSize } from '../utilities';\n\ntype Select2TriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    emptyValue?: Select2OptionValue;\n    placeholder?: string;\n    children: React.ReactElement<Select2OptionProps>[];\n};\n\nconst Placeholder = ({ disabled, readOnly, ...props }) => {\n    if (readOnly) {\n        return null;\n    }\n    return <div {...props} className={cn({ 'text-grey-700': disabled, 'text-grey-500': !disabled })} />;\n};\n\nexport const Trigger = React.forwardRef<HTMLButtonElement, Select2TriggerProps>(function Select2Trigger(props, ref) {\n    const { multiple, value } = useSelect2Context();\n\n    if (Array.isArray(value) || multiple) {\n        const values = Array.isArray(value) ? value : value !== undefined ? [value] : undefined;\n        return <Multiple {...props} ref={ref} values={values} />;\n    }\n\n    return <Single {...props} ref={ref} value={value} />;\n});\n\ntype ButtonProps = React.HTMLAttributes<HTMLButtonElement> &\n    Omit<Select2TriggerProps, 'children' | 'open' | 'setValue' | 'value'>;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Select2TriggerButton(props, ref) {\n    const { children, onClick, tabIndex = 0, ...otherProps } = props;\n    const { disabled, fontSize, highlighted, invalid, open, readOnly } = useSelect2Context();\n\n    const className = cn(\n        'px-1.5 h-fit',\n        getInputClasses({ ...props, disabled, highlighted, invalid, readOnly })\n            .replace('w-full', '')\n            .replace('px-2', ''),\n        getFontSize(fontSize),\n        {\n            'select-text': readOnly,\n            'w-full': !props.className?.includes('w-'),\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        if (disabled || readOnly) {\n            event.preventDefault();\n            return;\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    // select the value text if the select is readonly\n    const handleFocus = (event: React.FocusEvent<HTMLButtonElement>) => {\n        if (readOnly) {\n            const value = event.currentTarget.querySelector(':first-child');\n\n            if (value) {\n                window.getSelection()?.selectAllChildren?.(value);\n            }\n        }\n    };\n\n    return (\n        <button\n            {...otherProps}\n            aria-invalid={invalid ? true : undefined}\n            aria-readonly={readOnly ? true : undefined}\n            className={className}\n            disabled={disabled}\n            onClick={handleClick}\n            onFocus={handleFocus}\n            ref={ref}\n            role=\"combobox\"\n            tabIndex={disabled ? -1 : tabIndex}\n            type=\"button\">\n            {children}\n            {readOnly ? null : <Icon name={open ? 'chevron-up' : 'chevron-down'} className=\"pointer-events-none -mr-1 ml-auto\" />}\n        </button>\n    );\n});\n\ntype SingleProps = Omit<Select2TriggerProps, 'value'> & { value?: Select2OptionValue; placeholder?: string };\n\nconst Single = React.forwardRef<HTMLButtonElement, SingleProps>(function Select2TriggerSingle(props, ref) {\n    const { children, emptyValue, value, placeholder, ...buttonProps } = props;\n    const { disabled, readOnly, tags } = useSelect2Context();\n    const contentClassName = cn('truncate items-center gap-1');\n\n    const currentValue = children.find(matchesValue(value));\n\n    let output;\n\n    if (placeholder && currentValue === undefined) {\n        output = (\n            <Placeholder disabled={disabled} readOnly={readOnly}>\n                {placeholder}\n            </Placeholder>\n        );\n    } else if (currentValue) {\n        if (tags && emptyValue !== value) {\n            output = (\n                <Tag\n                    className=\"truncate\"\n                    color={currentValue.props.color}\n                    disabled={disabled}\n                    icon={currentValue.props.prefix}\n                    readOnly={readOnly}>\n                    {currentValue.props.children}\n                </Tag>\n            );\n        } else {\n            output = (\n                <>\n                    {currentValue.props.prefix ? (\n                        typeof currentValue.props.prefix === 'string' ? (\n                            <Icon name={currentValue.props.prefix} className=\"mr-1 !h-5 !w-5\" />\n                        ) : (\n                            currentValue.props.prefix\n                        )\n                    ) : null}\n                    {currentValue.props.children}\n                </>\n            );\n        }\n    }\n\n    return (\n        <Button {...buttonProps} ref={ref}>\n            <div className={contentClassName}>{output}</div>\n        </Button>\n    );\n});\n\ntype MultipleProps = Omit<Select2TriggerProps, 'value'> & {\n    values?: Select2OptionValue[];\n};\n\nconst Multiple = React.forwardRef<HTMLButtonElement, MultipleProps>(function Select2TriggerMultiple(props, ref) {\n    const { children, emptyValue: _, values = [], placeholder, ...buttonProps } = props;\n    const { disabled, open, readOnly, setValue, tags } = useSelect2Context();\n    const buttonRef = useMergedRef<HTMLButtonElement>(ref);\n\n    const valuesAsChildren = values\n        .map(value => children.find(c => c.props.value === value))\n        .filter(c => !!c) as React.ReactElement<Select2OptionProps>[];\n\n    let content;\n    let { className } = buttonProps;\n\n    if (open) {\n        className = cn('!absolute z-20 !h-fit', buttonProps.className);\n        content = (\n            <ScrollArea className=\"my-1 flex max-h-[5.5rem] flex-col\">\n                <div className=\"flex flex-wrap gap-1\">\n                    {valuesAsChildren.length === 0 ? (\n                        <Placeholder disabled={disabled} readOnly={readOnly}>\n                            {placeholder}\n                        </Placeholder>\n                    ) : (\n                        valuesAsChildren.map(child => (\n                            <Tag\n                                key={String(child.props.value)}\n                                className=\"truncate\"\n                                color={tags ? child.props.color : undefined}\n                                disabled={disabled}\n                                icon={child.props.prefix}\n                                onDelete={event => {\n                                    event?.stopPropagation();\n                                    event?.preventDefault();\n\n                                    if (!disabled && !readOnly) {\n                                        setValue(child.props.value);\n                                    }\n                                }}\n                                readOnly={readOnly}>\n                                {child.props.children}\n                            </Tag>\n                        ))\n                    )}\n                </div>\n            </ScrollArea>\n        );\n    } else {\n        content = <MultipleValue key={String(open)} valuesAsChildren={valuesAsChildren} placeholder={placeholder} />;\n    }\n\n    return (\n        <div\n            className=\"relative inline-flex h-fit flex-grow\"\n            data-taco=\"select2-container\"\n            style={{ width: open ? buttonRef.current?.offsetWidth : undefined }}>\n            <Button {...buttonProps} className={className} ref={buttonRef}>\n                {content}\n            </Button>\n        </div>\n    );\n});\n\ntype MultipleValueProps = Omit<Select2TriggerProps, 'value' | 'children'> & {\n    valuesAsChildren: React.ReactElement<Select2OptionProps>[];\n    placeholder?: string;\n};\n\nconst MultipleValue = ({ valuesAsChildren, placeholder }: MultipleValueProps) => {\n    const { disabled, open, readOnly, setValue, tags } = useSelect2Context();\n    const [contentRef, setContentRef] = React.useState<HTMLDivElement | null>(null);\n    const boundaryIndex = contentRef ? getIndexOfFirstChildOverflowingParent(contentRef, 30) : undefined;\n\n    const createClickHandler = tagValue => event => {\n        event?.stopPropagation();\n        event?.preventDefault();\n\n        if (!disabled && !readOnly) {\n            setValue(tagValue);\n        }\n    };\n\n    return (\n        <div className=\"relative flex items-center gap-1 overflow-hidden\">\n            <div className=\"flex gap-1 truncate\" ref={el => setContentRef(el)}>\n                {valuesAsChildren.length === 0 ? (\n                    <Placeholder disabled={disabled} readOnly={readOnly}>\n                        {placeholder}\n                    </Placeholder>\n                ) : (\n                    valuesAsChildren.map((child, index) => {\n                        const tag = (\n                            <Tag\n                                key={String(child.props.value)}\n                                className={cn('cursor-pointer', {\n                                    truncate: index === boundaryIndex,\n                                    hidden: boundaryIndex !== undefined && boundaryIndex !== null ? index > boundaryIndex : false,\n                                })}\n                                color={tags ? child.props.color : undefined}\n                                disabled={disabled}\n                                icon={child.props.prefix}\n                                onDelete={open ? createClickHandler(child.props.value) : undefined}\n                                readOnly={readOnly}>\n                                {child.props.children}\n                            </Tag>\n                        );\n\n                        if (index === boundaryIndex) {\n                            return (\n                                <Tooltip key={String(child.props.value)} title={String(child.props.children)}>\n                                    {tag}\n                                </Tooltip>\n                            );\n                        }\n\n                        return tag;\n                    })\n                )}\n            </div>\n            {boundaryIndex !== undefined && boundaryIndex !== null && boundaryIndex < valuesAsChildren.length - 1 ? (\n                <Tooltip\n                    title={valuesAsChildren\n                        .slice(boundaryIndex + 1)\n                        .map(child => (child ? String(child.props.children) : ''))\n                        .join(', ')}>\n                    <Badge className=\"flex-shrink-0\">+{valuesAsChildren.length - (boundaryIndex + 1)}</Badge>\n                </Tooltip>\n            ) : null}\n        </div>\n    );\n};\n\nconst matchesValue = (value: undefined | any | any[]) => (child: React.ReactElement<any>) => {\n    if (Array.isArray(value)) {\n        return value.includes(child.props.value);\n    }\n\n    return child.props.value === value;\n};\n"],"names":["Placeholder","disabled","readOnly","props","React","className","cn","Trigger","forwardRef","Select2Trigger","ref","multiple","value","useSelect2Context","Array","isArray","values","undefined","Multiple","Single","Button","Select2TriggerButton","children","onClick","tabIndex","otherProps","fontSize","highlighted","invalid","open","getInputClasses","replace","getFontSize","_props$className","includes","handleClick","event","preventDefault","handleFocus","currentTarget","querySelector","_window$getSelection","_window$getSelection$","window","getSelection","selectAllChildren","call","onFocus","role","type","Icon","name","Select2TriggerSingle","emptyValue","placeholder","buttonProps","tags","contentClassName","currentValue","find","matchesValue","output","Tag","color","icon","prefix","Select2TriggerMultiple","_","setValue","buttonRef","useMergedRef","valuesAsChildren","map","c","filter","content","ScrollArea","length","child","key","String","onDelete","stopPropagation","MultipleValue","style","width","_buttonRef$current","current","offsetWidth","contentRef","setContentRef","useState","boundaryIndex","getIndexOfFirstChildOverflowingParent","createClickHandler","tagValue","el","index","tag","truncate","hidden","Tooltip","title","slice","join","Badge"],"mappings":"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"}

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

@@ -20,6 +20,22 @@ function Alert(props) {
   const tableMeta = table.options.meta;
   const [showFilterResetDialog, setShowFilterResetDialog] = React__default.useState(false);
   const pendingChangesWithErrors = tableMeta.editing.getErrors();
+  const deletePendingChange = tableMeta.editing.resetChanges;
+  const allRows = table.getPreFilteredRowModel().rows;
+  // This effect deletes error in the alert if the row that has the error is deleted.
+  React__default.useEffect(() => {
+    pendingChangesWithErrors.forEach(errorRow => {
+      const errorRowId = errorRow.rowId;
+      try {
+        // getRow throws error if it fails to find the row
+        if (!table.getRow(errorRowId)) {
+          deletePendingChange(errorRowId);
+        }
+      } catch {
+        deletePendingChange(errorRowId);
+      }
+    });
+  }, [allRows.length]);
   const activeRow = React__default.useMemo(() => tableMeta.rowActive.rowActiveIndex ? table.getRowModel().rows[tableMeta.rowActive.rowActiveIndex] : undefined, [tableMeta.rowActive.rowActiveIndex]);
   // mark errors being rendered as seen
   React__default.useEffect(() => {
@@ -48,18 +64,23 @@ function Alert(props) {
   const title = (pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural).replace('[COUNT]', String(pendingChangesWithErrors.length));
   // generate links to each invalid row, to go into the error message
   const links = [];
-  const rowIdentityColumn = tableMeta.rowIdentityColumnId ? table.getColumn(tableMeta.rowIdentityColumnId) : undefined;
+  const rowIdentityColumn = tableMeta.rowIdentityColumnId ?
+  // Since rowIdentityColumnId can have multiple ids, we use the first id to refer to the row in Alert
+  table.getColumn(tableMeta.rowIdentityColumnId[0]) : undefined;
   pendingChangesWithErrors.forEach((error, index) => {
     // if appropriate, concatenate the item with the text "and"
     if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {
       // Add space before and after `messageAnd` text
       links.push(` ${validationTexts.alert.messageAnd} `);
     }
-    const rowIndex = table.getRowModel().rows.findIndex(row => row.id === error.rowId);
+    const rowIndex = table.getFilteredRowModel().rows.findIndex(row => row.id === error.rowId);
     const handleClick = () => {
+      // if row is visible
       if (rowIndex > -1) {
         scrollToRow(rowIndex);
-      } else {
+      }
+      // if row is filtered out
+      else {
         setShowFilterResetDialog(error.rowId);
       }
     };

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

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions as ReactVirtualScrollToOptions } from '@tanstack/react-virtual';\nimport { Alert as BaseAlert, AlertProps as BaseAlertProps } from '../../../Alert/Alert';\nimport { TableRef } from '../../../../primitives/Table/types';\nimport { Tooltip } from '../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype AlertProps<TType = unknown> = Omit<BaseAlertProps, 'children'> & {\n    scrollToIndex: (index: number, options: ReactVirtualScrollToOptions) => void;\n    table: ReactTable<TType>;\n    tableRef: React.RefObject<TableRef>;\n};\n\nexport function Alert<TType = unknown>(props: AlertProps<TType>) {\n    const { scrollToIndex, table, tableRef, ...attributes } = props;\n    const { texts } = useLocalization();\n    const validationTexts = texts.table3.editing.validation;\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n    const [showFilterResetDialog, setShowFilterResetDialog] = React.useState<string | false>(false);\n\n    const pendingChangesWithErrors = tableMeta.editing.getErrors<TType>();\n\n    const activeRow = React.useMemo(\n        () => (tableMeta.rowActive.rowActiveIndex ? table.getRowModel().rows[tableMeta.rowActive.rowActiveIndex] : undefined),\n        [tableMeta.rowActive.rowActiveIndex]\n    );\n\n    // mark errors being rendered as seen\n    React.useEffect(() => {\n        pendingChangesWithErrors.forEach(error => {\n            if (activeRow && error.rowId === activeRow.id) {\n                return;\n            }\n\n            tableMeta.editing.setRowErrorsSeen(error.rowId);\n        });\n    }, [pendingChangesWithErrors]);\n\n    function scrollToRow(rowIndex: number) {\n        tableMeta.rowActive.setRowActiveIndex(rowIndex);\n        scrollToIndex(rowIndex, { align: 'center' });\n\n        requestAnimationFrame(() => {\n            const cell = tableRef.current?.querySelector(\n                'tbody > tr[data-row-active=\"true\"] > td[data-cell-editing-invalid=\"true\"]'\n            );\n\n            if (cell) {\n                (cell as HTMLElement).focus?.();\n            }\n        });\n    }\n\n    // generate the \"N unsaved entries\" title\n    const title = (\n        pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural\n    ).replace('[COUNT]', String(pendingChangesWithErrors.length));\n\n    // generate links to each invalid row, to go into the error message\n    const links: React.ReactNode[] = [];\n    const rowIdentityColumn = tableMeta.rowIdentityColumnId ? table.getColumn(tableMeta.rowIdentityColumnId) : undefined;\n\n    pendingChangesWithErrors.forEach((error, index) => {\n        // if appropriate, concatenate the item with the text \"and\"\n        if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {\n            // Add space before and after `messageAnd` text\n            links.push(` ${validationTexts.alert.messageAnd} `);\n        }\n        const rowIndex = table.getRowModel().rows.findIndex(row => row.id === error.rowId);\n\n        const handleClick = () => {\n            if (rowIndex > -1) {\n                scrollToRow(rowIndex);\n            } else {\n                setShowFilterResetDialog(error.rowId);\n            }\n        };\n\n        let tooltip;\n\n        if (error.pendingChange._meta.errors.row) {\n            tooltip = error.pendingChange._meta.errors.row;\n        } else {\n            const firstCellErrorColumnId = Object.keys(error.pendingChange._meta.errors.cells)[0];\n            const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n            tooltip = `${columnName}: ${error.pendingChange._meta.errors.cells[firstCellErrorColumnId]}`;\n        }\n\n        links.push(\n            <Tooltip key={error.rowId} title={tooltip}>\n                <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n                    {rowIdentityColumn ? error.pendingChange._meta.original[rowIdentityColumn.id] : rowIndex + 1}\n                </span>\n            </Tooltip>\n        );\n\n        // if appropriate, concatenate the item with the text \",\"\n        if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {\n            links.push(', ');\n        }\n    });\n\n    // generate the \"Row N is incomplete and hasn't been saved\" error message\n    const message = (links.length === 1 ? validationTexts.alert.messageOne : validationTexts.alert.messagePlural)\n        .split(/(\\[\\w+\\])/)\n        .map(part => {\n            if (part === '[COLUMN]') {\n                return rowIdentityColumn?.columnDef.meta?.header ?? validationTexts.alert.messageRow;\n            }\n\n            if (part === '[ROW]') {\n                return links;\n            }\n\n            return part;\n        });\n\n    const handleResetFilters = () => {\n        table.resetGlobalFilter();\n        table.resetColumnFilters();\n\n        requestAnimationFrame(() => {\n            const rowIndex = table.getRowModel().rows.findIndex(row => row.id === showFilterResetDialog);\n\n            if (rowIndex > -1) {\n                scrollToRow(rowIndex);\n            }\n\n            setShowFilterResetDialog(false);\n        });\n    };\n\n    return (\n        <>\n            <BaseAlert {...attributes} state=\"error\">\n                <span className=\"font-bold\">{title}</span>&nbsp;{message}\n            </BaseAlert>\n            <FilterResetDialog\n                open={showFilterResetDialog !== false}\n                onChange={() => setShowFilterResetDialog(false)}\n                onSubmit={handleResetFilters}\n            />\n        </>\n    );\n}\n\ntype FilterResetDialogProps = Omit<DialogProps, 'children'> & {\n    onSubmit: () => void;\n};\n\nfunction FilterResetDialog(props: FilterResetDialogProps) {\n    const { onSubmit: handleSubmit, ...dialogProps } = props;\n    const { texts } = useLocalization();\n\n    return (\n        <Dialog {...dialogProps} size=\"xs\">\n            <Dialog.Content aria-label=\"Create a new account\">\n                <Dialog.Title>{texts.table3.editing.validation.resetFiltersDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.editing.validation.resetFiltersDialog.description}</p>\n\n                <Dialog.Footer>\n                    <Group>\n                        <Dialog.Close>\n                            <Button>{texts.table3.editing.validation.resetFiltersDialog.cancel}</Button>\n                        </Dialog.Close>\n                        <Button appearance=\"primary\" onClick={handleSubmit}>\n                            {texts.table3.editing.validation.resetFiltersDialog.confirm}\n                        </Button>\n                    </Group>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["Alert","props","scrollToIndex","table","tableRef","attributes","texts","useLocalization","validationTexts","table3","editing","validation","tableMeta","options","meta","showFilterResetDialog","setShowFilterResetDialog","React","useState","pendingChangesWithErrors","getErrors","activeRow","useMemo","rowActive","rowActiveIndex","getRowModel","rows","undefined","useEffect","forEach","error","rowId","id","setRowErrorsSeen","scrollToRow","rowIndex","setRowActiveIndex","align","requestAnimationFrame","cell","_tableRef$current","current","querySelector","_cell$focus","focus","call","title","length","alert","titleOne","titlePlural","replace","String","links","rowIdentityColumn","rowIdentityColumnId","getColumn","index","push","messageAnd","findIndex","row","handleClick","tooltip","pendingChange","_meta","errors","_table$getAllColumns$","_table$getAllColumns$2","firstCellErrorColumnId","Object","keys","cells","columnName","getAllColumns","find","column","columnDef","header","Tooltip","key","className","onClick","role","original","message","messageOne","messagePlural","split","map","part","_rowIdentityColumn$co","_rowIdentityColumn$co2","messageRow","handleResetFilters","resetGlobalFilter","resetColumnFilters","BaseAlert","state","FilterResetDialog","open","onChange","onSubmit","handleSubmit","dialogProps","Dialog","size","Content","Title","resetFiltersDialog","description","Footer","Group","Close","Button","cancel","appearance","confirm"],"mappings":";;;;;;;;SAiBgBA,KAAKA,CAAkBC,KAAwB;EAC3D,MAAM;IAAEC,aAAa;IAAEC,KAAK;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGJ,KAAK;EAC/D,MAAM;IAAEK;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,eAAe,GAAGF,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,UAAU;EACvD,MAAMC,SAAS,GAAGT,KAAK,CAACU,OAAO,CAACC,IAA6B;EAC7D,MAAM,CAACC,qBAAqB,EAAEC,wBAAwB,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAiB,KAAK,CAAC;EAE/F,MAAMC,wBAAwB,GAAGP,SAAS,CAACF,OAAO,CAACU,SAAS,EAAS;EAErE,MAAMC,SAAS,GAAGJ,cAAK,CAACK,OAAO,CAC3B,MAAOV,SAAS,CAACW,SAAS,CAACC,cAAc,GAAGrB,KAAK,CAACsB,WAAW,EAAE,CAACC,IAAI,CAACd,SAAS,CAACW,SAAS,CAACC,cAAc,CAAC,GAAGG,SAAU,EACrH,CAACf,SAAS,CAACW,SAAS,CAACC,cAAc,CAAC,CACvC;;EAGDP,cAAK,CAACW,SAAS,CAAC;IACZT,wBAAwB,CAACU,OAAO,CAACC,KAAK;MAClC,IAAIT,SAAS,IAAIS,KAAK,CAACC,KAAK,KAAKV,SAAS,CAACW,EAAE,EAAE;QAC3C;;MAGJpB,SAAS,CAACF,OAAO,CAACuB,gBAAgB,CAACH,KAAK,CAACC,KAAK,CAAC;KAClD,CAAC;GACL,EAAE,CAACZ,wBAAwB,CAAC,CAAC;EAE9B,SAASe,WAAWA,CAACC,QAAgB;IACjCvB,SAAS,CAACW,SAAS,CAACa,iBAAiB,CAACD,QAAQ,CAAC;IAC/CjC,aAAa,CAACiC,QAAQ,EAAE;MAAEE,KAAK,EAAE;KAAU,CAAC;IAE5CC,qBAAqB,CAAC;;MAClB,MAAMC,IAAI,IAAAC,iBAAA,GAAGpC,QAAQ,CAACqC,OAAO,cAAAD,iBAAA,uBAAhBA,iBAAA,CAAkBE,aAAa,CACxC,2EAA2E,CAC9E;MAED,IAAIH,IAAI,EAAE;QAAA,IAAAI,WAAA;QACL,CAAAA,WAAA,GAAAJ,IAAoB,CAACK,KAAK,cAAAD,WAAA,uBAA1BA,WAAA,CAAAE,IAAA,CAAAN,KAA8B;;KAEtC,CAAC;;;EAIN,MAAMO,KAAK,GAAG,CACV3B,wBAAwB,CAAC4B,MAAM,KAAK,CAAC,GAAGvC,eAAe,CAACwC,KAAK,CAACC,QAAQ,GAAGzC,eAAe,CAACwC,KAAK,CAACE,WAAW,EAC5GC,OAAO,CAAC,SAAS,EAAEC,MAAM,CAACjC,wBAAwB,CAAC4B,MAAM,CAAC,CAAC;;EAG7D,MAAMM,KAAK,GAAsB,EAAE;EACnC,MAAMC,iBAAiB,GAAG1C,SAAS,CAAC2C,mBAAmB,GAAGpD,KAAK,CAACqD,SAAS,CAAC5C,SAAS,CAAC2C,mBAAmB,CAAC,GAAG5B,SAAS;EAEpHR,wBAAwB,CAACU,OAAO,CAAC,CAACC,KAAK,EAAE2B,KAAK;;IAE1C,IAAItC,wBAAwB,CAAC4B,MAAM,GAAG,CAAC,IAAIU,KAAK,KAAKtC,wBAAwB,CAAC4B,MAAM,GAAG,CAAC,EAAE;;MAEtFM,KAAK,CAACK,IAAI,KAAKlD,eAAe,CAACwC,KAAK,CAACW,aAAa,CAAC;;IAEvD,MAAMxB,QAAQ,GAAGhC,KAAK,CAACsB,WAAW,EAAE,CAACC,IAAI,CAACkC,SAAS,CAACC,GAAG,IAAIA,GAAG,CAAC7B,EAAE,KAAKF,KAAK,CAACC,KAAK,CAAC;IAElF,MAAM+B,WAAW,GAAGA;MAChB,IAAI3B,QAAQ,GAAG,CAAC,CAAC,EAAE;QACfD,WAAW,CAACC,QAAQ,CAAC;OACxB,MAAM;QACHnB,wBAAwB,CAACc,KAAK,CAACC,KAAK,CAAC;;KAE5C;IAED,IAAIgC,OAAO;IAEX,IAAIjC,KAAK,CAACkC,aAAa,CAACC,KAAK,CAACC,MAAM,CAACL,GAAG,EAAE;MACtCE,OAAO,GAAGjC,KAAK,CAACkC,aAAa,CAACC,KAAK,CAACC,MAAM,CAACL,GAAG;KACjD,MAAM;MAAA,IAAAM,qBAAA,EAAAC,sBAAA;MACH,MAAMC,sBAAsB,GAAGC,MAAM,CAACC,IAAI,CAACzC,KAAK,CAACkC,aAAa,CAACC,KAAK,CAACC,MAAM,CAACM,KAAK,CAAC,CAAC,CAAC,CAAC;MACrF,MAAMC,UAAU,IAAAN,qBAAA,GAAGhE,KAAK,CAACuE,aAAa,EAAE,CAACC,IAAI,CAACC,MAAM,IAAIA,MAAM,CAAC5C,EAAE,KAAKqC,sBAAsB,CAAC,cAAAF,qBAAA,wBAAAC,sBAAA,GAA1ED,qBAAA,CAA4EU,SAAS,CAAC/D,IAAI,cAAAsD,sBAAA,uBAA1FA,sBAAA,CAA4FU,MAAM;MACrHf,OAAO,MAAMU,eAAe3C,KAAK,CAACkC,aAAa,CAACC,KAAK,CAACC,MAAM,CAACM,KAAK,CAACH,sBAAsB,GAAG;;IAGhGhB,KAAK,CAACK,IAAI,eACNzC,6BAAC8D,OAAO;MAACC,GAAG,EAAElD,KAAK,CAACC,KAAK;MAAEe,KAAK,EAAEiB;oBAC9B9C;MAAMgE,SAAS,EAAC,WAAW;MAACC,OAAO,EAAEpB,WAAW;MAAEqB,IAAI,EAAC;OAClD7B,iBAAiB,GAAGxB,KAAK,CAACkC,aAAa,CAACC,KAAK,CAACmB,QAAQ,CAAC9B,iBAAiB,CAACtB,EAAE,CAAC,GAAGG,QAAQ,GAAG,CAAC,CACzF,CACD,CACb;;IAGD,IAAIhB,wBAAwB,CAAC4B,MAAM,GAAG,CAAC,IAAIU,KAAK,GAAGtC,wBAAwB,CAAC4B,MAAM,GAAG,CAAC,EAAE;MACpFM,KAAK,CAACK,IAAI,CAAC,IAAI,CAAC;;GAEvB,CAAC;;EAGF,MAAM2B,OAAO,GAAG,CAAChC,KAAK,CAACN,MAAM,KAAK,CAAC,GAAGvC,eAAe,CAACwC,KAAK,CAACsC,UAAU,GAAG9E,eAAe,CAACwC,KAAK,CAACuC,aAAa,EACvGC,KAAK,CAAC,WAAW,CAAC,CAClBC,GAAG,CAACC,IAAI;IACL,IAAIA,IAAI,KAAK,UAAU,EAAE;MAAA,IAAAC,qBAAA,EAAAC,sBAAA;MACrB,QAAAD,qBAAA,GAAOrC,iBAAiB,aAAjBA,iBAAiB,wBAAAsC,sBAAA,GAAjBtC,iBAAiB,CAAEuB,SAAS,CAAC/D,IAAI,cAAA8E,sBAAA,uBAAjCA,sBAAA,CAAmCd,MAAM,cAAAa,qBAAA,cAAAA,qBAAA,GAAInF,eAAe,CAACwC,KAAK,CAAC6C,UAAU;;IAGxF,IAAIH,IAAI,KAAK,OAAO,EAAE;MAClB,OAAOrC,KAAK;;IAGhB,OAAOqC,IAAI;GACd,CAAC;EAEN,MAAMI,kBAAkB,GAAGA;IACvB3F,KAAK,CAAC4F,iBAAiB,EAAE;IACzB5F,KAAK,CAAC6F,kBAAkB,EAAE;IAE1B1D,qBAAqB,CAAC;MAClB,MAAMH,QAAQ,GAAGhC,KAAK,CAACsB,WAAW,EAAE,CAACC,IAAI,CAACkC,SAAS,CAACC,GAAG,IAAIA,GAAG,CAAC7B,EAAE,KAAKjB,qBAAqB,CAAC;MAE5F,IAAIoB,QAAQ,GAAG,CAAC,CAAC,EAAE;QACfD,WAAW,CAACC,QAAQ,CAAC;;MAGzBnB,wBAAwB,CAAC,KAAK,CAAC;KAClC,CAAC;GACL;EAED,oBACIC,yEACIA,6BAACgF,OAAS,oBAAK5F,UAAU;IAAE6F,KAAK,EAAC;mBAC7BjF;IAAMgE,SAAS,EAAC;KAAanC,KAAK,CAAQ,YAAOuC,OAAO,CAChD,eACZpE,6BAACkF,iBAAiB;IACdC,IAAI,EAAErF,qBAAqB,KAAK,KAAK;IACrCsF,QAAQ,EAAEA,MAAMrF,wBAAwB,CAAC,KAAK,CAAC;IAC/CsF,QAAQ,EAAER;IACZ,CACH;AAEX;AAMA,SAASK,iBAAiBA,CAAClG,KAA6B;EACpD,MAAM;IAAEqG,QAAQ,EAAEC,YAAY;IAAE,GAAGC;GAAa,GAAGvG,KAAK;EACxD,MAAM;IAAEK;GAAO,GAAGC,eAAe,EAAE;EAEnC,oBACIU,6BAACwF,MAAM,oBAAKD,WAAW;IAAEE,IAAI,EAAC;mBAC1BzF,6BAACwF,MAAM,CAACE,OAAO;kBAAY;kBACvB1F,6BAACwF,MAAM,CAACG,KAAK,QAAEtG,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,UAAU,CAACkG,kBAAkB,CAAC/D,KAAK,CAAgB,eAEvF7B,wCAAIX,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,UAAU,CAACkG,kBAAkB,CAACC,WAAW,CAAK,eAEvE7F,6BAACwF,MAAM,CAACM,MAAM,qBACV9F,6BAAC+F,KAAK,qBACF/F,6BAACwF,MAAM,CAACQ,KAAK,qBACThG,6BAACiG,MAAM,QAAE5G,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,UAAU,CAACkG,kBAAkB,CAACM,MAAM,CAAU,CACjE,eACflG,6BAACiG,MAAM;IAACE,UAAU,EAAC,SAAS;IAAClC,OAAO,EAAEqB;KACjCjG,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,UAAU,CAACkG,kBAAkB,CAACQ,OAAO,CACtD,CACL,CACI,CACH,CACZ;AAEjB;;;;"}
+{"version":3,"file":"Alert.js","sources":["../../../../../../../../../src/components/Table3/components/Editing/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions as ReactVirtualScrollToOptions } from '@tanstack/react-virtual';\nimport { Alert as BaseAlert, AlertProps as BaseAlertProps } from '../../../Alert/Alert';\nimport { TableRef } from '../../../../primitives/Table/types';\nimport { Tooltip } from '../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\nimport { Button } from '../../../Button/Button';\n\ntype AlertProps<TType = unknown> = Omit<BaseAlertProps, 'children'> & {\n    scrollToIndex: (index: number, options: ReactVirtualScrollToOptions) => void;\n    table: ReactTable<TType>;\n    tableRef: React.RefObject<TableRef>;\n};\n\nexport function Alert<TType = unknown>(props: AlertProps<TType>) {\n    const { scrollToIndex, table, tableRef, ...attributes } = props;\n    const { texts } = useLocalization();\n    const validationTexts = texts.table3.editing.validation;\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n    const [showFilterResetDialog, setShowFilterResetDialog] = React.useState<string | false>(false);\n\n    const pendingChangesWithErrors = tableMeta.editing.getErrors<TType>();\n    const deletePendingChange = tableMeta.editing.resetChanges;\n\n    const allRows = table.getPreFilteredRowModel().rows;\n\n    // This effect deletes error in the alert if the row that has the error is deleted.\n    React.useEffect(() => {\n        pendingChangesWithErrors.forEach(errorRow => {\n            const errorRowId = errorRow.rowId;\n\n            try {\n                // getRow throws error if it fails to find the row\n                if (!table.getRow(errorRowId)) {\n                    deletePendingChange(errorRowId);\n                }\n            } catch {\n                deletePendingChange(errorRowId);\n            }\n        });\n    }, [allRows.length]);\n\n    const activeRow = React.useMemo(\n        () => (tableMeta.rowActive.rowActiveIndex ? table.getRowModel().rows[tableMeta.rowActive.rowActiveIndex] : undefined),\n        [tableMeta.rowActive.rowActiveIndex]\n    );\n\n    // mark errors being rendered as seen\n    React.useEffect(() => {\n        pendingChangesWithErrors.forEach(error => {\n            if (activeRow && error.rowId === activeRow.id) {\n                return;\n            }\n\n            tableMeta.editing.setRowErrorsSeen(error.rowId);\n        });\n    }, [pendingChangesWithErrors]);\n\n    function scrollToRow(rowIndex: number) {\n        tableMeta.rowActive.setRowActiveIndex(rowIndex);\n        scrollToIndex(rowIndex, { align: 'center' });\n\n        requestAnimationFrame(() => {\n            const cell = tableRef.current?.querySelector(\n                'tbody > tr[data-row-active=\"true\"] > td[data-cell-editing-invalid=\"true\"]'\n            );\n\n            if (cell) {\n                (cell as HTMLElement).focus?.();\n            }\n        });\n    }\n\n    // generate the \"N unsaved entries\" title\n    const title = (\n        pendingChangesWithErrors.length === 1 ? validationTexts.alert.titleOne : validationTexts.alert.titlePlural\n    ).replace('[COUNT]', String(pendingChangesWithErrors.length));\n\n    // generate links to each invalid row, to go into the error message\n    const links: React.ReactNode[] = [];\n    const rowIdentityColumn = tableMeta.rowIdentityColumnId\n        ? // Since rowIdentityColumnId can have multiple ids, we use the first id to refer to the row in Alert\n          table.getColumn(tableMeta.rowIdentityColumnId[0])\n        : undefined;\n\n    pendingChangesWithErrors.forEach((error, index) => {\n        // if appropriate, concatenate the item with the text \"and\"\n        if (pendingChangesWithErrors.length > 1 && index === pendingChangesWithErrors.length - 1) {\n            // Add space before and after `messageAnd` text\n            links.push(` ${validationTexts.alert.messageAnd} `);\n        }\n\n        const rowIndex = table.getFilteredRowModel().rows.findIndex(row => row.id === error.rowId);\n\n        const handleClick = () => {\n            // if row is visible\n            if (rowIndex > -1) {\n                scrollToRow(rowIndex);\n            }\n            // if row is filtered out\n            else {\n                setShowFilterResetDialog(error.rowId);\n            }\n        };\n\n        let tooltip;\n\n        if (error.pendingChange._meta.errors.row) {\n            tooltip = error.pendingChange._meta.errors.row;\n        } else {\n            const firstCellErrorColumnId = Object.keys(error.pendingChange._meta.errors.cells)[0];\n            const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n            tooltip = `${columnName}: ${error.pendingChange._meta.errors.cells[firstCellErrorColumnId]}`;\n        }\n\n        links.push(\n            <Tooltip key={error.rowId} title={tooltip}>\n                <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n                    {rowIdentityColumn ? error.pendingChange._meta.original[rowIdentityColumn.id] : rowIndex + 1}\n                </span>\n            </Tooltip>\n        );\n\n        // if appropriate, concatenate the item with the text \",\"\n        if (pendingChangesWithErrors.length > 2 && index < pendingChangesWithErrors.length - 2) {\n            links.push(', ');\n        }\n    });\n\n    // generate the \"Row N is incomplete and hasn't been saved\" error message\n    const message = (links.length === 1 ? validationTexts.alert.messageOne : validationTexts.alert.messagePlural)\n        .split(/(\\[\\w+\\])/)\n        .map(part => {\n            if (part === '[COLUMN]') {\n                return rowIdentityColumn?.columnDef.meta?.header ?? validationTexts.alert.messageRow;\n            }\n\n            if (part === '[ROW]') {\n                return links;\n            }\n\n            return part;\n        });\n\n    const handleResetFilters = () => {\n        table.resetGlobalFilter();\n        table.resetColumnFilters();\n\n        requestAnimationFrame(() => {\n            const rowIndex = table.getRowModel().rows.findIndex(row => row.id === showFilterResetDialog);\n\n            if (rowIndex > -1) {\n                scrollToRow(rowIndex);\n            }\n\n            setShowFilterResetDialog(false);\n        });\n    };\n\n    return (\n        <>\n            <BaseAlert {...attributes} state=\"error\">\n                <span className=\"font-bold\">{title}</span>&nbsp;{message}\n            </BaseAlert>\n            <FilterResetDialog\n                open={showFilterResetDialog !== false}\n                onChange={() => setShowFilterResetDialog(false)}\n                onSubmit={handleResetFilters}\n            />\n        </>\n    );\n}\n\ntype FilterResetDialogProps = Omit<DialogProps, 'children'> & {\n    onSubmit: () => void;\n};\n\nfunction FilterResetDialog(props: FilterResetDialogProps) {\n    const { onSubmit: handleSubmit, ...dialogProps } = props;\n    const { texts } = useLocalization();\n\n    return (\n        <Dialog {...dialogProps} size=\"xs\">\n            <Dialog.Content aria-label=\"Create a new account\">\n                <Dialog.Title>{texts.table3.editing.validation.resetFiltersDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.editing.validation.resetFiltersDialog.description}</p>\n\n                <Dialog.Footer>\n                    <Group>\n                        <Dialog.Close>\n                            <Button>{texts.table3.editing.validation.resetFiltersDialog.cancel}</Button>\n                        </Dialog.Close>\n                        <Button appearance=\"primary\" onClick={handleSubmit}>\n                            {texts.table3.editing.validation.resetFiltersDialog.confirm}\n                        </Button>\n                    </Group>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["Alert","props","scrollToIndex","table","tableRef","attributes","texts","useLocalization","validationTexts","table3","editing","validation","tableMeta","options","meta","showFilterResetDialog","setShowFilterResetDialog","React","useState","pendingChangesWithErrors","getErrors","deletePendingChange","resetChanges","allRows","getPreFilteredRowModel","rows","useEffect","forEach","errorRow","errorRowId","rowId","getRow","length","activeRow","useMemo","rowActive","rowActiveIndex","getRowModel","undefined","error","id","setRowErrorsSeen","scrollToRow","rowIndex","setRowActiveIndex","align","requestAnimationFrame","cell","_tableRef$current","current","querySelector","_cell$focus","focus","call","title","alert","titleOne","titlePlural","replace","String","links","rowIdentityColumn","rowIdentityColumnId","getColumn","index","push","messageAnd","getFilteredRowModel","findIndex","row","handleClick","tooltip","pendingChange","_meta","errors","_table$getAllColumns$","_table$getAllColumns$2","firstCellErrorColumnId","Object","keys","cells","columnName","getAllColumns","find","column","columnDef","header","Tooltip","key","className","onClick","role","original","message","messageOne","messagePlural","split","map","part","_rowIdentityColumn$co","_rowIdentityColumn$co2","messageRow","handleResetFilters","resetGlobalFilter","resetColumnFilters","BaseAlert","state","FilterResetDialog","open","onChange","onSubmit","handleSubmit","dialogProps","Dialog","size","Content","Title","resetFiltersDialog","description","Footer","Group","Close","Button","cancel","appearance","confirm"],"mappings":"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"}

package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js

@@ -15,12 +15,11 @@ function useTableRenderer(renderers, table, tableRef, defaultRowActiveIndex) {
   } = useRowHeightVirtualisation(table);
   // row groups
   const rangeExtractor = useRowGroupVirtualisation(table);
-  // account for thead and tfoot in the scroll area - both are always medium row height
+  // account for thead and tfoot in the scroll area
   const scrollPaddingStart = ROW_HEIGHT_ESTIMATES.medium;
   // column groups offset the bottom padding :shrug:, multiplying by 1.5 ensures the bottom padding remains
   // consistent when there are groups and when there aren't. 1.5 is relatively arbitrary, but it gives alignment
   const scrollPaddingEnd = ROW_HEIGHT_ESTIMATES.medium * (table.getHeaderGroups().length > 1 ? 1.5 : 1);
-  const scrollMargin = isTableRowGrouped ? 0 : scrollPaddingStart;
   const virtualiser = useVirtualizer({
     count: rows.length,
     estimateSize,
@@ -28,7 +27,7 @@ function useTableRenderer(renderers, table, tableRef, defaultRowActiveIndex) {
     overscan: tableMeta.printing.isPrinting ? rows.length : undefined,
     rangeExtractor,
     // correctly sets top and bottom spacing for the scroll container - very sensitive, don't change
-    scrollMargin,
+    scrollMargin: isTableRowGrouped ? 0 : scrollPaddingStart,
     // correctly sets the scroll padding offset, e.g. when keyboard navigating rows in the list
     scrollPaddingStart,
     scrollPaddingEnd: tableMeta.footer.isEnabled ? scrollPaddingEnd * 2 : scrollPaddingEnd
@@ -57,7 +56,7 @@ function useTableRenderer(renderers, table, tableRef, defaultRowActiveIndex) {
   // use row 1 not 0, because 0 might be sticky in grouped tables and it's start value will always be 0
   const paddingStartIndex = isTableRowGrouped && rows.length > 1 ? 1 : 0;
   // styling for offsetting rows - this "is" the virtualisation
-  const [paddingTop, paddingBottom] = virtualItems.length > 0 ? [Math.max(0, (_ref = ((_virtualItems$padding = virtualItems[paddingStartIndex]) === null || _virtualItems$padding === void 0 ? void 0 : _virtualItems$padding.start) - ((_virtualItems$padding2 = virtualItems[paddingStartIndex]) === null || _virtualItems$padding2 === void 0 ? void 0 : _virtualItems$padding2.size) - scrollMargin) !== null && _ref !== void 0 ? _ref : 0), Math.max(0, (_ref2 = totalSize - ((_virtualItems = virtualItems[virtualItems.length - 1]) === null || _virtualItems === void 0 ? void 0 : _virtualItems.end)) !== null && _ref2 !== void 0 ? _ref2 : 0)] : [0, 0];
+  const [paddingTop, paddingBottom] = virtualItems.length > 0 ? [Math.max(0, (_ref = ((_virtualItems$padding = virtualItems[paddingStartIndex]) === null || _virtualItems$padding === void 0 ? void 0 : _virtualItems$padding.start) - ((_virtualItems$padding2 = virtualItems[paddingStartIndex]) === null || _virtualItems$padding2 === void 0 ? void 0 : _virtualItems$padding2.size)) !== null && _ref !== void 0 ? _ref : 0), Math.max(0, (_ref2 = totalSize - ((_virtualItems = virtualItems[virtualItems.length - 1]) === null || _virtualItems === void 0 ? void 0 : _virtualItems.end)) !== null && _ref2 !== void 0 ? _ref2 : 0)] : [0, 0];
   // ensure default active rows are scrolled to
   React__default.useEffect(() => {
     if (defaultRowActiveIndex) {
@@ -72,7 +71,7 @@ function useTableRenderer(renderers, table, tableRef, defaultRowActiveIndex) {
   let content = null;
   if (rows.length) {
     style = {
-      height: `${totalSize - scrollMargin}px`,
+      height: `${totalSize}px`,
       paddingBottom,
       paddingTop
     };