@multiplatform.one/components 6.7.0 → 7.0.0

package/dist/jsx/images/Image/ImageFrame.mjs

@@ -0,0 +1,216 @@
+import { ImageIcon } from "@phosphor-icons/react";
+import { MIN_PRESS_TARGET, pressTargetHitSlop, pressTargetStyle, stackRadiusProps, useGroupPosition, useResolvedKnobs } from "@multiplatform.one/theme";
+import { Image as TamaguiImage, View, isWeb } from "tamagui";
+import { componentColors } from "../../componentColors.mjs";
+import { Skeleton } from "../../Skeleton/index.mjs";
+import { isThumbnailSize, thumbnailPx as resolveThumbnailPx } from "./shared.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function glyphSize(px) {
+  return Math.max(14, Math.min(28, Math.round(px * 0.42)));
+}
+function DefaultFallback({
+  px
+}) {
+  return /* @__PURE__ */jsx(View, {
+    "data-image-fallback": "",
+    width: "100%",
+    height: "100%",
+    minHeight: px,
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: "$color3",
+    children: /* @__PURE__ */jsx(ImageIcon, {
+      size: glyphSize(px),
+      color: componentColors.text.muted
+    })
+  });
+}
+function ImageFrame({
+  children,
+  alt,
+  fill = false,
+  framed = false,
+  compact = false,
+  groupPosition,
+  groupOrientation = "horizontal",
+  thumbnailPx: thumbnailPxProp,
+  size,
+  width,
+  height,
+  aspectRatio,
+  borderRadius: borderRadiusProp,
+  objectFit,
+  objectPosition: _objectPosition,
+  onPress,
+  disabled = false,
+  hasSource,
+  status,
+  placeholder = "empty",
+  placeholderSrc,
+  fallback,
+  ...props
+}) {
+  const {
+    knobProps,
+    control,
+    disabledState
+  } = useResolvedKnobs({
+    component: "Image",
+    compact
+  });
+  const ctxPosition = useGroupPosition();
+  const position = groupPosition ?? ctxPosition;
+  const nestedPx = knobProps.nestedControl.px;
+  const thumbnailPx = thumbnailPxProp ?? (size != null && (isThumbnailSize(size) || typeof size === "number") ? resolveThumbnailPx(size, nestedPx, compact) : void 0);
+  const hasPress = Boolean(onPress);
+  const interactive = hasPress && !disabled;
+  const visualPx = thumbnailPx ?? (typeof width === "number" && typeof height === "number" ? Math.min(width, height) : void 0);
+  const needsHitSlop = hasPress && visualPx != null && visualPx < MIN_PRESS_TARGET;
+  const minTarget = hasPress && visualPx == null ? pressTargetStyle() : void 0;
+  const radiusToken = knobProps.borderRadius.borderRadius;
+  const radiusValue = borderRadiusProp ?? radiusToken;
+  const radiusFragment = position ? stackRadiusProps(position, radiusValue, groupOrientation) : {
+    borderRadius: radiusValue,
+    className: knobProps.borderRadius.className
+  };
+  const heightOnly = typeof height !== "undefined" && typeof width === "undefined" && typeof aspectRatio === "undefined" && thumbnailPx == null && !fill;
+  const square = thumbnailPx != null;
+  const frameWidth = square ? thumbnailPx : width;
+  const frameHeight = square ? thumbnailPx : height;
+  const frameAspect = square ? 1 : aspectRatio;
+  const fallbackPx = visualPx ?? nestedPx;
+  const showPlaceholder = status === "loading" && placeholder != null && placeholder !== "empty" && hasSource;
+  const showFallback = status === "error" || !hasSource;
+  const handleKeyDown = e => {
+    if (!interactive) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault?.();
+      onPress?.();
+    }
+  };
+  const pressA11y = hasPress ? isWeb ? {
+    role: "button",
+    tabIndex: disabled ? -1 : 0,
+    "aria-label": alt || void 0,
+    "aria-disabled": disabled || void 0,
+    onKeyDown: handleKeyDown
+  } : {
+    accessibilityRole: "button",
+    accessibilityLabel: alt || void 0,
+    accessibilityState: {
+      disabled
+    }
+  } : isWeb ? null : {
+    accessible: false
+  };
+  const painted = /* @__PURE__ */jsx(View, {
+    "data-image-frame": "",
+    "data-nested-px": thumbnailPx === nestedPx ? nestedPx : void 0,
+    "data-group-position": position,
+    overflow: "hidden",
+    position: fill ? "absolute" : "relative",
+    ...(fill ? {
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      width: "100%",
+      height: "100%"
+    } : null),
+    ...(!fill && frameWidth != null ? {
+      width: frameWidth
+    } : null),
+    ...(!fill && frameHeight != null ? {
+      height: frameHeight
+    } : null),
+    ...(!fill && frameAspect != null ? {
+      aspectRatio: frameAspect
+    } : null),
+    ...(heightOnly ? {
+      width: "auto",
+      alignSelf: "flex-start"
+    } : null),
+    ...radiusFragment,
+    ...(framed ? {
+      backgroundColor: knobProps.surface.backgroundColor,
+      borderColor: knobProps.surface.borderColor,
+      borderWidth: knobProps.surface.borderWidth
+    } : null),
+    ...(hasPress ? {
+      cursor: disabled ? "not-allowed" : "pointer",
+      outlineWidth: 0,
+      hoverStyle: interactive ? framed ? control.hoverKnobProps : {
+        opacity: 0.92
+      } : void 0,
+      pressStyle: interactive ? framed ? control.pressKnobProps : {
+        opacity: 0.85
+      } : void 0,
+      focusVisibleStyle: interactive ? control.focusVisibleKnobProps : void 0,
+      // onPress rides in loose (zero-or-event) so callers can forward the
+      // RN/Tamagui handler; re-emit it to the View as an event handler.
+      onPress: interactive ? onPress : void 0,
+      ...(!isWeb && needsHitSlop ? {
+        hitSlop: pressTargetHitSlop(visualPx ?? nestedPx)
+      } : null),
+      ...minTarget,
+      ...pressA11y
+    } : pressA11y),
+    ...(disabled && hasPress ? disabledState.chromeKnobProps : null),
+    ...props,
+    children: showFallback ? fallback ?? /* @__PURE__ */jsx(DefaultFallback, {
+      px: fallbackPx
+    }) : /* @__PURE__ */jsxs(Fragment, {
+      children: [children, showPlaceholder ? /* @__PURE__ */jsx(View, {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        pointerEvents: "none",
+        children: placeholder === "blur" && placeholderSrc ? /* @__PURE__ */jsx(TamaguiImage, {
+          src: placeholderSrc,
+          alt: "",
+          width: "100%",
+          height: "100%",
+          objectFit: objectFit ?? "cover",
+          ...(isWeb ? {
+            style: {
+              filter: "blur(12px)"
+            }
+          } : {
+            blurRadius: 12
+          })
+        }) : placeholder === "blur" || placeholder === "skeleton" ? /* @__PURE__ */jsx(Skeleton, {
+          width: "100%",
+          height: "100%",
+          variant: "rounded"
+        }) : placeholder
+      }) : null]
+    })
+  });
+  if (isWeb && needsHitSlop) {
+    return /* @__PURE__ */jsx(View, {
+      alignItems: "center",
+      justifyContent: "center",
+      backgroundColor: "transparent",
+      ...pressTargetStyle(),
+      children: painted
+    });
+  }
+  return painted;
+}
+function mediaFillProps(opts) {
+  const constrained = opts.fill || opts.thumbnail || opts.width != null && opts.height != null || opts.width != null && opts.aspectRatio != null || opts.height != null && opts.aspectRatio != null;
+  const heightOnly = opts.height != null && opts.width == null && opts.aspectRatio == null && !opts.fill && !opts.thumbnail;
+  return {
+    width: constrained ? "100%" : heightOnly ? "auto" : opts.width != null ? "100%" : void 0,
+    height: constrained ? "100%" : heightOnly ? "100%" : void 0,
+    objectFit: opts.objectFit,
+    ...(opts.objectPosition ? {
+      objectPosition: opts.objectPosition
+    } : null),
+    display: "block"
+  };
+}
+export { ImageFrame, mediaFillProps };
+//# sourceMappingURL=ImageFrame.mjs.map

