@ant-design/react-native/es/toast/ToastContainer.js

基于蚂蚁金服移动设计规范的 React Native 组件库

"use client";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _typeof=require("@babel/runtime/helpers/typeof");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withDefaultProps=require("../_util/with-default-props");var _icon=_interopRequireDefault(require("../icon"));var _style=require("../style");var _style2=_interopRequireDefault(require("./style"));function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||_typeof(obj)!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var defaultProps={duration:3,mask:true,onClose:function onClose(){}};var ToastContainer=function ToastContainer(p){var props=(0,_withDefaultProps.mergeProps)(defaultProps,p);var icon=props.icon,_props$type=props.type,type=_props$type===void 0?'':_props$type,mask=props.mask,duration=props.duration,content=props.content,onAnimationEnd=props.onAnimationEnd,onClose=props.onClose,position=props.position;var anim=_react.default.useRef();var fadeAnim=_react.default.useRef(new _reactNative.Animated.Value(0));(0,_react.useEffect)(function(){if(anim.current){anim.current=null;}var animArr=[_reactNative.Animated.timing(fadeAnim.current,{toValue:1,duration:200,useNativeDriver:true}),_reactNative.Animated.delay(duration*1000)];if(duration>0){animArr.push(_reactNative.Animated.timing(fadeAnim.current,{toValue:0,duration:200,useNativeDriver:true}));}anim.current=_reactNative.Animated.sequence(animArr);anim.current.start(function(){if(duration>0){anim.current=null;if(onAnimationEnd){onAnimationEnd();}}});return function(){if(anim.current){anim.current.stop();anim.current=null;}if(onClose){onClose();}};},[]);var styles=(0,_style.useTheme)({styles:props.styles,themeStyles:_style2.default});var iconDom=(0,_react.useMemo)(function(){var typeTemp=type;if(type==='info'&&typeof icon==='string'){if(['success','fail','offline','loading'].includes(icon)){typeTemp=icon;}}switch(typeTemp){case'loading':return _react.default.createElement(_reactNative.ActivityIndicator,{animating:true,style:[styles.centering],color:"white",size:"large"});case'info':return icon;default:var iconType={success:'check-circle',fail:'close-circle',offline:'frown'};return _react.default.createElement(_icon.default,{name:iconType[type],style:styles.image,color:"white",size:36});}},[icon,styles.centering,styles.image,type]);var positionStyle=(0,_react.useMemo)(function(){switch(position){case'top':return{justifyContent:'flex-start',marginTop:'20%'};case'bottom':return{justifyContent:'flex-end',marginBottom:'20%'};default:return{justifyContent:'center'};}},[position]);return _react.default.createElement(_reactNative.View,{style:[positionStyle,styles.container],pointerEvents:mask?undefined:'box-none'},_react.default.createElement(_reactNative.View,{style:[styles.innerContainer]},_react.default.createElement(_reactNative.Animated.View,{style:{opacity:fadeAnim.current}},_react.default.createElement(_reactNative.View,{style:[styles.innerWrap,iconDom?styles.iconToast:styles.textToast]},iconDom,_react.default.isValidElement(content)?content:_react.default.createElement(_reactNative.Text,{style:styles.content},content)))));};var _default=ToastContainer;exports.default=_default;