@builder.io/sdk-vue 0.2.3 → 0.3.2-0

package/packages/_vue3/dist/{index.0aed90df.js → index.c3536d81.js}

@@ -1,5 +1,5 @@
-import { defineComponent as h, openBlock as d, createElementBlock as p, mergeProps as x, toHandlers as T, toDisplayString as H, defineAsyncComponent as S, resolveComponent as w, normalizeClass as V, normalizeStyle as R, createBlock as E, createCommentVNode as v, Fragment as A, renderList as U, createVNode as ee, renderSlot as j, createElementVNode as z } from "vue";
-const fe = h({
+import { defineComponent as f, openBlock as d, createElementBlock as p, mergeProps as x, toHandlers as R, toDisplayString as H, defineAsyncComponent as w, resolveComponent as C, normalizeClass as P, normalizeStyle as E, createBlock as _, createCommentVNode as y, Fragment as j, renderList as W, createVNode as ee, renderSlot as V, createElementVNode as K, markRaw as fe } from "vue";
+const ge = f({
   name: "builder-button",
   props: ["attributes", "text", "link", "openLinkInNewTab"],
   methods: {
@@ -29,26 +29,26 @@ const fe = h({
     }
   }
 });
-const f = (e, t) => {
+const g = (e, t) => {
   const n = e.__vccOpts || e;
   for (const [o, s] of t)
     n[o] = s;
   return n;
-}, ge = ["href", "target"];
-function be(e, t, n, o, s, r) {
+}, be = ["href", "target"];
+function ye(e, t, n, o, s, r) {
   return e.link ? (d(), p("a", x({
     key: 0,
     role: "button",
     href: e.link,
     target: e.openLinkInNewTab ? "_blank" : void 0
-  }, e.filterAttrs(e.attributes, !1), T(e.filterAttrs(e.attributes, !0), !0)), H(e.text), 17, ge)) : (d(), p("button", x({
+  }, e.filterAttrs(e.attributes, !1), R(e.filterAttrs(e.attributes, !0), !0)), H(e.text), 17, be)) : (d(), p("button", x({
     key: 1,
     class: e._classStringToObject(
       e.attributes.class + " button-1yj9n7yt24z"
     )
-  }, e.filterAttrs(e.attributes, !1), T(e.filterAttrs(e.attributes, !0), !0)), H(e.text), 17));
+  }, e.filterAttrs(e.attributes, !1), R(e.filterAttrs(e.attributes, !0), !0)), H(e.text), 17));
 }
