@mgdis/mg-components 5.19.3 → 5.21.0

package/dist/collection/components/atoms/mg-badge/mg-badge.js

@@ -2,171 +2,171 @@ import { h } from "@stencil/core";
 import { variants } from "./mg-badge.conf";
 import { ClassList, isValidString } from "../../../utils/components.utils";
 export class MgBadge {
-  constructor() {
-    /************
-     * Internal *
-     ************/
-    // Classes
-    this.classOutline = `mg-c-badge--outline`;
-    this.value = undefined;
-    this.label = undefined;
-    this.variant = variants[0];
-    this.outline = undefined;
-    this.classCollection = new ClassList(['mg-c-badge']);
-  }
-  validateValue(newValue) {
-    if (/^(\d+\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {
-      throw new Error('<mg-badge> prop "value" must be integer or ponctuation character.');
+    constructor() {
+        /************
+         * Internal *
+         ************/
+        // Classes
+        this.classOutline = `mg-c-badge--outline`;
+        this.value = undefined;
+        this.label = undefined;
+        this.variant = variants[0];
+        this.outline = undefined;
+        this.classCollection = new ClassList(['mg-c-badge']);
     }
-  }
-  validateLabel(newValue) {
-    if (!isValidString(newValue)) {
-      throw new Error('<mg-badge> prop "label" is required.');
+    validateValue(newValue) {
+        if (/^(\d+\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {
+            throw new Error('<mg-badge> prop "value" must be integer or ponctuation character.');
+        }
     }
-  }
-  validateVariant(newValue, oldValue) {
-    if (!variants.includes(newValue)) {
-      throw new Error(`<mg-badge> prop "variant" must be one of: ${variants.join(', ')}.`);
+    validateLabel(newValue) {
+        if (!isValidString(newValue)) {
+            throw new Error('<mg-badge> prop "label" is required.');
+        }
     }
-    else {
-      if (oldValue !== undefined) {
-        this.classCollection.delete(`mg-c-badge--${oldValue}`);
-      }
-      this.classCollection.add(`mg-c-badge--${newValue}`);
+    validateVariant(newValue, oldValue) {
+        if (!variants.includes(newValue)) {
+            throw new Error(`<mg-badge> prop "variant" must be one of: ${variants.join(', ')}.`);
+        }
+        else {
+            if (oldValue !== undefined) {
+                this.classCollection.delete(`mg-c-badge--${oldValue}`);
+            }
+            this.classCollection.add(`mg-c-badge--${newValue}`);
+        }
+    }
+    validateOutline(newValue) {
+        if (newValue)
+            this.classCollection.add(this.classOutline);
+        else
+            this.classCollection.delete(this.classOutline);
+    }
+    /**
+     * Check if props are well configured on init
+     */
+    componentWillLoad() {
+        this.validateValue(this.value);
+        this.validateLabel(this.label);
+        this.validateVariant(this.variant);
+        this.validateOutline(this.outline);
+    }
+    /**
+     * Render
+     * @returns HTML Element
+     */
+    render() {
+        return (h("span", { class: this.classCollection.join() }, h("span", { class: "mg-c-badge__value" }, this.value), h("span", { class: "mg-u-visually-hidden" }, this.label)));
+    }
+    static get is() { return "mg-badge"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css"]
+        };
     }
-  }
-  validateOutline(newValue) {
-    if (newValue)
-      this.classCollection.add(this.classOutline);
-    else
-      this.classCollection.delete(this.classOutline);
-  }
-  /**
-   * Check if props are well configured on init
-   */
-  componentWillLoad() {
-    this.validateValue(this.value);
-    this.validateLabel(this.label);
-    this.validateVariant(this.variant);
-    this.validateOutline(this.outline);
-  }
-  /**
-   * Render
-   * @returns HTML Element
-   */
-  render() {
-    return (h("span", { class: this.classCollection.join() }, h("span", { class: "mg-c-badge__value" }, this.value), h("span", { class: "mg-u-visually-hidden" }, this.label)));
-  }
-  static get is() { return "mg-badge"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "value": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "string | number",
-          "resolved": "number | string",
-          "references": {}
-        },
-        "required": true,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Badge value"
-        },
-        "attribute": "value",
-        "reflect": false
-      },
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": true,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Badge label. Include short description.\nRequired for accessibility"
-        },
-        "attribute": "label",
-        "reflect": false
-      },
-      "variant": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "BadgeVariantType",
-          "resolved": "\"danger\" | \"info\" | \"primary\" | \"secondary\" | \"success\" | \"text-color\" | \"warning\"",
-          "references": {
-            "BadgeVariantType": {
-              "location": "import",
-              "path": "./mg-badge.conf",
-              "id": "src/components/atoms/mg-badge/mg-badge.conf.ts::BadgeVariantType"
+    static get styleUrls() {
+        return {
+            "$": ["../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "value": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | number",
+                    "resolved": "number | string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Badge value"
+                },
+                "attribute": "value",
+                "reflect": false
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Badge label. Include short description.\nRequired for accessibility"
+                },
+                "attribute": "label",
+                "reflect": false
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "BadgeVariantType",
+                    "resolved": "\"danger\" | \"info\" | \"primary\" | \"secondary\" | \"success\" | \"text-color\" | \"warning\"",
+                    "references": {
+                        "BadgeVariantType": {
+                            "location": "import",
+                            "path": "./mg-badge.conf",
+                            "id": "src/components/atoms/mg-badge/mg-badge.conf.ts::BadgeVariantType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Define button variant"
+                },
+                "attribute": "variant",
+                "reflect": false,
+                "defaultValue": "variants[0]"
+            },
+            "outline": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Define if button is using outline style"
+                },
+                "attribute": "outline",
+                "reflect": false
             }
-          }
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Define button variant"
-        },
-        "attribute": "variant",
-        "reflect": false,
-        "defaultValue": "variants[0]"
-      },
-      "outline": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Define if button is using outline style"
-        },
-        "attribute": "outline",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "classCollection": {}
-    };
-  }
-  static get watchers() {
-    return [{
-        "propName": "value",
-        "methodName": "validateValue"
-      }, {
-        "propName": "label",
-        "methodName": "validateLabel"
-      }, {
-        "propName": "variant",
-        "methodName": "validateVariant"
-      }, {
-        "propName": "outline",
-        "methodName": "validateOutline"
-      }];
-  }
+        };
+    }
+    static get states() {
+        return {
+            "classCollection": {}
+        };
+    }
+    static get watchers() {
+        return [{
+                "propName": "value",
+                "methodName": "validateValue"
+            }, {
+                "propName": "label",
+                "methodName": "validateLabel"
+            }, {
+                "propName": "variant",
+                "methodName": "validateVariant"
+            }, {
+                "propName": "outline",
+                "methodName": "validateOutline"
+            }];
+    }
 }
 //# sourceMappingURL=mg-badge.js.map

