@builder.io/sdk-react-native 0.0.1-6 → 0.0.1-62

package/src/blocks/form.js

@@ -1,229 +0,0 @@
-import { registerComponent } from '../functions/register-component';
-
-        var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-for (var prop in b || (b = {}))
-  if (__hasOwnProp.call(b, prop))
-    __defNormalProp(a, prop, b[prop]);
-if (__getOwnPropSymbols)
-  for (var prop of __getOwnPropSymbols(b)) {
-    if (__propIsEnum.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  }
-return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __async = (__this, __arguments, generator) => {
-return new Promise((resolve, reject) => {
-  var fulfilled = (value) => {
-    try {
-      step(generator.next(value));
-    } catch (e) {
-      reject(e);
-    }
-  };
-  var rejected = (value) => {
-    try {
-      step(generator.throw(value));
-    } catch (e) {
-      reject(e);
-    }
-  };
-  var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-  step((generator = generator.apply(__this, __arguments)).next());
-});
-};
-import * as React from "react";
-import { View, StyleSheet } from "react-native";
-import { useState, useRef } from "react";
-import { Builder, builder } from "@builder.io/sdk";
-import { BuilderBlocks } from "@dummy";
-import { set } from "@dummy";
-import { get } from "@dummy";
-function FormComponent(props) {
-var _a;
-const [state, setState] = useState(() => "unsubmitted");
-const [responseData, setResponseData] = useState(() => null);
-const [formErrorMessage, setFormErrorMessage] = useState(() => "");
-function submissionState() {
-  return Builder.isEditing && props.previewState || state;
-}
-function onSubmit(event) {
-  var _a2;
-  const sendWithJs = props.sendWithJs || props.sendSubmissionsTo === "email";
-  if (props.sendSubmissionsTo === "zapier") {
-    event.preventDefault();
-  } else if (sendWithJs) {
-    if (!(props.action || props.sendSubmissionsTo === "email")) {
-      event.preventDefault();
-      return;
-    }
-    event.preventDefault();
-    const el = event.currentTarget;
-    const headers = props.customHeaders || {};
-    let body;
-    const formData = new FormData(el);
-    const formPairs = Array.from(event.currentTarget.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
-      let value;
-      const key = el2.name;
-      if (el2 instanceof HTMLInputElement) {
-        if (el2.type === "radio") {
-          if (el2.checked) {
-            value = el2.name;
-            return {
-              key,
-              value
-            };
-          }
-        } else if (el2.type === "checkbox") {
-          value = el2.checked;
-        } else if (el2.type === "number" || el2.type === "range") {
-          const num = el2.valueAsNumber;
-          if (!isNaN(num)) {
-            value = num;
-          }
-        } else if (el2.type === "file") {
-          value = el2.files;
-        } else {
-          value = el2.value;
-        }
-      } else {
-        value = el2.value;
-      }
-      return {
-        key,
-        value
-      };
-    });
-    let contentType = props.contentType;
-    if (props.sendSubmissionsTo === "email") {
-      contentType = "multipart/form-data";
-    }
-    Array.from(formPairs).forEach(({ value }) => {
-      if (value instanceof File || Array.isArray(value) && value[0] instanceof File || value instanceof FileList) {
-        contentType = "multipart/form-data";
-      }
-    });
-    if (contentType !== "application/json") {
-      body = formData;
-    } else {
-      const json = {};
-      Array.from(formPairs).forEach(({ value, key }) => {
-        set(json, key, value);
-      });
-      body = JSON.stringify(json);
-    }
-    if (contentType && contentType !== "multipart/form-data") {
-      if (!(sendWithJs && ((_a2 = props.action) == null ? void 0 : _a2.includes("zapier.com")))) {
-        headers["content-type"] = contentType;
-      }
-    }
-    const presubmitEvent = new CustomEvent("presubmit", { detail: { body } });
-    if (formRef.current) {
-      formRef.current.dispatchEvent(presubmitEvent);
-      if (presubmitEvent.defaultPrevented) {
-        return;
-      }
-    }
-    setState("sending");
-    const formUrl = `${builder.env === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${builder.apiKey}&to=${btoa(props.sendSubmissionsToEmail || "")}&name=${encodeURIComponent(props.name || "")}`;
-    fetch(props.sendSubmissionsTo === "email" ? formUrl : props.action, { body, headers, method: props.method || "post" }).then((res) => __async(this, null, function* () {
-      let body2;
-      const contentType2 = res.headers.get("content-type");
-      if (contentType2 && contentType2.indexOf("application/json") !== -1) {
-        body2 = yield res.json();
-      } else {
-        body2 = yield res.text();
-      }
-      if (!res.ok && props.errorMessagePath) {
-        let message = get(body2, props.errorMessagePath);
-        if (message) {
-          if (typeof message !== "string") {
-            message = JSON.stringify(message);
-          }
-          setFormErrorMessage(message);
-        }
-      }
-      setResponseData(body2);
-      setState(res.ok ? "success" : "error");
-      if (res.ok) {
-        const submitSuccessEvent = new CustomEvent("submit:success", {
-          detail: { res, body: body2 }
-        });
-        if (formRef.current) {
-          formRef.current.dispatchEvent(submitSuccessEvent);
-          if (submitSuccessEvent.defaultPrevented) {
-            return;
-          }
-          if (props.resetFormOnSubmit !== false) {
-            formRef.current.reset();
-          }
-        }
-        if (props.successUrl) {
-          if (formRef.current) {
-            const event2 = new CustomEvent("route", {
-              detail: { url: props.successUrl }
-            });
-            formRef.current.dispatchEvent(event2);
-            if (!event2.defaultPrevented) {
-              location.href = props.successUrl;
-            }
-          } else {
-            location.href = props.successUrl;
-          }
-        }
-      }
-    }), (err) => {
-      const submitErrorEvent = new CustomEvent("submit:error", {
-        detail: { error: err }
-      });
-      if (formRef.current) {
-        formRef.current.dispatchEvent(submitErrorEvent);
-        if (submitErrorEvent.defaultPrevented) {
-          return;
-        }
-      }
-      setResponseData(err);
-      setState("error");
-    });
-  }
-}
-const formRef = useRef();
-return /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
-  validate: props.validate,
-  ref: formRef,
-  action: !props.sendWithJs && props.action,
-  method: props.method,
-  name: props.name,
-  onSubmit: (event) => onSubmit(event)
-}), " ", props.builderBlock && props.builderBlock.children && /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = props.builderBlock) == null ? void 0 : _a.children.map((block) => /* @__PURE__ */ React.createElement(BuilderBlockComponent, {
-  block
-}))), " ", submissionState() === "error" && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(BuilderBlocks, {
-  dataPath: "errorMessage",
-  blocks: props.errorMessage
-})), " ", submissionState() === "sending" && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(BuilderBlocks, {
-  dataPath: "sendingMessage",
-  blocks: props.sendingMessage
-})), " ", submissionState() === "error" && responseData && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, {
-  className: "builder-form-error-text",
-  style: styles.view1
-}, " ", JSON.stringify(responseData, null, 2), " ")), " ", submissionState() === "success" && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(BuilderBlocks, {
-  dataPath: "successMessage",
-  blocks: props.successMessage
-})), " ");
-}
-const styles = StyleSheet.create({
-view1: { padding: 10, color: "red", textAlign: "center" }
-});
-export {
-FormComponent as default
-};
-
-
-        registerComponent(FormComponent, {name:'Form:Form',defaults:{responsiveStyles:{large:{marginTop:'15px',paddingBottom:'15px'}}},image:'https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5',inputs:[{name:'sendSubmissionsTo',type:'string',enum:[{label:'Send to email',value:'email',helperText:'Send form submissions to the email address of your choosing'},{label:'Custom',value:'custom',helperText:'Handle where the form requests go manually with a little code, e.g. to your own custom backend'}],defaultValue:'email'},{name:'sendSubmissionsToEmail',type:'string',required:true,defaultValue:'your@email.com',showIf:'options.get("sendSubmissionsTo") === "email"'},{name:'sendWithJs',type:'boolean',helperText:'Set to false to use basic html form action',defaultValue:true,showIf:'options.get("sendSubmissionsTo") === "custom"'},{name:'name',type:'string',defaultValue:'My form'},{name:'action',type:'string',helperText:'URL to send the form data to',showIf:'options.get("sendSubmissionsTo") === "custom"'},{name:'contentType',type:'string',defaultValue:'application/json',advanced:true,enum:['application/json','multipart/form-data','application/x-www-form-urlencoded'],showIf:'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'},{name:'method',type:'string',showIf:'options.get("sendSubmissionsTo") === "custom"',defaultValue:'POST',advanced:true},{name:'previewState',type:'string',enum:['unsubmitted','sending','success','error'],defaultValue:'unsubmitted',helperText:'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',showIf:'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'},{name:'successUrl',type:'url',helperText:'Optional URL to redirect the user to on form submission success',showIf:'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'},{name:'resetFormOnSubmit',type:'boolean',showIf:"options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",advanced:true},{name:'successMessage',type:'uiBlocks',hideFromUI:true,defaultValue:[{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Text',options:{text:'<span>Thanks!</span>'}}}]},{name:'validate',type:'boolean',defaultValue:true,advanced:true},{name:'errorMessagePath',type:'text',advanced:true,helperText:'Path to where to get the error message from in a JSON response to display to the user, e.g. "error.message" for a response like { "error": { "message": "this username is taken" }}'},{name:'errorMessage',type:'uiBlocks',hideFromUI:true,defaultValue:[{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},bindings:{'component.options.text':'state.formErrorMessage || block.component.options.text'},component:{name:'Text',options:{text:'<span>Form submission error :( Please check your answers and try again</span>'}}}]},{name:'sendingMessage',type:'uiBlocks',hideFromUI:true,defaultValue:[{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Text',options:{text:'<span>Sending...</span>'}}}]},{name:'customHeaders',type:'map',valueType:{type:'string'},advanced:true,showIf:'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'}],noWrap:true,canHaveChildren:true,defaultChildren:[{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Text',options:{text:'<span>Enter your name</span>'}}},{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Form:Input',options:{name:'name',placeholder:'Jane Doe'}}},{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Text',options:{text:'<span>Enter your email</span>'}}},{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Form:Input',options:{name:'email',placeholder:'jane@doe.com'}}},{'@type':'@builder.io/sdk:Element',responsiveStyles:{large:{marginTop:'10px'}},component:{name:'Form:SubmitButton',options:{text:'Submit'}}}]});

