@builder.io/sdk-qwik 0.16.11 → 0.16.13

package/lib/edge/blocks/form/input/input.qwik.mjs

@@ -1,6 +1,6 @@
-import { componentQrl, inlinedQrl, createElement } from "@builder.io/qwik";
+import { component$, createElement } from "@builder.io/qwik";
 import { isEditing } from "../../../functions/is-editing.qwik.mjs";
-const FormInputComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
+const FormInputComponent = component$((props) => {
   return /* @__PURE__ */ createElement("input", {
     ...props.attributes,
     key: isEditing() && props.defaultValue ? props.defaultValue : "default-key",
@@ -11,7 +11,7 @@ const FormInputComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQ
     defaultValue: props.defaultValue,
     required: props.required
   });
-}, "FormInputComponent_component_AUUjdN0ueMs"));
+});
 export {
   FormInputComponent,
   FormInputComponent as default

package/lib/edge/blocks/form/select/select.qwik.cjs

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const qwik = require("@builder.io/qwik");
 const isEditing = require("../../../functions/is-editing.qwik.cjs");
-const SelectComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
+const SelectComponent = qwik.component$((props) => {
   return /* @__PURE__ */ qwik.createElement("select", {
     ...props.attributes,
     value: props.value,
@@ -11,10 +12,11 @@ const SelectComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.i
     name: props.name,
     required: props.required
   }, (props.options || []).map((option, index) => {
-    return /* @__PURE__ */ qwik._jsxQ("option", {
-      value: qwik._wrapSignal(option, "value")
-    }, null, option.name || option.value, 1, `${option.name}-${index}`);
+    return /* @__PURE__ */ jsxRuntime.jsx("option", {
+      value: option.value,
+      children: option.name || option.value
+    }, `${option.name}-${index}`);
   }));
-}, "SelectComponent_component_SPKbsFLikZU"));
+});
 exports.SelectComponent = SelectComponent;
 exports.default = SelectComponent;

package/lib/edge/blocks/form/select/select.qwik.mjs

@@ -1,6 +1,7 @@
-import { componentQrl, inlinedQrl, createElement, _jsxQ, _wrapSignal } from "@builder.io/qwik";
+import { jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$, createElement } from "@builder.io/qwik";
 import { isEditing } from "../../../functions/is-editing.qwik.mjs";
-const SelectComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
+const SelectComponent = component$((props) => {
   return /* @__PURE__ */ createElement("select", {
     ...props.attributes,
     value: props.value,
@@ -9,11 +10,12 @@ const SelectComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl(
     name: props.name,
     required: props.required
   }, (props.options || []).map((option, index) => {
-    return /* @__PURE__ */ _jsxQ("option", {
-      value: _wrapSignal(option, "value")
-    }, null, option.name || option.value, 1, `${option.name}-${index}`);
+    return /* @__PURE__ */ jsx("option", {
+      value: option.value,
+      children: option.name || option.value
+    }, `${option.name}-${index}`);
   }));
-}, "SelectComponent_component_SPKbsFLikZU"));
+});
 export {
   SelectComponent,
   SelectComponent as default

package/lib/edge/blocks/form/submit-button/submit-button.qwik.cjs

@@ -1,15 +1,13 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const qwik = require("@builder.io/qwik");
-const SubmitButton = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
-  return /* @__PURE__ */ qwik._jsxS("button", {
+const SubmitButton = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("button", {
+    type: "submit",
     ...props.attributes,
-    children: qwik._fnSignal((p0) => p0.text, [
-      props
-    ], "p0.text")
-  }, {
-    type: "submit"
-  }, 0, "6z_0");
-}, "SubmitButton_component_NXvMBMCDhwc"));
+    children: props.text
+  });
+});
 exports.SubmitButton = SubmitButton;
 exports.default = SubmitButton;

package/lib/edge/blocks/form/submit-button/submit-button.qwik.mjs

