@economic/taco 2.17.1 → 2.18.0

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

@@ -1 +1 @@
-{"version":3,"file":"EditingCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport _ from 'lodash';\nimport { TableMeta, CellContext, ColumnMeta, Cell as RTCell, Table as RTTable } from '@tanstack/react-table';\nimport { Indicator, IndicatorReason } from './Indicator';\nimport { columnFilterFn, globalFilterFn } from '../../../util/filtering';\nimport { Table3ColumnControlRenderer, Table3FilterValue } from '../../../types';\nimport { hasChanged, willRowMoveAfterSorting } from '../../../util/editing';\nimport { getCurrentRowCellElement } from '../../../util/columns';\nimport { EDITING_ACTIONS_WIDTH } from '../internal/EditingActions';\nimport { EditingControl } from './EditingControl';\nimport { RowContext, useRowContext } from '../../rows/RowContext';\nimport { Field } from '../../../../Field/Field';\nimport { Highlight } from './Highlight';\n\nexport type EditingCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    highlighted?: boolean;\n    highlightedAsCurrent?: boolean;\n    children?: string | JSX.Element;\n};\n\nexport function EditingCell<TType = unknown>(props: EditingCellProps<TType>) {\n    const { cell, table } = props;\n    const { isHovered } = useRowContext();\n    // Need to explicitly pass tableMeta, because just passing the table object will not trigger editing change since table object is not mutatable.\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const error = tableMeta.validation.getCellError(cell);\n    return <MemoedEditingCell<TType> {...props} error={error} isHovered={isHovered} tableMeta={tableMeta} />;\n}\n\n// Memoization\nexport type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {\n    isHovered: boolean;\n    tableMeta: TableMeta<TType>;\n    error?: string;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n    const { cell, column, index, getValue, table, tableRef, row, tableMeta, error, highlighted, highlightedAsCurrent } = props;\n    const { rowIndex } = React.useContext(RowContext);\n\n    const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n    const cellRef = React.useRef<HTMLDivElement>(null);\n    const controlRef = React.useRef<HTMLElement>(null);\n\n    const handleChange = (value: unknown) => tableMeta.editing.setCellValue(cell, value);\n    const value = tableMeta.editing.getCellValue(cell) ?? getValue();\n\n    const handleFocus = event => {\n        // Check if cell is hidden behind pinned columns or edititng actions, and scroll to it.\n        const frozenColumnIndex = tableMeta.columnFreezing.frozenColumnIndex;\n        const tableElement = tableRef.current;\n\n        if (tableElement && frozenColumnIndex !== undefined && index > frozenColumnIndex) {\n            const lastFrozenColumnElement = getCurrentRowCellElement(frozenColumnIndex, tableElement);\n            const cellRect = cellRef.current?.getBoundingClientRect();\n            const lastFrozenRect = lastFrozenColumnElement?.getBoundingClientRect();\n            const tableRect = tableElement.getBoundingClientRect();\n\n            // Check for pinned columns overlap\n            if (cellRect && lastFrozenRect && cellRect.left < lastFrozenRect.left + lastFrozenRect.width) {\n                const pinnedColumnsWidth = lastFrozenRect.left + lastFrozenRect.width;\n                tableElement.scrollTo(cellRect.left - pinnedColumnsWidth, tableElement.scrollTop);\n                // Check for editing actions overlap\n            } else if (cellRect && tableRect && cellRect.right > tableRect.right - EDITING_ACTIONS_WIDTH) {\n                const spaceBetweenCellAndEditingActions = 10;\n                tableElement.scrollTo(\n                    // Need to take into account if table has been already scrolled.\n                    tableElement.scrollLeft + EDITING_ACTIONS_WIDTH + spaceBetweenCellAndEditingActions,\n                    tableElement.scrollTop\n                );\n            }\n        }\n\n        if (event.target?.select) {\n            requestAnimationFrame(() => {\n                event.target.select();\n            });\n        }\n    };\n\n    const handleBlur = () => {\n        tableMeta.editing.setDetailModeEditing(false);\n        if (tableMeta.editing.changes?.[cell.row.id]) {\n            tableMeta.validation.validate(cell.row.id, tableMeta.editing.changes[cell.row.id] as TType, cell.column.id);\n        }\n    };\n\n    // row move indicator\n    const moveReason = tableMeta.editing.rowMoveReason?.[cell.column.id] || null;\n    const rows = table.getRowModel().rows;\n    const isActiveRow =\n        tableMeta.rowActive.rowActiveIndex !== undefined && rows[tableMeta.rowActive.rowActiveIndex]?.id === row.id;\n    const mountNode = React.useMemo(() => {\n        if (moveReason !== null && isActiveRow && !error) {\n            return cellRef.current?.parentElement?.firstChild as Element | null;\n        }\n        return null;\n    }, [moveReason, isActiveRow, error, cellRef]);\n\n    const removeMoveReason = () => {\n        tableMeta.editing.removeRowMoveReason();\n    };\n\n    React.useEffect(() => {\n        // To avoid reseting move reason on another row hover,\n        // we need to check for changes only if value got changed in the current row.\n        if (!isActiveRow || error) {\n            if (tableMeta.editing.rowMoveReason) {\n                removeMoveReason();\n            }\n            return;\n        }\n\n        if (hasChanged(getValue(), value)) {\n            const moveReason = getRowMoveReason(\n                table,\n                rowIndex, // cannot use row.index, as this is not kept in sync once a column is sorted.\n                row.original,\n                cell,\n                value,\n                tableMeta.search.excludeUnmatchedResults\n            );\n            tableMeta.editing.setRowMoveReason({ [cell.column.id]: moveReason });\n        } else {\n            removeMoveReason();\n        }\n        return removeMoveReason;\n    }, [value, tableMeta.rowActive.rowActiveIndex, tableMeta.search.excludeUnmatchedResults, error]);\n\n    const controlRenderer = column.columnDef.meta?.control as Table3ColumnControlRenderer;\n\n    const className = cn(\n        'py-[calc(var(--table3-cell-padding-y)_-_0.06rem)]',\n        {\n            // Textarea control is positioned absolute, when column is in enableTruncate mode, so the cell need to be positioned relative\n            relative: controlRenderer === 'textarea' && columnMeta.enableTruncate,\n        },\n        typeof columnMeta.className === 'function' ? columnMeta.className(row.original) : columnMeta.className\n    );\n\n    const fieldClassName = cn('!min-h-0 w-full !pb-0', {\n        '!pb-3': !!error,\n    });\n\n    const content = (\n        <Field message={error} invalid={!!error} className={fieldClassName}>\n            <EditingControl\n                align={columnMeta.align}\n                column={cell.column}\n                data={cell.row.original}\n                initialValue={getValue()}\n                onBlur={handleBlur}\n                onFocus={handleFocus}\n                onChange={handleChange}\n                ref={controlRef}\n                table={table}\n                tableRef={tableRef}\n                value={value}\n                cell={cell}\n                error={error}\n                tabIndex={isActiveRow ? 0 : -1}\n                isActiveRow={isActiveRow}\n            />\n        </Field>\n    );\n\n    return (\n        <>\n            {moveReason !== null && mountNode && !error ? (\n                <Indicator\n                    reason={moveReason}\n                    columnName={String(cell.column.columnDef.header)}\n                    mountNode={mountNode}\n                    validationErrors={[]}\n                />\n            ) : null}\n            <div\n                className={!highlighted ? className : undefined}\n                data-align={columnMeta.align}\n                data-column-index={index}\n                role=\"cell\"\n                data-editable\n                ref={cellRef}\n                data-invalid={!!error}\n                data-highlighted={highlighted}>\n                {highlighted ? (\n                    <Highlight\n                        current={highlightedAsCurrent}\n                        className={className}\n                        frozenColumnIndex={tableMeta.columnFreezing.frozenColumnIndex}\n                        index={index}\n                        tableRef={tableRef}>\n                        {content}\n                    </Highlight>\n                ) : (\n                    content\n                )}\n            </div>\n        </>\n    );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n\nfunction getRowMoveReason<TType>(\n    table: RTTable<any>,\n    rowIndex: number,\n    rowValues: TType,\n    cell: RTCell<any, unknown>,\n    newValue: any,\n    excludeUnmatchedResults: boolean\n) {\n    let rowMoveReason: IndicatorReason | null = null;\n    const { globalFilter } = table.getState();\n\n    const isFilteredByGlobalFilter = excludeUnmatchedResults\n        ? Object.values<unknown>({ ...rowValues, [cell.id]: newValue }).some(() => {\n              // Global filter can be undefined when there is no text being searched so we pass an empty string to\n              // globalFilterFn as query in that case.\n              return globalFilterFn(String(newValue), globalFilter ? String(globalFilter) : '');\n          })\n        : true;\n\n    if (!isFilteredByGlobalFilter) {\n        rowMoveReason = IndicatorReason.SEARCH;\n    } else if (cell.column.getIsFiltered() && !columnFilterFn(newValue, cell.column.getFilterValue() as Table3FilterValue)) {\n        rowMoveReason = IndicatorReason.FILTER;\n    } else if (\n        !rowMoveReason &&\n        cell.column.getIsSorted() &&\n        willRowMoveAfterSorting(\n            newValue,\n            cell,\n            rowIndex,\n            table.getRowModel().rows,\n            !!table.getState().sorting.find(s => s.id === cell.column.id)?.desc\n        )\n    ) {\n        rowMoveReason = IndicatorReason.SORTING;\n    }\n\n    return rowMoveReason;\n}\n"],"names":["EditingCell","props","cell","table","isHovered","useRowContext","tableMeta","options","meta","error","validation","getCellError","React","MemoedEditingCell","memo","column","index","getValue","tableRef","row","highlighted","highlightedAsCurrent","rowIndex","useContext","RowContext","columnMeta","columnDef","cellRef","useRef","controlRef","handleChange","value","editing","setCellValue","_tableMeta$editing$ge","getCellValue","handleFocus","event","frozenColumnIndex","columnFreezing","tableElement","current","undefined","_cellRef$current","lastFrozenColumnElement","getCurrentRowCellElement","cellRect","getBoundingClientRect","lastFrozenRect","tableRect","left","width","pinnedColumnsWidth","scrollTo","scrollTop","right","EDITING_ACTIONS_WIDTH","spaceBetweenCellAndEditingActions","scrollLeft","_event$target","target","select","requestAnimationFrame","handleBlur","setDetailModeEditing","_tableMeta$editing$ch","changes","id","validate","moveReason","_tableMeta$editing$ro","rowMoveReason","rows","getRowModel","isActiveRow","rowActive","rowActiveIndex","_rows$tableMeta$rowAc","mountNode","useMemo","_cellRef$current2","_cellRef$current2$par","parentElement","firstChild","removeMoveReason","removeRowMoveReason","useEffect","hasChanged","getRowMoveReason","original","search","excludeUnmatchedResults","setRowMoveReason","controlRenderer","_column$columnDef$met","control","className","cn","relative","enableTruncate","fieldClassName","content","Field","message","invalid","EditingControl","align","data","initialValue","onBlur","onFocus","onChange","ref","tabIndex","Indicator","reason","columnName","String","header","validationErrors","role","Highlight","rowValues","newValue","globalFilter","getState","isFilteredByGlobalFilter","Object","values","some","globalFilterFn","IndicatorReason","SEARCH","getIsFiltered","columnFilterFn","getFilterValue","FILTER","getIsSorted","willRowMoveAfterSorting","_table$getState$sorti","sorting","find","s","desc","SORTING"],"mappings":"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"}
+{"version":3,"file":"EditingCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport _ from 'lodash';\nimport { TableMeta, CellContext, ColumnMeta, Cell as RTCell, Table as RTTable } from '@tanstack/react-table';\nimport { Indicator, IndicatorReason } from './Indicator';\nimport { columnFilterFn, globalFilterFn } from '../../../util/filtering';\nimport { Table3ColumnControlRenderer, Table3FilterValue } from '../../../types';\nimport { hasChanged, willRowMoveAfterSorting } from '../../../util/editing';\nimport { getCurrentRowCellElement } from '../../../util/columns';\nimport { EDITING_ACTIONS_WIDTH } from '../internal/EditingActions';\nimport { EditingControl } from './EditingControl';\nimport { RowContext, useRowContext } from '../../rows/RowContext';\nimport { Field } from '../../../../Field/Field';\nimport { Highlight } from './Highlight';\n\nexport type EditingCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    highlighted?: boolean;\n    highlightedAsCurrent?: boolean;\n    children?: string | JSX.Element;\n    className?: string;\n};\n\nexport function EditingCell<TType = unknown>(props: EditingCellProps<TType>) {\n    const { cell, table } = props;\n    const { isHovered } = useRowContext();\n    // Need to explicitly pass tableMeta, because just passing the table object will not trigger editing change since table object is not mutatable.\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const error = tableMeta.validation.getCellError(cell);\n    return <MemoedEditingCell<TType> {...props} error={error} isHovered={isHovered} tableMeta={tableMeta} />;\n}\n\n// Memoization\nexport type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {\n    isHovered: boolean;\n    tableMeta: TableMeta<TType>;\n    error?: string;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n    const { cell, column, index, getValue, table, tableRef, row, tableMeta, error, highlighted, highlightedAsCurrent } = props;\n    const { rowIndex } = React.useContext(RowContext);\n\n    const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n    const cellRef = React.useRef<HTMLDivElement>(null);\n    const controlRef = React.useRef<HTMLElement>(null);\n\n    const handleChange = (value: unknown) => tableMeta.editing.setCellValue(cell, value);\n    const value = tableMeta.editing.getCellValue(cell) ?? getValue();\n\n    const handleFocus = event => {\n        // Check if cell is hidden behind pinned columns or edititng actions, and scroll to it.\n        const frozenColumnIndex = tableMeta.columnFreezing.frozenColumnIndex;\n        const tableElement = tableRef.current;\n\n        if (tableElement && frozenColumnIndex !== undefined && index > frozenColumnIndex) {\n            const lastFrozenColumnElement = getCurrentRowCellElement(frozenColumnIndex, tableElement);\n            const cellRect = cellRef.current?.getBoundingClientRect();\n            const lastFrozenRect = lastFrozenColumnElement?.getBoundingClientRect();\n            const tableRect = tableElement.getBoundingClientRect();\n\n            // Check for pinned columns overlap\n            if (cellRect && lastFrozenRect && cellRect.left < lastFrozenRect.left + lastFrozenRect.width) {\n                const pinnedColumnsWidth = lastFrozenRect.left + lastFrozenRect.width;\n                tableElement.scrollTo(cellRect.left - pinnedColumnsWidth, tableElement.scrollTop);\n                // Check for editing actions overlap\n            } else if (cellRect && tableRect && cellRect.right > tableRect.right - EDITING_ACTIONS_WIDTH) {\n                const spaceBetweenCellAndEditingActions = 10;\n                tableElement.scrollTo(\n                    // Need to take into account if table has been already scrolled.\n                    tableElement.scrollLeft + EDITING_ACTIONS_WIDTH + spaceBetweenCellAndEditingActions,\n                    tableElement.scrollTop\n                );\n            }\n        }\n\n        if (event.target?.select) {\n            requestAnimationFrame(() => {\n                event.target.select();\n            });\n        }\n    };\n\n    const handleBlur = () => {\n        tableMeta.editing.setDetailModeEditing(false);\n        if (tableMeta.editing.changes?.[cell.row.id]) {\n            tableMeta.validation.validate(cell.row.id, tableMeta.editing.changes[cell.row.id] as TType, cell.column.id);\n        }\n    };\n\n    // row move indicator\n    const moveReason = tableMeta.editing.rowMoveReason?.[cell.column.id] || null;\n    const rows = table.getRowModel().rows;\n    const isActiveRow =\n        tableMeta.rowActive.rowActiveIndex !== undefined && rows[tableMeta.rowActive.rowActiveIndex]?.id === row.id;\n    const mountNode = React.useMemo(() => {\n        if (moveReason !== null && isActiveRow && !error) {\n            return cellRef.current?.parentElement?.firstChild as Element | null;\n        }\n        return null;\n    }, [moveReason, isActiveRow, error, cellRef]);\n\n    const removeMoveReason = () => {\n        tableMeta.editing.removeRowMoveReason();\n    };\n\n    React.useEffect(() => {\n        // To avoid reseting move reason on another row hover,\n        // we need to check for changes only if value got changed in the current row.\n        if (!isActiveRow) {\n            return;\n        }\n\n        if (error) {\n            if (tableMeta.editing.rowMoveReason) {\n                removeMoveReason();\n            }\n            return;\n        }\n\n        if (hasChanged(getValue(), value)) {\n            const moveReason = getRowMoveReason(\n                table,\n                rowIndex, // cannot use row.index, as this is not kept in sync once a column is sorted.\n                row.original,\n                cell,\n                value,\n                tableMeta.search.excludeUnmatchedResults\n            );\n            if (moveReason) {\n                tableMeta.editing.setRowMoveReason({ [cell.column.id]: moveReason });\n            }\n        } else {\n            removeMoveReason();\n        }\n        return removeMoveReason;\n    }, [value, tableMeta.rowActive.rowActiveIndex, tableMeta.search.excludeUnmatchedResults, error]);\n\n    const controlRenderer = column.columnDef.meta?.control as Table3ColumnControlRenderer;\n\n    const className = cn(\n        'py-[calc(var(--table3-cell-padding-y)_-_0.06rem)]',\n        {\n            // Textarea control is positioned absolute, when column is in enableTruncate mode, so the cell need to be positioned relative\n            relative: controlRenderer === 'textarea' && columnMeta.enableTruncate,\n        },\n        props.className,\n        typeof columnMeta.className === 'function' ? columnMeta.className(row.original) : columnMeta.className\n    );\n\n    const fieldClassName = cn('!min-h-0 w-full !pb-0', {\n        '!pb-3': !!error,\n    });\n\n    const content = (\n        <Field message={error} invalid={!!error} className={fieldClassName}>\n            <EditingControl\n                align={columnMeta.align}\n                column={cell.column}\n                data={cell.row.original}\n                initialValue={getValue()}\n                onBlur={handleBlur}\n                onFocus={handleFocus}\n                onChange={handleChange}\n                ref={controlRef}\n                table={table}\n                tableRef={tableRef}\n                value={value}\n                cell={cell}\n                error={error}\n                tabIndex={isActiveRow ? 0 : -1}\n                isActiveRow={isActiveRow}\n            />\n        </Field>\n    );\n\n    return (\n        <>\n            {moveReason !== null && mountNode && !error ? (\n                <Indicator\n                    reason={moveReason}\n                    columnName={String(cell.column.columnDef.header)}\n                    mountNode={mountNode}\n                    validationErrors={[]}\n                />\n            ) : null}\n            <div\n                className={!highlighted ? className : undefined}\n                data-align={columnMeta.align}\n                data-column-index={index}\n                role=\"cell\"\n                data-editable\n                ref={cellRef}\n                data-invalid={!!error}\n                data-highlighted={highlighted}>\n                {highlighted ? (\n                    <Highlight\n                        current={highlightedAsCurrent}\n                        className={className}\n                        frozenColumnIndex={tableMeta.columnFreezing.frozenColumnIndex}\n                        index={index}\n                        tableRef={tableRef}>\n                        {content}\n                    </Highlight>\n                ) : (\n                    content\n                )}\n            </div>\n        </>\n    );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n\nfunction getRowMoveReason<TType>(\n    table: RTTable<any>,\n    rowIndex: number,\n    rowValues: TType,\n    cell: RTCell<any, unknown>,\n    newValue: any,\n    excludeUnmatchedResults: boolean\n) {\n    let rowMoveReason: IndicatorReason | null = null;\n    const { globalFilter } = table.getState();\n\n    const isFilteredByGlobalFilter = excludeUnmatchedResults\n        ? Object.values<unknown>({ ...rowValues, [cell.id]: newValue }).some(() => {\n              // Global filter can be undefined when there is no text being searched so we pass an empty string to\n              // globalFilterFn as query in that case.\n              return globalFilterFn(String(newValue), globalFilter ? String(globalFilter) : '');\n          })\n        : true;\n\n    if (!isFilteredByGlobalFilter) {\n        rowMoveReason = IndicatorReason.SEARCH;\n    } else if (cell.column.getIsFiltered() && !columnFilterFn(newValue, cell.column.getFilterValue() as Table3FilterValue)) {\n        rowMoveReason = IndicatorReason.FILTER;\n    } else if (\n        !rowMoveReason &&\n        cell.column.getIsSorted() &&\n        willRowMoveAfterSorting(\n            newValue,\n            cell,\n            rowIndex,\n            table.getRowModel().rows,\n            !!table.getState().sorting.find(s => s.id === cell.column.id)?.desc\n        )\n    ) {\n        rowMoveReason = IndicatorReason.SORTING;\n    }\n\n    return rowMoveReason;\n}\n"],"names":["EditingCell","props","cell","table","isHovered","useRowContext","tableMeta","options","meta","error","validation","getCellError","React","MemoedEditingCell","memo","column","index","getValue","tableRef","row","highlighted","highlightedAsCurrent","rowIndex","useContext","RowContext","columnMeta","columnDef","cellRef","useRef","controlRef","handleChange","value","editing","setCellValue","_tableMeta$editing$ge","getCellValue","handleFocus","event","frozenColumnIndex","columnFreezing","tableElement","current","undefined","_cellRef$current","lastFrozenColumnElement","getCurrentRowCellElement","cellRect","getBoundingClientRect","lastFrozenRect","tableRect","left","width","pinnedColumnsWidth","scrollTo","scrollTop","right","EDITING_ACTIONS_WIDTH","spaceBetweenCellAndEditingActions","scrollLeft","_event$target","target","select","requestAnimationFrame","handleBlur","setDetailModeEditing","_tableMeta$editing$ch","changes","id","validate","moveReason","_tableMeta$editing$ro","rowMoveReason","rows","getRowModel","isActiveRow","rowActive","rowActiveIndex","_rows$tableMeta$rowAc","mountNode","useMemo","_cellRef$current2","_cellRef$current2$par","parentElement","firstChild","removeMoveReason","removeRowMoveReason","useEffect","hasChanged","getRowMoveReason","original","search","excludeUnmatchedResults","setRowMoveReason","controlRenderer","_column$columnDef$met","control","className","cn","relative","enableTruncate","fieldClassName","content","Field","message","invalid","EditingControl","align","data","initialValue","onBlur","onFocus","onChange","ref","tabIndex","Indicator","reason","columnName","String","header","validationErrors","role","Highlight","rowValues","newValue","globalFilter","getState","isFilteredByGlobalFilter","Object","values","some","globalFilterFn","IndicatorReason","SEARCH","getIsFiltered","columnFilterFn","getFilterValue","FILTER","getIsSorted","willRowMoveAfterSorting","_table$getState$sorti","sorting","find","s","desc","SORTING"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/Indicator.js

@@ -1,4 +1,5 @@
 import React__default from 'react';
+import cn from 'classnames';
 import { Icon } from '../../../../Icon/Icon.js';
 import { Tooltip } from '../../../../Tooltip/Tooltip.js';
 import { useLocalization } from '../../../../Provider/Localization.js';
@@ -69,6 +70,19 @@ const Indicator = ({
     className: "!h-4 !w-4 rounded-full bg-white !p-0 text-blue-500"
   }), indicatorText.title)), container);
 };
