@tamagui/image 1.97.1 → 1.98.1

package/dist/cjs/Image.js

@@ -17,21 +17,19 @@ __export(Image_exports, {
   Image: () => Image
 });
 module.exports = __toCommonJS(Image_exports);
-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");
+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");
 const StyledImage = (0, import_core.styled)(import_react_native.Image, {
   name: "Image"
 });
 let hasWarned = !1;
-const Image = StyledImage.extractable(
-  (0, import_react.forwardRef)((inProps, ref) => {
-    const [props, style] = (0, import_core.usePropsAndStyle)(inProps), { src, source, ...rest } = props;
-    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 });
-  })
-);
+const Image = StyledImage.styleable((inProps, ref) => {
+  const [props, style] = (0, import_core.usePropsAndStyle)(inProps), { src, source, ...rest } = props;
+  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 });
+});
 Image.getSize = import_react_native.Image.getSize;
 Image.getSizeWithHeaders = import_react_native.Image.getSizeWithHeaders;
 Image.prefetch = import_react_native.Image.prefetch;

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,0BACzC,eAAoC,kBACpC,sBAAiC,yBAoFtB;AAlFX,MAAM,kBAAc,oBAAO,oBAAAA,OAAS;AAAA,EAClC,MAAM;AACR,CAAC;AA6BD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY;AAAA,MAC/B,yBAAW,CAAC,SAAqB,QAAQ;AACvC,UAAM,CAAC,OAAO,KAAK,QAAI,8BAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,IAAI,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,MACN;AAAA,IACF;AAMR,QAAI,cACF,OAAO,OAAQ,WACX,EAAE,KAAK,KAAK,GAAI,0BAAS,EAAE,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,EAAG,IACvE,UAAU;AAEhB,WAAI,eAAe,OAAO,eAAgB,YAiBpC,YAAY,YACd,cAAc,YAAY,UAKvB,4CAAC,eAAY,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AAAA,EACtF,CAAC;AACH;AAEA,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,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;",
   "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 = require("react"), 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_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++)
@@ -106,7 +106,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var StyledImage = (0, import_core.styled)(import_react_native.Image, {
   name: "Image"
-}), hasWarned = !1, Image = StyledImage.extractable(/* @__PURE__ */ (0, import_react.forwardRef)(function(inProps, ref) {
+}), hasWarned = !1, Image = StyledImage.styleable(function(inProps, ref) {
   var _usePropsAndStyle = _sliced_to_array((0, import_core.usePropsAndStyle)(inProps), 2), props = _usePropsAndStyle[0], style = _usePropsAndStyle[1], src = props.src, source = props.source, rest = _object_without_properties(props, [
     "src",
     "source"
@@ -132,7 +132,7 @@ var StyledImage = (0, import_core.styled)(import_react_native.Image, {
     source: finalSource,
     style
   }, rest));
-}));
+});
 Image.getSize = import_react_native.Image.getSize;
 Image.getSizeWithHeaders = import_react_native.Image.getSizeWithHeaders;
 Image.prefetch = import_react_native.Image.prefetch;

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,0BACzC,eAAoC,kBACpC,sBAAiC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMA,kBAAcC,oBAAOC,oBAAAA,OAAS;EAClCC,MAAM;AACR,CAAA,GA6BIC,YAAY,IAEHC,QAAQL,YAAYM,YAC/BC,6CAAW,SAACC,SAAqBC,KAAAA;AAC/B,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,SAEpDhB,cACHA,YAAY,IACZiB,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,KAAC5B,aAAAA,eAAAA;IAAYS;IAAUK,QAAQS;IAAaX;KAAmBG,IAAAA,CAAAA;AACxE,CAAA,CAAA;AAGFV,MAAMwB,UAAU3B,oBAAAA,MAAQ2B;AACxBxB,MAAMyB,qBAAqB5B,oBAAAA,MAAQ4B;AACnCzB,MAAM0B,WAAW7B,oBAAAA,MAAQ6B;AACzB1B,MAAM2B,uBAAuB9B,oBAAAA,MAAQ8B;AACrC3B,MAAM4B,gBAAgB/B,oBAAAA,MAAQ+B;AAC9B5B,MAAM6B,aAAahC,oBAAAA,MAAQgC;",
-  "names": ["StyledImage", "styled", "RNImage", "name", "hasWarned", "Image", "extractable", "forwardRef", "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,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"]
 }

