inconel 0.1.41 → 0.1.43

package/dist/components/RichTextEditor/RichTextEditor.js

@@ -1,73 +1,78 @@
-import { jsxs as c, jsx as n } from "react/jsx-runtime";
-import { useId as re, useRef as w, useState as y, useEffect as oe, useCallback as se } from "react";
-import ce from "../FieldFeedback/FieldFeedback.js";
+import { jsxs as s, jsx as l } from "react/jsx-runtime";
+import { useId as Ne, useRef as O, useState as h, useEffect as we, useCallback as Le, Fragment as ne } from "react";
+import Te from "../FieldFeedback/FieldFeedback.js";
 /* empty css                  */
 /* empty css           */
-import { icons as l } from "./icons.js";
-import { sanitizeHtml as b } from "./sanitize.js";
-const ue = [
+import { icons as a } from "./icons.js";
+import { sanitizeHtml as C } from "./sanitize.js";
+const xe = [
   { tag: "p", label: "Paragraf" },
   { tag: "h1", label: "Başlık 1" },
   { tag: "h2", label: "Başlık 2" },
   { tag: "h3", label: "Başlık 3" },
   { tag: "blockquote", label: "Alıntı" }
-], de = [12, 14, 16, 18, 24, 32], me = (r) => new Promise((m, _) => {
-  const a = new FileReader();
-  a.onload = () => m(String(a.result)), a.onerror = () => _(a.error), a.readAsDataURL(r);
+], Ee = [12, 14, 16, 18, 24, 32], Be = /* @__PURE__ */ new Set(["justifyLeft", "justifyCenter", "justifyRight", "justifyFull"]), Re = (m) => new Promise((b, S) => {
+  const i = new FileReader();
+  i.onload = () => b(String(i.result)), i.onerror = () => S(i.error), i.readAsDataURL(m);
 });
-function N({ label: r, onClick: m, disabled: _, active: a, children: L }) {
-  return /* @__PURE__ */ n(
+function R({ label: m, onClick: b, disabled: S, active: i, children: E }) {
+  return /* @__PURE__ */ l(
     "button",
     {
       type: "button",
-      className: `inconel-rte__btn${a ? " inconel-is-active" : ""}`,
-      "aria-label": r,
-      title: r,
-      "aria-pressed": a,
-      disabled: _,
-      onMouseDown: (x) => x.preventDefault(),
-      onClick: m,
-      children: L
+      className: `inconel-rte__btn${i ? " inconel-is-active" : ""}`,
+      "aria-label": m,
+      title: m,
+      "aria-pressed": i,
+      disabled: S,
+      onMouseDown: (j) => j.preventDefault(),
+      onClick: b,
+      children: E
     }
   );
 }
-function ke({
-  value: r = "",
-  onChange: m,
-  onBlur: _,
-  label: a,
-  placeholder: L,
-  id: x,
+function Ie({
+  value: m = "",
+  onChange: b,
+  onBlur: S,
+  label: i,
+  placeholder: E,
+  id: j,
   disabled: p = !1,
-  required: D,
-  fullWidth: $ = !0,
-  className: K,
-  minHeight: j = 200,
-  onImageUpload: E,
-  onRequestMedia: z,
-  hint: H,
-  errorMessage: k
+  required: U,
+  fullWidth: le = !0,
+  className: ae,
+  minHeight: A = 200,
+  onImageUpload: G,
+  onRequestMedia: P,
+  excludeTools: re = [],
+  hint: $,
+  errorMessage: v
 }) {
-  const Y = re(), C = x ?? `inconel-rte-${Y.replace(/:/g, "")}`, M = `${C}-hint`, I = `${C}-error`, o = w(null), F = w(null), v = w(null), [f, J] = y(!1), [U, G] = y(""), [u, B] = y(null), [O, P] = y(""), [Z, Q] = y({}), [V, R] = y(!r);
-  oe(() => {
-    const e = o.current;
-    if (!e || r === v.current) return;
-    const t = b(r);
-    e.innerHTML !== t && (e.innerHTML = t), v.current = r, R(!e.textContent && !e.querySelector("img"));
-  }, [r, f]);
-  const h = se(() => {
-    const e = o.current;
+  const oe = Ne(), N = j ?? `inconel-rte-${oe.replace(/:/g, "")}`, q = `${N}-hint`, W = `${N}-error`, d = O(null), F = O(null), w = O(null), [f, ie] = h(!1), [K, J] = h(""), [u, L] = h(null), [Y, Z] = h(""), [se, ce] = h({}), [de, M] = h(!m), [ue, Q] = h(!1), [k, V] = h({ rows: 3, cols: 3 });
+  we(() => {
+    const e = d.current;
+    if (!e || m === w.current) return;
+    const t = C(m);
+    e.innerHTML !== t && (e.innerHTML = t), w.current = m, M(!e.textContent && !e.querySelector("img"));
+  }, [m, f]);
+  const g = Le(() => {
+    const e = d.current;
     if (!e) return;
-    const t = !!e.textContent || !!e.querySelector("img"), s = t ? b(e.innerHTML) : "";
-    R(!t), v.current = s, m?.(s);
-  }, [m]), d = () => {
-    const e = window.getSelection(), t = o.current;
+    const t = !!e.textContent || !!e.querySelector("img"), n = t ? C(e.innerHTML) : "";
+    M(!t), w.current = n, b?.(n);
+  }, [b]), y = () => {
+    const e = window.getSelection(), t = d.current;
     e && e.rangeCount > 0 && t?.contains(e.getRangeAt(0).commonAncestorContainer) && (F.current = e.getRangeAt(0).cloneRange());
-  }, T = () => {
-    o.current?.focus();
+  }, B = () => {
+    d.current?.focus();
     const e = window.getSelection();
     e && F.current && (e.removeAllRanges(), e.addRange(F.current));
-  }, A = () => {
+  }, X = () => {
+    const e = window.getSelection()?.anchorNode, n = (e instanceof Element ? e : e?.parentElement)?.closest("td, th") ?? null;
+    return n && d.current?.contains(n) ? n : null;
+  }, D = () => {
+    Q(!!X());
     const e = (t) => {
       try {
         return document.queryCommandState(t);
@@ -75,7 +80,7 @@ function ke({
         return !1;
       }
     };
-    Q({
+    ce({
       bold: e("bold"),
       italic: e("italic"),
       underline: e("underline"),
@@ -87,238 +92,318 @@ function ke({
       insertUnorderedList: e("insertUnorderedList"),
       insertOrderedList: e("insertOrderedList")
     });
-  }, S = (e, t) => {
-    T(), document.execCommand("styleWithCSS", !1, "true"), document.execCommand(e, !1, t), d(), A(), h();
-  }, X = (e) => {
-    T(), document.execCommand("styleWithCSS", !1, "false"), document.execCommand("fontSize", !1, "7"), o.current?.querySelectorAll('font[size="7"]').forEach((t) => {
-      const s = document.createElement("span");
-      s.style.fontSize = `${e}px`, s.append(...Array.from(t.childNodes)), t.replaceWith(s);
-    }), d(), h();
+  }, T = (e, t) => {
+    B(), document.execCommand("styleWithCSS", !1, Be.has(e) ? "true" : "false"), document.execCommand(e, !1, t), y(), D(), g();
+  }, me = (e) => {
+    B(), document.execCommand("styleWithCSS", !1, "false"), document.execCommand("fontSize", !1, "7"), d.current?.querySelectorAll('font[size="7"]').forEach((t) => {
+      const n = document.createElement("span");
+      n.style.fontSize = `${e}px`, n.append(...Array.from(t.childNodes)), t.replaceWith(n);
+    }), y(), g();
+  }, fe = (e) => {
+    B();
+    const t = X(), n = t?.parentElement, o = t?.closest("table");
+    if (!t || !n || !o) return;
+    const I = t.cellIndex, te = (c) => {
+      const _ = document.createElement(c.tagName);
+      return _.innerHTML = "<br>", _;
+    };
+    if (e === "addRow") {
+      const c = document.createElement("tr");
+      Array.from(n.cells).forEach((_) => c.append(te(_.tagName === "TH" ? document.createElement("td") : _))), n.parentElement?.tagName === "THEAD" ? (o.tBodies[0] ?? o.appendChild(document.createElement("tbody"))).prepend(c) : n.after(c);
+    } else e === "delRow" ? (n.remove(), o.rows.length || o.remove()) : e === "addCol" ? Array.from(o.rows).forEach((c) => c.cells[I]?.after(te(c.cells[I]))) : e === "delCol" ? (Array.from(o.rows).forEach((c) => c.cells[I]?.remove()), Array.from(o.rows).some((c) => c.cells.length) || o.remove()) : o.remove();
+    Q(!1), g();
+  }, ye = () => {
+    const e = Math.min(Math.max(k.rows, 1), 20), t = Math.min(Math.max(k.cols, 1), 10), o = `<tr>${"<td><br></td>".repeat(t)}</tr>`.repeat(e);
+    ee(
+      `<table border="1" width="100%" cellspacing="0" cellpadding="6"><tbody>${o}</tbody></table><p><br></p>`
+    ), L(null);
   }, ee = (e) => {
-    T(), document.execCommand("insertHTML", !1, b(e)), d(), h();
-  }, q = (e) => {
-    d(), P(""), B(u === e ? null : e);
-  }, W = () => {
-    const e = O.trim();
-    e && (u === "link" ? (S("createLink", e), o.current?.querySelectorAll("a").forEach((t) => {
+    B(), document.execCommand("insertHTML", !1, C(e)), y(), g();
+  }, he = (e) => {
+    y(), Z(""), L(u === e ? null : e);
+  }, z = () => {
+    if (u === "table") {
+      ye();
+      return;
+    }
+    const e = Y.trim();
+    e && (u === "link" ? (T("createLink", e), d.current?.querySelectorAll("a").forEach((t) => {
       /^https?:/i.test(t.getAttribute("href") ?? "") && (t.setAttribute("target", "_blank"), t.setAttribute("rel", "noopener noreferrer"));
-    }), h()) : u === "image" && S("insertImage", e), B(null));
-  }, te = async (e) => {
+    }), g()) : u === "image" && T("insertImage", e), L(null));
+  }, be = async (e) => {
     const t = e.target.files?.[0];
     if (e.target.value = "", !t || !t.type.startsWith("image/")) return;
-    const s = E ? await E(t) : await me(t);
-    S("insertImage", s), B(null);
-  }, ne = (e) => {
+    const n = G ? await G(t) : await Re(t);
+    T("insertImage", n), L(null);
+  }, pe = (e) => {
     const t = e.clipboardData.getData("text/html");
-    t && (e.preventDefault(), document.execCommand("insertHTML", !1, b(t)), h());
-  }, le = () => {
+    t && (e.preventDefault(), document.execCommand("insertHTML", !1, C(t)), g());
+  }, ge = () => {
     if (f) {
-      const e = b(U);
-      v.current = null, o.current && (o.current.innerHTML = e), v.current = e, R(!e), m?.(e);
+      const e = C(K);
+      w.current = null, d.current && (d.current.innerHTML = e), w.current = e, M(!e), b?.(e);
     } else
-      G(b(o.current?.innerHTML ?? ""));
-    B(null), J(!f);
-  }, ie = [H && !k ? M : void 0, k ? I : void 0].filter(Boolean).join(" ") || void 0, g = p || f, i = (e, t, s, ae) => /* @__PURE__ */ n(
-    N,
+      J(C(d.current?.innerHTML ?? ""));
+    L(null), ie(!f);
+  }, ke = [$ && !v ? q : void 0, v ? W : void 0].filter(Boolean).join(" ") || void 0, x = p || f, r = (e, t, n, o) => /* @__PURE__ */ l(
+    R,
     {
       label: t,
-      active: Z[e],
-      disabled: g,
-      onClick: () => S(e, ae),
-      children: s
+      active: se[e],
+      disabled: x,
+      onClick: () => T(e, o),
+      children: n
     }
-  );
-  return /* @__PURE__ */ c(
+  ), _e = /* @__PURE__ */ s(
+    "select",
+    {
+      className: "inconel-rte__select",
+      "aria-label": "Biçim",
+      disabled: x,
+      value: "",
+      onChange: (e) => {
+        e.target.value && T("formatBlock", e.target.value);
+      },
+      children: [
+        /* @__PURE__ */ l("option", { value: "", children: "Biçim" }),
+        xe.map((e) => /* @__PURE__ */ l("option", { value: e.tag, children: e.label }, e.tag))
+      ]
+    }
+  ), Ce = /* @__PURE__ */ s(
+    "select",
+    {
+      className: "inconel-rte__select",
+      "aria-label": "Yazı boyutu",
+      disabled: x,
+      value: "",
+      onChange: (e) => {
+        e.target.value && me(Number(e.target.value));
+      },
+      children: [
+        /* @__PURE__ */ l("option", { value: "", children: "Boyut" }),
+        Ee.map((e) => /* @__PURE__ */ s("option", { value: e, children: [
+          e,
+          "px"
+        ] }, e))
+      ]
+    }
+  ), H = (e, t, n) => /* @__PURE__ */ l(
+    R,
+    {
+      label: e,
+      disabled: x,
+      active: u === t,
+      onClick: () => he(t),
+      children: n
+    }
+  ), Se = new Set(re), ve = [
+    [
+      { key: "bold", node: r("bold", "Kalın", a.bold) },
+      { key: "italic", node: r("italic", "İtalik", a.italic) },
+      { key: "underline", node: r("underline", "Altı çizili", a.underline) },
+      { key: "strikethrough", node: r("strikeThrough", "Üstü çizili", a.strike) }
+    ],
+    [
+      { key: "blockFormat", node: _e },
+      { key: "fontSize", node: Ce }
+    ],
+    [
+      { key: "alignLeft", node: r("justifyLeft", "Sola hizala", a.alignLeft) },
+      { key: "alignCenter", node: r("justifyCenter", "Ortala", a.alignCenter) },
+      { key: "alignRight", node: r("justifyRight", "Sağa hizala", a.alignRight) },
+      { key: "alignJustify", node: r("justifyFull", "İki yana yasla", a.alignJustify) }
+    ],
+    [
+      { key: "unorderedList", node: r("insertUnorderedList", "Madde işaretli liste", a.listUl) },
+      { key: "orderedList", node: r("insertOrderedList", "Numaralı liste", a.listOl) },
+      { key: "outdent", node: r("outdent", "Girintiyi azalt", a.outdent) },
+      { key: "indent", node: r("indent", "Girintiyi artır", a.indent) },
+      { key: "clearFormat", node: r("removeFormat", "Biçimi temizle", a.clearFormat) }
+    ],
+    [
+      { key: "link", node: H("Bağlantı ekle", "link", a.link) },
+      { key: "table", node: H("Tablo ekle", "table", a.table) },
+      { key: "image", node: H("Görsel ekle", "image", a.image) },
+      ...P ? [
+        {
+          key: "media",
+          node: /* @__PURE__ */ l(
+            R,
+            {
+              label: "Medya galerisi",
+              disabled: x,
+              onClick: () => {
+                y(), P(ee);
+              },
+              children: a.gallery
+            }
+          )
+        }
+      ] : []
+    ],
+    [
+      { key: "undo", node: r("undo", "Geri al", a.undo) },
+      { key: "redo", node: r("redo", "Yinele", a.redo) },
+      {
+        key: "source",
+        node: /* @__PURE__ */ l(
+          R,
+          {
+            label: "HTML kaynağı",
+            disabled: p,
+            active: f,
+            onClick: ge,
+            children: a.code
+          }
+        )
+      }
+    ]
+  ].map((e) => e.filter((t) => !Se.has(t.key))).filter((e) => e.length > 0);
+  return /* @__PURE__ */ s(
     "div",
     {
       className: [
         "inconel-field",
-        $ ? "inconel-field--full-width" : "",
-        K ?? ""
+        le ? "inconel-field--full-width" : "",
+        ae ?? ""
       ].join(" "),
       children: [
-        a && /* @__PURE__ */ c("label", { className: "inconel-field__label", htmlFor: C, children: [
-          a,
-          D && /* @__PURE__ */ n("span", { "aria-hidden": "true", children: " *" })
+        i && /* @__PURE__ */ s("label", { className: "inconel-field__label", htmlFor: N, children: [
+          i,
+          U && /* @__PURE__ */ l("span", { "aria-hidden": "true", children: " *" })
         ] }),
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ s(
           "div",
           {
             className: [
               "inconel-rte",
-              k ? "inconel-is-invalid" : "",
+              v ? "inconel-is-invalid" : "",
               p ? "inconel-is-disabled" : ""
             ].join(" "),
             children: [
-              /* @__PURE__ */ c("div", { className: "inconel-rte__toolbar", role: "toolbar", "aria-label": "Biçimlendirme", children: [
-                i("bold", "Kalın", l.bold),
-                i("italic", "İtalik", l.italic),
-                i("underline", "Altı çizili", l.underline),
-                i("strikeThrough", "Üstü çizili", l.strike),
-                /* @__PURE__ */ n("span", { className: "inconel-rte__sep" }),
-                /* @__PURE__ */ c(
-                  "select",
-                  {
-                    className: "inconel-rte__select",
-                    "aria-label": "Biçim",
-                    disabled: g,
-                    value: "",
-                    onChange: (e) => {
-                      e.target.value && S("formatBlock", e.target.value);
-                    },
-                    children: [
-                      /* @__PURE__ */ n("option", { value: "", children: "Biçim" }),
-                      ue.map((e) => /* @__PURE__ */ n("option", { value: e.tag, children: e.label }, e.tag))
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ c(
-                  "select",
-                  {
-                    className: "inconel-rte__select",
-                    "aria-label": "Yazı boyutu",
-                    disabled: g,
-                    value: "",
-                    onChange: (e) => {
-                      e.target.value && X(Number(e.target.value));
-                    },
-                    children: [
-                      /* @__PURE__ */ n("option", { value: "", children: "Boyut" }),
-                      de.map((e) => /* @__PURE__ */ c("option", { value: e, children: [
-                        e,
-                        "px"
-                      ] }, e))
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ n("span", { className: "inconel-rte__sep" }),
-                i("justifyLeft", "Sola hizala", l.alignLeft),
-                i("justifyCenter", "Ortala", l.alignCenter),
-                i("justifyRight", "Sağa hizala", l.alignRight),
-                i("justifyFull", "İki yana yasla", l.alignJustify),
-                /* @__PURE__ */ n("span", { className: "inconel-rte__sep" }),
-                i("insertUnorderedList", "Madde işaretli liste", l.listUl),
-                i("insertOrderedList", "Numaralı liste", l.listOl),
-                i("outdent", "Girintiyi azalt", l.outdent),
-                i("indent", "Girintiyi artır", l.indent),
-                i("removeFormat", "Biçimi temizle", l.clearFormat),
-                /* @__PURE__ */ n("span", { className: "inconel-rte__sep" }),
-                /* @__PURE__ */ n(
-                  N,
-                  {
-                    label: "Bağlantı ekle",
-                    disabled: g,
-                    active: u === "link",
-                    onClick: () => q("link"),
-                    children: l.link
-                  }
-                ),
-                /* @__PURE__ */ n(
-                  N,
-                  {
-                    label: "Görsel ekle",
-                    disabled: g,
-                    active: u === "image",
-                    onClick: () => q("image"),
-                    children: l.image
-                  }
-                ),
-                z && /* @__PURE__ */ n(
-                  N,
-                  {
-                    label: "Medya galerisi",
-                    disabled: g,
-                    onClick: () => {
-                      d(), z(ee);
-                    },
-                    children: l.gallery
-                  }
-                ),
-                /* @__PURE__ */ n("span", { className: "inconel-rte__sep" }),
-                i("undo", "Geri al", l.undo),
-                i("redo", "Yinele", l.redo),
-                /* @__PURE__ */ n(
-                  N,
-                  {
-                    label: "HTML kaynağı",
-                    disabled: p,
-                    active: f,
-                    onClick: le,
-                    children: l.code
-                  }
-                )
+              /* @__PURE__ */ l("div", { className: "inconel-rte__toolbar", role: "toolbar", "aria-label": "Biçimlendirme", children: ve.map((e, t) => /* @__PURE__ */ s(ne, { children: [
+                t > 0 && /* @__PURE__ */ l("span", { className: "inconel-rte__sep" }),
+                e.map((n) => /* @__PURE__ */ l(ne, { children: n.node }, n.key))
+              ] }, t)) }),
+              u === "table" && !f && /* @__PURE__ */ s("div", { className: "inconel-rte__panel", children: [
+                /* @__PURE__ */ s("label", { className: "inconel-rte__field", children: [
+                  "Satır",
+                  /* @__PURE__ */ l(
+                    "input",
+                    {
+                      type: "number",
+                      min: 1,
+                      max: 20,
+                      className: "inconel-rte__input inconel-rte__input--num",
+                      value: k.rows,
+                      onChange: (e) => V({ ...k, rows: Number(e.target.value) })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ s("label", { className: "inconel-rte__field", children: [
+                  "Sütun",
+                  /* @__PURE__ */ l(
+                    "input",
+                    {
+                      type: "number",
+                      min: 1,
+                      max: 10,
+                      className: "inconel-rte__input inconel-rte__input--num",
+                      value: k.cols,
+                      onChange: (e) => V({ ...k, cols: Number(e.target.value) })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ l("button", { type: "button", className: "inconel-rte__action", onClick: z, children: "Tablo ekle" })
               ] }),
-              u && !f && /* @__PURE__ */ c("div", { className: "inconel-rte__panel", children: [
-                /* @__PURE__ */ n(
+              ue && !f && !p && /* @__PURE__ */ l("div", { className: "inconel-rte__panel", role: "toolbar", "aria-label": "Tablo", children: [
+                ["addRow", "Satır ekle"],
+                ["delRow", "Satırı sil"],
+                ["addCol", "Sütun ekle"],
+                ["delCol", "Sütunu sil"],
+                ["delTable", "Tabloyu sil"]
+              ].map(([e, t]) => /* @__PURE__ */ l(
+                "button",
+                {
+                  type: "button",
+                  className: "inconel-rte__action",
+                  onMouseDown: (n) => n.preventDefault(),
+                  onClick: () => fe(e),
+                  children: t
+                },
+                e
+              )) }),
+              u && u !== "table" && !f && /* @__PURE__ */ s("div", { className: "inconel-rte__panel", children: [
+                /* @__PURE__ */ l(
                   "input",
                   {
                     type: "url",
                     className: "inconel-rte__input",
                     "aria-label": u === "link" ? "Bağlantı adresi" : "Görsel adresi",
                     placeholder: u === "link" ? "https://…" : "Görsel URL (https://…)",
-                    value: O,
+                    value: Y,
                     autoFocus: !0,
-                    onChange: (e) => P(e.target.value),
+                    onChange: (e) => Z(e.target.value),
                     onKeyDown: (e) => {
-                      e.key === "Enter" && (e.preventDefault(), W());
+                      e.key === "Enter" && (e.preventDefault(), z());
                     }
                   }
                 ),
-                /* @__PURE__ */ n("button", { type: "button", className: "inconel-rte__action", onClick: W, children: "Ekle" }),
-                u === "image" && /* @__PURE__ */ c("label", { className: "inconel-rte__action", children: [
+                /* @__PURE__ */ l("button", { type: "button", className: "inconel-rte__action", onClick: z, children: "Ekle" }),
+                u === "image" && /* @__PURE__ */ s("label", { className: "inconel-rte__action", children: [
                   "Dosya seç",
-                  /* @__PURE__ */ n(
+                  /* @__PURE__ */ l(
                     "input",
                     {
                       type: "file",
                       accept: "image/*",
                       hidden: !0,
                       "aria-label": "Görsel dosyası",
-                      onChange: te
+                      onChange: be
                     }
                   )
                 ] })
               ] }),
-              f ? /* @__PURE__ */ n(
+              f ? /* @__PURE__ */ l(
                 "textarea",
                 {
-                  id: C,
+                  id: N,
                   className: "inconel-rte__source",
-                  style: { minHeight: j },
-                  "aria-label": a ?? "HTML kaynağı",
-                  value: U,
+                  style: { minHeight: A },
+                  "aria-label": i ?? "HTML kaynağı",
+                  value: K,
                   disabled: p,
                   spellCheck: !1,
-                  onChange: (e) => G(e.target.value)
+                  onChange: (e) => J(e.target.value)
                 }
-              ) : /* @__PURE__ */ c("div", { className: "inconel-rte__surface", style: { minHeight: j }, children: [
-                V && L && /* @__PURE__ */ n("span", { className: "inconel-rte__placeholder", "aria-hidden": "true", children: L }),
-                /* @__PURE__ */ n(
+              ) : /* @__PURE__ */ s("div", { className: "inconel-rte__surface", style: { minHeight: A }, children: [
+                de && E && /* @__PURE__ */ l("span", { className: "inconel-rte__placeholder", "aria-hidden": "true", children: E }),
+                /* @__PURE__ */ l(
                   "div",
                   {
-                    ref: o,
-                    id: C,
+                    ref: d,
+                    id: N,
                     className: "inconel-rte__content",
                     role: "textbox",
                     "aria-multiline": "true",
-                    "aria-label": a,
-                    "aria-required": D,
-                    "aria-invalid": !!k,
-                    "aria-describedby": ie,
+                    "aria-label": i,
+                    "aria-required": U,
+                    "aria-invalid": !!v,
+                    "aria-describedby": ke,
                     "aria-disabled": p,
                     contentEditable: !p,
                     suppressContentEditableWarning: !0,
-                    style: { minHeight: j },
-                    onInput: h,
-                    onPaste: ne,
+                    style: { minHeight: A },
+                    onInput: g,
+                    onPaste: pe,
                     onKeyUp: () => {
-                      d(), A();
+                      y(), D();
                     },
                     onMouseUp: () => {
-                      d(), A();
+                      y(), D();
                     },
                     onBlur: () => {
-                      d(), _?.();
+                      y(), S?.();
                     }
                   }
                 )
@@ -326,12 +411,12 @@ function ke({
             ]
           }
         ),
-        /* @__PURE__ */ n(ce, { hint: H, errorMessage: k, hintId: M, errorId: I })
+        /* @__PURE__ */ l(Te, { hint: $, errorMessage: v, hintId: q, errorId: W })
       ]
     }
   );
 }
 export {
-  ke as default
+  Ie as default
 };
 //# sourceMappingURL=RichTextEditor.js.map