@builder.io/sdk-solid 1.0.14 → 1.0.16

package/dist/index.d.ts

@@ -921,6 +921,14 @@ interface GetContentOptions {
      * draft mode and un-archived. Default is false.
      */
     includeUnpublished?: boolean;
+    /**
+     * Optional override of the `fetch` function. (Defaults to global `fetch`)
+     */
+    fetch?: typeof global.fetch;
+    /**
+     * Optional fetch options to be passed to the `fetch` function.
+     */
+    fetchOptions?: RequestInit;
 }
 
 type GetBuilderPropsOptions = (Omit<GetContentOptions, 'model'> & {

package/lib/browser/dev.js

@@ -871,7 +871,7 @@ function InlinedStyles(props) {
     effect((_p$) => {
       const _v$ = props.styles, _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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -942,6 +942,7 @@ function BlockStyles(props) {
     },
     get children() {
       return createComponent(inlined_styles_default, {
+        id: "builderio-block",
         get styles() {
           return css5();
         }
@@ -1658,6 +1659,7 @@ function Columns(props) {
       when: TARGET !== "reactNative",
       get children() {
         return createComponent(inlined_styles_default, {
+          id: "builderio-columns",
           get styles() {
             return columnsStyles();
           }
@@ -3929,7 +3931,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -3948,9 +3950,9 @@ function InlinedScript(props) {
   return (() => {
     const _el$ = _tmpl$16();
     effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id || "";
+      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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -4135,7 +4137,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4446,7 +4449,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -5028,6 +5031,7 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim());
   return createComponent(inlined_styles_default, {
+    id: "builderio-content",
     get styles() {
       return injectedStyles();
     }
@@ -5181,6 +5185,7 @@ function ContentComponent(props) {
             },
             get children() {
               return createComponent(inlined_script_default, {
+                id: "builderio-variant-visibility",
                 get scriptStr() {
                   return scriptStr();
                 }
@@ -5258,8 +5263,9 @@ function ContentVariants(props) {
     },
     get children() {
       return createComponent(inlined_script_default, {
+        id: "builderio-init-variants-fns",
         get scriptStr() {
-          return getScriptString();
+          return getInitVariantsFnsScriptString();
         }
       });
     }
@@ -5269,13 +5275,12 @@ function ContentVariants(props) {
     },
     get children() {
       return [createComponent(inlined_styles_default, {
-        get id() {
-          return `variants-styles-${props.content?.id}`;
-        },
+        id: "builderio-variants",
         get styles() {
           return hideVariantsStyleString();
         }
       }), createComponent(inlined_script_default, {
+        id: "builderio-variants-visibility",
         get scriptStr() {
           return updateCookieAndStylesScriptStr();
         }

package/lib/browser/dev.jsx

@@ -857,7 +857,7 @@ var getSizesForBreakpoints = ({
 
 // src/components/inlined-styles.tsx
 function InlinedStyles(props) {
-  return <style innerHTML={props.styles} id={props.id} />;
+  return <style innerHTML={props.styles} data-id={props.id} />;
 }
 var Inlined_styles_default = InlinedStyles;
 
@@ -923,7 +923,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   });
-  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -1458,7 +1458,10 @@ function Columns(props) {
     style={columnsCssVars()}
     {...{}}
   >
-    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
+    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default
+      id="builderio-columns"
+      styles={columnsStyles()}
+    /></Show6>
     <For4 each={props.columns}>{(column, _index) => {
       const index = _index();
       return <Dynamic_renderer_default
@@ -3512,7 +3515,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -3529,7 +3532,7 @@ var getUpdateVariantVisibilityScript = ({
 
 // src/components/inlined-script.tsx
 function InlinedScript(props) {
-  return <script innerHTML={props.scriptStr} id={props.id || ""} />;
+  return <script innerHTML={props.scriptStr} data-id={props.id} />;
 }
 var Inlined_script_default = InlinedScript;
 
@@ -3718,7 +3721,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4029,7 +4033,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -4623,7 +4627,10 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim()
   );
-  return <Inlined_styles_default styles={injectedStyles()} />;
+  return <Inlined_styles_default
+    id="builderio-content"
+    styles={injectedStyles()}
+  />;
 }
 var Styles_default = ContentStyles;
 
@@ -4746,7 +4753,10 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default
+      id="builderio-variant-visibility"
+      scriptStr={scriptStr()}
+    /></Show11>
     <Show11 when={TARGET !== "reactNative"}><Styles_default
       isNestedRender={props.isNestedRender}
       contentId={builderContextSignal().content?.id}
@@ -4796,13 +4806,17 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default
+      id="builderio-init-variants-fns"
+      scriptStr={getInitVariantsFnsScriptString()}
+    /></Show12>
     <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
-        id={`variants-styles-${props.content?.id}`}
+        id="builderio-variants"
         styles={hideVariantsStyleString()}
       />
       <Inlined_script_default
+        id="builderio-variants-visibility"
         scriptStr={updateCookieAndStylesScriptStr()}
       />
       <For7 each={getVariants(props.content)}>{(variant, _index) => {

package/lib/browser/index.js

@@ -865,7 +865,7 @@ function InlinedStyles(props) {
     effect((_p$) => {
       const _v$ = props.styles, _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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -936,6 +936,7 @@ function BlockStyles(props) {
     },
     get children() {
       return createComponent(inlined_styles_default, {
+        id: "builderio-block",
         get styles() {
           return css5();
         }
@@ -1652,6 +1653,7 @@ function Columns(props) {
       when: TARGET !== "reactNative",
       get children() {
         return createComponent(inlined_styles_default, {
+          id: "builderio-columns",
           get styles() {
             return columnsStyles();
           }
@@ -3919,7 +3921,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -3938,9 +3940,9 @@ function InlinedScript(props) {
   return (() => {
     const _el$ = _tmpl$16();
     effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id || "";
+      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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -4123,7 +4125,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4431,7 +4434,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -5011,6 +5014,7 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim());
   return createComponent(inlined_styles_default, {
+    id: "builderio-content",
     get styles() {
       return injectedStyles();
     }
@@ -5164,6 +5168,7 @@ function ContentComponent(props) {
             },
             get children() {
               return createComponent(inlined_script_default, {
+                id: "builderio-variant-visibility",
                 get scriptStr() {
                   return scriptStr();
                 }
@@ -5241,8 +5246,9 @@ function ContentVariants(props) {
     },
     get children() {
       return createComponent(inlined_script_default, {
+        id: "builderio-init-variants-fns",
         get scriptStr() {
-          return getScriptString();
+          return getInitVariantsFnsScriptString();
         }
       });
     }
@@ -5252,13 +5258,12 @@ function ContentVariants(props) {
     },
     get children() {
       return [createComponent(inlined_styles_default, {
-        get id() {
-          return `variants-styles-${props.content?.id}`;
-        },
+        id: "builderio-variants",
         get styles() {
           return hideVariantsStyleString();
         }
       }), createComponent(inlined_script_default, {
+        id: "builderio-variants-visibility",
         get scriptStr() {
           return updateCookieAndStylesScriptStr();
         }

package/lib/browser/index.jsx

@@ -851,7 +851,7 @@ var getSizesForBreakpoints = ({
 
 // src/components/inlined-styles.tsx
 function InlinedStyles(props) {
-  return <style innerHTML={props.styles} id={props.id} />;
+  return <style innerHTML={props.styles} data-id={props.id} />;
 }
 var Inlined_styles_default = InlinedStyles;
 
@@ -917,7 +917,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   });
-  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -1452,7 +1452,10 @@ function Columns(props) {
     style={columnsCssVars()}
     {...{}}
   >
-    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
+    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default
+      id="builderio-columns"
+      styles={columnsStyles()}
+    /></Show6>
     <For4 each={props.columns}>{(column, _index) => {
       const index = _index();
       return <Dynamic_renderer_default
@@ -3502,7 +3505,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -3519,7 +3522,7 @@ var getUpdateVariantVisibilityScript = ({
 
 // src/components/inlined-script.tsx
 function InlinedScript(props) {
-  return <script innerHTML={props.scriptStr} id={props.id || ""} />;
+  return <script innerHTML={props.scriptStr} data-id={props.id} />;
 }
 var Inlined_script_default = InlinedScript;
 
@@ -3706,7 +3709,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4014,7 +4018,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -4606,7 +4610,10 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim()
   );
-  return <Inlined_styles_default styles={injectedStyles()} />;
+  return <Inlined_styles_default
+    id="builderio-content"
+    styles={injectedStyles()}
+  />;
 }
 var Styles_default = ContentStyles;
 
@@ -4729,7 +4736,10 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default
+      id="builderio-variant-visibility"
+      scriptStr={scriptStr()}
+    /></Show11>
     <Show11 when={TARGET !== "reactNative"}><Styles_default
       isNestedRender={props.isNestedRender}
       contentId={builderContextSignal().content?.id}
@@ -4779,13 +4789,17 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default
+      id="builderio-init-variants-fns"
+      scriptStr={getInitVariantsFnsScriptString()}
+    /></Show12>
     <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
-        id={`variants-styles-${props.content?.id}`}
+        id="builderio-variants"
         styles={hideVariantsStyleString()}
       />
       <Inlined_script_default
+        id="builderio-variants-visibility"
         scriptStr={updateCookieAndStylesScriptStr()}
       />
       <For7 each={getVariants(props.content)}>{(variant, _index) => {

package/lib/edge/dev.js

@@ -4024,7 +4024,7 @@ function InlinedStyles(props) {
     effect((_p$) => {
       const _v$ = props.styles, _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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -4095,6 +4095,7 @@ function BlockStyles(props) {
     },
     get children() {
       return createComponent(inlined_styles_default, {
+        id: "builderio-block",
         get styles() {
           return css5();
         }
@@ -4811,6 +4812,7 @@ function Columns(props) {
       when: TARGET !== "reactNative",
       get children() {
         return createComponent(inlined_styles_default, {
+          id: "builderio-columns",
           get styles() {
             return columnsStyles();
           }
@@ -7082,7 +7084,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -7101,9 +7103,9 @@ function InlinedScript(props) {
   return (() => {
     const _el$ = _tmpl$16();
     effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id || "";
+      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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -7288,7 +7290,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -7599,7 +7602,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -8181,6 +8184,7 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim());
   return createComponent(inlined_styles_default, {
+    id: "builderio-content",
     get styles() {
       return injectedStyles();
     }
@@ -8334,6 +8338,7 @@ function ContentComponent(props) {
             },
             get children() {
               return createComponent(inlined_script_default, {
+                id: "builderio-variant-visibility",
                 get scriptStr() {
                   return scriptStr();
                 }
@@ -8411,8 +8416,9 @@ function ContentVariants(props) {
     },
     get children() {
       return createComponent(inlined_script_default, {
+        id: "builderio-init-variants-fns",
         get scriptStr() {
-          return getScriptString();
+          return getInitVariantsFnsScriptString();
         }
       });
     }
@@ -8422,13 +8428,12 @@ function ContentVariants(props) {
     },
     get children() {
       return [createComponent(inlined_styles_default, {
-        get id() {
-          return `variants-styles-${props.content?.id}`;
-        },
+        id: "builderio-variants",
         get styles() {
           return hideVariantsStyleString();
         }
       }), createComponent(inlined_script_default, {
+        id: "builderio-variants-visibility",
         get scriptStr() {
           return updateCookieAndStylesScriptStr();
         }

package/lib/edge/dev.jsx

@@ -4012,7 +4012,7 @@ var getSizesForBreakpoints = ({
 
 // src/components/inlined-styles.tsx
 function InlinedStyles(props) {
-  return <style innerHTML={props.styles} id={props.id} />;
+  return <style innerHTML={props.styles} data-id={props.id} />;
 }
 var Inlined_styles_default = InlinedStyles;
 
@@ -4078,7 +4078,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   });
-  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -4613,7 +4613,10 @@ function Columns(props) {
     style={columnsCssVars()}
     {...{}}
   >
-    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
+    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default
+      id="builderio-columns"
+      styles={columnsStyles()}
+    /></Show6>
     <For4 each={props.columns}>{(column, _index) => {
       const index = _index();
       return <Dynamic_renderer_default
@@ -6667,7 +6670,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -6684,7 +6687,7 @@ var getUpdateVariantVisibilityScript = ({
 
 // src/components/inlined-script.tsx
 function InlinedScript(props) {
-  return <script innerHTML={props.scriptStr} id={props.id || ""} />;
+  return <script innerHTML={props.scriptStr} data-id={props.id} />;
 }
 var Inlined_script_default = InlinedScript;
 
@@ -6873,7 +6876,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -7184,7 +7188,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -7778,7 +7782,10 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim()
   );
-  return <Inlined_styles_default styles={injectedStyles()} />;
+  return <Inlined_styles_default
+    id="builderio-content"
+    styles={injectedStyles()}
+  />;
 }
 var Styles_default = ContentStyles;
 
@@ -7901,7 +7908,10 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default
+      id="builderio-variant-visibility"
+      scriptStr={scriptStr()}
+    /></Show11>
     <Show11 when={TARGET !== "reactNative"}><Styles_default
       isNestedRender={props.isNestedRender}
       contentId={builderContextSignal().content?.id}
@@ -7951,13 +7961,17 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default
+      id="builderio-init-variants-fns"
+      scriptStr={getInitVariantsFnsScriptString()}
+    /></Show12>
     <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
-        id={`variants-styles-${props.content?.id}`}
+        id="builderio-variants"
         styles={hideVariantsStyleString()}
       />
       <Inlined_script_default
+        id="builderio-variants-visibility"
         scriptStr={updateCookieAndStylesScriptStr()}
       />
       <For7 each={getVariants(props.content)}>{(variant, _index) => {

package/lib/edge/index.js

@@ -4018,7 +4018,7 @@ function InlinedStyles(props) {
     effect((_p$) => {
       const _v$ = props.styles, _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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -4089,6 +4089,7 @@ function BlockStyles(props) {
     },
     get children() {
       return createComponent(inlined_styles_default, {
+        id: "builderio-block",
         get styles() {
           return css5();
         }
@@ -4805,6 +4806,7 @@ function Columns(props) {
       when: TARGET !== "reactNative",
       get children() {
         return createComponent(inlined_styles_default, {
+          id: "builderio-columns",
           get styles() {
             return columnsStyles();
           }
@@ -7072,7 +7074,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -7091,9 +7093,9 @@ function InlinedScript(props) {
   return (() => {
     const _el$ = _tmpl$16();
     effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id || "";
+      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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -7276,7 +7278,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -7584,7 +7587,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -8164,6 +8167,7 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim());
   return createComponent(inlined_styles_default, {
+    id: "builderio-content",
     get styles() {
       return injectedStyles();
     }
@@ -8317,6 +8321,7 @@ function ContentComponent(props) {
             },
             get children() {
               return createComponent(inlined_script_default, {
+                id: "builderio-variant-visibility",
                 get scriptStr() {
                   return scriptStr();
                 }
@@ -8394,8 +8399,9 @@ function ContentVariants(props) {
     },
     get children() {
       return createComponent(inlined_script_default, {
+        id: "builderio-init-variants-fns",
         get scriptStr() {
-          return getScriptString();
+          return getInitVariantsFnsScriptString();
         }
       });
     }
@@ -8405,13 +8411,12 @@ function ContentVariants(props) {
     },
     get children() {
       return [createComponent(inlined_styles_default, {
-        get id() {
-          return `variants-styles-${props.content?.id}`;
-        },
+        id: "builderio-variants",
         get styles() {
           return hideVariantsStyleString();
         }
       }), createComponent(inlined_script_default, {
+        id: "builderio-variants-visibility",
         get scriptStr() {
           return updateCookieAndStylesScriptStr();
         }

package/lib/edge/index.jsx

@@ -4006,7 +4006,7 @@ var getSizesForBreakpoints = ({
 
 // src/components/inlined-styles.tsx
 function InlinedStyles(props) {
-  return <style innerHTML={props.styles} id={props.id} />;
+  return <style innerHTML={props.styles} data-id={props.id} />;
 }
 var Inlined_styles_default = InlinedStyles;
 
@@ -4072,7 +4072,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   });
-  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -4607,7 +4607,10 @@ function Columns(props) {
     style={columnsCssVars()}
     {...{}}
   >
-    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
+    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default
+      id="builderio-columns"
+      styles={columnsStyles()}
+    /></Show6>
     <For4 each={props.columns}>{(column, _index) => {
       const index = _index();
       return <Dynamic_renderer_default
@@ -6657,7 +6660,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -6674,7 +6677,7 @@ var getUpdateVariantVisibilityScript = ({
 
 // src/components/inlined-script.tsx
 function InlinedScript(props) {
-  return <script innerHTML={props.scriptStr} id={props.id || ""} />;
+  return <script innerHTML={props.scriptStr} data-id={props.id} />;
 }
 var Inlined_script_default = InlinedScript;
 
@@ -6861,7 +6864,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -7169,7 +7173,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -7761,7 +7765,10 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim()
   );
-  return <Inlined_styles_default styles={injectedStyles()} />;
+  return <Inlined_styles_default
+    id="builderio-content"
+    styles={injectedStyles()}
+  />;
 }
 var Styles_default = ContentStyles;
 
@@ -7884,7 +7891,10 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default
+      id="builderio-variant-visibility"
+      scriptStr={scriptStr()}
+    /></Show11>
     <Show11 when={TARGET !== "reactNative"}><Styles_default
       isNestedRender={props.isNestedRender}
       contentId={builderContextSignal().content?.id}
@@ -7934,13 +7944,17 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default
+      id="builderio-init-variants-fns"
+      scriptStr={getInitVariantsFnsScriptString()}
+    /></Show12>
     <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
-        id={`variants-styles-${props.content?.id}`}
+        id="builderio-variants"
         styles={hideVariantsStyleString()}
       />
       <Inlined_script_default
+        id="builderio-variants-visibility"
         scriptStr={updateCookieAndStylesScriptStr()}
       />
       <For7 each={getVariants(props.content)}>{(variant, _index) => {

package/lib/node/dev.js

@@ -996,7 +996,7 @@ function InlinedStyles(props) {
     effect((_p$) => {
       const _v$ = props.styles, _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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -1067,6 +1067,7 @@ function BlockStyles(props) {
     },
     get children() {
       return createComponent(inlined_styles_default, {
+        id: "builderio-block",
         get styles() {
           return css5();
         }
@@ -1783,6 +1784,7 @@ function Columns(props) {
       when: TARGET !== "reactNative",
       get children() {
         return createComponent(inlined_styles_default, {
+          id: "builderio-columns",
           get styles() {
             return columnsStyles();
           }
@@ -4054,7 +4056,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -4073,9 +4075,9 @@ function InlinedScript(props) {
   return (() => {
     const _el$ = _tmpl$16();
     effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id || "";
+      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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -4260,7 +4262,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4571,7 +4574,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -5153,6 +5156,7 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim());
   return createComponent(inlined_styles_default, {
+    id: "builderio-content",
     get styles() {
       return injectedStyles();
     }
@@ -5306,6 +5310,7 @@ function ContentComponent(props) {
             },
             get children() {
               return createComponent(inlined_script_default, {
+                id: "builderio-variant-visibility",
                 get scriptStr() {
                   return scriptStr();
                 }
@@ -5383,8 +5388,9 @@ function ContentVariants(props) {
     },
     get children() {
       return createComponent(inlined_script_default, {
+        id: "builderio-init-variants-fns",
         get scriptStr() {
-          return getScriptString();
+          return getInitVariantsFnsScriptString();
         }
       });
     }
@@ -5394,13 +5400,12 @@ function ContentVariants(props) {
     },
     get children() {
       return [createComponent(inlined_styles_default, {
-        get id() {
-          return `variants-styles-${props.content?.id}`;
-        },
+        id: "builderio-variants",
         get styles() {
           return hideVariantsStyleString();
         }
       }), createComponent(inlined_script_default, {
+        id: "builderio-variants-visibility",
         get scriptStr() {
           return updateCookieAndStylesScriptStr();
         }

package/lib/node/dev.jsx

@@ -984,7 +984,7 @@ var getSizesForBreakpoints = ({
 
 // src/components/inlined-styles.tsx
 function InlinedStyles(props) {
-  return <style innerHTML={props.styles} id={props.id} />;
+  return <style innerHTML={props.styles} data-id={props.id} />;
 }
 var Inlined_styles_default = InlinedStyles;
 
@@ -1050,7 +1050,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   });
-  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -1585,7 +1585,10 @@ function Columns(props) {
     style={columnsCssVars()}
     {...{}}
   >
-    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
+    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default
+      id="builderio-columns"
+      styles={columnsStyles()}
+    /></Show6>
     <For4 each={props.columns}>{(column, _index) => {
       const index = _index();
       return <Dynamic_renderer_default
@@ -3639,7 +3642,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -3656,7 +3659,7 @@ var getUpdateVariantVisibilityScript = ({
 
 // src/components/inlined-script.tsx
 function InlinedScript(props) {
-  return <script innerHTML={props.scriptStr} id={props.id || ""} />;
+  return <script innerHTML={props.scriptStr} data-id={props.id} />;
 }
 var Inlined_script_default = InlinedScript;
 
@@ -3845,7 +3848,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4156,7 +4160,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -4750,7 +4754,10 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim()
   );
-  return <Inlined_styles_default styles={injectedStyles()} />;
+  return <Inlined_styles_default
+    id="builderio-content"
+    styles={injectedStyles()}
+  />;
 }
 var Styles_default = ContentStyles;
 
@@ -4873,7 +4880,10 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default
+      id="builderio-variant-visibility"
+      scriptStr={scriptStr()}
+    /></Show11>
     <Show11 when={TARGET !== "reactNative"}><Styles_default
       isNestedRender={props.isNestedRender}
       contentId={builderContextSignal().content?.id}
@@ -4923,13 +4933,17 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default
+      id="builderio-init-variants-fns"
+      scriptStr={getInitVariantsFnsScriptString()}
+    /></Show12>
     <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
-        id={`variants-styles-${props.content?.id}`}
+        id="builderio-variants"
         styles={hideVariantsStyleString()}
       />
       <Inlined_script_default
+        id="builderio-variants-visibility"
         scriptStr={updateCookieAndStylesScriptStr()}
       />
       <For7 each={getVariants(props.content)}>{(variant, _index) => {

package/lib/node/index.js

@@ -989,7 +989,7 @@ function InlinedStyles(props) {
     effect((_p$) => {
       const _v$ = props.styles, _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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -1060,6 +1060,7 @@ function BlockStyles(props) {
     },
     get children() {
       return createComponent(inlined_styles_default, {
+        id: "builderio-block",
         get styles() {
           return css5();
         }
@@ -1776,6 +1777,7 @@ function Columns(props) {
       when: TARGET !== "reactNative",
       get children() {
         return createComponent(inlined_styles_default, {
+          id: "builderio-columns",
           get styles() {
             return columnsStyles();
           }
@@ -4043,7 +4045,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -4062,9 +4064,9 @@ function InlinedScript(props) {
   return (() => {
     const _el$ = _tmpl$16();
     effect((_p$) => {
-      const _v$ = props.scriptStr, _v$2 = props.id || "";
+      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);
+      _v$2 !== _p$._v$2 && setAttribute(_el$, "data-id", _p$._v$2 = _v$2);
       return _p$;
     }, {
       _v$: void 0,
@@ -4247,7 +4249,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4555,7 +4558,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -5135,6 +5138,7 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim());
   return createComponent(inlined_styles_default, {
+    id: "builderio-content",
     get styles() {
       return injectedStyles();
     }
@@ -5288,6 +5292,7 @@ function ContentComponent(props) {
             },
             get children() {
               return createComponent(inlined_script_default, {
+                id: "builderio-variant-visibility",
                 get scriptStr() {
                   return scriptStr();
                 }
@@ -5365,8 +5370,9 @@ function ContentVariants(props) {
     },
     get children() {
       return createComponent(inlined_script_default, {
+        id: "builderio-init-variants-fns",
         get scriptStr() {
-          return getScriptString();
+          return getInitVariantsFnsScriptString();
         }
       });
     }
@@ -5376,13 +5382,12 @@ function ContentVariants(props) {
     },
     get children() {
       return [createComponent(inlined_styles_default, {
-        get id() {
-          return `variants-styles-${props.content?.id}`;
-        },
+        id: "builderio-variants",
         get styles() {
           return hideVariantsStyleString();
         }
       }), createComponent(inlined_script_default, {
+        id: "builderio-variants-visibility",
         get scriptStr() {
           return updateCookieAndStylesScriptStr();
         }

package/lib/node/index.jsx

@@ -977,7 +977,7 @@ var getSizesForBreakpoints = ({
 
 // src/components/inlined-styles.tsx
 function InlinedStyles(props) {
-  return <style innerHTML={props.styles} id={props.id} />;
+  return <style innerHTML={props.styles} data-id={props.id} />;
 }
 var Inlined_styles_default = InlinedStyles;
 
@@ -1043,7 +1043,7 @@ function BlockStyles(props) {
     }) : "";
     return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
   });
-  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
+  return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
 }
 var Block_styles_default = BlockStyles;
 
@@ -1578,7 +1578,10 @@ function Columns(props) {
     style={columnsCssVars()}
     {...{}}
   >
-    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
+    <Show6 when={TARGET !== "reactNative"}><Inlined_styles_default
+      id="builderio-columns"
+      styles={columnsStyles()}
+    /></Show6>
     <For4 each={props.columns}>{(column, _index) => {
       const index = _index();
       return <Dynamic_renderer_default
@@ -3628,7 +3631,7 @@ var checkShouldRenderVariants = ({
 };
 var getIsHydrationTarget = (target) => target === "react" || target === "reactNative";
 var isHydrationTarget = getIsHydrationTarget(TARGET);
-var getScriptString = () => `
+var getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `;
@@ -3645,7 +3648,7 @@ var getUpdateVariantVisibilityScript = ({
 
 // src/components/inlined-script.tsx
 function InlinedScript(props) {
-  return <script innerHTML={props.scriptStr} id={props.id || ""} />;
+  return <script innerHTML={props.scriptStr} data-id={props.id} />;
 }
 var Inlined_script_default = InlinedScript;
 
@@ -3832,7 +3835,8 @@ async function fetchOneEntry(options) {
 }
 var _fetchContent = async (options) => {
   const url = generateContentUrl(options);
-  const res = await fetch2(url.href);
+  const _fetch = options.fetch ?? fetch2;
+  const res = await _fetch(url.href, options.fetchOptions);
   const content = await res.json();
   return content;
 };
@@ -4140,7 +4144,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.14";
+var SDK_VERSION = "1.0.16";
 
 // src/functions/register.ts
 var registry = {};
@@ -4732,7 +4736,10 @@ ${getFontCss({
 ${getDefaultStyles(props.isNestedRender)}
 `.trim()
   );
-  return <Inlined_styles_default styles={injectedStyles()} />;
+  return <Inlined_styles_default
+    id="builderio-content"
+    styles={injectedStyles()}
+  />;
 }
 var Styles_default = ContentStyles;
 
@@ -4855,7 +4862,10 @@ function ContentComponent(props) {
       setBuilderContextSignal
     }}
   >
-    <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
+    <Show11 when={props.isSsrAbTest}><Inlined_script_default
+      id="builderio-variant-visibility"
+      scriptStr={scriptStr()}
+    /></Show11>
     <Show11 when={TARGET !== "reactNative"}><Styles_default
       isNestedRender={props.isNestedRender}
       contentId={builderContextSignal().content?.id}
@@ -4905,13 +4915,17 @@ function ContentVariants(props) {
     setShouldRenderVariants(false);
   });
   return <>
-    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
+    <Show12 when={!props.isNestedRender && TARGET !== "reactNative"}><Inlined_script_default
+      id="builderio-init-variants-fns"
+      scriptStr={getInitVariantsFnsScriptString()}
+    /></Show12>
     <Show12 when={shouldRenderVariants()}>
       <Inlined_styles_default
-        id={`variants-styles-${props.content?.id}`}
+        id="builderio-variants"
         styles={hideVariantsStyleString()}
       />
       <Inlined_script_default
+        id="builderio-variants-visibility"
         scriptStr={updateCookieAndStylesScriptStr()}
       />
       <For7 each={getVariants(props.content)}>{(variant, _index) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/sdk-solid",
-  "version": "1.0.14",
+  "version": "1.0.16",
   "description": "",
   "files": [
     "dist",