@haklex/rich-renderer-katex 0.0.79 → 0.0.81

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.
Files changed (3) hide show
  1. package/dist/index.mjs +497 -531
  2. package/dist/rich-renderer-katex.css +2 -1
  3. package/package.json +4 -4
package/dist/index.mjs CHANGED
@@ -1,12 +1,48 @@
1
- import { $isKaTeXInlineNode, $isKaTeXBlockNode, KaTeXBlockNode, KaTeXInlineNode } from "@haklex/rich-editor/nodes";
1
+ import { $isKaTeXBlockNode, $isKaTeXInlineNode, KaTeXBlockNode, KaTeXInlineNode } from "@haklex/rich-editor/nodes";
2
2
  import { KaTeXRenderer, createRendererDecoration } from "@haklex/rich-editor/renderers";
3
- import { useState, useRef, useCallback, useEffect, useMemo, createElement } from "react";
4
- import { jsxs, jsx } from "react/jsx-runtime";
5
- import { Popover, PopoverTrigger, PopoverPanel, AnimatedTabs, ActionButton, ActionBar } from "@haklex/rich-editor-ui";
3
+ import { createElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
4
+ import { ActionBar, ActionButton, AnimatedTabs, Popover, PopoverPanel, PopoverTrigger } from "@haklex/rich-editor-ui";
6
5
  import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
7
6
  import { $getNodeByKey } from "lexical";
8
- import { Terminal, Trash2, Check, Copy, RotateCcw, Search } from "lucide-react";
9
- var semanticClassNames = { editWrapper: "rich-katex-edit-wrapper", panel: "rich-katex-editor-panel", header: "rich-katex-editor-header", headerLeft: "rich-katex-editor-header-left", iconWrap: "rich-katex-editor-icon-wrap", title: "rich-katex-editor-title", headerRight: "rich-katex-editor-header-right", mode: "rich-katex-editor-mode", deleteButton: "rich-katex-editor-delete", tabs: "rich-katex-editor-tabs", bodyScrollArea: "rich-katex-editor-body-scroll-area", body: "rich-katex-editor-body", field: "rich-katex-editor-field", label: "rich-katex-editor-label", inputWrap: "rich-katex-editor-input-wrap", textarea: "rich-katex-editor-textarea", inputActions: "rich-katex-editor-input-actions", preview: "rich-katex-editor-preview", previewEmpty: "rich-katex-editor-preview-empty", snippetSearchWrap: "rich-katex-editor-snippet-search-wrap", snippetSearchIcon: "rich-katex-editor-snippet-search-icon", snippetSearchInput: "rich-katex-editor-snippet-search-input", snippetGroups: "rich-katex-editor-snippet-groups", snippetGroup: "rich-katex-editor-snippet-group", snippetGroupLabel: "rich-katex-editor-snippet-group-label", snippetList: "rich-katex-editor-snippet-list", snippetButton: "rich-katex-editor-snippet-button", snippetMeta: "rich-katex-editor-snippet-meta", snippetName: "rich-katex-editor-snippet-name", snippetHint: "rich-katex-editor-snippet-hint", snippetPreview: "rich-katex-editor-snippet-preview", snippetsPlaceholder: "rich-katex-editor-snippets-placeholder", footer: "rich-katex-editor-footer", charCount: "rich-katex-editor-charcount" };
7
+ import { Check, Copy, RotateCcw, Search, Terminal, Trash2 } from "lucide-react";
8
+ import { jsx, jsxs } from "react/jsx-runtime";
9
+ //#region src/styles.css.ts
10
+ var semanticClassNames = {
11
+ editWrapper: "rich-katex-edit-wrapper",
12
+ panel: "rich-katex-editor-panel",
13
+ header: "rich-katex-editor-header",
14
+ headerLeft: "rich-katex-editor-header-left",
15
+ iconWrap: "rich-katex-editor-icon-wrap",
16
+ title: "rich-katex-editor-title",
17
+ headerRight: "rich-katex-editor-header-right",
18
+ mode: "rich-katex-editor-mode",
19
+ deleteButton: "rich-katex-editor-delete",
20
+ tabs: "rich-katex-editor-tabs",
21
+ bodyScrollArea: "rich-katex-editor-body-scroll-area",
22
+ body: "rich-katex-editor-body",
23
+ field: "rich-katex-editor-field",
24
+ label: "rich-katex-editor-label",
25
+ inputWrap: "rich-katex-editor-input-wrap",
26
+ textarea: "rich-katex-editor-textarea",
27
+ inputActions: "rich-katex-editor-input-actions",
28
+ preview: "rich-katex-editor-preview",
29
+ previewEmpty: "rich-katex-editor-preview-empty",
30
+ snippetSearchWrap: "rich-katex-editor-snippet-search-wrap",
31
+ snippetSearchIcon: "rich-katex-editor-snippet-search-icon",
32
+ snippetSearchInput: "rich-katex-editor-snippet-search-input",
33
+ snippetGroups: "rich-katex-editor-snippet-groups",
34
+ snippetGroup: "rich-katex-editor-snippet-group",
35
+ snippetGroupLabel: "rich-katex-editor-snippet-group-label",
36
+ snippetList: "rich-katex-editor-snippet-list",
37
+ snippetButton: "rich-katex-editor-snippet-button",
38
+ snippetMeta: "rich-katex-editor-snippet-meta",
39
+ snippetName: "rich-katex-editor-snippet-name",
40
+ snippetHint: "rich-katex-editor-snippet-hint",
41
+ snippetPreview: "rich-katex-editor-snippet-preview",
42
+ snippetsPlaceholder: "rich-katex-editor-snippets-placeholder",
43
+ footer: "rich-katex-editor-footer",
44
+ charCount: "rich-katex-editor-charcount"
45
+ };
10
46
  var editWrapper = "mkenhu0";
11
47
  var panel = "mkenhu1";
12
48
  var header = "mkenhu2";
@@ -18,537 +54,467 @@ var mode = "mkenhu7";
18
54
  var deleteButton = "mkenhu8";
19
55
  var tabs = "mkenhu9";
20
56
  var bodyScrollArea = "mkenhua";
21
- var body = "mkenhub";
22
- var field = "mkenhuc";
23
- var label = "mkenhud";
24
- var inputWrap = "mkenhue";
25
- var textarea = "mkenhuf";
26
- var inputActions = "mkenhug";
27
- var preview = "mkenhuh";
28
- var previewEmpty = "mkenhui";
29
- var snippetSearchWrap = "mkenhuj";
30
- var snippetSearchIcon = "mkenhuk";
31
- var snippetSearchInput = "mkenhul";
32
- var snippetGroups = "mkenhum";
33
- var snippetGroup = "mkenhun";
34
- var snippetGroupLabel = "mkenhuo";
35
- var snippetList = "mkenhup";
36
- var snippetButton = "mkenhuq";
37
- var snippetMeta = "mkenhur";
38
- var snippetName = "mkenhus";
39
- var snippetHint = "mkenhut";
40
- var snippetPreview = "mkenhuu";
41
- var snippetsPlaceholder = "mkenhuv";
42
57
  var footer = "mkenhuw";
43
58
  var charCount = "mkenhux";
44
- const CURSOR_TOKEN = "__cursor__";
45
- const katexSnippets = [
46
- {
47
- id: "frac",
48
- title: "Fraction",
49
- template: `\\frac{1}{${CURSOR_TOKEN}}`,
50
- previewEquation: "\\frac{a}{b}",
51
- category: "Basic",
52
- keywords: ["fraction", "divide", "ratio"]
53
- },
54
- {
55
- id: "sqrt",
56
- title: "Square Root",
57
- template: `\\sqrt{${CURSOR_TOKEN}}`,
58
- previewEquation: "\\sqrt{x}",
59
- category: "Basic",
60
- keywords: ["root", "radical"]
61
- },
62
- {
63
- id: "alpha",
64
- title: "Alpha",
65
- template: `\\alpha${CURSOR_TOKEN}`,
66
- previewEquation: "\\alpha",
67
- category: "Greek",
68
- keywords: ["greek", "letter"]
69
- },
70
- {
71
- id: "theta",
72
- title: "Theta",
73
- template: `\\theta${CURSOR_TOKEN}`,
74
- previewEquation: "\\theta",
75
- category: "Greek",
76
- keywords: ["greek", "angle", "letter"]
77
- },
78
- {
79
- id: "sum",
80
- title: "Summation",
81
- template: `\\sum_{i=1}^{n} ${CURSOR_TOKEN}`,
82
- previewEquation: "\\sum_{i=1}^{n} x_i",
83
- category: "Operators",
84
- keywords: ["series", "sigma", "total"]
85
- },
86
- {
87
- id: "int",
88
- title: "Integral",
89
- template: `\\int_{a}^{b} ${CURSOR_TOKEN} \\, dx`,
90
- previewEquation: "\\int_{a}^{b} f(x) \\, dx",
91
- category: "Operators",
92
- keywords: ["integral", "calculus"]
93
- },
94
- {
95
- id: "matrix",
96
- title: "Matrix",
97
- template: `\\begin{bmatrix}${CURSOR_TOKEN}\\end{bmatrix}`,
98
- previewEquation: "\\begin{bmatrix} a & b \\\\ c & d \\end{bmatrix}",
99
- category: "Structures",
100
- keywords: ["array", "linear algebra"]
101
- },
102
- {
103
- id: "cases",
104
- title: "Cases",
105
- template: `\\begin{cases}${CURSOR_TOKEN}\\end{cases}`,
106
- previewEquation: "\\begin{cases} x & x > 0 \\\\ 0 & x = 0 \\end{cases}",
107
- category: "Structures",
108
- keywords: ["piecewise", "conditional"]
109
- }
59
+ //#endregion
60
+ //#region src/snippets.ts
61
+ var CURSOR_TOKEN = "__cursor__";
62
+ var katexSnippets = [
63
+ {
64
+ id: "frac",
65
+ title: "Fraction",
66
+ template: `\\frac{1}{${CURSOR_TOKEN}}`,
67
+ previewEquation: "\\frac{a}{b}",
68
+ category: "Basic",
69
+ keywords: [
70
+ "fraction",
71
+ "divide",
72
+ "ratio"
73
+ ]
74
+ },
75
+ {
76
+ id: "sqrt",
77
+ title: "Square Root",
78
+ template: `\\sqrt{${CURSOR_TOKEN}}`,
79
+ previewEquation: "\\sqrt{x}",
80
+ category: "Basic",
81
+ keywords: ["root", "radical"]
82
+ },
83
+ {
84
+ id: "alpha",
85
+ title: "Alpha",
86
+ template: `\\alpha${CURSOR_TOKEN}`,
87
+ previewEquation: "\\alpha",
88
+ category: "Greek",
89
+ keywords: ["greek", "letter"]
90
+ },
91
+ {
92
+ id: "theta",
93
+ title: "Theta",
94
+ template: `\\theta${CURSOR_TOKEN}`,
95
+ previewEquation: "\\theta",
96
+ category: "Greek",
97
+ keywords: [
98
+ "greek",
99
+ "angle",
100
+ "letter"
101
+ ]
102
+ },
103
+ {
104
+ id: "sum",
105
+ title: "Summation",
106
+ template: `\\sum_{i=1}^{n} ${CURSOR_TOKEN}`,
107
+ previewEquation: "\\sum_{i=1}^{n} x_i",
108
+ category: "Operators",
109
+ keywords: [
110
+ "series",
111
+ "sigma",
112
+ "total"
113
+ ]
114
+ },
115
+ {
116
+ id: "int",
117
+ title: "Integral",
118
+ template: `\\int_{a}^{b} ${CURSOR_TOKEN} \\, dx`,
119
+ previewEquation: "\\int_{a}^{b} f(x) \\, dx",
120
+ category: "Operators",
121
+ keywords: ["integral", "calculus"]
122
+ },
123
+ {
124
+ id: "matrix",
125
+ title: "Matrix",
126
+ template: `\\begin{bmatrix}${CURSOR_TOKEN}\\end{bmatrix}`,
127
+ previewEquation: "\\begin{bmatrix} a & b \\\\ c & d \\end{bmatrix}",
128
+ category: "Structures",
129
+ keywords: ["array", "linear algebra"]
130
+ },
131
+ {
132
+ id: "cases",
133
+ title: "Cases",
134
+ template: `\\begin{cases}${CURSOR_TOKEN}\\end{cases}`,
135
+ previewEquation: "\\begin{cases} x & x > 0 \\\\ 0 & x = 0 \\end{cases}",
136
+ category: "Structures",
137
+ keywords: ["piecewise", "conditional"]
138
+ }
110
139
  ];
111
140
  function filterKaTeXSnippets(query) {
112
- const normalizedQuery = query.trim().toLowerCase();
113
- if (!normalizedQuery) {
114
- return katexSnippets;
115
- }
116
- return katexSnippets.filter((snippet) => {
117
- const haystack = [
118
- snippet.id,
119
- snippet.title,
120
- snippet.category,
121
- snippet.previewEquation,
122
- ...snippet.keywords
123
- ].join(" ").toLowerCase();
124
- return haystack.includes(normalizedQuery);
125
- });
141
+ const normalizedQuery = query.trim().toLowerCase();
142
+ if (!normalizedQuery) return katexSnippets;
143
+ return katexSnippets.filter((snippet) => {
144
+ return [
145
+ snippet.id,
146
+ snippet.title,
147
+ snippet.category,
148
+ snippet.previewEquation,
149
+ ...snippet.keywords
150
+ ].join(" ").toLowerCase().includes(normalizedQuery);
151
+ });
126
152
  }
127
153
  function insertSnippetAtSelection(value, template, selectionStart, selectionEnd) {
128
- const start = selectionStart ?? value.length;
129
- const end = selectionEnd ?? start;
130
- const cursorOffset = template.indexOf(CURSOR_TOKEN);
131
- const sanitizedTemplate = template.replace(CURSOR_TOKEN, "");
132
- const nextValue = value.slice(0, start) + sanitizedTemplate + value.slice(Math.max(start, end));
133
- const nextCursorPosition = start + (cursorOffset >= 0 ? cursorOffset : sanitizedTemplate.length);
134
- return {
135
- value: nextValue,
136
- selectionStart: nextCursorPosition,
137
- selectionEnd: nextCursorPosition
138
- };
139
- }
140
- const SNIPPET_CATEGORY_ORDER = ["Basic", "Greek", "Operators", "Structures"];
141
- function KaTeXEditDecorator({
142
- nodeKey,
143
- equation,
144
- displayMode,
145
- children
146
- }) {
147
- const [editor] = useLexicalComposerContext();
148
- const editable = editor.isEditable();
149
- const [open, setOpen] = useState(false);
150
- const [value, setValue] = useState(equation);
151
- const [copied, setCopied] = useState(false);
152
- const [activeTab, setActiveTab] = useState("editor");
153
- const [snippetQuery, setSnippetQuery] = useState("");
154
- const inputRef = useRef(null);
155
- const selectionRef = useRef({
156
- start: null,
157
- end: null
158
- });
159
- const syncSelection = useCallback((target) => {
160
- if (!target) return;
161
- selectionRef.current = {
162
- start: target.selectionStart,
163
- end: target.selectionEnd
164
- };
165
- }, []);
166
- useEffect(() => {
167
- setValue(equation);
168
- }, [equation]);
169
- useEffect(() => {
170
- if (open && inputRef.current) {
171
- inputRef.current.focus();
172
- inputRef.current.select();
173
- syncSelection(inputRef.current);
174
- }
175
- }, [open, syncSelection]);
176
- const commit = useCallback(() => {
177
- const trimmed = value.trim();
178
- if (!trimmed) return;
179
- editor.update(() => {
180
- const node = $getNodeByKey(nodeKey);
181
- if ($isKaTeXInlineNode(node) && node.getEquation() !== trimmed) {
182
- node.setEquation(trimmed);
183
- } else if ($isKaTeXBlockNode(node) && node.getEquation() !== trimmed) {
184
- node.setEquation(trimmed);
185
- }
186
- });
187
- setOpen(false);
188
- }, [editor, nodeKey, value]);
189
- const cancel = useCallback(() => {
190
- setValue(equation);
191
- setOpen(false);
192
- }, [equation]);
193
- const handleDelete = useCallback(() => {
194
- editor.update(() => {
195
- const node = $getNodeByKey(nodeKey);
196
- if (node) node.remove();
197
- });
198
- }, [editor, nodeKey]);
199
- const handleCopy = useCallback(() => {
200
- navigator.clipboard.writeText(value);
201
- setCopied(true);
202
- setTimeout(setCopied, 2e3, false);
203
- }, [value]);
204
- const handleReset = useCallback(() => {
205
- setValue(equation);
206
- inputRef.current?.focus();
207
- }, [equation]);
208
- const handleInsertSnippet = useCallback(
209
- (template) => {
210
- const next = insertSnippetAtSelection(
211
- value,
212
- template,
213
- selectionRef.current.start,
214
- selectionRef.current.end
215
- );
216
- setValue(next.value);
217
- setActiveTab("editor");
218
- requestAnimationFrame(() => {
219
- const input = inputRef.current;
220
- if (!input) return;
221
- input.focus();
222
- input.setSelectionRange(next.selectionStart, next.selectionEnd);
223
- selectionRef.current = {
224
- start: next.selectionStart,
225
- end: next.selectionEnd
226
- };
227
- });
228
- },
229
- [value]
230
- );
231
- const filteredSnippets = useMemo(() => filterKaTeXSnippets(snippetQuery), [snippetQuery]);
232
- const groupedSnippets = useMemo(
233
- () => SNIPPET_CATEGORY_ORDER.map((category) => ({
234
- category,
235
- items: filteredSnippets.filter((snippet) => snippet.category === category)
236
- })).filter((group) => group.items.length > 0),
237
- [filteredSnippets]
238
- );
239
- const handleKeyDown = useCallback(
240
- (e) => {
241
- if (e.key === "Escape") {
242
- e.preventDefault();
243
- cancel();
244
- } else if (displayMode && e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
245
- e.preventDefault();
246
- commit();
247
- } else if (!displayMode && e.key === "Enter" && !e.shiftKey) {
248
- e.preventDefault();
249
- commit();
250
- }
251
- },
252
- [commit, cancel, displayMode]
253
- );
254
- if (!editable) {
255
- return children;
256
- }
257
- return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
258
- /* @__PURE__ */ jsx(
259
- PopoverTrigger,
260
- {
261
- nativeButton: false,
262
- render: /* @__PURE__ */ jsx(
263
- "span",
264
- {
265
- className: `${editWrapper} ${semanticClassNames.editWrapper}`,
266
- title: "Click to edit"
267
- }
268
- ),
269
- children
270
- }
271
- ),
272
- /* @__PURE__ */ jsxs(
273
- PopoverPanel,
274
- {
275
- className: `${panel} ${semanticClassNames.panel}`,
276
- side: "bottom",
277
- sideOffset: 8,
278
- children: [
279
- /* @__PURE__ */ jsxs("div", { className: `${header} ${semanticClassNames.header}`, children: [
280
- /* @__PURE__ */ jsxs("div", { className: `${headerLeft} ${semanticClassNames.headerLeft}`, children: [
281
- /* @__PURE__ */ jsx("div", { className: `${iconWrap} ${semanticClassNames.iconWrap}`, children: /* @__PURE__ */ jsx(Terminal, { size: 12 }) }),
282
- /* @__PURE__ */ jsx("span", { className: `${title} ${semanticClassNames.title}`, children: "Math Editor" })
283
- ] }),
284
- /* @__PURE__ */ jsxs("div", { className: `${headerRight} ${semanticClassNames.headerRight}`, children: [
285
- /* @__PURE__ */ jsx("span", { className: `${mode} ${semanticClassNames.mode}`, children: displayMode ? "Block" : "Inline" }),
286
- /* @__PURE__ */ jsx(
287
- "button",
288
- {
289
- className: `${deleteButton} ${semanticClassNames.deleteButton}`,
290
- title: "Delete node",
291
- type: "button",
292
- onClick: handleDelete,
293
- children: /* @__PURE__ */ jsx(Trash2, { size: 14 })
294
- }
295
- )
296
- ] })
297
- ] }),
298
- /* @__PURE__ */ jsx(
299
- AnimatedTabs,
300
- {
301
- className: `${tabs} ${semanticClassNames.tabs}`,
302
- value: activeTab,
303
- tabs: [
304
- { id: "editor", label: "Editor" },
305
- { id: "snippets", label: "Snippets" }
306
- ],
307
- onChange: (id) => setActiveTab(id)
308
- }
309
- ),
310
- /* @__PURE__ */ jsxs("div", { className: `${bodyScrollArea} ${semanticClassNames.bodyScrollArea}`, children: [
311
- activeTab === "editor" && /* @__PURE__ */ jsxs("div", { className: `${body} ${semanticClassNames.body}`, children: [
312
- /* @__PURE__ */ jsxs("div", { className: `${field} ${semanticClassNames.field}`, children: [
313
- /* @__PURE__ */ jsx("label", { className: `${label} ${semanticClassNames.label}`, children: "LaTeX Input" }),
314
- /* @__PURE__ */ jsxs("div", { className: `${inputWrap} ${semanticClassNames.inputWrap}`, children: [
315
- /* @__PURE__ */ jsx(
316
- "textarea",
317
- {
318
- autoCapitalize: "off",
319
- autoComplete: "off",
320
- autoCorrect: "off",
321
- className: `${textarea} ${semanticClassNames.textarea}`,
322
- placeholder: "e.g. \\frac{-b \\pm \\sqrt{b^2-4ac}}{2a}",
323
- ref: inputRef,
324
- rows: displayMode ? 4 : 3,
325
- spellCheck: false,
326
- value,
327
- onClick: (e) => syncSelection(e.currentTarget),
328
- onKeyDown: handleKeyDown,
329
- onKeyUp: (e) => syncSelection(e.currentTarget),
330
- onSelect: (e) => syncSelection(e.currentTarget),
331
- onChange: (e) => {
332
- setValue(e.target.value);
333
- syncSelection(e.target);
334
- }
335
- }
336
- ),
337
- /* @__PURE__ */ jsxs(
338
- "div",
339
- {
340
- className: `${inputActions} ${semanticClassNames.inputActions}`,
341
- children: [
342
- /* @__PURE__ */ jsx(
343
- ActionButton,
344
- {
345
- icon: true,
346
- disabled: !value.trim(),
347
- size: "sm",
348
- title: "Copy LaTeX",
349
- onClick: handleCopy,
350
- children: copied ? /* @__PURE__ */ jsx(Check, { size: 12, style: { color: "#22c55e" } }) : /* @__PURE__ */ jsx(Copy, { size: 12 })
351
- }
352
- ),
353
- /* @__PURE__ */ jsx(
354
- ActionButton,
355
- {
356
- icon: true,
357
- disabled: value === equation,
358
- size: "sm",
359
- title: "Reset",
360
- onClick: handleReset,
361
- children: /* @__PURE__ */ jsx(RotateCcw, { size: 12 })
362
- }
363
- )
364
- ]
365
- }
366
- )
367
- ] })
368
- ] }),
369
- /* @__PURE__ */ jsxs("div", { className: `${field} ${semanticClassNames.field}`, children: [
370
- /* @__PURE__ */ jsx("label", { className: `${label} ${semanticClassNames.label}`, children: "Preview" }),
371
- /* @__PURE__ */ jsx("div", { className: `${preview} ${semanticClassNames.preview}`, children: value.trim() ? /* @__PURE__ */ jsx(KaTeXRenderer, { displayMode, equation: value }) : /* @__PURE__ */ jsx(
372
- "span",
373
- {
374
- className: `${previewEmpty} ${semanticClassNames.previewEmpty}`,
375
- children: "Enter a formula"
376
- }
377
- ) })
378
- ] })
379
- ] }),
380
- activeTab === "snippets" && /* @__PURE__ */ jsxs("div", { className: `${body} ${semanticClassNames.body}`, children: [
381
- /* @__PURE__ */ jsxs(
382
- "div",
383
- {
384
- className: `${snippetSearchWrap} ${semanticClassNames.snippetSearchWrap}`,
385
- children: [
386
- /* @__PURE__ */ jsx(
387
- Search,
388
- {
389
- className: `${snippetSearchIcon} ${semanticClassNames.snippetSearchIcon}`,
390
- size: 14
391
- }
392
- ),
393
- /* @__PURE__ */ jsx(
394
- "input",
395
- {
396
- autoComplete: "off",
397
- className: `${snippetSearchInput} ${semanticClassNames.snippetSearchInput}`,
398
- placeholder: "Search snippets: frac, matrix, sum...",
399
- type: "text",
400
- value: snippetQuery,
401
- onChange: (e) => setSnippetQuery(e.target.value)
402
- }
403
- )
404
- ]
405
- }
406
- ),
407
- groupedSnippets.length > 0 ? /* @__PURE__ */ jsx(
408
- "div",
409
- {
410
- className: `${snippetGroups} ${semanticClassNames.snippetGroups}`,
411
- children: groupedSnippets.map((group) => /* @__PURE__ */ jsxs(
412
- "section",
413
- {
414
- className: `${snippetGroup} ${semanticClassNames.snippetGroup}`,
415
- children: [
416
- /* @__PURE__ */ jsx(
417
- "div",
418
- {
419
- className: `${snippetGroupLabel} ${semanticClassNames.snippetGroupLabel}`,
420
- children: group.category
421
- }
422
- ),
423
- /* @__PURE__ */ jsx(
424
- "div",
425
- {
426
- className: `${snippetList} ${semanticClassNames.snippetList}`,
427
- children: group.items.map((snippet) => /* @__PURE__ */ jsxs(
428
- "button",
429
- {
430
- className: `${snippetButton} ${semanticClassNames.snippetButton}`,
431
- type: "button",
432
- onClick: () => handleInsertSnippet(snippet.template),
433
- children: [
434
- /* @__PURE__ */ jsxs(
435
- "div",
436
- {
437
- className: `${snippetMeta} ${semanticClassNames.snippetMeta}`,
438
- children: [
439
- /* @__PURE__ */ jsx(
440
- "span",
441
- {
442
- className: `${snippetName} ${semanticClassNames.snippetName}`,
443
- children: snippet.title
444
- }
445
- ),
446
- /* @__PURE__ */ jsx(
447
- "span",
448
- {
449
- className: `${snippetHint} ${semanticClassNames.snippetHint}`,
450
- children: snippet.template.replace(CURSOR_TOKEN, "")
451
- }
452
- )
453
- ]
454
- }
455
- ),
456
- /* @__PURE__ */ jsx(
457
- "span",
458
- {
459
- className: `${snippetPreview} ${semanticClassNames.snippetPreview}`,
460
- children: /* @__PURE__ */ jsx(
461
- KaTeXRenderer,
462
- {
463
- displayMode: false,
464
- equation: snippet.previewEquation
465
- }
466
- )
467
- }
468
- )
469
- ]
470
- },
471
- snippet.id
472
- ))
473
- }
474
- )
475
- ]
476
- },
477
- group.category
478
- ))
479
- }
480
- ) : /* @__PURE__ */ jsxs(
481
- "div",
482
- {
483
- className: `${snippetsPlaceholder} ${semanticClassNames.snippetsPlaceholder}`,
484
- children: [
485
- "No snippets match “",
486
- snippetQuery.trim(),
487
- "”"
488
- ]
489
- }
490
- )
491
- ] })
492
- ] }),
493
- /* @__PURE__ */ jsxs("div", { className: `${footer} ${semanticClassNames.footer}`, children: [
494
- /* @__PURE__ */ jsx("span", { className: `${charCount} ${semanticClassNames.charCount}`, children: value.trim() ? `${value.length} chars` : "Enter a formula" }),
495
- /* @__PURE__ */ jsxs(ActionBar, { children: [
496
- /* @__PURE__ */ jsx(ActionButton, { size: "md", variant: "ghost", onClick: cancel, children: "Cancel" }),
497
- /* @__PURE__ */ jsx(ActionButton, { disabled: !value.trim(), size: "md", variant: "accent", onClick: commit, children: "Save" })
498
- ] })
499
- ] })
500
- ]
501
- }
502
- )
503
- ] });
504
- }
505
- class KaTeXBlockEditNode extends KaTeXBlockNode {
506
- static clone(node) {
507
- return new KaTeXBlockEditNode(node.__equation, node.__key);
508
- }
509
- static importJSON(serializedNode) {
510
- return new KaTeXBlockEditNode(serializedNode.equation);
511
- }
512
- decorate(_editor, _config) {
513
- const rendererEl = createRendererDecoration("KaTeX", KaTeXRenderer, {
514
- equation: this.__equation,
515
- displayMode: true
516
- });
517
- return createElement(KaTeXEditDecorator, {
518
- nodeKey: this.__key,
519
- equation: this.__equation,
520
- displayMode: true,
521
- children: rendererEl
522
- });
523
- }
154
+ const start = selectionStart ?? value.length;
155
+ const end = selectionEnd ?? start;
156
+ const cursorOffset = template.indexOf(CURSOR_TOKEN);
157
+ const sanitizedTemplate = template.replace(CURSOR_TOKEN, "");
158
+ const nextValue = value.slice(0, start) + sanitizedTemplate + value.slice(Math.max(start, end));
159
+ const nextCursorPosition = start + (cursorOffset >= 0 ? cursorOffset : sanitizedTemplate.length);
160
+ return {
161
+ value: nextValue,
162
+ selectionStart: nextCursorPosition,
163
+ selectionEnd: nextCursorPosition
164
+ };
524
165
  }
