@underverse-ui/underverse 1.0.158 → 1.0.160
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.
- package/api-reference.json +1 -1
- package/dist/index.cjs +535 -228
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +523 -208
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -3433,7 +3433,7 @@ var Tooltip = React10.forwardRef(({
|
|
|
3433
3433
|
setIsOpen(true);
|
|
3434
3434
|
}, delayOpen);
|
|
3435
3435
|
};
|
|
3436
|
-
const
|
|
3436
|
+
const handleMouseLeave2 = () => {
|
|
3437
3437
|
clearTimeout(timeoutRef.current);
|
|
3438
3438
|
timeoutRef.current = setTimeout(() => {
|
|
3439
3439
|
setIsOpen(false);
|
|
@@ -3558,7 +3558,7 @@ var Tooltip = React10.forwardRef(({
|
|
|
3558
3558
|
childProps.onMouseLeave,
|
|
3559
3559
|
(e) => {
|
|
3560
3560
|
triggerRef.current = e.currentTarget;
|
|
3561
|
-
|
|
3561
|
+
handleMouseLeave2();
|
|
3562
3562
|
}
|
|
3563
3563
|
),
|
|
3564
3564
|
onPointerDown: chainEventHandlers(
|
|
@@ -17917,18 +17917,18 @@ function OverlayControls({
|
|
|
17917
17917
|
setControlsVisible(false);
|
|
17918
17918
|
}, autoHideDelay);
|
|
17919
17919
|
};
|
|
17920
|
-
const
|
|
17921
|
-
const
|
|
17920
|
+
const handleMouseMove2 = () => resetTimer();
|
|
17921
|
+
const handleMouseLeave2 = () => {
|
|
17922
17922
|
if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
|
|
17923
17923
|
hideTimerRef.current = setTimeout(() => {
|
|
17924
17924
|
setControlsVisible(false);
|
|
17925
17925
|
}, autoHideDelay);
|
|
17926
17926
|
};
|
|
17927
17927
|
resetTimer();
|
|
17928
|
-
document.addEventListener("mousemove",
|
|
17928
|
+
document.addEventListener("mousemove", handleMouseMove2);
|
|
17929
17929
|
return () => {
|
|
17930
17930
|
if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
|
|
17931
|
-
document.removeEventListener("mousemove",
|
|
17931
|
+
document.removeEventListener("mousemove", handleMouseMove2);
|
|
17932
17932
|
};
|
|
17933
17933
|
}, [autoHide, autoHideDelay, showOnHover]);
|
|
17934
17934
|
const showFeedback = React44.useCallback((type, value2) => {
|
|
@@ -27064,7 +27064,8 @@ import { mergeAttributes as mergeAttributes4 } from "@tiptap/core";
|
|
|
27064
27064
|
import { NodeViewWrapper as NodeViewWrapper4, ReactNodeViewRenderer as ReactNodeViewRenderer4 } from "@tiptap/react";
|
|
27065
27065
|
|
|
27066
27066
|
// src/components/UEditor/table-dom-utils.ts
|
|
27067
|
-
var
|
|
27067
|
+
var DEFAULT_TABLE_ROW_HEIGHT = 25;
|
|
27068
|
+
var MIN_TABLE_ROW_HEIGHT = DEFAULT_TABLE_ROW_HEIGHT;
|
|
27068
27069
|
var COLUMN_RESIZE_LINE_THICKNESS = 2;
|
|
27069
27070
|
var ROW_RESIZE_LINE_THICKNESS = 2;
|
|
27070
27071
|
var UEDITOR_TABLE_LAYOUT_CHANGE_EVENT = "ueditor-table-layout-change";
|
|
@@ -27550,25 +27551,29 @@ function parseRowHeight(value) {
|
|
|
27550
27551
|
const match = String(value).match(/(\d+(?:\.\d+)?)/);
|
|
27551
27552
|
if (!match) return null;
|
|
27552
27553
|
const parsed = Number.parseFloat(match[1]);
|
|
27553
|
-
return
|
|
27554
|
+
return normalizeRowHeight(parsed);
|
|
27555
|
+
}
|
|
27556
|
+
function normalizeRowHeight(value) {
|
|
27557
|
+
return typeof value === "number" && Number.isFinite(value) && value > 0 ? Math.max(MIN_TABLE_ROW_HEIGHT, Math.round(value)) : null;
|
|
27554
27558
|
}
|
|
27555
27559
|
var UEditorTableRow = TableRow2.extend({
|
|
27556
27560
|
addAttributes() {
|
|
27557
27561
|
return {
|
|
27558
27562
|
...this.parent?.(),
|
|
27559
27563
|
rowHeight: {
|
|
27560
|
-
default:
|
|
27564
|
+
default: DEFAULT_TABLE_ROW_HEIGHT,
|
|
27561
27565
|
parseHTML: (element) => {
|
|
27562
27566
|
if (!(element instanceof HTMLElement)) return null;
|
|
27563
27567
|
return parseRowHeight(element.getAttribute("data-row-height")) ?? parseRowHeight(element.style.height);
|
|
27564
27568
|
},
|
|
27565
27569
|
renderHTML: (attributes) => {
|
|
27566
|
-
|
|
27570
|
+
const rowHeight = normalizeRowHeight(attributes.rowHeight);
|
|
27571
|
+
if (!rowHeight) {
|
|
27567
27572
|
return {};
|
|
27568
27573
|
}
|
|
27569
27574
|
return {
|
|
27570
|
-
"data-row-height": String(
|
|
27571
|
-
style: `height: ${
|
|
27575
|
+
"data-row-height": String(rowHeight),
|
|
27576
|
+
style: `height: ${rowHeight}px; min-height: ${rowHeight}px;`
|
|
27572
27577
|
};
|
|
27573
27578
|
}
|
|
27574
27579
|
}
|
|
@@ -27723,7 +27728,371 @@ var letter_spacing_default = LetterSpacing;
|
|
|
27723
27728
|
|
|
27724
27729
|
// src/components/UEditor/table-align.ts
|
|
27725
27730
|
import { Table as Table3 } from "@tiptap/extension-table";
|
|
27731
|
+
import { Plugin as Plugin5 } from "@tiptap/pm/state";
|
|
27732
|
+
import { tableEditing } from "@tiptap/pm/tables";
|
|
27733
|
+
|
|
27734
|
+
// src/components/UEditor/table-column-resize.ts
|
|
27726
27735
|
import { Plugin as Plugin4 } from "@tiptap/pm/state";
|
|
27736
|
+
import {
|
|
27737
|
+
Decoration as Decoration2,
|
|
27738
|
+
DecorationSet as DecorationSet2
|
|
27739
|
+
} from "@tiptap/pm/view";
|
|
27740
|
+
import {
|
|
27741
|
+
ResizeState,
|
|
27742
|
+
TableMap,
|
|
27743
|
+
cellAround,
|
|
27744
|
+
columnResizingPluginKey,
|
|
27745
|
+
tableNodeTypes
|
|
27746
|
+
} from "@tiptap/pm/tables";
|
|
27747
|
+
var DEFAULT_TABLE_COLUMN_WIDTH = 100;
|
|
27748
|
+
var MIN_RESIZED_TABLE_COLUMN_WIDTH = 25;
|
|
27749
|
+
function getDynamicColumnMinWidth(startWidth, fallbackMinWidth) {
|
|
27750
|
+
return Math.max(fallbackMinWidth, Math.round(startWidth / 3));
|
|
27751
|
+
}
|
|
27752
|
+
function setColumnStyle(column, width) {
|
|
27753
|
+
if (width == null) {
|
|
27754
|
+
column.style.width = "";
|
|
27755
|
+
column.style.minWidth = `${DEFAULT_TABLE_COLUMN_WIDTH}px`;
|
|
27756
|
+
return;
|
|
27757
|
+
}
|
|
27758
|
+
column.style.width = `${Math.max(width, MIN_RESIZED_TABLE_COLUMN_WIDTH)}px`;
|
|
27759
|
+
column.style.minWidth = "";
|
|
27760
|
+
}
|
|
27761
|
+
function isTableColumnElement(node) {
|
|
27762
|
+
return node instanceof HTMLElement && node.tagName.toLowerCase() === "col";
|
|
27763
|
+
}
|
|
27764
|
+
function updateDynamicColumns(node, colgroup, table, overrideCol, overrideValue) {
|
|
27765
|
+
let totalWidth = 0;
|
|
27766
|
+
let fixedWidth = true;
|
|
27767
|
+
let nextDOM = colgroup.firstChild;
|
|
27768
|
+
const row = node.firstChild;
|
|
27769
|
+
if (row) {
|
|
27770
|
+
for (let rowCellIndex = 0, col = 0; rowCellIndex < row.childCount; rowCellIndex += 1) {
|
|
27771
|
+
const { colspan, colwidth } = row.child(rowCellIndex).attrs;
|
|
27772
|
+
for (let spanIndex = 0; spanIndex < colspan; spanIndex += 1, col += 1) {
|
|
27773
|
+
const rawWidth = overrideCol === col ? overrideValue : colwidth?.[spanIndex];
|
|
27774
|
+
const width = rawWidth ? Math.max(rawWidth, MIN_RESIZED_TABLE_COLUMN_WIDTH) : null;
|
|
27775
|
+
totalWidth += width ?? DEFAULT_TABLE_COLUMN_WIDTH;
|
|
27776
|
+
if (!width) {
|
|
27777
|
+
fixedWidth = false;
|
|
27778
|
+
}
|
|
27779
|
+
const colElement = isTableColumnElement(nextDOM) ? nextDOM : colgroup.appendChild(document.createElement("col"));
|
|
27780
|
+
setColumnStyle(colElement, width);
|
|
27781
|
+
nextDOM = colElement.nextSibling;
|
|
27782
|
+
}
|
|
27783
|
+
}
|
|
27784
|
+
}
|
|
27785
|
+
while (nextDOM) {
|
|
27786
|
+
const after = nextDOM.nextSibling;
|
|
27787
|
+
nextDOM.parentNode?.removeChild(nextDOM);
|
|
27788
|
+
nextDOM = after;
|
|
27789
|
+
}
|
|
27790
|
+
const hasUserWidth = typeof node.attrs.style === "string" && /\bwidth\s*:/i.test(node.attrs.style);
|
|
27791
|
+
if (fixedWidth && !hasUserWidth) {
|
|
27792
|
+
table.style.width = `${totalWidth}px`;
|
|
27793
|
+
table.style.minWidth = "";
|
|
27794
|
+
} else {
|
|
27795
|
+
table.style.width = "";
|
|
27796
|
+
table.style.minWidth = `${totalWidth}px`;
|
|
27797
|
+
}
|
|
27798
|
+
}
|
|
27799
|
+
var UEditorTableView = class {
|
|
27800
|
+
constructor(node) {
|
|
27801
|
+
this.node = node;
|
|
27802
|
+
this.dom = document.createElement("div");
|
|
27803
|
+
this.dom.className = "tableWrapper";
|
|
27804
|
+
this.table = this.dom.appendChild(document.createElement("table"));
|
|
27805
|
+
if (node.attrs.style) {
|
|
27806
|
+
this.table.style.cssText = node.attrs.style;
|
|
27807
|
+
}
|
|
27808
|
+
this.colgroup = this.table.appendChild(document.createElement("colgroup"));
|
|
27809
|
+
updateDynamicColumns(node, this.colgroup, this.table);
|
|
27810
|
+
this.contentDOM = this.table.appendChild(document.createElement("tbody"));
|
|
27811
|
+
}
|
|
27812
|
+
update(node) {
|
|
27813
|
+
if (node.type !== this.node.type) return false;
|
|
27814
|
+
this.node = node;
|
|
27815
|
+
updateDynamicColumns(node, this.colgroup, this.table);
|
|
27816
|
+
return true;
|
|
27817
|
+
}
|
|
27818
|
+
ignoreMutation(mutation) {
|
|
27819
|
+
const target = mutation.target;
|
|
27820
|
+
const isInsideWrapper = this.dom.contains(target);
|
|
27821
|
+
const isInsideContent = this.contentDOM.contains(target);
|
|
27822
|
+
if (isInsideWrapper && !isInsideContent) {
|
|
27823
|
+
return mutation.type === "attributes" || mutation.type === "childList" || mutation.type === "characterData";
|
|
27824
|
+
}
|
|
27825
|
+
return false;
|
|
27826
|
+
}
|
|
27827
|
+
};
|
|
27828
|
+
function getDraggedWidth(dragging, event) {
|
|
27829
|
+
const offset = event.clientX - dragging.startX;
|
|
27830
|
+
return Math.max(dragging.minWidth, Math.round(dragging.startWidth + offset));
|
|
27831
|
+
}
|
|
27832
|
+
function getCurrentColWidth(view, cellPos, { colspan, colwidth }) {
|
|
27833
|
+
const width = colwidth?.[colwidth.length - 1];
|
|
27834
|
+
if (width) return width;
|
|
27835
|
+
const dom = view.domAtPos(cellPos);
|
|
27836
|
+
const cellElement = dom.node.childNodes[dom.offset];
|
|
27837
|
+
let domWidth = cellElement instanceof HTMLElement ? cellElement.offsetWidth : 0;
|
|
27838
|
+
let parts = Math.max(1, colspan);
|
|
27839
|
+
if (colwidth) {
|
|
27840
|
+
for (let index = 0; index < colspan; index += 1) {
|
|
27841
|
+
const partWidth = colwidth[index];
|
|
27842
|
+
if (partWidth) {
|
|
27843
|
+
domWidth -= partWidth;
|
|
27844
|
+
parts -= 1;
|
|
27845
|
+
}
|
|
27846
|
+
}
|
|
27847
|
+
}
|
|
27848
|
+
return domWidth / Math.max(1, parts);
|
|
27849
|
+
}
|
|
27850
|
+
function domCellAround(target) {
|
|
27851
|
+
let node = target instanceof Node ? target : null;
|
|
27852
|
+
while (node && node.nodeName !== "TD" && node.nodeName !== "TH") {
|
|
27853
|
+
const element = node instanceof Element ? node : null;
|
|
27854
|
+
if (element?.classList.contains("ProseMirror")) return null;
|
|
27855
|
+
node = node.parentNode;
|
|
27856
|
+
}
|
|
27857
|
+
return node instanceof HTMLElement ? node : null;
|
|
27858
|
+
}
|
|
27859
|
+
function edgeCell(view, event, side, handleWidth) {
|
|
27860
|
+
const offset = side === "right" ? -handleWidth : handleWidth;
|
|
27861
|
+
const found2 = view.posAtCoords({
|
|
27862
|
+
left: event.clientX + offset,
|
|
27863
|
+
top: event.clientY
|
|
27864
|
+
});
|
|
27865
|
+
if (!found2) return -1;
|
|
27866
|
+
const $cell = cellAround(view.state.doc.resolve(found2.pos));
|
|
27867
|
+
if (!$cell) return -1;
|
|
27868
|
+
if (side === "right") return $cell.pos;
|
|
27869
|
+
const map = TableMap.get($cell.node(-1));
|
|
27870
|
+
const start = $cell.start(-1);
|
|
27871
|
+
const index = map.map.indexOf($cell.pos - start);
|
|
27872
|
+
return index % map.width === 0 ? -1 : start + map.map[index - 1];
|
|
27873
|
+
}
|
|
27874
|
+
function updateHandle(view, value) {
|
|
27875
|
+
view.dispatch(view.state.tr.setMeta(columnResizingPluginKey, { setHandle: value }));
|
|
27876
|
+
}
|
|
27877
|
+
function handleMouseMove(view, event, handleWidth, lastColumnResizable) {
|
|
27878
|
+
if (!view.editable) return;
|
|
27879
|
+
const pluginState = columnResizingPluginKey.getState(view.state);
|
|
27880
|
+
if (!pluginState || pluginState.dragging) return;
|
|
27881
|
+
const target = domCellAround(event.target);
|
|
27882
|
+
let cell = -1;
|
|
27883
|
+
if (target) {
|
|
27884
|
+
const { left, right } = target.getBoundingClientRect();
|
|
27885
|
+
if (event.clientX - left <= handleWidth) cell = edgeCell(view, event, "left", handleWidth);
|
|
27886
|
+
else if (right - event.clientX <= handleWidth) cell = edgeCell(view, event, "right", handleWidth);
|
|
27887
|
+
}
|
|
27888
|
+
if (cell === pluginState.activeHandle) return;
|
|
27889
|
+
if (!lastColumnResizable && cell !== -1) {
|
|
27890
|
+
const $cell = view.state.doc.resolve(cell);
|
|
27891
|
+
const table = $cell.node(-1);
|
|
27892
|
+
const map = TableMap.get(table);
|
|
27893
|
+
const tableStart = $cell.start(-1);
|
|
27894
|
+
const nodeAfter = $cell.nodeAfter;
|
|
27895
|
+
if (!nodeAfter) return;
|
|
27896
|
+
if (map.colCount($cell.pos - tableStart) + nodeAfter.attrs.colspan - 1 === map.width - 1) return;
|
|
27897
|
+
}
|
|
27898
|
+
updateHandle(view, cell);
|
|
27899
|
+
}
|
|
27900
|
+
function handleMouseLeave(view) {
|
|
27901
|
+
if (!view.editable) return;
|
|
27902
|
+
const pluginState = columnResizingPluginKey.getState(view.state);
|
|
27903
|
+
if (pluginState && pluginState.activeHandle > -1 && !pluginState.dragging) {
|
|
27904
|
+
updateHandle(view, -1);
|
|
27905
|
+
}
|
|
27906
|
+
}
|
|
27907
|
+
function updateColumnWidth(view, cell, width) {
|
|
27908
|
+
const $cell = view.state.doc.resolve(cell);
|
|
27909
|
+
const table = $cell.node(-1);
|
|
27910
|
+
const map = TableMap.get(table);
|
|
27911
|
+
const start = $cell.start(-1);
|
|
27912
|
+
const nodeAfter = $cell.nodeAfter;
|
|
27913
|
+
if (!nodeAfter) return;
|
|
27914
|
+
const col = map.colCount($cell.pos - start) + nodeAfter.attrs.colspan - 1;
|
|
27915
|
+
const tr = view.state.tr;
|
|
27916
|
+
for (let row = 0; row < map.height; row += 1) {
|
|
27917
|
+
const mapIndex = row * map.width + col;
|
|
27918
|
+
if (row && map.map[mapIndex] === map.map[mapIndex - map.width]) continue;
|
|
27919
|
+
const pos = map.map[mapIndex];
|
|
27920
|
+
const cellNode = table.nodeAt(pos);
|
|
27921
|
+
if (!cellNode) continue;
|
|
27922
|
+
const attrs = cellNode.attrs;
|
|
27923
|
+
const index = attrs.colspan === 1 ? 0 : col - map.colCount(pos);
|
|
27924
|
+
if (attrs.colwidth?.[index] === width) continue;
|
|
27925
|
+
const colwidth = attrs.colwidth ? attrs.colwidth.slice() : Array.from({ length: attrs.colspan }, () => 0);
|
|
27926
|
+
colwidth[index] = width;
|
|
27927
|
+
tr.setNodeMarkup(start + pos, null, {
|
|
27928
|
+
...attrs,
|
|
27929
|
+
colwidth
|
|
27930
|
+
});
|
|
27931
|
+
}
|
|
27932
|
+
if (tr.docChanged) view.dispatch(tr);
|
|
27933
|
+
}
|
|
27934
|
+
function getActiveDragging(state) {
|
|
27935
|
+
const dragging = columnResizingPluginKey.getState(state)?.dragging;
|
|
27936
|
+
return dragging ? dragging : null;
|
|
27937
|
+
}
|
|
27938
|
+
function getColumnResizeGhost(view) {
|
|
27939
|
+
const doc = view.dom.ownerDocument;
|
|
27940
|
+
let ghost = doc.querySelector("[data-ueditor-column-resize-ghost]");
|
|
27941
|
+
if (!ghost) {
|
|
27942
|
+
ghost = doc.createElement("div");
|
|
27943
|
+
ghost.setAttribute("data-ueditor-column-resize-ghost", "");
|
|
27944
|
+
ghost.style.position = "fixed";
|
|
27945
|
+
ghost.style.zIndex = "99999";
|
|
27946
|
+
ghost.style.pointerEvents = "none";
|
|
27947
|
+
ghost.style.width = "2px";
|
|
27948
|
+
ghost.style.backgroundColor = "var(--primary, #2563eb)";
|
|
27949
|
+
ghost.style.opacity = "1";
|
|
27950
|
+
ghost.style.borderRadius = "9999px";
|
|
27951
|
+
ghost.style.boxShadow = "0 0 0 1px color-mix(in oklch, var(--background, #fff) 80%, transparent)";
|
|
27952
|
+
ghost.style.transform = "translateX(-1px)";
|
|
27953
|
+
ghost.style.willChange = "left";
|
|
27954
|
+
doc.body.appendChild(ghost);
|
|
27955
|
+
}
|
|
27956
|
+
return ghost;
|
|
27957
|
+
}
|
|
27958
|
+
function hideColumnResizeGhost(view) {
|
|
27959
|
+
view.dom.ownerDocument.querySelector("[data-ueditor-column-resize-ghost]")?.remove();
|
|
27960
|
+
}
|
|
27961
|
+
function getTableElementAtCell(view, cell) {
|
|
27962
|
+
const $cell = view.state.doc.resolve(cell);
|
|
27963
|
+
let dom = view.domAtPos($cell.start(-1)).node;
|
|
27964
|
+
while (dom && dom.nodeName !== "TABLE") dom = dom.parentNode;
|
|
27965
|
+
return dom instanceof HTMLTableElement ? dom : null;
|
|
27966
|
+
}
|
|
27967
|
+
function showColumnResizeGhost(view, cell, dragging, width) {
|
|
27968
|
+
const table = getTableElementAtCell(view, cell);
|
|
27969
|
+
if (!table) return;
|
|
27970
|
+
const rect = table.getBoundingClientRect();
|
|
27971
|
+
const left = dragging.startX + width - dragging.startWidth;
|
|
27972
|
+
const ghost = getColumnResizeGhost(view);
|
|
27973
|
+
ghost.style.left = `${left}px`;
|
|
27974
|
+
ghost.style.top = `${rect.top}px`;
|
|
27975
|
+
ghost.style.height = `${rect.height}px`;
|
|
27976
|
+
}
|
|
27977
|
+
function handleMouseDown(view, event, cellMinWidth) {
|
|
27978
|
+
if (!view.editable) return false;
|
|
27979
|
+
const win = view.dom.ownerDocument.defaultView ?? window;
|
|
27980
|
+
const pluginState = columnResizingPluginKey.getState(view.state);
|
|
27981
|
+
if (!pluginState || pluginState.activeHandle === -1 || pluginState.dragging) return false;
|
|
27982
|
+
const cell = view.state.doc.nodeAt(pluginState.activeHandle);
|
|
27983
|
+
if (!cell) return false;
|
|
27984
|
+
const attrs = cell.attrs;
|
|
27985
|
+
const width = getCurrentColWidth(view, pluginState.activeHandle, {
|
|
27986
|
+
colspan: attrs.colspan ?? 1,
|
|
27987
|
+
colwidth: attrs.colwidth
|
|
27988
|
+
});
|
|
27989
|
+
const minWidth = getDynamicColumnMinWidth(width, cellMinWidth);
|
|
27990
|
+
const dragging = {
|
|
27991
|
+
startX: event.clientX,
|
|
27992
|
+
startWidth: width,
|
|
27993
|
+
minWidth
|
|
27994
|
+
};
|
|
27995
|
+
view.dispatch(view.state.tr.setMeta(columnResizingPluginKey, { setDragging: dragging }));
|
|
27996
|
+
function finish(nextEvent) {
|
|
27997
|
+
win.removeEventListener("mouseup", finish);
|
|
27998
|
+
win.removeEventListener("mousemove", move);
|
|
27999
|
+
const activeDragging = getActiveDragging(view.state);
|
|
28000
|
+
const activeHandle = columnResizingPluginKey.getState(view.state)?.activeHandle ?? -1;
|
|
28001
|
+
if (activeDragging && activeHandle > -1) {
|
|
28002
|
+
updateColumnWidth(view, activeHandle, getDraggedWidth(activeDragging, nextEvent));
|
|
28003
|
+
view.dispatch(view.state.tr.setMeta(columnResizingPluginKey, { setDragging: null }));
|
|
28004
|
+
}
|
|
28005
|
+
hideColumnResizeGhost(view);
|
|
28006
|
+
}
|
|
28007
|
+
function move(nextEvent) {
|
|
28008
|
+
if (!nextEvent.buttons) return finish(nextEvent);
|
|
28009
|
+
const activeDragging = getActiveDragging(view.state);
|
|
28010
|
+
const activeHandle = columnResizingPluginKey.getState(view.state)?.activeHandle ?? -1;
|
|
28011
|
+
if (activeDragging && activeHandle > -1) {
|
|
28012
|
+
showColumnResizeGhost(view, activeHandle, activeDragging, getDraggedWidth(activeDragging, nextEvent));
|
|
28013
|
+
}
|
|
28014
|
+
}
|
|
28015
|
+
showColumnResizeGhost(view, pluginState.activeHandle, dragging, width);
|
|
28016
|
+
win.addEventListener("mouseup", finish);
|
|
28017
|
+
win.addEventListener("mousemove", move);
|
|
28018
|
+
event.preventDefault();
|
|
28019
|
+
return true;
|
|
28020
|
+
}
|
|
28021
|
+
function handleDecorations(state, cell) {
|
|
28022
|
+
const decorations = [];
|
|
28023
|
+
const $cell = state.doc.resolve(cell);
|
|
28024
|
+
const table = $cell.node(-1);
|
|
28025
|
+
if (!table) return DecorationSet2.empty;
|
|
28026
|
+
const map = TableMap.get(table);
|
|
28027
|
+
const start = $cell.start(-1);
|
|
28028
|
+
const nodeAfter = $cell.nodeAfter;
|
|
28029
|
+
if (!nodeAfter) return DecorationSet2.empty;
|
|
28030
|
+
const col = map.colCount($cell.pos - start) + nodeAfter.attrs.colspan - 1;
|
|
28031
|
+
for (let row = 0; row < map.height; row += 1) {
|
|
28032
|
+
const index = col + row * map.width;
|
|
28033
|
+
if ((col === map.width - 1 || map.map[index] !== map.map[index + 1]) && (row === 0 || map.map[index] !== map.map[index - map.width])) {
|
|
28034
|
+
const cellPos = map.map[index];
|
|
28035
|
+
const cellNode = table.nodeAt(cellPos);
|
|
28036
|
+
if (!cellNode) continue;
|
|
28037
|
+
const pos = start + cellPos + cellNode.nodeSize - 1;
|
|
28038
|
+
const dom = document.createElement("div");
|
|
28039
|
+
dom.className = "column-resize-handle";
|
|
28040
|
+
if (columnResizingPluginKey.getState(state)?.dragging) {
|
|
28041
|
+
decorations.push(Decoration2.node(start + cellPos, start + cellPos + cellNode.nodeSize, { class: "column-resize-dragging" }));
|
|
28042
|
+
}
|
|
28043
|
+
decorations.push(Decoration2.widget(pos, dom));
|
|
28044
|
+
}
|
|
28045
|
+
}
|
|
28046
|
+
return DecorationSet2.create(state.doc, decorations);
|
|
28047
|
+
}
|
|
28048
|
+
function dynamicColumnResizing({
|
|
28049
|
+
handleWidth = 5,
|
|
28050
|
+
cellMinWidth = MIN_RESIZED_TABLE_COLUMN_WIDTH,
|
|
28051
|
+
defaultCellMinWidth = DEFAULT_TABLE_COLUMN_WIDTH,
|
|
28052
|
+
View = UEditorTableView,
|
|
28053
|
+
lastColumnResizable = true
|
|
28054
|
+
} = {}) {
|
|
28055
|
+
const plugin = new Plugin4({
|
|
28056
|
+
key: columnResizingPluginKey,
|
|
28057
|
+
state: {
|
|
28058
|
+
init(_, state) {
|
|
28059
|
+
const nodeViews = plugin.spec.props?.nodeViews;
|
|
28060
|
+
const tableName = tableNodeTypes(state.schema).table.name;
|
|
28061
|
+
if (View && nodeViews) {
|
|
28062
|
+
nodeViews[tableName] = (node, view) => new View(node, defaultCellMinWidth, view);
|
|
28063
|
+
}
|
|
28064
|
+
return new ResizeState(-1, false);
|
|
28065
|
+
},
|
|
28066
|
+
apply(tr, prev) {
|
|
28067
|
+
return prev.apply(tr);
|
|
28068
|
+
}
|
|
28069
|
+
},
|
|
28070
|
+
props: {
|
|
28071
|
+
attributes: (state) => {
|
|
28072
|
+
const pluginState = columnResizingPluginKey.getState(state);
|
|
28073
|
+
return pluginState && pluginState.activeHandle > -1 ? { class: "resize-cursor" } : {};
|
|
28074
|
+
},
|
|
28075
|
+
handleDOMEvents: {
|
|
28076
|
+
mousemove: (view, event) => {
|
|
28077
|
+
handleMouseMove(view, event, handleWidth, lastColumnResizable);
|
|
28078
|
+
},
|
|
28079
|
+
mouseleave: (view) => {
|
|
28080
|
+
handleMouseLeave(view);
|
|
28081
|
+
},
|
|
28082
|
+
mousedown: (view, event) => handleMouseDown(view, event, cellMinWidth)
|
|
28083
|
+
},
|
|
28084
|
+
decorations: (state) => {
|
|
28085
|
+
const pluginState = columnResizingPluginKey.getState(state);
|
|
28086
|
+
if (pluginState && pluginState.activeHandle > -1) {
|
|
28087
|
+
return handleDecorations(state, pluginState.activeHandle);
|
|
28088
|
+
}
|
|
28089
|
+
return void 0;
|
|
28090
|
+
},
|
|
28091
|
+
nodeViews: {}
|
|
28092
|
+
}
|
|
28093
|
+
});
|
|
28094
|
+
return plugin;
|
|
28095
|
+
}
|
|
27727
28096
|
|
|
27728
28097
|
// src/components/UEditor/table-align-utils.ts
|
|
27729
28098
|
function findTableNodeInfoAtResolvedPos($pos) {
|
|
@@ -27860,9 +28229,20 @@ var UEditorTable = Table3.extend({
|
|
|
27860
28229
|
};
|
|
27861
28230
|
},
|
|
27862
28231
|
addProseMirrorPlugins() {
|
|
28232
|
+
const isResizable = this.options.resizable && this.editor.isEditable;
|
|
27863
28233
|
return [
|
|
27864
|
-
...
|
|
27865
|
-
|
|
28234
|
+
...isResizable ? [
|
|
28235
|
+
dynamicColumnResizing({
|
|
28236
|
+
handleWidth: this.options.handleWidth,
|
|
28237
|
+
cellMinWidth: this.options.cellMinWidth,
|
|
28238
|
+
defaultCellMinWidth: DEFAULT_TABLE_COLUMN_WIDTH,
|
|
28239
|
+
lastColumnResizable: this.options.lastColumnResizable
|
|
28240
|
+
})
|
|
28241
|
+
] : [],
|
|
28242
|
+
tableEditing({
|
|
28243
|
+
allowTableNodeSelection: this.options.allowTableNodeSelection
|
|
28244
|
+
}),
|
|
28245
|
+
new Plugin5({
|
|
27866
28246
|
appendTransaction(_transactions, _oldState, newState) {
|
|
27867
28247
|
const { doc, schema } = newState;
|
|
27868
28248
|
const paragraphType = schema.nodes.paragraph;
|
|
@@ -28347,12 +28727,12 @@ function buildUEditorExtensions({
|
|
|
28347
28727
|
table_row_default,
|
|
28348
28728
|
CustomTableCell.configure({
|
|
28349
28729
|
HTMLAttributes: {
|
|
28350
|
-
class: "border border-
|
|
28730
|
+
class: "border border-black px-2 py-0 min-w-25"
|
|
28351
28731
|
}
|
|
28352
28732
|
}),
|
|
28353
28733
|
CustomTableHeader.configure({
|
|
28354
28734
|
HTMLAttributes: {
|
|
28355
|
-
class: "border border-
|
|
28735
|
+
class: "border border-black px-2 py-0 bg-muted font-semibold min-w-25"
|
|
28356
28736
|
}
|
|
28357
28737
|
}),
|
|
28358
28738
|
CharacterCount.configure({
|
|
@@ -28402,7 +28782,6 @@ import {
|
|
|
28402
28782
|
ArrowLeft,
|
|
28403
28783
|
ArrowRight,
|
|
28404
28784
|
ArrowUp,
|
|
28405
|
-
Baseline,
|
|
28406
28785
|
Bold as BoldIcon,
|
|
28407
28786
|
ChevronDown as ChevronDown8,
|
|
28408
28787
|
ChevronsUpDown,
|
|
@@ -28908,7 +29287,7 @@ var ImageInput = ({ onSubmit, onCancel }) => {
|
|
|
28908
29287
|
|
|
28909
29288
|
// src/components/UEditor/table-cell-commands.ts
|
|
28910
29289
|
import { TextSelection as TextSelection2 } from "@tiptap/pm/state";
|
|
28911
|
-
import { selectedRect, TableMap } from "@tiptap/pm/tables";
|
|
29290
|
+
import { selectedRect, TableMap as TableMap2 } from "@tiptap/pm/tables";
|
|
28912
29291
|
function getCellSelectionPositions(selection) {
|
|
28913
29292
|
const value = selection;
|
|
28914
29293
|
const anchor = value.$anchorCell?.pos;
|
|
@@ -29000,7 +29379,7 @@ function getSelectedTableRect(editor) {
|
|
|
29000
29379
|
if (cellSelection) {
|
|
29001
29380
|
const tableInfo = findTableInfoFromCellPos(editor, cellSelection.anchor);
|
|
29002
29381
|
if (tableInfo) {
|
|
29003
|
-
const map =
|
|
29382
|
+
const map = TableMap2.get(tableInfo.table);
|
|
29004
29383
|
const rect = map.rectBetween(
|
|
29005
29384
|
cellSelection.anchor - tableInfo.tableStart,
|
|
29006
29385
|
cellSelection.head - tableInfo.tableStart
|
|
@@ -29096,7 +29475,7 @@ function runTableCommandAtCellPos(editor, cellPos, command) {
|
|
|
29096
29475
|
function getTableCornerCellPos(editor, activePos) {
|
|
29097
29476
|
const tableInfo = findTableInfoFromCellPos(editor, activePos);
|
|
29098
29477
|
if (!tableInfo) return null;
|
|
29099
|
-
const map =
|
|
29478
|
+
const map = TableMap2.get(tableInfo.table);
|
|
29100
29479
|
return tableInfo.tableStart + map.positionAt(map.height - 1, map.width - 1, tableInfo.table);
|
|
29101
29480
|
}
|
|
29102
29481
|
function replaceTableAtCellPos(editor, cellPos, updateTable) {
|
|
@@ -29120,7 +29499,7 @@ function duplicateTableRowAt(editor, rowIndex, cellPos) {
|
|
|
29120
29499
|
}
|
|
29121
29500
|
function clearTableRowAt(editor, rowIndex, cellPos) {
|
|
29122
29501
|
return replaceTableAtCellPos(editor, cellPos, (tableNode) => {
|
|
29123
|
-
const map =
|
|
29502
|
+
const map = TableMap2.get(tableNode);
|
|
29124
29503
|
if (rowIndex < 0 || rowIndex >= map.height) return null;
|
|
29125
29504
|
const rows = getTableRows(tableNode).map((rowInfo) => {
|
|
29126
29505
|
const cells = collectChildren(rowInfo.node);
|
|
@@ -29136,7 +29515,7 @@ function clearTableRowAt(editor, rowIndex, cellPos) {
|
|
|
29136
29515
|
}
|
|
29137
29516
|
function duplicateTableColumnAt(editor, columnIndex, cellPos) {
|
|
29138
29517
|
return replaceTableAtCellPos(editor, cellPos, (tableNode) => {
|
|
29139
|
-
const map =
|
|
29518
|
+
const map = TableMap2.get(tableNode);
|
|
29140
29519
|
if (columnIndex < 0 || columnIndex >= map.width) return null;
|
|
29141
29520
|
const rows = getTableRows(tableNode).map((rowInfo, rowIndex) => {
|
|
29142
29521
|
const cells = collectChildren(rowInfo.node);
|
|
@@ -29158,7 +29537,7 @@ function duplicateTableColumnAt(editor, columnIndex, cellPos) {
|
|
|
29158
29537
|
}
|
|
29159
29538
|
function clearTableColumnAt(editor, columnIndex, cellPos) {
|
|
29160
29539
|
return replaceTableAtCellPos(editor, cellPos, (tableNode) => {
|
|
29161
|
-
const map =
|
|
29540
|
+
const map = TableMap2.get(tableNode);
|
|
29162
29541
|
if (columnIndex < 0 || columnIndex >= map.width) return null;
|
|
29163
29542
|
const rows = getTableRows(tableNode).map((rowInfo) => {
|
|
29164
29543
|
const cells = collectChildren(rowInfo.node);
|
|
@@ -29197,6 +29576,16 @@ function normalizeStyleValue(value) {
|
|
|
29197
29576
|
}
|
|
29198
29577
|
function getDefaultFontFamilies(t) {
|
|
29199
29578
|
return [
|
|
29579
|
+
{ label: "\uAD74\uB9BC", value: '"Gulim", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif' },
|
|
29580
|
+
{ label: "\uAD74\uB9BC\uCCB4", value: '"GulimChe", "Gulim", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif' },
|
|
29581
|
+
{ label: "\uAD81\uC11C", value: '"Gungsuh", "Nanum Myeongjo", serif' },
|
|
29582
|
+
{ label: "\uAD81\uC11C\uCCB4", value: '"GungsuhChe", "Gungsuh", "Nanum Myeongjo", serif' },
|
|
29583
|
+
{ label: "\uB3CB\uC6C0", value: '"Dotum", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif' },
|
|
29584
|
+
{ label: "\uB3CB\uC6C0\uCCB4", value: '"DotumChe", "Dotum", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif' },
|
|
29585
|
+
{ label: "\uBC14\uD0D5", value: '"Batang", "Nanum Myeongjo", serif' },
|
|
29586
|
+
{ label: "\uBC14\uD0D5\uCCB4", value: '"BatangChe", "Batang", "Nanum Myeongjo", serif' },
|
|
29587
|
+
{ label: "\uB9D1\uC740\uACE0\uB515", value: '"Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif' },
|
|
29588
|
+
{ label: "\uB098\uB214\uBA85\uC870", value: '"Nanum Myeongjo", "Batang", serif' },
|
|
29200
29589
|
{ label: "Inter", value: '"Inter", "Noto Sans", "Noto Sans CJK KR", "Noto Sans CJK JP", "Segoe UI", sans-serif' },
|
|
29201
29590
|
{ label: "System UI", value: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif' },
|
|
29202
29591
|
{ label: "Roboto", value: '"Roboto", "Noto Sans", "Apple SD Gothic Neo", "Hiragino Kaku Gothic ProN", sans-serif' },
|
|
@@ -29218,13 +29607,21 @@ function getDefaultFontSizes() {
|
|
|
29218
29607
|
{ label: "10", value: "10px" },
|
|
29219
29608
|
{ label: "11", value: "11px" },
|
|
29220
29609
|
{ label: "12", value: "12px" },
|
|
29610
|
+
{ label: "13", value: "13px" },
|
|
29221
29611
|
{ label: "14", value: "14px" },
|
|
29612
|
+
{ label: "15", value: "15px" },
|
|
29222
29613
|
{ label: "16", value: "16px" },
|
|
29614
|
+
{ label: "17", value: "17px" },
|
|
29223
29615
|
{ label: "18", value: "18px" },
|
|
29616
|
+
{ label: "19", value: "19px" },
|
|
29224
29617
|
{ label: "20", value: "20px" },
|
|
29618
|
+
{ label: "21", value: "21px" },
|
|
29225
29619
|
{ label: "22", value: "22px" },
|
|
29620
|
+
{ label: "23", value: "23px" },
|
|
29226
29621
|
{ label: "24", value: "24px" },
|
|
29622
|
+
{ label: "25", value: "25px" },
|
|
29227
29623
|
{ label: "26", value: "26px" },
|
|
29624
|
+
{ label: "27", value: "27px" },
|
|
29228
29625
|
{ label: "28", value: "28px" },
|
|
29229
29626
|
{ label: "36", value: "36px" },
|
|
29230
29627
|
{ label: "48", value: "48px" },
|
|
@@ -29400,10 +29797,15 @@ var EditorToolbar = ({
|
|
|
29400
29797
|
const availableLetterSpacings = React77.useMemo(() => letterSpacings ?? getDefaultLetterSpacings(), [letterSpacings]);
|
|
29401
29798
|
const currentFontFamilyDisplayValue = currentFontFamily.split(",")[0]?.trim() ?? currentFontFamily;
|
|
29402
29799
|
const currentFontFamilyLabel = availableFontFamilies.find((option) => normalizeStyleValue(option.value) === currentFontFamily)?.label ?? (currentFontFamilyDisplayValue || t("toolbar.fontDefault"));
|
|
29403
|
-
const currentFontSizeLabel = availableFontSizes.find((option) => normalizeStyleValue(option.value) === currentFontSize)?.label ??
|
|
29800
|
+
const currentFontSizeLabel = availableFontSizes.find((option) => normalizeStyleValue(option.value) === currentFontSize)?.label ?? "13";
|
|
29404
29801
|
const currentLineHeightLabel = availableLineHeights.find((option) => normalizeStyleValue(option.value) === currentLineHeight)?.label ?? t("toolbar.lineHeightDefault");
|
|
29405
29802
|
const currentLetterSpacingLabel = availableLetterSpacings.find((option) => normalizeStyleValue(option.value) === currentLetterSpacing)?.label ?? t("toolbar.letterSpacingDefault");
|
|
29406
|
-
const
|
|
29803
|
+
const defaultFontFamily = availableFontFamilies[0];
|
|
29804
|
+
const defaultFontFamilyValue = defaultFontFamily?.value ?? "";
|
|
29805
|
+
const displayedFontFamilyLabel = currentFontFamily ? currentFontFamilyLabel : defaultFontFamily?.label ?? t("toolbar.fontDefault");
|
|
29806
|
+
const displayedFontFamilyValue = currentFontFamily || defaultFontFamilyValue;
|
|
29807
|
+
const displayedFontSizeLabel = currentFontSize ? currentFontSizeLabel : "13";
|
|
29808
|
+
const activeFontSize = currentFontSize || "13px";
|
|
29407
29809
|
const tableCommandAnchorPos = tableCommandAnchorPosRef.current ?? tableAnchorPos ?? void 0;
|
|
29408
29810
|
const insertImageFiles = async (files) => {
|
|
29409
29811
|
if (files.length === 0) return;
|
|
@@ -29441,70 +29843,48 @@ var EditorToolbar = ({
|
|
|
29441
29843
|
] });
|
|
29442
29844
|
}
|
|
29443
29845
|
return /* @__PURE__ */ jsxs72("div", { className: "flex flex-wrap items-center gap-0.5 border-b border-border/35 bg-linear-to-r from-muted/25 to-transparent p-1.5", children: [
|
|
29444
|
-
/* @__PURE__ */
|
|
29846
|
+
/* @__PURE__ */ jsx86(
|
|
29445
29847
|
DropdownMenu,
|
|
29446
29848
|
{
|
|
29447
29849
|
trigger: /* @__PURE__ */ jsxs72(ToolbarButton, { onClick: () => {
|
|
29448
|
-
}, title: t("toolbar.fontFamily"), className: "px-1.5 w-auto gap-
|
|
29449
|
-
/* @__PURE__ */ jsx86(
|
|
29850
|
+
}, title: t("toolbar.fontFamily"), className: "min-w-0 max-w-40 px-1.5 w-auto gap-1", children: [
|
|
29851
|
+
/* @__PURE__ */ jsx86("span", { className: "max-w-28 truncate text-xs font-medium", style: { fontFamily: displayedFontFamilyValue || void 0 }, children: displayedFontFamilyLabel }),
|
|
29450
29852
|
/* @__PURE__ */ jsx86(ChevronDown8, { className: "h-3 w-3 text-muted-foreground" })
|
|
29451
29853
|
] }),
|
|
29452
29854
|
contentClassName: "max-h-80 overflow-y-auto min-w-56 p-2",
|
|
29453
|
-
children:
|
|
29454
|
-
|
|
29455
|
-
|
|
29456
|
-
|
|
29457
|
-
|
|
29458
|
-
|
|
29459
|
-
|
|
29460
|
-
|
|
29461
|
-
|
|
29462
|
-
|
|
29463
|
-
availableFontFamilies.map((option) => /* @__PURE__ */ jsx86(
|
|
29464
|
-
DropdownMenuItem,
|
|
29465
|
-
{
|
|
29466
|
-
label: option.label,
|
|
29467
|
-
onClick: () => editor.chain().focus().setFontFamily(option.value).run(),
|
|
29468
|
-
active: normalizeStyleValue(option.value) === currentFontFamily,
|
|
29469
|
-
className: "font-medium"
|
|
29470
|
-
},
|
|
29471
|
-
option.value
|
|
29472
|
-
))
|
|
29473
|
-
]
|
|
29855
|
+
children: availableFontFamilies.map((option) => /* @__PURE__ */ jsx86(
|
|
29856
|
+
DropdownMenuItem,
|
|
29857
|
+
{
|
|
29858
|
+
label: option.label,
|
|
29859
|
+
onClick: () => editor.chain().focus().setFontFamily(option.value).run(),
|
|
29860
|
+
active: normalizeStyleValue(option.value) === (currentFontFamily || normalizeStyleValue(defaultFontFamilyValue)),
|
|
29861
|
+
className: "font-medium"
|
|
29862
|
+
},
|
|
29863
|
+
option.value
|
|
29864
|
+
))
|
|
29474
29865
|
}
|
|
29475
29866
|
),
|
|
29476
|
-
/* @__PURE__ */
|
|
29867
|
+
/* @__PURE__ */ jsx86(
|
|
29477
29868
|
DropdownMenu,
|
|
29478
29869
|
{
|
|
29479
29870
|
trigger: /* @__PURE__ */ jsxs72(ToolbarButton, { onClick: () => {
|
|
29480
|
-
}, title: t("toolbar.fontSize"), className: "px-1.5 w-auto gap-
|
|
29871
|
+
}, title: t("toolbar.fontSize"), className: "px-1.5 w-auto gap-1", children: [
|
|
29481
29872
|
/* @__PURE__ */ jsxs72("div", { className: "flex items-center gap-0.5", children: [
|
|
29482
29873
|
/* @__PURE__ */ jsx86(ChevronsUpDown, { className: "h-3 w-3 text-muted-foreground", strokeWidth: 2.5 }),
|
|
29483
|
-
/* @__PURE__ */ jsx86("span", { className: "text-xs font-
|
|
29874
|
+
/* @__PURE__ */ jsx86("span", { className: "min-w-4 text-center text-xs font-semibold leading-none", children: displayedFontSizeLabel })
|
|
29484
29875
|
] }),
|
|
29485
29876
|
/* @__PURE__ */ jsx86(ChevronDown8, { className: "h-3 w-3 text-muted-foreground" })
|
|
29486
29877
|
] }),
|
|
29487
29878
|
contentClassName: "max-h-80 overflow-y-auto min-w-32 p-2",
|
|
29488
|
-
children:
|
|
29489
|
-
|
|
29490
|
-
|
|
29491
|
-
|
|
29492
|
-
|
|
29493
|
-
|
|
29494
|
-
|
|
29495
|
-
|
|
29496
|
-
|
|
29497
|
-
),
|
|
29498
|
-
availableFontSizes.map((option) => /* @__PURE__ */ jsx86(
|
|
29499
|
-
DropdownMenuItem,
|
|
29500
|
-
{
|
|
29501
|
-
label: option.label,
|
|
29502
|
-
onClick: () => editor.chain().focus().setFontSize(option.value).run(),
|
|
29503
|
-
active: normalizeStyleValue(option.value) === currentFontSize
|
|
29504
|
-
},
|
|
29505
|
-
option.value
|
|
29506
|
-
))
|
|
29507
|
-
]
|
|
29879
|
+
children: availableFontSizes.map((option) => /* @__PURE__ */ jsx86(
|
|
29880
|
+
DropdownMenuItem,
|
|
29881
|
+
{
|
|
29882
|
+
label: option.label,
|
|
29883
|
+
onClick: () => editor.chain().focus().setFontSize(option.value).run(),
|
|
29884
|
+
active: normalizeStyleValue(option.value) === activeFontSize
|
|
29885
|
+
},
|
|
29886
|
+
option.value
|
|
29887
|
+
))
|
|
29508
29888
|
}
|
|
29509
29889
|
),
|
|
29510
29890
|
/* @__PURE__ */ jsxs72(
|
|
@@ -30246,7 +30626,7 @@ import {
|
|
|
30246
30626
|
} from "lucide-react";
|
|
30247
30627
|
|
|
30248
30628
|
// src/components/UEditor/table-formula-commands.ts
|
|
30249
|
-
import { selectedRect as selectedRect2, setCellAttr, TableMap as
|
|
30629
|
+
import { selectedRect as selectedRect2, setCellAttr, TableMap as TableMap3 } from "@tiptap/pm/tables";
|
|
30250
30630
|
|
|
30251
30631
|
// src/components/UEditor/table-formula.ts
|
|
30252
30632
|
var CELL_ADDRESS_RE = /^([A-Z]+)([1-9]\d*)$/i;
|
|
@@ -30780,7 +31160,7 @@ function getSelectionTableCellLabel(editor) {
|
|
|
30780
31160
|
const tableNode = $from.node(tableDepth);
|
|
30781
31161
|
const tableStart = $from.start(tableDepth);
|
|
30782
31162
|
const relativeCellPos = $from.before(cellDepth) - tableStart;
|
|
30783
|
-
const rect = safeFindCell2(
|
|
31163
|
+
const rect = safeFindCell2(TableMap3.get(tableNode), relativeCellPos);
|
|
30784
31164
|
if (!rect) return null;
|
|
30785
31165
|
return `${indexToColumnName(rect.left)}${rect.top + 1}`;
|
|
30786
31166
|
}
|
|
@@ -30796,7 +31176,7 @@ function createCellDisplayContent(cellNode, displayValue) {
|
|
|
30796
31176
|
return [paragraphType.create(null, cellNode.type.schema.text(displayValue))];
|
|
30797
31177
|
}
|
|
30798
31178
|
function buildTableValueMap(tableNode) {
|
|
30799
|
-
const map =
|
|
31179
|
+
const map = TableMap3.get(tableNode);
|
|
30800
31180
|
const values = /* @__PURE__ */ new Map();
|
|
30801
31181
|
for (const rowInfo of getTableRows2(tableNode)) {
|
|
30802
31182
|
for (const entry of rowInfo.cells) {
|
|
@@ -30916,7 +31296,7 @@ function promoteFormulaTextInTableNode(tableNode) {
|
|
|
30916
31296
|
function recalculateTableNode(tableNode, options) {
|
|
30917
31297
|
const promoted = promoteFormulaTextInTableNode(tableNode);
|
|
30918
31298
|
tableNode = promoted.tableNode;
|
|
30919
|
-
const map =
|
|
31299
|
+
const map = TableMap3.get(tableNode);
|
|
30920
31300
|
const values = buildTableValueMap(tableNode);
|
|
30921
31301
|
const formulaEntries = /* @__PURE__ */ new Map();
|
|
30922
31302
|
let changed = false;
|
|
@@ -35574,7 +35954,7 @@ if (typeof WeakMap != "undefined") {
|
|
|
35574
35954
|
return cache[cachePos++] = value;
|
|
35575
35955
|
};
|
|
35576
35956
|
}
|
|
35577
|
-
var
|
|
35957
|
+
var TableMap4 = class {
|
|
35578
35958
|
constructor(width, height, map, problems) {
|
|
35579
35959
|
this.width = width;
|
|
35580
35960
|
this.height = height;
|
|
@@ -35711,7 +36091,7 @@ function computeMap(table) {
|
|
|
35711
36091
|
pos++;
|
|
35712
36092
|
}
|
|
35713
36093
|
if (width === 0 || height === 0) (problems || (problems = [])).push({ type: "zero_sized" });
|
|
35714
|
-
const tableMap = new
|
|
36094
|
+
const tableMap = new TableMap4(width, height, map, problems);
|
|
35715
36095
|
let badWidths = false;
|
|
35716
36096
|
for (let i = 0; !badWidths && i < colWidths.length; i += 2) if (colWidths[i] != null && colWidths[i + 1] < height) badWidths = true;
|
|
35717
36097
|
if (badWidths) findBadColWidths(tableMap, colWidths, table);
|
|
@@ -35768,7 +36148,7 @@ function freshColWidth(attrs) {
|
|
|
35768
36148
|
for (let i = 0; i < attrs.colspan; i++) result.push(0);
|
|
35769
36149
|
return result;
|
|
35770
36150
|
}
|
|
35771
|
-
function
|
|
36151
|
+
function tableNodeTypes2(schema) {
|
|
35772
36152
|
let result = schema.cached.tableNodeTypes;
|
|
35773
36153
|
if (!result) {
|
|
35774
36154
|
result = schema.cached.tableNodeTypes = {};
|
|
@@ -35780,7 +36160,7 @@ function tableNodeTypes(schema) {
|
|
|
35780
36160
|
return result;
|
|
35781
36161
|
}
|
|
35782
36162
|
var tableEditingKey = new PluginKey5("selectingCells");
|
|
35783
|
-
function
|
|
36163
|
+
function cellAround2($pos) {
|
|
35784
36164
|
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));
|
|
35785
36165
|
return null;
|
|
35786
36166
|
}
|
|
@@ -35793,7 +36173,7 @@ function selectionCell(state) {
|
|
|
35793
36173
|
const sel = state.selection;
|
|
35794
36174
|
if ("$anchorCell" in sel && sel.$anchorCell) return sel.$anchorCell.pos > sel.$headCell.pos ? sel.$anchorCell : sel.$headCell;
|
|
35795
36175
|
else if ("node" in sel && sel.node && sel.node.type.spec.tableRole == "cell") return sel.$anchor;
|
|
35796
|
-
const $cell =
|
|
36176
|
+
const $cell = cellAround2(sel.$head) || cellNear(sel.$head);
|
|
35797
36177
|
if ($cell) return $cell;
|
|
35798
36178
|
throw new RangeError(`No cell found around position ${sel.head}`);
|
|
35799
36179
|
}
|
|
@@ -35807,7 +36187,7 @@ function cellNear($pos) {
|
|
|
35807
36187
|
if (role == "cell" || role == "header_cell") return $pos.doc.resolve(pos - before.nodeSize);
|
|
35808
36188
|
}
|
|
35809
36189
|
}
|
|
35810
|
-
function
|
|
36190
|
+
function pointsAtCell2($pos) {
|
|
35811
36191
|
return $pos.parent.type.spec.tableRole == "row" && !!$pos.nodeAfter;
|
|
35812
36192
|
}
|
|
35813
36193
|
function inSameTable($cellA, $cellB) {
|
|
@@ -35815,7 +36195,7 @@ function inSameTable($cellA, $cellB) {
|
|
|
35815
36195
|
}
|
|
35816
36196
|
function nextCell($pos, axis, dir) {
|
|
35817
36197
|
const table = $pos.node(-1);
|
|
35818
|
-
const map =
|
|
36198
|
+
const map = TableMap4.get(table);
|
|
35819
36199
|
const tableStart = $pos.start(-1);
|
|
35820
36200
|
const moved = map.nextCell($pos.pos - tableStart, axis, dir);
|
|
35821
36201
|
return moved == null ? null : $pos.node(0).resolve(tableStart + moved);
|
|
@@ -35835,7 +36215,7 @@ function removeColSpan(attrs, pos, n = 1) {
|
|
|
35835
36215
|
var CellSelection = class CellSelection2 extends Selection {
|
|
35836
36216
|
constructor($anchorCell, $headCell = $anchorCell) {
|
|
35837
36217
|
const table = $anchorCell.node(-1);
|
|
35838
|
-
const map =
|
|
36218
|
+
const map = TableMap4.get(table);
|
|
35839
36219
|
const tableStart = $anchorCell.start(-1);
|
|
35840
36220
|
const rect = map.rectBetween($anchorCell.pos - tableStart, $headCell.pos - tableStart);
|
|
35841
36221
|
const doc = $anchorCell.node(0);
|
|
@@ -35854,7 +36234,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
35854
36234
|
map(doc, mapping) {
|
|
35855
36235
|
const $anchorCell = doc.resolve(mapping.map(this.$anchorCell.pos));
|
|
35856
36236
|
const $headCell = doc.resolve(mapping.map(this.$headCell.pos));
|
|
35857
|
-
if (
|
|
36237
|
+
if (pointsAtCell2($anchorCell) && pointsAtCell2($headCell) && inSameTable($anchorCell, $headCell)) {
|
|
35858
36238
|
const tableChanged = this.$anchorCell.node(-1) != $anchorCell.node(-1);
|
|
35859
36239
|
if (tableChanged && this.isRowSelection()) return CellSelection2.rowSelection($anchorCell, $headCell);
|
|
35860
36240
|
else if (tableChanged && this.isColSelection()) return CellSelection2.colSelection($anchorCell, $headCell);
|
|
@@ -35864,7 +36244,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
35864
36244
|
}
|
|
35865
36245
|
content() {
|
|
35866
36246
|
const table = this.$anchorCell.node(-1);
|
|
35867
|
-
const map =
|
|
36247
|
+
const map = TableMap4.get(table);
|
|
35868
36248
|
const tableStart = this.$anchorCell.start(-1);
|
|
35869
36249
|
const rect = map.rectBetween(this.$anchorCell.pos - tableStart, this.$headCell.pos - tableStart);
|
|
35870
36250
|
const seen = {};
|
|
@@ -35918,7 +36298,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
35918
36298
|
}
|
|
35919
36299
|
forEachCell(f) {
|
|
35920
36300
|
const table = this.$anchorCell.node(-1);
|
|
35921
|
-
const map =
|
|
36301
|
+
const map = TableMap4.get(table);
|
|
35922
36302
|
const tableStart = this.$anchorCell.start(-1);
|
|
35923
36303
|
const cells = map.cellsInRect(map.rectBetween(this.$anchorCell.pos - tableStart, this.$headCell.pos - tableStart));
|
|
35924
36304
|
for (let i = 0; i < cells.length; i++) f(table.nodeAt(cells[i]), tableStart + cells[i]);
|
|
@@ -35933,7 +36313,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
35933
36313
|
}
|
|
35934
36314
|
static colSelection($anchorCell, $headCell = $anchorCell) {
|
|
35935
36315
|
const table = $anchorCell.node(-1);
|
|
35936
|
-
const map =
|
|
36316
|
+
const map = TableMap4.get(table);
|
|
35937
36317
|
const tableStart = $anchorCell.start(-1);
|
|
35938
36318
|
const anchorRect = map.findCell($anchorCell.pos - tableStart);
|
|
35939
36319
|
const headRect = map.findCell($headCell.pos - tableStart);
|
|
@@ -35949,7 +36329,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
35949
36329
|
}
|
|
35950
36330
|
isRowSelection() {
|
|
35951
36331
|
const table = this.$anchorCell.node(-1);
|
|
35952
|
-
const map =
|
|
36332
|
+
const map = TableMap4.get(table);
|
|
35953
36333
|
const tableStart = this.$anchorCell.start(-1);
|
|
35954
36334
|
const anchorLeft = map.colCount(this.$anchorCell.pos - tableStart);
|
|
35955
36335
|
const headLeft = map.colCount(this.$headCell.pos - tableStart);
|
|
@@ -35963,7 +36343,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
35963
36343
|
}
|
|
35964
36344
|
static rowSelection($anchorCell, $headCell = $anchorCell) {
|
|
35965
36345
|
const table = $anchorCell.node(-1);
|
|
35966
|
-
const map =
|
|
36346
|
+
const map = TableMap4.get(table);
|
|
35967
36347
|
const tableStart = $anchorCell.start(-1);
|
|
35968
36348
|
const anchorRect = map.findCell($anchorCell.pos - tableStart);
|
|
35969
36349
|
const headRect = map.findCell($headCell.pos - tableStart);
|
|
@@ -36012,7 +36392,7 @@ var CellBookmark = class CellBookmark2 {
|
|
|
36012
36392
|
};
|
|
36013
36393
|
var fixTablesKey = new PluginKey5("fix-tables");
|
|
36014
36394
|
function convertTableNodeToArrayOfRows(tableNode) {
|
|
36015
|
-
const map =
|
|
36395
|
+
const map = TableMap4.get(tableNode);
|
|
36016
36396
|
const rows = [];
|
|
36017
36397
|
const rowCount = map.height;
|
|
36018
36398
|
const colCount$1 = map.width;
|
|
@@ -36043,7 +36423,7 @@ function convertTableNodeToArrayOfRows(tableNode) {
|
|
|
36043
36423
|
}
|
|
36044
36424
|
function convertArrayOfRowsToTableNode(tableNode, arrayOfNodes) {
|
|
36045
36425
|
const newRows = [];
|
|
36046
|
-
const map =
|
|
36426
|
+
const map = TableMap4.get(tableNode);
|
|
36047
36427
|
const rowCount = map.height;
|
|
36048
36428
|
const colCount$1 = map.width;
|
|
36049
36429
|
for (let rowIndex = 0; rowIndex < rowCount; rowIndex++) {
|
|
@@ -36092,7 +36472,7 @@ function findParentNode(predicate, $pos) {
|
|
|
36092
36472
|
function getCellsInColumn(columnIndex, selection) {
|
|
36093
36473
|
const table = findTable(selection.$from);
|
|
36094
36474
|
if (!table) return;
|
|
36095
|
-
const map =
|
|
36475
|
+
const map = TableMap4.get(table.node);
|
|
36096
36476
|
if (columnIndex < 0 || columnIndex > map.width - 1) return;
|
|
36097
36477
|
return map.cellsInRect({
|
|
36098
36478
|
left: columnIndex,
|
|
@@ -36113,7 +36493,7 @@ function getCellsInColumn(columnIndex, selection) {
|
|
|
36113
36493
|
function getCellsInRow(rowIndex, selection) {
|
|
36114
36494
|
const table = findTable(selection.$from);
|
|
36115
36495
|
if (!table) return;
|
|
36116
|
-
const map =
|
|
36496
|
+
const map = TableMap4.get(table.node);
|
|
36117
36497
|
if (rowIndex < 0 || rowIndex > map.height - 1) return;
|
|
36118
36498
|
return map.cellsInRect({
|
|
36119
36499
|
left: 0,
|
|
@@ -36242,7 +36622,7 @@ function moveColumn(moveColParams) {
|
|
|
36242
36622
|
const newTable = moveTableColumn$1(table.node, indexesOriginColumn, indexesTargetColumn, 0);
|
|
36243
36623
|
tr.replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);
|
|
36244
36624
|
if (!select) return true;
|
|
36245
|
-
const map =
|
|
36625
|
+
const map = TableMap4.get(newTable);
|
|
36246
36626
|
const start = table.start;
|
|
36247
36627
|
const index = targetIndex;
|
|
36248
36628
|
const lastCell = map.positionAt(map.height - 1, index, newTable);
|
|
@@ -36270,7 +36650,7 @@ function moveRow(moveRowParams) {
|
|
|
36270
36650
|
const newTable = moveTableRow$1(table.node, indexesOriginRow, indexesTargetRow, 0);
|
|
36271
36651
|
tr.replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);
|
|
36272
36652
|
if (!select) return true;
|
|
36273
|
-
const map =
|
|
36653
|
+
const map = TableMap4.get(newTable);
|
|
36274
36654
|
const start = table.start;
|
|
36275
36655
|
const index = targetIndex;
|
|
36276
36656
|
const lastCell = map.positionAt(index, map.width - 1, newTable);
|
|
@@ -36290,7 +36670,7 @@ function selectedRect3(state) {
|
|
|
36290
36670
|
const $pos = selectionCell(state);
|
|
36291
36671
|
const table = $pos.node(-1);
|
|
36292
36672
|
const tableStart = $pos.start(-1);
|
|
36293
|
-
const map =
|
|
36673
|
+
const map = TableMap4.get(table);
|
|
36294
36674
|
return {
|
|
36295
36675
|
...sel instanceof CellSelection ? map.rectBetween(sel.$anchorCell.pos - tableStart, sel.$headCell.pos - tableStart) : map.findCell($pos.pos - tableStart),
|
|
36296
36676
|
tableStart,
|
|
@@ -36302,7 +36682,7 @@ function deprecated_toggleHeader(type) {
|
|
|
36302
36682
|
return function(state, dispatch) {
|
|
36303
36683
|
if (!isInTable(state)) return false;
|
|
36304
36684
|
if (dispatch) {
|
|
36305
|
-
const types =
|
|
36685
|
+
const types = tableNodeTypes2(state.schema);
|
|
36306
36686
|
const rect = selectedRect3(state), tr = state.tr;
|
|
36307
36687
|
const cells = rect.map.cellsInRect(type == "column" ? {
|
|
36308
36688
|
left: rect.left,
|
|
@@ -36342,7 +36722,7 @@ function toggleHeader(type, options) {
|
|
|
36342
36722
|
return function(state, dispatch) {
|
|
36343
36723
|
if (!isInTable(state)) return false;
|
|
36344
36724
|
if (dispatch) {
|
|
36345
|
-
const types =
|
|
36725
|
+
const types = tableNodeTypes2(state.schema);
|
|
36346
36726
|
const rect = selectedRect3(state), tr = state.tr;
|
|
36347
36727
|
const isHeaderRowEnabled = isHeaderEnabledByType("row", rect, types);
|
|
36348
36728
|
const isHeaderColumnEnabled = isHeaderEnabledByType("column", rect, types);
|
|
@@ -36377,7 +36757,7 @@ function deleteCellSelection(state, dispatch) {
|
|
|
36377
36757
|
if (!(sel instanceof CellSelection)) return false;
|
|
36378
36758
|
if (dispatch) {
|
|
36379
36759
|
const tr = state.tr;
|
|
36380
|
-
const baseContent =
|
|
36760
|
+
const baseContent = tableNodeTypes2(state.schema).cell.createAndFill().content;
|
|
36381
36761
|
sel.forEachCell((cell, pos) => {
|
|
36382
36762
|
if (!cell.content.eq(baseContent)) tr.replace(tr.mapping.map(pos + 1), tr.mapping.map(pos + cell.nodeSize - 1), new Slice(baseContent, 0, 0));
|
|
36383
36763
|
});
|
|
@@ -36488,7 +36868,7 @@ function atEndOfCell(view, axis, dir) {
|
|
|
36488
36868
|
}
|
|
36489
36869
|
return null;
|
|
36490
36870
|
}
|
|
36491
|
-
var
|
|
36871
|
+
var columnResizingPluginKey2 = new PluginKey5("tableColumnResizing");
|
|
36492
36872
|
|
|
36493
36873
|
// src/components/UEditor/table-controls.tsx
|
|
36494
36874
|
import {
|
|
@@ -36505,7 +36885,7 @@ import {
|
|
|
36505
36885
|
} from "lucide-react";
|
|
36506
36886
|
|
|
36507
36887
|
// src/components/UEditor/table-layout-model.ts
|
|
36508
|
-
var FALLBACK_TABLE_ROW_HEIGHT =
|
|
36888
|
+
var FALLBACK_TABLE_ROW_HEIGHT = DEFAULT_TABLE_ROW_HEIGHT;
|
|
36509
36889
|
var FALLBACK_TABLE_COLUMN_WIDTH = 160;
|
|
36510
36890
|
function getVisibleTableBounds(layout) {
|
|
36511
36891
|
const left = Math.max(layout.tableLeft, layout.wrapperLeft);
|
|
@@ -36587,7 +36967,7 @@ function buildLogicalColumnMetrics({
|
|
|
36587
36967
|
tableLeft,
|
|
36588
36968
|
tableWidth
|
|
36589
36969
|
}) {
|
|
36590
|
-
const map =
|
|
36970
|
+
const map = TableMap4.get(tableInfo.node);
|
|
36591
36971
|
const fallbackWidth = metricOrFallback(tableWidth / map.width, FALLBACK_TABLE_COLUMN_WIDTH);
|
|
36592
36972
|
const firstRow = tableElement.rows.item(0);
|
|
36593
36973
|
const visualColumns = [];
|
|
@@ -36640,7 +37020,7 @@ function buildLogicalRowMetrics({
|
|
|
36640
37020
|
tableHeight,
|
|
36641
37021
|
cornerCell
|
|
36642
37022
|
}) {
|
|
36643
|
-
const map =
|
|
37023
|
+
const map = TableMap4.get(tableInfo.node);
|
|
36644
37024
|
const fallbackHeight = metricOrFallback(tableHeight / map.height, FALLBACK_TABLE_ROW_HEIGHT);
|
|
36645
37025
|
const visualRows = [];
|
|
36646
37026
|
const seenCellPositions = /* @__PURE__ */ new Set();
|
|
@@ -36694,7 +37074,7 @@ function buildTableControlLayout(editor, surface, cell) {
|
|
|
36694
37074
|
if (rows.length === 0 || !tableInfo || !(cornerCell instanceof HTMLTableCellElement)) {
|
|
36695
37075
|
return null;
|
|
36696
37076
|
}
|
|
36697
|
-
const map =
|
|
37077
|
+
const map = TableMap4.get(tableInfo.node);
|
|
36698
37078
|
const surfaceRect = surface.getBoundingClientRect();
|
|
36699
37079
|
const tableRect = table.getBoundingClientRect();
|
|
36700
37080
|
const wrapperElement = table.closest(".tableWrapper");
|
|
@@ -37328,7 +37708,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
37328
37708
|
const handleSurfaceMouseMove = (event) => {
|
|
37329
37709
|
updateHoverState(event);
|
|
37330
37710
|
};
|
|
37331
|
-
const
|
|
37711
|
+
const handleMouseLeave2 = () => {
|
|
37332
37712
|
if (dragStateRef.current) return;
|
|
37333
37713
|
setHoverState(DEFAULT_TABLE_HOVER_STATE);
|
|
37334
37714
|
};
|
|
@@ -37338,7 +37718,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
37338
37718
|
syncFromCell(cell ?? getSelectedCell(editor));
|
|
37339
37719
|
};
|
|
37340
37720
|
proseMirror.addEventListener("mouseover", handleMouseOver);
|
|
37341
|
-
proseMirror.addEventListener("mouseleave",
|
|
37721
|
+
proseMirror.addEventListener("mouseleave", handleMouseLeave2);
|
|
37342
37722
|
proseMirror.addEventListener("click", handleFocusIn);
|
|
37343
37723
|
proseMirror.addEventListener("mouseup", handleFocusIn);
|
|
37344
37724
|
proseMirror.addEventListener("focusin", handleFocusIn);
|
|
@@ -37352,7 +37732,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
37352
37732
|
syncFromSelection();
|
|
37353
37733
|
return () => {
|
|
37354
37734
|
proseMirror.removeEventListener("mouseover", handleMouseOver);
|
|
37355
|
-
proseMirror.removeEventListener("mouseleave",
|
|
37735
|
+
proseMirror.removeEventListener("mouseleave", handleMouseLeave2);
|
|
37356
37736
|
proseMirror.removeEventListener("click", handleFocusIn);
|
|
37357
37737
|
proseMirror.removeEventListener("mouseup", handleFocusIn);
|
|
37358
37738
|
proseMirror.removeEventListener("focusin", handleFocusIn);
|
|
@@ -37451,7 +37831,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
37451
37831
|
document.body.style.cursor = "grabbing";
|
|
37452
37832
|
}, []);
|
|
37453
37833
|
React79.useEffect(() => {
|
|
37454
|
-
const
|
|
37834
|
+
const handleMouseMove2 = (event) => {
|
|
37455
37835
|
const dragState = dragStateRef.current;
|
|
37456
37836
|
const activeLayout = layoutRef.current;
|
|
37457
37837
|
const surface = containerRef.current;
|
|
@@ -37530,11 +37910,11 @@ function TableControls({ editor, containerRef }) {
|
|
|
37530
37910
|
}
|
|
37531
37911
|
clearDrag();
|
|
37532
37912
|
};
|
|
37533
|
-
window.addEventListener("mousemove",
|
|
37913
|
+
window.addEventListener("mousemove", handleMouseMove2);
|
|
37534
37914
|
window.addEventListener("mouseup", handleMouseUp);
|
|
37535
37915
|
window.addEventListener("blur", clearDrag);
|
|
37536
37916
|
return () => {
|
|
37537
|
-
window.removeEventListener("mousemove",
|
|
37917
|
+
window.removeEventListener("mousemove", handleMouseMove2);
|
|
37538
37918
|
window.removeEventListener("mouseup", handleMouseUp);
|
|
37539
37919
|
window.removeEventListener("blur", clearDrag);
|
|
37540
37920
|
};
|
|
@@ -37812,10 +38192,20 @@ var UEDITOR_PROSEMIRROR_CLASS_NAME = cn(
|
|
|
37812
38192
|
"[&_td]:align-top",
|
|
37813
38193
|
"[&_td]:box-border",
|
|
37814
38194
|
"[&_td]:select-text",
|
|
38195
|
+
"[&_td]:px-2",
|
|
38196
|
+
"[&_td]:py-0",
|
|
38197
|
+
"[&_td_p]:my-0",
|
|
37815
38198
|
"[&_th]:relative",
|
|
37816
38199
|
"[&_th]:align-top",
|
|
37817
38200
|
"[&_th]:box-border",
|
|
37818
38201
|
"[&_th]:select-text",
|
|
38202
|
+
"[&_th]:px-2",
|
|
38203
|
+
"[&_th]:py-0",
|
|
38204
|
+
"[&_th_p]:my-0",
|
|
38205
|
+
"[&_td[colwidth]]:min-w-0",
|
|
38206
|
+
"[&_th[colwidth]]:min-w-0",
|
|
38207
|
+
"[&_td[data-colwidth]]:min-w-0",
|
|
38208
|
+
"[&_th[data-colwidth]]:min-w-0",
|
|
37819
38209
|
"[&_.selectedCell]:after:content-['']",
|
|
37820
38210
|
"[&_.selectedCell]:after:absolute",
|
|
37821
38211
|
"[&_.selectedCell]:after:inset-0",
|
|
@@ -37845,6 +38235,7 @@ var UEDITOR_PROSEMIRROR_CLASS_NAME = cn(
|
|
|
37845
38235
|
"[&_.column-resize-handle]:after:content-['']",
|
|
37846
38236
|
"[&.resize-cursor_.column-resize-handle]:opacity-100",
|
|
37847
38237
|
"[&.resize-cursor_.column-resize-handle]:after:bg-primary",
|
|
38238
|
+
"[&_.column-resize-dragging]:min-w-0",
|
|
37848
38239
|
"[&.resize-cursor]:cursor-col-resize",
|
|
37849
38240
|
"[&.resize-row-cursor]:cursor-row-resize",
|
|
37850
38241
|
"[&_img.ProseMirror-selectednode]:ring-2",
|
|
@@ -37917,55 +38308,12 @@ function useTableRowResize({
|
|
|
37917
38308
|
clearAllTableResizeHover,
|
|
37918
38309
|
scheduleTableLayoutSync
|
|
37919
38310
|
}) {
|
|
37920
|
-
const commitFrameRef = useRef34(null);
|
|
37921
38311
|
const stateRef = useRef34(null);
|
|
37922
|
-
const commitPreview = React80.useCallback(() => {
|
|
37923
|
-
if (!editor) return;
|
|
37924
|
-
const state = stateRef.current;
|
|
37925
|
-
if (!state) return;
|
|
37926
|
-
const nextHeight = state.pendingHeight;
|
|
37927
|
-
if (nextHeight === state.previewHeight) {
|
|
37928
|
-
document.body.style.cursor = "row-resize";
|
|
37929
|
-
showRowGuide(state.tableElement, state.rowElement, state.cellElement);
|
|
37930
|
-
scheduleTableLayoutSync();
|
|
37931
|
-
return;
|
|
37932
|
-
}
|
|
37933
|
-
state.previewHeight = nextHeight;
|
|
37934
|
-
const tr = editor.view.state.tr;
|
|
37935
|
-
tr.setNodeMarkup(state.rowPos, void 0, {
|
|
37936
|
-
...state.rowNode.attrs,
|
|
37937
|
-
rowHeight: nextHeight
|
|
37938
|
-
});
|
|
37939
|
-
tr.setMeta("addToHistory", false);
|
|
37940
|
-
editor.view.dispatch(tr);
|
|
37941
|
-
state.rowNode = editor.view.state.doc.nodeAt(state.rowPos) ?? state.rowNode;
|
|
37942
|
-
const rowIndex = state.rowElement.rowIndex;
|
|
37943
|
-
if (rowIndex >= 0) {
|
|
37944
|
-
const refreshedRow = state.tableElement.rows.item(rowIndex);
|
|
37945
|
-
if (refreshedRow instanceof HTMLTableRowElement) {
|
|
37946
|
-
state.rowElement = refreshedRow;
|
|
37947
|
-
const refreshedCell = refreshedRow.cells.item(state.cellIndex);
|
|
37948
|
-
if (refreshedCell instanceof HTMLTableCellElement) {
|
|
37949
|
-
state.cellElement = refreshedCell;
|
|
37950
|
-
}
|
|
37951
|
-
}
|
|
37952
|
-
}
|
|
37953
|
-
document.body.style.cursor = "row-resize";
|
|
37954
|
-
showRowGuide(state.tableElement, state.rowElement, state.cellElement);
|
|
37955
|
-
scheduleTableLayoutSync();
|
|
37956
|
-
}, [editor, scheduleTableLayoutSync, showRowGuide]);
|
|
37957
|
-
const scheduleCommit = React80.useCallback(() => {
|
|
37958
|
-
if (commitFrameRef.current !== null) return;
|
|
37959
|
-
commitFrameRef.current = window.requestAnimationFrame(() => {
|
|
37960
|
-
commitFrameRef.current = null;
|
|
37961
|
-
commitPreview();
|
|
37962
|
-
});
|
|
37963
|
-
}, [commitPreview]);
|
|
37964
38312
|
const syncActiveGuide = React80.useCallback(() => {
|
|
37965
38313
|
const state = stateRef.current;
|
|
37966
38314
|
if (!state) return false;
|
|
37967
38315
|
setHoveredTableCell(state.cellElement);
|
|
37968
|
-
showRowGuide(state.tableElement, state.rowElement, state.cellElement);
|
|
38316
|
+
showRowGuide(state.tableElement, state.rowElement, state.cellElement, state.pendingHeight);
|
|
37969
38317
|
return true;
|
|
37970
38318
|
}, [setHoveredTableCell, showRowGuide]);
|
|
37971
38319
|
const isResizing = React80.useCallback(() => stateRef.current !== null, []);
|
|
@@ -37989,7 +38337,7 @@ function useTableRowResize({
|
|
|
37989
38337
|
previewHeight: startHeight,
|
|
37990
38338
|
pendingHeight: startHeight
|
|
37991
38339
|
};
|
|
37992
|
-
showRowGuide(table, row, cell);
|
|
38340
|
+
showRowGuide(table, row, cell, startHeight);
|
|
37993
38341
|
document.body.style.cursor = "row-resize";
|
|
37994
38342
|
event.preventDefault();
|
|
37995
38343
|
event.stopPropagation();
|
|
@@ -38004,13 +38352,14 @@ function useTableRowResize({
|
|
|
38004
38352
|
);
|
|
38005
38353
|
if (nextHeight === state.pendingHeight) {
|
|
38006
38354
|
document.body.style.cursor = "row-resize";
|
|
38007
|
-
showRowGuide(state.tableElement, state.rowElement, state.cellElement);
|
|
38355
|
+
showRowGuide(state.tableElement, state.rowElement, state.cellElement, state.pendingHeight);
|
|
38008
38356
|
return;
|
|
38009
38357
|
}
|
|
38010
38358
|
state.pendingHeight = nextHeight;
|
|
38359
|
+
state.previewHeight = nextHeight;
|
|
38011
38360
|
document.body.style.cursor = "row-resize";
|
|
38012
|
-
|
|
38013
|
-
}, [
|
|
38361
|
+
showRowGuide(state.tableElement, state.rowElement, state.cellElement, nextHeight);
|
|
38362
|
+
}, [showRowGuide]);
|
|
38014
38363
|
const handlePointerUp = React80.useCallback((event) => {
|
|
38015
38364
|
if (!editor) return;
|
|
38016
38365
|
const state = stateRef.current;
|
|
@@ -38020,16 +38369,10 @@ function useTableRowResize({
|
|
|
38020
38369
|
Math.round(state.startHeight + (event.clientY - state.startY))
|
|
38021
38370
|
);
|
|
38022
38371
|
state.pendingHeight = nextHeight;
|
|
38023
|
-
|
|
38024
|
-
window.cancelAnimationFrame(commitFrameRef.current);
|
|
38025
|
-
commitFrameRef.current = null;
|
|
38026
|
-
}
|
|
38027
|
-
commitPreview();
|
|
38028
|
-
const latestState = stateRef.current ?? state;
|
|
38029
|
-
const rowNode = editor.view.state.doc.nodeAt(latestState.rowPos) ?? latestState.rowNode;
|
|
38372
|
+
const rowNode = editor.view.state.doc.nodeAt(state.rowPos) ?? state.rowNode;
|
|
38030
38373
|
if (rowNode.attrs.rowHeight !== nextHeight) {
|
|
38031
38374
|
const tr = editor.view.state.tr;
|
|
38032
|
-
tr.setNodeMarkup(
|
|
38375
|
+
tr.setNodeMarkup(state.rowPos, void 0, {
|
|
38033
38376
|
...rowNode.attrs,
|
|
38034
38377
|
rowHeight: nextHeight
|
|
38035
38378
|
});
|
|
@@ -38040,13 +38383,9 @@ function useTableRowResize({
|
|
|
38040
38383
|
clearHoveredTableCell();
|
|
38041
38384
|
clearAllTableResizeHover();
|
|
38042
38385
|
scheduleTableLayoutSync();
|
|
38043
|
-
}, [clearAllTableResizeHover, clearHoveredTableCell,
|
|
38386
|
+
}, [clearAllTableResizeHover, clearHoveredTableCell, editor, scheduleTableLayoutSync]);
|
|
38044
38387
|
const cancelResize = React80.useCallback(() => {
|
|
38045
38388
|
if (!stateRef.current) return;
|
|
38046
|
-
if (commitFrameRef.current !== null) {
|
|
38047
|
-
window.cancelAnimationFrame(commitFrameRef.current);
|
|
38048
|
-
commitFrameRef.current = null;
|
|
38049
|
-
}
|
|
38050
38389
|
stateRef.current = null;
|
|
38051
38390
|
document.body.style.cursor = "";
|
|
38052
38391
|
clearHoveredTableCell();
|
|
@@ -38054,10 +38393,6 @@ function useTableRowResize({
|
|
|
38054
38393
|
scheduleTableLayoutSync();
|
|
38055
38394
|
}, [clearAllTableResizeHover, clearHoveredTableCell, scheduleTableLayoutSync]);
|
|
38056
38395
|
const cleanup = React80.useCallback(() => {
|
|
38057
|
-
if (commitFrameRef.current !== null) {
|
|
38058
|
-
window.cancelAnimationFrame(commitFrameRef.current);
|
|
38059
|
-
commitFrameRef.current = null;
|
|
38060
|
-
}
|
|
38061
38396
|
stateRef.current = null;
|
|
38062
38397
|
document.body.style.cursor = "";
|
|
38063
38398
|
}, []);
|
|
@@ -38167,13 +38502,15 @@ function useUEditorTableInteractions(editor, editable = true) {
|
|
|
38167
38502
|
getProseMirrorElement()?.classList.add("resize-cursor");
|
|
38168
38503
|
setEditorResizeCursor("col-resize");
|
|
38169
38504
|
}, [getProseMirrorElement, setEditorResizeCursor]);
|
|
38170
|
-
const showRowGuide = React81.useCallback((table, row, cell) => {
|
|
38505
|
+
const showRowGuide = React81.useCallback((table, row, cell, previewHeight) => {
|
|
38171
38506
|
const surface = editorContentRef.current;
|
|
38172
38507
|
const guide = tableRowGuideRef.current;
|
|
38173
38508
|
if (!surface || !guide) return;
|
|
38174
38509
|
const metrics = getRelativeBoundaryMetrics(surface, table, row, cell);
|
|
38510
|
+
const rowRect = row.getBoundingClientRect();
|
|
38511
|
+
const previewBottom = typeof previewHeight === "number" ? metrics.rowBottom - rowRect.height + previewHeight : metrics.rowBottom;
|
|
38175
38512
|
guide.style.left = `${metrics.left}px`;
|
|
38176
|
-
guide.style.top = `${
|
|
38513
|
+
guide.style.top = `${previewBottom - ROW_RESIZE_LINE_THICKNESS / 2}px`;
|
|
38177
38514
|
guide.style.width = `${metrics.width}px`;
|
|
38178
38515
|
guide.style.height = `${ROW_RESIZE_LINE_THICKNESS}px`;
|
|
38179
38516
|
guide.style.opacity = "1";
|
|
@@ -38413,7 +38750,7 @@ import {
|
|
|
38413
38750
|
} from "lucide-react";
|
|
38414
38751
|
|
|
38415
38752
|
// src/components/UEditor/preview-html.ts
|
|
38416
|
-
var
|
|
38753
|
+
var DEFAULT_TABLE_COLUMN_WIDTH2 = 100;
|
|
38417
38754
|
var TIPTAP_TABLE_MIN_COLUMN_WIDTH = 25;
|
|
38418
38755
|
function parsePixelWidth2(value) {
|
|
38419
38756
|
if (!value) return null;
|
|
@@ -38440,7 +38777,7 @@ function getCellWidths(cell) {
|
|
|
38440
38777
|
const width = parsePixelWidth2(cell.getAttribute("width")) ?? parseStyleWidth(cell.style);
|
|
38441
38778
|
if (!width) return null;
|
|
38442
38779
|
const colspan = getCellColspan(cell);
|
|
38443
|
-
return Array.from({ length: colspan }, () => Math.max(
|
|
38780
|
+
return Array.from({ length: colspan }, () => Math.max(DEFAULT_TABLE_COLUMN_WIDTH2, Math.round(width / colspan)));
|
|
38444
38781
|
}
|
|
38445
38782
|
function getColumnCount(table) {
|
|
38446
38783
|
const colCount = table.querySelectorAll("colgroup > col").length;
|
|
@@ -38455,7 +38792,7 @@ function getColumnCount(table) {
|
|
|
38455
38792
|
function resolveColumnWidths(table) {
|
|
38456
38793
|
const columnCount = getColumnCount(table);
|
|
38457
38794
|
if (columnCount <= 0) return [];
|
|
38458
|
-
const widths = Array.from({ length: columnCount }, () =>
|
|
38795
|
+
const widths = Array.from({ length: columnCount }, () => DEFAULT_TABLE_COLUMN_WIDTH2);
|
|
38459
38796
|
const cols = Array.from(table.querySelectorAll("colgroup > col"));
|
|
38460
38797
|
cols.slice(0, columnCount).forEach((col, index) => {
|
|
38461
38798
|
const width = parsePixelWidth2(col.getAttribute("width")) ?? parseStyleWidth(col.style);
|
|
@@ -38482,17 +38819,17 @@ function resolveColumnWidths(table) {
|
|
|
38482
38819
|
function setStyleProperty(element, property, value) {
|
|
38483
38820
|
element.style.setProperty(property, value);
|
|
38484
38821
|
}
|
|
38485
|
-
function
|
|
38822
|
+
function resolveExplicitRowHeight(row) {
|
|
38486
38823
|
const explicitRowHeight = parsePixelWidth2(row.getAttribute("data-row-height")) ?? parseStyleHeight(row.style);
|
|
38487
38824
|
if (explicitRowHeight) return Math.max(MIN_TABLE_ROW_HEIGHT, explicitRowHeight);
|
|
38488
38825
|
const cellHeight = Array.from(row.cells).reduce((maxHeight, cell) => {
|
|
38489
38826
|
const height = parsePixelWidth2(cell.getAttribute("height")) ?? parseStyleHeight(cell.style);
|
|
38490
38827
|
return height ? Math.max(maxHeight, height) : maxHeight;
|
|
38491
38828
|
}, 0);
|
|
38492
|
-
return Math.max(MIN_TABLE_ROW_HEIGHT, cellHeight);
|
|
38829
|
+
return cellHeight ? Math.max(MIN_TABLE_ROW_HEIGHT, cellHeight) : DEFAULT_TABLE_ROW_HEIGHT;
|
|
38493
38830
|
}
|
|
38494
38831
|
function normalizePreviewRowHeight(row) {
|
|
38495
|
-
const rowHeight =
|
|
38832
|
+
const rowHeight = resolveExplicitRowHeight(row);
|
|
38496
38833
|
row.style.height = `${rowHeight}px`;
|
|
38497
38834
|
row.style.minHeight = `${rowHeight}px`;
|
|
38498
38835
|
Array.from(row.cells).forEach((cell) => {
|
|
@@ -38924,17 +39261,6 @@ function buildTableMenuItems(t, editor, onInsertTable) {
|
|
|
38924
39261
|
label: t("menubar.row"),
|
|
38925
39262
|
disabled: !inTable,
|
|
38926
39263
|
items: [
|
|
38927
|
-
{
|
|
38928
|
-
type: "action",
|
|
38929
|
-
label: t("menubar.addRowBefore"),
|
|
38930
|
-
onClick: () => editor.chain().focus().addRowBefore().run()
|
|
38931
|
-
},
|
|
38932
|
-
{
|
|
38933
|
-
type: "action",
|
|
38934
|
-
label: t("menubar.addRowAfter"),
|
|
38935
|
-
onClick: () => editor.chain().focus().addRowAfter().run()
|
|
38936
|
-
},
|
|
38937
|
-
{ type: "separator" },
|
|
38938
39264
|
{
|
|
38939
39265
|
type: "action",
|
|
38940
39266
|
label: t("menubar.deleteRow"),
|
|
@@ -38948,17 +39274,6 @@ function buildTableMenuItems(t, editor, onInsertTable) {
|
|
|
38948
39274
|
label: t("menubar.column"),
|
|
38949
39275
|
disabled: !inTable,
|
|
38950
39276
|
items: [
|
|
38951
|
-
{
|
|
38952
|
-
type: "action",
|
|
38953
|
-
label: t("menubar.addColumnBefore"),
|
|
38954
|
-
onClick: () => editor.chain().focus().addColumnBefore().run()
|
|
38955
|
-
},
|
|
38956
|
-
{
|
|
38957
|
-
type: "action",
|
|
38958
|
-
label: t("menubar.addColumnAfter"),
|
|
38959
|
-
onClick: () => editor.chain().focus().addColumnAfter().run()
|
|
38960
|
-
},
|
|
38961
|
-
{ type: "separator" },
|
|
38962
39277
|
{
|
|
38963
39278
|
type: "action",
|
|
38964
39279
|
label: t("menubar.deleteColumn"),
|
|
@@ -39295,7 +39610,7 @@ var MenuBar = ({
|
|
|
39295
39610
|
|
|
39296
39611
|
// src/components/UEditor/table-formula-range-picker.ts
|
|
39297
39612
|
import { TextSelection as TextSelection4 } from "@tiptap/pm/state";
|
|
39298
|
-
import { TableMap as
|
|
39613
|
+
import { TableMap as TableMap5 } from "@tiptap/pm/tables";
|
|
39299
39614
|
function getCellText2(cellNode) {
|
|
39300
39615
|
return cellNode.textBetween(0, cellNode.content.size, "\n").trim();
|
|
39301
39616
|
}
|
|
@@ -39350,7 +39665,7 @@ function getPickedCellLabel(view, target, tablePos) {
|
|
|
39350
39665
|
const domPos = view.posAtDOM(cell, 0);
|
|
39351
39666
|
const tableInfo = findTableForPos(view, domPos);
|
|
39352
39667
|
if (!tableInfo || tableInfo.pos !== tablePos) return null;
|
|
39353
|
-
const map =
|
|
39668
|
+
const map = TableMap5.get(tableInfo.node);
|
|
39354
39669
|
const relativeCellPos = getCellRelativePosFromDomPos2(map, tableInfo.start, domPos);
|
|
39355
39670
|
if (relativeCellPos == null) return null;
|
|
39356
39671
|
const rect = map.findCell(relativeCellPos);
|