package/dist/esm/Image.js

@@ -1,22 +1,19 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
-import { forwardRef } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
   name: "Image"
 });
 let hasWarned = !1;
-const Image = StyledImage.extractable(
-  forwardRef((inProps, ref) => {
-    const [props, style] = usePropsAndStyle(inProps), { src, source, ...rest } = props;
-    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 });
-  })
-);
+const Image = StyledImage.styleable((inProps, ref) => {
+  const [props, style] = usePropsAndStyle(inProps), { src, source, ...rest } = props;
+  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 });
+});
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;
 Image.prefetch = RNImage.prefetch;

package/dist/esm/Image.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Image.tsx"],
-  "mappings": "AAAA,SAAS,aAAa;AAQtB,SAAS,QAAQ,wBAAwB;AACzC,SAAkB,kBAAkB;AACpC,SAAS,SAAS,eAAe;AAoFtB;AAlFX,MAAM,cAAc,OAAO,SAAS;AAAA,EAClC,MAAM;AACR,CAAC;AA6BD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY;AAAA,EAC/B,WAAW,CAAC,SAAqB,QAAQ;AACvC,UAAM,CAAC,OAAO,KAAK,IAAI,iBAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,IAAI,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,MACN;AAAA,IACF;AAMR,QAAI,cACF,OAAO,OAAQ,WACX,EAAE,KAAK,KAAK,GAAI,SAAS,EAAE,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,EAAG,IACvE,UAAU;AAEhB,WAAI,eAAe,OAAO,eAAgB,YAiBpC,YAAY,YACd,cAAc,YAAY,UAKvB,oBAAC,eAAY,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AAAA,EACtF,CAAC;AACH;AAEA,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;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;",
   "names": []
 }

package/dist/esm/Image.mjs

@@ -1,13 +1,12 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
-import { forwardRef } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
   name: "Image"
 });
 let hasWarned = !1;
-const Image = StyledImage.extractable(forwardRef((inProps, ref) => {
+const Image = StyledImage.styleable((inProps, ref) => {
   const [props, style] = usePropsAndStyle(inProps),
     {
       src,
@@ -28,7 +27,7 @@ const Image = StyledImage.extractable(forwardRef((inProps, ref) => {
     style,
     ...rest
   });
-}));
+});
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;
 Image.prefetch = RNImage.prefetch;

package/dist/esm/Image.native.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
-import { forwardRef } from "react";
 import { Image as RNImage } from "react-native";
 function _array_like_to_array(arr, len) {
   (len == null || len > arr.length) && (len = arr.length);
@@ -90,7 +89,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var StyledImage = styled(RNImage, {
   name: "Image"
-}), hasWarned = !1, Image = StyledImage.extractable(/* @__PURE__ */ forwardRef(function(inProps, ref) {
+}), hasWarned = !1, Image = StyledImage.styleable(function(inProps, ref) {
   var _usePropsAndStyle = _sliced_to_array(usePropsAndStyle(inProps), 2), props = _usePropsAndStyle[0], style = _usePropsAndStyle[1], src = props.src, source = props.source, rest = _object_without_properties(props, [
     "src",
     "source"
@@ -116,7 +115,7 @@ var StyledImage = styled(RNImage, {
     source: finalSource,
     style
   }, rest));
-}));
+});
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;
 Image.prefetch = RNImage.prefetch;

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;AACzC,SAAkBC,kBAAkB;AACpC,SAASC,SAASC,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMC,cAAcL,OAAOI,SAAS;EAClCE,MAAM;AACR,CAAA,GA6BIC,YAAY,IAEHJ,QAAQE,YAAYG,YAC/BN,2BAAW,SAACO,SAAqBC,KAAAA;AAC/B,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;IAAEW,KAAKX;KAASd,SAAS;IAAEoB,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,CAAA;AAGFZ,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", "forwardRef", "Image", "RNImage", "StyledImage", "name", "hasWarned", "extractable", "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;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"]
 }

package/dist/jsx/Image.js

@@ -1,22 +1,19 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
-import { forwardRef } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
   name: "Image"
 });
 let hasWarned = !1;
