@oat-sa/tao-core-ui 1.54.2 → 1.55.0

package/dist/form/simpleForm.js

@@ -4,36 +4,36 @@ define(['lodash', 'i18n', 'ui/form/form'], function (_, __, formFactory) { 'use
     __ = __ && Object.prototype.hasOwnProperty.call(__, 'default') ? __['default'] : __;
     formFactory = formFactory && Object.prototype.hasOwnProperty.call(formFactory, 'default') ? formFactory['default'] : formFactory;
 
-    /**
-     * This program is free software; you can redistribute it and/or
-     * modify it under the terms of the GNU General Public License
-     * as published by the Free Software Foundation; under version 2
-     * of the License (non-upgradable).
-     *
-     * This program is distributed in the hope that it will be useful,
-     * but WITHOUT ANY WARRANTY; without even the implied warranty of
-     * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-     * GNU General Public License for more details.
-     *
-     * You should have received a copy of the GNU General Public License
-     * along with this program; if not, write to the Free Software
-     * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
-     *
-     * Copyright (c) 2019 Open Assessment Technologies SA ;
+    /**
+     * This program is free software; you can redistribute it and/or
+     * modify it under the terms of the GNU General Public License
+     * as published by the Free Software Foundation; under version 2
+     * of the License (non-upgradable).
+     *
+     * This program is distributed in the hope that it will be useful,
+     * but WITHOUT ANY WARRANTY; without even the implied warranty of
+     * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+     * GNU General Public License for more details.
+     *
+     * You should have received a copy of the GNU General Public License
+     * along with this program; if not, write to the Free Software
+     * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+     *
+     * Copyright (c) 2019 Open Assessment Technologies SA ;
      */
-    /**
-     * @typedef {formConfig} simpleFormConfig Defines the config entries available to setup a form
-     * @property {String} [submitText] - The caption of the submit button
-     * @property {String} [submitIcon] - The icon of the submit button
-     * @property {String} [resetText] - The caption of the reset button
-     * @property {String} [resetIcon] - The icon of the reset button
-     * @property {Boolean} [submit] - Activate the submit button
-     * @property {Boolean} [reset] - Activate the reset button
+    /**
+     * @typedef {formConfig} simpleFormConfig Defines the config entries available to setup a form
+     * @property {String} [submitText] - The caption of the submit button
+     * @property {String} [submitIcon] - The icon of the submit button
+     * @property {String} [resetText] - The caption of the reset button
+     * @property {String} [resetIcon] - The icon of the reset button
+     * @property {Boolean} [submit] - Activate the submit button
+     * @property {Boolean} [reset] - Activate the reset button
      */
 
-    /**
-     * Default config values
-     * @type {simpleFormConfig}
+    /**
+     * Default config values
+     * @type {simpleFormConfig}
      */
 
     var defaultConfig = {
@@ -44,50 +44,50 @@ define(['lodash', 'i18n', 'ui/form/form'], function (_, __, formFactory) { 'use
       submit: true,
       reset: true
     };
-    /**
-     * Builds a simple form component, that contains at least a submit button
-     *
-     * @example
-     *  const container = $('.my-container', $container);
-     *
-     *  const config = {
-     *      title: 'My fancy form',
-     *      submitText: 'Publish',
-     *      widgets: [{
-     *          widget: widgetDefinitions.TEXTBOX
-     *          uri: 'nickname',
-     *          label: 'Name',
-     *          required: true
-     *      }, {
-     *          widget: widgetDefinitions.TEXTAREA
-     *          uri: 'comment',
-     *          label: 'Comment',
-     *          required: true
-     *      }]
-     *  };
-     *
-     *  const form = formFactory(container, config)
-     *      .on('submit', function(values) {
-     *          // ...
-     *      });
-     *
-     * @param {HTMLElement|String} container
-     * @param {simpleFormConfig} config
-     * @param {String} [config.submitText] - The caption of the submit button
-     * @param {String} [config.submitIcon] - The icon of the submit button
-     * @param {String} [config.resetText] - The caption of the reset button
-     * @param {String} [config.resetIcon] - The icon of the reset button
-     * @param {Boolean} [config.submit] - Activate the submit button
-     * @param {Boolean} [config.reset] - Activate the reset button
-     * @param {String} [config.title] - An optional title for the form (default none)
-     * @param {String} [config.formAction] - The url the form is targeting (default '#')
-     * @param {String} [config.formMethod] - The HTTP method the form should use (default 'get')
-     * @param {widgetConfig[]} [config.widgets] - The list of widgets to set in the form (default none)
-     * @param {buttonConfig[]} [config.buttons] - The list of buttons to set in the form (default none)
-     * @param {Object} [config.values] - Initial values for the widgets
-     * @param {Object} [config.ranges] - An optional list of ranges for the widgets (@see widgetConfig.range)
-     * @returns {form}
-     * @fires ready - When the component is ready to work
+    /**
+     * Builds a simple form component, that contains at least a submit button
+     *
+     * @example
+     *  const container = $('.my-container', $container);
+     *
+     *  const config = {
+     *      title: 'My fancy form',
+     *      submitText: 'Publish',
+     *      widgets: [{
+     *          widget: widgetDefinitions.TEXTBOX
+     *          uri: 'nickname',
+     *          label: 'Name',
+     *          required: true
+     *      }, {
+     *          widget: widgetDefinitions.TEXTAREA
+     *          uri: 'comment',
+     *          label: 'Comment',
+     *          required: true
+     *      }]
+     *  };
+     *
+     *  const form = formFactory(container, config)
+     *      .on('submit', function(values) {
+     *          // ...
+     *      });
+     *
+     * @param {HTMLElement|String} container
+     * @param {simpleFormConfig} config
+     * @param {String} [config.submitText] - The caption of the submit button
+     * @param {String} [config.submitIcon] - The icon of the submit button
+     * @param {String} [config.resetText] - The caption of the reset button
+     * @param {String} [config.resetIcon] - The icon of the reset button
+     * @param {Boolean} [config.submit] - Activate the submit button
+     * @param {Boolean} [config.reset] - Activate the reset button
+     * @param {String} [config.title] - An optional title for the form (default none)
+     * @param {String} [config.formAction] - The url the form is targeting (default '#')
+     * @param {String} [config.formMethod] - The HTTP method the form should use (default 'get')
+     * @param {widgetConfig[]} [config.widgets] - The list of widgets to set in the form (default none)
+     * @param {buttonConfig[]} [config.buttons] - The list of buttons to set in the form (default none)
+     * @param {Object} [config.values] - Initial values for the widgets
+     * @param {Object} [config.ranges] - An optional list of ranges for the widgets (@see widgetConfig.range)
+     * @returns {form}
+     * @fires ready - When the component is ready to work
      */
 
     function simpleFormFactory(container, config) {

package/dist/form/validator/css/validator.css

@@ -1,9 +1,9 @@
-/*
-Usage:
-- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
-   if 3 colors used then the position of each will be 33,33%
-- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
-   first param - color, second - position. Also you can use px or other valid units for set position.
+/*
+Usage:
+- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
+   if 3 colors used then the position of each will be 33,33%
+- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
+   first param - color, second - position. Also you can use px or other valid units for set position.
 */
 /* based on "visually-hidden" mixin in LDS for accessibility goals */
 /* Do not edit */
@@ -19,5 +19,5 @@ Usage:
     border-color: #ba122b;
     color: #ba122b;
 }
-
+
 /*# sourceMappingURL=validator.css.map */

package/dist/form/validator/renderer.js

@@ -21,24 +21,24 @@ define(['lodash', 'ui/component', 'handlebars', 'i18n', 'lib/dompurify/purify',
     hb.registerHelper('__', function (key) {
       return __(key);
     });
-    /**
-     * Register dompurify helper
-     *
-     * https://github.com/cure53/DOMPurify
-     * with config SAFE_FOR_TEMPLATES: true
-     * to make output safe for template systems
+    /**
+     * Register dompurify helper
+     *
+     * https://github.com/cure53/DOMPurify
+     * with config SAFE_FOR_TEMPLATES: true
+     * to make output safe for template systems
      */
 
     hb.registerHelper('dompurify', function (context) {
       return DOMPurify.sanitize(context);
     });
-    /**
-     * Register join helper
-     *
-     * Example :
-     * var values = {a:v1, b:v2, c:v3};
-     * Using {{{join attributes '=' ' ' '"'}}} will return : a="v1" b="v2" c="v3"
-     * Using {{{join values null ' or ' '*'}}} will return : *v1* or *v2* or *v3*
+    /**
+     * Register join helper
+     *
+     * Example :
+     * var values = {a:v1, b:v2, c:v3};
+     * Using {{{join attributes '=' ' ' '"'}}} will return : a="v1" b="v2" c="v3"
+     * Using {{{join values null ' or ' '*'}}} will return : *v1* or *v2* or *v3*
      */
 
     hb.registerHelper('join', function (arr, keyValueGlue, fragmentGlue, wrapper) {
@@ -121,7 +121,7 @@ define(['lodash', 'ui/component', 'handlebars', 'i18n', 'lib/dompurify/purify',
     if (helper = helpers.message) { stack1 = helper.call(depth0, {hash:{},data:data}); }
     else { helper = (depth0 && depth0.message); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
     buffer += escapeExpression(stack1)
-      + "</div>\r\n";
+      + "</div>\n";
     return buffer;
     });
   function messageTpl(data, options, asString) {
@@ -138,66 +138,66 @@ define(['lodash', 'ui/component', 'handlebars', 'i18n', 'lib/dompurify/purify',
   helpers = this.merge(helpers, Handlebars.helpers);  
 
 
-    return "<div class=\"form-validator\"></div>\r\n";
+    return "<div class=\"form-validator\"></div>\n";
     });
   function validatorTpl(data, options, asString) {
     var html = Template$1(data, options);
     return (asString || true) ? html : $(html);
   }
 
-  /**
-   * This program is free software; you can redistribute it and/or
-   * modify it under the terms of the GNU General Public License
-   * as published by the Free Software Foundation; under version 2
-   * of the License (non-upgradable).
-   *
-   * This program is distributed in the hope that it will be useful,
-   * but WITHOUT ANY WARRANTY; without even the implied warranty of
-   * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-   * GNU General Public License for more details.
-   *
-   * You should have received a copy of the GNU General Public License
-   * along with this program; if not, write to the Free Software
-   * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
-   *
-   * Copyright (c) 2019 Open Assessment Technologies SA ;
+  /**
+   * This program is free software; you can redistribute it and/or
+   * modify it under the terms of the GNU General Public License
+   * as published by the Free Software Foundation; under version 2
+   * of the License (non-upgradable).
+   *
+   * This program is distributed in the hope that it will be useful,
+   * but WITHOUT ANY WARRANTY; without even the implied warranty of
+   * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+   * GNU General Public License for more details.
+   *
+   * You should have received a copy of the GNU General Public License
+   * along with this program; if not, write to the Free Software
+   * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+   *
+   * Copyright (c) 2019 Open Assessment Technologies SA ;
    */
-  /**
-   * Some default config
-   * @type {Object}
+  /**
+   * Some default config
+   * @type {Object}
    */
 
   var defaults = {};
-  /**
-   * Builds a renderer component for the validation messages.
-   *
-   * @example
-   *  const $container = $('.my-container');
-   *  const validatorRenderer = validatorRendererFactory($container);
-   *
-   *  const messages = [
-   *      'An error occurred!',
-   *      'Please check your input'
-   *  ];
-   *
-   *  if (isInvalid()) {
-   *      validatorRenderer.display(messages);
-   *  } else {
-   *      validatorRenderer.clear();
-   *  }
-   *
-   * @param {HTMLElement|String} container
-   * @param {Object} config
-   * @returns {validatorRenderer}
-   * @fires ready - When the component is ready to work
+  /**
+   * Builds a renderer component for the validation messages.
+   *
+   * @example
+   *  const $container = $('.my-container');
+   *  const validatorRenderer = validatorRendererFactory($container);
+   *
+   *  const messages = [
+   *      'An error occurred!',
+   *      'Please check your input'
+   *  ];
+   *
+   *  if (isInvalid()) {
+   *      validatorRenderer.display(messages);
+   *  } else {
+   *      validatorRenderer.clear();
+   *  }
+   *
+   * @param {HTMLElement|String} container
+   * @param {Object} config
+   * @returns {validatorRenderer}
+   * @fires ready - When the component is ready to work
    */
 
   function validatorRendererFactory(container, config) {
     var api = {
-      /**
-       * Displays messages
-       * @param {String|String[]} messages
-       * @returns {component}
+      /**
+       * Displays messages
+       * @param {String|String[]} messages
+       * @returns {component}
        */
       display: function display(messages) {
         var $element = this.getElement();
@@ -219,9 +219,9 @@ define(['lodash', 'ui/component', 'handlebars', 'i18n', 'lib/dompurify/purify',
         return this;
       },
 
-      /**
-       * Clears all messages
-       * @returns {component}
+      /**
+       * Clears all messages
+       * @returns {component}
        */
       clear: function clear() {
         if (this.is('rendered')) {
@@ -244,8 +244,8 @@ define(['lodash', 'ui/component', 'handlebars', 'i18n', 'lib/dompurify/purify',
       if (this.getConfig().messages) {
         this.display(this.getConfig().messages);
       }
-      /**
-       * @event ready
+      /**
+       * @event ready
        */
 
 

package/dist/form/validator/validator.js

@@ -77,36 +77,36 @@ define(['lodash', 'i18n'], function (_, __) { 'use strict';
     };
   }
 
-  /**
-   * @typedef {Object} validationRule Defines a validation rule to apply on a value.
-   * @property {String} id - The validation identifier
-   * @property {RegExp|Function|String|String[]} predicate - The validation rule to apply on the value.
-   *                                                         It could be either a RegExp or a Function.
-   *                                                         The function must return a boolean value,
-   *                                                         it can wrap it in a Promise too.
-   * @property {String} [message] - The message returned in case of failed validation
-   * @property {Number} [precedence] - The precedence order for sorting
+  /**
+   * @typedef {Object} validationRule Defines a validation rule to apply on a value.
+   * @property {String} id - The validation identifier
+   * @property {RegExp|Function|String|String[]} predicate - The validation rule to apply on the value.
+   *                                                         It could be either a RegExp or a Function.
+   *                                                         The function must return a boolean value,
+   *                                                         it can wrap it in a Promise too.
+   * @property {String} [message] - The message returned in case of failed validation
+   * @property {Number} [precedence] - The precedence order for sorting
    */
 
-  /**
-   * @typedef {Object} validatorConfig Defines the config entries available to setup a form widget validator
-   * @property {validationRule[]} validations - The list of validations to apply
-   * @property {String} defaultMessage - The default message returned when a validation fails and no message is set
+  /**
+   * @typedef {Object} validatorConfig Defines the config entries available to setup a form widget validator
+   * @property {validationRule[]} validations - The list of validations to apply
+   * @property {String} defaultMessage - The default message returned when a validation fails and no message is set
    */
 
-  /**
-   * Defaults config for the validator
-   * @type {validatorConfig}
+  /**
+   * Defaults config for the validator
+   * @type {validatorConfig}
    */
 
   var defaults = {
     defaultMessage: __('Invalid input')
   };
-  /**
-   * Validates a value
-   * @param {String} value
-   * @param {validationRule} validation
-   * @returns {Boolean|Promise}
+  /**
+   * Validates a value
+   * @param {String} value
+   * @param {validationRule} validation
+   * @returns {Boolean|Promise}
    */
 
   function validateValue(value, validation) {
@@ -120,67 +120,67 @@ define(['lodash', 'i18n'], function (_, __) { 'use strict';
 
     return validation.predicate === value;
   }
-  /**
-   * Compares validation rules
-   * @param {validationRule} a
-   * @param {validationRule} b
-   * @returns {Number}
+  /**
+   * Compares validation rules
+   * @param {validationRule} a
+   * @param {validationRule} b
+   * @returns {Number}
    */
 
 
   function compareRule(a, b) {
     return (a && a.precedence || 0) - (b && b.precedence || 0);
   }
-  /**
-   * Creates a simple form widget's validator.
-   * It manages and applies a collection of validation rules on a value.
-   *
-   * @example
-   *  const validator = validatorFactory({
-   *      defaultMessage: 'An error occurred!',
-   *      validations: [{
-   *          id: 'numeric',
-   *          message: 'This field must be numerical',
-   *          predicate: /^\d+$/,
-   *          precedence: 2
-   *      }, {
-   *          id: 'required',
-   *          message: 'This field is required',
-   *          predicate:  value => value.length > 0,
-   *          precedence: 1
-   *      }, {
-   *          id: 'domain',
-   *          predicate: value => (parseInt(value, 10) || 0) <= 10,
-   *          precedence: 3
-   *      }]
-   *  });
-   *
-   *  validator.validate('100')
-   *      .then(() => {
-   *          // ...
-   *      })
-   *      .catch(messages => {
-   *          // ...
-   *      });
-   *
-   * @param {validatorConfig} config
-   * @param {validationRule[]} [config.validations] - The list of validation rules to apply
-   * @param {String} [config.defaultMessage] - The default message returned when a validation fails and no message is set
-   * @returns {validator}
+  /**
+   * Creates a simple form widget's validator.
+   * It manages and applies a collection of validation rules on a value.
+   *
+   * @example
+   *  const validator = validatorFactory({
+   *      defaultMessage: 'An error occurred!',
+   *      validations: [{
+   *          id: 'numeric',
+   *          message: 'This field must be numerical',
+   *          predicate: /^\d+$/,
+   *          precedence: 2
+   *      }, {
+   *          id: 'required',
+   *          message: 'This field is required',
+   *          predicate:  value => value.length > 0,
+   *          precedence: 1
+   *      }, {
+   *          id: 'domain',
+   *          predicate: value => (parseInt(value, 10) || 0) <= 10,
+   *          precedence: 3
+   *      }]
+   *  });
+   *
+   *  validator.validate('100')
+   *      .then(() => {
+   *          // ...
+   *      })
+   *      .catch(messages => {
+   *          // ...
+   *      });
+   *
+   * @param {validatorConfig} config
+   * @param {validationRule[]} [config.validations] - The list of validation rules to apply
+   * @param {String} [config.defaultMessage] - The default message returned when a validation fails and no message is set
+   * @returns {validator}
    */
 
 
   function validatorFactory(config) {
     var validations = new Map();
-    /**
-     * @typedef {Object} validator
+    /**
+     * @typedef {Object} validator
      */
 
     var validator = {
-      /**
-       * Runs all validation rules on a value
-       * @param {String} value
-       * @returns {Promise} Will provide the list of error messages if the validation failed.
+      /**
+       * Runs all validation rules on a value
+       * @param {String} value
+       * @returns {Promise} Will provide the list of error messages if the validation failed.
        */
       validate: function validate(value) {
         var rules = this.getValidations();
@@ -202,11 +202,11 @@ define(['lodash', 'i18n'], function (_, __) { 'use strict';
         });
       },
 
-      /**
-       * Adds a validation rule
-       * @param {validationRule} validation
-       * @returns {validator}
-       * @throws {TypeError} if the validation object is not valid
+      /**
+       * Adds a validation rule
+       * @param {validationRule} validation
+       * @returns {validator}
+       * @throws {TypeError} if the validation object is not valid
        */
       addValidation: function addValidation(validation) {
         if (!_.isPlainObject(validation)) {
@@ -225,18 +225,18 @@ define(['lodash', 'i18n'], function (_, __) { 'use strict';
         return this;
       },
 
-      /**
-       * Gets a validation rule by its identifier
-       * @param {String} id
-       * @returns {validationRule|null}
+      /**
+       * Gets a validation rule by its identifier
+       * @param {String} id
+       * @returns {validationRule|null}
        */
       getValidation: function getValidation(id) {
         return validations.get(id) || null;
       },
 
-      /**
-       * Gets the list of validation rules.
-       * @returns {validationRule[]}
+      /**
+       * Gets the list of validation rules.
+       * @returns {validationRule[]}
        */
       getValidations: function getValidations() {
         var list = [];
@@ -258,19 +258,19 @@ define(['lodash', 'i18n'], function (_, __) { 'use strict';
         return list;
       },
 
-      /**
-       * Removes a validation rule
-       * @param {String} id
-       * @returns {validator}
+      /**
+       * Removes a validation rule
+       * @param {String} id
+       * @returns {validator}
        */
       removeValidation: function removeValidation(id) {
         validations.delete(id);
         return this;
       },
 
-      /**
-       * Removes all validation rules
-       * @returns {validator}
+      /**
+       * Removes all validation rules
+       * @returns {validator}
        */
       removeValidations: function removeValidations() {
         validations.clear();

package/dist/form/widget/css/widget.css

@@ -1,9 +1,9 @@
-/*
-Usage:
-- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
-   if 3 colors used then the position of each will be 33,33%
-- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
-   first param - color, second - position. Also you can use px or other valid units for set position.
+/*
+Usage:
+- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
+   if 3 colors used then the position of each will be 33,33%
+- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
+   first param - color, second - position. Also you can use px or other valid units for set position.
 */
 /* based on "visually-hidden" mixin in LDS for accessibility goals */
 /* Do not edit */
@@ -60,5 +60,5 @@ Usage:
     border-color: #ba122b;
     color: #ba122b;
 }
-
+
 /*# sourceMappingURL=widget.css.map */