@mdxeditor/editor 1.6.0 → 1.8.0
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/dist/icons/format_list_checked.svg.js +8 -0
- package/dist/plugins/lists/LexicalListItemVisitor.js +1 -0
- package/dist/plugins/lists/MdastListItemVisitor.js +2 -2
- package/dist/plugins/lists/MdastListVisitor.js +3 -1
- package/dist/plugins/lists/index.js +9 -1
- package/dist/plugins/markdown-shortcut/index.js +2 -2
- package/dist/plugins/table/index.d.ts +19 -8
- package/dist/plugins/table/index.js +20 -10
- package/dist/plugins/toolbar/components/InsertTable.js +1 -1
- package/dist/plugins/toolbar/components/ListsToggle.js +3 -1
- package/dist/style.css +86 -26
- package/dist/styles/lexical-theme.module.css.js +25 -16
- package/dist/styles/lexicalTheme.js +3 -0
- package/package.json +3 -1
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
const SvgFormatListChecked = (props) => /* @__PURE__ */ React.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "mask0_592_44", style: {
|
|
3
|
+
maskType: "alpha"
|
|
4
|
+
}, maskUnits: "userSpaceOnUse", x: 0, y: 0, width: 24, height: 24 }, /* @__PURE__ */ React.createElement("rect", { width: 24, height: 24, fill: "#D9D9D9" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#mask0_592_44)" }, /* @__PURE__ */ React.createElement("path", { d: "M5.55 15L2 11.45L3.4 10.05L5.525 12.175L9.775 7.925L11.175 9.35L5.55 15ZM5.55 9L2 5.45L3.4 4.05L5.525 6.175L9.775 1.925L11.175 3.35L5.55 9ZM13 13V11H22V13H13ZM13 7V5H22V7H13Z", fill: "currentColor" }), /* @__PURE__ */ React.createElement("path", { d: "M13 19V17H22V19H13Z", fill: "currentColor" }), /* @__PURE__ */ React.createElement("path", { d: "M5.55 21L2 17.45L3.4 16.05L5.525 18.175L9.775 13.925L11.175 15.35L5.55 21Z", fill: "currentColor" })));
|
|
5
|
+
const CheckedListIcon = SvgFormatListChecked;
|
|
6
|
+
export {
|
|
7
|
+
CheckedListIcon as default
|
|
8
|
+
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { $createListItemNode } from "@lexical/list";
|
|
2
2
|
const MdastListItemVisitor = {
|
|
3
3
|
testNode: "listItem",
|
|
4
|
-
visitNode({ actions }) {
|
|
5
|
-
actions.addAndStepInto($createListItemNode());
|
|
4
|
+
visitNode({ mdastNode, actions }) {
|
|
5
|
+
actions.addAndStepInto($createListItemNode(mdastNode.checked ?? void 0));
|
|
6
6
|
}
|
|
7
7
|
};
|
|
8
8
|
export {
|
|
@@ -2,7 +2,9 @@ import { $createListNode, $isListItemNode, $createListItemNode } from "@lexical/
|
|
|
2
2
|
const MdastListVisitor = {
|
|
3
3
|
testNode: "list",
|
|
4
4
|
visitNode: function({ mdastNode, lexicalParent, actions }) {
|
|
5
|
-
|
|
5
|
+
var _a;
|
|
6
|
+
const listType = ((_a = mdastNode.children) == null ? void 0 : _a.some((e) => typeof e.checked === "boolean")) ? "check" : mdastNode.ordered ? "number" : "bullet";
|
|
7
|
+
const lexicalNode = $createListNode(listType);
|
|
6
8
|
if ($isListItemNode(lexicalParent)) {
|
|
7
9
|
const dedicatedParent = $createListItemNode();
|
|
8
10
|
dedicatedParent.append(lexicalNode);
|
|
@@ -3,16 +3,20 @@ import { MdastListVisitor } from "./MdastListVisitor.js";
|
|
|
3
3
|
import { MdastListItemVisitor } from "./MdastListItemVisitor.js";
|
|
4
4
|
import { LexicalListVisitor } from "./LexicalListVisitor.js";
|
|
5
5
|
import { LexicalListItemVisitor } from "./LexicalListItemVisitor.js";
|
|
6
|
-
import { $isListNode, ListNode, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, REMOVE_LIST_COMMAND, ListItemNode, $getListDepth, $isListItemNode } from "@lexical/list";
|
|
6
|
+
import { $isListNode, ListNode, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, INSERT_CHECK_LIST_COMMAND, REMOVE_LIST_COMMAND, ListItemNode, $getListDepth, $isListItemNode } from "@lexical/list";
|
|
7
7
|
import { $isRootOrShadowRoot, INDENT_CONTENT_COMMAND, COMMAND_PRIORITY_CRITICAL, $getSelection, $isRangeSelection, $isElementNode } from "lexical";
|
|
8
8
|
import { TabIndentationPlugin } from "@lexical/react/LexicalTabIndentationPlugin.js";
|
|
9
|
+
import { CheckListPlugin } from "@lexical/react/LexicalCheckListPlugin.js";
|
|
9
10
|
import { ListPlugin } from "@lexical/react/LexicalListPlugin.js";
|
|
10
11
|
import { $findMatchingParent, $getNearestNodeOfType } from "@lexical/utils";
|
|
12
|
+
import { gfmTaskListItem } from "micromark-extension-gfm-task-list-item";
|
|
13
|
+
import { gfmTaskListItemFromMarkdown, gfmTaskListItemToMarkdown } from "mdast-util-gfm-task-list-item";
|
|
11
14
|
import { system } from "../../gurx/realmFactory.js";
|
|
12
15
|
import { realmPlugin } from "../../gurx/react.js";
|
|
13
16
|
const ListTypeCommandMap = /* @__PURE__ */ new Map([
|
|
14
17
|
["number", INSERT_ORDERED_LIST_COMMAND],
|
|
15
18
|
["bullet", INSERT_UNORDERED_LIST_COMMAND],
|
|
19
|
+
["check", INSERT_CHECK_LIST_COMMAND],
|
|
16
20
|
["", REMOVE_LIST_COMMAND]
|
|
17
21
|
]);
|
|
18
22
|
const listsSystem = system(
|
|
@@ -60,15 +64,19 @@ const [
|
|
|
60
64
|
systemSpec: listsSystem,
|
|
61
65
|
init: (realm) => {
|
|
62
66
|
var _a;
|
|
67
|
+
realm.pubKey("addMdastExtension", gfmTaskListItemFromMarkdown);
|
|
68
|
+
realm.pubKey("addSyntaxExtension", gfmTaskListItem);
|
|
63
69
|
realm.pubKey("addImportVisitor", MdastListVisitor);
|
|
64
70
|
realm.pubKey("addImportVisitor", MdastListItemVisitor);
|
|
65
71
|
realm.pubKey("addLexicalNode", ListItemNode);
|
|
66
72
|
realm.pubKey("addLexicalNode", ListNode);
|
|
67
73
|
realm.pubKey("addExportVisitor", LexicalListVisitor);
|
|
68
74
|
realm.pubKey("addExportVisitor", LexicalListItemVisitor);
|
|
75
|
+
realm.pubKey("addToMarkdownExtension", gfmTaskListItemToMarkdown);
|
|
69
76
|
(_a = realm.getKeyValue("rootEditor")) == null ? void 0 : _a.registerCommand(INDENT_CONTENT_COMMAND, () => !isIndentPermitted(7), COMMAND_PRIORITY_CRITICAL);
|
|
70
77
|
realm.pubKey("addComposerChild", TabIndentationPlugin);
|
|
71
78
|
realm.pubKey("addComposerChild", ListPlugin);
|
|
79
|
+
realm.pubKey("addComposerChild", CheckListPlugin);
|
|
72
80
|
}
|
|
73
81
|
});
|
|
74
82
|
function getElementNodesInSelection(selection) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { QUOTE, LINK, ORDERED_LIST, UNORDERED_LIST, CODE, BOLD_ITALIC_STAR, BOLD_ITALIC_UNDERSCORE, BOLD_STAR, BOLD_UNDERSCORE, INLINE_CODE, ITALIC_STAR, ITALIC_UNDERSCORE } from "@lexical/markdown";
|
|
1
|
+
import { QUOTE, LINK, ORDERED_LIST, UNORDERED_LIST, CHECK_LIST, CODE, BOLD_ITALIC_STAR, BOLD_ITALIC_UNDERSCORE, BOLD_STAR, BOLD_UNDERSCORE, INLINE_CODE, ITALIC_STAR, ITALIC_UNDERSCORE } from "@lexical/markdown";
|
|
2
2
|
import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin.js";
|
|
3
3
|
import React__default from "react";
|
|
4
4
|
import { CodeBlockNode, $createCodeBlockNode } from "../codeblock/CodeBlockNode.js";
|
|
@@ -69,7 +69,7 @@ function pickTransformersForActivePlugins(pluginIds, allowedHeadingLevels) {
|
|
|
69
69
|
transformers.push(LINK);
|
|
70
70
|
}
|
|
71
71
|
if (pluginIds.includes("lists")) {
|
|
72
|
-
transformers.push(ORDERED_LIST, UNORDERED_LIST);
|
|
72
|
+
transformers.push(ORDERED_LIST, UNORDERED_LIST, CHECK_LIST);
|
|
73
73
|
}
|
|
74
74
|
if (pluginIds.includes("codeblock")) {
|
|
75
75
|
const codeTransformerCopy = {
|
|
@@ -11,6 +11,16 @@ import type { LexicalEditor, RangeSelection, Klass, LexicalNode, TextFormatType,
|
|
|
11
11
|
import type { SystemSpec, Realm, RealmNode, PluginConstructor, TypedRealm, ValueForKey, SystemKeys, ValuesForKeys, SystemDict } from '../../gurx';
|
|
12
12
|
/// <reference types="react" />
|
|
13
13
|
import * as Mdast from 'mdast';
|
|
14
|
+
type InsertTablePayload = {
|
|
15
|
+
/**
|
|
16
|
+
* The nunber of rows of the table.
|
|
17
|
+
*/
|
|
18
|
+
rows?: number;
|
|
19
|
+
/**
|
|
20
|
+
* The nunber of columns of the table.
|
|
21
|
+
*/
|
|
22
|
+
columns?: number;
|
|
23
|
+
};
|
|
14
24
|
/** @internal */
|
|
15
25
|
export declare const tableSystem: SystemSpec<[SystemSpec<[], (r: Realm) => {
|
|
16
26
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
@@ -123,7 +133,7 @@ export declare const tableSystem: SystemSpec<[SystemSpec<[], (r: Realm) => {
|
|
|
123
133
|
insertDecoratorNode: RealmNode<() => DecoratorNode<unknown>>;
|
|
124
134
|
onBlur: RealmNode<FocusEvent>;
|
|
125
135
|
}]) => {
|
|
126
|
-
insertTable: RealmNode<
|
|
136
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
127
137
|
}>;
|
|
128
138
|
export declare const
|
|
129
139
|
/** @internal */
|
|
@@ -238,12 +248,12 @@ tablePlugin: PluginConstructor<SystemSpec<[SystemSpec<[], (r: Realm) => {
|
|
|
238
248
|
insertDecoratorNode: RealmNode<() => DecoratorNode<unknown>>;
|
|
239
249
|
onBlur: RealmNode<FocusEvent>;
|
|
240
250
|
}]) => {
|
|
241
|
-
insertTable: RealmNode<
|
|
251
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
242
252
|
}>, object>,
|
|
243
253
|
/** @internal */
|
|
244
254
|
tablePluginHooks: {
|
|
245
255
|
useRealmContext: () => TypedRealm<{
|
|
246
|
-
insertTable: RealmNode<
|
|
256
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
247
257
|
} & {
|
|
248
258
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
249
259
|
inFocus: RealmNode<boolean>;
|
|
@@ -301,7 +311,7 @@ tablePluginHooks: {
|
|
|
301
311
|
onBlur: RealmNode<FocusEvent>;
|
|
302
312
|
}>;
|
|
303
313
|
useEmitter: <K extends "jsxComponentDescriptors" | "jsxIsAvailable" | "toMarkdownOptions" | "toMarkdownExtensions" | "mdastExtensions" | "syntaxExtensions" | "markdown" | "activeEditor" | "inFocus" | "historyState" | "currentSelection" | "initialRootEditorState" | "rootEditor" | "createRootEditorSubscription" | "createActiveEditorSubscription" | "importVisitors" | "usedLexicalNodes" | "addImportVisitor" | "addLexicalNode" | "addSyntaxExtension" | "addMdastExtension" | "addToMarkdownExtension" | "addExportVisitor" | "exportVisitors" | "initialMarkdown" | "setMarkdown" | "editorRootElementRef" | "contentEditableClassName" | "placeholder" | "autoFocus" | "readOnly" | "composerChildren" | "addComposerChild" | "topAreaChildren" | "addTopAreaChild" | "nestedEditorChildren" | "addNestedEditorChild" | "editorWrappers" | "addEditorWrapper" | "currentFormat" | "editorInFocus" | "applyFormat" | "currentBlockType" | "applyBlockType" | "convertSelectionToNode" | "insertDecoratorNode" | "onBlur" | "insertTable">(key: K, callback: (value: ValueForKey<{
|
|
304
|
-
insertTable: RealmNode<
|
|
314
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
305
315
|
} & {
|
|
306
316
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
307
317
|
inFocus: RealmNode<boolean>;
|
|
@@ -359,7 +369,7 @@ tablePluginHooks: {
|
|
|
359
369
|
onBlur: RealmNode<FocusEvent>;
|
|
360
370
|
}, K>) => void) => void;
|
|
361
371
|
useEmitterValues: <K_1 extends SystemKeys<{
|
|
362
|
-
insertTable: RealmNode<
|
|
372
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
363
373
|
} & {
|
|
364
374
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
365
375
|
inFocus: RealmNode<boolean>;
|
|
@@ -416,7 +426,7 @@ tablePluginHooks: {
|
|
|
416
426
|
insertDecoratorNode: RealmNode<() => DecoratorNode<unknown>>;
|
|
417
427
|
onBlur: RealmNode<FocusEvent>;
|
|
418
428
|
}>>(...keys: K_1) => ValuesForKeys<{
|
|
419
|
-
insertTable: RealmNode<
|
|
429
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
420
430
|
} & {
|
|
421
431
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
422
432
|
inFocus: RealmNode<boolean>;
|
|
@@ -474,7 +484,7 @@ tablePluginHooks: {
|
|
|
474
484
|
onBlur: RealmNode<FocusEvent>;
|
|
475
485
|
}, K_1>;
|
|
476
486
|
usePubKeys: () => (values: SystemDict<{
|
|
477
|
-
insertTable: RealmNode<
|
|
487
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
478
488
|
} & {
|
|
479
489
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
480
490
|
inFocus: RealmNode<boolean>;
|
|
@@ -532,7 +542,7 @@ tablePluginHooks: {
|
|
|
532
542
|
onBlur: RealmNode<FocusEvent>;
|
|
533
543
|
}>) => void;
|
|
534
544
|
usePublisher: <K_2 extends "jsxComponentDescriptors" | "jsxIsAvailable" | "toMarkdownOptions" | "toMarkdownExtensions" | "mdastExtensions" | "syntaxExtensions" | "markdown" | "activeEditor" | "inFocus" | "historyState" | "currentSelection" | "initialRootEditorState" | "rootEditor" | "createRootEditorSubscription" | "createActiveEditorSubscription" | "importVisitors" | "usedLexicalNodes" | "addImportVisitor" | "addLexicalNode" | "addSyntaxExtension" | "addMdastExtension" | "addToMarkdownExtension" | "addExportVisitor" | "exportVisitors" | "initialMarkdown" | "setMarkdown" | "editorRootElementRef" | "contentEditableClassName" | "placeholder" | "autoFocus" | "readOnly" | "composerChildren" | "addComposerChild" | "topAreaChildren" | "addTopAreaChild" | "nestedEditorChildren" | "addNestedEditorChild" | "editorWrappers" | "addEditorWrapper" | "currentFormat" | "editorInFocus" | "applyFormat" | "currentBlockType" | "applyBlockType" | "convertSelectionToNode" | "insertDecoratorNode" | "onBlur" | "insertTable">(key: K_2) => (value: ValueForKey<{
|
|
535
|
-
insertTable: RealmNode<
|
|
545
|
+
insertTable: RealmNode<InsertTablePayload>;
|
|
536
546
|
} & {
|
|
537
547
|
activeEditor: RealmNode<LexicalEditor | null>;
|
|
538
548
|
inFocus: RealmNode<boolean>;
|
|
@@ -590,3 +600,4 @@ tablePluginHooks: {
|
|
|
590
600
|
onBlur: RealmNode<FocusEvent>;
|
|
591
601
|
}, K_2>) => void;
|
|
592
602
|
};
|
|
603
|
+
export {};
|
|
@@ -6,16 +6,26 @@ import { MdastTableVisitor } from "./MdastTableVisitor.js";
|
|
|
6
6
|
import { $createTableNode, TableNode } from "./TableNode.js";
|
|
7
7
|
import { system } from "../../gurx/realmFactory.js";
|
|
8
8
|
import { realmPlugin } from "../../gurx/react.js";
|
|
9
|
-
function seedTable() {
|
|
10
|
-
|
|
9
|
+
function seedTable(rows = 1, columns = 1) {
|
|
10
|
+
const table = {
|
|
11
11
|
type: "table",
|
|
12
|
-
children: [
|
|
13
|
-
{
|
|
14
|
-
type: "tableRow",
|
|
15
|
-
children: [{ type: "tableCell", children: [] }]
|
|
16
|
-
}
|
|
17
|
-
]
|
|
12
|
+
children: []
|
|
18
13
|
};
|
|
14
|
+
for (let i = 0; i < rows; i++) {
|
|
15
|
+
const tableRow = {
|
|
16
|
+
type: "tableRow",
|
|
17
|
+
children: []
|
|
18
|
+
};
|
|
19
|
+
for (let j = 0; j < columns; j++) {
|
|
20
|
+
const cell = {
|
|
21
|
+
type: "tableCell",
|
|
22
|
+
children: []
|
|
23
|
+
};
|
|
24
|
+
tableRow.children.push(cell);
|
|
25
|
+
}
|
|
26
|
+
table.children.push(tableRow);
|
|
27
|
+
}
|
|
28
|
+
return table;
|
|
19
29
|
}
|
|
20
30
|
const tableSystem = system(
|
|
21
31
|
(r, [{ insertDecoratorNode }]) => {
|
|
@@ -23,8 +33,8 @@ const tableSystem = system(
|
|
|
23
33
|
r.link(
|
|
24
34
|
r.pipe(
|
|
25
35
|
insertTable,
|
|
26
|
-
r.o.
|
|
27
|
-
return $createTableNode(seedTable());
|
|
36
|
+
r.o.map(({ rows, columns }) => {
|
|
37
|
+
return () => $createTableNode(seedTable(rows, columns));
|
|
28
38
|
})
|
|
29
39
|
),
|
|
30
40
|
insertDecoratorNode
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React__default from "react";
|
|
2
2
|
import BulletedListIcon from "../../../icons/format_list_bulleted.svg.js";
|
|
3
3
|
import NumberedListIcon from "../../../icons/format_list_numbered.svg.js";
|
|
4
|
+
import CheckedListIcon from "../../../icons/format_list_checked.svg.js";
|
|
4
5
|
import { listsPluginHooks } from "../../lists/index.js";
|
|
5
6
|
import { SingleChoiceToggleGroup } from "../primitives/toolbar.js";
|
|
6
7
|
const ListsToggle = () => {
|
|
@@ -12,7 +13,8 @@ const ListsToggle = () => {
|
|
|
12
13
|
value: currentListType || "",
|
|
13
14
|
items: [
|
|
14
15
|
{ title: "Bulleted list", contents: /* @__PURE__ */ React__default.createElement(BulletedListIcon, null), value: "bullet" },
|
|
15
|
-
{ title: "Numbered list", contents: /* @__PURE__ */ React__default.createElement(NumberedListIcon, null), value: "number" }
|
|
16
|
+
{ title: "Numbered list", contents: /* @__PURE__ */ React__default.createElement(NumberedListIcon, null), value: "number" },
|
|
17
|
+
{ title: "Check list", contents: /* @__PURE__ */ React__default.createElement(CheckedListIcon, null), value: "check" }
|
|
16
18
|
],
|
|
17
19
|
onChange: applyListType
|
|
18
20
|
}
|
package/dist/style.css
CHANGED
|
@@ -1445,7 +1445,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1445
1445
|
}
|
|
1446
1446
|
|
|
1447
1447
|
|
|
1448
|
-
:root, ._light-
|
|
1448
|
+
:root, ._light-theme_arru1_1 {
|
|
1449
1449
|
--blue1: hsl(206, 100%, 99.2%);
|
|
1450
1450
|
--blue2: hsl(210, 100%, 98.0%);
|
|
1451
1451
|
--blue3: hsl(209, 100%, 96.5%);
|
|
@@ -1459,7 +1459,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1459
1459
|
--blue11: hsl(211, 100%, 43.2%);
|
|
1460
1460
|
--blue12: hsl(211, 100%, 15.0%);
|
|
1461
1461
|
}
|
|
1462
|
-
._dark-
|
|
1462
|
+
._dark-theme_arru1_1 {
|
|
1463
1463
|
--blue1: hsl(212, 35.0%, 9.2%);
|
|
1464
1464
|
--blue2: hsl(216, 50.0%, 11.8%);
|
|
1465
1465
|
--blue3: hsl(214, 59.4%, 15.3%);
|
|
@@ -1473,7 +1473,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1473
1473
|
--blue11: hsl(210, 100%, 66.1%);
|
|
1474
1474
|
--blue12: hsl(206, 98.0%, 95.8%);
|
|
1475
1475
|
}
|
|
1476
|
-
:root, ._light-
|
|
1476
|
+
:root, ._light-theme_arru1_1 {
|
|
1477
1477
|
--slate1: hsl(206, 30.0%, 98.8%);
|
|
1478
1478
|
--slate2: hsl(210, 16.7%, 97.6%);
|
|
1479
1479
|
--slate3: hsl(209, 13.3%, 95.3%);
|
|
@@ -1487,7 +1487,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1487
1487
|
--slate11: hsl(206, 6.0%, 43.5%);
|
|
1488
1488
|
--slate12: hsl(206, 24.0%, 9.0%);
|
|
1489
1489
|
}
|
|
1490
|
-
._dark-
|
|
1490
|
+
._dark-theme_arru1_1 {
|
|
1491
1491
|
--slate1: hsl(200, 7.0%, 8.8%);
|
|
1492
1492
|
--slate2: hsl(195, 7.1%, 11.0%);
|
|
1493
1493
|
--slate3: hsl(197, 6.8%, 13.6%);
|
|
@@ -1501,7 +1501,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1501
1501
|
--slate11: hsl(206, 6.0%, 63.0%);
|
|
1502
1502
|
--slate12: hsl(210, 6.0%, 93.0%);
|
|
1503
1503
|
}
|
|
1504
|
-
:root, ._light-
|
|
1504
|
+
:root, ._light-theme_arru1_1 {
|
|
1505
1505
|
--grass1: hsl(116, 50.0%, 98.9%);
|
|
1506
1506
|
--grass2: hsl(120, 60.0%, 97.1%);
|
|
1507
1507
|
--grass3: hsl(120, 53.6%, 94.8%);
|
|
@@ -1515,7 +1515,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1515
1515
|
--grass11: hsl(133, 50.0%, 32.5%);
|
|
1516
1516
|
--grass12: hsl(130, 30.0%, 14.9%);
|
|
1517
1517
|
}
|
|
1518
|
-
:root, ._light-
|
|
1518
|
+
:root, ._light-theme_arru1_1 {
|
|
1519
1519
|
--cyan1: hsl(185, 60.0%, 98.7%);
|
|
1520
1520
|
--cyan2: hsl(185, 73.3%, 97.1%);
|
|
1521
1521
|
--cyan3: hsl(186, 70.2%, 94.4%);
|
|
@@ -1529,7 +1529,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1529
1529
|
--cyan11: hsl(192, 85.0%, 31.0%);
|
|
1530
1530
|
--cyan12: hsl(192, 88.0%, 12.5%);
|
|
1531
1531
|
}
|
|
1532
|
-
:root, ._light-
|
|
1532
|
+
:root, ._light-theme_arru1_1 {
|
|
1533
1533
|
--amber1: hsl(39, 70.0%, 99.0%);
|
|
1534
1534
|
--amber2: hsl(40, 100%, 96.5%);
|
|
1535
1535
|
--amber3: hsl(44, 100%, 91.7%);
|
|
@@ -1543,7 +1543,7 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1543
1543
|
--amber11: hsl(30, 100%, 34.0%);
|
|
1544
1544
|
--amber12: hsl(20, 80.0%, 17.0%);
|
|
1545
1545
|
}
|
|
1546
|
-
:root, ._light-
|
|
1546
|
+
:root, ._light-theme_arru1_1 {
|
|
1547
1547
|
--red1: hsl(359, 100%, 99.4%);
|
|
1548
1548
|
--red2: hsl(359, 100%, 98.6%);
|
|
1549
1549
|
--red3: hsl(360, 100%, 96.8%);
|
|
@@ -1557,71 +1557,131 @@ form._multiFieldForm_16b3d_1086 ._formField_16b3d_1092 {
|
|
|
1557
1557
|
--red11: hsl(358, 65.0%, 48.7%);
|
|
1558
1558
|
--red12: hsl(354, 50.0%, 14.6%);
|
|
1559
1559
|
}
|
|
1560
|
-
.
|
|
1560
|
+
._bold_arru1_10 {
|
|
1561
1561
|
font-weight: bold;
|
|
1562
1562
|
}
|
|
1563
|
-
.
|
|
1563
|
+
._italic_arru1_14 {
|
|
1564
1564
|
font-style: italic;
|
|
1565
1565
|
}
|
|
1566
|
-
.
|
|
1566
|
+
._underline_arru1_18 {
|
|
1567
1567
|
text-decoration: underline;
|
|
1568
1568
|
}
|
|
1569
|
-
.
|
|
1569
|
+
._bold_arru1_10 {
|
|
1570
1570
|
font-weight: 700
|
|
1571
1571
|
}
|
|
1572
|
-
.
|
|
1572
|
+
._italic_arru1_14 {
|
|
1573
1573
|
font-style: italic
|
|
1574
1574
|
}
|
|
1575
|
-
.
|
|
1575
|
+
._underline_arru1_18 {
|
|
1576
1576
|
text-decoration: underline
|
|
1577
1577
|
}
|
|
1578
|
-
.
|
|
1578
|
+
._strikethrough_arru1_34 {
|
|
1579
1579
|
text-decoration: line-through
|
|
1580
1580
|
}
|
|
1581
|
-
.
|
|
1581
|
+
._underlineStrikethrough_arru1_38 {
|
|
1582
1582
|
text-decoration: underline line-through
|
|
1583
1583
|
}
|
|
1584
|
-
.
|
|
1584
|
+
._subscript_arru1_42 {
|
|
1585
1585
|
font-size: .8em;
|
|
1586
1586
|
vertical-align: sub!important
|
|
1587
1587
|
}
|
|
1588
|
-
.
|
|
1588
|
+
._superscript_arru1_47 {
|
|
1589
1589
|
font-size: .8em;
|
|
1590
1590
|
vertical-align: super
|
|
1591
1591
|
}
|
|
1592
|
-
.
|
|
1592
|
+
._code_arru1_52 {
|
|
1593
1593
|
background-color: var(--baseBg);
|
|
1594
1594
|
padding: 1px .25rem;
|
|
1595
1595
|
font-family: var(--font-mono);
|
|
1596
1596
|
font-size: 94%
|
|
1597
1597
|
}
|
|
1598
|
-
.
|
|
1598
|
+
._nestedListItem_arru1_59 {
|
|
1599
1599
|
list-style:none;
|
|
1600
1600
|
}
|
|
1601
|
-
.
|
|
1601
|
+
._listitem_arru1_63 {
|
|
1602
|
+
margin: var(--spacing-2) 0;
|
|
1603
|
+
}
|
|
1604
|
+
._listItemChecked_arru1_67, ._listItemUnchecked_arru1_68 {
|
|
1605
|
+
position: relative;
|
|
1606
|
+
margin-left: 0;
|
|
1607
|
+
margin-right: 0;
|
|
1608
|
+
margin-inline-start: -1rem;
|
|
1609
|
+
padding-left: var(--spacing-6);
|
|
1610
|
+
padding-right: var(--spacing-6);
|
|
1611
|
+
list-style-type: none;
|
|
1612
|
+
outline: none;
|
|
1613
|
+
}
|
|
1614
|
+
._listItemChecked_arru1_67 {
|
|
1615
|
+
text-decoration: line-through;
|
|
1616
|
+
}
|
|
1617
|
+
._listItemUnchecked_arru1_68:before, ._listItemChecked_arru1_67:before {
|
|
1618
|
+
content: '';
|
|
1619
|
+
width: var(--spacing-4);
|
|
1620
|
+
height: var(--spacing-4);
|
|
1621
|
+
top: 0;
|
|
1622
|
+
left: 0;
|
|
1623
|
+
cursor: pointer;
|
|
1624
|
+
display: block;
|
|
1625
|
+
background-size: cover;
|
|
1626
|
+
position: absolute;
|
|
1627
|
+
}
|
|
1628
|
+
._listItemUnchecked_arru1_68[dir='rtl']:before, ._listItemChecked_arru1_67[dir='rtl']:before {
|
|
1629
|
+
left: auto;
|
|
1630
|
+
right: 0;
|
|
1631
|
+
}
|
|
1632
|
+
._listItemUnchecked_arru1_68:focus:before, ._listItemChecked_arru1_67:focus:before {
|
|
1633
|
+
box-shadow: 0 0 0 2px var(--accentBgActive);
|
|
1634
|
+
border-radius: var(--radius-small);
|
|
1635
|
+
}
|
|
1636
|
+
._listItemUnchecked_arru1_68:before {
|
|
1637
|
+
border: 1px solid var(--baseBorder);
|
|
1638
|
+
border-radius: var(--radius-small);
|
|
1639
|
+
}
|
|
1640
|
+
._listItemChecked_arru1_67:before {
|
|
1641
|
+
border: 1px solid var(--accentBorder);
|
|
1642
|
+
border-radius: var(--radius-small);
|
|
1643
|
+
background-color: var(--accentSolid);
|
|
1644
|
+
background-repeat: no-repeat;
|
|
1645
|
+
}
|
|
1646
|
+
._listItemChecked_arru1_67:after {
|
|
1647
|
+
content: '';
|
|
1648
|
+
cursor: pointer;
|
|
1649
|
+
border-color: var(--baseBase);
|
|
1650
|
+
border-style: solid;
|
|
1651
|
+
position: absolute;
|
|
1652
|
+
display: block;
|
|
1653
|
+
top: var(--spacing-0_5);
|
|
1654
|
+
width: var(--spacing-1);
|
|
1655
|
+
left: var(--spacing-1_5);
|
|
1656
|
+
right: var(--spacing-1_5);
|
|
1657
|
+
height: var(--spacing-2);
|
|
1658
|
+
transform: rotate(45deg);
|
|
1659
|
+
border-width: 0 var(--spacing-0_5) var(--spacing-0_5) 0;
|
|
1660
|
+
}
|
|
1661
|
+
._admonitionDanger_arru1_136, ._admonitionInfo_arru1_136, ._admonitionNote_arru1_136, ._admonitionTip_arru1_136, ._admonitionCaution_arru1_136 {
|
|
1602
1662
|
padding: var(--spacing-2);
|
|
1603
1663
|
margin-top: var(--spacing-2);
|
|
1604
1664
|
margin-bottom: var(--spacing-2);
|
|
1605
1665
|
border-left: 3px solid var(--admonitionBorder);
|
|
1606
1666
|
background-color: var(--admonitionBg);
|
|
1607
1667
|
}
|
|
1608
|
-
.
|
|
1668
|
+
._admonitionInfo_arru1_136 {
|
|
1609
1669
|
--admonitionBorder: var(--admonitionInfoBorder);
|
|
1610
1670
|
--admonitionBg: var(--admonitionInfoBg);
|
|
1611
1671
|
}
|
|
1612
|
-
.
|
|
1672
|
+
._admonitionTip_arru1_136 {
|
|
1613
1673
|
--admonitionBorder: var(--admonitionTipBorder);
|
|
1614
1674
|
--admonitionBg: var(--admonitionTipBg);
|
|
1615
1675
|
}
|
|
1616
|
-
.
|
|
1676
|
+
._admonitionCaution_arru1_136 {
|
|
1617
1677
|
--admonitionBorder: var(--admonitionCautionBorder);
|
|
1618
1678
|
--admonitionBg: var(--admonitionCautionBg);
|
|
1619
1679
|
}
|
|
1620
|
-
.
|
|
1680
|
+
._admonitionDanger_arru1_136 {
|
|
1621
1681
|
--admonitionBorder: var(--admonitionDangerBorder);
|
|
1622
1682
|
--admonitionBg: var(--admonitionDangerBg);
|
|
1623
1683
|
}
|
|
1624
|
-
.
|
|
1684
|
+
._admonitionNote_arru1_136 {
|
|
1625
1685
|
--admonitionBorder: var(--admonitionNoteBorder);
|
|
1626
1686
|
--admonitionBg: var(--admonitionNoteBg);
|
|
1627
1687
|
}
|
|
@@ -1,19 +1,22 @@
|
|
|
1
|
-
const lightTheme = "_light-
|
|
2
|
-
const darkTheme = "_dark-
|
|
3
|
-
const bold = "
|
|
4
|
-
const italic = "
|
|
5
|
-
const underline = "
|
|
6
|
-
const strikethrough = "
|
|
7
|
-
const underlineStrikethrough = "
|
|
8
|
-
const subscript = "
|
|
9
|
-
const superscript = "
|
|
10
|
-
const code = "
|
|
11
|
-
const nestedListItem = "
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
1
|
+
const lightTheme = "_light-theme_arru1_1";
|
|
2
|
+
const darkTheme = "_dark-theme_arru1_1";
|
|
3
|
+
const bold = "_bold_arru1_10";
|
|
4
|
+
const italic = "_italic_arru1_14";
|
|
5
|
+
const underline = "_underline_arru1_18";
|
|
6
|
+
const strikethrough = "_strikethrough_arru1_34";
|
|
7
|
+
const underlineStrikethrough = "_underlineStrikethrough_arru1_38";
|
|
8
|
+
const subscript = "_subscript_arru1_42";
|
|
9
|
+
const superscript = "_superscript_arru1_47";
|
|
10
|
+
const code = "_code_arru1_52";
|
|
11
|
+
const nestedListItem = "_nestedListItem_arru1_59";
|
|
12
|
+
const listitem = "_listitem_arru1_63";
|
|
13
|
+
const listItemChecked = "_listItemChecked_arru1_67";
|
|
14
|
+
const listItemUnchecked = "_listItemUnchecked_arru1_68";
|
|
15
|
+
const admonitionDanger = "_admonitionDanger_arru1_136";
|
|
16
|
+
const admonitionInfo = "_admonitionInfo_arru1_136";
|
|
17
|
+
const admonitionNote = "_admonitionNote_arru1_136";
|
|
18
|
+
const admonitionTip = "_admonitionTip_arru1_136";
|
|
19
|
+
const admonitionCaution = "_admonitionCaution_arru1_136";
|
|
17
20
|
const styles = {
|
|
18
21
|
lightTheme,
|
|
19
22
|
darkTheme,
|
|
@@ -26,6 +29,9 @@ const styles = {
|
|
|
26
29
|
superscript,
|
|
27
30
|
code,
|
|
28
31
|
nestedListItem,
|
|
32
|
+
listitem,
|
|
33
|
+
listItemChecked,
|
|
34
|
+
listItemUnchecked,
|
|
29
35
|
admonitionDanger,
|
|
30
36
|
admonitionInfo,
|
|
31
37
|
admonitionNote,
|
|
@@ -44,6 +50,9 @@ export {
|
|
|
44
50
|
styles as default,
|
|
45
51
|
italic,
|
|
46
52
|
lightTheme,
|
|
53
|
+
listItemChecked,
|
|
54
|
+
listItemUnchecked,
|
|
55
|
+
listitem,
|
|
47
56
|
nestedListItem,
|
|
48
57
|
strikethrough,
|
|
49
58
|
subscript,
|
|
@@ -11,6 +11,9 @@ const lexicalTheme = {
|
|
|
11
11
|
underlineStrikethrough: styles.underlineStrikethrough
|
|
12
12
|
},
|
|
13
13
|
list: {
|
|
14
|
+
listitem: styles.listitem,
|
|
15
|
+
listitemChecked: styles.listItemChecked,
|
|
16
|
+
listitemUnchecked: styles.listItemUnchecked,
|
|
14
17
|
nested: {
|
|
15
18
|
listitem: styles.nestedListItem
|
|
16
19
|
}
|
package/package.json
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"private": false,
|
|
10
10
|
"sideEffects": false,
|
|
11
11
|
"type": "module",
|
|
12
|
-
"version": "1.
|
|
12
|
+
"version": "1.8.0",
|
|
13
13
|
"description": "React component for rich text markdown editing",
|
|
14
14
|
"scripts": {
|
|
15
15
|
"build": "vite build",
|
|
@@ -70,6 +70,7 @@
|
|
|
70
70
|
"mdast-util-from-markdown": "^1.3.0",
|
|
71
71
|
"mdast-util-frontmatter": "1.0.1",
|
|
72
72
|
"mdast-util-gfm-table": "^1.0.7",
|
|
73
|
+
"mdast-util-gfm-task-list-item": "1.0.2",
|
|
73
74
|
"mdast-util-mdx": "2.0.1",
|
|
74
75
|
"mdast-util-mdx-jsx": "^2.1.4",
|
|
75
76
|
"mdast-util-to-hast": "^12.3.0",
|
|
@@ -77,6 +78,7 @@
|
|
|
77
78
|
"micromark-extension-directive": "2.2.0",
|
|
78
79
|
"micromark-extension-frontmatter": "1.1.0",
|
|
79
80
|
"micromark-extension-gfm-table": "^1.0.6",
|
|
81
|
+
"micromark-extension-gfm-task-list-item": "1.0.5",
|
|
80
82
|
"micromark-extension-mdxjs": "1.0.1",
|
|
81
83
|
"react-hook-form": "^7.44.2",
|
|
82
84
|
"unidiff": "^1.0.2"
|