@builder.io/sdk-react 0.7.1-0 → 0.7.1

package/lib/node/index.mjs

@@ -1,17 +1,17 @@
 "use client";
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { createContext, useState, useContext, createElement, useRef, useEffect } from "react";
-import { j as fastClone, i as isEditing, k as isBrowser, l as getUserAttributes, m as logger, n as checkIsDefined, T as TARGET, r as register, o as getDefaultCanTrack, p as _track, a as isPreviewing, c as createRegisterComponentMessage, b as fetchOneEntry, q as fetch$1, u as components, v as serializeComponentInfo, w as handleABTestingSync } from "./server-entry-13b7e1e6.mjs";
-import { _ as M, h as W, f as L, g as O, e as U, d as D, s as H, t as K } from "./server-entry-13b7e1e6.mjs";
+import { i as isEditing, j as isBrowser, k as getUserAttributes, l as fastClone, m as logger, n as checkIsDefined, T as TARGET, r as register, o as getDefaultCanTrack, p as _track, a as isPreviewing, c as createRegisterComponentMessage, b as fetchOneEntry, q as fetch$1, u as components, v as serializeComponentInfo, w as handleABTestingSync } from "./server-entry-e4cd1e05.mjs";
+import { _ as M, h as W, f as L, g as O, e as U, d as D, s as H, t as K } from "./server-entry-e4cd1e05.mjs";
 function Button(e) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     e.link ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
       "a",
       {
-        role: "button",
         ...e.attributes,
         href: e.link,
         target: e.openLinkInNewTab ? "_blank" : void 0,
+        role: "button",
         children: e.text
       }
     ) }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
@@ -19,58 +19,39 @@ function Button(e) {
       {
         ...e.attributes,
         style: e.attributes.style,
-        className: e.attributes.className + " button-35669e6c",
+        className: e.attributes.className + " button-5294b10c",
         children: e.text
       }
     ) }),
-    /* @__PURE__ */ jsx("style", { children: `.button-35669e6c {
+    /* @__PURE__ */ jsx("style", { children: `.button-5294b10c {
   all: unset;
 }` })
   ] });
 }
-const SIZES = {
-  small: {
-    min: 320,
-    default: 321,
-    max: 640
-  },
-  medium: {
-    min: 641,
-    default: 642,
-    max: 991
+const builderContext = createContext({
+  content: null,
+  context: {},
+  localState: void 0,
+  rootSetState() {
   },
-  large: {
-    min: 990,
-    default: 991,
-    max: 1200
-  }
-}, getMaxWidthQueryForSize = (e, t = SIZES) => `@media (max-width: ${t[e].max}px)`, getSizesForBreakpoints = ({
-  small: e,
-  medium: t
-}) => {
-  const n = fastClone(SIZES);
-  if (!e || !t)
-    return n;
-  const i = Math.floor(e / 2);
-  n.small = {
-    max: e,
-    min: i,
-    default: i + 1
-  };
-  const o = n.small.max + 1;
-  n.medium = {
-    max: t,
-    min: o,
-    default: o + 1
+  rootState: {},
+  apiKey: null,
+  apiVersion: void 0,
+  componentInfos: {},
+  inheritedStyles: {}
+}), ComponentsContext = createContext({ registeredComponents: {} });
+function getBlockComponentOptions(e) {
+  var t;
+  return {
+    ...(t = e.component) == null ? void 0 : t.options,
+    ...e.options,
+    /**
+     * Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
+     */
+    builderBlock: e
   };
-  const a = n.medium.max + 1;
-  return n.large = {
-    max: 2e3,
-    // TODO: decide upper limit
-    min: a,
-    default: a + 1
-  }, n;
-}, getFunctionArguments = ({
+}
+const getFunctionArguments = ({
   builder: e,
   context: t,
   event: n,
@@ -98,13 +79,13 @@ const SIZES = {
   rootSetState: a,
   rootState: r
 }) => {
-  const l = getFunctionArguments({
+  const s = getFunctionArguments({
     builder: t,
     context: n,
     event: i,
     state: flattenState(r, o, a)
   });
-  return new Function(...l.map(([s]) => s), e)(...l.map(([, s]) => s));
+  return new Function(...s.map(([c]) => c), e)(...s.map(([, c]) => c));
 };
 function flattenState(e, t, n) {
   if (e === t)
@@ -118,18 +99,18 @@ function flattenState(e, t, n) {
     }
   });
 }
-const noop = () => null;
-let safeDynamicRequire = noop;
-try {
-  safeDynamicRequire = eval("require");
-} catch (e) {
-}
 const set = (e, t, n) => {
   if (Object(e) !== e)
     return e;
   const i = Array.isArray(t) ? t : t.toString().match(/[^.[\]]+/g);
   return i.slice(0, -1).reduce((o, a, r) => Object(o[a]) === o[a] ? o[a] : o[a] = Math.abs(Number(i[r + 1])) >> 0 === +i[r + 1] ? [] : {}, e)[i[i.length - 1]] = n, e;
-}, ivm = safeDynamicRequire("isolated-vm"), getSyncValName = (e) => `bldr_${e}_sync`, BUILDER_SET_STATE_NAME = "BUILDER_SET_STATE", INJECTED_IVM_GLOBAL = "BUILDER_IVM", REF_TO_PROXY_FN = `
+}, noop = () => null;
+let safeDynamicRequire = noop;
+try {
+  safeDynamicRequire = eval("require");
+} catch (e) {
+}
+const ivm = safeDynamicRequire("isolated-vm"), getSyncValName = (e) => `bldr_${e}_sync`, BUILDER_SET_STATE_NAME = "BUILDER_SET_STATE", INJECTED_IVM_GLOBAL = "BUILDER_IVM", REF_TO_PROXY_FN = `
 var refToProxy = (obj) => {
   if (typeof obj !== 'object' || obj === null) {
     return obj;
@@ -186,20 +167,20 @@ output;
   rootSetState: a,
   rootState: r
 }) => {
-  const l = fastClone({
+  const s = fastClone({
     ...r,
     ...o
-  }), s = getFunctionArguments({
+  }), c = getFunctionArguments({
     builder: t,
     context: n,
     event: i,
-    state: l
-  }), c = getIsolateContext(), u = c.global;
+    state: s
+  }), l = getIsolateContext(), u = l.global;
   u.setSync("global", u.derefInto()), u.setSync("log", function(...b) {
     console.log(...b);
   }), u.setSync(BUILDER_SET_STATE_NAME, function(b, d) {
     set(r, b, d), a == null || a(r);
-  }), s.forEach(([b, d]) => {
+  }), c.forEach(([b, d]) => {
     const x = typeof d == "object" ? new ivm.Reference(
       // workaround: methods with default values for arguments is not being cloned over
       b === "builder" ? {
@@ -211,8 +192,8 @@ output;
   }), u.setSync(INJECTED_IVM_GLOBAL, ivm);
   const f = processCode({
     code: e,
-    args: s
-  }), h = c.evalSync(f);
+    args: c
+  }), h = l.evalSync(f);
   try {
     return JSON.parse(h);
   } catch {
@@ -232,7 +213,7 @@ function evaluate({
     logger.warn("Skipping evaluation of empty code block.");
     return;
   }
-  const l = {
+  const s = {
     code: parseCode(e, {
       isExpression: r
     }),
@@ -244,9 +225,9 @@ function evaluate({
     localState: n
   };
   try {
-    return chooseBrowserOrServerEval(l);
-  } catch (s) {
-    logger.error("Failed code evaluation: " + s.message, {
+    return chooseBrowserOrServerEval(s);
+  } catch (c) {
+    logger.error("Failed code evaluation: " + c.message, {
       code: e
     });
     return;
@@ -273,15 +254,15 @@ const evaluateBindings = ({
       ...a.actions
     }
   };
-  for (const l in e.bindings) {
-    const s = e.bindings[l], c = evaluate({
-      code: s,
+  for (const s in e.bindings) {
+    const c = e.bindings[s], l = evaluate({
+      code: c,
       localState: n,
       rootState: i,
       rootSetState: o,
       context: t
     });
-    set(r, l, c);
+    set(r, s, l);
   }
   return r;
 };
@@ -302,7 +283,104 @@ function getProcessedBlock({
     context: t
   }) : r;
 }
-const camelToKebabCase = (e) => e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), convertStyleMapToCSSArray = (e) => Object.entries(e).map(([n, i]) => {
+const EMPTY_HTML_ELEMENTS = ["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"], isEmptyHtmlElement = (e) => typeof e == "string" && EMPTY_HTML_ELEMENTS.includes(e.toLowerCase()), getComponent = ({
+  block: e,
+  context: t,
+  registeredComponents: n
+}) => {
+  var a;
+  const i = (a = getProcessedBlock({
+    block: e,
+    localState: t.localState,
+    rootState: t.rootState,
+    rootSetState: t.rootSetState,
+    context: t.context,
+    shouldEvaluateBindings: !1
+  }).component) == null ? void 0 : a.name;
+  if (!i)
+    return null;
+  const o = n[i];
+  if (o)
+    return o;
+  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?`);
+}, getRepeatItemData = ({
+  block: e,
+  context: t
+}) => {
+  const {
+    repeat: n,
+    ...i
+  } = e;
+  if (!(n != null && n.collection))
+    return;
+  const o = evaluate({
+    code: n.collection,
+    localState: t.localState,
+    rootState: t.rootState,
+    rootSetState: t.rootSetState,
+    context: t.context
+  });
+  if (!Array.isArray(o))
+    return;
+  const a = n.collection.split(".").pop(), r = n.itemName || (a ? a + "Item" : "item");
+  return o.map((c, l) => ({
+    context: {
+      ...t,
+      localState: {
+        ...t.localState,
+        $index: l,
+        $item: c,
+        [r]: c,
+        [`$${r}Index`]: l
+      }
+    },
+    block: i
+  }));
+}, SIZES = {
+  small: {
+    min: 320,
+    default: 321,
+    max: 640
+  },
+  medium: {
+    min: 641,
+    default: 642,
+    max: 991
+  },
+  large: {
+    min: 990,
+    default: 991,
+    max: 1200
+  }
+}, getMaxWidthQueryForSize = (e, t = SIZES) => `@media (max-width: ${t[e].max}px)`, getSizesForBreakpoints = ({
+  small: e,
+  medium: t
+}) => {
+  const n = fastClone(SIZES);
+  if (!e || !t)
+    return n;
+  const i = Math.floor(e / 2);
+  n.small = {
+    max: e,
+    min: i,
+    default: i + 1
+  };
+  const o = n.small.max + 1;
+  n.medium = {
+    max: t,
+    min: o,
+    default: o + 1
+  };
+  const a = n.medium.max + 1;
+  return n.large = {
+    max: 2e3,
+    // TODO: decide upper limit
+    min: a,
+    default: a + 1
+  }, n;
+}, camelToKebabCase = (e) => e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), convertStyleMapToCSSArray = (e) => Object.entries(e).map(([n, i]) => {
   if (typeof i == "string")
     return `${camelToKebabCase(n)}: ${i};`;
 }).filter(checkIsDefined), convertStyleMapToCSS = (e) => convertStyleMapToCSSArray(e).join(`
@@ -344,22 +422,22 @@ function BlockStyles(e) {
       shouldEvaluateBindings: !0
     }), o = i.responsiveStyles, a = e.context.content, r = getSizesForBreakpoints(
       ((d = a == null ? void 0 : a.meta) == null ? void 0 : d.breakpoints) || {}
-    ), l = o == null ? void 0 : o.large, s = o == null ? void 0 : o.medium, c = o == null ? void 0 : o.small, u = i.id;
+    ), s = o == null ? void 0 : o.large, c = o == null ? void 0 : o.medium, l = o == null ? void 0 : o.small, u = i.id;
     if (!u)
       return "";
-    const f = l ? createCssClass({
+    const f = s ? createCssClass({
       className: u,
-      styles: l
-    }) : "", h = s ? createCssClass({
+      styles: s
+    }) : "", h = c ? createCssClass({
       className: u,
-      styles: s,
+      styles: c,
       mediaQuery: getMaxWidthQueryForSize(
         "medium",
         r
       )
-    }) : "", b = c ? createCssClass({
+    }) : "", b = l ? createCssClass({
       className: u,
-      styles: c,
+      styles: l,
       mediaQuery: getMaxWidthQueryForSize(
         "small",
         r
@@ -369,95 +447,6 @@ function BlockStyles(e) {
   }
   return /* @__PURE__ */ jsx(Fragment, { children: n() && t() ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedStyles, { styles: n() }) }) : null });
 }
-function getBlockComponentOptions(e) {
-  var t;
-  return {
-    ...(t = e.component) == null ? void 0 : t.options,
-    ...e.options,
-    /**
-     * Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
-     */
-    builderBlock: e
-  };
-}
-const EMPTY_HTML_ELEMENTS = ["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"], isEmptyHtmlElement = (e) => typeof e == "string" && EMPTY_HTML_ELEMENTS.includes(e.toLowerCase()), getComponent = ({
-  block: e,
-  context: t,
-  registeredComponents: n
-}) => {
-  var a;
-  const i = (a = getProcessedBlock({
-    block: e,
-    localState: t.localState,
-    rootState: t.rootState,
-    rootSetState: t.rootSetState,
-    context: t.context,
-    shouldEvaluateBindings: !1
-  }).component) == null ? void 0 : a.name;
-  if (!i)
-    return null;
-  const o = n[i];
-  if (o)
-    return o;
-  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?`);
-}, getRepeatItemData = ({
-  block: e,
-  context: t
-}) => {
-  const {
-    repeat: n,
-    ...i
-  } = e;
-  if (!(n != null && n.collection))
-    return;
-  const o = evaluate({
-    code: n.collection,
-    localState: t.localState,
-    rootState: t.rootState,
-    rootSetState: t.rootSetState,
-    context: t.context
-  });
-  if (!Array.isArray(o))
-    return;
-  const a = n.collection.split(".").pop(), r = n.itemName || (a ? a + "Item" : "item");
-  return o.map((s, c) => ({
-    context: {
-      ...t,
-      localState: {
-        ...t.localState,
-        $index: c,
-        $item: s,
-        [r]: s,
-        [`$${r}Index`]: c
-      }
-    },
-    block: i
-  }));
-}, builderContext = createContext({
-  content: null,
-  context: {},
-  localState: void 0,
-  rootSetState() {
-  },
-  rootState: {},
-  apiKey: null,
-  apiVersion: void 0,
-  componentInfos: {},
-  inheritedStyles: {}
-});
-function RepeatedBlock(e) {
-  const [t, n] = useState(() => e.repeatContext);
-  return /* @__PURE__ */ jsx(builderContext.Provider, { value: t, children: /* @__PURE__ */ jsx(
-    Block,
-    {
-      block: e.block,
-      context: t,
-      registeredComponents: e.registeredComponents
-    }
-  ) });
-}
 function capitalizeFirstLetter(e) {
   return e.charAt(0).toUpperCase() + e.slice(1);
 }
