@dotcms/vue 1.5.5

package/index.js

@@ -0,0 +1,842 @@
+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)) {
+      const d = [];
+      return t.set(n, d), n.forEach((y) => d.push(o(y))), 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;
+  };
+  return o(e);
+}
+function Gt(e) {
+  const t = re(e);
+  let o, s;
+  return D(() => {
+    if (!A())
+      return;
+    if (!e) {
+      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;
+      }
+    ));
+  }), H(() => {
+    o?.(), s?.();
+  }), t;
+}
+function Ae(e) {
+  const t = S(!1);
+  return D(() => {
+    t.value = A()?.mode === e;
+  }), se(t);
+}
+const Ht = /* @__PURE__ */ p({
+  __name: "DotCMSShow",
+  props: {
+    when: { default: L.EDIT }
+  },
+  setup(e) {
+    const o = Ae(e.when);
+    return (s, n) => C(o) ? N(s.$slots, "default", { key: 0 }) : T("", !0);
+  }
+}), J = /* @__PURE__ */ Symbol("DotCMSPageContext");
+function Ie(e) {
+  ae(J, e);
+}
+const Oe = {
+  pageAsset: {},
+  mode: "production",
+  userComponents: {},
+  isDevMode: !1,
+  isAnalyticsActive: !1
+};
+function I() {
+  return ce(
+    J,
+    c(() => Oe)
+  );
+}
+const Re = {
+  key: 0,
+  "data-testid": "error-message",
+  style: { padding: "1rem", border: "1px solid #e0e0e0", borderRadius: "4px" }
+}, Be = /* @__PURE__ */ p({
+  __name: "ErrorMessage",
+  setup(e) {
+    const t = I(), o = c(() => t.value.isDevMode);
+    return D(() => {
+      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. ")
+      ], -1),
+      f("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();
+  };
+  return D(() => {
+    e.value = q(), window.addEventListener(z, t);
+  }), H(() => {
+    window.removeEventListener(z, t);
+  }), e;
+}
+function Pe(e) {
+  const t = A()?.mode;
+  return t ? t === L.EDIT : e === ye;
+}
+function Ue(e) {
+  return c(() => Pe(le(e)));
+}
+const Ve = /* @__PURE__ */ p({
+  __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", {
+      key: 0,
+      "data-testid": "container-not-found",
+      style: w(C(Q))
+    }, " This container with identifier " + x(e.identifier) + " was not found. ", 5)) : T("", !0);
+  }
+}), Fe = /* @__PURE__ */ p({
+  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", {
+        "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;
+}
+const He = "dotcms-contentlet", Ye = {
+  key: 1,
+  "data-testid": "no-component"
+}, je = /* @__PURE__ */ p({
+  __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))
+      ]))
+    ], 64)) : T("", !0);
+  }
+}), Ke = /* @__PURE__ */ p({
+  __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),
+      "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]
+    );
+    return (g, m) => (r(), l("div", $(i.value, {
+      class: C(He),
+      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
+      }, null, 8, ["user-no-component", "contentlet"]))
+    ], 16));
+  }
+}), We = /* @__PURE__ */ p({
+  __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) : {}
+    ), d = c(
+      () => o.value.isDevMode ? JSON.stringify(s.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,
+        container: d.value
+      }, null, 8, ["contentlet", "container"]))), 128))
+    ], 16)) : (r(), v(Ve, {
+      key: 0,
+      identifier: e.container.identifier
+    }, null, 8, ["identifier"]));
+  }
+}), qe = /* @__PURE__ */ p({
+  __name: "Column",
+  props: {
+    column: {}
+  },
+  setup(e) {
+    const t = e, o = c(() => ({
+      gridColumnStart: t.column.leftOffset,
+      gridColumnEnd: t.column.leftOffset + t.column.width
+    }));
+    return (s, n) => (r(), l("div", {
+      "data-dot": "column",
+      style: w(o.value)
+    }, [
+      f("div", {
+        class: Y(e.column.styleClass)
+      }, [
+        (r(!0), l(E, null, h(e.column.containers, (a) => (r(), v(We, {
+          key: `${a.identifier}-${a.uuid}`,
+          container: a
+        }, null, 8, ["container"]))), 128))
+      ], 2)
+    ], 4));
+  }
+}), ze = ["id"], Xe = /* @__PURE__ */ p({
+  __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 = {
+      display: "grid",
+      gridTemplateColumns: "repeat(12, 1fr)",
+      gap: "1rem"
+    };
+    return (a, i) => (r(), l("div", {
+      id: s.value,
+      class: Y(o.value)
+    }, [
+      f("div", {
+        class: "dotcms-row",
+        "data-dot-object": "row",
+        style: n
+      }, [
+        (r(!0), l(E, null, h(e.row.columns, (d, y) => (r(), v(qe, {
+          key: y,
+          column: d
+        }, null, 8, ["column"]))), 128))
+      ])
+    ], 10, ze));
+  }
+}), Yt = /* @__PURE__ */ p({
+  __name: "DotCMSLayoutBody",
+  props: {
+    page: {},
+    components: {},
+    mode: { default: "production" }
+  },
+  setup(e) {
+    const t = e, o = Ue(() => t.mode), s = Le();
+    Ie(
+      c(() => ({
+        pageAsset: t.page,
+        mode: t.mode,
+        userComponents: t.components,
+        isDevMode: o.value,
+        isAnalyticsActive: s.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 }));
+  }
+}), G = {
+  ...he,
+  licenseKey: "gpl"
+  // Self-hosted GPL license.
+}, Qe = {
+  full: {
+    ...G,
+    ...F.full
+  },
+  plain: {
+    ...G,
+    ...F.plain
+  },
+  minimal: {
+    ...G,
+    ...F.minimal
+  }
+}, Je = ["innerHTML"], Ze = {
+  key: 1,
+  style: { outline: "2px solid #006ce7", borderRadius: "4px" }
+}, jt = /* @__PURE__ */ p({
+  __name: "DotCMSEditableText",
+  props: {
+    contentlet: {},
+    fieldName: {},
+    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],
+      () => {
+        a.value = t.contentlet?.[t.fieldName] || "", o.value?.setContent(a.value, { format: t.format });
+      }
+    );
+    const d = (m, k) => {
+      o.value = k;
+    }, y = (m) => {
+      if (Number(
+        t.contentlet.onNumberOfPages ?? 1
+      ) <= 1 || o.value?.hasFocus())
+        return;
+      m.stopPropagation(), m.preventDefault();
+      const { inode: O, languageId: V } = t.contentlet;
+      W({
+        action: K.COPY_CONTENTLET_INLINE_EDITING,
+        payload: {
+          dataset: { inode: O, language: V, fieldName: t.fieldName }
+        }
+      });
+    }, u = () => {
+      const m = o.value?.getContent({ format: t.format }) || "";
+      if (!o.value?.isDirty() || m === a.value)
+        return;
+      const { inode: k, languageId: O } = t.contentlet;
+      W({
+        action: K.UPDATE_CONTENTLET_INLINE_EDITING,
+        payload: {
+          content: m,
+          dataset: { inode: k, langId: O, fieldName: t.fieldName }
+        }
+      });
+    }, g = ({ data: m }) => {
+      const { name: k, payload: O } = m ?? {};
+      if (k !== we.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();
+    };
+    return D(() => {
+      const m = A();
+      if (n.value = m?.mode === L.EDIT && !!m?.dotCMSHost?.length, !t.contentlet || !t.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) {
+        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,
+        inline: !0,
+        init: i.value,
+        "initial-value": a.value,
+        onInit: d,
+        onMousedown: y,
+        onFocusout: u
+      }, null, 8, ["tinymce-script-src", "init", "initial-value"])
+    ])) : (r(), l("span", {
+      key: 0,
+      innerHTML: a.value
+    }, null, 8, Je));
+  }
+}), 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")
+  ]);
+}
+const nt = /* @__PURE__ */ U(et, [["render", tt]]), ot = ["data-language"], rt = /* @__PURE__ */ p({
+  __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")
+      ])
+    ], 8, ot));
+  }
+}), st = /* @__PURE__ */ p({
+  __name: "NoComponentProvided",
+  props: {
+    contentType: {}
+  },
+  setup(e) {
+    const t = {
+      backgroundColor: "#fffaf0",
+      color: "#333",
+      padding: "1rem",
+      borderRadius: "0.5rem",
+      marginBottom: "1rem",
+      marginTop: "1rem",
+      border: "1px solid #ed8936"
+    }, o = { color: "#c05621" };
+    return (s, n) => (r(), l("div", {
+      "data-testid": "no-component-provided",
+      style: t
+    }, [
+      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", {
+        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))
+    ]));
+  }
+}), 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({
+  __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, {
+      key: 0,
+      "content-type": n.value
+    }, null, 8, ["content-type"])) : i.value === "render" ? (r(), v(M(a.value), {
+      key: 1,
+      node: e.node
+    }, null, 8, ["node"])) : T("", !0);
+  }
+}), lt = ["alt", "src"], it = /* @__PURE__ */ p({
+  __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
+    );
+    return (a, i) => (r(), l("figure", {
+      style: w(s.value)
+    }, [
+      f("img", {
+        alt: o.value.alt,
+        src: o.value.src,
+        style: w(n.value)
+      }, null, 12, lt)
+    ], 4));
+  }
+}), ut = ["width", "height", "poster"], dt = ["src", "type"], mt = /* @__PURE__ */ p({
+  __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", {
+      controls: "",
+      preload: "metadata",
+      width: o.value.width,
+      height: o.value.height,
+      poster: s.value
+    }, [
+      a[0] || (a[0] = f("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));
+  }
+}), pt = /* @__PURE__ */ p({
+  __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 = {
+      display: "grid",
+      gridTemplateColumns: "repeat(12, 1fr)",
+      gap: "1rem"
+    };
+    return (n, a) => (r(), l("div", {
+      "data-type": "gridBlock",
+      class: "grid-block",
+      style: s
+    }, [
+      (r(!0), l(E, null, h(e.node.content ?? [], (i, d) => (r(), l("div", {
+        key: `gridColumn-${d}`,
+        "data-type": "gridColumn",
+        class: "grid-block__column",
+        style: w({ gridColumn: `span ${o.value[d] ?? 6}` })
+      }, [
+        b(P, {
+          content: i.content,
+          "custom-renderers": e.customRenderers,
+          "is-dev-mode": e.isDevMode
+        }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+      ], 4))), 128))
+    ]));
+  }
+}), vt = /* @__PURE__ */ p({
+  __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, {
+      default: B(() => [
+        N(s.$slots, "default")
+      ]),
+      _: 3
+    }));
+  }
+}), ft = {};
+function yt(e, t) {
+  return r(), l("li", null, [
+    N(e.$slots, "default")
+  ]);
+}
+const _t = /* @__PURE__ */ U(ft, [["render", yt]]), gt = {};
+function Ct(e, t) {
+  return r(), l("ol", null, [
+    N(e.$slots, "default")
+  ]);
+}
+const Et = /* @__PURE__ */ U(gt, [["render", Ct]]), kt = /* @__PURE__ */ p({
+  __name: "Paragraph",
+  props: {
+    node: {}
+  },
+  setup(e) {
+    const t = e, o = c(() => t.node?.attrs ?? {});
+    return (s, n) => (r(), l("p", {
+      style: w(o.value)
+    }, [
+      N(s.$slots, "default")
+    ], 4));
+  }
+}), Dt = {};
+function Tt(e, t) {
+  return r(), l("blockquote", null, [
+    N(e.$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({
+  __name: "TableRenderer",
+  props: {
+    content: {},
+    attrs: {},
+    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
+    }, [
+      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}`
+        }, [
+          (r(!0), l(E, null, h(u.content ?? [], (m, k) => (r(), l(E, {
+            key: `cell-${k}`
+          }, [
+            m.type === "tableHeader" ? (r(), l("th", {
+              key: 0,
+              colspan: a(m),
+              rowspan: i(m),
+              scope: m.attrs?.scope || void 0
+            }, [
+              b(P, {
+                content: m.content ?? [],
+                "custom-renderers": e.customRenderers,
+                "is-dev-mode": e.isDevMode
+              }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+            ], 8, Nt)) : (r(), l("td", {
+              key: 1,
+              colspan: a(m),
+              rowspan: i(m)
+            }, [
+              b(P, {
+                content: m.content ?? [],
+                "custom-renderers": e.customRenderers,
+                "is-dev-mode": e.isDevMode
+              }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+            ], 8, St))
+          ], 64))), 128))
+        ]))), 128))
+      ])
+    ], 8, ht));
+  }
+}), $t = /* @__PURE__ */ p({
+  __name: "TextBlock",
+  props: {
+    text: {},
+    marks: {}
+  },
+  setup(e) {
+    const t = e, o = {
+      bold: "strong",
+      italic: "em",
+      strike: "s",
+      underline: "u",
+      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)), {
+        default: B(() => [
+          b(g, {
+            text: e.text,
+            marks: a.value
+          }, null, 8, ["text", "marks"])
+        ]),
+        _: 1
+      }, 16)) : (r(), l(E, { key: 1 }, [
+        _(x(e.text), 1)
+      ], 64));
+    };
+  }
+}), xt = /* @__PURE__ */ p({
+  __name: "UnknownBlock",
+  props: {
+    node: {}
+  },
+  setup(e) {
+    const t = e, o = {
+      backgroundColor: "#fff5f5",
+      color: "#333",
+      padding: "1rem",
+      borderRadius: "0.5rem",
+      marginBottom: "1rem",
+      marginTop: "1rem",
+      border: "1px solid #fc8181"
+    };
+    return D(() => {
+      A() || console.warn(
+        `[DotCMSBlockEditorRenderer]: Unknown block type "${t.node?.type}". No renderer was found for it.`
+      );
+    }), (s, n) => C(A)() ? (r(), l("div", {
+      key: 0,
+      "data-testid": "unknown-block",
+      style: o
+    }, [
+      n[0] || (n[0] = _(" Unknown block type: ", -1)),
+      f("strong", null, x(e.node?.type), 1)
+    ])) : T("", !0);
+  }
+}), At = { key: 4 }, It = { key: 5 }, P = /* @__PURE__ */ p({
+  __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}`
+      }, [
+        e.customRenderers && e.customRenderers[u.type] ? (r(), v(M(e.customRenderers[u.type]), {
+          key: 0,
+          node: u
+        }, {
+          default: B(() => [
+            b(y, {
+              content: u.content,
+              "custom-renderers": e.customRenderers,
+              "is-dev-mode": e.isDevMode
+            }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+          ]),
+          _: 2
+        }, 1032, ["node"])) : n(u.type) ? (r(), v(M(n(u.type)), {
+          key: 1,
+          node: u
+        }, {
+          default: B(() => [
+            b(y, {
+              content: u.content,
+              "custom-renderers": e.customRenderers,
+              "is-dev-mode": e.isDevMode
+            }, null, 8, ["content", "custom-renderers", "is-dev-mode"])
+          ]),
+          _: 2
+        }, 1032, ["node"])) : u.type === C(t).TEXT ? (r(), v($t, {
+          key: 2,
+          text: u.text,
+          marks: u.marks
+        }, null, 8, ["text", "marks"])) : a(u.type) ? (r(), v(M(a(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, {
+          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, {
+          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, {
+          key: 8,
+          node: u,
+          "custom-renderers": e.customRenderers,
+          "is-dev-mode": e.isDevMode
+        }, null, 8, ["node", "custom-renderers", "is-dev-mode"])) : (r(), v(xt, {
+          key: 9,
+          node: u
+        }, null, 8, ["node"]))
+      ], 64))), 128);
+    };
+  }
+}), Ot = {
+  key: 0,
+  "data-testid": "invalid-blocks-message"
+}, Kt = /* @__PURE__ */ p({
+  __name: "DotCMSBlockEditorRenderer",
+  props: {
+    blocks: {},
+    style: {},
+    className: {},
+    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", {
+      key: 1,
+      class: Y(e.className),
+      style: w(e.style),
+      "data-testid": "dot-block-editor-container"
+    }, [
+      b(P, {
+        content: e.blocks?.content,
+        "custom-renderers": e.customRenderers,
+        "is-dev-mode": e.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
+};