@builder.io/sdk-solid 2.0.8 → 2.0.13

package/lib/browser/dev.jsx

@@ -103,7 +103,13 @@ import { createContext as createContext2 } from "solid-js";
 var components_context_default = createContext2({ registeredComponents: {} });
 
 // src/components/block/block.tsx
-import { Show as Show4, For as For2, onMount, createMemo as createMemo5 } from "solid-js";
+import {
+  Show as Show4,
+  For as For2,
+  onMount,
+  createMemo as createMemo5,
+  createSignal as createSignal5
+} from "solid-js";
 
 // src/functions/get-block-component-options.ts
 function getBlockComponentOptions(block) {
@@ -113,6 +119,15 @@ function getBlockComponentOptions(block) {
   };
 }
 
+// src/helpers/omit.ts
+function omit(obj, ...values) {
+  const newObject = Object.assign({}, obj);
+  for (const key of values) {
+    delete newObject[key];
+  }
+  return newObject;
+}
+
 // src/helpers/logger.ts
 var MSG_PREFIX = "[Builder.io]: ";
 var logger = {
@@ -321,6 +336,7 @@ var shouldForceBrowserRuntimeInNode = () => {
 var chooseBrowserOrServerEval = (args) => isBrowser() || shouldForceBrowserRuntimeInNode() ? runInBrowser(args) : runInBrowser(args);
 
 // src/functions/evaluate/evaluate.ts
+var DISABLE_CACHE = true;
 var EvalCache = class _EvalCache {
   static cacheLimit = 20;
   static cache = /* @__PURE__ */ new Map();
@@ -369,7 +385,7 @@ function evaluate({
     rootState,
     localState
   };
-  if (enableCache) {
+  if (enableCache && !DISABLE_CACHE) {
     const cacheKey = EvalCache.getCacheKey(args);
     const cachedValue = EvalCache.getCachedValue(cacheKey);
     if (cachedValue) {
@@ -410,6 +426,53 @@ function transformBlock(block) {
 }
 
 // src/functions/get-processed-block.ts
+function deepCloneWithConditions(obj) {
+  if (obj === null || typeof obj !== "object") {
+    return obj;
+  }
+  if (Array.isArray(obj)) {
+    return obj.map((item) => deepCloneWithConditions(item));
+  }
+  if (obj["@type"] === "@builder.io/sdk:Element") {
+    return obj;
+  }
+  const clonedObj = {};
+  for (const key in obj) {
+    if (key !== "meta" && Object.prototype.hasOwnProperty.call(obj, key)) {
+      clonedObj[key] = deepCloneWithConditions(obj[key]);
+    }
+  }
+  return clonedObj;
+}
+var IS_SDK_WITHOUT_CACHED_PROCESSED_BLOCK = ["svelte", "vue", "angular", "qwik", "solid"].includes(TARGET);
+var getCopy = (block) => {
+  if (IS_SDK_WITHOUT_CACHED_PROCESSED_BLOCK) {
+    const copy = fastClone(block);
+    const copied = {
+      ...copy,
+      properties: {
+        ...copy.properties
+      },
+      actions: {
+        ...copy.actions
+      }
+    };
+    return copied;
+  } else {
+    const copy = deepCloneWithConditions(omit(block, "children", "meta"));
+    return {
+      ...copy,
+      properties: {
+        ...copy.properties
+      },
+      actions: {
+        ...copy.actions
+      },
+      children: block.children,
+      meta: block.meta
+    };
+  }
+};
 var evaluateBindings = ({
   block,
   context,
@@ -420,16 +483,7 @@ var evaluateBindings = ({
   if (!block.bindings) {
     return block;
   }
-  const copy = fastClone(block);
-  const copied = {
-    ...copy,
-    properties: {
-      ...copy.properties
-    },
-    actions: {
-      ...copy.actions
-    }
-  };
+  const copied = getCopy(block);
   for (const binding in block.bindings) {
     const expression = block.bindings[binding];
     const value = evaluate({
@@ -712,17 +766,9 @@ function mapStyleObjToStrIfNeeded(style) {
 // src/components/block/block.helpers.ts
 var getComponent = ({
   block,
-  context,
   registeredComponents
 }) => {
-  const componentName = getProcessedBlock({
-    block,
-    localState: context.localState,
-    rootState: context.rootState,
-    rootSetState: context.rootSetState,
-    context: context.context,
-    shouldEvaluateBindings: false
-  }).component?.name;
+  const componentName = block.component?.name;
   if (!componentName) {
     return null;
   }
@@ -869,14 +915,7 @@ var Inlined_styles_default = InlinedStyles;
 // src/components/block/components/block-styles.tsx
 function BlockStyles(props) {
   const canShowBlock = createMemo(() => {
-    const processedBlock = getProcessedBlock({
-      block: props.block,
-      localState: props.context.localState,
-      rootState: props.context.rootState,
-      rootSetState: props.context.rootSetState,
-      context: props.context.context,
-      shouldEvaluateBindings: true
-    });
+    const processedBlock = props.block;
     if (checkIsDefined(processedBlock.hide)) {
       return !processedBlock.hide;
     }
@@ -886,14 +925,7 @@ function BlockStyles(props) {
     return true;
   });
   const css = createMemo(() => {
-    const processedBlock = getProcessedBlock({
-      block: props.block,
-      localState: props.context.localState,
-      rootState: props.context.rootState,
-      rootSetState: props.context.rootSetState,
-      context: props.context.context,
-      shouldEvaluateBindings: true
-    });
+    const processedBlock = props.block;
     const styles = processedBlock.responsiveStyles;
     const content = props.context.content;
     const sizesWithUpdatedBreakpoints = getSizesForBreakpoints(
@@ -1162,12 +1194,9 @@ var Repeated_block_default = RepeatedBlock;
 
 // src/components/block/block.tsx
 function Block(props) {
-  const blockComponent = createMemo5(() => {
-    return getComponent({
-      block: props.block,
-      context: props.context,
-      registeredComponents: props.registeredComponents
-    });
+  const [_processedBlock, set_processedBlock] = createSignal5({
+    value: null,
+    update: false
   });
   const repeatItem = createMemo5(() => {
     return getRepeatItemData({
@@ -1176,7 +1205,7 @@ function Block(props) {
     });
   });
   const processedBlock = createMemo5(() => {
-    return props.block.repeat?.collection ? props.block : getProcessedBlock({
+    const blockToUse = props.block.repeat?.collection ? props.block : getProcessedBlock({
       block: props.block,
       localState: props.context.localState,
       rootState: props.context.rootState,
@@ -1184,6 +1213,13 @@ function Block(props) {
       context: props.context.context,
       shouldEvaluateBindings: true
     });
+    return blockToUse;
+  });
+  const blockComponent = createMemo5(() => {
+    return getComponent({
+      block: processedBlock(),
+      registeredComponents: props.registeredComponents
+    });
   });
   const Tag = createMemo5(() => {
     const shouldUseLink = props.block.tagName === "a" || processedBlock().properties?.href || processedBlock().href;
@@ -1241,9 +1277,24 @@ function Block(props) {
     }
   });
   return <><Show4 when={canShowBlock()}>
-    <Block_styles_default block={props.block} context={props.context} />
+    <Block_styles_default
+      block={processedBlock()}
+      context={props.context}
+    />
     <Show4
-      fallback={<Component_ref_default
+      fallback={<Show4
+        fallback={<For2 each={repeatItem()}>{(data, _index) => {
+          const index = _index();
+          return <Repeated_block_default
+            key={index}
+            repeatContext={data.context}
+            block={data.block}
+            registeredComponents={props.registeredComponents}
+            linkComponent={props.linkComponent}
+          />;
+        }}</For2>}
+        when={!repeatItem()}
+      ><Component_ref_default
         componentRef={componentRefProps().componentRef}
         componentOptions={componentRefProps().componentOptions}
         blockChildren={componentRefProps().blockChildren}
@@ -1253,7 +1304,7 @@ function Block(props) {
         builderBlock={componentRefProps().builderBlock}
         includeBlockProps={componentRefProps().includeBlockProps}
         isInteractive={componentRefProps().isInteractive}
-      />}
+      /></Show4>}
       when={!blockComponent()?.noWrap}
     ><Show4
       fallback={<For2 each={repeatItem()}>{(data, _index) => {
@@ -1299,7 +1350,7 @@ function Block(props) {
 var Block_default = Block;
 
 // src/components/blocks/blocks-wrapper.tsx
-import { createMemo as createMemo6 } from "solid-js";
+import { onMount as onMount2, createMemo as createMemo6 } from "solid-js";
 import { Dynamic as Dynamic4 } from "solid-js/web";
 function BlocksWrapper(props) {
   const className = createMemo6(() => {
@@ -1333,9 +1384,13 @@ function BlocksWrapper(props) {
       );
     }
   }
+  let blocksWrapperRef;
+  onMount2(() => {
+  });
   return <>
     <Dynamic4
-      class={className() + " dynamic-1bb6a3a2"}
+      class={className() + " dynamic-4da8c6f4"}
+      ref={blocksWrapperRef}
       builder-path={props.path}
       builder-parent-id={props.parent}
       {...{}}
@@ -1346,7 +1401,7 @@ function BlocksWrapper(props) {
       {...props.BlocksWrapperProps}
       component={props.BlocksWrapper}
     >{props.children}</Dynamic4>
-    <style>{`.dynamic-1bb6a3a2 {
+    <style>{`.dynamic-4da8c6f4 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1550,7 +1605,7 @@ function FragmentComponent(props) {
 var fragment_default = FragmentComponent;
 
 // src/blocks/image/image.tsx
-import { Show as Show7, onMount as onMount2, createMemo as createMemo8 } from "solid-js";
+import { Show as Show7, onMount as onMount3, createMemo as createMemo8 } from "solid-js";
 
 // src/blocks/image/image.helpers.ts
 function removeProtocol(path) {
@@ -1640,7 +1695,7 @@ function Image(props) {
     const out = props.aspectRatio ? aspectRatioStyles : void 0;
     return out;
   });
-  onMount2(() => {
+  onMount3(() => {
   });
   return <>
     <>
@@ -1716,10 +1771,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount6, on as on3, createEffect as createEffect3, createMemo as createMemo20, createSignal as createSignal20 } from "solid-js";
+import { onMount as onMount7, on as on4, createEffect as createEffect4, createMemo as createMemo20, createSignal as createSignal20 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import { Show as Show14, For as For9, onMount as onMount5, createSignal as createSignal19, createMemo as createMemo19 } from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount6, createSignal as createSignal19, createMemo as createMemo19 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -2659,7 +2714,8 @@ var componentInfo7 = {
     defaultValue: "children"
   }],
   shouldReceiveBuilderProps: {
-    builderContext: true
+    builderContext: true,
+    builderComponents: true
   }
 };
 
@@ -2676,6 +2732,7 @@ function Slot(props) {
     parent={props.builderContext.context?.symbolId}
     path={`symbol.data.${props.name}`}
     context={props.builderContext}
+    registeredComponents={props.builderComponents}
     blocks={props.builderContext.rootState?.[props.name]}
   /></div></>;
 }
@@ -3008,12 +3065,12 @@ var componentInfo11 = {
 };
 
 // src/blocks/custom-code/custom-code.tsx
-import { onMount as onMount3, createSignal as createSignal12 } from "solid-js";
+import { onMount as onMount4, createSignal as createSignal12 } from "solid-js";
 function CustomCode(props) {
   const [scriptsInserted, setScriptsInserted] = createSignal12([]);
   const [scriptsRun, setScriptsRun] = createSignal12([]);
   let elementRef;
-  onMount3(() => {
+  onMount4(() => {
     if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
       return;
     }
@@ -3073,7 +3130,7 @@ var componentInfo12 = {
 };
 
 // src/blocks/embed/embed.tsx
-import { on, createEffect, createMemo as createMemo13, createSignal as createSignal13 } from "solid-js";
+import { on as on2, createEffect as createEffect2, createMemo as createMemo13, createSignal as createSignal13 } from "solid-js";
 
 // src/blocks/embed/helpers.ts
 var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
@@ -3115,8 +3172,8 @@ function Embed(props) {
       findAndRunScripts();
     }
   }
-  createEffect(
-    on(() => [onUpdateFn_0_elem(), onUpdateFn_0_ranInitFn__()], onUpdateFn_0)
+  createEffect2(
+    on2(() => [onUpdateFn_0_elem(), onUpdateFn_0_ranInitFn__()], onUpdateFn_0)
   );
   return <><div class="builder-embed" ref={elem} innerHTML={props.content} /></>;
 }
@@ -4107,14 +4164,14 @@ var getDefaultRegisteredComponents = () => [{
 // src/functions/register-component.ts
 var createRegisterComponentMessage = (info) => ({
   type: "builder.registerComponent",
-  data: serializeComponentInfo(info)
+  data: serializeIncludingFunctions(info)
 });
 var serializeFn = (fnValue) => {
   const fnStr = fnValue.toString().trim();
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-function serializeComponentInfo(info) {
+function serializeIncludingFunctions(info) {
   return JSON.parse(JSON.stringify(info, (key, value) => {
     if (typeof value === "function") {
       return serializeFn(value);
@@ -4182,9 +4239,9 @@ var Inlined_script_default = InlinedScript;
 // src/components/content/components/enable-editor.tsx
 import {
   Show as Show12,
-  onMount as onMount4,
-  on as on2,
-  createEffect as createEffect2,
+  onMount as onMount5,
+  on as on3,
+  createEffect as createEffect3,
   createMemo as createMemo16,
   createSignal as createSignal16
 } from "solid-js";
@@ -4293,7 +4350,7 @@ var generateContentUrl = (options) => {
     locale,
     apiVersion = DEFAULT_API_VERSION,
     fields,
-    omit,
+    omit: omit2,
     offset,
     cacheSeconds,
     staleCacheSeconds,
@@ -4316,7 +4373,7 @@ var generateContentUrl = (options) => {
     url.searchParams.set("locale", locale);
   if (enrich)
     url.searchParams.set("enrich", String(enrich));
-  url.searchParams.set("omit", omit || "meta.componentsUsed");
+  url.searchParams.set("omit", omit2 || "meta.componentsUsed");
   if (fields) {
     url.searchParams.set("fields", fields);
   }
@@ -4689,11 +4746,14 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.8";
+var SDK_VERSION = "2.0.13";
 
 // src/functions/register.ts
 var registry = {};
 function register(type, info) {
+  if (type === "plugin") {
+    info = serializeIncludingFunctions(info);
+  }
   let typeList = registry[type];
   if (!typeList) {
     typeList = registry[type] = [];
@@ -5126,7 +5186,7 @@ function EnableEditor(props) {
     }
   }
   let elementRef;
-  onMount4(() => {
+  onMount5(() => {
     if (isBrowser()) {
       if (isEditing()) {
         window.addEventListener("message", processMessage);
@@ -5187,7 +5247,7 @@ function EnableEditor(props) {
       }
     }
   });
-  onMount4(() => {
+  onMount5(() => {
     if (!props.apiKey) {
       logger.error(
         "No API key provided to `Content` component. This can cause issues. Please provide an API key using the `apiKey` prop."
@@ -5203,13 +5263,13 @@ function EnableEditor(props) {
       mergeNewContent(props.content);
     }
   }
-  createEffect2(on2(() => [onUpdateFn_0_props_content()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_content()], onUpdateFn_0));
   const onUpdateFn_1_props_builderContextSignal_content__data__jsCode = createMemo16(() => props.builderContextSignal.content?.data?.jsCode);
   function onUpdateFn_1() {
     evaluateJsCode();
   }
-  createEffect2(
-    on2(
+  createEffect3(
+    on3(
       () => [onUpdateFn_1_props_builderContextSignal_content__data__jsCode()],
       onUpdateFn_1
     )
@@ -5218,8 +5278,8 @@ function EnableEditor(props) {
   function onUpdateFn_2() {
     runHttpRequests();
   }
-  createEffect2(
-    on2(
+  createEffect3(
+    on3(
       () => [
         onUpdateFn_2_props_builderContextSignal_content__data__httpRequests()
       ],
@@ -5232,8 +5292,8 @@ function EnableEditor(props) {
   function onUpdateFn_3() {
     emitStateUpdate();
   }
-  createEffect2(
-    on2(
+  createEffect3(
+    on3(
       () => [onUpdateFn_3_props_builderContextSignal_rootState()],
       onUpdateFn_3
     )
@@ -5244,7 +5304,7 @@ function EnableEditor(props) {
       mergeNewRootState(props.data);
     }
   }
-  createEffect2(on2(() => [onUpdateFn_4_props_data()], onUpdateFn_4));
+  createEffect3(on3(() => [onUpdateFn_4_props_data()], onUpdateFn_4));
   const onUpdateFn_5_props_locale = createMemo16(() => props.locale);
   function onUpdateFn_5() {
     if (props.locale) {
@@ -5253,7 +5313,7 @@ function EnableEditor(props) {
       });
     }
   }
-  createEffect2(on2(() => [onUpdateFn_5_props_locale()], onUpdateFn_5));
+  createEffect3(on3(() => [onUpdateFn_5_props_locale()], onUpdateFn_5));
   return <><builder_context_default.Provider value={props.builderContextSignal}><Show12 when={props.builderContextSignal.content}><Dynamic5
     class={getWrapperClassName(
       props.content?.testVariationId || props.content?.id
@@ -5355,7 +5415,7 @@ function ContentComponent(props) {
         ...acc,
         [info.name]: {
           component,
-          ...serializeComponentInfo(info)
+          ...serializeIncludingFunctions(info)
         }
       }),
       {}
@@ -5389,7 +5449,7 @@ function ContentComponent(props) {
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
-        [info.name]: serializeComponentInfo(info)
+        [info.name]: serializeIncludingFunctions(info)
       }),
       {}
     ),
@@ -5478,7 +5538,7 @@ function ContentVariants(props) {
       canTrack: getDefaultCanTrack(props.canTrack)
     });
   });
-  onMount5(() => {
+  onMount6(() => {
     setShouldRenderVariants(false);
   });
   return <><>
@@ -5606,13 +5666,13 @@ function Symbol(props) {
       }
     });
   }
-  onMount6(() => {
+  onMount7(() => {
   });
   const onUpdateFn_0_props_symbol = createMemo20(() => props.symbol);
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}