-const Image = StyledImage.extractable(
-  forwardRef((inProps, ref) => {
-    const [props, style] = usePropsAndStyle(inProps), { src, source, ...rest } = props;
-    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 });
-  })
-);
+const Image = StyledImage.styleable((inProps, ref) => {
+  const [props, style] = usePropsAndStyle(inProps), { src, source, ...rest } = props;
+  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 });
+});
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;
 Image.prefetch = RNImage.prefetch;

package/dist/jsx/Image.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Image.tsx"],
-  "mappings": "AAAA,SAAS,aAAa;AAQtB,SAAS,QAAQ,wBAAwB;AACzC,SAAkB,kBAAkB;AACpC,SAAS,SAAS,eAAe;AAoFtB;AAlFX,MAAM,cAAc,OAAO,SAAS;AAAA,EAClC,MAAM;AACR,CAAC;AA6BD,IAAI,YAAY;AAET,MAAM,QAAQ,YAAY;AAAA,EAC/B,WAAW,CAAC,SAAqB,QAAQ;AACvC,UAAM,CAAC,OAAO,KAAK,IAAI,iBAAiB,OAAO,GACzC,EAAE,KAAK,QAAQ,GAAG,KAAK,IAAI;AAEjC,IAAI,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,MACN;AAAA,IACF;AAMR,QAAI,cACF,OAAO,OAAQ,WACX,EAAE,KAAK,KAAK,GAAI,SAAS,EAAE,OAAO,MAAM,OAAO,QAAQ,MAAM,OAAO,EAAG,IACvE,UAAU;AAEhB,WAAI,eAAe,OAAO,eAAgB,YAiBpC,YAAY,YACd,cAAc,YAAY,UAKvB,oBAAC,eAAY,KAAU,QAAQ,aAAa,OAAe,GAAI,MAAc;AAAA,EACtF,CAAC;AACH;AAEA,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;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;",
   "names": []
 }

package/dist/jsx/Image.mjs

@@ -1,13 +1,12 @@
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
-import { forwardRef } from "react";
 import { Image as RNImage } from "react-native-web";
 import { jsx } from "react/jsx-runtime";
 const StyledImage = styled(RNImage, {
   name: "Image"
 });
 let hasWarned = !1;
