@tamagui/avatar 1.0.1-beta.99 → 1.0.1-rc.0

package/dist/cjs/Avatar.js

@@ -1,38 +1,10 @@
+"use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -45,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var Avatar_exports = {};
 __export(Avatar_exports, {
@@ -57,6 +32,7 @@ __export(Avatar_exports, {
   createAvatarScope: () => createAvatarScope
 });
 module.exports = __toCommonJS(Avatar_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_core = require("@tamagui/core");
 var import_create_context = require("@tamagui/create-context");
 var import_image = require("@tamagui/image");
@@ -67,40 +43,44 @@ const AVATAR_NAME = "Avatar";
 const [createAvatarContext, createAvatarScope] = (0, import_create_context.createContextScope)(AVATAR_NAME);
 const [AvatarProvider, useAvatarContext] = createAvatarContext(AVATAR_NAME);
 const IMAGE_NAME = "AvatarImage";
-const AvatarImage = React.forwardRef((props, forwardedRef) => {
-  var _b;
-  const _a = props, { __scopeAvatar, src, onLoadingStatusChange = () => {
-  } } = _a, imageProps = __objRest(_a, ["__scopeAvatar", "src", "onLoadingStatusChange"]);
-  const context = useAvatarContext(IMAGE_NAME, __scopeAvatar);
-  const [status, setStatus] = React.useState("idle");
-  const extras = (0, import_core.getVariantExtras)(props);
-  const shapeSize = (0, import_core.getVariableValue)((_b = (0, import_shapes.getShapeSize)(context.size, extras)) == null ? void 0 : _b.width);
-  React.useEffect(() => {
-    setStatus("idle");
-  }, [JSON.stringify(src)]);
-  React.useEffect(() => {
-    onLoadingStatusChange(status);
-    context.onImageLoadingStatusChange(status);
-  }, [status]);
-  return /* @__PURE__ */ React.createElement(import_stacks.YStack, {
-    fullscreen: true,
-    zIndex: 1
-  }, /* @__PURE__ */ React.createElement(import_image.Image, __spreadProps(__spreadValues(__spreadValues({
-    fullscreen: true
-  }, typeof shapeSize === "number" && !isNaN(shapeSize) && {
-    width: shapeSize,
-    height: shapeSize
-  }), imageProps), {
-    ref: forwardedRef,
-    src,
-    onError: () => {
-      setStatus("error");
-    },
-    onLoad: () => {
-      setStatus("loaded");
-    }
-  })));
-});
+const AvatarImage = React.forwardRef(
+  (props, forwardedRef) => {
+    var _a;
+    const { __scopeAvatar, src, onLoadingStatusChange = () => {
+    }, ...imageProps } = props;
+    const context = useAvatarContext(IMAGE_NAME, __scopeAvatar);
+    const [status, setStatus] = React.useState("idle");
+    const extras = (0, import_core.getVariantExtras)(props);
+    const shapeSize = (0, import_core.getVariableValue)((_a = (0, import_shapes.getShapeSize)(context.size, extras)) == null ? void 0 : _a.width);
+    React.useEffect(() => {
+      setStatus("idle");
+    }, [JSON.stringify(src)]);
+    React.useEffect(() => {
+      onLoadingStatusChange(status);
+      context.onImageLoadingStatusChange(status);
+    }, [status]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
+      fullscreen: true,
+      zIndex: 1,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.Image, {
+        fullscreen: true,
+        ...typeof shapeSize === "number" && !isNaN(shapeSize) && {
+          width: shapeSize,
+          height: shapeSize
+        },
+        ...imageProps,
+        ref: forwardedRef,
+        src,
+        onError: () => {
+          setStatus("error");
+        },
+        onLoad: () => {
+          setStatus("loaded");
+        }
+      })
+    });
+  }
+);
 AvatarImage.displayName = IMAGE_NAME;
 const FALLBACK_NAME = "AvatarFallback";
 const AvatarFallbackFrame = (0, import_core.styled)(import_stacks.YStack, {
@@ -109,43 +89,52 @@ const AvatarFallbackFrame = (0, import_core.styled)(import_stacks.YStack, {
   fullscreen: true,
   zIndex: 0
 });
-const AvatarFallback = AvatarFallbackFrame.extractable(React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopeAvatar, delayMs } = _a, fallbackProps = __objRest(_a, ["__scopeAvatar", "delayMs"]);
-  const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar);
-  const [canRender, setCanRender] = React.useState(delayMs === void 0);
-  React.useEffect(() => {
-    if (delayMs !== void 0) {
-      const timerId = setTimeout(() => setCanRender(true), delayMs);
-      return () => clearTimeout(timerId);
+const AvatarFallback = AvatarFallbackFrame.extractable(
+  React.forwardRef(
+    (props, forwardedRef) => {
+      const { __scopeAvatar, delayMs, ...fallbackProps } = props;
+      const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar);
+      const [canRender, setCanRender] = React.useState(delayMs === void 0);
+      React.useEffect(() => {
+        if (delayMs !== void 0) {
+          const timerId = setTimeout(() => setCanRender(true), delayMs);
+          return () => clearTimeout(timerId);
+        }
+      }, [delayMs]);
+      return canRender && context.imageLoadingStatus !== "loaded" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AvatarFallbackFrame, {
+        ...fallbackProps,
+        ref: forwardedRef
+      }) : null;
     }
-  }, [delayMs]);
-  return canRender && context.imageLoadingStatus !== "loaded" ? /* @__PURE__ */ React.createElement(AvatarFallbackFrame, __spreadProps(__spreadValues({}, fallbackProps), {
-    ref: forwardedRef
-  })) : null;
-}));
+  )
+);
 AvatarFallback.displayName = FALLBACK_NAME;
 const AvatarFrame = (0, import_core.styled)(import_shapes.Square, {
   name: AVATAR_NAME,
   position: "relative",
   overflow: "hidden"
 });
