@economic/taco 2.8.1 → 2.9.0

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

@@ -1 +1 @@
-{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n    return null;\n}\n\ntype FixedForwardRef = <T, P = {}>(\n    render: (props: P, ref: React.Ref<T>) => JSX.Element\n) => (props: P & React.RefAttributes<T>) => JSX.Element;\n\n// Cast the old forwardRef to the new one\nexport const fixedForwardRef = React.forwardRef as FixedForwardRef;\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const { emptyState: EmptyState, toolbarLeft, toolbarRight } = props;\n    const internalRef = useMergedRef<Table3Ref>(ref);\n\n    const { table, length } = useTable<TType>(props);\n    useTableRefInstanceSetup(table, internalRef);\n\n    React.useEffect(() => {\n        if (props.autoFocus) {\n            internalRef.current?.focus();\n        }\n    }, []);\n\n    const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const state = table.getState();\n\n    const bodyRef = React.useRef<HTMLDivElement | null>(null);\n\n    React.useEffect(\n        () => {\n            const handleKeyDown = (event: KeyboardEvent) => {\n                const target = event.target as HTMLElement;\n                const dialog = target.closest('[role=\"dialog\"]');\n                const eventOriginatedFromCombobox = !!target.closest('[role=\"combobox\"]');\n\n                // Don't trigger global shortcuts on the table if event originated from a combobox or if table is\n                // outside the dialog\n                if (eventOriginatedFromCombobox || (dialog && !dialog?.contains(internalRef.current))) {\n                    return;\n                }\n\n                tableMeta.hoverState.handleKeyDown(event);\n                tableMeta.currentRow.handleKeyDown(event, table.getRowModel().rows.length, scrollToIndex);\n                tableMeta.rowClick.handleKeyDown(event, table);\n                tableMeta.rowSelection.handleKeyDown(event, table);\n                tableMeta.editing.handleKeyDown(event);\n            };\n\n            document.addEventListener('keydown', handleKeyDown);\n\n            return () => {\n                document.removeEventListener('keydown', handleKeyDown);\n            };\n        },\n        // See https://github.com/e-conomic/taco/blob/dev/packages/taco/src/components/Table3/strategies/virtualised.tsx#L143\n        // scrollToIndex function changes when row count changes, so it is important to update handlers with new\n        // scrollToIndex function.\n        [scrollToIndex, internalRef.current]\n    );\n\n    const handleBlur = (event: React.FocusEvent) => {\n        tableMeta.editing.handleBlur(event);\n    };\n\n    const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n        tableMeta.columnFreezing.handleScroll(event);\n    };\n\n    const className = cn(\n        'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px]',\n        '[&[data-resizing=\"true\"]]:select-none',\n        {\n            'text-xs': tableMeta.fontSize.size === 'small',\n            'text-sm': tableMeta.fontSize.size === 'medium',\n            'text-base': tableMeta.fontSize.size === 'large',\n        }\n    );\n\n    const { style: cssGridStyle } = useCssGrid<TType>(table);\n    const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n    const style = {\n        ...cssVars,\n        ...cssGridStyle,\n        // create a new stacking context so our internal z-indexes don't effect external components\n        // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n        opacity: 0.999,\n    };\n\n    const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n    const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n    return (\n        <>\n            {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n            <Toolbar\n                table={table}\n                tableProps={props}\n                total={length}\n                left={toolbarLeft}\n                right={toolbarRight}\n                scrollToIndex={scrollToIndex}\n            />\n            <div\n                className={className}\n                id={props.id}\n                data-font-size={tableMeta.fontSize.size}\n                data-editing={tableMeta.editing.isEditing}\n                data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n                data-pause-hover={tableMeta?.hoverState.isPaused}\n                data-resizing={!!state.columnSizingInfo.isResizingColumn}\n                data-taco=\"table2\"\n                onBlur={handleBlur}\n                onScroll={handleScroll}\n                ref={internalRef}\n                role=\"table\"\n                style={style}>\n                {isServerLoadingAndNotReady ? null : (\n                    <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n                        {table.getHeaderGroups().map(headerGroup => (\n                            <div className=\"contents\" key={headerGroup.id} role=\"row\">\n                                {headerGroup.headers.map(header => (\n                                    <React.Fragment key={header.id}>\n                                        {flexRender(header.column.columnDef.header, { ...header.getContext(), scrollToIndex })}\n                                    </React.Fragment>\n                                ))}\n                            </div>\n                        ))}\n                    </div>\n                )}\n                {table.getRowModel().rows.length ? (\n                    <>\n                        <FocusScope>\n                            <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\" ref={bodyRef}>\n                                {renderBody()}\n                            </div>\n                        </FocusScope>\n                        {/* This div makes sure that there is always a free space between the rows and footer when\n                        table height exceeds the cumulative height of all rows. See useCSSGrid.ts */}\n                        {/* By vertically translating the div a pixel down, we hide the div border below footer so that\n                        the footer border doesn't appear an extra pixel thick */}\n                        <div className=\"border-grey-300 col-span-full translate-y-px border-t\" />\n                        {tableMeta.enableFooter ? (\n                            <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n                                {table.getFooterGroups().map(footerGroup => (\n                                    <div className=\"contents\" key={footerGroup.id} role=\"row\">\n                                        {footerGroup.headers.map(footer => (\n                                            <React.Fragment key={footer.id}>\n                                                {flexRender(footer.column.columnDef.footer, footer.getContext())}\n                                            </React.Fragment>\n                                        ))}\n                                    </div>\n                                ))}\n                                {length ? (\n                                    <Summary currentLength={table.getRowModel().rows.length} length={length} table={table} />\n                                ) : null}\n                            </div>\n                        ) : null}\n                    </>\n                ) : (\n                    <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n                )}\n            </div>\n        </>\n    );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n    Column: typeof Column;\n};\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const stringifiedChildren = String(props.children);\n    // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n    // this is cheaper from a complexity perspective, and probably performance wise as well\n    const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n    return <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n    useTable3DataFetcher,\n    useTable3DataOptions,\n    useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n    Table3Ref,\n    Table3Props,\n    Table3Preset,\n    Table3Settings,\n    Table3SettingsHandler,\n    Table3RowHeight,\n    Table3FilterComparator,\n    Table3FilterHandler,\n    Table3LoadPageHandler,\n    Table3LoadAllHandler,\n    Table3RowGotoHandler,\n    Table3SortHandler,\n    Table3Shortcuts,\n    Table3ShortcutHandlerFn,\n    Table3ShortcutHandlerObject,\n    Table3FontSize,\n    Table3SortDirection,\n    Table3SortFn,\n    Table3RowActionRenderer,\n    Table3RowSelectionHandler,\n    Table3RowExpansionRenderer,\n    Table3RowDropHandler,\n    Table3RowDragHandler,\n    Table3RowClickHandler,\n    Table3ColumnProps,\n    Table3ColumnAlignment,\n    Table3ColumnDataType,\n    Table3ColumnHeaderMenu,\n    Table3ColumnClassNameHandler,\n    Table3ColumnFooterRenderer,\n    Table3ColumnRenderer,\n    Table3ColumnControlRenderer,\n    Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","fixedForwardRef","React","forwardRef","Table","Table3","props","ref","emptyState","EmptyState","toolbarLeft","toolbarRight","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","useEffect","autoFocus","_internalRef$current","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","bodyRef","useRef","handleKeyDown","event","target","dialog","closest","eventOriginatedFromCombobox","contains","hoverState","currentRow","getRowModel","rows","rowClick","rowSelection","editing","document","addEventListener","removeEventListener","handleBlur","handleScroll","columnFreezing","Promise","resolve","e","reject","className","cn","fontSize","size","style","cssGridStyle","useCssGrid","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","id","isServerLoadingAndNotReady","isUsingServer","undefined","Toolbar","tableProps","total","left","right","isEditing","horizontallyScrolled","isPaused","columnSizingInfo","isResizingColumn","onBlur","onScroll","role","getHeaderGroups","map","headerGroup","key","headers","header","Fragment","flexRender","column","columnDef","getContext","FocusScope","enableFooter","getFooterGroups","footerGroup","footer","Summary","currentLength","stringifiedChildren","String","children","useMemo"],"mappings":"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"}
+{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n    return null;\n}\n\ntype FixedForwardRef = <T, P = {}>(\n    render: (props: P, ref: React.Ref<T>) => JSX.Element\n) => (props: P & React.RefAttributes<T>) => JSX.Element;\n\n// Cast the old forwardRef to the new one\nexport const fixedForwardRef = React.forwardRef as FixedForwardRef;\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const { emptyState: EmptyState, toolbarLeft, toolbarRight } = props;\n    const internalRef = useMergedRef<Table3Ref>(ref);\n\n    const { table, length } = useTable<TType>(props);\n    useTableRefInstanceSetup(table, internalRef);\n\n    React.useEffect(() => {\n        if (props.autoFocus) {\n            internalRef.current?.focus();\n        }\n    }, []);\n\n    const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const state = table.getState();\n\n    const bodyRef = React.useRef<HTMLDivElement | null>(null);\n\n    React.useEffect(\n        () => {\n            const handleKeyDown = (event: KeyboardEvent) => {\n                const target = event.target as HTMLElement;\n                const dialog = target.closest('[role=\"dialog\"]');\n                const eventOriginatedFromCombobox = !!target.closest('[role=\"combobox\"]');\n\n                // Don't trigger global shortcuts on the table if event originated from a combobox or if table is\n                // outside the dialog\n                if (eventOriginatedFromCombobox || (dialog && !dialog?.contains(internalRef.current))) {\n                    return;\n                }\n\n                tableMeta.hoverState.handleKeyDown(event);\n                tableMeta.currentRow.handleKeyDown(event, table.getRowModel().rows.length, scrollToIndex);\n                tableMeta.rowClick.handleKeyDown(event, table);\n                tableMeta.rowSelection.handleKeyDown(event, table);\n                tableMeta.editing.handleKeyDown(event);\n            };\n\n            document.addEventListener('keydown', handleKeyDown);\n\n            return () => {\n                document.removeEventListener('keydown', handleKeyDown);\n            };\n        },\n        // See https://github.com/e-conomic/taco/blob/dev/packages/taco/src/components/Table3/strategies/virtualised.tsx#L143\n        // scrollToIndex function changes when row count changes, so it is important to update handlers with new\n        // scrollToIndex function.\n        [scrollToIndex, internalRef.current]\n    );\n\n    const handleBlur = (event: React.FocusEvent) => {\n        tableMeta.editing.handleBlur(event);\n    };\n\n    const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n        tableMeta.columnFreezing.handleScroll(event);\n    };\n\n    const className = cn(\n        'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px]',\n        '[&[data-resizing=\"true\"]]:select-none',\n        {\n            'text-xs': tableMeta.fontSize.size === 'small',\n            'text-sm': tableMeta.fontSize.size === 'medium',\n            'text-base': tableMeta.fontSize.size === 'large',\n        }\n    );\n\n    // Print tables have \"_print\" as the postfix for the table id, so we can use the it to determine\n    // if the table is a print table or not.\n    const { style: cssGridStyle } = useCssGrid<TType>(table, props.id.endsWith('_print'));\n    const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n    const style = {\n        ...cssVars,\n        ...cssGridStyle,\n        // create a new stacking context so our internal z-indexes don't effect external components\n        // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n        opacity: 0.999,\n    };\n\n    const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n    const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n    return (\n        <>\n            {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n            <Toolbar\n                table={table}\n                tableProps={props}\n                total={length}\n                left={toolbarLeft}\n                right={toolbarRight}\n                scrollToIndex={scrollToIndex}\n            />\n            <div\n                className={className}\n                id={props.id}\n                data-font-size={tableMeta.fontSize.size}\n                data-editing={tableMeta.editing.isEditing}\n                data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n                data-pause-hover={tableMeta?.hoverState.isPaused}\n                data-resizing={!!state.columnSizingInfo.isResizingColumn}\n                data-taco=\"table2\"\n                onBlur={handleBlur}\n                onScroll={handleScroll}\n                ref={internalRef}\n                role=\"table\"\n                style={style}>\n                {isServerLoadingAndNotReady ? null : (\n                    <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n                        {table.getHeaderGroups().map(headerGroup => (\n                            <div className=\"contents\" key={headerGroup.id} role=\"row\">\n                                {headerGroup.headers.map(header => (\n                                    <React.Fragment key={header.id}>\n                                        {flexRender(header.column.columnDef.header, { ...header.getContext(), scrollToIndex })}\n                                    </React.Fragment>\n                                ))}\n                            </div>\n                        ))}\n                    </div>\n                )}\n                {table.getRowModel().rows.length ? (\n                    <>\n                        <FocusScope>\n                            <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\" ref={bodyRef}>\n                                {renderBody()}\n                            </div>\n                        </FocusScope>\n                        {/* This div makes sure that there is always a free space between the rows and footer when\n                        table height exceeds the cumulative height of all rows. See useCSSGrid.ts */}\n                        {/* By vertically translating the div a pixel down, we hide the div border below footer so that\n                        the footer border doesn't appear an extra pixel thick */}\n                        <div className=\"border-grey-300 col-span-full translate-y-px border-t\" />\n                        {tableMeta.enableFooter ? (\n                            <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n                                {table.getFooterGroups().map(footerGroup => (\n                                    <div className=\"contents\" key={footerGroup.id} role=\"row\">\n                                        {footerGroup.headers.map(footer => (\n                                            <React.Fragment key={footer.id}>\n                                                {flexRender(footer.column.columnDef.footer, footer.getContext())}\n                                            </React.Fragment>\n                                        ))}\n                                    </div>\n                                ))}\n                                {length ? (\n                                    <Summary currentLength={table.getRowModel().rows.length} length={length} table={table} />\n                                ) : null}\n                            </div>\n                        ) : null}\n                    </>\n                ) : (\n                    <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n                )}\n            </div>\n        </>\n    );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n    Column: typeof Column;\n};\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n    const stringifiedChildren = String(props.children);\n    // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n    // this is cheaper from a complexity perspective, and probably performance wise as well\n    const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n    return <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n    useTable3DataFetcher,\n    useTable3DataOptions,\n    useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n    Table3Ref,\n    Table3Props,\n    Table3Preset,\n    Table3Settings,\n    Table3SettingsHandler,\n    Table3RowHeight,\n    Table3FilterComparator,\n    Table3FilterHandler,\n    Table3LoadPageHandler,\n    Table3LoadAllHandler,\n    Table3RowGotoHandler,\n    Table3SortHandler,\n    Table3Shortcuts,\n    Table3ShortcutHandlerFn,\n    Table3ShortcutHandlerObject,\n    Table3FontSize,\n    Table3SortDirection,\n    Table3SortFn,\n    Table3RowActionRenderer,\n    Table3RowSelectionHandler,\n    Table3RowExpansionRenderer,\n    Table3RowDropHandler,\n    Table3RowDragHandler,\n    Table3RowClickHandler,\n    Table3ColumnProps,\n    Table3ColumnAlignment,\n    Table3ColumnDataType,\n    Table3ColumnHeaderMenu,\n    Table3ColumnClassNameHandler,\n    Table3ColumnFooterRenderer,\n    Table3ColumnRenderer,\n    Table3ColumnControlRenderer,\n    Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","fixedForwardRef","React","forwardRef","Table","Table3","props","ref","emptyState","EmptyState","toolbarLeft","toolbarRight","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","useEffect","autoFocus","_internalRef$current","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","bodyRef","useRef","handleKeyDown","event","target","dialog","closest","eventOriginatedFromCombobox","contains","hoverState","currentRow","getRowModel","rows","rowClick","rowSelection","editing","document","addEventListener","removeEventListener","handleBlur","handleScroll","columnFreezing","Promise","resolve","e","reject","className","cn","fontSize","size","style","cssGridStyle","useCssGrid","id","endsWith","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","isServerLoadingAndNotReady","isUsingServer","undefined","Toolbar","tableProps","total","left","right","isEditing","horizontallyScrolled","isPaused","columnSizingInfo","isResizingColumn","onBlur","onScroll","role","getHeaderGroups","map","headerGroup","key","headers","header","Fragment","flexRender","column","columnDef","getContext","FocusScope","enableFooter","getFooterGroups","footerGroup","footer","Summary","currentLength","stringifiedChildren","String","children","useMemo"],"mappings":"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"}

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