525
- class KaTeXInlineEditNode extends KaTeXInlineNode {
526
- static clone(node) {
527
- return new KaTeXInlineEditNode(node.__equation, node.__key);
528
- }
529
- static importJSON(serializedNode) {
530
- return new KaTeXInlineEditNode(serializedNode.equation);
531
- }
532
- decorate(_editor, _config) {
533
- const rendererEl = createRendererDecoration("KaTeX", KaTeXRenderer, {
534
- equation: this.__equation,
535
- displayMode: false
536
- });
537
- return createElement(KaTeXEditDecorator, {
538
- nodeKey: this.__key,
539
- equation: this.__equation,
540
- displayMode: false,
541
- children: rendererEl
542
- });
543
- }
544
- }
545
- const katexEditNodes = [
546
- KaTeXBlockEditNode,
547
- KaTeXInlineEditNode
166
+ //#endregion
167
+ //#region src/KaTeXEditDecorator.tsx
168
+ var SNIPPET_CATEGORY_ORDER = [
169
+ "Basic",
170
+ "Greek",
171
+ "Operators",
172
+ "Structures"
548
173
  ];
549
- export {
550
- KaTeXBlockEditNode,
551
- KaTeXEditDecorator,
552
- KaTeXInlineEditNode,
553
- katexEditNodes
174
+ function KaTeXEditDecorator({ nodeKey, equation, displayMode, children }) {
175
+ const [editor] = useLexicalComposerContext();
176
+ const editable = editor.isEditable();
177
+ const [open, setOpen] = useState(false);
178
+ const [value, setValue] = useState(equation);
179
+ const [copied, setCopied] = useState(false);
180
+ const [activeTab, setActiveTab] = useState("editor");
181
+ const [snippetQuery, setSnippetQuery] = useState("");
182
+ const inputRef = useRef(null);
183
+ const selectionRef = useRef({
184
+ start: null,
185
+ end: null
186
+ });
187
+ const syncSelection = useCallback((target) => {
188
+ if (!target) return;
189
+ selectionRef.current = {
190
+ start: target.selectionStart,
191
+ end: target.selectionEnd
192
+ };
193
+ }, []);
194
+ useEffect(() => {
195
+ setValue(equation);
196
+ }, [equation]);
197
+ useEffect(() => {
198
+ if (open && inputRef.current) {
199
+ inputRef.current.focus();
200
+ inputRef.current.select();
201
+ syncSelection(inputRef.current);
202
+ }
203
+ }, [open, syncSelection]);
204
+ const commit = useCallback(() => {
205
+ const trimmed = value.trim();
206
+ if (!trimmed) return;
207
+ editor.update(() => {
208
+ const node = $getNodeByKey(nodeKey);
209
+ if ($isKaTeXInlineNode(node) && node.getEquation() !== trimmed) node.setEquation(trimmed);
210
+ else if ($isKaTeXBlockNode(node) && node.getEquation() !== trimmed) node.setEquation(trimmed);
211
+ });
212
+ setOpen(false);
213
+ }, [
214
+ editor,
215
+ nodeKey,
216
+ value
217
+ ]);
218
+ const cancel = useCallback(() => {
219
+ setValue(equation);
220
+ setOpen(false);
221
+ }, [equation]);
222
+ const handleDelete = useCallback(() => {
223
+ editor.update(() => {
224
+ const node = $getNodeByKey(nodeKey);
225
+ if (node) node.remove();
226
+ });
227
+ }, [editor, nodeKey]);
228
+ const handleCopy = useCallback(() => {
229
+ navigator.clipboard.writeText(value);
230
+ setCopied(true);
231
+ setTimeout(setCopied, 2e3, false);
232
+ }, [value]);
233
+ const handleReset = useCallback(() => {
234
+ setValue(equation);
235
+ inputRef.current?.focus();
236
+ }, [equation]);
237
+ const handleInsertSnippet = useCallback((template) => {
238
+ const next = insertSnippetAtSelection(value, template, selectionRef.current.start, selectionRef.current.end);
239
+ setValue(next.value);
240
+ setActiveTab("editor");
241
+ requestAnimationFrame(() => {
242
+ const input = inputRef.current;
243
+ if (!input) return;
244
+ input.focus();
245
+ input.setSelectionRange(next.selectionStart, next.selectionEnd);
246
+ selectionRef.current = {
247
+ start: next.selectionStart,
248
+ end: next.selectionEnd
249
+ };
250
+ });
251
+ }, [value]);
252
+ const filteredSnippets = useMemo(() => filterKaTeXSnippets(snippetQuery), [snippetQuery]);
253
+ const groupedSnippets = useMemo(() => SNIPPET_CATEGORY_ORDER.map((category) => ({
254
+ category,
255
+ items: filteredSnippets.filter((snippet) => snippet.category === category)
256
+ })).filter((group) => group.items.length > 0), [filteredSnippets]);
257
+ const handleKeyDown = useCallback((e) => {
258
+ if (e.key === "Escape") {
259
+ e.preventDefault();
260
+ cancel();
261
+ } else if (displayMode && e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
262
+ e.preventDefault();
263
+ commit();
264
+ } else if (!displayMode && e.key === "Enter" && !e.shiftKey) {
265
+ e.preventDefault();
266
+ commit();
267
+ }
268
+ }, [
269
+ commit,
270
+ cancel,
271
+ displayMode
272
+ ]);
273
+ if (!editable) return children;
274
+ return /* @__PURE__ */ jsxs(Popover, {
275
+ open,
276
+ onOpenChange: setOpen,
277
+ children: [/* @__PURE__ */ jsx(PopoverTrigger, {
278
+ nativeButton: false,
279
+ render: /* @__PURE__ */ jsx("span", {
280
+ className: `${editWrapper} ${semanticClassNames.editWrapper}`,
281
+ title: "Click to edit"
282
+ }),
283
+ children
284
+ }), /* @__PURE__ */ jsxs(PopoverPanel, {
285
+ className: `${panel} ${semanticClassNames.panel}`,
286
+ side: "bottom",
287
+ sideOffset: 8,
288
+ children: [
289
+ /* @__PURE__ */ jsxs("div", {
290
+ className: `${header} ${semanticClassNames.header}`,
291
+ children: [/* @__PURE__ */ jsxs("div", {
292
+ className: `${headerLeft} ${semanticClassNames.headerLeft}`,
293
+ children: [/* @__PURE__ */ jsx("div", {
294
+ className: `${iconWrap} ${semanticClassNames.iconWrap}`,
295
+ children: /* @__PURE__ */ jsx(Terminal, { size: 12 })
296
+ }), /* @__PURE__ */ jsx("span", {
297
+ className: `${title} ${semanticClassNames.title}`,
298
+ children: "Math Editor"
299
+ })]
300
+ }), /* @__PURE__ */ jsxs("div", {
301
+ className: `${headerRight} ${semanticClassNames.headerRight}`,
302
+ children: [/* @__PURE__ */ jsx("span", {
303
+ className: `${mode} ${semanticClassNames.mode}`,
304
+ children: displayMode ? "Block" : "Inline"
305
+ }), /* @__PURE__ */ jsx("button", {
306
+ className: `${deleteButton} ${semanticClassNames.deleteButton}`,
307
+ title: "Delete node",
308
+ type: "button",
309
+ onClick: handleDelete,
310
+ children: /* @__PURE__ */ jsx(Trash2, { size: 14 })
311
+ })]
312
+ })]
313
+ }),
314
+ /* @__PURE__ */ jsx(AnimatedTabs, {
315
+ className: `${tabs} ${semanticClassNames.tabs}`,
316
+ value: activeTab,
317
+ tabs: [{
318
+ id: "editor",
319
+ label: "Editor"
320
+ }, {
321
+ id: "snippets",
322
+ label: "Snippets"
323
+ }],
324
+ onChange: (id) => setActiveTab(id)
325
+ }),
326
+ /* @__PURE__ */ jsxs("div", {
327
+ className: `${bodyScrollArea} ${semanticClassNames.bodyScrollArea}`,
328
+ children: [activeTab === "editor" && /* @__PURE__ */ jsxs("div", {
329
+ className: `mkenhub ${semanticClassNames.body}`,
330
+ children: [/* @__PURE__ */ jsxs("div", {
331
+ className: `mkenhuc ${semanticClassNames.field}`,
332
+ children: [/* @__PURE__ */ jsx("label", {
333
+ className: `mkenhud ${semanticClassNames.label}`,
334
+ children: "LaTeX Input"
335
+ }), /* @__PURE__ */ jsxs("div", {
336
+ className: `mkenhue ${semanticClassNames.inputWrap}`,
337
+ children: [/* @__PURE__ */ jsx("textarea", {
338
+ autoCapitalize: "off",
339
+ autoComplete: "off",
340
+ autoCorrect: "off",
341
+ className: `mkenhuf ${semanticClassNames.textarea}`,
342
+ placeholder: "e.g. \\frac{-b \\pm \\sqrt{b^2-4ac}}{2a}",
343
+ ref: inputRef,
344
+ rows: displayMode ? 4 : 3,
345
+ spellCheck: false,
346
+ value,
347
+ onClick: (e) => syncSelection(e.currentTarget),
348
+ onKeyDown: handleKeyDown,
349
+ onKeyUp: (e) => syncSelection(e.currentTarget),
350
+ onSelect: (e) => syncSelection(e.currentTarget),
351
+ onChange: (e) => {
352
+ setValue(e.target.value);
353
+ syncSelection(e.target);
354
+ }
355
+ }), /* @__PURE__ */ jsxs("div", {
356
+ className: `mkenhug ${semanticClassNames.inputActions}`,
357
+ children: [/* @__PURE__ */ jsx(ActionButton, {
358
+ icon: true,
359
+ disabled: !value.trim(),
360
+ size: "sm",
361
+ title: "Copy LaTeX",
362
+ onClick: handleCopy,
363
+ children: copied ? /* @__PURE__ */ jsx(Check, {
364
+ size: 12,
365
+ style: { color: "#22c55e" }
366
+ }) : /* @__PURE__ */ jsx(Copy, { size: 12 })
367
+ }), /* @__PURE__ */ jsx(ActionButton, {
368
+ icon: true,
369
+ disabled: value === equation,
370
+ size: "sm",
371
+ title: "Reset",
372
+ onClick: handleReset,
373
+ children: /* @__PURE__ */ jsx(RotateCcw, { size: 12 })
374
+ })]
375
+ })]
376
+ })]
377
+ }), /* @__PURE__ */ jsxs("div", {
378
+ className: `mkenhuc ${semanticClassNames.field}`,
379
+ children: [/* @__PURE__ */ jsx("label", {
380
+ className: `mkenhud ${semanticClassNames.label}`,
381
+ children: "Preview"
382
+ }), /* @__PURE__ */ jsx("div", {
383
+ className: `mkenhuh ${semanticClassNames.preview}`,
384
+ children: value.trim() ? /* @__PURE__ */ jsx(KaTeXRenderer, {
385
+ displayMode,
386
+ equation: value
387
+ }) : /* @__PURE__ */ jsx("span", {
388
+ className: `mkenhui ${semanticClassNames.previewEmpty}`,
389
+ children: "Enter a formula"
390
+ })
391
+ })]
392
+ })]
393
+ }), activeTab === "snippets" && /* @__PURE__ */ jsxs("div", {
394
+ className: `mkenhub ${semanticClassNames.body}`,
395
+ children: [/* @__PURE__ */ jsxs("div", {
396
+ className: `mkenhuj ${semanticClassNames.snippetSearchWrap}`,
397
+ children: [/* @__PURE__ */ jsx(Search, {
398
+ className: `mkenhuk ${semanticClassNames.snippetSearchIcon}`,
399
+ size: 14
400
+ }), /* @__PURE__ */ jsx("input", {
401
+ autoComplete: "off",
402
+ className: `mkenhul ${semanticClassNames.snippetSearchInput}`,
403
+ placeholder: "Search snippets: frac, matrix, sum...",
404
+ type: "text",
405
+ value: snippetQuery,
406
+ onChange: (e) => setSnippetQuery(e.target.value)
407
+ })]
408
+ }), groupedSnippets.length > 0 ? /* @__PURE__ */ jsx("div", {
409
+ className: `mkenhum ${semanticClassNames.snippetGroups}`,
410
+ children: groupedSnippets.map((group) => /* @__PURE__ */ jsxs("section", {
411
+ className: `mkenhun ${semanticClassNames.snippetGroup}`,
412
+ children: [/* @__PURE__ */ jsx("div", {
413
+ className: `mkenhuo ${semanticClassNames.snippetGroupLabel}`,
414
+ children: group.category
415
+ }), /* @__PURE__ */ jsx("div", {
416
+ className: `mkenhup ${semanticClassNames.snippetList}`,
417
+ children: group.items.map((snippet) => /* @__PURE__ */ jsxs("button", {
418
+ className: `mkenhuq ${semanticClassNames.snippetButton}`,
419
+ type: "button",
420
+ onClick: () => handleInsertSnippet(snippet.template),
421
+ children: [/* @__PURE__ */ jsxs("div", {
422
+ className: `mkenhur ${semanticClassNames.snippetMeta}`,
423
+ children: [/* @__PURE__ */ jsx("span", {
424
+ className: `mkenhus ${semanticClassNames.snippetName}`,
425
+ children: snippet.title
426
+ }), /* @__PURE__ */ jsx("span", {
427
+ className: `mkenhut ${semanticClassNames.snippetHint}`,
428
+ children: snippet.template.replace("__cursor__", "")
429
+ })]
430
+ }), /* @__PURE__ */ jsx("span", {
431
+ className: `mkenhuu ${semanticClassNames.snippetPreview}`,
432
+ children: /* @__PURE__ */ jsx(KaTeXRenderer, {
433
+ displayMode: false,
434
+ equation: snippet.previewEquation
435
+ })
436
+ })]
437
+ }, snippet.id))
438
+ })]
439
+ }, group.category))
440
+ }) : /* @__PURE__ */ jsxs("div", {
441
+ className: `mkenhuv ${semanticClassNames.snippetsPlaceholder}`,
442
+ children: [
443
+ "No snippets match “",
444
+ snippetQuery.trim(),
445
+ "”"
446
+ ]
447
+ })]
448
+ })]
449
+ }),
450
+ /* @__PURE__ */ jsxs("div", {
451
+ className: `${footer} ${semanticClassNames.footer}`,
452
+ children: [/* @__PURE__ */ jsx("span", {
453
+ className: `${charCount} ${semanticClassNames.charCount}`,
454
+ children: value.trim() ? `${value.length} chars` : "Enter a formula"
455
+ }), /* @__PURE__ */ jsxs(ActionBar, { children: [/* @__PURE__ */ jsx(ActionButton, {
456
+ size: "md",
457
+ variant: "ghost",
458
+ onClick: cancel,
459
+ children: "Cancel"
460
+ }), /* @__PURE__ */ jsx(ActionButton, {
461
+ disabled: !value.trim(),
462
+ size: "md",
463
+ variant: "accent",
464
+ onClick: commit,
465
+ children: "Save"
466
+ })] })]
467
+ })
468
+ ]
469
+ })]
470
+ });
471
+ }
472
+ //#endregion
473
+ //#region src/KaTeXBlockEditNode.ts
474
+ var KaTeXBlockEditNode = class KaTeXBlockEditNode extends KaTeXBlockNode {
475
+ static clone(node) {
476
+ return new KaTeXBlockEditNode(node.__equation, node.__key);
477
+ }
478
+ static importJSON(serializedNode) {
479
+ return new KaTeXBlockEditNode(serializedNode.equation);
480
+ }
481
+ decorate(_editor, _config) {
482
+ const rendererEl = createRendererDecoration("KaTeX", KaTeXRenderer, {
483
+ equation: this.__equation,
484
+ displayMode: true
485
+ });
486
+ return createElement(KaTeXEditDecorator, {
487
+ nodeKey: this.__key,
488
+ equation: this.__equation,
489
+ displayMode: true,
490
+ children: rendererEl
491
+ });
492
+ }
493
+ };
494
+ //#endregion
495
+ //#region src/KaTeXInlineEditNode.ts
496
+ var KaTeXInlineEditNode = class KaTeXInlineEditNode extends KaTeXInlineNode {
497
+ static clone(node) {
498
+ return new KaTeXInlineEditNode(node.__equation, node.__key);
499
+ }
500
+ static importJSON(serializedNode) {
501
+ return new KaTeXInlineEditNode(serializedNode.equation);
502
+ }
503
+ decorate(_editor, _config) {
504
+ const rendererEl = createRendererDecoration("KaTeX", KaTeXRenderer, {
505
+ equation: this.__equation,
506
+ displayMode: false
507
+ });
508
+ return createElement(KaTeXEditDecorator, {
509
+ nodeKey: this.__key,
510
+ equation: this.__equation,
511
+ displayMode: false,
512
+ children: rendererEl
513
+ });
514
+ }
554
515
  };
516
+ //#endregion
517
+ //#region src/index.ts
518
+ var katexEditNodes = [KaTeXBlockEditNode, KaTeXInlineEditNode];
519
+ //#endregion
520
+ export { KaTeXBlockEditNode, KaTeXEditDecorator, KaTeXInlineEditNode, katexEditNodes };
package/dist/rich-renderer-katex.css CHANGED
@@ -1 +1,2 @@
1
- :root{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}:root.dark{--rc-text: #fafafa;--rc-text-secondary: #a1a1aa;--rc-text-tertiary: #71717a;--rc-text-quaternary: #52525b;--rc-bg: #09090b;--rc-bg-secondary: #18181b;--rc-bg-tertiary: #27272a;--rc-fill: #2a2a2f;--rc-fill-secondary: #222226;--rc-fill-tertiary: #1b1b1f;--rc-fill-quaternary: #131316;--rc-border: #27272a;--rc-accent: #60a5fa;--rc-accent-light: #60a5fa20;--rc-link: #60a5fa;--rc-code-text: #e4e4e7;--rc-code-bg: #27272a;--rc-hr-border: #27272a;--rc-quote-border: #60a5fa;--rc-quote-bg: #1e3a5f;--rc-alert-info: #7db9e5;--rc-alert-warning: #da864a;--rc-alert-tip: #54da48;--rc-alert-caution: #e16973;--rc-alert-important: #9966e0;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.35);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.25), 0 4px 16px rgba(0,0,0,.4);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}.x1ktjw0{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}.x1ktjw1{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.8;--rc-line-height-tight: 1.4;--rc-font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}.x1ktjw2{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #a1a1aa;--rc-quote-bg: #fafafa;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: none;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 2px;--rc-space-sm: 4px;--rc-space-md: 10px;--rc-space-lg: 16px;--rc-space-xl: 20px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 14px;--rc-font-size-small: 12px;--rc-line-height: 1.5;--rc-line-height-tight: 1.3;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 3px;--rc-radius-md: 6px;--rc-radius-lg: 12px}.dark .x1ktjw0,[data-theme=dark] .x1ktjw0,.dark.x1ktjw0,[data-theme=dark].x1ktjw0,.dark .x1ktjw1,[data-theme=dark] .x1ktjw1,.dark.x1ktjw1,[data-theme=dark].x1ktjw1,.dark .x1ktjw2,[data-theme=dark] .x1ktjw2,.dark.x1ktjw2,[data-theme=dark].x1ktjw2{--rc-text: #fafafa;--rc-text-secondary: #a1a1aa;--rc-text-tertiary: #71717a;--rc-text-quaternary: #52525b;--rc-bg: #09090b;--rc-bg-secondary: #18181b;--rc-bg-tertiary: #27272a;--rc-fill: #2a2a2f;--rc-fill-secondary: #222226;--rc-fill-tertiary: #1b1b1f;--rc-fill-quaternary: #131316;--rc-border: #27272a;--rc-accent: #60a5fa;--rc-accent-light: #60a5fa20;--rc-link: #60a5fa;--rc-code-text: #e4e4e7;--rc-code-bg: #27272a;--rc-hr-border: #27272a;--rc-quote-border: #60a5fa;--rc-quote-bg: #1e3a5f;--rc-alert-info: #7db9e5;--rc-alert-warning: #da864a;--rc-alert-tip: #54da48;--rc-alert-caution: #e16973;--rc-alert-important: #9966e0;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.35);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.25), 0 4px 16px rgba(0,0,0,.4)}.mkenhu0{cursor:pointer;border-radius:var(--rc-radius-sm);transition:background-color .15s ease}.mkenhu0:hover{background-color:var(--rc-accent-light)}.mkenhu1{width:min(420px,90vw);padding:0;overflow:hidden;box-shadow:var(--rc-shadow-modal);font-family:var(--rc-font-family)}.mkenhu2{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid color-mix(in srgb,var(--rc-border) 60%,transparent)}.mkenhu3{display:flex;align-items:center;gap:8px}.mkenhu4{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--rc-radius-sm);background-color:var(--rc-accent-light);color:var(--rc-accent)}.mkenhu5{font-weight:600;font-size:var(--rc-font-size-md);color:var(--rc-text)}.mkenhu6{display:flex;align-items:center;gap:4px}.mkenhu7{font-size:var(--rc-font-size-2xs);font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--rc-text-secondary);padding:1px 6px;border-radius:var(--rc-radius-sm);background-color:var(--rc-bg-secondary)}.mkenhu8{display:flex;align-items:center;justify-content:center;appearance:none;border:none;background:none;color:var(--rc-text-secondary);cursor:pointer;width:28px;height:28px;border-radius:var(--rc-radius-sm);transition:color .15s ease,background-color .15s ease;flex-shrink:0}.mkenhu8:hover{color:var(--rc-alert-caution);background-color:color-mix(in srgb,var(--rc-alert-caution) 10%,transparent)}.mkenhu9{padding:0 16px}.mkenhua{max-height:320px;overflow-y:auto;overflow-x:hidden;flex-shrink:0}.mkenhub{padding:12px;display:flex;flex-direction:column;gap:12px}.mkenhuc{display:flex;flex-direction:column}.mkenhud{font-size:var(--rc-font-size-2xs);font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--rc-text-secondary);margin-bottom:6px;padding-left:2px}.mkenhue{position:relative}.mkenhuf{display:block;width:100%;padding:10px 56px 10px 12px;font-family:var(--rc-font-mono);font-size:var(--rc-font-size-md);line-height:1.5;background-color:color-mix(in srgb,var(--rc-bg-secondary) 30%,transparent);color:var(--rc-text);border:1px solid color-mix(in srgb,var(--rc-border) 60%,transparent);border-radius:var(--rc-radius-md);outline:none;resize:none;box-sizing:border-box;transition:border-color .15s ease,box-shadow .15s ease}.mkenhuf::placeholder{color:color-mix(in srgb,var(--rc-text-secondary) 50%,transparent)}.mkenhuf:focus{border-color:color-mix(in srgb,var(--rc-accent) 50%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--rc-accent) 25%,transparent)}.mkenhug{position:absolute;right:6px;top:6px;display:flex;gap:2px}.mkenhuh{border:1px solid color-mix(in srgb,var(--rc-border) 60%,transparent);border-radius:var(--rc-radius-md);padding:var(--rc-space-md);min-height:60px;display:flex;align-items:center;justify-content:center;overflow-x:auto;background-color:var(--rc-bg)}.mkenhui{color:color-mix(in srgb,var(--rc-text-secondary) 50%,transparent);font-size:var(--rc-font-size-md)}.mkenhuj{position:relative}.mkenhuk{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:color-mix(in srgb,var(--rc-text-secondary) 70%,transparent);pointer-events:none}.mkenhul{width:100%;height:34px;padding:0 12px 0 32px;border-radius:var(--rc-radius-md);border:1px solid color-mix(in srgb,var(--rc-border) 60%,transparent);background-color:color-mix(in srgb,var(--rc-bg-secondary) 24%,transparent);color:var(--rc-text);outline:none;box-sizing:border-box;font-size:var(--rc-font-size-sm)}.mkenhul::placeholder{color:color-mix(in srgb,var(--rc-text-secondary) 55%,transparent)}.mkenhul:focus{border-color:color-mix(in srgb,var(--rc-accent) 45%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--rc-accent) 18%,transparent)}.mkenhum{display:flex;flex-direction:column;gap:12px}.mkenhun{display:flex;flex-direction:column;gap:6px}.mkenhuo{font-size:var(--rc-font-size-2xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--rc-text-secondary);padding-left:2px}.mkenhup{display:flex;flex-direction:column;gap:6px}.mkenhuq{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;border:1px solid color-mix(in srgb,var(--rc-border) 55%,transparent);border-radius:var(--rc-radius-md);background-color:color-mix(in srgb,var(--rc-bg-secondary) 18%,transparent);padding:10px 12px;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,transform .15s ease}.mkenhuq:hover{border-color:color-mix(in srgb,var(--rc-accent) 30%,var(--rc-border));background-color:color-mix(in srgb,var(--rc-accent-light) 30%,var(--rc-bg-secondary));transform:translateY(-1px)}.mkenhur{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.mkenhus{font-size:var(--rc-font-size-sm);font-weight:600;color:var(--rc-text)}.mkenhut{font-size:var(--rc-font-size-2xs);font-family:var(--rc-font-mono);color:var(--rc-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mkenhuu{display:inline-flex;align-items:center;justify-content:center;min-width:72px;min-height:32px;padding:0 8px;border-radius:var(--rc-radius-sm);background-color:var(--rc-bg);color:var(--rc-text);overflow:hidden;flex-shrink:0}.mkenhuv{color:var(--rc-text-secondary);font-size:var(--rc-font-size-sm);text-align:center;padding:var(--rc-space-lg) var(--rc-space-md);border:1px dashed color-mix(in srgb,var(--rc-border) 60%,transparent);border-radius:var(--rc-radius-md);background-color:color-mix(in srgb,var(--rc-bg-secondary) 16%,transparent)}.mkenhuw{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-top:1px solid color-mix(in srgb,var(--rc-border) 60%,transparent);background-color:color-mix(in srgb,var(--rc-bg-secondary) 20%,transparent)}.mkenhux{color:var(--rc-text-secondary);font-size:var(--rc-font-size-2xs);font-family:var(--rc-font-mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
1
+ :root{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}:root.dark{--rc-text:#fafafa;--rc-text-secondary:#a1a1aa;--rc-text-tertiary:#71717a;--rc-text-quaternary:#52525b;--rc-bg:#09090b;--rc-bg-secondary:#18181b;--rc-bg-tertiary:#27272a;--rc-fill:#2a2a2f;--rc-fill-secondary:#222226;--rc-fill-tertiary:#1b1b1f;--rc-fill-quaternary:#131316;--rc-border:#27272a;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#e4e4e7;--rc-code-bg:#27272a;--rc-hr-border:#27272a;--rc-quote-border:#60a5fa;--rc-quote-bg:#1e3a5f;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.x1ktjw0{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.x1ktjw1{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.8;--rc-line-height-tight:1.4;--rc-font-family:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.x1ktjw2{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#a1a1aa;--rc-quote-bg:#fafafa;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:none;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:2px;--rc-space-sm:4px;--rc-space-md:10px;--rc-space-lg:16px;--rc-space-xl:20px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:14px;--rc-font-size-small:12px;--rc-line-height:1.5;--rc-line-height-tight:1.3;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:3px;--rc-radius-md:6px;--rc-radius-lg:12px}.dark .x1ktjw0,[data-theme=dark] .x1ktjw0,.dark.x1ktjw0,[data-theme=dark].x1ktjw0,.dark .x1ktjw1,[data-theme=dark] .x1ktjw1,.dark.x1ktjw1,[data-theme=dark].x1ktjw1,.dark .x1ktjw2,[data-theme=dark] .x1ktjw2,.dark.x1ktjw2,[data-theme=dark].x1ktjw2{--rc-text:#fafafa;--rc-text-secondary:#a1a1aa;--rc-text-tertiary:#71717a;--rc-text-quaternary:#52525b;--rc-bg:#09090b;--rc-bg-secondary:#18181b;--rc-bg-tertiary:#27272a;--rc-fill:#2a2a2f;--rc-fill-secondary:#222226;--rc-fill-tertiary:#1b1b1f;--rc-fill-quaternary:#131316;--rc-border:#27272a;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#e4e4e7;--rc-code-bg:#27272a;--rc-hr-border:#27272a;--rc-quote-border:#60a5fa;--rc-quote-bg:#1e3a5f;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006}.mkenhu0{cursor:pointer;border-radius:var(--rc-radius-sm);transition:background-color .15s}.mkenhu0:hover{background-color:var(--rc-accent-light)}.mkenhu1{width:min(420px,90vw);box-shadow:var(--rc-shadow-modal);font-family:var(--rc-font-family);padding:0;overflow:hidden}.mkenhu2{border-bottom:1px solid color-mix(in srgb, var(--rc-border) 60%, transparent);justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.mkenhu3{align-items:center;gap:8px;display:flex}.mkenhu4{border-radius:var(--rc-radius-sm);background-color:var(--rc-accent-light);width:20px;height:20px;color:var(--rc-accent);justify-content:center;align-items:center;display:flex}.mkenhu5{font-weight:600;font-size:var(--rc-font-size-md);color:var(--rc-text)}.mkenhu6{align-items:center;gap:4px;display:flex}.mkenhu7{font-size:var(--rc-font-size-2xs);text-transform:uppercase;letter-spacing:.04em;color:var(--rc-text-secondary);border-radius:var(--rc-radius-sm);background-color:var(--rc-bg-secondary);padding:1px 6px;font-weight:500}.mkenhu8{-webkit-appearance:none;appearance:none;color:var(--rc-text-secondary);cursor:pointer;border-radius:var(--rc-radius-sm);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;transition:color .15s,background-color .15s;display:flex}.mkenhu8:hover{color:var(--rc-alert-caution);background-color:color-mix(in srgb, var(--rc-alert-caution) 10%, transparent)}.mkenhu9{padding:0 16px}.mkenhua{flex-shrink:0;max-height:320px;overflow:hidden auto}.mkenhub{flex-direction:column;gap:12px;padding:12px;display:flex}.mkenhuc{flex-direction:column;display:flex}.mkenhud{font-size:var(--rc-font-size-2xs);text-transform:uppercase;letter-spacing:.06em;color:var(--rc-text-secondary);margin-bottom:6px;padding-left:2px;font-weight:500}.mkenhue{position:relative}.mkenhuf{width:100%;font-family:var(--rc-font-mono);font-size:var(--rc-font-size-md);background-color:color-mix(in srgb, var(--rc-bg-secondary) 30%, transparent);color:var(--rc-text);border:1px solid color-mix(in srgb, var(--rc-border) 60%, transparent);border-radius:var(--rc-radius-md);resize:none;box-sizing:border-box;outline:none;padding:10px 56px 10px 12px;line-height:1.5;transition:border-color .15s,box-shadow .15s;display:block}.mkenhuf::placeholder{color:color-mix(in srgb, var(--rc-text-secondary) 50%, transparent)}.mkenhuf:focus{border-color:color-mix(in srgb, var(--rc-accent) 50%, transparent);box-shadow:0 0 0 2px color-mix(in srgb, var(--rc-accent) 25%, transparent)}.mkenhug{gap:2px;display:flex;position:absolute;top:6px;right:6px}.mkenhuh{border:1px solid color-mix(in srgb, var(--rc-border) 60%, transparent);border-radius:var(--rc-radius-md);padding:var(--rc-space-md);background-color:var(--rc-bg);justify-content:center;align-items:center;min-height:60px;display:flex;overflow-x:auto}.mkenhui{color:color-mix(in srgb, var(--rc-text-secondary) 50%, transparent);font-size:var(--rc-font-size-md)}.mkenhuj{position:relative}.mkenhuk{color:color-mix(in srgb, var(--rc-text-secondary) 70%, transparent);pointer-events:none;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.mkenhul{border-radius:var(--rc-radius-md);border:1px solid color-mix(in srgb, var(--rc-border) 60%, transparent);background-color:color-mix(in srgb, var(--rc-bg-secondary) 24%, transparent);width:100%;height:34px;color:var(--rc-text);box-sizing:border-box;font-size:var(--rc-font-size-sm);outline:none;padding:0 12px 0 32px}.mkenhul::placeholder{color:color-mix(in srgb, var(--rc-text-secondary) 55%, transparent)}.mkenhul:focus{border-color:color-mix(in srgb, var(--rc-accent) 45%, transparent);box-shadow:0 0 0 2px color-mix(in srgb, var(--rc-accent) 18%, transparent)}.mkenhum{flex-direction:column;gap:12px;display:flex}.mkenhun{flex-direction:column;gap:6px;display:flex}.mkenhuo{font-size:var(--rc-font-size-2xs);letter-spacing:.08em;text-transform:uppercase;color:var(--rc-text-secondary);padding-left:2px;font-weight:600}.mkenhup{flex-direction:column;gap:6px;display:flex}.mkenhuq{text-align:left;border:1px solid color-mix(in srgb, var(--rc-border) 55%, transparent);border-radius:var(--rc-radius-md);background-color:color-mix(in srgb, var(--rc-bg-secondary) 18%, transparent);cursor:pointer;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:10px 12px;transition:border-color .15s,background-color .15s,transform .15s;display:flex}.mkenhuq:hover{border-color:color-mix(in srgb, var(--rc-accent) 30%, var(--rc-border));background-color:color-mix(in srgb, var(--rc-accent-light) 30%, var(--rc-bg-secondary));transform:translateY(-1px)}.mkenhur{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.mkenhus{font-size:var(--rc-font-size-sm);color:var(--rc-text);font-weight:600}.mkenhut{font-size:var(--rc-font-size-2xs);font-family:var(--rc-font-mono);color:var(--rc-text-secondary);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mkenhuu{border-radius:var(--rc-radius-sm);background-color:var(--rc-bg);min-width:72px;min-height:32px;color:var(--rc-text);flex-shrink:0;justify-content:center;align-items:center;padding:0 8px;display:inline-flex;overflow:hidden}.mkenhuv{color:var(--rc-text-secondary);font-size:var(--rc-font-size-sm);text-align:center;padding:var(--rc-space-lg) var(--rc-space-md);border:1px dashed color-mix(in srgb, var(--rc-border) 60%, transparent);border-radius:var(--rc-radius-md);background-color:color-mix(in srgb, var(--rc-bg-secondary) 16%, transparent)}.mkenhuw{border-top:1px solid color-mix(in srgb, var(--rc-border) 60%, transparent);background-color:color-mix(in srgb, var(--rc-bg-secondary) 20%, transparent);justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.mkenhux{color:var(--rc-text-secondary);font-size:var(--rc-font-size-2xs);font-family:var(--rc-font-mono);text-overflow:ellipsis;white-space:nowrap;max-width:200px;overflow:hidden}
2
+ /*$vite$:1*/
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@haklex/rich-renderer-katex",
3
- "version": "0.0.79",
3
+ "version": "0.0.81",
4
4
  "description": "KaTeX math renderer for haklex rich editor",
5
5
  "repository": {
6
6
  "type": "git",
@@ -22,9 +22,9 @@
22
22
  ],
23
23
  "dependencies": {
24
24
  "lucide-react": "^0.577.0",
25
- "@haklex/rich-editor": "0.0.79",
26
- "@haklex/rich-editor-ui": "0.0.79",
27
- "@haklex/rich-style-token": "0.0.79"
25
+ "@haklex/rich-editor": "0.0.81",
26
+ "@haklex/rich-style-token": "0.0.81",
27
+ "@haklex/rich-editor-ui": "0.0.81"
28
28
  },
29
29
  "devDependencies": {
30
30
  "@lexical/react": "^0.41.0",