@economic/taco 2.18.0 → 2.20.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    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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"}
+{"version":3,"file":"EditingCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\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        // Removing a pixel border width in the padding to avoid a pixel jump when control element is rendered.\n        'py-[calc(var(--table3-cell-padding-y)_-_0.06rem_-_1px)]',\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/EditingControl.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { mergeRefs } from '../../../../../utils/mergeRefs.js';
 import { shouldTriggerShortcut } from '../../../../../utils/keyboard.js';
 import { Input } from '../../../../Input/Input.js';
@@ -132,6 +132,7 @@ const EditingControl = /*#__PURE__*/React__default.forwardRef(function Control(p
           handleChange(nextValue);
         }
       },
+      fontSize: tableMeta.fontSize.size,
       value
     }, data);
   } else if (controlRenderer === 'datepicker') {

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

@@ -1 +1 @@
-{"version":3,"file":"EditingControl.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingControl.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Cell as RTCell, Column as RTColumn, Table as RTTable, TableMeta } from '@tanstack/react-table';\nimport _ from 'lodash';\n\nimport { deselectInputValue } from '../../../../../utils/input';\nimport { hasChanged } from '../../../util/editing';\nimport { Datepicker } from '../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../Switch/Switch';\nimport { Input } from '../../../../Input/Input';\nimport { getCellAlignmentClasses, getInputAppearanceClassnames } from '../styles';\nimport { mergeRefs } from '../../../../../utils/mergeRefs';\nimport { Table3ColumnAlignment, Table3ColumnDataType } from '../../../types';\nimport { TextareaControl } from './controls/TextareaControl';\nimport { shouldTriggerShortcut } from '../../../../../utils/keyboard';\nimport { getTableLeftScrollDistance } from '../../../util/scrolling';\n\nexport type EditingControlProps<TType = unknown> = {\n    align?: Table3ColumnAlignment;\n    column: RTColumn<TType, unknown>;\n    data: TType;\n    initialValue: any;\n    value: any;\n    onBlur: (event: React.FocusEvent) => void;\n    onFocus: (event: React.FocusEvent) => void;\n    onChange: (value: any) => void;\n    ref: React.Ref<HTMLElement>;\n    table: RTTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n    cell: RTCell<TType, unknown>;\n    error?: string;\n    tabIndex?: number;\n    isActiveRow?: boolean;\n};\n\nexport const EditingControl = React.forwardRef<HTMLElement, any>(function Control<TType = unknown>(\n    props: EditingControlProps<TType>,\n    externalRef: React.Ref<HTMLElement>\n) {\n    const {\n        align,\n        column,\n        data,\n        initialValue,\n        onChange: handleChange,\n        table,\n        tableRef,\n        value,\n        cell,\n        error,\n        isActiveRow,\n        ...attributes\n    } = props;\n\n    const tableMeta = table.options.meta as TableMeta<unknown>;\n    const ref = React.useRef<HTMLElement>();\n    const refCallback = mergeRefs([ref, externalRef]);\n\n    const columnMeta = column.columnDef.meta;\n    const controlRenderer = columnMeta?.control;\n\n    const isCellInDetailMode =\n        tableMeta.editing.detailModeEditing && (ref as React.RefObject<HTMLElement>)?.current?.contains(document.activeElement);\n\n    const originalRow = cell.row.original as TType;\n\n    // Revert to initial value if escape was pressed\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        // For some reason keydown event handler is not propogated to the table when input or other control element is\n        // in focus so we need to check for shortcut that toggles the editing.\n        if (shouldTriggerShortcut(event, { key: 'e', meta: true, shift: false })) {\n            tableMeta.editing.toggleEditing(false);\n            return;\n        }\n\n        const target = event.target as HTMLInputElement;\n\n        if (target.readOnly) {\n            return;\n        }\n\n        // Prevent row arrow shortcuts triggering when in detail mode\n        if (tableMeta.editing.detailModeEditing && (event.key === 'ArrowUp' || event.key === 'ArrowDown')) {\n            event.stopPropagation();\n        }\n\n        // Revert to initial value if escape was pressed\n        if (event.key === 'Escape') {\n            event.preventDefault();\n\n            if (tableMeta.editing.detailModeEditing) {\n                tableMeta.editing.setDetailModeEditing(false);\n\n                if (value !== initialValue) {\n                    // Before reseting to initial value, we need to check if edited row with cell initial value is the same as original row,\n                    // and in this case we need to completely remove row from editing state to avoid saving the same data as original.\n                    const changedRow: any = tableMeta.editing.changes ? tableMeta.editing.changes[cell.row.id] : {};\n                    const rowEdtitingDataWithInitialValue = { ...changedRow, [cell.column.id]: initialValue };\n                    if (_.isEqual(cell.row.original, rowEdtitingDataWithInitialValue)) {\n                        tableMeta.editing.resetChange(cell.row.id);\n                    } else {\n                        handleChange(initialValue);\n                    }\n                }\n            } else {\n                tableMeta.editing.toggleEditing(false);\n                tableRef.current?.focus();\n            }\n\n            return;\n        }\n\n        // Should enable/disable editing mode if Enter was clicked\n        if (event.key === 'Enter') {\n            event.preventDefault();\n\n            if (!tableMeta.editing.detailModeEditing) {\n                deselectInputValue(target);\n            } else {\n                target?.select?.();\n            }\n\n            // Ketydown \"Enter\" should toggle edititng mode\n            tableMeta.editing.setDetailModeEditing(!tableMeta.editing.detailModeEditing);\n\n            return;\n        }\n    };\n\n    const isNumber = columnMeta?.dataType === ('number' as Table3ColumnDataType);\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n        handleKeyDown(event);\n\n        // Switching to editing mode, when key pressed any alphabetical character or number\n        if (/^[a-z0-9]$/i.test(event.key)) {\n            tableMeta.editing.setDetailModeEditing(true);\n        }\n    };\n\n    const handleFocus = (event: React.FocusEvent) => {\n        const { frozenColumnIndex: externalFrozenColumnIndex = -1, frozenInternalColumnCount = 0 } = tableMeta.columnFreezing;\n        const tableElement = tableMeta.tableRef.current;\n        const frozenColumnIndex =\n            externalFrozenColumnIndex > -1\n                ? externalFrozenColumnIndex + frozenInternalColumnCount\n                : frozenInternalColumnCount - 1;\n        const cell = event.target?.closest('[role=\"cell\"]');\n\n        if (!tableElement || !cell) {\n            return;\n        }\n\n        const isEditing = true;\n        const leftScrollDistance = getTableLeftScrollDistance(tableElement, cell, frozenColumnIndex, isEditing);\n\n        if (leftScrollDistance !== null) {\n            tableElement.scrollLeft = leftScrollDistance;\n        }\n    };\n\n    if (typeof controlRenderer === 'function') {\n        return controlRenderer(\n            {\n                ...attributes,\n                invalid: !!error,\n                onFocus: handleFocus,\n                ref: refCallback,\n                setValue: nextValue => {\n                    if (nextValue !== value) {\n                        handleChange(nextValue);\n                    }\n                },\n                value,\n            },\n            data\n        );\n    } else if (controlRenderer === 'datepicker') {\n        const handleDatepickerChange = event => {\n            // When datepicker looses focus, it triggers change event, even if date wasn't changed,\n            // so adding additional check here to prevent adding change to the edititng state.\n            const originalDate = originalRow[cell.column.id];\n            const changedDate = (event as any).detail;\n            if (hasChanged(originalDate, changedDate)) {\n                handleChange(changedDate);\n            }\n        };\n\n        return (\n            <Datepicker\n                {...attributes}\n                invalid={!!error}\n                className={cn({\n                    '[&_input]:!yt-focus-dark': isCellInDetailMode,\n                })}\n                onChange={handleDatepickerChange}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={refCallback}\n                value={value as Date}\n            />\n        );\n    } else if (controlRenderer === 'switch') {\n        return (\n            <Switch {...attributes} checked={Boolean(value)} onChange={handleChange} onFocus={handleFocus} ref={refCallback} />\n        );\n    } else if (controlRenderer === 'textarea') {\n        return (\n            <TextareaControl\n                {...props}\n                invalid={!!error}\n                isCellInDetailMode={isCellInDetailMode}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={refCallback}\n                fontSize={tableMeta.fontSize.size}\n            />\n        );\n    }\n\n    return (\n        <Input\n            {...attributes}\n            invalid={!!error}\n            className={cn(getInputAppearanceClassnames(), getCellAlignmentClasses(align), {\n                '!yt-focus-dark': isCellInDetailMode,\n            })}\n            onChange={event => {\n                handleChange(event.target.value);\n            }}\n            onFocus={handleFocus}\n            onKeyDown={handleInputKeyDown}\n            ref={refCallback}\n            type={isNumber ? 'number' : undefined}\n            value={isNumber ? value : String(value ?? '')}\n        />\n    );\n});\n"],"names":["EditingControl","React","forwardRef","Control","props","externalRef","align","column","data","initialValue","onChange","handleChange","table","tableRef","value","cell","error","isActiveRow","attributes","tableMeta","options","meta","ref","useRef","refCallback","mergeRefs","columnMeta","columnDef","controlRenderer","control","isCellInDetailMode","editing","detailModeEditing","_ref$current","current","contains","document","activeElement","originalRow","row","original","handleKeyDown","event","shouldTriggerShortcut","key","shift","toggleEditing","target","readOnly","stopPropagation","preventDefault","setDetailModeEditing","changedRow","changes","id","rowEdtitingDataWithInitialValue","_","isEqual","resetChange","_tableRef$current","focus","deselectInputValue","_target$select","select","call","isNumber","dataType","handleInputKeyDown","test","handleFocus","frozenColumnIndex","externalFrozenColumnIndex","frozenInternalColumnCount","columnFreezing","tableElement","_event$target","closest","isEditing","leftScrollDistance","getTableLeftScrollDistance","scrollLeft","invalid","onFocus","setValue","nextValue","handleDatepickerChange","originalDate","changedDate","detail","hasChanged","Datepicker","className","cn","onKeyDown","Switch","checked","Boolean","TextareaControl","fontSize","size","Input","getInputAppearanceClassnames","getCellAlignmentClasses","type","undefined","String"],"mappings":"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"}
+{"version":3,"file":"EditingControl.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingControl.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Cell as RTCell, Column as RTColumn, Table as RTTable, TableMeta } from '@tanstack/react-table';\nimport _ from 'lodash';\n\nimport { deselectInputValue } from '../../../../../utils/input';\nimport { hasChanged } from '../../../util/editing';\nimport { Datepicker } from '../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../Switch/Switch';\nimport { Input } from '../../../../Input/Input';\nimport { getCellAlignmentClasses, getInputAppearanceClassnames } from '../styles';\nimport { mergeRefs } from '../../../../../utils/mergeRefs';\nimport { Table3ColumnAlignment, Table3ColumnDataType } from '../../../types';\nimport { TextareaControl } from './controls/TextareaControl';\nimport { shouldTriggerShortcut } from '../../../../../utils/keyboard';\nimport { getTableLeftScrollDistance } from '../../../util/scrolling';\n\nexport type EditingControlProps<TType = unknown> = {\n    align?: Table3ColumnAlignment;\n    column: RTColumn<TType, unknown>;\n    data: TType;\n    initialValue: any;\n    value: any;\n    onBlur: (event: React.FocusEvent) => void;\n    onFocus: (event: React.FocusEvent) => void;\n    onChange: (value: any) => void;\n    ref: React.Ref<HTMLElement>;\n    table: RTTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n    cell: RTCell<TType, unknown>;\n    error?: string;\n    tabIndex?: number;\n    isActiveRow?: boolean;\n};\n\nexport const EditingControl = React.forwardRef<HTMLElement, any>(function Control<TType = unknown>(\n    props: EditingControlProps<TType>,\n    externalRef: React.Ref<HTMLElement>\n) {\n    const {\n        align,\n        column,\n        data,\n        initialValue,\n        onChange: handleChange,\n        table,\n        tableRef,\n        value,\n        cell,\n        error,\n        isActiveRow,\n        ...attributes\n    } = props;\n\n    const tableMeta = table.options.meta as TableMeta<unknown>;\n    const ref = React.useRef<HTMLElement>();\n    const refCallback = mergeRefs([ref, externalRef]);\n\n    const columnMeta = column.columnDef.meta;\n    const controlRenderer = columnMeta?.control;\n\n    const isCellInDetailMode =\n        tableMeta.editing.detailModeEditing && (ref as React.RefObject<HTMLElement>)?.current?.contains(document.activeElement);\n\n    const originalRow = cell.row.original as TType;\n\n    // Revert to initial value if escape was pressed\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        // For some reason keydown event handler is not propogated to the table when input or other control element is\n        // in focus so we need to check for shortcut that toggles the editing.\n        if (shouldTriggerShortcut(event, { key: 'e', meta: true, shift: false })) {\n            tableMeta.editing.toggleEditing(false);\n            return;\n        }\n\n        const target = event.target as HTMLInputElement;\n\n        if (target.readOnly) {\n            return;\n        }\n\n        // Prevent row arrow shortcuts triggering when in detail mode\n        if (tableMeta.editing.detailModeEditing && (event.key === 'ArrowUp' || event.key === 'ArrowDown')) {\n            event.stopPropagation();\n        }\n\n        // Revert to initial value if escape was pressed\n        if (event.key === 'Escape') {\n            event.preventDefault();\n\n            if (tableMeta.editing.detailModeEditing) {\n                tableMeta.editing.setDetailModeEditing(false);\n\n                if (value !== initialValue) {\n                    // Before reseting to initial value, we need to check if edited row with cell initial value is the same as original row,\n                    // and in this case we need to completely remove row from editing state to avoid saving the same data as original.\n                    const changedRow: any = tableMeta.editing.changes ? tableMeta.editing.changes[cell.row.id] : {};\n                    const rowEdtitingDataWithInitialValue = { ...changedRow, [cell.column.id]: initialValue };\n                    if (_.isEqual(cell.row.original, rowEdtitingDataWithInitialValue)) {\n                        tableMeta.editing.resetChange(cell.row.id);\n                    } else {\n                        handleChange(initialValue);\n                    }\n                }\n            } else {\n                tableMeta.editing.toggleEditing(false);\n                tableRef.current?.focus();\n            }\n\n            return;\n        }\n\n        // Should enable/disable editing mode if Enter was clicked\n        if (event.key === 'Enter') {\n            event.preventDefault();\n\n            if (!tableMeta.editing.detailModeEditing) {\n                deselectInputValue(target);\n            } else {\n                target?.select?.();\n            }\n\n            // Ketydown \"Enter\" should toggle edititng mode\n            tableMeta.editing.setDetailModeEditing(!tableMeta.editing.detailModeEditing);\n\n            return;\n        }\n    };\n\n    const isNumber = columnMeta?.dataType === ('number' as Table3ColumnDataType);\n    const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n        handleKeyDown(event);\n\n        // Switching to editing mode, when key pressed any alphabetical character or number\n        if (/^[a-z0-9]$/i.test(event.key)) {\n            tableMeta.editing.setDetailModeEditing(true);\n        }\n    };\n\n    const handleFocus = (event: React.FocusEvent) => {\n        const { frozenColumnIndex: externalFrozenColumnIndex = -1, frozenInternalColumnCount = 0 } = tableMeta.columnFreezing;\n        const tableElement = tableMeta.tableRef.current;\n        const frozenColumnIndex =\n            externalFrozenColumnIndex > -1\n                ? externalFrozenColumnIndex + frozenInternalColumnCount\n                : frozenInternalColumnCount - 1;\n        const cell = event.target?.closest('[role=\"cell\"]');\n\n        if (!tableElement || !cell) {\n            return;\n        }\n\n        const isEditing = true;\n        const leftScrollDistance = getTableLeftScrollDistance(tableElement, cell, frozenColumnIndex, isEditing);\n\n        if (leftScrollDistance !== null) {\n            tableElement.scrollLeft = leftScrollDistance;\n        }\n    };\n\n    if (typeof controlRenderer === 'function') {\n        return controlRenderer(\n            {\n                ...attributes,\n                invalid: !!error,\n                onFocus: handleFocus,\n                ref: refCallback,\n                setValue: nextValue => {\n                    if (nextValue !== value) {\n                        handleChange(nextValue);\n                    }\n                },\n                fontSize: tableMeta.fontSize.size,\n                value,\n            },\n            data\n        );\n    } else if (controlRenderer === 'datepicker') {\n        const handleDatepickerChange = event => {\n            // When datepicker looses focus, it triggers change event, even if date wasn't changed,\n            // so adding additional check here to prevent adding change to the edititng state.\n            const originalDate = originalRow[cell.column.id];\n            const changedDate = (event as any).detail;\n            if (hasChanged(originalDate, changedDate)) {\n                handleChange(changedDate);\n            }\n        };\n\n        return (\n            <Datepicker\n                {...attributes}\n                invalid={!!error}\n                className={cn({\n                    '[&_input]:!yt-focus-dark': isCellInDetailMode,\n                })}\n                onChange={handleDatepickerChange}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={refCallback}\n                value={value as Date}\n            />\n        );\n    } else if (controlRenderer === 'switch') {\n        return (\n            <Switch {...attributes} checked={Boolean(value)} onChange={handleChange} onFocus={handleFocus} ref={refCallback} />\n        );\n    } else if (controlRenderer === 'textarea') {\n        return (\n            <TextareaControl\n                {...props}\n                invalid={!!error}\n                isCellInDetailMode={isCellInDetailMode}\n                onFocus={handleFocus}\n                onKeyDown={handleInputKeyDown}\n                ref={refCallback}\n                fontSize={tableMeta.fontSize.size}\n            />\n        );\n    }\n\n    return (\n        <Input\n            {...attributes}\n            invalid={!!error}\n            className={cn(getInputAppearanceClassnames(), getCellAlignmentClasses(align), {\n                '!yt-focus-dark': isCellInDetailMode,\n            })}\n            onChange={event => {\n                handleChange(event.target.value);\n            }}\n            onFocus={handleFocus}\n            onKeyDown={handleInputKeyDown}\n            ref={refCallback}\n            type={isNumber ? 'number' : undefined}\n            value={isNumber ? value : String(value ?? '')}\n        />\n    );\n});\n"],"names":["EditingControl","React","forwardRef","Control","props","externalRef","align","column","data","initialValue","onChange","handleChange","table","tableRef","value","cell","error","isActiveRow","attributes","tableMeta","options","meta","ref","useRef","refCallback","mergeRefs","columnMeta","columnDef","controlRenderer","control","isCellInDetailMode","editing","detailModeEditing","_ref$current","current","contains","document","activeElement","originalRow","row","original","handleKeyDown","event","shouldTriggerShortcut","key","shift","toggleEditing","target","readOnly","stopPropagation","preventDefault","setDetailModeEditing","changedRow","changes","id","rowEdtitingDataWithInitialValue","_","isEqual","resetChange","_tableRef$current","focus","deselectInputValue","_target$select","select","call","isNumber","dataType","handleInputKeyDown","test","handleFocus","frozenColumnIndex","externalFrozenColumnIndex","frozenInternalColumnCount","columnFreezing","tableElement","_event$target","closest","isEditing","leftScrollDistance","getTableLeftScrollDistance","scrollLeft","invalid","onFocus","setValue","nextValue","fontSize","size","handleDatepickerChange","originalDate","changedDate","detail","hasChanged","Datepicker","className","cn","onKeyDown","Switch","checked","Boolean","TextareaControl","Input","getInputAppearanceClassnames","getCellAlignmentClasses","type","undefined","String"],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { useRowContext } from '../../rows/RowContext.js';
 import { scrollColumnIntoView } from '../../../util/columns.js';
 