@@ -525,16 +514,60 @@ function getStyleAttribute(e) {
       return e;
   }
 }
-function InteractiveElement(e) {
-  return /* @__PURE__ */ jsx(
-    e.Wrapper,
-    {
-      ...e.wrapperProps,
-      attributes: {
-        ...getBlockProperties({
-          block: e.block,
-          context: e.context
-        }),
+function BlockWrapper(e) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    " ",
+    e.hasChildren ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+      e.Wrapper,
+      {
+        ...getBlockProperties({
+          block: e.block,
+          context: e.context
+        }),
+        ...getBlockActions({
+          block: e.block,
+          rootState: e.context.rootState,
+          rootSetState: e.context.rootSetState,
+          localState: e.context.localState,
+          context: e.context.context,
+          stripPrefix: !0
+        }),
+        children: [
+          " ",
+          e.children,
+          " "
+        ]
+      }
+    ) }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+      e.Wrapper,
+      {
+        ...getBlockProperties({
+          block: e.block,
+          context: e.context
+        }),
+        ...getBlockActions({
+          block: e.block,
+          rootState: e.context.rootState,
+          rootSetState: e.context.rootSetState,
+          localState: e.context.localState,
+          context: e.context.context,
+          stripPrefix: !0
+        })
+      }
+    ) }),
+    " "
+  ] });
+}
+function InteractiveElement(e) {
+  return /* @__PURE__ */ jsx(
+    e.Wrapper,
+    {
+      ...e.wrapperProps,
+      attributes: {
+        ...getBlockProperties({
+          block: e.block,
+          context: e.context
+        }),
         ...getBlockActions({
           block: e.block,
           rootState: e.context.rootState,
@@ -612,49 +645,16 @@ function ComponentRef(e) {
     }
   ) }) : null });
 }