-const Image = StyledImage.extractable(forwardRef((inProps, ref) => {
+const Image = StyledImage.styleable((inProps, ref) => {
   const [props, style] = usePropsAndStyle(inProps),
     {
       src,
@@ -28,7 +27,7 @@ const Image = StyledImage.extractable(forwardRef((inProps, ref) => {
     style,
     ...rest
   });
-}));
+});
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;
 Image.prefetch = RNImage.prefetch;

package/dist/jsx/Image.native.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { isWeb } from "@tamagui/constants";
 import { styled, usePropsAndStyle } from "@tamagui/core";
-import { forwardRef } from "react";
 import { Image as RNImage } from "react-native";
 function _array_like_to_array(arr, len) {
   (len == null || len > arr.length) && (len = arr.length);
@@ -90,7 +89,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var StyledImage = styled(RNImage, {
   name: "Image"
-}), hasWarned = !1, Image = StyledImage.extractable(/* @__PURE__ */ forwardRef(function(inProps, ref) {
+}), hasWarned = !1, Image = StyledImage.styleable(function(inProps, ref) {
   var _usePropsAndStyle = _sliced_to_array(usePropsAndStyle(inProps), 2), props = _usePropsAndStyle[0], style = _usePropsAndStyle[1], src = props.src, source = props.source, rest = _object_without_properties(props, [
     "src",
     "source"
@@ -116,7 +115,7 @@ var StyledImage = styled(RNImage, {
     source: finalSource,
     style
   }, rest));
-}));
+});
 Image.getSize = RNImage.getSize;
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders;
 Image.prefetch = RNImage.prefetch;

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;AACzC,SAAkBC,kBAAkB;AACpC,SAASC,SAASC,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEjC,IAAMC,cAAcL,OAAOI,SAAS;EAClCE,MAAM;AACR,CAAA,GA6BIC,YAAY,IAEHJ,QAAQE,YAAYG,YAC/BN,2BAAW,SAACO,SAAqBC,KAAAA;AAC/B,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;IAAEW,KAAKX;KAASd,SAAS;IAAEoB,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,CAAA;AAGFZ,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", "forwardRef", "Image", "RNImage", "StyledImage", "name", "hasWarned", "extractable", "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;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"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/image",
-  "version": "1.97.1",
+  "version": "1.98.1",
   "sideEffects": [
     "*.css"
   ],
@@ -32,17 +32,17 @@
     }
   },
   "dependencies": {
-    "@tamagui/constants": "1.97.1",
-    "@tamagui/core": "1.97.1"
+    "@tamagui/constants": "1.98.1",
+    "@tamagui/core": "1.98.1"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.97.1",
+    "@tamagui/build": "1.98.1",
     "react": "^18.2.0",
-    "react-native": "^0.73.4"
+    "react-native": "0.74.1"
   },
   "publishConfig": {
     "access": "public"

package/src/Image.tsx

@@ -18,7 +18,10 @@ type StyledImageProps = Omit<GetProps<typeof StyledImage>, 'borderRadius'> & {
   borderRadius?: RadiusTokens
 }
 
-type BaseProps = Omit<StyledImageProps, 'width' | 'height' | 'style' | 'onLayout'> & {
+type BaseProps = Omit<
+  StyledImageProps,
+  'width' | 'height' | 'style' | 'onLayout' | 'resizeMode'
+> & {
   width?: string | number | SizeTokens | ThemeValueFallback
   height?: string | number | SizeTokens | ThemeValueFallback
 
@@ -26,6 +29,9 @@ type BaseProps = Omit<StyledImageProps, 'width' | 'height' | 'style' | 'onLayout
    * @deprecated use `source` instead to disambiguate width/height style from width/height of the actual image
    */
   src?: string | StyledImageProps['source']
+  /** @deprecated use objectFit instead */
+  resizeMode?: StyledImageProps['resizeMode']
+  objectFit?: React.CSSProperties['objectFit']
 }
 
 export type ImageProps = BaseProps & Omit<StackProps, keyof BaseProps>
@@ -43,58 +49,56 @@ type ImageType = FC<ImageProps> & {
 
 let hasWarned = false
 
-export const Image = StyledImage.extractable(
-  forwardRef((inProps: ImageProps, ref) => {
-    const [props, style] = usePropsAndStyle(inProps)
-    const { src, source, ...rest } = props
+export const Image = StyledImage.styleable<ImageProps>((inProps, ref) => {
+  const [props, style] = usePropsAndStyle(inProps)
+  const { src, source, ...rest } = props
 
-    if (process.env.NODE_ENV === 'development') {
-      if (typeof src === 'string') {
-        if (
-          (typeof props.width === 'string' && props.width[0] !== '$') ||
-          (typeof props.height === 'string' && props.height[0] !== '$')
-        ) {
-          if (!hasWarned) {
-            hasWarned = true
-            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.`
-            )
-          }
+  if (process.env.NODE_ENV === 'development') {
+    if (typeof src === 'string') {
+      if (
+        (typeof props.width === 'string' && props.width[0] !== '$') ||
+        (typeof props.height === 'string' && props.height[0] !== '$')
+      ) {
+        if (!hasWarned) {
+          hasWarned = true
+          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
+  let finalSource =
+    typeof src === 'string'
+      ? { uri: src, ...(isWeb && { width: props.width, height: props.height }) }
+      : source ?? src
 
-    if (finalSource && typeof finalSource === 'object') {
-      if (process.env.TAMAGUI_TARGET === 'native') {
-        // fix: normalize import style images
-        if (!Array.isArray(finalSource)) {
-          if (typeof finalSource.uri === 'number') {
-            finalSource = finalSource.uri
-            if (source && typeof source === 'object' && !Array.isArray(source)) {
-              // @ts-ignore
-              style.width ??= source.width
-              // @ts-ignore
-              style.height ??= source.height
-            }
+  if (finalSource && typeof finalSource === 'object') {
+    if (process.env.TAMAGUI_TARGET === 'native') {
+      // fix: normalize import style images
+      if (!Array.isArray(finalSource)) {
+        if (typeof finalSource.uri === 'number') {
+          finalSource = finalSource.uri
+          if (source && typeof source === 'object' && !Array.isArray(source)) {
+            // @ts-ignore
+            style.width ??= source.width
+            // @ts-ignore
+            style.height ??= source.height
           }
         }
       }
+    }
 
-      // require compat across native/web
-      if (finalSource['default']) {
-        finalSource = finalSource['default']
-      }
+    // require compat across native/web
+    if (finalSource['default']) {
+      finalSource = finalSource['default']
     }
+  }
 
-    // must set defaultSource to allow SSR, default it to the same as src
-    return <StyledImage ref={ref} source={finalSource} style={style} {...(rest as any)} />
-  })
-) as any as ImageType
+  // must set defaultSource to allow SSR, default it to the same as src
+  return <StyledImage ref={ref} source={finalSource} style={style} {...(rest as any)} />
+}) as any as ImageType
 
 Image.getSize = RNImage.getSize
 Image.getSizeWithHeaders = RNImage.getSizeWithHeaders

package/types/Image.d.ts

@@ -5,13 +5,16 @@ declare const StyledImage: import("@tamagui/core").TamaguiComponent<import("@tam
 type StyledImageProps = Omit<GetProps<typeof StyledImage>, 'borderRadius'> & {
     borderRadius?: RadiusTokens;
 };
-type BaseProps = Omit<StyledImageProps, 'width' | 'height' | 'style' | 'onLayout'> & {
+type BaseProps = Omit<StyledImageProps, 'width' | 'height' | 'style' | 'onLayout' | 'resizeMode'> & {
     width?: string | number | SizeTokens | ThemeValueFallback;
     height?: string | number | SizeTokens | ThemeValueFallback;
     /**
      * @deprecated use `source` instead to disambiguate width/height style from width/height of the actual image
      */
     src?: string | StyledImageProps['source'];
+    /** @deprecated use objectFit instead */
+    resizeMode?: StyledImageProps['resizeMode'];
+    objectFit?: React.CSSProperties['objectFit'];
 };
 export type ImageProps = BaseProps & Omit<StackProps, keyof BaseProps>;
 type RNImageType = typeof RNImage;

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,EAAE,KAAK,EAAE,EAAc,MAAM,OAAO,CAAA;AAC3C,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,CAAC,gBAAgB,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC,GAAG;IACnF,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;CAC1C,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,WAmDG,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,EAAE,KAAK,EAAE,EAAc,MAAM,OAAO,CAAA;AAC3C,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"}