@shopgate/engage 7.30.0-alpha.1 → 7.30.0-alpha.11

package/components/Form/Builder/classes/ActionListener.js

@@ -1,90 +1,423 @@
-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 _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _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 _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}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{logger}from'@shopgate/pwa-core/helpers';import{ELEMENT_TYPE_NUMBER,ELEMENT_TYPE_COUNTRY,ELEMENT_TYPE_PROVINCE,ELEMENT_TYPE_CHECKBOX}from"../Builder.constants";import{ACTION_TYPE_UPDATE_PROVINCE_ELEMENT,ACTION_TYPE_SET_VISIBILITY,ACTION_TYPE_SET_VALUE,ACTION_TYPE_TRANSFORM,ACTION_SET_VALUE_FIXED,ACTION_SET_VALUE_COPY_FROM,ACTION_SET_VALUE_LENGTH_OF,ACTION_RULE_TYPE_NOT_IN,ACTION_RULE_TYPE_ONE_OF,ACTION_RULE_TYPE_BOOLEAN,ACTION_RULE_TYPE_REGEX,ACTION_RULE_DATA_TYPES,ACTION_RULES_CONCAT_METHOD_ALL,ACTION_RULES_CONCAT_METHOD_ANY,ACTION_RULES_CONCAT_METHOD_NONE}from"./ActionListener.constants";/**
+import { logger } from '@shopgate/pwa-core/helpers';
+import { ELEMENT_TYPE_NUMBER, ELEMENT_TYPE_COUNTRY, ELEMENT_TYPE_PROVINCE, ELEMENT_TYPE_CHECKBOX } from "../Builder.constants";
+import { ACTION_TYPE_UPDATE_PROVINCE_ELEMENT, ACTION_TYPE_SET_VISIBILITY, ACTION_TYPE_SET_VALUE, ACTION_TYPE_TRANSFORM, ACTION_SET_VALUE_FIXED, ACTION_SET_VALUE_COPY_FROM, ACTION_SET_VALUE_LENGTH_OF, ACTION_RULE_TYPE_NOT_IN, ACTION_RULE_TYPE_ONE_OF, ACTION_RULE_TYPE_BOOLEAN, ACTION_RULE_TYPE_REGEX, ACTION_RULE_DATA_TYPES, ACTION_RULES_CONCAT_METHOD_ALL, ACTION_RULES_CONCAT_METHOD_ANY, ACTION_RULES_CONCAT_METHOD_NONE } from "./ActionListener.constants";
+
+/**
  * ActionListener and handler for the FormBuilder component
- */var ActionListener=/*#__PURE__*/_createClass(/**
-   * Constructor
-   * @param {function(string)} getProvincesList Takes a country code and returns a list of provinces
-   * @param {Object} defaults Form defaults
-   */function ActionListener(getProvincesList,defaults){var _this=this;_classCallCheck(this,ActionListener);/**
+ */
+let ActionListener =
+/**
+ * Constructor
+ * @param {function(string)} getProvincesList Takes a country code and returns a list of provinces
+ * @param {Object} defaults Form defaults
+ */
+function ActionListener(getProvincesList, defaults) {
+  /**
    * Takes the elements to be rendered by the FormBuilder and attaches available action listeners
    * to the component.
    * @param {FormElement[]} elementList List of all elements
-   */_defineProperty(this,"attachAll",function(elementList){// Attach action listeners for element (context) actions
-elementList.forEach(function(element){var elementActions=element.actions;if(element.type===ELEMENT_TYPE_PROVINCE){elementActions=elementActions||[];// Requires a country element to create a "update provinces" action
-var countryElement=elementList.find(function(el){return el.type===ELEMENT_TYPE_COUNTRY;});if(countryElement){// Attach new action, which is always triggered, when the (only) country element changes
-elementActions.push({type:ACTION_TYPE_UPDATE_PROVINCE_ELEMENT,rules:[{context:countryElement.id}]});}}if(elementActions===undefined){return;}// Create listeners for all supported actions
-elementActions.forEach(function(action){var actionRules=action.rules||[];// Always apply action to itself if no rules given
-if(actionRules.length===0){// Define a basic rule if no rules given
-actionRules.push({context:element.id});}// Actions do have a fixed structure which needs to be fulfilled
-var normalizedAction=_extends({},action,{rules:actionRules});// Assign the action listeners to all contexts of the current element
-actionRules.forEach(function(rule){_this.attach(element,normalizedAction,rule);});});});});/**
+   */
+  this.attachAll = elementList => {
+    // Attach action listeners for element (context) actions
+    elementList.forEach(element => {
+      let elementActions = element.actions;
+      if (element.type === ELEMENT_TYPE_PROVINCE) {
+        elementActions = elementActions || [];
+
+        // Requires a country element to create a "update provinces" action
+        const countryElement = elementList.find(el => el.type === ELEMENT_TYPE_COUNTRY);
+        if (countryElement) {
+          // Attach new action, which is always triggered, when the (only) country element changes
+          elementActions.push({
+            type: ACTION_TYPE_UPDATE_PROVINCE_ELEMENT,
+            rules: [{
+              context: countryElement.id
+            }]
+          });
+        }
+      }
+      if (elementActions === undefined) {
+        return;
+      }
+
+      // Create listeners for all supported actions
+      elementActions.forEach(action => {
+        const actionRules = action.rules || [];
+        // Always apply action to itself if no rules given
+        if (actionRules.length === 0) {
+          // Define a basic rule if no rules given
+          actionRules.push({
+            context: element.id
+          });
+        }
+
+        // Actions do have a fixed structure which needs to be fulfilled
+        const normalizedAction = {
+          ...action,
+          rules: actionRules
+        };
+
+        // Assign the action listeners to all contexts of the current element
+        actionRules.forEach(rule => {
+          this.attach(element, normalizedAction, rule);
+        });
+      });
+    });
+  };
+  /**
    * Attaches one or possibly multiple action listeners for the given rule
    * @param {FormElement} element The current element that is modified by the action
    * @param {FormFieldAction} action The action and it's params
    * @param {FormFieldActionRule} rule The rule to check in case the action listener is triggered
-   */_defineProperty(this,"attach",function(element,action,rule){var actionListener;switch(action.type){case ACTION_TYPE_UPDATE_PROVINCE_ELEMENT:{actionListener=_this.createUpdateProvinceElementHandler(element,action);break;}case ACTION_TYPE_SET_VISIBILITY:{// Visibility is special and uses the result of the evaluation itself
-actionListener=_this.createSetVisibilityHandler(element,action);break;}case ACTION_TYPE_SET_VALUE:{actionListener=_this.createEvaluatedHandler(element,action,_this.createSetValueHandler(element,action));break;}case ACTION_TYPE_TRANSFORM:{actionListener=_this.createEvaluatedHandler(element,action,_this.createTransformHandler(element,action));break;}default:return;}_this.register(rule.context,actionListener);});/**
+   */
+  this.attach = (element, action, rule) => {
+    let actionListener;
+    switch (action.type) {
+      case ACTION_TYPE_UPDATE_PROVINCE_ELEMENT:
+        {
+          actionListener = this.createUpdateProvinceElementHandler(element, action);
+          break;
+        }
+      case ACTION_TYPE_SET_VISIBILITY:
+        {
+          // Visibility is special and uses the result of the evaluation itself
+          actionListener = this.createSetVisibilityHandler(element, action);
+          break;
+        }
+      case ACTION_TYPE_SET_VALUE:
+        {
+          actionListener = this.createEvaluatedHandler(element, action, this.createSetValueHandler(element, action));
+          break;
+        }
+      case ACTION_TYPE_TRANSFORM:
+        {
+          actionListener = this.createEvaluatedHandler(element, action, this.createTransformHandler(element, action));
+          break;
+        }
+      default:
+        return;
+    }
+    this.register(rule.context, actionListener);
+  };
+  /**
    * Action listener creator to check all related rules before calling any further action listeners
    * @param {FormElement} element The element for which the listener should be created for
    * @param {FormFieldAction} action The action to be create a listener for
    * @param {Function} actionListener The action listener to call if the rule applies
    * @returns {Function} Returns a function to modify and return the modified state.
-   */_defineProperty(this,"createEvaluatedHandler",function(element,action,actionListener){return function(prevState,nextState){// Apply rules before accepting any changes
-if(!_this.evaluateRules(element,action,nextState)){return nextState;}return actionListener(prevState,nextState);};});/**
+   */
+  this.createEvaluatedHandler = (element, action, actionListener) => (prevState, nextState) => {
+    // Apply rules before accepting any changes
+    if (!this.evaluateRules(element, action, nextState)) {
+      return nextState;
+    }
+    return actionListener(prevState, nextState);
+  };
+  /**
    * Action listener creator to handle "updateCountryChange" action
    * @param {FormElement} provinceEl The element for which the listener should be created for
    * @param {FormFieldAction} action The action to be create a listener for
    * @returns {Function} Returns a function to modify and return the modified state.
-   */_defineProperty(this,"createUpdateProvinceElementHandler",function(provinceEl,action){return function(prevState,nextState){var countryElementId=action.rules[0].context;var countryValue=nextState.formData[countryElementId];var countryDefault=_this.defaults[countryElementId];var newState=_extends({},nextState);// Overwrite province with the form's default, if country matches the default as well
-if(countryValue===countryDefault){newState.formData[provinceEl.id]=_this.defaults[provinceEl.id];}else{// Update province to first or no selection, based on "required" attribute
-newState.formData[provinceEl.id]=!provinceEl.required?'':Object.keys(_this.getProvincesList(countryValue))[0];}return newState;};});/**
+   */
+  this.createUpdateProvinceElementHandler = (provinceEl, action) => (prevState, nextState) => {
+    const countryElementId = action.rules[0].context;
+    const countryValue = nextState.formData[countryElementId];
+    const countryDefault = this.defaults[countryElementId];
+    const newState = {
+      ...nextState
+    };
+
+    // Overwrite province with the form's default, if country matches the default as well
+    if (countryValue === countryDefault) {
+      newState.formData[provinceEl.id] = this.defaults[provinceEl.id];
+    } else {
+      // Update province to first or no selection, based on "required" attribute
+      newState.formData[provinceEl.id] = !provinceEl.required ? '' : Object.keys(this.getProvincesList(countryValue))[0];
+    }
+    return newState;
+  };
+  /**
    * Action listener creator to handle "setVisibility" actions
    * @param {FormElement} element The element for which the listener should be created for
    * @param {FormFieldAction} action The action to be create a listener for
    * @returns {Function} Returns a function to modify and return the modified state.
-   */_defineProperty(this,"createSetVisibilityHandler",function(element,action){return function(prevState,nextState){var newState=_extends({},nextState,{elementVisibility:_extends({},nextState.elementVisibility,_defineProperty({},element.id,_this.evaluateRules(element,action,nextState))),// Copy form data to be able to check changes and all follow up actions
-formData:_extends({},nextState.formData)});if(newState.formData[element.id]===undefined&&newState.elementVisibility[element.id]){newState.formData[element.id]=_this.defaults[element.id];}else if(!newState.elementVisibility[element.id]&&newState.formData[element.id]!==undefined){delete newState.formData[element.id];}// Notify follow up listeners about the current change
-if(nextState.formData[element.id]!==newState.formData[element.id]){newState=_this.notify(element.id,prevState,newState);}return newState;};});/**
+   */
+  this.createSetVisibilityHandler = (element, action) => (prevState, nextState) => {
+    let newState = {
+      ...nextState,
+      elementVisibility: {
+        ...nextState.elementVisibility,
+        [element.id]: this.evaluateRules(element, action, nextState)
+      },
+      // Copy form data to be able to check changes and all follow up actions
+      formData: {
+        ...nextState.formData
+      }
+    };
+    if (newState.formData[element.id] === undefined && newState.elementVisibility[element.id]) {
+      newState.formData[element.id] = this.defaults[element.id];
+    } else if (!newState.elementVisibility[element.id] && newState.formData[element.id] !== undefined) {
+      delete newState.formData[element.id];
+    }
+
+    // Notify follow up listeners about the current change
+    if (nextState.formData[element.id] !== newState.formData[element.id]) {
+      newState = this.notify(element.id, prevState, newState);
+    }
+    return newState;
+  };
+  /**
    * Action listener creator to handle "setValue" actions
    * @param {FormElement} element The element for which the listener should be created for
    * @param {FormFieldAction} action The action to be create a listener for
    * @returns {Function} Returns the modified state.
-   */_defineProperty(this,"createSetValueHandler",function(element,action){return function(prevState,nextState){if(_typeof(action.params)!=='object'||Array.isArray(action.params)){logger.error("Error: Invalid or missing form action in element '".concat(element.id,"'. ")+'Params must be in the format: { "type": string, "value": string }');return nextState;}var value=action.params.value;// Check correctness of value data type
-switch(_typeof(value)){case'boolean':if(element.type!==ELEMENT_TYPE_CHECKBOX){logger.error("Error: Invalid form action param in element '".concat(element.id,"'. ")+"Allowed '".concat(ELEMENT_TYPE_CHECKBOX,"' data type for 'params.value' is: 'boolean'"));return nextState;}break;case'number':if(element.type!==ELEMENT_TYPE_NUMBER){logger.error("Error: Invalid form action param in element '".concat(element.id,"'. ")+"Allowed '".concat(ELEMENT_TYPE_NUMBER,"' data types for 'params.value' are: ")+"'number' and 'string'");return nextState;}break;case'string':if(element.type===ELEMENT_TYPE_CHECKBOX){logger.error("Error: Invalid form action param in element '".concat(element.id,"'. ")+"Allowed '".concat(ELEMENT_TYPE_CHECKBOX,"' data type for 'params.value' is: 'boolean'"));return nextState;}break;default:logger.error("Error: Invalid form action param in element '".concat(element.id,"'. ")+"Can not use '".concat(_typeof(value),"' data for elements of type '").concat(element.type,"'"));return nextState;}// Perform action based on "setValue" type, defined in params
-switch(action.params.type){case ACTION_SET_VALUE_LENGTH_OF:value="".concat(nextState.formData[action.params.value].length);break;case ACTION_SET_VALUE_COPY_FROM:value=nextState.formData[action.params.value];break;case undefined:case ACTION_SET_VALUE_FIXED:break;default:logger.error("Error: Invalid form action param 'type' in element '".concat(element.id,"'. ")+"Allowed param types are: '".concat(ACTION_SET_VALUE_LENGTH_OF,"', ")+"'".concat(ACTION_SET_VALUE_COPY_FROM,"', '").concat(ACTION_SET_VALUE_FIXED,"'"));return nextState;}var newState=_extends({},nextState,{formData:_extends({},nextState.formData,_defineProperty({},element.id,value))});// Notify follow up listeners about the current change, if there are any changes
-if(nextState.formData[element.id]!==value){newState=_this.notify(element.id,prevState,newState);}return newState;};});/**
+   */
+  this.createSetValueHandler = (element, action) => (prevState, nextState) => {
+    if (typeof action.params !== 'object' || Array.isArray(action.params)) {
+      logger.error(`Error: Invalid or missing form action in element '${element.id}'. ` + 'Params must be in the format: { "type": string, "value": string }');
+      return nextState;
+    }
+    let {
+      value
+    } = action.params;
+
+    // Check correctness of value data type
+    switch (typeof value) {
+      case 'boolean':
+        if (element.type !== ELEMENT_TYPE_CHECKBOX) {
+          logger.error(`Error: Invalid form action param in element '${element.id}'. ` + `Allowed '${ELEMENT_TYPE_CHECKBOX}' data type for 'params.value' is: 'boolean'`);
+          return nextState;
+        }
+        break;
+      case 'number':
+        if (element.type !== ELEMENT_TYPE_NUMBER) {
+          logger.error(`Error: Invalid form action param in element '${element.id}'. ` + `Allowed '${ELEMENT_TYPE_NUMBER}' data types for 'params.value' are: ` + "'number' and 'string'");
+          return nextState;
+        }
+        break;
+      case 'string':
+        if (element.type === ELEMENT_TYPE_CHECKBOX) {
+          logger.error(`Error: Invalid form action param in element '${element.id}'. ` + `Allowed '${ELEMENT_TYPE_CHECKBOX}' data type for 'params.value' is: 'boolean'`);
+          return nextState;
+        }
+        break;
+      default:
+        logger.error(`Error: Invalid form action param in element '${element.id}'. ` + `Can not use '${typeof value}' data for elements of type '${element.type}'`);
+        return nextState;
+    }
+
+    // Perform action based on "setValue" type, defined in params
+    switch (action.params.type) {
+      case ACTION_SET_VALUE_LENGTH_OF:
+        value = `${nextState.formData[action.params.value].length}`;
+        break;
+      case ACTION_SET_VALUE_COPY_FROM:
+        value = nextState.formData[action.params.value];
+        break;
+      case undefined:
+      case ACTION_SET_VALUE_FIXED:
+        break;
+      default:
+        logger.error(`Error: Invalid form action param 'type' in element '${element.id}'. ` + `Allowed param types are: '${ACTION_SET_VALUE_LENGTH_OF}', ` + `'${ACTION_SET_VALUE_COPY_FROM}', '${ACTION_SET_VALUE_FIXED}'`);
+        return nextState;
+    }
+    let newState = {
+      ...nextState,
+      formData: {
+        ...nextState.formData,
+        [element.id]: value
+      }
+    };
+
+    // Notify follow up listeners about the current change, if there are any changes
+    if (nextState.formData[element.id] !== value) {
+      newState = this.notify(element.id, prevState, newState);
+    }
+    return newState;
+  };
+  /**
    * Action listener creator to handle "transform" actions
    * @param {FormElement} element The element for which the listener should be created for
    * @param {FormFieldAction} action The action to be create a listener for
    * @returns {Function} Returns a function to modify and return the modified state.
-   */_defineProperty(this,"createTransformHandler",function(element,action){return function(prevState,nextState){/**
+   */
+  this.createTransformHandler = (element, action) => (prevState, nextState) => {
+    /**
      * Takes a string and applies a case function on it
      * @param {string|boolean|number} subject The subject to be transformed
      * @returns {string|boolean|number}
-     */var transform=function transform(subject){// Get optional params to be applied in the transformation process
-var args=action.params.value||[];if(Array.isArray(action.params.value)){args=action.params.value;}switch(_typeof(subject)){case'string':{if(typeof String.prototype[action.params.type]!=='function'&&typeof String[action.params.type]!=='function'){logger.error("Error: Invalid transform function passed to actions 'params.type' "+"attribute in element '".concat(element.id,"'. Must be withing 'String.prototype'!"));return subject;}if(typeof String.prototype[action.params.type]==='function'){return String.prototype[action.params.type].apply(subject,args);}return String[action.params.type](subject);}case'boolean':{if(typeof Boolean.prototype[action.params.type]!=='function'&&typeof Boolean[action.params.type]!=='function'){logger.error("Error: Invalid transform function passed to actions 'params.type' "+"attribute in element '".concat(element.id,"'. Must be withing 'String.prototype'!"));return subject;}if(typeof Boolean.prototype[action.params.type]==='function'){return Boolean.prototype[action.params.type].apply(subject,args);}return Boolean[action.params.type](subject);}case'number':{if(typeof Number.prototype[action.params.type]!=='function'&&typeof Number[action.params.type]!=='function'){logger.error("Error: Invalid transform function passed to actions 'params.type' "+"attribute in element '".concat(element.id,"'. Must be withing 'String.prototype'!"));return subject;}if(typeof Number.prototype[action.params.type]==='function'){return Number.prototype[action.params.type].apply(subject,args);}return Number[action.params.type](subject);}default:logger.error("Error: The given data can not be transformed. Must be of type 'string', "+"'boolean' or 'number'");return subject;}};var newState=_extends({},nextState,{formData:_extends({},nextState.formData,_defineProperty({},element.id,transform(nextState.formData[element.id])))});// Notify follow up listeners about the current change
-if(nextState.formData[element.id]!==newState.formData[element.id]){newState=_this.notify(element.id,prevState,newState);}return newState;};});/**
+     */
+    const transform = subject => {
+      // Get optional params to be applied in the transformation process
+      let args = action.params.value || [];
+      if (Array.isArray(action.params.value)) {
+        args = action.params.value;
+      }
+      switch (typeof subject) {
+        case 'string':
+          {
+            if (typeof String.prototype[action.params.type] !== 'function' && typeof String[action.params.type] !== 'function') {
+              logger.error("Error: Invalid transform function passed to actions 'params.type' " + `attribute in element '${element.id}'. Must be withing 'String.prototype'!`);
+              return subject;
+            }
+            if (typeof String.prototype[action.params.type] === 'function') {
+              return String.prototype[action.params.type].apply(subject, args);
+            }
+            return String[action.params.type](subject);
+          }
+        case 'boolean':
+          {
+            if (typeof Boolean.prototype[action.params.type] !== 'function' && typeof Boolean[action.params.type] !== 'function') {
+              logger.error("Error: Invalid transform function passed to actions 'params.type' " + `attribute in element '${element.id}'. Must be withing 'String.prototype'!`);
+              return subject;
+            }
+            if (typeof Boolean.prototype[action.params.type] === 'function') {
+              return Boolean.prototype[action.params.type].apply(subject, args);
+            }
+            return Boolean[action.params.type](subject);
+          }
+        case 'number':
+          {
+            if (typeof Number.prototype[action.params.type] !== 'function' && typeof Number[action.params.type] !== 'function') {
+              logger.error("Error: Invalid transform function passed to actions 'params.type' " + `attribute in element '${element.id}'. Must be withing 'String.prototype'!`);
+              return subject;
+            }
+            if (typeof Number.prototype[action.params.type] === 'function') {
+              return Number.prototype[action.params.type].apply(subject, args);
+            }
+            return Number[action.params.type](subject);
+          }
+        default:
+          logger.error("Error: The given data can not be transformed. Must be of type 'string', " + "'boolean' or 'number'");
+          return subject;
+      }
+    };
+    let newState = {
+      ...nextState,
+      formData: {
+        ...nextState.formData,
+        [element.id]: transform(nextState.formData[element.id])
+      }
+    };
+
+    // Notify follow up listeners about the current change
+    if (nextState.formData[element.id] !== newState.formData[element.id]) {
+      newState = this.notify(element.id, prevState, newState);
+    }
+    return newState;
+  };
+  /**
    * Evaluates all action rules of a given element action
    *
    * @param {FormElement} element The element of which the action rules should be evaluated
    * @param {FormFieldAction} action The current action to be evaluate rules for
    * @param {Object} nextState The state at the time before the "action" event finished
    * @returns {boolean}
-   */_defineProperty(this,"evaluateRules",function(element,action,nextState){var concatRules=_this.createConcatMethod(action.ruleConcatMethod);var resultInitValue=action.ruleConcatMethod!==ACTION_RULES_CONCAT_METHOD_ANY;var result=resultInitValue;action.rules.forEach(function(rule){var tmpResult=resultInitValue;var ruleType=rule.type;var ruleData=rule.data;// Default to rule type "boolean" and data true when type not given
-if(ruleType===undefined){ruleType=ACTION_RULE_TYPE_BOOLEAN;ruleData=true;}// Check rule validity
-if(!ACTION_RULE_DATA_TYPES[ruleType]){logger.error("Error: Unknown action rule type '".concat(ruleType,"'in element '").concat(element.id,"'"));return;}// Check type of ruleData
-var ruleDataType=ACTION_RULE_DATA_TYPES[ruleType];if(ruleDataType==='array'&&!Array.isArray(ruleData)){logger.error("Error: Invalid FormBuilder action rule in element '".concat(element.id,"': ")+"data must be an 'array' for rule type '".concat(ruleType,"'"));return;}// eslint-disable-next-line valid-typeof
-if(ruleDataType!=='array'&&_typeof(ruleData)!==ruleDataType){logger.error("Error: Invalid FormBuilder action rule in element '".concat(element.id,"': ")+"data must be '".concat(ruleDataType,"' for rule type '").concat(ruleType,"'"));return;}switch(ruleType){case ACTION_RULE_TYPE_ONE_OF:{tmpResult=ruleData.includes(nextState.formData[rule.context]);break;}case ACTION_RULE_TYPE_NOT_IN:{tmpResult=!ruleData.includes(nextState.formData[rule.context]);break;}case ACTION_RULE_TYPE_BOOLEAN:{tmpResult=ruleData;break;}case ACTION_RULE_TYPE_REGEX:{var regexParts=ruleData.split('/');var regexPattern='';var regexParam='';if(regexParts.length===1){var _regexParts=_slicedToArray(regexParts,1);regexPattern=_regexParts[0];}else if(regexParts.length===3){regexParts.shift();var _regexParts2=_slicedToArray(regexParts,2);regexPattern=_regexParts2[0];var _regexParts2$=_regexParts2[1];regexParam=_regexParts2$===void 0?'':_regexParts2$;}else{logger.error("Error: Invalid regex string in action rule in element ".concat(element.id));break;}var regex=new RegExp(regexPattern,regexParam);tmpResult=regex.test(nextState.formData[rule.context]);break;}default:break;}// Concat rules based on the rule concat method of the action
-result=concatRules(result,tmpResult);});return result;});/**
+   */
+  this.evaluateRules = (element, action, nextState) => {
+    const concatRules = this.createConcatMethod(action.ruleConcatMethod);
+    const resultInitValue = action.ruleConcatMethod !== ACTION_RULES_CONCAT_METHOD_ANY;
+    let result = resultInitValue;
+    action.rules.forEach(rule => {
+      let tmpResult = resultInitValue;
+      let ruleType = rule.type;
+      let ruleData = rule.data;
+
+      // Default to rule type "boolean" and data true when type not given
+      if (ruleType === undefined) {
+        ruleType = ACTION_RULE_TYPE_BOOLEAN;
+        ruleData = true;
+      }
+
+      // Check rule validity
+      if (!ACTION_RULE_DATA_TYPES[ruleType]) {
+        logger.error(`Error: Unknown action rule type '${ruleType}'in element '${element.id}'`);
+        return;
+      }
+      // Check type of ruleData
+      const ruleDataType = ACTION_RULE_DATA_TYPES[ruleType];
+      if (ruleDataType === 'array' && !Array.isArray(ruleData)) {
+        logger.error(`Error: Invalid FormBuilder action rule in element '${element.id}': ` + `data must be an 'array' for rule type '${ruleType}'`);
+        return;
+      }
+      // eslint-disable-next-line valid-typeof
+      if (ruleDataType !== 'array' && typeof ruleData !== ruleDataType) {
+        logger.error(`Error: Invalid FormBuilder action rule in element '${element.id}': ` + `data must be '${ruleDataType}' for rule type '${ruleType}'`);
+        return;
+      }
+      switch (ruleType) {
+        case ACTION_RULE_TYPE_ONE_OF:
+          {
+            tmpResult = ruleData.includes(nextState.formData[rule.context]);
+            break;
+          }
+        case ACTION_RULE_TYPE_NOT_IN:
+          {
+            tmpResult = !ruleData.includes(nextState.formData[rule.context]);
+            break;
+          }
+        case ACTION_RULE_TYPE_BOOLEAN:
+          {
+            tmpResult = ruleData;
+            break;
+          }
+        case ACTION_RULE_TYPE_REGEX:
+          {
+            const regexParts = ruleData.split('/');
+            let regexPattern = '';
+            let regexParam = '';
+            if (regexParts.length === 1) {
+              [regexPattern] = regexParts;
+            } else if (regexParts.length === 3) {
+              regexParts.shift();
+              [regexPattern, regexParam = ''] = regexParts;
+            } else {
+              logger.error(`Error: Invalid regex string in action rule in element ${element.id}`);
+              break;
+            }
+            const regex = new RegExp(regexPattern, regexParam);
+            tmpResult = regex.test(nextState.formData[rule.context]);
+            break;
+          }
+        default:
+          break;
+      }
+
+      // Concat rules based on the rule concat method of the action
+      result = concatRules(result, tmpResult);
+    });
+    return result;
+  };
+  /**
    * Creates a concat function that defines how to concatenate action rule results
    *
    * @param {string} method The method defined by the action
    * @returns {Function}
-   */_defineProperty(this,"createConcatMethod",function(method){return function(prev,next){switch(method){case ACTION_RULES_CONCAT_METHOD_NONE:return prev&&!next;case ACTION_RULES_CONCAT_METHOD_ANY:return prev||next;case ACTION_RULES_CONCAT_METHOD_ALL:default:return prev&&next;}};});/**
+   */
+  this.createConcatMethod = method => (prev, next) => {
+    switch (method) {
+      case ACTION_RULES_CONCAT_METHOD_NONE:
+        return prev && !next;
+      case ACTION_RULES_CONCAT_METHOD_ANY:
+        return prev || next;
+      case ACTION_RULES_CONCAT_METHOD_ALL:
+      default:
+        return prev && next;
+    }
+  };
+  /**
    * Adds a "action" listener to a given context element
    *
    * @param {string} elementId the element to listen for
    * @param {Function} handler The listener to call when something has changed
-   */_defineProperty(this,"register",function(elementId,handler){if(!_this.actionListeners[elementId]){_this.actionListeners[elementId]=[];}_this.actionListeners[elementId].push(handler);});/**
+   */
+  this.register = (elementId, handler) => {
+    if (!this.actionListeners[elementId]) {
+      this.actionListeners[elementId] = [];
+    }
+    this.actionListeners[elementId].push(handler);
+  };
+  /**
    * Takes an element id, the state to work with and optional data and notifies all "action"
    * listeners about the change. Every listener can manipulate the state.
    * Returns the new state.
@@ -93,5 +426,19 @@ result=concatRules(result,tmpResult);});return result;});/**
    * @param {Object} prevState The state before any changes took place
    * @param {Object} nextState The state containing all updates before the listeners are executed
    * @returns {Object} The new state after all handlers have been executed.
-   */_defineProperty(this,"notify",function(elementId,prevState,nextState){var newState=nextState;if(_this.actionListeners[elementId]){_this.actionListeners[elementId].forEach(function(notifyListener){// Note: The order of state changes is applied in the same order of listener registration
-newState=notifyListener(prevState,newState);});}return newState;});this.defaults=defaults;this.getProvincesList=getProvincesList;this.actionListeners={};});export default ActionListener;
+   */
+  this.notify = (elementId, prevState, nextState) => {
+    let newState = nextState;
+    if (this.actionListeners[elementId]) {
+      this.actionListeners[elementId].forEach(notifyListener => {
+        // Note: The order of state changes is applied in the same order of listener registration
+        newState = notifyListener(prevState, newState);
+      });
+    }
+    return newState;
+  };
+  this.defaults = defaults;
+  this.getProvincesList = getProvincesList;
+  this.actionListeners = {};
+};
+export default ActionListener;

