@underverse-ui/underverse 2.0.11 → 2.0.13

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-KKASHK7A.js";
4
+ } from "./chunk-VNSCI3OK.js";
5
5
  import {
6
6
  COLUMN_RESIZE_LINE_THICKNESS,
7
7
  CellBgColorIcon,
@@ -41,26 +41,28 @@ import {
41
41
  getRelativeCellMetrics,
42
42
  getRelativeSelectedCellsMetrics,
43
43
  getSelectionTableCell,
44
- isColumnResizeHotspot,
45
44
  isPointOverRenderedText,
46
45
  isRowResizeHotspot,
46
+ isRowResizingGlobal,
47
47
  isSafeUEditorUrl,
48
48
  mergeTableCellsPreservingColumnWidths,
49
49
  normalizeStyleValue,
50
50
  resetImageSize,
51
+ resolveColumnResizeTarget,
51
52
  resolveEventElement,
53
+ resolveRowResizeTarget,
52
54
  runTableCommandAtCellPos,
53
55
  sanitizeUEditorUrl,
54
56
  useEditorColors,
55
57
  useSharedEditorUiRenderState
56
- } from "./chunk-VDIAFUIE.js";
58
+ } from "./chunk-MMMCBJ2L.js";
57
59
  import {
58
60
  Tooltip,
59
61
  cn,
60
62
  formControlGroupOutlineClass,
61
63
  formControlOutlineClass,
62
64
  useSmartTranslations
63
- } from "./chunk-CKG2QLQL.js";
65
+ } from "./chunk-PYC5EY5W.js";
64
66
 
65
67
  // src/components/UEditor/prepare-content-for-save.ts
