@shopgate/engage 6.20.0-beta.2 → 6.20.0-beta.5

package/a11y/components/LiveMessage/__tests__/index.spec.js

@@ -1 +1 @@
-import React from'react';import{shallow}from'enzyme';import LiveMessage from"../index";jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(_ref){var string=_ref.string;return string;}}};});describe('<LiveMessage />',function(){var message='My Message';it('should render a polite simple message',function(){var ariaLive='polite';var wrapper=shallow(React.createElement(LiveMessage,{message:message}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('div').prop('aria-live')).toBe(ariaLive);expect(wrapper.find('Translate').prop('string')).toBe(message);expect(wrapper.find('Translate').prop('params')).toEqual(null);});it('should render an assertive message with params ',function(){var ariaLive='assertive';var params={my:'param'};var wrapper=shallow(React.createElement(LiveMessage,{message:message,params:params,"aria-live":ariaLive}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('div').prop('aria-live')).toBe(ariaLive);expect(wrapper.find('Translate').prop('string')).toBe(message);expect(wrapper.find('Translate').prop('params')).toEqual(params);});});
+import React from'react';import{shallow}from'enzyme';import LiveMessage from"../index";jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(_ref){var string=_ref.string;return string;}}};});describe('<LiveMessage />',function(){var message='My Message';it('should render a polite simple message',function(){var ariaLive='polite';var wrapper=shallow(/*#__PURE__*/React.createElement(LiveMessage,{message:message}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('div').prop('aria-live')).toBe(ariaLive);expect(wrapper.find('Translate').prop('string')).toBe(message);expect(wrapper.find('Translate').prop('params')).toEqual(null);});it('should render an assertive message with params ',function(){var ariaLive='assertive';var params={my:'param'};var wrapper=shallow(/*#__PURE__*/React.createElement(LiveMessage,{message:message,params:params,"aria-live":ariaLive}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('div').prop('aria-live')).toBe(ariaLive);expect(wrapper.find('Translate').prop('string')).toBe(message);expect(wrapper.find('Translate').prop('params')).toEqual(params);});});

package/a11y/components/LiveMessage/index.js

@@ -4,4 +4,4 @@ import React from'react';import PropTypes from'prop-types';import{I18n}from"../.
  * @param {Object} params Optional params for the message.
  * @param {string} 'aria-live' The aria-live type.
  * @returns {JSX}
- */var LiveMessage=function LiveMessage(_ref){var message=_ref.message,params=_ref.params,ariaLive=_ref['aria-live'];return React.createElement("div",{className:styles,role:"log","aria-live":ariaLive},React.createElement(I18n.Text,{string:message,params:params}));};LiveMessage.defaultProps={'aria-live':'polite',params:null};export default LiveMessage;
+ */var LiveMessage=function LiveMessage(_ref){var message=_ref.message,params=_ref.params,ariaLive=_ref['aria-live'];return/*#__PURE__*/React.createElement("div",{className:styles,role:"log","aria-live":ariaLive},/*#__PURE__*/React.createElement(I18n.Text,{string:message,params:params}));};LiveMessage.defaultProps={'aria-live':'polite',params:null};export default LiveMessage;

package/a11y/components/LiveMessenger/__tests__/index.spec.js

@@ -1 +1 @@
-function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React from'react';import{act}from'react-dom/test-utils';import{mount}from'enzyme';import{UIEvents}from"../../../../core";import LiveMessage from"../../LiveMessage";import{EVENT_LIVE_MESSAGE,LIVE_MESSAGE_TYPE_ASSERTIVE,LIVE_MESSAGE_TYPE_POLITE}from"../constants";import LiveMessenger from"../index";jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(_ref){var string=_ref.string;return string;}}};});jest.mock("../../../../core",function(){return{UIEvents:{addListener:jest.fn(),removeListener:jest.fn()}};});describe('<LiveMessenger />',function(){beforeEach(function(){jest.clearAllMocks();});it('should render',function(){var wrapper=mount(React.createElement(LiveMessenger,null));expect(wrapper).toMatchSnapshot();var liveMessages=wrapper.find(LiveMessage);expect(liveMessages).toHaveLength(2);expect(liveMessages.at(0).props()).toEqual({'aria-live':'assertive',message:'',params:null});expect(liveMessages.at(1).props()).toEqual({'aria-live':'polite',message:'',params:null});});it('should register and remove the events as expected',function(){var wrapper=mount(React.createElement(LiveMessenger,null));var _UIEvents$addListener=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener2=_slicedToArray(_UIEvents$addListener[0],2),callback=_UIEvents$addListener2[1];expect(UIEvents.addListener).toHaveBeenCalledTimes(1);expect(UIEvents.addListener).toHaveBeenCalledWith(EVENT_LIVE_MESSAGE,expect.any(Function));expect(UIEvents.removeListener).not.toHaveBeenCalled();wrapper.unmount();expect(UIEvents.addListener).toHaveBeenCalledTimes(1);expect(UIEvents.removeListener).toHaveBeenCalledTimes(1);expect(UIEvents.removeListener).toHaveBeenCalledWith(EVENT_LIVE_MESSAGE,callback);});it('should update the polite message by default when the event comes in',function(){var message='My Message';var options={params:{some:'param'}};var wrapper=mount(React.createElement(LiveMessenger,null));var _UIEvents$addListener3=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener4=_slicedToArray(_UIEvents$addListener3[0],2),callback=_UIEvents$addListener4[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',params:options.params,message:message});});it('should update the polite message when the event comes in with the appropriate type',function(){var message='My Polite Message';var options={type:LIVE_MESSAGE_TYPE_POLITE,params:{some:'param'}};var wrapper=mount(React.createElement(LiveMessenger,null));var _UIEvents$addListener5=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener6=_slicedToArray(_UIEvents$addListener5[0],2),callback=_UIEvents$addListener6[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',message:message,params:options.params});});it('should update the assertive message when the event comes in with the appropriate type',function(){var message='My Assertive Message';var options={type:LIVE_MESSAGE_TYPE_ASSERTIVE,params:{some:'param'}};var wrapper=mount(React.createElement(LiveMessenger,null));var _UIEvents$addListener7=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener8=_slicedToArray(_UIEvents$addListener7[0],2),callback=_UIEvents$addListener8[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(0).props()).toEqual({'aria-live':'assertive',params:options.params,message:message});});it('should only update the message when it has the correct id',function(){var id='my-id';var message='My Message';var options={};var wrapper=mount(React.createElement(LiveMessenger,{id:id}));var _UIEvents$addListener9=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener10=_slicedToArray(_UIEvents$addListener9[0],2),callback=_UIEvents$addListener10[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',params:null,message:''});act(function(){callback(message,{id:id});});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',params:null,message:message});});});
+function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React from'react';import{act}from'react-dom/test-utils';import{mount}from'enzyme';import{UIEvents}from"../../../../core";import LiveMessage from"../../LiveMessage";import{EVENT_LIVE_MESSAGE,LIVE_MESSAGE_TYPE_ASSERTIVE,LIVE_MESSAGE_TYPE_POLITE}from"../constants";import LiveMessenger from"../index";jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(_ref){var string=_ref.string;return string;}}};});jest.mock("../../../../core",function(){return{UIEvents:{addListener:jest.fn(),removeListener:jest.fn()}};});describe('<LiveMessenger />',function(){beforeEach(function(){jest.clearAllMocks();});it('should render',function(){var wrapper=mount(/*#__PURE__*/React.createElement(LiveMessenger,null));expect(wrapper).toMatchSnapshot();var liveMessages=wrapper.find(LiveMessage);expect(liveMessages).toHaveLength(2);expect(liveMessages.at(0).props()).toEqual({'aria-live':'assertive',message:'',params:null});expect(liveMessages.at(1).props()).toEqual({'aria-live':'polite',message:'',params:null});});it('should register and remove the events as expected',function(){var wrapper=mount(/*#__PURE__*/React.createElement(LiveMessenger,null));var _UIEvents$addListener=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener2=_slicedToArray(_UIEvents$addListener[0],2),callback=_UIEvents$addListener2[1];expect(UIEvents.addListener).toHaveBeenCalledTimes(1);expect(UIEvents.addListener).toHaveBeenCalledWith(EVENT_LIVE_MESSAGE,expect.any(Function));expect(UIEvents.removeListener).not.toHaveBeenCalled();wrapper.unmount();expect(UIEvents.addListener).toHaveBeenCalledTimes(1);expect(UIEvents.removeListener).toHaveBeenCalledTimes(1);expect(UIEvents.removeListener).toHaveBeenCalledWith(EVENT_LIVE_MESSAGE,callback);});it('should update the polite message by default when the event comes in',function(){var message='My Message';var options={params:{some:'param'}};var wrapper=mount(/*#__PURE__*/React.createElement(LiveMessenger,null));var _UIEvents$addListener3=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener4=_slicedToArray(_UIEvents$addListener3[0],2),callback=_UIEvents$addListener4[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',params:options.params,message:message});});it('should update the polite message when the event comes in with the appropriate type',function(){var message='My Polite Message';var options={type:LIVE_MESSAGE_TYPE_POLITE,params:{some:'param'}};var wrapper=mount(/*#__PURE__*/React.createElement(LiveMessenger,null));var _UIEvents$addListener5=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener6=_slicedToArray(_UIEvents$addListener5[0],2),callback=_UIEvents$addListener6[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',message:message,params:options.params});});it('should update the assertive message when the event comes in with the appropriate type',function(){var message='My Assertive Message';var options={type:LIVE_MESSAGE_TYPE_ASSERTIVE,params:{some:'param'}};var wrapper=mount(/*#__PURE__*/React.createElement(LiveMessenger,null));var _UIEvents$addListener7=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener8=_slicedToArray(_UIEvents$addListener7[0],2),callback=_UIEvents$addListener8[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(0).props()).toEqual({'aria-live':'assertive',params:options.params,message:message});});it('should only update the message when it has the correct id',function(){var id='my-id';var message='My Message';var options={};var wrapper=mount(/*#__PURE__*/React.createElement(LiveMessenger,{id:id}));var _UIEvents$addListener9=_slicedToArray(UIEvents.addListener.mock.calls,1),_UIEvents$addListener10=_slicedToArray(_UIEvents$addListener9[0],2),callback=_UIEvents$addListener10[1];act(function(){callback(message,options);});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',params:null,message:''});act(function(){callback(message,{id:id});});wrapper.update();expect(wrapper.find(LiveMessage).at(1).props()).toEqual({'aria-live':'polite',params:null,message:message});});});

package/a11y/components/LiveMessenger/helpers.js

@@ -7,5 +7,5 @@ function _extends(){_extends=Object.assign||function(target){for(var i=1;i<argum
  * @param {string} options.id Id of the LiveMessenger component which sets the message.
  * @param {boolean} options.force If set to TRUE the LiveMessenger component will read the text,
  * even if the same was broadcasted before.
- */export function broadcastLiveMessage(message){var options=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};var defaults={type:LIVE_MESSAGE_TYPE_POLITE,params:null,id:null};if(!message){return;}var params=_extends({},defaults,{},options);UIEvents.emit(EVENT_LIVE_MESSAGE,message,params);setTimeout(function(){// Clear the live area after a short time, so that the screen reader can't focus the element.
+ */export function broadcastLiveMessage(message){var options=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};var defaults={type:LIVE_MESSAGE_TYPE_POLITE,params:null,id:null};if(!message){return;}var params=_extends({},defaults,options);UIEvents.emit(EVENT_LIVE_MESSAGE,message,params);setTimeout(function(){// Clear the live area after a short time, so that the screen reader can't focus the element.
 UIEvents.emit(EVENT_LIVE_MESSAGE,'',params);},100);}

package/a11y/components/LiveMessenger/index.js

@@ -1,4 +1,4 @@
-function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState,useLayoutEffect,useCallback}from'react';import PropTypes from'prop-types';import{UIEvents}from'@shopgate/engage/core';import LiveMessage from"../LiveMessage";import{EVENT_LIVE_MESSAGE,LIVE_MESSAGE_TYPE_ASSERTIVE,LIVE_MESSAGE_TYPE_POLITE}from"./constants";/**
+function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState,useLayoutEffect,useCallback}from'react';import PropTypes from'prop-types';import{UIEvents}from'@shopgate/engage/core';import LiveMessage from"../LiveMessage";import{EVENT_LIVE_MESSAGE,LIVE_MESSAGE_TYPE_ASSERTIVE,LIVE_MESSAGE_TYPE_POLITE}from"./constants";/**
  * The LiveMessenger component can be used to broadcast `aria-live` messages to assistive
  * technology. It can be placed somewhere within the DOM, and receives its updates via
  * EVENT_LIVE_MESSAGE event.
@@ -6,4 +6,4 @@ function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimi
  * @returns {JSX}
  */var LiveMessenger=function LiveMessenger(_ref){var id=_ref.id;var _useState=useState({message:'',params:null}),_useState2=_slicedToArray(_useState,2),assertive=_useState2[0],setAssertive=_useState2[1];var _useState3=useState({message:'',params:null}),_useState4=_slicedToArray(_useState3,2),polite=_useState4[0],setPolite=_useState4[1];var handleMessage=useCallback(function(message,options){var _options$type=options.type,type=_options$type===void 0?LIVE_MESSAGE_TYPE_POLITE:_options$type,_options$id=options.id,instanceId=_options$id===void 0?null:_options$id,_options$params=options.params,params=_options$params===void 0?null:_options$params;if(id!==instanceId){return;}if(type===LIVE_MESSAGE_TYPE_ASSERTIVE){setAssertive({message:message,params:params});}else if(type===LIVE_MESSAGE_TYPE_POLITE){setPolite({message:message,params:params});}// eslint-disable-next-line react-hooks/exhaustive-deps
 },[]);useLayoutEffect(function(){UIEvents.addListener(EVENT_LIVE_MESSAGE,handleMessage);return function(){UIEvents.removeListener(EVENT_LIVE_MESSAGE,handleMessage);};// eslint-disable-next-line react-hooks/exhaustive-deps
-},[]);return React.createElement("div",null,React.createElement(LiveMessage,{"aria-live":"assertive",message:assertive.message,params:assertive.params}),React.createElement(LiveMessage,{"aria-live":"polite",message:polite.message,params:polite.params}));};LiveMessenger.defaultProps={id:null};export default LiveMessenger;
+},[]);return/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement(LiveMessage,{"aria-live":"assertive",message:assertive.message,params:assertive.params}),/*#__PURE__*/React.createElement(LiveMessage,{"aria-live":"polite",message:polite.message,params:polite.params}));};LiveMessenger.defaultProps={id:null};export default LiveMessenger;

package/a11y/components/Navigation/__tests__/index.spec.js

@@ -1 +1 @@
-import React from'react';import{mount}from'enzyme';import Navigation from"../index";jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(_ref){var string=_ref.string;return string;}},Link:function Link(_ref2){var children=_ref2.children;return children;}};});var mockTranslate=jest.fn(function(key){return key;});var mockRenderOptions={context:{i18n:function i18n(){return{__:mockTranslate};}}};var entries=[{title:'Title One',link:'/some-link'},{title:'Title Two',link:'/another-link'}];describe('<Navigation />',function(){it('should render with an aria label and entries',function(){var title='Navigation Title';var wrapper=mount(React.createElement(Navigation,{title:title,entries:entries}),mockRenderOptions);expect(wrapper).toMatchSnapshot();expect(wrapper.find('nav').prop('aria-label')).toEqual(title);expect(wrapper.find('ul').children()).toHaveLength(2);});it('should render empty when no entries are passed',function(){var wrapper=mount(React.createElement(Navigation,null),mockRenderOptions);expect(wrapper).toMatchSnapshot();expect(wrapper.isEmptyRender()).toBe(true);});});
+import React from'react';import{mount}from'enzyme';import Navigation from"../index";jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(_ref){var string=_ref.string;return string;}},Link:function Link(_ref2){var children=_ref2.children;return children;}};});var mockTranslate=jest.fn(function(key){return key;});var mockRenderOptions={context:{i18n:function i18n(){return{__:mockTranslate};}}};var entries=[{title:'Title One',link:'/some-link'},{title:'Title Two',link:'/another-link'}];describe('<Navigation />',function(){it('should render with an aria label and entries',function(){var title='Navigation Title';var wrapper=mount(/*#__PURE__*/React.createElement(Navigation,{title:title,entries:entries}),mockRenderOptions);expect(wrapper).toMatchSnapshot();expect(wrapper.find('nav').prop('aria-label')).toEqual(title);expect(wrapper.find('ul').children()).toHaveLength(2);});it('should render empty when no entries are passed',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Navigation,null),mockRenderOptions);expect(wrapper).toMatchSnapshot();expect(wrapper.isEmptyRender()).toBe(true);});});