-const Avatar = (0, import_core.withStaticProperties)(React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopeAvatar, size = "$4" } = _a, avatarProps = __objRest(_a, ["__scopeAvatar", "size"]);
-  const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
-  return /* @__PURE__ */ React.createElement(AvatarProvider, {
-    size,
-    scope: __scopeAvatar,
-    imageLoadingStatus,
-    onImageLoadingStatusChange: setImageLoadingStatus
-  }, /* @__PURE__ */ React.createElement(AvatarFrame, __spreadProps(__spreadValues({
-    size
-  }, avatarProps), {
-    ref: forwardedRef
-  })));
-}), {
-  Image: AvatarImage,
-  Fallback: AvatarFallback
-});
+const Avatar = (0, import_core.withStaticProperties)(
+  React.forwardRef((props, forwardedRef) => {
+    const { __scopeAvatar, size = "$4", ...avatarProps } = props;
+    const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AvatarProvider, {
+      size,
+      scope: __scopeAvatar,
+      imageLoadingStatus,
+      onImageLoadingStatusChange: setImageLoadingStatus,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AvatarFrame, {
+        size,
+        ...avatarProps,
+        ref: forwardedRef
+      })
+    });
+  }),
+  {
+    Image: AvatarImage,
+    Fallback: AvatarFallback
+  }
+);
 Avatar.displayName = AVATAR_NAME;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/Avatar.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/Avatar.tsx"],
   "sourcesContent": ["// forked from radix https://github.com/radix-ui/primitives/blob/main/packages/react/avatar/src/Avatar.tsx\n\nimport {\n  GetProps,\n  SizeTokens,\n  TamaguiElement,\n  getVariableValue,\n  getVariantExtras,\n  styled,\n  withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { Image, ImageProps } from '@tamagui/image'\nimport { Square, getShapeSize } from '@tamagui/shapes'\nimport { YStack } from '@tamagui/stacks'\nimport * as React from 'react'\n\nconst AVATAR_NAME = 'Avatar'\n\ntype ScopedProps<P> = P & { __scopeAvatar?: Scope }\nconst [createAvatarContext, createAvatarScope] = createContextScope(AVATAR_NAME)\n\ntype ImageLoadingStatus = 'idle' | 'loading' | 'loaded' | 'error'\n\ntype AvatarContextValue = {\n  size: SizeTokens\n  imageLoadingStatus: ImageLoadingStatus\n  onImageLoadingStatusChange(status: ImageLoadingStatus): void\n}\n\nconst [AvatarProvider, useAvatarContext] = createAvatarContext<AvatarContextValue>(AVATAR_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * AvatarImage\n * -----------------------------------------------------------------------------------------------*/\n\nconst IMAGE_NAME = 'AvatarImage'\n\ntype AvatarImageProps = Partial<ImageProps> & {\n  onLoadingStatusChange?: (status: ImageLoadingStatus) => void\n}\n\nconst AvatarImage = React.forwardRef<TamaguiElement, AvatarImageProps>(\n  (props: ScopedProps<AvatarImageProps>, forwardedRef) => {\n    const { __scopeAvatar, src, onLoadingStatusChange = () => {}, ...imageProps } = props\n    const context = useAvatarContext(IMAGE_NAME, __scopeAvatar)\n    const [status, setStatus] = React.useState<ImageLoadingStatus>('idle')\n    const extras = getVariantExtras(props)\n    const shapeSize = getVariableValue(getShapeSize(context.size, extras)?.width) as number\n\n    React.useEffect(() => {\n      setStatus('idle')\n    }, [JSON.stringify(src)])\n\n    React.useEffect(() => {\n      onLoadingStatusChange(status)\n      context.onImageLoadingStatusChange(status)\n    }, [status])\n\n    return (\n      <YStack fullscreen zIndex={1}>\n        <Image\n          fullscreen\n          {...(typeof shapeSize === 'number' &&\n            !isNaN(shapeSize) && {\n              width: shapeSize,\n              height: shapeSize,\n            })}\n          {...imageProps}\n          // @ts-ignore\n          ref={forwardedRef}\n          // @ts-ignore\n          src={src}\n          // onLoadStart={() => {\n          //   // setStatus('loading')\n          // }}\n          onError={() => {\n            setStatus('error')\n          }}\n          onLoad={() => {\n            setStatus('loaded')\n          }}\n        />\n      </YStack>\n    )\n  }\n)\n\nAvatarImage.displayName = IMAGE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * AvatarFallback\n * -----------------------------------------------------------------------------------------------*/\n\nconst FALLBACK_NAME = 'AvatarFallback'\n\nexport const AvatarFallbackFrame = styled(YStack, {\n  name: FALLBACK_NAME,\n  position: 'absolute',\n  fullscreen: true,\n  zIndex: 0,\n})\n\ntype AvatarFallbackProps = GetProps<typeof AvatarFallbackFrame> & {\n  delayMs?: number\n}\n\nconst AvatarFallback = AvatarFallbackFrame.extractable(\n  React.forwardRef<TamaguiElement, AvatarFallbackProps>(\n    (props: ScopedProps<AvatarFallbackProps>, forwardedRef) => {\n      const { __scopeAvatar, delayMs, ...fallbackProps } = props\n      const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar)\n      const [canRender, setCanRender] = React.useState(delayMs === undefined)\n\n      React.useEffect(() => {\n        if (delayMs !== undefined) {\n          const timerId = setTimeout(() => setCanRender(true), delayMs)\n          return () => clearTimeout(timerId)\n        }\n      }, [delayMs])\n\n      return canRender && context.imageLoadingStatus !== 'loaded' ? (\n        <AvatarFallbackFrame {...fallbackProps} ref={forwardedRef} />\n      ) : null\n    }\n  )\n)\n\nAvatarFallback.displayName = FALLBACK_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Avatar\n * -----------------------------------------------------------------------------------------------*/\n\nexport const AvatarFrame = styled(Square, {\n  name: AVATAR_NAME,\n  position: 'relative',\n  overflow: 'hidden',\n})\n\ntype AvatarProps = GetProps<typeof AvatarFrame>\n\nconst Avatar = withStaticProperties(\n  React.forwardRef<TamaguiElement, AvatarProps>((props: ScopedProps<AvatarProps>, forwardedRef) => {\n    const { __scopeAvatar, size = '$4', ...avatarProps } = props\n    const [imageLoadingStatus, setImageLoadingStatus] = React.useState<ImageLoadingStatus>('idle')\n    return (\n      <AvatarProvider\n        size={size}\n        scope={__scopeAvatar}\n        imageLoadingStatus={imageLoadingStatus}\n        onImageLoadingStatusChange={setImageLoadingStatus}\n      >\n        <AvatarFrame size={size} {...avatarProps} ref={forwardedRef} />\n      </AvatarProvider>\n    )\n  }),\n  {\n    Image: AvatarImage,\n    Fallback: AvatarFallback,\n  }\n)\n\nAvatar.displayName = AVATAR_NAME\n\nexport { createAvatarScope, Avatar, AvatarImage, AvatarFallback }\nexport type { AvatarProps, AvatarImageProps, AvatarFallbackProps }\n"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/index.js

@@ -1,3 +1,4 @@
+"use strict";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;

package/dist/cjs/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/index.ts"],
   "sourcesContent": ["export * from './Avatar'\n"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,qBAAd;",
+  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,qBAAd;",
   "names": []
 }

package/dist/esm/Avatar.js

@@ -1,34 +1,4 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
+import { jsx } from "react/jsx-runtime";
 import {
   getVariableValue,
   getVariantExtras,
@@ -44,40 +14,44 @@ const AVATAR_NAME = "Avatar";
 const [createAvatarContext, createAvatarScope] = createContextScope(AVATAR_NAME);
 const [AvatarProvider, useAvatarContext] = createAvatarContext(AVATAR_NAME);
 const IMAGE_NAME = "AvatarImage";
-const AvatarImage = React.forwardRef((props, forwardedRef) => {
-  var _b;
-  const _a = props, { __scopeAvatar, src, onLoadingStatusChange = () => {
-  } } = _a, imageProps = __objRest(_a, ["__scopeAvatar", "src", "onLoadingStatusChange"]);
-  const context = useAvatarContext(IMAGE_NAME, __scopeAvatar);
-  const [status, setStatus] = React.useState("idle");
-  const extras = getVariantExtras(props);
-  const shapeSize = getVariableValue((_b = getShapeSize(context.size, extras)) == null ? void 0 : _b.width);
-  React.useEffect(() => {
-    setStatus("idle");
-  }, [JSON.stringify(src)]);
-  React.useEffect(() => {
-    onLoadingStatusChange(status);
-    context.onImageLoadingStatusChange(status);
-  }, [status]);
-  return /* @__PURE__ */ React.createElement(YStack, {
-    fullscreen: true,
-    zIndex: 1
-  }, /* @__PURE__ */ React.createElement(Image, __spreadProps(__spreadValues(__spreadValues({
-    fullscreen: true
-  }, typeof shapeSize === "number" && !isNaN(shapeSize) && {
-    width: shapeSize,
-    height: shapeSize
-  }), imageProps), {
-    ref: forwardedRef,
-    src,
-    onError: () => {
-      setStatus("error");
-    },
-    onLoad: () => {
-      setStatus("loaded");
-    }
-  })));
-});
+const AvatarImage = React.forwardRef(
+  (props, forwardedRef) => {
+    var _a;
+    const { __scopeAvatar, src, onLoadingStatusChange = () => {
+    }, ...imageProps } = props;
+    const context = useAvatarContext(IMAGE_NAME, __scopeAvatar);
+    const [status, setStatus] = React.useState("idle");
+    const extras = getVariantExtras(props);
+    const shapeSize = getVariableValue((_a = getShapeSize(context.size, extras)) == null ? void 0 : _a.width);
+    React.useEffect(() => {
+      setStatus("idle");
+    }, [JSON.stringify(src)]);
+    React.useEffect(() => {
+      onLoadingStatusChange(status);
+      context.onImageLoadingStatusChange(status);
+    }, [status]);
+    return /* @__PURE__ */ jsx(YStack, {
+      fullscreen: true,
+      zIndex: 1,
+      children: /* @__PURE__ */ jsx(Image, {
+        fullscreen: true,
+        ...typeof shapeSize === "number" && !isNaN(shapeSize) && {
+          width: shapeSize,
+          height: shapeSize
+        },
+        ...imageProps,
+        ref: forwardedRef,
+        src,
+        onError: () => {
+          setStatus("error");
+        },
+        onLoad: () => {
+          setStatus("loaded");
+        }
+      })
+    });
+  }
+);
 AvatarImage.displayName = IMAGE_NAME;
 const FALLBACK_NAME = "AvatarFallback";
 const AvatarFallbackFrame = styled(YStack, {
@@ -86,43 +60,52 @@ const AvatarFallbackFrame = styled(YStack, {
   fullscreen: true,
   zIndex: 0
 });
-const AvatarFallback = AvatarFallbackFrame.extractable(React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopeAvatar, delayMs } = _a, fallbackProps = __objRest(_a, ["__scopeAvatar", "delayMs"]);
-  const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar);
-  const [canRender, setCanRender] = React.useState(delayMs === void 0);
-  React.useEffect(() => {
-    if (delayMs !== void 0) {
-      const timerId = setTimeout(() => setCanRender(true), delayMs);
-      return () => clearTimeout(timerId);
+const AvatarFallback = AvatarFallbackFrame.extractable(
+  React.forwardRef(
+    (props, forwardedRef) => {
+      const { __scopeAvatar, delayMs, ...fallbackProps } = props;
+      const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar);
+      const [canRender, setCanRender] = React.useState(delayMs === void 0);
+      React.useEffect(() => {
+        if (delayMs !== void 0) {
+          const timerId = setTimeout(() => setCanRender(true), delayMs);
+          return () => clearTimeout(timerId);
+        }
+      }, [delayMs]);
+      return canRender && context.imageLoadingStatus !== "loaded" ? /* @__PURE__ */ jsx(AvatarFallbackFrame, {
+        ...fallbackProps,
+        ref: forwardedRef
+      }) : null;
     }
-  }, [delayMs]);
-  return canRender && context.imageLoadingStatus !== "loaded" ? /* @__PURE__ */ React.createElement(AvatarFallbackFrame, __spreadProps(__spreadValues({}, fallbackProps), {
-    ref: forwardedRef
-  })) : null;
-}));
+  )
+);
 AvatarFallback.displayName = FALLBACK_NAME;
 const AvatarFrame = styled(Square, {
   name: AVATAR_NAME,
   position: "relative",
   overflow: "hidden"
 });
