laif-ds 1.1.4 → 1.2.0

package/dist/components/ui/app-editor.js

@@ -1,231 +1,243 @@
 "use client";
-import { jsx as r, jsxs as n, Fragment as u } from "react/jsx-runtime";
-import { LinkNode as U } from "../../node_modules/@lexical/link/dist/LexicalLink.prod.js";
-import { ListNode as _, ListItemNode as Q } from "../../node_modules/@lexical/list/dist/LexicalList.prod.js";
-import { TRANSFORMERS as K, $convertToMarkdownString as W, $convertFromMarkdownString as Z } from "../../node_modules/@lexical/markdown/dist/LexicalMarkdown.prod.js";
-import { CheckListPlugin as q } from "../../node_modules/@lexical/react/dist/LexicalCheckListPlugin.prod.js";
-import { ClearEditorPlugin as G } from "../../node_modules/@lexical/react/dist/LexicalClearEditorPlugin.prod.js";
-import { LexicalComposer as J } from "../../node_modules/@lexical/react/dist/LexicalComposer.prod.js";
+import { jsx as r, jsxs as n, Fragment as h } from "react/jsx-runtime";
+import "../../node_modules/@lexical/code-prism/dist/LexicalCodePrism.prod.js";
+import { CodeNode as _ } from "../../node_modules/@lexical/code-core/dist/LexicalCodeCore.prod.js";
+import { LinkNode as Q } from "../../node_modules/@lexical/link/dist/LexicalLink.prod.js";
+import { ListNode as K, ListItemNode as W } from "../../node_modules/@lexical/list/dist/LexicalList.prod.js";
+import { TRANSFORMERS as Z, $convertToMarkdownString as q, $convertFromMarkdownString as G } from "../../node_modules/@lexical/markdown/dist/LexicalMarkdown.prod.js";
+import { CheckListPlugin as J } from "../../node_modules/@lexical/react/dist/LexicalCheckListPlugin.prod.js";
+import { ClearEditorPlugin as X } from "../../node_modules/@lexical/react/dist/LexicalClearEditorPlugin.prod.js";
+import { LexicalComposer as Y } from "../../node_modules/@lexical/react/dist/LexicalComposer.prod.js";
 import { useLexicalComposerContext as L } from "../../node_modules/@lexical/react/dist/LexicalComposerContext.prod.js";
-import { LexicalErrorBoundary as X } from "../../node_modules/@lexical/react/dist/LexicalErrorBoundary.prod.js";
-import { HistoryPlugin as Y } from "../../node_modules/@lexical/react/dist/LexicalHistoryPlugin.prod.js";
-import { ListPlugin as V } from "../../node_modules/@lexical/react/dist/LexicalListPlugin.prod.js";
-import { OnChangePlugin as rr } from "../../node_modules/@lexical/react/dist/LexicalOnChangePlugin.prod.js";
-import { RichTextPlugin as or } from "../../node_modules/@lexical/react/dist/LexicalRichTextPlugin.prod.js";
-import { HeadingNode as er, QuoteNode as tr } from "../../node_modules/@lexical/rich-text/dist/LexicalRichText.prod.js";
-import { ParagraphNode as g, TextNode as h, $nodesOfType as ir, $getRoot as N } from "../../node_modules/lexical/dist/Lexical.prod.js";
-import { forwardRef as nr, useState as lr, useMemo as ar, useImperativeHandle as sr, useEffect as mr } from "react";
-import { ContentEditable as cr } from "../editor/editor-ui/content-editable.js";
+import { LexicalErrorBoundary as V } from "../../node_modules/@lexical/react/dist/LexicalErrorBoundary.prod.js";
+import { HistoryPlugin as rr } from "../../node_modules/@lexical/react/dist/LexicalHistoryPlugin.prod.js";
+import { ListPlugin as or } from "../../node_modules/@lexical/react/dist/LexicalListPlugin.prod.js";
+import { OnChangePlugin as er } from "../../node_modules/@lexical/react/dist/LexicalOnChangePlugin.prod.js";
+import { RichTextPlugin as tr } from "../../node_modules/@lexical/react/dist/LexicalRichTextPlugin.prod.js";
+import { HeadingNode as ir, QuoteNode as nr } from "../../node_modules/@lexical/rich-text/dist/LexicalRichText.prod.js";
+import { ParagraphNode as N, TextNode as v, $nodesOfType as lr, $getRoot as b } from "../../node_modules/lexical/dist/Lexical.prod.js";
+import { forwardRef as ar, useState as sr, useMemo as mr, useImperativeHandle as cr, useEffect as dr } from "react";
+import { ContentEditable as pr } from "../editor/editor-ui/content-editable.js";
 import { MentionNode as k } from "../editor/nodes/mention-node.js";
