@builder.io/sdk-react-nextjs 0.16.0 → 0.16.1

package/lib/browser/blocks-exports.mjs

@@ -2,14 +2,14 @@
 var Ae = Object.defineProperty;
 var Ve = (e, t, n) => t in e ? Ae(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
 var ee = (e, t, n) => (Ve(e, typeof t != "symbol" ? t + "" : t, n), n);
-import { jsx as c, Fragment as w, jsxs as E } from "react/jsx-runtime";
-import { TARGET as M, isEditing as V, isBrowser as L, getUserAttributes as $e, checkIsDefined as z, logger as J, fastClone as ie, init as Fe, getDefaultCanTrack as q, _track as ue, isPreviewing as Le, createEditorListener as Oe, fetch as De, registerInsertMenu as je, setupBrowserForEditing as He, createRegisterComponentMessage as Me, fetchOneEntry as ke, serializeComponentInfo as me, handleABTestingSync as Ue } from "./server-entry-86458005.js";
+import { jsx as l, Fragment as w, jsxs as E } from "react/jsx-runtime";
+import { TARGET as M, isEditing as V, isBrowser as L, getUserAttributes as $e, checkIsDefined as z, logger as J, fastClone as ie, init as Fe, getDefaultCanTrack as q, _track as ue, isPreviewing as Le, createEditorListener as Oe, fetch as De, registerInsertMenu as je, setupBrowserForEditing as He, createRegisterComponentMessage as Me, fetchOneEntry as ke, serializeComponentInfo as me, handleABTestingSync as Ue } from "./server-entry-8a4d2728.js";
 import { useRef as oe, useState as N, useEffect as R, createContext as _e } from "react";
 import { useRouter as Ke } from "next/navigation";
 import "lru-cache";
 const ze = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]), qe = (e) => typeof e == "string" && ze.has(e.toLowerCase());
 function ae(e) {
-  return /* @__PURE__ */ c(w, { children: qe(e.TagName) ? /* @__PURE__ */ c(w, { children: /* @__PURE__ */ c(e.TagName, { ...e.attributes, ...e.actionAttributes }) }) : /* @__PURE__ */ c(w, { children: typeof e.TagName == "string" ? /* @__PURE__ */ c(e.TagName, { ...e.attributes, ...e.actionAttributes, children: e.children }) : /* @__PURE__ */ c(e.TagName, { ...e.attributes, ...e.actionAttributes, children: e.children }) }) });
+  return /* @__PURE__ */ l(w, { children: qe(e.TagName) ? /* @__PURE__ */ l(w, { children: /* @__PURE__ */ l(e.TagName, { ...e.attributes, ...e.actionAttributes }) }) : /* @__PURE__ */ l(w, { children: typeof e.TagName == "string" ? /* @__PURE__ */ l(e.TagName, { ...e.attributes, ...e.actionAttributes, children: e.children }) : /* @__PURE__ */ l(e.TagName, { ...e.attributes, ...e.actionAttributes, children: e.children }) }) });
 }
 const j = () => {
   switch (M) {
@@ -39,7 +39,7 @@ function Ye(e) {
       }
     };
   }
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     ae,
     {
       attributes: t(),
@@ -84,7 +84,7 @@ const Qe = ({
   rootSetState: a,
   rootState: r
 }) => {
-  const l = Qe({
+  const c = Qe({
     builder: t,
     context: n,
     event: i,
@@ -94,7 +94,7 @@ const Qe = ({
       rootSetState: a
     })
   });
-  return new Function(...l.map(([s]) => s), e)(...l.map(([, s]) => s));
+  return new Function(...c.map(([s]) => s), e)(...c.map(([, s]) => s));
 };
 function Ce({
   rootState: e,
@@ -159,7 +159,7 @@ function H({
   rootSetState: o,
   event: a,
   isExpression: r = !0,
-  enableCache: l
+  enableCache: c
 }) {
   if (e === "")
     return;
@@ -174,14 +174,14 @@ function H({
     rootState: i,
     localState: n
   };
-  if (l) {
+  if (c) {
     const d = F.getCacheKey(s), m = F.getCachedValue(d);
     if (m)
       return m.value;
   }
   try {
     const d = tt(s);
-    if (l) {
+    if (c) {
       const m = F.getCacheKey(s);
       F.setCachedValue(m, d);
     }
@@ -217,8 +217,8 @@ const it = ({
       ...a.actions
     }
   };
-  for (const l in e.bindings) {
-    const s = e.bindings[l], d = H({
+  for (const c in e.bindings) {
+    const s = e.bindings[c], d = H({
       code: s,
       localState: n,
       rootState: i,
@@ -226,7 +226,7 @@ const it = ({
       context: t,
       enableCache: !0
     });
-    nt(r, l, d);
+    nt(r, c, d);
   }
   return r;
 };
@@ -290,7 +290,7 @@ function Ie(e) {
       return e;
   }
 }
-const lt = ({
+const ct = ({
   block: e,
   context: t,
   registeredComponents: n
@@ -312,7 +312,7 @@ const lt = ({
   console.warn(`
       Could not find a registered component named "${i}". 
       If you registered it, is the file that registered it imported by the file that needs to render it?`);
-}, ct = ({
+}, lt = ({
   block: e,
   context: t
 }) => {
@@ -410,11 +410,12 @@ const lt = ({
   }, n;
 };
 function Q(e) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     "style",
     {
       dangerouslySetInnerHTML: { __html: e.styles },
-      "data-id": e.id
+      "data-id": e.id,
+      nonce: e.nonce
     }
   );
 }
@@ -438,7 +439,7 @@ function ft(e) {
       rootSetState: e.context.rootSetState,
       context: e.context.context,
       shouldEvaluateBindings: !0
-    }), a = o.responsiveStyles, r = e.context.content, l = Re(
+    }), a = o.responsiveStyles, r = e.context.content, c = Re(
       ((S = r == null ? void 0 : r.meta) == null ? void 0 : S.breakpoints) || {}
     ), s = a == null ? void 0 : a.large, d = a == null ? void 0 : a.medium, m = a == null ? void 0 : a.small, u = o.id;
     if (!u)
@@ -446,19 +447,19 @@ function ft(e) {
     const h = s ? _({
       className: u,
       styles: s
-    }) : "", x = d ? _({
+    }) : "", p = d ? _({
       className: u,
       styles: d,
       mediaQuery: he(
         "medium",
-        l
+        c
       )
     }) : "", I = m ? _({
       className: u,
       styles: m,
       mediaQuery: he(
         "small",
-        l
+        c
       )
     }) : "", y = o.animations && o.animations.find((T) => T.trigger === "hover");
     let A = "";
@@ -477,12 +478,19 @@ function ft(e) {
     }
     return [
       h,
-      x,
+      p,
       I,
       A
     ].join(" ");
   };
-  return /* @__PURE__ */ c(w, { children: n() && t() ? /* @__PURE__ */ c(w, { children: /* @__PURE__ */ c(Q, { id: "builderio-block", styles: n() }) }) : null });
+  return /* @__PURE__ */ l(w, { children: n() && t() ? /* @__PURE__ */ l(w, { children: /* @__PURE__ */ l(
+    Q,
+    {
+      id: "builderio-block",
+      styles: n(),
+      nonce: e.context.nonce
+    }
+  ) }) : null });
 }
 function ht(e) {
   return e.charAt(0).toUpperCase() + e.slice(1);
@@ -523,16 +531,16 @@ function yt({
 }) {
   return e;
 }
-const pt = (e) => ({
+const vt = (e) => ({
   href: e.href
 });
-function le({
+function ce({
   block: e,
   context: t
 }) {
   var i;
   const n = {
-    ...pt(e),
+    ...vt(e),
     ...e.properties,
     "builder-id": e.id,
     style: rt({
@@ -547,12 +555,12 @@ function le({
     block: e
   });
 }
-function vt(e) {
-  return /* @__PURE__ */ c(
+function xt(e) {
+  return /* @__PURE__ */ l(
     ae,
     {
       TagName: e.Wrapper,
-      attributes: le({
+      attributes: ce({
         block: e.block,
         context: e.context
       }),
@@ -571,7 +579,7 @@ function vt(e) {
 function St(e) {
   function t() {
     return e.includeBlockProps ? {
-      ...le({
+      ...ce({
         block: e.block,
         context: e.context
       }),
@@ -584,9 +592,9 @@ function St(e) {
       })
     } : {};
   }
-  return /* @__PURE__ */ c(e.Wrapper, { ...e.wrapperProps, attributes: t(), children: e.children });
+  return /* @__PURE__ */ l(e.Wrapper, { ...e.wrapperProps, attributes: t(), children: e.children });
 }
-const xt = ({
+const pt = ({
   componentOptions: e,
   builderBlock: t,
   context: n,
@@ -595,14 +603,14 @@ const xt = ({
   isInteractive: a,
   contextValue: r
 }) => {
-  const l = {
+  const c = {
     ...e,
     /**
      * If `noWrap` is set to `true`, then the block's props/attributes are provided to the
      * component itself directly. Otherwise, they are provided to the wrapper element.
      */
     ...o ? {
-      attributes: le({
+      attributes: ce({
         block: t,
         context: r
       })
@@ -614,15 +622,15 @@ const xt = ({
     context: n,
     wrapperProps: e,
     includeBlockProps: o
-  } : l;
+  } : c;
 };
 function ge(e) {
   var n;
   const t = e.isInteractive ? St : e.componentRef;
-  return /* @__PURE__ */ c(w, { children: e.componentRef ? /* @__PURE__ */ c(w, { children: /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(w, { children: e.componentRef ? /* @__PURE__ */ l(w, { children: /* @__PURE__ */ l(
     t,
     {
-      ...xt({
+      ...pt({
         componentOptions: e.componentOptions,
         builderBlock: e.builderBlock,
         context: e.context,
@@ -632,7 +640,7 @@ function ge(e) {
         isInteractive: e.isInteractive,
         contextValue: e.context
       }),
-      children: (n = e.blockChildren) == null ? void 0 : n.map((i) => /* @__PURE__ */ c(
+      children: (n = e.blockChildren) == null ? void 0 : n.map((i) => /* @__PURE__ */ l(
         G,
         {
           block: i,
@@ -647,7 +655,7 @@ function ge(e) {
 }
 function kt(e) {
   const t = e.repeatContext;
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     G,
     {
       block: e.block,
@@ -660,13 +668,13 @@ function kt(e) {
 function G(e) {
   var s, d, m;
   const t = function() {
-    return lt({
+    return ct({
       block: e.block,
       context: e.context,
       registeredComponents: e.registeredComponents
     });
   }, n = function() {
-    return ct({
+    return lt({
       block: e.block,
       context: e.context
     });
@@ -681,8 +689,8 @@ function G(e) {
       shouldEvaluateBindings: !0
     });
   }, o = function() {
-    var x;
-    return e.block.tagName === "a" || ((x = i().properties) == null ? void 0 : x.href) || i().href ? e.linkComponent || "a" : e.block.tagName || "div";
+    var p;
+    return e.block.tagName === "a" || ((p = i().properties) == null ? void 0 : p.href) || i().href ? e.linkComponent || "a" : e.block.tagName || "div";
   }, a = function() {
     var I, y;
     if ((I = e.block.repeat) != null && I.collection)
@@ -690,13 +698,13 @@ function G(e) {
     const h = "hide" in i() ? i().hide : !1;
     return ("show" in i() ? i().show : !0) && !h;
   }, r = function() {
-    var x, I;
-    return !((x = t()) != null && x.component) && !n() ? (I = i().children) != null ? I : [] : [];
-  }, l = function() {
-    var h, x, I, y;
+    var p, I;
+    return !((p = t()) != null && p.component) && !n() ? (I = i().children) != null ? I : [] : [];
+  }, c = function() {
+    var h, p, I, y;
     return {
       blockChildren: (h = i().children) != null ? h : [],
-      componentRef: (x = t()) == null ? void 0 : x.component,
+      componentRef: (p = t()) == null ? void 0 : p.component,
       componentOptions: {
         ...Je(i()),
         ...ut(t(), i()),
@@ -715,22 +723,22 @@ function G(e) {
       isInteractive: !((y = t()) != null && y.isRSC)
     };
   };
-  return /* @__PURE__ */ c(w, { children: a() ? /* @__PURE__ */ E(w, { children: [
-    /* @__PURE__ */ c(ft, { block: e.block, context: e.context }),
-    (s = t()) != null && s.noWrap ? /* @__PURE__ */ c(w, { children: /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(w, { children: a() ? /* @__PURE__ */ E(w, { children: [
+    /* @__PURE__ */ l(ft, { block: e.block, context: e.context }),
+    (s = t()) != null && s.noWrap ? /* @__PURE__ */ l(w, { children: /* @__PURE__ */ l(
       ge,
       {
-        componentRef: l().componentRef,
-        componentOptions: l().componentOptions,
-        blockChildren: l().blockChildren,
-        context: l().context,
-        registeredComponents: l().registeredComponents,
-        linkComponent: l().linkComponent,
-        builderBlock: l().builderBlock,
-        includeBlockProps: l().includeBlockProps,
-        isInteractive: l().isInteractive
+        componentRef: c().componentRef,
+        componentOptions: c().componentOptions,
+        blockChildren: c().blockChildren,
+        context: c().context,
+        registeredComponents: c().registeredComponents,
+        linkComponent: c().linkComponent,
+        builderBlock: c().builderBlock,
+        includeBlockProps: c().includeBlockProps,
+        isInteractive: c().isInteractive
       }
-    ) }) : /* @__PURE__ */ c(w, { children: n() ? /* @__PURE__ */ c(w, { children: (m = n()) == null ? void 0 : m.map((u, h) => /* @__PURE__ */ c(
+    ) }) : /* @__PURE__ */ l(w, { children: n() ? /* @__PURE__ */ l(w, { children: (m = n()) == null ? void 0 : m.map((u, h) => /* @__PURE__ */ l(
       kt,
       {
         repeatContext: u.context,
@@ -740,27 +748,27 @@ function G(e) {
       },
       h
     )) }) : /* @__PURE__ */ E(
-      vt,
+      xt,
       {
         Wrapper: o(),
         block: i(),
         context: e.context,
         children: [
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ l(
             ge,
             {
-              componentRef: l().componentRef,
-              componentOptions: l().componentOptions,
-              blockChildren: l().blockChildren,
-              context: l().context,
-              registeredComponents: l().registeredComponents,
-              linkComponent: l().linkComponent,
-              builderBlock: l().builderBlock,
-              includeBlockProps: l().includeBlockProps,
-              isInteractive: l().isInteractive
+              componentRef: c().componentRef,
+              componentOptions: c().componentOptions,
+              blockChildren: c().blockChildren,
+              context: c().context,
+              registeredComponents: c().registeredComponents,
+              linkComponent: c().linkComponent,
+              builderBlock: c().builderBlock,
+              includeBlockProps: c().includeBlockProps,
+              isInteractive: c().isInteractive
             }
           ),
-          (d = r()) == null ? void 0 : d.map((u) => /* @__PURE__ */ c(
+          (d = r()) == null ? void 0 : d.map((u) => /* @__PURE__ */ l(
             G,
             {
               block: u,
@@ -807,7 +815,7 @@ function Ct(e) {
     ));
   }
   return /* @__PURE__ */ E(w, { children: [
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ l(
       e.BlocksWrapper,
       {
         className: t() + " props-blocks-wrapper-7cd1560e",
@@ -821,16 +829,16 @@ function Ct(e) {
         children: e.children
       }
     ),
-    /* @__PURE__ */ c("style", { children: `.props-blocks-wrapper-7cd1560e {
+    /* @__PURE__ */ l("style", { children: `.props-blocks-wrapper-7cd1560e {
   display: flex;
   flex-direction: column;
   align-items: stretch;
 }` })
   ] });
 }
-function ce(e) {
+function le(e) {
   var t, n, i;
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     Ct,
     {
       blocks: e.blocks,
@@ -839,7 +847,7 @@ function ce(e) {
       styleProp: e.styleProp,
       BlocksWrapper: (t = e.context) == null ? void 0 : t.BlocksWrapper,
       BlocksWrapperProps: (n = e.context) == null ? void 0 : n.BlocksWrapperProps,
-      children: e.blocks ? /* @__PURE__ */ c(w, { children: (i = e.blocks) == null ? void 0 : i.map((o) => /* @__PURE__ */ c(
+      children: e.blocks ? /* @__PURE__ */ l(w, { children: (i = e.blocks) == null ? void 0 : i.map((o) => /* @__PURE__ */ l(
         G,
         {
           block: o,
@@ -863,7 +871,7 @@ function It(e) {
   }, r = function(b) {
     const k = a(b), T = t * (n.length - 1) * (k / 100);
     return `calc(${k}% - ${T}px)`;
-  }, l = function({
+  }, c = function({
     stackedStyle: b,
     desktopStyle: k
   }) {
@@ -876,7 +884,7 @@ function It(e) {
   }, d = e.stackColumnsAt === "never" ? "row" : e.reverseColumnsWhenStacked ? "column-reverse" : "column", m = function() {
     return {
       "--flex-dir": d,
-      "--flex-dir-tablet": l({
+      "--flex-dir-tablet": c({
         stackedStyle: d,
         desktopStyle: "row"
       })
@@ -899,11 +907,11 @@ function It(e) {
         stackedStyle: D,
         desktopStyle: B
       }),
-      "--column-width-tablet": l({
+      "--column-width-tablet": c({
         stackedStyle: O,
         desktopStyle: T
       }),
-      "--column-margin-left-tablet": l({
+      "--column-margin-left-tablet": c({
         stackedStyle: D,
         desktopStyle: B
       })
@@ -913,7 +921,7 @@ function It(e) {
     return Re(
       ((B = (T = e.builderContext.content) == null ? void 0 : T.meta) == null ? void 0 : B.breakpoints) || {}
     )[b].max;
-  }, x = function() {
+  }, p = function() {
     return `
         @media (max-width: ${h("medium")}px) {
           .${e.builderBlock.id}-breakpoints {
@@ -952,18 +960,25 @@ function It(e) {
     /* @__PURE__ */ E(
       "div",
       {
-        className: wt((y = e.builderBlock) == null ? void 0 : y.id) + " div-1de99da7",
+        className: wt((y = e.builderBlock) == null ? void 0 : y.id) + " div-c89348d2",
         style: m(),
         children: [
-          /* @__PURE__ */ c(Q, { id: "builderio-columns", styles: x() }),
-          (A = e.columns) == null ? void 0 : A.map((S, b) => /* @__PURE__ */ c(
+          /* @__PURE__ */ l(
+            Q,
+            {
+              id: "builderio-columns",
+              styles: p(),
+              nonce: e.builderContext.nonce
+            }
+          ),
+          (A = e.columns) == null ? void 0 : A.map((S, b) => /* @__PURE__ */ l(
             ae,
             {
               TagName: o(S),
               actionAttributes: {},
               attributes: I(S, b),
-              children: /* @__PURE__ */ c(
-                ce,
+              children: /* @__PURE__ */ l(
+                le,
                 {
                   path: `component.options.columns.${b}.blocks`,
                   parent: e.builderBlock.id,
@@ -982,14 +997,14 @@ function It(e) {
         ]
       }
     ),
-    /* @__PURE__ */ c("style", { children: `.div-1de99da7 {
+    /* @__PURE__ */ l("style", { children: `.div-c89348d2 {
   display: flex;
   line-height: normal;
 }` })
   ] });
 }
 function Tt(e) {
-  return /* @__PURE__ */ c("span", { children: e.children });
+  return /* @__PURE__ */ l("span", { children: e.children });
 }
 function be(e) {
   return e.replace(/http(s)?:/, "");
@@ -1022,7 +1037,7 @@ function te(e) {
   return e.match(/cdn\.shopify\.com/) ? t.map((n) => [Et(e, `${n}x${n}`), n]).filter(([n]) => !!n).map(([n, i]) => `${n} ${i}w`).concat([e]).join(", ") : e;
 }
 function Pt(e) {
-  var o, a, r, l, s, d;
+  var o, a, r, c, s, d;
   function t() {
     var h;
     const u = e.image || e.src;
@@ -1054,8 +1069,8 @@ function Pt(e) {
   return /* @__PURE__ */ E(w, { children: [
     /* @__PURE__ */ E(w, { children: [
       /* @__PURE__ */ E("picture", { children: [
-        n() ? /* @__PURE__ */ c("source", { type: "image/webp", srcSet: n() }) : null,
-        /* @__PURE__ */ c(
+        n() ? /* @__PURE__ */ l("source", { type: "image/webp", srcSet: n() }) : null,
+        /* @__PURE__ */ l(
           "img",
           {
             loading: e.highPriority ? "eager" : "lazy",
@@ -1074,7 +1089,7 @@ function Pt(e) {
           }
         )
       ] }),
-      e.aspectRatio && !((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length && e.fitContent) ? /* @__PURE__ */ c(
+      e.aspectRatio && !((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length && e.fitContent) ? /* @__PURE__ */ l(
         "div",
         {
           className: "builder-image-sizer div-ac3dff4a",
@@ -1083,10 +1098,10 @@ function Pt(e) {
           }
         }
       ) : null,
-      (l = (r = e.builderBlock) == null ? void 0 : r.children) != null && l.length && e.fitContent ? /* @__PURE__ */ c(w, { children: e.children }) : null,
-      !e.fitContent && ((d = (s = e.builderBlock) == null ? void 0 : s.children) != null && d.length) ? /* @__PURE__ */ c("div", { className: "div-ac3dff4a-2", children: e.children }) : null
+      (c = (r = e.builderBlock) == null ? void 0 : r.children) != null && c.length && e.fitContent ? /* @__PURE__ */ l(w, { children: e.children }) : null,
+      !e.fitContent && ((d = (s = e.builderBlock) == null ? void 0 : s.children) != null && d.length) ? /* @__PURE__ */ l("div", { className: "div-ac3dff4a-2", children: e.children }) : null
     ] }),
-    /* @__PURE__ */ c("style", { children: `.img-ac3dff4a {
+    /* @__PURE__ */ l("style", { children: `.img-ac3dff4a {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
 }.div-ac3dff4a {
@@ -1106,7 +1121,7 @@ function Pt(e) {
   ] });
 }
 function Bt(e) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     "section",
     {
       ...e.attributes,
@@ -1341,7 +1356,7 @@ const Wt = {
         });
       }
       const n = e.get("columns");
-      Array.isArray(n) && n.find((o) => o.get("width")) && (n.find((a) => !a.get("width")) || n.reduce((l, s) => l + s.get("width"), 0) !== 100) && t();
+      Array.isArray(n) && n.find((o) => o.get("width")) && (n.find((a) => !a.get("width")) || n.reduce((c, s) => c + s.get("width"), 0) !== 100) && t();
     }
   }, {
     name: "space",
@@ -1395,7 +1410,7 @@ const Wt = {
     defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
     onChange: (e) => {
       e.delete("srcset"), e.delete("noWebp");
-      function n(r, l = 6e4) {
+      function n(r, c = 6e4) {
         return new Promise((s, d) => {
           const m = document.createElement("img");
           let u = !1;
@@ -1405,7 +1420,7 @@ const Wt = {
             console.warn("Image load failed", h.error), d(h.error);
           }), m.src = r, setTimeout(() => {
             u || d(new Error("Image load timed out"));
-          }, l);
+          }, c);
         });
       }
       function i(r) {
@@ -1416,8 +1431,8 @@ const Wt = {
         r.type.includes("svg") && e.set("noWebp", !0);
       }), o && (!a || a === 0.7041))
         return n(o).then((r) => {
-          const l = e.get("aspectRatio");
-          e.get("image") === o && (!l || l === 0.7041) && r.width && r.height && (e.set("aspectRatio", i(r.height / r.width)), e.set("height", r.height), e.set("width", r.width));
+          const c = e.get("aspectRatio");
+          e.get("image") === o && (!c || c === 0.7041) && r.width && r.height && (e.set("aspectRatio", i(r.height / r.width)), e.set("height", r.height), e.set("width", r.width));
         });
     }
   }, {
@@ -1541,7 +1556,7 @@ const Wt = {
 };
 function Lt(e) {
   var t, n, i;
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     "div",
     {
       style: {
@@ -1550,8 +1565,8 @@ function Lt(e) {
       ...!((t = e.builderContext.context) != null && t.symbolId) && {
         "builder-slot": e.name
       },
-      children: /* @__PURE__ */ c(
-        ce,
+      children: /* @__PURE__ */ l(
+        le,
         {
           parent: (n = e.builderContext.context) == null ? void 0 : n.symbolId,
           path: `symbol.data.${e.name}`,
@@ -1625,7 +1640,7 @@ const Ot = {
 };
 function jt(e) {
   var t;
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     "div",
     {
       className: "builder-text",
@@ -1662,8 +1677,8 @@ const Ht = {
 function Mt(e) {
   const t = oe(null), [n, i] = N(() => []), [o, a] = N(() => []);
   return R(() => {
-    var l;
-    if (!((l = t.current) != null && l.getElementsByTagName) || typeof window == "undefined")
+    var c;
+    if (!((c = t.current) != null && c.getElementsByTagName) || typeof window == "undefined")
       return;
     const r = t.current.getElementsByTagName("script");
     for (let s = 0; s < r.length; s++) {
@@ -1688,7 +1703,7 @@ function Mt(e) {
         }
       }
     }
-  }, []), /* @__PURE__ */ c(
+  }, []), /* @__PURE__ */ l(
     "div",
     {
       ref: t,
@@ -1714,7 +1729,7 @@ const Ut = {
   }]
 }, _t = ["text/javascript", "application/javascript", "application/ecmascript"], Kt = (e) => _t.includes(e.type);
 function zt(e) {
-  const t = oe(null), [n, i] = N(() => []), [o, a] = N(() => []), [r, l] = N(() => !1);
+  const t = oe(null), [n, i] = N(() => []), [o, a] = N(() => []), [r, c] = N(() => !1);
   function s() {
     if (!t.current || !t.current.getElementsByTagName)
       return;
@@ -1734,8 +1749,8 @@ function zt(e) {
     }
   }
   return R(() => {
-    t.current && !r && (l(!0), s());
-  }, [t.current, r]), /* @__PURE__ */ c(
+    t.current && !r && (c(!0), s());
+  }, [t.current, r]), /* @__PURE__ */ l(
     "div",
     {
       className: "builder-embed",
@@ -1760,7 +1775,7 @@ const qt = {
   static: !0
 };
 function Yt(e) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     "img",
     {
       style: {
@@ -1860,7 +1875,7 @@ const Jt = {
   }
 };
 function Qt(e) {
-  var i, o, a, r, l, s, d;
+  var i, o, a, r, c, s, d;
   function t() {
     return {
       ...e.autoPlay === !0 ? {
@@ -1892,7 +1907,7 @@ function Qt(e) {
         position: "relative"
       },
       children: [
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ l(
           "video",
           {
             className: "builder-video",
@@ -1914,10 +1929,10 @@ function Qt(e) {
             },
             src: e.video || "no-src",
             poster: e.posterImage,
-            children: e.lazyLoad ? null : /* @__PURE__ */ c("source", { type: "video/mp4", src: e.video })
+            children: e.lazyLoad ? null : /* @__PURE__ */ l("source", { type: "video/mp4", src: e.video })
           }
         ),
-        e.aspectRatio && !(e.fitContent && ((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length)) ? /* @__PURE__ */ c(
+        e.aspectRatio && !(e.fitContent && ((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length)) ? /* @__PURE__ */ l(
           "div",
           {
             style: {
@@ -1928,7 +1943,7 @@ function Qt(e) {
             }
           }
         ) : null,
-        (l = (r = e.builderBlock) == null ? void 0 : r.children) != null && l.length && e.fitContent ? /* @__PURE__ */ c(
+        (c = (r = e.builderBlock) == null ? void 0 : r.children) != null && c.length && e.fitContent ? /* @__PURE__ */ l(
           "div",
           {
             style: {
@@ -1939,7 +1954,7 @@ function Qt(e) {
             children: e.children
           }
         ) : null,
-        (d = (s = e.builderBlock) == null ? void 0 : s.children) != null && d.length && !e.fitContent ? /* @__PURE__ */ c(
+        (d = (s = e.builderBlock) == null ? void 0 : s.children) != null && d.length && !e.fitContent ? /* @__PURE__ */ l(
           "div",
           {
             style: {
@@ -2106,11 +2121,12 @@ const Gt = () => [{
     "${t}", "${e}", ${We}
   )`;
 function ne(e) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(
     "script",
     {
       dangerouslySetInnerHTML: { __html: e.scriptStr },
-      "data-id": e.id
+      "data-id": e.id,
+      nonce: e.nonce || ""
     }
   );
 }
@@ -2126,12 +2142,13 @@ const rn = _e({
   componentInfos: {},
   inheritedStyles: {},
   BlocksWrapper: "div",
-  BlocksWrapperProps: {}
+  BlocksWrapperProps: {},
+  nonce: ""
 });
-function pe(e) {
+function ve(e) {
   return Math.round(e * 1e3) / 1e3;
 }
-const ln = (e, t, n = !0) => {
+const cn = (e, t, n = !0) => {
   if (!(e instanceof HTMLElement))
     return null;
   let i = n ? e : e.parentElement;
@@ -2142,28 +2159,28 @@ const ln = (e, t, n = !0) => {
       return i;
   } while (i = i.parentElement);
   return null;
-}, cn = (e) => ln(e, (t) => {
+}, ln = (e) => cn(e, (t) => {
   const n = t.getAttribute("builder-id") || t.id;
   return (n == null ? void 0 : n.indexOf("builder-")) === 0;
-}), ve = ({
+}), xe = ({
   event: e,
   target: t
 }) => {
-  const n = t.getBoundingClientRect(), i = e.clientX - n.left, o = e.clientY - n.top, a = pe(i / n.width), r = pe(o / n.height);
+  const n = t.getBoundingClientRect(), i = e.clientX - n.left, o = e.clientY - n.top, a = ve(i / n.width), r = ve(o / n.height);
   return {
     x: a,
     y: r
   };
 }, sn = (e) => {
-  const t = e.target, n = t && cn(t), i = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
+  const t = e.target, n = t && ln(t), i = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
   return {
     targetBuilderElement: i || void 0,
     metadata: {
-      targetOffset: t ? ve({
+      targetOffset: t ? xe({
         event: e,
         target: t
       }) : void 0,
-      builderTargetOffset: n ? ve({
+      builderTargetOffset: n ? xe({
         event: e,
         target: n
       }) : void 0,
@@ -2192,9 +2209,9 @@ function un(e) {
 }
 function mn(e, t) {
   const n = fn(e), i = getComputedStyle(t), o = e.steps[0].styles, a = e.steps[e.steps.length - 1].styles, r = [o, a];
-  for (const l of r)
+  for (const c of r)
     for (const s of n)
-      s in l || (l[s] = i[s]);
+      s in c || (c[s] = i[s]);
 }
 function fn(e) {
   const t = [];
@@ -2229,16 +2246,16 @@ font-display: fallback;
 font-weight: 400;
 }
       `.trim()), e.files)
-    for (const l in e.files) {
-      if (!(String(Number(l)) === l))
+    for (const c in e.files) {
+      if (!(String(Number(c)) === c))
         continue;
-      const d = e.files[l];
+      const d = e.files[c];
       d && d !== i && (o += `
 @font-face {
 font-family: "${t}";
 src: url('${d}') format('woff2');
 font-display: fallback;
-font-weight: ${l};
+font-weight: ${c};
 }
         `.trim());
     }
@@ -2251,7 +2268,7 @@ font-weight: ${l};
 }, yn = ({
   cssCode: e,
   contentId: t
-}) => e ? t ? (e == null ? void 0 : e.replace(/&/g, `div[builder-content-id="${t}"]`)) || "" : e : "", pn = `
+}) => e ? t ? (e == null ? void 0 : e.replace(/&/g, `div[builder-content-id="${t}"]`)) || "" : e : "", vn = `
 .builder-button {
   all: unset;
 }
@@ -2268,29 +2285,29 @@ font-weight: ${l};
   text-align: inherit;
   font-family: inherit;
 }
-`, vn = (e) => e ? "" : pn, Sn = (e) => `variant-${e}`;
-function xn(e) {
+`, xn = (e) => e ? "" : vn, Sn = (e) => `variant-${e}`;
+function pn(e) {
   var B, O, D, X, Z, se, de;
   const t = oe(null);
   function n(g) {
-    var p, v;
+    var v, x;
     const f = {
       ...e.builderContextSignal.rootState,
       ...g
     };
-    e.builderContextSignal.rootSetState ? (v = (p = e.builderContextSignal).rootSetState) == null || v.call(p, f) : e.builderContextSignal.rootState = f;
+    e.builderContextSignal.rootSetState ? (x = (v = e.builderContextSignal).rootSetState) == null || x.call(v, f) : e.builderContextSignal.rootState = f;
   }
   function i(g) {
-    var p, v, C, P, U;
+    var v, x, C, P, U;
     const f = {
       ...e.builderContextSignal.content,
       ...g,
       data: {
-        ...(p = e.builderContextSignal.content) == null ? void 0 : p.data,
+        ...(v = e.builderContextSignal.content) == null ? void 0 : v.data,
         ...g == null ? void 0 : g.data
       },
       meta: {
-        ...(v = e.builderContextSignal.content) == null ? void 0 : v.meta,
+        ...(x = e.builderContextSignal.content) == null ? void 0 : x.meta,
         ...g == null ? void 0 : g.meta,
         breakpoints: ((C = g == null ? void 0 : g.meta) == null ? void 0 : C.breakpoints) || ((U = (P = e.builderContextSignal.content) == null ? void 0 : P.meta) == null ? void 0 : U.breakpoints)
       }
@@ -2311,17 +2328,17 @@ function xn(e) {
   const [a, r] = N(
     () => e.contentWrapper || "div"
   );
-  function l(g) {
+  function c(g) {
     return Oe({
       model: e.model,
       trustedHosts: e.trustedHosts,
       callbacks: {
         configureSdk: (f) => {
           var C;
-          const { breakpoints: p, contentId: v } = f;
-          !v || v !== ((C = e.builderContextSignal.content) == null ? void 0 : C.id) || p && i({
+          const { breakpoints: v, contentId: x } = f;
+          !x || x !== ((C = e.builderContextSignal.content) == null ? void 0 : C.id) || v && i({
             meta: {
-              breakpoints: p
+              breakpoints: v
             }
           });
         },
@@ -2335,8 +2352,8 @@ function xn(e) {
     })(g);
   }
   function s() {
-    var f, p;
-    const g = (p = (f = e.builderContextSignal.content) == null ? void 0 : f.data) == null ? void 0 : p.jsCode;
+    var f, v;
+    const g = (v = (f = e.builderContextSignal.content) == null ? void 0 : f.data) == null ? void 0 : v.jsCode;
     g && H({
       code: g,
       context: e.context || {},
@@ -2349,26 +2366,26 @@ function xn(e) {
       enableCache: !1
     });
   }
-  const [d, m] = N(() => ({})), [u, h] = N(() => ({})), [x, I] = N(() => !1);
+  const [d, m] = N(() => ({})), [u, h] = N(() => ({})), [p, I] = N(() => !1);
   function y(g) {
-    var f, p;
+    var f, v;
     if (e.builderContextSignal.content) {
-      const v = (f = e.builderContextSignal.content) == null ? void 0 : f.testVariationId, C = (p = e.builderContextSignal.content) == null ? void 0 : p.id;
+      const x = (f = e.builderContextSignal.content) == null ? void 0 : f.testVariationId, C = (v = e.builderContextSignal.content) == null ? void 0 : v.id;
       ue({
         type: "click",
         canTrack: q(e.canTrack),
         contentId: C,
         apiKey: e.apiKey,
-        variationId: v !== C ? v : void 0,
+        variationId: x !== C ? x : void 0,
         ...sn(g),
-        unique: !x
+        unique: !p
       });
     }
-    x || I(!0);
+    p || I(!0);
   }
   function A() {
-    var f, p, v;
-    const g = (v = (p = (f = e.builderContextSignal.content) == null ? void 0 : f.data) == null ? void 0 : p.httpRequests) != null ? v : {};
+    var f, v, x;
+    const g = (x = (v = (f = e.builderContextSignal.content) == null ? void 0 : f.data) == null ? void 0 : v.httpRequests) != null ? x : {};
     Object.entries(g).forEach(([C, P]) => {
       if (!P || u[C] || d[C] && !V())
         return;
@@ -2413,7 +2430,7 @@ function xn(e) {
     );
   }
   function b(g) {
-    window.addEventListener("message", l), je(), He({
+    window.addEventListener("message", c), je(), He({
       ...e.locale ? {
         locale: e.locale
       } : {},
@@ -2426,19 +2443,19 @@ function xn(e) {
     }), Object.values(
       e.builderContextSignal.componentInfos
     ).forEach((f) => {
-      var v;
-      const p = Me(f);
-      (v = window.parent) == null || v.postMessage(p, "*");
+      var x;
+      const v = Me(f);
+      (x = window.parent) == null || x.postMessage(v, "*");
     }), window.addEventListener(
       "builder:component:stateChangeListenerActivated",
       S
     );
   }
   function k(g) {
-    const f = new URL(location.href).searchParams, p = f.get("builder.preview"), v = f.get(
-      `builder.overrides.${p}`
+    const f = new URL(location.href).searchParams, v = f.get("builder.preview"), x = f.get(
+      `builder.overrides.${v}`
     ), C = f.get("apiKey") || f.get("builder.space");
-    p === e.model && C === e.apiKey && (!e.content || v === e.content.id) && ke({
+    v === e.model && C === e.apiKey && (!e.content || x === e.content.id) && ke({
       model: e.model,
       apiKey: e.apiKey,
       apiVersion: e.builderContextSignal.apiVersion
@@ -2475,13 +2492,13 @@ function xn(e) {
     var g, f;
     if (L()) {
       if (V() && t.current && t.current.dispatchEvent(new CustomEvent("initeditingbldr")), e.builderContextSignal.content && q(e.canTrack)) {
-        const v = (g = e.builderContextSignal.content) == null ? void 0 : g.testVariationId, C = (f = e.builderContextSignal.content) == null ? void 0 : f.id, P = e.apiKey;
+        const x = (g = e.builderContextSignal.content) == null ? void 0 : g.testVariationId, C = (f = e.builderContextSignal.content) == null ? void 0 : f.id, P = e.apiKey;
         ue({
           type: "impression",
           canTrack: !0,
           contentId: C,
           apiKey: P,
-          variationId: v !== C ? v : void 0
+          variationId: x !== C ? x : void 0
         });
       }
       Le() && V();
@@ -2504,11 +2521,11 @@ function xn(e) {
       locale: e.locale
     });
   }, [e.locale]), R(() => () => {
-    L() && (window.removeEventListener("message", l), window.removeEventListener(
+    L() && (window.removeEventListener("message", c), window.removeEventListener(
       "builder:component:stateChangeListenerActivated",
       S
     ));
-  }, []), /* @__PURE__ */ c(rn.Provider, { value: e.builderContextSignal, children: e.builderContextSignal.content ? /* @__PURE__ */ c(
+  }, []), /* @__PURE__ */ l(rn.Provider, { value: e.builderContextSignal, children: e.builderContextSignal.content ? /* @__PURE__ */ l(
     a,
     {
       ref: t,
@@ -2533,18 +2550,25 @@ ${yn({
 ${bn({
     customFonts: e.customFonts
   })}
-${vn(e.isNestedRender)}
+${xn(e.isNestedRender)}
 `.trim();
-  return /* @__PURE__ */ c(Q, { id: "builderio-content", styles: t });
+  return /* @__PURE__ */ l(
+    Q,
+    {
+      id: "builderio-content",
+      styles: t,
+      nonce: e.nonce
+    }
+  );
 }
 const Cn = ({
   content: e,
   data: t,
   locale: n
 }) => {
-  var a, r, l;
+  var a, r, c;
   const i = {}, o = ((a = e == null ? void 0 : e.data) == null ? void 0 : a.state) || {};
-  return (l = (r = e == null ? void 0 : e.data) == null ? void 0 : r.inputs) == null || l.forEach((s) => {
+  return (c = (r = e == null ? void 0 : e.data) == null ? void 0 : r.inputs) == null || c.forEach((s) => {
     s.name && s.defaultValue !== void 0 && (i[s.name] = s.defaultValue);
   }), {
     ...i,
@@ -2565,8 +2589,8 @@ const Cn = ({
   },
   meta: e == null ? void 0 : e.meta
 } : void 0;
-function xe(e) {
-  var o, a, r, l, s, d, m, u, h;
+function pe(e) {
+  var o, a, r, c, s, d, m, u, h;
   const t = an({
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     variationId: (o = e.content) == null ? void 0 : o.testVariationId,
@@ -2576,8 +2600,8 @@ function xe(e) {
     ...ye(),
     ...e.customComponents || []
   ].reduce(
-    (x, { component: I, ...y }) => ({
-      ...x,
+    (p, { component: I, ...y }) => ({
+      ...p,
       [y.name]: {
         component: I,
         ...me(y)
@@ -2604,19 +2628,21 @@ function xe(e) {
       ...ye(),
       ...e.customComponents || []
     ].reduce(
-      (x, { component: I, ...y }) => ({
-        ...x,
+      (p, { component: I, ...y }) => ({
+        ...p,
         [y.name]: me(y)
       }),
       {}
     ),
     inheritedStyles: {},
     BlocksWrapper: e.blocksWrapper || "div",
-    BlocksWrapperProps: e.blocksWrapperProps || {}
+    BlocksWrapperProps: e.blocksWrapperProps || {},
+    nonce: e.nonce || ""
   };
   return /* @__PURE__ */ E(
-    xn,
+    pn,
     {
+      nonce: e.nonce,
       content: e.content,
       data: e.data,
       model: e.model,
@@ -2631,24 +2657,26 @@ function xe(e) {
       contentWrapperProps: e.contentWrapperProps,
       trustedHosts: e.trustedHosts,
       children: [
-        e.isSsrAbTest ? /* @__PURE__ */ c(
+        e.isSsrAbTest ? /* @__PURE__ */ l(
           ne,
           {
             id: "builderio-variant-visibility",
-            scriptStr: t
+            scriptStr: t,
+            nonce: e.nonce || ""
           }
         ) : null,
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ l(
           kn,
           {
+            nonce: e.nonce || "",
             isNestedRender: e.isNestedRender,
             contentId: (r = i.content) == null ? void 0 : r.id,
-            cssCode: (s = (l = i.content) == null ? void 0 : l.data) == null ? void 0 : s.cssCode,
+            cssCode: (s = (c = i.content) == null ? void 0 : c.data) == null ? void 0 : s.cssCode,
             customFonts: (m = (d = i.content) == null ? void 0 : d.data) == null ? void 0 : m.customFonts
           }
         ),
-        /* @__PURE__ */ c(
-          ce,
+        /* @__PURE__ */ l(
+          le,
           {
             blocks: (h = (u = i.content) == null ? void 0 : u.data) == null ? void 0 : h.blocks,
             context: i,
@@ -2666,53 +2694,57 @@ function In(e) {
     canTrack: q(e.canTrack),
     content: e.content
   }), n = function() {
-    var l;
+    var c;
     return on(
       K(e.content).map((s) => ({
         id: s.testVariationId,
         testRatio: s.testRatio
       })),
-      ((l = e.content) == null ? void 0 : l.id) || ""
+      ((c = e.content) == null ? void 0 : c.id) || ""
     );
   }, i = function() {
-    return K(e.content).map((l) => `.variant-${l.testVariationId} { display: none; } `).join("");
+    return K(e.content).map((c) => `.variant-${c.testVariationId} { display: none; } `).join("");
   }, o = function() {
-    var l;
+    var c;
     return t ? {
       ...e.content,
-      testVariationId: (l = e.content) == null ? void 0 : l.id
+      testVariationId: (c = e.content) == null ? void 0 : c.id
     } : Ue({
       item: e.content,
       canTrack: q(e.canTrack)
     });
   };
   return /* @__PURE__ */ E(w, { children: [
-    !e.isNestedRender && M !== "reactNative" ? /* @__PURE__ */ c(
+    !e.isNestedRender && M !== "reactNative" ? /* @__PURE__ */ l(
       ne,
       {
         id: "builderio-init-variants-fns",
-        scriptStr: nn()
+        scriptStr: nn(),
+        nonce: e.nonce || ""
       }
     ) : null,
     t ? /* @__PURE__ */ E(w, { children: [
-      /* @__PURE__ */ c(
+      /* @__PURE__ */ l(
         Q,
         {
           id: "builderio-variants",
-          styles: i()
+          styles: i(),
+          nonce: e.nonce || ""
         }
       ),
-      /* @__PURE__ */ c(
+      /* @__PURE__ */ l(
         ne,
         {
           id: "builderio-variants-visibility",
-          scriptStr: n()
+          scriptStr: n(),
+          nonce: e.nonce || ""
         }
       ),
-      (a = K(e.content)) == null ? void 0 : a.map((r) => /* @__PURE__ */ c(
-        xe,
+      (a = K(e.content)) == null ? void 0 : a.map((r) => /* @__PURE__ */ l(
+        pe,
         {
           isNestedRender: e.isNestedRender,
+          nonce: e.nonce,
           content: r,
           showContent: !1,
           model: e.model,
@@ -2735,9 +2767,10 @@ function In(e) {
         r.testVariationId
       ))
     ] }) : null,
-    /* @__PURE__ */ c(
-      xe,
+    /* @__PURE__ */ l(
+      pe,
       {
+        nonce: e.nonce,
         isNestedRender: e.isNestedRender,
         content: o(),
         showContent: !0,
@@ -2781,7 +2814,7 @@ const Tn = async ({
     });
 };
 async function Rn(e) {
-  var a, r, l, s, d;
+  var a, r, c, s, d;
   const t = function() {
     return "div";
   }, n = function() {
@@ -2798,9 +2831,10 @@ async function Rn(e) {
     symbol: e.symbol,
     builderContextValue: e.builderContext
   });
-  return /* @__PURE__ */ c("div", { ...e.attributes, className: i(), children: /* @__PURE__ */ c(
+  return /* @__PURE__ */ l("div", { ...e.attributes, className: i(), children: /* @__PURE__ */ l(
     In,
     {
+      nonce: e.builderContext.nonce,
       isNestedRender: !0,
       apiVersion: e.builderContext.apiVersion,
       apiKey: e.builderContext.apiKey,
@@ -2810,7 +2844,7 @@ async function Rn(e) {
       },
       customComponents: Object.values(e.builderComponents),
       data: {
-        ...(l = e.symbol) == null ? void 0 : l.data,
+        ...(c = e.symbol) == null ? void 0 : c.data,
         ...e.builderContext.localState,
         ...(s = o == null ? void 0 : o.data) == null ? void 0 : s.state
       },
@@ -2824,7 +2858,7 @@ async function Rn(e) {
   ) });
 }
 export {
-  ce as Blocks,
+  le as Blocks,
   rn as BuilderContext,
   Ye as Button,
   It as Columns,