package/components/Form/Builder/helpers/buildCountryList.js

@@ -1,10 +1,34 @@
-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);}import{logger}from'@shopgate/pwa-core/helpers';import iso3166 from"./iso-3166-2";import{getCountryNames}from"../../../../i18n/countries.helpers";/**
+import { logger } from '@shopgate/pwa-core/helpers';
+import iso3166 from "./iso-3166-2";
+import { getCountryNames } from "../../../../i18n/countries.helpers";
+
+/**
  * Get country list for
  * @param {Object} countryElement Configuration of which form fields to render
  * @param {?Object} optional object to prepend optional choice
  * @return {Object}
- */export default(function(countryElement){var optional=arguments.length>1&&arguments[1]!==undefined?arguments[1]:null;// Check validity of the country element options list "countries"
-if(countryElement.countries!==null&&countryElement.countries!==undefined&&!Array.isArray(countryElement.countries)){logger.error("Error: Invalid property type 'countries' in element "+"'".concat(countryElement.id,"'. Must be 'array', 'null' or 'undefined'"));return{};}// Build country display list for the country element (whitelist)
-// For 'null', 'undefined' and '[]' it shows all countries
-var countryKeys;if(countryElement.countries&&countryElement.countries.length>0){countryKeys=countryElement.countries;}else{countryKeys=Object.keys(iso3166);}var countryList=getCountryNames(countryKeys);// Add a "no selection" element
-if(countryElement.required){return countryList;}return _extends({},optional,{},countryList);});
+ */
+export default (countryElement, optional = null) => {
+  // Check validity of the country element options list "countries"
+  if (countryElement.countries !== null && countryElement.countries !== undefined && !Array.isArray(countryElement.countries)) {
+    logger.error("Error: Invalid property type 'countries' in element " + `'${countryElement.id}'. Must be 'array', 'null' or 'undefined'`);
+    return {};
+  }
+  // Build country display list for the country element (whitelist)
+  // For 'null', 'undefined' and '[]' it shows all countries
+  let countryKeys;
+  if (countryElement.countries && countryElement.countries.length > 0) {
+    countryKeys = countryElement.countries;
+  } else {
+    countryKeys = Object.keys(iso3166);
+  }
+  const countryList = getCountryNames(countryKeys);
+  // Add a "no selection" element
+  if (countryElement.required) {
+    return countryList;
+  }
+  return {
+    ...optional,
+    ...countryList
+  };
+};