@@ -1,14 +1,12 @@
-import { componentQrl, inlinedQrl, _jsxS, _fnSignal } from "@builder.io/qwik";
-const SubmitButton = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("button", {
+import { jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$ } from "@builder.io/qwik";
+const SubmitButton = component$((props) => {
+  return /* @__PURE__ */ jsx("button", {
+    type: "submit",
     ...props.attributes,
-    children: _fnSignal((p0) => p0.text, [
-      props
-    ], "p0.text")
-  }, {
-    type: "submit"
-  }, 0, "6z_0");
-}, "SubmitButton_component_NXvMBMCDhwc"));
+    children: props.text
+  });
+});
 export {
   SubmitButton,
   SubmitButton as default

package/lib/edge/blocks/form/textarea/textarea.qwik.cjs

@@ -1,26 +1,16 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const qwik = require("@builder.io/qwik");
-const Textarea = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
-  return /* @__PURE__ */ qwik._jsxS("textarea", {
-    ...props.attributes
-  }, {
-    defaultValue: qwik._fnSignal((p0) => p0.defaultValue, [
-      props
-    ], "p0.defaultValue"),
-    name: qwik._fnSignal((p0) => p0.name, [
-      props
-    ], "p0.name"),
-    placeholder: qwik._fnSignal((p0) => p0.placeholder, [
-      props
-    ], "p0.placeholder"),
-    required: qwik._fnSignal((p0) => p0.required, [
-      props
-    ], "p0.required"),
-    value: qwik._fnSignal((p0) => p0.value, [
-      props
-    ], "p0.value")
-  }, 0, "kE_0");
-}, "Textarea_component_o1TcxV139Oc"));
+const Textarea = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("textarea", {
+    ...props.attributes,
+    placeholder: props.placeholder,
+    name: props.name,
+    value: props.value,
+    defaultValue: props.defaultValue,
+    required: props.required
+  });
+});
 exports.Textarea = Textarea;
 exports.default = Textarea;

package/lib/edge/blocks/form/textarea/textarea.qwik.mjs

@@ -1,25 +1,15 @@
-import { componentQrl, inlinedQrl, _jsxS, _fnSignal } from "@builder.io/qwik";
-const Textarea = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxS("textarea", {
-    ...props.attributes
-  }, {
-    defaultValue: _fnSignal((p0) => p0.defaultValue, [
-      props
-    ], "p0.defaultValue"),
-    name: _fnSignal((p0) => p0.name, [
-      props
-    ], "p0.name"),
-    placeholder: _fnSignal((p0) => p0.placeholder, [
-      props
-    ], "p0.placeholder"),
-    required: _fnSignal((p0) => p0.required, [
-      props
-    ], "p0.required"),
-    value: _fnSignal((p0) => p0.value, [
-      props
-    ], "p0.value")
-  }, 0, "kE_0");
-}, "Textarea_component_o1TcxV139Oc"));
+import { jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$ } from "@builder.io/qwik";
+const Textarea = component$((props) => {
+  return /* @__PURE__ */ jsx("textarea", {
+    ...props.attributes,
+    placeholder: props.placeholder,
+    name: props.name,
+    value: props.value,
+    defaultValue: props.defaultValue,
+    required: props.required
+  });
+});
 export {
   Textarea,
   Textarea as default

package/lib/edge/blocks/fragment/fragment.qwik.cjs

@@ -1,8 +1,11 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const qwik = require("@builder.io/qwik");
-const FragmentComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
-  return /* @__PURE__ */ qwik._jsxQ("span", null, null, /* @__PURE__ */ qwik._jsxC(qwik.Slot, null, 3, "oj_0"), 1, "oj_1");
-}, "FragmentComponent_component_T0AypnadAK0"));
+const FragmentComponent = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", {
+    children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
+  });
+});
 exports.FragmentComponent = FragmentComponent;
 exports.default = FragmentComponent;

package/lib/edge/blocks/fragment/fragment.qwik.mjs

