@lumir-company/editor 0.4.19 → 0.4.22
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 +44 -19
- package/dist/index.d.mts +31 -17
- package/dist/index.d.ts +31 -17
- package/dist/index.js +1089 -687
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +769 -374
- package/dist/index.mjs.map +1 -1
- package/dist/style.css +72 -9
- 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 useEffect12, useMemo as useMemo8, useCallback as useCallback21, useState as useState12, useRef as useRef12 } from "react";
|
|
5
5
|
import {
|
|
6
6
|
useCreateBlockNote,
|
|
7
7
|
SideMenu as BlockSideMenu,
|
|
@@ -1466,6 +1466,16 @@ var ColumnList = createStronglyTypedTiptapNode({
|
|
|
1466
1466
|
name: "columnList",
|
|
1467
1467
|
group: "childContainer bnBlock blockGroupChild",
|
|
1468
1468
|
content: "column column+",
|
|
1469
|
+
addAttributes() {
|
|
1470
|
+
return {
|
|
1471
|
+
// 블록별 중앙 세로 구분선 표시 여부(드래그핸들 메뉴에서 토글). data-divider로 렌더.
|
|
1472
|
+
showDivider: {
|
|
1473
|
+
default: false,
|
|
1474
|
+
parseHTML: (element) => element.getAttribute("data-divider") === "true",
|
|
1475
|
+
renderHTML: (attributes) => attributes.showDivider ? { "data-divider": "true" } : {}
|
|
1476
|
+
}
|
|
1477
|
+
};
|
|
1478
|
+
},
|
|
1469
1479
|
parseHTML() {
|
|
1470
1480
|
return [{ tag: 'div[data-node-type="columnList"]' }];
|
|
1471
1481
|
},
|
|
@@ -1527,15 +1537,22 @@ var Column = createStronglyTypedTiptapNode2({
|
|
|
1527
1537
|
});
|
|
1528
1538
|
|
|
1529
1539
|
// src/styles/FontSizeStyle.tsx
|
|
1530
|
-
import {
|
|
1531
|
-
|
|
1532
|
-
var FontSize = createReactStyleSpec(
|
|
1540
|
+
import { createStyleSpec } from "@blocknote/core";
|
|
1541
|
+
var FontSize = createStyleSpec(
|
|
1533
1542
|
{
|
|
1534
1543
|
type: "fontSize",
|
|
1535
1544
|
propSchema: "string"
|
|
1536
1545
|
},
|
|
1537
1546
|
{
|
|
1538
|
-
|
|
1547
|
+
// 바닐라(동기) 스타일 스펙: DOM을 직접 반환한다.
|
|
1548
|
+
// createReactStyleSpec는 span 내용이 비동기 렌더되어, 적용 직후 동기 시점에
|
|
1549
|
+
// 선택 영역의 DOM 좌표가 (0,0)으로 잡혀 BlockNote 포매팅 툴바가 좌상단으로
|
|
1550
|
+
// 튀는 문제가 있었다(굵게/기울임 등 네이티브 마크는 동기 렌더라 정상).
|
|
1551
|
+
render: (value) => {
|
|
1552
|
+
const span = document.createElement("span");
|
|
1553
|
+
span.style.fontSize = value;
|
|
1554
|
+
return { dom: span, contentDOM: span };
|
|
1555
|
+
}
|
|
1539
1556
|
}
|
|
1540
1557
|
);
|
|
1541
1558
|
var FONT_SIZE_PRESETS = [
|
|
@@ -1548,10 +1565,24 @@ var FONT_SIZE_PRESETS = [
|
|
|
1548
1565
|
"24px",
|
|
1549
1566
|
"28px"
|
|
1550
1567
|
];
|
|
1568
|
+
var FONT_SIZE_MIN = 8;
|
|
1569
|
+
var FONT_SIZE_MAX = 96;
|
|
1570
|
+
var FONT_SIZE_DEFAULT_PX = 14;
|
|
1571
|
+
var FONT_SIZE_STEP = 1;
|
|
1572
|
+
function parseFontSizePx(size) {
|
|
1573
|
+
const n = parseInt(size, 10);
|
|
1574
|
+
return Number.isFinite(n) ? n : FONT_SIZE_DEFAULT_PX;
|
|
1575
|
+
}
|
|
1576
|
+
function clampFontSizePx(px) {
|
|
1577
|
+
return Math.min(FONT_SIZE_MAX, Math.max(FONT_SIZE_MIN, Math.round(px)));
|
|
1578
|
+
}
|
|
1579
|
+
function toFontSizeValue(px) {
|
|
1580
|
+
return `${clampFontSizePx(px)}px`;
|
|
1581
|
+
}
|
|
1551
1582
|
|
|
1552
1583
|
// src/blocks/HtmlPreview.tsx
|
|
1553
1584
|
import { useState as useState3, useRef as useRef3, useCallback as useCallback3, useEffect as useEffect3 } from "react";
|
|
1554
|
-
import { jsx as
|
|
1585
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
1555
1586
|
var MIN_HEIGHT = 100;
|
|
1556
1587
|
var MAX_HEIGHT = 1200;
|
|
1557
1588
|
var ensureCharset = (html) => {
|
|
@@ -1726,7 +1757,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1726
1757
|
},
|
|
1727
1758
|
onClick: () => setIsExpanded(!isExpanded),
|
|
1728
1759
|
children: [
|
|
1729
|
-
/* @__PURE__ */
|
|
1760
|
+
/* @__PURE__ */ jsx3(
|
|
1730
1761
|
"svg",
|
|
1731
1762
|
{
|
|
1732
1763
|
width: "16",
|
|
@@ -1741,15 +1772,15 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1741
1772
|
transform: isExpanded ? "rotate(180deg)" : "rotate(0deg)",
|
|
1742
1773
|
transition: "transform 0.2s"
|
|
1743
1774
|
},
|
|
1744
|
-
children: /* @__PURE__ */
|
|
1775
|
+
children: /* @__PURE__ */ jsx3("polyline", { points: "6 9 12 15 18 9" })
|
|
1745
1776
|
}
|
|
1746
1777
|
),
|
|
1747
|
-
/* @__PURE__ */
|
|
1778
|
+
/* @__PURE__ */ jsx3("span", { style: { fontWeight: 500, fontSize: "14px" }, children: fileName })
|
|
1748
1779
|
]
|
|
1749
1780
|
}
|
|
1750
1781
|
),
|
|
1751
1782
|
/* @__PURE__ */ jsxs3("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
|
|
1752
|
-
/* @__PURE__ */
|
|
1783
|
+
/* @__PURE__ */ jsx3(
|
|
1753
1784
|
"button",
|
|
1754
1785
|
{
|
|
1755
1786
|
onClick: handleOpenNewWindow,
|
|
@@ -1784,15 +1815,15 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1784
1815
|
strokeLinecap: "round",
|
|
1785
1816
|
strokeLinejoin: "round",
|
|
1786
1817
|
children: [
|
|
1787
|
-
/* @__PURE__ */
|
|
1788
|
-
/* @__PURE__ */
|
|
1789
|
-
/* @__PURE__ */
|
|
1818
|
+
/* @__PURE__ */ jsx3("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
|
|
1819
|
+
/* @__PURE__ */ jsx3("polyline", { points: "15 3 21 3 21 9" }),
|
|
1820
|
+
/* @__PURE__ */ jsx3("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
|
|
1790
1821
|
]
|
|
1791
1822
|
}
|
|
1792
1823
|
)
|
|
1793
1824
|
}
|
|
1794
1825
|
),
|
|
1795
|
-
/* @__PURE__ */
|
|
1826
|
+
/* @__PURE__ */ jsx3(
|
|
1796
1827
|
"button",
|
|
1797
1828
|
{
|
|
1798
1829
|
onClick: handleExport,
|
|
@@ -1827,9 +1858,9 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1827
1858
|
strokeLinecap: "round",
|
|
1828
1859
|
strokeLinejoin: "round",
|
|
1829
1860
|
children: [
|
|
1830
|
-
/* @__PURE__ */
|
|
1831
|
-
/* @__PURE__ */
|
|
1832
|
-
/* @__PURE__ */
|
|
1861
|
+
/* @__PURE__ */ jsx3("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
|
|
1862
|
+
/* @__PURE__ */ jsx3("polyline", { points: "7 10 12 15 17 10" }),
|
|
1863
|
+
/* @__PURE__ */ jsx3("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
|
|
1833
1864
|
]
|
|
1834
1865
|
}
|
|
1835
1866
|
)
|
|
@@ -1848,7 +1879,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1848
1879
|
position: "relative"
|
|
1849
1880
|
},
|
|
1850
1881
|
children: [
|
|
1851
|
-
/* @__PURE__ */
|
|
1882
|
+
/* @__PURE__ */ jsx3(
|
|
1852
1883
|
"iframe",
|
|
1853
1884
|
{
|
|
1854
1885
|
src: blobUrl || "about:blank",
|
|
@@ -1865,7 +1896,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1865
1896
|
loading: "lazy"
|
|
1866
1897
|
}
|
|
1867
1898
|
),
|
|
1868
|
-
/* @__PURE__ */
|
|
1899
|
+
/* @__PURE__ */ jsx3(
|
|
1869
1900
|
"div",
|
|
1870
1901
|
{
|
|
1871
1902
|
onMouseDown: handleResizeStart,
|
|
@@ -1890,7 +1921,7 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1890
1921
|
e.currentTarget.style.backgroundColor = "transparent";
|
|
1891
1922
|
}
|
|
1892
1923
|
},
|
|
1893
|
-
children: /* @__PURE__ */
|
|
1924
|
+
children: /* @__PURE__ */ jsx3(
|
|
1894
1925
|
"div",
|
|
1895
1926
|
{
|
|
1896
1927
|
style: {
|
|
@@ -1914,7 +1945,8 @@ var HtmlPreviewBlock = createReactBlockSpec3(
|
|
|
1914
1945
|
);
|
|
1915
1946
|
var ColumnListBlock = createBlockSpecFromStronglyTypedTiptapNode(
|
|
1916
1947
|
ColumnList,
|
|
1917
|
-
|
|
1948
|
+
// showDivider를 블록 prop으로 등록 → onContentChange JSON 직렬화 + 재로드 라운드트립.
|
|
1949
|
+
{ showDivider: { default: false } }
|
|
1918
1950
|
);
|
|
1919
1951
|
var ColumnBlock = createBlockSpecFromStronglyTypedTiptapNode(Column, {});
|
|
1920
1952
|
var schema = BlockNoteSchema.create({
|
|
@@ -1938,57 +1970,57 @@ var schema = BlockNoteSchema.create({
|
|
|
1938
1970
|
import { useState as useState8, useEffect as useEffect8, useRef as useRef9 } from "react";
|
|
1939
1971
|
|
|
1940
1972
|
// src/components/FloatingMenu/Icons.tsx
|
|
1941
|
-
import { jsx as
|
|
1973
|
+
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
1942
1974
|
var Icons = {
|
|
1943
|
-
undo: /* @__PURE__ */
|
|
1944
|
-
redo: /* @__PURE__ */
|
|
1945
|
-
bold: /* @__PURE__ */
|
|
1946
|
-
italic: /* @__PURE__ */
|
|
1947
|
-
underline: /* @__PURE__ */
|
|
1948
|
-
strikethrough: /* @__PURE__ */
|
|
1949
|
-
alignLeft: /* @__PURE__ */
|
|
1950
|
-
alignCenter: /* @__PURE__ */
|
|
1951
|
-
alignRight: /* @__PURE__ */
|
|
1952
|
-
bulletList: /* @__PURE__ */
|
|
1953
|
-
numberedList: /* @__PURE__ */
|
|
1954
|
-
image: /* @__PURE__ */
|
|
1955
|
-
expandMore: /* @__PURE__ */
|
|
1956
|
-
textColor: /* @__PURE__ */
|
|
1975
|
+
undo: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1976
|
+
redo: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1977
|
+
bold: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1978
|
+
italic: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z" }) }),
|
|
1979
|
+
underline: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1980
|
+
strikethrough: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M10 19h4v-3h-4v3zM5 4v3h5v3h4V7h5V4H5zM3 14h18v-2H3v2z" }) }),
|
|
1981
|
+
alignLeft: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
|
|
1982
|
+
alignCenter: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
|
|
1983
|
+
alignRight: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
|
|
1984
|
+
bulletList: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1985
|
+
numberedList: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
|
|
1986
|
+
image: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1987
|
+
expandMore: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx4("path", { d: "M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" }) }),
|
|
1988
|
+
textColor: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M11 3L5.5 17h2.25l1.12-3h6.25l1.12 3h2.25L13 3h-2zm-1.38 9L12 5.67 14.38 12H9.62z" }) }),
|
|
1957
1989
|
bgColor: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
1958
|
-
/* @__PURE__ */
|
|
1959
|
-
/* @__PURE__ */
|
|
1990
|
+
/* @__PURE__ */ jsx4("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" }),
|
|
1991
|
+
/* @__PURE__ */ jsx4("path", { fillOpacity: ".36", d: "M0 20h24v4H0z" })
|
|
1960
1992
|
] }),
|
|
1961
|
-
link: /* @__PURE__ */
|
|
1962
|
-
chevronRight: /* @__PURE__ */
|
|
1963
|
-
chevronLeft: /* @__PURE__ */
|
|
1964
|
-
table: /* @__PURE__ */
|
|
1965
|
-
htmlFile: /* @__PURE__ */
|
|
1993
|
+
link: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1994
|
+
chevronRight: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) }),
|
|
1995
|
+
chevronLeft: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) }),
|
|
1996
|
+
table: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1997
|
+
htmlFile: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) })
|
|
1966
1998
|
};
|
|
1967
1999
|
var BlockTypeIcons = {
|
|
1968
|
-
paragraph: /* @__PURE__ */
|
|
1969
|
-
h1: /* @__PURE__ */
|
|
1970
|
-
h2: /* @__PURE__ */
|
|
1971
|
-
h3: /* @__PURE__ */
|
|
1972
|
-
h4: /* @__PURE__ */
|
|
1973
|
-
h5: /* @__PURE__ */
|
|
1974
|
-
h6: /* @__PURE__ */
|
|
2000
|
+
paragraph: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M5 5h14v2H5zM5 11h14v2H5zM5 17h10v2H5z" }) }),
|
|
2001
|
+
h1: /* @__PURE__ */ jsx4("span", { className: "lumir-block-icon-text", children: "H1" }),
|
|
2002
|
+
h2: /* @__PURE__ */ jsx4("span", { className: "lumir-block-icon-text", children: "H2" }),
|
|
2003
|
+
h3: /* @__PURE__ */ jsx4("span", { className: "lumir-block-icon-text", children: "H3" }),
|
|
2004
|
+
h4: /* @__PURE__ */ jsx4("span", { className: "lumir-block-icon-text", children: "H4" }),
|
|
2005
|
+
h5: /* @__PURE__ */ jsx4("span", { className: "lumir-block-icon-text", children: "H5" }),
|
|
2006
|
+
h6: /* @__PURE__ */ jsx4("span", { className: "lumir-block-icon-text", children: "H6" }),
|
|
1975
2007
|
toggleH1: /* @__PURE__ */ jsxs4("span", { className: "lumir-block-icon-toggle", children: [
|
|
1976
|
-
/* @__PURE__ */
|
|
1977
|
-
/* @__PURE__ */
|
|
2008
|
+
/* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ jsx4("path", { d: "M8 5v14l11-7z" }) }),
|
|
2009
|
+
/* @__PURE__ */ jsx4("span", { children: "H1" })
|
|
1978
2010
|
] }),
|
|
1979
2011
|
toggleH2: /* @__PURE__ */ jsxs4("span", { className: "lumir-block-icon-toggle", children: [
|
|
1980
|
-
/* @__PURE__ */
|
|
1981
|
-
/* @__PURE__ */
|
|
2012
|
+
/* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ jsx4("path", { d: "M8 5v14l11-7z" }) }),
|
|
2013
|
+
/* @__PURE__ */ jsx4("span", { children: "H2" })
|
|
1982
2014
|
] }),
|
|
1983
2015
|
toggleH3: /* @__PURE__ */ jsxs4("span", { className: "lumir-block-icon-toggle", children: [
|
|
1984
|
-
/* @__PURE__ */
|
|
1985
|
-
/* @__PURE__ */
|
|
2016
|
+
/* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "8", height: "8", children: /* @__PURE__ */ jsx4("path", { d: "M8 5v14l11-7z" }) }),
|
|
2017
|
+
/* @__PURE__ */ jsx4("span", { children: "H3" })
|
|
1986
2018
|
] }),
|
|
1987
|
-
quote: /* @__PURE__ */
|
|
1988
|
-
codeBlock: /* @__PURE__ */
|
|
2019
|
+
quote: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M6 17h3l2-4V7H5v6h3zm8 0h3l2-4V7h-6v6h3z" }) }),
|
|
2020
|
+
codeBlock: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("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" }) }),
|
|
1989
2021
|
toggleList: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
1990
|
-
/* @__PURE__ */
|
|
1991
|
-
/* @__PURE__ */
|
|
2022
|
+
/* @__PURE__ */ jsx4("path", { d: "M10 6h10v2H10zM10 11h10v2H10zM10 16h10v2H10z" }),
|
|
2023
|
+
/* @__PURE__ */ jsx4(
|
|
1992
2024
|
"path",
|
|
1993
2025
|
{
|
|
1994
2026
|
d: "M4 8l4 4-4 4",
|
|
@@ -2001,14 +2033,14 @@ var BlockTypeIcons = {
|
|
|
2001
2033
|
)
|
|
2002
2034
|
] }),
|
|
2003
2035
|
bulletList: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
2004
|
-
/* @__PURE__ */
|
|
2005
|
-
/* @__PURE__ */
|
|
2006
|
-
/* @__PURE__ */
|
|
2007
|
-
/* @__PURE__ */
|
|
2036
|
+
/* @__PURE__ */ jsx4("circle", { cx: "4", cy: "6", r: "1.5" }),
|
|
2037
|
+
/* @__PURE__ */ jsx4("circle", { cx: "4", cy: "12", r: "1.5" }),
|
|
2038
|
+
/* @__PURE__ */ jsx4("circle", { cx: "4", cy: "18", r: "1.5" }),
|
|
2039
|
+
/* @__PURE__ */ jsx4("path", { d: "M8 5h12v2H8zM8 11h12v2H8zM8 17h12v2H8z" })
|
|
2008
2040
|
] }),
|
|
2009
|
-
numberedList: /* @__PURE__ */
|
|
2041
|
+
numberedList: /* @__PURE__ */ jsx4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: /* @__PURE__ */ jsx4("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }),
|
|
2010
2042
|
checkList: /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 24 24", fill: "currentColor", width: "20", height: "20", children: [
|
|
2011
|
-
/* @__PURE__ */
|
|
2043
|
+
/* @__PURE__ */ jsx4(
|
|
2012
2044
|
"rect",
|
|
2013
2045
|
{
|
|
2014
2046
|
x: "3",
|
|
@@ -2021,7 +2053,7 @@ var BlockTypeIcons = {
|
|
|
2021
2053
|
strokeWidth: "1.5"
|
|
2022
2054
|
}
|
|
2023
2055
|
),
|
|
2024
|
-
/* @__PURE__ */
|
|
2056
|
+
/* @__PURE__ */ jsx4(
|
|
2025
2057
|
"path",
|
|
2026
2058
|
{
|
|
2027
2059
|
d: "M4.5 7l1.5 1.5 3-3",
|
|
@@ -2032,8 +2064,8 @@ var BlockTypeIcons = {
|
|
|
2032
2064
|
strokeLinejoin: "round"
|
|
2033
2065
|
}
|
|
2034
2066
|
),
|
|
2035
|
-
/* @__PURE__ */
|
|
2036
|
-
/* @__PURE__ */
|
|
2067
|
+
/* @__PURE__ */ jsx4("path", { d: "M12 6h8v2h-8z" }),
|
|
2068
|
+
/* @__PURE__ */ jsx4(
|
|
2037
2069
|
"rect",
|
|
2038
2070
|
{
|
|
2039
2071
|
x: "3",
|
|
@@ -2046,17 +2078,17 @@ var BlockTypeIcons = {
|
|
|
2046
2078
|
strokeWidth: "1.5"
|
|
2047
2079
|
}
|
|
2048
2080
|
),
|
|
2049
|
-
/* @__PURE__ */
|
|
2081
|
+
/* @__PURE__ */ jsx4("path", { d: "M12 16h8v2h-8z" })
|
|
2050
2082
|
] })
|
|
2051
2083
|
};
|
|
2052
2084
|
|
|
2053
2085
|
// src/components/FloatingMenu/components/ToolbarDivider.tsx
|
|
2054
|
-
import { jsx as
|
|
2055
|
-
var ToolbarDivider = () => /* @__PURE__ */
|
|
2086
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
2087
|
+
var ToolbarDivider = () => /* @__PURE__ */ jsx5("div", { className: "lumir-toolbar-divider" });
|
|
2056
2088
|
|
|
2057
2089
|
// src/components/FloatingMenu/components/UndoRedoButtons.tsx
|
|
2058
2090
|
import { useCallback as useCallback4 } from "react";
|
|
2059
|
-
import { jsx as
|
|
2091
|
+
import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
2060
2092
|
var UndoRedoButtons = ({ editor }) => {
|
|
2061
2093
|
const handleUndo = useCallback4(() => {
|
|
2062
2094
|
try {
|
|
@@ -2076,7 +2108,7 @@ var UndoRedoButtons = ({ editor }) => {
|
|
|
2076
2108
|
e.preventDefault();
|
|
2077
2109
|
}, []);
|
|
2078
2110
|
return /* @__PURE__ */ jsxs5("div", { className: "lumir-toolbar-group", children: [
|
|
2079
|
-
/* @__PURE__ */
|
|
2111
|
+
/* @__PURE__ */ jsx6(
|
|
2080
2112
|
"button",
|
|
2081
2113
|
{
|
|
2082
2114
|
className: "lumir-toolbar-btn",
|
|
@@ -2087,7 +2119,7 @@ var UndoRedoButtons = ({ editor }) => {
|
|
|
2087
2119
|
children: Icons.undo
|
|
2088
2120
|
}
|
|
2089
2121
|
),
|
|
2090
|
-
/* @__PURE__ */
|
|
2122
|
+
/* @__PURE__ */ jsx6(
|
|
2091
2123
|
"button",
|
|
2092
2124
|
{
|
|
2093
2125
|
className: "lumir-toolbar-btn",
|
|
@@ -2103,7 +2135,7 @@ var UndoRedoButtons = ({ editor }) => {
|
|
|
2103
2135
|
|
|
2104
2136
|
// src/components/FloatingMenu/components/TextStyleButton.tsx
|
|
2105
2137
|
import { useCallback as useCallback5 } from "react";
|
|
2106
|
-
import { jsx as
|
|
2138
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
2107
2139
|
var iconMap = {
|
|
2108
2140
|
bold: Icons.bold,
|
|
2109
2141
|
italic: Icons.italic,
|
|
@@ -2139,7 +2171,7 @@ var TextStyleButton = ({
|
|
|
2139
2171
|
const handleMouseDown2 = useCallback5((e) => {
|
|
2140
2172
|
e.preventDefault();
|
|
2141
2173
|
}, []);
|
|
2142
|
-
return /* @__PURE__ */
|
|
2174
|
+
return /* @__PURE__ */ jsx7(
|
|
2143
2175
|
"button",
|
|
2144
2176
|
{
|
|
2145
2177
|
className: cn("lumir-toolbar-btn", isActive && "is-active"),
|
|
@@ -2249,7 +2281,7 @@ function getTableAlignment(editor, blockId) {
|
|
|
2249
2281
|
}
|
|
2250
2282
|
|
|
2251
2283
|
// src/components/FloatingMenu/components/AlignButton.tsx
|
|
2252
|
-
import { jsx as
|
|
2284
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
2253
2285
|
var iconMap2 = {
|
|
2254
2286
|
left: Icons.alignLeft,
|
|
2255
2287
|
center: Icons.alignCenter,
|
|
@@ -2292,7 +2324,7 @@ var AlignButton = ({
|
|
|
2292
2324
|
const handleMouseDown2 = useCallback6((e) => {
|
|
2293
2325
|
e.preventDefault();
|
|
2294
2326
|
}, []);
|
|
2295
|
-
return /* @__PURE__ */
|
|
2327
|
+
return /* @__PURE__ */ jsx8(
|
|
2296
2328
|
"button",
|
|
2297
2329
|
{
|
|
2298
2330
|
className: cn("lumir-toolbar-btn", isActive && "is-active"),
|
|
@@ -2307,7 +2339,7 @@ var AlignButton = ({
|
|
|
2307
2339
|
|
|
2308
2340
|
// src/components/FloatingMenu/components/ListButton.tsx
|
|
2309
2341
|
import { useCallback as useCallback7 } from "react";
|
|
2310
|
-
import { jsx as
|
|
2342
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
2311
2343
|
var iconMap3 = {
|
|
2312
2344
|
bullet: Icons.bulletList,
|
|
2313
2345
|
numbered: Icons.numberedList
|
|
@@ -2342,7 +2374,7 @@ var ListButton = ({ editor, type }) => {
|
|
|
2342
2374
|
const handleMouseDown2 = useCallback7((e) => {
|
|
2343
2375
|
e.preventDefault();
|
|
2344
2376
|
}, []);
|
|
2345
|
-
return /* @__PURE__ */
|
|
2377
|
+
return /* @__PURE__ */ jsx9(
|
|
2346
2378
|
"button",
|
|
2347
2379
|
{
|
|
2348
2380
|
className: cn("lumir-toolbar-btn", isActive && "is-active"),
|
|
@@ -2357,7 +2389,7 @@ var ListButton = ({ editor, type }) => {
|
|
|
2357
2389
|
|
|
2358
2390
|
// src/components/FloatingMenu/components/ImageButton.tsx
|
|
2359
2391
|
import { useCallback as useCallback8 } from "react";
|
|
2360
|
-
import { jsx as
|
|
2392
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
2361
2393
|
var ImageButton = ({
|
|
2362
2394
|
editor,
|
|
2363
2395
|
onImageUpload
|
|
@@ -2390,7 +2422,7 @@ var ImageButton = ({
|
|
|
2390
2422
|
const handleMouseDown2 = useCallback8((e) => {
|
|
2391
2423
|
e.preventDefault();
|
|
2392
2424
|
}, []);
|
|
2393
|
-
return /* @__PURE__ */
|
|
2425
|
+
return /* @__PURE__ */ jsx10(
|
|
2394
2426
|
"button",
|
|
2395
2427
|
{
|
|
2396
2428
|
className: "lumir-toolbar-btn",
|
|
@@ -2438,7 +2470,7 @@ var getHexFromColorValue = (value, type) => {
|
|
|
2438
2470
|
};
|
|
2439
2471
|
|
|
2440
2472
|
// src/components/FloatingMenu/components/ColorButton.tsx
|
|
2441
|
-
import { jsx as
|
|
2473
|
+
import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
2442
2474
|
var ColorButton = ({ editor, type }) => {
|
|
2443
2475
|
const [isOpen, setIsOpen] = useState4(false);
|
|
2444
2476
|
const [currentColor, setCurrentColor] = useState4("default");
|
|
@@ -2508,7 +2540,7 @@ var ColorButton = ({ editor, type }) => {
|
|
|
2508
2540
|
type: "button",
|
|
2509
2541
|
children: [
|
|
2510
2542
|
type === "text" ? Icons.textColor : Icons.bgColor,
|
|
2511
|
-
/* @__PURE__ */
|
|
2543
|
+
/* @__PURE__ */ jsx11(
|
|
2512
2544
|
"span",
|
|
2513
2545
|
{
|
|
2514
2546
|
className: "lumir-color-indicator",
|
|
@@ -2520,7 +2552,7 @@ var ColorButton = ({ editor, type }) => {
|
|
|
2520
2552
|
]
|
|
2521
2553
|
}
|
|
2522
2554
|
),
|
|
2523
|
-
isOpen && /* @__PURE__ */
|
|
2555
|
+
isOpen && /* @__PURE__ */ jsx11("div", { className: "lumir-dropdown-menu lumir-color-menu", children: /* @__PURE__ */ jsx11("div", { className: "lumir-color-grid", children: colors.map((color) => /* @__PURE__ */ jsx11(
|
|
2524
2556
|
"button",
|
|
2525
2557
|
{
|
|
2526
2558
|
className: cn(
|
|
@@ -2540,7 +2572,7 @@ var ColorButton = ({ editor, type }) => {
|
|
|
2540
2572
|
|
|
2541
2573
|
// src/components/FloatingMenu/components/FontSizeButton.tsx
|
|
2542
2574
|
import { useState as useState5, useEffect as useEffect5, useRef as useRef5, useCallback as useCallback10 } from "react";
|
|
2543
|
-
import { jsx as
|
|
2575
|
+
import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
2544
2576
|
var DEFAULT_LABEL = "\uAE30\uBCF8";
|
|
2545
2577
|
var toLabel = (size) => size.replace(/px$/, "");
|
|
2546
2578
|
var FontSizeButton = ({ editor }) => {
|
|
@@ -2554,6 +2586,11 @@ var FontSizeButton = ({ editor }) => {
|
|
|
2554
2586
|
}
|
|
2555
2587
|
};
|
|
2556
2588
|
const currentSize = getCurrentSize();
|
|
2589
|
+
const currentPx = parseFontSizePx(currentSize);
|
|
2590
|
+
const [inputValue, setInputValue] = useState5(String(currentPx));
|
|
2591
|
+
useEffect5(() => {
|
|
2592
|
+
setInputValue(String(currentPx));
|
|
2593
|
+
}, [currentPx]);
|
|
2557
2594
|
useEffect5(() => {
|
|
2558
2595
|
const handleClickOutside = (e) => {
|
|
2559
2596
|
if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
|
|
@@ -2580,6 +2617,30 @@ var FontSizeButton = ({ editor }) => {
|
|
|
2580
2617
|
},
|
|
2581
2618
|
[editor]
|
|
2582
2619
|
);
|
|
2620
|
+
const stepBy = useCallback10(
|
|
2621
|
+
(delta) => {
|
|
2622
|
+
try {
|
|
2623
|
+
editor?.addStyles?.({
|
|
2624
|
+
fontSize: toFontSizeValue(currentPx + delta)
|
|
2625
|
+
});
|
|
2626
|
+
} catch (err) {
|
|
2627
|
+
console.error("Font size step failed:", err);
|
|
2628
|
+
}
|
|
2629
|
+
},
|
|
2630
|
+
[editor, currentPx]
|
|
2631
|
+
);
|
|
2632
|
+
const applyInput = useCallback10(() => {
|
|
2633
|
+
const n = parseInt(inputValue, 10);
|
|
2634
|
+
if (Number.isFinite(n)) {
|
|
2635
|
+
try {
|
|
2636
|
+
editor?.addStyles?.({ fontSize: toFontSizeValue(n) });
|
|
2637
|
+
} catch (err) {
|
|
2638
|
+
console.error("Font size apply failed:", err);
|
|
2639
|
+
}
|
|
2640
|
+
} else {
|
|
2641
|
+
setInputValue(String(currentPx));
|
|
2642
|
+
}
|
|
2643
|
+
}, [editor, inputValue, currentPx]);
|
|
2583
2644
|
const handleMouseDown2 = useCallback10((e) => {
|
|
2584
2645
|
e.preventDefault();
|
|
2585
2646
|
}, []);
|
|
@@ -2593,13 +2654,64 @@ var FontSizeButton = ({ editor }) => {
|
|
|
2593
2654
|
title: "\uAE00\uC790 \uD06C\uAE30",
|
|
2594
2655
|
type: "button",
|
|
2595
2656
|
children: [
|
|
2596
|
-
/* @__PURE__ */
|
|
2657
|
+
/* @__PURE__ */ jsx12("span", { className: "lumir-font-size-label", children: currentSize ? toLabel(currentSize) : DEFAULT_LABEL }),
|
|
2597
2658
|
Icons.expandMore
|
|
2598
2659
|
]
|
|
2599
2660
|
}
|
|
2600
2661
|
),
|
|
2601
2662
|
isOpen && /* @__PURE__ */ jsxs7("div", { className: "lumir-dropdown-menu lumir-font-size-menu", children: [
|
|
2602
|
-
/* @__PURE__ */
|
|
2663
|
+
/* @__PURE__ */ jsxs7("div", { className: "lumir-fs-stepper", children: [
|
|
2664
|
+
/* @__PURE__ */ jsx12(
|
|
2665
|
+
"button",
|
|
2666
|
+
{
|
|
2667
|
+
type: "button",
|
|
2668
|
+
className: "lumir-fs-stepper-btn",
|
|
2669
|
+
"aria-label": "\uAE00\uC790 \uD06C\uAE30 1px \uC904\uC774\uAE30",
|
|
2670
|
+
disabled: currentPx <= FONT_SIZE_MIN,
|
|
2671
|
+
onMouseDown: handleMouseDown2,
|
|
2672
|
+
onClick: () => stepBy(-1),
|
|
2673
|
+
children: "\u2212"
|
|
2674
|
+
}
|
|
2675
|
+
),
|
|
2676
|
+
/* @__PURE__ */ jsx12(
|
|
2677
|
+
"input",
|
|
2678
|
+
{
|
|
2679
|
+
className: "lumir-fs-stepper-input",
|
|
2680
|
+
type: "text",
|
|
2681
|
+
inputMode: "numeric",
|
|
2682
|
+
"aria-label": "\uAE00\uC790 \uD06C\uAE30 \uC785\uB825",
|
|
2683
|
+
value: inputValue,
|
|
2684
|
+
onChange: (e) => setInputValue(e.target.value.replace(/[^0-9]/g, "")),
|
|
2685
|
+
onKeyDown: (e) => {
|
|
2686
|
+
e.stopPropagation();
|
|
2687
|
+
if (e.key === "Enter") {
|
|
2688
|
+
e.preventDefault();
|
|
2689
|
+
applyInput();
|
|
2690
|
+
} else if (e.key === "ArrowUp") {
|
|
2691
|
+
e.preventDefault();
|
|
2692
|
+
stepBy(1);
|
|
2693
|
+
} else if (e.key === "ArrowDown") {
|
|
2694
|
+
e.preventDefault();
|
|
2695
|
+
stepBy(-1);
|
|
2696
|
+
}
|
|
2697
|
+
},
|
|
2698
|
+
onBlur: applyInput
|
|
2699
|
+
}
|
|
2700
|
+
),
|
|
2701
|
+
/* @__PURE__ */ jsx12(
|
|
2702
|
+
"button",
|
|
2703
|
+
{
|
|
2704
|
+
type: "button",
|
|
2705
|
+
className: "lumir-fs-stepper-btn",
|
|
2706
|
+
"aria-label": "\uAE00\uC790 \uD06C\uAE30 1px \uB298\uB9AC\uAE30",
|
|
2707
|
+
disabled: currentPx >= FONT_SIZE_MAX,
|
|
2708
|
+
onMouseDown: handleMouseDown2,
|
|
2709
|
+
onClick: () => stepBy(1),
|
|
2710
|
+
children: "+"
|
|
2711
|
+
}
|
|
2712
|
+
)
|
|
2713
|
+
] }),
|
|
2714
|
+
/* @__PURE__ */ jsx12(
|
|
2603
2715
|
"button",
|
|
2604
2716
|
{
|
|
2605
2717
|
className: cn(
|
|
@@ -2612,7 +2724,7 @@ var FontSizeButton = ({ editor }) => {
|
|
|
2612
2724
|
children: DEFAULT_LABEL
|
|
2613
2725
|
}
|
|
2614
2726
|
),
|
|
2615
|
-
FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */
|
|
2727
|
+
FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ jsx12(
|
|
2616
2728
|
"button",
|
|
2617
2729
|
{
|
|
2618
2730
|
className: cn(
|
|
@@ -2632,7 +2744,7 @@ var FontSizeButton = ({ editor }) => {
|
|
|
2632
2744
|
|
|
2633
2745
|
// src/components/FloatingMenu/components/LinkButton.tsx
|
|
2634
2746
|
import { useState as useState6, useEffect as useEffect6, useRef as useRef6, useCallback as useCallback11 } from "react";
|
|
2635
|
-
import { jsx as
|
|
2747
|
+
import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
2636
2748
|
var isDangerousProtocol = (url) => {
|
|
2637
2749
|
const trimmedUrl = url.trim().toLowerCase();
|
|
2638
2750
|
const dangerousPatterns = [
|
|
@@ -2732,7 +2844,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2732
2844
|
[handleSubmit, handleCancel]
|
|
2733
2845
|
);
|
|
2734
2846
|
return /* @__PURE__ */ jsxs8("div", { className: "lumir-dropdown-wrapper", ref: dropdownRef, children: [
|
|
2735
|
-
/* @__PURE__ */
|
|
2847
|
+
/* @__PURE__ */ jsx13(
|
|
2736
2848
|
"button",
|
|
2737
2849
|
{
|
|
2738
2850
|
className: "lumir-toolbar-btn",
|
|
@@ -2743,8 +2855,8 @@ var LinkButton = ({ editor }) => {
|
|
|
2743
2855
|
children: Icons.link
|
|
2744
2856
|
}
|
|
2745
2857
|
),
|
|
2746
|
-
isOpen && /* @__PURE__ */
|
|
2747
|
-
/* @__PURE__ */
|
|
2858
|
+
isOpen && /* @__PURE__ */ jsx13("div", { className: "lumir-dropdown-menu lumir-link-menu", children: /* @__PURE__ */ jsxs8("form", { onSubmit: handleSubmit, className: "lumir-link-form", children: [
|
|
2859
|
+
/* @__PURE__ */ jsx13(
|
|
2748
2860
|
"input",
|
|
2749
2861
|
{
|
|
2750
2862
|
ref: inputRef,
|
|
@@ -2760,7 +2872,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2760
2872
|
onMouseDown: handleMouseDown2
|
|
2761
2873
|
}
|
|
2762
2874
|
),
|
|
2763
|
-
errorMsg && /* @__PURE__ */
|
|
2875
|
+
errorMsg && /* @__PURE__ */ jsx13(
|
|
2764
2876
|
"div",
|
|
2765
2877
|
{
|
|
2766
2878
|
style: {
|
|
@@ -2773,7 +2885,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2773
2885
|
}
|
|
2774
2886
|
),
|
|
2775
2887
|
/* @__PURE__ */ jsxs8("div", { className: "lumir-link-actions", children: [
|
|
2776
|
-
/* @__PURE__ */
|
|
2888
|
+
/* @__PURE__ */ jsx13(
|
|
2777
2889
|
"button",
|
|
2778
2890
|
{
|
|
2779
2891
|
type: "button",
|
|
@@ -2783,7 +2895,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2783
2895
|
children: "\uCDE8\uC18C"
|
|
2784
2896
|
}
|
|
2785
2897
|
),
|
|
2786
|
-
/* @__PURE__ */
|
|
2898
|
+
/* @__PURE__ */ jsx13(
|
|
2787
2899
|
"button",
|
|
2788
2900
|
{
|
|
2789
2901
|
type: "submit",
|
|
@@ -2800,7 +2912,7 @@ var LinkButton = ({ editor }) => {
|
|
|
2800
2912
|
|
|
2801
2913
|
// src/components/FloatingMenu/components/TableButton.tsx
|
|
2802
2914
|
import { useCallback as useCallback12 } from "react";
|
|
2803
|
-
import { jsx as
|
|
2915
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
2804
2916
|
var TableButton = ({ editor }) => {
|
|
2805
2917
|
const handleClick = useCallback12(() => {
|
|
2806
2918
|
try {
|
|
@@ -2827,7 +2939,7 @@ var TableButton = ({ editor }) => {
|
|
|
2827
2939
|
const handleMouseDown2 = useCallback12((e) => {
|
|
2828
2940
|
e.preventDefault();
|
|
2829
2941
|
}, []);
|
|
2830
|
-
return /* @__PURE__ */
|
|
2942
|
+
return /* @__PURE__ */ jsx14(
|
|
2831
2943
|
"button",
|
|
2832
2944
|
{
|
|
2833
2945
|
className: "lumir-toolbar-btn",
|
|
@@ -2842,7 +2954,7 @@ var TableButton = ({ editor }) => {
|
|
|
2842
2954
|
|
|
2843
2955
|
// src/components/FloatingMenu/components/HTMLImportButton.tsx
|
|
2844
2956
|
import { useCallback as useCallback13, useRef as useRef7 } from "react";
|
|
2845
|
-
import { Fragment as Fragment3, jsx as
|
|
2957
|
+
import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
2846
2958
|
var HTMLImportButton = ({
|
|
2847
2959
|
editor
|
|
2848
2960
|
}) => {
|
|
@@ -2890,7 +3002,7 @@ var HTMLImportButton = ({
|
|
|
2890
3002
|
e.preventDefault();
|
|
2891
3003
|
}, []);
|
|
2892
3004
|
return /* @__PURE__ */ jsxs9(Fragment3, { children: [
|
|
2893
|
-
/* @__PURE__ */
|
|
3005
|
+
/* @__PURE__ */ jsx15(
|
|
2894
3006
|
"input",
|
|
2895
3007
|
{
|
|
2896
3008
|
ref: fileInputRef,
|
|
@@ -2900,7 +3012,7 @@ var HTMLImportButton = ({
|
|
|
2900
3012
|
style: { display: "none" }
|
|
2901
3013
|
}
|
|
2902
3014
|
),
|
|
2903
|
-
/* @__PURE__ */
|
|
3015
|
+
/* @__PURE__ */ jsx15(
|
|
2904
3016
|
"button",
|
|
2905
3017
|
{
|
|
2906
3018
|
className: "lumir-toolbar-btn",
|
|
@@ -2916,7 +3028,7 @@ var HTMLImportButton = ({
|
|
|
2916
3028
|
|
|
2917
3029
|
// src/components/FloatingMenu/components/BlockTypeSelect.tsx
|
|
2918
3030
|
import { useState as useState7, useEffect as useEffect7, useRef as useRef8, useCallback as useCallback14 } from "react";
|
|
2919
|
-
import { jsx as
|
|
3031
|
+
import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
2920
3032
|
var blockTypeCategories = [
|
|
2921
3033
|
{
|
|
2922
3034
|
category: "Headings",
|
|
@@ -3028,14 +3140,14 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
3028
3140
|
onMouseDown: handleMouseDown2,
|
|
3029
3141
|
type: "button",
|
|
3030
3142
|
children: [
|
|
3031
|
-
/* @__PURE__ */
|
|
3032
|
-
/* @__PURE__ */
|
|
3143
|
+
/* @__PURE__ */ jsx16("span", { className: "lumir-block-icon", children: BlockTypeIcons[getCurrentIcon()] }),
|
|
3144
|
+
/* @__PURE__ */ jsx16("span", { className: "lumir-block-label", children: getCurrentLabel() }),
|
|
3033
3145
|
Icons.expandMore
|
|
3034
3146
|
]
|
|
3035
3147
|
}
|
|
3036
3148
|
),
|
|
3037
|
-
isOpen && /* @__PURE__ */
|
|
3038
|
-
/* @__PURE__ */
|
|
3149
|
+
isOpen && /* @__PURE__ */ jsx16("div", { className: "lumir-dropdown-menu lumir-block-menu", children: blockTypeCategories.map((category) => /* @__PURE__ */ jsxs10("div", { className: "lumir-block-category", children: [
|
|
3150
|
+
/* @__PURE__ */ jsx16("div", { className: "lumir-block-category-title", children: category.category }),
|
|
3039
3151
|
category.items.map((bt) => /* @__PURE__ */ jsxs10(
|
|
3040
3152
|
"button",
|
|
3041
3153
|
{
|
|
@@ -3046,8 +3158,8 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
3046
3158
|
onClick: () => handleTypeChange(bt.type, bt.level, bt.isToggle),
|
|
3047
3159
|
onMouseDown: handleMouseDown2,
|
|
3048
3160
|
children: [
|
|
3049
|
-
/* @__PURE__ */
|
|
3050
|
-
/* @__PURE__ */
|
|
3161
|
+
/* @__PURE__ */ jsx16("span", { className: "lumir-block-icon", children: BlockTypeIcons[bt.icon] }),
|
|
3162
|
+
/* @__PURE__ */ jsx16("span", { className: "lumir-block-item-title", children: bt.label })
|
|
3051
3163
|
]
|
|
3052
3164
|
},
|
|
3053
3165
|
bt.icon
|
|
@@ -3057,7 +3169,7 @@ var BlockTypeSelect = ({ editor }) => {
|
|
|
3057
3169
|
};
|
|
3058
3170
|
|
|
3059
3171
|
// src/components/FloatingMenu/index.tsx
|
|
3060
|
-
import { Fragment as Fragment4, jsx as
|
|
3172
|
+
import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
3061
3173
|
var COMPACT_BREAKPOINT = 700;
|
|
3062
3174
|
var MINIMIZED_BREAKPOINT = 400;
|
|
3063
3175
|
var FloatingMenu = ({
|
|
@@ -3111,7 +3223,7 @@ var FloatingMenu = ({
|
|
|
3111
3223
|
return () => resizeObserver.disconnect();
|
|
3112
3224
|
}, []);
|
|
3113
3225
|
const MinimizedLayout = () => /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
3114
|
-
/* @__PURE__ */
|
|
3226
|
+
/* @__PURE__ */ jsx17(
|
|
3115
3227
|
"button",
|
|
3116
3228
|
{
|
|
3117
3229
|
className: "lumir-toolbar-button lumir-toggle-button",
|
|
@@ -3123,119 +3235,119 @@ var FloatingMenu = ({
|
|
|
3123
3235
|
}
|
|
3124
3236
|
),
|
|
3125
3237
|
!isMinimized && /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
3126
|
-
/* @__PURE__ */
|
|
3127
|
-
/* @__PURE__ */
|
|
3128
|
-
/* @__PURE__ */
|
|
3129
|
-
/* @__PURE__ */
|
|
3130
|
-
/* @__PURE__ */
|
|
3238
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3239
|
+
/* @__PURE__ */ jsx17(UndoRedoButtons, { editor }),
|
|
3240
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3241
|
+
/* @__PURE__ */ jsx17("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ jsx17(BlockTypeSelect, { editor }) }),
|
|
3242
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3131
3243
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3132
|
-
/* @__PURE__ */
|
|
3133
|
-
/* @__PURE__ */
|
|
3134
|
-
/* @__PURE__ */
|
|
3135
|
-
/* @__PURE__ */
|
|
3244
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "bold" }),
|
|
3245
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "italic" }),
|
|
3246
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "underline" }),
|
|
3247
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "strike" })
|
|
3136
3248
|
] }),
|
|
3137
|
-
/* @__PURE__ */
|
|
3249
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3138
3250
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3139
|
-
/* @__PURE__ */
|
|
3140
|
-
/* @__PURE__ */
|
|
3141
|
-
/* @__PURE__ */
|
|
3251
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "left" }),
|
|
3252
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "center" }),
|
|
3253
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "right" })
|
|
3142
3254
|
] }),
|
|
3143
|
-
/* @__PURE__ */
|
|
3255
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3144
3256
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3145
|
-
/* @__PURE__ */
|
|
3146
|
-
/* @__PURE__ */
|
|
3257
|
+
/* @__PURE__ */ jsx17(ListButton, { editor, type: "bullet" }),
|
|
3258
|
+
/* @__PURE__ */ jsx17(ListButton, { editor, type: "numbered" })
|
|
3147
3259
|
] }),
|
|
3148
|
-
/* @__PURE__ */
|
|
3260
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3149
3261
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3150
|
-
/* @__PURE__ */
|
|
3151
|
-
/* @__PURE__ */
|
|
3152
|
-
/* @__PURE__ */
|
|
3262
|
+
/* @__PURE__ */ jsx17(FontSizeButton, { editor }),
|
|
3263
|
+
/* @__PURE__ */ jsx17(ColorButton, { editor, type: "text" }),
|
|
3264
|
+
/* @__PURE__ */ jsx17(ColorButton, { editor, type: "background" })
|
|
3153
3265
|
] }),
|
|
3154
|
-
/* @__PURE__ */
|
|
3266
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3155
3267
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3156
|
-
/* @__PURE__ */
|
|
3157
|
-
/* @__PURE__ */
|
|
3158
|
-
/* @__PURE__ */
|
|
3159
|
-
/* @__PURE__ */
|
|
3268
|
+
/* @__PURE__ */ jsx17(ImageButton, { editor, onImageUpload }),
|
|
3269
|
+
/* @__PURE__ */ jsx17(LinkButton, { editor }),
|
|
3270
|
+
/* @__PURE__ */ jsx17(TableButton, { editor }),
|
|
3271
|
+
/* @__PURE__ */ jsx17(HTMLImportButton, { editor })
|
|
3160
3272
|
] })
|
|
3161
3273
|
] })
|
|
3162
3274
|
] });
|
|
3163
3275
|
const SingleRowLayout = () => /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
3164
|
-
/* @__PURE__ */
|
|
3165
|
-
/* @__PURE__ */
|
|
3166
|
-
/* @__PURE__ */
|
|
3167
|
-
/* @__PURE__ */
|
|
3276
|
+
/* @__PURE__ */ jsx17(UndoRedoButtons, { editor }),
|
|
3277
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3278
|
+
/* @__PURE__ */ jsx17("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ jsx17(BlockTypeSelect, { editor }) }),
|
|
3279
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3168
3280
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3169
|
-
/* @__PURE__ */
|
|
3170
|
-
/* @__PURE__ */
|
|
3171
|
-
/* @__PURE__ */
|
|
3172
|
-
/* @__PURE__ */
|
|
3281
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "bold" }),
|
|
3282
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "italic" }),
|
|
3283
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "underline" }),
|
|
3284
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "strike" })
|
|
3173
3285
|
] }),
|
|
3174
|
-
/* @__PURE__ */
|
|
3286
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3175
3287
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3176
|
-
/* @__PURE__ */
|
|
3177
|
-
/* @__PURE__ */
|
|
3178
|
-
/* @__PURE__ */
|
|
3288
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "left" }),
|
|
3289
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "center" }),
|
|
3290
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "right" })
|
|
3179
3291
|
] }),
|
|
3180
|
-
/* @__PURE__ */
|
|
3292
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3181
3293
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3182
|
-
/* @__PURE__ */
|
|
3183
|
-
/* @__PURE__ */
|
|
3294
|
+
/* @__PURE__ */ jsx17(ListButton, { editor, type: "bullet" }),
|
|
3295
|
+
/* @__PURE__ */ jsx17(ListButton, { editor, type: "numbered" })
|
|
3184
3296
|
] }),
|
|
3185
|
-
/* @__PURE__ */
|
|
3297
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3186
3298
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3187
|
-
/* @__PURE__ */
|
|
3188
|
-
/* @__PURE__ */
|
|
3189
|
-
/* @__PURE__ */
|
|
3299
|
+
/* @__PURE__ */ jsx17(FontSizeButton, { editor }),
|
|
3300
|
+
/* @__PURE__ */ jsx17(ColorButton, { editor, type: "text" }),
|
|
3301
|
+
/* @__PURE__ */ jsx17(ColorButton, { editor, type: "background" })
|
|
3190
3302
|
] }),
|
|
3191
|
-
/* @__PURE__ */
|
|
3303
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3192
3304
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3193
|
-
/* @__PURE__ */
|
|
3194
|
-
/* @__PURE__ */
|
|
3195
|
-
/* @__PURE__ */
|
|
3196
|
-
/* @__PURE__ */
|
|
3305
|
+
/* @__PURE__ */ jsx17(ImageButton, { editor, onImageUpload }),
|
|
3306
|
+
/* @__PURE__ */ jsx17(LinkButton, { editor }),
|
|
3307
|
+
/* @__PURE__ */ jsx17(TableButton, { editor }),
|
|
3308
|
+
/* @__PURE__ */ jsx17(HTMLImportButton, { editor })
|
|
3197
3309
|
] })
|
|
3198
3310
|
] });
|
|
3199
3311
|
const TwoRowLayout = () => /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
3200
3312
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-row", children: [
|
|
3201
|
-
/* @__PURE__ */
|
|
3202
|
-
/* @__PURE__ */
|
|
3313
|
+
/* @__PURE__ */ jsx17(UndoRedoButtons, { editor }),
|
|
3314
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3203
3315
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3204
|
-
/* @__PURE__ */
|
|
3205
|
-
/* @__PURE__ */
|
|
3206
|
-
/* @__PURE__ */
|
|
3207
|
-
/* @__PURE__ */
|
|
3316
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "bold" }),
|
|
3317
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "italic" }),
|
|
3318
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "underline" }),
|
|
3319
|
+
/* @__PURE__ */ jsx17(TextStyleButton, { editor, style: "strike" })
|
|
3208
3320
|
] }),
|
|
3209
|
-
/* @__PURE__ */
|
|
3321
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3210
3322
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3211
|
-
/* @__PURE__ */
|
|
3212
|
-
/* @__PURE__ */
|
|
3213
|
-
/* @__PURE__ */
|
|
3323
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "left" }),
|
|
3324
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "center" }),
|
|
3325
|
+
/* @__PURE__ */ jsx17(AlignButton, { editor, alignment: "right" })
|
|
3214
3326
|
] }),
|
|
3215
|
-
/* @__PURE__ */
|
|
3327
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3216
3328
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3217
|
-
/* @__PURE__ */
|
|
3218
|
-
/* @__PURE__ */
|
|
3329
|
+
/* @__PURE__ */ jsx17(ListButton, { editor, type: "bullet" }),
|
|
3330
|
+
/* @__PURE__ */ jsx17(ListButton, { editor, type: "numbered" })
|
|
3219
3331
|
] })
|
|
3220
3332
|
] }),
|
|
3221
3333
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-row", children: [
|
|
3222
|
-
/* @__PURE__ */
|
|
3223
|
-
/* @__PURE__ */
|
|
3334
|
+
/* @__PURE__ */ jsx17("div", { className: "lumir-toolbar-group", children: /* @__PURE__ */ jsx17(BlockTypeSelect, { editor }) }),
|
|
3335
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3224
3336
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3225
|
-
/* @__PURE__ */
|
|
3226
|
-
/* @__PURE__ */
|
|
3227
|
-
/* @__PURE__ */
|
|
3337
|
+
/* @__PURE__ */ jsx17(FontSizeButton, { editor }),
|
|
3338
|
+
/* @__PURE__ */ jsx17(ColorButton, { editor, type: "text" }),
|
|
3339
|
+
/* @__PURE__ */ jsx17(ColorButton, { editor, type: "background" })
|
|
3228
3340
|
] }),
|
|
3229
|
-
/* @__PURE__ */
|
|
3341
|
+
/* @__PURE__ */ jsx17(ToolbarDivider, {}),
|
|
3230
3342
|
/* @__PURE__ */ jsxs11("div", { className: "lumir-toolbar-group", children: [
|
|
3231
|
-
/* @__PURE__ */
|
|
3232
|
-
/* @__PURE__ */
|
|
3233
|
-
/* @__PURE__ */
|
|
3234
|
-
/* @__PURE__ */
|
|
3343
|
+
/* @__PURE__ */ jsx17(ImageButton, { editor, onImageUpload }),
|
|
3344
|
+
/* @__PURE__ */ jsx17(LinkButton, { editor }),
|
|
3345
|
+
/* @__PURE__ */ jsx17(TableButton, { editor }),
|
|
3346
|
+
/* @__PURE__ */ jsx17(HTMLImportButton, { editor })
|
|
3235
3347
|
] })
|
|
3236
3348
|
] })
|
|
3237
3349
|
] });
|
|
3238
|
-
return /* @__PURE__ */
|
|
3350
|
+
return /* @__PURE__ */ jsx17(
|
|
3239
3351
|
"div",
|
|
3240
3352
|
{
|
|
3241
3353
|
ref: wrapperRef,
|
|
@@ -3245,7 +3357,7 @@ var FloatingMenu = ({
|
|
|
3245
3357
|
className
|
|
3246
3358
|
),
|
|
3247
3359
|
"data-position": position,
|
|
3248
|
-
children: /* @__PURE__ */
|
|
3360
|
+
children: /* @__PURE__ */ jsx17(
|
|
3249
3361
|
"div",
|
|
3250
3362
|
{
|
|
3251
3363
|
className: cn(
|
|
@@ -3254,7 +3366,7 @@ var FloatingMenu = ({
|
|
|
3254
3366
|
isMinimizable && "is-minimizable",
|
|
3255
3367
|
isMinimized && "is-minimized"
|
|
3256
3368
|
),
|
|
3257
|
-
children: isMinimizable ? /* @__PURE__ */
|
|
3369
|
+
children: isMinimizable ? /* @__PURE__ */ jsx17(MinimizedLayout, {}) : isCompact ? /* @__PURE__ */ jsx17(TwoRowLayout, {}) : /* @__PURE__ */ jsx17(SingleRowLayout, {})
|
|
3258
3370
|
}
|
|
3259
3371
|
)
|
|
3260
3372
|
}
|
|
@@ -4075,9 +4187,56 @@ var TableAlignmentExtension = Extension3.create({
|
|
|
4075
4187
|
}
|
|
4076
4188
|
});
|
|
4077
4189
|
|
|
4190
|
+
// src/extensions/TableSelectAllExtension.ts
|
|
4191
|
+
import { Extension as Extension4 } from "@tiptap/core";
|
|
4192
|
+
import { CellSelection, TableMap as TableMap3 } from "prosemirror-tables";
|
|
4193
|
+
var TableSelectAllExtension = Extension4.create({
|
|
4194
|
+
name: "lumirTableSelectAll",
|
|
4195
|
+
priority: 1e3,
|
|
4196
|
+
addKeyboardShortcuts() {
|
|
4197
|
+
return {
|
|
4198
|
+
"Mod-a": () => {
|
|
4199
|
+
const view = this.editor.view;
|
|
4200
|
+
const { state } = view;
|
|
4201
|
+
const sel = state.selection;
|
|
4202
|
+
const $from = sel.$from;
|
|
4203
|
+
let depth = -1;
|
|
4204
|
+
for (let d = $from.depth; d > 0; d--) {
|
|
4205
|
+
if ($from.node(d).type.name === "table") {
|
|
4206
|
+
depth = d;
|
|
4207
|
+
break;
|
|
4208
|
+
}
|
|
4209
|
+
}
|
|
4210
|
+
if (depth < 0) return false;
|
|
4211
|
+
const table = $from.node(depth);
|
|
4212
|
+
const tableStart = $from.start(depth);
|
|
4213
|
+
const map = TableMap3.get(table);
|
|
4214
|
+
const firstRel = map.map[0];
|
|
4215
|
+
const lastRel = map.map[map.map.length - 1];
|
|
4216
|
+
if (sel instanceof CellSelection) {
|
|
4217
|
+
const a = sel.$anchorCell.pos - tableStart;
|
|
4218
|
+
const h = sel.$headCell.pos - tableStart;
|
|
4219
|
+
if (Math.min(a, h) === firstRel && Math.max(a, h) === lastRel) {
|
|
4220
|
+
return false;
|
|
4221
|
+
}
|
|
4222
|
+
}
|
|
4223
|
+
const tr = state.tr.setSelection(
|
|
4224
|
+
CellSelection.create(
|
|
4225
|
+
state.doc,
|
|
4226
|
+
tableStart + firstRel,
|
|
4227
|
+
tableStart + lastRel
|
|
4228
|
+
)
|
|
4229
|
+
);
|
|
4230
|
+
view.dispatch(tr);
|
|
4231
|
+
return true;
|
|
4232
|
+
}
|
|
4233
|
+
};
|
|
4234
|
+
}
|
|
4235
|
+
});
|
|
4236
|
+
|
|
4078
4237
|
// src/blocks/columns/insertColumns.ts
|
|
4079
4238
|
import { TextSelection } from "prosemirror-state";
|
|
4080
|
-
function insertTwoColumns(editor) {
|
|
4239
|
+
function insertTwoColumns(editor, showDivider = false) {
|
|
4081
4240
|
const tiptap = editor?._tiptapEditor;
|
|
4082
4241
|
if (!tiptap) {
|
|
4083
4242
|
return false;
|
|
@@ -4104,7 +4263,7 @@ function insertTwoColumns(editor) {
|
|
|
4104
4263
|
const insertPos = $from.after(depth);
|
|
4105
4264
|
const mkBlock = () => blockContainer.create(null, paragraph.create());
|
|
4106
4265
|
const mkColumn = () => column.create(null, mkBlock());
|
|
4107
|
-
const list = columnList.create(
|
|
4266
|
+
const list = columnList.create({ showDivider }, [mkColumn(), mkColumn()]);
|
|
4108
4267
|
try {
|
|
4109
4268
|
let tr = state.tr.insert(insertPos, list);
|
|
4110
4269
|
try {
|
|
@@ -4147,12 +4306,12 @@ import {
|
|
|
4147
4306
|
useBlockNoteEditor,
|
|
4148
4307
|
useSelectedBlocks
|
|
4149
4308
|
} from "@blocknote/react";
|
|
4150
|
-
import { jsx as
|
|
4309
|
+
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
4151
4310
|
var icons = {
|
|
4152
|
-
left: /* @__PURE__ */
|
|
4153
|
-
center: /* @__PURE__ */
|
|
4154
|
-
right: /* @__PURE__ */
|
|
4155
|
-
justify: /* @__PURE__ */
|
|
4311
|
+
left: /* @__PURE__ */ jsx18("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx18("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }),
|
|
4312
|
+
center: /* @__PURE__ */ jsx18("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx18("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }),
|
|
4313
|
+
right: /* @__PURE__ */ jsx18("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx18("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }),
|
|
4314
|
+
justify: /* @__PURE__ */ jsx18("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", width: "18", height: "18", children: /* @__PURE__ */ jsx18("path", { d: "M3 21h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18V7H3v2zM3 3v2h18V3H3z" }) })
|
|
4156
4315
|
};
|
|
4157
4316
|
var tooltipMap = {
|
|
4158
4317
|
left: "\uC67C\uCABD \uC815\uB82C",
|
|
@@ -4224,7 +4383,7 @@ var TextAlignButtonWithVA = (props) => {
|
|
|
4224
4383
|
if (!show || !editor.isEditable) {
|
|
4225
4384
|
return null;
|
|
4226
4385
|
}
|
|
4227
|
-
return /* @__PURE__ */
|
|
4386
|
+
return /* @__PURE__ */ jsx18(
|
|
4228
4387
|
Components.FormattingToolbar.Button,
|
|
4229
4388
|
{
|
|
4230
4389
|
className: "bn-button",
|
|
@@ -4245,19 +4404,19 @@ import {
|
|
|
4245
4404
|
useComponentsContext as useComponentsContext2,
|
|
4246
4405
|
useSelectedBlocks as useSelectedBlocks2
|
|
4247
4406
|
} from "@blocknote/react";
|
|
4248
|
-
import { jsx as
|
|
4407
|
+
import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
4249
4408
|
var icons2 = {
|
|
4250
4409
|
top: /* @__PURE__ */ jsxs12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
4251
|
-
/* @__PURE__ */
|
|
4252
|
-
/* @__PURE__ */
|
|
4410
|
+
/* @__PURE__ */ jsx19("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
|
|
4411
|
+
/* @__PURE__ */ jsx19("line", { x1: "5", y1: "5", x2: "11", y2: "5" })
|
|
4253
4412
|
] }),
|
|
4254
4413
|
middle: /* @__PURE__ */ jsxs12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
4255
|
-
/* @__PURE__ */
|
|
4256
|
-
/* @__PURE__ */
|
|
4414
|
+
/* @__PURE__ */ jsx19("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
|
|
4415
|
+
/* @__PURE__ */ jsx19("line", { x1: "5", y1: "8", x2: "11", y2: "8" })
|
|
4257
4416
|
] }),
|
|
4258
4417
|
bottom: /* @__PURE__ */ jsxs12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
|
|
4259
|
-
/* @__PURE__ */
|
|
4260
|
-
/* @__PURE__ */
|
|
4418
|
+
/* @__PURE__ */ jsx19("rect", { x: "2", y: "2", width: "12", height: "12", rx: "1" }),
|
|
4419
|
+
/* @__PURE__ */ jsx19("line", { x1: "5", y1: "11", x2: "11", y2: "11" })
|
|
4261
4420
|
] })
|
|
4262
4421
|
};
|
|
4263
4422
|
var tooltips = {
|
|
@@ -4313,7 +4472,7 @@ var VerticalAlignButton = (props) => {
|
|
|
4313
4472
|
if (!isInTable || !editor.isEditable) {
|
|
4314
4473
|
return null;
|
|
4315
4474
|
}
|
|
4316
|
-
return /* @__PURE__ */
|
|
4475
|
+
return /* @__PURE__ */ jsx19(
|
|
4317
4476
|
Components.FormattingToolbar.Button,
|
|
4318
4477
|
{
|
|
4319
4478
|
className: "bn-button",
|
|
@@ -4334,22 +4493,22 @@ import {
|
|
|
4334
4493
|
useComponentsContext as useComponentsContext3,
|
|
4335
4494
|
useSelectedBlocks as useSelectedBlocks3
|
|
4336
4495
|
} from "@blocknote/react";
|
|
4337
|
-
import { jsx as
|
|
4496
|
+
import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
4338
4497
|
var icons3 = {
|
|
4339
4498
|
left: /* @__PURE__ */ jsxs13("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
|
|
4340
|
-
/* @__PURE__ */
|
|
4341
|
-
/* @__PURE__ */
|
|
4342
|
-
/* @__PURE__ */
|
|
4499
|
+
/* @__PURE__ */ jsx20("rect", { x: "1.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
|
|
4500
|
+
/* @__PURE__ */ jsx20("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
|
|
4501
|
+
/* @__PURE__ */ jsx20("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
|
|
4343
4502
|
] }),
|
|
4344
4503
|
center: /* @__PURE__ */ jsxs13("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
|
|
4345
|
-
/* @__PURE__ */
|
|
4346
|
-
/* @__PURE__ */
|
|
4347
|
-
/* @__PURE__ */
|
|
4504
|
+
/* @__PURE__ */ jsx20("rect", { x: "4.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
|
|
4505
|
+
/* @__PURE__ */ jsx20("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
|
|
4506
|
+
/* @__PURE__ */ jsx20("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
|
|
4348
4507
|
] }),
|
|
4349
4508
|
right: /* @__PURE__ */ jsxs13("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
|
|
4350
|
-
/* @__PURE__ */
|
|
4351
|
-
/* @__PURE__ */
|
|
4352
|
-
/* @__PURE__ */
|
|
4509
|
+
/* @__PURE__ */ jsx20("rect", { x: "7.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
|
|
4510
|
+
/* @__PURE__ */ jsx20("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
|
|
4511
|
+
/* @__PURE__ */ jsx20("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
|
|
4353
4512
|
] })
|
|
4354
4513
|
};
|
|
4355
4514
|
var tooltips2 = {
|
|
@@ -4377,7 +4536,7 @@ var TableAlignButton = (props) => {
|
|
|
4377
4536
|
if (!tableBlock || !editor.isEditable) {
|
|
4378
4537
|
return null;
|
|
4379
4538
|
}
|
|
4380
|
-
return /* @__PURE__ */
|
|
4539
|
+
return /* @__PURE__ */ jsx20(
|
|
4381
4540
|
Components.FormattingToolbar.Button,
|
|
4382
4541
|
{
|
|
4383
4542
|
className: "bn-button",
|
|
@@ -4398,12 +4557,12 @@ import {
|
|
|
4398
4557
|
useEditorContentOrSelectionChange,
|
|
4399
4558
|
useSelectedBlocks as useSelectedBlocks4
|
|
4400
4559
|
} from "@blocknote/react";
|
|
4401
|
-
import { useCallback as useCallback18, useMemo as useMemo4, useState as useState9 } from "react";
|
|
4402
|
-
import { jsx as
|
|
4560
|
+
import { useCallback as useCallback18, useEffect as useEffect9, useMemo as useMemo4, useState as useState9 } from "react";
|
|
4561
|
+
import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
4403
4562
|
var DEFAULT_LABEL2 = "\uAE30\uBCF8";
|
|
4404
4563
|
var toLabel2 = (size) => size.replace(/px$/, "");
|
|
4405
4564
|
function FontSizeIcon({ size }) {
|
|
4406
|
-
return /* @__PURE__ */
|
|
4565
|
+
return /* @__PURE__ */ jsx21(
|
|
4407
4566
|
"span",
|
|
4408
4567
|
{
|
|
4409
4568
|
style: {
|
|
@@ -4432,6 +4591,11 @@ function FontSizeButton2() {
|
|
|
4432
4591
|
setCurrentSize(ed.getActiveStyles().fontSize || "");
|
|
4433
4592
|
}
|
|
4434
4593
|
}, editor);
|
|
4594
|
+
const currentPx = parseFontSizePx(currentSize);
|
|
4595
|
+
const [inputValue, setInputValue] = useState9(String(currentPx));
|
|
4596
|
+
useEffect9(() => {
|
|
4597
|
+
setInputValue(String(currentPx));
|
|
4598
|
+
}, [currentPx]);
|
|
4435
4599
|
const setFontSize = useCallback18(
|
|
4436
4600
|
(size) => {
|
|
4437
4601
|
size === "" ? ed.removeStyles({ fontSize: "" }) : ed.addStyles({ fontSize: size });
|
|
@@ -4440,6 +4604,21 @@ function FontSizeButton2() {
|
|
|
4440
4604
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4441
4605
|
[editor]
|
|
4442
4606
|
);
|
|
4607
|
+
const stepBy = useCallback18(
|
|
4608
|
+
(delta) => {
|
|
4609
|
+
ed.addStyles({ fontSize: toFontSizeValue(currentPx + delta) });
|
|
4610
|
+
},
|
|
4611
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4612
|
+
[currentPx]
|
|
4613
|
+
);
|
|
4614
|
+
const applyInput = useCallback18(() => {
|
|
4615
|
+
const n = parseInt(inputValue, 10);
|
|
4616
|
+
if (Number.isFinite(n)) {
|
|
4617
|
+
ed.addStyles({ fontSize: toFontSizeValue(n) });
|
|
4618
|
+
} else {
|
|
4619
|
+
setInputValue(String(currentPx));
|
|
4620
|
+
}
|
|
4621
|
+
}, [inputValue, currentPx]);
|
|
4443
4622
|
const show = useMemo4(() => {
|
|
4444
4623
|
if (!fontSizeInSchema) {
|
|
4445
4624
|
return false;
|
|
@@ -4455,20 +4634,76 @@ function FontSizeButton2() {
|
|
|
4455
4634
|
return null;
|
|
4456
4635
|
}
|
|
4457
4636
|
const tooltip = "\uAE00\uC790 \uD06C\uAE30";
|
|
4637
|
+
const preventBlur = (e) => e.preventDefault();
|
|
4458
4638
|
return /* @__PURE__ */ jsxs14(Components.Generic.Menu.Root, { children: [
|
|
4459
|
-
/* @__PURE__ */
|
|
4639
|
+
/* @__PURE__ */ jsx21(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ jsx21(
|
|
4460
4640
|
Components.FormattingToolbar.Button,
|
|
4461
4641
|
{
|
|
4462
4642
|
className: "bn-button",
|
|
4463
4643
|
"data-test": "font-size",
|
|
4464
4644
|
label: tooltip,
|
|
4465
4645
|
mainTooltip: tooltip,
|
|
4466
|
-
icon: /* @__PURE__ */
|
|
4646
|
+
icon: /* @__PURE__ */ jsx21(FontSizeIcon, { size: currentSize })
|
|
4467
4647
|
}
|
|
4468
4648
|
) }),
|
|
4469
4649
|
/* @__PURE__ */ jsxs14(Components.Generic.Menu.Dropdown, { className: "bn-menu-dropdown", children: [
|
|
4470
|
-
/* @__PURE__ */
|
|
4471
|
-
/* @__PURE__ */
|
|
4650
|
+
/* @__PURE__ */ jsx21(Components.Generic.Menu.Label, { children: "\uAE00\uC790 \uD06C\uAE30" }),
|
|
4651
|
+
/* @__PURE__ */ jsxs14("div", { className: "lumir-fs-stepper", children: [
|
|
4652
|
+
/* @__PURE__ */ jsx21(
|
|
4653
|
+
"button",
|
|
4654
|
+
{
|
|
4655
|
+
type: "button",
|
|
4656
|
+
className: "lumir-fs-stepper-btn",
|
|
4657
|
+
"aria-label": "\uAE00\uC790 \uD06C\uAE30 1px \uC904\uC774\uAE30",
|
|
4658
|
+
"data-test": "font-size-decrease",
|
|
4659
|
+
disabled: currentPx <= FONT_SIZE_MIN,
|
|
4660
|
+
onMouseDown: preventBlur,
|
|
4661
|
+
onClick: () => stepBy(-1),
|
|
4662
|
+
children: "\u2212"
|
|
4663
|
+
}
|
|
4664
|
+
),
|
|
4665
|
+
/* @__PURE__ */ jsx21(
|
|
4666
|
+
"input",
|
|
4667
|
+
{
|
|
4668
|
+
className: "lumir-fs-stepper-input",
|
|
4669
|
+
type: "text",
|
|
4670
|
+
inputMode: "numeric",
|
|
4671
|
+
"aria-label": "\uAE00\uC790 \uD06C\uAE30 \uC785\uB825",
|
|
4672
|
+
"data-test": "font-size-input",
|
|
4673
|
+
value: inputValue,
|
|
4674
|
+
onChange: (e) => setInputValue(e.target.value.replace(/[^0-9]/g, "")),
|
|
4675
|
+
onClick: (e) => e.stopPropagation(),
|
|
4676
|
+
onKeyDown: (e) => {
|
|
4677
|
+
e.stopPropagation();
|
|
4678
|
+
if (e.key === "Enter") {
|
|
4679
|
+
e.preventDefault();
|
|
4680
|
+
applyInput();
|
|
4681
|
+
} else if (e.key === "ArrowUp") {
|
|
4682
|
+
e.preventDefault();
|
|
4683
|
+
stepBy(1);
|
|
4684
|
+
} else if (e.key === "ArrowDown") {
|
|
4685
|
+
e.preventDefault();
|
|
4686
|
+
stepBy(-1);
|
|
4687
|
+
}
|
|
4688
|
+
},
|
|
4689
|
+
onBlur: applyInput
|
|
4690
|
+
}
|
|
4691
|
+
),
|
|
4692
|
+
/* @__PURE__ */ jsx21(
|
|
4693
|
+
"button",
|
|
4694
|
+
{
|
|
4695
|
+
type: "button",
|
|
4696
|
+
className: "lumir-fs-stepper-btn",
|
|
4697
|
+
"aria-label": "\uAE00\uC790 \uD06C\uAE30 1px \uB298\uB9AC\uAE30",
|
|
4698
|
+
"data-test": "font-size-increase",
|
|
4699
|
+
disabled: currentPx >= FONT_SIZE_MAX,
|
|
4700
|
+
onMouseDown: preventBlur,
|
|
4701
|
+
onClick: () => stepBy(1),
|
|
4702
|
+
children: "+"
|
|
4703
|
+
}
|
|
4704
|
+
)
|
|
4705
|
+
] }),
|
|
4706
|
+
/* @__PURE__ */ jsx21(
|
|
4472
4707
|
Components.Generic.Menu.Item,
|
|
4473
4708
|
{
|
|
4474
4709
|
onClick: () => setFontSize(""),
|
|
@@ -4478,7 +4713,7 @@ function FontSizeButton2() {
|
|
|
4478
4713
|
},
|
|
4479
4714
|
"font-size-default"
|
|
4480
4715
|
),
|
|
4481
|
-
FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */
|
|
4716
|
+
FONT_SIZE_PRESETS.map((size) => /* @__PURE__ */ jsx21(
|
|
4482
4717
|
Components.Generic.Menu.Item,
|
|
4483
4718
|
{
|
|
4484
4719
|
onClick: () => setFontSize(size),
|
|
@@ -4506,7 +4741,7 @@ import {
|
|
|
4506
4741
|
useSelectedBlocks as useSelectedBlocks5
|
|
4507
4742
|
} from "@blocknote/react";
|
|
4508
4743
|
import { useCallback as useCallback19, useMemo as useMemo5, useRef as useRef10, useState as useState10 } from "react";
|
|
4509
|
-
import { Fragment as Fragment5, jsx as
|
|
4744
|
+
import { Fragment as Fragment5, jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
4510
4745
|
var COLORS = [
|
|
4511
4746
|
"default",
|
|
4512
4747
|
"gray",
|
|
@@ -4523,7 +4758,7 @@ function ColorIcon(props) {
|
|
|
4523
4758
|
const textColor = props.textColor || "default";
|
|
4524
4759
|
const backgroundColor = props.backgroundColor || "default";
|
|
4525
4760
|
const size = props.size || 16;
|
|
4526
|
-
return /* @__PURE__ */
|
|
4761
|
+
return /* @__PURE__ */ jsx22(
|
|
4527
4762
|
"div",
|
|
4528
4763
|
{
|
|
4529
4764
|
className: "bn-color-icon",
|
|
@@ -4542,7 +4777,7 @@ function ColorIcon(props) {
|
|
|
4542
4777
|
);
|
|
4543
4778
|
}
|
|
4544
4779
|
function CellFillIcon({ size = 18 }) {
|
|
4545
|
-
return /* @__PURE__ */
|
|
4780
|
+
return /* @__PURE__ */ jsx22(
|
|
4546
4781
|
"svg",
|
|
4547
4782
|
{
|
|
4548
4783
|
width: size,
|
|
@@ -4551,7 +4786,7 @@ function CellFillIcon({ size = 18 }) {
|
|
|
4551
4786
|
fill: "currentColor",
|
|
4552
4787
|
style: { pointerEvents: "none" },
|
|
4553
4788
|
"aria-hidden": "true",
|
|
4554
|
-
children: /* @__PURE__ */
|
|
4789
|
+
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" })
|
|
4555
4790
|
}
|
|
4556
4791
|
);
|
|
4557
4792
|
}
|
|
@@ -4560,8 +4795,8 @@ function LumirColorPicker(props) {
|
|
|
4560
4795
|
const dict = useDictionary();
|
|
4561
4796
|
return /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
4562
4797
|
props.text ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
4563
|
-
/* @__PURE__ */
|
|
4564
|
-
COLORS.map((color) => /* @__PURE__ */
|
|
4798
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Label, { children: props.textTitle ?? dict.color_picker.text_title }),
|
|
4799
|
+
COLORS.map((color) => /* @__PURE__ */ jsx22(
|
|
4565
4800
|
Components.Generic.Menu.Item,
|
|
4566
4801
|
{
|
|
4567
4802
|
onClick: () => {
|
|
@@ -4569,7 +4804,7 @@ function LumirColorPicker(props) {
|
|
|
4569
4804
|
props.text.setColor(color);
|
|
4570
4805
|
},
|
|
4571
4806
|
"data-test": "text-color-" + color,
|
|
4572
|
-
icon: /* @__PURE__ */
|
|
4807
|
+
icon: /* @__PURE__ */ jsx22(ColorIcon, { textColor: color, size: props.iconSize }),
|
|
4573
4808
|
checked: props.text.color === color,
|
|
4574
4809
|
children: dict.color_picker.colors[color]
|
|
4575
4810
|
},
|
|
@@ -4577,8 +4812,8 @@ function LumirColorPicker(props) {
|
|
|
4577
4812
|
))
|
|
4578
4813
|
] }) : null,
|
|
4579
4814
|
props.background ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
4580
|
-
/* @__PURE__ */
|
|
4581
|
-
COLORS.map((color) => /* @__PURE__ */
|
|
4815
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Label, { children: props.backgroundTitle ?? dict.color_picker.background_title }),
|
|
4816
|
+
COLORS.map((color) => /* @__PURE__ */ jsx22(
|
|
4582
4817
|
Components.Generic.Menu.Item,
|
|
4583
4818
|
{
|
|
4584
4819
|
onClick: () => {
|
|
@@ -4586,7 +4821,7 @@ function LumirColorPicker(props) {
|
|
|
4586
4821
|
props.background.setColor(color);
|
|
4587
4822
|
},
|
|
4588
4823
|
"data-test": "background-color-" + color,
|
|
4589
|
-
icon: /* @__PURE__ */
|
|
4824
|
+
icon: /* @__PURE__ */ jsx22(ColorIcon, { backgroundColor: color, size: props.iconSize }),
|
|
4590
4825
|
checked: props.background.color === color,
|
|
4591
4826
|
children: dict.color_picker.colors[color]
|
|
4592
4827
|
},
|
|
@@ -4650,14 +4885,14 @@ function LumirColorStyleButton() {
|
|
|
4650
4885
|
}
|
|
4651
4886
|
const tooltip = "\uD14D\uC2A4\uD2B8 \uC0C9\xB7\uBC30\uACBD";
|
|
4652
4887
|
return /* @__PURE__ */ jsxs15(Components.Generic.Menu.Root, { children: [
|
|
4653
|
-
/* @__PURE__ */
|
|
4888
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ jsx22(
|
|
4654
4889
|
Components.FormattingToolbar.Button,
|
|
4655
4890
|
{
|
|
4656
4891
|
className: "bn-button",
|
|
4657
4892
|
"data-test": "colors",
|
|
4658
4893
|
label: tooltip,
|
|
4659
4894
|
mainTooltip: tooltip,
|
|
4660
|
-
icon: /* @__PURE__ */
|
|
4895
|
+
icon: /* @__PURE__ */ jsx22(
|
|
4661
4896
|
ColorIcon,
|
|
4662
4897
|
{
|
|
4663
4898
|
textColor: currentTextColor,
|
|
@@ -4667,11 +4902,11 @@ function LumirColorStyleButton() {
|
|
|
4667
4902
|
)
|
|
4668
4903
|
}
|
|
4669
4904
|
) }),
|
|
4670
|
-
/* @__PURE__ */
|
|
4905
|
+
/* @__PURE__ */ jsx22(
|
|
4671
4906
|
Components.Generic.Menu.Dropdown,
|
|
4672
4907
|
{
|
|
4673
4908
|
className: "bn-menu-dropdown bn-color-picker-dropdown",
|
|
4674
|
-
children: /* @__PURE__ */
|
|
4909
|
+
children: /* @__PURE__ */ jsx22(
|
|
4675
4910
|
LumirColorPicker,
|
|
4676
4911
|
{
|
|
4677
4912
|
textTitle: "\uD14D\uC2A4\uD2B8 \uC0C9",
|
|
@@ -4718,21 +4953,21 @@ function LumirCellColorToolbarButton() {
|
|
|
4718
4953
|
}
|
|
4719
4954
|
},
|
|
4720
4955
|
children: [
|
|
4721
|
-
/* @__PURE__ */
|
|
4956
|
+
/* @__PURE__ */ jsx22(Components.Generic.Menu.Trigger, { children: /* @__PURE__ */ jsx22(
|
|
4722
4957
|
Components.FormattingToolbar.Button,
|
|
4723
4958
|
{
|
|
4724
4959
|
className: "bn-button",
|
|
4725
4960
|
"data-test": "cell-colors",
|
|
4726
4961
|
label: tooltip,
|
|
4727
4962
|
mainTooltip: tooltip,
|
|
4728
|
-
icon: /* @__PURE__ */
|
|
4963
|
+
icon: /* @__PURE__ */ jsx22(CellFillIcon, { size: 18 })
|
|
4729
4964
|
}
|
|
4730
4965
|
) }),
|
|
4731
|
-
/* @__PURE__ */
|
|
4966
|
+
/* @__PURE__ */ jsx22(
|
|
4732
4967
|
Components.Generic.Menu.Dropdown,
|
|
4733
4968
|
{
|
|
4734
4969
|
className: "bn-menu-dropdown bn-color-picker-dropdown",
|
|
4735
|
-
children: /* @__PURE__ */
|
|
4970
|
+
children: /* @__PURE__ */ jsx22(
|
|
4736
4971
|
LumirColorPicker,
|
|
4737
4972
|
{
|
|
4738
4973
|
backgroundTitle: "\uC140 \uBC30\uACBD",
|
|
@@ -4769,13 +5004,13 @@ function LumirCellColorPickerButton(props) {
|
|
|
4769
5004
|
return null;
|
|
4770
5005
|
}
|
|
4771
5006
|
return /* @__PURE__ */ jsxs15(Components.Generic.Menu.Root, { position: "right", sub: true, children: [
|
|
4772
|
-
/* @__PURE__ */
|
|
4773
|
-
/* @__PURE__ */
|
|
5007
|
+
/* @__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" }) }),
|
|
5008
|
+
/* @__PURE__ */ jsx22(
|
|
4774
5009
|
Components.Generic.Menu.Dropdown,
|
|
4775
5010
|
{
|
|
4776
5011
|
sub: true,
|
|
4777
5012
|
className: "bn-menu-dropdown bn-color-picker-dropdown",
|
|
4778
|
-
children: /* @__PURE__ */
|
|
5013
|
+
children: /* @__PURE__ */ jsx22(
|
|
4779
5014
|
LumirColorPicker,
|
|
4780
5015
|
{
|
|
4781
5016
|
iconSize: 18,
|
|
@@ -4797,12 +5032,12 @@ function LumirCellColorPickerButton(props) {
|
|
|
4797
5032
|
}
|
|
4798
5033
|
function LumirTableCellMenu(props) {
|
|
4799
5034
|
const Components = useComponentsContext5();
|
|
4800
|
-
return /* @__PURE__ */
|
|
5035
|
+
return /* @__PURE__ */ jsx22(
|
|
4801
5036
|
Components.Generic.Menu.Dropdown,
|
|
4802
5037
|
{
|
|
4803
5038
|
className: "bn-menu-dropdown bn-drag-handle-menu",
|
|
4804
5039
|
children: props.children || /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
4805
|
-
/* @__PURE__ */
|
|
5040
|
+
/* @__PURE__ */ jsx22(
|
|
4806
5041
|
SplitButton,
|
|
4807
5042
|
{
|
|
4808
5043
|
block: props.block,
|
|
@@ -4810,7 +5045,7 @@ function LumirTableCellMenu(props) {
|
|
|
4810
5045
|
colIndex: props.colIndex
|
|
4811
5046
|
}
|
|
4812
5047
|
),
|
|
4813
|
-
/* @__PURE__ */
|
|
5048
|
+
/* @__PURE__ */ jsx22(
|
|
4814
5049
|
LumirCellColorPickerButton,
|
|
4815
5050
|
{
|
|
4816
5051
|
block: props.block,
|
|
@@ -4824,78 +5059,78 @@ function LumirTableCellMenu(props) {
|
|
|
4824
5059
|
}
|
|
4825
5060
|
|
|
4826
5061
|
// src/components/CustomFormattingToolbar.tsx
|
|
4827
|
-
import { jsx as
|
|
5062
|
+
import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
4828
5063
|
var CustomFormattingToolbar = () => {
|
|
4829
5064
|
return /* @__PURE__ */ jsxs16(FormattingToolbar, { children: [
|
|
4830
|
-
/* @__PURE__ */
|
|
4831
|
-
/* @__PURE__ */
|
|
4832
|
-
/* @__PURE__ */
|
|
4833
|
-
/* @__PURE__ */
|
|
4834
|
-
/* @__PURE__ */
|
|
4835
|
-
/* @__PURE__ */
|
|
4836
|
-
/* @__PURE__ */
|
|
4837
|
-
/* @__PURE__ */
|
|
4838
|
-
/* @__PURE__ */
|
|
4839
|
-
/* @__PURE__ */
|
|
5065
|
+
/* @__PURE__ */ jsx23(BlockTypeSelect2, {}, "blockTypeSelect"),
|
|
5066
|
+
/* @__PURE__ */ jsx23(TableCellMergeButton, {}, "tableCellMergeButton"),
|
|
5067
|
+
/* @__PURE__ */ jsx23(FileCaptionButton, {}, "fileCaptionButton"),
|
|
5068
|
+
/* @__PURE__ */ jsx23(FileReplaceButton, {}, "replaceFileButton"),
|
|
5069
|
+
/* @__PURE__ */ jsx23(FileRenameButton, {}, "fileRenameButton"),
|
|
5070
|
+
/* @__PURE__ */ jsx23(FileDeleteButton, {}, "fileDeleteButton"),
|
|
5071
|
+
/* @__PURE__ */ jsx23(FileDownloadButton, {}, "fileDownloadButton"),
|
|
5072
|
+
/* @__PURE__ */ jsx23(FilePreviewButton, {}, "filePreviewButton"),
|
|
5073
|
+
/* @__PURE__ */ jsx23(BasicTextStyleButton, { basicTextStyle: "bold" }, "boldStyleButton"),
|
|
5074
|
+
/* @__PURE__ */ jsx23(
|
|
4840
5075
|
BasicTextStyleButton,
|
|
4841
5076
|
{
|
|
4842
5077
|
basicTextStyle: "italic"
|
|
4843
5078
|
},
|
|
4844
5079
|
"italicStyleButton"
|
|
4845
5080
|
),
|
|
4846
|
-
/* @__PURE__ */
|
|
5081
|
+
/* @__PURE__ */ jsx23(
|
|
4847
5082
|
BasicTextStyleButton,
|
|
4848
5083
|
{
|
|
4849
5084
|
basicTextStyle: "underline"
|
|
4850
5085
|
},
|
|
4851
5086
|
"underlineStyleButton"
|
|
4852
5087
|
),
|
|
4853
|
-
/* @__PURE__ */
|
|
5088
|
+
/* @__PURE__ */ jsx23(
|
|
4854
5089
|
BasicTextStyleButton,
|
|
4855
5090
|
{
|
|
4856
5091
|
basicTextStyle: "strike"
|
|
4857
5092
|
},
|
|
4858
5093
|
"strikeStyleButton"
|
|
4859
5094
|
),
|
|
4860
|
-
/* @__PURE__ */
|
|
4861
|
-
/* @__PURE__ */
|
|
5095
|
+
/* @__PURE__ */ jsx23(TextAlignButtonWithVA, { textAlignment: "left" }, "textAlignLeftButton"),
|
|
5096
|
+
/* @__PURE__ */ jsx23(
|
|
4862
5097
|
TextAlignButtonWithVA,
|
|
4863
5098
|
{
|
|
4864
5099
|
textAlignment: "center"
|
|
4865
5100
|
},
|
|
4866
5101
|
"textAlignCenterButton"
|
|
4867
5102
|
),
|
|
4868
|
-
/* @__PURE__ */
|
|
4869
|
-
/* @__PURE__ */
|
|
5103
|
+
/* @__PURE__ */ jsx23(TextAlignButtonWithVA, { textAlignment: "right" }, "textAlignRightButton"),
|
|
5104
|
+
/* @__PURE__ */ jsx23(
|
|
4870
5105
|
VerticalAlignButton,
|
|
4871
5106
|
{
|
|
4872
5107
|
verticalAlignment: "top"
|
|
4873
5108
|
},
|
|
4874
5109
|
"verticalAlignTop"
|
|
4875
5110
|
),
|
|
4876
|
-
/* @__PURE__ */
|
|
5111
|
+
/* @__PURE__ */ jsx23(
|
|
4877
5112
|
VerticalAlignButton,
|
|
4878
5113
|
{
|
|
4879
5114
|
verticalAlignment: "middle"
|
|
4880
5115
|
},
|
|
4881
5116
|
"verticalAlignMiddle"
|
|
4882
5117
|
),
|
|
4883
|
-
/* @__PURE__ */
|
|
5118
|
+
/* @__PURE__ */ jsx23(
|
|
4884
5119
|
VerticalAlignButton,
|
|
4885
5120
|
{
|
|
4886
5121
|
verticalAlignment: "bottom"
|
|
4887
5122
|
},
|
|
4888
5123
|
"verticalAlignBottom"
|
|
4889
5124
|
),
|
|
4890
|
-
/* @__PURE__ */
|
|
4891
|
-
/* @__PURE__ */
|
|
4892
|
-
/* @__PURE__ */
|
|
4893
|
-
/* @__PURE__ */
|
|
4894
|
-
/* @__PURE__ */
|
|
4895
|
-
/* @__PURE__ */
|
|
4896
|
-
/* @__PURE__ */
|
|
4897
|
-
/* @__PURE__ */
|
|
4898
|
-
/* @__PURE__ */
|
|
5125
|
+
/* @__PURE__ */ jsx23(TableAlignButton, { alignment: "left" }, "tableAlignLeft"),
|
|
5126
|
+
/* @__PURE__ */ jsx23(TableAlignButton, { alignment: "center" }, "tableAlignCenter"),
|
|
5127
|
+
/* @__PURE__ */ jsx23(TableAlignButton, { alignment: "right" }, "tableAlignRight"),
|
|
5128
|
+
/* @__PURE__ */ jsx23(FontSizeButton2, {}, "fontSizeButton"),
|
|
5129
|
+
/* @__PURE__ */ jsx23(LumirColorStyleButton, {}, "colorStyleButton"),
|
|
5130
|
+
/* @__PURE__ */ jsx23(LumirCellColorToolbarButton, {}, "cellColorButton"),
|
|
5131
|
+
/* @__PURE__ */ jsx23(NestBlockButton, {}, "nestBlockButton"),
|
|
5132
|
+
/* @__PURE__ */ jsx23(UnnestBlockButton, {}, "unnestBlockButton"),
|
|
5133
|
+
/* @__PURE__ */ jsx23(CreateLinkButton, {}, "createLinkButton")
|
|
4899
5134
|
] });
|
|
4900
5135
|
};
|
|
4901
5136
|
|
|
@@ -4910,22 +5145,22 @@ import {
|
|
|
4910
5145
|
useBlockNoteEditor as useBlockNoteEditor6,
|
|
4911
5146
|
useDictionary as useDictionary2
|
|
4912
5147
|
} from "@blocknote/react";
|
|
4913
|
-
import { Fragment as Fragment6, jsx as
|
|
5148
|
+
import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
4914
5149
|
var TABLE_ALIGN_ICONS = {
|
|
4915
5150
|
left: /* @__PURE__ */ jsxs17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
|
|
4916
|
-
/* @__PURE__ */
|
|
4917
|
-
/* @__PURE__ */
|
|
4918
|
-
/* @__PURE__ */
|
|
5151
|
+
/* @__PURE__ */ jsx24("rect", { x: "1.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
|
|
5152
|
+
/* @__PURE__ */ jsx24("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
|
|
5153
|
+
/* @__PURE__ */ jsx24("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
|
|
4919
5154
|
] }),
|
|
4920
5155
|
center: /* @__PURE__ */ jsxs17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
|
|
4921
|
-
/* @__PURE__ */
|
|
4922
|
-
/* @__PURE__ */
|
|
4923
|
-
/* @__PURE__ */
|
|
5156
|
+
/* @__PURE__ */ jsx24("rect", { x: "4.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
|
|
5157
|
+
/* @__PURE__ */ jsx24("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
|
|
5158
|
+
/* @__PURE__ */ jsx24("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
|
|
4924
5159
|
] }),
|
|
4925
5160
|
right: /* @__PURE__ */ jsxs17("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.4", children: [
|
|
4926
|
-
/* @__PURE__ */
|
|
4927
|
-
/* @__PURE__ */
|
|
4928
|
-
/* @__PURE__ */
|
|
5161
|
+
/* @__PURE__ */ jsx24("rect", { x: "7.5", y: "4", width: "7", height: "8", rx: "1", fill: "currentColor", stroke: "none" }),
|
|
5162
|
+
/* @__PURE__ */ jsx24("line", { x1: "1.5", y1: "1.5", x2: "14.5", y2: "1.5" }),
|
|
5163
|
+
/* @__PURE__ */ jsx24("line", { x1: "1.5", y1: "14.5", x2: "14.5", y2: "14.5" })
|
|
4929
5164
|
] })
|
|
4930
5165
|
};
|
|
4931
5166
|
var TABLE_ALIGN_LABELS = {
|
|
@@ -4940,7 +5175,7 @@ function TableAlignmentItems(props) {
|
|
|
4940
5175
|
return null;
|
|
4941
5176
|
}
|
|
4942
5177
|
const current = getTableAlignment(editor, props.block.id);
|
|
4943
|
-
return /* @__PURE__ */
|
|
5178
|
+
return /* @__PURE__ */ jsx24(Fragment6, { children: ["left", "center", "right"].map((align) => /* @__PURE__ */ jsx24(
|
|
4944
5179
|
Components.Generic.Menu.Item,
|
|
4945
5180
|
{
|
|
4946
5181
|
icon: TABLE_ALIGN_ICONS[align],
|
|
@@ -4957,11 +5192,11 @@ function TableAlignmentItems(props) {
|
|
|
4957
5192
|
var LumirDragHandleMenu = (props) => {
|
|
4958
5193
|
const dict = useDictionary2();
|
|
4959
5194
|
return /* @__PURE__ */ jsxs17(DragHandleMenu, { ...props, children: [
|
|
4960
|
-
/* @__PURE__ */
|
|
4961
|
-
/* @__PURE__ */
|
|
4962
|
-
/* @__PURE__ */
|
|
4963
|
-
/* @__PURE__ */
|
|
4964
|
-
/* @__PURE__ */
|
|
5195
|
+
/* @__PURE__ */ jsx24(RemoveBlockItem, { ...props, children: dict.drag_handle.delete_menuitem }),
|
|
5196
|
+
/* @__PURE__ */ jsx24(BlockColorsItem, { ...props, children: dict.drag_handle.colors_menuitem }),
|
|
5197
|
+
/* @__PURE__ */ jsx24(TableRowHeaderItem, { ...props, children: dict.drag_handle.header_row_menuitem }),
|
|
5198
|
+
/* @__PURE__ */ jsx24(TableColumnHeaderItem, { ...props, children: dict.drag_handle.header_column_menuitem }),
|
|
5199
|
+
/* @__PURE__ */ jsx24(TableAlignmentItems, { block: props.block })
|
|
4965
5200
|
] });
|
|
4966
5201
|
};
|
|
4967
5202
|
|
|
@@ -4976,7 +5211,7 @@ import {
|
|
|
4976
5211
|
useUIPluginState
|
|
4977
5212
|
} from "@blocknote/react";
|
|
4978
5213
|
import { autoUpdate as autoUpdate2, FloatingPortal } from "@floating-ui/react";
|
|
4979
|
-
import { useCallback as useCallback20, useEffect as
|
|
5214
|
+
import { useCallback as useCallback20, useEffect as useEffect11, useMemo as useMemo7, useRef as useRef11, useState as useState11 } from "react";
|
|
4980
5215
|
|
|
4981
5216
|
// src/components/hooks/useFocusedCellHandlePositioning.ts
|
|
4982
5217
|
import {
|
|
@@ -4985,7 +5220,7 @@ import {
|
|
|
4985
5220
|
useFloating,
|
|
4986
5221
|
useTransitionStyles
|
|
4987
5222
|
} from "@floating-ui/react";
|
|
4988
|
-
import { useEffect as
|
|
5223
|
+
import { useEffect as useEffect10, useMemo as useMemo6 } from "react";
|
|
4989
5224
|
function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
4990
5225
|
const { refs, floatingStyles, context, update } = useFloating({
|
|
4991
5226
|
open: show,
|
|
@@ -5000,7 +5235,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
|
5000
5235
|
whileElementsMounted: autoUpdate
|
|
5001
5236
|
});
|
|
5002
5237
|
const { isMounted, styles } = useTransitionStyles(context);
|
|
5003
|
-
|
|
5238
|
+
useEffect10(() => {
|
|
5004
5239
|
if (!show || !tbodyEl) {
|
|
5005
5240
|
return;
|
|
5006
5241
|
}
|
|
@@ -5008,7 +5243,7 @@ function useFocusedCellHandlePositioning(cellEl, tbodyEl, orientation, show) {
|
|
|
5008
5243
|
ro.observe(tbodyEl);
|
|
5009
5244
|
return () => ro.disconnect();
|
|
5010
5245
|
}, [show, tbodyEl, update]);
|
|
5011
|
-
|
|
5246
|
+
useEffect10(() => {
|
|
5012
5247
|
if (!cellEl) {
|
|
5013
5248
|
refs.setReference(null);
|
|
5014
5249
|
return;
|
|
@@ -5053,7 +5288,7 @@ function useTableCornerPositioning(referencePosTable, show) {
|
|
|
5053
5288
|
whileElementsMounted: autoUpdate
|
|
5054
5289
|
});
|
|
5055
5290
|
const { isMounted, styles } = useTransitionStyles(context);
|
|
5056
|
-
|
|
5291
|
+
useEffect10(() => {
|
|
5057
5292
|
if (!referencePosTable) {
|
|
5058
5293
|
refs.setReference(null);
|
|
5059
5294
|
return;
|
|
@@ -5073,7 +5308,7 @@ function useTableCornerPositioning(referencePosTable, show) {
|
|
|
5073
5308
|
}
|
|
5074
5309
|
|
|
5075
5310
|
// src/components/LumirTableHandlesController.tsx
|
|
5076
|
-
import { Fragment as Fragment7, jsx as
|
|
5311
|
+
import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
5077
5312
|
function syncCoreHoverToFocusedCell(cellEl) {
|
|
5078
5313
|
const r = cellEl.getBoundingClientRect();
|
|
5079
5314
|
cellEl.dispatchEvent(
|
|
@@ -5095,7 +5330,7 @@ function LumirTableHandlesController() {
|
|
|
5095
5330
|
const frozenRef = useRef11(false);
|
|
5096
5331
|
const menuOpenRef = useRef11(false);
|
|
5097
5332
|
const draggingRef = useRef11(false);
|
|
5098
|
-
|
|
5333
|
+
useEffect11(() => {
|
|
5099
5334
|
editor.__lumirActiveTableId = focused?.block?.id ?? null;
|
|
5100
5335
|
}, [editor, focused]);
|
|
5101
5336
|
const recompute = useCallback20(() => {
|
|
@@ -5147,10 +5382,10 @@ function LumirTableHandlesController() {
|
|
|
5147
5382
|
});
|
|
5148
5383
|
}, [editor]);
|
|
5149
5384
|
useEditorContentOrSelectionChange3(recompute, editor);
|
|
5150
|
-
|
|
5385
|
+
useEffect11(() => {
|
|
5151
5386
|
recompute();
|
|
5152
5387
|
}, [recompute]);
|
|
5153
|
-
|
|
5388
|
+
useEffect11(() => {
|
|
5154
5389
|
const onUp = () => {
|
|
5155
5390
|
requestAnimationFrame(() => {
|
|
5156
5391
|
if (!menuOpenRef.current && !draggingRef.current && frozenRef.current) {
|
|
@@ -5162,7 +5397,7 @@ function LumirTableHandlesController() {
|
|
|
5162
5397
|
window.addEventListener("pointerup", onUp);
|
|
5163
5398
|
return () => window.removeEventListener("pointerup", onUp);
|
|
5164
5399
|
}, [recompute]);
|
|
5165
|
-
|
|
5400
|
+
useEffect11(() => {
|
|
5166
5401
|
const f = focused;
|
|
5167
5402
|
if (!f || !overlayEl) {
|
|
5168
5403
|
return;
|
|
@@ -5317,9 +5552,9 @@ function LumirTableHandlesController() {
|
|
|
5317
5552
|
[editor, coreState]
|
|
5318
5553
|
);
|
|
5319
5554
|
return /* @__PURE__ */ jsxs18(Fragment7, { children: [
|
|
5320
|
-
/* @__PURE__ */
|
|
5555
|
+
/* @__PURE__ */ jsx25("div", { ref: setMenuContainerRef }),
|
|
5321
5556
|
th && focused && menuContainerRef && /* @__PURE__ */ jsxs18(FloatingPortal, { root: focused.widgetContainer, children: [
|
|
5322
|
-
/* @__PURE__ */
|
|
5557
|
+
/* @__PURE__ */ jsx25("div", { ref: setOverlayEl, className: "lumir-tbl-cell-focus" }),
|
|
5323
5558
|
colHandle.isMounted && /* @__PURE__ */ jsxs18(
|
|
5324
5559
|
"div",
|
|
5325
5560
|
{
|
|
@@ -5329,8 +5564,8 @@ function LumirTableHandlesController() {
|
|
|
5329
5564
|
onPointerEnter: onGutterPointerEnter,
|
|
5330
5565
|
onPointerDown: onGutterPointerDown,
|
|
5331
5566
|
children: [
|
|
5332
|
-
/* @__PURE__ */
|
|
5333
|
-
/* @__PURE__ */
|
|
5567
|
+
/* @__PURE__ */ jsx25("span", { className: "lumir-tbl-gutter" }),
|
|
5568
|
+
/* @__PURE__ */ jsx25("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ jsx25(
|
|
5334
5569
|
TableHandle,
|
|
5335
5570
|
{
|
|
5336
5571
|
editor,
|
|
@@ -5358,8 +5593,8 @@ function LumirTableHandlesController() {
|
|
|
5358
5593
|
onPointerEnter: onGutterPointerEnter,
|
|
5359
5594
|
onPointerDown: onGutterPointerDown,
|
|
5360
5595
|
children: [
|
|
5361
|
-
/* @__PURE__ */
|
|
5362
|
-
/* @__PURE__ */
|
|
5596
|
+
/* @__PURE__ */ jsx25("span", { className: "lumir-tbl-gutter" }),
|
|
5597
|
+
/* @__PURE__ */ jsx25("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ jsx25(
|
|
5363
5598
|
TableHandle,
|
|
5364
5599
|
{
|
|
5365
5600
|
editor,
|
|
@@ -5386,8 +5621,8 @@ function LumirTableHandlesController() {
|
|
|
5386
5621
|
className: "lumir-tbl-gutter-wrap lumir-tbl-gutter-wrap--cell" + (openMenu === "cell" ? " lumir-tbl-gutter-wrap--active" : ""),
|
|
5387
5622
|
onPointerDown: onGutterPointerDown,
|
|
5388
5623
|
children: [
|
|
5389
|
-
/* @__PURE__ */
|
|
5390
|
-
/* @__PURE__ */
|
|
5624
|
+
/* @__PURE__ */ jsx25("span", { className: "lumir-tbl-gutter" }),
|
|
5625
|
+
/* @__PURE__ */ jsx25("div", { className: "lumir-tbl-grip", children: /* @__PURE__ */ jsx25(
|
|
5391
5626
|
TableCellButton,
|
|
5392
5627
|
{
|
|
5393
5628
|
editor,
|
|
@@ -5405,7 +5640,7 @@ function LumirTableHandlesController() {
|
|
|
5405
5640
|
)
|
|
5406
5641
|
] }),
|
|
5407
5642
|
th && coreState?.widgetContainer && /* @__PURE__ */ jsxs18(FloatingPortal, { root: coreState.widgetContainer, children: [
|
|
5408
|
-
/* @__PURE__ */
|
|
5643
|
+
/* @__PURE__ */ jsx25("div", { ref: addOrRemoveRowsButton.ref, style: addOrRemoveRowsButton.style, children: /* @__PURE__ */ jsx25(
|
|
5409
5644
|
ExtendButton,
|
|
5410
5645
|
{
|
|
5411
5646
|
editor,
|
|
@@ -5415,12 +5650,12 @@ function LumirTableHandlesController() {
|
|
|
5415
5650
|
onMouseUp: onEndExtend
|
|
5416
5651
|
}
|
|
5417
5652
|
) }),
|
|
5418
|
-
/* @__PURE__ */
|
|
5653
|
+
/* @__PURE__ */ jsx25(
|
|
5419
5654
|
"div",
|
|
5420
5655
|
{
|
|
5421
5656
|
ref: addOrRemoveColumnsButton.ref,
|
|
5422
5657
|
style: addOrRemoveColumnsButton.style,
|
|
5423
|
-
children: /* @__PURE__ */
|
|
5658
|
+
children: /* @__PURE__ */ jsx25(
|
|
5424
5659
|
ExtendButton,
|
|
5425
5660
|
{
|
|
5426
5661
|
editor,
|
|
@@ -5432,7 +5667,7 @@ function LumirTableHandlesController() {
|
|
|
5432
5667
|
)
|
|
5433
5668
|
}
|
|
5434
5669
|
),
|
|
5435
|
-
tableCorner.isMounted && /* @__PURE__ */
|
|
5670
|
+
tableCorner.isMounted && /* @__PURE__ */ jsx25(
|
|
5436
5671
|
"div",
|
|
5437
5672
|
{
|
|
5438
5673
|
ref: tableCorner.ref,
|
|
@@ -5697,7 +5932,7 @@ function liftFontSize(blocks) {
|
|
|
5697
5932
|
}
|
|
5698
5933
|
|
|
5699
5934
|
// src/utils/table-delete.ts
|
|
5700
|
-
import { CellSelection, TableMap as
|
|
5935
|
+
import { CellSelection as CellSelection2, TableMap as TableMap4, deleteRow } from "prosemirror-tables";
|
|
5701
5936
|
function measureRowHeights(view, tablePos) {
|
|
5702
5937
|
try {
|
|
5703
5938
|
const at = view?.domAtPos?.(tablePos + 1);
|
|
@@ -5716,7 +5951,7 @@ function measureRowHeights(view, tablePos) {
|
|
|
5716
5951
|
function buildDeleteColumnTr(state, tablePos, col, rowPx) {
|
|
5717
5952
|
const table = state.doc.nodeAt(tablePos);
|
|
5718
5953
|
if (!table || table.type.name !== "table") return null;
|
|
5719
|
-
const map =
|
|
5954
|
+
const map = TableMap4.get(table);
|
|
5720
5955
|
const W = map.width;
|
|
5721
5956
|
const H = map.height;
|
|
5722
5957
|
if (col < 0 || col >= W || W <= 1) return null;
|
|
@@ -5822,7 +6057,7 @@ function removeFocusedRowOrColumn(editor, index, direction) {
|
|
|
5822
6057
|
const rowStart = state.doc.resolve(tableInside.posAtIndex(index) + 1);
|
|
5823
6058
|
const cellPos = state.doc.resolve(rowStart.posAtIndex(0));
|
|
5824
6059
|
const selState = state.apply(
|
|
5825
|
-
state.tr.setSelection(new
|
|
6060
|
+
state.tr.setSelection(new CellSelection2(cellPos))
|
|
5826
6061
|
);
|
|
5827
6062
|
return deleteRow(selState, (tr) => tiptap.view.dispatch(tr));
|
|
5828
6063
|
} catch {
|
|
@@ -5974,6 +6209,20 @@ function normalizeAlign(ta) {
|
|
|
5974
6209
|
if (v === "justify") return "justify";
|
|
5975
6210
|
return "";
|
|
5976
6211
|
}
|
|
6212
|
+
function mapVerticalAlign(v) {
|
|
6213
|
+
const s = (v || "").trim().toLowerCase();
|
|
6214
|
+
if (s === "middle" || s === "center") return "middle";
|
|
6215
|
+
if (s === "bottom") return "bottom";
|
|
6216
|
+
return null;
|
|
6217
|
+
}
|
|
6218
|
+
function fontSizeToPx(raw) {
|
|
6219
|
+
if (!raw) return null;
|
|
6220
|
+
const m = String(raw).trim().match(/^([\d.]+)\s*(px|pt)?$/i);
|
|
6221
|
+
if (!m) return null;
|
|
6222
|
+
const v = parseFloat(m[1]);
|
|
6223
|
+
if (!Number.isFinite(v) || v <= 0) return null;
|
|
6224
|
+
return (m[2] || "px").toLowerCase() === "pt" ? v * (96 / 72) : v;
|
|
6225
|
+
}
|
|
5977
6226
|
function applyCellFormatting(el, fmt) {
|
|
5978
6227
|
if (fmt.bgRgb && !fmt.bgTransparent) {
|
|
5979
6228
|
const v = nearestBackgroundColorValue(fmt.bgRgb);
|
|
@@ -5993,6 +6242,13 @@ function applyCellFormatting(el, fmt) {
|
|
|
5993
6242
|
if (fmt.bold) inner = `<strong>${inner}</strong>`;
|
|
5994
6243
|
el.innerHTML = inner;
|
|
5995
6244
|
}
|
|
6245
|
+
if (fmt.verticalAlign) {
|
|
6246
|
+
el.setAttribute("data-vertical-alignment", fmt.verticalAlign);
|
|
6247
|
+
}
|
|
6248
|
+
if (fmt.fontSizePx && Math.abs(fmt.fontSizePx - 14) > 1 && el.innerHTML.trim()) {
|
|
6249
|
+
const v = `${Math.round(fmt.fontSizePx)}px`;
|
|
6250
|
+
el.innerHTML = `<span data-style-type="fontSize" data-value="${v}" style="font-size:${v}">` + el.innerHTML + `</span>`;
|
|
6251
|
+
}
|
|
5996
6252
|
}
|
|
5997
6253
|
function readComputedFormat(el) {
|
|
5998
6254
|
const cs = getComputedStyle(el);
|
|
@@ -6006,7 +6262,13 @@ function readComputedFormat(el) {
|
|
|
6006
6262
|
align: normalizeAlign(cs.textAlign),
|
|
6007
6263
|
bold: fw === "bold" || fw === "bolder" || !isNaN(fwNum) && fwNum >= 600,
|
|
6008
6264
|
italic: (cs.fontStyle || "").toLowerCase().includes("italic"),
|
|
6009
|
-
underline: decoration.toLowerCase().includes("underline")
|
|
6265
|
+
underline: decoration.toLowerCase().includes("underline"),
|
|
6266
|
+
fontSizePx: fontSizeToPx(cs.fontSize),
|
|
6267
|
+
// ⚠️ computed vertical-align은 td 기본값이 "middle"이라 셀마다 잘못 붙는다.
|
|
6268
|
+
// 명시적 inline style / valign 속성만 읽는다(기본값 노이즈 방지).
|
|
6269
|
+
verticalAlign: mapVerticalAlign(
|
|
6270
|
+
el.style?.verticalAlign || el.getAttribute("valign")
|
|
6271
|
+
)
|
|
6010
6272
|
};
|
|
6011
6273
|
}
|
|
6012
6274
|
function readInlineFormat(el) {
|
|
@@ -6022,7 +6284,11 @@ function readInlineFormat(el) {
|
|
|
6022
6284
|
align: normalizeAlign(sm["text-align"] || el.getAttribute("align")),
|
|
6023
6285
|
bold: fw === "bold" || fw === "bolder" || parseInt(fw, 10) >= 600,
|
|
6024
6286
|
italic: (sm["font-style"] || "").toLowerCase().includes("italic"),
|
|
6025
|
-
underline: decoration.toLowerCase().includes("underline")
|
|
6287
|
+
underline: decoration.toLowerCase().includes("underline"),
|
|
6288
|
+
fontSizePx: fontSizeToPx(sm["font-size"]),
|
|
6289
|
+
verticalAlign: mapVerticalAlign(
|
|
6290
|
+
sm["vertical-align"] || el.getAttribute("valign")
|
|
6291
|
+
)
|
|
6026
6292
|
};
|
|
6027
6293
|
}
|
|
6028
6294
|
function normalizeExcelTableHtml(html) {
|
|
@@ -6036,7 +6302,7 @@ function normalizeExcelTableHtml(html) {
|
|
|
6036
6302
|
try {
|
|
6037
6303
|
host = document.createElement("div");
|
|
6038
6304
|
host.setAttribute("aria-hidden", "true");
|
|
6039
|
-
host.style.cssText = "position:absolute;left:-99999px;top:0;width:0;height:0;overflow:hidden;opacity:0;pointer-events:none";
|
|
6305
|
+
host.style.cssText = "position:absolute;left:-99999px;top:0;width:0;height:0;overflow:hidden;opacity:0;pointer-events:none;font-size:14px";
|
|
6040
6306
|
const shadow = host.attachShadow({ mode: "open" });
|
|
6041
6307
|
const styles = Array.from(doc.querySelectorAll("style")).map((s) => s.outerHTML).join("");
|
|
6042
6308
|
shadow.innerHTML = styles + doc.body.innerHTML;
|
|
@@ -6059,8 +6325,102 @@ function normalizeExcelTableHtml(html) {
|
|
|
6059
6325
|
}
|
|
6060
6326
|
}
|
|
6061
6327
|
|
|
6328
|
+
// src/utils/table-paste-fit.ts
|
|
6329
|
+
var MIN_COL_PX = 24;
|
|
6330
|
+
function toPx(raw, maxWidth) {
|
|
6331
|
+
if (!raw) return null;
|
|
6332
|
+
const m = String(raw).trim().match(/^([\d.]+)\s*(pt|px|%)?$/i);
|
|
6333
|
+
if (!m) return null;
|
|
6334
|
+
const v = parseFloat(m[1]);
|
|
6335
|
+
if (!Number.isFinite(v) || v <= 0) return null;
|
|
6336
|
+
const unit = (m[2] || "px").toLowerCase();
|
|
6337
|
+
if (unit === "pt") return v * (96 / 72);
|
|
6338
|
+
if (unit === "%") return v / 100 * maxWidth;
|
|
6339
|
+
return v;
|
|
6340
|
+
}
|
|
6341
|
+
function elWidthPx(el, maxWidth) {
|
|
6342
|
+
const styleW = el.style?.width;
|
|
6343
|
+
return toPx(styleW, maxWidth) ?? toPx(el.getAttribute("width"), maxWidth);
|
|
6344
|
+
}
|
|
6345
|
+
function readColumnWidths(table, maxWidth) {
|
|
6346
|
+
const colEls = table.querySelector("colgroup")?.querySelectorAll("col");
|
|
6347
|
+
if (colEls && colEls.length > 0) {
|
|
6348
|
+
const widths2 = [];
|
|
6349
|
+
let ok2 = true;
|
|
6350
|
+
colEls.forEach((c) => {
|
|
6351
|
+
const span = parseInt(c.getAttribute("span") || "1", 10) || 1;
|
|
6352
|
+
const w = elWidthPx(c, maxWidth);
|
|
6353
|
+
if (w == null) ok2 = false;
|
|
6354
|
+
for (let i = 0; i < span; i++) widths2.push(w ?? 0);
|
|
6355
|
+
});
|
|
6356
|
+
if (ok2 && widths2.length > 0) return widths2;
|
|
6357
|
+
}
|
|
6358
|
+
const firstRow = table.querySelector("tr");
|
|
6359
|
+
if (!firstRow) return null;
|
|
6360
|
+
const widths = [];
|
|
6361
|
+
let ok = true;
|
|
6362
|
+
Array.from(firstRow.children).forEach((cell) => {
|
|
6363
|
+
if (cell.tagName !== "TD" && cell.tagName !== "TH") return;
|
|
6364
|
+
const span = parseInt(cell.getAttribute("colspan") || "1", 10) || 1;
|
|
6365
|
+
const w = elWidthPx(cell, maxWidth);
|
|
6366
|
+
if (w == null) ok = false;
|
|
6367
|
+
const per = (w ?? 0) / span;
|
|
6368
|
+
for (let i = 0; i < span; i++) widths.push(per);
|
|
6369
|
+
});
|
|
6370
|
+
return ok && widths.length > 0 ? widths : null;
|
|
6371
|
+
}
|
|
6372
|
+
function fitWidths(widths, maxWidth) {
|
|
6373
|
+
const total = widths.reduce((a, b) => a + b, 0);
|
|
6374
|
+
if (total <= 0) return widths;
|
|
6375
|
+
const scale = total > maxWidth ? maxWidth / total : 1;
|
|
6376
|
+
return widths.map((w) => Math.max(MIN_COL_PX, Math.round(w * scale)));
|
|
6377
|
+
}
|
|
6378
|
+
function computeFittedColumnWidthsPerTable(html, maxWidth) {
|
|
6379
|
+
if (!html || typeof DOMParser === "undefined" || !(maxWidth > 0)) return [];
|
|
6380
|
+
let doc;
|
|
6381
|
+
try {
|
|
6382
|
+
doc = new DOMParser().parseFromString(html, "text/html");
|
|
6383
|
+
} catch {
|
|
6384
|
+
return [];
|
|
6385
|
+
}
|
|
6386
|
+
return Array.from(doc.querySelectorAll("table")).map((t) => {
|
|
6387
|
+
const widths = readColumnWidths(t, maxWidth);
|
|
6388
|
+
return widths ? fitWidths(widths, maxWidth) : null;
|
|
6389
|
+
});
|
|
6390
|
+
}
|
|
6391
|
+
function collectTableBlocks(blocks) {
|
|
6392
|
+
const out = [];
|
|
6393
|
+
const walk = (bs) => {
|
|
6394
|
+
for (const b of bs) {
|
|
6395
|
+
if (b?.type === "table") out.push(b);
|
|
6396
|
+
if (b?.children?.length) walk(b.children);
|
|
6397
|
+
}
|
|
6398
|
+
};
|
|
6399
|
+
walk(blocks || []);
|
|
6400
|
+
return out;
|
|
6401
|
+
}
|
|
6402
|
+
function applyFittedWidthsToNewTables(editor, beforeIds, perTable) {
|
|
6403
|
+
if (!editor || perTable.length === 0) return;
|
|
6404
|
+
const newTables = collectTableBlocks(editor.document).filter(
|
|
6405
|
+
(b) => !beforeIds.has(b.id)
|
|
6406
|
+
);
|
|
6407
|
+
newTables.forEach((tb, i) => {
|
|
6408
|
+
const widths = perTable[i];
|
|
6409
|
+
const current = tb?.content?.columnWidths;
|
|
6410
|
+
if (widths && Array.isArray(current) && current.length === widths.length) {
|
|
6411
|
+
try {
|
|
6412
|
+
editor.updateBlock(tb, {
|
|
6413
|
+
type: "table",
|
|
6414
|
+
content: { ...tb.content, columnWidths: widths }
|
|
6415
|
+
});
|
|
6416
|
+
} catch {
|
|
6417
|
+
}
|
|
6418
|
+
}
|
|
6419
|
+
});
|
|
6420
|
+
}
|
|
6421
|
+
|
|
6062
6422
|
// src/components/LumirEditor.tsx
|
|
6063
|
-
import { Fragment as Fragment8, jsx as
|
|
6423
|
+
import { Fragment as Fragment8, jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
6064
6424
|
var DEBUG_LOG = (loc, msg, data) => {
|
|
6065
6425
|
const p = fetch("http://127.0.0.1:7686/ingest/1f8ee1c5-0cf0-4ae7-91ed-5ea7ed17130a", {
|
|
6066
6426
|
method: "POST",
|
|
@@ -6293,7 +6653,7 @@ var findBlockWithLink = (blocks, targetUrl) => {
|
|
|
6293
6653
|
var ConvertToPreviewButton = ({ url }) => {
|
|
6294
6654
|
const editor = useBlockNoteEditor8();
|
|
6295
6655
|
const Components = useComponentsContext7();
|
|
6296
|
-
return /* @__PURE__ */
|
|
6656
|
+
return /* @__PURE__ */ jsx26(
|
|
6297
6657
|
Components.LinkToolbar.Button,
|
|
6298
6658
|
{
|
|
6299
6659
|
className: "bn-button",
|
|
@@ -6313,9 +6673,9 @@ var ConvertToPreviewButton = ({ url }) => {
|
|
|
6313
6673
|
}
|
|
6314
6674
|
},
|
|
6315
6675
|
icon: /* @__PURE__ */ jsxs19("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
6316
|
-
/* @__PURE__ */
|
|
6317
|
-
/* @__PURE__ */
|
|
6318
|
-
/* @__PURE__ */
|
|
6676
|
+
/* @__PURE__ */ jsx26("rect", { x: "1", y: "3", width: "14", height: "10", rx: "2", stroke: "currentColor", strokeWidth: "1.5", fill: "none" }),
|
|
6677
|
+
/* @__PURE__ */ jsx26("line", { x1: "1", y1: "9", x2: "15", y2: "9", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
6678
|
+
/* @__PURE__ */ jsx26("circle", { cx: "5", cy: "6.5", r: "1.5", stroke: "currentColor", strokeWidth: "1", fill: "none" })
|
|
6319
6679
|
] })
|
|
6320
6680
|
}
|
|
6321
6681
|
);
|
|
@@ -6331,10 +6691,10 @@ var CustomLinkToolbar = (props) => {
|
|
|
6331
6691
|
onMouseEnter: props.stopHideTimer,
|
|
6332
6692
|
onMouseLeave: props.startHideTimer,
|
|
6333
6693
|
children: [
|
|
6334
|
-
/* @__PURE__ */
|
|
6335
|
-
/* @__PURE__ */
|
|
6336
|
-
/* @__PURE__ */
|
|
6337
|
-
hasLinkPreview && /* @__PURE__ */
|
|
6694
|
+
/* @__PURE__ */ jsx26(EditLinkButton, { url: props.url, text: props.text, editLink: props.editLink }),
|
|
6695
|
+
/* @__PURE__ */ jsx26(OpenLinkButton, { url: props.url }),
|
|
6696
|
+
/* @__PURE__ */ jsx26(DeleteLinkButton, { deleteLink: props.deleteLink }),
|
|
6697
|
+
hasLinkPreview && /* @__PURE__ */ jsx26(ConvertToPreviewButton, { url: props.url })
|
|
6338
6698
|
]
|
|
6339
6699
|
}
|
|
6340
6700
|
);
|
|
@@ -6417,7 +6777,7 @@ function LumirEditor({
|
|
|
6417
6777
|
allowFileUpload
|
|
6418
6778
|
);
|
|
6419
6779
|
}, [disableExtensions, allowVideoUpload, allowAudioUpload, allowFileUpload]);
|
|
6420
|
-
|
|
6780
|
+
useEffect12(() => {
|
|
6421
6781
|
DEBUG_LOG("LumirEditor:init:disabledExtensions", "snapshot", {
|
|
6422
6782
|
allowVideoUpload,
|
|
6423
6783
|
hasVideoInDisabled: disabledExtensions.includes("video"),
|
|
@@ -6425,7 +6785,7 @@ function LumirEditor({
|
|
|
6425
6785
|
});
|
|
6426
6786
|
}, [allowVideoUpload, disabledExtensions]);
|
|
6427
6787
|
const fileNameTransformRef = useRef12(s3Upload?.fileNameTransform);
|
|
6428
|
-
|
|
6788
|
+
useEffect12(() => {
|
|
6429
6789
|
fileNameTransformRef.current = s3Upload?.fileNameTransform;
|
|
6430
6790
|
}, [s3Upload?.fileNameTransform]);
|
|
6431
6791
|
const memoizedS3Upload = useMemo8(() => {
|
|
@@ -6485,7 +6845,9 @@ function LumirEditor({
|
|
|
6485
6845
|
// tableHandles prop으로 게이트(기존 grip 컨트롤러와 동일 게이트).
|
|
6486
6846
|
RowHeightExtension.configure({ resizable: tableHandles }),
|
|
6487
6847
|
// 표 블록 정렬(좌/가운데/우) attr.
|
|
6488
|
-
TableAlignmentExtension
|
|
6848
|
+
TableAlignmentExtension,
|
|
6849
|
+
// 셀 포커스 시 Ctrl/Cmd+A → 표 전체 선택.
|
|
6850
|
+
TableSelectAllExtension
|
|
6489
6851
|
]
|
|
6490
6852
|
},
|
|
6491
6853
|
placeholders: placeholder ? { default: placeholder, emptyDocument: placeholder } : void 0,
|
|
@@ -6591,7 +6953,14 @@ function LumirEditor({
|
|
|
6591
6953
|
hasFiles: !!event?.clipboardData?.files?.length
|
|
6592
6954
|
});
|
|
6593
6955
|
event.preventDefault();
|
|
6956
|
+
const pmDom = editor2.prosemirrorView?.dom;
|
|
6957
|
+
const maxWidth = pmDom?.clientWidth ? pmDom.clientWidth - 8 : 0;
|
|
6958
|
+
const fittedWidths = computeFittedColumnWidthsPerTable(pastedHtml, maxWidth);
|
|
6959
|
+
const beforeTableIds = new Set(
|
|
6960
|
+
collectTableBlocks(editor2.document).map((b) => b.id)
|
|
6961
|
+
);
|
|
6594
6962
|
editor2.pasteHTML(normalizeExcelTableHtml(pastedHtml));
|
|
6963
|
+
applyFittedWidthsToNewTables(editor2, beforeTableIds, fittedWidths);
|
|
6595
6964
|
return true;
|
|
6596
6965
|
}
|
|
6597
6966
|
const fileList = event?.clipboardData?.files ?? null;
|
|
@@ -6679,12 +7048,12 @@ function LumirEditor({
|
|
|
6679
7048
|
} catch {
|
|
6680
7049
|
}
|
|
6681
7050
|
}
|
|
6682
|
-
|
|
7051
|
+
useEffect12(() => {
|
|
6683
7052
|
if (editor) {
|
|
6684
7053
|
editor.isEditable = editable;
|
|
6685
7054
|
}
|
|
6686
7055
|
}, [editor, editable]);
|
|
6687
|
-
|
|
7056
|
+
useEffect12(() => {
|
|
6688
7057
|
if (!editor) return;
|
|
6689
7058
|
const th = editor.tableHandles;
|
|
6690
7059
|
if (!th || th.__lumirColDelPatched || typeof th.removeRowOrColumn !== "function")
|
|
@@ -6696,7 +7065,7 @@ function LumirEditor({
|
|
|
6696
7065
|
};
|
|
6697
7066
|
th.__lumirColDelPatched = true;
|
|
6698
7067
|
}, [editor]);
|
|
6699
|
-
|
|
7068
|
+
useEffect12(() => {
|
|
6700
7069
|
if (!editor || !floatingMenu) return;
|
|
6701
7070
|
const ft = editor.formattingToolbar;
|
|
6702
7071
|
if (!ft?.onUpdate) return;
|
|
@@ -6709,7 +7078,7 @@ function LumirEditor({
|
|
|
6709
7078
|
});
|
|
6710
7079
|
return unsubscribe;
|
|
6711
7080
|
}, [editor, floatingMenu]);
|
|
6712
|
-
|
|
7081
|
+
useEffect12(() => {
|
|
6713
7082
|
if (!editor || !onContentChange) return;
|
|
6714
7083
|
const handleContentChange = () => {
|
|
6715
7084
|
const blocks = editor.topLevelBlocks;
|
|
@@ -6727,12 +7096,12 @@ function LumirEditor({
|
|
|
6727
7096
|
return editor.onEditorContentChange(handleContentChange);
|
|
6728
7097
|
}, [editor, onContentChange]);
|
|
6729
7098
|
const previousMediaUrlsRef = useRef12(/* @__PURE__ */ new Set());
|
|
6730
|
-
|
|
7099
|
+
useEffect12(() => {
|
|
6731
7100
|
if (!editor) return;
|
|
6732
7101
|
const initialBlocks = editor.topLevelBlocks;
|
|
6733
7102
|
previousMediaUrlsRef.current = extractMediaUrls(initialBlocks);
|
|
6734
7103
|
}, [editor]);
|
|
6735
|
-
|
|
7104
|
+
useEffect12(() => {
|
|
6736
7105
|
if (!editor || !onImageDelete) return;
|
|
6737
7106
|
const handleMediaDeleteCheck = () => {
|
|
6738
7107
|
const currentBlocks = editor.topLevelBlocks;
|
|
@@ -6746,7 +7115,7 @@ function LumirEditor({
|
|
|
6746
7115
|
};
|
|
6747
7116
|
return editor.onEditorContentChange(handleMediaDeleteCheck);
|
|
6748
7117
|
}, [editor, onImageDelete]);
|
|
6749
|
-
|
|
7118
|
+
useEffect12(() => {
|
|
6750
7119
|
const el = editor?.domElement;
|
|
6751
7120
|
if (!el) return;
|
|
6752
7121
|
const handleDragOver = (e) => {
|
|
@@ -6881,7 +7250,7 @@ function LumirEditor({
|
|
|
6881
7250
|
return sideMenuAddButton ? sideMenu : false;
|
|
6882
7251
|
}, [sideMenuAddButton, sideMenu]);
|
|
6883
7252
|
const DragHandleOnlySideMenu = useMemo8(() => {
|
|
6884
|
-
return (props) => /* @__PURE__ */
|
|
7253
|
+
return (props) => /* @__PURE__ */ jsx26(BlockSideMenu, { ...props, children: /* @__PURE__ */ jsx26(DragHandleButton, { ...props, dragHandleMenu: LumirDragHandleMenu }) });
|
|
6885
7254
|
}, []);
|
|
6886
7255
|
return /* @__PURE__ */ jsxs19(
|
|
6887
7256
|
"div",
|
|
@@ -6894,7 +7263,7 @@ function LumirEditor({
|
|
|
6894
7263
|
style: { position: "relative", display: "flex", flexDirection: "column" },
|
|
6895
7264
|
children: [
|
|
6896
7265
|
floatingMenu && editor && /* @__PURE__ */ jsxs19(Fragment8, { children: [
|
|
6897
|
-
/* @__PURE__ */
|
|
7266
|
+
/* @__PURE__ */ jsx26(
|
|
6898
7267
|
"input",
|
|
6899
7268
|
{
|
|
6900
7269
|
ref: floatingMenuFileInputRef,
|
|
@@ -6965,7 +7334,7 @@ function LumirEditor({
|
|
|
6965
7334
|
}
|
|
6966
7335
|
}
|
|
6967
7336
|
),
|
|
6968
|
-
/* @__PURE__ */
|
|
7337
|
+
/* @__PURE__ */ jsx26(
|
|
6969
7338
|
FloatingMenu,
|
|
6970
7339
|
{
|
|
6971
7340
|
editor,
|
|
@@ -7012,15 +7381,15 @@ function LumirEditor({
|
|
|
7012
7381
|
tableHandles: false,
|
|
7013
7382
|
onSelectionChange,
|
|
7014
7383
|
children: [
|
|
7015
|
-
tableHandles && /* @__PURE__ */
|
|
7016
|
-
formattingToolbar && /* @__PURE__ */
|
|
7384
|
+
tableHandles && /* @__PURE__ */ jsx26(LumirTableHandlesController, {}),
|
|
7385
|
+
formattingToolbar && /* @__PURE__ */ jsx26(
|
|
7017
7386
|
FormattingToolbarController,
|
|
7018
7387
|
{
|
|
7019
7388
|
formattingToolbar: CustomFormattingToolbar
|
|
7020
7389
|
}
|
|
7021
7390
|
),
|
|
7022
|
-
linkToolbar && (linkPreview?.apiEndpoint ? /* @__PURE__ */
|
|
7023
|
-
/* @__PURE__ */
|
|
7391
|
+
linkToolbar && (linkPreview?.apiEndpoint ? /* @__PURE__ */ jsx26(LinkToolbarController, { linkToolbar: CustomLinkToolbar }) : /* @__PURE__ */ jsx26(LinkToolbarController, {})),
|
|
7392
|
+
/* @__PURE__ */ jsx26(
|
|
7024
7393
|
SuggestionMenuController,
|
|
7025
7394
|
{
|
|
7026
7395
|
triggerCharacter: "/",
|
|
@@ -7080,40 +7449,59 @@ function LumirEditor({
|
|
|
7080
7449
|
strokeLinecap: "round",
|
|
7081
7450
|
strokeLinejoin: "round",
|
|
7082
7451
|
children: [
|
|
7083
|
-
/* @__PURE__ */
|
|
7084
|
-
/* @__PURE__ */
|
|
7452
|
+
/* @__PURE__ */ jsx26("polyline", { points: "16 18 22 12 16 6" }),
|
|
7453
|
+
/* @__PURE__ */ jsx26("polyline", { points: "8 6 2 12 8 18" })
|
|
7085
7454
|
]
|
|
7086
7455
|
}
|
|
7087
7456
|
),
|
|
7088
7457
|
subtext: "HTML \uD30C\uC77C\uC744 \uBBF8\uB9AC\uBCF4\uAE30\uB85C \uC0BD\uC785"
|
|
7089
7458
|
};
|
|
7459
|
+
const columnIcon = (withDivider) => /* @__PURE__ */ jsxs19(
|
|
7460
|
+
"svg",
|
|
7461
|
+
{
|
|
7462
|
+
width: "18",
|
|
7463
|
+
height: "18",
|
|
7464
|
+
viewBox: "0 0 24 24",
|
|
7465
|
+
fill: "none",
|
|
7466
|
+
stroke: "currentColor",
|
|
7467
|
+
strokeWidth: "2",
|
|
7468
|
+
strokeLinecap: "round",
|
|
7469
|
+
strokeLinejoin: "round",
|
|
7470
|
+
children: [
|
|
7471
|
+
/* @__PURE__ */ jsx26("rect", { x: "3", y: "4", width: "7", height: "16", rx: "1" }),
|
|
7472
|
+
/* @__PURE__ */ jsx26("rect", { x: "14", y: "4", width: "7", height: "16", rx: "1" }),
|
|
7473
|
+
withDivider && /* @__PURE__ */ jsx26("line", { x1: "12", y1: "3", x2: "12", y2: "21", strokeDasharray: "2 2" })
|
|
7474
|
+
]
|
|
7475
|
+
}
|
|
7476
|
+
);
|
|
7090
7477
|
const columnItem = {
|
|
7091
7478
|
title: "2\uB2E8 \uCEEC\uB7FC",
|
|
7092
|
-
onItemClick: () =>
|
|
7093
|
-
insertTwoColumns(editor);
|
|
7094
|
-
},
|
|
7479
|
+
onItemClick: () => insertTwoColumns(editor, false),
|
|
7095
7480
|
aliases: ["columns", "column", "2col", "\uB2E8", "\uCEEC\uB7FC", "\uB2E4\uB2E8", "\uBD84\uD560"],
|
|
7096
7481
|
group: "Basic blocks",
|
|
7097
|
-
icon:
|
|
7098
|
-
"svg",
|
|
7099
|
-
{
|
|
7100
|
-
width: "18",
|
|
7101
|
-
height: "18",
|
|
7102
|
-
viewBox: "0 0 24 24",
|
|
7103
|
-
fill: "none",
|
|
7104
|
-
stroke: "currentColor",
|
|
7105
|
-
strokeWidth: "2",
|
|
7106
|
-
strokeLinecap: "round",
|
|
7107
|
-
strokeLinejoin: "round",
|
|
7108
|
-
children: [
|
|
7109
|
-
/* @__PURE__ */ jsx27("rect", { x: "3", y: "4", width: "7", height: "16", rx: "1" }),
|
|
7110
|
-
/* @__PURE__ */ jsx27("rect", { x: "14", y: "4", width: "7", height: "16", rx: "1" })
|
|
7111
|
-
]
|
|
7112
|
-
}
|
|
7113
|
-
),
|
|
7482
|
+
icon: columnIcon(false),
|
|
7114
7483
|
subtext: "\uBE14\uB85D\uC744 \uC88C\uC6B0 2\uB2E8\uC73C\uB85C \uBC30\uCE58"
|
|
7115
7484
|
};
|
|
7116
|
-
const
|
|
7485
|
+
const columnDividerItem = {
|
|
7486
|
+
title: "2\uB2E8 \uCEEC\uB7FC (\uAD6C\uBD84\uC120)",
|
|
7487
|
+
onItemClick: () => insertTwoColumns(editor, true),
|
|
7488
|
+
aliases: [
|
|
7489
|
+
"columns divider",
|
|
7490
|
+
"\uAD6C\uBD84\uC120",
|
|
7491
|
+
"\uCEEC\uB7FC \uAD6C\uBD84\uC120",
|
|
7492
|
+
"2\uB2E8 \uAD6C\uBD84\uC120",
|
|
7493
|
+
"divider"
|
|
7494
|
+
],
|
|
7495
|
+
group: "Basic blocks",
|
|
7496
|
+
icon: columnIcon(true),
|
|
7497
|
+
subtext: "\uAC00\uC6B4\uB370 \uC138\uB85C \uAD6C\uBD84\uC120\uC774 \uC788\uB294 2\uB2E8 \uCEEC\uB7FC"
|
|
7498
|
+
};
|
|
7499
|
+
const allItems = [
|
|
7500
|
+
...filtered,
|
|
7501
|
+
htmlPreviewItem,
|
|
7502
|
+
columnItem,
|
|
7503
|
+
columnDividerItem
|
|
7504
|
+
];
|
|
7117
7505
|
if (linkPreview?.apiEndpoint) {
|
|
7118
7506
|
allItems.push({
|
|
7119
7507
|
title: "Link Preview",
|
|
@@ -7144,8 +7532,8 @@ function LumirEditor({
|
|
|
7144
7532
|
strokeLinecap: "round",
|
|
7145
7533
|
strokeLinejoin: "round",
|
|
7146
7534
|
children: [
|
|
7147
|
-
/* @__PURE__ */
|
|
7148
|
-
/* @__PURE__ */
|
|
7535
|
+
/* @__PURE__ */ jsx26("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
|
|
7536
|
+
/* @__PURE__ */ jsx26("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
|
|
7149
7537
|
]
|
|
7150
7538
|
}
|
|
7151
7539
|
),
|
|
@@ -7181,21 +7569,21 @@ function LumirEditor({
|
|
|
7181
7569
|
)
|
|
7182
7570
|
}
|
|
7183
7571
|
),
|
|
7184
|
-
!sideMenuAddButton && /* @__PURE__ */
|
|
7572
|
+
!sideMenuAddButton && /* @__PURE__ */ jsx26(SideMenuController, { sideMenu: DragHandleOnlySideMenu })
|
|
7185
7573
|
]
|
|
7186
7574
|
}
|
|
7187
7575
|
),
|
|
7188
7576
|
isUploading && /* @__PURE__ */ jsxs19("div", { className: "lumirEditor-upload-overlay", children: [
|
|
7189
|
-
/* @__PURE__ */
|
|
7577
|
+
/* @__PURE__ */ jsx26("div", { className: "lumirEditor-spinner" }),
|
|
7190
7578
|
uploadProgress !== null && /* @__PURE__ */ jsxs19("span", { className: "lumirEditor-upload-progress", children: [
|
|
7191
7579
|
uploadProgress,
|
|
7192
7580
|
"%"
|
|
7193
7581
|
] })
|
|
7194
7582
|
] }),
|
|
7195
7583
|
errorMessage && /* @__PURE__ */ jsxs19("div", { className: "lumirEditor-error-toast", children: [
|
|
7196
|
-
/* @__PURE__ */
|
|
7197
|
-
/* @__PURE__ */
|
|
7198
|
-
/* @__PURE__ */
|
|
7584
|
+
/* @__PURE__ */ jsx26("span", { className: "lumirEditor-error-icon", children: "\u26A0\uFE0F" }),
|
|
7585
|
+
/* @__PURE__ */ jsx26("span", { className: "lumirEditor-error-message", children: errorMessage }),
|
|
7586
|
+
/* @__PURE__ */ jsx26(
|
|
7199
7587
|
"button",
|
|
7200
7588
|
{
|
|
7201
7589
|
className: "lumirEditor-error-close",
|
|
@@ -7213,7 +7601,11 @@ export {
|
|
|
7213
7601
|
BACKGROUND_COLORS,
|
|
7214
7602
|
ContentUtils,
|
|
7215
7603
|
EditorConfig,
|
|
7604
|
+
FONT_SIZE_DEFAULT_PX,
|
|
7605
|
+
FONT_SIZE_MAX,
|
|
7606
|
+
FONT_SIZE_MIN,
|
|
7216
7607
|
FONT_SIZE_PRESETS,
|
|
7608
|
+
FONT_SIZE_STEP,
|
|
7217
7609
|
FloatingMenu,
|
|
7218
7610
|
FontSize,
|
|
7219
7611
|
FontSizeButton2 as FontSizeButton,
|
|
@@ -7223,12 +7615,15 @@ export {
|
|
|
7223
7615
|
LumirEditor,
|
|
7224
7616
|
LumirEditorError,
|
|
7225
7617
|
TEXT_COLORS,
|
|
7618
|
+
clampFontSizePx,
|
|
7226
7619
|
clearMetadataCache,
|
|
7227
7620
|
cn,
|
|
7228
7621
|
createS3Uploader,
|
|
7229
7622
|
fetchLinkMetadata,
|
|
7230
7623
|
getHexFromColorValue,
|
|
7231
7624
|
liftFontSize,
|
|
7232
|
-
lowerFontSize
|
|
7625
|
+
lowerFontSize,
|
|
7626
|
+
parseFontSizePx,
|
|
7627
|
+
toFontSizeValue
|
|
7233
7628
|
};
|
|
7234
7629
|
//# sourceMappingURL=index.mjs.map
|