@underverse-ui/underverse 2.0.25 → 2.0.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  getPanelBorderRadiusClass,
3
3
  useUnderverseUIConfig
4
- } from "./chunk-OJF3XRN7.js";
4
+ } from "./chunk-BDRCOIYR.js";
5
5
  import {
6
6
  cn,
7
7
  useGlobalI18n
@@ -196,4 +196,4 @@ var Modal_default = Modal;
196
196
  export {
197
197
  Modal_default
198
198
  };
199
- //# sourceMappingURL=chunk-FFVBGTHU.js.map
199
+ //# sourceMappingURL=chunk-HVJ3R6LP.js.map
package/dist/index.cjs CHANGED
@@ -6000,6 +6000,24 @@ var init_clipboard_images = __esm({
6000
6000
  });
6001
6001
 
6002
6002
  // src/components/UEditor/table-dom-utils.ts
6003
+ function isCrossRealmNode(value) {
6004
+ return Boolean(value && typeof value === "object" && value.nodeType != null);
6005
+ }
6006
+ function isCrossRealmElement(value) {
6007
+ return isCrossRealmNode(value) && value.nodeType === 1 && typeof value.closest === "function";
6008
+ }
6009
+ function isCrossRealmHTMLElement(value) {
6010
+ return isCrossRealmElement(value) && typeof value.style === "object";
6011
+ }
6012
+ function isCrossRealmTable(value) {
6013
+ return isCrossRealmElement(value) && String(value.tagName).toUpperCase() === "TABLE" && "rows" in value;
6014
+ }
6015
+ function isCrossRealmTableRow(value) {
6016
+ return isCrossRealmElement(value) && String(value.tagName).toUpperCase() === "TR" && "cells" in value;
6017
+ }
6018
+ function isCrossRealmTableCell(value) {
6019
+ return isCrossRealmElement(value) && ["TD", "TH"].includes(String(value.tagName).toUpperCase()) && "cellIndex" in value;
6020
+ }
6003
6021
  function findTableRowNodeInfo(view, rowElement) {
6004
6022
  const firstCell = rowElement.querySelector("th,td");
6005
6023
  if (!firstCell) return null;
@@ -6017,10 +6035,8 @@ function findTableRowNodeInfo(view, rowElement) {
6017
6035
  return null;
6018
6036
  }
6019
6037
  function resolveEventElement(target) {
6020
- const ownerDocument = target?.ownerDocument;
6021
- const realm = ownerDocument?.defaultView;
6022
- if (realm && target instanceof realm.Element) return target;
6023
- if (realm && target instanceof realm.Node) return target.parentElement;
6038
+ if (isCrossRealmElement(target)) return target;
6039
+ if (isCrossRealmNode(target)) return target.parentElement;
6024
6040
  return null;
6025
6041
  }
6026
6042
  function isPointOverRenderedText(root, clientX, clientY) {
@@ -6210,8 +6226,8 @@ function applyTableAlignment(editor, tableAlign, anchorPos) {
6210
6226
  const domAtTable = editor.view.domAtPos(Math.min(tableInfo.pos + 1, editor.state.doc.content.size)).node;
6211
6227
  const domAtTableElement = resolveEventElement(domAtTable);
6212
6228
  const tableDom = editor.view.nodeDOM(tableInfo.pos);
6213
- const tableElement = domAtTableElement?.closest?.("table") ?? (tableDom instanceof HTMLTableElement ? tableDom : tableDom instanceof HTMLElement ? tableDom.querySelector("table") : null) ?? (editor.view.dom.querySelectorAll("table").length === 1 ? editor.view.dom.querySelector("table") : null);
6214
- if (tableElement instanceof HTMLTableElement) {
6229
+ const tableElement = domAtTableElement?.closest?.("table") ?? (isCrossRealmTable(tableDom) ? tableDom : isCrossRealmHTMLElement(tableDom) ? tableDom.querySelector("table") : null) ?? (editor.view.dom.querySelectorAll("table").length === 1 ? editor.view.dom.querySelector("table") : null);
6230
+ if (isCrossRealmTable(tableElement)) {
6215
6231
  tableElement.style.tableLayout = "fixed";
6216
6232
  if (tableElement.style.width === "max-content") {
6217
6233
  tableElement.style.removeProperty("width");
@@ -36840,6 +36856,7 @@ var import_tables3 = require("@tiptap/pm/tables");
36840
36856
  var import_state6 = require("@tiptap/pm/state");
36841
36857
  var import_view2 = require("@tiptap/pm/view");
36842
36858
  var import_tables2 = require("@tiptap/pm/tables");
36859
+ init_table_dom_utils();
36843
36860
  var DEFAULT_TABLE_COLUMN_WIDTH = 100;
36844
36861
  var MIN_RESIZED_TABLE_COLUMN_WIDTH = 25;
36845
36862
  function getColumnResizeMinWidth(configuredMinWidth) {
@@ -36856,9 +36873,9 @@ function setColumnStyle(column, width) {
36856
36873
  column.style.minWidth = "";
36857
36874
  }
36858
36875
  function isTableColumnElement(node) {
36859
- return node instanceof HTMLElement && node.tagName.toLowerCase() === "col";
36876
+ return isCrossRealmElement(node) && String(node.tagName).toUpperCase() === "COL";
36860
36877
  }
36861
- function updateDynamicColumns(node, colgroup, table, overrideCol, overrideValue) {
36878
+ function updateDynamicColumns(node, colgroup, table, ownerDocument, overrideCol, overrideValue) {
36862
36879
  let totalWidth = 0;
36863
36880
  let nextDOM = colgroup.firstChild;
36864
36881
  const row = node.firstChild;
@@ -36869,7 +36886,7 @@ function updateDynamicColumns(node, colgroup, table, overrideCol, overrideValue)
36869
36886
  const rawWidth = overrideCol === col ? overrideValue : colwidth?.[spanIndex];
36870
36887
  const width = rawWidth ? Math.max(rawWidth, MIN_RESIZED_TABLE_COLUMN_WIDTH) : null;
36871
36888
  totalWidth += width ?? DEFAULT_TABLE_COLUMN_WIDTH;
36872
- const colElement = isTableColumnElement(nextDOM) ? nextDOM : colgroup.appendChild(document.createElement("col"));
36889
+ const colElement = isTableColumnElement(nextDOM) ? nextDOM : colgroup.appendChild(ownerDocument.createElement("col"));
36873
36890
  setColumnStyle(colElement, width);
36874
36891
  nextDOM = colElement.nextSibling;
36875
36892
  }
@@ -36889,23 +36906,25 @@ function updateDynamicColumns(node, colgroup, table, overrideCol, overrideValue)
36889
36906
  }
36890
36907
  }
36891
36908
  var UEditorTableView = class {
36892
- constructor(node) {
36909
+ constructor(node, _defaultColumnWidth, maybeView) {
36893
36910
  this.node = node;
36894
- this.dom = document.createElement("div");
36911
+ const view = maybeView ?? _defaultColumnWidth;
36912
+ const ownerDocument = view.dom.ownerDocument;
36913
+ this.dom = ownerDocument.createElement("div");
36895
36914
  this.dom.className = "tableWrapper";
36896
- this.table = this.dom.appendChild(document.createElement("table"));
36915
+ this.table = this.dom.appendChild(ownerDocument.createElement("table"));
36897
36916
  if (node.attrs.style) {
36898
36917
  this.table.style.cssText = node.attrs.style;
36899
36918
  }
36900
36919
  this.table.style.tableLayout = "fixed";
36901
- this.colgroup = this.table.appendChild(document.createElement("colgroup"));
36902
- updateDynamicColumns(node, this.colgroup, this.table);
36903
- this.contentDOM = this.table.appendChild(document.createElement("tbody"));
36920
+ this.colgroup = this.table.appendChild(ownerDocument.createElement("colgroup"));
36921
+ updateDynamicColumns(node, this.colgroup, this.table, ownerDocument);
36922
+ this.contentDOM = this.table.appendChild(ownerDocument.createElement("tbody"));
36904
36923
  }
36905
36924
  update(node) {
36906
36925
  if (node.type !== this.node.type) return false;
36907
36926
  this.node = node;
36908
- updateDynamicColumns(node, this.colgroup, this.table);
36927
+ updateDynamicColumns(node, this.colgroup, this.table, this.dom.ownerDocument);
36909
36928
  return true;
36910
36929
  }
36911
36930
  ignoreMutation(mutation) {
@@ -36927,7 +36946,7 @@ function getCurrentColWidth(view, cellPos, { colspan, colwidth }) {
36927
36946
  if (width) return width;
36928
36947
  const dom = view.domAtPos(cellPos);
36929
36948
  const cellElement = dom.node.childNodes[dom.offset];
36930
- let domWidth = cellElement instanceof HTMLElement ? cellElement.offsetWidth : 0;
36949
+ let domWidth = isCrossRealmHTMLElement(cellElement) ? cellElement.offsetWidth : 0;
36931
36950
  let parts = Math.max(1, colspan);
36932
36951
  if (colwidth) {
36933
36952
  for (let index = 0; index < colspan; index += 1) {
@@ -36940,14 +36959,14 @@ function getCurrentColWidth(view, cellPos, { colspan, colwidth }) {
36940
36959
  }
36941
36960
  return domWidth / Math.max(1, parts);
36942
36961
  }
36943
- function domCellAround(target) {
36944
- let node = target instanceof Node ? target : null;
36962
+ function domCellAround(view, target) {
36963
+ let node = isCrossRealmNode(target) ? target : null;
36945
36964
  while (node && node.nodeName !== "TD" && node.nodeName !== "TH") {
36946
- const element = node instanceof Element ? node : null;
36965
+ const element = isCrossRealmElement(node) ? node : null;
36947
36966
  if (element?.classList.contains("ProseMirror")) return null;
36948
36967
  node = node.parentNode;
36949
36968
  }
36950
- return node instanceof HTMLElement ? node : null;
36969
+ return isCrossRealmHTMLElement(node) ? node : null;
36951
36970
  }
36952
36971
  function edgeCell(view, event, side, handleWidth) {
36953
36972
  const offset = side === "right" ? -handleWidth : handleWidth;
@@ -36965,12 +36984,14 @@ function edgeCell(view, event, side, handleWidth) {
36965
36984
  return index % map.width === 0 ? -1 : start + map.map[index - 1];
36966
36985
  }
36967
36986
  var handleHoverTimer = null;
36987
+ var handleHoverWindow = null;
36968
36988
  var pendingHandleCell = -1;
36969
36989
  function clearHandleHoverTimer() {
36970
36990
  if (handleHoverTimer !== null) {
36971
- window.clearTimeout(handleHoverTimer);
36991
+ handleHoverWindow?.clearTimeout(handleHoverTimer);
36972
36992
  handleHoverTimer = null;
36973
36993
  }
36994
+ handleHoverWindow = null;
36974
36995
  pendingHandleCell = -1;
36975
36996
  }
36976
36997
  function updateHandle(view, value) {
@@ -36980,7 +37001,7 @@ function handleMouseMove(view, event, handleWidth, lastColumnResizable) {
36980
37001
  if (!view.editable) return;
36981
37002
  const pluginState = import_tables2.columnResizingPluginKey.getState(view.state);
36982
37003
  if (!pluginState || pluginState.dragging) return;
36983
- const target = domCellAround(event.target);
37004
+ const target = domCellAround(view, event.target);
36984
37005
  let cell = -1;
36985
37006
  if (target) {
36986
37007
  const { left, right } = target.getBoundingClientRect();
@@ -37016,7 +37037,10 @@ function handleMouseMove(view, event, handleWidth, lastColumnResizable) {
37016
37037
  if (pendingHandleCell === cell) return;
37017
37038
  clearHandleHoverTimer();
37018
37039
  pendingHandleCell = cell;
37019
- handleHoverTimer = window.setTimeout(() => {
37040
+ const ownerWindow = view.dom.ownerDocument.defaultView;
37041
+ if (!ownerWindow) return;
37042
+ handleHoverWindow = ownerWindow;
37043
+ handleHoverTimer = ownerWindow.setTimeout(() => {
37020
37044
  handleHoverTimer = null;
37021
37045
  pendingHandleCell = -1;
37022
37046
  updateHandle(view, cell);
@@ -37088,7 +37112,7 @@ function getTableElementAtCell(view, cell) {
37088
37112
  const $cell = view.state.doc.resolve(cell);
37089
37113
  let dom = view.domAtPos($cell.start(-1)).node;
37090
37114
  while (dom && dom.nodeName !== "TABLE") dom = dom.parentNode;
37091
- return dom instanceof HTMLTableElement ? dom : null;
37115
+ return isCrossRealmTable(dom) ? dom : null;
37092
37116
  }
37093
37117
  function showColumnResizeGhost(view, cell, dragging, width) {
37094
37118
  const table = getTableElementAtCell(view, cell);
@@ -37145,7 +37169,8 @@ function handleMouseDown(view, event, cellMinWidth) {
37145
37169
  event.preventDefault();
37146
37170
  return true;
37147
37171
  }
37148
- function handleDecorations(state, cell) {
37172
+ function handleDecorations(state, cell, ownerDocument) {
37173
+ if (!ownerDocument) return import_view2.DecorationSet.empty;
37149
37174
  const decorations = [];
37150
37175
  const $cell = state.doc.resolve(cell);
37151
37176
  const table = $cell.node(-1);
@@ -37162,7 +37187,7 @@ function handleDecorations(state, cell) {
37162
37187
  const cellNode = table.nodeAt(cellPos);
37163
37188
  if (!cellNode) continue;
37164
37189
  const pos = start + cellPos + cellNode.nodeSize - 1;
37165
- const dom = document.createElement("div");
37190
+ const dom = ownerDocument.createElement("div");
37166
37191
  dom.className = "column-resize-handle";
37167
37192
  if (import_tables2.columnResizingPluginKey.getState(state)?.dragging) {
37168
37193
  decorations.push(import_view2.Decoration.node(start + cellPos, start + cellPos + cellNode.nodeSize, { class: "column-resize-dragging" }));
@@ -37179,6 +37204,7 @@ function dynamicColumnResizing({
37179
37204
  View = UEditorTableView,
37180
37205
  lastColumnResizable = true
37181
37206
  } = {}) {
37207
+ let ownerDocument = null;
37182
37208
  const plugin = new import_state6.Plugin({
37183
37209
  key: import_tables2.columnResizingPluginKey,
37184
37210
  state: {
@@ -37186,7 +37212,10 @@ function dynamicColumnResizing({
37186
37212
  const nodeViews = plugin.spec.props?.nodeViews;
37187
37213
  const tableName = (0, import_tables2.tableNodeTypes)(state.schema).table.name;
37188
37214
  if (View && nodeViews) {
37189
- nodeViews[tableName] = (node, view) => new View(node, defaultCellMinWidth, view);
37215
+ nodeViews[tableName] = (node, view) => {
37216
+ ownerDocument = view.dom.ownerDocument;
37217
+ return new View(node, defaultCellMinWidth, view);
37218
+ };
37190
37219
  }
37191
37220
  return new import_tables2.ResizeState(-1, false);
37192
37221
  },
@@ -37211,7 +37240,7 @@ function dynamicColumnResizing({
37211
37240
  decorations: (state) => {
37212
37241
  const pluginState = import_tables2.columnResizingPluginKey.getState(state);
37213
37242
  if (pluginState && pluginState.activeHandle > -1) {
37214
- return handleDecorations(state, pluginState.activeHandle);
37243
+ return handleDecorations(state, pluginState.activeHandle, ownerDocument);
37215
37244
  }
37216
37245
  return void 0;
37217
37246
  },
@@ -45433,20 +45462,16 @@ init_table_dom_utils();
45433
45462
  var FALLBACK_TABLE_ROW_HEIGHT = DEFAULT_TABLE_ROW_HEIGHT;
45434
45463
  var FALLBACK_TABLE_COLUMN_WIDTH = 160;
45435
45464
  function isTableCellElement(element) {
45436
- const realm = element?.ownerDocument?.defaultView;
45437
- return Boolean(realm && element instanceof realm.HTMLTableCellElement);
45465
+ return isCrossRealmTableCell(element);
45438
45466
  }
45439
45467
  function isTableRowElement(element) {
45440
- const realm = element?.ownerDocument?.defaultView;
45441
- return Boolean(realm && element instanceof realm.HTMLTableRowElement);
45468
+ return isCrossRealmTableRow(element);
45442
45469
  }
45443
45470
  function isTableElement(element) {
45444
- const realm = element?.ownerDocument?.defaultView;
45445
- return Boolean(realm && element instanceof realm.HTMLTableElement);
45471
+ return isCrossRealmTable(element);
45446
45472
  }
45447
45473
  function isHTMLElement(element) {
45448
- const realm = element?.ownerDocument?.defaultView;
45449
- return Boolean(realm && element instanceof realm.HTMLElement);
45474
+ return isCrossRealmHTMLElement(element);
45450
45475
  }
45451
45476
  function getVisibleTableBounds(layout) {
45452
45477
  const left = Math.max(layout.tableLeft, layout.wrapperLeft);
@@ -45730,8 +45755,7 @@ var ADD_COLUMN_HOVER_WIDTH = 24;
45730
45755
  var ADD_ROW_HOVER_HEIGHT = 24;
45731
45756
  var HANDLE_HOVER_RADIUS = 14;
45732
45757
  function isHTMLElement2(element) {
45733
- const realm = element?.ownerDocument?.defaultView;
45734
- return Boolean(realm && element instanceof realm.HTMLElement);
45758
+ return isCrossRealmHTMLElement(element);
45735
45759
  }
45736
45760
  var DEFAULT_TABLE_HOVER_STATE = {
45737
45761
  menuVisible: false,
@@ -46232,7 +46256,7 @@ function TableResizeHandles({
46232
46256
  "data-table-resize-frame": "",
46233
46257
  "data-resizing": active ? "true" : "false",
46234
46258
  className: cn(
46235
- "pointer-events-none absolute z-[38] box-border border border-primary/55",
46259
+ "pointer-events-none absolute z-[38] box-border border border-transparent",
46236
46260
  active && "border-primary bg-primary/3"
46237
46261
  ),
46238
46262
  style: {
@@ -46460,7 +46484,7 @@ function getSelectedCell(editor) {
46460
46484
  const browserSelection = editorWindow?.getSelection();
46461
46485
  const anchorElement = resolveEventElement(browserSelection?.anchorNode ?? null);
46462
46486
  const anchorCell = anchorElement?.closest?.("th,td");
46463
- if (editorWindow && anchorCell instanceof editorWindow.HTMLTableCellElement) {
46487
+ if (isCrossRealmTableCell(anchorCell)) {
46464
46488
  return anchorCell;
46465
46489
  }
46466
46490
  const domAtPos = editor.view.domAtPos(editor.state.selection.from);
@@ -47529,12 +47553,12 @@ function useUEditorTableInteractions(editor, editable = true) {
47529
47553
  return;
47530
47554
  }
47531
47555
  const target = resolveEventElement(event.target);
47532
- if (!(target instanceof editorWindow.Element)) {
47556
+ if (!isCrossRealmElement(target)) {
47533
47557
  clearAllTableResizeHover();
47534
47558
  return;
47535
47559
  }
47536
47560
  const cell = target.closest("th,td");
47537
- if (!(cell instanceof editorWindow.HTMLElement)) {
47561
+ if (!isCrossRealmHTMLElement(cell)) {
47538
47562
  clearHoveredTableCell();
47539
47563
  clearAllTableResizeHover();
47540
47564
  return;
@@ -47542,7 +47566,7 @@ function useUEditorTableInteractions(editor, editable = true) {
47542
47566
  setHoveredTableCell(cell);
47543
47567
  const row = cell.closest("tr");
47544
47568
  const table = cell.closest("table");
47545
- if (!(row instanceof editorWindow.HTMLTableRowElement) || !(table instanceof editorWindow.HTMLTableElement)) {
47569
+ if (!isCrossRealmTableRow(row) || !isCrossRealmTable(table)) {
47546
47570
  clearHoveredTableCell();
47547
47571
  clearAllTableResizeHover();
47548
47572
  return;
@@ -47598,18 +47622,18 @@ function useUEditorTableInteractions(editor, editable = true) {
47598
47622
  const handleEditorMouseDown = (event) => {
47599
47623
  if (event.button !== 0) return;
47600
47624
  const target = resolveEventElement(event.target);
47601
- if (!(target instanceof editorWindow.Element)) {
47625
+ if (!isCrossRealmElement(target)) {
47602
47626
  clearActiveTableCell();
47603
47627
  return;
47604
47628
  }
47605
47629
  const cell = target.closest("th,td");
47606
- if (!(cell instanceof editorWindow.HTMLTableCellElement)) {
47630
+ if (!isCrossRealmTableCell(cell)) {
47607
47631
  clearActiveTableCell();
47608
47632
  return;
47609
47633
  }
47610
47634
  const row = cell.closest("tr");
47611
47635
  const table = cell.closest("table");
47612
- if (!(row instanceof editorWindow.HTMLTableRowElement) || !(table instanceof editorWindow.HTMLTableElement)) return;
47636
+ if (!isCrossRealmTableRow(row) || !isCrossRealmTable(table)) return;
47613
47637
  const rowTarget = resolveRowResizeTarget(cell, event.clientX, event.clientY);
47614
47638
  if (rowTarget) {
47615
47639
  event.preventDefault();