@builder.io/sdk-vue 0.1.11 → 0.1.13

package/packages/_vue3/dist/{index.0f0b2b49.js → index.2ad3b0cb.js}

@@ -1,41 +1,41 @@
-import { openBlock as d, createElementBlock as u, mergeProps as _, toHandlers as w, toDisplayString as M, defineAsyncComponent as x, resolveComponent as k, normalizeClass as j, normalizeStyle as I, createBlock as T, createCommentVNode as b, Fragment as E, renderList as P, createVNode as Q, renderSlot as A, createElementVNode as $ } from "vue";
-const pe = {
+import { openBlock as d, createElementBlock as m, mergeProps as S, toHandlers as C, toDisplayString as L, defineAsyncComponent as x, resolveComponent as k, normalizeClass as j, normalizeStyle as I, createBlock as T, createCommentVNode as y, Fragment as E, renderList as P, createVNode as X, renderSlot as A, createElementVNode as N } from "vue";
+const me = {
   name: "builder-button",
   props: ["attributes", "text", "link", "openLinkInNewTab"],
   methods: {
     filterAttrs: function(n = {}, t) {
       const o = "v-on:";
-      return Object.keys(n).filter((r) => {
-        const s = r.startsWith(o);
-        return t ? s : !s;
+      return Object.keys(n).filter((s) => {
+        const i = s.startsWith(o);
+        return t ? i : !i;
       }).reduce(
-        (r, s) => ({
-          ...r,
-          [s.replace(o, "")]: n[s]
+        (s, i) => ({
+          ...s,
+          [i.replace(o, "")]: n[i]
         }),
         {}
       );
     }
   }
 };
-const g = (e, n) => {
+const h = (e, n) => {
   const t = e.__vccOpts || e;
-  for (const [o, r] of n)
-    t[o] = r;
+  for (const [o, s] of n)
+    t[o] = s;
   return t;
-}, he = ["href", "target"];
-function fe(e, n, t, o, r, s) {
-  return t.link ? (d(), u("a", _({
+}, pe = ["href", "target"];
+function he(e, n, t, o, s, i) {
+  return t.link ? (d(), m("a", S({
     key: 0,
     role: "button",
     href: t.link,
     target: t.openLinkInNewTab ? "_blank" : void 0
-  }, s.filterAttrs(t.attributes, !1), w(s.filterAttrs(t.attributes, !0), !0)), M(t.text), 17, he)) : (d(), u("button", _({
+  }, i.filterAttrs(t.attributes, !1), C(i.filterAttrs(t.attributes, !0), !0)), L(t.text), 17, pe)) : (d(), m("button", S({
     key: 1,
-    class: "button-4o9pb21oca6"
-  }, s.filterAttrs(t.attributes, !1), w(s.filterAttrs(t.attributes, !0), !0)), M(t.text), 17));
+    class: "button-1yj9n7yt24z"
+  }, i.filterAttrs(t.attributes, !1), C(i.filterAttrs(t.attributes, !0), !0)), L(t.text), 17));
 }
-const ge = /* @__PURE__ */ g(pe, [["render", fe], ["__scopeId", "data-v-e75e2084"]]), L = (e) => JSON.parse(JSON.stringify(e)), Z = {
+const fe = /* @__PURE__ */ h(me, [["render", he], ["__scopeId", "data-v-28c9cee7"]]), W = (e) => JSON.parse(JSON.stringify(e)), Q = {
   small: {
     min: 320,
     default: 321,
@@ -51,8 +51,8 @@ const ge = /* @__PURE__ */ g(pe, [["render", fe], ["__scopeId", "data-v-e75e2084
     default: 991,
     max: 1200
   }
-}, On = (e, n = Z) => `@media (max-width: ${n[e].max}px)`, be = ({ small: e, medium: n }) => {
-  const t = L(Z);
+}, En = (e, n = Q) => `@media (max-width: ${n[e].max}px)`, ge = ({ small: e, medium: n }) => {
+  const t = W(Q);
   if (!e || !n)
     return t;
   const o = Math.floor(e / 2);
@@ -61,34 +61,19 @@ const ge = /* @__PURE__ */ g(pe, [["render", fe], ["__scopeId", "data-v-e75e2084
     min: o,
     default: o + 1
   };
-  const r = t.small.max + 1;
+  const s = t.small.max + 1;
   t.medium = {
     max: n,
-    min: r,
-    default: r + 1
+    min: s,
+    default: s + 1
   };
-  const s = t.medium.max + 1;
+  const i = t.medium.max + 1;
   return t.large = {
     max: 2e3,
-    min: s,
-    default: s + 1
+    min: i,
+    default: i + 1
   }, t;
-}, R = "vue3", ye = (e) => e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), S = (e) => e != null, ve = (e) => Object.entries(e).map(([t, o]) => {
-  if (typeof o == "string")
-    return `${ye(t)}: ${o};`;
-}).filter(S), C = (e) => ve(e).join(`
-`), Fn = ({
-  mediaQuery: e,
-  className: n,
-  styles: t
-}) => {
-  const o = `.${n} {
-    ${C(t)}
-  }`;
-  return e ? `${e} {
-      ${o}
-    }` : o;
-}, xe = Symbol(), O = {
+}, R = "vue3", be = Symbol(), V = {
   Builder: {
     content: null,
     context: {},
@@ -96,25 +81,26 @@ const ge = /* @__PURE__ */ g(pe, [["render", fe], ["__scopeId", "data-v-e75e2084
     setState() {
     },
     apiKey: null,
+    apiVersion: void 0,
     registeredComponents: {},
     inheritedStyles: {}
   },
-  key: xe
-}, ke = () => Promise.resolve().then(() => ee).then((e) => e.default).catch((e) => {
+  key: be
+}, ye = () => Promise.resolve().then(() => Z).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlocks at ../../components/render-blocks.vue",
     e
   ), e;
-}), Se = () => import("./render-inlined-styles.db67e9d8.js").then((e) => e.default).catch((e) => {
+}), ve = () => import("./render-inlined-styles.9f82189a.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderInlinedStyles at ../../components/render-inlined-styles.vue",
     e
   ), e;
-}), _e = {
+}), xe = {
   name: "builder-columns",
   components: {
-    RenderInlinedStyles: x(Se),
-    RenderBlocks: x(ke)
+    RenderInlinedStyles: x(ve),
+    RenderBlocks: x(ye)
   },
   props: [
     "space",
@@ -124,104 +110,96 @@ const ge = /* @__PURE__ */ g(pe, [["render", fe], ["__scopeId", "data-v-e75e2084
     "builderBlock"
   ],
   data() {
-    return { TARGET: R };
+    return {
+      gutterSize: typeof this.space == "number" ? this.space || 0 : 20,
+      cols: this.columns || [],
+      stackAt: this.stackColumnsAt || "tablet",
+      flexDir: this.stackColumnsAt === "never" ? "row" : this.reverseColumnsWhenStacked ? "column-reverse" : "column",
+      TARGET: R
+    };
   },
   inject: {
-    builderContext: O.key
+    builderContext: V.key
   },
   computed: {
     columnsCssVars() {
-      const e = this.stackColumnsAt === "never" ? "inherit" : this.reverseColumnsWhenStacked ? "column-reverse" : "column";
-      return {
-        "--flex-dir": e,
-        "--flex-dir-tablet": this.maybeApplyForTablet(e)
-      };
-    },
-    columnCssVars() {
-      const e = "100%", n = "0";
       return {
-        "--column-width": e,
-        "--column-margin-left": n,
-        "--column-width-tablet": this.maybeApplyForTablet(e),
-        "--column-margin-left-tablet": this.maybeApplyForTablet(n)
-      };
-    },
-    columnStyleObjects() {
-      return {
-        columns: {
-          small: {
-            flexDirection: "var(--flex-dir)",
-            alignItems: "stretch"
-          },
-          medium: {
-            flexDirection: "var(--flex-dir-tablet)",
-            alignItems: "stretch"
-          }
-        },
-        column: {
-          small: {
-            width: "var(--column-width) !important",
-            marginLeft: "var(--column-margin-left) !important"
-          },
-          medium: {
-            width: "var(--column-width-tablet) !important",
-            marginLeft: "var(--column-margin-left-tablet) !important"
-          }
-        }
+        "--flex-dir": this.flexDir,
+        "--flex-dir-tablet": this.getTabletStyle({
+          stackedStyle: this.flexDir,
+          desktopStyle: "row"
+        })
       };
     },
     columnsStyles() {
       return `
       @media (max-width: ${this.getWidthForBreakpointSize("medium")}px) {
         .${this.builderBlock.id}-breakpoints {
-          ${C(this.columnStyleObjects.columns.medium)}
+          flex-direction: var(--flex-dir-tablet);
+          align-items: stretch;
         }
 
         .${this.builderBlock.id}-breakpoints > .builder-column {
-          ${C(this.columnStyleObjects.column.medium)}
+          width: var(--column-width-tablet) !important;
+          margin-left: var(--column-margin-left-tablet) !important;
         }
       }
 
       @media (max-width: ${this.getWidthForBreakpointSize("small")}px) {
         .${this.builderBlock.id}-breakpoints {
-          ${C(this.columnStyleObjects.columns.small)}
+          flex-direction: var(--flex-dir);
+          align-items: stretch;
         }
 
         .${this.builderBlock.id}-breakpoints > .builder-column {
-          ${C(this.columnStyleObjects.column.small)}
+          width: var(--column-width-mobile) !important;
+          margin-left: var(--column-margin-left-mobile) !important;
         }
       },
     `;
-    },
-    reactNativeColumnsStyles() {
-      return this.columnStyleObjects.columns.small;
-    },
-    reactNativeColumnStyles() {
-      return this.columnStyleObjects.column.small;
     }
   },
   methods: {
-    getGutterSize() {
-      return typeof this.space == "number" ? this.space || 0 : 20;
-    },
-    getColumns() {
-      return this.columns || [];
-    },
     getWidth(e) {
-      var t;
-      const n = this.getColumns();
-      return ((t = n[e]) == null ? void 0 : t.width) || 100 / n.length;
+      var n;
+      return ((n = this.cols[e]) == null ? void 0 : n.width) || 100 / this.cols.length;
     },
     getColumnCssWidth(e) {
-      const n = this.getColumns(), o = this.getGutterSize() * (n.length - 1) / n.length;
-      return `calc(${this.getWidth(e)}% - ${o}px)`;
+      const n = this.gutterSize * (this.cols.length - 1) / this.cols.length;
+      return `calc(${this.getWidth(e)}% - ${n}px)`;
+    },
+    getTabletStyle({ stackedStyle: e, desktopStyle: n }) {
+      return this.stackAt === "tablet" ? e : n;
     },
-    maybeApplyForTablet(e) {
-      return (this.stackColumnsAt || "tablet") === "tablet" ? e : "inherit";
+    getMobileStyle({ stackedStyle: e, desktopStyle: n }) {
+      return this.stackAt === "never" ? n : e;
+    },
+    columnCssVars(e) {
+      const n = this.getColumnCssWidth(e), t = `${e === 0 ? 0 : this.gutterSize}px`, o = "100%", s = "0";
+      return {
+        width: n,
+        "margin-left": t,
+        "--column-width-mobile": this.getMobileStyle({
+          stackedStyle: o,
+          desktopStyle: n
+        }),
+        "--column-margin-left-mobile": this.getMobileStyle({
+          stackedStyle: s,
+          desktopStyle: t
+        }),
+        "--column-width-tablet": this.getTabletStyle({
+          stackedStyle: o,
+          desktopStyle: n
+        }),
+        "--column-margin-left-tablet": this.getTabletStyle({
+          stackedStyle: s,
+          desktopStyle: t
+        })
+      };
     },
     getWidthForBreakpointSize(e) {
       var t, o;
-      return be(
+      return ge(
         ((o = (t = this.builderContext.content) == null ? void 0 : t.meta) == null ? void 0 : o.breakpoints) || {}
       )[e].max;
     },
@@ -236,34 +214,32 @@ const ge = /* @__PURE__ */ g(pe, [["render", fe], ["__scopeId", "data-v-e75e2084
     }
   }
 };
-function Ce(e, n, t, o, r, s) {
-  const i = k("render-inlined-styles"), c = k("render-blocks");
-  return d(), u("div", {
+function ke(e, n, t, o, s, i) {
+  const r = k("render-inlined-styles"), c = k("render-blocks");
+  return d(), m("div", {
     class: j(
-      s._classStringToObject(
+      i._classStringToObject(
         `builder-columns ${t.builderBlock.id}-breakpoints div-361b1o6wv2k`
       )
     ),
-    style: I({
-      ...r.TARGET === "reactNative" ? s.reactNativeColumnsStyles : {},
-      ...s.columnsCssVars
-    })
+    style: I(i.columnsCssVars),
+    dataSet: {
+      "builder-block-name": "builder-columns"
+    }
   }, [
-    r.TARGET !== "reactNative" ? (d(), T(i, {
+    s.TARGET !== "reactNative" ? (d(), T(r, {
       key: 0,
-      styles: s.columnsStyles
-    }, null, 8, ["styles"])) : b("", !0),
-    (d(!0), u(E, null, P(t.columns, (a, l) => (d(), u("div", {
+      styles: i.columnsStyles
+    }, null, 8, ["styles"])) : y("", !0),
+    (d(!0), m(E, null, P(t.columns, (a, l) => (d(), m("div", {
       key: l,
       class: "builder-column div-361b1o6wv2k-2",
-      style: I({
-        width: s.getColumnCssWidth(l),
-        marginLeft: `${l === 0 ? 0 : s.getGutterSize()}px`,
-        ...r.TARGET === "reactNative" ? s.reactNativeColumnStyles : {},
-        ...s.columnCssVars
-      })
+      style: I(i.columnCssVars(l)),
+      dataSet: {
+        "builder-block-name": "builder-column"
+      }
     }, [
-      Q(c, {
+      X(c, {
         blocks: a.blocks,
         path: `component.options.columns.${l}.blocks`,
         parent: t.builderBlock.id,
@@ -274,49 +250,49 @@ function Ce(e, n, t, o, r, s) {
     ], 4))), 128))
   ], 6);
 }
-const we = /* @__PURE__ */ g(_e, [["render", Ce], ["__scopeId", "data-v-64d36a32"]]), Ie = {
+const Se = /* @__PURE__ */ h(xe, [["render", ke], ["__scopeId", "data-v-d8ae54cc"]]), _e = {
   name: "builder-fragment-component",
   props: []
 };
-function Te(e, n, t, o, r, s) {
-  return d(), u("span", null, [
+function we(e, n, t, o, s, i) {
+  return d(), m("span", null, [
     A(e.$slots, "default")
   ]);
 }
-const Re = /* @__PURE__ */ g(Ie, [["render", Te]]);
-function z(e) {
+const Ce = /* @__PURE__ */ h(_e, [["render", we]]);
+function $(e) {
   return e.replace(/http(s)?:/, "");
 }
-function Ee(e = "", n, t) {
-  const o = new RegExp("([?&])" + n + "=.*?(&|$)", "i"), r = e.indexOf("?") !== -1 ? "&" : "?";
-  return e.match(o) ? e.replace(o, "$1" + n + "=" + encodeURIComponent(t) + "$2") : e + r + n + "=" + encodeURIComponent(t);
+function Ie(e = "", n, t) {
+  const o = new RegExp("([?&])" + n + "=.*?(&|$)", "i"), s = e.indexOf("?") !== -1 ? "&" : "?";
+  return e.match(o) ? e.replace(o, "$1" + n + "=" + encodeURIComponent(t) + "$2") : e + s + n + "=" + encodeURIComponent(t);
 }
-function Ae(e, n) {
+function Te(e, n) {
   if (!e || !(e != null && e.match(/cdn\.shopify\.com/)) || !n)
     return e;
   if (n === "master")
-    return z(e);
+    return $(e);
   const t = e.match(
     /(_\d+x(\d+)?)?(\.(jpg|jpeg|gif|png|bmp|bitmap|tiff|tif)(\?v=\d+)?)/i
   );
   if (t) {
-    const o = e.split(t[0]), r = t[3], s = n.match("x") ? n : `${n}x`;
-    return z(`${o[0]}_${s}${r}`);
+    const o = e.split(t[0]), s = t[3], i = n.match("x") ? n : `${n}x`;
+    return $(`${o[0]}_${i}${s}`);
   }
   return null;
 }
-function B(e) {
+function F(e) {
   if (!e)
     return e;
   const n = [100, 200, 400, 800, 1200, 1600, 2e3];
   if (e.match(/builder\.io/)) {
     let t = e;
     const o = Number(e.split("?width=")[1]);
-    return isNaN(o) || (t = `${t} ${o}w`), n.filter((r) => r !== o).map((r) => `${Ee(e, "width", r)} ${r}w`).concat([t]).join(", ");
+    return isNaN(o) || (t = `${t} ${o}w`), n.filter((s) => s !== o).map((s) => `${Ie(e, "width", s)} ${s}w`).concat([t]).join(", ");
   }
-  return e.match(/cdn\.shopify\.com/) ? n.map((t) => [Ae(e, `${t}x${t}`), t]).filter(([t]) => !!t).map(([t, o]) => `${t} ${o}w`).concat([e]).join(", ") : e;
+  return e.match(/cdn\.shopify\.com/) ? n.map((t) => [Te(e, `${t}x${t}`), t]).filter(([t]) => !!t).map(([t, o]) => `${t} ${o}w`).concat([e]).join(", ") : e;
 }
-const je = {
+const Re = {
   name: "builder-image",
   props: [
     "image",
@@ -340,10 +316,10 @@ const je = {
         return this.srcset;
       if (this.srcset && ((t = this.image) == null ? void 0 : t.includes("builder.io/api/v1/image"))) {
         if (!this.srcset.includes(this.image.split("?")[0]))
-          return console.debug("Removed given srcset"), B(n);
+          return console.debug("Removed given srcset"), F(n);
       } else if (this.image && !this.srcset)
-        return B(n);
-      return B(n);
+        return F(n);
+      return F(n);
     },
     webpSrcSet() {
       var e;
@@ -372,80 +348,80 @@ const je = {
     }
   }
 };
-const Oe = ["srcset"], Fe = ["alt", "role", "src", "srcset", "sizes"], Be = {
+const Ee = ["srcset"], Ae = ["alt", "role", "src", "srcset", "sizes"], je = {
   key: 2,
   class: "div-7jvpanrlkn-2"
 };
-function Pe(e, n, t, o, r, s) {
-  var i, c, a, l;
-  return d(), u(E, null, [
-    $("picture", null, [
-      s.webpSrcSet ? (d(), u("source", {
+function Ve(e, n, t, o, s, i) {
+  var r, c, a, l;
+  return d(), m(E, null, [
+    N("picture", null, [
+      i.webpSrcSet ? (d(), m("source", {
         key: 0,
         type: "image/webp",
-        srcset: s.webpSrcSet
-      }, null, 8, Oe)) : b("", !0),
-      $("img", {
+        srcset: i.webpSrcSet
+      }, null, 8, Ee)) : y("", !0),
+      N("img", {
         loading: "lazy",
         alt: t.altText,
         role: t.altText ? "presentation" : void 0,
         style: I({
           objectPosition: t.backgroundPosition || "center",
           objectFit: t.backgroundSize || "cover",
-          ...s.aspectRatioCss
+          ...i.aspectRatioCss
         }),
         class: j(
-          s._classStringToObject(
+          i._classStringToObject(
             "builder-image" + (t.className ? " " + t.className : "") + " img-7jvpanrlkn"
           )
         ),
         src: t.image,
-        srcset: s.srcSetToUse,
+        srcset: i.srcSetToUse,
         sizes: t.sizes
-      }, null, 14, Fe)
+      }, null, 14, Ae)
     ]),
-    t.aspectRatio && !(((c = (i = t.builderBlock) == null ? void 0 : i.children) == null ? void 0 : c.length) && t.fitContent) ? (d(), u("div", {
+    t.aspectRatio && !(((c = (r = t.builderBlock) == null ? void 0 : r.children) == null ? void 0 : c.length) && t.fitContent) ? (d(), m("div", {
       key: 0,
       class: "builder-image-sizer div-7jvpanrlkn",
       style: I({
         paddingTop: t.aspectRatio * 100 + "%"
       })
-    }, null, 4)) : b("", !0),
-    ((l = (a = t.builderBlock) == null ? void 0 : a.children) == null ? void 0 : l.length) && t.fitContent ? A(e.$slots, "default", { key: 1 }, void 0, !0) : b("", !0),
-    !t.fitContent && e.children ? (d(), u("div", Be, [
+    }, null, 4)) : y("", !0),
+    ((l = (a = t.builderBlock) == null ? void 0 : a.children) == null ? void 0 : l.length) && t.fitContent ? A(e.$slots, "default", { key: 1 }, void 0, !0) : y("", !0),
+    !t.fitContent && e.children ? (d(), m("div", je, [
       A(e.$slots, "default", {}, void 0, !0)
-    ])) : b("", !0)
+    ])) : y("", !0)
   ], 64);
 }
-const Ve = /* @__PURE__ */ g(je, [["render", Pe], ["__scopeId", "data-v-22833d9f"]]);
-function f() {
+const Be = /* @__PURE__ */ h(Re, [["render", Ve], ["__scopeId", "data-v-22833d9f"]]);
+function p() {
   return typeof window < "u" && typeof document < "u";
 }
-function Ue() {
-  return f() && window.self !== window.top;
+function Fe() {
+  return p() && window.self !== window.top;
 }
-function y() {
-  return Ue() && window.location.search.indexOf("builder.frameEditing=") !== -1;
+function v() {
+  return Fe() && window.location.search.indexOf("builder.frameEditing=") !== -1;
 }
-const Le = () => import("./block-styles.dbf81cfb.js").then((e) => e.default).catch((e) => {
+const Pe = () => import("./block-styles.bab3c28f.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component BlockStyles at ./render-block/block-styles.vue",
     e
   ), e;
-}), We = () => import("./render-block.e3ebf63d.js").then((e) => e.default).catch((e) => {
+}), Oe = () => import("./render-block.5350aee7.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlock at ./render-block/render-block.vue",
     e
   ), e;
-}), Ne = {
+}), Ue = {
   name: "render-blocks",
   components: {
-    RenderBlock: x(We),
-    BlockStyles: x(Le)
+    RenderBlock: x(Oe),
+    BlockStyles: x(Pe)
   },
   props: ["blocks", "parent", "path", "styleProp"],
   inject: {
-    builderContext: O.key
+    builderContext: V.key
   },
   computed: {
     className() {
@@ -456,7 +432,7 @@ const Le = () => import("./block-styles.dbf81cfb.js").then((e) => e.default).cat
   methods: {
     onClick() {
       var e, n;
-      y() && !((e = this.blocks) != null && e.length) && ((n = window.parent) == null || n.postMessage(
+      v() && !((e = this.blocks) != null && e.length) && ((n = window.parent) == null || n.postMessage(
         {
           type: "builder.clickEmptyBlocks",
           data: {
@@ -469,7 +445,7 @@ const Le = () => import("./block-styles.dbf81cfb.js").then((e) => e.default).cat
     },
     onMouseEnter() {
       var e, n;
-      y() && !((e = this.blocks) != null && e.length) && ((n = window.parent) == null || n.postMessage(
+      v() && !((e = this.blocks) != null && e.length) && ((n = window.parent) == null || n.postMessage(
         {
           type: "builder.hoverEmptyBlocks",
           data: {
@@ -491,36 +467,36 @@ const Le = () => import("./block-styles.dbf81cfb.js").then((e) => e.default).cat
     }
   }
 };
-const Me = ["builder-path", "builder-parent-id", "dataSet"];
-function $e(e, n, t, o, r, s) {
-  const i = k("render-block"), c = k("block-styles");
-  return d(), u("div", {
-    class: j(s._classStringToObject(s.className + " div-7fq9d0i380")),
+const We = ["builder-path", "builder-parent-id", "dataSet"];
+function Me(e, n, t, o, s, i) {
+  const r = k("render-block"), c = k("block-styles");
+  return d(), m("div", {
+    class: j(i._classStringToObject(i.className + " div-7fq9d0i380")),
     "builder-path": t.path,
     "builder-parent-id": t.parent,
     dataSet: {
-      class: s.className
+      class: i.className
     },
     style: I(t.styleProp),
-    onClick: n[0] || (n[0] = (a) => s.onClick()),
-    onMouseenter: n[1] || (n[1] = (a) => s.onMouseEnter())
+    onClick: n[0] || (n[0] = (a) => i.onClick()),
+    onMouseenter: n[1] || (n[1] = (a) => i.onMouseEnter())
   }, [
-    t.blocks ? (d(!0), u(E, { key: 0 }, P(t.blocks, (a, l) => (d(), T(i, {
+    t.blocks ? (d(!0), m(E, { key: 0 }, P(t.blocks, (a, l) => (d(), T(r, {
       key: "render-block-" + a.id,
       block: a,
-      context: s.builderContext
-    }, null, 8, ["block", "context"]))), 128)) : b("", !0),
-    t.blocks ? (d(!0), u(E, { key: 1 }, P(t.blocks, (a, l) => (d(), T(c, {
+      context: i.builderContext
+    }, null, 8, ["block", "context"]))), 128)) : y("", !0),
+    t.blocks ? (d(!0), m(E, { key: 1 }, P(t.blocks, (a, l) => (d(), T(c, {
       key: "block-style-" + a.id,
       block: a,
-      context: s.builderContext
-    }, null, 8, ["block", "context"]))), 128)) : b("", !0)
-  ], 46, Me);
+      context: i.builderContext
+    }, null, 8, ["block", "context"]))), 128)) : y("", !0)
+  ], 46, We);
 }
-const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180"]]), ee = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Le = /* @__PURE__ */ h(Ue, [["render", Me], ["__scopeId", "data-v-1112d180"]]), Z = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: ze
-}, Symbol.toStringTag, { value: "Module" })), Ke = {
+  default: Le
+}, Symbol.toStringTag, { value: "Module" })), Ne = {
   name: "Core:Button",
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
   defaultStyles: {
@@ -556,10 +532,10 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
   ],
   static: !0,
   noWrap: !0
-}, F = (e) => {
+}, B = (e) => {
   const n = e.toString().trim();
   return `return (${!n.startsWith("function") && !n.startsWith("(") ? "function " : ""}${n}).apply(this, arguments)`;
-}, He = {
+}, $e = {
   name: "Columns",
   inputs: [
     {
@@ -746,7 +722,7 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
           ]
         }
       ],
-      onChange: F((e) => {
+      onChange: B((e) => {
         function n() {
           t.forEach((o) => {
             o.delete("width");
@@ -754,9 +730,9 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
         }
         const t = e.get("columns");
         Array.isArray(t) && !!t.find(
-          (r) => r.get("width")
+          (s) => s.get("width")
         ) && (!!t.find(
-          (s) => !s.get("width")
+          (i) => !i.get("width")
         ) || t.reduce((c, a) => c + a.get("width"), 0) !== 100) && n();
       })
     },
@@ -783,13 +759,13 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
       advanced: !0
     }
   ]
-}, De = {
+}, He = {
   name: "Fragment",
   static: !0,
   hidden: !0,
   canHaveChildren: !0,
   noWrap: !0
-}, qe = {
+}, Ke = {
   name: "Image",
   static: !0,
   image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
@@ -808,32 +784,32 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
       allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
       required: !0,
       defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
-      onChange: F(
+      onChange: B(
         (e) => {
           e.delete("srcset"), e.delete("noWebp");
-          function t(i, c = 6e4) {
+          function t(r, c = 6e4) {
             return new Promise((a, l) => {
-              const m = document.createElement("img");
-              let p = !1;
-              m.onload = () => {
-                p = !0, a(m);
-              }, m.addEventListener("error", (h) => {
-                console.warn("Image load failed", h.error), l(h.error);
-              }), m.src = i, setTimeout(() => {
-                p || l(new Error("Image load timed out"));
+              const u = document.createElement("img");
+              let g = !1;
+              u.onload = () => {
+                g = !0, a(u);
+              }, u.addEventListener("error", (f) => {
+                console.warn("Image load failed", f.error), l(f.error);
+              }), u.src = r, setTimeout(() => {
+                g || l(new Error("Image load timed out"));
               }, c);
             });
           }
-          function o(i) {
-            return Math.round(i * 1e3) / 1e3;
+          function o(r) {
+            return Math.round(r * 1e3) / 1e3;
           }
-          const r = e.get("image"), s = e.get("aspectRatio");
-          if (fetch(r).then((i) => i.blob()).then((i) => {
-            i.type.includes("svg") && e.set("noWebp", !0);
-          }), r && (!s || s === 0.7041))
-            return t(r).then((i) => {
+          const s = e.get("image"), i = e.get("aspectRatio");
+          if (fetch(s).then((r) => r.blob()).then((r) => {
+            r.type.includes("svg") && e.set("noWebp", !0);
+          }), s && (!i || i === 0.7041))
+            return t(s).then((r) => {
               const c = e.get("aspectRatio");
-              e.get("image") === r && (!c || c === 0.7041) && i.width && i.height && (e.set("aspectRatio", o(i.height / i.width)), e.set("height", i.height), e.set("width", i.width));
+              e.get("image") === s && (!c || c === 0.7041) && r.width && r.height && (e.set("aspectRatio", o(r.height / r.width)), e.set("height", r.height), e.set("width", r.width));
             });
         }
       )
@@ -916,7 +892,7 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
       defaultValue: 0.7041
     }
   ]
-}, Ge = {
+}, ze = {
   name: "Core:Section",
   static: !0,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -960,27 +936,27 @@ const ze = /* @__PURE__ */ g(Ne, [["render", $e], ["__scopeId", "data-v-1112d180
       }
     }
   ]
-}, Je = {
+}, De = {
   name: "builder-section-component",
   props: ["maxWidth", "attributes"],
   methods: {
     filterAttrs: function(n = {}, t) {
       const o = "v-on:";
-      return Object.keys(n).filter((r) => {
-        const s = r.startsWith(o);
-        return t ? s : !s;
+      return Object.keys(n).filter((s) => {
+        const i = s.startsWith(o);
+        return t ? i : !i;
       }).reduce(
-        (r, s) => ({
-          ...r,
-          [s.replace(o, "")]: n[s]
+        (s, i) => ({
+          ...s,
+          [i.replace(o, "")]: n[i]
         }),
         {}
       );
     }
   }
 };
-function Ye(e, n, t, o, r, s) {
-  return d(), u("section", _({
+function qe(e, n, t, o, s, i) {
+  return d(), m("section", S({
     style: {
       width: "100%",
       alignSelf: "stretch",
@@ -993,11 +969,11 @@ function Ye(e, n, t, o, r, s) {
       marginLeft: "auto",
       marginRight: "auto"
     }
-  }, s.filterAttrs(t.attributes, !1), w(s.filterAttrs(t.attributes, !0), !0)), [
+  }, i.filterAttrs(t.attributes, !1), C(i.filterAttrs(t.attributes, !0), !0)), [
     A(e.$slots, "default")
   ], 16);
 }
-const Xe = /* @__PURE__ */ g(Je, [["render", Ye]]), Qe = {
+const Ge = /* @__PURE__ */ h(De, [["render", qe]]), Je = {
   name: "Symbol",
   noWrap: !0,
   static: !0,
@@ -1036,11 +1012,11 @@ const Xe = /* @__PURE__ */ g(Je, [["render", Ye]]), Qe = {
     }
   ]
 };
-function Ze() {
+function Ye() {
   return typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : globalThis;
 }
-function et() {
-  const e = Ze().fetch;
+function Xe() {
+  const e = Ye().fetch;
   if (typeof e > "u")
     throw console.warn(
       `Builder SDK could not find a global fetch function. Make sure you have a polyfill for fetch in your project. 
@@ -1048,12 +1024,12 @@ function et() {
     ), new Error("Builder SDK could not find a global `fetch` function");
   return e;
 }
-const te = et(), tt = (e) => {
+const ee = Xe(), _ = (e) => e != null, Qe = (e) => {
   if (e === "localhost" || e === "127.0.0.1")
     return e;
   const n = e.split(".");
   return n.length > 2 ? n.slice(1).join(".") : e;
-}, ne = async ({
+}, te = async ({
   name: e,
   canTrack: n
 }) => {
@@ -1064,23 +1040,23 @@ const te = et(), tt = (e) => {
     console.debug("[COOKIE] GET error: ", o);
     return;
   }
-}, nt = (e) => e.map(([n, t]) => t ? `${n}=${t}` : n).filter(S).join("; "), ot = [
+}, Ze = (e) => e.map(([n, t]) => t ? `${n}=${t}` : n).filter(_).join("; "), et = [
   ["secure", ""],
   ["SameSite", "None"]
-], st = ({
+], tt = ({
   name: e,
   value: n,
   expires: t
 }) => {
-  const r = (f() ? location.protocol === "https:" : !0) ? ot : [[]], s = t ? [["expires", t.toUTCString()]] : [[]], i = [
+  const s = (p() ? location.protocol === "https:" : !0) ? et : [[]], i = t ? [["expires", t.toUTCString()]] : [[]], r = [
     [e, n],
-    ...s,
+    ...i,
     ["path", "/"],
-    ["domain", tt(window.location.hostname)],
-    ...r
+    ["domain", Qe(window.location.hostname)],
+    ...s
   ];
-  return nt(i);
-}, oe = async ({
+  return Ze(r);
+}, ne = async ({
   name: e,
   value: n,
   expires: t,
@@ -1089,32 +1065,32 @@ const te = et(), tt = (e) => {
   try {
     if (!o)
       return;
-    const r = st({ name: e, value: n, expires: t });
-    document.cookie = r;
-  } catch (r) {
-    console.warn("[COOKIE] SET error: ", r);
+    const s = tt({ name: e, value: n, expires: t });
+    document.cookie = s;
+  } catch (s) {
+    console.warn("[COOKIE] SET error: ", s);
   }
-}, rt = "builderio.variations", se = (e) => `${rt}.${e}`, it = ({
+}, nt = "builderio.variations", oe = (e) => `${nt}.${e}`, ot = ({
   contentId: e,
   canTrack: n
-}) => ne({ name: se(e), canTrack: n }), at = ({
+}) => te({ name: oe(e), canTrack: n }), it = ({
   contentId: e,
   canTrack: n,
   value: t
-}) => oe({ name: se(e), value: t, canTrack: n }), ct = (e) => S(e.id) && S(e.variations) && Object.keys(e.variations).length > 0, lt = ({
+}) => ne({ name: oe(e), value: t, canTrack: n }), st = (e) => _(e.id) && _(e.variations) && Object.keys(e.variations).length > 0, rt = ({
   id: e,
   variations: n
 }) => {
-  var r;
+  var s;
   let t = 0;
   const o = Math.random();
-  for (const s in n) {
-    const i = (r = n[s]) == null ? void 0 : r.testRatio;
-    if (t += i, o < t)
-      return s;
+  for (const i in n) {
+    const r = (s = n[i]) == null ? void 0 : s.testRatio;
+    if (t += r, o < t)
+      return i;
   }
   return e;
-}, K = ({
+}, H = ({
   item: e,
   testGroupId: n
 }) => {
@@ -1127,170 +1103,181 @@ const te = et(), tt = (e) => {
     testVariationId: t.id,
     testVariationName: t.name || (t.id === e.id ? "Default" : "")
   };
-}, dt = async ({
+}, at = async ({
   item: e,
   canTrack: n
 }) => {
-  const t = await it({
+  const t = await ot({
     canTrack: n,
     contentId: e.id
-  }), o = t ? K({ item: e, testGroupId: t }) : void 0;
+  }), o = t ? H({ item: e, testGroupId: t }) : void 0;
   if (o)
     return o;
   {
-    const r = lt({
+    const s = rt({
       variations: e.variations,
       id: e.id
     });
-    return at({
+    return it({
       contentId: e.id,
-      value: r,
+      value: s,
       canTrack: n
-    }).catch((s) => {
-      console.error("could not store A/B test variation: ", s);
-    }), K({ item: e, testGroupId: r });
+    }).catch((i) => {
+      console.error("could not store A/B test variation: ", i);
+    }), H({ item: e, testGroupId: s });
   }
-}, ut = async ({
+}, ct = async ({
   item: e,
   canTrack: n
 }) => {
-  if (!ct(e))
+  if (!st(e))
     return;
-  const t = await dt({ item: e, canTrack: n });
+  const t = await at({ item: e, canTrack: n });
   Object.assign(e, t);
 };
-function V(e, n = null, t = ".") {
-  return Object.keys(e).reduce((o, r) => {
-    const s = e[r], i = [n, r].filter(Boolean).join(t);
+function O(e, n = null, t = ".") {
+  return Object.keys(e).reduce((o, s) => {
+    const i = e[s], r = [n, s].filter(Boolean).join(t);
     return [
-      typeof s == "object",
-      s !== null,
-      !(Array.isArray(s) && s.length === 0)
-    ].every(Boolean) ? { ...o, ...V(s, i, t) } : { ...o, [i]: s };
+      typeof i == "object",
+      i !== null,
+      !(Array.isArray(i) && i.length === 0)
+    ].every(Boolean) ? { ...o, ...O(i, r, t) } : { ...o, [r]: i };
   }, {});
 }
-const H = "builder.", mt = "options.", pt = (e) => {
+const K = "builder.", lt = "options.", dt = (e) => {
   const n = {};
   return e.forEach((t, o) => {
     n[o] = t;
   }), n;
-}, ht = (e) => {
+}, ut = (e) => {
   if (!e)
     return {};
-  const n = re(e), t = {};
+  const n = ie(e), t = {};
   return Object.keys(n).forEach((o) => {
-    if (o.startsWith(H)) {
-      const r = o.replace(H, "").replace(mt, "");
-      t[r] = n[o];
+    if (o.startsWith(K)) {
+      const s = o.replace(K, "").replace(lt, "");
+      t[s] = n[o];
     }
   }), t;
-}, ft = () => {
-  if (!f())
+}, mt = () => {
+  if (!p())
     return {};
   const e = new URLSearchParams(window.location.search);
-  return ht(e);
-}, re = (e) => e instanceof URLSearchParams ? pt(e) : e, gt = (e) => {
+  return ut(e);
+}, ie = (e) => e instanceof URLSearchParams ? dt(e) : e, pt = (e) => {
   const {
     limit: n = 30,
     userAttributes: t,
     query: o,
-    noTraverse: r = !1,
-    model: s,
-    apiKey: i,
+    noTraverse: s = !1,
+    model: i,
+    apiKey: r,
     includeRefs: c = !0,
-    locale: a
+    locale: a,
+    apiVersion: l = "v2"
   } = e;
-  if (!i)
+  if (!r)
     throw new Error("Missing API key");
-  const l = new URL(
-    `https://cdn.builder.io/api/v2/content/${s}?apiKey=${i}&limit=${n}&noTraverse=${r}&includeRefs=${c}${a ? `&locale=${a}` : ""}`
-  ), m = {
-    ...ft(),
-    ...re(e.options || {})
-  }, p = V(m);
-  for (const h in p)
-    l.searchParams.set(h, String(p[h]));
-  if (t && l.searchParams.set("userAttributes", JSON.stringify(t)), o) {
-    const h = V({ query: o });
-    for (const v in h)
-      l.searchParams.set(v, JSON.stringify(h[v]));
+  if (!["v2", "v3"].includes(l))
+    throw new Error(
+      `Invalid apiVersion: expected 'v2' or 'v3', received '${l}'`
+    );
+  const u = new URL(
+    `https://cdn.builder.io/api/${l}/content/${i}?apiKey=${r}&limit=${n}&noTraverse=${s}&includeRefs=${c}${a ? `&locale=${a}` : ""}`
+  ), g = {
+    ...mt(),
+    ...ie(e.options || {})
+  }, f = O(g);
+  for (const b in f)
+    u.searchParams.set(b, String(f[b]));
+  if (t && u.searchParams.set("userAttributes", JSON.stringify(t)), o) {
+    const b = O({ query: o });
+    for (const w in b)
+      u.searchParams.set(w, JSON.stringify(b[w]));
   }
-  return l;
+  return u;
 };
-async function ie(e) {
-  return (await bt({ ...e, limit: 1 })).results[0] || null;
+async function se(e) {
+  return (await ht({ ...e, limit: 1 })).results[0] || null;
 }
-async function bt(e) {
-  const n = gt(e), o = await (await te(n.href)).json(), r = e.canTrack !== !1;
-  if (r && Array.isArray(o.results))
-    for (const s of o.results)
-      await ut({ item: s, canTrack: r });
+async function ht(e) {
+  const n = pt(e), o = await (await ee(n.href)).json(), s = e.canTrack !== !1;
+  if (s && Array.isArray(o.results))
+    for (const i of o.results)
+      await ct({ item: i, canTrack: s });
   return o;
 }
-const yt = () => Promise.resolve().then(() => An).then((e) => e.default).catch((e) => {
+const ft = () => Promise.resolve().then(() => Tn).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderContent at ../../components/render-content/render-content.vue",
     e
   ), e;
-}), vt = {
+}), gt = {
   name: "builder-symbol",
-  components: { RenderContent: x(yt) },
+  components: { RenderContent: x(ft) },
   props: ["attributes", "symbol", "dynamic"],
   data() {
-    return { fetchedContent: null };
+    var e, n, t;
+    return {
+      className: [
+        ...Object.keys(this.attributes.class),
+        "builder-symbol",
+        (e = this.symbol) != null && e.inline ? "builder-inline-symbol" : void 0,
+        ((n = this.symbol) == null ? void 0 : n.dynamic) || this.dynamic ? "builder-dynamic-symbol" : void 0
+      ].filter(Boolean).join(" "),
+      contentToUse: (t = this.symbol) == null ? void 0 : t.content
+    };
   },
   inject: {
-    builderContext: O.key
+    builderContext: V.key
+  },
+  mounted() {
+    this.fetchContent();
   },
   watch: {
     onUpdateHook0: {
       handler() {
-        var n;
-        const e = this.symbol;
-        e && !e.content && !this.fetchedContent && e.model && ((n = this.builderContext) == null ? void 0 : n.apiKey) && ie({
-          model: e.model,
-          apiKey: this.builderContext.apiKey,
-          query: {
-            id: e.entry
-          }
-        }).then((t) => {
-          this.fetchedContent = t;
-        });
+        this.fetchContent();
       },
       immediate: !0
     }
   },
   computed: {
-    className() {
-      var e, n;
-      return [
-        ...Object.keys(this.attributes.class),
-        "builder-symbol",
-        (e = this.symbol) != null && e.inline ? "builder-inline-symbol" : void 0,
-        ((n = this.symbol) == null ? void 0 : n.dynamic) || this.dynamic ? "builder-dynamic-symbol" : void 0
-      ].filter(Boolean).join(" ");
-    },
-    contentToUse() {
-      var e;
-      return ((e = this.symbol) == null ? void 0 : e.content) || this.fetchedContent;
-    },
     onUpdateHook0() {
       return {
-        0: this.symbol,
-        1: this.fetchedContent
+        0: this.symbol
       };
     }
   },
   methods: {
+    fetchContent() {
+      var e, n;
+      !this.contentToUse && ((e = this.symbol) == null ? void 0 : e.model) && ((n = this.builderContext) == null ? void 0 : n.apiKey) && se({
+        model: this.symbol.model,
+        apiKey: this.builderContext.apiKey,
+        apiVersion: this.builderContext.apiVersion,
+        query: {
+          id: this.symbol.entry
+        }
+      }).then((t) => {
+        t && (this.contentToUse = t);
+      }).catch((t) => {
+        console.error(
+          "[Builder.io]: Could not fetch symbol content: ",
+          t
+        );
+      });
+    },
     filterAttrs: function(n = {}, t) {
       const o = "v-on:";
-      return Object.keys(n).filter((r) => {
-        const s = r.startsWith(o);
-        return t ? s : !s;
+      return Object.keys(n).filter((s) => {
+        const i = s.startsWith(o);
+        return t ? i : !i;
       }).reduce(
-        (r, s) => ({
-          ...r,
-          [s.replace(o, "")]: n[s]
+        (s, i) => ({
+          ...s,
+          [i.replace(o, "")]: n[i]
         }),
         {}
       );
@@ -1305,31 +1292,32 @@ const yt = () => Promise.resolve().then(() => An).then((e) => e.default).catch((
       return n;
     }
   }
-}, xt = ["dataSet"];
-function kt(e, n, t, o, r, s) {
-  var c, a, l, m, p;
-  const i = k("render-content");
-  return d(), u("div", _({
+}, bt = ["dataSet"];
+function yt(e, n, t, o, s, i) {
+  var c, a, l, u;
+  const r = k("render-content");
+  return d(), m("div", S({
     dataSet: {
       class: s.className
     },
-    class: s._classStringToObject(s.className)
-  }, s.filterAttrs(t.attributes, !1), w(s.filterAttrs(t.attributes, !0), !0)), [
-    Q(i, {
-      apiKey: s.builderContext.apiKey,
-      context: s.builderContext.context,
-      customComponents: Object.values(s.builderContext.registeredComponents),
+    class: i._classStringToObject(s.className)
+  }, i.filterAttrs(t.attributes, !1), C(i.filterAttrs(t.attributes, !0), !0)), [
+    X(r, {
+      apiVersion: i.builderContext.apiVersion,
+      apiKey: i.builderContext.apiKey,
+      context: i.builderContext.context,
+      customComponents: Object.values(i.builderContext.registeredComponents),
       data: {
         ...(c = t.symbol) == null ? void 0 : c.data,
-        ...s.builderContext.state,
-        ...(m = (l = (a = t.symbol) == null ? void 0 : a.content) == null ? void 0 : l.data) == null ? void 0 : m.state
+        ...i.builderContext.state,
+        ...(l = (a = s.contentToUse) == null ? void 0 : a.data) == null ? void 0 : l.state
       },
-      model: (p = t.symbol) == null ? void 0 : p.model,
+      model: (u = t.symbol) == null ? void 0 : u.model,
       content: s.contentToUse
-    }, null, 8, ["apiKey", "context", "customComponents", "data", "model", "content"])
-  ], 16, xt);
+    }, null, 8, ["apiVersion", "apiKey", "context", "customComponents", "data", "model", "content"])
+  ], 16, bt);
 }
-const St = /* @__PURE__ */ g(vt, [["render", kt]]), _t = {
+const vt = /* @__PURE__ */ h(gt, [["render", yt]]), xt = {
   name: "Text",
   static: !0,
   image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-text_fields-24px%20(1).svg?alt=media&token=12177b73-0ee3-42ca-98c6-0dd003de1929",
@@ -1348,20 +1336,20 @@ const St = /* @__PURE__ */ g(vt, [["render", kt]]), _t = {
     height: "auto",
     textAlign: "center"
   }
-}, Ct = {
+}, kt = {
   name: "builder-text",
   props: ["text"]
-}, wt = ["innerHTML"];
-function It(e, n, t, o, r, s) {
-  return d(), u("span", {
+}, St = ["innerHTML"];
+function _t(e, n, t, o, s, i) {
+  return d(), m("span", {
     class: "builder-text",
     innerHTML: t.text,
     style: {
       outline: "none"
     }
-  }, null, 8, wt);
+  }, null, 8, St);
 }
-const Tt = /* @__PURE__ */ g(Ct, [["render", It]]), Rt = {
+const wt = /* @__PURE__ */ h(kt, [["render", _t]]), Ct = {
   name: "Video",
   canHaveChildren: !0,
   defaultStyles: {
@@ -1462,7 +1450,7 @@ const Tt = /* @__PURE__ */ g(Ct, [["render", It]]), Rt = {
       advanced: !0
     }
   ]
-}, Et = {
+}, It = {
   name: "builder-video",
   props: [
     "autoPlay",
@@ -1503,23 +1491,23 @@ const Tt = /* @__PURE__ */ g(Ct, [["render", It]]), Rt = {
       };
     }
   }
-}, At = ["src", "poster"];
-function jt(e, n, t, o, r, s) {
-  var i;
-  return d(), u("video", _({
+}, Tt = ["src", "poster"];
+function Rt(e, n, t, o, s, i) {
+  var r;
+  return d(), m("video", S({
     style: {
       width: "100%",
       height: "100%",
-      ...(i = t.attributes) == null ? void 0 : i.style,
+      ...(r = t.attributes) == null ? void 0 : r.style,
       objectFit: t.fit,
       objectPosition: t.position,
       borderRadius: 1
     },
     src: t.video || "no-src",
     poster: t.posterImage
-  }, s.spreadProps), null, 16, At);
+  }, i.spreadProps), null, 16, Tt);
 }
-const Ot = /* @__PURE__ */ g(Et, [["render", jt]]), Ft = {
+const Et = /* @__PURE__ */ h(It, [["render", Rt]]), At = {
   name: "Embed",
   static: !0,
   inputs: [
@@ -1529,7 +1517,7 @@ const Ot = /* @__PURE__ */ g(Et, [["render", jt]]), Ft = {
       required: !0,
       defaultValue: "",
       helperText: "e.g. enter a youtube url, google map, etc",
-      onChange: F(
+      onChange: B(
         (e) => {
           const n = e.get("url");
           if (n)
@@ -1554,11 +1542,11 @@ const Ot = /* @__PURE__ */ g(Et, [["render", jt]]), Ft = {
       hideFromUI: !0
     }
   ]
-}, Bt = [
+}, jt = [
   "text/javascript",
   "application/javascript",
   "application/ecmascript"
-], Pt = (e) => Bt.includes(e.type), Vt = {
+], Vt = (e) => jt.includes(e.type), Bt = {
   name: "builder-embed",
   props: ["content"],
   data() {
@@ -1591,7 +1579,7 @@ const Ot = /* @__PURE__ */ g(Et, [["render", jt]]), Ft = {
           this.scriptsInserted.push(t.src);
           const o = document.createElement("script");
           o.async = !0, o.src = t.src, document.head.appendChild(o);
-        } else if (Pt(t) && !this.scriptsRun.includes(t.innerText))
+        } else if (Vt(t) && !this.scriptsRun.includes(t.innerText))
           try {
             this.scriptsRun.push(t.innerText), new Function(t.innerText)();
           } catch (o) {
@@ -1600,15 +1588,15 @@ const Ot = /* @__PURE__ */ g(Et, [["render", jt]]), Ft = {
       }
     }
   }
-}, Ut = ["innerHTML"];
-function Lt(e, n, t, o, r, s) {
-  return d(), u("div", {
+}, Ft = ["innerHTML"];
+function Pt(e, n, t, o, s, i) {
+  return d(), m("div", {
     class: "builder-embed",
     ref: "elem",
     innerHTML: t.content
-  }, null, 8, Ut);
+  }, null, 8, Ft);
 }
-const Wt = /* @__PURE__ */ g(Vt, [["render", Lt]]), Nt = {
+const Ot = /* @__PURE__ */ h(Bt, [["render", Pt]]), Ut = {
   name: "builder-img-component",
   props: [
     "backgroundSize",
@@ -1619,36 +1607,36 @@ const Wt = /* @__PURE__ */ g(Vt, [["render", Lt]]), Nt = {
     "attributes"
   ],
   data() {
-    return { isEditing: y };
+    return { isEditing: v };
   },
   methods: {
     filterAttrs: function(n = {}, t) {
       const o = "v-on:";
-      return Object.keys(n).filter((r) => {
-        const s = r.startsWith(o);
-        return t ? s : !s;
+      return Object.keys(n).filter((s) => {
+        const i = s.startsWith(o);
+        return t ? i : !i;
       }).reduce(
-        (r, s) => ({
-          ...r,
-          [s.replace(o, "")]: n[s]
+        (s, i) => ({
+          ...s,
+          [i.replace(o, "")]: n[i]
         }),
         {}
       );
     }
   }
-}, Mt = ["alt", "src"];
-function $t(e, n, t, o, r, s) {
-  return d(), u("img", _({
+}, Wt = ["alt", "src"];
+function Mt(e, n, t, o, s, i) {
+  return d(), m("img", S({
     style: {
       objectFit: t.backgroundSize || "cover",
       objectPosition: t.backgroundPosition || "center"
     },
-    key: r.isEditing() && t.imgSrc || "default-key",
+    key: s.isEditing() && t.imgSrc || "default-key",
     alt: t.altText,
     src: t.imgSrc || t.image
-  }, s.filterAttrs(t.attributes, !1), w(s.filterAttrs(t.attributes, !0), !0)), null, 16, Mt);
+  }, i.filterAttrs(t.attributes, !1), C(i.filterAttrs(t.attributes, !0), !0)), null, 16, Wt);
 }
-const zt = /* @__PURE__ */ g(Nt, [["render", $t]]), Kt = {
+const Lt = /* @__PURE__ */ h(Ut, [["render", Mt]]), Nt = {
   name: "Raw:Img",
   hideFromInsertMenu: !0,
   image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
@@ -1663,7 +1651,7 @@ const zt = /* @__PURE__ */ g(Nt, [["render", $t]]), Kt = {
   ],
   noWrap: !0,
   static: !0
-}, Ht = {
+}, $t = {
   name: "builder-custom-code",
   props: ["replaceNodes", "code"],
   data() {
@@ -1710,19 +1698,19 @@ const zt = /* @__PURE__ */ g(Nt, [["render", $t]]), Kt = {
       return n;
     }
   }
-}, Dt = ["innerHTML"];
-function qt(e, n, t, o, r, s) {
-  return d(), u("div", {
+}, Ht = ["innerHTML"];
+function Kt(e, n, t, o, s, i) {
+  return d(), m("div", {
     ref: "elem",
     class: j(
-      s._classStringToObject(
+      i._classStringToObject(
         "builder-custom-code" + (t.replaceNodes ? " replace-nodes" : "")
       )
     ),
     innerHTML: t.code
-  }, null, 10, Dt);
+  }, null, 10, Ht);
 }
-const Gt = /* @__PURE__ */ g(Ht, [["render", qt]]), Jt = {
+const zt = /* @__PURE__ */ h($t, [["render", Kt]]), Dt = {
   name: "Custom Code",
   static: !0,
   requiredPermissions: ["editCode"],
@@ -1748,35 +1736,35 @@ const Gt = /* @__PURE__ */ g(Ht, [["render", qt]]), Jt = {
       advanced: !0
     }
   ]
-}, Yt = () => [
-  { component: ge, ...Ke },
-  { component: we, ...He },
-  { component: Gt, ...Jt },
-  { component: Wt, ...Ft },
-  { component: Re, ...De },
-  { component: Ve, ...qe },
-  { component: zt, ...Kt },
-  { component: Xe, ...Ge },
-  { component: St, ...Qe },
-  { component: Tt, ..._t },
-  { component: Ot, ...Rt }
+}, qt = () => [
+  { component: fe, ...Ne },
+  { component: Se, ...$e },
+  { component: zt, ...Dt },
+  { component: Ot, ...At },
+  { component: Ce, ...He },
+  { component: Be, ...Ke },
+  { component: Lt, ...Nt },
+  { component: Ge, ...ze },
+  { component: vt, ...Je },
+  { component: wt, ...xt },
+  { component: Et, ...Ct }
 ];
-function D({
+function z({
   code: e,
   context: n,
   state: t,
   event: o,
-  isExpression: r = !0
+  isExpression: s = !0
 }) {
   if (e === "") {
     console.warn("Skipping evaluation of empty code block.");
     return;
   }
-  const s = {
-    isEditing: y(),
-    isBrowser: f(),
-    isServer: !f()
-  }, c = r && !(e.includes(";") || e.includes(" return ") || e.trim().startsWith("return ")) ? `return (${e});` : e;
+  const i = {
+    isEditing: v(),
+    isBrowser: p(),
+    isServer: !p()
+  }, c = s && !(e.includes(";") || e.includes(" return ") || e.trim().startsWith("return ")) ? `return (${e});` : e;
   try {
     return new Function(
       "builder",
@@ -1785,7 +1773,7 @@ function D({
       "context",
       "event",
       c
-    )(s, s, t, n, o);
+    )(i, i, t, n, o);
   } catch (a) {
     console.warn(
       `Builder custom code error: 
@@ -1798,113 +1786,113 @@ function D({
     );
   }
 }
-function Xt() {
-  return !f() || y() ? !1 : Boolean(location.search.indexOf("builder.preview=") !== -1);
+function Gt() {
+  return !p() || v() ? !1 : Boolean(location.search.indexOf("builder.preview=") !== -1);
 }
-const ae = [];
-function Bn(e, n) {
-  return ae.push({ component: e, ...n }), console.warn(
+const re = [];
+function An(e, n) {
+  return re.push({ component: e, ...n }), console.warn(
     "registerComponent is deprecated. Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK."
   ), e;
 }
-const Qt = ({
+const Jt = ({
   component: e,
   ...n
 }) => ({
   type: "builder.registerComponent",
-  data: en(n)
-}), Zt = (e) => typeof e == "function" ? F(e) : L(e), en = ({
+  data: Xt(n)
+}), Yt = (e) => typeof e == "function" ? B(e) : W(e), Xt = ({
   inputs: e,
   ...n
 }) => ({
-  ...L(n),
+  ...W(n),
   inputs: e == null ? void 0 : e.map(
     (t) => Object.entries(t).reduce(
-      (o, [r, s]) => ({
+      (o, [s, i]) => ({
         ...o,
-        [r]: Zt(s)
+        [s]: Yt(i)
       }),
       {}
     )
   )
 });
-function tn() {
+function Qt() {
   return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(e) {
     const n = Math.random() * 16 | 0;
     return (e == "x" ? n : n & 3 | 8).toString(16);
   });
 }
-function ce() {
-  return tn().replace(/-/g, "");
+function ae() {
+  return Qt().replace(/-/g, "");
 }
-const le = "builderSessionId", nn = async ({
+const ce = "builderSessionId", Zt = async ({
   canTrack: e
 }) => {
   if (!e)
     return;
-  const n = await ne({
-    name: le,
+  const n = await te({
+    name: ce,
     canTrack: e
   });
-  if (S(n))
+  if (_(n))
     return n;
   {
-    const t = on();
-    return sn({ id: t, canTrack: e }), t;
+    const t = en();
+    return tn({ id: t, canTrack: e }), t;
   }
-}, on = () => ce(), sn = ({
+}, en = () => ae(), tn = ({
   id: e,
   canTrack: n
-}) => oe({ name: le, value: e, canTrack: n }), de = () => f() && typeof localStorage < "u" ? localStorage : void 0, rn = ({
+}) => ne({ name: ce, value: e, canTrack: n }), le = () => p() && typeof localStorage < "u" ? localStorage : void 0, nn = ({
   key: e,
   canTrack: n
 }) => {
   var t;
   try {
-    return n ? (t = de()) == null ? void 0 : t.getItem(e) : void 0;
+    return n ? (t = le()) == null ? void 0 : t.getItem(e) : void 0;
   } catch (o) {
     console.debug("[LocalStorage] GET error: ", o);
     return;
   }
-}, an = ({
+}, on = ({
   key: e,
   canTrack: n,
   value: t
 }) => {
   var o;
   try {
-    n && ((o = de()) == null || o.setItem(e, t));
-  } catch (r) {
-    console.debug("[LocalStorage] SET error: ", r);
+    n && ((o = le()) == null || o.setItem(e, t));
+  } catch (s) {
+    console.debug("[LocalStorage] SET error: ", s);
   }
-}, ue = "builderVisitorId", cn = ({ canTrack: e }) => {
+}, de = "builderVisitorId", sn = ({ canTrack: e }) => {
   if (!e)
     return;
-  const n = rn({
-    key: ue,
+  const n = nn({
+    key: de,
     canTrack: e
   });
-  if (S(n))
+  if (_(n))
     return n;
   {
-    const t = ln();
-    return dn({ id: t, canTrack: e }), t;
+    const t = rn();
+    return an({ id: t, canTrack: e }), t;
   }
-}, ln = () => ce(), dn = ({
+}, rn = () => ae(), an = ({
   id: e,
   canTrack: n
-}) => an({
-  key: ue,
+}) => on({
+  key: de,
   value: e,
   canTrack: n
-}), un = () => {
-  if (f()) {
+}), cn = () => {
+  if (p()) {
     const e = new URL(location.href);
     return e.pathname === "" && (e.pathname = "/"), e;
   } else
     return console.warn("Cannot get location for tracking in non-browser environment"), null;
-}, mn = () => typeof navigator == "object" && navigator.userAgent || "", pn = () => {
-  const e = mn(), n = {
+}, ln = () => typeof navigator == "object" && navigator.userAgent || "", dn = () => {
+  const e = ln(), n = {
     Android() {
       return e.match(/Android/i);
     },
@@ -1923,38 +1911,38 @@ const le = "builderSessionId", nn = async ({
     any() {
       return n.Android() || n.BlackBerry() || n.iOS() || n.Opera() || n.Windows() || R === "reactNative";
     }
-  }, t = e.match(/Tablet|iPad/i), o = un();
+  }, t = e.match(/Tablet|iPad/i), o = cn();
   return {
     urlPath: o == null ? void 0 : o.pathname,
     host: (o == null ? void 0 : o.host) || (o == null ? void 0 : o.hostname),
     device: t ? "tablet" : n.any() ? "mobile" : "desktop"
   };
-}, hn = async ({
+}, un = async ({
   canTrack: e
 }) => {
   if (!e)
     return { visitorId: void 0, sessionId: void 0 };
-  const n = await nn({ canTrack: e }), t = cn({ canTrack: e });
+  const n = await Zt({ canTrack: e }), t = sn({ canTrack: e });
   return {
     sessionId: n,
     visitorId: t
   };
-}, fn = async ({
+}, mn = async ({
   type: e,
   canTrack: n,
   apiKey: t,
   metadata: o,
-  ...r
+  ...s
 }) => ({
   type: e,
   data: {
-    ...r,
+    ...s,
     metadata: {
       url: location.href,
       ...o
     },
-    ...await hn({ canTrack: n }),
-    userAttributes: pn(),
+    ...await un({ canTrack: n }),
+    userAttributes: dn(),
     ownerId: t
   }
 });
@@ -1965,11 +1953,11 @@ async function U(e) {
     );
     return;
   }
-  if (!!e.canTrack && !y() && !!(f() || R === "reactNative"))
+  if (!!e.canTrack && !v() && !!(p() || R === "reactNative"))
     return fetch("https://builder.io/api/v1/track", {
       method: "POST",
       body: JSON.stringify({
-        events: [await fn(e)]
+        events: [await mn(e)]
       }),
       headers: {
         "content-type": "application/json"
@@ -1979,10 +1967,10 @@ async function U(e) {
       console.error("Failed to track: ", n);
     });
 }
-const Pn = (e) => U({ ...e, canTrack: !0 }), q = {};
-function gn(e, n) {
-  let t = q[e];
-  if (t || (t = q[e] = []), t.push(n), f()) {
+const jn = (e) => U({ ...e, canTrack: !0 }), D = {};
+function pn(e, n) {
+  let t = D[e];
+  if (t || (t = D[e] = []), t.push(n), p()) {
     const o = {
       type: "builder.register",
       data: {
@@ -1992,13 +1980,13 @@ function gn(e, n) {
     };
     try {
       parent.postMessage(o, "*"), parent !== window && window.postMessage(o, "*");
-    } catch (r) {
-      console.debug("Could not postmessage", r);
+    } catch (s) {
+      console.debug("Could not postmessage", s);
     }
   }
 }
-const bn = () => {
-  gn("insertMenu", {
+const hn = () => {
+  pn("insertMenu", {
     name: "_default",
     default: !0,
     items: [
@@ -2013,10 +2001,10 @@ const bn = () => {
     ]
   });
 };
-let G = !1;
-const yn = (e = {}) => {
+let q = !1;
+const fn = (e = {}) => {
   var n, t;
-  G || (G = !0, f() && ((n = window.parent) == null || n.postMessage(
+  q || (q = !0, p() && ((n = window.parent) == null || n.postMessage(
     {
       type: "builder.sdkInfo",
       data: {
@@ -2036,36 +2024,36 @@ const yn = (e = {}) => {
     },
     "*"
   ), window.addEventListener("message", ({ data: o }) => {
-    var r, s;
+    var s, i;
     if (!!(o != null && o.type))
       switch (o.type) {
         case "builder.evaluate": {
-          const i = o.data.text, c = o.data.arguments || [], a = o.data.id, l = new Function(i);
-          let m, p = null;
+          const r = o.data.text, c = o.data.arguments || [], a = o.data.id, l = new Function(r);
+          let u, g = null;
           try {
-            m = l.apply(null, c);
-          } catch (h) {
-            p = h;
+            u = l.apply(null, c);
+          } catch (f) {
+            g = f;
           }
-          p ? (r = window.parent) == null || r.postMessage(
+          g ? (s = window.parent) == null || s.postMessage(
             {
               type: "builder.evaluateError",
-              data: { id: a, error: p.message }
+              data: { id: a, error: g.message }
             },
             "*"
-          ) : m && typeof m.then == "function" ? m.then((h) => {
-            var v;
-            (v = window.parent) == null || v.postMessage(
+          ) : u && typeof u.then == "function" ? u.then((f) => {
+            var b;
+            (b = window.parent) == null || b.postMessage(
               {
                 type: "builder.evaluateResult",
-                data: { id: a, result: h }
+                data: { id: a, result: f }
               },
               "*"
             );
-          }).catch(console.error) : (s = window.parent) == null || s.postMessage(
+          }).catch(console.error) : (i = window.parent) == null || i.postMessage(
             {
               type: "builder.evaluateResult",
-              data: { result: m, id: a }
+              data: { result: u, id: a }
             },
             "*"
           );
@@ -2074,10 +2062,10 @@ const yn = (e = {}) => {
       }
   })));
 };
-function J(e) {
+function G(e) {
   return Math.round(e * 1e3) / 1e3;
 }
-const vn = (e, n, t = !0) => {
+const gn = (e, n, t = !0) => {
   if (!(e instanceof HTMLElement))
     return null;
   let o = t ? e : e.parentElement;
@@ -2088,46 +2076,46 @@ const vn = (e, n, t = !0) => {
       return o;
   } while (o = o.parentElement);
   return null;
-}, xn = (e) => vn(e, (n) => {
+}, bn = (e) => gn(e, (n) => {
   const t = n.getAttribute("builder-id") || n.id;
   return Boolean((t == null ? void 0 : t.indexOf("builder-")) === 0);
-}), Y = ({
+}), J = ({
   event: e,
   target: n
 }) => {
-  const t = n.getBoundingClientRect(), o = e.clientX - t.left, r = e.clientY - t.top, s = J(o / t.width), i = J(r / t.height);
+  const t = n.getBoundingClientRect(), o = e.clientX - t.left, s = e.clientY - t.top, i = G(o / t.width), r = G(s / t.height);
   return {
-    x: s,
-    y: i
+    x: i,
+    y: r
   };
-}, kn = (e) => {
-  const n = e.target, t = n && xn(n), o = (t == null ? void 0 : t.getAttribute("builder-id")) || (t == null ? void 0 : t.id);
+}, yn = (e) => {
+  const n = e.target, t = n && bn(n), o = (t == null ? void 0 : t.getAttribute("builder-id")) || (t == null ? void 0 : t.id);
   return {
     targetBuilderElement: o || void 0,
     metadata: {
-      targetOffset: n ? Y({ event: e, target: n }) : void 0,
-      builderTargetOffset: t ? Y({ event: e, target: t }) : void 0,
+      targetOffset: n ? J({ event: e, target: n }) : void 0,
+      builderTargetOffset: t ? J({ event: e, target: t }) : void 0,
       builderElementIndex: t && o ? [].slice.call(document.getElementsByClassName(o)).indexOf(t) : void 0
     }
   };
-}, Sn = ({
+}, vn = ({
   content: e,
   data: n,
   locale: t
 }) => {
-  var s, i, c;
+  var i, r, c;
   const o = {};
-  (i = (s = e == null ? void 0 : e.data) == null ? void 0 : s.inputs) == null || i.forEach((a) => {
+  (r = (i = e == null ? void 0 : e.data) == null ? void 0 : i.inputs) == null || r.forEach((a) => {
     var l;
     a.name && a.defaultValue !== void 0 && ((l = e == null ? void 0 : e.data) == null ? void 0 : l.state) && e.data.state[a.name] === void 0 && (o[a.name] = a.defaultValue);
   });
-  const r = {
+  const s = {
     ...(c = e == null ? void 0 : e.data) == null ? void 0 : c.state,
     ...n,
     ...t ? { locale: t } : {}
   };
-  return { ...o, ...r };
-}, _n = ({
+  return { ...o, ...s };
+}, xn = ({
   content: e,
   data: n
 }) => e ? {
@@ -2137,21 +2125,21 @@ const vn = (e, n, t = !0) => {
     ...n
   },
   meta: e == null ? void 0 : e.meta
-} : void 0, Cn = () => Promise.resolve().then(() => ee).then((e) => e.default).catch((e) => {
+} : void 0, kn = () => Promise.resolve().then(() => Z).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlocks at ../render-blocks.vue",
     e
   ), e;
-}), wn = () => import("./render-styles.6fa7962a.js").then((e) => e.default).catch((e) => {
+}), Sn = () => import("./render-styles.cb23fa6b.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderContentStyles at ./components/render-styles.vue",
     e
   ), e;
-}), In = {
+}), _n = {
   name: "render-content",
   components: {
-    RenderContentStyles: x(wn),
-    RenderBlocks: x(Cn)
+    RenderContentStyles: x(Sn),
+    RenderBlocks: x(kn)
   },
   props: [
     "content",
@@ -2162,26 +2150,27 @@ const vn = (e, n, t = !0) => {
     "model",
     "context",
     "apiKey",
-    "includeRefs"
+    "includeRefs",
+    "apiVersion"
   ],
   data() {
     return {
       forceReRenderCount: 0,
       overrideContent: null,
-      useContent: _n({
+      useContent: xn({
         content: this.content,
         data: this.data
       }),
       update: 0,
-      canTrackToUse: S(this.canTrack) ? this.canTrack : !0,
-      contentState: Sn({
+      canTrackToUse: _(this.canTrack) ? this.canTrack : !0,
+      contentState: vn({
         content: this.content,
         data: this.data,
         locale: this.locale
       }),
       allRegisteredComponents: [
-        ...Yt(),
-        ...ae,
+        ...qt(),
+        ...re,
         ...this.customComponents || []
       ].reduce(
         (e, n) => ({
@@ -2198,12 +2187,13 @@ const vn = (e, n, t = !0) => {
   provide() {
     const e = this;
     return {
-      [O.key]: {
+      [V.key]: {
         content: e.useContent,
         state: e.contentState,
         setState: e.setContextState,
         context: e.context || {},
         apiKey: e.apiKey,
+        apiVersion: e.apiVersion,
         registeredComponents: e.allRegisteredComponents
       }
     };
@@ -2212,8 +2202,8 @@ const vn = (e, n, t = !0) => {
     var e, n;
     if (this.apiKey || console.error(
       "[Builder.io]: No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
-    ), f()) {
-      if (y() && (this.forceReRenderCount = this.forceReRenderCount + 1, bn(), yn({
+    ), p()) {
+      if (v() && (this.forceReRenderCount = this.forceReRenderCount + 1, hn(), fn({
         ...this.locale ? {
           locale: this.locale
         } : {},
@@ -2222,9 +2212,9 @@ const vn = (e, n, t = !0) => {
         } : {}
       }), Object.values(this.allRegisteredComponents).forEach(
         (t) => {
-          var r;
-          const o = Qt(t);
-          (r = window.parent) == null || r.postMessage(o, "*");
+          var s;
+          const o = Jt(t);
+          (s = window.parent) == null || s.postMessage(o, "*");
         }
       ), window.addEventListener("message", this.processMessage), window.addEventListener(
         "builder:component:stateChangeListenerActivated",
@@ -2239,13 +2229,14 @@ const vn = (e, n, t = !0) => {
           variationId: t !== o ? t : void 0
         });
       }
-      if (Xt()) {
-        const t = new URL(location.href).searchParams, o = t.get("builder.preview"), r = t.get("apiKey") || t.get("builder.space");
-        o === this.model && r === this.apiKey && ie({
+      if (Gt()) {
+        const t = new URL(location.href).searchParams, o = t.get("builder.preview"), s = t.get("apiKey") || t.get("builder.space");
+        o === this.model && s === this.apiKey && se({
           model: this.model,
-          apiKey: this.apiKey
-        }).then((s) => {
-          s && this.mergeNewContent(s);
+          apiKey: this.apiKey,
+          apiVersion: this.apiVersion
+        }).then((i) => {
+          i && this.mergeNewContent(i);
         });
       }
       this.evaluateJsCode(), this.runHttpRequests(), this.emitStateUpdate();
@@ -2254,17 +2245,23 @@ const vn = (e, n, t = !0) => {
   watch: {
     onUpdateHook0: {
       handler() {
-        this.evaluateJsCode();
+        this.content && this.mergeNewContent(this.content);
       },
       immediate: !0
     },
     onUpdateHook1: {
       handler() {
-        this.runHttpRequests();
+        this.evaluateJsCode();
       },
       immediate: !0
     },
     onUpdateHook2: {
+      handler() {
+        this.runHttpRequests();
+      },
+      immediate: !0
+    },
+    onUpdateHook3: {
       handler() {
         this.emitStateUpdate();
       },
@@ -2272,26 +2269,31 @@ const vn = (e, n, t = !0) => {
     }
   },
   unmounted() {
-    f() && (window.removeEventListener("message", this.processMessage), window.removeEventListener(
+    p() && (window.removeEventListener("message", this.processMessage), window.removeEventListener(
       "builder:component:stateChangeListenerActivated",
       this.emitStateUpdate
     ));
   },
   computed: {
     onUpdateHook0() {
+      return {
+        0: this.content
+      };
+    },
+    onUpdateHook1() {
       var e, n;
       return {
         0: (n = (e = this.useContent) == null ? void 0 : e.data) == null ? void 0 : n.jsCode,
         1: this.contentState
       };
     },
-    onUpdateHook1() {
+    onUpdateHook2() {
       var e, n;
       return {
         0: (n = (e = this.useContent) == null ? void 0 : e.data) == null ? void 0 : n.httpRequests
       };
     },
-    onUpdateHook2() {
+    onUpdateHook3() {
       return {
         0: this.contentState
       };
@@ -2299,7 +2301,7 @@ const vn = (e, n, t = !0) => {
   },
   methods: {
     mergeNewContent(e) {
-      var n, t, o, r, s;
+      var n, t, o, s, i;
       this.useContent = {
         ...this.useContent,
         ...e,
@@ -2310,7 +2312,7 @@ const vn = (e, n, t = !0) => {
         meta: {
           ...(t = this.useContent) == null ? void 0 : t.meta,
           ...e == null ? void 0 : e.meta,
-          breakpoints: ((o = e == null ? void 0 : e.meta) == null ? void 0 : o.breakpoints) || ((s = (r = this.useContent) == null ? void 0 : r.meta) == null ? void 0 : s.breakpoints)
+          breakpoints: ((o = e == null ? void 0 : e.meta) == null ? void 0 : o.breakpoints) || ((i = (s = this.useContent) == null ? void 0 : s.meta) == null ? void 0 : i.breakpoints)
         }
       };
     },
@@ -2333,15 +2335,15 @@ const vn = (e, n, t = !0) => {
       if (n)
         switch (n.type) {
           case "builder.configureSdk": {
-            const o = n.data, { breakpoints: r, contentId: s } = o;
-            if (!s || s !== ((t = this.useContent) == null ? void 0 : t.id))
+            const o = n.data, { breakpoints: s, contentId: i } = o;
+            if (!i || i !== ((t = this.useContent) == null ? void 0 : t.id))
               return;
-            r && this.setBreakpoints(r), this.forceReRenderCount = this.forceReRenderCount + 1;
+            s && this.setBreakpoints(s), this.forceReRenderCount = this.forceReRenderCount + 1;
             break;
           }
           case "builder.contentUpdate": {
-            const o = n.data, r = o.key || o.alias || o.entry || o.modelName, s = o.data;
-            r === this.model && (this.mergeNewContent(s), this.forceReRenderCount = this.forceReRenderCount + 1);
+            const o = n.data, s = o.key || o.alias || o.entry || o.modelName, i = o.data;
+            s === this.model && (this.mergeNewContent(i), this.forceReRenderCount = this.forceReRenderCount + 1);
             break;
           }
         }
@@ -2349,7 +2351,7 @@ const vn = (e, n, t = !0) => {
     evaluateJsCode() {
       var n, t;
       const e = (t = (n = this.useContent) == null ? void 0 : n.data) == null ? void 0 : t.jsCode;
-      e && D({
+      e && z({
         code: e,
         context: this.context || {},
         state: this.contentState
@@ -2358,14 +2360,14 @@ const vn = (e, n, t = !0) => {
     onClick(e) {
       var n, t;
       if (this.useContent) {
-        const o = (n = this.useContent) == null ? void 0 : n.testVariationId, r = (t = this.useContent) == null ? void 0 : t.id;
+        const o = (n = this.useContent) == null ? void 0 : n.testVariationId, s = (t = this.useContent) == null ? void 0 : t.id;
         U({
           type: "click",
           canTrack: this.canTrackToUse,
-          contentId: r,
+          contentId: s,
           apiKey: this.apiKey,
-          variationId: o !== r ? o : void 0,
-          ...kn(e),
+          variationId: o !== s ? o : void 0,
+          ...yn(e),
           unique: !this.clicked
         });
       }
@@ -2374,7 +2376,7 @@ const vn = (e, n, t = !0) => {
     evalExpression(e) {
       return e.replace(
         /{{([^}]+)}}/g,
-        (n, t) => D({
+        (n, t) => z({
           code: t,
           context: this.context || {},
           state: this.contentState
@@ -2382,7 +2384,7 @@ const vn = (e, n, t = !0) => {
       );
     },
     handleRequest({ url: e, key: n }) {
-      te(e).then((t) => t.json()).then((t) => {
+      ee(e).then((t) => t.json()).then((t) => {
         const o = {
           ...this.contentState,
           [n]: t
@@ -2395,18 +2397,18 @@ const vn = (e, n, t = !0) => {
     runHttpRequests() {
       var n, t, o;
       const e = (o = (t = (n = this.useContent) == null ? void 0 : n.data) == null ? void 0 : t.httpRequests) != null ? o : {};
-      Object.entries(e).forEach(([r, s]) => {
-        if (s && (!this.httpReqsData[r] || y())) {
-          const i = this.evalExpression(s);
+      Object.entries(e).forEach(([s, i]) => {
+        if (i && (!this.httpReqsData[s] || v())) {
+          const r = this.evalExpression(i);
           this.handleRequest({
-            url: i,
-            key: r
+            url: r,
+            key: s
           });
         }
       });
     },
     emitStateUpdate() {
-      y() && window.dispatchEvent(
+      v() && window.dispatchEvent(
         new CustomEvent("builder:component:stateChange", {
           detail: {
             state: this.contentState,
@@ -2418,76 +2420,74 @@ const vn = (e, n, t = !0) => {
       );
     }
   }
-}, Tn = ["builder-content-id", "builder-model"];
-function Rn(e, n, t, o, r, s) {
-  var a, l, m, p, h, v, W, N;
-  const i = k("render-content-styles"), c = k("render-blocks");
-  return r.useContent ? (d(), u("div", {
+}, wn = ["builder-content-id", "builder-model"];
+function Cn(e, n, t, o, s, i) {
+  var a, l, u, g, f, b, w, M;
+  const r = k("render-content-styles"), c = k("render-blocks");
+  return s.useContent ? (d(), m("div", {
     key: 0,
     ref: "elementRef",
-    onClick: n[0] || (n[0] = (me) => s.onClick(me)),
-    "builder-content-id": (a = r.useContent) == null ? void 0 : a.id,
+    onClick: n[0] || (n[0] = (ue) => i.onClick(ue)),
+    "builder-content-id": (a = s.useContent) == null ? void 0 : a.id,
     "builder-model": t.model
   }, [
-    r.TARGET !== "reactNative" ? (d(), T(i, {
+    s.TARGET !== "reactNative" ? (d(), T(r, {
       key: 0,
-      contentId: (l = r.useContent) == null ? void 0 : l.id,
-      cssCode: (p = (m = r.useContent) == null ? void 0 : m.data) == null ? void 0 : p.cssCode,
-      customFonts: (v = (h = r.useContent) == null ? void 0 : h.data) == null ? void 0 : v.customFonts
-    }, null, 8, ["contentId", "cssCode", "customFonts"])) : b("", !0),
+      contentId: (l = s.useContent) == null ? void 0 : l.id,
+      cssCode: (g = (u = s.useContent) == null ? void 0 : u.data) == null ? void 0 : g.cssCode,
+      customFonts: (b = (f = s.useContent) == null ? void 0 : f.data) == null ? void 0 : b.customFonts
+    }, null, 8, ["contentId", "cssCode", "customFonts"])) : y("", !0),
     (d(), T(c, {
-      blocks: (N = (W = r.useContent) == null ? void 0 : W.data) == null ? void 0 : N.blocks,
-      key: r.forceReRenderCount
+      blocks: (M = (w = s.useContent) == null ? void 0 : w.data) == null ? void 0 : M.blocks,
+      key: s.forceReRenderCount
     }, null, 8, ["blocks"]))
-  ], 8, Tn)) : b("", !0);
+  ], 8, wn)) : y("", !0);
 }
-const En = /* @__PURE__ */ g(In, [["render", Rn]]), An = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const In = /* @__PURE__ */ h(_n, [["render", Cn]]), Tn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: En
-}, Symbol.toStringTag, { value: "Module" })), X = {};
+  default: In
+}, Symbol.toStringTag, { value: "Module" })), Y = {};
 function Vn(e) {
-  if (f()) {
-    Object.assign(X, e);
+  if (p()) {
+    Object.assign(Y, e);
     const n = {
       type: "builder.settingsChange",
-      data: X
+      data: Y
     };
     parent.postMessage(n, "*");
   }
 }
 export {
-  O as B,
-  we as C,
-  Re as F,
-  Ve as I,
-  Xe as S,
+  V as B,
+  Se as C,
+  Ce as F,
+  Be as I,
+  Ge as S,
   R as T,
-  Ot as V,
-  g as _,
-  Fn as a,
-  On as b,
-  S as c,
-  ve as d,
-  D as e,
-  L as f,
-  be as g,
-  ge as h,
-  En as i,
-  St as j,
-  Tt as k,
-  y as l,
-  Xt as m,
-  ae as n,
-  Bn as o,
-  Qt as p,
-  gn as q,
-  ze as r,
+  Et as V,
+  h as _,
+  En as a,
+  fe as b,
+  _ as c,
+  In as d,
+  z as e,
+  W as f,
+  ge as g,
+  vt as h,
+  wt as i,
+  v as j,
+  Gt as k,
+  re as l,
+  An as m,
+  Jt as n,
+  pn as o,
+  se as p,
+  ht as q,
+  Le as r,
   Vn as s,
-  Pn as t,
-  ie as u,
-  bt as v,
-  pt as w,
-  ht as x,
-  ft as y,
-  re as z
+  jn as t,
+  dt as u,
+  ut as v,
+  mt as w,
+  ie as x
 };