scrible 1.0.0

package/dist/scrible.es.js

@@ -0,0 +1,1446 @@
+import $e, { useState as M, useCallback as y, useEffect as U, useRef as se, useMemo as Le } from "react";
+import { Editor as u, Transforms as g, Element as T, Range as A, Point as ue, Text as He, createEditor as Ie } from "slate";
+import { useSlate as re, useSelected as Pe, useFocused as De, ReactEditor as he, withReact as Oe, Slate as Be, Editable as Ve } from "slate-react";
+import { withHistory as Fe } from "slate-history";
+import D from "escape-html";
+var O = { exports: {} }, S = {};
+var de;
+function Ue() {
+  if (de) return S;
+  de = 1;
+  var e = Symbol.for("react.transitional.element"), t = Symbol.for("react.fragment");
+  function s(n, a, c) {
+    var o = null;
+    if (c !== void 0 && (o = "" + c), a.key !== void 0 && (o = "" + a.key), "key" in a) {
+      c = {};
+      for (var i in a)
+        i !== "key" && (c[i] = a[i]);
+    } else c = a;
+    return a = c.ref, {
+      $$typeof: e,
+      type: n,
+      key: o,
+      ref: a !== void 0 ? a : null,
+      props: c
+    };
+  }
+  return S.Fragment = t, S.jsx = s, S.jsxs = s, S;
+}
+var $ = {};
+var me;
+function We() {
+  return me || (me = 1, process.env.NODE_ENV !== "production" && (function() {
+    function e(l) {
+      if (l == null) return null;
+      if (typeof l == "function")
+        return l.$$typeof === _e ? null : l.displayName || l.name || null;
+      if (typeof l == "string") return l;
+      switch (l) {
+        case E:
+          return "Fragment";
+        case R:
+          return "Profiler";
+        case N:
+          return "StrictMode";
+        case ze:
+          return "Suspense";
+        case Me:
+          return "SuspenseList";
+        case Te:
+          return "Activity";
+      }
+      if (typeof l == "object")
+        switch (typeof l.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), l.$$typeof) {
+          case z:
+            return "Portal";
+          case Ne:
+            return l.displayName || "Context";
+          case W:
+            return (l._context.displayName || "Context") + ".Consumer";
+          case Ee:
+            var m = l.render;
+            return l = l.displayName, l || (l = m.displayName || m.name || "", l = l !== "" ? "ForwardRef(" + l + ")" : "ForwardRef"), l;
+          case Re:
+            return m = l.displayName || null, m !== null ? m : e(l.type) || "Memo";
+          case q:
+            m = l._payload, l = l._init;
+            try {
+              return e(l(m));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function t(l) {
+      return "" + l;
+    }
+    function s(l) {
+      try {
+        t(l);
+        var m = !1;
+      } catch {
+        m = !0;
+      }
+      if (m) {
+        m = console;
+        var v = m.error, w = typeof Symbol == "function" && Symbol.toStringTag && l[Symbol.toStringTag] || l.constructor.name || "Object";
+        return v.call(
+          m,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          w
+        ), t(l);
+      }
+    }
+    function n(l) {
+      if (l === E) return "<>";
+      if (typeof l == "object" && l !== null && l.$$typeof === q)
+        return "<...>";
+      try {
+        var m = e(l);
+        return m ? "<" + m + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function a() {
+      var l = Y.A;
+      return l === null ? null : l.getOwner();
+    }
+    function c() {
+      return Error("react-stack-top-frame");
+    }
+    function o(l) {
+      if (ne.call(l, "key")) {
+        var m = Object.getOwnPropertyDescriptor(l, "key").get;
+        if (m && m.isReactWarning) return !1;
+      }
+      return l.key !== void 0;
+    }
+    function i(l, m) {
+      function v() {
+        ae || (ae = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          m
+        ));
+      }
+      v.isReactWarning = !0, Object.defineProperty(l, "key", {
+        get: v,
+        configurable: !0
+      });
+    }
+    function d() {
+      var l = e(this.type);
+      return le[l] || (le[l] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), l = this.props.ref, l !== void 0 ? l : null;
+    }
+    function x(l, m, v, w, P, J) {
+      var k = v.ref;
+      return l = {
+        $$typeof: C,
+        type: l,
+        key: m,
+        props: v,
+        _owner: w
+      }, (k !== void 0 ? k : null) !== null ? Object.defineProperty(l, "ref", {
+        enumerable: !1,
+        get: d
+      }) : Object.defineProperty(l, "ref", { enumerable: !1, value: null }), l._store = {}, Object.defineProperty(l._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(l, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(l, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: P
+      }), Object.defineProperty(l, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: J
+      }), Object.freeze && (Object.freeze(l.props), Object.freeze(l)), l;
+    }
+    function b(l, m, v, w, P, J) {
+      var k = m.children;
+      if (k !== void 0)
+        if (w)
+          if (Ae(k)) {
+            for (w = 0; w < k.length; w++)
+              f(k[w]);
+            Object.freeze && Object.freeze(k);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else f(k);
+      if (ne.call(m, "key")) {
+        k = e(l);
+        var _ = Object.keys(m).filter(function(Se) {
+          return Se !== "key";
+        });
+        w = 0 < _.length ? "{key: someKey, " + _.join(": ..., ") + ": ...}" : "{key: someKey}", ie[k + w] || (_ = 0 < _.length ? "{" + _.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          w,
+          k,
+          _,
+          k
+        ), ie[k + w] = !0);
+      }
+      if (k = null, v !== void 0 && (s(v), k = "" + v), o(m) && (s(m.key), k = "" + m.key), "key" in m) {
+        v = {};
+        for (var G in m)
+          G !== "key" && (v[G] = m[G]);
+      } else v = m;
+      return k && i(
+        v,
+        typeof l == "function" ? l.displayName || l.name || "Unknown" : l
+      ), x(
+        l,
+        k,
+        v,
+        a(),
+        P,
+        J
+      );
+    }
+    function f(l) {
+      h(l) ? l._store && (l._store.validated = 1) : typeof l == "object" && l !== null && l.$$typeof === q && (l._payload.status === "fulfilled" ? h(l._payload.value) && l._payload.value._store && (l._payload.value._store.validated = 1) : l._store && (l._store.validated = 1));
+    }
+    function h(l) {
+      return typeof l == "object" && l !== null && l.$$typeof === C;
+    }
+    var p = $e, C = Symbol.for("react.transitional.element"), z = Symbol.for("react.portal"), E = Symbol.for("react.fragment"), N = Symbol.for("react.strict_mode"), R = Symbol.for("react.profiler"), W = Symbol.for("react.consumer"), Ne = Symbol.for("react.context"), Ee = Symbol.for("react.forward_ref"), ze = Symbol.for("react.suspense"), Me = Symbol.for("react.suspense_list"), Re = Symbol.for("react.memo"), q = Symbol.for("react.lazy"), Te = Symbol.for("react.activity"), _e = Symbol.for("react.client.reference"), Y = p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, ne = Object.prototype.hasOwnProperty, Ae = Array.isArray, X = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    p = {
+      react_stack_bottom_frame: function(l) {
+        return l();
+      }
+    };
+    var ae, le = {}, oe = p.react_stack_bottom_frame.bind(
+      p,
+      c
+    )(), ce = X(n(c)), ie = {};
+    $.Fragment = E, $.jsx = function(l, m, v) {
+      var w = 1e4 > Y.recentlyCreatedOwnerStacks++;
+      return b(
+        l,
+        m,
+        v,
+        !1,
+        w ? Error("react-stack-top-frame") : oe,
+        w ? X(n(l)) : ce
+      );
+    }, $.jsxs = function(l, m, v) {
+      var w = 1e4 > Y.recentlyCreatedOwnerStacks++;
+      return b(
+        l,
+        m,
+        v,
+        !0,
+        w ? Error("react-stack-top-frame") : oe,
+        w ? X(n(l)) : ce
+      );
+    };
+  })()), $;
+}
+var fe;
+function qe() {
+  return fe || (fe = 1, process.env.NODE_ENV === "production" ? O.exports = Ue() : O.exports = We()), O.exports;
+}
+var r = qe();
+const L = (e, t) => {
+  const s = I(e, t);
+  if (t.startsWith("font-size-")) {
+    u.removeMark(e, "font-size-small"), u.removeMark(e, "font-size-normal"), u.removeMark(e, "font-size-large"), u.removeMark(e, "font-size-extra-large"), s || u.addMark(e, t, !0);
+    return;
+  }
+  s ? u.removeMark(e, t) : u.addMark(e, t, !0);
+}, I = (e, t) => {
+  const s = u.marks(e);
+  return s ? s[t] === !0 : !1;
+}, K = (e, t) => {
+  t ? u.addMark(e, "color", t) : u.removeMark(e, "color");
+}, Ye = (e) => u.marks(e)?.color || null, Q = (e, t) => {
+  t ? u.addMark(e, "backgroundColor", t) : u.removeMark(e, "backgroundColor");
+}, Xe = (e) => u.marks(e)?.backgroundColor || null, Z = (e, t) => {
+  const s = te(e, t), n = pe.includes(t);
+  g.unwrapNodes(e, {
+    match: (c) => !u.isEditor(c) && T.isElement(c) && pe.includes(c.type),
+    split: !0
+  });
+  let a;
+  if (s ? a = { type: "paragraph" } : n ? a = { type: "list-item" } : a = { type: t }, g.setNodes(e, a), !s && n) {
+    const c = { type: t, children: [] };
+    g.wrapNodes(e, c);
+  }
+}, B = (e, t) => {
+  g.setNodes(
+    e,
+    { align: t },
+    {
+      match: (s) => T.isElement(s) && u.isBlock(e, s),
+      split: !0
+    }
+  );
+}, te = (e, t, s = "type") => {
+  const { selection: n } = e;
+  if (!n) return !1;
+  const [a] = Array.from(
+    u.nodes(e, {
+      at: u.unhangRange(e, n),
+      match: (c) => !u.isEditor(c) && T.isElement(c) && c[s] === t
+    })
+  );
+  return !!a;
+}, pe = ["numbered-list", "bulleted-list"], ke = (e, t, s = "") => {
+  const a = {
+    type: "image",
+    url: t,
+    alt: s,
+    width: "auto",
+    height: "auto",
+    children: [{ text: "" }]
+  };
+  g.insertNodes(e, a), g.insertNodes(e, { type: "paragraph", children: [{ text: "" }] });
+}, Je = (e) => {
+  if (!e || !Ge(e)) return !1;
+  const t = new URL(e).pathname.split(".").pop();
+  return ["jpg", "jpeg", "png", "gif", "webp", "svg"].includes(t.toLowerCase());
+}, Ge = (e) => {
+  try {
+    return new URL(e), !0;
+  } catch {
+    return !1;
+  }
+}, Ke = (e, t) => {
+  e.selection && Qe(e, t);
+}, Qe = (e, t) => {
+  et(e) && Ze(e);
+  const { selection: s } = e, n = s && A.isCollapsed(s), a = {
+    type: "link",
+    url: t,
+    children: n ? [{ text: t }] : []
+  };
+  n ? g.insertNodes(e, a) : (g.wrapNodes(e, a, { split: !0 }), g.collapse(e, { edge: "end" }));
+}, Ze = (e) => {
+  g.unwrapNodes(e, {
+    match: (t) => !u.isEditor(t) && T.isElement(t) && t.type === "link"
+  });
+}, et = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => !u.isEditor(s) && T.isElement(s) && s.type === "link"
+  });
+  return !!t;
+}, je = (e, t = 3, s = 3) => {
+  const n = tt(t, s);
+  g.insertNodes(e, n);
+  const c = [...u.path(e, e.selection.anchor), 0, 0, 0];
+  g.select(e, c);
+}, tt = (e, t) => {
+  const s = (a = !1) => ({
+    type: "table-cell",
+    header: a,
+    children: [{ type: "paragraph", children: [{ text: "" }] }]
+  }), n = (a = !1) => ({
+    type: "table-row",
+    children: Array.from({ length: t }, () => s(a))
+  });
+  return {
+    type: "table",
+    children: [
+      n(!0),
+      // Header row
+      ...Array.from({ length: e - 1 }, () => n(!1))
+    ]
+  };
+}, Ut = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => s.type === "table"
+  });
+  if (t) {
+    const [, s] = t, [n] = u.nodes(e, {
+      match: (a) => a.type === "table-row"
+    });
+    if (n) {
+      const [a] = n, c = {
+        type: "table-row",
+        children: a.children.map(() => ({
+          type: "table-cell",
+          children: [{ type: "paragraph", children: [{ text: "" }] }]
+        }))
+      }, o = [...s, t[0].children.length];
+      g.insertNodes(e, c, { at: o });
+    }
+  }
+}, Wt = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => s.type === "table"
+  });
+  if (t) {
+    const [s, n] = t;
+    s.children.forEach((a, c) => {
+      const o = {
+        type: "table-cell",
+        children: [{ type: "paragraph", children: [{ text: "" }] }]
+      }, i = [...n, c, a.children.length];
+      g.insertNodes(e, o, { at: i });
+    });
+  }
+}, qt = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => s.type === "table-row"
+  });
+  t && g.removeNodes(e, {
+    match: (s) => s.type === "table-row"
+  });
+}, Yt = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => s.type === "table-cell"
+  });
+  if (t) {
+    const [, s] = t, n = s[s.length - 1], [a] = u.nodes(e, {
+      match: (c) => c.type === "table"
+    });
+    if (a) {
+      const [c, o] = a;
+      for (let i = c.children.length - 1; i >= 0; i--) {
+        const d = [...o, i, n];
+        g.removeNodes(e, { at: d });
+      }
+    }
+  }
+}, st = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => T.isElement(s) && u.isBlock(e, s)
+  });
+  return t ? t[0].type : "paragraph";
+}, rt = (e) => {
+  const t = u.marks(e);
+  return t?.["font-size-small"] ? "small" : t?.["font-size-large"] ? "large" : t?.["font-size-extra-large"] ? "extra-large" : "normal";
+}, V = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => T.isElement(s) && u.isBlock(e, s)
+  });
+  return t && t[0].align ? t[0].align : "left";
+}, nt = (e) => {
+  g.delete(e, {
+    at: {
+      anchor: u.start(e, []),
+      focus: u.end(e, [])
+    }
+  }), g.select(e, u.start(e, []));
+}, j = ({ active: e, children: t, onMouseDown: s, title: n, className: a = "", ...c }) => /* @__PURE__ */ r.jsx(
+  "button",
+  {
+    className: `toolbar-button ${e ? "active" : ""} ${a}`,
+    onMouseDown: (o) => {
+      o.preventDefault(), s && s();
+    },
+    title: n,
+    ...c,
+    children: t
+  }
+), ge = ({ value: e, onChange: t, children: s, title: n, ...a }) => /* @__PURE__ */ r.jsx(
+  "select",
+  {
+    className: "toolbar-select",
+    value: e,
+    onChange: (c) => t(c.target.value),
+    title: n,
+    ...a,
+    children: s
+  }
+), at = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z" }) }), lt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z" }) }), ot = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z" }) }), ct = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M10 19h4v-3h-4v3zM5 4v3h5v3h4V7h5V4H5zM3 14h18v-2H3v2z" }) }), it = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6c-.83 0-1.5.67-1.5 1.5S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.68-1.5 1.5s.68 1.5 1.5 1.5 1.5-.68 1.5-1.5-.67-1.5-1.5-1.5zM7 19h14v-2H7v2zm0-6h14v-2H7v2zm0-8v2h14V5H7z" }) }), ut = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1v.9h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z" }) }), ht = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M15 15H3v2h12v-2zm0-8H3v2h12V7zM3 13h18v-2H3v2zm0 8h18v-2H3v2zM3 3v2h18V3H3z" }) }), dt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z" }) }), mt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M3 21h18v-2H3v2zm6-4h12v-2H9v2zm-6-4h18v-2H3v2zm6-4h12V7H9v2zM3 3v2h18V3H3z" }) }), ft = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M3 21h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18v-2H3v2zm0-4h18V7H3v2zm0-6v2h18V3H3z" }) }), pt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z" }) }), gt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z" }) }), xt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M10 10.02h5V21h-5zM17 21h3c1.1 0 2-.9 2-2v-9h-5v11zm3-18H5c-1.1 0-2 .9-2 2v3h19V5c0-1.1-.9-2-2-2zM3 19c0 1.1.9 2 2 2h3V10H3v9z" }) }), vt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z" }) }), bt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M2.5 4v3h5v12h3V7h5V4h-13zm19 5h-9v3h3v7h3v-7h3V9z" }) }), wt = () => /* @__PURE__ */ r.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ r.jsx("path", { d: "M16.56 8.94L7.62 0 6.21 1.41l2.38 2.38-5.15 5.15c-.59.59-.59 1.54 0 2.12l5.5 5.5c.29.29.68.44 1.06.44s.77-.15 1.06-.44l5.5-5.5c.59-.58.59-1.53 0-2.12zM5.21 10L10 5.21 14.79 10H5.21zM19 11.5s-2 2.17-2 3.5c0 1.1.9 2 2 2s2-.9 2-2c0-1.33-2-3.5-2-3.5z" }) }), xe = ({ editor: e, type: t = "text" }) => {
+  const [s, n] = M(!1), [a, c] = M(""), o = t === "text", i = o ? Ye(e) : Xe(e), d = [
+    "#000000",
+    "#374151",
+    "#6b7280",
+    "#9ca3af",
+    "#d1d5db",
+    "#ffffff",
+    "#ef4444",
+    "#f97316",
+    "#f59e0b",
+    "#eab308",
+    "#84cc16",
+    "#22c55e",
+    "#10b981",
+    "#14b8a6",
+    "#06b6d4",
+    "#0ea5e9",
+    "#3b82f6",
+    "#6366f1",
+    "#8b5cf6",
+    "#a855f7",
+    "#d946ef",
+    "#ec4899",
+    "#f43f5e",
+    "#fb7185"
+  ], x = y((h) => {
+    o ? K(e, h) : Q(e, h), n(!1);
+  }, [e, o]), b = y((h) => {
+    const p = h.target.value;
+    c(p), o ? K(e, p) : Q(e, p);
+  }, [e, o]), f = y(() => {
+    o ? K(e, null) : Q(e, null), n(!1);
+  }, [e, o]);
+  return U(() => {
+    if (!s) return;
+    const h = (p) => {
+      p.target.closest(".color-picker-dropdown") || n(!1);
+    };
+    return document.addEventListener("mousedown", h), () => document.removeEventListener("mousedown", h);
+  }, [s]), /* @__PURE__ */ r.jsxs("div", { className: "color-picker-dropdown", children: [
+    /* @__PURE__ */ r.jsxs(
+      "button",
+      {
+        className: "toolbar-button color-picker-button",
+        onMouseDown: (h) => {
+          h.preventDefault(), n(!s);
+        },
+        title: o ? "Text Color" : "Background Color",
+        style: { position: "relative" },
+        children: [
+          o ? /* @__PURE__ */ r.jsx(bt, {}) : /* @__PURE__ */ r.jsx(wt, {}),
+          i && /* @__PURE__ */ r.jsx(
+            "div",
+            {
+              className: "color-indicator",
+              style: {
+                backgroundColor: i,
+                position: "absolute",
+                bottom: "4px",
+                left: "50%",
+                transform: "translateX(-50%)",
+                width: "20px",
+                height: "3px",
+                borderRadius: "2px"
+              }
+            }
+          )
+        ]
+      }
+    ),
+    s && /* @__PURE__ */ r.jsxs("div", { className: "color-picker-panel", children: [
+      /* @__PURE__ */ r.jsx("div", { className: "color-picker-presets", children: d.map((h) => /* @__PURE__ */ r.jsx(
+        "button",
+        {
+          className: `color-swatch ${i === h ? "active" : ""}`,
+          style: { backgroundColor: h },
+          onClick: (p) => {
+            p.stopPropagation(), x(h);
+          },
+          title: h
+        },
+        h
+      )) }),
+      /* @__PURE__ */ r.jsx("div", { className: "color-picker-custom", children: /* @__PURE__ */ r.jsxs("label", { className: "color-picker-label", children: [
+        "Custom Color:",
+        /* @__PURE__ */ r.jsx(
+          "input",
+          {
+            type: "color",
+            value: a || i || "#000000",
+            onChange: b,
+            className: "color-picker-input"
+          }
+        )
+      ] }) }),
+      i && /* @__PURE__ */ r.jsx(
+        "button",
+        {
+          className: "color-picker-remove",
+          onClick: (h) => {
+            h.stopPropagation(), f();
+          },
+          children: "Remove Color"
+        }
+      )
+    ] })
+  ] });
+}, kt = ({ editor: e }) => {
+  const [t, s] = M(!1), [n, a] = M({ row: 0, col: 0 }), c = y((o, i) => {
+    je(e, o + 1, i + 1), s(!1), a({ row: 0, col: 0 });
+  }, [e]);
+  return U(() => {
+    if (!t) return;
+    const o = (i) => {
+      i.target.closest(".table-dropdown") || s(!1);
+    };
+    return document.addEventListener("mousedown", o), () => document.removeEventListener("mousedown", o);
+  }, [t]), /* @__PURE__ */ r.jsxs("div", { className: "table-dropdown", children: [
+    /* @__PURE__ */ r.jsx(
+      "button",
+      {
+        className: "toolbar-button",
+        onMouseDown: (o) => {
+          o.preventDefault(), s(!t);
+        },
+        title: "Insert Table",
+        children: /* @__PURE__ */ r.jsx(xt, {})
+      }
+    ),
+    t && /* @__PURE__ */ r.jsxs("div", { className: "table-size-selector", children: [
+      /* @__PURE__ */ r.jsx("div", { className: "table-grid", children: Array.from(
+        { length: 6 },
+        (o, i) => Array.from({ length: 6 }, (d, x) => /* @__PURE__ */ r.jsx(
+          "div",
+          {
+            className: `table-cell-selector ${i <= n.row && x <= n.col ? "active" : ""}`,
+            onMouseEnter: () => a({ row: i, col: x }),
+            onClick: (b) => {
+              b.stopPropagation(), c(i, x);
+            }
+          },
+          `${i}-${x}`
+        ))
+      ) }),
+      /* @__PURE__ */ r.jsxs("div", { className: "table-size-label", children: [
+        n.row + 1,
+        " × ",
+        n.col + 1
+      ] })
+    ] })
+  ] });
+}, jt = ({
+  features: e = [
+    "bold",
+    "italic",
+    "underline",
+    "strikethrough",
+    "headings",
+    "lists",
+    "alignment",
+    "fontSize",
+    "textColor",
+    "backgroundColor",
+    "link",
+    "image",
+    "table",
+    "clear"
+  ]
+}) => {
+  const t = re(), s = se(), n = (o) => e.includes(o), a = (o) => {
+    const i = o.target.files[0];
+    if (i && i.type.startsWith("image/")) {
+      const d = new FileReader();
+      d.onload = (x) => {
+        ke(t, x.target.result);
+      }, d.readAsDataURL(i);
+    }
+    o.target.value = "";
+  }, c = () => {
+    const o = window.prompt("Enter the URL:");
+    o && Ke(t, o);
+  };
+  return /* @__PURE__ */ r.jsxs("div", { className: "toolbar", children: [
+    (n("bold") || n("italic") || n("underline") || n("strikethrough")) && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "toolbar-group", children: [
+        n("bold") && /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: I(t, "bold"),
+            onMouseDown: () => L(t, "bold"),
+            title: "Bold (Ctrl+B)",
+            children: /* @__PURE__ */ r.jsx(at, {})
+          }
+        ),
+        n("italic") && /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: I(t, "italic"),
+            onMouseDown: () => L(t, "italic"),
+            title: "Italic (Ctrl+I)",
+            children: /* @__PURE__ */ r.jsx(lt, {})
+          }
+        ),
+        n("underline") && /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: I(t, "underline"),
+            onMouseDown: () => L(t, "underline"),
+            title: "Underline (Ctrl+U)",
+            children: /* @__PURE__ */ r.jsx(ot, {})
+          }
+        ),
+        n("strikethrough") && /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: I(t, "strikethrough"),
+            onMouseDown: () => L(t, "strikethrough"),
+            title: "Strikethrough",
+            children: /* @__PURE__ */ r.jsx(ct, {})
+          }
+        )
+      ] }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    n("headings") && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-group", children: /* @__PURE__ */ r.jsxs(
+        ge,
+        {
+          value: st(t),
+          onChange: (o) => Z(t, o),
+          children: [
+            /* @__PURE__ */ r.jsx("option", { value: "paragraph", children: "Paragraph" }),
+            /* @__PURE__ */ r.jsx("option", { value: "heading-one", children: "Heading 1" }),
+            /* @__PURE__ */ r.jsx("option", { value: "heading-two", children: "Heading 2" }),
+            /* @__PURE__ */ r.jsx("option", { value: "heading-three", children: "Heading 3" }),
+            /* @__PURE__ */ r.jsx("option", { value: "blockquote", children: "Quote" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    n("lists") && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "toolbar-group", children: [
+        /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: te(t, "bulleted-list"),
+            onMouseDown: () => Z(t, "bulleted-list"),
+            title: "Bulleted List",
+            children: /* @__PURE__ */ r.jsx(it, {})
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: te(t, "numbered-list"),
+            onMouseDown: () => Z(t, "numbered-list"),
+            title: "Numbered List",
+            children: /* @__PURE__ */ r.jsx(ut, {})
+          }
+        )
+      ] }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    n("alignment") && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "toolbar-group", children: [
+        /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: V(t) === "left",
+            onMouseDown: () => B(t, "left"),
+            title: "Align Left",
+            children: /* @__PURE__ */ r.jsx(ht, {})
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: V(t) === "center",
+            onMouseDown: () => B(t, "center"),
+            title: "Align Center",
+            children: /* @__PURE__ */ r.jsx(dt, {})
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: V(t) === "right",
+            onMouseDown: () => B(t, "right"),
+            title: "Align Right",
+            children: /* @__PURE__ */ r.jsx(mt, {})
+          }
+        ),
+        /* @__PURE__ */ r.jsx(
+          j,
+          {
+            active: V(t) === "justify",
+            onMouseDown: () => B(t, "justify"),
+            title: "Justify",
+            children: /* @__PURE__ */ r.jsx(ft, {})
+          }
+        )
+      ] }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    n("fontSize") && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-group", children: /* @__PURE__ */ r.jsxs(
+        ge,
+        {
+          value: rt(t),
+          onChange: (o) => L(t, `font-size-${o}`),
+          title: "Font Size",
+          children: [
+            /* @__PURE__ */ r.jsx("option", { value: "small", children: "Small" }),
+            /* @__PURE__ */ r.jsx("option", { value: "normal", children: "Normal" }),
+            /* @__PURE__ */ r.jsx("option", { value: "large", children: "Large" }),
+            /* @__PURE__ */ r.jsx("option", { value: "extra-large", children: "Extra Large" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    (n("textColor") || n("backgroundColor")) && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "toolbar-group", children: [
+        n("textColor") && /* @__PURE__ */ r.jsx(xe, { editor: t, type: "text" }),
+        n("backgroundColor") && /* @__PURE__ */ r.jsx(xe, { editor: t, type: "background" })
+      ] }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    (n("link") || n("image") || n("table")) && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "toolbar-group", children: [
+        n("link") && /* @__PURE__ */ r.jsx(
+          j,
+          {
+            onMouseDown: c,
+            title: "Insert Link",
+            children: /* @__PURE__ */ r.jsx(pt, {})
+          }
+        ),
+        n("image") && /* @__PURE__ */ r.jsx(
+          j,
+          {
+            onMouseDown: () => s.current?.click(),
+            title: "Insert Image",
+            children: /* @__PURE__ */ r.jsx(gt, {})
+          }
+        ),
+        n("table") && /* @__PURE__ */ r.jsx(kt, { editor: t })
+      ] }),
+      /* @__PURE__ */ r.jsx("div", { className: "toolbar-separator" })
+    ] }),
+    n("clear") && /* @__PURE__ */ r.jsx("div", { className: "toolbar-group", children: /* @__PURE__ */ r.jsx(
+      j,
+      {
+        onMouseDown: () => nt(t),
+        title: "Clear All Content",
+        className: "clear-button",
+        children: /* @__PURE__ */ r.jsx(vt, {})
+      }
+    ) }),
+    /* @__PURE__ */ r.jsx(
+      "input",
+      {
+        ref: s,
+        type: "file",
+        accept: "image/*",
+        onChange: a,
+        style: { display: "none" }
+      }
+    )
+  ] });
+}, yt = ({ attributes: e, children: t, element: s, editor: n }) => {
+  const a = Pe(), c = De(), [o, i] = M(!1), d = se(), x = y((h) => {
+    h.preventDefault(), h.stopPropagation(), i(!0);
+    const p = h.clientX, C = d.current.offsetWidth;
+    d.current.naturalHeight / d.current.naturalWidth;
+    const z = (N) => {
+      const R = N.clientX - p, W = Math.max(100, Math.min(1200, C + R));
+      d.current.style.width = `${W}px`, d.current.style.height = "auto";
+    }, E = () => {
+      i(!1);
+      const N = d.current.offsetWidth;
+      try {
+        const R = he.findPath(n, s);
+        g.setNodes(
+          n,
+          {
+            width: N,
+            height: "auto"
+          },
+          { at: R }
+        );
+      } catch (R) {
+        console.warn("Could not update image dimensions:", R);
+      }
+      document.removeEventListener("mousemove", z), document.removeEventListener("mouseup", E);
+    };
+    document.addEventListener("mousemove", z), document.addEventListener("mouseup", E);
+  }, [n, s]), b = y((h) => {
+    h.preventDefault(), h.stopPropagation();
+    try {
+      const p = he.findPath(n, s);
+      g.removeNodes(n, { at: p });
+    } catch (p) {
+      console.warn("Could not delete image:", p);
+    }
+  }, [n, s]), f = s.width || 300;
+  return /* @__PURE__ */ r.jsxs("div", { ...e, children: [
+    t,
+    /* @__PURE__ */ r.jsx(
+      "div",
+      {
+        contentEditable: !1,
+        className: `image-container ${a && c ? "selected" : ""}`,
+        style: {
+          display: "block",
+          position: "relative",
+          margin: "16px 0",
+          textAlign: "center"
+        },
+        children: /* @__PURE__ */ r.jsxs("div", { style: { display: "inline-block", position: "relative" }, children: [
+          /* @__PURE__ */ r.jsx(
+            "img",
+            {
+              ref: d,
+              src: s.url,
+              alt: s.alt || "",
+              className: "resizable-image",
+              style: {
+                width: `${f}px`,
+                height: "auto",
+                maxWidth: "100%",
+                display: "block",
+                borderRadius: "4px",
+                boxShadow: a && c ? "0 0 0 3px #3b82f6" : "0 1px 3px rgba(0, 0, 0, 0.1)",
+                transition: o ? "none" : "box-shadow 0.15s ease",
+                userSelect: "none"
+              },
+              draggable: !1
+            }
+          ),
+          a && c && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+            /* @__PURE__ */ r.jsx(
+              "div",
+              {
+                className: "resize-handle",
+                onMouseDown: x,
+                style: {
+                  position: "absolute",
+                  bottom: "-6px",
+                  right: "-6px",
+                  width: "16px",
+                  height: "16px",
+                  background: "#3b82f6",
+                  border: "2px solid white",
+                  cursor: "nwse-resize",
+                  borderRadius: "50%",
+                  boxShadow: "0 2px 8px rgba(0, 0, 0, 0.3)",
+                  zIndex: 10
+                }
+              }
+            ),
+            /* @__PURE__ */ r.jsx(
+              "button",
+              {
+                className: "delete-button",
+                onMouseDown: b,
+                title: "Delete image",
+                type: "button",
+                style: {
+                  position: "absolute",
+                  top: "-10px",
+                  right: "-10px",
+                  width: "24px",
+                  height: "24px",
+                  background: "#ef4444",
+                  color: "white",
+                  border: "none",
+                  borderRadius: "50%",
+                  cursor: "pointer",
+                  fontSize: "18px",
+                  fontWeight: "bold",
+                  lineHeight: "1",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  boxShadow: "0 2px 8px rgba(0, 0, 0, 0.3)",
+                  zIndex: 11,
+                  padding: 0
+                },
+                children: "×"
+              }
+            )
+          ] })
+        ] })
+      }
+    )
+  ] });
+}, Ct = ({ attributes: e, children: t, element: s }) => {
+  const n = { textAlign: s.align };
+  switch (s.type) {
+    case "heading-one":
+      return /* @__PURE__ */ r.jsx("h1", { ...e, style: n, className: "heading-one", children: t });
+    case "heading-two":
+      return /* @__PURE__ */ r.jsx("h2", { ...e, style: n, className: "heading-two", children: t });
+    case "heading-three":
+      return /* @__PURE__ */ r.jsx("h3", { ...e, style: n, className: "heading-three", children: t });
+    case "blockquote":
+      return /* @__PURE__ */ r.jsx("blockquote", { ...e, style: n, className: "blockquote", children: t });
+    case "bulleted-list":
+      return /* @__PURE__ */ r.jsx("ul", { ...e, style: n, className: "bulleted-list", children: t });
+    case "numbered-list":
+      return /* @__PURE__ */ r.jsx("ol", { ...e, style: n, className: "numbered-list", children: t });
+    case "list-item":
+      return /* @__PURE__ */ r.jsx("li", { ...e, className: "list-item", children: t });
+    case "link":
+      return /* @__PURE__ */ r.jsx("a", { ...e, href: s.url, className: "link", children: t });
+    case "image":
+      return /* @__PURE__ */ r.jsx(yt, { attributes: e, children: t, element: s, editor: re() });
+    case "table":
+      return /* @__PURE__ */ r.jsx("div", { ...e, className: "table-container", children: /* @__PURE__ */ r.jsx("table", { className: "simple-table", children: /* @__PURE__ */ r.jsx("tbody", { children: t }) }) });
+    case "table-row":
+      return /* @__PURE__ */ r.jsx("tr", { ...e, className: "table-row", children: t });
+    case "table-cell":
+      return /* @__PURE__ */ r.jsx("td", { ...e, className: `table-cell ${s.header ? "table-header-cell" : ""}`, children: t });
+    default:
+      return /* @__PURE__ */ r.jsx("p", { ...e, style: n, className: "paragraph", children: t });
+  }
+}, Nt = ({ attributes: e, children: t, leaf: s }) => {
+  let n = "", a = {};
+  return s.bold && (n += " bold"), s.italic && (n += " italic"), s.underline && (n += " underline"), s.strikethrough && (n += " strikethrough"), s["font-size-small"] && (n += " font-size-small"), s["font-size-large"] && (n += " font-size-large"), s["font-size-extra-large"] && (n += " font-size-extra-large"), s.color && (a.color = s.color), s.backgroundColor && (a.backgroundColor = s.backgroundColor), /* @__PURE__ */ r.jsx("span", { ...e, className: n.trim(), style: a, children: t });
+}, Et = ({ target: e, search: t, onClose: s }) => {
+  const n = re(), a = se(), [c, o] = M(0), d = [
+    {
+      title: "Heading 1",
+      description: "Big section heading",
+      icon: "H1",
+      command: () => x(n, "heading-one")
+    },
+    {
+      title: "Heading 2",
+      description: "Medium section heading",
+      icon: "H2",
+      command: () => x(n, "heading-two")
+    },
+    {
+      title: "Heading 3",
+      description: "Small section heading",
+      icon: "H3",
+      command: () => x(n, "heading-three")
+    },
+    {
+      title: "Bulleted List",
+      description: "Create a simple bulleted list",
+      icon: "•",
+      command: () => x(n, "bulleted-list")
+    },
+    {
+      title: "Numbered List",
+      description: "Create a list with numbering",
+      icon: "1.",
+      command: () => x(n, "numbered-list")
+    },
+    {
+      title: "Quote",
+      description: "Capture a quote",
+      icon: '"',
+      command: () => x(n, "blockquote")
+    },
+    {
+      title: "Table",
+      description: "Insert a table",
+      icon: "⊞",
+      command: () => {
+        b(n, e), je(n, 3, 3), s();
+      }
+    },
+    {
+      title: "Image",
+      description: "Upload or embed an image",
+      icon: "🖼",
+      command: () => {
+        b(n, e);
+        const f = document.createElement("input");
+        f.type = "file", f.accept = "image/*", f.onchange = (h) => {
+          const p = h.target.files[0];
+          if (p) {
+            const C = new FileReader();
+            C.onload = (z) => {
+              ke(n, z.target.result);
+            }, C.readAsDataURL(p);
+          }
+        }, f.click(), s();
+      }
+    }
+  ].filter(
+    (f) => f.title.toLowerCase().includes(t.toLowerCase()) || f.description.toLowerCase().includes(t.toLowerCase())
+  ), x = (f, h) => {
+    b(f, e);
+    const p = { type: h };
+    h === "bulleted-list" || h === "numbered-list" ? (g.setNodes(f, { type: "list-item" }), g.wrapNodes(f, { type: h, children: [] })) : g.setNodes(f, p), s();
+  }, b = (f, h) => {
+    g.select(f, h), g.delete(f);
+  };
+  return U(() => {
+    o(0);
+  }, [t]), U(() => {
+    const f = (h) => {
+      h.key === "ArrowDown" ? (h.preventDefault(), o(
+        (p) => p < d.length - 1 ? p + 1 : 0
+      )) : h.key === "ArrowUp" ? (h.preventDefault(), o(
+        (p) => p > 0 ? p - 1 : d.length - 1
+      )) : h.key === "Enter" ? (h.preventDefault(), d[c] && d[c].command()) : h.key === "Escape" && (h.preventDefault(), s());
+    };
+    return document.addEventListener("keydown", f), () => document.removeEventListener("keydown", f);
+  }, [c, d, s]), d.length === 0 ? null : /* @__PURE__ */ r.jsx("div", { ref: a, className: "slash-menu", children: d.map((f, h) => /* @__PURE__ */ r.jsxs(
+    "div",
+    {
+      className: `slash-menu-item ${h === c ? "selected" : ""}`,
+      onClick: f.command,
+      children: [
+        /* @__PURE__ */ r.jsx("div", { className: "slash-menu-icon", children: f.icon }),
+        /* @__PURE__ */ r.jsxs("div", { className: "slash-menu-content", children: [
+          /* @__PURE__ */ r.jsx("div", { className: "slash-menu-title", children: f.title }),
+          /* @__PURE__ */ r.jsx("div", { className: "slash-menu-description", children: f.description })
+        ] })
+      ]
+    },
+    f.title
+  )) });
+}, zt = (e) => {
+  const { insertData: t, isVoid: s } = e;
+  return e.isVoid = (n) => n.type === "image" ? !0 : s(n), e.insertData = (n) => {
+    const a = n.getData("text/plain"), { files: c } = n;
+    if (c && c.length > 0)
+      for (const o of c) {
+        const i = new FileReader(), [d] = o.type.split("/");
+        d === "image" && (i.addEventListener("load", () => {
+          const x = i.result;
+          ve(e, x);
+        }), i.readAsDataURL(o));
+      }
+    else Je(a) ? ve(e, a) : t(n);
+  }, e;
+}, ve = (e, t) => {
+  const n = { type: "image", url: t, children: [{ text: "" }] };
+  g.insertNodes(e, n);
+}, Mt = (e) => {
+  const { deleteBackward: t, deleteForward: s, insertBreak: n } = e;
+  return e.deleteBackward = (...a) => {
+    const { selection: c } = e;
+    if (c && A.isCollapsed(c)) {
+      const [o] = u.nodes(e, {
+        match: (i) => i.type === "table-cell"
+      });
+      if (o) {
+        const [, i] = o, d = u.start(e, i);
+        if (ue.equals(c.anchor, d))
+          return;
+      }
+    }
+    t(...a);
+  }, e.deleteForward = (...a) => {
+    const { selection: c } = e;
+    if (c && A.isCollapsed(c)) {
+      const [o] = u.nodes(e, {
+        match: (i) => i.type === "table-cell"
+      });
+      if (o) {
+        const [, i] = o, d = u.end(e, i);
+        if (ue.equals(c.anchor, d))
+          return;
+      }
+    }
+    s(...a);
+  }, e.insertBreak = (...a) => {
+    const { selection: c } = e;
+    if (c) {
+      const [o] = u.nodes(e, {
+        match: (i) => i.type === "table"
+      });
+      if (o)
+        return;
+    }
+    n(...a);
+  }, e;
+}, Rt = (e) => {
+  const { insertData: t, insertText: s, isInline: n } = e;
+  return e.isInline = (a) => a.type === "link" ? !0 : n(a), e.insertText = (a) => {
+    a && be(a) ? we(e, a) : s(a);
+  }, e.insertData = (a) => {
+    const c = a.getData("text/plain");
+    c && be(c) ? we(e, c) : t(a);
+  }, e;
+}, be = (e) => {
+  try {
+    return new URL(e), !0;
+  } catch {
+    return !1;
+  }
+}, we = (e, t) => {
+  _t(e) && Tt(e);
+  const { selection: s } = e, n = s && A.isCollapsed(s), a = {
+    type: "link",
+    url: t,
+    children: n ? [{ text: t }] : []
+  };
+  n ? g.insertNodes(e, a) : (g.wrapNodes(e, a, { split: !0 }), g.collapse(e, { edge: "end" }));
+}, Tt = (e) => {
+  g.unwrapNodes(e, {
+    match: (t) => t.type === "link"
+  });
+}, _t = (e) => {
+  const [t] = u.nodes(e, {
+    match: (s) => s.type === "link"
+  });
+  return !!t;
+}, At = (e) => e.map((t) => ye(t)).join(""), ye = (e) => {
+  if (He.isText(e)) {
+    let s = D(e.text);
+    return e.bold && (s = `<strong>${s}</strong>`), e.italic && (s = `<em>${s}</em>`), e.underline && (s = `<u>${s}</u>`), e.strikethrough && (s = `<s>${s}</s>`), e["font-size-small"] ? s = `<span style="font-size: 12px;">${s}</span>` : e["font-size-large"] ? s = `<span style="font-size: 16px;">${s}</span>` : e["font-size-extra-large"] && (s = `<span style="font-size: 18px;">${s}</span>`), e.color && (s = `<span style="color: ${e.color};">${s}</span>`), e.backgroundColor && (s = `<span style="background-color: ${e.backgroundColor};">${s}</span>`), s;
+  }
+  const t = e.children.map((s) => ye(s)).join("");
+  switch (e.type) {
+    case "paragraph":
+      return `<p${H(e)}>${t}</p>`;
+    case "heading-one":
+      return `<h1${H(e)}>${t}</h1>`;
+    case "heading-two":
+      return `<h2${H(e)}>${t}</h2>`;
+    case "heading-three":
+      return `<h3${H(e)}>${t}</h3>`;
+    case "blockquote":
+      return `<blockquote${H(e)}>${t}</blockquote>`;
+    case "bulleted-list":
+      return `<ul>${t}</ul>`;
+    case "numbered-list":
+      return `<ol>${t}</ol>`;
+    case "list-item":
+      return `<li>${t}</li>`;
+    case "link":
+      return `<a href="${D(e.url)}">${t}</a>`;
+    case "image":
+      const s = e.width ? `width: ${e.width}px; ` : "";
+      return `<img src="${D(e.url)}" alt="${D(e.alt || "")}" style="${s}max-width: 100%; height: auto;" />`;
+    case "table":
+      return `<table border="1" style="border-collapse: collapse; width: 100%;">${t}</table>`;
+    case "table-row":
+      return `<tr>${t}</tr>`;
+    case "table-cell":
+      const n = e.header ? "th" : "td";
+      return `<${n} style="border: 1px solid #ccc; padding: 8px;">${t}</${n}>`;
+    default:
+      return t;
+  }
+}, H = (e) => e.align ? ` style="text-align: ${e.align};"` : "", St = (e) => {
+  const t = new DOMParser().parseFromString(e, "text/html");
+  return Ce(t.body.childNodes);
+}, Ce = (e) => {
+  const t = [];
+  for (const s of e) {
+    const n = $t(s);
+    n && (Array.isArray(n) ? t.push(...n) : t.push(n));
+  }
+  return t.length > 0 ? t : [{ type: "paragraph", children: [{ text: "" }] }];
+}, $t = (e) => {
+  if (e.nodeType === Node.TEXT_NODE)
+    return { text: e.textContent };
+  if (e.nodeType !== Node.ELEMENT_NODE)
+    return null;
+  const t = Ce(e.childNodes), s = { children: t }, n = e.getAttribute("style");
+  if (n && n.includes("text-align:")) {
+    const a = n.match(/text-align:\s*([^;]+)/);
+    a && (s.align = a[1].trim());
+  }
+  switch (e.nodeName.toLowerCase()) {
+    case "p":
+      return { ...s, type: "paragraph" };
+    case "h1":
+      return { ...s, type: "heading-one" };
+    case "h2":
+      return { ...s, type: "heading-two" };
+    case "h3":
+      return { ...s, type: "heading-three" };
+    case "blockquote":
+      return { ...s, type: "blockquote" };
+    case "ul":
+      return { ...s, type: "bulleted-list" };
+    case "ol":
+      return { ...s, type: "numbered-list" };
+    case "li":
+      return { ...s, type: "list-item" };
+    case "a":
+      return { ...s, type: "link", url: e.getAttribute("href") };
+    case "img":
+      const a = e.getAttribute("style");
+      let c = 300;
+      if (a && a.includes("width:")) {
+        const o = a.match(/width:\s*(\d+)px/);
+        o && (c = parseInt(o[1]));
+      }
+      return {
+        type: "image",
+        url: e.getAttribute("src"),
+        alt: e.getAttribute("alt") || "",
+        width: c,
+        children: [{ text: "" }]
+      };
+    case "table":
+      return { ...s, type: "table" };
+    case "tr":
+      return { ...s, type: "table-row" };
+    case "td":
+      return { ...s, type: "table-cell" };
+    case "th":
+      return { ...s, type: "table-cell", header: !0 };
+    case "strong":
+    case "b":
+      return F(t, "bold");
+    case "em":
+    case "i":
+      return F(t, "italic");
+    case "u":
+      return F(t, "underline");
+    case "s":
+    case "strike":
+      return F(t, "strikethrough");
+    case "span":
+      return Lt(e, t);
+    case "br":
+      return { text: `
+` };
+    case "div":
+      return t.length > 0 ? { ...s, type: "paragraph" } : null;
+    default:
+      return t;
+  }
+}, F = (e, t) => e.map((s) => s.text !== void 0 ? { ...s, [t]: !0 } : s), Lt = (e, t) => {
+  const s = e.getAttribute("style");
+  let n = {};
+  if (s) {
+    s.includes("font-size: 12px") ? n["font-size-small"] = !0 : s.includes("font-size: 16px") ? n["font-size-large"] = !0 : s.includes("font-size: 18px") && (n["font-size-extra-large"] = !0);
+    const a = s.match(/color:\s*([^;]+)/);
+    a && (n.color = a[1].trim());
+    const c = s.match(/background-color:\s*([^;]+)/);
+    c && (n.backgroundColor = c[1].trim());
+  }
+  return Object.keys(n).length > 0 ? t.map((a) => a.text !== void 0 ? { ...a, ...n } : a) : t;
+}, Ht = (e, t, s) => {
+  const [n, a] = M(() => t ? typeof t == "string" ? St(t) : t : e || [
+    {
+      type: "paragraph",
+      children: [{ text: "" }]
+    }
+  ]);
+  return { editorValue: n, handleChange: (o, i) => {
+    if (a(o), i && i(o), s) {
+      const d = o.length === 1 && o[0].type === "paragraph" && o[0].children.length === 1 && o[0].children[0].text === "", x = d ? "" : At(o);
+      s(x, d ? [] : o);
+    }
+  } };
+}, It = (e) => {
+  const [t, s] = M(null), n = y((c) => {
+    const { selection: o } = e;
+    if (o && A.isCollapsed(o)) {
+      const [i] = A.edges(o), d = u.before(e, i, { unit: "word" }), x = d && u.before(e, d), b = x && u.range(e, x, i), f = b && u.string(e, b), h = f && f.match(/\/(\w*)$/), p = u.after(e, i), C = u.range(e, i, p), E = u.string(e, C).match(/^(\s|$)/);
+      s(h && E ? {
+        target: b,
+        search: h[1]
+      } : null);
+    } else
+      s(null);
+  }, [e]), a = y(() => {
+    s(null);
+  }, []);
+  return { slashMenu: t, handleSlashMenu: n, closeSlashMenu: a };
+}, ee = (e, t) => {
+  const s = u.marks(e);
+  (s ? s[t] === !0 : !1) ? u.removeMark(e, t) : u.addMark(e, t, !0);
+}, Pt = (e) => y((t) => {
+  if (t.ctrlKey)
+    switch (t.key) {
+      case "b": {
+        t.preventDefault(), ee(e, "bold");
+        break;
+      }
+      case "i": {
+        t.preventDefault(), ee(e, "italic");
+        break;
+      }
+      case "u": {
+        t.preventDefault(), ee(e, "underline");
+        break;
+      }
+      case "z": {
+        t.shiftKey ? (t.preventDefault(), e.redo()) : (t.preventDefault(), e.undo());
+        break;
+      }
+    }
+}, [e]), Xt = ({
+  value: e,
+  onChange: t,
+  placeholder: s = "Enter some text...",
+  readOnly: n = !1,
+  className: a = "",
+  initialValue: c = null,
+  features: o = ["bold", "italic", "underline", "fontSize"]
+  // features = [
+  //   'bold', 'italic', 'underline', 'strikethrough',
+  //   'headings', 'lists', 'alignment', 'fontSize',
+  //   'textColor', 'backgroundColor',
+  //   'link', 'image', 'table', 'clear'
+  // ]
+}) => {
+  const i = Le(
+    () => Rt(Mt(zt(Fe(Oe(Ie()))))),
+    []
+  ), { editorValue: d, handleChange: x } = Ht(
+    e,
+    c,
+    t
+  ), { slashMenu: b, handleSlashMenu: f, closeSlashMenu: h } = It(i), p = Pt(i), C = y((N) => /* @__PURE__ */ r.jsx(Ct, { ...N }), []), z = y((N) => /* @__PURE__ */ r.jsx(Nt, { ...N }), []), E = y(
+    (N) => {
+      x(N, f);
+    },
+    [x, f]
+  );
+  return /* @__PURE__ */ r.jsx("div", { className: `scrible-editor ${a}`, children: /* @__PURE__ */ r.jsxs(Be, { editor: i, initialValue: d, onChange: E, children: [
+    !n && /* @__PURE__ */ r.jsx(jt, { features: o }),
+    /* @__PURE__ */ r.jsxs("div", { className: "editor-container", children: [
+      /* @__PURE__ */ r.jsx(
+        Ve,
+        {
+          renderElement: C,
+          renderLeaf: z,
+          placeholder: s,
+          onKeyDown: p,
+          readOnly: n,
+          className: "editor-content"
+        }
+      ),
+      b && /* @__PURE__ */ r.jsx(
+        Et,
+        {
+          target: b.target,
+          search: b.search,
+          onClose: h
+        }
+      )
+    ] })
+  ] }) });
+};
+export {
+  Xt as ScribleEditor,
+  Xt as default,
+  Yt as deleteTableColumn,
+  qt as deleteTableRow,
+  St as deserialize,
+  Xe as getBackgroundColor,
+  Ye as getTextColor,
+  ke as insertImage,
+  Ke as insertLink,
+  je as insertTable,
+  Wt as insertTableColumn,
+  Ut as insertTableRow,
+  te as isBlockActive,
+  Je as isImageUrl,
+  et as isLinkActive,
+  I as isMarkActive,
+  At as serialize,
+  Q as setBackgroundColor,
+  K as setTextColor,
+  B as toggleAlignment,
+  Z as toggleBlock,
+  L as toggleMark,
+  Ze as unwrapLink,
+  Qe as wrapLink
+};