@mgdis/mg-components 5.9.1 → 5.10.0

package/dist/components/mg-icon2.js

@@ -240,10 +240,18 @@ const MgIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.__attachShadow();
     /**
      * getIcon
-     *
      * @returns {HTMLElement} icon html
      */
     this.getIcon = () => icons[this.icon]();
+    /**
+     * Method to set default varianStyle props
+     * needeed has stencil doesn't know that props is mutated when updated in prop watcher
+     * @returns {void}
+     */
+    this.setDefaultVariantStyle = () => {
+      if (this.variantStyle === undefined)
+        this.variantStyle = 'background';
+    };
     this.icon = undefined;
     this.size = 'regular';
     this.variant = undefined;
@@ -274,8 +282,7 @@ const MgIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       if (!variants.includes(newValue))
         throw new Error(`<mg-icon> prop "variant" must be one of: ${variants.join(', ')}`);
       else {
-        if (this.variantStyle === undefined)
-          this.variantStyle = 'background';
+        this.setDefaultVariantStyle();
         if (oldValue !== undefined)
           this.classList.delete(`mg-icon--variant-${oldValue}`);
         this.classList.add(`mg-icon--variant-${newValue}`);
@@ -305,7 +312,6 @@ const MgIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Check if props are well configured on init
-   *
    * @returns {void}
    */
   componentWillLoad() {
@@ -317,7 +323,6 @@ const MgIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render component
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-illustrated-message.js

@@ -16,7 +16,6 @@ const MgIllustratedMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {void}
    */
   componentDidLoad() {
@@ -32,7 +31,6 @@ const MgIllustratedMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-checkbox.js

@@ -10,7 +10,6 @@ const mgInputCheckboxCss = ":host{display:block}.mg-input{display:flex;align-ite
 
 /**
  * type CheckboxItem validation function
- *
  * @param {unknown} items Checkbox item
  * @returns {boolean} match item type
  */
@@ -32,7 +31,6 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
     this.hasDisplayedError = false;
     /**
      * Handle input event
-     *
      * @param {InputEvent} event input event
      */
     this.handleInput = (event) => {
@@ -55,7 +53,6 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
     };
     /**
      * get invalid element
-     *
      * @returns {HTMLInputElement} element
      */
     this.getInvalidElement = () => this.inputs.find((input) => input !== null && !input.disabled && !input.checkValidity());
@@ -123,7 +120,6 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -136,7 +132,6 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -153,7 +148,6 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-date.js

@@ -53,7 +53,6 @@ const MgInputDate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     };
     /**
      * get input error code
-     *
      * @returns {null | InputError} error code
      */
     this.getInputError = () => {
@@ -79,7 +78,6 @@ const MgInputDate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     };
     /**
      * Check input errors
-     *
      * @returns {void}
      */
     this.setErrorMessage = () => {
@@ -149,7 +147,6 @@ const MgInputDate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -162,7 +159,6 @@ const MgInputDate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -183,7 +179,6 @@ const MgInputDate$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-numeric.js

@@ -31,7 +31,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     this.hasDisplayedError = false;
     /**
      * Handle input event
-     *
      * @returns {void}
      */
     this.handleInput = () => {
@@ -44,7 +43,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     /**
      * Handle focus event
-     *
      * @returns {void}
      */
     this.handleFocus = () => {
@@ -52,7 +50,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     /**
      * Handle blur event
-     *
      * @returns {void}
      */
     this.handleBlur = () => {
@@ -62,7 +59,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     /**
      * Check if input is valid
-     *
      * @returns {void}
      */
     this.checkValidity = () => {
@@ -73,7 +69,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     /**
      * Set input error message
-     *
      * @returns {void}
      */
     this.setErrorMessage = () => {
@@ -91,7 +86,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     /**
      * Get input error code
-     *
      * @returns {null | InputError} error code
      */
     this.getInputError = () => {
@@ -120,14 +114,12 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     /**
      * Format value based on type
-     *
      * @param {number} value value to format
      * @returns {string} formated local value
      */
     this.formatValue = (value) => (this.type === 'currency' ? localeCurrency(value, this.locale, this.currency) : localeNumber(value, this.locale));
     /**
      * Validate append slot
-     *
      * @returns {void}
      */
     this.validateAppendSlot = () => {
@@ -216,7 +208,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -227,7 +218,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
   /**
    * Displayed value in input
    * Change on focus/blur
-   *
    * @returns {MgInputNumeric['value'] | MgInputNumeric['readonlyValue']} display value
    */
   displayValue() {
@@ -238,7 +228,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -262,7 +251,6 @@ const MgInputNumeric$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-password.js

@@ -87,7 +87,6 @@ const MgInputPassword$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -100,7 +99,6 @@ const MgInputPassword$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -115,7 +113,6 @@ const MgInputPassword$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-radio.js

@@ -10,7 +10,6 @@ const mgInputRadioCss = ":host{display:block}.mg-input{display:flex;align-items:
 
 /**
  * type Option validation function
- *
  * @param {RadioOption} option radio option
  * @returns {boolean} radio option type is valid
  */
@@ -31,7 +30,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     this.hasDisplayedError = false;
     /**
      * Handle input event
-     *
      * @param {event} event input event
      * @returns {void}
      */
@@ -41,7 +39,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     };
     /**
      * Handle blur event
-     *
      * @returns {void}
      */
     this.handleBlur = () => {
@@ -50,7 +47,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     };
     /**
      * Check if input is valid
-     *
      * @returns {void}
      */
     this.checkValidity = () => {
@@ -61,7 +57,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     };
     /**
      * Set input error message
-     *
      * @returns {void}
      */
     this.setErrorMessage = () => {
@@ -74,7 +69,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     };
     /**
      * get invalid element
-     *
      * @returns {HTMLInputElement} element
      */
     this.getInvalidElement = () => this.inputs.find((input) => !input.disabled && !input.readOnly && !input.checkValidity());
@@ -129,7 +123,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -142,7 +135,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -159,7 +151,6 @@ const MgInputRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-select2.js

@@ -10,28 +10,24 @@ const mgInputSelectCss = ":host{display:block}.mg-input{display:flex;align-items
 
 /**
  * Check if item is a well configured option
- *
  * @param {unknown} option select option
  * @returns {boolean} select option type is valid
  */
 const isOption = (option) => typeof option === 'object' && typeof option.title === 'string';
 /**
  * Check if items[] is SelectOption
- *
  * @param {unknown[]} items select option
  * @returns {boolean} select option array type is valid
  */
 const allItemsAreOptions = (items) => Array.isArray(items) && items.every(item => isOption(item));
 /**
  * Check if item is a well configured optgroup
- *
  * @param {unknown} optgroup select option
  * @returns {boolean} select optgroup type is valid
  */
 const isOptGroup = (optgroup) => typeof optgroup === 'object' && typeof optgroup.group === 'string' && allItemsAreOptions(optgroup.options);
 /**
  * Group options
- *
  * @param {(SelectOption | OptGroup)[]} acc reduce accumulator
  * @param {SelectOption} item item to add
  * @param {string} item.group item group
@@ -69,7 +65,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     this.hasDisplayedError = false;
     /**
      * Handle input event
-     *
      * @returns {void}
      */
     this.handleInput = () => {
@@ -79,14 +74,12 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     };
     /**
      * Method to compare item.title with input.value
-     *
      * @param {SelectOption} item item to compare with
      * @returns {boolean} truthy if input.value is an item
      */
     this.isInputValue = (item) => { var _a; return item.title === ((_a = this.input) === null || _a === void 0 ? void 0 : _a.value); };
     /**
      * value props setter
-     *
      * @param {MgInputSelect['value']} newValue value to update with
      * @returns {void}
      */
@@ -96,7 +89,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     };
     /**
      * Update value from input.value
-     *
      * @returns {void}
      */
     this.updateValue = () => {
@@ -123,7 +115,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     };
     /**
      * Input value is disabled
-     *
      * @returns {boolean} truthy if input value is disabled
      */
     this.isDisabledValue = () => { var _a; return allItemsAreOptions(this.options) && ((_a = this.options.find(this.isInputValue)) === null || _a === void 0 ? void 0 : _a.disabled) === true; };
@@ -149,7 +140,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     };
     /**
      * Render option
-     *
      * @param {SelectOption} option to render
      * @returns {HTMLElement} render option
      */
@@ -230,7 +220,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -243,7 +232,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -265,7 +253,6 @@ const MgInputSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-text2.js

@@ -27,7 +27,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.hasDisplayedError = false;
     /**
      * Handle input event
-     *
      * @returns {void}
      */
     this.handleInput = () => {
@@ -39,7 +38,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Handle focus event
-     *
      * @returns {void}
      */
     this.handleFocus = () => {
@@ -48,7 +46,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Handle blur event
-     *
      * @returns {void}
      */
     this.handleBlur = () => {
@@ -60,7 +57,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Check if input is valid
-     *
      * @returns {void}
      */
     this.checkValidity = () => {
@@ -72,7 +68,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Set input error message
-     *
      * @returns {void}
      */
     this.setErrorMessage = () => {
@@ -89,11 +84,10 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Validate pattern configuration
-     *
      * @returns {void}
      */
     this.validatePattern = () => {
-      if (this.pattern &&
+      if (this.pattern !== undefined &&
         typeof this.pattern === 'string' &&
         this.pattern !== '' &&
         (this.patternErrorMessage === undefined || typeof this.patternErrorMessage !== 'string' || this.patternErrorMessage === '')) {
@@ -102,7 +96,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Validate append slot
-     *
      * @returns {void}
      */
     this.validateAppendSlot = () => {
@@ -162,7 +155,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Public method to play input focus
-   *
    * @returns {Promise<void>}
    */
   async setFocus() {
@@ -170,7 +162,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -183,7 +174,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -203,7 +193,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-textarea.js

@@ -54,7 +54,6 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
     /**
      * Get pattern validity
      * Pattern is not defined on textarea field: https://developer.mozilla.org/fr/docs/Web/HTML/Element/Textarea
-     *
      * @returns {boolean} is pattern valid
      */
     this.getPatternValidity = () => this.pattern === undefined || new RegExp(`^${this.pattern}$`, 'u').test(this.value);
@@ -87,7 +86,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
      * Validate pattern configuration
      */
     this.validatePattern = () => {
-      if (this.pattern &&
+      if (this.pattern !== undefined &&
         typeof this.pattern === 'string' &&
         this.pattern !== '' &&
         (this.patternErrorMessage === undefined || typeof this.patternErrorMessage !== 'string' || this.patternErrorMessage === '')) {
@@ -142,7 +141,6 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Public method to display errors
-   *
    * @returns {Promise<void>}
    */
   async displayError() {
@@ -155,7 +153,6 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
    *************/
   /**
    * Check if component props are well configured on init
-   *
    * @returns {ReturnType<typeof setTimeout>} timeout
    */
   componentWillLoad() {
@@ -174,7 +171,6 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-title2.js

@@ -24,7 +24,6 @@ const MgInputTitle = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *************/
   /**
    * Init tag name
-   *
    * @returns {void}
    */
   componentWillLoad() {
@@ -33,7 +32,6 @@ const MgInputTitle = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {

package/dist/components/mg-input-toggle.js

@@ -9,7 +9,6 @@ const mgInputToggleCss = ":host{display:block}.mg-input{display:flex;align-items
 
 /**
  * type Option validation function
- *
  * @param {ToggleValue} option radio option
  * @returns {boolean} toggle option type is valid
  */
@@ -32,7 +31,6 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     this.classIcon = 'mg-input--toggle-icon';
     /**
      * Change checked value
-     *
      * @returns {void}
      */
     this.toggleChecked = () => {
@@ -40,7 +38,6 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     };
     /**
      * Slots validation
-     *
      * @returns {void}
      */
     this.validateSlots = () => {
@@ -128,7 +125,6 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   }
   /**
    * set checked state
-   *
    * @returns {void}
    */
   setChecked() {
@@ -171,7 +167,6 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   }
   /**
    * Render
-   *
    * @returns {HTMLElement} HTML Element
    */
   render() {