@kopexa/extension-table 17.0.46 → 17.1.0

package/dist/extensions/table-handle.mjs

@@ -0,0 +1,11 @@
+"use client";
+import {
+  TableHandleExtension
+} from "../chunk-LUA32VH4.mjs";
+import "../chunk-3SWV7BGP.mjs";
+import "../chunk-GQLZBIWF.mjs";
+import "../chunk-5B5XIL2G.mjs";
+import "../chunk-WKV76XOR.mjs";
+export {
+  TableHandleExtension
+};

package/dist/{table → extensions}/table.d.mts

@@ -1,6 +1,6 @@
 import * as _tiptap_core from '@tiptap/core';
 import { ParentConfig } from '@tiptap/core';
-import * as _tiptap_extension_table from '@tiptap/extension-table';
+import { TableOptions } from '@tiptap/extension-table';
 
 declare module "@tiptap/core" {
     interface NodeConfig<Options, Storage> {
@@ -12,6 +12,6 @@ declare module "@tiptap/core" {
         }) => string);
     }
 }
-declare const Table: _tiptap_core.Node<_tiptap_extension_table.TableOptions, any>;
+declare const Table: _tiptap_core.Node<TableOptions, any>;
 
 export { Table };

package/dist/{table → extensions}/table.d.ts

@@ -1,6 +1,6 @@
 import * as _tiptap_core from '@tiptap/core';
 import { ParentConfig } from '@tiptap/core';
-import * as _tiptap_extension_table from '@tiptap/extension-table';
+import { TableOptions } from '@tiptap/extension-table';
 
 declare module "@tiptap/core" {
     interface NodeConfig<Options, Storage> {
@@ -12,6 +12,6 @@ declare module "@tiptap/core" {
         }) => string);
     }
 }
-declare const Table: _tiptap_core.Node<_tiptap_extension_table.TableOptions, any>;
+declare const Table: _tiptap_core.Node<TableOptions, any>;
 
 export { Table };

package/dist/extensions/table.js

