@economic/taco 9.0.0 → 9.0.1-taco-docs-publishing.0

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

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

package/dist/components/Table3/components/Editing/Alert.cjs

@@ -5,8 +5,8 @@ const Alert$1 = require("../../../Alert/Alert.cjs");
 const Tooltip = require("../../../Tooltip/Tooltip.cjs");
 const Localization = require("../../../Provider/Localization.cjs");
 const Dialog = require("../../../Dialog/Dialog.cjs");
-const Group = require("../../../Group/Group.cjs");
 const Button = require("../../../LegacyComponents/Button/Button.cjs");
+const Inline = require("../../../Inline/Inline.cjs");
 function Alert(props) {
   const { scrollToIndex, table, tableRef, ...attributes } = props;
   const { texts } = Localization.useLocalization();
@@ -101,7 +101,7 @@ function Alert(props) {
 function FilterResetDialog(props) {
   const { onSubmit: handleSubmit, ...dialogProps } = props;
   const { texts } = Localization.useLocalization();
-  return /* @__PURE__ */ React.createElement(Dialog.Dialog, { ...dialogProps, size: "xs" }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Content, { "aria-label": "Create a new account" }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Title, null, texts.table3.editing.validation.resetFiltersDialog.title), /* @__PURE__ */ React.createElement("p", null, texts.table3.editing.validation.resetFiltersDialog.description), /* @__PURE__ */ React.createElement(Dialog.Dialog.Footer, null, /* @__PURE__ */ React.createElement(Group.Group, null, /* @__PURE__ */ React.createElement(Dialog.Dialog.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, null, texts.table3.editing.validation.resetFiltersDialog.cancel)), /* @__PURE__ */ React.createElement(Button.LegacyButton, { appearance: "primary", onClick: handleSubmit }, texts.table3.editing.validation.resetFiltersDialog.confirm)))));
+  return /* @__PURE__ */ React.createElement(Dialog.Dialog, { ...dialogProps, size: "xs" }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Content, { "aria-label": "Create a new account" }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Title, null, texts.table3.editing.validation.resetFiltersDialog.title), /* @__PURE__ */ React.createElement("p", null, texts.table3.editing.validation.resetFiltersDialog.description), /* @__PURE__ */ React.createElement(Dialog.Dialog.Footer, null, /* @__PURE__ */ React.createElement(Inline.Inline, { spacing: 8, alignInline: "end" }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, null, texts.table3.editing.validation.resetFiltersDialog.cancel)), /* @__PURE__ */ React.createElement(Button.LegacyButton, { appearance: "primary", onClick: handleSubmit }, texts.table3.editing.validation.resetFiltersDialog.confirm)))));
 }
 exports.Alert = Alert;
 //# sourceMappingURL=Alert.cjs.map

