bootstrap-email-wysiwyg 0.1.0

package/dist/bootstrap-email-wysiwyg.js

@@ -0,0 +1,1957 @@
+var At = Object.defineProperty;
+var It = (e, n, t) => n in e ? At(e, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[n] = t;
+var p = (e, n, t) => It(e, typeof n != "symbol" ? n + "" : n, t);
+import { jsxs as b, jsx as i, Fragment as Mt } from "react/jsx-runtime";
+import { useState as C, useEffect as L, useRef as V, useCallback as _, forwardRef as Bt, useImperativeHandle as Dt } from "react";
+import { LexicalComposer as Wt } from "@lexical/react/LexicalComposer";
+import { RichTextPlugin as zt } from "@lexical/react/LexicalRichTextPlugin";
+import { ContentEditable as Ht } from "@lexical/react/LexicalContentEditable";
+import { HistoryPlugin as Ft } from "@lexical/react/LexicalHistoryPlugin";
+import { LexicalErrorBoundary as Rt } from "@lexical/react/LexicalErrorBoundary";
+import { useLexicalComposerContext as E } from "@lexical/react/LexicalComposerContext";
+import { $applyNodeReplacement as X, $createTextNode as jt, ElementNode as Kt, ParagraphNode as ct, $getNodeByKey as ut, DecoratorNode as ht, $getSelection as D, $isRangeSelection as W, $insertNodes as Pt, $isElementNode as Jt, SELECTION_CHANGE_COMMAND as Ut, COMMAND_PRIORITY_LOW as H, CAN_UNDO_COMMAND as Gt, CAN_REDO_COMMAND as Vt, FORMAT_TEXT_COMMAND as Xt, FORMAT_ELEMENT_COMMAND as Yt, UNDO_COMMAND as Zt, REDO_COMMAND as qt, $getRoot as Qt } from "lexical";
+import { $insertNodeToNearestRoot as dt, mergeRegister as te } from "@lexical/utils";
+import { $patchStyleText as ft, $getSelectionStyleValueForProperty as ee } from "@lexical/selection";
+import { $generateHtmlFromNodes as re } from "@lexical/html";
+const ne = {
+  paragraph: "bew-paragraph",
+  text: {
+    bold: "bew-text-bold",
+    italic: "bew-text-italic",
+    underline: "bew-text-underline",
+    strikethrough: "bew-text-strikethrough"
+  }
+}, Y = [
+  { token: "primary", hex: "#0d6efd" },
+  { token: "secondary", hex: "#6c757d" },
+  { token: "success", hex: "#198754" },
+  { token: "info", hex: "#0dcaf0" },
+  { token: "warning", hex: "#ffc107" },
+  { token: "danger", hex: "#dc3545" },
+  { token: "light", hex: "#f8f9fa" },
+  { token: "dark", hex: "#212529" },
+  { token: "black", hex: "#000000" },
+  { token: "white", hex: "#ffffff" },
+  { token: "transparent", hex: "transparent" }
+], oe = {
+  gray: ["#f8f9fa", "#e9ecef", "#dee2e6", "#ced4da", "#adb5bd", "#6c757d", "#495057", "#343a40", "#212529"],
+  blue: ["#cfe2ff", "#9ec5fe", "#6ea8fe", "#3d8bfd", "#0d6efd", "#0a58ca", "#084298", "#052c65", "#031633"],
+  indigo: ["#e0cffc", "#c29ffa", "#a370f7", "#8540f5", "#6610f2", "#520dc2", "#3d0a91", "#290661", "#140330"],
+  purple: ["#e2d9f3", "#c5b3e6", "#a98eda", "#8c68cd", "#6f42c1", "#59359a", "#432874", "#2c1a4d", "#160d27"],
+  pink: ["#f7d6e6", "#efadce", "#e685b5", "#de5c9d", "#d63384", "#ab296a", "#801f4f", "#561435", "#2b0a1a"],
+  red: ["#f8d7da", "#f1aeb5", "#ea868f", "#e35d6a", "#dc3545", "#b02a37", "#842029", "#58151c", "#2c0b0e"],
+  orange: ["#ffe5d0", "#fecba1", "#feb272", "#fd9843", "#fd7e14", "#ca6510", "#984c0c", "#653208", "#331904"],
+  yellow: ["#fff3cd", "#ffe69c", "#ffda6a", "#ffcd39", "#ffc107", "#cc9a06", "#997404", "#664d03", "#332701"],
+  green: ["#d1e7dd", "#a3cfbb", "#75b798", "#479f76", "#198754", "#146c43", "#0f5132", "#0a3622", "#051b11"],
+  teal: ["#d2f4ea", "#a6e9d5", "#79dfc1", "#4dd4ac", "#20c997", "#1aa179", "#13795b", "#0d503c", "#06281e"],
+  cyan: ["#cff4fc", "#9eeaf9", "#6edff6", "#3dd5f3", "#0dcaf0", "#0aa2c0", "#087990", "#055160", "#032830"]
+}, Z = Object.entries(oe).map(
+  ([e, n]) => ({
+    name: e,
+    shades: n.map((t, r) => {
+      const o = (r + 1) * 100;
+      return { shade: o, token: `${e}-${o}`, hex: t };
+    })
+  })
+), q = /* @__PURE__ */ new Map();
+for (const e of Y) q.set(e.token, e.hex);
+for (const e of Z)
+  for (const n of e.shades) q.set(n.token, n.hex);
+const Q = /* @__PURE__ */ new Map();
+for (const e of Z)
+  for (const n of e.shades) Q.set(n.hex.toLowerCase(), n.token);
+for (const e of Y) Q.set(e.hex.toLowerCase(), e.token);
+function bt(e) {
+  return e.startsWith("#");
+}
+function x(e) {
+  return bt(e) || e === "transparent" ? e : q.get(e) ?? e;
+}
+function I(e, n) {
+  return bt(e) ? null : `${n}-${e}`;
+}
+function ie(e) {
+  return Q.get(e.toLowerCase()) ?? null;
+}
+function mt(e, n, t) {
+  const r = [], o = [];
+  if (e) {
+    const s = I(e, "text");
+    s ? r.push(s) : o.push(`color: ${x(e)}`);
+  }
+  if (n) {
+    const s = I(n, "bg");
+    s ? r.push(s) : o.push(`background-color: ${x(n)}`);
+  }
+  if (t) {
+    const s = I(t, "border");
+    s ? r.push(s) : o.push(`border-color: ${x(t)}`);
+  }
+  return { classes: r, style: o.join("; ") };
+}
+const v = [
+  "xs",
+  "sm",
+  "base",
+  "lg",
+  "xl",
+  "2xl",
+  "3xl",
+  "4xl",
+  "5xl",
+  "6xl",
+  "7xl"
+], pt = {
+  xs: 12,
+  sm: 14,
+  base: 16,
+  lg: 18,
+  xl: 20,
+  "2xl": 24,
+  "3xl": 30,
+  "4xl": 36,
+  "5xl": 48,
+  "6xl": 64,
+  "7xl": 80
+}, tt = "base";
+function gt(e) {
+  return v.includes(e);
+}
+function M(e) {
+  return pt[e];
+}
+function _t(e) {
+  return !e || e === "base" || !gt(e) ? null : `text-${e}`;
+}
+function xt(e) {
+  return v.find((n) => pt[n] === e) ?? null;
+}
+function F(e, n) {
+  const t = e && gt(e) ? e : tt, r = v.indexOf(t), o = Math.max(
+    0,
+    Math.min(v.length - 1, r + n)
+  );
+  return v[o];
+}
+const se = /* @__PURE__ */ new Set([
+  "primary",
+  "secondary",
+  "success",
+  "danger",
+  "warning",
+  "info",
+  "light",
+  "dark"
+]);
+class T extends Kt {
+  constructor(t = "#", r = "primary", o = !1, s = null, l = null, c = null, a = null, d) {
+    super(d);
+    p(this, "__href");
+    p(this, "__variant");
+    p(this, "__outline");
+    p(this, "__textColor");
+    p(this, "__bgColor");
+    p(this, "__borderColor");
+    p(this, "__fontSize");
+    this.__href = t, this.__variant = r, this.__outline = o, this.__textColor = s, this.__bgColor = l, this.__borderColor = c, this.__fontSize = a;
+  }
+  static getType() {
+    return "bootstrap-button";
+  }
+  static clone(t) {
+    return new T(
+      t.__href,
+      t.__variant,
+      t.__outline,
+      t.__textColor,
+      t.__bgColor,
+      t.__borderColor,
+      t.__fontSize,
+      t.__key
+    );
+  }
+  // --- Rendering -----------------------------------------------------------
+  variantClass() {
+    return this.__outline ? `btn-outline-${this.__variant}` : `btn-${this.__variant}`;
+  }
+  buildClassName() {
+    return `btn ${this.variantClass()}`;
+  }
+  applyInlineStyles(t) {
+    t.style.color = this.__textColor ? x(this.__textColor) : "", t.style.backgroundColor = this.__bgColor ? x(this.__bgColor) : "", t.style.borderColor = this.__borderColor ? x(this.__borderColor) : "", t.style.fontSize = this.__fontSize ? `${M(this.__fontSize)}px` : "";
+  }
+  createDOM(t) {
+    const r = document.createElement("a");
+    return r.href = this.__href, r.className = this.buildClassName(), this.applyInlineStyles(r), r;
+  }
+  updateDOM(t, r) {
+    const o = r;
+    return t.__href !== this.__href && (o.href = this.__href), (t.__variant !== this.__variant || t.__outline !== this.__outline) && (o.className = this.buildClassName()), (t.__textColor !== this.__textColor || t.__bgColor !== this.__bgColor || t.__borderColor !== this.__borderColor || t.__fontSize !== this.__fontSize) && this.applyInlineStyles(o), !1;
+  }
+  // --- HTML import / export ------------------------------------------------
+  static importDOM() {
+    return {
+      a: (t) => t.classList.contains("btn") ? { conversion: le, priority: 1 } : null
+    };
+  }
+  exportDOM() {
+    const t = document.createElement("a");
+    t.setAttribute("href", this.__href);
+    const { classes: r, style: o } = mt(
+      this.__textColor,
+      this.__bgColor,
+      this.__borderColor
+    );
+    t.className = [this.buildClassName(), ...r].join(" ");
+    const s = o ? [o] : [];
+    return this.__fontSize && s.push(`font-size: ${M(this.__fontSize)}px`), s.length && t.setAttribute("style", s.join("; ")), { element: t };
+  }
+  // --- JSON serialization --------------------------------------------------
+  static importJSON(t) {
+    const r = et({
+      href: t.href,
+      variant: t.variant,
+      outline: t.outline,
+      textColor: t.textColor ?? null,
+      bgColor: t.bgColor ?? null,
+      borderColor: t.borderColor ?? null,
+      fontSize: t.fontSize ?? null
+    });
+    return r.setFormat(t.format), r.setIndent(t.indent), r.setDirection(t.direction), r;
+  }
+  exportJSON() {
+    return {
+      ...super.exportJSON(),
+      type: "bootstrap-button",
+      version: 1,
+      href: this.getHref(),
+      variant: this.getVariant(),
+      outline: this.getOutline(),
+      textColor: this.__textColor,
+      bgColor: this.__bgColor,
+      borderColor: this.__borderColor,
+      fontSize: this.__fontSize
+    };
+  }
+  // --- Accessors -----------------------------------------------------------
+  getHref() {
+    return this.getLatest().__href;
+  }
+  setHref(t) {
+    const r = this.getWritable();
+    return r.__href = t, r;
+  }
+  getVariant() {
+    return this.getLatest().__variant;
+  }
+  setVariant(t) {
+    const r = this.getWritable();
+    return r.__variant = t, r;
+  }
+  getOutline() {
+    return this.getLatest().__outline;
+  }
+  setOutline(t) {
+    const r = this.getWritable();
+    return r.__outline = t, r;
+  }
+  getTextColor() {
+    return this.getLatest().__textColor;
+  }
+  setTextColor(t) {
+    const r = this.getWritable();
+    return r.__textColor = t, r;
+  }
+  getBgColor() {
+    return this.getLatest().__bgColor;
+  }
+  setBgColor(t) {
+    const r = this.getWritable();
+    return r.__bgColor = t, r;
+  }
+  getBorderColor() {
+    return this.getLatest().__borderColor;
+  }
+  setBorderColor(t) {
+    const r = this.getWritable();
+    return r.__borderColor = t, r;
+  }
+  getFontSize() {
+    return this.getLatest().__fontSize;
+  }
+  setFontSize(t) {
+    const r = this.getWritable();
+    return r.__fontSize = t, r;
+  }
+  // --- Behavior ------------------------------------------------------------
+  isInline() {
+    return !0;
+  }
+  canBeEmpty() {
+    return !1;
+  }
+  canInsertTextBefore() {
+    return !1;
+  }
+  canInsertTextAfter() {
+    return !1;
+  }
+}
+function le(e) {
+  const n = e, t = Array.from(n.classList).some(
+    (s) => s.startsWith("btn-outline-")
+  );
+  let r = "primary";
+  for (const s of Array.from(n.classList)) {
+    const l = s.replace(/^btn-outline-/, "").replace(/^btn-/, "");
+    if (l !== s && se.has(l)) {
+      r = l;
+      break;
+    }
+  }
+  return { node: et({
+    href: n.getAttribute("href") ?? "#",
+    variant: r,
+    outline: t
+  }) };
+}
+function et(e = {}) {
+  const {
+    href: n = "#",
+    variant: t = "primary",
+    outline: r = !1,
+    textColor: o = null,
+    bgColor: s = null,
+    borderColor: l = null,
+    fontSize: c = null
+  } = e;
+  return X(
+    new T(
+      n,
+      t,
+      r,
+      o,
+      s,
+      l,
+      c
+    )
+  );
+}
+function ae(e, n = {}) {
+  const t = et(n);
+  return t.append(jt(e)), t;
+}
+function rt(e) {
+  return e instanceof T;
+}
+function nt(e) {
+  switch (e) {
+    case "center":
+      return "center";
+    case "right":
+      return "right";
+    case "justify":
+      return "justify";
+    case "left":
+      return "left";
+    // Logical directions map to physical ones for LTR email content.
+    case "start":
+      return "left";
+    case "end":
+      return "right";
+    default:
+      return null;
+  }
+}
+function ce(e) {
+  const n = nt(e);
+  return n ? `text-${n}` : null;
+}
+function ue(e) {
+  const n = nt(e);
+  return !n || n === "justify" ? null : `ax-${n}`;
+}
+class N extends ct {
+  constructor(t = null, r = null, o = null, s) {
+    super(s);
+    p(this, "__textColor");
+    p(this, "__bgColor");
+    p(this, "__fontSize");
+    this.__textColor = t, this.__bgColor = r, this.__fontSize = o;
+  }
+  static getType() {
+    return "bootstrap-paragraph";
+  }
+  static clone(t) {
+    return new N(
+      t.__textColor,
+      t.__bgColor,
+      t.__fontSize,
+      t.__key
+    );
+  }
+  static importJSON(t) {
+    const r = new N(
+      t.textColor ?? null,
+      t.bgColor ?? null,
+      t.fontSize ?? null
+    );
+    return r.setFormat(t.format), r.setIndent(t.indent), r.setDirection(t.direction), r;
+  }
+  exportJSON() {
+    return {
+      ...super.exportJSON(),
+      type: "bootstrap-paragraph",
+      version: 1,
+      textColor: this.__textColor,
+      bgColor: this.__bgColor,
+      fontSize: this.__fontSize
+    };
+  }
+  getFontSize() {
+    return this.getLatest().__fontSize;
+  }
+  setFontSize(t) {
+    const r = this.getWritable();
+    return r.__fontSize = t, r;
+  }
+  getTextColor() {
+    return this.getLatest().__textColor;
+  }
+  setTextColor(t) {
+    const r = this.getWritable();
+    return r.__textColor = t, r;
+  }
+  getBgColor() {
+    return this.getLatest().__bgColor;
+  }
+  setBgColor(t) {
+    const r = this.getWritable();
+    return r.__bgColor = t, r;
+  }
+  applyInlineStyles(t) {
+    t.style.color = this.__textColor ? x(this.__textColor) : "", t.style.backgroundColor = this.__bgColor ? x(this.__bgColor) : "", t.style.fontSize = this.__fontSize ? `${M(this.__fontSize)}px` : "";
+  }
+  createDOM(t) {
+    const r = super.createDOM(t);
+    return this.applyInlineStyles(r), r;
+  }
+  updateDOM(t, r, o) {
+    return super.updateDOM(t, r, o) ? !0 : (this.applyInlineStyles(r), !1);
+  }
+  hasButtonChild() {
+    return this.getChildren().some(
+      (t) => rt(t)
+    );
+  }
+  exportDOM() {
+    const t = document.createElement("div"), r = [], o = this.hasButtonChild() ? ue(this.getFormatType()) : ce(this.getFormatType());
+    o && r.push(o);
+    const { classes: s, style: l } = mt(
+      this.__textColor,
+      this.__bgColor
+    );
+    r.push(...s);
+    const c = _t(this.__fontSize);
+    return c && r.push(c), r.length && (t.className = r.join(" ")), l && t.setAttribute("style", l), this.getChildrenSize() === 0 && t.appendChild(document.createElement("br")), { element: t };
+  }
+}
+const J = [
+  { key: "0", px: 0 },
+  { key: "1", px: 4 },
+  { key: "2", px: 8 },
+  { key: "3", px: 12 },
+  { key: "4", px: 16 },
+  { key: "5", px: 20 },
+  { key: "6", px: 24 },
+  { key: "7", px: 28 },
+  { key: "8", px: 32 },
+  { key: "9", px: 36 },
+  { key: "10", px: 40 },
+  { key: "12", px: 48 },
+  { key: "16", px: 64 },
+  { key: "20", px: 80 },
+  { key: "24", px: 96 },
+  { key: "32", px: 128 },
+  { key: "40", px: 160 },
+  { key: "48", px: 192 },
+  { key: "56", px: 224 },
+  { key: "64", px: 256 },
+  { key: "80", px: 320 },
+  { key: "96", px: 384 },
+  { key: "112", px: 448 },
+  { key: "128", px: 512 },
+  { key: "144", px: 576 },
+  { key: "150", px: 600 }
+];
+function R(e) {
+  var n;
+  return e ? ((n = J.find((t) => t.key === e)) == null ? void 0 : n.px) ?? null : null;
+}
+function he(e, n, t) {
+  if (e === "fixed") {
+    const r = [];
+    return n && r.push(`w-${n}`), t && r.push(`h-${t}`), r.length ? r : ["img-fluid"];
+  }
+  return e === "max" ? n ? [`max-w-${n}`, "w-full"] : ["img-fluid"] : ["img-fluid"];
+}
+function de(e) {
+  let n = "fluid", t = null, r = null;
+  for (const o of e) {
+    const s = o.match(/^max-w-(.+)$/), l = o.match(/^w-(.+)$/), c = o.match(/^h-(.+)$/);
+    s && s[1] !== "full" ? (n = "max", t = s[1]) : l && l[1] !== "full" && l[1] !== "auto" ? (n = "fixed", t = l[1]) : c && c[1] !== "full" && c[1] !== "auto" && (n = "fixed", r = c[1]);
+  }
+  return { mode: n, width: t, height: r };
+}
+function fe(e, n, t) {
+  if (e === "fixed") {
+    const r = R(n), o = R(t);
+    return r !== null ? { width: `${r}px`, height: "auto" } : o !== null ? { width: "auto", height: `${o}px` } : { width: "auto", height: "auto" };
+  }
+  if (e === "max") {
+    const r = R(n);
+    return {
+      maxWidth: r !== null ? `${r}px` : "100%",
+      width: "100%",
+      height: "auto"
+    };
+  }
+  return { maxWidth: "100%", width: "100%", height: "auto" };
+}
+function B({
+  label: e,
+  steps: n,
+  value: t,
+  fallbackKey: r,
+  onChange: o
+}) {
+  var a;
+  const s = t ?? r, l = Math.max(
+    0,
+    n.findIndex((d) => d.key === s)
+  ), c = ((a = n[l]) == null ? void 0 : a.px) ?? 0;
+  return /* @__PURE__ */ b("label", { className: "bew-slider", children: [
+    /* @__PURE__ */ b("span", { className: "bew-slider-head", children: [
+      e,
+      /* @__PURE__ */ b("span", { className: "bew-slider-px", children: [
+        c,
+        "px"
+      ] })
+    ] }),
+    /* @__PURE__ */ i(
+      "input",
+      {
+        type: "range",
+        min: 0,
+        max: n.length - 1,
+        step: 1,
+        value: l,
+        onChange: (d) => o(n[Number(d.target.value)].key)
+      }
+    )
+  ] });
+}
+const be = [
+  { mode: "fluid", label: "Full width" },
+  { mode: "fixed", label: "Fixed size" },
+  { mode: "max", label: "Max width" }
+];
+function me({
+  nodeKey: e,
+  src: n,
+  alt: t,
+  mode: r,
+  width: o,
+  height: s
+}) {
+  const [l] = E(), [c, a] = C(!1), d = (h) => {
+    l.update(() => {
+      const m = ut(e);
+      ge(m) && h(m);
+    });
+  }, g = (h) => {
+    d((m) => {
+      m.setMode(h), h === "fluid" ? (m.setWidth(null), m.setHeight(null)) : h === "fixed" ? !m.getWidth() && !m.getHeight() && m.setWidth("64") : h === "max" && (m.setHeight(null), m.getWidth() || m.setWidth("96"));
+    });
+  }, f = s !== null ? "height" : "width";
+  return (
+    // The container is block-level and does NOT resize with the image, so the
+    // settings panel stays anchored while the image (and its wrap) grow.
+    /* @__PURE__ */ b("div", { className: "bew-image-container", children: [
+      /* @__PURE__ */ b("span", { className: "bew-image-wrap", draggable: !1, children: [
+        /* @__PURE__ */ i(
+          "img",
+          {
+            src: n,
+            alt: t,
+            className: "bew-image",
+            style: fe(r, o, s)
+          }
+        ),
+        /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            className: "bew-image-gear",
+            "aria-label": "Image settings",
+            onClick: () => a((h) => !h),
+            children: "⚙"
+          }
+        )
+      ] }),
+      c && /* @__PURE__ */ b("div", { className: "bew-image-panel", children: [
+        /* @__PURE__ */ i("div", { className: "bew-image-modes", children: be.map((h) => /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            className: `bew-image-mode${r === h.mode ? " is-active" : ""}`,
+            onClick: () => g(h.mode),
+            children: h.label
+          },
+          h.mode
+        )) }),
+        r === "fixed" && /* @__PURE__ */ b(Mt, { children: [
+          /* @__PURE__ */ b("div", { className: "bew-image-modes", children: [
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                className: `bew-image-mode${f === "width" ? " is-active" : ""}`,
+                onClick: () => d((h) => {
+                  h.setHeight(null), h.getWidth() || h.setWidth("64");
+                }),
+                children: "Width"
+              }
+            ),
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                className: `bew-image-mode${f === "height" ? " is-active" : ""}`,
+                onClick: () => d((h) => {
+                  h.setWidth(null), h.getHeight() || h.setHeight("48");
+                }),
+                children: "Height"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ i(
+            B,
+            {
+              label: f === "width" ? "Width" : "Height",
+              steps: J,
+              value: f === "width" ? o : s,
+              fallbackKey: f === "width" ? "64" : "48",
+              onChange: (h) => d((m) => {
+                f === "width" ? (m.setWidth(h), m.setHeight(null)) : (m.setHeight(h), m.setWidth(null));
+              })
+            }
+          )
+        ] }),
+        r === "max" && /* @__PURE__ */ i(
+          B,
+          {
+            label: "Max width",
+            steps: J,
+            value: o,
+            fallbackKey: "96",
+            onChange: (h) => d((m) => m.setWidth(h))
+          }
+        )
+      ] })
+    ] })
+  );
+}
+class O extends ht {
+  constructor(t, r = "", o = "fluid", s = null, l = null, c) {
+    super(c);
+    p(this, "__src");
+    p(this, "__alt");
+    p(this, "__mode");
+    p(this, "__width");
+    p(this, "__height");
+    this.__src = t, this.__alt = r, this.__mode = o, this.__width = s, this.__height = l;
+  }
+  static getType() {
+    return "bootstrap-image";
+  }
+  static clone(t) {
+    return new O(
+      t.__src,
+      t.__alt,
+      t.__mode,
+      t.__width,
+      t.__height,
+      t.__key
+    );
+  }
+  static importJSON(t) {
+    return ot({
+      src: t.src,
+      alt: t.alt,
+      mode: t.mode,
+      width: t.width,
+      height: t.height
+    });
+  }
+  exportJSON() {
+    return {
+      type: "bootstrap-image",
+      version: 1,
+      src: this.__src,
+      alt: this.__alt,
+      mode: this.__mode,
+      width: this.__width,
+      height: this.__height
+    };
+  }
+  static importDOM() {
+    return {
+      img: () => ({ conversion: pe, priority: 0 })
+    };
+  }
+  exportDOM() {
+    const t = document.createElement("img");
+    return t.setAttribute("src", this.__src), t.setAttribute("alt", this.__alt), t.className = he(
+      this.__mode,
+      this.__width,
+      this.__height
+    ).join(" "), { element: t };
+  }
+  // --- Accessors -----------------------------------------------------------
+  getSrc() {
+    return this.getLatest().__src;
+  }
+  setSrc(t) {
+    const r = this.getWritable();
+    return r.__src = t, r;
+  }
+  getAlt() {
+    return this.getLatest().__alt;
+  }
+  setAlt(t) {
+    const r = this.getWritable();
+    return r.__alt = t, r;
+  }
+  getMode() {
+    return this.getLatest().__mode;
+  }
+  setMode(t) {
+    const r = this.getWritable();
+    return r.__mode = t, r;
+  }
+  getWidth() {
+    return this.getLatest().__width;
+  }
+  setWidth(t) {
+    const r = this.getWritable();
+    return r.__width = t, r;
+  }
+  getHeight() {
+    return this.getLatest().__height;
+  }
+  setHeight(t) {
+    const r = this.getWritable();
+    return r.__height = t, r;
+  }
+  // --- Rendering -----------------------------------------------------------
+  createDOM() {
+    const t = document.createElement("div");
+    return t.className = "bew-image-block", t;
+  }
+  updateDOM() {
+    return !1;
+  }
+  isInline() {
+    return !1;
+  }
+  decorate() {
+    return /* @__PURE__ */ i(
+      me,
+      {
+        nodeKey: this.getKey(),
+        src: this.__src,
+        alt: this.__alt,
+        mode: this.__mode,
+        width: this.__width,
+        height: this.__height
+      }
+    );
+  }
+}
+function pe(e) {
+  const n = e, t = n.getAttribute("src");
+  if (!t) return null;
+  const r = n.getAttribute("alt") ?? "", { mode: o, width: s, height: l } = de(Array.from(n.classList));
+  return { node: ot({ src: t, alt: r, mode: o, width: s, height: l }) };
+}
+function ot(e) {
+  const { src: n, alt: t = "", mode: r = "fluid", width: o = null, height: s = null, key: l } = e;
+  return X(
+    new O(n, t, r, o, s, l)
+  );
+}
+function ge(e) {
+  return e instanceof O;
+}
+const U = [
+  { key: "0", px: 0 },
+  { key: "1", px: 4 },
+  { key: "2", px: 8 },
+  { key: "3", px: 12 },
+  { key: "4", px: 16 },
+  { key: "5", px: 20 },
+  { key: "6", px: 24 },
+  { key: "7", px: 28 },
+  { key: "8", px: 32 },
+  { key: "9", px: 36 },
+  { key: "10", px: 40 },
+  { key: "12", px: 48 },
+  { key: "16", px: 64 },
+  { key: "20", px: 80 },
+  { key: "24", px: 96 },
+  { key: "32", px: 128 },
+  { key: "40", px: 160 }
+], w = "5";
+function lt(e) {
+  var n;
+  return ((n = U.find((t) => t.key === e)) == null ? void 0 : n.px) ?? 0;
+}
+function _e(e, n) {
+  return [`mt-${e}`, `mb-${n}`];
+}
+function xe(e) {
+  let n = w, t = w;
+  for (const r of e) {
+    const o = r.match(/^my-(.+)$/), s = r.match(/^mt-(.+)$/), l = r.match(/^mb-(.+)$/);
+    o ? (n = o[1], t = o[1]) : s ? n = s[1] : l && (t = l[1]);
+  }
+  return { top: n, bottom: t };
+}
+function ye({ nodeKey: e, top: n, bottom: t }) {
+  const [r] = E(), [o, s] = C(!1), l = (c) => {
+    r.update(() => {
+      const a = ut(e);
+      we(a) && c(a);
+    });
+  };
+  return (
+    // Container stays a stable positioning context; the rule moves with its
+    // margins but the gear/panel stay anchored (no flicker while dragging).
+    /* @__PURE__ */ b("div", { className: "bew-hr-container", children: [
+      /* @__PURE__ */ i(
+        "hr",
+        {
+          className: "bew-hr",
+          style: {
+            marginTop: `${lt(n)}px`,
+            marginBottom: `${lt(t)}px`
+          }
+        }
+      ),
+      /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          className: "bew-hr-gear",
+          "aria-label": "Separator settings",
+          onClick: () => s((c) => !c),
+          children: "⚙"
+        }
+      ),
+      o && /* @__PURE__ */ b("div", { className: "bew-hr-panel", children: [
+        /* @__PURE__ */ i(
+          B,
+          {
+            label: "Top spacing",
+            steps: U,
+            value: n,
+            fallbackKey: w,
+            onChange: (c) => l((a) => a.setTop(c))
+          }
+        ),
+        /* @__PURE__ */ i(
+          B,
+          {
+            label: "Bottom spacing",
+            steps: U,
+            value: t,
+            fallbackKey: w,
+            onChange: (c) => l((a) => a.setBottom(c))
+          }
+        )
+      ] })
+    ] })
+  );
+}
+class A extends ht {
+  constructor(t = w, r = w, o) {
+    super(o);
+    p(this, "__top");
+    p(this, "__bottom");
+    this.__top = t, this.__bottom = r;
+  }
+  static getType() {
+    return "bootstrap-hr";
+  }
+  static clone(t) {
+    return new A(t.__top, t.__bottom, t.__key);
+  }
+  static importJSON(t) {
+    return it({
+      top: t.top,
+      bottom: t.bottom
+    });
+  }
+  exportJSON() {
+    return {
+      type: "bootstrap-hr",
+      version: 1,
+      top: this.__top,
+      bottom: this.__bottom
+    };
+  }
+  static importDOM() {
+    return { hr: () => ({ conversion: Ce, priority: 0 }) };
+  }
+  exportDOM() {
+    const t = document.createElement("hr");
+    return t.className = _e(this.__top, this.__bottom).join(" "), { element: t };
+  }
+  getTop() {
+    return this.getLatest().__top;
+  }
+  setTop(t) {
+    const r = this.getWritable();
+    return r.__top = t, r;
+  }
+  getBottom() {
+    return this.getLatest().__bottom;
+  }
+  setBottom(t) {
+    const r = this.getWritable();
+    return r.__bottom = t, r;
+  }
+  createDOM() {
+    const t = document.createElement("div");
+    return t.className = "bew-hr-block", t;
+  }
+  updateDOM() {
+    return !1;
+  }
+  isInline() {
+    return !1;
+  }
+  decorate() {
+    return /* @__PURE__ */ i(
+      ye,
+      {
+        nodeKey: this.getKey(),
+        top: this.__top,
+        bottom: this.__bottom
+      }
+    );
+  }
+}
+function Ce(e) {
+  const { top: n, bottom: t } = xe(Array.from(e.classList));
+  return { node: it({ top: n, bottom: t }) };
+}
+function it(e = {}) {
+  const { top: n = w, bottom: t = w, key: r } = e;
+  return X(new A(n, t, r));
+}
+function we(e) {
+  return e instanceof A;
+}
+function ke(e, n = {}) {
+  const { label: t = "Button", ...r } = n;
+  e.update(() => {
+    const o = D();
+    W(o) && Pt([ae(t, r)]);
+  });
+}
+function Ne(e, n) {
+  e.update(() => {
+    dt(ot(n));
+  });
+}
+function Se(e, n = {}) {
+  e.update(() => {
+    dt(it(n));
+  });
+}
+const ve = {
+  variant: "primary",
+  outline: !1,
+  textColor: null,
+  bgColor: null,
+  borderColor: null,
+  fontSize: null
+};
+let yt = { ...ve };
+function $e() {
+  return { ...yt };
+}
+function Ct(e) {
+  yt = { ...e };
+}
+function wt(e) {
+  return {
+    variant: e.getVariant(),
+    outline: e.getOutline(),
+    textColor: e.getTextColor(),
+    bgColor: e.getBgColor(),
+    borderColor: e.getBorderColor(),
+    fontSize: e.getFontSize()
+  };
+}
+function Le(e) {
+  return e !== null && typeof e.setTextColor == "function";
+}
+function Ee(e, n, t) {
+  n === "text" ? e.setTextColor(t) : n === "bg" && e.setBgColor(t);
+}
+function Te(e, n, t) {
+  const r = n === "text" ? e.setTextColor(t) : n === "bg" ? e.setBgColor(t) : e.setBorderColor(t);
+  Ct(wt(r));
+}
+function Oe(e, n) {
+  const t = D();
+  if (!W(t)) return;
+  const r = t.anchor.getNode();
+  let o = r;
+  for (; o !== null; ) {
+    if (rt(o)) {
+      Te(o, e, n);
+      return;
+    }
+    o = o.getParent();
+  }
+  if (e === "border") return;
+  if (t.isCollapsed()) {
+    const l = r.getKey() === "root" ? null : r.getTopLevelElementOrThrow();
+    Le(l) && Ee(l, e, n);
+    return;
+  }
+  ft(t, {
+    [e === "text" ? "color" : "background-color"]: n ? x(n) : null
+  });
+}
+function Ae(e, n, t) {
+  e.update(() => Oe(n, t));
+}
+function Ie(e) {
+  return e !== null && typeof e.setFontSize == "function";
+}
+function at(e) {
+  return e === tt ? null : e;
+}
+function Me(e) {
+  const n = e === "increase" ? 1 : -1, t = D();
+  if (!W(t)) return;
+  const r = t.anchor.getNode();
+  let o = r;
+  for (; o !== null; ) {
+    if (rt(o)) {
+      const d = F(o.getFontSize(), n), g = o.setFontSize(at(d));
+      Ct(wt(g));
+      return;
+    }
+    o = o.getParent();
+  }
+  if (t.isCollapsed()) {
+    const d = r.getKey() === "root" ? null : r.getTopLevelElementOrThrow();
+    if (Ie(d)) {
+      const g = F(d.getFontSize(), n);
+      d.setFontSize(at(g));
+    }
+    return;
+  }
+  const s = ee(
+    t,
+    "font-size",
+    ""
+  ), l = parseInt(s, 10), c = Number.isNaN(l) ? null : xt(l), a = F(c, n);
+  ft(t, {
+    "font-size": a === tt ? null : `${M(a)}px`
+  });
+}
+function Be(e, n) {
+  e.update(() => Me(n));
+}
+const kt = "bew:custom-colors", G = /* @__PURE__ */ new Set();
+let k = null;
+function z() {
+  if (k) return k;
+  try {
+    if (typeof localStorage < "u") {
+      const e = localStorage.getItem(kt);
+      k = e ? JSON.parse(e) : [];
+    } else
+      k = [];
+  } catch {
+    k = [];
+  }
+  return k;
+}
+function Nt(e) {
+  k = e;
+  try {
+    typeof localStorage < "u" && localStorage.setItem(kt, JSON.stringify(e));
+  } catch {
+  }
+  G.forEach((n) => n(e));
+}
+function gr() {
+  return z();
+}
+function De(e) {
+  const n = e.toLowerCase(), t = z();
+  t.includes(n) || Nt([...t, n]);
+}
+function We(e) {
+  const n = e.toLowerCase();
+  Nt(z().filter((t) => t !== n));
+}
+function ze() {
+  const [e, n] = C(z);
+  return L(() => (G.add(n), () => {
+    G.delete(n);
+  }), []), e;
+}
+function j({ hex: e, token: n, title: t, onSelect: r, onRemove: o }) {
+  const s = e === "transparent";
+  return /* @__PURE__ */ i(
+    "button",
+    {
+      type: "button",
+      className: `bew-swatch${s ? " bew-swatch--transparent" : ""}`,
+      style: s ? void 0 : { backgroundColor: e },
+      title: t,
+      "aria-label": t,
+      onClick: () => r(n),
+      onContextMenu: o ? (l) => {
+        l.preventDefault(), o();
+      } : void 0
+    }
+  );
+}
+function K({ onSelect: e }) {
+  const n = ze(), t = V(null);
+  return /* @__PURE__ */ b("div", { className: "bew-color-picker", children: [
+    /* @__PURE__ */ b(
+      "button",
+      {
+        type: "button",
+        className: "bew-color-clear",
+        onClick: () => e(null),
+        children: [
+          /* @__PURE__ */ i("span", { className: "bew-color-clear-swatch" }),
+          "No color"
+        ]
+      }
+    ),
+    /* @__PURE__ */ i("div", { className: "bew-color-row", children: Y.map((r) => /* @__PURE__ */ i(
+      j,
+      {
+        hex: r.hex,
+        token: r.token,
+        title: r.token,
+        onSelect: e
+      },
+      r.token
+    )) }),
+    /* @__PURE__ */ i("div", { className: "bew-color-grid", children: Z.map((r) => /* @__PURE__ */ i("div", { className: "bew-color-grid-row", children: [...r.shades].reverse().map((o) => /* @__PURE__ */ i(
+      j,
+      {
+        hex: o.hex,
+        token: o.token,
+        title: o.token,
+        onSelect: e
+      },
+      o.token
+    )) }, r.name)) }),
+    /* @__PURE__ */ b("div", { className: "bew-color-custom", children: [
+      /* @__PURE__ */ i("span", { className: "bew-color-custom-label", children: "Custom" }),
+      /* @__PURE__ */ b("div", { className: "bew-color-row", children: [
+        n.map((r) => /* @__PURE__ */ i(
+          j,
+          {
+            hex: r,
+            token: r,
+            title: `${r} (right-click to remove)`,
+            onSelect: e,
+            onRemove: () => We(r)
+          },
+          r
+        )),
+        /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            className: "bew-swatch bew-swatch--add",
+            title: "Add a custom color",
+            "aria-label": "Add a custom color",
+            onClick: () => {
+              var r;
+              return (r = t.current) == null ? void 0 : r.click();
+            },
+            children: "+"
+          }
+        ),
+        /* @__PURE__ */ i(
+          "input",
+          {
+            ref: t,
+            type: "color",
+            className: "bew-color-input",
+            onChange: (r) => {
+              const o = r.target.value.toLowerCase();
+              De(o), e(o);
+            }
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function S(...e) {
+  return e.filter(Boolean).join(" ");
+}
+function He() {
+  return /* @__PURE__ */ i(
+    "svg",
+    {
+      className: "bew-tb-chevron",
+      width: "10",
+      height: "10",
+      viewBox: "0 0 10 10",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ i(
+        "path",
+        {
+          d: "M2 3.5L5 6.5L8 3.5",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "1.4",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+const Fe = {
+  left: [
+    [1, 15],
+    [1, 9],
+    [1, 15],
+    [1, 9]
+  ],
+  center: [
+    [1, 15],
+    [4, 12],
+    [1, 15],
+    [4, 12]
+  ],
+  right: [
+    [1, 15],
+    [7, 15],
+    [1, 15],
+    [7, 15]
+  ],
+  justify: [
+    [1, 15],
+    [1, 15],
+    [1, 15],
+    [1, 15]
+  ]
+};
+function Re({ align: e }) {
+  return /* @__PURE__ */ i("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: Fe[e].map(([n, t], r) => /* @__PURE__ */ i(
+    "line",
+    {
+      x1: n,
+      x2: t,
+      y1: 3 + r * 3.5,
+      y2: 3 + r * 3.5,
+      stroke: "currentColor",
+      strokeWidth: "1.4",
+      strokeLinecap: "round"
+    },
+    r
+  )) });
+}
+const je = ["left", "center", "right", "justify"];
+function P({
+  label: e,
+  ariaLabel: n,
+  children: t,
+  triggerClassName: r,
+  menuClassName: o
+}) {
+  const [s, l] = C(!1), c = V(null);
+  return L(() => {
+    if (!s) return;
+    const a = (d) => {
+      c.current && !c.current.contains(d.target) && l(!1);
+    };
+    return document.addEventListener("mousedown", a), () => document.removeEventListener("mousedown", a);
+  }, [s]), /* @__PURE__ */ b("div", { className: "bew-tb-dropdown", ref: c, children: [
+    /* @__PURE__ */ b(
+      "button",
+      {
+        type: "button",
+        className: r ?? "bew-tb-dropdown-trigger",
+        "aria-label": n,
+        "aria-expanded": s,
+        onClick: () => l((a) => !a),
+        children: [
+          r ? e : /* @__PURE__ */ i("span", { className: "bew-tb-dropdown-label", children: e }),
+          !r && /* @__PURE__ */ i(He, {})
+        ]
+      }
+    ),
+    s && /* @__PURE__ */ i(
+      "div",
+      {
+        className: `bew-tb-menu${o ? ` ${o}` : ""}`,
+        onClick: () => l(!1),
+        children: t
+      }
+    )
+  ] });
+}
+function Ke() {
+  return /* @__PURE__ */ b("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ i(
+      "path",
+      {
+        d: "M3.5 12L6.5 4h1L10.5 12M4.6 9.2h4.3",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "1.3",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ i("rect", { x: "2.5", y: "13", width: "9", height: "2", rx: "0.5", className: "bew-tb-colorbar" })
+  ] });
+}
+function Pe() {
+  return /* @__PURE__ */ b("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ i(
+      "path",
+      {
+        d: "M6 2.5l5 5-4.2 4.2a1.5 1.5 0 0 1-2.1 0L2.5 9.5a1.5 1.5 0 0 1 0-2.1z",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "1.2",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ i("path", { d: "M4 8.5h7", fill: "none", stroke: "currentColor", strokeWidth: "1.2" }),
+    /* @__PURE__ */ i("rect", { x: "2.5", y: "13", width: "11", height: "2", rx: "0.5", className: "bew-tb-colorbar" })
+  ] });
+}
+function Je() {
+  return /* @__PURE__ */ b("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ i(
+      "rect",
+      {
+        x: "2.5",
+        y: "2.5",
+        width: "8",
+        height: "8",
+        rx: "1",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "1.3",
+        strokeDasharray: "2 1.4"
+      }
+    ),
+    /* @__PURE__ */ i("rect", { x: "2.5", y: "13", width: "11", height: "2", rx: "0.5", className: "bew-tb-colorbar" })
+  ] });
+}
+function Ue() {
+  return /* @__PURE__ */ b("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ i(
+      "rect",
+      {
+        x: "1.5",
+        y: "2.5",
+        width: "13",
+        height: "11",
+        rx: "1.5",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "1.2"
+      }
+    ),
+    /* @__PURE__ */ i("circle", { cx: "5.5", cy: "6", r: "1.3", fill: "currentColor" }),
+    /* @__PURE__ */ i(
+      "path",
+      {
+        d: "M2.5 12l3.5-4 2.5 2.5L11 8l3 3.5",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "1.2",
+        strokeLinejoin: "round"
+      }
+    )
+  ] });
+}
+function Ge() {
+  return /* @__PURE__ */ b("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ i("line", { x1: "2", y1: "8", x2: "14", y2: "8", stroke: "currentColor", strokeWidth: "1.4", strokeLinecap: "round" }),
+    /* @__PURE__ */ i("line", { x1: "3.5", y1: "4.5", x2: "12.5", y2: "4.5", stroke: "currentColor", strokeWidth: "1.1", strokeLinecap: "round", opacity: "0.35" }),
+    /* @__PURE__ */ i("line", { x1: "3.5", y1: "11.5", x2: "12.5", y2: "11.5", stroke: "currentColor", strokeWidth: "1.1", strokeLinecap: "round", opacity: "0.35" })
+  ] });
+}
+function Ve() {
+  return /* @__PURE__ */ b("svg", { width: "16", height: "16", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ i(
+      "rect",
+      {
+        x: "1.5",
+        y: "4.5",
+        width: "13",
+        height: "7",
+        rx: "2",
+        fill: "currentColor",
+        opacity: "0.15"
+      }
+    ),
+    /* @__PURE__ */ i(
+      "rect",
+      {
+        x: "1.5",
+        y: "4.5",
+        width: "13",
+        height: "7",
+        rx: "2",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "1.2"
+      }
+    ),
+    /* @__PURE__ */ i("path", { d: "M5.5 8h5M8 5.5v5", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round" })
+  ] });
+}
+function Xe() {
+  const [e] = E(), [n, t] = C({
+    bold: !1,
+    italic: !1,
+    underline: !1,
+    strikethrough: !1
+  }), [r, o] = C("left"), [s, l] = C(!1), [c, a] = C(!1), d = _(() => {
+    const u = D();
+    if (!W(u)) return;
+    t({
+      bold: u.hasFormat("bold"),
+      italic: u.hasFormat("italic"),
+      underline: u.hasFormat("underline"),
+      strikethrough: u.hasFormat("strikethrough")
+    });
+    const y = u.anchor.getNode(), st = y.getKey() === "root" ? y : y.getTopLevelElementOrThrow();
+    o(
+      Jt(st) ? nt(st.getFormatType()) ?? "left" : "left"
+    );
+  }, []);
+  L(() => te(
+    e.registerUpdateListener(({ editorState: u }) => {
+      u.read(d);
+    }),
+    e.registerCommand(
+      Ut,
+      () => (d(), !1),
+      H
+    ),
+    e.registerCommand(
+      Gt,
+      (u) => (l(u), !1),
+      H
+    ),
+    e.registerCommand(
+      Vt,
+      (u) => (a(u), !1),
+      H
+    )
+  ), [e, d]);
+  const g = _(
+    (u) => {
+      Be(e, u);
+    },
+    [e]
+  ), f = _(
+    (u) => {
+      e.dispatchCommand(Xt, u);
+    },
+    [e]
+  ), h = _(
+    (u) => {
+      e.dispatchCommand(Yt, u);
+    },
+    [e]
+  ), m = _(
+    (u, y) => {
+      Ae(e, u, y);
+    },
+    [e]
+  ), Et = _(() => {
+    ke(e, { ...$e(), label: "Button" });
+  }, [e]), Tt = _(() => {
+    const u = window.prompt("Image URL"), y = u == null ? void 0 : u.trim();
+    y && Ne(e, { src: y });
+  }, [e]), Ot = _(() => {
+    Se(e);
+  }, [e]);
+  return /* @__PURE__ */ b("div", { className: "bew-toolbar", role: "toolbar", "aria-label": "Formatting", children: [
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn",
+        "aria-label": "Undo",
+        disabled: !s,
+        onClick: () => e.dispatchCommand(Zt, void 0),
+        children: "↶"
+      }
+    ),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn",
+        "aria-label": "Redo",
+        disabled: !c,
+        onClick: () => e.dispatchCommand(qt, void 0),
+        children: "↷"
+      }
+    ),
+    /* @__PURE__ */ i("span", { className: "bew-tb-divider" }),
+    /* @__PURE__ */ b(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn bew-tb-font",
+        "aria-label": "Decrease font size",
+        title: "Decrease font size",
+        onClick: () => g("decrease"),
+        children: [
+          /* @__PURE__ */ i("span", { className: "bew-tb-font-a bew-tb-font-a--sm", children: "A" }),
+          /* @__PURE__ */ i("span", { className: "bew-tb-font-sign", children: "−" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ b(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn bew-tb-font",
+        "aria-label": "Increase font size",
+        title: "Increase font size",
+        onClick: () => g("increase"),
+        children: [
+          /* @__PURE__ */ i("span", { className: "bew-tb-font-a bew-tb-font-a--lg", children: "A" }),
+          /* @__PURE__ */ i("span", { className: "bew-tb-font-sign", children: "+" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ i("span", { className: "bew-tb-divider" }),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: S("bew-tb-btn", "bew-tb-btn--bold", n.bold && "is-active"),
+        "aria-label": "Bold",
+        "aria-pressed": n.bold,
+        onClick: () => f("bold"),
+        children: "B"
+      }
+    ),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: S("bew-tb-btn", "bew-tb-btn--italic", n.italic && "is-active"),
+        "aria-label": "Italic",
+        "aria-pressed": n.italic,
+        onClick: () => f("italic"),
+        children: "I"
+      }
+    ),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: S(
+          "bew-tb-btn",
+          "bew-tb-btn--underline",
+          n.underline && "is-active"
+        ),
+        "aria-label": "Underline",
+        "aria-pressed": n.underline,
+        onClick: () => f("underline"),
+        children: "U"
+      }
+    ),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: S(
+          "bew-tb-btn",
+          "bew-tb-btn--strike",
+          n.strikethrough && "is-active"
+        ),
+        "aria-label": "Strikethrough",
+        "aria-pressed": n.strikethrough,
+        onClick: () => f("strikethrough"),
+        children: "S"
+      }
+    ),
+    /* @__PURE__ */ i("span", { className: "bew-tb-divider" }),
+    je.map((u) => /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: S("bew-tb-btn", r === u && "is-active"),
+        "aria-label": `Align ${u}`,
+        "aria-pressed": r === u,
+        onClick: () => h(u),
+        children: /* @__PURE__ */ i(Re, { align: u })
+      },
+      u
+    )),
+    /* @__PURE__ */ i("span", { className: "bew-tb-divider" }),
+    /* @__PURE__ */ i(
+      P,
+      {
+        ariaLabel: "Text color",
+        triggerClassName: "bew-tb-btn",
+        menuClassName: "bew-tb-menu--color",
+        label: /* @__PURE__ */ i(Ke, {}),
+        children: /* @__PURE__ */ i(K, { onSelect: (u) => m("text", u) })
+      }
+    ),
+    /* @__PURE__ */ i(
+      P,
+      {
+        ariaLabel: "Background color",
+        triggerClassName: "bew-tb-btn",
+        menuClassName: "bew-tb-menu--color",
+        label: /* @__PURE__ */ i(Pe, {}),
+        children: /* @__PURE__ */ i(K, { onSelect: (u) => m("bg", u) })
+      }
+    ),
+    /* @__PURE__ */ i(
+      P,
+      {
+        ariaLabel: "Border color (buttons)",
+        triggerClassName: "bew-tb-btn",
+        menuClassName: "bew-tb-menu--color",
+        label: /* @__PURE__ */ i(Je, {}),
+        children: /* @__PURE__ */ i(K, { onSelect: (u) => m("border", u) })
+      }
+    ),
+    /* @__PURE__ */ i("span", { className: "bew-tb-divider" }),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn",
+        "aria-label": "Insert button",
+        title: "Insert button",
+        onClick: Et,
+        children: /* @__PURE__ */ i(Ve, {})
+      }
+    ),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn",
+        "aria-label": "Insert image",
+        title: "Insert image from URL",
+        onClick: Tt,
+        children: /* @__PURE__ */ i(Ue, {})
+      }
+    ),
+    /* @__PURE__ */ i(
+      "button",
+      {
+        type: "button",
+        className: "bew-tb-btn",
+        "aria-label": "Insert separator",
+        title: "Insert separator",
+        onClick: Ot,
+        children: /* @__PURE__ */ i(Ge, {})
+      }
+    )
+  ] });
+}
+const Ye = /* @__PURE__ */ new Set([
+  "DIV",
+  "P",
+  "H1",
+  "H2",
+  "H3",
+  "H4",
+  "H5",
+  "H6",
+  "TABLE",
+  "THEAD",
+  "TBODY",
+  "TR",
+  "TD",
+  "TH",
+  "UL",
+  "OL",
+  "LI"
+]), St = /* @__PURE__ */ new Set(["BR", "HR", "IMG"]);
+function $(e) {
+  return Array.from(e.attributes).map((n) => ` ${n.name}="${n.value}"`).join("");
+}
+function Ze(e) {
+  const n = e.trim().toLowerCase(), t = n.match(/^rgba?\(([^)]+)\)$/);
+  if (!t) return n;
+  const [r, o, s] = t[1].split(",").map((c) => c.trim()), l = (c) => Math.max(0, Math.min(255, parseInt(c, 10))).toString(16).padStart(2, "0");
+  return `#${l(r)}${l(o)}${l(s)}`;
+}
+function qe(e) {
+  e.querySelectorAll("[style]").forEach((n) => {
+    const t = n.tagName === "A" && n.classList.contains("btn"), r = (n.getAttribute("style") ?? "").split(";").map((s) => s.trim()).filter(Boolean), o = [];
+    for (const s of r) {
+      const [l, ...c] = s.split(":"), a = l.trim().toLowerCase(), d = c.join(":").trim(), g = a === "color" ? "text" : a === "background-color" ? "bg" : a === "border-color" ? "border" : null;
+      if (g) {
+        const f = Ze(d), h = ie(f), m = h ? I(h, g) : null;
+        m ? n.classList.add(m) : o.push(`${a}: ${f}`);
+        continue;
+      }
+      if (a === "font-size" && !t) {
+        const f = _t(xt(parseInt(d, 10)));
+        if (f) {
+          n.classList.add(f);
+          continue;
+        }
+      }
+      o.push(s);
+    }
+    o.length ? n.setAttribute("style", o.join("; ")) : n.removeAttribute("style");
+  });
+}
+function Qe(e) {
+  e.querySelectorAll("span").forEach((n) => {
+    const t = n.getAttribute("style") ?? "";
+    if (t.includes("white-space")) {
+      const r = t.split(";").map((o) => o.trim()).filter((o) => o && !o.toLowerCase().startsWith("white-space")).join("; ");
+      r ? n.setAttribute("style", r) : n.removeAttribute("style");
+    }
+    n.attributes.length === 0 && n.replaceWith(...Array.from(n.childNodes));
+  });
+}
+function vt(e) {
+  if (e.nodeType === Node.TEXT_NODE) return e.textContent ?? "";
+  if (e.nodeType !== Node.ELEMENT_NODE) return "";
+  const n = e, t = n.tagName.toLowerCase();
+  if (St.has(n.tagName)) return `<${t}${$(n)}>`;
+  const r = Array.from(n.childNodes).map(vt).join("");
+  return `<${t}${$(n)}>${r}</${t}>`;
+}
+function $t(e, n) {
+  const t = "  ".repeat(n);
+  if (e.nodeType === Node.TEXT_NODE) {
+    const a = e.textContent ?? "";
+    return a.trim() ? `${t}${a.trim()}` : "";
+  }
+  if (e.nodeType !== Node.ELEMENT_NODE) return "";
+  const r = e, o = r.tagName.toLowerCase();
+  if (St.has(r.tagName)) return `${t}<${o}${$(r)}>`;
+  const s = Array.from(r.childNodes);
+  if (!s.some(
+    (a) => a.nodeType === Node.ELEMENT_NODE && Ye.has(a.tagName)
+  )) {
+    const a = s.map(vt).join("");
+    return `${t}<${o}${$(r)}>${a}</${o}>`;
+  }
+  const c = s.map((a) => $t(a, n + 1)).filter(Boolean).join(`
+`);
+  return `${t}<${o}${$(r)}>
+${c}
+${t}</${o}>`;
+}
+function tr(e, n = !0) {
+  const t = document.createElement("div");
+  return t.innerHTML = e, qe(t), Qe(t), n ? Array.from(t.childNodes).map((r) => $t(r, 0)).filter(Boolean).join(`
+`) : t.innerHTML;
+}
+function er(e, n) {
+  return `<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+  </head>
+  <body>
+    <div class="container">
+${n ? e.split(`
+`).map((r) => `      ${r}`).join(`
+`) : e}
+    </div>
+  </body>
+</html>`;
+}
+function Lt(e, n = {}) {
+  const { document: t = !1, pretty: r = !0 } = n;
+  let o = "";
+  e.getEditorState().read(() => {
+    o = re(e, null);
+  });
+  const s = tr(o, r);
+  return t ? er(s, r) : s;
+}
+function rr({
+  editorRef: e
+}) {
+  const [n] = E();
+  return L(() => (e.current = n, () => {
+    e.current = null;
+  }), [n, e]), null;
+}
+function nr({
+  onChange: e
+}) {
+  const [n] = E();
+  return L(() => n.registerUpdateListener(({ editorState: t }) => {
+    e({
+      html: Lt(n),
+      json: JSON.stringify(t.toJSON())
+    });
+  }), [n, e]), null;
+}
+const _r = Bt(function({
+  placeholder: n = "Start writing your email…",
+  toolbar: t = !0,
+  initialContent: r,
+  onChange: o,
+  onError: s,
+  children: l
+}, c) {
+  const a = V(null);
+  Dt(
+    c,
+    () => ({
+      getHtml: (f) => a.current ? Lt(a.current, f) : "",
+      getJson: () => a.current ? JSON.stringify(a.current.getEditorState().toJSON()) : "",
+      focus: () => {
+        var f;
+        return (f = a.current) == null ? void 0 : f.focus();
+      },
+      clear: () => {
+        var f;
+        return (f = a.current) == null ? void 0 : f.update(() => {
+          Qt().clear();
+        });
+      },
+      getEditor: () => a.current
+    }),
+    []
+  );
+  const d = _(
+    (f) => {
+      if (s) s(f);
+      else throw f;
+    },
+    [s]
+  );
+  return /* @__PURE__ */ b(Wt, { initialConfig: {
+    namespace: "bootstrap-email-wysiwyg",
+    theme: ne,
+    editorState: r,
+    nodes: [
+      T,
+      O,
+      A,
+      N,
+      // Swap the core paragraph for our Bootstrap Email `<div>` variant.
+      {
+        replace: ct,
+        with: () => new N(),
+        withKlass: N
+      }
+    ],
+    onError: d
+  }, children: [
+    /* @__PURE__ */ b("div", { className: "bew-editor-shell", children: [
+      t && /* @__PURE__ */ i(Xe, {}),
+      /* @__PURE__ */ i("div", { className: "bew-editor-body", children: /* @__PURE__ */ i(
+        zt,
+        {
+          contentEditable: /* @__PURE__ */ i(Ht, { className: "bew-content-editable" }),
+          placeholder: /* @__PURE__ */ i("div", { className: "bew-placeholder", children: n }),
+          ErrorBoundary: Rt
+        }
+      ) }),
+      /* @__PURE__ */ i(Ft, {})
+    ] }),
+    /* @__PURE__ */ i(rr, { editorRef: a }),
+    o && /* @__PURE__ */ i(nr, { onChange: o }),
+    l
+  ] });
+});
+export {
+  Me as $adjustFontSize,
+  Oe as $applyColor,
+  et as $createButtonNode,
+  ae as $createButtonWithLabel,
+  it as $createHrNode,
+  ot as $createImageNode,
+  rt as $isButtonNode,
+  we as $isHrNode,
+  ge as $isImageNode,
+  Y as BASE_COLORS,
+  _r as BootstrapEmailEditor,
+  N as BootstrapParagraphNode,
+  T as ButtonNode,
+  Z as COLOR_FAMILIES,
+  K as ColorPicker,
+  w as DEFAULT_HR_MARGIN,
+  v as FONT_SIZE_KEYS,
+  A as HrNode,
+  O as ImageNode,
+  U as MARGIN_STEPS,
+  J as SIZE_STEPS,
+  Xe as Toolbar,
+  De as addCustomColor,
+  Be as adjustFontSize,
+  Ae as applyColor,
+  ue as axAlignClass,
+  ne as bootstrapEmailTheme,
+  tr as cleanBootstrapHtml,
+  mt as colorAttributes,
+  _t as fontSizeClass,
+  M as fontSizePx,
+  gr as getCustomColors,
+  $e as getLastButtonStyle,
+  ie as hexToToken,
+  _e as hrClasses,
+  he as imageClasses,
+  fe as imagePreviewStyle,
+  ke as insertButton,
+  Se as insertHr,
+  Ne as insertImage,
+  lt as marginKeyToPx,
+  nt as normalizeAlign,
+  xt as pxToFontSizeKey,
+  Ct as rememberButtonStyle,
+  We as removeCustomColor,
+  R as sizeKeyToPx,
+  F as stepFontSize,
+  ce as textAlignClass,
+  Lt as toBootstrapEmailHtml,
+  I as tokenToClass,
+  x as tokenToHex,
+  ze as useCustomColors
+};