@mgdis/mg-components 6.15.0 → 6.17.0

package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js

@@ -4,7 +4,6 @@ import { checkboxTypes, SectionKind } from "./mg-input-checkbox.conf";
 import { MgInputCheckboxList } from "./MgInputCheckboxList";
 import { classDisabled, classReadonly, classFieldset, classVerticalList } from "../mg-input/mg-input.conf";
 import { initLocales } from "../../../../locales";
-import { defineErrorMessage } from "../mg-input/mg-input.utils";
 import { Status } from "../../mg-tabs/mg-tabs.conf";
 /**
  * type CheckboxItem validation function
@@ -198,18 +197,8 @@ export class MgInputCheckbox {
          * Check if input is valid
          */
         this.checkValidity = () => {
-            this.setValidity(this.readonly || this.disabled || (this.hasInputValue() && !this.hasInvalidInput() && this.validateRequired()));
+            this.setValidity(this.readonly || this.disabled || (!this.hasInvalidInput() && this.validateRequired()));
         };
-        /**
-         * Test if component has items
-         * @returns truthy if component has items
-         */
-        this.hasInputValue = () => { var _a; return ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) > 0; };
-        /**
-         * Test if component has no value error message displayed
-         * @returns truthy if compent display no value error message
-         */
-        this.hasNoValueErrorMessageDisplay = () => this.errorMessage === this.messages.errors.noValue;
         /**
          * Set button text locale key
          */
@@ -251,25 +240,12 @@ export class MgInputCheckbox {
             // Set error message
             this.errorMessage = undefined;
             if (displayError && !this.valid) {
-                if (errorMessage !== undefined) {
+                if (errorMessage !== undefined)
                     this.errorMessage = errorMessage;
-                }
-                else if (!this.hasInputValue()) {
-                    this.errorMessage = this.messages.errors.noValue;
-                }
-                else if (!this.validateRequired()) {
+                else if (!this.validateRequired())
                     this.errorMessage = this.messages.errors.required;
-                }
             }
         };
