@builder.io/sdk-svelte 5.1.1 → 5.2.2

package/lib/browser/blocks/symbol/symbol.helpers.d.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
     content?: BuilderContent;
     inline?: boolean;
     dynamic?: boolean;
+    ownerId?: string;
+    global?: boolean;
 }
 export declare const fetchSymbolContent: ({ builderContextValue, symbol }: {
     symbol: SymbolInfo | undefined;

package/lib/browser/blocks/symbol/symbol.helpers.js

@@ -15,7 +15,7 @@ export const fetchSymbolContent = async ({ builderContextValue, symbol }) => {
         builderContextValue?.apiKey) {
         return fetchOneEntry({
             model: symbol.model,
-            apiKey: builderContextValue.apiKey,
+            apiKey: symbol.global && symbol.ownerId ? symbol.ownerId : builderContextValue.apiKey,
             apiVersion: builderContextValue.apiVersion,
             ...(symbol?.entry && {
                 query: {

package/lib/browser/blocks/symbol/symbol.svelte

@@ -65,7 +65,9 @@ $: onUpdateFn_0(...[symbol]);
     nonce={$builderContext.nonce}
     isNestedRender={true}
     apiVersion={$builderContext.apiVersion}
-    apiKey={$builderContext.apiKey}
+    apiKey={symbol?.global && symbol?.ownerId
+      ? symbol.ownerId
+      : $builderContext.apiKey}
     context={{
       ...$builderContext.context,
       symbolId: builderBlock?.id,

package/lib/browser/blocks/symbol/symbol.types.d.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
     content?: BuilderContent;
     inline?: boolean;
     dynamic?: boolean;
+    ownerId?: string;
+    global?: boolean;
 }
 export interface SymbolProps extends BuilderComponentsProp, BuilderDataProps, BuilderLinkComponentProp {
     symbol?: SymbolInfo;

package/lib/browser/components/block/components/component-ref/component-ref.svelte

@@ -4,13 +4,16 @@ import InteractiveElement from "../interactive-element.svelte";
 import { getWrapperProps } from "./component-ref.helpers";
 export let isInteractive;
 export let componentRef;
+export let blockChildren;
 export let componentOptions;
 export let builderBlock;
 export let context;
 export let linkComponent;
 export let includeBlockProps;
-export let blockChildren;
 export let registeredComponents;
+$: blockChildrenToRender = () => {
+    return componentRef ? blockChildren : [];
+};
 let shouldUpdate = false;
 let Wrapper = isInteractive ? InteractiveElement : componentRef;
 </script>
@@ -29,10 +32,8 @@ let Wrapper = isInteractive ? InteractiveElement : componentRef;
       contextValue: $context,
     })}
   >
-    {#if componentRef}
-      {#each blockChildren as child (child.id)}
-        <Block block={child} {context} {registeredComponents} {linkComponent} />
-      {/each}
-    {/if}</svelte:component
-  >
+    {#each blockChildrenToRender() as child (child.id)}
+      <Block block={child} {context} {registeredComponents} {linkComponent} />
+    {/each}
+  </svelte:component>
 {/if}

package/lib/browser/components/block/components/component-ref/component-ref.svelte.d.ts

@@ -4,12 +4,12 @@ declare const __propDef: {
     props: {
         isInteractive: ComponentProps["isInteractive"];
         componentRef: ComponentProps["componentRef"];
+        blockChildren: ComponentProps["blockChildren"];
         componentOptions: ComponentProps["componentOptions"];
         builderBlock: ComponentProps["builderBlock"];
         context: ComponentProps["context"];
         linkComponent: ComponentProps["linkComponent"];
         includeBlockProps: ComponentProps["includeBlockProps"];
-        blockChildren: ComponentProps["blockChildren"];
         registeredComponents: ComponentProps["registeredComponents"];
     };
     events: {

package/lib/browser/components/content-variants/content-variants.svelte

@@ -8,7 +8,7 @@ import { getDefaultCanTrack } from "../../helpers/canTrack";
 import ContentComponent from "../content/content.svelte";
 import InlinedScript from "../inlined-script.svelte";
 import InlinedStyles from "../inlined-styles.svelte";
-import { checkShouldRenderVariants, getInitVariantsFnsScriptString, getUpdateCookieAndStylesScript, getVariants, } from "./helpers";
+import { checkShouldRenderVariants, getInitVariantsFnsScriptString, getUpdateCookieAndStylesScript, getVariants, removeDuplicateScript, } from "./helpers";
 export let canTrack = undefined;
 export let content;
 export let isNestedRender = undefined;
@@ -65,17 +65,23 @@ onMount(() => {
 {#if !isNestedRender && TARGET !== "reactNative"}
   <InlinedScript
     id="builderio-init-variants-fns"
-    scriptStr={getInitVariantsFnsScriptString()}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-variants-fns",
+      getInitVariantsFnsScriptString()
+    )}
     nonce={nonce || ""}
   />
+{/if}
 
-  {#if SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
-    <InlinedScript
-      id="builderio-init-personalization-variants-fns"
-      nonce={nonce || ""}
-      scriptStr={getInitPersonalizationVariantsFnsScriptString()}
-    />
-  {/if}
+{#if !isNestedRender && TARGET !== "reactNative" && SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
+  <InlinedScript
+    id="builderio-init-personalization-variants-fns"
+    nonce={nonce || ""}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-personalization-variants-fns",
+      getInitPersonalizationVariantsFnsScriptString()
+    )}
+  />
 {/if}
 
 {#if shouldRenderVariants}

package/lib/browser/components/content-variants/helpers.d.ts

@@ -32,6 +32,7 @@ type VariantData = {
     id: string;
     testRatio?: number;
 };
+export declare const removeDuplicateScript: (id: string, scriptStr: string) => string;
 export declare const getInitVariantsFnsScriptString: () => string;
 export declare const getUpdateCookieAndStylesScript: (variants: VariantData[], contentId: string) => string;
 export declare const getUpdateVariantVisibilityScript: ({ contentId, variationId }: {

package/lib/browser/components/content-variants/helpers.js

@@ -43,6 +43,37 @@ export const checkShouldRenderVariants = ({ canTrack, content }) => {
 const getIsHydrationTarget = (target) => target === 'react' || target === 'reactNative';
 const isAngularSDK = TARGET === 'angular';
 const isHydrationTarget = getIsHydrationTarget(TARGET);
+export const removeDuplicateScript = (id, scriptStr) => `
+  (function() {
+    var selector = 'script[data-id="${id}"]';
+    var scriptKey = '__builderioScriptInitialized_${id}';
+    var observerKey = '__builderioScriptObserver_${id}';
+
+    // Synchronously remove any duplicates already in the DOM
+    var existing = document.querySelectorAll(selector);
+    existing.forEach(function(script, index) {
+      if (index > 0) {
+        script.parentNode && script.parentNode.removeChild(script);
+      }
+    });
+
+    // Watch for duplicates added later (e.g. RSC streaming chunks)
+    if (!window[observerKey] && typeof MutationObserver !== 'undefined') {
+      window[observerKey] = new MutationObserver(function() {
+        var all = document.querySelectorAll(selector);
+        for (var i = 1; i < all.length; i++) {
+          all[i].parentNode && all[i].parentNode.removeChild(all[i]);
+        }
+      });
+      window[observerKey].observe(document.documentElement, { childList: true, subtree: true });
+    }
+
+    if (!window[scriptKey]) {
+      window[scriptKey] = true;
+      ${scriptStr}
+    }
+  })();
+`;
 export const getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}

package/lib/browser/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "5.1.1";
+export declare const SDK_VERSION = "5.2.2";

package/lib/browser/constants/sdk-version.js

@@ -1 +1 @@
-export const SDK_VERSION = "5.1.1";
+export const SDK_VERSION = "5.2.2";

package/lib/edge/blocks/symbol/symbol.helpers.d.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
     content?: BuilderContent;
     inline?: boolean;
     dynamic?: boolean;
+    ownerId?: string;
+    global?: boolean;
 }
 export declare const fetchSymbolContent: ({ builderContextValue, symbol }: {
     symbol: SymbolInfo | undefined;

package/lib/edge/blocks/symbol/symbol.helpers.js

@@ -15,7 +15,7 @@ export const fetchSymbolContent = async ({ builderContextValue, symbol }) => {
         builderContextValue?.apiKey) {
         return fetchOneEntry({
             model: symbol.model,
-            apiKey: builderContextValue.apiKey,
+            apiKey: symbol.global && symbol.ownerId ? symbol.ownerId : builderContextValue.apiKey,
             apiVersion: builderContextValue.apiVersion,
             ...(symbol?.entry && {
                 query: {

package/lib/edge/blocks/symbol/symbol.svelte

@@ -65,7 +65,9 @@ $: onUpdateFn_0(...[symbol]);
     nonce={$builderContext.nonce}
     isNestedRender={true}
     apiVersion={$builderContext.apiVersion}
-    apiKey={$builderContext.apiKey}
+    apiKey={symbol?.global && symbol?.ownerId
+      ? symbol.ownerId
+      : $builderContext.apiKey}
     context={{
       ...$builderContext.context,
       symbolId: builderBlock?.id,

package/lib/edge/blocks/symbol/symbol.types.d.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
     content?: BuilderContent;
     inline?: boolean;
     dynamic?: boolean;
+    ownerId?: string;
+    global?: boolean;
 }
 export interface SymbolProps extends BuilderComponentsProp, BuilderDataProps, BuilderLinkComponentProp {
     symbol?: SymbolInfo;

package/lib/edge/components/block/components/component-ref/component-ref.svelte

@@ -4,13 +4,16 @@ import InteractiveElement from "../interactive-element.svelte";
 import { getWrapperProps } from "./component-ref.helpers";
 export let isInteractive;
 export let componentRef;
+export let blockChildren;
 export let componentOptions;
 export let builderBlock;
 export let context;
 export let linkComponent;
 export let includeBlockProps;
-export let blockChildren;
 export let registeredComponents;
+$: blockChildrenToRender = () => {
+    return componentRef ? blockChildren : [];
+};
 let shouldUpdate = false;
 let Wrapper = isInteractive ? InteractiveElement : componentRef;
 </script>
@@ -29,10 +32,8 @@ let Wrapper = isInteractive ? InteractiveElement : componentRef;
       contextValue: $context,
     })}
   >
-    {#if componentRef}
-      {#each blockChildren as child (child.id)}
-        <Block block={child} {context} {registeredComponents} {linkComponent} />
-      {/each}
-    {/if}</svelte:component
-  >
+    {#each blockChildrenToRender() as child (child.id)}
+      <Block block={child} {context} {registeredComponents} {linkComponent} />
+    {/each}
+  </svelte:component>
 {/if}

package/lib/edge/components/block/components/component-ref/component-ref.svelte.d.ts

@@ -4,12 +4,12 @@ declare const __propDef: {
     props: {
         isInteractive: ComponentProps["isInteractive"];
         componentRef: ComponentProps["componentRef"];
+        blockChildren: ComponentProps["blockChildren"];
         componentOptions: ComponentProps["componentOptions"];
         builderBlock: ComponentProps["builderBlock"];
         context: ComponentProps["context"];
         linkComponent: ComponentProps["linkComponent"];
         includeBlockProps: ComponentProps["includeBlockProps"];
-        blockChildren: ComponentProps["blockChildren"];
         registeredComponents: ComponentProps["registeredComponents"];
     };
     events: {

package/lib/edge/components/content-variants/content-variants.svelte

@@ -8,7 +8,7 @@ import { getDefaultCanTrack } from "../../helpers/canTrack";
 import ContentComponent from "../content/content.svelte";
 import InlinedScript from "../inlined-script.svelte";
 import InlinedStyles from "../inlined-styles.svelte";
-import { checkShouldRenderVariants, getInitVariantsFnsScriptString, getUpdateCookieAndStylesScript, getVariants, } from "./helpers";
+import { checkShouldRenderVariants, getInitVariantsFnsScriptString, getUpdateCookieAndStylesScript, getVariants, removeDuplicateScript, } from "./helpers";
 export let canTrack = undefined;
 export let content;
 export let isNestedRender = undefined;
@@ -65,17 +65,23 @@ onMount(() => {
 {#if !isNestedRender && TARGET !== "reactNative"}
   <InlinedScript
     id="builderio-init-variants-fns"
-    scriptStr={getInitVariantsFnsScriptString()}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-variants-fns",
+      getInitVariantsFnsScriptString()
+    )}
     nonce={nonce || ""}
   />
+{/if}
 
-  {#if SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
-    <InlinedScript
-      id="builderio-init-personalization-variants-fns"
-      nonce={nonce || ""}
-      scriptStr={getInitPersonalizationVariantsFnsScriptString()}
-    />
-  {/if}
+{#if !isNestedRender && TARGET !== "reactNative" && SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
+  <InlinedScript
+    id="builderio-init-personalization-variants-fns"
+    nonce={nonce || ""}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-personalization-variants-fns",
+      getInitPersonalizationVariantsFnsScriptString()
+    )}
+  />
 {/if}
 
 {#if shouldRenderVariants}

package/lib/edge/components/content-variants/helpers.d.ts

@@ -32,6 +32,7 @@ type VariantData = {
     id: string;
     testRatio?: number;
 };
+export declare const removeDuplicateScript: (id: string, scriptStr: string) => string;
 export declare const getInitVariantsFnsScriptString: () => string;
 export declare const getUpdateCookieAndStylesScript: (variants: VariantData[], contentId: string) => string;
 export declare const getUpdateVariantVisibilityScript: ({ contentId, variationId }: {

package/lib/edge/components/content-variants/helpers.js

@@ -43,6 +43,37 @@ export const checkShouldRenderVariants = ({ canTrack, content }) => {
 const getIsHydrationTarget = (target) => target === 'react' || target === 'reactNative';
 const isAngularSDK = TARGET === 'angular';
 const isHydrationTarget = getIsHydrationTarget(TARGET);
+export const removeDuplicateScript = (id, scriptStr) => `
+  (function() {
+    var selector = 'script[data-id="${id}"]';
+    var scriptKey = '__builderioScriptInitialized_${id}';
+    var observerKey = '__builderioScriptObserver_${id}';
+
+    // Synchronously remove any duplicates already in the DOM
+    var existing = document.querySelectorAll(selector);
+    existing.forEach(function(script, index) {
+      if (index > 0) {
+        script.parentNode && script.parentNode.removeChild(script);
+      }
+    });
+
+    // Watch for duplicates added later (e.g. RSC streaming chunks)
+    if (!window[observerKey] && typeof MutationObserver !== 'undefined') {
+      window[observerKey] = new MutationObserver(function() {
+        var all = document.querySelectorAll(selector);
+        for (var i = 1; i < all.length; i++) {
+          all[i].parentNode && all[i].parentNode.removeChild(all[i]);
+        }
+      });
+      window[observerKey].observe(document.documentElement, { childList: true, subtree: true });
+    }
+
+    if (!window[scriptKey]) {
+      window[scriptKey] = true;
+      ${scriptStr}
+    }
+  })();
+`;
 export const getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}

package/lib/edge/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "5.1.1";
+export declare const SDK_VERSION = "5.2.2";

package/lib/edge/constants/sdk-version.js

@@ -1 +1 @@
-export const SDK_VERSION = "5.1.1";
+export const SDK_VERSION = "5.2.2";

package/lib/node/blocks/symbol/symbol.helpers.d.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
     content?: BuilderContent;
     inline?: boolean;
     dynamic?: boolean;
+    ownerId?: string;
+    global?: boolean;
 }
 export declare const fetchSymbolContent: ({ builderContextValue, symbol }: {
     symbol: SymbolInfo | undefined;

package/lib/node/blocks/symbol/symbol.helpers.js

@@ -15,7 +15,7 @@ export const fetchSymbolContent = async ({ builderContextValue, symbol }) => {
         builderContextValue?.apiKey) {
         return fetchOneEntry({
             model: symbol.model,
-            apiKey: builderContextValue.apiKey,
+            apiKey: symbol.global && symbol.ownerId ? symbol.ownerId : builderContextValue.apiKey,
             apiVersion: builderContextValue.apiVersion,
             ...(symbol?.entry && {
                 query: {

package/lib/node/blocks/symbol/symbol.svelte

@@ -65,7 +65,9 @@ $: onUpdateFn_0(...[symbol]);
     nonce={$builderContext.nonce}
     isNestedRender={true}
     apiVersion={$builderContext.apiVersion}
-    apiKey={$builderContext.apiKey}
+    apiKey={symbol?.global && symbol?.ownerId
+      ? symbol.ownerId
+      : $builderContext.apiKey}
     context={{
       ...$builderContext.context,
       symbolId: builderBlock?.id,

package/lib/node/blocks/symbol/symbol.types.d.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
     content?: BuilderContent;
     inline?: boolean;
     dynamic?: boolean;
+    ownerId?: string;
+    global?: boolean;
 }
 export interface SymbolProps extends BuilderComponentsProp, BuilderDataProps, BuilderLinkComponentProp {
     symbol?: SymbolInfo;

package/lib/node/components/block/components/component-ref/component-ref.svelte

@@ -4,13 +4,16 @@ import InteractiveElement from "../interactive-element.svelte";
 import { getWrapperProps } from "./component-ref.helpers";
 export let isInteractive;
 export let componentRef;
+export let blockChildren;
 export let componentOptions;
 export let builderBlock;
 export let context;
 export let linkComponent;
 export let includeBlockProps;
-export let blockChildren;
 export let registeredComponents;
+$: blockChildrenToRender = () => {
+    return componentRef ? blockChildren : [];
+};
 let shouldUpdate = false;
 let Wrapper = isInteractive ? InteractiveElement : componentRef;
 </script>
@@ -29,10 +32,8 @@ let Wrapper = isInteractive ? InteractiveElement : componentRef;
       contextValue: $context,
     })}
   >
-    {#if componentRef}
-      {#each blockChildren as child (child.id)}
-        <Block block={child} {context} {registeredComponents} {linkComponent} />
-      {/each}
-    {/if}</svelte:component
-  >
+    {#each blockChildrenToRender() as child (child.id)}
+      <Block block={child} {context} {registeredComponents} {linkComponent} />
+    {/each}
+  </svelte:component>
 {/if}

package/lib/node/components/block/components/component-ref/component-ref.svelte.d.ts

@@ -4,12 +4,12 @@ declare const __propDef: {
     props: {
         isInteractive: ComponentProps["isInteractive"];
         componentRef: ComponentProps["componentRef"];
+        blockChildren: ComponentProps["blockChildren"];
         componentOptions: ComponentProps["componentOptions"];
         builderBlock: ComponentProps["builderBlock"];
         context: ComponentProps["context"];
         linkComponent: ComponentProps["linkComponent"];
         includeBlockProps: ComponentProps["includeBlockProps"];
-        blockChildren: ComponentProps["blockChildren"];
         registeredComponents: ComponentProps["registeredComponents"];
     };
     events: {

package/lib/node/components/content-variants/content-variants.svelte

@@ -8,7 +8,7 @@ import { getDefaultCanTrack } from "../../helpers/canTrack";
 import ContentComponent from "../content/content.svelte";
 import InlinedScript from "../inlined-script.svelte";
 import InlinedStyles from "../inlined-styles.svelte";
-import { checkShouldRenderVariants, getInitVariantsFnsScriptString, getUpdateCookieAndStylesScript, getVariants, } from "./helpers";
+import { checkShouldRenderVariants, getInitVariantsFnsScriptString, getUpdateCookieAndStylesScript, getVariants, removeDuplicateScript, } from "./helpers";
 export let canTrack = undefined;
 export let content;
 export let isNestedRender = undefined;
@@ -65,17 +65,23 @@ onMount(() => {
 {#if !isNestedRender && TARGET !== "reactNative"}
   <InlinedScript
     id="builderio-init-variants-fns"
-    scriptStr={getInitVariantsFnsScriptString()}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-variants-fns",
+      getInitVariantsFnsScriptString()
+    )}
     nonce={nonce || ""}
   />
+{/if}
 
-  {#if SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
-    <InlinedScript
-      id="builderio-init-personalization-variants-fns"
-      nonce={nonce || ""}
-      scriptStr={getInitPersonalizationVariantsFnsScriptString()}
-    />
-  {/if}
+{#if !isNestedRender && TARGET !== "reactNative" && SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
+  <InlinedScript
+    id="builderio-init-personalization-variants-fns"
+    nonce={nonce || ""}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-personalization-variants-fns",
+      getInitPersonalizationVariantsFnsScriptString()
+    )}
+  />
 {/if}
 
 {#if shouldRenderVariants}

package/lib/node/components/content-variants/helpers.d.ts

@@ -32,6 +32,7 @@ type VariantData = {
     id: string;
     testRatio?: number;
 };
+export declare const removeDuplicateScript: (id: string, scriptStr: string) => string;
 export declare const getInitVariantsFnsScriptString: () => string;
 export declare const getUpdateCookieAndStylesScript: (variants: VariantData[], contentId: string) => string;
 export declare const getUpdateVariantVisibilityScript: ({ contentId, variationId }: {

package/lib/node/components/content-variants/helpers.js

@@ -43,6 +43,37 @@ export const checkShouldRenderVariants = ({ canTrack, content }) => {
 const getIsHydrationTarget = (target) => target === 'react' || target === 'reactNative';
 const isAngularSDK = TARGET === 'angular';
 const isHydrationTarget = getIsHydrationTarget(TARGET);
+export const removeDuplicateScript = (id, scriptStr) => `
+  (function() {
+    var selector = 'script[data-id="${id}"]';
+    var scriptKey = '__builderioScriptInitialized_${id}';
+    var observerKey = '__builderioScriptObserver_${id}';
+
+    // Synchronously remove any duplicates already in the DOM
+    var existing = document.querySelectorAll(selector);
+    existing.forEach(function(script, index) {
+      if (index > 0) {
+        script.parentNode && script.parentNode.removeChild(script);
+      }
+    });
+
+    // Watch for duplicates added later (e.g. RSC streaming chunks)
+    if (!window[observerKey] && typeof MutationObserver !== 'undefined') {
+      window[observerKey] = new MutationObserver(function() {
+        var all = document.querySelectorAll(selector);
+        for (var i = 1; i < all.length; i++) {
+          all[i].parentNode && all[i].parentNode.removeChild(all[i]);
+        }
+      });
+      window[observerKey].observe(document.documentElement, { childList: true, subtree: true });
+    }
+
+    if (!window[scriptKey]) {
+      window[scriptKey] = true;
+      ${scriptStr}
+    }
+  })();
+`;
 export const getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}

package/lib/node/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "5.1.1";
+export declare const SDK_VERSION = "5.2.2";

package/lib/node/constants/sdk-version.js

@@ -1 +1 @@
-export const SDK_VERSION = "5.1.1";
+export const SDK_VERSION = "5.2.2";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-svelte",
   "description": "Builder.io SDK for Svelte",
-  "version": "5.1.1",
+  "version": "5.2.2",
   "type": "module",
   "files": [
     "lib",

package/src/blocks/symbol/symbol.helpers.ts

@@ -9,6 +9,8 @@ export interface SymbolInfo {
   content?: BuilderContent;
   inline?: boolean;
   dynamic?: boolean;
+  ownerId?: string;
+  global?: boolean;
 }
 export const fetchSymbolContent = async ({
   builderContextValue,
@@ -31,7 +33,7 @@ export const fetchSymbolContent = async ({
   builderContextValue?.apiKey) {
     return fetchOneEntry({
       model: symbol.model,
-      apiKey: builderContextValue.apiKey,
+      apiKey: symbol.global && symbol.ownerId ? symbol.ownerId : builderContextValue.apiKey,
       apiVersion: builderContextValue.apiVersion,
       ...(symbol?.entry && {
         query: {

package/src/blocks/symbol/symbol.svelte

@@ -76,7 +76,9 @@
     nonce={$builderContext.nonce}
     isNestedRender={true}
     apiVersion={$builderContext.apiVersion}
-    apiKey={$builderContext.apiKey}
+    apiKey={symbol?.global && symbol?.ownerId
+      ? symbol.ownerId
+      : $builderContext.apiKey}
     context={{
       ...$builderContext.context,
       symbolId: builderBlock?.id,

package/src/blocks/symbol/symbol.types.ts

@@ -7,6 +7,8 @@ export interface SymbolInfo {
   content?: BuilderContent;
   inline?: boolean;
   dynamic?: boolean;
+  ownerId?: string;
+  global?: boolean;
 }
 export interface SymbolProps extends BuilderComponentsProp, BuilderDataProps, BuilderLinkComponentProp {
   symbol?: SymbolInfo;

package/src/components/block/components/component-ref/component-ref.svelte

@@ -7,14 +7,18 @@
 
   export let isInteractive: ComponentProps["isInteractive"];
   export let componentRef: ComponentProps["componentRef"];
+  export let blockChildren: ComponentProps["blockChildren"];
   export let componentOptions: ComponentProps["componentOptions"];
   export let builderBlock: ComponentProps["builderBlock"];
   export let context: ComponentProps["context"];
   export let linkComponent: ComponentProps["linkComponent"];
   export let includeBlockProps: ComponentProps["includeBlockProps"];
-  export let blockChildren: ComponentProps["blockChildren"];
   export let registeredComponents: ComponentProps["registeredComponents"];
 
+  $: blockChildrenToRender = () => {
+    return componentRef ? blockChildren : [];
+  };
+
   let shouldUpdate = false;
   let Wrapper = isInteractive ? InteractiveElement : componentRef;
 </script>
@@ -33,10 +37,8 @@
       contextValue: $context,
     })}
   >
-    {#if componentRef}
-      {#each blockChildren as child (child.id)}
-        <Block block={child} {context} {registeredComponents} {linkComponent} />
-      {/each}
-    {/if}</svelte:component
-  >
+    {#each blockChildrenToRender() as child (child.id)}
+      <Block block={child} {context} {registeredComponents} {linkComponent} />
+    {/each}
+  </svelte:component>
 {/if}

package/src/components/content-variants/content-variants.svelte

@@ -26,6 +26,7 @@
     getInitVariantsFnsScriptString,
     getUpdateCookieAndStylesScript,
     getVariants,
+    removeDuplicateScript,
   } from "./helpers";
 
   export let canTrack: VariantsProviderProps["canTrack"] = undefined;
@@ -95,17 +96,23 @@
 {#if !isNestedRender && TARGET !== "reactNative"}
   <InlinedScript
     id="builderio-init-variants-fns"
-    scriptStr={getInitVariantsFnsScriptString()}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-variants-fns",
+      getInitVariantsFnsScriptString()
+    )}
     nonce={nonce || ""}
   />
+{/if}
 
-  {#if SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
-    <InlinedScript
-      id="builderio-init-personalization-variants-fns"
-      nonce={nonce || ""}
-      scriptStr={getInitPersonalizationVariantsFnsScriptString()}
-    />
-  {/if}
+{#if !isNestedRender && TARGET !== "reactNative" && SDKS_SUPPORTING_PERSONALIZATION.includes(TARGET)}
+  <InlinedScript
+    id="builderio-init-personalization-variants-fns"
+    nonce={nonce || ""}
+    scriptStr={removeDuplicateScript(
+      "builderio-init-personalization-variants-fns",
+      getInitPersonalizationVariantsFnsScriptString()
+    )}
+  />
 {/if}
 
 {#if shouldRenderVariants}

package/src/components/content-variants/helpers.ts

@@ -54,6 +54,37 @@ type VariantData = {
 const getIsHydrationTarget = (target: Target) => target === 'react' || target === 'reactNative';
 const isAngularSDK = TARGET === 'angular';
 const isHydrationTarget = getIsHydrationTarget(TARGET);
+export const removeDuplicateScript = (id: string, scriptStr: string) => `
+  (function() {
+    var selector = 'script[data-id="${id}"]';
+    var scriptKey = '__builderioScriptInitialized_${id}';
+    var observerKey = '__builderioScriptObserver_${id}';
+
+    // Synchronously remove any duplicates already in the DOM
+    var existing = document.querySelectorAll(selector);
+    existing.forEach(function(script, index) {
+      if (index > 0) {
+        script.parentNode && script.parentNode.removeChild(script);
+      }
+    });
+
+    // Watch for duplicates added later (e.g. RSC streaming chunks)
+    if (!window[observerKey] && typeof MutationObserver !== 'undefined') {
+      window[observerKey] = new MutationObserver(function() {
+        var all = document.querySelectorAll(selector);
+        for (var i = 1; i < all.length; i++) {
+          all[i].parentNode && all[i].parentNode.removeChild(all[i]);
+        }
+      });
+      window[observerKey].observe(document.documentElement, { childList: true, subtree: true });
+    }
+
+    if (!window[scriptKey]) {
+      window[scriptKey] = true;
+      ${scriptStr}
+    }
+  })();
+`;
 export const getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}

package/src/constants/sdk-version.ts

@@ -1 +1 @@
-export const SDK_VERSION = "5.1.1"
+export const SDK_VERSION = "5.2.2"