@builder.io/sdk-solid 2.0.1 → 2.0.2

package/lib/browser/dev.js

@@ -1808,16 +1808,16 @@ function getSrcSet(url) {
 // src/blocks/image/image.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<source type=image/webp>`);
 var _tmpl$23 = /* @__PURE__ */ template(`<picture><img>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-54b38751">`);
-var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-54b38751-2>`);
-var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-54b38751 {
+var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-e3b1053e">`);
+var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-e3b1053e-2>`);
+var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1836,6 +1836,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -1877,7 +1880,7 @@ function Image(props) {
       }
     }), _el$3);
     effect((_p$) => {
-      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-54b38751", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
+      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
         "object-position": props.backgroundPosition || "center",
         "object-fit": props.backgroundSize || "cover",
         ...aspectRatioCss()
@@ -5148,7 +5151,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5783,7 +5786,15 @@ function ContentComponent(props) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     contentId: props.content?.id
   }));
-  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+    models
+  }) => {
+    if (!models?.length)
+      return true;
+    if (!props.model)
+      return true;
+    return models.includes(props.model);
+  }) || []].reduce((acc, {
     component,
     ...info
   }) => ({
@@ -5809,7 +5820,15 @@ function ContentComponent(props) {
     canTrack: props.canTrack,
     apiKey: props.apiKey,
     apiVersion: props.apiVersion,
-    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+      models
+    }) => {
+      if (!models?.length)
+        return true;
+      if (!props.model)
+        return true;
+      return models.includes(props.model);
+    }) || []].reduce((acc, {
       component: _,
       ...info
     }) => ({

package/lib/browser/dev.jsx

@@ -1605,6 +1605,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -1638,7 +1641,7 @@ function Image(props) {
       <picture>
         <Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
         <img
-          class={"builder-image" + (props.className ? " " + props.className : "") + " img-54b38751"}
+          class={"builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e"}
           loading={props.highPriority ? "eager" : "lazy"}
           fetchpriority={props.highPriority ? "high" : "auto"}
           alt={props.altText}
@@ -1656,22 +1659,22 @@ function Image(props) {
       <Show7
         when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
       ><div
-        class="builder-image-sizer div-54b38751"
+        class="builder-image-sizer div-e3b1053e"
         style={{
           "padding-top": props.aspectRatio * 100 + "%"
         }}
       /></Show7>
       <Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
-      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-54b38751-2">{props.children}</div></Show7>
+      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-e3b1053e-2">{props.children}</div></Show7>
     </>
-    <style>{`.img-54b38751 {
+    <style>{`.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1707,16 +1710,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on4, createEffect as createEffect4, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import {
-  Show as Show14,
-  For as For9,
-  onMount as onMount4,
-  createMemo as createMemo18,
-  createSignal as createSignal18
-} from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount4, createSignal as createSignal18, createMemo as createMemo18 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -4667,7 +4664,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5321,7 +5318,13 @@ function ContentComponent(props) {
   const [registeredComponents, setRegisteredComponents] = createSignal17(
     [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -5351,7 +5354,13 @@ function ContentComponent(props) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
@@ -5577,7 +5586,7 @@ function Symbol(props) {
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}

package/lib/browser/index.js

@@ -1802,16 +1802,16 @@ function getSrcSet(url) {
 // src/blocks/image/image.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<source type=image/webp>`);
 var _tmpl$23 = /* @__PURE__ */ template(`<picture><img>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-54b38751">`);
-var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-54b38751-2>`);
-var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-54b38751 {
+var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-e3b1053e">`);
+var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-e3b1053e-2>`);
+var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1830,6 +1830,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         return getSrcSet(url);
@@ -1870,7 +1873,7 @@ function Image(props) {
       }
     }), _el$3);
     effect((_p$) => {
-      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-54b38751", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
+      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
         "object-position": props.backgroundPosition || "center",
         "object-fit": props.backgroundSize || "cover",
         ...aspectRatioCss()
@@ -5133,7 +5136,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5766,7 +5769,15 @@ function ContentComponent(props) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     contentId: props.content?.id
   }));
-  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+    models
+  }) => {
+    if (!models?.length)
+      return true;
+    if (!props.model)
+      return true;
+    return models.includes(props.model);
+  }) || []].reduce((acc, {
     component,
     ...info
   }) => ({
@@ -5792,7 +5803,15 @@ function ContentComponent(props) {
     canTrack: props.canTrack,
     apiKey: props.apiKey,
     apiVersion: props.apiVersion,
-    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+      models
+    }) => {
+      if (!models?.length)
+        return true;
+      if (!props.model)
+        return true;
+      return models.includes(props.model);
+    }) || []].reduce((acc, {
       component: _,
       ...info
     }) => ({

package/lib/browser/index.jsx

@@ -1599,6 +1599,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         return getSrcSet(url);
@@ -1631,7 +1634,7 @@ function Image(props) {
       <picture>
         <Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
         <img
-          class={"builder-image" + (props.className ? " " + props.className : "") + " img-54b38751"}
+          class={"builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e"}
           loading={props.highPriority ? "eager" : "lazy"}
           fetchpriority={props.highPriority ? "high" : "auto"}
           alt={props.altText}
@@ -1649,22 +1652,22 @@ function Image(props) {
       <Show7
         when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
       ><div
-        class="builder-image-sizer div-54b38751"
+        class="builder-image-sizer div-e3b1053e"
         style={{
           "padding-top": props.aspectRatio * 100 + "%"
         }}
       /></Show7>
       <Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
-      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-54b38751-2">{props.children}</div></Show7>
+      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-e3b1053e-2">{props.children}</div></Show7>
     </>
-    <style>{`.img-54b38751 {
+    <style>{`.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1700,16 +1703,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on4, createEffect as createEffect4, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import {
-  Show as Show14,
-  For as For9,
-  onMount as onMount4,
-  createMemo as createMemo18,
-  createSignal as createSignal18
-} from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount4, createSignal as createSignal18, createMemo as createMemo18 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -4652,7 +4649,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5304,7 +5301,13 @@ function ContentComponent(props) {
   const [registeredComponents, setRegisteredComponents] = createSignal17(
     [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -5334,7 +5337,13 @@ function ContentComponent(props) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
@@ -5560,7 +5569,7 @@ function Symbol(props) {
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}

package/lib/edge/dev.js

@@ -4954,16 +4954,16 @@ function getSrcSet(url) {
 // src/blocks/image/image.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<source type=image/webp>`);
 var _tmpl$23 = /* @__PURE__ */ template(`<picture><img>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-54b38751">`);
-var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-54b38751-2>`);
-var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-54b38751 {
+var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-e3b1053e">`);
+var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-e3b1053e-2>`);
+var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -4982,6 +4982,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -5023,7 +5026,7 @@ function Image(props) {
       }
     }), _el$3);
     effect((_p$) => {
-      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-54b38751", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
+      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
         "object-position": props.backgroundPosition || "center",
         "object-fit": props.backgroundSize || "cover",
         ...aspectRatioCss()
@@ -8294,7 +8297,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -8929,7 +8932,15 @@ function ContentComponent(props) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     contentId: props.content?.id
   }));
-  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+    models
+  }) => {
+    if (!models?.length)
+      return true;
+    if (!props.model)
+      return true;
+    return models.includes(props.model);
+  }) || []].reduce((acc, {
     component,
     ...info
   }) => ({
@@ -8955,7 +8966,15 @@ function ContentComponent(props) {
     canTrack: props.canTrack,
     apiKey: props.apiKey,
     apiVersion: props.apiVersion,
-    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+      models
+    }) => {
+      if (!models?.length)
+        return true;
+      if (!props.model)
+        return true;
+      return models.includes(props.model);
+    }) || []].reduce((acc, {
       component: _,
       ...info
     }) => ({

package/lib/edge/dev.jsx

@@ -4753,6 +4753,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -4786,7 +4789,7 @@ function Image(props) {
       <picture>
         <Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
         <img
-          class={"builder-image" + (props.className ? " " + props.className : "") + " img-54b38751"}
+          class={"builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e"}
           loading={props.highPriority ? "eager" : "lazy"}
           fetchpriority={props.highPriority ? "high" : "auto"}
           alt={props.altText}
@@ -4804,22 +4807,22 @@ function Image(props) {
       <Show7
         when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
       ><div
-        class="builder-image-sizer div-54b38751"
+        class="builder-image-sizer div-e3b1053e"
         style={{
           "padding-top": props.aspectRatio * 100 + "%"
         }}
       /></Show7>
       <Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
-      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-54b38751-2">{props.children}</div></Show7>
+      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-e3b1053e-2">{props.children}</div></Show7>
     </>
-    <style>{`.img-54b38751 {
+    <style>{`.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -4855,16 +4858,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on4, createEffect as createEffect4, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import {
-  Show as Show14,
-  For as For9,
-  onMount as onMount4,
-  createMemo as createMemo18,
-  createSignal as createSignal18
-} from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount4, createSignal as createSignal18, createMemo as createMemo18 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -7815,7 +7812,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -8469,7 +8466,13 @@ function ContentComponent(props) {
   const [registeredComponents, setRegisteredComponents] = createSignal17(
     [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -8499,7 +8502,13 @@ function ContentComponent(props) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
@@ -8725,7 +8734,7 @@ function Symbol2(props) {
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}

package/lib/edge/index.js

@@ -4948,16 +4948,16 @@ function getSrcSet(url) {
 // src/blocks/image/image.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<source type=image/webp>`);
 var _tmpl$23 = /* @__PURE__ */ template(`<picture><img>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-54b38751">`);
-var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-54b38751-2>`);
-var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-54b38751 {
+var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-e3b1053e">`);
+var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-e3b1053e-2>`);
+var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -4976,6 +4976,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         return getSrcSet(url);
@@ -5016,7 +5019,7 @@ function Image(props) {
       }
     }), _el$3);
     effect((_p$) => {
-      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-54b38751", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
+      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
         "object-position": props.backgroundPosition || "center",
         "object-fit": props.backgroundSize || "cover",
         ...aspectRatioCss()
@@ -8279,7 +8282,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -8912,7 +8915,15 @@ function ContentComponent(props) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     contentId: props.content?.id
   }));
-  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+    models
+  }) => {
+    if (!models?.length)
+      return true;
+    if (!props.model)
+      return true;
+    return models.includes(props.model);
+  }) || []].reduce((acc, {
     component,
     ...info
   }) => ({
@@ -8938,7 +8949,15 @@ function ContentComponent(props) {
     canTrack: props.canTrack,
     apiKey: props.apiKey,
     apiVersion: props.apiVersion,
-    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+      models
+    }) => {
+      if (!models?.length)
+        return true;
+      if (!props.model)
+        return true;
+      return models.includes(props.model);
+    }) || []].reduce((acc, {
       component: _,
       ...info
     }) => ({

package/lib/edge/index.jsx

@@ -4747,6 +4747,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         return getSrcSet(url);
@@ -4779,7 +4782,7 @@ function Image(props) {
       <picture>
         <Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
         <img
-          class={"builder-image" + (props.className ? " " + props.className : "") + " img-54b38751"}
+          class={"builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e"}
           loading={props.highPriority ? "eager" : "lazy"}
           fetchpriority={props.highPriority ? "high" : "auto"}
           alt={props.altText}
@@ -4797,22 +4800,22 @@ function Image(props) {
       <Show7
         when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
       ><div
-        class="builder-image-sizer div-54b38751"
+        class="builder-image-sizer div-e3b1053e"
         style={{
           "padding-top": props.aspectRatio * 100 + "%"
         }}
       /></Show7>
       <Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
-      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-54b38751-2">{props.children}</div></Show7>
+      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-e3b1053e-2">{props.children}</div></Show7>
     </>
-    <style>{`.img-54b38751 {
+    <style>{`.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -4848,16 +4851,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on4, createEffect as createEffect4, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import {
-  Show as Show14,
-  For as For9,
-  onMount as onMount4,
-  createMemo as createMemo18,
-  createSignal as createSignal18
-} from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount4, createSignal as createSignal18, createMemo as createMemo18 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -7800,7 +7797,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -8452,7 +8449,13 @@ function ContentComponent(props) {
   const [registeredComponents, setRegisteredComponents] = createSignal17(
     [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -8482,7 +8485,13 @@ function ContentComponent(props) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
@@ -8708,7 +8717,7 @@ function Symbol2(props) {
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}

package/lib/node/dev.js

@@ -1978,16 +1978,16 @@ function getSrcSet(url) {
 // src/blocks/image/image.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<source type=image/webp>`);
 var _tmpl$23 = /* @__PURE__ */ template(`<picture><img>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-54b38751">`);
-var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-54b38751-2>`);
-var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-54b38751 {
+var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-e3b1053e">`);
+var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-e3b1053e-2>`);
+var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -2006,6 +2006,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -2047,7 +2050,7 @@ function Image(props) {
       }
     }), _el$3);
     effect((_p$) => {
-      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-54b38751", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
+      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
         "object-position": props.backgroundPosition || "center",
         "object-fit": props.backgroundSize || "cover",
         ...aspectRatioCss()
@@ -5318,7 +5321,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5953,7 +5956,15 @@ function ContentComponent(props) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     contentId: props.content?.id
   }));
-  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+    models
+  }) => {
+    if (!models?.length)
+      return true;
+    if (!props.model)
+      return true;
+    return models.includes(props.model);
+  }) || []].reduce((acc, {
     component,
     ...info
   }) => ({
@@ -5979,7 +5990,15 @@ function ContentComponent(props) {
     canTrack: props.canTrack,
     apiKey: props.apiKey,
     apiVersion: props.apiVersion,
-    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+      models
+    }) => {
+      if (!models?.length)
+        return true;
+      if (!props.model)
+        return true;
+      return models.includes(props.model);
+    }) || []].reduce((acc, {
       component: _,
       ...info
     }) => ({

package/lib/node/dev.jsx

@@ -1777,6 +1777,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -1810,7 +1813,7 @@ function Image(props) {
       <picture>
         <Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
         <img
-          class={"builder-image" + (props.className ? " " + props.className : "") + " img-54b38751"}
+          class={"builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e"}
           loading={props.highPriority ? "eager" : "lazy"}
           fetchpriority={props.highPriority ? "high" : "auto"}
           alt={props.altText}
@@ -1828,22 +1831,22 @@ function Image(props) {
       <Show7
         when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
       ><div
-        class="builder-image-sizer div-54b38751"
+        class="builder-image-sizer div-e3b1053e"
         style={{
           "padding-top": props.aspectRatio * 100 + "%"
         }}
       /></Show7>
       <Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
-      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-54b38751-2">{props.children}</div></Show7>
+      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-e3b1053e-2">{props.children}</div></Show7>
     </>
-    <style>{`.img-54b38751 {
+    <style>{`.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1879,16 +1882,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on4, createEffect as createEffect4, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import {
-  Show as Show14,
-  For as For9,
-  onMount as onMount4,
-  createMemo as createMemo18,
-  createSignal as createSignal18
-} from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount4, createSignal as createSignal18, createMemo as createMemo18 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -4839,7 +4836,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5493,7 +5490,13 @@ function ContentComponent(props) {
   const [registeredComponents, setRegisteredComponents] = createSignal17(
     [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -5523,7 +5526,13 @@ function ContentComponent(props) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
@@ -5749,7 +5758,7 @@ function Symbol(props) {
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}

package/lib/node/index.js

@@ -1972,16 +1972,16 @@ function getSrcSet(url) {
 // src/blocks/image/image.tsx
 var _tmpl$5 = /* @__PURE__ */ template(`<source type=image/webp>`);
 var _tmpl$23 = /* @__PURE__ */ template(`<picture><img>`);
-var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-54b38751">`);
-var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-54b38751-2>`);
-var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-54b38751 {
+var _tmpl$32 = /* @__PURE__ */ template(`<div class="builder-image-sizer div-e3b1053e">`);
+var _tmpl$42 = /* @__PURE__ */ template(`<div class=div-e3b1053e-2>`);
+var _tmpl$52 = /* @__PURE__ */ template(`<style>.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -2000,6 +2000,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         return getSrcSet(url);
@@ -2040,7 +2043,7 @@ function Image(props) {
       }
     }), _el$3);
     effect((_p$) => {
-      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-54b38751", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
+      const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e", _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
         "object-position": props.backgroundPosition || "center",
         "object-fit": props.backgroundSize || "cover",
         ...aspectRatioCss()
@@ -5303,7 +5306,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5936,7 +5939,15 @@ function ContentComponent(props) {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
     contentId: props.content?.id
   }));
