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 _modalDetectors=require("./modalDetectors");var _pendoLogger=require("./pendoLogger");var _pendoTypes=require("./pendoTypes");var _excluded=["visible","children"],_excluded2=["onChange","children"],_excluded3=["onOpen","onClose","children"],_excluded4=["onModalShow","onModalHide","children"],_excluded5=["onShow","onDismiss","children"],_excluded6=["children"],_excluded7=["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();_pendoLogger.Logger.info(`WithPendoModal was called for ${_fiberTypes.TagFinder.getModalTypeName(_this.modalType)}`);return _this;}(0,_inherits2.default)(PNDModalContainer,_Component);return(0,_createClass2.default)(PNDModalContainer,[{key:"configureModalType",value:function configureModalType(){this.modalType=_modalDetectors.ModalDetectionService.detectModalType(WrappedComponent);if(this.modalType===_pendoTypes.ModalType.GorhomModal||this.modalType===_pendoTypes.ModalType.Modalize){this.setWrappedComponentRef=this.setWrappedComponentRef.bind(this);}if(this.modalType===_pendoTypes.ModalType.None){_pendoLogger.Logger.info(_common.Utils.safePrint(WrappedComponent));}}},{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.modalPreviousVisibility;}}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 ${_fiberTypes.TagFinder.getModalTypeName(this.modalType)} - setting visibility to ${visible}`);this.modalPreviousVisibility=visible;if(_common.Utils.isSDKOperational(false)){ReactNativePendo.modalStateChanged(visible);}}}},{key:"setVisibilityWithState",value:function setVisibilityWithState(visible){this.setModalVisibility(visible);if(this.pndState.current){this.pndState.current.isVisible=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.None){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 if(this.modalType===_pendoTypes.ModalType.ReactNativeModal){return this._renderReactNativeModal();}else if(this.modalType===_pendoTypes.ModalType.ReactNativeModals){return this._renderReactNativeModals();}else{return this._renderUnsupportedComponent();}}catch(e){_pendoLogger.Logger.warn(`PNDModalContainer 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.modalPreviousVisibility},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:"_renderReactNativeModal",value:function _renderReactNativeModal(){var _this4=this;var _this$props5=this.props,_onModalShow=_this$props5.onModalShow,_onModalHide=_this$props5.onModalHide,children=_this$props5.children,rest=(0,_objectWithoutProperties2.default)(_this$props5,_excluded4);return(0,_react.createElement)(WrappedComponent,Object.assign({onModalShow:function onModalShow(){_this4.setModalVisibility(true);if(typeof _onModalShow==='function'){_pendoLogger.Logger.debug('propagating onModalShow');_onModalShow();}},onModalHide:function onModalHide(){_this4.setModalVisibility(false);if(typeof _onModalHide==='function'){_pendoLogger.Logger.debug('propagating onModalHide');_onModalHide();}},modalType:this.modalType},rest,{children:children}));}},{key:"_renderReactNativeModals",value:function _renderReactNativeModals(){var _this5=this;var _this$props6=this.props,_onShow=_this$props6.onShow,_onDismiss=_this$props6.onDismiss,children=_this$props6.children,rest=(0,_objectWithoutProperties2.default)(_this$props6,_excluded5);return(0,_react.createElement)(WrappedComponent,Object.assign({onShow:function onShow(){_this5.setModalVisibility(true);if(typeof _onShow==='function'){_pendoLogger.Logger.debug('propagating onShow');_onShow();}},onDismiss:function onDismiss(){_this5.setModalVisibility(false);if(typeof _onDismiss==='function'){_pendoLogger.Logger.debug('propagating onDismiss');_onDismiss();}},modalType:this.modalType},rest,{children:children}));}},{key:"_renderUnsupportedComponent",value:function _renderUnsupportedComponent(){var _this$props7=this.props,children=_this$props7.children,rest=(0,_objectWithoutProperties2.default)(_this$props7,_excluded6);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,_excluded7);return _react.default.createElement(PNDModalContainer,Object.assign({},rest,{forwardedRef:forwardedRef||ref}),children);}var name=function(){try{return(WrappedComponent==null?void 0:WrappedComponent.displayName)||(WrappedComponent==null?void 0:WrappedComponent.name)||`Component`;}catch(error){_pendoLogger.Logger.debug('Failed to retrieve component name for modal wrapper',error);return`Component`;}}();useForwardRef.displayName=`PNDModalContainer(${name})`;var forwardedComponent=(0,_react.forwardRef)(_common.Utils.handleError.bind(_common.Utils,useForwardRef));return forwardedComponent;}