@builder.io/sdk-solid 4.0.10 → 4.1.0

package/lib/node/dev.jsx

@@ -2153,10 +2153,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount10, on as on9, createEffect as createEffect9, createMemo as createMemo20, createSignal as createSignal20 } from "solid-js";
+import { onMount as onMount10, on as on9, createEffect as createEffect9, createMemo as createMemo21, createSignal as createSignal21 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import { Show as Show16, For as For9, onMount as onMount9, createSignal as createSignal19, createMemo as createMemo19 } from "solid-js";
+import { Show as Show16, For as For9, onMount as onMount9, createSignal as createSignal20, createMemo as createMemo20 } from "solid-js";
 
 // src/blocks/personalization-container/helpers/inlined-fns.ts
 function filterWithCustomTargeting(userAttributes, query, startDate, endDate) {
@@ -2579,7 +2579,7 @@ var getDefaultCanTrack = (canTrack) => {
 };
 
 // src/components/content/content.tsx
-import { Show as Show15, createSignal as createSignal18 } from "solid-js";
+import { Show as Show15, createSignal as createSignal19 } from "solid-js";
 
 // src/blocks/accordion/component-info.ts
 var defaultTitle = {
@@ -4775,7 +4775,18 @@ var componentInfo19 = {
 };
 
 // src/blocks/img/img.tsx
+import { createMemo as createMemo15 } from "solid-js";
 function ImgComponent(props) {
+  const srcSetToUse = createMemo15(() => {
+    const url = props.imgSrc || props.image;
+    if (!url || typeof url !== "string") {
+      return void 0;
+    }
+    if (!url.match(/builder\.io/)) {
+      return void 0;
+    }
+    return getSrcSet(url);
+  });
   return <><img
     style={{
       "object-fit": props.backgroundSize || "cover",
@@ -4784,6 +4795,7 @@ function ImgComponent(props) {
     key={isEditing() && props.imgSrc || "default-key"}
     alt={props.altText}
     src={props.imgSrc || props.image}
+    srcSet={srcSetToUse()}
     {...{}}
     {...props.attributes}
   /></>;
@@ -4878,10 +4890,10 @@ var componentInfo20 = {
 };
 
 // src/blocks/video/video.tsx
-import { Show as Show13, onMount as onMount7, createSignal as createSignal15, createMemo as createMemo15 } from "solid-js";
+import { Show as Show13, onMount as onMount7, createSignal as createSignal16, createMemo as createMemo16 } from "solid-js";
 function Video(props) {
-  const [lazyVideoObserver, setLazyVideoObserver] = createSignal15(void 0);
-  const videoProps = createMemo15(() => {
+  const [lazyVideoObserver, setLazyVideoObserver] = createSignal16(void 0);
+  const videoProps = createMemo16(() => {
     return {
       ...props.autoPlay === true ? {
         autoPlay: true
@@ -4900,7 +4912,7 @@ function Video(props) {
       } : {}
     };
   });
-  const spreadProps = createMemo15(() => {
+  const spreadProps = createMemo16(() => {
     return {
       ...videoProps()
     };
@@ -5140,8 +5152,8 @@ import {
   onMount as onMount8,
   on as on8,
   createEffect as createEffect8,
-  createMemo as createMemo16,
-  createSignal as createSignal16
+  createMemo as createMemo17,
+  createSignal as createSignal17
 } from "solid-js";
 import { Dynamic as Dynamic5 } from "solid-js/web";
 
@@ -5151,7 +5163,7 @@ function getPreviewContent(_searchParams) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "4.0.10";
+var SDK_VERSION = "4.1.0";
 
 // src/helpers/sdk-headers.ts
 var getSdkHeaders = () => ({
@@ -6012,13 +6024,13 @@ var getWrapperClassName = (variationId) => {
 
 // src/components/content/components/enable-editor.tsx
 function EnableEditor(props) {
-  const [hasExecuted, setHasExecuted] = createSignal16(false);
-  const [ContentWrapper, setContentWrapper] = createSignal16(
+  const [hasExecuted, setHasExecuted] = createSignal17(false);
+  const [ContentWrapper, setContentWrapper] = createSignal17(
     props.contentWrapper || "div"
   );
-  const [httpReqsData, setHttpReqsData] = createSignal16({});
-  const [httpReqsPending, setHttpReqsPending] = createSignal16({});
-  const [clicked, setClicked] = createSignal16(false);
+  const [httpReqsData, setHttpReqsData] = createSignal17({});
+  const [httpReqsPending, setHttpReqsPending] = createSignal17({});
+  const [clicked, setClicked] = createSignal17(false);
   function mergeNewRootState(newData) {
     const combinedState = {
       ...props.builderContextSignal.rootState,
@@ -6052,7 +6064,7 @@ function EnableEditor(props) {
       content: newContentValue
     }));
   }
-  const showContentProps = createMemo16(() => {
+  const showContentProps = createMemo17(() => {
     return props.showContent ? {} : {
       hidden: true,
       "aria-hidden": true
@@ -6237,14 +6249,14 @@ function EnableEditor(props) {
       }
     }
   });
-  const onUpdateFn_0_props_content = createMemo16(() => props.content);
+  const onUpdateFn_0_props_content = createMemo17(() => props.content);
   function onUpdateFn_0() {
     if (props.content) {
       mergeNewContent(props.content);
     }
   }
   createEffect8(on8(() => [onUpdateFn_0_props_content()], onUpdateFn_0));
-  const onUpdateFn_1_props_builderContextSignal_rootState = createMemo16(
+  const onUpdateFn_1_props_builderContextSignal_rootState = createMemo17(
     () => props.builderContextSignal.rootState
   );
   function onUpdateFn_1() {
@@ -6256,14 +6268,14 @@ function EnableEditor(props) {
       onUpdateFn_1
     )
   );
-  const onUpdateFn_2_props_data = createMemo16(() => props.data);
+  const onUpdateFn_2_props_data = createMemo17(() => props.data);
   function onUpdateFn_2() {
     if (props.data) {
       mergeNewRootState(props.data);
     }
   }
   createEffect8(on8(() => [onUpdateFn_2_props_data()], onUpdateFn_2));
-  const onUpdateFn_3_props_locale = createMemo16(() => props.locale);
+  const onUpdateFn_3_props_locale = createMemo17(() => props.locale);
   function onUpdateFn_3() {
     if (props.locale) {
       mergeNewRootState({
@@ -6295,9 +6307,9 @@ function EnableEditor(props) {
 var Enable_editor_default = EnableEditor;
 
 // src/components/content/components/styles.tsx
-import { createSignal as createSignal17 } from "solid-js";
+import { createSignal as createSignal18 } from "solid-js";
 function ContentStyles(props) {
-  const [injectedStyles, setInjectedStyles] = createSignal17(
+  const [injectedStyles, setInjectedStyles] = createSignal18(
     `
 ${getCss({
       cssCode: props.cssCode,
@@ -6355,7 +6367,7 @@ var getContentInitialValue = ({
 
 // src/components/content/content.tsx
 function ContentComponent(props) {
-  const [scriptStr, setScriptStr] = createSignal18(
+  const [scriptStr, setScriptStr] = createSignal19(
     getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
       variationId: props.content?.testVariationId,
@@ -6363,7 +6375,7 @@ function ContentComponent(props) {
       contentId: props.content?.id
     })
   );
-  const [registeredComponents, setRegisteredComponents] = createSignal18(
+  const [registeredComponents, setRegisteredComponents] = createSignal19(
     [
       ...getDefaultRegisteredComponents(),
       ...props.customComponents || []
@@ -6378,7 +6390,7 @@ function ContentComponent(props) {
       {}
     )
   );
-  const [builderContextSignal, setBuilderContextSignal] = createSignal18({
+  const [builderContextSignal, setBuilderContextSignal] = createSignal19({
     content: getContentInitialValue({
       content: props.content,
       data: props.data
@@ -6486,13 +6498,13 @@ var Content_default = ContentComponent;
 
 // src/components/content-variants/content-variants.tsx
 function ContentVariants(props) {
-  const [shouldRenderVariants, setShouldRenderVariants] = createSignal19(
+  const [shouldRenderVariants, setShouldRenderVariants] = createSignal20(
     checkShouldRenderVariants2({
       canTrack: getDefaultCanTrack(props.canTrack),
       content: props.content
     })
   );
-  const updateCookieAndStylesScriptStr = createMemo19(() => {
+  const updateCookieAndStylesScriptStr = createMemo20(() => {
     return getUpdateCookieAndStylesScript(
       getVariants(props.content).map((value) => ({
         id: value.testVariationId,
@@ -6501,10 +6513,10 @@ function ContentVariants(props) {
       props.content?.id || ""
     );
   });
-  const hideVariantsStyleString = createMemo19(() => {
+  const hideVariantsStyleString = createMemo20(() => {
     return getVariants(props.content).map((value) => `.variant-${value.testVariationId} { display: none; } `).join("");
   });
-  const defaultContent = createMemo19(() => {
+  const defaultContent = createMemo20(() => {
     return shouldRenderVariants() ? {
       ...props.content,
       testVariationId: props.content?.id
@@ -6623,15 +6635,15 @@ var fetchSymbolContent = async ({
 
 // src/blocks/symbol/symbol.tsx
 function Symbol(props) {
-  const [contentToUse, setContentToUse] = createSignal20(props.symbol?.content);
-  const [symbolEntry, setSymbolEntry] = createSignal20(props.symbol?.entry);
-  const blocksWrapper = createMemo20(() => {
+  const [contentToUse, setContentToUse] = createSignal21(props.symbol?.content);
+  const [symbolEntry, setSymbolEntry] = createSignal21(props.symbol?.entry);
+  const blocksWrapper = createMemo21(() => {
     return "div";
   });
-  const contentWrapper = createMemo20(() => {
+  const contentWrapper = createMemo21(() => {
     return "div";
   });
-  const className = createMemo20(() => {
+  const className = createMemo21(() => {
     return [
       ...[props.attributes[getClassPropName()]],
       "builder-symbol",
@@ -6654,7 +6666,7 @@ function Symbol(props) {
   }
   onMount10(() => {
   });
-  const onUpdateFn_0_props_symbol = createMemo20(() => props.symbol);
+  const onUpdateFn_0_props_symbol = createMemo21(() => props.symbol);
   function onUpdateFn_0() {
     setContent();
   }

package/lib/node/index.js

@@ -5257,6 +5257,16 @@ var componentInfo19 = {
 };
 var _tmpl$20 = /* @__PURE__ */ template(`<img>`);
 function ImgComponent(props) {
+  const srcSetToUse = createMemo(() => {
+    const url = props.imgSrc || props.image;
+    if (!url || typeof url !== "string") {
+      return void 0;
+    }
+    if (!url.match(/builder\.io/)) {
+      return void 0;
+    }
+    return getSrcSet(url);
+  });
   return (() => {
     const _el$ = _tmpl$20();
     spread(_el$, mergeProps({
@@ -5274,6 +5284,9 @@ function ImgComponent(props) {
       },
       get src() {
         return props.imgSrc || props.image;
+      },
+      get srcSet() {
+        return srcSetToUse();
       }
     }, {}, () => props.attributes), false, false);
     return _el$;
@@ -5644,7 +5657,7 @@ function getPreviewContent(_searchParams) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "4.0.10";
+var SDK_VERSION = "4.1.0";
 
 // src/helpers/sdk-headers.ts
 var getSdkHeaders = () => ({

package/lib/node/index.jsx

@@ -2145,10 +2145,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount10, on as on9, createEffect as createEffect9, createMemo as createMemo20, createSignal as createSignal20 } from "solid-js";
+import { onMount as onMount10, on as on9, createEffect as createEffect9, createMemo as createMemo21, createSignal as createSignal21 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import { Show as Show16, For as For9, onMount as onMount9, createSignal as createSignal19, createMemo as createMemo19 } from "solid-js";
+import { Show as Show16, For as For9, onMount as onMount9, createSignal as createSignal20, createMemo as createMemo20 } from "solid-js";
 
 // src/blocks/personalization-container/helpers/inlined-fns.ts
 function filterWithCustomTargeting(userAttributes, query, startDate, endDate) {
@@ -2571,7 +2571,7 @@ var getDefaultCanTrack = (canTrack) => {
 };
 
 // src/components/content/content.tsx
-import { Show as Show15, createSignal as createSignal18 } from "solid-js";
+import { Show as Show15, createSignal as createSignal19 } from "solid-js";
 
 // src/blocks/accordion/component-info.ts
 var defaultTitle = {
@@ -4765,7 +4765,18 @@ var componentInfo19 = {
 };
 
 // src/blocks/img/img.tsx
+import { createMemo as createMemo15 } from "solid-js";
 function ImgComponent(props) {
+  const srcSetToUse = createMemo15(() => {
+    const url = props.imgSrc || props.image;
+    if (!url || typeof url !== "string") {
+      return void 0;
+    }
+    if (!url.match(/builder\.io/)) {
+      return void 0;
+    }
+    return getSrcSet(url);
+  });
   return <><img
     style={{
       "object-fit": props.backgroundSize || "cover",
@@ -4774,6 +4785,7 @@ function ImgComponent(props) {
     key={isEditing() && props.imgSrc || "default-key"}
     alt={props.altText}
     src={props.imgSrc || props.image}
+    srcSet={srcSetToUse()}
     {...{}}
     {...props.attributes}
   /></>;
@@ -4868,10 +4880,10 @@ var componentInfo20 = {
 };
 
 // src/blocks/video/video.tsx
-import { Show as Show13, onMount as onMount7, createSignal as createSignal15, createMemo as createMemo15 } from "solid-js";
+import { Show as Show13, onMount as onMount7, createSignal as createSignal16, createMemo as createMemo16 } from "solid-js";
 function Video(props) {
-  const [lazyVideoObserver, setLazyVideoObserver] = createSignal15(void 0);
-  const videoProps = createMemo15(() => {
+  const [lazyVideoObserver, setLazyVideoObserver] = createSignal16(void 0);
+  const videoProps = createMemo16(() => {
     return {
       ...props.autoPlay === true ? {
         autoPlay: true
@@ -4890,7 +4902,7 @@ function Video(props) {
       } : {}
     };
   });
-  const spreadProps = createMemo15(() => {
+  const spreadProps = createMemo16(() => {
     return {
       ...videoProps()
     };
@@ -5129,8 +5141,8 @@ import {
   onMount as onMount8,
   on as on8,
   createEffect as createEffect8,
-  createMemo as createMemo16,
-  createSignal as createSignal16
+  createMemo as createMemo17,
+  createSignal as createSignal17
 } from "solid-js";
 import { Dynamic as Dynamic5 } from "solid-js/web";
 
@@ -5140,7 +5152,7 @@ function getPreviewContent(_searchParams) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "4.0.10";
+var SDK_VERSION = "4.1.0";
 
 // src/helpers/sdk-headers.ts
 var getSdkHeaders = () => ({
@@ -5995,13 +6007,13 @@ var getWrapperClassName = (variationId) => {
 
 // src/components/content/components/enable-editor.tsx
 function EnableEditor(props) {
-  const [hasExecuted, setHasExecuted] = createSignal16(false);
-  const [ContentWrapper, setContentWrapper] = createSignal16(
+  const [hasExecuted, setHasExecuted] = createSignal17(false);
+  const [ContentWrapper, setContentWrapper] = createSignal17(
     props.contentWrapper || "div"
   );
-  const [httpReqsData, setHttpReqsData] = createSignal16({});
-  const [httpReqsPending, setHttpReqsPending] = createSignal16({});
-  const [clicked, setClicked] = createSignal16(false);
+  const [httpReqsData, setHttpReqsData] = createSignal17({});
+  const [httpReqsPending, setHttpReqsPending] = createSignal17({});
+  const [clicked, setClicked] = createSignal17(false);
   function mergeNewRootState(newData) {
     const combinedState = {
       ...props.builderContextSignal.rootState,
@@ -6035,7 +6047,7 @@ function EnableEditor(props) {
       content: newContentValue
     }));
   }
-  const showContentProps = createMemo16(() => {
+  const showContentProps = createMemo17(() => {
     return props.showContent ? {} : {
       hidden: true,
       "aria-hidden": true
@@ -6219,14 +6231,14 @@ function EnableEditor(props) {
       }
     }
   });
-  const onUpdateFn_0_props_content = createMemo16(() => props.content);
+  const onUpdateFn_0_props_content = createMemo17(() => props.content);
   function onUpdateFn_0() {
     if (props.content) {
       mergeNewContent(props.content);
     }
   }
   createEffect8(on8(() => [onUpdateFn_0_props_content()], onUpdateFn_0));
-  const onUpdateFn_1_props_builderContextSignal_rootState = createMemo16(
+  const onUpdateFn_1_props_builderContextSignal_rootState = createMemo17(
     () => props.builderContextSignal.rootState
   );
   function onUpdateFn_1() {
@@ -6238,14 +6250,14 @@ function EnableEditor(props) {
       onUpdateFn_1
     )
   );
-  const onUpdateFn_2_props_data = createMemo16(() => props.data);
+  const onUpdateFn_2_props_data = createMemo17(() => props.data);
   function onUpdateFn_2() {
     if (props.data) {
       mergeNewRootState(props.data);
     }
   }
   createEffect8(on8(() => [onUpdateFn_2_props_data()], onUpdateFn_2));
-  const onUpdateFn_3_props_locale = createMemo16(() => props.locale);
+  const onUpdateFn_3_props_locale = createMemo17(() => props.locale);
   function onUpdateFn_3() {
     if (props.locale) {
       mergeNewRootState({
@@ -6277,9 +6289,9 @@ function EnableEditor(props) {
 var Enable_editor_default = EnableEditor;
 
 // src/components/content/components/styles.tsx
-import { createSignal as createSignal17 } from "solid-js";
+import { createSignal as createSignal18 } from "solid-js";
 function ContentStyles(props) {
-  const [injectedStyles, setInjectedStyles] = createSignal17(
+  const [injectedStyles, setInjectedStyles] = createSignal18(
     `
 ${getCss({
       cssCode: props.cssCode,
@@ -6337,7 +6349,7 @@ var getContentInitialValue = ({
 
 // src/components/content/content.tsx
 function ContentComponent(props) {
-  const [scriptStr, setScriptStr] = createSignal18(
+  const [scriptStr, setScriptStr] = createSignal19(
     getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
       variationId: props.content?.testVariationId,
@@ -6345,7 +6357,7 @@ function ContentComponent(props) {
       contentId: props.content?.id
     })
   );
-  const [registeredComponents, setRegisteredComponents] = createSignal18(
+  const [registeredComponents, setRegisteredComponents] = createSignal19(
     [
       ...getDefaultRegisteredComponents(),
       ...props.customComponents || []
@@ -6360,7 +6372,7 @@ function ContentComponent(props) {
       {}
     )
   );
-  const [builderContextSignal, setBuilderContextSignal] = createSignal18({
+  const [builderContextSignal, setBuilderContextSignal] = createSignal19({
     content: getContentInitialValue({
       content: props.content,
       data: props.data
@@ -6468,13 +6480,13 @@ var Content_default = ContentComponent;
 
 // src/components/content-variants/content-variants.tsx
 function ContentVariants(props) {
-  const [shouldRenderVariants, setShouldRenderVariants] = createSignal19(
+  const [shouldRenderVariants, setShouldRenderVariants] = createSignal20(
     checkShouldRenderVariants2({
       canTrack: getDefaultCanTrack(props.canTrack),
       content: props.content
     })
   );
-  const updateCookieAndStylesScriptStr = createMemo19(() => {
+  const updateCookieAndStylesScriptStr = createMemo20(() => {
     return getUpdateCookieAndStylesScript(
       getVariants(props.content).map((value) => ({
         id: value.testVariationId,
@@ -6483,10 +6495,10 @@ function ContentVariants(props) {
       props.content?.id || ""
     );
   });
-  const hideVariantsStyleString = createMemo19(() => {
+  const hideVariantsStyleString = createMemo20(() => {
     return getVariants(props.content).map((value) => `.variant-${value.testVariationId} { display: none; } `).join("");
   });
-  const defaultContent = createMemo19(() => {
+  const defaultContent = createMemo20(() => {
     return shouldRenderVariants() ? {
       ...props.content,
       testVariationId: props.content?.id
@@ -6605,15 +6617,15 @@ var fetchSymbolContent = async ({
 
 // src/blocks/symbol/symbol.tsx
 function Symbol(props) {
-  const [contentToUse, setContentToUse] = createSignal20(props.symbol?.content);
-  const [symbolEntry, setSymbolEntry] = createSignal20(props.symbol?.entry);
-  const blocksWrapper = createMemo20(() => {
+  const [contentToUse, setContentToUse] = createSignal21(props.symbol?.content);
+  const [symbolEntry, setSymbolEntry] = createSignal21(props.symbol?.entry);
+  const blocksWrapper = createMemo21(() => {
     return "div";
   });
-  const contentWrapper = createMemo20(() => {
+  const contentWrapper = createMemo21(() => {
     return "div";
   });
-  const className = createMemo20(() => {
+  const className = createMemo21(() => {
     return [
       ...[props.attributes[getClassPropName()]],
       "builder-symbol",
@@ -6636,7 +6648,7 @@ function Symbol(props) {
   }
   onMount10(() => {
   });
-  const onUpdateFn_0_props_symbol = createMemo20(() => props.symbol);
+  const onUpdateFn_0_props_symbol = createMemo21(() => props.symbol);
   function onUpdateFn_0() {
     setContent();
   }

package/package.json

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