package/components/Form/Builder/helpers/buildFormDefaults.js

@@ -1,10 +1,39 @@
-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{ELEMENT_TYPE_CHECKBOX,ELEMENT_TYPE_SELECT}from"../Builder.constants";/**
+import { ELEMENT_TYPE_CHECKBOX, ELEMENT_TYPE_SELECT } from "../Builder.constants";
+
+/**
  * Prepare state of formData for form builder
  * @param {Object} formElements form elements
  * @param {Object} defaults form defaults
  * @returns {Object}
- */export default(function(){var formElements=arguments.length>0&&arguments[0]!==undefined?arguments[0]:[];var defaults=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};var formDefaults={};// Take only those defaults from props, that are actually represented by an element
-formElements.forEach(function(element){var defaultState=element.type===ELEMENT_TYPE_CHECKBOX?false:'';if(element.type===ELEMENT_TYPE_SELECT&&!element["default"]){var _Object$keys=Object.keys(element.options);var _Object$keys2=_slicedToArray(_Object$keys,1);defaultState=_Object$keys2[0];}// Use default from element config as a base
-if(element["default"]!==undefined&&element["default"]!==null){defaultState=element["default"];}// Take defaults from "customAttributes" property or from the higher level, based on element
-if(element.custom&&defaults.customAttributes!==undefined){if(defaults.customAttributes[element.id]!==undefined){defaultState=defaults.customAttributes[element.id];}}else if(!element.custom&&defaults[element.id]!==undefined){defaultState=defaults[element.id];}// Save default into the form state and into defaults property if one was set
-if(defaultState!==undefined){formDefaults[element.id]=defaultState;}});return formDefaults;});
+ */
+export default (formElements = [], defaults = {}) => {
+  const formDefaults = {};
+
+  // Take only those defaults from props, that are actually represented by an element
+  formElements.forEach(element => {
+    let defaultState = element.type === ELEMENT_TYPE_CHECKBOX ? false : '';
+    if (element.type === ELEMENT_TYPE_SELECT && !element.default) {
+      [defaultState] = Object.keys(element.options);
+    }
+
+    // Use default from element config as a base
+    if (element.default !== undefined && element.default !== null) {
+      defaultState = element.default;
+    }
+
+    // Take defaults from "customAttributes" property or from the higher level, based on element
+    if (element.custom && defaults.customAttributes !== undefined) {
+      if (defaults.customAttributes[element.id] !== undefined) {
+        defaultState = defaults.customAttributes[element.id];
+      }
+    } else if (!element.custom && defaults[element.id] !== undefined) {
+      defaultState = defaults[element.id];
+    }
+
+    // Save default into the form state and into defaults property if one was set
+    if (defaultState !== undefined) {
+      formDefaults[element.id] = defaultState;
+    }
+  });
+  return formDefaults;
+};