package/dist/jsx/images/Image/ImageFrame.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["ImageIcon","MIN_PRESS_TARGET","pressTargetHitSlop","pressTargetStyle","stackRadiusProps","useGroupPosition","useResolvedKnobs","Image","TamaguiImage","View","isWeb","componentColors","Skeleton","isThumbnailSize","thumbnailPx","resolveThumbnailPx","Fragment","jsx","jsxs","glyphSize","px","Math","max","min","round","DefaultFallback","width","height","minHeight","alignItems","justifyContent","backgroundColor","children","size","color","text","muted","ImageFrame","alt","fill","framed","compact","groupPosition","groupOrientation","thumbnailPxProp","aspectRatio","borderRadius","borderRadiusProp","objectFit","objectPosition","_objectPosition","onPress","disabled","hasSource","status","placeholder","placeholderSrc","fallback","props","knobProps","control","disabledState","component","ctxPosition","position","nestedPx","nestedControl","hasPress","Boolean","interactive","visualPx","needsHitSlop","minTarget","radiusToken","radiusValue","radiusFragment","className","heightOnly","square","frameWidth","frameHeight","frameAspect","fallbackPx","showPlaceholder","showFallback","handleKeyDown","e","key","preventDefault","pressA11y","role","tabIndex","onKeyDown","accessibilityRole","accessibilityLabel","accessibilityState","accessible","painted","overflow","top","left","right","bottom","alignSelf","surface","borderColor","borderWidth","cursor","outlineWidth","hoverStyle","hoverKnobProps","opacity","pressStyle","pressKnobProps","focusVisibleStyle","focusVisibleKnobProps","hitSlop","chromeKnobProps","pointerEvents","src","style","filter","blurRadius","variant","mediaFillProps","opts","constrained","thumbnail","display"],"sources":["../../../../src/images/Image/ImageFrame.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/images/Image/ImageFrame.native.js

@@ -0,0 +1,248 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var ImageFrame_exports = {};
+__export(ImageFrame_exports, {
+  ImageFrame: () => ImageFrame,
+  mediaFillProps: () => mediaFillProps
+});
+module.exports = __toCommonJS(ImageFrame_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("@phosphor-icons/react");
+var import_theme = require("@multiplatform.one/theme");
+var import_tamagui = require("tamagui");
+var import_componentColors = require("../../componentColors.native.js");
+var import_Skeleton = require("../../Skeleton/index.native.js");
+var import_shared = require("./shared.native.js");
+function glyphSize(px) {
+  return Math.max(14, Math.min(28, Math.round(px * 0.42)));
+}
+function DefaultFallback(param) {
+  var {
+    px
+  } = param;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+    "data-image-fallback": "",
+    width: "100%",
+    height: "100%",
+    minHeight: px,
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: "$color3",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.ImageIcon, {
+      size: glyphSize(px),
+      color: import_componentColors.componentColors.text.muted
+    })
+  });
+}
+function ImageFrame(param) {
+  var {
+    children,
+    alt,
+    fill = false,
+    framed = false,
+    compact = false,
+    groupPosition,
+    groupOrientation = "horizontal",
+    thumbnailPx: thumbnailPxProp,
+    size,
+    width,
+    height,
+    aspectRatio,
+    borderRadius: borderRadiusProp,
+    objectFit,
+    objectPosition: _objectPosition,
+    onPress,
+    disabled = false,
+    hasSource,
+    status,
+    placeholder = "empty",
+    placeholderSrc,
+    fallback,
+    ...props
+  } = param;
+  var {
+    knobProps,
+    control,
+    disabledState
+  } = (0, import_theme.useResolvedKnobs)({
+    component: "Image",
+    compact
+  });
+  var ctxPosition = (0, import_theme.useGroupPosition)();
+  var position = groupPosition !== null && groupPosition !== void 0 ? groupPosition : ctxPosition;
+  var nestedPx = knobProps.nestedControl.px;
+  var thumbnailPx = thumbnailPxProp !== null && thumbnailPxProp !== void 0 ? thumbnailPxProp : size != null && ((0, import_shared.isThumbnailSize)(size) || typeof size === "number") ? (0, import_shared.thumbnailPx)(size, nestedPx, compact) : void 0;
+  var hasPress = Boolean(onPress);
+  var interactive = hasPress && !disabled;
+  var visualPx = thumbnailPx !== null && thumbnailPx !== void 0 ? thumbnailPx : typeof width === "number" && typeof height === "number" ? Math.min(width, height) : void 0;
+  var needsHitSlop = hasPress && visualPx != null && visualPx < import_theme.MIN_PRESS_TARGET;
+  var minTarget = hasPress && visualPx == null ? (0, import_theme.pressTargetStyle)() : void 0;
+  var radiusToken = knobProps.borderRadius.borderRadius;
+  var radiusValue = borderRadiusProp !== null && borderRadiusProp !== void 0 ? borderRadiusProp : radiusToken;
+  var radiusFragment = position ? (0, import_theme.stackRadiusProps)(position, radiusValue, groupOrientation) : {
+    borderRadius: radiusValue,
+    className: knobProps.borderRadius.className
+  };
+  var heightOnly = typeof height !== "undefined" && typeof width === "undefined" && typeof aspectRatio === "undefined" && thumbnailPx == null && !fill;
+  var square = thumbnailPx != null;
+  var frameWidth = square ? thumbnailPx : width;
+  var frameHeight = square ? thumbnailPx : height;
+  var frameAspect = square ? 1 : aspectRatio;
+  var fallbackPx = visualPx !== null && visualPx !== void 0 ? visualPx : nestedPx;
+  var showPlaceholder = status === "loading" && placeholder != null && placeholder !== "empty" && hasSource;
+  var showFallback = status === "error" || !hasSource;
+  var handleKeyDown = function handleKeyDown2(e) {
+    if (!interactive) return;
+    if (e.key === "Enter" || e.key === " ") {
+      var _e_preventDefault;
+      (_e_preventDefault = e.preventDefault) === null || _e_preventDefault === void 0 ? void 0 : _e_preventDefault.call(e);
+      onPress === null || onPress === void 0 ? void 0 : onPress();
+    }
+  };
+  var pressA11y = hasPress ? import_tamagui.isWeb ? {
+    role: "button",
+    tabIndex: disabled ? -1 : 0,
+    "aria-label": alt || void 0,
+    "aria-disabled": disabled || void 0,
+    onKeyDown: handleKeyDown
+  } : {
+    accessibilityRole: "button",
+    accessibilityLabel: alt || void 0,
+    accessibilityState: {
+      disabled
+    }
+  } : import_tamagui.isWeb ? null : {
+    accessible: false
+  };
+  var painted = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+    "data-image-frame": "",
+    "data-nested-px": thumbnailPx === nestedPx ? nestedPx : void 0,
+    "data-group-position": position,
+    overflow: "hidden",
+    position: fill ? "absolute" : "relative",
+    ...(fill ? {
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      width: "100%",
+      height: "100%"
+    } : null),
+    ...(!fill && frameWidth != null ? {
+      width: frameWidth
+    } : null),
+    ...(!fill && frameHeight != null ? {
+      height: frameHeight
+    } : null),
+    ...(!fill && frameAspect != null ? {
+      aspectRatio: frameAspect
+    } : null),
+    ...(heightOnly ? {
+      width: "auto",
+      alignSelf: "flex-start"
+    } : null),
+    ...radiusFragment,
+    ...(framed ? {
+      backgroundColor: knobProps.surface.backgroundColor,
+      borderColor: knobProps.surface.borderColor,
+      borderWidth: knobProps.surface.borderWidth
+    } : null),
+    ...(hasPress ? {
+      cursor: disabled ? "not-allowed" : "pointer",
+      outlineWidth: 0,
+      hoverStyle: interactive ? framed ? control.hoverKnobProps : {
+        opacity: 0.92
+      } : void 0,
+      pressStyle: interactive ? framed ? control.pressKnobProps : {
+        opacity: 0.85
+      } : void 0,
+      focusVisibleStyle: interactive ? control.focusVisibleKnobProps : void 0,
+      // onPress rides in loose (zero-or-event) so callers can forward the
+      // RN/Tamagui handler; re-emit it to the View as an event handler.
+      onPress: interactive ? onPress : void 0,
+      ...(!import_tamagui.isWeb && needsHitSlop ? {
+        hitSlop: (0, import_theme.pressTargetHitSlop)(visualPx !== null && visualPx !== void 0 ? visualPx : nestedPx)
+      } : null),
+      ...minTarget,
+      ...pressA11y
+    } : pressA11y),
+    ...(disabled && hasPress ? disabledState.chromeKnobProps : null),
+    ...props,
+    children: showFallback ? fallback !== null && fallback !== void 0 ? fallback : /* @__PURE__ */(0, import_jsx_runtime.jsx)(DefaultFallback, {
+      px: fallbackPx
+    }) : /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+      children: [children, showPlaceholder ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        pointerEvents: "none",
+        children: placeholder === "blur" && placeholderSrc ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Image, {
+          src: placeholderSrc,
+          alt: "",
+          width: "100%",
+          height: "100%",
+          objectFit: objectFit !== null && objectFit !== void 0 ? objectFit : "cover",
+          ...(import_tamagui.isWeb ? {
+            style: {
+              filter: "blur(12px)"
+            }
+          } : {
+            blurRadius: 12
+          })
+        }) : placeholder === "blur" || placeholder === "skeleton" ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Skeleton.Skeleton, {
+          width: "100%",
+          height: "100%",
+          variant: "rounded"
+        }) : placeholder
+      }) : null]
+    })
+  });
+  if (import_tamagui.isWeb && needsHitSlop) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+      alignItems: "center",
+      justifyContent: "center",
+      backgroundColor: "transparent",
+      ...(0, import_theme.pressTargetStyle)(),
+      children: painted
+    });
+  }
+  return painted;
+}
+function mediaFillProps(opts) {
+  var constrained = opts.fill || opts.thumbnail || opts.width != null && opts.height != null || opts.width != null && opts.aspectRatio != null || opts.height != null && opts.aspectRatio != null;
+  var heightOnly = opts.height != null && opts.width == null && opts.aspectRatio == null && !opts.fill && !opts.thumbnail;
+  return {
+    width: constrained ? "100%" : heightOnly ? "auto" : opts.width != null ? "100%" : void 0,
+    height: constrained ? "100%" : heightOnly ? "100%" : void 0,
+    objectFit: opts.objectFit,
+    ...(opts.objectPosition ? {
+      objectPosition: opts.objectPosition
+    } : null),
+    display: "block"
+  };
+}
+//# sourceMappingURL=ImageFrame.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","ImageFrame_exports","ImageFrame","mediaFillProps","module","exports","import_jsx_runtime","require","import_react","import_theme","import_tamagui","import_componentColors","import_Skeleton","import_shared","glyphSize","px","Math","max","min","round","DefaultFallback","param","jsx","View","width","height","minHeight","alignItems","justifyContent","backgroundColor","children","ImageIcon","size","color","componentColors","text","muted","alt","fill","framed","compact","groupPosition","groupOrientation","thumbnailPx","thumbnailPxProp","aspectRatio","borderRadius","borderRadiusProp","objectFit","objectPosition","_objectPosition","onPress","disabled","hasSource","status","placeholder","placeholderSrc","fallback","props","knobProps","control","disabledState","useResolvedKnobs","component","ctxPosition","useGroupPosition","position","nestedPx","nestedControl","isThumbnailSize","hasPress","Boolean","interactive","visualPx","needsHitSlop","MIN_PRESS_TARGET","minTarget","pressTargetStyle","radiusToken","radiusValue","radiusFragment","stackRadiusProps","className","heightOnly","square","frameWidth","frameHeight","frameAspect","fallbackPx","showPlaceholder","showFallback","handleKeyDown","handleKeyDown2","e","_e_preventDefault","preventDefault","pressA11y","isWeb","role","tabIndex","onKeyDown","accessibilityRole","accessibilityLabel","accessibilityState","accessible","painted","overflow","top","left","right","bottom","alignSelf","surface","borderColor","borderWidth","cursor","outlineWidth","hoverStyle","hoverKnobProps","opacity","pressStyle","pressKnobProps","focusVisibleStyle","focusVisibleKnobProps","hitSlop","pressTargetHitSlop","chromeKnobProps","jsxs","Fragment","pointerEvents","Image","src","style","filter"],"sources":["../../../../src/images/Image/ImageFrame.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/images/Image/index.mjs

