rn-pendo-sdk/lib/pendoModal.js

Pendo Mobile React Native SDK

var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.WithPendoModal=WithPendoModal;var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));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 _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _common=require("./common");var _fiberTypes=require("./fiber-types");var _pendoLogger=require("./pendoLogger");var _pendoTypes=require("./pendoTypes");var _excluded=["visible","children"],_excluded2=["onChange","children"],_excluded3=["onOpen","onClose","children"],_excluded4=["children"],_excluded5=["children","forwardedRef"];function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap(),n=new WeakMap();return(_interopRequireWildcard=function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f);}for(var _t in e)"default"!==_t&&{}.hasOwnProperty.call(e,_t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,_t))&&(i.get||i.set)?o(f,_t,i):f[_t]=e[_t]);return f;})(e,t);}function _callSuper(t,o,e){return o=(0,_getPrototypeOf2.default)(o),(0,_possibleConstructorReturn2.default)(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],(0,_getPrototypeOf2.default)(t).constructor):o.apply(t,e));}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}var ReactNativePendo=_reactNative.NativeModules.ReactNativePendo;function WithPendoModal(WrappedComponent){var PNDModalContainer=function(_Component){function PNDModalContainer(props){var _this;(0,_classCallCheck2.default)(this,PNDModalContainer);_this=_callSuper(this,PNDModalContainer,[props]);_this.modalType=_pendoTypes.ModalType.None;_this.modalPreviousVisibility=false;_this.pndState=(0,_react.createRef)();_this.configureModalType();return _this;}(0,_inherits2.default)(PNDModalContainer,_Component);return(0,_createClass2.default)(PNDModalContainer,[{key:"configureModalType",value:function configureModalType(){var _WrappedComponent$ren;if(WrappedComponent.displayName==='Modal'||WrappedComponent.name==='Modal'){this.modalType=_pendoTypes.ModalType.ReactModal;}else if(WrappedComponent.displayName==='BottomSheetModal'||WrappedComponent.name==='BottomSheetModal'){this.modalType=_pendoTypes.ModalType.GorhomModal;this.setWrappedComponentRef=this.setWrappedComponentRef.bind(this);this.state={isVisible:false};}else if(((_WrappedComponent$ren=WrappedComponent.render)==null?void 0:_WrappedComponent$ren.toString().indexOf('ModalizeBase'))>-1){this.modalType=_pendoTypes.ModalType.Modalize;this.setWrappedComponentRef=this.setWrappedComponentRef.bind(this);this.state={isVisible:false};}}},{key:"setWrappedComponentRef",value:function setWrappedComponentRef(ref){var _this$props;if(this.pndState==null){this.pndState=(0,_react.createRef)();}if(ref!=null){this.pndState.current=ref;if(this.modalType===_pendoTypes.ModalType.GorhomModal||this.modalType===_pendoTypes.ModalType.Modalize){this.pndState.current.isVisible=this.state.isVisible;}}if((_this$props=this.props)!=null&&_this$props.forwardedRef){if(typeof this.props.forwardedRef==='function'){this.props.forwardedRef(ref);}else{this.props.forwardedRef.current=ref;}}}},{key:"setModalVisibility",value:function setModalVisibility(visible){if(visible==null){return;}if(visible!==this.modalPreviousVisibility){_pendoLogger.Logger.debug(`Pendo ReactModal - setting visibility to ${visible}`);this.modalPreviousVisibility=visible;if(_common.Utils.hasPendoNativeModule(false)){ReactNativePendo.modalStateChanged(visible);}}}},{key:"setVisibilityWithState",value:function setVisibilityWithState(visible){if(visible===this.state.isVisible){_pendoLogger.Logger.debug(`Pendo ${_fiberTypes.TagFinder.getModalTypeName(this.modalType)}Modal - visibility is already ${visible}`);return;}this.pndState.current.isVisible=visible;this.state={isVisible:visible};_pendoLogger.Logger.debug(`Pendo ${_fiberTypes.TagFinder.getModalTypeName(this.modalType)}Modal - setting visibility to ${visible}`);if(_common.Utils.hasPendoNativeModule(false)){ReactNativePendo.modalStateChanged(visible);}}},{key:"componentDidUpdate",value:function componentDidUpdate(_prevProps,_prevState,_snapshot){if(this.modalType===_pendoTypes.ModalType.ReactModal){var visible=this.props.visible;this.setModalVisibility(visible);}}},{key:"componentWillUnmount",value:function componentWillUnmount(){if(this.modalType===_pendoTypes.ModalType.ReactModal){this.setModalVisibility(false);}}},{key:"render",value:function render(){try{if(this.modalType===_pendoTypes.ModalType.ReactModal){return this._renderReactModal();}else if(this.modalType===_pendoTypes.ModalType.GorhomModal){return this._renderGorhomModal();}else if(this.modalType===_pendoTypes.ModalType.Modalize){return this._renderModalizeModal();}else{return this._renderUnsupportedComponent();}}catch(e){_pendoLogger.Logger.warn(`PNDContainer failed to render`,e);return this._renderUnsupportedComponent();}}},{key:"_renderReactModal",value:function _renderReactModal(){var _this$props2=this.props,visible=_this$props2.visible,children=_this$props2.children,rest=(0,_objectWithoutProperties2.default)(_this$props2,_excluded);this.setModalVisibility(visible);return(0,_react.createElement)(WrappedComponent,Object.assign({visible:visible},rest,{modalType:this.modalType,children:children}));}},{key:"_renderGorhomModal",value:function _renderGorhomModal(){var _this2=this;var _this$props3=this.props,_onChange=_this$props3.onChange,children=_this$props3.children,rest=(0,_objectWithoutProperties2.default)(_this$props3,_excluded2);return(0,_react.createElement)(WrappedComponent,Object.assign({ref:function ref(_ref){_this2.setWrappedComponentRef(_ref);},onChange:function onChange(index){_this2.setVisibilityWithState(index>=0);if(typeof _onChange==='function'){_pendoLogger.Logger.debug('propagating onChange');_onChange(index);}},modalType:this.modalType,isVisible:this.state.isVisible},rest,{children:children}));}},{key:"_renderModalizeModal",value:function _renderModalizeModal(){var _this3=this;var _this$props4=this.props,_onOpen=_this$props4.onOpen,_onClose=_this$props4.onClose,children=_this$props4.children,rest=(0,_objectWithoutProperties2.default)(_this$props4,_excluded3);return(0,_react.createElement)(WrappedComponent,Object.assign({ref:function ref(_ref2){_this3.setWrappedComponentRef(_ref2);},onOpen:function onOpen(){_this3.setVisibilityWithState(true);if(typeof _onOpen==='function'){_pendoLogger.Logger.debug('propagating onOpen');_onOpen();}},onClose:function onClose(){_this3.setVisibilityWithState(false);if(typeof _onClose==='function'){_pendoLogger.Logger.debug('propagating onClose');_onClose();}},modalType:this.modalType},rest,{children:children}));}},{key:"_renderUnsupportedComponent",value:function _renderUnsupportedComponent(){var _this$props5=this.props,children=_this$props5.children,rest=(0,_objectWithoutProperties2.default)(_this$props5,_excluded4);return(0,_react.createElement)(WrappedComponent,Object.assign({modalType:this.modalType},rest,{children:children}));}}]);}(_react.Component);function useForwardRef(props,ref){var children=props.children,forwardedRef=props.forwardedRef,rest=(0,_objectWithoutProperties2.default)(props,_excluded5);return _react.default.createElement(PNDModalContainer,Object.assign({},rest,{forwardedRef:forwardedRef||ref}),children);}var name=(WrappedComponent==null?void 0:WrappedComponent.displayName)||WrappedComponent.name||`Component`;useForwardRef.displayName=`PNDModalContainer(${name})`;var forwardedComponent=(0,_react.forwardRef)(_common.Utils.handleError.bind(_common.Utils,useForwardRef));return forwardedComponent;}