@economic/taco 2.23.0 → 2.25.0

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

@@ -16,7 +16,7 @@ function Summary(props) {
   let label;
   let count;
   // row selection
-  const rowsSelectedLength = table.getIsAllRowsSelected() ? length : table.getSelectedRowModel().rows.length;
+  const rowsSelectedLength = table.getSelectedRowModel().rows.length;
   if (rowsSelectedLength > 0) {
     label = texts.table3.footer.summary.selected;
     count = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("strong", null, new Intl.NumberFormat(locale).format(rowsSelectedLength)), "\u00A0", texts.table3.footer.summary.count, "\u00A0", /*#__PURE__*/React__default.createElement("strong", null, new Intl.NumberFormat(locale).format(length)));

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

@@ -1 +1 @@
-{"version":3,"file":"Summary.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/footer/Summary.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as RTable, TableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../Provider/Localization';\n\nexport type FooterSummaryProps<TType = unknown> = {\n    currentLength: number;\n    length: number;\n    table: RTable<TType>;\n};\n\nexport function Summary<TType = unknown>(props: FooterSummaryProps<TType>) {\n    const { currentLength, length, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { locale, texts } = useLocalization();\n\n    let label;\n    let count;\n\n    // row selection\n    const rowsSelectedLength = table.getIsAllRowsSelected() ? length : table.getSelectedRowModel().rows.length;\n\n    if (rowsSelectedLength > 0) {\n        label = texts.table3.footer.summary.selected;\n        count = (\n            <>\n                <strong>{new Intl.NumberFormat(locale).format(rowsSelectedLength)}</strong>&nbsp;\n                {texts.table3.footer.summary.count}&nbsp;\n                <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n            </>\n        );\n    } else if (\n        table.getState().columnFilters?.length || // filtered data\n        // @ts-expect-error: fixing type issue while report and table3 TableMeta definitions live in parallel\n        (!!table.getState().globalFilter && tableMeta.search.excludeUnmatchedResults) // search with hide enabled\n    ) {\n        label = texts.table3.footer.summary.records;\n        count = (\n            <>\n                <strong>{currentLength}</strong>&nbsp;\n                {texts.table3.footer.summary.count}&nbsp;\n                <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n            </>\n        );\n    } else {\n        label = texts.table3.footer.summary.records;\n        count = <strong>{new Intl.NumberFormat(locale).format(length)}</strong>;\n    }\n\n    return (\n        <div\n            className=\"sticky bottom-0 left-0 z-40 -mt-10 flex h-10 w-fit items-center whitespace-nowrap bg-white px-4 !pr-3 shadow-[6px_0px_6px_theme(colors.white)]\"\n            data-taco=\"table2-footer-summary\">\n            {label}&nbsp;{count}\n        </div>\n    );\n}\n"],"names":["Summary","props","currentLength","length","table","tableMeta","options","meta","locale","texts","useLocalization","label","count","rowsSelectedLength","getIsAllRowsSelected","getSelectedRowModel","rows","table3","footer","summary","selected","React","Intl","NumberFormat","format","_table$getState$colum","getState","columnFilters","globalFilter","search","excludeUnmatchedResults","records","className"],"mappings":";;;SAUgBA,OAAOA,CAAkBC,KAAgC;;EACrE,MAAM;IAAEC,aAAa;IAAEC,MAAM;IAAEC;GAAO,GAAGH,KAAK;EAC9C,MAAMI,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAAwB;EACxD,MAAM;IAAEC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAE3C,IAAIC,KAAK;EACT,IAAIC,KAAK;;EAGT,MAAMC,kBAAkB,GAAGT,KAAK,CAACU,oBAAoB,EAAE,GAAGX,MAAM,GAAGC,KAAK,CAACW,mBAAmB,EAAE,CAACC,IAAI,CAACb,MAAM;EAE1G,IAAIU,kBAAkB,GAAG,CAAC,EAAE;IACxBF,KAAK,GAAGF,KAAK,CAACQ,MAAM,CAACC,MAAM,CAACC,OAAO,CAACC,QAAQ;IAC5CR,KAAK,gBACDS,yEACIA,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACf,MAAM,CAAC,CAACgB,MAAM,CAACX,kBAAkB,CAAC,CAAU,YAC1EJ,KAAK,CAACQ,MAAM,CAACC,MAAM,CAACC,OAAO,CAACP,KAAK,yBAClCS,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACf,MAAM,CAAC,CAACgB,MAAM,CAACrB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM,IACH,CAAAsB,qBAAA,GAAArB,KAAK,CAACsB,QAAQ,EAAE,CAACC,aAAa,cAAAF,qBAAA,eAA9BA,qBAAA,CAAgCtB,MAAM;;;EAErC,CAAC,CAACC,KAAK,CAACsB,QAAQ,EAAE,CAACE,YAAY,IAAIvB,SAAS,CAACwB,MAAM,CAACC,uBAAwB;IAC/E;IACEnB,KAAK,GAAGF,KAAK,CAACQ,MAAM,CAACC,MAAM,CAACC,OAAO,CAACY,OAAO;IAC3CnB,KAAK,gBACDS,yEACIA,6CAASnB,aAAa,CAAU,YAC/BO,KAAK,CAACQ,MAAM,CAACC,MAAM,CAACC,OAAO,CAACP,KAAK,yBAClCS,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACf,MAAM,CAAC,CAACgB,MAAM,CAACrB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM;IACHQ,KAAK,GAAGF,KAAK,CAACQ,MAAM,CAACC,MAAM,CAACC,OAAO,CAACY,OAAO;IAC3CnB,KAAK,gBAAGS,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACf,MAAM,CAAC,CAACgB,MAAM,CAACrB,MAAM,CAAC,CAAU;;EAG3E,oBACIkB;IACIW,SAAS,EAAC,gJAAgJ;iBAChJ;KACTrB,KAAK,YAAQC,KAAK,CACjB;AAEd;;;;"}
+{"version":3,"file":"Summary.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/footer/Summary.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as RTable, TableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../Provider/Localization';\n\nexport type FooterSummaryProps<TType = unknown> = {\n    currentLength: number;\n    length: number;\n    table: RTable<TType>;\n};\n\nexport function Summary<TType = unknown>(props: FooterSummaryProps<TType>) {\n    const { currentLength, length, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { locale, texts } = useLocalization();\n\n    let label;\n    let count;\n\n    // row selection\n    const rowsSelectedLength = table.getSelectedRowModel().rows.length;\n\n    if (rowsSelectedLength > 0) {\n        label = texts.table3.footer.summary.selected;\n        count = (\n            <>\n                <strong>{new Intl.NumberFormat(locale).format(rowsSelectedLength)}</strong>&nbsp;\n                {texts.table3.footer.summary.count}&nbsp;\n                <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n            </>\n        );\n    } else if (\n        table.getState().columnFilters?.length || // filtered data\n        // @ts-expect-error: fixing type issue while report and table3 TableMeta definitions live in parallel\n        (!!table.getState().globalFilter && tableMeta.search.excludeUnmatchedResults) // search with hide enabled\n    ) {\n        label = texts.table3.footer.summary.records;\n        count = (\n            <>\n                <strong>{currentLength}</strong>&nbsp;\n                {texts.table3.footer.summary.count}&nbsp;\n                <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n            </>\n        );\n    } else {\n        label = texts.table3.footer.summary.records;\n        count = <strong>{new Intl.NumberFormat(locale).format(length)}</strong>;\n    }\n\n    return (\n        <div\n            className=\"sticky bottom-0 left-0 z-40 -mt-10 flex h-10 w-fit items-center whitespace-nowrap bg-white px-4 !pr-3 shadow-[6px_0px_6px_theme(colors.white)]\"\n            data-taco=\"table2-footer-summary\">\n            {label}&nbsp;{count}\n        </div>\n    );\n}\n"],"names":["Summary","props","currentLength","length","table","tableMeta","options","meta","locale","texts","useLocalization","label","count","rowsSelectedLength","getSelectedRowModel","rows","table3","footer","summary","selected","React","Intl","NumberFormat","format","_table$getState$colum","getState","columnFilters","globalFilter","search","excludeUnmatchedResults","records","className"],"mappings":";;;SAUgBA,OAAOA,CAAkBC,KAAgC;;EACrE,MAAM;IAAEC,aAAa;IAAEC,MAAM;IAAEC;GAAO,GAAGH,KAAK;EAC9C,MAAMI,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAAwB;EACxD,MAAM;IAAEC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAE3C,IAAIC,KAAK;EACT,IAAIC,KAAK;;EAGT,MAAMC,kBAAkB,GAAGT,KAAK,CAACU,mBAAmB,EAAE,CAACC,IAAI,CAACZ,MAAM;EAElE,IAAIU,kBAAkB,GAAG,CAAC,EAAE;IACxBF,KAAK,GAAGF,KAAK,CAACO,MAAM,CAACC,MAAM,CAACC,OAAO,CAACC,QAAQ;IAC5CP,KAAK,gBACDQ,yEACIA,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACd,MAAM,CAAC,CAACe,MAAM,CAACV,kBAAkB,CAAC,CAAU,YAC1EJ,KAAK,CAACO,MAAM,CAACC,MAAM,CAACC,OAAO,CAACN,KAAK,yBAClCQ,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACd,MAAM,CAAC,CAACe,MAAM,CAACpB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM,IACH,CAAAqB,qBAAA,GAAApB,KAAK,CAACqB,QAAQ,EAAE,CAACC,aAAa,cAAAF,qBAAA,eAA9BA,qBAAA,CAAgCrB,MAAM;;;EAErC,CAAC,CAACC,KAAK,CAACqB,QAAQ,EAAE,CAACE,YAAY,IAAItB,SAAS,CAACuB,MAAM,CAACC,uBAAwB;IAC/E;IACElB,KAAK,GAAGF,KAAK,CAACO,MAAM,CAACC,MAAM,CAACC,OAAO,CAACY,OAAO;IAC3ClB,KAAK,gBACDQ,yEACIA,6CAASlB,aAAa,CAAU,YAC/BO,KAAK,CAACO,MAAM,CAACC,MAAM,CAACC,OAAO,CAACN,KAAK,yBAClCQ,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACd,MAAM,CAAC,CAACe,MAAM,CAACpB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM;IACHQ,KAAK,GAAGF,KAAK,CAACO,MAAM,CAACC,MAAM,CAACC,OAAO,CAACY,OAAO;IAC3ClB,KAAK,gBAAGQ,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAACd,MAAM,CAAC,CAACe,MAAM,CAACpB,MAAM,CAAC,CAAU;;EAG3E,oBACIiB;IACIW,SAAS,EAAC,gJAAgJ;iBAChJ;KACTpB,KAAK,YAAQC,KAAK,CACjB;AAEd;;;;"}

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

