@economic/taco 2.25.1-alpha.13 → 2.25.1

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

@@ -0,0 +1,187 @@
+import React__default from 'react';
+import cn from 'clsx';
+import { Tooltip } from '../../../../Tooltip/Tooltip.js';
+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';
+import { Footer } from '../footer/Footer.js';
+
+const COLUMN_ID = '__select';
+function Header(context) {
+  const {
+    texts
+  } = useLocalization();
+  if (context.table.options.enableMultiRowSelection) {
+    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, {
+      "aria-label": title,
+      className: "hover:border-blue !mt-0",
+      key: String(`${isAllRowsSelected}_${isSomeRowsSelected}`),
+      checked: isAllRowsSelected,
+      indeterminate: isSomeRowsSelected,
+      onChange: toggleSelectAll,
+      tabIndex: -1,
+      loading: isLoadingAll || isLoadingPreviousRows
+    })));
+  } else {
+    return /*#__PURE__*/React__default.createElement(Header$1, Object.assign({}, context));
+  }
+}
+const toggleBetween = (fromRowIndex, toRowIndex) => {
+  const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;
+  const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;
+  return [fromIndex, toIndex];
+};
+const Cell = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
+  const {
+    texts
+  } = useLocalization();
+  const {
+    rowIndex
+  } = React__default.useContext(RowContext);
+  const tableMeta = context.table.options.meta;
+  const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;
+  const isSelected = context.row.getIsSelected();
+  const title = isSelected ? texts.table3.columns.select.deselect : texts.table3.columns.select.select;
+  const handleCheckboxClick = function (event) {
+    try {
+      function _temp5() {
+        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",
+        keys: "Space"
+      }))
+    }, /*#__PURE__*/React__default.createElement(Checkbox, {
+      "aria-label": title,
+      className: "!mt-0",
+      checked: isSelected,
+      onClick: handleCheckboxClick,
+      // this is necessary to remove console spam from eslint
+      onChange: () => false,
+      tabIndex: isActiveRow ? 0 : -1
+    })));
+  } else {
+    const className = cn('!mt-0', getRadioClassnames());
+    const handleClick = event => {
+      event.stopPropagation();
+      context.row.toggleSelected();
+      tableMeta.rowSelection.lastSelectedRowIndex.current = rowIndex;
+    };
+    return /*#__PURE__*/React__default.createElement(DisplayCell, Object.assign({}, context), /*#__PURE__*/React__default.createElement("button", {
+      className: className,
+      "aria-checked": isSelected,
+      onClick: handleClick,
+      role: "radio",
+      tabIndex: -1,
+      type: "button"
+    }, isSelected ? /*#__PURE__*/React__default.createElement("span", {
+      className: "h-2 w-2 rounded-full bg-white"
+    }) : null));
+  }
+}, function arePropsEqual(oldProps, newProps) {
+  const oldTableMeta = oldProps.table.options.meta;
+  const newTableMeta = newProps.table.options.meta;
+  // we memo because we don't want the row re-rendering and removing focus from the checkbox
+  // we can't default to the standard comparison because we need currentRow off the table meta
+  // and we don't really care about re-rendering in any other scenario
+  return newTableMeta.rowActive.rowActiveIndex === oldTableMeta.rowActive.rowActiveIndex && newProps.row.getIsSelected() !== oldProps.row.getIsSelected();
+});
+function createRowSelectionColumn(hasDrag, hasExpansion) {
+  const size = hasDrag && hasExpansion ? 22 : 40;
+  return {
+    id: COLUMN_ID,
+    header: Header,
+    cell: Cell,
+    footer: Footer,
+    meta: {
+      align: 'center',
+      className: cn('!pt-[var(--table3-cell-padding-y)] !justify-end !p-0', {
+        '!pr-0.5': hasExpansion,
+        '!pr-3': !hasExpansion
+      }),
+      enableOrdering: false,
+      enableSearch: false,
+      enableTruncate: false,
+      header: '',
+      headerClassName: cn('items-center !justify-end !p-0', {
+        '!pr-0.5': hasExpansion,
+        '!pr-3': !hasExpansion
+      })
+    },
+    // options
+    enableResizing: false,
+    size,
+    minSize: size
+  };
+}
+
+export { COLUMN_ID, createRowSelectionColumn };
+//# sourceMappingURL=Selection.js.map

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