package/a11y/components/Navigation/index.js

@@ -4,4 +4,4 @@ import React from'react';import PropTypes from'prop-types';import{Link,I18n}from
  * @param {Array} props.entries Navigation entries.
  * @param {Object} context  The component context.
  * @returns {JSX}
- */var Navigation=function Navigation(_ref,context){var title=_ref.title,entries=_ref.entries;var _context$i18n=context.i18n(),__=_context$i18n.__;if(!entries||!entries.length){return null;}return React.createElement("nav",{"aria-label":title?__(title):null},React.createElement("ul",{className:styles},entries.map(function(_ref2){var entryTitle=_ref2.title,link=_ref2.link;return React.createElement("li",{key:link},React.createElement(Link,{href:link},React.createElement(I18n.Text,{string:entryTitle})));})));};Navigation.defaultProps={title:null,entries:[]};Navigation.contextTypes={i18n:PropTypes.func};export default Navigation;
+ */var Navigation=function Navigation(_ref,context){var title=_ref.title,entries=_ref.entries;var _context$i18n=context.i18n(),__=_context$i18n.__;if(!entries||!entries.length){return null;}return/*#__PURE__*/React.createElement("nav",{"aria-label":title?__(title):null},/*#__PURE__*/React.createElement("ul",{className:styles},entries.map(function(_ref2){var entryTitle=_ref2.title,link=_ref2.link;return/*#__PURE__*/React.createElement("li",{key:link},/*#__PURE__*/React.createElement(Link,{href:link},/*#__PURE__*/React.createElement(I18n.Text,{string:entryTitle})));})));};Navigation.defaultProps={title:null,entries:[]};Navigation.contextTypes={i18n:PropTypes.func};export default Navigation;

package/a11y/components/Section/__tests__/index.spec.js

@@ -1 +1 @@
-import React from'react';import{mount}from'enzyme';import Section from"../index";var mockTranslate=jest.fn();jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(props){mockTranslate(props);return props.string;}}};});var title='my.headline';var titleParams={some:'params'};describe('<Section />',function(){beforeEach(function(){jest.clearAllMocks();});it('should render with a label',function(){var wrapper=mount(React.createElement(Section,{title:title,titleParams:titleParams},React.createElement("div",{id:"child-component"})));expect(wrapper).toMatchSnapshot();expect(wrapper.find('h2').exists()).toBe(true);expect(mockTranslate).toHaveBeenCalledWith({string:title,params:titleParams});});it('should render hidden when no children rendered',function(){var wrapper=mount(React.createElement(Section,{title:title}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('h2').exists()).toBe(false);expect(mockTranslate).toHaveBeenCalledTimes(0);});describe('MutationObserver',function(){var wrapper;beforeEach(function(){wrapper=mount(React.createElement(Section,{title:title}));});it('should create an observer instance',function(){expect(global.mutationConstructorSpy).toHaveBeenCalledTimes(1);expect(global.mutationConstructorSpy).toHaveBeenCalledWith(expect.any(Function));});it('should observe with the correct initialization',function(){expect(global.mutationObserveSpy).toHaveBeenCalledTimes(1);expect(global.mutationObserveSpy).toHaveBeenCalledWith(wrapper.find('section').instance(),{childList:true});});it('should call disconnect on unmount',function(){wrapper.unmount();expect(global.mutationDisconnectSpy).toHaveBeenCalledTimes(1);});});});
+import React from'react';import{mount}from'enzyme';import Section from"../index";var mockTranslate=jest.fn();jest.mock("../../../../components",function(){return{I18n:{Text:function Translate(props){mockTranslate(props);return props.string;}}};});var title='my.headline';var titleParams={some:'params'};describe('<Section />',function(){beforeEach(function(){jest.clearAllMocks();});it('should render with a label',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Section,{title:title,titleParams:titleParams},/*#__PURE__*/React.createElement("div",{id:"child-component"})));expect(wrapper).toMatchSnapshot();expect(wrapper.find('h2').exists()).toBe(true);expect(mockTranslate).toHaveBeenCalledWith({string:title,params:titleParams});});it('should render hidden when no children rendered',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Section,{title:title}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('h2').exists()).toBe(false);expect(mockTranslate).toHaveBeenCalledTimes(0);});describe('MutationObserver',function(){var wrapper;beforeEach(function(){wrapper=mount(/*#__PURE__*/React.createElement(Section,{title:title}));});it('should create an observer instance',function(){expect(global.mutationConstructorSpy).toHaveBeenCalledTimes(1);expect(global.mutationConstructorSpy).toHaveBeenCalledWith(expect.any(Function));});it('should observe with the correct initialization',function(){expect(global.mutationObserveSpy).toHaveBeenCalledTimes(1);expect(global.mutationObserveSpy).toHaveBeenCalledWith(wrapper.find('section').instance(),{childList:true});});it('should call disconnect on unmount',function(){wrapper.unmount();expect(global.mutationDisconnectSpy).toHaveBeenCalledTimes(1);});});});

package/a11y/components/Section/index.js