+/**
+ * Generates class names needed to highlight row cells, used when row has a move indicator
+ */
+function getIndicatorCellClassName(columnIndex, lastColumnIndex) {
+  return cn('!border-blue !border-y-2 border-x-0', {
+    'border-l-2 rounded-l': columnIndex === 0,
+    'border-r-2 rounded-r': columnIndex === lastColumnIndex
+  });
+}
+function isIndicatorVisible(rowIndex, rowActiveIndex, rowMoveReason) {
+  const isActiveRow = rowActiveIndex === rowIndex;
+  return isActiveRow && rowMoveReason;
+}
 
-export { Indicator, IndicatorReason, useIndicatorText };
+export { Indicator, IndicatorReason, getIndicatorCellClassName, isIndicatorVisible, useIndicatorText };
 //# sourceMappingURL=Indicator.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Indicator.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Indicator.tsx"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { Icon } from '../../../../Icon/Icon';\n\nexport enum IndicatorReason {\n    SEARCH = 'SEARCH',\n    SORTING = 'SORTING',\n    FILTER = 'FILTER',\n}\n\nexport const useIndicatorText = reason => {\n    let title = '';\n    let description = '';\n\n    const { texts } = useLocalization();\n\n    switch (reason) {\n        case IndicatorReason.FILTER:\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonFilter;\n            break;\n        case IndicatorReason.SEARCH:\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSearch;\n            break;\n        case IndicatorReason.SORTING:\n            title = texts.table3.editing.rowIndicator.rowWillMove;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSorting;\n            break;\n    }\n\n    return { title, description };\n};\n\nexport type IndicatorProps = {\n    reason: IndicatorReason;\n    columnName: string;\n    mountNode: Element | null;\n    validationErrors: any;\n};\nexport const Indicator = ({ reason, columnName, mountNode, validationErrors }: IndicatorProps) => {\n    const container = React.useMemo(() => {\n        const element = document.createElement('div');\n        element.className +=\n            'rounded-b-md items-center wcag-blue-500 absolute left-0 top-full ml-1 whitespace-nowrap px-1 py-0.5 text-xs font-bold shadow-sm';\n\n        return element;\n    }, []);\n\n    const indicatorText = useIndicatorText(reason);\n\n    const hasValidationErrorsInRow = !!validationErrors;\n\n    React.useEffect(() => {\n        // mountNode could be null when rows are filtered\n        // Pinned columns has z-20 class assigned, which overlaps indicator element, need to add z-21 to overlap pinned columns.\n        mountNode?.classList.add('!z-[21]', 'relative');\n        mountNode?.appendChild(container);\n\n        return () => {\n            mountNode?.classList.remove('!z-[21]', 'relative');\n            mountNode?.removeChild(container);\n        };\n    }, [hasValidationErrorsInRow, mountNode]);\n\n    // Using react portal inside a react tree component is an unorthodox way, but in order to avoid much code refactoring\n    // and being able to use Taco Tooltip component in side the visual indicator, portal is used.\n    return ReactDOM.createPortal(\n        <Tooltip title={indicatorText.description.replace('[COLUMN]', columnName)}>\n            <span className=\"flex gap-1 hover:cursor-pointer\">\n                <Icon name=\"info\" className=\"!h-4 !w-4 rounded-full bg-white !p-0 text-blue-500\" />\n                {indicatorText.title}\n            </span>\n        </Tooltip>,\n        container\n    );\n};\n"],"names":["IndicatorReason","useIndicatorText","reason","title","description","texts","useLocalization","FILTER","table3","editing","rowIndicator","rowWillBeHidden","rowWillMoveReasonFilter","SEARCH","rowWillMoveReasonSearch","SORTING","rowWillMove","rowWillMoveReasonSorting","Indicator","columnName","mountNode","validationErrors","container","React","useMemo","element","document","createElement","className","indicatorText","hasValidationErrorsInRow","useEffect","classList","add","appendChild","remove","removeChild","ReactDOM","createPortal","Tooltip","replace","Icon","name"],"mappings":";;;;;;IAMYA;AAAZ,WAAYA,eAAe;EACvBA,oCAAiB;EACjBA,sCAAmB;EACnBA,oCAAiB;AACrB,CAAC,EAJWA,eAAe,KAAfA,eAAe;MAMdC,gBAAgB,GAAGC,MAAM;EAClC,IAAIC,KAAK,GAAG,EAAE;EACd,IAAIC,WAAW,GAAG,EAAE;EAEpB,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAEnC,QAAQJ,MAAM;IACV,KAAKF,eAAe,CAACO,MAAM;MACvBJ,KAAK,GAAGE,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,YAAY,CAACC,eAAe;MACzDP,WAAW,GAAGC,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,YAAY,CAACE,uBAAuB;MACvE;IACJ,KAAKZ,eAAe,CAACa,MAAM;MACvBV,KAAK,GAAGE,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,YAAY,CAACC,eAAe;MACzDP,WAAW,GAAGC,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,YAAY,CAACI,uBAAuB;MACvE;IACJ,KAAKd,eAAe,CAACe,OAAO;MACxBZ,KAAK,GAAGE,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,YAAY,CAACM,WAAW;MACrDZ,WAAW,GAAGC,KAAK,CAACG,MAAM,CAACC,OAAO,CAACC,YAAY,CAACO,wBAAwB;MACxE;;EAGR,OAAO;IAAEd,KAAK;IAAEC;GAAa;AACjC;MAQac,SAAS,GAAGA,CAAC;EAAEhB,MAAM;EAAEiB,UAAU;EAAEC,SAAS;EAAEC;CAAkC;EACzF,MAAMC,SAAS,GAAGC,cAAK,CAACC,OAAO,CAAC;IAC5B,MAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;IAC7CF,OAAO,CAACG,SAAS,IACb,iIAAiI;IAErI,OAAOH,OAAO;GACjB,EAAE,EAAE,CAAC;EAEN,MAAMI,aAAa,GAAG5B,gBAAgB,CAACC,MAAM,CAAC;EAE9C,MAAM4B,wBAAwB,GAAG,CAAC,CAACT,gBAAgB;EAEnDE,cAAK,CAACQ,SAAS,CAAC;;;IAGZX,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAEY,SAAS,CAACC,GAAG,CAAC,SAAS,EAAE,UAAU,CAAC;IAC/Cb,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAEc,WAAW,CAACZ,SAAS,CAAC;IAEjC,OAAO;MACHF,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAEY,SAAS,CAACG,MAAM,CAAC,SAAS,EAAE,UAAU,CAAC;MAClDf,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAEgB,WAAW,CAACd,SAAS,CAAC;KACpC;GACJ,EAAE,CAACQ,wBAAwB,EAAEV,SAAS,CAAC,CAAC;;;EAIzC,oBAAOiB,QAAQ,CAACC,YAAY,eACxBf,6BAACgB,OAAO;IAACpC,KAAK,EAAE0B,aAAa,CAACzB,WAAW,CAACoC,OAAO,CAAC,UAAU,EAAErB,UAAU;kBACpEI;IAAMK,SAAS,EAAC;kBACZL,6BAACkB,IAAI;IAACC,IAAI,EAAC,MAAM;IAACd,SAAS,EAAC;IAAuD,EAClFC,aAAa,CAAC1B,KAAK,CACjB,CACD,EACVmB,SAAS,CACZ;AACL;;;;"}
