@builder.io/sdk-qwik 0.16.1 → 0.16.3

package/lib/browser/index.qwik.cjs

@@ -1612,6 +1612,7 @@ const getWidthForBreakpointSize = function getWidthForBreakpointSize2(props, sta
   return breakpointSizes[size].max;
 };
 const columnsStyles = function columnsStyles2(props, state) {
+  const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
   return `
         @media (max-width: ${getWidthForBreakpointSize(props, state, "medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -1619,7 +1620,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -1631,7 +1632,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }
@@ -1798,6 +1799,8 @@ const Image = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
     // images, otherwise you can supply this prop manually
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
       return props2.srcset;
+    if (props2.noWebp)
+      return void 0;
     if (props2.srcset && ((_a2 = props2.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
       if (!props2.srcset.includes(props2.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -4751,14 +4754,13 @@ const serializeFn = (fnValue) => {
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeComponentInfo = ({ inputs, ...info }) => ({
-  ...fastClone(info),
-  inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), {}))
-});
+function serializeComponentInfo(info) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === "function")
+      return serializeFn(value);
+    return value;
+  }));
+}
 const UPDATE_COOKIES_AND_STYLES_SCRIPT = "function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {\n  function getAndSetVariantId() {\n    function setCookie(name, value, days) {\n      let expires = '';\n      if (days) {\n        const date = new Date();\n        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);\n        expires = '; expires=' + date.toUTCString();\n      }\n      document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';\n    }\n    function getCookie(name) {\n      const nameEQ = name + '=';\n      const ca = document.cookie.split(';');\n      for (let i = 0; i < ca.length; i++) {\n        let c = ca[i];\n        while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n      }\n      return null;\n    }\n    const cookieName = `builder.tests.${contentId}`;\n    const variantInCookie = getCookie(cookieName);\n    const availableIDs = variants.map(vr => vr.id).concat(contentId);\n    if (variantInCookie && availableIDs.includes(variantInCookie)) {\n      return variantInCookie;\n    }\n    let n = 0;\n    const random = Math.random();\n    for (let i = 0; i < variants.length; i++) {\n      const variant = variants[i];\n      const testRatio = variant.testRatio;\n      n += testRatio;\n      if (random < n) {\n        setCookie(cookieName, variant.id);\n        return variant.id;\n      }\n    }\n    setCookie(cookieName, contentId);\n    return contentId;\n  }\n  const winningVariantId = getAndSetVariantId();\n  const styleEl = document.currentScript?.previousElementSibling;\n  if (isHydrationTarget) {\n    styleEl.remove();\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  } else {\n    const newStyleStr = variants.concat({\n      id: contentId\n    }).filter(variant => variant.id !== winningVariantId).map(value => {\n      return `.variant-${value.id} {  display: none; }\n        `;\n    }).join('');\n    styleEl.innerHTML = newStyleStr;\n  }\n}";
 const UPDATE_VARIANT_VISIBILITY_SCRIPT = "function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const cookieName = `builder.tests.${defaultContentId}`;\n  const winningVariant = getCookie(cookieName);\n  const parentDiv = document.currentScript?.parentElement;\n  const isDefaultContent = variantContentId === defaultContentId;\n  const isWinningVariant = winningVariant === variantContentId;\n  if (isWinningVariant && !isDefaultContent) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultContent) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      parentDiv?.remove();\n    }\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  }\n  return;\n}";
 const UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest";
@@ -5201,7 +5203,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.16.1";
+const SDK_VERSION = "0.16.3";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -5887,7 +5889,7 @@ const getContentInitialValue = ({ content, data }) => {
   };
 };
 const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   qwik._jsxBranch();
   const state = qwik.useStore({
     builderContextSignal: {
@@ -5908,7 +5910,13 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...props.customComponents || []
+        ...((_a = props.customComponents) == null ? void 0 : _a.filter(({ models }) => {
+          if (!(models == null ? void 0 : models.length))
+            return true;
+          if (!props.model)
+            return true;
+          return models.includes(props.model);
+        })) || []
       ].reduce((acc, { component: _, ...info }) => ({
         ...acc,
         [info.name]: serializeComponentInfo(info)
@@ -5920,7 +5928,13 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
     },
     registeredComponents: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...((_b = props.customComponents) == null ? void 0 : _b.filter(({ models }) => {
+        if (!(models == null ? void 0 : models.length))
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      })) || []
     ].reduce((acc, { component, ...info }) => ({
       ...acc,
       [info.name]: {
@@ -5930,9 +5944,9 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
     }), {}),
     scriptStr: getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      variationId: (_a = props.content) == null ? void 0 : _a.testVariationId,
+      variationId: (_c = props.content) == null ? void 0 : _c.testVariationId,
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      contentId: (_b = props.content) == null ? void 0 : _b.id
+      contentId: (_d = props.content) == null ? void 0 : _d.id
     })
   }, {
     deep: true
@@ -6165,8 +6179,6 @@ const ContentVariants = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.i
     props,
     state
   ]));
-  qwik.useTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(({ track: track2 }) => {
-  }, "ContentVariants_component_useTask_lSvynevU008"));
   return /* @__PURE__ */ qwik._jsxC(qwik.Fragment, {
     children: [
       !props.isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ qwik._jsxC(InlinedScript, {

package/lib/browser/index.qwik.mjs

@@ -1610,6 +1610,7 @@ const getWidthForBreakpointSize = function getWidthForBreakpointSize2(props, sta
   return breakpointSizes[size].max;
 };
 const columnsStyles = function columnsStyles2(props, state) {
+  const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
   return `
         @media (max-width: ${getWidthForBreakpointSize(props, state, "medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -1617,7 +1618,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -1629,7 +1630,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }
@@ -1796,6 +1797,8 @@ const Image = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
     // images, otherwise you can supply this prop manually
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
       return props2.srcset;
+    if (props2.noWebp)
+      return void 0;
     if (props2.srcset && ((_a2 = props2.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
       if (!props2.srcset.includes(props2.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -4749,14 +4752,13 @@ const serializeFn = (fnValue) => {
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeComponentInfo = ({ inputs, ...info }) => ({
-  ...fastClone(info),
-  inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), {}))
-});
+function serializeComponentInfo(info) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === "function")
+      return serializeFn(value);
+    return value;
+  }));
+}
 const UPDATE_COOKIES_AND_STYLES_SCRIPT = "function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {\n  function getAndSetVariantId() {\n    function setCookie(name, value, days) {\n      let expires = '';\n      if (days) {\n        const date = new Date();\n        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);\n        expires = '; expires=' + date.toUTCString();\n      }\n      document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';\n    }\n    function getCookie(name) {\n      const nameEQ = name + '=';\n      const ca = document.cookie.split(';');\n      for (let i = 0; i < ca.length; i++) {\n        let c = ca[i];\n        while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n      }\n      return null;\n    }\n    const cookieName = `builder.tests.${contentId}`;\n    const variantInCookie = getCookie(cookieName);\n    const availableIDs = variants.map(vr => vr.id).concat(contentId);\n    if (variantInCookie && availableIDs.includes(variantInCookie)) {\n      return variantInCookie;\n    }\n    let n = 0;\n    const random = Math.random();\n    for (let i = 0; i < variants.length; i++) {\n      const variant = variants[i];\n      const testRatio = variant.testRatio;\n      n += testRatio;\n      if (random < n) {\n        setCookie(cookieName, variant.id);\n        return variant.id;\n      }\n    }\n    setCookie(cookieName, contentId);\n    return contentId;\n  }\n  const winningVariantId = getAndSetVariantId();\n  const styleEl = document.currentScript?.previousElementSibling;\n  if (isHydrationTarget) {\n    styleEl.remove();\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  } else {\n    const newStyleStr = variants.concat({\n      id: contentId\n    }).filter(variant => variant.id !== winningVariantId).map(value => {\n      return `.variant-${value.id} {  display: none; }\n        `;\n    }).join('');\n    styleEl.innerHTML = newStyleStr;\n  }\n}";
 const UPDATE_VARIANT_VISIBILITY_SCRIPT = "function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const cookieName = `builder.tests.${defaultContentId}`;\n  const winningVariant = getCookie(cookieName);\n  const parentDiv = document.currentScript?.parentElement;\n  const isDefaultContent = variantContentId === defaultContentId;\n  const isWinningVariant = winningVariant === variantContentId;\n  if (isWinningVariant && !isDefaultContent) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultContent) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      parentDiv?.remove();\n    }\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  }\n  return;\n}";
 const UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest";
@@ -5199,7 +5201,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.16.1";
+const SDK_VERSION = "0.16.3";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -5885,7 +5887,7 @@ const getContentInitialValue = ({ content, data }) => {
   };
 };
 const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   _jsxBranch();
   const state = useStore({
     builderContextSignal: {
@@ -5906,7 +5908,13 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...props.customComponents || []
+        ...((_a = props.customComponents) == null ? void 0 : _a.filter(({ models }) => {
+          if (!(models == null ? void 0 : models.length))
+            return true;
+          if (!props.model)
+            return true;
+          return models.includes(props.model);
+        })) || []
       ].reduce((acc, { component: _, ...info }) => ({
         ...acc,
         [info.name]: serializeComponentInfo(info)
@@ -5918,7 +5926,13 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
     },
     registeredComponents: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...((_b = props.customComponents) == null ? void 0 : _b.filter(({ models }) => {
+        if (!(models == null ? void 0 : models.length))
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      })) || []
     ].reduce((acc, { component, ...info }) => ({
       ...acc,
       [info.name]: {
@@ -5928,9 +5942,9 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
     }), {}),
     scriptStr: getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      variationId: (_a = props.content) == null ? void 0 : _a.testVariationId,
+      variationId: (_c = props.content) == null ? void 0 : _c.testVariationId,
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      contentId: (_b = props.content) == null ? void 0 : _b.id
+      contentId: (_d = props.content) == null ? void 0 : _d.id
     })
   }, {
     deep: true
@@ -6163,8 +6177,6 @@ const ContentVariants = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(
     props,
     state
   ]));
-  useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track: track2 }) => {
-  }, "ContentVariants_component_useTask_lSvynevU008"));
   return /* @__PURE__ */ _jsxC(Fragment$1, {
     children: [
       !props.isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ _jsxC(InlinedScript, {

package/lib/edge/index.qwik.cjs

@@ -4836,6 +4836,7 @@ const getWidthForBreakpointSize = function getWidthForBreakpointSize2(props, sta
   return breakpointSizes[size].max;
 };
 const columnsStyles = function columnsStyles2(props, state) {
+  const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
   return `
         @media (max-width: ${getWidthForBreakpointSize(props, state, "medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -4843,7 +4844,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -4855,7 +4856,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }
@@ -5022,6 +5023,8 @@ const Image = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
     // images, otherwise you can supply this prop manually
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
       return props2.srcset;
+    if (props2.noWebp)
+      return void 0;
     if (props2.srcset && ((_a2 = props2.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
       if (!props2.srcset.includes(props2.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -7975,14 +7978,13 @@ const serializeFn = (fnValue) => {
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeComponentInfo = ({ inputs, ...info }) => ({
-  ...fastClone(info),
-  inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), {}))
-});
+function serializeComponentInfo(info) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === "function")
+      return serializeFn(value);
+    return value;
+  }));
+}
 const UPDATE_COOKIES_AND_STYLES_SCRIPT = "function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {\n  function getAndSetVariantId() {\n    function setCookie(name, value, days) {\n      let expires = '';\n      if (days) {\n        const date = new Date();\n        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);\n        expires = '; expires=' + date.toUTCString();\n      }\n      document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';\n    }\n    function getCookie(name) {\n      const nameEQ = name + '=';\n      const ca = document.cookie.split(';');\n      for (let i = 0; i < ca.length; i++) {\n        let c = ca[i];\n        while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n      }\n      return null;\n    }\n    const cookieName = `builder.tests.${contentId}`;\n    const variantInCookie = getCookie(cookieName);\n    const availableIDs = variants.map(vr => vr.id).concat(contentId);\n    if (variantInCookie && availableIDs.includes(variantInCookie)) {\n      return variantInCookie;\n    }\n    let n = 0;\n    const random = Math.random();\n    for (let i = 0; i < variants.length; i++) {\n      const variant = variants[i];\n      const testRatio = variant.testRatio;\n      n += testRatio;\n      if (random < n) {\n        setCookie(cookieName, variant.id);\n        return variant.id;\n      }\n    }\n    setCookie(cookieName, contentId);\n    return contentId;\n  }\n  const winningVariantId = getAndSetVariantId();\n  const styleEl = document.currentScript?.previousElementSibling;\n  if (isHydrationTarget) {\n    styleEl.remove();\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  } else {\n    const newStyleStr = variants.concat({\n      id: contentId\n    }).filter(variant => variant.id !== winningVariantId).map(value => {\n      return `.variant-${value.id} {  display: none; }\n        `;\n    }).join('');\n    styleEl.innerHTML = newStyleStr;\n  }\n}";
 const UPDATE_VARIANT_VISIBILITY_SCRIPT = "function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const cookieName = `builder.tests.${defaultContentId}`;\n  const winningVariant = getCookie(cookieName);\n  const parentDiv = document.currentScript?.parentElement;\n  const isDefaultContent = variantContentId === defaultContentId;\n  const isWinningVariant = winningVariant === variantContentId;\n  if (isWinningVariant && !isDefaultContent) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultContent) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      parentDiv?.remove();\n    }\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  }\n  return;\n}";
 const UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest";
@@ -8425,7 +8427,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.16.1";
+const SDK_VERSION = "0.16.3";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -9111,7 +9113,7 @@ const getContentInitialValue = ({ content, data }) => {
   };
 };
 const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   qwik._jsxBranch();
   const state = qwik.useStore({
     builderContextSignal: {
@@ -9132,7 +9134,13 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...props.customComponents || []
+        ...((_a = props.customComponents) == null ? void 0 : _a.filter(({ models }) => {
+          if (!(models == null ? void 0 : models.length))
+            return true;
+          if (!props.model)
+            return true;
+          return models.includes(props.model);
+        })) || []
       ].reduce((acc, { component: _, ...info }) => ({
         ...acc,
         [info.name]: serializeComponentInfo(info)
@@ -9144,7 +9152,13 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
     },
     registeredComponents: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...((_b = props.customComponents) == null ? void 0 : _b.filter(({ models }) => {
+        if (!(models == null ? void 0 : models.length))
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      })) || []
     ].reduce((acc, { component, ...info }) => ({
       ...acc,
       [info.name]: {
@@ -9154,9 +9168,9 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
     }), {}),
     scriptStr: getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      variationId: (_a = props.content) == null ? void 0 : _a.testVariationId,
+      variationId: (_c = props.content) == null ? void 0 : _c.testVariationId,
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      contentId: (_b = props.content) == null ? void 0 : _b.id
+      contentId: (_d = props.content) == null ? void 0 : _d.id
     })
   }, {
     deep: true
@@ -9389,8 +9403,6 @@ const ContentVariants = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.i
     props,
     state
   ]));
-  qwik.useTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(({ track: track2 }) => {
-  }, "ContentVariants_component_useTask_lSvynevU008"));
   return /* @__PURE__ */ qwik._jsxC(qwik.Fragment, {
     children: [
       !props.isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ qwik._jsxC(InlinedScript, {

package/lib/edge/index.qwik.mjs

@@ -4834,6 +4834,7 @@ const getWidthForBreakpointSize = function getWidthForBreakpointSize2(props, sta
   return breakpointSizes[size].max;
 };
 const columnsStyles = function columnsStyles2(props, state) {
+  const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
   return `
         @media (max-width: ${getWidthForBreakpointSize(props, state, "medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -4841,7 +4842,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -4853,7 +4854,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }
@@ -5020,6 +5021,8 @@ const Image = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
     // images, otherwise you can supply this prop manually
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
       return props2.srcset;
+    if (props2.noWebp)
+      return void 0;
     if (props2.srcset && ((_a2 = props2.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
       if (!props2.srcset.includes(props2.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -7973,14 +7976,13 @@ const serializeFn = (fnValue) => {
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeComponentInfo = ({ inputs, ...info }) => ({
-  ...fastClone(info),
-  inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), {}))
-});
+function serializeComponentInfo(info) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === "function")
+      return serializeFn(value);
+    return value;
+  }));
+}
 const UPDATE_COOKIES_AND_STYLES_SCRIPT = "function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {\n  function getAndSetVariantId() {\n    function setCookie(name, value, days) {\n      let expires = '';\n      if (days) {\n        const date = new Date();\n        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);\n        expires = '; expires=' + date.toUTCString();\n      }\n      document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';\n    }\n    function getCookie(name) {\n      const nameEQ = name + '=';\n      const ca = document.cookie.split(';');\n      for (let i = 0; i < ca.length; i++) {\n        let c = ca[i];\n        while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n      }\n      return null;\n    }\n    const cookieName = `builder.tests.${contentId}`;\n    const variantInCookie = getCookie(cookieName);\n    const availableIDs = variants.map(vr => vr.id).concat(contentId);\n    if (variantInCookie && availableIDs.includes(variantInCookie)) {\n      return variantInCookie;\n    }\n    let n = 0;\n    const random = Math.random();\n    for (let i = 0; i < variants.length; i++) {\n      const variant = variants[i];\n      const testRatio = variant.testRatio;\n      n += testRatio;\n      if (random < n) {\n        setCookie(cookieName, variant.id);\n        return variant.id;\n      }\n    }\n    setCookie(cookieName, contentId);\n    return contentId;\n  }\n  const winningVariantId = getAndSetVariantId();\n  const styleEl = document.currentScript?.previousElementSibling;\n  if (isHydrationTarget) {\n    styleEl.remove();\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  } else {\n    const newStyleStr = variants.concat({\n      id: contentId\n    }).filter(variant => variant.id !== winningVariantId).map(value => {\n      return `.variant-${value.id} {  display: none; }\n        `;\n    }).join('');\n    styleEl.innerHTML = newStyleStr;\n  }\n}";
 const UPDATE_VARIANT_VISIBILITY_SCRIPT = "function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const cookieName = `builder.tests.${defaultContentId}`;\n  const winningVariant = getCookie(cookieName);\n  const parentDiv = document.currentScript?.parentElement;\n  const isDefaultContent = variantContentId === defaultContentId;\n  const isWinningVariant = winningVariant === variantContentId;\n  if (isWinningVariant && !isDefaultContent) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultContent) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      parentDiv?.remove();\n    }\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  }\n  return;\n}";
 const UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest";
@@ -8423,7 +8425,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.16.1";
+const SDK_VERSION = "0.16.3";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -9109,7 +9111,7 @@ const getContentInitialValue = ({ content, data }) => {
   };
 };
 const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   _jsxBranch();
   const state = useStore({
     builderContextSignal: {
@@ -9130,7 +9132,13 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...props.customComponents || []
+        ...((_a = props.customComponents) == null ? void 0 : _a.filter(({ models }) => {
+          if (!(models == null ? void 0 : models.length))
+            return true;
+          if (!props.model)
+            return true;
+          return models.includes(props.model);
+        })) || []
       ].reduce((acc, { component: _, ...info }) => ({
         ...acc,
         [info.name]: serializeComponentInfo(info)
@@ -9142,7 +9150,13 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
     },
     registeredComponents: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...((_b = props.customComponents) == null ? void 0 : _b.filter(({ models }) => {
+        if (!(models == null ? void 0 : models.length))
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      })) || []
     ].reduce((acc, { component, ...info }) => ({
       ...acc,
       [info.name]: {
@@ -9152,9 +9166,9 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
     }), {}),
     scriptStr: getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      variationId: (_a = props.content) == null ? void 0 : _a.testVariationId,
+      variationId: (_c = props.content) == null ? void 0 : _c.testVariationId,
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      contentId: (_b = props.content) == null ? void 0 : _b.id
+      contentId: (_d = props.content) == null ? void 0 : _d.id
     })
   }, {
     deep: true
@@ -9387,8 +9401,6 @@ const ContentVariants = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(
     props,
     state
   ]));
-  useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track: track2 }) => {
-  }, "ContentVariants_component_useTask_lSvynevU008"));
   return /* @__PURE__ */ _jsxC(Fragment$1, {
     children: [
       !props.isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ _jsxC(InlinedScript, {

package/lib/node/index.qwik.cjs

@@ -1757,6 +1757,7 @@ const getWidthForBreakpointSize = function getWidthForBreakpointSize2(props, sta
   return breakpointSizes[size].max;
 };
 const columnsStyles = function columnsStyles2(props, state) {
+  const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
   return `
         @media (max-width: ${getWidthForBreakpointSize(props, state, "medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -1764,7 +1765,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -1776,7 +1777,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }
@@ -1943,6 +1944,8 @@ const Image = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
     // images, otherwise you can supply this prop manually
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
       return props2.srcset;
+    if (props2.noWebp)
+      return void 0;
     if (props2.srcset && ((_a2 = props2.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
       if (!props2.srcset.includes(props2.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -4896,14 +4899,13 @@ const serializeFn = (fnValue) => {
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeComponentInfo = ({ inputs, ...info }) => ({
-  ...fastClone(info),
-  inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), {}))
-});
+function serializeComponentInfo(info) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === "function")
+      return serializeFn(value);
+    return value;
+  }));
+}
 const UPDATE_COOKIES_AND_STYLES_SCRIPT = "function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {\n  function getAndSetVariantId() {\n    function setCookie(name, value, days) {\n      let expires = '';\n      if (days) {\n        const date = new Date();\n        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);\n        expires = '; expires=' + date.toUTCString();\n      }\n      document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';\n    }\n    function getCookie(name) {\n      const nameEQ = name + '=';\n      const ca = document.cookie.split(';');\n      for (let i = 0; i < ca.length; i++) {\n        let c = ca[i];\n        while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n      }\n      return null;\n    }\n    const cookieName = `builder.tests.${contentId}`;\n    const variantInCookie = getCookie(cookieName);\n    const availableIDs = variants.map(vr => vr.id).concat(contentId);\n    if (variantInCookie && availableIDs.includes(variantInCookie)) {\n      return variantInCookie;\n    }\n    let n = 0;\n    const random = Math.random();\n    for (let i = 0; i < variants.length; i++) {\n      const variant = variants[i];\n      const testRatio = variant.testRatio;\n      n += testRatio;\n      if (random < n) {\n        setCookie(cookieName, variant.id);\n        return variant.id;\n      }\n    }\n    setCookie(cookieName, contentId);\n    return contentId;\n  }\n  const winningVariantId = getAndSetVariantId();\n  const styleEl = document.currentScript?.previousElementSibling;\n  if (isHydrationTarget) {\n    styleEl.remove();\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  } else {\n    const newStyleStr = variants.concat({\n      id: contentId\n    }).filter(variant => variant.id !== winningVariantId).map(value => {\n      return `.variant-${value.id} {  display: none; }\n        `;\n    }).join('');\n    styleEl.innerHTML = newStyleStr;\n  }\n}";
 const UPDATE_VARIANT_VISIBILITY_SCRIPT = "function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const cookieName = `builder.tests.${defaultContentId}`;\n  const winningVariant = getCookie(cookieName);\n  const parentDiv = document.currentScript?.parentElement;\n  const isDefaultContent = variantContentId === defaultContentId;\n  const isWinningVariant = winningVariant === variantContentId;\n  if (isWinningVariant && !isDefaultContent) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultContent) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      parentDiv?.remove();\n    }\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  }\n  return;\n}";
 const UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest";
@@ -5346,7 +5348,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.16.1";
+const SDK_VERSION = "0.16.3";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -6032,7 +6034,7 @@ const getContentInitialValue = ({ content, data }) => {
   };
 };
 const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   qwik._jsxBranch();
   const state = qwik.useStore({
     builderContextSignal: {
@@ -6053,7 +6055,13 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...props.customComponents || []
+        ...((_a = props.customComponents) == null ? void 0 : _a.filter(({ models }) => {
+          if (!(models == null ? void 0 : models.length))
+            return true;
+          if (!props.model)
+            return true;
+          return models.includes(props.model);
+        })) || []
       ].reduce((acc, { component: _, ...info }) => ({
         ...acc,
         [info.name]: serializeComponentInfo(info)
@@ -6065,7 +6073,13 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
     },
     registeredComponents: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...((_b = props.customComponents) == null ? void 0 : _b.filter(({ models }) => {
+        if (!(models == null ? void 0 : models.length))
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      })) || []
     ].reduce((acc, { component, ...info }) => ({
       ...acc,
       [info.name]: {
@@ -6075,9 +6089,9 @@ const ContentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.
     }), {}),
     scriptStr: getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      variationId: (_a = props.content) == null ? void 0 : _a.testVariationId,
+      variationId: (_c = props.content) == null ? void 0 : _c.testVariationId,
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      contentId: (_b = props.content) == null ? void 0 : _b.id
+      contentId: (_d = props.content) == null ? void 0 : _d.id
     })
   }, {
     deep: true
@@ -6310,8 +6324,6 @@ const ContentVariants = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.i
     props,
     state
   ]));
-  qwik.useTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(({ track: track2 }) => {
-  }, "ContentVariants_component_useTask_lSvynevU008"));
   return /* @__PURE__ */ qwik._jsxC(qwik.Fragment, {
     children: [
       !props.isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ qwik._jsxC(InlinedScript, {

package/lib/node/index.qwik.mjs

@@ -1755,6 +1755,7 @@ const getWidthForBreakpointSize = function getWidthForBreakpointSize2(props, sta
   return breakpointSizes[size].max;
 };
 const columnsStyles = function columnsStyles2(props, state) {
+  const childColumnDiv = `.${props.builderBlock.id}-breakpoints > .builder-column`;
   return `
         @media (max-width: ${getWidthForBreakpointSize(props, state, "medium")}px) {
           .${props.builderBlock.id}-breakpoints {
@@ -1762,7 +1763,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-tablet) !important;
             margin-left: var(--column-margin-left-tablet) !important;
           }
@@ -1774,7 +1775,7 @@ const columnsStyles = function columnsStyles2(props, state) {
             align-items: stretch;
           }
 
-          .${props.builderBlock.id}-breakpoints > .builder-column {
+          ${childColumnDiv} {
             width: var(--column-width-mobile) !important;
             margin-left: var(--column-margin-left-mobile) !important;
           }
@@ -1941,6 +1942,8 @@ const Image = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
     // images, otherwise you can supply this prop manually
     !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
       return props2.srcset;
+    if (props2.noWebp)
+      return void 0;
     if (props2.srcset && ((_a2 = props2.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
       if (!props2.srcset.includes(props2.image.split("?")[0])) {
         console.debug("Removed given srcset");
@@ -4894,14 +4897,13 @@ const serializeFn = (fnValue) => {
   const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
   return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
 };
-const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeComponentInfo = ({ inputs, ...info }) => ({
-  ...fastClone(info),
-  inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => ({
-    ...acc,
-    [key]: serializeValue(value)
-  }), {}))
-});
+function serializeComponentInfo(info) {
+  return JSON.parse(JSON.stringify(info, (key, value) => {
+    if (typeof value === "function")
+      return serializeFn(value);
+    return value;
+  }));
+}
 const UPDATE_COOKIES_AND_STYLES_SCRIPT = "function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {\n  function getAndSetVariantId() {\n    function setCookie(name, value, days) {\n      let expires = '';\n      if (days) {\n        const date = new Date();\n        date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);\n        expires = '; expires=' + date.toUTCString();\n      }\n      document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';\n    }\n    function getCookie(name) {\n      const nameEQ = name + '=';\n      const ca = document.cookie.split(';');\n      for (let i = 0; i < ca.length; i++) {\n        let c = ca[i];\n        while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n      }\n      return null;\n    }\n    const cookieName = `builder.tests.${contentId}`;\n    const variantInCookie = getCookie(cookieName);\n    const availableIDs = variants.map(vr => vr.id).concat(contentId);\n    if (variantInCookie && availableIDs.includes(variantInCookie)) {\n      return variantInCookie;\n    }\n    let n = 0;\n    const random = Math.random();\n    for (let i = 0; i < variants.length; i++) {\n      const variant = variants[i];\n      const testRatio = variant.testRatio;\n      n += testRatio;\n      if (random < n) {\n        setCookie(cookieName, variant.id);\n        return variant.id;\n      }\n    }\n    setCookie(cookieName, contentId);\n    return contentId;\n  }\n  const winningVariantId = getAndSetVariantId();\n  const styleEl = document.currentScript?.previousElementSibling;\n  if (isHydrationTarget) {\n    styleEl.remove();\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  } else {\n    const newStyleStr = variants.concat({\n      id: contentId\n    }).filter(variant => variant.id !== winningVariantId).map(value => {\n      return `.variant-${value.id} {  display: none; }\n        `;\n    }).join('');\n    styleEl.innerHTML = newStyleStr;\n  }\n}";
 const UPDATE_VARIANT_VISIBILITY_SCRIPT = "function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {\n  if (!navigator.cookieEnabled) {\n    return;\n  }\n  function getCookie(name) {\n    const nameEQ = name + '=';\n    const ca = document.cookie.split(';');\n    for (let i = 0; i < ca.length; i++) {\n      let c = ca[i];\n      while (c.charAt(0) === ' ') c = c.substring(1, c.length);\n      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);\n    }\n    return null;\n  }\n  const cookieName = `builder.tests.${defaultContentId}`;\n  const winningVariant = getCookie(cookieName);\n  const parentDiv = document.currentScript?.parentElement;\n  const isDefaultContent = variantContentId === defaultContentId;\n  const isWinningVariant = winningVariant === variantContentId;\n  if (isWinningVariant && !isDefaultContent) {\n    parentDiv?.removeAttribute('hidden');\n    parentDiv?.removeAttribute('aria-hidden');\n  } else if (!isWinningVariant && isDefaultContent) {\n    parentDiv?.setAttribute('hidden', 'true');\n    parentDiv?.setAttribute('aria-hidden', 'true');\n  }\n  if (isHydrationTarget) {\n    if (!isWinningVariant) {\n      parentDiv?.remove();\n    }\n    const thisScriptEl = document.currentScript;\n    thisScriptEl?.remove();\n  }\n  return;\n}";
 const UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest";
@@ -5344,7 +5346,7 @@ function isFromTrustedHost(trustedHosts, e) {
   const url = new URL(e.origin), hostname = url.hostname;
   return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
 }
-const SDK_VERSION = "0.16.1";
+const SDK_VERSION = "0.16.3";
 const registry = {};
 function register(type, info) {
   let typeList = registry[type];
@@ -6030,7 +6032,7 @@ const getContentInitialValue = ({ content, data }) => {
   };
 };
 const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   _jsxBranch();
   const state = useStore({
     builderContextSignal: {
@@ -6051,7 +6053,13 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
       apiVersion: props.apiVersion,
       componentInfos: [
         ...getDefaultRegisteredComponents(),
-        ...props.customComponents || []
+        ...((_a = props.customComponents) == null ? void 0 : _a.filter(({ models }) => {
+          if (!(models == null ? void 0 : models.length))
+            return true;
+          if (!props.model)
+            return true;
+          return models.includes(props.model);
+        })) || []
       ].reduce((acc, { component: _, ...info }) => ({
         ...acc,
         [info.name]: serializeComponentInfo(info)
@@ -6063,7 +6071,13 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
     },
     registeredComponents: [
       ...getDefaultRegisteredComponents(),
-      ...props.customComponents || []
+      ...((_b = props.customComponents) == null ? void 0 : _b.filter(({ models }) => {
+        if (!(models == null ? void 0 : models.length))
+          return true;
+        if (!props.model)
+          return true;
+        return models.includes(props.model);
+      })) || []
     ].reduce((acc, { component, ...info }) => ({
       ...acc,
       [info.name]: {
@@ -6073,9 +6087,9 @@ const ContentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl
     }), {}),
     scriptStr: getUpdateVariantVisibilityScript({
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      variationId: (_a = props.content) == null ? void 0 : _a.testVariationId,
+      variationId: (_c = props.content) == null ? void 0 : _c.testVariationId,
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
-      contentId: (_b = props.content) == null ? void 0 : _b.id
+      contentId: (_d = props.content) == null ? void 0 : _d.id
     })
   }, {
     deep: true
@@ -6308,8 +6322,6 @@ const ContentVariants = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(
     props,
     state
   ]));
-  useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track: track2 }) => {
-  }, "ContentVariants_component_useTask_lSvynevU008"));
   return /* @__PURE__ */ _jsxC(Fragment$1, {
     children: [
       !props.isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ _jsxC(InlinedScript, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/sdk-qwik",
-  "version": "0.16.1",
+  "version": "0.16.3",
   "homepage": "https://github.com/BuilderIO/builder/tree/main/packages/sdks/output/qwik",
   "repository": {
     "type": "git",

package/types/src/constants/sdk-version.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "0.16.1";
+export declare const SDK_VERSION = "0.16.3";

package/types/src/functions/register-component.d.ts

@@ -1,6 +1,6 @@
 import type { ComponentInfo } from '../types/components';
 export declare const createRegisterComponentMessage: (info: ComponentInfo) => {
     type: string;
-    data: ComponentInfo;
+    data: any;
 };
-export declare const serializeComponentInfo: ({ inputs, ...info }: ComponentInfo) => ComponentInfo;
+export declare function serializeComponentInfo(info: ComponentInfo): any;