@@ -1,4 +1,4 @@
-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 _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key];}}return target;}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key];}return target;}import React,{useRef,useState,useMemo,useLayoutEffect}from'react';import PropTypes from'prop-types';import kebabCase from'lodash/kebabCase';import{I18n}from'@shopgate/engage/components';/**
+var _excluded=["title","titleParams","children"];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 _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key];}}return target;}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key];}return target;}import React,{useRef,useState,useMemo,useLayoutEffect}from'react';import PropTypes from'prop-types';import kebabCase from'lodash/kebabCase';import{I18n}from'@shopgate/engage/components';/**
  * Checks the section ref has suitable child nodes.
  * @param {Object} ref A React ref.
  * @param {string} headlineId The ID of the section headline.
@@ -14,4 +14,4 @@ var childNodes=[].filter.call(ref.current.childNodes,function(el){return el.getA
  * @param {Object} [props.className=null] A class name for the section.
  * @param {NodeList} [props.children=null] Component children.
  * @returns {JSX}
- */function Section(props){var title=props.title,titleParams=props.titleParams,children=props.children,rest=_objectWithoutProperties(props,["title","titleParams","children"]);var contentRef=useRef(null);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),hasContent=_useState2[0],setHasContent=_useState2[1];var id=useMemo(function(){return kebabCase(title);},[title]);var observer=useMemo(function(){return new MutationObserver(function(){setHasContent(hasChildNodes(contentRef,id));});},[contentRef,id]);useLayoutEffect(function(){setHasContent(hasChildNodes(contentRef,id));observer.observe(contentRef.current,{childList:true});return function(){observer.disconnect();};},[contentRef,id,observer]);if(!hasContent){return React.createElement("section",_extends({},rest,{ref:contentRef}),children);}return React.createElement("section",_extends({},rest,{ref:contentRef,"aria-labelledby":id}),React.createElement("h2",{id:id,hidden:true},React.createElement(I18n.Text,{string:title,params:titleParams})),children);}Section.defaultProps={children:null,className:'',titleParams:{}};export default Section;
+ */function Section(props){var title=props.title,titleParams=props.titleParams,children=props.children,rest=_objectWithoutProperties(props,_excluded);var contentRef=useRef(null);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),hasContent=_useState2[0],setHasContent=_useState2[1];var id=useMemo(function(){return kebabCase(title);},[title]);var observer=useMemo(function(){return new MutationObserver(function(){setHasContent(hasChildNodes(contentRef,id));});},[contentRef,id]);useLayoutEffect(function(){setHasContent(hasChildNodes(contentRef,id));observer.observe(contentRef.current,{childList:true});return function(){observer.disconnect();};},[contentRef,id,observer]);if(!hasContent){return/*#__PURE__*/React.createElement("section",_extends({},rest,{ref:contentRef}),children);}return/*#__PURE__*/React.createElement("section",_extends({},rest,{ref:contentRef,"aria-labelledby":id}),/*#__PURE__*/React.createElement("h2",{id:id,hidden:true},/*#__PURE__*/React.createElement(I18n.Text,{string:title,params:titleParams})),children);}Section.defaultProps={children:null,className:'',titleParams:{}};export default Section;

package/a11y/index.spec.js

@@ -1 +1 @@
-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);}import*as a11y from'.';describe('engage > a11y',function(){it('should have exports',function(){expect(_typeof(a11y)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(a11y).forEach(function(exportKey){expect(typeof a11y[exportKey]!=='undefined').toBe(true);});});});
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}import*as a11y from'.';describe('engage > a11y',function(){it('should have exports',function(){expect(_typeof(a11y)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(a11y).forEach(function(exportKey){expect(typeof a11y[exportKey]!=='undefined').toBe(true);});});});

package/account/constants/index.js

@@ -0,0 +1 @@
+export{ACCOUNT_PATH,ACCOUNT_PATTERN,ORDERS_PATH,WISH_LIST_PATH,PROFILE_ADDRESS_PATH,PROFILE_PATH}from"./routes";

package/account/constants/routes.js

@@ -0,0 +1 @@
+export var ACCOUNT_PATH='/account';export var ACCOUNT_PATTERN='/account/:tab';export var PROFILE_PATH='/account/profile';export var PROFILE_ADDRESS_PATH='/account/profile/contact';export var ORDERS_PATH='/account/orders';export var WISH_LIST_PATH='/account/wish-list';

package/account/index.js

@@ -0,0 +1 @@
+export*from"./constants";

package/app-rating/actions/showModal.js

@@ -10,10 +10,10 @@ import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGenera
  * @param {boolean} mustShow if the modal must be shown
  * @param {boolean} hasRepeats if the counters has repeats
  * @return {(function(*, *): void)|*}
- */export function showModal(resetAction,increaseAction,mustShow,hasRepeats){return(/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch,getState){var state,platform,reviewLink,appRatingState,isMinDaysBetweenPopupsElapsed,firstModalConfirmed,userGivesFeedback;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:state=getState();platform=getPlatform(state);reviewLink=generateReviewLink(bundleId[platform],platform);// no review link for current platform found -> don't show modal
+ */export function showModal(resetAction,increaseAction,mustShow,hasRepeats){return/*#__PURE__*/function(){var _ref=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(dispatch,getState){var state,platform,reviewLink,appRatingState,isMinDaysBetweenPopupsElapsed,firstModalConfirmed,userGivesFeedback;return _regeneratorRuntime.wrap(function _callee$(_context){while(1){switch(_context.prev=_context.next){case 0:state=getState();platform=getPlatform(state);reviewLink=generateReviewLink(bundleId[platform],platform);// no review link for current platform found -> don't show modal
 if(reviewLink){_context.next=5;break;}return _context.abrupt("return");case 5:if(!mustShow&&hasRepeats&&increaseAction){dispatch(increaseAction());}if(mustShow&&hasRepeats){_context.next=8;break;}return _context.abrupt("return");case 8:appRatingState=getAppRatingState(state);isMinDaysBetweenPopupsElapsed=Date.now()-appRatingState.lastPopupAt>=minDaysBetweenPopups*TIMER_TIMESPAN;if(isMinDaysBetweenPopupsElapsed){_context.next=12;break;}return _context.abrupt("return");case 12:dispatch(resetAction());dispatch(setLastPopupTimestamp());_context.next=16;return dispatch(showModalAction({confirm:'appRating.yes',dismiss:'appRating.no',title:'appRating.title',message:'appRating.message'}));case 16:firstModalConfirmed=_context.sent;track('customEvent',{eventCategory:'appReviewPrompt',eventAction:'decision',eventLabel:firstModalConfirmed?'yes':'no'},state);// user touched yes and we
 // redirect to store
 if(!firstModalConfirmed){_context.next=21;break;}dispatch(redirectTo(reviewLink,true));return _context.abrupt("return");case 21:// user doesn't want to rate
 dispatch(increaseRejectionCount());// we approve for rejection
 if(!askForFeedback){_context.next=29;break;}_context.next=25;return dispatch(showModalAction({confirm:'appRating.yes',dismiss:'appRating.no',title:'appRating.title',message:'appRating.rejectionApprovalMessage'}));case 25:userGivesFeedback=_context.sent;track('customEvent',{eventCategory:'appReviewPrompt',eventAction:'decision_feedback',eventLabel:userGivesFeedback?'yes':'no'},state);// user wants to give feedback
-if(userGivesFeedback){dispatch(redirectTo(feedbackLink));}return _context.abrupt("return");case 29:dispatch(redirectTo(feedbackLink));case 30:case"end":return _context.stop();}}},_callee);}));return function(_x,_x2){return _ref.apply(this,arguments);};}());}
+if(userGivesFeedback){dispatch(redirectTo(feedbackLink));}return _context.abrupt("return");case 29:dispatch(redirectTo(feedbackLink));case 30:case"end":return _context.stop();}}},_callee);}));return function(_x,_x2){return _ref.apply(this,arguments);};}();}

package/cart/index.spec.js

@@ -1 +1 @@
-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);}import*as cart from'.';describe('engage > cart',function(){it('should have exports',function(){expect(_typeof(cart)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(cart).forEach(function(exportKey){expect(typeof cart[exportKey]!=='undefined').toBe(true);});});});
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}import*as cart from'.';describe('engage > cart',function(){it('should have exports',function(){expect(_typeof(cart)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(cart).forEach(function(exportKey){expect(typeof cart[exportKey]!=='undefined').toBe(true);});});});

package/category/components/CategoryList/index.js

@@ -4,4 +4,4 @@ import React from'react';import PropTypes from'prop-types';import{bin2hex}from'@
  * @param {Array} props.categories The categories to display.
  * @param {Array} props.categories The number of rows to prerender.
  * @returns {JSX}
- */var CategoryList=function CategoryList(_ref){var categories=_ref.categories,prerender=_ref.prerender;if(!categories||!categories.length){if(prerender===0){return null;}return React.createElement(SheetList,{className:"".concat(styles," engage__category__category-list")},[].concat(Array(prerender)).map(function(val,index){var key="placeholder-".concat(index);return React.createElement(Placeholder,{height:20,key:key,left:0,top:18,width:220});}));}return React.createElement(SheetList,{className:"".concat(styles," engage__category__category-list")},categories.map(function(category){return React.createElement(Portal,{key:category.id,name:CATEGORY_ITEM,props:{categoryId:category.id}},React.createElement(SheetList.Item,{link:"".concat(CATEGORY_PATH,"/").concat(bin2hex(category.id)),title:category.name,linkState:{categoryId:category.id,title:category.name},testId:category.name}));}));};CategoryList.defaultProps={categories:null,prerender:0};export default CategoryList;
+ */var CategoryList=function CategoryList(_ref){var categories=_ref.categories,prerender=_ref.prerender;if(!categories||!categories.length){if(prerender===0){return null;}return/*#__PURE__*/React.createElement(SheetList,{className:"".concat(styles," engage__category__category-list")},[].concat(Array(prerender)).map(function(val,index){var key="placeholder-".concat(index);return/*#__PURE__*/React.createElement(Placeholder,{height:20,key:key,left:0,top:18,width:220});}));}return/*#__PURE__*/React.createElement(SheetList,{className:"".concat(styles," engage__category__category-list")},categories.map(function(category){return/*#__PURE__*/React.createElement(Portal,{key:category.id,name:CATEGORY_ITEM,props:{categoryId:category.id}},/*#__PURE__*/React.createElement(SheetList.Item,{link:"".concat(CATEGORY_PATH,"/").concat(bin2hex(category.id)),title:category.name,linkState:{categoryId:category.id,title:category.name},testId:category.name}));}));};CategoryList.defaultProps={categories:null,prerender:0};export default CategoryList;

package/category/index.spec.js

@@ -1 +1 @@
-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);}import*as category from'.';describe('engage > category',function(){it('should have exports',function(){expect(_typeof(category)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(category).forEach(function(exportKey){expect(typeof category[exportKey]!=='undefined').toBe(true);});});});
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}import*as category from'.';describe('engage > category',function(){it('should have exports',function(){expect(_typeof(category)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(category).forEach(function(exportKey){expect(typeof category[exportKey]!=='undefined').toBe(true);});});});

package/checkout/index.spec.js

@@ -1 +1 @@
-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);}import*as checkout from'.';describe('engage > checkout',function(){it('should have exports',function(){expect(_typeof(checkout)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(checkout).forEach(function(exportKey){expect(typeof checkout[exportKey]!=='undefined').toBe(true);});});});
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}import*as checkout from'.';describe('engage > checkout',function(){it('should have exports',function(){expect(_typeof(checkout)).toEqual('object');});it('should not do undefined exports',function(){Object.keys(checkout).forEach(function(exportKey){expect(typeof checkout[exportKey]!=='undefined').toBe(true);});});});

package/components/ChipLayout/index.js

