@builder.io/sdk-solid 0.7.1-1 → 0.7.2

package/lib/browser/dev.js

@@ -2,8 +2,8 @@ import { createComponent, spread, mergeProps, insert, effect, setAttribute, clas
 import { createContext, Show, useContext, For, createSignal, onMount, createEffect, on } from 'solid-js';
 import { css } from 'solid-styled-components';
 
-// src/blocks/button/button.jsx
-var _tmpl$ = /* @__PURE__ */ template(`<a role="button">`);
+// src/blocks/button/button.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<a>`);
 var _tmpl$2 = /* @__PURE__ */ template(`<button>`);
 function Button(props) {
   return createComponent(Show, {
@@ -36,7 +36,8 @@ function Button(props) {
         },
         get target() {
           return props.openLinkInNewTab ? "_blank" : void 0;
-        }
+        },
+        "role": "button"
       }), false, true);
       insert(_el$, () => props.text);
       return _el$;
@@ -44,62 +45,33 @@ function Button(props) {
   });
 }
 var button_default = Button;
-
-// src/functions/fast-clone.js
-var fastClone = (obj) => JSON.parse(JSON.stringify(obj));
-
-// src/constants/device-sizes.js
-var SIZES = {
-  small: {
-    min: 320,
-    default: 321,
-    max: 640
-  },
-  medium: {
-    min: 641,
-    default: 642,
-    max: 991
+var builder_context_default = createContext({
+  content: null,
+  context: {},
+  localState: void 0,
+  rootSetState() {
   },
-  large: {
-    min: 990,
-    default: 991,
-    max: 1200
-  }
-};
-var getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
-var getSizesForBreakpoints = ({
-  small,
-  medium
-}) => {
-  const newSizes = fastClone(SIZES);
-  if (!small || !medium) {
-    return newSizes;
-  }
-  const smallMin = Math.floor(small / 2);
-  newSizes.small = {
-    max: small,
-    min: smallMin,
-    default: smallMin + 1
-  };
-  const mediumMin = newSizes.small.max + 1;
-  newSizes.medium = {
-    max: medium,
-    min: mediumMin,
-    default: mediumMin + 1
-  };
-  const largeMin = newSizes.medium.max + 1;
-  newSizes.large = {
-    max: 2e3,
-    min: largeMin,
-    default: largeMin + 1
-  };
-  return newSizes;
-};
+  rootState: {},
+  apiKey: null,
+  apiVersion: void 0,
+  componentInfos: {},
+  inheritedStyles: {}
+});
+var components_context_default = createContext({ registeredComponents: {} });
 
-// src/constants/target.js
-var TARGET = "solid";
+// src/functions/get-block-component-options.ts
+function getBlockComponentOptions(block) {
+  return {
+    ...block.component?.options,
+    ...block.options,
+    /**
+     * Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
+     */
+    builderBlock: block
+  };
+}
 
-// src/helpers/logger.js
+// src/helpers/logger.ts
 var MSG_PREFIX = "[Builder.io]: ";
 var logger = {
   log: (...message) => console.log(MSG_PREFIX, ...message),
@@ -108,22 +80,25 @@ var logger = {
   debug: (...message) => console.debug(MSG_PREFIX, ...message)
 };
 
-// src/functions/is-browser.js
+// src/functions/is-browser.ts
 function isBrowser() {
   return typeof window !== "undefined" && typeof document !== "undefined";
 }
 
-// src/functions/is-iframe.js
+// src/constants/target.ts
+var TARGET = "solid";
+
+// src/functions/is-iframe.ts
 function isIframe() {
   return isBrowser() && window.self !== window.top;
 }
 
-// src/functions/is-editing.js
+// src/functions/is-editing.ts
 function isEditing() {
   return isIframe() && (TARGET === "reactNative" || window.location.search.indexOf("builder.frameEditing=") !== -1);
 }
 
-// src/functions/track/helpers.js
+// src/functions/track/helpers.ts
 var getLocation = () => {
   if (TARGET === "reactNative") {
     return null;
@@ -164,13 +139,13 @@ var getUserAttributes = () => {
   const isTablet = userAgent.match(/Tablet|iPad/i);
   const url = getLocation();
   return {
-    urlPath: url == null ? void 0 : url.pathname,
-    host: (url == null ? void 0 : url.host) || (url == null ? void 0 : url.hostname),
+    urlPath: url?.pathname,
+    host: url?.host || url?.hostname,
     device: isTablet ? "tablet" : isMobile.any() ? "mobile" : "desktop"
   };
 };
 
-// src/functions/evaluate/helpers.js
+// src/functions/evaluate/helpers.ts
 var getFunctionArguments = ({
   builder,
   context,
@@ -180,6 +155,7 @@ var getFunctionArguments = ({
   return Object.entries({
     state,
     Builder: builder,
+    // legacy
     builder,
     context,
     event
@@ -194,12 +170,15 @@ var getBuilderGlobals = () => ({
 var parseCode = (code, {
   isExpression = true
 }) => {
-  const useReturn = isExpression && !(code.includes(";") || code.includes(" return ") || code.trim().startsWith("return "));
+  const useReturn = (
+    // we disable this for cases where we definitely don't want a return
+    isExpression && !(code.includes(";") || code.includes(" return ") || code.trim().startsWith("return "))
+  );
   const useCode = useReturn ? `return (${code});` : code;
   return useCode;
 };
 
-// src/functions/evaluate/browser-runtime/browser.js
+// src/functions/evaluate/browser-runtime/browser.ts
 var runInBrowser = ({
   code,
   builder,
@@ -233,16 +212,16 @@ function flattenState(rootState, localState, rootSetState) {
         throw new Error("Writing to local state is not allowed as it is read-only.");
       }
       rootState[prop] = value;
-      rootSetState == null ? void 0 : rootSetState(rootState);
+      rootSetState?.(rootState);
       return true;
     }
   });
 }
 
-// src/functions/evaluate/choose-eval.js
+// src/functions/evaluate/choose-eval.ts
 var chooseBrowserOrServerEval = (args) => isBrowser() ? runInBrowser(args) : runInBrowser(args);
 
-// src/functions/evaluate/evaluate.js
+// src/functions/evaluate/evaluate.ts
 function evaluate({
   code,
   context,
@@ -277,7 +256,10 @@ function evaluate({
   }
 }
 
-// src/functions/set.js
+// src/functions/fast-clone.ts
+var fastClone = (obj) => JSON.parse(JSON.stringify(obj));
+
+// src/functions/set.ts
 var set = (obj, _path, value) => {
   if (Object(obj) !== obj) {
     return obj;
@@ -287,36 +269,12 @@ var set = (obj, _path, value) => {
   return obj;
 };
 
-// src/functions/transform-block.js
+// src/functions/transform-block.ts
 function transformBlock(block) {
   return block;
 }
 
-// src/functions/get-processed-block.js
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+// src/functions/get-processed-block.ts
 var evaluateBindings = ({
   block,
   context,
@@ -328,10 +286,15 @@ var evaluateBindings = ({
     return block;
   }
   const copy = fastClone(block);
-  const copied = __spreadProps(__spreadValues({}, copy), {
-    properties: __spreadValues({}, copy.properties),
-    actions: __spreadValues({}, copy.actions)
-  });
+  const copied = {
+    ...copy,
+    properties: {
+      ...copy.properties
+    },
+    actions: {
+      ...copy.actions
+    }
+  };
   for (const binding in block.bindings) {
     const expression = block.bindings[binding];
     const value = evaluate({
@@ -367,13 +330,132 @@ function getProcessedBlock({
   }
 }
 
-// src/functions/camel-to-kebab-case.js
+// src/components/block/block.helpers.ts
+var EMPTY_HTML_ELEMENTS = ["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"];
+var isEmptyHtmlElement = (tagName) => {
+  return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.includes(tagName.toLowerCase());
+};
+var getComponent = ({
+  block,
+  context,
+  registeredComponents
+}) => {
+  const componentName = getProcessedBlock({
+    block,
+    localState: context.localState,
+    rootState: context.rootState,
+    rootSetState: context.rootSetState,
+    context: context.context,
+    shouldEvaluateBindings: false
+  }).component?.name;
+  if (!componentName) {
+    return null;
+  }
+  const ref = registeredComponents[componentName];
+  if (!ref) {
+    console.warn(`
+      Could not find a registered component named "${componentName}". 
+      If you registered it, is the file that registered it imported by the file that needs to render it?`);
+    return void 0;
+  } else {
+    return ref;
+  }
+};
+var getRepeatItemData = ({
+  block,
+  context
+}) => {
+  const {
+    repeat,
+    ...blockWithoutRepeat
+  } = block;
+  if (!repeat?.collection) {
+    return void 0;
+  }
+  const itemsArray = evaluate({
+    code: repeat.collection,
+    localState: context.localState,
+    rootState: context.rootState,
+    rootSetState: context.rootSetState,
+    context: context.context
+  });
+  if (!Array.isArray(itemsArray)) {
+    return void 0;
+  }
+  const collectionName = repeat.collection.split(".").pop();
+  const itemNameToUse = repeat.itemName || (collectionName ? collectionName + "Item" : "item");
+  const repeatArray = itemsArray.map((item, index) => ({
+    context: {
+      ...context,
+      localState: {
+        ...context.localState,
+        $index: index,
+        $item: item,
+        [itemNameToUse]: item,
+        [`$${itemNameToUse}Index`]: index
+      }
+    },
+    block: blockWithoutRepeat
+  }));
+  return repeatArray;
+};
+
+// src/constants/device-sizes.ts
+var SIZES = {
+  small: {
+    min: 320,
+    default: 321,
+    max: 640
+  },
+  medium: {
+    min: 641,
+    default: 642,
+    max: 991
+  },
+  large: {
+    min: 990,
+    default: 991,
+    max: 1200
+  }
+};
+var getMaxWidthQueryForSize = (size, sizeValues = SIZES) => `@media (max-width: ${sizeValues[size].max}px)`;
+var getSizesForBreakpoints = ({
+  small,
+  medium
+}) => {
+  const newSizes = fastClone(SIZES);
+  if (!small || !medium) {
+    return newSizes;
+  }
+  const smallMin = Math.floor(small / 2);
+  newSizes.small = {
+    max: small,
+    min: smallMin,
+    default: smallMin + 1
+  };
+  const mediumMin = newSizes.small.max + 1;
+  newSizes.medium = {
+    max: medium,
+    min: mediumMin,
+    default: mediumMin + 1
+  };
+  const largeMin = newSizes.medium.max + 1;
+  newSizes.large = {
+    max: 2e3,
+    // TODO: decide upper limit
+    min: largeMin,
+    default: largeMin + 1
+  };
+  return newSizes;
+};
+
+// src/functions/camel-to-kebab-case.ts
 var camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
 
-// src/helpers/nullable.js
+// src/helpers/nullable.ts
 var checkIsDefined = (maybeT) => maybeT !== null && maybeT !== void 0;
 
-// src/helpers/css.js
+// src/helpers/css.ts
 var convertStyleMapToCSSArray = (style) => {
   const cssProps = Object.entries(style).map(([key, value]) => {
     if (typeof value === "string") {
@@ -419,7 +501,7 @@ function InlinedStyles(props) {
 }
 var inlined_styles_default = InlinedStyles;
 
-// src/components/block/components/block-styles.jsx
+// src/components/block/components/block-styles.tsx
 function BlockStyles(props) {
   function canShowBlock() {
     const processedBlock = getProcessedBlock({
@@ -488,63 +570,50 @@ function BlockStyles(props) {
 }
 var block_styles_default = BlockStyles;
 
-// src/functions/get-block-component-options.js
-var __defProp2 = Object.defineProperty;
-var __defProps2 = Object.defineProperties;
-var __getOwnPropDescs2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
-var __hasOwnProp2 = Object.prototype.hasOwnProperty;
-var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues2 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp2.call(b, prop))
-      __defNormalProp2(a, prop, b[prop]);
-  if (__getOwnPropSymbols2)
-    for (var prop of __getOwnPropSymbols2(b)) {
-      if (__propIsEnum2.call(b, prop))
-        __defNormalProp2(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps2 = (a, b) => __defProps2(a, __getOwnPropDescs2(b));
-function getBlockComponentOptions(block) {
-  var _a;
-  return __spreadProps2(__spreadValues2(__spreadValues2({}, (_a = block.component) == null ? void 0 : _a.options), block.options), {
-    builderBlock: block
-  });
+// src/functions/event-handler-name.ts
+function capitalizeFirstLetter(string) {
+  return string.charAt(0).toUpperCase() + string.slice(1);
 }
+var getEventHandlerName = (key) => `on${capitalizeFirstLetter(key)}`;
 
-// src/functions/sanitize-react-native-block-styles.js
-var __defProp3 = Object.defineProperty;
-var __defProps3 = Object.defineProperties;
-var __getOwnPropDescs3 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols3 = Object.getOwnPropertySymbols;
-var __hasOwnProp3 = Object.prototype.hasOwnProperty;
-var __propIsEnum3 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp3 = (obj, key, value) => key in obj ? __defProp3(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues3 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp3.call(b, prop))
-      __defNormalProp3(a, prop, b[prop]);
-  if (__getOwnPropSymbols3)
-    for (var prop of __getOwnPropSymbols3(b)) {
-      if (__propIsEnum3.call(b, prop))
-        __defNormalProp3(a, prop, b[prop]);
+// src/functions/get-block-actions-handler.ts
+var createEventHandler = (value, options) => (event) => evaluate({
+  code: value,
+  context: options.context,
+  localState: options.localState,
+  rootState: options.rootState,
+  rootSetState: options.rootSetState,
+  event,
+  isExpression: false
+});
+
+// src/functions/get-block-actions.ts
+function getBlockActions(options) {
+  const obj = {};
+  const optionActions = options.block.actions ?? {};
+  for (const key in optionActions) {
+    if (!optionActions.hasOwnProperty(key)) {
+      continue;
     }
-  return a;
-};
-var __spreadProps3 = (a, b) => __defProps3(a, __getOwnPropDescs3(b));
+    const value = optionActions[key];
+    let eventHandlerName = getEventHandlerName(key);
+    if (options.stripPrefix) {
+      switch (TARGET) {
+        case "vue2":
+        case "vue3":
+          eventHandlerName = eventHandlerName.replace("v-on:", "");
+          break;
+        case "svelte":
+          eventHandlerName = eventHandlerName.replace("on:", "");
+          break;
+      }
+    }
+    obj[eventHandlerName] = createEventHandler(value, options);
+  }
+  return obj;
+}
+
+// src/functions/sanitize-react-native-block-styles.ts
 var propertiesThatMustBeNumber = /* @__PURE__ */ new Set(["lineHeight"]);
 var displayValues = /* @__PURE__ */ new Set(["flex", "none"]);
 var SHOW_WARNINGS = false;
@@ -578,46 +647,28 @@ var sanitizeReactNativeBlockStyles = (styles) => {
         const newValue = parseFloat(propertyValue);
         const normalizedValue = normalizeNumber(newValue);
         if (normalizedValue) {
-          return __spreadProps3(__spreadValues3({}, acc), {
+          return {
+            ...acc,
             [key]: normalizedValue
-          });
+          };
         } else {
           return acc;
         }
       } else if (propertyValue === "0") {
-        return __spreadProps3(__spreadValues3({}, acc), {
+        return {
+          ...acc,
           [key]: 0
-        });
+        };
       }
     }
-    return __spreadProps3(__spreadValues3({}, acc), {
+    return {
+      ...acc,
       [key]: propertyValue
-    });
+    };
   }, {});
 };
 
-// src/functions/get-react-native-block-styles.js
-var __defProp4 = Object.defineProperty;
-var __getOwnPropSymbols4 = Object.getOwnPropertySymbols;
-var __hasOwnProp4 = Object.prototype.hasOwnProperty;
-var __propIsEnum4 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp4 = (obj, key, value) => key in obj ? __defProp4(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues4 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp4.call(b, prop))
-      __defNormalProp4(a, prop, b[prop]);
-  if (__getOwnPropSymbols4)
-    for (var prop of __getOwnPropSymbols4(b)) {
-      if (__propIsEnum4.call(b, prop))
-        __defNormalProp4(a, prop, b[prop]);
-    }
-  return a;
-};
+// src/functions/get-react-native-block-styles.ts
 function getReactNativeBlockStyles({
   block,
   context,
@@ -627,41 +678,24 @@ function getReactNativeBlockStyles({
   if (!responsiveStyles) {
     return {};
   }
-  const styles = __spreadValues4(__spreadValues4(__spreadValues4(__spreadValues4(__spreadValues4({}, context.inheritedStyles), responsiveStyles.large || {}), responsiveStyles.medium || {}), responsiveStyles.small || {}), blockStyles);
+  const styles = {
+    // recursively apply inherited styles so that they can be passed down to children `Text` blocks
+    ...context.inheritedStyles,
+    ...responsiveStyles.large || {},
+    ...responsiveStyles.medium || {},
+    ...responsiveStyles.small || {},
+    ...blockStyles
+  };
   const newStyles = sanitizeReactNativeBlockStyles(styles);
   return newStyles;
 }
 
-// src/functions/transform-block-properties.js
+// src/functions/transform-block-properties.ts
 function transformBlockProperties(properties) {
   return properties;
 }
 
-// src/functions/get-block-properties.js
-var __defProp5 = Object.defineProperty;
-var __defProps4 = Object.defineProperties;
-var __getOwnPropDescs4 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols5 = Object.getOwnPropertySymbols;
-var __hasOwnProp5 = Object.prototype.hasOwnProperty;
-var __propIsEnum5 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp5 = (obj, key, value) => key in obj ? __defProp5(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues5 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp5.call(b, prop))
-      __defNormalProp5(a, prop, b[prop]);
-  if (__getOwnPropSymbols5)
-    for (var prop of __getOwnPropSymbols5(b)) {
-      if (__propIsEnum5.call(b, prop))
-        __defNormalProp5(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps4 = (a, b) => __defProps4(a, __getOwnPropDescs4(b));
+// src/functions/get-block-properties.ts
 var extractRelevantRootBlockProperties = (block) => {
   return {
     href: block.href
@@ -671,12 +705,13 @@ function getBlockProperties({
   block,
   context
 }) {
-  var _a;
-  const properties = __spreadProps4(__spreadValues5(__spreadValues5({}, extractRelevantRootBlockProperties(block)), block.properties), {
+  const properties = {
+    ...extractRelevantRootBlockProperties(block),
+    ...block.properties,
     "builder-id": block.id,
     style: block.style ? getStyleAttribute(block.style) : void 0,
-    class: [block.id, "builder-block", block.class, (_a = block.properties) == null ? void 0 : _a.class].filter(Boolean).join(" ")
-  });
+    class: [block.id, "builder-block", block.class, block.properties?.class].filter(Boolean).join(" ")
+  };
   if (TARGET === "reactNative") {
     properties.style = getReactNativeBlockStyles({
       block,
@@ -701,191 +736,52 @@ function getStyleAttribute(style) {
   }
 }
 
-// src/components/block/block.helpers.js
-var __defProp6 = Object.defineProperty;
-var __defProps5 = Object.defineProperties;
-var __getOwnPropDescs5 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols6 = Object.getOwnPropertySymbols;
-var __hasOwnProp6 = Object.prototype.hasOwnProperty;
-var __propIsEnum6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp6 = (obj, key, value) => key in obj ? __defProp6(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues6 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp6.call(b, prop))
-      __defNormalProp6(a, prop, b[prop]);
-  if (__getOwnPropSymbols6)
-    for (var prop of __getOwnPropSymbols6(b)) {
-      if (__propIsEnum6.call(b, prop))
-        __defNormalProp6(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps5 = (a, b) => __defProps5(a, __getOwnPropDescs5(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp6.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols6)
-    for (var prop of __getOwnPropSymbols6(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum6.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var EMPTY_HTML_ELEMENTS = ["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"];
-var isEmptyHtmlElement = (tagName) => {
-  return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.includes(tagName.toLowerCase());
-};
-var getComponent = ({
-  block,
-  context,
-  registeredComponents
-}) => {
-  var _a;
-  const componentName = (_a = getProcessedBlock({
-    block,
-    localState: context.localState,
-    rootState: context.rootState,
-    rootSetState: context.rootSetState,
-    context: context.context,
-    shouldEvaluateBindings: false
-  }).component) == null ? void 0 : _a.name;
-  if (!componentName) {
-    return null;
-  }
-  const ref = registeredComponents[componentName];
-  if (!ref) {
-    console.warn(`
-      Could not find a registered component named "${componentName}". 
-      If you registered it, is the file that registered it imported by the file that needs to render it?`);
-    return void 0;
-  } else {
-    return ref;
-  }
-};
-var getRepeatItemData = ({
-  block,
-  context
-}) => {
-  const _a = block, {
-    repeat
-  } = _a, blockWithoutRepeat = __objRest(_a, ["repeat"]);
-  if (!(repeat == null ? void 0 : repeat.collection)) {
-    return void 0;
-  }
-  const itemsArray = evaluate({
-    code: repeat.collection,
-    localState: context.localState,
-    rootState: context.rootState,
-    rootSetState: context.rootSetState,
-    context: context.context
-  });
-  if (!Array.isArray(itemsArray)) {
-    return void 0;
-  }
-  const collectionName = repeat.collection.split(".").pop();
-  const itemNameToUse = repeat.itemName || (collectionName ? collectionName + "Item" : "item");
-  const repeatArray = itemsArray.map((item, index) => ({
-    context: __spreadProps5(__spreadValues6({}, context), {
-      localState: __spreadProps5(__spreadValues6({}, context.localState), {
-        $index: index,
-        $item: item,
-        [itemNameToUse]: item,
-        [`$${itemNameToUse}Index`]: index
-      })
-    }),
-    block: blockWithoutRepeat
-  }));
-  return repeatArray;
-};
-var stdin_default = createContext({
-  content: null,
-  context: {},
-  localState: void 0,
-  rootSetState() {
-  },
-  rootState: {},
-  apiKey: null,
-  apiVersion: void 0,
-  componentInfos: {},
-  inheritedStyles: {}
-});
-
-// src/components/block/components/repeated-block.jsx
-function RepeatedBlock(props) {
-  const [store, setStore] = createSignal(props.repeatContext);
-  return createComponent(stdin_default.Provider, {
-    get value() {
-      return store();
+// src/components/block/components/block-wrapper.tsx
+function BlockWrapper(props) {
+  return createComponent(Show, {
+    get fallback() {
+      return createComponent(Dynamic, mergeProps(() => getBlockProperties({
+        block: props.block,
+        context: props.context
+      }), () => getBlockActions({
+        block: props.block,
+        rootState: props.context.rootState,
+        rootSetState: props.context.rootSetState,
+        localState: props.context.localState,
+        context: props.context.context,
+        stripPrefix: true
+      }), {
+        get component() {
+          return props.Wrapper;
+        }
+      }));
+    },
+    get when() {
+      return props.hasChildren;
     },
     get children() {
-      return createComponent(block_default, {
-        get block() {
-          return props.block;
-        },
-        get context() {
-          return store();
+      return createComponent(Dynamic, mergeProps(() => getBlockProperties({
+        block: props.block,
+        context: props.context
+      }), () => getBlockActions({
+        block: props.block,
+        rootState: props.context.rootState,
+        rootSetState: props.context.rootSetState,
+        localState: props.context.localState,
+        context: props.context.context,
+        stripPrefix: true
+      }), {
+        get component() {
+          return props.Wrapper;
         },
-        get registeredComponents() {
-          return props.registeredComponents;
+        get children() {
+          return props.children;
         }
-      });
+      }));
     }
   });
 }
-var repeated_block_default = RepeatedBlock;
-
-// src/functions/event-handler-name.js
-function capitalizeFirstLetter(string) {
-  return string.charAt(0).toUpperCase() + string.slice(1);
-}
-var getEventHandlerName = (key) => `on${capitalizeFirstLetter(key)}`;
-
-// src/functions/get-block-actions-handler.js
-var createEventHandler = (value, options) => (event) => evaluate({
-  code: value,
-  context: options.context,
-  localState: options.localState,
-  rootState: options.rootState,
-  rootSetState: options.rootSetState,
-  event,
-  isExpression: false
-});
-
-// src/functions/get-block-actions.js
-function getBlockActions(options) {
-  var _a;
-  const obj = {};
-  const optionActions = (_a = options.block.actions) != null ? _a : {};
-  for (const key in optionActions) {
-    if (!optionActions.hasOwnProperty(key)) {
-      continue;
-    }
-    const value = optionActions[key];
-    let eventHandlerName = getEventHandlerName(key);
-    if (options.stripPrefix) {
-      switch (TARGET) {
-        case "vue2":
-        case "vue3":
-          eventHandlerName = eventHandlerName.replace("v-on:", "");
-          break;
-        case "svelte":
-          eventHandlerName = eventHandlerName.replace("on:", "");
-          break;
-      }
-    }
-    obj[eventHandlerName] = createEventHandler(value, options);
-  }
-  return obj;
-}
-
-// src/components/block/components/interactive-element.jsx
+var block_wrapper_default = BlockWrapper;
 function InteractiveElement(props) {
   return createComponent(Dynamic, mergeProps(() => props.wrapperProps, {
     get attributes() {
@@ -913,28 +809,7 @@ function InteractiveElement(props) {
 }
 var interactive_element_default = InteractiveElement;
 
-// src/components/block/components/component-ref/component-ref.helpers.js
-var __defProp7 = Object.defineProperty;
-var __getOwnPropSymbols7 = Object.getOwnPropertySymbols;
-var __hasOwnProp7 = Object.prototype.hasOwnProperty;
-var __propIsEnum7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp7 = (obj, key, value) => key in obj ? __defProp7(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues7 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp7.call(b, prop))
-      __defNormalProp7(a, prop, b[prop]);
-  if (__getOwnPropSymbols7)
-    for (var prop of __getOwnPropSymbols7(b)) {
-      if (__propIsEnum7.call(b, prop))
-        __defNormalProp7(a, prop, b[prop]);
-    }
-  return a;
-};
+// src/components/block/components/component-ref/component-ref.helpers.ts
 var getWrapperProps = ({
   componentOptions,
   builderBlock,
@@ -950,15 +825,22 @@ var getWrapperProps = ({
     context,
     wrapperProps: componentOptions
   };
-  return isInteractive ? interactiveElementProps : __spreadValues7(__spreadValues7({}, componentOptions), includeBlockProps ? {
-    attributes: getBlockProperties({
-      block: builderBlock,
-      context: contextValue
-    })
-  } : {});
+  return isInteractive ? interactiveElementProps : {
+    ...componentOptions,
+    /**
+     * 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.
+     */
+    ...includeBlockProps ? {
+      attributes: getBlockProperties({
+        block: builderBlock,
+        context: contextValue
+      })
+    } : {}
+  };
 };
 
-// src/components/block/components/component-ref/component-ref.jsx
+// src/components/block/components/component-ref/component-ref.tsx
 function ComponentRef(props) {
   const [Wrapper, setWrapper] = createSignal(props.isInteractive ? interactive_element_default : props.componentRef);
   return createComponent(Show, {
@@ -1021,53 +903,30 @@ function ComponentRef(props) {
   });
 }
 var component_ref_default = ComponentRef;
-function BlockWrapper(props) {
-  return createComponent(Show, {
-    get fallback() {
-      return createComponent(Dynamic, mergeProps(() => getBlockProperties({
-        block: props.block,
-        context: props.context
-      }), () => getBlockActions({
-        block: props.block,
-        rootState: props.context.rootState,
-        rootSetState: props.context.rootSetState,
-        localState: props.context.localState,
-        context: props.context.context,
-        stripPrefix: true
-      }), {
-        get component() {
-          return props.Wrapper;
-        }
-      }));
-    },
-    get when() {
-      return props.hasChildren;
+function RepeatedBlock(props) {
+  const [store, setStore] = createSignal(props.repeatContext);
+  return createComponent(builder_context_default.Provider, {
+    get value() {
+      return store();
     },
     get children() {
-      return createComponent(Dynamic, mergeProps(() => getBlockProperties({
-        block: props.block,
-        context: props.context
-      }), () => getBlockActions({
-        block: props.block,
-        rootState: props.context.rootState,
-        rootSetState: props.context.rootSetState,
-        localState: props.context.localState,
-        context: props.context.context,
-        stripPrefix: true
-      }), {
-        get component() {
-          return props.Wrapper;
+      return createComponent(block_default, {
+        get block() {
+          return props.block;
         },
-        get children() {
-          return props.children;
+        get context() {
+          return store();
+        },
+        get registeredComponents() {
+          return props.registeredComponents;
         }
-      }));
+      });
     }
   });
 }
-var block_wrapper_default = BlockWrapper;
+var repeated_block_default = RepeatedBlock;
 
-// src/components/block/block.jsx
+// src/components/block/block.tsx
 function Block(props) {
   const [childrenContext, setChildrenContext] = createSignal(props.context);
   function blockComponent() {
@@ -1134,7 +993,32 @@ function Block(props) {
     get children() {
       return createComponent(Show, {
         get fallback() {
-          return createComponent(component_ref_default, mergeProps(componentRefProps));
+          return createComponent(component_ref_default, {
+            get componentRef() {
+              return componentRefProps().componentRef;
+            },
+            get componentOptions() {
+              return componentRefProps().componentOptions;
+            },
+            get blockChildren() {
+              return componentRefProps().blockChildren;
+            },
+            get context() {
+              return componentRefProps().context;
+            },
+            get registeredComponents() {
+              return componentRefProps().registeredComponents;
+            },
+            get builderBlock() {
+              return componentRefProps().builderBlock;
+            },
+            get includeBlockProps() {
+              return componentRefProps().includeBlockProps;
+            },
+            get isInteractive() {
+              return componentRefProps().isInteractive;
+            }
+          });
         },
         get when() {
           return !blockComponent()?.noWrap;
@@ -1201,7 +1085,32 @@ function Block(props) {
                 },
                 hasChildren: true,
                 get children() {
-                  return [createComponent(component_ref_default, mergeProps(componentRefProps)), createComponent(For, {
+                  return [createComponent(component_ref_default, {
+                    get componentRef() {
+                      return componentRefProps().componentRef;
+                    },
+                    get componentOptions() {
+                      return componentRefProps().componentOptions;
+                    },
+                    get blockChildren() {
+                      return componentRefProps().blockChildren;
+                    },
+                    get context() {
+                      return componentRefProps().context;
+                    },
+                    get registeredComponents() {
+                      return componentRefProps().registeredComponents;
+                    },
+                    get builderBlock() {
+                      return componentRefProps().builderBlock;
+                    },
+                    get includeBlockProps() {
+                      return componentRefProps().includeBlockProps;
+                    },
+                    get isInteractive() {
+                      return componentRefProps().isInteractive;
+                    }
+                  }), createComponent(For, {
                     get each() {
                       return childrenWithoutParentComponent();
                     },
@@ -1303,12 +1212,11 @@ function BlocksWrapper(props) {
   })();
 }
 var blocks_wrapper_default = BlocksWrapper;
-var stdin_default2 = createContext({ registeredComponents: {} });
 
-// src/components/blocks/blocks.jsx
+// src/components/blocks/blocks.tsx
 function Blocks(props) {
-  const builderContext = useContext(stdin_default);
-  const componentsContext = useContext(stdin_default2);
+  const builderContext = useContext(builder_context_default);
+  const componentsContext = useContext(components_context_default);
   return createComponent(blocks_wrapper_default, {
     get blocks() {
       return props.blocks;
@@ -1378,7 +1286,7 @@ function Blocks(props) {
 }
 var blocks_default = Blocks;
 
-// src/blocks/columns/columns.jsx
+// src/blocks/columns/columns.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<div>`);
 function Columns(props) {
   const [gutterSize, setGutterSize] = createSignal(typeof props.space === "number" ? props.space || 0 : 20);
@@ -1553,7 +1461,7 @@ function FragmentComponent(props) {
 }
 var fragment_default = FragmentComponent;
 
-// src/blocks/image/image.helpers.js
+// src/blocks/image/image.helpers.ts
 function removeProtocol(path) {
   return path.replace(/http(s)?:/, "");
 }
@@ -1566,7 +1474,7 @@ function updateQueryParam(uri = "", key, value) {
   return uri + separator + key + "=" + encodeURIComponent(value);
 }
 function getShopifyImageUrl(src, size) {
-  if (!src || !(src == null ? void 0 : src.match(/cdn\.shopify\.com/)) || !size) {
+  if (!src || !src?.match(/cdn\.shopify\.com/) || !size) {
     return src;
   }
   if (size === "master") {
@@ -1600,9 +1508,9 @@ function getSrcSet(url) {
   return url;
 }
 
-// src/blocks/image/image.jsx
-var _tmpl$7 = /* @__PURE__ */ template(`<source type="image/webp">`);
-var _tmpl$22 = /* @__PURE__ */ template(`<picture><img loading="lazy">`);
+// src/blocks/image/image.tsx
+var _tmpl$7 = /* @__PURE__ */ template(`<source type=image/webp>`);
+var _tmpl$22 = /* @__PURE__ */ template(`<picture><img loading=lazy>`);
 var _tmpl$32 = /* @__PURE__ */ template(`<div>`);
 function Image(props) {
   function srcSetToUse() {
@@ -1756,181 +1664,203 @@ function SectionComponent(props) {
 }
 var section_default = SectionComponent;
 
-// src/components/content-variants/helpers.js
-var __defProp8 = Object.defineProperty;
-var __defProps6 = Object.defineProperties;
-var __getOwnPropDescs6 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols8 = Object.getOwnPropertySymbols;
-var __hasOwnProp8 = Object.prototype.hasOwnProperty;
-var __propIsEnum8 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp8 = (obj, key, value) => key in obj ? __defProp8(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues8 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp8.call(b, prop))
-      __defNormalProp8(a, prop, b[prop]);
-  if (__getOwnPropSymbols8)
-    for (var prop of __getOwnPropSymbols8(b)) {
-      if (__propIsEnum8.call(b, prop))
-        __defNormalProp8(a, prop, b[prop]);
-    }
-  return a;
+// src/helpers/url.ts
+var getTopLevelDomain = (host) => {
+  if (host === "localhost" || host === "127.0.0.1") {
+    return host;
+  }
+  const parts = host.split(".");
+  if (parts.length > 2) {
+    return parts.slice(1).join(".");
+  }
+  return host;
 };
-var __spreadProps6 = (a, b) => __defProps6(a, __getOwnPropDescs6(b));
-var getVariants = (content) => Object.values((content == null ? void 0 : content.variations) || {}).map((variant) => __spreadProps6(__spreadValues8({}, variant), {
-  testVariationId: variant.id,
-  id: content == null ? void 0 : content.id
-}));
-var checkShouldRunVariants = ({
-  canTrack,
-  content
+
+// src/helpers/cookie.ts
+var getCookieSync = ({
+  name,
+  canTrack
 }) => {
-  const hasVariants = getVariants(content).length > 0;
-  if (TARGET === "reactNative")
-    return false;
-  if (!hasVariants)
-    return false;
-  if (!canTrack)
-    return false;
-  if (TARGET === "vue2" || TARGET === "vue3")
-    return true;
-  if (isBrowser())
-    return false;
-  return true;
-};
-function bldrAbTest(contentId, variants, isHydrationTarget2) {
-  var _a;
-  function getAndSetVariantId2() {
-    function setCookie2(name, value, days) {
-      let expires = "";
-      if (days) {
-        const date = /* @__PURE__ */ new Date();
-        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1e3);
-        expires = "; expires=" + date.toUTCString();
-      }
-      document.cookie = name + "=" + (value || "") + expires + "; path=/; Secure; SameSite=None";
-    }
-    function getCookie2(name) {
-      const nameEQ = name + "=";
-      const ca = document.cookie.split(";");
-      for (let i = 0; i < ca.length; i++) {
-        let c = ca[i];
-        while (c.charAt(0) === " ")
-          c = c.substring(1, c.length);
-        if (c.indexOf(nameEQ) === 0)
-          return c.substring(nameEQ.length, c.length);
-      }
-      return null;
+  try {
+    if (!canTrack) {
+      return void 0;
     }
-    const cookieName = `builder.tests.${contentId}`;
-    const variantInCookie = getCookie2(cookieName);
-    const availableIDs = variants.map((vr) => vr.id).concat(contentId);
-    if (variantInCookie && availableIDs.includes(variantInCookie)) {
-      return variantInCookie;
+    return document.cookie.split("; ").find((row) => row.startsWith(`${name}=`))?.split("=")[1];
+  } catch (err) {
+    logger.warn("[COOKIE] GET error: ", err?.message || err);
+    return void 0;
+  }
+};
+var getCookie = async (args) => getCookieSync(args);
+var stringifyCookie = (cookie) => cookie.map(([key, value]) => value ? `${key}=${value}` : key).filter(checkIsDefined).join("; ");
+var SECURE_CONFIG = [["secure", ""], ["SameSite", "None"]];
+var createCookieString = ({
+  name,
+  value,
+  expires
+}) => {
+  const secure = isBrowser() ? location.protocol === "https:" : true;
+  const secureObj = secure ? SECURE_CONFIG : [[]];
+  const expiresObj = expires ? [["expires", expires.toUTCString()]] : [[]];
+  const cookieValue = [[name, value], ...expiresObj, ["path", "/"], ["domain", getTopLevelDomain(window.location.hostname)], ...secureObj];
+  const cookie = stringifyCookie(cookieValue);
+  return cookie;
+};
+var setCookie = async ({
+  name,
+  value,
+  expires,
+  canTrack
+}) => {
+  try {
+    if (!canTrack) {
+      return;
     }
-    let n = 0;
-    const random = Math.random();
-    for (let i = 0; i < variants.length; i++) {
-      const variant = variants[i];
-      const testRatio = variant.testRatio;
-      n += testRatio;
-      if (random < n) {
-        setCookie2(cookieName, variant.id);
-        return variant.id;
-      }
+    const cookie = createCookieString({
+      name,
+      value,
+      expires
+    });
+    document.cookie = cookie;
+  } catch (err) {
+    logger.warn("[COOKIE] SET error: ", err?.message || err);
+  }
+};
+
+// src/helpers/ab-tests.ts
+var BUILDER_STORE_PREFIX = "builder.tests";
+var getContentTestKey = (id) => `${BUILDER_STORE_PREFIX}.${id}`;
+var getContentVariationCookie = ({
+  contentId
+}) => getCookie({
+  name: getContentTestKey(contentId),
+  canTrack: true
+});
+var getContentVariationCookieSync = ({
+  contentId
+}) => getCookieSync({
+  name: getContentTestKey(contentId),
+  canTrack: true
+});
+var setContentVariationCookie = ({
+  contentId,
+  value
+}) => setCookie({
+  name: getContentTestKey(contentId),
+  value,
+  canTrack: true
+});
+var checkIsBuilderContentWithVariations = (item) => checkIsDefined(item.id) && checkIsDefined(item.variations) && Object.keys(item.variations).length > 0;
+var getRandomVariationId = ({
+  id,
+  variations
+}) => {
+  let n = 0;
+  const random = Math.random();
+  for (const id2 in variations) {
+    const testRatio = variations[id2]?.testRatio;
+    n += testRatio;
+    if (random < n) {
+      return id2;
     }
-    setCookie2(cookieName, contentId);
-    return contentId;
   }
-  const winningVariantId = getAndSetVariantId2();
-  const styleEl = (_a = document.currentScript) == null ? void 0 : _a.previousElementSibling;
-  if (isHydrationTarget2) {
-    styleEl.remove();
-    const thisScriptEl = document.currentScript;
-    thisScriptEl == null ? void 0 : thisScriptEl.remove();
+  return id;
+};
+var getAndSetVariantId = (args) => {
+  const randomVariationId = getRandomVariationId(args);
+  setContentVariationCookie({
+    contentId: args.id,
+    value: randomVariationId
+  }).catch((err) => {
+    logger.error("could not store A/B test variation: ", err);
+  });
+  return randomVariationId;
+};
+var getTestFields = ({
+  item,
+  testGroupId
+}) => {
+  const variationValue = item.variations[testGroupId];
+  if (testGroupId === item.id || // handle edge-case where `testGroupId` points to non-existing variation
+  !variationValue) {
+    return {
+      testVariationId: item.id,
+      testVariationName: "Default"
+    };
   } else {
-    const newStyleStr = variants.concat({
-      id: contentId
-    }).filter((variant) => variant.id !== winningVariantId).map((value) => {
-      return `.variant-${value.id} {  display: none; }
-        `;
-    }).join("");
-    styleEl.innerHTML = newStyleStr;
+    return {
+      data: variationValue.data,
+      testVariationId: variationValue.id,
+      testVariationName: variationValue.name || (variationValue.id === item.id ? "Default" : "")
+    };
   }
-}
-function bldrCntntScrpt(variantContentId, defaultContentId, isHydrationTarget2) {
-  var _a;
-  if (!navigator.cookieEnabled) {
-    return;
+};
+var handleABTestingSync = ({
+  item,
+  canTrack
+}) => {
+  if (TARGET === "reactNative")
+    return item;
+  if (!canTrack) {
+    return item;
   }
-  function getCookie2(name) {
-    const nameEQ = name + "=";
-    const ca = document.cookie.split(";");
-    for (let i = 0; i < ca.length; i++) {
-      let c = ca[i];
-      while (c.charAt(0) === " ")
-        c = c.substring(1, c.length);
-      if (c.indexOf(nameEQ) === 0)
-        return c.substring(nameEQ.length, c.length);
-    }
-    return null;
+  if (!item) {
+    return void 0;
   }
-  const cookieName = `builder.tests.${defaultContentId}`;
-  const variantId = getCookie2(cookieName);
-  const parentDiv = (_a = document.currentScript) == null ? void 0 : _a.parentElement;
-  const variantIsDefaultContent = variantContentId === defaultContentId;
-  if (variantId === variantContentId) {
-    if (variantIsDefaultContent) {
-      return;
-    }
-    parentDiv == null ? void 0 : parentDiv.removeAttribute("hidden");
-    parentDiv == null ? void 0 : parentDiv.removeAttribute("aria-hidden");
-  } else {
-    if (variantIsDefaultContent) {
-      if (isHydrationTarget2) {
-        parentDiv == null ? void 0 : parentDiv.remove();
-      } else {
-        parentDiv == null ? void 0 : parentDiv.setAttribute("hidden", "true");
-        parentDiv == null ? void 0 : parentDiv.setAttribute("aria-hidden", "true");
-      }
-    }
-    return;
+  if (!checkIsBuilderContentWithVariations(item)) {
+    return item;
   }
-  return;
-}
-var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
-var isHydrationTarget = getIsHydrationTarget(TARGET);
-var AB_TEST_FN_NAME = "builderIoAbTest";
-var CONTENT_FN_NAME = "builderIoRenderContent";
-var getScriptString = () => {
-  const fnStr = bldrAbTest.toString().replace(/\s+/g, " ");
-  const fnStr2 = bldrCntntScrpt.toString().replace(/\s+/g, " ");
-  return `
-  window.${AB_TEST_FN_NAME} = ${fnStr}
-  window.${CONTENT_FN_NAME} = ${fnStr2}
-  `;
-};
-var getVariantsScriptString = (variants, contentId) => {
-  return `
-  window.${AB_TEST_FN_NAME}("${contentId}",${JSON.stringify(variants)}, ${isHydrationTarget})`;
+  const testGroupId = getContentVariationCookieSync({
+    contentId: item.id
+  }) || getAndSetVariantId({
+    variations: item.variations,
+    id: item.id
+  });
+  const variationValue = getTestFields({
+    item,
+    testGroupId
+  });
+  return {
+    ...item,
+    ...variationValue
+  };
 };
-var getRenderContentScriptString = ({
-  contentId,
-  variationId
+var handleABTesting = async ({
+  item,
+  canTrack
 }) => {
-  return `
-  window.${CONTENT_FN_NAME}("${variationId}", "${contentId}", ${isHydrationTarget})`;
+  if (!canTrack) {
+    return item;
+  }
+  if (!checkIsBuilderContentWithVariations(item)) {
+    return item;
+  }
+  const cookieValue = await getContentVariationCookie({
+    contentId: item.id
+  });
+  const testGroupId = cookieValue || getAndSetVariantId({
+    variations: item.variations,
+    id: item.id
+  });
+  const variationValue = getTestFields({
+    item,
+    testGroupId
+  });
+  return {
+    ...item,
+    ...variationValue
+  };
 };
 
-// src/blocks/button/component-info.js
+// src/helpers/canTrack.ts
+var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
+
+// src/blocks/button/component-info.ts
 var componentInfo = {
   name: "Core:Button",
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
   defaultStyles: {
+    // TODO: make min width more intuitive and set one
     appearance: "none",
     paddingTop: "15px",
     paddingBottom: "15px",
@@ -1961,8 +1891,9 @@ var componentInfo = {
   noWrap: true
 };
 
-// src/blocks/columns/component-info.js
+// src/blocks/columns/component-info.ts
 var componentInfo2 = {
+  // TODO: ways to statically preprocess JSON for references, functions, etc
   name: "Columns",
   isRSC: true,
   inputs: [{
@@ -2180,8 +2111,172 @@ var componentInfo2 = {
   }]
 };
 
-// src/blocks/fragment/component-info.js
+// src/blocks/custom-code/component-info.ts
 var componentInfo3 = {
+  name: "Custom Code",
+  static: true,
+  requiredPermissions: ["editCode"],
+  inputs: [{
+    name: "code",
+    type: "html",
+    required: true,
+    defaultValue: "<p>Hello there, I am custom HTML code!</p>",
+    code: true
+  }, {
+    name: "replaceNodes",
+    type: "boolean",
+    helperText: "Preserve server rendered dom nodes",
+    advanced: true
+  }, {
+    name: "scriptsClientOnly",
+    type: "boolean",
+    defaultValue: false,
+    helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
+    advanced: true
+  }]
+};
+var _tmpl$9 = /* @__PURE__ */ template(`<div>`);
+function CustomCode(props) {
+  const [scriptsInserted, setScriptsInserted] = createSignal([]);
+  const [scriptsRun, setScriptsRun] = createSignal([]);
+  let elementRef;
+  onMount(() => {
+    if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
+      return;
+    }
+    const scripts = elementRef.getElementsByTagName("script");
+    for (let i = 0; i < scripts.length; i++) {
+      const script = scripts[i];
+      if (script.src) {
+        if (scriptsInserted().includes(script.src)) {
+          continue;
+        }
+        scriptsInserted().push(script.src);
+        const newScript = document.createElement("script");
+        newScript.async = true;
+        newScript.src = script.src;
+        document.head.appendChild(newScript);
+      } else if (!script.type || ["text/javascript", "application/javascript", "application/ecmascript"].includes(script.type)) {
+        if (scriptsRun().includes(script.innerText)) {
+          continue;
+        }
+        try {
+          scriptsRun().push(script.innerText);
+          new Function(script.innerText)();
+        } catch (error) {
+          console.warn("`CustomCode`: Error running script:", error);
+        }
+      }
+    }
+  });
+  return (() => {
+    const _el$ = _tmpl$9();
+    const _ref$ = elementRef;
+    typeof _ref$ === "function" ? use(_ref$, _el$) : elementRef = _el$;
+    effect((_p$) => {
+      const _v$ = "builder-custom-code" + (props.replaceNodes ? " replace-nodes" : ""), _v$2 = props.code;
+      _v$ !== _p$._v$ && className(_el$, _p$._v$ = _v$);
+      _v$2 !== _p$._v$2 && (_el$.innerHTML = _p$._v$2 = _v$2);
+      return _p$;
+    }, {
+      _v$: void 0,
+      _v$2: void 0
+    });
+    return _el$;
+  })();
+}
+var custom_code_default = CustomCode;
+
+// src/blocks/embed/component-info.ts
+var componentInfo4 = {
+  name: "Embed",
+  static: true,
+  inputs: [{
+    name: "url",
+    type: "url",
+    required: true,
+    defaultValue: "",
+    helperText: "e.g. enter a youtube url, google map, etc",
+    onChange: (options) => {
+      const url = options.get("url");
+      if (url) {
+        options.set("content", "Loading...");
+        const apiKey = "ae0e60e78201a3f2b0de4b";
+        return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
+          if (options.get("url") === url) {
+            if (data.html) {
+              options.set("content", data.html);
+            } else {
+              options.set("content", "Invalid url, please try another");
+            }
+          }
+        }).catch((_err) => {
+          options.set("content", "There was an error embedding this URL, please try again or another URL");
+        });
+      } else {
+        options.delete("content");
+      }
+    }
+  }, {
+    name: "content",
+    type: "html",
+    defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
+    hideFromUI: true
+  }]
+};
+
+// src/blocks/embed/helpers.ts
+var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
+var isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
+
+// src/blocks/embed/embed.tsx
+var _tmpl$10 = /* @__PURE__ */ template(`<div class=builder-embed>`);
+function Embed(props) {
+  const [scriptsInserted, setScriptsInserted] = createSignal([]);
+  const [scriptsRun, setScriptsRun] = createSignal([]);
+  const [ranInitFn, setRanInitFn] = createSignal(false);
+  function findAndRunScripts() {
+    if (!elem || !elem.getElementsByTagName)
+      return;
+    const scripts = elem.getElementsByTagName("script");
+    for (let i = 0; i < scripts.length; i++) {
+      const script = scripts[i];
+      if (script.src && !scriptsInserted().includes(script.src)) {
+        scriptsInserted().push(script.src);
+        const newScript = document.createElement("script");
+        newScript.async = true;
+        newScript.src = script.src;
+        document.head.appendChild(newScript);
+      } else if (isJsScript(script) && !scriptsRun().includes(script.innerText)) {
+        try {
+          scriptsRun().push(script.innerText);
+          new Function(script.innerText)();
+        } catch (error) {
+          console.warn("`Embed`: Error running script:", error);
+        }
+      }
+    }
+  }
+  let elem;
+  function onUpdateFn_0() {
+    if (elem && !ranInitFn()) {
+      setRanInitFn(true);
+      findAndRunScripts();
+    }
+  }
+  createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
+  return (() => {
+    const _el$ = _tmpl$10();
+    const _ref$ = elem;
+    typeof _ref$ === "function" ? use(_ref$, _el$) : elem = _el$;
+    effect(() => _el$.innerHTML = props.content);
+    return _el$;
+  })();
+}
+var embed_default = Embed;
+
+// src/blocks/fragment/component-info.ts
+var componentInfo5 = {
   name: "Fragment",
   static: true,
   hidden: true,
@@ -2189,8 +2284,8 @@ var componentInfo3 = {
   noWrap: true
 };
 
-// src/blocks/image/component-info.js
-var componentInfo4 = {
+// src/blocks/image/component-info.ts
+var componentInfo6 = {
   name: "Image",
   static: true,
   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",
@@ -2312,8 +2407,50 @@ var componentInfo4 = {
   }]
 };
 
-// src/blocks/section/component-info.js
-var componentInfo5 = {
+// src/blocks/img/component-info.ts
+var componentInfo7 = {
+  // friendlyName?
+  name: "Raw:Img",
+  hideFromInsertMenu: true,
+  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: true,
+    type: "file",
+    allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
+    required: true
+  }],
+  noWrap: true,
+  static: true
+};
+var _tmpl$11 = /* @__PURE__ */ template(`<img>`);
+function ImgComponent(props) {
+  return (() => {
+    const _el$ = _tmpl$11();
+    spread(_el$, mergeProps({
+      get style() {
+        return {
+          "object-fit": props.backgroundSize || "cover",
+          "object-position": props.backgroundPosition || "center"
+        };
+      },
+      get key() {
+        return isEditing() && props.imgSrc || "default-key";
+      },
+      get alt() {
+        return props.altText;
+      },
+      get src() {
+        return props.imgSrc || props.image;
+      }
+    }, {}, () => props.attributes), false, false);
+    return _el$;
+  })();
+}
+var img_default = ImgComponent;
+
+// src/blocks/section/component-info.ts
+var componentInfo8 = {
   name: "Core:Section",
   static: true,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -2354,8 +2491,8 @@ var componentInfo5 = {
   }]
 };
 
-// src/blocks/symbol/component-info.js
-var componentInfo6 = {
+// src/blocks/symbol/component-info.ts
+var componentInfo9 = {
   name: "Symbol",
   noWrap: true,
   static: true,
@@ -2390,8 +2527,8 @@ var componentInfo6 = {
   }]
 };
 
-// src/blocks/text/component-info.js
-var componentInfo7 = {
+// src/blocks/text/component-info.ts
+var componentInfo10 = {
   name: "Text",
   static: true,
   isRSC: true,
@@ -2410,10 +2547,10 @@ var componentInfo7 = {
     textAlign: "center"
   }
 };
-var _tmpl$9 = /* @__PURE__ */ template(`<div class="builder-text">`);
+var _tmpl$12 = /* @__PURE__ */ template(`<div class=builder-text>`);
 function Text(props) {
   return (() => {
-    const _el$ = _tmpl$9();
+    const _el$ = _tmpl$12();
     _el$.style.setProperty("outline", "none");
     effect(() => _el$.innerHTML = props.text?.toString() || "");
     return _el$;
@@ -2421,8 +2558,8 @@ function Text(props) {
 }
 var text_default = Text;
 
-// src/blocks/video/component-info.js
-var componentInfo8 = {
+// src/blocks/video/component-info.ts
+var componentInfo11 = {
   name: "Video",
   canHaveChildren: true,
   defaultStyles: {
@@ -2504,7 +2641,7 @@ var componentInfo8 = {
     advanced: true
   }]
 };
-var _tmpl$10 = /* @__PURE__ */ template(`<video>`);
+var _tmpl$13 = /* @__PURE__ */ template(`<video>`);
 function Video(props) {
   function videoProps() {
     return {
@@ -2532,7 +2669,7 @@ function Video(props) {
     };
   }
   return (() => {
-    const _el$ = _tmpl$10();
+    const _el$ = _tmpl$13();
     spread(_el$, mergeProps(spreadProps, {
       get preload() {
         return props.preload || "metadata";
@@ -2561,294 +2698,43 @@ function Video(props) {
 }
 var video_default = Video;
 
-// src/blocks/embed/component-info.js
-var componentInfo9 = {
-  name: "Embed",
-  static: true,
-  inputs: [{
-    name: "url",
-    type: "url",
-    required: true,
-    defaultValue: "",
-    helperText: "e.g. enter a youtube url, google map, etc",
-    onChange: (options) => {
-      const url = options.get("url");
-      if (url) {
-        options.set("content", "Loading...");
-        const apiKey = "ae0e60e78201a3f2b0de4b";
-        return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
-          if (options.get("url") === url) {
-            if (data.html) {
-              options.set("content", data.html);
-            } else {
-              options.set("content", "Invalid url, please try another");
-            }
-          }
-        }).catch((_err) => {
-          options.set("content", "There was an error embedding this URL, please try again or another URL");
-        });
-      } else {
-        options.delete("content");
-      }
-    }
-  }, {
-    name: "content",
-    type: "html",
-    defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
-    hideFromUI: true
-  }]
-};
-
-// src/blocks/embed/helpers.js
-var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
-var isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
+// src/constants/builder-registered-components.ts
+var getDefaultRegisteredComponents = () => [{
+  component: button_default,
+  ...componentInfo
+}, {
+  component: columns_default,
+  ...componentInfo2
+}, {
+  component: custom_code_default,
+  ...componentInfo3
+}, {
+  component: embed_default,
+  ...componentInfo4
+}, {
+  component: fragment_default,
+  ...componentInfo5
+}, {
+  component: image_default,
+  ...componentInfo6
+}, {
+  component: img_default,
+  ...componentInfo7
+}, {
+  component: section_default,
+  ...componentInfo8
+}, {
+  component: symbol_default,
+  ...componentInfo9
+}, {
+  component: text_default,
+  ...componentInfo10
+}, {
+  component: video_default,
+  ...componentInfo11
+}];
 
-// src/blocks/embed/embed.jsx
-var _tmpl$11 = /* @__PURE__ */ template(`<div class="builder-embed">`);
-function Embed(props) {
-  const [scriptsInserted, setScriptsInserted] = createSignal([]);
-  const [scriptsRun, setScriptsRun] = createSignal([]);
-  const [ranInitFn, setRanInitFn] = createSignal(false);
-  function findAndRunScripts() {
-    if (!elem || !elem.getElementsByTagName)
-      return;
-    const scripts = elem.getElementsByTagName("script");
-    for (let i = 0; i < scripts.length; i++) {
-      const script = scripts[i];
-      if (script.src && !scriptsInserted().includes(script.src)) {
-        scriptsInserted().push(script.src);
-        const newScript = document.createElement("script");
-        newScript.async = true;
-        newScript.src = script.src;
-        document.head.appendChild(newScript);
-      } else if (isJsScript(script) && !scriptsRun().includes(script.innerText)) {
-        try {
-          scriptsRun().push(script.innerText);
-          new Function(script.innerText)();
-        } catch (error) {
-          console.warn("`Embed`: Error running script:", error);
-        }
-      }
-    }
-  }
-  let elem;
-  function onUpdateFn_0() {
-    if (elem && !ranInitFn()) {
-      setRanInitFn(true);
-      findAndRunScripts();
-    }
-  }
-  createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
-  return (() => {
-    const _el$ = _tmpl$11();
-    const _ref$ = elem;
-    typeof _ref$ === "function" ? use(_ref$, _el$) : elem = _el$;
-    effect(() => _el$.innerHTML = props.content);
-    return _el$;
-  })();
-}
-var embed_default = Embed;
-var _tmpl$12 = /* @__PURE__ */ template(`<img>`);
-function ImgComponent(props) {
-  return (() => {
-    const _el$ = _tmpl$12();
-    spread(_el$, mergeProps({
-      get style() {
-        return {
-          "object-fit": props.backgroundSize || "cover",
-          "object-position": props.backgroundPosition || "center"
-        };
-      },
-      get key() {
-        return isEditing() && props.imgSrc || "default-key";
-      },
-      get alt() {
-        return props.altText;
-      },
-      get src() {
-        return props.imgSrc || props.image;
-      }
-    }, {}, () => props.attributes), false, false);
-    return _el$;
-  })();
-}
-var img_default = ImgComponent;
-
-// src/blocks/img/component-info.js
-var componentInfo10 = {
-  name: "Raw:Img",
-  hideFromInsertMenu: true,
-  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: true,
-    type: "file",
-    allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
-    required: true
-  }],
-  noWrap: true,
-  static: true
-};
-var _tmpl$13 = /* @__PURE__ */ template(`<div>`);
-function CustomCode(props) {
-  const [scriptsInserted, setScriptsInserted] = createSignal([]);
-  const [scriptsRun, setScriptsRun] = createSignal([]);
-  let elementRef;
-  onMount(() => {
-    if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
-      return;
-    }
-    const scripts = elementRef.getElementsByTagName("script");
-    for (let i = 0; i < scripts.length; i++) {
-      const script = scripts[i];
-      if (script.src) {
-        if (scriptsInserted().includes(script.src)) {
-          continue;
-        }
-        scriptsInserted().push(script.src);
-        const newScript = document.createElement("script");
-        newScript.async = true;
-        newScript.src = script.src;
-        document.head.appendChild(newScript);
-      } else if (!script.type || ["text/javascript", "application/javascript", "application/ecmascript"].includes(script.type)) {
-        if (scriptsRun().includes(script.innerText)) {
-          continue;
-        }
-        try {
-          scriptsRun().push(script.innerText);
-          new Function(script.innerText)();
-        } catch (error) {
-          console.warn("`CustomCode`: Error running script:", error);
-        }
-      }
-    }
-  });
-  return (() => {
-    const _el$ = _tmpl$13();
-    const _ref$ = elementRef;
-    typeof _ref$ === "function" ? use(_ref$, _el$) : elementRef = _el$;
-    effect((_p$) => {
-      const _v$ = "builder-custom-code" + (props.replaceNodes ? " replace-nodes" : ""), _v$2 = props.code;
-      _v$ !== _p$._v$ && className(_el$, _p$._v$ = _v$);
-      _v$2 !== _p$._v$2 && (_el$.innerHTML = _p$._v$2 = _v$2);
-      return _p$;
-    }, {
-      _v$: void 0,
-      _v$2: void 0
-    });
-    return _el$;
-  })();
-}
-var custom_code_default = CustomCode;
-
-// src/blocks/custom-code/component-info.js
-var componentInfo11 = {
-  name: "Custom Code",
-  static: true,
-  requiredPermissions: ["editCode"],
-  inputs: [{
-    name: "code",
-    type: "html",
-    required: true,
-    defaultValue: "<p>Hello there, I am custom HTML code!</p>",
-    code: true
-  }, {
-    name: "replaceNodes",
-    type: "boolean",
-    helperText: "Preserve server rendered dom nodes",
-    advanced: true
-  }, {
-    name: "scriptsClientOnly",
-    type: "boolean",
-    defaultValue: false,
-    helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
-    advanced: true
-  }]
-};
-
-// src/constants/builder-registered-components.js
-var __defProp9 = Object.defineProperty;
-var __getOwnPropSymbols9 = Object.getOwnPropertySymbols;
-var __hasOwnProp9 = Object.prototype.hasOwnProperty;
-var __propIsEnum9 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp9 = (obj, key, value) => key in obj ? __defProp9(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues9 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp9.call(b, prop))
-      __defNormalProp9(a, prop, b[prop]);
-  if (__getOwnPropSymbols9)
-    for (var prop of __getOwnPropSymbols9(b)) {
-      if (__propIsEnum9.call(b, prop))
-        __defNormalProp9(a, prop, b[prop]);
-    }
-  return a;
-};
-var getDefaultRegisteredComponents = () => [__spreadValues9({
-  component: button_default
-}, componentInfo), __spreadValues9({
-  component: columns_default
-}, componentInfo2), __spreadValues9({
-  component: custom_code_default
-}, componentInfo11), __spreadValues9({
-  component: embed_default
-}, componentInfo9), __spreadValues9({
-  component: fragment_default
-}, componentInfo3), __spreadValues9({
-  component: image_default
-}, componentInfo4), __spreadValues9({
-  component: img_default
-}, componentInfo10), __spreadValues9({
-  component: section_default
-}, componentInfo5), __spreadValues9({
-  component: symbol_default
-}, componentInfo6), __spreadValues9({
-  component: text_default
-}, componentInfo7), __spreadValues9({
-  component: video_default
-}, componentInfo8)];
-
-// src/functions/register-component.js
-var __defProp10 = Object.defineProperty;
-var __defProps7 = Object.defineProperties;
-var __getOwnPropDescs7 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols10 = Object.getOwnPropertySymbols;
-var __hasOwnProp10 = Object.prototype.hasOwnProperty;
-var __propIsEnum10 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp10 = (obj, key, value) => key in obj ? __defProp10(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues10 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp10.call(b, prop))
-      __defNormalProp10(a, prop, b[prop]);
-  if (__getOwnPropSymbols10)
-    for (var prop of __getOwnPropSymbols10(b)) {
-      if (__propIsEnum10.call(b, prop))
-        __defNormalProp10(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps7 = (a, b) => __defProps7(a, __getOwnPropDescs7(b));
-var __objRest2 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp10.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols10)
-    for (var prop of __getOwnPropSymbols10(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum10.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
+// src/functions/register-component.ts
 var components = [];
 var createRegisterComponentMessage = (info) => ({
   type: "builder.registerComponent",
@@ -2860,932 +2746,233 @@ var serializeFn = (fnValue) => {
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
 var serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-var serializeComponentInfo = (_a) => {
-  var _b = _a, {
-    inputs
-  } = _b, info = __objRest2(_b, ["inputs"]);
-  return __spreadProps7(__spreadValues10({}, fastClone(info)), {
-    inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => __spreadProps7(__spreadValues10({}, acc), {
-      [key]: serializeValue(value)
-    }), {}))
-  });
-};
+var serializeComponentInfo = ({
+  inputs,
+  ...info
+}) => ({
+  ...fastClone(info),
+  inputs: inputs?.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
+    ...acc,
+    [key]: serializeValue(value)
+  }), {}))
+});
 
-// src/components/content/components/styles.helpers.js
-var getCssFromFont = (font) => {
-  var _a, _b;
-  const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
-  const name = family.split(",")[0];
-  const url = (_b = font.fileUrl) != null ? _b : (_a = font == null ? void 0 : font.files) == null ? void 0 : _a.regular;
-  let str = "";
-  if (url && family && name) {
-    str += `
-@font-face {
-font-family: "${family}";
-src: local("${name}"), url('${url}') format('woff2');
-font-display: fallback;
-font-weight: 400;
-}
-      `.trim();
-  }
-  if (font.files) {
-    for (const weight in font.files) {
-      const isNumber = String(Number(weight)) === weight;
-      if (!isNumber) {
-        continue;
+// src/components/content-variants/helpers.ts
+var getVariants = (content) => Object.values(content?.variations || {}).map((variant) => ({
+  ...variant,
+  testVariationId: variant.id,
+  id: content?.id
+}));
+var checkShouldRunVariants = ({
+  canTrack,
+  content
+}) => {
+  const hasVariants = getVariants(content).length > 0;
+  if (TARGET === "reactNative")
+    return false;
+  if (!hasVariants)
+    return false;
+  if (!canTrack)
+    return false;
+  if (TARGET === "vue2" || TARGET === "vue3")
+    return true;
+  if (isBrowser())
+    return false;
+  return true;
+};
+function bldrAbTest(contentId, variants, isHydrationTarget2) {
+  function getAndSetVariantId2() {
+    function setCookie2(name, value, days) {
+      let expires = "";
+      if (days) {
+        const date = /* @__PURE__ */ new Date();
+        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1e3);
+        expires = "; expires=" + date.toUTCString();
       }
-      const weightUrl = font.files[weight];
-      if (weightUrl && weightUrl !== url) {
-        str += `
-@font-face {
-font-family: "${family}";
-src: url('${weightUrl}') format('woff2');
-font-display: fallback;
-font-weight: ${weight};
-}
-        `.trim();
+      document.cookie = name + "=" + (value || "") + expires + "; path=/; Secure; SameSite=None";
+    }
+    function getCookie2(name) {
+      const nameEQ = name + "=";
+      const ca = document.cookie.split(";");
+      for (let i = 0; i < ca.length; i++) {
+        let c = ca[i];
+        while (c.charAt(0) === " ")
+          c = c.substring(1, c.length);
+        if (c.indexOf(nameEQ) === 0)
+          return c.substring(nameEQ.length, c.length);
+      }
+      return null;
+    }
+    const cookieName = `builder.tests.${contentId}`;
+    const variantInCookie = getCookie2(cookieName);
+    const availableIDs = variants.map((vr) => vr.id).concat(contentId);
+    if (variantInCookie && availableIDs.includes(variantInCookie)) {
+      return variantInCookie;
+    }
+    let n = 0;
+    const random = Math.random();
+    for (let i = 0; i < variants.length; i++) {
+      const variant = variants[i];
+      const testRatio = variant.testRatio;
+      n += testRatio;
+      if (random < n) {
+        setCookie2(cookieName, variant.id);
+        return variant.id;
       }
     }
+    setCookie2(cookieName, contentId);
+    return contentId;
   }
-  return str;
-};
-var getFontCss = ({
-  customFonts
-}) => {
-  var _a;
-  return ((_a = customFonts == null ? void 0 : customFonts.map((font) => getCssFromFont(font))) == null ? void 0 : _a.join(" ")) || "";
-};
-var getCss = ({
-  cssCode,
-  contentId
-}) => {
-  if (!cssCode) {
-    return "";
-  }
-  if (!contentId) {
-    return cssCode;
-  }
-  return (cssCode == null ? void 0 : cssCode.replace(/&/g, `div[builder-content-id="${contentId}"]`)) || "";
-};
-
-// src/components/content/components/styles.jsx
-function ContentStyles(props) {
-  const [injectedStyles, setInjectedStyles] = createSignal(`
-${getCss({
-    cssCode: props.cssCode,
-    contentId: props.contentId
-  })}
-${getFontCss({
-    customFonts: props.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 createComponent(inlined_styles_default, {
-    get styles() {
-      return injectedStyles();
-    }
-  });
-}
-var styles_default = ContentStyles;
-
-// src/components/content/content.helpers.js
-var __defProp11 = Object.defineProperty;
-var __defProps8 = Object.defineProperties;
-var __getOwnPropDescs8 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols11 = Object.getOwnPropertySymbols;
-var __hasOwnProp11 = Object.prototype.hasOwnProperty;
-var __propIsEnum11 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp11 = (obj, key, value) => key in obj ? __defProp11(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues11 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp11.call(b, prop))
-      __defNormalProp11(a, prop, b[prop]);
-  if (__getOwnPropSymbols11)
-    for (var prop of __getOwnPropSymbols11(b)) {
-      if (__propIsEnum11.call(b, prop))
-        __defNormalProp11(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps8 = (a, b) => __defProps8(a, __getOwnPropDescs8(b));
-var getContextStateInitialValue = ({
-  content,
-  data,
-  locale
-}) => {
-  var _a, _b, _c;
-  const defaultValues = {};
-  (_b = (_a = content == null ? void 0 : content.data) == null ? void 0 : _a.inputs) == null ? void 0 : _b.forEach((input) => {
-    var _a2;
-    if (input.name && input.defaultValue !== void 0 && ((_a2 = content == null ? void 0 : content.data) == null ? void 0 : _a2.state) && content.data.state[input.name] === void 0) {
-      defaultValues[input.name] = input.defaultValue;
-    }
-  });
-  const stateToUse = __spreadValues11(__spreadValues11(__spreadValues11({}, (_c = content == null ? void 0 : content.data) == null ? void 0 : _c.state), data), locale ? {
-    locale
-  } : {});
-  return __spreadValues11(__spreadValues11({}, defaultValues), stateToUse);
-};
-var getContentInitialValue = ({
-  content,
-  data
-}) => {
-  return !content ? void 0 : __spreadProps8(__spreadValues11({}, content), {
-    data: __spreadValues11(__spreadValues11({}, content == null ? void 0 : content.data), data),
-    meta: content == null ? void 0 : content.meta
-  });
-};
-
-// src/functions/get-global-this.js
-function getGlobalThis() {
-  if (typeof globalThis !== "undefined") {
-    return globalThis;
-  }
-  if (typeof window !== "undefined") {
-    return window;
-  }
-  if (typeof global !== "undefined") {
-    return global;
-  }
-  if (typeof self !== "undefined") {
-    return self;
-  }
-  return globalThis;
-}
-
-// src/functions/get-fetch.js
-function getFetch() {
-  const globalFetch = getGlobalThis().fetch;
-  if (typeof globalFetch === "undefined") {
-    console.warn(`Builder SDK could not find a global fetch function. Make sure you have a polyfill for fetch in your project. 
-      For more information, read https://github.com/BuilderIO/this-package-uses-fetch`);
-    throw new Error("Builder SDK could not find a global `fetch` function");
-  }
-  return globalFetch;
-}
-var fetch2 = getFetch();
-
-// src/helpers/url.js
-var getTopLevelDomain = (host) => {
-  if (host === "localhost" || host === "127.0.0.1") {
-    return host;
-  }
-  const parts = host.split(".");
-  if (parts.length > 2) {
-    return parts.slice(1).join(".");
-  }
-  return host;
-};
-
-// src/helpers/cookie.js
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-var getCookieSync = ({
-  name,
-  canTrack
-}) => {
-  var _a;
-  try {
-    if (!canTrack) {
-      return void 0;
-    }
-    return (_a = document.cookie.split("; ").find((row) => row.startsWith(`${name}=`))) == null ? void 0 : _a.split("=")[1];
-  } catch (err) {
-    logger.warn("[COOKIE] GET error: ", (err == null ? void 0 : err.message) || err);
-    return void 0;
-  }
-};
-var getCookie = (args) => __async(void 0, null, function* () {
-  return getCookieSync(args);
-});
-var stringifyCookie = (cookie) => cookie.map(([key, value]) => value ? `${key}=${value}` : key).filter(checkIsDefined).join("; ");
-var SECURE_CONFIG = [["secure", ""], ["SameSite", "None"]];
-var createCookieString = ({
-  name,
-  value,
-  expires
-}) => {
-  const secure = isBrowser() ? location.protocol === "https:" : true;
-  const secureObj = secure ? SECURE_CONFIG : [[]];
-  const expiresObj = expires ? [["expires", expires.toUTCString()]] : [[]];
-  const cookieValue = [[name, value], ...expiresObj, ["path", "/"], ["domain", getTopLevelDomain(window.location.hostname)], ...secureObj];
-  const cookie = stringifyCookie(cookieValue);
-  return cookie;
-};
-var setCookie = (_0) => __async(void 0, [_0], function* ({
-  name,
-  value,
-  expires,
-  canTrack
-}) {
-  try {
-    if (!canTrack) {
-      return;
-    }
-    const cookie = createCookieString({
-      name,
-      value,
-      expires
-    });
-    document.cookie = cookie;
-  } catch (err) {
-    logger.warn("[COOKIE] SET error: ", (err == null ? void 0 : err.message) || err);
-  }
-});
-
-// src/helpers/uuid.js
-function uuidv4() {
-  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
-    const r = Math.random() * 16 | 0, v = c == "x" ? r : r & 3 | 8;
-    return v.toString(16);
-  });
-}
-function uuid() {
-  return uuidv4().replace(/-/g, "");
-}
-
-// src/helpers/sessionId.js
-var __async2 = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-var SESSION_LOCAL_STORAGE_KEY = "builderSessionId";
-var getSessionId = (_0) => __async2(void 0, [_0], function* ({
-  canTrack
-}) {
-  if (!canTrack) {
-    return void 0;
-  }
-  const sessionId = yield getCookie({
-    name: SESSION_LOCAL_STORAGE_KEY,
-    canTrack
-  });
-  if (checkIsDefined(sessionId)) {
-    return sessionId;
-  } else {
-    const newSessionId = createSessionId();
-    setSessionId({
-      id: newSessionId,
-      canTrack
-    });
-    return newSessionId;
-  }
-});
-var createSessionId = () => uuid();
-var setSessionId = ({
-  id,
-  canTrack
-}) => setCookie({
-  name: SESSION_LOCAL_STORAGE_KEY,
-  value: id,
-  canTrack
-});
-
-// src/helpers/localStorage.js
-var getLocalStorage = () => isBrowser() && typeof localStorage !== "undefined" ? localStorage : void 0;
-var getLocalStorageItem = ({
-  key,
-  canTrack
-}) => {
-  var _a;
-  try {
-    if (canTrack) {
-      return (_a = getLocalStorage()) == null ? void 0 : _a.getItem(key);
-    }
-    return void 0;
-  } catch (err) {
-    console.debug("[LocalStorage] GET error: ", err);
-    return void 0;
-  }
-};
-var setLocalStorageItem = ({
-  key,
-  canTrack,
-  value
-}) => {
-  var _a;
-  try {
-    if (canTrack) {
-      (_a = getLocalStorage()) == null ? void 0 : _a.setItem(key, value);
-    }
-  } catch (err) {
-    console.debug("[LocalStorage] SET error: ", err);
-  }
-};
-
-// src/helpers/visitorId.js
-var VISITOR_LOCAL_STORAGE_KEY = "builderVisitorId";
-var getVisitorId = ({
-  canTrack
-}) => {
-  if (!canTrack) {
-    return void 0;
-  }
-  const visitorId = getLocalStorageItem({
-    key: VISITOR_LOCAL_STORAGE_KEY,
-    canTrack
-  });
-  if (checkIsDefined(visitorId)) {
-    return visitorId;
+  const winningVariantId = getAndSetVariantId2();
+  const styleEl = document.currentScript?.previousElementSibling;
+  if (isHydrationTarget2) {
+    styleEl.remove();
+    const thisScriptEl = document.currentScript;
+    thisScriptEl?.remove();
   } else {
-    const newVisitorId = createVisitorId();
-    setVisitorId({
-      id: newVisitorId,
-      canTrack
-    });
-    return newVisitorId;
-  }
-};
-var createVisitorId = () => uuid();
-var setVisitorId = ({
-  id,
-  canTrack
-}) => setLocalStorageItem({
-  key: VISITOR_LOCAL_STORAGE_KEY,
-  value: id,
-  canTrack
-});
-
-// src/functions/track/index.js
-var __defProp12 = Object.defineProperty;
-var __defProps9 = Object.defineProperties;
-var __getOwnPropDescs9 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols12 = Object.getOwnPropertySymbols;
-var __hasOwnProp12 = Object.prototype.hasOwnProperty;
-var __propIsEnum12 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp12 = (obj, key, value) => key in obj ? __defProp12(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues12 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp12.call(b, prop))
-      __defNormalProp12(a, prop, b[prop]);
-  if (__getOwnPropSymbols12)
-    for (var prop of __getOwnPropSymbols12(b)) {
-      if (__propIsEnum12.call(b, prop))
-        __defNormalProp12(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps9 = (a, b) => __defProps9(a, __getOwnPropDescs9(b));
-var __objRest3 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp12.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols12)
-    for (var prop of __getOwnPropSymbols12(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum12.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __async3 = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-var getTrackingEventData = (_0) => __async3(void 0, [_0], function* ({
-  canTrack
-}) {
-  if (!canTrack) {
-    return {
-      visitorId: void 0,
-      sessionId: void 0
-    };
-  }
-  const sessionId = yield getSessionId({
-    canTrack
-  });
-  const visitorId = getVisitorId({
-    canTrack
-  });
-  return {
-    sessionId,
-    visitorId
-  };
-});
-var createEvent = (_a) => __async3(void 0, null, function* () {
-  var _b = _a, {
-    type: eventType,
-    canTrack,
-    apiKey,
-    metadata
-  } = _b, properties = __objRest3(_b, ["type", "canTrack", "apiKey", "metadata"]);
-  return {
-    type: eventType,
-    data: __spreadProps9(__spreadValues12(__spreadProps9(__spreadValues12({}, properties), {
-      metadata: __spreadValues12({
-        url: location.href
-      }, metadata)
-    }), yield getTrackingEventData({
-      canTrack
-    })), {
-      userAttributes: getUserAttributes(),
-      ownerId: apiKey
-    })
-  };
-});
-function _track(eventProps) {
-  return __async3(this, null, function* () {
-    if (!eventProps.apiKey) {
-      logger.error("Missing API key for track call. Please provide your API key.");
-      return;
-    }
-    if (!eventProps.canTrack) {
-      return;
-    }
-    if (isEditing()) {
-      return;
-    }
-    if (!(isBrowser() || TARGET === "reactNative")) {
-      return;
-    }
-    return fetch(`https://cdn.builder.io/api/v1/track`, {
-      method: "POST",
-      body: JSON.stringify({
-        events: [yield createEvent(eventProps)]
-      }),
-      headers: {
-        "content-type": "application/json"
-      },
-      mode: "cors"
-    }).catch((err) => {
-      console.error("Failed to track: ", err);
-    });
-  });
-}
-var track = (args) => _track(__spreadProps9(__spreadValues12({}, args), {
-  canTrack: true
-}));
-
-// src/constants/sdk-version.js
-var SDK_VERSION = "0.7.1-1";
-
-// src/functions/register.js
-var registry = {};
-function register(type, info) {
-  let typeList = registry[type];
-  if (!typeList) {
-    typeList = registry[type] = [];
-  }
-  typeList.push(info);
-  if (isBrowser()) {
-    const message = {
-      type: "builder.register",
-      data: {
-        type,
-        info
-      }
-    };
-    try {
-      parent.postMessage(message, "*");
-      if (parent !== window) {
-        window.postMessage(message, "*");
-      }
-    } catch (err) {
-      console.debug("Could not postmessage", err);
-    }
-  }
-}
-
-// src/scripts/init-editing.js
-var registerInsertMenu = () => {
-  register("insertMenu", {
-    name: "_default",
-    default: true,
-    items: [{
-      name: "Box"
-    }, {
-      name: "Text"
-    }, {
-      name: "Image"
-    }, {
-      name: "Columns"
-    }, ...TARGET === "reactNative" ? [] : [{
-      name: "Core:Section"
-    }, {
-      name: "Core:Button"
-    }, {
-      name: "Embed"
-    }, {
-      name: "Custom Code"
-    }]]
-  });
-};
-var isSetupForEditing = false;
-var setupBrowserForEditing = (options = {}) => {
-  var _a, _b;
-  if (isSetupForEditing) {
-    return;
-  }
-  isSetupForEditing = true;
-  if (isBrowser()) {
-    (_a = window.parent) == null ? void 0 : _a.postMessage({
-      type: "builder.sdkInfo",
-      data: {
-        target: TARGET,
-        version: SDK_VERSION,
-        supportsPatchUpdates: false,
-        supportsAddBlockScoping: true,
-        supportsCustomBreakpoints: true
-      }
-    }, "*");
-    (_b = window.parent) == null ? void 0 : _b.postMessage({
-      type: "builder.updateContent",
-      data: {
-        options
-      }
-    }, "*");
-    window.addEventListener("message", ({
-      data
-    }) => {
-      var _a2, _b2;
-      if (!(data == null ? void 0 : data.type)) {
-        return;
-      }
-      switch (data.type) {
-        case "builder.evaluate": {
-          const text = data.data.text;
-          const args = data.data.arguments || [];
-          const id = data.data.id;
-          const fn = new Function(text);
-          let result;
-          let error = null;
-          try {
-            result = fn.apply(null, args);
-          } catch (err) {
-            error = err;
-          }
-          if (error) {
-            (_a2 = window.parent) == null ? void 0 : _a2.postMessage({
-              type: "builder.evaluateError",
-              data: {
-                id,
-                error: error.message
-              }
-            }, "*");
-          } else {
-            if (result && typeof result.then === "function") {
-              result.then((finalResult) => {
-                var _a3;
-                (_a3 = window.parent) == null ? void 0 : _a3.postMessage({
-                  type: "builder.evaluateResult",
-                  data: {
-                    id,
-                    result: finalResult
-                  }
-                }, "*");
-              }).catch(console.error);
-            } else {
-              (_b2 = window.parent) == null ? void 0 : _b2.postMessage({
-                type: "builder.evaluateResult",
-                data: {
-                  result,
-                  id
-                }
-              }, "*");
-            }
-          }
-          break;
-        }
-      }
-    });
-  }
-};
-
-// src/functions/track/interaction.js
-function round(num) {
-  return Math.round(num * 1e3) / 1e3;
+    const newStyleStr = variants.concat({
+      id: contentId
+    }).filter((variant) => variant.id !== winningVariantId).map((value) => {
+      return `.variant-${value.id} {  display: none; }
+        `;
+    }).join("");
+    styleEl.innerHTML = newStyleStr;
+  }
 }
-var findParentElement = (target, callback, checkElement = true) => {
-  if (!(target instanceof HTMLElement)) {
-    return null;
+function bldrCntntScrpt(variantContentId, defaultContentId, isHydrationTarget2) {
+  if (!navigator.cookieEnabled) {
+    return;
   }
-  let parent2 = checkElement ? target : target.parentElement;
-  do {
-    if (!parent2) {
-      return null;
-    }
-    const matches = callback(parent2);
-    if (matches) {
-      return parent2;
-    }
-  } while (parent2 = parent2.parentElement);
-  return null;
-};
-var findBuilderParent = (target) => findParentElement(target, (el) => {
-  const id = el.getAttribute("builder-id") || el.id;
-  return Boolean((id == null ? void 0 : id.indexOf("builder-")) === 0);
-});
-var computeOffset = ({
-  event,
-  target
-}) => {
-  const targetRect = target.getBoundingClientRect();
-  const xOffset = event.clientX - targetRect.left;
-  const yOffset = event.clientY - targetRect.top;
-  const xRatio = round(xOffset / targetRect.width);
-  const yRatio = round(yOffset / targetRect.height);
-  return {
-    x: xRatio,
-    y: yRatio
-  };
-};
-var getInteractionPropertiesForEvent = (event) => {
-  const target = event.target;
-  const targetBuilderElement = target && findBuilderParent(target);
-  const builderId = (targetBuilderElement == null ? void 0 : targetBuilderElement.getAttribute("builder-id")) || (targetBuilderElement == null ? void 0 : targetBuilderElement.id);
-  return {
-    targetBuilderElement: builderId || void 0,
-    metadata: {
-      targetOffset: target ? computeOffset({
-        event,
-        target
-      }) : void 0,
-      builderTargetOffset: targetBuilderElement ? computeOffset({
-        event,
-        target: targetBuilderElement
-      }) : void 0,
-      builderElementIndex: targetBuilderElement && builderId ? [].slice.call(document.getElementsByClassName(builderId)).indexOf(targetBuilderElement) : void 0
+  function getCookie2(name) {
+    const nameEQ = name + "=";
+    const ca = document.cookie.split(";");
+    for (let i = 0; i < ca.length; i++) {
+      let c = ca[i];
+      while (c.charAt(0) === " ")
+        c = c.substring(1, c.length);
+      if (c.indexOf(nameEQ) === 0)
+        return c.substring(nameEQ.length, c.length);
     }
-  };
-};
-
-// src/helpers/ab-tests.js
-var __defProp13 = Object.defineProperty;
-var __getOwnPropSymbols13 = Object.getOwnPropertySymbols;
-var __hasOwnProp13 = Object.prototype.hasOwnProperty;
-var __propIsEnum13 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp13 = (obj, key, value) => key in obj ? __defProp13(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues13 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp13.call(b, prop))
-      __defNormalProp13(a, prop, b[prop]);
-  if (__getOwnPropSymbols13)
-    for (var prop of __getOwnPropSymbols13(b)) {
-      if (__propIsEnum13.call(b, prop))
-        __defNormalProp13(a, prop, b[prop]);
+    return null;
+  }
+  const cookieName = `builder.tests.${defaultContentId}`;
+  const variantId = getCookie2(cookieName);
+  const parentDiv = document.currentScript?.parentElement;
+  const variantIsDefaultContent = variantContentId === defaultContentId;
+  if (variantId === variantContentId) {
+    if (variantIsDefaultContent) {
+      return;
     }
-  return a;
-};
-var __async4 = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
+    parentDiv?.removeAttribute("hidden");
+    parentDiv?.removeAttribute("aria-hidden");
+  } else {
+    if (variantIsDefaultContent) {
+      if (isHydrationTarget2) {
+        parentDiv?.remove();
+      } else {
+        parentDiv?.setAttribute("hidden", "true");
+        parentDiv?.setAttribute("aria-hidden", "true");
       }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-var BUILDER_STORE_PREFIX = "builder.tests";
-var getContentTestKey = (id) => `${BUILDER_STORE_PREFIX}.${id}`;
-var getContentVariationCookie = ({
-  contentId
-}) => getCookie({
-  name: getContentTestKey(contentId),
-  canTrack: true
-});
-var getContentVariationCookieSync = ({
-  contentId
-}) => getCookieSync({
-  name: getContentTestKey(contentId),
-  canTrack: true
-});
-var setContentVariationCookie = ({
-  contentId,
-  value
-}) => setCookie({
-  name: getContentTestKey(contentId),
-  value,
-  canTrack: true
-});
-var checkIsBuilderContentWithVariations = (item) => checkIsDefined(item.id) && checkIsDefined(item.variations) && Object.keys(item.variations).length > 0;
-var getRandomVariationId = ({
-  id,
-  variations
-}) => {
-  var _a;
-  let n = 0;
-  const random = Math.random();
-  for (const id2 in variations) {
-    const testRatio = (_a = variations[id2]) == null ? void 0 : _a.testRatio;
-    n += testRatio;
-    if (random < n) {
-      return id2;
     }
+    return;
   }
-  return id;
+  return;
+}
+var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
+var isHydrationTarget = getIsHydrationTarget(TARGET);
+var AB_TEST_FN_NAME = "builderIoAbTest";
+var CONTENT_FN_NAME = "builderIoRenderContent";
+var getScriptString = () => {
+  const fnStr = bldrAbTest.toString().replace(/\s+/g, " ");
+  const fnStr2 = bldrCntntScrpt.toString().replace(/\s+/g, " ");
+  return `
+  window.${AB_TEST_FN_NAME} = ${fnStr}
+  window.${CONTENT_FN_NAME} = ${fnStr2}
+  `;
 };
-var getAndSetVariantId = (args) => {
-  const randomVariationId = getRandomVariationId(args);
-  setContentVariationCookie({
-    contentId: args.id,
-    value: randomVariationId
-  }).catch((err) => {
-    logger.error("could not store A/B test variation: ", err);
-  });
-  return randomVariationId;
+var getVariantsScriptString = (variants, contentId) => {
+  return `
+  window.${AB_TEST_FN_NAME}("${contentId}",${JSON.stringify(variants)}, ${isHydrationTarget})`;
 };
-var getTestFields = ({
-  item,
-  testGroupId
+var getRenderContentScriptString = ({
+  contentId,
+  variationId
 }) => {
-  const variationValue = item.variations[testGroupId];
-  if (testGroupId === item.id || !variationValue) {
-    return {
-      testVariationId: item.id,
-      testVariationName: "Default"
-    };
-  } else {
-    return {
-      data: variationValue.data,
-      testVariationId: variationValue.id,
-      testVariationName: variationValue.name || (variationValue.id === item.id ? "Default" : "")
-    };
-  }
+  return `
+  window.${CONTENT_FN_NAME}("${variationId}", "${contentId}", ${isHydrationTarget})`;
 };
-var handleABTestingSync = ({
-  item,
-  canTrack
-}) => {
-  if (TARGET === "reactNative")
-    return item;
-  if (!canTrack) {
-    return item;
-  }
-  if (!item) {
-    return void 0;
+var _tmpl$14 = /* @__PURE__ */ template(`<script>`);
+function InlinedScript(props) {
+  return (() => {
+    const _el$ = _tmpl$14();
+    effect((_p$) => {
+      const _v$ = props.scriptStr, _v$2 = props.id;
+      _v$ !== _p$._v$ && (_el$.innerHTML = _p$._v$ = _v$);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "id", _p$._v$2 = _v$2);
+      return _p$;
+    }, {
+      _v$: void 0,
+      _v$2: void 0
+    });
+    return _el$;
+  })();
+}
+var inlined_script_default = InlinedScript;
+
+// src/helpers/preview-lru-cache/get.ts
+function getPreviewContent(_searchParams) {
+  return void 0;
+}
+
+// src/functions/get-global-this.ts
+function getGlobalThis() {
+  if (typeof globalThis !== "undefined") {
+    return globalThis;
   }
-  if (!checkIsBuilderContentWithVariations(item)) {
-    return item;
+  if (typeof window !== "undefined") {
+    return window;
   }
-  const testGroupId = getContentVariationCookieSync({
-    contentId: item.id
-  }) || getAndSetVariantId({
-    variations: item.variations,
-    id: item.id
-  });
-  const variationValue = getTestFields({
-    item,
-    testGroupId
-  });
-  return __spreadValues13(__spreadValues13({}, item), variationValue);
-};
-var handleABTesting = (_0) => __async4(void 0, [_0], function* ({
-  item,
-  canTrack
-}) {
-  if (!canTrack) {
-    return item;
+  if (typeof global !== "undefined") {
+    return global;
   }
-  if (!checkIsBuilderContentWithVariations(item)) {
-    return item;
+  if (typeof self !== "undefined") {
+    return self;
   }
-  const cookieValue = yield getContentVariationCookie({
-    contentId: item.id
-  });
-  const testGroupId = cookieValue || getAndSetVariantId({
-    variations: item.variations,
-    id: item.id
-  });
-  const variationValue = getTestFields({
-    item,
-    testGroupId
-  });
-  return __spreadValues13(__spreadValues13({}, item), variationValue);
-});
-
-// src/helpers/canTrack.js
-var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
+  return globalThis;
+}
 
-// src/helpers/preview-lru-cache/get.js
-function getPreviewContent(_searchParams) {
-  return void 0;
+// src/functions/get-fetch.ts
+function getFetch() {
+  const globalFetch = getGlobalThis().fetch;
+  if (typeof globalFetch === "undefined") {
+    console.warn(`Builder SDK could not find a global fetch function. Make sure you have a polyfill for fetch in your project. 
+      For more information, read https://github.com/BuilderIO/this-package-uses-fetch`);
+    throw new Error("Builder SDK could not find a global `fetch` function");
+  }
+  return globalFetch;
 }
+var fetch2 = getFetch();
 
-// src/helpers/flatten.js
-var __defProp14 = Object.defineProperty;
-var __defProps10 = Object.defineProperties;
-var __getOwnPropDescs10 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols14 = Object.getOwnPropertySymbols;
-var __hasOwnProp14 = Object.prototype.hasOwnProperty;
-var __propIsEnum14 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp14 = (obj, key, value) => key in obj ? __defProp14(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues14 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp14.call(b, prop))
-      __defNormalProp14(a, prop, b[prop]);
-  if (__getOwnPropSymbols14)
-    for (var prop of __getOwnPropSymbols14(b)) {
-      if (__propIsEnum14.call(b, prop))
-        __defNormalProp14(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps10 = (a, b) => __defProps10(a, __getOwnPropDescs10(b));
+// src/helpers/flatten.ts
 function flatten(object, path = null, separator = ".") {
   return Object.keys(object).reduce((acc, key) => {
     const value = object[key];
     const newPath = [path, key].filter(Boolean).join(separator);
     const isObject = [typeof value === "object", value !== null, !(Array.isArray(value) && value.length === 0)].every(Boolean);
-    return isObject ? __spreadValues14(__spreadValues14({}, acc), flatten(value, newPath, separator)) : __spreadProps10(__spreadValues14({}, acc), {
+    return isObject ? {
+      ...acc,
+      ...flatten(value, newPath, separator)
+    } : {
+      ...acc,
       [newPath]: value
-    });
+    };
   }, {});
 }
 
-// src/functions/get-builder-search-params/index.js
+// src/types/api-version.ts
+var DEFAULT_API_VERSION = "v3";
+
+// src/functions/get-builder-search-params/index.ts
 var BUILDER_SEARCHPARAMS_PREFIX = "builder.";
 var BUILDER_OPTIONS_PREFIX = "options.";
 var convertSearchParamsToQueryObject = (searchParams) => {
@@ -3818,31 +3005,7 @@ var getBuilderSearchParamsFromWindow = () => {
 };
 var normalizeSearchParams = (searchParams) => searchParams instanceof URLSearchParams ? convertSearchParamsToQueryObject(searchParams) : searchParams;
 
-// src/types/api-version.js
-var DEFAULT_API_VERSION = "v3";
-
-// src/functions/get-content/generate-content-url.js
-var __defProp15 = Object.defineProperty;
-var __getOwnPropSymbols15 = Object.getOwnPropertySymbols;
-var __hasOwnProp15 = Object.prototype.hasOwnProperty;
-var __propIsEnum15 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp15 = (obj, key, value) => key in obj ? __defProp15(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues15 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp15.call(b, prop))
-      __defNormalProp15(a, prop, b[prop]);
-  if (__getOwnPropSymbols15)
-    for (var prop of __getOwnPropSymbols15(b)) {
-      if (__propIsEnum15.call(b, prop))
-        __defNormalProp15(a, prop, b[prop]);
-    }
-  return a;
-};
+// src/functions/get-content/generate-content-url.ts
 var isPositiveNumber = (thing) => typeof thing === "number" && !isNaN(thing) && thing >= 0;
 var generateContentUrl = (options) => {
   let {
@@ -3900,7 +3063,10 @@ var generateContentUrl = (options) => {
       url.searchParams.set(key, JSON.stringify(flattened2[key]));
     }
   }
-  const queryOptions = __spreadValues15(__spreadValues15({}, getBuilderSearchParamsFromWindow()), normalizeSearchParams(options.options || {}));
+  const queryOptions = {
+    ...getBuilderSearchParamsFromWindow(),
+    ...normalizeSearchParams(options.options || {})
+  };
   const flattened = flatten(queryOptions);
   for (const key in flattened) {
     url.searchParams.set(key, String(flattened[key]));
@@ -3919,71 +3085,26 @@ var generateContentUrl = (options) => {
   return url;
 };
 
-// src/functions/get-content/index.js
-var __defProp16 = Object.defineProperty;
-var __defProps11 = Object.defineProperties;
-var __getOwnPropDescs11 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols16 = Object.getOwnPropertySymbols;
-var __hasOwnProp16 = Object.prototype.hasOwnProperty;
-var __propIsEnum16 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp16 = (obj, key, value) => key in obj ? __defProp16(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues16 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp16.call(b, prop))
-      __defNormalProp16(a, prop, b[prop]);
-  if (__getOwnPropSymbols16)
-    for (var prop of __getOwnPropSymbols16(b)) {
-      if (__propIsEnum16.call(b, prop))
-        __defNormalProp16(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps11 = (a, b) => __defProps11(a, __getOwnPropDescs11(b));
-var __async5 = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
+// src/functions/get-content/index.ts
 var checkContentHasResults = (content) => "results" in content;
-function fetchOneEntry(options) {
-  return __async5(this, null, function* () {
-    const allContent = yield fetchEntries(__spreadProps11(__spreadValues16({}, options), {
-      limit: 1
-    }));
-    if (allContent) {
-      return allContent.results[0] || null;
-    }
-    return null;
+async function fetchOneEntry(options) {
+  const allContent = await fetchEntries({
+    ...options,
+    limit: 1
   });
+  if (allContent) {
+    return allContent.results[0] || null;
+  }
+  return null;
 }
 var getContent = fetchOneEntry;
-var _fetchContent = (options) => __async5(void 0, null, function* () {
+var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = yield fetch2(url.href);
-  const content = yield res.json();
+  const res = await fetch2(url.href);
+  const content = await res.json();
   return content;
-});
-var _processContentResult = (_0, _1, ..._2) => __async5(void 0, [_0, _1, ..._2], function* (options, content, url = generateContentUrl(options)) {
+};
+var _processContentResult = async (options, content, url = generateContentUrl(options)) => {
   const canTrack = getDefaultCanTrack(options.canTrack);
   const isPreviewing2 = url.search.includes(`preview=`);
   if (TARGET === "rsc" && isPreviewing2) {
@@ -4001,7 +3122,7 @@ var _processContentResult = (_0, _1, ..._2) => __async5(void 0, [_0, _1, ..._2],
   try {
     const newResults = [];
     for (const item of content.results) {
-      newResults.push(yield handleABTesting({
+      newResults.push(await handleABTesting({
         item,
         canTrack
       }));
@@ -4011,42 +3132,413 @@ var _processContentResult = (_0, _1, ..._2) => __async5(void 0, [_0, _1, ..._2],
     logger.error("Could not process A/B tests. ", e);
   }
   return content;
+};
+async function fetchEntries(options) {
+  try {
+    const url = generateContentUrl(options);
+    const content = await _fetchContent(options);
+    if (!checkContentHasResults(content)) {
+      logger.error("Error fetching data. ", {
+        url,
+        content,
+        options
+      });
+      return null;
+    }
+    return _processContentResult(options, content);
+  } catch (error) {
+    logger.error("Error fetching data. ", error);
+    return null;
+  }
+}
+var getAllContent = fetchEntries;
+
+// src/functions/is-previewing.ts
+function isPreviewing() {
+  if (!isBrowser()) {
+    return false;
+  }
+  if (isEditing()) {
+    return false;
+  }
+  return Boolean(location.search.indexOf("builder.preview=") !== -1);
+}
+
+// src/helpers/uuid.ts
+function uuidv4() {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
+    const r = Math.random() * 16 | 0, v = c == "x" ? r : r & 3 | 8;
+    return v.toString(16);
+  });
+}
+function uuid() {
+  return uuidv4().replace(/-/g, "");
+}
+
+// src/helpers/sessionId.ts
+var SESSION_LOCAL_STORAGE_KEY = "builderSessionId";
+var getSessionId = async ({
+  canTrack
+}) => {
+  if (!canTrack) {
+    return void 0;
+  }
+  const sessionId = await getCookie({
+    name: SESSION_LOCAL_STORAGE_KEY,
+    canTrack
+  });
+  if (checkIsDefined(sessionId)) {
+    return sessionId;
+  } else {
+    const newSessionId = createSessionId();
+    setSessionId({
+      id: newSessionId,
+      canTrack
+    });
+    return newSessionId;
+  }
+};
+var createSessionId = () => uuid();
+var setSessionId = ({
+  id,
+  canTrack
+}) => setCookie({
+  name: SESSION_LOCAL_STORAGE_KEY,
+  value: id,
+  canTrack
+});
+
+// src/helpers/localStorage.ts
+var getLocalStorage = () => isBrowser() && typeof localStorage !== "undefined" ? localStorage : void 0;
+var getLocalStorageItem = ({
+  key,
+  canTrack
+}) => {
+  try {
+    if (canTrack) {
+      return getLocalStorage()?.getItem(key);
+    }
+    return void 0;
+  } catch (err) {
+    console.debug("[LocalStorage] GET error: ", err);
+    return void 0;
+  }
+};
+var setLocalStorageItem = ({
+  key,
+  canTrack,
+  value
+}) => {
+  try {
+    if (canTrack) {
+      getLocalStorage()?.setItem(key, value);
+    }
+  } catch (err) {
+    console.debug("[LocalStorage] SET error: ", err);
+  }
+};
+
+// src/helpers/visitorId.ts
+var VISITOR_LOCAL_STORAGE_KEY = "builderVisitorId";
+var getVisitorId = ({
+  canTrack
+}) => {
+  if (!canTrack) {
+    return void 0;
+  }
+  const visitorId = getLocalStorageItem({
+    key: VISITOR_LOCAL_STORAGE_KEY,
+    canTrack
+  });
+  if (checkIsDefined(visitorId)) {
+    return visitorId;
+  } else {
+    const newVisitorId = createVisitorId();
+    setVisitorId({
+      id: newVisitorId,
+      canTrack
+    });
+    return newVisitorId;
+  }
+};
+var createVisitorId = () => uuid();
+var setVisitorId = ({
+  id,
+  canTrack
+}) => setLocalStorageItem({
+  key: VISITOR_LOCAL_STORAGE_KEY,
+  value: id,
+  canTrack
+});
+
+// src/functions/track/index.ts
+var getTrackingEventData = async ({
+  canTrack
+}) => {
+  if (!canTrack) {
+    return {
+      visitorId: void 0,
+      sessionId: void 0
+    };
+  }
+  const sessionId = await getSessionId({
+    canTrack
+  });
+  const visitorId = getVisitorId({
+    canTrack
+  });
+  return {
+    sessionId,
+    visitorId
+  };
+};
+var createEvent = async ({
+  type: eventType,
+  canTrack,
+  apiKey,
+  metadata,
+  ...properties
+}) => ({
+  type: eventType,
+  data: {
+    ...properties,
+    metadata: {
+      url: location.href,
+      ...metadata
+    },
+    ...await getTrackingEventData({
+      canTrack
+    }),
+    userAttributes: getUserAttributes(),
+    ownerId: apiKey
+  }
+});
+async function _track(eventProps) {
+  if (!eventProps.apiKey) {
+    logger.error("Missing API key for track call. Please provide your API key.");
+    return;
+  }
+  if (!eventProps.canTrack) {
+    return;
+  }
+  if (isEditing()) {
+    return;
+  }
+  if (!(isBrowser() || TARGET === "reactNative")) {
+    return;
+  }
+  return fetch(`https://cdn.builder.io/api/v1/track`, {
+    method: "POST",
+    body: JSON.stringify({
+      events: [await createEvent(eventProps)]
+    }),
+    headers: {
+      "content-type": "application/json"
+    },
+    mode: "cors"
+  }).catch((err) => {
+    console.error("Failed to track: ", err);
+  });
+}
+var track = (args) => _track({
+  ...args,
+  canTrack: true
+});
+
+// src/functions/track/interaction.ts
+function round(num) {
+  return Math.round(num * 1e3) / 1e3;
+}
+var findParentElement = (target, callback, checkElement = true) => {
+  if (!(target instanceof HTMLElement)) {
+    return null;
+  }
+  let parent2 = checkElement ? target : target.parentElement;
+  do {
+    if (!parent2) {
+      return null;
+    }
+    const matches = callback(parent2);
+    if (matches) {
+      return parent2;
+    }
+  } while (parent2 = parent2.parentElement);
+  return null;
+};
+var findBuilderParent = (target) => findParentElement(target, (el) => {
+  const id = el.getAttribute("builder-id") || el.id;
+  return Boolean(id?.indexOf("builder-") === 0);
 });
-function fetchEntries(options) {
-  return __async5(this, null, function* () {
+var computeOffset = ({
+  event,
+  target
+}) => {
+  const targetRect = target.getBoundingClientRect();
+  const xOffset = event.clientX - targetRect.left;
+  const yOffset = event.clientY - targetRect.top;
+  const xRatio = round(xOffset / targetRect.width);
+  const yRatio = round(yOffset / targetRect.height);
+  return {
+    x: xRatio,
+    y: yRatio
+  };
+};
+var getInteractionPropertiesForEvent = (event) => {
+  const target = event.target;
+  const targetBuilderElement = target && findBuilderParent(target);
+  const builderId = targetBuilderElement?.getAttribute("builder-id") || targetBuilderElement?.id;
+  return {
+    targetBuilderElement: builderId || void 0,
+    metadata: {
+      targetOffset: target ? computeOffset({
+        event,
+        target
+      }) : void 0,
+      builderTargetOffset: targetBuilderElement ? computeOffset({
+        event,
+        target: targetBuilderElement
+      }) : void 0,
+      builderElementIndex: targetBuilderElement && builderId ? [].slice.call(document.getElementsByClassName(builderId)).indexOf(targetBuilderElement) : void 0
+    }
+  };
+};
+
+// src/constants/sdk-version.ts
+var SDK_VERSION = "0.7.2";
+
+// src/functions/register.ts
+var registry = {};
+function register(type, info) {
+  let typeList = registry[type];
+  if (!typeList) {
+    typeList = registry[type] = [];
+  }
+  typeList.push(info);
+  if (isBrowser()) {
+    const message = {
+      type: "builder.register",
+      data: {
+        type,
+        info
+      }
+    };
     try {
-      const url = generateContentUrl(options);
-      const content = yield _fetchContent(options);
-      if (!checkContentHasResults(content)) {
-        logger.error("Error fetching data. ", {
-          url,
-          content,
-          options
-        });
-        return null;
+      parent.postMessage(message, "*");
+      if (parent !== window) {
+        window.postMessage(message, "*");
       }
-      return _processContentResult(options, content);
-    } catch (error) {
-      logger.error("Error fetching data. ", error);
-      return null;
+    } catch (err) {
+      console.debug("Could not postmessage", err);
     }
-  });
+  }
 }
-var getAllContent = fetchEntries;
 
-// src/functions/is-previewing.js
-function isPreviewing() {
-  if (!isBrowser()) {
-    return false;
+// src/scripts/init-editing.ts
+var registerInsertMenu = () => {
+  register("insertMenu", {
+    name: "_default",
+    default: true,
+    items: [{
+      name: "Box"
+    }, {
+      name: "Text"
+    }, {
+      name: "Image"
+    }, {
+      name: "Columns"
+    }, ...TARGET === "reactNative" ? [] : [{
+      name: "Core:Section"
+    }, {
+      name: "Core:Button"
+    }, {
+      name: "Embed"
+    }, {
+      name: "Custom Code"
+    }]]
+  });
+};
+var isSetupForEditing = false;
+var setupBrowserForEditing = (options = {}) => {
+  if (isSetupForEditing) {
+    return;
   }
-  if (isEditing()) {
-    return false;
+  isSetupForEditing = true;
+  if (isBrowser()) {
+    window.parent?.postMessage({
+      type: "builder.sdkInfo",
+      data: {
+        target: TARGET,
+        version: SDK_VERSION,
+        supportsPatchUpdates: false,
+        // Supports builder-model="..." attribute which is needed to
+        // scope our '+ add block' button styling
+        supportsAddBlockScoping: true,
+        supportsCustomBreakpoints: true
+      }
+    }, "*");
+    window.parent?.postMessage({
+      type: "builder.updateContent",
+      data: {
+        options
+      }
+    }, "*");
+    window.addEventListener("message", ({
+      data
+    }) => {
+      if (!data?.type) {
+        return;
+      }
+      switch (data.type) {
+        case "builder.evaluate": {
+          const text = data.data.text;
+          const args = data.data.arguments || [];
+          const id = data.data.id;
+          const fn = new Function(text);
+          let result;
+          let error = null;
+          try {
+            result = fn.apply(null, args);
+          } catch (err) {
+            error = err;
+          }
+          if (error) {
+            window.parent?.postMessage({
+              type: "builder.evaluateError",
+              data: {
+                id,
+                error: error.message
+              }
+            }, "*");
+          } else {
+            if (result && typeof result.then === "function") {
+              result.then((finalResult) => {
+                window.parent?.postMessage({
+                  type: "builder.evaluateResult",
+                  data: {
+                    id,
+                    result: finalResult
+                  }
+                }, "*");
+              }).catch(console.error);
+            } else {
+              window.parent?.postMessage({
+                type: "builder.evaluateResult",
+                data: {
+                  result,
+                  id
+                }
+              }, "*");
+            }
+          }
+          break;
+        }
+      }
+    });
   }
-  return Boolean(location.search.indexOf("builder.preview=") !== -1);
-}
+};
 
-// src/components/content/components/enable-editor.jsx
-var _tmpl$14 = /* @__PURE__ */ template(`<div>`);
+// src/components/content/components/enable-editor.tsx
+var _tmpl$15 = /* @__PURE__ */ template(`<div>`);
 function EnableEditor(props) {
   const [forceReRenderCount, setForceReRenderCount] = createSignal(0);
   createSignal(0);
@@ -4273,7 +3765,7 @@ function EnableEditor(props) {
     emitStateUpdate();
   }
   createEffect(on(() => [props.builderContextSignal.rootState], onUpdateFn_4));
-  return createComponent(stdin_default.Provider, {
+  return createComponent(builder_context_default.Provider, {
     get value() {
       return props.builderContextSignal;
     },
@@ -4283,7 +3775,7 @@ function EnableEditor(props) {
           return props.builderContextSignal.content;
         },
         get children() {
-          const _el$ = _tmpl$14();
+          const _el$ = _tmpl$15();
           const _ref$ = elementRef;
           typeof _ref$ === "function" ? use(_ref$, _el$) : elementRef = _el$;
           spread(_el$, mergeProps({
@@ -4313,25 +3805,133 @@ function EnableEditor(props) {
   });
 }
 var enable_editor_default = EnableEditor;
-var _tmpl$15 = /* @__PURE__ */ template(`<script>`);
-function InlinedScript(props) {
-  return (() => {
-    const _el$ = _tmpl$15();
-    effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id;
-      _v$ !== _p$._v$ && (_el$.innerHTML = _p$._v$ = _v$);
-      _v$2 !== _p$._v$2 && setAttribute(_el$, "id", _p$._v$2 = _v$2);
-      return _p$;
-    }, {
-      _v$: void 0,
-      _v$2: void 0
-    });
-    return _el$;
-  })();
+
+// src/components/content/components/styles.helpers.ts
+var getCssFromFont = (font) => {
+  const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
+  const name = family.split(",")[0];
+  const url = font.fileUrl ?? font?.files?.regular;
+  let str = "";
+  if (url && family && name) {
+    str += `
+@font-face {
+font-family: "${family}";
+src: local("${name}"), url('${url}') format('woff2');
+font-display: fallback;
+font-weight: 400;
 }
-var inlined_script_default = InlinedScript;
+      `.trim();
+  }
+  if (font.files) {
+    for (const weight in font.files) {
+      const isNumber = String(Number(weight)) === weight;
+      if (!isNumber) {
+        continue;
+      }
+      const weightUrl = font.files[weight];
+      if (weightUrl && weightUrl !== url) {
+        str += `
+@font-face {
+font-family: "${family}";
+src: url('${weightUrl}') format('woff2');
+font-display: fallback;
+font-weight: ${weight};
+}
+        `.trim();
+      }
+    }
+  }
+  return str;
+};
+var getFontCss = ({
+  customFonts
+}) => {
+  return customFonts?.map((font) => getCssFromFont(font))?.join(" ") || "";
+};
+var getCss = ({
+  cssCode,
+  contentId
+}) => {
+  if (!cssCode) {
+    return "";
+  }
+  if (!contentId) {
+    return cssCode;
+  }
+  return cssCode?.replace(/&/g, `div[builder-content-id="${contentId}"]`) || "";
+};
+
+// src/components/content/components/styles.tsx
+function ContentStyles(props) {
+  const [injectedStyles, setInjectedStyles] = createSignal(`
+${getCss({
+    cssCode: props.cssCode,
+    contentId: props.contentId
+  })}
+${getFontCss({
+    customFonts: props.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 createComponent(inlined_styles_default, {
+    get styles() {
+      return injectedStyles();
+    }
+  });
+}
+var styles_default = ContentStyles;
+
+// src/components/content/content.helpers.ts
+var getContextStateInitialValue = ({
+  content,
+  data,
+  locale
+}) => {
+  const defaultValues = {};
+  content?.data?.inputs?.forEach((input) => {
+    if (input.name && input.defaultValue !== void 0 && content?.data?.state && content.data.state[input.name] === void 0) {
+      defaultValues[input.name] = input.defaultValue;
+    }
+  });
+  const stateToUse = {
+    ...content?.data?.state,
+    ...data,
+    ...locale ? {
+      locale
+    } : {}
+  };
+  return {
+    ...defaultValues,
+    ...stateToUse
+  };
+};
+var getContentInitialValue = ({
+  content,
+  data
+}) => {
+  return !content ? void 0 : {
+    ...content,
+    data: {
+      ...content?.data,
+      ...data
+    },
+    meta: content?.meta
+  };
+};
 
-// src/components/content/content.jsx
+// src/components/content/content.tsx
 function ContentComponent(props) {
   const [scriptStr, setScriptStr] = createSignal(getRenderContentScriptString({
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
@@ -4397,7 +3997,7 @@ function ContentComponent(props) {
       rootState: newRootState
     }));
   }
-  return createComponent(stdin_default2.Provider, {
+  return createComponent(components_context_default.Provider, {
     get value() {
       return {
         registeredComponents: registeredComponents()
@@ -4486,7 +4086,7 @@ function ContentComponent(props) {
 }
 var content_default = ContentComponent;
 
-// src/components/content-variants/content-variants.jsx
+// src/components/content-variants/content-variants.tsx
 function ContentVariants(props) {
   const [shouldRenderVariants, setShouldRenderVariants] = createSignal(checkShouldRunVariants({
     canTrack: getDefaultCanTrack(props.canTrack),
@@ -4511,6 +4111,7 @@ function ContentVariants(props) {
     });
   }
   onMount(() => {
+    setShouldRenderVariants(false);
   });
   return [createComponent(Show, {
     get when() {
@@ -4634,70 +4235,31 @@ function ContentVariants(props) {
 }
 var content_variants_default = ContentVariants;
 
-// src/blocks/symbol/symbol.helpers.js
-var __defProp17 = Object.defineProperty;
-var __getOwnPropSymbols17 = Object.getOwnPropertySymbols;
-var __hasOwnProp17 = Object.prototype.hasOwnProperty;
-var __propIsEnum17 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp17 = (obj, key, value) => key in obj ? __defProp17(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues17 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp17.call(b, prop))
-      __defNormalProp17(a, prop, b[prop]);
-  if (__getOwnPropSymbols17)
-    for (var prop of __getOwnPropSymbols17(b)) {
-      if (__propIsEnum17.call(b, prop))
-        __defNormalProp17(a, prop, b[prop]);
-    }
-  return a;
-};
-var __async6 = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-var fetchSymbolContent = (_0) => __async6(void 0, [_0], function* ({
+// src/blocks/symbol/symbol.helpers.ts
+var fetchSymbolContent = async ({
   builderContextValue,
   symbol
-}) {
-  if ((symbol == null ? void 0 : symbol.model) && (builderContextValue == null ? void 0 : builderContextValue.apiKey)) {
-    return fetchOneEntry(__spreadValues17({
+}) => {
+  if (symbol?.model && // This is a hack, we should not need to check for this, but it is needed for Svelte.
+  builderContextValue?.apiKey) {
+    return fetchOneEntry({
       model: symbol.model,
       apiKey: builderContextValue.apiKey,
-      apiVersion: builderContextValue.apiVersion
-    }, (symbol == null ? void 0 : symbol.entry) && {
-      query: {
-        id: symbol.entry
+      apiVersion: builderContextValue.apiVersion,
+      ...symbol?.entry && {
+        query: {
+          id: symbol.entry
+        }
       }
-    })).catch((err) => {
+    }).catch((err) => {
       logger.error("Could not fetch symbol content: ", err);
       return void 0;
     });
   }
   return void 0;
-});
+};
 
-// src/blocks/symbol/symbol.jsx
+// src/blocks/symbol/symbol.tsx
 var _tmpl$16 = /* @__PURE__ */ template(`<div>`);
 function Symbol(props) {
   const [contentToUse, setContentToUse] = createSignal(props.symbol?.content);
@@ -4763,11 +4325,11 @@ function Symbol(props) {
 }
 var symbol_default = Symbol;
 
-// src/index-helpers/blocks-exports.js
+// src/index-helpers/blocks-exports.ts
 var RenderBlocks = blocks_default;
 var RenderContent = content_variants_default;
 
-// src/functions/set-editor-settings.js
+// src/functions/set-editor-settings.ts
 var settings = {};
 function setEditorSettings(newSettings) {
   if (isBrowser()) {
@@ -4780,67 +4342,26 @@ function setEditorSettings(newSettings) {
   }
 }
 
-// src/functions/fetch-builder-props.js
-var __defProp18 = Object.defineProperty;
-var __defProps12 = Object.defineProperties;
-var __getOwnPropDescs12 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols18 = Object.getOwnPropertySymbols;
-var __hasOwnProp18 = Object.prototype.hasOwnProperty;
-var __propIsEnum18 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp18 = (obj, key, value) => key in obj ? __defProp18(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues18 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp18.call(b, prop))
-      __defNormalProp18(a, prop, b[prop]);
-  if (__getOwnPropSymbols18)
-    for (var prop of __getOwnPropSymbols18(b)) {
-      if (__propIsEnum18.call(b, prop))
-        __defNormalProp18(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps12 = (a, b) => __defProps12(a, __getOwnPropDescs12(b));
-var __async7 = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-var fetchBuilderProps = (_args) => __async7(void 0, null, function* () {
-  var _a, _b, _c;
-  const urlPath = _args.path || ((_a = _args.url) == null ? void 0 : _a.pathname) || ((_b = _args.userAttributes) == null ? void 0 : _b.urlPath);
-  const getContentArgs = __spreadProps12(__spreadValues18({}, _args), {
+// src/functions/fetch-builder-props.ts
+var fetchBuilderProps = async (_args) => {
+  const urlPath = _args.path || _args.url?.pathname || _args.userAttributes?.urlPath;
+  const getContentArgs = {
+    ..._args,
     apiKey: _args.apiKey,
     model: _args.model || "page",
-    userAttributes: __spreadValues18(__spreadValues18({}, _args.userAttributes), urlPath ? {
-      urlPath
-    } : {}),
-    options: getBuilderSearchParams(_args.searchParams || ((_c = _args.url) == null ? void 0 : _c.searchParams) || _args.options)
-  });
+    userAttributes: {
+      ..._args.userAttributes,
+      ...urlPath ? {
+        urlPath
+      } : {}
+    },
+    options: getBuilderSearchParams(_args.searchParams || _args.url?.searchParams || _args.options)
+  };
   return {
     apiKey: getContentArgs.apiKey,
     model: getContentArgs.model,
-    content: yield fetchOneEntry(getContentArgs)
+    content: await fetchOneEntry(getContentArgs)
   };
-});
+};
 
 export { blocks_default as Blocks, button_default as Button, columns_default as Columns, content_variants_default as Content, fragment_default as Fragment, image_default as Image, RenderBlocks, RenderContent, section_default as Section, symbol_default as Symbol, text_default as Text, video_default as Video, _processContentResult, createRegisterComponentMessage, fetchBuilderProps, fetchEntries, fetchOneEntry, getAllContent, getBuilderSearchParams, getContent, isEditing, isPreviewing, register, setEditorSettings, track };