@underverse-ui/underverse 2.0.14 → 2.0.15

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
  EmojiGridButton,
3
3
  formatEmojiCountLabel
4
- } from "./chunk-DXLSCUYA.js";
4
+ } from "./chunk-SKCO2GFM.js";
5
5
  import {
6
6
  COLUMN_RESIZE_LINE_THICKNESS,
7
7
  CellBgColorIcon,
@@ -55,14 +55,17 @@ import {
55
55
  sanitizeUEditorUrl,
56
56
  useEditorColors,
57
57
  useSharedEditorUiRenderState
58
- } from "./chunk-3Q5EE2ZA.js";
58
+ } from "./chunk-WEGE3MZ5.js";
59
59
  import {
60
60
  Tooltip,
61
+ UEditorPortalProvider,
61
62
  cn,
62
63
  formControlGroupOutlineClass,
63
64
  formControlOutlineClass,
64
- useSmartTranslations
65
- } from "./chunk-PV2G2XME.js";
65
+ resolveUEditorPortalContainer,
66
+ useSmartTranslations,
67
+ useUEditorPortalContainerGetter
68
+ } from "./chunk-EPBYGZHZ.js";
66
69
 
67
70
  // src/components/UEditor/prepare-content-for-save.ts
68
71
  var MIME_EXTENSION_MAP = {
@@ -512,7 +515,7 @@ import { NodeViewWrapper, NodeViewContent } from "@tiptap/react";
512
515
  import React from "react";
513
516
  import { jsx } from "react/jsx-runtime";
514
517
  var LazyBaseEmojiPicker = React.lazy(async () => {
515
- const { EmojiPicker: EmojiPicker2 } = await import("./EmojiPicker-CGMUDB4I.js");
518
+ const { EmojiPicker: EmojiPicker2 } = await import("./EmojiPicker-3X2S7XPP.js");
516
519
  return { default: EmojiPicker2 };
517
520
  });
518
521
  var EmojiPicker = ({ onSelect }) => {
@@ -1627,7 +1630,7 @@ var unsupportedTippyModule = (() => {
1627
1630
  });
1628
1631
  var tippy = typeof tippyModule === "function" ? tippyModule : typeof maybeNestedDefault.default === "function" ? maybeNestedDefault.default : unsupportedTippyModule;
1629
1632
  function getFirstTippyInstance(instances) {
1630
- return instances?.[0];
1633
+ return Array.isArray(instances) ? instances[0] : instances;
1631
1634
  }
1632
1635
  function hideTippyInstance(instance) {
1633
1636
  if (!instance || instance.state.isDestroyed) return;
@@ -1984,7 +1987,8 @@ var SlashCommand = Extension.create({
1984
1987
  name: "slashCommand",
1985
1988
  addOptions() {
1986
1989
  return {
1987
- messages: DEFAULT_MESSAGES
1990
+ messages: DEFAULT_MESSAGES,
1991
+ getPortalContainer: void 0
1988
1992
  };
1989
1993
  },
1990
1994
  addProseMirrorPlugins() {
@@ -2012,9 +2016,11 @@ var SlashCommand = Extension.create({
2012
2016
  if (!props.clientRect) {
2013
2017
  return;
2014
2018
  }
2015
- popup = tippy("body", {
2019
+ const portalContainer = resolveUEditorPortalContainer(this.options.getPortalContainer);
2020
+ if (!portalContainer) return;
2021
+ popup = tippy(portalContainer, {
2016
2022
  getReferenceClientRect: props.clientRect,
2017
- appendTo: () => document.body,
2023
+ appendTo: () => portalContainer,
2018
2024
  content: component.element,
2019
2025
  showOnCreate: true,
2020
2026
  interactive: true,
@@ -2151,6 +2157,9 @@ var getEmojiSuggestionItems = async ({ query }) => {
2151
2157
  };
2152
2158
  var EmojiSuggestion = Extension2.create({
2153
2159
  name: "emojiSuggestion",
2160
+ addOptions() {
2161
+ return { getPortalContainer: void 0 };
2162
+ },
2154
2163
  addProseMirrorPlugins() {
2155
2164
  return [
2156
2165
  Suggestion2({
@@ -2173,9 +2182,11 @@ var EmojiSuggestion = Extension2.create({
2173
2182
  if (!props.clientRect) {
2174
2183
  return;
2175
2184
  }
2176
- popup = tippy("body", {
2185
+ const portalContainer = resolveUEditorPortalContainer(this.options.getPortalContainer);
2186
+ if (!portalContainer) return;
2187
+ popup = tippy(portalContainer, {
2177
2188
  getReferenceClientRect: props.clientRect,
2178
- appendTo: () => document.body,
2189
+ appendTo: () => portalContainer,
2179
2190
  content: component.element,
2180
2191
  showOnCreate: true,
2181
2192
  interactive: true,
@@ -2333,6 +2344,9 @@ function insertFormulaFunction(editor, range, item) {
2333
2344
  }
2334
2345
  var FormulaSuggestion = Extension3.create({
2335
2346
  name: "formulaSuggestion",
2347
+ addOptions() {
2348
+ return { getPortalContainer: void 0 };
2349
+ },
2336
2350
  addProseMirrorPlugins() {
2337
2351
  return [
2338
2352
  Suggestion3({
@@ -2360,9 +2374,11 @@ var FormulaSuggestion = Extension3.create({
2360
2374
  if (!props.clientRect) {
2361
2375
  return;
2362
2376
  }
2363
- popup = tippy("body", {
2377
+ const portalContainer = resolveUEditorPortalContainer(this.options.getPortalContainer);
2378
+ if (!portalContainer) return;
2379
+ popup = tippy(portalContainer, {
2364
2380
  getReferenceClientRect: props.clientRect,
2365
- appendTo: () => document.body,
2381
+ appendTo: () => portalContainer,
2366
2382
  content: component.element,
2367
2383
  showOnCreate: true,
2368
2384
  interactive: true,
@@ -5595,6 +5611,7 @@ var CustomCodeBlockLowlight = CodeBlockLowlight.extend({
5595
5611
  }
5596
5612
  });
5597
5613
  function buildUEditorExtensions({
5614
+ getPortalContainer,
5598
5615
  placeholder,
5599
5616
  translate,
5600
5617
  maxCharacters,
@@ -5731,10 +5748,11 @@ function buildUEditorExtensions({
5731
5748
  }
5732
5749
  }),
5733
5750
  SlashCommand.configure({
5734
- messages: buildSlashCommandMessages(translate)
5751
+ messages: buildSlashCommandMessages(translate),
5752
+ getPortalContainer
5735
5753
  }),
5736
- FormulaSuggestion,
5737
- EmojiSuggestion,
5754
+ FormulaSuggestion.configure({ getPortalContainer }),
5755
+ EmojiSuggestion.configure({ getPortalContainer }),
5738
5756
  Callout,
5739
5757
  Bookmark.configure({
5740
5758
  fetchMetadata
@@ -5955,6 +5973,8 @@ var FloatingSlashCommandMenu = ({ editor, onClose }) => {
5955
5973
  const messages = useMemo(() => buildSlashCommandMessages(t), [t]);
5956
5974
  const items = useMemo(() => buildSlashCommandItems({ query: "", messages }), [messages]);
5957
5975
  const listRef = useRef4(null);
5976
+ const getPortalContainer = useUEditorPortalContainerGetter();
5977
+ const portalDocument = resolveUEditorPortalContainer(getPortalContainer)?.ownerDocument;
5958
5978
  useEffect5(() => {
5959
5979
  const handleKeyDown2 = (event) => {
5960
5980
  if (event.key === "Escape") {
@@ -5967,8 +5987,9 @@ var FloatingSlashCommandMenu = ({ editor, onClose }) => {
5967
5987
  event.preventDefault();
5968
5988
  }
5969
5989
  };
5970
- return subscribeSharedGlobalEvent(document, "keydown", handleKeyDown2);
5971
- }, [onClose]);
5990
+ if (!portalDocument) return;
5991
+ return subscribeSharedGlobalEvent(portalDocument, "keydown", handleKeyDown2);
5992
+ }, [onClose, portalDocument]);
5972
5993
  return /* @__PURE__ */ jsx12(
5973
5994
  SlashCommandList,
5974
5995
  {
@@ -7006,6 +7027,12 @@ var CustomBubbleMenu = ({
7006
7027
  const [keepOpen, setKeepOpenState] = useState5(false);
7007
7028
  const showTimeoutRef = useRef4(null);
7008
7029
  const suppressShowUntilRef = useRef4(0);
7030
+ const getPortalContainer = useUEditorPortalContainerGetter();
7031
+ const portalContainer = isVisible ? resolveUEditorPortalContainer(getPortalContainer) : null;
7032
+ const editorDocument = editor.view.dom.ownerDocument;
7033
+ const editorWindow = editorDocument.defaultView;
7034
+ const portalDocument = portalContainer?.ownerDocument ?? null;
7035
+ const portalWindow = portalDocument?.defaultView ?? null;
7009
7036
  const setKeepOpen = useCallback((next) => {
7010
7037
  keepOpenRef.current = next;
7011
7038
  setKeepOpenState(next);
@@ -7040,7 +7067,7 @@ var CustomBubbleMenu = ({
7040
7067
  return;
7041
7068
  }
7042
7069
  const isInputFocused = () => {
7043
- const active = document.activeElement;
7070
+ const active = editorDocument.activeElement;
7044
7071
  return Boolean(active && (menuRef.current?.contains(active) || active.closest?.("[data-ueditor-keep-open]")));
7045
7072
  };
7046
7073
  if (!keepOpenRef.current && !isInputFocused() && (context2 === "none" || !view.hasFocus())) {
@@ -7069,7 +7096,10 @@ var CustomBubbleMenu = ({
7069
7096
  start,
7070
7097
  end,
7071
7098
  menuSize: { width: menuWidth, height: menuHeight },
7072
- viewport: { width: window.innerWidth, height: window.innerHeight },
7099
+ viewport: {
7100
+ width: editorWindow?.innerWidth ?? window.innerWidth,
7101
+ height: editorWindow?.innerHeight ?? window.innerHeight
7102
+ },
7073
7103
  offset: BUBBLE_MENU_OFFSET
7074
7104
  }));
7075
7105
  if (keepOpenRef.current) {
@@ -7084,7 +7114,7 @@ var CustomBubbleMenu = ({
7084
7114
  }, SHOW_DELAY_MS);
7085
7115
  };
7086
7116
  const handleBlur = () => {
7087
- const isInputFocused = Boolean(document.activeElement && (menuRef.current?.contains(document.activeElement) || document.activeElement.closest?.("[data-ueditor-keep-open]")));
7117
+ const isInputFocused = Boolean(editorDocument.activeElement && (menuRef.current?.contains(editorDocument.activeElement) || editorDocument.activeElement.closest?.("[data-ueditor-keep-open]")));
7088
7118
  if (!keepOpenRef.current && !isInputFocused) {
7089
7119
  clearShowTimeout();
7090
7120
  setIsVisible(false);
@@ -7093,10 +7123,10 @@ var CustomBubbleMenu = ({
7093
7123
  let animationFrameId = null;
7094
7124
  const schedulePositionUpdate = () => {
7095
7125
  if (animationFrameId !== null) return;
7096
- animationFrameId = requestAnimationFrame(() => {
7126
+ animationFrameId = editorWindow?.requestAnimationFrame(() => {
7097
7127
  animationFrameId = null;
7098
7128
  updatePosition();
7099
- });
7129
+ }) ?? null;
7100
7130
  };
7101
7131
  editor.on("transaction", schedulePositionUpdate);
7102
7132
  editor.on("focus", schedulePositionUpdate);
@@ -7106,33 +7136,33 @@ var CustomBubbleMenu = ({
7106
7136
  return () => {
7107
7137
  updatePositionRef.current = () => {
7108
7138
  };
7109
- if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);
7139
+ if (animationFrameId !== null) editorWindow?.cancelAnimationFrame(animationFrameId);
7110
7140
  clearShowTimeout();
7111
7141
  editor.off("transaction", schedulePositionUpdate);
7112
7142
  editor.off("focus", schedulePositionUpdate);
7113
7143
  editor.off("blur", handleBlur);
7114
7144
  };
7115
- }, [editor]);
7145
+ }, [editor, editorDocument, editorWindow]);
7116
7146
  useEffect5(() => {
7117
- if (!isVisible || typeof ResizeObserver === "undefined") return;
7147
+ if (!isVisible || !portalWindow?.ResizeObserver) return;
7118
7148
  const menu = menuRef.current;
7119
7149
  if (!menu) return;
7120
7150
  let animationFrameId = null;
7121
- const observer = new ResizeObserver(() => {
7122
- if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);
7123
- animationFrameId = requestAnimationFrame(() => {
7151
+ const observer = new portalWindow.ResizeObserver(() => {
7152
+ if (animationFrameId !== null) portalWindow.cancelAnimationFrame(animationFrameId);
7153
+ animationFrameId = portalWindow.requestAnimationFrame(() => {
7124
7154
  animationFrameId = null;
7125
7155
  updatePositionRef.current();
7126
7156
  });
7127
7157
  });
7128
7158
  observer.observe(menu);
7129
7159
  return () => {
7130
- if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);
7160
+ if (animationFrameId !== null) portalWindow.cancelAnimationFrame(animationFrameId);
7131
7161
  observer.disconnect();
7132
7162
  };
7133
- }, [isVisible]);
7163
+ }, [isVisible, portalWindow]);
7134
7164
  useEffect5(() => {
7135
- if (!isVisible) return;
7165
+ if (!isVisible || !portalDocument) return;
7136
7166
  const handlePointerDown = (event) => {
7137
7167
  const target = event.target;
7138
7168
  if (target && (menuRef.current?.contains(target) || target.closest("[data-ueditor-keep-open]"))) return;
@@ -7142,13 +7172,13 @@ var CustomBubbleMenu = ({
7142
7172
  if (event.key === "Escape") closeBubbleMenu();
7143
7173
  };
7144
7174
  const unsubscribePointerDown = subscribeSharedGlobalEvent(
7145
- document,
7175
+ portalDocument,
7146
7176
  "pointerdown",
7147
7177
  handlePointerDown,
7148
7178
  true
7149
7179
  );
7150
7180
  const unsubscribeKeyDown = subscribeSharedGlobalEvent(
7151
- document,
7181
+ portalDocument,
7152
7182
  "keydown",
7153
7183
  handleKeyDown2
7154
7184
  );
@@ -7156,8 +7186,8 @@ var CustomBubbleMenu = ({
7156
7186
  unsubscribePointerDown();
7157
7187
  unsubscribeKeyDown();
7158
7188
  };
7159
- }, [closeBubbleMenu, editor, isVisible]);
7160
- if (!isVisible) return null;
7189
+ }, [closeBubbleMenu, editor, isVisible, portalDocument]);
7190
+ if (!isVisible || !portalContainer) return null;
7161
7191
  const context = getBubbleMenuContext(editor);
7162
7192
  if (context === "none") return null;
7163
7193
  return createPortal(
@@ -7209,13 +7239,16 @@ var CustomBubbleMenu = ({
7209
7239
  )
7210
7240
  }
7211
7241
  ),
7212
- document.body
7242
+ portalContainer
7213
7243
  );
7214
7244
  };
7215
7245
  var CustomFloatingMenu = ({ editor }) => {
7216
7246
  const FLOATING_MENU_OFFSET = 16;
7217
7247
  const [isVisible, setIsVisible] = useState5(false);
7218
7248
  const [position, setPosition2] = useState5({ top: 0, left: 0 });
7249
+ const getPortalContainer = useUEditorPortalContainerGetter();
7250
+ const portalContainer = isVisible ? resolveUEditorPortalContainer(getPortalContainer) : null;
7251
+ const editorWindow = editor.view.dom.ownerDocument.defaultView;
7219
7252
  useEffect5(() => {
7220
7253
  const updatePosition = () => {
7221
7254
  const { state, view } = editor;
@@ -7233,23 +7266,23 @@ var CustomFloatingMenu = ({ editor }) => {
7233
7266
  let animationFrameId = null;
7234
7267
  const schedulePositionUpdate = () => {
7235
7268
  if (animationFrameId !== null) return;
7236
- animationFrameId = requestAnimationFrame(() => {
7269
+ animationFrameId = editorWindow?.requestAnimationFrame(() => {
7237
7270
  animationFrameId = null;
7238
7271
  updatePosition();
7239
- });
7272
+ }) ?? null;
7240
7273
  };
7241
7274
  editor.on("transaction", schedulePositionUpdate);
7242
7275
  editor.on("focus", schedulePositionUpdate);
7243
7276
  editor.on("blur", handleBlur);
7244
7277
  schedulePositionUpdate();
7245
7278
  return () => {
7246
- if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);
7279
+ if (animationFrameId !== null) editorWindow?.cancelAnimationFrame(animationFrameId);
7247
7280
  editor.off("transaction", schedulePositionUpdate);
7248
7281
  editor.off("focus", schedulePositionUpdate);
7249
7282
  editor.off("blur", handleBlur);
7250
7283
  };
7251
- }, [editor]);
7252
- if (!isVisible) return null;
7284
+ }, [editor, editorWindow]);
7285
+ if (!isVisible || !portalContainer) return null;
7253
7286
  return createPortal(
7254
7287
  /* @__PURE__ */ jsx12(
7255
7288
  "div",
@@ -7265,7 +7298,7 @@ var CustomFloatingMenu = ({ editor }) => {
7265
7298
  children: /* @__PURE__ */ jsx12(FloatingMenuContent, { editor })
7266
7299
  }
7267
7300
  ),
7268
- document.body
7301
+ portalContainer
7269
7302
  );
7270
7303
  };
7271
7304
 
@@ -12490,11 +12523,15 @@ function nearestIndex(centers, position) {
12490
12523
  });
12491
12524
  return bestIndex;
12492
12525
  }
12526
+ function setDocumentCursor(ownerDocument, cursor) {
12527
+ ownerDocument.body.style.cursor = cursor;
12528
+ }
12493
12529
  function getSelectedCell(editor) {
12494
- const browserSelection = window.getSelection();
12530
+ const editorWindow = editor.view.dom.ownerDocument.defaultView;
12531
+ const browserSelection = editorWindow?.getSelection();
12495
12532
  const anchorElement = resolveEventElement(browserSelection?.anchorNode ?? null);
12496
12533
  const anchorCell = anchorElement?.closest?.("th,td");
12497
- if (anchorCell instanceof HTMLTableCellElement) {
12534
+ if (editorWindow && anchorCell instanceof editorWindow.HTMLTableCellElement) {
12498
12535
  return anchorCell;
12499
12536
  }
12500
12537
  const domAtPos = editor.view.domAtPos(editor.state.selection.from);
@@ -12502,6 +12539,8 @@ function getSelectedCell(editor) {
12502
12539
  }
12503
12540
  function TableControls({ editor, containerRef, showCellInspector = true }) {
12504
12541
  const t = useSmartTranslations("UEditor");
12542
+ const editorDocument = editor.view.dom.ownerDocument;
12543
+ const editorWindow = editorDocument.defaultView;
12505
12544
  const [layout, setLayout] = React10.useState(null);
12506
12545
  const [dragPreview, setDragPreview] = React10.useState(null);
12507
12546
  const [tableResizeActive, setTableResizeActive] = React10.useState(false);
@@ -12532,17 +12571,18 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12532
12571
  }, [editor, syncFromCell]);
12533
12572
  const scheduleSyncFromSelection = React10.useCallback(() => {
12534
12573
  if (syncFrameRef.current !== null) return;
12535
- syncFrameRef.current = window.requestAnimationFrame(() => {
12574
+ if (!editorWindow) return;
12575
+ syncFrameRef.current = editorWindow.requestAnimationFrame(() => {
12536
12576
  syncFrameRef.current = null;
12537
12577
  syncFromSelection();
12538
12578
  });
12539
- }, [syncFromSelection]);
12579
+ }, [editorWindow, syncFromSelection]);
12540
12580
  React10.useEffect(() => () => {
12541
12581
  if (syncFrameRef.current !== null) {
12542
- window.cancelAnimationFrame(syncFrameRef.current);
12582
+ editorWindow?.cancelAnimationFrame(syncFrameRef.current);
12543
12583
  syncFrameRef.current = null;
12544
12584
  }
12545
- }, []);
12585
+ }, [editorWindow]);
12546
12586
  const refreshCurrentLayout = React10.useCallback(() => {
12547
12587
  const currentLayout = layoutRef.current;
12548
12588
  if (!currentLayout) return;
@@ -12560,17 +12600,18 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12560
12600
  }, [containerRef, editor]);
12561
12601
  const scheduleCurrentLayoutRefresh = React10.useCallback(() => {
12562
12602
  if (!layoutRef.current || layoutRefreshFrameRef.current !== null) return;
12563
- layoutRefreshFrameRef.current = window.requestAnimationFrame(() => {
12603
+ if (!editorWindow) return;
12604
+ layoutRefreshFrameRef.current = editorWindow.requestAnimationFrame(() => {
12564
12605
  layoutRefreshFrameRef.current = null;
12565
12606
  refreshCurrentLayout();
12566
12607
  });
12567
- }, [refreshCurrentLayout]);
12608
+ }, [editorWindow, refreshCurrentLayout]);
12568
12609
  React10.useEffect(() => () => {
12569
12610
  if (layoutRefreshFrameRef.current !== null) {
12570
- window.cancelAnimationFrame(layoutRefreshFrameRef.current);
12611
+ editorWindow?.cancelAnimationFrame(layoutRefreshFrameRef.current);
12571
12612
  layoutRefreshFrameRef.current = null;
12572
12613
  }
12573
- }, []);
12614
+ }, [editorWindow]);
12574
12615
  const updateTableResizePreview = React10.useCallback((dimensions) => {
12575
12616
  const frame = tableResizeFrameRef.current;
12576
12617
  if (!frame) return;
@@ -12600,15 +12641,15 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12600
12641
  }
12601
12642
  }
12602
12643
  if (tableResizePreviewFrameRef.current !== null) {
12603
- window.cancelAnimationFrame(tableResizePreviewFrameRef.current);
12644
+ editorWindow?.cancelAnimationFrame(tableResizePreviewFrameRef.current);
12604
12645
  tableResizePreviewFrameRef.current = null;
12605
12646
  }
12606
12647
  dragStateRef.current = null;
12607
12648
  setDragPreview(null);
12608
12649
  setTableResizeActive(false);
12609
12650
  resetTableResizePreview();
12610
- document.body.style.cursor = "";
12611
- }, [resetTableResizePreview]);
12651
+ setDocumentCursor(editorDocument, "");
12652
+ }, [editorDocument, editorWindow, resetTableResizePreview]);
12612
12653
  const updateHoverState = React10.useCallback((event) => {
12613
12654
  const activeLayout = layoutRef.current;
12614
12655
  const surface = containerRef.current;
@@ -12689,7 +12730,8 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12689
12730
  surface.addEventListener("mousemove", handleSurfaceMouseMove);
12690
12731
  surface.addEventListener("scroll", scheduleCurrentLayoutRefresh, scrollListenerOptions);
12691
12732
  surface.addEventListener(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT, scheduleCurrentLayoutRefresh);
12692
- const unsubscribeResize = subscribeSharedGlobalEvent(window, "resize", scheduleCurrentLayoutRefresh);
12733
+ if (!editorWindow) return void 0;
12734
+ const unsubscribeResize = subscribeSharedGlobalEvent(editorWindow, "resize", scheduleCurrentLayoutRefresh);
12693
12735
  editor.on("selectionUpdate", scheduleSyncFromSelection);
12694
12736
  editor.on("update", scheduleCurrentLayoutRefresh);
12695
12737
  syncFromSelection();
@@ -12708,7 +12750,7 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12708
12750
  editor.off("selectionUpdate", scheduleSyncFromSelection);
12709
12751
  editor.off("update", scheduleCurrentLayoutRefresh);
12710
12752
  };
12711
- }, [clearDrag, containerRef, editor, scheduleCurrentLayoutRefresh, scheduleSyncFromSelection, syncFromCell, syncFromSelection, updateHoverState]);
12753
+ }, [clearDrag, containerRef, editor, editorWindow, scheduleCurrentLayoutRefresh, scheduleSyncFromSelection, syncFromCell, syncFromSelection, updateHoverState]);
12712
12754
  const runAtCellPos = React10.useCallback((cellPos, command, options) => {
12713
12755
  const result = runTableCommandAtCellPos(editor, cellPos, command);
12714
12756
  if (options?.sync !== false) {
@@ -12782,20 +12824,20 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12782
12824
  pendingDimensions
12783
12825
  };
12784
12826
  updateTableResizePreview(pendingDimensions);
12785
- document.body.style.cursor = "nwse-resize";
12786
- }, [editor, updateTableResizePreview]);
12827
+ setDocumentCursor(editorDocument, "nwse-resize");
12828
+ }, [editor, editorDocument, updateTableResizePreview]);
12787
12829
  const startAddColumnDrag = React10.useCallback(() => {
12788
12830
  setOpenMenuKey(null);
12789
12831
  dragStateRef.current = { kind: "add-column", previewCols: 1 };
12790
12832
  setDragPreview({ kind: "add-column", previewCols: 1 });
12791
- document.body.style.cursor = "ew-resize";
12792
- }, []);
12833
+ setDocumentCursor(editorDocument, "ew-resize");
12834
+ }, [editorDocument]);
12793
12835
  const startAddRowDrag = React10.useCallback(() => {
12794
12836
  setOpenMenuKey(null);
12795
12837
  dragStateRef.current = { kind: "add-row", previewRows: 1 };
12796
12838
  setDragPreview({ kind: "add-row", previewRows: 1 });
12797
- document.body.style.cursor = "ns-resize";
12798
- }, []);
12839
+ setDocumentCursor(editorDocument, "ns-resize");
12840
+ }, [editorDocument]);
12799
12841
  const startRowDrag = React10.useCallback((rowHandle) => {
12800
12842
  setOpenMenuKey(null);
12801
12843
  dragStateRef.current = {
@@ -12811,8 +12853,8 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12811
12853
  targetStart: rowHandle.start,
12812
12854
  targetSize: rowHandle.size
12813
12855
  });
12814
- document.body.style.cursor = "grabbing";
12815
- }, []);
12856
+ setDocumentCursor(editorDocument, "grabbing");
12857
+ }, [editorDocument]);
12816
12858
  const startColumnDrag = React10.useCallback((columnHandle) => {
12817
12859
  setOpenMenuKey(null);
12818
12860
  dragStateRef.current = {
@@ -12828,9 +12870,10 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12828
12870
  targetStart: columnHandle.start,
12829
12871
  targetSize: columnHandle.size
12830
12872
  });
12831
- document.body.style.cursor = "grabbing";
12832
- }, []);
12873
+ setDocumentCursor(editorDocument, "grabbing");
12874
+ }, [editorDocument]);
12833
12875
  React10.useEffect(() => {
12876
+ if (!editorWindow) return;
12834
12877
  const handleMouseMove2 = (event) => {
12835
12878
  const dragState = dragStateRef.current;
12836
12879
  const activeLayout = layoutRef.current;
@@ -12854,7 +12897,7 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12854
12897
  targetStart: targetRow.start,
12855
12898
  targetSize: targetRow.size
12856
12899
  });
12857
- document.body.style.cursor = "grabbing";
12900
+ setDocumentCursor(editorDocument, "grabbing");
12858
12901
  return;
12859
12902
  }
12860
12903
  if (dragState.kind === "column") {
@@ -12869,20 +12912,20 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12869
12912
  targetStart: targetColumn.start,
12870
12913
  targetSize: targetColumn.size
12871
12914
  });
12872
- document.body.style.cursor = "grabbing";
12915
+ setDocumentCursor(editorDocument, "grabbing");
12873
12916
  return;
12874
12917
  }
12875
12918
  if (dragState.kind === "add-column") {
12876
12919
  const previewCols = Math.max(1, 1 + Math.floor(Math.max(0, relativeX - (activeLayout.tableLeft + activeLayout.tableWidth)) / activeLayout.avgColumnWidth));
12877
12920
  dragState.previewCols = previewCols;
12878
12921
  setDragPreview({ kind: "add-column", previewCols });
12879
- document.body.style.cursor = "ew-resize";
12922
+ setDocumentCursor(editorDocument, "ew-resize");
12880
12923
  return;
12881
12924
  }
12882
12925
  const previewRows = Math.max(1, 1 + Math.floor(Math.max(0, relativeY - (activeLayout.tableTop + activeLayout.tableHeight)) / activeLayout.avgRowHeight));
12883
12926
  dragState.previewRows = previewRows;
12884
12927
  setDragPreview({ kind: "add-row", previewRows });
12885
- document.body.style.cursor = "ns-resize";
12928
+ setDocumentCursor(editorDocument, "ns-resize");
12886
12929
  };
12887
12930
  const handleMouseUp = () => {
12888
12931
  const dragState = dragStateRef.current;
@@ -12914,19 +12957,20 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12914
12957
  clearDrag();
12915
12958
  };
12916
12959
  const unsubscribeMouseMove = subscribeSharedGlobalEvent(
12917
- window,
12960
+ editorWindow,
12918
12961
  "mousemove",
12919
12962
  handleMouseMove2
12920
12963
  );
12921
- const unsubscribeMouseUp = subscribeSharedGlobalEvent(window, "mouseup", handleMouseUp);
12922
- const unsubscribeBlur = subscribeSharedGlobalEvent(window, "blur", clearDrag);
12964
+ const unsubscribeMouseUp = subscribeSharedGlobalEvent(editorWindow, "mouseup", handleMouseUp);
12965
+ const unsubscribeBlur = subscribeSharedGlobalEvent(editorWindow, "blur", clearDrag);
12923
12966
  return () => {
12924
12967
  unsubscribeMouseMove();
12925
12968
  unsubscribeMouseUp();
12926
12969
  unsubscribeBlur();
12927
12970
  };
12928
- }, [clearDrag, containerRef, editor, expandTableBy, scheduleSyncFromSelection]);
12971
+ }, [clearDrag, containerRef, editor, editorDocument, editorWindow, expandTableBy, scheduleSyncFromSelection]);
12929
12972
  React10.useEffect(() => {
12973
+ if (!editorWindow) return;
12930
12974
  const handlePointerMove = (event) => {
12931
12975
  const dragState = dragStateRef.current;
12932
12976
  if (!dragState || dragState.kind !== "resize-table" || event.pointerId !== dragState.pointerId) return;
@@ -12938,21 +12982,22 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12938
12982
  snapshot: dragState.snapshot
12939
12983
  });
12940
12984
  if (tableResizePreviewFrameRef.current === null) {
12941
- tableResizePreviewFrameRef.current = window.requestAnimationFrame(() => {
12985
+ if (!editorWindow) return;
12986
+ tableResizePreviewFrameRef.current = editorWindow.requestAnimationFrame(() => {
12942
12987
  tableResizePreviewFrameRef.current = null;
12943
12988
  const currentDragState = dragStateRef.current;
12944
12989
  if (!currentDragState || currentDragState.kind !== "resize-table") return;
12945
12990
  updateTableResizePreview(currentDragState.pendingDimensions);
12946
12991
  });
12947
12992
  }
12948
- document.body.style.cursor = "nwse-resize";
12993
+ setDocumentCursor(editorDocument, "nwse-resize");
12949
12994
  if (event.cancelable) event.preventDefault();
12950
12995
  };
12951
12996
  const finishTableResize = (event, commit) => {
12952
12997
  const dragState = dragStateRef.current;
12953
12998
  if (!dragState || dragState.kind !== "resize-table" || event.pointerId !== dragState.pointerId) return;
12954
12999
  if (tableResizePreviewFrameRef.current !== null) {
12955
- window.cancelAnimationFrame(tableResizePreviewFrameRef.current);
13000
+ editorWindow?.cancelAnimationFrame(tableResizePreviewFrameRef.current);
12956
13001
  tableResizePreviewFrameRef.current = null;
12957
13002
  }
12958
13003
  updateTableResizePreview(dragState.pendingDimensions);
@@ -12964,18 +13009,18 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12964
13009
  const handlePointerUp = (event) => finishTableResize(event, true);
12965
13010
  const handlePointerCancel = (event) => finishTableResize(event, false);
12966
13011
  const unsubscribePointerMove = subscribeSharedGlobalEvent(
12967
- window,
13012
+ editorWindow,
12968
13013
  "pointermove",
12969
13014
  handlePointerMove,
12970
13015
  { passive: false }
12971
13016
  );
12972
13017
  const unsubscribePointerUp = subscribeSharedGlobalEvent(
12973
- window,
13018
+ editorWindow,
12974
13019
  "pointerup",
12975
13020
  handlePointerUp
12976
13021
  );
12977
13022
  const unsubscribePointerCancel = subscribeSharedGlobalEvent(
12978
- window,
13023
+ editorWindow,
12979
13024
  "pointercancel",
12980
13025
  handlePointerCancel
12981
13026
  );
@@ -12984,11 +13029,11 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12984
13029
  unsubscribePointerUp();
12985
13030
  unsubscribePointerCancel();
12986
13031
  if (tableResizePreviewFrameRef.current !== null) {
12987
- window.cancelAnimationFrame(tableResizePreviewFrameRef.current);
13032
+ editorWindow?.cancelAnimationFrame(tableResizePreviewFrameRef.current);
12988
13033
  tableResizePreviewFrameRef.current = null;
12989
13034
  }
12990
13035
  };
12991
- }, [clearDrag, editor, scheduleSyncFromSelection, updateTableResizePreview]);
13036
+ }, [clearDrag, editor, editorDocument, editorWindow, scheduleSyncFromSelection, updateTableResizePreview]);
12992
13037
  const openCellInspector = React10.useCallback(() => {
12993
13038
  const cellPos = layoutRef.current?.cellPos;
12994
13039
  if (!showCellInspector || cellPos == null) return;
@@ -12997,10 +13042,10 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12997
13042
  headCell: cellPos
12998
13043
  });
12999
13044
  if (!didSelect) return;
13000
- window.requestAnimationFrame(() => {
13045
+ editorWindow?.requestAnimationFrame(() => {
13001
13046
  if (!editor.isDestroyed) editor.view.focus();
13002
13047
  });
13003
- }, [editor, showCellInspector]);
13048
+ }, [editor, editorWindow, showCellInspector]);
13004
13049
  const menuItems = React10.useMemo(() => {
13005
13050
  if (!layout) return [];
13006
13051
  return [
@@ -13229,6 +13274,10 @@ import React12, { useEffect as useEffect6, useRef as useRef6 } from "react";
13229
13274
 
13230
13275
  // src/components/UEditor/use-table-row-resize.ts
13231
13276
  import React11, { useRef as useRef5 } from "react";
13277
+ function setRowResizeBodyState(ownerDocument, active) {
13278
+ ownerDocument.body.style.userSelect = active ? "none" : "";
13279
+ ownerDocument.body.style.cursor = active ? "row-resize" : "";
13280
+ }
13232
13281
  function useTableRowResize({
13233
13282
  editor,
13234
13283
  setHoveredTableCell,
@@ -13268,9 +13317,9 @@ function useTableRowResize({
13268
13317
  };
13269
13318
  showRowGuide(table, row, cell, startHeight);
13270
13319
  isRowResizingGlobal.active = true;
13271
- window.getSelection()?.removeAllRanges();
13272
- document.body.style.userSelect = "none";
13273
- document.body.style.cursor = "row-resize";
13320
+ const editorDocument = editor.view.dom.ownerDocument;
13321
+ editorDocument.defaultView?.getSelection()?.removeAllRanges();
13322
+ setRowResizeBodyState(editorDocument, true);
13274
13323
  event.preventDefault();
13275
13324
  event.stopPropagation();
13276
13325
  return true;
@@ -13283,13 +13332,13 @@ function useTableRowResize({
13283
13332
  Math.round(state.startHeight + (event.clientY - state.startY))
13284
13333
  );
13285
13334
  if (nextHeight === state.pendingHeight) {
13286
- document.body.style.cursor = "row-resize";
13335
+ setRowResizeBodyState(state.rowElement.ownerDocument, true);
13287
13336
  showRowGuide(state.tableElement, state.rowElement, state.cellElement, state.pendingHeight);
13288
13337
  return;
13289
13338
  }
13290
13339
  state.pendingHeight = nextHeight;
13291
13340
  state.previewHeight = nextHeight;
13292
- document.body.style.cursor = "row-resize";
13341
+ setRowResizeBodyState(state.rowElement.ownerDocument, true);
13293
13342
  showRowGuide(state.tableElement, state.rowElement, state.cellElement, nextHeight);
13294
13343
  }, [showRowGuide]);
13295
13344
  const handlePointerUp = React11.useCallback((event) => {
@@ -13312,28 +13361,29 @@ function useTableRowResize({
13312
13361
  }
13313
13362
  stateRef.current = null;
13314
13363
  isRowResizingGlobal.active = false;
13315
- document.body.style.userSelect = "";
13316
- document.body.style.cursor = "";
13364
+ setRowResizeBodyState(state.rowElement.ownerDocument, false);
13317
13365
  clearHoveredTableCell();
13318
13366
  clearAllTableResizeHover();
13319
13367
  scheduleTableLayoutSync();
13320
13368
  }, [clearAllTableResizeHover, clearHoveredTableCell, editor, scheduleTableLayoutSync]);
13321
13369
  const cancelResize = React11.useCallback(() => {
13322
- if (!stateRef.current) return;
13370
+ const state = stateRef.current;
13371
+ if (!state) return;
13323
13372
  stateRef.current = null;
13324
13373
  isRowResizingGlobal.active = false;
13325
- document.body.style.userSelect = "";
13326
- document.body.style.cursor = "";
13374
+ setRowResizeBodyState(state.rowElement.ownerDocument, false);
13327
13375
  clearHoveredTableCell();
13328
13376
  clearAllTableResizeHover();
13329
13377
  scheduleTableLayoutSync();
13330
13378
  }, [clearAllTableResizeHover, clearHoveredTableCell, scheduleTableLayoutSync]);
13331
13379
  const cleanup = React11.useCallback(() => {
13380
+ const editorDocument = stateRef.current?.rowElement.ownerDocument ?? editor?.view.dom.ownerDocument;
13332
13381
  stateRef.current = null;
13333
13382
  isRowResizingGlobal.active = false;
13334
- document.body.style.userSelect = "";
13335
- document.body.style.cursor = "";
13336
- }, []);
13383
+ if (editorDocument) {
13384
+ setRowResizeBodyState(editorDocument, false);
13385
+ }
13386
+ }, [editor]);
13337
13387
  return {
13338
13388
  beginResize,
13339
13389
  cancelResize,
@@ -13384,7 +13434,8 @@ function useUEditorTableInteractions(editor, editable = true) {
13384
13434
  const activeHotspotKeyRef = useRef6(null);
13385
13435
  const clearHotspotTimer = React12.useCallback(() => {
13386
13436
  if (hotspotTimerRef.current !== null) {
13387
- window.clearTimeout(hotspotTimerRef.current);
13437
+ const realm = editorContentRef.current?.ownerDocument.defaultView;
13438
+ realm?.clearTimeout(hotspotTimerRef.current);
13388
13439
  hotspotTimerRef.current = null;
13389
13440
  }
13390
13441
  }, []);
@@ -13412,12 +13463,14 @@ function useUEditorTableInteractions(editor, editable = true) {
13412
13463
  }, []);
13413
13464
  const scheduleTableLayoutSync = React12.useCallback(() => {
13414
13465
  if (!activeTableCellRef.current || tableLayoutSyncFrameRef.current !== null) return;
13415
- tableLayoutSyncFrameRef.current = window.requestAnimationFrame(() => {
13466
+ const realm = editorContentRef.current?.ownerDocument.defaultView;
13467
+ if (!realm) return;
13468
+ tableLayoutSyncFrameRef.current = realm.requestAnimationFrame(() => {
13416
13469
  tableLayoutSyncFrameRef.current = null;
13417
13470
  const activeCell = activeTableCellRef.current;
13418
13471
  if (!activeCell) return;
13419
13472
  updateActiveCellHighlight(activeCell);
13420
- editorContentRef.current?.dispatchEvent(new CustomEvent(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT));
13473
+ editorContentRef.current?.dispatchEvent(new realm.CustomEvent(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT));
13421
13474
  });
13422
13475
  }, [updateActiveCellHighlight]);
13423
13476
  const setActiveTableCell = React12.useCallback((cell) => {
@@ -13495,6 +13548,9 @@ function useUEditorTableInteractions(editor, editable = true) {
13495
13548
  useEffect6(() => {
13496
13549
  if (!editor || !editable) return void 0;
13497
13550
  const proseMirror = editor.view.dom;
13551
+ const editorDocument = proseMirror.ownerDocument;
13552
+ const editorWindow = editorDocument.defaultView;
13553
+ if (!editorWindow) return void 0;
13498
13554
  const surface = editorContentRef.current;
13499
13555
  let selectionSyncFrameId = 0;
13500
13556
  let selectionSyncTimeoutId = 0;
@@ -13510,14 +13566,14 @@ function useUEditorTableInteractions(editor, editable = true) {
13510
13566
  setActiveTableCell(getSelectionTableCell(editor.view) ?? pendingFallbackCell);
13511
13567
  };
13512
13568
  if (selectionSyncFrameId === 0) {
13513
- selectionSyncFrameId = window.requestAnimationFrame(() => {
13569
+ selectionSyncFrameId = editorWindow.requestAnimationFrame(() => {
13514
13570
  selectionSyncFrameId = 0;
13515
13571
  syncActiveCell();
13516
13572
  if (selectionSyncTimeoutId === 0) pendingFallbackCell = null;
13517
13573
  });
13518
13574
  }
13519
- window.clearTimeout(selectionSyncTimeoutId);
13520
- selectionSyncTimeoutId = window.setTimeout(() => {
13575
+ editorWindow.clearTimeout(selectionSyncTimeoutId);
13576
+ selectionSyncTimeoutId = editorWindow.setTimeout(() => {
13521
13577
  selectionSyncTimeoutId = 0;
13522
13578
  syncActiveCell();
13523
13579
  if (selectionSyncFrameId === 0) pendingFallbackCell = null;
@@ -13538,12 +13594,12 @@ function useUEditorTableInteractions(editor, editable = true) {
13538
13594
  return;
13539
13595
  }
13540
13596
  const target = resolveEventElement(event.target);
13541
- if (!(target instanceof Element)) {
13597
+ if (!(target instanceof editorWindow.Element)) {
13542
13598
  clearAllTableResizeHover();
13543
13599
  return;
13544
13600
  }
13545
13601
  const cell = target.closest("th,td");
13546
- if (!(cell instanceof HTMLElement)) {
13602
+ if (!(cell instanceof editorWindow.HTMLElement)) {
13547
13603
  clearHoveredTableCell();
13548
13604
  clearAllTableResizeHover();
13549
13605
  return;
@@ -13551,7 +13607,7 @@ function useUEditorTableInteractions(editor, editable = true) {
13551
13607
  setHoveredTableCell(cell);
13552
13608
  const row = cell.closest("tr");
13553
13609
  const table = cell.closest("table");
13554
- if (!(row instanceof HTMLTableRowElement) || !(table instanceof HTMLTableElement)) {
13610
+ if (!(row instanceof editorWindow.HTMLTableRowElement) || !(table instanceof editorWindow.HTMLTableElement)) {
13555
13611
  clearHoveredTableCell();
13556
13612
  clearAllTableResizeHover();
13557
13613
  return;
@@ -13568,7 +13624,7 @@ function useUEditorTableInteractions(editor, editable = true) {
13568
13624
  if (activeHotspotKeyRef.current !== hotspotKey) {
13569
13625
  clearHotspotTimer();
13570
13626
  activeHotspotKeyRef.current = hotspotKey;
13571
- hotspotTimerRef.current = window.setTimeout(() => {
13627
+ hotspotTimerRef.current = editorWindow.setTimeout(() => {
13572
13628
  hotspotTimerRef.current = null;
13573
13629
  hideColumnGuide();
13574
13630
  showRowGuide(table, rowTarget.row, rowTarget.cell);
@@ -13586,7 +13642,7 @@ function useUEditorTableInteractions(editor, editable = true) {
13586
13642
  if (activeHotspotKeyRef.current !== hotspotKey) {
13587
13643
  clearHotspotTimer();
13588
13644
  activeHotspotKeyRef.current = hotspotKey;
13589
- hotspotTimerRef.current = window.setTimeout(() => {
13645
+ hotspotTimerRef.current = editorWindow.setTimeout(() => {
13590
13646
  hotspotTimerRef.current = null;
13591
13647
  hideRowGuide();
13592
13648
  showColumnGuide(table, colTarget.row, colTarget.cell);
@@ -13607,23 +13663,23 @@ function useUEditorTableInteractions(editor, editable = true) {
13607
13663
  const handleEditorMouseDown = (event) => {
13608
13664
  if (event.button !== 0) return;
13609
13665
  const target = resolveEventElement(event.target);
13610
- if (!(target instanceof Element)) {
13666
+ if (!(target instanceof editorWindow.Element)) {
13611
13667
  clearActiveTableCell();
13612
13668
  return;
13613
13669
  }
13614
13670
  const cell = target.closest("th,td");
13615
- if (!(cell instanceof HTMLTableCellElement)) {
13671
+ if (!(cell instanceof editorWindow.HTMLTableCellElement)) {
13616
13672
  clearActiveTableCell();
13617
13673
  return;
13618
13674
  }
13619
13675
  const row = cell.closest("tr");
13620
13676
  const table = cell.closest("table");
13621
- if (!(row instanceof HTMLTableRowElement) || !(table instanceof HTMLTableElement)) return;
13677
+ if (!(row instanceof editorWindow.HTMLTableRowElement) || !(table instanceof editorWindow.HTMLTableElement)) return;
13622
13678
  const rowTarget = resolveRowResizeTarget(cell, event.clientX, event.clientY);
13623
13679
  if (rowTarget) {
13624
13680
  event.preventDefault();
13625
13681
  event.stopPropagation();
13626
- window.getSelection()?.removeAllRanges();
13682
+ editorWindow.getSelection()?.removeAllRanges();
13627
13683
  if (beginResize(event, table, rowTarget.row, rowTarget.cell)) {
13628
13684
  suppressActiveCellHighlightRef.current = true;
13629
13685
  updateActiveCellHighlight(null);
@@ -13641,7 +13697,7 @@ function useUEditorTableInteractions(editor, editable = true) {
13641
13697
  handleRowResizePointerUp(event);
13642
13698
  if (wasRowResizing) {
13643
13699
  suppressActiveCellHighlightRef.current = false;
13644
- requestAnimationFrame(() => {
13700
+ editorWindow.requestAnimationFrame(() => {
13645
13701
  updateActiveCellHighlight(activeTableCellRef.current);
13646
13702
  });
13647
13703
  }
@@ -13662,24 +13718,24 @@ function useUEditorTableInteractions(editor, editable = true) {
13662
13718
  proseMirror.addEventListener("keyup", handleSelectionChange);
13663
13719
  proseMirror.addEventListener("focusin", handleSelectionChange);
13664
13720
  const unsubscribeSelectionChange = subscribeSharedGlobalEvent(
13665
- document,
13721
+ editorDocument,
13666
13722
  "selectionchange",
13667
13723
  handleSelectionChange
13668
13724
  );
13669
13725
  surface?.addEventListener(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT, handleActiveCellLayoutChange);
13670
13726
  surface?.addEventListener("scroll", handleActiveCellLayoutChange, scrollListenerOptions);
13671
- const unsubscribeResize = subscribeSharedGlobalEvent(window, "resize", handleActiveCellLayoutChange);
13727
+ const unsubscribeResize = subscribeSharedGlobalEvent(editorWindow, "resize", handleActiveCellLayoutChange);
13672
13728
  const unsubscribePointerMove = subscribeSharedGlobalEvent(
13673
- document,
13729
+ editorDocument,
13674
13730
  "pointermove",
13675
13731
  handlePointerMove
13676
13732
  );
13677
13733
  const unsubscribePointerUp = subscribeSharedGlobalEvent(
13678
- document,
13734
+ editorDocument,
13679
13735
  "pointerup",
13680
13736
  handlePointerUp
13681
13737
  );
13682
- const unsubscribeWindowBlur = subscribeSharedGlobalEvent(window, "blur", handleWindowBlur);
13738
+ const unsubscribeWindowBlur = subscribeSharedGlobalEvent(editorWindow, "blur", handleWindowBlur);
13683
13739
  editor.on("selectionUpdate", syncActiveTableCellFromSelection);
13684
13740
  editor.on("focus", syncActiveTableCellFromSelection);
13685
13741
  editor.on("blur", clearActiveTableCell);
@@ -13705,18 +13761,18 @@ function useUEditorTableInteractions(editor, editable = true) {
13705
13761
  editor.off("blur", clearActiveTableCell);
13706
13762
  editor.off("update", scheduleTableLayoutSync);
13707
13763
  if (selectionSyncFrameId !== 0) {
13708
- window.cancelAnimationFrame(selectionSyncFrameId);
13764
+ editorWindow.cancelAnimationFrame(selectionSyncFrameId);
13709
13765
  selectionSyncFrameId = 0;
13710
13766
  }
13711
- window.clearTimeout(selectionSyncTimeoutId);
13767
+ editorWindow.clearTimeout(selectionSyncTimeoutId);
13712
13768
  pendingFallbackCell = null;
13713
13769
  if (tableLayoutSyncFrameRef.current !== null) {
13714
- window.cancelAnimationFrame(tableLayoutSyncFrameRef.current);
13770
+ editorWindow.cancelAnimationFrame(tableLayoutSyncFrameRef.current);
13715
13771
  tableLayoutSyncFrameRef.current = null;
13716
13772
  }
13717
13773
  cleanupRowResize();
13718
13774
  suppressActiveCellHighlightRef.current = false;
13719
- document.body.style.cursor = "";
13775
+ editorDocument.body.style.cursor = "";
13720
13776
  clearActiveTableCell();
13721
13777
  clearHoveredTableCell();
13722
13778
  clearAllTableResizeHover();
@@ -13982,21 +14038,21 @@ function setPosition(element, left, top, width, height) {
13982
14038
  if (width != null) element.style.width = `${Math.max(0, width)}px`;
13983
14039
  if (height != null) element.style.height = `${Math.max(0, height)}px`;
13984
14040
  }
13985
- function createCoordinateLabel(kind, label) {
13986
- const element = document.createElement("span");
14041
+ function createCoordinateLabel(ownerDocument, kind, label) {
14042
+ const element = ownerDocument.createElement("span");
13987
14043
  element.dataset.ueditorFormulaCoordinate = kind;
13988
14044
  element.textContent = label;
13989
14045
  element.className = "pointer-events-none absolute z-30 flex items-center justify-center rounded-[3px] border border-primary/35 bg-primary/90 px-1 font-mono text-[10px] font-semibold leading-none text-primary-foreground shadow-sm";
13990
14046
  return element;
13991
14047
  }
13992
- function createReferenceHighlight(label) {
13993
- const element = document.createElement("span");
14048
+ function createReferenceHighlight(ownerDocument, label) {
14049
+ const element = ownerDocument.createElement("span");
13994
14050
  element.dataset.ueditorFormulaReference = label;
13995
14051
  element.className = "pointer-events-none absolute z-[21] rounded-[2px] border-2 border-emerald-500 bg-emerald-500/15";
13996
14052
  return element;
13997
14053
  }
13998
- function createBlockedReferenceHighlight(label) {
13999
- const element = document.createElement("span");
14054
+ function createBlockedReferenceHighlight(ownerDocument, label) {
14055
+ const element = ownerDocument.createElement("span");
14000
14056
  element.dataset.ueditorFormulaBlockedReference = label;
14001
14057
  element.className = "pointer-events-none absolute z-[22] rounded-[2px] border-2 border-destructive/80 bg-destructive/10";
14002
14058
  return element;
@@ -14008,6 +14064,9 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14008
14064
  const overlay = overlayRef.current;
14009
14065
  const container = containerRef.current;
14010
14066
  if (!overlay || !container) return void 0;
14067
+ const editorDocument = overlay.ownerDocument;
14068
+ const editorWindow = editorDocument.defaultView;
14069
+ if (!editorWindow) return void 0;
14011
14070
  let animationFrame = null;
14012
14071
  let activeTable = null;
14013
14072
  let activeTablePos = null;
@@ -14037,7 +14096,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14037
14096
  const rowSegments = Array(map.height);
14038
14097
  const cellInfos = [];
14039
14098
  for (const cell of context.tableDom.querySelectorAll("th,td")) {
14040
- if (!(cell instanceof HTMLTableCellElement)) continue;
14099
+ if (!(cell instanceof editorWindow.HTMLTableCellElement)) continue;
14041
14100
  const info = getFormulaTableCellInfo(editor.view, cell, context.tablePos);
14042
14101
  if (!info) continue;
14043
14102
  cellInfos.push(info);
@@ -14068,7 +14127,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14068
14127
  const fallbackColumnWidth = map.width > 0 ? tableRect.width / map.width : 0;
14069
14128
  const fallbackRowHeight = map.height > 0 ? tableRect.height / map.height : 0;
14070
14129
  const children = [];
14071
- const actions = document.createElement("div");
14130
+ const actions = editorDocument.createElement("div");
14072
14131
  actions.dataset.ueditorFormulaActions = "";
14073
14132
  actions.className = "pointer-events-auto absolute z-50 flex items-center gap-1 rounded-md border border-border bg-background p-1 shadow-md";
14074
14133
  const formulaCellRect = context.cellDom.getBoundingClientRect();
@@ -14079,13 +14138,13 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14079
14138
  formulaCellRect.left - containerRect.left + container.scrollLeft,
14080
14139
  formulaActionsTop - containerRect.top + container.scrollTop
14081
14140
  );
14082
- const applyButton = document.createElement("button");
14141
+ const applyButton = editorDocument.createElement("button");
14083
14142
  applyButton.type = "button";
14084
14143
  applyButton.dataset.ueditorFormulaApply = "";
14085
14144
  applyButton.disabled = isDraftTableFormula(context.formula);
14086
14145
  applyButton.textContent = `${applyButton.disabled ? "" : "\u2713 "}${labels.apply} (Enter)`;
14087
14146
  applyButton.className = "rounded bg-primary px-2.5 py-1 text-xs font-medium text-primary-foreground hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-45";
14088
- const cancelButton = document.createElement("button");
14147
+ const cancelButton = editorDocument.createElement("button");
14089
14148
  cancelButton.type = "button";
14090
14149
  cancelButton.dataset.ueditorFormulaCancel = "";
14091
14150
  cancelButton.textContent = `${labels.cancel} (Esc)`;
@@ -14114,7 +14173,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14114
14173
  size: fallbackColumnWidth,
14115
14174
  span: map.width
14116
14175
  };
14117
- const label = createCoordinateLabel("column", indexToColumnName(column));
14176
+ const label = createCoordinateLabel(editorDocument, "column", indexToColumnName(column));
14118
14177
  setPosition(label, segment.start, Math.max(0, tableTop - 22), segment.size, 20);
14119
14178
  children.push(label);
14120
14179
  }
@@ -14124,7 +14183,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14124
14183
  size: fallbackRowHeight,
14125
14184
  span: map.height
14126
14185
  };
14127
- const label = createCoordinateLabel("row", String(row + 1));
14186
+ const label = createCoordinateLabel(editorDocument, "row", String(row + 1));
14128
14187
  setPosition(label, Math.max(0, tableLeft - 28), segment.start, 26, segment.size);
14129
14188
  children.push(label);
14130
14189
  }
@@ -14133,7 +14192,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14133
14192
  for (const info of cellInfos) {
14134
14193
  if (!info) continue;
14135
14194
  const cellRect = info.cell.getBoundingClientRect();
14136
- const highlight = info.label !== context.formulaCellLabel && blockedReferences.has(info.label) ? createBlockedReferenceHighlight(info.label) : references.has(info.label) ? createReferenceHighlight(info.label) : null;
14195
+ const highlight = info.label !== context.formulaCellLabel && blockedReferences.has(info.label) ? createBlockedReferenceHighlight(editorDocument, info.label) : references.has(info.label) ? createReferenceHighlight(editorDocument, info.label) : null;
14137
14196
  if (!highlight) continue;
14138
14197
  setPosition(
14139
14198
  highlight,
@@ -14144,7 +14203,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14144
14203
  );
14145
14204
  children.push(highlight);
14146
14205
  }
14147
- hoverLabel = document.createElement("span");
14206
+ hoverLabel = editorDocument.createElement("span");
14148
14207
  hoverLabel.dataset.ueditorFormulaHoverLabel = "";
14149
14208
  hoverLabel.className = "pointer-events-none absolute z-40 hidden rounded bg-foreground px-1.5 py-1 font-mono text-[10px] font-semibold leading-none text-background shadow-md";
14150
14209
  children.push(hoverLabel);
@@ -14155,12 +14214,12 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14155
14214
  };
14156
14215
  const scheduleSync = () => {
14157
14216
  if (animationFrame != null) return;
14158
- animationFrame = window.requestAnimationFrame(syncOverlay);
14217
+ animationFrame = editorWindow.requestAnimationFrame(syncOverlay);
14159
14218
  };
14160
14219
  const handleMouseMove2 = (event) => {
14161
14220
  if (!activeTable || activeTablePos == null || !hoverLabel) return;
14162
- const target = event.target instanceof Element ? event.target.closest("th,td") : null;
14163
- if (!(target instanceof HTMLTableCellElement) || target.closest("table") !== activeTable) {
14221
+ const target = event.target instanceof editorWindow.Element ? event.target.closest("th,td") : null;
14222
+ if (!(target instanceof editorWindow.HTMLTableCellElement) || target.closest("table") !== activeTable) {
14164
14223
  hoverLabel.style.display = "none";
14165
14224
  return;
14166
14225
  }
@@ -14190,7 +14249,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14190
14249
  editor.view.dom.addEventListener("mouseleave", handleMouseLeave2);
14191
14250
  container.addEventListener(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT, scheduleSync);
14192
14251
  container.addEventListener("scroll", scheduleSync, scrollListenerOptions);
14193
- const unsubscribeResize = subscribeSharedGlobalEvent(window, "resize", scheduleSync);
14252
+ const unsubscribeResize = subscribeSharedGlobalEvent(editorWindow, "resize", scheduleSync);
14194
14253
  scheduleSync();
14195
14254
  return () => {
14196
14255
  editor.off("selectionUpdate", scheduleSync);
@@ -14202,7 +14261,7 @@ function useFormulaCoordinateOverlay(editor, containerRef, labels) {
14202
14261
  container.removeEventListener(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT, scheduleSync);
14203
14262
  container.removeEventListener("scroll", scheduleSync, scrollListenerOptions);
14204
14263
  unsubscribeResize();
14205
- if (animationFrame != null) window.cancelAnimationFrame(animationFrame);
14264
+ if (animationFrame != null) editorWindow.cancelAnimationFrame(animationFrame);
14206
14265
  clearOverlay();
14207
14266
  };
14208
14267
  }, [containerRef, editor, labels.apply, labels.cancel]);
@@ -14445,10 +14504,11 @@ function useUEditorOutput({
14445
14504
  // src/components/UEditor/UEditor.tsx
14446
14505
  import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
14447
14506
  var LazyMenuBar = React15.lazy(async () => {
14448
- const { MenuBar } = await import("./menu-bar-55SAOAX6.js");
14507
+ const { MenuBar } = await import("./menu-bar-YMEOEYJS.js");
14449
14508
  return { default: MenuBar };
14450
14509
  });
14451
14510
  var UEditor = React15.forwardRef(({
14511
+ getPortalContainer,
14452
14512
  content = "",
14453
14513
  onChange,
14454
14514
  onHtmlChange,
@@ -14535,6 +14595,7 @@ var UEditor = React15.forwardRef(({
14535
14595
  const extensions = useMemo2(
14536
14596
  () => [
14537
14597
  ...buildUEditorExtensions({
14598
+ getPortalContainer,
14538
14599
  placeholder: effectivePlaceholder,
14539
14600
  translate: t,
14540
14601
  maxCharacters,
@@ -14549,7 +14610,7 @@ var UEditor = React15.forwardRef(({
14549
14610
  }),
14550
14611
  ...extraExtensions ?? []
14551
14612
  ],
14552
- [effectivePlaceholder, t, maxCharacters, uploadImage, resolvedUploadFile, imageInsertMode, maxImageFileSize, allowedImageMimeTypes, fallbackToDataUrl, editable, fetchMetadata, extraExtensions]
14613
+ [getPortalContainer, effectivePlaceholder, t, maxCharacters, uploadImage, resolvedUploadFile, imageInsertMode, maxImageFileSize, allowedImageMimeTypes, fallbackToDataUrl, editable, fetchMetadata, extraExtensions]
14553
14614
  );
14554
14615
  const syncFormulaRangeHighlight = React15.useCallback((pickState) => {
14555
14616
  const container = formulaRangeSurfaceRef.current;
@@ -14564,7 +14625,8 @@ var UEditor = React15.forwardRef(({
14564
14625
  editorProps: {
14565
14626
  handleDOMEvents: {
14566
14627
  mousedown: (view, event) => {
14567
- if (!(event instanceof MouseEvent)) return false;
14628
+ const MouseEventCtor = view.dom.ownerDocument.defaultView?.MouseEvent;
14629
+ if (!MouseEventCtor || !(event instanceof MouseEventCtor)) return false;
14568
14630
  const pickState = beginFormulaRangePick(view, event);
14569
14631
  if (!pickState) return false;
14570
14632
  formulaRangePickRef.current = pickState;
@@ -14572,7 +14634,8 @@ var UEditor = React15.forwardRef(({
14572
14634
  return true;
14573
14635
  },
14574
14636
  mousemove: (view, event) => {
14575
- if (!(event instanceof MouseEvent)) return false;
14637
+ const MouseEventCtor = view.dom.ownerDocument.defaultView?.MouseEvent;
14638
+ if (!MouseEventCtor || !(event instanceof MouseEventCtor)) return false;
14576
14639
  const pickState = formulaRangePickRef.current;
14577
14640
  if (!pickState) return false;
14578
14641
  if (event.buttons === 0) {
@@ -14586,7 +14649,8 @@ var UEditor = React15.forwardRef(({
14586
14649
  return true;
14587
14650
  },
14588
14651
  mouseup: (_view, event) => {
14589
- if (!(event instanceof MouseEvent)) return false;
14652
+ const MouseEventCtor = _view.dom.ownerDocument.defaultView?.MouseEvent;
14653
+ if (!MouseEventCtor || !(event instanceof MouseEventCtor)) return false;
14590
14654
  if (!formulaRangePickRef.current) return false;
14591
14655
  formulaRangePickRef.current = null;
14592
14656
  syncFormulaRangeHighlight(null);
@@ -14595,7 +14659,8 @@ var UEditor = React15.forwardRef(({
14595
14659
  return true;
14596
14660
  },
14597
14661
  keydown: (_view, event) => {
14598
- if (!(event instanceof KeyboardEvent)) return false;
14662
+ const KeyboardEventCtor = _view.dom.ownerDocument.defaultView?.KeyboardEvent;
14663
+ if (!KeyboardEventCtor || !(event instanceof KeyboardEventCtor)) return false;
14599
14664
  const formulaContext = getFormulaEditingTableContext(_view);
14600
14665
  if (formulaContext && event.key === "Enter") {
14601
14666
  event.preventDefault();
@@ -14625,7 +14690,8 @@ var UEditor = React15.forwardRef(({
14625
14690
  return false;
14626
14691
  },
14627
14692
  click: (view, event) => {
14628
- if (!(event instanceof MouseEvent)) return false;
14693
+ const editorWindow = view.dom.ownerDocument.defaultView;
14694
+ if (!editorWindow || !(event instanceof editorWindow.MouseEvent)) return false;
14629
14695
  if (event.button !== 0) return false;
14630
14696
  const target = resolveEventElement(event.target);
14631
14697
  const anchor = target?.closest?.("a[href]");
@@ -14635,7 +14701,7 @@ var UEditor = React15.forwardRef(({
14635
14701
  if (!view.state.selection.empty) return false;
14636
14702
  event.preventDefault();
14637
14703
  event.stopPropagation();
14638
- window.open(href, "_blank", "noopener,noreferrer");
14704
+ editorWindow.open(href, "_blank", "noopener,noreferrer");
14639
14705
  return true;
14640
14706
  }
14641
14707
  },
@@ -14662,7 +14728,8 @@ var UEditor = React15.forwardRef(({
14662
14728
  },
14663
14729
  onBlur: ({ editor: editor2, event }) => {
14664
14730
  const nextTarget = event.relatedTarget;
14665
- if (nextTarget instanceof Element && nextTarget.closest("[data-ueditor-formula-bar]")) return;
14731
+ const editorWindow = editor2.view.dom.ownerDocument.defaultView;
14732
+ if (editorWindow && nextTarget instanceof editorWindow.Element && nextTarget.closest("[data-ueditor-formula-bar]")) return;
14666
14733
  const shouldRecalculate = pendingFormulaTextRecalculateRef.current;
14667
14734
  pendingFormulaTextRecalculateRef.current = false;
14668
14735
  if (shouldRecalculate) scheduleFormulaRecalculate(editor2, { force: true });
@@ -14737,16 +14804,16 @@ var UEditor = React15.forwardRef(({
14737
14804
  }
14738
14805
  }, [content, editor]);
14739
14806
  if (!editor) {
14740
- return /* @__PURE__ */ jsx20(
14807
+ return /* @__PURE__ */ jsx20(UEditorPortalProvider, { getPortalContainer, children: /* @__PURE__ */ jsx20(
14741
14808
  "div",
14742
14809
  {
14743
14810
  className: cn("w-full border bg-background flex items-center justify-center text-muted-foreground", className),
14744
14811
  style: { minHeight },
14745
14812
  children: t("loading")
14746
14813
  }
14747
- );
14814
+ ) });
14748
14815
  }
14749
- return /* @__PURE__ */ jsxs17(
14816
+ return /* @__PURE__ */ jsx20(UEditorPortalProvider, { getPortalContainer, children: /* @__PURE__ */ jsxs17(
14750
14817
  "div",
14751
14818
  {
14752
14819
  className: cn(
@@ -14894,7 +14961,7 @@ var UEditor = React15.forwardRef(({
14894
14961
  showFooter && showCharacterCount && /* @__PURE__ */ jsx20(CharacterCountDisplay, { editor, maxCharacters })
14895
14962
  ]
14896
14963
  }
14897
- );
14964
+ ) });
14898
14965
  });
14899
14966
  UEditor.displayName = "UEditor";
14900
14967
  var UEditor_default = UEditor;
@@ -14906,4 +14973,4 @@ export {
14906
14973
  prepareUEditorContentForSave,
14907
14974
  UEditor_default
14908
14975
  };
14909
- //# sourceMappingURL=chunk-PDYEK7HL.js.map
14976
+ //# sourceMappingURL=chunk-NWVDNVLR.js.map