@@ -1,4 +1,4 @@
-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 _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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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 debounce from'lodash/debounce';import I18n from'@shopgate/pwa-common/components/I18n';import RippleButton from'@shopgate/pwa-ui-shared/RippleButton';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import styles from"./style";var variables=themeConfig.variables;/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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 debounce from'lodash/debounce';import I18n from'@shopgate/pwa-common/components/I18n';import RippleButton from'@shopgate/pwa-ui-shared/RippleButton';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import styles from"./style";var variables=themeConfig.variables;/**
  * The height of one row.
  * @type {number}
  */export var CHIP_ROW_HEIGHT=34;/**
@@ -6,9 +6,9 @@ function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="s
  * @type {number}
  */export var CHIP_MINIMUM_WIDTH=60;/**
  * The ChipLayout component.
- */var ChipLayout=/*#__PURE__*/function(_Component){_inherits(ChipLayout,_Component);function ChipLayout(){var _getPrototypeOf2;var _this;_classCallCheck(this,ChipLayout);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(ChipLayout)).call.apply(_getPrototypeOf2,[this].concat(args)));_defineProperty(_assertThisInitialized(_this),"processHiddenElementsDebounced",debounce(_this.processHiddenElements,50));return _this;}_createClass(ChipLayout,[{key:"componentDidMount",/**
+ */var ChipLayout=/*#__PURE__*/function(_Component){_inherits(ChipLayout,_Component);var _super=_createSuper(ChipLayout);function ChipLayout(){var _this;_classCallCheck(this,ChipLayout);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_super.call.apply(_super,[this].concat(args));_defineProperty(_assertThisInitialized(_this),"processHiddenElementsDebounced",debounce(_this.processHiddenElements,50));return _this;}_createClass(ChipLayout,[{key:"componentDidMount",value:/**
    * When the component mounts we need to initially process all children.
-   */value:function componentDidMount(){this.processHiddenElementsDebounced();}/**
+   */function componentDidMount(){this.processHiddenElementsDebounced();}/**
    * Eveyry time pathname or other prop changes this callback is called.
    * This funtion will start processing hidden elements in order to check if "more" button
    * should be rendered.
@@ -19,20 +19,20 @@ function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="s
    */},{key:"componentDidUpdate",value:function componentDidUpdate(){this.processHiddenElementsDebounced();}/**
    * Returns the maximum height the container should have.
    * @returns {number}
-   */},{key:"processHiddenElements",/**
+   */},{key:"maxContentHeight",get:function get(){// 8 -> container padding.
+return CHIP_ROW_HEIGHT*this.props.maxRows+8;}/**
+   * Returns the more button styles.
+   * @return {string} The store button class name.
+   */},{key:"moreButtonStyles",get:function get(){if(this.props.invertMoreButton){return styles.moreButtonInverted;}return styles.moreButton;}/**
    * Loops through all children to make sure the more button appears if there is too much content.
-   */value:function processHiddenElements(){var _this2=this;if(!this.containerRef){return;}// Find out if there are overflowing elements.
+   */},{key:"processHiddenElements",value:function processHiddenElements(){var _this2=this;if(!this.containerRef){return;}// Find out if there are overflowing elements.
 var lastVisibleElement=0;var showMoreButton=this.containerRef.scrollHeight>this.containerRef.clientHeight;var containerHeight=this.containerRef.clientHeight;var chips=Array.from(this.layoutRef.children);this.moreButtonRef.style.display=showMoreButton?'block':'none';this.layoutRef.style.minHeight=showMoreButton?"".concat(this.maxContentHeight,"px"):'0px';// If the more button is not visible we don't need to process anything.
 if(!showMoreButton){return;}// Hide or show chips that are hidden due to overflow.
 chips.forEach(function(child,index){var isVisible=child.offsetTop+child.clientHeight<containerHeight;child.setAttribute('style',"display: ".concat(isVisible?'flex':'none',";"));if(isVisible){lastVisibleElement=index;}});// Hide the more button if previous assumption was incorrect.
 if(lastVisibleElement===chips.length-1){this.moreButtonRef.style.display='none';return;}// Hide elements so that the 'more button' has enough space.
 chips.slice(0,lastVisibleElement+1).reverse().every(function(element){var offsetBottom=element.offsetTop+element.clientHeight;if(_this2.moreButtonRef.offsetTop>offsetBottom){return true;}var buttonSpaceRequired=_this2.moreButtonRef.clientWidth+variables.gap.big;var elementRight=_this2.containerRef.clientWidth-(element.offsetLeft+element.clientWidth);var spaceDiff=buttonSpaceRequired-elementRight;var remainingChipWidth=element.clientWidth-spaceDiff;if(remainingChipWidth>CHIP_MINIMUM_WIDTH){element.setAttribute('style',"max-width: ".concat(remainingChipWidth,"px"));return false;}if(element.offsetTop!==chips[lastVisibleElement].offsetTop){element.setAttribute('style','display: none');return false;}element.setAttribute('style','display: none');return true;});}/**
    * Debounced, eg. layout effect
-   */},{key:"render",/**
+   */},{key:"render",value:/**
    * Renders the component.
    * @returns {JSX}
-   */value:function render(){var _this3=this;return React.createElement("div",{ref:function ref(element){_this3.containerRef=element;},className:"".concat(styles.container(this.maxContentHeight)," engage__chip-layout")},React.createElement("div",{ref:function ref(element){_this3.layoutRef=element;},className:styles.layout},this.props.children),React.createElement("div",{ref:function ref(element){_this3.moreButtonRef=element;},className:styles.moreButtonWrapper},React.createElement(RippleButton,{fill:true,type:"plain",className:this.moreButtonStyles,onClick:this.props.handleMoreButton},React.createElement(I18n.Text,{string:this.props.moreLabel}))));}},{key:"maxContentHeight",get:function get(){// 8 -> container padding.
-return CHIP_ROW_HEIGHT*this.props.maxRows+8;}/**
-   * Returns the more button styles.
-   * @return {string} The store button class name.
-   */},{key:"moreButtonStyles",get:function get(){if(this.props.invertMoreButton){return styles.moreButtonInverted;}return styles.moreButton;}}]);return ChipLayout;}(Component);_defineProperty(ChipLayout,"defaultProps",{children:null,handleMoreButton:function handleMoreButton(){},invertMoreButton:false,maxRows:2,moreLabel:'more',pathname:''});export default ChipLayout;
+   */function render(){var _this3=this;return/*#__PURE__*/React.createElement("div",{ref:function ref(element){_this3.containerRef=element;},className:"".concat(styles.container(this.maxContentHeight)," engage__chip-layout")},/*#__PURE__*/React.createElement("div",{ref:function ref(element){_this3.layoutRef=element;},className:styles.layout},this.props.children),/*#__PURE__*/React.createElement("div",{ref:function ref(element){_this3.moreButtonRef=element;},className:styles.moreButtonWrapper},/*#__PURE__*/React.createElement(RippleButton,{fill:true,type:"plain",className:this.moreButtonStyles,onClick:this.props.handleMoreButton},/*#__PURE__*/React.createElement(I18n.Text,{string:this.props.moreLabel}))));}}]);return ChipLayout;}(Component);_defineProperty(ChipLayout,"defaultProps",{children:null,handleMoreButton:function handleMoreButton(){},invertMoreButton:false,maxRows:2,moreLabel:'more',pathname:''});export default ChipLayout;

package/components/ChipLayout/spec.js

@@ -2,4 +2,4 @@ import React from'react';import{mount}from'enzyme';import Chip from'@shopgate/pw
  * Since the component uses the <Measure> component it needs an actual
  * browser to be tested as it needs a full browser that supports styling and
  * width/height calculation.
- */describe('<ChipsLayout />',function(){it('should render with one chip',function(){var Component=React.createElement(ChipsLayout,null,React.createElement(Chip,{id:"some-id"},"foo"));var wrapper=mount(Component);expect(wrapper).toMatchSnapshot();expect(wrapper.find(Chip).length).toEqual(1);expect(wrapper.find(Chip).at(0).find('button').at(1).text()).toEqual('foo');});it('should render with two chips',function(){var Component=React.createElement(ChipsLayout,null,React.createElement(Chip,{id:"some-id"},"foo"),React.createElement(Chip,{id:"some-other-id"},"bar"));var wrapper=mount(Component);expect(wrapper).toMatchSnapshot();expect(wrapper.find(Chip).length).toEqual(2);expect(wrapper.find(Chip).at(0).find('button').at(1).text()).toEqual('foo');expect(wrapper.find(Chip).at(1).find('button').at(1).text()).toEqual('bar');});});
+ */describe('<ChipsLayout />',function(){it('should render with one chip',function(){var Component=/*#__PURE__*/React.createElement(ChipsLayout,null,/*#__PURE__*/React.createElement(Chip,{id:"some-id"},"foo"));var wrapper=mount(Component);expect(wrapper).toMatchSnapshot();expect(wrapper.find(Chip).length).toEqual(1);expect(wrapper.find(Chip).at(0).find('button').at(1).text()).toEqual('foo');});it('should render with two chips',function(){var Component=/*#__PURE__*/React.createElement(ChipsLayout,null,/*#__PURE__*/React.createElement(Chip,{id:"some-id"},"foo"),/*#__PURE__*/React.createElement(Chip,{id:"some-other-id"},"bar"));var wrapper=mount(Component);expect(wrapper).toMatchSnapshot();expect(wrapper.find(Chip).length).toEqual(2);expect(wrapper.find(Chip).at(0).find('button').at(1).text()).toEqual('foo');expect(wrapper.find(Chip).at(1).find('button').at(1).text()).toEqual('bar');});});

package/components/Footer/Footer.js