-        /**
-         * Reset error message
-         */
-        this.resetErrorMessage = () => {
-            this.checkValidity();
-            this.errorMessage = undefined;
-            this.hasDisplayedError = false;
-        };
         /**
          * Method to get mg-popover identifier
          * @returns MgPopover identifier
@@ -298,14 +274,7 @@ export class MgInputCheckbox {
          * @returns The rendered readonly value.
          */
         this.renderReadonly = (readonlyValue) => {
-            if (Array.isArray(readonlyValue)) {
-                if (this.inputVerticalList) {
-                    return (h("ul", { class: "mg-c-input__readonly-value" }, readonlyValue.map(value => (h("li", { key: value }, h("b", null, value))))));
-                }
-                else {
-                    return h("b", { class: "mg-c-input__readonly-value" }, readonlyValue.join(', '));
-                }
-            }
+            return this.inputVerticalList ? (h("ul", { class: "mg-c-input__readonly-value" }, readonlyValue.map(value => (h("li", { key: value }, h("b", null, value)))))) : (h("b", { class: "mg-c-input__readonly-value" }, readonlyValue.join(', ')));
         };
         /**
          * Renders the MgInputCheckboxList component.
@@ -314,16 +283,9 @@ export class MgInputCheckbox {
         this.renderMgInputCheckboxList = () => (h(MgInputCheckboxList, { checkboxes: this.checkboxItems, id: this.checkboxesId, disabled: this.disabled, name: this.name, invalid: this.invalid }));
     }
     validateValue(newValue) {
-        if ([null, undefined].includes(newValue) || newValue.length === 0) {
-            this.displayError();
-        }
-        else if (newValue.length > 0 && isCheckboxItems(newValue)) {
+        if (isCheckboxItems(newValue)) {
             this.checkboxItems = newValue.map((item, index) => (Object.assign(Object.assign({}, item), { _id: `${this.identifier}_${index}`, _handleInput: this.handleInput.bind(this), _handleBlur: this.handleBlur.bind(this), _handleKeydown: this.handleKeydown.bind(this) })));
             this.valueChange.emit(newValue);
-            // force to reset error when noValueError is displaied
-            if (this.invalid && this.hasNoValueErrorMessageDisplay()) {
-                this.resetErrorMessage();
-            }
         }
         else {
             throw new Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, CheckboxItem. Passed value: ${toString(newValue)}.`);
@@ -467,7 +429,9 @@ export class MgInputCheckbox {
             // - Keep everything in sync both inside and outside the component
             return new Promise(resolve => {
                 requestAnimationFrame(() => {
-                    this.resetErrorMessage();
+                    this.checkValidity();
+                    this.errorMessage = undefined;
+                    this.hasDisplayedError = false;
                     resolve();
                 });
             });
@@ -590,9 +554,8 @@ export class MgInputCheckbox {
      * @returns HTML Element
      */
     render() {
-        var _a;
         let inputContent;
-        const readonlyValue = ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(({ value }) => value).map(({ title }) => title);
+        const readonlyValue = this.value.filter(({ value }) => value).map(({ title }) => title);
         if (this.readonly) {
             inputContent = this.renderReadonly(readonlyValue);
         }
@@ -602,7 +565,7 @@ export class MgInputCheckbox {
         else {
             inputContent = this.renderCheckboxMulti();
         }
-        return (h("mg-input", { key: '6b1a72d80387da057c0d20367e141c90ff921889', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, tooltip: this.tooltip, tooltipPosition: this.readonly && readonlyValue.length === 0 ? 'label' : this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? defineErrorMessage(this.errorMessage, this.noValueErrorDetail) : undefined }, inputContent));
+        return (h("mg-input", { key: '84d13ac702497773013daa72357e4d1dcf4ebb30', label: this.label, identifier: this.identifier, class: this.classCollection.join(), labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, tooltip: this.tooltip, tooltipPosition: this.readonly && readonlyValue.length === 0 ? 'label' : this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? this.errorMessage : undefined }, inputContent));
     }
     static get is() { return "mg-input-checkbox"; }
     static get encapsulation() { return "shadow"; }
@@ -620,7 +583,6 @@ export class MgInputCheckbox {
         return {
             "value": {
                 "type": "unknown",
-                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "CheckboxValue[]",
@@ -644,7 +606,6 @@ export class MgInputCheckbox {
             },
             "type": {
                 "type": "string",
-                "attribute": "type",
                 "mutable": true,
                 "complexType": {
                     "original": "CheckboxType",
@@ -665,11 +626,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "type"
             },
             "identifier": {
                 "type": "string",
-                "attribute": "identifier",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -684,11 +645,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "identifier"
             },
             "name": {
                 "type": "string",
-                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -704,11 +665,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "name",
                 "defaultValue": "this.identifier"
             },
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -723,11 +684,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "label"
             },
             "labelOnTop": {
                 "type": "boolean",
-                "attribute": "label-on-top",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -743,11 +704,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "label-on-top",
                 "defaultValue": "false"
             },
             "labelHide": {
                 "type": "boolean",
-                "attribute": "label-hide",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -763,11 +724,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "label-hide",
                 "defaultValue": "false"
             },
             "inputVerticalList": {
                 "type": "boolean",
-                "attribute": "input-vertical-list",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -783,11 +744,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "input-vertical-list",
                 "defaultValue": "false"
             },
             "required": {
                 "type": "boolean",
-                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -803,11 +764,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "required",
                 "defaultValue": "false"
             },
             "readonly": {
                 "type": "boolean",
-                "attribute": "readonly",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -823,11 +784,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "readonly",
                 "defaultValue": "false"
             },
             "displaySelectedValues": {
                 "type": "boolean",
-                "attribute": "display-selected-values",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -843,11 +804,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "display-selected-values",
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -863,11 +824,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "tooltip": {
                 "type": "string",
-                "attribute": "tooltip",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -882,11 +843,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "tooltip"
             },
             "tooltipPosition": {
                 "type": "string",
-                "attribute": "tooltip-position",
                 "mutable": false,
                 "complexType": {
                     "original": "TooltipPosition",
@@ -908,11 +869,11 @@ export class MgInputCheckbox {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "tooltip-position",
                 "defaultValue": "'input'"
             },
             "helpText": {
                 "type": "string",
-                "attribute": "help-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -927,11 +888,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "help-text"
             },
             "valid": {
                 "type": "boolean",
-                "attribute": "valid",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -946,11 +907,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "valid"
             },
             "invalid": {
                 "type": "boolean",
-                "attribute": "invalid",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -965,11 +926,11 @@ export class MgInputCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "invalid"
             },
             "editButtonMessage": {
                 "type": "string",
-                "attribute": "edit-button-message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -977,18 +938,18 @@ export class MgInputCheckbox {
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": "Overwrite default \"edit\" button message"
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "edit-button-message"
             },
             "showButtonMessage": {
                 "type": "string",
-                "attribute": "show-button-message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -996,18 +957,18 @@ export class MgInputCheckbox {
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": "Overwrite default \"show\" button message"
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "show-button-message"
             },
             "selectButtonMessage": {
                 "type": "string",
-                "attribute": "select-button-message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -1015,33 +976,15 @@ export class MgInputCheckbox {
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": "Overwrite default \"select\" button message"
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
-            },
-            "noValueErrorDetail": {
-                "type": "string",
-                "attribute": "no-value-error-detail",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Define no value error detail"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "select-button-message"
             }
         };
     }