laif-ds
Version:
Design System di Laif con componenti React basati su principi di Atomic Design
151 lines (150 loc) • 7.06 kB
JavaScript
"use client";
import { jsx as r, jsxs as t, Fragment as s } from "react/jsx-runtime";
import { LexicalComposer as w } from "../../node_modules/@lexical/react/LexicalComposer.prod.js";
import { OnChangePlugin as L } from "../../node_modules/@lexical/react/LexicalOnChangePlugin.prod.js";
import { LexicalErrorBoundary as S } from "../../node_modules/@lexical/react/LexicalErrorBoundary.prod.js";
import { RichTextPlugin as T } from "../../node_modules/@lexical/react/LexicalRichTextPlugin.prod.js";
import { HeadingNode as j, QuoteNode as A } from "../../node_modules/@lexical/rich-text/LexicalRichText.prod.js";
import { ParagraphNode as d, TextNode as p, $getRoot as f } from "../../node_modules/lexical/Lexical.prod.js";
import { $convertToMarkdownString as B, $convertFromMarkdownString as H, TRANSFORMERS as C } from "../../node_modules/@lexical/markdown/LexicalMarkdown.prod.js";
import { useState as R, useEffect as $ } from "react";
import { useLexicalComposerContext as O } from "../../node_modules/@lexical/react/LexicalComposerContext.prod.js";
import { HistoryPlugin as z } from "../../node_modules/@lexical/react/LexicalHistoryPlugin.prod.js";
import { ContentEditable as D } from "../editor/editor-ui/content-editable.js";
import { ActionsPlugin as I } from "../editor/plugins/actions/actions-plugin.js";
import { ClearEditorActionPlugin as _ } from "../editor/plugins/actions/clear-editor-plugin.js";
import { ClearEditorPlugin as M } from "../../node_modules/@lexical/react/LexicalClearEditorPlugin.prod.js";
import { CounterCharacterPlugin as Q } from "../editor/plugins/actions/counter-character-plugin.js";
import { ToolbarPlugin as c } from "../editor/plugins/toolbar/toolbar-plugin.js";
import { BlockFormatDropDown as J } from "../editor/plugins/toolbar/block-format-toolbar-plugin.js";
import { FormatParagraph as U } from "../editor/plugins/toolbar/block-format/format-paragraph.js";
import { FormatHeading as q } from "../editor/plugins/toolbar/block-format/format-heading.js";
import { FormatNumberedList as G } from "../editor/plugins/toolbar/block-format/format-numbered-list.js";
import { FormatBulletedList as K } from "../editor/plugins/toolbar/block-format/format-bulleted-list.js";
import { FormatCheckList as W } from "../editor/plugins/toolbar/block-format/format-check-list.js";
import { FormatQuote as X } from "../editor/plugins/toolbar/block-format/format-quote.js";
import { FontFormatToolbarPlugin as l } from "../editor/plugins/toolbar/font-format-toolbar-plugin.js";
import { ListPlugin as Y } from "../../node_modules/@lexical/react/LexicalListPlugin.prod.js";
import { CheckListPlugin as Z } from "../../node_modules/@lexical/react/LexicalCheckListPlugin.prod.js";
import { ListNode as V, ListItemNode as rr } from "../../node_modules/@lexical/list/LexicalList.prod.js";
import { editorTheme as or } from "../editor/themes/editor-theme.js";
import { TooltipProvider as tr } from "./tooltip.js";
import { HistoryToolbarPlugin as er } from "../editor/plugins/toolbar/history-toolbar-plugin.js";
const ir = "Start typing...";
function nr({
defaultValue: o,
onlyMarkdown: i
}) {
const [n] = O();
return $(() => {
o && n.update(() => {
i ? H(o, C) : f().append(
new d().append(new p(o))
);
const a = f();
(a.getFirstChild() ?? a).selectStart();
});
}, [n, o, i]), null;
}
function zr({
defaultValue: o,
onMarkdownEdit: i,
plugins: n = [],
toolbars: a = [],
placeholder: N = ir,
onlyMarkdown: h = !0,
className: F = "overflow-hidden rounded-lg border border-d-border"
}) {
const [ar, P] = R(null), y = {
namespace: "AppEditor",
theme: or,
nodes: [
j,
d,
p,
A,
V,
rr
],
onError: (e) => {
console.error(e);
},
...o && !h ? {
editorState: () => {
f().append(
new d().append(new p(o))
);
}
} : {}
}, u = (e) => n.includes(e), m = (e) => a.includes(e), g = u("clear"), v = u("counter"), b = m("block-format"), E = m("font-format"), x = m("history");
return /* @__PURE__ */ r("div", { className: "bg-d-background", children: /* @__PURE__ */ r(w, { initialConfig: y, children: /* @__PURE__ */ t(tr, { children: [
o && /* @__PURE__ */ r(
nr,
{
defaultValue: o,
onlyMarkdown: h
}
),
/* @__PURE__ */ t("div", { className: "border-d-border flex items-center border-b", children: [
x && /* @__PURE__ */ r(c, { children: () => /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ r(er, {}) }) }),
b && /* @__PURE__ */ r(c, { children: () => /* @__PURE__ */ r(s, { children: /* @__PURE__ */ r("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: /* @__PURE__ */ t(J, { children: [
/* @__PURE__ */ r(U, {}),
/* @__PURE__ */ r(q, { levels: ["h1", "h2", "h3"] }),
/* @__PURE__ */ r(G, {}),
/* @__PURE__ */ r(K, {}),
/* @__PURE__ */ r(W, {}),
/* @__PURE__ */ r(X, {})
] }) }) }) }),
E && /* @__PURE__ */ r(c, { children: () => /* @__PURE__ */ t("div", { className: "vertical-align-middle sticky top-0 z-10 flex gap-2 overflow-auto p-1", children: [
/* @__PURE__ */ r(l, { format: "bold" }),
/* @__PURE__ */ r(l, { format: "italic" }),
/* @__PURE__ */ r(l, { format: "underline" }),
/* @__PURE__ */ r(l, { format: "strikethrough" })
] }) })
] }),
/* @__PURE__ */ t("div", { className: "relative", children: [
x && /* @__PURE__ */ r(z, {}),
/* @__PURE__ */ r(
T,
{
ErrorBoundary: S,
contentEditable: /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r("div", { ref: P, children: /* @__PURE__ */ r(
D,
{
placeholder: N,
className: `ContentEditable__root relative block h-72 min-h-full overflow-auto px-8 py-4 focus:outline-none ${F}`
}
) }) })
}
),
b && /* @__PURE__ */ t(s, { children: [
/* @__PURE__ */ r(Y, {}),
/* @__PURE__ */ r(Z, {})
] }),
(g || v) && /* @__PURE__ */ r(I, { children: /* @__PURE__ */ t("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: v && /* @__PURE__ */ r(Q, { charset: "UTF-16" }) }),
/* @__PURE__ */ r("div", { className: "flex flex-1 justify-end gap-2", children: g && /* @__PURE__ */ t(s, { children: [
/* @__PURE__ */ r(_, {}),
/* @__PURE__ */ r(M, {})
] }) })
] }) })
] }),
/* @__PURE__ */ r(
L,
{
ignoreSelectionChange: !0,
onChange: (e) => {
if (!i) return;
const k = e.read(
() => B(C)
);
i(k);
}
}
)
] }) }) });
}
export {
zr as AppEditor
};