66
68
  var MIME_EXTENSION_MAP = {
@@ -510,7 +512,7 @@ import { NodeViewWrapper, NodeViewContent } from "@tiptap/react";
510
512
  import React from "react";
511
513
  import { jsx } from "react/jsx-runtime";
512
514
  var LazyBaseEmojiPicker = React.lazy(async () => {
513
- const { EmojiPicker: EmojiPicker2 } = await import("./EmojiPicker-RPB24XXJ.js");
515
+ const { EmojiPicker: EmojiPicker2 } = await import("./EmojiPicker-FFNIUMI3.js");
514
516
  return { default: EmojiPicker2 };
515
517
  });
516
518
  var EmojiPicker = ({ onSelect }) => {
@@ -3315,7 +3317,7 @@ var indent_default = Indent;
3315
3317
  // src/components/UEditor/table-align.ts
3316
3318
  import { mergeAttributes as mergeAttributes7 } from "@tiptap/core";
3317
3319
  import { Table as Table2 } from "@tiptap/extension-table";
3318
- import { Plugin as Plugin4 } from "@tiptap/pm/state";
3320
+ import { Plugin as Plugin4, PluginKey as PluginKey5 } from "@tiptap/pm/state";
3319
3321
  import { tableEditing } from "@tiptap/pm/tables";
3320
3322
 
3321
3323
  // src/components/UEditor/table-column-resize.ts
@@ -3455,6 +3457,15 @@ function edgeCell(view, event, side, handleWidth) {
3455
3457
  const index = map.map.indexOf($cell.pos - start);
3456
3458
  return index % map.width === 0 ? -1 : start + map.map[index - 1];
3457
3459
  }
3460
+ var handleHoverTimer = null;
3461
+ var pendingHandleCell = -1;
3462
+ function clearHandleHoverTimer() {
3463
+ if (handleHoverTimer !== null) {
3464
+ window.clearTimeout(handleHoverTimer);
3465
+ handleHoverTimer = null;
3466
+ }
3467
+ pendingHandleCell = -1;
3468
+ }
3458
3469
  function updateHandle(view, value) {
3459
3470
  view.dispatch(view.state.tr.setMeta(columnResizingPluginKey, { setHandle: value }));
3460
3471
  }
@@ -3469,19 +3480,43 @@ function handleMouseMove(view, event, handleWidth, lastColumnResizable) {
3469
3480
  if (event.clientX - left <= handleWidth) cell = edgeCell(view, event, "left", handleWidth);
3470
3481
  else if (right - event.clientX <= handleWidth) cell = edgeCell(view, event, "right", handleWidth);
3471
3482
  }
3472
- if (cell === pluginState.activeHandle) return;
3473
- if (!lastColumnResizable && cell !== -1) {
3483
+ if (cell === pluginState.activeHandle) {
3484
+ clearHandleHoverTimer();
3485
+ return;
3486
+ }
3487
+ if (cell === -1) {
3488
+ clearHandleHoverTimer();
3489
+ if (pluginState.activeHandle !== -1) {
3490
+ updateHandle(view, -1);
3491
+ }
3492
+ return;
3493
+ }
3494
+ if (!lastColumnResizable) {
3474
3495
  const $cell = view.state.doc.resolve(cell);
3475
3496
  const table = $cell.node(-1);
3476
3497
  const map = TableMap.get(table);
3477
3498
  const tableStart = $cell.start(-1);
3478
3499
  const nodeAfter = $cell.nodeAfter;
3479
3500
  if (!nodeAfter) return;
3480
- if (map.colCount($cell.pos - tableStart) + nodeAfter.attrs.colspan - 1 === map.width - 1) return;
3501
+ if (map.colCount($cell.pos - tableStart) + nodeAfter.attrs.colspan - 1 === map.width - 1) {
3502
+ clearHandleHoverTimer();
3503
+ if (pluginState.activeHandle !== -1) {
3504
+ updateHandle(view, -1);
3505
+ }
3506
+ return;
3507
+ }
3481
3508
  }
3482
- updateHandle(view, cell);
3509
+ if (pendingHandleCell === cell) return;
3510
+ clearHandleHoverTimer();
3511
+ pendingHandleCell = cell;
3512
+ handleHoverTimer = window.setTimeout(() => {
3513
+ handleHoverTimer = null;
3514
+ pendingHandleCell = -1;
3515
+ updateHandle(view, cell);
3516
+ }, 100);
3483
3517
  }
3484
3518
  function handleMouseLeave(view) {
3519
+ clearHandleHoverTimer();
3485
3520
  if (!view.editable) return;
3486
3521
  const pluginState = columnResizingPluginKey.getState(view.state);
3487
3522
  if (pluginState && pluginState.activeHandle > -1 && !pluginState.dragging) {
@@ -3530,7 +3565,7 @@ function getColumnResizeGhost(view) {
3530
3565
  ghost.style.pointerEvents = "none";
3531
3566
  ghost.style.width = "2px";
3532
3567
  ghost.style.backgroundColor = "var(--primary, #2563eb)";
3533
- ghost.style.opacity = "1";
3568
+ ghost.style.opacity = "0.5";
3534
3569
  ghost.style.borderRadius = "9999px";
3535
3570
  ghost.style.boxShadow = "0 0 0 1px color-mix(in oklch, var(--background, #fff) 80%, transparent)";
3536
3571
  ghost.style.transform = "translateX(-1px)";
@@ -3559,6 +3594,7 @@ function showColumnResizeGhost(view, cell, dragging, width) {
3559
3594
  ghost.style.height = `${rect.height}px`;
3560
3595
  }
3561
3596
  function handleMouseDown(view, event, cellMinWidth) {
3597
+ clearHandleHoverTimer();
3562
3598
  if (!view.editable) return false;
3563
3599
  const win = view.dom.ownerDocument.defaultView ?? window;
3564
3600
  const pluginState = columnResizingPluginKey.getState(view.state);
@@ -3805,6 +3841,38 @@ var UEditorTable = Table2.extend({
3805
3841
  lastColumnResizable: this.options.lastColumnResizable
3806
3842
  })
3807
3843
  ] : [],
3844
+ new Plugin4({
3845
+ key: new PluginKey5("tableRowResizeInterceptor"),
3846
+ props: {
3847
+ handleDOMEvents: {
3848
+ mousedown(view, event) {
3849
+ if (event.button !== 0) return false;
3850
+ const target = resolveEventElement(event.target);
3851
+ const cell = target?.closest("th,td");
3852
+ if (cell instanceof HTMLElement && isRowResizeHotspot(cell, event.clientX, event.clientY)) {
3853
+ isRowResizingGlobal.active = true;
3854
+ return true;
3855
+ }
3856
+ return false;
3857
+ },
3858
+ mousemove(_view, event) {
3859
+ if (isRowResizingGlobal.active) {
3860
+ if (event.buttons === 0) {
3861
+ isRowResizingGlobal.active = false;
3862
+ return false;
3863
+ }
3864
+ event.preventDefault();
3865
+ return true;
3866
+ }
3867
+ return false;
3868
+ },
3869
+ mouseup() {
3870
+ isRowResizingGlobal.active = false;
3871
+ return false;
3872
+ }
3873
+ }
3874
+ }
3875
+ }),
3808
3876
  tableEditing({
3809
3877
  allowTableNodeSelection: this.options.allowTableNodeSelection
3810
3878
  }),
@@ -3944,7 +4012,7 @@ var CodeBlockView = ({
3944
4012
 
3945
4013
  // src/components/UEditor/optimized-lowlight.ts
3946
4014
  import { findChildren } from "@tiptap/core";
3947
- import { Plugin as Plugin5, PluginKey as PluginKey5 } from "@tiptap/pm/state";
4015
+ import { Plugin as Plugin5, PluginKey as PluginKey6 } from "@tiptap/pm/state";
3948
4016
  import { Decoration as Decoration3, DecorationSet as DecorationSet3 } from "@tiptap/pm/view";
3949
4017
  function parseHighlightNodes(nodes, inheritedClasses = []) {
3950
4018
  return nodes.flatMap((value) => {
@@ -4066,7 +4134,7 @@ function createOptimizedLowlightPlugin({
4066
4134
  lowlight,
4067
4135
  nodeName
4068
4136
  }) {
4069
- const pluginKey = new PluginKey5("ueditorLowlight");
4137
+ const pluginKey = new PluginKey6("ueditorLowlight");
4070
4138
  const createDecorations = (doc) => buildLowlightDecorations({
4071
4139
  defaultLanguage,
4072
4140
  doc,
@@ -5648,8 +5716,11 @@ function buildUEditorExtensions({
5648
5716
  placeholder,
5649
5717
  emptyEditorClass: "is-editor-empty",
5650
5718
  emptyNodeClass: "is-empty",
5651
- shouldShow: ({ node, hasTable }) => {
5719
+ shouldShow: ({ editor, node, hasTable, isEmptyDoc }) => {
5652
5720
  const nodeName = node.type.name;
5721
+ if (!isEmptyDoc || editor.state.doc.childCount !== 1) {
5722
+ return false;
5723
+ }
5653
5724
  if (nodeName === "table" || nodeName === "tableCell" || nodeName === "tableHeader") {
5654
5725
  return false;
5655
5726
  }
@@ -6968,7 +7039,11 @@ var CustomBubbleMenu = ({
6968
7039
  setIsVisible(false);
6969
7040
  return;
6970
7041
  }
6971
- if (!keepOpenRef.current && (context2 === "none" || !view.hasFocus())) {
7042
+ const isInputFocused = () => {
7043
+ const active = document.activeElement;
7044
+ return Boolean(active && (menuRef.current?.contains(active) || active.closest?.("[data-ueditor-keep-open]")));
7045
+ };
7046
+ if (!keepOpenRef.current && !isInputFocused() && (context2 === "none" || !view.hasFocus())) {
6972
7047
  clearShowTimeout();
6973
7048
  setIsVisible(false);
6974
7049
  return;
@@ -7009,7 +7084,8 @@ var CustomBubbleMenu = ({
7009
7084
  }, SHOW_DELAY_MS);
7010
7085
  };
7011
7086
  const handleBlur = () => {
7012
- if (!keepOpenRef.current) {
7087
+ const isInputFocused = Boolean(document.activeElement && (menuRef.current?.contains(document.activeElement) || document.activeElement.closest?.("[data-ueditor-keep-open]")));
7088
+ if (!keepOpenRef.current && !isInputFocused) {
7013
7089
  clearShowTimeout();
7014
7090
  setIsVisible(false);
7015
7091
  }
@@ -7103,6 +7179,9 @@ var CustomBubbleMenu = ({
7103
7179
  } else if (target?.closest?.("[data-ueditor-keep-open]")) {
7104
7180
  setKeepOpen(true);
7105
7181
  }
7182
+ if (target && target.closest("input, textarea, select")) {
7183
+ return;
7184
+ }
7106
7185
  e.preventDefault();
7107
7186
  },
7108
7187
  children: context === "link" && !keepOpen && !linkInputOpen ? /* @__PURE__ */ jsx12(
@@ -10261,7 +10340,7 @@ function createKey(name) {
10261
10340
  keys[name] = 0;
10262
10341
  return name + "$";
10263
10342
  }
10264
- var PluginKey6 = class {
10343
+ var PluginKey7 = class {
10265
10344
  /**
10266
10345
  Create a plugin key.
10267
10346
  */
@@ -10693,7 +10772,7 @@ function tableNodeTypes2(schema) {
10693
10772
  }
10694
10773
  return result;
10695
10774
  }
10696
- var tableEditingKey = new PluginKey6("selectingCells");
10775
+ var tableEditingKey = new PluginKey7("selectingCells");
10697
10776
  function cellAround2($pos) {
10698
10777
  for (let d = $pos.depth - 1; d > 0; d--) if ($pos.node(d).type.spec.tableRole == "row") return $pos.node(0).resolve($pos.before(d + 1));
10699
10778
  return null;
@@ -10924,7 +11003,7 @@ var CellBookmark = class CellBookmark2 {
10924
11003
  else return Selection.near($headCell, 1);
10925
11004
  }
10926
11005
  };
10927
- var fixTablesKey = new PluginKey6("fix-tables");
11006
+ var fixTablesKey = new PluginKey7("fix-tables");
10928
11007
  function convertTableNodeToArrayOfRows(tableNode) {
10929
11008
  const map = TableMap3.get(tableNode);
10930
11009
  const rows = [];
@@ -11402,7 +11481,7 @@ function atEndOfCell(view, axis, dir) {
11402
11481
  }
11403
11482
  return null;
11404
11483
  }
11405
- var columnResizingPluginKey2 = new PluginKey6("tableColumnResizing");
11484
+ var columnResizingPluginKey2 = new PluginKey7("tableColumnResizing");
11406
11485
 
11407
11486
  // src/components/UEditor/table-controls.tsx
11408
11487
  import {
@@ -11853,6 +11932,8 @@ function TableDragPreview({
11853
11932
  import { Fragment as Fragment4, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
11854
11933
  var ADD_COLUMN_RAIL_GAP = 4;
11855
11934
  var ADD_ROW_RAIL_GAP = 4;
11935
+ var BUTTON_LONG_SIZE = 36;
11936
+ var BUTTON_SHORT_SIZE = 14;
11856
11937
  function TableAddRails({
11857
11938
  addColumnVisible,
11858
11939
  addRowVisible,
@@ -11865,10 +11946,10 @@ function TableAddRails({
11865
11946
  quickAddRowLabel
11866
11947
  }) {
11867
11948
  const visibleBounds = getVisibleTableBounds(layout);
11868
- const columnRailTop = visibleBounds.top;
11949
+ const columnRailTop = visibleBounds.top + Math.max(0, (visibleBounds.height - BUTTON_LONG_SIZE) / 2);
11869
11950
  const columnRailLeft = visibleBounds.right + ADD_COLUMN_RAIL_GAP;
11870
11951
  const rowRailTop = layout.wrapperTop + layout.wrapperHeight + ADD_ROW_RAIL_GAP;
11871
- const rowRailLeft = visibleBounds.left;
11952
+ const rowRailLeft = visibleBounds.left + Math.max(0, (visibleBounds.width - BUTTON_LONG_SIZE) / 2);
11872
11953
  const showColumnRail = controlsVisible || addColumnVisible;
11873
11954
  const showRowRail = controlsVisible || addRowVisible;
11874
11955
  return /* @__PURE__ */ jsxs13(Fragment4, { children: [
@@ -11893,15 +11974,15 @@ function TableAddRails({
11893
11974
  className: cn(
11894
11975
  "absolute z-30 inline-flex items-center justify-center rounded-md",
11895
11976
  "border border-border/70 bg-muted/40 text-muted-foreground shadow-sm backdrop-blur",
11896
- "transition-[opacity,transform,colors] duration-150 hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:cursor-not-allowed"
11977
+ "transition-[opacity,transform,colors] duration-200 delay-100 ease-out cursor-pointer hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:cursor-not-allowed"
11897
11978
  ),
11898
11979
  style: {
11899
- top: showColumnRail ? columnRailTop : columnRailTop + Math.max(0, visibleBounds.height / 2 - 24),
11980
+ top: columnRailTop,
11900
11981
  left: columnRailLeft,
11901
- width: showColumnRail ? 18 : 12,
11902
- height: showColumnRail ? visibleBounds.height : 48,
11982
+ width: BUTTON_SHORT_SIZE,
11983
+ height: BUTTON_LONG_SIZE,
11903
11984
  opacity: showColumnRail ? 1 : 0,
11904
- transform: showColumnRail ? "scale(1)" : "scale(0.92)",
11985
+ transform: showColumnRail ? "scale(1)" : "scale(0.85)",
11905
11986
  pointerEvents: showColumnRail ? "auto" : "none"
11906
11987
  },
11907
11988
  children: /* @__PURE__ */ jsx14("span", { className: "text-sm font-medium leading-none", children: "+" })
@@ -11930,15 +12011,15 @@ function TableAddRails({
11930
12011
  className: cn(
11931
12012
  "absolute z-30 inline-flex items-center justify-center rounded-md",
11932
12013
  "border border-border/70 bg-muted/40 text-muted-foreground shadow-sm backdrop-blur",
11933
- "transition-[opacity,transform,colors] duration-150 hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:cursor-not-allowed"
12014
+ "transition-[opacity,transform,colors] duration-200 delay-100 ease-out cursor-pointer hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:cursor-not-allowed"
11934
12015
  ),
11935
12016
  style: {
11936
12017
  top: rowRailTop,
11937
- left: showRowRail ? rowRailLeft : rowRailLeft + Math.max(0, visibleBounds.width / 2 - 24),
11938
- width: showRowRail ? visibleBounds.width : 48,
11939
- height: showRowRail ? 16 : 12,
12018
+ left: rowRailLeft,
12019
+ width: BUTTON_LONG_SIZE,
12020
+ height: BUTTON_SHORT_SIZE,
11940
12021
  opacity: showRowRail ? 1 : 0,
11941
- transform: showRowRail ? "scale(1)" : "scale(0.92)",
12022
+ transform: showRowRail ? "scale(1)" : "scale(0.85)",
11942
12023
  pointerEvents: showRowRail ? "auto" : "none"
11943
12024
  },
11944
12025
  children: /* @__PURE__ */ jsx14("span", { className: "text-sm font-medium leading-none", children: "+" })
@@ -12069,7 +12150,7 @@ function TableRowHandles({
12069
12150
  onStartDrag(rowHandle);
12070
12151
  },
12071
12152
  className: cn(
12072
- "inline-flex h-6 w-6 items-center justify-center rounded-full transition-[opacity,transform,colors,border,background-color] duration-150",
12153
+ "inline-flex h-6 w-6 items-center justify-center rounded-full transition-[opacity,transform,colors,border,background-color] duration-200 delay-100 ease-out",
12073
12154
  visible ? "border border-border/70 bg-background/95 text-muted-foreground shadow-sm backdrop-blur hover:bg-accent hover:text-foreground cursor-grab active:cursor-grabbing" : "border-transparent bg-transparent cursor-pointer"
12074
12155
  ),
12075
12156
  style: {
@@ -12144,7 +12225,7 @@ function TableColumnHandles({
12144
12225
  onStartDrag(columnHandle);
12145
12226
  },
12146
12227
  className: cn(
12147
- "inline-flex h-6 w-6 items-center justify-center rounded-full transition-[opacity,transform,colors,border,background-color] duration-150",
12228
+ "inline-flex h-6 w-6 items-center justify-center rounded-full transition-[opacity,transform,colors,border,background-color] duration-200 delay-100 ease-out",
12148
12229
  visible ? "border border-border/70 bg-background/95 text-muted-foreground shadow-sm backdrop-blur hover:bg-accent hover:text-foreground cursor-grab active:cursor-grabbing" : "border-transparent bg-transparent cursor-pointer"
12149
12230
  ),
12150
12231
  style: {
@@ -12531,7 +12612,7 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12531
12612
  const updateHoverState = React10.useCallback((event) => {
12532
12613
  const activeLayout = layoutRef.current;
12533
12614
  const surface = containerRef.current;
12534
- if (!activeLayout || !surface || dragStateRef.current) {
12615
+ if (!activeLayout || !surface || dragStateRef.current || event.buttons !== 0) {
12535
12616
  setHoverState(DEFAULT_TABLE_HOVER_STATE);
12536
12617
  return;
12537
12618
  }
@@ -12665,7 +12746,7 @@ function TableControls({ editor, containerRef, showCellInspector = true }) {
12665
12746
  return result;
12666
12747
  }, [editor, scheduleSyncFromSelection]);
12667
12748
  const canExpandTable = Boolean(layout);
12668
- const controlsVisible = dragPreview !== null;
12749
+ const controlsVisible = false;
12669
12750
  const tableMenuOpen = openMenuKey === "table";
12670
12751
  const startTableResize = React10.useCallback((event) => {
12671
12752
  if (event.button !== 0 || dragStateRef.current) return;
@@ -13186,6 +13267,9 @@ function useTableRowResize({
13186
13267
  pendingHeight: startHeight
13187
13268
  };
13188
13269
  showRowGuide(table, row, cell, startHeight);
13270
+ isRowResizingGlobal.active = true;
13271
+ window.getSelection()?.removeAllRanges();
13272
+ document.body.style.userSelect = "none";
13189
13273
  document.body.style.cursor = "row-resize";
13190
13274
  event.preventDefault();
13191
13275
  event.stopPropagation();
@@ -13227,6 +13311,8 @@ function useTableRowResize({
13227
13311
  editor.view.dispatch(tr);
13228
13312
  }
13229
13313
  stateRef.current = null;
13314
+ isRowResizingGlobal.active = false;
13315
+ document.body.style.userSelect = "";
13230
13316
  document.body.style.cursor = "";
13231
13317
  clearHoveredTableCell();
13232
13318
  clearAllTableResizeHover();
@@ -13235,6 +13321,8 @@ function useTableRowResize({
13235
13321
  const cancelResize = React11.useCallback(() => {
13236
13322
  if (!stateRef.current) return;
13237
13323
  stateRef.current = null;
13324
+ isRowResizingGlobal.active = false;
13325
+ document.body.style.userSelect = "";
13238
13326
  document.body.style.cursor = "";
13239
13327
  clearHoveredTableCell();
13240
13328
  clearAllTableResizeHover();
@@ -13242,6 +13330,8 @@ function useTableRowResize({
13242
13330
  }, [clearAllTableResizeHover, clearHoveredTableCell, scheduleTableLayoutSync]);
13243
13331
  const cleanup = React11.useCallback(() => {
13244
13332
  stateRef.current = null;
13333
+ isRowResizingGlobal.active = false;
13334
+ document.body.style.userSelect = "";
13245
13335
  document.body.style.cursor = "";
13246
13336
  }, []);
13247
13337
  return {
@@ -13290,11 +13380,21 @@ function useUEditorTableInteractions(editor, editable = true) {
13290
13380
  guide.style.opacity = "0";
13291
13381
  }
13292
13382
  }, [getProseMirrorElement]);
13383
+ const hotspotTimerRef = useRef6(null);
13384
+ const activeHotspotKeyRef = useRef6(null);
13385
+ const clearHotspotTimer = React12.useCallback(() => {
13386
+ if (hotspotTimerRef.current !== null) {
13387
+ window.clearTimeout(hotspotTimerRef.current);
13388
+ hotspotTimerRef.current = null;
13389
+ }
13390
+ }, []);
13293
13391
  const clearAllTableResizeHover = React12.useCallback(() => {
13392
+ clearHotspotTimer();
13393
+ activeHotspotKeyRef.current = null;
13294
13394
  setEditorResizeCursor("");
13295
13395
  hideColumnGuide();
13296
13396
  hideRowGuide();
13297
- }, [hideColumnGuide, hideRowGuide, setEditorResizeCursor]);
13397
+ }, [clearHotspotTimer, hideColumnGuide, hideRowGuide, setEditorResizeCursor]);
13298
13398
  const updateActiveCellHighlight = React12.useCallback((cell) => {
13299
13399
  const surface = editorContentRef.current;
13300
13400
  const highlight = activeTableCellHighlightRef.current;
@@ -13433,6 +13533,10 @@ function useUEditorTableInteractions(editor, editable = true) {
13433
13533
  if (syncActiveRowResizeGuide()) {
13434
13534
  return;
13435
13535
  }
13536
+ if (event.buttons !== 0) {
13537
+ clearAllTableResizeHover();
13538
+ return;
13539
+ }
13436
13540
  const target = resolveEventElement(event.target);
13437
13541
  if (!(target instanceof Element)) {
13438
13542
  clearAllTableResizeHover();
@@ -13452,18 +13556,46 @@ function useUEditorTableInteractions(editor, editable = true) {
13452
13556
  clearAllTableResizeHover();
13453
13557
  return;
13454
13558
  }
13455
- const nearBottom = isRowResizeHotspot(cell, event.clientX, event.clientY);
13456
- const nearRight = isColumnResizeHotspot(cell, event.clientX, event.clientY);
13457
- if (nearBottom && cell instanceof HTMLTableCellElement) {
13458
- hideColumnGuide();
13459
- showRowGuide(table, row, cell);
13559
+ const rowTarget = resolveRowResizeTarget(cell, event.clientX, event.clientY);
13560
+ const colTarget = resolveColumnResizeTarget(cell, event.clientX, event.clientY);
13561
+ if (rowTarget) {
13562
+ const hotspotKey = `row:${rowTarget.row.rowIndex}-${rowTarget.cell.cellIndex}`;
13563
+ if (activeHotspotKeyRef.current === hotspotKey) {
13564
+ hideColumnGuide();
13565
+ showRowGuide(table, rowTarget.row, rowTarget.cell);
13566
+ return;
13567
+ }
13568
+ if (activeHotspotKeyRef.current !== hotspotKey) {
13569
+ clearHotspotTimer();
13570
+ activeHotspotKeyRef.current = hotspotKey;
13571
+ hotspotTimerRef.current = window.setTimeout(() => {
13572
+ hotspotTimerRef.current = null;
13573
+ hideColumnGuide();
13574
+ showRowGuide(table, rowTarget.row, rowTarget.cell);
13575
+ }, 100);
13576
+ }
13460
13577
  return;
13461
13578
  }
13462
- if (nearRight && cell instanceof HTMLTableCellElement) {
13463
- hideRowGuide();
13464
- showColumnGuide(table, row, cell);
13579
+ if (colTarget) {
13580
+ const hotspotKey = `col:${colTarget.row.rowIndex}-${colTarget.cell.cellIndex}`;
13581
+ if (activeHotspotKeyRef.current === hotspotKey) {
13582
+ hideRowGuide();
13583
+ showColumnGuide(table, colTarget.row, colTarget.cell);
13584
+ return;
13585
+ }
13586
+ if (activeHotspotKeyRef.current !== hotspotKey) {
13587
+ clearHotspotTimer();
13588
+ activeHotspotKeyRef.current = hotspotKey;
13589
+ hotspotTimerRef.current = window.setTimeout(() => {
13590
+ hotspotTimerRef.current = null;
13591
+ hideRowGuide();
13592
+ showColumnGuide(table, colTarget.row, colTarget.cell);
13593
+ }, 100);
13594
+ }
13465
13595
  return;
13466
13596
  }
13597
+ clearHotspotTimer();
13598
+ activeHotspotKeyRef.current = null;
13467
13599
  clearAllTableResizeHover();
13468
13600
  };
13469
13601
  const handleEditorMouseLeave = () => {
@@ -13484,15 +13616,22 @@ function useUEditorTableInteractions(editor, editable = true) {
13484
13616
  clearActiveTableCell();
13485
13617
  return;
13486
13618
  }
13487
- setActiveTableCell(cell);
13488
- scheduleActiveCellSync(cell);
13489
13619
  const row = cell.closest("tr");
13490
13620
  const table = cell.closest("table");
13491
13621
  if (!(row instanceof HTMLTableRowElement) || !(table instanceof HTMLTableElement)) return;
13492
- if (beginResize(event, table, row, cell)) {
13493
- suppressActiveCellHighlightRef.current = true;
13494
- updateActiveCellHighlight(null);
13622
+ const rowTarget = resolveRowResizeTarget(cell, event.clientX, event.clientY);
13623
+ if (rowTarget) {
13624
+ event.preventDefault();
13625
+ event.stopPropagation();
13626
+ window.getSelection()?.removeAllRanges();
13627
+ if (beginResize(event, table, rowTarget.row, rowTarget.cell)) {
13628
+ suppressActiveCellHighlightRef.current = true;
13629
+ updateActiveCellHighlight(null);
13630
+ return;
13631
+ }
13495
13632
  }
13633
+ setActiveTableCell(cell);
13634
+ scheduleActiveCellSync(cell);
13496
13635
  };
13497
13636
  const handlePointerMove = (event) => {
13498
13637
  handleRowResizePointerMove(event);
@@ -13581,8 +13720,9 @@ function useUEditorTableInteractions(editor, editable = true) {
13581
13720
  clearActiveTableCell();
13582
13721
  clearHoveredTableCell();
13583
13722
  clearAllTableResizeHover();
13723
+ clearHotspotTimer();
13584
13724
  };
13585
- }, [beginResize, cancelResize, cleanupRowResize, clearActiveTableCell, clearAllTableResizeHover, clearHoveredTableCell, editable, editor, handleRowResizePointerMove, handleRowResizePointerUp, hideColumnGuide, hideRowGuide, isRowResizing, scheduleTableLayoutSync, setActiveTableCell, setHoveredTableCell, showColumnGuide, showRowGuide, syncActiveRowResizeGuide, syncActiveTableCellFromSelection, updateActiveCellHighlight]);
13725
+ }, [beginResize, cancelResize, cleanupRowResize, clearActiveTableCell, clearAllTableResizeHover, clearHotspotTimer, clearHoveredTableCell, editable, editor, handleRowResizePointerMove, handleRowResizePointerUp, hideColumnGuide, hideRowGuide, isRowResizing, scheduleTableLayoutSync, setActiveTableCell, setHoveredTableCell, showColumnGuide, showRowGuide, syncActiveRowResizeGuide, syncActiveTableCellFromSelection, updateActiveCellHighlight]);
13586
13726
  return {
13587
13727
  editorContentRef,
13588
13728
  tableColumnGuideRef,
@@ -14305,7 +14445,7 @@ function useUEditorOutput({
14305
14445
  // src/components/UEditor/UEditor.tsx
14306
14446
  import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
14307
14447
  var LazyMenuBar = React15.lazy(async () => {
14308
- const { MenuBar } = await import("./menu-bar-R5ZFI2ST.js");
14448
+ const { MenuBar } = await import("./menu-bar-SVX36W4S.js");
14309
14449
  return { default: MenuBar };
14310
14450
  });
14311
14451
  var UEditor = React15.forwardRef(({
@@ -14336,6 +14476,7 @@ var UEditor = React15.forwardRef(({
14336
14476
  variant = "default",
14337
14477
  rounded = true,
14338
14478
  fontFamilies,
14479
+ defaultFontFamily = "Inter",
14339
14480
  fontSizes,
14340
14481
  lineHeights,
14341
14482
  letterSpacings,
@@ -14344,6 +14485,7 @@ var UEditor = React15.forwardRef(({
14344
14485
  uploadFileForSave,
14345
14486
  extraExtensions,
14346
14487
  showMenuBar = false,
14488
+ showPreviewButton = true,
14347
14489
  onSave,
14348
14490
  onExport,
14349
14491
  onSourceCode,
@@ -14629,7 +14771,8 @@ var UEditor = React15.forwardRef(({
14629
14771
  onSave,
14630
14772
  onExport,
14631
14773
  onSourceCode,
14632
- onPreview
14774
+ onPreview,
14775
+ showPreviewButton
14633
14776
  }
14634
14777
  ) }),
14635
14778
  showToolbar && /* @__PURE__ */ jsx20(
@@ -14642,6 +14785,7 @@ var UEditor = React15.forwardRef(({
14642
14785
  maxImageFileSize,
14643
14786
  allowedImageMimeTypes,
14644
14787
  fontFamilies,
14788
+ defaultFontFamily,
14645
14789
  fontSizes,
14646
14790
  lineHeights,
14647
14791
  letterSpacings
@@ -14667,6 +14811,7 @@ var UEditor = React15.forwardRef(({
14667
14811
  },
14668
14812
  className: "relative flex-1 overflow-y-auto",
14669
14813
  style: {
14814
+ fontFamily: defaultFontFamily,
14670
14815
  minHeight: editable ? minHeight : void 0,
14671
14816
  maxHeight
14672
14817
  },
@@ -14676,7 +14821,7 @@ var UEditor = React15.forwardRef(({
14676
14821
  {
14677
14822
  ref: tableColumnGuideRef,
14678
14823
  "aria-hidden": "true",
14679
- className: "pointer-events-none absolute z-20 bg-primary opacity-0 transition-opacity duration-100"
14824
+ className: "pointer-events-none absolute z-20 bg-primary/50 opacity-0 transition-opacity duration-200 delay-100 ease-out"
14680
14825
  }
14681
14826
  ),
14682
14827
  /* @__PURE__ */ jsx20(
@@ -14684,7 +14829,7 @@ var UEditor = React15.forwardRef(({
14684
14829
  {
14685
14830
  ref: tableRowGuideRef,
14686
14831
  "aria-hidden": "true",
14687
- className: "pointer-events-none absolute z-20 bg-primary opacity-0 transition-opacity duration-100"
14832
+ className: "pointer-events-none absolute z-20 bg-primary/50 opacity-0 transition-opacity duration-200 delay-100 ease-out"
14688
14833
  }
14689
14834
  ),
14690
14835
  /* @__PURE__ */ jsx20(
@@ -14693,7 +14838,7 @@ var UEditor = React15.forwardRef(({
14693
14838
  ref: activeTableCellHighlightRef,
14694
14839
  "aria-hidden": "true",
14695
14840
  "data-ueditor-active-cell-highlight": "",
14696
- className: "pointer-events-none hidden absolute z-20 rounded-[2px] border-2 border-primary bg-primary/10"
14841
+ className: "pointer-events-none hidden absolute z-20 rounded-[2px] border border-primary/50 bg-primary/5"
14697
14842
  }
14698
14843
  ),
14699
14844
  /* @__PURE__ */ jsx20(
@@ -14755,4 +14900,4 @@ export {
14755
14900
  prepareUEditorContentForSave,
14756
14901
  UEditor_default
14757
14902
  };
14758
- //# sourceMappingURL=chunk-WNVGXH5Y.js.map
14903
+ //# sourceMappingURL=chunk-WDY3QWOW.js.map