@tamagui/image 1.101.0 → 1.101.1

package/dist/cjs/Image.js

@@ -17,7 +17,7 @@ __export(Image_exports, {
   Image: () => Image
 });
 module.exports = __toCommonJS(Image_exports);
-var import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_react_native = require("react-native-web"), import_jsx_runtime = require("react/jsx-runtime");
+var import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_react = require("react"), import_react_native = require("react-native-web"), import_jsx_runtime = require("react/jsx-runtime");
 const StyledImage = (0, import_core.styled)(import_react_native.Image, {
   name: "Image"
 });
@@ -27,8 +27,24 @@ const Image = StyledImage.styleable((inProps, ref) => {
   process.env.NODE_ENV === "development" && typeof src == "string" && (typeof props.width == "string" && props.width[0] !== "$" || typeof props.height == "string" && props.height[0] !== "$") && (hasWarned || (hasWarned = !0, console.warn(
     'React Native expects a numerical width/height. If you want to use a percent you must define the "source" prop with width, height, and uri.'
   )));
-  let finalSource = typeof src == "string" ? { uri: src, ...import_constants.isWeb && { width: props.width, height: props.height } } : source ?? src;
-  return finalSource && typeof finalSource == "object" && finalSource.default && (finalSource = finalSource.default), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledImage, { ref, source: finalSource, style, ...rest });
+  let finalSource = typeof src == "string" ? {
+    uri: src,
+    ...import_constants.isWeb && {
+      width: props.width || style?.width,
+      height: props.height || style?.height
+    }
+  } : source ?? src;
+  return finalSource && typeof finalSource == "object" && (process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && (0, import_react.useEffect)(() => {
+    async function run() {
+      if (typeof src == "string")
+        try {
+          await fetch(src).then((res) => res.text());
+        } catch {
+          console.error(`Error loading image: ${src}`, { props });
+        }
+    }
+    run();
+  }, [src]), finalSource.default && (finalSource = finalSource.default)), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.Image, { ref, source: finalSource, style, ...rest });
 });
 Image.getSize = import_react_native.Image.getSize;
 Image.getSizeWithHeaders = import_react_native.Image.getSizeWithHeaders;

package/dist/cjs/Image.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Image.tsx"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAsB,+BAQtB,cAAyC,0BAEzC,sBAAiC,yBAyFxB;AAvFT,MAAM,kBAAc,oBAAO,oBAAAA,OAAS;AAAA,EAClC,MAAM;AACR,CAAC;AAmCD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY,UAAsB,CAAC,SAAS,QAAQ;AACvE,QAAM,CAAC,OAAO,KAAK,QAAI,8BAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,EAAI,QAAQ,IAAI,aAAa,iBACvB,OAAO,OAAQ,aAEd,OAAO,MAAM,SAAU,YAAY,MAAM,MAAM,CAAC,MAAM,OACtD,OAAO,MAAM,UAAW,YAAY,MAAM,OAAO,CAAC,MAAM,SAEpD,cACH,YAAY,IACZ,QAAQ;AAAA,IACN;AAAA,EACF;AAMR,MAAI,cACF,OAAO,OAAQ,WACX,EAAE,KAAK,KAAK,GAAI,0BAAS,EAAE,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,EAAG,IACvE,UAAU;AAEhB,SAAI,eAAe,OAAO,eAAgB,YAiBpC,YAAY,YACd,cAAc,YAAY,UAKvB,4CAAC,eAAY,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AACtF,CAAC;AAED,MAAM,UAAU,oBAAAA,MAAQ;AACxB,MAAM,qBAAqB,oBAAAA,MAAQ;AACnC,MAAM,WAAW,oBAAAA,MAAQ;AACzB,MAAM,uBAAuB,oBAAAA,MAAQ;AACrC,MAAM,gBAAgB,oBAAAA,MAAQ;AAC9B,MAAM,aAAa,oBAAAA,MAAQ;",
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAsB,+BAQtB,cAAyC,0BACzC,eAAmC,kBACnC,sBAAiC,yBAgHxB;AA9GT,MAAM,kBAAc,oBAAO,oBAAAA,OAAS;AAAA,EAClC,MAAM;AACR,CAAC;AAmCD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY,UAAsB,CAAC,SAAS,QAAQ;AACvE,QAAM,CAAC,OAAO,KAAK,QAAI,8BAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,EAAI,QAAQ,IAAI,aAAa,iBACvB,OAAO,OAAQ,aAEd,OAAO,MAAM,SAAU,YAAY,MAAM,MAAM,CAAC,MAAM,OACtD,OAAO,MAAM,UAAW,YAAY,MAAM,OAAO,CAAC,MAAM,SAEpD,cACH,YAAY,IACZ,QAAQ;AAAA,IACN;AAAA,EACF;AAMR,MAAI,cACF,OAAO,OAAQ,WACX;AAAA,IACE,KAAK;AAAA,IACL,GAAI,0BAAS;AAAA,MACX,OAAO,MAAM,SAAS,OAAO;AAAA,MAC7B,QAAQ,MAAM,UAAU,OAAO;AAAA,IACjC;AAAA,EACF,IACA,UAAU;AAEhB,SAAI,eAAe,OAAO,eAAgB,aAgBpC,QAAQ,IAAI,aAAa,iBAAiB,QAAQ,IAAI,iCAExD,wBAAU,MAAM;AACd,mBAAe,MAAM;AACnB,UAAI,OAAO,OAAQ;AACjB,YAAI;AACF,gBAAM,MAAM,GAAG,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;AAAA,QAC3C,QAAc;AACZ,kBAAQ,MAAM,wBAAwB,GAAG,IAAI,EAAE,MAAM,CAAC;AAAA,QACxD;AAAA,IAEJ;AAEA,QAAI;AAAA,EACN,GAAG,CAAC,GAAG,CAAC,GAIN,YAAY,YACd,cAAc,YAAY,WAKvB,4CAAC,oBAAAA,OAAA,EAAQ,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AAClF,CAAC;AAED,MAAM,UAAU,oBAAAA,MAAQ;AACxB,MAAM,qBAAqB,oBAAAA,MAAQ;AACnC,MAAM,WAAW,oBAAAA,MAAQ;AACzB,MAAM,uBAAuB,oBAAAA,MAAQ;AACrC,MAAM,gBAAgB,oBAAAA,MAAQ;AAC9B,MAAM,aAAa,oBAAAA,MAAQ;",
   "names": ["RNImage"]
 }

package/dist/cjs/Image.native.js

@@ -18,7 +18,7 @@ __export(Image_exports, {
   Image: () => Image
 });
 module.exports = __toCommonJS(Image_exports);