@@ -5,6 +5,7 @@ import { useLocalization } from '../../../../Provider/Localization.js';
 import { Checkbox } from '../../../../Checkbox/Checkbox.js';
 import { Shortcut } from '../../../../Shortcut/Shortcut.js';
 import { getRadioClassnames } from '../../../../RadioGroup/util.js';
+import { TableServerLoadAllState } from '../../../../../primitives/Table/types.js';
 import { Header as Header$1 } from '../header/Header.js';
 import { RowContext } from '../../rows/RowContext.js';
 import { DisplayCell } from '../cell/DisplayCell.js';
@@ -19,6 +20,25 @@ function Header(context) {
     const isAllRowsSelected = context.table.getIsAllRowsSelected();
     const isSomeRowsSelected = context.table.getIsSomeRowsSelected();
     const title = isAllRowsSelected ? texts.table3.columns.select.deselectAll : texts.table3.columns.select.selectAll;
+    const tableMeta = context.table.options.meta;
+    const isServerloading = tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading;
+    const isLoadingAll = isAllRowsSelected && isServerloading;
+    const isLoadingPreviousRows = tableMeta.rowSelection.lastSelectedRowIndex !== undefined && isServerloading;
+    const toggleSelectAll = function () {
+      try {
+        const _temp = function () {
+          if (!isServerloading) {
+            var _tableMeta$server, _tableMeta$server$loa;
+            return Promise.resolve((_tableMeta$server = tableMeta.server) === null || _tableMeta$server === void 0 ? void 0 : (_tableMeta$server$loa = _tableMeta$server.loadAllIfNeeded) === null || _tableMeta$server$loa === void 0 ? void 0 : _tableMeta$server$loa.call(_tableMeta$server, context.table.getState().sorting, context.table.getState().columnFilters, undefined)).then(function () {
+              context.table.toggleAllRowsSelected(!isAllRowsSelected);
+            });
+          }
+        }();
+        return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
+      } catch (e) {
+        return Promise.reject(e);
+      }
+    };
     return /*#__PURE__*/React__default.createElement(Header$1, Object.assign({}, context), /*#__PURE__*/React__default.createElement(Tooltip, {
       title: title
     }, /*#__PURE__*/React__default.createElement(Checkbox, {
@@ -27,8 +47,9 @@ function Header(context) {
       key: String(`${isAllRowsSelected}_${isSomeRowsSelected}`),
       checked: isAllRowsSelected,
       indeterminate: isSomeRowsSelected,
-      onChange: context.table.toggleAllRowsSelected,
-      tabIndex: -1
+      onChange: toggleSelectAll,
+      tabIndex: -1,
+      loading: isLoadingAll || isLoadingPreviousRows
     })));
   } else {
     return /*#__PURE__*/React__default.createElement(Header$1, Object.assign({}, context));
@@ -50,18 +71,49 @@ const Cell = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
   const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;
   const isSelected = context.row.getIsSelected();
   const title = isSelected ? texts.table3.columns.select.deselect : texts.table3.columns.select.select;
-  if (context.table.options.enableMultiRowSelection) {
-    const handleClick = event => {
-      event.stopPropagation();
-      if (event.shiftKey) {
-        var _tableMeta$rowSelecti;
-        const [fromIndex, toIndex] = toggleBetween((_tableMeta$rowSelecti = tableMeta.rowSelection.lastSelectedRowIndex.current) !== null && _tableMeta$rowSelecti !== void 0 ? _tableMeta$rowSelecti : 0, rowIndex);
-        context.table.getRowModel().rows.slice(fromIndex, toIndex + 1).forEach(row => row.toggleSelected(true));
-      } else {
-        context.row.toggleSelected();
+  const handleCheckboxClick = function (event) {
+    try {
+      function _temp5() {
+        tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;
       }
-      tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;
-    };
+      event.stopPropagation();
+      const _temp4 = function () {
+        if (event.shiftKey) {
+          var _tableMeta$rowSelecti;
+          function _temp3() {
+            const currentlySelected = context.table.getSelectedRowModel().rows;
+            // concat currently selected with selection range and get rid of duplicates using "Set".
+            // converting allSelected array into updater object: {[row.id]: true}
+            const allSelected = [...new Set(currentlySelected.concat(selectionRangeRows))];
+            const updater = allSelected.reduce((obj, row) => Object.assign(obj, {
+              [row.id]: true
+            }), {});
+            context.table.setRowSelection(updater);
+          }
+          const [fromIndex, toIndex] = toggleBetween((_tableMeta$rowSelecti = tableMeta.rowSelection.lastSelectedRowIndex.current) !== null && _tableMeta$rowSelecti !== void 0 ? _tableMeta$rowSelecti : 0, rowIndex);
+          const selectionRangeRows = context.table.getRowModel().rows.slice(fromIndex, toIndex + 1);
+          // Table data loader filling-in all the rest of unloaded items with the undefined values,
+          // so we can easily check if at least one of the rows in the selection range is undefined,
+          // then it means that we need to call load all.
+          const hasUndefinedRows = selectionRangeRows.some(row => row.original === undefined);
+          const _temp2 = function () {
+            if (hasUndefinedRows) {
+              var _tableMeta$server2, _tableMeta$server2$lo;
+              // We don't need to await and freeze UI
+              return Promise.resolve((_tableMeta$server2 = tableMeta.server) === null || _tableMeta$server2 === void 0 ? void 0 : (_tableMeta$server2$lo = _tableMeta$server2.loadAllIfNeeded) === null || _tableMeta$server2$lo === void 0 ? void 0 : _tableMeta$server2$lo.call(_tableMeta$server2, context.table.getState().sorting, context.table.getState().columnFilters, undefined)).then(function () {});
+            }
+          }();
+          return _temp2 && _temp2.then ? _temp2.then(_temp3) : _temp3(_temp2);
+        } else {
+          context.row.toggleSelected();
+        }
+      }();
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp5) : _temp5(_temp4));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  if (context.table.options.enableMultiRowSelection) {
     return /*#__PURE__*/React__default.createElement(DisplayCell, Object.assign({}, context), /*#__PURE__*/React__default.createElement(Tooltip, {
       title: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, title, /*#__PURE__*/React__default.createElement(Shortcut, {
         className: "ml-2",
@@ -71,7 +123,7 @@ const Cell = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
       "aria-label": title,
       className: "!mt-0",
       checked: isSelected,
-      onClick: handleClick,
+      onClick: handleCheckboxClick,
       // this is necessary to remove console spam from eslint
       onChange: () => false,
       tabIndex: isActiveRow ? 0 : -1

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

@@ -1 +1 @@
-{"version":3,"file":"Selection.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Selection.tsx"],"sourcesContent":["import React from 'react';\nimport { HeaderContext, CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { Checkbox } from '../../../../Checkbox/Checkbox';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { RowContext } from '../../rows/RowContext';\nimport { Footer } from '../footer/Footer';\nimport { getRadioClassnames } from '../../../../RadioGroup/util';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\n\nexport const COLUMN_ID = '__select';\n\nfunction Header<TType = unknown>(context: HeaderContext<TType, unknown>) {\n    const { texts } = useLocalization();\n\n    if (context.table.options.enableMultiRowSelection) {\n        const isAllRowsSelected = context.table.getIsAllRowsSelected();\n        const isSomeRowsSelected = context.table.getIsSomeRowsSelected();\n        const title = isAllRowsSelected ? texts.table3.columns.select.deselectAll : texts.table3.columns.select.selectAll;\n\n        return (\n            <ColumnHeader {...context}>\n                <Tooltip title={title}>\n                    <Checkbox\n                        aria-label={title}\n                        className=\"hover:border-blue !mt-0\"\n                        key={String(`${isAllRowsSelected}_${isSomeRowsSelected}`)}\n                        checked={isAllRowsSelected}\n                        indeterminate={isSomeRowsSelected}\n                        onChange={context.table.toggleAllRowsSelected}\n                        tabIndex={-1}\n                    />\n                </Tooltip>\n            </ColumnHeader>\n        );\n    } else {\n        return <ColumnHeader {...context}></ColumnHeader>;\n    }\n}\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n    const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n    const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n    return [fromIndex, toIndex];\n};\n\nconst Cell = React.memo(\n    function MemoedCell<TType = unknown>(context: CellContext<TType, unknown>) {\n        const { texts } = useLocalization();\n        const { rowIndex } = React.useContext(RowContext);\n        const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n        const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n        const isSelected = context.row.getIsSelected();\n        const title = isSelected ? texts.table3.columns.select.deselect : texts.table3.columns.select.select;\n\n        if (context.table.options.enableMultiRowSelection) {\n            const handleClick = (event: React.MouseEvent): void => {\n                event.stopPropagation();\n\n                if (event.shiftKey) {\n                    const [fromIndex, toIndex] = toggleBetween(\n                        tableMeta.rowSelection.lastSelectedRowIndex.current ?? 0,\n                        rowIndex\n                    );\n\n                    context.table\n                        .getRowModel()\n                        .rows.slice(fromIndex, toIndex + 1)\n                        .forEach(row => row.toggleSelected(true));\n                } else {\n                    context.row.toggleSelected();\n                }\n\n                tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;\n            };\n\n            return (\n                <DisplayCell {...context}>\n                    <Tooltip\n                        title={\n                            <>\n                                {title}\n                                <Shortcut className=\"ml-2\" keys=\"Space\" />\n                            </>\n                        }>\n                        <Checkbox\n                            aria-label={title}\n                            className=\"!mt-0\"\n                            checked={isSelected}\n                            onClick={handleClick}\n                            // this is necessary to remove console spam from eslint\n                            onChange={() => false}\n                            tabIndex={isActiveRow ? 0 : -1}\n                        />\n                    </Tooltip>\n                </DisplayCell>\n            );\n        } else {\n            const className = cn('!mt-0', getRadioClassnames());\n\n            const handleClick = (event: React.MouseEvent): void => {\n                event.stopPropagation();\n                context.row.toggleSelected();\n                tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;\n            };\n\n            return (\n                <DisplayCell {...context}>\n                    <button\n                        className={className}\n                        aria-checked={isSelected}\n                        onClick={handleClick}\n                        role=\"radio\"\n                        tabIndex={-1}\n                        type=\"button\">\n                        {isSelected ? <span className=\"h-2 w-2 rounded-full bg-white\" /> : null}\n                    </button>\n                </DisplayCell>\n            );\n        }\n    },\n    function arePropsEqual(oldProps: CellContext<unknown, unknown>, newProps: CellContext<unknown, unknown>) {\n        const oldTableMeta = oldProps.table.options.meta as TableMeta<unknown>;\n        const newTableMeta = newProps.table.options.meta as TableMeta<unknown>;\n\n        // we memo because we don't want the row re-rendering and removing focus from the checkbox\n        // we can't default to the standard comparison because we need currentRow off the table meta\n        // and we don't really care about re-rendering in any other scenario\n        return (\n            newTableMeta.rowActive.rowActiveIndex === oldTableMeta.rowActive.rowActiveIndex &&\n            newProps.row.getIsSelected() !== oldProps.row.getIsSelected()\n        );\n    }\n) as <TType = unknown>(context: CellContext<TType, unknown>) => JSX.Element;\n\nexport function createRowSelectionColumn<TType = unknown>(\n    hasDrag: boolean,\n    hasExpansion: boolean\n): DisplayColumnDef<TType, unknown> {\n    const size = hasDrag && hasExpansion ? 22 : 40;\n\n    return {\n        id: COLUMN_ID,\n        header: Header,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'center',\n            className: cn('!pt-[var(--table3-cell-padding-y)] !justify-end !p-0', {\n                '!pr-0.5': hasExpansion,\n                '!pr-3': !hasExpansion,\n            }),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: cn('items-center !justify-end !p-0', { '!pr-0.5': hasExpansion, '!pr-3': !hasExpansion }),\n        },\n        // options\n        enableResizing: false,\n        size,\n        minSize: size,\n    };\n}\n"],"names":["COLUMN_ID","Header","context","texts","useLocalization","table","options","enableMultiRowSelection","isAllRowsSelected","getIsAllRowsSelected","isSomeRowsSelected","getIsSomeRowsSelected","title","table3","columns","select","deselectAll","selectAll","React","ColumnHeader","Tooltip","Checkbox","className","key","String","checked","indeterminate","onChange","toggleAllRowsSelected","tabIndex","toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","Cell","memo","MemoedCell","rowIndex","useContext","RowContext","tableMeta","meta","isActiveRow","rowActive","rowActiveIndex","isSelected","row","getIsSelected","deselect","handleClick","event","stopPropagation","shiftKey","_tableMeta$rowSelecti","rowSelection","lastSelectedRowIndex","current","getRowModel","rows","slice","forEach","toggleSelected","DisplayCell","Shortcut","keys","onClick","cn","getRadioClassnames","role","type","arePropsEqual","oldProps","newProps","oldTableMeta","newTableMeta","createRowSelectionColumn","hasDrag","hasExpansion","size","id","header","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","minSize"],"mappings":"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"}
+{"version":3,"file":"Selection.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Selection.tsx"],"sourcesContent":["import React from 'react';\nimport { HeaderContext, CellContext, DisplayColumnDef, TableMeta, RowSelectionState } from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { Checkbox } from '../../../../Checkbox/Checkbox';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { RowContext } from '../../rows/RowContext';\nimport { Footer } from '../footer/Footer';\nimport { getRadioClassnames } from '../../../../RadioGroup/util';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { TableServerLoadAllState } from '../../../../../primitives/Table/types';\n\nexport const COLUMN_ID = '__select';\n\nfunction Header<TType = unknown>(context: HeaderContext<TType, unknown>) {\n    const { texts } = useLocalization();\n\n    if (context.table.options.enableMultiRowSelection) {\n        const isAllRowsSelected = context.table.getIsAllRowsSelected();\n        const isSomeRowsSelected = context.table.getIsSomeRowsSelected();\n        const title = isAllRowsSelected ? texts.table3.columns.select.deselectAll : texts.table3.columns.select.selectAll;\n        const tableMeta = context.table.options.meta as TableMeta<TType>;\n        const isServerloading = tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading;\n        const isLoadingAll = isAllRowsSelected && isServerloading;\n        const isLoadingPreviousRows = tableMeta.rowSelection.lastSelectedRowIndex !== undefined && isServerloading;\n\n        const toggleSelectAll = async () => {\n            if (!isServerloading) {\n                await tableMeta.server?.loadAllIfNeeded?.(\n                    context.table.getState().sorting,\n                    context.table.getState().columnFilters,\n                    undefined\n                );\n                context.table.toggleAllRowsSelected(!isAllRowsSelected);\n            }\n        };\n\n        return (\n            <ColumnHeader {...context}>\n                <Tooltip title={title}>\n                    <Checkbox\n                        aria-label={title}\n                        className=\"hover:border-blue !mt-0\"\n                        key={String(`${isAllRowsSelected}_${isSomeRowsSelected}`)}\n                        checked={isAllRowsSelected}\n                        indeterminate={isSomeRowsSelected}\n                        onChange={toggleSelectAll}\n                        tabIndex={-1}\n                        loading={isLoadingAll || isLoadingPreviousRows}\n                    />\n                </Tooltip>\n            </ColumnHeader>\n        );\n    } else {\n        return <ColumnHeader {...context}></ColumnHeader>;\n    }\n}\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n    const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n    const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n    return [fromIndex, toIndex];\n};\n\nconst Cell = React.memo(\n    function MemoedCell<TType = unknown>(context: CellContext<TType, unknown>) {\n        const { texts } = useLocalization();\n        const { rowIndex } = React.useContext(RowContext);\n        const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n        const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n        const isSelected = context.row.getIsSelected();\n        const title = isSelected ? texts.table3.columns.select.deselect : texts.table3.columns.select.select;\n\n        const handleCheckboxClick = async (event: React.MouseEvent) => {\n            event.stopPropagation();\n\n            if (event.shiftKey) {\n                const [fromIndex, toIndex] = toggleBetween(tableMeta.rowSelection.lastSelectedRowIndex.current ?? 0, rowIndex);\n\n                const selectionRangeRows = context.table.getRowModel().rows.slice(fromIndex, toIndex + 1);\n\n                // Table data loader filling-in all the rest of unloaded items with the undefined values,\n                // so we can easily check if at least one of the rows in the selection range is undefined,\n                // then it means that we need to call load all.\n                const hasUndefinedRows = selectionRangeRows.some(row => row.original === undefined);\n\n                if (hasUndefinedRows) {\n                    // We don't need to await and freeze UI\n                    await tableMeta.server?.loadAllIfNeeded?.(\n                        context.table.getState().sorting,\n                        context.table.getState().columnFilters,\n                        undefined\n                    );\n                }\n\n                const currentlySelected = context.table.getSelectedRowModel().rows;\n                // concat currently selected with selection range and get rid of duplicates using \"Set\".\n                const allSelected = [...new Set(currentlySelected.concat(selectionRangeRows))];\n                // converting allSelected array into updater object: {[row.id]: true}\n                const updater: RowSelectionState = allSelected.reduce((obj, row) => Object.assign(obj, { [row.id]: true }), {});\n\n                context.table.setRowSelection(updater);\n            } else {\n                context.row.toggleSelected();\n            }\n\n            tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;\n        };\n\n        if (context.table.options.enableMultiRowSelection) {\n            return (\n                <DisplayCell {...context}>\n                    <Tooltip\n                        title={\n                            <>\n                                {title}\n                                <Shortcut className=\"ml-2\" keys=\"Space\" />\n                            </>\n                        }>\n                        <Checkbox\n                            aria-label={title}\n                            className=\"!mt-0\"\n                            checked={isSelected}\n                            onClick={handleCheckboxClick}\n                            // this is necessary to remove console spam from eslint\n                            onChange={() => false}\n                            tabIndex={isActiveRow ? 0 : -1}\n                        />\n                    </Tooltip>\n                </DisplayCell>\n            );\n        } else {\n            const className = cn('!mt-0', getRadioClassnames());\n\n            const handleClick = (event: React.MouseEvent): void => {\n                event.stopPropagation();\n                context.row.toggleSelected();\n                tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;\n            };\n\n            return (\n                <DisplayCell {...context}>\n                    <button\n                        className={className}\n                        aria-checked={isSelected}\n                        onClick={handleClick}\n                        role=\"radio\"\n                        tabIndex={-1}\n                        type=\"button\">\n                        {isSelected ? <span className=\"h-2 w-2 rounded-full bg-white\" /> : null}\n                    </button>\n                </DisplayCell>\n            );\n        }\n    },\n    function arePropsEqual(oldProps: CellContext<unknown, unknown>, newProps: CellContext<unknown, unknown>) {\n        const oldTableMeta = oldProps.table.options.meta as TableMeta<unknown>;\n        const newTableMeta = newProps.table.options.meta as TableMeta<unknown>;\n\n        // we memo because we don't want the row re-rendering and removing focus from the checkbox\n        // we can't default to the standard comparison because we need currentRow off the table meta\n        // and we don't really care about re-rendering in any other scenario\n        return (\n            newTableMeta.rowActive.rowActiveIndex === oldTableMeta.rowActive.rowActiveIndex &&\n            newProps.row.getIsSelected() !== oldProps.row.getIsSelected()\n        );\n    }\n) as <TType = unknown>(context: CellContext<TType, unknown>) => JSX.Element;\n\nexport function createRowSelectionColumn<TType = unknown>(\n    hasDrag: boolean,\n    hasExpansion: boolean\n): DisplayColumnDef<TType, unknown> {\n    const size = hasDrag && hasExpansion ? 22 : 40;\n\n    return {\n        id: COLUMN_ID,\n        header: Header,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'center',\n            className: cn('!pt-[var(--table3-cell-padding-y)] !justify-end !p-0', {\n                '!pr-0.5': hasExpansion,\n                '!pr-3': !hasExpansion,\n            }),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: cn('items-center !justify-end !p-0', { '!pr-0.5': hasExpansion, '!pr-3': !hasExpansion }),\n        },\n        // options\n        enableResizing: false,\n        size,\n        minSize: size,\n    };\n}\n"],"names":["COLUMN_ID","Header","context","texts","useLocalization","table","options","enableMultiRowSelection","isAllRowsSelected","getIsAllRowsSelected","isSomeRowsSelected","getIsSomeRowsSelected","title","table3","columns","select","deselectAll","selectAll","tableMeta","meta","isServerloading","server","loadAllStatus","TableServerLoadAllState","Loading","isLoadingAll","isLoadingPreviousRows","rowSelection","lastSelectedRowIndex","undefined","toggleSelectAll","_tableMeta$server","_tableMeta$server$loa","Promise","resolve","loadAllIfNeeded","call","getState","sorting","columnFilters","then","toggleAllRowsSelected","_temp","e","reject","React","ColumnHeader","Tooltip","Checkbox","className","key","String","checked","indeterminate","onChange","tabIndex","loading","toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","Cell","memo","MemoedCell","rowIndex","useContext","RowContext","isActiveRow","rowActive","rowActiveIndex","isSelected","row","getIsSelected","deselect","handleCheckboxClick","event","current","stopPropagation","_temp4","shiftKey","_tableMeta$rowSelecti","_temp3","currentlySelected","getSelectedRowModel","rows","allSelected","Set","concat","selectionRangeRows","updater","reduce","obj","Object","assign","id","setRowSelection","getRowModel","slice","hasUndefinedRows","some","original","_temp2","_tableMeta$server2","_tableMeta$server2$lo","toggleSelected","_temp5","DisplayCell","Shortcut","keys","onClick","cn","getRadioClassnames","handleClick","role","type","arePropsEqual","oldProps","newProps","oldTableMeta","newTableMeta","createRowSelectionColumn","hasDrag","hasExpansion","size","header","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","minSize"],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 import cn from 'clsx';
-import { getCellMinWidth } from '../../../../primitives/Table/useTable/util/columns.js';
+import { getCellMinWidth } from '../../../../primitives/Table/useTableManager/util/columns.js';
 
 const PRINT_MIN_COLUMN_SIZE = 20; // while printing, it accounts for minimum width each column can take
 const getCellAlignmentClasses = (alignment = 'left') => {

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 'clsx';\nimport { Table3ColumnAlignment } from '../../types';\nimport { getCellMinWidth } from '../../../../primitives/Table/useTable/util/columns';\n\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\nexport const getFontBasedMinColumnSize = getCellMinWidth;\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":["PRINT_MIN_COLUMN_SIZE","getCellAlignmentClasses","alignment","cn","getFontBasedMinColumnSize","getCellMinWidth","getInputAppearanceClassnames"],"mappings":";;;MAIaA,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;MAEaE,yBAAyB,GAAGC;AAEzC;MACaC,4BAA4B,GAAGA;EACxC,OAAOH,EAAE,CACL,sHAAsH,CACzH;AACL;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/Table3/components/columns/styles.ts"],"sourcesContent":["import cn from 'clsx';\nimport { Table3ColumnAlignment } from '../../types';\nimport { getCellMinWidth } from '../../../../primitives/Table/useTableManager/util/columns';\n\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\nexport const getFontBasedMinColumnSize = getCellMinWidth;\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":["PRINT_MIN_COLUMN_SIZE","getCellAlignmentClasses","alignment","cn","getFontBasedMinColumnSize","getCellMinWidth","getInputAppearanceClassnames"],"mappings":";;;MAIaA,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;MAEaE,yBAAyB,GAAGC;AAEzC;MACaC,4BAA4B,GAAGA;EACxC,OAAOH,EAAE,CACL,sHAAsH,CACzH;AACL;;;;"}

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

@@ -5,7 +5,7 @@ import { useLocalization } from '../../../Provider/Localization.js';
 import { Checkbox } from '../../../Checkbox/Checkbox.js';
 import { Input } from '../../../Input/Input.js';
 import { Popover } from '../../../Popover/Popover.js';
-import { ensureOrdering } from '../../../../primitives/Table/useTable/util/columns.js';
+import { ensureOrdering } from '../../../../primitives/Table/useTableManager/util/columns.js';
 import { Container } from '../../../../primitives/Sortable/components/Container.js';
 import { arrayMove } from '@dnd-kit/sortable';
 import { Item } from '../../../../primitives/Sortable/components/Item.js';

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 'clsx';\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 '../../../../primitives/Table/useTable/util/columns';\nimport { COLUMN_ID as ACTIONS_COLUMN_ID } from '../../components/columns/internal/Actions';\nimport { COLUMN_ID as EDITING_ACTIONS_COLUMN_ID } from '../../components/columns/internal/EditingActions';\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    const parentText = column.parent ? column.parent?.columnDef.meta?.header : null;\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\">\n                {column.columnDef.meta?.header}\n                {parentText ? <span className=\"italic\"> ({parentText})</span> : null}\n            </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\n                        ? column.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase()) ||\n                          column.parent?.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase())\n                        : 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                [ACTIONS_COLUMN_ID, EDITING_ACTIONS_COLUMN_ID]\n            )\n        );\n    };\n\n    return (\n        <Popover {...popoverProps} anchor={trigger}>\n            <Popover.Content>\n                <div className=\"flex max-w-sm 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","parentText","parent","_column$parent","_column$parent$column","columnDef","meta","header","key","id","onClick","toggleVisibility","Icon","name","_column$columnDef$met","Checkbox","checked","onChange","ColumnSettingsPopover","table","trigger","popoverProps","texts","useLocalization","query","setQuery","useState","allColumns","getAllLeafColumns","tableMeta","options","columns","useMemo","filter","isInternalColumn","_column$columnDef$met2","_column$parent2","_column$parent2$colum","length","toLowerCase","includes","listClassName","handleReorder","activeId","overId","find","_column$columnDef$met3","enableOrdering","setColumnOrder","currentOrder","ensureOrdering","SortablePrimitive","findIndex","c","ACTIONS_COLUMN_ID","EDITING_ACTIONS_COLUMN_ID","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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"}
+{"version":3,"file":"ColumnSettings.js","sources":["../../../../../../../../../src/components/Table3/components/toolbar/ColumnSettings.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\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 '../../../../primitives/Table/useTableManager/util/columns';\nimport { COLUMN_ID as ACTIONS_COLUMN_ID } from '../../components/columns/internal/Actions';\nimport { COLUMN_ID as EDITING_ACTIONS_COLUMN_ID } from '../../components/columns/internal/EditingActions';\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    const parentText = column.parent ? column.parent?.columnDef.meta?.header : null;\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\">\n                {column.columnDef.meta?.header}\n                {parentText ? <span className=\"italic\"> ({parentText})</span> : null}\n            </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\n                        ? column.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase()) ||\n                          column.parent?.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase())\n                        : 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                [ACTIONS_COLUMN_ID, EDITING_ACTIONS_COLUMN_ID]\n            )\n        );\n    };\n\n    return (\n        <Popover {...popoverProps} anchor={trigger}>\n            <Popover.Content>\n                <div className=\"flex max-w-sm 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","parentText","parent","_column$parent","_column$parent$column","columnDef","meta","header","key","id","onClick","toggleVisibility","Icon","name","_column$columnDef$met","Checkbox","checked","onChange","ColumnSettingsPopover","table","trigger","popoverProps","texts","useLocalization","query","setQuery","useState","allColumns","getAllLeafColumns","tableMeta","options","columns","useMemo","filter","isInternalColumn","_column$columnDef$met2","_column$parent2","_column$parent2$colum","length","toLowerCase","includes","listClassName","handleReorder","activeId","overId","find","_column$columnDef$met3","enableOrdering","setColumnOrder","currentOrder","ensureOrdering","SortablePrimitive","findIndex","c","ACTIONS_COLUMN_ID","EDITING_ACTIONS_COLUMN_ID","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":";;;;;;;;;;;;;;;;AAmBA,MAAMA,MAAM,gBAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,MAAMA,CAAkBG,KAAyB,EAAEC,GAA8B;;EACtH,MAAM;IAAEC,MAAM;IAAEC,SAAS,GAAG,KAAK;IAAE,GAAGC;GAAgB,GAAGJ,KAAK;EAC9D,MAAMK,OAAO,GAAGH,MAAM,CAACI,UAAU,EAAE;EAEnC,MAAMC,SAAS,GAAGC,EAAE,CAAC,0DAA0D,EAAE;IAC7E,mBAAmB,EAAEH,OAAO,IAAIF,SAAS;IACzC,sBAAsB,EAAEE,OAAO;IAC/B,uCAAuC,EAAEF;GAC5C,CAAC;EAEF,MAAMM,UAAU,GAAGN,SAAS,GAAGC,cAAc,GAAGM,SAAS;EACzD,MAAMC,SAAS,GAAGT,MAAM,CAACU,YAAY,EAAE;EAEvC,MAAMC,UAAU,GAAGX,MAAM,CAACY,MAAM,IAAAC,cAAA,GAAGb,MAAM,CAACY,MAAM,cAAAC,cAAA,wBAAAC,qBAAA,GAAbD,cAAA,CAAeE,SAAS,CAACC,IAAI,cAAAF,qBAAA,uBAA7BA,qBAAA,CAA+BG,MAAM,GAAG,IAAI;EAE/E,oBACIrB,sDAASW,UAAU;IAAEW,GAAG,EAAElB,MAAM,CAACmB,EAAE;IAAEd,SAAS,EAAEA,SAAS;IAAEe,OAAO,EAAEA,MAAMpB,MAAM,CAACqB,gBAAgB,CAAC,CAACZ,SAAS,CAAC;IAAEV,GAAG,EAAEA;MAC/GE,SAAS,gBAAGL,6BAAC0B,IAAI;IAACC,IAAI,EAAC,MAAM;IAAClB,SAAS,EAAC;IAA8D,GAAG,IAAI,eAC9GT;IAAMS,SAAS,EAAC;8BACXL,MAAM,CAACe,SAAS,CAACC,IAAI,cAAAQ,qBAAA,uBAArBA,qBAAA,CAAuBP,MAAM,EAC7BN,UAAU,gBAAGf;IAAMS,SAAS,EAAC;WAAYM,UAAU,MAAS,GAAG,IAAI,CACjE,EACNR,OAAO,gBAAGP,6BAAC6B,QAAQ;IAACC,OAAO,EAAEjB,SAAS;IAAEkB,QAAQ,EAAEA,MAAM3B,MAAM,CAACqB,gBAAgB,CAAC,CAACZ,SAAS;IAAK,GAAG,IAAI,CACrG;AAEd,CAAC,CAAC;SAMcmB,qBAAqBA,CAAkB9B,KAAiC;EACpF,MAAM;IAAE+B,KAAK;IAAEC,OAAO;IAAE,GAAGC;GAAc,GAAGjC,KAAK;EACjD,MAAM;IAAEkC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGvC,cAAK,CAACwC,QAAQ,CAAC,EAAE,CAAC;EAC5C,MAAMC,UAAU,GAAGR,KAAK,CAACS,iBAAiB,EAAE;EAC5C,MAAMC,SAAS,GAAGV,KAAK,CAACW,OAAO,CAACxB,IAAwB;EACxD,MAAMyB,OAAO,GAAG7C,cAAK,CAAC8C,OAAO,CACzB,MACIL,UAAU,CACLM,MAAM,CAAC3C,MAAM,IAAI,CAAC4C,gBAAgB,CAAC5C,MAAM,CAACmB,EAAE,CAAC,CAAC,CAC9CwB,MAAM,CAAC3C,MAAM;IAAA,IAAA6C,sBAAA,EAAAC,eAAA,EAAAC,qBAAA;IAAA,OACVb,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEc,MAAM,GACP,EAAAH,sBAAA,GAAA7C,MAAM,CAACe,SAAS,CAACC,IAAI,cAAA6B,sBAAA,uBAArBA,sBAAA,CAAuB5B,MAAM,CAACgC,WAAW,EAAE,CAACC,QAAQ,CAAChB,KAAK,CAACe,WAAW,EAAE,CAAC,OAAAH,eAAA,GACzE9C,MAAM,CAACY,MAAM,cAAAkC,eAAA,wBAAAC,qBAAA,GAAbD,eAAA,CAAe/B,SAAS,CAACC,IAAI,cAAA+B,qBAAA,uBAA7BA,qBAAA,CAA+B9B,MAAM,CAACgC,WAAW,EAAE,CAACC,QAAQ,CAAChB,KAAK,CAACe,WAAW,EAAE,CAAC,IACjF,IAAI;IACb,EACT,CAACZ,UAAU,EAAEH,KAAK,CAAC,CACtB;EAED,MAAMiB,aAAa,GAAG,+CAA+C;EAErE,MAAMC,aAAa,GAAGA,CAACC,QAAQ,EAAEC,MAAM;IACnC,IAAIb,OAAO,CAACc,IAAI,CAACvD,MAAM;MAAA,IAAAwD,sBAAA;MAAA,OAAIxD,MAAM,CAACmB,EAAE,KAAKmC,MAAM,IAAI,EAAAE,sBAAA,GAAAxD,MAAM,CAACe,SAAS,CAACC,IAAI,cAAAwC,sBAAA,uBAArBA,sBAAA,CAAuBC,cAAc,MAAK,KAAK;MAAC,EAAE;MACjG;;IAGJ5B,KAAK,CAAC6B,cAAc,CAACC,YAAY,IAC7BC,cAAc,CACVvB,UAAU,EACVwB,SAA2B,CACvBF,YAAY,EACZA,YAAY,CAACG,SAAS,CAACC,CAAC,IAAIA,CAAC,KAAKV,QAAQ,CAAC,EAC3CM,YAAY,CAACG,SAAS,CAACC,CAAC,IAAIA,CAAC,KAAKT,MAAM,CAAC,CAC5C,EACD,CAACU,SAAiB,EAAEC,WAAyB,CAAC,CACjD,CACJ;GACJ;EAED,oBACIrE,6BAACsE,OAAO,oBAAKnC,YAAY;IAAEoC,MAAM,EAAErC;mBAC/BlC,6BAACsE,OAAO,CAACE,OAAO,qBACZxE;IAAKS,SAAS,EAAC;KACVwB,KAAK,CAACW,OAAO,CAAC6B,YAAY,kBACvBzE,6BAAC0E,KAAK;IACF3C,QAAQ,EAAE4C,KAAK,IAAIpC,QAAQ,CAACoC,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;IAC/CC,WAAW,EAAE1C,KAAK,CAAC2C,MAAM,CAACC,cAAc,CAACC,MAAM;IAC/CJ,KAAK,EAAEvC;IACT,IACF,IAAI,EACPK,SAAS,CAACuC,cAAc,CAACC,SAAS,IAAItC,OAAO,CAACO,MAAM,IAAI,EAACd,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEc,MAAM,mBACnEpD,6BAACiE,SAA2B;IAACmB,OAAO,EAAE5B;kBAClCxD,6BAACiE,IAAsB;IAAC1C,EAAE,EAAC,SAAS;IAACd,SAAS,EAAE8C;KAC3CV,OAAO,CAACwC,GAAG,CAACjF,MAAM;IAAA,IAAAkF,sBAAA,EAAAC,sBAAA;IAAA,oBACfvF,6BAACiE,IAAsB;MACnB3C,GAAG,EAAElB,MAAM,CAACmB,EAAE;MACdA,EAAE,EAAEnB,MAAM,CAACmB,EAAE;MACbiE,QAAQ,EAAE,GAAAF,sBAAA,GAAClF,MAAM,CAACe,SAAS,CAACC,IAAI,cAAAkE,sBAAA,eAArBA,sBAAA,CAAuBzB,cAAc;MAChD4B,OAAO;oBACPzF,6BAACD,MAAM;MAACK,MAAM,EAAEA,MAAa;MAAEC,SAAS,GAAAkF,sBAAA,GAAEnF,MAAM,CAACe,SAAS,CAACC,IAAI,cAAAmE,sBAAA,uBAArBA,sBAAA,CAAuB1B;MAAkB,CAC9D;GAC5B,CAAC,CACmB,CACC,mBAE9B7D;IAAKS,SAAS,EAAE8C;KACXV,OAAO,CAACO,MAAM,GACTP,OAAO,CAACwC,GAAG,CAACjF,MAAM,iBAAIJ,6BAACD,MAAM;IAACK,MAAM,EAAEA,MAAa;IAAEkB,GAAG,EAAElB,MAAM,CAACmB;IAAM,CAAC,GACxEa,KAAK,CAAC2C,MAAM,CAACC,cAAc,CAACU,SAAS,CACzC,CACT,CACC,CACQ,CACZ;AAElB;;;;"}

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

@@ -10,13 +10,19 @@ import { Shortcut } from '../../../../../Shortcut/Shortcut.js';
 import { useIsLargeScreen } from '../../../../../../hooks/useIsLargeScreen.js';
 import { isInternalColumn } from '../../../../util/columns.js';
 import { Table3FilterComparator } from '../../../../types.js';
-import { Placeholder } from './components/Placeholder.js';
 import { Filter } from './components/Filter.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);
 }
+const placeholderFilter = {
+  id: null,
+  value: {
+    comparator: Table3FilterComparator.Contains,
+    value: undefined
+  }
+};
 function FiltersButton(props) {
   const {
     total,
@@ -36,41 +42,28 @@ function FiltersButton(props) {
     shift: true
   };
   // state, since we "apply" filters
-  const [filters, setFilters] = React__default.useState(appliedFilters);
-  const [placeholderCount, setPlaceholderCount] = React__default.useState(1);
+  const [filters, setFilters] = React__default.useState(appliedFilters.length ? appliedFilters : [placeholderFilter]);
   // filters
-  const handleChangeFilter = (currentId, filter) => {
+  const handleChangeFilter = (position, filter) => {
     setFilters(currentFilters => {
-      const nextFilters = [...currentFilters];
-      const index = nextFilters.findIndex(f => f.id === currentId);
-      nextFilters[index] = filter;
-      return nextFilters;
+      return currentFilters.map((current, index) => {
+        if (index === position) {
+          return filter;
+        }
+        return current;
+      });
     });
   };
-  const handleRemoveFilter = columnId => {
-    if (filters.length === 1 && placeholderCount === 0) {
-      setPlaceholderCount(count => count + 1);
+  const handleRemoveFilter = position => {
+    if (filters.length === 1) {
+      setFilters([placeholderFilter]);
+      return;
     }
-    setFilters(currentFilters => currentFilters.filter(f => f.id !== columnId));
-  };
-  // placeholders
-  const handleCreateFilterFromPlaceholder = columnId => {
-    setFilters(currentFilters => [...currentFilters, {
-      id: columnId,
-      value: {
-        comparator: Table3FilterComparator.Contains,
-        value: undefined
-      }
-    }]);
-    handleRemovePlaceholder();
-  };
-  const handleCreatePlaceholder = () => {
-    setPlaceholderCount(count => count + 1);
+    setFilters(currentFilters => currentFilters.filter((_, index) => index !== position));
   };
-  const handleRemovePlaceholder = () => {
-    setPlaceholderCount(count => count - 1);
+  const handleCreateNew = () => {
+    setFilters(filters.concat(placeholderFilter));
   };
-  //
   const handleApply = () => {
     table.setColumnFilters(() => {
       const newFilters = filters.filter(f => {
@@ -90,20 +83,17 @@ function FiltersButton(props) {
   };
   const handleClear = () => {
     table.resetColumnFilters();
-    setFilters([]);
-    setPlaceholderCount(1);
+    setFilters([placeholderFilter]);
   };
   const handleClose = React__default.useCallback(open => {
     if (!open) {
-      setFilters(appliedFilters);
-      setPlaceholderCount(appliedFilters.length === 0 ? 1 : 0);
+      setFilters(appliedFilters.length === 0 ? [placeholderFilter] : appliedFilters);
     }
   }, [appliedFilters]);
   // Because filters can be reset from outside
   React__default.useEffect(() => {
     if (appliedFilters.length === 0) {
-      setFilters([]);
-      setPlaceholderCount(1);
+      setFilters([placeholderFilter]);
     }
   }, [appliedFilters]);
   const buttonProps = {
@@ -133,19 +123,12 @@ function FiltersButton(props) {
       filters: filters,
       position: index,
       onChange: handleChangeFilter,
-      onRemove: handleRemoveFilter
-    }))), [...Array(placeholderCount)].map((_, index) => ( /*#__PURE__*/React__default.createElement(Placeholder, {
-      key: `placeholder_${index}`,
-      allColumns: allColumns,
-      filters: filters,
-      position: filters.length + index,
-      onCreate: handleCreateFilterFromPlaceholder,
-      onRemove: placeholderCount > 1 || filters.length > 0 ? handleRemovePlaceholder : undefined
+      onRemove: filters.length > 0 && filters.some(f => f.id) || filters.length > 1 ? handleRemoveFilter : undefined
     }))), /*#__PURE__*/React__default.createElement("div", {
       className: "justify-start"
     }, /*#__PURE__*/React__default.createElement(Button, {
       appearance: "discrete",
-      onClick: handleCreatePlaceholder
+      onClick: handleCreateNew
     }, "+ ", texts.table3.filters.buttons.addFilter))), /*#__PURE__*/React__default.createElement(Group, {
       className: "ml-auto"
     }, /*#__PURE__*/React__default.createElement(Popover.Close, null, /*#__PURE__*/React__default.createElement(Button, null, "Cancel")), /*#__PURE__*/React__default.createElement(Button, {

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 'clsx';\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, ColumnFilter } from '../../../../types';\nimport { Shortcut } from '../../../../../Shortcut/Shortcut';\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 as Table3Filter[];\n\n    const shortcut = { key: 'f', meta: true, shift: true };\n\n    // state, since we \"apply\" filters\n    const [filters, setFilters] = React.useState<Table3Filter[]>(appliedFilters);\n    const [placeholderCount, setPlaceholderCount] = React.useState(1);\n\n    // filters\n    const handleChangeFilter = (currentId: string | null, filter: { id: string | null; 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 | null) => {\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            const newFilters = filters.filter(f => {\n                if (f.id === null) {\n                    return false;\n                }\n\n                const controlRenderer = (allColumns.find(c => c.id === f.id) as RTColumn<TType, unknown>)?.columnDef.meta\n                    ?.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            // Compiler didn't get that we stripped out filters with null ids, so we still need to cast a ColumnFilter type here\n            return newFilters as ColumnFilter[];\n        });\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([]);\n        setPlaceholderCount(1);\n    };\n\n    const handleClose = React.useCallback(\n        (open: boolean) => {\n            if (!open) {\n                setFilters(appliedFilters);\n                setPlaceholderCount(appliedFilters.length === 0 ? 1 : 0);\n            }\n        },\n        [appliedFilters]\n    );\n\n    // Because filters can be reset from outside\n    React.useEffect(() => {\n        if (appliedFilters.length === 0) {\n            setFilters([]);\n            setPlaceholderCount(1);\n        }\n    }, [appliedFilters]);\n\n    const buttonProps = {\n        'aria-label': texts.table3.filters.tooltip,\n        className: cn({ '!wcag-blue-100': appliedFilters.length }),\n        shortcut,\n        popover: popoverProps => (\n            <Popover {...popoverProps} onChange={handleClose}>\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","shortcut","key","shift","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","newFilters","controlRenderer","_allColumns$find","find","c","_allColumns$find$colu","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","handleClose","useCallback","open","useEffect","buttonProps","table3","tooltip","className","cn","popover","popoverProps","Popover","onChange","Content","button","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","map","Filter","position","onRemove","Array","_","Placeholder","onCreate","Button","appearance","onClick","buttons","addFilter","Group","Close","Shortcut","keys","IconButton","icon","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 'clsx';\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, ColumnFilter } from '../../../../types';\nimport { Shortcut } from '../../../../../Shortcut/Shortcut';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { isInternalColumn } from '../../../../util/columns';\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\nconst placeholderFilter: Table3Filter = { id: null, value: { comparator: Table3FilterComparator.Contains, value: undefined } };\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\n    const appliedFilters = table.getState().columnFilters as Table3Filter[];\n    const shortcut = { key: 'f', meta: true, shift: true };\n\n    // state, since we \"apply\" filters\n    const [filters, setFilters] = React.useState<Table3Filter[]>(appliedFilters.length ? appliedFilters : [placeholderFilter]);\n\n    // filters\n    const handleChangeFilter = (position: number, filter: { id: string | null; value: Table3FilterValue }) => {\n        setFilters(currentFilters => {\n            return currentFilters.map((current, index) => {\n                if (index === position) {\n                    return filter;\n                }\n                return current;\n            });\n        });\n    };\n\n    const handleRemoveFilter = position => {\n        if (filters.length === 1) {\n            setFilters([placeholderFilter]);\n            return;\n        }\n\n        setFilters(currentFilters => currentFilters.filter((_, index) => index !== position));\n    };\n\n    const handleCreateNew = () => {\n        setFilters(filters.concat(placeholderFilter));\n    };\n\n    const handleApply = () => {\n        table.setColumnFilters(() => {\n            const newFilters = filters.filter(f => {\n                if (f.id === null) {\n                    return false;\n                }\n\n                const controlRenderer = (allColumns.find(c => c.id === f.id) as RTColumn<TType, unknown>)?.columnDef.meta\n                    ?.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            // Compiler didn't get that we stripped out filters with null ids, so we still need to cast a ColumnFilter type here\n            return newFilters as ColumnFilter[];\n        });\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([placeholderFilter]);\n    };\n\n    const handleClose = React.useCallback(\n        (open: boolean) => {\n            if (!open) {\n                setFilters(appliedFilters.length === 0 ? [placeholderFilter] : appliedFilters);\n            }\n        },\n        [appliedFilters]\n    );\n\n    // Because filters can be reset from outside\n    React.useEffect(() => {\n        if (appliedFilters.length === 0) {\n            setFilters([placeholderFilter]);\n        }\n    }, [appliedFilters]);\n\n    const buttonProps = {\n        'aria-label': texts.table3.filters.tooltip,\n        className: cn({ '!wcag-blue-100': appliedFilters.length }),\n        shortcut,\n        popover: popoverProps => (\n            <Popover {...popoverProps} onChange={handleClose}>\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}\n                                    filter={filter}\n                                    filters={filters}\n                                    position={index}\n                                    onChange={handleChangeFilter}\n                                    onRemove={\n                                        (filters.length > 0 && filters.some(f => f.id)) || filters.length > 1\n                                            ? handleRemoveFilter\n                                            : undefined\n                                    }\n                                />\n                            ))}\n                            <div className=\"justify-start\">\n                                <Button appearance=\"discrete\" onClick={handleCreateNew}>\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","placeholderFilter","id","value","comparator","Table3FilterComparator","Contains","undefined","FiltersButton","props","total","table","locale","texts","useLocalization","ref","React","useRef","isLargeScreen","useIsLargeScreen","allColumns","getAllLeafColumns","filter","column","isInternalColumn","sort","appliedFilters","getState","columnFilters","shortcut","key","shift","filters","setFilters","useState","length","handleChangeFilter","position","currentFilters","map","current","index","handleRemoveFilter","_","handleCreateNew","concat","handleApply","setColumnFilters","newFilters","f","controlRenderer","_allColumns$find","find","c","_allColumns$find$colu","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","handleClose","useCallback","open","useEffect","buttonProps","table3","tooltip","className","cn","popover","popoverProps","Popover","onChange","Content","button","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","Filter","onRemove","some","Button","appearance","onClick","buttons","addFilter","Group","Close","Shortcut","keys","IconButton","icon","Icon","name"],"mappings":"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"}

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

@@ -19,6 +19,7 @@ function Filter(props) {
     texts
   } = useLocalization();
   const column = allColumns.find(c => c.id === filter.id);
+  const ref = React__default.useRef(null);
   const {
     id,
     value: {
@@ -37,7 +38,7 @@ function Filter(props) {
       comparator: null,
       value: null
     };
-    handleChange(id, {
+    handleChange(position, {
       id: columnId,
       value
     });
@@ -47,7 +48,7 @@ function Filter(props) {
     if (comparator === Table3FilterComparator.IsEmpty || comparator === Table3FilterComparator.IsNotEmpty) {
       nextValue = undefined;
     }
-    handleChange(id, {
+    handleChange(position, {
       id,
       value: {
         comparator,
@@ -56,7 +57,7 @@ function Filter(props) {
     });
   };
   const handleChangeValue = value => {
-    handleChange(id, {
+    handleChange(position, {
       id,
       value: {
         ...filter.value,
@@ -64,7 +65,12 @@ function Filter(props) {
       }
     });
   };
-  const handleRemove = () => onRemove(id);
+  const handleRemove = () => onRemove === null || onRemove === void 0 ? void 0 : onRemove(position);
+  React__default.useEffect(() => {
+    if (ref.current && !id) {
+      ref.current.focus(); // after adding a new filter placeholder, we want to focus it right way.
+    }
+  }, [id]);
   return /*#__PURE__*/React__default.createElement("div", {
     className: "flex items-start gap-2"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -73,7 +79,8 @@ function Filter(props) {
     allColumns: allColumns,
     filters: filters,
     onChange: handleChangeColumn,
-    value: id
+    value: id,
+    ref: ref
   }), /*#__PURE__*/React__default.createElement(FilterComparator, {
     column: column,
     onChange: handleChangeComparator,
@@ -83,12 +90,12 @@ function Filter(props) {
     comparator: comparator,
     onChange: handleChangeValue,
     value: value
-  }), /*#__PURE__*/React__default.createElement(IconButton, {
+  }), onRemove ? /*#__PURE__*/React__default.createElement(IconButton, {
     appearance: "discrete",
     className: "ml-auto",
     icon: "close",
     onClick: handleRemove
-  }));
+  }) : null);
 }
 
 export { Filter };