@nu-grid/nuxt 0.1.1

package/dist/runtime/composables/_internal/useNuGridAddRow.js

@@ -0,0 +1,735 @@
+import { createRow } from "@tanstack/table-core";
+import { computed, isRef, nextTick, onUnmounted, ref, shallowRef, watch } from "vue";
+export const ADD_ROW_FLAG = "__nugridAddNewRow";
+function resolvePosition(addNewRow) {
+  if (!addNewRow) {
+    return "none";
+  }
+  if (addNewRow === true) {
+    return "bottom";
+  }
+  return addNewRow.position ?? "bottom";
+}
+function isAddRowRecord(record) {
+  return !!record?.[ADD_ROW_FLAG];
+}
+function createAddRowRecord(groupingValues, uniqueSuffix) {
+  const idSuffix = uniqueSuffix ?? `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+  const base = groupingValues ? { ...groupingValues } : {};
+  base[ADD_ROW_FLAG] = true;
+  if (base.id === void 0) {
+    base.id = `add-new-${idSuffix}`;
+  }
+  return base;
+}
+export function useNuGridAddRow(options) {
+  const addRowPosition = computed(() => resolvePosition(options.props.addNewRow));
+  const showAddNewRow = computed(() => addRowPosition.value !== "none");
+  const addNewText = computed(() => {
+    const addNewRow = options.props.addNewRow;
+    if (typeof addNewRow === "object" && addNewRow.addNewText) {
+      return addNewRow.addNewText;
+    }
+    return "Click here to add";
+  });
+  const addRowDraft = ref(null);
+  const addRowRow = shallowRef(null);
+  const groupAddRowDrafts = shallowRef(/* @__PURE__ */ new Map());
+  const groupAddRowRows = shallowRef(/* @__PURE__ */ new Map());
+  const addRowTransitioning = ref(false);
+  const isFinalizing = ref(false);
+  const finalizingRowId = ref(null);
+  let unregisterPointer = null;
+  function getCurrentEditingValue(editingValue, fallbackValue) {
+    const isRef2 = editingValue && typeof editingValue === "object" && "value" in editingValue;
+    return isRef2 ? editingValue.value ?? fallbackValue : editingValue ?? fallbackValue;
+  }
+  function stopEventPropagation() {
+    return {
+      handled: true,
+      stop: true,
+      preventDefault: true,
+      stopPropagation: true
+    };
+  }
+  let unregisterCellClick = null;
+  function collectGroupRows(rows, all) {
+    rows.forEach((row) => {
+      if (row.getIsGrouped?.()) {
+        all.push(row);
+        if (row.subRows?.length) {
+          collectGroupRows(row.subRows, all);
+        }
+      }
+    });
+  }
+  function resetAddRowRow() {
+    addRowDraft.value = null;
+    addRowRow.value = null;
+  }
+  function resetAddRow(row) {
+    if (!isAddRowRow(row)) {
+      return;
+    }
+    if (options.groupingState.value.length) {
+      const parentId = row.parentId;
+      if (parentId) {
+        groupAddRowDrafts.value.delete(parentId);
+        groupAddRowRows.value.delete(parentId);
+      }
+    } else {
+      resetAddRowRow();
+    }
+    refreshAddRows();
+  }
+  function resetGroupedAddRows() {
+    groupAddRowDrafts.value = /* @__PURE__ */ new Map();
+    groupAddRowRows.value = /* @__PURE__ */ new Map();
+  }
+  function ensureAddRowRow() {
+    if (addRowRow.value) {
+      if (addRowDraft.value) {
+        if (addRowRow.value.original !== addRowDraft.value) {
+          const id2 = addRowDraft.value.id ?? `add-new-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+          const rowIndex2 = options.rows.value.length;
+          addRowRow.value = createRow(
+            options.table,
+            id2,
+            addRowDraft.value,
+            rowIndex2,
+            0,
+            void 0,
+            void 0
+          );
+        }
+      }
+      return addRowRow.value;
+    }
+    const draft = addRowDraft.value ?? createAddRowRecord();
+    addRowDraft.value = draft;
+    const id = draft.id ?? `add-new-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+    const rowIndex = options.rows.value.length;
+    addRowRow.value = createRow(
+      options.table,
+      id,
+      draft,
+      rowIndex,
+      0,
+      void 0,
+      void 0
+    );
+    return addRowRow.value;
+  }
+  const orderedRows = computed(() => {
+    if (!showAddNewRow.value || addRowPosition.value === "none") {
+      return options.rows.value;
+    }
+    if (options.groupingState.value.length) {
+      return options.rows.value;
+    }
+    const addRow = ensureAddRowRow();
+    if (addRowPosition.value === "top") {
+      return [addRow, ...options.rows.value];
+    }
+    return [...options.rows.value, addRow];
+  });
+  function resolveGroupingFns() {
+    if (!options.groupingFns) {
+      return null;
+    }
+    return isRef(options.groupingFns) ? options.groupingFns.value : options.groupingFns;
+  }
+  function findEditingRow(editingCell, useOrderedRows = true) {
+    const groupingFns = resolveGroupingFns();
+    const rowsList = useOrderedRows ? groupingFns?.navigableRows?.value ?? orderedRows.value : groupingFns?.navigableRows?.value ?? options.rows.value;
+    return rowsList.find((r) => r.id === editingCell.rowId);
+  }
+  function focusNewAddRow() {
+    nextTick(() => {
+      if (options.focusFns?.value && options.cellEditingFns?.value) {
+        const groupingFns = resolveGroupingFns();
+        const rowsList = groupingFns?.navigableRows?.value ?? orderedRows.value;
+        const newAddRow = rowsList.find((r) => isAddRowRow(r));
+        if (newAddRow) {
+          const firstEditableCell = newAddRow.getVisibleCells().find((c) => options.cellEditingFns?.value?.isCellEditable(newAddRow, c));
+          if (firstEditableCell && options.focusFns.value && options.cellEditingFns?.value) {
+            options.cellEditingFns.value.startEditing(newAddRow, firstEditableCell);
+          }
+        }
+      }
+    });
+  }
+  function resolveGroupingValue(groupRow, columnId) {
+    const rowsById = options.table.getRowModel()?.rowsById ?? {};
+    let current = groupRow;
+    while (current) {
+      const value = current.getValue(columnId);
+      if (value !== void 0) {
+        return value;
+      }
+      const parentId = current.parentId;
+      current = parentId ? rowsById[parentId] : null;
+    }
+    return void 0;
+  }
+  function buildGroupingValues(groupRow) {
+    const values = {};
+    options.groupingState.value.forEach((columnId) => {
+      const value = resolveGroupingValue(groupRow, columnId);
+      if (value !== void 0) {
+        values[columnId] = value;
+      }
+    });
+    return values;
+  }
+  function refreshAddRows() {
+    if (!showAddNewRow.value) {
+      resetAddRowRow();
+      resetGroupedAddRows();
+      return;
+    }
+    const grouping = options.groupingState.value;
+    if (!grouping.length) {
+      resetGroupedAddRows();
+      if (!addRowDraft.value) {
+        resetAddRowRow();
+      }
+      ensureAddRowRow();
+      return;
+    }
+    resetAddRowRow();
+    const groupRows = options.table.getSortedRowModel().rows;
+    const allGroupRows = [];
+    collectGroupRows(groupRows, allGroupRows);
+    const nextDrafts = /* @__PURE__ */ new Map();
+    const nextRows = /* @__PURE__ */ new Map();
+    allGroupRows.forEach((groupRow) => {
+      if (!groupRow.getIsGrouped?.() || !groupRow.subRows?.length) {
+        return;
+      }
+      const hasNestedGroups = groupRow.subRows.some((subRow) => subRow.getIsGrouped?.());
+      if (hasNestedGroups) {
+        return;
+      }
+      const existingDraft = groupAddRowDrafts.value.get(groupRow.id);
+      const draft = existingDraft ?? createAddRowRecord(buildGroupingValues(groupRow));
+      nextDrafts.set(groupRow.id, draft);
+      const id = draft.id ?? `${groupRow.id}-add-new`;
+      const rowIndex = groupRow.subRows?.length ?? 0;
+      const depth = groupRow.depth ?? (groupRow.parentId ? 1 : 0);
+      const row = createRow(
+        options.table,
+        id,
+        draft,
+        rowIndex,
+        depth + 1,
+        void 0,
+        groupRow.id
+      );
+      nextRows.set(groupRow.id, row);
+    });
+    groupAddRowDrafts.value = nextDrafts;
+    groupAddRowRows.value = nextRows;
+  }
+  function isAddRowRow(row) {
+    return isAddRowRecord(row.original);
+  }
+  function normalizeValidation(result) {
+    if (result === void 0 || result === null) return { valid: true };
+    if (typeof result === "boolean") return { valid: result };
+    if (typeof result === "string") return { valid: false, message: result };
+    if (typeof result === "object" && "valid" in result) {
+      return { valid: !!result.valid, message: result.message };
+    }
+    return { valid: true };
+  }
+  function validateAddRow(row) {
+    const messages = [];
+    const cols = options.columns.value;
+    cols.forEach((column) => {
+      const columnDef = column?.columnDef ?? column;
+      if (!columnDef || column?.columns) {
+        return;
+      }
+      if (columnDef.showNew === false) {
+        return;
+      }
+      const columnId = column?.id ?? column?.accessorKey ?? columnDef?.id;
+      if (!columnId) {
+        return;
+      }
+      const value = row.getValue(columnId);
+      const required = typeof columnDef.requiredNew === "function" ? columnDef.requiredNew() : columnDef.requiredNew;
+      if (required && (value === void 0 || value === null || value === "")) {
+        messages.push(`${columnId} is required`);
+        return;
+      }
+      if (columnDef.validateNew) {
+        const res = normalizeValidation(columnDef.validateNew(value));
+        if (!res.valid) {
+          messages.push(res.message || `${columnId} is invalid`);
+        }
+      }
+    });
+    return { success: messages.length === 0, messages };
+  }
+  function finalizeAddRow(row) {
+    if (!isAddRowRow(row)) {
+      return { success: true };
+    }
+    if (isFinalizing.value && finalizingRowId.value === row.id) {
+      return { success: true };
+    }
+    isFinalizing.value = true;
+    finalizingRowId.value = row.id;
+    const validation = validateAddRow(row);
+    if (!validation.success) {
+      isFinalizing.value = false;
+      finalizingRowId.value = null;
+      return validation;
+    }
+    let newRow = { ...row.original };
+    delete newRow[ADD_ROW_FLAG];
+    if (options.onAddRowRequested) {
+      try {
+        const result = options.onAddRowRequested(newRow);
+        if (!result.success) {
+          isFinalizing.value = false;
+          finalizingRowId.value = null;
+          return { success: false, messages: result.messages };
+        }
+        if (result.row) {
+          newRow = result.row;
+        }
+      } catch (error) {
+        isFinalizing.value = false;
+        finalizingRowId.value = null;
+        return {
+          success: false,
+          messages: [error?.message || "Add row failed"]
+        };
+      }
+    }
+    if (options.groupingState.value.length) {
+      const parentId = row.parentId;
+      if (parentId) {
+        groupAddRowDrafts.value.delete(parentId);
+        groupAddRowRows.value.delete(parentId);
+      }
+    } else {
+      resetAddRowRow();
+    }
+    refreshAddRows();
+    setTimeout(() => {
+      if (finalizingRowId.value === row.id) {
+        isFinalizing.value = false;
+        finalizingRowId.value = null;
+      }
+    }, 100);
+    return { success: true };
+  }
+  const addRowState = computed(() => {
+    const groupingFns = resolveGroupingFns();
+    const editing = options.editingCell?.value;
+    if (editing) {
+      const rootAddRow = addRowRow.value;
+      if (rootAddRow && rootAddRow.id === editing.rowId) {
+        return "editing";
+      }
+      const rowsList = groupingFns?.navigableRows?.value ?? options.rows.value;
+      const editingRow = rowsList.find((row) => row.id === editing.rowId);
+      if (editingRow && isAddRowRow(editingRow)) {
+        return "editing";
+      }
+      if (groupingFns?.groupRows?.value?.length) {
+        for (const groupRow of groupingFns.groupRows.value) {
+          const groupAddRow = groupAddRowRows.value.get(groupRow.id);
+          if (groupAddRow && groupAddRow.id === editing.rowId) {
+            return "editing";
+          }
+        }
+      }
+    }
+    if (addRowTransitioning.value) {
+      return "editing";
+    }
+    const focus = options.focusFns?.value?.focusedCell.value;
+    if (focus) {
+      let rowsList;
+      if (groupingFns?.navigableRows?.value) {
+        rowsList = groupingFns.navigableRows.value;
+      } else if (showAddNewRow.value && addRowPosition.value !== "none" && !options.groupingState.value.length) {
+        const addRow = addRowRow.value;
+        if (addRow) {
+          if (addRowPosition.value === "top") {
+            rowsList = [addRow, ...options.rows.value];
+          } else {
+            rowsList = [...options.rows.value, addRow];
+          }
+        } else {
+          rowsList = options.rows.value;
+        }
+      } else {
+        rowsList = options.rows.value;
+      }
+      const focusedRow = rowsList[focus.rowIndex];
+      if (focusedRow && isAddRowRow(focusedRow)) {
+        return "focused";
+      }
+      if (focusedRow && groupingFns?.groupRows?.value?.length) {
+        for (const groupRow of groupingFns.groupRows.value) {
+          const groupAddRow = groupAddRowRows.value.get(groupRow.id);
+          if (groupAddRow && groupAddRow.id === focusedRow.id) {
+            return "focused";
+          }
+        }
+      }
+    }
+    return "idle";
+  });
+  if (options.onAddRowStateChange) {
+    watch(
+      addRowState,
+      (next, prev) => {
+        if (next !== prev) {
+          options.onAddRowStateChange?.(next);
+        }
+      },
+      { immediate: true }
+    );
+  }
+  const isEditingAddRow = () => {
+    const editing = options.editingCell?.value;
+    if (!editing) return false;
+    const rootAddRow = addRowRow.value;
+    if (rootAddRow && rootAddRow.id === editing.rowId) {
+      return true;
+    }
+    for (const [, groupAddRow] of groupAddRowRows.value) {
+      if (groupAddRow.id === editing.rowId) {
+        return true;
+      }
+    }
+    return false;
+  };
+  if (options.editingCell) {
+    watch(
+      () => options.editingCell?.value,
+      (editing) => {
+        if (editing && addRowTransitioning.value) {
+          addRowTransitioning.value = false;
+          const focusedCell = options.focusFns?.value?.focusedCell;
+          if (focusedCell?.value?.suppressOutline) {
+            focusedCell.value = { ...focusedCell.value, suppressOutline: false };
+          }
+        }
+      }
+    );
+  }
+  function isCellEditable(row, cell) {
+    if (options.props.editing?.enabled === false) {
+      return false;
+    }
+    const columnDef = cell.column.columnDef;
+    const isAddRow = isAddRowRow(row);
+    if (isAddRow && columnDef.showNew === false) {
+      return false;
+    }
+    if (isAddRow) {
+      const groupingState = options.table.getState().grouping || [];
+      if (groupingState.includes(cell.column.id)) {
+        return false;
+      }
+    }
+    if (columnDef.enableEditing !== void 0) {
+      if (typeof columnDef.enableEditing === "function") {
+        return columnDef.enableEditing(row);
+      }
+      return columnDef.enableEditing;
+    }
+    return true;
+  }
+  function findClosestEditableCellToLeft(row, clickedCellIndex) {
+    const cells = row.getVisibleCells();
+    const startIndex = clickedCellIndex !== null ? clickedCellIndex : cells.length;
+    for (let i = startIndex - 1; i >= 0; i--) {
+      const cell = cells[i];
+      if (cell && isCellEditable(row, cell)) {
+        return cell;
+      }
+    }
+    return null;
+  }
+  function findFirstEditableCellToRight(row, clickedCellIndex) {
+    const cells = row.getVisibleCells();
+    const startIndex = clickedCellIndex !== null ? clickedCellIndex : -1;
+    for (let i = startIndex + 1; i < cells.length; i++) {
+      const cell = cells[i];
+      if (cell && isCellEditable(row, cell)) {
+        return cell;
+      }
+    }
+    return null;
+  }
+  const isAnyAddRow = (row) => {
+    if (isAddRowRow(row)) return true;
+    if (addRowRow.value && addRowRow.value.id === row.id) return true;
+    for (const [, groupAddRow] of groupAddRowRows.value) {
+      if (groupAddRow.id === row.id) return true;
+    }
+    return typeof row.id === "string" && row.id.startsWith("add-new-");
+  };
+  if (options.interactionRouter) {
+    unregisterCellClick = options.interactionRouter.registerCellClickHandler({
+      id: "add-row-uneditable-click",
+      priority: 5,
+      // Before focus (10) - intercepts when editing, passes through when not editing
+      when: ({ row, event }) => {
+        if (event.__addRowFinalizing || isFinalizing.value || finalizingRowId.value === row.id) {
+          return false;
+        }
+        return isAnyAddRow(row);
+      },
+      handle: ({ event, row, cell, cellIndex: _cellIndex }) => {
+        if (isFinalizing.value || event.__addRowFinalizing || finalizingRowId.value === row.id) {
+          ;
+          event.__addRowFinalizing = true;
+          return stopEventPropagation();
+        }
+        if (isCellEditable(row, cell)) {
+          return { handled: false };
+        }
+        if (addRowState.value === "editing" && !isFinalizing.value && finalizingRowId.value !== row.id) {
+          const cellEditingFns = options.cellEditingFns?.value;
+          const editingCell = options.editingCell?.value;
+          if (cellEditingFns && editingCell && cellEditingFns.editingValue) {
+            const editingRow = findEditingRow(editingCell, false);
+            if (editingRow && isAddRowRow(editingRow)) {
+              const editingCellObj = editingRow.getVisibleCells().find((c) => c.column.id === editingCell.columnId);
+              if (editingCellObj) {
+                if (isFinalizing.value && finalizingRowId.value === editingRow.id) {
+                  return stopEventPropagation();
+                }
+                ;
+                event.__addRowFinalizing = true;
+                const currentValue = cellEditingFns.editingValue?.value ?? editingCellObj.getValue();
+                cellEditingFns.stopEditing(editingRow, editingCellObj, currentValue, void 0, {
+                  restoreFocus: false
+                });
+                const result = finalizeAddRow(editingRow);
+                if (!result.success) {
+                  const cellEditingFns2 = options.cellEditingFns?.value;
+                  if (cellEditingFns2) {
+                    cellEditingFns2.startEditing(editingRow, editingCellObj, currentValue);
+                  }
+                  return stopEventPropagation();
+                }
+                if (options.focusFns?.value) {
+                  options.focusFns.value.focusedCell.value = null;
+                }
+                return stopEventPropagation();
+              }
+            }
+          }
+          return { handled: false };
+        }
+        return { handled: false };
+      }
+    });
+    let unregisterCellClickNotEditing = null;
+    unregisterCellClickNotEditing = options.interactionRouter.registerCellClickHandler({
+      id: "add-row-uneditable-click-not-editing",
+      priority: 8,
+      // Before focus (10), so we can handle uneditable cells correctly
+      when: ({ row }) => isAnyAddRow(row),
+      handle: ({ event, row, cell, cellIndex }) => {
+        if (isCellEditable(row, cell)) {
+          return { handled: false };
+        }
+        const editingCell = options.editingCell?.value;
+        if (editingCell && editingCell.rowId === row.id) {
+          return { handled: false };
+        }
+        let closestEditableCell = findClosestEditableCellToLeft(row, cellIndex);
+        if (!closestEditableCell) {
+          closestEditableCell = findFirstEditableCellToRight(row, cellIndex);
+        }
+        if (!closestEditableCell) {
+          return { handled: false };
+        }
+        ;
+        event.__addRowUneditableClick = true;
+        const cellEditingFns = options.cellEditingFns?.value;
+        const needsToStopEditing = cellEditingFns && editingCell && (() => {
+          const groupingFns = resolveGroupingFns();
+          const rowsList = groupingFns?.navigableRows?.value ?? options.rows.value;
+          const currentlyEditingRow = rowsList.find((r) => r.id === editingCell.rowId);
+          return currentlyEditingRow && isAddRowRow(currentlyEditingRow) && currentlyEditingRow.id !== row.id;
+        })();
+        if (needsToStopEditing && cellEditingFns && editingCell) {
+          const groupingFns = resolveGroupingFns();
+          const rowsList = groupingFns?.navigableRows?.value ?? options.rows.value;
+          const currentlyEditingRow = rowsList.find((r) => r.id === editingCell.rowId);
+          if (currentlyEditingRow) {
+            const editingCellObj = currentlyEditingRow.getVisibleCells().find((c) => c.column.id === editingCell.columnId);
+            if (editingCellObj) {
+              const currentValue = cellEditingFns.editingValue?.value ?? editingCellObj.getValue();
+              cellEditingFns.stopEditing(
+                currentlyEditingRow,
+                editingCellObj,
+                currentValue,
+                void 0,
+                {
+                  restoreFocus: false
+                }
+              );
+            }
+          }
+        }
+        nextTick(() => {
+          const cells = row.getVisibleCells();
+          const targetCellIndex = cells.findIndex((c) => c.id === closestEditableCell.id);
+          if (targetCellIndex !== -1 && options.focusFns?.value) {
+            const focusFns = options.focusFns.value;
+            const groupingFns = resolveGroupingFns();
+            const rowsList = groupingFns?.navigableRows?.value ?? options.rows.value;
+            const rowIndex = rowsList.findIndex((r) => r.id === row.id);
+            if (rowIndex !== -1) {
+              focusFns.focusCell(row, rowIndex, targetCellIndex);
+              const cellEditingFns2 = options.cellEditingFns?.value;
+              if (cellEditingFns2) {
+                cellEditingFns2.startEditing(row, closestEditableCell);
+              }
+            }
+          }
+        });
+        return { handled: true, stop: true };
+      }
+    });
+    onUnmounted(() => {
+      if (unregisterCellClickNotEditing) {
+        unregisterCellClickNotEditing();
+        unregisterCellClickNotEditing = null;
+      }
+    });
+    unregisterPointer = options.interactionRouter.registerGlobalPointerHandler({
+      id: "nugrid-add-row-transition",
+      priority: 1,
+      // Before focus-retain (priority 5) to intercept pointerdown
+      handle: ({ event }) => {
+        const target = event.target;
+        const isAddRowElement = target?.closest?.('[data-add-row="true"]');
+        if (!isAddRowElement) {
+          return { handled: false };
+        }
+        if (isEditingAddRow()) {
+          const cellElement = target?.closest?.("[data-cell-index]");
+          const rowElement = target?.closest?.('[data-add-row="true"]');
+          if (cellElement && rowElement) {
+            const cellIndexAttr = cellElement.getAttribute("data-cell-index");
+            const rowId = rowElement.getAttribute("data-row-id");
+            if (cellIndexAttr !== null && rowId) {
+              const groupingFns = resolveGroupingFns();
+              const rowsList = groupingFns?.navigableRows?.value ?? orderedRows.value;
+              let row = rowsList.find((r) => r.id === rowId);
+              if (!row && rowId.startsWith("add-new-") && showAddNewRow.value && !options.groupingState.value.length) {
+                ensureAddRowRow();
+                if (addRowRow.value && addRowRow.value.id === rowId) {
+                  row = addRowRow.value;
+                }
+              }
+              if (row && isAddRowRow(row)) {
+                const cellIndex = Number.parseInt(cellIndexAttr, 10);
+                const cells = row.getVisibleCells();
+                const cell = cells[cellIndex];
+                if (cell && !isCellEditable(row, cell) && addRowState.value === "editing") {
+                  ;
+                  event.__addRowFinalizing = true;
+                  event.preventDefault();
+                  event.stopPropagation();
+                  const cellEditingFns = options.cellEditingFns?.value;
+                  const editingCell = options.editingCell?.value;
+                  if (cellEditingFns && editingCell) {
+                    const editingRow = findEditingRow(editingCell) ?? row;
+                    if (editingRow && isAddRowRow(editingRow)) {
+                      finalizingRowId.value = editingRow.id;
+                      const editingCellObj = editingRow.getVisibleCells().find((c) => c.column.id === editingCell.columnId);
+                      if (editingCellObj) {
+                        const editingValue = cellEditingFns.editingValue;
+                        const cellValue = editingCellObj.getValue();
+                        const currentValue = getCurrentEditingValue(editingValue, cellValue);
+                        const valueToSave = getCurrentEditingValue(editingValue, cellValue);
+                        cellEditingFns.stopEditing(
+                          editingRow,
+                          editingCellObj,
+                          valueToSave,
+                          void 0,
+                          {
+                            restoreFocus: false
+                          }
+                        );
+                        if (isFinalizing.value && finalizingRowId.value === editingRow.id) {
+                          return stopEventPropagation();
+                        }
+                        const result = finalizeAddRow(editingRow);
+                        if (!result.success) {
+                          isFinalizing.value = false;
+                          finalizingRowId.value = null;
+                          if (cellEditingFns) {
+                            cellEditingFns.startEditing(editingRow, editingCellObj, currentValue);
+                          }
+                          return stopEventPropagation();
+                        } else {
+                          focusNewAddRow();
+                        }
+                        return stopEventPropagation();
+                      }
+                    }
+                  }
+                  nextTick(() => {
+                    isFinalizing.value = false;
+                    finalizingRowId.value = null;
+                  });
+                  return stopEventPropagation();
+                }
+              }
+            }
+          }
+          addRowTransitioning.value = true;
+          event.__addRowCellTransition = true;
+          const focusedCell = options.focusFns?.value?.focusedCell;
+          if (focusedCell?.value) {
+            focusedCell.value = { ...focusedCell.value, suppressOutline: true };
+          }
+          return { handled: true, stop: true };
+        }
+        return { handled: false };
+      }
+    });
+  }
+  onUnmounted(() => {
+    if (unregisterCellClick) {
+      unregisterCellClick();
+      unregisterCellClick = null;
+    }
+    if (unregisterPointer) {
+      unregisterPointer();
+      unregisterPointer = null;
+    }
+  });
+  return {
+    addRowPosition,
+    showAddNewRow,
+    addNewText,
+    refreshAddRows,
+    isAddRowRow,
+    orderedRows,
+    getAddRowRow: () => addRowRow.value,
+    getGroupAddRow: (groupId) => groupAddRowRows.value.get(groupId) ?? null,
+    finalizeAddRow,
+    resetAddRow,
+    addRowState,
+    isFinalizing,
+    finalizingRowId
+  };
+}