@@ -1,16 +1,18 @@
-import { useMemo } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { Image as TamaguiImage } from "tamagui";
-import { useAssets } from "../../hooks/useAssets/index.mjs";
+import { ImageFrame, mediaFillProps } from "./ImageFrame.mjs";
+import { isThumbnailSize, useResolvedImageSource } from "./shared.mjs";
 import { jsx } from "react/jsx-runtime";
 function Image({
-  alt,
+  alt = "",
   blurRadius: _blurRadius,
   capInsets: _capInsets,
   crossOrigin,
   defaultSource: _defaultSource,
   fadeDuration: _fadeDuration,
   loadingIndicatorSource: _loadingIndicatorSource,
-  objectFit,
+  objectFit: objectFitProp,
+  objectPosition,
   onError,
   onLoad,
   onLoadEnd,
@@ -25,49 +27,100 @@ function Image({
   srcSet,
   svg: _svg,
   tintColor: _tintColor,
+  fill = false,
+  sizes,
+  loading: loadingProp,
+  priority,
+  placeholder = "empty",
+  placeholderSrc,
+  fallback,
+  framed,
+  size,
+  compact = false,
+  groupPosition,
+  groupOrientation,
+  decoding = "async",
+  onPress,
+  disabled,
+  width,
+  height,
+  aspectRatio,
+  borderRadius,
   ...props
 }) {
-  const source = sourceProp || src;
-  const [asset] = useAssets(typeof source === "number" ? [source] : []);
-  const imageUriSource = useMemo(() => {
-    if (typeof source === "string") {
-      return {
-        uri: source
-      };
-    }
-    if (typeof source === "number") return asset;
-    return source?.default || source;
-  }, [asset, source]);
-  const resolvedSrc = useMemo(() => {
-    if (typeof source === "string") return source;
-    if (!imageUriSource || Array.isArray(imageUriSource)) return void 0;
-    return imageUriSource.uri;
-  }, [source, imageUriSource]);
-  if (!resolvedSrc && typeof source !== "number") return null;
   const {
+    source,
+    resolvedSrc
+  } = useResolvedImageSource(sourceProp, src);
+  const hasSource = Boolean(resolvedSrc) || typeof source === "number";
+  const thumbnail = size != null && (isThumbnailSize(size) || typeof size === "number");
+  const isFramed = framed ?? thumbnail;
+  const objectFit = objectFitProp ?? (fill || thumbnail ? "cover" : void 0);
+  const loading = priority ? "eager" : loadingProp ?? "lazy";
+  const [status, setStatus] = useState(() => hasSource ? "loading" : "error");
+  useEffect(() => {
+    setStatus(hasSource ? "loading" : "error");
+  }, [hasSource, resolvedSrc]);
+  const handleLoad = useCallback(event => {
+    setStatus("loaded");
+    onLoad?.(event);
+  }, [onLoad]);
+  const handleError = useCallback(error => {
+    setStatus("error");
+    onError?.(error);
+  }, [onError]);
+  if (!hasSource && !isFramed && fallback == null && !fill && size == null) {
+    return null;
+  }
+  return /* @__PURE__ */jsx(ImageFrame, {
+    alt,
+    fill,
+    framed: isFramed,
+    compact,
+    groupPosition,
+    groupOrientation,
+    size,
     width,
     height,
-    aspectRatio
-  } = props;
-  const heightOnly = typeof height !== "undefined" && typeof width === "undefined" && typeof aspectRatio === "undefined";
-  return /* @__PURE__ */jsx(TamaguiImage, {
-    ...props,
-    ...(heightOnly && {
-      width: "auto",
-      alignSelf: "flex-start"
-    }),
-    alt,
-    crossOrigin,
+    aspectRatio,
+    borderRadius,
     objectFit,
-    onError,
-    onLoad,
-    onLoadEnd,
-    onLoadStart,
-    onProgress,
-    referrerPolicy,
-    source: imageUriSource,
-    src: resolvedSrc,
-    srcSet
+    objectPosition,
+    onPress,
+    disabled,
+    hasSource,
+    status,
+    placeholder,
+    placeholderSrc,
+    fallback,
+    ...props,
+    children: hasSource && status !== "error" ? /* @__PURE__ */jsx(TamaguiImage, {
+      alt,
+      crossOrigin,
+      decoding,
+      fetchPriority: priority ? "high" : void 0,
+      loading,
+      objectFit,
+      objectPosition,
+      onError: handleError,
+      onLoad: handleLoad,
+      onLoadEnd,
+      onLoadStart,
+      onProgress,
+      referrerPolicy,
+      sizes,
+      src: resolvedSrc,
+      srcSet,
+      ...mediaFillProps({
+        fill,
+        thumbnail,
+        width,
+        height,
+        aspectRatio,
+        objectFit,
+        objectPosition
+      })
+    }) : null
   });
 }
 export { Image };