@underverse-ui/underverse 1.0.200 → 1.0.202
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 +857 -573
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +26 -0
- package/dist/index.d.ts +26 -0
- package/dist/index.js +824 -541
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -938,11 +938,14 @@ var en_default = {
|
|
|
938
938
|
mergeCells: "Merge Cells",
|
|
939
939
|
splitCell: "Split Cell",
|
|
940
940
|
openControls: "Open Table Controls",
|
|
941
|
+
cellFormatting: "Cell Formatting",
|
|
941
942
|
quickAddColumnAfter: "Quick Add Column After",
|
|
942
943
|
quickAddRowAfter: "Quick Add Row After",
|
|
943
944
|
expandTable: "Expand Table",
|
|
944
945
|
dragRow: "Drag Row",
|
|
945
946
|
dragColumn: "Drag Column",
|
|
947
|
+
resizeBoth: "Resize Table",
|
|
948
|
+
resizeCtrlHint: "Drag freely. Hold Ctrl to lock to one axis; hold Ctrl+Shift to preserve proportions",
|
|
946
949
|
alignLeft: "Align Table Left",
|
|
947
950
|
alignCenter: "Align Table Center",
|
|
948
951
|
alignRight: "Align Table Right",
|
|
@@ -1384,11 +1387,14 @@ var vi_default = {
|
|
|
1384
1387
|
mergeCells: "G\u1ED9p \xF4",
|
|
1385
1388
|
splitCell: "T\xE1ch \xF4",
|
|
1386
1389
|
openControls: "M\u1EDF \u0111i\u1EC1u khi\u1EC3n b\u1EA3ng",
|
|
1390
|
+
cellFormatting: "\u0110\u1ECBnh d\u1EA1ng \xF4",
|
|
1387
1391
|
quickAddColumnAfter: "Th\xEAm nhanh c\u1ED9t sau",
|
|
1388
1392
|
quickAddRowAfter: "Th\xEAm nhanh h\xE0ng sau",
|
|
1389
1393
|
expandTable: "M\u1EDF r\u1ED9ng b\u1EA3ng",
|
|
1390
1394
|
dragRow: "K\xE9o h\xE0ng",
|
|
1391
1395
|
dragColumn: "K\xE9o c\u1ED9t",
|
|
1396
|
+
resizeBoth: "\u0110\u1ED5i k\xEDch th\u01B0\u1EDBc b\u1EA3ng",
|
|
1397
|
+
resizeCtrlHint: "K\xE9o t\u1EF1 do; gi\u1EEF Ctrl \u0111\u1EC3 kh\xF3a m\u1ED9t chi\u1EC1u, ho\u1EB7c Ctrl+Shift \u0111\u1EC3 gi\u1EEF nguy\xEAn t\u1EF7 l\u1EC7",
|
|
1392
1398
|
alignLeft: "C\u0103n b\u1EA3ng tr\xE1i",
|
|
1393
1399
|
alignCenter: "C\u0103n b\u1EA3ng gi\u1EEFa",
|
|
1394
1400
|
alignRight: "C\u0103n b\u1EA3ng ph\u1EA3i",
|
|
@@ -1830,11 +1836,14 @@ var ko_default = {
|
|
|
1830
1836
|
mergeCells: "\uC140 \uBCD1\uD569",
|
|
1831
1837
|
splitCell: "\uC140 \uBD84\uD560",
|
|
1832
1838
|
openControls: "\uD45C \uCEE8\uD2B8\uB864 \uC5F4\uAE30",
|
|
1839
|
+
cellFormatting: "\uC140 \uC11C\uC2DD",
|
|
1833
1840
|
quickAddColumnAfter: "\uC624\uB978\uCABD \uC5F4 \uBE60\uB974\uAC8C \uCD94\uAC00",
|
|
1834
1841
|
quickAddRowAfter: "\uC544\uB798 \uD589 \uBE60\uB974\uAC8C \uCD94\uAC00",
|
|
1835
1842
|
expandTable: "\uD45C \uD655\uC7A5",
|
|
1836
1843
|
dragRow: "\uD589 \uB4DC\uB798\uADF8",
|
|
1837
1844
|
dragColumn: "\uC5F4 \uB4DC\uB798\uADF8",
|
|
1845
|
+
resizeBoth: "\uD45C \uD06C\uAE30 \uC870\uC808",
|
|
1846
|
+
resizeCtrlHint: "\uC790\uC720\uB86D\uAC8C \uB4DC\uB798\uADF8\uD569\uB2C8\uB2E4. Ctrl \uD0A4\uB97C \uB204\uB974\uBA74 \uD55C \uCD95\uC73C\uB85C \uACE0\uC815\uB418\uACE0, Ctrl+Shift \uD0A4\uB97C \uB204\uB974\uBA74 \uBE44\uC728\uC774 \uC720\uC9C0\uB429\uB2C8\uB2E4",
|
|
1838
1847
|
alignLeft: "\uD45C \uC67C\uCABD \uC815\uB82C",
|
|
1839
1848
|
alignCenter: "\uD45C \uAC00\uC6B4\uB370 \uC815\uB82C",
|
|
1840
1849
|
alignRight: "\uD45C \uC624\uB978\uCABD \uC815\uB82C",
|
|
@@ -2276,11 +2285,14 @@ var ja_default = {
|
|
|
2276
2285
|
mergeCells: "\u30BB\u30EB\u3092\u7D50\u5408",
|
|
2277
2286
|
splitCell: "\u30BB\u30EB\u3092\u5206\u5272",
|
|
2278
2287
|
openControls: "\u8868\u30B3\u30F3\u30C8\u30ED\u30FC\u30EB\u3092\u958B\u304F",
|
|
2288
|
+
cellFormatting: "\u30BB\u30EB\u306E\u66F8\u5F0F\u8A2D\u5B9A",
|
|
2279
2289
|
quickAddColumnAfter: "\u53F3\u5074\u306B\u5217\u3092\u3059\u3070\u3084\u304F\u8FFD\u52A0",
|
|
2280
2290
|
quickAddRowAfter: "\u4E0B\u306B\u884C\u3092\u3059\u3070\u3084\u304F\u8FFD\u52A0",
|
|
2281
2291
|
expandTable: "\u8868\u3092\u62E1\u5F35",
|
|
2282
2292
|
dragRow: "\u884C\u3092\u30C9\u30E9\u30C3\u30B0",
|
|
2283
2293
|
dragColumn: "\u5217\u3092\u30C9\u30E9\u30C3\u30B0",
|
|
2294
|
+
resizeBoth: "\u8868\u306E\u30B5\u30A4\u30BA\u3092\u5909\u66F4",
|
|
2295
|
+
resizeCtrlHint: "\u81EA\u7531\u306B\u30C9\u30E9\u30C3\u30B0\u3067\u304D\u307E\u3059\u3002Ctrl\u30AD\u30FC\u30671\u65B9\u5411\u306B\u56FA\u5B9A\u3057\u3001Ctrl+Shift\u30AD\u30FC\u3067\u7E26\u6A2A\u6BD4\u3092\u7DAD\u6301\u3057\u307E\u3059",
|
|
2284
2296
|
alignLeft: "\u8868\u3092\u5DE6\u5BC4\u305B",
|
|
2285
2297
|
alignCenter: "\u8868\u3092\u4E2D\u592E\u63C3\u3048",
|
|
2286
2298
|
alignRight: "\u8868\u3092\u53F3\u5BC4\u305B",
|
|
@@ -8679,6 +8691,8 @@ var DropdownMenu = ({
|
|
|
8679
8691
|
disabled = false,
|
|
8680
8692
|
isOpen,
|
|
8681
8693
|
onOpenChange,
|
|
8694
|
+
openOnHover = false,
|
|
8695
|
+
hoverCloseDelay = 120,
|
|
8682
8696
|
items,
|
|
8683
8697
|
borderMode
|
|
8684
8698
|
}) => {
|
|
@@ -8698,10 +8712,26 @@ var DropdownMenu = ({
|
|
|
8698
8712
|
const itemsRef = React29.useRef([]);
|
|
8699
8713
|
const [activeIndex, setActiveIndex] = useResettingIndex(open);
|
|
8700
8714
|
const parentMenu = React29.useContext(DropdownMenuContext);
|
|
8715
|
+
const hoverCloseTimeoutRef = React29.useRef(null);
|
|
8716
|
+
const cancelHoverClose = React29.useCallback(() => {
|
|
8717
|
+
if (hoverCloseTimeoutRef.current === null) return;
|
|
8718
|
+
clearTimeout(hoverCloseTimeoutRef.current);
|
|
8719
|
+
hoverCloseTimeoutRef.current = null;
|
|
8720
|
+
}, []);
|
|
8721
|
+
const scheduleHoverClose = React29.useCallback(() => {
|
|
8722
|
+
if (!openOnHover) return;
|
|
8723
|
+
cancelHoverClose();
|
|
8724
|
+
hoverCloseTimeoutRef.current = setTimeout(() => {
|
|
8725
|
+
hoverCloseTimeoutRef.current = null;
|
|
8726
|
+
setOpen(false);
|
|
8727
|
+
}, hoverCloseDelay);
|
|
8728
|
+
}, [cancelHoverClose, hoverCloseDelay, openOnHover, setOpen]);
|
|
8729
|
+
React29.useEffect(() => () => cancelHoverClose(), [cancelHoverClose]);
|
|
8701
8730
|
const closeMenu = React29.useCallback(() => {
|
|
8731
|
+
cancelHoverClose();
|
|
8702
8732
|
setOpen(false);
|
|
8703
8733
|
parentMenu?.closeMenu();
|
|
8704
|
-
}, [parentMenu, setOpen]);
|
|
8734
|
+
}, [cancelHoverClose, parentMenu, setOpen]);
|
|
8705
8735
|
const getEnabledMenuItems = React29.useCallback(() => {
|
|
8706
8736
|
const menuEl = menuRef.current;
|
|
8707
8737
|
if (!menuEl) return [];
|
|
@@ -8758,9 +8788,11 @@ var DropdownMenu = ({
|
|
|
8758
8788
|
const menuContext = React29.useMemo(
|
|
8759
8789
|
() => ({
|
|
8760
8790
|
closeMenu,
|
|
8761
|
-
closeOnSelect
|
|
8791
|
+
closeOnSelect,
|
|
8792
|
+
cancelHoverClose,
|
|
8793
|
+
scheduleHoverClose
|
|
8762
8794
|
}),
|
|
8763
|
-
[closeMenu, closeOnSelect]
|
|
8795
|
+
[cancelHoverClose, closeMenu, closeOnSelect, scheduleHoverClose]
|
|
8764
8796
|
);
|
|
8765
8797
|
const handleItemClick = (itemOnClick) => {
|
|
8766
8798
|
itemOnClick();
|
|
@@ -8768,71 +8800,117 @@ var DropdownMenu = ({
|
|
|
8768
8800
|
closeMenu();
|
|
8769
8801
|
}
|
|
8770
8802
|
};
|
|
8771
|
-
const menuBody = /* @__PURE__ */ jsx32(DropdownMenuContext.Provider, { value: menuContext, children: /* @__PURE__ */ jsx32(
|
|
8772
|
-
|
|
8773
|
-
|
|
8774
|
-
|
|
8775
|
-
|
|
8776
|
-
|
|
8777
|
-
|
|
8778
|
-
|
|
8779
|
-
|
|
8780
|
-
|
|
8781
|
-
|
|
8782
|
-
|
|
8783
|
-
|
|
8784
|
-
|
|
8785
|
-
|
|
8786
|
-
|
|
8787
|
-
|
|
8788
|
-
|
|
8789
|
-
|
|
8790
|
-
"
|
|
8791
|
-
|
|
8792
|
-
|
|
8793
|
-
|
|
8794
|
-
|
|
8795
|
-
|
|
8796
|
-
|
|
8797
|
-
|
|
8798
|
-
|
|
8799
|
-
|
|
8800
|
-
|
|
8801
|
-
|
|
8802
|
-
|
|
8803
|
-
|
|
8803
|
+
const menuBody = /* @__PURE__ */ jsx32(DropdownMenuContext.Provider, { value: menuContext, children: /* @__PURE__ */ jsx32(
|
|
8804
|
+
"div",
|
|
8805
|
+
{
|
|
8806
|
+
ref: menuRef,
|
|
8807
|
+
"data-dropdown-menu": true,
|
|
8808
|
+
"data-state": open ? "open" : "closed",
|
|
8809
|
+
role: "menu",
|
|
8810
|
+
className: cn("min-w-40", className),
|
|
8811
|
+
onMouseEnter: openOnHover ? () => {
|
|
8812
|
+
cancelHoverClose();
|
|
8813
|
+
parentMenu?.cancelHoverClose();
|
|
8814
|
+
} : void 0,
|
|
8815
|
+
onMouseLeave: openOnHover ? () => {
|
|
8816
|
+
scheduleHoverClose();
|
|
8817
|
+
parentMenu?.scheduleHoverClose();
|
|
8818
|
+
} : void 0,
|
|
8819
|
+
children: items ? items.map((item, index) => {
|
|
8820
|
+
const IconComponent = item.icon;
|
|
8821
|
+
return /* @__PURE__ */ jsxs22(
|
|
8822
|
+
"button",
|
|
8823
|
+
{
|
|
8824
|
+
ref: (el) => {
|
|
8825
|
+
if (el) itemsRef.current[index] = el;
|
|
8826
|
+
},
|
|
8827
|
+
onClick: () => handleItemClick(item.onClick),
|
|
8828
|
+
disabled: item.disabled,
|
|
8829
|
+
role: "menuitem",
|
|
8830
|
+
"data-dropdown-menu-item": "",
|
|
8831
|
+
tabIndex: -1,
|
|
8832
|
+
style: {
|
|
8833
|
+
animationDelay: open ? `${Math.min(index * 20, 200)}ms` : "0ms"
|
|
8834
|
+
},
|
|
8835
|
+
className: cn(
|
|
8836
|
+
"dropdown-item flex w-full items-center gap-2 px-2.5 py-1.5 text-sm",
|
|
8837
|
+
resolvedBorderMode ? getBorderRadiusClass(resolvedBorderMode) : "rounded-lg",
|
|
8838
|
+
"outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
|
|
8839
|
+
"hover:bg-accent hover:text-accent-foreground",
|
|
8840
|
+
"focus:bg-accent focus:text-accent-foreground",
|
|
8841
|
+
"disabled:opacity-50 disabled:cursor-not-allowed",
|
|
8842
|
+
item.destructive && "text-destructive hover:bg-destructive/10 focus:bg-destructive/10"
|
|
8843
|
+
),
|
|
8844
|
+
children: [
|
|
8845
|
+
IconComponent && /* @__PURE__ */ jsx32(IconComponent, { className: "h-4 w-4" }),
|
|
8846
|
+
item.label
|
|
8847
|
+
]
|
|
8848
|
+
},
|
|
8849
|
+
index
|
|
8850
|
+
);
|
|
8851
|
+
}) : children
|
|
8852
|
+
}
|
|
8853
|
+
) });
|
|
8804
8854
|
const triggerProps = trigger.props;
|
|
8805
|
-
const
|
|
8855
|
+
const {
|
|
8856
|
+
ref: childRef,
|
|
8857
|
+
onKeyDown: triggerOnKeyDown,
|
|
8858
|
+
onClick: triggerOnClick,
|
|
8859
|
+
onMouseEnter: triggerOnMouseEnter,
|
|
8860
|
+
onMouseLeave: triggerOnMouseLeave
|
|
8861
|
+
} = triggerProps;
|
|
8862
|
+
const setTriggerNode = React29.useCallback((node) => {
|
|
8863
|
+
setRefValue(childRef, node);
|
|
8864
|
+
triggerRef.current = node;
|
|
8865
|
+
}, [childRef]);
|
|
8866
|
+
const handleTriggerKeyDown = React29.useCallback((event) => {
|
|
8867
|
+
if (!disabled) {
|
|
8868
|
+
if (event.key === "ArrowDown") {
|
|
8869
|
+
event.preventDefault();
|
|
8870
|
+
setOpen(true);
|
|
8871
|
+
requestAnimationFrame(() => focusMenuItem(0));
|
|
8872
|
+
} else if (event.key === "ArrowUp") {
|
|
8873
|
+
event.preventDefault();
|
|
8874
|
+
setOpen(true);
|
|
8875
|
+
requestAnimationFrame(() => {
|
|
8876
|
+
const enabled = getEnabledMenuItems();
|
|
8877
|
+
focusMenuItem(enabled.length - 1);
|
|
8878
|
+
});
|
|
8879
|
+
} else if (event.key === "Escape") {
|
|
8880
|
+
event.preventDefault();
|
|
8881
|
+
setOpen(false);
|
|
8882
|
+
}
|
|
8883
|
+
}
|
|
8884
|
+
triggerOnKeyDown?.(event);
|
|
8885
|
+
}, [disabled, focusMenuItem, getEnabledMenuItems, setOpen, triggerOnKeyDown]);
|
|
8886
|
+
const handleTriggerClick = React29.useCallback((event) => {
|
|
8887
|
+
if (openOnHover && !disabled) {
|
|
8888
|
+
cancelHoverClose();
|
|
8889
|
+
setOpen(true);
|
|
8890
|
+
}
|
|
8891
|
+
triggerOnClick?.(event);
|
|
8892
|
+
}, [cancelHoverClose, disabled, openOnHover, setOpen, triggerOnClick]);
|
|
8893
|
+
const handleTriggerMouseEnter = React29.useCallback((event) => {
|
|
8894
|
+
if (openOnHover && !disabled) {
|
|
8895
|
+
cancelHoverClose();
|
|
8896
|
+
parentMenu?.cancelHoverClose();
|
|
8897
|
+
setOpen(true);
|
|
8898
|
+
}
|
|
8899
|
+
triggerOnMouseEnter?.(event);
|
|
8900
|
+
}, [cancelHoverClose, disabled, openOnHover, parentMenu, setOpen, triggerOnMouseEnter]);
|
|
8901
|
+
const handleTriggerMouseLeave = React29.useCallback((event) => {
|
|
8902
|
+
scheduleHoverClose();
|
|
8903
|
+
triggerOnMouseLeave?.(event);
|
|
8904
|
+
}, [scheduleHoverClose, triggerOnMouseLeave]);
|
|
8806
8905
|
const enhancedTrigger = React29.cloneElement(trigger, {
|
|
8807
8906
|
...triggerProps,
|
|
8808
|
-
ref:
|
|
8809
|
-
triggerRef.current = node;
|
|
8810
|
-
}),
|
|
8907
|
+
ref: setTriggerNode,
|
|
8811
8908
|
"aria-haspopup": "menu",
|
|
8812
8909
|
"aria-expanded": open,
|
|
8813
|
-
onKeyDown:
|
|
8814
|
-
|
|
8815
|
-
|
|
8816
|
-
|
|
8817
|
-
e.preventDefault();
|
|
8818
|
-
setOpen(true);
|
|
8819
|
-
requestAnimationFrame(() => focusMenuItem(0));
|
|
8820
|
-
} else if (e.key === "ArrowUp") {
|
|
8821
|
-
e.preventDefault();
|
|
8822
|
-
setOpen(true);
|
|
8823
|
-
requestAnimationFrame(() => {
|
|
8824
|
-
const enabled = getEnabledMenuItems();
|
|
8825
|
-
focusMenuItem(enabled.length - 1);
|
|
8826
|
-
});
|
|
8827
|
-
} else if (e.key === "Escape") {
|
|
8828
|
-
e.preventDefault();
|
|
8829
|
-
setOpen(false);
|
|
8830
|
-
}
|
|
8831
|
-
}
|
|
8832
|
-
}, triggerProps.onKeyDown),
|
|
8833
|
-
onFocus: chainEventHandlers((e) => {
|
|
8834
|
-
triggerRef.current = e.currentTarget;
|
|
8835
|
-
}, triggerProps.onFocus)
|
|
8910
|
+
onKeyDown: handleTriggerKeyDown,
|
|
8911
|
+
onClick: handleTriggerClick,
|
|
8912
|
+
onMouseEnter: handleTriggerMouseEnter,
|
|
8913
|
+
onMouseLeave: handleTriggerMouseLeave
|
|
8836
8914
|
});
|
|
8837
8915
|
return /* @__PURE__ */ jsx32(
|
|
8838
8916
|
Popover,
|
|
@@ -8930,6 +9008,7 @@ var DropdownMenuSub = ({ label, icon: Icon, disabled, borderMode, children }) =>
|
|
|
8930
9008
|
}
|
|
8931
9009
|
),
|
|
8932
9010
|
placement: "right",
|
|
9011
|
+
openOnHover: true,
|
|
8933
9012
|
children
|
|
8934
9013
|
}
|
|
8935
9014
|
);
|
|
@@ -32513,7 +32592,6 @@ import {
|
|
|
32513
32592
|
ArrowLeft,
|
|
32514
32593
|
ArrowRight,
|
|
32515
32594
|
ArrowUp,
|
|
32516
|
-
ChevronDown as ChevronDown8,
|
|
32517
32595
|
CircleCheckBig as CircleCheckBig2,
|
|
32518
32596
|
FileCode as FileCode3,
|
|
32519
32597
|
Heading1 as Heading1Icon,
|
|
@@ -32526,7 +32604,6 @@ import {
|
|
|
32526
32604
|
Quote as QuoteIcon,
|
|
32527
32605
|
RotateCcw as RotateCcw2,
|
|
32528
32606
|
SquareCheckBig,
|
|
32529
|
-
Table as TableIcon,
|
|
32530
32607
|
TableCellsMerge,
|
|
32531
32608
|
Trash2 as Trash22,
|
|
32532
32609
|
Type as Type2,
|
|
@@ -33597,10 +33674,10 @@ var ToolbarButton = React84.forwardRef(({ onClick, onMouseDown, active, disabled
|
|
|
33597
33674
|
onClick,
|
|
33598
33675
|
disabled,
|
|
33599
33676
|
className: cn(
|
|
33600
|
-
"flex h-
|
|
33601
|
-
"gap-0.5 [
|
|
33677
|
+
"flex h-7 w-7 shrink-0 cursor-pointer items-center justify-center rounded-md transition-colors duration-150",
|
|
33678
|
+
"gap-0.5 [&>svg]:h-3.5 [&>svg]:w-3.5 [&>svg]:shrink-0",
|
|
33602
33679
|
"hover:bg-accent",
|
|
33603
|
-
"focus:outline-none focus:ring-2 focus:ring-primary/20",
|
|
33680
|
+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/20",
|
|
33604
33681
|
"disabled:opacity-40 disabled:cursor-not-allowed",
|
|
33605
33682
|
active ? "bg-primary/10 text-primary shadow-sm" : "text-[#7B8184] hover:text-foreground dark:text-muted-foreground",
|
|
33606
33683
|
className
|
|
@@ -33614,7 +33691,7 @@ var ToolbarButton = React84.forwardRef(({ onClick, onMouseDown, active, disabled
|
|
|
33614
33691
|
return button;
|
|
33615
33692
|
});
|
|
33616
33693
|
ToolbarButton.displayName = "ToolbarButton";
|
|
33617
|
-
var ToolbarDivider = () => /* @__PURE__ */ jsx93("div", { "aria-hidden": "true", className: "mx-
|
|
33694
|
+
var ToolbarDivider = () => /* @__PURE__ */ jsx93("div", { "aria-hidden": "true", className: "mx-1.5 h-7 w-px shrink-0 bg-[rgba(123,129,132,0.24)]" });
|
|
33618
33695
|
var TableInsertGrid = ({
|
|
33619
33696
|
insertLabel,
|
|
33620
33697
|
previewTemplate,
|
|
@@ -33681,7 +33758,6 @@ var EditorToolbar = ({
|
|
|
33681
33758
|
const [showImageInput, setShowImageInput] = useState50(false);
|
|
33682
33759
|
const [showLinkInput, setShowLinkInput] = useState50(false);
|
|
33683
33760
|
const [isTableMenuOpen, setIsTableMenuOpen] = useState50(false);
|
|
33684
|
-
const [preservedTableAnchorPos, setPreservedTableAnchorPos] = useState50(null);
|
|
33685
33761
|
const fileInputRef = useRef34(null);
|
|
33686
33762
|
const [isUploadingImage, setIsUploadingImage] = useState50(false);
|
|
33687
33763
|
const [imageUploadError, setImageUploadError] = useState50(null);
|
|
@@ -33689,14 +33765,11 @@ var EditorToolbar = ({
|
|
|
33689
33765
|
const imageAttrs = editor.getAttributes("image");
|
|
33690
33766
|
const tableAnchorPos = getTableAnchorPos(editor);
|
|
33691
33767
|
const tableInfo = tableAnchorPos == null ? null : findTableNodeInfoFromState(editor.state, tableAnchorPos);
|
|
33692
|
-
const tableAttrs = tableInfo?.node.attrs ?? editor.getAttributes("table");
|
|
33693
33768
|
const textStyleAttrs = editor.getAttributes("textStyle");
|
|
33694
33769
|
const imageLayout = imageAttrs.imageLayout === "left" || imageAttrs.imageLayout === "right" ? imageAttrs.imageLayout : "block";
|
|
33695
33770
|
const imageWidthPreset = imageAttrs.imageWidthPreset === "sm" || imageAttrs.imageWidthPreset === "md" || imageAttrs.imageWidthPreset === "lg" ? imageAttrs.imageWidthPreset : null;
|
|
33696
|
-
const tableAlignAttr = tableAttrs.tableAlign ?? tableAttrs.textAlign;
|
|
33697
|
-
const currentTableAlign = tableAlignAttr === "center" || tableAlignAttr === "right" ? tableAlignAttr : "left";
|
|
33698
33771
|
const isTableSelected = tableInfo !== null;
|
|
33699
|
-
const hasTableContext = isTableSelected
|
|
33772
|
+
const hasTableContext = isTableSelected;
|
|
33700
33773
|
const canMergeCells = hasTableContext && editor.can().mergeCells();
|
|
33701
33774
|
const canSplitCell = hasTableContext && editor.can().splitCell();
|
|
33702
33775
|
const currentCellVerticalAlign = normalizeStyleValue(editor.getAttributes("tableCell").verticalAlign || editor.getAttributes("tableHeader").verticalAlign) || "";
|
|
@@ -33722,7 +33795,6 @@ var EditorToolbar = ({
|
|
|
33722
33795
|
const displayedFontFamilyValue = currentFontFamily || defaultFontFamilyValue;
|
|
33723
33796
|
const displayedFontSizeLabel = currentFontSize ? currentFontSizeLabel : "13";
|
|
33724
33797
|
const activeFontSize = currentFontSize || "13px";
|
|
33725
|
-
const tableCommandAnchorPos = preservedTableAnchorPos ?? tableAnchorPos ?? void 0;
|
|
33726
33798
|
const isMedium = variant === "medium";
|
|
33727
33799
|
const isMediumFull = variant === "medium-full";
|
|
33728
33800
|
const isFull = variant === "default" || variant === "full" || variant === "notion" || !variant;
|
|
@@ -33765,11 +33837,8 @@ var EditorToolbar = ({
|
|
|
33765
33837
|
/* @__PURE__ */ jsxs75(
|
|
33766
33838
|
DropdownMenu,
|
|
33767
33839
|
{
|
|
33768
|
-
trigger: /* @__PURE__ */
|
|
33769
|
-
}, active: editor.isActive("formCheckbox"), title: t("slashCommand.formCheckbox"), children:
|
|
33770
|
-
/* @__PURE__ */ jsx93(SquareCheckBig, { className: "w-4 h-4" }),
|
|
33771
|
-
/* @__PURE__ */ jsx93(ChevronDown8, { className: "w-3 h-3" })
|
|
33772
|
-
] }),
|
|
33840
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
33841
|
+
}, active: editor.isActive("formCheckbox"), title: t("slashCommand.formCheckbox"), children: /* @__PURE__ */ jsx93(SquareCheckBig, { className: "w-4 h-4" }) }),
|
|
33773
33842
|
children: [
|
|
33774
33843
|
/* @__PURE__ */ jsx93(
|
|
33775
33844
|
DropdownMenuItem,
|
|
@@ -33836,7 +33905,7 @@ var EditorToolbar = ({
|
|
|
33836
33905
|
"div",
|
|
33837
33906
|
{
|
|
33838
33907
|
role: "toolbar",
|
|
33839
|
-
className: "flex min-h-
|
|
33908
|
+
className: "flex min-h-12 flex-nowrap items-center gap-0.5 overflow-x-auto border-b border-[rgba(196,197,213,0.6)] bg-[#F4F4F4] px-2 py-2 dark:bg-muted/60",
|
|
33840
33909
|
children: [
|
|
33841
33910
|
isFull && /* @__PURE__ */ jsx93(
|
|
33842
33911
|
DropdownMenu,
|
|
@@ -33847,7 +33916,7 @@ var EditorToolbar = ({
|
|
|
33847
33916
|
onClick: () => {
|
|
33848
33917
|
},
|
|
33849
33918
|
title: t("toolbar.fontFamily"),
|
|
33850
|
-
className: "h-
|
|
33919
|
+
className: "h-8 w-44 max-w-44 justify-between gap-2 border border-[rgba(196,197,213,0.6)] bg-white px-2.5 text-[#404040] shadow-[0_1px_2px_rgba(0,0,0,0.07)] hover:bg-white hover:text-[#404040] dark:bg-background dark:text-foreground",
|
|
33851
33920
|
children: [
|
|
33852
33921
|
/* @__PURE__ */ jsx93("span", { className: "min-w-0 flex-1 truncate text-left text-sm font-normal", style: { fontFamily: displayedFontFamilyValue || void 0 }, children: displayedFontFamilyLabel }),
|
|
33853
33922
|
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-3 w-3 shrink-0 text-[#7B8184]" })
|
|
@@ -33876,7 +33945,7 @@ var EditorToolbar = ({
|
|
|
33876
33945
|
onClick: () => {
|
|
33877
33946
|
},
|
|
33878
33947
|
title: t("toolbar.fontSize"),
|
|
33879
|
-
className: "h-
|
|
33948
|
+
className: "h-8 w-16 justify-between gap-2 border border-[rgba(196,197,213,0.6)] bg-white px-2.5 text-[#404040] shadow-[0_1px_2px_rgba(0,0,0,0.07)] hover:bg-white hover:text-[#404040] dark:bg-background dark:text-foreground",
|
|
33880
33949
|
children: [
|
|
33881
33950
|
/* @__PURE__ */ jsx93("span", { className: "text-sm font-normal leading-none", children: displayedFontSizeLabel }),
|
|
33882
33951
|
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-3 w-3 shrink-0 text-[#7B8184]" })
|
|
@@ -33899,11 +33968,8 @@ var EditorToolbar = ({
|
|
|
33899
33968
|
DropdownMenu,
|
|
33900
33969
|
{
|
|
33901
33970
|
contentClassName: "p-1",
|
|
33902
|
-
trigger: /* @__PURE__ */
|
|
33903
|
-
}, title: t("toolbar.textStyle"), className: "px-1.5 w-auto gap-0.5", children:
|
|
33904
|
-
/* @__PURE__ */ jsx93(FigmaTextStyleIcon, { className: "h-4 w-4" }),
|
|
33905
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
33906
|
-
] }),
|
|
33971
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
33972
|
+
}, title: t("toolbar.textStyle"), className: "px-1.5 w-auto gap-0.5", children: /* @__PURE__ */ jsx93(FigmaTextStyleIcon, { className: "h-4 w-4" }) }),
|
|
33907
33973
|
children: [
|
|
33908
33974
|
/* @__PURE__ */ jsx93(
|
|
33909
33975
|
DropdownMenuItem,
|
|
@@ -34082,11 +34148,8 @@ var EditorToolbar = ({
|
|
|
34082
34148
|
/* @__PURE__ */ jsx93(
|
|
34083
34149
|
DropdownMenu,
|
|
34084
34150
|
{
|
|
34085
|
-
trigger: /* @__PURE__ */
|
|
34086
|
-
}, title: t("colors.textColor"), children:
|
|
34087
|
-
/* @__PURE__ */ jsx93(TextColorIcon, { color: currentTextColor }),
|
|
34088
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34089
|
-
] }),
|
|
34151
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34152
|
+
}, title: t("colors.textColor"), children: /* @__PURE__ */ jsx93(TextColorIcon, { color: currentTextColor }) }),
|
|
34090
34153
|
children: /* @__PURE__ */ jsx93(
|
|
34091
34154
|
EditorColorPalette,
|
|
34092
34155
|
{
|
|
@@ -34107,11 +34170,8 @@ var EditorToolbar = ({
|
|
|
34107
34170
|
/* @__PURE__ */ jsx93(
|
|
34108
34171
|
DropdownMenu,
|
|
34109
34172
|
{
|
|
34110
|
-
trigger: /* @__PURE__ */
|
|
34111
|
-
}, active: editor.isActive("highlight"), title: t("colors.highlight"), children:
|
|
34112
|
-
/* @__PURE__ */ jsx93(HighlightColorIcon, { color: currentHighlightColor }),
|
|
34113
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34114
|
-
] }),
|
|
34173
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34174
|
+
}, active: editor.isActive("highlight"), title: t("colors.highlight"), children: /* @__PURE__ */ jsx93(HighlightColorIcon, { color: currentHighlightColor }) }),
|
|
34115
34175
|
children: /* @__PURE__ */ jsx93(
|
|
34116
34176
|
EditorColorPalette,
|
|
34117
34177
|
{
|
|
@@ -34129,35 +34189,13 @@ var EditorToolbar = ({
|
|
|
34129
34189
|
)
|
|
34130
34190
|
}
|
|
34131
34191
|
),
|
|
34132
|
-
(isMediumFull || isFull) && /* @__PURE__ */ jsxs75(Fragment29, { children: [
|
|
34133
|
-
/* @__PURE__ */ jsx93(ToolbarDivider, {}),
|
|
34134
|
-
/* @__PURE__ */ jsx93(
|
|
34135
|
-
DropdownMenu,
|
|
34136
|
-
{
|
|
34137
|
-
contentClassName: "p-0 overflow-hidden",
|
|
34138
|
-
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34139
|
-
}, title: t("toolbar.emoji"), children: /* @__PURE__ */ jsx93(FigmaSmileIcon, { className: "h-4 w-4" }) }),
|
|
34140
|
-
children: /* @__PURE__ */ jsx93(
|
|
34141
|
-
EmojiPicker2,
|
|
34142
|
-
{
|
|
34143
|
-
onSelect: (emoji) => {
|
|
34144
|
-
editor.chain().focus().insertContent(emoji).run();
|
|
34145
|
-
}
|
|
34146
|
-
}
|
|
34147
|
-
)
|
|
34148
|
-
}
|
|
34149
|
-
)
|
|
34150
|
-
] }),
|
|
34151
34192
|
(isMediumFull || isFull) && /* @__PURE__ */ jsxs75(Fragment29, { children: [
|
|
34152
34193
|
/* @__PURE__ */ jsx93(ToolbarDivider, {}),
|
|
34153
34194
|
/* @__PURE__ */ jsxs75(
|
|
34154
34195
|
DropdownMenu,
|
|
34155
34196
|
{
|
|
34156
|
-
trigger: /* @__PURE__ */
|
|
34157
|
-
}, title: t("toolbar.alignment"), children:
|
|
34158
|
-
/* @__PURE__ */ jsx93(FigmaAlignLeftIcon, { className: "h-4 w-4" }),
|
|
34159
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34160
|
-
] }),
|
|
34197
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34198
|
+
}, title: t("toolbar.alignment"), children: /* @__PURE__ */ jsx93(FigmaAlignLeftIcon, { className: "h-4 w-4" }) }),
|
|
34161
34199
|
children: [
|
|
34162
34200
|
/* @__PURE__ */ jsx93(
|
|
34163
34201
|
DropdownMenuItem,
|
|
@@ -34231,11 +34269,8 @@ var EditorToolbar = ({
|
|
|
34231
34269
|
hasTableContext && /* @__PURE__ */ jsxs75(
|
|
34232
34270
|
DropdownMenu,
|
|
34233
34271
|
{
|
|
34234
|
-
trigger: /* @__PURE__ */
|
|
34235
|
-
}, title: t("tableMenu.textDirection"), children:
|
|
34236
|
-
currentCellTextDirection === "vertical" ? /* @__PURE__ */ jsx93(ArrowDown, { className: "w-4 h-4" }) : /* @__PURE__ */ jsx93(ArrowRight, { className: "w-4 h-4" }),
|
|
34237
|
-
/* @__PURE__ */ jsx93(ChevronDown8, { className: "w-3 h-3" })
|
|
34238
|
-
] }),
|
|
34272
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34273
|
+
}, title: t("tableMenu.textDirection"), children: currentCellTextDirection === "vertical" ? /* @__PURE__ */ jsx93(ArrowDown, { className: "w-4 h-4" }) : /* @__PURE__ */ jsx93(ArrowRight, { className: "w-4 h-4" }) }),
|
|
34239
34274
|
children: [
|
|
34240
34275
|
/* @__PURE__ */ jsx93(
|
|
34241
34276
|
DropdownMenuItem,
|
|
@@ -34263,11 +34298,8 @@ var EditorToolbar = ({
|
|
|
34263
34298
|
/* @__PURE__ */ jsxs75(
|
|
34264
34299
|
DropdownMenu,
|
|
34265
34300
|
{
|
|
34266
|
-
trigger: /* @__PURE__ */
|
|
34267
|
-
}, title: t("toolbar.bulletList"), children:
|
|
34268
|
-
/* @__PURE__ */ jsx93(FigmaListIcon, { className: "h-4 w-4" }),
|
|
34269
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34270
|
-
] }),
|
|
34301
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34302
|
+
}, title: t("toolbar.bulletList"), children: /* @__PURE__ */ jsx93(FigmaListIcon, { className: "h-4 w-4" }) }),
|
|
34271
34303
|
children: [
|
|
34272
34304
|
/* @__PURE__ */ jsx93(
|
|
34273
34305
|
DropdownMenuItem,
|
|
@@ -34305,11 +34337,8 @@ var EditorToolbar = ({
|
|
|
34305
34337
|
/* @__PURE__ */ jsxs75(
|
|
34306
34338
|
DropdownMenu,
|
|
34307
34339
|
{
|
|
34308
|
-
trigger: /* @__PURE__ */
|
|
34309
|
-
}, active: editor.isActive("formCheckbox"), title: t("slashCommand.formCheckbox"), children:
|
|
34310
|
-
/* @__PURE__ */ jsx93(SquareCheckBig, { className: "w-4 h-4" }),
|
|
34311
|
-
/* @__PURE__ */ jsx93(ChevronDown8, { className: "w-3 h-3" })
|
|
34312
|
-
] }),
|
|
34340
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34341
|
+
}, active: editor.isActive("formCheckbox"), title: t("slashCommand.formCheckbox"), children: /* @__PURE__ */ jsx93(SquareCheckBig, { className: "w-4 h-4" }) }),
|
|
34313
34342
|
children: [
|
|
34314
34343
|
/* @__PURE__ */ jsx93(
|
|
34315
34344
|
DropdownMenuItem,
|
|
@@ -34334,11 +34363,8 @@ var EditorToolbar = ({
|
|
|
34334
34363
|
isFull && /* @__PURE__ */ jsxs75(
|
|
34335
34364
|
DropdownMenu,
|
|
34336
34365
|
{
|
|
34337
|
-
trigger: /* @__PURE__ */
|
|
34338
|
-
}, title: t("toolbar.quote"), children:
|
|
34339
|
-
/* @__PURE__ */ jsx93(FigmaQuoteIcon, { className: "h-4 w-4" }),
|
|
34340
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34341
|
-
] }),
|
|
34366
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34367
|
+
}, title: t("toolbar.quote"), children: /* @__PURE__ */ jsx93(FigmaQuoteIcon, { className: "h-4 w-4" }) }),
|
|
34342
34368
|
children: [
|
|
34343
34369
|
/* @__PURE__ */ jsx93(
|
|
34344
34370
|
DropdownMenuItem,
|
|
@@ -34366,11 +34392,8 @@ var EditorToolbar = ({
|
|
|
34366
34392
|
(isMediumFull || isFull) && /* @__PURE__ */ jsx93(
|
|
34367
34393
|
DropdownMenu,
|
|
34368
34394
|
{
|
|
34369
|
-
trigger: /* @__PURE__ */
|
|
34370
|
-
}, title: t("toolbar.image"), children:
|
|
34371
|
-
/* @__PURE__ */ jsx93(FigmaImageIcon, { className: "h-4 w-4" }),
|
|
34372
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34373
|
-
] }),
|
|
34395
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34396
|
+
}, title: t("toolbar.image"), children: /* @__PURE__ */ jsx93(FigmaImageIcon, { className: "h-4 w-4" }) }),
|
|
34374
34397
|
children: showImageInput ? /* @__PURE__ */ jsx93(
|
|
34375
34398
|
ImageInput,
|
|
34376
34399
|
{
|
|
@@ -34490,149 +34513,25 @@ var EditorToolbar = ({
|
|
|
34490
34513
|
] })
|
|
34491
34514
|
}
|
|
34492
34515
|
),
|
|
34493
|
-
(isMediumFull || isFull) && /* @__PURE__ */
|
|
34516
|
+
(isMediumFull || isFull) && /* @__PURE__ */ jsx93(
|
|
34494
34517
|
DropdownMenu,
|
|
34495
34518
|
{
|
|
34496
34519
|
isOpen: isTableMenuOpen,
|
|
34497
|
-
onOpenChange:
|
|
34498
|
-
|
|
34499
|
-
|
|
34500
|
-
},
|
|
34501
|
-
trigger: /* @__PURE__ */ jsxs75(ToolbarButton, { onClick: () => {
|
|
34502
|
-
}, title: t("toolbar.table"), children: [
|
|
34503
|
-
/* @__PURE__ */ jsx93(FigmaTableIcon, { className: "h-4 w-4" }),
|
|
34504
|
-
/* @__PURE__ */ jsx93(FigmaChevronDownIcon, { className: "h-2.5 w-2.5" })
|
|
34505
|
-
] }),
|
|
34520
|
+
onOpenChange: setIsTableMenuOpen,
|
|
34521
|
+
trigger: /* @__PURE__ */ jsx93(ToolbarButton, { onClick: () => {
|
|
34522
|
+
}, title: t("toolbar.table"), children: /* @__PURE__ */ jsx93(FigmaTableIcon, { className: "h-4 w-4" }) }),
|
|
34506
34523
|
contentClassName: "p-2 min-w-56",
|
|
34507
|
-
children:
|
|
34508
|
-
|
|
34509
|
-
|
|
34510
|
-
|
|
34511
|
-
|
|
34512
|
-
|
|
34513
|
-
|
|
34514
|
-
|
|
34515
|
-
setIsTableMenuOpen(false);
|
|
34516
|
-
setPreservedTableAnchorPos(null);
|
|
34517
|
-
}
|
|
34518
|
-
}
|
|
34519
|
-
),
|
|
34520
|
-
/* @__PURE__ */ jsx93("div", { className: "my-1 border-t" }),
|
|
34521
|
-
/* @__PURE__ */ jsx93(
|
|
34522
|
-
DropdownMenuItem,
|
|
34523
|
-
{
|
|
34524
|
-
icon: AlignLeft,
|
|
34525
|
-
label: t("tableMenu.alignLeft"),
|
|
34526
|
-
onClick: () => applyTableAlignment(editor, "left", tableCommandAnchorPos),
|
|
34527
|
-
active: hasTableContext && currentTableAlign === "left",
|
|
34528
|
-
disabled: !hasTableContext
|
|
34529
|
-
}
|
|
34530
|
-
),
|
|
34531
|
-
/* @__PURE__ */ jsx93(
|
|
34532
|
-
DropdownMenuItem,
|
|
34533
|
-
{
|
|
34534
|
-
icon: AlignCenter,
|
|
34535
|
-
label: t("tableMenu.alignCenter"),
|
|
34536
|
-
onClick: () => applyTableAlignment(editor, "center", tableCommandAnchorPos),
|
|
34537
|
-
active: hasTableContext && currentTableAlign === "center",
|
|
34538
|
-
disabled: !hasTableContext
|
|
34539
|
-
}
|
|
34540
|
-
),
|
|
34541
|
-
/* @__PURE__ */ jsx93(
|
|
34542
|
-
DropdownMenuItem,
|
|
34543
|
-
{
|
|
34544
|
-
icon: AlignRight,
|
|
34545
|
-
label: t("tableMenu.alignRight"),
|
|
34546
|
-
onClick: () => applyTableAlignment(editor, "right", tableCommandAnchorPos),
|
|
34547
|
-
active: hasTableContext && currentTableAlign === "right",
|
|
34548
|
-
disabled: !hasTableContext
|
|
34549
|
-
}
|
|
34550
|
-
),
|
|
34551
|
-
/* @__PURE__ */ jsx93("div", { className: "my-1 border-t" }),
|
|
34552
|
-
/* @__PURE__ */ jsx93(
|
|
34553
|
-
DropdownMenuItem,
|
|
34554
|
-
{
|
|
34555
|
-
icon: ArrowLeft,
|
|
34556
|
-
label: t("tableMenu.addColumnBefore"),
|
|
34557
|
-
onClick: () => editor.chain().focus().addColumnBefore().run(),
|
|
34558
|
-
disabled: !hasTableContext || !editor.can().addColumnBefore()
|
|
34559
|
-
}
|
|
34560
|
-
),
|
|
34561
|
-
/* @__PURE__ */ jsx93(
|
|
34562
|
-
DropdownMenuItem,
|
|
34563
|
-
{
|
|
34564
|
-
icon: ArrowDown,
|
|
34565
|
-
label: t("tableMenu.addColumnAfter"),
|
|
34566
|
-
onClick: () => editor.chain().focus().addColumnAfter().run(),
|
|
34567
|
-
disabled: !hasTableContext || !editor.can().addColumnAfter()
|
|
34568
|
-
}
|
|
34569
|
-
),
|
|
34570
|
-
/* @__PURE__ */ jsx93(
|
|
34571
|
-
DropdownMenuItem,
|
|
34572
|
-
{
|
|
34573
|
-
icon: ArrowUp,
|
|
34574
|
-
label: t("tableMenu.addRowBefore"),
|
|
34575
|
-
onClick: () => editor.chain().focus().addRowBefore().run(),
|
|
34576
|
-
disabled: !hasTableContext || !editor.can().addRowBefore()
|
|
34577
|
-
}
|
|
34578
|
-
),
|
|
34579
|
-
/* @__PURE__ */ jsx93(
|
|
34580
|
-
DropdownMenuItem,
|
|
34581
|
-
{
|
|
34582
|
-
icon: ArrowRight,
|
|
34583
|
-
label: t("tableMenu.addRowAfter"),
|
|
34584
|
-
onClick: () => editor.chain().focus().addRowAfter().run(),
|
|
34585
|
-
disabled: !hasTableContext || !editor.can().addRowAfter()
|
|
34586
|
-
}
|
|
34587
|
-
),
|
|
34588
|
-
/* @__PURE__ */ jsx93("div", { className: "my-1 border-t" }),
|
|
34589
|
-
/* @__PURE__ */ jsx93(
|
|
34590
|
-
DropdownMenuItem,
|
|
34591
|
-
{
|
|
34592
|
-
icon: TableIcon,
|
|
34593
|
-
label: t("tableMenu.toggleHeaderRow"),
|
|
34594
|
-
onClick: () => editor.chain().focus().toggleHeaderRow().run(),
|
|
34595
|
-
disabled: !hasTableContext || !editor.can().toggleHeaderRow()
|
|
34596
|
-
}
|
|
34597
|
-
),
|
|
34598
|
-
/* @__PURE__ */ jsx93(
|
|
34599
|
-
DropdownMenuItem,
|
|
34600
|
-
{
|
|
34601
|
-
icon: TableIcon,
|
|
34602
|
-
label: t("tableMenu.toggleHeaderColumn"),
|
|
34603
|
-
onClick: () => editor.chain().focus().toggleHeaderColumn().run(),
|
|
34604
|
-
disabled: !hasTableContext || !editor.can().toggleHeaderColumn()
|
|
34605
|
-
}
|
|
34606
|
-
),
|
|
34607
|
-
/* @__PURE__ */ jsx93("div", { className: "my-1 border-t" }),
|
|
34608
|
-
/* @__PURE__ */ jsx93(
|
|
34609
|
-
DropdownMenuItem,
|
|
34610
|
-
{
|
|
34611
|
-
icon: Trash22,
|
|
34612
|
-
label: t("tableMenu.deleteColumn"),
|
|
34613
|
-
onClick: () => editor.chain().focus().deleteColumn().run(),
|
|
34614
|
-
disabled: !hasTableContext || !editor.can().deleteColumn()
|
|
34615
|
-
}
|
|
34616
|
-
),
|
|
34617
|
-
/* @__PURE__ */ jsx93(
|
|
34618
|
-
DropdownMenuItem,
|
|
34619
|
-
{
|
|
34620
|
-
icon: Trash22,
|
|
34621
|
-
label: t("tableMenu.deleteRow"),
|
|
34622
|
-
onClick: () => editor.chain().focus().deleteRow().run(),
|
|
34623
|
-
disabled: !hasTableContext || !editor.can().deleteRow()
|
|
34624
|
-
}
|
|
34625
|
-
),
|
|
34626
|
-
/* @__PURE__ */ jsx93(
|
|
34627
|
-
DropdownMenuItem,
|
|
34628
|
-
{
|
|
34629
|
-
icon: Trash22,
|
|
34630
|
-
label: t("tableMenu.deleteTable"),
|
|
34631
|
-
onClick: () => editor.chain().focus().deleteTable().run(),
|
|
34632
|
-
disabled: !hasTableContext || !editor.can().deleteTable()
|
|
34524
|
+
children: /* @__PURE__ */ jsx93(
|
|
34525
|
+
TableInsertGrid,
|
|
34526
|
+
{
|
|
34527
|
+
insertLabel: t("tableMenu.insertTable"),
|
|
34528
|
+
previewTemplate: t("tableMenu.gridPreview"),
|
|
34529
|
+
onInsert: (rows, cols) => {
|
|
34530
|
+
editor.chain().focus().insertTable({ rows, cols, withHeaderRow: true }).run();
|
|
34531
|
+
setIsTableMenuOpen(false);
|
|
34633
34532
|
}
|
|
34634
|
-
|
|
34635
|
-
|
|
34533
|
+
}
|
|
34534
|
+
)
|
|
34636
34535
|
}
|
|
34637
34536
|
),
|
|
34638
34537
|
/* @__PURE__ */ jsx93(ToolbarDivider, {}),
|
|
@@ -34701,14 +34600,14 @@ var EditorToolbar = ({
|
|
|
34701
34600
|
// src/components/UEditor/menus.tsx
|
|
34702
34601
|
import { useCallback as useCallback23, useEffect as useEffect38, useMemo as useMemo25, useRef as useRef35, useState as useState51 } from "react";
|
|
34703
34602
|
import { useEditorState as useEditorState2 } from "@tiptap/react";
|
|
34704
|
-
import { isInTable as isSelectionInTable, setCellAttr as setCellAttr3 } from "@tiptap/pm/tables";
|
|
34603
|
+
import { CellSelection, isInTable as isSelectionInTable, setCellAttr as setCellAttr3 } from "@tiptap/pm/tables";
|
|
34705
34604
|
import { createPortal as createPortal8 } from "react-dom";
|
|
34706
34605
|
import {
|
|
34707
34606
|
AlignCenter as AlignCenter2,
|
|
34708
34607
|
AlignLeft as AlignLeft2,
|
|
34709
34608
|
AlignRight as AlignRight2,
|
|
34710
34609
|
Bold as BoldIcon,
|
|
34711
|
-
ChevronDown as
|
|
34610
|
+
ChevronDown as ChevronDown8,
|
|
34712
34611
|
Code as CodeIcon,
|
|
34713
34612
|
Italic as ItalicIcon,
|
|
34714
34613
|
Link as LinkIcon2,
|
|
@@ -35803,7 +35702,7 @@ function recalculateAllTableFormulas(editor) {
|
|
|
35803
35702
|
}
|
|
35804
35703
|
|
|
35805
35704
|
// src/components/UEditor/menus.tsx
|
|
35806
|
-
import {
|
|
35705
|
+
import { jsx as jsx94, jsxs as jsxs76 } from "react/jsx-runtime";
|
|
35807
35706
|
var FloatingSlashCommandMenu = ({ editor, onClose }) => {
|
|
35808
35707
|
const t = useSmartTranslations("UEditor");
|
|
35809
35708
|
const messages = useMemo25(() => buildSlashCommandMessages(t), [t]);
|
|
@@ -35848,7 +35747,7 @@ var FloatingMenuContent = ({ editor }) => {
|
|
|
35848
35747
|
{
|
|
35849
35748
|
type: "button",
|
|
35850
35749
|
onClick: () => setShowCommands(true),
|
|
35851
|
-
className: "flex items-center gap-1 px-2 py-1.5
|
|
35750
|
+
className: "group flex items-center gap-1 rounded-lg px-2 py-1.5 transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30",
|
|
35852
35751
|
children: [
|
|
35853
35752
|
/* @__PURE__ */ jsx94(Plus3, { className: "w-4 h-4 text-muted-foreground group-hover:text-foreground" }),
|
|
35854
35753
|
/* @__PURE__ */ jsx94("span", { className: "text-sm text-muted-foreground group-hover:text-foreground", children: t("floatingMenu.addBlock") })
|
|
@@ -35922,15 +35821,23 @@ function BorderPositionPreviewIcon({ position }) {
|
|
|
35922
35821
|
showVertical && /* @__PURE__ */ jsx94("path", { d: "M10 2V18", strokeWidth: "2" })
|
|
35923
35822
|
] });
|
|
35924
35823
|
}
|
|
35824
|
+
function getBubbleMenuContext(editor) {
|
|
35825
|
+
const { selection } = editor.state;
|
|
35826
|
+
if (editor.isActive("image")) return "image";
|
|
35827
|
+
if (selection instanceof CellSelection) return "table-cell";
|
|
35828
|
+
if (editor.isActive("link")) return "link";
|
|
35829
|
+
if (!selection.empty) return "text";
|
|
35830
|
+
return "none";
|
|
35831
|
+
}
|
|
35925
35832
|
var BubbleMenuContent = ({
|
|
35926
35833
|
editor,
|
|
35834
|
+
context,
|
|
35927
35835
|
onKeepOpenChange,
|
|
35928
35836
|
onLinkInputOpenChange,
|
|
35929
35837
|
onRequestClose,
|
|
35930
35838
|
fontSizes,
|
|
35931
35839
|
lineHeights,
|
|
35932
|
-
initialShowLinkInput = false
|
|
35933
|
-
cellBorderOpenRequest = 0
|
|
35840
|
+
initialShowLinkInput = false
|
|
35934
35841
|
}) => {
|
|
35935
35842
|
const t = useSmartTranslations("UEditor");
|
|
35936
35843
|
useEditorState2({
|
|
@@ -35943,17 +35850,13 @@ var BubbleMenuContent = ({
|
|
|
35943
35850
|
useEffect38(() => {
|
|
35944
35851
|
setShowLinkInput(initialShowLinkInput);
|
|
35945
35852
|
}, [initialShowLinkInput]);
|
|
35946
|
-
useEffect38(() => {
|
|
35947
|
-
if (!cellBorderOpenRequest) return;
|
|
35948
|
-
setActiveColorPalette("cell-border");
|
|
35949
|
-
onKeepOpenChange?.(true);
|
|
35950
|
-
}, [cellBorderOpenRequest, onKeepOpenChange]);
|
|
35951
35853
|
const [showTypographyPanel, setShowTypographyPanel] = useState51(false);
|
|
35952
35854
|
const [showFormulaPanel, setShowFormulaPanel] = useState51(false);
|
|
35953
35855
|
const [formulaDraft, setFormulaDraft] = useState51("");
|
|
35954
35856
|
const [showFontSizeOptions, setShowFontSizeOptions] = useState51(false);
|
|
35955
35857
|
const [fontSizeDraft, setFontSizeDraft] = useState51("");
|
|
35956
|
-
const isImageSelected =
|
|
35858
|
+
const isImageSelected = context === "image";
|
|
35859
|
+
const isTableCellSelection = context === "table-cell";
|
|
35957
35860
|
const imageAttrs = editor.getAttributes("image");
|
|
35958
35861
|
const imageLayout = imageAttrs.imageLayout === "left" || imageAttrs.imageLayout === "right" ? imageAttrs.imageLayout : "block";
|
|
35959
35862
|
const imageWidthPreset = imageAttrs.imageWidthPreset === "sm" || imageAttrs.imageWidthPreset === "md" || imageAttrs.imageWidthPreset === "lg" ? imageAttrs.imageWidthPreset : null;
|
|
@@ -36016,12 +35919,10 @@ var BubbleMenuContent = ({
|
|
|
36016
35919
|
setFontSizeDraft(String(clamped));
|
|
36017
35920
|
};
|
|
36018
35921
|
useEffect38(() => {
|
|
36019
|
-
|
|
35922
|
+
const shouldKeepOpen = showLinkInput || Boolean(activeColorPalette) || showFormulaPanel || showTypographyPanel;
|
|
35923
|
+
onKeepOpenChange?.(shouldKeepOpen);
|
|
36020
35924
|
onLinkInputOpenChange?.(showLinkInput);
|
|
36021
|
-
}, [onKeepOpenChange, onLinkInputOpenChange, showLinkInput]);
|
|
36022
|
-
useEffect38(() => {
|
|
36023
|
-
onKeepOpenChange?.(Boolean(activeColorPalette));
|
|
36024
|
-
}, [activeColorPalette, onKeepOpenChange]);
|
|
35925
|
+
}, [activeColorPalette, onKeepOpenChange, onLinkInputOpenChange, showFormulaPanel, showLinkInput, showTypographyPanel]);
|
|
36025
35926
|
const closeTransientPanels = useCallback23(() => {
|
|
36026
35927
|
setActiveColorPalette(null);
|
|
36027
35928
|
setShowLinkInput(false);
|
|
@@ -36476,7 +36377,7 @@ var BubbleMenuContent = ({
|
|
|
36476
36377
|
"flex h-full w-9 items-center justify-center border-l border-border/50 transition-colors hover:bg-muted",
|
|
36477
36378
|
showFontSizeOptions && "bg-primary/10 text-primary"
|
|
36478
36379
|
),
|
|
36479
|
-
children: /* @__PURE__ */ jsx94(
|
|
36380
|
+
children: /* @__PURE__ */ jsx94(ChevronDown8, { className: "h-4 w-4" })
|
|
36480
36381
|
}
|
|
36481
36382
|
)
|
|
36482
36383
|
] }),
|
|
@@ -36580,38 +36481,8 @@ var BubbleMenuContent = ({
|
|
|
36580
36481
|
] });
|
|
36581
36482
|
}
|
|
36582
36483
|
const VerticalAlignActiveIcon = currentCellVerticalAlign === "middle" ? AlignCenterVertical2 : currentCellVerticalAlign === "bottom" ? AlignEndVertical2 : AlignStartVertical2;
|
|
36583
|
-
|
|
36584
|
-
/* @__PURE__ */
|
|
36585
|
-
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleItalic().run(), active: editor.isActive("italic"), title: t("toolbar.italic"), children: /* @__PURE__ */ jsx94(ItalicIcon, { className: "w-4 h-4" }) }),
|
|
36586
|
-
/* @__PURE__ */ jsx94(
|
|
36587
|
-
ToolbarButton,
|
|
36588
|
-
{
|
|
36589
|
-
onClick: () => editor.chain().focus().toggleUnderline().run(),
|
|
36590
|
-
active: editor.isActive("underline"),
|
|
36591
|
-
title: t("toolbar.underline"),
|
|
36592
|
-
children: /* @__PURE__ */ jsx94(UnderlineIcon, { className: "w-4 h-4" })
|
|
36593
|
-
}
|
|
36594
|
-
),
|
|
36595
|
-
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleStrike().run(), active: editor.isActive("strike"), title: t("toolbar.strike"), children: /* @__PURE__ */ jsx94(StrikethroughIcon, { className: "w-4 h-4" }) }),
|
|
36596
|
-
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleCode().run(), active: editor.isActive("code"), title: t("toolbar.code"), children: /* @__PURE__ */ jsx94(CodeIcon, { className: "w-4 h-4" }) }),
|
|
36597
|
-
/* @__PURE__ */ jsx94("div", { className: "w-px h-6 bg-border/50 mx-1" }),
|
|
36598
|
-
/* @__PURE__ */ jsx94(
|
|
36599
|
-
ToolbarButton,
|
|
36600
|
-
{
|
|
36601
|
-
onMouseDown: () => {
|
|
36602
|
-
onKeepOpenChange?.(true);
|
|
36603
|
-
},
|
|
36604
|
-
onClick: () => {
|
|
36605
|
-
setShowLinkInput(true);
|
|
36606
|
-
},
|
|
36607
|
-
active: editor.isActive("link"),
|
|
36608
|
-
title: t("toolbar.link"),
|
|
36609
|
-
children: /* @__PURE__ */ jsx94(LinkIcon2, { className: "w-4 h-4" })
|
|
36610
|
-
}
|
|
36611
|
-
),
|
|
36612
|
-
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => setActiveColorPalette("text"), title: t("colors.textColor"), children: /* @__PURE__ */ jsx94(TextColorIcon, { color: currentTextColor }) }),
|
|
36613
|
-
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => setActiveColorPalette("highlight"), active: editor.isActive("highlight"), title: t("colors.highlight"), children: /* @__PURE__ */ jsx94(HighlightColorIcon, { color: currentHighlightColor }) }),
|
|
36614
|
-
isInTable2 && /* @__PURE__ */ jsxs76(Fragment30, { children: [
|
|
36484
|
+
if (isTableCellSelection) {
|
|
36485
|
+
return /* @__PURE__ */ jsxs76("div", { className: "flex items-center gap-0.5 p-1", "data-ueditor-cell-inspector": "", children: [
|
|
36615
36486
|
/* @__PURE__ */ jsx94(
|
|
36616
36487
|
ToolbarButton,
|
|
36617
36488
|
{
|
|
@@ -36624,9 +36495,7 @@ var BubbleMenuContent = ({
|
|
|
36624
36495
|
/* @__PURE__ */ jsx94(
|
|
36625
36496
|
ToolbarButton,
|
|
36626
36497
|
{
|
|
36627
|
-
onMouseDown: () =>
|
|
36628
|
-
onKeepOpenChange?.(true);
|
|
36629
|
-
},
|
|
36498
|
+
onMouseDown: () => onKeepOpenChange?.(true),
|
|
36630
36499
|
onClick: () => setActiveColorPalette("cell-border"),
|
|
36631
36500
|
active: Boolean(
|
|
36632
36501
|
editor.getAttributes("tableCell").borderColor || editor.getAttributes("tableHeader").borderColor || editor.getAttributes("tableCell").borderStyle || editor.getAttributes("tableHeader").borderStyle || editor.getAttributes("tableCell").borderWidth || editor.getAttributes("tableHeader").borderWidth
|
|
@@ -36643,9 +36512,7 @@ var BubbleMenuContent = ({
|
|
|
36643
36512
|
/* @__PURE__ */ jsx94(
|
|
36644
36513
|
ToolbarButton,
|
|
36645
36514
|
{
|
|
36646
|
-
onMouseDown: () =>
|
|
36647
|
-
onKeepOpenChange?.(true);
|
|
36648
|
-
},
|
|
36515
|
+
onMouseDown: () => onKeepOpenChange?.(true),
|
|
36649
36516
|
onClick: () => {
|
|
36650
36517
|
setFormulaDraft(currentCellFormula);
|
|
36651
36518
|
setShowFormulaPanel(true);
|
|
@@ -36674,21 +36541,17 @@ var BubbleMenuContent = ({
|
|
|
36674
36541
|
/* @__PURE__ */ jsxs76(
|
|
36675
36542
|
DropdownMenu,
|
|
36676
36543
|
{
|
|
36677
|
-
onOpenChange:
|
|
36678
|
-
onKeepOpenChange?.(open);
|
|
36679
|
-
},
|
|
36544
|
+
onOpenChange: onKeepOpenChange,
|
|
36680
36545
|
trigger: /* @__PURE__ */ jsxs76(
|
|
36681
36546
|
ToolbarButton,
|
|
36682
36547
|
{
|
|
36683
|
-
onMouseDown: () =>
|
|
36684
|
-
onKeepOpenChange?.(true);
|
|
36685
|
-
},
|
|
36548
|
+
onMouseDown: () => onKeepOpenChange?.(true),
|
|
36686
36549
|
onClick: () => {
|
|
36687
36550
|
},
|
|
36688
36551
|
title: t("tableMenu.alignVertical") || "Vertical alignment",
|
|
36689
36552
|
children: [
|
|
36690
36553
|
/* @__PURE__ */ jsx94(VerticalAlignActiveIcon, { className: "w-4 h-4" }),
|
|
36691
|
-
/* @__PURE__ */ jsx94(
|
|
36554
|
+
/* @__PURE__ */ jsx94(ChevronDown8, { className: "w-3 h-3" })
|
|
36692
36555
|
]
|
|
36693
36556
|
}
|
|
36694
36557
|
),
|
|
@@ -36726,21 +36589,17 @@ var BubbleMenuContent = ({
|
|
|
36726
36589
|
/* @__PURE__ */ jsxs76(
|
|
36727
36590
|
DropdownMenu,
|
|
36728
36591
|
{
|
|
36729
|
-
onOpenChange:
|
|
36730
|
-
onKeepOpenChange?.(open);
|
|
36731
|
-
},
|
|
36592
|
+
onOpenChange: onKeepOpenChange,
|
|
36732
36593
|
trigger: /* @__PURE__ */ jsxs76(
|
|
36733
36594
|
ToolbarButton,
|
|
36734
36595
|
{
|
|
36735
|
-
onMouseDown: () =>
|
|
36736
|
-
onKeepOpenChange?.(true);
|
|
36737
|
-
},
|
|
36596
|
+
onMouseDown: () => onKeepOpenChange?.(true),
|
|
36738
36597
|
onClick: () => {
|
|
36739
36598
|
},
|
|
36740
36599
|
title: t("tableMenu.textDirection"),
|
|
36741
36600
|
children: [
|
|
36742
36601
|
currentCellTextDirection === "vertical" ? /* @__PURE__ */ jsx94(ArrowDown2, { className: "w-4 h-4" }) : /* @__PURE__ */ jsx94(ArrowRight2, { className: "w-4 h-4" }),
|
|
36743
|
-
/* @__PURE__ */ jsx94(
|
|
36602
|
+
/* @__PURE__ */ jsx94(ChevronDown8, { className: "w-3 h-3" })
|
|
36744
36603
|
]
|
|
36745
36604
|
}
|
|
36746
36605
|
),
|
|
@@ -36766,7 +36625,39 @@ var BubbleMenuContent = ({
|
|
|
36766
36625
|
]
|
|
36767
36626
|
}
|
|
36768
36627
|
)
|
|
36769
|
-
] })
|
|
36628
|
+
] });
|
|
36629
|
+
}
|
|
36630
|
+
return /* @__PURE__ */ jsxs76("div", { className: "flex items-center gap-0.5 p-1", children: [
|
|
36631
|
+
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleBold().run(), active: editor.isActive("bold"), title: t("toolbar.bold"), children: /* @__PURE__ */ jsx94(BoldIcon, { className: "w-4 h-4" }) }),
|
|
36632
|
+
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleItalic().run(), active: editor.isActive("italic"), title: t("toolbar.italic"), children: /* @__PURE__ */ jsx94(ItalicIcon, { className: "w-4 h-4" }) }),
|
|
36633
|
+
/* @__PURE__ */ jsx94(
|
|
36634
|
+
ToolbarButton,
|
|
36635
|
+
{
|
|
36636
|
+
onClick: () => editor.chain().focus().toggleUnderline().run(),
|
|
36637
|
+
active: editor.isActive("underline"),
|
|
36638
|
+
title: t("toolbar.underline"),
|
|
36639
|
+
children: /* @__PURE__ */ jsx94(UnderlineIcon, { className: "w-4 h-4" })
|
|
36640
|
+
}
|
|
36641
|
+
),
|
|
36642
|
+
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleStrike().run(), active: editor.isActive("strike"), title: t("toolbar.strike"), children: /* @__PURE__ */ jsx94(StrikethroughIcon, { className: "w-4 h-4" }) }),
|
|
36643
|
+
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => editor.chain().focus().toggleCode().run(), active: editor.isActive("code"), title: t("toolbar.code"), children: /* @__PURE__ */ jsx94(CodeIcon, { className: "w-4 h-4" }) }),
|
|
36644
|
+
/* @__PURE__ */ jsx94("div", { className: "w-px h-6 bg-border/50 mx-1" }),
|
|
36645
|
+
/* @__PURE__ */ jsx94(
|
|
36646
|
+
ToolbarButton,
|
|
36647
|
+
{
|
|
36648
|
+
onMouseDown: () => {
|
|
36649
|
+
onKeepOpenChange?.(true);
|
|
36650
|
+
},
|
|
36651
|
+
onClick: () => {
|
|
36652
|
+
setShowLinkInput(true);
|
|
36653
|
+
},
|
|
36654
|
+
active: editor.isActive("link"),
|
|
36655
|
+
title: t("toolbar.link"),
|
|
36656
|
+
children: /* @__PURE__ */ jsx94(LinkIcon2, { className: "w-4 h-4" })
|
|
36657
|
+
}
|
|
36658
|
+
),
|
|
36659
|
+
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => setActiveColorPalette("text"), title: t("colors.textColor"), children: /* @__PURE__ */ jsx94(TextColorIcon, { color: currentTextColor }) }),
|
|
36660
|
+
/* @__PURE__ */ jsx94(ToolbarButton, { onClick: () => setActiveColorPalette("highlight"), active: editor.isActive("highlight"), title: t("colors.highlight"), children: /* @__PURE__ */ jsx94(HighlightColorIcon, { color: currentHighlightColor }) }),
|
|
36770
36661
|
/* @__PURE__ */ jsx94(
|
|
36771
36662
|
ToolbarButton,
|
|
36772
36663
|
{
|
|
@@ -36806,7 +36697,6 @@ var CustomBubbleMenu = ({
|
|
|
36806
36697
|
const BUBBLE_MENU_ESTIMATED_HEIGHT = 44;
|
|
36807
36698
|
const [isVisible, setIsVisible] = useState51(false);
|
|
36808
36699
|
const [linkInputOpen, setLinkInputOpen] = useState51(false);
|
|
36809
|
-
const [cellBorderOpenRequest, setCellBorderOpenRequest] = useState51(0);
|
|
36810
36700
|
const [position, setPosition2] = useState51({
|
|
36811
36701
|
top: 0,
|
|
36812
36702
|
left: 0,
|
|
@@ -36843,14 +36733,14 @@ var CustomBubbleMenu = ({
|
|
|
36843
36733
|
};
|
|
36844
36734
|
const updatePosition = () => {
|
|
36845
36735
|
const { state, view } = editor;
|
|
36846
|
-
const { from, to
|
|
36847
|
-
const
|
|
36736
|
+
const { from, to } = state.selection;
|
|
36737
|
+
const context2 = getBubbleMenuContext(editor);
|
|
36848
36738
|
if (Date.now() < suppressShowUntilRef.current) {
|
|
36849
36739
|
clearShowTimeout();
|
|
36850
36740
|
setIsVisible(false);
|
|
36851
36741
|
return;
|
|
36852
36742
|
}
|
|
36853
|
-
if (!keepOpenRef.current && (
|
|
36743
|
+
if (!keepOpenRef.current && (context2 === "none" || !view.hasFocus())) {
|
|
36854
36744
|
clearShowTimeout();
|
|
36855
36745
|
setIsVisible(false);
|
|
36856
36746
|
return;
|
|
@@ -36921,8 +36811,6 @@ var CustomBubbleMenu = ({
|
|
|
36921
36811
|
const handlePointerDown = (event) => {
|
|
36922
36812
|
const target = event.target;
|
|
36923
36813
|
if (target && (menuRef.current?.contains(target) || target.closest("[data-ueditor-keep-open]"))) return;
|
|
36924
|
-
const table = target?.closest("table");
|
|
36925
|
-
if (table && editor.view.dom.contains(table)) return;
|
|
36926
36814
|
closeBubbleMenu(false);
|
|
36927
36815
|
};
|
|
36928
36816
|
const handleKeyDown2 = (event) => {
|
|
@@ -36935,23 +36823,9 @@ var CustomBubbleMenu = ({
|
|
|
36935
36823
|
document.removeEventListener("keydown", handleKeyDown2);
|
|
36936
36824
|
};
|
|
36937
36825
|
}, [closeBubbleMenu, editor, isVisible]);
|
|
36938
|
-
useEffect38(() => {
|
|
36939
|
-
const handleTableDoubleClick = (event) => {
|
|
36940
|
-
const target = event.target;
|
|
36941
|
-
const cell = target?.closest("td,th");
|
|
36942
|
-
if (!cell || !editor.view.dom.contains(cell)) return;
|
|
36943
|
-
suppressShowUntilRef.current = 0;
|
|
36944
|
-
keepOpenRef.current = true;
|
|
36945
|
-
setKeepOpenState(true);
|
|
36946
|
-
setLinkInputOpen(false);
|
|
36947
|
-
setCellBorderOpenRequest((request) => request + 1);
|
|
36948
|
-
setIsVisible(true);
|
|
36949
|
-
requestAnimationFrame(() => editor.view.focus());
|
|
36950
|
-
};
|
|
36951
|
-
editor.view.dom.addEventListener("dblclick", handleTableDoubleClick);
|
|
36952
|
-
return () => editor.view.dom.removeEventListener("dblclick", handleTableDoubleClick);
|
|
36953
|
-
}, [editor]);
|
|
36954
36826
|
if (!isVisible) return null;
|
|
36827
|
+
const context = getBubbleMenuContext(editor);
|
|
36828
|
+
if (context === "none") return null;
|
|
36955
36829
|
return createPortal8(
|
|
36956
36830
|
/* @__PURE__ */ jsx94(
|
|
36957
36831
|
"div",
|
|
@@ -36973,7 +36847,7 @@ var CustomBubbleMenu = ({
|
|
|
36973
36847
|
}
|
|
36974
36848
|
e.preventDefault();
|
|
36975
36849
|
},
|
|
36976
|
-
children:
|
|
36850
|
+
children: context === "link" && !keepOpen && !linkInputOpen ? /* @__PURE__ */ jsx94(
|
|
36977
36851
|
LinkPreviewContent,
|
|
36978
36852
|
{
|
|
36979
36853
|
editor,
|
|
@@ -36986,14 +36860,15 @@ var CustomBubbleMenu = ({
|
|
|
36986
36860
|
BubbleMenuContent,
|
|
36987
36861
|
{
|
|
36988
36862
|
editor,
|
|
36863
|
+
context,
|
|
36989
36864
|
onKeepOpenChange: setKeepOpen,
|
|
36990
36865
|
onLinkInputOpenChange: setLinkInputOpen,
|
|
36991
36866
|
onRequestClose: closeBubbleMenu,
|
|
36992
36867
|
fontSizes,
|
|
36993
36868
|
lineHeights,
|
|
36994
|
-
initialShowLinkInput: linkInputOpen
|
|
36995
|
-
|
|
36996
|
-
|
|
36869
|
+
initialShowLinkInput: linkInputOpen
|
|
36870
|
+
},
|
|
36871
|
+
context
|
|
36997
36872
|
)
|
|
36998
36873
|
}
|
|
36999
36874
|
),
|
|
@@ -37546,7 +37421,7 @@ function findDiffEnd(a, b, posA, posB) {
|
|
|
37546
37421
|
posB -= size;
|
|
37547
37422
|
}
|
|
37548
37423
|
}
|
|
37549
|
-
var
|
|
37424
|
+
var Fragment30 = class _Fragment {
|
|
37550
37425
|
/**
|
|
37551
37426
|
@internal
|
|
37552
37427
|
*/
|
|
@@ -37838,7 +37713,7 @@ var Fragment31 = class _Fragment {
|
|
|
37838
37713
|
throw new RangeError("Can not convert " + nodes + " to a Fragment" + (nodes.nodesBetween ? " (looks like multiple versions of prosemirror-model were loaded)" : ""));
|
|
37839
37714
|
}
|
|
37840
37715
|
};
|
|
37841
|
-
|
|
37716
|
+
Fragment30.empty = new Fragment30([], 0);
|
|
37842
37717
|
var found = { index: 0, offset: 0 };
|
|
37843
37718
|
function retIndex(index, offset) {
|
|
37844
37719
|
found.index = index;
|
|
@@ -38063,7 +37938,7 @@ var Slice = class _Slice {
|
|
|
38063
37938
|
let openStart = json.openStart || 0, openEnd = json.openEnd || 0;
|
|
38064
37939
|
if (typeof openStart != "number" || typeof openEnd != "number")
|
|
38065
37940
|
throw new RangeError("Invalid input for Slice.fromJSON");
|
|
38066
|
-
return new _Slice(
|
|
37941
|
+
return new _Slice(Fragment30.fromJSON(schema, json.content), openStart, openEnd);
|
|
38067
37942
|
}
|
|
38068
37943
|
/**
|
|
38069
37944
|
Create a slice from a fragment by taking the maximum possible
|
|
@@ -38078,7 +37953,7 @@ var Slice = class _Slice {
|
|
|
38078
37953
|
return new _Slice(fragment, openStart, openEnd);
|
|
38079
37954
|
}
|
|
38080
37955
|
};
|
|
38081
|
-
Slice.empty = new Slice(
|
|
37956
|
+
Slice.empty = new Slice(Fragment30.empty, 0, 0);
|
|
38082
37957
|
function removeRange(content, from, to) {
|
|
38083
37958
|
let { index, offset } = content.findIndex(from), child = content.maybeChild(index);
|
|
38084
37959
|
let { index: indexTo, offset: offsetTo } = content.findIndex(to);
|
|
@@ -38176,7 +38051,7 @@ function replaceThreeWay($from, $start, $end, $to, depth) {
|
|
|
38176
38051
|
addNode(close(openEnd, replaceTwoWay($end, $to, depth + 1)), content);
|
|
38177
38052
|
}
|
|
38178
38053
|
addRange($to, null, depth, content);
|
|
38179
|
-
return new
|
|
38054
|
+
return new Fragment30(content);
|
|
38180
38055
|
}
|
|
38181
38056
|
function replaceTwoWay($from, $to, depth) {
|
|
38182
38057
|
let content = [];
|
|
@@ -38186,13 +38061,13 @@ function replaceTwoWay($from, $to, depth) {
|
|
|
38186
38061
|
addNode(close(type, replaceTwoWay($from, $to, depth + 1)), content);
|
|
38187
38062
|
}
|
|
38188
38063
|
addRange($to, null, depth, content);
|
|
38189
|
-
return new
|
|
38064
|
+
return new Fragment30(content);
|
|
38190
38065
|
}
|
|
38191
38066
|
function prepareSliceForReplace(slice, $along) {
|
|
38192
38067
|
let extra = $along.depth - slice.openStart, parent = $along.node(extra);
|
|
38193
38068
|
let node = parent.copy(slice.content);
|
|
38194
38069
|
for (let i = extra - 1; i >= 0; i--)
|
|
38195
|
-
node = $along.node(i).copy(
|
|
38070
|
+
node = $along.node(i).copy(Fragment30.from(node));
|
|
38196
38071
|
return {
|
|
38197
38072
|
start: node.resolveNoCache(slice.openStart + extra),
|
|
38198
38073
|
end: node.resolveNoCache(node.content.size - slice.openEnd - extra)
|
|
@@ -38531,7 +38406,7 @@ var Node7 = class _Node {
|
|
|
38531
38406
|
this.type = type;
|
|
38532
38407
|
this.attrs = attrs;
|
|
38533
38408
|
this.marks = marks;
|
|
38534
|
-
this.content = content ||
|
|
38409
|
+
this.content = content || Fragment30.empty;
|
|
38535
38410
|
}
|
|
38536
38411
|
/**
|
|
38537
38412
|
The array of this node's child nodes.
|
|
@@ -38836,7 +38711,7 @@ var Node7 = class _Node {
|
|
|
38836
38711
|
can optionally pass `start` and `end` indices into the
|
|
38837
38712
|
replacement fragment.
|
|
38838
38713
|
*/
|
|
38839
|
-
canReplace(from, to, replacement =
|
|
38714
|
+
canReplace(from, to, replacement = Fragment30.empty, start = 0, end = replacement.childCount) {
|
|
38840
38715
|
let one = this.contentMatchAt(from).matchFragment(replacement, start, end);
|
|
38841
38716
|
let two = one && one.matchFragment(this.content, to);
|
|
38842
38717
|
if (!two || !two.validEnd)
|
|
@@ -38918,7 +38793,7 @@ var Node7 = class _Node {
|
|
|
38918
38793
|
throw new RangeError("Invalid text node in JSON");
|
|
38919
38794
|
return schema.text(json.text, marks);
|
|
38920
38795
|
}
|
|
38921
|
-
let content =
|
|
38796
|
+
let content = Fragment30.fromJSON(schema, json.content);
|
|
38922
38797
|
let node = schema.nodeType(json.type).create(json.attrs, content, marks);
|
|
38923
38798
|
node.type.checkAttrs(node.attrs);
|
|
38924
38799
|
return node;
|
|
@@ -39014,7 +38889,7 @@ var ContentMatch = class _ContentMatch {
|
|
|
39014
38889
|
function search(match, types) {
|
|
39015
38890
|
let finished = match.matchFragment(after, startIndex);
|
|
39016
38891
|
if (finished && (!toEnd || finished.validEnd))
|
|
39017
|
-
return
|
|
38892
|
+
return Fragment30.from(types.map((tp) => tp.createAndFill()));
|
|
39018
38893
|
for (let i = 0; i < match.next.length; i++) {
|
|
39019
38894
|
let { type, next } = match.next[i];
|
|
39020
38895
|
if (!(type.isText || type.hasRequiredAttrs()) && seen.indexOf(next) == -1) {
|
|
@@ -39582,7 +39457,7 @@ function mapFragment(fragment, f, parent) {
|
|
|
39582
39457
|
child = f(child, parent, i);
|
|
39583
39458
|
mapped.push(child);
|
|
39584
39459
|
}
|
|
39585
|
-
return
|
|
39460
|
+
return Fragment30.fromArray(mapped);
|
|
39586
39461
|
}
|
|
39587
39462
|
var AddMarkStep = class _AddMarkStep extends Step {
|
|
39588
39463
|
/**
|
|
@@ -39699,7 +39574,7 @@ var AddNodeMarkStep = class _AddNodeMarkStep extends Step {
|
|
|
39699
39574
|
if (!node)
|
|
39700
39575
|
return StepResult.fail("No node at mark step's position");
|
|
39701
39576
|
let updated = node.type.create(node.attrs, null, this.mark.addToSet(node.marks));
|
|
39702
|
-
return StepResult.fromReplace(doc, this.pos, this.pos + 1, new Slice(
|
|
39577
|
+
return StepResult.fromReplace(doc, this.pos, this.pos + 1, new Slice(Fragment30.from(updated), 0, node.isLeaf ? 0 : 1));
|
|
39703
39578
|
}
|
|
39704
39579
|
invert(doc) {
|
|
39705
39580
|
let node = doc.nodeAt(this.pos);
|
|
@@ -39745,7 +39620,7 @@ var RemoveNodeMarkStep = class _RemoveNodeMarkStep extends Step {
|
|
|
39745
39620
|
if (!node)
|
|
39746
39621
|
return StepResult.fail("No node at mark step's position");
|
|
39747
39622
|
let updated = node.type.create(node.attrs, null, this.mark.removeFromSet(node.marks));
|
|
39748
|
-
return StepResult.fromReplace(doc, this.pos, this.pos + 1, new Slice(
|
|
39623
|
+
return StepResult.fromReplace(doc, this.pos, this.pos + 1, new Slice(Fragment30.from(updated), 0, node.isLeaf ? 0 : 1));
|
|
39749
39624
|
}
|
|
39750
39625
|
invert(doc) {
|
|
39751
39626
|
let node = doc.nodeAt(this.pos);
|
|
@@ -39946,7 +39821,7 @@ var AttrStep = class _AttrStep extends Step {
|
|
|
39946
39821
|
attrs[name] = node.attrs[name];
|
|
39947
39822
|
attrs[this.attr] = this.value;
|
|
39948
39823
|
let updated = node.type.create(attrs, null, node.marks);
|
|
39949
|
-
return StepResult.fromReplace(doc, this.pos, this.pos + 1, new Slice(
|
|
39824
|
+
return StepResult.fromReplace(doc, this.pos, this.pos + 1, new Slice(Fragment30.from(updated), 0, node.isLeaf ? 0 : 1));
|
|
39950
39825
|
}
|
|
39951
39826
|
getMap() {
|
|
39952
39827
|
return StepMap.empty;
|
|
@@ -40330,7 +40205,7 @@ var NodeSelection2 = class _NodeSelection extends Selection {
|
|
|
40330
40205
|
return new _NodeSelection($pos);
|
|
40331
40206
|
}
|
|
40332
40207
|
content() {
|
|
40333
|
-
return new Slice(
|
|
40208
|
+
return new Slice(Fragment30.from(this.node), 0, 0);
|
|
40334
40209
|
}
|
|
40335
40210
|
eq(other) {
|
|
40336
40211
|
return other instanceof _NodeSelection && other.anchor == this.anchor;
|
|
@@ -40991,7 +40866,7 @@ function removeColSpan(attrs, pos, n = 1) {
|
|
|
40991
40866
|
}
|
|
40992
40867
|
return result;
|
|
40993
40868
|
}
|
|
40994
|
-
var
|
|
40869
|
+
var CellSelection2 = class CellSelection3 extends Selection {
|
|
40995
40870
|
constructor($anchorCell, $headCell = $anchorCell) {
|
|
40996
40871
|
const table = $anchorCell.node(-1);
|
|
40997
40872
|
const map = TableMap4.get(table);
|
|
@@ -41015,9 +40890,9 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41015
40890
|
const $headCell = doc.resolve(mapping.map(this.$headCell.pos));
|
|
41016
40891
|
if (pointsAtCell2($anchorCell) && pointsAtCell2($headCell) && inSameTable($anchorCell, $headCell)) {
|
|
41017
40892
|
const tableChanged = this.$anchorCell.node(-1) != $anchorCell.node(-1);
|
|
41018
|
-
if (tableChanged && this.isRowSelection()) return
|
|
41019
|
-
else if (tableChanged && this.isColSelection()) return
|
|
41020
|
-
else return new
|
|
40893
|
+
if (tableChanged && this.isRowSelection()) return CellSelection3.rowSelection($anchorCell, $headCell);
|
|
40894
|
+
else if (tableChanged && this.isColSelection()) return CellSelection3.colSelection($anchorCell, $headCell);
|
|
40895
|
+
else return new CellSelection3($anchorCell, $headCell);
|
|
41021
40896
|
}
|
|
41022
40897
|
return TextSelection5.between($anchorCell, $headCell);
|
|
41023
40898
|
}
|
|
@@ -41058,10 +40933,10 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41058
40933
|
}
|
|
41059
40934
|
rowContent.push(cell);
|
|
41060
40935
|
}
|
|
41061
|
-
rows.push(table.child(row).copy(
|
|
40936
|
+
rows.push(table.child(row).copy(Fragment30.from(rowContent)));
|
|
41062
40937
|
}
|
|
41063
40938
|
const fragment = this.isColSelection() && this.isRowSelection() ? table : rows;
|
|
41064
|
-
return new Slice(
|
|
40939
|
+
return new Slice(Fragment30.from(fragment), 1, 1);
|
|
41065
40940
|
}
|
|
41066
40941
|
replace(tr, content = Slice.empty) {
|
|
41067
40942
|
const mapFrom = tr.steps.length, ranges = this.ranges;
|
|
@@ -41073,7 +40948,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41073
40948
|
if (sel) tr.setSelection(sel);
|
|
41074
40949
|
}
|
|
41075
40950
|
replaceWith(tr, node) {
|
|
41076
|
-
this.replace(tr, new Slice(
|
|
40951
|
+
this.replace(tr, new Slice(Fragment30.from(node), 0, 0));
|
|
41077
40952
|
}
|
|
41078
40953
|
forEachCell(f) {
|
|
41079
40954
|
const table = this.$anchorCell.node(-1);
|
|
@@ -41104,7 +40979,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41104
40979
|
if (headRect.top > 0) $headCell = doc.resolve(tableStart + map.map[headRect.left]);
|
|
41105
40980
|
if (anchorRect.bottom < map.height) $anchorCell = doc.resolve(tableStart + map.map[map.width * (map.height - 1) + anchorRect.right - 1]);
|
|
41106
40981
|
}
|
|
41107
|
-
return new
|
|
40982
|
+
return new CellSelection3($anchorCell, $headCell);
|
|
41108
40983
|
}
|
|
41109
40984
|
isRowSelection() {
|
|
41110
40985
|
const table = this.$anchorCell.node(-1);
|
|
@@ -41118,7 +40993,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41118
40993
|
return Math.max(anchorRight, headRight) == map.width;
|
|
41119
40994
|
}
|
|
41120
40995
|
eq(other) {
|
|
41121
|
-
return other instanceof
|
|
40996
|
+
return other instanceof CellSelection3 && other.$anchorCell.pos == this.$anchorCell.pos && other.$headCell.pos == this.$headCell.pos;
|
|
41122
40997
|
}
|
|
41123
40998
|
static rowSelection($anchorCell, $headCell = $anchorCell) {
|
|
41124
40999
|
const table = $anchorCell.node(-1);
|
|
@@ -41134,7 +41009,7 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41134
41009
|
if (headRect.left > 0) $headCell = doc.resolve(tableStart + map.map[headRect.top * map.width]);
|
|
41135
41010
|
if (anchorRect.right < map.width) $anchorCell = doc.resolve(tableStart + map.map[map.width * (anchorRect.top + 1) - 1]);
|
|
41136
41011
|
}
|
|
41137
|
-
return new
|
|
41012
|
+
return new CellSelection3($anchorCell, $headCell);
|
|
41138
41013
|
}
|
|
41139
41014
|
toJSON() {
|
|
41140
41015
|
return {
|
|
@@ -41144,17 +41019,17 @@ var CellSelection = class CellSelection2 extends Selection {
|
|
|
41144
41019
|
};
|
|
41145
41020
|
}
|
|
41146
41021
|
static fromJSON(doc, json) {
|
|
41147
|
-
return new
|
|
41022
|
+
return new CellSelection3(doc.resolve(json.anchor), doc.resolve(json.head));
|
|
41148
41023
|
}
|
|
41149
41024
|
static create(doc, anchorCell, headCell = anchorCell) {
|
|
41150
|
-
return new
|
|
41025
|
+
return new CellSelection3(doc.resolve(anchorCell), doc.resolve(headCell));
|
|
41151
41026
|
}
|
|
41152
41027
|
getBookmark() {
|
|
41153
41028
|
return new CellBookmark(this.$anchorCell.pos, this.$headCell.pos);
|
|
41154
41029
|
}
|
|
41155
41030
|
};
|
|
41156
|
-
|
|
41157
|
-
Selection.jsonID("cell",
|
|
41031
|
+
CellSelection2.prototype.visible = false;
|
|
41032
|
+
Selection.jsonID("cell", CellSelection2);
|
|
41158
41033
|
var CellBookmark = class CellBookmark2 {
|
|
41159
41034
|
constructor(anchor, head) {
|
|
41160
41035
|
this.anchor = anchor;
|
|
@@ -41165,7 +41040,7 @@ var CellBookmark = class CellBookmark2 {
|
|
|
41165
41040
|
}
|
|
41166
41041
|
resolve(doc) {
|
|
41167
41042
|
const $anchorCell = doc.resolve(this.anchor), $headCell = doc.resolve(this.head);
|
|
41168
|
-
if ($anchorCell.parent.type.spec.tableRole == "row" && $headCell.parent.type.spec.tableRole == "row" && $anchorCell.index() < $anchorCell.parent.childCount && $headCell.index() < $headCell.parent.childCount && inSameTable($anchorCell, $headCell)) return new
|
|
41043
|
+
if ($anchorCell.parent.type.spec.tableRole == "row" && $headCell.parent.type.spec.tableRole == "row" && $anchorCell.index() < $anchorCell.parent.childCount && $headCell.index() < $headCell.parent.childCount && inSameTable($anchorCell, $headCell)) return new CellSelection2($anchorCell, $headCell);
|
|
41169
41044
|
else return Selection.near($headCell, 1);
|
|
41170
41045
|
}
|
|
41171
41046
|
};
|
|
@@ -41408,7 +41283,7 @@ function moveColumn(moveColParams) {
|
|
|
41408
41283
|
const $lastCell = tr.doc.resolve(start + lastCell);
|
|
41409
41284
|
const firstCell = map.positionAt(0, index, newTable);
|
|
41410
41285
|
const $firstCell = tr.doc.resolve(start + firstCell);
|
|
41411
|
-
tr.setSelection(
|
|
41286
|
+
tr.setSelection(CellSelection2.colSelection($lastCell, $firstCell));
|
|
41412
41287
|
return true;
|
|
41413
41288
|
}
|
|
41414
41289
|
function moveTableColumn$1(table, indexesOrigin, indexesTarget, direction) {
|
|
@@ -41436,7 +41311,7 @@ function moveRow(moveRowParams) {
|
|
|
41436
41311
|
const $lastCell = tr.doc.resolve(start + lastCell);
|
|
41437
41312
|
const firstCell = map.positionAt(index, 0, newTable);
|
|
41438
41313
|
const $firstCell = tr.doc.resolve(start + firstCell);
|
|
41439
|
-
tr.setSelection(
|
|
41314
|
+
tr.setSelection(CellSelection2.rowSelection($lastCell, $firstCell));
|
|
41440
41315
|
return true;
|
|
41441
41316
|
}
|
|
41442
41317
|
function moveTableRow$1(table, indexesOrigin, indexesTarget, direction) {
|
|
@@ -41451,7 +41326,7 @@ function selectedRect4(state) {
|
|
|
41451
41326
|
const tableStart = $pos.start(-1);
|
|
41452
41327
|
const map = TableMap4.get(table);
|
|
41453
41328
|
return {
|
|
41454
|
-
...sel instanceof
|
|
41329
|
+
...sel instanceof CellSelection2 ? map.rectBetween(sel.$anchorCell.pos - tableStart, sel.$headCell.pos - tableStart) : map.findCell($pos.pos - tableStart),
|
|
41455
41330
|
tableStart,
|
|
41456
41331
|
map,
|
|
41457
41332
|
table
|
|
@@ -41533,7 +41408,7 @@ var toggleHeaderColumn = toggleHeader("column", { useDeprecatedLogic: true });
|
|
|
41533
41408
|
var toggleHeaderCell = toggleHeader("cell", { useDeprecatedLogic: true });
|
|
41534
41409
|
function deleteCellSelection(state, dispatch) {
|
|
41535
41410
|
const sel = state.selection;
|
|
41536
|
-
if (!(sel instanceof
|
|
41411
|
+
if (!(sel instanceof CellSelection2)) return false;
|
|
41537
41412
|
if (dispatch) {
|
|
41538
41413
|
const tr = state.tr;
|
|
41539
41414
|
const baseContent = tableNodeTypes2(state.schema).cell.createAndFill().content;
|
|
@@ -41601,7 +41476,7 @@ function arrow(axis, dir) {
|
|
|
41601
41476
|
return (state, dispatch, view) => {
|
|
41602
41477
|
if (!view) return false;
|
|
41603
41478
|
const sel = state.selection;
|
|
41604
|
-
if (sel instanceof
|
|
41479
|
+
if (sel instanceof CellSelection2) return maybeSetSelection(state, dispatch, Selection.near(sel.$headCell, dir));
|
|
41605
41480
|
if (axis != "horiz" && !sel.empty) return false;
|
|
41606
41481
|
const end = atEndOfCell(view, axis, dir);
|
|
41607
41482
|
if (end == null) return false;
|
|
@@ -41622,15 +41497,15 @@ function shiftArrow(axis, dir) {
|
|
|
41622
41497
|
if (!view) return false;
|
|
41623
41498
|
const sel = state.selection;
|
|
41624
41499
|
let cellSel;
|
|
41625
|
-
if (sel instanceof
|
|
41500
|
+
if (sel instanceof CellSelection2) cellSel = sel;
|
|
41626
41501
|
else {
|
|
41627
41502
|
const end = atEndOfCell(view, axis, dir);
|
|
41628
41503
|
if (end == null) return false;
|
|
41629
|
-
cellSel = new
|
|
41504
|
+
cellSel = new CellSelection2(state.doc.resolve(end));
|
|
41630
41505
|
}
|
|
41631
41506
|
const $head = nextCell(cellSel.$headCell, axis, dir);
|
|
41632
41507
|
if (!$head) return false;
|
|
41633
|
-
return maybeSetSelection(state, dispatch, new
|
|
41508
|
+
return maybeSetSelection(state, dispatch, new CellSelection2(cellSel.$anchorCell, $head));
|
|
41634
41509
|
};
|
|
41635
41510
|
}
|
|
41636
41511
|
function atEndOfCell(view, axis, dir) {
|
|
@@ -41659,7 +41534,8 @@ import {
|
|
|
41659
41534
|
ArrowRight as ArrowRight3,
|
|
41660
41535
|
ArrowUp as ArrowUp2,
|
|
41661
41536
|
Copy as Copy3,
|
|
41662
|
-
|
|
41537
|
+
Paintbrush as Paintbrush2,
|
|
41538
|
+
Table as TableIcon,
|
|
41663
41539
|
Trash2 as Trash24
|
|
41664
41540
|
} from "lucide-react";
|
|
41665
41541
|
|
|
@@ -41856,15 +41732,19 @@ function buildTableControlLayout(editor, surface, cell) {
|
|
|
41856
41732
|
const map = TableMap4.get(tableInfo.node);
|
|
41857
41733
|
const surfaceRect = surface.getBoundingClientRect();
|
|
41858
41734
|
const tableRect = table.getBoundingClientRect();
|
|
41735
|
+
const explicitColumnWidths = Array.from(table.querySelectorAll("colgroup > col")).slice(0, map.width).map((column) => parsePixelMetric(column.style.width));
|
|
41736
|
+
const explicitTableWidth = parsePixelMetric(table.style.width) ?? (explicitColumnWidths.length === map.width && explicitColumnWidths.every((width) => width !== null) ? explicitColumnWidths.reduce((sum, width) => sum + width, 0) : null);
|
|
41737
|
+
const explicitRowHeights = rows.map((tableRow) => parsePixelMetric(tableRow.getAttribute("data-row-height")) ?? parsePixelMetric(tableRow.style.height));
|
|
41738
|
+
const explicitTableHeight = explicitRowHeights.every((height) => height !== null) ? explicitRowHeights.reduce((sum, height) => sum + height, 0) : null;
|
|
41859
41739
|
const wrapperElement = table.closest(".tableWrapper");
|
|
41860
41740
|
const wrapper = wrapperElement instanceof HTMLElement ? wrapperElement : null;
|
|
41861
41741
|
const wrapperRect = wrapper?.getBoundingClientRect() ?? tableRect;
|
|
41862
41742
|
const tableLeft = tableRect.left - surfaceRect.left + surface.scrollLeft;
|
|
41863
41743
|
const tableTop = tableRect.top - surfaceRect.top + surface.scrollTop;
|
|
41864
|
-
const
|
|
41865
|
-
const
|
|
41866
|
-
const
|
|
41867
|
-
const
|
|
41744
|
+
const tableWidth = metricOrFallback(tableRect.width, explicitTableWidth ?? FALLBACK_TABLE_COLUMN_WIDTH * map.width);
|
|
41745
|
+
const tableHeight = metricOrFallback(tableRect.height, explicitTableHeight ?? FALLBACK_TABLE_ROW_HEIGHT * rows.length);
|
|
41746
|
+
const avgRowHeight = metricOrFallback(tableHeight / rows.length, FALLBACK_TABLE_ROW_HEIGHT);
|
|
41747
|
+
const avgColumnWidth = metricOrFallback(tableWidth / map.width, FALLBACK_TABLE_COLUMN_WIDTH);
|
|
41868
41748
|
const wrapperLeft = wrapperRect.left - surfaceRect.left + surface.scrollLeft;
|
|
41869
41749
|
const wrapperTop = wrapperRect.top - surfaceRect.top + surface.scrollTop;
|
|
41870
41750
|
const wrapperWidth = metricOrFallback(wrapperRect.width, tableWidth);
|
|
@@ -41974,7 +41854,7 @@ function buildTableHoverState({
|
|
|
41974
41854
|
}
|
|
41975
41855
|
|
|
41976
41856
|
// src/components/UEditor/table-drag-preview.tsx
|
|
41977
|
-
import { Fragment as
|
|
41857
|
+
import { Fragment as Fragment31, jsx as jsx95, jsxs as jsxs78 } from "react/jsx-runtime";
|
|
41978
41858
|
function TableDragPreview({
|
|
41979
41859
|
columnDragLabel,
|
|
41980
41860
|
dragPreview,
|
|
@@ -41985,8 +41865,8 @@ function TableDragPreview({
|
|
|
41985
41865
|
const expandPreviewWidth = dragPreview.kind === "add-column" ? layout.tableWidth + dragPreview.previewCols * layout.avgColumnWidth : layout.tableWidth;
|
|
41986
41866
|
const expandPreviewHeight = dragPreview.kind === "add-row" ? layout.tableHeight + dragPreview.previewRows * layout.avgRowHeight : layout.tableHeight;
|
|
41987
41867
|
const dragStatusText = dragPreview.kind === "row" ? `${rowDragLabel} ${dragPreview.originIndex + 1} -> ${dragPreview.targetIndex + 1}` : dragPreview.kind === "column" ? `${columnDragLabel} ${dragPreview.originIndex + 1} -> ${dragPreview.targetIndex + 1}` : dragPreview.kind === "add-row" ? `+${dragPreview.previewRows}R` : `+${dragPreview.previewCols}C`;
|
|
41988
|
-
return /* @__PURE__ */ jsxs78(
|
|
41989
|
-
dragPreview.kind === "row" && /* @__PURE__ */ jsxs78(
|
|
41868
|
+
return /* @__PURE__ */ jsxs78(Fragment31, { children: [
|
|
41869
|
+
dragPreview.kind === "row" && /* @__PURE__ */ jsxs78(Fragment31, { children: [
|
|
41990
41870
|
/* @__PURE__ */ jsx95(
|
|
41991
41871
|
"div",
|
|
41992
41872
|
{
|
|
@@ -42014,7 +41894,7 @@ function TableDragPreview({
|
|
|
42014
41894
|
}
|
|
42015
41895
|
)
|
|
42016
41896
|
] }),
|
|
42017
|
-
dragPreview.kind === "column" && /* @__PURE__ */ jsxs78(
|
|
41897
|
+
dragPreview.kind === "column" && /* @__PURE__ */ jsxs78(Fragment31, { children: [
|
|
42018
41898
|
/* @__PURE__ */ jsx95(
|
|
42019
41899
|
"div",
|
|
42020
41900
|
{
|
|
@@ -42071,7 +41951,7 @@ function TableDragPreview({
|
|
|
42071
41951
|
}
|
|
42072
41952
|
|
|
42073
41953
|
// src/components/UEditor/table-add-rails.tsx
|
|
42074
|
-
import { Fragment as
|
|
41954
|
+
import { Fragment as Fragment32, jsx as jsx96, jsxs as jsxs79 } from "react/jsx-runtime";
|
|
42075
41955
|
var ADD_COLUMN_RAIL_GAP = 4;
|
|
42076
41956
|
var ADD_ROW_RAIL_GAP = 4;
|
|
42077
41957
|
function TableAddRails({
|
|
@@ -42092,7 +41972,7 @@ function TableAddRails({
|
|
|
42092
41972
|
const rowRailLeft = visibleBounds.left;
|
|
42093
41973
|
const showColumnRail = controlsVisible || addColumnVisible;
|
|
42094
41974
|
const showRowRail = controlsVisible || addRowVisible;
|
|
42095
|
-
return /* @__PURE__ */ jsxs79(
|
|
41975
|
+
return /* @__PURE__ */ jsxs79(Fragment32, { children: [
|
|
42096
41976
|
/* @__PURE__ */ jsx96(
|
|
42097
41977
|
Tooltip,
|
|
42098
41978
|
{
|
|
@@ -42223,7 +42103,7 @@ function TableControlMenu({
|
|
|
42223
42103
|
transform: shown ? "scale(1)" : "scale(0.82)",
|
|
42224
42104
|
pointerEvents: shown ? "auto" : "none"
|
|
42225
42105
|
},
|
|
42226
|
-
children: /* @__PURE__ */ jsx97(MoreHorizontal2, { className: "h-4 w-4" })
|
|
42106
|
+
children: /* @__PURE__ */ jsx97(MoreHorizontal2, { "aria-hidden": "true", className: "h-4 w-4" })
|
|
42227
42107
|
}
|
|
42228
42108
|
)
|
|
42229
42109
|
}
|
|
@@ -42236,7 +42116,7 @@ function TableControlMenu({
|
|
|
42236
42116
|
|
|
42237
42117
|
// src/components/UEditor/table-axis-handles.tsx
|
|
42238
42118
|
import { GripHorizontal, GripVertical as GripVertical3 } from "lucide-react";
|
|
42239
|
-
import { Fragment as
|
|
42119
|
+
import { Fragment as Fragment33, jsx as jsx98 } from "react/jsx-runtime";
|
|
42240
42120
|
var IDLE_HANDLE_SCALE = "0.78";
|
|
42241
42121
|
function TableRowHandles({
|
|
42242
42122
|
activeRowIndex,
|
|
@@ -42250,7 +42130,7 @@ function TableRowHandles({
|
|
|
42250
42130
|
rowHandleLeft,
|
|
42251
42131
|
rowHandles
|
|
42252
42132
|
}) {
|
|
42253
|
-
return /* @__PURE__ */ jsx98(
|
|
42133
|
+
return /* @__PURE__ */ jsx98(Fragment33, { children: rowHandles.map((rowHandle) => {
|
|
42254
42134
|
const menuKey = `row:${rowHandle.index}`;
|
|
42255
42135
|
const isActive = rowHandle.index === activeRowIndex;
|
|
42256
42136
|
const visible = controlsVisible || hoverRowHandleIndex === rowHandle.index || openMenuKey === menuKey;
|
|
@@ -42321,7 +42201,7 @@ function TableColumnHandles({
|
|
|
42321
42201
|
onStartDrag,
|
|
42322
42202
|
openMenuKey
|
|
42323
42203
|
}) {
|
|
42324
|
-
return /* @__PURE__ */ jsx98(
|
|
42204
|
+
return /* @__PURE__ */ jsx98(Fragment33, { children: columnHandles.map((columnHandle) => {
|
|
42325
42205
|
const menuKey = `column:${columnHandle.index}`;
|
|
42326
42206
|
const isActive = columnHandle.index === activeColumnIndex;
|
|
42327
42207
|
const visible = controlsVisible || hoverColumnHandleIndex === columnHandle.index || openMenuKey === menuKey;
|
|
@@ -42381,8 +42261,236 @@ function TableColumnHandles({
|
|
|
42381
42261
|
}) });
|
|
42382
42262
|
}
|
|
42383
42263
|
|
|
42264
|
+
// src/components/UEditor/table-resize-handles.tsx
|
|
42265
|
+
import { MoveDiagonal2 } from "lucide-react";
|
|
42266
|
+
import { jsx as jsx99, jsxs as jsxs80 } from "react/jsx-runtime";
|
|
42267
|
+
var HANDLE_BASE_CLASS = cn(
|
|
42268
|
+
"pointer-events-auto absolute z-10 inline-flex touch-none items-center justify-center rounded-md",
|
|
42269
|
+
"bg-background/95 text-primary shadow-sm backdrop-blur-sm",
|
|
42270
|
+
"transition-[color,background-color,box-shadow,transform] duration-150",
|
|
42271
|
+
"hover:bg-primary hover:text-primary-foreground hover:shadow-md active:scale-95",
|
|
42272
|
+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
|
|
42273
|
+
);
|
|
42274
|
+
function TableResizeHandles({
|
|
42275
|
+
active,
|
|
42276
|
+
ctrlHint,
|
|
42277
|
+
frameRef,
|
|
42278
|
+
layout,
|
|
42279
|
+
onStartResize,
|
|
42280
|
+
resizeBothLabel
|
|
42281
|
+
}) {
|
|
42282
|
+
return /* @__PURE__ */ jsxs80(
|
|
42283
|
+
"div",
|
|
42284
|
+
{
|
|
42285
|
+
ref: frameRef,
|
|
42286
|
+
"data-table-resize-frame": "",
|
|
42287
|
+
"data-resizing": active ? "true" : "false",
|
|
42288
|
+
className: cn(
|
|
42289
|
+
"pointer-events-none absolute z-[38] box-border border border-primary/55",
|
|
42290
|
+
active && "border-primary bg-primary/[0.03]"
|
|
42291
|
+
),
|
|
42292
|
+
style: {
|
|
42293
|
+
left: layout.tableLeft,
|
|
42294
|
+
top: layout.tableTop,
|
|
42295
|
+
width: layout.tableWidth,
|
|
42296
|
+
height: layout.tableHeight
|
|
42297
|
+
},
|
|
42298
|
+
children: [
|
|
42299
|
+
/* @__PURE__ */ jsx99(
|
|
42300
|
+
"button",
|
|
42301
|
+
{
|
|
42302
|
+
type: "button",
|
|
42303
|
+
"aria-label": resizeBothLabel,
|
|
42304
|
+
title: `${resizeBothLabel}. ${ctrlHint}`,
|
|
42305
|
+
"data-table-resize-handle": "both",
|
|
42306
|
+
className: cn(
|
|
42307
|
+
HANDLE_BASE_CLASS,
|
|
42308
|
+
"bottom-[-28px] right-[-30px] h-6 w-6 cursor-nwse-resize",
|
|
42309
|
+
active && "bg-primary text-primary-foreground shadow-md"
|
|
42310
|
+
),
|
|
42311
|
+
onPointerDown: onStartResize,
|
|
42312
|
+
children: /* @__PURE__ */ jsx99(MoveDiagonal2, { "aria-hidden": "true", className: "h-3.5 w-3.5", strokeWidth: 2.25 })
|
|
42313
|
+
}
|
|
42314
|
+
),
|
|
42315
|
+
active ? /* @__PURE__ */ jsx99(
|
|
42316
|
+
"span",
|
|
42317
|
+
{
|
|
42318
|
+
role: "status",
|
|
42319
|
+
"aria-live": "polite",
|
|
42320
|
+
"data-table-resize-dimensions": "",
|
|
42321
|
+
className: "absolute bottom-2 right-2 rounded bg-foreground/85 px-1.5 py-0.5 text-[10px] font-medium text-background shadow-sm",
|
|
42322
|
+
children: `${Math.round(layout.tableWidth)} \xD7 ${Math.round(layout.tableHeight)}`
|
|
42323
|
+
}
|
|
42324
|
+
) : null
|
|
42325
|
+
]
|
|
42326
|
+
}
|
|
42327
|
+
);
|
|
42328
|
+
}
|
|
42329
|
+
|
|
42330
|
+
// src/components/UEditor/table-size-utils.ts
|
|
42331
|
+
var MAX_TABLE_DIMENSION = 8192;
|
|
42332
|
+
function positiveMetric(value, fallback) {
|
|
42333
|
+
return typeof value === "number" && Number.isFinite(value) && value > 0 ? value : fallback;
|
|
42334
|
+
}
|
|
42335
|
+
function normalizeWeightsToTotal(values, total, minimum) {
|
|
42336
|
+
if (values.length === 0) return [];
|
|
42337
|
+
const safeTotal = Math.max(values.length * minimum, Math.round(total));
|
|
42338
|
+
const positiveValues = values.map((value) => positiveMetric(value, 1));
|
|
42339
|
+
const weightSum = positiveValues.reduce((sum, value) => sum + value, 0);
|
|
42340
|
+
const raw = positiveValues.map((value) => value / weightSum * safeTotal);
|
|
42341
|
+
const normalized = raw.map((value) => Math.max(minimum, Math.round(value)));
|
|
42342
|
+
let difference = safeTotal - normalized.reduce((sum, value) => sum + value, 0);
|
|
42343
|
+
while (difference !== 0) {
|
|
42344
|
+
let changed = false;
|
|
42345
|
+
for (let index = normalized.length - 1; index >= 0 && difference !== 0; index -= 1) {
|
|
42346
|
+
if (difference < 0 && normalized[index] <= minimum) continue;
|
|
42347
|
+
normalized[index] += difference > 0 ? 1 : -1;
|
|
42348
|
+
difference += difference > 0 ? -1 : 1;
|
|
42349
|
+
changed = true;
|
|
42350
|
+
}
|
|
42351
|
+
if (!changed) break;
|
|
42352
|
+
}
|
|
42353
|
+
return normalized;
|
|
42354
|
+
}
|
|
42355
|
+
function getLogicalColumnWidths(table, tableMap, fallback) {
|
|
42356
|
+
return Array.from({ length: tableMap.width }, (_, columnIndex) => {
|
|
42357
|
+
const relativeCellPos = tableMap.positionAt(0, columnIndex, table);
|
|
42358
|
+
const cell = table.nodeAt(relativeCellPos);
|
|
42359
|
+
if (!cell) return fallback;
|
|
42360
|
+
const cellStartColumn = tableMap.colCount(relativeCellPos);
|
|
42361
|
+
const widthIndex = columnIndex - cellStartColumn;
|
|
42362
|
+
const colwidth = cell.attrs.colwidth;
|
|
42363
|
+
return positiveMetric(colwidth?.[widthIndex], fallback);
|
|
42364
|
+
});
|
|
42365
|
+
}
|
|
42366
|
+
function getLogicalRowHeights(table, fallback) {
|
|
42367
|
+
const heights = [];
|
|
42368
|
+
table.forEach((row) => {
|
|
42369
|
+
heights.push(positiveMetric(row.attrs.rowHeight, fallback));
|
|
42370
|
+
});
|
|
42371
|
+
return heights;
|
|
42372
|
+
}
|
|
42373
|
+
function createTableSizeSnapshot(editor, anchorPos, startWidth, startHeight) {
|
|
42374
|
+
const tableInfo = findTableInfo(editor, anchorPos);
|
|
42375
|
+
if (!tableInfo) return null;
|
|
42376
|
+
const tableMap = TableMap4.get(tableInfo.node);
|
|
42377
|
+
if (tableMap.width === 0 || tableMap.height === 0) return null;
|
|
42378
|
+
const safeWidth = Math.max(tableMap.width * MIN_RESIZED_TABLE_COLUMN_WIDTH, Math.round(startWidth));
|
|
42379
|
+
const safeHeight = Math.max(tableMap.height * MIN_TABLE_ROW_HEIGHT, Math.round(startHeight));
|
|
42380
|
+
const fallbackColumnWidth = safeWidth / tableMap.width;
|
|
42381
|
+
const fallbackRowHeight = safeHeight / tableMap.height;
|
|
42382
|
+
return {
|
|
42383
|
+
anchorPos,
|
|
42384
|
+
tablePos: tableInfo.pos,
|
|
42385
|
+
startWidth: safeWidth,
|
|
42386
|
+
startHeight: safeHeight,
|
|
42387
|
+
columnWidths: normalizeWeightsToTotal(
|
|
42388
|
+
getLogicalColumnWidths(tableInfo.node, tableMap, fallbackColumnWidth),
|
|
42389
|
+
safeWidth,
|
|
42390
|
+
MIN_RESIZED_TABLE_COLUMN_WIDTH
|
|
42391
|
+
),
|
|
42392
|
+
rowHeights: normalizeWeightsToTotal(
|
|
42393
|
+
getLogicalRowHeights(tableInfo.node, fallbackRowHeight),
|
|
42394
|
+
safeHeight,
|
|
42395
|
+
MIN_TABLE_ROW_HEIGHT
|
|
42396
|
+
),
|
|
42397
|
+
minWidth: tableMap.width * MIN_RESIZED_TABLE_COLUMN_WIDTH,
|
|
42398
|
+
minHeight: tableMap.height * MIN_TABLE_ROW_HEIGHT
|
|
42399
|
+
};
|
|
42400
|
+
}
|
|
42401
|
+
function resolveTableResizeDimensions({
|
|
42402
|
+
deltaX,
|
|
42403
|
+
deltaY,
|
|
42404
|
+
lockAxis,
|
|
42405
|
+
preserveRatio,
|
|
42406
|
+
snapshot
|
|
42407
|
+
}) {
|
|
42408
|
+
let width = snapshot.startWidth + deltaX;
|
|
42409
|
+
let height = snapshot.startHeight + deltaY;
|
|
42410
|
+
if (preserveRatio) {
|
|
42411
|
+
const horizontalDrag = Math.abs(deltaX) >= Math.abs(deltaY);
|
|
42412
|
+
const scale = horizontalDrag ? width / snapshot.startWidth : height / snapshot.startHeight;
|
|
42413
|
+
const minScale = Math.max(
|
|
42414
|
+
snapshot.minWidth / snapshot.startWidth,
|
|
42415
|
+
snapshot.minHeight / snapshot.startHeight
|
|
42416
|
+
);
|
|
42417
|
+
const maxScale = Math.min(
|
|
42418
|
+
MAX_TABLE_DIMENSION / snapshot.startWidth,
|
|
42419
|
+
MAX_TABLE_DIMENSION / snapshot.startHeight
|
|
42420
|
+
);
|
|
42421
|
+
const safeScale = Math.min(Math.max(scale, minScale), maxScale);
|
|
42422
|
+
width = snapshot.startWidth * safeScale;
|
|
42423
|
+
height = snapshot.startHeight * safeScale;
|
|
42424
|
+
} else if (lockAxis) {
|
|
42425
|
+
if (Math.abs(deltaX) >= Math.abs(deltaY)) {
|
|
42426
|
+
height = snapshot.startHeight;
|
|
42427
|
+
} else {
|
|
42428
|
+
width = snapshot.startWidth;
|
|
42429
|
+
}
|
|
42430
|
+
}
|
|
42431
|
+
return {
|
|
42432
|
+
width: Math.min(MAX_TABLE_DIMENSION, Math.max(snapshot.minWidth, Math.round(width))),
|
|
42433
|
+
height: Math.min(MAX_TABLE_DIMENSION, Math.max(snapshot.minHeight, Math.round(height)))
|
|
42434
|
+
};
|
|
42435
|
+
}
|
|
42436
|
+
function arraysEqual(left, right) {
|
|
42437
|
+
return Array.isArray(left) && left.length === right.length && left.every((value, index) => value === right[index]);
|
|
42438
|
+
}
|
|
42439
|
+
function applyTableSize(editor, snapshot, dimensions) {
|
|
42440
|
+
const table = editor.state.doc.nodeAt(snapshot.tablePos);
|
|
42441
|
+
if (!table || table.type.name !== "table") return false;
|
|
42442
|
+
const tableMap = TableMap4.get(table);
|
|
42443
|
+
if (tableMap.width !== snapshot.columnWidths.length || tableMap.height !== snapshot.rowHeights.length) {
|
|
42444
|
+
return false;
|
|
42445
|
+
}
|
|
42446
|
+
const resizeWidth = dimensions.width !== snapshot.startWidth;
|
|
42447
|
+
const resizeHeight = dimensions.height !== snapshot.startHeight;
|
|
42448
|
+
if (!resizeWidth && !resizeHeight) return false;
|
|
42449
|
+
const tableStart = snapshot.tablePos + 1;
|
|
42450
|
+
const transaction = editor.state.tr;
|
|
42451
|
+
if (resizeWidth) {
|
|
42452
|
+
const nextColumnWidths = normalizeWeightsToTotal(
|
|
42453
|
+
snapshot.columnWidths,
|
|
42454
|
+
dimensions.width,
|
|
42455
|
+
MIN_RESIZED_TABLE_COLUMN_WIDTH
|
|
42456
|
+
);
|
|
42457
|
+
const seenCellPositions = /* @__PURE__ */ new Set();
|
|
42458
|
+
for (const relativeCellPos of tableMap.map) {
|
|
42459
|
+
if (seenCellPositions.has(relativeCellPos)) continue;
|
|
42460
|
+
seenCellPositions.add(relativeCellPos);
|
|
42461
|
+
const cell = table.nodeAt(relativeCellPos);
|
|
42462
|
+
if (!cell) continue;
|
|
42463
|
+
const cellRect = tableMap.findCell(relativeCellPos);
|
|
42464
|
+
const colwidth = nextColumnWidths.slice(cellRect.left, cellRect.right);
|
|
42465
|
+
if (arraysEqual(cell.attrs.colwidth, colwidth)) continue;
|
|
42466
|
+
transaction.setNodeMarkup(tableStart + relativeCellPos, void 0, {
|
|
42467
|
+
...cell.attrs,
|
|
42468
|
+
colwidth
|
|
42469
|
+
});
|
|
42470
|
+
}
|
|
42471
|
+
}
|
|
42472
|
+
if (resizeHeight) {
|
|
42473
|
+
const nextRowHeights = normalizeWeightsToTotal(
|
|
42474
|
+
snapshot.rowHeights,
|
|
42475
|
+
dimensions.height,
|
|
42476
|
+
MIN_TABLE_ROW_HEIGHT
|
|
42477
|
+
);
|
|
42478
|
+
table.forEach((row, offset, rowIndex) => {
|
|
42479
|
+
const rowHeight = nextRowHeights[rowIndex];
|
|
42480
|
+
if (row.attrs.rowHeight === rowHeight) return;
|
|
42481
|
+
transaction.setNodeMarkup(tableStart + offset, void 0, {
|
|
42482
|
+
...row.attrs,
|
|
42483
|
+
rowHeight
|
|
42484
|
+
});
|
|
42485
|
+
});
|
|
42486
|
+
}
|
|
42487
|
+
if (!transaction.docChanged) return false;
|
|
42488
|
+
editor.view.dispatch(transaction);
|
|
42489
|
+
return true;
|
|
42490
|
+
}
|
|
42491
|
+
|
|
42384
42492
|
// src/components/UEditor/table-controls.tsx
|
|
42385
|
-
import { Fragment as
|
|
42493
|
+
import { Fragment as Fragment34, jsx as jsx100, jsxs as jsxs81 } from "react/jsx-runtime";
|
|
42386
42494
|
var TABLE_MENU_TOP_OFFSET = 10;
|
|
42387
42495
|
function nearestIndex(centers, position) {
|
|
42388
42496
|
let bestIndex = 0;
|
|
@@ -42406,15 +42514,18 @@ function getSelectedCell(editor) {
|
|
|
42406
42514
|
const domAtPos = editor.view.domAtPos(editor.state.selection.from);
|
|
42407
42515
|
return getCellFromTarget(domAtPos.node);
|
|
42408
42516
|
}
|
|
42409
|
-
function TableControls({ editor, containerRef }) {
|
|
42517
|
+
function TableControls({ editor, containerRef, showCellInspector = true }) {
|
|
42410
42518
|
const t = useSmartTranslations("UEditor");
|
|
42411
42519
|
const [layout, setLayout] = React86.useState(null);
|
|
42412
42520
|
const [dragPreview, setDragPreview] = React86.useState(null);
|
|
42521
|
+
const [tableResizeActive, setTableResizeActive] = React86.useState(false);
|
|
42413
42522
|
const [hoverState, setHoverState] = React86.useState(DEFAULT_TABLE_HOVER_STATE);
|
|
42414
42523
|
const [openMenuKey, setOpenMenuKey] = React86.useState(null);
|
|
42415
42524
|
const layoutRef = React86.useRef(null);
|
|
42416
42525
|
const dragStateRef = React86.useRef(null);
|
|
42417
42526
|
const syncFrameRef = React86.useRef(null);
|
|
42527
|
+
const tableResizeFrameRef = React86.useRef(null);
|
|
42528
|
+
const tableResizePreviewFrameRef = React86.useRef(null);
|
|
42418
42529
|
React86.useEffect(() => {
|
|
42419
42530
|
layoutRef.current = layout;
|
|
42420
42531
|
}, [layout]);
|
|
@@ -42452,11 +42563,44 @@ function TableControls({ editor, containerRef }) {
|
|
|
42452
42563
|
return cell ? buildTableControlLayout(editor, surface, cell) : null;
|
|
42453
42564
|
});
|
|
42454
42565
|
}, [containerRef, editor]);
|
|
42566
|
+
const updateTableResizePreview = React86.useCallback((dimensions) => {
|
|
42567
|
+
const frame = tableResizeFrameRef.current;
|
|
42568
|
+
if (!frame) return;
|
|
42569
|
+
frame.style.width = `${dimensions.width}px`;
|
|
42570
|
+
frame.style.height = `${dimensions.height}px`;
|
|
42571
|
+
const dimensionsLabel = frame.querySelector("[data-table-resize-dimensions]");
|
|
42572
|
+
if (dimensionsLabel) {
|
|
42573
|
+
dimensionsLabel.textContent = `${dimensions.width} \xD7 ${dimensions.height}`;
|
|
42574
|
+
}
|
|
42575
|
+
}, []);
|
|
42576
|
+
const resetTableResizePreview = React86.useCallback(() => {
|
|
42577
|
+
const activeLayout = layoutRef.current;
|
|
42578
|
+
if (!activeLayout) return;
|
|
42579
|
+
updateTableResizePreview({
|
|
42580
|
+
width: Math.round(activeLayout.tableWidth),
|
|
42581
|
+
height: Math.round(activeLayout.tableHeight)
|
|
42582
|
+
});
|
|
42583
|
+
}, [updateTableResizePreview]);
|
|
42455
42584
|
const clearDrag = React86.useCallback(() => {
|
|
42585
|
+
const dragState = dragStateRef.current;
|
|
42586
|
+
if (dragState?.kind === "resize-table") {
|
|
42587
|
+
try {
|
|
42588
|
+
if (dragState.pointerTarget.hasPointerCapture?.(dragState.pointerId)) {
|
|
42589
|
+
dragState.pointerTarget.releasePointerCapture(dragState.pointerId);
|
|
42590
|
+
}
|
|
42591
|
+
} catch {
|
|
42592
|
+
}
|
|
42593
|
+
}
|
|
42594
|
+
if (tableResizePreviewFrameRef.current !== null) {
|
|
42595
|
+
window.cancelAnimationFrame(tableResizePreviewFrameRef.current);
|
|
42596
|
+
tableResizePreviewFrameRef.current = null;
|
|
42597
|
+
}
|
|
42456
42598
|
dragStateRef.current = null;
|
|
42457
42599
|
setDragPreview(null);
|
|
42600
|
+
setTableResizeActive(false);
|
|
42601
|
+
resetTableResizePreview();
|
|
42458
42602
|
document.body.style.cursor = "";
|
|
42459
|
-
}, []);
|
|
42603
|
+
}, [resetTableResizePreview]);
|
|
42460
42604
|
const updateHoverState = React86.useCallback((event) => {
|
|
42461
42605
|
const activeLayout = layoutRef.current;
|
|
42462
42606
|
const surface = containerRef.current;
|
|
@@ -42496,9 +42640,26 @@ function TableControls({ editor, containerRef }) {
|
|
|
42496
42640
|
const cell = event ? getCellFromTarget(event.target) : null;
|
|
42497
42641
|
syncFromCell(cell ?? getSelectedCell(editor));
|
|
42498
42642
|
};
|
|
42643
|
+
const handleDoubleClick = (event) => {
|
|
42644
|
+
if (event.button !== 0) return;
|
|
42645
|
+
const cell = getCellFromTarget(event.target);
|
|
42646
|
+
if (!cell || cell.hasAttribute("data-formula")) return;
|
|
42647
|
+
const surface2 = containerRef.current;
|
|
42648
|
+
const nextLayout = surface2 ? buildTableControlLayout(editor, surface2, cell) : null;
|
|
42649
|
+
if (!nextLayout) return;
|
|
42650
|
+
const didSelect = editor.commands.setCellSelection({
|
|
42651
|
+
anchorCell: nextLayout.cellPos,
|
|
42652
|
+
headCell: nextLayout.cellPos
|
|
42653
|
+
});
|
|
42654
|
+
if (!didSelect) return;
|
|
42655
|
+
event.preventDefault();
|
|
42656
|
+
editor.view.focus();
|
|
42657
|
+
setLayout(nextLayout);
|
|
42658
|
+
};
|
|
42499
42659
|
proseMirror.addEventListener("mouseover", handleMouseOver);
|
|
42500
42660
|
proseMirror.addEventListener("mouseleave", handleMouseLeave2);
|
|
42501
42661
|
proseMirror.addEventListener("click", handleFocusIn);
|
|
42662
|
+
proseMirror.addEventListener("dblclick", handleDoubleClick);
|
|
42502
42663
|
proseMirror.addEventListener("mouseup", handleFocusIn);
|
|
42503
42664
|
proseMirror.addEventListener("focusin", handleFocusIn);
|
|
42504
42665
|
surface.addEventListener("mouseover", handleSurfaceMouseMove);
|
|
@@ -42513,6 +42674,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42513
42674
|
proseMirror.removeEventListener("mouseover", handleMouseOver);
|
|
42514
42675
|
proseMirror.removeEventListener("mouseleave", handleMouseLeave2);
|
|
42515
42676
|
proseMirror.removeEventListener("click", handleFocusIn);
|
|
42677
|
+
proseMirror.removeEventListener("dblclick", handleDoubleClick);
|
|
42516
42678
|
proseMirror.removeEventListener("mouseup", handleFocusIn);
|
|
42517
42679
|
proseMirror.removeEventListener("focusin", handleFocusIn);
|
|
42518
42680
|
surface.removeEventListener("mouseover", handleSurfaceMouseMove);
|
|
@@ -42563,6 +42725,42 @@ function TableControls({ editor, containerRef }) {
|
|
|
42563
42725
|
const canExpandTable = Boolean(layout);
|
|
42564
42726
|
const controlsVisible = dragPreview !== null;
|
|
42565
42727
|
const tableMenuOpen = openMenuKey === "table";
|
|
42728
|
+
const startTableResize = React86.useCallback((event) => {
|
|
42729
|
+
if (event.button !== 0 || dragStateRef.current) return;
|
|
42730
|
+
const activeLayout = layoutRef.current;
|
|
42731
|
+
if (!activeLayout) return;
|
|
42732
|
+
const snapshot = createTableSizeSnapshot(
|
|
42733
|
+
editor,
|
|
42734
|
+
activeLayout.cellPos,
|
|
42735
|
+
activeLayout.tableWidth,
|
|
42736
|
+
activeLayout.tableHeight
|
|
42737
|
+
);
|
|
42738
|
+
if (!snapshot) return;
|
|
42739
|
+
event.preventDefault();
|
|
42740
|
+
event.stopPropagation();
|
|
42741
|
+
try {
|
|
42742
|
+
event.currentTarget.setPointerCapture?.(event.pointerId);
|
|
42743
|
+
} catch {
|
|
42744
|
+
}
|
|
42745
|
+
setOpenMenuKey(null);
|
|
42746
|
+
setHoverState(DEFAULT_TABLE_HOVER_STATE);
|
|
42747
|
+
setTableResizeActive(true);
|
|
42748
|
+
const pendingDimensions = {
|
|
42749
|
+
width: snapshot.startWidth,
|
|
42750
|
+
height: snapshot.startHeight
|
|
42751
|
+
};
|
|
42752
|
+
dragStateRef.current = {
|
|
42753
|
+
kind: "resize-table",
|
|
42754
|
+
pointerId: event.pointerId,
|
|
42755
|
+
pointerTarget: event.currentTarget,
|
|
42756
|
+
startX: event.clientX,
|
|
42757
|
+
startY: event.clientY,
|
|
42758
|
+
snapshot,
|
|
42759
|
+
pendingDimensions
|
|
42760
|
+
};
|
|
42761
|
+
updateTableResizePreview(pendingDimensions);
|
|
42762
|
+
document.body.style.cursor = "nwse-resize";
|
|
42763
|
+
}, [editor, updateTableResizePreview]);
|
|
42566
42764
|
const startAddColumnDrag = React86.useCallback(() => {
|
|
42567
42765
|
setOpenMenuKey(null);
|
|
42568
42766
|
dragStateRef.current = { kind: "add-column", previewCols: 1 };
|
|
@@ -42618,6 +42816,9 @@ function TableControls({ editor, containerRef }) {
|
|
|
42618
42816
|
const surfaceRect = surface.getBoundingClientRect();
|
|
42619
42817
|
const relativeX = event.clientX - surfaceRect.left + surface.scrollLeft;
|
|
42620
42818
|
const relativeY = event.clientY - surfaceRect.top + surface.scrollTop;
|
|
42819
|
+
if (dragState.kind === "resize-table") {
|
|
42820
|
+
return;
|
|
42821
|
+
}
|
|
42621
42822
|
if (dragState.kind === "row") {
|
|
42622
42823
|
const targetHandleIndex = nearestIndex(activeLayout.rowHandles.map((item) => item.center), relativeY);
|
|
42623
42824
|
const targetRow = activeLayout.rowHandles[targetHandleIndex];
|
|
@@ -42662,7 +42863,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42662
42863
|
};
|
|
42663
42864
|
const handleMouseUp = () => {
|
|
42664
42865
|
const dragState = dragStateRef.current;
|
|
42665
|
-
if (!dragState) return;
|
|
42866
|
+
if (!dragState || dragState.kind === "resize-table") return;
|
|
42666
42867
|
if (dragState.kind === "row" && dragState.originIndex !== dragState.targetIndex) {
|
|
42667
42868
|
moveTableRow({
|
|
42668
42869
|
from: dragState.originIndex,
|
|
@@ -42698,9 +42899,76 @@ function TableControls({ editor, containerRef }) {
|
|
|
42698
42899
|
window.removeEventListener("blur", clearDrag);
|
|
42699
42900
|
};
|
|
42700
42901
|
}, [clearDrag, containerRef, editor, expandTableBy, scheduleSyncFromSelection]);
|
|
42902
|
+
React86.useEffect(() => {
|
|
42903
|
+
const handlePointerMove = (event) => {
|
|
42904
|
+
const dragState = dragStateRef.current;
|
|
42905
|
+
if (!dragState || dragState.kind !== "resize-table" || event.pointerId !== dragState.pointerId) return;
|
|
42906
|
+
dragState.pendingDimensions = resolveTableResizeDimensions({
|
|
42907
|
+
deltaX: event.clientX - dragState.startX,
|
|
42908
|
+
deltaY: event.clientY - dragState.startY,
|
|
42909
|
+
lockAxis: event.ctrlKey && !event.shiftKey,
|
|
42910
|
+
preserveRatio: event.ctrlKey && event.shiftKey,
|
|
42911
|
+
snapshot: dragState.snapshot
|
|
42912
|
+
});
|
|
42913
|
+
if (tableResizePreviewFrameRef.current === null) {
|
|
42914
|
+
tableResizePreviewFrameRef.current = window.requestAnimationFrame(() => {
|
|
42915
|
+
tableResizePreviewFrameRef.current = null;
|
|
42916
|
+
const currentDragState = dragStateRef.current;
|
|
42917
|
+
if (!currentDragState || currentDragState.kind !== "resize-table") return;
|
|
42918
|
+
updateTableResizePreview(currentDragState.pendingDimensions);
|
|
42919
|
+
});
|
|
42920
|
+
}
|
|
42921
|
+
document.body.style.cursor = "nwse-resize";
|
|
42922
|
+
if (event.cancelable) event.preventDefault();
|
|
42923
|
+
};
|
|
42924
|
+
const finishTableResize = (event, commit) => {
|
|
42925
|
+
const dragState = dragStateRef.current;
|
|
42926
|
+
if (!dragState || dragState.kind !== "resize-table" || event.pointerId !== dragState.pointerId) return;
|
|
42927
|
+
if (tableResizePreviewFrameRef.current !== null) {
|
|
42928
|
+
window.cancelAnimationFrame(tableResizePreviewFrameRef.current);
|
|
42929
|
+
tableResizePreviewFrameRef.current = null;
|
|
42930
|
+
}
|
|
42931
|
+
updateTableResizePreview(dragState.pendingDimensions);
|
|
42932
|
+
if (commit && applyTableSize(editor, dragState.snapshot, dragState.pendingDimensions)) {
|
|
42933
|
+
scheduleSyncFromSelection();
|
|
42934
|
+
}
|
|
42935
|
+
clearDrag();
|
|
42936
|
+
};
|
|
42937
|
+
const handlePointerUp = (event) => finishTableResize(event, true);
|
|
42938
|
+
const handlePointerCancel = (event) => finishTableResize(event, false);
|
|
42939
|
+
window.addEventListener("pointermove", handlePointerMove, { passive: false });
|
|
42940
|
+
window.addEventListener("pointerup", handlePointerUp);
|
|
42941
|
+
window.addEventListener("pointercancel", handlePointerCancel);
|
|
42942
|
+
return () => {
|
|
42943
|
+
window.removeEventListener("pointermove", handlePointerMove);
|
|
42944
|
+
window.removeEventListener("pointerup", handlePointerUp);
|
|
42945
|
+
window.removeEventListener("pointercancel", handlePointerCancel);
|
|
42946
|
+
if (tableResizePreviewFrameRef.current !== null) {
|
|
42947
|
+
window.cancelAnimationFrame(tableResizePreviewFrameRef.current);
|
|
42948
|
+
tableResizePreviewFrameRef.current = null;
|
|
42949
|
+
}
|
|
42950
|
+
};
|
|
42951
|
+
}, [clearDrag, editor, scheduleSyncFromSelection, updateTableResizePreview]);
|
|
42952
|
+
const openCellInspector = React86.useCallback(() => {
|
|
42953
|
+
const cellPos = layoutRef.current?.cellPos;
|
|
42954
|
+
if (!showCellInspector || cellPos == null) return;
|
|
42955
|
+
const didSelect = editor.commands.setCellSelection({
|
|
42956
|
+
anchorCell: cellPos,
|
|
42957
|
+
headCell: cellPos
|
|
42958
|
+
});
|
|
42959
|
+
if (!didSelect) return;
|
|
42960
|
+
window.requestAnimationFrame(() => {
|
|
42961
|
+
if (!editor.isDestroyed) editor.view.focus();
|
|
42962
|
+
});
|
|
42963
|
+
}, [editor, showCellInspector]);
|
|
42701
42964
|
const menuItems = React86.useMemo(() => {
|
|
42702
42965
|
if (!layout) return [];
|
|
42703
42966
|
return [
|
|
42967
|
+
...showCellInspector ? [{
|
|
42968
|
+
label: t("tableMenu.cellFormatting"),
|
|
42969
|
+
icon: Paintbrush2,
|
|
42970
|
+
onClick: openCellInspector
|
|
42971
|
+
}] : [],
|
|
42704
42972
|
{
|
|
42705
42973
|
label: t("tableMenu.alignLeft"),
|
|
42706
42974
|
icon: AlignLeft3,
|
|
@@ -42738,12 +43006,12 @@ function TableControls({ editor, containerRef }) {
|
|
|
42738
43006
|
},
|
|
42739
43007
|
{
|
|
42740
43008
|
label: t("tableMenu.toggleHeaderRow"),
|
|
42741
|
-
icon:
|
|
43009
|
+
icon: TableIcon,
|
|
42742
43010
|
onClick: () => runAtActiveCell((chain) => chain.toggleHeaderRow())
|
|
42743
43011
|
},
|
|
42744
43012
|
{
|
|
42745
43013
|
label: t("tableMenu.toggleHeaderColumn"),
|
|
42746
|
-
icon:
|
|
43014
|
+
icon: TableIcon,
|
|
42747
43015
|
onClick: () => runAtActiveCell((chain) => chain.toggleHeaderColumn())
|
|
42748
43016
|
},
|
|
42749
43017
|
{
|
|
@@ -42765,7 +43033,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42765
43033
|
destructive: true
|
|
42766
43034
|
}
|
|
42767
43035
|
];
|
|
42768
|
-
}, [editor, layout, runAtActiveCell, t]);
|
|
43036
|
+
}, [editor, layout, openCellInspector, runAtActiveCell, showCellInspector, t]);
|
|
42769
43037
|
const getRowHandleMenuItems = React86.useCallback((rowHandle) => [
|
|
42770
43038
|
{
|
|
42771
43039
|
label: t("tableMenu.addRowBefore"),
|
|
@@ -42784,7 +43052,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42784
43052
|
},
|
|
42785
43053
|
{
|
|
42786
43054
|
label: t("tableMenu.clearRowContents"),
|
|
42787
|
-
icon:
|
|
43055
|
+
icon: TableIcon,
|
|
42788
43056
|
onClick: () => clearRowAt(rowHandle.index, rowHandle.cellPos)
|
|
42789
43057
|
},
|
|
42790
43058
|
{
|
|
@@ -42812,7 +43080,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42812
43080
|
},
|
|
42813
43081
|
{
|
|
42814
43082
|
label: t("tableMenu.clearColumnContents"),
|
|
42815
|
-
icon:
|
|
43083
|
+
icon: TableIcon,
|
|
42816
43084
|
onClick: () => clearColumnAt(columnHandle.index, columnHandle.cellPos)
|
|
42817
43085
|
},
|
|
42818
43086
|
{
|
|
@@ -42829,8 +43097,8 @@ function TableControls({ editor, containerRef }) {
|
|
|
42829
43097
|
const menuLeft = Math.max(8, layout.tableLeft);
|
|
42830
43098
|
const rowHandleLeft = layout.tableLeft - 12;
|
|
42831
43099
|
const columnHandleTop = layout.tableTop - 12;
|
|
42832
|
-
return /* @__PURE__ */
|
|
42833
|
-
/* @__PURE__ */
|
|
43100
|
+
return /* @__PURE__ */ jsxs81(Fragment34, { children: [
|
|
43101
|
+
/* @__PURE__ */ jsx100(
|
|
42834
43102
|
TableRowHandles,
|
|
42835
43103
|
{
|
|
42836
43104
|
activeRowIndex: layout.activeRowIndex,
|
|
@@ -42847,7 +43115,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42847
43115
|
rowHandles: layout.rowHandles
|
|
42848
43116
|
}
|
|
42849
43117
|
),
|
|
42850
|
-
/* @__PURE__ */
|
|
43118
|
+
/* @__PURE__ */ jsx100(
|
|
42851
43119
|
TableColumnHandles,
|
|
42852
43120
|
{
|
|
42853
43121
|
activeColumnIndex: layout.activeColumnIndex,
|
|
@@ -42864,7 +43132,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42864
43132
|
openMenuKey
|
|
42865
43133
|
}
|
|
42866
43134
|
),
|
|
42867
|
-
/* @__PURE__ */
|
|
43135
|
+
/* @__PURE__ */ jsx100(
|
|
42868
43136
|
TableControlMenu,
|
|
42869
43137
|
{
|
|
42870
43138
|
controlsVisible,
|
|
@@ -42879,7 +43147,18 @@ function TableControls({ editor, containerRef }) {
|
|
|
42879
43147
|
top: menuTop
|
|
42880
43148
|
}
|
|
42881
43149
|
),
|
|
42882
|
-
/* @__PURE__ */
|
|
43150
|
+
dragPreview === null && /* @__PURE__ */ jsx100(
|
|
43151
|
+
TableResizeHandles,
|
|
43152
|
+
{
|
|
43153
|
+
active: tableResizeActive,
|
|
43154
|
+
ctrlHint: t("tableMenu.resizeCtrlHint"),
|
|
43155
|
+
frameRef: tableResizeFrameRef,
|
|
43156
|
+
layout,
|
|
43157
|
+
onStartResize: startTableResize,
|
|
43158
|
+
resizeBothLabel: t("tableMenu.resizeBoth")
|
|
43159
|
+
}
|
|
43160
|
+
),
|
|
43161
|
+
/* @__PURE__ */ jsx100(
|
|
42883
43162
|
TableAddRails,
|
|
42884
43163
|
{
|
|
42885
43164
|
addColumnVisible: hoverState.addColumnVisible,
|
|
@@ -42893,7 +43172,7 @@ function TableControls({ editor, containerRef }) {
|
|
|
42893
43172
|
quickAddRowLabel: t("tableMenu.quickAddRowAfter")
|
|
42894
43173
|
}
|
|
42895
43174
|
),
|
|
42896
|
-
/* @__PURE__ */
|
|
43175
|
+
/* @__PURE__ */ jsx100(
|
|
42897
43176
|
TableDragPreview,
|
|
42898
43177
|
{
|
|
42899
43178
|
columnDragLabel: t("tableMenu.dragColumn"),
|
|
@@ -44035,7 +44314,7 @@ import {
|
|
|
44035
44314
|
Strikethrough as StrikethroughIcon2,
|
|
44036
44315
|
Subscript as SubscriptIcon2,
|
|
44037
44316
|
Superscript as SuperscriptIcon2,
|
|
44038
|
-
Table as
|
|
44317
|
+
Table as TableIcon2,
|
|
44039
44318
|
Trash2 as Trash25,
|
|
44040
44319
|
Underline as UnderlineIcon2,
|
|
44041
44320
|
Undo as UndoIcon,
|
|
@@ -44182,14 +44461,14 @@ function prepareUEditorPreviewHtml(html) {
|
|
|
44182
44461
|
}
|
|
44183
44462
|
|
|
44184
44463
|
// src/components/UEditor/menu-bar.tsx
|
|
44185
|
-
import { Fragment as
|
|
44464
|
+
import { Fragment as Fragment35, jsx as jsx101, jsxs as jsxs82 } from "react/jsx-runtime";
|
|
44186
44465
|
function MenuTableInsertGrid({
|
|
44187
44466
|
insertLabel,
|
|
44188
44467
|
previewTemplate,
|
|
44189
44468
|
onInsert
|
|
44190
44469
|
}) {
|
|
44191
44470
|
const closeMenu = useDropdownMenuClose();
|
|
44192
|
-
return /* @__PURE__ */
|
|
44471
|
+
return /* @__PURE__ */ jsx101(
|
|
44193
44472
|
TableInsertGrid,
|
|
44194
44473
|
{
|
|
44195
44474
|
insertLabel,
|
|
@@ -44205,9 +44484,9 @@ function renderMenuItems(items) {
|
|
|
44205
44484
|
return items.map((item, i) => {
|
|
44206
44485
|
switch (item.type) {
|
|
44207
44486
|
case "separator":
|
|
44208
|
-
return /* @__PURE__ */
|
|
44487
|
+
return /* @__PURE__ */ jsx101(DropdownMenuSeparator, {}, i);
|
|
44209
44488
|
case "action":
|
|
44210
|
-
return /* @__PURE__ */
|
|
44489
|
+
return /* @__PURE__ */ jsx101(
|
|
44211
44490
|
DropdownMenuItem,
|
|
44212
44491
|
{
|
|
44213
44492
|
label: item.label,
|
|
@@ -44221,9 +44500,9 @@ function renderMenuItems(items) {
|
|
|
44221
44500
|
i
|
|
44222
44501
|
);
|
|
44223
44502
|
case "sub":
|
|
44224
|
-
return /* @__PURE__ */
|
|
44503
|
+
return /* @__PURE__ */ jsx101(DropdownMenuSub, { label: item.label, icon: item.icon, disabled: item.disabled, children: renderMenuItems(item.items) }, i);
|
|
44225
44504
|
case "custom":
|
|
44226
|
-
return /* @__PURE__ */
|
|
44505
|
+
return /* @__PURE__ */ jsx101(React89.Fragment, { children: item.render() }, item.key);
|
|
44227
44506
|
}
|
|
44228
44507
|
});
|
|
44229
44508
|
}
|
|
@@ -44520,12 +44799,12 @@ function buildTableMenuItems(t, editor, onInsertTable) {
|
|
|
44520
44799
|
{
|
|
44521
44800
|
type: "sub",
|
|
44522
44801
|
label: t("menubar.insertTable"),
|
|
44523
|
-
icon:
|
|
44802
|
+
icon: TableIcon2,
|
|
44524
44803
|
items: [
|
|
44525
44804
|
{
|
|
44526
44805
|
type: "custom",
|
|
44527
44806
|
key: "table-insert-grid",
|
|
44528
|
-
render: () => /* @__PURE__ */
|
|
44807
|
+
render: () => /* @__PURE__ */ jsx101(
|
|
44529
44808
|
MenuTableInsertGrid,
|
|
44530
44809
|
{
|
|
44531
44810
|
insertLabel: t("tableMenu.insertTable"),
|
|
@@ -44600,7 +44879,7 @@ function buildTableMenuItems(t, editor, onInsertTable) {
|
|
|
44600
44879
|
];
|
|
44601
44880
|
}
|
|
44602
44881
|
var MenuBarTrigger = React89.forwardRef(
|
|
44603
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
44882
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx101(
|
|
44604
44883
|
"button",
|
|
44605
44884
|
{
|
|
44606
44885
|
ref,
|
|
@@ -44638,7 +44917,7 @@ var MenuBar = ({
|
|
|
44638
44917
|
const fileInputRef = useRef39(null);
|
|
44639
44918
|
const [showImageInput, setShowImageInput] = useState52(false);
|
|
44640
44919
|
const [showLinkInput, setShowLinkInput] = useState52(false);
|
|
44641
|
-
const [
|
|
44920
|
+
const [openMenuKey, setOpenMenuKey] = useState52(null);
|
|
44642
44921
|
const [showSourceDialog, setShowSourceDialog] = useState52(false);
|
|
44643
44922
|
const [sourceHtml, setSourceHtml] = useState52("");
|
|
44644
44923
|
const [showPreviewDialog, setShowPreviewDialog] = useState52(false);
|
|
@@ -44662,7 +44941,7 @@ var MenuBar = ({
|
|
|
44662
44941
|
setShowSourceDialog(false);
|
|
44663
44942
|
};
|
|
44664
44943
|
const closeInsertMenu = () => {
|
|
44665
|
-
|
|
44944
|
+
setOpenMenuKey(null);
|
|
44666
44945
|
setShowImageInput(false);
|
|
44667
44946
|
setShowLinkInput(false);
|
|
44668
44947
|
};
|
|
@@ -44689,7 +44968,7 @@ var MenuBar = ({
|
|
|
44689
44968
|
} catch {
|
|
44690
44969
|
}
|
|
44691
44970
|
}
|
|
44692
|
-
|
|
44971
|
+
closeInsertMenu();
|
|
44693
44972
|
};
|
|
44694
44973
|
const handleInsertTable = (rows, cols) => {
|
|
44695
44974
|
editor.chain().focus().insertTable({ rows, cols, withHeaderRow: true }).run();
|
|
@@ -44703,9 +44982,9 @@ var MenuBar = ({
|
|
|
44703
44982
|
{
|
|
44704
44983
|
type: "custom",
|
|
44705
44984
|
key: "image",
|
|
44706
|
-
render: () => showImageInput ? /* @__PURE__ */
|
|
44707
|
-
/* @__PURE__ */
|
|
44708
|
-
/* @__PURE__ */
|
|
44985
|
+
render: () => showImageInput ? /* @__PURE__ */ jsx101(ImageInput, { onSubmit: handleImageUrl, onCancel: () => setShowImageInput(false) }) : /* @__PURE__ */ jsxs82(Fragment35, { children: [
|
|
44986
|
+
/* @__PURE__ */ jsx101(DropdownMenuItem, { label: t("menubar.image"), icon: ImageIcon2, onClick: () => setShowImageInput(true), closeOnSelect: false }),
|
|
44987
|
+
/* @__PURE__ */ jsx101(
|
|
44709
44988
|
DropdownMenuItem,
|
|
44710
44989
|
{
|
|
44711
44990
|
label: t("menubar.imageUpload"),
|
|
@@ -44720,7 +44999,7 @@ var MenuBar = ({
|
|
|
44720
44999
|
{
|
|
44721
45000
|
type: "custom",
|
|
44722
45001
|
key: "link",
|
|
44723
|
-
render: () => showLinkInput ? /* @__PURE__ */
|
|
45002
|
+
render: () => showLinkInput ? /* @__PURE__ */ jsx101(LinkInput, { onSubmit: handleLinkSubmit, onCancel: () => setShowLinkInput(false), initialUrl: editor.getAttributes("link").href ?? "" }) : /* @__PURE__ */ jsx101(
|
|
44724
45003
|
DropdownMenuItem,
|
|
44725
45004
|
{
|
|
44726
45005
|
label: t("menubar.link"),
|
|
@@ -44735,12 +45014,12 @@ var MenuBar = ({
|
|
|
44735
45014
|
{
|
|
44736
45015
|
type: "sub",
|
|
44737
45016
|
label: t("menubar.insertTable"),
|
|
44738
|
-
icon:
|
|
45017
|
+
icon: TableIcon2,
|
|
44739
45018
|
items: [
|
|
44740
45019
|
{
|
|
44741
45020
|
type: "custom",
|
|
44742
45021
|
key: "table-grid",
|
|
44743
|
-
render: () => /* @__PURE__ */
|
|
45022
|
+
render: () => /* @__PURE__ */ jsx101(
|
|
44744
45023
|
MenuTableInsertGrid,
|
|
44745
45024
|
{
|
|
44746
45025
|
insertLabel: t("tableMenu.insertTable"),
|
|
@@ -44786,41 +45065,31 @@ var MenuBar = ({
|
|
|
44786
45065
|
];
|
|
44787
45066
|
const menus = [
|
|
44788
45067
|
{
|
|
45068
|
+
key: "file",
|
|
44789
45069
|
label: t("menubar.file"),
|
|
44790
|
-
items: buildFileMenuItems(t, editor, { onSave, onExport })
|
|
44791
|
-
open: void 0,
|
|
44792
|
-
onOpenChange: void 0
|
|
45070
|
+
items: buildFileMenuItems(t, editor, { onSave, onExport })
|
|
44793
45071
|
},
|
|
44794
|
-
{ label: t("menubar.edit"), items: buildEditMenuItems(t, editor)
|
|
45072
|
+
{ key: "edit", label: t("menubar.edit"), items: buildEditMenuItems(t, editor) },
|
|
44795
45073
|
{
|
|
45074
|
+
key: "view",
|
|
44796
45075
|
label: t("menubar.view"),
|
|
44797
|
-
items: buildViewMenuItems(t, { containerRef, onSourceCode, openSourceDialog, onPreview: handlePreview, openPreviewDialog })
|
|
44798
|
-
open: void 0,
|
|
44799
|
-
onOpenChange: void 0
|
|
45076
|
+
items: buildViewMenuItems(t, { containerRef, onSourceCode, openSourceDialog, onPreview: handlePreview, openPreviewDialog })
|
|
44800
45077
|
},
|
|
44801
45078
|
{
|
|
45079
|
+
key: "insert",
|
|
44802
45080
|
label: t("menubar.insert"),
|
|
44803
|
-
items: insertMenuItems
|
|
44804
|
-
open: isInsertMenuOpen,
|
|
44805
|
-
onOpenChange: (open) => {
|
|
44806
|
-
setIsInsertMenuOpen(open);
|
|
44807
|
-
if (!open) {
|
|
44808
|
-
setShowImageInput(false);
|
|
44809
|
-
setShowLinkInput(false);
|
|
44810
|
-
}
|
|
44811
|
-
}
|
|
45081
|
+
items: insertMenuItems
|
|
44812
45082
|
},
|
|
44813
|
-
{ label: t("menubar.format"), items: buildFormatMenuItems(t, editor)
|
|
45083
|
+
{ key: "format", label: t("menubar.format"), items: buildFormatMenuItems(t, editor) },
|
|
44814
45084
|
{
|
|
45085
|
+
key: "tools",
|
|
44815
45086
|
label: t("menubar.tools"),
|
|
44816
|
-
items: buildToolsMenuItems(t, { onSourceCode, openSourceDialog })
|
|
44817
|
-
open: void 0,
|
|
44818
|
-
onOpenChange: void 0
|
|
45087
|
+
items: buildToolsMenuItems(t, { onSourceCode, openSourceDialog })
|
|
44819
45088
|
},
|
|
44820
|
-
{ label: t("menubar.table"), items: buildTableMenuItems(t, editor, handleInsertTable)
|
|
45089
|
+
{ key: "table", label: t("menubar.table"), items: buildTableMenuItems(t, editor, handleInsertTable) }
|
|
44821
45090
|
];
|
|
44822
|
-
return /* @__PURE__ */
|
|
44823
|
-
/* @__PURE__ */
|
|
45091
|
+
return /* @__PURE__ */ jsxs82(Fragment35, { children: [
|
|
45092
|
+
/* @__PURE__ */ jsx101(
|
|
44824
45093
|
"input",
|
|
44825
45094
|
{
|
|
44826
45095
|
ref: fileInputRef,
|
|
@@ -44831,19 +45100,26 @@ var MenuBar = ({
|
|
|
44831
45100
|
onChange: (e) => handleImageFiles(e.target.files)
|
|
44832
45101
|
}
|
|
44833
45102
|
),
|
|
44834
|
-
/* @__PURE__ */
|
|
44835
|
-
menus.map(({ label, items
|
|
45103
|
+
/* @__PURE__ */ jsxs82("div", { className: "flex items-center gap-0.5 border-b border-border/35 bg-muted/20 px-1.5 py-0.5", children: [
|
|
45104
|
+
menus.map(({ key, label, items }) => /* @__PURE__ */ jsx101(
|
|
44836
45105
|
DropdownMenu,
|
|
44837
45106
|
{
|
|
44838
|
-
trigger: /* @__PURE__ */
|
|
45107
|
+
trigger: /* @__PURE__ */ jsx101(MenuBarTrigger, { children: label }),
|
|
44839
45108
|
placement: "bottom-start",
|
|
44840
|
-
isOpen:
|
|
44841
|
-
onOpenChange
|
|
45109
|
+
isOpen: openMenuKey === key,
|
|
45110
|
+
onOpenChange: (open) => {
|
|
45111
|
+
setOpenMenuKey((current) => open ? key : current === key ? null : current);
|
|
45112
|
+
if (key === "insert" && !open) {
|
|
45113
|
+
setShowImageInput(false);
|
|
45114
|
+
setShowLinkInput(false);
|
|
45115
|
+
}
|
|
45116
|
+
},
|
|
45117
|
+
openOnHover: true,
|
|
44842
45118
|
children: renderMenuItems(items)
|
|
44843
45119
|
},
|
|
44844
|
-
|
|
45120
|
+
key
|
|
44845
45121
|
)),
|
|
44846
|
-
/* @__PURE__ */
|
|
45122
|
+
/* @__PURE__ */ jsx101(
|
|
44847
45123
|
"button",
|
|
44848
45124
|
{
|
|
44849
45125
|
type: "button",
|
|
@@ -44854,20 +45130,20 @@ var MenuBar = ({
|
|
|
44854
45130
|
"ml-auto inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition-colors",
|
|
44855
45131
|
"hover:bg-accent hover:text-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-1"
|
|
44856
45132
|
),
|
|
44857
|
-
children: /* @__PURE__ */
|
|
45133
|
+
children: /* @__PURE__ */ jsx101(Eye3, { className: "h-4 w-4", "aria-hidden": "true" })
|
|
44858
45134
|
}
|
|
44859
45135
|
)
|
|
44860
45136
|
] }),
|
|
44861
|
-
/* @__PURE__ */
|
|
45137
|
+
/* @__PURE__ */ jsx101(
|
|
44862
45138
|
Modal_default,
|
|
44863
45139
|
{
|
|
44864
45140
|
isOpen: showSourceDialog,
|
|
44865
45141
|
onClose: () => setShowSourceDialog(false),
|
|
44866
45142
|
title: t("menubar.sourceCode"),
|
|
44867
45143
|
size: "lg",
|
|
44868
|
-
children: /* @__PURE__ */
|
|
44869
|
-
/* @__PURE__ */
|
|
44870
|
-
/* @__PURE__ */
|
|
45144
|
+
children: /* @__PURE__ */ jsxs82("div", { className: "space-y-3", children: [
|
|
45145
|
+
/* @__PURE__ */ jsx101("p", { className: "text-xs text-muted-foreground", children: t("menubar.sourceCodeHint") }),
|
|
45146
|
+
/* @__PURE__ */ jsx101(
|
|
44871
45147
|
"textarea",
|
|
44872
45148
|
{
|
|
44873
45149
|
"data-testid": "source-code-textarea",
|
|
@@ -44877,8 +45153,8 @@ var MenuBar = ({
|
|
|
44877
45153
|
spellCheck: false
|
|
44878
45154
|
}
|
|
44879
45155
|
),
|
|
44880
|
-
/* @__PURE__ */
|
|
44881
|
-
/* @__PURE__ */
|
|
45156
|
+
/* @__PURE__ */ jsxs82("div", { className: "flex gap-2 justify-end", children: [
|
|
45157
|
+
/* @__PURE__ */ jsx101(
|
|
44882
45158
|
"button",
|
|
44883
45159
|
{
|
|
44884
45160
|
type: "button",
|
|
@@ -44887,7 +45163,7 @@ var MenuBar = ({
|
|
|
44887
45163
|
children: t("menubar.applySource")
|
|
44888
45164
|
}
|
|
44889
45165
|
),
|
|
44890
|
-
/* @__PURE__ */
|
|
45166
|
+
/* @__PURE__ */ jsx101(
|
|
44891
45167
|
"button",
|
|
44892
45168
|
{
|
|
44893
45169
|
type: "button",
|
|
@@ -44900,7 +45176,7 @@ var MenuBar = ({
|
|
|
44900
45176
|
] })
|
|
44901
45177
|
}
|
|
44902
45178
|
),
|
|
44903
|
-
/* @__PURE__ */
|
|
45179
|
+
/* @__PURE__ */ jsx101(
|
|
44904
45180
|
Modal_default,
|
|
44905
45181
|
{
|
|
44906
45182
|
isOpen: showPreviewDialog,
|
|
@@ -44911,12 +45187,12 @@ var MenuBar = ({
|
|
|
44911
45187
|
height: "min(860px, calc(100vh - 2rem))",
|
|
44912
45188
|
className: "flex flex-col overflow-hidden rounded-xl md:rounded-2xl",
|
|
44913
45189
|
contentClassName: "flex min-h-0 flex-1 overflow-hidden p-0",
|
|
44914
|
-
children: /* @__PURE__ */
|
|
45190
|
+
children: /* @__PURE__ */ jsx101(
|
|
44915
45191
|
"div",
|
|
44916
45192
|
{
|
|
44917
45193
|
"data-testid": "preview-content",
|
|
44918
45194
|
className: "min-h-0 flex-1 overflow-y-auto overscroll-contain",
|
|
44919
|
-
children: editor.isEmpty ? /* @__PURE__ */
|
|
45195
|
+
children: editor.isEmpty ? /* @__PURE__ */ jsx101("p", { className: "text-muted-foreground text-sm", children: t("menubar.previewEmpty") }) : /* @__PURE__ */ jsx101(
|
|
44920
45196
|
"div",
|
|
44921
45197
|
{
|
|
44922
45198
|
className: UEDITOR_PROSEMIRROR_CLASS_NAME,
|
|
@@ -44934,7 +45210,7 @@ var MenuBar = ({
|
|
|
44934
45210
|
import { useEffect as useEffect41, useRef as useRef40, useState as useState53 } from "react";
|
|
44935
45211
|
import { useEditorState as useEditorState4 } from "@tiptap/react";
|
|
44936
45212
|
import { AlertCircle as AlertCircle5, Check as Check14, Hash as Hash2, Sigma as Sigma3, Trash2 as Trash26 } from "lucide-react";
|
|
44937
|
-
import { jsx as
|
|
45213
|
+
import { jsx as jsx102, jsxs as jsxs83 } from "react/jsx-runtime";
|
|
44938
45214
|
function TableFormulaBar({ editor }) {
|
|
44939
45215
|
const t = useSmartTranslations("UEditor");
|
|
44940
45216
|
const inputRef = useRef40(null);
|
|
@@ -44984,7 +45260,7 @@ function TableFormulaBar({ editor }) {
|
|
|
44984
45260
|
if (!editor.isDestroyed) editor.commands.focus();
|
|
44985
45261
|
}, 0);
|
|
44986
45262
|
};
|
|
44987
|
-
return /* @__PURE__ */
|
|
45263
|
+
return /* @__PURE__ */ jsxs83(
|
|
44988
45264
|
"div",
|
|
44989
45265
|
{
|
|
44990
45266
|
"data-ueditor-formula-bar": "",
|
|
@@ -44992,7 +45268,7 @@ function TableFormulaBar({ editor }) {
|
|
|
44992
45268
|
"aria-label": t("tableMenu.formulaBar"),
|
|
44993
45269
|
className: "flex min-h-10 items-center gap-2 border-b border-border/60 bg-muted/25 px-2 py-1.5",
|
|
44994
45270
|
children: [
|
|
44995
|
-
/* @__PURE__ */
|
|
45271
|
+
/* @__PURE__ */ jsx102(
|
|
44996
45272
|
"span",
|
|
44997
45273
|
{
|
|
44998
45274
|
"data-ueditor-formula-cell-label": "",
|
|
@@ -45000,8 +45276,8 @@ function TableFormulaBar({ editor }) {
|
|
|
45000
45276
|
children: selectedCell.label
|
|
45001
45277
|
}
|
|
45002
45278
|
),
|
|
45003
|
-
/* @__PURE__ */
|
|
45004
|
-
/* @__PURE__ */
|
|
45279
|
+
/* @__PURE__ */ jsx102(Sigma3, { "aria-hidden": "true", className: "h-4 w-4 shrink-0 text-primary" }),
|
|
45280
|
+
/* @__PURE__ */ jsx102(
|
|
45005
45281
|
"input",
|
|
45006
45282
|
{
|
|
45007
45283
|
ref: inputRef,
|
|
@@ -45022,18 +45298,18 @@ function TableFormulaBar({ editor }) {
|
|
|
45022
45298
|
className: "h-7 min-w-0 flex-1 rounded-md border border-border/60 bg-background px-2 font-mono text-sm text-foreground outline-none focus:border-primary/40 focus:ring-2 focus:ring-primary/15"
|
|
45023
45299
|
}
|
|
45024
45300
|
),
|
|
45025
|
-
selectedCell.formulaState === "error" && /* @__PURE__ */
|
|
45301
|
+
selectedCell.formulaState === "error" && /* @__PURE__ */ jsxs83(
|
|
45026
45302
|
"span",
|
|
45027
45303
|
{
|
|
45028
45304
|
role: "status",
|
|
45029
45305
|
className: "hidden shrink-0 items-center gap-1 text-xs font-medium text-destructive sm:inline-flex",
|
|
45030
45306
|
children: [
|
|
45031
|
-
/* @__PURE__ */
|
|
45307
|
+
/* @__PURE__ */ jsx102(AlertCircle5, { "aria-hidden": "true", className: "h-3.5 w-3.5" }),
|
|
45032
45308
|
t("tableMenu.formulaError")
|
|
45033
45309
|
]
|
|
45034
45310
|
}
|
|
45035
45311
|
),
|
|
45036
|
-
/* @__PURE__ */
|
|
45312
|
+
/* @__PURE__ */ jsx102(
|
|
45037
45313
|
"button",
|
|
45038
45314
|
{
|
|
45039
45315
|
type: "button",
|
|
@@ -45041,10 +45317,10 @@ function TableFormulaBar({ editor }) {
|
|
|
45041
45317
|
"aria-label": t("tableMenu.apply"),
|
|
45042
45318
|
title: t("tableMenu.apply"),
|
|
45043
45319
|
className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-primary text-primary-foreground transition-colors hover:bg-primary/90",
|
|
45044
|
-
children: /* @__PURE__ */
|
|
45320
|
+
children: /* @__PURE__ */ jsx102(Check14, { "aria-hidden": "true", className: "h-4 w-4" })
|
|
45045
45321
|
}
|
|
45046
45322
|
),
|
|
45047
|
-
/* @__PURE__ */
|
|
45323
|
+
/* @__PURE__ */ jsx102(
|
|
45048
45324
|
"button",
|
|
45049
45325
|
{
|
|
45050
45326
|
type: "button",
|
|
@@ -45055,10 +45331,10 @@ function TableFormulaBar({ editor }) {
|
|
|
45055
45331
|
"aria-label": t("tableMenu.convertToValue"),
|
|
45056
45332
|
title: t("tableMenu.convertToValue"),
|
|
45057
45333
|
className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md border border-border/60 bg-background text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
|
|
45058
|
-
children: /* @__PURE__ */
|
|
45334
|
+
children: /* @__PURE__ */ jsx102(Hash2, { "aria-hidden": "true", className: "h-4 w-4" })
|
|
45059
45335
|
}
|
|
45060
45336
|
),
|
|
45061
|
-
/* @__PURE__ */
|
|
45337
|
+
/* @__PURE__ */ jsx102(
|
|
45062
45338
|
"button",
|
|
45063
45339
|
{
|
|
45064
45340
|
type: "button",
|
|
@@ -45069,7 +45345,7 @@ function TableFormulaBar({ editor }) {
|
|
|
45069
45345
|
"aria-label": t("tableMenu.clearCell"),
|
|
45070
45346
|
title: t("tableMenu.clearCell"),
|
|
45071
45347
|
className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md border border-destructive/30 bg-background text-destructive transition-colors hover:bg-destructive/10",
|
|
45072
|
-
children: /* @__PURE__ */
|
|
45348
|
+
children: /* @__PURE__ */ jsx102(Trash26, { "aria-hidden": "true", className: "h-4 w-4" })
|
|
45073
45349
|
}
|
|
45074
45350
|
)
|
|
45075
45351
|
]
|
|
@@ -45078,7 +45354,7 @@ function TableFormulaBar({ editor }) {
|
|
|
45078
45354
|
}
|
|
45079
45355
|
|
|
45080
45356
|
// src/components/UEditor/UEditor.tsx
|
|
45081
|
-
import { jsx as
|
|
45357
|
+
import { jsx as jsx103, jsxs as jsxs84 } from "react/jsx-runtime";
|
|
45082
45358
|
var UEditor = React91.forwardRef(({
|
|
45083
45359
|
content = "",
|
|
45084
45360
|
onChange,
|
|
@@ -45346,7 +45622,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45346
45622
|
}
|
|
45347
45623
|
}, [content, editor]);
|
|
45348
45624
|
if (!editor) {
|
|
45349
|
-
return /* @__PURE__ */
|
|
45625
|
+
return /* @__PURE__ */ jsx103(
|
|
45350
45626
|
"div",
|
|
45351
45627
|
{
|
|
45352
45628
|
className: cn("w-full border bg-background flex items-center justify-center text-muted-foreground", className),
|
|
@@ -45355,7 +45631,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45355
45631
|
}
|
|
45356
45632
|
);
|
|
45357
45633
|
}
|
|
45358
|
-
return /* @__PURE__ */
|
|
45634
|
+
return /* @__PURE__ */ jsxs84(
|
|
45359
45635
|
"div",
|
|
45360
45636
|
{
|
|
45361
45637
|
className: cn(
|
|
@@ -45371,7 +45647,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45371
45647
|
className
|
|
45372
45648
|
),
|
|
45373
45649
|
children: [
|
|
45374
|
-
editable && showMenuBar && /* @__PURE__ */
|
|
45650
|
+
editable && showMenuBar && /* @__PURE__ */ jsx103(
|
|
45375
45651
|
MenuBar,
|
|
45376
45652
|
{
|
|
45377
45653
|
editor,
|
|
@@ -45386,7 +45662,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45386
45662
|
onPreview
|
|
45387
45663
|
}
|
|
45388
45664
|
),
|
|
45389
|
-
editable && showToolbar && /* @__PURE__ */
|
|
45665
|
+
editable && showToolbar && /* @__PURE__ */ jsx103(
|
|
45390
45666
|
EditorToolbar,
|
|
45391
45667
|
{
|
|
45392
45668
|
editor,
|
|
@@ -45401,8 +45677,8 @@ var UEditor = React91.forwardRef(({
|
|
|
45401
45677
|
letterSpacings
|
|
45402
45678
|
}
|
|
45403
45679
|
),
|
|
45404
|
-
editable && /* @__PURE__ */
|
|
45405
|
-
editable && showBubbleMenu && /* @__PURE__ */
|
|
45680
|
+
editable && /* @__PURE__ */ jsx103(TableFormulaBar, { editor }),
|
|
45681
|
+
editable && showBubbleMenu && /* @__PURE__ */ jsx103(
|
|
45406
45682
|
CustomBubbleMenu,
|
|
45407
45683
|
{
|
|
45408
45684
|
editor,
|
|
@@ -45410,8 +45686,8 @@ var UEditor = React91.forwardRef(({
|
|
|
45410
45686
|
lineHeights
|
|
45411
45687
|
}
|
|
45412
45688
|
),
|
|
45413
|
-
editable && showFloatingMenu && /* @__PURE__ */
|
|
45414
|
-
/* @__PURE__ */
|
|
45689
|
+
editable && showFloatingMenu && /* @__PURE__ */ jsx103(CustomFloatingMenu, { editor }),
|
|
45690
|
+
/* @__PURE__ */ jsxs84(
|
|
45415
45691
|
"div",
|
|
45416
45692
|
{
|
|
45417
45693
|
ref: (node) => {
|
|
@@ -45424,7 +45700,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45424
45700
|
maxHeight
|
|
45425
45701
|
},
|
|
45426
45702
|
children: [
|
|
45427
|
-
/* @__PURE__ */
|
|
45703
|
+
/* @__PURE__ */ jsx103(
|
|
45428
45704
|
"span",
|
|
45429
45705
|
{
|
|
45430
45706
|
ref: tableColumnGuideRef,
|
|
@@ -45432,7 +45708,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45432
45708
|
className: "pointer-events-none absolute z-20 bg-primary opacity-0 transition-opacity duration-100"
|
|
45433
45709
|
}
|
|
45434
45710
|
),
|
|
45435
|
-
/* @__PURE__ */
|
|
45711
|
+
/* @__PURE__ */ jsx103(
|
|
45436
45712
|
"span",
|
|
45437
45713
|
{
|
|
45438
45714
|
ref: tableRowGuideRef,
|
|
@@ -45440,7 +45716,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45440
45716
|
className: "pointer-events-none absolute z-20 bg-primary opacity-0 transition-opacity duration-100"
|
|
45441
45717
|
}
|
|
45442
45718
|
),
|
|
45443
|
-
/* @__PURE__ */
|
|
45719
|
+
/* @__PURE__ */ jsx103(
|
|
45444
45720
|
"span",
|
|
45445
45721
|
{
|
|
45446
45722
|
ref: activeTableCellHighlightRef,
|
|
@@ -45449,7 +45725,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45449
45725
|
className: "pointer-events-none hidden absolute z-20 rounded-[2px] border-2 border-primary bg-primary/10"
|
|
45450
45726
|
}
|
|
45451
45727
|
),
|
|
45452
|
-
/* @__PURE__ */
|
|
45728
|
+
/* @__PURE__ */ jsx103(
|
|
45453
45729
|
"div",
|
|
45454
45730
|
{
|
|
45455
45731
|
ref: formulaCoordinateOverlayRef,
|
|
@@ -45457,7 +45733,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45457
45733
|
className: "pointer-events-none absolute inset-0 z-[35] hidden overflow-visible"
|
|
45458
45734
|
}
|
|
45459
45735
|
),
|
|
45460
|
-
formulaRangeHighlight && /* @__PURE__ */
|
|
45736
|
+
formulaRangeHighlight && /* @__PURE__ */ jsx103(
|
|
45461
45737
|
"span",
|
|
45462
45738
|
{
|
|
45463
45739
|
"aria-hidden": "true",
|
|
@@ -45475,8 +45751,15 @@ var UEditor = React91.forwardRef(({
|
|
|
45475
45751
|
}
|
|
45476
45752
|
}
|
|
45477
45753
|
),
|
|
45478
|
-
editable && /* @__PURE__ */
|
|
45479
|
-
|
|
45754
|
+
editable && /* @__PURE__ */ jsx103(
|
|
45755
|
+
TableControls,
|
|
45756
|
+
{
|
|
45757
|
+
editor,
|
|
45758
|
+
containerRef: editorContentRef,
|
|
45759
|
+
showCellInspector: showBubbleMenu
|
|
45760
|
+
}
|
|
45761
|
+
),
|
|
45762
|
+
/* @__PURE__ */ jsx103(
|
|
45480
45763
|
EditorContent,
|
|
45481
45764
|
{
|
|
45482
45765
|
editor,
|
|
@@ -45486,7 +45769,7 @@ var UEditor = React91.forwardRef(({
|
|
|
45486
45769
|
]
|
|
45487
45770
|
}
|
|
45488
45771
|
),
|
|
45489
|
-
showFooter && showCharacterCount && /* @__PURE__ */
|
|
45772
|
+
showFooter && showCharacterCount && /* @__PURE__ */ jsx103(CharacterCountDisplay, { editor, maxCharacters })
|
|
45490
45773
|
]
|
|
45491
45774
|
}
|
|
45492
45775
|
);
|