@builder.io/sdk-qwik 0.20.1 → 0.22.1

package/lib/browser/components/block/components/interactive-element.qwik.cjs

@@ -4,7 +4,10 @@ const qwik = require("@builder.io/qwik");
 const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
 const getBlockActions = require("../../../functions/get-block-actions.qwik.cjs");
 const getBlockProperties = require("../../../functions/get-block-properties.qwik.cjs");
+require("../../../helpers/user-attributes.qwik.cjs");
+require("../../../functions/get-fetch.qwik.cjs");
 const awaiter = require("../../awaiter.qwik.cjs");
+require("../../../context/builder.context.qwik.cjs");
 const InteractiveElement = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
   qwik._jsxBranch();
   const attributes = qwik.useComputedQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
@@ -79,8 +82,8 @@ const InteractiveElement = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwi
       ...targetWrapperProps.value,
       attributes: attributes.value,
       key: "wrapper-" + state.forceRenderCount
-    }, /* @__PURE__ */ qwik._jsxC(qwik.Slot, null, 3, "q0_2"))
-  }, 1, "q0_3");
+    }, /* @__PURE__ */ qwik._jsxC(qwik.Slot, null, 3, "q0_4"))
+  }, 1, "q0_5");
 }, "InteractiveElement_component_0UqfJpjhn0g"));
 exports.InteractiveElement = InteractiveElement;
 exports.default = InteractiveElement;

package/lib/browser/components/block/components/interactive-element.qwik.mjs

@@ -2,7 +2,10 @@ import { componentQrl, inlinedQrl, _jsxBranch, useComputedQrl, useLexicalScope,
 import { Fragment } from "@builder.io/qwik/jsx-runtime";
 import { getBlockActions } from "../../../functions/get-block-actions.qwik.mjs";
 import { getBlockProperties } from "../../../functions/get-block-properties.qwik.mjs";
+import "../../../helpers/user-attributes.qwik.mjs";
+import "../../../functions/get-fetch.qwik.mjs";
 import { Awaiter } from "../../awaiter.qwik.mjs";
+import "../../../context/builder.context.qwik.mjs";
 const InteractiveElement = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
   _jsxBranch();
   const attributes = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
@@ -77,8 +80,8 @@ const InteractiveElement = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQ
       ...targetWrapperProps.value,
       attributes: attributes.value,
       key: "wrapper-" + state.forceRenderCount
-    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "q0_2"))
-  }, 1, "q0_3");
+    }, /* @__PURE__ */ _jsxC(Slot, null, 3, "q0_4"))
+  }, 1, "q0_5");
 }, "InteractiveElement_component_0UqfJpjhn0g"));
 export {
   InteractiveElement,

package/lib/browser/components/block/components/style-wrapper.qwik.cjs

@@ -0,0 +1,52 @@
+"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 builder_context = require("../../../context/builder.context.qwik.cjs");
+const blockStyles = require("./block-styles.qwik.cjs");
+require("@builder.io/qwik/build");
+const StyleWrapper = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inlinedQrl((props) => {
+  qwik._jsxBranch();
+  qwik.useContext(builder_context);
+  const state = qwik.useStore({
+    isClientEditing: false,
+    isHydrated: false
+  });
+  qwik.useVisibleTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(() => {
+  }, "StyleWrapper_component_useVisibleTask_7i19DZr5064"));
+  return /* @__PURE__ */ qwik._jsxC(jsxRuntime.Fragment, {
+    children: state.isHydrated ? /* @__PURE__ */ qwik._jsxC(blockStyles.BlockStyles, {
+      get block() {
+        return props.block;
+      },
+      get context() {
+        return props.context;
+      },
+      [qwik._IMMUTABLE]: {
+        block: qwik._fnSignal((p0) => p0.block, [
+          props
+        ], "p0.block"),
+        context: qwik._fnSignal((p0) => p0.context, [
+          props
+        ], "p0.context")
+      }
+    }, 3, "Ei_1") : /* @__PURE__ */ qwik._jsxC(blockStyles.BlockStyles, {
+      get block() {
+        return props.block;
+      },
+      get context() {
+        return props.context;
+      },
+      [qwik._IMMUTABLE]: {
+        block: qwik._fnSignal((p0) => p0.block, [
+          props
+        ], "p0.block"),
+        context: qwik._fnSignal((p0) => p0.context, [
+          props
+        ], "p0.context")
+      }
+    }, 3, "Ei_2")
+  }, 1, "Ei_3");
+}, "StyleWrapper_component_LTSEjsY8B70"));
+exports.StyleWrapper = StyleWrapper;
+exports.default = StyleWrapper;

