130 lines
6.7 KiB
JavaScript
130 lines
6.7 KiB
JavaScript
var $6FDFN$babelruntimehelpersextends = require("@babel/runtime/helpers/extends");
|
|
var $6FDFN$react = require("react");
|
|
var $6FDFN$radixuireactcontext = require("@radix-ui/react-context");
|
|
var $6FDFN$radixuireactusecallbackref = require("@radix-ui/react-use-callback-ref");
|
|
var $6FDFN$radixuireactuselayouteffect = require("@radix-ui/react-use-layout-effect");
|
|
var $6FDFN$radixuireactprimitive = require("@radix-ui/react-primitive");
|
|
|
|
function $parcel$export(e, n, v, s) {
|
|
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
}
|
|
function $parcel$interopDefault(a) {
|
|
return a && a.__esModule ? a.default : a;
|
|
}
|
|
|
|
$parcel$export(module.exports, "createAvatarScope", () => $94437fed6c1d6d8a$export$90370d16b488820f);
|
|
$parcel$export(module.exports, "Avatar", () => $94437fed6c1d6d8a$export$e2255cf6045e8d47);
|
|
$parcel$export(module.exports, "AvatarImage", () => $94437fed6c1d6d8a$export$2cd8ae1985206fe8);
|
|
$parcel$export(module.exports, "AvatarFallback", () => $94437fed6c1d6d8a$export$69fffb6a9571fbfe);
|
|
$parcel$export(module.exports, "Root", () => $94437fed6c1d6d8a$export$be92b6f5f03c0fe9);
|
|
$parcel$export(module.exports, "Image", () => $94437fed6c1d6d8a$export$3e431a229df88919);
|
|
$parcel$export(module.exports, "Fallback", () => $94437fed6c1d6d8a$export$fb8d7f40caaeea67);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* -------------------------------------------------------------------------------------------------
|
|
* Avatar
|
|
* -----------------------------------------------------------------------------------------------*/ const $94437fed6c1d6d8a$var$AVATAR_NAME = 'Avatar';
|
|
const [$94437fed6c1d6d8a$var$createAvatarContext, $94437fed6c1d6d8a$export$90370d16b488820f] = $6FDFN$radixuireactcontext.createContextScope($94437fed6c1d6d8a$var$AVATAR_NAME);
|
|
const [$94437fed6c1d6d8a$var$AvatarProvider, $94437fed6c1d6d8a$var$useAvatarContext] = $94437fed6c1d6d8a$var$createAvatarContext($94437fed6c1d6d8a$var$AVATAR_NAME);
|
|
const $94437fed6c1d6d8a$export$e2255cf6045e8d47 = /*#__PURE__*/ $6FDFN$react.forwardRef((props, forwardedRef)=>{
|
|
const { __scopeAvatar: __scopeAvatar , ...avatarProps } = props;
|
|
const [imageLoadingStatus, setImageLoadingStatus] = $6FDFN$react.useState('idle');
|
|
return /*#__PURE__*/ $6FDFN$react.createElement($94437fed6c1d6d8a$var$AvatarProvider, {
|
|
scope: __scopeAvatar,
|
|
imageLoadingStatus: imageLoadingStatus,
|
|
onImageLoadingStatusChange: setImageLoadingStatus
|
|
}, /*#__PURE__*/ $6FDFN$react.createElement($6FDFN$radixuireactprimitive.Primitive.span, ($parcel$interopDefault($6FDFN$babelruntimehelpersextends))({}, avatarProps, {
|
|
ref: forwardedRef
|
|
})));
|
|
});
|
|
/*#__PURE__*/ Object.assign($94437fed6c1d6d8a$export$e2255cf6045e8d47, {
|
|
displayName: $94437fed6c1d6d8a$var$AVATAR_NAME
|
|
});
|
|
/* -------------------------------------------------------------------------------------------------
|
|
* AvatarImage
|
|
* -----------------------------------------------------------------------------------------------*/ const $94437fed6c1d6d8a$var$IMAGE_NAME = 'AvatarImage';
|
|
const $94437fed6c1d6d8a$export$2cd8ae1985206fe8 = /*#__PURE__*/ $6FDFN$react.forwardRef((props, forwardedRef)=>{
|
|
const { __scopeAvatar: __scopeAvatar , src: src , onLoadingStatusChange: onLoadingStatusChange = ()=>{} , ...imageProps } = props;
|
|
const context = $94437fed6c1d6d8a$var$useAvatarContext($94437fed6c1d6d8a$var$IMAGE_NAME, __scopeAvatar);
|
|
const imageLoadingStatus = $94437fed6c1d6d8a$var$useImageLoadingStatus(src);
|
|
const handleLoadingStatusChange = $6FDFN$radixuireactusecallbackref.useCallbackRef((status)=>{
|
|
onLoadingStatusChange(status);
|
|
context.onImageLoadingStatusChange(status);
|
|
});
|
|
$6FDFN$radixuireactuselayouteffect.useLayoutEffect(()=>{
|
|
if (imageLoadingStatus !== 'idle') handleLoadingStatusChange(imageLoadingStatus);
|
|
}, [
|
|
imageLoadingStatus,
|
|
handleLoadingStatusChange
|
|
]);
|
|
return imageLoadingStatus === 'loaded' ? /*#__PURE__*/ $6FDFN$react.createElement($6FDFN$radixuireactprimitive.Primitive.img, ($parcel$interopDefault($6FDFN$babelruntimehelpersextends))({}, imageProps, {
|
|
ref: forwardedRef,
|
|
src: src
|
|
})) : null;
|
|
});
|
|
/*#__PURE__*/ Object.assign($94437fed6c1d6d8a$export$2cd8ae1985206fe8, {
|
|
displayName: $94437fed6c1d6d8a$var$IMAGE_NAME
|
|
});
|
|
/* -------------------------------------------------------------------------------------------------
|
|
* AvatarFallback
|
|
* -----------------------------------------------------------------------------------------------*/ const $94437fed6c1d6d8a$var$FALLBACK_NAME = 'AvatarFallback';
|
|
const $94437fed6c1d6d8a$export$69fffb6a9571fbfe = /*#__PURE__*/ $6FDFN$react.forwardRef((props, forwardedRef)=>{
|
|
const { __scopeAvatar: __scopeAvatar , delayMs: delayMs , ...fallbackProps } = props;
|
|
const context = $94437fed6c1d6d8a$var$useAvatarContext($94437fed6c1d6d8a$var$FALLBACK_NAME, __scopeAvatar);
|
|
const [canRender, setCanRender] = $6FDFN$react.useState(delayMs === undefined);
|
|
$6FDFN$react.useEffect(()=>{
|
|
if (delayMs !== undefined) {
|
|
const timerId = window.setTimeout(()=>setCanRender(true)
|
|
, delayMs);
|
|
return ()=>window.clearTimeout(timerId)
|
|
;
|
|
}
|
|
}, [
|
|
delayMs
|
|
]);
|
|
return canRender && context.imageLoadingStatus !== 'loaded' ? /*#__PURE__*/ $6FDFN$react.createElement($6FDFN$radixuireactprimitive.Primitive.span, ($parcel$interopDefault($6FDFN$babelruntimehelpersextends))({}, fallbackProps, {
|
|
ref: forwardedRef
|
|
})) : null;
|
|
});
|
|
/*#__PURE__*/ Object.assign($94437fed6c1d6d8a$export$69fffb6a9571fbfe, {
|
|
displayName: $94437fed6c1d6d8a$var$FALLBACK_NAME
|
|
});
|
|
/* -----------------------------------------------------------------------------------------------*/ function $94437fed6c1d6d8a$var$useImageLoadingStatus(src) {
|
|
const [loadingStatus, setLoadingStatus] = $6FDFN$react.useState('idle');
|
|
$6FDFN$radixuireactuselayouteffect.useLayoutEffect(()=>{
|
|
if (!src) {
|
|
setLoadingStatus('error');
|
|
return;
|
|
}
|
|
let isMounted = true;
|
|
const image = new window.Image();
|
|
const updateStatus = (status)=>()=>{
|
|
if (!isMounted) return;
|
|
setLoadingStatus(status);
|
|
}
|
|
;
|
|
setLoadingStatus('loading');
|
|
image.onload = updateStatus('loaded');
|
|
image.onerror = updateStatus('error');
|
|
image.src = src;
|
|
return ()=>{
|
|
isMounted = false;
|
|
};
|
|
}, [
|
|
src
|
|
]);
|
|
return loadingStatus;
|
|
}
|
|
const $94437fed6c1d6d8a$export$be92b6f5f03c0fe9 = $94437fed6c1d6d8a$export$e2255cf6045e8d47;
|
|
const $94437fed6c1d6d8a$export$3e431a229df88919 = $94437fed6c1d6d8a$export$2cd8ae1985206fe8;
|
|
const $94437fed6c1d6d8a$export$fb8d7f40caaeea67 = $94437fed6c1d6d8a$export$69fffb6a9571fbfe;
|
|
|
|
|
|
|
|
|
|
//# sourceMappingURL=index.js.map
|