@ant-design/react-native/lib/portal/portal-host.js

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

"use strict";"use client";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.portal=exports.PortalContext=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _useClickAway=require("../_util/hooks/useClickAway");var _portalManager=_interopRequireDefault(require("./portal-manager"));function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=(0,_getPrototypeOf2.default)(derived);return(0,_possibleConstructorReturn2.default)(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],(0,_getPrototypeOf2.default)(_this).constructor):derived.apply(_this,args));}var PortalContext=_react.default.createContext(null);exports.PortalContext=PortalContext;var addType='ANT_DESIGN_MOBILE_RN_ADD_PORTAL';var removeType='ANT_DESIGN_MOBILE_RN_REMOVE_PORTAL';var TopViewEventEmitter=_reactNative.DeviceEventEmitter||new _reactNative.NativeEventEmitter();var PortalGuard=(0,_createClass2.default)(function PortalGuard(){var _this=this;(0,_classCallCheck2.default)(this,PortalGuard);this.nextKey=10000;this.add=function(e){var key=_this.nextKey++;TopViewEventEmitter.emit(addType,e,key);return key;};this.remove=function(key){return TopViewEventEmitter.emit(removeType,key);};});var portal=new PortalGuard();exports.portal=portal;var PortalHost=function(_React$Component){function PortalHost(){var _this2;(0,_classCallCheck2.default)(this,PortalHost);_this2=_callSuper(this,PortalHost,arguments);_this2._nextKey=0;_this2._queue=[];_this2._setManager=function(manager){_this2._manager=manager;};_this2._mount=function(children,_key){var key=_key||_this2._nextKey++;if(_this2._manager){_this2._manager.mount(key,children);}else{_this2._queue.push({type:'mount',key:key,children:children});}return key;};_this2._update=function(key,children){if(_this2._manager){_this2._manager.update(key,children);}else{var op={type:'mount',key:key,children:children};var index=_this2._queue.findIndex(function(o){return o.type==='mount'||o.type==='update'&&o.key===key;});if(index>-1){_this2._queue[index]=op;}else{_this2._queue.push(op);}}};_this2._unmount=function(key){if(_this2._manager){_this2._manager.unmount(key);}else{_this2._queue.push({type:'unmount',key:key});}};_this2._onTouchMove=function(){_useClickAway.CustomSyntheticEvent.stopPropagation();};_this2._onTouchEnd=function(event){if(_useClickAway.CustomSyntheticEvent.isPropagationStopped()){_useClickAway.CustomSyntheticEvent.preventDefault();return;}_useClickAway.CustomSyntheticEvent.emit(event);};return _this2;}(0,_inherits2.default)(PortalHost,_React$Component);return(0,_createClass2.default)(PortalHost,[{key:"componentDidMount",value:function componentDidMount(){var manager=this._manager;var queue=this._queue;this._addType=TopViewEventEmitter.addListener(addType,this._mount);this._removeType=TopViewEventEmitter.addListener(removeType,this._unmount);while(queue.length&&manager){var action=queue.pop();if(!action){continue;}switch(action.type){case'mount':manager.mount(action.key,action.children);break;case'update':manager.update(action.key,action.children);break;case'unmount':manager.unmount(action.key);break;}}}},{key:"componentWillUnmount",value:function componentWillUnmount(){this._addType.remove();this._removeType.remove();}},{key:"render",value:function render(){return _react.default.createElement(PortalContext.Provider,{value:{mount:this._mount,update:this._update,unmount:this._unmount}},_react.default.createElement(_reactNative.View,(0,_extends2.default)({style:styles.container,collapsable:false,onTouchEnd:this._onTouchEnd,onTouchMove:this._onTouchMove},this.props)),_react.default.createElement(_portalManager.default,{ref:this._setManager}));}}]);}(_react.default.Component);PortalHost.displayName='Portal.Host';var _default=PortalHost;exports.default=_default;var styles=_reactNative.StyleSheet.create({container:{flex:1,overflow:'scroll'}});