@builder.io/sdk-solid 0.13.1 → 0.13.3

package/lib/browser/index.jsx

@@ -785,7 +785,7 @@ function BlockStyles(props) {
     }
     return true;
   }
-  function css4() {
+  function css5() {
     const processedBlock = getProcessedBlock({
       block: props.block,
       localState: props.context.localState,
@@ -828,7 +828,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   }
-  return <Show2 when={TARGET !== "reactNative" && css4() && canShowBlock()}><Inlined_styles_default styles={css4()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -1117,10 +1117,10 @@ function Block(props) {
       componentOptions: {
         ...getBlockComponentOptions(processedBlock()),
         builderContext: props.context,
-        ...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
+        ...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" || blockComponent()?.name === "Form:Form" ? {
           builderLinkComponent: props.linkComponent
         } : {},
-        ...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
+        ...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" || blockComponent()?.name === "Form:Form" ? {
           builderComponents: props.registeredComponents
         } : {}
       },
@@ -1591,10 +1591,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on3, createEffect as createEffect3, createSignal as createSignal14 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createSignal as createSignal15 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import { Show as Show11, For as For5, onMount as onMount4, createSignal as createSignal13 } from "solid-js";
+import { Show as Show12, For as For7, onMount as onMount4, createSignal as createSignal14 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -1788,7 +1788,7 @@ var handleABTesting = async ({
 var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
 
 // src/components/content/content.tsx
-import { Show as Show10, createSignal as createSignal12 } from "solid-js";
+import { Show as Show11, createSignal as createSignal13 } from "solid-js";
 
 // src/blocks/button/component-info.ts
 var componentInfo = {
@@ -2046,162 +2046,8 @@ var componentInfo2 = {
   }]
 };
 
-// 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
-  }]
-};
-
-// src/blocks/custom-code/custom-code.tsx
-import { onMount as onMount2, createSignal as createSignal7 } from "solid-js";
-function CustomCode(props) {
-  const [scriptsInserted, setScriptsInserted] = createSignal7([]);
-  const [scriptsRun, setScriptsRun] = createSignal7([]);
-  let elementRef;
-  onMount2(() => {
-    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) {
-        }
-      }
-    }
-  });
-  return <div
-    class={"builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")}
-    ref={elementRef}
-    innerHTML={props.code}
-  />;
-}
-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/embed.tsx
-import { on, createEffect, createSignal as createSignal8 } from "solid-js";
-
-// 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
-function Embed(props) {
-  const [scriptsInserted, setScriptsInserted] = createSignal8([]);
-  const [scriptsRun, setScriptsRun] = createSignal8([]);
-  const [ranInitFn, setRanInitFn] = createSignal8(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) {
-        }
-      }
-    }
-  }
-  let elem;
-  function onUpdateFn_0() {
-    if (elem && !ranInitFn()) {
-      setRanInitFn(true);
-      findAndRunScripts();
-    }
-  }
-  createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
-  return <div class="builder-embed" ref={elem} innerHTML={props.content} />;
-}
-var embed_default = Embed;
-
 // src/blocks/fragment/component-info.ts