@@ -31,7 +31,7 @@ const Highlight = props => {
     }
   }, [current]);
   return /*#__PURE__*/React__default.createElement("div", Object.assign({}, attributes, {
-    "data-taco": 'highlight',
+    "data-taco": "highlight",
     className: className,
     ref: ref
   }));

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

@@ -1 +1 @@
-{"version":3,"file":"Highlight.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Highlight.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { scrollColumnIntoView } from '../../../util/columns';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport const Highlight = props => {\n    const { current, frozenColumnIndex, index, tableRef, ...attributes } = props;\n    const { hasError: rowHasError } = useRowContext();\n\n    const ref = React.useRef<HTMLDivElement | null>(null);\n    const className = cn('h-full flex [justify-content:inherit] [text-align:inherit]', props.className, {\n        // normal row\n        'bg-blue-200/25': !current && !rowHasError,\n        // current row\n        'bg-blue-200/75': current && !rowHasError,\n        // normal row with error\n        'bg-[#eaeaf5]': !current && rowHasError,\n        // current with error\n        'bg-[#dadaf5]': current && rowHasError,\n    });\n\n    React.useEffect(() => {\n        if (ref.current && current) {\n            scrollColumnIntoView(index, frozenColumnIndex, ref.current, tableRef.current);\n        }\n    }, [current]);\n\n    return <div {...attributes} data-taco='highlight' className={className} ref={ref} />;\n};\n"],"names":["Highlight","props","current","frozenColumnIndex","index","tableRef","attributes","hasError","rowHasError","useRowContext","ref","React","useRef","className","cn","useEffect","scrollColumnIntoView"],"mappings":";;;;;MAKaA,SAAS,GAAGC,KAAK;EAC1B,MAAM;IAAEC,OAAO;IAAEC,iBAAiB;IAAEC,KAAK;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAC5E,MAAM;IAAEM,QAAQ,EAAEC;GAAa,GAAGC,aAAa,EAAE;EAEjD,MAAMC,GAAG,GAAGC,cAAK,CAACC,MAAM,CAAwB,IAAI,CAAC;EACrD,MAAMC,SAAS,GAAGC,EAAE,CAAC,4DAA4D,EAAEb,KAAK,CAACY,SAAS,EAAE;;IAEhG,gBAAgB,EAAE,CAACX,OAAO,IAAI,CAACM,WAAW;;IAE1C,gBAAgB,EAAEN,OAAO,IAAI,CAACM,WAAW;;IAEzC,cAAc,EAAE,CAACN,OAAO,IAAIM,WAAW;;IAEvC,cAAc,EAAEN,OAAO,IAAIM;GAC9B,CAAC;EAEFG,cAAK,CAACI,SAAS,CAAC;IACZ,IAAIL,GAAG,CAACR,OAAO,IAAIA,OAAO,EAAE;MACxBc,oBAAoB,CAACZ,KAAK,EAAED,iBAAiB,EAAEO,GAAG,CAACR,OAAO,EAAEG,QAAQ,CAACH,OAAO,CAAC;;GAEpF,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,oBAAOS,sDAASL,UAAU;iBAAY,WAAW;IAACO,SAAS,EAAEA,SAAS;IAAEH,GAAG,EAAEA;KAAO;AACxF;;;;"}
+{"version":3,"file":"Highlight.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Highlight.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { scrollColumnIntoView } from '../../../util/columns';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport const Highlight = props => {\n    const { current, frozenColumnIndex, index, tableRef, ...attributes } = props;\n    const { hasError: rowHasError } = useRowContext();\n\n    const ref = React.useRef<HTMLDivElement | null>(null);\n    const className = cn('h-full flex [justify-content:inherit] [text-align:inherit]', props.className, {\n        // normal row\n        'bg-blue-200/25': !current && !rowHasError,\n        // current row\n        'bg-blue-200/75': current && !rowHasError,\n        // normal row with error\n        'bg-[#eaeaf5]': !current && rowHasError,\n        // current with error\n        'bg-[#dadaf5]': current && rowHasError,\n    });\n\n    React.useEffect(() => {\n        if (ref.current && current) {\n            scrollColumnIntoView(index, frozenColumnIndex, ref.current, tableRef.current);\n        }\n    }, [current]);\n\n    return <div {...attributes} data-taco=\"highlight\" className={className} ref={ref} />;\n};\n"],"names":["Highlight","props","current","frozenColumnIndex","index","tableRef","attributes","hasError","rowHasError","useRowContext","ref","React","useRef","className","cn","useEffect","scrollColumnIntoView"],"mappings":";;;;;MAKaA,SAAS,GAAGC,KAAK;EAC1B,MAAM;IAAEC,OAAO;IAAEC,iBAAiB;IAAEC,KAAK;IAAEC,QAAQ;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAC5E,MAAM;IAAEM,QAAQ,EAAEC;GAAa,GAAGC,aAAa,EAAE;EAEjD,MAAMC,GAAG,GAAGC,cAAK,CAACC,MAAM,CAAwB,IAAI,CAAC;EACrD,MAAMC,SAAS,GAAGC,EAAE,CAAC,4DAA4D,EAAEb,KAAK,CAACY,SAAS,EAAE;;IAEhG,gBAAgB,EAAE,CAACX,OAAO,IAAI,CAACM,WAAW;;IAE1C,gBAAgB,EAAEN,OAAO,IAAI,CAACM,WAAW;;IAEzC,cAAc,EAAE,CAACN,OAAO,IAAIM,WAAW;;IAEvC,cAAc,EAAEN,OAAO,IAAIM;GAC9B,CAAC;EAEFG,cAAK,CAACI,SAAS,CAAC;IACZ,IAAIL,GAAG,CAACR,OAAO,IAAIA,OAAO,EAAE;MACxBc,oBAAoB,CAACZ,KAAK,EAAED,iBAAiB,EAAEO,GAAG,CAACR,OAAO,EAAEG,QAAQ,CAACH,OAAO,CAAC;;GAEpF,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,oBAAOS,sDAASL,UAAU;iBAAY,WAAW;IAACO,SAAS,EAAEA,SAAS;IAAEH,GAAG,EAAEA;KAAO;AACxF;;;;"}

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

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { Icon } from '../../../../Icon/Icon.js';
 import { Tooltip } from '../../../../Tooltip/Tooltip.js';
 import { useLocalization } from '../../../../Provider/Localization.js';

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 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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"}
+{"version":3,"file":"Indicator.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Indicator.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\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/cell/controls/TextareaControl.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { useMergedRef } from '../../../../../../hooks/useMergedRef.js';
 import { getCellAlignmentClasses } from '../../styles.js';
 import { Textarea } from '../../../../../Textarea/Textarea.js';
@@ -117,7 +117,7 @@ const TextareaControl = /*#__PURE__*/React__default.forwardRef(function Textarea
       handleTextareaKeyDown(e);
     },
     onBlur: handleBlur,
-    className: cn(getCellAlignmentClasses(align), `h-fit resize-none`, {
+    className: cn(getCellAlignmentClasses(align), `h-fit resize-none [&:not(:focus)]:whitespace-nowrap`, {
       [`!min-h-[${minMaxHeight.min}px]`]: columnMeta === null || columnMeta === void 0 ? void 0 : columnMeta.enableTruncate,
       '!yt-focus-dark': isCellInDetailMode,
       [`h-[${minMaxHeight.min}px]`]: !isCellInDetailMode && (columnMeta === null || columnMeta === void 0 ? void 0 : columnMeta.enableTruncate),

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

@@ -1 +1 @@
-{"version":3,"file":"TextareaControl.js","sources":["../../../../../../../../../../../src/components/Table3/components/columns/cell/controls/TextareaControl.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Textarea } from '../../../../../Textarea/Textarea';\nimport { EditingControlProps } from '../EditingControl';\nimport { getCellAlignmentClasses } from '../../styles';\nimport { useMergedRef } from '../../../../../../hooks/useMergedRef';\nimport { Table3FontSize } from '../../../../types';\n\ntype TextareaHeight = {\n    min: number;\n    max: number;\n};\n// By UX design, textarea should fold to min size when blured and extend to max 5 lines height when edited in enableTruncate mode,\n// for this reason we need to set min/max height limits for each font size value.\nconst heights: Record<Table3FontSize, TextareaHeight> = {\n    small: {\n        min: 24,\n        max: 86,\n    },\n    medium: {\n        min: 32,\n        max: 100,\n    },\n    large: {\n        min: 40,\n        max: 140,\n    },\n};\n\ntype TextareaControlProps<TType = unknown> = EditingControlProps<TType> & {\n    onKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n    fontSize: Table3FontSize;\n    invalid: boolean;\n    isCellInDetailMode?: boolean;\n};\n\nexport const TextareaControl = React.forwardRef<HTMLElement, any>(function TextareaControl<TType = unknown>(\n    props: TextareaControlProps<TType>,\n    externalRef: React.Ref<HTMLElement>\n) {\n    const {\n        onKeyDown: handleKeyDown,\n        onChange: handleChange,\n        onBlur,\n        column,\n        isCellInDetailMode,\n        align,\n        isActiveRow,\n        value,\n        fontSize,\n        ...attributes\n    } = props;\n\n    const minMaxHeight = heights[fontSize];\n\n    const columnMeta = column.columnDef.meta;\n\n    const ref = useMergedRef<HTMLTextAreaElement>(externalRef);\n\n    React.useEffect(() => {\n        if (ref?.current) {\n            // Need to reset textarea to min height when font size got changed and if column in enable truncate mode.\n            if (columnMeta?.enableTruncate) {\n                const textareaElement = ref?.current as HTMLTextAreaElement;\n                textareaElement.style.height = `${minMaxHeight.min}px`;\n\n                // If truncation is not enabled, then textarea should re-calculate it's height to fit with it's own content, when initialized or fonsSize got changed.\n            } else {\n                const textareaElement = ref?.current as HTMLTextAreaElement;\n                resizeTextArea(textareaElement);\n            }\n        }\n    }, [fontSize]);\n\n    React.useEffect(() => {\n        // If truncation is enabled, then textarea should only adjust to it's own content, when in detail mode.\n        // Otherwise it should collapse to minimal height.\n        if (ref?.current && columnMeta?.enableTruncate) {\n            const textareaElement = ref?.current as HTMLTextAreaElement;\n\n            if (isCellInDetailMode) {\n                resizeTextArea(textareaElement);\n            } else {\n                textareaElement.style.height = `${minMaxHeight.min}px`;\n            }\n        }\n    }, [isCellInDetailMode]);\n\n    const resizeTextArea = (textareaElement: HTMLTextAreaElement) => {\n        // Need to set inherit before calculating height, so that browser sets the scrollHeight properly,\n        // depending on text inside.\n        const textareaRect = textareaElement.getBoundingClientRect();\n        const prevHeight = textareaRect.height;\n        if (columnMeta?.enableTruncate) {\n            if (prevHeight < minMaxHeight.max) {\n                textareaElement.style.height = 'inherit';\n                textareaElement.style.height = `${Math.min(textareaElement.scrollHeight, minMaxHeight.max)}px`;\n            }\n        } else {\n            textareaElement.style.height = 'inherit';\n            textareaElement.style.height = `${textareaElement.scrollHeight}px`;\n        }\n    };\n\n    const handleTextareaChange = e => {\n        resizeTextArea(e.target);\n    };\n\n    const textareaContainerClassName = cn('w-full', {\n        'focus-within:absolute focus-within:left-0 focus-within:top-0 focus-within:z-[9]': columnMeta?.enableTruncate,\n    });\n    const handleTextareaKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n        // By default Shift + Enter in textarea makes a new line, we want to keep this behaviour\n        if (event.shiftKey && event.key === 'Enter') {\n            return;\n        } else {\n            handleKeyDown(event);\n        }\n    };\n\n    const handleBlur = event => {\n        // If truncation is enabled, then textarea should shring back to min height, when loosing focus.\n        if (columnMeta?.enableTruncate) {\n            const textareaElement = event.currentTarget;\n            textareaElement.style.height = `${minMaxHeight.min}px`;\n        }\n        onBlur(event);\n    };\n\n    return (\n        <div data-taco=\"input-container\">\n            {/**\n             * Textarea should have min height placeholder, because it becomes absolute positioned when focused,\n             * which leads to overlapping of validation message rendered bellow.\n             * Somehow tailwind cannot dynamically assign min height when arbitary value has been used(in this particular case),\n             * so assigning it through style prop here\n             **/}\n            <div style={{ minHeight: `${minMaxHeight.min}px` }} className=\"relative\">\n                <div className={textareaContainerClassName}>\n                    <Textarea\n                        {...attributes}\n                        onChange={event => {\n                            handleChange(event.target.value);\n                            handleTextareaChange(event);\n                        }}\n                        rows={1}\n                        onKeyDown={e => {\n                            handleTextareaKeyDown(e);\n                        }}\n                        onBlur={handleBlur}\n                        className={cn(getCellAlignmentClasses(align), `h-fit resize-none`, {\n                            [`!min-h-[${minMaxHeight.min}px]`]: columnMeta?.enableTruncate,\n                            '!yt-focus-dark': isCellInDetailMode,\n                            [`h-[${minMaxHeight.min}px]`]: !isCellInDetailMode && columnMeta?.enableTruncate,\n                            // Only allow resizing when focused and truncation enabled\n                            'focus:resize-y': isActiveRow && columnMeta?.enableTruncate,\n                        })}\n                        ref={ref}\n                        value={String(value ?? '')}\n                    />\n                </div>\n            </div>\n        </div>\n    );\n});\n"],"names":["heights","small","min","max","medium","large","TextareaControl","React","forwardRef","props","externalRef","onKeyDown","handleKeyDown","onChange","handleChange","onBlur","column","isCellInDetailMode","align","isActiveRow","value","fontSize","attributes","minMaxHeight","columnMeta","columnDef","meta","ref","useMergedRef","useEffect","current","enableTruncate","textareaElement","style","height","resizeTextArea","textareaRect","getBoundingClientRect","prevHeight","Math","scrollHeight","handleTextareaChange","e","target","textareaContainerClassName","cn","handleTextareaKeyDown","event","shiftKey","key","handleBlur","currentTarget","minHeight","className","Textarea","rows","getCellAlignmentClasses","String"],"mappings":"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"}
+{"version":3,"file":"TextareaControl.js","sources":["../../../../../../../../../../../src/components/Table3/components/columns/cell/controls/TextareaControl.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Textarea } from '../../../../../Textarea/Textarea';\nimport { EditingControlProps } from '../EditingControl';\nimport { getCellAlignmentClasses } from '../../styles';\nimport { useMergedRef } from '../../../../../../hooks/useMergedRef';\nimport { FontSize } from '../../../../../../types';\n\ntype TextareaHeight = {\n    min: number;\n    max: number;\n};\n// By UX design, textarea should fold to min size when blured and extend to max 5 lines height when edited in enableTruncate mode,\n// for this reason we need to set min/max height limits for each font size value.\nconst heights: Record<FontSize, TextareaHeight> = {\n    small: {\n        min: 24,\n        max: 86,\n    },\n    medium: {\n        min: 32,\n        max: 100,\n    },\n    large: {\n        min: 40,\n        max: 140,\n    },\n};\n\ntype TextareaControlProps<TType = unknown> = EditingControlProps<TType> & {\n    onKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n    fontSize: FontSize;\n    invalid: boolean;\n    isCellInDetailMode?: boolean;\n};\n\nexport const TextareaControl = React.forwardRef<HTMLElement, any>(function TextareaControl<TType = unknown>(\n    props: TextareaControlProps<TType>,\n    externalRef: React.Ref<HTMLElement>\n) {\n    const {\n        onKeyDown: handleKeyDown,\n        onChange: handleChange,\n        onBlur,\n        column,\n        isCellInDetailMode,\n        align,\n        isActiveRow,\n        value,\n        fontSize,\n        ...attributes\n    } = props;\n\n    const minMaxHeight = heights[fontSize];\n\n    const columnMeta = column.columnDef.meta;\n\n    const ref = useMergedRef<HTMLTextAreaElement>(externalRef);\n\n    React.useEffect(() => {\n        if (ref?.current) {\n            // Need to reset textarea to min height when font size got changed and if column in enable truncate mode.\n            if (columnMeta?.enableTruncate) {\n                const textareaElement = ref?.current as HTMLTextAreaElement;\n                textareaElement.style.height = `${minMaxHeight.min}px`;\n\n                // If truncation is not enabled, then textarea should re-calculate it's height to fit with it's own content, when initialized or fonsSize got changed.\n            } else {\n                const textareaElement = ref?.current as HTMLTextAreaElement;\n                resizeTextArea(textareaElement);\n            }\n        }\n    }, [fontSize]);\n\n    React.useEffect(() => {\n        // If truncation is enabled, then textarea should only adjust to it's own content, when in detail mode.\n        // Otherwise it should collapse to minimal height.\n        if (ref?.current && columnMeta?.enableTruncate) {\n            const textareaElement = ref?.current as HTMLTextAreaElement;\n\n            if (isCellInDetailMode) {\n                resizeTextArea(textareaElement);\n            } else {\n                textareaElement.style.height = `${minMaxHeight.min}px`;\n            }\n        }\n    }, [isCellInDetailMode]);\n\n    const resizeTextArea = (textareaElement: HTMLTextAreaElement) => {\n        // Need to set inherit before calculating height, so that browser sets the scrollHeight properly,\n        // depending on text inside.\n        const textareaRect = textareaElement.getBoundingClientRect();\n        const prevHeight = textareaRect.height;\n        if (columnMeta?.enableTruncate) {\n            if (prevHeight < minMaxHeight.max) {\n                textareaElement.style.height = 'inherit';\n                textareaElement.style.height = `${Math.min(textareaElement.scrollHeight, minMaxHeight.max)}px`;\n            }\n        } else {\n            textareaElement.style.height = 'inherit';\n            textareaElement.style.height = `${textareaElement.scrollHeight}px`;\n        }\n    };\n\n    const handleTextareaChange = e => {\n        resizeTextArea(e.target);\n    };\n\n    const textareaContainerClassName = cn('w-full', {\n        'focus-within:absolute focus-within:left-0 focus-within:top-0 focus-within:z-[9]': columnMeta?.enableTruncate,\n    });\n    const handleTextareaKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n        // By default Shift + Enter in textarea makes a new line, we want to keep this behaviour\n        if (event.shiftKey && event.key === 'Enter') {\n            return;\n        } else {\n            handleKeyDown(event);\n        }\n    };\n\n    const handleBlur = event => {\n        // If truncation is enabled, then textarea should shring back to min height, when loosing focus.\n        if (columnMeta?.enableTruncate) {\n            const textareaElement = event.currentTarget;\n            textareaElement.style.height = `${minMaxHeight.min}px`;\n        }\n        onBlur(event);\n    };\n\n    return (\n        <div data-taco=\"input-container\">\n            {/**\n             * Textarea should have min height placeholder, because it becomes absolute positioned when focused,\n             * which leads to overlapping of validation message rendered bellow.\n             * Somehow tailwind cannot dynamically assign min height when arbitary value has been used(in this particular case),\n             * so assigning it through style prop here\n             **/}\n            <div style={{ minHeight: `${minMaxHeight.min}px` }} className=\"relative\">\n                <div className={textareaContainerClassName}>\n                    <Textarea\n                        {...attributes}\n                        onChange={event => {\n                            handleChange(event.target.value);\n                            handleTextareaChange(event);\n                        }}\n                        rows={1}\n                        onKeyDown={e => {\n                            handleTextareaKeyDown(e);\n                        }}\n                        onBlur={handleBlur}\n                        className={cn(getCellAlignmentClasses(align), `h-fit resize-none [&:not(:focus)]:whitespace-nowrap`, {\n                            [`!min-h-[${minMaxHeight.min}px]`]: columnMeta?.enableTruncate,\n                            '!yt-focus-dark': isCellInDetailMode,\n                            [`h-[${minMaxHeight.min}px]`]: !isCellInDetailMode && columnMeta?.enableTruncate,\n                            // Only allow resizing when focused and truncation enabled\n                            'focus:resize-y': isActiveRow && columnMeta?.enableTruncate,\n                        })}\n                        ref={ref}\n                        value={String(value ?? '')}\n                    />\n                </div>\n            </div>\n        </div>\n    );\n});\n"],"names":["heights","small","min","max","medium","large","TextareaControl","React","forwardRef","props","externalRef","onKeyDown","handleKeyDown","onChange","handleChange","onBlur","column","isCellInDetailMode","align","isActiveRow","value","fontSize","attributes","minMaxHeight","columnMeta","columnDef","meta","ref","useMergedRef","useEffect","current","enableTruncate","textareaElement","style","height","resizeTextArea","textareaRect","getBoundingClientRect","prevHeight","Math","scrollHeight","handleTextareaChange","e","target","textareaContainerClassName","cn","handleTextareaKeyDown","event","shiftKey","key","handleBlur","currentTarget","minHeight","className","Textarea","rows","getCellAlignmentClasses","String"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/footer/Footer.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { isFrozenColumn } from '../../../util/columns.js';
 
 function Footer(props) {

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

@@ -1 +1 @@
-{"version":3,"file":"Footer.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/footer/Footer.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { ColumnMeta, HeaderContext } from '@tanstack/react-table';\nimport { isFrozenColumn } from '../../../util/columns';\nimport { Table3ColumnAlignment, Table3ColumnFooterRenderer } from '../../../types';\n\nexport type FooterProps<TType = unknown> = HeaderContext<TType, unknown> & {\n    renderer?: Table3ColumnFooterRenderer<TType>;\n};\n\nexport function Footer<TType = unknown>(props: FooterProps<TType>) {\n    const { column, header, table } = props;\n    const meta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n\n    // Footers are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the Footer\n    const memoedProps = {\n        align: meta.align,\n        id: header.id,\n        index: header.index,\n        isFrozen: isFrozenColumn(header, table),\n        meta,\n        table,\n    };\n\n    return <MemoedFooter<TType> {...memoedProps} />;\n}\n\n// Memoization\nexport type MemoedFooterProps<TType = unknown> = Omit<FooterProps<TType>, 'header' | 'column' | 'scrollToIndex'> & {\n    align?: Table3ColumnAlignment;\n    id: string;\n    index: number;\n    isFrozen: boolean;\n    meta: ColumnMeta<TType, unknown>;\n};\n\nconst MemoedFooter = React.memo(function MemoedFooter<TType = unknown>(props: MemoedFooterProps<TType>) {\n    const { align, id, index, isFrozen, meta, table } = props;\n\n    const className = cn('sticky bottom-0 border-t-2 font-bold h-10 box-content items-center group/column relative z-10', {\n        'z-30': isFrozen,\n    });\n\n    if (table.options.debugAll) {\n        console.log('footer render', id);\n    }\n\n    return (\n        <div className={className} data-align={align} data-column-index={index} role=\"columnheader\">\n            {typeof meta.footer === 'function' ? (\n                <span className=\"flex-grow truncate\">{meta.footer(table.getRowModel().rows.map(row => row.original[id]))}</span>\n            ) : null}\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedFooterProps<TType>) => JSX.Element;\n"],"names":["Footer","props","column","header","table","meta","React","useMemo","columnDef","memoedProps","align","id","index","isFrozen","isFrozenColumn","MemoedFooter","memo","className","cn","options","debugAll","console","log","role","footer","getRowModel","rows","map","row","original"],"mappings":";;;;SAUgBA,MAAMA,CAAkBC,KAAyB;EAC7D,MAAM;IAAEC,MAAM;IAAEC,MAAM;IAAEC;GAAO,GAAGH,KAAK;EACvC,MAAMI,IAAI,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAML,MAAM,CAACM,SAAS,CAACH,IAAI,EAAE,EAAE,CAA+B;;;EAIzF,MAAMI,WAAW,GAAG;IAChBC,KAAK,EAAEL,IAAI,CAACK,KAAK;IACjBC,EAAE,EAAER,MAAM,CAACQ,EAAE;IACbC,KAAK,EAAET,MAAM,CAACS,KAAK;IACnBC,QAAQ,EAAEC,cAAc,CAACX,MAAM,EAAEC,KAAK,CAAC;IACvCC,IAAI;IACJD;GACH;EAED,oBAAOE,6BAACS,YAAY,oBAAYN,WAAW,EAAI;AACnD;AAWA,MAAMM,YAAY,gBAAGT,cAAK,CAACU,IAAI,CAAC,SAASD,YAAYA,CAAkBd,KAA+B;EAClG,MAAM;IAAES,KAAK;IAAEC,EAAE;IAAEC,KAAK;IAAEC,QAAQ;IAAER,IAAI;IAAED;GAAO,GAAGH,KAAK;EAEzD,MAAMgB,SAAS,GAAGC,EAAE,CAAC,+FAA+F,EAAE;IAClH,MAAM,EAAEL;GACX,CAAC;EAEF,IAAIT,KAAK,CAACe,OAAO,CAACC,QAAQ,EAAE;IACxBC,OAAO,CAACC,GAAG,CAAC,eAAe,EAAEX,EAAE,CAAC;;EAGpC,oBACIL;IAAKW,SAAS,EAAEA,SAAS;kBAAcP,KAAK;yBAAqBE,KAAK;IAAEW,IAAI,EAAC;KACxE,OAAOlB,IAAI,CAACmB,MAAM,KAAK,UAAU,kBAC9BlB;IAAMW,SAAS,EAAC;KAAsBZ,IAAI,CAACmB,MAAM,CAACpB,KAAK,CAACqB,WAAW,EAAE,CAACC,IAAI,CAACC,GAAG,CAACC,GAAG,IAAIA,GAAG,CAACC,QAAQ,CAAClB,EAAE,CAAC,CAAC,CAAC,CAAQ,IAChH,IAAI,CACN;AAEd,CAAC,CAAsE;;;;"}
+{"version":3,"file":"Footer.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/footer/Footer.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { ColumnMeta, HeaderContext } from '@tanstack/react-table';\nimport { isFrozenColumn } from '../../../util/columns';\nimport { Table3ColumnAlignment, Table3ColumnFooterRenderer } from '../../../types';\n\nexport type FooterProps<TType = unknown> = HeaderContext<TType, unknown> & {\n    renderer?: Table3ColumnFooterRenderer<TType>;\n};\n\nexport function Footer<TType = unknown>(props: FooterProps<TType>) {\n    const { column, header, table } = props;\n    const meta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n\n    // Footers are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the Footer\n    const memoedProps = {\n        align: meta.align,\n        id: header.id,\n        index: header.index,\n        isFrozen: isFrozenColumn(header, table),\n        meta,\n        table,\n    };\n\n    return <MemoedFooter<TType> {...memoedProps} />;\n}\n\n// Memoization\nexport type MemoedFooterProps<TType = unknown> = Omit<FooterProps<TType>, 'header' | 'column' | 'scrollToIndex'> & {\n    align?: Table3ColumnAlignment;\n    id: string;\n    index: number;\n    isFrozen: boolean;\n    meta: ColumnMeta<TType, unknown>;\n};\n\nconst MemoedFooter = React.memo(function MemoedFooter<TType = unknown>(props: MemoedFooterProps<TType>) {\n    const { align, id, index, isFrozen, meta, table } = props;\n\n    const className = cn('sticky bottom-0 border-t-2 font-bold h-10 box-content items-center group/column relative z-10', {\n        'z-30': isFrozen,\n    });\n\n    if (table.options.debugAll) {\n        console.log('footer render', id);\n    }\n\n    return (\n        <div className={className} data-align={align} data-column-index={index} role=\"columnheader\">\n            {typeof meta.footer === 'function' ? (\n                <span className=\"flex-grow truncate\">{meta.footer(table.getRowModel().rows.map(row => row.original[id]))}</span>\n            ) : null}\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedFooterProps<TType>) => JSX.Element;\n"],"names":["Footer","props","column","header","table","meta","React","useMemo","columnDef","memoedProps","align","id","index","isFrozen","isFrozenColumn","MemoedFooter","memo","className","cn","options","debugAll","console","log","role","footer","getRowModel","rows","map","row","original"],"mappings":";;;;SAUgBA,MAAMA,CAAkBC,KAAyB;EAC7D,MAAM;IAAEC,MAAM;IAAEC,MAAM;IAAEC;GAAO,GAAGH,KAAK;EACvC,MAAMI,IAAI,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAML,MAAM,CAACM,SAAS,CAACH,IAAI,EAAE,EAAE,CAA+B;;;EAIzF,MAAMI,WAAW,GAAG;IAChBC,KAAK,EAAEL,IAAI,CAACK,KAAK;IACjBC,EAAE,EAAER,MAAM,CAACQ,EAAE;IACbC,KAAK,EAAET,MAAM,CAACS,KAAK;IACnBC,QAAQ,EAAEC,cAAc,CAACX,MAAM,EAAEC,KAAK,CAAC;IACvCC,IAAI;IACJD;GACH;EAED,oBAAOE,6BAACS,YAAY,oBAAYN,WAAW,EAAI;AACnD;AAWA,MAAMM,YAAY,gBAAGT,cAAK,CAACU,IAAI,CAAC,SAASD,YAAYA,CAAkBd,KAA+B;EAClG,MAAM;IAAES,KAAK;IAAEC,EAAE;IAAEC,KAAK;IAAEC,QAAQ;IAAER,IAAI;IAAED;GAAO,GAAGH,KAAK;EAEzD,MAAMgB,SAAS,GAAGC,EAAE,CAAC,+FAA+F,EAAE;IAClH,MAAM,EAAEL;GACX,CAAC;EAEF,IAAIT,KAAK,CAACe,OAAO,CAACC,QAAQ,EAAE;IACxBC,OAAO,CAACC,GAAG,CAAC,eAAe,EAAEX,EAAE,CAAC;;EAGpC,oBACIL;IAAKW,SAAS,EAAEA,SAAS;kBAAcP,KAAK;yBAAqBE,KAAK;IAAEW,IAAI,EAAC;KACxE,OAAOlB,IAAI,CAACmB,MAAM,KAAK,UAAU,kBAC9BlB;IAAMW,SAAS,EAAC;KAAsBZ,IAAI,CAACmB,MAAM,CAACpB,KAAK,CAACqB,WAAW,EAAE,CAACC,IAAI,CAACC,GAAG,CAACC,GAAG,IAAIA,GAAG,CAACC,QAAQ,CAAClB,EAAE,CAAC,CAAC,CAAC,CAAQ,IAChH,IAAI,CACN;AAEd,CAAC,CAAsE;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Group.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { Tooltip } from '../../../../Tooltip/Tooltip.js';
 import { HeaderSeparator } from './Header.js';
 

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

@@ -1 +1 @@
-{"version":3,"file":"Group.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Group.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { HeaderProps, HeaderSeparator } from './Header';\nimport { ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { Table3ColumnAlignment } from '../../../types';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport function Group<TType = unknown>(props: HeaderProps<TType>) {\n    const { children, column, header, table, hasSeparator } = props;\n    const columnMeta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const memoedProps = {\n        align: 'center' as Table3ColumnAlignment,\n        children: children ?? columnMeta.header,\n        colSpan: header.colSpan,\n        hasSeparator,\n        id: header.id,\n        index: header.index,\n        isPrinting: tableMeta.printing.isPrinting,\n        length: table.getRowModel().rows.length,\n        meta: columnMeta,\n        table,\n    };\n\n    return <MemoedGroup<TType> {...memoedProps} />;\n}\n\n// Memoization\nexport type MemoedGroupProps<TType = unknown> = Omit<HeaderProps<TType>, 'column' | 'header' | 'scrollToIndex'> & {\n    align?: Table3ColumnAlignment;\n    colSpan: number;\n    hasSeparator?: boolean;\n    id: string;\n    index: number;\n    isPrinting: boolean;\n    length: number;\n    meta: ColumnMeta<TType, unknown>;\n};\n\nconst MemoedGroup = React.memo(function MemoedGroup<TType = unknown>(props: MemoedGroupProps<TType>) {\n    const { align, children, colSpan, hasSeparator, id, isPrinting, meta, table } = props;\n\n    const containerClassName = cn('px-2 z-10 hover:z-20', colSpan > 1 ? `col-span-${colSpan}` : '', { sticky: !isPrinting });\n\n    const innerClassName = cn(\n        'font-bold box-content group/column relative',\n        'px-[var(--table3-cell-padding-x)]',\n        {\n            'h-10 items-center': !isPrinting,\n            'pb-2': isPrinting,\n            'border-b-2': !!children,\n        },\n        meta.headerClassName\n    );\n\n    if (table.options.debugAll) {\n        console.log('header group render', id);\n    }\n\n    return (\n        <div className={containerClassName} data-taco=\"table3-column-group\" data-align={align} role=\"columnheader\">\n            <div className={innerClassName}>\n                <Tooltip title={String(meta?.tooltip ?? children)} placement=\"top\">\n                    <span className={cn({ truncate: !isPrinting })}>{children}</span>\n                </Tooltip>\n                {hasSeparator ? <HeaderSeparator /> : null}\n            </div>\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedGroupProps<TType>) => JSX.Element;\n"],"names":["Group","props","children","column","header","table","hasSeparator","columnMeta","React","useMemo","columnDef","meta","tableMeta","options","memoedProps","align","colSpan","id","index","isPrinting","printing","length","getRowModel","rows","MemoedGroup","memo","containerClassName","cn","sticky","innerClassName","headerClassName","debugAll","console","log","className","role","Tooltip","title","String","_meta$tooltip","tooltip","placement","truncate","HeaderSeparator"],"mappings":";;;;;SAQgBA,KAAKA,CAAkBC,KAAyB;EAC5D,MAAM;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,MAAM;IAAEC,KAAK;IAAEC;GAAc,GAAGL,KAAK;EAC/D,MAAMM,UAAU,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAMN,MAAM,CAACO,SAAS,CAACC,IAAI,EAAE,EAAE,CAA+B;EAC/F,MAAMC,SAAS,GAAGP,KAAK,CAACQ,OAAO,CAACF,IAAwB;EAExD,MAAMG,WAAW,GAAG;IAChBC,KAAK,EAAE,QAAiC;IACxCb,QAAQ,EAAEA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIK,UAAU,CAACH,MAAM;IACvCY,OAAO,EAAEZ,MAAM,CAACY,OAAO;IACvBV,YAAY;IACZW,EAAE,EAAEb,MAAM,CAACa,EAAE;IACbC,KAAK,EAAEd,MAAM,CAACc,KAAK;IACnBC,UAAU,EAAEP,SAAS,CAACQ,QAAQ,CAACD,UAAU;IACzCE,MAAM,EAAEhB,KAAK,CAACiB,WAAW,EAAE,CAACC,IAAI,CAACF,MAAM;IACvCV,IAAI,EAAEJ,UAAU;IAChBF;GACH;EAED,oBAAOG,6BAACgB,WAAW,oBAAYV,WAAW,EAAI;AAClD;AAcA,MAAMU,WAAW,gBAAGhB,cAAK,CAACiB,IAAI,CAAC,SAASD,WAAWA,CAAkBvB,KAA8B;;EAC/F,MAAM;IAAEc,KAAK;IAAEb,QAAQ;IAAEc,OAAO;IAAEV,YAAY;IAAEW,EAAE;IAAEE,UAAU;IAAER,IAAI;IAAEN;GAAO,GAAGJ,KAAK;EAErF,MAAMyB,kBAAkB,GAAGC,EAAE,CAAC,sBAAsB,EAAEX,OAAO,GAAG,CAAC,eAAeA,SAAS,GAAG,EAAE,EAAE;IAAEY,MAAM,EAAE,CAACT;GAAY,CAAC;EAExH,MAAMU,cAAc,GAAGF,EAAE,CACrB,6CAA6C,EAC7C,mCAAmC,EACnC;IACI,mBAAmB,EAAE,CAACR,UAAU;IAChC,MAAM,EAAEA,UAAU;IAClB,YAAY,EAAE,CAAC,CAACjB;GACnB,EACDS,IAAI,CAACmB,eAAe,CACvB;EAED,IAAIzB,KAAK,CAACQ,OAAO,CAACkB,QAAQ,EAAE;IACxBC,OAAO,CAACC,GAAG,CAAC,qBAAqB,EAAEhB,EAAE,CAAC;;EAG1C,oBACIT;IAAK0B,SAAS,EAAER,kBAAkB;iBAAY,qBAAqB;kBAAaX,KAAK;IAAEoB,IAAI,EAAC;kBACxF3B;IAAK0B,SAAS,EAAEL;kBACZrB,6BAAC4B,OAAO;IAACC,KAAK,EAAEC,MAAM,EAAAC,aAAA,GAAC5B,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAE6B,OAAO,cAAAD,aAAA,cAAAA,aAAA,GAAIrC,QAAQ,CAAC;IAAEuC,SAAS,EAAC;kBACzDjC;IAAM0B,SAAS,EAAEP,EAAE,CAAC;MAAEe,QAAQ,EAAE,CAACvB;KAAY;KAAIjB,QAAQ,CAAQ,CAC3D,EACTI,YAAY,gBAAGE,6BAACmC,eAAe,OAAG,GAAG,IAAI,CACxC,CACJ;AAEd,CAAC,CAAqE;;;;"}
+{"version":3,"file":"Group.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Group.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\n\nimport { HeaderProps, HeaderSeparator } from './Header';\nimport { ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { Table3ColumnAlignment } from '../../../types';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport function Group<TType = unknown>(props: HeaderProps<TType>) {\n    const { children, column, header, table, hasSeparator } = props;\n    const columnMeta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const memoedProps = {\n        align: 'center' as Table3ColumnAlignment,\n        children: children ?? columnMeta.header,\n        colSpan: header.colSpan,\n        hasSeparator,\n        id: header.id,\n        index: header.index,\n        isPrinting: tableMeta.printing.isPrinting,\n        length: table.getRowModel().rows.length,\n        meta: columnMeta,\n        table,\n    };\n\n    return <MemoedGroup<TType> {...memoedProps} />;\n}\n\n// Memoization\nexport type MemoedGroupProps<TType = unknown> = Omit<HeaderProps<TType>, 'column' | 'header' | 'scrollToIndex'> & {\n    align?: Table3ColumnAlignment;\n    colSpan: number;\n    hasSeparator?: boolean;\n    id: string;\n    index: number;\n    isPrinting: boolean;\n    length: number;\n    meta: ColumnMeta<TType, unknown>;\n};\n\nconst MemoedGroup = React.memo(function MemoedGroup<TType = unknown>(props: MemoedGroupProps<TType>) {\n    const { align, children, colSpan, hasSeparator, id, isPrinting, meta, table } = props;\n\n    const containerClassName = cn('px-2 z-10 hover:z-20', colSpan > 1 ? `col-span-${colSpan}` : '', { sticky: !isPrinting });\n\n    const innerClassName = cn(\n        'font-bold box-content group/column relative',\n        'px-[var(--table3-cell-padding-x)]',\n        {\n            'h-10 items-center': !isPrinting,\n            'pb-2': isPrinting,\n            'border-b-2': !!children,\n        },\n        meta.headerClassName\n    );\n\n    if (table.options.debugAll) {\n        console.log('header group render', id);\n    }\n\n    return (\n        <div className={containerClassName} data-taco=\"table3-column-group\" data-align={align} role=\"columnheader\">\n            <div className={innerClassName}>\n                <Tooltip title={String(meta?.tooltip ?? children)} placement=\"top\">\n                    <span className={cn({ truncate: !isPrinting })}>{children}</span>\n                </Tooltip>\n                {hasSeparator ? <HeaderSeparator /> : null}\n            </div>\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedGroupProps<TType>) => JSX.Element;\n"],"names":["Group","props","children","column","header","table","hasSeparator","columnMeta","React","useMemo","columnDef","meta","tableMeta","options","memoedProps","align","colSpan","id","index","isPrinting","printing","length","getRowModel","rows","MemoedGroup","memo","containerClassName","cn","sticky","innerClassName","headerClassName","debugAll","console","log","className","role","Tooltip","title","String","_meta$tooltip","tooltip","placement","truncate","HeaderSeparator"],"mappings":";;;;;SAQgBA,KAAKA,CAAkBC,KAAyB;EAC5D,MAAM;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,MAAM;IAAEC,KAAK;IAAEC;GAAc,GAAGL,KAAK;EAC/D,MAAMM,UAAU,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAMN,MAAM,CAACO,SAAS,CAACC,IAAI,EAAE,EAAE,CAA+B;EAC/F,MAAMC,SAAS,GAAGP,KAAK,CAACQ,OAAO,CAACF,IAAwB;EAExD,MAAMG,WAAW,GAAG;IAChBC,KAAK,EAAE,QAAiC;IACxCb,QAAQ,EAAEA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIK,UAAU,CAACH,MAAM;IACvCY,OAAO,EAAEZ,MAAM,CAACY,OAAO;IACvBV,YAAY;IACZW,EAAE,EAAEb,MAAM,CAACa,EAAE;IACbC,KAAK,EAAEd,MAAM,CAACc,KAAK;IACnBC,UAAU,EAAEP,SAAS,CAACQ,QAAQ,CAACD,UAAU;IACzCE,MAAM,EAAEhB,KAAK,CAACiB,WAAW,EAAE,CAACC,IAAI,CAACF,MAAM;IACvCV,IAAI,EAAEJ,UAAU;IAChBF;GACH;EAED,oBAAOG,6BAACgB,WAAW,oBAAYV,WAAW,EAAI;AAClD;AAcA,MAAMU,WAAW,gBAAGhB,cAAK,CAACiB,IAAI,CAAC,SAASD,WAAWA,CAAkBvB,KAA8B;;EAC/F,MAAM;IAAEc,KAAK;IAAEb,QAAQ;IAAEc,OAAO;IAAEV,YAAY;IAAEW,EAAE;IAAEE,UAAU;IAAER,IAAI;IAAEN;GAAO,GAAGJ,KAAK;EAErF,MAAMyB,kBAAkB,GAAGC,EAAE,CAAC,sBAAsB,EAAEX,OAAO,GAAG,CAAC,eAAeA,SAAS,GAAG,EAAE,EAAE;IAAEY,MAAM,EAAE,CAACT;GAAY,CAAC;EAExH,MAAMU,cAAc,GAAGF,EAAE,CACrB,6CAA6C,EAC7C,mCAAmC,EACnC;IACI,mBAAmB,EAAE,CAACR,UAAU;IAChC,MAAM,EAAEA,UAAU;IAClB,YAAY,EAAE,CAAC,CAACjB;GACnB,EACDS,IAAI,CAACmB,eAAe,CACvB;EAED,IAAIzB,KAAK,CAACQ,OAAO,CAACkB,QAAQ,EAAE;IACxBC,OAAO,CAACC,GAAG,CAAC,qBAAqB,EAAEhB,EAAE,CAAC;;EAG1C,oBACIT;IAAK0B,SAAS,EAAER,kBAAkB;iBAAY,qBAAqB;kBAAaX,KAAK;IAAEoB,IAAI,EAAC;kBACxF3B;IAAK0B,SAAS,EAAEL;kBACZrB,6BAAC4B,OAAO;IAACC,KAAK,EAAEC,MAAM,EAAAC,aAAA,GAAC5B,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAE6B,OAAO,cAAAD,aAAA,cAAAA,aAAA,GAAIrC,QAAQ,CAAC;IAAEuC,SAAS,EAAC;kBACzDjC;IAAM0B,SAAS,EAAEP,EAAE,CAAC;MAAEe,QAAQ,EAAE,CAACvB;KAAY;KAAIjB,QAAQ,CAAQ,CAC3D,EACTI,YAAY,gBAAGE,6BAACmC,eAAe,OAAG,GAAG,IAAI,CACxC,CACJ;AAEd,CAAC,CAAqE;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Header.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { Tooltip } from '../../../../Tooltip/Tooltip.js';
 import { isGotoAvailable, isMenuAvailable, Menu } from './Menu.js';
 import { Resizer } from './Resizer.js';
@@ -40,7 +40,10 @@ function Header(props) {
   const search = table.getState().globalFilter;
   const handleGoto = React__default.useMemo(() => {
     if (hasGoto) {
-      return query => tableMeta.rowGoto.handleGoto(header.id, query, sorting, filters, search);
+      return query => {
+        var _tableMeta$rowGoto$ha, _tableMeta$rowGoto;
+        return (_tableMeta$rowGoto$ha = (_tableMeta$rowGoto = tableMeta.rowGoto).handleGoto) === null || _tableMeta$rowGoto$ha === void 0 ? void 0 : _tableMeta$rowGoto$ha.call(_tableMeta$rowGoto, header.id, query, sorting, filters, search);
+      };
     }
     return undefined;
   }, [hasGoto, JSON.stringify(sorting), JSON.stringify(filters), search]);

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

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { ColumnMeta, HeaderContext, TableMeta } from '@tanstack/react-table';\n\nimport { Menu, isMenuAvailable, isGotoAvailable } from './Menu';\nimport { Resizer } from './Resizer';\nimport { Table3ColumnAlignment, Table3SortDirection, TableStrategy } from '../../../types';\nimport { getSortAttributes, SortIndicator } from './SortIndicator';\nimport { isFrozenColumn, isInternalColumn } from '../../../util/columns';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport const SORT_DIRECTION: Record<string, Table3SortDirection> = {\n    ASC: 'asc',\n    DESC: 'desc',\n};\n\nexport type HeaderSortDirection = Table3SortDirection | false;\nexport type SortToggleHandler = (sortDirection: HeaderSortDirection) => void;\n\nexport type HeaderProps<TType = unknown> = HeaderContext<TType, unknown> & {\n    children?: string | JSX.Element;\n    hasSeparator?: boolean;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n    const { children, column, header, hasSeparator, scrollToIndex, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columnMeta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n    const canSort = column.getCanSort();\n    const hasGoto = isGotoAvailable(table, header);\n\n    // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n    const handleHide = React.useMemo(() => header.column.getToggleVisibilityHandler(), []);\n    const handleResize = React.useMemo(() => header.getResizeHandler(), []);\n    const handleSort = React.useMemo(() => header.column.getToggleSortingHandler(), []);\n    const handleSortToggle = React.useCallback((sortDirection: HeaderSortDirection) => {\n        // When sorting is not applied, sortDirection is false.\n        if (sortDirection === false) {\n            header.column.clearSorting();\n        } else {\n            header.column.toggleSorting(sortDirection === SORT_DIRECTION.DESC);\n        }\n    }, []);\n\n    const sorting = table.getState().sorting;\n    const filters = table.getState().columnFilters;\n    const search = table.getState().globalFilter;\n\n    const handleGoto = React.useMemo(() => {\n        if (hasGoto) {\n            return ((query: string) => tableMeta.rowGoto.handleGoto(header.id, query, sorting, filters, search)) as (\n                query: string\n            ) => Promise<number>;\n        }\n\n        return undefined;\n    }, [hasGoto, JSON.stringify(sorting), JSON.stringify(filters), search]);\n\n    const headerContentProps: HeaderContentProps<TType> = {\n        align: columnMeta.align,\n        canFreeze: tableMeta.columnFreezing.isEnabled,\n        canHide: column.getCanHide(),\n        canResize: column.getCanResize(),\n        canSort,\n        children: children ?? columnMeta.header,\n        colSpan: header.colSpan,\n        hasMenu: isMenuAvailable<TType>(table, header),\n        hasSeparator,\n        id: header.id,\n        index: header.index,\n        isFrozen: isFrozenColumn(header, table),\n        isPlaceholder: header.isPlaceholder,\n        isPrinting: tableMeta.printing.isPrinting,\n        isResizing: column.getIsResizing(),\n        length: table.getRowModel().rows.length,\n        meta: columnMeta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort as (event: unknown) => void,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection: column.getIsSorted(),\n        table,\n    };\n\n    return <HeaderContent<TType> {...headerContentProps} />;\n}\n\n// Memoization\nexport type HeaderContentProps<TType = unknown> = Omit<HeaderProps<TType>, 'column' | 'header'> & {\n    align?: Table3ColumnAlignment;\n    canFreeze: boolean;\n    canHide: boolean;\n    canResize: boolean;\n    canSort: boolean;\n    colSpan: number;\n    hasMenu: boolean;\n    hasSeparator?: boolean;\n    id: string;\n    index: number;\n    isFrozen: boolean;\n    isPlaceholder: boolean;\n    isPrinting: boolean;\n    isResizing: boolean;\n    length: number;\n    meta: ColumnMeta<TType, unknown>;\n    onGoto?: (query: string) => Promise<number>;\n    onHide: (event: unknown) => void;\n    onResize: (event: unknown) => void;\n    onSort: (event: unknown) => void;\n    onSortToggle: SortToggleHandler;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    sortDirection: HeaderSortDirection;\n};\n\nfunction HeaderContent<TType = unknown>(props: HeaderContentProps<TType>) {\n    const {\n        align,\n        children,\n        canFreeze,\n        canHide,\n        canResize,\n        canSort,\n        colSpan,\n        hasMenu,\n        hasSeparator,\n        id,\n        index,\n        isFrozen,\n        isPlaceholder,\n        isPrinting,\n        isResizing,\n        length,\n        meta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection,\n        table,\n    } = props;\n\n    const className = cn(\n        'font-bold border-b-2 box-content group/column relative',\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        'px-[var(--table3-cell-padding-x)]',\n        {\n            '!border-white': isPlaceholder,\n            'h-10 items-center sticky': !isPrinting,\n            'pb-2': isPrinting,\n            'cursor-pointer select-none': canSort,\n            'hover:bg-grey-100': !isPlaceholder && (canSort || canResize || hasMenu),\n            'focus-within:bg-grey-100': hasMenu,\n            '!pointer-events-all !bg-grey-100': !isPlaceholder && isResizing,\n            // z-indexes\n            'z-10 hover:z-20': !isFrozen && !isResizing,\n            'z-20': !isFrozen && isResizing,\n            // when column is frozen, we need to increase it's z-index when it's hovered,\n            // so that resize handler appears on top of next frozen cell, and didn't get cut by it.\n            '!z-30 hover:!z-40': isFrozen,\n            '!z-40': isFrozen && isResizing,\n        },\n        colSpan > 1 ? `col-span-${colSpan}` : '',\n        meta.headerClassName\n    );\n\n    const [internalRef, setInternalRef] = React.useState<HTMLDivElement | null>(null);\n\n    React.useLayoutEffect(() => {\n        if (internalRef && length) {\n            // the actions column size gets set by the column itself\n            if (isInternalColumn(id)) {\n                return;\n            }\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [id]: internalRef.getBoundingClientRect().width,\n            }));\n        }\n    }, [internalRef, length]);\n\n    if (table.options.debugAll) {\n        console.log('header render', id);\n    }\n    return (\n        <div\n            {...(canSort ? getSortAttributes(handleSort, sortDirection) : undefined)}\n            className={className}\n            data-align={align}\n            data-column-index={index}\n            role=\"columnheader\"\n            ref={setInternalRef}>\n            {isPlaceholder ? null : (\n                <>\n                    {isInternalColumn(id) ? (\n                        children\n                    ) : (\n                        <Tooltip title={String(meta?.tooltip ?? children)} placement=\"top\">\n                            <span className={cn({ truncate: !isPrinting })}>{children}</span>\n                        </Tooltip>\n                    )}\n                    {canSort ? <SortIndicator direction={sortDirection} /> : null}\n                    {hasMenu ? (\n                        <Menu\n                            canFreeze={canFreeze}\n                            canHide={canHide}\n                            canSort={canSort}\n                            className={cn({\n                                'ml-auto': align !== 'right',\n                                'ml-2': align === 'right',\n                            })}\n                            index={index}\n                            menu={meta.menu}\n                            onGoto={handleGoto}\n                            onHide={handleHide}\n                            onSortToggle={handleSortToggle}\n                            scrollToIndex={scrollToIndex}\n                            sortDirection={sortDirection}\n                            table={table}\n                        />\n                    ) : null}\n                </>\n            )}\n            {/* Header separator need to go before Resizer to prevent it's overlapping */}\n            {hasSeparator ? <HeaderSeparator /> : null}\n            {!isPlaceholder && canResize ? <Resizer isResizing={isResizing} onResize={handleResize} /> : null}\n        </div>\n    );\n}\n\nexport function HeaderSeparator() {\n    return (\n        <div\n            data-taco=\"header-separator\"\n            className={cn(\n                'invisible absolute right-[0.5px] top-0 flex h-full w-2 touch-none select-none justify-center py-2 group-hover/header:visible'\n            )}>\n            <div className={cn('bg-grey-300 h-full w-[1px]')} />\n        </div>\n    );\n}\n"],"names":["SORT_DIRECTION","ASC","DESC","Header","props","children","column","header","hasSeparator","scrollToIndex","table","tableMeta","options","meta","columnMeta","React","useMemo","columnDef","canSort","getCanSort","hasGoto","isGotoAvailable","handleHide","getToggleVisibilityHandler","handleResize","getResizeHandler","handleSort","getToggleSortingHandler","handleSortToggle","useCallback","sortDirection","clearSorting","toggleSorting","sorting","getState","filters","columnFilters","search","globalFilter","handleGoto","query","rowGoto","id","undefined","JSON","stringify","headerContentProps","align","canFreeze","columnFreezing","isEnabled","canHide","getCanHide","canResize","getCanResize","colSpan","hasMenu","isMenuAvailable","index","isFrozen","isFrozenColumn","isPlaceholder","isPrinting","printing","isResizing","getIsResizing","length","getRowModel","rows","onGoto","onHide","onResize","onSort","onSortToggle","getIsSorted","HeaderContent","className","cn","headerClassName","internalRef","setInternalRef","useState","useLayoutEffect","isInternalColumn","setColumnSizing","sizes","getBoundingClientRect","width","debugAll","console","log","getSortAttributes","role","ref","Tooltip","title","String","_meta$tooltip","tooltip","placement","truncate","SortIndicator","direction","Menu","menu","HeaderSeparator","Resizer"],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { ColumnMeta, HeaderContext, TableMeta } from '@tanstack/react-table';\n\nimport { Menu, isMenuAvailable, isGotoAvailable } from './Menu';\nimport { Resizer } from './Resizer';\nimport { Table3ColumnAlignment, Table3SortDirection, TableStrategy } from '../../../types';\nimport { getSortAttributes, SortIndicator } from './SortIndicator';\nimport { isFrozenColumn, isInternalColumn } from '../../../util/columns';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport const SORT_DIRECTION: Record<string, Table3SortDirection> = {\n    ASC: 'asc',\n    DESC: 'desc',\n};\n\nexport type HeaderSortDirection = Table3SortDirection | false;\nexport type SortToggleHandler = (sortDirection: HeaderSortDirection) => void;\n\nexport type HeaderProps<TType = unknown> = HeaderContext<TType, unknown> & {\n    children?: string | JSX.Element;\n    hasSeparator?: boolean;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n    const { children, column, header, hasSeparator, scrollToIndex, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columnMeta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n    const canSort = column.getCanSort();\n    const hasGoto = isGotoAvailable(table, header);\n\n    // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n    const handleHide = React.useMemo(() => header.column.getToggleVisibilityHandler(), []);\n    const handleResize = React.useMemo(() => header.getResizeHandler(), []);\n    const handleSort = React.useMemo(() => header.column.getToggleSortingHandler(), []);\n    const handleSortToggle = React.useCallback((sortDirection: HeaderSortDirection) => {\n        // When sorting is not applied, sortDirection is false.\n        if (sortDirection === false) {\n            header.column.clearSorting();\n        } else {\n            header.column.toggleSorting(sortDirection === SORT_DIRECTION.DESC);\n        }\n    }, []);\n\n    const sorting = table.getState().sorting;\n    const filters = table.getState().columnFilters;\n    const search = table.getState().globalFilter;\n\n    const handleGoto = React.useMemo(() => {\n        if (hasGoto) {\n            return ((query: string) => tableMeta.rowGoto.handleGoto?.(header.id, query, sorting, filters, search)) as (\n                query: string\n            ) => Promise<number>;\n        }\n\n        return undefined;\n    }, [hasGoto, JSON.stringify(sorting), JSON.stringify(filters), search]);\n\n    const headerContentProps: HeaderContentProps<TType> = {\n        align: columnMeta.align,\n        canFreeze: tableMeta.columnFreezing.isEnabled,\n        canHide: column.getCanHide(),\n        canResize: column.getCanResize(),\n        canSort,\n        children: children ?? columnMeta.header,\n        colSpan: header.colSpan,\n        hasMenu: isMenuAvailable<TType>(table, header),\n        hasSeparator,\n        id: header.id,\n        index: header.index,\n        isFrozen: isFrozenColumn(header, table),\n        isPlaceholder: header.isPlaceholder,\n        isPrinting: tableMeta.printing.isPrinting,\n        isResizing: column.getIsResizing(),\n        length: table.getRowModel().rows.length,\n        meta: columnMeta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort as (event: unknown) => void,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection: column.getIsSorted(),\n        table,\n    };\n\n    return <HeaderContent<TType> {...headerContentProps} />;\n}\n\n// Memoization\nexport type HeaderContentProps<TType = unknown> = Omit<HeaderProps<TType>, 'column' | 'header'> & {\n    align?: Table3ColumnAlignment;\n    canFreeze: boolean;\n    canHide: boolean;\n    canResize: boolean;\n    canSort: boolean;\n    colSpan: number;\n    hasMenu: boolean;\n    hasSeparator?: boolean;\n    id: string;\n    index: number;\n    isFrozen: boolean;\n    isPlaceholder: boolean;\n    isPrinting: boolean;\n    isResizing: boolean;\n    length: number;\n    meta: ColumnMeta<TType, unknown>;\n    onGoto?: (query: string) => Promise<number>;\n    onHide: (event: unknown) => void;\n    onResize: (event: unknown) => void;\n    onSort: (event: unknown) => void;\n    onSortToggle: SortToggleHandler;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    sortDirection: HeaderSortDirection;\n};\n\nfunction HeaderContent<TType = unknown>(props: HeaderContentProps<TType>) {\n    const {\n        align,\n        children,\n        canFreeze,\n        canHide,\n        canResize,\n        canSort,\n        colSpan,\n        hasMenu,\n        hasSeparator,\n        id,\n        index,\n        isFrozen,\n        isPlaceholder,\n        isPrinting,\n        isResizing,\n        length,\n        meta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection,\n        table,\n    } = props;\n\n    const className = cn(\n        'font-bold border-b-2 box-content group/column relative',\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        'px-[var(--table3-cell-padding-x)]',\n        {\n            '!border-white': isPlaceholder,\n            'h-10 items-center sticky': !isPrinting,\n            'pb-2': isPrinting,\n            'cursor-pointer select-none': canSort,\n            'hover:bg-grey-100': !isPlaceholder && (canSort || canResize || hasMenu),\n            'focus-within:bg-grey-100': hasMenu,\n            '!pointer-events-all !bg-grey-100': !isPlaceholder && isResizing,\n            // z-indexes\n            'z-10 hover:z-20': !isFrozen && !isResizing,\n            'z-20': !isFrozen && isResizing,\n            // when column is frozen, we need to increase it's z-index when it's hovered,\n            // so that resize handler appears on top of next frozen cell, and didn't get cut by it.\n            '!z-30 hover:!z-40': isFrozen,\n            '!z-40': isFrozen && isResizing,\n        },\n        colSpan > 1 ? `col-span-${colSpan}` : '',\n        meta.headerClassName\n    );\n\n    const [internalRef, setInternalRef] = React.useState<HTMLDivElement | null>(null);\n\n    React.useLayoutEffect(() => {\n        if (internalRef && length) {\n            // the actions column size gets set by the column itself\n            if (isInternalColumn(id)) {\n                return;\n            }\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [id]: internalRef.getBoundingClientRect().width,\n            }));\n        }\n    }, [internalRef, length]);\n\n    if (table.options.debugAll) {\n        console.log('header render', id);\n    }\n    return (\n        <div\n            {...(canSort ? getSortAttributes(handleSort, sortDirection) : undefined)}\n            className={className}\n            data-align={align}\n            data-column-index={index}\n            role=\"columnheader\"\n            ref={setInternalRef}>\n            {isPlaceholder ? null : (\n                <>\n                    {isInternalColumn(id) ? (\n                        children\n                    ) : (\n                        <Tooltip title={String(meta?.tooltip ?? children)} placement=\"top\">\n                            <span className={cn({ truncate: !isPrinting })}>{children}</span>\n                        </Tooltip>\n                    )}\n                    {canSort ? <SortIndicator direction={sortDirection} /> : null}\n                    {hasMenu ? (\n                        <Menu\n                            canFreeze={canFreeze}\n                            canHide={canHide}\n                            canSort={canSort}\n                            className={cn({\n                                'ml-auto': align !== 'right',\n                                'ml-2': align === 'right',\n                            })}\n                            index={index}\n                            menu={meta.menu}\n                            onGoto={handleGoto}\n                            onHide={handleHide}\n                            onSortToggle={handleSortToggle}\n                            scrollToIndex={scrollToIndex}\n                            sortDirection={sortDirection}\n                            table={table}\n                        />\n                    ) : null}\n                </>\n            )}\n            {/* Header separator need to go before Resizer to prevent it's overlapping */}\n            {hasSeparator ? <HeaderSeparator /> : null}\n            {!isPlaceholder && canResize ? <Resizer isResizing={isResizing} onResize={handleResize} /> : null}\n        </div>\n    );\n}\n\nexport function HeaderSeparator() {\n    return (\n        <div\n            data-taco=\"header-separator\"\n            className={cn(\n                'invisible absolute right-[0.5px] top-0 flex h-full w-2 touch-none select-none justify-center py-2 group-hover/header:visible'\n            )}>\n            <div className={cn('bg-grey-300 h-full w-[1px]')} />\n        </div>\n    );\n}\n"],"names":["SORT_DIRECTION","ASC","DESC","Header","props","children","column","header","hasSeparator","scrollToIndex","table","tableMeta","options","meta","columnMeta","React","useMemo","columnDef","canSort","getCanSort","hasGoto","isGotoAvailable","handleHide","getToggleVisibilityHandler","handleResize","getResizeHandler","handleSort","getToggleSortingHandler","handleSortToggle","useCallback","sortDirection","clearSorting","toggleSorting","sorting","getState","filters","columnFilters","search","globalFilter","handleGoto","query","_tableMeta$rowGoto$ha","_tableMeta$rowGoto","rowGoto","call","id","undefined","JSON","stringify","headerContentProps","align","canFreeze","columnFreezing","isEnabled","canHide","getCanHide","canResize","getCanResize","colSpan","hasMenu","isMenuAvailable","index","isFrozen","isFrozenColumn","isPlaceholder","isPrinting","printing","isResizing","getIsResizing","length","getRowModel","rows","onGoto","onHide","onResize","onSort","onSortToggle","getIsSorted","HeaderContent","className","cn","headerClassName","internalRef","setInternalRef","useState","useLayoutEffect","isInternalColumn","setColumnSizing","sizes","getBoundingClientRect","width","debugAll","console","log","getSortAttributes","role","ref","Tooltip","title","String","_meta$tooltip","tooltip","placement","truncate","SortIndicator","direction","Menu","menu","HeaderSeparator","Resizer"],"mappings":";;;;;;;;MAWaA,cAAc,GAAwC;EAC/DC,GAAG,EAAE,KAAK;EACVC,IAAI,EAAE;;SAWMC,MAAMA,CAAkBC,KAAyB;EAC7D,MAAM;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,MAAM;IAAEC,YAAY;IAAEC,aAAa;IAAEC;GAAO,GAAGN,KAAK;EAC9E,MAAMO,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAAwB;EACxD,MAAMC,UAAU,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAMV,MAAM,CAACW,SAAS,CAACJ,IAAI,EAAE,EAAE,CAA+B;EAC/F,MAAMK,OAAO,GAAGZ,MAAM,CAACa,UAAU,EAAE;EACnC,MAAMC,OAAO,GAAGC,eAAe,CAACX,KAAK,EAAEH,MAAM,CAAC;;EAG9C,MAAMe,UAAU,GAAGP,cAAK,CAACC,OAAO,CAAC,MAAMT,MAAM,CAACD,MAAM,CAACiB,0BAA0B,EAAE,EAAE,EAAE,CAAC;EACtF,MAAMC,YAAY,GAAGT,cAAK,CAACC,OAAO,CAAC,MAAMT,MAAM,CAACkB,gBAAgB,EAAE,EAAE,EAAE,CAAC;EACvE,MAAMC,UAAU,GAAGX,cAAK,CAACC,OAAO,CAAC,MAAMT,MAAM,CAACD,MAAM,CAACqB,uBAAuB,EAAE,EAAE,EAAE,CAAC;EACnF,MAAMC,gBAAgB,GAAGb,cAAK,CAACc,WAAW,CAAEC,aAAkC;;IAE1E,IAAIA,aAAa,KAAK,KAAK,EAAE;MACzBvB,MAAM,CAACD,MAAM,CAACyB,YAAY,EAAE;KAC/B,MAAM;MACHxB,MAAM,CAACD,MAAM,CAAC0B,aAAa,CAACF,aAAa,KAAK9B,cAAc,CAACE,IAAI,CAAC;;GAEzE,EAAE,EAAE,CAAC;EAEN,MAAM+B,OAAO,GAAGvB,KAAK,CAACwB,QAAQ,EAAE,CAACD,OAAO;EACxC,MAAME,OAAO,GAAGzB,KAAK,CAACwB,QAAQ,EAAE,CAACE,aAAa;EAC9C,MAAMC,MAAM,GAAG3B,KAAK,CAACwB,QAAQ,EAAE,CAACI,YAAY;EAE5C,MAAMC,UAAU,GAAGxB,cAAK,CAACC,OAAO,CAAC;IAC7B,IAAII,OAAO,EAAE;MACT,OAASoB,KAAa;QAAA,IAAAC,qBAAA,EAAAC,kBAAA;QAAA,QAAAD,qBAAA,GAAK,CAAAC,kBAAA,GAAA/B,SAAS,CAACgC,OAAO,EAACJ,UAAU,cAAAE,qBAAA,uBAA5BA,qBAAA,CAAAG,IAAA,CAAAF,kBAAA,EAA+BnC,MAAM,CAACsC,EAAE,EAAEL,KAAK,EAAEP,OAAO,EAAEE,OAAO,EAAEE,MAAM,CAAC;;;IAKzG,OAAOS,SAAS;GACnB,EAAE,CAAC1B,OAAO,EAAE2B,IAAI,CAACC,SAAS,CAACf,OAAO,CAAC,EAAEc,IAAI,CAACC,SAAS,CAACb,OAAO,CAAC,EAAEE,MAAM,CAAC,CAAC;EAEvE,MAAMY,kBAAkB,GAA8B;IAClDC,KAAK,EAAEpC,UAAU,CAACoC,KAAK;IACvBC,SAAS,EAAExC,SAAS,CAACyC,cAAc,CAACC,SAAS;IAC7CC,OAAO,EAAEhD,MAAM,CAACiD,UAAU,EAAE;IAC5BC,SAAS,EAAElD,MAAM,CAACmD,YAAY,EAAE;IAChCvC,OAAO;IACPb,QAAQ,EAAEA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIS,UAAU,CAACP,MAAM;IACvCmD,OAAO,EAAEnD,MAAM,CAACmD,OAAO;IACvBC,OAAO,EAAEC,eAAe,CAAQlD,KAAK,EAAEH,MAAM,CAAC;IAC9CC,YAAY;IACZqC,EAAE,EAAEtC,MAAM,CAACsC,EAAE;IACbgB,KAAK,EAAEtD,MAAM,CAACsD,KAAK;IACnBC,QAAQ,EAAEC,cAAc,CAACxD,MAAM,EAAEG,KAAK,CAAC;IACvCsD,aAAa,EAAEzD,MAAM,CAACyD,aAAa;IACnCC,UAAU,EAAEtD,SAAS,CAACuD,QAAQ,CAACD,UAAU;IACzCE,UAAU,EAAE7D,MAAM,CAAC8D,aAAa,EAAE;IAClCC,MAAM,EAAE3D,KAAK,CAAC4D,WAAW,EAAE,CAACC,IAAI,CAACF,MAAM;IACvCxD,IAAI,EAAEC,UAAU;IAChB0D,MAAM,EAAEjC,UAAU;IAClBkC,MAAM,EAAEnD,UAAU;IAClBoD,QAAQ,EAAElD,YAAY;IACtBmD,MAAM,EAAEjD,UAAsC;IAC9CkD,YAAY,EAAEhD,gBAAgB;IAC9BnB,aAAa;IACbqB,aAAa,EAAExB,MAAM,CAACuE,WAAW,EAAE;IACnCnE;GACH;EAED,oBAAOK,6BAAC+D,aAAa,oBAAY7B,kBAAkB,EAAI;AAC3D;AA6BA,SAAS6B,aAAaA,CAAkB1E,KAAgC;;EACpE,MAAM;IACF8C,KAAK;IACL7C,QAAQ;IACR8C,SAAS;IACTG,OAAO;IACPE,SAAS;IACTtC,OAAO;IACPwC,OAAO;IACPC,OAAO;IACPnD,YAAY;IACZqC,EAAE;IACFgB,KAAK;IACLC,QAAQ;IACRE,aAAa;IACbC,UAAU;IACVE,UAAU;IACVE,MAAM;IACNxD,IAAI;IACJ2D,MAAM,EAAEjC,UAAU;IAClBkC,MAAM,EAAEnD,UAAU;IAClBoD,QAAQ,EAAElD,YAAY;IACtBmD,MAAM,EAAEjD,UAAU;IAClBkD,YAAY,EAAEhD,gBAAgB;IAC9BnB,aAAa;IACbqB,aAAa;IACbpB;GACH,GAAGN,KAAK;EAET,MAAM2E,SAAS,GAAGC,EAAE,CAChB,wDAAwD,EACxD,8DAA8D,EAC9D,mCAAmC,EACnC;IACI,eAAe,EAAEhB,aAAa;IAC9B,0BAA0B,EAAE,CAACC,UAAU;IACvC,MAAM,EAAEA,UAAU;IAClB,4BAA4B,EAAE/C,OAAO;IACrC,mBAAmB,EAAE,CAAC8C,aAAa,KAAK9C,OAAO,IAAIsC,SAAS,IAAIG,OAAO,CAAC;IACxE,0BAA0B,EAAEA,OAAO;IACnC,kCAAkC,EAAE,CAACK,aAAa,IAAIG,UAAU;;IAEhE,iBAAiB,EAAE,CAACL,QAAQ,IAAI,CAACK,UAAU;IAC3C,MAAM,EAAE,CAACL,QAAQ,IAAIK,UAAU;;;IAG/B,mBAAmB,EAAEL,QAAQ;IAC7B,OAAO,EAAEA,QAAQ,IAAIK;GACxB,EACDT,OAAO,GAAG,CAAC,eAAeA,SAAS,GAAG,EAAE,EACxC7C,IAAI,CAACoE,eAAe,CACvB;EAED,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGpE,cAAK,CAACqE,QAAQ,CAAwB,IAAI,CAAC;EAEjFrE,cAAK,CAACsE,eAAe,CAAC;IAClB,IAAIH,WAAW,IAAIb,MAAM,EAAE;;MAEvB,IAAIiB,gBAAgB,CAACzC,EAAE,CAAC,EAAE;QACtB;;MAGJnC,KAAK,CAAC6E,eAAe,CAACC,KAAK,KAAK;QAC5B,GAAGA,KAAK;QACR,CAAC3C,EAAE,GAAGqC,WAAW,CAACO,qBAAqB,EAAE,CAACC;OAC7C,CAAC,CAAC;;GAEV,EAAE,CAACR,WAAW,EAAEb,MAAM,CAAC,CAAC;EAEzB,IAAI3D,KAAK,CAACE,OAAO,CAAC+E,QAAQ,EAAE;IACxBC,OAAO,CAACC,GAAG,CAAC,eAAe,EAAEhD,EAAE,CAAC;;EAEpC,oBACI9B,sDACSG,OAAO,GAAG4E,iBAAiB,CAACpE,UAAU,EAAEI,aAAa,CAAC,GAAGgB,SAAS;IACvEiC,SAAS,EAAEA,SAAS;kBACR7B,KAAK;yBACEW,KAAK;IACxBkC,IAAI,EAAC,cAAc;IACnBC,GAAG,EAAEb;MACJnB,aAAa,GAAG,IAAI,kBACjBjD,4DACKuE,gBAAgB,CAACzC,EAAE,CAAC,GACjBxC,QAAQ,kBAERU,6BAACkF,OAAO;IAACC,KAAK,EAAEC,MAAM,EAAAC,aAAA,GAACvF,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEwF,OAAO,cAAAD,aAAA,cAAAA,aAAA,GAAI/F,QAAQ,CAAC;IAAEiG,SAAS,EAAC;kBACzDvF;IAAMgE,SAAS,EAAEC,EAAE,CAAC;MAAEuB,QAAQ,EAAE,CAACtC;KAAY;KAAI5D,QAAQ,CAAQ,CAC3D,CACb,EACAa,OAAO,gBAAGH,6BAACyF,aAAa;IAACC,SAAS,EAAE3E;IAAiB,GAAG,IAAI,EAC5D6B,OAAO,kBACJ5C,6BAAC2F,IAAI;IACDvD,SAAS,EAAEA,SAAS;IACpBG,OAAO,EAAEA,OAAO;IAChBpC,OAAO,EAAEA,OAAO;IAChB6D,SAAS,EAAEC,EAAE,CAAC;MACV,SAAS,EAAE9B,KAAK,KAAK,OAAO;MAC5B,MAAM,EAAEA,KAAK,KAAK;KACrB,CAAC;IACFW,KAAK,EAAEA,KAAK;IACZ8C,IAAI,EAAE9F,IAAI,CAAC8F,IAAI;IACfnC,MAAM,EAAEjC,UAAU;IAClBkC,MAAM,EAAEnD,UAAU;IAClBsD,YAAY,EAAEhD,gBAAgB;IAC9BnB,aAAa,EAAEA,aAAa;IAC5BqB,aAAa,EAAEA,aAAa;IAC5BpB,KAAK,EAAEA;IACT,IACF,IAAI,CACT,CACN,EAEAF,YAAY,gBAAGO,6BAAC6F,eAAe,OAAG,GAAG,IAAI,EACzC,CAAC5C,aAAa,IAAIR,SAAS,gBAAGzC,6BAAC8F,OAAO;IAAC1C,UAAU,EAAEA,UAAU;IAAEO,QAAQ,EAAElD;IAAgB,GAAG,IAAI,CAC/F;AAEd;SAEgBoF,eAAeA;EAC3B,oBACI7F;iBACc,kBAAkB;IAC5BgE,SAAS,EAAEC,EAAE,CACT,8HAA8H;kBAElIjE;IAAKgE,SAAS,EAAEC,EAAE,CAAC,4BAA4B;IAAK,CAClD;AAEd;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Menu.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import cn from 'classnames';
+import cn from 'clsx';
 import { createShortcutKeyDownHandler } from '../../../../../utils/keyboard.js';
 import { IconButton } from '../../../../IconButton/IconButton.js';
 import { useLocalization } from '../../../../Provider/Localization.js';