@mgdis/mg-components 6.8.0 → 6.10.0

package/dist/components/index2.js

@@ -1,4 +1,4 @@
-import { h as ht } from './index.es.js';
+import { u as ur } from './index.es.js';
 
 const errors$1 = {
 	required: "This field is required."
@@ -47,7 +47,7 @@ const input$1 = {
 			minMax: "The date must be between {min} and {max}"
 		},
 		error: {
-			badInput: "The date is incorrect, the format must be {pattern} (ex: {date})"
+			badInput: "The date is inexistent or incorrect, the expected format is {pattern} (ex: {date})"
 		}
 	},
 	numeric: {
@@ -61,6 +61,12 @@ const input$1 = {
 		display: "Display password value",
 		hide: "Hide password value"
 	},
+	combobox: {
+		notFound: "No elements match your input",
+		notAvailable: "No elements available",
+		loadMore: "Load more",
+		search: "Search…"
+	},
 	text: {
 		helpText: {
 			email: "Expected format: name@example.com",
@@ -68,7 +74,11 @@ const input$1 = {
 			url: "Expected format: https://example.com"
 		},
 		errors: {
-			typeMismatch: "The value is incorrect."
+			typeMismatch: {
+				email: "The value is incorrect, the expected format is name@example.com",
+				emails: "The value is incorrect, the expected format is first@example.com, second@example.com",
+				url: "The value is incorrect, the expected format is https://example.com"
+			}
 		}
 	}
 };
@@ -103,7 +113,8 @@ const general$1 = {
 	cancel: "Cancel",
 	close: "Close",
 	next: "next",
-	previous: "previous"
+	previous: "previous",
+	reset: "reset"
 };
 const menuItem$1 = {
 	badgeLabel: "Include notification(s)",
@@ -121,7 +132,7 @@ const loader$1 = {
 const table$1 = {
 	sortableCaption: "(column headers with buttons are sortable)"
 };
-const en = {
+var en = {
 	errors: errors$1,
 	nbCharLeft: nbCharLeft$1,
 	input: input$1,
@@ -186,7 +197,7 @@ const input = {
 			minMax: "La date doit être comprise entre le {min} et le {max}"
 		},
 		error: {
-			badInput: "La date est incorrecte, le format doit être du type {pattern} (ex : {date})"
+			badInput: "La date est inexistante ou incorrecte, le format attendu est {pattern} (ex : {date})"
 		}
 	},
 	numeric: {
@@ -200,6 +211,12 @@ const input = {
 		display: "Afficher le mot de passe",
 		hide: "Masquer le mot de passe"
 	},
+	combobox: {
+		notFound: "Aucun élément ne correspondont a votre saisie",
+		notAvailable: "Aucun élément disponible",
+		loadMore: "Afficher plus",
+		search: "Recherche…"
+	},
 	text: {
 		helpText: {
 			email: "Format attendu : nom@exemple.fr",
@@ -207,7 +224,11 @@ const input = {
 			url: "Format attendu : https://exemple.fr"
 		},
 		errors: {
-			typeMismatch: "La valeur est incorrecte."
+			typeMismatch: {
+				email: "La valeur est incorrecte, le format attendu est nom@exemple.fr",
+				emails: "La valeur est incorrecte, le format attendu est premier@exemple.fr, second@exemple.fr",
+				url: "La valeur est incorrecte, le format attendu est https://exemple.fr"
+			}
 		}
 	}
 };
@@ -242,7 +263,8 @@ const general = {
 	cancel: "Annuler",
 	close: "Fermer",
 	next: "suivant",
-	previous: "précédent"
+	previous: "précédent",
+	reset: "réinitialiser"
 };
 const menuItem = {
 	badgeLabel: "Notification(s) incluse(s)",
@@ -260,7 +282,7 @@ const loader = {
 const table = {
 	sortableCaption: "(les en-têtes de colonnes avec des boutons peuvent être triés)"
 };
-const fr = {
+var fr = {
 	errors: errors,
 	nbCharLeft: nbCharLeft,
 	input: input,
@@ -285,8 +307,9 @@ const messages = { en, fr };
  * @param element - element we need to get the language
  * @returns messages object
  */
-const initLocales = ht(messages, defaultLocale);
+const initLocales = ur(messages, defaultLocale);
 
 export { initLocales as i };
+//# sourceMappingURL=index2.js.map
 
 //# sourceMappingURL=index2.js.map

package/dist/components/index2.js.map

@@ -1 +1 @@
-{"file":"index2.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,MAAM,aAAa,GAAG,IAAI,CAAC;AAC3B,MAAM,QAAQ,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;AAE5B;;;;;MAKa,WAAW,GAAGA,EAAa,CAAC,QAAQ,EAAE,aAAa;;;;","names":["defineLocales"],"sources":["src/locales/index.ts"],"sourcesContent":["import en from './en/messages.json';\nimport fr from './fr/messages.json';\nimport { defineLocales } from '@mgdis/stencil-helpers';\n\nconst defaultLocale = 'en';\nconst messages = { en, fr };\n\n/**\n * Get Intl object\n * @param element - element we need to get the language\n * @returns messages object\n */\nexport const initLocales = defineLocales(messages, defaultLocale);\n"],"version":3}
+{"file":"index2.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,MAAM,aAAa,GAAG,IAAI;AAC1B,MAAM,QAAQ,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE;AAE3B;;;;AAIG;AACU,MAAA,WAAW,GAAGA,EAAa,CAAC,QAAQ,EAAE,aAAa;;;;","names":["defineLocales"],"sources":["src/locales/index.ts"],"sourcesContent":["import en from './en/messages.json';\nimport fr from './fr/messages.json';\nimport { defineLocales } from '@mgdis/stencil-helpers';\n\nconst defaultLocale = 'en';\nconst messages = { en, fr };\n\n/**\n * Get Intl object\n * @param element - element we need to get the language\n * @returns messages object\n */\nexport const initLocales = defineLocales(messages, defaultLocale);\n"],"version":3}

package/dist/components/mg-action-more.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { G as Ge, V as Ve } from './index.es.js';
+import { P as Pt, G as Gt } from './index.es.js';
 import { d as defineCustomElement$4, a as directions, S as Status } from './mg-menu-item2.js';
 import { i as initLocales } from './index2.js';
 import { d as defineCustomElement$b } from './mg-badge2.js';
@@ -7,12 +7,11 @@ import { d as defineCustomElement$a } from './mg-button2.js';
 import { d as defineCustomElement$9 } from './mg-card2.js';
 import { d as defineCustomElement$8 } from './mg-divider2.js';
 import { d as defineCustomElement$7 } from './mg-icon2.js';
-import { d as defineCustomElement$5, a as defineCustomElement$6 } from './mg-item-more2.js';
+import { b as defineCustomElement$5, d as defineCustomElement$6 } from './mg-item-more2.js';
 import { d as defineCustomElement$3 } from './mg-popover2.js';
 import { d as defineCustomElement$2 } from './mg-popover-content2.js';
 
 const mgActionMoreCss = ".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host{--mg-c-popover-padding-vertical:var(--mg-b-size-8);--mg-c-popover-padding-horizontal:0;--mg-c-popover-max-width:unset}.mg-c-action-more__divider{--mg-c-divider-spacing-vertical:var(--mg-b-size-4)}.mg-c-action-more__chevron{transition:200ms}.mg-c-action-more__chevron--rotate.mg-c-action-more__chevron{transform:rotate(180deg)}";
-const MgActionMoreStyle0 = mgActionMoreCss;
 
 /**
  * MgActionMore['items'] type guard
@@ -58,11 +57,15 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
          ************/
         this.name = 'mg-action-more';
         this.classBase = 'mg-c-action-more';
-        this.mgPopoverIdentifier = Ge(this.name);
+        this.mgPopoverIdentifier = Pt(this.name);
         /**
          * Define button properties
          */
         this.button = { variant: 'flat', isIcon: true };
+        /**
+         * Define if chevron is display
+         */
+        this.displayChevron = false;
         /**
          * Menu expanded state
          */
@@ -101,15 +104,15 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
     }
     validateItems(newValue) {
         if (!isMgActionMoreItems(newValue)) {
-            throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${Gt(newValue)}.`);
         }
         else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {
-            throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateIcon(newValue) {
         if (newValue && !isMgActionMoreIcon(newValue)) {
-            throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${Gt(newValue)}.`);
         }
         else if ((newValue === null || newValue === void 0 ? void 0 : newValue.icon) === undefined && Boolean(this.button.isIcon)) {
             this.icon = { icon: 'ellipsis' };
@@ -117,7 +120,7 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
     }
     validateButton(newValue) {
         if (newValue && !isMgActionMoreButton(newValue)) {
-            throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateDisplayChevron(newValue) {
@@ -151,9 +154,9 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
                     [`${this.classBase}__chevron--rotate`]: this.expanded === true,
                 } }, h("mg-icon", { icon: "chevron-down" })));
         }
-        return (h(Host, { key: '2bb195242da00b4235d1c7e208d1f7ca72189a94', "data-mg-popover-guard": this.mgPopoverIdentifier }, h("span", { key: 'e9b1e0d8996886aef957f95e5c4276c584f80525', class: this.classBase }, h("mg-popover", { key: '8700af5584bb46e3b04b887b3d42d1660c0ef140', identifier: this.mgPopoverIdentifier, display: this.expanded, "onDisplay-change": this.handleDisplayChange }, h("mg-button", { key: '70442ce629cc40ea412ce3b6c93f8aab3abfa567', variant: this.button.variant, isIcon: this.button.isIcon, disabled: this.button.disabled, type: "button", label: buttonLabel, onClick: this.handleButton }, this.icon && h("mg-icon", Object.assign({ key: '85de555a598ac2097fb6586bbfab4ccda47721d1' }, this.icon)), !this.button.isIcon && buttonContent), h("div", { key: '3881ef2f2453a7f6bb8a16f56fd58899d4a44ab3', slot: "content" }, h("mg-menu", { key: 'ad3fb64141e696c4dfdf19743b035347ea212a39', direction: directions.VERTICAL, label: this.messages.label }, this.items.map(item => {
+        return (h(Host, { key: '655b4be7b0b17db8ad6e2d688f59c18f2750dfe4', "data-mg-popover-guard": this.mgPopoverIdentifier }, h("span", { key: '19f5763f7732fb156803fb6a24f776f182d230f4', class: this.classBase }, h("mg-popover", { key: '617fefddd54794e3f3da60e700e1c60e0758c66b', identifier: this.mgPopoverIdentifier, display: this.expanded, "onDisplay-change": this.handleDisplayChange }, h("mg-button", { key: 'c9ef1d8f771b015ddb5b8f280c3657e74606ef22', variant: this.button.variant, isIcon: this.button.isIcon, disabled: this.button.disabled, type: "button", label: buttonLabel, onClick: this.handleButton }, this.icon && h("mg-icon", Object.assign({ key: 'ded976da4cd3a457a232aee9613dc9e108c35358' }, this.icon)), !this.button.isIcon && buttonContent), h("div", { key: 'e3308c1e0ae198f204c283408f9c3afc154ddf21', slot: "content" }, h("mg-menu", { key: '70c222a09f42b938f56a5bb02fa4193ca8f47788', direction: directions.VERTICAL, label: this.messages.label }, this.items.map(item => {
             var _a, _b;
-            return isMgActionMoreDivider(item) ? (h("mg-divider", { class: "mg-c-action-more__divider", key: "divider" })) : (h("mg-menu-item", { key: item.label, status: item.status || Status.VISIBLE, target: item.target, href: item.href,
+            return isMgActionMoreDivider(item) ? (h("mg-divider", { class: "mg-c-action-more__divider", key: "divider", "full-width": true })) : (h("mg-menu-item", { key: item.label, status: item.status || Status.VISIBLE, target: item.target, href: item.href,
                 // eslint-disable-next-line react/jsx-no-bind
                 onClick: e => this.handleItemClick(e, item.mouseEventHandler) }, ((_a = item.icon) === null || _a === void 0 ? void 0 : _a.icon) && h("mg-icon", { icon: item.icon.icon, variant: item.icon.variant, variantStyle: item.icon.variantStyle, slot: "image" }), h("span", { slot: "label" }, item.label), ((_b = item.badge) === null || _b === void 0 ? void 0 : _b.label) && h("mg-badge", { label: item.badge.label, value: item.badge.value, slot: "information", variant: "text-color" })));
         })))))));
@@ -165,7 +168,7 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
         "button": ["validateButton"],
         "displayChevron": ["validateDisplayChevron"]
     }; }
-    static get style() { return MgActionMoreStyle0; }
+    static get style() { return mgActionMoreCss; }
 }, [1, "mg-action-more", {
         "items": [16],
         "icon": [1040],
@@ -247,5 +250,6 @@ const MgActionMore = MgActionMore$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { MgActionMore, defineCustomElement };
+//# sourceMappingURL=mg-action-more.js.map
 
 //# sourceMappingURL=mg-action-more.js.map

package/dist/components/mg-action-more.js.map

@@ -1 +1 @@
-{"file":"mg-action-more.js","mappings":"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","names":["MgActionMore","createID","toString"],"sources":["../styles/dist/components/mg-action-more.css?tag=mg-action-more&encapsulation=shadow","src/components/molecules/mg-action-more/mg-action-more.tsx"],"sourcesContent":[".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host{--mg-c-popover-padding-vertical: var(--mg-b-size-8);--mg-c-popover-padding-horizontal: 0;--mg-c-popover-max-width: unset}.mg-c-action-more__divider{--mg-c-divider-spacing-vertical: var(--mg-b-size-4)}.mg-c-action-more__chevron{transition:200ms}.mg-c-action-more__chevron--rotate.mg-c-action-more__chevron{transform:rotate(180deg)}/*# sourceMappingURL=mg-action-more.css.map */\n","import { Component, h, Element, Prop, Watch, State, Host } from '@stencil/core';\nimport { createID, toString } from '@mgdis/stencil-helpers';\nimport { Status } from '../menu/mg-menu-item/mg-menu-item.conf';\nimport { directions } from '../menu/mg-menu/mg-menu.conf';\nimport { initLocales } from '../../../locales';\nimport type { MessageType } from '../../../locales/index.conf';\nimport type { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreDividerType } from './mg-action-more.conf';\n\n/**\n * MgActionMore['items'] type guard\n * @param prop - commponent items prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreItems = (prop: unknown): prop is MgActionMoreItemType[] => {\n  const items = prop as MgActionMoreItemType[];\n  return (\n    typeof items === 'object' &&\n    items.every(item => (typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function') || isMgActionMoreDivider(item))\n  );\n};\n\n/**\n * MgActionMoreDividerType type guard\n * @param item - component item\n * @returns return true if type is valid\n */\nconst isMgActionMoreDivider = (item: unknown): item is MgActionMoreDividerType => typeof item === 'object' && (item as MgActionMoreDividerType).isDivider;\n\n/**\n * MgActionMore['button'] type guard\n * @param prop - commponent button prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreButton = (prop: unknown): prop is MgActionMoreButtonType => {\n  const button = prop as MgActionMoreButtonType;\n  return typeof button === 'object' && typeof button.variant === 'string' && typeof button.isIcon === 'boolean';\n};\n\n/**\n * MgActionMore['icon'] type guard\n * @param prop - commponent icon prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreIcon = (prop: unknown): prop is MgActionMoreIconType => {\n  const icon = prop as MgActionMoreIconType;\n  return typeof icon === 'object' && typeof icon.icon === 'string';\n};\n\n@Component({\n  tag: 'mg-action-more',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-action-more.css',\n  shadow: true,\n})\nexport class MgActionMore {\n  /************\n   * Internal *\n   ************/\n\n  private readonly name = 'mg-action-more';\n  private readonly classBase = 'mg-c-action-more';\n  private readonly mgPopoverIdentifier = createID(this.name);\n  private messages: MessageType;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgActionMoreElement;\n\n  /**\n   * Define the menu-items elements\n   */\n  @Prop() items!: (MgActionMoreItemType | MgActionMoreDividerType)[];\n  @Watch('items')\n  validateItems(newValue: MgActionMore['items']): void {\n    if (!isMgActionMoreItems(newValue)) {\n      throw new Error(\n        `<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${toString(newValue)}.`,\n      );\n    } else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {\n      throw new Error(`<${this.name}> prop \"items\" can’t have a divider at the beginning or the end of the array. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define displayed icon\n   */\n  @Prop({ mutable: true }) icon?: MgActionMoreIconType;\n  @Watch('icon')\n  validateIcon(newValue: MgActionMore['icon']): void {\n    if (newValue && !isMgActionMoreIcon(newValue)) {\n      throw new Error(`<${this.name}> prop \"icon\" must match MgActionMoreIconType. Passed value: ${toString(newValue)}.`);\n    } else if (newValue?.icon === undefined && Boolean(this.button.isIcon)) {\n      this.icon = { icon: 'ellipsis' };\n    }\n  }\n\n  /**\n   * Define button properties\n   */\n  @Prop() button?: MgActionMoreButtonType = { variant: 'flat', isIcon: true };\n  @Watch('button')\n  validateButton(newValue: MgActionMore['button']): void {\n    if (newValue && !isMgActionMoreButton(newValue)) {\n      throw new Error(`<${this.name}> prop \"button\" must match MgActionMoreButtonType. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define if chevron is display\n   */\n  @Prop() displayChevron?: boolean;\n  @Watch('displayChevron')\n  validateDisplayChevron(newValue: MgActionMore['displayChevron']): void {\n    if (newValue && this.button.isIcon === true) {\n      throw new Error(`<${this.name}> prop \"displayChevron\" can't be used with a 'button\" prop \"isIcon\" attribute.`);\n    }\n  }\n  /**\n   * Menu expanded state\n   */\n  @State() expanded = false;\n\n  /************\n   * Methods *\n   ***********/\n\n  /**\n   * Toggle expanded props\n   */\n  private toggleExpanded = (): void => {\n    this.expanded = !this.expanded;\n  };\n\n  /**\n   * Handle popover display change value\n   * @param event - display change updated value\n   */\n  private handleDisplayChange = (event: CustomEvent): void => {\n    this.expanded = event.detail;\n  };\n\n  /**\n   * Button click handler\n   */\n  private handleButton = (): void => {\n    this.toggleExpanded();\n  };\n\n  /**\n   * Item click handler\n   * @param event - click event\n   * @param customHandler - item['mouseEventHandler']\n   */\n  private handleItemClick = (event: MouseEvent, customHandler: MgActionMoreItemType['mouseEventHandler']) => {\n    this.expanded = false;\n    customHandler(event);\n  };\n\n  /*************\n   * Lifecycle *\n   *************/\n\n  /**\n   * Validate props\n   */\n  componentWillLoad(): void {\n    this.messages = initLocales(this.element).messages.actionMore as MessageType;\n    this.validateItems(this.items);\n    this.validateButton(this.button);\n    this.validateIcon(this.icon);\n    this.validateDisplayChevron(this.displayChevron);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    const buttonLabel = this.button.label || this.messages.label;\n    const buttonContent = [buttonLabel];\n\n    if (!this.button.isIcon && this.displayChevron) {\n      buttonContent.push(\n        <span\n          class={{\n            [`${this.classBase}__chevron`]: true,\n            [`${this.classBase}__chevron--rotate`]: this.expanded === true,\n          }}\n        >\n          <mg-icon icon=\"chevron-down\"></mg-icon>\n        </span>,\n      );\n    }\n\n    return (\n      <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n        <span class={this.classBase}>\n          <mg-popover identifier={this.mgPopoverIdentifier} display={this.expanded} onDisplay-change={this.handleDisplayChange}>\n            <mg-button variant={this.button.variant} isIcon={this.button.isIcon} disabled={this.button.disabled} type=\"button\" label={buttonLabel} onClick={this.handleButton}>\n              {this.icon && <mg-icon {...this.icon}></mg-icon>}\n              {!this.button.isIcon && buttonContent}\n            </mg-button>\n            <div slot=\"content\">\n              <mg-menu direction={directions.VERTICAL} label={this.messages.label}>\n                {this.items.map(item =>\n                  isMgActionMoreDivider(item) ? (\n                    <mg-divider class=\"mg-c-action-more__divider\" key=\"divider\"></mg-divider>\n                  ) : (\n                    <mg-menu-item\n                      key={item.label}\n                      status={item.status || Status.VISIBLE}\n                      target={item.target}\n                      href={item.href}\n                      // eslint-disable-next-line react/jsx-no-bind\n                      onClick={e => this.handleItemClick(e, item.mouseEventHandler)}\n                    >\n                      {item.icon?.icon && <mg-icon icon={item.icon.icon} variant={item.icon.variant} variantStyle={item.icon.variantStyle} slot=\"image\"></mg-icon>}\n                      <span slot=\"label\">{item.label}</span>\n                      {item.badge?.label && <mg-badge label={item.badge.label} value={item.badge.value} slot=\"information\" variant=\"text-color\"></mg-badge>}\n                    </mg-menu-item>\n                  ),\n                )}\n              </mg-menu>\n            </div>\n          </mg-popover>\n        </span>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"mg-action-more.js","mappings":"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","names":["MgActionMore","__stencil_proxyCustomElement","createID","toString"],"sources":["../styles/dist/components/mg-action-more.css?tag=mg-action-more&encapsulation=shadow","src/components/molecules/mg-action-more/mg-action-more.tsx"],"sourcesContent":[".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host{--mg-c-popover-padding-vertical: var(--mg-b-size-8);--mg-c-popover-padding-horizontal: 0;--mg-c-popover-max-width: unset}.mg-c-action-more__divider{--mg-c-divider-spacing-vertical: var(--mg-b-size-4)}.mg-c-action-more__chevron{transition:200ms}.mg-c-action-more__chevron--rotate.mg-c-action-more__chevron{transform:rotate(180deg)}/*# sourceMappingURL=mg-action-more.css.map */\n","import { Component, h, Element, Prop, Watch, State, Host } from '@stencil/core';\nimport { createID, toString } from '@mgdis/stencil-helpers';\nimport { Status } from '../menus/mg-menu-item/mg-menu-item.conf';\nimport { directions } from '../menus/mg-menu/mg-menu.conf';\nimport { initLocales } from '../../../locales';\nimport type { MessageType } from '../../../locales/index.conf';\nimport type { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreDividerType } from './mg-action-more.conf';\n\n/**\n * MgActionMore['items'] type guard\n * @param prop - commponent items prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreItems = (prop: unknown): prop is MgActionMoreItemType[] => {\n  const items = prop as MgActionMoreItemType[];\n  return (\n    typeof items === 'object' &&\n    items.every(item => (typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function') || isMgActionMoreDivider(item))\n  );\n};\n\n/**\n * MgActionMoreDividerType type guard\n * @param item - component item\n * @returns return true if type is valid\n */\nconst isMgActionMoreDivider = (item: unknown): item is MgActionMoreDividerType => typeof item === 'object' && (item as MgActionMoreDividerType).isDivider;\n\n/**\n * MgActionMore['button'] type guard\n * @param prop - commponent button prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreButton = (prop: unknown): prop is MgActionMoreButtonType => {\n  const button = prop as MgActionMoreButtonType;\n  return typeof button === 'object' && typeof button.variant === 'string' && typeof button.isIcon === 'boolean';\n};\n\n/**\n * MgActionMore['icon'] type guard\n * @param prop - commponent icon prop\n * @returns return true if type is valid\n */\nconst isMgActionMoreIcon = (prop: unknown): prop is MgActionMoreIconType => {\n  const icon = prop as MgActionMoreIconType;\n  return typeof icon === 'object' && typeof icon.icon === 'string';\n};\n\n@Component({\n  tag: 'mg-action-more',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-action-more.css',\n  shadow: true,\n})\nexport class MgActionMore {\n  /************\n   * Internal *\n   ************/\n\n  private readonly name = 'mg-action-more';\n  private readonly classBase = 'mg-c-action-more';\n  private readonly mgPopoverIdentifier = createID(this.name);\n  private messages: MessageType;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgActionMoreElement;\n\n  /**\n   * Define the menu-items elements\n   */\n  @Prop() items!: (MgActionMoreItemType | MgActionMoreDividerType)[];\n  @Watch('items')\n  validateItems(newValue: MgActionMore['items']): void {\n    if (!isMgActionMoreItems(newValue)) {\n      throw new Error(\n        `<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${toString(newValue)}.`,\n      );\n    } else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {\n      throw new Error(`<${this.name}> prop \"items\" can’t have a divider at the beginning or the end of the array. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define displayed icon\n   */\n  @Prop({ mutable: true }) icon?: MgActionMoreIconType;\n  @Watch('icon')\n  validateIcon(newValue: MgActionMore['icon']): void {\n    if (newValue && !isMgActionMoreIcon(newValue)) {\n      throw new Error(`<${this.name}> prop \"icon\" must match MgActionMoreIconType. Passed value: ${toString(newValue)}.`);\n    } else if (newValue?.icon === undefined && Boolean(this.button.isIcon)) {\n      this.icon = { icon: 'ellipsis' };\n    }\n  }\n\n  /**\n   * Define button properties\n   */\n  @Prop() button?: MgActionMoreButtonType = { variant: 'flat', isIcon: true };\n  @Watch('button')\n  validateButton(newValue: MgActionMore['button']): void {\n    if (newValue && !isMgActionMoreButton(newValue)) {\n      throw new Error(`<${this.name}> prop \"button\" must match MgActionMoreButtonType. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define if chevron is display\n   */\n  @Prop() displayChevron = false;\n  @Watch('displayChevron')\n  validateDisplayChevron(newValue: MgActionMore['displayChevron']): void {\n    if (newValue && this.button.isIcon === true) {\n      throw new Error(`<${this.name}> prop \"displayChevron\" can't be used with a 'button\" prop \"isIcon\" attribute.`);\n    }\n  }\n  /**\n   * Menu expanded state\n   */\n  @State() expanded = false;\n\n  /************\n   * Methods *\n   ***********/\n\n  /**\n   * Toggle expanded props\n   */\n  private toggleExpanded = (): void => {\n    this.expanded = !this.expanded;\n  };\n\n  /**\n   * Handle popover display change value\n   * @param event - display change updated value\n   */\n  private handleDisplayChange = (event: CustomEvent): void => {\n    this.expanded = event.detail;\n  };\n\n  /**\n   * Button click handler\n   */\n  private handleButton = (): void => {\n    this.toggleExpanded();\n  };\n\n  /**\n   * Item click handler\n   * @param event - click event\n   * @param customHandler - item['mouseEventHandler']\n   */\n  private handleItemClick = (event: MouseEvent, customHandler: MgActionMoreItemType['mouseEventHandler']) => {\n    this.expanded = false;\n    customHandler(event);\n  };\n\n  /*************\n   * Lifecycle *\n   *************/\n\n  /**\n   * Validate props\n   */\n  componentWillLoad(): void {\n    this.messages = initLocales(this.element).messages.actionMore as MessageType;\n    this.validateItems(this.items);\n    this.validateButton(this.button);\n    this.validateIcon(this.icon);\n    this.validateDisplayChevron(this.displayChevron);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    const buttonLabel = this.button.label || this.messages.label;\n    const buttonContent = [buttonLabel];\n\n    if (!this.button.isIcon && this.displayChevron) {\n      buttonContent.push(\n        <span\n          class={{\n            [`${this.classBase}__chevron`]: true,\n            [`${this.classBase}__chevron--rotate`]: this.expanded === true,\n          }}\n        >\n          <mg-icon icon=\"chevron-down\"></mg-icon>\n        </span>,\n      );\n    }\n\n    return (\n      <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n        <span class={this.classBase}>\n          <mg-popover identifier={this.mgPopoverIdentifier} display={this.expanded} onDisplay-change={this.handleDisplayChange}>\n            <mg-button variant={this.button.variant} isIcon={this.button.isIcon} disabled={this.button.disabled} type=\"button\" label={buttonLabel} onClick={this.handleButton}>\n              {this.icon && <mg-icon {...this.icon}></mg-icon>}\n              {!this.button.isIcon && buttonContent}\n            </mg-button>\n            <div slot=\"content\">\n              <mg-menu direction={directions.VERTICAL} label={this.messages.label}>\n                {this.items.map(item =>\n                  isMgActionMoreDivider(item) ? (\n                    <mg-divider class=\"mg-c-action-more__divider\" key=\"divider\" full-width></mg-divider>\n                  ) : (\n                    <mg-menu-item\n                      key={item.label}\n                      status={item.status || Status.VISIBLE}\n                      target={item.target}\n                      href={item.href}\n                      // eslint-disable-next-line react/jsx-no-bind\n                      onClick={e => this.handleItemClick(e, item.mouseEventHandler)}\n                    >\n                      {item.icon?.icon && <mg-icon icon={item.icon.icon} variant={item.icon.variant} variantStyle={item.icon.variantStyle} slot=\"image\"></mg-icon>}\n                      <span slot=\"label\">{item.label}</span>\n                      {item.badge?.label && <mg-badge label={item.badge.label} value={item.badge.value} slot=\"information\" variant=\"text-color\"></mg-badge>}\n                    </mg-menu-item>\n                  ),\n                )}\n              </mg-menu>\n            </div>\n          </mg-popover>\n        </span>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/mg-alert.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@stencil/core/internal/client';
-import { Z as Ze, V as Ve } from './index.es.js';
+import { Z as Zt, G as Gt } from './index.es.js';
 import { i as initLocales } from './index2.js';
 import { d as defineCustomElement$5 } from './mg-button2.js';
 import { d as defineCustomElement$4 } from './mg-card2.js';
@@ -16,7 +16,6 @@ const variants = ['info', 'warning', 'success', 'danger'];
 const variantStyles = ['bar-left', 'background'];
 
 const mgAlertCss = ".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing:0 var(--mg-b-size-min-height) 0 0}";
-const MgAlertStyle0 = mgAlertCss;
 
 const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLElement {
     constructor() {
@@ -36,10 +35,18 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
         // Manage hover
         this.isFocused = false;
         this.isHovered = false;
+        /**
+         * Define variant
+         */
+        this.variant = 'info';
+        /**
+         * Define variant style
+         */
+        this.variantStyle = 'bar-left';
         /**
          * Component classes
          */
-        this.classCollection = new Ze(['mg-c-alert']);
+        this.classCollection = new Zt(['mg-c-alert']);
         /**
          * Define if component is using actions slot
          */
@@ -83,17 +90,17 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
     }
     watchDelay(newValue) {
         if (newValue !== undefined && newValue < 2) {
-            throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchVariant(newValue) {
         if (newValue && !variants.includes(newValue)) {
-            throw new Error(`<mg-alert> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<mg-alert> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchVariantStyle(newValue) {
         if (newValue && !variantStyles.includes(newValue)) {
-            throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     /**
@@ -152,7 +159,7 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
      * @returns HTML Element
      */
     render() {
-        return (h("mg-message", { key: '3978c0f16d1577cf9e488f75d710e6580e0064f5', class: this.classCollection.join(), role: ['info', 'success'].includes(this.variant) ? 'status' : 'alert', variant: this.variant, variantStyle: this.variantStyle }, h("slot", { key: '5e7dc7c38d5c2b6bbb65b8dd26d0eb3f499b5a2f' }), this.hasActions ? (h("span", { slot: "actions" }, h("slot", { name: "actions" }))) : (h("span", { class: "mg-c-alert__close-button" }, h("mg-button", { "is-icon": true, variant: "flat", label: this.messages.alert.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" }))))));
+        return (h("mg-message", { key: '25a886be17d690dfcbffea51dca06a8a102a4926', class: this.classCollection.join(), role: ['info', 'success'].includes(this.variant) ? 'status' : 'alert', variant: this.variant, variantStyle: this.variantStyle }, h("slot", { key: 'ddf8c61b96ee376384c28b81b0a16ff72c0e6dd1' }), this.hasActions ? (h("span", { slot: "actions" }, h("slot", { name: "actions" }))) : (h("span", { class: "mg-c-alert__close-button" }, h("mg-button", { "is-icon": true, variant: "flat", label: this.messages.alert.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" }))))));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -161,7 +168,7 @@ const MgAlert$1 = /*@__PURE__*/ proxyCustomElement(class MgAlert extends HTMLEle
         "variantStyle": ["watchVariantStyle"],
         "hidden": ["watchHidden"]
     }; }
-    static get style() { return MgAlertStyle0; }
+    static get style() { return mgAlertCss; }
 }, [1, "mg-alert", {
         "delay": [2],
         "variant": [1],
@@ -213,5 +220,6 @@ const MgAlert = MgAlert$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { MgAlert, defineCustomElement };
+//# sourceMappingURL=mg-alert.js.map
 
 //# sourceMappingURL=mg-alert.js.map

package/dist/components/mg-alert.js.map

@@ -1 +1 @@
-{"file":"mg-alert.js","mappings":";;;;;;;;AAEA;;;AAGO,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,CAAU,CAAC;AAO1E;;;AAGO,MAAM,aAAa,GAAG,CAAC,UAAU,EAAE,YAAY,CAAU;;ACfhE,MAAM,UAAU,GAAG,uJAAuJ,CAAC;AAC3K,sBAAe,UAAU;;MCaZA,SAAO;IALpB;;;;;;;;;;;QAWmB,qBAAgB,GAAG,0BAA0B,CAAC;;QAGvD,gBAAW,GAAkC,IAAI,CAAC;;QAGlD,cAAS,GAAG,KAAK,CAAC;QAClB,cAAS,GAAG,KAAK,CAAC;;;;QAmFjB,oBAAe,GAAc,IAAIC,EAAS,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;;;;QAK3D,eAAU,GAAG,KAAK,CAAC;;;;QAoBpB,aAAQ,GAAG;YACjB,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC;SACtF,CAAC;;;;QAKM,eAAU,GAAG;YACnB,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;SAChC,CAAC;;;;;QAMM,gBAAW,GAAG,CAAC,KAA8B;YACnD,IAAI,CAAC,UAAU,EAAE,CAAC;YAClB,MAAM,YAAY,GAAY,KAAK,CAAC,IAAI,KAAK,YAAY,CAAC;;YAE1D,IAAI,CAAC,YAAY,GAAG,WAAW,GAAG,WAAW,CAAC,GAAG,IAAI,CAAC;;YAGtD,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAC3B,YAAY,GAAG,YAAY,GAAG,UAAU,EACxC,QAAQ;gBACN,IAAI,CAAC,QAAQ,CAAC,IAAI,KAAK,YAAY,GAAG,WAAW,GAAG,WAAW,CAAC,GAAG,KAAK,CAAC;;gBAEzE,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS;oBAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;aACzD,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf,CAAC;SACH,CAAC;;;;QAKM,gBAAW,GAAG;YACpB,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;YAC3B,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;SAC5B,CAAC;KAmDH;IAlLC,UAAU,CAAC,QAA0B;QACnC,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,GAAG,CAAC,EAAE;YAC1C,MAAM,IAAI,KAAK,CAAC,yEAAyEC,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;SACjH;KACF;IAOD,YAAY,CAAC,QAA4B;QACvC,IAAI,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;YAC5C,MAAM,IAAI,KAAK,CAAC,6CAA6C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmBA,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;SAC3H;KACF;IAOD,iBAAiB,CAAC,QAAiC;QACjD,IAAI,QAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;YACjD,MAAM,IAAI,KAAK,CAAC,kDAAkD,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmBA,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;SACrI;KACF;;;;;IAOD,WAAW,CAAC,QAAiB;QAC3B,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,QAAQ,KAAK,EAAE,EAAE;YACnD,QAAQ,GAAG,IAAI,CAAC;SACjB;QACD,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;;YAE1B,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,OAAO,CAAC,KAAK;gBACrC,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;aAC3D,CAAC,CAAC;;YAEH,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;aAAM;YACL,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;;YAE1B,IAAI,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE;;gBAElB,IAAI,CAAC,QAAQ,EAAE,CAAC;;gBAEhB,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,OAAO,CAAC,KAAK;oBACrC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;iBACxD,CAAC,CAAC;aACJ;SACF;QACD,WAAW,CAAC,IAAI,CAAC,CAAC;KACnB;;;;;;;IA8ED,iBAAiB;;QAEf,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC;;QAEnD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAChC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC1C,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;;QAEtC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAC;QAC1E,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YACpB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;SACjD;KACF;;;;;IAMD,MAAM;QACJ,QACE,mEACE,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,EAClC,IAAI,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,QAAQ,GAAG,OAAO,EACrE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,YAAY,EAAE,IAAI,CAAC,YAAY,IAE/B,8DAAa,EACZ,IAAI,CAAC,UAAU,IACd,YAAM,IAAI,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,SAAS,GAAQ,CACvB,KAEP,YAAM,KAAK,EAAC,0BAA0B,IACpC,kCAAmB,OAAO,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,IACjG,eAAS,IAAI,EAAC,OAAO,GAAW,CACtB,CACP,CACR,CACU,EACb;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgAlert","ClassList","toString"],"sources":["src/components/molecules/mg-alert/mg-alert.conf.ts","../styles/dist/components/mg-alert.css?tag=mg-alert&encapsulation=shadow","src/components/molecules/mg-alert/mg-alert.tsx"],"sourcesContent":["import type { Variant, VariantStyle } from '../../../types';\n\n/**\n * List available variants\n */\nexport const variants = ['info', 'warning', 'success', 'danger'] as const;\n\n/**\n * Variant type\n */\nexport type VariantType = Variant & (typeof variants)[number];\n\n/**\n * List available variant styles\n */\nexport const variantStyles = ['bar-left', 'background'] as const;\n\n/**\n * VariantStyle type\n */\nexport type VariantStyleType = VariantStyle & (typeof variantStyles)[number];\n",".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing: 0 var(--mg-b-size-min-height) 0 0}/*# sourceMappingURL=mg-alert.css.map */\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch, forceUpdate } from '@stencil/core';\nimport { ClassList, toString } from '@mgdis/stencil-helpers';\nimport { variants, variantStyles, VariantStyleType, VariantType } from './mg-alert.conf';\nimport { initLocales } from '../../../locales';\n\n/**\n * @slot - Alert content\n * @slot actions - Actions content\n */\n@Component({\n  tag: 'mg-alert',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-alert.css',\n  shadow: true,\n})\nexport class MgAlert {\n  /************\n   * Internal *\n   ************/\n\n  // Classes\n  private readonly classCloseButton = 'mg-c-alert--close-button';\n\n  // Stored timer setted when hide action is run from setTimeOut\n  private storedTimer: ReturnType<typeof setTimeout> = null;\n\n  // Manage hover\n  private isFocused = false;\n  private isHovered = false;\n\n  // Locales\n  private messages;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgAlertElement;\n\n  /**\n   * Add a delay to hide/close message when it passed\n   * Value is defined in seconds and must greater than 2 seconds\n   */\n  @Prop() delay?: number;\n  @Watch('delay')\n  watchDelay(newValue: MgAlert['delay']): void {\n    if (newValue !== undefined && newValue < 2) {\n      throw new Error(`<mg-alert> prop \"delay\" must be greater than 2 seconds. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define variant\n   */\n  @Prop() variant?: VariantType;\n  @Watch('variant')\n  watchVariant(newValue: MgAlert['variant']): void {\n    if (newValue && !variants.includes(newValue)) {\n      throw new Error(`<mg-alert> prop \"variant\" must be one of: ${variants.join(', ')}. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define variant style\n   */\n  @Prop() variantStyle?: VariantStyleType;\n  @Watch('variantStyle')\n  watchVariantStyle(newValue: MgAlert['variantStyle']): void {\n    if (newValue && !variantStyles.includes(newValue)) {\n      throw new Error(`<mg-alert> prop \"variantStyle\" must be one of: ${variantStyles.join(', ')}. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Watch hidden prop\n   */\n  // eslint-disable-next-line @stencil-community/no-unused-watch\n  @Watch('hidden')\n  watchHidden(newValue: boolean): void {\n    if (typeof newValue === 'string' && newValue === '') {\n      newValue = true;\n    }\n    if (newValue) {\n      this.componentHide.emit();\n      // Remove event Listener\n      ['focusin', 'mouseenter'].forEach(event => {\n        this.element.removeEventListener(event, this.timerEvents);\n      });\n      // Clear Timer\n      this.clearTimer();\n    } else {\n      this.componentShow.emit();\n      // If delay is set\n      if (this.delay > 1) {\n        // Start timer\n        this.setTimer();\n        // Stop timer when get focus or mouse enter\n        ['focusin', 'mouseenter'].forEach(event => {\n          this.element.addEventListener(event, this.timerEvents);\n        });\n      }\n    }\n    forceUpdate(this);\n  }\n\n  /**\n   * Component classes\n   */\n  @State() classCollection: ClassList = new ClassList(['mg-c-alert']);\n\n  /**\n   * Define if component is using actions slot\n   */\n  @State() hasActions = false;\n\n  /**\n   * Emited event when alert is diplayed\n   */\n  @Event({ eventName: 'component-show' }) componentShow: EventEmitter<void>;\n\n  /**\n   * Emited event when alert is hidden\n   */\n  @Event({ eventName: 'component-hide' }) componentHide: EventEmitter<void>;\n\n  /**\n   * Emmited event when alert is closed\n   */\n  @Event({ eventName: 'component-close' }) componentClose: EventEmitter<void>;\n\n  /**\n   * Set timer\n   */\n  private setTimer = (): void => {\n    this.storedTimer = setTimeout(() => (this.element.hidden = true), this.delay * 1000);\n  };\n\n  /**\n   * Clear timer\n   */\n  private clearTimer = (): void => {\n    clearTimeout(this.storedTimer);\n  };\n\n  /**\n   * Event to add on element\n   * @param event - event\n   */\n  private timerEvents = (event: MouseEvent | FocusEvent): void => {\n    this.clearTimer();\n    const isMouseEvent: boolean = event.type === 'mouseenter';\n    // Needed to ensure we don't start the timer\n    this[isMouseEvent ? 'isHovered' : 'isFocused'] = true;\n\n    // Restart timer when loose focus AND mouse leave\n    this.element.addEventListener(\n      isMouseEvent ? 'mouseleave' : 'focusout',\n      eventOut => {\n        this[eventOut.type === 'mouseleave' ? 'isHovered' : 'isFocused'] = false;\n        // Start timer if needed\n        if (!this.isFocused && !this.isHovered) this.setTimer();\n      },\n      { once: true },\n    );\n  };\n\n  /**\n   * Handle close button\n   */\n  private handleClose = (): void => {\n    this.element.hidden = true;\n    this.componentClose.emit();\n  };\n\n  /*************\n   * Lifecycle *\n   *************/\n\n  /**\n   * Check if component props are well configured on init\n   */\n  componentWillLoad(): void {\n    // Get locales\n    this.messages = initLocales(this.element).messages;\n    // Validate\n    this.watchVariant(this.variant);\n    this.watchVariantStyle(this.variantStyle);\n    this.watchDelay(this.delay);\n    this.watchHidden(this.element.hidden);\n    // Check if component has actions slot\n    this.hasActions = this.element.querySelector('[slot=\"actions\"]') !== null;\n    if (!this.hasActions) {\n      this.classCollection.add(this.classCloseButton);\n    }\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <mg-message\n        class={this.classCollection.join()}\n        role={['info', 'success'].includes(this.variant) ? 'status' : 'alert'}\n        variant={this.variant}\n        variantStyle={this.variantStyle}\n      >\n        <slot></slot>\n        {this.hasActions ? (\n          <span slot=\"actions\">\n            <slot name=\"actions\"></slot>\n          </span>\n        ) : (\n          <span class=\"mg-c-alert__close-button\">\n            <mg-button is-icon variant=\"flat\" label={this.messages.alert.closeButton} onClick={this.handleClose}>\n              <mg-icon icon=\"cross\"></mg-icon>\n            </mg-button>\n          </span>\n        )}\n      </mg-message>\n    );\n  }\n}\n"],"version":3}
+{"file":"mg-alert.js","mappings":";;;;;;;;AAEA;;AAEG;AACI,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,CAAU;AAOzE;;AAEG;AACI,MAAM,aAAa,GAAG,CAAC,UAAU,EAAE,YAAY,CAAU;;ACfhE,MAAM,UAAU,GAAG,uJAAuJ;;MCc7JA,SAAO,iBAAAC,kBAAA,CAAA,MAAA,OAAA,SAAA,WAAA,CAAA;AALpB,IAAA,WAAA,GAAA;;;;;;;AAME;;AAEc;;AAGG,QAAA,IAAgB,CAAA,gBAAA,GAAG,0BAA0B;;AAGtD,QAAA,IAAW,CAAA,WAAA,GAAkC,IAAI;;AAGjD,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;AACjB,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;AA0BzB;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAiB,MAAM;AAQtC;;AAEG;AACK,QAAA,IAAY,CAAA,YAAA,GAAsB,UAAU;AAwCpD;;AAEG;QACM,IAAe,CAAA,eAAA,GAAc,IAAIC,EAAS,CAAC,CAAC,YAAY,CAAC,CAAC;AAEnE;;AAEG;AACM,QAAA,IAAU,CAAA,UAAA,GAAG,KAAK;AAiB3B;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,MAAW;YAC5B,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;AACtF,SAAC;AAED;;AAEG;AACK,QAAA,IAAU,CAAA,UAAA,GAAG,MAAW;AAC9B,YAAA,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC;AAChC,SAAC;AAED;;;AAGG;AACK,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,KAA8B,KAAU;YAC7D,IAAI,CAAC,UAAU,EAAE;AACjB,YAAA,MAAM,YAAY,GAAY,KAAK,CAAC,IAAI,KAAK,YAAY;;AAEzD,YAAA,IAAI,CAAC,YAAY,GAAG,WAAW,GAAG,WAAW,CAAC,GAAG,IAAI;;AAGrD,YAAA,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAC3B,YAAY,GAAG,YAAY,GAAG,UAAU,EACxC,QAAQ,IAAG;AACT,gBAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,KAAK,YAAY,GAAG,WAAW,GAAG,WAAW,CAAC,GAAG,KAAK;;gBAExE,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS;oBAAE,IAAI,CAAC,QAAQ,EAAE;AACzD,aAAC,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf;AACH,SAAC;AAED;;AAEG;AACK,QAAA,IAAW,CAAA,WAAA,GAAG,MAAW;AAC/B,YAAA,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI;AAC1B,YAAA,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE;AAC5B,SAAC;AAmDF;AAlLC,IAAA,UAAU,CAAC,QAA0B,EAAA;QACnC,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,GAAG,CAAC,EAAE;YAC1C,MAAM,IAAI,KAAK,CAAC,CAAyE,sEAAA,EAAAC,EAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;;AASnH,IAAA,YAAY,CAAC,QAA4B,EAAA;QACvC,IAAI,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;AAC5C,YAAA,MAAM,IAAI,KAAK,CAAC,CAA6C,0CAAA,EAAA,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmBA,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;;AAS7H,IAAA,iBAAiB,CAAC,QAAiC,EAAA;QACjD,IAAI,QAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;AACjD,YAAA,MAAM,IAAI,KAAK,CAAC,CAAkD,+CAAA,EAAA,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmBA,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;;AAIvI;;AAEG;;AAGH,IAAA,WAAW,CAAC,QAAiB,EAAA;QAC3B,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,QAAQ,KAAK,EAAE,EAAE;YACnD,QAAQ,GAAG,IAAI;;QAEjB,IAAI,QAAQ,EAAE;AACZ,YAAA,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE;;YAEzB,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,OAAO,CAAC,KAAK,IAAG;gBACxC,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC;AAC3D,aAAC,CAAC;;YAEF,IAAI,CAAC,UAAU,EAAE;;aACZ;AACL,YAAA,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE;;AAEzB,YAAA,IAAI,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE;;gBAElB,IAAI,CAAC,QAAQ,EAAE;;gBAEf,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,OAAO,CAAC,KAAK,IAAG;oBACxC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC;AACxD,iBAAC,CAAC;;;QAGN,WAAW,CAAC,IAAI,CAAC;;AAwEnB;;AAEe;AAEf;;AAEG;IACH,iBAAiB,GAAA;;QAEf,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ;;AAElD,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC;AAC/B,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC;AACzC,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;;AAErC,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,kBAAkB,CAAC,KAAK,IAAI;AACzE,QAAA,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YACpB,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC;;;AAInD;;;AAGG;IACH,MAAM,GAAA;AACJ,QAAA,QACE,mEACE,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,EAClC,IAAI,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,QAAQ,GAAG,OAAO,EACrE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,YAAY,EAAE,IAAI,CAAC,YAAY,EAAA,EAE/B,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EACZ,IAAI,CAAC,UAAU,IACd,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,SAAS,EAAA,EAClB,CAAA,CAAA,MAAA,EAAA,EAAM,IAAI,EAAC,SAAS,EAAA,CAAQ,CACvB,KAEP,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,0BAA0B,EAAA,EACpC,CAAA,CAAA,WAAA,EAAA,EAAA,SAAA,EAAA,IAAA,EAAmB,OAAO,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,EAAA,EACjG,CAAS,CAAA,SAAA,EAAA,EAAA,IAAI,EAAC,OAAO,EAAA,CAAW,CACtB,CACP,CACR,CACU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgAlert","__stencil_proxyCustomElement","ClassList","toString"],"sources":["src/components/molecules/mg-alert/mg-alert.conf.ts","../styles/dist/components/mg-alert.css?tag=mg-alert&encapsulation=shadow","src/components/molecules/mg-alert/mg-alert.tsx"],"sourcesContent":["import type { Variant, VariantStyle } from '../../../types';\n\n/**\n * List available variants\n */\nexport const variants = ['info', 'warning', 'success', 'danger'] as const;\n\n/**\n * Variant type\n */\nexport type VariantType = Variant & (typeof variants)[number];\n\n/**\n * List available variant styles\n */\nexport const variantStyles = ['bar-left', 'background'] as const;\n\n/**\n * VariantStyle type\n */\nexport type VariantStyleType = VariantStyle & (typeof variantStyles)[number];\n",".mg-c-alert__close-button{position:absolute;top:0;right:0}.mg-c-alert.mg-c-alert--close-button{--mg-c-card-spacing: 0 var(--mg-b-size-min-height) 0 0}/*# sourceMappingURL=mg-alert.css.map */\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch, forceUpdate } from '@stencil/core';\nimport { ClassList, toString } from '@mgdis/stencil-helpers';\nimport { variants, variantStyles, VariantStyleType, VariantType } from './mg-alert.conf';\nimport { initLocales } from '../../../locales';\n\n/**\n * @slot - Alert content\n * @slot actions - Actions content\n */\n@Component({\n  tag: 'mg-alert',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-alert.css',\n  shadow: true,\n})\nexport class MgAlert {\n  /************\n   * Internal *\n   ************/\n\n  // Classes\n  private readonly classCloseButton = 'mg-c-alert--close-button';\n\n  // Stored timer setted when hide action is run from setTimeOut\n  private storedTimer: ReturnType<typeof setTimeout> = null;\n\n  // Manage hover\n  private isFocused = false;\n  private isHovered = false;\n\n  // Locales\n  private messages;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgAlertElement;\n\n  /**\n   * Add a delay to hide/close message when it passed\n   * Value is defined in seconds and must greater than 2 seconds\n   */\n  @Prop() delay?: number;\n  @Watch('delay')\n  watchDelay(newValue: MgAlert['delay']): void {\n    if (newValue !== undefined && newValue < 2) {\n      throw new Error(`<mg-alert> prop \"delay\" must be greater than 2 seconds. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define variant\n   */\n  @Prop() variant?: VariantType = 'info';\n  @Watch('variant')\n  watchVariant(newValue: MgAlert['variant']): void {\n    if (newValue && !variants.includes(newValue)) {\n      throw new Error(`<mg-alert> prop \"variant\" must be one of: ${variants.join(', ')}. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define variant style\n   */\n  @Prop() variantStyle?: VariantStyleType = 'bar-left';\n  @Watch('variantStyle')\n  watchVariantStyle(newValue: MgAlert['variantStyle']): void {\n    if (newValue && !variantStyles.includes(newValue)) {\n      throw new Error(`<mg-alert> prop \"variantStyle\" must be one of: ${variantStyles.join(', ')}. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Watch hidden prop\n   */\n  // eslint-disable-next-line @stencil-community/no-unused-watch\n  @Watch('hidden')\n  watchHidden(newValue: boolean): void {\n    if (typeof newValue === 'string' && newValue === '') {\n      newValue = true;\n    }\n    if (newValue) {\n      this.componentHide.emit();\n      // Remove event Listener\n      ['focusin', 'mouseenter'].forEach(event => {\n        this.element.removeEventListener(event, this.timerEvents);\n      });\n      // Clear Timer\n      this.clearTimer();\n    } else {\n      this.componentShow.emit();\n      // If delay is set\n      if (this.delay > 1) {\n        // Start timer\n        this.setTimer();\n        // Stop timer when get focus or mouse enter\n        ['focusin', 'mouseenter'].forEach(event => {\n          this.element.addEventListener(event, this.timerEvents);\n        });\n      }\n    }\n    forceUpdate(this);\n  }\n\n  /**\n   * Component classes\n   */\n  @State() classCollection: ClassList = new ClassList(['mg-c-alert']);\n\n  /**\n   * Define if component is using actions slot\n   */\n  @State() hasActions = false;\n\n  /**\n   * Emited event when alert is diplayed\n   */\n  @Event({ eventName: 'component-show' }) componentShow: EventEmitter<void>;\n\n  /**\n   * Emited event when alert is hidden\n   */\n  @Event({ eventName: 'component-hide' }) componentHide: EventEmitter<void>;\n\n  /**\n   * Emmited event when alert is closed\n   */\n  @Event({ eventName: 'component-close' }) componentClose: EventEmitter<void>;\n\n  /**\n   * Set timer\n   */\n  private setTimer = (): void => {\n    this.storedTimer = setTimeout(() => (this.element.hidden = true), this.delay * 1000);\n  };\n\n  /**\n   * Clear timer\n   */\n  private clearTimer = (): void => {\n    clearTimeout(this.storedTimer);\n  };\n\n  /**\n   * Event to add on element\n   * @param event - event\n   */\n  private timerEvents = (event: MouseEvent | FocusEvent): void => {\n    this.clearTimer();\n    const isMouseEvent: boolean = event.type === 'mouseenter';\n    // Needed to ensure we don't start the timer\n    this[isMouseEvent ? 'isHovered' : 'isFocused'] = true;\n\n    // Restart timer when loose focus AND mouse leave\n    this.element.addEventListener(\n      isMouseEvent ? 'mouseleave' : 'focusout',\n      eventOut => {\n        this[eventOut.type === 'mouseleave' ? 'isHovered' : 'isFocused'] = false;\n        // Start timer if needed\n        if (!this.isFocused && !this.isHovered) this.setTimer();\n      },\n      { once: true },\n    );\n  };\n\n  /**\n   * Handle close button\n   */\n  private handleClose = (): void => {\n    this.element.hidden = true;\n    this.componentClose.emit();\n  };\n\n  /*************\n   * Lifecycle *\n   *************/\n\n  /**\n   * Check if component props are well configured on init\n   */\n  componentWillLoad(): void {\n    // Get locales\n    this.messages = initLocales(this.element).messages;\n    // Validate\n    this.watchVariant(this.variant);\n    this.watchVariantStyle(this.variantStyle);\n    this.watchDelay(this.delay);\n    this.watchHidden(this.element.hidden);\n    // Check if component has actions slot\n    this.hasActions = this.element.querySelector('[slot=\"actions\"]') !== null;\n    if (!this.hasActions) {\n      this.classCollection.add(this.classCloseButton);\n    }\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <mg-message\n        class={this.classCollection.join()}\n        role={['info', 'success'].includes(this.variant) ? 'status' : 'alert'}\n        variant={this.variant}\n        variantStyle={this.variantStyle}\n      >\n        <slot></slot>\n        {this.hasActions ? (\n          <span slot=\"actions\">\n            <slot name=\"actions\"></slot>\n          </span>\n        ) : (\n          <span class=\"mg-c-alert__close-button\">\n            <mg-button is-icon variant=\"flat\" label={this.messages.alert.closeButton} onClick={this.handleClose}>\n              <mg-icon icon=\"cross\"></mg-icon>\n            </mg-button>\n          </span>\n        )}\n      </mg-message>\n    );\n  }\n}\n"],"version":3}

package/dist/components/mg-badge.js

@@ -4,5 +4,6 @@ const MgBadge = MgBadge$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { MgBadge, defineCustomElement };
+//# sourceMappingURL=mg-badge.js.map
 
 //# sourceMappingURL=mg-badge.js.map

package/dist/components/mg-badge2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { Z as Ze, V as Ve, m as me } from './index.es.js';
+import { Z as Zt, G as Gt, D as De } from './index.es.js';
 
 /**
  * List of all possibles variants
@@ -7,7 +7,6 @@ import { Z as Ze, V as Ve, m as me } from './index.es.js';
 const variants = ['info', 'primary', 'secondary', 'success', 'warning', 'danger', 'text-color'];
 
 const mgBadgeCss = ".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}/*!\n * @prop --mg-c-badge-size: Defines the height and minimum width of the badge. The default value is `--mg-b-size-16`.\n * @prop --mg-c-badge-font-size: Defines the font size of the badge. The default value is `--mg-b-font-size-small`.\n * @prop --mg-c-badge-color-text: Defines the font color of the badge when used with the `text-color` variant and without `outline`. The default value is `--mg-b-color-light`.\n */.mg-c-badge{min-width:var(--mg-c-badge-size);height:var(--mg-c-badge-size);box-sizing:border-box;padding:0 var(--mg-b-size-4);border:var(--mg-b-size-border) solid;border-radius:calc(var(--mg-c-badge-size)/2);font-size:var(--mg-c-badge-font-size);font-weight:600;line-height:var(--mg-c-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:var(--mg-b-color-primary);background-color:var(--mg-b-color-primary);color:var(--mg-b-color-text-on-primary)}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-primary)}.mg-c-badge.mg-c-badge--secondary{border-color:var(--mg-b-color-secondary);background-color:var(--mg-b-color-secondary);color:var(--mg-b-color-text-on-secondary)}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-secondary)}.mg-c-badge.mg-c-badge--danger{border-color:var(--mg-b-color-danger);background-color:var(--mg-b-color-danger);color:var(--mg-b-color-text-on-danger)}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-badge.mg-c-badge--info{border-color:var(--mg-b-color-info);background-color:var(--mg-b-color-info);color:var(--mg-b-color-text-on-info)}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-badge.mg-c-badge--success{border-color:var(--mg-b-color-success);background-color:var(--mg-b-color-success);color:var(--mg-b-color-text-on-success)}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-badge.mg-c-badge--warning{border-color:var(--mg-b-color-warning);background-color:var(--mg-b-color-warning);color:var(--mg-b-color-text-on-warning)}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-badge.mg-c-badge--text-color{border-color:currentcolor;background-color:currentcolor}.mg-c-badge.mg-c-badge--text-color .mg-c-badge__value{color:var(--mg-c-badge-color-text, var(--mg-b-color-light))}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline{background-color:rgba(0,0,0,0)}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline .mg-c-badge__value{color:currentcolor}.mg-c-badge,mg-badge{display:inline-flex;align-items:center;justify-content:center}";
-const MgBadgeStyle0 = mgBadgeCss;
 
 const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLElement {
     constructor() {
@@ -22,25 +21,29 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
         /**
          * Define badge variant
          */
-        this.variant = variants[0]; // info
+        this.variant = 'info';
+        /**
+         * Define if button is using outline style
+         */
+        this.outline = false;
         /**
          * Component classes
          */
-        this.classCollection = new Ze(['mg-c-badge']);
+        this.classCollection = new Zt(['mg-c-badge']);
     }
     validateValue(newValue) {
         if (/^[^A-Z]+$/i.exec(`${newValue}`) === null) {
-            throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateLabel(newValue) {
-        if (!me(newValue)) {
-            throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${Ve(newValue)}.`);
+        if (!De(newValue)) {
+            throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateVariant(newValue, oldValue) {
         if (!variants.includes(newValue)) {
-            throw new Error(`<mg-badge> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${Ve(newValue)}.`);
+            throw new Error(`<mg-badge> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -69,7 +72,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
      * @returns HTML Element
      */
     render() {
-        return (h("span", { key: 'db20118c3cfbc79ca65bcbbda1029857211615b2', class: this.classCollection.join() }, h("span", { key: '1898f1b56935c4acdab79f8c794025009f2d943c', class: "mg-c-badge__value" }, this.value), h("span", { key: '2ca8814b685441f11c8a1804c1e98d3e58f26d84', class: "mg-u-visually-hidden" }, this.label)));
+        return (h("span", { key: 'b5d63ec3facd86cae8b8612a5318fcc8c63287a9', class: this.classCollection.join() }, h("span", { key: '350de0e420b7a7d432cd8179b4c353375d8bf185', class: "mg-c-badge__value" }, this.value), h("span", { key: '279602e43db9644f673ddbbd79970f07439c6aad', class: "mg-u-visually-hidden" }, this.label)));
     }
     static get watchers() { return {
         "value": ["validateValue"],
@@ -77,7 +80,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
         "variant": ["validateVariant"],
         "outline": ["validateOutline"]
     }; }
-    static get style() { return MgBadgeStyle0; }
+    static get style() { return mgBadgeCss; }
 }, [1, "mg-badge", {
         "value": [8],
         "label": [1],
@@ -106,5 +109,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { MgBadge as M, defineCustomElement as d };
+//# sourceMappingURL=mg-badge2.js.map
 
 //# sourceMappingURL=mg-badge2.js.map

package/dist/components/mg-badge2.js.map

@@ -1 +1 @@
-{"file":"mg-badge2.js","mappings":";;;AAEA;;;AAGO,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,CAAU;;ACL/G,MAAM,UAAU,GAAG,2qGAA2qG,CAAC;AAC/rG,sBAAe,UAAU;;MCQZ,OAAO;IALpB;;;;;;;;QAWmB,iBAAY,GAAG,qBAAqB,CAAC;;;;QAgC9C,YAAO,GAAsB,QAAQ,CAAC,CAAC,CAAC,CAAC;;;;QA0BxC,oBAAe,GAAc,IAAIA,EAAS,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;KAwBrE;IAvEC,aAAa,CAAC,QAA0B;QACtC,IAAI,YAAY,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,KAAK,IAAI,EAAE;YAC7C,MAAM,IAAI,KAAK,CAAC,mGAAmGC,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;SAC3I;KACF;IAQD,aAAa,CAAC,QAA0B;QACtC,IAAI,CAACC,EAAa,CAAC,QAAQ,CAAC,EAAE;YAC5B,MAAM,IAAI,KAAK,CAAC,2EAA2ED,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;SACnH;KACF;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,mBAAmBA,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;SAC3H;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;KACF;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;KACrD;;;;IAUD,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;KACpC;;;;;IAMD,MAAM;QACJ,QACE,6DAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,IACtC,6DAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACnD,6DAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ClassList","toString","isValidString"],"sources":["src/components/atoms/mg-badge/mg-badge.conf.ts","../styles/dist/components/mg-badge.css?tag=mg-badge&encapsulation=shadow","src/components/atoms/mg-badge/mg-badge.tsx"],"sourcesContent":["import type { Variant } from '../../../types';\n\n/**\n * List of all possibles variants\n */\nexport const variants = ['info', 'primary', 'secondary', 'success', 'warning', 'danger', 'text-color'] as const;\n\n/**\n * Variant type from variants\n */\nexport type BadgeVariantType = Variant & (typeof variants)[number];\n",".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}/*!\n * @prop --mg-c-badge-size: Defines the height and minimum width of the badge. The default value is `--mg-b-size-16`.\n * @prop --mg-c-badge-font-size: Defines the font size of the badge. The default value is `--mg-b-font-size-small`.\n * @prop --mg-c-badge-color-text: Defines the font color of the badge when used with the `text-color` variant and without `outline`. The default value is `--mg-b-color-light`.\n */.mg-c-badge{min-width:var(--mg-c-badge-size);height:var(--mg-c-badge-size);box-sizing:border-box;padding:0 var(--mg-b-size-4);border:var(--mg-b-size-border) solid;border-radius:calc(var(--mg-c-badge-size)/2);font-size:var(--mg-c-badge-font-size);font-weight:600;line-height:var(--mg-c-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:var(--mg-b-color-primary);background-color:var(--mg-b-color-primary);color:var(--mg-b-color-text-on-primary)}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-primary)}.mg-c-badge.mg-c-badge--secondary{border-color:var(--mg-b-color-secondary);background-color:var(--mg-b-color-secondary);color:var(--mg-b-color-text-on-secondary)}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-secondary)}.mg-c-badge.mg-c-badge--danger{border-color:var(--mg-b-color-danger);background-color:var(--mg-b-color-danger);color:var(--mg-b-color-text-on-danger)}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-badge.mg-c-badge--info{border-color:var(--mg-b-color-info);background-color:var(--mg-b-color-info);color:var(--mg-b-color-text-on-info)}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-badge.mg-c-badge--success{border-color:var(--mg-b-color-success);background-color:var(--mg-b-color-success);color:var(--mg-b-color-text-on-success)}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-badge.mg-c-badge--warning{border-color:var(--mg-b-color-warning);background-color:var(--mg-b-color-warning);color:var(--mg-b-color-text-on-warning)}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-badge.mg-c-badge--text-color{border-color:currentcolor;background-color:currentcolor}.mg-c-badge.mg-c-badge--text-color .mg-c-badge__value{color:var(--mg-c-badge-color-text, var(--mg-b-color-light))}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline{background-color:rgba(0,0,0,0)}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline .mg-c-badge__value{color:currentcolor}.mg-c-badge,mg-badge{display:inline-flex;align-items:center;justify-content:center}/*# sourceMappingURL=mg-badge.css.map */\n","import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { variants, BadgeVariantType } from './mg-badge.conf';\nimport { ClassList, isValidString, toString } from '@mgdis/stencil-helpers';\n\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 (/^[^A-Z]+$/i.exec(`${newValue}`) === null) {\n      throw new Error(`<mg-badge> prop \"value\" is required and must be integer and/or special character. Passed value: ${toString(newValue)}.`);\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 and must be a string. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define badge 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(', ')}. Passed value: ${toString(newValue)}.`);\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-badge2.js","mappings":";;;AAEA;;AAEG;AACI,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,CAAU;;ACL/G,MAAM,UAAU,GAAG,2qGAA2qG;;MCSjrG,OAAO,iBAAAA,kBAAA,CAAA,MAAA,OAAA,SAAA,WAAA,CAAA;AALpB,IAAA,WAAA,GAAA;;;;AAME;;AAEc;;AAGG,QAAA,IAAY,CAAA,YAAA,GAAG,CAAA,mBAAA,CAAqB;AA6BrD;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAsB,MAAM;AAa3C;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAa,KAAK;AAOjC;;AAEG;QACM,IAAe,CAAA,eAAA,GAAc,IAAIC,EAAS,CAAC,CAAC,YAAY,CAAC,CAAC;AAwBpE;AAvEC,IAAA,aAAa,CAAC,QAA0B,EAAA;QACtC,IAAI,YAAY,CAAC,IAAI,CAAC,CAAA,EAAG,QAAQ,CAAA,CAAE,CAAC,KAAK,IAAI,EAAE;YAC7C,MAAM,IAAI,KAAK,CAAC,CAAmG,gGAAA,EAAAC,EAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;;AAU7I,IAAA,aAAa,CAAC,QAA0B,EAAA;AACtC,QAAA,IAAI,CAACC,EAAa,CAAC,QAAQ,CAAC,EAAE;YAC5B,MAAM,IAAI,KAAK,CAAC,CAA2E,wEAAA,EAAAD,EAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;;IASrH,eAAe,CAAC,QAA4B,EAAE,QAA6B,EAAA;QACzE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;AAChC,YAAA,MAAM,IAAI,KAAK,CAAC,CAA6C,0CAAA,EAAA,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmBA,EAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;aACpH;AACL,YAAA,IAAI,QAAQ,KAAK,SAAS,EAAE;gBAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAe,YAAA,EAAA,QAAQ,CAAE,CAAA,CAAC;;YAExD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAe,YAAA,EAAA,QAAQ,CAAE,CAAA,CAAC;;;AASvD,IAAA,eAAe,CAAC,QAA4B,EAAA;AAC1C,QAAA,IAAI,QAAQ;YAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC;;YACpD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;;AAQrD;;AAEG;IACH,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;AAC9B,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;AAC9B,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC;AAClC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC;;AAGpC;;;AAGG;IACH,MAAM,GAAA;QACJ,QACE,6DAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,EAAA,EACtC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACnD,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sBAAsB,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CACjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","ClassList","toString","isValidString"],"sources":["src/components/atoms/mg-badge/mg-badge.conf.ts","../styles/dist/components/mg-badge.css?tag=mg-badge&encapsulation=shadow","src/components/atoms/mg-badge/mg-badge.tsx"],"sourcesContent":["import type { Variant } from '../../../types';\n\n/**\n * List of all possibles variants\n */\nexport const variants = ['info', 'primary', 'secondary', 'success', 'warning', 'danger', 'text-color'] as const;\n\n/**\n * Variant type from variants\n */\nexport type BadgeVariantType = Variant & (typeof variants)[number];\n",".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}/*!\n * @prop --mg-c-badge-size: Defines the height and minimum width of the badge. The default value is `--mg-b-size-16`.\n * @prop --mg-c-badge-font-size: Defines the font size of the badge. The default value is `--mg-b-font-size-small`.\n * @prop --mg-c-badge-color-text: Defines the font color of the badge when used with the `text-color` variant and without `outline`. The default value is `--mg-b-color-light`.\n */.mg-c-badge{min-width:var(--mg-c-badge-size);height:var(--mg-c-badge-size);box-sizing:border-box;padding:0 var(--mg-b-size-4);border:var(--mg-b-size-border) solid;border-radius:calc(var(--mg-c-badge-size)/2);font-size:var(--mg-c-badge-font-size);font-weight:600;line-height:var(--mg-c-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:var(--mg-b-color-primary);background-color:var(--mg-b-color-primary);color:var(--mg-b-color-text-on-primary)}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-primary)}.mg-c-badge.mg-c-badge--secondary{border-color:var(--mg-b-color-secondary);background-color:var(--mg-b-color-secondary);color:var(--mg-b-color-text-on-secondary)}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-secondary)}.mg-c-badge.mg-c-badge--danger{border-color:var(--mg-b-color-danger);background-color:var(--mg-b-color-danger);color:var(--mg-b-color-text-on-danger)}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-badge.mg-c-badge--info{border-color:var(--mg-b-color-info);background-color:var(--mg-b-color-info);color:var(--mg-b-color-text-on-info)}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-badge.mg-c-badge--success{border-color:var(--mg-b-color-success);background-color:var(--mg-b-color-success);color:var(--mg-b-color-text-on-success)}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-badge.mg-c-badge--warning{border-color:var(--mg-b-color-warning);background-color:var(--mg-b-color-warning);color:var(--mg-b-color-text-on-warning)}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-badge.mg-c-badge--text-color{border-color:currentcolor;background-color:currentcolor}.mg-c-badge.mg-c-badge--text-color .mg-c-badge__value{color:var(--mg-c-badge-color-text, var(--mg-b-color-light))}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline{background-color:rgba(0,0,0,0)}.mg-c-badge.mg-c-badge--text-color.mg-c-badge--outline .mg-c-badge__value{color:currentcolor}.mg-c-badge,mg-badge{display:inline-flex;align-items:center;justify-content:center}/*# sourceMappingURL=mg-badge.css.map */\n","import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { variants, BadgeVariantType } from './mg-badge.conf';\nimport { ClassList, isValidString, toString } from '@mgdis/stencil-helpers';\n\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 (/^[^A-Z]+$/i.exec(`${newValue}`) === null) {\n      throw new Error(`<mg-badge> prop \"value\" is required and must be integer and/or special character. Passed value: ${toString(newValue)}.`);\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 and must be a string. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define badge variant\n   */\n  @Prop() variant?: BadgeVariantType = '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(', ')}. Passed value: ${toString(newValue)}.`);\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 = false;\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}

package/dist/components/mg-button.js

@@ -4,5 +4,6 @@ const MgButton = MgButton$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { MgButton, defineCustomElement };
+//# sourceMappingURL=mg-button.js.map
 
 //# sourceMappingURL=mg-button.js.map