package/lib/browser/components/block/components/style-wrapper.qwik.mjs

@@ -0,0 +1,52 @@
+import { componentQrl, inlinedQrl, _jsxBranch, useContext, useStore, useVisibleTaskQrl, _jsxC, _IMMUTABLE, _fnSignal } from "@builder.io/qwik";
+import { Fragment } from "@builder.io/qwik/jsx-runtime";
+import builderContext from "../../../context/builder.context.qwik.mjs";
+import { BlockStyles } from "./block-styles.qwik.mjs";
+import "@builder.io/qwik/build";
+const StyleWrapper = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
+  _jsxBranch();
+  useContext(builderContext);
+  const state = useStore({
+    isClientEditing: false,
+    isHydrated: false
+  });
+  useVisibleTaskQrl(/* @__PURE__ */ inlinedQrl(() => {
+  }, "StyleWrapper_component_useVisibleTask_7i19DZr5064"));
+  return /* @__PURE__ */ _jsxC(Fragment, {
+    children: state.isHydrated ? /* @__PURE__ */ _jsxC(BlockStyles, {
+      get block() {
+        return props.block;
+      },
+      get context() {
+        return props.context;
+      },
+      [_IMMUTABLE]: {
+        block: _fnSignal((p0) => p0.block, [
+          props
+        ], "p0.block"),
+        context: _fnSignal((p0) => p0.context, [
+          props
+        ], "p0.context")
+      }
+    }, 3, "Ei_1") : /* @__PURE__ */ _jsxC(BlockStyles, {
+      get block() {
+        return props.block;
+      },
+      get context() {
+        return props.context;
+      },
+      [_IMMUTABLE]: {
+        block: _fnSignal((p0) => p0.block, [
+          props
+        ], "p0.block"),
+        context: _fnSignal((p0) => p0.context, [
+          props
+        ], "p0.context")
+      }
+    }, 3, "Ei_2")
+  }, 1, "Ei_3");
+}, "StyleWrapper_component_LTSEjsY8B70"));
+export {
+  StyleWrapper,
+  StyleWrapper as default
+};

package/lib/browser/components/content/components/enable-editor.qwik.cjs

@@ -20,7 +20,7 @@ const initEditing = require("../../../scripts/init-editing.qwik.cjs");
 const animator = require("../../block/animator.qwik.cjs");
 const enableEditor_helpers = require("./enable-editor.helpers.qwik.cjs");
 const styles_helpers = require("./styles.helpers.qwik.cjs");