@@ -0,0 +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, 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

@@ -0,0 +1,19 @@
+import cn from 'clsx';
+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') => {
+  return cn({
+    'justify-start text-left': alignment === 'left',
+    'justify-end text-right': alignment === 'right',
+    'justify-center text-center': alignment === 'center'
+  });
+};
+const getFontBasedMinColumnSize = getCellMinWidth;
+// Hiding input number spin buttons
+const getInputAppearanceClassnames = () => {
+  return cn('[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none');
+};
+
+export { PRINT_MIN_COLUMN_SIZE, getCellAlignmentClasses, getFontBasedMinColumnSize, getInputAppearanceClassnames };
+//# sourceMappingURL=styles.js.map

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

@@ -0,0 +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/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/rows/ExpandedRow.js

@@ -0,0 +1,27 @@
+import React__default from 'react';
+
+const ExpandedRow = /*#__PURE__*/React__default.memo(function ExpandedRow(props) {
+  var _renderer;
+  const {
+    data,
+    renderer,
+    registerSize
+  } = props;
+  const ref = React__default.useRef(null);
+  React__default.useEffect(() => {
+    if (ref.current && registerSize) {
+      registerSize(ref.current.getBoundingClientRect().height);
+    }
+  }, []);
+  const content = (_renderer = renderer(data)) === null || _renderer === void 0 ? void 0 : _renderer();
+  if (!content) {
+    return null;
+  }
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "border-grey-300 bg-grey-50 col-span-full border-b p-4",
+    ref: ref
+  }, content);
+});
+
+export { ExpandedRow };
+//# sourceMappingURL=ExpandedRow.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandedRow.js","sources":["../../../../../../../../../src/components/Table3/components/rows/ExpandedRow.tsx"],"sourcesContent":["import React from 'react';\nimport { Table3RowExpansionRenderer } from '../../types';\n\nexport type ExpandedRowProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    data: TType;\n    renderer: Table3RowExpansionRenderer<TType>;\n    registerSize?: (size: number) => void;\n};\n\nexport const ExpandedRow = React.memo(function ExpandedRow<TType = unknown>(props: ExpandedRowProps<TType>) {\n    const { data, renderer, registerSize } = props;\n    const ref = React.useRef<HTMLDivElement>(null);\n\n    React.useEffect(() => {\n        if (ref.current && registerSize) {\n            registerSize(ref.current.getBoundingClientRect().height);\n        }\n    }, []);\n\n    const content = renderer(data)?.();\n\n    if (!content) {\n        return null;\n    }\n\n    return (\n        <div className=\"border-grey-300 bg-grey-50 col-span-full border-b p-4\" ref={ref}>\n            {content}\n        </div>\n    );\n});\n"],"names":["ExpandedRow","React","memo","props","data","renderer","registerSize","ref","useRef","useEffect","current","getBoundingClientRect","height","content","_renderer","className"],"mappings":";;MASaA,WAAW,gBAAGC,cAAK,CAACC,IAAI,CAAC,SAASF,WAAWA,CAAkBG,KAA8B;;EACtG,MAAM;IAAEC,IAAI;IAAEC,QAAQ;IAAEC;GAAc,GAAGH,KAAK;EAC9C,MAAMI,GAAG,GAAGN,cAAK,CAACO,MAAM,CAAiB,IAAI,CAAC;EAE9CP,cAAK,CAACQ,SAAS,CAAC;IACZ,IAAIF,GAAG,CAACG,OAAO,IAAIJ,YAAY,EAAE;MAC7BA,YAAY,CAACC,GAAG,CAACG,OAAO,CAACC,qBAAqB,EAAE,CAACC,MAAM,CAAC;;GAE/D,EAAE,EAAE,CAAC;EAEN,MAAMC,OAAO,IAAAC,SAAA,GAAGT,QAAQ,CAACD,IAAI,CAAC,cAAAU,SAAA,uBAAdA,SAAA,EAAkB;EAElC,IAAI,CAACD,OAAO,EAAE;IACV,OAAO,IAAI;;EAGf,oBACIZ;IAAKc,SAAS,EAAC,uDAAuD;IAACR,GAAG,EAAEA;KACvEM,OAAO,CACN;AAEd,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/rows/Row.js

