@bayonai/rich-text-editor 0.1.2

package/dist-cjs/react/RichTextIcons.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AddIcon = AddIcon;
+exports.BoldIcon = BoldIcon;
+exports.CloseIcon = CloseIcon;
+exports.CopyIcon = CopyIcon;
+exports.CodeIcon = CodeIcon;
+exports.CutIcon = CutIcon;
+exports.DataObjectIcon = DataObjectIcon;
+exports.DeleteIcon = DeleteIcon;
+exports.DividerIcon = DividerIcon;
+exports.DragHandleIcon = DragHandleIcon;
+exports.ImageIcon = ImageIcon;
+exports.ItalicIcon = ItalicIcon;
+exports.LinkIcon = LinkIcon;
+exports.MicIcon = MicIcon;
+exports.QuoteIcon = QuoteIcon;
+exports.StopIcon = StopIcon;
+exports.TitleIcon = TitleIcon;
+const jsx_runtime_1 = require("react/jsx-runtime");
+function IconSvg({ children, className, size = 18, viewBox = "0 0 24 24", }) {
+    return ((0, jsx_runtime_1.jsx)("svg", { "aria-hidden": "true", className: className, fill: "none", height: size, viewBox: viewBox, width: size, children: children }));
+}
+function AddIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M12 5v14M5 12h14", stroke: "currentColor", strokeWidth: "2" }) }));
+}
+function BoldIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M8 5h5.2a3.1 3.1 0 0 1 0 6.2H8zm0 6.2h6a3.4 3.4 0 0 1 0 6.8H8z", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
+}
+function CloseIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "m6 6 12 12M18 6 6 18", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" }) }));
+}
+function CopyIcon(props) {
+    return ((0, jsx_runtime_1.jsxs)(IconSvg, { ...props, children: [(0, jsx_runtime_1.jsx)("rect", { height: "11", rx: "1.8", stroke: "currentColor", strokeWidth: "2", width: "9", x: "9", y: "7" }), (0, jsx_runtime_1.jsx)("path", { d: "M6 15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v1", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" })] }));
+}
+function CodeIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "m9 8-4 4 4 4m6-8 4 4-4 4", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
+}
+function CutIcon(props) {
+    return ((0, jsx_runtime_1.jsxs)(IconSvg, { ...props, children: [(0, jsx_runtime_1.jsx)("circle", { cx: "6", cy: "6", r: "2.2", stroke: "currentColor", strokeWidth: "2" }), (0, jsx_runtime_1.jsx)("circle", { cx: "6", cy: "18", r: "2.2", stroke: "currentColor", strokeWidth: "2" }), (0, jsx_runtime_1.jsx)("path", { d: "M8 8 20 20M8 16 20 4", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" })] }));
+}
+function DataObjectIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M8 4H7a3 3 0 0 0-3 3v2a2 2 0 0 1-2 2 2 2 0 0 1 2 2v2a3 3 0 0 0 3 3h1m8-14h1a3 3 0 0 1 3 3v2a2 2 0 0 0 2 2 2 2 0 0 0-2 2v2a3 3 0 0 1-3 3h-1", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
+}
+function DeleteIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M5 7h14m-11 0V5a1.5 1.5 0 0 1 1.5-1.5h5A1.5 1.5 0 0 1 16 5v2m-8 0 .6 12h6.8L16 7", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
+}
+function DividerIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M5 12h14", stroke: "currentColor", strokeWidth: "2" }) }));
+}
+function DragHandleIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M9 6h.01M15 6h.01M9 12h.01M15 12h.01M9 18h.01M15 18h.01", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "3" }) }));
+}
+function ImageIcon(props) {
+    return ((0, jsx_runtime_1.jsxs)(IconSvg, { ...props, children: [(0, jsx_runtime_1.jsx)("rect", { height: "14", rx: "2", stroke: "currentColor", strokeWidth: "2", width: "16", x: "4", y: "5" }), (0, jsx_runtime_1.jsx)("path", { d: "m7 16 3.5-3.5 2.5 2.5 2-2 2 3", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }), (0, jsx_runtime_1.jsx)("circle", { cx: "15.5", cy: "8.5", fill: "currentColor", r: "1.2" })] }));
+}
+function ItalicIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M10 5h7M7 19h7m-1-14-4 14", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" }) }));
+}
+function LinkIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "m10 13 4-4m-3.5-3.5 1.2-1.2a4 4 0 0 1 5.7 5.7L16 11.4m-2.5 7.1-1.2 1.2a4 4 0 0 1-5.7-5.7L8 12.6", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
+}
+function MicIcon(props) {
+    return ((0, jsx_runtime_1.jsxs)(IconSvg, { ...props, children: [(0, jsx_runtime_1.jsx)("path", { d: "M12 4a3 3 0 0 0-3 3v5a3 3 0 0 0 6 0V7a3 3 0 0 0-3-3Z", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }), (0, jsx_runtime_1.jsx)("path", { d: "M5 11a7 7 0 0 0 14 0M12 18v3m-3 0h6", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" })] }));
+}
+function QuoteIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M9 7H6.5A2.5 2.5 0 0 0 4 9.5V17h5v-5H6.5v-1.5H9zm11 0h-2.5A2.5 2.5 0 0 0 15 9.5V17h5v-5h-2.5v-1.5H20z", fill: "currentColor" }) }));
+}
+function StopIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("rect", { fill: "currentColor", height: "12", rx: "2", width: "12", x: "6", y: "6" }) }));
+}
+function TitleIcon(props) {
+    return ((0, jsx_runtime_1.jsx)(IconSvg, { ...props, children: (0, jsx_runtime_1.jsx)("path", { d: "M5 6h14M12 6v12m-4 0h8", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" }) }));
+}

package/dist-cjs/react/RichTextRenderedBlock.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RichTextRenderedBlock = RichTextRenderedBlock;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const richText_1 = require("../richText");
+// Renders one stored rich-text block as display-only journal content.
+function RichTextRenderedBlock({ block }) {
+    if (block.type === "divider") {
+        return (0, jsx_runtime_1.jsx)("hr", { className: "bayon-rte-divider" });
+    }
+    if (block.type === "image") {
+        return ((0, jsx_runtime_1.jsx)("figure", { "data-placeholder": "image", children: block.assetId ? null : (0, jsx_runtime_1.jsx)("p", { children: "Image placeholder" }) }));
+    }
+    if (block.type === "code") {
+        return ((0, jsx_runtime_1.jsx)("pre", { children: (0, jsx_runtime_1.jsx)("code", { children: block.text }) }));
+    }
+    if (block.type === "checkbox") {
+        return ((0, jsx_runtime_1.jsxs)("div", { "data-rich-text-checkbox": "", children: [(0, jsx_runtime_1.jsx)("input", { checked: block.checked, readOnly: true, type: "checkbox" }), (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: {
+                        __html: (0, richText_1.markdownToEditorHtml)(block.markdown) || " ",
+                    } })] }));
+    }
+    const component = block.type === "heading"
+        ? "h2"
+        : block.type === "quote"
+            ? "blockquote"
+            : "p";
+    const props = {
+        dangerouslySetInnerHTML: {
+            __html: (0, richText_1.markdownToEditorHtml)(block.markdown) || " ",
+        },
+    };
+    if (component === "h2") {
+        return (0, jsx_runtime_1.jsx)("h2", { ...props });
+    }
+    if (component === "blockquote") {
+        return (0, jsx_runtime_1.jsx)("blockquote", { ...props });
+    }
+    return (0, jsx_runtime_1.jsx)("p", { ...props });
+}

package/dist-cjs/react/RichTextRenderer.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RichTextRenderer = RichTextRenderer;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const RichTextRenderedBlock_1 = require("./RichTextRenderedBlock");
+const richText_1 = require("../richText");
+const RichTextStyles_1 = require("./RichTextStyles");
+// Renders a sanitized collection of rich-text blocks for read-only views.
+function RichTextRenderer({ contentBlocks, }) {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(RichTextStyles_1.RichTextStyleScope, {}), (0, jsx_runtime_1.jsx)("div", { className: "bayon-rte-renderer", children: (0, richText_1.sanitizeRichTextBlocks)(contentBlocks).map((block) => ((0, jsx_runtime_1.jsx)(RichTextRenderedBlock_1.RichTextRenderedBlock, { block: block }, block.id))) })] }));
+}