-function BlockWrapper(e) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    " ",
-    e.hasChildren ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
-      e.Wrapper,
-      {
-        ...getBlockProperties({
-          block: e.block,
-          context: e.context
-        }),
-        ...getBlockActions({
-          block: e.block,
-          rootState: e.context.rootState,
-          rootSetState: e.context.rootSetState,
-          localState: e.context.localState,
-          context: e.context.context,
-          stripPrefix: !0
-        }),
-        children: [
-          " ",
-          e.children,
-          " "
-        ]
-      }
-    ) }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-      e.Wrapper,
-      {
-        ...getBlockProperties({
-          block: e.block,
-          context: e.context
-        }),
-        ...getBlockActions({
-          block: e.block,
-          rootState: e.context.rootState,
-          rootSetState: e.context.rootSetState,
-          localState: e.context.localState,
-          context: e.context.context,
-          stripPrefix: !0
-        })
-      }
-    ) }),
-    " "
-  ] });
+function RepeatedBlock(e) {
+  const [t, n] = useState(() => e.repeatContext);
+  return /* @__PURE__ */ jsx(builderContext.Provider, { value: t, children: /* @__PURE__ */ jsx(
+    Block,
+    {
+      block: e.block,
+      context: t,
+      registeredComponents: e.registeredComponents
+    }
+  ) });
 }
 function Block(e) {
   var u, f, h, b;
@@ -691,7 +691,7 @@ function Block(e) {
     var x;
     return !((x = t == null ? void 0 : t()) != null && x.component) && !n() ? i().children ?? [] : [];
   }
-  function l() {
+  function s() {
     var d, x, v, C, S;
     return {
       blockChildren: i().children ?? [],
@@ -703,15 +703,27 @@ function Block(e) {
           builderComponents: e.registeredComponents
         } : {}
       },
-      context: s,
+      context: c,
       registeredComponents: e.registeredComponents,
       builderBlock: i(),
       includeBlockProps: ((C = t == null ? void 0 : t()) == null ? void 0 : C.noWrap) === !0,
       isInteractive: !((S = t == null ? void 0 : t()) != null && S.isRSC)
     };
   }
-  const [s, c] = useState(() => e.context);
-  return /* @__PURE__ */ jsx(Fragment, { children: a() ? /* @__PURE__ */ jsx(Fragment, { children: (u = t == null ? void 0 : t()) != null && u.noWrap ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(ComponentRef, { ...l() }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+  const [c, l] = useState(() => e.context);
+  return /* @__PURE__ */ jsx(Fragment, { children: a() ? /* @__PURE__ */ jsx(Fragment, { children: (u = t == null ? void 0 : t()) != null && u.noWrap ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+    ComponentRef,
+    {
+      componentRef: s().componentRef,
+      componentOptions: s().componentOptions,
+      blockChildren: s().blockChildren,
+      context: s().context,
+      registeredComponents: s().registeredComponents,
+      builderBlock: s().builderBlock,
+      includeBlockProps: s().includeBlockProps,
+      isInteractive: s().isInteractive
+    }
+  ) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
     isEmptyHtmlElement(o()) ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
       BlockWrapper,
       {
@@ -738,12 +750,24 @@ function Block(e) {
         context: e.context,
         hasChildren: !0,
         children: [
-          /* @__PURE__ */ jsx(ComponentRef, { ...l() }),
+          /* @__PURE__ */ jsx(
+            ComponentRef,
+            {
+              componentRef: s().componentRef,
+              componentOptions: s().componentOptions,
+              blockChildren: s().blockChildren,
+              context: s().context,
+              registeredComponents: s().registeredComponents,
+              builderBlock: s().builderBlock,
+              includeBlockProps: s().includeBlockProps,
+              isInteractive: s().isInteractive
+            }
+          ),
           (h = r()) == null ? void 0 : h.map((d) => /* @__PURE__ */ jsx(
             Block,
             {
               block: d,
-              context: s,
+              context: c,
               registeredComponents: e.registeredComponents
             },
             "block-" + d.id
@@ -752,7 +776,7 @@ function Block(e) {
             BlockStyles,
             {
               block: d,
-              context: s
+              context: c
             },
             "block-style-" + d.id
           ))
@@ -813,7 +837,6 @@ function BlocksWrapper(e) {
 }` })
   ] });
 }
-const ComponentsContext = createContext({ registeredComponents: {} });
 function Blocks(e) {
   var i, o;
   const t = useContext(builderContext), n = useContext(ComponentsContext);
@@ -853,15 +876,15 @@ function Columns(e) {
   ), [i, o] = useState(() => e.columns || []), [a, r] = useState(
     () => e.stackColumnsAt || "tablet"
   );
-  function l(S) {
+  function s(S) {
     var E;
     return ((E = i[S]) == null ? void 0 : E.width) || 100 / i.length;
   }
-  function s(S) {
+  function c(S) {
     const E = t * (i.length - 1) / i.length;
-    return `calc(${l(S)}% - ${E}px)`;
+    return `calc(${s(S)}% - ${E}px)`;
   }
-  function c({
+  function l({
     stackedStyle: S,
     desktopStyle: E
   }) {
@@ -879,39 +902,39 @@ function Columns(e) {
   function b() {
     return {
       "--flex-dir": f,
-      "--flex-dir-tablet": c({
+      "--flex-dir-tablet": l({
         stackedStyle: f,
         desktopStyle: "row"
       })
     };
   }
   function d(S) {
-    const E = S === 0 ? 0 : t, I = s(S), T = `${E}px`, R = "100%", j = 0;
+    const E = S === 0 ? 0 : t, w = c(S), T = `${E}px`, R = "100%", j = 0;
     return {
-      width: I,
+      width: w,
       ["marginLeft"]: T,
       "--column-width-mobile": u({
         stackedStyle: R,
-        desktopStyle: I
+        desktopStyle: w
       }),
       "--column-margin-left-mobile": u({
         stackedStyle: j,
         desktopStyle: T
       }),
-      "--column-width-tablet": c({
+      "--column-width-tablet": l({
         stackedStyle: R,
-        desktopStyle: I
+        desktopStyle: w
       }),
-      "--column-margin-left-tablet": c({
+      "--column-margin-left-tablet": l({
         stackedStyle: j,
         desktopStyle: T
       })
     };
   }
   function x(S) {
-    var I, T;
+    var w, T;
     return getSizesForBreakpoints(
-      ((T = (I = e.builderContext.content) == null ? void 0 : I.meta) == null ? void 0 : T.breakpoints) || {}
+      ((T = (w = e.builderContext.content) == null ? void 0 : w.meta) == null ? void 0 : T.breakpoints) || {}
     )[S].max;
   }
   function v() {
@@ -945,14 +968,14 @@ function Columns(e) {
     /* @__PURE__ */ jsxs(
       "div",
       {
-        className: `builder-columns ${e.builderBlock.id}-breakpoints div-ac8f4142`,
+        className: `builder-columns ${e.builderBlock.id}-breakpoints div-53636e90`,
         style: b(),
         children: [
           /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedStyles, { styles: v() }) }),
           (C = e.columns) == null ? void 0 : C.map((S, E) => /* @__PURE__ */ createElement(
             "div",
             {
-              className: "builder-column div-ac8f4142-2",
+              className: "builder-column div-53636e90-2",
               style: d(E),
               key: E
             },
@@ -973,10 +996,10 @@ function Columns(e) {
         ]
       }
     ),
-    /* @__PURE__ */ jsx("style", { children: `.div-ac8f4142 {
+    /* @__PURE__ */ jsx("style", { children: `.div-53636e90 {
   display: flex;
   line-height: normal;
-}.div-ac8f4142-2 {
+}.div-53636e90-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1017,34 +1040,34 @@ function getSrcSet(e) {
   return e.match(/cdn\.shopify\.com/) ? t.map((n) => [getShopifyImageUrl(e, `${n}x${n}`), n]).filter(([n]) => !!n).map(([n, i]) => `${n} ${i}w`).concat([e]).join(", ") : e;
 }
 function Image(e) {
-  var o, a, r, l;
+  var o, a, r, s;
   function t() {
     var u;
-    const c = e.image || e.src;
-    if (!c || // We can auto add srcset for cdn.builder.io and shopify
+    const l = e.image || e.src;
+    if (!l || // We can auto add srcset for cdn.builder.io and shopify
     // images, otherwise you can supply this prop manually
-    !(c.match(/builder\.io/) || c.match(/cdn\.shopify\.com/)))
+    !(l.match(/builder\.io/) || l.match(/cdn\.shopify\.com/)))
       return e.srcset;
     if (e.srcset && ((u = e.image) != null && u.includes("builder.io/api/v1/image"))) {
       if (!e.srcset.includes(e.image.split("?")[0]))
-        return console.debug("Removed given srcset"), getSrcSet(c);
+        return console.debug("Removed given srcset"), getSrcSet(l);
     } else if (e.image && !e.srcset)
-      return getSrcSet(c);
-    return getSrcSet(c);
+      return getSrcSet(l);
+    return getSrcSet(l);
   }
   function n() {
-    var s;
-    return (s = t == null ? void 0 : t()) != null && s.match(/builder\.io/) && !e.noWebp ? t().replace(/\?/g, "?format=webp&") : "";
+    var c;
+    return (c = t == null ? void 0 : t()) != null && c.match(/builder\.io/) && !e.noWebp ? t().replace(/\?/g, "?format=webp&") : "";
   }
   function i() {
-    const s = {
+    const c = {
       position: "absolute",
       height: "100%",
       width: "100%",
       left: "0px",
       top: "0px"
     };
-    return e.aspectRatio ? s : void 0;
+    return e.aspectRatio ? c : void 0;
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -1061,7 +1084,7 @@ function Image(e) {
               objectFit: e.backgroundSize || "cover",
               ...i()
             },
-            className: "builder-image" + (e.className ? " " + e.className : "") + " img-497e0136",
+            className: "builder-image" + (e.className ? " " + e.className : "") + " img-dbab4030",
             src: e.image,
             srcSet: t(),
             sizes: e.sizes
@@ -1071,23 +1094,23 @@ function Image(e) {
       e.aspectRatio && !((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length && e.fitContent) ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
         "div",
         {
-          className: "builder-image-sizer div-497e0136",
+          className: "builder-image-sizer div-dbab4030",
           style: {
             paddingTop: e.aspectRatio * 100 + "%"
           }
         }
       ) }) : null,
-      (l = (r = e.builderBlock) == null ? void 0 : r.children) != null && l.length && e.fitContent ? /* @__PURE__ */ jsx(Fragment, { children: e.children }) : null,
-      !e.fitContent && e.children ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { className: "div-497e0136-2", children: e.children }) }) : null
+      (s = (r = e.builderBlock) == null ? void 0 : r.children) != null && s.length && e.fitContent ? /* @__PURE__ */ jsx(Fragment, { children: e.children }) : null,
+      !e.fitContent && e.children ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { className: "div-dbab4030-2", children: e.children }) }) : null
     ] }),
-    /* @__PURE__ */ jsx("style", { children: `.img-497e0136 {
+    /* @__PURE__ */ jsx("style", { children: `.img-dbab4030 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-497e0136 {
+}.div-dbab4030 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-497e0136-2 {
+}.div-dbab4030-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1120,98 +1143,7 @@ function SectionComponent(e) {
     }
   );
 }
-const getVariants = (e) => Object.values((e == null ? void 0 : e.variations) || {}).map((t) => ({
-  ...t,
-  testVariationId: t.id,
-  id: e == null ? void 0 : e.id
-})), checkShouldRunVariants = ({
-  canTrack: e,
-  content: t
-}) => !(!(getVariants(t).length > 0) || !e || isBrowser());
-function bldrAbTest(e, t, n) {
-  var r;
-  function i() {
-    function l(d, x, v) {
-      let C = "";
-      if (v) {
-        const S = /* @__PURE__ */ new Date();
-        S.setTime(S.getTime() + v * 24 * 60 * 60 * 1e3), C = "; expires=" + S.toUTCString();
-      }
-      document.cookie = d + "=" + (x || "") + C + "; path=/; Secure; SameSite=None";
-    }
-    function s(d) {
-      const x = d + "=", v = document.cookie.split(";");
-      for (let C = 0; C < v.length; C++) {
-        let S = v[C];
-        for (; S.charAt(0) === " "; )
-          S = S.substring(1, S.length);
-        if (S.indexOf(x) === 0)
-          return S.substring(x.length, S.length);
-      }
-      return null;
-    }
-    const c = `builder.tests.${e}`, u = s(c), f = t.map((d) => d.id).concat(e);
-    if (u && f.includes(u))
-      return u;
-    let h = 0;
-    const b = Math.random();
-    for (let d = 0; d < t.length; d++) {
-      const x = t[d], v = x.testRatio;
-      if (h += v, b < h)
-        return l(c, x.id), x.id;
-    }
-    return l(c, e), e;
-  }
-  const o = i(), a = (r = document.currentScript) == null ? void 0 : r.previousElementSibling;
-  if (n) {
-    a.remove();
-    const l = document.currentScript;
-    l == null || l.remove();
-  } else {
-    const l = t.concat({
-      id: e
-    }).filter((s) => s.id !== o).map((s) => `.variant-${s.id} {  display: none; }
-        `).join("");
-    a.innerHTML = l;
-  }
-}
-function bldrCntntScrpt(e, t, n) {
-  var s;
-  if (!navigator.cookieEnabled)
-    return;
-  function i(c) {
-    const u = c + "=", f = document.cookie.split(";");
-    for (let h = 0; h < f.length; h++) {
-      let b = f[h];
-      for (; b.charAt(0) === " "; )
-        b = b.substring(1, b.length);
-      if (b.indexOf(u) === 0)
-        return b.substring(u.length, b.length);
-    }
-    return null;
-  }
-  const o = `builder.tests.${t}`, a = i(o), r = (s = document.currentScript) == null ? void 0 : s.parentElement, l = e === t;
-  if (a === e) {
-    if (l)
-      return;
-    r == null || r.removeAttribute("hidden"), r == null || r.removeAttribute("aria-hidden");
-  } else {
-    l && (n ? r == null || r.remove() : (r == null || r.setAttribute("hidden", "true"), r == null || r.setAttribute("aria-hidden", "true")));
-    return;
-  }
-}
-const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydrationTarget = getIsHydrationTarget(TARGET), AB_TEST_FN_NAME = "builderIoAbTest", CONTENT_FN_NAME = "builderIoRenderContent", getScriptString = () => {
-  const e = bldrAbTest.toString().replace(/\s+/g, " "), t = bldrCntntScrpt.toString().replace(/\s+/g, " ");
-  return `
-  window.${AB_TEST_FN_NAME} = ${e}
-  window.${CONTENT_FN_NAME} = ${t}
-  `;
-}, getVariantsScriptString = (e, t) => `
-  window.${AB_TEST_FN_NAME}("${t}",${JSON.stringify(e)}, ${isHydrationTarget})`, getRenderContentScriptString = ({
-  contentId: e,
-  variationId: t
-}) => `
-  window.${CONTENT_FN_NAME}("${t}", "${e}", ${isHydrationTarget})`, componentInfo$a = {
+const componentInfo$a = {
   name: "Core:Button",
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
   defaultStyles: {
@@ -1423,7 +1355,7 @@ const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydr
         });
       }
       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((s, c) => s + c.get("width"), 0) !== 100) && t();
     }
   }, {
     name: "space",
@@ -1446,76 +1378,194 @@ const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydr
     advanced: !0
   }]
 }, componentInfo$8 = {
-  name: "Fragment",
-  static: !0,
-  hidden: !0,
-  canHaveChildren: !0,
-  noWrap: !0
-}, componentInfo$7 = {
-  name: "Image",
+  name: "Custom Code",
   static: !0,
-  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
-  defaultStyles: {
-    position: "relative",
-    minHeight: "20px",
-    minWidth: "20px",
-    overflow: "hidden"
-  },
-  canHaveChildren: !0,
+  requiredPermissions: ["editCode"],
   inputs: [{
-    name: "image",
-    type: "file",
-    bubble: !0,
-    allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
+    name: "code",
+    type: "html",
     required: !0,
-    defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
-    onChange: (e) => {
-      e.delete("srcset"), e.delete("noWebp");
-      function n(r, l = 6e4) {
-        return new Promise((s, c) => {
-          const u = document.createElement("img");
-          let f = !1;
-          u.onload = () => {
-            f = !0, s(u);
-          }, u.addEventListener("error", (h) => {
-            console.warn("Image load failed", h.error), c(h.error);
-          }), u.src = r, setTimeout(() => {
-            f || c(new Error("Image load timed out"));
-          }, l);
-        });
-      }
-      function i(r) {
-        return Math.round(r * 1e3) / 1e3;
-      }
-      const o = e.get("image"), a = e.get("aspectRatio");
-      if (fetch(o).then((r) => r.blob()).then((r) => {
-        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));
-        });
-    }
-  }, {
-    name: "backgroundSize",
-    type: "text",
-    defaultValue: "cover",
-    enum: [{
-      label: "contain",
-      value: "contain",
-      helperText: "The image should never get cropped"
-    }, {
-      label: "cover",
-      value: "cover",
-      helperText: "The image should fill it's box, cropping when needed"
-    }]
+    defaultValue: "<p>Hello there, I am custom HTML code!</p>",
+    code: !0
   }, {
-    name: "backgroundPosition",
-    type: "text",
-    defaultValue: "center",
-    enum: ["center", "top", "left", "right", "bottom", "top left", "top right", "bottom left", "bottom right"]
+    name: "replaceNodes",
+    type: "boolean",
+    helperText: "Preserve server rendered dom nodes",
+    advanced: !0
   }, {
-    name: "altText",
+    name: "scriptsClientOnly",
+    type: "boolean",
+    defaultValue: !1,
+    helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
+    advanced: !0
+  }]
+};
+function CustomCode(e) {
+  const t = useRef(null), [n, i] = useState(() => []), [o, a] = useState(() => []);
+  return useEffect(() => {
+    var s;
+    if (!((s = t.current) != null && s.getElementsByTagName) || typeof window > "u")
+      return;
+    const r = t.current.getElementsByTagName("script");
+    for (let c = 0; c < r.length; c++) {
+      const l = r[c];
+      if (l.src) {
+        if (n.includes(l.src))
+          continue;
+        n.push(l.src);
+        const u = document.createElement("script");
+        u.async = !0, u.src = l.src, document.head.appendChild(u);
+      } else if (!l.type || [
+        "text/javascript",
+        "application/javascript",
+        "application/ecmascript"
+      ].includes(l.type)) {
+        if (o.includes(l.innerText))
+          continue;
+        try {
+          o.push(l.innerText), new Function(l.innerText)();
+        } catch (u) {
+          console.warn("`CustomCode`: Error running script:", u);
+        }
+      }
+    }
+  }, []), /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: t,
+      className: "builder-custom-code" + (e.replaceNodes ? " replace-nodes" : ""),
+      dangerouslySetInnerHTML: { __html: e.code }
+    }
+  );
+}
+const componentInfo$7 = {
+  name: "Embed",
+  static: !0,
+  inputs: [{
+    name: "url",
+    type: "url",
+    required: !0,
+    defaultValue: "",
+    helperText: "e.g. enter a youtube url, google map, etc",
+    onChange: (e) => {
+      const t = e.get("url");
+      if (t)
+        return e.set("content", "Loading..."), fetch(`https://iframe.ly/api/iframely?url=${t}&api_key=ae0e60e78201a3f2b0de4b`).then((i) => i.json()).then((i) => {
+          e.get("url") === t && (i.html ? e.set("content", i.html) : e.set("content", "Invalid url, please try another"));
+        }).catch((i) => {
+          e.set("content", "There was an error embedding this URL, please try again or another URL");
+        });
+      e.delete("content");
+    }
+  }, {
+    name: "content",
+    type: "html",
+    defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
+    hideFromUI: !0
+  }]
+}, SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"], isJsScript = (e) => SCRIPT_MIME_TYPES.includes(e.type);
+function Embed(e) {
+  const t = useRef(null), [n, i] = useState(() => []), [o, a] = useState(() => []), [r, s] = useState(() => !1);
+  function c() {
+    if (!t.current || !t.current.getElementsByTagName)
+      return;
+    const l = t.current.getElementsByTagName("script");
+    for (let u = 0; u < l.length; u++) {
+      const f = l[u];
+      if (f.src && !n.includes(f.src)) {
+        n.push(f.src);
+        const h = document.createElement("script");
+        h.async = !0, h.src = f.src, document.head.appendChild(h);
+      } else if (isJsScript(f) && !o.includes(f.innerText))
+        try {
+          o.push(f.innerText), new Function(f.innerText)();
+        } catch (h) {
+          console.warn("`Embed`: Error running script:", h);
+        }
+    }
+  }
+  return useEffect(() => {
+    t.current && !r && (s(!0), c());
+  }, [t.current, r]), /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "builder-embed",
+      ref: t,
+      dangerouslySetInnerHTML: { __html: e.content }
+    }
+  );
+}
+const componentInfo$6 = {
+  name: "Fragment",
+  static: !0,
+  hidden: !0,
+  canHaveChildren: !0,
+  noWrap: !0
+}, componentInfo$5 = {
+  name: "Image",
+  static: !0,
+  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
+  defaultStyles: {
+    position: "relative",
+    minHeight: "20px",
+    minWidth: "20px",
+    overflow: "hidden"
+  },
+  canHaveChildren: !0,
+  inputs: [{
+    name: "image",
+    type: "file",
+    bubble: !0,
+    allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
+    required: !0,
+    defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
+    onChange: (e) => {
+      e.delete("srcset"), e.delete("noWebp");
+      function n(r, s = 6e4) {
+        return new Promise((c, l) => {
+          const u = document.createElement("img");
+          let f = !1;
+          u.onload = () => {
+            f = !0, c(u);
+          }, u.addEventListener("error", (h) => {
+            console.warn("Image load failed", h.error), l(h.error);
+          }), u.src = r, setTimeout(() => {
+            f || l(new Error("Image load timed out"));
+          }, s);
+        });
+      }
+      function i(r) {
+        return Math.round(r * 1e3) / 1e3;
+      }
+      const o = e.get("image"), a = e.get("aspectRatio");
+      if (fetch(o).then((r) => r.blob()).then((r) => {
+        r.type.includes("svg") && e.set("noWebp", !0);
+      }), o && (!a || a === 0.7041))
+        return n(o).then((r) => {
+          const s = e.get("aspectRatio");
+          e.get("image") === o && (!s || s === 0.7041) && r.width && r.height && (e.set("aspectRatio", i(r.height / r.width)), e.set("height", r.height), e.set("width", r.width));
+        });
+    }
+  }, {
+    name: "backgroundSize",
+    type: "text",
+    defaultValue: "cover",
+    enum: [{
+      label: "contain",
+      value: "contain",
+      helperText: "The image should never get cropped"
+    }, {
+      label: "cover",
+      value: "cover",
+      helperText: "The image should fill it's box, cropping when needed"
+    }]
+  }, {
+    name: "backgroundPosition",
+    type: "text",
+    defaultValue: "center",
+    enum: ["center", "top", "left", "right", "bottom", "top left", "top right", "bottom left", "bottom right"]
+  }, {
+    name: "altText",
     type: "string",
     helperText: "Text to display when the user has images off"
   }, {
@@ -1551,7 +1601,37 @@ const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydr
     advanced: !0,
     defaultValue: 0.7041
   }]
-}, componentInfo$6 = {
+}, componentInfo$4 = {
+  // friendlyName?
+  name: "Raw:Img",
+  hideFromInsertMenu: !0,
+  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
+  inputs: [{
+    name: "image",
+    bubble: !0,
+    type: "file",
+    allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
+    required: !0
+  }],
+  noWrap: !0,
+  static: !0
+};
+function ImgComponent(e) {
+  return /* @__PURE__ */ jsx(
+    "img",
+    {
+      style: {
+        objectFit: e.backgroundSize || "cover",
+        objectPosition: e.backgroundPosition || "center"
+      },
+      alt: e.altText,
+      src: e.imgSrc || e.image,
+      ...e.attributes
+    },
+    isEditing() && e.imgSrc || "default-key"
+  );
+}
+const componentInfo$3 = {
   name: "Core:Section",
   static: !0,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -1590,7 +1670,7 @@ const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydr
       }
     }
   }]
-}, componentInfo$5 = {
+}, componentInfo$2 = {
   name: "Symbol",
   noWrap: !0,
   static: !0,
@@ -1623,7 +1703,7 @@ const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydr
     hideFromUI: !0,
     type: "boolean"
   }]
-}, componentInfo$4 = {
+}, componentInfo$1 = {
   name: "Text",
   static: !0,
   isRSC: !0,
@@ -1655,7 +1735,7 @@ function Text(e) {
     }
   );
 }
-const componentInfo$3 = {
+const componentInfo = {
   name: "Video",
   canHaveChildren: !0,
   defaultStyles: {
@@ -1784,154 +1864,7 @@ function Video(e) {
     }
   );
 }
-const componentInfo$2 = {
-  name: "Embed",
-  static: !0,
-  inputs: [{
-    name: "url",
-    type: "url",
-    required: !0,
-    defaultValue: "",
-    helperText: "e.g. enter a youtube url, google map, etc",
-    onChange: (e) => {
-      const t = e.get("url");
-      if (t)
-        return e.set("content", "Loading..."), fetch(`https://iframe.ly/api/iframely?url=${t}&api_key=ae0e60e78201a3f2b0de4b`).then((i) => i.json()).then((i) => {
-          e.get("url") === t && (i.html ? e.set("content", i.html) : e.set("content", "Invalid url, please try another"));
-        }).catch((i) => {
-          e.set("content", "There was an error embedding this URL, please try again or another URL");
-        });
-      e.delete("content");
-    }
-  }, {
-    name: "content",
-    type: "html",
-    defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
-    hideFromUI: !0
-  }]
-}, SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"], isJsScript = (e) => SCRIPT_MIME_TYPES.includes(e.type);
-function Embed(e) {
-  const t = useRef(null), [n, i] = useState(() => []), [o, a] = useState(() => []), [r, l] = useState(() => !1);
-  function s() {
-    if (!t.current || !t.current.getElementsByTagName)
-      return;
-    const c = t.current.getElementsByTagName("script");
-    for (let u = 0; u < c.length; u++) {
-      const f = c[u];
-      if (f.src && !n.includes(f.src)) {
-        n.push(f.src);
-        const h = document.createElement("script");
-        h.async = !0, h.src = f.src, document.head.appendChild(h);
-      } else if (isJsScript(f) && !o.includes(f.innerText))
-        try {
-          o.push(f.innerText), new Function(f.innerText)();
-        } catch (h) {
-          console.warn("`Embed`: Error running script:", h);
-        }
-    }
-  }
-  return useEffect(() => {
-    t.current && !r && (l(!0), s());
-  }, [t.current, r]), /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: "builder-embed",
-      ref: t,
-      dangerouslySetInnerHTML: { __html: e.content }
-    }
-  );
-}
-function ImgComponent(e) {
-  return /* @__PURE__ */ jsx(
-    "img",
-    {
-      style: {
-        objectFit: e.backgroundSize || "cover",
-        objectPosition: e.backgroundPosition || "center"
-      },
-      alt: e.altText,
-      src: e.imgSrc || e.image,
-      ...e.attributes
-    },
-    isEditing() && e.imgSrc || "default-key"
-  );
-}
-const componentInfo$1 = {
-  // friendlyName?
-  name: "Raw:Img",
-  hideFromInsertMenu: !0,
-  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
-  inputs: [{
-    name: "image",
-    bubble: !0,
-    type: "file",
-    allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
-    required: !0
-  }],
-  noWrap: !0,
-  static: !0
-};
-function CustomCode(e) {
-  const t = useRef(null), [n, i] = useState(() => []), [o, a] = useState(() => []);
-  return useEffect(() => {
-    var l;
-    if (!((l = t.current) != null && l.getElementsByTagName) || typeof window > "u")
-      return;
-    const r = t.current.getElementsByTagName("script");
-    for (let s = 0; s < r.length; s++) {
-      const c = r[s];
-      if (c.src) {
-        if (n.includes(c.src))
-          continue;
-        n.push(c.src);
-        const u = document.createElement("script");
-        u.async = !0, u.src = c.src, document.head.appendChild(u);
-      } else if (!c.type || [
-        "text/javascript",
-        "application/javascript",
-        "application/ecmascript"
-      ].includes(c.type)) {
-        if (o.includes(c.innerText))
-          continue;
-        try {
-          o.push(c.innerText), new Function(c.innerText)();
-        } catch (u) {
-          console.warn("`CustomCode`: Error running script:", u);
-        }
-      }
-    }
-  }, []), /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: t,
-      className: "builder-custom-code" + (e.replaceNodes ? " replace-nodes" : ""),
-      dangerouslySetInnerHTML: { __html: e.code }
-    }
-  );
-}
-const componentInfo = {
-  name: "Custom Code",
-  static: !0,
-  requiredPermissions: ["editCode"],
-  inputs: [{
-    name: "code",
-    type: "html",
-    required: !0,
-    defaultValue: "<p>Hello there, I am custom HTML code!</p>",
-    code: !0
-  }, {
-    name: "replaceNodes",
-    type: "boolean",
-    helperText: "Preserve server rendered dom nodes",
-    advanced: !0
-  }, {
-    name: "scriptsClientOnly",
-    type: "boolean",
-    defaultValue: !1,
-    helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
-    advanced: !0
-  }]
-}, getDefaultRegisteredComponents = () => [{
+const getDefaultRegisteredComponents = () => [{
   component: Button,
   ...componentInfo$a
 }, {
@@ -1939,126 +1872,175 @@ const componentInfo = {
   ...componentInfo$9
 }, {
   component: CustomCode,
-  ...componentInfo
+  ...componentInfo$8
 }, {
   component: Embed,
-  ...componentInfo$2
+  ...componentInfo$7
 }, {
   component: FragmentComponent,
-  ...componentInfo$8
+  ...componentInfo$6
 }, {
   component: Image,
-  ...componentInfo$7
+  ...componentInfo$5
 }, {
   component: ImgComponent,
-  ...componentInfo$1
+  ...componentInfo$4
 }, {
   component: SectionComponent,
-  ...componentInfo$6
+  ...componentInfo$3
 }, {
   component: Symbol$1,
-  ...componentInfo$5
+  ...componentInfo$2
 }, {
   component: Text,
-  ...componentInfo$4
+  ...componentInfo$1
 }, {
   component: Video,
-  ...componentInfo$3
-}], getCssFromFont = (e) => {
-  var a;
-  const t = e.family + (e.kind && !e.kind.includes("#") ? ", " + e.kind : ""), n = t.split(",")[0], i = e.fileUrl ?? ((a = e == null ? void 0 : e.files) == null ? void 0 : a.regular);
-  let o = "";
-  if (i && t && n && (o += `
-@font-face {
-font-family: "${t}";
-src: local("${n}"), url('${i}') format('woff2');
-font-display: fallback;
-font-weight: 400;
-}
-      `.trim()), e.files)
-    for (const r in e.files) {
-      if (!(String(Number(r)) === r))
-        continue;
-      const s = e.files[r];
-      s && s !== i && (o += `
-@font-face {
-font-family: "${t}";
-src: url('${s}') format('woff2');
-font-display: fallback;
-font-weight: ${r};
-}
-        `.trim());
+  ...componentInfo
+}], getVariants = (e) => Object.values((e == null ? void 0 : e.variations) || {}).map((t) => ({
+  ...t,
+  testVariationId: t.id,
+  id: e == null ? void 0 : e.id
+})), checkShouldRunVariants = ({
+  canTrack: e,
+  content: t
+}) => !(!(getVariants(t).length > 0) || !e || isBrowser());
+function bldrAbTest(e, t, n) {
+  var r;
+  function i() {
+    function s(d, x, v) {
+      let C = "";
+      if (v) {
+        const S = /* @__PURE__ */ new Date();
+        S.setTime(S.getTime() + v * 24 * 60 * 60 * 1e3), C = "; expires=" + S.toUTCString();
+      }
+      document.cookie = d + "=" + (x || "") + C + "; path=/; Secure; SameSite=None";
     }
-  return o;
-}, getFontCss = ({
-  customFonts: e
-}) => {
-  var t;
-  return ((t = e == null ? void 0 : e.map((n) => getCssFromFont(n))) == null ? void 0 : t.join(" ")) || "";
-}, getCss = ({
-  cssCode: e,
-  contentId: t
-}) => e ? t ? (e == null ? void 0 : e.replace(/&/g, `div[builder-content-id="${t}"]`)) || "" : e : "";
-function ContentStyles(e) {
-  const [t, n] = useState(
-    () => `
-${getCss({
-      cssCode: e.cssCode,
-      contentId: e.contentId
-    })}
-${getFontCss({
-      customFonts: e.customFonts
-    })}
-
-.builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
-  margin: 0;
+    function c(d) {
+      const x = d + "=", v = document.cookie.split(";");
+      for (let C = 0; C < v.length; C++) {
+        let S = v[C];
+        for (; S.charAt(0) === " "; )
+          S = S.substring(1, S.length);
+        if (S.indexOf(x) === 0)
+          return S.substring(x.length, S.length);
+      }
+      return null;
+    }
+    const l = `builder.tests.${e}`, u = c(l), f = t.map((d) => d.id).concat(e);
+    if (u && f.includes(u))
+      return u;
+    let h = 0;
+    const b = Math.random();
+    for (let d = 0; d < t.length; d++) {
+      const x = t[d], v = x.testRatio;
+      if (h += v, b < h)
+        return s(l, x.id), x.id;
+    }
+    return s(l, e), e;
+  }
+  const o = i(), a = (r = document.currentScript) == null ? void 0 : r.previousElementSibling;
+  if (n) {
+    a.remove();
+    const s = document.currentScript;
+    s == null || s.remove();
+  } else {
+    const s = t.concat({
+      id: e
+    }).filter((c) => c.id !== o).map((c) => `.variant-${c.id} {  display: none; }
+        `).join("");
+    a.innerHTML = s;
+  }
 }
-.builder-text > p, .builder-text > .builder-paragraph {
-  color: inherit;
-  line-height: inherit;
-  letter-spacing: inherit;
-  font-weight: inherit;
-  font-size: inherit;
-  text-align: inherit;
-  font-family: inherit;
+function bldrCntntScrpt(e, t, n) {
+  var c;
+  if (!navigator.cookieEnabled)
+    return;
+  function i(l) {
+    const u = l + "=", f = document.cookie.split(";");
+    for (let h = 0; h < f.length; h++) {
+      let b = f[h];
+      for (; b.charAt(0) === " "; )
+        b = b.substring(1, b.length);
+      if (b.indexOf(u) === 0)
+        return b.substring(u.length, b.length);
+    }
+    return null;
+  }
+  const o = `builder.tests.${t}`, a = i(o), r = (c = document.currentScript) == null ? void 0 : c.parentElement, s = e === t;
+  if (a === e) {
+    if (s)
+      return;
+    r == null || r.removeAttribute("hidden"), r == null || r.removeAttribute("aria-hidden");
+  } else {
+    s && (n ? r == null || r.remove() : (r == null || r.setAttribute("hidden", "true"), r == null || r.setAttribute("aria-hidden", "true")));
+    return;
+  }
 }
-`.trim()
+const getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydrationTarget = getIsHydrationTarget(TARGET), AB_TEST_FN_NAME = "builderIoAbTest", CONTENT_FN_NAME = "builderIoRenderContent", getScriptString = () => {
+  const e = bldrAbTest.toString().replace(/\s+/g, " "), t = bldrCntntScrpt.toString().replace(/\s+/g, " ");
+  return `
+  window.${AB_TEST_FN_NAME} = ${e}
+  window.${CONTENT_FN_NAME} = ${t}
+  `;
+}, getVariantsScriptString = (e, t) => `
+  window.${AB_TEST_FN_NAME}("${t}",${JSON.stringify(e)}, ${isHydrationTarget})`, getRenderContentScriptString = ({
+  contentId: e,
+  variationId: t
+}) => `
+  window.${CONTENT_FN_NAME}("${t}", "${e}", ${isHydrationTarget})`;
+function InlinedScript(e) {
+  return /* @__PURE__ */ jsx(
+    "script",
+    {
+      dangerouslySetInnerHTML: { __html: e.scriptStr },
+      id: e.id
+    }
   );
-  return /* @__PURE__ */ jsx(InlinedStyles, { styles: t });
 }
-const getContextStateInitialValue = ({
-  content: e,
-  data: t,
-  locale: n
+function round(e) {
+  return Math.round(e * 1e3) / 1e3;
+}
+const findParentElement = (e, t, n = !0) => {
+  if (!(e instanceof HTMLElement))
+    return null;
+  let i = n ? e : e.parentElement;
+  do {
+    if (!i)
+      return null;
+    if (t(i))
+      return i;
+  } while (i = i.parentElement);
+  return null;
+}, findBuilderParent = (e) => findParentElement(e, (t) => {
+  const n = t.getAttribute("builder-id") || t.id;
+  return (n == null ? void 0 : n.indexOf("builder-")) === 0;
+}), computeOffset = ({
+  event: e,
+  target: t
 }) => {
-  var a, r, l;
-  const i = {};
-  (r = (a = e == null ? void 0 : e.data) == null ? void 0 : a.inputs) == null || r.forEach((s) => {
-    var c;
-    s.name && s.defaultValue !== void 0 && ((c = e == null ? void 0 : e.data) != null && c.state) && e.data.state[s.name] === void 0 && (i[s.name] = s.defaultValue);
-  });
-  const o = {
-    ...(l = e == null ? void 0 : e.data) == null ? void 0 : l.state,
-    ...t,
-    ...n ? {
-      locale: n
-    } : {}
+  const n = t.getBoundingClientRect(), i = e.clientX - n.left, o = e.clientY - n.top, a = round(i / n.width), r = round(o / n.height);
+  return {
+    x: a,
+    y: r
   };
+}, getInteractionPropertiesForEvent = (e) => {
+  const t = e.target, n = t && findBuilderParent(t), i = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
   return {
-    ...i,
-    ...o
+    targetBuilderElement: i || void 0,
+    metadata: {
+      targetOffset: t ? computeOffset({
+        event: e,
+        target: t
+      }) : void 0,
+      builderTargetOffset: n ? computeOffset({
+        event: e,
+        target: n
+      }) : void 0,
+      builderElementIndex: n && i ? [].slice.call(document.getElementsByClassName(i)).indexOf(n) : void 0
+    }
   };
-}, getContentInitialValue = ({
-  content: e,
-  data: t
-}) => e ? {
-  ...e,
-  data: {
-    ...e == null ? void 0 : e.data,
-    ...t
-  },
-  meta: e == null ? void 0 : e.meta
-} : void 0, SDK_VERSION = "0.7.1-0", registerInsertMenu = () => {
+}, SDK_VERSION = "0.7.1", registerInsertMenu = () => {
   register("insertMenu", {
     name: "_default",
     default: !0,
@@ -2107,17 +2089,17 @@ const setupBrowserForEditing = (e = {}) => {
     if (i != null && i.type)
       switch (i.type) {
         case "builder.evaluate": {
-          const r = i.data.text, l = i.data.arguments || [], s = i.data.id, c = new Function(r);
+          const r = i.data.text, s = i.data.arguments || [], c = i.data.id, l = new Function(r);
           let u, f = null;
           try {
-            u = c.apply(null, l);
+            u = l.apply(null, s);
           } catch (h) {
             f = h;
           }
           f ? (o = window.parent) == null || o.postMessage({
             type: "builder.evaluateError",
             data: {
-              id: s,
+              id: c,
               error: f.message
             }
           }, "*") : u && typeof u.then == "function" ? u.then((h) => {
@@ -2125,7 +2107,7 @@ const setupBrowserForEditing = (e = {}) => {
             (b = window.parent) == null || b.postMessage({
               type: "builder.evaluateResult",
               data: {
-                id: s,
+                id: c,
                 result: h
               }
             }, "*");
@@ -2133,7 +2115,7 @@ const setupBrowserForEditing = (e = {}) => {
             type: "builder.evaluateResult",
             data: {
               result: u,
-              id: s
+              id: c
             }
           }, "*");
           break;
@@ -2141,54 +2123,11 @@ const setupBrowserForEditing = (e = {}) => {
       }
   })));
 };
-function round(e) {
-  return Math.round(e * 1e3) / 1e3;
-}
-const findParentElement = (e, t, n = !0) => {
-  if (!(e instanceof HTMLElement))
-    return null;
-  let i = n ? e : e.parentElement;
-  do {
-    if (!i)
-      return null;
-    if (t(i))
-      return i;
-  } while (i = i.parentElement);
-  return null;
-}, findBuilderParent = (e) => findParentElement(e, (t) => {
-  const n = t.getAttribute("builder-id") || t.id;
-  return (n == null ? void 0 : n.indexOf("builder-")) === 0;
-}), computeOffset = ({
-  event: e,
-  target: t
-}) => {
-  const n = t.getBoundingClientRect(), i = e.clientX - n.left, o = e.clientY - n.top, a = round(i / n.width), r = round(o / n.height);
-  return {
-    x: a,
-    y: r
-  };
-}, getInteractionPropertiesForEvent = (e) => {
-  const t = e.target, n = t && findBuilderParent(t), i = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
-  return {
-    targetBuilderElement: i || void 0,
-    metadata: {
-      targetOffset: t ? computeOffset({
-        event: e,
-        target: t
-      }) : void 0,
-      builderTargetOffset: n ? computeOffset({
-        event: e,
-        target: n
-      }) : void 0,
-      builderElementIndex: n && i ? [].slice.call(document.getElementsByClassName(i)).indexOf(n) : void 0
-    }
-  };
-};
 function EnableEditor(e) {
-  var I, T, R, j, B;
+  var w, T, R, j, B;
   const t = useRef(null), [n, i] = useState(() => 0);
   function o(m) {
-    var y, p, k, w, F;
+    var y, p, k, I, F;
     const g = {
       ...e.builderContextSignal.content,
       ...m,
@@ -2199,7 +2138,7 @@ function EnableEditor(e) {
       meta: {
         ...(p = e.builderContextSignal.content) == null ? void 0 : p.meta,
         ...m == null ? void 0 : m.meta,
-        breakpoints: ((k = m == null ? void 0 : m.meta) == null ? void 0 : k.breakpoints) || ((F = (w = e.builderContextSignal.content) == null ? void 0 : w.meta) == null ? void 0 : F.breakpoints)
+        breakpoints: ((k = m == null ? void 0 : m.meta) == null ? void 0 : k.breakpoints) || ((F = (I = e.builderContextSignal.content) == null ? void 0 : I.meta) == null ? void 0 : F.breakpoints)
       }
     };
     e.setBuilderContextSignal((P) => ({
@@ -2211,14 +2150,14 @@ function EnableEditor(e) {
   const [a, r] = useState(
     () => !1
   );
-  function l(m) {
+  function s(m) {
     var y;
     const { data: g } = m;
     if (g)
       switch (g.type) {
         case "builder.configureSdk": {
-          const p = g.data, { breakpoints: k, contentId: w } = p;
-          if (!w || w !== ((y = e.builderContextSignal.content) == null ? void 0 : y.id))
+          const p = g.data, { breakpoints: k, contentId: I } = p;
+          if (!I || I !== ((y = e.builderContextSignal.content) == null ? void 0 : y.id))
             return;
           k && o({
             meta: {
@@ -2228,13 +2167,13 @@ function EnableEditor(e) {
           break;
         }
         case "builder.contentUpdate": {
-          const p = g.data, k = p.key || p.alias || p.entry || p.modelName, w = p.data;
-          k === e.model && (o(w), i(n + 1));
+          const p = g.data, k = p.key || p.alias || p.entry || p.modelName, I = p.data;
+          k === e.model && (o(I), i(n + 1));
           break;
         }
       }
   }
-  function s() {
+  function c() {
     var g, y;
     const m = (y = (g = e.builderContextSignal.content) == null ? void 0 : g.data) == null ? void 0 : y.jsCode;
     m && evaluate({
@@ -2245,7 +2184,7 @@ function EnableEditor(e) {
       rootSetState: e.builderContextSignal.rootSetState
     });
   }
-  const [c, u] = useState(() => ({})), [f, h] = useState(() => !1);
+  const [l, u] = useState(() => ({})), [f, h] = useState(() => !1);
   function b(m) {
     var g, y;
     if (e.builderContextSignal.content) {
@@ -2276,12 +2215,12 @@ function EnableEditor(e) {
   }
   function x({ url: m, key: g }) {
     fetch$1(m).then((y) => y.json()).then((y) => {
-      var k, w;
+      var k, I;
       const p = {
         ...e.builderContextSignal.rootState,
         [g]: y
       };
-      (w = (k = e.builderContextSignal).rootSetState) == null || w.call(k, p), c[g] = !0;
+      (I = (k = e.builderContextSignal).rootSetState) == null || I.call(k, p), l[g] = !0;
     }).catch((y) => {
       console.error("error fetching dynamic data", m, y);
     });
@@ -2290,10 +2229,10 @@ function EnableEditor(e) {
     var g, y;
     const m = ((y = (g = e.builderContextSignal.content) == null ? void 0 : g.data) == null ? void 0 : y.httpRequests) ?? {};
     Object.entries(m).forEach(([p, k]) => {
-      if (k && (!c[p] || isEditing())) {
-        const w = d(k);
+      if (k && (!l[p] || isEditing())) {
+        const I = d(k);
         x({
-          url: w,
+          url: I,
           key: p
         });
       }
@@ -2315,7 +2254,7 @@ function EnableEditor(e) {
     );
   }
   function S(m) {
-    i(n + 1), window.addEventListener("message", l), registerInsertMenu(), setupBrowserForEditing({
+    i(n + 1), window.addEventListener("message", s), registerInsertMenu(), setupBrowserForEditing({
       ...e.locale ? {
         locale: e.locale
       } : {},
@@ -2344,8 +2283,8 @@ function EnableEditor(e) {
       model: e.model,
       apiKey: e.apiKey,
       apiVersion: e.builderContextSignal.apiVersion
-    }).then((w) => {
-      w && o(w);
+    }).then((I) => {
+      I && o(I);
     });
   }
   return useEffect(() => {
@@ -2376,12 +2315,12 @@ function EnableEditor(e) {
     var m, g;
     if (isBrowser()) {
       if (isEditing() && t.current && t.current.dispatchEvent(new CustomEvent("initeditingbldr")), e.builderContextSignal.content && getDefaultCanTrack(e.canTrack)) {
-        const p = (m = e.builderContextSignal.content) == null ? void 0 : m.testVariationId, k = (g = e.builderContextSignal.content) == null ? void 0 : g.id, w = e.apiKey;
+        const p = (m = e.builderContextSignal.content) == null ? void 0 : m.testVariationId, k = (g = e.builderContextSignal.content) == null ? void 0 : g.id, I = e.apiKey;
         _track({
           type: "impression",
           canTrack: !0,
           contentId: k,
-          apiKey: w,
+          apiKey: I,
           variationId: p !== k ? p : void 0
         });
       }
@@ -2390,21 +2329,21 @@ function EnableEditor(e) {
   }, []), useEffect(() => {
     e.apiKey || logger.error(
       "No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
-    ), s(), v(), C();
+    ), c(), v(), C();
   }, []), useEffect(() => {
     e.content && o(e.content);
   }, [e.content]), useEffect(() => {
   }, [a]), useEffect(() => {
-    s();
+    c();
   }, [
-    (T = (I = e.builderContextSignal.content) == null ? void 0 : I.data) == null ? void 0 : T.jsCode,
+    (T = (w = e.builderContextSignal.content) == null ? void 0 : w.data) == null ? void 0 : T.jsCode,
     e.builderContextSignal.rootState
   ]), useEffect(() => {
     v();
   }, [(j = (R = e.builderContextSignal.content) == null ? void 0 : R.data) == null ? void 0 : j.httpRequests]), useEffect(() => {
     C();
   }, [e.builderContextSignal.rootState]), useEffect(() => () => {
-    isBrowser() && (window.removeEventListener("message", l), window.removeEventListener(
+    isBrowser() && (window.removeEventListener("message", s), window.removeEventListener(
       "builder:component:stateChangeListenerActivated",
       C
     ));
@@ -2425,17 +2364,103 @@ function EnableEditor(e) {
     e.children
   ) }) : null });
 }
-function InlinedScript(e) {
-  return /* @__PURE__ */ jsx(
-    "script",
-    {
-      dangerouslySetInnerHTML: { __html: e.scriptStr },
-      id: e.id
+const getCssFromFont = (e) => {
+  var a;
+  const t = e.family + (e.kind && !e.kind.includes("#") ? ", " + e.kind : ""), n = t.split(",")[0], i = e.fileUrl ?? ((a = e == null ? void 0 : e.files) == null ? void 0 : a.regular);
+  let o = "";
+  if (i && t && n && (o += `
+@font-face {
+font-family: "${t}";
+src: local("${n}"), url('${i}') format('woff2');
+font-display: fallback;
+font-weight: 400;
+}
+      `.trim()), e.files)
+    for (const r in e.files) {
+      if (!(String(Number(r)) === r))
+        continue;
+      const c = e.files[r];
+      c && c !== i && (o += `
+@font-face {
+font-family: "${t}";
+src: url('${c}') format('woff2');
+font-display: fallback;
+font-weight: ${r};
+}
+        `.trim());
     }
+  return o;
+}, getFontCss = ({
+  customFonts: e
+}) => {
+  var t;
+  return ((t = e == null ? void 0 : e.map((n) => getCssFromFont(n))) == null ? void 0 : t.join(" ")) || "";
+}, getCss = ({
+  cssCode: e,
+  contentId: t
+}) => e ? t ? (e == null ? void 0 : e.replace(/&/g, `div[builder-content-id="${t}"]`)) || "" : e : "";
+function ContentStyles(e) {
+  const [t, n] = useState(
+    () => `
+${getCss({
+      cssCode: e.cssCode,
+      contentId: e.contentId
+    })}
+${getFontCss({
+      customFonts: e.customFonts
+    })}
+
+.builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
+  margin: 0;
+}
+.builder-text > p, .builder-text > .builder-paragraph {
+  color: inherit;
+  line-height: inherit;
+  letter-spacing: inherit;
+  font-weight: inherit;
+  font-size: inherit;
+  text-align: inherit;
+  font-family: inherit;
+}
+`.trim()
   );
+  return /* @__PURE__ */ jsx(InlinedStyles, { styles: t });
 }
+const getContextStateInitialValue = ({
+  content: e,
+  data: t,
+  locale: n
+}) => {
+  var a, r, s;
+  const i = {};
+  (r = (a = e == null ? void 0 : e.data) == null ? void 0 : a.inputs) == null || r.forEach((c) => {
+    var l;
+    c.name && c.defaultValue !== void 0 && ((l = e == null ? void 0 : e.data) != null && l.state) && e.data.state[c.name] === void 0 && (i[c.name] = c.defaultValue);
+  });
+  const o = {
+    ...(s = e == null ? void 0 : e.data) == null ? void 0 : s.state,
+    ...t,
+    ...n ? {
+      locale: n
+    } : {}
+  };
+  return {
+    ...i,
+    ...o
+  };
+}, getContentInitialValue = ({
+  content: e,
+  data: t
+}) => e ? {
+  ...e,
+  data: {
+    ...e == null ? void 0 : e.data,
+    ...t
+  },
+  meta: e == null ? void 0 : e.meta
+} : void 0;
 function ContentComponent(e) {
-  var s, c, u, f, h, b, d;
+  var c, l, u, f, h, b, d;
   const [t, n] = useState(
     () => {
       var x, v;
@@ -2448,7 +2473,7 @@ function ContentComponent(e) {
     }
   );
   function i(x) {
-    l((v) => ({
+    s((v) => ({
       ...v,
       rootState: x
     }));
@@ -2473,7 +2498,7 @@ function ContentComponent(e) {
       }),
       {}
     )
-  ), [r, l] = useState(() => ({
+  ), [r, s] = useState(() => ({
     content: getContentInitialValue({
       content: e.content,
       data: e.data
@@ -2526,14 +2551,14 @@ function ContentComponent(e) {
           classNameProp: e.classNameProp,
           showContent: e.showContent,
           builderContextSignal: r,
-          setBuilderContextSignal: l,
+          setBuilderContextSignal: s,
           children: [
             e.isSsrAbTest ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedScript, { scriptStr: t }) }) : null,
             /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
               ContentStyles,
               {
-                contentId: (s = r.content) == null ? void 0 : s.id,
-                cssCode: (u = (c = r.content) == null ? void 0 : c.data) == null ? void 0 : u.cssCode,
+                contentId: (c = r.content) == null ? void 0 : c.id,
+                cssCode: (u = (l = r.content) == null ? void 0 : l.data) == null ? void 0 : u.cssCode,
                 customFonts: (h = (f = r.content) == null ? void 0 : f.data) == null ? void 0 : h.customFonts
               }
             ) }),
@@ -2552,7 +2577,7 @@ function ContentComponent(e) {
   );
 }
 function ContentVariants(e) {
-  var r, l, s;
+  var r, s, c;
   const [t, n] = useState(
     () => checkShouldRunVariants({
       canTrack: getDefaultCanTrack(e.canTrack),
@@ -2560,23 +2585,23 @@ function ContentVariants(e) {
     })
   );
   function i() {
-    var c;
+    var l;
     return getVariantsScriptString(
       getVariants(e.content).map((u) => ({
         id: u.testVariationId,
         testRatio: u.testRatio
       })),
-      ((c = e.content) == null ? void 0 : c.id) || ""
+      ((l = e.content) == null ? void 0 : l.id) || ""
     );
   }
   function o() {
-    return getVariants(e.content).map((c) => `.variant-${c.testVariationId} { display: none; } `).join("");
+    return getVariants(e.content).map((l) => `.variant-${l.testVariationId} { display: none; } `).join("");
   }
   function a() {
-    var c;
+    var l;
     return t ? {
       ...e.content,
-      testVariationId: (c = e.content) == null ? void 0 : c.id
+      testVariationId: (l = e.content) == null ? void 0 : l.id
     } : handleABTestingSync({
       item: e.content,
       canTrack: getDefaultCanTrack(e.canTrack)
@@ -2594,10 +2619,10 @@ function ContentVariants(e) {
         }
       ),
       /* @__PURE__ */ jsx(InlinedScript, { scriptStr: i() }),
-      (l = getVariants(e.content)) == null ? void 0 : l.map((c) => /* @__PURE__ */ jsx(
+      (s = getVariants(e.content)) == null ? void 0 : s.map((l) => /* @__PURE__ */ jsx(
         ContentComponent,
         {
-          content: c,
+          content: l,
           showContent: !1,
           classNameProp: void 0,
           model: e.model,
@@ -2612,14 +2637,14 @@ function ContentVariants(e) {
           enrich: e.enrich,
           isSsrAbTest: t
         },
-        c.testVariationId
+        l.testVariationId
       ))
     ] }) : null,
     /* @__PURE__ */ jsx(
       ContentComponent,
       {
         content: a(),
-        classNameProp: `variant-${(s = e.content) == null ? void 0 : s.id}`,
+        classNameProp: `variant-${(c = e.content) == null ? void 0 : c.id}`,
         showContent: !0,
         model: e.model,
         data: e.data,
@@ -2656,30 +2681,29 @@ const fetchSymbolContent = async ({
     });
 };
 function Symbol$1(e) {
-  var a, r, l;
+  var a, r, s;
   function t() {
-    var s, c;
+    var c, l;
     return [
       e.attributes.className,
       "builder-symbol",
-      (s = e.symbol) != null && s.inline ? "builder-inline-symbol" : void 0,
-      (c = e.symbol) != null && c.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
+      (c = e.symbol) != null && c.inline ? "builder-inline-symbol" : void 0,
+      (l = e.symbol) != null && l.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
     ].filter(Boolean).join(" ");
   }
   const [n, i] = useState(() => {
-    var s;
-    return (s = e.symbol) == null ? void 0 : s.content;
+    var c;
+    return (c = e.symbol) == null ? void 0 : c.content;
   });
   function o() {
     n || fetchSymbolContent({
       symbol: e.symbol,
       builderContextValue: e.builderContext
-    }).then((s) => {
-      s && i(s);
+    }).then((c) => {
+      c && i(c);
     });
   }
   return useEffect(() => {
-    o();
   }, []), useEffect(() => {
     o();
   }, [e.symbol]), /* @__PURE__ */ jsx("div", { ...e.attributes, className: t(), children: /* @__PURE__ */ jsx(
@@ -2695,7 +2719,7 @@ function Symbol$1(e) {
         ...e.builderContext.localState,
         ...(r = n == null ? void 0 : n.data) == null ? void 0 : r.state
       },
-      model: (l = e.symbol) == null ? void 0 : l.model,
+      model: (s = e.symbol) == null ? void 0 : s.model,
       content: n
     }
   ) });