@@ -0,0 +1,138 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+
+// src/extensions/table.ts
+var table_exports = {};
+__export(table_exports, {
+  Table: () => Table
+});
+module.exports = __toCommonJS(table_exports);
+var import_extension_table = require("@tiptap/extension-table");
+var import_tables = require("@tiptap/pm/tables");
+
+// src/lib/constants.ts
+var EMPTY_CELL_WIDTH = 120;
+var RESIZE_MIN_WIDTH = 35;
+
+// src/extensions/table.ts
+var Table = import_extension_table.Table.configure({
+  resizable: true
+}).extend({
+  addProseMirrorPlugins() {
+    const isResizable = this.options.resizable && this.editor.isEditable;
+    const defaultCellMinWidth = this.options.cellMinWidth < EMPTY_CELL_WIDTH ? EMPTY_CELL_WIDTH : this.options.cellMinWidth;
+    return [
+      ...isResizable ? [
+        (0, import_tables.columnResizing)({
+          handleWidth: this.options.handleWidth,
+          cellMinWidth: RESIZE_MIN_WIDTH,
+          defaultCellMinWidth,
+          View: null,
+          lastColumnResizable: this.options.lastColumnResizable
+        })
+      ] : [],
+      (0, import_tables.tableEditing)({
+        allowTableNodeSelection: this.options.allowTableNodeSelection
+      })
+    ];
+  },
+  addNodeView() {
+    return ({ node, HTMLAttributes }) => {
+      class TiptapTableView extends import_tables.TableView {
+        constructor(node2, minCellWidth, containerAttributes) {
+          super(node2, minCellWidth);
+          __publicField(this, "blockContainer");
+          __publicField(this, "innerTableContainer");
+          __publicField(this, "widgetsContainer");
+          __publicField(this, "overlayContainer");
+          __publicField(this, "containerAttributes");
+          this.containerAttributes = containerAttributes != null ? containerAttributes : {};
+          this.blockContainer = this.createBlockContainer();
+          this.innerTableContainer = this.createInnerTableContainer();
+          this.widgetsContainer = this.createWidgetsContainer();
+          this.overlayContainer = this.createOverlayContainer();
+          this.setupDOMStructure();
+        }
+        createBlockContainer() {
+          const container = document.createElement("div");
+          container.setAttribute("data-content-type", "table");
+          container.style.position = "relative";
+          this.applyContainerAttributes(container);
+          return container;
+        }
+        createInnerTableContainer() {
+          const container = document.createElement("div");
+          container.className = "table-container";
+          return container;
+        }
+        createWidgetsContainer() {
+          const container = document.createElement("div");
+          container.className = "table-controls";
+          container.style.position = "absolute";
+          container.style.inset = "0";
+          container.style.pointerEvents = "none";
+          return container;
+        }
+        createOverlayContainer() {
+          const container = document.createElement("div");
+          container.className = "table-selection-overlay-container";
+          container.style.position = "absolute";
+          container.style.inset = "0";
+          container.style.pointerEvents = "none";
+          return container;
+        }
+        applyContainerAttributes(element) {
+          Object.entries(this.containerAttributes).forEach(([key, value]) => {
+            if (key !== "class") {
+              element.setAttribute(key, value);
+            }
+          });
+        }
+        setupDOMStructure() {
+          const originalTable = this.dom;
+          const tableElement = originalTable.firstChild;
+          if (tableElement) {
+            this.innerTableContainer.appendChild(tableElement);
+          }
+          originalTable.appendChild(this.innerTableContainer);
+          this.blockContainer.appendChild(originalTable);
+          this.blockContainer.appendChild(this.widgetsContainer);
+          this.blockContainer.appendChild(this.overlayContainer);
+          this.dom = this.blockContainer;
+        }
+        ignoreMutation(mutation) {
+          const target = mutation.target;
+          if (!target.closest(".table-container")) {
+            return true;
+          }
+          return super.ignoreMutation(mutation);
+        }
+      }
+      const cellMinWidth = this.options.cellMinWidth < EMPTY_CELL_WIDTH ? EMPTY_CELL_WIDTH : this.options.cellMinWidth;
+      return new TiptapTableView(node, cellMinWidth, HTMLAttributes);
+    };
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Table
+});

package/dist/extensions/table.mjs

@@ -0,0 +1,9 @@
+"use client";
+import {
+  Table
+} from "../chunk-IRJ6RAVQ.mjs";
+import "../chunk-PTX5UYV6.mjs";
+import "../chunk-WKV76XOR.mjs";
+export {
+  Table
+};

package/dist/hooks/use-resize-overlay.d.mts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/react';
+
+declare function useResizeOverlay(editor: Editor | null, updateSelectionRect: () => void): void;
+
+export { useResizeOverlay };

package/dist/hooks/use-resize-overlay.d.ts

@@ -0,0 +1,5 @@
+import { Editor } from '@tiptap/react';
+
+declare function useResizeOverlay(editor: Editor | null, updateSelectionRect: () => void): void;
+
+export { useResizeOverlay };

package/dist/hooks/use-resize-overlay.js

@@ -0,0 +1,83 @@
+"use client";
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/use-resize-overlay.ts
+var use_resize_overlay_exports = {};
+__export(use_resize_overlay_exports, {
+  useResizeOverlay: () => useResizeOverlay
+});
+module.exports = __toCommonJS(use_resize_overlay_exports);
+var import_tables = require("@tiptap/pm/tables");
+var import_react = require("react");
+function useResizeOverlay(editor, updateSelectionRect) {
+  const rafId = (0, import_react.useRef)(null);
+  const updateRef = (0, import_react.useRef)(updateSelectionRect);
+  updateRef.current = updateSelectionRect;
+  const stopLoop = (0, import_react.useCallback)(() => {
+    if (rafId.current != null) {
+      cancelAnimationFrame(rafId.current);
+      rafId.current = null;
+    }
+  }, []);
+  const startLoop = (0, import_react.useCallback)(() => {
+    if (rafId.current != null) return;
+    const tick = () => {
+      if (!(editor == null ? void 0 : editor.state)) return;
+      const st = import_tables.columnResizingPluginKey.getState(editor.state);
+      const dragging = !!(st == null ? void 0 : st.dragging);
+      updateRef.current();
+      if (dragging) {
+        rafId.current = requestAnimationFrame(tick);
+      } else {
+        stopLoop();
+        updateRef.current();
+      }
+    };
+    rafId.current = requestAnimationFrame(tick);
+  }, [editor, stopLoop]);
+  (0, import_react.useEffect)(() => {
+    if (!editor) return;
+    const onTx = ({ transaction }) => {
+      updateRef.current();
+      const meta = transaction.getMeta(import_tables.columnResizingPluginKey);
+      if (!meta) return;
+      if (Object.hasOwn(meta, "setDragging") && meta.setDragging) {
+        startLoop();
+      }
+      if (Object.hasOwn(meta, "setDragging") && meta.setDragging == null) {
+        stopLoop();
+        updateRef.current();
+      }
+      if (Object.hasOwn(meta, "setHandle")) {
+        updateRef.current();
+      }
+    };
+    editor.on("transaction", onTx);
+    return () => {
+      editor.off("transaction", onTx);
+      stopLoop();
+    };
+  }, [editor, startLoop, stopLoop]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useResizeOverlay
+});

package/dist/hooks/use-resize-overlay.mjs

@@ -0,0 +1,9 @@
+"use client";
+"use client";
+import {
+  useResizeOverlay
+} from "../chunk-J4VOSZCZ.mjs";
+import "../chunk-WKV76XOR.mjs";
+export {
+  useResizeOverlay
+};

package/dist/hooks/use-table-add-row-column.d.mts

@@ -0,0 +1,57 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _kopexa_icons from '@kopexa/icons';
+import { Editor } from '@tiptap/react';
+import { Orientation } from '../lib/table-utils.mjs';
+import '@tiptap/pm/model';
+import '@tiptap/pm/state';
+import '@tiptap/pm/tables';
+
+type RowSide = "above" | "below";
+type ColSide = "left" | "right";
+interface UseTableAddRowColumnConfig {
+    /**
+     * The Tiptap editor instance. If omitted, the hook will use
+     * the context/editor from `useTiptapEditor`.
+     */
+    editor?: Editor | null;
+    /**
+     * The index of the row or column to add relative to.
+     * If omitted, will use the current selection.
+     */
+    index?: number;
+    /**
+     * Whether you're adding a row or a column.
+     * If omitted, will use the current selection.
+     */
+    orientation?: Orientation;
+    /**
+     * The side to add on - above/below for rows, left/right for columns.
+     */
+    side: RowSide | ColSide;
+    /**
+     * The position of the table in the document.
+     */
+    tablePos?: number;
+    /**
+     * Hide the button when addition isn't currently possible.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+    /**
+     * Callback function called after a successful addition.
+     */
+    onAdded?: () => void;
+}
+/**
+ * Custom hook that provides **table row/column addition**
+ * functionality for the Tiptap editor.
+ */
+declare function useTableAddRowColumn(config: UseTableAddRowColumnConfig): {
+    isVisible: boolean;
+    canAddRowColumn: boolean;
+    handleAdd: () => boolean;
+    label: string;
+    Icon: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
+};
+
+export { type ColSide, type RowSide, type UseTableAddRowColumnConfig, useTableAddRowColumn };

package/dist/hooks/use-table-add-row-column.d.ts

@@ -0,0 +1,57 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _kopexa_icons from '@kopexa/icons';
+import { Editor } from '@tiptap/react';
+import { Orientation } from '../lib/table-utils.js';
+import '@tiptap/pm/model';
+import '@tiptap/pm/state';
+import '@tiptap/pm/tables';
+
+type RowSide = "above" | "below";
+type ColSide = "left" | "right";
+interface UseTableAddRowColumnConfig {
+    /**
+     * The Tiptap editor instance. If omitted, the hook will use
+     * the context/editor from `useTiptapEditor`.
+     */
+    editor?: Editor | null;
+    /**
+     * The index of the row or column to add relative to.
+     * If omitted, will use the current selection.
+     */
+    index?: number;
+    /**
+     * Whether you're adding a row or a column.
+     * If omitted, will use the current selection.
+     */
+    orientation?: Orientation;
+    /**
+     * The side to add on - above/below for rows, left/right for columns.
+     */
+    side: RowSide | ColSide;
+    /**
+     * The position of the table in the document.
+     */
+    tablePos?: number;
+    /**
+     * Hide the button when addition isn't currently possible.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+    /**
+     * Callback function called after a successful addition.
+     */
+    onAdded?: () => void;
+}
+/**
+ * Custom hook that provides **table row/column addition**
+ * functionality for the Tiptap editor.
+ */
+declare function useTableAddRowColumn(config: UseTableAddRowColumnConfig): {
+    isVisible: boolean;
+    canAddRowColumn: boolean;
+    handleAdd: () => boolean;
+    label: string;
+    Icon: ({ size, ...props }: _kopexa_icons.IconSvgProps) => react_jsx_runtime.JSX.Element;
+};
+
+export { type ColSide, type RowSide, type UseTableAddRowColumnConfig, useTableAddRowColumn };