@dotcms/vue 1.5.5-next.2350

package/index.js

@@ -0,0 +1,912 @@
+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 e.set(o, d), o.forEach((p) => d.push(n(p))), d;
+    }
+    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 n(t);
+}
+function Xt(t) {
+  const e = ue(L(t));
+  let n, a;
+  const o = (s) => {
+    if (n?.(), n = void 0, !x())
+      return;
+    if (!s) {
+      console.warn("[useEditableDotCMSPage]: No page response provided");
+      return;
+    }
+    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;
+      }
+    ));
+  }), K(() => {
+    n?.(), a?.();
+  }), e;
+}
+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 Jt = /* @__PURE__ */ v({
+  __name: "DotCMSShow",
+  props: {
+    when: { default: P.EDIT }
+  },
+  setup(t) {
+    const e = t, n = Le(() => e.when);
+    return (a, o) => E(n) ? S(a.$slots, "default", { key: 0 }) : T("", !0);
+  }
+}), re = /* @__PURE__ */ Symbol("DotCMSPageContext");
+function Pe(t) {
+  de(re, t);
+}
+const Ue = {
+  pageAsset: {},
+  mode: "production",
+  userComponents: {},
+  isDevMode: !1,
+  isAnalyticsActive: !1,
+  slots: {}
+};
+function A() {
+  return ee(
+    re,
+    c(() => Ue)
+  );
+}
+const Ve = {
+  key: 0,
+  "data-testid": "error-message",
+  style: { padding: "1rem", border: "1px solid #e0e0e0", borderRadius: "4px" }
+}, Fe = /* @__PURE__ */ v({
+  __name: "ErrorMessage",
+  setup(t) {
+    const e = A(), n = c(() => e.value.isDevMode);
+    return b(() => {
+      console.warn("Missing required layout.body property in page");
+    }), (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),
+      y("p", { style: { margin: 0, color: "#666" } }, " Make sure the page asset is properly loaded and includes a layout configuration. ", -1)
+    ])])) : T("", !0);
+  }
+}), Z = "contentlet-";
+function Ge() {
+  const t = N(!1), e = () => {
+    t.value = Q();
+  };
+  return b(() => {
+    t.value = Q(), window.addEventListener(J, e);
+  }), K(() => {
+    window.removeEventListener(J, e);
+  }), t;
+}
+function He(t) {
+  const e = x()?.mode;
+  return e ? e === P.EDIT : t === Ee;
+}
+function Ye(t) {
+  return c(() => He(L(t)));
+}
+const je = /* @__PURE__ */ v({
+  __name: "ContainerNotFound",
+  props: {
+    identifier: {}
+  },
+  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(E(oe))
+    }, " This container with identifier " + O(t.identifier) + " was not found. ", 5)) : T("", !0);
+  }
+}), Ke = /* @__PURE__ */ v({
+  inheritAttrs: !1,
+  __name: "EmptyContainer",
+  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 We(t) {
+  const e = N(!1);
+  return b(() => {
+    const n = t()?.getBoundingClientRect().height ?? 0;
+    e.value = n > 0;
+  }), e;
+}
+const qe = "dotcms-contentlet", ze = {
+  key: 1,
+  "data-testid": "no-component"
+}, Xe = /* @__PURE__ */ v({
+  __name: "FallbackComponent",
+  props: {
+    contentlet: {},
+    userNoComponent: {}
+  },
+  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);
+  }
+}), Qe = /* @__PURE__ */ v({
+  __name: "Contentlet",
+  props: {
+    contentlet: {},
+    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"
+    } : 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 (m, g) => (r(), i("div", $(l.value, {
+      class: E(qe),
+      style: d.value
+    }), [
+      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));
+  }
+}), Je = /* @__PURE__ */ v({
+  __name: "Container",
+  props: {
+    container: {}
+  },
+  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(
+      () => n.value.isDevMode ? JSON.stringify(a.value) : ""
+    );
+    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(), f(je, {
+      key: 0,
+      identifier: t.container.identifier
+    }, null, 8, ["identifier"]));
+  }
+}), Ze = /* @__PURE__ */ v({
+  __name: "Column",
+  props: {
+    column: {}
+  },
+  setup(t) {
+    const e = t, n = c(() => ({
+      gridColumnStart: e.column.leftOffset,
+      gridColumnEnd: e.column.leftOffset + e.column.width
+    }));
+    return (a, o) => (r(), i("div", {
+      "data-dot": "column",
+      style: w(n.value)
+    }, [
+      y("div", {
+        class: W(t.column.styleClass)
+      }, [
+        (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));
+  }
+}), et = ["id"], tt = /* @__PURE__ */ v({
+  __name: "Row",
+  props: {
+    row: {},
+    index: {}
+  },
+  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 (s, l) => (r(), i("div", {
+      id: a.value,
+      class: W(n.value)
+    }, [
+      y("div", {
+        class: "dotcms-row",
+        "data-dot-object": "row",
+        style: o
+      }, [
+        (r(!0), i(k, null, M(t.row.columns, (d, p) => (r(), f(Ze, {
+          key: p,
+          column: d
+        }, null, 8, ["column"]))), 128))
+      ])
+    ], 10, et));
+  }
+}), Zt = /* @__PURE__ */ v({
+  __name: "DotCMSLayoutBody",
+  props: {
+    page: {},
+    components: {},
+    mode: { default: "production" }
+  },
+  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: e.page,
+        mode: e.mode,
+        userComponents: o.value,
+        isDevMode: n.value,
+        isAnalyticsActive: a.value,
+        slots: l.value
+      }))
+    );
+    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 }));
+  }
+}), Y = {
+  ...we,
+  licenseKey: "gpl"
+  // Self-hosted GPL license.
+}, nt = {
+  full: {
+    ...Y,
+    ...H.full
+  },
+  plain: {
+    ...Y,
+    ...H.plain
+  },
+  minimal: {
+    ...Y,
+    ...H.minimal
+  }
+}, ot = ["innerHTML"], st = {
+  key: 1,
+  style: { outline: "2px solid #006ce7", borderRadius: "4px" }
+}, en = /* @__PURE__ */ v({
+  __name: "DotCMSEditableText",
+  props: {
+    contentlet: {},
+    fieldName: {},
+    format: { default: "text" },
+    mode: { default: "plain" }
+  },
+  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],
+      () => {
+        s.value = e.contentlet?.[e.fieldName] || "", n.value?.setContent(s.value, { format: e.format });
+      }
+    );
+    const d = (m, g) => {
+      n.value = g;
+    }, p = (m) => {
+      if (Number(
+        e.contentlet.onNumberOfPages ?? 1
+      ) <= 1 || n.value?.hasFocus())
+        return;
+      m.stopPropagation(), m.preventDefault();
+      const { inode: I, languageId: G } = e.contentlet;
+      X({
+        action: z.COPY_CONTENTLET_INLINE_EDITING,
+        payload: {
+          dataset: { inode: I, language: G, fieldName: e.fieldName }
+        }
+      });
+    }, u = () => {
+      const m = n.value?.getContent({ format: e.format }) || "";
+      if (!n.value?.isDirty() || m === s.value)
+        return;
+      const { inode: g, languageId: I } = e.contentlet;
+      X({
+        action: z.UPDATE_CONTENTLET_INLINE_EDITING,
+        payload: {
+          content: m,
+          dataset: { inode: g, langId: I, fieldName: e.fieldName }
+        }
+      });
+    }, _ = ({ data: m }) => {
+      const { name: g, payload: I } = m ?? {};
+      if (g !== Ae.UVE_COPY_CONTENTLET_INLINE_EDITING_SUCCESS)
+        return;
+      const { oldInode: G, inode: ae, fieldName: ce } = I ?? {}, q = e.contentlet.inode;
+      (q === G || q === ae) && ce === e.fieldName && n.value?.focus();
+    };
+    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 !== P.EDIT) {
+        console.warn("[DotCMSEditableText]: TinyMCE is not available in the current mode");
+        return;
+      }
+      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: l.value,
+        "initial-value": s.value,
+        onInit: d,
+        onMousedown: p,
+        onFocusout: u
+      }, null, 8, ["tinymce-script-src", "init", "initial-value"])
+    ])) : (r(), i("span", {
+      key: 0,
+      innerHTML: s.value
+    }, null, 8, ot));
+  }
+}), 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 ct = /* @__PURE__ */ F(rt, [["render", at]]), lt = ["data-language"], it = /* @__PURE__ */ v({
+  __name: "CodeBlock",
+  props: {
+    node: {}
+  },
+  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, lt));
+  }
+}), ut = /* @__PURE__ */ v({
+  __name: "NoComponentProvided",
+  props: {
+    contentType: {}
+  },
+  setup(t) {
+    const e = {
+      backgroundColor: "#fffaf0",
+      color: "#333",
+      padding: "1rem",
+      borderRadius: "0.5rem",
+      marginBottom: "1rem",
+      marginTop: "1rem",
+      border: "1px solid #ed8936"
+    }, n = { color: "#c05621" };
+    return (a, o) => (r(), i("div", {
+      "data-testid": "no-component-provided",
+      style: e
+    }, [
+      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: n
+      }, " Block Editor Custom Renderers Documentation "),
+      o[4] || (o[4] = C(" for guidance. ", -1))
+    ]));
+  }
+}), 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(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": o.value
+    }, null, 8, ["content-type"])) : l.value === "render" ? (r(), f(D(s.value), {
+      key: 1,
+      node: t.node
+    }, null, 8, ["node"])) : T("", !0);
+  }
+}), pt = ["alt", "src"], vt = /* @__PURE__ */ v({
+  __name: "DotImage",
+  props: {
+    node: {}
+  },
+  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 (s, l) => (r(), i("figure", {
+      style: w(a.value)
+    }, [
+      y("img", {
+        alt: n.value.alt,
+        src: n.value.src,
+        style: w(o.value)
+      }, null, 12, pt)
+    ], 4));
+  }
+}), ft = ["width", "height", "poster"], yt = ["src", "type"], _t = /* @__PURE__ */ v({
+  __name: "DotVideo",
+  props: {
+    node: {}
+  },
+  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: n.value.width,
+      height: n.value.height,
+      poster: a.value
+    }, [
+      s[0] || (s[0] = y("track", {
+        default: "",
+        kind: "captions",
+        srclang: "en"
+      }, null, -1)),
+      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));
+  }
+}), gt = /* @__PURE__ */ v({
+  __name: "GridBlock",
+  props: {
+    node: {},
+    customRenderers: {},
+    isDevMode: { type: Boolean }
+  },
+  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 (o, s) => (r(), i("div", {
+      "data-type": "gridBlock",
+      class: "grid-block",
+      style: a
+    }, [
+      (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 ${n.value[d] ?? 6}` })
+      }, [
+        h(U, {
+          content: l.content,
+          "custom-renderers": t.customRenderers,
+          "is-dev-mode": t.isDevMode
+        }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+      ], 4))), 128))
+    ]));
+  }
+}), Ct = /* @__PURE__ */ v({
+  __name: "Heading",
+  props: {
+    node: {}
+  },
+  setup(t) {
+    const e = t, n = c(() => `h${e.node?.attrs?.level || 1}`);
+    return (a, o) => (r(), f(D(n.value), null, {
+      default: B(() => [
+        S(a.$slots, "default")
+      ]),
+      _: 3
+    }));
+  }
+}), Et = {};
+function kt(t, e) {
+  return r(), i("li", null, [
+    S(t.$slots, "default")
+  ]);
+}
+const Dt = /* @__PURE__ */ F(Et, [["render", kt]]), Tt = {};
+function Mt(t, e) {
+  return r(), i("ol", null, [
+    S(t.$slots, "default")
+  ]);
+}
+const ht = /* @__PURE__ */ F(Tt, [["render", Mt]]), bt = /* @__PURE__ */ v({
+  __name: "Paragraph",
+  props: {
+    node: {}
+  },
+  setup(t) {
+    const e = t, n = c(() => e.node?.attrs ?? {});
+    return (a, o) => (r(), i("p", {
+      style: w(n.value)
+    }, [
+      S(a.$slots, "default")
+    ], 4));
+  }
+}), St = {};
+function Nt(t, e) {
+  return r(), i("blockquote", null, [
+    S(t.$slots, "default")
+  ]);
+}
+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: {},
+    attrs: {},
+    customRenderers: {},
+    isDevMode: { type: Boolean }
+  },
+  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
+    }, [
+      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), i(k, null, M(u.content ?? [], (m, g) => (r(), i(k, {
+            key: `cell-${g}`
+          }, [
+            m.type === "tableHeader" ? (r(), i("th", {
+              key: 0,
+              colspan: s(m),
+              rowspan: l(m),
+              scope: m.attrs?.scope || void 0
+            }, [
+              h(U, {
+                content: m.content ?? [],
+                "custom-renderers": t.customRenderers,
+                "is-dev-mode": t.isDevMode
+              }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+            ], 8, xt)) : (r(), i("td", {
+              key: 1,
+              colspan: s(m),
+              rowspan: l(m)
+            }, [
+              h(U, {
+                content: m.content ?? [],
+                "custom-renderers": t.customRenderers,
+                "is-dev-mode": t.isDevMode
+              }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+            ], 8, At))
+          ], 64))), 128))
+        ]))), 128))
+      ])
+    ], 8, $t));
+  }
+}), Rt = /* @__PURE__ */ v({
+  __name: "TextBlock",
+  props: {
+    text: {},
+    marks: {}
+  },
+  setup(t) {
+    const e = t, n = {
+      bold: "strong",
+      italic: "em",
+      strike: "s",
+      underline: "u",
+      superscript: "sup",
+      subscript: "sub",
+      link: "a"
+    }, 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(() => [
+          h(_, {
+            text: t.text,
+            marks: s.value
+          }, null, 8, ["text", "marks"])
+        ]),
+        _: 1
+      }, 16)) : (r(), i(k, { key: 1 }, [
+        C(O(t.text), 1)
+      ], 64));
+    };
+  }
+}), Lt = /* @__PURE__ */ v({
+  __name: "UnknownBlock",
+  props: {
+    node: {}
+  },
+  setup(t) {
+    const e = t, n = {
+      backgroundColor: "#fff5f5",
+      color: "#333",
+      padding: "1rem",
+      borderRadius: "0.5rem",
+      marginBottom: "1rem",
+      marginTop: "1rem",
+      border: "1px solid #fc8181"
+    };
+    return b(() => {
+      x() || console.warn(
+        `[DotCMSBlockEditorRenderer]: Unknown block type "${e.node?.type}". No renderer was found for it.`
+      );
+    }), (a, o) => E(x)() ? (r(), i("div", {
+      key: 0,
+      "data-testid": "unknown-block",
+      style: n
+    }, [
+      o[0] || (o[0] = C(" Unknown block type: ", -1)),
+      y("strong", null, O(t.node?.type), 1)
+    ])) : T("", !0);
+  }
+}), Bt = { key: 4 }, Pt = { key: 5 }, U = /* @__PURE__ */ v({
+  __name: "BlockEditorBlock",
+  props: {
+    content: {},
+    customRenderers: {},
+    isDevMode: { type: Boolean }
+  },
+  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}-${_}`
+      }, [
+        t.customRenderers && t.customRenderers[u.type] ? (r(), f(D(t.customRenderers[u.type]), {
+          key: 0,
+          node: u
+        }, {
+          default: B(() => [
+            h(p, {
+              content: u.content,
+              "custom-renderers": t.customRenderers,
+              "is-dev-mode": t.isDevMode
+            }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+          ]),
+          _: 2
+        }, 1032, ["node"])) : o(u.type) ? (r(), f(D(o(u.type)), {
+          key: 1,
+          node: u
+        }, {
+          default: B(() => [
+            h(p, {
+              content: u.content,
+              "custom-renderers": t.customRenderers,
+              "is-dev-mode": t.isDevMode
+            }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+          ]),
+          _: 2
+        }, 1032, ["node"])) : u.type === E(e).TEXT ? (r(), f(Rt, {
+          key: 2,
+          text: u.text,
+          marks: u.marks
+        }, null, 8, ["text", "marks"])) : s(u.type) ? (r(), f(D(s(u.type)), {
+          key: 3,
+          node: u
+        }, 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": 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": 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": 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);
+    };
+  }
+}), Ut = {
+  key: 0,
+  "data-testid": "invalid-blocks-message"
+}, tn = /* @__PURE__ */ v({
+  __name: "DotCMSBlockEditorRenderer",
+  props: {
+    blocks: {},
+    style: {},
+    className: {},
+    customRenderers: {},
+    isDevMode: { type: Boolean, default: !1 }
+  },
+  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: W(t.className),
+      style: w(t.style),
+      "data-testid": "dot-block-editor-container"
+    }, [
+      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 {
+  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
+};