@dotcms/vue 1.5.5 → 1.7.0-next.37

package/index.js

@@ -1,331 +1,381 @@
-import { isRef as te, isReactive as ne, toRaw as oe, shallowRef as re, onMounted as D, onBeforeUnmount as H, ref as S, readonly as se, defineComponent as p, unref as C, renderSlot as N, createCommentVNode as T, provide as ae, inject as ce, computed as c, openBlock as r, createElementBlock as l, createElementVNode as f, createTextVNode as _, toValue as le, normalizeStyle as w, toDisplayString as x, mergeProps as $, Fragment as E, createBlock as v, resolveDynamicComponent as M, normalizeProps as R, getCurrentInstance as ie, renderList as h, normalizeClass as Y, watch as ue, createVNode as b, withCtx as B, resolveComponent as X } from "vue";
-import { UVEEventType as de, UVE_MODE as L, DotCMSUVEAction as K } from "@dotcms/types";
-import { getUVEState as A, initUVE as me, updateNavigation as pe, createUVESubscription as ve, sendMessageToUVE as W } from "@dotcms/uve";
-import { registerStyleEditorSchemas as fe, isDotAnalyticsActive as q, ANALYTICS_READY_EVENT as z, DEVELOPMENT_MODE as ye, EMPTY_CONTAINER_STYLE_REACT as Q, getDotContentletAttributes as _e, getAnalyticsContentletAttributes as ge, CUSTOM_NO_COMPONENT as Ce, getContainersData as Ee, getContentletsInContainer as ke, getDotContainerAttributes as De, combineClasses as Te, DOT_SECTION_ID_PREFIX as Me, __DEFAULT_TINYMCE_CONFIG__ as he, __BASE_TINYMCE_CONFIG_WITH_NO_DEFAULT__ as F, __TINYMCE_PATH_ON_DOTCMS__ as be, isValidBlocks as Ne } from "@dotcms/uve/internal";
-import Se from "@tinymce/tinymce-vue";
-import { __DOTCMS_UVE_EVENT__ as we, BlockEditorDefaultBlocks as $e } from "@dotcms/types/internal";
-function xe(e) {
-  const t = /* @__PURE__ */ new WeakMap(), o = (s) => {
-    const n = te(s) ? s.value : ne(s) ? oe(s) : s;
-    if (n === null || typeof n != "object")
-      return n;
-    if (t.has(n))
-      return t.get(n);
-    if (Array.isArray(n)) {
+import { inject as ee, isRef as le, isReactive as ie, toRaw as j, shallowRef as ue, toValue as L, watch as V, onMounted as b, onBeforeUnmount as K, ref as N, computed as c, defineComponent as v, unref as E, renderSlot as S, createCommentVNode as T, provide as de, openBlock as r, createElementBlock as i, createElementVNode as y, createTextVNode as C, normalizeStyle as w, toDisplayString as O, mergeProps as $, Fragment as k, createBlock as f, resolveDynamicComponent as D, normalizeProps as R, getCurrentInstance as me, renderList as M, normalizeClass as W, markRaw as te, useSlots as pe, createVNode as h, withCtx as B, resolveComponent as ne } from "vue";
+import { createDotCMSClient as ve } from "@dotcms/client";
+import { UVEEventType as fe, UVE_MODE as P, DotCMSUVEAction as z } from "@dotcms/types";
+import { createUVESubscription as ye, getUVEState as x, initUVE as _e, updateNavigation as ge, sendMessageToUVE as X } from "@dotcms/uve";
+import { registerStyleEditorSchemas as Ce, isDotAnalyticsActive as Q, ANALYTICS_READY_EVENT as J, DEVELOPMENT_MODE as Ee, EMPTY_CONTAINER_STYLE_REACT as oe, getDotContentletAttributes as ke, getAnalyticsContentletAttributes as De, CUSTOM_NO_COMPONENT as Te, getContainersData as Me, getContentletsInContainer as he, getDotContainerAttributes as be, combineClasses as Se, DOT_SECTION_ID_PREFIX as Ne, __DEFAULT_TINYMCE_CONFIG__ as we, __BASE_TINYMCE_CONFIG_WITH_NO_DEFAULT__ as H, __TINYMCE_PATH_ON_DOTCMS__ as $e, isValidBlocks as Oe } from "@dotcms/uve/internal";
+import xe from "@tinymce/tinymce-vue";
+import { __DOTCMS_UVE_EVENT__ as Ae, BlockEditorDefaultBlocks as Ie } from "@dotcms/types/internal";
+const se = /* @__PURE__ */ Symbol("DotCMSClient");
+function qt(t) {
+  const e = ve(t);
+  return {
+    client: e,
+    install(n) {
+      n.provide(se, e);
+    }
+  };
+}
+function zt() {
+  const t = ee(se, null);
+  if (!t)
+    throw new Error(
+      "[useDotCMSClient] No dotCMS client found. Did you install the plugin with `app.use(createDotCMSVue({ ... }))`?"
+    );
+  return t;
+}
+function Re(t) {
+  const e = /* @__PURE__ */ new WeakMap(), n = (a) => {
+    const o = le(a) ? a.value : ie(a) ? j(a) : a;
+    if (o === null || typeof o != "object")
+      return o;
+    if (e.has(o))
+      return e.get(o);
+    if (Array.isArray(o)) {
       const d = [];
-      return t.set(n, d), n.forEach((y) => d.push(o(y))), d;
+      return e.set(o, d), o.forEach((p) => d.push(n(p))), d;
     }
-    const a = Object.getPrototypeOf(n);
-    if (a !== Object.prototype && a !== null)
-      return n;
-    const i = {};
-    t.set(n, i);
-    for (const d of Object.keys(n))
-      i[d] = o(n[d]);
-    return i;
+    const s = Object.getPrototypeOf(o);
+    if (s !== Object.prototype && s !== null)
+      return o;
+    const l = {};
+    e.set(o, l);
+    for (const d of Object.keys(o))
+      l[d] = n(o[d]);
+    return l;
   };
-  return o(e);
+  return n(t);
 }
-function Gt(e) {
-  const t = re(e);
-  let o, s;
-  return D(() => {
-    if (!A())
+function Xt(t) {
+  const e = ue(L(t));
+  let n, a;
+  const o = (s) => {
+    if (n?.(), n = void 0, !x())
       return;
-    if (!e) {
+    if (!s) {
       console.warn("[useEditableDotCMSPage]: No page response provided");
       return;
     }
-    const n = xe(e), a = n?.pageAsset?.page?.pageURI;
-    ({ destroyUVESubscriptions: o } = me(n)), a && pe(a), n.styleEditorSchemas?.length && fe(n.styleEditorSchemas);
-  }), D(() => {
-    ({ unsubscribe: s } = ve(
-      de.CONTENT_CHANGES,
-      (n) => {
-        t.value = n;
+    const l = Re(s), d = l?.pageAsset?.page?.pageURI;
+    ({ destroyUVESubscriptions: n } = _e(l)), d && ge(d), l.styleEditorSchemas?.length && Ce(l.styleEditorSchemas);
+  };
+  return V(
+    () => L(t),
+    (s) => {
+      e.value = s, o(s);
+    },
+    { immediate: !0 }
+  ), b(() => {
+    ({ unsubscribe: a } = ye(
+      fe.CONTENT_CHANGES,
+      (s) => {
+        e.value = s;
       }
     ));
-  }), H(() => {
-    o?.(), s?.();
-  }), t;
+  }), K(() => {
+    n?.(), a?.();
+  }), e;
 }
-function Ae(e) {
-  const t = S(!1);
-  return D(() => {
-    t.value = A()?.mode === e;
-  }), se(t);
+function Le(t) {
+  const e = N(!1);
+  return b(() => {
+    e.value = !0;
+  }), c(() => e.value ? x()?.mode === L(t) : !1);
+}
+const Be = /^https?:\/\//;
+function Qt(t = "") {
+  const e = t ? new URL(t).origin : "";
+  return (n, a = {}) => {
+    if (Be.test(n))
+      return n;
+    const { width: o, quality: s = 50, languageId: l = "1" } = a, d = n.includes("/dA/") ? n : `/dA/${n}`, p = o ? `/${o}w` : "";
+    return `${e}${d}${p}/${s}q?language_id=${l}`;
+  };
 }
-const Ht = /* @__PURE__ */ p({
+const Jt = /* @__PURE__ */ v({
   __name: "DotCMSShow",
   props: {
-    when: { default: L.EDIT }
+    when: { default: P.EDIT }
   },
-  setup(e) {
-    const o = Ae(e.when);
-    return (s, n) => C(o) ? N(s.$slots, "default", { key: 0 }) : T("", !0);
+  setup(t) {
+    const e = t, n = Le(() => e.when);
+    return (a, o) => E(n) ? S(a.$slots, "default", { key: 0 }) : T("", !0);
   }
-}), J = /* @__PURE__ */ Symbol("DotCMSPageContext");
-function Ie(e) {
-  ae(J, e);
+}), re = /* @__PURE__ */ Symbol("DotCMSPageContext");
+function Pe(t) {
+  de(re, t);
 }
-const Oe = {
+const Ue = {
   pageAsset: {},
   mode: "production",
   userComponents: {},
   isDevMode: !1,
-  isAnalyticsActive: !1
+  isAnalyticsActive: !1,
+  slots: {}
 };
-function I() {
-  return ce(
-    J,
-    c(() => Oe)
+function A() {
+  return ee(
+    re,
+    c(() => Ue)
   );
 }
-const Re = {
+const Ve = {
   key: 0,
   "data-testid": "error-message",
   style: { padding: "1rem", border: "1px solid #e0e0e0", borderRadius: "4px" }
-}, Be = /* @__PURE__ */ p({
+}, Fe = /* @__PURE__ */ v({
   __name: "ErrorMessage",
-  setup(e) {
-    const t = I(), o = c(() => t.value.isDevMode);
-    return D(() => {
+  setup(t) {
+    const e = A(), n = c(() => e.value.isDevMode);
+    return b(() => {
       console.warn("Missing required layout.body property in page");
-    }), (s, n) => o.value ? (r(), l("div", Re, [...n[0] || (n[0] = [
-      f("p", { style: { margin: "0 0 0.5rem", color: "#666" } }, [
-        _(" The "),
-        f("code", null, "page"),
-        _(" is missing the required "),
-        f("code", null, "layout.body"),
-        _(" property. ")
+    }), (a, o) => n.value ? (r(), i("div", Ve, [...o[0] || (o[0] = [
+      y("p", { style: { margin: "0 0 0.5rem", color: "#666" } }, [
+        C(" The "),
+        y("code", null, "page"),
+        C(" is missing the required "),
+        y("code", null, "layout.body"),
+        C(" property. ")
       ], -1),
-      f("p", { style: { margin: 0, color: "#666" } }, " Make sure the page asset is properly loaded and includes a layout configuration. ", -1)
+      y("p", { style: { margin: 0, color: "#666" } }, " Make sure the page asset is properly loaded and includes a layout configuration. ", -1)
     ])])) : T("", !0);
   }
-});
-function Le() {
-  const e = S(!1), t = () => {
-    e.value = q();
+}), Z = "contentlet-";
+function Ge() {
+  const t = N(!1), e = () => {
+    t.value = Q();
   };
-  return D(() => {
-    e.value = q(), window.addEventListener(z, t);
-  }), H(() => {
-    window.removeEventListener(z, t);
-  }), e;
+  return b(() => {
+    t.value = Q(), window.addEventListener(J, e);
+  }), K(() => {
+    window.removeEventListener(J, e);
+  }), t;
 }
-function Pe(e) {
-  const t = A()?.mode;
-  return t ? t === L.EDIT : e === ye;
+function He(t) {
+  const e = x()?.mode;
+  return e ? e === P.EDIT : t === Ee;
 }
-function Ue(e) {
-  return c(() => Pe(le(e)));
+function Ye(t) {
+  return c(() => He(L(t)));
 }
-const Ve = /* @__PURE__ */ p({
+const je = /* @__PURE__ */ v({
   __name: "ContainerNotFound",
   props: {
     identifier: {}
   },
-  setup(e) {
-    const t = e, o = I(), s = c(() => o.value.isDevMode);
-    return D(() => {
-      s.value && console.error(`Container with identifier ${t.identifier} not found`);
-    }), (n, a) => s.value ? (r(), l("div", {
+  setup(t) {
+    const e = t, n = A(), a = c(() => n.value.isDevMode);
+    return b(() => {
+      a.value && console.error(`Container with identifier ${e.identifier} not found`);
+    }), (o, s) => a.value ? (r(), i("div", {
       key: 0,
       "data-testid": "container-not-found",
-      style: w(C(Q))
-    }, " This container with identifier " + x(e.identifier) + " was not found. ", 5)) : T("", !0);
+      style: w(E(oe))
+    }, " This container with identifier " + O(t.identifier) + " was not found. ", 5)) : T("", !0);
   }
-}), Fe = /* @__PURE__ */ p({
+}), Ke = /* @__PURE__ */ v({
   inheritAttrs: !1,
   __name: "EmptyContainer",
-  setup(e) {
-    const t = I(), o = c(() => t.value.isDevMode);
-    return (s, n) => o.value ? (r(), l("div", $({ key: 0 }, s.$attrs, { style: C(Q) }), [...n[0] || (n[0] = [
-      f("span", {
+  setup(t) {
+    const e = A(), n = c(() => e.value.isDevMode);
+    return (a, o) => n.value ? (r(), i("div", $({ key: 0 }, a.$attrs, { style: E(oe) }), [...o[0] || (o[0] = [
+      y("span", {
         "data-testid": "empty-container-message",
         "data-dot-object": "empty-content"
       }, " This container is empty. ", -1)
     ])], 16)) : T("", !0);
   }
 });
-function Ge(e) {
-  const t = S(!1);
-  return D(() => {
-    const o = e()?.getBoundingClientRect().height ?? 0;
-    t.value = o > 0;
-  }), t;
+function We(t) {
+  const e = N(!1);
+  return b(() => {
+    const n = t()?.getBoundingClientRect().height ?? 0;
+    e.value = n > 0;
+  }), e;
 }
-const He = "dotcms-contentlet", Ye = {
+const qe = "dotcms-contentlet", ze = {
   key: 1,
   "data-testid": "no-component"
-}, je = /* @__PURE__ */ p({
+}, Xe = /* @__PURE__ */ v({
   __name: "FallbackComponent",
   props: {
     contentlet: {},
     userNoComponent: {}
   },
-  setup(e) {
-    const t = e, o = I(), s = c(() => o.value.isDevMode), n = c(() => !!t.userNoComponent);
-    return (a, i) => s.value ? (r(), l(E, { key: 0 }, [
-      n.value ? (r(), v(M(e.userNoComponent), R($({ key: 0 }, e.contentlet)), null, 16)) : (r(), l("div", Ye, [
-        i[0] || (i[0] = _(" No Component for ", -1)),
-        f("strong", null, x(e.contentlet.contentType), 1),
-        i[1] || (i[1] = _(". ", -1))
+  setup(t) {
+    const e = t, n = A(), a = c(() => n.value.isDevMode), o = c(() => !!e.userNoComponent);
+    return (s, l) => a.value ? (r(), i(k, { key: 0 }, [
+      o.value ? (r(), f(D(t.userNoComponent), R($({ key: 0 }, t.contentlet)), null, 16)) : (r(), i("div", ze, [
+        l[0] || (l[0] = C(" No Component for ", -1)),
+        y("strong", null, O(t.contentlet.contentType), 1),
+        l[1] || (l[1] = C(" . ", -1))
       ]))
     ], 64)) : T("", !0);
   }
-}), Ke = /* @__PURE__ */ p({
+}), Qe = /* @__PURE__ */ v({
   __name: "Contentlet",
   props: {
     contentlet: {},
     container: {}
   },
-  setup(e) {
-    const t = e, o = I(), s = c(() => o.value.isDevMode), n = ie(), a = Ge(
-      () => n?.proxy?.$el
-    ), i = c(() => o.value.isDevMode ? {
-      ..._e(t.contentlet, t.container),
+  setup(t) {
+    const e = t, n = A(), a = c(() => n.value.isDevMode), o = me(), s = We(
+      () => o?.proxy?.$el
+    ), l = c(() => n.value.isDevMode ? {
+      ...ke(e.contentlet, e.container),
       "data-dot-object": "contentlet"
-    } : o.value.isAnalyticsActive ? ge(t.contentlet) : {}), d = c(
-      () => s.value ? { minHeight: a.value ? void 0 : "4rem" } : {}
-    ), y = c(
-      () => o.value.userComponents[t.contentlet?.contentType]
-    ), u = c(
-      () => o.value.userComponents[Ce]
+    } : n.value.isAnalyticsActive ? De(e.contentlet) : {}), d = c(
+      () => a.value ? { minHeight: s.value ? void 0 : "4rem" } : {}
+    ), p = c(() => {
+      const m = e.contentlet?.identifier, g = m ? n.value.slots?.[m] : void 0;
+      if (g)
+        return () => g({ contentlet: e.contentlet });
+    }), u = c(
+      () => n.value.userComponents[e.contentlet?.contentType]
+    ), _ = c(
+      () => n.value.userComponents[Te]
     );
-    return (g, m) => (r(), l("div", $(i.value, {
-      class: C(He),
+    return (m, g) => (r(), i("div", $(l.value, {
+      class: E(qe),
       style: d.value
     }), [
-      y.value ? (r(), v(M(y.value), R($({ key: 0 }, e.contentlet)), null, 16)) : (r(), v(je, {
-        key: 1,
-        "user-no-component": u.value,
-        contentlet: e.contentlet
+      p.value ? (r(), f(D(p.value), { key: 0 })) : u.value ? (r(), f(D(u.value), R($({ key: 1 }, t.contentlet)), null, 16)) : (r(), f(Xe, {
+        key: 2,
+        "user-no-component": _.value,
+        contentlet: t.contentlet
       }, null, 8, ["user-no-component", "contentlet"]))
     ], 16));
   }
-}), We = /* @__PURE__ */ p({
+}), Je = /* @__PURE__ */ v({
   __name: "Container",
   props: {
     container: {}
   },
-  setup(e) {
-    const t = e, o = I(), s = c(() => Ee(o.value.pageAsset, t.container)), n = c(
-      () => ke(o.value.pageAsset, t.container)
-    ), a = c(() => n.value.length === 0), i = c(
-      () => o.value.isDevMode && s.value ? De(s.value) : {}
+  setup(t) {
+    const e = t, n = A(), a = c(() => Me(n.value.pageAsset, e.container)), o = c(() => he(n.value.pageAsset, e.container)), s = c(() => o.value.length === 0), l = c(
+      () => n.value.isDevMode && a.value ? be(a.value) : {}
     ), d = c(
-      () => o.value.isDevMode ? JSON.stringify(s.value) : ""
+      () => n.value.isDevMode ? JSON.stringify(a.value) : ""
     );
-    return (y, u) => s.value ? a.value ? (r(), v(Fe, R($({ key: 1 }, i.value)), null, 16)) : (r(), l("div", R($({ key: 2 }, i.value)), [
-      (r(!0), l(E, null, h(n.value, (g) => (r(), v(Ke, {
-        key: g.identifier,
-        contentlet: g,
+    return (p, u) => a.value ? s.value ? (r(), f(Ke, R($({ key: 1 }, l.value)), null, 16)) : (r(), i("div", R($({ key: 2 }, l.value)), [
+      (r(!0), i(k, null, M(o.value, (_) => (r(), f(Qe, {
+        key: _.identifier,
+        contentlet: _,
         container: d.value
       }, null, 8, ["contentlet", "container"]))), 128))
-    ], 16)) : (r(), v(Ve, {
+    ], 16)) : (r(), f(je, {
       key: 0,
-      identifier: e.container.identifier
+      identifier: t.container.identifier
     }, null, 8, ["identifier"]));
   }
-}), qe = /* @__PURE__ */ p({
+}), Ze = /* @__PURE__ */ v({
   __name: "Column",
   props: {
     column: {}
   },
-  setup(e) {
-    const t = e, o = c(() => ({
-      gridColumnStart: t.column.leftOffset,
-      gridColumnEnd: t.column.leftOffset + t.column.width
+  setup(t) {
+    const e = t, n = c(() => ({
+      gridColumnStart: e.column.leftOffset,
+      gridColumnEnd: e.column.leftOffset + e.column.width
     }));
-    return (s, n) => (r(), l("div", {
+    return (a, o) => (r(), i("div", {
       "data-dot": "column",
-      style: w(o.value)
+      style: w(n.value)
     }, [
-      f("div", {
-        class: Y(e.column.styleClass)
+      y("div", {
+        class: W(t.column.styleClass)
       }, [
-        (r(!0), l(E, null, h(e.column.containers, (a) => (r(), v(We, {
-          key: `${a.identifier}-${a.uuid}`,
-          container: a
+        (r(!0), i(k, null, M(t.column.containers, (s) => (r(), f(Je, {
+          key: `${s.identifier}-${s.uuid}`,
+          container: s
         }, null, 8, ["container"]))), 128))
       ], 2)
     ], 4));
   }
-}), ze = ["id"], Xe = /* @__PURE__ */ p({
+}), et = ["id"], tt = /* @__PURE__ */ v({
   __name: "Row",
   props: {
     row: {},
     index: {}
   },
-  setup(e) {
-    const t = e, o = c(() => Te(["dot-row-container", t.row.styleClass || ""])), s = c(() => `${Me}${t.index}`), n = {
+  setup(t) {
+    const e = t, n = c(() => Se(["dot-row-container", e.row.styleClass || ""])), a = c(() => `${Ne}${e.index}`), o = {
       display: "grid",
       gridTemplateColumns: "repeat(12, 1fr)",
       gap: "1rem"
     };
-    return (a, i) => (r(), l("div", {
-      id: s.value,
-      class: Y(o.value)
+    return (s, l) => (r(), i("div", {
+      id: a.value,
+      class: W(n.value)
     }, [
-      f("div", {
+      y("div", {
         class: "dotcms-row",
         "data-dot-object": "row",
-        style: n
+        style: o
       }, [
-        (r(!0), l(E, null, h(e.row.columns, (d, y) => (r(), v(qe, {
-          key: y,
+        (r(!0), i(k, null, M(t.row.columns, (d, p) => (r(), f(Ze, {
+          key: p,
           column: d
         }, null, 8, ["column"]))), 128))
       ])
-    ], 10, ze));
+    ], 10, et));
   }
-}), Yt = /* @__PURE__ */ p({
+}), Zt = /* @__PURE__ */ v({
   __name: "DotCMSLayoutBody",
   props: {
     page: {},
     components: {},
     mode: { default: "production" }
   },
-  setup(e) {
-    const t = e, o = Ue(() => t.mode), s = Le();
-    Ie(
+  setup(t) {
+    const e = t, n = Ye(() => e.mode), a = Ge(), o = c(() => {
+      const p = {};
+      for (const u of Object.keys(e.components))
+        p[u] = j(e.components[u]);
+      return te(p);
+    }), s = pe(), l = c(() => {
+      const p = {}, u = Object.entries(s);
+      for (const [_, m] of u)
+        m && _.startsWith(Z) && (p[_.slice(Z.length)] = m);
+      return p;
+    });
+    Pe(
       c(() => ({
-        pageAsset: t.page,
-        mode: t.mode,
-        userComponents: t.components,
-        isDevMode: o.value,
-        isAnalyticsActive: s.value
+        pageAsset: e.page,
+        mode: e.mode,
+        userComponents: o.value,
+        isDevMode: n.value,
+        isAnalyticsActive: a.value,
+        slots: l.value
       }))
     );
-    const n = c(() => t.page?.layout?.body?.rows);
-    return (a, i) => n.value ? (r(!0), l(E, { key: 0 }, h(n.value, (d, y) => (r(), v(Xe, {
-      key: y,
-      row: d,
-      index: y + 1
-    }, null, 8, ["row", "index"]))), 128)) : (r(), v(Be, { key: 1 }));
+    const d = c(() => e.page?.layout?.body?.rows);
+    return (p, u) => d.value ? (r(!0), i(k, { key: 0 }, M(d.value, (_, m) => (r(), f(tt, {
+      key: m,
+      row: _,
+      index: m + 1
+    }, null, 8, ["row", "index"]))), 128)) : (r(), f(Fe, { key: 1 }));
   }
-}), G = {
-  ...he,
+}), Y = {
+  ...we,
   licenseKey: "gpl"
   // Self-hosted GPL license.
-}, Qe = {
+}, nt = {
   full: {
-    ...G,
-    ...F.full
+    ...Y,
+    ...H.full
   },
   plain: {
-    ...G,
-    ...F.plain
+    ...Y,
+    ...H.plain
   },
   minimal: {
-    ...G,
-    ...F.minimal
+    ...Y,
+    ...H.minimal
   }
-}, Je = ["innerHTML"], Ze = {
+}, ot = ["innerHTML"], st = {
   key: 1,
   style: { outline: "2px solid #006ce7", borderRadius: "4px" }
-}, jt = /* @__PURE__ */ p({
+}, en = /* @__PURE__ */ v({
   __name: "DotCMSEditableText",
   props: {
     contentlet: {},
@@ -333,109 +383,109 @@ const He = "dotcms-contentlet", Ye = {
     format: { default: "text" },
     mode: { default: "plain" }
   },
-  setup(e) {
-    const t = e, o = S(null), s = S(""), n = S(!1), a = S(t.contentlet?.[t.fieldName] || ""), i = c(() => Qe[t.mode]);
-    ue(
-      () => [t.fieldName, t.contentlet],
+  setup(t) {
+    const e = t, n = N(null), a = N(""), o = N(!1), s = N(e.contentlet?.[e.fieldName] || ""), l = c(() => nt[e.mode]);
+    V(
+      () => [e.fieldName, e.contentlet],
       () => {
-        a.value = t.contentlet?.[t.fieldName] || "", o.value?.setContent(a.value, { format: t.format });
+        s.value = e.contentlet?.[e.fieldName] || "", n.value?.setContent(s.value, { format: e.format });
       }
     );
-    const d = (m, k) => {
-      o.value = k;
-    }, y = (m) => {
+    const d = (m, g) => {
+      n.value = g;
+    }, p = (m) => {
       if (Number(
-        t.contentlet.onNumberOfPages ?? 1
-      ) <= 1 || o.value?.hasFocus())
+        e.contentlet.onNumberOfPages ?? 1
+      ) <= 1 || n.value?.hasFocus())
         return;
       m.stopPropagation(), m.preventDefault();
-      const { inode: O, languageId: V } = t.contentlet;
-      W({
-        action: K.COPY_CONTENTLET_INLINE_EDITING,
+      const { inode: I, languageId: G } = e.contentlet;
+      X({
+        action: z.COPY_CONTENTLET_INLINE_EDITING,
         payload: {
-          dataset: { inode: O, language: V, fieldName: t.fieldName }
+          dataset: { inode: I, language: G, fieldName: e.fieldName }
         }
       });
     }, u = () => {
-      const m = o.value?.getContent({ format: t.format }) || "";
-      if (!o.value?.isDirty() || m === a.value)
+      const m = n.value?.getContent({ format: e.format }) || "";
+      if (!n.value?.isDirty() || m === s.value)
         return;
-      const { inode: k, languageId: O } = t.contentlet;
-      W({
-        action: K.UPDATE_CONTENTLET_INLINE_EDITING,
+      const { inode: g, languageId: I } = e.contentlet;
+      X({
+        action: z.UPDATE_CONTENTLET_INLINE_EDITING,
         payload: {
           content: m,
-          dataset: { inode: k, langId: O, fieldName: t.fieldName }
+          dataset: { inode: g, langId: I, fieldName: e.fieldName }
         }
       });
-    }, g = ({ data: m }) => {
-      const { name: k, payload: O } = m ?? {};
-      if (k !== we.UVE_COPY_CONTENTLET_INLINE_EDITING_SUCCESS)
+    }, _ = ({ data: m }) => {
+      const { name: g, payload: I } = m ?? {};
+      if (g !== Ae.UVE_COPY_CONTENTLET_INLINE_EDITING_SUCCESS)
         return;
-      const { oldInode: V, inode: Z, fieldName: ee } = O ?? {}, j = t.contentlet.inode;
-      (j === V || j === Z) && ee === t.fieldName && o.value?.focus();
+      const { oldInode: G, inode: ae, fieldName: ce } = I ?? {}, q = e.contentlet.inode;
+      (q === G || q === ae) && ce === e.fieldName && n.value?.focus();
     };
-    return D(() => {
-      const m = A();
-      if (n.value = m?.mode === L.EDIT && !!m?.dotCMSHost?.length, !t.contentlet || !t.fieldName) {
+    return b(() => {
+      const m = x();
+      if (o.value = m?.mode === P.EDIT && !!m?.dotCMSHost?.length, !e.contentlet || !e.fieldName) {
         console.error(
           "[DotCMSEditableText]: contentlet or fieldName is missing. Ensure all needed props are passed to view and edit the content."
         );
         return;
       }
-      if (m && m.mode !== L.EDIT) {
+      if (m && m.mode !== P.EDIT) {
         console.warn("[DotCMSEditableText]: TinyMCE is not available in the current mode");
         return;
       }
-      m?.dotCMSHost && (s.value = new URL(be, m.dotCMSHost).toString(), window.addEventListener("message", g));
-    }), H(() => {
-      window.removeEventListener("message", g);
-    }), (m, k) => n.value ? (r(), l("div", Ze, [
-      b(C(Se), {
-        "tinymce-script-src": s.value,
+      m?.dotCMSHost && (a.value = new URL($e, m.dotCMSHost).toString(), window.addEventListener("message", _));
+    }), K(() => {
+      window.removeEventListener("message", _);
+    }), (m, g) => o.value ? (r(), i("div", st, [
+      h(E(xe), {
+        "tinymce-script-src": a.value,
         inline: !0,
-        init: i.value,
-        "initial-value": a.value,
+        init: l.value,
+        "initial-value": s.value,
         onInit: d,
-        onMousedown: y,
+        onMousedown: p,
         onFocusout: u
       }, null, 8, ["tinymce-script-src", "init", "initial-value"])
-    ])) : (r(), l("span", {
+    ])) : (r(), i("span", {
       key: 0,
-      innerHTML: a.value
-    }, null, 8, Je));
+      innerHTML: s.value
+    }, null, 8, ot));
   }
-}), U = (e, t) => {
-  const o = e.__vccOpts || e;
-  for (const [s, n] of t)
-    o[s] = n;
-  return o;
-}, et = {};
-function tt(e, t) {
-  return r(), l("ul", null, [
-    N(e.$slots, "default")
+}), F = (t, e) => {
+  const n = t.__vccOpts || t;
+  for (const [a, o] of e)
+    n[a] = o;
+  return n;
+}, rt = {};
+function at(t, e) {
+  return r(), i("ul", null, [
+    S(t.$slots, "default")
   ]);
 }
-const nt = /* @__PURE__ */ U(et, [["render", tt]]), ot = ["data-language"], rt = /* @__PURE__ */ p({
+const ct = /* @__PURE__ */ F(rt, [["render", at]]), lt = ["data-language"], it = /* @__PURE__ */ v({
   __name: "CodeBlock",
   props: {
     node: {}
   },
-  setup(e) {
-    const t = e, o = c(() => t.node?.attrs?.language || "");
-    return (s, n) => (r(), l("pre", { "data-language": o.value }, [
-      f("code", null, [
-        N(s.$slots, "default")
+  setup(t) {
+    const e = t, n = c(() => e.node?.attrs?.language || "");
+    return (a, o) => (r(), i("pre", { "data-language": n.value }, [
+      y("code", null, [
+        S(a.$slots, "default")
       ])
-    ], 8, ot));
+    ], 8, lt));
   }
-}), st = /* @__PURE__ */ p({
+}), ut = /* @__PURE__ */ v({
   __name: "NoComponentProvided",
   props: {
     contentType: {}
   },
-  setup(e) {
-    const t = {
+  setup(t) {
+    const e = {
       backgroundColor: "#fffaf0",
       color: "#333",
       padding: "1rem",
@@ -443,174 +493,180 @@ const nt = /* @__PURE__ */ U(et, [["render", tt]]), ot = ["data-language"], rt =
       marginBottom: "1rem",
       marginTop: "1rem",
       border: "1px solid #ed8936"
-    }, o = { color: "#c05621" };
-    return (s, n) => (r(), l("div", {
+    }, n = { color: "#c05621" };
+    return (a, o) => (r(), i("div", {
       "data-testid": "no-component-provided",
-      style: t
+      style: e
     }, [
-      f("strong", { style: o }, "Dev Warning"),
-      n[0] || (n[0] = _(": No component or custom renderer provided for content type ", -1)),
-      f("strong", { style: o }, x(e.contentType || "Unknown"), 1),
-      n[1] || (n[1] = _(". ", -1)),
-      n[2] || (n[2] = f("br", null, null, -1)),
-      n[3] || (n[3] = _(" Please refer to the ", -1)),
-      f("a", {
+      y("strong", { style: n }, "Dev Warning"),
+      o[0] || (o[0] = C(" : No component or custom renderer provided for content type ", -1)),
+      y("strong", { style: n }, O(t.contentType || "Unknown"), 1),
+      o[1] || (o[1] = C(" . ", -1)),
+      o[2] || (o[2] = y("br", null, null, -1)),
+      o[3] || (o[3] = C(" Please refer to the ", -1)),
+      y("a", {
         href: "https://dev.dotcms.com/docs/block-editor",
         target: "_blank",
         rel: "noopener noreferrer",
-        style: o
-      }, "Block Editor Custom Renderers Documentation"),
-      n[4] || (n[4] = _(" for guidance. ", -1))
+        style: n
+      }, " Block Editor Custom Renderers Documentation "),
+      o[4] || (o[4] = C(" for guidance. ", -1))
     ]));
   }
-}), at = "[DotCMSBlockEditorRenderer]: No data provided for Contentlet Block. Try to add a contentlet to the block editor. If the error persists, please contact the DotCMS support team.", ct = /* @__PURE__ */ p({
+}), dt = "[DotCMSBlockEditorRenderer]: No data provided for Contentlet Block. Try to add a contentlet to the block editor. If the error persists, please contact the DotCMS support team.", mt = /* @__PURE__ */ v({
   __name: "DotContent",
   props: {
     node: {},
     customRenderers: {},
     isDevMode: { type: Boolean }
   },
-  setup(e) {
-    const t = (d) => `[DotCMSBlockEditorRenderer]: No matching component found for content type: ${d}. Provide a custom renderer for this content type to fix this error.`, o = e, s = c(() => o.node.attrs?.data), n = c(() => s.value?.contentType ?? "Unknown Content Type"), a = c(() => o.customRenderers?.[n.value]), i = c(() => s.value ? o.isDevMode && !a.value ? "dev-warning" : a.value ? "render" : (console.warn(t(n.value)), "no-component") : (console.error(at), "no-data"));
-    return (d, y) => i.value === "dev-warning" ? (r(), v(st, {
+  setup(t) {
+    const e = (d) => `[DotCMSBlockEditorRenderer]: No matching component found for content type: ${d}. Provide a custom renderer for this content type to fix this error.`, n = t, a = c(() => n.node.attrs?.data), o = c(() => a.value?.contentType ?? "Unknown Content Type"), s = c(() => n.customRenderers?.[o.value]), l = c(() => a.value ? n.isDevMode && !s.value ? "dev-warning" : s.value ? "render" : "no-component" : "no-data");
+    return V(
+      l,
+      (d) => {
+        d === "no-data" ? console.error(dt) : d === "no-component" && console.warn(e(o.value));
+      },
+      { immediate: !0 }
+    ), (d, p) => l.value === "dev-warning" ? (r(), f(ut, {
       key: 0,
-      "content-type": n.value
-    }, null, 8, ["content-type"])) : i.value === "render" ? (r(), v(M(a.value), {
+      "content-type": o.value
+    }, null, 8, ["content-type"])) : l.value === "render" ? (r(), f(D(s.value), {
       key: 1,
-      node: e.node
+      node: t.node
     }, null, 8, ["node"])) : T("", !0);
   }
-}), lt = ["alt", "src"], it = /* @__PURE__ */ p({
+}), pt = ["alt", "src"], vt = /* @__PURE__ */ v({
   __name: "DotImage",
   props: {
     node: {}
   },
-  setup(e) {
-    const t = e, o = c(() => t.node.attrs ?? {}), s = c(() => {
-      const { textWrap: a, textAlign: i } = o.value;
-      return a === "left" ? { float: "left", width: "50%", margin: "0 1rem 1rem 0" } : a === "right" ? { float: "right", width: "50%", margin: "0 0 1rem 1rem" } : i ? { textAlign: i } : {};
-    }), n = c(
-      () => o.value.textWrap ? { maxWidth: "100%", height: "auto" } : void 0
+  setup(t) {
+    const e = t, n = c(() => e.node.attrs ?? {}), a = c(() => {
+      const { textWrap: s, textAlign: l } = n.value;
+      return s === "left" ? { float: "left", width: "50%", margin: "0 1rem 1rem 0" } : s === "right" ? { float: "right", width: "50%", margin: "0 0 1rem 1rem" } : l ? { textAlign: l } : {};
+    }), o = c(
+      () => n.value.textWrap ? { maxWidth: "100%", height: "auto" } : void 0
     );
-    return (a, i) => (r(), l("figure", {
-      style: w(s.value)
+    return (s, l) => (r(), i("figure", {
+      style: w(a.value)
     }, [
-      f("img", {
-        alt: o.value.alt,
-        src: o.value.src,
-        style: w(n.value)
-      }, null, 12, lt)
+      y("img", {
+        alt: n.value.alt,
+        src: n.value.src,
+        style: w(o.value)
+      }, null, 12, pt)
     ], 4));
   }
-}), ut = ["width", "height", "poster"], dt = ["src", "type"], mt = /* @__PURE__ */ p({
+}), ft = ["width", "height", "poster"], yt = ["src", "type"], _t = /* @__PURE__ */ v({
   __name: "DotVideo",
   props: {
     node: {}
   },
-  setup(e) {
-    const t = e, o = c(() => t.node.attrs ?? {}), s = c(() => o.value.data?.thumbnail);
-    return (n, a) => (r(), l("video", {
+  setup(t) {
+    const e = t, n = c(() => e.node.attrs ?? {}), a = c(() => n.value.data?.thumbnail);
+    return (o, s) => (r(), i("video", {
       controls: "",
       preload: "metadata",
-      width: o.value.width,
-      height: o.value.height,
-      poster: s.value
+      width: n.value.width,
+      height: n.value.height,
+      poster: a.value
     }, [
-      a[0] || (a[0] = f("track", {
+      s[0] || (s[0] = y("track", {
         default: "",
         kind: "captions",
         srclang: "en"
       }, null, -1)),
-      f("source", {
-        src: o.value.src,
-        type: o.value.mimeType
-      }, null, 8, dt),
-      a[1] || (a[1] = _(" Your browser does not support the ", -1)),
-      a[2] || (a[2] = f("code", null, "video", -1)),
-      a[3] || (a[3] = _(" element. ", -1))
-    ], 8, ut));
+      y("source", {
+        src: n.value.src,
+        type: n.value.mimeType
+      }, null, 8, yt),
+      s[1] || (s[1] = C(" Your browser does not support the ", -1)),
+      s[2] || (s[2] = y("code", null, "video", -1)),
+      s[3] || (s[3] = C(" element. ", -1))
+    ], 8, ft));
   }
-}), pt = /* @__PURE__ */ p({
+}), gt = /* @__PURE__ */ v({
   __name: "GridBlock",
   props: {
     node: {},
     customRenderers: {},
     isDevMode: { type: Boolean }
   },
-  setup(e) {
-    const t = e, o = c(() => {
-      const n = t.node.attrs?.columns;
-      return Array.isArray(n) && n.length === 2 && n.every((a) => typeof a == "number" && Number.isFinite(a)) ? n : [6, 6];
-    }), s = {
+  setup(t) {
+    const e = t, n = c(() => {
+      const o = e.node.attrs?.columns;
+      return Array.isArray(o) && o.length === 2 && o.every((s) => typeof s == "number" && Number.isFinite(s)) ? o : [6, 6];
+    }), a = {
       display: "grid",
       gridTemplateColumns: "repeat(12, 1fr)",
       gap: "1rem"
     };
-    return (n, a) => (r(), l("div", {
+    return (o, s) => (r(), i("div", {
       "data-type": "gridBlock",
       class: "grid-block",
-      style: s
+      style: a
     }, [
-      (r(!0), l(E, null, h(e.node.content ?? [], (i, d) => (r(), l("div", {
+      (r(!0), i(k, null, M(t.node.content ?? [], (l, d) => (r(), i("div", {
         key: `gridColumn-${d}`,
         "data-type": "gridColumn",
         class: "grid-block__column",
-        style: w({ gridColumn: `span ${o.value[d] ?? 6}` })
+        style: w({ gridColumn: `span ${n.value[d] ?? 6}` })
       }, [
-        b(P, {
-          content: i.content,
-          "custom-renderers": e.customRenderers,
-          "is-dev-mode": e.isDevMode
+        h(U, {
+          content: l.content,
+          "custom-renderers": t.customRenderers,
+          "is-dev-mode": t.isDevMode
         }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
       ], 4))), 128))
     ]));
   }
-}), vt = /* @__PURE__ */ p({
+}), Ct = /* @__PURE__ */ v({
   __name: "Heading",
   props: {
     node: {}
   },
-  setup(e) {
-    const t = e, o = c(() => `h${t.node?.attrs?.level || 1}`);
-    return (s, n) => (r(), v(M(o.value), null, {
+  setup(t) {
+    const e = t, n = c(() => `h${e.node?.attrs?.level || 1}`);
+    return (a, o) => (r(), f(D(n.value), null, {
       default: B(() => [
-        N(s.$slots, "default")
+        S(a.$slots, "default")
       ]),
       _: 3
     }));
   }
-}), ft = {};
-function yt(e, t) {
-  return r(), l("li", null, [
-    N(e.$slots, "default")
+}), Et = {};
+function kt(t, e) {
+  return r(), i("li", null, [
+    S(t.$slots, "default")
   ]);
 }
-const _t = /* @__PURE__ */ U(ft, [["render", yt]]), gt = {};
-function Ct(e, t) {
-  return r(), l("ol", null, [
-    N(e.$slots, "default")
+const Dt = /* @__PURE__ */ F(Et, [["render", kt]]), Tt = {};
+function Mt(t, e) {
+  return r(), i("ol", null, [
+    S(t.$slots, "default")
   ]);
 }
-const Et = /* @__PURE__ */ U(gt, [["render", Ct]]), kt = /* @__PURE__ */ p({
+const ht = /* @__PURE__ */ F(Tt, [["render", Mt]]), bt = /* @__PURE__ */ v({
   __name: "Paragraph",
   props: {
     node: {}
   },
-  setup(e) {
-    const t = e, o = c(() => t.node?.attrs ?? {});
-    return (s, n) => (r(), l("p", {
-      style: w(o.value)
+  setup(t) {
+    const e = t, n = c(() => e.node?.attrs ?? {});
+    return (a, o) => (r(), i("p", {
+      style: w(n.value)
     }, [
-      N(s.$slots, "default")
+      S(a.$slots, "default")
     ], 4));
   }
-}), Dt = {};
-function Tt(e, t) {
-  return r(), l("blockquote", null, [
-    N(e.$slots, "default")
+}), St = {};
+function Nt(t, e) {
+  return r(), i("blockquote", null, [
+    S(t.$slots, "default")
   ]);
 }
-const Mt = /* @__PURE__ */ U(Dt, [["render", Tt]]), ht = ["aria-label", "aria-labelledby"], bt = { key: 0 }, Nt = ["colspan", "rowspan", "scope"], St = ["colspan", "rowspan"], wt = /* @__PURE__ */ p({
+const wt = /* @__PURE__ */ F(St, [["render", Nt]]), $t = ["aria-label", "aria-labelledby"], Ot = { key: 0 }, xt = ["colspan", "rowspan", "scope"], At = ["colspan", "rowspan"], It = /* @__PURE__ */ v({
   __name: "TableRenderer",
   props: {
     content: {},
@@ -618,55 +674,55 @@ const Mt = /* @__PURE__ */ U(Dt, [["render", Tt]]), ht = ["aria-label", "aria-la
     customRenderers: {},
     isDevMode: { type: Boolean }
   },
-  setup(e) {
-    const t = e, o = c(() => t.attrs?.caption || void 0), s = c(() => t.attrs?.ariaLabel || void 0), n = c(() => t.attrs?.ariaLabelledby || void 0), a = (d) => Number(d.attrs?.colspan || 1), i = (d) => Number(d.attrs?.rowspan || 1);
-    return (d, y) => (r(), l("table", {
-      "aria-label": s.value,
-      "aria-labelledby": n.value
+  setup(t) {
+    const e = t, n = c(() => e.attrs?.caption || void 0), a = c(() => e.attrs?.ariaLabel || void 0), o = c(() => e.attrs?.ariaLabelledby || void 0), s = (d) => Number(d.attrs?.colspan || 1), l = (d) => Number(d.attrs?.rowspan || 1);
+    return (d, p) => (r(), i("table", {
+      "aria-label": a.value,
+      "aria-labelledby": o.value
     }, [
-      o.value ? (r(), l("caption", bt, x(o.value), 1)) : T("", !0),
-      f("tbody", null, [
-        (r(!0), l(E, null, h(e.content, (u, g) => (r(), l("tr", {
-          key: `row-${g}`
+      n.value ? (r(), i("caption", Ot, O(n.value), 1)) : T("", !0),
+      y("tbody", null, [
+        (r(!0), i(k, null, M(t.content, (u, _) => (r(), i("tr", {
+          key: `row-${_}`
         }, [
-          (r(!0), l(E, null, h(u.content ?? [], (m, k) => (r(), l(E, {
-            key: `cell-${k}`
+          (r(!0), i(k, null, M(u.content ?? [], (m, g) => (r(), i(k, {
+            key: `cell-${g}`
           }, [
-            m.type === "tableHeader" ? (r(), l("th", {
+            m.type === "tableHeader" ? (r(), i("th", {
               key: 0,
-              colspan: a(m),
-              rowspan: i(m),
+              colspan: s(m),
+              rowspan: l(m),
               scope: m.attrs?.scope || void 0
             }, [
-              b(P, {
+              h(U, {
                 content: m.content ?? [],
-                "custom-renderers": e.customRenderers,
-                "is-dev-mode": e.isDevMode
+                "custom-renderers": t.customRenderers,
+                "is-dev-mode": t.isDevMode
               }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
-            ], 8, Nt)) : (r(), l("td", {
+            ], 8, xt)) : (r(), i("td", {
               key: 1,
-              colspan: a(m),
-              rowspan: i(m)
+              colspan: s(m),
+              rowspan: l(m)
             }, [
-              b(P, {
+              h(U, {
                 content: m.content ?? [],
-                "custom-renderers": e.customRenderers,
-                "is-dev-mode": e.isDevMode
+                "custom-renderers": t.customRenderers,
+                "is-dev-mode": t.isDevMode
               }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
-            ], 8, St))
+            ], 8, At))
           ], 64))), 128))
         ]))), 128))
       ])
-    ], 8, ht));
+    ], 8, $t));
   }
-}), $t = /* @__PURE__ */ p({
+}), Rt = /* @__PURE__ */ v({
   __name: "TextBlock",
   props: {
     text: {},
     marks: {}
   },
-  setup(e) {
-    const t = e, o = {
+  setup(t) {
+    const e = t, n = {
       bold: "strong",
       italic: "em",
       strike: "s",
@@ -674,29 +730,29 @@ const Mt = /* @__PURE__ */ U(Dt, [["render", Tt]]), ht = ["aria-label", "aria-la
       superscript: "sup",
       subscript: "sub",
       link: "a"
-    }, s = c(() => t.marks ?? []), n = c(() => s.value[0]), a = c(() => s.value.slice(1)), i = c(() => n.value ? o[n.value.type] : void 0), d = c(() => n.value?.attrs ?? {});
-    return (y, u) => {
-      const g = X("TextBlock", !0);
-      return i.value ? (r(), v(M(i.value), R($({ key: 0 }, d.value)), {
+    }, a = c(() => e.marks ?? []), o = c(() => a.value[0]), s = c(() => a.value.slice(1)), l = c(() => o.value ? n[o.value.type] : void 0), d = c(() => o.value?.attrs ?? {});
+    return (p, u) => {
+      const _ = ne("TextBlock", !0);
+      return l.value ? (r(), f(D(l.value), R($({ key: 0 }, d.value)), {
         default: B(() => [
-          b(g, {
-            text: e.text,
-            marks: a.value
+          h(_, {
+            text: t.text,
+            marks: s.value
           }, null, 8, ["text", "marks"])
         ]),
         _: 1
-      }, 16)) : (r(), l(E, { key: 1 }, [
-        _(x(e.text), 1)
+      }, 16)) : (r(), i(k, { key: 1 }, [
+        C(O(t.text), 1)
       ], 64));
     };
   }
-}), xt = /* @__PURE__ */ p({
+}), Lt = /* @__PURE__ */ v({
   __name: "UnknownBlock",
   props: {
     node: {}
   },
-  setup(e) {
-    const t = e, o = {
+  setup(t) {
+    const e = t, n = {
       backgroundColor: "#fff5f5",
       color: "#333",
       padding: "1rem",
@@ -705,102 +761,102 @@ const Mt = /* @__PURE__ */ U(Dt, [["render", Tt]]), ht = ["aria-label", "aria-la
       marginTop: "1rem",
       border: "1px solid #fc8181"
     };
-    return D(() => {
-      A() || console.warn(
-        `[DotCMSBlockEditorRenderer]: Unknown block type "${t.node?.type}". No renderer was found for it.`
+    return b(() => {
+      x() || console.warn(
+        `[DotCMSBlockEditorRenderer]: Unknown block type "${e.node?.type}". No renderer was found for it.`
       );
-    }), (s, n) => C(A)() ? (r(), l("div", {
+    }), (a, o) => E(x)() ? (r(), i("div", {
       key: 0,
       "data-testid": "unknown-block",
-      style: o
+      style: n
     }, [
-      n[0] || (n[0] = _(" Unknown block type: ", -1)),
-      f("strong", null, x(e.node?.type), 1)
+      o[0] || (o[0] = C(" Unknown block type: ", -1)),
+      y("strong", null, O(t.node?.type), 1)
     ])) : T("", !0);
   }
-}), At = { key: 4 }, It = { key: 5 }, P = /* @__PURE__ */ p({
+}), Bt = { key: 4 }, Pt = { key: 5 }, U = /* @__PURE__ */ v({
   __name: "BlockEditorBlock",
   props: {
     content: {},
     customRenderers: {},
     isDevMode: { type: Boolean }
   },
-  setup(e) {
-    const t = $e, o = {
-      [t.PARAGRAPH]: kt,
-      [t.HEADING]: vt,
-      [t.BULLET_LIST]: nt,
-      [t.ORDERED_LIST]: Et,
-      [t.LIST_ITEM]: _t,
-      [t.BLOCK_QUOTE]: Mt,
-      [t.CODE_BLOCK]: rt
-    }, s = {
-      [t.DOT_IMAGE]: it,
-      [t.DOT_VIDEO]: mt
-    }, n = (i) => o[i], a = (i) => s[i];
-    return (i, d) => {
-      const y = X("BlockEditorBlock", !0);
-      return r(!0), l(E, null, h(e.content ?? [], (u, g) => (r(), l(E, {
-        key: `${u.type}-${g}`
+  setup(t) {
+    const e = Ie, n = {
+      [e.PARAGRAPH]: bt,
+      [e.HEADING]: Ct,
+      [e.BULLET_LIST]: ct,
+      [e.ORDERED_LIST]: ht,
+      [e.LIST_ITEM]: Dt,
+      [e.BLOCK_QUOTE]: wt,
+      [e.CODE_BLOCK]: it
+    }, a = {
+      [e.DOT_IMAGE]: vt,
+      [e.DOT_VIDEO]: _t
+    }, o = (l) => n[l], s = (l) => a[l];
+    return (l, d) => {
+      const p = ne("BlockEditorBlock", !0);
+      return r(!0), i(k, null, M(t.content ?? [], (u, _) => (r(), i(k, {
+        key: `${u.type}-${_}`
       }, [
-        e.customRenderers && e.customRenderers[u.type] ? (r(), v(M(e.customRenderers[u.type]), {
+        t.customRenderers && t.customRenderers[u.type] ? (r(), f(D(t.customRenderers[u.type]), {
           key: 0,
           node: u
         }, {
           default: B(() => [
-            b(y, {
+            h(p, {
               content: u.content,
-              "custom-renderers": e.customRenderers,
-              "is-dev-mode": e.isDevMode
+              "custom-renderers": t.customRenderers,
+              "is-dev-mode": t.isDevMode
             }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
           ]),
           _: 2
-        }, 1032, ["node"])) : n(u.type) ? (r(), v(M(n(u.type)), {
+        }, 1032, ["node"])) : o(u.type) ? (r(), f(D(o(u.type)), {
           key: 1,
           node: u
         }, {
           default: B(() => [
-            b(y, {
+            h(p, {
               content: u.content,
-              "custom-renderers": e.customRenderers,
-              "is-dev-mode": e.isDevMode
+              "custom-renderers": t.customRenderers,
+              "is-dev-mode": t.isDevMode
             }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
           ]),
           _: 2
-        }, 1032, ["node"])) : u.type === C(t).TEXT ? (r(), v($t, {
+        }, 1032, ["node"])) : u.type === E(e).TEXT ? (r(), f(Rt, {
           key: 2,
           text: u.text,
           marks: u.marks
-        }, null, 8, ["text", "marks"])) : a(u.type) ? (r(), v(M(a(u.type)), {
+        }, null, 8, ["text", "marks"])) : s(u.type) ? (r(), f(D(s(u.type)), {
           key: 3,
           node: u
-        }, null, 8, ["node"])) : u.type === C(t).HARDBREAK ? (r(), l("br", At)) : u.type === C(t).HORIZONTAL_RULE ? (r(), l("hr", It)) : u.type === C(t).TABLE ? (r(), v(wt, {
+        }, null, 8, ["node"])) : u.type === E(e).HARDBREAK ? (r(), i("br", Bt)) : u.type === E(e).HORIZONTAL_RULE ? (r(), i("hr", Pt)) : u.type === E(e).TABLE ? (r(), f(It, {
           key: 6,
           content: u.content ?? [],
           attrs: u.attrs,
-          "custom-renderers": e.customRenderers,
-          "is-dev-mode": e.isDevMode
-        }, null, 8, ["content", "attrs", "custom-renderers", "is-dev-mode"])) : u.type === C(t).GRID_BLOCK ? (r(), v(pt, {
+          "custom-renderers": t.customRenderers,
+          "is-dev-mode": t.isDevMode
+        }, null, 8, ["content", "attrs", "custom-renderers", "is-dev-mode"])) : u.type === E(e).GRID_BLOCK ? (r(), f(gt, {
           key: 7,
           node: u,
-          "custom-renderers": e.customRenderers,
-          "is-dev-mode": e.isDevMode
-        }, null, 8, ["node", "custom-renderers", "is-dev-mode"])) : u.type === C(t).DOT_CONTENT ? (r(), v(ct, {
+          "custom-renderers": t.customRenderers,
+          "is-dev-mode": t.isDevMode
+        }, null, 8, ["node", "custom-renderers", "is-dev-mode"])) : u.type === E(e).DOT_CONTENT ? (r(), f(mt, {
           key: 8,
           node: u,
-          "custom-renderers": e.customRenderers,
-          "is-dev-mode": e.isDevMode
-        }, null, 8, ["node", "custom-renderers", "is-dev-mode"])) : (r(), v(xt, {
+          "custom-renderers": t.customRenderers,
+          "is-dev-mode": t.isDevMode
+        }, null, 8, ["node", "custom-renderers", "is-dev-mode"])) : (r(), f(Lt, {
           key: 9,
           node: u
         }, null, 8, ["node"]))
       ], 64))), 128);
     };
   }
-}), Ot = {
+}), Ut = {
   key: 0,
   "data-testid": "invalid-blocks-message"
-}, Kt = /* @__PURE__ */ p({
+}, tn = /* @__PURE__ */ v({
   __name: "DotCMSBlockEditorRenderer",
   props: {
     blocks: {},
@@ -809,34 +865,48 @@ const Mt = /* @__PURE__ */ U(Dt, [["render", Tt]]), ht = ["aria-label", "aria-la
     customRenderers: {},
     isDevMode: { type: Boolean, default: !1 }
   },
-  setup(e) {
-    const t = e, o = c(() => Ne(t.blocks)), s = c(() => {
-      const n = o.value.error;
-      return n && console.error(n), n;
-    });
-    return (n, a) => s.value && e.isDevMode ? (r(), l("div", Ot, x(s.value), 1)) : s.value ? T("", !0) : (r(), l("div", {
+  setup(t) {
+    const e = t, n = c(() => {
+      if (!e.customRenderers)
+        return;
+      const s = {};
+      for (const l of Object.keys(e.customRenderers))
+        s[l] = j(e.customRenderers[l]);
+      return te(s);
+    }), a = c(() => Oe(e.blocks)), o = c(() => a.value.error);
+    return V(
+      o,
+      (s) => {
+        s && console.error(s);
+      },
+      { immediate: !0 }
+    ), (s, l) => o.value && t.isDevMode ? (r(), i("div", Ut, O(o.value), 1)) : o.value ? T("", !0) : (r(), i("div", {
       key: 1,
-      class: Y(e.className),
-      style: w(e.style),
+      class: W(t.className),
+      style: w(t.style),
       "data-testid": "dot-block-editor-container"
     }, [
-      b(P, {
-        content: e.blocks?.content,
-        "custom-renderers": e.customRenderers,
-        "is-dev-mode": e.isDevMode
+      h(U, {
+        content: t.blocks?.content,
+        "custom-renderers": n.value,
+        "is-dev-mode": t.isDevMode
       }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
     ], 6));
   }
 });
 export {
-  J as DOTCMS_PAGE_CONTEXT,
-  Kt as DotCMSBlockEditorRenderer,
-  jt as DotCMSEditableText,
-  Yt as DotCMSLayoutBody,
-  Ht as DotCMSShow,
-  Ie as provideDotCMSPageContext,
-  xe as toPlain,
-  I as useDotCMSPageContext,
-  Ae as useDotCMSShowWhen,
-  Gt as useEditableDotCMSPage
+  se as DOTCMS_CLIENT,
+  re as DOTCMS_PAGE_CONTEXT,
+  tn as DotCMSBlockEditorRenderer,
+  en as DotCMSEditableText,
+  Zt as DotCMSLayoutBody,
+  Jt as DotCMSShow,
+  Qt as createDotCMSImageLoader,
+  qt as createDotCMSVue,
+  Pe as provideDotCMSPageContext,
+  Re as toPlain,
+  zt as useDotCMSClient,
+  A as useDotCMSPageContext,
+  Le as useDotCMSShowWhen,
+  Xt as useEditableDotCMSPage
 };