@lumir-company/editor 0.4.15 → 0.4.16
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/README.md +50 -0
- package/dist/index.d.mts +81 -1
- package/dist/index.d.ts +81 -1
- package/dist/index.js +869 -535
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +784 -450
- package/dist/index.mjs.map +1 -1
- package/dist/style.css +17 -0
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
// src/components/LumirEditor.tsx
|
|
4
|
-
import { useEffect as
|
|
4
|
+
import { useEffect as useEffect11, useMemo as useMemo7, useCallback as useCallback20, useState as useState12, useRef as useRef12 } from "react";
|
|
5
5
|
import {
|
|
6
6
|
useCreateBlockNote,
|
|
7
7
|
SideMenu as BlockSideMenu,
|
|
@@ -11,8 +11,8 @@ import {
|
|
|
11
11
|
getDefaultReactSlashMenuItems,
|
|
12
12
|
LinkToolbarController,
|
|
13
13
|
FormattingToolbarController,
|
|
14
|
-
useBlockNoteEditor as
|
|
15
|
-
useComponentsContext as
|
|
14
|
+
useBlockNoteEditor as useBlockNoteEditor6,
|
|
15
|
+
useComponentsContext as useComponentsContext5,
|
|
16
16
|
EditLinkButton,
|
|
17
17
|
OpenLinkButton,
|
|
18
18
|
DeleteLinkButton
|
|
@@ -1221,9 +1221,32 @@ var VideoBlock = createReactBlockSpec2(
|
|
|
1221
1221
|
}
|
|
1222
1222
|
);
|
|
1223
1223
|
|
|
1224
|
+
// src/styles/FontSizeStyle.tsx
|
|
1225
|
+
import { createReactStyleSpec } from "@blocknote/react";
|
|
1226
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
1227
|
+
var FontSize = createReactStyleSpec(
|
|
1228
|
+
{
|
|
1229
|
+
type: "fontSize",
|
|
1230
|
+
propSchema: "string"
|
|
1231
|
+
},
|
|
1232
|
+
{
|
|
1233
|
+
render: (props) => /* @__PURE__ */ jsx3("span", { style: { fontSize: props.value }, ref: props.contentRef })
|
|
1234
|
+
}
|
|
1235
|
+
);
|
|
1236
|
+
var FONT_SIZE_PRESETS = [
|
|
1237
|
+
"10px",
|
|
1238
|
+
"12px",
|
|
1239
|
+
"14px",
|
|
1240
|
+
"16px",
|
|
1241
|
+
"18px",
|
|
1242
|
+
"20px",
|
|
1243
|
+
"24px",
|
|
1244
|
+
"28px"
|
|
1245
|
+
];
|
|
1246
|
+
|
|
1224
1247
|
// src/blocks/HtmlPreview.tsx
|
|
1225
1248
|
import { useState as useState3, useRef as useRef3, useCallback as useCallback3, useEffect as useEffect3 } from "react";
|
|
1226
|
-
import { jsx as
|
|
1249
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
1227
1250
|
var MIN_HEIGHT = 100;
|
|
1228
1251
|
var MAX_HEIGHT = 1200;
|
|
1229
1252
|
var ensureCharset = (html) => {
|
|
@@ -1398,7 +1421,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1398
1421
|
},
|
|
1399
1422
|
onClick: () => setIsExpanded(!isExpanded),
|
|
1400
1423
|
children: [
|
|
1401
|
-
/* @__PURE__ */
|
|
1424
|
+
/* @__PURE__ */ jsx4(
|
|
1402
1425
|
"svg",
|
|
1403
1426
|
{
|
|
1404
1427
|
width: "16",
|
|
@@ -1413,15 +1436,15 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1413
1436
|
transform: isExpanded ? "rotate(180deg)" : "rotate(0deg)",
|
|
1414
1437
|
transition: "transform 0.2s"
|
|
1415
1438
|
},
|
|
1416
|
-
children: /* @__PURE__ */
|
|
1439
|
+
children: /* @__PURE__ */ jsx4("polyline", { points: "6 9 12 15 18 9" })
|
|
1417
1440
|
}
|
|
1418
1441
|
),
|
|
1419
|
-
/* @__PURE__ */
|
|
1442
|
+
/* @__PURE__ */ jsx4("span", { style: { fontWeight: 500, fontSize: "14px" }, children: fileName })
|
|
1420
1443
|
]
|
|
1421
1444
|
}
|
|
1422
1445
|
),
|
|
1423
1446
|
/* @__PURE__ */ jsxs3("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
|
|
1424
|
-
/* @__PURE__ */
|
|
1447
|
+
/* @__PURE__ */ jsx4(
|
|
1425
1448
|
"button",
|
|
1426
1449
|
{
|
|
1427
1450
|
onClick: handleOpenNewWindow,
|
|
@@ -1456,15 +1479,15 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1456
1479
|
strokeLinecap: "round",
|
|
1457
1480
|
strokeLinejoin: "round",
|
|
1458
1481
|
children: [
|
|
1459
|
-
/* @__PURE__ */
|
|
1460
|
-
/* @__PURE__ */
|
|
1461
|
-
/* @__PURE__ */
|
|
1482
|
+
/* @__PURE__ */ jsx4("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
|
|
1483
|
+
/* @__PURE__ */ jsx4("polyline", { points: "15 3 21 3 21 9" }),
|
|
1484
|
+
/* @__PURE__ */ jsx4("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
|
|
1462
1485
|
]
|
|
1463
1486
|
}
|
|
1464
1487
|
)
|
|
1465
1488
|
}
|
|
1466
1489
|
),
|
|
1467
|
-
/* @__PURE__ */
|
|
1490
|
+
/* @__PURE__ */ jsx4(
|
|
1468
1491
|
"button",
|
|
1469
1492
|
{
|
|
1470
1493
|
onClick: handleExport,
|
|
@@ -1499,9 +1522,9 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1499
1522
|
strokeLinecap: "round",
|
|
1500
1523
|
strokeLinejoin: "round",
|
|
1501
1524
|
children: [
|
|
1502
|
-
/* @__PURE__ */
|
|
1503
|
-
/* @__PURE__ */
|
|
1504
|
-
/* @__PURE__ */
|
|
1525
|
+
/* @__PURE__ */ jsx4("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
|
|
1526
|
+
/* @__PURE__ */ jsx4("polyline", { points: "7 10 12 15 17 10" }),
|
|
1527
|
+
/* @__PURE__ */ jsx4("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
|
|
1505
1528
|
]
|
|
1506
1529
|
}
|
|
1507
1530
|
)
|
|
@@ -1520,7 +1543,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1520
1543
|
position: "relative"
|
|
1521
1544
|
},
|
|
1522
1545
|
children: [
|
|
1523
|
-
/* @__PURE__ */
|
|
1546
|
+
/* @__PURE__ */ jsx4(
|
|
1524
1547
|
"iframe",
|
|
1525
1548
|
{
|
|
1526
1549
|
src: blobUrl || "about:blank",
|
|
@@ -1537,7 +1560,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1537
1560
|
loading: "lazy"
|
|
1538
1561
|
}
|
|
1539
1562
|
),
|
|
1540
|
-
/* @__PURE__ */
|
|
1563
|
+
/* @__PURE__ */ jsx4(
|
|
1541
1564
|
"div",
|
|
1542
1565
|
{
|
|
1543
1566
|
onMouseDown: handleResizeStart,
|
|
@@ -1562,7 +1585,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1562
1585
|
e.currentTarget.style.backgroundColor = "transparent";
|
|
1563
1586
|
}
|
|
1564
1587
|
},
|
|
1565
|
-
children: /* @__PURE__ */
|
|
1588
|
+
children: /* @__PURE__ */ jsx4(
|
|
1566
1589
|
"div",
|
|
1567
1590
|
{
|
|
1568
1591
|
style: {
|
|
@@ -1592,64 +1615,68 @@ var schema = BlockNoteSchema.create({
|
|
|
1592
1615
|
video: VideoBlock
|
|
1593
1616
|
},
|
|
1594
1617
|
inlineContentSpecs: defaultInlineContentSpecs,
|
|
1595
|
-
styleSpecs:
|
|
1618
|
+
styleSpecs: {
|
|
1619
|
+
...defaultStyleSpecs,
|
|
1620
|
+
// 인라인 글자 크기. 저장 JSON 직렬화는 형제 키 방식(font-size-serialization.ts) 사용.
|
|
1621
|
+
fontSize: FontSize
|
|
1622
|
+
}
|
|
1596
1623
|
});
|
|
1597
1624
|
|
|
1598
1625
|
// src/components/FloatingMenu/index.tsx
|
|
1599
|
-
import { useState as
|
|
1626
|
+
import { useState as useState8, useEffect as useEffect8, useRef as useRef9 } from "react";
|
|
1600
1627
|
|
|
1601
1628
|
// src/components/FloatingMenu/Icons.tsx
|
|
1602
|
-
import { jsx as
|
|
1629
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
1603
1630
|
var Icons = {
|
|
1604
|
-
undo: /* @__PURE__ */
|
|
1605
|
-
redo: /* @__PURE__ */
|
|
1606
|
-
bold: /* @__PURE__ */
|
|
1607
|
-
italic: /* @__PURE__ */
|
|
1608
|
-
underline: /* @__PURE__ */
|
|
1609
|
-
strikethrough: /* @__PURE__ */
|
|
1610
|
-
alignLeft: /* @__PURE__ */
|
|
1611
|
-
alignCenter: /* @__PURE__ */
|
|
1612
|
-
alignRight: /* @__PURE__ */
|
|
1613
|
-
bulletList: /* @__PURE__ */
|
|
1614
|
-
numberedList: /* @__PURE__ */
|
|
1615
|
-
image: /* @__PURE__ */
|
|
1616
|
-
expandMore: /* @__PURE__ */
|
|
1617
|
-
textColor: /* @__PURE__ */
|
|
1631
|
+
undo: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z" }) }),
|
|
1632
|
+
redo: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z" }) }),
|
|
1633
|
+
bold: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z" }) }),
|
|
1634
|
+
italic: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z" }) }),
|
|
1635
|
+
underline: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z" }) }),
|
|
1636
|
+
strikethrough: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M10 19h4v-3h-4v3zM5 4v3h5v3h4V7h5V4H5zM3 14h18v-2H3v2z" }) }),
|
|
1637
|
+
alignLeft: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
|
|
1638
|
+
alignCenter: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
|
|
1639
|
+
alignRight: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
|
|
1640
|
+
bulletList: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6c-.83 0-1.5.67-1.5 1.5S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.68-1.5 1.5s.68 1.5 1.5 1.5 1.5-.68 1.5-1.5-.67-1.5-1.5-1.5zM7 19h14v-2H7v2zm0-6h14v-2H7v2zm0-8v2h14V5H7z" }) }),
|
|
1641
|
+
numberedList: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
|
|
1642
|
+
image: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" }) }),
|
|
1643
|
+
expandMore: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx5("path", { d: "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" }) }),
|
|
1644
|
+
textColor: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M11 3L5.5 17h2.25l1.12-3h6.25l1.12 3h2.25L13 3h-2zm-1.38 9L12 5.67 14.38 12H9.62z" }) }),
|
|
1618
1645
|
bgColor: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
1619
|
-
/* @__PURE__ */
|
|
1620
|
-
/* @__PURE__ */
|
|
1646
|
+
/* @__PURE__ */ jsx5("path", { d: "M16.56 8.94L7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10L10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" }),
|
|
1647
|
+
/* @__PURE__ */ jsx5("path", { fillOpacity: ".36", d: "M0 20h24v4H0z" })
|
|
1621
1648
|
] }),
|
|
1622
|
-
link: /* @__PURE__ */
|
|
1623
|
-
chevronRight: /* @__PURE__ */
|
|
1624
|
-
chevronLeft: /* @__PURE__ */
|
|
1625
|
-
table: /* @__PURE__ */
|
|
1626
|
-
htmlFile: /* @__PURE__ */
|
|
1649
|
+
link: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z" }) }),
|
|
1650
|
+
chevronRight: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) }),
|
|
1651
|
+
chevronLeft: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) }),
|
|
1652
|
+
table: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M20 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM10 17H5v-2h5v2zm0-4H5v-2h5v2zm0-4H5V7h5v2zm9 8h-7v-2h7v2zm0-4h-7v-2h7v2zm0-4h-7V7h7v2z" }) }),
|
|
1653
|
+
htmlFile: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 2v5h5l-5-5zm-4 14H7v-1h2v1zm0-2H7v-1h2v1zm-2-2h2v1H7v-1zm4 4h-2v-1h2v1zm0-2h-2v-1h2v1zm0-2h-2v-1h2v1zm6 4h-4v-1h4v1zm0-2h-4v-1h4v1zm0-2h-4v-1h4v1z" }) })
|
|
1627
1654
|
};
|
|
1628
1655
|
var BlockTypeIcons = {
|
|
1629
|
-
paragraph: /* @__PURE__ */
|
|
1630
|
-
h1: /* @__PURE__ */
|
|
1631
|
-
h2: /* @__PURE__ */
|
|
1632
|
-
h3: /* @__PURE__ */
|
|
1633
|
-
h4: /* @__PURE__ */
|
|
1634
|
-
h5: /* @__PURE__ */
|
|
1635
|
-
h6: /* @__PURE__ */
|
|
1656
|
+
paragraph: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M5 5h14v2H5zM5 11h14v2H5zM5 17h10v2H5z" }) }),
|
|
1657
|
+
h1: /* @__PURE__ */ jsx5("span", { className: "lumir-block-icon-text", children: "H1" }),
|
|
1658
|
+
h2: /* @__PURE__ */ jsx5("span", { className: "lumir-block-icon-text", children: "H2" }),
|
|
1659
|
+
h3: /* @__PURE__ */ jsx5("span", { className: "lumir-block-icon-text", children: "H3" }),
|
|
1660
|
+
h4: /* @__PURE__ */ jsx5("span", { className: "lumir-block-icon-text", children: "H4" }),
|
|
1661
|
+
h5: /* @__PURE__ */ jsx5("span", { className: "lumir-block-icon-text", children: "H5" }),
|
|
1662
|
+
h6: /* @__PURE__ */ jsx5("span", { className: "lumir-block-icon-text", children: "H6" }),
|
|
1636
1663
|
toggleH1: /* @__PURE__ */ jsxs4("span", { className: "lumir-block-icon-toggle", children: [
|
|
1637
|
-
/* @__PURE__ */
|
|
1638
|
-
/* @__PURE__ */
|
|
1664
|
+
/* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ jsx5("path", { d: "M8 5v14l11-7z" }) }),
|
|
1665
|
+
/* @__PURE__ */ jsx5("span", { children: "H1" })
|
|
1639
1666
|
] }),
|
|
1640
1667
|
toggleH2: /* @__PURE__ */ jsxs4("span", { className: "lumir-block-icon-toggle", children: [
|
|
1641
|
-
/* @__PURE__ */
|
|
1642
|
-
/* @__PURE__ */
|
|
1668
|
+
/* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ jsx5("path", { d: "M8 5v14l11-7z" }) }),
|
|
1669
|
+
/* @__PURE__ */ jsx5("span", { children: "H2" })
|
|
1643
1670
|
] }),
|
|
1644
1671
|
toggleH3: /* @__PURE__ */ jsxs4("span", { className: "lumir-block-icon-toggle", children: [
|
|
1645
|
-
/* @__PURE__ */
|
|
1646
|
-
/* @__PURE__ */
|
|
1672
|
+
/* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ jsx5("path", { d: "M8 5v14l11-7z" }) }),
|
|
1673
|
+
/* @__PURE__ */ jsx5("span", { children: "H3" })
|
|
1647
1674
|
] }),
|
|
1648
|
-
quote: /* @__PURE__ */
|
|
1649
|
-
codeBlock: /* @__PURE__ */
|
|
1675
|
+
quote: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z" }) }),
|
|
1676
|
+
codeBlock: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z" }) }),
|
|
1650
1677
|
toggleList: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
1651
|
-
/* @__PURE__ */
|
|
1652
|
-
/* @__PURE__ */
|
|
1678
|
+
/* @__PURE__ */ jsx5("path", { d: "M10 6h10v2H10zM10 11h10v2H10zM10 16h10v2H10z" }),
|
|
1679
|
+
/* @__PURE__ */ jsx5(
|
|
1653
1680
|
"path",
|
|
1654
1681
|
{
|
|
1655
1682
|
d: "M4 8l4 4-4 4",
|
|
@@ -1662,14 +1689,14 @@ var BlockTypeIcons = {
|
|
|
1662
1689
|
)
|
|
1663
1690
|
] }),
|
|
1664
1691
|
bulletList: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
1665
|
-
/* @__PURE__ */
|
|
1666
|
-
/* @__PURE__ */
|
|
1667
|
-
/* @__PURE__ */
|
|
1668
|
-
/* @__PURE__ */
|
|
1692
|
+
/* @__PURE__ */ jsx5("circle", { cx: "4", cy: "6", r: "1.5" }),
|
|
1693
|
+
/* @__PURE__ */ jsx5("circle", { cx: "4", cy: "12", r: "1.5" }),
|
|
1694
|
+
/* @__PURE__ */ jsx5("circle", { cx: "4", cy: "18", r: "1.5" }),
|
|
1695
|
+
/* @__PURE__ */ jsx5("path", { d: "M8 5h12v2H8zM8 11h12v2H8zM8 17h12v2H8z" })
|
|
1669
1696
|
] }),
|
|
1670
|
-
numberedList: /* @__PURE__ */
|
|
1697
|
+
numberedList: /* @__PURE__ */ jsx5("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx5("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
|
|
1671
1698
|
checkList: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
1672
|
-
/* @__PURE__ */
|
|
1699
|
+
/* @__PURE__ */ jsx5(
|
|
1673
1700
|
"rect",
|
|
1674
1701
|
{
|
|
1675
1702
|
x: "3",
|
|
@@ -1682,7 +1709,7 @@ var BlockTypeIcons = {
|
|
|
1682
1709
|
strokeWidth: "1.5"
|
|
1683
1710
|
}
|
|
1684
1711
|
),
|
|
1685
|
-
/* @__PURE__ */
|
|
1712
|
+
/* @__PURE__ */ jsx5(
|
|
1686
1713
|
"path",
|
|
1687
1714
|
{
|
|
1688
1715
|
d: "M4.5 7l1.5 1.5 3-3",
|
|
@@ -1693,8 +1720,8 @@ var BlockTypeIcons = {
|
|
|
1693
1720
|
strokeLinejoin: "round"
|
|
1694
1721
|
}
|
|
1695
1722
|
),
|
|
1696
|
-
/* @__PURE__ */
|
|
1697
|
-
/* @__PURE__ */
|
|
1723
|
+
/* @__PURE__ */ jsx5("path", { d: "M12 6h8v2h-8z" }),
|
|
1724
|
+
/* @__PURE__ */ jsx5(
|
|
1698
1725
|
"rect",
|
|
1699
1726
|
{
|
|
1700
1727
|
x: "3",
|
|
@@ -1707,17 +1734,17 @@ var BlockTypeIcons = {
|
|
|
1707
1734
|
strokeWidth: "1.5"
|
|
1708
1735
|
}
|
|
1709
1736
|
),
|
|
1710
|
-
/* @__PURE__ */
|
|
1737
|
+
/* @__PURE__ */ jsx5("path", { d: "M12 16h8v2h-8z" })
|
|
1711
1738
|
] })
|
|
1712
1739
|
};
|
|
1713
1740
|
|
|
1714
1741
|
// src/components/FloatingMenu/components/ToolbarDivider.tsx
|
|
1715
|
-
import { jsx as
|
|
1716
|
-
var ToolbarDivider = () => /* @__PURE__ */
|
|
1742
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
1743
|
+
var ToolbarDivider = () => /* @__PURE__ */ jsx6("div", { className: "lumir-toolbar-divider" });
|
|
1717
1744
|
|
|
1718
1745
|
// src/components/FloatingMenu/components/UndoRedoButtons.tsx
|
|
1719
1746
|
import { useCallback as useCallback4 } from "react";
|
|
1720
|
-
import { jsx as
|
|
1747
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
1721
1748
|
var UndoRedoButtons = ({ editor }) => {
|
|
1722
1749
|
const handleUndo = useCallback4(() => {
|
|
1723
1750
|
try {
|
|
@@ -1737,7 +1764,7 @@ var UndoRedoButtons = ({ editor }) => {
|
|
|
1737
1764
|
e.preventDefault();
|
|
1738
1765
|
}, []);
|
|
1739
1766
|
return /* @__PURE__ */ jsxs5("div", { className: "lumir-toolbar-group", children: [
|
|
1740
|
-
/* @__PURE__ */
|
|
1767
|
+
/* @__PURE__ */ jsx7(
|
|
1741
1768
|
"button",
|
|
1742
1769
|
{
|
|
1743
1770
|
className: "lumir-toolbar-btn",
|
|
@@ -1748,7 +1775,7 @@ var UndoRedoButtons = ({ editor }) => {
|
|
|
1748
1775
|
children: Icons.undo
|
|
1749
1776
|
}
|
|
1750
1777
|
),
|
|
1751
|
-
/* @__PURE__ */
|
|
1778
|
+
/* @__PURE__ */ jsx7(
|
|
1752
1779
|
"button",
|
|
1753
1780
|
{
|
|
1754
1781
|
className: "lumir-toolbar-btn",
|
|
@@ -1764,7 +1791,7 @@ var UndoRedoButtons = ({ editor }) => {
|
|
|
1764
1791
|
|
|
1765
1792
|
// src/components/FloatingMenu/components/TextStyleButton.tsx
|
|
1766
1793
|
import { useCallback as useCallback5 } from "react";
|
|
1767
|
-
import { jsx as
|
|
1794
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
1768
1795
|
var iconMap = {
|
|
1769
1796
|
bold: Icons.bold,
|
|
1770
1797
|
italic: Icons.italic,
|
|
@@ -1800,7 +1827,7 @@ var TextStyleButton = ({
|
|
|
1800
1827
|
const handleMouseDown = useCallback5((e) => {
|
|
1801
1828
|
e.preventDefault();
|
|
1802
1829
|
}, []);
|
|
1803
|
-
return /* @__PURE__ */
|
|
1830
|
+
return /* @__PURE__ */ jsx8(
|
|
1804
1831
|
"button",
|
|
1805
1832
|
{
|
|
1806
1833
|
className: cn("lumir-toolbar-btn", isActive && "is-active"),
|
|
@@ -1875,7 +1902,7 @@ function getFirstSelectedCellAttr(editor, attr) {
|
|
|
1875
1902
|
}
|
|
1876
1903
|
|
|
1877
1904
|
// src/components/FloatingMenu/components/AlignButton.tsx
|
|
1878
|
-
import { jsx as
|
|
1905
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
1879
1906
|
var iconMap2 = {
|
|
1880
1907
|
left: Icons.alignLeft,
|
|
1881
1908
|
center: Icons.alignCenter,
|
|
@@ -1918,7 +1945,7 @@ var AlignButton = ({
|
|
|
1918
1945
|
const handleMouseDown = useCallback6((e) => {
|
|
1919
1946
|
e.preventDefault();
|
|
1920
1947
|
}, []);
|
|
1921
|
-
return /* @__PURE__ */
|
|
1948
|
+
return /* @__PURE__ */ jsx9(
|
|
1922
1949
|
"button",
|
|
1923
1950
|
{
|
|
1924
1951
|
className: cn("lumir-toolbar-btn", isActive && "is-active"),
|
|
@@ -1933,7 +1960,7 @@ var AlignButton = ({
|
|
|
1933
1960
|
|
|
1934
1961
|
// src/components/FloatingMenu/components/ListButton.tsx
|
|
1935
1962
|
import { useCallback as useCallback7 } from "react";
|
|
1936
|
-
import { jsx as
|
|
1963
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
1937
1964
|
var iconMap3 = {
|
|
1938
1965
|
bullet: Icons.bulletList,
|
|
1939
1966
|
numbered: Icons.numberedList
|
|
@@ -1968,7 +1995,7 @@ var ListButton = ({ editor, type }) => {
|
|
|
1968
1995
|
const handleMouseDown = useCallback7((e) => {
|
|
1969
1996
|
e.preventDefault();
|
|
1970
1997
|
}, []);
|
|
1971
|
-
return /* @__PURE__ */
|
|
1998
|
+
return /* @__PURE__ */ jsx10(
|
|
1972
1999
|
"button",
|
|
1973
2000
|
{
|
|
1974
2001
|
className: cn("lumir-toolbar-btn", isActive && "is-active"),
|
|
@@ -1983,7 +2010,7 @@ var ListButton = ({ editor, type }) => {
|
|
|
1983
2010
|
|
|
1984
2011
|
// src/components/FloatingMenu/components/ImageButton.tsx
|
|
1985
2012
|
import { useCallback as useCallback8 } from "react";
|
|
1986
|
-
import { jsx as
|
|
2013
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
1987
2014
|
var ImageButton = ({
|
|
1988
2015
|
editor,
|
|
1989
2016
|
onImageUpload
|
|
@@ -2016,7 +2043,7 @@ var ImageButton = ({
|
|
|
2016
2043
|
const handleMouseDown = useCallback8((e) => {
|
|
2017
2044
|
e.preventDefault();
|
|
2018
2045
|
}, []);
|
|
2019
|
-
return /* @__PURE__ */
|
|
2046
|
+
return /* @__PURE__ */ jsx11(
|
|
2020
2047
|
"button",
|
|
2021
2048
|
{
|
|
2022
2049
|
className: "lumir-toolbar-btn",
|
|
@@ -2064,7 +2091,7 @@ var getHexFromColorValue = (value, type) => {
|
|
|
2064
2091
|
};
|
|
2065
2092
|
|
|
2066
2093
|
// src/components/FloatingMenu/components/ColorButton.tsx
|
|
2067
|
-
import { jsx as
|
|
2094
|
+
import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
2068
2095
|
var ColorButton = ({ editor, type }) => {
|
|
2069
2096
|
const [isOpen, setIsOpen] = useState4(false);
|
|
2070
2097
|
const [currentColor, setCurrentColor] = useState4("default");
|
|
@@ -2134,7 +2161,7 @@ var ColorButton = ({ editor, type }) => {
|
|
|
2134
2161
|
type: "button",
|
|
2135
2162
|
children: [
|
|
2136
2163
|
type === "text" ? Icons.textColor : Icons.bgColor,
|
|
2137
|
-
/* @__PURE__ */
|
|
2164
|
+
/* @__PURE__ */ jsx12(
|
|
2138
2165
|
"span",
|
|
2139
2166
|
{
|
|
2140
2167
|
className: "lumir-color-indicator",
|
|
@@ -2146,7 +2173,7 @@ var ColorButton = ({ editor, type }) => {
|
|
|
2146
2173
|
]
|
|
2147
2174
|
}
|
|
2148
2175
|
),
|
|
2149
|
-
isOpen && /* @__PURE__ */
|
|
2176
|
+
isOpen && /* @__PURE__ */ jsx12("div", { className: "lumir-dropdown-menu lumir-color-menu", children: /* @__PURE__ */ jsx12("div", { className: "lumir-color-grid", children: colors.map((color) => /* @__PURE__ */ jsx12(
|
|
2150
2177
|
"button",
|
|
2151
2178
|
{
|
|
2152
2179
|
className: cn(
|
|
@@ -2164,9 +2191,101 @@ var ColorButton = ({ editor, type }) => {
|
|
|
2164
2191
|
] });
|
|
2165
2192
|
};
|
|
2166
2193
|
|
|
2167
|
-
// src/components/FloatingMenu/components/
|
|
2194
|
+
// src/components/FloatingMenu/components/FontSizeButton.tsx
|
|
2168
2195
|
import { useState as useState5, useEffect as useEffect5, useRef as useRef5, useCallback as useCallback10 } from "react";
|
|
2169
|
-
import { jsx as
|
|
2196
|
+
import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
2197
|
+
var DEFAULT_LABEL = "\uAE30\uBCF8";
|
|
2198
|
+
var toLabel = (size) => size.replace(/px$/, "");
|
|
2199
|
+
var FontSizeButton = ({ editor }) => {
|
|
2200
|
+
const [isOpen, setIsOpen] = useState5(false);
|
|
2201
|
+
const dropdownRef = useRef5(null);
|
|
2202
|
+
const getCurrentSize = () => {
|
|
2203
|
+
try {
|
|
2204
|
+
return editor?.getActiveStyles?.()?.fontSize || "";
|
|
2205
|
+
} catch {
|
|
2206
|
+
return "";
|
|
2207
|
+
}
|
|
2208
|
+
};
|
|
2209
|
+
const currentSize = getCurrentSize();
|
|
2210
|
+
useEffect5(() => {
|
|
2211
|
+
const handleClickOutside = (e) => {
|
|
2212
|
+
if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
|
|
2213
|
+
setIsOpen(false);
|
|
2214
|
+
}
|
|
2215
|
+
};
|
|
2216
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
2217
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
2218
|
+
}, []);
|
|
2219
|
+
const handleSizeSelect = useCallback10(
|
|
2220
|
+
(size) => {
|
|
2221
|
+
try {
|
|
2222
|
+
if (!editor) return;
|
|
2223
|
+
if (size === "") {
|
|
2224
|
+
editor.removeStyles?.({ fontSize: "" });
|
|
2225
|
+
} else {
|
|
2226
|
+
editor.addStyles?.({ fontSize: size });
|
|
2227
|
+
}
|
|
2228
|
+
setIsOpen(false);
|
|
2229
|
+
setTimeout(() => editor.focus?.());
|
|
2230
|
+
} catch (err) {
|
|
2231
|
+
console.error("Font size apply failed:", err);
|
|
2232
|
+
}
|
|
2233
|
+
},
|
|
2234
|
+
[editor]
|
|
2235
|
+
);
|
|
2236
|
+
const handleMouseDown = useCallback10((e) => {
|
|
2237
|
+
e.preventDefault();
|
|
2238
|
+
}, []);
|
|
2239
|
+
return /* @__PURE__ */ jsxs7("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
|
|
2240
|
+
/* @__PURE__ */ jsxs7(
|
|
2241
|
+
"button",
|
|
2242
|
+
{
|
|
2243
|
+
className: "lumir-dropdown-btn lumir-font-size-btn",
|
|
2244
|
+
onClick: () => setIsOpen(!isOpen),
|
|
2245
|
+
onMouseDown: handleMouseDown,
|
|
2246
|
+
title: "\uAE00\uC790 \uD06C\uAE30",
|
|
2247
|
+
type: "button",
|
|
2248
|
+
children: [
|
|
2249
|
+
/* @__PURE__ */ jsx13("span", { className: "lumir-font-size-label", children: currentSize ? toLabel(currentSize) : DEFAULT_LABEL }),
|
|
2250
|
+
Icons.expandMore
|
|
2251
|
+
]
|
|
2252
|
+
}
|
|
2253
|
+
),
|
|
2254
|
+
isOpen && /* @__PURE__ */ jsxs7("div", { className: "lumir-dropdown-menu lumir-font-size-menu", children: [
|
|
2255
|
+
/* @__PURE__ */ jsx13(
|
|
2256
|
+
"button",
|
|
2257
|
+
{
|
|
2258
|
+
className: cn(
|
|
2259
|
+
"lumir-dropdown-item",
|
|
2260
|
+
currentSize === "" && "is-active"
|
|
2261
|
+
),
|
|
2262
|
+
onClick: () => handleSizeSelect(""),
|
|
2263
|
+
onMouseDown: handleMouseDown,
|
|
2264
|
+
type: "button",
|
|
2265
|
+
children: DEFAULT_LABEL
|
|
2266
|
+
}
|
|
2267
|
+
),
|
|
2268
|
+
FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ jsx13(
|
|
2269
|
+
"button",
|
|
2270
|
+
{
|
|
2271
|
+
className: cn(
|
|
2272
|
+
"lumir-dropdown-item",
|
|
2273
|
+
currentSize === size && "is-active"
|
|
2274
|
+
),
|
|
2275
|
+
onClick: () => handleSizeSelect(size),
|
|
2276
|
+
onMouseDown: handleMouseDown,
|
|
2277
|
+
type: "button",
|
|
2278
|
+
children: toLabel(size)
|
|
2279
|
+
},
|
|
2280
|
+
size
|
|
2281
|
+
))
|
|
2282
|
+
] })
|
|
2283
|
+
] });
|
|
2284
|
+
};
|
|
2285
|
+
|
|
2286
|
+
// src/components/FloatingMenu/components/LinkButton.tsx
|
|
2287
|
+
import { useState as useState6, useEffect as useEffect6, useRef as useRef6, useCallback as useCallback11 } from "react";
|
|
2288
|
+
import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
2170
2289
|
var isDangerousProtocol = (url) => {
|
|
2171
2290
|
const trimmedUrl = url.trim().toLowerCase();
|
|
2172
2291
|
const dangerousPatterns = [
|
|
@@ -2192,13 +2311,13 @@ var normalizeUrl = (url) => {
|
|
|
2192
2311
|
return `https://${trimmedUrl}`;
|
|
2193
2312
|
};
|
|
2194
2313
|
var LinkButton = ({ editor }) => {
|
|
2195
|
-
const [isOpen, setIsOpen] =
|
|
2196
|
-
const [linkUrl, setLinkUrl] =
|
|
2197
|
-
const [errorMsg, setErrorMsg] =
|
|
2198
|
-
const dropdownRef =
|
|
2199
|
-
const inputRef =
|
|
2200
|
-
const hasSelectionRef =
|
|
2201
|
-
|
|
2314
|
+
const [isOpen, setIsOpen] = useState6(false);
|
|
2315
|
+
const [linkUrl, setLinkUrl] = useState6("");
|
|
2316
|
+
const [errorMsg, setErrorMsg] = useState6(null);
|
|
2317
|
+
const dropdownRef = useRef6(null);
|
|
2318
|
+
const inputRef = useRef6(null);
|
|
2319
|
+
const hasSelectionRef = useRef6(false);
|
|
2320
|
+
useEffect6(() => {
|
|
2202
2321
|
const handleClickOutside = (e) => {
|
|
2203
2322
|
if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
|
|
2204
2323
|
setIsOpen(false);
|
|
@@ -2209,7 +2328,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2209
2328
|
document.addEventListener("mousedown", handleClickOutside);
|
|
2210
2329
|
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
2211
2330
|
}, []);
|
|
2212
|
-
|
|
2331
|
+
useEffect6(() => {
|
|
2213
2332
|
if (isOpen && inputRef.current) {
|
|
2214
2333
|
try {
|
|
2215
2334
|
const selectedText = editor?.getSelectedText?.() || "";
|
|
@@ -2220,7 +2339,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2220
2339
|
setTimeout(() => inputRef.current?.focus(), 0);
|
|
2221
2340
|
}
|
|
2222
2341
|
}, [isOpen, editor]);
|
|
2223
|
-
const handleSubmit =
|
|
2342
|
+
const handleSubmit = useCallback11(
|
|
2224
2343
|
(e) => {
|
|
2225
2344
|
e?.preventDefault();
|
|
2226
2345
|
setErrorMsg(null);
|
|
@@ -2247,15 +2366,15 @@ var LinkButton = ({ editor }) => {
|
|
|
2247
2366
|
},
|
|
2248
2367
|
[editor, linkUrl]
|
|
2249
2368
|
);
|
|
2250
|
-
const handleCancel =
|
|
2369
|
+
const handleCancel = useCallback11(() => {
|
|
2251
2370
|
setIsOpen(false);
|
|
2252
2371
|
setLinkUrl("");
|
|
2253
2372
|
setErrorMsg(null);
|
|
2254
2373
|
}, []);
|
|
2255
|
-
const handleMouseDown =
|
|
2374
|
+
const handleMouseDown = useCallback11((e) => {
|
|
2256
2375
|
e.preventDefault();
|
|
2257
2376
|
}, []);
|
|
2258
|
-
const handleKeyDown =
|
|
2377
|
+
const handleKeyDown = useCallback11(
|
|
2259
2378
|
(e) => {
|
|
2260
2379
|
if (e.key === "Enter") {
|
|
2261
2380
|
handleSubmit();
|
|
@@ -2265,8 +2384,8 @@ var LinkButton = ({ editor }) => {
|
|
|
2265
2384
|
},
|
|
2266
2385
|
[handleSubmit, handleCancel]
|
|
2267
2386
|
);
|
|
2268
|
-
return /* @__PURE__ */
|
|
2269
|
-
/* @__PURE__ */
|
|
2387
|
+
return /* @__PURE__ */ jsxs8("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
|
|
2388
|
+
/* @__PURE__ */ jsx14(
|
|
2270
2389
|
"button",
|
|
2271
2390
|
{
|
|
2272
2391
|
className: "lumir-toolbar-btn",
|
|
@@ -2277,8 +2396,8 @@ var LinkButton = ({ editor }) => {
|
|
|
2277
2396
|
children: Icons.link
|
|
2278
2397
|
}
|
|
2279
2398
|
),
|
|
2280
|
-
isOpen && /* @__PURE__ */
|
|
2281
|
-
/* @__PURE__ */
|
|
2399
|
+
isOpen && /* @__PURE__ */ jsx14("div", { className: "lumir-dropdown-menu lumir-link-menu", children: /* @__PURE__ */ jsxs8("form", { onSubmit: handleSubmit, className: "lumir-link-form", children: [
|
|
2400
|
+
/* @__PURE__ */ jsx14(
|
|
2282
2401
|
"input",
|
|
2283
2402
|
{
|
|
2284
2403
|
ref: inputRef,
|
|
@@ -2294,7 +2413,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2294
2413
|
onMouseDown: handleMouseDown
|
|
2295
2414
|
}
|
|
2296
2415
|
),
|
|
2297
|
-
errorMsg && /* @__PURE__ */
|
|
2416
|
+
errorMsg && /* @__PURE__ */ jsx14(
|
|
2298
2417
|
"div",
|
|
2299
2418
|
{
|
|
2300
2419
|
style: {
|
|
@@ -2306,8 +2425,8 @@ var LinkButton = ({ editor }) => {
|
|
|
2306
2425
|
children: errorMsg
|
|
2307
2426
|
}
|
|
2308
2427
|
),
|
|
2309
|
-
/* @__PURE__ */
|
|
2310
|
-
/* @__PURE__ */
|
|
2428
|
+
/* @__PURE__ */ jsxs8("div", { className: "lumir-link-actions", children: [
|
|
2429
|
+
/* @__PURE__ */ jsx14(
|
|
2311
2430
|
"button",
|
|
2312
2431
|
{
|
|
2313
2432
|
type: "button",
|
|
@@ -2317,7 +2436,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2317
2436
|
children: "\uCDE8\uC18C"
|
|
2318
2437
|
}
|
|
2319
2438
|
),
|
|
2320
|
-
/* @__PURE__ */
|
|
2439
|
+
/* @__PURE__ */ jsx14(
|
|
2321
2440
|
"button",
|
|
2322
2441
|
{
|
|
2323
2442
|
type: "submit",
|
|
@@ -2333,10 +2452,10 @@ var LinkButton = ({ editor }) => {
|
|
|
2333
2452
|
};
|
|
2334
2453
|
|
|
2335
2454
|
// src/components/FloatingMenu/components/TableButton.tsx
|
|
2336
|
-
import { useCallback as
|
|
2337
|
-
import { jsx as
|
|
2455
|
+
import { useCallback as useCallback12 } from "react";
|
|
2456
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
2338
2457
|
var TableButton = ({ editor }) => {
|
|
2339
|
-
const handleClick =
|
|
2458
|
+
const handleClick = useCallback12(() => {
|
|
2340
2459
|
try {
|
|
2341
2460
|
const block = editor?.getTextCursorPosition()?.block;
|
|
2342
2461
|
if (!block || !editor?.insertBlocks) return;
|
|
@@ -2358,10 +2477,10 @@ var TableButton = ({ editor }) => {
|
|
|
2358
2477
|
console.error("Table insert failed:", err);
|
|
2359
2478
|
}
|
|
2360
2479
|
}, [editor]);
|
|
2361
|
-
const handleMouseDown =
|
|
2480
|
+
const handleMouseDown = useCallback12((e) => {
|
|
2362
2481
|
e.preventDefault();
|
|
2363
2482
|
}, []);
|
|
2364
|
-
return /* @__PURE__ */
|
|
2483
|
+
return /* @__PURE__ */ jsx15(
|
|
2365
2484
|
"button",
|
|
2366
2485
|
{
|
|
2367
2486
|
className: "lumir-toolbar-btn",
|
|
@@ -2375,13 +2494,13 @@ var TableButton = ({ editor }) => {
|
|
|
2375
2494
|
};
|
|
2376
2495
|
|
|
2377
2496
|
// src/components/FloatingMenu/components/HTMLImportButton.tsx
|
|
2378
|
-
import { useCallback as
|
|
2379
|
-
import { Fragment as Fragment3, jsx as
|
|
2497
|
+
import { useCallback as useCallback13, useRef as useRef7 } from "react";
|
|
2498
|
+
import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
2380
2499
|
var HTMLImportButton = ({
|
|
2381
2500
|
editor
|
|
2382
2501
|
}) => {
|
|
2383
|
-
const fileInputRef =
|
|
2384
|
-
const handleFileUpload =
|
|
2502
|
+
const fileInputRef = useRef7(null);
|
|
2503
|
+
const handleFileUpload = useCallback13(
|
|
2385
2504
|
(e) => {
|
|
2386
2505
|
const file = e.target.files?.[0];
|
|
2387
2506
|
if (!file) return;
|
|
@@ -2417,14 +2536,14 @@ var HTMLImportButton = ({
|
|
|
2417
2536
|
},
|
|
2418
2537
|
[editor]
|
|
2419
2538
|
);
|
|
2420
|
-
const handleClick =
|
|
2539
|
+
const handleClick = useCallback13(() => {
|
|
2421
2540
|
fileInputRef.current?.click();
|
|
2422
2541
|
}, []);
|
|
2423
|
-
const handleMouseDown =
|
|
2542
|
+
const handleMouseDown = useCallback13((e) => {
|
|
2424
2543
|
e.preventDefault();
|
|
2425
2544
|
}, []);
|
|
2426
|
-
return /* @__PURE__ */
|
|
2427
|
-
/* @__PURE__ */
|
|
2545
|
+
return /* @__PURE__ */ jsxs9(Fragment3, { children: [
|
|
2546
|
+
/* @__PURE__ */ jsx16(
|
|
2428
2547
|
"input",
|
|
2429
2548
|
{
|
|
2430
2549
|
ref: fileInputRef,
|
|
@@ -2434,7 +2553,7 @@ var HTMLImportButton = ({
|
|
|
2434
2553
|
style: { display: "none" }
|
|
2435
2554
|
}
|
|
2436
2555
|
),
|
|
2437
|
-
/* @__PURE__ */
|
|
2556
|
+
/* @__PURE__ */ jsx16(
|
|
2438
2557
|
"button",
|
|
2439
2558
|
{
|
|
2440
2559
|
className: "lumir-toolbar-btn",
|
|
@@ -2449,8 +2568,8 @@ var HTMLImportButton = ({
|
|
|
2449
2568
|
};
|
|
2450
2569
|
|
|
2451
2570
|
// src/components/FloatingMenu/components/BlockTypeSelect.tsx
|
|
2452
|
-
import { useState as
|
|
2453
|
-
import { jsx as
|
|
2571
|
+
import { useState as useState7, useEffect as useEffect7, useRef as useRef8, useCallback as useCallback14 } from "react";
|
|
2572
|
+
import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
2454
2573
|
var blockTypeCategories = [
|
|
2455
2574
|
{
|
|
2456
2575
|
category: "Headings",
|
|
@@ -2480,8 +2599,8 @@ var blockTypes = blockTypeCategories.flatMap(
|
|
|
2480
2599
|
(cat) => cat.items
|
|
2481
2600
|
);
|
|
2482
2601
|
var BlockTypeSelect = ({ editor }) => {
|
|
2483
|
-
const [isOpen, setIsOpen] =
|
|
2484
|
-
const dropdownRef =
|
|
2602
|
+
const [isOpen, setIsOpen] = useState7(false);
|
|
2603
|
+
const dropdownRef = useRef8(null);
|
|
2485
2604
|
const getCurrentBlock = () => {
|
|
2486
2605
|
try {
|
|
2487
2606
|
return editor?.getTextCursorPosition()?.block;
|
|
@@ -2493,7 +2612,7 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
2493
2612
|
const currentType = currentBlock?.type || "paragraph";
|
|
2494
2613
|
const currentLevel = currentBlock?.props?.level;
|
|
2495
2614
|
const isCurrentToggle = currentType === "heading" && currentBlock?.props?.isToggleable === true;
|
|
2496
|
-
|
|
2615
|
+
useEffect7(() => {
|
|
2497
2616
|
const handleClickOutside = (e) => {
|
|
2498
2617
|
if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
|
|
2499
2618
|
setIsOpen(false);
|
|
@@ -2522,7 +2641,7 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
2522
2641
|
console.error("Block type change failed:", err);
|
|
2523
2642
|
}
|
|
2524
2643
|
};
|
|
2525
|
-
const handleMouseDown =
|
|
2644
|
+
const handleMouseDown = useCallback14((e) => {
|
|
2526
2645
|
e.preventDefault();
|
|
2527
2646
|
}, []);
|
|
2528
2647
|
const getCurrentLabel = () => {
|
|
@@ -2553,8 +2672,8 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
2553
2672
|
}
|
|
2554
2673
|
return currentType === bt.type;
|
|
2555
2674
|
};
|
|
2556
|
-
return /* @__PURE__ */
|
|
2557
|
-
/* @__PURE__ */
|
|
2675
|
+
return /* @__PURE__ */ jsxs10("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
|
|
2676
|
+
/* @__PURE__ */ jsxs10(
|
|
2558
2677
|
"button",
|
|
2559
2678
|
{
|
|
2560
2679
|
className: "lumir-dropdown-btn lumir-block-type-btn",
|
|
@@ -2562,15 +2681,15 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
2562
2681
|
onMouseDown: handleMouseDown,
|
|
2563
2682
|
type: "button",
|
|
2564
2683
|
children: [
|
|
2565
|
-
/* @__PURE__ */
|
|
2566
|
-
/* @__PURE__ */
|
|
2684
|
+
/* @__PURE__ */ jsx17("span", { className: "lumir-block-icon", children: BlockTypeIcons[getCurrentIcon()] }),
|
|
2685
|
+
/* @__PURE__ */ jsx17("span", { className: "lumir-block-label", children: getCurrentLabel() }),
|
|
2567
2686
|
Icons.expandMore
|
|
2568
2687
|
]
|
|
2569
2688
|
}
|
|
2570
2689
|
),
|
|
2571
|
-
isOpen && /* @__PURE__ */
|
|
2572
|
-
/* @__PURE__ */
|
|
2573
|
-
category.items.map((bt) => /* @__PURE__ */
|
|
2690
|
+
isOpen && /* @__PURE__ */ jsx17("div", { className: "lumir-dropdown-menu lumir-block-menu", children: blockTypeCategories.map((category) => /* @__PURE__ */ jsxs10("div", { className: "lumir-block-category", children: [
|
|
2691
|
+
/* @__PURE__ */ jsx17("div", { className: "lumir-block-category-title", children: category.category }),
|
|
2692
|
+
category.items.map((bt) => /* @__PURE__ */ jsxs10(
|
|
2574
2693
|
"button",
|
|
2575
2694
|
{
|
|
2576
2695
|
className: cn(
|
|
@@ -2580,8 +2699,8 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
2580
2699
|
onClick: () => handleTypeChange(bt.type, bt.level, bt.isToggle),
|
|
2581
2700
|
onMouseDown: handleMouseDown,
|
|
2582
2701
|
children: [
|
|
2583
|
-
/* @__PURE__ */
|
|
2584
|
-
/* @__PURE__ */
|
|
2702
|
+
/* @__PURE__ */ jsx17("span", { className: "lumir-block-icon", children: BlockTypeIcons[bt.icon] }),
|
|
2703
|
+
/* @__PURE__ */ jsx17("span", { className: "lumir-block-item-title", children: bt.label })
|
|
2585
2704
|
]
|
|
2586
2705
|
},
|
|
2587
2706
|
bt.icon
|
|
@@ -2591,7 +2710,7 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
2591
2710
|
};
|
|
2592
2711
|
|
|
2593
2712
|
// src/components/FloatingMenu/index.tsx
|
|
2594
|
-
import { Fragment as Fragment4, jsx as
|
|
2713
|
+
import { Fragment as Fragment4, jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
2595
2714
|
var COMPACT_BREAKPOINT = 700;
|
|
2596
2715
|
var MINIMIZED_BREAKPOINT = 400;
|
|
2597
2716
|
var FloatingMenu = ({
|
|
@@ -2600,12 +2719,12 @@ var FloatingMenu = ({
|
|
|
2600
2719
|
className,
|
|
2601
2720
|
onImageUpload
|
|
2602
2721
|
}) => {
|
|
2603
|
-
const wrapperRef =
|
|
2604
|
-
const [isCompact, setIsCompact] =
|
|
2605
|
-
const [isMinimizable, setIsMinimizable] =
|
|
2606
|
-
const [isMinimized, setIsMinimized] =
|
|
2607
|
-
const [, setSelectionTick] =
|
|
2608
|
-
|
|
2722
|
+
const wrapperRef = useRef9(null);
|
|
2723
|
+
const [isCompact, setIsCompact] = useState8(false);
|
|
2724
|
+
const [isMinimizable, setIsMinimizable] = useState8(false);
|
|
2725
|
+
const [isMinimized, setIsMinimized] = useState8(false);
|
|
2726
|
+
const [, setSelectionTick] = useState8(0);
|
|
2727
|
+
useEffect8(() => {
|
|
2609
2728
|
if (!editor) return;
|
|
2610
2729
|
let debounceTimer = null;
|
|
2611
2730
|
const DEBOUNCE_DELAY = 150;
|
|
@@ -2629,7 +2748,7 @@ var FloatingMenu = ({
|
|
|
2629
2748
|
unsubscribeContent?.();
|
|
2630
2749
|
};
|
|
2631
2750
|
}, [editor]);
|
|
2632
|
-
|
|
2751
|
+
useEffect8(() => {
|
|
2633
2752
|
const checkWidth = () => {
|
|
2634
2753
|
if (wrapperRef.current) {
|
|
2635
2754
|
const width = wrapperRef.current.offsetWidth;
|
|
@@ -2644,8 +2763,8 @@ var FloatingMenu = ({
|
|
|
2644
2763
|
}
|
|
2645
2764
|
return () => resizeObserver.disconnect();
|
|
2646
2765
|
}, []);
|
|
2647
|
-
const MinimizedLayout = () => /* @__PURE__ */
|
|
2648
|
-
/* @__PURE__ */
|
|
2766
|
+
const MinimizedLayout = () => /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
2767
|
+
/* @__PURE__ */ jsx18(
|
|
2649
2768
|
"button",
|
|
2650
2769
|
{
|
|
2651
2770
|
className: "lumir-toolbar-button lumir-toggle-button",
|
|
@@ -2656,117 +2775,120 @@ var FloatingMenu = ({
|
|
|
2656
2775
|
children: isMinimized ? Icons.chevronRight : Icons.chevronLeft
|
|
2657
2776
|
}
|
|
2658
2777
|
),
|
|
2659
|
-
!isMinimized && /* @__PURE__ */
|
|
2660
|
-
/* @__PURE__ */
|
|
2661
|
-
/* @__PURE__ */
|
|
2662
|
-
/* @__PURE__ */
|
|
2663
|
-
/* @__PURE__ */
|
|
2664
|
-
/* @__PURE__ */
|
|
2665
|
-
/* @__PURE__ */
|
|
2666
|
-
/* @__PURE__ */
|
|
2667
|
-
/* @__PURE__ */
|
|
2668
|
-
/* @__PURE__ */
|
|
2669
|
-
/* @__PURE__ */
|
|
2778
|
+
!isMinimized && /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
2779
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2780
|
+
/* @__PURE__ */ jsx18(UndoRedoButtons, { editor }),
|
|
2781
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2782
|
+
/* @__PURE__ */ jsx18("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ jsx18(BlockTypeSelect, { editor }) }),
|
|
2783
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2784
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2785
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "bold" }),
|
|
2786
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "italic" }),
|
|
2787
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "underline" }),
|
|
2788
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "strike" })
|
|
2670
2789
|
] }),
|
|
2671
|
-
/* @__PURE__ */
|
|
2672
|
-
/* @__PURE__ */
|
|
2673
|
-
/* @__PURE__ */
|
|
2674
|
-
/* @__PURE__ */
|
|
2675
|
-
/* @__PURE__ */
|
|
2790
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2791
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2792
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "left" }),
|
|
2793
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "center" }),
|
|
2794
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "right" })
|
|
2676
2795
|
] }),
|
|
2677
|
-
/* @__PURE__ */
|
|
2678
|
-
/* @__PURE__ */
|
|
2679
|
-
/* @__PURE__ */
|
|
2680
|
-
/* @__PURE__ */
|
|
2796
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2797
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2798
|
+
/* @__PURE__ */ jsx18(ListButton, { editor, type: "bullet" }),
|
|
2799
|
+
/* @__PURE__ */ jsx18(ListButton, { editor, type: "numbered" })
|
|
2681
2800
|
] }),
|
|
2682
|
-
/* @__PURE__ */
|
|
2683
|
-
/* @__PURE__ */
|
|
2684
|
-
/* @__PURE__ */
|
|
2685
|
-
/* @__PURE__ */
|
|
2801
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2802
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2803
|
+
/* @__PURE__ */ jsx18(FontSizeButton, { editor }),
|
|
2804
|
+
/* @__PURE__ */ jsx18(ColorButton, { editor, type: "text" }),
|
|
2805
|
+
/* @__PURE__ */ jsx18(ColorButton, { editor, type: "background" })
|
|
2686
2806
|
] }),
|
|
2687
|
-
/* @__PURE__ */
|
|
2688
|
-
/* @__PURE__ */
|
|
2689
|
-
/* @__PURE__ */
|
|
2690
|
-
/* @__PURE__ */
|
|
2691
|
-
/* @__PURE__ */
|
|
2692
|
-
/* @__PURE__ */
|
|
2807
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2808
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2809
|
+
/* @__PURE__ */ jsx18(ImageButton, { editor, onImageUpload }),
|
|
2810
|
+
/* @__PURE__ */ jsx18(LinkButton, { editor }),
|
|
2811
|
+
/* @__PURE__ */ jsx18(TableButton, { editor }),
|
|
2812
|
+
/* @__PURE__ */ jsx18(HTMLImportButton, { editor })
|
|
2693
2813
|
] })
|
|
2694
2814
|
] })
|
|
2695
2815
|
] });
|
|
2696
|
-
const SingleRowLayout = () => /* @__PURE__ */
|
|
2697
|
-
/* @__PURE__ */
|
|
2698
|
-
/* @__PURE__ */
|
|
2699
|
-
/* @__PURE__ */
|
|
2700
|
-
/* @__PURE__ */
|
|
2701
|
-
/* @__PURE__ */
|
|
2702
|
-
/* @__PURE__ */
|
|
2703
|
-
/* @__PURE__ */
|
|
2704
|
-
/* @__PURE__ */
|
|
2705
|
-
/* @__PURE__ */
|
|
2816
|
+
const SingleRowLayout = () => /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
2817
|
+
/* @__PURE__ */ jsx18(UndoRedoButtons, { editor }),
|
|
2818
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2819
|
+
/* @__PURE__ */ jsx18("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ jsx18(BlockTypeSelect, { editor }) }),
|
|
2820
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2821
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2822
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "bold" }),
|
|
2823
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "italic" }),
|
|
2824
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "underline" }),
|
|
2825
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "strike" })
|
|
2706
2826
|
] }),
|
|
2707
|
-
/* @__PURE__ */
|
|
2708
|
-
/* @__PURE__ */
|
|
2709
|
-
/* @__PURE__ */
|
|
2710
|
-
/* @__PURE__ */
|
|
2711
|
-
/* @__PURE__ */
|
|
2827
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2828
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2829
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "left" }),
|
|
2830
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "center" }),
|
|
2831
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "right" })
|
|
2712
2832
|
] }),
|
|
2713
|
-
/* @__PURE__ */
|
|
2714
|
-
/* @__PURE__ */
|
|
2715
|
-
/* @__PURE__ */
|
|
2716
|
-
/* @__PURE__ */
|
|
2833
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2834
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2835
|
+
/* @__PURE__ */ jsx18(ListButton, { editor, type: "bullet" }),
|
|
2836
|
+
/* @__PURE__ */ jsx18(ListButton, { editor, type: "numbered" })
|
|
2717
2837
|
] }),
|
|
2718
|
-
/* @__PURE__ */
|
|
2719
|
-
/* @__PURE__ */
|
|
2720
|
-
/* @__PURE__ */
|
|
2721
|
-
/* @__PURE__ */
|
|
2838
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2839
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2840
|
+
/* @__PURE__ */ jsx18(FontSizeButton, { editor }),
|
|
2841
|
+
/* @__PURE__ */ jsx18(ColorButton, { editor, type: "text" }),
|
|
2842
|
+
/* @__PURE__ */ jsx18(ColorButton, { editor, type: "background" })
|
|
2722
2843
|
] }),
|
|
2723
|
-
/* @__PURE__ */
|
|
2724
|
-
/* @__PURE__ */
|
|
2725
|
-
/* @__PURE__ */
|
|
2726
|
-
/* @__PURE__ */
|
|
2727
|
-
/* @__PURE__ */
|
|
2728
|
-
/* @__PURE__ */
|
|
2844
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2845
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2846
|
+
/* @__PURE__ */ jsx18(ImageButton, { editor, onImageUpload }),
|
|
2847
|
+
/* @__PURE__ */ jsx18(LinkButton, { editor }),
|
|
2848
|
+
/* @__PURE__ */ jsx18(TableButton, { editor }),
|
|
2849
|
+
/* @__PURE__ */ jsx18(HTMLImportButton, { editor })
|
|
2729
2850
|
] })
|
|
2730
2851
|
] });
|
|
2731
|
-
const TwoRowLayout = () => /* @__PURE__ */
|
|
2732
|
-
/* @__PURE__ */
|
|
2733
|
-
/* @__PURE__ */
|
|
2734
|
-
/* @__PURE__ */
|
|
2735
|
-
/* @__PURE__ */
|
|
2736
|
-
/* @__PURE__ */
|
|
2737
|
-
/* @__PURE__ */
|
|
2738
|
-
/* @__PURE__ */
|
|
2739
|
-
/* @__PURE__ */
|
|
2852
|
+
const TwoRowLayout = () => /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
2853
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-row", children: [
|
|
2854
|
+
/* @__PURE__ */ jsx18(UndoRedoButtons, { editor }),
|
|
2855
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2856
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2857
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "bold" }),
|
|
2858
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "italic" }),
|
|
2859
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "underline" }),
|
|
2860
|
+
/* @__PURE__ */ jsx18(TextStyleButton, { editor, style: "strike" })
|
|
2740
2861
|
] }),
|
|
2741
|
-
/* @__PURE__ */
|
|
2742
|
-
/* @__PURE__ */
|
|
2743
|
-
/* @__PURE__ */
|
|
2744
|
-
/* @__PURE__ */
|
|
2745
|
-
/* @__PURE__ */
|
|
2862
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2863
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2864
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "left" }),
|
|
2865
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "center" }),
|
|
2866
|
+
/* @__PURE__ */ jsx18(AlignButton, { editor, alignment: "right" })
|
|
2746
2867
|
] }),
|
|
2747
|
-
/* @__PURE__ */
|
|
2748
|
-
/* @__PURE__ */
|
|
2749
|
-
/* @__PURE__ */
|
|
2750
|
-
/* @__PURE__ */
|
|
2868
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2869
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2870
|
+
/* @__PURE__ */ jsx18(ListButton, { editor, type: "bullet" }),
|
|
2871
|
+
/* @__PURE__ */ jsx18(ListButton, { editor, type: "numbered" })
|
|
2751
2872
|
] })
|
|
2752
2873
|
] }),
|
|
2753
|
-
/* @__PURE__ */
|
|
2754
|
-
/* @__PURE__ */
|
|
2755
|
-
/* @__PURE__ */
|
|
2756
|
-
/* @__PURE__ */
|
|
2757
|
-
/* @__PURE__ */
|
|
2758
|
-
/* @__PURE__ */
|
|
2874
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-row", children: [
|
|
2875
|
+
/* @__PURE__ */ jsx18("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ jsx18(BlockTypeSelect, { editor }) }),
|
|
2876
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2877
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2878
|
+
/* @__PURE__ */ jsx18(FontSizeButton, { editor }),
|
|
2879
|
+
/* @__PURE__ */ jsx18(ColorButton, { editor, type: "text" }),
|
|
2880
|
+
/* @__PURE__ */ jsx18(ColorButton, { editor, type: "background" })
|
|
2759
2881
|
] }),
|
|
2760
|
-
/* @__PURE__ */
|
|
2761
|
-
/* @__PURE__ */
|
|
2762
|
-
/* @__PURE__ */
|
|
2763
|
-
/* @__PURE__ */
|
|
2764
|
-
/* @__PURE__ */
|
|
2765
|
-
/* @__PURE__ */
|
|
2882
|
+
/* @__PURE__ */ jsx18(ToolbarDivider, {}),
|
|
2883
|
+
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
2884
|
+
/* @__PURE__ */ jsx18(ImageButton, { editor, onImageUpload }),
|
|
2885
|
+
/* @__PURE__ */ jsx18(LinkButton, { editor }),
|
|
2886
|
+
/* @__PURE__ */ jsx18(TableButton, { editor }),
|
|
2887
|
+
/* @__PURE__ */ jsx18(HTMLImportButton, { editor })
|
|
2766
2888
|
] })
|
|
2767
2889
|
] })
|
|
2768
2890
|
] });
|
|
2769
|
-
return /* @__PURE__ */
|
|
2891
|
+
return /* @__PURE__ */ jsx18(
|
|
2770
2892
|
"div",
|
|
2771
2893
|
{
|
|
2772
2894
|
ref: wrapperRef,
|
|
@@ -2776,7 +2898,7 @@ var FloatingMenu = ({
|
|
|
2776
2898
|
className
|
|
2777
2899
|
),
|
|
2778
2900
|
"data-position": position,
|
|
2779
|
-
children: /* @__PURE__ */
|
|
2901
|
+
children: /* @__PURE__ */ jsx18(
|
|
2780
2902
|
"div",
|
|
2781
2903
|
{
|
|
2782
2904
|
className: cn(
|
|
@@ -2785,7 +2907,7 @@ var FloatingMenu = ({
|
|
|
2785
2907
|
isMinimizable && "is-minimizable",
|
|
2786
2908
|
isMinimized && "is-minimized"
|
|
2787
2909
|
),
|
|
2788
|
-
children: isMinimizable ? /* @__PURE__ */
|
|
2910
|
+
children: isMinimizable ? /* @__PURE__ */ jsx18(MinimizedLayout, {}) : isCompact ? /* @__PURE__ */ jsx18(TwoRowLayout, {}) : /* @__PURE__ */ jsx18(SingleRowLayout, {})
|
|
2789
2911
|
}
|
|
2790
2912
|
)
|
|
2791
2913
|
}
|
|
@@ -2939,18 +3061,18 @@ import {
|
|
|
2939
3061
|
checkBlockTypeHasDefaultProp,
|
|
2940
3062
|
mapTableCell
|
|
2941
3063
|
} from "@blocknote/core";
|
|
2942
|
-
import { useCallback as
|
|
3064
|
+
import { useCallback as useCallback15, useMemo } from "react";
|
|
2943
3065
|
import {
|
|
2944
3066
|
useComponentsContext,
|
|
2945
3067
|
useBlockNoteEditor,
|
|
2946
3068
|
useSelectedBlocks
|
|
2947
3069
|
} from "@blocknote/react";
|
|
2948
|
-
import { jsx as
|
|
3070
|
+
import { jsx as jsx19 } from "react/jsx-runtime";
|
|
2949
3071
|
var icons = {
|
|
2950
|
-
left: /* @__PURE__ */
|
|
2951
|
-
center: /* @__PURE__ */
|
|
2952
|
-
right: /* @__PURE__ */
|
|
2953
|
-
justify: /* @__PURE__ */
|
|
3072
|
+
left: /* @__PURE__ */ jsx19("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx19("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
|
|
3073
|
+
center: /* @__PURE__ */ jsx19("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx19("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
|
|
3074
|
+
right: /* @__PURE__ */ jsx19("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx19("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
|
|
3075
|
+
justify: /* @__PURE__ */ jsx19("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx19("path", { d: "M3 21h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18V7H3v2zM3 3v2h18V3H3z" }) })
|
|
2954
3076
|
};
|
|
2955
3077
|
var tooltipMap = {
|
|
2956
3078
|
left: "\uC67C\uCABD \uC815\uB82C",
|
|
@@ -2984,7 +3106,7 @@ var TextAlignButtonWithVA = (props) => {
|
|
|
2984
3106
|
}
|
|
2985
3107
|
return;
|
|
2986
3108
|
}, [editor, selectedBlocks]);
|
|
2987
|
-
const setTextAlignment =
|
|
3109
|
+
const setTextAlignment = useCallback15(
|
|
2988
3110
|
(newAlignment) => {
|
|
2989
3111
|
editor.focus();
|
|
2990
3112
|
for (const block of selectedBlocks) {
|
|
@@ -3022,7 +3144,7 @@ var TextAlignButtonWithVA = (props) => {
|
|
|
3022
3144
|
if (!show || !editor.isEditable) {
|
|
3023
3145
|
return null;
|
|
3024
3146
|
}
|
|
3025
|
-
return /* @__PURE__ */
|
|
3147
|
+
return /* @__PURE__ */ jsx19(
|
|
3026
3148
|
Components.FormattingToolbar.Button,
|
|
3027
3149
|
{
|
|
3028
3150
|
className: "bn-button",
|
|
@@ -3037,25 +3159,25 @@ var TextAlignButtonWithVA = (props) => {
|
|
|
3037
3159
|
};
|
|
3038
3160
|
|
|
3039
3161
|
// src/components/VerticalAlignButton.tsx
|
|
3040
|
-
import { useCallback as
|
|
3162
|
+
import { useCallback as useCallback16, useMemo as useMemo2 } from "react";
|
|
3041
3163
|
import {
|
|
3042
3164
|
useBlockNoteEditor as useBlockNoteEditor2,
|
|
3043
3165
|
useComponentsContext as useComponentsContext2,
|
|
3044
3166
|
useSelectedBlocks as useSelectedBlocks2
|
|
3045
3167
|
} from "@blocknote/react";
|
|
3046
|
-
import { jsx as
|
|
3168
|
+
import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
3047
3169
|
var icons2 = {
|
|
3048
|
-
top: /* @__PURE__ */
|
|
3049
|
-
/* @__PURE__ */
|
|
3050
|
-
/* @__PURE__ */
|
|
3170
|
+
top: /* @__PURE__ */ jsxs12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
3171
|
+
/* @__PURE__ */ jsx20("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
|
|
3172
|
+
/* @__PURE__ */ jsx20("line", { x1: "5", y1: "5", x2: "11", y2: "5" })
|
|
3051
3173
|
] }),
|
|
3052
|
-
middle: /* @__PURE__ */
|
|
3053
|
-
/* @__PURE__ */
|
|
3054
|
-
/* @__PURE__ */
|
|
3174
|
+
middle: /* @__PURE__ */ jsxs12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
3175
|
+
/* @__PURE__ */ jsx20("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
|
|
3176
|
+
/* @__PURE__ */ jsx20("line", { x1: "5", y1: "8", x2: "11", y2: "8" })
|
|
3055
3177
|
] }),
|
|
3056
|
-
bottom: /* @__PURE__ */
|
|
3057
|
-
/* @__PURE__ */
|
|
3058
|
-
/* @__PURE__ */
|
|
3178
|
+
bottom: /* @__PURE__ */ jsxs12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
3179
|
+
/* @__PURE__ */ jsx20("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
|
|
3180
|
+
/* @__PURE__ */ jsx20("line", { x1: "5", y1: "11", x2: "11", y2: "11" })
|
|
3059
3181
|
] })
|
|
3060
3182
|
};
|
|
3061
3183
|
var tooltips = {
|
|
@@ -3083,7 +3205,7 @@ var VerticalAlignButton = (props) => {
|
|
|
3083
3205
|
const currentAlignment = useMemo2(() => {
|
|
3084
3206
|
return getCurrentVerticalAlignment(editor);
|
|
3085
3207
|
}, [editor, selectedBlocks]);
|
|
3086
|
-
const setVerticalAlignment =
|
|
3208
|
+
const setVerticalAlignment = useCallback16(
|
|
3087
3209
|
(alignment) => {
|
|
3088
3210
|
const tiptap = editor._tiptapEditor;
|
|
3089
3211
|
if (!tiptap) return;
|
|
@@ -3111,7 +3233,7 @@ var VerticalAlignButton = (props) => {
|
|
|
3111
3233
|
if (!isInTable || !editor.isEditable) {
|
|
3112
3234
|
return null;
|
|
3113
3235
|
}
|
|
3114
|
-
return /* @__PURE__ */
|
|
3236
|
+
return /* @__PURE__ */ jsx20(
|
|
3115
3237
|
Components.FormattingToolbar.Button,
|
|
3116
3238
|
{
|
|
3117
3239
|
className: "bn-button",
|
|
@@ -3125,6 +3247,107 @@ var VerticalAlignButton = (props) => {
|
|
|
3125
3247
|
);
|
|
3126
3248
|
};
|
|
3127
3249
|
|
|
3250
|
+
// src/components/FontSizeButton.tsx
|
|
3251
|
+
import {
|
|
3252
|
+
useBlockNoteEditor as useBlockNoteEditor3,
|
|
3253
|
+
useComponentsContext as useComponentsContext3,
|
|
3254
|
+
useEditorContentOrSelectionChange,
|
|
3255
|
+
useSelectedBlocks as useSelectedBlocks3
|
|
3256
|
+
} from "@blocknote/react";
|
|
3257
|
+
import { useCallback as useCallback17, useMemo as useMemo3, useState as useState9 } from "react";
|
|
3258
|
+
import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
3259
|
+
var DEFAULT_LABEL2 = "\uAE30\uBCF8";
|
|
3260
|
+
var toLabel2 = (size) => size.replace(/px$/, "");
|
|
3261
|
+
function FontSizeIcon({ size }) {
|
|
3262
|
+
return /* @__PURE__ */ jsx21(
|
|
3263
|
+
"span",
|
|
3264
|
+
{
|
|
3265
|
+
style: {
|
|
3266
|
+
pointerEvents: "none",
|
|
3267
|
+
fontSize: "12px",
|
|
3268
|
+
fontWeight: 600,
|
|
3269
|
+
lineHeight: "20px",
|
|
3270
|
+
whiteSpace: "nowrap"
|
|
3271
|
+
},
|
|
3272
|
+
children: size ? toLabel2(size) : "\uAC00A"
|
|
3273
|
+
}
|
|
3274
|
+
);
|
|
3275
|
+
}
|
|
3276
|
+
function FontSizeButton2() {
|
|
3277
|
+
const Components = useComponentsContext3();
|
|
3278
|
+
const editor = useBlockNoteEditor3();
|
|
3279
|
+
const ed = editor;
|
|
3280
|
+
const styleSchema = editor.schema.styleSchema;
|
|
3281
|
+
const fontSizeInSchema = styleSchema.fontSize?.type === "fontSize" && styleSchema.fontSize?.propSchema === "string";
|
|
3282
|
+
const selectedBlocks = useSelectedBlocks3(editor);
|
|
3283
|
+
const [currentSize, setCurrentSize] = useState9(
|
|
3284
|
+
fontSizeInSchema ? ed.getActiveStyles().fontSize || "" : ""
|
|
3285
|
+
);
|
|
3286
|
+
useEditorContentOrSelectionChange(() => {
|
|
3287
|
+
if (fontSizeInSchema) {
|
|
3288
|
+
setCurrentSize(ed.getActiveStyles().fontSize || "");
|
|
3289
|
+
}
|
|
3290
|
+
}, editor);
|
|
3291
|
+
const setFontSize = useCallback17(
|
|
3292
|
+
(size) => {
|
|
3293
|
+
size === "" ? ed.removeStyles({ fontSize: "" }) : ed.addStyles({ fontSize: size });
|
|
3294
|
+
setTimeout(() => editor.focus());
|
|
3295
|
+
},
|
|
3296
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3297
|
+
[editor]
|
|
3298
|
+
);
|
|
3299
|
+
const show = useMemo3(() => {
|
|
3300
|
+
if (!fontSizeInSchema) {
|
|
3301
|
+
return false;
|
|
3302
|
+
}
|
|
3303
|
+
for (const block of selectedBlocks) {
|
|
3304
|
+
if (block.content !== void 0) {
|
|
3305
|
+
return true;
|
|
3306
|
+
}
|
|
3307
|
+
}
|
|
3308
|
+
return false;
|
|
3309
|
+
}, [fontSizeInSchema, selectedBlocks]);
|
|
3310
|
+
if (!show || !editor.isEditable) {
|
|
3311
|
+
return null;
|
|
3312
|
+
}
|
|
3313
|
+
const tooltip = "\uAE00\uC790 \uD06C\uAE30";
|
|
3314
|
+
return /* @__PURE__ */ jsxs13(Components.Generic.Menu.Root, { children: [
|
|
3315
|
+
/* @__PURE__ */ jsx21(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ jsx21(
|
|
3316
|
+
Components.FormattingToolbar.Button,
|
|
3317
|
+
{
|
|
3318
|
+
className: "bn-button",
|
|
3319
|
+
"data-test": "font-size",
|
|
3320
|
+
label: tooltip,
|
|
3321
|
+
mainTooltip: tooltip,
|
|
3322
|
+
icon: /* @__PURE__ */ jsx21(FontSizeIcon, { size: currentSize })
|
|
3323
|
+
}
|
|
3324
|
+
) }),
|
|
3325
|
+
/* @__PURE__ */ jsxs13(Components.Generic.Menu.Dropdown, { className: "bn-menu-dropdown", children: [
|
|
3326
|
+
/* @__PURE__ */ jsx21(Components.Generic.Menu.Label, { children: "\uAE00\uC790 \uD06C\uAE30" }),
|
|
3327
|
+
/* @__PURE__ */ jsx21(
|
|
3328
|
+
Components.Generic.Menu.Item,
|
|
3329
|
+
{
|
|
3330
|
+
onClick: () => setFontSize(""),
|
|
3331
|
+
checked: currentSize === "",
|
|
3332
|
+
"data-test": "font-size-default",
|
|
3333
|
+
children: DEFAULT_LABEL2
|
|
3334
|
+
},
|
|
3335
|
+
"font-size-default"
|
|
3336
|
+
),
|
|
3337
|
+
FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ jsx21(
|
|
3338
|
+
Components.Generic.Menu.Item,
|
|
3339
|
+
{
|
|
3340
|
+
onClick: () => setFontSize(size),
|
|
3341
|
+
checked: currentSize === size,
|
|
3342
|
+
"data-test": "font-size-" + toLabel2(size),
|
|
3343
|
+
children: toLabel2(size)
|
|
3344
|
+
},
|
|
3345
|
+
"font-size-" + size
|
|
3346
|
+
))
|
|
3347
|
+
] })
|
|
3348
|
+
] });
|
|
3349
|
+
}
|
|
3350
|
+
|
|
3128
3351
|
// src/components/color/LumirColorControls.tsx
|
|
3129
3352
|
import {
|
|
3130
3353
|
isTableCell,
|
|
@@ -3132,14 +3355,14 @@ import {
|
|
|
3132
3355
|
} from "@blocknote/core";
|
|
3133
3356
|
import {
|
|
3134
3357
|
SplitButton,
|
|
3135
|
-
useBlockNoteEditor as
|
|
3136
|
-
useComponentsContext as
|
|
3358
|
+
useBlockNoteEditor as useBlockNoteEditor4,
|
|
3359
|
+
useComponentsContext as useComponentsContext4,
|
|
3137
3360
|
useDictionary,
|
|
3138
|
-
useEditorContentOrSelectionChange,
|
|
3139
|
-
useSelectedBlocks as
|
|
3361
|
+
useEditorContentOrSelectionChange as useEditorContentOrSelectionChange2,
|
|
3362
|
+
useSelectedBlocks as useSelectedBlocks4
|
|
3140
3363
|
} from "@blocknote/react";
|
|
3141
|
-
import { useCallback as
|
|
3142
|
-
import { Fragment as Fragment5, jsx as
|
|
3364
|
+
import { useCallback as useCallback18, useMemo as useMemo4, useRef as useRef10, useState as useState10 } from "react";
|
|
3365
|
+
import { Fragment as Fragment5, jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
3143
3366
|
var COLORS = [
|
|
3144
3367
|
"default",
|
|
3145
3368
|
"gray",
|
|
@@ -3156,7 +3379,7 @@ function ColorIcon(props) {
|
|
|
3156
3379
|
const textColor = props.textColor || "default";
|
|
3157
3380
|
const backgroundColor = props.backgroundColor || "default";
|
|
3158
3381
|
const size = props.size || 16;
|
|
3159
|
-
return /* @__PURE__ */
|
|
3382
|
+
return /* @__PURE__ */ jsx22(
|
|
3160
3383
|
"div",
|
|
3161
3384
|
{
|
|
3162
3385
|
className: "bn-color-icon",
|
|
@@ -3175,7 +3398,7 @@ function ColorIcon(props) {
|
|
|
3175
3398
|
);
|
|
3176
3399
|
}
|
|
3177
3400
|
function CellFillIcon({ size = 18 }) {
|
|
3178
|
-
return /* @__PURE__ */
|
|
3401
|
+
return /* @__PURE__ */ jsx22(
|
|
3179
3402
|
"svg",
|
|
3180
3403
|
{
|
|
3181
3404
|
width: size,
|
|
@@ -3184,17 +3407,17 @@ function CellFillIcon({ size = 18 }) {
|
|
|
3184
3407
|
fill: "currentColor",
|
|
3185
3408
|
style: { pointerEvents: "none" },
|
|
3186
3409
|
"aria-hidden": "true",
|
|
3187
|
-
children: /* @__PURE__ */
|
|
3410
|
+
children: /* @__PURE__ */ jsx22("path", { d: "M16.56 8.94 7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10 10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" })
|
|
3188
3411
|
}
|
|
3189
3412
|
);
|
|
3190
3413
|
}
|
|
3191
3414
|
function LumirColorPicker(props) {
|
|
3192
|
-
const Components =
|
|
3415
|
+
const Components = useComponentsContext4();
|
|
3193
3416
|
const dict = useDictionary();
|
|
3194
|
-
return /* @__PURE__ */
|
|
3195
|
-
props.text ? /* @__PURE__ */
|
|
3196
|
-
/* @__PURE__ */
|
|
3197
|
-
COLORS.map((color) => /* @__PURE__ */
|
|
3417
|
+
return /* @__PURE__ */ jsxs14(Fragment5, { children: [
|
|
3418
|
+
props.text ? /* @__PURE__ */ jsxs14(Fragment5, { children: [
|
|
3419
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Label, { children: props.textTitle ?? dict.color_picker.text_title }),
|
|
3420
|
+
COLORS.map((color) => /* @__PURE__ */ jsx22(
|
|
3198
3421
|
Components.Generic.Menu.Item,
|
|
3199
3422
|
{
|
|
3200
3423
|
onClick: () => {
|
|
@@ -3202,16 +3425,16 @@ function LumirColorPicker(props) {
|
|
|
3202
3425
|
props.text.setColor(color);
|
|
3203
3426
|
},
|
|
3204
3427
|
"data-test": "text-color-" + color,
|
|
3205
|
-
icon: /* @__PURE__ */
|
|
3428
|
+
icon: /* @__PURE__ */ jsx22(ColorIcon, { textColor: color, size: props.iconSize }),
|
|
3206
3429
|
checked: props.text.color === color,
|
|
3207
3430
|
children: dict.color_picker.colors[color]
|
|
3208
3431
|
},
|
|
3209
3432
|
"text-color-" + color
|
|
3210
3433
|
))
|
|
3211
3434
|
] }) : null,
|
|
3212
|
-
props.background ? /* @__PURE__ */
|
|
3213
|
-
/* @__PURE__ */
|
|
3214
|
-
COLORS.map((color) => /* @__PURE__ */
|
|
3435
|
+
props.background ? /* @__PURE__ */ jsxs14(Fragment5, { children: [
|
|
3436
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Label, { children: props.backgroundTitle ?? dict.color_picker.background_title }),
|
|
3437
|
+
COLORS.map((color) => /* @__PURE__ */ jsx22(
|
|
3215
3438
|
Components.Generic.Menu.Item,
|
|
3216
3439
|
{
|
|
3217
3440
|
onClick: () => {
|
|
@@ -3219,7 +3442,7 @@ function LumirColorPicker(props) {
|
|
|
3219
3442
|
props.background.setColor(color);
|
|
3220
3443
|
},
|
|
3221
3444
|
"data-test": "background-color-" + color,
|
|
3222
|
-
icon: /* @__PURE__ */
|
|
3445
|
+
icon: /* @__PURE__ */ jsx22(ColorIcon, { backgroundColor: color, size: props.iconSize }),
|
|
3223
3446
|
checked: props.background.color === color,
|
|
3224
3447
|
children: dict.color_picker.colors[color]
|
|
3225
3448
|
},
|
|
@@ -3229,20 +3452,20 @@ function LumirColorPicker(props) {
|
|
|
3229
3452
|
] });
|
|
3230
3453
|
}
|
|
3231
3454
|
function LumirColorStyleButton() {
|
|
3232
|
-
const Components =
|
|
3233
|
-
const editor =
|
|
3455
|
+
const Components = useComponentsContext4();
|
|
3456
|
+
const editor = useBlockNoteEditor4();
|
|
3234
3457
|
const ed = editor;
|
|
3235
3458
|
const styleSchema = editor.schema.styleSchema;
|
|
3236
3459
|
const textColorInSchema = styleSchema.textColor?.type === "textColor" && styleSchema.textColor?.propSchema === "string";
|
|
3237
3460
|
const backgroundColorInSchema = styleSchema.backgroundColor?.type === "backgroundColor" && styleSchema.backgroundColor?.propSchema === "string";
|
|
3238
|
-
const selectedBlocks =
|
|
3239
|
-
const [currentTextColor, setCurrentTextColor] =
|
|
3461
|
+
const selectedBlocks = useSelectedBlocks4(editor);
|
|
3462
|
+
const [currentTextColor, setCurrentTextColor] = useState10(
|
|
3240
3463
|
textColorInSchema ? ed.getActiveStyles().textColor || "default" : "default"
|
|
3241
3464
|
);
|
|
3242
|
-
const [currentBackgroundColor, setCurrentBackgroundColor] =
|
|
3465
|
+
const [currentBackgroundColor, setCurrentBackgroundColor] = useState10(
|
|
3243
3466
|
backgroundColorInSchema ? ed.getActiveStyles().backgroundColor || "default" : "default"
|
|
3244
3467
|
);
|
|
3245
|
-
|
|
3468
|
+
useEditorContentOrSelectionChange2(() => {
|
|
3246
3469
|
const active = ed.getActiveStyles();
|
|
3247
3470
|
if (textColorInSchema) {
|
|
3248
3471
|
setCurrentTextColor(active.textColor || "default");
|
|
@@ -3251,7 +3474,7 @@ function LumirColorStyleButton() {
|
|
|
3251
3474
|
setCurrentBackgroundColor(active.backgroundColor || "default");
|
|
3252
3475
|
}
|
|
3253
3476
|
}, editor);
|
|
3254
|
-
const setTextColor =
|
|
3477
|
+
const setTextColor = useCallback18(
|
|
3255
3478
|
(color) => {
|
|
3256
3479
|
color === "default" ? ed.removeStyles({ textColor: color }) : ed.addStyles({ textColor: color });
|
|
3257
3480
|
setTimeout(() => editor.focus());
|
|
@@ -3259,7 +3482,7 @@ function LumirColorStyleButton() {
|
|
|
3259
3482
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3260
3483
|
[editor]
|
|
3261
3484
|
);
|
|
3262
|
-
const setBackgroundColor =
|
|
3485
|
+
const setBackgroundColor = useCallback18(
|
|
3263
3486
|
(color) => {
|
|
3264
3487
|
color === "default" ? ed.removeStyles({ backgroundColor: color }) : ed.addStyles({ backgroundColor: color });
|
|
3265
3488
|
setTimeout(() => editor.focus());
|
|
@@ -3267,7 +3490,7 @@ function LumirColorStyleButton() {
|
|
|
3267
3490
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
3268
3491
|
[editor]
|
|
3269
3492
|
);
|
|
3270
|
-
const show =
|
|
3493
|
+
const show = useMemo4(() => {
|
|
3271
3494
|
if (!textColorInSchema && !backgroundColorInSchema) {
|
|
3272
3495
|
return false;
|
|
3273
3496
|
}
|
|
@@ -3282,15 +3505,15 @@ function LumirColorStyleButton() {
|
|
|
3282
3505
|
return null;
|
|
3283
3506
|
}
|
|
3284
3507
|
const tooltip = "\uD14D\uC2A4\uD2B8 \uC0C9\xB7\uBC30\uACBD";
|
|
3285
|
-
return /* @__PURE__ */
|
|
3286
|
-
/* @__PURE__ */
|
|
3508
|
+
return /* @__PURE__ */ jsxs14(Components.Generic.Menu.Root, { children: [
|
|
3509
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ jsx22(
|
|
3287
3510
|
Components.FormattingToolbar.Button,
|
|
3288
3511
|
{
|
|
3289
3512
|
className: "bn-button",
|
|
3290
3513
|
"data-test": "colors",
|
|
3291
3514
|
label: tooltip,
|
|
3292
3515
|
mainTooltip: tooltip,
|
|
3293
|
-
icon: /* @__PURE__ */
|
|
3516
|
+
icon: /* @__PURE__ */ jsx22(
|
|
3294
3517
|
ColorIcon,
|
|
3295
3518
|
{
|
|
3296
3519
|
textColor: currentTextColor,
|
|
@@ -3300,11 +3523,11 @@ function LumirColorStyleButton() {
|
|
|
3300
3523
|
)
|
|
3301
3524
|
}
|
|
3302
3525
|
) }),
|
|
3303
|
-
/* @__PURE__ */
|
|
3526
|
+
/* @__PURE__ */ jsx22(
|
|
3304
3527
|
Components.Generic.Menu.Dropdown,
|
|
3305
3528
|
{
|
|
3306
3529
|
className: "bn-menu-dropdown bn-color-picker-dropdown",
|
|
3307
|
-
children: /* @__PURE__ */
|
|
3530
|
+
children: /* @__PURE__ */ jsx22(
|
|
3308
3531
|
LumirColorPicker,
|
|
3309
3532
|
{
|
|
3310
3533
|
textTitle: "\uD14D\uC2A4\uD2B8 \uC0C9",
|
|
@@ -3318,18 +3541,18 @@ function LumirColorStyleButton() {
|
|
|
3318
3541
|
] });
|
|
3319
3542
|
}
|
|
3320
3543
|
function LumirCellColorToolbarButton() {
|
|
3321
|
-
const Components =
|
|
3322
|
-
const editor =
|
|
3323
|
-
const selectedBlocks =
|
|
3324
|
-
const isMultiCell =
|
|
3544
|
+
const Components = useComponentsContext4();
|
|
3545
|
+
const editor = useBlockNoteEditor4();
|
|
3546
|
+
const selectedBlocks = useSelectedBlocks4(editor);
|
|
3547
|
+
const isMultiCell = useMemo4(() => {
|
|
3325
3548
|
if (selectedBlocks.length !== 1 || selectedBlocks[0].type !== "table") {
|
|
3326
3549
|
return false;
|
|
3327
3550
|
}
|
|
3328
3551
|
const cs = editor.tableHandles?.getCellSelection();
|
|
3329
3552
|
return !!cs && cs.cells.length > 1;
|
|
3330
3553
|
}, [editor, selectedBlocks]);
|
|
3331
|
-
const stashRef =
|
|
3332
|
-
const applyBackground =
|
|
3554
|
+
const stashRef = useRef10([]);
|
|
3555
|
+
const applyBackground = useCallback18(
|
|
3333
3556
|
(color) => {
|
|
3334
3557
|
const live = getSelectedCellPositions(editor);
|
|
3335
3558
|
const positions = live.length > 0 ? live : stashRef.current;
|
|
@@ -3342,7 +3565,7 @@ function LumirCellColorToolbarButton() {
|
|
|
3342
3565
|
return null;
|
|
3343
3566
|
}
|
|
3344
3567
|
const tooltip = "\uC140 \uBC30\uACBD\uC0C9";
|
|
3345
|
-
return /* @__PURE__ */
|
|
3568
|
+
return /* @__PURE__ */ jsxs14(
|
|
3346
3569
|
Components.Generic.Menu.Root,
|
|
3347
3570
|
{
|
|
3348
3571
|
onOpenChange: (open) => {
|
|
@@ -3351,21 +3574,21 @@ function LumirCellColorToolbarButton() {
|
|
|
3351
3574
|
}
|
|
3352
3575
|
},
|
|
3353
3576
|
children: [
|
|
3354
|
-
/* @__PURE__ */
|
|
3577
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ jsx22(
|
|
3355
3578
|
Components.FormattingToolbar.Button,
|
|
3356
3579
|
{
|
|
3357
3580
|
className: "bn-button",
|
|
3358
3581
|
"data-test": "cell-colors",
|
|
3359
3582
|
label: tooltip,
|
|
3360
3583
|
mainTooltip: tooltip,
|
|
3361
|
-
icon: /* @__PURE__ */
|
|
3584
|
+
icon: /* @__PURE__ */ jsx22(CellFillIcon, { size: 18 })
|
|
3362
3585
|
}
|
|
3363
3586
|
) }),
|
|
3364
|
-
/* @__PURE__ */
|
|
3587
|
+
/* @__PURE__ */ jsx22(
|
|
3365
3588
|
Components.Generic.Menu.Dropdown,
|
|
3366
3589
|
{
|
|
3367
3590
|
className: "bn-menu-dropdown bn-color-picker-dropdown",
|
|
3368
|
-
children: /* @__PURE__ */
|
|
3591
|
+
children: /* @__PURE__ */ jsx22(
|
|
3369
3592
|
LumirColorPicker,
|
|
3370
3593
|
{
|
|
3371
3594
|
backgroundTitle: "\uC140 \uBC30\uACBD",
|
|
@@ -3379,8 +3602,8 @@ function LumirCellColorToolbarButton() {
|
|
|
3379
3602
|
);
|
|
3380
3603
|
}
|
|
3381
3604
|
function LumirCellColorPickerButton(props) {
|
|
3382
|
-
const Components =
|
|
3383
|
-
const editor =
|
|
3605
|
+
const Components = useComponentsContext4();
|
|
3606
|
+
const editor = useBlockNoteEditor4();
|
|
3384
3607
|
const updateColor = (color, type) => {
|
|
3385
3608
|
const newTable = props.block.content.rows.map((row) => ({
|
|
3386
3609
|
...row,
|
|
@@ -3401,14 +3624,14 @@ function LumirCellColorPickerButton(props) {
|
|
|
3401
3624
|
if (!currentCell || editor.settings.tables.cellTextColor === false && editor.settings.tables.cellBackgroundColor === false) {
|
|
3402
3625
|
return null;
|
|
3403
3626
|
}
|
|
3404
|
-
return /* @__PURE__ */
|
|
3405
|
-
/* @__PURE__ */
|
|
3406
|
-
/* @__PURE__ */
|
|
3627
|
+
return /* @__PURE__ */ jsxs14(Components.Generic.Menu.Root, { position: "right", sub: true, children: [
|
|
3628
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Trigger, { sub: true, children: /* @__PURE__ */ jsx22(Components.Generic.Menu.Item, { className: "bn-menu-item", subTrigger: true, children: "\uC140 \uC0C9\xB7\uBC30\uACBD" }) }),
|
|
3629
|
+
/* @__PURE__ */ jsx22(
|
|
3407
3630
|
Components.Generic.Menu.Dropdown,
|
|
3408
3631
|
{
|
|
3409
3632
|
sub: true,
|
|
3410
3633
|
className: "bn-menu-dropdown bn-color-picker-dropdown",
|
|
3411
|
-
children: /* @__PURE__ */
|
|
3634
|
+
children: /* @__PURE__ */ jsx22(
|
|
3412
3635
|
LumirColorPicker,
|
|
3413
3636
|
{
|
|
3414
3637
|
iconSize: 18,
|
|
@@ -3429,13 +3652,13 @@ function LumirCellColorPickerButton(props) {
|
|
|
3429
3652
|
] });
|
|
3430
3653
|
}
|
|
3431
3654
|
function LumirTableCellMenu(props) {
|
|
3432
|
-
const Components =
|
|
3433
|
-
return /* @__PURE__ */
|
|
3655
|
+
const Components = useComponentsContext4();
|
|
3656
|
+
return /* @__PURE__ */ jsx22(
|
|
3434
3657
|
Components.Generic.Menu.Dropdown,
|
|
3435
3658
|
{
|
|
3436
3659
|
className: "bn-menu-dropdown bn-drag-handle-menu",
|
|
3437
|
-
children: props.children || /* @__PURE__ */
|
|
3438
|
-
/* @__PURE__ */
|
|
3660
|
+
children: props.children || /* @__PURE__ */ jsxs14(Fragment5, { children: [
|
|
3661
|
+
/* @__PURE__ */ jsx22(
|
|
3439
3662
|
SplitButton,
|
|
3440
3663
|
{
|
|
3441
3664
|
block: props.block,
|
|
@@ -3443,7 +3666,7 @@ function LumirTableCellMenu(props) {
|
|
|
3443
3666
|
colIndex: props.colIndex
|
|
3444
3667
|
}
|
|
3445
3668
|
),
|
|
3446
|
-
/* @__PURE__ */
|
|
3669
|
+
/* @__PURE__ */ jsx22(
|
|
3447
3670
|
LumirCellColorPickerButton,
|
|
3448
3671
|
{
|
|
3449
3672
|
block: props.block,
|
|
@@ -3457,74 +3680,75 @@ function LumirTableCellMenu(props) {
|
|
|
3457
3680
|
}
|
|
3458
3681
|
|
|
3459
3682
|
// src/components/CustomFormattingToolbar.tsx
|
|
3460
|
-
import { jsx as
|
|
3683
|
+
import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
3461
3684
|
var CustomFormattingToolbar = () => {
|
|
3462
|
-
return /* @__PURE__ */
|
|
3463
|
-
/* @__PURE__ */
|
|
3464
|
-
/* @__PURE__ */
|
|
3465
|
-
/* @__PURE__ */
|
|
3466
|
-
/* @__PURE__ */
|
|
3467
|
-
/* @__PURE__ */
|
|
3468
|
-
/* @__PURE__ */
|
|
3469
|
-
/* @__PURE__ */
|
|
3470
|
-
/* @__PURE__ */
|
|
3471
|
-
/* @__PURE__ */
|
|
3472
|
-
/* @__PURE__ */
|
|
3685
|
+
return /* @__PURE__ */ jsxs15(FormattingToolbar, { children: [
|
|
3686
|
+
/* @__PURE__ */ jsx23(BlockTypeSelect2, {}, "blockTypeSelect"),
|
|
3687
|
+
/* @__PURE__ */ jsx23(TableCellMergeButton, {}, "tableCellMergeButton"),
|
|
3688
|
+
/* @__PURE__ */ jsx23(FileCaptionButton, {}, "fileCaptionButton"),
|
|
3689
|
+
/* @__PURE__ */ jsx23(FileReplaceButton, {}, "replaceFileButton"),
|
|
3690
|
+
/* @__PURE__ */ jsx23(FileRenameButton, {}, "fileRenameButton"),
|
|
3691
|
+
/* @__PURE__ */ jsx23(FileDeleteButton, {}, "fileDeleteButton"),
|
|
3692
|
+
/* @__PURE__ */ jsx23(FileDownloadButton, {}, "fileDownloadButton"),
|
|
3693
|
+
/* @__PURE__ */ jsx23(FilePreviewButton, {}, "filePreviewButton"),
|
|
3694
|
+
/* @__PURE__ */ jsx23(BasicTextStyleButton, { basicTextStyle: "bold" }, "boldStyleButton"),
|
|
3695
|
+
/* @__PURE__ */ jsx23(
|
|
3473
3696
|
BasicTextStyleButton,
|
|
3474
3697
|
{
|
|
3475
3698
|
basicTextStyle: "italic"
|
|
3476
3699
|
},
|
|
3477
3700
|
"italicStyleButton"
|
|
3478
3701
|
),
|
|
3479
|
-
/* @__PURE__ */
|
|
3702
|
+
/* @__PURE__ */ jsx23(
|
|
3480
3703
|
BasicTextStyleButton,
|
|
3481
3704
|
{
|
|
3482
3705
|
basicTextStyle: "underline"
|
|
3483
3706
|
},
|
|
3484
3707
|
"underlineStyleButton"
|
|
3485
3708
|
),
|
|
3486
|
-
/* @__PURE__ */
|
|
3709
|
+
/* @__PURE__ */ jsx23(
|
|
3487
3710
|
BasicTextStyleButton,
|
|
3488
3711
|
{
|
|
3489
3712
|
basicTextStyle: "strike"
|
|
3490
3713
|
},
|
|
3491
3714
|
"strikeStyleButton"
|
|
3492
3715
|
),
|
|
3493
|
-
/* @__PURE__ */
|
|
3494
|
-
/* @__PURE__ */
|
|
3716
|
+
/* @__PURE__ */ jsx23(TextAlignButtonWithVA, { textAlignment: "left" }, "textAlignLeftButton"),
|
|
3717
|
+
/* @__PURE__ */ jsx23(
|
|
3495
3718
|
TextAlignButtonWithVA,
|
|
3496
3719
|
{
|
|
3497
3720
|
textAlignment: "center"
|
|
3498
3721
|
},
|
|
3499
3722
|
"textAlignCenterButton"
|
|
3500
3723
|
),
|
|
3501
|
-
/* @__PURE__ */
|
|
3502
|
-
/* @__PURE__ */
|
|
3724
|
+
/* @__PURE__ */ jsx23(TextAlignButtonWithVA, { textAlignment: "right" }, "textAlignRightButton"),
|
|
3725
|
+
/* @__PURE__ */ jsx23(
|
|
3503
3726
|
VerticalAlignButton,
|
|
3504
3727
|
{
|
|
3505
3728
|
verticalAlignment: "top"
|
|
3506
3729
|
},
|
|
3507
3730
|
"verticalAlignTop"
|
|
3508
3731
|
),
|
|
3509
|
-
/* @__PURE__ */
|
|
3732
|
+
/* @__PURE__ */ jsx23(
|
|
3510
3733
|
VerticalAlignButton,
|
|
3511
3734
|
{
|
|
3512
3735
|
verticalAlignment: "middle"
|
|
3513
3736
|
},
|
|
3514
3737
|
"verticalAlignMiddle"
|
|
3515
3738
|
),
|
|
3516
|
-
/* @__PURE__ */
|
|
3739
|
+
/* @__PURE__ */ jsx23(
|
|
3517
3740
|
VerticalAlignButton,
|
|
3518
3741
|
{
|
|
3519
3742
|
verticalAlignment: "bottom"
|
|
3520
3743
|
},
|
|
3521
3744
|
"verticalAlignBottom"
|
|
3522
3745
|
),
|
|
3523
|
-
/* @__PURE__ */
|
|
3524
|
-
/* @__PURE__ */
|
|
3525
|
-
/* @__PURE__ */
|
|
3526
|
-
/* @__PURE__ */
|
|
3527
|
-
/* @__PURE__ */
|
|
3746
|
+
/* @__PURE__ */ jsx23(FontSizeButton2, {}, "fontSizeButton"),
|
|
3747
|
+
/* @__PURE__ */ jsx23(LumirColorStyleButton, {}, "colorStyleButton"),
|
|
3748
|
+
/* @__PURE__ */ jsx23(LumirCellColorToolbarButton, {}, "cellColorButton"),
|
|
3749
|
+
/* @__PURE__ */ jsx23(NestBlockButton, {}, "nestBlockButton"),
|
|
3750
|
+
/* @__PURE__ */ jsx23(UnnestBlockButton, {}, "unnestBlockButton"),
|
|
3751
|
+
/* @__PURE__ */ jsx23(CreateLinkButton, {}, "createLinkButton")
|
|
3528
3752
|
] });
|
|
3529
3753
|
};
|
|
3530
3754
|
|
|
@@ -3533,13 +3757,13 @@ import {
|
|
|
3533
3757
|
ExtendButton,
|
|
3534
3758
|
TableCellButton,
|
|
3535
3759
|
TableHandle,
|
|
3536
|
-
useBlockNoteEditor as
|
|
3537
|
-
useEditorContentOrSelectionChange as
|
|
3760
|
+
useBlockNoteEditor as useBlockNoteEditor5,
|
|
3761
|
+
useEditorContentOrSelectionChange as useEditorContentOrSelectionChange3,
|
|
3538
3762
|
useExtendButtonsPositioning,
|
|
3539
3763
|
useUIPluginState
|
|
3540
3764
|
} from "@blocknote/react";
|
|
3541
3765
|
import { autoUpdate as autoUpdate2, FloatingPortal } from "@floating-ui/react";
|
|
3542
|
-
import { useCallback as
|
|
3766
|
+
import { useCallback as useCallback19, useEffect as useEffect10, useMemo as useMemo6, useRef as useRef11, useState as useState11 } from "react";
|
|
3543
3767
|
|
|
3544
3768
|
// src/components/hooks/useFocusedCellHandlePositioning.ts
|
|
3545
3769
|
import {
|
|
@@ -3548,7 +3772,7 @@ import {
|
|
|
3548
3772
|
useFloating,
|
|
3549
3773
|
useTransitionStyles
|
|
3550
3774
|
} from "@floating-ui/react";
|
|
3551
|
-
import { useEffect as
|
|
3775
|
+
import { useEffect as useEffect9, useMemo as useMemo5 } from "react";
|
|
3552
3776
|
function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
3553
3777
|
const { refs, floatingStyles, context } = useFloating({
|
|
3554
3778
|
open: show,
|
|
@@ -3558,7 +3782,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
|
3558
3782
|
whileElementsMounted: autoUpdate
|
|
3559
3783
|
});
|
|
3560
3784
|
const { isMounted, styles } = useTransitionStyles(context);
|
|
3561
|
-
|
|
3785
|
+
useEffect9(() => {
|
|
3562
3786
|
if (!cellEl) {
|
|
3563
3787
|
refs.setReference(null);
|
|
3564
3788
|
return;
|
|
@@ -3578,7 +3802,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
|
3578
3802
|
}
|
|
3579
3803
|
});
|
|
3580
3804
|
}, [cellEl, tbodyEl, orientation, refs]);
|
|
3581
|
-
return
|
|
3805
|
+
return useMemo5(
|
|
3582
3806
|
() => ({
|
|
3583
3807
|
isMounted,
|
|
3584
3808
|
ref: refs.setFloating,
|
|
@@ -3593,7 +3817,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
|
3593
3817
|
}
|
|
3594
3818
|
|
|
3595
3819
|
// src/components/LumirTableHandlesController.tsx
|
|
3596
|
-
import { Fragment as Fragment6, jsx as
|
|
3820
|
+
import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
3597
3821
|
function syncCoreHoverToFocusedCell(cellEl) {
|
|
3598
3822
|
const r = cellEl.getBoundingClientRect();
|
|
3599
3823
|
cellEl.dispatchEvent(
|
|
@@ -3607,15 +3831,15 @@ function syncCoreHoverToFocusedCell(cellEl) {
|
|
|
3607
3831
|
);
|
|
3608
3832
|
}
|
|
3609
3833
|
function LumirTableHandlesController() {
|
|
3610
|
-
const editor =
|
|
3611
|
-
const [focused, setFocused] =
|
|
3612
|
-
const [menuContainerRef, setMenuContainerRef] =
|
|
3613
|
-
const [overlayEl, setOverlayEl] =
|
|
3614
|
-
const [openMenu, setOpenMenu] =
|
|
3615
|
-
const frozenRef =
|
|
3616
|
-
const menuOpenRef =
|
|
3617
|
-
const draggingRef =
|
|
3618
|
-
const recompute =
|
|
3834
|
+
const editor = useBlockNoteEditor5();
|
|
3835
|
+
const [focused, setFocused] = useState11(null);
|
|
3836
|
+
const [menuContainerRef, setMenuContainerRef] = useState11(null);
|
|
3837
|
+
const [overlayEl, setOverlayEl] = useState11(null);
|
|
3838
|
+
const [openMenu, setOpenMenu] = useState11(null);
|
|
3839
|
+
const frozenRef = useRef11(false);
|
|
3840
|
+
const menuOpenRef = useRef11(false);
|
|
3841
|
+
const draggingRef = useRef11(false);
|
|
3842
|
+
const recompute = useCallback19(() => {
|
|
3619
3843
|
if (frozenRef.current) {
|
|
3620
3844
|
return;
|
|
3621
3845
|
}
|
|
@@ -3663,11 +3887,11 @@ function LumirTableHandlesController() {
|
|
|
3663
3887
|
widgetContainer
|
|
3664
3888
|
});
|
|
3665
3889
|
}, [editor]);
|
|
3666
|
-
|
|
3667
|
-
|
|
3890
|
+
useEditorContentOrSelectionChange3(recompute, editor);
|
|
3891
|
+
useEffect10(() => {
|
|
3668
3892
|
recompute();
|
|
3669
3893
|
}, [recompute]);
|
|
3670
|
-
|
|
3894
|
+
useEffect10(() => {
|
|
3671
3895
|
const onUp = () => {
|
|
3672
3896
|
requestAnimationFrame(() => {
|
|
3673
3897
|
if (!menuOpenRef.current && !draggingRef.current && frozenRef.current) {
|
|
@@ -3679,7 +3903,7 @@ function LumirTableHandlesController() {
|
|
|
3679
3903
|
window.addEventListener("pointerup", onUp);
|
|
3680
3904
|
return () => window.removeEventListener("pointerup", onUp);
|
|
3681
3905
|
}, [recompute]);
|
|
3682
|
-
|
|
3906
|
+
useEffect10(() => {
|
|
3683
3907
|
const f = focused;
|
|
3684
3908
|
if (!f || !overlayEl) {
|
|
3685
3909
|
return;
|
|
@@ -3726,13 +3950,13 @@ function LumirTableHandlesController() {
|
|
|
3726
3950
|
coreState?.showAddOrRemoveRowsButton || false,
|
|
3727
3951
|
coreState?.referencePosTable || null
|
|
3728
3952
|
);
|
|
3729
|
-
const onStartExtend =
|
|
3953
|
+
const onStartExtend = useCallback19(() => {
|
|
3730
3954
|
editor.tableHandles?.freezeHandles();
|
|
3731
3955
|
}, [editor]);
|
|
3732
|
-
const onEndExtend =
|
|
3956
|
+
const onEndExtend = useCallback19(() => {
|
|
3733
3957
|
editor.tableHandles?.unfreezeHandles();
|
|
3734
3958
|
}, [editor]);
|
|
3735
|
-
const menuHandlers =
|
|
3959
|
+
const menuHandlers = useMemo6(() => {
|
|
3736
3960
|
const mk = (kind) => ({
|
|
3737
3961
|
freeze: () => {
|
|
3738
3962
|
menuOpenRef.current = true;
|
|
@@ -3750,10 +3974,10 @@ function LumirTableHandlesController() {
|
|
|
3750
3974
|
});
|
|
3751
3975
|
return { col: mk("col"), row: mk("row"), cell: mk("cell") };
|
|
3752
3976
|
}, [editor, recompute]);
|
|
3753
|
-
const onGutterPointerDown =
|
|
3977
|
+
const onGutterPointerDown = useCallback19(() => {
|
|
3754
3978
|
frozenRef.current = true;
|
|
3755
3979
|
}, []);
|
|
3756
|
-
const onGutterPointerEnter =
|
|
3980
|
+
const onGutterPointerEnter = useCallback19(
|
|
3757
3981
|
(e) => {
|
|
3758
3982
|
if (e.buttons === 0 && focused) {
|
|
3759
3983
|
syncCoreHoverToFocusedCell(focused.cellEl);
|
|
@@ -3761,7 +3985,7 @@ function LumirTableHandlesController() {
|
|
|
3761
3985
|
},
|
|
3762
3986
|
[focused]
|
|
3763
3987
|
);
|
|
3764
|
-
const makeDragStart =
|
|
3988
|
+
const makeDragStart = useCallback19(
|
|
3765
3989
|
(dir) => (e) => {
|
|
3766
3990
|
draggingRef.current = true;
|
|
3767
3991
|
frozenRef.current = true;
|
|
@@ -3773,19 +3997,19 @@ function LumirTableHandlesController() {
|
|
|
3773
3997
|
},
|
|
3774
3998
|
[editor]
|
|
3775
3999
|
);
|
|
3776
|
-
const onDragEnd =
|
|
4000
|
+
const onDragEnd = useCallback19(() => {
|
|
3777
4001
|
editor.tableHandles?.dragEnd();
|
|
3778
4002
|
draggingRef.current = false;
|
|
3779
4003
|
frozenRef.current = false;
|
|
3780
4004
|
recompute();
|
|
3781
4005
|
}, [editor, recompute]);
|
|
3782
|
-
const noop =
|
|
4006
|
+
const noop = useCallback19(() => {
|
|
3783
4007
|
}, []);
|
|
3784
|
-
return /* @__PURE__ */
|
|
3785
|
-
/* @__PURE__ */
|
|
3786
|
-
th && focused && menuContainerRef && /* @__PURE__ */
|
|
3787
|
-
/* @__PURE__ */
|
|
3788
|
-
colHandle.isMounted && /* @__PURE__ */
|
|
4008
|
+
return /* @__PURE__ */ jsxs16(Fragment6, { children: [
|
|
4009
|
+
/* @__PURE__ */ jsx24("div", { ref: setMenuContainerRef }),
|
|
4010
|
+
th && focused && menuContainerRef && /* @__PURE__ */ jsxs16(FloatingPortal, { root: focused.widgetContainer, children: [
|
|
4011
|
+
/* @__PURE__ */ jsx24("div", { ref: setOverlayEl, className: "lumir-tbl-cell-focus" }),
|
|
4012
|
+
colHandle.isMounted && /* @__PURE__ */ jsxs16(
|
|
3789
4013
|
"div",
|
|
3790
4014
|
{
|
|
3791
4015
|
ref: colHandle.ref,
|
|
@@ -3794,8 +4018,8 @@ function LumirTableHandlesController() {
|
|
|
3794
4018
|
onPointerEnter: onGutterPointerEnter,
|
|
3795
4019
|
onPointerDown: onGutterPointerDown,
|
|
3796
4020
|
children: [
|
|
3797
|
-
/* @__PURE__ */
|
|
3798
|
-
/* @__PURE__ */
|
|
4021
|
+
/* @__PURE__ */ jsx24("span", { className: "lumir-tbl-gutter" }),
|
|
4022
|
+
/* @__PURE__ */ jsx24("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ jsx24(
|
|
3799
4023
|
TableHandle,
|
|
3800
4024
|
{
|
|
3801
4025
|
editor,
|
|
@@ -3814,7 +4038,7 @@ function LumirTableHandlesController() {
|
|
|
3814
4038
|
]
|
|
3815
4039
|
}
|
|
3816
4040
|
),
|
|
3817
|
-
rowHandle.isMounted && /* @__PURE__ */
|
|
4041
|
+
rowHandle.isMounted && /* @__PURE__ */ jsxs16(
|
|
3818
4042
|
"div",
|
|
3819
4043
|
{
|
|
3820
4044
|
ref: rowHandle.ref,
|
|
@@ -3823,8 +4047,8 @@ function LumirTableHandlesController() {
|
|
|
3823
4047
|
onPointerEnter: onGutterPointerEnter,
|
|
3824
4048
|
onPointerDown: onGutterPointerDown,
|
|
3825
4049
|
children: [
|
|
3826
|
-
/* @__PURE__ */
|
|
3827
|
-
/* @__PURE__ */
|
|
4050
|
+
/* @__PURE__ */ jsx24("span", { className: "lumir-tbl-gutter" }),
|
|
4051
|
+
/* @__PURE__ */ jsx24("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ jsx24(
|
|
3828
4052
|
TableHandle,
|
|
3829
4053
|
{
|
|
3830
4054
|
editor,
|
|
@@ -3843,7 +4067,7 @@ function LumirTableHandlesController() {
|
|
|
3843
4067
|
]
|
|
3844
4068
|
}
|
|
3845
4069
|
),
|
|
3846
|
-
cellHandle.isMounted && openMenu !== "col" && openMenu !== "row" && /* @__PURE__ */
|
|
4070
|
+
cellHandle.isMounted && openMenu !== "col" && openMenu !== "row" && /* @__PURE__ */ jsxs16(
|
|
3847
4071
|
"div",
|
|
3848
4072
|
{
|
|
3849
4073
|
ref: cellHandle.ref,
|
|
@@ -3851,8 +4075,8 @@ function LumirTableHandlesController() {
|
|
|
3851
4075
|
className: "lumir-tbl-gutter-wrap lumir-tbl-gutter-wrap--cell" + (openMenu === "cell" ? " lumir-tbl-gutter-wrap--active" : ""),
|
|
3852
4076
|
onPointerDown: onGutterPointerDown,
|
|
3853
4077
|
children: [
|
|
3854
|
-
/* @__PURE__ */
|
|
3855
|
-
/* @__PURE__ */
|
|
4078
|
+
/* @__PURE__ */ jsx24("span", { className: "lumir-tbl-gutter" }),
|
|
4079
|
+
/* @__PURE__ */ jsx24("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ jsx24(
|
|
3856
4080
|
TableCellButton,
|
|
3857
4081
|
{
|
|
3858
4082
|
editor,
|
|
@@ -3869,8 +4093,8 @@ function LumirTableHandlesController() {
|
|
|
3869
4093
|
}
|
|
3870
4094
|
)
|
|
3871
4095
|
] }),
|
|
3872
|
-
th && coreState?.widgetContainer && /* @__PURE__ */
|
|
3873
|
-
/* @__PURE__ */
|
|
4096
|
+
th && coreState?.widgetContainer && /* @__PURE__ */ jsxs16(FloatingPortal, { root: coreState.widgetContainer, children: [
|
|
4097
|
+
/* @__PURE__ */ jsx24("div", { ref: addOrRemoveRowsButton.ref, style: addOrRemoveRowsButton.style, children: /* @__PURE__ */ jsx24(
|
|
3874
4098
|
ExtendButton,
|
|
3875
4099
|
{
|
|
3876
4100
|
editor,
|
|
@@ -3880,12 +4104,12 @@ function LumirTableHandlesController() {
|
|
|
3880
4104
|
onMouseUp: onEndExtend
|
|
3881
4105
|
}
|
|
3882
4106
|
) }),
|
|
3883
|
-
/* @__PURE__ */
|
|
4107
|
+
/* @__PURE__ */ jsx24(
|
|
3884
4108
|
"div",
|
|
3885
4109
|
{
|
|
3886
4110
|
ref: addOrRemoveColumnsButton.ref,
|
|
3887
4111
|
style: addOrRemoveColumnsButton.style,
|
|
3888
|
-
children: /* @__PURE__ */
|
|
4112
|
+
children: /* @__PURE__ */ jsx24(
|
|
3889
4113
|
ExtendButton,
|
|
3890
4114
|
{
|
|
3891
4115
|
editor,
|
|
@@ -3983,6 +4207,90 @@ function patchBlocks(blocks, tableVAMap) {
|
|
|
3983
4207
|
});
|
|
3984
4208
|
}
|
|
3985
4209
|
|
|
4210
|
+
// src/utils/font-size-serialization.ts
|
|
4211
|
+
function mapPreservingRef(arr, fn) {
|
|
4212
|
+
let changed = false;
|
|
4213
|
+
const next = arr.map((item) => {
|
|
4214
|
+
const mapped = fn(item);
|
|
4215
|
+
if (mapped !== item) changed = true;
|
|
4216
|
+
return mapped;
|
|
4217
|
+
});
|
|
4218
|
+
return changed ? next : arr;
|
|
4219
|
+
}
|
|
4220
|
+
function mapStyledItem(item, dir) {
|
|
4221
|
+
if (!item || typeof item !== "object" || item.type !== "text") {
|
|
4222
|
+
return item;
|
|
4223
|
+
}
|
|
4224
|
+
if (dir === "lower") {
|
|
4225
|
+
const fs2 = item.styles?.fontSize;
|
|
4226
|
+
if (fs2 == null) return item;
|
|
4227
|
+
const { fontSize: _removed, ...restStyles } = item.styles;
|
|
4228
|
+
return { ...item, styles: restStyles, fontSize: fs2 };
|
|
4229
|
+
}
|
|
4230
|
+
const fs = item.fontSize;
|
|
4231
|
+
if (fs == null) return item;
|
|
4232
|
+
const { fontSize: _lifted, ...rest } = item;
|
|
4233
|
+
return { ...rest, styles: { ...item.styles ?? {}, fontSize: fs } };
|
|
4234
|
+
}
|
|
4235
|
+
function mapInlineItem(node, dir) {
|
|
4236
|
+
if (!node || typeof node !== "object") return node;
|
|
4237
|
+
if (node.type === "link" && Array.isArray(node.content)) {
|
|
4238
|
+
const content = mapPreservingRef(
|
|
4239
|
+
node.content,
|
|
4240
|
+
(n) => mapStyledItem(n, dir)
|
|
4241
|
+
);
|
|
4242
|
+
return content === node.content ? node : { ...node, content };
|
|
4243
|
+
}
|
|
4244
|
+
return mapStyledItem(node, dir);
|
|
4245
|
+
}
|
|
4246
|
+
function mapCell(cell, dir) {
|
|
4247
|
+
if (cell && typeof cell === "object" && cell.type === "tableCell") {
|
|
4248
|
+
if (!Array.isArray(cell.content)) return cell;
|
|
4249
|
+
const content = mapPreservingRef(
|
|
4250
|
+
cell.content,
|
|
4251
|
+
(n) => mapInlineItem(n, dir)
|
|
4252
|
+
);
|
|
4253
|
+
return content === cell.content ? cell : { ...cell, content };
|
|
4254
|
+
}
|
|
4255
|
+
if (Array.isArray(cell)) {
|
|
4256
|
+
return mapPreservingRef(cell, (n) => mapInlineItem(n, dir));
|
|
4257
|
+
}
|
|
4258
|
+
return cell;
|
|
4259
|
+
}
|
|
4260
|
+
function mapBlock(block, dir) {
|
|
4261
|
+
if (!block || typeof block !== "object") return block;
|
|
4262
|
+
let next = block;
|
|
4263
|
+
const content = block.content;
|
|
4264
|
+
if (Array.isArray(content)) {
|
|
4265
|
+
const mapped = mapPreservingRef(content, (n) => mapInlineItem(n, dir));
|
|
4266
|
+
if (mapped !== content) next = { ...next, content: mapped };
|
|
4267
|
+
} else if (content && typeof content === "object" && content.type === "tableContent" && Array.isArray(content.rows)) {
|
|
4268
|
+
const rows = mapPreservingRef(content.rows, (row) => {
|
|
4269
|
+
if (!row || !Array.isArray(row.cells)) return row;
|
|
4270
|
+
const cells = mapPreservingRef(
|
|
4271
|
+
row.cells,
|
|
4272
|
+
(cell) => mapCell(cell, dir)
|
|
4273
|
+
);
|
|
4274
|
+
return cells === row.cells ? row : { ...row, cells };
|
|
4275
|
+
});
|
|
4276
|
+
if (rows !== content.rows) next = { ...next, content: { ...content, rows } };
|
|
4277
|
+
}
|
|
4278
|
+
if (Array.isArray(block.children) && block.children.length > 0) {
|
|
4279
|
+
const children = mapPreservingRef(
|
|
4280
|
+
block.children,
|
|
4281
|
+
(b) => mapBlock(b, dir)
|
|
4282
|
+
);
|
|
4283
|
+
if (children !== block.children) next = { ...next, children };
|
|
4284
|
+
}
|
|
4285
|
+
return next;
|
|
4286
|
+
}
|
|
4287
|
+
function lowerFontSize(blocks) {
|
|
4288
|
+
return mapPreservingRef(blocks, (b) => mapBlock(b, "lower"));
|
|
4289
|
+
}
|
|
4290
|
+
function liftFontSize(blocks) {
|
|
4291
|
+
return mapPreservingRef(blocks, (b) => mapBlock(b, "lift"));
|
|
4292
|
+
}
|
|
4293
|
+
|
|
3986
4294
|
// src/utils/excel-paste.ts
|
|
3987
4295
|
var NAMED_COLORS = {
|
|
3988
4296
|
black: "#000000",
|
|
@@ -4231,7 +4539,7 @@ var ALLOWED_VIDEO_EXTENSIONS = [
|
|
|
4231
4539
|
];
|
|
4232
4540
|
|
|
4233
4541
|
// src/components/LumirEditor.tsx
|
|
4234
|
-
import { Fragment as Fragment7, jsx as
|
|
4542
|
+
import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
4235
4543
|
var DEBUG_LOG = (loc, msg, data) => {
|
|
4236
4544
|
const p = fetch("http://127.0.0.1:7686/ingest/1f8ee1c5-0cf0-4ae7-91ed-5ea7ed17130a", {
|
|
4237
4545
|
method: "POST",
|
|
@@ -4396,6 +4704,12 @@ var isVideoFile = (file, maxSize) => {
|
|
|
4396
4704
|
});
|
|
4397
4705
|
return result;
|
|
4398
4706
|
};
|
|
4707
|
+
var isSuppressiblePopupSelection = (editor, selection) => {
|
|
4708
|
+
if (!selection) return false;
|
|
4709
|
+
if (selection.node) return false;
|
|
4710
|
+
if (isInTableCell(editor)) return false;
|
|
4711
|
+
return true;
|
|
4712
|
+
};
|
|
4399
4713
|
var isHtmlFile = (file) => {
|
|
4400
4714
|
return file.size > 0 && (file.type === "text/html" || file.name?.toLowerCase().endsWith(".html") || file.name?.toLowerCase().endsWith(".htm"));
|
|
4401
4715
|
};
|
|
@@ -4456,9 +4770,9 @@ var findBlockWithLink = (blocks, targetUrl) => {
|
|
|
4456
4770
|
return null;
|
|
4457
4771
|
};
|
|
4458
4772
|
var ConvertToPreviewButton = ({ url }) => {
|
|
4459
|
-
const editor =
|
|
4460
|
-
const Components =
|
|
4461
|
-
return /* @__PURE__ */
|
|
4773
|
+
const editor = useBlockNoteEditor6();
|
|
4774
|
+
const Components = useComponentsContext5();
|
|
4775
|
+
return /* @__PURE__ */ jsx25(
|
|
4462
4776
|
Components.LinkToolbar.Button,
|
|
4463
4777
|
{
|
|
4464
4778
|
className: "bn-button",
|
|
@@ -4477,29 +4791,29 @@ var ConvertToPreviewButton = ({ url }) => {
|
|
|
4477
4791
|
console.error("Convert to link preview failed:", err);
|
|
4478
4792
|
}
|
|
4479
4793
|
},
|
|
4480
|
-
icon: /* @__PURE__ */
|
|
4481
|
-
/* @__PURE__ */
|
|
4482
|
-
/* @__PURE__ */
|
|
4483
|
-
/* @__PURE__ */
|
|
4794
|
+
icon: /* @__PURE__ */ jsxs17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
4795
|
+
/* @__PURE__ */ jsx25("rect", { x: "1", y: "3", width: "14", height: "10", rx: "2", stroke: "currentColor", strokeWidth: "1.5", fill: "none" }),
|
|
4796
|
+
/* @__PURE__ */ jsx25("line", { x1: "1", y1: "9", x2: "15", y2: "9", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
4797
|
+
/* @__PURE__ */ jsx25("circle", { cx: "5", cy: "6.5", r: "1.5", stroke: "currentColor", strokeWidth: "1", fill: "none" })
|
|
4484
4798
|
] })
|
|
4485
4799
|
}
|
|
4486
4800
|
);
|
|
4487
4801
|
};
|
|
4488
4802
|
var CustomLinkToolbar = (props) => {
|
|
4489
|
-
const editor =
|
|
4490
|
-
const Components =
|
|
4803
|
+
const editor = useBlockNoteEditor6();
|
|
4804
|
+
const Components = useComponentsContext5();
|
|
4491
4805
|
const hasLinkPreview = !!editor?._linkPreviewApiEndpoint;
|
|
4492
|
-
return /* @__PURE__ */
|
|
4806
|
+
return /* @__PURE__ */ jsxs17(
|
|
4493
4807
|
Components.LinkToolbar.Root,
|
|
4494
4808
|
{
|
|
4495
4809
|
className: "bn-toolbar bn-link-toolbar",
|
|
4496
4810
|
onMouseEnter: props.stopHideTimer,
|
|
4497
4811
|
onMouseLeave: props.startHideTimer,
|
|
4498
4812
|
children: [
|
|
4499
|
-
/* @__PURE__ */
|
|
4500
|
-
/* @__PURE__ */
|
|
4501
|
-
/* @__PURE__ */
|
|
4502
|
-
hasLinkPreview && /* @__PURE__ */
|
|
4813
|
+
/* @__PURE__ */ jsx25(EditLinkButton, { url: props.url, text: props.text, editLink: props.editLink }),
|
|
4814
|
+
/* @__PURE__ */ jsx25(OpenLinkButton, { url: props.url }),
|
|
4815
|
+
/* @__PURE__ */ jsx25(DeleteLinkButton, { deleteLink: props.deleteLink }),
|
|
4816
|
+
hasLinkPreview && /* @__PURE__ */ jsx25(ConvertToPreviewButton, { url: props.url })
|
|
4503
4817
|
]
|
|
4504
4818
|
}
|
|
4505
4819
|
);
|
|
@@ -4543,13 +4857,13 @@ function LumirEditor({
|
|
|
4543
4857
|
onError,
|
|
4544
4858
|
onImageDelete
|
|
4545
4859
|
}) {
|
|
4546
|
-
const [isUploading, setIsUploading] =
|
|
4547
|
-
const [uploadProgress, setUploadProgress] =
|
|
4548
|
-
const [errorMessage, setErrorMessage] =
|
|
4549
|
-
const floatingMenuFileInputRef =
|
|
4550
|
-
const floatingMenuBlockRef =
|
|
4551
|
-
const floatingMenuUploadStartTimeRef =
|
|
4552
|
-
const handleError =
|
|
4860
|
+
const [isUploading, setIsUploading] = useState12(false);
|
|
4861
|
+
const [uploadProgress, setUploadProgress] = useState12(null);
|
|
4862
|
+
const [errorMessage, setErrorMessage] = useState12(null);
|
|
4863
|
+
const floatingMenuFileInputRef = useRef12(null);
|
|
4864
|
+
const floatingMenuBlockRef = useRef12(null);
|
|
4865
|
+
const floatingMenuUploadStartTimeRef = useRef12(0);
|
|
4866
|
+
const handleError = useCallback20(
|
|
4553
4867
|
(error) => {
|
|
4554
4868
|
onError?.(error);
|
|
4555
4869
|
setErrorMessage(error.getUserMessage());
|
|
@@ -4557,10 +4871,12 @@ function LumirEditor({
|
|
|
4557
4871
|
},
|
|
4558
4872
|
[onError]
|
|
4559
4873
|
);
|
|
4560
|
-
const validatedContent =
|
|
4561
|
-
return
|
|
4874
|
+
const validatedContent = useMemo7(() => {
|
|
4875
|
+
return liftFontSize(
|
|
4876
|
+
ContentUtils.validateContent(initialContent, initialEmptyBlocks)
|
|
4877
|
+
);
|
|
4562
4878
|
}, [initialContent, initialEmptyBlocks]);
|
|
4563
|
-
const tableConfig =
|
|
4879
|
+
const tableConfig = useMemo7(() => {
|
|
4564
4880
|
return EditorConfig.getDefaultTableConfig(tables);
|
|
4565
4881
|
}, [
|
|
4566
4882
|
tables?.splitCells,
|
|
@@ -4568,10 +4884,10 @@ function LumirEditor({
|
|
|
4568
4884
|
tables?.cellTextColor,
|
|
4569
4885
|
tables?.headers
|
|
4570
4886
|
]);
|
|
4571
|
-
const headingConfig =
|
|
4887
|
+
const headingConfig = useMemo7(() => {
|
|
4572
4888
|
return EditorConfig.getDefaultHeadingConfig(heading);
|
|
4573
4889
|
}, [heading?.levels?.join(",") ?? ""]);
|
|
4574
|
-
const disabledExtensions =
|
|
4890
|
+
const disabledExtensions = useMemo7(() => {
|
|
4575
4891
|
return EditorConfig.getDisabledExtensions(
|
|
4576
4892
|
disableExtensions,
|
|
4577
4893
|
allowVideoUpload,
|
|
@@ -4579,18 +4895,18 @@ function LumirEditor({
|
|
|
4579
4895
|
allowFileUpload
|
|
4580
4896
|
);
|
|
4581
4897
|
}, [disableExtensions, allowVideoUpload, allowAudioUpload, allowFileUpload]);
|
|
4582
|
-
|
|
4898
|
+
useEffect11(() => {
|
|
4583
4899
|
DEBUG_LOG("LumirEditor:init:disabledExtensions", "snapshot", {
|
|
4584
4900
|
allowVideoUpload,
|
|
4585
4901
|
hasVideoInDisabled: disabledExtensions.includes("video"),
|
|
4586
4902
|
disabledList: disabledExtensions.slice(0, 15)
|
|
4587
4903
|
});
|
|
4588
4904
|
}, [allowVideoUpload, disabledExtensions]);
|
|
4589
|
-
const fileNameTransformRef =
|
|
4590
|
-
|
|
4905
|
+
const fileNameTransformRef = useRef12(s3Upload?.fileNameTransform);
|
|
4906
|
+
useEffect11(() => {
|
|
4591
4907
|
fileNameTransformRef.current = s3Upload?.fileNameTransform;
|
|
4592
4908
|
}, [s3Upload?.fileNameTransform]);
|
|
4593
|
-
const memoizedS3Upload =
|
|
4909
|
+
const memoizedS3Upload = useMemo7(() => {
|
|
4594
4910
|
if (!s3Upload) return void 0;
|
|
4595
4911
|
return {
|
|
4596
4912
|
apiEndpoint: s3Upload.apiEndpoint,
|
|
@@ -4823,27 +5139,40 @@ function LumirEditor({
|
|
|
4823
5139
|
if (editor && linkPreview?.apiEndpoint) {
|
|
4824
5140
|
editor._linkPreviewApiEndpoint = linkPreview.apiEndpoint;
|
|
4825
5141
|
}
|
|
4826
|
-
|
|
5142
|
+
useEffect11(() => {
|
|
4827
5143
|
if (editor) {
|
|
4828
5144
|
editor.isEditable = editable;
|
|
4829
5145
|
}
|
|
4830
5146
|
}, [editor, editable]);
|
|
4831
|
-
|
|
5147
|
+
useEffect11(() => {
|
|
5148
|
+
if (!editor || !floatingMenu) return;
|
|
5149
|
+
const ft = editor.formattingToolbar;
|
|
5150
|
+
if (!ft?.onUpdate) return;
|
|
5151
|
+
const unsubscribe = ft.onUpdate((state) => {
|
|
5152
|
+
if (!state?.show) return;
|
|
5153
|
+
const selection = editor._tiptapEditor?.state?.selection;
|
|
5154
|
+
if (isSuppressiblePopupSelection(editor, selection)) {
|
|
5155
|
+
ft.closeMenu();
|
|
5156
|
+
}
|
|
5157
|
+
});
|
|
5158
|
+
return unsubscribe;
|
|
5159
|
+
}, [editor, floatingMenu]);
|
|
5160
|
+
useEffect11(() => {
|
|
4832
5161
|
if (!editor || !onContentChange) return;
|
|
4833
5162
|
const handleContentChange = () => {
|
|
4834
5163
|
const blocks = editor.topLevelBlocks;
|
|
4835
|
-
const patched = injectVerticalAlignment(blocks, editor);
|
|
5164
|
+
const patched = lowerFontSize(injectVerticalAlignment(blocks, editor));
|
|
4836
5165
|
onContentChange(patched);
|
|
4837
5166
|
};
|
|
4838
5167
|
return editor.onEditorContentChange(handleContentChange);
|
|
4839
5168
|
}, [editor, onContentChange]);
|
|
4840
|
-
const previousMediaUrlsRef =
|
|
4841
|
-
|
|
5169
|
+
const previousMediaUrlsRef = useRef12(/* @__PURE__ */ new Set());
|
|
5170
|
+
useEffect11(() => {
|
|
4842
5171
|
if (!editor) return;
|
|
4843
5172
|
const initialBlocks = editor.topLevelBlocks;
|
|
4844
5173
|
previousMediaUrlsRef.current = extractMediaUrls(initialBlocks);
|
|
4845
5174
|
}, [editor]);
|
|
4846
|
-
|
|
5175
|
+
useEffect11(() => {
|
|
4847
5176
|
if (!editor || !onImageDelete) return;
|
|
4848
5177
|
const handleMediaDeleteCheck = () => {
|
|
4849
5178
|
const currentBlocks = editor.topLevelBlocks;
|
|
@@ -4857,7 +5186,7 @@ function LumirEditor({
|
|
|
4857
5186
|
};
|
|
4858
5187
|
return editor.onEditorContentChange(handleMediaDeleteCheck);
|
|
4859
5188
|
}, [editor, onImageDelete]);
|
|
4860
|
-
|
|
5189
|
+
useEffect11(() => {
|
|
4861
5190
|
const el = editor?.domElement;
|
|
4862
5191
|
if (!el) return;
|
|
4863
5192
|
const handleDragOver = (e) => {
|
|
@@ -4988,20 +5317,20 @@ function LumirEditor({
|
|
|
4988
5317
|
el.removeEventListener("drop", handleDrop, { capture: true });
|
|
4989
5318
|
};
|
|
4990
5319
|
}, [editor, allowVideoUpload]);
|
|
4991
|
-
const computedSideMenu =
|
|
5320
|
+
const computedSideMenu = useMemo7(() => {
|
|
4992
5321
|
return sideMenuAddButton ? sideMenu : false;
|
|
4993
5322
|
}, [sideMenuAddButton, sideMenu]);
|
|
4994
|
-
const DragHandleOnlySideMenu =
|
|
4995
|
-
return (props) => /* @__PURE__ */
|
|
5323
|
+
const DragHandleOnlySideMenu = useMemo7(() => {
|
|
5324
|
+
return (props) => /* @__PURE__ */ jsx25(BlockSideMenu, { ...props, children: /* @__PURE__ */ jsx25(DragHandleButton, { ...props }) });
|
|
4996
5325
|
}, []);
|
|
4997
|
-
return /* @__PURE__ */
|
|
5326
|
+
return /* @__PURE__ */ jsxs17(
|
|
4998
5327
|
"div",
|
|
4999
5328
|
{
|
|
5000
5329
|
className: cn("lumirEditor", className),
|
|
5001
5330
|
style: { position: "relative", display: "flex", flexDirection: "column" },
|
|
5002
5331
|
children: [
|
|
5003
|
-
floatingMenu && editor && /* @__PURE__ */
|
|
5004
|
-
/* @__PURE__ */
|
|
5332
|
+
floatingMenu && editor && /* @__PURE__ */ jsxs17(Fragment7, { children: [
|
|
5333
|
+
/* @__PURE__ */ jsx25(
|
|
5005
5334
|
"input",
|
|
5006
5335
|
{
|
|
5007
5336
|
ref: floatingMenuFileInputRef,
|
|
@@ -5072,7 +5401,7 @@ function LumirEditor({
|
|
|
5072
5401
|
}
|
|
5073
5402
|
}
|
|
5074
5403
|
),
|
|
5075
|
-
/* @__PURE__ */
|
|
5404
|
+
/* @__PURE__ */ jsx25(
|
|
5076
5405
|
FloatingMenu,
|
|
5077
5406
|
{
|
|
5078
5407
|
editor,
|
|
@@ -5104,7 +5433,7 @@ function LumirEditor({
|
|
|
5104
5433
|
}
|
|
5105
5434
|
)
|
|
5106
5435
|
] }),
|
|
5107
|
-
/* @__PURE__ */
|
|
5436
|
+
/* @__PURE__ */ jsxs17(
|
|
5108
5437
|
BlockNoteView,
|
|
5109
5438
|
{
|
|
5110
5439
|
editor,
|
|
@@ -5119,19 +5448,19 @@ function LumirEditor({
|
|
|
5119
5448
|
tableHandles: false,
|
|
5120
5449
|
onSelectionChange,
|
|
5121
5450
|
children: [
|
|
5122
|
-
tableHandles && /* @__PURE__ */
|
|
5123
|
-
formattingToolbar && /* @__PURE__ */
|
|
5451
|
+
tableHandles && /* @__PURE__ */ jsx25(LumirTableHandlesController, {}),
|
|
5452
|
+
formattingToolbar && /* @__PURE__ */ jsx25(
|
|
5124
5453
|
FormattingToolbarController,
|
|
5125
5454
|
{
|
|
5126
5455
|
formattingToolbar: CustomFormattingToolbar
|
|
5127
5456
|
}
|
|
5128
5457
|
),
|
|
5129
|
-
linkToolbar && (linkPreview?.apiEndpoint ? /* @__PURE__ */
|
|
5130
|
-
/* @__PURE__ */
|
|
5458
|
+
linkToolbar && (linkPreview?.apiEndpoint ? /* @__PURE__ */ jsx25(LinkToolbarController, { linkToolbar: CustomLinkToolbar }) : /* @__PURE__ */ jsx25(LinkToolbarController, {})),
|
|
5459
|
+
/* @__PURE__ */ jsx25(
|
|
5131
5460
|
SuggestionMenuController,
|
|
5132
5461
|
{
|
|
5133
5462
|
triggerCharacter: "/",
|
|
5134
|
-
getItems:
|
|
5463
|
+
getItems: useCallback20(
|
|
5135
5464
|
async (query) => {
|
|
5136
5465
|
const items = getDefaultReactSlashMenuItems(editor);
|
|
5137
5466
|
const filtered = items.filter((item) => {
|
|
@@ -5175,7 +5504,7 @@ function LumirEditor({
|
|
|
5175
5504
|
},
|
|
5176
5505
|
aliases: ["html", "preview", "\uC6F9", "\uC6F9\uD398\uC774\uC9C0"],
|
|
5177
5506
|
group: "Embeds",
|
|
5178
|
-
icon: /* @__PURE__ */
|
|
5507
|
+
icon: /* @__PURE__ */ jsxs17(
|
|
5179
5508
|
"svg",
|
|
5180
5509
|
{
|
|
5181
5510
|
width: "18",
|
|
@@ -5187,8 +5516,8 @@ function LumirEditor({
|
|
|
5187
5516
|
strokeLinecap: "round",
|
|
5188
5517
|
strokeLinejoin: "round",
|
|
5189
5518
|
children: [
|
|
5190
|
-
/* @__PURE__ */
|
|
5191
|
-
/* @__PURE__ */
|
|
5519
|
+
/* @__PURE__ */ jsx25("polyline", { points: "16 18 22 12 16 6" }),
|
|
5520
|
+
/* @__PURE__ */ jsx25("polyline", { points: "8 6 2 12 8 18" })
|
|
5192
5521
|
]
|
|
5193
5522
|
}
|
|
5194
5523
|
),
|
|
@@ -5213,7 +5542,7 @@ function LumirEditor({
|
|
|
5213
5542
|
"\uD504\uB9AC\uBDF0"
|
|
5214
5543
|
],
|
|
5215
5544
|
group: "Embeds",
|
|
5216
|
-
icon: /* @__PURE__ */
|
|
5545
|
+
icon: /* @__PURE__ */ jsxs17(
|
|
5217
5546
|
"svg",
|
|
5218
5547
|
{
|
|
5219
5548
|
width: "18",
|
|
@@ -5225,8 +5554,8 @@ function LumirEditor({
|
|
|
5225
5554
|
strokeLinecap: "round",
|
|
5226
5555
|
strokeLinejoin: "round",
|
|
5227
5556
|
children: [
|
|
5228
|
-
/* @__PURE__ */
|
|
5229
|
-
/* @__PURE__ */
|
|
5557
|
+
/* @__PURE__ */ jsx25("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
|
|
5558
|
+
/* @__PURE__ */ jsx25("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
|
|
5230
5559
|
]
|
|
5231
5560
|
}
|
|
5232
5561
|
),
|
|
@@ -5262,21 +5591,21 @@ function LumirEditor({
|
|
|
5262
5591
|
)
|
|
5263
5592
|
}
|
|
5264
5593
|
),
|
|
5265
|
-
!sideMenuAddButton && /* @__PURE__ */
|
|
5594
|
+
!sideMenuAddButton && /* @__PURE__ */ jsx25(SideMenuController, { sideMenu: DragHandleOnlySideMenu })
|
|
5266
5595
|
]
|
|
5267
5596
|
}
|
|
5268
5597
|
),
|
|
5269
|
-
isUploading && /* @__PURE__ */
|
|
5270
|
-
/* @__PURE__ */
|
|
5271
|
-
uploadProgress !== null && /* @__PURE__ */
|
|
5598
|
+
isUploading && /* @__PURE__ */ jsxs17("div", { className: "lumirEditor-upload-overlay", children: [
|
|
5599
|
+
/* @__PURE__ */ jsx25("div", { className: "lumirEditor-spinner" }),
|
|
5600
|
+
uploadProgress !== null && /* @__PURE__ */ jsxs17("span", { className: "lumirEditor-upload-progress", children: [
|
|
5272
5601
|
uploadProgress,
|
|
5273
5602
|
"%"
|
|
5274
5603
|
] })
|
|
5275
5604
|
] }),
|
|
5276
|
-
errorMessage && /* @__PURE__ */
|
|
5277
|
-
/* @__PURE__ */
|
|
5278
|
-
/* @__PURE__ */
|
|
5279
|
-
/* @__PURE__ */
|
|
5605
|
+
errorMessage && /* @__PURE__ */ jsxs17("div", { className: "lumirEditor-error-toast", children: [
|
|
5606
|
+
/* @__PURE__ */ jsx25("span", { className: "lumirEditor-error-icon", children: "\u26A0\uFE0F" }),
|
|
5607
|
+
/* @__PURE__ */ jsx25("span", { className: "lumirEditor-error-message", children: errorMessage }),
|
|
5608
|
+
/* @__PURE__ */ jsx25(
|
|
5280
5609
|
"button",
|
|
5281
5610
|
{
|
|
5282
5611
|
className: "lumirEditor-error-close",
|
|
@@ -5294,7 +5623,10 @@ export {
|
|
|
5294
5623
|
BACKGROUND_COLORS,
|
|
5295
5624
|
ContentUtils,
|
|
5296
5625
|
EditorConfig,
|
|
5626
|
+
FONT_SIZE_PRESETS,
|
|
5297
5627
|
FloatingMenu,
|
|
5628
|
+
FontSize,
|
|
5629
|
+
FontSizeButton2 as FontSizeButton,
|
|
5298
5630
|
HtmlPreviewBlock,
|
|
5299
5631
|
schema as HtmlPreviewSchema,
|
|
5300
5632
|
LinkPreviewBlock,
|
|
@@ -5305,6 +5637,8 @@ export {
|
|
|
5305
5637
|
cn,
|
|
5306
5638
|
createS3Uploader,
|
|
5307
5639
|
fetchLinkMetadata,
|
|
5308
|
-
getHexFromColorValue
|
|
5640
|
+
getHexFromColorValue,
|
|
5641
|
+
liftFontSize,
|
|
5642
|
+
lowerFontSize
|
|
5309
5643
|
};
|
|
5310
5644
|
//# sourceMappingURL=index.mjs.map
|