-var import_jsx_runtime = require("react/jsx-runtime"), import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_react_native = require("react-native");
+var import_jsx_runtime = require("react/jsx-runtime"), import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_react = require("react"), import_react_native = require("react-native");
 function _array_like_to_array(arr, len) {
   (len == null || len > arr.length) && (len = arr.length);
   for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
@@ -27,6 +27,30 @@ function _array_like_to_array(arr, len) {
 function _array_with_holes(arr) {
   if (Array.isArray(arr)) return arr;
 }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+  try {
+    var info = gen[key](arg), value = info.value;
+  } catch (error) {
+    reject(error);
+    return;
+  }
+  info.done ? resolve(value) : Promise.resolve(value).then(_next, _throw);
+}
+function _async_to_generator(fn) {
+  return function() {
+    var self = this, args = arguments;
+    return new Promise(function(resolve, reject) {
+      var gen = fn.apply(self, args);
+      function _next(value) {
+        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+      }
+      function _throw(err) {
+        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+      }
+      _next(void 0);
+    });
+  };
+}
 function _define_property(obj, key, value) {
   return key in obj ? Object.defineProperty(obj, key, {
     value,
@@ -96,6 +120,92 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
   }
 }
+function _ts_generator(thisArg, body) {
+  var f, y, t, g, _ = {
+    label: 0,
+    sent: function() {
+      if (t[0] & 1) throw t[1];
+      return t[1];
+    },
+    trys: [],
+    ops: []
+  };
+  return g = {
+    next: verb(0),
+    throw: verb(1),
+    return: verb(2)
+  }, typeof Symbol == "function" && (g[Symbol.iterator] = function() {
+    return this;
+  }), g;
+  function verb(n) {
+    return function(v) {
+      return step([
+        n,
+        v
+      ]);
+    };
+  }
+  function step(op) {
+    if (f) throw new TypeError("Generator is already executing.");
+    for (; _; ) try {
+      if (f = 1, y && (t = op[0] & 2 ? y.return : op[0] ? y.throw || ((t = y.return) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+      switch (y = 0, t && (op = [
+        op[0] & 2,
+        t.value
+      ]), op[0]) {
+        case 0:
+        case 1:
+          t = op;
+          break;
+        case 4:
+          return _.label++, {
+            value: op[1],
+            done: !1
+          };
+        case 5:
+          _.label++, y = op[1], op = [
+            0
+          ];
+          continue;
+        case 7:
+          op = _.ops.pop(), _.trys.pop();
+          continue;
+        default:
+          if (t = _.trys, !(t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+            _ = 0;
+            continue;
+          }
+          if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+            _.label = op[1];
+            break;
+          }
+          if (op[0] === 6 && _.label < t[1]) {
+            _.label = t[1], t = op;
+            break;
+          }
+          if (t && _.label < t[2]) {
+            _.label = t[2], _.ops.push(op);
+            break;
+          }
+          t[2] && _.ops.pop(), _.trys.pop();
+          continue;
+      }
+      op = body.call(thisArg, _);
+    } catch (e) {
+      op = [
+        6,
+        e
+      ], y = 0;
+    } finally {
+      f = t = 0;
+    }
+    if (op[0] & 5) throw op[1];
+    return {
+      value: op[0] ? op[1] : void 0,
+      done: !0
+    };
+  }
+}
 var StyledImage = (0, import_core.styled)(import_react_native.Image, {
   name: "Image"
 }), hasWarned = !1, Image = StyledImage.styleable(function(inProps, ref) {
@@ -107,8 +217,8 @@ var StyledImage = (0, import_core.styled)(import_react_native.Image, {
   var finalSource = typeof src == "string" ? _object_spread({
     uri: src
   }, import_constants.isWeb && {
-    width: props.width,
-    height: props.height
+    width: props.width || (style == null ? void 0 : style.width),
+    height: props.height || (style == null ? void 0 : style.height)
   }) : source ?? src;
   if (finalSource && typeof finalSource == "object") {
     if (!Array.isArray(finalSource) && typeof finalSource.uri == "number" && (finalSource = finalSource.uri, source && typeof source == "object" && !Array.isArray(source))) {
@@ -117,9 +227,59 @@ var StyledImage = (0, import_core.styled)(import_react_native.Image, {
       var _height;
       (_height = (_style1 = style).height) !== null && _height !== void 0 || (_style1.height = source.height);
     }
-    finalSource.default && (finalSource = finalSource.default);
+    process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && (0, import_react.useEffect)(function() {
+      var run = function() {
+        return _run.apply(this, arguments);
+      };
+      function _run() {
+        return _run = _async_to_generator(function() {
+          var err;
+          return _ts_generator(this, function(_state) {
+            switch (_state.label) {
+              case 0:
+                if (typeof src != "string") return [
+                  3,
+                  4
+                ];
+                _state.label = 1;
+              case 1:
+                return _state.trys.push([
+                  1,
+                  3,
+                  ,
+                  4
+                ]), [
+                  4,
+                  fetch(src).then(function(res) {
+                    return res.text();
+                  })
+                ];
+              case 2:
+                return _state.sent(), [
+                  3,
+                  4
+                ];
+              case 3:
+                return err = _state.sent(), console.error("Error loading image: ".concat(src), {
+                  props
+                }), [
+                  3,
+                  4
+                ];
+              case 4:
+                return [
+                  2
+                ];
+            }
+          });
+        }), _run.apply(this, arguments);
+      }
+      run();
+    }, [
+      src
+    ]), finalSource.default && (finalSource = finalSource.default);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledImage, _object_spread({
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.Image, _object_spread({
     ref,
     source: finalSource,
     style

package/dist/cjs/Image.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/packages/image/src/Image.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;uDAAA,mBAAsB,+BAQtB,cAAyC,0BAEzC,sBAAiC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMA,kBAAcC,oBAAOC,oBAAAA,OAAS;EAClCC,MAAM;AACR,CAAA,GAmCIC,YAAY,IAEHC,QAAQL,YAAYM,UAAsB,SAACC,SAASC,KAAAA;AAC/D,MAAuBC,oBAAAA,qBAAAA,8BAAiBF,OAAAA,GAAAA,CAAAA,GAAjCG,QAAgBD,kBAAAA,CAAAA,GAATE,QAASF,kBAAAA,CAAAA,GACfG,MAAyBF,MAAzBE,KAAKC,SAAoBH,MAApBG,QAAWC,OAAAA,2BAASJ,OAAAA;IAAzBE;IAAKC;;AAEb,EAAIE,QAAQC,IAAIC,aAAa,iBACvB,OAAOL,OAAQ,aAEd,OAAOF,MAAMQ,SAAU,YAAYR,MAAMQ,MAAM,CAAA,MAAO,OACtD,OAAOR,MAAMS,UAAW,YAAYT,MAAMS,OAAO,CAAA,MAAO,SAEpDf,cACHA,YAAY,IACZgB,QAAQC,KACL,4IAAA;AAOX,MAAIC,cACF,OAAOV,OAAQ,WACX,eAAA;IAAEW,KAAKX;KAASY,0BAAS;IAAEN,OAAOR,MAAMQ;IAAOC,QAAQT,MAAMS;EAAO,CAAA,IACpEN,UAAUD;AAEhB,MAAIU,eAAe,OAAOA,eAAgB,UAAU;AAGhD,QAAI,CAACG,MAAMC,QAAQJ,WAAAA,KACb,OAAOA,YAAYC,OAAQ,aAC7BD,cAAcA,YAAYC,KACtBV,UAAU,OAAOA,UAAW,YAAY,CAACY,MAAMC,QAAQb,MAAAA,IAAS;UAElEF,QAEAA;AAFAA,OAAAA,UAAAA,SAAAA,OAAMO,WAAAA,QAAAA,WAAAA,WAANP,OAAMO,QAAUL,OAAOK;;AAEvBP,OAAAA,WAAAA,UAAAA,OAAMQ,YAAAA,QAAAA,YAAAA,WAANR,QAAMQ,SAAWN,OAAOM;IAC1B;AAMN,IAAIG,YAAY,YACdA,cAAcA,YAAY;EAE9B;AAGA,SAAO,uCAAAK,KAAC3B,aAAAA,eAAAA;IAAYQ;IAAUK,QAAQS;IAAaX;KAAmBG,IAAAA,CAAAA;AACxE,CAAA;AAEAT,MAAMuB,UAAU1B,oBAAAA,MAAQ0B;AACxBvB,MAAMwB,qBAAqB3B,oBAAAA,MAAQ2B;AACnCxB,MAAMyB,WAAW5B,oBAAAA,MAAQ4B;AACzBzB,MAAM0B,uBAAuB7B,oBAAAA,MAAQ6B;AACrC1B,MAAM2B,gBAAgB9B,oBAAAA,MAAQ8B;AAC9B3B,MAAM4B,aAAa/B,oBAAAA,MAAQ+B;",
-  "names": ["StyledImage", "styled", "RNImage", "name", "hasWarned", "Image", "styleable", "inProps", "ref", "usePropsAndStyle", "props", "style", "src", "source", "rest", "process", "env", "NODE_ENV", "width", "height", "console", "warn", "finalSource", "uri", "isWeb", "Array", "isArray", "_jsx", "getSize", "getSizeWithHeaders", "prefetch", "prefetchWithMetadata", "abortPrefetch", "queryCache"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;uDAAA,mBAAsB,+BAQtB,cAAyC,0BACzC,eAAmC,kBACnC,sBAAiC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMA,kBAAcC,oBAAOC,oBAAAA,OAAS;EAClCC,MAAM;AACR,CAAA,GAmCIC,YAAY,IAEHC,QAAQL,YAAYM,UAAsB,SAACC,SAASC,KAAAA;AAC/D,MAAuBC,oBAAAA,qBAAAA,8BAAiBF,OAAAA,GAAAA,CAAAA,GAAjCG,QAAgBD,kBAAAA,CAAAA,GAATE,QAASF,kBAAAA,CAAAA,GACfG,MAAyBF,MAAzBE,KAAKC,SAAoBH,MAApBG,QAAWC,OAAAA,2BAASJ,OAAAA;IAAzBE;IAAKC;;AAEb,EAAIE,QAAQC,IAAIC,aAAa,iBACvB,OAAOL,OAAQ,aAEd,OAAOF,MAAMQ,SAAU,YAAYR,MAAMQ,MAAM,CAAA,MAAO,OACtD,OAAOR,MAAMS,UAAW,YAAYT,MAAMS,OAAO,CAAA,MAAO,SAEpDf,cACHA,YAAY,IACZgB,QAAQC,KACL,4IAAA;AAOX,MAAIC,cACF,OAAOV,OAAQ,WACX,eAAA;IACEW,KAAKX;KACDY,0BAAS;IACXN,OAAOR,MAAMQ,UAASP,SAAAA,OAAAA,SAAAA,MAAOO;IAC7BC,QAAQT,MAAMS,WAAUR,SAAAA,OAAAA,SAAAA,MAAOQ;EACjC,CAAA,IAEFN,UAAUD;AAEhB,MAAIU,eAAe,OAAOA,eAAgB,UAAU;AAGhD,QAAI,CAACG,MAAMC,QAAQJ,WAAAA,KACb,OAAOA,YAAYC,OAAQ,aAC7BD,cAAcA,YAAYC,KACtBV,UAAU,OAAOA,UAAW,YAAY,CAACY,MAAMC,QAAQb,MAAAA,IAAS;UAElEF,QAEAA;AAFAA,OAAAA,UAAAA,SAAAA,OAAMO,WAAAA,QAAAA,WAAAA,WAANP,OAAMO,QAAUL,OAAOK;;AAEvBP,OAAAA,WAAAA,UAAAA,OAAMQ,YAAAA,QAAAA,YAAAA,WAANR,QAAMQ,SAAWN,OAAOM;IAC1B;AAKN,IAAIJ,QAAQC,IAAIC,aAAa,iBAAiBF,QAAQC,IAAIW,iCAExDC,wBAAU,WAAA;UACOC,MAAAA,WAAAA;eAAAA,KAAAA,MAAAA,MAAAA,SAAAA;;eAAAA,OAAAA;AAAAA,sBAAf,oBAAA,WAAA;cAIaC;;;;oBAHP,OAAOlB,OAAQ,SAAf,QAAA;;;;;;;;;;;oBAEA;;kBAAMmB,MAAMnB,GAAAA,EAAKoB,KAAK,SAACC,KAAAA;2BAAQA,IAAIC,KAAI;;;;AAAvC,8BAAA,KAAA;;;;;AACOJ,6BAAAA,OAAAA,KAAAA,GACPV,QAAQe,MAAO,wBAA2B,OAAJvB,GAAAA,GAAO;kBAAEF;gBAAM,CAAA;;;;;;;;;;QAG3D,CAAA,GARemB,KAAAA,MAAAA,MAAAA,SAAAA;;AAUfA,UAAAA;IACF,GAAG;MAACjB;KAAI,GAINU,YAAY,YACdA,cAAcA,YAAY;EAE9B;AAGA,SAAO,uCAAAc,KAAClC,oBAAAA,OAAAA,eAAAA;IAAQM;IAAUK,QAAQS;IAAaX;KAAmBG,IAAAA,CAAAA;AACpE,CAAA;AAEAT,MAAMgC,UAAUnC,oBAAAA,MAAQmC;AACxBhC,MAAMiC,qBAAqBpC,oBAAAA,MAAQoC;AACnCjC,MAAMkC,WAAWrC,oBAAAA,MAAQqC;AACzBlC,MAAMmC,uBAAuBtC,oBAAAA,MAAQsC;AACrCnC,MAAMoC,gBAAgBvC,oBAAAA,MAAQuC;AAC9BpC,MAAMqC,aAAaxC,oBAAAA,MAAQwC;",
+  "names": ["StyledImage", "styled", "RNImage", "name", "hasWarned", "Image", "styleable", "inProps", "ref", "usePropsAndStyle", "props", "style", "src", "source", "rest", "process", "env", "NODE_ENV", "width", "height", "console", "warn", "finalSource", "uri", "isWeb", "Array", "isArray", "TAMAGUI_IMAGE_CHECK_ERROR", "useEffect", "run", "err", "fetch", "then", "res", "text", "error", "_jsx", "getSize", "getSizeWithHeaders", "prefetch", "prefetchWithMetadata", "abortPrefetch", "queryCache"]
 }

package/dist/esm/Image.js

@@ -1,5 +1,6 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
+import { useEffect } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
@@ -11,8 +12,24 @@ const Image = StyledImage.styleable((inProps, ref) => {
   process.env.NODE_ENV === "development" && typeof src == "string" && (typeof props.width == "string" && props.width[0] !== "$" || typeof props.height == "string" && props.height[0] !== "$") && (hasWarned || (hasWarned = !0, console.warn(
     'React Native expects a numerical width/height. If you want to use a percent you must define the "source" prop with width, height, and uri.'
   )));
-  let finalSource = typeof src == "string" ? { uri: src, ...isWeb && { width: props.width, height: props.height } } : source ?? src;
-  return finalSource && typeof finalSource == "object" && finalSource.default && (finalSource = finalSource.default), /* @__PURE__ */ jsx(StyledImage, { ref, source: finalSource, style, ...rest });
+  let finalSource = typeof src == "string" ? {
+    uri: src,
+    ...isWeb && {
+      width: props.width || style?.width,
+      height: props.height || style?.height
+    }
+  } : source ?? src;
+  return finalSource && typeof finalSource == "object" && (process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && useEffect(() => {
+    async function run() {
+      if (typeof src == "string")
+        try {
+          await fetch(src).then((res) => res.text());
+        } catch {
+          console.error(`Error loading image: ${src}`, { props });
+        }
+    }
+    run();
+  }, [src]), finalSource.default && (finalSource = finalSource.default)), /* @__PURE__ */ jsx(RNImage, { ref, source: finalSource, style, ...rest });
 });
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;

package/dist/esm/Image.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Image.tsx"],
-  "mappings": "AAAA,SAAS,aAAa;AAQtB,SAAS,QAAQ,wBAAwB;AAEzC,SAAS,SAAS,eAAe;AAyFxB;AAvFT,MAAM,cAAc,OAAO,SAAS;AAAA,EAClC,MAAM;AACR,CAAC;AAmCD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY,UAAsB,CAAC,SAAS,QAAQ;AACvE,QAAM,CAAC,OAAO,KAAK,IAAI,iBAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,EAAI,QAAQ,IAAI,aAAa,iBACvB,OAAO,OAAQ,aAEd,OAAO,MAAM,SAAU,YAAY,MAAM,MAAM,CAAC,MAAM,OACtD,OAAO,MAAM,UAAW,YAAY,MAAM,OAAO,CAAC,MAAM,SAEpD,cACH,YAAY,IACZ,QAAQ;AAAA,IACN;AAAA,EACF;AAMR,MAAI,cACF,OAAO,OAAQ,WACX,EAAE,KAAK,KAAK,GAAI,SAAS,EAAE,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,EAAG,IACvE,UAAU;AAEhB,SAAI,eAAe,OAAO,eAAgB,YAiBpC,YAAY,YACd,cAAc,YAAY,UAKvB,oBAAC,eAAY,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AACtF,CAAC;AAED,MAAM,UAAU,QAAQ;AACxB,MAAM,qBAAqB,QAAQ;AACnC,MAAM,WAAW,QAAQ;AACzB,MAAM,uBAAuB,QAAQ;AACrC,MAAM,gBAAgB,QAAQ;AAC9B,MAAM,aAAa,QAAQ;",
+  "mappings": "AAAA,SAAS,aAAa;AAQtB,SAAS,QAAQ,wBAAwB;AACzC,SAAS,iBAA0B;AACnC,SAAS,SAAS,eAAe;AAgHxB;AA9GT,MAAM,cAAc,OAAO,SAAS;AAAA,EAClC,MAAM;AACR,CAAC;AAmCD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY,UAAsB,CAAC,SAAS,QAAQ;AACvE,QAAM,CAAC,OAAO,KAAK,IAAI,iBAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,EAAI,QAAQ,IAAI,aAAa,iBACvB,OAAO,OAAQ,aAEd,OAAO,MAAM,SAAU,YAAY,MAAM,MAAM,CAAC,MAAM,OACtD,OAAO,MAAM,UAAW,YAAY,MAAM,OAAO,CAAC,MAAM,SAEpD,cACH,YAAY,IACZ,QAAQ;AAAA,IACN;AAAA,EACF;AAMR,MAAI,cACF,OAAO,OAAQ,WACX;AAAA,IACE,KAAK;AAAA,IACL,GAAI,SAAS;AAAA,MACX,OAAO,MAAM,SAAS,OAAO;AAAA,MAC7B,QAAQ,MAAM,UAAU,OAAO;AAAA,IACjC;AAAA,EACF,IACA,UAAU;AAEhB,SAAI,eAAe,OAAO,eAAgB,aAgBpC,QAAQ,IAAI,aAAa,iBAAiB,QAAQ,IAAI,6BAExD,UAAU,MAAM;AACd,mBAAe,MAAM;AACnB,UAAI,OAAO,OAAQ;AACjB,YAAI;AACF,gBAAM,MAAM,GAAG,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;AAAA,QAC3C,QAAc;AACZ,kBAAQ,MAAM,wBAAwB,GAAG,IAAI,EAAE,MAAM,CAAC;AAAA,QACxD;AAAA,IAEJ;AAEA,QAAI;AAAA,EACN,GAAG,CAAC,GAAG,CAAC,GAIN,YAAY,YACd,cAAc,YAAY,WAKvB,oBAAC,WAAQ,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AAClF,CAAC;AAED,MAAM,UAAU,QAAQ;AACxB,MAAM,qBAAqB,QAAQ;AACnC,MAAM,WAAW,QAAQ;AACzB,MAAM,uBAAuB,QAAQ;AACrC,MAAM,gBAAgB,QAAQ;AAC9B,MAAM,aAAa,QAAQ;",
   "names": []
 }

package/dist/esm/Image.mjs

@@ -1,5 +1,6 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
+import { useEffect } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
@@ -17,11 +18,22 @@ const Image = StyledImage.styleable((inProps, ref) => {
   let finalSource = typeof src == "string" ? {
     uri: src,
     ...(isWeb && {
-      width: props.width,
-      height: props.height
+      width: props.width || style?.width,
+      height: props.height || style?.height
     })
   } : source ?? src;
-  return finalSource && typeof finalSource == "object" && finalSource.default && (finalSource = finalSource.default), /* @__PURE__ */jsx(StyledImage, {
+  return finalSource && typeof finalSource == "object" && (process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && useEffect(() => {
+    async function run() {
+      if (typeof src == "string") try {
+        await fetch(src).then(res => res.text());
+      } catch {
+        console.error(`Error loading image: ${src}`, {
+          props
+        });
+      }
+    }
+    run();
+  }, [src]), finalSource.default && (finalSource = finalSource.default)), /* @__PURE__ */jsx(RNImage, {
     ref,
     source: finalSource,
     style,

package/dist/esm/Image.native.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
+import { useEffect } from "react";
 import { Image as RNImage } from "react-native";
 function _array_like_to_array(arr, len) {
   (len == null || len > arr.length) && (len = arr.length);
@@ -10,6 +11,30 @@ function _array_like_to_array(arr, len) {
 function _array_with_holes(arr) {
   if (Array.isArray(arr)) return arr;
 }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+  try {
+    var info = gen[key](arg), value = info.value;
+  } catch (error) {
+    reject(error);
+    return;
+  }
+  info.done ? resolve(value) : Promise.resolve(value).then(_next, _throw);
+}
+function _async_to_generator(fn) {
+  return function() {
+    var self = this, args = arguments;
+    return new Promise(function(resolve, reject) {
+      var gen = fn.apply(self, args);
+      function _next(value) {
+        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+      }
+      function _throw(err) {
+        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+      }
+      _next(void 0);
+    });
+  };
+}
 function _define_property(obj, key, value) {
   return key in obj ? Object.defineProperty(obj, key, {
     value,
@@ -79,6 +104,92 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
   }
 }
+function _ts_generator(thisArg, body) {
+  var f, y, t, g, _ = {
+    label: 0,
+    sent: function() {
+      if (t[0] & 1) throw t[1];
+      return t[1];
+    },
+    trys: [],
+    ops: []
+  };
+  return g = {
+    next: verb(0),
+    throw: verb(1),
+    return: verb(2)
+  }, typeof Symbol == "function" && (g[Symbol.iterator] = function() {
+    return this;
+  }), g;
+  function verb(n) {
+    return function(v) {
+      return step([
+        n,
+        v
+      ]);
+    };
+  }
+  function step(op) {
+    if (f) throw new TypeError("Generator is already executing.");
+    for (; _; ) try {
+      if (f = 1, y && (t = op[0] & 2 ? y.return : op[0] ? y.throw || ((t = y.return) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+      switch (y = 0, t && (op = [
+        op[0] & 2,
+        t.value
+      ]), op[0]) {
+        case 0:
+        case 1:
+          t = op;
+          break;
+        case 4:
+          return _.label++, {
+            value: op[1],
+            done: !1
+          };
+        case 5:
+          _.label++, y = op[1], op = [
+            0
+          ];
+          continue;
+        case 7:
+          op = _.ops.pop(), _.trys.pop();
+          continue;
+        default:
+          if (t = _.trys, !(t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+            _ = 0;
+            continue;
+          }
+          if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+            _.label = op[1];
+            break;
+          }
+          if (op[0] === 6 && _.label < t[1]) {
+            _.label = t[1], t = op;
+            break;
+          }
+          if (t && _.label < t[2]) {
+            _.label = t[2], _.ops.push(op);
+            break;
+          }
+          t[2] && _.ops.pop(), _.trys.pop();
+          continue;
+      }
+      op = body.call(thisArg, _);
+    } catch (e) {
+      op = [
+        6,
+        e
+      ], y = 0;
+    } finally {
+      f = t = 0;
+    }
+    if (op[0] & 5) throw op[1];
+    return {
+      value: op[0] ? op[1] : void 0,
+      done: !0
+    };
+  }
+}
 var StyledImage = styled(RNImage, {
   name: "Image"
 }), hasWarned = !1, Image = StyledImage.styleable(function(inProps, ref) {
@@ -90,8 +201,8 @@ var StyledImage = styled(RNImage, {
   var finalSource = typeof src == "string" ? _object_spread({
     uri: src
   }, isWeb && {
-    width: props.width,
-    height: props.height
+    width: props.width || (style == null ? void 0 : style.width),
+    height: props.height || (style == null ? void 0 : style.height)
   }) : source ?? src;
   if (finalSource && typeof finalSource == "object") {
     if (!Array.isArray(finalSource) && typeof finalSource.uri == "number" && (finalSource = finalSource.uri, source && typeof source == "object" && !Array.isArray(source))) {
@@ -100,9 +211,59 @@ var StyledImage = styled(RNImage, {
       var _height;
       (_height = (_style1 = style).height) !== null && _height !== void 0 || (_style1.height = source.height);
     }
-    finalSource.default && (finalSource = finalSource.default);
+    process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && useEffect(function() {
+      var run = function() {
+        return _run.apply(this, arguments);
+      };
+      function _run() {
+        return _run = _async_to_generator(function() {
+          var err;
+          return _ts_generator(this, function(_state) {
+            switch (_state.label) {
+              case 0:
+                if (typeof src != "string") return [
+                  3,
+                  4
+                ];
+                _state.label = 1;
+              case 1:
+                return _state.trys.push([
+                  1,
+                  3,
+                  ,
+                  4
+                ]), [
+                  4,
+                  fetch(src).then(function(res) {
+                    return res.text();
+                  })
+                ];
+              case 2:
+                return _state.sent(), [
+                  3,
+                  4
+                ];
+              case 3:
+                return err = _state.sent(), console.error("Error loading image: ".concat(src), {
+                  props
+                }), [
+                  3,
+                  4
+                ];
+              case 4:
+                return [
+                  2
+                ];
+            }
+          });
+        }), _run.apply(this, arguments);
+      }
+      run();
+    }, [
+      src
+    ]), finalSource.default && (finalSource = finalSource.default);
   }
-  return /* @__PURE__ */ _jsx(StyledImage, _object_spread({
+  return /* @__PURE__ */ _jsx(RNImage, _object_spread({
     ref,
     source: finalSource,
     style

package/dist/esm/Image.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/packages/image/src/Image.tsx"],
-  "mappings": ";AAAA,SAASA,aAAa;AAQtB,SAASC,QAAQC,wBAAwB;AAEzC,SAASC,SAASC,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMC,cAAcJ,OAAOG,SAAS;EAClCE,MAAM;AACR,CAAA,GAmCIC,YAAY,IAEHJ,QAAQE,YAAYG,UAAsB,SAACC,SAASC,KAAAA;AAC/D,MAAuBR,oBAAAA,iBAAAA,iBAAiBO,OAAAA,GAAAA,CAAAA,GAAjCE,QAAgBT,kBAAAA,CAAAA,GAATU,QAASV,kBAAAA,CAAAA,GACfW,MAAyBF,MAAzBE,KAAKC,SAAoBH,MAApBG,QAAWC,OAAAA,2BAASJ,OAAAA;IAAzBE;IAAKC;;AAEb,EAAIE,QAAQC,IAAIC,aAAa,iBACvB,OAAOL,OAAQ,aAEd,OAAOF,MAAMQ,SAAU,YAAYR,MAAMQ,MAAM,CAAA,MAAO,OACtD,OAAOR,MAAMS,UAAW,YAAYT,MAAMS,OAAO,CAAA,MAAO,SAEpDb,cACHA,YAAY,IACZc,QAAQC,KACL,4IAAA;AAOX,MAAIC,cACF,OAAOV,OAAQ,WACX,eAAA;IAAEW,KAAKX;KAASb,SAAS;IAAEmB,OAAOR,MAAMQ;IAAOC,QAAQT,MAAMS;EAAO,CAAA,IACpEN,UAAUD;AAEhB,MAAIU,eAAe,OAAOA,eAAgB,UAAU;AAGhD,QAAI,CAACE,MAAMC,QAAQH,WAAAA,KACb,OAAOA,YAAYC,OAAQ,aAC7BD,cAAcA,YAAYC,KACtBV,UAAU,OAAOA,UAAW,YAAY,CAACW,MAAMC,QAAQZ,MAAAA,IAAS;UAElEF,QAEAA;AAFAA,OAAAA,UAAAA,SAAAA,OAAMO,WAAAA,QAAAA,WAAAA,WAANP,OAAMO,QAAUL,OAAOK;;AAEvBP,OAAAA,WAAAA,UAAAA,OAAMQ,YAAAA,QAAAA,YAAAA,WAANR,QAAMQ,SAAWN,OAAOM;IAC1B;AAMN,IAAIG,YAAY,YACdA,cAAcA,YAAY;EAE9B;AAGA,SAAO,qBAAClB,aAAAA,eAAAA;IAAYK;IAAUI,QAAQS;IAAaX;KAAmBG,IAAAA,CAAAA;AACxE,CAAA;AAEAZ,MAAMwB,UAAUvB,QAAQuB;AACxBxB,MAAMyB,qBAAqBxB,QAAQwB;AACnCzB,MAAM0B,WAAWzB,QAAQyB;AACzB1B,MAAM2B,uBAAuB1B,QAAQ0B;AACrC3B,MAAM4B,gBAAgB3B,QAAQ2B;AAC9B5B,MAAM6B,aAAa5B,QAAQ4B;",
-  "names": ["isWeb", "styled", "usePropsAndStyle", "Image", "RNImage", "StyledImage", "name", "hasWarned", "styleable", "inProps", "ref", "props", "style", "src", "source", "rest", "process", "env", "NODE_ENV", "width", "height", "console", "warn", "finalSource", "uri", "Array", "isArray", "getSize", "getSizeWithHeaders", "prefetch", "prefetchWithMetadata", "abortPrefetch", "queryCache"]
+  "mappings": ";AAAA,SAASA,aAAa;AAQtB,SAASC,QAAQC,wBAAwB;AACzC,SAASC,iBAA0B;AACnC,SAASC,SAASC,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMC,cAAcL,OAAOI,SAAS;EAClCE,MAAM;AACR,CAAA,GAmCIC,YAAY,IAEHJ,QAAQE,YAAYG,UAAsB,SAACC,SAASC,KAAAA;AAC/D,MAAuBT,oBAAAA,iBAAAA,iBAAiBQ,OAAAA,GAAAA,CAAAA,GAAjCE,QAAgBV,kBAAAA,CAAAA,GAATW,QAASX,kBAAAA,CAAAA,GACfY,MAAyBF,MAAzBE,KAAKC,SAAoBH,MAApBG,QAAWC,OAAAA,2BAASJ,OAAAA;IAAzBE;IAAKC;;AAEb,EAAIE,QAAQC,IAAIC,aAAa,iBACvB,OAAOL,OAAQ,aAEd,OAAOF,MAAMQ,SAAU,YAAYR,MAAMQ,MAAM,CAAA,MAAO,OACtD,OAAOR,MAAMS,UAAW,YAAYT,MAAMS,OAAO,CAAA,MAAO,SAEpDb,cACHA,YAAY,IACZc,QAAQC,KACL,4IAAA;AAOX,MAAIC,cACF,OAAOV,OAAQ,WACX,eAAA;IACEW,KAAKX;KACDd,SAAS;IACXoB,OAAOR,MAAMQ,UAASP,SAAAA,OAAAA,SAAAA,MAAOO;IAC7BC,QAAQT,MAAMS,WAAUR,SAAAA,OAAAA,SAAAA,MAAOQ;EACjC,CAAA,IAEFN,UAAUD;AAEhB,MAAIU,eAAe,OAAOA,eAAgB,UAAU;AAGhD,QAAI,CAACE,MAAMC,QAAQH,WAAAA,KACb,OAAOA,YAAYC,OAAQ,aAC7BD,cAAcA,YAAYC,KACtBV,UAAU,OAAOA,UAAW,YAAY,CAACW,MAAMC,QAAQZ,MAAAA,IAAS;UAElEF,QAEAA;AAFAA,OAAAA,UAAAA,SAAAA,OAAMO,WAAAA,QAAAA,WAAAA,WAANP,OAAMO,QAAUL,OAAOK;;AAEvBP,OAAAA,WAAAA,UAAAA,OAAMQ,YAAAA,QAAAA,YAAAA,WAANR,QAAMQ,SAAWN,OAAOM;IAC1B;AAKN,IAAIJ,QAAQC,IAAIC,aAAa,iBAAiBF,QAAQC,IAAIU,6BAExDzB,UAAU,WAAA;UACO0B,MAAAA,WAAAA;eAAAA,KAAAA,MAAAA,MAAAA,SAAAA;;eAAAA,OAAAA;AAAAA,sBAAf,oBAAA,WAAA;cAIaC;;;;oBAHP,OAAOhB,OAAQ,SAAf,QAAA;;;;;;;;;;;oBAEA;;kBAAMiB,MAAMjB,GAAAA,EAAKkB,KAAK,SAACC,KAAAA;2BAAQA,IAAIC,KAAI;;;;AAAvC,8BAAA,KAAA;;;;;AACOJ,6BAAAA,OAAAA,KAAAA,GACPR,QAAQa,MAAO,wBAA2B,OAAJrB,GAAAA,GAAO;kBAAEF;gBAAM,CAAA;;;;;;;;;;QAG3D,CAAA,GAReiB,KAAAA,MAAAA,MAAAA,SAAAA;;AAUfA,UAAAA;IACF,GAAG;MAACf;KAAI,GAINU,YAAY,YACdA,cAAcA,YAAY;EAE9B;AAGA,SAAO,qBAACnB,SAAAA,eAAAA;IAAQM;IAAUI,QAAQS;IAAaX;KAAmBG,IAAAA,CAAAA;AACpE,CAAA;AAEAZ,MAAMgC,UAAU/B,QAAQ+B;AACxBhC,MAAMiC,qBAAqBhC,QAAQgC;AACnCjC,MAAMkC,WAAWjC,QAAQiC;AACzBlC,MAAMmC,uBAAuBlC,QAAQkC;AACrCnC,MAAMoC,gBAAgBnC,QAAQmC;AAC9BpC,MAAMqC,aAAapC,QAAQoC;",
+  "names": ["isWeb", "styled", "usePropsAndStyle", "useEffect", "Image", "RNImage", "StyledImage", "name", "hasWarned", "styleable", "inProps", "ref", "props", "style", "src", "source", "rest", "process", "env", "NODE_ENV", "width", "height", "console", "warn", "finalSource", "uri", "Array", "isArray", "TAMAGUI_IMAGE_CHECK_ERROR", "run", "err", "fetch", "then", "res", "text", "error", "getSize", "getSizeWithHeaders", "prefetch", "prefetchWithMetadata", "abortPrefetch", "queryCache"]
 }

package/dist/jsx/Image.js

@@ -1,5 +1,6 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
+import { useEffect } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
@@ -11,8 +12,24 @@ const Image = StyledImage.styleable((inProps, ref) => {
   process.env.NODE_ENV === "development" && typeof src == "string" && (typeof props.width == "string" && props.width[0] !== "$" || typeof props.height == "string" && props.height[0] !== "$") && (hasWarned || (hasWarned = !0, console.warn(
     'React Native expects a numerical width/height. If you want to use a percent you must define the "source" prop with width, height, and uri.'
   )));
-  let finalSource = typeof src == "string" ? { uri: src, ...isWeb && { width: props.width, height: props.height } } : source ?? src;
-  return finalSource && typeof finalSource == "object" && finalSource.default && (finalSource = finalSource.default), /* @__PURE__ */ jsx(StyledImage, { ref, source: finalSource, style, ...rest });
+  let finalSource = typeof src == "string" ? {
+    uri: src,
+    ...isWeb && {
+      width: props.width || style?.width,
+      height: props.height || style?.height
+    }
+  } : source ?? src;
+  return finalSource && typeof finalSource == "object" && (process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && useEffect(() => {
+    async function run() {
+      if (typeof src == "string")
+        try {
+          await fetch(src).then((res) => res.text());
+        } catch {
+          console.error(`Error loading image: ${src}`, { props });
+        }
+    }
+    run();
+  }, [src]), finalSource.default && (finalSource = finalSource.default)), /* @__PURE__ */ jsx(RNImage, { ref, source: finalSource, style, ...rest });
 });
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;

package/dist/jsx/Image.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Image.tsx"],
-  "mappings": "AAAA,SAAS,aAAa;AAQtB,SAAS,QAAQ,wBAAwB;AAEzC,SAAS,SAAS,eAAe;AAyFxB;AAvFT,MAAM,cAAc,OAAO,SAAS;AAAA,EAClC,MAAM;AACR,CAAC;AAmCD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY,UAAsB,CAAC,SAAS,QAAQ;AACvE,QAAM,CAAC,OAAO,KAAK,IAAI,iBAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,EAAI,QAAQ,IAAI,aAAa,iBACvB,OAAO,OAAQ,aAEd,OAAO,MAAM,SAAU,YAAY,MAAM,MAAM,CAAC,MAAM,OACtD,OAAO,MAAM,UAAW,YAAY,MAAM,OAAO,CAAC,MAAM,SAEpD,cACH,YAAY,IACZ,QAAQ;AAAA,IACN;AAAA,EACF;AAMR,MAAI,cACF,OAAO,OAAQ,WACX,EAAE,KAAK,KAAK,GAAI,SAAS,EAAE,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,EAAG,IACvE,UAAU;AAEhB,SAAI,eAAe,OAAO,eAAgB,YAiBpC,YAAY,YACd,cAAc,YAAY,UAKvB,oBAAC,eAAY,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AACtF,CAAC;AAED,MAAM,UAAU,QAAQ;AACxB,MAAM,qBAAqB,QAAQ;AACnC,MAAM,WAAW,QAAQ;AACzB,MAAM,uBAAuB,QAAQ;AACrC,MAAM,gBAAgB,QAAQ;AAC9B,MAAM,aAAa,QAAQ;",
+  "mappings": "AAAA,SAAS,aAAa;AAQtB,SAAS,QAAQ,wBAAwB;AACzC,SAAS,iBAA0B;AACnC,SAAS,SAAS,eAAe;AAgHxB;AA9GT,MAAM,cAAc,OAAO,SAAS;AAAA,EAClC,MAAM;AACR,CAAC;AAmCD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY,UAAsB,CAAC,SAAS,QAAQ;AACvE,QAAM,CAAC,OAAO,KAAK,IAAI,iBAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,EAAI,QAAQ,IAAI,aAAa,iBACvB,OAAO,OAAQ,aAEd,OAAO,MAAM,SAAU,YAAY,MAAM,MAAM,CAAC,MAAM,OACtD,OAAO,MAAM,UAAW,YAAY,MAAM,OAAO,CAAC,MAAM,SAEpD,cACH,YAAY,IACZ,QAAQ;AAAA,IACN;AAAA,EACF;AAMR,MAAI,cACF,OAAO,OAAQ,WACX;AAAA,IACE,KAAK;AAAA,IACL,GAAI,SAAS;AAAA,MACX,OAAO,MAAM,SAAS,OAAO;AAAA,MAC7B,QAAQ,MAAM,UAAU,OAAO;AAAA,IACjC;AAAA,EACF,IACA,UAAU;AAEhB,SAAI,eAAe,OAAO,eAAgB,aAgBpC,QAAQ,IAAI,aAAa,iBAAiB,QAAQ,IAAI,6BAExD,UAAU,MAAM;AACd,mBAAe,MAAM;AACnB,UAAI,OAAO,OAAQ;AACjB,YAAI;AACF,gBAAM,MAAM,GAAG,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;AAAA,QAC3C,QAAc;AACZ,kBAAQ,MAAM,wBAAwB,GAAG,IAAI,EAAE,MAAM,CAAC;AAAA,QACxD;AAAA,IAEJ;AAEA,QAAI;AAAA,EACN,GAAG,CAAC,GAAG,CAAC,GAIN,YAAY,YACd,cAAc,YAAY,WAKvB,oBAAC,WAAQ,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AAClF,CAAC;AAED,MAAM,UAAU,QAAQ;AACxB,MAAM,qBAAqB,QAAQ;AACnC,MAAM,WAAW,QAAQ;AACzB,MAAM,uBAAuB,QAAQ;AACrC,MAAM,gBAAgB,QAAQ;AAC9B,MAAM,aAAa,QAAQ;",
   "names": []
 }

package/dist/jsx/Image.mjs

@@ -1,5 +1,6 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
+import { useEffect } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
@@ -17,11 +18,22 @@ const Image = StyledImage.styleable((inProps, ref) => {
   let finalSource = typeof src == "string" ? {
     uri: src,
     ...(isWeb && {
-      width: props.width,
-      height: props.height
+      width: props.width || style?.width,
+      height: props.height || style?.height
     })
   } : source ?? src;
-  return finalSource && typeof finalSource == "object" && finalSource.default && (finalSource = finalSource.default), /* @__PURE__ */jsx(StyledImage, {
+  return finalSource && typeof finalSource == "object" && (process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && useEffect(() => {
+    async function run() {
+      if (typeof src == "string") try {
+        await fetch(src).then(res => res.text());
+      } catch {
+        console.error(`Error loading image: ${src}`, {
+          props
+        });
+      }
+    }
+    run();
+  }, [src]), finalSource.default && (finalSource = finalSource.default)), /* @__PURE__ */jsx(RNImage, {
     ref,
     source: finalSource,
     style,

package/dist/jsx/Image.native.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
+import { useEffect } from "react";
 import { Image as RNImage } from "react-native";
 function _array_like_to_array(arr, len) {
   (len == null || len > arr.length) && (len = arr.length);
@@ -10,6 +11,30 @@ function _array_like_to_array(arr, len) {
 function _array_with_holes(arr) {
   if (Array.isArray(arr)) return arr;
 }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+  try {
+    var info = gen[key](arg), value = info.value;
+  } catch (error) {
+    reject(error);
+    return;
+  }
+  info.done ? resolve(value) : Promise.resolve(value).then(_next, _throw);
+}
+function _async_to_generator(fn) {
+  return function() {
+    var self = this, args = arguments;
+    return new Promise(function(resolve, reject) {
+      var gen = fn.apply(self, args);
+      function _next(value) {
+        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+      }
+      function _throw(err) {
+        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+      }
+      _next(void 0);
+    });
+  };
+}
 function _define_property(obj, key, value) {
   return key in obj ? Object.defineProperty(obj, key, {
     value,
@@ -79,6 +104,92 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
   }
 }
+function _ts_generator(thisArg, body) {
+  var f, y, t, g, _ = {
+    label: 0,
+    sent: function() {
+      if (t[0] & 1) throw t[1];
+      return t[1];
+    },
+    trys: [],
+    ops: []
+  };
+  return g = {
+    next: verb(0),
+    throw: verb(1),
+    return: verb(2)
+  }, typeof Symbol == "function" && (g[Symbol.iterator] = function() {
+    return this;
+  }), g;
+  function verb(n) {
+    return function(v) {
+      return step([
+        n,
+        v
+      ]);
+    };
+  }
+  function step(op) {
+    if (f) throw new TypeError("Generator is already executing.");
+    for (; _; ) try {
+      if (f = 1, y && (t = op[0] & 2 ? y.return : op[0] ? y.throw || ((t = y.return) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+      switch (y = 0, t && (op = [
+        op[0] & 2,
+        t.value
+      ]), op[0]) {
+        case 0:
+        case 1:
+          t = op;
+          break;
+        case 4:
+          return _.label++, {
+            value: op[1],
+            done: !1
+          };
+        case 5:
+          _.label++, y = op[1], op = [
+            0
+          ];
+          continue;
+        case 7:
+          op = _.ops.pop(), _.trys.pop();
+          continue;
+        default:
+          if (t = _.trys, !(t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+            _ = 0;
+            continue;
+          }
+          if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+            _.label = op[1];
+            break;
+          }
+          if (op[0] === 6 && _.label < t[1]) {
+            _.label = t[1], t = op;
+            break;
+          }
+          if (t && _.label < t[2]) {
+            _.label = t[2], _.ops.push(op);
+            break;
+          }
+          t[2] && _.ops.pop(), _.trys.pop();
+          continue;
+      }
+      op = body.call(thisArg, _);
+    } catch (e) {
+      op = [
+        6,
+        e
+      ], y = 0;
+    } finally {
+      f = t = 0;
+    }
+    if (op[0] & 5) throw op[1];
+    return {
+      value: op[0] ? op[1] : void 0,
+      done: !0
+    };
+  }
+}
 var StyledImage = styled(RNImage, {
   name: "Image"
 }), hasWarned = !1, Image = StyledImage.styleable(function(inProps, ref) {
@@ -90,8 +201,8 @@ var StyledImage = styled(RNImage, {
   var finalSource = typeof src == "string" ? _object_spread({
     uri: src
   }, isWeb && {
-    width: props.width,
-    height: props.height
+    width: props.width || (style == null ? void 0 : style.width),
+    height: props.height || (style == null ? void 0 : style.height)
   }) : source ?? src;
   if (finalSource && typeof finalSource == "object") {
     if (!Array.isArray(finalSource) && typeof finalSource.uri == "number" && (finalSource = finalSource.uri, source && typeof source == "object" && !Array.isArray(source))) {
@@ -100,9 +211,59 @@ var StyledImage = styled(RNImage, {
       var _height;
       (_height = (_style1 = style).height) !== null && _height !== void 0 || (_style1.height = source.height);
     }
-    finalSource.default && (finalSource = finalSource.default);
+    process.env.NODE_ENV === "development" && process.env.TAMAGUI_IMAGE_CHECK_ERROR && useEffect(function() {
+      var run = function() {
+        return _run.apply(this, arguments);
+      };
+      function _run() {
+        return _run = _async_to_generator(function() {
+          var err;
+          return _ts_generator(this, function(_state) {
+            switch (_state.label) {
+              case 0:
+                if (typeof src != "string") return [
+                  3,
+                  4
+                ];
+                _state.label = 1;
+              case 1:
+                return _state.trys.push([
+                  1,
+                  3,
+                  ,
+                  4
+                ]), [
+                  4,
+                  fetch(src).then(function(res) {
+                    return res.text();
+                  })
+                ];
+              case 2:
+                return _state.sent(), [
+                  3,
+                  4
+                ];
+              case 3:
+                return err = _state.sent(), console.error("Error loading image: ".concat(src), {
+                  props
+                }), [
+                  3,
+                  4
+                ];
+              case 4:
+                return [
+                  2
+                ];
+            }
+          });
+        }), _run.apply(this, arguments);
+      }
+      run();
+    }, [
+      src
+    ]), finalSource.default && (finalSource = finalSource.default);
   }
-  return /* @__PURE__ */ _jsx(StyledImage, _object_spread({
+  return /* @__PURE__ */ _jsx(RNImage, _object_spread({
     ref,
     source: finalSource,
     style

package/dist/jsx/Image.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/packages/image/src/Image.tsx"],
-  "mappings": ";AAAA,SAASA,aAAa;AAQtB,SAASC,QAAQC,wBAAwB;AAEzC,SAASC,SAASC,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMC,cAAcJ,OAAOG,SAAS;EAClCE,MAAM;AACR,CAAA,GAmCIC,YAAY,IAEHJ,QAAQE,YAAYG,UAAsB,SAACC,SAASC,KAAAA;AAC/D,MAAuBR,oBAAAA,iBAAAA,iBAAiBO,OAAAA,GAAAA,CAAAA,GAAjCE,QAAgBT,kBAAAA,CAAAA,GAATU,QAASV,kBAAAA,CAAAA,GACfW,MAAyBF,MAAzBE,KAAKC,SAAoBH,MAApBG,QAAWC,OAAAA,2BAASJ,OAAAA;IAAzBE;IAAKC;;AAEb,EAAIE,QAAQC,IAAIC,aAAa,iBACvB,OAAOL,OAAQ,aAEd,OAAOF,MAAMQ,SAAU,YAAYR,MAAMQ,MAAM,CAAA,MAAO,OACtD,OAAOR,MAAMS,UAAW,YAAYT,MAAMS,OAAO,CAAA,MAAO,SAEpDb,cACHA,YAAY,IACZc,QAAQC,KACL,4IAAA;AAOX,MAAIC,cACF,OAAOV,OAAQ,WACX,eAAA;IAAEW,KAAKX;KAASb,SAAS;IAAEmB,OAAOR,MAAMQ;IAAOC,QAAQT,MAAMS;EAAO,CAAA,IACpEN,UAAUD;AAEhB,MAAIU,eAAe,OAAOA,eAAgB,UAAU;AAGhD,QAAI,CAACE,MAAMC,QAAQH,WAAAA,KACb,OAAOA,YAAYC,OAAQ,aAC7BD,cAAcA,YAAYC,KACtBV,UAAU,OAAOA,UAAW,YAAY,CAACW,MAAMC,QAAQZ,MAAAA,IAAS;UAElEF,QAEAA;AAFAA,OAAAA,UAAAA,SAAAA,OAAMO,WAAAA,QAAAA,WAAAA,WAANP,OAAMO,QAAUL,OAAOK;;AAEvBP,OAAAA,WAAAA,UAAAA,OAAMQ,YAAAA,QAAAA,YAAAA,WAANR,QAAMQ,SAAWN,OAAOM;IAC1B;AAMN,IAAIG,YAAY,YACdA,cAAcA,YAAY;EAE9B;AAGA,SAAO,qBAAClB,aAAAA,eAAAA;IAAYK;IAAUI,QAAQS;IAAaX;KAAmBG,IAAAA,CAAAA;AACxE,CAAA;AAEAZ,MAAMwB,UAAUvB,QAAQuB;AACxBxB,MAAMyB,qBAAqBxB,QAAQwB;AACnCzB,MAAM0B,WAAWzB,QAAQyB;AACzB1B,MAAM2B,uBAAuB1B,QAAQ0B;AACrC3B,MAAM4B,gBAAgB3B,QAAQ2B;AAC9B5B,MAAM6B,aAAa5B,QAAQ4B;",
-  "names": ["isWeb", "styled", "usePropsAndStyle", "Image", "RNImage", "StyledImage", "name", "hasWarned", "styleable", "inProps", "ref", "props", "style", "src", "source", "rest", "process", "env", "NODE_ENV", "width", "height", "console", "warn", "finalSource", "uri", "Array", "isArray", "getSize", "getSizeWithHeaders", "prefetch", "prefetchWithMetadata", "abortPrefetch", "queryCache"]
+  "mappings": "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",
+  "names": ["isWeb", "styled", "usePropsAndStyle", "useEffect", "Image", "RNImage", "StyledImage", "name", "hasWarned", "styleable", "inProps", "ref", "props", "style", "src", "source", "rest", "process", "env", "NODE_ENV", "width", "height", "console", "warn", "finalSource", "uri", "Array", "isArray", "TAMAGUI_IMAGE_CHECK_ERROR", "run", "err", "fetch", "then", "res", "text", "error", "getSize", "getSizeWithHeaders", "prefetch", "prefetchWithMetadata", "abortPrefetch", "queryCache"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/image",
-  "version": "1.101.0",
+  "version": "1.101.1",
   "sideEffects": [
     "*.css"
   ],
@@ -32,15 +32,14 @@
     }
   },
   "dependencies": {
-    "@tamagui/constants": "1.101.0",
-    "@tamagui/core": "1.101.0"
+    "@tamagui/constants": "1.101.1",
+    "@tamagui/core": "1.101.1"
   },
   "peerDependencies": {
-    "react": "*",
-    "react-native": "*"
+    "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.101.0",
+    "@tamagui/build": "1.101.1",
     "react": "^18.2.0",
     "react-native": "0.74.1"
   },

package/src/Image.tsx

@@ -7,7 +7,7 @@ import type {
   ThemeValueFallback,
 } from '@tamagui/core'
 import { styled, usePropsAndStyle } from '@tamagui/core'
-import type { FC } from 'react'
+import { useEffect, type FC } from 'react'
 import { Image as RNImage } from 'react-native'
 
 const StyledImage = styled(RNImage, {
@@ -71,7 +71,13 @@ export const Image = StyledImage.styleable<ImageProps>((inProps, ref) => {
 
   let finalSource =
     typeof src === 'string'
-      ? { uri: src, ...(isWeb && { width: props.width, height: props.height }) }
+      ? {
+          uri: src,
+          ...(isWeb && {
+            width: props.width || style?.width,
+            height: props.height || style?.height,
+          }),
+        }
       : source ?? src
 
   if (finalSource && typeof finalSource === 'object') {
@@ -90,6 +96,23 @@ export const Image = StyledImage.styleable<ImageProps>((inProps, ref) => {
       }
     }
 
+    if (process.env.NODE_ENV === 'development' && process.env.TAMAGUI_IMAGE_CHECK_ERROR) {
+      // lets add an onload timeout and warning if it fails to load in console
+      useEffect(() => {
+        async function run() {
+          if (typeof src === 'string') {
+            try {
+              await fetch(src).then((res) => res.text())
+            } catch (err) {
+              console.error(`Error loading image: ${src}`, { props })
+            }
+          }
+        }
+
+        run()
+      }, [src])
+    }
+
     // require compat across native/web
     if (finalSource['default']) {
       finalSource = finalSource['default']
@@ -97,7 +120,7 @@ export const Image = StyledImage.styleable<ImageProps>((inProps, ref) => {
   }
 
   // must set defaultSource to allow SSR, default it to the same as src
-  return <StyledImage ref={ref} source={finalSource} style={style} {...(rest as any)} />
+  return <RNImage ref={ref} source={finalSource} style={style} {...(rest as any)} />
 }) as any as ImageType
 
 Image.getSize = RNImage.getSize

package/types/Image.d.ts

@@ -1,5 +1,5 @@
 import type { GetProps, RadiusTokens, SizeTokens, StackProps, ThemeValueFallback } from '@tamagui/core';
-import type { FC } from 'react';
+import { type FC } from 'react';
 import { Image as RNImage } from 'react-native';
 declare const StyledImage: import("@tamagui/core").TamaguiComponent<import("@tamagui/core").TamaDefer, RNImage, import("@tamagui/core").TamaguiComponentPropsBaseBase & import("react-native").ImageProps, import("@tamagui/core").StackStyleBase, {}, import("@tamagui/core").StaticConfigPublic>;
 type StyledImageProps = Omit<GetProps<typeof StyledImage>, 'borderRadius'> & {

package/types/Image.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../src/Image.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,UAAU,EACV,kBAAkB,EACnB,MAAM,eAAe,CAAA;AAEtB,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,MAAM,cAAc,CAAA;AAE/C,QAAA,MAAM,WAAW,yQAEf,CAAA;AAEF,KAAK,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,WAAW,CAAC,EAAE,cAAc,CAAC,GAAG;IAC3E,YAAY,CAAC,EAAE,YAAY,CAAA;CAC5B,CAAA;AAED,KAAK,SAAS,GAAG,IAAI,CACnB,gBAAgB,EAChB,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,YAAY,CACzD,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,kBAAkB,CAAA;IACzD,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,kBAAkB,CAAA;IAE1D;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,gBAAgB,CAAC,QAAQ,CAAC,CAAA;IACzC,wCAAwC;IACxC,UAAU,CAAC,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAA;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAA;CAC7C,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,IAAI,CAAC,UAAU,EAAE,MAAM,SAAS,CAAC,CAAA;AAEtE,KAAK,WAAW,GAAG,OAAO,OAAO,CAAA;AAEjC,KAAK,SAAS,GAAG,EAAE,CAAC,UAAU,CAAC,GAAG;IAChC,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAC/B,kBAAkB,EAAE,WAAW,CAAC,oBAAoB,CAAC,CAAA;IACrD,QAAQ,EAAE,WAAW,CAAC,UAAU,CAAC,CAAA;IACjC,oBAAoB,EAAE,WAAW,CAAC,sBAAsB,CAAC,CAAA;IACzD,aAAa,EAAE,WAAW,CAAC,eAAe,CAAC,CAAA;IAC3C,UAAU,EAAE,WAAW,CAAC,YAAY,CAAC,CAAA;CACtC,CAAA;AAID,eAAO,MAAM,KAAK,WAiDI,CAAA"}
+{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../src/Image.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,UAAU,EACV,kBAAkB,EACnB,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAa,KAAK,EAAE,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,MAAM,cAAc,CAAA;AAE/C,QAAA,MAAM,WAAW,yQAEf,CAAA;AAEF,KAAK,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,WAAW,CAAC,EAAE,cAAc,CAAC,GAAG;IAC3E,YAAY,CAAC,EAAE,YAAY,CAAA;CAC5B,CAAA;AAED,KAAK,SAAS,GAAG,IAAI,CACnB,gBAAgB,EAChB,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,YAAY,CACzD,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,kBAAkB,CAAA;IACzD,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,kBAAkB,CAAA;IAE1D;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,gBAAgB,CAAC,QAAQ,CAAC,CAAA;IACzC,wCAAwC;IACxC,UAAU,CAAC,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAA;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAA;CAC7C,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,IAAI,CAAC,UAAU,EAAE,MAAM,SAAS,CAAC,CAAA;AAEtE,KAAK,WAAW,GAAG,OAAO,OAAO,CAAA;AAEjC,KAAK,SAAS,GAAG,EAAE,CAAC,UAAU,CAAC,GAAG;IAChC,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAC/B,kBAAkB,EAAE,WAAW,CAAC,oBAAoB,CAAC,CAAA;IACrD,QAAQ,EAAE,WAAW,CAAC,UAAU,CAAC,CAAA;IACjC,oBAAoB,EAAE,WAAW,CAAC,sBAAsB,CAAC,CAAA;IACzD,aAAa,EAAE,WAAW,CAAC,eAAe,CAAC,CAAA;IAC3C,UAAU,EAAE,WAAW,CAAC,YAAY,CAAC,CAAA;CACtC,CAAA;AAID,eAAO,MAAM,KAAK,EAwEL,SAAS,CAAA"}