@shopgate/engage/components/View/provider.js

Shopgate's ENGAGE library.

function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}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=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Component}from'react';import PropTypes from'prop-types';import delay from'lodash/delay';import{connect}from'react-redux';import{UIEvents}from'@shopgate/engage/core/events';import{getModalCount}from'@shopgate/engage/a11y/selectors';import{emitScrollEvents}from'@shopgate/engage/core/streams';import{MODAL_EVENTS}from'@shopgate/engage/components';import{ViewContext}from"./context";/**
 * @param {Object} state State
 * @returns {Object}
 */var mapStateToProps=function mapStateToProps(state){return{modalCount:getModalCount(state)};};/**
 * The ViewProvider component.
 */var ViewProvider=/*#__PURE__*/function(_Component){function ViewProvider(props){var _this2;_classCallCheck(this,ViewProvider);_this2=_callSuper(this,ViewProvider,[props]);_defineProperty(_this2,"handleModalShow",function(){_this2.activeElement=document.activeElement;_this2.setAriaHidden(true);});_defineProperty(_this2,"handleModalHide",function(){if(_this2.activeElement&&_this2.activeElement.focus){_this2.activeElement.focus();}_this2.setAriaHidden(false);});/**
   * @param {number} value The new top value;
   */_defineProperty(_this2,"setTop",function(value){_this2.set('top',value);});/**
   * @param {number} value The new bottom value;
   */_defineProperty(_this2,"setBottom",function(value){_this2.set('bottom',value);});/**
   * @param {boolean} value The new aria hidden value;
   */_defineProperty(_this2,"setAriaHidden",function(value){_this2.set('ariaHidden',value);});/**
   * @param {Object} ref A React reference to the page content wrapper.
   */_defineProperty(_this2,"setContentRef",function(ref){_this2.set('contentRef',ref);// Delay to dispatch actual DOM node - implemented with CCP-2358
delay(function(){return emitScrollEvents(ref.current);},250);});/**
   * @return {Object}
   */_defineProperty(_this2,"getContentRef",function(){return _this2.state.contentRef;});/**
   * Scrolls the content ref to the top.
   * @param {number} [value=0] A number indicating the new scroll position of the content ref.
   */_defineProperty(_this2,"scrollTop",function(){var value=arguments.length>0&&arguments[0]!==undefined?arguments[0]:0;var current=_this2.state.contentRef.current;if(current){current.scrollTop=value;}});/**
   * @param {string} property The state property to set.
   * @param {*} value The value to set.
   */_defineProperty(_this2,"set",function(property,value){if(_this2.state[property]!==value){_this2.setState(_defineProperty({},property,value));}});_this2.state={top:0,bottom:0,contentRef:{current:null},ariaHidden:props.modalCount>0};// Last view active element
_this2.activeElement=null;return _this2;}/** @inheritDoc */_inherits(ViewProvider,_Component);return _createClass(ViewProvider,[{key:"componentDidMount",value:function componentDidMount(){UIEvents.addListener(MODAL_EVENTS.SHOW,this.handleModalShow);UIEvents.addListener(MODAL_EVENTS.HIDE,this.handleModalHide);}/** @inheritDoc */},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(prevProps.modalCount!==this.props.modalCount){this.setAriaHidden(this.props.modalCount>0);}}/** @inheritDoc */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(MODAL_EVENTS.SHOW,this.handleModalShow);UIEvents.removeListener(MODAL_EVENTS.HIDE,this.handleModalHide);}/**
   * @returns {Object}
   */},{key:"providerContext",get:function get(){return _extends({},this.state,{set:this.set,setTop:this.setTop,setBottom:this.setBottom,setAriaHidden:this.setAriaHidden,setContentRef:this.setContentRef,getContentRef:this.getContentRef,scrollTop:this.scrollTop});}},{key:"render",value:/**
   * @returns {JSX}
   */function render(){return React.createElement(ViewContext.Provider,{value:this.providerContext},this.props.children);}}]);}(Component);export default connect(mapStateToProps)(ViewProvider);