@hachej/boring-workspace 0.1.6 → 0.1.7

package/dist/MarkdownEditor-BA37oZKg.js

@@ -1,458 +0,0 @@
-import { jsxs as T, jsx as i } from "react/jsx-runtime";
-import { useRef as v, useState as B, useEffect as L } from "react";
-import { ReactNodeViewRenderer as $, NodeViewWrapper as E, useEditor as z, EditorContent as P, useEditorState as D } from "@tiptap/react";
-import q from "@tiptap/starter-kit";
-import j from "@tiptap/extension-underline";
-import F from "@tiptap/extension-link";
-import S from "@tiptap/extension-placeholder";
-import W from "@tiptap/extension-task-list";
-import O from "@tiptap/extension-task-item";
-import V from "@tiptap/extension-text-align";
-import _ from "@tiptap/extension-highlight";
-import { Table as X } from "@tiptap/extension-table";
-import { TableRow as K } from "@tiptap/extension-table-row";
-import { TableHeader as Q } from "@tiptap/extension-table-header";
-import { TableCell as J } from "@tiptap/extension-table-cell";
-import Z from "@tiptap/extension-image";
-import { c as x } from "./utils-B6yFEsav.js";
-import { an as G, ao as Y } from "./CommandPalette-CdiVSPYz.js";
-import tt from "@tiptap/extension-code-block-lowlight";
-import { createLowlight as et, common as it } from "lowlight";
-import { Markdown as rt } from "@tiptap/markdown";
-import { BoldIcon as nt, ItalicIcon as at, UnderlineIcon as ot, StrikethroughIcon as lt, Heading1Icon as st, Heading2Icon as ct, Heading3Icon as ut, ListIcon as gt, ListOrderedIcon as dt, ListChecksIcon as ft, QuoteIcon as mt, CodeIcon as ht, LinkIcon as pt, ImageIcon as wt, HighlighterIcon as kt, AlignLeftIcon as bt, AlignCenterIcon as vt, AlignRightIcon as It, MinusIcon as xt } from "lucide-react";
-import { Toolbar as At, Input as Lt, ToolbarButton as Nt, ToolbarSeparator as Tt } from "@hachej/boring-ui-kit";
-const C = 64, y = 2e3;
-function Ct(t) {
-  return t.replace(/\\/g, "\\\\").replace(/]/g, "\\]");
-}
-function A(t) {
-  return t.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-}
-function R(t) {
-  if (typeof t == "number" && Number.isFinite(t) && t > 0) return t;
-  if (typeof t == "string" && t.trim()) {
-    const n = Number(t);
-    if (Number.isFinite(n) && n > 0) return n;
-  }
-  return null;
-}
-const yt = Z.extend({
-  name: "image",
-  draggable: !0,
-  parseMarkdown: (t, n) => n.createNode("image", {
-    src: t.href,
-    title: t.title,
-    alt: t.text
-  }),
-  renderMarkdown: (t) => {
-    var k, f, h, w, e, a, u;
-    const n = typeof ((k = t.attrs) == null ? void 0 : k.src) == "string" ? t.attrs.src : "", r = typeof ((f = t.attrs) == null ? void 0 : f.alt) == "string" ? t.attrs.alt : "", o = typeof ((h = t.attrs) == null ? void 0 : h.title) == "string" ? t.attrs.title : "", c = R((w = t.attrs) == null ? void 0 : w.width), d = R((e = t.attrs) == null ? void 0 : e.height), m = ((a = t.attrs) == null ? void 0 : a.align) === "center" || ((u = t.attrs) == null ? void 0 : u.align) === "right" ? t.attrs.align : "left";
-    if (!c && !d && m === "left") {
-      const s = Ct(r);
-      return o ? `![${s}](${n} "${o.replace(/"/g, '\\"')}")` : `![${s}](${n})`;
-    }
-    const l = `<img ${[
-      `src="${A(n)}"`,
-      r ? `alt="${A(r)}"` : null,
-      o ? `title="${A(o)}"` : null,
-      c ? `width="${c}"` : null,
-      d ? `height="${d}"` : null
-    ].filter(Boolean).join(" ")} />`;
-    return m === "center" || m === "right" ? `<p align="${m}">${l}</p>` : l;
-  },
-  addAttributes() {
-    var n;
-    return {
-      ...((n = this.parent) == null ? void 0 : n.call(this)) ?? {},
-      width: {
-        default: null,
-        parseHTML: (r) => {
-          const o = r.getAttribute("width");
-          if (o) {
-            const d = parseInt(o, 10);
-            return Number.isFinite(d) ? d : null;
-          }
-          const c = r.style.width;
-          if (c && c.endsWith("px")) {
-            const d = parseInt(c, 10);
-            return Number.isFinite(d) ? d : null;
-          }
-          return null;
-        },
-        renderHTML: (r) => r.width ? { width: String(r.width) } : {}
-      },
-      align: {
-        default: "left",
-        parseHTML: (r) => {
-          const o = r.getAttribute("data-align");
-          return o === "left" || o === "center" || o === "right" ? o : r.style.marginLeft === "auto" && r.style.marginRight === "auto" ? "center" : r.style.marginLeft === "auto" ? "right" : "left";
-        },
-        renderHTML: (r) => ({ "data-align": r.align ?? "left" })
-      }
-    };
-  },
-  addNodeView() {
-    return $(Rt);
-  }
-});
-function Rt({ node: t, updateAttributes: n, selected: r }) {
-  const o = v(null), c = v(null), [d, m] = B(!1), p = t.attrs.src ?? "", l = t.attrs.alt ?? "", k = t.attrs.title ?? void 0, f = t.attrs.width, h = t.attrs.align ?? "left";
-  L(() => {
-    if (!d) return;
-    const e = (u) => {
-      const s = c.current;
-      if (!s) return;
-      const I = u.clientX - s.x, U = Math.max(C, Math.min(y, s.width + I));
-      n({ width: Math.round(U) });
-    }, a = () => {
-      c.current = null, m(!1);
-    };
-    return window.addEventListener("pointermove", e), window.addEventListener("pointerup", a), window.addEventListener("pointercancel", a), () => {
-      window.removeEventListener("pointermove", e), window.removeEventListener("pointerup", a), window.removeEventListener("pointercancel", a);
-    };
-  }, [d, n]);
-  const w = (e) => {
-    var s;
-    e.preventDefault(), e.stopPropagation();
-    const a = (s = o.current) == null ? void 0 : s.querySelector("img"), u = f ?? (a == null ? void 0 : a.getBoundingClientRect().width) ?? 320;
-    c.current = { x: e.clientX, width: u }, m(!0);
-  };
-  return /* @__PURE__ */ T(
-    E,
-    {
-      ref: o,
-      "data-resizable-image": "",
-      "data-selected": r ? "true" : void 0,
-      className: x(
-        "relative block max-w-full align-baseline",
-        "[&>img]:block [&>img]:max-w-full [&>img]:h-auto [&>img]:rounded-md",
-        h === "left" && "mr-auto",
-        h === "center" && "mx-auto",
-        h === "right" && "ml-auto",
-        r && "ring-2 ring-[color:var(--accent)] ring-offset-1 ring-offset-background"
-      ),
-      style: { width: f ? `${f}px` : void 0 },
-      children: [
-        /* @__PURE__ */ i("img", { src: p, alt: l, title: k, draggable: !1 }),
-        /* @__PURE__ */ i(
-          "span",
-          {
-            role: "slider",
-            "aria-label": "Resize image",
-            "aria-valuenow": f ?? 0,
-            "aria-valuemin": C,
-            "aria-valuemax": y,
-            "data-testid": "resize-handle",
-            onPointerDown: w,
-            className: x(
-              "absolute right-0 bottom-0 h-3 w-3 translate-x-1/2 translate-y-1/2 cursor-nwse-resize",
-              "rounded-full border border-background bg-[color:var(--accent)] shadow",
-              "opacity-0 transition-opacity duration-150 ease-out",
-              (r || d) && "opacity-100"
-            )
-          }
-        )
-      ]
-    }
-  );
-}
-const Ht = et(it), Mt = [
-  /<script[\s>][\s\S]*?<\/script>/gi,
-  /<iframe[\s>][\s\S]*?<\/iframe>/gi,
-  /\s+on\w+\s*=\s*["'][^"']*["']/gi,
-  /\s+on\w+\s*=\s*\S+/gi,
-  /href\s*=\s*["']?\s*javascript:[^"'\s>]*/gi,
-  /src\s*=\s*["']?\s*javascript:[^"'\s>]*/gi
-];
-function Bt(t) {
-  let n = t;
-  for (const r of Mt)
-    n = n.replace(r, "");
-  return n;
-}
-const H = [
-  q.configure({
-    codeBlock: !1,
-    link: !1,
-    underline: !1
-  }),
-  j,
-  F.configure({
-    openOnClick: !0,
-    autolink: !0,
-    linkOnPaste: !0,
-    defaultProtocol: "https",
-    HTMLAttributes: { rel: "noopener noreferrer nofollow", target: "_blank" }
-  }),
-  S.configure({
-    placeholder: "Start writing..."
-  }),
-  W,
-  O.configure({ nested: !0 }),
-  V.configure({
-    types: ["heading", "paragraph"]
-  }),
-  _,
-  X.configure({
-    resizable: !0
-  }),
-  K,
-  Q,
-  J,
-  yt.configure({
-    inline: !1,
-    allowBase64: !0
-  }),
-  tt.configure({ lowlight: Ht }),
-  rt.configure({
-    markedOptions: {
-      gfm: !0,
-      breaks: !1,
-      pedantic: !1
-    }
-  })
-];
-function g({ onClick: t, active: n, disabled: r, title: o, children: c }) {
-  return /* @__PURE__ */ i(
-    Nt,
-    {
-      type: "button",
-      size: "icon-xs",
-      onClick: t,
-      disabled: r,
-      title: o,
-      "aria-pressed": n,
-      className: x(
-        "text-muted-foreground/70",
-        n && "bg-[color:var(--accent-soft)] text-[color:var(--accent)]"
-      ),
-      children: c
-    }
-  );
-}
-function b() {
-  return /* @__PURE__ */ i(Tt, { className: "mx-2 h-3.5" });
-}
-function M(t) {
-  const n = t.trim().toLowerCase();
-  return !n.startsWith("javascript:") && !n.startsWith("data:text/html");
-}
-function N(t) {
-  return new Promise((n, r) => {
-    const o = new FileReader();
-    o.onload = () => n(o.result), o.onerror = () => r(o.error ?? new Error("Read failed")), o.readAsDataURL(t);
-  });
-}
-function St(t, n) {
-  return `${t.replace(/\/$/, "")}${n}`;
-}
-async function Ut(t, n, r = {}) {
-  if (!n) return await N(t);
-  const o = await N(t), c = o.indexOf(","), d = c >= 0 ? o.slice(c + 1) : "", m = { "Content-Type": "application/json" };
-  r.workspaceRequestId && (m["x-boring-workspace-id"] = r.workspaceRequestId);
-  const p = await fetch(St(r.apiBaseUrl ?? "", "/api/v1/files/upload"), {
-    method: "POST",
-    headers: m,
-    credentials: "include",
-    body: JSON.stringify({
-      filename: t.name,
-      contentType: t.type,
-      contentBase64: d,
-      sourcePath: n
-    })
-  });
-  if (!p.ok) throw new Error(`Upload failed: ${p.status}`);
-  const l = await p.json();
-  return l.markdownUrl ?? l.path ?? o;
-}
-function $t({
-  editor: t,
-  documentPath: n,
-  apiBaseUrl: r,
-  workspaceRequestId: o,
-  rawMode: c,
-  onToggleRawMode: d
-}) {
-  const m = (e) => {
-    if (t) {
-      if (t.isActive("image")) {
-        t.chain().focus().updateAttributes("image", { align: e }).run();
-        return;
-      }
-      t.chain().focus().setTextAlign(e).run();
-    }
-  }, p = v(null), l = D({
-    editor: t,
-    selector: ({ editor: e }) => e ? {
-      bold: e.isActive("bold"),
-      italic: e.isActive("italic"),
-      underline: e.isActive("underline"),
-      strike: e.isActive("strike"),
-      h1: e.isActive("heading", { level: 1 }),
-      h2: e.isActive("heading", { level: 2 }),
-      h3: e.isActive("heading", { level: 3 }),
-      bulletList: e.isActive("bulletList"),
-      orderedList: e.isActive("orderedList"),
-      taskList: e.isActive("taskList"),
-      blockquote: e.isActive("blockquote"),
-      codeBlock: e.isActive("codeBlock"),
-      link: e.isActive("link"),
-      highlight: e.isActive("highlight"),
-      alignLeft: e.isActive("image") ? (e.getAttributes("image").align ?? "left") === "left" : e.isActive({ textAlign: "left" }),
-      alignCenter: e.isActive("image") ? e.getAttributes("image").align === "center" : e.isActive({ textAlign: "center" }),
-      alignRight: e.isActive("image") ? e.getAttributes("image").align === "right" : e.isActive({ textAlign: "right" })
-    } : null
-  });
-  if (!t || !l) return null;
-  const k = () => {
-    const e = window.prompt("URL:");
-    e && M(e) && t.chain().focus().extendMarkRange("link").setLink({ href: e }).run();
-  }, f = () => {
-    const e = window.prompt("Image URL:");
-    e && M(e) && t.chain().focus().setImage({ src: e }).run();
-  }, h = (e) => {
-    var a;
-    if (e != null && e.shiftKey) {
-      f();
-      return;
-    }
-    (a = p.current) == null || a.click();
-  }, w = async (e) => {
-    var u;
-    const a = (u = e.target.files) == null ? void 0 : u[0];
-    if (e.target.value = "", !(!a || !a.type.startsWith("image/")))
-      try {
-        const s = await Ut(a, n, { apiBaseUrl: r, workspaceRequestId: o });
-        t.chain().focus().setImage({ src: s, alt: a.name }).run();
-      } catch {
-        try {
-          const s = await N(a);
-          t.chain().focus().setImage({ src: s, alt: a.name }).run();
-        } catch {
-        }
-      }
-  };
-  return /* @__PURE__ */ T(At, { className: "border-b border-border/60 bg-background px-3 py-1.5", "aria-label": "Formatting toolbar", children: [
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleBold().run(), active: l.bold, title: "Bold", children: /* @__PURE__ */ i(nt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleItalic().run(), active: l.italic, title: "Italic", children: /* @__PURE__ */ i(at, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleUnderline().run(), active: l.underline, title: "Underline", children: /* @__PURE__ */ i(ot, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleStrike().run(), active: l.strike, title: "Strikethrough", children: /* @__PURE__ */ i(lt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(b, {}),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleHeading({ level: 1 }).run(), active: l.h1, title: "Heading 1", children: /* @__PURE__ */ i(st, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleHeading({ level: 2 }).run(), active: l.h2, title: "Heading 2", children: /* @__PURE__ */ i(ct, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleHeading({ level: 3 }).run(), active: l.h3, title: "Heading 3", children: /* @__PURE__ */ i(ut, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(b, {}),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleBulletList().run(), active: l.bulletList, title: "Bullet list", children: /* @__PURE__ */ i(gt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleOrderedList().run(), active: l.orderedList, title: "Ordered list", children: /* @__PURE__ */ i(dt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleTaskList().run(), active: l.taskList, title: "Task list", children: /* @__PURE__ */ i(ft, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(b, {}),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleBlockquote().run(), active: l.blockquote, title: "Quote", children: /* @__PURE__ */ i(mt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleCodeBlock().run(), active: l.codeBlock, title: "Code block", children: /* @__PURE__ */ i(ht, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: k, active: l.link, title: "Link", children: /* @__PURE__ */ i(pt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(
-      g,
-      {
-        onClick: h,
-        title: "Image (click to upload, Shift+click for URL)",
-        children: /* @__PURE__ */ i(wt, { className: "h-4 w-4" })
-      }
-    ),
-    /* @__PURE__ */ i(
-      Lt,
-      {
-        ref: p,
-        "data-testid": "image-file-input",
-        type: "file",
-        accept: "image/*",
-        className: "hidden",
-        onChange: w
-      }
-    ),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().toggleHighlight().run(), active: l.highlight, title: "Highlight", children: /* @__PURE__ */ i(kt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(b, {}),
-    /* @__PURE__ */ i(g, { onClick: () => m("left"), active: l.alignLeft, title: "Align left", children: /* @__PURE__ */ i(bt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => m("center"), active: l.alignCenter, title: "Center align", children: /* @__PURE__ */ i(vt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(g, { onClick: () => m("right"), active: l.alignRight, title: "Align right", children: /* @__PURE__ */ i(It, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(b, {}),
-    /* @__PURE__ */ i(g, { onClick: () => t.chain().focus().setHorizontalRule().run(), title: "Horizontal rule", children: /* @__PURE__ */ i(xt, { className: "h-4 w-4" }) }),
-    /* @__PURE__ */ i(b, {}),
-    /* @__PURE__ */ i(
-      g,
-      {
-        onClick: d,
-        active: c,
-        title: c ? "Rich text" : "Raw markdown",
-        children: /* @__PURE__ */ i("span", { className: "font-mono text-[10px] font-semibold leading-none tracking-[-0.02em]", children: "MD" })
-      }
-    )
-  ] });
-}
-function ae({
-  content: t,
-  onChange: n,
-  readOnly: r = !1,
-  placeholder: o,
-  className: c,
-  documentPath: d
-}) {
-  const m = G(), p = Y(), [l, k] = B(!1), f = v(n);
-  f.current = n;
-  const h = v(!1), w = t || { type: "doc", content: [{ type: "paragraph" }] }, e = t ? "markdown" : "json", a = z({
-    extensions: o ? [
-      ...H.filter((u) => u.name !== "placeholder"),
-      S.configure({ placeholder: o })
-    ] : H,
-    content: w,
-    contentType: e,
-    editable: !r,
-    editorProps: {
-      attributes: {
-        class: "tiptap-prose max-w-[68ch] px-8 py-6 focus:outline-none min-h-[200px]"
-      },
-      transformPastedHTML: Bt
-    },
-    onUpdate: ({ editor: u }) => {
-      var s, I;
-      h.current || (I = f.current) == null || I.call(f, ((s = u.getMarkdown) == null ? void 0 : s.call(u)) ?? u.getHTML());
-    }
-  });
-  return L(() => {
-    !a || a.isDestroyed || a.setEditable(!r);
-  }, [a, r]), L(() => {
-    var s;
-    !a || a.isDestroyed || (((s = a.getMarkdown) == null ? void 0 : s.call(a)) ?? a.getHTML()) === t || (h.current = !0, a.commands.setContent(w, { contentType: e }), h.current = !1);
-  }, [a, t]), /* @__PURE__ */ T("div", { className: x("flex h-full flex-col overflow-hidden", c), children: [
-    !r && /* @__PURE__ */ i(
-      $t,
-      {
-        editor: a,
-        documentPath: d,
-        apiBaseUrl: m,
-        workspaceRequestId: p,
-        rawMode: l,
-        onToggleRawMode: () => k((u) => !u)
-      }
-    ),
-    /* @__PURE__ */ i("div", { className: "flex-1 overflow-auto", children: l && !r ? /* @__PURE__ */ i(
-      "textarea",
-      {
-        "aria-label": "Raw markdown",
-        "data-testid": "markdown-raw-editor",
-        className: "h-full min-h-[200px] w-full resize-none bg-background px-8 py-6 font-mono text-[13px] leading-6 text-foreground outline-none placeholder:text-muted-foreground/70",
-        value: t,
-        placeholder: o,
-        spellCheck: !1,
-        onChange: (u) => {
-          var s;
-          return (s = f.current) == null ? void 0 : s.call(f, u.target.value);
-        }
-      }
-    ) : /* @__PURE__ */ i(P, { editor: a }) })
-  ] });
-}
-export {
-  ae as MarkdownEditor,
-  M as isSafeUrl,
-  N as readFileAsDataUrl,
-  Bt as sanitizeHtml
-};