-const mergeNewRootState = function mergeNewRootState2(props, state, showContentProps, elementRef, newData) {
+const mergeNewRootState = function mergeNewRootState2(props, state, showContentProps, elementRef, newData, editType) {
   var _a, _b;
   const combinedState = {
     ...props.builderContextSignal.rootState,
@@ -30,8 +30,12 @@ const mergeNewRootState = function mergeNewRootState2(props, state, showContentP
     (_b = (_a = props.builderContextSignal).rootSetState) == null ? void 0 : _b.call(_a, combinedState);
   else
     props.builderContextSignal.rootState = combinedState;
+  if (props.builderContextSignal.rootSetState)
+    props.builderContextSignal.rootSetState(combinedState);
+  else
+    props.builderContextSignal.rootState = combinedState;
 };
-const mergeNewContent = function mergeNewContent2(props, state, showContentProps, elementRef, newContent) {
+const mergeNewContent = function mergeNewContent2(props, state, showContentProps, elementRef, newContent, editType) {
   var _a, _b, _c, _d, _e;
   const newContentValue = {
     ...props.builderContextSignal.content,
@@ -68,10 +72,10 @@ const processMessage = function processMessage2(props, state, showContentProps,
       animation: (animation) => {
         animator.triggerAnimation(animation);
       },
-      contentUpdate: (newContent) => {
+      contentUpdate: (newContent, editType) => {
         mergeNewContent(props, state, showContentProps, elementRef, newContent);
       },
-      stateUpdate: (newState) => {
+      stateUpdate: (newState, editType) => {
         mergeNewRootState(props, state, showContentProps, elementRef, newState);
       }
     }
@@ -126,11 +130,14 @@ const runHttpRequests = function runHttpRequests2(props, state, showContentProps
       method: "GET"
     };
     logFetch.logFetch(JSON.stringify(fetchRequestObj));
-    fetch(fetchRequestObj.url, {
+    const fetchOptions = {
       method: fetchRequestObj.method,
       headers: fetchRequestObj.headers,
       body: fetchRequestObj.body
-    }).then((response) => response.json()).then((json) => {
+    };
+    if (fetchRequestObj.method === "GET")
+      delete fetchOptions.body;
+    fetch(fetchRequestObj.url, fetchOptions).then((response) => response.json()).then((json) => {
       mergeNewRootState(props, state, showContentProps, elementRef, {
         [key]: json
       });
@@ -169,9 +176,12 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
   const state = qwik.useStore({
     ContentWrapper: props.contentWrapper || "div",
     clicked: false,
+    contextValue: props.builderContextSignal,
     hasExecuted: false,
     httpReqsData: {},
-    httpReqsPending: {}
+    httpReqsPending: {},
+    prevData: null,
+    prevLocale: ""
   }, {
     deep: true
   });
@@ -305,8 +315,12 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
   qwik.useTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(({ track }) => {
     const [elementRef2, props2, showContentProps2, state2] = qwik.useLexicalScope();
     track(() => props2.data);
-    if (props2.data)
+    if (props2.data) {
+      if (state2.prevData === props2.data)
+        return;
       mergeNewRootState(props2, state2, showContentProps2, elementRef2, props2.data);
+      state2.prevData = props2.data;
+    }
   }, "EnableEditor_component_useTask_3_bQ0e5LHZwWE", [
     elementRef,
     props,
@@ -316,10 +330,14 @@ const EnableEditor = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inli
   qwik.useTaskQrl(/* @__PURE__ */ qwik.inlinedQrl(({ track }) => {
     const [elementRef2, props2, showContentProps2, state2] = qwik.useLexicalScope();
     track(() => props2.locale);
-    if (props2.locale)
+    if (props2.locale) {
+      if (state2.prevLocale === props2.locale)
+        return;
       mergeNewRootState(props2, state2, showContentProps2, elementRef2, {
         locale: props2.locale
       });
+      state2.prevLocale = props2.locale;
+    }
   }, "EnableEditor_component_useTask_4_moHYZG8uNVU", [
     elementRef,
     props,

package/lib/browser/components/content/components/enable-editor.qwik.mjs

@@ -18,7 +18,7 @@ import { setupBrowserForEditing } from "../../../scripts/init-editing.qwik.mjs";
 import { triggerAnimation } from "../../block/animator.qwik.mjs";
 import { needsElementRefDivForEditing } from "./enable-editor.helpers.qwik.mjs";
 import { getWrapperClassName } from "./styles.helpers.qwik.mjs";
-const mergeNewRootState = function mergeNewRootState2(props, state, showContentProps, elementRef, newData) {
+const mergeNewRootState = function mergeNewRootState2(props, state, showContentProps, elementRef, newData, editType) {
   var _a, _b;
   const combinedState = {
     ...props.builderContextSignal.rootState,
@@ -28,8 +28,12 @@ const mergeNewRootState = function mergeNewRootState2(props, state, showContentP
     (_b = (_a = props.builderContextSignal).rootSetState) == null ? void 0 : _b.call(_a, combinedState);
   else
     props.builderContextSignal.rootState = combinedState;
+  if (props.builderContextSignal.rootSetState)
+    props.builderContextSignal.rootSetState(combinedState);
+  else
+    props.builderContextSignal.rootState = combinedState;
 };
-const mergeNewContent = function mergeNewContent2(props, state, showContentProps, elementRef, newContent) {
+const mergeNewContent = function mergeNewContent2(props, state, showContentProps, elementRef, newContent, editType) {
   var _a, _b, _c, _d, _e;
   const newContentValue = {
     ...props.builderContextSignal.content,
@@ -66,10 +70,10 @@ const processMessage = function processMessage2(props, state, showContentProps,
       animation: (animation) => {
         triggerAnimation(animation);
       },
-      contentUpdate: (newContent) => {
+      contentUpdate: (newContent, editType) => {
         mergeNewContent(props, state, showContentProps, elementRef, newContent);
       },
-      stateUpdate: (newState) => {
+      stateUpdate: (newState, editType) => {
         mergeNewRootState(props, state, showContentProps, elementRef, newState);
       }
     }
@@ -124,11 +128,14 @@ const runHttpRequests = function runHttpRequests2(props, state, showContentProps
       method: "GET"
     };
     logFetch(JSON.stringify(fetchRequestObj));
-    fetch(fetchRequestObj.url, {
+    const fetchOptions = {
       method: fetchRequestObj.method,
       headers: fetchRequestObj.headers,
       body: fetchRequestObj.body
-    }).then((response) => response.json()).then((json) => {
+    };
+    if (fetchRequestObj.method === "GET")
+      delete fetchOptions.body;
+    fetch(fetchRequestObj.url, fetchOptions).then((response) => response.json()).then((json) => {
       mergeNewRootState(props, state, showContentProps, elementRef, {
         [key]: json
       });
@@ -167,9 +174,12 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
   const state = useStore({
     ContentWrapper: props.contentWrapper || "div",
     clicked: false,
+    contextValue: props.builderContextSignal,
     hasExecuted: false,
     httpReqsData: {},
-    httpReqsPending: {}
+    httpReqsPending: {},
+    prevData: null,
+    prevLocale: ""
   }, {
     deep: true
   });
@@ -303,8 +313,12 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
   useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track }) => {
     const [elementRef2, props2, showContentProps2, state2] = useLexicalScope();
     track(() => props2.data);
-    if (props2.data)
+    if (props2.data) {
+      if (state2.prevData === props2.data)
+        return;
       mergeNewRootState(props2, state2, showContentProps2, elementRef2, props2.data);
+      state2.prevData = props2.data;
+    }
   }, "EnableEditor_component_useTask_3_bQ0e5LHZwWE", [
     elementRef,
     props,
@@ -314,10 +328,14 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
   useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track }) => {
     const [elementRef2, props2, showContentProps2, state2] = useLexicalScope();
     track(() => props2.locale);
-    if (props2.locale)
+    if (props2.locale) {
+      if (state2.prevLocale === props2.locale)
+        return;
       mergeNewRootState(props2, state2, showContentProps2, elementRef2, {
         locale: props2.locale
       });
+      state2.prevLocale = props2.locale;
+    }
   }, "EnableEditor_component_useTask_4_moHYZG8uNVU", [
     elementRef,
     props,

package/lib/browser/constants/sdk-version.qwik.cjs

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const SDK_VERSION = "0.20.1";
+const SDK_VERSION = "0.22.1";
 exports.SDK_VERSION = SDK_VERSION;

package/lib/browser/constants/sdk-version.qwik.mjs

@@ -1,4 +1,4 @@
-const SDK_VERSION = "0.20.1";
+const SDK_VERSION = "0.22.1";
 export {
   SDK_VERSION
 };

package/lib/browser/functions/get-content/generate-content-url.qwik.cjs

@@ -21,15 +21,9 @@ const generateContentUrl = (options) => {
   url.searchParams.set("limit", String(limit));
   url.searchParams.set("noTraverse", String(noTraverse));
   url.searchParams.set("includeRefs", String(true));
-  const finalLocale = locale || (userAttributes == null ? void 0 : userAttributes.locale);
+  if (locale)
+    url.searchParams.set("locale", locale);
   let finalUserAttributes = userAttributes || {};
-  if (finalLocale) {
-    url.searchParams.set("locale", finalLocale);
-    finalUserAttributes = {
-      locale: finalLocale,
-      ...finalUserAttributes
-    };
-  }
   if (enrich)
     url.searchParams.set("enrich", String(enrich));
   url.searchParams.set("omit", omit ?? "meta.componentsUsed");

package/lib/browser/functions/get-content/generate-content-url.qwik.mjs

@@ -19,15 +19,9 @@ const generateContentUrl = (options) => {
   url.searchParams.set("limit", String(limit));
   url.searchParams.set("noTraverse", String(noTraverse));
   url.searchParams.set("includeRefs", String(true));
-  const finalLocale = locale || (userAttributes == null ? void 0 : userAttributes.locale);
+  if (locale)
+    url.searchParams.set("locale", locale);
   let finalUserAttributes = userAttributes || {};
-  if (finalLocale) {
-    url.searchParams.set("locale", finalLocale);
-    finalUserAttributes = {
-      locale: finalLocale,
-      ...finalUserAttributes
-    };
-  }
   if (enrich)
     url.searchParams.set("enrich", String(enrich));
   url.searchParams.set("omit", omit ?? "meta.componentsUsed");

package/lib/browser/functions/get-content/index.qwik.cjs

@@ -10,6 +10,15 @@ const isBrowser = require("../is-browser.qwik.cjs");
 const generateContentUrl = require("./generate-content-url.qwik.cjs");
 const checkContentHasResults = (content) => "results" in content;
 async function fetchOneEntry(options) {
+  var _a;
+  const finalLocale = options.locale || ((_a = options.userAttributes) == null ? void 0 : _a.locale);
+  if (finalLocale) {
+    options.locale = finalLocale;
+    options.userAttributes = {
+      locale: finalLocale,
+      ...options.userAttributes
+    };
+  }
   const allContent = await fetchEntries({
     ...options,
     limit: 1

package/lib/browser/functions/get-content/index.qwik.mjs

@@ -8,6 +8,15 @@ import { isBrowser } from "../is-browser.qwik.mjs";
 import { generateContentUrl } from "./generate-content-url.qwik.mjs";
 const checkContentHasResults = (content) => "results" in content;
 async function fetchOneEntry(options) {
+  var _a;
+  const finalLocale = options.locale || ((_a = options.userAttributes) == null ? void 0 : _a.locale);
+  if (finalLocale) {
+    options.locale = finalLocale;
+    options.userAttributes = {
+      locale: finalLocale,
+      ...options.userAttributes
+    };
+  }
   const allContent = await fetchEntries({
     ...options,
     limit: 1

package/lib/browser/helpers/subscribe-to-editor.qwik.cjs

@@ -21,16 +21,18 @@ const createEditorListener = ({ model, trustedHosts, callbacks }) => {
           const messageContent = data.data;
           const modelName = messageContent.model;
           const newState = messageContent == null ? void 0 : messageContent.state;
+          const editType = messageContent.editType;
           if (modelName === model && newState)
-            callbacks.stateUpdate(newState);
+            callbacks.stateUpdate(newState, editType);
           break;
         }
         case "builder.contentUpdate": {
           const messageContent = data.data;
           const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
           const contentData = messageContent.data;
+          const editType = messageContent.editType;
           if (key === model)
-            callbacks.contentUpdate(contentData);
+            callbacks.contentUpdate(contentData, editType);
           break;
         }
       }

package/lib/browser/helpers/subscribe-to-editor.qwik.mjs

@@ -19,16 +19,18 @@ const createEditorListener = ({ model, trustedHosts, callbacks }) => {
           const messageContent = data.data;
           const modelName = messageContent.model;
           const newState = messageContent == null ? void 0 : messageContent.state;
+          const editType = messageContent.editType;
           if (modelName === model && newState)
-            callbacks.stateUpdate(newState);
+            callbacks.stateUpdate(newState, editType);
           break;
         }
         case "builder.contentUpdate": {
           const messageContent = data.data;
           const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
           const contentData = messageContent.data;
+          const editType = messageContent.editType;
           if (key === model)
-            callbacks.contentUpdate(contentData);
+            callbacks.contentUpdate(contentData, editType);
           break;
         }
       }

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

@@ -21,6 +21,9 @@ const mergeNewRootState = function mergeNewRootState2(props, state, formRef, new
 const submissionState = function submissionState2(props, state, formRef) {
   return isEditing.isEditing() && props.previewState || state.formState;
 };
+const errorResponse = function errorResponse2(props, state, formRef, response) {
+  return JSON.stringify(response, null, 2);
+};
 const onSubmit = function onSubmit2(props, state, formRef, event) {
   var _a;
   const sendWithJsProp = props.sendWithJs || props.sendSubmissionsTo === "email";
@@ -246,7 +249,7 @@ const FormComponent = /* @__PURE__ */ qwik.componentQrl(/* @__PURE__ */ qwik.inl
       }, 3, "0n_2") : null,
       submissionState(props, state) === "error" && state.responseData ? /* @__PURE__ */ qwik._jsxQ("pre", null, {
         class: "builder-form-error-text pre-FormComponent"
-      }, JSON.stringify(state.responseData, null, 2), 1, "0n_3") : null,
+      }, errorResponse(props, state, formRef, state.responseData), 1, "0n_3") : null,
       submissionState(props, state) === "success" ? /* @__PURE__ */ qwik._jsxC(blocks.Blocks, {
         path: "successMessage",
         get blocks() {
@@ -297,6 +300,7 @@ const STYLES = `
 exports.FormComponent = FormComponent;
 exports.STYLES = STYLES;
 exports.default = FormComponent;
+exports.errorResponse = errorResponse;
 exports.mergeNewRootState = mergeNewRootState;
 exports.onSubmit = onSubmit;
 exports.submissionState = submissionState;

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

@@ -19,6 +19,9 @@ const mergeNewRootState = function mergeNewRootState2(props, state, formRef, new
 const submissionState = function submissionState2(props, state, formRef) {
   return isEditing() && props.previewState || state.formState;
 };
+const errorResponse = function errorResponse2(props, state, formRef, response) {
+  return JSON.stringify(response, null, 2);
+};
 const onSubmit = function onSubmit2(props, state, formRef, event) {
   var _a;
   const sendWithJsProp = props.sendWithJs || props.sendSubmissionsTo === "email";
@@ -244,7 +247,7 @@ const FormComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((p
       }, 3, "0n_2") : null,
       submissionState(props, state) === "error" && state.responseData ? /* @__PURE__ */ _jsxQ("pre", null, {
         class: "builder-form-error-text pre-FormComponent"
-      }, JSON.stringify(state.responseData, null, 2), 1, "0n_3") : null,
+      }, errorResponse(props, state, formRef, state.responseData), 1, "0n_3") : null,
       submissionState(props, state) === "success" ? /* @__PURE__ */ _jsxC(Blocks, {
         path: "successMessage",
         get blocks() {
@@ -296,6 +299,7 @@ export {
   FormComponent,
   STYLES,
   FormComponent as default,
+  errorResponse,
   mergeNewRootState,
   onSubmit,
   submissionState

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

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const fileTypes = require("../../constants/file-types.qwik.cjs");
 const componentInfo = {
-  // friendlyName?
   name: "Raw:Img",
   hideFromInsertMenu: true,
   image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
@@ -13,9 +12,58 @@ const componentInfo = {
       type: "file",
       allowedFileTypes: fileTypes.IMAGE_FILE_TYPES,
       required: true
+    },
+    {
+      name: "backgroundSize",
+      type: "text",
+      defaultValue: "cover",
+      enum: [
+        {
+          label: "contain",
+          value: "contain",
+          helperText: "The image should never get cropped"
+        },
+        {
+          label: "cover",
+          value: "cover",
+          helperText: "The image should fill it's box, cropping when needed"
+        }
+      ]
+    },
+    {
+      name: "backgroundPosition",
+      type: "text",
+      defaultValue: "center",
+      enum: [
+        "center",
+        "top",
+        "left",
+        "right",
+        "bottom",
+        "top left",
+        "top right",
+        "bottom left",
+        "bottom right"
+      ]
+    },
+    {
+      name: "altText",
+      type: "string",
+      helperText: "Text to display when the user has images off"
+    },
+    {
+      name: "title",
+      type: "string",
+      helperText: "Text to display when hovering over the asset"
+    },
+    {
+      name: "aspectRatio",
+      type: "number",
+      helperText: "This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",
+      advanced: true,
+      defaultValue: 0.7041
     }
   ],
-  noWrap: true,
-  static: true
+  noWrap: true
 };
 exports.componentInfo = componentInfo;

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

@@ -1,6 +1,5 @@
 import { IMAGE_FILE_TYPES } from "../../constants/file-types.qwik.mjs";
 const componentInfo = {
-  // friendlyName?
   name: "Raw:Img",
   hideFromInsertMenu: true,
   image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
@@ -11,10 +10,59 @@ const componentInfo = {
       type: "file",
       allowedFileTypes: IMAGE_FILE_TYPES,
       required: true
+    },
+    {
+      name: "backgroundSize",
+      type: "text",
+      defaultValue: "cover",
+      enum: [
+        {
+          label: "contain",
+          value: "contain",
+          helperText: "The image should never get cropped"
+        },
+        {
+          label: "cover",
+          value: "cover",
+          helperText: "The image should fill it's box, cropping when needed"
+        }
+      ]
+    },
+    {
+      name: "backgroundPosition",
+      type: "text",
+      defaultValue: "center",
+      enum: [
+        "center",
+        "top",
+        "left",
+        "right",
+        "bottom",
+        "top left",
+        "top right",
+        "bottom left",
+        "bottom right"
+      ]
+    },
+    {
+      name: "altText",
+      type: "string",
+      helperText: "Text to display when the user has images off"
+    },
+    {
+      name: "title",
+      type: "string",
+      helperText: "Text to display when hovering over the asset"
+    },
+    {
+      name: "aspectRatio",
+      type: "number",
+      helperText: "This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",
+      advanced: true,
+      defaultValue: 0.7041
     }
   ],
-  noWrap: true,
-  static: true
+  noWrap: true
 };
 export {
   componentInfo