@@ -1,7 +1,10 @@
-import { componentQrl, inlinedQrl, _jsxQ, _jsxC, Slot } from "@builder.io/qwik";
-const FragmentComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
-  return /* @__PURE__ */ _jsxQ("span", null, null, /* @__PURE__ */ _jsxC(Slot, null, 3, "oj_0"), 1, "oj_1");
-}, "FragmentComponent_component_T0AypnadAK0"));
+import { jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$, Slot } from "@builder.io/qwik";
+const FragmentComponent = component$((props) => {
+  return /* @__PURE__ */ jsx("span", {
+    children: /* @__PURE__ */ jsx(Slot, {})
+  });
+});
 export {
   FragmentComponent,
   FragmentComponent as default

package/lib/edge/blocks/image/component-info.qwik.cjs

@@ -43,8 +43,9 @@ const componentInfo = {
             });
             img.src = url;
             setTimeout(() => {
-              if (!loaded)
+              if (!loaded) {
                 reject(new Error("Image load timed out"));
+              }
             }, timeout);
           });
         }
@@ -54,10 +55,11 @@ const componentInfo = {
         const value = options.get("image");
         const aspectRatio = options.get("aspectRatio");
         fetch(value).then((res) => res.blob()).then((blob) => {
-          if (blob.type.includes("svg"))
+          if (blob.type.includes("svg")) {
             options.set("noWebp", true);
+          }
         });
-        if (value && (!aspectRatio || aspectRatio === DEFAULT_ASPECT_RATIO))
+        if (value && (!aspectRatio || aspectRatio === DEFAULT_ASPECT_RATIO)) {
           return loadImage(value).then((img) => {
             const possiblyUpdatedAspectRatio = options.get("aspectRatio");
             if (options.get("image") === value && (!possiblyUpdatedAspectRatio || possiblyUpdatedAspectRatio === DEFAULT_ASPECT_RATIO)) {
@@ -68,6 +70,7 @@ const componentInfo = {
               }
             }
           });
+        }
       }
     },
     {

package/lib/edge/blocks/image/component-info.qwik.mjs

@@ -41,8 +41,9 @@ const componentInfo = {
             });
             img.src = url;
             setTimeout(() => {
-              if (!loaded)
+              if (!loaded) {
                 reject(new Error("Image load timed out"));
+              }
             }, timeout);
           });
         }