package/src/blocks/form.lite.tsx

@@ -1,257 +0,0 @@
-import * as React from "react";
-import { View, StyleSheet, Image, Text } from "react-native";
-import { useState, useContext, useRef } from "react";
-import { BuilderBlockComponent as BuilderBlock } from "@dummy";
-import { Builder, builder } from "@builder.io/sdk";
-import { BuilderBlocks } from "@dummy";
-import { set } from "@dummy";
-import { get } from "@dummy";
-
-export default function FormComponent(props) {
-  const [state, setState] = useState(() => "unsubmitted");
-
-  const [responseData, setResponseData] = useState(() => null);
-
-  const [formErrorMessage, setFormErrorMessage] = useState(() => "");
-
-  function submissionState() {
-    return (Builder.isEditing && props.previewState) || state;
-  }
-
-  function onSubmit(event) {
-    const sendWithJs = props.sendWithJs || props.sendSubmissionsTo === "email";
-
-    if (props.sendSubmissionsTo === "zapier") {
-      event.preventDefault();
-    } else if (sendWithJs) {
-      if (!(props.action || props.sendSubmissionsTo === "email")) {
-        event.preventDefault();
-        return;
-      }
-
-      event.preventDefault();
-      const el = event.currentTarget;
-      const headers = props.customHeaders || {};
-      let body;
-      const formData = new FormData(el); // TODO: maybe support null
-
-      const formPairs = Array.from(
-        event.currentTarget.querySelectorAll("input,select,textarea")
-      )
-        .filter((el) => !!el.name)
-        .map((el) => {
-          let value;
-          const key = el.name;
-
-          if (el instanceof HTMLInputElement) {
-            if (el.type === "radio") {
-              if (el.checked) {
-                value = el.name;
-                return {
-                  key,
-                  value,
-                };
-              }
-            } else if (el.type === "checkbox") {
-              value = el.checked;
-            } else if (el.type === "number" || el.type === "range") {
-              const num = el.valueAsNumber;
-
-              if (!isNaN(num)) {
-                value = num;
-              }
-            } else if (el.type === "file") {
-              // TODO: one vs multiple files
-              value = el.files;
-            } else {
-              value = el.value;
-            }
-          } else {
-            value = el.value;
-          }
-
-          return {
-            key,
-            value,
-          };
-        });
-      let contentType = props.contentType;
-
-      if (props.sendSubmissionsTo === "email") {
-        contentType = "multipart/form-data";
-      }
-
-      Array.from(formPairs).forEach(({ value }) => {
-        if (
-          value instanceof File ||
-          (Array.isArray(value) && value[0] instanceof File) ||
-          value instanceof FileList
-        ) {
-          contentType = "multipart/form-data";
-        }
-      }); // TODO: send as urlEncoded or multipart by default
-      // because of ease of use and reliability in browser API
-      // for encoding the form?
-
-      if (contentType !== "application/json") {
-        body = formData;
-      } else {
-        // Json
-        const json = {};
-        Array.from(formPairs).forEach(({ value, key }) => {
-          set(json, key, value);
-        });
-        body = JSON.stringify(json);
-      }
-
-      if (contentType && contentType !== "multipart/form-data") {
-        if (
-          /* Zapier doesn't allow content-type header to be sent from browsers */ !(
-            sendWithJs && props.action?.includes("zapier.com")
-          )
-        ) {
-          headers["content-type"] = contentType;
-        }
-      }
-      const presubmitEvent = new CustomEvent("presubmit", { detail: { body } });
-      if (formRef.current) {
-        formRef.current.dispatchEvent(presubmitEvent);
-        if (presubmitEvent.defaultPrevented) {
-          return;
-        }
-      }
-      setState("sending");
-      const formUrl = `${
-        builder.env === "dev" ? "http://localhost:5000" : "https://builder.io"
-      }/api/v1/form-submit?apiKey=${builder.apiKey}&to=${btoa(
-        props.sendSubmissionsToEmail || ""
-      )}&name=${encodeURIComponent(props.name || "")}`;
-      fetch(
-        props.sendSubmissionsTo === "email"
-          ? formUrl
-          : props.action /* TODO: throw error if no action URL */,
-        { body, headers, method: props.method || "post" }
-      ).then(
-        async (res) => {
-          let body;
-          const contentType = res.headers.get("content-type");
-          if (contentType && contentType.indexOf("application/json") !== -1) {
-            body = await res.json();
-          } else {
-            body = await res.text();
-          }
-          if (!res.ok && props.errorMessagePath) {
-            /* TODO: allow supplying an error formatter function */ let message =
-              get(body, props.errorMessagePath);
-            if (message) {
-              if (typeof message !== "string") {
-                /* TODO: ideally convert json to yaml so it woul dbe like             error: - email has been taken */ message =
-                  JSON.stringify(message);
-              }
-              setFormErrorMessage(message);
-            }
-          }
-          setResponseData(body);
-          setState(res.ok ? "success" : "error");
-          if (res.ok) {
-            const submitSuccessEvent = new CustomEvent("submit:success", {
-              detail: { res, body },
-            });
-            if (formRef.current) {
-              formRef.current.dispatchEvent(submitSuccessEvent);
-              if (submitSuccessEvent.defaultPrevented) {
-                return;
-              }
-              /* TODO: option to turn this on/off? */ if (
-                props.resetFormOnSubmit !== false
-              ) {
-                formRef.current.reset();
-              }
-            }
-            /* TODO: client side route event first that can be preventDefaulted */ if (
-              props.successUrl
-            ) {
-              if (formRef.current) {
-                const event = new CustomEvent("route", {
-                  detail: { url: props.successUrl },
-                });
-                formRef.current.dispatchEvent(event);
-                if (!event.defaultPrevented) {
-                  location.href = props.successUrl;
-                }
-              } else {
-                location.href = props.successUrl;
-              }
-            }
-          }
-        },
-        (err) => {
-          const submitErrorEvent = new CustomEvent("submit:error", {
-            detail: { error: err },
-          });
-          if (formRef.current) {
-            formRef.current.dispatchEvent(submitErrorEvent);
-            if (submitErrorEvent.defaultPrevented) {
-              return;
-            }
-          }
-          setResponseData(err);
-          setState("error");
-        }
-      );
-    }
-  }
-  const formRef = useRef();
-  return (
-    <View
-      {...props.attributes}
-      validate={props.validate}
-      ref={formRef}
-      action={!props.sendWithJs && props.action}
-      method={props.method}
-      name={props.name}
-      onSubmit={(event) => onSubmit(event)}
-    >
-      {" "}
-      {props.builderBlock && props.builderBlock.children && (
-        <>
-          {props.builderBlock?.children.map((block) => (
-            <BuilderBlockComponent block={block} />
-          ))}
-        </>
-      )}{" "}
-      {submissionState() === "error" && (
-        <>
-          <BuilderBlocks dataPath="errorMessage" blocks={props.errorMessage} />
-        </>
-      )}{" "}
-      {submissionState() === "sending" && (
-        <>
-          <BuilderBlocks
-            dataPath="sendingMessage"
-            blocks={props.sendingMessage}
-          />
-        </>
-      )}{" "}
-      {submissionState() === "error" && responseData && (
-        <>
-          <View className="builder-form-error-text" style={styles.view1}>
-            {" "}
-            {JSON.stringify(responseData, null, 2)}{" "}
-          </View>
-        </>
-      )}{" "}
-      {submissionState() === "success" && (
-        <>
-          <BuilderBlocks
-            dataPath="successMessage"
-            blocks={props.successMessage}
-          />
-        </>
-      )}{" "}
-    </View>
-  );
-}
-const styles = StyleSheet.create({
-  view1: { padding: 10, color: "red", textAlign: "center" },
-});