-import { ActionsPlugin as dr } from "../editor/plugins/actions/actions-plugin.js";
-import { ClearEditorActionPlugin as pr } from "../editor/plugins/actions/clear-editor-plugin.js";
-import { CounterCharacterPlugin as fr } from "../editor/plugins/actions/counter-character-plugin.js";
-import { MENTION_TRANSFORMER as ur, MentionPlugin as gr, collectMentions as hr } from "../editor/plugins/mention-plugin.js";
-import { FormatBulletedList as Nr } from "../editor/plugins/toolbar/block-format/format-bulleted-list.js";
-import { FormatCheckList as br } from "../editor/plugins/toolbar/block-format/format-check-list.js";
-import { FormatHeading as vr } from "../editor/plugins/toolbar/block-format/format-heading.js";
-import { FormatNumberedList as xr } from "../editor/plugins/toolbar/block-format/format-numbered-list.js";
-import { FormatParagraph as Er } from "../editor/plugins/toolbar/block-format/format-paragraph.js";
-import { FormatQuote as Fr } from "../editor/plugins/toolbar/block-format/format-quote.js";
-import { BlockFormatDropDown as Pr } from "../editor/plugins/toolbar/block-format-toolbar-plugin.js";
+import { ActionsPlugin as fr } from "../editor/plugins/actions/actions-plugin.js";
+import { ClearEditorActionPlugin as ur } from "../editor/plugins/actions/clear-editor-plugin.js";
+import { CounterCharacterPlugin as gr } from "../editor/plugins/actions/counter-character-plugin.js";
+import { MENTION_TRANSFORMER as hr, MentionPlugin as Nr, collectMentions as vr } from "../editor/plugins/mention-plugin.js";
+import { PasteMarkdownPlugin as br } from "../editor/plugins/paste-markdown-plugin.js";
+import { FormatBulletedList as xr } from "../editor/plugins/toolbar/block-format/format-bulleted-list.js";
+import { FormatCheckList as Er } from "../editor/plugins/toolbar/block-format/format-check-list.js";
+import { FormatHeading as Fr } from "../editor/plugins/toolbar/block-format/format-heading.js";
+import { FormatNumberedList as Pr } from "../editor/plugins/toolbar/block-format/format-numbered-list.js";
+import { FormatParagraph as Cr } from "../editor/plugins/toolbar/block-format/format-paragraph.js";
+import { FormatQuote as Rr } from "../editor/plugins/toolbar/block-format/format-quote.js";
+import { BlockFormatDropDown as yr } from "../editor/plugins/toolbar/block-format-toolbar-plugin.js";
 import { FontFormatToolbarPlugin as m } from "../editor/plugins/toolbar/font-format-toolbar-plugin.js";