package/dist/components/Table3/components/Editing/Alert.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.cjs","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 { LegacyButton } from '../../../LegacyComponents/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<number | false>(false);\n    const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert<TType>();\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 visibleColumns = table.getVisibleFlatColumns().map(c => c.id);\n    const rowIdentityColumn =\n        tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor))\n            ? // table.getColumn(columName) throw error in strict dev mode. Related thread: https://github.com/TanStack/table/discussions/5505\n              table.getAllColumns().find(x => x.id === String(tableMeta.rowIdentityAccessor))\n            : undefined;\n\n    pendingChangesWithErrors.forEach((pendingChangeWithError, 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        // note: if this row click functionality is removed, indexes can be removed from useEditingState\n        const handleClick = () => {\n            // if row is visible\n            if (pendingChangeWithError.index > -1) {\n                scrollToRow(pendingChangeWithError.index);\n                tableMeta.rowActive.setRowActiveIndex(pendingChangeWithError.index);\n            }\n            // if row is filtered out\n            else {\n                setShowFilterResetDialog(pendingChangeWithError.index);\n            }\n        };\n\n        let tooltip;\n\n        if (pendingChangeWithError.errors.row) {\n            tooltip = pendingChangeWithError.errors.row;\n        } else {\n            const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];\n            const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n\n            if (columnName && firstCellErrorColumnId) {\n                tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;\n            }\n        }\n\n        let row;\n        try {\n            row = table.getRow(pendingChangeWithError.rowId).original;\n        } catch {\n            // because of server loading, some rows may not be accessible\n        }\n\n        links.push(\n            <Tooltip key={pendingChangeWithError.rowId} title={tooltip}>\n                <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n                    {rowIdentityColumn ? row?.[rowIdentityColumn.id as keyof TType] : pendingChangeWithError.index + 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            if (showFilterResetDialog && showFilterResetDialog > -1) {\n                scrollToRow(showFilterResetDialog);\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                            <LegacyButton>{texts.table3.editing.validation.resetFiltersDialog.cancel}</LegacyButton>\n                        </Dialog.Close>\n                        <LegacyButton appearance=\"primary\" onClick={handleSubmit}>\n                            {texts.table3.editing.validation.resetFiltersDialog.confirm}\n                        </LegacyButton>\n                    </Group>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["useLocalization","Tooltip","BaseAlert","Dialog","Group","LegacyButton"],"mappings":"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"}
+{"version":3,"file":"Alert.cjs","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 { LegacyButton } from '../../../LegacyComponents/Button/Button';\nimport { Inline } from '../../../Inline/Inline';\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<number | false>(false);\n    const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert<TType>();\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 visibleColumns = table.getVisibleFlatColumns().map(c => c.id);\n    const rowIdentityColumn =\n        tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor))\n            ? // table.getColumn(columName) throw error in strict dev mode. Related thread: https://github.com/TanStack/table/discussions/5505\n              table.getAllColumns().find(x => x.id === String(tableMeta.rowIdentityAccessor))\n            : undefined;\n\n    pendingChangesWithErrors.forEach((pendingChangeWithError, 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        // note: if this row click functionality is removed, indexes can be removed from useEditingState\n        const handleClick = () => {\n            // if row is visible\n            if (pendingChangeWithError.index > -1) {\n                scrollToRow(pendingChangeWithError.index);\n                tableMeta.rowActive.setRowActiveIndex(pendingChangeWithError.index);\n            }\n            // if row is filtered out\n            else {\n                setShowFilterResetDialog(pendingChangeWithError.index);\n            }\n        };\n\n        let tooltip;\n\n        if (pendingChangeWithError.errors.row) {\n            tooltip = pendingChangeWithError.errors.row;\n        } else {\n            const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];\n            const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n\n            if (columnName && firstCellErrorColumnId) {\n                tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;\n            }\n        }\n\n        let row;\n        try {\n            row = table.getRow(pendingChangeWithError.rowId).original;\n        } catch {\n            // because of server loading, some rows may not be accessible\n        }\n\n        links.push(\n            <Tooltip key={pendingChangeWithError.rowId} title={tooltip}>\n                <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n                    {rowIdentityColumn ? row?.[rowIdentityColumn.id as keyof TType] : pendingChangeWithError.index + 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            if (showFilterResetDialog && showFilterResetDialog > -1) {\n                scrollToRow(showFilterResetDialog);\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                    <Inline spacing={8} alignInline=\"end\">\n                        <Dialog.Close>\n                            <LegacyButton>{texts.table3.editing.validation.resetFiltersDialog.cancel}</LegacyButton>\n                        </Dialog.Close>\n                        <LegacyButton appearance=\"primary\" onClick={handleSubmit}>\n                            {texts.table3.editing.validation.resetFiltersDialog.confirm}\n                        </LegacyButton>\n                    </Inline>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["useLocalization","Tooltip","BaseAlert","Dialog","Inline","LegacyButton"],"mappings":"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"}

package/dist/components/Table3/components/Editing/Alert.js

@@ -3,8 +3,8 @@ import { Alert as Alert$1 } from "../../../Alert/Alert.js";
 import { Tooltip } from "../../../Tooltip/Tooltip.js";
 import { useLocalization } from "../../../Provider/Localization.js";
 import { Dialog } from "../../../Dialog/Dialog.js";
-import { Group } from "../../../Group/Group.js";
 import { LegacyButton } from "../../../LegacyComponents/Button/Button.js";
+import { Inline } from "../../../Inline/Inline.js";
 function Alert(props) {
   const { scrollToIndex, table, tableRef, ...attributes } = props;
   const { texts } = useLocalization();
@@ -99,7 +99,7 @@ function Alert(props) {
 function FilterResetDialog(props) {
   const { onSubmit: handleSubmit, ...dialogProps } = props;
   const { texts } = useLocalization();
-  return /* @__PURE__ */ React__default.createElement(Dialog, { ...dialogProps, size: "xs" }, /* @__PURE__ */ React__default.createElement(Dialog.Content, { "aria-label": "Create a new account" }, /* @__PURE__ */ React__default.createElement(Dialog.Title, null, texts.table3.editing.validation.resetFiltersDialog.title), /* @__PURE__ */ React__default.createElement("p", null, texts.table3.editing.validation.resetFiltersDialog.description), /* @__PURE__ */ React__default.createElement(Dialog.Footer, null, /* @__PURE__ */ React__default.createElement(Group, null, /* @__PURE__ */ React__default.createElement(Dialog.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, null, texts.table3.editing.validation.resetFiltersDialog.cancel)), /* @__PURE__ */ React__default.createElement(LegacyButton, { appearance: "primary", onClick: handleSubmit }, texts.table3.editing.validation.resetFiltersDialog.confirm)))));
+  return /* @__PURE__ */ React__default.createElement(Dialog, { ...dialogProps, size: "xs" }, /* @__PURE__ */ React__default.createElement(Dialog.Content, { "aria-label": "Create a new account" }, /* @__PURE__ */ React__default.createElement(Dialog.Title, null, texts.table3.editing.validation.resetFiltersDialog.title), /* @__PURE__ */ React__default.createElement("p", null, texts.table3.editing.validation.resetFiltersDialog.description), /* @__PURE__ */ React__default.createElement(Dialog.Footer, null, /* @__PURE__ */ React__default.createElement(Inline, { spacing: 8, alignInline: "end" }, /* @__PURE__ */ React__default.createElement(Dialog.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, null, texts.table3.editing.validation.resetFiltersDialog.cancel)), /* @__PURE__ */ React__default.createElement(LegacyButton, { appearance: "primary", onClick: handleSubmit }, texts.table3.editing.validation.resetFiltersDialog.confirm)))));
 }
 export {
   Alert

package/dist/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 { LegacyButton } from '../../../LegacyComponents/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<number | false>(false);\n    const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert<TType>();\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 visibleColumns = table.getVisibleFlatColumns().map(c => c.id);\n    const rowIdentityColumn =\n        tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor))\n            ? // table.getColumn(columName) throw error in strict dev mode. Related thread: https://github.com/TanStack/table/discussions/5505\n              table.getAllColumns().find(x => x.id === String(tableMeta.rowIdentityAccessor))\n            : undefined;\n\n    pendingChangesWithErrors.forEach((pendingChangeWithError, 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        // note: if this row click functionality is removed, indexes can be removed from useEditingState\n        const handleClick = () => {\n            // if row is visible\n            if (pendingChangeWithError.index > -1) {\n                scrollToRow(pendingChangeWithError.index);\n                tableMeta.rowActive.setRowActiveIndex(pendingChangeWithError.index);\n            }\n            // if row is filtered out\n            else {\n                setShowFilterResetDialog(pendingChangeWithError.index);\n            }\n        };\n\n        let tooltip;\n\n        if (pendingChangeWithError.errors.row) {\n            tooltip = pendingChangeWithError.errors.row;\n        } else {\n            const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];\n            const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n\n            if (columnName && firstCellErrorColumnId) {\n                tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;\n            }\n        }\n\n        let row;\n        try {\n            row = table.getRow(pendingChangeWithError.rowId).original;\n        } catch {\n            // because of server loading, some rows may not be accessible\n        }\n\n        links.push(\n            <Tooltip key={pendingChangeWithError.rowId} title={tooltip}>\n                <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n                    {rowIdentityColumn ? row?.[rowIdentityColumn.id as keyof TType] : pendingChangeWithError.index + 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            if (showFilterResetDialog && showFilterResetDialog > -1) {\n                scrollToRow(showFilterResetDialog);\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                            <LegacyButton>{texts.table3.editing.validation.resetFiltersDialog.cancel}</LegacyButton>\n                        </Dialog.Close>\n                        <LegacyButton appearance=\"primary\" onClick={handleSubmit}>\n                            {texts.table3.editing.validation.resetFiltersDialog.confirm}\n                        </LegacyButton>\n                    </Group>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["React","BaseAlert"],"mappings":"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"}
+{"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 { LegacyButton } from '../../../LegacyComponents/Button/Button';\nimport { Inline } from '../../../Inline/Inline';\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<number | false>(false);\n    const pendingChangesWithErrors = tableMeta.editing.getErrorsShownInAlert<TType>();\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 visibleColumns = table.getVisibleFlatColumns().map(c => c.id);\n    const rowIdentityColumn =\n        tableMeta.rowIdentityAccessor && visibleColumns.includes(String(tableMeta.rowIdentityAccessor))\n            ? // table.getColumn(columName) throw error in strict dev mode. Related thread: https://github.com/TanStack/table/discussions/5505\n              table.getAllColumns().find(x => x.id === String(tableMeta.rowIdentityAccessor))\n            : undefined;\n\n    pendingChangesWithErrors.forEach((pendingChangeWithError, 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        // note: if this row click functionality is removed, indexes can be removed from useEditingState\n        const handleClick = () => {\n            // if row is visible\n            if (pendingChangeWithError.index > -1) {\n                scrollToRow(pendingChangeWithError.index);\n                tableMeta.rowActive.setRowActiveIndex(pendingChangeWithError.index);\n            }\n            // if row is filtered out\n            else {\n                setShowFilterResetDialog(pendingChangeWithError.index);\n            }\n        };\n\n        let tooltip;\n\n        if (pendingChangeWithError.errors.row) {\n            tooltip = pendingChangeWithError.errors.row;\n        } else {\n            const firstCellErrorColumnId = Object.keys(pendingChangeWithError.errors.cells)[0];\n            const columnName = table.getAllColumns().find(column => column.id === firstCellErrorColumnId)?.columnDef.meta?.header;\n\n            if (columnName && firstCellErrorColumnId) {\n                tooltip = `${columnName}: ${pendingChangeWithError.errors.cells[firstCellErrorColumnId]}`;\n            }\n        }\n\n        let row;\n        try {\n            row = table.getRow(pendingChangeWithError.rowId).original;\n        } catch {\n            // because of server loading, some rows may not be accessible\n        }\n\n        links.push(\n            <Tooltip key={pendingChangeWithError.rowId} title={tooltip}>\n                <span className=\"text-blue\" onClick={handleClick} role=\"button\">\n                    {rowIdentityColumn ? row?.[rowIdentityColumn.id as keyof TType] : pendingChangeWithError.index + 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            if (showFilterResetDialog && showFilterResetDialog > -1) {\n                scrollToRow(showFilterResetDialog);\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                    <Inline spacing={8} alignInline=\"end\">\n                        <Dialog.Close>\n                            <LegacyButton>{texts.table3.editing.validation.resetFiltersDialog.cancel}</LegacyButton>\n                        </Dialog.Close>\n                        <LegacyButton appearance=\"primary\" onClick={handleSubmit}>\n                            {texts.table3.editing.validation.resetFiltersDialog.confirm}\n                        </LegacyButton>\n                    </Inline>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["React","BaseAlert"],"mappings":"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"}

package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.cjs

@@ -5,9 +5,9 @@ const focus = require("@react-aria/focus");
 const dialog = require("@base-ui/react/dialog");
 const Dialog = require("../../../Dialog/Dialog.cjs");
 const Localization = require("../../../Provider/Localization.cjs");
-const Group = require("../../../Group/Group.cjs");
 const Button = require("../../../LegacyComponents/Button/Button.cjs");
 const IconButton = require("../../../LegacyComponents/IconButton/IconButton.cjs");
+const Inline = require("../../../Inline/Inline.cjs");
 function DiscardChangesConfirmationDialog(props) {
   const { onDiscard: handleDiscard, ...dialogProps } = props;
   const { texts } = Localization.useLocalization();
@@ -29,7 +29,7 @@ function DiscardChangesConfirmationDialog(props) {
     },
     /* @__PURE__ */ React.createElement(Dialog.Dialog.Title, null, texts.table3.editing.clearChangesConfirmationDialog.title),
     /* @__PURE__ */ React.createElement("p", null, texts.table3.editing.clearChangesConfirmationDialog.description),
-    /* @__PURE__ */ React.createElement(focus.FocusScope, { contain: true, restoreFocus: true }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Footer, null, /* @__PURE__ */ React.createElement(Group.Group, null, /* @__PURE__ */ React.createElement(Dialog.Dialog.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, { tabIndex: 0 }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /* @__PURE__ */ React.createElement(Dialog.Dialog.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, { tabIndex: 0, appearance: "primary", onClick: handleDiscard }, texts.table3.editing.clearChangesConfirmationDialog.confirm)))), /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React.createElement(focus.FocusScope, { contain: true, restoreFocus: true }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Footer, null, /* @__PURE__ */ React.createElement(Inline.Inline, { spacing: 8 }, /* @__PURE__ */ React.createElement(Dialog.Dialog.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, { tabIndex: 0 }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /* @__PURE__ */ React.createElement(Dialog.Dialog.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, { tabIndex: 0, appearance: "primary", onClick: handleDiscard }, texts.table3.editing.clearChangesConfirmationDialog.confirm)))), /* @__PURE__ */ React.createElement(
       dialog.Dialog.Close,
       {
         render: /* @__PURE__ */ React.createElement(

package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DiscardChangesConfirmationDialog.cjs","sources":["../../../../../src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Group } from '../../../Group/Group';\nimport { LegacyButton } from '../../../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../../../LegacyComponents/IconButton/IconButton';\n\ntype DiscardChangesConfirmationDialogProps = Partial<DialogProps> & {\n    onDiscard: () => void;\n};\n\nexport function DiscardChangesConfirmationDialog(props: DiscardChangesConfirmationDialogProps) {\n    const { onDiscard: handleDiscard, ...dialogProps } = props;\n    const { texts } = useLocalization();\n\n    const handleClickInsideDialogContent = (event: React.MouseEvent) => {\n        // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs\n        // inside the dialog\n        event.stopPropagation();\n    };\n\n    const handleKeydown = (event: React.KeyboardEvent) => {\n        if (event.key !== 'Escape') {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Dialog {...dialogProps} showCloseButton={false}>\n            <Dialog.Content\n                data-taco=\"discard-changes-dialog\"\n                aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}\n                onClick={handleClickInsideDialogContent}\n                onKeyDown={handleKeydown}>\n                <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.editing.clearChangesConfirmationDialog.description}</p>\n\n                <FocusScope contain restoreFocus>\n                    <Dialog.Footer>\n                        <Group>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.cancel}\n                                </LegacyButton>\n                            </Dialog.Close>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0} appearance=\"primary\" onClick={handleDiscard}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                </LegacyButton>\n                            </Dialog.Close>\n                        </Group>\n                    </Dialog.Footer>\n\n                    {/* hiding default close button and adding one manually to allow it to be inside the focus scope */}\n                    <DialogPrimitive.Close\n                        render={\n                            <LegacyIconButton\n                                appearance=\"discrete\"\n                                aria-label={texts.dialog.close}\n                                className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                icon=\"close\"\n                            />\n                        }></DialogPrimitive.Close>\n                </FocusScope>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["useLocalization","Dialog","FocusScope","Group","LegacyButton","DialogPrimitive","LegacyIconButton"],"mappings":";;;;;;;;;;AAaO,SAAS,iCAAiC,OAA8C;AAC3F,QAAM,EAAE,WAAW,eAAe,GAAG,YAAgB,IAAA;AAC/C,QAAA,EAAE,MAAM,IAAIA,6BAAgB;AAE5B,QAAA,iCAAiC,CAAC,UAA4B;AAGhE,UAAM,gBAAgB;AAAA,EAC1B;AAEM,QAAA,gBAAgB,CAAC,UAA+B;AAC9C,QAAA,MAAM,QAAQ,UAAU;AACxB,YAAM,gBAAgB;AAAA,IAAA;AAAA,EAE9B;AAEA,SACK,sBAAA,cAAAC,OAAAA,QAAA,EAAQ,GAAG,aAAa,iBAAiB,SACtC,sBAAA;AAAA,IAACA,OAAAA,OAAO;AAAA,IAAP;AAAA,MACG,aAAU;AAAA,MACV,cAAY,MAAM,OAAO,QAAQ,+BAA+B;AAAA,MAChE,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,IACX,sBAAA,cAACA,cAAO,OAAP,MAAc,MAAM,OAAO,QAAQ,+BAA+B,KAAM;AAAA,wCAExE,KAAG,MAAA,MAAM,OAAO,QAAQ,+BAA+B,WAAY;AAAA,IAEpE,sBAAA,cAACC,MAAAA,cAAW,SAAO,MAAC,cAAY,KAC5B,GAAA,sBAAA,cAACD,OAAAA,OAAO,QAAP,0CACIE,MACG,OAAA,MAAA,sBAAA,cAACF,cAAO,OAAP,0CACIG,OAAAA,cAAa,EAAA,UAAU,EACnB,GAAA,MAAM,OAAO,QAAQ,+BAA+B,MACzD,CACJ,GACC,sBAAA,cAAAH,OAAA,OAAO,OAAP,MACG,sBAAA,cAACG,OAAa,cAAA,EAAA,UAAU,GAAG,YAAW,WAAU,SAAS,cAAA,GACpD,MAAM,OAAO,QAAQ,+BAA+B,OACzD,CACJ,CACJ,CACJ,GAGA,sBAAA;AAAA,MAACC,OAAAA,OAAgB;AAAA,MAAhB;AAAA,QACG,QACI,sBAAA;AAAA,UAACC,WAAA;AAAA,UAAA;AAAA,YACG,YAAW;AAAA,YACX,cAAY,MAAM,OAAO;AAAA,YACzB,WAAU;AAAA,YACV,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,IAEZ,CAAA;AAAA,EAAA,CAER;AAER;;"}
+{"version":3,"file":"DiscardChangesConfirmationDialog.cjs","sources":["../../../../../src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { LegacyButton } from '../../../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../../../LegacyComponents/IconButton/IconButton';\nimport { Inline } from '../../../Inline/Inline';\n\ntype DiscardChangesConfirmationDialogProps = Partial<DialogProps> & {\n    onDiscard: () => void;\n};\n\nexport function DiscardChangesConfirmationDialog(props: DiscardChangesConfirmationDialogProps) {\n    const { onDiscard: handleDiscard, ...dialogProps } = props;\n    const { texts } = useLocalization();\n\n    const handleClickInsideDialogContent = (event: React.MouseEvent) => {\n        // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs\n        // inside the dialog\n        event.stopPropagation();\n    };\n\n    const handleKeydown = (event: React.KeyboardEvent) => {\n        if (event.key !== 'Escape') {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Dialog {...dialogProps} showCloseButton={false}>\n            <Dialog.Content\n                data-taco=\"discard-changes-dialog\"\n                aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}\n                onClick={handleClickInsideDialogContent}\n                onKeyDown={handleKeydown}>\n                <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.editing.clearChangesConfirmationDialog.description}</p>\n\n                <FocusScope contain restoreFocus>\n                    <Dialog.Footer>\n                        <Inline spacing={8}>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.cancel}\n                                </LegacyButton>\n                            </Dialog.Close>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0} appearance=\"primary\" onClick={handleDiscard}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                </LegacyButton>\n                            </Dialog.Close>\n                        </Inline>\n                    </Dialog.Footer>\n\n                    {/* hiding default close button and adding one manually to allow it to be inside the focus scope */}\n                    <DialogPrimitive.Close\n                        render={\n                            <LegacyIconButton\n                                appearance=\"discrete\"\n                                aria-label={texts.dialog.close}\n                                className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                icon=\"close\"\n                            />\n                        }></DialogPrimitive.Close>\n                </FocusScope>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["useLocalization","Dialog","FocusScope","Inline","LegacyButton","DialogPrimitive","LegacyIconButton"],"mappings":";;;;;;;;;;AAaO,SAAS,iCAAiC,OAA8C;AAC3F,QAAM,EAAE,WAAW,eAAe,GAAG,YAAgB,IAAA;AAC/C,QAAA,EAAE,MAAM,IAAIA,6BAAgB;AAE5B,QAAA,iCAAiC,CAAC,UAA4B;AAGhE,UAAM,gBAAgB;AAAA,EAC1B;AAEM,QAAA,gBAAgB,CAAC,UAA+B;AAC9C,QAAA,MAAM,QAAQ,UAAU;AACxB,YAAM,gBAAgB;AAAA,IAAA;AAAA,EAE9B;AAEA,SACK,sBAAA,cAAAC,OAAAA,QAAA,EAAQ,GAAG,aAAa,iBAAiB,SACtC,sBAAA;AAAA,IAACA,OAAAA,OAAO;AAAA,IAAP;AAAA,MACG,aAAU;AAAA,MACV,cAAY,MAAM,OAAO,QAAQ,+BAA+B;AAAA,MAChE,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,IACX,sBAAA,cAACA,cAAO,OAAP,MAAc,MAAM,OAAO,QAAQ,+BAA+B,KAAM;AAAA,wCAExE,KAAG,MAAA,MAAM,OAAO,QAAQ,+BAA+B,WAAY;AAAA,IAEpE,sBAAA,cAACC,MAAAA,cAAW,SAAO,MAAC,cAAY,KAC5B,GAAA,sBAAA,cAACD,OAAO,OAAA,QAAP,MACG,sBAAA,cAACE,OAAAA,UAAO,SAAS,EAAA,uCACZF,OAAAA,OAAO,OAAP,MACI,sBAAA,cAAAG,OAAAA,cAAA,EAAa,UAAU,EAAA,GACnB,MAAM,OAAO,QAAQ,+BAA+B,MACzD,CACJ,GACA,sBAAA,cAACH,OAAAA,OAAO,OAAP,MACI,sBAAA,cAAAG,OAAAA,cAAA,EAAa,UAAU,GAAG,YAAW,WAAU,SAAS,cACpD,GAAA,MAAM,OAAO,QAAQ,+BAA+B,OACzD,CACJ,CACJ,CACJ,GAGA,sBAAA;AAAA,MAACC,OAAAA,OAAgB;AAAA,MAAhB;AAAA,QACG,QACI,sBAAA;AAAA,UAACC,WAAA;AAAA,UAAA;AAAA,YACG,YAAW;AAAA,YACX,cAAY,MAAM,OAAO;AAAA,YACzB,WAAU;AAAA,YACV,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,IAEZ,CAAA;AAAA,EAAA,CAER;AAER;;"}

package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js

@@ -3,9 +3,9 @@ import { FocusScope } from "@react-aria/focus";
 import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
 import { Dialog } from "../../../Dialog/Dialog.js";
 import { useLocalization } from "../../../Provider/Localization.js";
-import { Group } from "../../../Group/Group.js";
 import { LegacyButton } from "../../../LegacyComponents/Button/Button.js";
 import { LegacyIconButton } from "../../../LegacyComponents/IconButton/IconButton.js";
+import { Inline } from "../../../Inline/Inline.js";
 function DiscardChangesConfirmationDialog(props) {
   const { onDiscard: handleDiscard, ...dialogProps } = props;
   const { texts } = useLocalization();
@@ -27,7 +27,7 @@ function DiscardChangesConfirmationDialog(props) {
     },
     /* @__PURE__ */ React__default.createElement(Dialog.Title, null, texts.table3.editing.clearChangesConfirmationDialog.title),
     /* @__PURE__ */ React__default.createElement("p", null, texts.table3.editing.clearChangesConfirmationDialog.description),
-    /* @__PURE__ */ React__default.createElement(FocusScope, { contain: true, restoreFocus: true }, /* @__PURE__ */ React__default.createElement(Dialog.Footer, null, /* @__PURE__ */ React__default.createElement(Group, null, /* @__PURE__ */ React__default.createElement(Dialog.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, { tabIndex: 0 }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /* @__PURE__ */ React__default.createElement(Dialog.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, { tabIndex: 0, appearance: "primary", onClick: handleDiscard }, texts.table3.editing.clearChangesConfirmationDialog.confirm)))), /* @__PURE__ */ React__default.createElement(
+    /* @__PURE__ */ React__default.createElement(FocusScope, { contain: true, restoreFocus: true }, /* @__PURE__ */ React__default.createElement(Dialog.Footer, null, /* @__PURE__ */ React__default.createElement(Inline, { spacing: 8 }, /* @__PURE__ */ React__default.createElement(Dialog.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, { tabIndex: 0 }, texts.table3.editing.clearChangesConfirmationDialog.cancel)), /* @__PURE__ */ React__default.createElement(Dialog.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, { tabIndex: 0, appearance: "primary", onClick: handleDiscard }, texts.table3.editing.clearChangesConfirmationDialog.confirm)))), /* @__PURE__ */ React__default.createElement(
       Dialog$1.Close,
       {
         render: /* @__PURE__ */ React__default.createElement(

package/dist/components/Table3/components/Editing/DiscardChangesConfirmationDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"DiscardChangesConfirmationDialog.js","sources":["../../../../../src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Group } from '../../../Group/Group';\nimport { LegacyButton } from '../../../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../../../LegacyComponents/IconButton/IconButton';\n\ntype DiscardChangesConfirmationDialogProps = Partial<DialogProps> & {\n    onDiscard: () => void;\n};\n\nexport function DiscardChangesConfirmationDialog(props: DiscardChangesConfirmationDialogProps) {\n    const { onDiscard: handleDiscard, ...dialogProps } = props;\n    const { texts } = useLocalization();\n\n    const handleClickInsideDialogContent = (event: React.MouseEvent) => {\n        // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs\n        // inside the dialog\n        event.stopPropagation();\n    };\n\n    const handleKeydown = (event: React.KeyboardEvent) => {\n        if (event.key !== 'Escape') {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Dialog {...dialogProps} showCloseButton={false}>\n            <Dialog.Content\n                data-taco=\"discard-changes-dialog\"\n                aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}\n                onClick={handleClickInsideDialogContent}\n                onKeyDown={handleKeydown}>\n                <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.editing.clearChangesConfirmationDialog.description}</p>\n\n                <FocusScope contain restoreFocus>\n                    <Dialog.Footer>\n                        <Group>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.cancel}\n                                </LegacyButton>\n                            </Dialog.Close>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0} appearance=\"primary\" onClick={handleDiscard}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                </LegacyButton>\n                            </Dialog.Close>\n                        </Group>\n                    </Dialog.Footer>\n\n                    {/* hiding default close button and adding one manually to allow it to be inside the focus scope */}\n                    <DialogPrimitive.Close\n                        render={\n                            <LegacyIconButton\n                                appearance=\"discrete\"\n                                aria-label={texts.dialog.close}\n                                className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                icon=\"close\"\n                            />\n                        }></DialogPrimitive.Close>\n                </FocusScope>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["React","DialogPrimitive"],"mappings":";;;;;;;;AAaO,SAAS,iCAAiC,OAA8C;AAC3F,QAAM,EAAE,WAAW,eAAe,GAAG,YAAgB,IAAA;AAC/C,QAAA,EAAE,MAAM,IAAI,gBAAgB;AAE5B,QAAA,iCAAiC,CAAC,UAA4B;AAGhE,UAAM,gBAAgB;AAAA,EAC1B;AAEM,QAAA,gBAAgB,CAAC,UAA+B;AAC9C,QAAA,MAAM,QAAQ,UAAU;AACxB,YAAM,gBAAgB;AAAA,IAAA;AAAA,EAE9B;AAEA,SACKA,+BAAA,cAAA,QAAA,EAAQ,GAAG,aAAa,iBAAiB,SACtCA,+BAAA;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACG,aAAU;AAAA,MACV,cAAY,MAAM,OAAO,QAAQ,+BAA+B;AAAA,MAChE,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,IACXA,+BAAA,cAAC,OAAO,OAAP,MAAc,MAAM,OAAO,QAAQ,+BAA+B,KAAM;AAAA,iDAExE,KAAG,MAAA,MAAM,OAAO,QAAQ,+BAA+B,WAAY;AAAA,IAEpEA,+BAAA,cAAC,cAAW,SAAO,MAAC,cAAY,KAC5B,GAAAA,+BAAA,cAAC,OAAO,QAAP,mDACI,OACG,MAAAA,+BAAA,cAAC,OAAO,OAAP,mDACI,cAAa,EAAA,UAAU,EACnB,GAAA,MAAM,OAAO,QAAQ,+BAA+B,MACzD,CACJ,GACCA,+BAAA,cAAA,OAAO,OAAP,MACGA,+BAAA,cAAC,cAAa,EAAA,UAAU,GAAG,YAAW,WAAU,SAAS,cAAA,GACpD,MAAM,OAAO,QAAQ,+BAA+B,OACzD,CACJ,CACJ,CACJ,GAGAA,+BAAA;AAAA,MAACC,SAAgB;AAAA,MAAhB;AAAA,QACG,QACID,+BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,YAAW;AAAA,YACX,cAAY,MAAM,OAAO;AAAA,YACzB,WAAU;AAAA,YACV,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,IAEZ,CAAA;AAAA,EAAA,CAER;AAER;"}
+{"version":3,"file":"DiscardChangesConfirmationDialog.js","sources":["../../../../../src/components/Table3/components/Editing/DiscardChangesConfirmationDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { Dialog, DialogProps } from '../../../Dialog/Dialog';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { LegacyButton } from '../../../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../../../LegacyComponents/IconButton/IconButton';\nimport { Inline } from '../../../Inline/Inline';\n\ntype DiscardChangesConfirmationDialogProps = Partial<DialogProps> & {\n    onDiscard: () => void;\n};\n\nexport function DiscardChangesConfirmationDialog(props: DiscardChangesConfirmationDialogProps) {\n    const { onDiscard: handleDiscard, ...dialogProps } = props;\n    const { texts } = useLocalization();\n\n    const handleClickInsideDialogContent = (event: React.MouseEvent) => {\n        // Prevents the click event from propagating to the table, ensuring the row isn't saved when a click occurs\n        // inside the dialog\n        event.stopPropagation();\n    };\n\n    const handleKeydown = (event: React.KeyboardEvent) => {\n        if (event.key !== 'Escape') {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Dialog {...dialogProps} showCloseButton={false}>\n            <Dialog.Content\n                data-taco=\"discard-changes-dialog\"\n                aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}\n                onClick={handleClickInsideDialogContent}\n                onKeyDown={handleKeydown}>\n                <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.editing.clearChangesConfirmationDialog.description}</p>\n\n                <FocusScope contain restoreFocus>\n                    <Dialog.Footer>\n                        <Inline spacing={8}>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.cancel}\n                                </LegacyButton>\n                            </Dialog.Close>\n                            <Dialog.Close>\n                                <LegacyButton tabIndex={0} appearance=\"primary\" onClick={handleDiscard}>\n                                    {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                </LegacyButton>\n                            </Dialog.Close>\n                        </Inline>\n                    </Dialog.Footer>\n\n                    {/* hiding default close button and adding one manually to allow it to be inside the focus scope */}\n                    <DialogPrimitive.Close\n                        render={\n                            <LegacyIconButton\n                                appearance=\"discrete\"\n                                aria-label={texts.dialog.close}\n                                className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                icon=\"close\"\n                            />\n                        }></DialogPrimitive.Close>\n                </FocusScope>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["React","DialogPrimitive"],"mappings":";;;;;;;;AAaO,SAAS,iCAAiC,OAA8C;AAC3F,QAAM,EAAE,WAAW,eAAe,GAAG,YAAgB,IAAA;AAC/C,QAAA,EAAE,MAAM,IAAI,gBAAgB;AAE5B,QAAA,iCAAiC,CAAC,UAA4B;AAGhE,UAAM,gBAAgB;AAAA,EAC1B;AAEM,QAAA,gBAAgB,CAAC,UAA+B;AAC9C,QAAA,MAAM,QAAQ,UAAU;AACxB,YAAM,gBAAgB;AAAA,IAAA;AAAA,EAE9B;AAEA,SACKA,+BAAA,cAAA,QAAA,EAAQ,GAAG,aAAa,iBAAiB,SACtCA,+BAAA;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACG,aAAU;AAAA,MACV,cAAY,MAAM,OAAO,QAAQ,+BAA+B;AAAA,MAChE,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,IACXA,+BAAA,cAAC,OAAO,OAAP,MAAc,MAAM,OAAO,QAAQ,+BAA+B,KAAM;AAAA,iDAExE,KAAG,MAAA,MAAM,OAAO,QAAQ,+BAA+B,WAAY;AAAA,IAEpEA,+BAAA,cAAC,cAAW,SAAO,MAAC,cAAY,KAC5B,GAAAA,+BAAA,cAAC,OAAO,QAAP,MACGA,+BAAA,cAAC,UAAO,SAAS,EAAA,gDACZ,OAAO,OAAP,MACIA,+BAAA,cAAA,cAAA,EAAa,UAAU,EAAA,GACnB,MAAM,OAAO,QAAQ,+BAA+B,MACzD,CACJ,GACAA,+BAAA,cAAC,OAAO,OAAP,MACIA,+BAAA,cAAA,cAAA,EAAa,UAAU,GAAG,YAAW,WAAU,SAAS,cACpD,GAAA,MAAM,OAAO,QAAQ,+BAA+B,OACzD,CACJ,CACJ,CACJ,GAGAA,+BAAA;AAAA,MAACC,SAAgB;AAAA,MAAhB;AAAA,QACG,QACID,+BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,YAAW;AAAA,YACX,cAAY,MAAM,OAAO;AAAA,YACzB,WAAU;AAAA,YACV,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,IAEZ,CAAA;AAAA,EAAA,CAER;AAER;"}

package/dist/primitives/Table/Core/components/Toolbar/Toolbar.cjs

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const Group = require("../../../../../components/Group/Group.cjs");
 const Search = require("./components/Search/Search.cjs");
 const Settings = require("./components/Settings/Settings.cjs");
 const Print = require("./components/Print/Print.cjs");
@@ -25,7 +24,7 @@ function TableToolbar(props) {
       "data-taco": "table-toolbar"
     },
     table.props.toolbarLeft,
-    /* @__PURE__ */ React.createElement(Group.Group, { className: "ml-auto flex-shrink-0 items-center print:hidden" }, customTools, canFilter ? /* @__PURE__ */ React.createElement(Filters.Filters, { length: table.meta.length, tableId: table.id, table: table.instance }) : null, table.props.toolbarRight, canPrint ? /* @__PURE__ */ React.createElement(Print.Print, { table: table.instance, tableId: table.id, tableRef: table.ref }) : null, canSettings ? /* @__PURE__ */ React.createElement(Settings.Settings, { customSettings: table.props.customSettings, id: `${id}-settings`, table: table.instance }) : null, canSearch ? /* @__PURE__ */ React.createElement(Search.Search, { scrollToIndex: table.renderer.scrollToIndex, table: table.instance, tableRef: table.ref }) : null)
+    /* @__PURE__ */ React.createElement("div", { className: "ml-auto flex flex-shrink-0 items-center gap-2 print:hidden" }, customTools, canFilter ? /* @__PURE__ */ React.createElement(Filters.Filters, { length: table.meta.length, tableId: table.id, table: table.instance }) : null, table.props.toolbarRight, canPrint ? /* @__PURE__ */ React.createElement(Print.Print, { table: table.instance, tableId: table.id, tableRef: table.ref }) : null, canSettings ? /* @__PURE__ */ React.createElement(Settings.Settings, { customSettings: table.props.customSettings, id: `${id}-settings`, table: table.instance }) : null, canSearch ? /* @__PURE__ */ React.createElement(Search.Search, { scrollToIndex: table.renderer.scrollToIndex, table: table.instance, tableRef: table.ref }) : null)
   ), table.props.toolbarPanel ? /* @__PURE__ */ React.createElement("div", { className: "mb-4" }, table.props.toolbarPanel) : void 0);
 }
 function canChangeSettings(table, customSettings) {

package/dist/primitives/Table/Core/components/Toolbar/Toolbar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.cjs","sources":["../../../../../../src/primitives/Table/Core/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Group } from '../../../../../components/Group/Group';\nimport { Search } from './components/Search/Search';\nimport { Settings } from './components/Settings/Settings';\nimport { Print } from './components/Print/Print';\nimport { Filters } from './components/Filters/Filters';\nimport { TableCustomSettingsRenderer } from '../../../types';\nimport { useTableReturnValue } from '../../useTable';\n\nexport type TableToolbarProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    children?: JSX.Element | null;\n    table: useTableReturnValue<TType>;\n};\n\nexport function TableToolbar<TType = unknown>(props: TableToolbarProps<TType>) {\n    const { children: customTools, table, ...attributes } = props;\n\n    if (!isToolbarVisible<TType>(table, !!customTools)) {\n        return null;\n    }\n\n    const canFilter = table.instance.options.enableColumnFilters;\n    const canPrint = table.meta.printing.isEnabled;\n    const canSettings = canChangeSettings(table.instance, table.props.customSettings);\n    const canSearch = table.meta.search.isEnabled;\n\n    const id = `${table.id}-toolbar`;\n\n    return (\n        <>\n            <div\n                {...attributes}\n                id={id}\n                className=\"mb-4 flex flex-shrink flex-grow-0 flex-wrap gap-2 print:hidden\"\n                data-taco=\"table-toolbar\">\n                {table.props.toolbarLeft}\n                <Group className=\"ml-auto flex-shrink-0 items-center print:hidden\">\n                    {customTools}\n                    {canFilter ? <Filters length={table.meta.length} tableId={table.id} table={table.instance} /> : null}\n                    {table.props.toolbarRight}\n                    {canPrint ? <Print table={table.instance} tableId={table.id} tableRef={table.ref} /> : null}\n                    {canSettings ? (\n                        <Settings customSettings={table.props.customSettings} id={`${id}-settings`} table={table.instance} />\n                    ) : null}\n                    {canSearch ? (\n                        <Search scrollToIndex={table.renderer.scrollToIndex} table={table.instance} tableRef={table.ref} />\n                    ) : null}\n                </Group>\n            </div>\n            {table.props.toolbarPanel ? <div className=\"mb-4\">{table.props.toolbarPanel}</div> : undefined}\n        </>\n    );\n}\n\nfunction canChangeSettings<TType = unknown>(table: ReactTable<TType>, customSettings?: TableCustomSettingsRenderer) {\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n    return (\n        table.options.enableHiding ||\n        tableMeta.columnOrdering.isEnabled ||\n        tableMeta.fontSize.isEnabled ||\n        tableMeta.rowHeight.isEnabled ||\n        typeof customSettings === 'function'\n    );\n}\n\nfunction isToolbarVisible<TType = unknown>(table: useTableReturnValue<TType>, customTools: boolean) {\n    const hasInternalToolbar =\n        customTools ||\n        table.instance.options.enableColumnFilters ||\n        table.meta.printing.isEnabled ||\n        canChangeSettings(table.instance, table.props.customSettings) ||\n        table.meta.search.isEnabled;\n\n    return hasInternalToolbar || !!table.props.toolbarLeft || !!table.props.toolbarRight;\n}\n"],"names":["Group","Filters","Print","Settings","Search"],"mappings":";;;;;;;;AAeO,SAAS,aAA8B,OAAiC;AAC3E,QAAM,EAAE,UAAU,aAAa,OAAO,GAAG,WAAe,IAAA;AAExD,MAAI,CAAC,iBAAwB,OAAO,CAAC,CAAC,WAAW,GAAG;AACzC,WAAA;AAAA,EAAA;AAGL,QAAA,YAAY,MAAM,SAAS,QAAQ;AACnC,QAAA,WAAW,MAAM,KAAK,SAAS;AACrC,QAAM,cAAc,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc;AAC1E,QAAA,YAAY,MAAM,KAAK,OAAO;AAE9B,QAAA,KAAK,GAAG,MAAM,EAAE;AAEtB,SAEQ,sBAAA,cAAA,MAAA,UAAA,MAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,aAAU;AAAA,IAAA;AAAA,IACT,MAAM,MAAM;AAAA,IACZ,sBAAA,cAAAA,aAAA,EAAM,WAAU,kDAAA,GACZ,aACA,YAAa,sBAAA,cAAAC,QAAAA,SAAA,EAAQ,QAAQ,MAAM,KAAK,QAAQ,SAAS,MAAM,IAAI,OAAO,MAAM,UAAU,IAAK,MAC/F,MAAM,MAAM,cACZ,WAAY,sBAAA,cAAAC,MAAAA,OAAA,EAAM,OAAO,MAAM,UAAU,SAAS,MAAM,IAAI,UAAU,MAAM,IAAK,CAAA,IAAK,MACtF,cACG,sBAAA,cAACC,SAAAA,YAAS,gBAAgB,MAAM,MAAM,gBAAgB,IAAI,GAAG,EAAE,aAAa,OAAO,MAAM,SAAA,CAAU,IACnG,MACH,YACG,sBAAA,cAACC,OAAO,QAAA,EAAA,eAAe,MAAM,SAAS,eAAe,OAAO,MAAM,UAAU,UAAU,MAAM,IAAK,CAAA,IACjG,IACR;AAAA,EAEH,GAAA,MAAM,MAAM,eAAgB,sBAAA,cAAA,OAAA,EAAI,WAAU,OAAA,GAAQ,MAAM,MAAM,YAAa,IAAS,MACzF;AAER;AAEA,SAAS,kBAAmC,OAA0B,gBAA8C;AAC1G,QAAA,YAAY,MAAM,QAAQ;AAEhC,SACI,MAAM,QAAQ,gBACd,UAAU,eAAe,aACzB,UAAU,SAAS,aACnB,UAAU,UAAU,aACpB,OAAO,mBAAmB;AAElC;AAEA,SAAS,iBAAkC,OAAmC,aAAsB;AAChG,QAAM,qBACF,eACA,MAAM,SAAS,QAAQ,uBACvB,MAAM,KAAK,SAAS,aACpB,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc,KAC5D,MAAM,KAAK,OAAO;AAEf,SAAA,sBAAsB,CAAC,CAAC,MAAM,MAAM,eAAe,CAAC,CAAC,MAAM,MAAM;AAC5E;;"}
+{"version":3,"file":"Toolbar.cjs","sources":["../../../../../../src/primitives/Table/Core/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Search } from './components/Search/Search';\nimport { Settings } from './components/Settings/Settings';\nimport { Print } from './components/Print/Print';\nimport { Filters } from './components/Filters/Filters';\nimport { TableCustomSettingsRenderer } from '../../../types';\nimport { useTableReturnValue } from '../../useTable';\n\nexport type TableToolbarProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    children?: JSX.Element | null;\n    table: useTableReturnValue<TType>;\n};\n\nexport function TableToolbar<TType = unknown>(props: TableToolbarProps<TType>) {\n    const { children: customTools, table, ...attributes } = props;\n\n    if (!isToolbarVisible<TType>(table, !!customTools)) {\n        return null;\n    }\n\n    const canFilter = table.instance.options.enableColumnFilters;\n    const canPrint = table.meta.printing.isEnabled;\n    const canSettings = canChangeSettings(table.instance, table.props.customSettings);\n    const canSearch = table.meta.search.isEnabled;\n\n    const id = `${table.id}-toolbar`;\n\n    return (\n        <>\n            <div\n                {...attributes}\n                id={id}\n                className=\"mb-4 flex flex-shrink flex-grow-0 flex-wrap gap-2 print:hidden\"\n                data-taco=\"table-toolbar\">\n                {table.props.toolbarLeft}\n                <div className=\"ml-auto flex flex-shrink-0 items-center gap-2 print:hidden\">\n                    {customTools}\n                    {canFilter ? <Filters length={table.meta.length} tableId={table.id} table={table.instance} /> : null}\n                    {table.props.toolbarRight}\n                    {canPrint ? <Print table={table.instance} tableId={table.id} tableRef={table.ref} /> : null}\n                    {canSettings ? (\n                        <Settings customSettings={table.props.customSettings} id={`${id}-settings`} table={table.instance} />\n                    ) : null}\n                    {canSearch ? (\n                        <Search scrollToIndex={table.renderer.scrollToIndex} table={table.instance} tableRef={table.ref} />\n                    ) : null}\n                </div>\n            </div>\n            {table.props.toolbarPanel ? <div className=\"mb-4\">{table.props.toolbarPanel}</div> : undefined}\n        </>\n    );\n}\n\nfunction canChangeSettings<TType = unknown>(table: ReactTable<TType>, customSettings?: TableCustomSettingsRenderer) {\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n    return (\n        table.options.enableHiding ||\n        tableMeta.columnOrdering.isEnabled ||\n        tableMeta.fontSize.isEnabled ||\n        tableMeta.rowHeight.isEnabled ||\n        typeof customSettings === 'function'\n    );\n}\n\nfunction isToolbarVisible<TType = unknown>(table: useTableReturnValue<TType>, customTools: boolean) {\n    const hasInternalToolbar =\n        customTools ||\n        table.instance.options.enableColumnFilters ||\n        table.meta.printing.isEnabled ||\n        canChangeSettings(table.instance, table.props.customSettings) ||\n        table.meta.search.isEnabled;\n\n    return hasInternalToolbar || !!table.props.toolbarLeft || !!table.props.toolbarRight;\n}\n"],"names":["Filters","Print","Settings","Search"],"mappings":";;;;;;;AAcO,SAAS,aAA8B,OAAiC;AAC3E,QAAM,EAAE,UAAU,aAAa,OAAO,GAAG,WAAe,IAAA;AAExD,MAAI,CAAC,iBAAwB,OAAO,CAAC,CAAC,WAAW,GAAG;AACzC,WAAA;AAAA,EAAA;AAGL,QAAA,YAAY,MAAM,SAAS,QAAQ;AACnC,QAAA,WAAW,MAAM,KAAK,SAAS;AACrC,QAAM,cAAc,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc;AAC1E,QAAA,YAAY,MAAM,KAAK,OAAO;AAE9B,QAAA,KAAK,GAAG,MAAM,EAAE;AAEtB,SAEQ,sBAAA,cAAA,MAAA,UAAA,MAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,aAAU;AAAA,IAAA;AAAA,IACT,MAAM,MAAM;AAAA,IACZ,sBAAA,cAAA,OAAA,EAAI,WAAU,6DAAA,GACV,aACA,YAAa,sBAAA,cAAAA,QAAAA,SAAA,EAAQ,QAAQ,MAAM,KAAK,QAAQ,SAAS,MAAM,IAAI,OAAO,MAAM,UAAU,IAAK,MAC/F,MAAM,MAAM,cACZ,WAAY,sBAAA,cAAAC,MAAAA,OAAA,EAAM,OAAO,MAAM,UAAU,SAAS,MAAM,IAAI,UAAU,MAAM,IAAK,CAAA,IAAK,MACtF,cACG,sBAAA,cAACC,SAAAA,YAAS,gBAAgB,MAAM,MAAM,gBAAgB,IAAI,GAAG,EAAE,aAAa,OAAO,MAAM,SAAA,CAAU,IACnG,MACH,YACG,sBAAA,cAACC,OAAO,QAAA,EAAA,eAAe,MAAM,SAAS,eAAe,OAAO,MAAM,UAAU,UAAU,MAAM,IAAK,CAAA,IACjG,IACR;AAAA,EAEH,GAAA,MAAM,MAAM,eAAgB,sBAAA,cAAA,OAAA,EAAI,WAAU,OAAA,GAAQ,MAAM,MAAM,YAAa,IAAS,MACzF;AAER;AAEA,SAAS,kBAAmC,OAA0B,gBAA8C;AAC1G,QAAA,YAAY,MAAM,QAAQ;AAEhC,SACI,MAAM,QAAQ,gBACd,UAAU,eAAe,aACzB,UAAU,SAAS,aACnB,UAAU,UAAU,aACpB,OAAO,mBAAmB;AAElC;AAEA,SAAS,iBAAkC,OAAmC,aAAsB;AAChG,QAAM,qBACF,eACA,MAAM,SAAS,QAAQ,uBACvB,MAAM,KAAK,SAAS,aACpB,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc,KAC5D,MAAM,KAAK,OAAO;AAEf,SAAA,sBAAsB,CAAC,CAAC,MAAM,MAAM,eAAe,CAAC,CAAC,MAAM,MAAM;AAC5E;;"}

package/dist/primitives/Table/Core/components/Toolbar/Toolbar.js

@@ -1,5 +1,4 @@
 import React__default from "react";
-import { Group } from "../../../../../components/Group/Group.js";
 import { Search } from "./components/Search/Search.js";
 import { Settings } from "./components/Settings/Settings.js";
 import { Print } from "./components/Print/Print.js";
@@ -23,7 +22,7 @@ function TableToolbar(props) {
       "data-taco": "table-toolbar"
     },
     table.props.toolbarLeft,
-    /* @__PURE__ */ React__default.createElement(Group, { className: "ml-auto flex-shrink-0 items-center print:hidden" }, customTools, canFilter ? /* @__PURE__ */ React__default.createElement(Filters, { length: table.meta.length, tableId: table.id, table: table.instance }) : null, table.props.toolbarRight, canPrint ? /* @__PURE__ */ React__default.createElement(Print, { table: table.instance, tableId: table.id, tableRef: table.ref }) : null, canSettings ? /* @__PURE__ */ React__default.createElement(Settings, { customSettings: table.props.customSettings, id: `${id}-settings`, table: table.instance }) : null, canSearch ? /* @__PURE__ */ React__default.createElement(Search, { scrollToIndex: table.renderer.scrollToIndex, table: table.instance, tableRef: table.ref }) : null)
+    /* @__PURE__ */ React__default.createElement("div", { className: "ml-auto flex flex-shrink-0 items-center gap-2 print:hidden" }, customTools, canFilter ? /* @__PURE__ */ React__default.createElement(Filters, { length: table.meta.length, tableId: table.id, table: table.instance }) : null, table.props.toolbarRight, canPrint ? /* @__PURE__ */ React__default.createElement(Print, { table: table.instance, tableId: table.id, tableRef: table.ref }) : null, canSettings ? /* @__PURE__ */ React__default.createElement(Settings, { customSettings: table.props.customSettings, id: `${id}-settings`, table: table.instance }) : null, canSearch ? /* @__PURE__ */ React__default.createElement(Search, { scrollToIndex: table.renderer.scrollToIndex, table: table.instance, tableRef: table.ref }) : null)
   ), table.props.toolbarPanel ? /* @__PURE__ */ React__default.createElement("div", { className: "mb-4" }, table.props.toolbarPanel) : void 0);
 }
 function canChangeSettings(table, customSettings) {

package/dist/primitives/Table/Core/components/Toolbar/Toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.js","sources":["../../../../../../src/primitives/Table/Core/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Group } from '../../../../../components/Group/Group';\nimport { Search } from './components/Search/Search';\nimport { Settings } from './components/Settings/Settings';\nimport { Print } from './components/Print/Print';\nimport { Filters } from './components/Filters/Filters';\nimport { TableCustomSettingsRenderer } from '../../../types';\nimport { useTableReturnValue } from '../../useTable';\n\nexport type TableToolbarProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    children?: JSX.Element | null;\n    table: useTableReturnValue<TType>;\n};\n\nexport function TableToolbar<TType = unknown>(props: TableToolbarProps<TType>) {\n    const { children: customTools, table, ...attributes } = props;\n\n    if (!isToolbarVisible<TType>(table, !!customTools)) {\n        return null;\n    }\n\n    const canFilter = table.instance.options.enableColumnFilters;\n    const canPrint = table.meta.printing.isEnabled;\n    const canSettings = canChangeSettings(table.instance, table.props.customSettings);\n    const canSearch = table.meta.search.isEnabled;\n\n    const id = `${table.id}-toolbar`;\n\n    return (\n        <>\n            <div\n                {...attributes}\n                id={id}\n                className=\"mb-4 flex flex-shrink flex-grow-0 flex-wrap gap-2 print:hidden\"\n                data-taco=\"table-toolbar\">\n                {table.props.toolbarLeft}\n                <Group className=\"ml-auto flex-shrink-0 items-center print:hidden\">\n                    {customTools}\n                    {canFilter ? <Filters length={table.meta.length} tableId={table.id} table={table.instance} /> : null}\n                    {table.props.toolbarRight}\n                    {canPrint ? <Print table={table.instance} tableId={table.id} tableRef={table.ref} /> : null}\n                    {canSettings ? (\n                        <Settings customSettings={table.props.customSettings} id={`${id}-settings`} table={table.instance} />\n                    ) : null}\n                    {canSearch ? (\n                        <Search scrollToIndex={table.renderer.scrollToIndex} table={table.instance} tableRef={table.ref} />\n                    ) : null}\n                </Group>\n            </div>\n            {table.props.toolbarPanel ? <div className=\"mb-4\">{table.props.toolbarPanel}</div> : undefined}\n        </>\n    );\n}\n\nfunction canChangeSettings<TType = unknown>(table: ReactTable<TType>, customSettings?: TableCustomSettingsRenderer) {\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n    return (\n        table.options.enableHiding ||\n        tableMeta.columnOrdering.isEnabled ||\n        tableMeta.fontSize.isEnabled ||\n        tableMeta.rowHeight.isEnabled ||\n        typeof customSettings === 'function'\n    );\n}\n\nfunction isToolbarVisible<TType = unknown>(table: useTableReturnValue<TType>, customTools: boolean) {\n    const hasInternalToolbar =\n        customTools ||\n        table.instance.options.enableColumnFilters ||\n        table.meta.printing.isEnabled ||\n        canChangeSettings(table.instance, table.props.customSettings) ||\n        table.meta.search.isEnabled;\n\n    return hasInternalToolbar || !!table.props.toolbarLeft || !!table.props.toolbarRight;\n}\n"],"names":["React"],"mappings":";;;;;;AAeO,SAAS,aAA8B,OAAiC;AAC3E,QAAM,EAAE,UAAU,aAAa,OAAO,GAAG,WAAe,IAAA;AAExD,MAAI,CAAC,iBAAwB,OAAO,CAAC,CAAC,WAAW,GAAG;AACzC,WAAA;AAAA,EAAA;AAGL,QAAA,YAAY,MAAM,SAAS,QAAQ;AACnC,QAAA,WAAW,MAAM,KAAK,SAAS;AACrC,QAAM,cAAc,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc;AAC1E,QAAA,YAAY,MAAM,KAAK,OAAO;AAE9B,QAAA,KAAK,GAAG,MAAM,EAAE;AAEtB,SAEQA,+BAAA,cAAAA,eAAA,UAAA,MAAAA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,aAAU;AAAA,IAAA;AAAA,IACT,MAAM,MAAM;AAAA,IACZA,+BAAA,cAAA,OAAA,EAAM,WAAU,kDAAA,GACZ,aACA,YAAaA,+BAAA,cAAA,SAAA,EAAQ,QAAQ,MAAM,KAAK,QAAQ,SAAS,MAAM,IAAI,OAAO,MAAM,UAAU,IAAK,MAC/F,MAAM,MAAM,cACZ,WAAYA,+BAAA,cAAA,OAAA,EAAM,OAAO,MAAM,UAAU,SAAS,MAAM,IAAI,UAAU,MAAM,IAAK,CAAA,IAAK,MACtF,cACGA,+BAAA,cAAC,YAAS,gBAAgB,MAAM,MAAM,gBAAgB,IAAI,GAAG,EAAE,aAAa,OAAO,MAAM,SAAA,CAAU,IACnG,MACH,YACGA,+BAAA,cAAC,QAAO,EAAA,eAAe,MAAM,SAAS,eAAe,OAAO,MAAM,UAAU,UAAU,MAAM,IAAK,CAAA,IACjG,IACR;AAAA,EAEH,GAAA,MAAM,MAAM,eAAgBA,+BAAA,cAAA,OAAA,EAAI,WAAU,OAAA,GAAQ,MAAM,MAAM,YAAa,IAAS,MACzF;AAER;AAEA,SAAS,kBAAmC,OAA0B,gBAA8C;AAC1G,QAAA,YAAY,MAAM,QAAQ;AAEhC,SACI,MAAM,QAAQ,gBACd,UAAU,eAAe,aACzB,UAAU,SAAS,aACnB,UAAU,UAAU,aACpB,OAAO,mBAAmB;AAElC;AAEA,SAAS,iBAAkC,OAAmC,aAAsB;AAChG,QAAM,qBACF,eACA,MAAM,SAAS,QAAQ,uBACvB,MAAM,KAAK,SAAS,aACpB,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc,KAC5D,MAAM,KAAK,OAAO;AAEf,SAAA,sBAAsB,CAAC,CAAC,MAAM,MAAM,eAAe,CAAC,CAAC,MAAM,MAAM;AAC5E;"}
+{"version":3,"file":"Toolbar.js","sources":["../../../../../../src/primitives/Table/Core/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Search } from './components/Search/Search';\nimport { Settings } from './components/Settings/Settings';\nimport { Print } from './components/Print/Print';\nimport { Filters } from './components/Filters/Filters';\nimport { TableCustomSettingsRenderer } from '../../../types';\nimport { useTableReturnValue } from '../../useTable';\n\nexport type TableToolbarProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    children?: JSX.Element | null;\n    table: useTableReturnValue<TType>;\n};\n\nexport function TableToolbar<TType = unknown>(props: TableToolbarProps<TType>) {\n    const { children: customTools, table, ...attributes } = props;\n\n    if (!isToolbarVisible<TType>(table, !!customTools)) {\n        return null;\n    }\n\n    const canFilter = table.instance.options.enableColumnFilters;\n    const canPrint = table.meta.printing.isEnabled;\n    const canSettings = canChangeSettings(table.instance, table.props.customSettings);\n    const canSearch = table.meta.search.isEnabled;\n\n    const id = `${table.id}-toolbar`;\n\n    return (\n        <>\n            <div\n                {...attributes}\n                id={id}\n                className=\"mb-4 flex flex-shrink flex-grow-0 flex-wrap gap-2 print:hidden\"\n                data-taco=\"table-toolbar\">\n                {table.props.toolbarLeft}\n                <div className=\"ml-auto flex flex-shrink-0 items-center gap-2 print:hidden\">\n                    {customTools}\n                    {canFilter ? <Filters length={table.meta.length} tableId={table.id} table={table.instance} /> : null}\n                    {table.props.toolbarRight}\n                    {canPrint ? <Print table={table.instance} tableId={table.id} tableRef={table.ref} /> : null}\n                    {canSettings ? (\n                        <Settings customSettings={table.props.customSettings} id={`${id}-settings`} table={table.instance} />\n                    ) : null}\n                    {canSearch ? (\n                        <Search scrollToIndex={table.renderer.scrollToIndex} table={table.instance} tableRef={table.ref} />\n                    ) : null}\n                </div>\n            </div>\n            {table.props.toolbarPanel ? <div className=\"mb-4\">{table.props.toolbarPanel}</div> : undefined}\n        </>\n    );\n}\n\nfunction canChangeSettings<TType = unknown>(table: ReactTable<TType>, customSettings?: TableCustomSettingsRenderer) {\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n    return (\n        table.options.enableHiding ||\n        tableMeta.columnOrdering.isEnabled ||\n        tableMeta.fontSize.isEnabled ||\n        tableMeta.rowHeight.isEnabled ||\n        typeof customSettings === 'function'\n    );\n}\n\nfunction isToolbarVisible<TType = unknown>(table: useTableReturnValue<TType>, customTools: boolean) {\n    const hasInternalToolbar =\n        customTools ||\n        table.instance.options.enableColumnFilters ||\n        table.meta.printing.isEnabled ||\n        canChangeSettings(table.instance, table.props.customSettings) ||\n        table.meta.search.isEnabled;\n\n    return hasInternalToolbar || !!table.props.toolbarLeft || !!table.props.toolbarRight;\n}\n"],"names":["React"],"mappings":";;;;;AAcO,SAAS,aAA8B,OAAiC;AAC3E,QAAM,EAAE,UAAU,aAAa,OAAO,GAAG,WAAe,IAAA;AAExD,MAAI,CAAC,iBAAwB,OAAO,CAAC,CAAC,WAAW,GAAG;AACzC,WAAA;AAAA,EAAA;AAGL,QAAA,YAAY,MAAM,SAAS,QAAQ;AACnC,QAAA,WAAW,MAAM,KAAK,SAAS;AACrC,QAAM,cAAc,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc;AAC1E,QAAA,YAAY,MAAM,KAAK,OAAO;AAE9B,QAAA,KAAK,GAAG,MAAM,EAAE;AAEtB,SAEQA,+BAAA,cAAAA,eAAA,UAAA,MAAAA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,aAAU;AAAA,IAAA;AAAA,IACT,MAAM,MAAM;AAAA,IACZA,+BAAA,cAAA,OAAA,EAAI,WAAU,6DAAA,GACV,aACA,YAAaA,+BAAA,cAAA,SAAA,EAAQ,QAAQ,MAAM,KAAK,QAAQ,SAAS,MAAM,IAAI,OAAO,MAAM,UAAU,IAAK,MAC/F,MAAM,MAAM,cACZ,WAAYA,+BAAA,cAAA,OAAA,EAAM,OAAO,MAAM,UAAU,SAAS,MAAM,IAAI,UAAU,MAAM,IAAK,CAAA,IAAK,MACtF,cACGA,+BAAA,cAAC,YAAS,gBAAgB,MAAM,MAAM,gBAAgB,IAAI,GAAG,EAAE,aAAa,OAAO,MAAM,SAAA,CAAU,IACnG,MACH,YACGA,+BAAA,cAAC,QAAO,EAAA,eAAe,MAAM,SAAS,eAAe,OAAO,MAAM,UAAU,UAAU,MAAM,IAAK,CAAA,IACjG,IACR;AAAA,EAEH,GAAA,MAAM,MAAM,eAAgBA,+BAAA,cAAA,OAAA,EAAI,WAAU,OAAA,GAAQ,MAAM,MAAM,YAAa,IAAS,MACzF;AAER;AAEA,SAAS,kBAAmC,OAA0B,gBAA8C;AAC1G,QAAA,YAAY,MAAM,QAAQ;AAEhC,SACI,MAAM,QAAQ,gBACd,UAAU,eAAe,aACzB,UAAU,SAAS,aACnB,UAAU,UAAU,aACpB,OAAO,mBAAmB;AAElC;AAEA,SAAS,iBAAkC,OAAmC,aAAsB;AAChG,QAAM,qBACF,eACA,MAAM,SAAS,QAAQ,uBACvB,MAAM,KAAK,SAAS,aACpB,kBAAkB,MAAM,UAAU,MAAM,MAAM,cAAc,KAC5D,MAAM,KAAK,OAAO;AAEf,SAAA,sBAAsB,CAAC,CAAC,MAAM,MAAM,eAAe,CAAC,CAAC,MAAM,MAAM;AAC5E;"}

package/dist/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.cjs

@@ -4,7 +4,7 @@ const React = require("react");
 const Popover = require("../../../../../../../components/Popover/Popover.cjs");
 const Localization = require("../../../../../../../components/Provider/Localization.cjs");
 const Button = require("../../../../../../../components/LegacyComponents/Button/Button.cjs");
-const Group = require("../../../../../../../components/Group/Group.cjs");
+const Inline = require("../../../../../../../components/Inline/Inline.cjs");
 const util = require("./util.cjs");
 const columns = require("../../../../../useTableManager/util/columns.cjs");
 const types = require("../../../../../types.cjs");
@@ -89,7 +89,7 @@ function ManageFiltersPopover(props) {
       onChange: handleChangeFilter,
       onRemove: filters.some((f) => f.id) || filters.length > 1 ? handleRemoveFilter : void 0
     }
-  )), /* @__PURE__ */ React.createElement("div", { className: "justify-start" }, /* @__PURE__ */ React.createElement(Button.LegacyButton, { appearance: "discrete", onClick: handleCreate, name: "add-filter" }, "+ ", texts.table.filters.buttons.addFilter))), /* @__PURE__ */ React.createElement(Group.Group, { className: "ml-auto" }, /* @__PURE__ */ React.createElement(Popover.Popover.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, { name: "close-filters" }, texts.table.filters.buttons.cancel)), /* @__PURE__ */ React.createElement(Button.LegacyButton, { name: "clear-filters", onClick: handleClear }, texts.table.filters.buttons.clear), /* @__PURE__ */ React.createElement(Button.LegacyButton, { appearance: "primary", name: "apply-filters", onClick: handleApply }, texts.table.filters.buttons.apply))))));
+  )), /* @__PURE__ */ React.createElement("div", { className: "justify-start" }, /* @__PURE__ */ React.createElement(Button.LegacyButton, { appearance: "discrete", onClick: handleCreate, name: "add-filter" }, "+ ", texts.table.filters.buttons.addFilter))), /* @__PURE__ */ React.createElement(Inline.Inline, { spacing: 8, alignInline: "end" }, /* @__PURE__ */ React.createElement(Popover.Popover.Close, null, /* @__PURE__ */ React.createElement(Button.LegacyButton, { name: "close-filters" }, texts.table.filters.buttons.cancel)), /* @__PURE__ */ React.createElement(Button.LegacyButton, { name: "clear-filters", onClick: handleClear }, texts.table.filters.buttons.clear), /* @__PURE__ */ React.createElement(Button.LegacyButton, { appearance: "primary", name: "apply-filters", onClick: handleApply }, texts.table.filters.buttons.apply))))));
 }
 exports.ManageFiltersPopover = ManageFiltersPopover;
 //# sourceMappingURL=ManageFiltersPopover.cjs.map