-  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+  const [registeredComponents, setRegisteredComponents] = createSignal([...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+    models
+  }) => {
+    if (!models?.length)
+      return true;
+    if (!props.model)
+      return true;
+    return models.includes(props.model);
+  }) || []].reduce((acc, {
     component,
     ...info
   }) => ({
@@ -5962,7 +5973,15 @@ function ContentComponent(props) {
     canTrack: props.canTrack,
     apiKey: props.apiKey,
     apiVersion: props.apiVersion,
-    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents || []].reduce((acc, {
+    componentInfos: [...getDefaultRegisteredComponents(), ...props.customComponents?.filter(({
+      models
+    }) => {
+      if (!models?.length)
+        return true;
+      if (!props.model)
+        return true;
+      return models.includes(props.model);
+    }) || []].reduce((acc, {
       component: _,
       ...info
     }) => ({

package/lib/node/index.jsx

@@ -1771,6 +1771,9 @@ function Image(props) {
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
       return props.srcset;
     }
+    if (props.noWebp) {
+      return void 0;
+    }
     if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
       if (!props.srcset.includes(props.image.split("?")[0])) {
         return getSrcSet(url);
@@ -1803,7 +1806,7 @@ function Image(props) {
       <picture>
         <Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
         <img
-          class={"builder-image" + (props.className ? " " + props.className : "") + " img-54b38751"}
+          class={"builder-image" + (props.className ? " " + props.className : "") + " img-e3b1053e"}
           loading={props.highPriority ? "eager" : "lazy"}
           fetchpriority={props.highPriority ? "high" : "auto"}
           alt={props.altText}
@@ -1821,22 +1824,22 @@ function Image(props) {
       <Show7
         when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
       ><div
-        class="builder-image-sizer div-54b38751"
+        class="builder-image-sizer div-e3b1053e"
         style={{
           "padding-top": props.aspectRatio * 100 + "%"
         }}
       /></Show7>
       <Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
-      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-54b38751-2">{props.children}</div></Show7>
+      <Show7 when={!props.fitContent && props.builderBlock?.children?.length}><div class="div-e3b1053e-2">{props.children}</div></Show7>
     </>
-    <style>{`.img-54b38751 {
+    <style>{`.img-e3b1053e {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-54b38751 {
+}.div-e3b1053e {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-54b38751-2 {
+}.div-e3b1053e-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1872,16 +1875,10 @@ function SectionComponent(props) {
 var section_default = SectionComponent;
 
 // src/blocks/symbol/symbol.tsx
-import { onMount as onMount5, on as on4, createEffect as createEffect4, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
+import { onMount as onMount5, on as on3, createEffect as createEffect3, createMemo as createMemo19, createSignal as createSignal19 } from "solid-js";
 
 // src/components/content-variants/content-variants.tsx
-import {
-  Show as Show14,
-  For as For9,
-  onMount as onMount4,
-  createMemo as createMemo18,
-  createSignal as createSignal18
-} from "solid-js";
+import { Show as Show14, For as For9, onMount as onMount4, createSignal as createSignal18, createMemo as createMemo18 } from "solid-js";
 
 // src/helpers/url.ts
 var getTopLevelDomain = (host) => {
@@ -4824,7 +4821,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.1";
+var SDK_VERSION = "2.0.2";
 
 // src/functions/register.ts
 var registry = {};
@@ -5476,7 +5473,13 @@ function ContentComponent(props) {
   const [registeredComponents, setRegisteredComponents] = createSignal17(
     [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component, ...info }) => ({
         ...acc,
@@ -5506,7 +5509,13 @@ function ContentComponent(props) {
     apiVersion: props.apiVersion,
     componentInfos: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...props.customComponents?.filter(({ models }) => {
+        if (!models?.length)
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      }) || []
     ].reduce(
       (acc, { component: _, ...info }) => ({
         ...acc,
@@ -5732,7 +5741,7 @@ function Symbol(props) {
   function onUpdateFn_0() {
     setContent();
   }
-  createEffect4(on4(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
+  createEffect3(on3(() => [onUpdateFn_0_props_symbol()], onUpdateFn_0));
   return <><div class={className()} {...{}} {...props.attributes} {...{}}><Content_variants_default
     nonce={props.builderContext.nonce}
     isNestedRender={true}

package/package.json

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