-import { LinkToolbarPlugin as yr, $insertLink as Rr } from "../editor/plugins/toolbar/link-toolbar-plugin.js";
-import { MentionInsertToolbarPlugin as Cr } from "../editor/plugins/toolbar/mention-insert-toolbar-plugin.js";
+import { LinkToolbarPlugin as Tr, $insertLink as kr } from "../editor/plugins/toolbar/link-toolbar-plugin.js";
+import { MentionInsertToolbarPlugin as wr } from "../editor/plugins/toolbar/mention-insert-toolbar-plugin.js";
 import { ToolbarPlugin as f } from "../editor/plugins/toolbar/toolbar-plugin.js";
-import { editorTheme as Tr } from "../editor/themes/editor-theme.js";
-import { TooltipProvider as kr } from "./tooltip.js";
-import { HistoryToolbarPlugin as wr } from "../editor/plugins/toolbar/history-toolbar-plugin.js";
-import { cn as Lr } from "../../lib/utils.js";
-const Sr = "Start typing...", Ar = {
+import { editorTheme as Lr } from "../editor/themes/editor-theme.js";
+import { TooltipProvider as Sr } from "./tooltip.js";
+import { HistoryToolbarPlugin as Ar } from "../editor/plugins/toolbar/history-toolbar-plugin.js";
+import { cn as Mr } from "../../lib/utils.js";
+const $r = "Start typing...", Ir = {
   format: ["underline"],
   tag: "++",
   type: "text-format"
 }, w = [
-  ...K,
-  Ar
-], Mr = (o) => o.replace(/<u>(.*?)<\/u>/g, "++$1++"), $r = (o) => o.replace(/\+\+(.+?)\+\+/g, "<u>$1</u>");
-function Ir({
+  ...Z,
+  Ir
+], S = (o) => o.replace(/<u>(.*?)<\/u>/g, "++$1++"), Or = (o) => o.replace(/\+\+(.+?)\+\+/g, "<u>$1</u>");
+function Hr({
   handleRef: o
 }) {
   const [e] = L();
-  return sr(
+  return cr(
     o,
     () => ({
       insertLink: (t, a) => {
-        e.focus(), e.update(() => Rr(t, a));
+        e.focus(), e.update(() => kr(t, a));
       }
     }),
     [e]
   ), null;
 }
-function Or({
+function jr({
   defaultValue: o,
   onlyMarkdown: e,
   transformers: t
 }) {
   const [a] = L();
-  return mr(() => {
+  return dr(() => {
     o && a.update(() => {
-      e ? Z(
-        Mr(o),
+      e ? G(
+        S(o),
         t
-      ) : N().append(
-        new g().append(new h(o))
+      ) : b().append(
+        new N().append(new v(o))
       );
-      const c = N();
+      const c = b();
       (c.getFirstChild() ?? c).selectStart();
     });
   }, [a, o, e, t]), null;
 }
-function Hr({
+function Br({
   defaultValue: o,
   onMarkdownEdit: e,
   onValueChange: t,
   plugins: a = [],
   toolbars: c = [],
-  placeholder: S = Sr,
-  onlyMarkdown: b = !0,
-  className: A = "rounded-lg border border-d-border",
-  wrpClassName: M = "",
+  placeholder: A = $r,
+  onlyMarkdown: u = !0,
+  className: M = "rounded-lg border border-d-border",
+  wrpClassName: $ = "",
   mentions: d,
-  mentionTrigger: v = "@"
-}, $) {
-  const [, I] = lr(null), s = d !== void 0, x = ar(
-    () => s ? [ur, ...w] : w,
+  mentionTrigger: x = "@"
+}, I) {
+  const [, O] = sr(null), s = d !== void 0, g = mr(
+    () => s ? [hr, ...w] : w,
     [s]
-  ), O = {
+  ), H = {
     namespace: "AppEditor",
-    theme: Tr,
+    theme: Lr,
     nodes: [
-      er,
-      g,
-      h,
-      tr,
-      _,
+      ir,
+      N,
+      v,
+      nr,
+      K,
+      W,
+      // Required by the Markdown LINK and CODE transformers: without them a
+      // link or a fenced block in `defaultValue` (or in a paste) throws and
+      // leaves the editor empty.
       Q,
-      // TRANSFORMERS includes the Markdown LINK transformer, which needs this
-      // node to import `[text](url)` from `defaultValue`.
-      U,
+      _,
       ...s ? [k] : []
     ],
     onError: (i) => {
       console.error(i);
     },
-    ...o && !b ? {
+    ...o && !u ? {
       editorState: () => {
-        N().append(
-          new g().append(new h(o))
+        b().append(
+          new N().append(new v(o))
         );
       }
     } : {}
-  }, E = (i) => a.includes(i), p = (i) => c.includes(i), F = E("clear"), P = E("counter"), y = p("block-format"), H = p("font-format"), R = p("history"), j = p("link");
-  return /* @__PURE__ */ r("div", { className: Lr("bg-d-background flex h-96 flex-col", M), children: /* @__PURE__ */ r(J, { initialConfig: O, children: /* @__PURE__ */ n(kr, { children: [
-    /* @__PURE__ */ r(Ir, { handleRef: $ }),
+  }, E = (i) => a.includes(i), p = (i) => c.includes(i), F = E("clear"), P = E("counter"), C = p("block-format"), j = p("font-format"), R = p("history"), B = p("link");
+  return /* @__PURE__ */ r("div", { className: Mr("bg-d-background flex h-96 flex-col", $), children: /* @__PURE__ */ r(Y, { initialConfig: H, children: /* @__PURE__ */ n(Sr, { children: [
+    /* @__PURE__ */ r(Hr, { handleRef: I }),
     o && /* @__PURE__ */ r(
-      Or,
+      jr,
       {
         defaultValue: o,
-        onlyMarkdown: b,
-        transformers: x
+        onlyMarkdown: u,
+        transformers: g
       }
     ),
-    s && /* @__PURE__ */ r(gr, { source: d, trigger: v }),
+    u && /* @__PURE__ */ r(
+      br,
+      {
+        transformers: g,
+        preprocess: S
+      }
+    ),
+    s && /* @__PURE__ */ r(Nr, { source: d, trigger: x }),
     /* @__PURE__ */ n("div", { className: "border-d-border flex items-center border-b", children: [
-      R && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ r(wr, {}) }) }),
-      y && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ n(Pr, { children: [
-        /* @__PURE__ */ r(Er, {}),
-        /* @__PURE__ */ r(vr, { levels: ["h1", "h2", "h3"] }),
+      R && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ r(Ar, {}) }) }),
+      C && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ n(yr, { children: [
+        /* @__PURE__ */ r(Cr, {}),
+        /* @__PURE__ */ r(Fr, { levels: ["h1", "h2", "h3"] }),
+        /* @__PURE__ */ r(Pr, {}),
         /* @__PURE__ */ r(xr, {}),
-        /* @__PURE__ */ r(Nr, {}),
-        /* @__PURE__ */ r(br, {}),
-        /* @__PURE__ */ r(Fr, {})
+        /* @__PURE__ */ r(Er, {}),
+        /* @__PURE__ */ r(Rr, {})
       ] }) }) }) }),
-      H && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ n("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: [
+      j && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ n("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: [
         /* @__PURE__ */ r(m, { format: "bold" }),
         /* @__PURE__ */ r(m, { format: "italic" }),
         /* @__PURE__ */ r(m, { format: "underline" }),
         /* @__PURE__ */ r(m, { format: "strikethrough" }),
         /* @__PURE__ */ r(m, { format: "code" }),
         s && /* @__PURE__ */ r(
-          Cr,
+          wr,
           {
-            trigger: v ?? "@"
+            trigger: x ?? "@"
           }
         )
       ] }) }),
-      j && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ r(yr, {}) }) })
+      B && /* @__PURE__ */ r(f, { children: () => /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ r(Tr, {}) }) })
     ] }),
     /* @__PURE__ */ n("div", { className: "relative flex min-h-0 w-full flex-1 flex-col", children: [
-      R && /* @__PURE__ */ r(Y, {}),
+      R && /* @__PURE__ */ r(rr, {}),
       /* @__PURE__ */ r(
-        or,
+        tr,
         {
-          ErrorBoundary: X,
+          ErrorBoundary: V,
           contentEditable: /* @__PURE__ */ r(
             "div",
             {
-              ref: I,
+              ref: O,
               className: "flex min-h-0 w-full flex-1 overflow-auto",
               children: /* @__PURE__ */ r(
-                cr,
+                pr,
                 {
-                  placeholder: S,
-                  className: `border-d-border w-full rounded-none border-b ${A}`
+                  placeholder: A,
+                  className: `border-d-border w-full rounded-none border-b ${M}`
                 }
               )
             }
           )
         }
       ),
-      y && /* @__PURE__ */ n(u, { children: [
-        /* @__PURE__ */ r(V, {}),
-        /* @__PURE__ */ r(q, {})
+      C && /* @__PURE__ */ n(h, { children: [
+        /* @__PURE__ */ r(or, {}),
+        /* @__PURE__ */ r(J, {})
       ] }),
-      (F || P) && /* @__PURE__ */ r(dr, { children: /* @__PURE__ */ n("div", { className: "clear-both flex items-center justify-between gap-2 p-1", children: [
+      (F || P) && /* @__PURE__ */ r(fr, { children: /* @__PURE__ */ n("div", { className: "clear-both flex items-center justify-between gap-2 p-1", children: [
         /* @__PURE__ */ r("div", { className: "flex flex-1 justify-start" }),
-        /* @__PURE__ */ r("div", { children: P && /* @__PURE__ */ r(fr, { charset: "UTF-16" }) }),
-        /* @__PURE__ */ r("div", { className: "flex flex-1 justify-end gap-2", children: F && /* @__PURE__ */ n(u, { children: [
-          /* @__PURE__ */ r(pr, {}),
-          /* @__PURE__ */ r(G, {})
+        /* @__PURE__ */ r("div", { children: P && /* @__PURE__ */ r(gr, { charset: "UTF-16" }) }),
+        /* @__PURE__ */ r("div", { className: "flex flex-1 justify-end gap-2", children: F && /* @__PURE__ */ n(h, { children: [
+          /* @__PURE__ */ r(ur, {}),
+          /* @__PURE__ */ r(X, {})
         ] }) })
       ] }) })
     ] }),
     /* @__PURE__ */ r(
-      rr,
+      er,
       {
         ignoreSelectionChange: !0,
         onChange: (i) => {
           if (!t && !e) return;
-          const C = $r(
-            i.read(() => W(x))
+          const y = Or(
+            i.read(() => q(g))
           );
           if (!t) {
-            e?.(C);
+            e?.(y);
             return;
           }
           let T = [];
           if (s) {
-            const B = i.read(
-              () => hr(ir(k))
-            ), z = Array.isArray(d) ? d : [], D = new Map(
-              z.map((l) => [String(l.id), l])
+            const z = i.read(
+              () => vr(lr(k))
+            ), D = Array.isArray(d) ? d : [], U = new Map(
+              D.map((l) => [String(l.id), l])
             );
-            T = B.map(
-              (l) => D.get(String(l.id)) ?? {
+            T = z.map(
+              (l) => U.get(String(l.id)) ?? {
                 id: l.id,
                 label: l.label,
                 value: l.value
               }
             );
           }
-          t(C, { mentions: T });
+          t(y, { mentions: T });
         }
       }
     )
   ] }) }) });
 }
-const jr = nr(Hr);
-jr.displayName = "AppEditor";
+const zr = ar(Br);
+zr.displayName = "AppEditor";
 export {
-  jr as AppEditor
+  zr as AppEditor
 };