package/dist/collection/components/atoms/mg-badge/mg-badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"mg-badge.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-badge/mg-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAoB,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAM3E,MAAM,OAAO,OAAO;;IAClB;;kBAEc;IAEd,UAAU;IACO,iBAAY,GAAG,qBAAqB,CAAC;;;mBAgCjB,QAAQ,CAAC,CAAC,CAAC;;2BA0BV,IAAI,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;;EA/CnE,aAAa,CAAC,QAA0B;IACtC,IAAI,sBAAsB,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,KAAK,IAAI,EAAE;MACvD,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;KACtF;EACH,CAAC;EAQD,aAAa,CAAC,QAA0B;IACtC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;KACzD;EACH,CAAC;EAOD,eAAe,CAAC,QAA4B,EAAE,QAA6B;IACzE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MAChC,MAAM,IAAI,KAAK,CAAC,6CAA6C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACtF;SAAM;MACL,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;OACxD;MACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;KACrD;EACH,CAAC;EAOD,eAAe,CAAC,QAA4B;IAC1C,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;MACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EACtD,CAAC;EAOD;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;EACrC,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACtC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ;MACnD,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { variants, BadgeVariantType } from './mg-badge.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n@Component({\n  tag: 'mg-badge',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css',\n  shadow: true,\n})\nexport class MgBadge {\n  /************\n   * Internal *\n   ************/\n\n  // Classes\n  private readonly classOutline = `mg-c-badge--outline`;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Badge value\n   */\n  @Prop() value!: string | number;\n  @Watch('value')\n  validateValue(newValue: MgBadge['value']): void {\n    if (/^(\\d+\\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {\n      throw new Error('<mg-badge> prop \"value\" must be integer or ponctuation character.');\n    }\n  }\n\n  /**\n   * Badge label. Include short description.\n   * Required for accessibility\n   */\n  @Prop() label!: string;\n  @Watch('label')\n  validateLabel(newValue: MgBadge['label']): void {\n    if (!isValidString(newValue)) {\n      throw new Error('<mg-badge> prop \"label\" is required.');\n    }\n  }\n\n  /**\n   * Define button variant\n   */\n  @Prop() variant?: BadgeVariantType = variants[0]; // info\n  @Watch('variant')\n  validateVariant(newValue: MgBadge['variant'], oldValue?: MgBadge['variant']): void {\n    if (!variants.includes(newValue)) {\n      throw new Error(`<mg-badge> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n    } else {\n      if (oldValue !== undefined) {\n        this.classCollection.delete(`mg-c-badge--${oldValue}`);\n      }\n      this.classCollection.add(`mg-c-badge--${newValue}`);\n    }\n  }\n\n  /**\n   * Define if button is using outline style\n   */\n  @Prop() outline: boolean;\n  @Watch('outline')\n  validateOutline(newValue: MgBadge['outline']): void {\n    if (newValue) this.classCollection.add(this.classOutline);\n    else this.classCollection.delete(this.classOutline);\n  }\n\n  /**\n   * Component classes\n   */\n  @State() classCollection: ClassList = new ClassList(['mg-c-badge']);\n\n  /**\n   * Check if props are well configured on init\n   */\n  componentWillLoad(): void {\n    this.validateValue(this.value);\n    this.validateLabel(this.label);\n    this.validateVariant(this.variant);\n    this.validateOutline(this.outline);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <span class={this.classCollection.join()}>\n        <span class=\"mg-c-badge__value\">{this.value}</span>\n        <span class=\"mg-u-visually-hidden\">{this.label}</span>\n      </span>\n    );\n  }\n}\n"]}
+{"version":3,"file":"mg-badge.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-badge/mg-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAoB,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAM3E,MAAM,OAAO,OAAO;;QAClB;;sBAEc;QAEd,UAAU;QACO,iBAAY,GAAG,qBAAqB,CAAC;;;uBAgCjB,QAAQ,CAAC,CAAC,CAAC;;+BA0BV,IAAI,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;;IA/CnE,aAAa,CAAC,QAA0B;QACtC,IAAI,sBAAsB,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,KAAK,IAAI,EAAE;YACvD,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;SACtF;IACH,CAAC;IAQD,aAAa,CAAC,QAA0B;QACtC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;YAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;SACzD;IACH,CAAC;IAOD,eAAe,CAAC,QAA4B,EAAE,QAA6B;QACzE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;YAChC,MAAM,IAAI,KAAK,CAAC,6CAA6C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;SACtF;aAAM;YACL,IAAI,QAAQ,KAAK,SAAS,EAAE;gBAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;aACxD;YACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;SACrD;IACH,CAAC;IAOD,eAAe,CAAC,QAA4B;QAC1C,IAAI,QAAQ;YAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;YACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACtD,CAAC;IAOD;;OAEG;IACH,iBAAiB;QACf,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACrC,CAAC;IAED;;;OAGG;IACH,MAAM;QACJ,OAAO,CACL,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;YACtC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ;YACnD,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { variants, BadgeVariantType } from './mg-badge.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n@Component({\n  tag: 'mg-badge',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css',\n  shadow: true,\n})\nexport class MgBadge {\n  /************\n   * Internal *\n   ************/\n\n  // Classes\n  private readonly classOutline = `mg-c-badge--outline`;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Badge value\n   */\n  @Prop() value!: string | number;\n  @Watch('value')\n  validateValue(newValue: MgBadge['value']): void {\n    if (/^(\\d+\\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {\n      throw new Error('<mg-badge> prop \"value\" must be integer or ponctuation character.');\n    }\n  }\n\n  /**\n   * Badge label. Include short description.\n   * Required for accessibility\n   */\n  @Prop() label!: string;\n  @Watch('label')\n  validateLabel(newValue: MgBadge['label']): void {\n    if (!isValidString(newValue)) {\n      throw new Error('<mg-badge> prop \"label\" is required.');\n    }\n  }\n\n  /**\n   * Define button variant\n   */\n  @Prop() variant?: BadgeVariantType = variants[0]; // info\n  @Watch('variant')\n  validateVariant(newValue: MgBadge['variant'], oldValue?: MgBadge['variant']): void {\n    if (!variants.includes(newValue)) {\n      throw new Error(`<mg-badge> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n    } else {\n      if (oldValue !== undefined) {\n        this.classCollection.delete(`mg-c-badge--${oldValue}`);\n      }\n      this.classCollection.add(`mg-c-badge--${newValue}`);\n    }\n  }\n\n  /**\n   * Define if button is using outline style\n   */\n  @Prop() outline: boolean;\n  @Watch('outline')\n  validateOutline(newValue: MgBadge['outline']): void {\n    if (newValue) this.classCollection.add(this.classOutline);\n    else this.classCollection.delete(this.classOutline);\n  }\n\n  /**\n   * Component classes\n   */\n  @State() classCollection: ClassList = new ClassList(['mg-c-badge']);\n\n  /**\n   * Check if props are well configured on init\n   */\n  componentWillLoad(): void {\n    this.validateValue(this.value);\n    this.validateLabel(this.label);\n    this.validateVariant(this.variant);\n    this.validateOutline(this.outline);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <span class={this.classCollection.join()}>\n        <span class=\"mg-c-badge__value\">{this.value}</span>\n        <span class=\"mg-u-visually-hidden\">{this.label}</span>\n      </span>\n    );\n  }\n}\n"]}