package/dist/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ManageFiltersPopover.cjs","sources":["../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Popover } from '../../../../../../../components/Popover/Popover';\nimport { useLocalization } from '../../../../../../../components/Provider/Localization';\nimport { LegacyButton } from '../../../../../../../components/LegacyComponents/Button/Button';\nimport { Group } from '../../../../../../../components/Group/Group';\nimport { isEmptyFilter, sortByHeader } from './util';\nimport { isInternalColumn } from '../../../../../useTableManager/util/columns';\nimport { TableFilter, TableFilterComparator, TableFilterValue } from '../../../../../types';\nimport { Filter } from './components/Filter';\nimport { FilterContext } from './FilterContext';\n\nexport type ManageFiltersPopoverProps<TType = unknown> = {\n    length: number;\n    table: ReactTable<TType>;\n};\n\nconst placeholderFilter: TableFilter = { id: '', value: { comparator: TableFilterComparator.Contains, value: undefined } };\n\nexport function ManageFiltersPopover<TType = unknown>(props: ManageFiltersPopoverProps<TType>) {\n    const { length, table, ...popoverProps } = props;\n    const { locale, texts } = useLocalization();\n\n    const allColumns = table\n        .getAllLeafColumns()\n        .filter(column => !isInternalColumn(column.id))\n        .sort(sortByHeader);\n\n    const columnFilters = table.getState().columnFilters as TableFilter[];\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n    // state, since we \"apply\" filters - our filter values have a special shape, so we force to our type\n    const [filters, setFilters] = React.useState<TableFilter[]>(columnFilters.length ? columnFilters : [placeholderFilter]);\n\n    // this runs if filters are set outside (e.g. through column header)\n    React.useEffect(() => {\n        setFilters(columnFilters.length === 0 ? [placeholderFilter] : columnFilters);\n\n        // focus the filter value, as we preset the column/comparator.\n        requestAnimationFrame(() => {\n            const filterValues = document.querySelectorAll('[data-query-selector=\"filter-value\"]');\n            const lastFilter = filterValues.length ? filterValues[filterValues.length - 1] : undefined;\n\n            (lastFilter as HTMLElement)?.focus();\n        });\n    }, [columnFilters]);\n\n    // filters\n    const handleChangeFilter = (position: number, filter: { id: string; value: TableFilterValue }) => {\n        setFilters(currentFilters => {\n            return currentFilters.map((current, index) => {\n                if (index === position) {\n                    return filter;\n                }\n                return current;\n            });\n        });\n    };\n\n    const handleRemoveFilter = (position: number) => {\n        if (filters.length === 1) {\n            setFilters([placeholderFilter]);\n            return;\n        }\n\n        setFilters(currentFilters => currentFilters.filter((_, index) => index !== position));\n    };\n\n    const handleCreate = () => {\n        setFilters(filters.concat(placeholderFilter));\n    };\n\n    //\n    const handleApply = () => {\n        table.setColumnFilters(() => {\n            const newFilters = filters.filter(f => {\n                if (f.id === null || f.id === '') {\n                    return false;\n                }\n\n                const controlRenderer = allColumns.find(column => column.id === f.id)?.columnDef.meta?.control;\n\n                if (\n                    f.value.comparator === TableFilterComparator.IsEmpty ||\n                    f.value.comparator === TableFilterComparator.IsNotEmpty ||\n                    controlRenderer === 'switch'\n                ) {\n                    return true;\n                }\n\n                const value = f.value.value;\n\n                return value !== undefined && value !== null && value !== '';\n            });\n\n            return newFilters;\n        });\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([placeholderFilter]);\n    };\n\n    const handleClose = (open: boolean) => {\n        if (!open) {\n            const nonEmptyFilters = columnFilters.filter(f => !isEmptyFilter(f));\n            table.setColumnFilters(nonEmptyFilters);\n            setFilters(nonEmptyFilters.length === 0 ? [placeholderFilter] : nonEmptyFilters);\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} onChange={handleClose}>\n            <Popover.Content>\n                <FilterContext.Provider value={filters}>\n                    <div className=\"flex w-[40rem] flex-col gap-4\">\n                        <div className=\"flex h-8\">\n                            <div className=\"flex w-full items-center gap-2\">\n                                <h4 className=\"mb-0 inline-flex\">{texts.table.filters.button}</h4>\n                                <p className=\"mb-0 mr-auto mt-px inline-flex text-gray-700\">\n                                    {texts.table.filters.total\n                                        .replace(\n                                            '[CURRENT]',\n                                            new Intl.NumberFormat(locale).format(\n                                                tableMeta.server._experimentalDataLoader2\n                                                    ? length // dataloader2 doesn't fill in the data array with undefined like the standard dataloader, so we need to show the full length.\n                                                    : table.getFilteredRowModel().rows.length\n                                            )\n                                        )\n                                        .replace('[TOTAL]', new Intl.NumberFormat(locale).format(length))}\n                                </p>\n                            </div>\n                        </div>\n                        <div className=\"flex flex-col gap-2\">\n                            {filters.map((filter, index) => (\n                                <Filter\n                                    key={`filter_${index}`}\n                                    allColumns={allColumns}\n                                    filter={filter}\n                                    position={index}\n                                    onChange={handleChangeFilter}\n                                    onRemove={filters.some(f => f.id) || filters.length > 1 ? handleRemoveFilter : undefined}\n                                />\n                            ))}\n                            <div className=\"justify-start\">\n                                <LegacyButton appearance=\"discrete\" onClick={handleCreate} name=\"add-filter\">\n                                    + {texts.table.filters.buttons.addFilter}\n                                </LegacyButton>\n                            </div>\n                        </div>\n                        <Group className=\"ml-auto\">\n                            <Popover.Close>\n                                <LegacyButton name=\"close-filters\">{texts.table.filters.buttons.cancel}</LegacyButton>\n                            </Popover.Close>\n                            <LegacyButton name=\"clear-filters\" onClick={handleClear}>\n                                {texts.table.filters.buttons.clear}\n                            </LegacyButton>\n                            <LegacyButton appearance=\"primary\" name=\"apply-filters\" onClick={handleApply}>\n                                {texts.table.filters.buttons.apply}\n                            </LegacyButton>\n                        </Group>\n                    </div>\n                </FilterContext.Provider>\n            </Popover.Content>\n        </Popover>\n    );\n}\n"],"names":["TableFilterComparator","useLocalization","isInternalColumn","sortByHeader","isEmptyFilter","Popover","FilterContext","Filter","LegacyButton","Group"],"mappings":"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"}
+{"version":3,"file":"ManageFiltersPopover.cjs","sources":["../../../../../../../../src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { Popover } from '../../../../../../../components/Popover/Popover';\nimport { useLocalization } from '../../../../../../../components/Provider/Localization';\nimport { LegacyButton } from '../../../../../../../components/LegacyComponents/Button/Button';\nimport { Inline } from '../../../../../../../components/Inline/Inline';\nimport { isEmptyFilter, sortByHeader } from './util';\nimport { isInternalColumn } from '../../../../../useTableManager/util/columns';\nimport { TableFilter, TableFilterComparator, TableFilterValue } from '../../../../../types';\nimport { Filter } from './components/Filter';\nimport { FilterContext } from './FilterContext';\n\nexport type ManageFiltersPopoverProps<TType = unknown> = {\n    length: number;\n    table: ReactTable<TType>;\n};\n\nconst placeholderFilter: TableFilter = { id: '', value: { comparator: TableFilterComparator.Contains, value: undefined } };\n\nexport function ManageFiltersPopover<TType = unknown>(props: ManageFiltersPopoverProps<TType>) {\n    const { length, table, ...popoverProps } = props;\n    const { locale, texts } = useLocalization();\n\n    const allColumns = table\n        .getAllLeafColumns()\n        .filter(column => !isInternalColumn(column.id))\n        .sort(sortByHeader);\n\n    const columnFilters = table.getState().columnFilters as TableFilter[];\n    const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n    // state, since we \"apply\" filters - our filter values have a special shape, so we force to our type\n    const [filters, setFilters] = React.useState<TableFilter[]>(columnFilters.length ? columnFilters : [placeholderFilter]);\n\n    // this runs if filters are set outside (e.g. through column header)\n    React.useEffect(() => {\n        setFilters(columnFilters.length === 0 ? [placeholderFilter] : columnFilters);\n\n        // focus the filter value, as we preset the column/comparator.\n        requestAnimationFrame(() => {\n            const filterValues = document.querySelectorAll('[data-query-selector=\"filter-value\"]');\n            const lastFilter = filterValues.length ? filterValues[filterValues.length - 1] : undefined;\n\n            (lastFilter as HTMLElement)?.focus();\n        });\n    }, [columnFilters]);\n\n    // filters\n    const handleChangeFilter = (position: number, filter: { id: string; value: TableFilterValue }) => {\n        setFilters(currentFilters => {\n            return currentFilters.map((current, index) => {\n                if (index === position) {\n                    return filter;\n                }\n                return current;\n            });\n        });\n    };\n\n    const handleRemoveFilter = (position: number) => {\n        if (filters.length === 1) {\n            setFilters([placeholderFilter]);\n            return;\n        }\n\n        setFilters(currentFilters => currentFilters.filter((_, index) => index !== position));\n    };\n\n    const handleCreate = () => {\n        setFilters(filters.concat(placeholderFilter));\n    };\n\n    //\n    const handleApply = () => {\n        table.setColumnFilters(() => {\n            const newFilters = filters.filter(f => {\n                if (f.id === null || f.id === '') {\n                    return false;\n                }\n\n                const controlRenderer = allColumns.find(column => column.id === f.id)?.columnDef.meta?.control;\n\n                if (\n                    f.value.comparator === TableFilterComparator.IsEmpty ||\n                    f.value.comparator === TableFilterComparator.IsNotEmpty ||\n                    controlRenderer === 'switch'\n                ) {\n                    return true;\n                }\n\n                const value = f.value.value;\n\n                return value !== undefined && value !== null && value !== '';\n            });\n\n            return newFilters;\n        });\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([placeholderFilter]);\n    };\n\n    const handleClose = (open: boolean) => {\n        if (!open) {\n            const nonEmptyFilters = columnFilters.filter(f => !isEmptyFilter(f));\n            table.setColumnFilters(nonEmptyFilters);\n            setFilters(nonEmptyFilters.length === 0 ? [placeholderFilter] : nonEmptyFilters);\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} onChange={handleClose}>\n            <Popover.Content>\n                <FilterContext.Provider value={filters}>\n                    <div className=\"flex w-[40rem] flex-col gap-4\">\n                        <div className=\"flex h-8\">\n                            <div className=\"flex w-full items-center gap-2\">\n                                <h4 className=\"mb-0 inline-flex\">{texts.table.filters.button}</h4>\n                                <p className=\"mb-0 mr-auto mt-px inline-flex text-gray-700\">\n                                    {texts.table.filters.total\n                                        .replace(\n                                            '[CURRENT]',\n                                            new Intl.NumberFormat(locale).format(\n                                                tableMeta.server._experimentalDataLoader2\n                                                    ? length // dataloader2 doesn't fill in the data array with undefined like the standard dataloader, so we need to show the full length.\n                                                    : table.getFilteredRowModel().rows.length\n                                            )\n                                        )\n                                        .replace('[TOTAL]', new Intl.NumberFormat(locale).format(length))}\n                                </p>\n                            </div>\n                        </div>\n                        <div className=\"flex flex-col gap-2\">\n                            {filters.map((filter, index) => (\n                                <Filter\n                                    key={`filter_${index}`}\n                                    allColumns={allColumns}\n                                    filter={filter}\n                                    position={index}\n                                    onChange={handleChangeFilter}\n                                    onRemove={filters.some(f => f.id) || filters.length > 1 ? handleRemoveFilter : undefined}\n                                />\n                            ))}\n                            <div className=\"justify-start\">\n                                <LegacyButton appearance=\"discrete\" onClick={handleCreate} name=\"add-filter\">\n                                    + {texts.table.filters.buttons.addFilter}\n                                </LegacyButton>\n                            </div>\n                        </div>\n                        <Inline spacing={8} alignInline=\"end\">\n                            <Popover.Close>\n                                <LegacyButton name=\"close-filters\">{texts.table.filters.buttons.cancel}</LegacyButton>\n                            </Popover.Close>\n                            <LegacyButton name=\"clear-filters\" onClick={handleClear}>\n                                {texts.table.filters.buttons.clear}\n                            </LegacyButton>\n                            <LegacyButton appearance=\"primary\" name=\"apply-filters\" onClick={handleApply}>\n                                {texts.table.filters.buttons.apply}\n                            </LegacyButton>\n                        </Inline>\n                    </div>\n                </FilterContext.Provider>\n            </Popover.Content>\n        </Popover>\n    );\n}\n"],"names":["TableFilterComparator","useLocalization","isInternalColumn","sortByHeader","isEmptyFilter","Popover","FilterContext","Filter","LegacyButton","Inline"],"mappings":"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"}

package/dist/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.js

@@ -2,7 +2,7 @@ import React__default from "react";
 import { Popover } from "../../../../../../../components/Popover/Popover.js";
 import { useLocalization } from "../../../../../../../components/Provider/Localization.js";
 import { LegacyButton } from "../../../../../../../components/LegacyComponents/Button/Button.js";
-import { Group } from "../../../../../../../components/Group/Group.js";
+import { Inline } from "../../../../../../../components/Inline/Inline.js";
 import { sortByHeader, isEmptyFilter } from "./util.js";
 import { isInternalColumn } from "../../../../../useTableManager/util/columns.js";
 import { TableFilterComparator } from "../../../../../types.js";
@@ -87,7 +87,7 @@ function ManageFiltersPopover(props) {
       onChange: handleChangeFilter,
       onRemove: filters.some((f) => f.id) || filters.length > 1 ? handleRemoveFilter : void 0
     }
-  )), /* @__PURE__ */ React__default.createElement("div", { className: "justify-start" }, /* @__PURE__ */ React__default.createElement(LegacyButton, { appearance: "discrete", onClick: handleCreate, name: "add-filter" }, "+ ", texts.table.filters.buttons.addFilter))), /* @__PURE__ */ React__default.createElement(Group, { className: "ml-auto" }, /* @__PURE__ */ React__default.createElement(Popover.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, { name: "close-filters" }, texts.table.filters.buttons.cancel)), /* @__PURE__ */ React__default.createElement(LegacyButton, { name: "clear-filters", onClick: handleClear }, texts.table.filters.buttons.clear), /* @__PURE__ */ React__default.createElement(LegacyButton, { appearance: "primary", name: "apply-filters", onClick: handleApply }, texts.table.filters.buttons.apply))))));
+  )), /* @__PURE__ */ React__default.createElement("div", { className: "justify-start" }, /* @__PURE__ */ React__default.createElement(LegacyButton, { appearance: "discrete", onClick: handleCreate, name: "add-filter" }, "+ ", texts.table.filters.buttons.addFilter))), /* @__PURE__ */ React__default.createElement(Inline, { spacing: 8, alignInline: "end" }, /* @__PURE__ */ React__default.createElement(Popover.Close, null, /* @__PURE__ */ React__default.createElement(LegacyButton, { name: "close-filters" }, texts.table.filters.buttons.cancel)), /* @__PURE__ */ React__default.createElement(LegacyButton, { name: "clear-filters", onClick: handleClear }, texts.table.filters.buttons.clear), /* @__PURE__ */ React__default.createElement(LegacyButton, { appearance: "primary", name: "apply-filters", onClick: handleApply }, texts.table.filters.buttons.apply))))));
 }
 export {
   ManageFiltersPopover