@@ -1,24 +1,24 @@
-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 _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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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,{PureComponent}from'react';import PropTypes from'prop-types';import Portal from'@shopgate/pwa-common/components/Portal';import UIEvents from'@shopgate/pwa-core/emitters/ui';import{APP_FOOTER_CONTENT_BEFORE,APP_FOOTER_CONTENT_AFTER}from'@shopgate/pwa-common/constants/Portals';import{getAbsoluteHeight,getStyle}from'@shopgate/pwa-common/helpers/dom';import{SHEET_EVENTS}from'@shopgate/pwa-ui-shared/Sheet';import{footer,updateInsetBackgroundColor,updateFooterHeight}from"./Footer.style";var APP_FOOTER_ID='AppFooter';var DATA_IGNORED='data-footer-inset-update-ignore';/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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,{PureComponent}from'react';import PropTypes from'prop-types';import Portal from'@shopgate/pwa-common/components/Portal';import UIEvents from'@shopgate/pwa-core/emitters/ui';import{APP_FOOTER_CONTENT_BEFORE,APP_FOOTER_CONTENT_AFTER}from'@shopgate/pwa-common/constants/Portals';import{getAbsoluteHeight,getStyle}from'@shopgate/pwa-common/helpers/dom';import{SHEET_EVENTS}from'@shopgate/pwa-ui-shared/Sheet';import{footer,updateInsetBackgroundColor,updateFooterHeight}from"./Footer.style";var APP_FOOTER_ID='AppFooter';var DATA_IGNORED='data-footer-inset-update-ignore';/**
  * The footer component.
- */var Footer=/*#__PURE__*/function(_PureComponent){_inherits(Footer,_PureComponent);function Footer(){var _getPrototypeOf2;var _this;_classCallCheck(this,Footer);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_possibleConstructorReturn(this,(_getPrototypeOf2=_getPrototypeOf(Footer)).call.apply(_getPrototypeOf2,[this].concat(args)));_defineProperty(_assertThisInitialized(_this),"ref",React.createRef());_defineProperty(_assertThisInitialized(_this),"hide",function(){if(_this.ref.current){updateFooterHeight(0);}});_defineProperty(_assertThisInitialized(_this),"show",function(){if(_this.ref.current){updateFooterHeight(getAbsoluteHeight(_this.ref.current));}});return _this;}_createClass(Footer,[{key:"componentDidMount",value:function componentDidMount(){var _this2=this;this.performFooterUpdate();var observer=new MutationObserver(function(mutations){var update=mutations.filter(function(mutation){return mutation.target.getAttribute(DATA_IGNORED)!=='true';}).length>0;if(update){_this2.performFooterUpdate();}});observer.observe(this.ref.current,{attributes:true,childList:true,subtree:true});UIEvents.addListener(SHEET_EVENTS.OPEN,this.hide);UIEvents.addListener(SHEET_EVENTS.CLOSE,this.show);}/** @inheritDoc */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(SHEET_EVENTS.OPEN,this.hide);UIEvents.removeListener(SHEET_EVENTS.CLOSE,this.show);}},{key:"getInsetBackgroundColor",/**
+ */var Footer=/*#__PURE__*/function(_PureComponent){_inherits(Footer,_PureComponent);var _super=_createSuper(Footer);function Footer(){var _this;_classCallCheck(this,Footer);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=_super.call.apply(_super,[this].concat(args));_defineProperty(_assertThisInitialized(_this),"ref",/*#__PURE__*/React.createRef());_defineProperty(_assertThisInitialized(_this),"hide",function(){if(_this.ref.current){updateFooterHeight(0);}});_defineProperty(_assertThisInitialized(_this),"show",function(){if(_this.ref.current){updateFooterHeight(getAbsoluteHeight(_this.ref.current));}});return _this;}_createClass(Footer,[{key:"componentDidMount",value:/**
+   * Sets up the DOM Mutation Observer to take care that the footer inset always has the correct
+   * background color, which matches the background color of the last element within the footer.
+   */function componentDidMount(){var _this2=this;this.performFooterUpdate();var observer=new MutationObserver(function(mutations){var update=mutations.filter(function(mutation){return mutation.target.getAttribute(DATA_IGNORED)!=='true';}).length>0;if(update){_this2.performFooterUpdate();}});observer.observe(this.ref.current,{attributes:true,childList:true,subtree:true});UIEvents.addListener(SHEET_EVENTS.OPEN,this.hide);UIEvents.addListener(SHEET_EVENTS.CLOSE,this.show);}/** @inheritDoc */},{key:"componentWillUnmount",value:function componentWillUnmount(){UIEvents.removeListener(SHEET_EVENTS.OPEN,this.hide);UIEvents.removeListener(SHEET_EVENTS.CLOSE,this.show);}},{key:"getInsetBackgroundColor",value:/**
    * Retrieves the background color for the footer inset.
    * @param {NodeList} elements The DOM elements to inspect.
    * @returns {string|null}
-   */value:function getInsetBackgroundColor(elements){var _this3=this;/**
+   */function getInsetBackgroundColor(elements){var _this3=this;/**
      * The background color of the bottom inset needs to identical to the last entry of the footer.
      * So we loop backwards to the elements to find the first visible one.
      */var color=Array.from(elements).reverse().reduce(function(result,element){var ignore=element.getAttribute(DATA_IGNORED)==='true';if(result||ignore){// Nothing to do, since the color was already determined or the element can be ignored.
 return result;}if(element.id===APP_FOOTER_ID){// Inspect core portal.
 return _this3.getInsetBackgroundColor(element.children);}if('clientHeight'in element){// Take the background color of the last visible element from the end of the footer.
 return getStyle(element,'backgroundColor');}// Nothing happened within this loop - proceed with the next one.
-return result;},null);if(color==='rgba(0, 0, 0, 0)'||color==='transparent'){return null;}return color||null;}/** Perform hide action */},{key:"performFooterUpdate",/**
+return result;},null);if(color==='rgba(0, 0, 0, 0)'||color==='transparent'){return null;}return color||null;}/** Perform hide action */},{key:"performFooterUpdate",value:/**
    * Performs an update of the footer: background color, height.
-   */value:function performFooterUpdate(){if(this.ref.current){updateFooterHeight(getAbsoluteHeight(this.ref.current));updateInsetBackgroundColor(this.getInsetBackgroundColor(this.ref.current.children));}}/**
+   */function performFooterUpdate(){if(this.ref.current){updateFooterHeight(getAbsoluteHeight(this.ref.current));updateInsetBackgroundColor(this.getInsetBackgroundColor(this.ref.current.children));}}/**
    * Checks if the footer has visible content.
    * @returns {boolean}
    */},{key:"hasVisibleContent",value:function hasVisibleContent(){if(this.ref.current){var elements=this.ref.current.parentElement.querySelectorAll("div.".concat(footer.toString()," > *:not(#").concat(APP_FOOTER_ID,"), #").concat(APP_FOOTER_ID," > *"));return Array.from(elements).filter(function(element){return element.getAttribute(DATA_IGNORED)!=='true'&&element.clientHeight>0;}).length>0;}return false;}/**
    * @returns {JSX}
-   */},{key:"render",value:function render(){return React.createElement("div",{className:"".concat(footer," engage__footer"),ref:this.ref},React.createElement(Portal,{name:APP_FOOTER_CONTENT_BEFORE}),React.createElement("div",{id:APP_FOOTER_ID},this.props.children),React.createElement(Portal,{name:APP_FOOTER_CONTENT_AFTER}));}}]);return Footer;}(PureComponent);_defineProperty(Footer,"defaultProps",{children:null/**
-   * Sets up the DOM Mutation Observer to take care that the footer inset always has the correct
-   * background color, which matches the background color of the last element within the footer.
-   */});export default Footer;
+   */},{key:"render",value:function render(){return/*#__PURE__*/React.createElement("div",{className:"".concat(footer," engage__footer"),ref:this.ref},/*#__PURE__*/React.createElement(Portal,{name:APP_FOOTER_CONTENT_BEFORE}),/*#__PURE__*/React.createElement("div",{id:APP_FOOTER_ID},this.props.children),/*#__PURE__*/React.createElement(Portal,{name:APP_FOOTER_CONTENT_AFTER}));}}]);return Footer;}(PureComponent);_defineProperty(Footer,"defaultProps",{children:null});export default Footer;

package/components/Footer/__tests__/Footer.spec.js

