@economic/taco 2.67.0 → 2.67.1-create-handler-active-row.0

package/dist/taco.cjs

@@ -26978,7 +26978,7 @@ const Content$4 = React__namespace.forwardRef(function HangerContent(props, ref)
   const context = React__namespace.useContext(HangerContext);
   const { texts } = useLocalization();
   const className = clsx(
-    "wcag-blue-500 border border-transparent rounded p-3 pr-12 yt-shadow focus:border-transparent max-w-sm",
+    "wcag-blue-500 border border-transparent rounded p-3 pr-12 yt-shadow focus:border-transparent max-w-sm print:hidden",
     props.className
   );
   const handleInteractOutside = (event) => {
@@ -39030,6 +39030,9 @@ function Header$1(props) {
   if (canHide) {
     memoedProps.onHide = header.column.getToggleVisibilityHandler();
   }
+  if (header.id === "__expansion") {
+    memoedProps.isExpanded = table.getIsSomeRowsExpanded();
+  }
   if (canPin) {
     memoedProps.onPin = (index2) => {
       table.setColumnPinning((pinningState) => {
@@ -39080,6 +39083,7 @@ const MemoedHeader = React.memo(function MemoedHeader2(props) {
     hasMenu,
     id: id2,
     index: index2,
+    isExpanded,
     isFiltered,
     isGroup: isGroup2,
     isPinned,
@@ -39119,6 +39123,7 @@ const MemoedHeader = React.memo(function MemoedHeader2(props) {
       "data-cell-id": id2,
       "data-cell-pinned": isPinned ? isPinned : void 0,
       "data-taco": isGroup2 ? "grouped-column-header" : "column-header",
+      "data-rows-expanded": isExpanded ? isExpanded : void 0,
       style,
       ref: setRef
     },
@@ -39313,10 +39318,10 @@ function Summary(props) {
   } else if (!tableMeta.server.isEnabled && (((_a = table.getState().columnFilters) == null ? void 0 : _a.length) || // filtered data
   !!table.getState().globalFilter && table.options.enableGlobalFilter)) {
     label = texts.table.footer.summary.records;
-    count2 = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("strong", null, new Intl.NumberFormat(locale2).format(currentLength)), " ", texts.table.footer.summary.count, " ", /* @__PURE__ */ React.createElement("strong", null, new Intl.NumberFormat(locale2).format(length)));
+    count2 = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("strong", { "data-taco": "table-footer-current-count" }, new Intl.NumberFormat(locale2).format(currentLength)), " ", texts.table.footer.summary.count, " ", /* @__PURE__ */ React.createElement("strong", { "data-taco": "table-footer-total-count" }, new Intl.NumberFormat(locale2).format(length)));
   } else {
     label = texts.table.footer.summary.records;
-    count2 = /* @__PURE__ */ React.createElement("strong", null, new Intl.NumberFormat(locale2).format(length));
+    count2 = /* @__PURE__ */ React.createElement("strong", { "data-taco": "table-footer-total-count" }, new Intl.NumberFormat(locale2).format(length));
   }
   return /* @__PURE__ */ React.createElement(
     "div",
@@ -45167,6 +45172,7 @@ function Print(props) {
     {
       icon: "print",
       "aria-label": texts.table.print.tooltip,
+      id: `${tableId}-toolbar-print`,
       dialog: (dialogProps) => /* @__PURE__ */ React.createElement(
         PrintDialog,
         {
@@ -45503,7 +45509,7 @@ function Filter(props) {
       ref.current.focus();
     }
   }, [id2]);
-  return /* @__PURE__ */ React.createElement("div", { className: "flex items-start gap-2" }, /* @__PURE__ */ React.createElement("div", { className: "flex min-h-[theme(spacing.8)] w-14 flex-shrink-0 items-center justify-end pr-2 text-right" }, position > 0 ? texts.table.filters.conditions.and : texts.table.filters.conditions.where), /* @__PURE__ */ React.createElement(FilterColumn, { allHeaders, onChange: handleChangeColumn, value: id2, ref }), /* @__PURE__ */ React.createElement(FilterComparator, { column: column == null ? void 0 : column.column, onChange: handleChangeComparator, value: comparator }), /* @__PURE__ */ React.createElement(FilterValue, { column: column == null ? void 0 : column.column, comparator, onChange: handleChangeValue, value }), onRemove ? /* @__PURE__ */ React.createElement(IconButton, { appearance: "discrete", className: "ml-auto", icon: "close", onClick: handleRemove }) : null);
+  return /* @__PURE__ */ React.createElement("div", { className: "flex items-start gap-2", "data-taco": "filter-row" }, /* @__PURE__ */ React.createElement("div", { className: "flex min-h-[theme(spacing.8)] w-14 flex-shrink-0 items-center justify-end pr-2 text-right" }, position > 0 ? texts.table.filters.conditions.and : texts.table.filters.conditions.where), /* @__PURE__ */ React.createElement(FilterColumn, { allHeaders, onChange: handleChangeColumn, value: id2, ref }), /* @__PURE__ */ React.createElement(FilterComparator, { column: column == null ? void 0 : column.column, onChange: handleChangeComparator, value: comparator }), /* @__PURE__ */ React.createElement(FilterValue, { column: column == null ? void 0 : column.column, comparator, onChange: handleChangeValue, value }), onRemove ? /* @__PURE__ */ React.createElement(IconButton, { appearance: "discrete", className: "ml-auto", icon: "close", onClick: handleRemove }) : null);
 }
 const placeholderFilter = { id: "", value: { comparator: TableFilterComparator.Contains, value: void 0 } };
 function ManageFiltersPopover(props) {
@@ -45584,10 +45590,10 @@ function ManageFiltersPopover(props) {
       onChange: handleChangeFilter,
       onRemove: filters.length > 0 && filters.some((f2) => f2.id) || filters.length > 1 ? handleRemoveFilter : void 0
     }
-  )), /* @__PURE__ */ React.createElement("div", { className: "justify-start" }, /* @__PURE__ */ React.createElement(Button$4, { appearance: "discrete", onClick: handleCreate }, "+ ", texts.table.filters.buttons.addFilter))), /* @__PURE__ */ React.createElement(Group$6, { className: "ml-auto" }, /* @__PURE__ */ React.createElement(Popover.Close, null, /* @__PURE__ */ React.createElement(Button$4, null, texts.table.filters.buttons.cancel)), /* @__PURE__ */ React.createElement(Button$4, { onClick: handleClear }, texts.table.filters.buttons.clear), /* @__PURE__ */ React.createElement(Button$4, { appearance: "primary", onClick: handleApply }, texts.table.filters.buttons.apply))))));
+  )), /* @__PURE__ */ React.createElement("div", { className: "justify-start" }, /* @__PURE__ */ React.createElement(Button$4, { appearance: "discrete", onClick: handleCreate, name: "add-filter" }, "+ ", texts.table.filters.buttons.addFilter))), /* @__PURE__ */ React.createElement(Group$6, { className: "ml-auto" }, /* @__PURE__ */ React.createElement(Popover.Close, null, /* @__PURE__ */ React.createElement(Button$4, { name: "close-filters" }, texts.table.filters.buttons.cancel)), /* @__PURE__ */ React.createElement(Button$4, { name: "clear-filters", onClick: handleClear }, texts.table.filters.buttons.clear), /* @__PURE__ */ React.createElement(Button$4, { appearance: "primary", name: "apply-filters", onClick: handleApply }, texts.table.filters.buttons.apply))))));
 }
 function Filters(props) {
-  const { length, table } = props;
+  const { length, tableId, table } = props;
   const { texts } = useLocalization();
   const isLargeScreen = useIsLargeScreen();
   const columnFilters = table.getState().columnFilters;
@@ -45600,7 +45606,8 @@ function Filters(props) {
     popover: (popoverProps) => /* @__PURE__ */ React.createElement(ManageFiltersPopover, { ...popoverProps, length, table }),
     shortcut: shortcut2,
     ref,
-    tooltip: /* @__PURE__ */ React.createElement(React.Fragment, null, texts.table.filters.tooltip, /* @__PURE__ */ React.createElement(Shortcut, { className: "ml-2", keys: shortcut2 }))
+    tooltip: /* @__PURE__ */ React.createElement(React.Fragment, null, texts.table.filters.tooltip, /* @__PURE__ */ React.createElement(Shortcut, { className: "ml-2", keys: shortcut2 })),
+    id: `${tableId}-toolbar-filters`
   };
   React.useEffect(() => {
     var _a;
@@ -45633,7 +45640,7 @@ function TableToolbar(props) {
       "data-taco": "table-toolbar"
     },
     table.props.toolbarLeft,
-    /* @__PURE__ */ React.createElement(Group$6, { className: "ml-auto flex-shrink-0 items-center print:hidden" }, customTools, canFilter ? /* @__PURE__ */ React.createElement(Filters, { length: table.meta.length, table: table.instance }) : null, table.props.toolbarRight, canPrint ? /* @__PURE__ */ React.createElement(Print, { table: table.instance, tableId: table.id, tableRef: table.ref }) : null, canSettings ? /* @__PURE__ */ React.createElement(Settings, { customSettings: table.props.customSettings, id: `${id2}-settings`, table: table.instance }) : null, canSearch ? /* @__PURE__ */ React.createElement(Search$1, { scrollToIndex: table.renderer.scrollToIndex, table: table.instance, tableRef: table.ref }) : null)
+    /* @__PURE__ */ React.createElement(Group$6, { className: "ml-auto flex-shrink-0 items-center print:hidden" }, customTools, canFilter ? /* @__PURE__ */ React.createElement(Filters, { length: table.meta.length, tableId: table.id, table: table.instance }) : null, table.props.toolbarRight, canPrint ? /* @__PURE__ */ React.createElement(Print, { table: table.instance, tableId: table.id, tableRef: table.ref }) : null, canSettings ? /* @__PURE__ */ React.createElement(Settings, { customSettings: table.props.customSettings, id: `${id2}-settings`, table: table.instance }) : null, canSearch ? /* @__PURE__ */ React.createElement(Search$1, { scrollToIndex: table.renderer.scrollToIndex, table: table.instance, tableRef: table.ref }) : null)
   ), table.props.toolbarPanel ? /* @__PURE__ */ React.createElement("div", { className: "mb-4" }, table.props.toolbarPanel) : void 0);
 }
 function canChangeSettings(table, customSettings) {
@@ -55666,6 +55673,7 @@ function useTableEditing(isEnabled = false, defaultToggleEditing = false, handle
     pendingChangesFns.saveChanges(table);
   }
   async function createRow2(table, row) {
+    var _a, _b;
     if (!handleCreate) {
       return;
     }
@@ -55676,7 +55684,10 @@ function useTableEditing(isEnabled = false, defaultToggleEditing = false, handle
         return;
       }
     }
-    const changeset = row ?? await handleCreate();
+    const currentRow = ((_a = table.options.meta) == null ? void 0 : _a.rowActive.rowActiveIndex) !== void 0 ? table.getRowModel().flatRows[(_b = table.options.meta) == null ? void 0 : _b.rowActive.rowActiveIndex] : void 0;
+    const changeset = row ?? await handleCreate({
+      activeRow: currentRow ? { ...currentRow.original, ...tableMeta.editing.getRowValue(currentRow.id) } : void 0
+    });
     try {
       if (changeset) {
         const temporaryRows = tableMeta.editing.temporaryRows;
@@ -55685,10 +55696,10 @@ function useTableEditing(isEnabled = false, defaultToggleEditing = false, handle
         requestAnimationFrame(() => {
           const newRowId = pendingChangesFns.insertTemporaryRow(changeset, nextRowIndex);
           table.setRowPinning((currentState) => {
-            var _a;
+            var _a2;
             return {
               ...currentState,
-              bottom: (_a = currentState.bottom ?? []) == null ? void 0 : _a.concat(newRowId)
+              bottom: (_a2 = currentState.bottom ?? []) == null ? void 0 : _a2.concat(newRowId)
             };
           });
           toggleDetailedMode(false);