-var componentInfo5 = {
+var componentInfo3 = {
   name: "Fragment",
   static: true,
   hidden: true,
@@ -2210,7 +2056,7 @@ var componentInfo5 = {
 };
 
 // src/blocks/image/component-info.ts
-var componentInfo6 = {
+var componentInfo4 = {
   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",
@@ -2331,41 +2177,8 @@ var componentInfo6 = {
   }]
 };
 
-// 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
-};
-
-// src/blocks/img/img.tsx
-function ImgComponent(props) {
-  return <img
-    style={{
-      "object-fit": props.backgroundSize || "cover",
-      "object-position": props.backgroundPosition || "center"
-    }}
-    key={isEditing() && props.imgSrc || "default-key"}
-    alt={props.altText}
-    src={props.imgSrc || props.image}
-    {...{}}
-    {...props.attributes}
-  />;
-}
-var img_default = ImgComponent;
-
 // src/blocks/section/component-info.ts
-var componentInfo8 = {
+var componentInfo5 = {
   name: "Core:Section",
   static: true,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -2407,7 +2220,7 @@ var componentInfo8 = {
 };
 
 // src/blocks/slot/component-info.ts
-var componentInfo9 = {
+var componentInfo6 = {
   name: "Slot",
   isRSC: true,
   description: "Allow child blocks to be inserted into this content when used as a Symbol",
@@ -2441,7 +2254,7 @@ function Slot(props) {
 var slot_default = Slot;
 
 // src/blocks/symbol/component-info.ts
-var componentInfo10 = {
+var componentInfo7 = {
   name: "Symbol",
   noWrap: true,
   static: true,
@@ -2477,7 +2290,7 @@ var componentInfo10 = {
 };
 
 // src/blocks/text/component-info.ts
-var componentInfo11 = {
+var componentInfo8 = {
   name: "Text",
   static: true,
   isRSC: true,
@@ -2509,54 +2322,894 @@ function Text(props) {
 }
 var text_default = Text;
 
-// src/blocks/video/component-info.ts
-var componentInfo12 = {
-  name: "Video",
-  canHaveChildren: true,
-  defaultStyles: {
-    minHeight: "20px",
-    minWidth: "20px"
-  },
-  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",
+// src/blocks/custom-code/component-info.ts
+var componentInfo9 = {
+  name: "Custom Code",
+  static: true,
+  requiredPermissions: ["editCode"],
   inputs: [{
-    name: "video",
-    type: "file",
-    allowedFileTypes: ["mp4"],
-    bubble: true,
-    defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
-    required: true
-  }, {
-    name: "posterImage",
-    type: "file",
-    allowedFileTypes: ["jpeg", "png"],
-    helperText: "Image to show before the video plays"
-  }, {
-    name: "autoPlay",
-    type: "boolean",
-    defaultValue: true
-  }, {
-    name: "controls",
-    type: "boolean",
-    defaultValue: false
-  }, {
-    name: "muted",
-    type: "boolean",
-    defaultValue: true
+    name: "code",
+    type: "html",
+    required: true,
+    defaultValue: "<p>Hello there, I am custom HTML code!</p>",
+    code: true
   }, {
-    name: "loop",
+    name: "replaceNodes",
     type: "boolean",
-    defaultValue: true
+    helperText: "Preserve server rendered dom nodes",
+    advanced: true
   }, {
-    name: "playsInline",
+    name: "scriptsClientOnly",
     type: "boolean",
-    defaultValue: true
-  }, {
-    name: "fit",
-    type: "text",
-    defaultValue: "cover",
-    enum: ["contain", "cover", "fill", "auto"]
-  }, {
-    name: "preload",
+    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/blocks/custom-code/custom-code.tsx
+import { onMount as onMount2, createSignal as createSignal7 } from "solid-js";
+function CustomCode(props) {
+  const [scriptsInserted, setScriptsInserted] = createSignal7([]);
+  const [scriptsRun, setScriptsRun] = createSignal7([]);
+  let elementRef;
+  onMount2(() => {
+    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) {
+        }
+      }
+    }
+  });
+  return <div
+    class={"builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")}
+    ref={elementRef}
+    innerHTML={props.code}
+  />;
+}
+var custom_code_default = CustomCode;
+
+// src/blocks/embed/component-info.ts
+var componentInfo10 = {
+  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/embed.tsx
+import { on, createEffect, createSignal as createSignal8 } from "solid-js";
+
+// 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
+function Embed(props) {
+  const [scriptsInserted, setScriptsInserted] = createSignal8([]);
+  const [scriptsRun, setScriptsRun] = createSignal8([]);
+  const [ranInitFn, setRanInitFn] = createSignal8(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) {
+        }
+      }
+    }
+  }
+  let elem;
+  function onUpdateFn_0() {
+    if (elem && !ranInitFn()) {
+      setRanInitFn(true);
+      findAndRunScripts();
+    }
+  }
+  createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
+  return <div class="builder-embed" ref={elem} innerHTML={props.content} />;
+}
+var embed_default = Embed;
+
+// src/blocks/form/form/component-info.ts
+var componentInfo11 = {
+  name: "Form:Form",
+  // editableTags: ['builder-form-error']
+  defaults: {
+    responsiveStyles: {
+      large: {
+        marginTop: "15px",
+        paddingBottom: "15px"
+      }
+    }
+  },
+  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5",
+  inputs: [{
+    name: "sendSubmissionsTo",
+    type: "string",
+    // TODO: save to builder data and user can download as csv
+    // TODO: easy for mode too or computed add/remove fields form mode
+    // so you can edit details and high level mode at same time...
+    // Later - more integrations like mailchimp
+    // /api/v1/form-submit?to=mailchimp
+    enum: [{
+      label: "Send to email",
+      value: "email",
+      helperText: "Send form submissions to the email address of your choosing"
+    }, {
+      label: "Custom",
+      value: "custom",
+      helperText: "Handle where the form requests go manually with a little code, e.g. to your own custom backend"
+    }],
+    defaultValue: "email"
+  }, {
+    name: "sendSubmissionsToEmail",
+    type: "string",
+    required: true,
+    // TODO: required: () => options.get("sendSubmissionsTo") === "email"
+    defaultValue: "your@email.com",
+    showIf: 'options.get("sendSubmissionsTo") === "email"'
+  }, {
+    name: "sendWithJs",
+    type: "boolean",
+    helperText: "Set to false to use basic html form action",
+    defaultValue: true,
+    showIf: 'options.get("sendSubmissionsTo") === "custom"'
+  }, {
+    name: "name",
+    type: "string",
+    defaultValue: "My form"
+    // advanced: true
+  }, {
+    name: "action",
+    type: "string",
+    helperText: "URL to send the form data to",
+    showIf: 'options.get("sendSubmissionsTo") === "custom"'
+  }, {
+    name: "contentType",
+    type: "string",
+    defaultValue: "application/json",
+    advanced: true,
+    // TODO: do automatically if file input
+    enum: ["application/json", "multipart/form-data", "application/x-www-form-urlencoded"],
+    showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
+  }, {
+    name: "method",
+    type: "string",
+    showIf: 'options.get("sendSubmissionsTo") === "custom"',
+    defaultValue: "POST",
+    advanced: true
+  }, {
+    name: "previewState",
+    type: "string",
+    // TODO: persist: false flag
+    enum: ["unsubmitted", "sending", "success", "error"],
+    defaultValue: "unsubmitted",
+    helperText: 'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',
+    showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
+  }, {
+    name: "successUrl",
+    type: "url",
+    helperText: "Optional URL to redirect the user to on form submission success",
+    showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
+  }, {
+    name: "resetFormOnSubmit",
+    type: "boolean",
+    showIf: "options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",
+    advanced: true
+  }, {
+    name: "successMessage",
+    type: "uiBlocks",
+    hideFromUI: true,
+    defaultValue: [{
+      "@type": "@builder.io/sdk:Element",
+      responsiveStyles: {
+        large: {
+          marginTop: "10px"
+        }
+      },
+      component: {
+        name: "Text",
+        options: {
+          text: "<span>Thanks!</span>"
+        }
+      }
+    }]
+  }, {
+    name: "validate",
+    type: "boolean",
+    defaultValue: true,
+    advanced: true
+  }, {
+    name: "errorMessagePath",
+    type: "text",
+    advanced: true,
+    helperText: 'Path to where to get the error message from in a JSON response to display to the user, e.g. "error.message" for a response like { "error": { "message": "this username is taken" }}'
+  }, {
+    name: "errorMessage",
+    type: "uiBlocks",
+    hideFromUI: true,
+    defaultValue: [{
+      "@type": "@builder.io/sdk:Element",
+      responsiveStyles: {
+        large: {
+          marginTop: "10px"
+        }
+      },
+      bindings: {
+        "component.options.text": "state.formErrorMessage || block.component.options.text"
+      },
+      component: {
+        name: "Text",
+        options: {
+          text: "<span>Form submission error :( Please check your answers and try again</span>"
+        }
+      }
+    }]
+  }, {
+    name: "sendingMessage",
+    type: "uiBlocks",
+    hideFromUI: true,
+    defaultValue: [{
+      "@type": "@builder.io/sdk:Element",
+      responsiveStyles: {
+        large: {
+          marginTop: "10px"
+        }
+      },
+      component: {
+        name: "Text",
+        options: {
+          text: "<span>Sending...</span>"
+        }
+      }
+    }]
+  }, {
+    name: "customHeaders",
+    type: "map",
+    valueType: {
+      type: "string"
+    },
+    advanced: true,
+    showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
+  }],
+  noWrap: true,
+  canHaveChildren: true,
+  defaultChildren: [{
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        marginTop: "10px"
+      }
+    },
+    component: {
+      name: "Text",
+      options: {
+        text: "<span>Enter your name</span>"
+      }
+    }
+  }, {
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        marginTop: "10px"
+      }
+    },
+    component: {
+      name: "Form:Input",
+      options: {
+        name: "name",
+        placeholder: "Jane Doe"
+      }
+    }
+  }, {
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        marginTop: "10px"
+      }
+    },
+    component: {
+      name: "Text",
+      options: {
+        text: "<span>Enter your email</span>"
+      }
+    }
+  }, {
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        marginTop: "10px"
+      }
+    },
+    component: {
+      name: "Form:Input",
+      options: {
+        name: "email",
+        placeholder: "jane@doe.com"
+      }
+    }
+  }, {
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        marginTop: "10px"
+      }
+    },
+    component: {
+      name: "Form:SubmitButton",
+      options: {
+        text: "Submit"
+      }
+    }
+  }]
+};
+
+// src/blocks/form/form/form.tsx
+import { Show as Show8, For as For5, createSignal as createSignal9 } from "solid-js";
+import { css as css4 } from "solid-styled-components";
+
+// src/functions/get-env.ts
+var validEnvList = ["production", "qa", "test", "development", "dev", "cdn-qa", "cloud", "fast", "cdn2", "cdn-prod"];
+var getEnv = () => {
+  const env = "production";
+  return validEnvList.includes(env) ? env : "production";
+};
+
+// src/functions/get.ts
+var get = (obj, path, defaultValue) => {
+  const result = String.prototype.split.call(path, /[,[\].]+?/).filter(Boolean).reduce((res, key) => res !== null && res !== void 0 ? res[key] : res, obj);
+  return result === void 0 || result === obj ? defaultValue : result;
+};
+
+// src/blocks/form/form/form.tsx
+function FormComponent(props) {
+  const [formState, setFormState] = createSignal9("unsubmitted");
+  const [responseData, setResponseData] = createSignal9(null);
+  const [formErrorMessage, setFormErrorMessage] = createSignal9("");
+  function mergeNewRootState(newData) {
+    const combinedState = {
+      ...props.builderContext.rootState,
+      ...newData
+    };
+    if (props.builderContext.rootSetState) {
+      props.builderContext.rootSetState?.(combinedState);
+    } else {
+      props.builderContext.rootState = combinedState;
+    }
+  }
+  function submissionState() {
+    return isEditing() && props.previewState || formState();
+  }
+  function onSubmit(event) {
+    const sendWithJsProp = props.sendWithJs || props.sendSubmissionsTo === "email";
+    if (props.sendSubmissionsTo === "zapier") {
+      event.preventDefault();
+    } else if (sendWithJsProp) {
+      if (!(props.action || props.sendSubmissionsTo === "email")) {
+        event.preventDefault();
+        return;
+      }
+      event.preventDefault();
+      const el = event.currentTarget;
+      const headers = props.customHeaders || {};
+      let body;
+      const formData = new FormData(el);
+      const formPairs = Array.from(
+        event.currentTarget.querySelectorAll("input,select,textarea")
+      ).filter((el2) => !!el2.name).map((el2) => {
+        let value;
+        const key = el2.name;
+        if (el2 instanceof HTMLInputElement) {
+          if (el2.type === "radio") {
+            if (el2.checked) {
+              value = el2.name;
+              return {
+                key,
+                value
+              };
+            }
+          } else if (el2.type === "checkbox") {
+            value = el2.checked;
+          } else if (el2.type === "number" || el2.type === "range") {
+            const num = el2.valueAsNumber;
+            if (!isNaN(num)) {
+              value = num;
+            }
+          } else if (el2.type === "file") {
+            value = el2.files;
+          } else {
+            value = el2.value;
+          }
+        } else {
+          value = el2.value;
+        }
+        return {
+          key,
+          value
+        };
+      });
+      let formContentType = props.contentType;
+      if (props.sendSubmissionsTo === "email") {
+        formContentType = "multipart/form-data";
+      }
+      Array.from(formPairs).forEach(({ value }) => {
+        if (value instanceof File || Array.isArray(value) && value[0] instanceof File || value instanceof FileList) {
+          formContentType = "multipart/form-data";
+        }
+      });
+      if (formContentType !== "application/json") {
+        body = formData;
+      } else {
+        const json = {};
+        Array.from(formPairs).forEach(({ value, key }) => {
+          set(json, key, value);
+        });
+        body = JSON.stringify(json);
+      }
+      if (formContentType && formContentType !== "multipart/form-data") {
+        if (
+          /* Zapier doesn't allow content-type header to be sent from browsers */
+          !(sendWithJsProp && props.action?.includes("zapier.com"))
+        ) {
+          headers["content-type"] = formContentType;
+        }
+      }
+      const presubmitEvent = new CustomEvent("presubmit", {
+        detail: {
+          body
+        }
+      });
+      if (formRef) {
+        formRef.dispatchEvent(presubmitEvent);
+        if (presubmitEvent.defaultPrevented) {
+          return;
+        }
+      }
+      setFormState("sending");
+      const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(
+        props.sendSubmissionsToEmail || ""
+      )}&name=${encodeURIComponent(props.name || "")}`;
+      fetch(
+        props.sendSubmissionsTo === "email" ? formUrl : props.action,
+        {
+          body,
+          headers,
+          method: props.method || "post"
+        }
+      ).then(
+        async (res) => {
+          let body2;
+          const contentType = res.headers.get("content-type");
+          if (contentType && contentType.indexOf("application/json") !== -1) {
+            body2 = await res.json();
+          } else {
+            body2 = await res.text();
+          }
+          if (!res.ok && props.errorMessagePath) {
+            let message = get(body2, props.errorMessagePath);
+            if (message) {
+              if (typeof message !== "string") {
+                message = JSON.stringify(message);
+              }
+              setFormErrorMessage(message);
+              mergeNewRootState({
+                formErrorMessage: message
+              });
+            }
+          }
+          setResponseData(body2);
+          setFormState(res.ok ? "success" : "error");
+          if (res.ok) {
+            const submitSuccessEvent = new CustomEvent("submit:success", {
+              detail: {
+                res,
+                body: body2
+              }
+            });
+            if (formRef) {
+              formRef.dispatchEvent(submitSuccessEvent);
+              if (submitSuccessEvent.defaultPrevented) {
+                return;
+              }
+              if (props.resetFormOnSubmit !== false) {
+                formRef.reset();
+              }
+            }
+            if (props.successUrl) {
+              if (formRef) {
+                const event2 = new CustomEvent("route", {
+                  detail: {
+                    url: props.successUrl
+                  }
+                });
+                formRef.dispatchEvent(event2);
+                if (!event2.defaultPrevented) {
+                  location.href = props.successUrl;
+                }
+              } else {
+                location.href = props.successUrl;
+              }
+            }
+          }
+        },
+        (err) => {
+          const submitErrorEvent = new CustomEvent("submit:error", {
+            detail: {
+              error: err
+            }
+          });
+          if (formRef) {
+            formRef.dispatchEvent(submitErrorEvent);
+            if (submitErrorEvent.defaultPrevented) {
+              return;
+            }
+          }
+          setResponseData(err);
+          setFormState("error");
+        }
+      );
+    }
+  }
+  let formRef;
+  return <form
+    validate={props.validate}
+    ref={formRef}
+    action={!props.sendWithJs && props.action}
+    method={props.method}
+    name={props.name}
+    onSubmit={(event) => onSubmit(event)}
+    {...{}}
+    {...props.attributes}
+  >
+    <Show8 when={props.builderBlock && props.builderBlock.children}><For5 each={props.builderBlock?.children}>{(block, _index) => {
+      const idx = _index();
+      return <Block_default
+        key={`form-block-${idx}`}
+        block={block}
+        context={props.builderContext}
+        registeredComponents={props.builderComponents}
+        linkComponent={props.builderLinkComponent}
+      />;
+    }}</For5></Show8>
+    <Show8 when={submissionState() === "error"}><Blocks_default
+      path="errorMessage"
+      blocks={props.errorMessage}
+      context={props.builderContext}
+    /></Show8>
+    <Show8 when={submissionState() === "sending"}><Blocks_default
+      path="sendingMessage"
+      blocks={props.sendingMessage}
+      context={props.builderContext}
+    /></Show8>
+    <Show8 when={submissionState() === "error" && responseData()}><pre
+      class={"builder-form-error-text " + css4({
+        padding: "10px",
+        color: "red",
+        textAlign: "center"
+      })}
+    >{JSON.stringify(responseData(), null, 2)}</pre></Show8>
+    <Show8 when={submissionState() === "success"}><Blocks_default
+      path="successMessage"
+      blocks={props.successMessage}
+      context={props.builderContext}
+    /></Show8>
+  </form>;
+}
+var form_default = FormComponent;
+
+// src/blocks/form/input/component-info.ts
+var componentInfo12 = {
+  name: "Form:Input",
+  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fad6f37889d9e40bbbbc72cdb5875d6ca",
+  inputs: [
+    {
+      name: "type",
+      type: "text",
+      enum: ["text", "number", "email", "url", "checkbox", "radio", "range", "date", "datetime-local", "search", "tel", "time", "file", "month", "week", "password", "color", "hidden"],
+      defaultValue: "text"
+    },
+    {
+      name: "name",
+      type: "string",
+      required: true,
+      helperText: 'Every input in a form needs a unique name describing what it takes, e.g. "email"'
+    },
+    {
+      name: "placeholder",
+      type: "string",
+      defaultValue: "Hello there",
+      helperText: "Text to display when there is no value"
+    },
+    // TODO: handle value vs default value automatically like ng-model
+    {
+      name: "defaultValue",
+      type: "string"
+    },
+    {
+      name: "value",
+      type: "string",
+      advanced: true
+    },
+    {
+      name: "required",
+      type: "boolean",
+      helperText: "Is this input required to be filled out to submit a form",
+      defaultValue: false
+    }
+  ],
+  noWrap: true,
+  static: true,
+  defaultStyles: {
+    paddingTop: "10px",
+    paddingBottom: "10px",
+    paddingLeft: "10px",
+    paddingRight: "10px",
+    borderRadius: "3px",
+    borderWidth: "1px",
+    borderStyle: "solid",
+    borderColor: "#ccc"
+  }
+};
+
+// src/blocks/form/input/input.tsx
+function FormInputComponent(props) {
+  return <input
+    {...{}}
+    {...props.attributes}
+    key={isEditing() && props.defaultValue ? props.defaultValue : "default-key"}
+    placeholder={props.placeholder}
+    type={props.type}
+    name={props.name}
+    value={props.value}
+    defaultValue={props.defaultValue}
+    required={props.required}
+  />;
+}
+var input_default = FormInputComponent;
+
+// src/blocks/form/select/component-info.ts
+var componentInfo13 = {
+  name: "Form:Select",
+  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F83acca093fb24aaf94dee136e9a4b045",
+  defaultStyles: {
+    alignSelf: "flex-start"
+  },
+  inputs: [{
+    name: "options",
+    type: "list",
+    required: true,
+    subFields: [{
+      name: "value",
+      type: "text",
+      required: true
+    }, {
+      name: "name",
+      type: "text"
+    }],
+    defaultValue: [{
+      value: "option 1"
+    }, {
+      value: "option 2"
+    }]
+  }, {
+    name: "name",
+    type: "string",
+    required: true,
+    helperText: 'Every select in a form needs a unique name describing what it gets, e.g. "email"'
+  }, {
+    name: "defaultValue",
+    type: "string"
+  }, {
+    name: "value",
+    type: "string",
+    advanced: true
+  }, {
+    name: "required",
+    type: "boolean",
+    defaultValue: false
+  }],
+  static: true,
+  noWrap: true
+};
+
+// src/blocks/form/select/select.tsx
+import { For as For6 } from "solid-js";
+function SelectComponent(props) {
+  return <select
+    {...{}}
+    {...props.attributes}
+    value={props.value}
+    key={isEditing() && props.defaultValue ? props.defaultValue : "default-key"}
+    defaultValue={props.defaultValue}
+    name={props.name}
+  ><For6 each={props.options}>{(option, _index) => {
+    const index = _index();
+    return <option value={option.value}>{option.name || option.value}</option>;
+  }}</For6></select>;
+}
+var select_default = SelectComponent;
+
+// src/blocks/form/submit-button/component-info.ts
+var componentInfo14 = {
+  name: "Form:SubmitButton",
+  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fdf2820ffed1f4349a94c40b3221f5b98",
+  defaultStyles: {
+    appearance: "none",
+    paddingTop: "15px",
+    paddingBottom: "15px",
+    paddingLeft: "25px",
+    paddingRight: "25px",
+    backgroundColor: "#3898EC",
+    color: "white",
+    borderRadius: "4px",
+    cursor: "pointer"
+  },
+  inputs: [{
+    name: "text",
+    type: "text",
+    defaultValue: "Click me"
+  }],
+  static: true,
+  noWrap: true
+  // TODO: optional children? maybe as optional form input
+  // that only shows if advanced setting is flipped
+  // TODO: defaultChildren
+  // canHaveChildren: true,
+};
+
+// src/blocks/form/submit-button/submit-button.tsx
+function SubmitButton(props) {
+  return <button type="submit" {...{}} {...props.attributes}>{props.text}</button>;
+}
+var submit_button_default = SubmitButton;
+
+// src/blocks/img/component-info.ts
+var componentInfo15 = {
+  // 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
+};
+
+// src/blocks/img/img.tsx
+function ImgComponent(props) {
+  return <img
+    style={{
+      "object-fit": props.backgroundSize || "cover",
+      "object-position": props.backgroundPosition || "center"
+    }}
+    key={isEditing() && props.imgSrc || "default-key"}
+    alt={props.altText}
+    src={props.imgSrc || props.image}
+    {...{}}
+    {...props.attributes}
+  />;
+}
+var img_default = ImgComponent;
+
+// src/blocks/video/component-info.ts
+var componentInfo16 = {
+  name: "Video",
+  canHaveChildren: true,
+  defaultStyles: {
+    minHeight: "20px",
+    minWidth: "20px"
+  },
+  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",
+  inputs: [{
+    name: "video",
+    type: "file",
+    allowedFileTypes: ["mp4"],
+    bubble: true,
+    defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
+    required: true
+  }, {
+    name: "posterImage",
+    type: "file",
+    allowedFileTypes: ["jpeg", "png"],
+    helperText: "Image to show before the video plays"
+  }, {
+    name: "autoPlay",
+    type: "boolean",
+    defaultValue: true
+  }, {
+    name: "controls",
+    type: "boolean",
+    defaultValue: false
+  }, {
+    name: "muted",
+    type: "boolean",
+    defaultValue: true
+  }, {
+    name: "loop",
+    type: "boolean",
+    defaultValue: true
+  }, {
+    name: "playsInline",
+    type: "boolean",
+    defaultValue: true
+  }, {
+    name: "fit",
+    type: "text",
+    defaultValue: "cover",
+    enum: ["contain", "cover", "fill", "auto"]
+  }, {
+    name: "preload",
     type: "text",
     defaultValue: "metadata",
     enum: ["auto", "metadata", "none"]
@@ -2594,7 +3247,7 @@ var componentInfo12 = {
 };
 
 // src/blocks/video/video.tsx
-import { Show as Show8 } from "solid-js";
+import { Show as Show9 } from "solid-js";
 function Video(props) {
   function videoProps() {
     return {
@@ -2645,8 +3298,8 @@ function Video(props) {
       }}
       src={props.video || "no-src"}
       poster={props.posterImage}
-    ><Show8 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show8></video>
-    <Show8
+    ><Show9 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show9></video>
+    <Show9
       when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}
     ><div
       style={{
@@ -2655,15 +3308,15 @@ function Video(props) {
         "pointer-events": "none",
         "font-size": "0px"
       }}
-    /></Show8>
-    <Show8 when={props.builderBlock?.children?.length && props.fitContent}><div
+    /></Show9>
+    <Show9 when={props.builderBlock?.children?.length && props.fitContent}><div
       style={{
         display: "flex",
         "flex-direction": "column",
         "align-items": "stretch"
       }}
-    >{props.children}</div></Show8>
-    <Show8 when={props.builderBlock?.children?.length && !props.fitContent}><div
+    >{props.children}</div></Show9>
+    <Show9 when={props.builderBlock?.children?.length && !props.fitContent}><div
       style={{
         "pointer-events": "none",
         display: "flex",
@@ -2675,11 +3328,38 @@ function Video(props) {
         width: "100%",
         height: "100%"
       }}
-    >{props.children}</div></Show8>
+    >{props.children}</div></Show9>
   </div>;
 }
 var video_default = Video;
 
+// src/constants/extra-components.ts
+var getExtraComponents = () => [{
+  component: custom_code_default,
+  ...componentInfo9
+}, {
+  component: embed_default,
+  ...componentInfo10
+}, ...TARGET === "rsc" ? [] : [{
+  component: form_default,
+  ...componentInfo11
+}, {
+  component: input_default,
+  ...componentInfo12
+}, {
+  component: submit_button_default,
+  ...componentInfo14
+}, {
+  component: select_default,
+  ...componentInfo13
+}], {
+  component: img_default,
+  ...componentInfo15
+}, {
+  component: video_default,
+  ...componentInfo16
+}];
+
 // src/constants/builder-registered-components.ts
 var getDefaultRegisteredComponents = () => [{
   component: button_default,
@@ -2688,36 +3368,24 @@ var getDefaultRegisteredComponents = () => [{
   component: columns_default,
   ...componentInfo2
 }, {
-  component: custom_code_default,
+  component: fragment_default,
   ...componentInfo3
 }, {
-  component: embed_default,
+  component: image_default,
   ...componentInfo4
 }, {
-  component: fragment_default,
+  component: section_default,
   ...componentInfo5
 }, {
-  component: image_default,
+  component: slot_default,
   ...componentInfo6
-}, {
-  component: img_default,
-  ...componentInfo7
-}, {
-  component: section_default,
-  ...componentInfo8
 }, {
   component: symbol_default,
-  ...componentInfo10
+  ...componentInfo7
 }, {
   component: text_default,
-  ...componentInfo11
-}, {
-  component: video_default,
-  ...componentInfo12
-}, {
-  component: slot_default,
-  ...componentInfo9
-}];
+  ...componentInfo8
+}, ...getExtraComponents()];
 
 // src/functions/register-component.ts
 var components = [];
@@ -2795,7 +3463,7 @@ function InlinedScript(props) {
 var Inlined_script_default = InlinedScript;
 
 // src/components/content/components/enable-editor.tsx
-import { Show as Show9, onMount as onMount3, on as on2, createEffect as createEffect2, createSignal as createSignal10 } from "solid-js";
+import { Show as Show10, onMount as onMount3, on as on2, createEffect as createEffect2, createSignal as createSignal11 } from "solid-js";
 import { Dynamic as Dynamic5 } from "solid-js/web";
 
 // src/helpers/preview-lru-cache/get.ts
@@ -3285,7 +3953,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "0.13.1";
+var SDK_VERSION = "0.13.3";
 
 // src/functions/register.ts
 var registry = {};
@@ -3483,15 +4151,15 @@ var subscribeToEditor = (model, callback, options) => {
 
 // src/components/content/components/enable-editor.tsx
 function EnableEditor(props) {
-  const [forceReRenderCount, setForceReRenderCount] = createSignal10(0);
-  const [firstRender, setFirstRender] = createSignal10(true);
-  const [lastUpdated, setLastUpdated] = createSignal10(0);
-  const [shouldSendResetCookie, setShouldSendResetCookie] = createSignal10(false);
-  const [ContentWrapper, setContentWrapper] = createSignal10(
+  const [forceReRenderCount, setForceReRenderCount] = createSignal11(0);
+  const [firstRender, setFirstRender] = createSignal11(true);
+  const [lastUpdated, setLastUpdated] = createSignal11(0);
+  const [shouldSendResetCookie, setShouldSendResetCookie] = createSignal11(false);
+  const [ContentWrapper, setContentWrapper] = createSignal11(
     props.contentWrapper || "div"
   );
-  const [httpReqsData, setHttpReqsData] = createSignal10({});
-  const [clicked, setClicked] = createSignal10(false);
+  const [httpReqsData, setHttpReqsData] = createSignal11({});
+  const [clicked, setClicked] = createSignal11(false);
   function mergeNewRootState(newData) {
     const combinedState = {
       ...props.builderContextSignal.rootState,
@@ -3754,7 +4422,7 @@ function EnableEditor(props) {
     }
   }
   createEffect2(on2(() => [props.locale], onUpdateFn_6));
-  return <builder_context_default.Provider value={props.builderContextSignal}><Show9 when={props.builderContextSignal.content}><Dynamic5
+  return <builder_context_default.Provider value={props.builderContextSignal}><Show10 when={props.builderContextSignal.content}><Dynamic5
     class={`variant-${props.content?.testVariationId || props.content?.id}`}
     {...{}}
     key={forceReRenderCount()}
@@ -3769,12 +4437,12 @@ function EnableEditor(props) {
     }}
     {...props.contentWrapperProps}
     component={ContentWrapper()}
-  >{props.children}</Dynamic5></Show9></builder_context_default.Provider>;
+  >{props.children}</Dynamic5></Show10></builder_context_default.Provider>;
 }
 var Enable_editor_default = EnableEditor;
 
 // src/components/content/components/styles.tsx
-import { createSignal as createSignal11 } from "solid-js";
+import { createSignal as createSignal12 } from "solid-js";
 
 // src/components/content/components/styles.helpers.ts
 var getCssFromFont = (font) => {
@@ -3833,7 +4501,7 @@ var getCss = ({
 
 // src/components/content/components/styles.tsx
 function ContentStyles(props) {
-  const [injectedStyles, setInjectedStyles] = createSignal11(
+  const [injectedStyles, setInjectedStyles] = createSignal12(
     `
 ${getCss({
       cssCode: props.cssCode,
@@ -3903,7 +4571,7 @@ var getContentInitialValue = ({
 
 // src/components/content/content.tsx
 function ContentComponent(props) {
-  const [scriptStr, setScriptStr] = createSignal12(
+  const [scriptStr, setScriptStr] = createSignal13(
     getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
       variationId: props.content?.testVariationId,
@@ -3911,7 +4579,7 @@ function ContentComponent(props) {
       contentId: props.content?.id
     })
   );
-  const [registeredComponents, setRegisteredComponents] = createSignal12(
+  const [registeredComponents, setRegisteredComponents] = createSignal13(
     [
       ...getDefaultRegisteredComponents(),
       // While this `components` object is deprecated, we must maintain support for it.
@@ -3932,7 +4600,7 @@ function ContentComponent(props) {
       {}
     )
   );
-  const [builderContextSignal, setBuilderContextSignal] = createSignal12({
+  const [builderContextSignal, setBuilderContextSignal] = createSignal13({
     content: getContentInitialValue({
       content: props.content,
       data: props.data
@@ -3997,12 +4665,12 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show10 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show10>
-    <Show10 when={TARGET !== "reactNative"}><Styles_default
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={TARGET !== "reactNative"}><Styles_default
       contentId={builderContextSignal().content?.id}
       cssCode={builderContextSignal().content?.data?.cssCode}
       customFonts={builderContextSignal().content?.data?.customFonts}
-    /></Show10>
+    /></Show11>
     <Blocks_default
       blocks={builderContextSignal().content?.data?.blocks}
       context={builderContextSignal()}
@@ -4015,7 +4683,7 @@ var Content_default = ContentComponent;
 
 // src/components/content-variants/content-variants.tsx
 function ContentVariants(props) {
-  const [shouldRenderVariants, setShouldRenderVariants] = createSignal13(
+  const [shouldRenderVariants, setShouldRenderVariants] = createSignal14(
     checkShouldRenderVariants({
       canTrack: getDefaultCanTrack(props.canTrack),
       content: props.content
@@ -4046,8 +4714,8 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show11 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show11>
-    <Show11 when={shouldRenderVariants()}>
+    <Show12 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
         id={`variants-styles-${props.content?.id}`}
         styles={hideVariantsStyleString()}
@@ -4055,7 +4723,7 @@ function ContentVariants(props) {
       <Inlined_script_default
         scriptStr={updateCookieAndStylesScriptStr()}
       />
-      <For5 each={getVariants(props.content)}>{(variant, _index) => {
+      <For7 each={getVariants(props.content)}>{(variant, _index) => {
         const index = _index();
         return <Content_default
           key={variant.testVariationId}
@@ -4079,8 +4747,8 @@ function ContentVariants(props) {
           contentWrapperProps={props.contentWrapperProps}
           trustedHosts={props.trustedHosts}
         />;
-      }}</For5>
-    </Show11>
+      }}</For7>
+    </Show12>
     <Content_default
       {...{}}
       content={defaultContent()}
@@ -4133,7 +4801,7 @@ var fetchSymbolContent = async ({
 
 // src/blocks/symbol/symbol.tsx
 function Symbol(props) {
-  const [contentToUse, setContentToUse] = createSignal14(props.symbol?.content);
+  const [contentToUse, setContentToUse] = createSignal15(props.symbol?.content);
   function className() {
     return [
       ...[props.attributes[getClassPropName()]],