@grapesjs/studio-sdk-plugins 1.0.35 → 1.0.36

package/dist/rendererReact/index.es.js

@@ -1,11 +1,11 @@
 import { jsx as y } from "react/jsx-runtime";
-import { useState as R, useEffect as I, createElement as B, Fragment as T } from "react";
-import { createRoot as L } from "react-dom/client";
-const U = "app.grapesjs.com", W = "app-stage.grapesjs.com", K = "app2.grapesjs.com", F = "app-stage2.grapesjs.com", P = [
+import { useState as O, useEffect as I, createElement as F, Fragment as D } from "react";
+import { createRoot as W } from "react-dom/client";
+const U = "app.grapesjs.com", M = "app-stage.grapesjs.com", $ = "app2.grapesjs.com", K = "app-stage2.grapesjs.com", N = [
   U,
+  $,
+  M,
   K,
-  W,
-  F,
   "localhost",
   "127.0.0.1",
   ".local-credentialless.webcontainer.io",
@@ -14,88 +14,101 @@ const U = "app.grapesjs.com", W = "app-stage.grapesjs.com", K = "app2.grapesjs.c
   // For stackblitz.com demos
   "-sandpack.codesandbox.io"
   // For Sandpack demos
-], M = "license:check:start", V = "license:check:end", z = () => typeof window < "u", G = ({
+], S = "license:check:end", V = () => typeof window < "u", z = ({
   isDev: e,
   isStage: t,
-  isPlatform: n
-}) => `${e ? "" : `https://${t ? W : U}`}/${n ? "platform-api" : "api"}`, J = () => {
-  const e = z() && window.location.hostname;
-  return !!e && (P.includes(e) || P.some((t) => e.endsWith(t)));
-}, q = (e) => e.replace(/[A-Z]+(?![a-z])|[A-Z]/g, (t, n) => (n ? "-" : "") + t.toLowerCase()), x = (e) => typeof e == "string";
+  isPlatform: o
+}) => `${e ? "" : `https://${t ? M : U}`}/${o ? "platform-api" : "api"}`, J = () => {
+  const e = V() && window.location.hostname;
+  return !!e && (N.includes(e) || N.some((t) => e.endsWith(t)));
+}, q = (e) => e.replace(/[A-Z]+(?![a-z])|[A-Z]/g, (t, o) => (o ? "-" : "") + t.toLowerCase()), L = (e) => typeof e == "string";
 function H(e) {
   return typeof e == "function";
 }
 async function Z({
   path: e,
   baseApiUrl: t,
-  method: n = "GET",
+  method: o = "GET",
   headers: s = {},
   params: r,
-  body: o
+  body: n
 }) {
-  const a = `${t || G({ isDev: !1, isStage: !1 })}${e}`, i = {
-    method: n,
+  const a = `${t || z({ isDev: !1, isStage: !1 })}${e}`, c = {
+    method: o,
     headers: {
       "Content-Type": "application/json",
       ...s
     }
   };
-  o && (i.body = JSON.stringify(o));
-  const f = r ? new URLSearchParams(r).toString() : "", d = f ? `?${f}` : "", p = await fetch(`${a}${d}`, i);
+  n && (c.body = JSON.stringify(n));
+  const u = r ? new URLSearchParams(r).toString() : "", d = u ? `?${u}` : "", p = await fetch(`${a}${d}`, c);
   if (!p.ok)
     throw new Error(`HTTP error! status: ${p.status}`);
   return p.json();
 }
-var g = /* @__PURE__ */ ((e) => (e.free = "free", e.startup = "startup", e.business = "business", e.enterprise = "enterprise", e))(g || {});
-const O = {
-  [g.free]: 0,
-  [g.startup]: 10,
-  [g.business]: 20,
-  [g.enterprise]: 30
+var v = /* @__PURE__ */ ((e) => (e.free = "free", e.startup = "startup", e.business = "business", e.enterprise = "enterprise", e))(v || {}), k = /* @__PURE__ */ ((e) => (e.toastAdd = "studio:toastAdd", e.toastRemove = "studio:toastRemove", e.dialogOpen = "studio:dialogOpen", e.dialogClose = "studio:dialogClose", e.dialogExportCode = "studio:dialogExportCode", e.dialogImportCode = "studio:dialogImportCode", e.sidebarLeftSet = "studio:sidebarLeft:set", e.sidebarLeftGet = "studio:sidebarLeft:get", e.sidebarLeftToggle = "studio:sidebarLeft:toggle", e.sidebarRightSet = "studio:sidebarRight:set", e.sidebarRightGet = "studio:sidebarRight:get", e.sidebarRightToggle = "studio:sidebarRight:toggle", e.sidebarTopSet = "studio:sidebarTop:set", e.sidebarTopGet = "studio:sidebarTop:get", e.sidebarTopToggle = "studio:sidebarTop:toggle", e.sidebarBottomSet = "studio:sidebarBottom:set", e.sidebarBottomGet = "studio:sidebarBottom:get", e.sidebarBottomToggle = "studio:sidebarBottom:toggle", e.symbolAdd = "studio:symbolAdd", e.symbolDetach = "studio:symbolDetach", e.symbolOverride = "studio:symbolOverride", e.symbolPropagateStyles = "studio:propagateStyles", e.getPagesConfig = "studio:getPagesConfig", e.setPagesConfig = "studio:setPagesConfig", e.getPageSettings = "studio:getPageSettings", e.setPageSettings = "studio:setPageSettings", e.clearPage = "studio:clearPage", e.projectFiles = "studio:projectFiles", e.validateCode = "studio:validateCode", e.canvasReload = "studio:canvasReload", e.getBlocksPanel = "studio:getBlocksPanel", e.setBlocksPanel = "studio:setBlocksPanel", e.getStateContextMenu = "studio:getStateContextMenu", e.setStateContextMenu = "studio:setStateContextMenu", e.contextMenuComponent = "studio:contextMenuComponent", e.layoutAdd = "studio:layoutAdd", e.layoutRemove = "studio:layoutRemove", e.layoutToggle = "studio:layoutToggle", e.layoutUpdate = "studio:layoutUpdate", e.layoutGet = "studio:layoutGet", e.layoutConfigGet = "studio:layoutConfigGet", e.layoutConfigSet = "studio:layoutConfigSet", e.layoutComponentAdd = "studio:layoutComponentAdd", e.layoutComponentGet = "studio:layoutComponentGet", e.layoutComponentRemove = "studio:layoutComponentRemove", e.layoutComponentRender = "studio:layoutComponentRender", e.getStateTheme = "studio:getStateTheme", e.setStateTheme = "studio:setStateTheme", e.settings = "studio:settings", e.assetProviderGet = "studio:assetProviderGet", e.assetProviderAdd = "studio:assetProviderAdd", e.assetProviderRemove = "studio:assetProviderRemove", e.fontGet = "studio:fontGet", e.fontAdd = "studio:fontAdd", e.fontRemove = "studio:fontRemove", e.fontManagerOpen = "studio:fontManagerOpen", e.menuFontLoad = "studio:menuFontLoad", e.toggleStateDataSource = "studio:toggleStateDataSource", e.getStateDataSource = "studio:getStateDataSource", e.dataSourceSetGlobalData = "studio:dataSourceSetGlobalData", e.dataSourceSetImporter = "studio:dataSourceSetImporter", e.dataSourceSetExporter = "studio:dataSourceSetExporter", e.setDragAbsolute = "studio:setDragAbsolute", e))(k || {});
+const B = {
+  [v.free]: 0,
+  [v.startup]: 10,
+  [v.business]: 20,
+  [v.enterprise]: 30
 };
 function Q(e) {
   const t = e;
-  return t.init = (n) => (s) => e(s, n), t;
+  return t.init = (o) => (s) => e(s, o), t;
 }
 const X = (e) => /* @__PURE__ */ Q(e);
 async function Y({
   editor: e,
   plan: t,
-  pluginName: n,
+  pluginName: o,
   licenseKey: s,
   onLicenseCheckResponse: r,
-  cleanup: o
+  cleanup: n
 }) {
-  let c = "", a = !1;
-  const i = J(), f = (p) => {
-    console.warn("Cleanup plugin:", n, "Reason:", p), o();
-  }, d = (p = {}) => {
-    var C;
-    const { error: m, sdkLicense: u } = p, l = (C = p.plan) == null ? void 0 : C.category;
-    if (!(u || p.license) || m)
-      f(m || "Invalid license");
+  let i = "", a;
+  const c = (p) => {
+    console.warn("Cleanup plugin:", o, "Reason:", p), n();
+  }, u = (p = {}) => {
+    var R;
+    const { error: g, sdkLicense: f } = p, l = (R = p.plan) == null ? void 0 : R.category;
+    if (!(f || p.license) || g)
+      c(g || "Invalid license");
     else if (l) {
-      const w = O[t], b = O[l];
-      w > b && f({ pluginRequiredPlan: t, licensePlan: l });
+      const m = B[t], w = B[l];
+      m > w && c({ pluginRequiredPlan: t, licensePlan: l });
     }
   };
-  e.on(M, (p) => {
-    c = p == null ? void 0 : p.baseApiUrl, a = !0;
-  }), e.on(V, (p) => {
-    r == null || r(p), d(p);
-  }), setTimeout(async () => {
-    if (!a) {
-      if (i) return;
-      if (s) {
-        const p = await ee({ licenseKey: s, pluginName: n, baseApiUrl: c });
-        r == null || r(p), p && d(p);
-      } else
-        f("The `licenseKey` option not provided");
-    }
-  }, 2e3);
+  e.Commands.has(k.settings) && (a = e.runCommand(k.settings), i = (a == null ? void 0 : a.baseUrl) || "");
+  const d = (p) => {
+    r == null || r(p), p && u(p);
+  };
+  if (!a) {
+    e.onReady(async () => {
+      if (!J())
+        if (s) {
+          const p = await te({ licenseKey: s, pluginName: o, baseApiUrl: i });
+          d(p);
+        } else
+          c("The `licenseKey` option not provided");
+    });
+    return;
+  }
+  if (a.licensePlan || a.licenseError) {
+    const p = ee(a);
+    d(p);
+    return;
+  }
+  e.on(S, (p) => d(p));
 }
-async function ee(e) {
-  const { licenseKey: t, pluginName: n, baseApiUrl: s } = e;
+const ee = (e) => ({
+  sdkLicense: e.license,
+  license: e.license,
+  error: e.licenseError,
+  plan: e.licensePlan
+});
+async function te(e) {
+  const { licenseKey: t, pluginName: o, baseApiUrl: s } = e;
   try {
     return (await Z({
       baseApiUrl: s,
@@ -103,100 +116,100 @@ async function ee(e) {
       method: "POST",
       params: {
         d: window.location.hostname,
-        pn: n
+        pn: o
       }
     })).result || {};
   } catch (r) {
     return console.error("Error during SDK license check:", r), !1;
   }
 }
-function te(e) {
+function oe(e) {
   const t = {};
-  for (const n in e)
-    if (Object.prototype.hasOwnProperty.call(e, n)) {
-      const s = q(n);
-      t[s] = e[n];
+  for (const o in e)
+    if (Object.prototype.hasOwnProperty.call(e, o)) {
+      const s = q(o);
+      t[s] = e[o];
     }
   return t;
 }
 const ne = (e, t) => {
-  const n = e.components || {};
-  for (const s in n) {
-    const r = n[s];
+  const o = e.components || {};
+  for (const s in o) {
+    const r = o[s];
     if (r.component === t)
       return { cmpConfig: r, type: s };
   }
 };
-function D(e) {
+function C(e) {
   const t = {};
-  let n = !1;
+  let o = !1;
   for (const s in e)
     if (Object.prototype.hasOwnProperty.call(e, s)) {
       const r = e[s];
       if (typeof r == "string" || typeof r == "number") {
-        const o = s.includes("-") ? s.replace(/-([a-z])/g, (c) => c[1].toUpperCase()) : s;
-        t[o] = r, n = !0;
+        const n = s.includes("-") ? s.replace(/-([a-z])/g, (i) => i[1].toUpperCase()) : s;
+        t[n] = r, o = !0;
       }
     }
-  return n ? t : void 0;
+  return o ? t : void 0;
 }
-function oe(e) {
+function se(e) {
   const t = {};
-  return e.split(";").forEach((n) => {
-    if (!n.trim()) return;
-    const s = n.indexOf(":");
+  return e.split(";").forEach((o) => {
+    if (!o.trim()) return;
+    const s = o.indexOf(":");
     if (s > 0) {
-      const r = n.substring(0, s).trim(), o = n.substring(s + 1).trim();
-      if (r && o) {
-        const c = r.replace(/-([a-z])/g, (a) => a[1].toUpperCase());
-        t[c] = o;
+      const r = o.substring(0, s).trim(), n = o.substring(s + 1).trim();
+      if (r && n) {
+        const i = r.replace(/-([a-z])/g, (a) => a[1].toUpperCase());
+        t[i] = n;
       }
     }
   }), Object.keys(t).length > 0 ? t : void 0;
 }
-function se(e) {
+function re(e) {
   if (e) {
     if (typeof e == "object" && !Array.isArray(e))
-      return D(e);
+      return C(e);
     if (typeof e == "string") {
-      let t = oe(e);
+      let t = se(e);
       if (!t)
         try {
-          const n = JSON.parse(e);
-          typeof n == "object" && n !== null && !Array.isArray(n) && (t = D(n));
-        } catch (n) {
-          console.error("Failed to parse style string as JSON", n);
+          const o = JSON.parse(e);
+          typeof o == "object" && o !== null && !Array.isArray(o) && (t = C(o));
+        } catch (o) {
+          console.error("Failed to parse style string as JSON", o);
         }
       return t;
     }
     if (Array.isArray(e)) {
       const t = {};
-      return e.forEach((n) => {
-        if (typeof n == "object" && n !== null) {
-          const s = n.name || n.property, r = n.value;
+      return e.forEach((o) => {
+        if (typeof o == "object" && o !== null) {
+          const s = o.name || o.property, r = o.value;
           if (typeof s == "string" && s && r !== void 0 && r !== "") {
-            const o = s.replace(/-([a-z])/g, (c) => c[1].toUpperCase());
-            t[o] = r;
+            const n = s.replace(/-([a-z])/g, (i) => i[1].toUpperCase());
+            t[n] = r;
           }
         }
       }), Object.keys(t).length > 0 ? t : void 0;
     }
   }
 }
-function re(e) {
-  return _[e] ? _[e] : e.includes("-") ? e.replace(/-([a-z])/g, (t, n) => n.toUpperCase()) : e;
-}
 function ae(e) {
-  var n;
+  return G[e] ? G[e] : e.includes("-") ? e.replace(/-([a-z])/g, (t, o) => o.toUpperCase()) : e;
+}
+function ie(e) {
+  var o;
   const t = {};
   for (const [s, r] of Object.entries(e))
     if (s === "style")
-      t.style = se(r);
+      t.style = re(r);
     else if (s.startsWith("data-"))
       t[s] = r;
     else {
-      const o = re(s);
-      ((n = e.xmlns) == null ? void 0 : n.includes("svg")) || e.viewBox !== void 0 || e.d !== void 0 || ie.has(o) || o.startsWith("svg") ? t[o] = r : !ce.has(o) && !o.startsWith("on") && !o.startsWith("aria-") && !o.startsWith("data-") ? t[s] = r : t[o] = r;
+      const n = ae(s);
+      ((o = e.xmlns) == null ? void 0 : o.includes("svg")) || e.viewBox !== void 0 || e.d !== void 0 || le.has(n) || n.startsWith("svg") ? t[n] = r : !ce.has(n) && !n.startsWith("on") && !n.startsWith("aria-") && !n.startsWith("data-") ? t[s] = r : t[n] = r;
     }
   return t;
 }
@@ -241,7 +254,7 @@ const ce = /* @__PURE__ */ new Set([
   "aria-labelledby",
   "aria-describedby",
   "role"
-]), ie = /* @__PURE__ */ new Set([
+]), le = /* @__PURE__ */ new Set([
   "x",
   "y",
   "d",
@@ -284,7 +297,7 @@ const ce = /* @__PURE__ */ new Set([
   "clipPath",
   "overflow",
   "pointerEvents"
-]), _ = {
+]), G = {
   class: "className",
   for: "htmlFor",
   "http-equiv": "httpEquiv",
@@ -301,60 +314,60 @@ const ce = /* @__PURE__ */ new Set([
   "font-family": "fontFamily",
   "font-size": "fontSize",
   "text-anchor": "textAnchor"
-}, E = (e) => (e == null ? void 0 : e.$$typeof) && typeof e.props == "object";
-function le(e) {
+}, T = (e) => (e == null ? void 0 : e.$$typeof) && typeof e.props == "object";
+function pe(e) {
   return (t) => {
-    const n = t.getContent();
-    E(n) && t.set({
-      content: A({ ...e, model: n }),
-      reactContent: n
+    const o = t.getContent();
+    T(o) && t.set({
+      content: A({ ...e, model: o }),
+      reactContent: o
     });
   };
 }
-const pe = (e) => (t) => {
-  const n = t.component;
-  E(n) && (t.component = { components: A({ ...e, model: n }) });
+const ue = (e) => (t) => {
+  const o = t.component;
+  T(o) && (t.component = { components: A({ ...e, model: o }) });
 };
 function A(e) {
-  const { model: t, editor: n, config: s } = e;
-  if (E(t)) {
-    const r = t, o = {}, { type: c, props: a = {} } = r, { children: i, className: f, style: d, ...p } = a, m = (l) => ({ type: "textnode", content: l }), u = typeof c == "symbol";
-    if (H(c)) {
-      const l = ne(s, c);
-      o.type = l == null ? void 0 : l.type;
-    } else n.Components.getType(c) ? o.type = c : u || (o.tagName = c);
-    if (f && (o.classes = f), d && (o.style = te(d)), Array.isArray(i) ? o.components = i.map((l) => x(l) ? m(l) : A({ ...e, model: l })).filter(Boolean) : x(i) && (o.components = m(i)), Object.keys(p).length) {
-      const l = n.Parser.parserHtml.splitPropsFromAttr(p);
-      o.attributes = l.attrs, Object.assign(o, l.props);
+  const { model: t, editor: o, config: s } = e;
+  if (T(t)) {
+    const r = t, n = {}, { type: i, props: a = {} } = r, { children: c, className: u, style: d, ...p } = a, g = (l) => ({ type: "textnode", content: l }), f = typeof i == "symbol";
+    if (H(i)) {
+      const l = ne(s, i);
+      n.type = l == null ? void 0 : l.type;
+    } else o.Components.getType(i) ? n.type = i : f || (n.tagName = i);
+    if (u && (n.classes = u), d && (n.style = oe(d)), Array.isArray(c) ? n.components = c.map((l) => L(l) ? g(l) : A({ ...e, model: l })).filter(Boolean) : L(c) && (n.components = g(c)), Object.keys(p).length) {
+      const l = o.Parser.parserHtml.splitPropsFromAttr(p);
+      n.attributes = l.attrs, Object.assign(n, l.props);
     }
-    return o;
+    return n;
   }
 }
 function fe(e) {
-  const { component: t } = e, [n, s] = R(0), [r, o] = R();
+  const { component: t } = e, [o, s] = O(0), [r, n] = O();
   return I(() => {
     if (!t) return () => {
     };
-    const a = () => s((l) => l + 1), i = () => {
-      [...t.views].forEach((v) => v.remove()), o(void 0);
-    }, { em: f } = t, d = f.Components.events, m = [...["components", "attributes", "classes"].map((l) => `${d.update}:${l}`), "rerender"].join(" "), u = [d.removed, "rerender"].join(" ");
-    return t.on(m, a), t.on(u, i), () => {
-      t.off(m, a), t.off(u, i), i();
+    const a = () => s((l) => l + 1), c = () => {
+      [...t.views].forEach((b) => b.remove()), n(void 0);
+    }, { em: u } = t, d = u.Components.events, g = [...["components", "attributes", "classes"].map((l) => `${d.update}:${l}`), "rerender"].join(" "), f = [d.removed, "rerender"].join(" ");
+    return t.on(g, a), t.on(f, c), () => {
+      t.off(g, a), t.off(f, c), c();
     };
-  }, [t]), { key: n, view: r, connectDom: (a) => {
+  }, [t]), { key: o, view: r, connectDom: (a) => {
     if (!a) return;
-    const i = ue({ ...e, el: a });
-    o(i);
+    const c = de({ ...e, el: a });
+    n(c);
   } };
 }
-function ue(e) {
-  var i;
-  const { editor: t, component: n, el: s, frameView: r } = e, { em: o, Components: c } = t;
-  let a = n.getView(r.model);
+function de(e) {
+  var c;
+  const { editor: t, component: o, el: s, frameView: r } = e, { em: n, Components: i } = t;
+  let a = o.getView(r.model);
   if ((a == null ? void 0 : a.el) === s)
     return a;
   if (!a) {
-    const { ComponentView: f } = c, d = n.attributes.type || "default", p = ((i = c.getType(d)) == null ? void 0 : i.view) || f, m = { ...c.config, frameView: r, em: o }, u = p.extend({
+    const { ComponentView: u } = i, d = o.attributes.type || "default", p = ((c = i.getType(d)) == null ? void 0 : c.view) || u, g = { ...i.config, frameView: r, em: n }, f = p.extend({
       initComponents() {
       },
       _createElement() {
@@ -369,110 +382,110 @@ function ue(e) {
         return this._ensureElement(), this._setData(), this.renderAttributes(), (l = this.updateSrc) == null || l.call(this), this;
       }
     });
-    a = new u({ el: s, config: m, model: n });
+    a = new f({ el: s, config: g, model: o });
   }
   return a.el = s, a.render(), a;
 }
-function de(e, t) {
-  const { Components: n } = e, s = (r) => {
-    const { id: o, model: c } = r;
-    n.addType(o, {
+function ge(e, t) {
+  const { Components: o } = e, s = (r) => {
+    const { id: n, model: i } = r;
+    o.addType(n, {
       model: {
         toJSON(...a) {
-          const i = c.prototype.toJSON.apply(this, a);
-          return i.tagName = this.tagName, i;
+          const c = i.prototype.toJSON.apply(this, a);
+          return c.tagName = this.tagName, c;
         }
       }
     });
   };
-  n.getTypes().forEach(s), e.on("component:type:add", s), Object.entries(t.components || {}).forEach(([r, o]) => {
-    var m, u;
-    const { allowPropClassName: c, allowPropId: a, allowChildren: i } = o, f = !a && !c, d = () => ({
-      disabled: f
+  o.getTypes().forEach(s), e.on("component:type:add", s), Object.entries(t.components || {}).forEach(([r, n]) => {
+    var g, f;
+    const { allowPropClassName: i, allowPropId: a, allowChildren: c } = n, u = !a && !i, d = () => ({
+      disabled: u
     }), p = () => ({
-      disableClasses: !c,
+      disableClasses: !i,
       disableComponent: !a
     });
-    n.addType(r, {
+    o.addType(r, {
       isComponent: (l) => (l == null ? void 0 : l.tagName) === r,
       model: {
         defaults: {
           type: r,
-          traits: ((m = o.props) == null ? void 0 : m.call(o)) || [],
-          droppable: !!i,
-          stylable: !f,
+          traits: ((g = n.props) == null ? void 0 : g.call(n)) || [],
+          droppable: !!c,
+          stylable: !u,
           styleManager: d,
           selectorManager: p,
-          ...((u = o.model) == null ? void 0 : u.defaults) || {}
+          ...((f = n.model) == null ? void 0 : f.defaults) || {}
         }
       }
     });
   });
 }
-function j(e) {
-  var N;
-  const { component: t, config: n, editor: s, frameView: r, onMount: o, tagName: c, children: a } = e, { key: i, view: f, connectDom: d } = fe(e);
+function _(e) {
+  var x;
+  const { component: t, config: o, editor: s, frameView: r, onMount: n, tagName: i, children: a } = e, { key: c, view: u, connectDom: d } = fe(e);
   I(() => {
-    if (!f && !o) return;
+    if (!u && !n) return;
     const h = setTimeout(() => {
-      f && (o == null || o(f), setTimeout(() => f.postRender()));
+      u && (n == null || n(u), setTimeout(() => u.postRender()));
     });
     return () => clearTimeout(h);
-  }, [f]);
-  const p = t.get("type") || "default", m = t.content, u = (N = n.components) == null ? void 0 : N[p], l = (u == null ? void 0 : u.component) || c || t.tagName || "div", v = t.components(), C = v.length ? v.map((h) => /* @__PURE__ */ y(j, { component: h, config: n, editor: s, frameView: r }, h.cid)) : [m || void 0], w = ae(t.getAttributes()), b = u == null ? void 0 : u.editorRender, S = [...C, a].filter((h) => h ?? !1), k = S.length ? S : null;
-  if (b)
-    return /* @__PURE__ */ y(b, { props: w, editor: s, component: t, connectDom: d, children: k });
-  if (u != null && u.component)
-    return /* @__PURE__ */ y("gjs-wrapper", { ref: d, style: u.wrapperStyle, children: /* @__PURE__ */ y(l, { ...w, children: k }) });
+  }, [u]);
+  const p = t.get("type") || "default", g = t.content, f = (x = o.components) == null ? void 0 : x[p], l = (f == null ? void 0 : f.component) || i || t.tagName || "div", b = t.components(), R = b.length ? b.map((h) => /* @__PURE__ */ y(_, { component: h, config: o, editor: s, frameView: r }, h.cid)) : [g || void 0], m = ie(t.getAttributes()), w = f == null ? void 0 : f.editorRender, E = [...R, a].filter((h) => h ?? !1), P = E.length ? E : null;
+  if (w)
+    return /* @__PURE__ */ y(w, { props: m, editor: s, component: t, connectDom: d, children: P });
+  if (f != null && f.component)
+    return /* @__PURE__ */ y("gjs-wrapper", { ref: d, style: f.wrapperStyle, children: /* @__PURE__ */ y(l, { ...m, children: P }) });
   if (t.isInstanceOf("textnode"))
-    return m;
-  const $ = t.isInstanceOf("text") ? i : void 0;
-  return /* @__PURE__ */ B(l, { ...w, ref: d, key: $ }, t.get("void") ? null : k);
+    return g;
+  const j = t.isInstanceOf("text") ? c : void 0;
+  return /* @__PURE__ */ F(l, { ...m, ref: d, key: j }, t.get("void") ? null : P);
 }
-const me = (e) => {
-  const { frame: t, window: n, onMount: s, editor: r } = e, o = r.Canvas.events, { root: c } = t;
+const ye = (e) => {
+  const { frame: t, window: o, onMount: s, editor: r } = e, n = r.Canvas.events, { root: i } = t;
   try {
-    const a = L(n.document.body);
-    a.render(/* @__PURE__ */ y(ye, { ...e, component: c, onMount: s }));
-    const i = () => a.unmount();
-    t.once(o.frameUnload, i), n.addEventListener("unload", i);
+    const a = W(o.document.body);
+    a.render(/* @__PURE__ */ y(he, { ...e, component: i, onMount: s }));
+    const c = () => a.unmount();
+    t.once(n.frameUnload, c), o.addEventListener("unload", c);
   } catch (a) {
     console.warn(a);
   }
-  return c.getView();
+  return i.getView();
 };
-function ye(e) {
-  const { editor: t, component: n, window: s, frameView: r, config: o, onMount: c } = e, a = s.document, i = o.rootComponent || T, f = o.rootComponent ? { editorProps: { doc: a, editor: t, frameView: r } } : {}, d = (o == null ? void 0 : o.bodyAfter) || T;
-  return /* @__PURE__ */ y(i, { ...f, children: /* @__PURE__ */ y(
-    j,
+function he(e) {
+  const { editor: t, component: o, window: s, frameView: r, config: n, onMount: i } = e, a = s.document, c = n.rootComponent || D, u = n.rootComponent ? { editorProps: { doc: a, editor: t, frameView: r } } : {}, d = (n == null ? void 0 : n.bodyAfter) || D;
+  return /* @__PURE__ */ y(c, { ...u, children: /* @__PURE__ */ y(
+    _,
     {
       tagName: "div",
-      component: n,
-      config: o,
+      component: o,
+      config: n,
       editor: t,
       frameView: r,
-      onMount: c,
-      children: /* @__PURE__ */ y(d, { ...f })
+      onMount: i,
+      children: /* @__PURE__ */ y(d, { ...u })
     }
   ) });
 }
-const he = "rendererReact", ge = g.startup, ve = function(e, t = {}) {
-  const { Blocks: n, Pages: s } = e, r = n.events, o = s.events;
-  e.Canvas.config.customRenderer = (a) => me({ ...a, config: t }), e.Components.config.processor = (a) => A({ model: a, editor: e, config: t }), de(e, t);
-  const c = [
-    [r.add, le({ editor: e, config: t })],
-    [o.addBefore, pe({ editor: e, config: t })]
+const ve = "rendererReact", be = v.startup, me = function(e, t = {}) {
+  const { Blocks: o, Pages: s } = e, r = o.events, n = s.events;
+  e.Canvas.config.customRenderer = (a) => ye({ ...a, config: t }), e.Components.config.processor = (a) => A({ model: a, editor: e, config: t }), ge(e, t);
+  const i = [
+    [r.add, pe({ editor: e, config: t })],
+    [n.addBefore, ue({ editor: e, config: t })]
   ];
-  c.forEach(([a, i]) => e.on(a, i)), Y({
+  i.forEach(([a, c]) => e.on(a, c)), Y({
     editor: e,
     licenseKey: t.licenseKey,
-    plan: ge,
-    pluginName: he,
+    plan: be,
+    pluginName: ve,
     cleanup: () => {
-      e.Canvas.config.customRenderer = void 0, e.Components.config.processor = void 0, c.forEach(([a, i]) => e.off(a, i));
+      e.Canvas.config.customRenderer = void 0, e.Components.config.processor = void 0, i.forEach(([a, c]) => e.off(a, c));
     }
   });
-}, Ae = X(ve);
+}, Pe = X(me);
 export {
-  Ae as default
+  Pe as default
 };