ckeditor5-livewire 1.2.5 → 1.2.6

package/dist/index.mjs

@@ -1,4 +1,4 @@
-class v {
+class C {
   constructor(t) {
     this.livewireComponent = t;
   }
@@ -33,21 +33,21 @@ class v {
 }
 function U(i, t) {
   const e = /* @__PURE__ */ new Map();
-  window.Livewire?.hook("component.init", async ({ component: r, cleanup: a }) => {
+  window.Livewire?.hook("component.init", async ({ component: r, cleanup: n }) => {
     if (r.name !== i)
       return;
-    const n = new t(r);
-    e.set(r.id, n), a(async () => {
-      n.state = "destroying", await n.destroyed(), n.state = "destroyed", e.delete(r.id);
-    }), await n.mounted(), n.state = "mounted";
-  }), window.Livewire?.hook("commit", async ({ component: r, succeed: a }) => {
-    r.name === i && a(() => {
-      const n = e.get(r.id);
-      n?.state === "mounted" && n?.afterCommitSynced?.();
+    const a = new t(r);
+    e.set(r.id, a), n(async () => {
+      a.state = "destroying", await a.destroyed(), a.state = "destroyed", e.delete(r.id);
+    }), await a.mounted(), a.state = "mounted";
+  }), window.Livewire?.hook("commit", async ({ component: r, succeed: n }) => {
+    r.name === i && n(() => {
+      const a = e.get(r.id);
+      a?.state === "mounted" && a?.afterCommitSynced?.();
     });
   });
 }
-class A {
+class H {
   /**
    * Map of registered items.
    */
@@ -74,8 +74,8 @@ class A {
    * @returns A promise that resolves with the result of the function.
    */
   execute(t, e, r) {
-    const a = this.items.get(t), n = this.initializationErrors.get(t);
-    return n ? (r?.(n), Promise.reject(n)) : a ? Promise.resolve(e(a)) : new Promise((s, o) => {
+    const n = this.items.get(t), a = this.initializationErrors.get(t);
+    return a ? (r?.(a), Promise.reject(a)) : n ? Promise.resolve(e(n)) : new Promise((s, o) => {
       const c = this.getPendingCallbacks(t);
       c.success.push(async (u) => {
         s(await e(u));
@@ -93,7 +93,7 @@ class A {
       throw new Error(`Item with ID "${t}" is already registered.`);
     this.resetErrors(t), this.items.set(t, e);
     const r = this.pendingCallbacks.get(t);
-    r && (r.success.forEach((a) => a(e)), this.pendingCallbacks.delete(t)), this.registerAsDefault(t, e), this.notifyWatchers();
+    r && (r.success.forEach((n) => n(e)), this.pendingCallbacks.delete(t)), this.registerAsDefault(t, e), this.notifyWatchers();
   }
   /**
    * Registers an error for an item.
@@ -104,7 +104,7 @@ class A {
   error(t, e) {
     this.items.delete(t), this.initializationErrors.set(t, e);
     const r = this.pendingCallbacks.get(t);
-    r && (r.error.forEach((a) => a(e)), this.pendingCallbacks.delete(t)), this.initializationErrors.size === 1 && !this.items.size && this.error(null, e), this.notifyWatchers();
+    r && (r.error.forEach((n) => n(e)), this.pendingCallbacks.delete(t)), this.initializationErrors.size === 1 && !this.items.size && this.error(null, e), this.notifyWatchers();
   }
   /**
    * Resets errors for an item.
@@ -213,7 +213,7 @@ class A {
     this.items.size === 1 && t !== null && this.register(null, e);
   }
 }
-function O(i, t) {
+function D(i, t) {
   let e = null;
   return (...r) => {
     e && clearTimeout(e), e = setTimeout(() => {
@@ -222,14 +222,14 @@ function O(i, t) {
   };
 }
 function _(i, t) {
-  const e = Object.entries(i).filter(([r, a]) => t(a, r));
+  const e = Object.entries(i).filter(([r, n]) => t(n, r));
   return Object.fromEntries(e);
 }
-function H(i) {
+function W(i) {
   return Object.keys(i).length === 0 && i.constructor === Object;
 }
-function S(i, t) {
-  const e = Object.entries(i).map(([r, a]) => [r, t(a, r)]);
+function O(i, t) {
+  const e = Object.entries(i).map(([r, n]) => [r, t(n, r)]);
   return Object.fromEntries(e);
 }
 function P(i, t) {
@@ -238,8 +238,8 @@ function P(i, t) {
   const e = Object.keys(i), r = Object.keys(t);
   if (e.length !== r.length)
     return !1;
-  for (const a of e)
-    if (i[a] !== t[a] || !Object.prototype.hasOwnProperty.call(t, a))
+  for (const n of e)
+    if (i[n] !== t[n] || !Object.prototype.hasOwnProperty.call(t, n))
       return !1;
   return !0;
 }
@@ -250,17 +250,17 @@ function G(i, {
   timeOutAfter: t = 500,
   retryAfter: e = 100
 } = {}) {
-  return new Promise((r, a) => {
-    const n = Date.now();
+  return new Promise((r, n) => {
+    const a = Date.now();
     let s = null;
     const o = setTimeout(() => {
-      a(s ?? new Error("Timeout"));
+      n(s ?? new Error("Timeout"));
     }, t), c = async () => {
       try {
         const u = await i();
         clearTimeout(o), r(u);
       } catch (u) {
-        s = u, Date.now() - n > t ? a(u) : setTimeout(c, e);
+        s = u, Date.now() - a > t ? n(u) : setTimeout(c, e);
       }
     };
     c();
@@ -268,24 +268,24 @@ function G(i, {
 }
 const I = Symbol.for("context-editor-watchdog");
 async function Y({ element: i, context: t, creator: e, config: r }) {
-  const a = K();
+  const n = K();
   await t.add({
     creator: (c, u) => e.create(c, u),
-    id: a,
+    id: n,
     sourceElementOrData: i,
     type: "editor",
     config: r
   });
-  const n = t.getItem(a), s = {
+  const a = t.getItem(n), s = {
     state: "available",
-    editorContextId: a,
+    editorContextId: n,
     context: t
   };
-  n[I] = s;
+  a[I] = s;
   const o = t.destroy.bind(t);
   return t.destroy = async () => (s.state = "unavailable", o()), {
     ...s,
-    editor: n
+    editor: a
   };
 }
 function X(i) {
@@ -294,7 +294,7 @@ function X(i) {
 function J(i) {
   return i.model.document.getRootNames().reduce((e, r) => (e[r] = i.getData({ rootName: r }), e), /* @__PURE__ */ Object.create({}));
 }
-function C(i) {
+function v(i) {
   return ["inline", "classic", "balloon", "decoupled"].includes(i);
 }
 function Q(i) {
@@ -319,8 +319,8 @@ async function Z(i) {
     throw new Error(`Unsupported editor type: ${i}`);
   return r;
 }
-class $ {
-  static the = new $();
+class S {
+  static the = new S();
   /**
    * Map of registered custom plugins.
    */
@@ -379,14 +379,14 @@ class $ {
     return this.plugins.has(t);
   }
 }
-async function j(i) {
+async function A(i) {
   const t = await import("ckeditor5");
   let e = null;
-  const r = i.map(async (a) => {
-    const n = await $.the.get(a);
-    if (n)
-      return n;
-    const { [a]: s } = t;
+  const r = i.map(async (n) => {
+    const a = await S.the.get(n);
+    if (a)
+      return a;
+    const { [n]: s } = t;
     if (s)
       return s;
     if (!e)
@@ -395,27 +395,27 @@ async function j(i) {
       } catch (c) {
         console.error(`Failed to load premium package: ${c}`);
       }
-    const { [a]: o } = e || {};
+    const { [n]: o } = e || {};
     if (o)
       return o;
-    throw new Error(`Plugin "${a}" not found in base or premium packages.`);
+    throw new Error(`Plugin "${n}" not found in base or premium packages.`);
   });
   return {
     loadedPlugins: await Promise.all(r),
     hasPremium: !!e
   };
 }
-async function F(i, t) {
+async function V(i, t) {
   const e = [i.ui, i.content];
   return await Promise.all(
     [
-      L("ckeditor5", e),
+      R("ckeditor5", e),
       /* v8 ignore next */
-      t && L("ckeditor5-premium-features", e)
-    ].filter((a) => !!a)
-  ).then((a) => a.flat());
+      t && R("ckeditor5-premium-features", e)
+    ].filter((n) => !!n)
+  ).then((n) => n.flat());
 }
-async function L(i, t) {
+async function R(i, t) {
   return await Promise.all(
     t.filter((e) => e !== "en").map(async (e) => {
       const r = await tt(i, e);
@@ -723,28 +723,39 @@ async function tt(i, t) {
     return console.error(`Failed to load translation for ${i}/${t}:`, e), null;
   }
 }
-function V(i) {
-  return S(i, (t) => ({
+function j(i) {
+  return O(i, (t) => ({
     dictionary: t
   }));
 }
-function x(i, t) {
-  if (C(t) && t !== "decoupled")
-    return document.getElementById(`${i}_editor`);
-  const e = q(i);
-  return S(e, ({ element: r }) => r);
+function F(i) {
+  const t = q(i);
+  return O(t, ({ element: e }) => e);
 }
 function q(i) {
-  return window.Livewire.all().filter(({ name: t, canonical: e }) => t === "ckeditor5-editable" && e.editorId === i).reduce((t, { canonical: e, el: r }) => ({
+  const t = window.Livewire.all().filter(({ name: s, canonical: o }) => s === "ckeditor5-editable" && o.editorId === i).reduce((s, { canonical: o, el: c }) => ({
+    ...s,
+    [o.rootName]: {
+      element: c.querySelector("[data-cke-editable-content]"),
+      content: o.content
+    }
+  }), /* @__PURE__ */ Object.create({})), r = window.Livewire.all().find(({ name: s, canonical: o }) => s === "ckeditor5" && o.editorId === i)?.canonical.content, n = document.querySelector(`#${i}_editor `), a = t.main;
+  return a && r?.main ? {
     ...t,
-    [e.rootName]: {
-      element: r.querySelector("[data-cke-editable-content]"),
-      content: e.content
+    main: {
+      ...a,
+      content: a.content || r.main
     }
-  }), /* @__PURE__ */ Object.create({}));
+  } : n ? {
+    ...t,
+    main: {
+      element: n,
+      content: r?.main || null
+    }
+  } : t;
 }
-function W(i) {
-  const t = q(i), e = S(t, ({ content: r }) => r);
+function L(i) {
+  const t = q(i), e = O(t, ({ content: r }) => r);
   return _(e, (r) => typeof r == "string");
 }
 function T(i) {
@@ -758,8 +769,8 @@ function T(i) {
     return r || console.warn(`Element not found for selector: ${t.$element}`), r || null;
   }
   const e = /* @__PURE__ */ Object.create(null);
-  for (const [r, a] of Object.entries(i))
-    e[r] = T(a);
+  for (const [r, n] of Object.entries(i))
+    e[r] = T(n);
   return e;
 }
 function et(i, t) {
@@ -768,12 +779,12 @@ function et(i, t) {
     r.setStyle("height", `${t}px`, e.view.document.getRoot());
   });
 }
-const D = Symbol.for("elixir-editor-watchdog");
+const x = Symbol.for("elixir-editor-watchdog");
 async function rt(i) {
   const { EditorWatchdog: t } = await import("ckeditor5"), e = new t(i);
   return e.setCreator(async (...r) => {
-    const a = await i.create(...r);
-    return a[D] = e, a;
+    const n = await i.create(...r);
+    return n[x] = e, n;
   }), {
     watchdog: e,
     Constructor: {
@@ -782,12 +793,12 @@ async function rt(i) {
   };
 }
 function it(i) {
-  return D in i ? i[D] : null;
+  return x in i ? i[x] : null;
 }
-class y extends A {
+class y extends H {
   static the = new y();
 }
-class at extends v {
+class nt extends C {
   /**
    * The promise that resolves to the context instance.
    */
@@ -796,14 +807,14 @@ class at extends v {
    * Mounts the context component.
    */
   async mounted() {
-    const { contextId: t, language: e, context: r } = this.canonical, { customTranslations: a, watchdogConfig: n, config: { plugins: s, ...o } } = r, { loadedPlugins: c, hasPremium: u } = await j(s ?? []), h = [
-      ...await F(e, u),
-      V(a || {})
-    ].filter((d) => !H(d));
+    const { contextId: t, language: e, context: r } = this.canonical, { customTranslations: n, watchdogConfig: a, config: { plugins: s, ...o } } = r, { loadedPlugins: c, hasPremium: u } = await A(s ?? []), h = [
+      ...await V(e, u),
+      j(n || {})
+    ].filter((d) => !W(d));
     this.contextPromise = (async () => {
       const { ContextWatchdog: d, Context: g } = await import("ckeditor5"), p = new d(g, {
         crashNumberLimit: 10,
-        ...n
+        ...a
       });
       return await p.create({
         ...o,
@@ -832,10 +843,10 @@ class at extends v {
     }
   }
 }
-class w extends A {
+class w extends H {
   static the = new w();
 }
-class nt extends v {
+class at extends C {
   /**
    * The promise that resolves when the editable is mounted.
    */
@@ -844,7 +855,7 @@ class nt extends v {
    * Mounts the editable component.
    */
   mounted() {
-    const { editorId: t, rootName: e, content: r, saveDebounceMs: a } = this.canonical, n = this.element.querySelector("input");
+    const { editorId: t, rootName: e, content: r, saveDebounceMs: n } = this.canonical, a = this.element.querySelector("input");
     this.editorPromise = w.the.execute(t, (s) => {
       const { ui: o, editing: c, model: u } = s;
       if (u.document.getRoot(e)) {
@@ -866,9 +877,9 @@ class nt extends v {
       o.addEditable(h), c.view.forceRender();
       const f = () => {
         const d = s.getData({ rootName: e });
-        n && (n.value = d), this.$wire.set("content", d);
+        a && (a.value = d), this.$wire.set("content", d);
       };
-      return s.model.document.on("change:data", O(a, f)), f(), s;
+      return s.model.document.on("change:data", D(n, f)), f(), s;
     });
   }
   /**
@@ -915,50 +926,50 @@ async function st({
      * Setups the content sync from Livewire to the editor.
      */
     setupContentServerSync() {
-      const { editor: a } = this, { model: n, ui: { focusTracker: s } } = a;
+      const { editor: n } = this, { model: a, ui: { focusTracker: s } } = n;
       let o = null;
-      a.on("afterCommitSynced", () => {
+      n.on("afterCommitSynced", () => {
         const { content: c } = t.canonical, u = this.getEditorRootsValues();
         if (Q(t.element)) {
           if (s.isFocused) {
             P(c, u) || (o = c);
             return;
           }
-          P(c, u) || a.setData(c);
+          P(c, u) || n.setData(c);
         }
       }), Livewire.on("set-editor-content", ({ editorId: c, content: u }) => {
         if (c !== t.canonical.editorId)
           return;
         const m = this.getEditorRootsValues();
-        P(m, u) || a.setData(u);
-      }), n.document.on("change:data", () => {
+        P(m, u) || n.setData(u);
+      }), a.document.on("change:data", () => {
         o = null;
       }), s.on("change:isFocused", () => {
-        !s.isFocused && o !== null && (a.setData(o), o = null);
+        !s.isFocused && o !== null && (n.setData(o), o = null);
       });
     }
     /**
      * Setups the content push event for the editor.
      */
     setupTypingContentPush() {
-      const { model: a } = this.editor, { $wire: n } = t, s = () => {
+      const { model: n } = this.editor, { $wire: a } = t, s = () => {
         const o = this.getEditorRootsValues();
-        P(o, t.canonical.content ?? {}) || (n.set("content", o), n.dispatch("editor-content-changed", {
+        P(o, t.canonical.content ?? {}) || (a.set("content", o), a.dispatch("editor-content-changed", {
           editorId: t.canonical.editorId,
           content: o
         }));
       };
-      a.document.on("change:data", O(i, s)), this.editor.once("ready", s);
+      n.document.on("change:data", D(i, s)), this.editor.once("ready", s);
     }
     /**
      * Setups the event push for the editor.
      */
     setupFocusableEventPush() {
-      const { ui: a } = this.editor, { $wire: n } = t, s = () => {
+      const { ui: n } = this.editor, { $wire: a } = t, s = () => {
         const o = this.getEditorRootsValues();
-        n.set("focused", a.focusTracker.isFocused), P(o, t.canonical.content ?? {}) || n.set("content", o);
+        a.set("focused", n.focusTracker.isFocused), P(o, t.canonical.content ?? {}) || a.set("content", o);
       };
-      a.focusTracker.on("change:isFocused", s);
+      n.focusTracker.on("change:isFocused", s);
     }
     /**
      * Gets the current values of all editor roots.
@@ -989,8 +1000,8 @@ async function ot(i) {
      * Initializes the plugin.
      */
     afterInit() {
-      const { editor: r } = this, n = r.sourceElement.id.replace(/_editor$/, "");
-      this.input = document.getElementById(`${n}_input`), this.input && (r.model.document.on("change:data", O(i, () => this.sync())), r.once("ready", this.sync), this.form = this.input.closest("form"), this.form?.addEventListener("submit", this.sync));
+      const { editor: r } = this, a = r.sourceElement.id.replace(/_editor$/, "");
+      this.input = document.getElementById(`${a}_input`), this.input && (r.model.document.on("change:data", D(i, () => this.sync())), r.once("ready", this.sync), this.form = this.input.closest("form"), this.form?.addEventListener("submit", this.sync));
     }
     /**
      * Synchronizes the editor's content with the input field.
@@ -1009,7 +1020,7 @@ async function ot(i) {
     }
   };
 }
-class ct extends v {
+class ct extends C {
   /**
    * The promise that resolves to the editor instance.
    */
@@ -1060,8 +1071,8 @@ class ct extends v {
       preset: t,
       editorId: e,
       contextId: r,
-      editableHeight: a,
-      saveDebounceMs: n,
+      editableHeight: n,
+      saveDebounceMs: a,
       language: s,
       watchdog: o,
       content: c
@@ -1080,44 +1091,44 @@ class ct extends v {
         this.editorPromise = Promise.resolve(k), w.the.register(e, k);
       });
     }
-    const { loadedPlugins: E, hasPremium: B } = await j(f);
+    const { loadedPlugins: E, hasPremium: B } = await A(f);
     E.push(
       await st(
         {
-          saveDebounceMs: n,
+          saveDebounceMs: a,
           component: this
         }
       )
-    ), C(m) && E.push(
-      await ot(n)
+    ), v(m) && E.push(
+      await ot(a)
     );
-    const z = [
-      ...await F(s, B),
-      V(u || {})
-    ].filter((l) => !H(l));
+    const $ = [
+      ...await V(s, B),
+      j(u || {})
+    ].filter((l) => !W(l));
     let b = {
       ...c,
-      ...W(e)
+      ...L(e)
     };
-    C(m) && (b = b.main || "");
+    v(m) && (b = b.main || "");
     const M = await (async () => {
-      let l = x(e, m);
+      let l = F(e);
       if (!(l instanceof HTMLElement) && !("main" in l)) {
-        const R = m === "decoupled" ? ["main"] : Object.keys(b);
-        N(l, R) || (l = await ut(e, m, R), b = {
+        const z = m === "decoupled" ? ["main"] : Object.keys(b);
+        N(l, z) || (l = await ut(e, z), b = {
           ...c,
-          ...W(e)
+          ...L(e)
         });
       }
-      C(m) && "main" in l && (l = l.main);
+      v(m) && "main" in l && (l = l.main);
       const k = {
         ...T(d),
         initialData: b,
         licenseKey: h,
         plugins: E,
         language: s,
-        ...z.length && {
-          translations: z
+        ...$.length && {
+          translations: $
         }
       };
       return !p || !(l instanceof HTMLElement) ? g.create(l, k) : (await Y({
@@ -1127,29 +1138,29 @@ class ct extends v {
         config: k
       })).editor;
     })();
-    return C(m) && a && et(M, a), M;
+    return v(m) && n && et(M, n), M;
   }
 }
 function N(i, t) {
   return t.every((e) => i[e]);
 }
-async function ut(i, t, e) {
-  return await G(
+async function ut(i, t) {
+  return G(
     () => {
-      const r = x(i, t);
-      if (!N(r, e))
+      const e = F(i);
+      if (!N(e, t))
         throw new Error(
           `It looks like not all required root elements are present yet.
 * If you want to wait for them, ensure they are registered before editor initialization.
 * If you want lazy initialize roots, consider removing root values from the \`initialData\` config and assign initial data in editable components.
-Missing roots: ${e.filter((a) => !r[a]).join(", ")}.`
+Missing roots: ${t.filter((r) => !e[r]).join(", ")}.`
         );
-      return !0;
+      return e;
     },
     { timeOutAfter: 2e3, retryAfter: 100 }
-  ), x(i, t);
+  );
 }
-class lt extends v {
+class lt extends C {
   /**
    * The promise that resolves when the UI part is mounted.
    */
@@ -1160,7 +1171,7 @@ class lt extends v {
   async mounted() {
     const { editorId: t, name: e } = this.canonical;
     this.mountedPromise = w.the.execute(t, (r) => {
-      const { ui: a } = r, n = mt(e), s = a.view[n];
+      const { ui: n } = r, a = mt(e), s = n.view[a];
       if (!s) {
         console.error(`Unknown UI part name: "${e}". Supported names are "toolbar" and "menubar".`);
         return;
@@ -1187,9 +1198,9 @@ function mt(i) {
 }
 const dt = {
   ckeditor5: ct,
-  "ckeditor5-context": at,
+  "ckeditor5-context": nt,
   "ckeditor5-ui-part": lt,
-  "ckeditor5-editable": nt
+  "ckeditor5-editable": at
 };
 function wt() {
   for (const [i, t] of Object.entries(dt))