@builder.io/sdk-vue 0.1.1 → 0.1.3

package/packages/_vue3/dist/{index.7a69508d.js → index.dfbf4ad8.js}

@@ -1,12 +1,12 @@
-import { defineAsyncComponent as x, resolveComponent as k, openBlock as l, createElementBlock as u, normalizeClass as E, normalizeStyle as _, createBlock as w, createCommentVNode as b, Fragment as T, renderList as $, createVNode as q, createElementVNode as B, renderSlot as R, mergeProps as C, toDisplayString as W } from "vue";
-const j = "vue3";
+import { defineAsyncComponent as x, resolveComponent as k, openBlock as l, createElementBlock as u, normalizeClass as j, normalizeStyle as w, createBlock as I, createCommentVNode as b, Fragment as R, renderList as O, createVNode as X, createElementVNode as L, renderSlot as E, mergeProps as S, toDisplayString as W } from "vue";
+const T = "vue3";
 function f() {
   return typeof window < "u" && typeof document < "u";
 }
-const L = {};
-function ce(e, n) {
-  let t = L[e];
-  if (t || (t = L[e] = []), t.push(n), f()) {
+const M = {};
+function ue(e, n) {
+  let t = M[e];
+  if (t || (t = M[e] = []), t.push(n), f()) {
     const o = {
       type: "builder.register",
       data: {
@@ -21,8 +21,8 @@ function ce(e, n) {
     }
   }
 }
-const le = () => {
-  ce("insertMenu", {
+const me = () => {
+  ue("insertMenu", {
     name: "_default",
     default: !0,
     items: [
@@ -38,13 +38,13 @@ const le = () => {
   });
 };
 let N = !1;
-const de = (e = {}) => {
+const pe = (e = {}) => {
   var n, t;
   N || (N = !0, f() && ((n = window.parent) == null || n.postMessage(
     {
       type: "builder.sdkInfo",
       data: {
-        target: j,
+        target: T,
         supportsPatchUpdates: !1,
         supportsAddBlockScoping: !0,
         supportsCustomBreakpoints: !0
@@ -97,7 +97,7 @@ const de = (e = {}) => {
         }
       }
   })));
-}, U = (e) => JSON.parse(JSON.stringify(e)), G = {
+}, U = (e) => JSON.parse(JSON.stringify(e)), Y = {
   small: {
     min: 320,
     default: 321,
@@ -113,8 +113,8 @@ const de = (e = {}) => {
     default: 991,
     max: 1200
   }
-}, vn = (e, n = G) => `@media (max-width: ${n[e].max}px)`, ue = ({ small: e, medium: n }) => {
-  const t = U(G);
+}, Rn = (e, n = Y) => `@media (max-width: ${n[e].max}px)`, he = ({ small: e, medium: n }) => {
+  const t = U(Y);
   if (!e || !n)
     return t;
   const o = Math.floor(e / 2);
@@ -135,36 +135,36 @@ const de = (e = {}) => {
     min: s,
     default: s + 1
   }, t;
-}, me = (e) => e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), I = (e) => e != null, pe = (e) => Object.entries(e).map(([t, o]) => {
+}, fe = (e) => e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), C = (e) => e != null, ge = (e) => Object.entries(e).map(([t, o]) => {
   if (typeof o == "string")
-    return `${me(t)}: ${o};`;
-}).filter(I), S = (e) => pe(e).join(`
-`), xn = ({
+    return `${fe(t)}: ${o};`;
+}).filter(C), _ = (e) => ge(e).join(`
+`), En = ({
   mediaQuery: e,
   className: n,
   styles: t
 }) => {
   const o = `.${n} {
-    ${S(t)}
+    ${_(t)}
   }`;
   return e ? `${e} {
       ${o}
     }` : o;
-}, he = () => Promise.resolve().then(() => ie).then((e) => e.default).catch((e) => {
+}, be = () => Promise.resolve().then(() => le).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlocks at ../../components/render-blocks.vue",
     e
   ), e;
-}), fe = () => import("./render-inlined-styles.87ca82f0.js").then((e) => e.default).catch((e) => {
+}), ye = () => import("./render-inlined-styles.dc458558.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;
-}), ge = {
+}), ve = {
   name: "builder-columns",
   components: {
-    RenderInlinedStyles: x(fe),
-    RenderBlocks: x(he)
+    RenderInlinedStyles: x(ye),
+    RenderBlocks: x(be)
   },
   props: [
     "space",
@@ -174,7 +174,9 @@ const de = (e = {}) => {
     "customBreakpoints",
     "builderBlock"
   ],
-  data: () => ({ TARGET: j }),
+  data() {
+    return { TARGET: T };
+  },
   computed: {
     columnsCssVars() {
       const e = this.stackColumnsAt === "never" ? "inherit" : this.reverseColumnsWhenStacked ? "column-reverse" : "column";
@@ -220,21 +222,21 @@ const de = (e = {}) => {
       return `
       @media (max-width: ${this.getWidthForBreakpointSize("medium")}px) {
         .${this.builderBlock.id}-breakpoints {
-          ${S(this.columnStyleObjects.columns.medium)}
+          ${_(this.columnStyleObjects.columns.medium)}
         }
 
         .${this.builderBlock.id}-breakpoints > .builder-column {
-          ${S(this.columnStyleObjects.column.medium)}
+          ${_(this.columnStyleObjects.column.medium)}
         }
       }
 
       @media (max-width: ${this.getWidthForBreakpointSize("small")}px) {
         .${this.builderBlock.id}-breakpoints {
-          ${S(this.columnStyleObjects.columns.small)}
+          ${_(this.columnStyleObjects.columns.small)}
         }
 
         .${this.builderBlock.id}-breakpoints > .builder-column {
-          ${S(this.columnStyleObjects.column.small)}
+          ${_(this.columnStyleObjects.column.small)}
         }
       },
     `;
@@ -266,7 +268,7 @@ const de = (e = {}) => {
       return (this.stackColumnsAt || "tablet") === "tablet" ? e : "inherit";
     },
     getWidthForBreakpointSize(e) {
-      return ue(
+      return he(
         this.customBreakpoints || {}
       )[e].max;
     },
@@ -287,34 +289,34 @@ const g = (e, n) => {
     t[o] = r;
   return t;
 };
-function be(e, n, t, o, r, s) {
+function xe(e, n, t, o, r, s) {
   const i = k("render-inlined-styles"), c = k("render-blocks");
   return l(), u("div", {
-    class: E(
+    class: j(
       s._classStringToObject(
-        `builder-columns ${t.builderBlock.id}-breakpoints div-2oob28krk0a`
+        `builder-columns ${t.builderBlock.id}-breakpoints div-256wrwn33ry`
       )
     ),
-    style: _({
-      ...e.TARGET === "reactNative" ? s.reactNativeColumnsStyles : {},
+    style: w({
+      ...r.TARGET === "reactNative" ? s.reactNativeColumnsStyles : {},
       ...s.columnsCssVars
     })
   }, [
-    e.TARGET !== "reactNative" ? (l(), w(i, {
+    r.TARGET !== "reactNative" ? (l(), I(i, {
       key: 0,
       styles: s.columnsStyles
     }, null, 8, ["styles"])) : b("", !0),
-    (l(!0), u(T, null, $(t.columns, (a, d) => (l(), u("div", {
+    (l(!0), u(R, null, O(t.columns, (a, d) => (l(), u("div", {
       key: d,
-      class: "builder-column div-2oob28krk0a-2",
-      style: _({
+      class: "builder-column div-256wrwn33ry-2",
+      style: w({
         width: s.getColumnCssWidth(d),
         marginLeft: `${d === 0 ? 0 : s.getGutterSize()}px`,
-        ...e.TARGET === "reactNative" ? s.reactNativeColumnStyles : {},
+        ...r.TARGET === "reactNative" ? s.reactNativeColumnStyles : {},
         ...s.columnCssVars
       })
     }, [
-      q(c, {
+      X(c, {
         blocks: a.blocks,
         path: `component.options.columns.${d}.blocks`,
         parent: t.builderBlock.id,
@@ -325,40 +327,40 @@ function be(e, n, t, o, r, s) {
     ], 4))), 128))
   ], 6);
 }
-const ye = /* @__PURE__ */ g(ge, [["render", be], ["__scopeId", "data-v-e8ae58c5"]]);
-function M(e) {
+const ke = /* @__PURE__ */ g(ve, [["render", xe], ["__scopeId", "data-v-cdd596ee"]]);
+function z(e) {
   return e.replace(/http(s)?:/, "");
 }
-function ve(e = "", n, t) {
+function Ce(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 xe(e, n) {
+function Se(e, n) {
   if (!e || !(e != null && e.match(/cdn\.shopify\.com/)) || !n)
     return e;
   if (n === "master")
-    return M(e);
+    return z(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 M(`${o[0]}_${s}${r}`);
+    return z(`${o[0]}_${s}${r}`);
   }
   return null;
 }
-function A(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) => `${ve(e, "width", r)} ${r}w`).concat([t]).join(", ");
+    return isNaN(o) || (t = `${t} ${o}w`), n.filter((r) => r !== o).map((r) => `${Ce(e, "width", r)} ${r}w`).concat([t]).join(", ");
   }
-  return e.match(/cdn\.shopify\.com/) ? n.map((t) => [xe(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) => [Se(e, `${t}x${t}`), t]).filter(([t]) => !!t).map(([t, o]) => `${t} ${o}w`).concat([e]).join(", ") : e;
 }
-const ke = {
+const _e = {
   name: "builder-image",
   props: [
     "image",
@@ -382,10 +384,10 @@ const ke = {
         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"), A(n);
+          return console.debug("Removed given srcset"), F(n);
       } else if (this.image && !this.srcset)
-        return A(n);
-      return A(n);
+        return F(n);
+      return F(n);
     },
     webpSrcSet() {
       var e;
@@ -414,63 +416,62 @@ const ke = {
     }
   }
 };
-const Ce = ["srcset"], Se = ["alt", "role", "src", "srcset", "sizes"], _e = ["srcset"], we = {
+const we = ["srcset"], Ie = ["alt", "role", "src", "srcset", "sizes"], Te = {
   key: 2,
-  class: "div-1n1bt6e2i9n-2"
+  class: "div-kd7f8ex7am-2"
 };
-function Ie(e, n, t, o, r, s) {
+function Re(e, n, t, o, r, s) {
   var i, c, a, d;
-  return l(), u(T, null, [
-    B("picture", null, [
+  return l(), u(R, null, [
+    L("picture", null, [
       s.webpSrcSet ? (l(), u("source", {
         key: 0,
         type: "image/webp",
         srcset: s.webpSrcSet
-      }, null, 8, Ce)) : b("", !0),
-      B("img", {
+      }, null, 8, we)) : b("", !0),
+      L("img", {
         loading: "lazy",
         alt: t.altText,
         role: t.altText ? "presentation" : void 0,
-        style: _({
+        style: w({
           objectPosition: t.backgroundPosition || "center",
           objectFit: t.backgroundSize || "cover",
           ...s.aspectRatioCss
         }),
-        class: E(
+        class: j(
           s._classStringToObject(
-            "builder-image" + (t.className ? " " + t.className : "") + " img-1n1bt6e2i9n"
+            "builder-image" + (t.className ? " " + t.className : "") + " img-kd7f8ex7am"
           )
         ),
         src: t.image,
         srcset: s.srcSetToUse,
         sizes: t.sizes
-      }, null, 14, Se),
-      B("source", { srcset: s.srcSetToUse }, null, 8, _e)
+      }, null, 14, Ie)
     ]),
     t.aspectRatio && !(((c = (i = t.builderBlock) == null ? void 0 : i.children) == null ? void 0 : c.length) && t.fitContent) ? (l(), u("div", {
       key: 0,
-      class: "builder-image-sizer div-1n1bt6e2i9n",
-      style: _({
+      class: "builder-image-sizer div-kd7f8ex7am",
+      style: w({
         paddingTop: t.aspectRatio * 100 + "%"
       })
     }, null, 4)) : b("", !0),
-    ((d = (a = t.builderBlock) == null ? void 0 : a.children) == null ? void 0 : d.length) && t.fitContent ? R(e.$slots, "default", { key: 1 }, void 0, !0) : b("", !0),
-    !t.fitContent && e.children ? (l(), u("div", we, [
-      R(e.$slots, "default", {}, void 0, !0)
+    ((d = (a = t.builderBlock) == null ? void 0 : a.children) == null ? void 0 : d.length) && t.fitContent ? E(e.$slots, "default", { key: 1 }, void 0, !0) : b("", !0),
+    !t.fitContent && e.children ? (l(), u("div", Te, [
+      E(e.$slots, "default", {}, void 0, !0)
     ])) : b("", !0)
   ], 64);
 }
-const Te = /* @__PURE__ */ g(ke, [["render", Ie], ["__scopeId", "data-v-ce478e56"]]), Re = {
+const Ee = /* @__PURE__ */ g(_e, [["render", Re], ["__scopeId", "data-v-7ef88ea3"]]), je = {
   name: "builder-text",
   props: ["text"]
-}, Ee = ["innerHTML"];
-function je(e, n, t, o, r, s) {
+}, Be = ["innerHTML"];
+function Fe(e, n, t, o, r, s) {
   return l(), u("span", {
     class: "builder-text",
     innerHTML: t.text
-  }, null, 8, Ee);
+  }, null, 8, Be);
 }
-const Fe = /* @__PURE__ */ g(Re, [["render", je]]), Be = {
+const Oe = /* @__PURE__ */ g(je, [["render", Fe]]), Ae = {
   name: "builder-video",
   props: [
     "autoPlay",
@@ -511,10 +512,10 @@ const Fe = /* @__PURE__ */ g(Re, [["render", je]]), Be = {
       };
     }
   }
-}, Ae = ["src", "poster"];
-function $e(e, n, t, o, r, s) {
+}, Pe = ["src", "poster"];
+function Ue(e, n, t, o, r, s) {
   var i;
-  return l(), u("video", C({
+  return l(), u("video", S({
     style: {
       width: "100%",
       height: "100%",
@@ -525,14 +526,24 @@ function $e(e, n, t, o, r, s) {
     },
     src: t.video || "no-src",
     poster: t.posterImage
-  }, s.spreadProps), null, 16, Ae);
+  }, s.spreadProps), null, 16, Pe);
 }
-const Oe = /* @__PURE__ */ g(Be, [["render", $e]]);
-function Pe() {
+const $e = /* @__PURE__ */ g(Ae, [["render", Ue]]), Ve = Symbol(), $ = {
+  Builder: {
+    content: null,
+    context: {},
+    state: {},
+    apiKey: null,
+    registeredComponents: {},
+    inheritedStyles: {}
+  },
+  key: Ve
+};
+function Le() {
   return typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : globalThis;
 }
-function Ue() {
-  const e = Pe().fetch;
+function We() {
+  const e = Le().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. 
@@ -540,10 +551,12 @@ function Ue() {
     ), new Error("Builder SDK could not find a global `fetch` function");
   return e;
 }
-const J = Ue(), Ve = (e) => {
+const Q = We(), Me = (e) => {
+  if (e === "localhost" || e === "127.0.0.1")
+    return e;
   const n = e.split(".");
   return n.length > 2 ? n.slice(1).join(".") : e;
-}, X = async ({
+}, Z = async ({
   name: e,
   canTrack: n
 }) => {
@@ -552,24 +565,25 @@ const J = Ue(), Ve = (e) => {
     return n ? (t = document.cookie.split("; ").find((o) => o.startsWith(`${e}=`))) == null ? void 0 : t.split("=")[1] : void 0;
   } catch (o) {
     console.debug("[COOKIE] GET error: ", o);
+    return;
   }
-}, We = (e) => e.map(([n, t]) => t ? `${n}=${t}` : n).join("; "), Le = [
+}, Ne = (e) => e.map(([n, t]) => t ? `${n}=${t}` : n).filter(C).join("; "), ze = [
   ["secure", ""],
   ["SameSite", "None"]
-], Ne = ({
+], Ke = ({
   name: e,
   value: n,
   expires: t
 }) => {
-  const r = (f() ? location.protocol === "https:" : !0) ? Le : [[]], s = t ? [["expires", t.toUTCString()]] : [[]], i = [
+  const r = (f() ? location.protocol === "https:" : !0) ? ze : [[]], s = t ? [["expires", t.toUTCString()]] : [[]], i = [
     [e, n],
     ...s,
     ["path", "/"],
-    ["domain", Ve(window.location.hostname)],
+    ["domain", Me(window.location.hostname)],
     ...r
   ];
-  return We(i);
-}, Y = async ({
+  return Ne(i);
+}, ee = async ({
   name: e,
   value: n,
   expires: t,
@@ -578,19 +592,19 @@ const J = Ue(), Ve = (e) => {
   try {
     if (!o)
       return;
-    const r = Ne({ name: e, value: n, expires: t });
+    const r = Ke({ name: e, value: n, expires: t });
     document.cookie = r;
   } catch (r) {
     console.warn("[COOKIE] SET error: ", r);
   }
-}, Me = "builderio.variations", Q = (e) => `${Me}.${e}`, ze = ({
+}, He = "builderio.variations", te = (e) => `${He}.${e}`, De = ({
   contentId: e,
   canTrack: n
-}) => X({ name: Q(e), canTrack: n }), He = ({
+}) => Z({ name: te(e), canTrack: n }), qe = ({
   contentId: e,
   canTrack: n,
   value: t
-}) => Y({ name: Q(e), value: t, canTrack: n }), Ke = (e) => I(e.id) && I(e.variations) && Object.keys(e.variations).length > 0, De = ({
+}) => ee({ name: te(e), value: t, canTrack: n }), Ge = (e) => C(e.id) && C(e.variations) && Object.keys(e.variations).length > 0, Je = ({
   id: e,
   variations: n
 }) => {
@@ -601,7 +615,7 @@ const J = Ue(), Ve = (e) => {
     if (t += (r = n[s]) == null ? void 0 : r.testRatio, o < t)
       return s;
   return e;
-}, z = ({
+}, K = ({
   item: e,
   testGroupId: n
 }) => {
@@ -614,69 +628,69 @@ const J = Ue(), Ve = (e) => {
     testVariationId: t.id,
     testVariationName: t.name || (t.id === e.id ? "Default" : "")
   };
-}, qe = async ({
+}, Xe = async ({
   item: e,
   canTrack: n
 }) => {
-  const t = await ze({
+  const t = await De({
     canTrack: n,
     contentId: e.id
-  }), o = t ? z({ item: e, testGroupId: t }) : void 0;
+  }), o = t ? K({ item: e, testGroupId: t }) : void 0;
   if (o)
     return o;
   {
-    const r = De({
+    const r = Je({
       variations: e.variations,
       id: e.id
     });
-    return He({
+    return qe({
       contentId: e.id,
       value: r,
       canTrack: n
     }).catch((s) => {
       console.error("could not store A/B test variation: ", s);
-    }), z({ item: e, testGroupId: r });
+    }), K({ item: e, testGroupId: r });
   }
-}, Ge = async ({
+}, Ye = async ({
   item: e,
   canTrack: n
 }) => {
-  if (!Ke(e))
+  if (!Ge(e))
     return;
-  const t = await qe({ item: e, canTrack: n });
+  const t = await Xe({ item: e, canTrack: n });
   Object.assign(e, t);
 };
-function O(e, n = null, t = ".") {
+function A(e, n = null, t = ".") {
   return Object.keys(e).reduce((o, r) => {
     const s = e[r], i = [n, r].filter(Boolean).join(t);
     return [
       typeof s == "object",
       s !== null,
       !(Array.isArray(s) && s.length === 0)
-    ].every(Boolean) ? { ...o, ...O(s, i, t) } : { ...o, [i]: s };
+    ].every(Boolean) ? { ...o, ...A(s, i, t) } : { ...o, [i]: s };
   }, {});
 }
-const H = "builder.", Je = "options.", Xe = (e) => {
+const H = "builder.", Qe = "options.", Ze = (e) => {
   const n = {};
   return e.forEach((t, o) => {
     n[o] = t;
   }), n;
-}, Ye = (e) => {
+}, et = (e) => {
   if (!e)
     return {};
-  const n = Z(e), t = {};
+  const n = ne(e), t = {};
   return Object.keys(n).forEach((o) => {
     if (o.startsWith(H)) {
-      const r = o.replace(H, "").replace(Je, "");
+      const r = o.replace(H, "").replace(Qe, "");
       t[r] = n[o];
     }
   }), t;
-}, Qe = () => {
+}, tt = () => {
   if (!f())
     return {};
   const e = new URLSearchParams(window.location.search);
-  return Ye(e);
-}, Z = (e) => e instanceof URLSearchParams ? Xe(e) : e, Ze = (e) => {
+  return et(e);
+}, ne = (e) => e instanceof URLSearchParams ? Ze(e) : e, nt = (e) => {
   const {
     limit: n = 30,
     userAttributes: t,
@@ -692,53 +706,59 @@ const H = "builder.", Je = "options.", Xe = (e) => {
   const d = new URL(
     `https://cdn.builder.io/api/v2/content/${s}?apiKey=${i}&limit=${n}&noTraverse=${r}&includeRefs=${c}${a ? `&locale=${a}` : ""}`
   ), m = {
-    ...Qe(),
-    ...Z(e.options || {})
-  }, p = O(m);
+    ...tt(),
+    ...ne(e.options || {})
+  }, p = A(m);
   for (const h in p)
     d.searchParams.set(h, String(p[h]));
   if (t && d.searchParams.set("userAttributes", JSON.stringify(t)), o) {
-    const h = O({ query: o });
+    const h = A({ query: o });
     for (const v in h)
       d.searchParams.set(v, JSON.stringify(h[v]));
   }
   return d;
 };
-async function ee(e) {
-  return (await et({ ...e, limit: 1 })).results[0] || null;
+async function oe(e) {
+  return (await ot({ ...e, limit: 1 })).results[0] || null;
 }
-async function et(e) {
-  const n = Ze(e), o = await (await J(n.href)).json(), r = e.canTrack !== !1;
+async function ot(e) {
+  const n = nt(e), o = await (await Q(n.href)).json(), r = e.canTrack !== !1;
   if (r && Array.isArray(o.results))
     for (const s of o.results)
-      await Ge({ item: s, canTrack: r });
+      await Ye({ item: s, canTrack: r });
   return o;
 }
-const tt = () => Promise.resolve().then(() => un).then((e) => e.default).catch((e) => {
+const st = () => Promise.resolve().then(() => xn).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;
-}), nt = {
+}), rt = {
   name: "builder-symbol",
-  components: { RenderContent: x(tt) },
+  components: { RenderContent: x(st) },
   props: ["attributes", "symbol", "dynamic"],
-  data: () => ({ fetchedContent: null }),
+  data() {
+    return { fetchedContent: null };
+  },
   inject: {
-    builderContext: "BuilderContext"
+    builderContext: $.key
   },
   watch: {
-    onUpdateHook0() {
-      const e = this.symbol;
-      e && !e.content && !this.fetchedContent && e.model && ee({
-        model: e.model,
-        apiKey: this.builderContext.apiKey,
-        query: {
-          id: e.entry
-        }
-      }).then((n) => {
-        this.fetchedContent = n;
-      });
+    onUpdateHook0: {
+      handler() {
+        var n;
+        const e = this.symbol;
+        e && !e.content && !this.fetchedContent && e.model && ((n = this.builderContext) == null ? void 0 : n.apiKey) && oe({
+          model: e.model,
+          apiKey: this.builderContext.apiKey,
+          query: {
+            id: e.entry
+          }
+        }).then((t) => {
+          this.fetchedContent = t;
+        });
+      },
+      immediate: !0
     }
   },
   computed: {
@@ -773,17 +793,17 @@ const tt = () => Promise.resolve().then(() => un).then((e) => e.default).catch((
       return n;
     }
   }
-}, ot = ["dataSet"];
-function st(e, n, t, o, r, s) {
+}, it = ["dataSet"];
+function at(e, n, t, o, r, s) {
   var c, a, d, m, p;
   const i = k("render-content");
-  return l(), u("div", C({
+  return l(), u("div", S({
     dataSet: {
       class: s.className
     },
     class: s._classStringToObject(s.className)
   }, t.attributes), [
-    q(i, {
+    X(i, {
       apiKey: s.builderContext.apiKey,
       context: s.builderContext.context,
       customComponents: Object.values(s.builderContext.registeredComponents),
@@ -795,30 +815,30 @@ function st(e, n, t, o, r, s) {
       model: (p = t.symbol) == null ? void 0 : p.model,
       content: s.contentToUse
     }, null, 8, ["apiKey", "context", "customComponents", "data", "model", "content"])
-  ], 16, ot);
+  ], 16, it);
 }
-const rt = /* @__PURE__ */ g(nt, [["render", st]]), it = {
+const ct = /* @__PURE__ */ g(rt, [["render", at]]), lt = {
   name: "builder-button",
   props: ["attributes", "text", "link", "openLinkInNewTab"]
 };
-const at = ["href", "target"];
-function ct(e, n, t, o, r, s) {
-  return t.link ? (l(), u("a", C({
+const dt = ["href", "target"];
+function ut(e, n, t, o, r, s) {
+  return t.link ? (l(), u("a", S({
     key: 0,
     role: "button",
     href: t.link,
     target: t.openLinkInNewTab ? "_blank" : void 0
-  }, t.attributes), W(t.text), 17, at)) : (l(), u("button", C({
+  }, t.attributes), W(t.text), 17, dt)) : (l(), u("button", S({
     key: 1,
-    class: "button-1yj9n7yt24z"
+    class: "button-7jvpanrlkn"
   }, t.attributes), W(t.text), 17));
 }
-const lt = /* @__PURE__ */ g(it, [["render", ct], ["__scopeId", "data-v-d1c063d9"]]), dt = {
+const mt = /* @__PURE__ */ g(lt, [["render", ut], ["__scopeId", "data-v-2f0d6ac2"]]), pt = {
   name: "builder-section-component",
   props: ["attributes", "maxWidth"]
 };
-function ut(e, n, t, o, r, s) {
-  return l(), u("section", C({
+function ht(e, n, t, o, r, s) {
+  return l(), u("section", S({
     style: {
       width: "100%",
       alignSelf: "stretch",
@@ -832,19 +852,19 @@ function ut(e, n, t, o, r, s) {
       marginRight: "auto"
     }
   }, t.attributes), [
-    R(e.$slots, "default")
+    E(e.$slots, "default")
   ], 16);
 }
-const mt = /* @__PURE__ */ g(dt, [["render", ut]]), pt = {
+const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
   name: "builder-fragment-component",
   props: []
 };
-function ht(e, n, t, o, r, s) {
+function bt(e, n, t, o, r, s) {
   return l(), u("span", null, [
-    R(e.$slots, "default")
+    E(e.$slots, "default")
   ]);
 }
-const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
+const yt = /* @__PURE__ */ g(gt, [["render", bt]]), vt = {
   name: "Core:Button",
   builtIn: !0,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
@@ -881,10 +901,10 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
   ],
   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)`;
-}, bt = {
+}, xt = {
   name: "Columns",
   builtIn: !0,
   inputs: [
@@ -1072,7 +1092,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
           ]
         }
       ],
-      onChange: F((e) => {
+      onChange: B((e) => {
         function n() {
           t.forEach((o) => {
             o.delete("width");
@@ -1109,14 +1129,14 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       advanced: !0
     }
   ]
-}, yt = {
+}, kt = {
   name: "Fragment",
   static: !0,
   hidden: !0,
   builtIn: !0,
   canHaveChildren: !0,
   noWrap: !0
-}, vt = {
+}, Ct = {
   name: "Image",
   static: !0,
   builtIn: !0,
@@ -1136,33 +1156,35 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
       required: !0,
       defaultValue: "https://cdn.builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
-      onChange: F((e) => {
-        e.delete("srcset"), e.delete("noWebp");
-        function t(i, c = 6e4) {
-          return new Promise((a, d) => {
-            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), d(h.error);
-            }), m.src = i, setTimeout(() => {
-              p || d(new Error("Image load timed out"));
-            }, c);
-          });
-        }
-        function o(i) {
-          return Math.round(i * 1e3) / 1e3;
+      onChange: B(
+        (e) => {
+          e.delete("srcset"), e.delete("noWebp");
+          function t(i, c = 6e4) {
+            return new Promise((a, d) => {
+              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), d(h.error);
+              }), m.src = i, setTimeout(() => {
+                p || d(new Error("Image load timed out"));
+              }, c);
+            });
+          }
+          function o(i) {
+            return Math.round(i * 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 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));
+            });
         }
-        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 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));
-          });
-      })
+      )
     },
     {
       name: "backgroundSize",
@@ -1242,7 +1264,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       defaultValue: 0.7041
     }
   ]
-}, xt = {
+}, St = {
   name: "Core:Section",
   static: !0,
   builtIn: !0,
@@ -1287,7 +1309,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       }
     }
   ]
-}, kt = {
+}, _t = {
   name: "Symbol",
   noWrap: !0,
   static: !0,
@@ -1326,7 +1348,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       type: "boolean"
     }
   ]
-}, Ct = {
+}, wt = {
   name: "Text",
   static: !0,
   builtIn: !0,
@@ -1346,7 +1368,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
     height: "auto",
     textAlign: "center"
   }
-}, St = {
+}, It = {
   name: "Video",
   canHaveChildren: !0,
   builtIn: !0,
@@ -1448,7 +1470,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       advanced: !0
     }
   ]
-}, _t = {
+}, Tt = {
   name: "Embed",
   static: !0,
   builtIn: !0,
@@ -1459,21 +1481,23 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       required: !0,
       defaultValue: "",
       helperText: "e.g. enter a youtube url, google map, etc",
-      onChange: F((e) => {
-        const n = e.get("url");
-        if (n)
-          return e.set("content", "Loading..."), fetch(
-            `https://iframe.ly/api/iframely?url=${n}&api_key=ae0e60e78201a3f2b0de4b`
-          ).then((o) => o.json()).then((o) => {
-            e.get("url") === n && (o.html ? e.set("content", o.html) : e.set("content", "Invalid url, please try another"));
-          }).catch((o) => {
-            e.set(
-              "content",
-              "There was an error embedding this URL, please try again or another URL"
-            );
-          });
-        e.delete("content");
-      })
+      onChange: B(
+        (e) => {
+          const n = e.get("url");
+          if (n)
+            return e.set("content", "Loading..."), fetch(
+              `https://iframe.ly/api/iframely?url=${n}&api_key=ae0e60e78201a3f2b0de4b`
+            ).then((o) => o.json()).then((o) => {
+              e.get("url") === n && (o.html ? e.set("content", o.html) : e.set("content", "Invalid url, please try another"));
+            }).catch((o) => {
+              e.set(
+                "content",
+                "There was an error embedding this URL, please try again or another URL"
+              );
+            });
+          e.delete("content");
+        }
+      )
     },
     {
       name: "content",
@@ -1482,17 +1506,22 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       hideFromUI: !0
     }
   ]
-}, wt = [
+}, Rt = [
   "text/javascript",
   "application/javascript",
   "application/ecmascript"
-], It = (e) => wt.includes(e.type), Tt = {
+], Et = (e) => Rt.includes(e.type), jt = {
   name: "builder-embed",
   props: ["content"],
-  data: () => ({ scriptsInserted: [], scriptsRun: [], ranInitFn: !1 }),
+  data() {
+    return { scriptsInserted: [], scriptsRun: [], ranInitFn: !1 };
+  },
   watch: {
-    onUpdateHook0() {
-      this.$refs.elem && !this.ranInitFn && (this.ranInitFn = !0, this.findAndRunScripts());
+    onUpdateHook0: {
+      handler() {
+        this.$refs.elem && !this.ranInitFn && (this.ranInitFn = !0, this.findAndRunScripts());
+      },
+      immediate: !0
     }
   },
   computed: {
@@ -1514,7 +1543,7 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
           this.scriptsInserted.push(t.src);
           const o = document.createElement("script");
           o.async = !0, o.src = t.src, document.head.appendChild(o);
-        } else if (It(t) && !this.scriptsRun.includes(t.innerText))
+        } else if (Et(t) && !this.scriptsRun.includes(t.innerText))
           try {
             this.scriptsRun.push(t.innerText), new Function(t.innerText)();
           } catch (o) {
@@ -1523,22 +1552,22 @@ const ft = /* @__PURE__ */ g(pt, [["render", ht]]), gt = {
       }
     }
   }
-}, Rt = ["innerHTML"];
-function Et(e, n, t, o, r, s) {
+}, Bt = ["innerHTML"];
+function Ft(e, n, t, o, r, s) {
   return l(), u("div", {
     class: "builder-embed",
     ref: "elem",
     innerHTML: t.content
-  }, null, 8, Rt);
+  }, null, 8, Bt);
 }
-const jt = /* @__PURE__ */ g(Tt, [["render", Et]]);
-function Ft() {
+const Ot = /* @__PURE__ */ g(jt, [["render", Ft]]);
+function At() {
   return f() && window.self !== window.top;
 }
 function y() {
-  return Ft() && window.location.search.indexOf("builder.frameEditing=") !== -1;
+  return At() && window.location.search.indexOf("builder.frameEditing=") !== -1;
 }
-const Bt = {
+const Pt = {
   name: "builder-img-component",
   props: [
     "backgroundSize",
@@ -1548,20 +1577,22 @@ const Bt = {
     "image",
     "attributes"
   ],
-  data: () => ({ isEditing: y })
-}, At = ["alt", "src"];
+  data() {
+    return { isEditing: y };
+  }
+}, Ut = ["alt", "src"];
 function $t(e, n, t, o, r, s) {
-  return l(), u("img", C({
+  return l(), u("img", S({
     style: {
       objectFit: t.backgroundSize || "cover",
       objectPosition: t.backgroundPosition || "center"
     },
-    key: e.isEditing() && t.imgSrc || "default-key",
+    key: r.isEditing() && t.imgSrc || "default-key",
     alt: t.altText,
     src: t.imgSrc || t.image
-  }, t.attributes), null, 16, At);
+  }, t.attributes), null, 16, Ut);
 }
-const Ot = /* @__PURE__ */ g(Bt, [["render", $t]]), Pt = {
+const Vt = /* @__PURE__ */ g(Pt, [["render", $t]]), Lt = {
   name: "Raw:Img",
   hideFromInsertMenu: !0,
   builtIn: !0,
@@ -1577,10 +1608,12 @@ const Ot = /* @__PURE__ */ g(Bt, [["render", $t]]), Pt = {
   ],
   noWrap: !0,
   static: !0
-}, Ut = {
+}, Wt = {
   name: "builder-custom-code",
   props: ["replaceNodes", "code"],
-  data: () => ({ scriptsInserted: [], scriptsRun: [] }),
+  data() {
+    return { scriptsInserted: [], scriptsRun: [] };
+  },
   mounted() {
     this.findAndRunScripts();
   },
@@ -1622,19 +1655,19 @@ const Ot = /* @__PURE__ */ g(Bt, [["render", $t]]), Pt = {
       return n;
     }
   }
-}, Vt = ["innerHTML"];
-function Wt(e, n, t, o, r, s) {
+}, Mt = ["innerHTML"];
+function Nt(e, n, t, o, r, s) {
   return l(), u("div", {
     ref: "elem",
-    class: E(
+    class: j(
       s._classStringToObject(
         "builder-custom-code" + (t.replaceNodes ? " replace-nodes" : "")
       )
     ),
     innerHTML: t.code
-  }, null, 10, Vt);
+  }, null, 10, Mt);
 }
-const Lt = /* @__PURE__ */ g(Ut, [["render", Wt]]), Nt = {
+const zt = /* @__PURE__ */ g(Wt, [["render", Nt]]), Kt = {
   name: "Custom Code",
   static: !0,
   builtIn: !0,
@@ -1661,20 +1694,20 @@ const Lt = /* @__PURE__ */ g(Ut, [["render", Wt]]), Nt = {
       advanced: !0
     }
   ]
-}, Mt = () => [
-  { component: ye, ...bt },
-  { component: Te, ...vt },
-  { component: Ot, ...Pt },
-  { component: Fe, ...Ct },
-  { component: Oe, ...St },
-  { component: rt, ...kt },
-  { component: lt, ...gt },
-  { component: mt, ...xt },
-  { component: ft, ...yt },
-  { component: jt, ..._t },
-  { component: Lt, ...Nt }
+}, Ht = () => [
+  { component: ke, ...xt },
+  { component: Ee, ...Ct },
+  { component: Vt, ...Lt },
+  { component: Oe, ...wt },
+  { component: $e, ...It },
+  { component: ct, ..._t },
+  { component: mt, ...vt },
+  { component: ft, ...St },
+  { component: yt, ...kt },
+  { component: Ot, ...Tt },
+  { component: zt, ...Kt }
 ];
-function K({
+function D({
   code: e,
   context: n,
   state: t,
@@ -1711,22 +1744,22 @@ function K({
     );
   }
 }
-function zt() {
+function Dt() {
   return !f() || y() ? !1 : Boolean(location.search.indexOf("builder.preview=") !== -1);
 }
-const te = [];
-function kn(e, n) {
-  return te.push({ component: e, ...n }), console.warn(
+const se = [];
+function jn(e, n) {
+  return se.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 Ht = ({
+const qt = ({
   component: e,
   ...n
 }) => ({
   type: "builder.registerComponent",
-  data: Dt(n)
-}), Kt = (e) => typeof e == "function" ? F(e) : U(e), Dt = ({
+  data: Jt(n)
+}), Gt = (e) => typeof e == "function" ? B(e) : U(e), Jt = ({
   inputs: e,
   ...n
 }) => ({
@@ -1735,89 +1768,124 @@ const Ht = ({
     (t) => Object.entries(t).reduce(
       (o, [r, s]) => ({
         ...o,
-        [r]: Kt(s)
+        [r]: Gt(s)
       }),
       {}
     )
   )
 });
-function qt() {
+function Xt() {
   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 ne() {
-  return qt().replace(/-/g, "");
+function re() {
+  return Xt().replace(/-/g, "");
 }
-const oe = "builderSessionId", Gt = async ({ canTrack: e }) => {
+const ie = "builderSessionId", Yt = async ({
+  canTrack: e
+}) => {
   if (!e)
     return;
-  const n = await X({
-    name: oe,
+  const n = await Z({
+    name: ie,
     canTrack: e
   });
-  if (I(n))
+  if (C(n))
     return n;
   {
-    const t = Jt();
-    Xt({ id: t, canTrack: e });
+    const t = Qt();
+    return Zt({ id: t, canTrack: e }), t;
   }
-}, Jt = () => ne(), Xt = ({
+}, Qt = () => re(), Zt = ({
   id: e,
   canTrack: n
-}) => Y({ name: oe, value: e, canTrack: n }), se = () => f() && typeof localStorage < "u" ? localStorage : void 0, Yt = ({
+}) => ee({ name: ie, value: e, canTrack: n }), ae = () => f() && typeof localStorage < "u" ? localStorage : void 0, en = ({
   key: e,
   canTrack: n
 }) => {
   var t;
   try {
-    return n ? (t = se()) == null ? void 0 : t.getItem(e) : void 0;
+    return n ? (t = ae()) == null ? void 0 : t.getItem(e) : void 0;
   } catch (o) {
     console.debug("[LocalStorage] GET error: ", o);
+    return;
   }
-}, Qt = ({
+}, tn = ({
   key: e,
   canTrack: n,
   value: t
 }) => {
   var o;
   try {
-    n && ((o = se()) == null || o.setItem(e, t));
+    n && ((o = ae()) == null || o.setItem(e, t));
   } catch (r) {
     console.debug("[LocalStorage] SET error: ", r);
   }
-}, re = "builderVisitorId", Zt = ({ canTrack: e }) => {
+}, ce = "builderVisitorId", nn = ({ canTrack: e }) => {
   if (!e)
     return;
-  const n = Yt({
-    key: re,
+  const n = en({
+    key: ce,
     canTrack: e
   });
-  if (I(n))
+  if (C(n))
     return n;
   {
-    const t = en();
-    tn({ id: t, canTrack: e });
+    const t = on();
+    return sn({ id: t, canTrack: e }), t;
   }
-}, en = () => ne(), tn = ({
+}, on = () => re(), sn = ({
   id: e,
   canTrack: n
-}) => Qt({
-  key: re,
+}) => tn({
+  key: ce,
   value: e,
   canTrack: n
-}), nn = async ({
+}), rn = () => {
+  if (f()) {
+    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;
+}, an = () => typeof navigator == "object" && navigator.userAgent || "", cn = () => {
+  const e = an(), n = {
+    Android() {
+      return e.match(/Android/i);
+    },
+    BlackBerry() {
+      return e.match(/BlackBerry/i);
+    },
+    iOS() {
+      return e.match(/iPhone|iPod/i);
+    },
+    Opera() {
+      return e.match(/Opera Mini/i);
+    },
+    Windows() {
+      return e.match(/IEMobile/i) || e.match(/WPDesktop/i);
+    },
+    any() {
+      return n.Android() || n.BlackBerry() || n.iOS() || n.Opera() || n.Windows() || T === "reactNative";
+    }
+  }, t = e.match(/Tablet|iPad/i), o = rn();
+  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"
+  };
+}, ln = async ({
   canTrack: e
 }) => {
   if (!e)
     return { visitorId: void 0, sessionId: void 0 };
-  const n = await Gt({ canTrack: e }), t = Zt({ canTrack: e });
+  const n = await Yt({ canTrack: e }), t = nn({ canTrack: e });
   return {
     sessionId: n,
     visitorId: t
   };
-}, on = async ({
+}, dn = async ({
   type: e,
   canTrack: n,
   apiKey: t,
@@ -1827,8 +1895,12 @@ const oe = "builderSessionId", Gt = async ({ canTrack: e }) => {
   type: e,
   data: {
     ...r,
-    metadata: JSON.stringify(o),
-    ...await nn({ canTrack: n }),
+    metadata: {
+      url: location.href,
+      ...o
+    },
+    ...await ln({ canTrack: n }),
+    userAttributes: cn(),
     ownerId: t
   }
 });
@@ -1839,11 +1911,11 @@ async function P(e) {
     );
     return;
   }
-  if (!!e.canTrack && !y() && !!(f() || j === "reactNative"))
+  if (!!e.canTrack && !y() && !!(f() || T === "reactNative"))
     return fetch("https://builder.io/api/v1/track", {
       method: "POST",
       body: JSON.stringify({
-        events: [await on(e)]
+        events: [await dn(e)]
       }),
       headers: {
         "content-type": "application/json"
@@ -1853,21 +1925,58 @@ async function P(e) {
       console.error("Failed to track: ", n);
     });
 }
-const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then(() => ie).then((e) => e.default).catch((e) => {
+const Bn = (e) => P({ ...e, canTrack: !0 });
+function q(e) {
+  return Math.round(e * 1e3) / 1e3;
+}
+const un = (e, n, t = !0) => {
+  if (!(e instanceof HTMLElement))
+    return null;
+  let o = t ? e : e.parentElement;
+  do {
+    if (!o)
+      return null;
+    if (n(o))
+      return o;
+  } while (o = o.parentElement);
+  return null;
+}, mn = (e) => un(e, (n) => {
+  const t = n.getAttribute("builder-id") || n.id;
+  return Boolean((t == null ? void 0 : t.indexOf("builder-")) === 0);
+}), G = ({
+  event: e,
+  target: n
+}) => {
+  const t = n.getBoundingClientRect(), o = e.clientX - t.left, r = e.clientY - t.top, s = q(o / t.width), i = q(r / t.height);
+  return {
+    x: s,
+    y: i
+  };
+}, pn = (e) => {
+  const n = e.target, t = n && mn(n), o = (t == null ? void 0 : t.getAttribute("builder-id")) || (t == null ? void 0 : t.id);
+  return {
+    targetBuilderElement: o || void 0,
+    metadata: {
+      targetOffset: n ? G({ event: e, target: n }) : void 0,
+      builderTargetOffset: t ? G({ event: e, target: t }) : void 0,
+      builderElementIndex: t && o ? [].slice.call(document.getElementsByClassName(o)).indexOf(t) : void 0
+    }
+  };
+}, hn = () => Promise.resolve().then(() => le).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RenderBlocks at ../render-blocks.vue",
     e
   ), e;
-}), rn = () => import("./render-styles.e9da8e6c.js").then((e) => e.default).catch((e) => {
+}), fn = () => import("./render-styles.c739f8f5.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;
-}), an = {
+}), gn = {
   name: "render-content",
   components: {
-    RenderContentStyles: x(rn),
-    RenderBlocks: x(sn)
+    RenderContentStyles: x(fn),
+    RenderBlocks: x(hn)
   },
   props: [
     "content",
@@ -1880,32 +1989,39 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
     "apiKey",
     "includeRefs"
   ],
-  data: () => ({
-    forceReRenderCount: 0,
-    overrideContent: null,
-    update: 0,
-    useBreakpoints: null,
-    overrideState: {}
-  }),
+  data() {
+    return {
+      forceReRenderCount: 0,
+      overrideContent: null,
+      update: 0,
+      useBreakpoints: null,
+      canTrackToUse: C(this.canTrack) ? this.canTrack : !0,
+      overrideState: {},
+      contextContext: this.context || {},
+      allRegisteredComponents: [
+        ...Ht(),
+        ...se,
+        ...this.customComponents || []
+      ].reduce(
+        (e, n) => ({
+          ...e,
+          [n.name]: n
+        }),
+        {}
+      ),
+      httpReqsData: {},
+      clicked: !1
+    };
+  },
   provide() {
     const e = this;
     return {
-      BuilderContext: {
-        get content() {
-          return e.useContent;
-        },
-        get state() {
-          return e.contentState;
-        },
-        get context() {
-          return e.contextContext;
-        },
-        get apiKey() {
-          return e.apiKey;
-        },
-        get registeredComponents() {
-          return e.allRegisteredComponents;
-        }
+      [$.key]: {
+        content: e.useContent,
+        state: e.contentState,
+        context: e.contextContext,
+        apiKey: e.apiKey,
+        registeredComponents: e.allRegisteredComponents
       }
     };
   },
@@ -1914,7 +2030,7 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
     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, le(), de({
+      if (y() && (this.forceReRenderCount = this.forceReRenderCount + 1, me(), pe({
         ...this.locale ? {
           locale: this.locale
         } : {},
@@ -1924,7 +2040,7 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
       }), Object.values(this.allRegisteredComponents).forEach(
         (t) => {
           var r;
-          const o = Ht(t);
+          const o = qt(t);
           (r = window.parent) == null || r.postMessage(o, "*");
         }
       ), window.addEventListener("message", this.processMessage), window.addEventListener(
@@ -1940,30 +2056,36 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
           variationId: t !== o ? t : void 0
         });
       }
-      if (zt()) {
-        const t = new URL(location.href).searchParams;
-        if (this.model && t.get("builder.preview") === this.model) {
-          const o = t.get("apiKey") || t.get("builder.space");
-          o && ee({
-            model: this.model,
-            apiKey: o
-          }).then((r) => {
-            r && (this.overrideContent = r);
-          });
-        }
+      if (Dt()) {
+        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 && oe({
+          model: this.model,
+          apiKey: this.apiKey
+        }).then((s) => {
+          s && (this.overrideContent = s);
+        });
       }
       this.evaluateJsCode(), this.runHttpRequests(), this.emitStateUpdate();
     }
   },
   watch: {
-    onUpdateHook0() {
-      this.evaluateJsCode();
+    onUpdateHook0: {
+      handler() {
+        this.evaluateJsCode();
+      },
+      immediate: !0
     },
-    onUpdateHook1() {
-      this.runHttpRequests();
+    onUpdateHook1: {
+      handler() {
+        this.runHttpRequests();
+      },
+      immediate: !0
     },
-    onUpdateHook2() {
-      this.emitStateUpdate();
+    onUpdateHook2: {
+      handler() {
+        this.emitStateUpdate();
+      },
+      immediate: !0
     }
   },
   unmounted() {
@@ -1974,24 +2096,22 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
   },
   computed: {
     useContent() {
-      var n, t, o, r, s, i, c, a;
-      return !this.content && !this.overrideContent ? void 0 : {
-        ...this.content,
-        ...this.overrideContent,
-        data: {
-          ...(n = this.content) == null ? void 0 : n.data,
-          ...this.data,
-          ...(t = this.overrideContent) == null ? void 0 : t.data
-        },
-        meta: {
-          ...(o = this.content) == null ? void 0 : o.meta,
-          ...(r = this.overrideContent) == null ? void 0 : r.meta,
-          breakpoints: this.useBreakpoints || ((i = (s = this.overrideContent) == null ? void 0 : s.meta) == null ? void 0 : i.breakpoints) || ((a = (c = this.content) == null ? void 0 : c.meta) == null ? void 0 : a.breakpoints)
-        }
-      };
-    },
-    canTrackToUse() {
-      return this.canTrack || !0;
+      var e, n, t, o, r, s, i, c;
+      if (!(!this.content && !this.overrideContent))
+        return {
+          ...this.content,
+          ...this.overrideContent,
+          data: {
+            ...(e = this.content) == null ? void 0 : e.data,
+            ...this.data,
+            ...(n = this.overrideContent) == null ? void 0 : n.data
+          },
+          meta: {
+            ...(t = this.content) == null ? void 0 : t.meta,
+            ...(o = this.overrideContent) == null ? void 0 : o.meta,
+            breakpoints: this.useBreakpoints || ((s = (r = this.overrideContent) == null ? void 0 : r.meta) == null ? void 0 : s.breakpoints) || ((c = (i = this.content) == null ? void 0 : i.meta) == null ? void 0 : c.breakpoints)
+          }
+        };
     },
     contentState() {
       var e, n;
@@ -2004,29 +2124,10 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
         ...this.overrideState
       };
     },
-    contextContext() {
-      return this.context || {};
-    },
-    allRegisteredComponents() {
-      return [
-        ...Mt(),
-        ...te,
-        ...this.customComponents || []
-      ].reduce(
-        (t, o) => ({
-          ...t,
-          [o.name]: o
-        }),
-        {}
-      );
-    },
-    httpReqsData() {
-      return {};
-    },
     shouldRenderContentStyles() {
       var e, n, t, o, r;
       return Boolean(
-        (((n = (e = this.useContent) == null ? void 0 : e.data) == null ? void 0 : n.cssCode) || ((r = (o = (t = this.useContent) == null ? void 0 : t.data) == null ? void 0 : o.customFonts) == null ? void 0 : r.length)) && j !== "reactNative"
+        (((n = (e = this.useContent) == null ? void 0 : e.data) == null ? void 0 : n.cssCode) || ((r = (o = (t = this.useContent) == null ? void 0 : t.data) == null ? void 0 : o.customFonts) == null ? void 0 : r.length)) && T !== "reactNative"
       );
     },
     onUpdateHook0() {
@@ -2071,7 +2172,7 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
     evaluateJsCode() {
       var n, t;
       const e = (t = (n = this.useContent) == null ? void 0 : n.data) == null ? void 0 : t.jsCode;
-      e && K({
+      e && D({
         code: e,
         context: this.contextContext,
         state: this.contentState
@@ -2086,14 +2187,17 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
           canTrack: this.canTrackToUse,
           contentId: r,
           apiKey: this.apiKey,
-          variationId: o !== r ? o : void 0
+          variationId: o !== r ? o : void 0,
+          ...pn(e),
+          unique: !this.clicked
         });
       }
+      this.clicked || (this.clicked = !0);
     },
     evalExpression(e) {
       return e.replace(
         /{{([^}]+)}}/g,
-        (n, t) => K({
+        (n, t) => D({
           code: t,
           context: this.contextContext,
           state: this.contentState
@@ -2101,7 +2205,7 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
       );
     },
     handleRequest({ url: e, key: n }) {
-      J(e).then((t) => t.json()).then((t) => {
+      Q(e).then((t) => t.json()).then((t) => {
         const o = {
           ...this.overrideState,
           [n]: t
@@ -2137,50 +2241,50 @@ const Cn = (e) => P({ ...e, canTrack: !0 }), sn = () => Promise.resolve().then((
       );
     }
   }
-}, cn = ["builder-content-id", "builder-model"];
-function ln(e, n, t, o, r, s) {
+}, bn = ["builder-content-id", "builder-model"];
+function yn(e, n, t, o, r, s) {
   var a, d, m, p, h, v, V;
   const i = k("render-content-styles"), c = k("render-blocks");
   return s.useContent ? (l(), u("div", {
     key: 0,
     ref: "elementRef",
-    onClick: n[0] || (n[0] = (ae) => s.onClick(ae)),
+    onClick: n[0] || (n[0] = (de) => s.onClick(de)),
     "builder-content-id": (a = s.useContent) == null ? void 0 : a.id,
     "builder-model": t.model
   }, [
-    s.shouldRenderContentStyles ? (l(), w(i, {
+    s.shouldRenderContentStyles ? (l(), I(i, {
       key: 0,
       cssCode: (m = (d = s.useContent) == null ? void 0 : d.data) == null ? void 0 : m.cssCode,
       customFonts: (h = (p = s.useContent) == null ? void 0 : p.data) == null ? void 0 : h.customFonts
     }, null, 8, ["cssCode", "customFonts"])) : b("", !0),
-    (l(), w(c, {
+    (l(), I(c, {
       blocks: (V = (v = s.useContent) == null ? void 0 : v.data) == null ? void 0 : V.blocks,
-      key: e.forceReRenderCount
+      key: r.forceReRenderCount
     }, null, 8, ["blocks"]))
-  ], 8, cn)) : b("", !0);
+  ], 8, bn)) : b("", !0);
 }
-const dn = /* @__PURE__ */ g(an, [["render", ln]]), un = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const vn = /* @__PURE__ */ g(gn, [["render", yn]]), xn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: dn
-}, Symbol.toStringTag, { value: "Module" })), mn = () => import("./block-styles.fee20f95.js").then((e) => e.default).catch((e) => {
+  default: vn
+}, Symbol.toStringTag, { value: "Module" })), kn = () => import("./block-styles.b1836f48.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;
-}), pn = () => import("./render-block.9cdf5af8.js").then((e) => e.default).catch((e) => {
+}), Cn = () => import("./render-block.bd00521b.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;
-}), hn = {
+}), Sn = {
   name: "render-blocks",
   components: {
-    RenderBlock: x(pn),
-    BlockStyles: x(mn)
+    RenderBlock: x(Cn),
+    BlockStyles: x(kn)
   },
   props: ["blocks", "parent", "path", "styleProp"],
   inject: {
-    builderContext: "BuilderContext"
+    builderContext: $.key
   },
   computed: {
     className() {
@@ -2226,77 +2330,78 @@ const dn = /* @__PURE__ */ g(an, [["render", ln]]), un = /* @__PURE__ */ Object.
     }
   }
 };
-const fn = ["builder-path", "builder-parent-id", "dataSet"];
-function gn(e, n, t, o, r, s) {
+const _n = ["builder-path", "builder-parent-id", "dataSet"];
+function wn(e, n, t, o, r, s) {
   const i = k("render-block"), c = k("block-styles");
   return l(), u("div", {
-    class: E(s._classStringToObject(s.className + " div-7fq9d0i380")),
+    class: j(s._classStringToObject(s.className + " div-2oa2wtipkzk")),
     "builder-path": t.path,
     "builder-parent-id": t.parent,
     dataSet: {
       class: s.className
     },
-    style: _(t.styleProp),
+    style: w(t.styleProp),
     onClick: n[0] || (n[0] = (a) => s.onClick()),
     onMouseenter: n[1] || (n[1] = (a) => s.onMouseEnter())
   }, [
-    t.blocks ? (l(!0), u(T, { key: 0 }, $(t.blocks, (a, d) => (l(), w(i, {
+    t.blocks ? (l(!0), u(R, { key: 0 }, O(t.blocks, (a, d) => (l(), I(i, {
       key: "render-block-" + a.id,
       block: a,
       context: s.builderContext
     }, null, 8, ["block", "context"]))), 128)) : b("", !0),
-    t.blocks ? (l(!0), u(T, { key: 1 }, $(t.blocks, (a, d) => (l(), w(c, {
+    t.blocks ? (l(!0), u(R, { key: 1 }, O(t.blocks, (a, d) => (l(), I(c, {
       key: "block-style-" + a.id,
       block: a,
       context: s.builderContext
     }, null, 8, ["block", "context"]))), 128)) : b("", !0)
-  ], 46, fn);
+  ], 46, _n);
 }
-const bn = /* @__PURE__ */ g(hn, [["render", gn], ["__scopeId", "data-v-4f5f0a37"]]), ie = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const In = /* @__PURE__ */ g(Sn, [["render", wn], ["__scopeId", "data-v-0924b77d"]]), le = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: bn
-}, Symbol.toStringTag, { value: "Module" })), D = {};
-function Sn(e) {
+  default: In
+}, Symbol.toStringTag, { value: "Module" })), J = {};
+function Fn(e) {
   if (f()) {
-    Object.assign(D, e);
+    Object.assign(J, e);
     const n = {
       type: "builder.settingsChange",
-      data: D
+      data: J
     };
     parent.postMessage(n, "*");
   }
 }
 export {
-  lt as B,
-  ye as C,
-  ft as F,
-  Te as I,
-  rt as S,
-  j as T,
-  Oe as V,
+  $ as B,
+  ke as C,
+  yt as F,
+  Ee as I,
+  ct as S,
+  T,
+  $e as V,
   g as _,
-  vn as a,
-  pe as b,
-  xn as c,
-  Fe as d,
-  K as e,
+  Rn as a,
+  ge as b,
+  En as c,
+  Oe as d,
+  D as e,
   U as f,
-  ue as g,
+  he as g,
   mt as h,
-  bn as i,
-  y as j,
-  zt as k,
-  te as l,
-  kn as m,
-  Ht as n,
-  ce as o,
-  ee as p,
-  et as q,
-  dn as r,
-  Sn as s,
-  Cn as t,
-  Xe as u,
-  Ye as v,
-  Qe as w,
-  Z as x
+  ft as i,
+  In as j,
+  y as k,
+  Dt as l,
+  se as m,
+  jn as n,
+  qt as o,
+  ue as p,
+  oe as q,
+  vn as r,
+  Fn as s,
+  Bn as t,
+  ot as u,
+  Ze as v,
+  et as w,
+  tt as x,
+  ne as y
 };