@@ -0,0 +1,327 @@
+import React__default from 'react';
+import cn from 'clsx';
+import { useFocusManager } from '@react-aria/focus';
+import { useDropTarget } from '../../../../utils/hooks/useDropTarget.js';
+import { RowContext, useRowContext } from './RowContext.js';
+import { focusableSelector, getColumnIndex, LastCellIndex } from '../../util/editing.js';
+
+const FOCUS_MANAGER_OPTIONS = {
+  tabbable: true,
+  // Filter out all focusable elelemnts which are not in current row
+  accept: element => !!element.closest('[role="row"][data-current="true"]')
+};
+function Row(props) {
+  var _tableMeta$validation, _tableMeta$validation2;
+  const focusManager = useFocusManager();
+  const tableMeta = props.table.options.meta;
+  const isActiveRow = tableMeta.rowActive.rowActiveIndex === props.index;
+  const isDraggingRow = tableMeta.rowDrag.dragging[props.row.id];
+  const isFirstRow = props.index === 0;
+  // we use non-css hovered state to determine whether to render actions or not, for performance
+  const [isHovered, setIsHovered] = React__default.useState(false);
+  // tab behaviour is consistent across normal mode and edit mode, handle it here
+  const handleKeyDown = event => {
+    if (event.isDefaultPrevented() || event.isPropagationStopped()) {
+      return;
+    }
+    if (event.key === 'Tab') {
+      tableMeta.rowActive.setHoverStatePaused(true);
+      let focusedElement;
+      if (event.shiftKey) {
+        // looping backwards
+        focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);
+        if (focusedElement) {
+          // override default behaviour, since we're handling focus internally now
+          event.preventDefault();
+        } else {
+          // there are no previous elements to focus, go up a row or go outside the table
+          if (!isFirstRow) {
+            event.preventDefault();
+            tableMeta.rowActive.setRowActiveIndex(props.index - 1);
+            setTimeout(() => focusManager.focusLast(FOCUS_MANAGER_OPTIONS), 1);
+          }
+        }
+      } else {
+        // looping forwards
+        focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);
+        if (focusedElement) {
+          // override default behaviour, since we're handling focus internally now
+          event.preventDefault();
+        } else {
+          // there are no next elements to focus, go down a row or go outside the table
+          if (!props.isLastRow) {
+            event.preventDefault();
+            tableMeta.rowActive.setRowActiveIndex(props.index + 1);
+            setTimeout(() => focusManager.focusFirst(FOCUS_MANAGER_OPTIONS), 1);
+          }
+        }
+      }
+    }
+  };
+  const hasError = !!Object.keys((_tableMeta$validation = (_tableMeta$validation2 = tableMeta.validation.errors) === null || _tableMeta$validation2 === void 0 ? void 0 : _tableMeta$validation2[props.row.id]) !== null && _tableMeta$validation !== void 0 ? _tableMeta$validation : {}).length;
+  // rows are heavily memoized because performance in our table is critical
+  // be careful and selective about props that you pass to the row
+  const memoedProps = {
+    data: props.row.original,
+    // aria-grabbed is being deprecated but there is no current alternative api, we use it until there is
+    'aria-grabbed': isDraggingRow ? true : tableMeta.rowDrag.isEnabled ? false : undefined,
+    'data-current': isActiveRow,
+    'data-selected': props.row.getIsSelected(),
+    'data-invalid': hasError,
+    draggable: tableMeta.rowDrag.isEnabled,
+    index: props.index,
+    onClick: tableMeta.rowClick.handleClick,
+    onDrop: tableMeta.rowDrop.isEnabled ? tableMeta.rowDrop.handleDrop : undefined
+  };
+  let output = /*#__PURE__*/React__default.createElement(MemoedRow, Object.assign({}, props, memoedProps, {
+    onKeyDown: handleKeyDown
+  }));
+  if (tableMeta.editing.isEditing && (isActiveRow || isHovered && !tableMeta.rowActive.isHoverStatePaused)) {
+    output = /*#__PURE__*/React__default.createElement(EditingRow, Object.assign({}, props, memoedProps, {
+      isFirstRow: isFirstRow,
+      setActiveRowIndex: tableMeta.rowActive.setRowActiveIndex
+    }));
+  }
+  // we store the row index in context because in a virtualised table the row index and the
+  // react table row index do not match when, for example, sorting is applied
+  const contextValue = React__default.useMemo(() => ({
+    isHovered,
+    setIsHovered,
+    rowIndex: props.index,
+    hasError
+  }), [isHovered, hasError, props.index]);
+  return /*#__PURE__*/React__default.createElement(RowContext.Provider, {
+    value: contextValue
+  }, output);
+}
+// turns out we might need some kind of "state" for the focused column, but it doesn't need to be react state that re-renders
+const lastCellIndex = /*#__PURE__*/new LastCellIndex();
+// This code is needed to avoid multiple rows being hovered at the same time (it happens since we use non-css hovering)
+let previouslyHoveredIndex;
+const unhoverPreviousRow = tableRef => {
+  if (previouslyHoveredIndex !== undefined) {
+    var _tableRef$current;
+    const mouseoutEvent = new MouseEvent('mouseout', {
+      view: window,
+      bubbles: true,
+      cancelable: true
+    });
+    const previouslyHovered = tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$current = tableRef.current) === null || _tableRef$current === void 0 ? void 0 : _tableRef$current.querySelector(`[data-row-index="${previouslyHoveredIndex}"]`);
+    previouslyHovered === null || previouslyHovered === void 0 ? void 0 : previouslyHovered.dispatchEvent(mouseoutEvent);
+  }
+};
+function EditingRow(props) {
+  const {
+    isFirstRow,
+    isLastRow,
+    onKeyDown,
+    setActiveRowIndex,
+    virtualiser,
+    ...attributes
+  } = props;
+  const focusManager = useFocusManager();
+  const tableMeta = props.table.options.meta;
+  const handleClickCapture = event => {
+    lastCellIndex.value = getColumnIndex(event.target);
+  };
+  const handleNavigationBackwards = event => {
+    let focusedElement;
+    if (event.key === 'ArrowLeft' || event.key === 'Tab' && event.shiftKey) {
+      // We need to perform special behaviour when focus reaches the end of the row,
+      // so we don't need default browser behaviour.
+      event.stopPropagation();
+      event.preventDefault();
+      tableMeta.rowActive.setHoverStatePaused(true);
+      // "CTRL + ArrowLeft" or "META + ArrowLeft" should focus first focusable element of the row
+      if (event.ctrlKey || event.metaKey) {
+        event.target.blur();
+        focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+        lastCellIndex.value = getColumnIndex(focusedElement);
+      } else {
+        // looping backwards
+        focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);
+        if (focusedElement) {
+          lastCellIndex.value = getColumnIndex(focusedElement);
+        } else {
+          // there are no previous elements to focus, go up a row (if there are rows above)
+          if (!isFirstRow || !event.currentTarget.contains(focusedElement)) {
+            event.preventDefault();
+            tableMeta.rowActive.setHoverStatePaused(true);
+            tableMeta.rowActive.setRowActiveIndex(props.index - 1);
+            setTimeout(() => {
+              focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);
+              // Need to update lastIndex when row got changed and last element got selected.
+              lastCellIndex.value = getColumnIndex(focusedElement);
+            }, 1);
+          }
+        }
+      }
+    }
+  };
+  const handleNavigationForward = event => {
+    let focusedElement;
+    if (event.key === 'ArrowRight' || event.key === 'Tab' && !event.shiftKey) {
+      // We need to perform special behaviour when focus reaches the end of the row,
+      // so we don't need default browser behaviour.
+      event.stopPropagation();
+      event.preventDefault();
+      tableMeta.rowActive.setHoverStatePaused(true);
+      // "CTRL + ArrowRight" or "META + ArrowRight" should focus last focusable element of the row
+      if (event.ctrlKey || event.metaKey) {
+        event.target.blur();
+        focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);
+        lastCellIndex.value = getColumnIndex(focusedElement);
+      } else {
+        // looping forwards
+        focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);
+        if (focusedElement) {
+          lastCellIndex.value = getColumnIndex(focusedElement);
+        } else {
+          // there are no next elements to focus, go down a row or go outside the table
+          if (!props.isLastRow && !event.currentTarget.contains(focusedElement)) {
+            event.preventDefault();
+            tableMeta.rowActive.setHoverStatePaused(true);
+            tableMeta.rowActive.setRowActiveIndex(props.index + 1);
+            setTimeout(() => {
+              focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+              // Need to update lastIndex when row got changed and last element got selected.
+              lastCellIndex.value = getColumnIndex(focusedElement);
+            }, 1);
+          }
+        }
+      }
+    }
+  };
+  React__default.useEffect(() => {
+    // if some row stuck in hovered state, we heed to unhover it when hover state is paused
+    if (tableMeta.rowActive.isHoverStatePaused) {
+      unhoverPreviousRow(props.tableRef);
+    }
+  }, [tableMeta.rowActive.isHoverStatePaused]);
+  const handleKeyDown = event => {
+    if (event.isDefaultPrevented() || event.isPropagationStopped() || tableMeta.editing.detailModeEditing || tableMeta.shortcutsState.isPaused) {
+      return;
+    }
+    handleNavigationBackwards(event);
+    handleNavigationForward(event);
+  };
+  // this ensures we focus either on a field or on the same column when keyboard navigating up/down
+  React__default.useEffect(() => {
+    // When table in searching state, whe should prevent editing control to be focused, because it will cause search field to loose focus.
+    // @ts-expect-error: fixing type issue while report and table3 TableMeta definitions live in parallel
+    if (tableMeta.rowActive.rowActiveIndex === props.index && !tableMeta.search.isSearching) {
+      if (lastCellIndex.value !== null) {
+        var _props$tableRef$curre;
+        const lastCellElement = (_props$tableRef$curre = props.tableRef.current) === null || _props$tableRef$curre === void 0 ? void 0 : _props$tableRef$curre.querySelector(`[role="row"][data-current="true"] [data-column-index="${lastCellIndex.value}"]`);
+        const focusableElement = lastCellElement === null || lastCellElement === void 0 ? void 0 : lastCellElement.querySelector(focusableSelector);
+        if (focusableElement) {
+          focusableElement.focus();
+          // if we found a cell but it doesn't contain focusable element, then we'll focus the first one in a row.
+        } else if (lastCellElement) {
+          const focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+          lastCellIndex.value = getColumnIndex(focusedElement);
+        }
+      } else {
+        const focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+        lastCellIndex.value = getColumnIndex(focusedElement);
+      }
+    }
+    // Need to subscribe to current row index and check is it a current row,
+    // for a situation where hovered row is the next row after current row...
+    // In this case row will not be re-rendered if user switch to next row, because hovered row also renders EditingRow.
+    // @ts-expect-error: fixing type issue while report and table3 TableMeta definitions live in parallel
+  }, [tableMeta.rowActive.rowActiveIndex, tableMeta.search.isSearching]);
+  return /*#__PURE__*/React__default.createElement(MemoedRow, Object.assign({}, attributes, {
+    onClickCapture: handleClickCapture,
+    onKeyDown: handleKeyDown
+  }));
+}
+const clickableElements = ['input', 'button', 'a', 'select', 'option', 'label', 'textarea'];
+const MemoedRow = /*#__PURE__*/React__default.memo(function MemoedRow(props) {
+  const {
+    data,
+    index,
+    isLastRow: _1,
+    measureRef,
+    onClick,
+    onClickCapture,
+    onDrop,
+    row,
+    table,
+    tableRef,
+    ...attributes
+  } = props;
+  const ref = React__default.useRef(null);
+  const tableMeta = table.options.meta;
+  const {
+    setIsHovered
+  } = useRowContext();
+  // we measure the first cell (since the row has display: contents) so that the virtualiser height is correct
+  React__default.useEffect(() => {
+    var _ref$current;
+    const firstCell = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.querySelector('[role=cell]:first-child');
+    if (firstCell) {
+      measureRef(firstCell);
+    }
+  }, [ref.current]);
+  // we use capture because it also picks up clicks on e.g. select checkboxes
+  const handleClickCapture = event => {
+    if (typeof onClickCapture === 'function') {
+      onClickCapture(event);
+    }
+    // do this in the next frame, otherwise it remounts the row and prevents row actions on hover from being clickable
+    requestAnimationFrame(() => tableMeta.rowActive.setRowActiveIndex(index));
+  };
+  const handleClick = event => {
+    if (typeof onClick === 'function') {
+      var _ref$current2;
+      const clickedElement = event.target;
+      if (!((_ref$current2 = ref.current) !== null && _ref$current2 !== void 0 && _ref$current2.contains(event.target)) || clickableElements.includes(clickedElement.tagName.toLowerCase()) || clickedElement.closest(clickableElements.map(tag => `[role=row] ${tag}`).join(','))) {
+        return;
+      }
+      onClick(event, data);
+    }
+  };
+  const handleMouseEnter = () => {
+    // When user moving mouse to fast, then some of the rows are getting stuck in hover state,
+    // because mouseleave event never got triggered, to avoid this to happen we're saving the index of last hovered row,
+    // so that we can unhover it when new row got hovered, and saving it in a variable outside of react to save in performance,
+    // since it would be very performance heavy to use state which is bound to mouse events.
+    if (previouslyHoveredIndex !== undefined) {
+      if (previouslyHoveredIndex !== index) {
+        unhoverPreviousRow(tableRef);
+        previouslyHoveredIndex = index;
+      }
+    } else {
+      previouslyHoveredIndex = index;
+    }
+    setIsHovered(true);
+  };
+  const handleMouseLeave = () => {
+    if (previouslyHoveredIndex === index) {
+      previouslyHoveredIndex = undefined;
+    }
+    setIsHovered(false);
+  };
+  const [isDraggedOver, dropTargetProps] = useDropTarget(event => onDrop === null || onDrop === void 0 ? void 0 : onDrop(event, row.original));
+  const className = cn('group/row contents',
+  // resizing column requires dragging, which means the mouse might (on rare occasions) move over rows and trigger hover state
+  // that in turn triggers rendering of e.g. row actions, which could cause janky ui - so don't allow mouse interaction when resizing
+  '[[role="table"][data-resizing="true"]_&]:pointer-events-none', {
+    'hover:cursor-pointer': typeof onClick === 'function'
+  });
+  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, attributes, onDrop ? dropTargetProps : undefined, {
+    className: className,
+    "data-row-index": index,
+    "data-dragged-over": isDraggedOver,
+    onClick: handleClick,
+    onClickCapture: handleClickCapture,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    role: "row",
+    ref: ref
+  }));
+});
+
+export { Row, lastCellIndex };
+//# sourceMappingURL=Row.js.map