@@ -52,10 +53,11 @@ const componentInfo = {
         const value = options.get("image");
         const aspectRatio = options.get("aspectRatio");
         fetch(value).then((res) => res.blob()).then((blob) => {
-          if (blob.type.includes("svg"))
+          if (blob.type.includes("svg")) {
             options.set("noWebp", true);
+          }
         });
-        if (value && (!aspectRatio || aspectRatio === DEFAULT_ASPECT_RATIO))
+        if (value && (!aspectRatio || aspectRatio === DEFAULT_ASPECT_RATIO)) {
           return loadImage(value).then((img) => {
             const possiblyUpdatedAspectRatio = options.get("aspectRatio");
             if (options.get("image") === value && (!possiblyUpdatedAspectRatio || possiblyUpdatedAspectRatio === DEFAULT_ASPECT_RATIO)) {
@@ -66,6 +68,7 @@ const componentInfo = {
               }
             }
           });
+        }
       }
     },
     {

package/lib/edge/blocks/image/image.helpers.qwik.cjs

@@ -6,15 +6,18 @@ function removeProtocol(path) {
 function updateQueryParam(uri = "", key, value) {
   const re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
   const separator = uri.indexOf("?") !== -1 ? "&" : "?";
-  if (uri.match(re))
+  if (uri.match(re)) {
     return uri.replace(re, "$1" + key + "=" + encodeURIComponent(value) + "$2");
+  }
   return uri + separator + key + "=" + encodeURIComponent(value);
 }
 function getShopifyImageUrl(src, size) {
-  if (!src || !(src == null ? void 0 : src.match(/cdn\.shopify\.com/)) || !size)
+  if (!src || !(src == null ? void 0 : src.match(/cdn\.shopify\.com/)) || !size) {
     return src;
-  if (size === "master")
+  }
+  if (size === "master") {
     return removeProtocol(src);
+  }
   const match = src.match(/(_\d+x(\d+)?)?(\.(jpg|jpeg|gif|png|bmp|bitmap|tiff|tif)(\?v=\d+)?)/i);
   if (match) {
     const prefix = src.split(match[0]);
@@ -25,8 +28,9 @@ function getShopifyImageUrl(src, size) {
   return null;
 }
 function getSrcSet(url) {
-  if (!url)
+  if (!url) {
     return url;
+  }
   const sizes = [
     100,
     200,
@@ -39,19 +43,21 @@ function getSrcSet(url) {
   if (url.match(/builder\.io/)) {
     let srcUrl = url;
     const widthInSrc = Number(url.split("?width=")[1]);
-    if (!isNaN(widthInSrc))
+    if (!isNaN(widthInSrc)) {
       srcUrl = `${srcUrl} ${widthInSrc}w`;
+    }
     return sizes.filter((size) => size !== widthInSrc).map((size) => `${updateQueryParam(url, "width", size)} ${size}w`).concat([
       srcUrl
     ]).join(", ");
   }
-  if (url.match(/cdn\.shopify\.com/))
+  if (url.match(/cdn\.shopify\.com/)) {
     return sizes.map((size) => [
       getShopifyImageUrl(url, `${size}x${size}`),
       size
     ]).filter(([sizeUrl]) => !!sizeUrl).map(([sizeUrl, size]) => `${sizeUrl} ${size}w`).concat([
       url
     ]).join(", ");
+  }
   return url;
 }
 exports.getSrcSet = getSrcSet;

package/lib/edge/blocks/image/image.helpers.qwik.mjs

@@ -4,15 +4,18 @@ function removeProtocol(path) {
 function updateQueryParam(uri = "", key, value) {
   const re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
   const separator = uri.indexOf("?") !== -1 ? "&" : "?";
-  if (uri.match(re))
+  if (uri.match(re)) {
     return uri.replace(re, "$1" + key + "=" + encodeURIComponent(value) + "$2");
+  }
   return uri + separator + key + "=" + encodeURIComponent(value);
 }
 function getShopifyImageUrl(src, size) {
-  if (!src || !(src == null ? void 0 : src.match(/cdn\.shopify\.com/)) || !size)
+  if (!src || !(src == null ? void 0 : src.match(/cdn\.shopify\.com/)) || !size) {
     return src;
-  if (size === "master")
+  }
+  if (size === "master") {
     return removeProtocol(src);
+  }
   const match = src.match(/(_\d+x(\d+)?)?(\.(jpg|jpeg|gif|png|bmp|bitmap|tiff|tif)(\?v=\d+)?)/i);
   if (match) {
     const prefix = src.split(match[0]);
@@ -23,8 +26,9 @@ function getShopifyImageUrl(src, size) {
   return null;
 }
 function getSrcSet(url) {
-  if (!url)
+  if (!url) {
     return url;
+  }
   const sizes = [
     100,
     200,
@@ -37,19 +41,21 @@ function getSrcSet(url) {
   if (url.match(/builder\.io/)) {
     let srcUrl = url;
     const widthInSrc = Number(url.split("?width=")[1]);
-    if (!isNaN(widthInSrc))
+    if (!isNaN(widthInSrc)) {
       srcUrl = `${srcUrl} ${widthInSrc}w`;
+    }
     return sizes.filter((size) => size !== widthInSrc).map((size) => `${updateQueryParam(url, "width", size)} ${size}w`).concat([
       srcUrl
     ]).join(", ");
   }
-  if (url.match(/cdn\.shopify\.com/))
+  if (url.match(/cdn\.shopify\.com/)) {
     return sizes.map((size) => [
       getShopifyImageUrl(url, `${size}x${size}`),
       size
     ]).filter(([sizeUrl]) => !!sizeUrl).map(([sizeUrl, size]) => `${sizeUrl} ${size}w`).concat([
       url
     ]).join(", ");
+  }
   return url;
 }
 export {

package/lib/edge/blocks/image/image.qwik.cjs

@@ -1,46 +1,42 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const qwik = require("@builder.io/qwik");
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const image_helpers = require("./image.helpers.qwik.cjs");
-const Image = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
+const qwik = require("@builder.io/qwik");
+const Image = qwik.component$((props) => {
   var _a, _b, _c, _d, _e, _f;
-  qwik._jsxBranch();
-  qwik.useStylesScopedQrl(/* @__PURE__ */ qwik.inlinedQrl(STYLES, "Image_component_useStylesScoped_fBMYiVf9fuU"));
-  const srcSetToUse = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
+  qwik.useStylesScoped$(STYLES);
+  const srcSetToUse = qwik.useComputed$(() => {
     var _a2;
-    const [props2] = qwik.useLexicalScope();
-    const imageToUse = props2.image || props2.src;
+    const imageToUse = props.image || props.src;
     const url = imageToUse;
     if (!url || // We can auto add srcset for cdn.builder.io and shopify
     // images, otherwise you can supply this prop manually
-    !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/)))
-      return props2.srcset;
-    if (props2.noWebp)
+    !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) {
+      return props.srcset;
+    }
+    if (props.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])) {
+    }
+    if (props.srcset && ((_a2 = props.image) == null ? void 0 : _a2.includes("builder.io/api/v1/image"))) {
+      if (!props.srcset.includes(props.image.split("?")[0])) {
         console.debug("Removed given srcset");
         return image_helpers.getSrcSet(url);
       }
-    } else if (props2.image && !props2.srcset)
+    } else if (props.image && !props.srcset) {
       return image_helpers.getSrcSet(url);
+    }
     return image_helpers.getSrcSet(url);
-  }, "Image_component_srcSetToUse_useComputed_TZMibf9Gpvw", [
-    props
-  ]));
-  const webpSrcSet = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
+  });
+  const webpSrcSet = qwik.useComputed$(() => {
     var _a2;
-    const [props2, srcSetToUse2] = qwik.useLexicalScope();
-    if (((_a2 = srcSetToUse2.value) == null ? void 0 : _a2.match(/builder\.io/)) && !props2.noWebp)
-      return srcSetToUse2.value.replace(/\?/g, "?format=webp&");
-    else
+    if (((_a2 = srcSetToUse.value) == null ? void 0 : _a2.match(/builder\.io/)) && !props.noWebp) {
+      return srcSetToUse.value.replace(/\?/g, "?format=webp&");
+    } else {
       return "";
-  }, "Image_component_webpSrcSet_useComputed_01YCu72BBtA", [
-    props,
-    srcSetToUse
-  ]));
-  const aspectRatioCss = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
-    const [props2] = qwik.useLexicalScope();
+    }
+  });
+  const aspectRatioCss = qwik.useComputed$(() => {
     const aspectRatioStyles = {
       position: "absolute",
       height: "100%",
@@ -48,72 +44,50 @@ const Image = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl(
       left: "0px",
       top: "0px"
     };
-    const out = props2.aspectRatio ? aspectRatioStyles : void 0;
+    const out = props.aspectRatio ? aspectRatioStyles : void 0;
     return out;
-  }, "Image_component_aspectRatioCss_useComputed_yJ1jG0g5fbw", [
-    props
-  ]));
-  qwik.useVisibleTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
-  }, "Image_component_useVisibleTask_pRTGrfPyv0Y"));
-  return /* @__PURE__ */ qwik._jsxC(qwik.Fragment, {
+  });
+  qwik.useVisibleTask$(() => {
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(qwik.Fragment, {
     children: [
-      /* @__PURE__ */ qwik._jsxQ("picture", null, null, [
-        webpSrcSet.value ? /* @__PURE__ */ qwik._jsxQ("source", null, {
-          srcset: qwik._fnSignal((p0) => p0.value, [
-            webpSrcSet
-          ], "p0.value"),
-          type: "image/webp"
-        }, null, 3, "0A_0") : null,
-        /* @__PURE__ */ qwik._jsxQ("img", null, {
-          alt: qwik._fnSignal((p0) => p0.altText, [
-            props
-          ], "p0.altText"),
-          class: qwik._fnSignal((p0) => "builder-image" + (p0.className ? " " + p0.className : "") + " img-Image", [
-            props
-          ], '"builder-image"+(p0.className?" "+p0.className:"")+" img-Image"'),
-          fetchPriority: qwik._fnSignal((p0) => p0.highPriority ? "high" : "auto", [
-            props
-          ], 'p0.highPriority?"high":"auto"'),
-          loading: qwik._fnSignal((p0) => p0.highPriority ? "eager" : "lazy", [
-            props
-          ], 'p0.highPriority?"eager":"lazy"'),
-          role: qwik._fnSignal((p0) => p0.altText ? void 0 : "presentation", [
-            props
-          ], 'p0.altText?undefined:"presentation"'),
-          sizes: qwik._fnSignal((p0) => p0.sizes, [
-            props
-          ], "p0.sizes"),
-          src: qwik._fnSignal((p0) => p0.image, [
-            props
-          ], "p0.image"),
-          srcset: qwik._fnSignal((p0) => p0.value, [
-            srcSetToUse
-          ], "p0.value"),
-          style: qwik._fnSignal((p0, p1) => ({
-            objectPosition: p1.backgroundPosition || "center",
-            objectFit: p1.backgroundSize || "cover",
-            ...p0.value
-          }), [
-            aspectRatioCss,
-            props
-          ], '{objectPosition:p1.backgroundPosition||"center",objectFit:p1.backgroundSize||"cover",...p0.value}')
-        }, null, 3, null)
-      ], 1, null),
-      props.aspectRatio && !(((_b = (_a = props.builderBlock) == null ? void 0 : _a.children) == null ? void 0 : _b.length) && props.fitContent) ? /* @__PURE__ */ qwik._jsxQ("div", null, {
+      /* @__PURE__ */ jsxRuntime.jsxs("picture", {
+        children: [
+          webpSrcSet.value ? /* @__PURE__ */ jsxRuntime.jsx("source", {
+            type: "image/webp",
+            srcset: webpSrcSet.value
+          }) : null,
+          /* @__PURE__ */ jsxRuntime.jsx("img", {
+            loading: props.highPriority ? "eager" : "lazy",
+            fetchPriority: props.highPriority ? "high" : "auto",
+            alt: props.altText,
+            role: props.altText ? void 0 : "presentation",
+            style: {
+              objectPosition: props.backgroundPosition || "center",
+              objectFit: props.backgroundSize || "cover",
+              ...aspectRatioCss.value
+            },
+            class: "builder-image" + (props.className ? " " + props.className : "") + " img-Image",
+            src: props.image,
+            srcset: srcSetToUse.value,
+            sizes: props.sizes
+          })
+        ]
+      }),
+      props.aspectRatio && !(((_b = (_a = props.builderBlock) == null ? void 0 : _a.children) == null ? void 0 : _b.length) && props.fitContent) ? /* @__PURE__ */ jsxRuntime.jsx("div", {
         class: "builder-image-sizer div-Image",
-        style: qwik._fnSignal((p0) => ({
-          paddingTop: p0.aspectRatio * 100 + "%"
-        }), [
-          props
-        ], '{paddingTop:p0.aspectRatio*100+"%"}')
-      }, null, 3, "0A_1") : null,
-      ((_d = (_c = props.builderBlock) == null ? void 0 : _c.children) == null ? void 0 : _d.length) && props.fitContent ? /* @__PURE__ */ qwik._jsxC(qwik.Slot, null, 3, "0A_2") : null,
-      !props.fitContent && ((_f = (_e = props.builderBlock) == null ? void 0 : _e.children) == null ? void 0 : _f.length) ? /* @__PURE__ */ qwik._jsxQ("div", null, {
-        class: "div-Image-2"
-      }, /* @__PURE__ */ qwik._jsxC(qwik.Slot, null, 3, "0A_3"), 1, "0A_4") : null
+        style: {
+          paddingTop: props.aspectRatio * 100 + "%"
+        }
+      }) : null,
+      ((_d = (_c = props.builderBlock) == null ? void 0 : _c.children) == null ? void 0 : _d.length) && props.fitContent ? /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {}) : null,
+      !props.fitContent && ((_f = (_e = props.builderBlock) == null ? void 0 : _e.children) == null ? void 0 : _f.length) ? /* @__PURE__ */ jsxRuntime.jsx("div", {
+        class: "div-Image-2",
+        children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {})
+      }) : null
     ]
-  }, 1, "0A_5");
-}, "Image_component_LRxDkFa1EfU"));
+  });
+});
 const STYLES = `
 .img-Image {
   opacity: 1;