+{"version":3,"file":"Indicator.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Indicator.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport ReactDOM from 'react-dom';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { Icon } from '../../../../Icon/Icon';\n\nexport enum IndicatorReason {\n    SEARCH = 'SEARCH',\n    SORTING = 'SORTING',\n    FILTER = 'FILTER',\n}\n\nexport const useIndicatorText = reason => {\n    let title = '';\n    let description = '';\n\n    const { texts } = useLocalization();\n\n    switch (reason) {\n        case IndicatorReason.FILTER:\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonFilter;\n            break;\n        case IndicatorReason.SEARCH:\n            title = texts.table3.editing.rowIndicator.rowWillBeHidden;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSearch;\n            break;\n        case IndicatorReason.SORTING:\n            title = texts.table3.editing.rowIndicator.rowWillMove;\n            description = texts.table3.editing.rowIndicator.rowWillMoveReasonSorting;\n            break;\n    }\n\n    return { title, description };\n};\n\nexport type IndicatorProps = {\n    reason: IndicatorReason;\n    columnName: string;\n    mountNode: Element | null;\n    validationErrors: any;\n};\nexport const Indicator = ({ reason, columnName, mountNode, validationErrors }: IndicatorProps) => {\n    const container = React.useMemo(() => {\n        const element = document.createElement('div');\n        element.className +=\n            'rounded-b-md items-center wcag-blue-500 absolute left-0 top-full ml-1 whitespace-nowrap px-1 py-0.5 text-xs font-bold shadow-sm';\n\n        return element;\n    }, []);\n\n    const indicatorText = useIndicatorText(reason);\n\n    const hasValidationErrorsInRow = !!validationErrors;\n\n    React.useEffect(() => {\n        // mountNode could be null when rows are filtered\n        // Pinned columns has z-20 class assigned, which overlaps indicator element, need to add z-21 to overlap pinned columns.\n        mountNode?.classList.add('!z-[21]', 'relative');\n        mountNode?.appendChild(container);\n\n        return () => {\n            mountNode?.classList.remove('!z-[21]', 'relative');\n            mountNode?.removeChild(container);\n        };\n    }, [hasValidationErrorsInRow, mountNode]);\n\n    // Using react portal inside a react tree component is an unorthodox way, but in order to avoid much code refactoring\n    // and being able to use Taco Tooltip component in side the visual indicator, portal is used.\n    return ReactDOM.createPortal(\n        <Tooltip title={indicatorText.description.replace('[COLUMN]', columnName)}>\n            <span className=\"flex gap-1 hover:cursor-pointer\">\n                <Icon name=\"info\" className=\"!h-4 !w-4 rounded-full bg-white !p-0 text-blue-500\" />\n                {indicatorText.title}\n            </span>\n        </Tooltip>,\n        container\n    );\n};\n\n/**\n * Generates class names needed to highlight row cells, used when row has a move indicator\n */\nexport function getIndicatorCellClassName(columnIndex: number, lastColumnIndex: number) {\n    return cn('!border-blue !border-y-2 border-x-0', {\n        'border-l-2 rounded-l': columnIndex === 0,\n        'border-r-2 rounded-r': columnIndex === lastColumnIndex,\n    });\n}\n\nexport function isIndicatorVisible(rowIndex, rowActiveIndex, rowMoveReason) {\n    const isActiveRow = rowActiveIndex === rowIndex;\n    return isActiveRow && rowMoveReason;\n}\n"],"names":["IndicatorReason","useIndicatorText","reason","title","description","texts","useLocalization","FILTER","table3","editing","rowIndicator","rowWillBeHidden","rowWillMoveReasonFilter","SEARCH","rowWillMoveReasonSearch","SORTING","rowWillMove","rowWillMoveReasonSorting","Indicator","columnName","mountNode","validationErrors","container","React","useMemo","element","document","createElement","className","indicatorText","hasValidationErrorsInRow","useEffect","classList","add","appendChild","remove","removeChild","ReactDOM","createPortal","Tooltip","replace","Icon","name","getIndicatorCellClassName","columnIndex","lastColumnIndex","cn","isIndicatorVisible","rowIndex","rowActiveIndex","rowMoveReason","isActiveRow"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Actions.js

@@ -9,6 +9,7 @@ import { RowContext } from '../../rows/RowContext.js';
 import { DisplayCell } from '../cell/DisplayCell.js';
 import { Footer } from '../footer/Footer.js';
 import { FONT_SIZE } from '../../toolbar/FontSize.js';
+import { isIndicatorVisible, getIndicatorCellClassName } from '../cell/Indicator.js';
 
 const COLUMN_ID = '__actions';
 const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
@@ -54,7 +55,7 @@ const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
       // Adjust negative margin on row actions cell to ensure that the cell aligns vertically.
       '-mt-2': fontSize === FONT_SIZE.small,
       '-mt-1.5': fontSize !== FONT_SIZE.small
-    });
+    }, props.className);
     content = /*#__PURE__*/React__default.createElement("span", {
       className: className,
       ref: ref
@@ -89,9 +90,13 @@ function Cell(context) {
     rowIndex
   } = React__default.useContext(RowContext);
   const tableMeta = context.table.options.meta;
+  const allVisibleColumns = context.table.getVisibleLeafColumns();
+  const lastColumnIndex = allVisibleColumns.length > 0 ? allVisibleColumns.length - 1 : 0;
+  const className = isIndicatorVisible(rowIndex, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.rowMoveReason) ? getIndicatorCellClassName(context.index, lastColumnIndex) : undefined;
   return /*#__PURE__*/React__default.createElement(MemoedCell, Object.assign({}, context, {
     actions: tableMeta.rowActions.actionsForRow,
     actionsLength: tableMeta.rowActions.actionsForRowLength,
+    className: className,
     fontSize: tableMeta.fontSize.size,
     isActiveRow: tableMeta.rowActive.rowActiveIndex === rowIndex,
     isEditing: tableMeta.editing.isEditing,

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

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Table3FontSize, Table3RowActionRenderer } from '../../../types';\nimport { RowContext } from '../../rows/RowContext';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Menu } from '../../../../Menu/Menu';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { Footer } from '../footer/Footer';\nimport { FONT_SIZE } from '../../toolbar/FontSize';\n\nexport const COLUMN_ID = '__actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    actions?: Table3RowActionRenderer<TType>[];\n    actionsLength: number;\n    fontSize: Table3FontSize;\n    isActiveRow: boolean;\n    isEditing: boolean;\n    isResizingColumn: boolean;\n    isHoverStatePaused: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { actions, actionsLength, fontSize, isActiveRow, isEditing, isResizingColumn, isHoverStatePaused, row } = props;\n    const { isHovered } = React.useContext(RowContext);\n    const { texts } = useLocalization();\n    const ref = React.useRef<HTMLSpanElement | null>(null);\n    /*\n    const size = table.getState().columnSizing[COLUMN_ID];\n\n    // the actions column needs to set its size based on its content, not the actual column\n    // so we do this here instead of in the header\n    React.useLayoutEffect(() => {\n        if (ref.current && !size) {\n            const width = ref.current.getBoundingClientRect().width;\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [COLUMN_ID]: width,\n            }));\n        }\n    }, [ref.current]);\n    */\n\n    let content;\n\n    // We don't want to show actions in edit mode, since we have editing actions,\n    // which is shown in edit mode instead.\n    if (actions?.length && !isEditing && (isActiveRow || (isHovered && !isHoverStatePaused && !isResizingColumn))) {\n        const visibleActions = actions.map(action => action(row.original)).filter(action => !!action) as JSX.Element[];\n\n        const actionsOnRow =\n            visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n        const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n        const className = cn('-mb-2 flex justify-end pl-2 text-right', {\n            // Adjust negative margin on row actions cell to ensure that the cell aligns vertically.\n            '-mt-2': fontSize === FONT_SIZE.small,\n            '-mt-1.5': fontSize !== FONT_SIZE.small,\n        });\n\n        content = (\n            <span className={className} ref={ref}>\n                {actionsOnRow.map((button, index) => {\n                    const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n                    return React.cloneElement(button, {\n                        appearance: 'transparent',\n                        key: index,\n                        tabIndex: isActiveRow ? 0 : -1,\n                        tooltip: button.props.shortcut ? (\n                            <>\n                                {tooltip}\n                                <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n                            </>\n                        ) : (\n                            tooltip\n                        ),\n                    });\n                })}\n                {actionsInMenu.length ? (\n                    <IconButton\n                        appearance=\"transparent\"\n                        aria-label={texts.table3.columns.actions.tooltip}\n                        icon=\"more\"\n                        tabIndex={isActiveRow ? 0 : -1}\n                        menu={menuProps => (\n                            <Menu {...menuProps}>\n                                <Menu.Content>\n                                    {actionsInMenu.map((action, i) => (\n                                        <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n                                            {action.props['aria-label']}\n                                        </Menu.Item>\n                                    ))}\n                                </Menu.Content>\n                            </Menu>\n                        )}\n                    />\n                ) : null}\n            </span>\n        );\n    }\n\n    return <DisplayCell {...props}>{content}</DisplayCell>;\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown>;\n\nfunction Cell<TType = unknown>(context: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell<TType>\n            {...context}\n            actions={tableMeta.rowActions.actionsForRow}\n            actionsLength={tableMeta.rowActions.actionsForRowLength}\n            fontSize={tableMeta.fontSize.size}\n            isActiveRow={tableMeta.rowActive.rowActiveIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n            isResizingColumn={!!context.table.getState().columnSizingInfo.isResizingColumn}\n            isHoverStatePaused={!!tableMeta.rowActive.isHoverStatePaused}\n        />\n    );\n}\n\nexport function createRowActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                '!pt-[var(--table3-cell-padding-y)] print:opacity-0 [[role=\"table\"][data-editing=\"false\"]_&]:group-[[data-current=\"true\"]]/row:sticky [[role=\"table\"][data-pause-hover=\"false\"][data-editing=\"false\"]_&]:group-hover/row:sticky right-0 !pl-1 !pr-1',\n                'shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n    };\n}\n"],"names":["COLUMN_ID","MemoedCell","React","memo","props","actions","actionsLength","fontSize","isActiveRow","isEditing","isResizingColumn","isHoverStatePaused","row","isHovered","useContext","RowContext","texts","useLocalization","ref","useRef","content","length","visibleActions","map","action","original","filter","actionsOnRow","slice","actionsInMenu","className","cn","FONT_SIZE","small","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","table3","columns","icon","menu","menuProps","Menu","Content","i","Item","DisplayCell","Cell","context","rowIndex","tableMeta","table","options","meta","rowActions","actionsForRow","actionsForRowLength","size","rowActive","rowActiveIndex","editing","getState","columnSizingInfo","createRowActionsColumn","id","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing"],"mappings":"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"}
+{"version":3,"file":"Actions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Table3FontSize, Table3RowActionRenderer } from '../../../types';\nimport { RowContext } from '../../rows/RowContext';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Menu } from '../../../../Menu/Menu';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { Footer } from '../footer/Footer';\nimport { FONT_SIZE } from '../../toolbar/FontSize';\nimport { getIndicatorCellClassName, isIndicatorVisible } from '../cell/Indicator';\n\nexport const COLUMN_ID = '__actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    actions?: Table3RowActionRenderer<TType>[];\n    actionsLength: number;\n    className?: string;\n    fontSize: Table3FontSize;\n    isActiveRow: boolean;\n    isEditing: boolean;\n    isResizingColumn: boolean;\n    isHoverStatePaused: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { actions, actionsLength, fontSize, isActiveRow, isEditing, isResizingColumn, isHoverStatePaused, row } = props;\n    const { isHovered } = React.useContext(RowContext);\n    const { texts } = useLocalization();\n    const ref = React.useRef<HTMLSpanElement | null>(null);\n    /*\n    const size = table.getState().columnSizing[COLUMN_ID];\n\n    // the actions column needs to set its size based on its content, not the actual column\n    // so we do this here instead of in the header\n    React.useLayoutEffect(() => {\n        if (ref.current && !size) {\n            const width = ref.current.getBoundingClientRect().width;\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [COLUMN_ID]: width,\n            }));\n        }\n    }, [ref.current]);\n    */\n\n    let content;\n\n    // We don't want to show actions in edit mode, since we have editing actions,\n    // which is shown in edit mode instead.\n    if (actions?.length && !isEditing && (isActiveRow || (isHovered && !isHoverStatePaused && !isResizingColumn))) {\n        const visibleActions = actions.map(action => action(row.original)).filter(action => !!action) as JSX.Element[];\n\n        const actionsOnRow =\n            visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n        const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n        const className = cn(\n            '-mb-2 flex justify-end pl-2 text-right',\n            {\n                // Adjust negative margin on row actions cell to ensure that the cell aligns vertically.\n                '-mt-2': fontSize === FONT_SIZE.small,\n                '-mt-1.5': fontSize !== FONT_SIZE.small,\n            },\n            props.className\n        );\n\n        content = (\n            <span className={className} ref={ref}>\n                {actionsOnRow.map((button, index) => {\n                    const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n                    return React.cloneElement(button, {\n                        appearance: 'transparent',\n                        key: index,\n                        tabIndex: isActiveRow ? 0 : -1,\n                        tooltip: button.props.shortcut ? (\n                            <>\n                                {tooltip}\n                                <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n                            </>\n                        ) : (\n                            tooltip\n                        ),\n                    });\n                })}\n                {actionsInMenu.length ? (\n                    <IconButton\n                        appearance=\"transparent\"\n                        aria-label={texts.table3.columns.actions.tooltip}\n                        icon=\"more\"\n                        tabIndex={isActiveRow ? 0 : -1}\n                        menu={menuProps => (\n                            <Menu {...menuProps}>\n                                <Menu.Content>\n                                    {actionsInMenu.map((action, i) => (\n                                        <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n                                            {action.props['aria-label']}\n                                        </Menu.Item>\n                                    ))}\n                                </Menu.Content>\n                            </Menu>\n                        )}\n                    />\n                ) : null}\n            </span>\n        );\n    }\n\n    return <DisplayCell {...props}>{content}</DisplayCell>;\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown>;\n\nfunction Cell<TType = unknown>(context: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = context.table.options.meta as TableMeta<TType>;\n    const allVisibleColumns = context.table.getVisibleLeafColumns();\n    const lastColumnIndex = allVisibleColumns.length > 0 ? allVisibleColumns.length - 1 : 0;\n    const className = isIndicatorVisible(rowIndex, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.rowMoveReason)\n        ? getIndicatorCellClassName(context.index, lastColumnIndex)\n        : undefined;\n\n    return (\n        <MemoedCell<TType>\n            {...context}\n            actions={tableMeta.rowActions.actionsForRow}\n            actionsLength={tableMeta.rowActions.actionsForRowLength}\n            className={className}\n            fontSize={tableMeta.fontSize.size}\n            isActiveRow={tableMeta.rowActive.rowActiveIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n            isResizingColumn={!!context.table.getState().columnSizingInfo.isResizingColumn}\n            isHoverStatePaused={!!tableMeta.rowActive.isHoverStatePaused}\n        />\n    );\n}\n\nexport function createRowActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                '!pt-[var(--table3-cell-padding-y)] print:opacity-0 [[role=\"table\"][data-editing=\"false\"]_&]:group-[[data-current=\"true\"]]/row:sticky [[role=\"table\"][data-pause-hover=\"false\"][data-editing=\"false\"]_&]:group-hover/row:sticky right-0 !pl-1 !pr-1',\n                'shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n    };\n}\n"],"names":["COLUMN_ID","MemoedCell","React","memo","props","actions","actionsLength","fontSize","isActiveRow","isEditing","isResizingColumn","isHoverStatePaused","row","isHovered","useContext","RowContext","texts","useLocalization","ref","useRef","content","length","visibleActions","map","action","original","filter","actionsOnRow","slice","actionsInMenu","className","cn","FONT_SIZE","small","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","table3","columns","icon","menu","menuProps","Menu","Content","i","Item","DisplayCell","Cell","context","rowIndex","tableMeta","table","options","meta","allVisibleColumns","getVisibleLeafColumns","lastColumnIndex","isIndicatorVisible","rowActive","rowActiveIndex","editing","rowMoveReason","getIndicatorCellClassName","undefined","rowActions","actionsForRow","actionsForRowLength","size","getState","columnSizingInfo","createRowActionsColumn","id","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/EditingActions.js

@@ -14,6 +14,7 @@ import { Header } from '../header/Header.js';
 import { RowContext } from '../../rows/RowContext.js';
 import { DisplayCell } from '../cell/DisplayCell.js';
 import { Footer } from '../footer/Footer.js';
+import { isIndicatorVisible, getIndicatorCellClassName } from '../cell/Indicator.js';
 import { getColumnIndex } from '../../../util/editing.js';
 import { lastCellIndex } from '../../rows/Row.js';
 import { SavingStatusValue } from '../../../hooks/features/useEditing.js';
@@ -23,10 +24,11 @@ const COLUMN_ID = '__editing_actions';
 const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
   var _column$columnDef$met;
   const {
+    className,
+    editing,
     hasChanges,
     isActiveRow,
     row,
-    editing,
     rowIdentifier,
     table
   } = props;
@@ -120,7 +122,7 @@ const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
     '-mb-2 -mt-2': isActiveRow
   });
   return /*#__PURE__*/React__default.createElement(DisplayCell, Object.assign({}, props, {
-    className: cn({
+    className: cn(className, {
       '!sticky': !!content
     })
   }), content ? /*#__PURE__*/React__default.createElement("span", {
@@ -133,10 +135,14 @@ function Cell(props) {
   } = React__default.useContext(RowContext);
   const tableMeta = props.table.options.meta;
   const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];
+  const allVisibleColumns = props.table.getVisibleLeafColumns();
+  const lastColumnIndex = allVisibleColumns.length > 0 ? allVisibleColumns.length - 1 : 0;
+  const className = isIndicatorVisible(rowIndex, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.rowMoveReason) ? getIndicatorCellClassName(props.index, lastColumnIndex) : undefined;
   return /*#__PURE__*/React__default.createElement(MemoedCell, Object.assign({}, props, {
+    className: className,
+    editing: tableMeta.editing,
     hasChanges: changeset.indexOf(props.row.id) >= 0,
-    isActiveRow: tableMeta.rowActive.rowActiveIndex === rowIndex,
-    editing: tableMeta.editing
+    isActiveRow: tableMeta.rowActive.rowActiveIndex === rowIndex
   }));
 }
 const EDITING_ACTIONS_WIDTH = 60;

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

@@ -1 +1 @@
-{"version":3,"file":"EditingActions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/EditingActions.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { CellContext, TableMeta, DisplayColumnDef } from '@tanstack/react-table';\nimport { Spinner } from '../../../../Spinner/Spinner';\nimport { SavingStatusValue, useEditing } from '../../../hooks/features/useEditing';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { RowContext } from '../../rows/RowContext';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { Footer } from '../footer/Footer';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport useTimer from '../../../../../utils/hooks/useTimer';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { Dialog } from '../../../../Dialog/Dialog';\nimport { Group } from '../../../../Group/Group';\nimport { Button } from '../../../../Button/Button';\nimport { lastCellIndex } from '../../rows/Row';\nimport { getColumnIndex } from '../../../util/editing';\n\nexport type EditingActionsProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    isHovered: boolean;\n};\n\nconst savingIndicatorHideDelay = 3000;\n\nexport const COLUMN_ID = '__editing_actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    hasChanges: boolean;\n    isActiveRow: boolean;\n    editing: ReturnType<typeof useEditing>;\n    rowIdentifier?: string;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { hasChanges, isActiveRow, row, editing, rowIdentifier, table } = props;\n\n    const savingStatus = editing.getSavingStatus(row.id);\n    const [isSavedIndicatorVisible, setIsSavingIndicatorVisible] = React.useState(false);\n    const { texts } = useLocalization();\n    const [clearConfirmationOpen, setClearConfirmationOpen] = React.useState(false);\n    const columns = table.getAllFlatColumns();\n    const column = columns.find(column => column.id === rowIdentifier);\n    const rowIdentifierHeader = column?.columnDef.meta?.header;\n    const edititngActionsRef = React.useRef<HTMLButtonElement | HTMLAnchorElement>(null);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const handleSaved = () => {\n        setIsSavingIndicatorVisible(false);\n        editing.resetSavingStatus(row.id);\n    };\n    const timer = useTimer(savingIndicatorHideDelay, handleSaved);\n\n    React.useEffect(() => {\n        if (savingStatus && savingStatus === SavingStatusValue.Saved && !isSavedIndicatorVisible) {\n            setIsSavingIndicatorVisible(true);\n            timer.start();\n        }\n    }, [savingStatus]);\n\n    React.useEffect(() => {\n        tableMeta.shortcutsState.pause(clearConfirmationOpen);\n    }, [clearConfirmationOpen]);\n\n    let content;\n\n    if (savingStatus) {\n        if (savingStatus === SavingStatusValue.Saving) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.progress}>\n                    <Spinner delay={0} className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        } else if (isSavedIndicatorVisible) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.complete}>\n                    <Icon name=\"tick\" className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        }\n    }\n\n    if (editing.isEditing && isActiveRow) {\n        content = (\n            <>\n                {content}\n                <IconButton\n                    ref={edititngActionsRef}\n                    appearance=\"transparent\"\n                    aria-label={texts.table3.editing.actions.tooltip}\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                <Menu.Item icon=\"tick\" disabled={!hasChanges} onClick={() => editing.saveChangesIfNeeded()}>\n                                    {texts.table3.editing.actions.save}\n                                </Menu.Item>\n                                <Menu.Item icon=\"close\" disabled={!hasChanges} onClick={() => setClearConfirmationOpen(true)}>\n                                    {texts.table3.editing.actions.clear}\n                                </Menu.Item>\n                                <Menu.Item icon=\"undo\" onClick={() => editing.toggleEditing(false)}>\n                                    {texts.table3.editing.actions.exit}\n                                </Menu.Item>\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                    tabIndex={isActiveRow ? 0 : -1}\n                />\n                <Dialog\n                    size=\"xs\"\n                    open={clearConfirmationOpen}\n                    onClose={() => {\n                        setClearConfirmationOpen(false);\n                        requestAnimationFrame(() => {\n                            if (edititngActionsRef.current) {\n                                edititngActionsRef.current.focus();\n                                // When table looses focus, we need to re-set the last column index\n                                lastCellIndex.value = getColumnIndex(edititngActionsRef.current);\n                            }\n                        });\n                    }}>\n                    <Dialog.Content aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}>\n                        <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                        <p>\n                            {texts.table3.editing.clearChangesConfirmationDialog.description\n                                .replace(\n                                    '[ROW_IDENTIFIER]',\n                                    rowIdentifier && rowIdentifierHeader ? rowIdentifierHeader : texts.table3.validation.index\n                                )\n                                .replace(\n                                    '[ROW_IDENTIFIER_VALUE]',\n                                    rowIdentifier && rowIdentifierHeader ? row.original[rowIdentifier] : row.index\n                                )}\n                        </p>\n\n                        <Dialog.Footer>\n                            <Group>\n                                <Dialog.Close>\n                                    <Button tabIndex={0}>{texts.table3.editing.clearChangesConfirmationDialog.cancel}</Button>\n                                </Dialog.Close>\n                                <Dialog.Close>\n                                    <Button\n                                        tabIndex={0}\n                                        appearance=\"primary\"\n                                        autoFocus\n                                        onClick={() => editing.resetChange(row.id)}>\n                                        {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                    </Button>\n                                </Dialog.Close>\n                            </Group>\n                        </Dialog.Footer>\n                    </Dialog.Content>\n                </Dialog>\n            </>\n        );\n    }\n\n    const contentClassName = cn('flex items-center justify-end text-right', { '-mb-2 -mt-2': isActiveRow });\n    return (\n        <DisplayCell {...props} className={cn({ '!sticky': !!content })}>\n            {content ? <span className={contentClassName}>{content}</span> : undefined}\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    rowIdentifier?: string;\n};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];\n\n    return (\n        <MemoedCell\n            {...props}\n            hasChanges={changeset.indexOf(props.row.id) >= 0}\n            isActiveRow={tableMeta.rowActive.rowActiveIndex === rowIndex}\n            editing={tableMeta.editing}\n        />\n    );\n}\n\nexport const EDITING_ACTIONS_WIDTH = 60;\n\nexport function createRowEditingActionsColumn<TType = unknown>(rowIdentifier?: string): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: (context: CellContext<TType, unknown>) => <Cell {...context} rowIdentifier={rowIdentifier} />,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                'items-center print:opacity-0 [[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:sticky right-0 !pl-0 !pr-1',\n                '[[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: EDITING_ACTIONS_WIDTH,\n        minSize: EDITING_ACTIONS_WIDTH,\n    };\n}\n"],"names":["savingIndicatorHideDelay","COLUMN_ID","MemoedCell","React","memo","props","hasChanges","isActiveRow","row","editing","rowIdentifier","table","savingStatus","getSavingStatus","id","isSavedIndicatorVisible","setIsSavingIndicatorVisible","useState","texts","useLocalization","clearConfirmationOpen","setClearConfirmationOpen","columns","getAllFlatColumns","column","find","rowIdentifierHeader","_column$columnDef$met","columnDef","meta","header","edititngActionsRef","useRef","tableMeta","options","handleSaved","resetSavingStatus","timer","useTimer","useEffect","SavingStatusValue","Saved","start","shortcutsState","pause","content","Saving","Tooltip","title","table3","saving","progress","Spinner","delay","className","complete","Icon","name","isEditing","IconButton","ref","appearance","actions","tooltip","icon","menu","menuProps","Menu","Content","Item","disabled","onClick","saveChangesIfNeeded","save","clear","toggleEditing","exit","tabIndex","Dialog","size","open","onClose","requestAnimationFrame","current","focus","lastCellIndex","value","getColumnIndex","clearChangesConfirmationDialog","Title","description","replace","validation","index","original","Footer","Group","Close","Button","cancel","autoFocus","resetChange","confirm","contentClassName","cn","DisplayCell","undefined","Cell","rowIndex","useContext","RowContext","changeset","changes","Object","keys","indexOf","rowActive","rowActiveIndex","EDITING_ACTIONS_WIDTH","createRowEditingActionsColumn","ColumnHeader","cell","context","footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","minSize"],"mappings":"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"}
+{"version":3,"file":"EditingActions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/EditingActions.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { CellContext, TableMeta, DisplayColumnDef } from '@tanstack/react-table';\nimport { Spinner } from '../../../../Spinner/Spinner';\nimport { SavingStatusValue, useEditing } from '../../../hooks/features/useEditing';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { RowContext } from '../../rows/RowContext';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { Footer } from '../footer/Footer';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport useTimer from '../../../../../utils/hooks/useTimer';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { Dialog } from '../../../../Dialog/Dialog';\nimport { Group } from '../../../../Group/Group';\nimport { Button } from '../../../../Button/Button';\nimport { lastCellIndex } from '../../rows/Row';\nimport { getColumnIndex } from '../../../util/editing';\nimport { getIndicatorCellClassName, isIndicatorVisible } from '../cell/Indicator';\n\nexport type EditingActionsProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    isHovered: boolean;\n};\n\nconst savingIndicatorHideDelay = 3000;\n\nexport const COLUMN_ID = '__editing_actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    editing: ReturnType<typeof useEditing>;\n    hasChanges: boolean;\n    isActiveRow: boolean;\n    rowIdentifier?: string;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { className, editing, hasChanges, isActiveRow, row, rowIdentifier, table } = props;\n\n    const savingStatus = editing.getSavingStatus(row.id);\n    const [isSavedIndicatorVisible, setIsSavingIndicatorVisible] = React.useState(false);\n    const { texts } = useLocalization();\n    const [clearConfirmationOpen, setClearConfirmationOpen] = React.useState(false);\n    const columns = table.getAllFlatColumns();\n    const column = columns.find(column => column.id === rowIdentifier);\n    const rowIdentifierHeader = column?.columnDef.meta?.header;\n    const edititngActionsRef = React.useRef<HTMLButtonElement | HTMLAnchorElement>(null);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const handleSaved = () => {\n        setIsSavingIndicatorVisible(false);\n        editing.resetSavingStatus(row.id);\n    };\n    const timer = useTimer(savingIndicatorHideDelay, handleSaved);\n\n    React.useEffect(() => {\n        if (savingStatus && savingStatus === SavingStatusValue.Saved && !isSavedIndicatorVisible) {\n            setIsSavingIndicatorVisible(true);\n            timer.start();\n        }\n    }, [savingStatus]);\n\n    React.useEffect(() => {\n        tableMeta.shortcutsState.pause(clearConfirmationOpen);\n    }, [clearConfirmationOpen]);\n\n    let content;\n\n    if (savingStatus) {\n        if (savingStatus === SavingStatusValue.Saving) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.progress}>\n                    <Spinner delay={0} className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        } else if (isSavedIndicatorVisible) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.complete}>\n                    <Icon name=\"tick\" className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        }\n    }\n\n    if (editing.isEditing && isActiveRow) {\n        content = (\n            <>\n                {content}\n                <IconButton\n                    ref={edititngActionsRef}\n                    appearance=\"transparent\"\n                    aria-label={texts.table3.editing.actions.tooltip}\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                <Menu.Item icon=\"tick\" disabled={!hasChanges} onClick={() => editing.saveChangesIfNeeded()}>\n                                    {texts.table3.editing.actions.save}\n                                </Menu.Item>\n                                <Menu.Item icon=\"close\" disabled={!hasChanges} onClick={() => setClearConfirmationOpen(true)}>\n                                    {texts.table3.editing.actions.clear}\n                                </Menu.Item>\n                                <Menu.Item icon=\"undo\" onClick={() => editing.toggleEditing(false)}>\n                                    {texts.table3.editing.actions.exit}\n                                </Menu.Item>\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                    tabIndex={isActiveRow ? 0 : -1}\n                />\n                <Dialog\n                    size=\"xs\"\n                    open={clearConfirmationOpen}\n                    onClose={() => {\n                        setClearConfirmationOpen(false);\n                        requestAnimationFrame(() => {\n                            if (edititngActionsRef.current) {\n                                edititngActionsRef.current.focus();\n                                // When table looses focus, we need to re-set the last column index\n                                lastCellIndex.value = getColumnIndex(edititngActionsRef.current);\n                            }\n                        });\n                    }}>\n                    <Dialog.Content aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}>\n                        <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                        <p>\n                            {texts.table3.editing.clearChangesConfirmationDialog.description\n                                .replace(\n                                    '[ROW_IDENTIFIER]',\n                                    rowIdentifier && rowIdentifierHeader ? rowIdentifierHeader : texts.table3.validation.index\n                                )\n                                .replace(\n                                    '[ROW_IDENTIFIER_VALUE]',\n                                    rowIdentifier && rowIdentifierHeader ? row.original[rowIdentifier] : row.index\n                                )}\n                        </p>\n\n                        <Dialog.Footer>\n                            <Group>\n                                <Dialog.Close>\n                                    <Button tabIndex={0}>{texts.table3.editing.clearChangesConfirmationDialog.cancel}</Button>\n                                </Dialog.Close>\n                                <Dialog.Close>\n                                    <Button\n                                        tabIndex={0}\n                                        appearance=\"primary\"\n                                        autoFocus\n                                        onClick={() => editing.resetChange(row.id)}>\n                                        {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                    </Button>\n                                </Dialog.Close>\n                            </Group>\n                        </Dialog.Footer>\n                    </Dialog.Content>\n                </Dialog>\n            </>\n        );\n    }\n\n    const contentClassName = cn('flex items-center justify-end text-right', { '-mb-2 -mt-2': isActiveRow });\n    return (\n        <DisplayCell {...props} className={cn(className, { '!sticky': !!content })}>\n            {content ? <span className={contentClassName}>{content}</span> : undefined}\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    rowIdentifier?: string;\n};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];\n    const allVisibleColumns = props.table.getVisibleLeafColumns();\n    const lastColumnIndex = allVisibleColumns.length > 0 ? allVisibleColumns.length - 1 : 0;\n    const className = isIndicatorVisible(rowIndex, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.rowMoveReason)\n        ? getIndicatorCellClassName(props.index, lastColumnIndex)\n        : undefined;\n\n    return (\n        <MemoedCell\n            {...props}\n            className={className}\n            editing={tableMeta.editing}\n            hasChanges={changeset.indexOf(props.row.id) >= 0}\n            isActiveRow={tableMeta.rowActive.rowActiveIndex === rowIndex}\n        />\n    );\n}\n\nexport const EDITING_ACTIONS_WIDTH = 60;\n\nexport function createRowEditingActionsColumn<TType = unknown>(rowIdentifier?: string): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: (context: CellContext<TType, unknown>) => <Cell {...context} rowIdentifier={rowIdentifier} />,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                'items-center print:opacity-0 [[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:sticky right-0 !pl-0 !pr-1',\n                '[[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: EDITING_ACTIONS_WIDTH,\n        minSize: EDITING_ACTIONS_WIDTH,\n    };\n}\n"],"names":["savingIndicatorHideDelay","COLUMN_ID","MemoedCell","React","memo","props","className","editing","hasChanges","isActiveRow","row","rowIdentifier","table","savingStatus","getSavingStatus","id","isSavedIndicatorVisible","setIsSavingIndicatorVisible","useState","texts","useLocalization","clearConfirmationOpen","setClearConfirmationOpen","columns","getAllFlatColumns","column","find","rowIdentifierHeader","_column$columnDef$met","columnDef","meta","header","edititngActionsRef","useRef","tableMeta","options","handleSaved","resetSavingStatus","timer","useTimer","useEffect","SavingStatusValue","Saved","start","shortcutsState","pause","content","Saving","Tooltip","title","table3","saving","progress","Spinner","delay","complete","Icon","name","isEditing","IconButton","ref","appearance","actions","tooltip","icon","menu","menuProps","Menu","Content","Item","disabled","onClick","saveChangesIfNeeded","save","clear","toggleEditing","exit","tabIndex","Dialog","size","open","onClose","requestAnimationFrame","current","focus","lastCellIndex","value","getColumnIndex","clearChangesConfirmationDialog","Title","description","replace","validation","index","original","Footer","Group","Close","Button","cancel","autoFocus","resetChange","confirm","contentClassName","cn","DisplayCell","undefined","Cell","rowIndex","useContext","RowContext","changeset","changes","Object","keys","allVisibleColumns","getVisibleLeafColumns","lastColumnIndex","length","isIndicatorVisible","rowActive","rowActiveIndex","rowMoveReason","getIndicatorCellClassName","indexOf","EDITING_ACTIONS_WIDTH","createRowEditingActionsColumn","ColumnHeader","cell","context","footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","minSize"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/Filter.js

@@ -27,9 +27,19 @@ function Filter(props) {
     }
   } = filter;
   const handleChangeColumn = columnId => {
+    var _columnPrev$columnDef, _columnNext$columnDef;
+    const columnPrev = allColumns.find(column => column.id === id);
+    const columnNext = allColumns.find(column => column.id === columnId);
+    // UX requirement: if old column data type is the same as next column data type,
+    // then we applying the same filter value for the next column,
+    // but when data types are different, we're reseting comparator ans value for the next column
+    const value = (columnPrev === null || columnPrev === void 0 ? void 0 : (_columnPrev$columnDef = columnPrev.columnDef.meta) === null || _columnPrev$columnDef === void 0 ? void 0 : _columnPrev$columnDef.dataType) === (columnNext === null || columnNext === void 0 ? void 0 : (_columnNext$columnDef = columnNext.columnDef.meta) === null || _columnNext$columnDef === void 0 ? void 0 : _columnNext$columnDef.dataType) ? filter.value : {
+      comparator: null,
+      value: null
+    };
     handleChange(id, {
       id: columnId,
-      value: filter.value
+      value
     });
   };
   const handleChangeComparator = comparator => {

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

@@ -1 +1 @@
-{"version":3,"file":"Filter.js","sources":["../../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/components/Filter.tsx"],"sourcesContent":["import React from 'react';\nimport { Column as RTColumn } from '@tanstack/react-table';\nimport { IconButton } from '../../../../../../IconButton/IconButton';\nimport { Table3Filter, Table3FilterComparator } from '../../../../../types';\nimport { useLocalization } from '../../../../../../Provider/Localization';\nimport { FilterColumn } from './FilterColumn';\nimport { FilterComparator } from './FilterComparator';\nimport { FilterValue } from './FilterValue';\n\nexport type FilterProps<TType = unknown> = {\n    allColumns: RTColumn<TType, unknown>[];\n    filter: Table3Filter;\n    filters: Table3Filter[];\n    position: number;\n    onChange: (id: string | null, value: Table3Filter) => void;\n    onRemove: (columnId: string | null) => void;\n};\n\nexport function Filter<TType = unknown>(props: FilterProps<TType>) {\n    const { allColumns, filter, filters, onChange: handleChange, onRemove, position } = props;\n    const { texts } = useLocalization();\n    const column = allColumns.find(c => c.id === filter.id) as RTColumn<TType, unknown>;\n\n    const {\n        id,\n        value: { comparator, value },\n    } = filter;\n\n    const handleChangeColumn = (columnId: string | null) => {\n        handleChange(id, { id: columnId, value: filter.value });\n    };\n\n    const handleChangeComparator = (comparator: Table3FilterComparator) => {\n        let nextValue = filter.value.value;\n\n        if (comparator === Table3FilterComparator.IsEmpty || comparator === Table3FilterComparator.IsNotEmpty) {\n            nextValue = undefined;\n        }\n        handleChange(id, { id, value: { comparator, value: nextValue } });\n    };\n\n    const handleChangeValue = (value: any) => {\n        handleChange(id, { id, value: { ...filter.value, value } });\n    };\n\n    const handleRemove = () => onRemove(id);\n\n    return (\n        <div className=\"flex items-start gap-2\">\n            <div className=\"flex min-h-[theme(spacing.8)] w-14 flex-shrink-0 items-center justify-end pr-2 text-right\">\n                {position > 0 ? texts.table3.filters.conditions.and : texts.table3.filters.conditions.where}\n            </div>\n            <FilterColumn allColumns={allColumns} filters={filters} onChange={handleChangeColumn as any} value={id} />\n            <FilterComparator column={column} onChange={handleChangeComparator as any} value={comparator} />\n            <FilterValue column={column} comparator={comparator} onChange={handleChangeValue} value={value} />\n            <IconButton appearance=\"discrete\" className=\"ml-auto\" icon=\"close\" onClick={handleRemove} />\n        </div>\n    );\n}\n"],"names":["Filter","props","allColumns","filter","filters","onChange","handleChange","onRemove","position","texts","useLocalization","column","find","c","id","value","comparator","handleChangeColumn","columnId","handleChangeComparator","nextValue","Table3FilterComparator","IsEmpty","IsNotEmpty","undefined","handleChangeValue","handleRemove","React","className","table3","conditions","and","where","FilterColumn","FilterComparator","FilterValue","IconButton","appearance","icon","onClick"],"mappings":";;;;;;;;SAkBgBA,MAAMA,CAAkBC,KAAyB;EAC7D,MAAM;IAAEC,UAAU;IAAEC,MAAM;IAAEC,OAAO;IAAEC,QAAQ,EAAEC,YAAY;IAAEC,QAAQ;IAAEC;GAAU,GAAGP,KAAK;EACzF,MAAM;IAAEQ;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,MAAM,GAAGT,UAAU,CAACU,IAAI,CAACC,CAAC,IAAIA,CAAC,CAACC,EAAE,KAAKX,MAAM,CAACW,EAAE,CAA6B;EAEnF,MAAM;IACFA,EAAE;IACFC,KAAK,EAAE;MAAEC,UAAU;MAAED;;GACxB,GAAGZ,MAAM;EAEV,MAAMc,kBAAkB,GAAIC,QAAuB;IAC/CZ,YAAY,CAACQ,EAAE,EAAE;MAAEA,EAAE,EAAEI,QAAQ;MAAEH,KAAK,EAAEZ,MAAM,CAACY;KAAO,CAAC;GAC1D;EAED,MAAMI,sBAAsB,GAAIH,UAAkC;IAC9D,IAAII,SAAS,GAAGjB,MAAM,CAACY,KAAK,CAACA,KAAK;IAElC,IAAIC,UAAU,KAAKK,sBAAsB,CAACC,OAAO,IAAIN,UAAU,KAAKK,sBAAsB,CAACE,UAAU,EAAE;MACnGH,SAAS,GAAGI,SAAS;;IAEzBlB,YAAY,CAACQ,EAAE,EAAE;MAAEA,EAAE;MAAEC,KAAK,EAAE;QAAEC,UAAU;QAAED,KAAK,EAAEK;;KAAa,CAAC;GACpE;EAED,MAAMK,iBAAiB,GAAIV,KAAU;IACjCT,YAAY,CAACQ,EAAE,EAAE;MAAEA,EAAE;MAAEC,KAAK,EAAE;QAAE,GAAGZ,MAAM,CAACY,KAAK;QAAEA;;KAAS,CAAC;GAC9D;EAED,MAAMW,YAAY,GAAGA,MAAMnB,QAAQ,CAACO,EAAE,CAAC;EAEvC,oBACIa;IAAKC,SAAS,EAAC;kBACXD;IAAKC,SAAS,EAAC;KACVpB,QAAQ,GAAG,CAAC,GAAGC,KAAK,CAACoB,MAAM,CAACzB,OAAO,CAAC0B,UAAU,CAACC,GAAG,GAAGtB,KAAK,CAACoB,MAAM,CAACzB,OAAO,CAAC0B,UAAU,CAACE,KAAK,CACzF,eACNL,6BAACM,YAAY;IAAC/B,UAAU,EAAEA,UAAU;IAAEE,OAAO,EAAEA,OAAO;IAAEC,QAAQ,EAAEY,kBAAyB;IAAEF,KAAK,EAAED;IAAM,eAC1Ga,6BAACO,gBAAgB;IAACvB,MAAM,EAAEA,MAAM;IAAEN,QAAQ,EAAEc,sBAA6B;IAAEJ,KAAK,EAAEC;IAAc,eAChGW,6BAACQ,WAAW;IAACxB,MAAM,EAAEA,MAAM;IAAEK,UAAU,EAAEA,UAAU;IAAEX,QAAQ,EAAEoB,iBAAiB;IAAEV,KAAK,EAAEA;IAAS,eAClGY,6BAACS,UAAU;IAACC,UAAU,EAAC,UAAU;IAACT,SAAS,EAAC,SAAS;IAACU,IAAI,EAAC,OAAO;IAACC,OAAO,EAAEb;IAAgB,CAC1F;AAEd;;;;"}
+{"version":3,"file":"Filter.js","sources":["../../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/components/Filter.tsx"],"sourcesContent":["import React from 'react';\nimport { Column as RTColumn } from '@tanstack/react-table';\nimport { IconButton } from '../../../../../../IconButton/IconButton';\nimport { Table3Filter, Table3FilterComparator } from '../../../../../types';\nimport { useLocalization } from '../../../../../../Provider/Localization';\nimport { FilterColumn } from './FilterColumn';\nimport { FilterComparator } from './FilterComparator';\nimport { FilterValue } from './FilterValue';\n\nexport type FilterProps<TType = unknown> = {\n    allColumns: RTColumn<TType, unknown>[];\n    filter: Table3Filter;\n    filters: Table3Filter[];\n    position: number;\n    onChange: (id: string | null, value: Table3Filter) => void;\n    onRemove: (columnId: string | null) => void;\n};\n\nexport function Filter<TType = unknown>(props: FilterProps<TType>) {\n    const { allColumns, filter, filters, onChange: handleChange, onRemove, position } = props;\n    const { texts } = useLocalization();\n    const column = allColumns.find(c => c.id === filter.id) as RTColumn<TType, unknown>;\n\n    const {\n        id,\n        value: { comparator, value },\n    } = filter;\n\n    const handleChangeColumn = (columnId: string | null) => {\n        const columnPrev = allColumns.find(column => column.id === id);\n        const columnNext = allColumns.find(column => column.id === columnId);\n        // UX requirement: if old column data type is the same as next column data type,\n        // then we applying the same filter value for the next column,\n        // but when data types are different, we're reseting comparator ans value for the next column\n        const value =\n            columnPrev?.columnDef.meta?.dataType === columnNext?.columnDef.meta?.dataType\n                ? filter.value\n                : { comparator: null, value: null };\n\n        handleChange(id, { id: columnId, value });\n    };\n\n    const handleChangeComparator = (comparator: Table3FilterComparator) => {\n        let nextValue = filter.value.value;\n\n        if (comparator === Table3FilterComparator.IsEmpty || comparator === Table3FilterComparator.IsNotEmpty) {\n            nextValue = undefined;\n        }\n        handleChange(id, { id, value: { comparator, value: nextValue } });\n    };\n\n    const handleChangeValue = (value: any) => {\n        handleChange(id, { id, value: { ...filter.value, value } });\n    };\n\n    const handleRemove = () => onRemove(id);\n\n    return (\n        <div className=\"flex items-start gap-2\">\n            <div className=\"flex min-h-[theme(spacing.8)] w-14 flex-shrink-0 items-center justify-end pr-2 text-right\">\n                {position > 0 ? texts.table3.filters.conditions.and : texts.table3.filters.conditions.where}\n            </div>\n            <FilterColumn allColumns={allColumns} filters={filters} onChange={handleChangeColumn as any} value={id} />\n            <FilterComparator column={column} onChange={handleChangeComparator as any} value={comparator} />\n            <FilterValue column={column} comparator={comparator} onChange={handleChangeValue} value={value} />\n            <IconButton appearance=\"discrete\" className=\"ml-auto\" icon=\"close\" onClick={handleRemove} />\n        </div>\n    );\n}\n"],"names":["Filter","props","allColumns","filter","filters","onChange","handleChange","onRemove","position","texts","useLocalization","column","find","c","id","value","comparator","handleChangeColumn","columnId","columnPrev","columnNext","_columnPrev$columnDef","columnDef","meta","dataType","_columnNext$columnDef","handleChangeComparator","nextValue","Table3FilterComparator","IsEmpty","IsNotEmpty","undefined","handleChangeValue","handleRemove","React","className","table3","conditions","and","where","FilterColumn","FilterComparator","FilterValue","IconButton","appearance","icon","onClick"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterValue.js

@@ -60,7 +60,6 @@ function FilterValue(props) {
     }));
   }
   return /*#__PURE__*/React__default.createElement(Control, {
-    comparator: comparator,
     column: column,
     onChange: handleChange,
     value: value
@@ -70,7 +69,6 @@ function Control(props) {
   var _column$columnDef$met2, _column$columnDef$met3;
   const {
     column,
-    comparator,
     onChange,
     value,
     ...attributes

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/components/FilterValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterValue.js","sources":["../../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/components/FilterValue.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Column as RTColumn } from '@tanstack/react-table';\nimport { Input } from '../../../../../../Input/Input';\nimport { Table3FilterComparator } from '../../../../../types';\nimport { Datepicker } from '../../../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../../../Switch/Switch';\nimport { getInputAppearanceClassnames } from '../../../../columns/styles';\nimport cn from 'classnames';\nimport { useLocalization } from '../../../../../../Provider/Localization';\n\nexport type FilterValueProps<TType = unknown> = {\n    column?: RTColumn<TType, unknown>;\n    comparator: Table3FilterComparator;\n    onChange: (value: any) => void;\n    value: any;\n};\n\nexport function FilterValue<TType = unknown>(props: FilterValueProps<TType>) {\n    const { column, comparator, onChange: handleChange, value } = props;\n    const { texts } = useLocalization();\n    if (comparator === Table3FilterComparator.IsEmpty || comparator === Table3FilterComparator.IsNotEmpty) {\n        return null;\n    }\n\n    if (comparator === Table3FilterComparator.IsBetween) {\n        const fromValue = Array.isArray(value) ? value[0] : undefined;\n        const toValue = Array.isArray(value) ? value[1] : undefined;\n\n        if (column === undefined) {\n            return (\n                <Input\n                    aria-label={texts.table3.filters.emptyFilter.value}\n                    className=\"flex-grow\"\n                    disabled\n                    value={texts.table3.filters.emptyFilter.value}\n                />\n            );\n        }\n\n        if (column.columnDef.meta?.dataType === 'datetime') {\n            return (\n                <div className=\"flex flex-grow items-center gap-2\">\n                    <Control column={column} onChange={value => handleChange([value, toValue])} value={fromValue} />\n                    <Control column={column} onChange={value => handleChange([fromValue, value])} value={toValue} />\n                </div>\n            );\n        }\n\n        return (\n            <div className=\"flex flex-grow items-center gap-2\">\n                <Control\n                    column={column}\n                    onChange={value => handleChange([isNaN(value) ? undefined : value, toValue])}\n                    placeholder=\"from\"\n                    value={fromValue ?? ''}\n                />\n                <Control\n                    column={column}\n                    onChange={value => handleChange([fromValue, isNaN(value) ? undefined : value])}\n                    placeholder=\"to\"\n                    value={toValue ?? ''}\n                />\n            </div>\n        );\n    }\n    return <Control comparator={comparator} column={column} onChange={handleChange} value={value} />;\n}\n\nfunction Control(props) {\n    const { column, comparator, onChange, value, ...attributes } = props;\n    const controlRenderer = column?.columnDef.meta?.control;\n    const dataType = column?.columnDef.meta?.dataType;\n\n    useEffect(() => {\n        if (controlRenderer === 'switch') {\n            onChange(false);\n        }\n    }, []);\n\n    if (typeof controlRenderer === 'function') {\n        return controlRenderer({\n            ...attributes,\n            setValue: value => onChange(value),\n            value,\n        });\n    } else if (controlRenderer === 'datepicker' || dataType === 'datetime') {\n        return <Datepicker {...attributes} onChange={event => onChange((event as any).detail)} value={value as Date} />;\n    } else if (controlRenderer === 'switch') {\n        return <Switch {...attributes} className=\"m-1.5\" checked={Boolean(value)} onChange={onChange} />;\n    } else if ((controlRenderer === 'input' || controlRenderer === undefined) && dataType === 'number') {\n        return (\n            <Input\n                {...attributes}\n                className={cn(getInputAppearanceClassnames(), 'flex-grow')}\n                type=\"number\"\n                onChange={event => onChange(event.target.valueAsNumber)}\n                value={String(value ?? '')}\n            />\n        );\n    }\n\n    return (\n        <Input\n            disabled={!column}\n            {...attributes}\n            className=\"flex-grow\"\n            onChange={event => onChange(event.target.value)}\n            value={String(value ?? '')}\n        />\n    );\n}\n"],"names":["FilterValue","props","column","comparator","onChange","handleChange","value","texts","useLocalization","Table3FilterComparator","IsEmpty","IsNotEmpty","IsBetween","_column$columnDef$met","fromValue","Array","isArray","undefined","toValue","React","Input","table3","filters","emptyFilter","className","disabled","columnDef","meta","dataType","Control","isNaN","placeholder","attributes","controlRenderer","_column$columnDef$met2","control","_column$columnDef$met3","useEffect","setValue","Datepicker","event","detail","Switch","checked","Boolean","cn","getInputAppearanceClassnames","type","target","valueAsNumber","String"],"mappings":"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"}
+{"version":3,"file":"FilterValue.js","sources":["../../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/components/FilterValue.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { Column as RTColumn } from '@tanstack/react-table';\nimport { Input } from '../../../../../../Input/Input';\nimport { Table3FilterComparator } from '../../../../../types';\nimport { Datepicker } from '../../../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../../../Switch/Switch';\nimport { getInputAppearanceClassnames } from '../../../../columns/styles';\nimport cn from 'classnames';\nimport { useLocalization } from '../../../../../../Provider/Localization';\n\nexport type FilterValueProps<TType = unknown> = {\n    column?: RTColumn<TType, unknown>;\n    comparator: Table3FilterComparator | null;\n    onChange: (value: any) => void;\n    value: any;\n};\n\nexport function FilterValue<TType = unknown>(props: FilterValueProps<TType>) {\n    const { column, comparator, onChange: handleChange, value } = props;\n    const { texts } = useLocalization();\n    if (comparator === Table3FilterComparator.IsEmpty || comparator === Table3FilterComparator.IsNotEmpty) {\n        return null;\n    }\n\n    if (comparator === Table3FilterComparator.IsBetween) {\n        const fromValue = Array.isArray(value) ? value[0] : undefined;\n        const toValue = Array.isArray(value) ? value[1] : undefined;\n\n        if (column === undefined) {\n            return (\n                <Input\n                    aria-label={texts.table3.filters.emptyFilter.value}\n                    className=\"flex-grow\"\n                    disabled\n                    value={texts.table3.filters.emptyFilter.value}\n                />\n            );\n        }\n\n        if (column.columnDef.meta?.dataType === 'datetime') {\n            return (\n                <div className=\"flex flex-grow items-center gap-2\">\n                    <Control column={column} onChange={value => handleChange([value, toValue])} value={fromValue} />\n                    <Control column={column} onChange={value => handleChange([fromValue, value])} value={toValue} />\n                </div>\n            );\n        }\n\n        return (\n            <div className=\"flex flex-grow items-center gap-2\">\n                <Control\n                    column={column}\n                    onChange={value => handleChange([isNaN(value) ? undefined : value, toValue])}\n                    placeholder=\"from\"\n                    value={fromValue ?? ''}\n                />\n                <Control\n                    column={column}\n                    onChange={value => handleChange([fromValue, isNaN(value) ? undefined : value])}\n                    placeholder=\"to\"\n                    value={toValue ?? ''}\n                />\n            </div>\n        );\n    }\n    return <Control column={column} onChange={handleChange} value={value} />;\n}\n\nfunction Control(props) {\n    const { column, onChange, value, ...attributes } = props;\n    const controlRenderer = column?.columnDef.meta?.control;\n    const dataType = column?.columnDef.meta?.dataType;\n\n    useEffect(() => {\n        if (controlRenderer === 'switch') {\n            onChange(false);\n        }\n    }, []);\n\n    if (typeof controlRenderer === 'function') {\n        return controlRenderer({\n            ...attributes,\n            setValue: value => onChange(value),\n            value,\n        });\n    } else if (controlRenderer === 'datepicker' || dataType === 'datetime') {\n        return <Datepicker {...attributes} onChange={event => onChange((event as any).detail)} value={value as Date} />;\n    } else if (controlRenderer === 'switch') {\n        return <Switch {...attributes} className=\"m-1.5\" checked={Boolean(value)} onChange={onChange} />;\n    } else if ((controlRenderer === 'input' || controlRenderer === undefined) && dataType === 'number') {\n        return (\n            <Input\n                {...attributes}\n                className={cn(getInputAppearanceClassnames(), 'flex-grow')}\n                type=\"number\"\n                onChange={event => onChange(event.target.valueAsNumber)}\n                value={String(value ?? '')}\n            />\n        );\n    }\n\n    return (\n        <Input\n            disabled={!column}\n            {...attributes}\n            className=\"flex-grow\"\n            onChange={event => onChange(event.target.value)}\n            value={String(value ?? '')}\n        />\n    );\n}\n"],"names":["FilterValue","props","column","comparator","onChange","handleChange","value","texts","useLocalization","Table3FilterComparator","IsEmpty","IsNotEmpty","IsBetween","_column$columnDef$met","fromValue","Array","isArray","undefined","toValue","React","Input","table3","filters","emptyFilter","className","disabled","columnDef","meta","dataType","Control","isNaN","placeholder","attributes","controlRenderer","_column$columnDef$met2","control","_column$columnDef$met3","useEffect","setValue","Datepicker","event","detail","Switch","checked","Boolean","cn","getInputAppearanceClassnames","type","target","valueAsNumber","String"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/PrintButton/PrintIFrame.js

@@ -62,8 +62,8 @@ import '../../../../Table/components/PaginatedTable.js';
 import '../../../../Table/components/WindowedTable.js';
 import '../../../../Table/util/rowIndexPath.js';
 import '../../../../Table/hooks/useRowCreation.js';
-import '../../../../../hooks/useLazyEffect.js';
 import ReactDOM from 'react-dom';
+import '../../../../../hooks/useLazyEffect.js';
 import '../../../../Textarea/Textarea.js';
 import '../../../../../hooks/useMatchMedia.js';
 import '../../../../../hooks/useIsLargeScreen.js';

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

@@ -81,11 +81,14 @@ function Search(props) {
     setQuery(String(query !== null && query !== void 0 ? query : ''));
   };
   const handleClear = () => {
-    const [rowIndex = null, cellIndex = null] = tableMeta.search.highlightedColumnIndexes[tableMeta.search.currentHighlightColumnIndex || 0];
+    var _tableMeta$search$cur, _tableMeta$search$hig;
+    const highlightedColumnIndex = (_tableMeta$search$cur = tableMeta.search.currentHighlightColumnIndex) !== null && _tableMeta$search$cur !== void 0 ? _tableMeta$search$cur : 0;
+    const highlightedCell = (_tableMeta$search$hig = tableMeta.search.highlightedColumnIndexes[highlightedColumnIndex]) !== null && _tableMeta$search$hig !== void 0 ? _tableMeta$search$hig : [];
+    const [rowIndex = null, columnIndex = null] = highlightedCell;
     const rows = table.getRowModel().rows;
     tableMeta.search.setQuery('');
     // Need to save row id and cell index, to be able to find the row in the table with updated indexes, after global filter will be reset.
-    lastCellIndex.value = String(cellIndex);
+    lastCellIndex.value = String(columnIndex);
     if (rowIndex !== null) {
       var _rows$rowIndex;
       const rowId = ((_rows$rowIndex = rows[rowIndex]) === null || _rows$rowIndex === void 0 ? void 0 : _rows$rowIndex.id) || null;