@@ -1,8 +1,8 @@
-function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}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;}import React from'react';import{mount}from'enzyme';import{getAbsoluteHeight}from'@shopgate/pwa-common/helpers/dom';import UIEvents from'@shopgate/pwa-core/emitters/ui';import{SHEET_EVENTS}from'@shopgate/pwa-ui-shared/Sheet';import{updateInsetBackgroundColor,updateFooterHeight}from"../Footer.style";import Footer from"../Footer";var mutationConstructorSpy=jest.fn();var mutationObserveSpy=jest.fn();/* eslint-disable require-jsdoc, extra-rules/potential-point-free, class-methods-use-this */global.MutationObserver=/*#__PURE__*/function(){function _class(callback){_classCallCheck(this,_class);mutationConstructorSpy(callback);}_createClass(_class,[{key:"observe",value:function observe(element,initObject){mutationObserveSpy(element,initObject);}}]);return _class;}();/* eslint-enable require-jsdoc, extra-rules/potential-point-free, class-methods-use-this */var mockedPortalContent;jest.mock("../Footer.style",function(){var actual=require.requireActual("../Footer.style");return _extends({},actual,{updateInsetBackgroundColor:jest.fn(),updateFooterHeight:jest.fn()});});jest.mock('@shopgate/pwa-core/emitters/ui',function(){return{addListener:jest.fn(),removeListener:jest.fn()};});jest.mock('@shopgate/pwa-common/helpers/dom',function(){var actual=require.requireActual('@shopgate/pwa-common/helpers/dom');return _extends({},actual,{getAbsoluteHeight:jest.fn()});});jest.mock('@shopgate/pwa-common/components/Portal',function(){// eslint-disable-next-line require-jsdoc
-function Portal(){return mockedPortalContent||null;}return Portal;});var FOOTER_CHILD_ID='footer-child';var PORTAL_CONTENT_ID='portal-content';var insetBackgroundUpdateSpy=jest.spyOn(Footer.prototype,'performFooterUpdate');var defaultBackgroundColor='red';var defaultChildren=React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:defaultBackgroundColor}});/**
+function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}import React from'react';import{mount}from'enzyme';import{getAbsoluteHeight}from'@shopgate/pwa-common/helpers/dom';import UIEvents from'@shopgate/pwa-core/emitters/ui';import{SHEET_EVENTS}from'@shopgate/pwa-ui-shared/Sheet';import{updateInsetBackgroundColor,updateFooterHeight}from"../Footer.style";import Footer from"../Footer";var mutationConstructorSpy=jest.fn();var mutationObserveSpy=jest.fn();/* eslint-disable require-jsdoc, extra-rules/potential-point-free, class-methods-use-this */global.MutationObserver=/*#__PURE__*/function(){function _class(callback){_classCallCheck(this,_class);mutationConstructorSpy(callback);}_createClass(_class,[{key:"observe",value:function observe(element,initObject){mutationObserveSpy(element,initObject);}}]);return _class;}();/* eslint-enable require-jsdoc, extra-rules/potential-point-free, class-methods-use-this */var mockedPortalContent;jest.mock("../Footer.style",function(){var actual=require.requireActual("../Footer.style");return _extends({},actual,{updateInsetBackgroundColor:jest.fn(),updateFooterHeight:jest.fn()});});jest.mock('@shopgate/pwa-core/emitters/ui',function(){return{addListener:jest.fn(),removeListener:jest.fn()};});jest.mock('@shopgate/pwa-common/helpers/dom',function(){var actual=require.requireActual('@shopgate/pwa-common/helpers/dom');return _extends({},actual,{getAbsoluteHeight:jest.fn()});});jest.mock('@shopgate/pwa-common/components/Portal',function(){// eslint-disable-next-line require-jsdoc
+function Portal(){return mockedPortalContent||null;}return Portal;});var FOOTER_CHILD_ID='footer-child';var PORTAL_CONTENT_ID='portal-content';var insetBackgroundUpdateSpy=jest.spyOn(Footer.prototype,'performFooterUpdate');var defaultBackgroundColor='red';var defaultChildren=/*#__PURE__*/React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:defaultBackgroundColor}});/**
  * @param {NodeList} children Children for the footer.
  * @returns {JSX}
- */var createComponent=function createComponent(){var children=arguments.length>0&&arguments[0]!==undefined?arguments[0]:defaultChildren;var wrapper=mount(React.createElement("div",null,React.createElement(Footer,null,children)));return wrapper.find(Footer);};/**
+ */var createComponent=function createComponent(){var children=arguments.length>0&&arguments[0]!==undefined?arguments[0]:defaultChildren;var wrapper=mount(/*#__PURE__*/React.createElement("div",null,/*#__PURE__*/React.createElement(Footer,null,children)));return wrapper.find(Footer);};/**
  * @param {Object} wrapper A wrapper.
  * @param {string} id Id of the element to change.
- */var addHeightToWrapperElement=function addHeightToWrapperElement(wrapper,id){var elements=wrapper.instance().ref.current.querySelectorAll("#".concat(id));if(elements){Array.from(elements).forEach(function(element){Object.defineProperty(element,'clientHeight',{get:function get(){return 30;}});});}};describe('<Footer />',function(){beforeEach(function(){jest.clearAllMocks();mockedPortalContent=null;});it('should render the component',function(){var wrapper=createComponent();expect(wrapper).toMatchSnapshot();expect(wrapper.find('Portal')).toHaveLength(2);expect(wrapper.find("div#AppFooter > #".concat(FOOTER_CHILD_ID))).toExist();expect(mutationConstructorSpy).toHaveBeenCalledWith(expect.any(Function));expect(insetBackgroundUpdateSpy).toHaveBeenCalledTimes(1);});describe('.hasVisibleContent()',function(){it('should return FALSE when footer has no visible content',function(){var wrapper=createComponent();expect(wrapper.instance().hasVisibleContent()).toBe(false);});it('should return FALSE when there are components, but they are not visible',function(){mockedPortalContent=React.createElement("div",{id:PORTAL_CONTENT_ID});var wrapper=createComponent();expect(wrapper.instance().hasVisibleContent()).toBe(false);});it('should return FALSE when there are components, but they are supposed to be ignored',function(){mockedPortalContent=React.createElement("div",{id:PORTAL_CONTENT_ID,"data-footer-inset-update-ignore":true});var wrapper=createComponent(null);addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);expect(wrapper.instance().hasVisibleContent()).toBe(false);});it('should return TRUE when the core portal has visible content',function(){var wrapper=createComponent();addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);expect(wrapper.instance().hasVisibleContent()).toBe(true);});it('should return TRUE when the an extension portal has visible content',function(){mockedPortalContent=React.createElement("div",{id:PORTAL_CONTENT_ID});var wrapper=createComponent(null);addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);expect(wrapper.instance().hasVisibleContent()).toBe(true);});});describe('.getInsetBackgroundColor()',function(){it('should return null when there is no visible content',function(){var wrapper=createComponent(null);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(null);});it('should return "red" when there is visible content within the core portal',function(){var wrapper=createComponent();addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(defaultBackgroundColor);});it('should return "blue" when there is visible content within the core portal',function(){var backgroundColor='blue';mockedPortalContent=React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:backgroundColor}});var wrapper=createComponent();addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(backgroundColor);});it('should return "red" when there is visible content within the core portal',function(){var backgroundColor='blue';mockedPortalContent=React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:backgroundColor},"data-footer-inset-update-ignore":true});var wrapper=createComponent();addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(defaultBackgroundColor);});it('should return null when the last visible content in invisible by the background color',function(){var backgroundColor='rgba(0, 0, 0, 0)';mockedPortalContent=React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:backgroundColor}});var wrapper=createComponent();addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(null);});});describe('.performFooterUpdate()',function(){it('should do nothing when the ref is empty',function(){var wrapper=createComponent();wrapper.instance().ref.current=null;updateInsetBackgroundColor.mockClear();wrapper.instance().performFooterUpdate();expect(updateInsetBackgroundColor).not.toHaveBeenCalled();});it('should update the inset background color',function(){var wrapper=createComponent();updateInsetBackgroundColor.mockClear();var instance=wrapper.instance();instance.performFooterUpdate();var backgroundColor=instance.getInsetBackgroundColor(instance.ref.current.children);expect(updateInsetBackgroundColor).toHaveBeenCalledTimes(1);expect(updateInsetBackgroundColor).toHaveBeenCalledWith(backgroundColor);});});describe('MutationObserver',function(){var callback;var instance;beforeEach(function(){var wrapper=createComponent();instance=wrapper.instance();insetBackgroundUpdateSpy.mockClear();var _mutationConstructorS=_slicedToArray(mutationConstructorSpy.mock.calls,1);var _mutationConstructorS2=_slicedToArray(_mutationConstructorS[0],1);callback=_mutationConstructorS2[0];});it('should observer with the correct initialization',function(){expect(mutationObserveSpy).toHaveBeenCalledWith(instance.ref.current,{attributes:true,childList:true,subtree:true});});it('should perform an inset update when the updated DOM element is not ignored',function(){var element=document.createElement('div');callback([{target:element}]);expect(insetBackgroundUpdateSpy).toHaveBeenCalledTimes(1);});it('should not perform an inset update when the updated DOM element is ignored',function(){var element=document.createElement('div');element.setAttribute('data-footer-inset-update-ignore','true');callback([{target:element}]);expect(insetBackgroundUpdateSpy).not.toHaveBeenCalled();});});describe('UI events subscriptions',function(){it('should subscribe / unsubscribe UI events',function(){var wrapper=mount(React.createElement(Footer,null,React.createElement("div",null,"Footer")));var instance=wrapper.instance();expect(UIEvents.addListener).toBeCalledTimes(2);expect(UIEvents.addListener).nthCalledWith(1,SHEET_EVENTS.OPEN,instance.hide);expect(UIEvents.addListener).nthCalledWith(2,SHEET_EVENTS.CLOSE,instance.show);wrapper.unmount();expect(UIEvents.removeListener).toBeCalledTimes(2);expect(UIEvents.removeListener).nthCalledWith(1,SHEET_EVENTS.OPEN,instance.hide);expect(UIEvents.removeListener).nthCalledWith(2,SHEET_EVENTS.CLOSE,instance.show);});});describe('updateFooterHeight',function(){var instance;beforeEach(function(){var wrapper=createComponent();instance=wrapper.instance();});it('should set footer height to zero',function(){instance.hide();expect(updateFooterHeight).toHaveBeenCalledWith(0);});it('should set footer height',function(){getAbsoluteHeight.mockReturnValueOnce('48px');instance.show();expect(updateFooterHeight).toHaveBeenCalledWith('48px');});});});
+ */var addHeightToWrapperElement=function addHeightToWrapperElement(wrapper,id){var elements=wrapper.instance().ref.current.querySelectorAll("#".concat(id));if(elements){Array.from(elements).forEach(function(element){Object.defineProperty(element,'clientHeight',{get:function get(){return 30;}});});}};describe('<Footer />',function(){beforeEach(function(){jest.clearAllMocks();mockedPortalContent=null;});it('should render the component',function(){var wrapper=createComponent();expect(wrapper).toMatchSnapshot();expect(wrapper.find('Portal')).toHaveLength(2);expect(wrapper.find("div#AppFooter > #".concat(FOOTER_CHILD_ID))).toExist();expect(mutationConstructorSpy).toHaveBeenCalledWith(expect.any(Function));expect(insetBackgroundUpdateSpy).toHaveBeenCalledTimes(1);});describe('.hasVisibleContent()',function(){it('should return FALSE when footer has no visible content',function(){var wrapper=createComponent();expect(wrapper.instance().hasVisibleContent()).toBe(false);});it('should return FALSE when there are components, but they are not visible',function(){mockedPortalContent=/*#__PURE__*/React.createElement("div",{id:PORTAL_CONTENT_ID});var wrapper=createComponent();expect(wrapper.instance().hasVisibleContent()).toBe(false);});it('should return FALSE when there are components, but they are supposed to be ignored',function(){mockedPortalContent=/*#__PURE__*/React.createElement("div",{id:PORTAL_CONTENT_ID,"data-footer-inset-update-ignore":true});var wrapper=createComponent(null);addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);expect(wrapper.instance().hasVisibleContent()).toBe(false);});it('should return TRUE when the core portal has visible content',function(){var wrapper=createComponent();addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);expect(wrapper.instance().hasVisibleContent()).toBe(true);});it('should return TRUE when the an extension portal has visible content',function(){mockedPortalContent=/*#__PURE__*/React.createElement("div",{id:PORTAL_CONTENT_ID});var wrapper=createComponent(null);addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);expect(wrapper.instance().hasVisibleContent()).toBe(true);});});describe('.getInsetBackgroundColor()',function(){it('should return null when there is no visible content',function(){var wrapper=createComponent(null);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(null);});it('should return "red" when there is visible content within the core portal',function(){var wrapper=createComponent();addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(defaultBackgroundColor);});it('should return "blue" when there is visible content within the core portal',function(){var backgroundColor='blue';mockedPortalContent=/*#__PURE__*/React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:backgroundColor}});var wrapper=createComponent();addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(backgroundColor);});it('should return "red" when there is visible content within the core portal',function(){var backgroundColor='blue';mockedPortalContent=/*#__PURE__*/React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:backgroundColor},"data-footer-inset-update-ignore":true});var wrapper=createComponent();addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(defaultBackgroundColor);});it('should return null when the last visible content in invisible by the background color',function(){var backgroundColor='rgba(0, 0, 0, 0)';mockedPortalContent=/*#__PURE__*/React.createElement("div",{id:FOOTER_CHILD_ID,style:{backgroundColor:backgroundColor}});var wrapper=createComponent();addHeightToWrapperElement(wrapper,PORTAL_CONTENT_ID);addHeightToWrapperElement(wrapper,FOOTER_CHILD_ID);var elements=wrapper.instance().ref.current.children;expect(wrapper.instance().getInsetBackgroundColor(elements)).toBe(null);});});describe('.performFooterUpdate()',function(){it('should do nothing when the ref is empty',function(){var wrapper=createComponent();wrapper.instance().ref.current=null;updateInsetBackgroundColor.mockClear();wrapper.instance().performFooterUpdate();expect(updateInsetBackgroundColor).not.toHaveBeenCalled();});it('should update the inset background color',function(){var wrapper=createComponent();updateInsetBackgroundColor.mockClear();var instance=wrapper.instance();instance.performFooterUpdate();var backgroundColor=instance.getInsetBackgroundColor(instance.ref.current.children);expect(updateInsetBackgroundColor).toHaveBeenCalledTimes(1);expect(updateInsetBackgroundColor).toHaveBeenCalledWith(backgroundColor);});});describe('MutationObserver',function(){var callback;var instance;beforeEach(function(){var wrapper=createComponent();instance=wrapper.instance();insetBackgroundUpdateSpy.mockClear();var _mutationConstructorS=_slicedToArray(mutationConstructorSpy.mock.calls,1);var _mutationConstructorS2=_slicedToArray(_mutationConstructorS[0],1);callback=_mutationConstructorS2[0];});it('should observer with the correct initialization',function(){expect(mutationObserveSpy).toHaveBeenCalledWith(instance.ref.current,{attributes:true,childList:true,subtree:true});});it('should perform an inset update when the updated DOM element is not ignored',function(){var element=document.createElement('div');callback([{target:element}]);expect(insetBackgroundUpdateSpy).toHaveBeenCalledTimes(1);});it('should not perform an inset update when the updated DOM element is ignored',function(){var element=document.createElement('div');element.setAttribute('data-footer-inset-update-ignore','true');callback([{target:element}]);expect(insetBackgroundUpdateSpy).not.toHaveBeenCalled();});});describe('UI events subscriptions',function(){it('should subscribe / unsubscribe UI events',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Footer,null,/*#__PURE__*/React.createElement("div",null,"Footer")));var instance=wrapper.instance();expect(UIEvents.addListener).toBeCalledTimes(2);expect(UIEvents.addListener).nthCalledWith(1,SHEET_EVENTS.OPEN,instance.hide);expect(UIEvents.addListener).nthCalledWith(2,SHEET_EVENTS.CLOSE,instance.show);wrapper.unmount();expect(UIEvents.removeListener).toBeCalledTimes(2);expect(UIEvents.removeListener).nthCalledWith(1,SHEET_EVENTS.OPEN,instance.hide);expect(UIEvents.removeListener).nthCalledWith(2,SHEET_EVENTS.CLOSE,instance.show);});});describe('updateFooterHeight',function(){var instance;beforeEach(function(){var wrapper=createComponent();instance=wrapper.instance();});it('should set footer height to zero',function(){instance.hide();expect(updateFooterHeight).toHaveBeenCalledWith(0);});it('should set footer height',function(){getAbsoluteHeight.mockReturnValueOnce('48px');instance.show();expect(updateFooterHeight).toHaveBeenCalledWith('48px');});});});