-const Avatar = withStaticProperties(React.forwardRef((props, forwardedRef) => {
-  const _a = props, { __scopeAvatar, size = "$4" } = _a, avatarProps = __objRest(_a, ["__scopeAvatar", "size"]);
-  const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
-  return /* @__PURE__ */ React.createElement(AvatarProvider, {
-    size,
-    scope: __scopeAvatar,
-    imageLoadingStatus,
-    onImageLoadingStatusChange: setImageLoadingStatus
-  }, /* @__PURE__ */ React.createElement(AvatarFrame, __spreadProps(__spreadValues({
-    size
-  }, avatarProps), {
-    ref: forwardedRef
-  })));
-}), {
-  Image: AvatarImage,
-  Fallback: AvatarFallback
-});
+const Avatar = withStaticProperties(
+  React.forwardRef((props, forwardedRef) => {
+    const { __scopeAvatar, size = "$4", ...avatarProps } = props;
+    const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
+    return /* @__PURE__ */ jsx(AvatarProvider, {
+      size,
+      scope: __scopeAvatar,
+      imageLoadingStatus,
+      onImageLoadingStatusChange: setImageLoadingStatus,
+      children: /* @__PURE__ */ jsx(AvatarFrame, {
+        size,
+        ...avatarProps,
+        ref: forwardedRef
+      })
+    });
+  }),
+  {
+    Image: AvatarImage,
+    Fallback: AvatarFallback
+  }
+);
 Avatar.displayName = AVATAR_NAME;
 export {
   Avatar,

package/dist/esm/Avatar.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/Avatar.tsx"],
   "sourcesContent": ["// forked from radix https://github.com/radix-ui/primitives/blob/main/packages/react/avatar/src/Avatar.tsx\n\nimport {\n  GetProps,\n  SizeTokens,\n  TamaguiElement,\n  getVariableValue,\n  getVariantExtras,\n  styled,\n  withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { Image, ImageProps } from '@tamagui/image'\nimport { Square, getShapeSize } from '@tamagui/shapes'\nimport { YStack } from '@tamagui/stacks'\nimport * as React from 'react'\n\nconst AVATAR_NAME = 'Avatar'\n\ntype ScopedProps<P> = P & { __scopeAvatar?: Scope }\nconst [createAvatarContext, createAvatarScope] = createContextScope(AVATAR_NAME)\n\ntype ImageLoadingStatus = 'idle' | 'loading' | 'loaded' | 'error'\n\ntype AvatarContextValue = {\n  size: SizeTokens\n  imageLoadingStatus: ImageLoadingStatus\n  onImageLoadingStatusChange(status: ImageLoadingStatus): void\n}\n\nconst [AvatarProvider, useAvatarContext] = createAvatarContext<AvatarContextValue>(AVATAR_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * AvatarImage\n * -----------------------------------------------------------------------------------------------*/\n\nconst IMAGE_NAME = 'AvatarImage'\n\ntype AvatarImageProps = Partial<ImageProps> & {\n  onLoadingStatusChange?: (status: ImageLoadingStatus) => void\n}\n\nconst AvatarImage = React.forwardRef<TamaguiElement, AvatarImageProps>(\n  (props: ScopedProps<AvatarImageProps>, forwardedRef) => {\n    const { __scopeAvatar, src, onLoadingStatusChange = () => {}, ...imageProps } = props\n    const context = useAvatarContext(IMAGE_NAME, __scopeAvatar)\n    const [status, setStatus] = React.useState<ImageLoadingStatus>('idle')\n    const extras = getVariantExtras(props)\n    const shapeSize = getVariableValue(getShapeSize(context.size, extras)?.width) as number\n\n    React.useEffect(() => {\n      setStatus('idle')\n    }, [JSON.stringify(src)])\n\n    React.useEffect(() => {\n      onLoadingStatusChange(status)\n      context.onImageLoadingStatusChange(status)\n    }, [status])\n\n    return (\n      <YStack fullscreen zIndex={1}>\n        <Image\n          fullscreen\n          {...(typeof shapeSize === 'number' &&\n            !isNaN(shapeSize) && {\n              width: shapeSize,\n              height: shapeSize,\n            })}\n          {...imageProps}\n          // @ts-ignore\n          ref={forwardedRef}\n          // @ts-ignore\n          src={src}\n          // onLoadStart={() => {\n          //   // setStatus('loading')\n          // }}\n          onError={() => {\n            setStatus('error')\n          }}\n          onLoad={() => {\n            setStatus('loaded')\n          }}\n        />\n      </YStack>\n    )\n  }\n)\n\nAvatarImage.displayName = IMAGE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * AvatarFallback\n * -----------------------------------------------------------------------------------------------*/\n\nconst FALLBACK_NAME = 'AvatarFallback'\n\nexport const AvatarFallbackFrame = styled(YStack, {\n  name: FALLBACK_NAME,\n  position: 'absolute',\n  fullscreen: true,\n  zIndex: 0,\n})\n\ntype AvatarFallbackProps = GetProps<typeof AvatarFallbackFrame> & {\n  delayMs?: number\n}\n\nconst AvatarFallback = AvatarFallbackFrame.extractable(\n  React.forwardRef<TamaguiElement, AvatarFallbackProps>(\n    (props: ScopedProps<AvatarFallbackProps>, forwardedRef) => {\n      const { __scopeAvatar, delayMs, ...fallbackProps } = props\n      const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar)\n      const [canRender, setCanRender] = React.useState(delayMs === undefined)\n\n      React.useEffect(() => {\n        if (delayMs !== undefined) {\n          const timerId = setTimeout(() => setCanRender(true), delayMs)\n          return () => clearTimeout(timerId)\n        }\n      }, [delayMs])\n\n      return canRender && context.imageLoadingStatus !== 'loaded' ? (\n        <AvatarFallbackFrame {...fallbackProps} ref={forwardedRef} />\n      ) : null\n    }\n  )\n)\n\nAvatarFallback.displayName = FALLBACK_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Avatar\n * -----------------------------------------------------------------------------------------------*/\n\nexport const AvatarFrame = styled(Square, {\n  name: AVATAR_NAME,\n  position: 'relative',\n  overflow: 'hidden',\n})\n\ntype AvatarProps = GetProps<typeof AvatarFrame>\n\nconst Avatar = withStaticProperties(\n  React.forwardRef<TamaguiElement, AvatarProps>((props: ScopedProps<AvatarProps>, forwardedRef) => {\n    const { __scopeAvatar, size = '$4', ...avatarProps } = props\n    const [imageLoadingStatus, setImageLoadingStatus] = React.useState<ImageLoadingStatus>('idle')\n    return (\n      <AvatarProvider\n        size={size}\n        scope={__scopeAvatar}\n        imageLoadingStatus={imageLoadingStatus}\n        onImageLoadingStatusChange={setImageLoadingStatus}\n      >\n        <AvatarFrame size={size} {...avatarProps} ref={forwardedRef} />\n      </AvatarProvider>\n    )\n  }),\n  {\n    Image: AvatarImage,\n    Fallback: AvatarFallback,\n  }\n)\n\nAvatar.displayName = AVATAR_NAME\n\nexport { createAvatarScope, Avatar, AvatarImage, AvatarFallback }\nexport type { AvatarProps, AvatarImageProps, AvatarFallbackProps }\n"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/dist/esm/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/index.ts"],
   "sourcesContent": ["export * from './Avatar'\n"],
-  "mappings": "AAAA;",
+  "mappings": "AAAA,cAAc;",
   "names": []
 }

package/dist/jsx/Avatar.js

@@ -13,30 +13,31 @@ const AVATAR_NAME = "Avatar";
 const [createAvatarContext, createAvatarScope] = createContextScope(AVATAR_NAME);
 const [AvatarProvider, useAvatarContext] = createAvatarContext(AVATAR_NAME);
 const IMAGE_NAME = "AvatarImage";
-const AvatarImage = React.forwardRef((props, forwardedRef) => {
-  var _a;
-  const { __scopeAvatar, src, onLoadingStatusChange = () => {
-  }, ...imageProps } = props;
-  const context = useAvatarContext(IMAGE_NAME, __scopeAvatar);
-  const [status, setStatus] = React.useState("idle");
-  const extras = getVariantExtras(props);
-  const shapeSize = getVariableValue((_a = getShapeSize(context.size, extras)) == null ? void 0 : _a.width);
-  React.useEffect(() => {
-    setStatus("idle");
-  }, [JSON.stringify(src)]);
-  React.useEffect(() => {
-    onLoadingStatusChange(status);
-    context.onImageLoadingStatusChange(status);
-  }, [status]);
-  return <YStack fullscreen zIndex={1}><Image fullscreen {...typeof shapeSize === "number" && !isNaN(shapeSize) && {
-    width: shapeSize,
-    height: shapeSize
-  }} {...imageProps} ref={forwardedRef} src={src} onError={() => {
-    setStatus("error");
-  }} onLoad={() => {
-    setStatus("loaded");
-  }} /></YStack>;
-});
+const AvatarImage = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeAvatar, src, onLoadingStatusChange = () => {
+    }, ...imageProps } = props;
+    const context = useAvatarContext(IMAGE_NAME, __scopeAvatar);
+    const [status, setStatus] = React.useState("idle");
+    const extras = getVariantExtras(props);
+    const shapeSize = getVariableValue(getShapeSize(context.size, extras)?.width);
+    React.useEffect(() => {
+      setStatus("idle");
+    }, [JSON.stringify(src)]);
+    React.useEffect(() => {
+      onLoadingStatusChange(status);
+      context.onImageLoadingStatusChange(status);
+    }, [status]);
+    return <YStack fullscreen zIndex={1}><Image fullscreen {...typeof shapeSize === "number" && !isNaN(shapeSize) && {
+      width: shapeSize,
+      height: shapeSize
+    }} {...imageProps} ref={forwardedRef} src={src} onError={() => {
+      setStatus("error");
+    }} onLoad={() => {
+      setStatus("loaded");
+    }} /></YStack>;
+  }
+);
 AvatarImage.displayName = IMAGE_NAME;
 const FALLBACK_NAME = "AvatarFallback";
 const AvatarFallbackFrame = styled(YStack, {
@@ -45,32 +46,39 @@ const AvatarFallbackFrame = styled(YStack, {
   fullscreen: true,
   zIndex: 0
 });
-const AvatarFallback = AvatarFallbackFrame.extractable(React.forwardRef((props, forwardedRef) => {
-  const { __scopeAvatar, delayMs, ...fallbackProps } = props;
-  const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar);
-  const [canRender, setCanRender] = React.useState(delayMs === void 0);
-  React.useEffect(() => {
-    if (delayMs !== void 0) {
-      const timerId = setTimeout(() => setCanRender(true), delayMs);
-      return () => clearTimeout(timerId);
+const AvatarFallback = AvatarFallbackFrame.extractable(
+  React.forwardRef(
+    (props, forwardedRef) => {
+      const { __scopeAvatar, delayMs, ...fallbackProps } = props;
+      const context = useAvatarContext(FALLBACK_NAME, __scopeAvatar);
+      const [canRender, setCanRender] = React.useState(delayMs === void 0);
+      React.useEffect(() => {
+        if (delayMs !== void 0) {
+          const timerId = setTimeout(() => setCanRender(true), delayMs);
+          return () => clearTimeout(timerId);
+        }
+      }, [delayMs]);
+      return canRender && context.imageLoadingStatus !== "loaded" ? <AvatarFallbackFrame {...fallbackProps} ref={forwardedRef} /> : null;
     }
-  }, [delayMs]);
-  return canRender && context.imageLoadingStatus !== "loaded" ? <AvatarFallbackFrame {...fallbackProps} ref={forwardedRef} /> : null;
-}));
+  )
+);
 AvatarFallback.displayName = FALLBACK_NAME;
 const AvatarFrame = styled(Square, {
   name: AVATAR_NAME,
   position: "relative",
   overflow: "hidden"
 });
-const Avatar = withStaticProperties(React.forwardRef((props, forwardedRef) => {
-  const { __scopeAvatar, size = "$4", ...avatarProps } = props;
-  const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
-  return <AvatarProvider size={size} scope={__scopeAvatar} imageLoadingStatus={imageLoadingStatus} onImageLoadingStatusChange={setImageLoadingStatus}><AvatarFrame size={size} {...avatarProps} ref={forwardedRef} /></AvatarProvider>;
-}), {
-  Image: AvatarImage,
-  Fallback: AvatarFallback
-});
+const Avatar = withStaticProperties(
+  React.forwardRef((props, forwardedRef) => {
+    const { __scopeAvatar, size = "$4", ...avatarProps } = props;
+    const [imageLoadingStatus, setImageLoadingStatus] = React.useState("idle");
+    return <AvatarProvider size={size} scope={__scopeAvatar} imageLoadingStatus={imageLoadingStatus} onImageLoadingStatusChange={setImageLoadingStatus}><AvatarFrame size={size} {...avatarProps} ref={forwardedRef} /></AvatarProvider>;
+  }),
+  {
+    Image: AvatarImage,
+    Fallback: AvatarFallback
+  }
+);
 Avatar.displayName = AVATAR_NAME;
 export {
   Avatar,