@@ -4,7 +4,7 @@ import { DisplayCell } from './DisplayCell.js';
 import { EditingCell } from './EditingCell.js';
 
 function Cell(props) {
-  var _rows$tableMeta$curre;
+  var _rows$currentRowIndex;
   const {
     column,
     row,
@@ -16,7 +16,8 @@ function Cell(props) {
   const rows = table.getRowModel().rows;
   const tableMeta = table.options.meta;
   const columnMeta = column.columnDef.meta;
-  const isCurrentRow = ((_rows$tableMeta$curre = rows[tableMeta.currentRow.currentRowIndex]) === null || _rows$tableMeta$curre === void 0 ? void 0 : _rows$tableMeta$curre.id) === row.id;
+  const currentRowIndex = tableMeta.currentRow.currentRowIndex;
+  const isCurrentRow = currentRowIndex !== undefined && ((_rows$currentRowIndex = rows[currentRowIndex]) === null || _rows$currentRowIndex === void 0 ? void 0 : _rows$currentRowIndex.id) === row.id;
   if (tableMeta.editing.isEditing && columnMeta.control && (isCurrentRow || isHoveredRow && !tableMeta.hoverState.isPaused)) {
     return /*#__PURE__*/React__default.createElement(EditingCell, Object.assign({}, props));
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { DisplayCell } from './DisplayCell';\nimport { EditingCell } from './EditingCell';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport type CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function Cell<TType = unknown>(props: CellProps<TType>) {\n    const { column, row, table } = props;\n    const { isHovered: isHoveredRow } = useRowContext();\n    const rows = table.getRowModel().rows;\n    const tableMeta = table.options.meta as TableMeta<unknown>;\n    const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n    const isCurrentRow = rows[tableMeta.currentRow.currentRowIndex]?.id === row.id;\n\n    if (tableMeta.editing.isEditing && columnMeta.control && (isCurrentRow || (isHoveredRow && !tableMeta.hoverState.isPaused))) {\n        return <EditingCell {...props} />;\n    }\n\n    return <DisplayCell {...props} />;\n}\n"],"names":["Cell","props","column","row","table","isHovered","isHoveredRow","useRowContext","rows","getRowModel","tableMeta","options","meta","columnMeta","columnDef","isCurrentRow","_rows$tableMeta$curre","currentRow","currentRowIndex","id","editing","isEditing","control","hoverState","isPaused","React","EditingCell","DisplayCell"],"mappings":";;;;;SAUgBA,IAAIA,CAAkBC,KAAuB;;EACzD,MAAM;IAAEC,MAAM;IAAEC,GAAG;IAAEC;GAAO,GAAGH,KAAK;EACpC,MAAM;IAAEI,SAAS,EAAEC;GAAc,GAAGC,aAAa,EAAE;EACnD,MAAMC,IAAI,GAAGJ,KAAK,CAACK,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA0B;EAC1D,MAAMC,UAAU,GAAGX,MAAM,CAACY,SAAS,CAACF,IAAkC;EAEtE,MAAMG,YAAY,GAAG,EAAAC,qBAAA,GAAAR,IAAI,CAACE,SAAS,CAACO,UAAU,CAACC,eAAe,CAAC,cAAAF,qBAAA,uBAA1CA,qBAAA,CAA4CG,EAAE,MAAKhB,GAAG,CAACgB,EAAE;EAE9E,IAAIT,SAAS,CAACU,OAAO,CAACC,SAAS,IAAIR,UAAU,CAACS,OAAO,KAAKP,YAAY,IAAKT,YAAY,IAAI,CAACI,SAAS,CAACa,UAAU,CAACC,QAAS,CAAC,EAAE;IACzH,oBAAOC,6BAACC,WAAW,oBAAKzB,KAAK,EAAI;;EAGrC,oBAAOwB,6BAACE,WAAW,oBAAK1B,KAAK,EAAI;AACrC;;;;"}
+{"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { DisplayCell } from './DisplayCell';\nimport { EditingCell } from './EditingCell';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport type CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function Cell<TType = unknown>(props: CellProps<TType>) {\n    const { column, row, table } = props;\n    const { isHovered: isHoveredRow } = useRowContext();\n    const rows = table.getRowModel().rows;\n    const tableMeta = table.options.meta as TableMeta<unknown>;\n    const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n    const currentRowIndex = tableMeta.currentRow.currentRowIndex;\n    const isCurrentRow =\n        currentRowIndex !== undefined && rows[currentRowIndex]?.id === row.id;\n\n    if (tableMeta.editing.isEditing && columnMeta.control && (isCurrentRow || (isHoveredRow && !tableMeta.hoverState.isPaused))) {\n        return <EditingCell {...props} />;\n    }\n\n    return <DisplayCell {...props} />;\n}\n"],"names":["Cell","props","column","row","table","isHovered","isHoveredRow","useRowContext","rows","getRowModel","tableMeta","options","meta","columnMeta","columnDef","currentRowIndex","currentRow","isCurrentRow","undefined","_rows$currentRowIndex","id","editing","isEditing","control","hoverState","isPaused","React","EditingCell","DisplayCell"],"mappings":";;;;;SAUgBA,IAAIA,CAAkBC,KAAuB;;EACzD,MAAM;IAAEC,MAAM;IAAEC,GAAG;IAAEC;GAAO,GAAGH,KAAK;EACpC,MAAM;IAAEI,SAAS,EAAEC;GAAc,GAAGC,aAAa,EAAE;EACnD,MAAMC,IAAI,GAAGJ,KAAK,CAACK,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA0B;EAC1D,MAAMC,UAAU,GAAGX,MAAM,CAACY,SAAS,CAACF,IAAkC;EAEtE,MAAMG,eAAe,GAAGL,SAAS,CAACM,UAAU,CAACD,eAAe;EAC5D,MAAME,YAAY,GACdF,eAAe,KAAKG,SAAS,IAAI,EAAAC,qBAAA,GAAAX,IAAI,CAACO,eAAe,CAAC,cAAAI,qBAAA,uBAArBA,qBAAA,CAAuBC,EAAE,MAAKjB,GAAG,CAACiB,EAAE;EAEzE,IAAIV,SAAS,CAACW,OAAO,CAACC,SAAS,IAAIT,UAAU,CAACU,OAAO,KAAKN,YAAY,IAAKX,YAAY,IAAI,CAACI,SAAS,CAACc,UAAU,CAACC,QAAS,CAAC,EAAE;IACzH,oBAAOC,6BAACC,WAAW,oBAAK1B,KAAK,EAAI;;EAGrC,oBAAOyB,6BAACE,WAAW,oBAAK3B,KAAK,EAAI;AACrC;;;;"}

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

@@ -20,7 +20,7 @@ function EditingCell(props) {
   }));
 }
 const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditingCell(props) {
-  var _tableMeta$editing$ge, _tableMeta$editing$ro, _rows$tableMeta$curre, _column$columnDef$met;
+  var _tableMeta$editing$ge, _tableMeta$editing$ro, _rows$currentRowIndex, _column$columnDef$met;
   const {
     cell,
     column,
@@ -72,7 +72,8 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
   // row move indicator
   const moveReason = (_tableMeta$editing$ro = tableMeta.editing.rowMoveReason[cell.column.id]) !== null && _tableMeta$editing$ro !== void 0 ? _tableMeta$editing$ro : null;
   const rows = table.getRowModel().rows;
-  const isCurrentRow = ((_rows$tableMeta$curre = rows[tableMeta.currentRow.currentRowIndex]) === null || _rows$tableMeta$curre === void 0 ? void 0 : _rows$tableMeta$curre.id) === row.id;
+  const currentRowIndex = tableMeta.currentRow.currentRowIndex;
+  const isCurrentRow = currentRowIndex !== undefined && ((_rows$currentRowIndex = rows[currentRowIndex]) === null || _rows$currentRowIndex === void 0 ? void 0 : _rows$currentRowIndex.id) === row.id;
   const mountNode = React__default.useMemo(() => {
     if (moveReason) {
       var _cellRef$current2, _cellRef$current2$par;

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 { 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 { useRowContext } from '../../rows/RowContext';\n\nexport type EditingCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function EditingCell<TType = unknown>(props: EditingCellProps<TType>) {\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 = props.table.options.meta as TableMeta<TType>;\n    return <MemoedEditingCell<TType> {...props} isHovered={isHovered} tableMeta={tableMeta} />;\n}\n\n// Memoization\nexport type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {\n    isHovered: boolean;\n    tableMeta: TableMeta<TType>;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n    const { cell, column, index, getValue, table, tableRef, row, isHovered, tableMeta } = props;\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    };\n\n    // row move indicator\n    const moveReason = tableMeta.editing.rowMoveReason[cell.column.id] ?? null;\n    const rows = table.getRowModel().rows;\n    const isCurrentRow = rows[tableMeta.currentRow.currentRowIndex]?.id === row.id;\n    const mountNode = React.useMemo(() => {\n        if (moveReason) {\n            return cellRef.current?.parentElement?.firstChild as Element | null;\n        }\n        return null;\n    }, [moveReason, cellRef]);\n\n    const removeMoveReason = () => {\n        tableMeta.editing.removeRowMoveReason(cell.column.id);\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 (!isCurrentRow) {\n            return;\n        }\n\n        if (hasChanged(getValue(), value)) {\n            const moveReason = getRowMoveReason(table, row.index, row.original, cell, value);\n            tableMeta.editing.setRowMoveReason({ [cell.column.id]: moveReason });\n        } else {\n            removeMoveReason();\n        }\n        return removeMoveReason;\n    }, [value]);\n\n    const controlRenderer = column.columnDef.meta?.control;\n\n    const className = cn(\n        '!px-[0.4375rem] py-[calc(var(--table3-row-padding)_-_0.06rem)]',\n        {\n            relative: (isCurrentRow || isHovered) && controlRenderer === 'textarea',\n            // Need to set higher z-index, so that the current row textarea (in expanded state, when positioned absolute) overlaps rows below,\n            // but at the same time it should not overlap the table headers which has z-10.\n            'z-[9]': isCurrentRow && controlRenderer === 'textarea',\n        },\n\n        // component overrides - grayscale for editing hover\n        '[[role=\"row\"][data-current=\"false\"]:hover_&>*]:!grayscale [[role=\"row\"][data-current=\"false\"]:hover_&_.bg-white]:!bg-grey-100',\n        // we alias to any because className conflicts with the Table2 definition,\n        // when Table2 is gone, remove this as any\n        typeof columnMeta.className === 'function' ? (columnMeta.className as any)(row.original) : columnMeta.className\n    );\n\n    return (\n        <>\n            {moveReason !== null && mountNode && (\n                <Indicator\n                    reason={moveReason}\n                    columnName={String(cell.column.columnDef.header)}\n                    mountNode={mountNode}\n                    validationErrors={[]}\n                />\n            )}\n            <div className={className} data-align={columnMeta.align} data-column-index={index} role=\"cell\" ref={cellRef}>\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                    isCurrentRow={isCurrentRow}\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) {\n    let rowMoveReason: IndicatorReason | null = null;\n    const { globalFilter } = table.getState();\n\n    const isFilteredByGlobalFilter = Object.values<unknown>({ ...rowValues, [cell.id]: newValue }).some(cellValue =>\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        globalFilterFn(String(cellValue), globalFilter ? String(globalFilter) : '')\n    );\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","isHovered","useRowContext","tableMeta","table","options","meta","React","MemoedEditingCell","memo","cell","column","index","getValue","tableRef","row","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","moveReason","_tableMeta$editing$ro","rowMoveReason","id","rows","getRowModel","isCurrentRow","_rows$tableMeta$curre","currentRow","currentRowIndex","mountNode","useMemo","_cellRef$current2","_cellRef$current2$par","parentElement","firstChild","removeMoveReason","removeRowMoveReason","useEffect","hasChanged","getRowMoveReason","original","setRowMoveReason","controlRenderer","_column$columnDef$met","control","className","cn","relative","Indicator","reason","columnName","String","header","validationErrors","align","role","ref","EditingControl","data","initialValue","onBlur","onFocus","onChange","rowIndex","rowValues","newValue","globalFilter","getState","isFilteredByGlobalFilter","Object","values","some","cellValue","globalFilterFn","IndicatorReason","SEARCH","getIsFiltered","columnFilterFn","getFilterValue","FILTER","getIsSorted","willRowMoveAfterSorting","_table$getState$sorti","sorting","find","s","desc","SORTING"],"mappings":";;;;;;;;;;SAiBgBA,WAAWA,CAAkBC,KAA8B;EACvE,MAAM;IAAEC;GAAW,GAAGC,aAAa,EAAE;;EAErC,MAAMC,SAAS,GAAGH,KAAK,CAACI,KAAK,CAACC,OAAO,CAACC,IAAwB;EAC9D,oBAAOC,6BAACC,iBAAiB,oBAAYR,KAAK;IAAEC,SAAS,EAAEA,SAAS;IAAEE,SAAS,EAAEA;KAAa;AAC9F;AAQA,MAAMK,iBAAiB,gBAAGD,cAAK,CAACE,IAAI,CAAC,SAASD,iBAAiBA,CAAkBR,KAAoC;;EACjH,MAAM;IAAEU,IAAI;IAAEC,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAET,KAAK;IAAEU,QAAQ;IAAEC,GAAG;IAAEd,SAAS;IAAEE;GAAW,GAAGH,KAAK;EAC3F,MAAMgB,UAAU,GAAGL,MAAM,CAACM,SAAS,CAACX,IAAkC;EAEtE,MAAMY,OAAO,GAAGX,cAAK,CAACY,MAAM,CAAiB,IAAI,CAAC;EAClD,MAAMC,UAAU,GAAGb,cAAK,CAACY,MAAM,CAAc,IAAI,CAAC;EAElD,MAAME,YAAY,GAAIC,KAAc,IAAKnB,SAAS,CAACoB,OAAO,CAACC,YAAY,CAACd,IAAI,EAAEY,KAAK,CAAC;EACpF,MAAMA,KAAK,IAAAG,qBAAA,GAAGtB,SAAS,CAACoB,OAAO,CAACG,YAAY,CAAChB,IAAI,CAAC,cAAAe,qBAAA,cAAAA,qBAAA,GAAIZ,QAAQ,EAAE;EAEhE,MAAMc,WAAW,GAAGC,KAAK;;;IAErB,MAAMC,iBAAiB,GAAG1B,SAAS,CAAC2B,cAAc,CAACD,iBAAiB;IACpE,MAAME,YAAY,GAAGjB,QAAQ,CAACkB,OAAO;IAErC,IAAID,YAAY,IAAIF,iBAAiB,KAAKI,SAAS,IAAIrB,KAAK,GAAGiB,iBAAiB,EAAE;MAAA,IAAAK,gBAAA;MAC9E,MAAMC,uBAAuB,GAAGC,wBAAwB,CAACP,iBAAiB,EAAEE,YAAY,CAAC;MACzF,MAAMM,QAAQ,IAAAH,gBAAA,GAAGhB,OAAO,CAACc,OAAO,cAAAE,gBAAA,uBAAfA,gBAAA,CAAiBI,qBAAqB,EAAE;MACzD,MAAMC,cAAc,GAAGJ,uBAAuB,aAAvBA,uBAAuB,uBAAvBA,uBAAuB,CAAEG,qBAAqB,EAAE;MACvE,MAAME,SAAS,GAAGT,YAAY,CAACO,qBAAqB,EAAE;;MAGtD,IAAID,QAAQ,IAAIE,cAAc,IAAIF,QAAQ,CAACI,IAAI,GAAGF,cAAc,CAACE,IAAI,GAAGF,cAAc,CAACG,KAAK,EAAE;QAC1F,MAAMC,kBAAkB,GAAGJ,cAAc,CAACE,IAAI,GAAGF,cAAc,CAACG,KAAK;QACrEX,YAAY,CAACa,QAAQ,CAACP,QAAQ,CAACI,IAAI,GAAGE,kBAAkB,EAAEZ,YAAY,CAACc,SAAS,CAAC;;OAEpF,MAAM,IAAIR,QAAQ,IAAIG,SAAS,IAAIH,QAAQ,CAACS,KAAK,GAAGN,SAAS,CAACM,KAAK,GAAGC,qBAAqB,EAAE;QAC1F,MAAMC,iCAAiC,GAAG,EAAE;QAC5CjB,YAAY,CAACa,QAAQ;;QAEjBb,YAAY,CAACkB,UAAU,GAAGF,qBAAqB,GAAGC,iCAAiC,EACnFjB,YAAY,CAACc,SAAS,CACzB;;;IAIT,KAAAK,aAAA,GAAItB,KAAK,CAACuB,MAAM,cAAAD,aAAA,eAAZA,aAAA,CAAcE,MAAM,EAAE;MACtBC,qBAAqB,CAAC;QAClBzB,KAAK,CAACuB,MAAM,CAACC,MAAM,EAAE;OACxB,CAAC;;GAET;EAED,MAAME,UAAU,GAAGA;IACfnD,SAAS,CAACoB,OAAO,CAACgC,oBAAoB,CAAC,KAAK,CAAC;GAChD;;EAGD,MAAMC,UAAU,IAAAC,qBAAA,GAAGtD,SAAS,CAACoB,OAAO,CAACmC,aAAa,CAAChD,IAAI,CAACC,MAAM,CAACgD,EAAE,CAAC,cAAAF,qBAAA,cAAAA,qBAAA,GAAI,IAAI;EAC1E,MAAMG,IAAI,GAAGxD,KAAK,CAACyD,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,YAAY,GAAG,EAAAC,qBAAA,GAAAH,IAAI,CAACzD,SAAS,CAAC6D,UAAU,CAACC,eAAe,CAAC,cAAAF,qBAAA,uBAA1CA,qBAAA,CAA4CJ,EAAE,MAAK5C,GAAG,CAAC4C,EAAE;EAC9E,MAAMO,SAAS,GAAG3D,cAAK,CAAC4D,OAAO,CAAC;IAC5B,IAAIX,UAAU,EAAE;MAAA,IAAAY,iBAAA,EAAAC,qBAAA;MACZ,QAAAD,iBAAA,GAAOlD,OAAO,CAACc,OAAO,cAAAoC,iBAAA,wBAAAC,qBAAA,GAAfD,iBAAA,CAAiBE,aAAa,cAAAD,qBAAA,uBAA9BA,qBAAA,CAAgCE,UAA4B;;IAEvE,OAAO,IAAI;GACd,EAAE,CAACf,UAAU,EAAEtC,OAAO,CAAC,CAAC;EAEzB,MAAMsD,gBAAgB,GAAGA;IACrBrE,SAAS,CAACoB,OAAO,CAACkD,mBAAmB,CAAC/D,IAAI,CAACC,MAAM,CAACgD,EAAE,CAAC;GACxD;EAEDpD,cAAK,CAACmE,SAAS,CAAC;;;IAGZ,IAAI,CAACZ,YAAY,EAAE;MACf;;IAGJ,IAAIa,UAAU,CAAC9D,QAAQ,EAAE,EAAES,KAAK,CAAC,EAAE;MAC/B,MAAMkC,UAAU,GAAGoB,gBAAgB,CAACxE,KAAK,EAAEW,GAAG,CAACH,KAAK,EAAEG,GAAG,CAAC8D,QAAQ,EAAEnE,IAAI,EAAEY,KAAK,CAAC;MAChFnB,SAAS,CAACoB,OAAO,CAACuD,gBAAgB,CAAC;QAAE,CAACpE,IAAI,CAACC,MAAM,CAACgD,EAAE,GAAGH;OAAY,CAAC;KACvE,MAAM;MACHgB,gBAAgB,EAAE;;IAEtB,OAAOA,gBAAgB;GAC1B,EAAE,CAAClD,KAAK,CAAC,CAAC;EAEX,MAAMyD,eAAe,IAAAC,qBAAA,GAAGrE,MAAM,CAACM,SAAS,CAACX,IAAI,cAAA0E,qBAAA,uBAArBA,qBAAA,CAAuBC,OAAO;EAEtD,MAAMC,SAAS,GAAGC,EAAE,CAChB,gEAAgE,EAChE;IACIC,QAAQ,EAAE,CAACtB,YAAY,IAAI7D,SAAS,KAAK8E,eAAe,KAAK,UAAU;;;IAGvE,OAAO,EAAEjB,YAAY,IAAIiB,eAAe,KAAK;GAChD;;EAGD,+HAA+H;;;EAG/H,OAAO/D,UAAU,CAACkE,SAAS,KAAK,UAAU,GAAIlE,UAAU,CAACkE,SAAiB,CAACnE,GAAG,CAAC8D,QAAQ,CAAC,GAAG7D,UAAU,CAACkE,SAAS,CAClH;EAED,oBACI3E,4DACKiD,UAAU,KAAK,IAAI,IAAIU,SAAS,iBAC7B3D,6BAAC8E,SAAS;IACNC,MAAM,EAAE9B,UAAU;IAClB+B,UAAU,EAAEC,MAAM,CAAC9E,IAAI,CAACC,MAAM,CAACM,SAAS,CAACwE,MAAM,CAAC;IAChDvB,SAAS,EAAEA,SAAS;IACpBwB,gBAAgB,EAAE;IAEzB,eACDnF;IAAK2E,SAAS,EAAEA,SAAS;kBAAclE,UAAU,CAAC2E,KAAK;yBAAqB/E,KAAK;IAAEgF,IAAI,EAAC,MAAM;IAACC,GAAG,EAAE3E;kBAChGX,6BAACuF,cAAc;IACXH,KAAK,EAAE3E,UAAU,CAAC2E,KAAK;IACvBhF,MAAM,EAAED,IAAI,CAACC,MAAM;IACnBoF,IAAI,EAAErF,IAAI,CAACK,GAAG,CAAC8D,QAAQ;IACvBmB,YAAY,EAAEnF,QAAQ,EAAE;IACxBoF,MAAM,EAAE3C,UAAU;IAClB4C,OAAO,EAAEvE,WAAW;IACpBwE,QAAQ,EAAE9E,YAAY;IACtBwE,GAAG,EAAEzE,UAAU;IACfhB,KAAK,EAAEA,KAAK;IACZU,QAAQ,EAAEA,QAAQ;IAClBQ,KAAK,EAAEA,KAAK;IACZZ,IAAI,EAAEA,IAAI;IACVoD,YAAY,EAAEA;IAChB,CACA,CACP;AAEX,CAAC,CAA2E;AAE5E,SAASc,gBAAgBA,CACrBxE,KAAmB,EACnBgG,QAAgB,EAChBC,SAAgB,EAChB3F,IAA0B,EAC1B4F,QAAa;;EAEb,IAAI5C,aAAa,GAA2B,IAAI;EAChD,MAAM;IAAE6C;GAAc,GAAGnG,KAAK,CAACoG,QAAQ,EAAE;EAEzC,MAAMC,wBAAwB,GAAGC,MAAM,CAACC,MAAM,CAAU;IAAE,GAAGN,SAAS;IAAE,CAAC3F,IAAI,CAACiD,EAAE,GAAG2C;GAAU,CAAC,CAACM,IAAI,CAACC,SAAS;;;EAGzGC,cAAc,CAACtB,MAAM,CAACqB,SAAS,CAAC,EAAEN,YAAY,GAAGf,MAAM,CAACe,YAAY,CAAC,GAAG,EAAE,CAAC,CAC9E;EAED,IAAI,CAACE,wBAAwB,EAAE;IAC3B/C,aAAa,GAAGqD,eAAe,CAACC,MAAM;GACzC,MAAM,IAAItG,IAAI,CAACC,MAAM,CAACsG,aAAa,EAAE,IAAI,CAACC,cAAc,CAACZ,QAAQ,EAAE5F,IAAI,CAACC,MAAM,CAACwG,cAAc,EAAuB,CAAC,EAAE;IACpHzD,aAAa,GAAGqD,eAAe,CAACK,MAAM;GACzC,MAAM,IACH,CAAC1D,aAAa,IACdhD,IAAI,CAACC,MAAM,CAAC0G,WAAW,EAAE,IACzBC,uBAAuB,CACnBhB,QAAQ,EACR5F,IAAI,EACJ0F,QAAQ,EACRhG,KAAK,CAACyD,WAAW,EAAE,CAACD,IAAI,EACxB,CAAC,GAAA2D,qBAAA,GAACnH,KAAK,CAACoG,QAAQ,EAAE,CAACgB,OAAO,CAACC,IAAI,CAACC,CAAC,IAAIA,CAAC,CAAC/D,EAAE,KAAKjD,IAAI,CAACC,MAAM,CAACgD,EAAE,CAAC,cAAA4D,qBAAA,eAA3DA,qBAAA,CAA6DI,IAAI,EACtE,EACH;IACEjE,aAAa,GAAGqD,eAAe,CAACa,OAAO;;EAG3C,OAAOlE,aAAa;AACxB;;;;"}
+{"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 { 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 { useRowContext } from '../../rows/RowContext';\n\nexport type EditingCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function EditingCell<TType = unknown>(props: EditingCellProps<TType>) {\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 = props.table.options.meta as TableMeta<TType>;\n    return <MemoedEditingCell<TType> {...props} isHovered={isHovered} tableMeta={tableMeta} />;\n}\n\n// Memoization\nexport type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {\n    isHovered: boolean;\n    tableMeta: TableMeta<TType>;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n    const { cell, column, index, getValue, table, tableRef, row, isHovered, tableMeta } = props;\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    };\n\n    // row move indicator\n    const moveReason = tableMeta.editing.rowMoveReason[cell.column.id] ?? null;\n    const rows = table.getRowModel().rows;\n    const currentRowIndex = tableMeta.currentRow.currentRowIndex;\n    const isCurrentRow =\n        currentRowIndex !== undefined && rows[currentRowIndex]?.id === row.id;\n    const mountNode = React.useMemo(() => {\n        if (moveReason) {\n            return cellRef.current?.parentElement?.firstChild as Element | null;\n        }\n        return null;\n    }, [moveReason, cellRef]);\n\n    const removeMoveReason = () => {\n        tableMeta.editing.removeRowMoveReason(cell.column.id);\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 (!isCurrentRow) {\n            return;\n        }\n\n        if (hasChanged(getValue(), value)) {\n            const moveReason = getRowMoveReason(table, row.index, row.original, cell, value);\n            tableMeta.editing.setRowMoveReason({ [cell.column.id]: moveReason });\n        } else {\n            removeMoveReason();\n        }\n        return removeMoveReason;\n    }, [value]);\n\n    const controlRenderer = column.columnDef.meta?.control;\n\n    const className = cn(\n        '!px-[0.4375rem] py-[calc(var(--table3-row-padding)_-_0.06rem)]',\n        {\n            relative: (isCurrentRow || isHovered) && controlRenderer === 'textarea',\n            // Need to set higher z-index, so that the current row textarea (in expanded state, when positioned absolute) overlaps rows below,\n            // but at the same time it should not overlap the table headers which has z-10.\n            'z-[9]': isCurrentRow && controlRenderer === 'textarea',\n        },\n\n        // component overrides - grayscale for editing hover\n        '[[role=\"row\"][data-current=\"false\"]:hover_&>*]:!grayscale [[role=\"row\"][data-current=\"false\"]:hover_&_.bg-white]:!bg-grey-100',\n        // we alias to any because className conflicts with the Table2 definition,\n        // when Table2 is gone, remove this as any\n        typeof columnMeta.className === 'function' ? (columnMeta.className as any)(row.original) : columnMeta.className\n    );\n\n    return (\n        <>\n            {moveReason !== null && mountNode && (\n                <Indicator\n                    reason={moveReason}\n                    columnName={String(cell.column.columnDef.header)}\n                    mountNode={mountNode}\n                    validationErrors={[]}\n                />\n            )}\n            <div className={className} data-align={columnMeta.align} data-column-index={index} role=\"cell\" ref={cellRef}>\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                    isCurrentRow={isCurrentRow}\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) {\n    let rowMoveReason: IndicatorReason | null = null;\n    const { globalFilter } = table.getState();\n\n    const isFilteredByGlobalFilter = Object.values<unknown>({ ...rowValues, [cell.id]: newValue }).some(cellValue =>\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        globalFilterFn(String(cellValue), globalFilter ? String(globalFilter) : '')\n    );\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","isHovered","useRowContext","tableMeta","table","options","meta","React","MemoedEditingCell","memo","cell","column","index","getValue","tableRef","row","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","moveReason","_tableMeta$editing$ro","rowMoveReason","id","rows","getRowModel","currentRowIndex","currentRow","isCurrentRow","_rows$currentRowIndex","mountNode","useMemo","_cellRef$current2","_cellRef$current2$par","parentElement","firstChild","removeMoveReason","removeRowMoveReason","useEffect","hasChanged","getRowMoveReason","original","setRowMoveReason","controlRenderer","_column$columnDef$met","control","className","cn","relative","Indicator","reason","columnName","String","header","validationErrors","align","role","ref","EditingControl","data","initialValue","onBlur","onFocus","onChange","rowIndex","rowValues","newValue","globalFilter","getState","isFilteredByGlobalFilter","Object","values","some","cellValue","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/styles.js

@@ -1,6 +1,7 @@
 import cn from 'classnames';
 
 const MIN_COLUMN_SIZE = 80; // accounts for padding and sort controls
+const PRINT_MIN_COLUMN_SIZE = 20; // while printing, it accounts for minimum width each column can take
 const getCellAlignmentClasses = (alignment = 'left') => {
   return cn({
     'justify-start text-left': alignment === 'left',
@@ -13,5 +14,5 @@ const getInputAppearanceClassnames = () => {
   return cn('[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none');
 };
 
-export { MIN_COLUMN_SIZE, getCellAlignmentClasses, getInputAppearanceClassnames };
+export { MIN_COLUMN_SIZE, PRINT_MIN_COLUMN_SIZE, getCellAlignmentClasses, getInputAppearanceClassnames };
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/Table3/components/columns/styles.ts"],"sourcesContent":["import cn from 'classnames';\nimport { Table3ColumnAlignment } from '../../types';\n\nexport const MIN_COLUMN_SIZE = 80; // accounts for padding and sort controls\n\nexport const getCellAlignmentClasses = (alignment: Table3ColumnAlignment = 'left') => {\n    return cn({\n        'justify-start text-left': alignment === 'left',\n        'justify-end text-right': alignment === 'right',\n        'justify-center text-center': alignment === 'center',\n    });\n};\n\n// Hiding input number spin buttons\nexport const getInputAppearanceClassnames = () => {\n    return cn(\n        '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none'\n    );\n};\n"],"names":["MIN_COLUMN_SIZE","getCellAlignmentClasses","alignment","cn","getInputAppearanceClassnames"],"mappings":";;MAGaA,eAAe,GAAG,GAAG;MAErBC,uBAAuB,GAAGA,CAACC,YAAmC,MAAM;EAC7E,OAAOC,EAAE,CAAC;IACN,yBAAyB,EAAED,SAAS,KAAK,MAAM;IAC/C,wBAAwB,EAAEA,SAAS,KAAK,OAAO;IAC/C,4BAA4B,EAAEA,SAAS,KAAK;GAC/C,CAAC;AACN;AAEA;MACaE,4BAA4B,GAAGA;EACxC,OAAOD,EAAE,CACL,sHAAsH,CACzH;AACL;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/Table3/components/columns/styles.ts"],"sourcesContent":["import cn from 'classnames';\nimport { Table3ColumnAlignment } from '../../types';\n\nexport const MIN_COLUMN_SIZE = 80; // accounts for padding and sort controls\nexport const PRINT_MIN_COLUMN_SIZE = 20; // while printing, it accounts for minimum width each column can take\n\nexport const getCellAlignmentClasses = (alignment: Table3ColumnAlignment = 'left') => {\n    return cn({\n        'justify-start text-left': alignment === 'left',\n        'justify-end text-right': alignment === 'right',\n        'justify-center text-center': alignment === 'center',\n    });\n};\n\n// Hiding input number spin buttons\nexport const getInputAppearanceClassnames = () => {\n    return cn(\n        '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none'\n    );\n};\n"],"names":["MIN_COLUMN_SIZE","PRINT_MIN_COLUMN_SIZE","getCellAlignmentClasses","alignment","cn","getInputAppearanceClassnames"],"mappings":";;MAGaA,eAAe,GAAG,GAAG;MACrBC,qBAAqB,GAAG,GAAG;MAE3BC,uBAAuB,GAAGA,CAACC,YAAmC,MAAM;EAC7E,OAAOC,EAAE,CAAC;IACN,yBAAyB,EAAED,SAAS,KAAK,MAAM;IAC/C,wBAAwB,EAAEA,SAAS,KAAK,OAAO;IAC/C,4BAA4B,EAAEA,SAAS,KAAK;GAC/C,CAAC;AACN;AAEA;MACaE,4BAA4B,GAAGA;EACxC,OAAOD,EAAE,CACL,sHAAsH,CACzH;AACL;;;;"}

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

@@ -2,7 +2,6 @@ import React__default from 'react';
 import cn from 'classnames';
 import { Icon } from '../../../Icon/Icon.js';
 import { useLocalization } from '../../../Provider/Localization.js';
-import { Button } from '../../../Button/Button.js';
 import { Checkbox } from '../../../Checkbox/Checkbox.js';
 import { Input } from '../../../Input/Input.js';
 import { Popover } from '../../../Popover/Popover.js';
@@ -43,9 +42,11 @@ const Column = /*#__PURE__*/React__default.forwardRef(function Column(props, ref
     onChange: () => column.toggleVisibility(!isVisible)
   }) : null);
 });
-function ColumnSettings(props) {
+function ColumnSettingsPopover(props) {
   const {
-    table
+    table,
+    trigger,
+    ...popoverProps
   } = props;
   const {
     texts
@@ -67,39 +68,37 @@ function ColumnSettings(props) {
     }
     table.setColumnOrder(currentOrder => ensureOrdering(allColumns, arrayMove(currentOrder, currentOrder.findIndex(c => c === activeId), currentOrder.findIndex(c => c === overId))));
   };
-  return /*#__PURE__*/React__default.createElement(Button, {
-    popover: popoverProps => /*#__PURE__*/React__default.createElement(Popover, Object.assign({}, popoverProps), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement("div", {
-      className: "flex w-60 flex-col gap-2"
-    }, table.options.enableHiding ? /*#__PURE__*/React__default.createElement(Input, {
-      onChange: event => setQuery(event.target.value),
-      placeholder: texts.table3.columnSettings.search,
-      value: query
-    }) : null, tableMeta.columnOrdering.isEnabled && columns.length && !(query !== null && query !== void 0 && query.length) ? /*#__PURE__*/React__default.createElement(Container, {
-      reorder: handleReorder
-    }, /*#__PURE__*/React__default.createElement(List, {
-      id: "columns",
-      className: listClassName
-    }, columns.map(column => {
-      var _column$columnDef$met4, _column$columnDef$met5;
-      return /*#__PURE__*/React__default.createElement(Item, {
-        key: column.id,
-        id: column.id,
-        disabled: !((_column$columnDef$met4 = column.columnDef.meta) !== null && _column$columnDef$met4 !== void 0 && _column$columnDef$met4.enableOrdering),
-        asChild: true
-      }, /*#__PURE__*/React__default.createElement(Column, {
-        column: column,
-        draggable: (_column$columnDef$met5 = column.columnDef.meta) === null || _column$columnDef$met5 === void 0 ? void 0 : _column$columnDef$met5.enableOrdering
-      }));
-    }))) : /*#__PURE__*/React__default.createElement("div", {
-      className: listClassName
-    }, columns.length ? columns.map(column => /*#__PURE__*/React__default.createElement(Column, {
+  return /*#__PURE__*/React__default.createElement(Popover, Object.assign({}, popoverProps, {
+    anchor: trigger
+  }), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex w-60 flex-col gap-2"
+  }, table.options.enableHiding ? /*#__PURE__*/React__default.createElement(Input, {
+    onChange: event => setQuery(event.target.value),
+    placeholder: texts.table3.columnSettings.search,
+    value: query
+  }) : null, tableMeta.columnOrdering.isEnabled && columns.length && !(query !== null && query !== void 0 && query.length) ? /*#__PURE__*/React__default.createElement(Container, {
+    reorder: handleReorder
+  }, /*#__PURE__*/React__default.createElement(List, {
+    id: "columns",
+    className: listClassName
+  }, columns.map(column => {
+    var _column$columnDef$met4, _column$columnDef$met5;
+    return /*#__PURE__*/React__default.createElement(Item, {
+      key: column.id,
+      id: column.id,
+      disabled: !((_column$columnDef$met4 = column.columnDef.meta) !== null && _column$columnDef$met4 !== void 0 && _column$columnDef$met4.enableOrdering),
+      asChild: true
+    }, /*#__PURE__*/React__default.createElement(Column, {
       column: column,
-      key: column.id
-    })) : texts.table3.columnSettings.noResults))))
-  }, /*#__PURE__*/React__default.createElement(Icon, {
-    name: "columns"
-  }), texts.table3.columnSettings.button);
+      draggable: (_column$columnDef$met5 = column.columnDef.meta) === null || _column$columnDef$met5 === void 0 ? void 0 : _column$columnDef$met5.enableOrdering
+    }));
+  }))) : /*#__PURE__*/React__default.createElement("div", {
+    className: listClassName
+  }, columns.length ? columns.map(column => /*#__PURE__*/React__default.createElement(Column, {
+    column: column,
+    key: column.id
+  })) : texts.table3.columnSettings.noResults))));
 }
 
-export { ColumnSettings };
+export { ColumnSettingsPopover };
 //# sourceMappingURL=ColumnSettings.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ColumnSettings.js","sources":["../../../../../../../../../src/components/Table3/components/toolbar/ColumnSettings.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn, TableMeta } from '@tanstack/react-table';\nimport { isInternalColumn } from '../../util/columns';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Checkbox } from '../../../Checkbox/Checkbox';\nimport { Popover } from '../../../Popover/Popover';\nimport { Input } from '../../../Input/Input';\nimport * as SortablePrimitive from '../../../../primitives/Sortable/Sortable';\nimport { Icon } from '../../../Icon/Icon';\nimport { ensureOrdering } from '../../hooks/features/useColumnOrdering';\nimport { Button } from '../../../Button/Button';\n\ntype ColumnProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    column: RTColumn<TType, unknown>;\n    draggable?: boolean;\n};\n\nconst Column = React.forwardRef(function Column<TType = unknown>(props: ColumnProps<TType>, ref: React.Ref<HTMLDivElement>) {\n    const { column, draggable = false, ...dragAttributes } = props;\n    const canHide = column.getCanHide();\n\n    const className = cn('group/column flex items-center gap-x-2 rounded py-1 px-2', {\n        'hover:bg-grey-200': canHide || draggable,\n        'hover:cursor-pointer': canHide,\n        'active:cursor-move active:bg-grey-300': draggable,\n    });\n\n    const attributes = draggable ? dragAttributes : undefined;\n    const isVisible = column.getIsVisible();\n\n    return (\n        <div {...attributes} key={column.id} className={className} onClick={() => column.toggleVisibility(!isVisible)} ref={ref}>\n            {draggable ? <Icon name=\"drag\" className=\"text-grey-500 group-hover/column:text-grey-700 -mx-2 !h-5\" /> : null}\n            <span className=\"flex-grow truncate\">{column.columnDef.meta?.header}</span>\n            {canHide ? <Checkbox checked={isVisible} onChange={() => column.toggleVisibility(!isVisible)} /> : null}\n        </div>\n    );\n});\n\nexport type ColumnSettingsProps<TType = unknown> = {\n    table: RTable<TType>;\n};\n\nexport function ColumnSettings<TType = unknown>(props: ColumnSettingsProps<TType>) {\n    const { table } = props;\n    const { texts } = useLocalization();\n    const [query, setQuery] = React.useState('');\n    const allColumns = table.getAllLeafColumns();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columns = React.useMemo(\n        () =>\n            allColumns\n                .filter(column => !isInternalColumn(column.id))\n                .filter(column =>\n                    query?.length ? column.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase()) : true\n                ),\n        [allColumns, query]\n    );\n\n    const listClassName = 'flex max-h-64 flex-col gap-y-px overflow-auto';\n\n    const handleReorder = (activeId, overId) => {\n        if (columns.find(column => column.id === overId && column.columnDef.meta?.enableOrdering === false)) {\n            return;\n        }\n\n        table.setColumnOrder(currentOrder =>\n            ensureOrdering(\n                allColumns,\n                SortablePrimitive.arrayMove(\n                    currentOrder,\n                    currentOrder.findIndex(c => c === activeId),\n                    currentOrder.findIndex(c => c === overId)\n                )\n            )\n        );\n    };\n\n    return (\n        <Button\n            popover={popoverProps => (\n                <Popover {...popoverProps}>\n                    <Popover.Content>\n                        <div className=\"flex w-60 flex-col gap-2\">\n                            {table.options.enableHiding ? (\n                                <Input\n                                    onChange={event => setQuery(event.target.value)}\n                                    placeholder={texts.table3.columnSettings.search}\n                                    value={query}\n                                />\n                            ) : null}\n                            {tableMeta.columnOrdering.isEnabled && columns.length && !query?.length ? (\n                                <SortablePrimitive.Container reorder={handleReorder}>\n                                    <SortablePrimitive.List id=\"columns\" className={listClassName}>\n                                        {columns.map(column => (\n                                            <SortablePrimitive.Item\n                                                key={column.id}\n                                                id={column.id}\n                                                disabled={!column.columnDef.meta?.enableOrdering}\n                                                asChild>\n                                                <Column\n                                                    column={column as any}\n                                                    draggable={column.columnDef.meta?.enableOrdering}\n                                                />\n                                            </SortablePrimitive.Item>\n                                        ))}\n                                    </SortablePrimitive.List>\n                                </SortablePrimitive.Container>\n                            ) : (\n                                <div className={listClassName}>\n                                    {columns.length\n                                        ? columns.map(column => <Column column={column as any} key={column.id} />)\n                                        : texts.table3.columnSettings.noResults}\n                                </div>\n                            )}\n                        </div>\n                    </Popover.Content>\n                </Popover>\n            )}>\n            <Icon name=\"columns\" />\n            {texts.table3.columnSettings.button}\n        </Button>\n    );\n}\n"],"names":["Column","React","forwardRef","props","ref","column","draggable","dragAttributes","canHide","getCanHide","className","cn","attributes","undefined","isVisible","getIsVisible","key","id","onClick","toggleVisibility","Icon","name","columnDef","meta","_column$columnDef$met","header","Checkbox","checked","onChange","ColumnSettings","table","texts","useLocalization","query","setQuery","useState","allColumns","getAllLeafColumns","tableMeta","options","columns","useMemo","filter","isInternalColumn","_column$columnDef$met2","length","toLowerCase","includes","listClassName","handleReorder","activeId","overId","find","_column$columnDef$met3","enableOrdering","setColumnOrder","currentOrder","ensureOrdering","SortablePrimitive","findIndex","c","Button","popover","popoverProps","Popover","Content","enableHiding","Input","event","target","value","placeholder","table3","columnSettings","search","columnOrdering","isEnabled","reorder","map","_column$columnDef$met4","_column$columnDef$met5","disabled","asChild","noResults","button"],"mappings":"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"}
+{"version":3,"file":"ColumnSettings.js","sources":["../../../../../../../../../src/components/Table3/components/toolbar/ColumnSettings.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn, TableMeta } from '@tanstack/react-table';\nimport { isInternalColumn } from '../../util/columns';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Checkbox } from '../../../Checkbox/Checkbox';\nimport { Popover, PopoverProps } from '../../../Popover/Popover';\nimport { Input } from '../../../Input/Input';\nimport * as SortablePrimitive from '../../../../primitives/Sortable/Sortable';\nimport { Icon } from '../../../Icon/Icon';\nimport { ensureOrdering } from '../../hooks/features/useColumnOrdering';\n\ntype ColumnProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    column: RTColumn<TType, unknown>;\n    draggable?: boolean;\n};\n\nconst Column = React.forwardRef(function Column<TType = unknown>(props: ColumnProps<TType>, ref: React.Ref<HTMLDivElement>) {\n    const { column, draggable = false, ...dragAttributes } = props;\n    const canHide = column.getCanHide();\n\n    const className = cn('group/column flex items-center gap-x-2 rounded py-1 px-2', {\n        'hover:bg-grey-200': canHide || draggable,\n        'hover:cursor-pointer': canHide,\n        'active:cursor-move active:bg-grey-300': draggable,\n    });\n\n    const attributes = draggable ? dragAttributes : undefined;\n    const isVisible = column.getIsVisible();\n\n    return (\n        <div {...attributes} key={column.id} className={className} onClick={() => column.toggleVisibility(!isVisible)} ref={ref}>\n            {draggable ? <Icon name=\"drag\" className=\"text-grey-500 group-hover/column:text-grey-700 -mx-2 !h-5\" /> : null}\n            <span className=\"flex-grow truncate\">{column.columnDef.meta?.header}</span>\n            {canHide ? <Checkbox checked={isVisible} onChange={() => column.toggleVisibility(!isVisible)} /> : null}\n        </div>\n    );\n});\n\nexport type ColumnSettingsProps<TType = unknown> = PopoverProps & {\n    table: RTable<TType>;\n};\n\nexport function ColumnSettingsPopover<TType = unknown>(props: ColumnSettingsProps<TType>) {\n    const { table, trigger, ...popoverProps } = props;\n    const { texts } = useLocalization();\n    const [query, setQuery] = React.useState('');\n    const allColumns = table.getAllLeafColumns();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columns = React.useMemo(\n        () =>\n            allColumns\n                .filter(column => !isInternalColumn(column.id))\n                .filter(column =>\n                    query?.length ? column.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase()) : true\n                ),\n        [allColumns, query]\n    );\n\n    const listClassName = 'flex max-h-64 flex-col gap-y-px overflow-auto';\n\n    const handleReorder = (activeId, overId) => {\n        if (columns.find(column => column.id === overId && column.columnDef.meta?.enableOrdering === false)) {\n            return;\n        }\n\n        table.setColumnOrder(currentOrder =>\n            ensureOrdering(\n                allColumns,\n                SortablePrimitive.arrayMove(\n                    currentOrder,\n                    currentOrder.findIndex(c => c === activeId),\n                    currentOrder.findIndex(c => c === overId)\n                )\n            )\n        );\n    };\n\n    return (\n        <Popover {...popoverProps} anchor={trigger}>\n            <Popover.Content>\n                <div className=\"flex w-60 flex-col gap-2\">\n                    {table.options.enableHiding ? (\n                        <Input\n                            onChange={event => setQuery(event.target.value)}\n                            placeholder={texts.table3.columnSettings.search}\n                            value={query}\n                        />\n                    ) : null}\n                    {tableMeta.columnOrdering.isEnabled && columns.length && !query?.length ? (\n                        <SortablePrimitive.Container reorder={handleReorder}>\n                            <SortablePrimitive.List id=\"columns\" className={listClassName}>\n                                {columns.map(column => (\n                                    <SortablePrimitive.Item\n                                        key={column.id}\n                                        id={column.id}\n                                        disabled={!column.columnDef.meta?.enableOrdering}\n                                        asChild>\n                                        <Column column={column as any} draggable={column.columnDef.meta?.enableOrdering} />\n                                    </SortablePrimitive.Item>\n                                ))}\n                            </SortablePrimitive.List>\n                        </SortablePrimitive.Container>\n                    ) : (\n                        <div className={listClassName}>\n                            {columns.length\n                                ? columns.map(column => <Column column={column as any} key={column.id} />)\n                                : texts.table3.columnSettings.noResults}\n                        </div>\n                    )}\n                </div>\n            </Popover.Content>\n        </Popover>\n    );\n}\n"],"names":["Column","React","forwardRef","props","ref","column","draggable","dragAttributes","canHide","getCanHide","className","cn","attributes","undefined","isVisible","getIsVisible","key","id","onClick","toggleVisibility","Icon","name","columnDef","meta","_column$columnDef$met","header","Checkbox","checked","onChange","ColumnSettingsPopover","table","trigger","popoverProps","texts","useLocalization","query","setQuery","useState","allColumns","getAllLeafColumns","tableMeta","options","columns","useMemo","filter","isInternalColumn","_column$columnDef$met2","length","toLowerCase","includes","listClassName","handleReorder","activeId","overId","find","_column$columnDef$met3","enableOrdering","setColumnOrder","currentOrder","ensureOrdering","SortablePrimitive","findIndex","c","Popover","anchor","Content","enableHiding","Input","event","target","value","placeholder","table3","columnSettings","search","columnOrdering","isEnabled","reorder","map","_column$columnDef$met4","_column$columnDef$met5","disabled","asChild","noResults"],"mappings":"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"}

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

@@ -2,6 +2,7 @@ import React__default from 'react';
 import cn from 'classnames';
 import { Icon } from '../../../../../Icon/Icon.js';
 import { useGlobalKeyDown } from '../../../../../../hooks/useGlobalKeyDown.js';
+import { IconButton } from '../../../../../IconButton/IconButton.js';
 import { useLocalization } from '../../../../../Provider/Localization.js';
 import { Button } from '../../../../../Button/Button.js';
 import { Popover } from '../../../../../Popover/Popover.js';
@@ -11,12 +12,13 @@ import { isInternalColumn } from '../../../../util/columns.js';
 import { Table3FilterComparator } from '../../../../types.js';
 import { Placeholder } from './components/Placeholder.js';
 import { Filter } from './components/Filter.js';
+import { useIsLargeScreen } from '../../../../../../hooks/useIsLargeScreen.js';
 
 function sortByHeader(a, b) {
   var _a$columnDef$meta, _a$columnDef$meta$hea, _a$columnDef$meta$hea2, _b$columnDef$meta;
   return (_a$columnDef$meta = a.columnDef.meta) === null || _a$columnDef$meta === void 0 ? void 0 : (_a$columnDef$meta$hea = _a$columnDef$meta.header) === null || _a$columnDef$meta$hea === void 0 ? void 0 : (_a$columnDef$meta$hea2 = _a$columnDef$meta$hea.localeCompare) === null || _a$columnDef$meta$hea2 === void 0 ? void 0 : _a$columnDef$meta$hea2.call(_a$columnDef$meta$hea, (_b$columnDef$meta = b.columnDef.meta) === null || _b$columnDef$meta === void 0 ? void 0 : _b$columnDef$meta.header);
 }
-function Filters(props) {
+function FiltersButton(props) {
   const {
     total,
     table
@@ -26,6 +28,7 @@ function Filters(props) {
     texts
   } = useLocalization();
   const ref = React__default.useRef(null);
+  const isLargeScreen = useIsLargeScreen();
   const allColumns = table.getAllLeafColumns().filter(column => !isInternalColumn(column.id)).sort(sortByHeader);
   const appliedFilters = table.getState().columnFilters;
   useGlobalKeyDown({
@@ -88,8 +91,8 @@ function Filters(props) {
     setFilters([]);
     setPlaceholderCount(1);
   };
-  return /*#__PURE__*/React__default.createElement(Button, {
-    "aria-label": texts.table3.filters.tooltip,
+  const buttonProps = {
+    'aria-label': texts.table3.filters.tooltip,
     className: cn({
       '!wcag-blue-100': appliedFilters.length
     }),
@@ -133,7 +136,7 @@ function Filters(props) {
       appearance: "primary",
       onClick: handleApply
     }, "Apply"))))),
-    ref: ref,
+    ref,
     tooltip: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, texts.table3.filters.tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
       className: "ml-2",
       keys: {
@@ -142,10 +145,19 @@ function Filters(props) {
         shift: true
       }
     }))
-  }, /*#__PURE__*/React__default.createElement(Icon, {
+  };
+  if (!isLargeScreen && !appliedFilters.length) {
+    return /*#__PURE__*/React__default.createElement(IconButton, Object.assign({}, buttonProps, {
+      icon: "filter"
+    }));
+  }
+  return /*#__PURE__*/React__default.createElement(Button, Object.assign({}, buttonProps), /*#__PURE__*/React__default.createElement(Icon, {
+    className: cn({
+      '-mr-1.5': !isLargeScreen
+    }),
     name: appliedFilters.length ? 'filter-solid' : 'filter'
-  }), texts.table3.filters.button, " ", appliedFilters.length ? `(${appliedFilters.length})` : '');
+  }), isLargeScreen ? texts.table3.filters.button : '', appliedFilters.length ? `(${appliedFilters.length})` : '');
 }
 
-export { Filters };
+export { FiltersButton };
 //# sourceMappingURL=Filters.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Filters.js","sources":["../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/Filters.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn } from '@tanstack/react-table';\nimport { Button } from '../../../../../Button/Button';\nimport { Icon } from '../../../../../Icon/Icon';\nimport { Popover } from '../../../../../Popover/Popover';\nimport { Table3FilterValue, Table3FilterComparator, Table3Filter } from '../../../../types';\nimport { Shortcut } from '../../../../../Shortcut/Shortcut';\nimport { useGlobalKeyDown } from '../../../../../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { isInternalColumn } from '../../../../util/columns';\nimport { Placeholder } from './components/Placeholder';\nimport { Filter } from './components/Filter';\nimport { Group } from '../../../../../Group/Group';\n\nfunction sortByHeader<TType = unknown>(a: RTColumn<TType>, b: RTColumn<TType>) {\n    return (a.columnDef.meta?.header as string)?.localeCompare?.(b.columnDef.meta?.header as string);\n}\n\nexport type FiltersProps<TType = unknown> = {\n    total: number;\n    table: RTable<TType>;\n};\n\nexport function Filters<TType = unknown>(props: FiltersProps<TType>) {\n    const { total, table } = props;\n    const { locale, texts } = useLocalization();\n    const ref = React.useRef<HTMLButtonElement>(null);\n    const allColumns = table\n        .getAllLeafColumns()\n        .filter(column => !isInternalColumn(column.id))\n        .sort(sortByHeader);\n    const appliedFilters = table.getState().columnFilters;\n\n    useGlobalKeyDown({ key: 'f', meta: true, shift: true }, (event: KeyboardEvent) => {\n        event.preventDefault();\n        ref.current?.click();\n    });\n\n    // state, since we \"apply\" filters\n    const [filters, setFilters] = React.useState<Table3Filter[]>(table.getState().columnFilters as Table3Filter[]);\n    const [placeholderCount, setPlaceholderCount] = React.useState(1);\n\n    // filters\n    const handleChangeFilter = (currentId: string, filter: { id: string; value: Table3FilterValue }) => {\n        setFilters(currentFilters => {\n            const nextFilters = [...currentFilters];\n            const index = nextFilters.findIndex(f => f.id === currentId);\n            nextFilters[index] = filter;\n            return nextFilters;\n        });\n    };\n\n    const handleRemoveFilter = (columnId: string) => {\n        if (filters.length === 1 && placeholderCount === 0) {\n            setPlaceholderCount(count => count + 1);\n        }\n\n        setFilters(currentFilters => currentFilters.filter(f => f.id !== columnId));\n    };\n\n    // placeholders\n    const handleCreateFilterFromPlaceholder = (columnId: string) => {\n        setFilters(currentFilters => [\n            ...currentFilters,\n            {\n                id: columnId,\n                value: {\n                    comparator: Table3FilterComparator.Contains,\n                    value: undefined,\n                },\n            },\n        ]);\n        handleRemovePlaceholder();\n    };\n\n    const handleCreatePlaceholder = () => {\n        setPlaceholderCount(count => count + 1);\n    };\n\n    const handleRemovePlaceholder = () => {\n        setPlaceholderCount(count => count - 1);\n    };\n\n    //\n    const handleApply = () => {\n        table.setColumnFilters(\n            filters.filter(f => {\n                const controlRenderer = (allColumns.find(c => c.id === f.id) as RTColumn<TType, unknown>).columnDef.meta?.control;\n                if (\n                    f.value.comparator === Table3FilterComparator.IsEmpty ||\n                    f.value.comparator === Table3FilterComparator.IsNotEmpty ||\n                    controlRenderer === 'switch'\n                ) {\n                    return true;\n                }\n                return !!f.value.value;\n            })\n        );\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([]);\n        setPlaceholderCount(1);\n    };\n\n    return (\n        <Button\n            aria-label={texts.table3.filters.tooltip}\n            className={cn({\n                '!wcag-blue-100': appliedFilters.length,\n            })}\n            popover={popoverProps => (\n                <Popover {...popoverProps}>\n                    <Popover.Content>\n                        <div className=\"flex w-[40rem] flex-col gap-4\">\n                            <div className=\"flex h-8\">\n                                <div className=\"flex w-full items-center gap-2\">\n                                    <h4 className=\"mb-0 inline-flex\">{texts.table3.filters.button}</h4>\n                                    <p className=\"text-grey-700 mb-0 mr-auto mt-px inline-flex\">\n                                        {texts.table3.filters.total\n                                            .replace(\n                                                '[CURRENT]',\n                                                new Intl.NumberFormat(locale).format(table.getFilteredRowModel().rows.length)\n                                            )\n                                            .replace('[TOTAL]', new Intl.NumberFormat(locale).format(total))}\n                                    </p>\n                                </div>\n                            </div>\n                            <div className=\"flex flex-col gap-2\">\n                                {filters.map((filter, index) => (\n                                    <Filter\n                                        key={`filter_${index}`}\n                                        allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                        filter={filter}\n                                        filters={filters}\n                                        position={index}\n                                        onChange={handleChangeFilter}\n                                        onRemove={handleRemoveFilter}\n                                    />\n                                ))}\n                                {[...Array(placeholderCount)].map((_, index) => (\n                                    <Placeholder\n                                        key={`placeholder_${index}`}\n                                        allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                        filters={filters}\n                                        position={filters.length + index}\n                                        onCreate={handleCreateFilterFromPlaceholder as any}\n                                        onRemove={\n                                            placeholderCount > 1 || filters.length > 0 ? handleRemovePlaceholder : undefined\n                                        }\n                                    />\n                                ))}\n                                <div className=\"justify-start\">\n                                    <Button appearance=\"discrete\" onClick={handleCreatePlaceholder}>\n                                        + {texts.table3.filters.buttons.addFilter}\n                                    </Button>\n                                </div>\n                            </div>\n                            <Group className=\"ml-auto\">\n                                <Popover.Close>\n                                    <Button>Cancel</Button>\n                                </Popover.Close>\n                                <Button onClick={handleClear}>Clear</Button>\n                                <Button appearance=\"primary\" onClick={handleApply}>\n                                    Apply\n                                </Button>\n                            </Group>\n                        </div>\n                    </Popover.Content>\n                </Popover>\n            )}\n            ref={ref}\n            tooltip={\n                <>\n                    {texts.table3.filters.tooltip}\n                    <Shortcut className=\"ml-2\" keys={{ key: 'f', meta: true, shift: true }} />\n                </>\n            }>\n            <Icon name={appliedFilters.length ? 'filter-solid' : 'filter'} />\n            {texts.table3.filters.button} {appliedFilters.length ? `(${appliedFilters.length})` : ''}\n        </Button>\n    );\n}\n"],"names":["sortByHeader","a","b","_a$columnDef$meta","columnDef","meta","_a$columnDef$meta$hea","header","_a$columnDef$meta$hea2","localeCompare","call","_b$columnDef$meta","Filters","props","total","table","locale","texts","useLocalization","ref","React","useRef","allColumns","getAllLeafColumns","filter","column","isInternalColumn","id","sort","appliedFilters","getState","columnFilters","useGlobalKeyDown","key","shift","event","preventDefault","_ref$current","current","click","filters","setFilters","useState","placeholderCount","setPlaceholderCount","handleChangeFilter","currentId","currentFilters","nextFilters","index","findIndex","f","handleRemoveFilter","columnId","length","count","handleCreateFilterFromPlaceholder","value","comparator","Table3FilterComparator","Contains","undefined","handleRemovePlaceholder","handleCreatePlaceholder","handleApply","setColumnFilters","controlRenderer","_allColumns$find$colu","find","c","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","Button","table3","tooltip","className","cn","popover","popoverProps","Popover","Content","button","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","map","Filter","position","onChange","onRemove","Array","_","Placeholder","onCreate","appearance","onClick","buttons","addFilter","Group","Close","Shortcut","keys","Icon","name"],"mappings":"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"}
+{"version":3,"file":"Filters.js","sources":["../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/Filters.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn } from '@tanstack/react-table';\nimport { Button } from '../../../../../Button/Button';\nimport { Icon } from '../../../../../Icon/Icon';\nimport { Popover } from '../../../../../Popover/Popover';\nimport { Table3FilterValue, Table3FilterComparator, Table3Filter } from '../../../../types';\nimport { Shortcut } from '../../../../../Shortcut/Shortcut';\nimport { useGlobalKeyDown } from '../../../../../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { isInternalColumn } from '../../../../util/columns';\nimport { Placeholder } from './components/Placeholder';\nimport { Filter } from './components/Filter';\nimport { Group } from '../../../../../Group/Group';\nimport { useIsLargeScreen } from '../../../../../../hooks/useIsLargeScreen';\nimport { IconButton } from '../../../../../IconButton/IconButton';\n\nfunction sortByHeader<TType = unknown>(a: RTColumn<TType>, b: RTColumn<TType>) {\n    return (a.columnDef.meta?.header as string)?.localeCompare?.(b.columnDef.meta?.header as string);\n}\n\nexport type FiltersProps<TType = unknown> = {\n    total: number;\n    table: RTable<TType>;\n};\n\nexport function FiltersButton<TType = unknown>(props: FiltersProps<TType>) {\n    const { total, table } = props;\n    const { locale, texts } = useLocalization();\n    const ref = React.useRef<HTMLButtonElement>(null);\n    const isLargeScreen = useIsLargeScreen();\n    const allColumns = table\n        .getAllLeafColumns()\n        .filter(column => !isInternalColumn(column.id))\n        .sort(sortByHeader);\n    const appliedFilters = table.getState().columnFilters;\n\n    useGlobalKeyDown({ key: 'f', meta: true, shift: true }, (event: KeyboardEvent) => {\n        event.preventDefault();\n        ref.current?.click();\n    });\n\n    // state, since we \"apply\" filters\n    const [filters, setFilters] = React.useState<Table3Filter[]>(table.getState().columnFilters as Table3Filter[]);\n    const [placeholderCount, setPlaceholderCount] = React.useState(1);\n\n    // filters\n    const handleChangeFilter = (currentId: string, filter: { id: string; value: Table3FilterValue }) => {\n        setFilters(currentFilters => {\n            const nextFilters = [...currentFilters];\n            const index = nextFilters.findIndex(f => f.id === currentId);\n            nextFilters[index] = filter;\n            return nextFilters;\n        });\n    };\n\n    const handleRemoveFilter = (columnId: string) => {\n        if (filters.length === 1 && placeholderCount === 0) {\n            setPlaceholderCount(count => count + 1);\n        }\n\n        setFilters(currentFilters => currentFilters.filter(f => f.id !== columnId));\n    };\n\n    // placeholders\n    const handleCreateFilterFromPlaceholder = (columnId: string) => {\n        setFilters(currentFilters => [\n            ...currentFilters,\n            {\n                id: columnId,\n                value: {\n                    comparator: Table3FilterComparator.Contains,\n                    value: undefined,\n                },\n            },\n        ]);\n        handleRemovePlaceholder();\n    };\n\n    const handleCreatePlaceholder = () => {\n        setPlaceholderCount(count => count + 1);\n    };\n\n    const handleRemovePlaceholder = () => {\n        setPlaceholderCount(count => count - 1);\n    };\n\n    //\n    const handleApply = () => {\n        table.setColumnFilters(\n            filters.filter(f => {\n                const controlRenderer = (allColumns.find(c => c.id === f.id) as RTColumn<TType, unknown>).columnDef.meta?.control;\n                if (\n                    f.value.comparator === Table3FilterComparator.IsEmpty ||\n                    f.value.comparator === Table3FilterComparator.IsNotEmpty ||\n                    controlRenderer === 'switch'\n                ) {\n                    return true;\n                }\n                return !!f.value.value;\n            })\n        );\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([]);\n        setPlaceholderCount(1);\n    };\n\n    const buttonProps = {\n        'aria-label': texts.table3.filters.tooltip,\n        className: cn({ '!wcag-blue-100': appliedFilters.length }),\n        popover: popoverProps => (\n            <Popover {...popoverProps}>\n                <Popover.Content>\n                    <div className=\"flex w-[40rem] flex-col gap-4\">\n                        <div className=\"flex h-8\">\n                            <div className=\"flex w-full items-center gap-2\">\n                                <h4 className=\"mb-0 inline-flex\">{texts.table3.filters.button}</h4>\n                                <p className=\"text-grey-700 mb-0 mr-auto mt-px inline-flex\">\n                                    {texts.table3.filters.total\n                                        .replace(\n                                            '[CURRENT]',\n                                            new Intl.NumberFormat(locale).format(table.getFilteredRowModel().rows.length)\n                                        )\n                                        .replace('[TOTAL]', new Intl.NumberFormat(locale).format(total))}\n                                </p>\n                            </div>\n                        </div>\n                        <div className=\"flex flex-col gap-2\">\n                            {filters.map((filter, index) => (\n                                <Filter\n                                    key={`filter_${index}`}\n                                    allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                    filter={filter}\n                                    filters={filters}\n                                    position={index}\n                                    onChange={handleChangeFilter}\n                                    onRemove={handleRemoveFilter}\n                                />\n                            ))}\n                            {[...Array(placeholderCount)].map((_, index) => (\n                                <Placeholder\n                                    key={`placeholder_${index}`}\n                                    allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                    filters={filters}\n                                    position={filters.length + index}\n                                    onCreate={handleCreateFilterFromPlaceholder as any}\n                                    onRemove={placeholderCount > 1 || filters.length > 0 ? handleRemovePlaceholder : undefined}\n                                />\n                            ))}\n                            <div className=\"justify-start\">\n                                <Button appearance=\"discrete\" onClick={handleCreatePlaceholder}>\n                                    + {texts.table3.filters.buttons.addFilter}\n                                </Button>\n                            </div>\n                        </div>\n                        <Group className=\"ml-auto\">\n                            <Popover.Close>\n                                <Button>Cancel</Button>\n                            </Popover.Close>\n                            <Button onClick={handleClear}>Clear</Button>\n                            <Button appearance=\"primary\" onClick={handleApply}>\n                                Apply\n                            </Button>\n                        </Group>\n                    </div>\n                </Popover.Content>\n            </Popover>\n        ),\n        ref,\n        tooltip: (\n            <>\n                {texts.table3.filters.tooltip}\n                <Shortcut className=\"ml-2\" keys={{ key: 'f', meta: true, shift: true }} />\n            </>\n        ),\n    };\n\n    if (!isLargeScreen && !appliedFilters.length) {\n        return <IconButton {...buttonProps} icon=\"filter\" />;\n    }\n    return (\n        <Button {...buttonProps}>\n            <Icon className={cn({ '-mr-1.5': !isLargeScreen })} name={appliedFilters.length ? 'filter-solid' : 'filter'} />\n            {isLargeScreen ? texts.table3.filters.button : ''}\n            {appliedFilters.length ? `(${appliedFilters.length})` : ''}\n        </Button>\n    );\n}\n"],"names":["sortByHeader","a","b","_a$columnDef$meta","columnDef","meta","_a$columnDef$meta$hea","header","_a$columnDef$meta$hea2","localeCompare","call","_b$columnDef$meta","FiltersButton","props","total","table","locale","texts","useLocalization","ref","React","useRef","isLargeScreen","useIsLargeScreen","allColumns","getAllLeafColumns","filter","column","isInternalColumn","id","sort","appliedFilters","getState","columnFilters","useGlobalKeyDown","key","shift","event","preventDefault","_ref$current","current","click","filters","setFilters","useState","placeholderCount","setPlaceholderCount","handleChangeFilter","currentId","currentFilters","nextFilters","index","findIndex","f","handleRemoveFilter","columnId","length","count","handleCreateFilterFromPlaceholder","value","comparator","Table3FilterComparator","Contains","undefined","handleRemovePlaceholder","handleCreatePlaceholder","handleApply","setColumnFilters","controlRenderer","_allColumns$find$colu","find","c","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","buttonProps","table3","tooltip","className","cn","popover","popoverProps","Popover","Content","button","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","map","Filter","position","onChange","onRemove","Array","_","Placeholder","onCreate","Button","appearance","onClick","buttons","addFilter","Group","Close","Shortcut","keys","IconButton","icon","Icon","name"],"mappings":"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"}