@economic/taco 2.51.3-alpha.1 → 2.52.0

package/dist/taco.cjs.development.js

@@ -27,7 +27,7 @@ var CollapsiblePrimitive = require('@radix-ui/react-collapsible');
 var PrimitiveSwitch = require('@radix-ui/react-switch');
 var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
 var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
-var reactPortal = require('@radix-ui/react-portal');
+var ReactDOM = _interopDefault(require('react-dom'));
 var reactTable = require('@tanstack/react-table');
 var get = _interopDefault(require('lodash/get'));
 var reactVirtual = require('@tanstack/react-virtual');
@@ -9805,6 +9805,20 @@ const insertToastWithoutDuplicates = (currentToasts, id, content, options, close
   }
   return nextToasts;
 };
+const Portal$1 = props => {
+  var _globalThis$document;
+  const {
+    children,
+    container: containerProp,
+    ...portalProps
+  } = props;
+  const [mounted, setMounted] = React.useState(false);
+  React.useLayoutEffect(() => setMounted(true), []);
+  const container = containerProp || mounted && (globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body);
+  return container ? /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement("div", Object.assign({}, portalProps, {
+    "data-taco": "portal"
+  }), children), container) : null;
+};
 const ToastProvider = ({
   children,
   ...props
@@ -9896,7 +9910,7 @@ const ToastProvider = ({
   }, []);
   return /*#__PURE__*/React.createElement(ToastContext.Provider, Object.assign({}, props, {
     value: toaster
-  }), children, /*#__PURE__*/React.createElement(reactPortal.Portal, null, /*#__PURE__*/React.createElement("div", {
+  }), children, /*#__PURE__*/React.createElement(Portal$1, null, /*#__PURE__*/React.createElement("div", {
     id: "yt-toast__container",
     className: "pointer-events-all absolute !left-auto bottom-0 right-0 z-[1000] mb-4 mr-4 flex max-w-md flex-col items-end justify-end",
     role: "log"
@@ -10451,8 +10465,10 @@ function processChildren(child, columns, defaultSizing, defaultSorting, defaultV
       // To avoid errors caused by undefined row data values, we pass accessorFn as a preventive measure
       // accessorKey can be dot notated strings, so we use lodash.get to access deeply nested children
       accessorFn: row => get(row, accessorKey),
-      // The header can be either a string or a JSX.Element, but react-table expects it to be a string or a renderer function, so `() => header` ensures compatibility
-      header: () => header,
+      // The header can be either a string or a JSX.Element, but react-table expects it to be a string or a
+      // renderer function, so `() => header` ensures compatibility when header is a JSX.Element.
+      // If we just pass `() => header`, then we will loose truncation for string headers.
+      header: typeof header === 'string' ? header : () => header,
       // features
       enableColumnFilter,
       enableGlobalFilter,
@@ -11986,6 +12002,7 @@ function useTableManager(props, meta, internalColumns) {
       fontSize,
       footer,
       length,
+      onEvent: props.onEvent,
       printing,
       rowActions: rowActions,
       rowActive,
@@ -14086,29 +14103,39 @@ function Summary(props) {
 }
 
 function Foot(props) {
+  var _nonGroupedHeaders$fi;
   const {
     children,
     table,
     ...attributes
   } = props;
+  const tableMeta = table.options.meta;
   const nonGroupedHeaders = table.getFooterGroups()[0].headers.filter(header => !header.column.getIsGrouped());
+  const firstVisibleExternalColumnIndex = (_nonGroupedHeaders$fi = nonGroupedHeaders.find(header => {
+    var _header$column$column;
+    return !isInternalColumn(header.id) && ((_header$column$column = header.column.columnDef.meta) === null || _header$column$column === void 0 ? void 0 : _header$column$column.enablePrinting) !== false;
+  })) === null || _nonGroupedHeaders$fi === void 0 ? void 0 : _nonGroupedHeaders$fi.index;
+  // During printing, the summary should be displayed in the first visible external column,
+  // as internal and hidden columns are excluded from the printed document.
+  // However, in the normal table view, the summary should appear in the first column.
+  const summaryColumnIndex = tableMeta.printing.isPrinting ? firstVisibleExternalColumnIndex : 0;
   return /*#__PURE__*/React__default.createElement("tfoot", Object.assign({}, attributes), children, /*#__PURE__*/React__default.createElement("tr", null, nonGroupedHeaders.map((header, index) => (/*#__PURE__*/React__default.createElement(Footer$3, {
     key: header.id,
     header: header,
-    index: index
+    showSummary: index === summaryColumnIndex
   })))));
 }
 function Footer$3(props) {
   return /*#__PURE__*/React__default.createElement(MemoedFooter, {
     footer: props.header,
-    index: props.index
+    showSummary: props.showSummary
   });
 }
 const MemoedFooter = /*#__PURE__*/React__default.memo(function MemoedFooter(props) {
   var _footer$subHeaders, _footer$subHeaders$fi;
   const {
     footer,
-    index
+    showSummary
   } = props;
   const columnMeta = footer.column.columnDef.meta;
   // getIsPinned returns true for split header groups, even if the split group has no pinned sub headers
@@ -14121,7 +14148,8 @@ const MemoedFooter = /*#__PURE__*/React__default.memo(function MemoedFooter(prop
   }
   let content;
   let align;
-  if (index === 0) {
+  // Summary should only be appended to the first visible external column, as internal columns like the select column will be hidden in the print view.
+  if (showSummary) {
     align = 'left';
     content = /*#__PURE__*/React__default.createElement(Summary, {
       table: footer.getContext().table
@@ -19538,7 +19566,6 @@ function useTableEditing(isEnabled = false, handleSave, handleChange, handleCrea
       var _tableMeta$rowActive$, _table$getRowModel$ro;
       const index = (_tableMeta$rowActive$ = tableMeta.rowActive.rowActiveIndex) !== null && _tableMeta$rowActive$ !== void 0 ? _tableMeta$rowActive$ : 0;
       if (tableMeta.rowActive.rowActiveIndex === undefined) {
-        console.log('edit toggle active', index);
         tableMeta.rowActive.setRowActiveIndex(index);
       }
       if (!isTemporaryRow((_table$getRowModel$ro = table.getRowModel().rows[index]) === null || _table$getRowModel$ro === void 0 ? void 0 : _table$getRowModel$ro.id)) {
@@ -19903,32 +19930,6 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
     ref: controlRef,
     tabIndex
   };
-  if (typeof type === 'function') {
-    const controlFnProps = {
-      ...commonProps,
-      invalid,
-      setValue: onChange,
-      value
-    };
-    return type(controlFnProps, {
-      ...row,
-      ...rowPendingChanges
-    });
-  }
-  if (type === 'switch') {
-    return /*#__PURE__*/React__default.createElement(Switch, Object.assign({}, commonProps, {
-      checked: Boolean(value),
-      onChange: onChange,
-      ref: controlRef
-    }));
-  }
-  if (type === 'checkbox') {
-    return /*#__PURE__*/React__default.createElement(Checkbox, Object.assign({}, commonProps, {
-      checked: Boolean(value),
-      onChange: onChange,
-      ref: controlRef
-    }));
-  }
   const handleInputKeyDown = event => {
     const target = event.target;
     if (target.readOnly) {
@@ -19976,6 +19977,39 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
       toggleDetailedMode(true);
     }
   };
+  if (typeof type === 'function') {
+    const controlFnProps = {
+      ...commonProps,
+      invalid,
+      setValue: onChange,
+      onKeyDown: event => {
+        const target = event.target || null;
+        // it make sense to handle keydown for the custom edititng controls only if target is either input or textarea
+        if (target && (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA')) {
+          handleInputKeyDown(event);
+        }
+      },
+      value
+    };
+    return type(controlFnProps, {
+      ...row,
+      ...rowPendingChanges
+    });
+  }
+  if (type === 'switch') {
+    return /*#__PURE__*/React__default.createElement(Switch, Object.assign({}, commonProps, {
+      checked: Boolean(value),
+      onChange: onChange,
+      ref: controlRef
+    }));
+  }
+  if (type === 'checkbox') {
+    return /*#__PURE__*/React__default.createElement(Checkbox, Object.assign({}, commonProps, {
+      checked: Boolean(value),
+      onChange: onChange,
+      ref: controlRef
+    }));
+  }
   const handleFocus = event => {
     if (!isDetailedMode) {
       event.target.select();
@@ -20453,7 +20487,11 @@ function Editing(props) {
   const ref = React__default.useRef(null);
   const tableMeta = table.options.meta;
   const handleChange = enabled => {
+    var _tableMeta$onEvent;
     tableMeta.editing.toggleEditing(enabled, table, scrollToIndex);
+    (_tableMeta$onEvent = tableMeta.onEvent) === null || _tableMeta$onEvent === void 0 ? void 0 : _tableMeta$onEvent.call(tableMeta, 'editing-mode', {
+      enabled
+    });
   };
   const tooltip = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, texts.table3.editing.buttons.edit.tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
     className: "ml-2",