package/components/Form/Builder/Builder.js

@@ -1,4 +1,4 @@
-import _camelCase from"lodash/camelCase";var _defineProperty2;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 _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key];}}return target;}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key];}return target;}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 _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}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,Fragment}from'react';import PropTypes from'prop-types';import{logger}from'@shopgate/pwa-core/helpers';import Portal from'@shopgate/pwa-common/components/Portal';import{BEFORE,AFTER}from'@shopgate/pwa-common/constants/Portals';import{Form}from'..';import ActionListener from"./classes/ActionListener";import{ELEMENT_TYPE_EMAIL,ELEMENT_TYPE_PASSWORD,ELEMENT_TYPE_TEXT,ELEMENT_TYPE_NUMBER,ELEMENT_TYPE_SELECT,ELEMENT_TYPE_COUNTRY,ELEMENT_TYPE_PROVINCE,ELEMENT_TYPE_CHECKBOX,ELEMENT_TYPE_RADIO,ELEMENT_TYPE_DATE,ELEMENT_TYPE_PHONE}from"./Builder.constants";import ElementText from"./ElementText";import ElementSelect from"./ElementSelect";import ElementRadio from"./ElementRadio";import ElementCheckbox from"./ElementCheckbox";import buildFormElements from"./helpers/buildFormElements";import buildFormDefaults from"./helpers/buildFormDefaults";import buildCountryList from"./helpers/buildCountryList";import buildProvinceList from"./helpers/buildProvinceList";import buildValidationErrorList from"./helpers/buildValidationErrorList";/**
+function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj;}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;},_typeof(obj);}import _camelCase from"lodash/camelCase";var _defineProperty2;var _excluded=["validationErrors"];function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen);}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i];}return arr2;}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key];}}return target;}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key];}return target;}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);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}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}});Object.defineProperty(subClass,"prototype",{writable:false});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 _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=_getPrototypeOf(Derived),result;if(hasNativeReflectConstruct){var NewTarget=_getPrototypeOf(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return _possibleConstructorReturn(this,result);};}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}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 _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}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,Fragment}from'react';import PropTypes from'prop-types';import{logger}from'@shopgate/pwa-core/helpers';import Portal from'@shopgate/pwa-common/components/Portal';import{BEFORE,AFTER}from'@shopgate/pwa-common/constants/Portals';import{Form}from'..';import ActionListener from"./classes/ActionListener";import{ELEMENT_TYPE_EMAIL,ELEMENT_TYPE_PASSWORD,ELEMENT_TYPE_TEXT,ELEMENT_TYPE_NUMBER,ELEMENT_TYPE_SELECT,ELEMENT_TYPE_COUNTRY,ELEMENT_TYPE_PROVINCE,ELEMENT_TYPE_CHECKBOX,ELEMENT_TYPE_RADIO,ELEMENT_TYPE_DATE,ELEMENT_TYPE_PHONE}from"./Builder.constants";import ElementText from"./ElementText";import ElementSelect from"./ElementSelect";import ElementRadio from"./ElementRadio";import ElementCheckbox from"./ElementCheckbox";import buildFormElements from"./helpers/buildFormElements";import buildFormDefaults from"./helpers/buildFormDefaults";import buildCountryList from"./helpers/buildCountryList";import buildProvinceList from"./helpers/buildProvinceList";import buildValidationErrorList from"./helpers/buildValidationErrorList";/**
  * Takes a string and converts it to a part to be used in a portal name
  * @package FormBuilder
  * @param {string} s The string to be sanitized
@@ -9,14 +9,17 @@ import _camelCase from"lodash/camelCase";var _defineProperty2;function _typeof(o
  */var emptySelectOption={'':''};/**
  * Takes a form configuration and handles rendering and updates of the form fields.
  * Note: Only one country and one province element is supported per FormBuilder instance.
- */var Builder=/*#__PURE__*/function(_Component){_inherits(Builder,_Component);function Builder(props){var _this;_classCallCheck(this,Builder);_this=_possibleConstructorReturn(this,_getPrototypeOf(Builder).call(this,props));// Prepare internal state
+ */var Builder=/*#__PURE__*/function(_Component){_inherits(Builder,_Component);var _super=_createSuper(Builder);/**
+   * Initializes the component.
+   * @param {Object} props The components props.
+   */function Builder(props){var _this;_classCallCheck(this,Builder);_this=_super.call(this,props);// Prepare internal state
 _defineProperty(_assertThisInitialized(_this),"getFormElementComponent",function(type){return _this.props.elements[type]||Builder.defaultElements[type]||null;});_defineProperty(_assertThisInitialized(_this),"elementSortFunc",function(element1,element2){// Keep current sort order when no specific sort order was set for both
 if(element1.sortOrder===undefined||element2.sortOrder===undefined){return 0;}// Sort in ascending order of sortOrder otherwise
 return element1.sortOrder-element2.sortOrder;});_defineProperty(_assertThisInitialized(_this),"elementChangeHandler",function(elementId,value){// "newState" is the state changes before any form actions have been applied
 var newState=_extends({},_this.state,{formData:_extends({},_this.state.formData,_defineProperty({},elementId,value))});// Handle context sensitive functionality by via "action" listener and use the "new" state
 var updatedNewState=_this.actionListener.notify(elementId,_this.state,newState);// Form actions can append validation errors by adding that field to the new state
 // Split out validation errors from final state and
-var _updatedNewState$vali=updatedNewState.validationErrors,validationErrors=_updatedNewState$vali===void 0?{}:_updatedNewState$vali,finalState=_objectWithoutProperties(updatedNewState,["validationErrors"]);// "hasErrors" is true, when a visible + required field is empty or validation errors appeared!
+var _updatedNewState$vali=updatedNewState.validationErrors,validationErrors=_updatedNewState$vali===void 0?{}:_updatedNewState$vali,finalState=_objectWithoutProperties(updatedNewState,_excluded);// "hasErrors" is true, when a visible + required field is empty or validation errors appeared!
 var hasErrors=Object.keys(validationErrors).length>0;// Check "required" fields for all visible elements and enable rendering on changes
 _this.formElements.forEach(function(formElement){if(!finalState.elementVisibility[formElement.id]||!formElement.required){return;}var tmpVal=finalState.formData[formElement.id];var tmpResult=tmpVal===null||tmpVal===undefined||tmpVal===''||tmpVal===false;hasErrors=hasErrors||tmpResult;});// Handle state internally and send an "onChange" event to parent if this finished
 _this.setState(finalState);// Transform to external structure (unavailable ones will be set undefined)
@@ -26,7 +29,7 @@ hasErrors?Object.keys(validationErrors).map(function(k){return{path:k,message:va
 var Element=_this.getFormElementComponent(element.type);if(!Element){logger.error("Unknown form element type: ".concat(element.type));return null;}// Country and province elements have their data injected, if not already present
 var elementData=element;switch(element.type){case ELEMENT_TYPE_COUNTRY:{elementData.options=element.options||_this.countryList;break;}case ELEMENT_TYPE_PROVINCE:{// Province selection only makes sense with a country being selected, or from custom options
 var countryElement=_this.formElements.find(function(el){return el.type===ELEMENT_TYPE_COUNTRY;});elementData.options=element.options||(countryElement&&_this.state.formData[countryElement.id]?buildProvinceList(_this.state.formData[countryElement.id],// Auto-select with "empty" when not required
-element.required?null:emptySelectOption):{});break;}default:break;}return React.createElement(Element,{name:elementName,element:elementData,errorText:elementErrorText,value:elementValue,visible:elementVisible});});_this.state={elementVisibility:{},formData:{}};// Reorganize form elements into a structure that can be easily rendered
+element.required?null:emptySelectOption):{});break;}default:break;}return/*#__PURE__*/React.createElement(Element,{name:elementName,element:elementData,errorText:elementErrorText,value:elementValue,visible:elementVisible});});_this.state={elementVisibility:{},formData:{}};// Reorganize form elements into a structure that can be easily rendered
 var formElements=buildFormElements(props.config,_this.elementChangeHandler);// Compute defaults
 var formDefaults=buildFormDefaults(formElements,props.defaults);// Assign defaults to state
 _this.state.formData=formDefaults;// Handle fixed visibilities
@@ -39,11 +42,8 @@ var _newState=_this.state;_this.formElements.forEach(function(element){_newState
    * Retrieves a form element REACT component by the given type or null if the type is unknown.
    * @param {string} type The type value of the element to return.
    * @returns {*|ElementText|ElementSelect|ElementCheckbox|ElementRadio|null}
-   */_createClass(Builder,[{key:"render",/**
+   */_createClass(Builder,[{key:"render",value:/**
    * Renders the component based on the given config
    * @return {JSX}
-   */value:function render(){var _this2=this;// Convert validation errors for easier handling
-var validationErrors=buildValidationErrorList(this.props.validationErrors);return React.createElement(Form,{className:_camelCase(this.props.name),onSubmit:this.props.onSubmit},React.createElement("div",{className:this.props.className},this.formElements.map(function(element){return React.createElement(Fragment,{key:"".concat(_this2.props.name,"_").concat(element.id)},React.createElement(Portal,{name:"".concat(sanitize(_this2.props.name),".").concat(sanitize(element.id),".").concat(BEFORE)}),React.createElement(Portal,{name:"".concat(sanitize(_this2.props.name),".").concat(sanitize(element.id))},_this2.renderElement(element,validationErrors[element.id]||'')),React.createElement(Portal,{name:"".concat(sanitize(_this2.props.name),".").concat(sanitize(element.id),".").concat(AFTER)}));})));}}]);return Builder;}(Component);_defineProperty(Builder,"defaultElements",(_defineProperty2={},_defineProperty(_defineProperty2,ELEMENT_TYPE_EMAIL,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_PASSWORD,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_TEXT,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_NUMBER,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_SELECT,ElementSelect),_defineProperty(_defineProperty2,ELEMENT_TYPE_COUNTRY,ElementSelect),_defineProperty(_defineProperty2,ELEMENT_TYPE_PROVINCE,ElementSelect),_defineProperty(_defineProperty2,ELEMENT_TYPE_CHECKBOX,ElementCheckbox),_defineProperty(_defineProperty2,ELEMENT_TYPE_RADIO,ElementRadio),_defineProperty(_defineProperty2,ELEMENT_TYPE_DATE,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_PHONE,ElementText),_defineProperty2));_defineProperty(Builder,"defaultProps",{className:null,defaults:{},elements:Builder.defaultElements,onSubmit:function onSubmit(){},validationErrors:[]/**
-   * Initializes the component.
-   * @param {Object} props The components props.
-   */});export default Builder;
+   */function render(){var _this2=this;// Convert validation errors for easier handling
+var validationErrors=buildValidationErrorList(this.props.validationErrors);return/*#__PURE__*/React.createElement(Form,{className:_camelCase(this.props.name),onSubmit:this.props.onSubmit},/*#__PURE__*/React.createElement("div",{className:this.props.className},this.formElements.map(function(element){return/*#__PURE__*/React.createElement(Fragment,{key:"".concat(_this2.props.name,"_").concat(element.id)},/*#__PURE__*/React.createElement(Portal,{name:"".concat(sanitize(_this2.props.name),".").concat(sanitize(element.id),".").concat(BEFORE)}),/*#__PURE__*/React.createElement(Portal,{name:"".concat(sanitize(_this2.props.name),".").concat(sanitize(element.id))},_this2.renderElement(element,validationErrors[element.id]||'')),/*#__PURE__*/React.createElement(Portal,{name:"".concat(sanitize(_this2.props.name),".").concat(sanitize(element.id),".").concat(AFTER)}));})));}}]);return Builder;}(Component);_defineProperty(Builder,"defaultElements",(_defineProperty2={},_defineProperty(_defineProperty2,ELEMENT_TYPE_EMAIL,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_PASSWORD,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_TEXT,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_NUMBER,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_SELECT,ElementSelect),_defineProperty(_defineProperty2,ELEMENT_TYPE_COUNTRY,ElementSelect),_defineProperty(_defineProperty2,ELEMENT_TYPE_PROVINCE,ElementSelect),_defineProperty(_defineProperty2,ELEMENT_TYPE_CHECKBOX,ElementCheckbox),_defineProperty(_defineProperty2,ELEMENT_TYPE_RADIO,ElementRadio),_defineProperty(_defineProperty2,ELEMENT_TYPE_DATE,ElementText),_defineProperty(_defineProperty2,ELEMENT_TYPE_PHONE,ElementText),_defineProperty2));_defineProperty(Builder,"defaultProps",{className:null,defaults:{},elements:Builder.defaultElements,onSubmit:function onSubmit(){},validationErrors:[]});export default Builder;

package/components/Form/Builder/Builder.spec.js

@@ -1,12 +1,12 @@
-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);}/* eslint-disable extra-rules/no-single-line-objects */import React from'react';import{mount}from'enzyme';import{Builder}from'.';describe('<Builder />',function(){it('should render empty form',function(){var wrapper=mount(React.createElement(Builder,{config:{fields:{}},name:"foo",handleUpdate:function handleUpdate(){}}));expect(wrapper).toMatchSnapshot();});it('should render two text fields',function(){var wrapper=mount(React.createElement(Builder,{config:{fields:{firstName:{label:'foo',type:'text',visible:true},lastName:{label:'bar',type:'text',visible:true}}},name:"foo",handleUpdate:function handleUpdate(){}}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(2);});it('should render invisible field with visibility prop set to false',function(){var wrapper=mount(React.createElement(Builder,{config:{fields:{firstName:{label:'foo',type:'text',visible:false}}},name:"foo",handleUpdate:function handleUpdate(){}}));// The TextField component is hidden by the ElementText component
-expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(0);});it('should modify the element visibility if setVisibilty rule applies',function(){var wrapper=mount(React.createElement(Builder,{config:{fields:{foo:{label:'foo',type:'text',visible:true},bar:{label:'bar',type:'text',actions:[{type:'setVisibility',rules:[{context:'foo',type:'notIn',data:['abc']}]}]}}},name:"foo",handleUpdate:function handleUpdate(){}}));// Both should be marked visible at the beginning.
+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);}/* eslint-disable extra-rules/no-single-line-objects */import React from'react';import{mount}from'enzyme';import{Builder}from'.';describe('<Builder />',function(){it('should render empty form',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Builder,{config:{fields:{}},name:"foo",handleUpdate:function handleUpdate(){}}));expect(wrapper).toMatchSnapshot();});it('should render two text fields',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Builder,{config:{fields:{firstName:{label:'foo',type:'text',visible:true},lastName:{label:'bar',type:'text',visible:true}}},name:"foo",handleUpdate:function handleUpdate(){}}));expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(2);});it('should render invisible field with visibility prop set to false',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Builder,{config:{fields:{firstName:{label:'foo',type:'text',visible:false}}},name:"foo",handleUpdate:function handleUpdate(){}}));// The TextField component is hidden by the ElementText component
+expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(0);});it('should modify the element visibility if setVisibilty rule applies',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Builder,{config:{fields:{foo:{label:'foo',type:'text',visible:true},bar:{label:'bar',type:'text',actions:[{type:'setVisibility',rules:[{context:'foo',type:'notIn',data:['abc']}]}]}}},name:"foo",handleUpdate:function handleUpdate(){}}));// Both should be marked visible at the beginning.
 expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(2);// Simulate user input to the text field.
 wrapper.find('input').first().simulate('change',{target:{value:'abc'}});// Second field should be marked as hidden but be still rendered.
 // The TextField component is only rendered when the ElementText is visible.
-expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(1);});it('should reset value when rule applies',function(){var wrapper=mount(React.createElement(Builder,{config:{fields:{foo:{label:'foo',type:'text',visible:true,"default":'default'},bar:{label:'bar',type:'text',"default":'default',actions:[{type:'setValue',params:{value:'cheat',type:'fixed'},rules:[{context:'foo',type:'notIn',data:['default']}]}]}}},name:"foo",handleUpdate:function handleUpdate(){}}));// Default values should be in the inputs.
+expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(1);});it('should reset value when rule applies',function(){var wrapper=mount(/*#__PURE__*/React.createElement(Builder,{config:{fields:{foo:{label:'foo',type:'text',visible:true,"default":'default'},bar:{label:'bar',type:'text',"default":'default',actions:[{type:'setValue',params:{value:'cheat',type:'fixed'},rules:[{context:'foo',type:'notIn',data:['default']}]}]}}},name:"foo",handleUpdate:function handleUpdate(){}}));// Default values should be in the inputs.
 expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(2);expect(wrapper.find('input').at(0).props().value).toEqual('default');expect(wrapper.find('input').at(1).props().value).toEqual('default');// Simulate text input to trigger rule.
 wrapper.find('input').first().simulate('change',{target:{value:'abc'}});wrapper.update();// Second field should be hidden now.
-expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(2);expect(wrapper.find('input').at(0).props().value).toEqual('abc');expect(wrapper.find('input').at(1).props().value).toEqual('cheat');});it('should call onChange callback when input is changed',function(){var handleUpdate=jest.fn();var wrapper=mount(React.createElement(Builder,{config:{fields:{foo:{label:'foo',type:'text',visible:true,"default":'default'}}},name:"foo",id:"foo",handleUpdate:handleUpdate}));// Should call with initial state.
+expect(wrapper).toMatchSnapshot();expect(wrapper.find('TextField').length).toEqual(2);expect(wrapper.find('input').at(0).props().value).toEqual('abc');expect(wrapper.find('input').at(1).props().value).toEqual('cheat');});it('should call onChange callback when input is changed',function(){var handleUpdate=jest.fn();var wrapper=mount(/*#__PURE__*/React.createElement(Builder,{config:{fields:{foo:{label:'foo',type:'text',visible:true,"default":'default'}}},name:"foo",id:"foo",handleUpdate:handleUpdate}));// Should call with initial state.
 expect(wrapper).toMatchSnapshot();expect(handleUpdate).toHaveBeenCalledWith({foo:'default'},false,[]);handleUpdate.mockClear();// Update input
 wrapper.find('input').first().simulate('change',{target:{value:'abc'}});// Should call with updated state.
 expect(handleUpdate).toHaveBeenCalledWith({foo:'abc'},false,[]);});describe('Builder::elementChangeHandler',function(){it('should take the updated state from action listener',function(){// Create mocked Form builder.

package/components/Form/Builder/ElementCheckbox.js

@@ -3,4 +3,4 @@ import _camelCase from"lodash/camelCase";import React,{memo}from'react';import P
  * @param {Object} props Component props.
  * @param {Object} props.element The data of the element to be rendered
  * @returns {JSX}
- */var ElementCheckbox=function ElementCheckbox(props){var element=props.element,errorText=props.errorText,value=props.value,name=props.name,visible=props.visible;if(!visible){return null;}return React.createElement("div",{className:"".concat(_camelCase(name)," engage__form-checkbox")},React.createElement(Checkbox,{name:name,errorText:errorText,checked:!!value,label:element.label,onChange:element.handleChange,translateErrorText:false}));};ElementCheckbox.defaultProps={value:false,visible:true};export default memo(ElementCheckbox);
+ */var ElementCheckbox=function ElementCheckbox(props){var element=props.element,errorText=props.errorText,value=props.value,name=props.name,visible=props.visible;if(!visible){return null;}return/*#__PURE__*/React.createElement("div",{className:"".concat(_camelCase(name)," engage__form-checkbox")},/*#__PURE__*/React.createElement(Checkbox,{name:name,errorText:errorText,checked:!!value,label:element.label,onChange:element.handleChange,translateErrorText:false}));};ElementCheckbox.defaultProps={value:false,visible:true};export default/*#__PURE__*/memo(ElementCheckbox);

package/components/Form/Builder/ElementRadio.js

@@ -3,4 +3,4 @@ import _camelCase from"lodash/camelCase";import React,{memo}from'react';import P
  * @param {Object} props Component props.
  * @param {Object} props.element The data of the element to be rendered
  * @returns {JSX}
- */var ElementRadio=function ElementRadio(props){var element=props.element,errorText=props.errorText,name=props.name,value=props.value,visible=props.visible;if(!visible){return null;}return React.createElement("div",{className:"".concat(_camelCase(name)," engage__form-radio")},React.createElement(RadioGroup,{name:name,label:element.label,value:value,onChange:element.handleChange,errorText:errorText,isControlled:true,translateErrorText:false},Object.keys(element.options).map(function(itemName){return React.createElement(RadioItem,{key:"".concat(name,"_").concat(itemName),id:"".concat(name,"_").concat(_camelCase(itemName)),name:itemName,label:element.options[itemName]});})));};ElementRadio.defaultProps={value:'',visible:true};export default memo(ElementRadio);
+ */var ElementRadio=function ElementRadio(props){var element=props.element,errorText=props.errorText,name=props.name,value=props.value,visible=props.visible;if(!visible){return null;}return/*#__PURE__*/React.createElement("div",{className:"".concat(_camelCase(name)," engage__form-radio")},/*#__PURE__*/React.createElement(RadioGroup,{name:name,label:element.label,value:value,onChange:element.handleChange,errorText:errorText,isControlled:true,translateErrorText:false},Object.keys(element.options).map(function(itemName){return/*#__PURE__*/React.createElement(RadioItem,{key:"".concat(name,"_").concat(itemName),id:"".concat(name,"_").concat(_camelCase(itemName)),name:itemName,label:element.options[itemName]});})));};ElementRadio.defaultProps={value:'',visible:true};export default/*#__PURE__*/memo(ElementRadio);