package/src/blocks/image.js

@@ -1,123 +0,0 @@
-import * as React from 'react';
-import { Image as ReactImage, View } from "react-native";
-import { registerComponent } from "../functions/register-component";
-function Image(props) {
-  return /* @__PURE__ */ React.createElement(View, {
-    style: { position: "relative" }
-  }, /* @__PURE__ */ React.createElement(ReactImage, {
-    resizeMode: props.backgroundSize || "contain",
-    style: { position: "absolute", top: 0, bottom: 0, left: 0, right: 0 },
-    source: { uri: props.image }
-  }), /* @__PURE__ */ React.createElement("div", {
-    className: "builder-image-sizer",
-    style: {
-      width: "100%",
-      paddingTop: props.aspectRatio * 100 + "%",
-      pointerEvents: "none",
-      fontSize: 0
-    }
-  }, " "));
-}
-registerComponent(Image, {
-  name: "Image",
-  static: 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",
-  defaultStyles: {
-    position: "relative",
-    minHeight: "20px",
-    minWidth: "20px",
-    overflow: "hidden"
-  },
-  canHaveChildren: true,
-  inputs: [
-    {
-      name: "image",
-      type: "file",
-      bubble: true,
-      allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
-      required: true,
-      defaultValue: "https://cdn.builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
-      onChange: "        const DEFAULT_ASPECT_RATIO = 0.7041;        options.delete('srcset');        options.delete('noWebp');        function loadImage(url, timeout) {          return new Promise((resolve, reject) => {            const img = document.createElement('img');            let loaded = false;            img.onload = () => {              loaded = true;              resolve(img);            };            img.addEventListener('error', event => {              console.warn('Image load failed', event.error);              reject(event.error);            });            img.src = url;            setTimeout(() => {              if (!loaded) {                reject(new Error('Image load timed out'));              }            }, timeout);          });        }        function round(num) {          return Math.round(num * 1000) / 1000;        }        const value = options.get('image');        const aspectRatio = options.get('aspectRatio');        // For SVG images - don't render as webp, keep them as SVG        fetch(value)          .then(res => res.blob())          .then(blob => {            if (blob.type.includes('svg')) {              options.set('noWebp', true);            }          });        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)            ) {              if (img.width && img.height) {                options.set('aspectRatio', round(img.height / img.width));                options.set('height', img.height);                options.set('width', img.width);              }            }          });        }"
-    },
-    {
-      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: "height",
-      type: "number",
-      hideFromUI: true
-    },
-    {
-      name: "width",
-      type: "number",
-      hideFromUI: true
-    },
-    {
-      name: "sizes",
-      type: "string",
-      hideFromUI: true
-    },
-    {
-      name: "srcset",
-      type: "string",
-      hideFromUI: true
-    },
-    {
-      name: "lazy",
-      type: "boolean",
-      defaultValue: true,
-      hideFromUI: true
-    },
-    {
-      name: "fitContent",
-      type: "boolean",
-      helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
-      defaultValue: true
-    },
-    {
-      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
-    }
-  ]
-});
-export {
-  Image as default
-};

package/src/blocks/image.lite.tsx

@@ -1,35 +0,0 @@
-import * as React from "react";
-import { View, StyleSheet, Image, Text } from "react-native";
-import { useContext } from "react";
-
-export default function Image(props) {
-  return (
-    <>
-      <View>
-        <View
-          loading="lazy"
-          alt={props.altText}
-          aria-role={props.altText ? "presentation" : undefined}
-          className={"builder-image" + (props.class ? " " + props.class : "")}
-          src={props.image}
-          srcset={props.srcset}
-          sizes={props.sizes}
-          style={styles.view1}
-        />
-
-        <View srcSet={props.srcset} />
-      </View>
-
-      {props.children}
-    </>
-  );
-}
-
-const styles = StyleSheet.create({
-  view1: {
-    opacity: 1,
-    transition: "opacity 0.2s ease-in-out",
-    objectFit: "cover",
-    objectPosition: "center",
-  },
-});