@mgdis/mg-components 6.16.0 → 6.18.0

package/dist/collection/components/atoms/internals/mg-input-title/mg-input-title.js

@@ -60,7 +60,6 @@ export class MgInputTitle {
         return {
             "identifier": {
                 "type": "string",
-                "attribute": "identifier",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -75,11 +74,11 @@ export class MgInputTitle {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "identifier"
             },
             "required": {
                 "type": "boolean",
-                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -94,11 +93,11 @@ export class MgInputTitle {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "required"
             },
             "readonly": {
                 "type": "boolean",
-                "attribute": "readonly",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -113,11 +112,11 @@ export class MgInputTitle {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "readonly"
             },
             "isLegend": {
                 "type": "boolean",
-                "attribute": "is-legend",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -133,6 +132,7 @@ export class MgInputTitle {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "is-legend",
                 "defaultValue": "false"
             }
         };

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

@@ -80,7 +80,6 @@ export class MgBadge {
         return {
             "value": {
                 "type": "any",
-                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string | number",
@@ -95,11 +94,11 @@ export class MgBadge {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "value"
             },
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -114,11 +113,11 @@ export class MgBadge {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "label"
             },
             "variant": {
                 "type": "string",
-                "attribute": "variant",
                 "mutable": false,
                 "complexType": {
                     "original": "BadgeVariantType",
@@ -140,11 +139,11 @@ export class MgBadge {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "variant",
                 "defaultValue": "'info'"
             },
             "outline": {
                 "type": "boolean",
-                "attribute": "outline",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -160,6 +159,7 @@ export class MgBadge {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "outline",
                 "defaultValue": "false"
             }
         };

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

@@ -223,7 +223,6 @@ export class MgButton {
         return {
             "variant": {
                 "type": "string",
-                "attribute": "variant",
                 "mutable": true,
                 "complexType": {
                     "original": "VariantType",
@@ -245,11 +244,11 @@ export class MgButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "variant",
                 "defaultValue": "'primary'"
             },
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -264,11 +263,11 @@ export class MgButton {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "label"
             },
             "type": {
                 "type": "string",
-                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "ButtonType",
@@ -289,11 +288,11 @@ export class MgButton {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "type"
             },
             "size": {
                 "type": "string",
-                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "SizeType",
@@ -315,11 +314,11 @@ export class MgButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "size",
                 "defaultValue": "'medium'"
             },
             "fullWidth": {
                 "type": "boolean",
-                "attribute": "full-width",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -335,11 +334,11 @@ export class MgButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "full-width",
                 "defaultValue": "false"
             },
             "form": {
                 "type": "string",
-                "attribute": "form",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -354,11 +353,11 @@ export class MgButton {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "form"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -373,11 +372,11 @@ export class MgButton {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "disabled"
             },
             "isIcon": {
                 "type": "boolean",
-                "attribute": "is-icon",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -393,11 +392,11 @@ export class MgButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "is-icon",
                 "defaultValue": "false"
             },
             "disableOnClick": {
                 "type": "boolean",
-                "attribute": "disable-on-click",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -413,6 +412,7 @@ export class MgButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disable-on-click",
                 "defaultValue": "false"
             }
         };

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

@@ -68,7 +68,6 @@ export class MgCard {
         return {
             "shadow": {
                 "type": "boolean",
-                "attribute": "shadow",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -84,11 +83,11 @@ export class MgCard {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "shadow",
                 "defaultValue": "false"
             },
             "radiusSize": {
                 "type": "string",
-                "attribute": "radius-size",
                 "mutable": false,
                 "complexType": {
                     "original": "RadiusSizeType",
@@ -110,6 +109,7 @@ export class MgCard {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "radius-size",
                 "defaultValue": "'medium'"
             }
         };

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

@@ -35,7 +35,6 @@ export class MgDivider {
         return {
             "fullWidth": {
                 "type": "boolean",
-                "attribute": "full-width",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -51,6 +50,7 @@ export class MgDivider {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "full-width",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/atoms/mg-icon/mg-icon.conf.js

@@ -5,7 +5,7 @@ export const sizes = ['small', 'medium', 'large', 'xlarge', 'xxlarge'];
 /**
  * List of all possibles variants
  */
-export const variants = ['success', 'warning', 'danger', 'info', 'app'];
+export const variants = ['success', 'warning', 'danger', 'info', 'app', 'neutral'];
 /**
  * List of all possibles variants styles
  */

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

@@ -15,14 +15,6 @@ export class MgIcon {
          * Component classes
          */
         this.classCollection = new ClassList(['mg-c-icon']);
-        /**
-         * Method to set default varianStyle props
-         * needeed has stencil doesn't know that props is mutated when updated in prop watcher
-         */
-        this.setDefaultVariantStyle = () => {
-            if (this.variantStyle === undefined)
-                this.variantStyle = 'background';
-        };
         /**
          * Render icon in shadowroot
          * @param icon - icon to render
@@ -71,24 +63,38 @@ export class MgIcon {
         }
     }
     validateVariant(newValue, oldValue) {
-        if (newValue !== undefined) {
-            if (!variants.includes(newValue))
+        var _a;
+        // Remove old variant if exists
+        if (oldValue !== undefined) {
+            this.classCollection.delete(`mg-c-icon--variant-${oldValue}`);
+        }
+        // Set new variant
+        const variant = newValue === 'neutral' ? 'dark' : newValue;
+        if (variant !== undefined) {
+            if (![...variants, 'dark'].includes(variant)) {
                 throw new Error(`<mg-icon> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${toString(newValue)}.`);
+            }
             else {
-                this.setDefaultVariantStyle();
-                if (oldValue !== undefined)
-                    this.classCollection.delete(`mg-c-icon--variant-${oldValue}`);
-                this.classCollection.add(`mg-c-icon--variant-${newValue}`);
+                (_a = this.variantStyle) !== null && _a !== void 0 ? _a : (this.variantStyle = 'background');
+                this.classCollection.add(`mg-c-icon--variant-${variant}`);
             }
         }
+        else {
+            // remove variantStyle if variant is undefined
+            this.variantStyle = undefined;
+        }
     }
     validateVariantStyle(newValue, oldValue) {
+        // Remove old variantStyle if exists
+        if (oldValue !== undefined) {
+            this.classCollection.delete(`mg-c-icon--variant-style-${oldValue}`);
+        }
+        // Set new variantStyle
         if (newValue !== undefined) {
-            if (!variantStyles.includes(newValue))
+            if (!variantStyles.includes(newValue)) {
                 throw new Error(`<mg-icon> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${toString(newValue)}.`);
+            }
             else {
-                if (oldValue !== undefined)
-                    this.classCollection.delete(`mg-c-icon--variant-style-${oldValue}`);
                 this.classCollection.add(`mg-c-icon--variant-style-${newValue}`);
             }
         }
@@ -135,7 +141,6 @@ export class MgIcon {
         return {
             "icon": {
                 "type": "string",
-                "attribute": "icon",
                 "mutable": false,
                 "complexType": {
                     "original": "IconType",
@@ -156,11 +161,11 @@ export class MgIcon {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "icon"
             },
             "size": {
                 "type": "string",
-                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "IconSizeType",
@@ -182,15 +187,15 @@ export class MgIcon {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "size",
                 "defaultValue": "'medium'"
             },
             "variant": {
                 "type": "string",
-                "attribute": "variant",
                 "mutable": false,
                 "complexType": {
                     "original": "IconVariantType",
-                    "resolved": "\"app\" | \"danger\" | \"info\" | \"success\" | \"warning\"",
+                    "resolved": "\"app\" | \"danger\" | \"info\" | \"neutral\" | \"success\" | \"warning\"",
                     "references": {
                         "IconVariantType": {
                             "location": "import",
@@ -207,11 +212,11 @@ export class MgIcon {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "variant"
             },
             "variantStyle": {
                 "type": "string",
-                "attribute": "variant-style",
                 "mutable": true,
                 "complexType": {
                     "original": "IconVariantStyleType",
@@ -232,11 +237,11 @@ export class MgIcon {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "variant-style"
             },
             "spin": {
                 "type": "boolean",
-                "attribute": "spin",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -252,6 +257,7 @@ export class MgIcon {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "spin",
                 "defaultValue": "false"
             }
         };

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

@@ -102,7 +102,6 @@ export class MgTag {
         return {
             "variant": {
                 "type": "string",
-                "attribute": "variant",
                 "mutable": false,
                 "complexType": {
                     "original": "TagVariantType",
@@ -124,11 +123,11 @@ export class MgTag {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "variant",
                 "defaultValue": "'primary'"
             },
             "outline": {
                 "type": "boolean",
-                "attribute": "outline",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -144,11 +143,11 @@ export class MgTag {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "outline",
                 "defaultValue": "false"
             },
             "soft": {
                 "type": "boolean",
-                "attribute": "soft",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -164,6 +163,7 @@ export class MgTag {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "soft",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js

@@ -29,7 +29,6 @@ export class MgTooltipContent {
         return {
             "message": {
                 "type": "string",
-                "attribute": "message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -44,7 +43,8 @@ export class MgTooltipContent {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "message"
             }
         };
     }

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

@@ -382,7 +382,6 @@ export class MgTooltip {
         return {
             "identifier": {
                 "type": "string",
-                "attribute": "identifier",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -398,11 +397,11 @@ export class MgTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "identifier",
                 "defaultValue": "createID('mg-tooltip')"
             },
             "message": {
                 "type": "string",
-                "attribute": "message",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -417,11 +416,11 @@ export class MgTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "message"
             },
             "placement": {
                 "type": "string",
-                "attribute": "placement",
                 "mutable": false,
                 "complexType": {
                     "original": "Placement",
@@ -443,11 +442,11 @@ export class MgTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "placement",
                 "defaultValue": "'bottom'"
             },
             "display": {
                 "type": "boolean",
-                "attribute": "display",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -463,11 +462,11 @@ export class MgTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "display",
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -483,6 +482,7 @@ export class MgTooltip {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             }
         };

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

@@ -6,6 +6,10 @@ export const widths = [2, 4, 16, 'full'];
  * Possible tootltip postions
  */
 export const tooltipPositions = ['input', 'label'];
+/**
+ * Possible label headings
+ */
+export const labelHeadings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
 export const classFieldset = 'mg-c-input--fieldset';
 export const classDisabled = 'mg-c-input--disabled';
 export const classReadonly = 'mg-c-input--readonly';