-const ye = /* @__PURE__ */ f(fe, [["render", be], ["__scopeId", "data-v-3b72112d"]]), L = (e) => JSON.parse(JSON.stringify(e)), te = {
+const ve = /* @__PURE__ */ g(ge, [["render", ye], ["__scopeId", "data-v-3b72112d"]]), N = (e) => JSON.parse(JSON.stringify(e)), te = {
   small: {
     min: 320,
     default: 321,
@@ -64,8 +64,8 @@ const ye = /* @__PURE__ */ f(fe, [["render", be], ["__scopeId", "data-v-3b72112d
     default: 991,
     max: 1200
   }
-}, Vn = (e, t = te) => `@media (max-width: ${t[e].max}px)`, ve = ({ small: e, medium: t }) => {
-  const n = L(te);
+}, Fn = (e, t = te) => `@media (max-width: ${t[e].max}px)`, ke = ({ small: e, medium: t }) => {
+  const n = N(te);
   if (!e || !t)
     return n;
   const o = Math.floor(e / 2);
@@ -86,34 +86,35 @@ const ye = /* @__PURE__ */ f(fe, [["render", be], ["__scopeId", "data-v-3b72112d
     min: r,
     default: r + 1
   }, n;
-}, _ = "vue3", ke = Symbol(), P = {
+}, A = "vue3", Se = Symbol(), O = {
   Builder: {
     content: null,
     context: {},
-    state: {},
-    setState() {
+    localState: void 0,
+    rootSetState() {
     },
+    rootState: {},
     apiKey: null,
     apiVersion: void 0,
     registeredComponents: {},
     inheritedStyles: {}
   },
-  key: ke
-}, Se = () => Promise.resolve().then(() => ne).then((e) => e.default).catch((e) => {
+  key: Se
+}, we = () => Promise.resolve().then(() => ne).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlocks at ../../components/render-blocks.vue",
     e
   ), e;
-}), we = () => import("./render-inlined-styles.454bc38b.js").then((e) => e.default).catch((e) => {
+}), Ce = () => import("./render-inlined-styles.5aa04bb8.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;
-}), Ce = h({
+}), Ie = f({
   name: "builder-columns",
   components: {
-    RenderInlinedStyles: S(we),
-    RenderBlocks: S(Se)
+    RenderInlinedStyles: w(Ce),
+    RenderBlocks: w(we)
   },
   props: [
     "space",
@@ -128,11 +129,11 @@ const ye = /* @__PURE__ */ f(fe, [["render", be], ["__scopeId", "data-v-3b72112d
       cols: this.columns || [],
       stackAt: this.stackColumnsAt || "tablet",
       flexDir: this.stackColumnsAt === "never" ? "row" : this.reverseColumnsWhenStacked ? "column-reverse" : "column",
-      TARGET: _
+      TARGET: A
     };
   },
   inject: {
-    builderContext: P.key
+    builderContext: O.key
   },
   computed: {
     columnsCssVars() {
@@ -194,32 +195,31 @@ const ye = /* @__PURE__ */ f(fe, [["render", be], ["__scopeId", "data-v-3b72112d
       return this.stackAt === "never" ? t : e;
     },
     columnCssVars(e) {
-      e === 0 || this.gutterSize;
-      const t = this.getColumnCssWidth(e), n = `${this.gutterSize}px`, o = "100%", s = 0;
+      const t = e === 0 ? 0 : this.gutterSize, n = this.getColumnCssWidth(e), o = `${t}px`, s = "100%", r = 0;
       return {
-        width: t,
-        "margin-left": n,
+        width: n,
+        "margin-left": o,
         "--column-width-mobile": this.getMobileStyle({
-          stackedStyle: o,
-          desktopStyle: t
-        }),
-        "--column-margin-left-mobile": this.getMobileStyle({
           stackedStyle: s,
           desktopStyle: n
         }),
-        "--column-width-tablet": this.getTabletStyle({
-          stackedStyle: o,
-          desktopStyle: t
+        "--column-margin-left-mobile": this.getMobileStyle({
+          stackedStyle: r,
+          desktopStyle: o
         }),
-        "--column-margin-left-tablet": this.getTabletStyle({
+        "--column-width-tablet": this.getTabletStyle({
           stackedStyle: s,
           desktopStyle: n
+        }),
+        "--column-margin-left-tablet": this.getTabletStyle({
+          stackedStyle: r,
+          desktopStyle: o
         })
       };
     },
     getWidthForBreakpointSize(e) {
       var n, o;
-      return ve(
+      return ke(
         ((o = (n = this.builderContext.content) == null ? void 0 : n.meta) == null ? void 0 : o.breakpoints) || {}
       )[e].max;
     },
@@ -235,26 +235,26 @@ const ye = /* @__PURE__ */ f(fe, [["render", be], ["__scopeId", "data-v-3b72112d
   }
 });
 function xe(e, t, n, o, s, r) {
-  const i = w("render-inlined-styles"), l = w("render-blocks");
+  const i = C("render-inlined-styles"), l = C("render-blocks");
   return d(), p("div", {
-    class: V(
+    class: P(
       e._classStringToObject(
         `builder-columns ${e.builderBlock.id}-breakpoints div-361b1o6wv2k`
       )
     ),
-    style: R(e.columnsCssVars),
+    style: E(e.columnsCssVars),
     dataSet: {
       "builder-block-name": "builder-columns"
     }
   }, [
-    e.TARGET !== "reactNative" ? (d(), E(i, {
+    e.TARGET !== "reactNative" ? (d(), _(i, {
       key: 0,
       styles: e.columnsStyles
-    }, null, 8, ["styles"])) : v("", !0),
-    (d(!0), p(A, null, U(e.columns, (a, c) => (d(), p("div", {
+    }, null, 8, ["styles"])) : y("", !0),
+    (d(!0), p(j, null, W(e.columns, (a, c) => (d(), p("div", {
       key: c,
       class: "builder-column div-361b1o6wv2k-2",
-      style: R(e.columnCssVars(c)),
+      style: E(e.columnCssVars(c)),
       dataSet: {
         "builder-block-name": "builder-column"
       }
@@ -270,34 +270,34 @@ function xe(e, t, n, o, s, r) {
     ], 4))), 128))
   ], 6);
 }
-const Ie = /* @__PURE__ */ f(Ce, [["render", xe], ["__scopeId", "data-v-cb4e9d3e"]]), $e = h({
+const $e = /* @__PURE__ */ g(Ie, [["render", xe], ["__scopeId", "data-v-fae985f2"]]), Te = f({
   name: "builder-fragment-component",
   props: []
 });
-function Te(e, t, n, o, s, r) {
+function Re(e, t, n, o, s, r) {
   return d(), p("span", null, [
-    j(e.$slots, "default")
+    V(e.$slots, "default")
   ]);
 }
-const Re = /* @__PURE__ */ f($e, [["render", Te]]);
-function K(e) {
+const Ee = /* @__PURE__ */ g(Te, [["render", Re]]);
+function z(e) {
   return e.replace(/http(s)?:/, "");
 }
-function Ee(e = "", t, n) {
+function _e(e = "", t, n) {
   const o = new RegExp("([?&])" + t + "=.*?(&|$)", "i"), s = e.indexOf("?") !== -1 ? "&" : "?";
   return e.match(o) ? e.replace(o, "$1" + t + "=" + encodeURIComponent(n) + "$2") : e + s + t + "=" + encodeURIComponent(n);
 }
-function _e(e, t) {
+function Ae(e, t) {
   if (!e || !(e != null && e.match(/cdn\.shopify\.com/)) || !t)
     return e;
   if (t === "master")
-    return K(e);
+    return z(e);
   const n = e.match(
     /(_\d+x(\d+)?)?(\.(jpg|jpeg|gif|png|bmp|bitmap|tiff|tif)(\?v=\d+)?)/i
   );
   if (n) {
     const o = e.split(n[0]), s = n[3], r = t.match("x") ? t : `${t}x`;
-    return K(`${o[0]}_${r}${s}`);
+    return z(`${o[0]}_${r}${s}`);
   }
   return null;
 }
@@ -308,11 +308,11 @@ function F(e) {
   if (e.match(/builder\.io/)) {
     let n = e;
     const o = Number(e.split("?width=")[1]);
-    return isNaN(o) || (n = `${n} ${o}w`), t.filter((s) => s !== o).map((s) => `${Ee(e, "width", s)} ${s}w`).concat([n]).join(", ");
+    return isNaN(o) || (n = `${n} ${o}w`), t.filter((s) => s !== o).map((s) => `${_e(e, "width", s)} ${s}w`).concat([n]).join(", ");
   }
-  return e.match(/cdn\.shopify\.com/) ? t.map((n) => [_e(e, `${n}x${n}`), n]).filter(([n]) => !!n).map(([n, o]) => `${n} ${o}w`).concat([e]).join(", ") : e;
+  return e.match(/cdn\.shopify\.com/) ? t.map((n) => [Ae(e, `${n}x${n}`), n]).filter(([n]) => !!n).map(([n, o]) => `${n} ${o}w`).concat([e]).join(", ") : e;
 }
-const Ae = h({
+const je = f({
   name: "builder-image",
   props: [
     "image",
@@ -368,29 +368,29 @@ const Ae = h({
     }
   }
 });
-const je = ["srcset"], Ve = ["alt", "role", "src", "srcset", "sizes"], Pe = {
+const Ve = ["srcset"], Pe = ["alt", "role", "src", "srcset", "sizes"], Oe = {
   key: 2,
   class: "div-7jvpanrlkn-2"
 };
 function Be(e, t, n, o, s, r) {
   var i, l, a, c;
-  return d(), p(A, null, [
-    z("picture", null, [
+  return d(), p(j, null, [
+    K("picture", null, [
       e.webpSrcSet ? (d(), p("source", {
         key: 0,
         type: "image/webp",
         srcset: e.webpSrcSet
-      }, null, 8, je)) : v("", !0),
-      z("img", {
+      }, null, 8, Ve)) : y("", !0),
+      K("img", {
         loading: "lazy",
         alt: e.altText,
         role: e.altText ? "presentation" : void 0,
-        style: R({
+        style: E({
           objectPosition: e.backgroundPosition || "center",
           objectFit: e.backgroundSize || "cover",
           ...e.aspectRatioCss
         }),
-        class: V(
+        class: P(
           e._classStringToObject(
             "builder-image" + (e.className ? " " + e.className : "") + " img-7jvpanrlkn"
           )
@@ -398,50 +398,50 @@ function Be(e, t, n, o, s, r) {
         src: e.image,
         srcset: e.srcSetToUse,
         sizes: e.sizes
-      }, null, 14, Ve)
+      }, null, 14, Pe)
     ]),
     e.aspectRatio && !(((l = (i = e.builderBlock) == null ? void 0 : i.children) == null ? void 0 : l.length) && e.fitContent) ? (d(), p("div", {
       key: 0,
       class: "builder-image-sizer div-7jvpanrlkn",
-      style: R({
+      style: E({
         paddingTop: e.aspectRatio * 100 + "%"
       })
-    }, null, 4)) : v("", !0),
-    ((c = (a = e.builderBlock) == null ? void 0 : a.children) == null ? void 0 : c.length) && e.fitContent ? j(e.$slots, "default", { key: 1 }, void 0, !0) : v("", !0),
-    !e.fitContent && e.children ? (d(), p("div", Pe, [
-      j(e.$slots, "default", {}, void 0, !0)
-    ])) : v("", !0)
+    }, null, 4)) : y("", !0),
+    ((c = (a = e.builderBlock) == null ? void 0 : a.children) == null ? void 0 : c.length) && e.fitContent ? V(e.$slots, "default", { key: 1 }, void 0, !0) : y("", !0),
+    !e.fitContent && e.children ? (d(), p("div", Oe, [
+      V(e.$slots, "default", {}, void 0, !0)
+    ])) : y("", !0)
   ], 64);
 }
-const Fe = /* @__PURE__ */ f(Ae, [["render", Be], ["__scopeId", "data-v-034e3c7d"]]);
-function m() {
+const Fe = /* @__PURE__ */ g(je, [["render", Be], ["__scopeId", "data-v-034e3c7d"]]);
+function h() {
   return typeof window < "u" && typeof document < "u";
 }
-function Oe() {
-  return m() && window.self !== window.top;
+function Ue() {
+  return h() && window.self !== window.top;
 }
-function k() {
-  return Oe() && window.location.search.indexOf("builder.frameEditing=") !== -1;
+function v() {
+  return Ue() && window.location.search.indexOf("builder.frameEditing=") !== -1;
 }
-const Ue = () => import("./block-styles.f06f105b.js").then((e) => e.default).catch((e) => {
+const We = () => import("./block-styles.c0e7bfbe.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.905bcce5.js").then((e) => e.default).catch((e) => {
+}), Me = () => import("./render-block.d0ed34b4.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;
-}), Me = h({
+}), Le = f({
   name: "render-blocks",
   components: {
-    RenderBlock: S(We),
-    BlockStyles: S(Ue)
+    RenderBlock: w(Me),
+    BlockStyles: w(We)
   },
   props: ["blocks", "parent", "path", "styleProp"],
   inject: {
-    builderContext: P.key
+    builderContext: O.key
   },
   computed: {
     className() {
@@ -452,7 +452,7 @@ const Ue = () => import("./block-styles.f06f105b.js").then((e) => e.default).cat
   methods: {
     onClick() {
       var e, t;
-      k() && !((e = this.blocks) != null && e.length) && ((t = window.parent) == null || t.postMessage(
+      v() && !((e = this.blocks) != null && e.length) && ((t = window.parent) == null || t.postMessage(
         {
           type: "builder.clickEmptyBlocks",
           data: {
@@ -465,7 +465,7 @@ const Ue = () => import("./block-styles.f06f105b.js").then((e) => e.default).cat
     },
     onMouseEnter() {
       var e, t;
-      k() && !((e = this.blocks) != null && e.length) && ((t = window.parent) == null || t.postMessage(
+      v() && !((e = this.blocks) != null && e.length) && ((t = window.parent) == null || t.postMessage(
         {
           type: "builder.hoverEmptyBlocks",
           data: {
@@ -487,35 +487,35 @@ const Ue = () => import("./block-styles.f06f105b.js").then((e) => e.default).cat
     }
   }
 });
-const Le = ["builder-path", "builder-parent-id", "dataSet"];
-function Ne(e, t, n, o, s, r) {
-  const i = w("render-block"), l = w("block-styles");
+const Ne = ["builder-path", "builder-parent-id", "dataSet"];
+function He(e, t, n, o, s, r) {
+  const i = C("render-block"), l = C("block-styles");
   return d(), p("div", {
-    class: V(e._classStringToObject(e.className + " div-7fq9d0i380")),
+    class: P(e._classStringToObject(e.className + " div-7fq9d0i380")),
     "builder-path": e.path,
     "builder-parent-id": e.parent,
     dataSet: {
       class: e.className
     },
-    style: R(e.styleProp),
+    style: E(e.styleProp),
     onClick: t[0] || (t[0] = (a) => e.onClick()),
     onMouseenter: t[1] || (t[1] = (a) => e.onMouseEnter())
   }, [
-    e.blocks ? (d(!0), p(A, { key: 0 }, U(e.blocks, (a, c) => (d(), E(i, {
+    e.blocks ? (d(!0), p(j, { key: 0 }, W(e.blocks, (a, c) => (d(), _(i, {
       key: "render-block-" + a.id,
       block: a,
       context: e.builderContext
-    }, null, 8, ["block", "context"]))), 128)) : v("", !0),
-    e.blocks ? (d(!0), p(A, { key: 1 }, U(e.blocks, (a, c) => (d(), E(l, {
+    }, null, 8, ["block", "context"]))), 128)) : y("", !0),
+    e.blocks ? (d(!0), p(j, { key: 1 }, W(e.blocks, (a, c) => (d(), _(l, {
       key: "block-style-" + a.id,
       block: a,
       context: e.builderContext
-    }, null, 8, ["block", "context"]))), 128)) : v("", !0)
-  ], 46, Le);
+    }, null, 8, ["block", "context"]))), 128)) : y("", !0)
+  ], 46, Ne);
 }
-const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b"]]), ne = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Ke = /* @__PURE__ */ g(Le, [["render", He], ["__scopeId", "data-v-ff3cb99b"]]), ne = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: He
+  default: Ke
 }, Symbol.toStringTag, { value: "Module" })), ze = {
   name: "Core:Button",
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
@@ -555,7 +555,7 @@ const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b
 }, B = (e) => {
   const t = e.toString().trim();
   return `return (${!t.startsWith("function") && !t.startsWith("(") ? "function " : ""}${t}).apply(this, arguments)`;
-}, Ke = {
+}, De = {
   name: "Columns",
   inputs: [
     {
@@ -779,13 +779,13 @@ const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b
       advanced: !0
     }
   ]
-}, De = {
+}, qe = {
   name: "Fragment",
   static: !0,
   hidden: !0,
   canHaveChildren: !0,
   noWrap: !0
-}, qe = {
+}, Ge = {
   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",
@@ -810,13 +810,13 @@ const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b
           function n(i, l = 6e4) {
             return new Promise((a, c) => {
               const u = document.createElement("img");
-              let b = !1;
+              let m = !1;
               u.onload = () => {
-                b = !0, a(u);
-              }, u.addEventListener("error", (g) => {
-                console.warn("Image load failed", g.error), c(g.error);
+                m = !0, a(u);
+              }, u.addEventListener("error", (b) => {
+                console.warn("Image load failed", b.error), c(b.error);
               }), u.src = i, setTimeout(() => {
-                b || c(new Error("Image load timed out"));
+                m || c(new Error("Image load timed out"));
               }, l);
             });
           }
@@ -912,7 +912,7 @@ const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b
       defaultValue: 0.7041
     }
   ]
-}, Ge = {
+}, Je = {
   name: "Core:Section",
   static: !0,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -956,7 +956,7 @@ const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b
       }
     }
   ]
-}, Je = h({
+}, Xe = f({
   name: "builder-section-component",
   props: ["maxWidth", "attributes"],
   methods: {
@@ -977,7 +977,7 @@ const He = /* @__PURE__ */ f(Me, [["render", Ne], ["__scopeId", "data-v-ff3cb99b
     }
   }
 });
-function Xe(e, t, n, o, s, r) {
+function Ye(e, t, n, o, s, r) {
   return d(), p("section", x({
     style: {
       width: "100%",
@@ -991,11 +991,11 @@ function Xe(e, t, n, o, s, r) {
       marginLeft: "auto",
       marginRight: "auto"
     }
-  }, e.filterAttrs(e.attributes, !1), T(e.filterAttrs(e.attributes, !0), !0)), [
-    j(e.$slots, "default")
+  }, e.filterAttrs(e.attributes, !1), R(e.filterAttrs(e.attributes, !0), !0)), [
+    V(e.$slots, "default")
   ], 16);
 }
-const Ye = /* @__PURE__ */ f(Je, [["render", Xe]]), Qe = {
+const Qe = /* @__PURE__ */ g(Xe, [["render", Ye]]), Ze = {
   name: "Symbol",
   noWrap: !0,
   static: !0,
@@ -1033,16 +1033,16 @@ const Ye = /* @__PURE__ */ f(Je, [["render", Xe]]), Qe = {
       type: "boolean"
     }
   ]
-}, O = "[Builder.io]: ", C = {
-  log: (...e) => console.log(O, ...e),
-  error: (...e) => console.error(O, ...e),
-  warn: (...e) => console.warn(O, ...e)
+}, U = "[Builder.io]: ", I = {
+  log: (...e) => console.log(U, ...e),
+  error: (...e) => console.error(U, ...e),
+  warn: (...e) => console.warn(U, ...e)
 };
-function Ze() {
+function et() {
   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 tt() {
+  const e = et().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. 
@@ -1050,7 +1050,7 @@ function et() {
     ), new Error("Builder SDK could not find a global `fetch` function");
   return e;
 }
-const oe = et(), I = (e) => e != null, tt = (e) => {
+const oe = tt(), $ = (e) => e != null, nt = (e) => {
   if (e === "localhost" || e === "127.0.0.1")
     return e;
   const t = e.split(".");
@@ -1066,22 +1066,22 @@ const oe = et(), I = (e) => e != null, tt = (e) => {
     console.debug("[COOKIE] GET error: ", o);
     return;
   }
-}, nt = (e) => e.map(([t, n]) => n ? `${t}=${n}` : t).filter(I).join("; "), ot = [
+}, ot = (e) => e.map(([t, n]) => n ? `${t}=${n}` : t).filter($).join("; "), st = [
   ["secure", ""],
   ["SameSite", "None"]
-], st = ({
+], rt = ({
   name: e,
   value: t,
   expires: n
 }) => {
-  const s = (m() ? location.protocol === "https:" : !0) ? ot : [[]], r = n ? [["expires", n.toUTCString()]] : [[]], i = [
+  const s = (h() ? location.protocol === "https:" : !0) ? st : [[]], r = n ? [["expires", n.toUTCString()]] : [[]], i = [
     [e, t],
     ...r,
     ["path", "/"],
-    ["domain", tt(window.location.hostname)],
+    ["domain", nt(window.location.hostname)],
     ...s
   ];
-  return nt(i);
+  return ot(i);
 }, re = async ({
   name: e,
   value: t,
@@ -1091,19 +1091,19 @@ const oe = et(), I = (e) => e != null, tt = (e) => {
   try {
     if (!o)
       return;
-    const s = st({ name: e, value: t, expires: n });
+    const s = rt({ name: e, value: t, expires: n });
     document.cookie = s;
   } catch (s) {
     console.warn("[COOKIE] SET error: ", s);
   }
-}, rt = "builderio.variations", ie = (e) => `${rt}.${e}`, it = ({
+}, it = "builderio.variations", ie = (e) => `${it}.${e}`, at = ({
   contentId: e,
   canTrack: t
-}) => se({ name: ie(e), canTrack: t }), at = ({
+}) => se({ name: ie(e), canTrack: t }), lt = ({
   contentId: e,
   canTrack: t,
   value: n
-}) => re({ name: ie(e), value: n, canTrack: t }), lt = (e) => I(e.id) && I(e.variations) && Object.keys(e.variations).length > 0, ct = ({
+}) => re({ name: ie(e), value: n, canTrack: t }), ct = (e) => $(e.id) && $(e.variations) && Object.keys(e.variations).length > 0, dt = ({
   id: e,
   variations: t
 }) => {
@@ -1129,22 +1129,22 @@ const oe = et(), I = (e) => e != null, tt = (e) => {
     testVariationId: n.id,
     testVariationName: n.name || (n.id === e.id ? "Default" : "")
   };
-}, dt = async ({
+}, ut = async ({
   item: e,
   canTrack: t
 }) => {
-  const n = await it({
+  const n = await at({
     canTrack: t,
     contentId: e.id
   }), o = n ? D({ item: e, testGroupId: n }) : void 0;
   if (o)
     return o;
   {
-    const s = ct({
+    const s = dt({
       variations: e.variations,
       id: e.id
     });
-    return at({
+    return lt({
       contentId: e.id,
       value: s,
       canTrack: t
@@ -1152,46 +1152,46 @@ const oe = et(), I = (e) => e != null, tt = (e) => {
       console.error("could not store A/B test variation: ", r);
     }), D({ item: e, testGroupId: s });
   }
-}, ut = async ({
+}, pt = async ({
   item: e,
   canTrack: t
 }) => {
-  if (!lt(e))
+  if (!ct(e))
     return;
-  const n = await dt({ item: e, canTrack: t });
+  const n = await ut({ item: e, canTrack: t });
   Object.assign(e, n);
 };
-function W(e, t = null, n = ".") {
+function M(e, t = null, n = ".") {
   return Object.keys(e).reduce((o, s) => {
     const r = e[s], i = [t, s].filter(Boolean).join(n);
     return [
       typeof r == "object",
       r !== null,
       !(Array.isArray(r) && r.length === 0)
-    ].every(Boolean) ? { ...o, ...W(r, i, n) } : { ...o, [i]: r };
+    ].every(Boolean) ? { ...o, ...M(r, i, n) } : { ...o, [i]: r };
   }, {});
 }
-const q = "builder.", pt = "options.", mt = (e) => {
+const q = "builder.", mt = "options.", ht = (e) => {
   const t = {};
   return e.forEach((n, o) => {
     t[o] = n;
   }), t;
-}, ht = (e) => {
+}, ft = (e) => {
   if (!e)
     return {};
   const t = ae(e), n = {};
   return Object.keys(t).forEach((o) => {
     if (o.startsWith(q)) {
-      const s = o.replace(q, "").replace(pt, "");
+      const s = o.replace(q, "").replace(mt, "");
       n[s] = t[o];
     }
   }), n;
-}, ft = () => {
-  if (!m())
+}, gt = () => {
+  if (!h())
     return {};
   const e = new URLSearchParams(window.location.search);
-  return ht(e);
-}, ae = (e) => e instanceof URLSearchParams ? mt(e) : e, gt = "v3", bt = (e) => {
+  return ft(e);
+}, ae = (e) => e instanceof URLSearchParams ? ht(e) : e, bt = "v3", yt = (e) => {
   const {
     limit: t = 30,
     userAttributes: n,
@@ -1200,60 +1200,61 @@ const q = "builder.", pt = "options.", mt = (e) => {
     model: r,
     apiKey: i,
     includeRefs: l = !0,
-    locale: a,
-    apiVersion: c = gt
+    enrich: a,
+    locale: c,
+    apiVersion: u = bt
   } = e;
   if (!i)
     throw new Error("Missing API key");
-  if (!["v2", "v3"].includes(c))
+  if (!["v2", "v3"].includes(u))
     throw new Error(
-      `Invalid apiVersion: expected 'v2' or 'v3', received '${c}'`
+      `Invalid apiVersion: expected 'v2' or 'v3', received '${u}'`
     );
-  const u = new URL(
-    `https://cdn.builder.io/api/${c}/content/${r}?apiKey=${i}&limit=${t}&noTraverse=${s}&includeRefs=${l}${a ? `&locale=${a}` : ""}`
+  const m = new URL(
+    `https://cdn.builder.io/api/${u}/content/${r}?apiKey=${i}&limit=${t}&noTraverse=${s}&includeRefs=${l}${c ? `&locale=${c}` : ""}${a ? `&enrich=${a}` : ""}`
   ), b = {
-    ...ft(),
+    ...gt(),
     ...ae(e.options || {})
-  }, g = W(b);
-  for (const y in g)
-    u.searchParams.set(y, String(g[y]));
-  if (n && u.searchParams.set("userAttributes", JSON.stringify(n)), o) {
-    const y = W({ query: o });
-    for (const $ in y)
-      u.searchParams.set($, JSON.stringify(y[$]));
+  }, k = M(b);
+  for (const S in k)
+    m.searchParams.set(S, String(k[S]));
+  if (n && m.searchParams.set("userAttributes", JSON.stringify(n)), o) {
+    const S = M({ query: o });
+    for (const T in S)
+      m.searchParams.set(T, JSON.stringify(S[T]));
   }
-  return u;
+  return m;
 };
 async function le(e) {
-  const t = await yt({ ...e, limit: 1 });
+  const t = await vt({ ...e, limit: 1 });
   return t && "results" in t && (t == null ? void 0 : t.results[0]) || null;
 }
-async function yt(e) {
+async function vt(e) {
   try {
-    const t = bt(e), o = await (await oe(t.href)).json();
+    const t = yt(e), o = await (await oe(t.href)).json();
     if ("status" in o && !("results" in o))
-      return C.error("Error fetching data. ", { url: t, content: o, options: e }), o;
+      return I.error("Error fetching data. ", { url: t, content: o, options: e }), o;
     const s = e.canTrack !== !1;
     try {
       if (s && Array.isArray(o.results))
         for (const r of o.results)
-          await ut({ item: r, canTrack: s });
+          await pt({ item: r, canTrack: s });
     } catch (r) {
-      C.error("Could not setup A/B testing. ", r);
+      I.error("Could not setup A/B testing. ", r);
     }
     return o;
   } catch (t) {
-    return C.error("Error fetching data. ", t), null;
+    return I.error("Error fetching data. ", t), null;
   }
 }
-const vt = () => Promise.resolve().then(() => An).then((e) => e.default).catch((e) => {
+const kt = () => Promise.resolve().then(() => On).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;
-}), kt = h({
+}), St = f({
   name: "builder-symbol",
-  components: { RenderContent: S(vt) },
+  components: { RenderContent: w(kt) },
   props: ["attributes", "symbol", "dynamic"],
   data() {
     var e, t, n;
@@ -1268,7 +1269,7 @@ const vt = () => Promise.resolve().then(() => An).then((e) => e.default).catch((
     };
   },
   inject: {
-    builderContext: P.key
+    builderContext: O.key
   },
   mounted() {
     this.fetchContent();
@@ -1301,7 +1302,7 @@ const vt = () => Promise.resolve().then(() => An).then((e) => e.default).catch((
       }).then((n) => {
         n && (this.contentToUse = n);
       }).catch((n) => {
-        C.error("Could not fetch symbol content: ", n);
+        I.error("Could not fetch symbol content: ", n);
       });
     },
     filterAttrs: function(t = {}, n) {
@@ -1329,16 +1330,16 @@ const vt = () => Promise.resolve().then(() => An).then((e) => e.default).catch((
       return t;
     }
   }
-}), St = ["dataSet"];
-function wt(e, t, n, o, s, r) {
+}), wt = ["dataSet"];
+function Ct(e, t, n, o, s, r) {
   var l, a, c, u;
-  const i = w("render-content");
+  const i = C("render-content");
   return d(), p("div", x({
     dataSet: {
       class: e.className
     },
     class: e._classStringToObject(e.className)
-  }, e.filterAttrs(e.attributes, !1), T(e.filterAttrs(e.attributes, !0), !0)), [
+  }, e.filterAttrs(e.attributes, !1), R(e.filterAttrs(e.attributes, !0), !0)), [
     ee(i, {
       apiVersion: e.builderContext.apiVersion,
       apiKey: e.builderContext.apiKey,
@@ -1346,15 +1347,15 @@ function wt(e, t, n, o, s, r) {
       customComponents: Object.values(e.builderContext.registeredComponents),
       data: {
         ...(l = e.symbol) == null ? void 0 : l.data,
-        ...e.builderContext.state,
+        ...e.builderContext.localState,
         ...(c = (a = e.contentToUse) == null ? void 0 : a.data) == null ? void 0 : c.state
       },
       model: (u = e.symbol) == null ? void 0 : u.model,
       content: e.contentToUse
     }, null, 8, ["apiVersion", "apiKey", "context", "customComponents", "data", "model", "content"])
-  ], 16, St);
+  ], 16, wt);
 }
-const Ct = /* @__PURE__ */ f(kt, [["render", wt]]), xt = {
+const It = /* @__PURE__ */ g(St, [["render", Ct]]), 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",
@@ -1373,20 +1374,20 @@ const Ct = /* @__PURE__ */ f(kt, [["render", wt]]), xt = {
     height: "auto",
     textAlign: "center"
   }
-}, It = h({
+}, $t = f({
   name: "builder-text",
   props: ["text"]
-}), $t = ["innerHTML"];
-function Tt(e, t, n, o, s, r) {
+}), Tt = ["innerHTML"];
+function Rt(e, t, n, o, s, r) {
   return d(), p("span", {
     class: "builder-text",
     innerHTML: e.text,
     style: {
       outline: "none"
     }
-  }, null, 8, $t);
+  }, null, 8, Tt);
 }
-const Rt = /* @__PURE__ */ f(It, [["render", Tt]]), Et = {
+const Et = /* @__PURE__ */ g($t, [["render", Rt]]), _t = {
   name: "Video",
   canHaveChildren: !0,
   defaultStyles: {
@@ -1487,7 +1488,7 @@ const Rt = /* @__PURE__ */ f(It, [["render", Tt]]), Et = {
       advanced: !0
     }
   ]
-}, _t = h({
+}, At = f({
   name: "builder-video",
   props: [
     "autoPlay",
@@ -1528,8 +1529,8 @@ const Rt = /* @__PURE__ */ f(It, [["render", Tt]]), Et = {
       };
     }
   }
-}), At = ["src", "poster"];
-function jt(e, t, n, o, s, r) {
+}), jt = ["src", "poster"];
+function Vt(e, t, n, o, s, r) {
   var i;
   return d(), p("video", x({
     style: {
@@ -1542,9 +1543,9 @@ function jt(e, t, n, o, s, r) {
     },
     src: e.video || "no-src",
     poster: e.posterImage
-  }, e.spreadProps), null, 16, At);
+  }, e.spreadProps), null, 16, jt);
 }
-const Vt = /* @__PURE__ */ f(_t, [["render", jt]]), Pt = {
+const Pt = /* @__PURE__ */ g(At, [["render", Vt]]), Ot = {
   name: "Embed",
   static: !0,
   inputs: [
@@ -1583,7 +1584,7 @@ const Vt = /* @__PURE__ */ f(_t, [["render", jt]]), Pt = {
   "text/javascript",
   "application/javascript",
   "application/ecmascript"
-], Ft = (e) => Bt.includes(e.type), Ot = h({
+], Ft = (e) => Bt.includes(e.type), Ut = f({
   name: "builder-embed",
   props: ["content"],
   data() {
@@ -1625,15 +1626,15 @@ const Vt = /* @__PURE__ */ f(_t, [["render", jt]]), Pt = {
       }
     }
   }
-}), Ut = ["innerHTML"];
-function Wt(e, t, n, o, s, r) {
+}), Wt = ["innerHTML"];
+function Mt(e, t, n, o, s, r) {
   return d(), p("div", {
     class: "builder-embed",
     ref: "elem",
     innerHTML: e.content
-  }, null, 8, Ut);
+  }, null, 8, Wt);
 }
-const Mt = /* @__PURE__ */ f(Ot, [["render", Wt]]), Lt = h({
+const Lt = /* @__PURE__ */ g(Ut, [["render", Mt]]), Nt = f({
   name: "builder-img-component",
   props: [
     "backgroundSize",
@@ -1644,7 +1645,7 @@ const Mt = /* @__PURE__ */ f(Ot, [["render", Wt]]), Lt = h({
     "attributes"
   ],
   data() {
-    return { isEditing: k };
+    return { isEditing: v };
   },
   methods: {
     filterAttrs: function(t = {}, n) {
@@ -1663,8 +1664,8 @@ const Mt = /* @__PURE__ */ f(Ot, [["render", Wt]]), Lt = h({
       );
     }
   }
-}), Nt = ["alt", "src"];
-function Ht(e, t, n, o, s, r) {
+}), Ht = ["alt", "src"];
+function Kt(e, t, n, o, s, r) {
   return d(), p("img", x({
     style: {
       objectFit: e.backgroundSize || "cover",
@@ -1673,9 +1674,9 @@ function Ht(e, t, n, o, s, r) {
     key: e.isEditing() && e.imgSrc || "default-key",
     alt: e.altText,
     src: e.imgSrc || e.image
-  }, e.filterAttrs(e.attributes, !1), T(e.filterAttrs(e.attributes, !0), !0)), null, 16, Nt);
+  }, e.filterAttrs(e.attributes, !1), R(e.filterAttrs(e.attributes, !0), !0)), null, 16, Ht);
 }
-const zt = /* @__PURE__ */ f(Lt, [["render", Ht]]), Kt = {
+const zt = /* @__PURE__ */ g(Nt, [["render", Kt]]), Dt = {
   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",
@@ -1690,7 +1691,7 @@ const zt = /* @__PURE__ */ f(Lt, [["render", Ht]]), Kt = {
   ],
   noWrap: !0,
   static: !0
-}, Dt = h({
+}, qt = f({
   name: "builder-custom-code",
   props: ["replaceNodes", "code"],
   data() {
@@ -1737,19 +1738,19 @@ const zt = /* @__PURE__ */ f(Lt, [["render", Ht]]), Kt = {
       return t;
     }
   }
-}), qt = ["innerHTML"];
-function Gt(e, t, n, o, s, r) {
+}), Gt = ["innerHTML"];
+function Jt(e, t, n, o, s, r) {
   return d(), p("div", {
     ref: "elem",
-    class: V(
+    class: P(
       e._classStringToObject(
         "builder-custom-code" + (e.replaceNodes ? " replace-nodes" : "")
       )
     ),
     innerHTML: e.code
-  }, null, 10, qt);
+  }, null, 10, Gt);
 }
-const Jt = /* @__PURE__ */ f(Dt, [["render", Gt]]), Xt = {
+const Xt = /* @__PURE__ */ g(qt, [["render", Jt]]), Yt = {
   name: "Custom Code",
   static: !0,
   requiredPermissions: ["editCode"],
@@ -1775,35 +1776,37 @@ const Jt = /* @__PURE__ */ f(Dt, [["render", Gt]]), Xt = {
       advanced: !0
     }
   ]
-}, Yt = () => [
-  { component: ye, ...ze },
-  { component: Ie, ...Ke },
-  { component: Jt, ...Xt },
-  { component: Mt, ...Pt },
-  { component: Re, ...De },
-  { component: Fe, ...qe },
-  { component: zt, ...Kt },
-  { component: Ye, ...Ge },
-  { component: Ct, ...Qe },
-  { component: Rt, ...xt },
-  { component: Vt, ...Et }
+}, Qt = () => [
+  { component: ve, ...ze },
+  { component: $e, ...De },
+  { component: Xt, ...Yt },
+  { component: Lt, ...Ot },
+  { component: Ee, ...qe },
+  { component: Fe, ...Ge },
+  { component: zt, ...Dt },
+  { component: Qe, ...Je },
+  { component: It, ...Ze },
+  { component: Et, ...xt },
+  { component: Pt, ..._t }
 ];
 function G({
   code: e,
   context: t,
-  state: n,
-  event: o,
-  isExpression: s = !0
+  localState: n,
+  rootState: o,
+  rootSetState: s,
+  event: r,
+  isExpression: i = !0
 }) {
   if (e === "") {
     console.warn("Skipping evaluation of empty code block.");
     return;
   }
-  const r = {
-    isEditing: k(),
-    isBrowser: m(),
-    isServer: !m()
-  }, l = s && !(e.includes(";") || e.includes(" return ") || e.trim().startsWith("return ")) ? `return (${e});` : e;
+  const l = {
+    isEditing: v(),
+    isBrowser: h(),
+    isServer: !h()
+  }, c = i && !(e.includes(";") || e.includes(" return ") || e.trim().startsWith("return ")) ? `return (${e});` : e;
   try {
     return new Function(
       "builder",
@@ -1811,60 +1814,80 @@ function G({
       "state",
       "context",
       "event",
-      l
-    )(r, r, n, t, o);
-  } catch (a) {
+      c
+    )(
+      l,
+      l,
+      Zt(o, n, s),
+      t,
+      r
+    );
+  } catch (u) {
     console.warn(
       `Builder custom code error: 
  While Evaluating: 
  `,
-      l,
+      c,
       `
 `,
-      a
+      u
     );
   }
 }
-function Qt() {
-  return !m() || k() ? !1 : Boolean(location.search.indexOf("builder.preview=") !== -1);
+function Zt(e, t, n) {
+  if (e === t)
+    throw new Error("rootState === localState");
+  return new Proxy(e, {
+    get: (o, s) => t && s in t ? t[s] : e[s],
+    set: (o, s, r) => {
+      if (t && s in t)
+        throw new Error(
+          "Writing to local state is not allowed as it is read-only."
+        );
+      return e[s] = r, n == null || n(e), !0;
+    }
+  });
+}
+function en() {
+  return !h() || v() ? !1 : Boolean(location.search.indexOf("builder.preview=") !== -1);
 }
 const ce = [];
-function Pn(e, t) {
+function Un(e, t) {
   return ce.push({ component: e, ...t }), console.warn(
     "registerComponent is deprecated. Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK."
   ), e;
 }
-const Zt = ({
+const tn = ({
   component: e,
   ...t
 }) => ({
   type: "builder.registerComponent",
-  data: tn(t)
-}), en = (e) => typeof e == "function" ? B(e) : L(e), tn = ({
+  data: on(t)
+}), nn = (e) => typeof e == "function" ? B(e) : N(e), on = ({
   inputs: e,
   ...t
 }) => ({
-  ...L(t),
+  ...N(t),
   inputs: e == null ? void 0 : e.map(
     (n) => Object.entries(n).reduce(
       (o, [s, r]) => ({
         ...o,
-        [s]: en(r)
+        [s]: nn(r)
       }),
       {}
     )
   )
 });
-function nn() {
+function sn() {
   return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(e) {
     const t = Math.random() * 16 | 0;
     return (e == "x" ? t : t & 3 | 8).toString(16);
   });
 }
 function de() {
-  return nn().replace(/-/g, "");
+  return sn().replace(/-/g, "");
 }
-const ue = "builderSessionId", on = async ({
+const ue = "builderSessionId", rn = async ({
   canTrack: e
 }) => {
   if (!e)
@@ -1873,16 +1896,16 @@ const ue = "builderSessionId", on = async ({
     name: ue,
     canTrack: e
   });
-  if (I(t))
+  if ($(t))
     return t;
   {
-    const n = sn();
-    return rn({ id: n, canTrack: e }), n;
+    const n = an();
+    return ln({ id: n, canTrack: e }), n;
   }
-}, sn = () => de(), rn = ({
+}, an = () => de(), ln = ({
   id: e,
   canTrack: t
-}) => re({ name: ue, value: e, canTrack: t }), pe = () => m() && typeof localStorage < "u" ? localStorage : void 0, an = ({
+}) => re({ name: ue, value: e, canTrack: t }), pe = () => h() && typeof localStorage < "u" ? localStorage : void 0, cn = ({
   key: e,
   canTrack: t
 }) => {
@@ -1893,7 +1916,7 @@ const ue = "builderSessionId", on = async ({
     console.debug("[LocalStorage] GET error: ", o);
     return;
   }
-}, ln = ({
+}, dn = ({
   key: e,
   canTrack: t,
   value: n
@@ -1904,34 +1927,34 @@ const ue = "builderSessionId", on = async ({
   } catch (s) {
     console.debug("[LocalStorage] SET error: ", s);
   }
-}, me = "builderVisitorId", cn = ({ canTrack: e }) => {
+}, me = "builderVisitorId", un = ({ canTrack: e }) => {
   if (!e)
     return;
-  const t = an({
+  const t = cn({
     key: me,
     canTrack: e
   });
-  if (I(t))
+  if ($(t))
     return t;
   {
-    const n = dn();
-    return un({ id: n, canTrack: e }), n;
+    const n = pn();
+    return mn({ id: n, canTrack: e }), n;
   }
-}, dn = () => de(), un = ({
+}, pn = () => de(), mn = ({
   id: e,
   canTrack: t
-}) => ln({
+}) => dn({
   key: me,
   value: e,
   canTrack: t
-}), pn = () => {
-  if (m()) {
+}), hn = () => {
+  if (h()) {
     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 || "", hn = () => {
-  const e = mn(), t = {
+}, fn = () => typeof navigator == "object" && navigator.userAgent || "", gn = () => {
+  const e = fn(), t = {
     Android() {
       return e.match(/Android/i);
     },
@@ -1948,25 +1971,25 @@ const ue = "builderSessionId", on = async ({
       return e.match(/IEMobile/i) || e.match(/WPDesktop/i);
     },
     any() {
-      return t.Android() || t.BlackBerry() || t.iOS() || t.Opera() || t.Windows() || _ === "reactNative";
+      return t.Android() || t.BlackBerry() || t.iOS() || t.Opera() || t.Windows() || A === "reactNative";
     }
-  }, n = e.match(/Tablet|iPad/i), o = pn();
+  }, n = e.match(/Tablet|iPad/i), o = hn();
   return {
     urlPath: o == null ? void 0 : o.pathname,
     host: (o == null ? void 0 : o.host) || (o == null ? void 0 : o.hostname),
     device: n ? "tablet" : t.any() ? "mobile" : "desktop"
   };
-}, fn = async ({
+}, bn = async ({
   canTrack: e
 }) => {
   if (!e)
     return { visitorId: void 0, sessionId: void 0 };
-  const t = await on({ canTrack: e }), n = cn({ canTrack: e });
+  const t = await rn({ canTrack: e }), n = un({ canTrack: e });
   return {
     sessionId: t,
     visitorId: n
   };
-}, gn = async ({
+}, yn = async ({
   type: e,
   canTrack: t,
   apiKey: n,
@@ -1980,23 +2003,23 @@ const ue = "builderSessionId", on = async ({
       url: location.href,
       ...o
     },
-    ...await fn({ canTrack: t }),
-    userAttributes: hn(),
+    ...await bn({ canTrack: t }),
+    userAttributes: gn(),
     ownerId: n
   }
 });
-async function M(e) {
+async function L(e) {
   if (!e.apiKey) {
-    C.error(
+    I.error(
       "Missing API key for track call. Please provide your API key."
     );
     return;
   }
-  if (!!e.canTrack && !k() && !!(m() || _ === "reactNative"))
+  if (!!e.canTrack && !v() && !!(h() || A === "reactNative"))
     return fetch("https://builder.io/api/v1/track", {
       method: "POST",
       body: JSON.stringify({
-        events: [await gn(e)]
+        events: [await yn(e)]
       }),
       headers: {
         "content-type": "application/json"
@@ -2006,10 +2029,10 @@ async function M(e) {
       console.error("Failed to track: ", t);
     });
 }
-const Bn = (e) => M({ ...e, canTrack: !0 }), J = {};
-function bn(e, t) {
+const Wn = (e) => L({ ...e, canTrack: !0 }), vn = "0.3.2-0", J = {};
+function kn(e, t) {
   let n = J[e];
-  if (n || (n = J[e] = []), n.push(t), m()) {
+  if (n || (n = J[e] = []), n.push(t), h()) {
     const o = {
       type: "builder.register",
       data: {
@@ -2024,8 +2047,8 @@ function bn(e, t) {
     }
   }
 }
-const yn = () => {
-  bn("insertMenu", {
+const Sn = () => {
+  kn("insertMenu", {
     name: "_default",
     default: !0,
     items: [
@@ -2041,13 +2064,14 @@ const yn = () => {
   });
 };
 let X = !1;
-const vn = (e = {}) => {
+const wn = (e = {}) => {
   var t, n;
-  X || (X = !0, m() && ((t = window.parent) == null || t.postMessage(
+  X || (X = !0, h() && ((t = window.parent) == null || t.postMessage(
     {
       type: "builder.sdkInfo",
       data: {
-        target: _,
+        target: A,
+        version: vn,
         supportsPatchUpdates: !1,
         supportsAddBlockScoping: !0,
         supportsCustomBreakpoints: !0
@@ -2068,24 +2092,24 @@ const vn = (e = {}) => {
       switch (o.type) {
         case "builder.evaluate": {
           const i = o.data.text, l = o.data.arguments || [], a = o.data.id, c = new Function(i);
-          let u, b = null;
+          let u, m = null;
           try {
             u = c.apply(null, l);
-          } catch (g) {
-            b = g;
+          } catch (b) {
+            m = b;
           }
-          b ? (s = window.parent) == null || s.postMessage(
+          m ? (s = window.parent) == null || s.postMessage(
             {
               type: "builder.evaluateError",
-              data: { id: a, error: b.message }
+              data: { id: a, error: m.message }
             },
             "*"
-          ) : u && typeof u.then == "function" ? u.then((g) => {
-            var y;
-            (y = window.parent) == null || y.postMessage(
+          ) : u && typeof u.then == "function" ? u.then((b) => {
+            var k;
+            (k = window.parent) == null || k.postMessage(
               {
                 type: "builder.evaluateResult",
-                data: { id: a, result: g }
+                data: { id: a, result: b }
               },
               "*"
             );
@@ -2104,7 +2128,7 @@ const vn = (e = {}) => {
 function Y(e) {
   return Math.round(e * 1e3) / 1e3;
 }
-const kn = (e, t, n = !0) => {
+const Cn = (e, t, n = !0) => {
   if (!(e instanceof HTMLElement))
     return null;
   let o = n ? e : e.parentElement;
@@ -2115,7 +2139,7 @@ const kn = (e, t, n = !0) => {
       return o;
   } while (o = o.parentElement);
   return null;
-}, Sn = (e) => kn(e, (t) => {
+}, In = (e) => Cn(e, (t) => {
   const n = t.getAttribute("builder-id") || t.id;
   return Boolean((n == null ? void 0 : n.indexOf("builder-")) === 0);
 }), Q = ({
@@ -2127,8 +2151,8 @@ const kn = (e, t, n = !0) => {
     x: r,
     y: i
   };
-}, wn = (e) => {
-  const t = e.target, n = t && Sn(t), o = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
+}, xn = (e) => {
+  const t = e.target, n = t && In(t), o = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
   return {
     targetBuilderElement: o || void 0,
     metadata: {
@@ -2137,7 +2161,7 @@ const kn = (e, t, n = !0) => {
       builderElementIndex: n && o ? [].slice.call(document.getElementsByClassName(o)).indexOf(n) : void 0
     }
   };
-}, Cn = ({
+}, $n = ({
   content: e,
   data: t,
   locale: n
@@ -2154,7 +2178,7 @@ const kn = (e, t, n = !0) => {
     ...n ? { locale: n } : {}
   };
   return { ...o, ...s };
-}, xn = ({
+}, Tn = ({
   content: e,
   data: t
 }) => e ? {
@@ -2164,21 +2188,21 @@ const kn = (e, t, n = !0) => {
     ...t
   },
   meta: e == null ? void 0 : e.meta
-} : void 0, In = () => Promise.resolve().then(() => ne).then((e) => e.default).catch((e) => {
+} : void 0, Rn = fe, En = () => Promise.resolve().then(() => ne).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlocks at ../render-blocks.vue",
     e
   ), e;
-}), $n = () => import("./render-styles.90b25836.js").then((e) => e.default).catch((e) => {
+}), _n = () => import("./render-styles.7f31b369.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;
-}), Tn = h({
+}), An = f({
   name: "render-content",
   components: {
-    RenderContentStyles: S($n),
-    RenderBlocks: S(In)
+    RenderContentStyles: w(_n),
+    RenderBlocks: w(En)
   },
   props: [
     "content",
@@ -2190,46 +2214,51 @@ const kn = (e, t, n = !0) => {
     "context",
     "apiKey",
     "includeRefs",
+    "enrich",
     "apiVersion"
   ],
   data() {
     return {
       forceReRenderCount: 0,
       overrideContent: null,
-      useContent: xn({
+      useContent: Tn({
         content: this.content,
         data: this.data
       }),
       update: 0,
-      canTrackToUse: I(this.canTrack) ? this.canTrack : !0,
-      contentState: Cn({
+      canTrackToUse: $(this.canTrack) ? this.canTrack : !0,
+      contentState: $n({
         content: this.content,
         data: this.data,
         locale: this.locale
       }),
       allRegisteredComponents: [
-        ...Yt(),
+        ...Qt(),
         ...ce,
         ...this.customComponents || []
       ].reduce(
-        (e, t) => ({
+        (e, { component: t, ...n }) => ({
           ...e,
-          [t.name]: t
+          [n.name]: {
+            component: Rn(t),
+            ...n
+          }
         }),
         {}
       ),
       httpReqsData: {},
       clicked: !1,
-      TARGET: _
+      TARGET: A
     };
   },
   provide() {
     const e = this;
     return {
-      [P.key]: {
+      [O.key]: {
         content: e.useContent,
-        state: e.contentState,
-        setState: e.setContextState,
+        localState: void 0,
+        rootState: e.contentState,
+        rootSetState: e.contentSetState,
         context: e.context || {},
         apiKey: e.apiKey,
         apiVersion: e.apiVersion,
@@ -2240,28 +2269,31 @@ const kn = (e, t, n = !0) => {
   },
   mounted() {
     var e, t;
-    if (this.apiKey || C.error(
+    if (this.apiKey || I.error(
       "No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
-    ), m()) {
-      if (k() && (this.forceReRenderCount = this.forceReRenderCount + 1, yn(), vn({
+    ), h()) {
+      if (v() && (this.forceReRenderCount = this.forceReRenderCount + 1, Sn(), wn({
         ...this.locale ? {
           locale: this.locale
         } : {},
         ...this.includeRefs ? {
           includeRefs: this.includeRefs
+        } : {},
+        ...this.enrich ? {
+          enrich: this.enrich
         } : {}
       }), Object.values(
         this.allRegisteredComponents
       ).forEach((n) => {
         var s;
-        const o = Zt(n);
+        const o = tn(n);
         (s = window.parent) == null || s.postMessage(o, "*");
       }), window.addEventListener("message", this.processMessage), window.addEventListener(
         "builder:component:stateChangeListenerActivated",
         this.emitStateUpdate
       )), this.useContent) {
         const n = (e = this.useContent) == null ? void 0 : e.testVariationId, o = (t = this.useContent) == null ? void 0 : t.id;
-        M({
+        L({
           type: "impression",
           canTrack: this.canTrackToUse,
           contentId: o,
@@ -2269,7 +2301,7 @@ const kn = (e, t, n = !0) => {
           variationId: n !== o ? n : void 0
         });
       }
-      if (Qt()) {
+      if (en()) {
         const n = new URL(location.href).searchParams, o = n.get("builder.preview"), s = n.get(
           `builder.preview.${o}`
         ), r = n.get("apiKey") || n.get("builder.space");
@@ -2311,7 +2343,7 @@ const kn = (e, t, n = !0) => {
     }
   },
   unmounted() {
-    m() && (window.removeEventListener("message", this.processMessage), window.removeEventListener(
+    h() && (window.removeEventListener("message", this.processMessage), window.removeEventListener(
       "builder:component:stateChangeListenerActivated",
       this.emitStateUpdate
     ));
@@ -2368,7 +2400,7 @@ const kn = (e, t, n = !0) => {
         }
       };
     },
-    setContextState(e) {
+    contentSetState(e) {
       this.contentState = e;
     },
     processMessage(e) {
@@ -2396,20 +2428,22 @@ const kn = (e, t, n = !0) => {
       e && G({
         code: e,
         context: this.context || {},
-        state: this.contentState
+        localState: void 0,
+        rootState: this.contentState,
+        rootSetState: this.contentSetState
       });
     },
     onClick(e) {
       var t, n;
       if (this.useContent) {
         const o = (t = this.useContent) == null ? void 0 : t.testVariationId, s = (n = this.useContent) == null ? void 0 : n.id;
-        M({
+        L({
           type: "click",
           canTrack: this.canTrackToUse,
           contentId: s,
           apiKey: this.apiKey,
           variationId: o !== s ? o : void 0,
-          ...wn(e),
+          ...xn(e),
           unique: !this.clicked
         });
       }
@@ -2421,7 +2455,9 @@ const kn = (e, t, n = !0) => {
         (t, n) => G({
           code: n,
           context: this.context || {},
-          state: this.contentState
+          localState: void 0,
+          rootState: this.contentState,
+          rootSetState: this.contentSetState
         })
       );
     },
@@ -2431,7 +2467,7 @@ const kn = (e, t, n = !0) => {
           ...this.contentState,
           [t]: n
         };
-        this.setContextState(o);
+        this.contentSetState(o);
       }).catch((n) => {
         console.error("error fetching dynamic data", e, n);
       });
@@ -2440,7 +2476,7 @@ const kn = (e, t, n = !0) => {
       var t, n, o;
       const e = (o = (n = (t = this.useContent) == null ? void 0 : t.data) == null ? void 0 : n.httpRequests) != null ? o : {};
       Object.entries(e).forEach(([s, r]) => {
-        if (r && (!this.httpReqsData[s] || k())) {
+        if (r && (!this.httpReqsData[s] || v())) {
           const i = this.evalExpression(r);
           this.handleRequest({
             url: i,
@@ -2450,7 +2486,7 @@ const kn = (e, t, n = !0) => {
       });
     },
     emitStateUpdate() {
-      k() && window.dispatchEvent(
+      v() && window.dispatchEvent(
         new CustomEvent(
           "builder:component:stateChange",
           {
@@ -2465,10 +2501,10 @@ const kn = (e, t, n = !0) => {
       );
     }
   }
-}), Rn = ["builder-content-id", "builder-model"];
-function En(e, t, n, o, s, r) {
-  var a, c, u, b, g, y, $, N;
-  const i = w("render-content-styles"), l = w("render-blocks");
+}), jn = ["builder-content-id", "builder-model"];
+function Vn(e, t, n, o, s, r) {
+  var a, c, u, m, b, k, S, T;
+  const i = C("render-content-styles"), l = C("render-blocks");
   return e.useContent ? (d(), p("div", {
     key: 0,
     ref: "elementRef",
@@ -2476,24 +2512,24 @@ function En(e, t, n, o, s, r) {
     "builder-content-id": (a = e.useContent) == null ? void 0 : a.id,
     "builder-model": e.model
   }, [
-    e.TARGET !== "reactNative" ? (d(), E(i, {
+    e.TARGET !== "reactNative" ? (d(), _(i, {
       key: 0,
       contentId: (c = e.useContent) == null ? void 0 : c.id,
-      cssCode: (b = (u = e.useContent) == null ? void 0 : u.data) == null ? void 0 : b.cssCode,
-      customFonts: (y = (g = e.useContent) == null ? void 0 : g.data) == null ? void 0 : y.customFonts
-    }, null, 8, ["contentId", "cssCode", "customFonts"])) : v("", !0),
-    (d(), E(l, {
-      blocks: (N = ($ = e.useContent) == null ? void 0 : $.data) == null ? void 0 : N.blocks,
+      cssCode: (m = (u = e.useContent) == null ? void 0 : u.data) == null ? void 0 : m.cssCode,
+      customFonts: (k = (b = e.useContent) == null ? void 0 : b.data) == null ? void 0 : k.customFonts
+    }, null, 8, ["contentId", "cssCode", "customFonts"])) : y("", !0),
+    (d(), _(l, {
+      blocks: (T = (S = e.useContent) == null ? void 0 : S.data) == null ? void 0 : T.blocks,
       key: e.forceReRenderCount
     }, null, 8, ["blocks"]))
-  ], 8, Rn)) : v("", !0);
+  ], 8, jn)) : y("", !0);
 }
-const _n = /* @__PURE__ */ f(Tn, [["render", En]]), An = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Pn = /* @__PURE__ */ g(An, [["render", Vn]]), On = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: _n
+  default: Pn
 }, Symbol.toStringTag, { value: "Module" })), Z = {};
-function Fn(e) {
-  if (m()) {
+function Mn(e) {
+  if (h()) {
     Object.assign(Z, e);
     const t = {
       type: "builder.settingsChange",
@@ -2503,36 +2539,36 @@ function Fn(e) {
   }
 }
 export {
-  P as B,
-  Ie as C,
-  Re as F,
+  O as B,
+  $e as C,
+  Ee as F,
   Fe as I,
-  Ye as S,
-  _ as T,
-  Vt as V,
-  f as _,
-  Vn as a,
-  ye as b,
-  I as c,
-  _n as d,
+  Qe as S,
+  A as T,
+  Pt as V,
+  g as _,
+  Fn as a,
+  ve as b,
+  $ as c,
+  Pn as d,
   G as e,
-  L as f,
-  ve as g,
-  Ct as h,
-  Rt as i,
-  k as j,
-  Qt as k,
+  N as f,
+  ke as g,
+  It as h,
+  Et as i,
+  v as j,
+  en as k,
   ce as l,
-  Pn as m,
-  Zt as n,
-  bn as o,
+  Un as m,
+  tn as n,
+  kn as o,
   le as p,
-  yt as q,
-  He as r,
-  Fn as s,
-  Bn as t,
-  mt as u,
-  ht as v,
-  ft as w,
+  vt as q,
+  Ke as r,
+  Mn as s,
+  Wn as t,
+  ht as u,
+  ft as v,
+  gt as w,
   ae as x
 };