@mgdis/mg-components 6.3.0 → 6.4.0

package/dist/mg-components/p-3aecf564.entry.js

@@ -1,2 +0,0 @@
-import{r,h as e,H as s}from"./p-15b6849a.js";import{m as a,Y as o,V as i}from"./p-ee51ec5e.js";const t=["progressbar","meter"];const c="/*!\n * @prop --mg-c-progress-size: Defines the size of the progress bar. Default value is `--mg-b-size-8`.\n * @prop --mg-c-progress-border-color: Defines the color of the progress bar border. Default value is `--mg-b-color-neutral-80`.\n * @prop --mg-c-progress-bar-color-background: Defines the color of the progress bar. Default value is `--mg-b-color-neutral-30`.\n * @prop --mg-c-progress-fill-color-background: Defines the color of the progress bar fill background. Default value is `--mg-b-color-app`.\n */.mg-c-progress{min-width:calc(var(--mg-b-size-16)*4)}.mg-c-progress__bar{position:relative;overflow:hidden;height:var(--mg-c-progress-size);border-width:var(--mg-b-size-border);border-style:solid;border-color:var(--mg-c-progress-border-color);border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);background-color:var(--mg-c-progress-bar-color-background)}.mg-c-progress__fill{height:100%;border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);transition:width 300ms ease-in-out}.mg-c-progress__bar.mg-c-progress__bar--active .mg-c-progress__fill{background-color:var(--mg-c-progress-fill-color-background)}";const g=c;const l=class{constructor(e){r(this,e);this.label=undefined;this.ariaRole="progressbar";this.value=0;this.min=0;this.max=100}watchLabel(r){if(!a(r)){throw new Error(`<mg-progress> prop "label" must be a valid string. Passed value: ${o(r)}.`)}}watchAriaRole(r){if(r&&!t.includes(r)){throw new Error(`<mg-progress> prop "ariaRole" must be one of: ${t.join(", ")}. Passed value: ${o(r)}.`)}}watchValue(r){if(r!==undefined&&(!i(r)||!(r>=this.min&&r<=this.max)))throw new Error(`<mg-progress> prop “value” must be a number within the range ${this.min} to ${this.max}. Passed value: ${o(r)}.`)}watchMin(r){if(r!==0&&r!==undefined&&(!i(r)||r>=this.max))throw new Error(`<mg-progress> prop “min” must be a number lower than: ${this.max}. Passed value: ${o(r)}.`)}watchMax(r){if(r!==100&&r!==undefined&&(!i(r)||r<=this.min))throw new Error(`<mg-progress> prop “max” must be a number greater than: ${this.min}. Passed value: ${o(r)}.`)}componentWillLoad(){this.watchLabel(this.label);this.watchAriaRole(this.ariaRole);this.watchMin(this.min);this.watchMax(this.max);this.watchValue(this.value)}render(){return e(s,{key:"c2a8b5264af27dab4f81981a6d20d04d572321db",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},e("div",{key:"1ab08ca9582182c7c2e9cf1041e68cfd38390e3b",class:"mg-c-progress"},e("div",{key:"95044f35b5fcc1b5eb380828acc3935ff30c6c1f",class:{"mg-c-progress__bar":true,"mg-c-progress__bar--active":this.value>this.min}},e("div",{key:"4d3588379c0b1a135dd9118fd2cb3c00c9dd31cb",class:"mg-c-progress__fill",style:{width:`${Math.round((this.value-this.min)/(this.max-this.min)*100)}%`}}))))}static get watchers(){return{label:["watchLabel"],ariaRole:["watchAriaRole"],value:["watchValue"],min:["watchMin"],max:["watchMax"]}}};l.style=g;export{l as mg_progress};
-//# sourceMappingURL=p-3aecf564.entry.js.map

package/dist/mg-components/p-3aecf564.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["roles","mgProgressCss","MgProgressStyle0","MgProgress","watchLabel","newValue","isValidString","Error","toString","watchAriaRole","includes","join","watchValue","undefined","isValidNumber","this","min","max","watchMin","watchMax","componentWillLoad","label","ariaRole","value","render","h","Host","key","role","class","style","width","Math","round"],"sources":["src/components/molecules/mg-progress/mg-progress.conf.ts","../styles/dist/components/mg-progress.css?tag=mg-progress&encapsulation=shadow","src/components/molecules/mg-progress/mg-progress.tsx"],"sourcesContent":["import { AriaRole } from '../../../types';\n\n/**\n * List of all possibles roles\n */\nexport const roles = ['progressbar', 'meter'] as const;\n\n/**\n * Aria Role type from roles\n */\nexport type AriaRoleType = AriaRole & (typeof roles)[number];\n","/*!\n * @prop --mg-c-progress-size: Defines the size of the progress bar. Default value is `--mg-b-size-8`.\n * @prop --mg-c-progress-border-color: Defines the color of the progress bar border. Default value is `--mg-b-color-neutral-80`.\n * @prop --mg-c-progress-bar-color-background: Defines the color of the progress bar. Default value is `--mg-b-color-neutral-30`.\n * @prop --mg-c-progress-fill-color-background: Defines the color of the progress bar fill background. Default value is `--mg-b-color-app`.\n */.mg-c-progress{min-width:calc(var(--mg-b-size-16)*4)}.mg-c-progress__bar{position:relative;overflow:hidden;height:var(--mg-c-progress-size);border-width:var(--mg-b-size-border);border-style:solid;border-color:var(--mg-c-progress-border-color);border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);background-color:var(--mg-c-progress-bar-color-background)}.mg-c-progress__fill{height:100%;border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);transition:width 300ms ease-in-out}.mg-c-progress__bar.mg-c-progress__bar--active .mg-c-progress__fill{background-color:var(--mg-c-progress-fill-color-background)}/*# sourceMappingURL=mg-progress.css.map */\n","import { Component, h, Host, Prop, Watch } from '@stencil/core';\nimport { isValidNumber, isValidString, toString } from '@mgdis/stencil-helpers';\nimport { AriaRoleType, roles } from './mg-progress.conf';\n\n@Component({\n  tag: 'mg-progress',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-progress.css',\n  shadow: true,\n})\nexport class MgProgress {\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Define label\n   */\n  @Prop() label!: string;\n  @Watch('label')\n  watchLabel(newValue: MgProgress['label']): void {\n    if (!isValidString(newValue)) {\n      throw new Error(`<mg-progress> prop \"label\" must be a valid string. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define progress role\n   * - `progressbar` to indicate a progress, such as loading or percent completion of a task\n   * - `meter` to indicate a graphical display of a numeric value that varies within a defined range\n   */\n  @Prop() ariaRole?: AriaRoleType = 'progressbar';\n  @Watch('ariaRole')\n  watchAriaRole(newValue: MgProgress['ariaRole']): void {\n    if (newValue && !roles.includes(newValue)) {\n      throw new Error(`<mg-progress> prop \"ariaRole\" must be one of: ${roles.join(', ')}. Passed value: ${toString(newValue)}.`);\n    }\n  }\n\n  /**\n   * Define current value\n   * By default, it will be displayed as a percentage value.\n   * If you don’t specify the min and max props, the value should be a number within the range of 0 to 100.\n   */\n  @Prop() value?: number = 0;\n  @Watch('value')\n  watchValue(newValue: MgProgress['value']): void {\n    if (newValue !== undefined && (!isValidNumber(newValue) || !(newValue >= this.min && newValue <= this.max)))\n      throw new Error(`<mg-progress> prop “value” must be a number within the range ${this.min} to ${this.max}. Passed value: ${toString(newValue)}.`);\n  }\n\n  /**\n   * Define the minimum value in the range\n   */\n  @Prop() min?: number = 0;\n  @Watch('min')\n  watchMin(newValue: MgProgress['min']): void {\n    if (newValue !== 0 && newValue !== undefined && (!isValidNumber(newValue) || newValue >= this.max))\n      throw new Error(`<mg-progress> prop “min” must be a number lower than: ${this.max}. Passed value: ${toString(newValue)}.`);\n  }\n\n  /**\n   * Define the maximum value in the range\n   */\n  @Prop() max?: number = 100;\n  @Watch('max')\n  watchMax(newValue: MgProgress['max']): void {\n    if (newValue !== 100 && newValue !== undefined && (!isValidNumber(newValue) || newValue <= this.min))\n      throw new Error(`<mg-progress> prop “max” must be a number greater than: ${this.min}. Passed value: ${toString(newValue)}.`);\n  }\n\n  /*************\n   * Lifecycle *\n   *************/\n\n  /**\n   * Check if component props are well configured on init\n   */\n  componentWillLoad(): void {\n    // validate props\n    this.watchLabel(this.label);\n    this.watchAriaRole(this.ariaRole);\n    this.watchMin(this.min);\n    this.watchMax(this.max);\n    this.watchValue(this.value);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <Host role={this.ariaRole} aria-label={this.label} aria-valuenow={this.value} aria-valuemin={this.min} aria-valuemax={this.max}>\n        <div class=\"mg-c-progress\">\n          <div class={{ 'mg-c-progress__bar': true, 'mg-c-progress__bar--active': this.value > this.min }}>\n            <div\n              class=\"mg-c-progress__fill\"\n              style={{\n                width: `${Math.round(((this.value - this.min) / (this.max - this.min)) * 100)}%`,\n              }}\n            ></div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+FAKO,MAAMA,EAAQ,CAAC,cAAe,SCLrC,MAAMC,EAAgB,mpCACtB,MAAAC,EAAeD,E,MCQFE,EAAU,M,4DAqBa,c,WAaT,E,SAUF,E,SAUA,G,CA5CvB,UAAAC,CAAWC,GACT,IAAKC,EAAcD,GAAW,CAC5B,MAAM,IAAIE,MAAM,oEAAoEC,EAASH,M,EAWjG,aAAAI,CAAcJ,GACZ,GAAIA,IAAaL,EAAMU,SAASL,GAAW,CACzC,MAAM,IAAIE,MAAM,iDAAiDP,EAAMW,KAAK,wBAAwBH,EAASH,M,EAWjH,UAAAO,CAAWP,GACT,GAAIA,IAAaQ,aAAeC,EAAcT,MAAeA,GAAYU,KAAKC,KAAOX,GAAYU,KAAKE,MACpG,MAAM,IAAIV,MAAM,gEAAgEQ,KAAKC,UAAUD,KAAKE,sBAAsBT,EAASH,M,CAQvI,QAAAa,CAASb,GACP,GAAIA,IAAa,GAAKA,IAAaQ,aAAeC,EAAcT,IAAaA,GAAYU,KAAKE,KAC5F,MAAM,IAAIV,MAAM,yDAAyDQ,KAAKE,sBAAsBT,EAASH,M,CAQjH,QAAAc,CAASd,GACP,GAAIA,IAAa,KAAOA,IAAaQ,aAAeC,EAAcT,IAAaA,GAAYU,KAAKC,KAC9F,MAAM,IAAIT,MAAM,2DAA2DQ,KAAKC,sBAAsBR,EAASH,M,CAUnH,iBAAAe,GAEEL,KAAKX,WAAWW,KAAKM,OACrBN,KAAKN,cAAcM,KAAKO,UACxBP,KAAKG,SAASH,KAAKC,KACnBD,KAAKI,SAASJ,KAAKE,KACnBF,KAAKH,WAAWG,KAAKQ,M,CAOvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAMb,KAAKO,SAAQ,aAAcP,KAAKM,MAAK,gBAAiBN,KAAKQ,MAAK,gBAAiBR,KAAKC,IAAG,gBAAiBD,KAAKE,KACzHQ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,iBACTJ,EAAA,OAAAE,IAAA,2CAAKE,MAAO,CAAE,qBAAsB,KAAM,6BAA8Bd,KAAKQ,MAAQR,KAAKC,MACxFS,EAAA,OAAAE,IAAA,2CACEE,MAAM,sBACNC,MAAO,CACLC,MAAO,GAAGC,KAAKC,OAAQlB,KAAKQ,MAAQR,KAAKC,MAAQD,KAAKE,IAAMF,KAAKC,KAAQ,a","ignoreList":[]}

package/dist/mg-components/p-6f3d70b2.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,f as e,h as i,g as a}from"./p-15b6849a.js";import{X as h,Y as n}from"./p-ee51ec5e.js";import{i as o}from"./p-a49e2b74.js";const r=["info","warning","success","danger"];const c=["bar-left","background"];const l=".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 u=l;const m=class{constructor(e){t(this,e);this.componentShow=s(this,"component-show",7);this.componentHide=s(this,"component-hide",7);this.componentClose=s(this,"component-close",7);this.classCloseButton="mg-c-alert--close-button";this.storedTimer=null;this.isFocused=false;this.isHovered=false;this.setTimer=()=>{this.storedTimer=setTimeout((()=>this.element.hidden=true),this.delay*1e3)};this.clearTimer=()=>{clearTimeout(this.storedTimer)};this.timerEvents=t=>{this.clearTimer();const s=t.type==="mouseenter";this[s?"isHovered":"isFocused"]=true;this.element.addEventListener(s?"mouseleave":"focusout",(t=>{this[t.type==="mouseleave"?"isHovered":"isFocused"]=false;if(!this.isFocused&&!this.isHovered)this.setTimer()}),{once:true})};this.handleClose=()=>{this.element.hidden=true;this.componentClose.emit()};this.delay=undefined;this.variant=undefined;this.variantStyle=undefined;this.classCollection=new h(["mg-c-alert"]);this.hasActions=false}watchDelay(t){if(t!==undefined&&t<2){throw new Error(`<mg-alert> prop "delay" must be greater than 2 seconds. Passed value: ${n(t)}.`)}}watchVariant(t){if(t&&!r.includes(t)){throw new Error(`<mg-alert> prop "variant" must be one of: ${r.join(", ")}. Passed value: ${n(t)}.`)}}watchVariantStyle(t){if(t&&!c.includes(t)){throw new Error(`<mg-alert> prop "variantStyle" must be one of: ${c.join(", ")}. Passed value: ${n(t)}.`)}}watchHidden(t){if(typeof t==="string"&&t===""){t=true}if(t){this.componentHide.emit();["focusin","mouseenter"].forEach((t=>{this.element.removeEventListener(t,this.timerEvents)}));this.clearTimer()}else{this.componentShow.emit();if(this.delay>1){this.setTimer();["focusin","mouseenter"].forEach((t=>{this.element.addEventListener(t,this.timerEvents)}))}}e(this)}componentWillLoad(){this.messages=o(this.element).messages;this.watchVariant(this.variant);this.watchVariantStyle(this.variantStyle);this.watchDelay(this.delay);this.watchHidden(this.element.hidden);this.hasActions=this.element.querySelector('[slot="actions"]')!==null;if(!this.hasActions){this.classCollection.add(this.classCloseButton)}}render(){return i("mg-message",{key:"caf7e5313dd1fa9075bf38c2a9269592a6bd85fa",class:this.classCollection.join(),role:this.variant==="info"?"status":"alert",variant:this.variant,variantStyle:this.variantStyle},i("slot",{key:"21e5bd4aaad91c4b357ca032946c060ee13a47e4"}),this.hasActions?i("span",{slot:"actions"},i("slot",{name:"actions"})):i("span",{class:"mg-c-alert__close-button"},i("mg-button",{"is-icon":true,variant:"flat",label:this.messages.alert.closeButton,onClick:this.handleClose},i("mg-icon",{icon:"cross"}))))}get element(){return a(this)}static get watchers(){return{delay:["watchDelay"],variant:["watchVariant"],variantStyle:["watchVariantStyle"],hidden:["watchHidden"]}}};m.style=u;export{m as mg_alert};
-//# sourceMappingURL=p-6f3d70b2.entry.js.map

package/dist/mg-components/p-6f3d70b2.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["variants","variantStyles","mgAlertCss","MgAlertStyle0","MgAlert","this","classCloseButton","storedTimer","isFocused","isHovered","setTimer","setTimeout","element","hidden","delay","clearTimer","clearTimeout","timerEvents","event","isMouseEvent","type","addEventListener","eventOut","once","handleClose","componentClose","emit","ClassList","watchDelay","newValue","undefined","Error","toString","watchVariant","includes","join","watchVariantStyle","watchHidden","componentHide","forEach","removeEventListener","componentShow","forceUpdate","componentWillLoad","messages","initLocales","variant","variantStyle","hasActions","querySelector","classCollection","add","render","h","key","class","role","slot","name","label","alert","closeButton","onClick","icon"],"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 class={this.classCollection.join()} role={this.variant === 'info' ? 'status' : 'alert'} variant={this.variant} variantStyle={this.variantStyle}>\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"],"mappings":"+IAKO,MAAMA,EAAW,CAAC,OAAQ,UAAW,UAAW,UAUhD,MAAMC,EAAgB,CAAC,WAAY,cCf1C,MAAMC,EAAa,wJACnB,MAAAC,EAAeD,E,MCaFE,EAAO,M,qKAMDC,KAAAC,iBAAmB,2BAG5BD,KAAAE,YAA6C,KAG7CF,KAAAG,UAAY,MACZH,KAAAI,UAAY,MA4GZJ,KAAAK,SAAW,KACjBL,KAAKE,YAAcI,YAAW,IAAON,KAAKO,QAAQC,OAAS,MAAOR,KAAKS,MAAQ,IAAK,EAM9ET,KAAAU,WAAa,KACnBC,aAAaX,KAAKE,YAAY,EAOxBF,KAAAY,YAAeC,IACrBb,KAAKU,aACL,MAAMI,EAAwBD,EAAME,OAAS,aAE7Cf,KAAKc,EAAe,YAAc,aAAe,KAGjDd,KAAKO,QAAQS,iBACXF,EAAe,aAAe,YAC9BG,IACEjB,KAAKiB,EAASF,OAAS,aAAe,YAAc,aAAe,MAEnE,IAAKf,KAAKG,YAAcH,KAAKI,UAAWJ,KAAKK,UAAU,GAEzD,CAAEa,KAAM,MACT,EAMKlB,KAAAmB,YAAc,KACpBnB,KAAKO,QAAQC,OAAS,KACtBR,KAAKoB,eAAeC,MAAM,E,6FA/DU,IAAIC,EAAU,CAAC,e,gBAK/B,K,CApEtB,UAAAC,CAAWC,GACT,GAAIA,IAAaC,WAAaD,EAAW,EAAG,CAC1C,MAAM,IAAIE,MAAM,yEAAyEC,EAASH,M,EAStG,YAAAI,CAAaJ,GACX,GAAIA,IAAa7B,EAASkC,SAASL,GAAW,CAC5C,MAAM,IAAIE,MAAM,6CAA6C/B,EAASmC,KAAK,wBAAwBH,EAASH,M,EAShH,iBAAAO,CAAkBP,GAChB,GAAIA,IAAa5B,EAAciC,SAASL,GAAW,CACjD,MAAM,IAAIE,MAAM,kDAAkD9B,EAAckC,KAAK,wBAAwBH,EAASH,M,EAS1H,WAAAQ,CAAYR,GACV,UAAWA,IAAa,UAAYA,IAAa,GAAI,CACnDA,EAAW,I,CAEb,GAAIA,EAAU,CACZxB,KAAKiC,cAAcZ,OAEnB,CAAC,UAAW,cAAca,SAAQrB,IAChCb,KAAKO,QAAQ4B,oBAAoBtB,EAAOb,KAAKY,YAAY,IAG3DZ,KAAKU,Y,KACA,CACLV,KAAKoC,cAAcf,OAEnB,GAAIrB,KAAKS,MAAQ,EAAG,CAElBT,KAAKK,WAEL,CAAC,UAAW,cAAc6B,SAAQrB,IAChCb,KAAKO,QAAQS,iBAAiBH,EAAOb,KAAKY,YAAY,G,EAI5DyB,EAAYrC,K,CA+Ed,iBAAAsC,GAEEtC,KAAKuC,SAAWC,EAAYxC,KAAKO,SAASgC,SAE1CvC,KAAK4B,aAAa5B,KAAKyC,SACvBzC,KAAK+B,kBAAkB/B,KAAK0C,cAC5B1C,KAAKuB,WAAWvB,KAAKS,OACrBT,KAAKgC,YAAYhC,KAAKO,QAAQC,QAE9BR,KAAK2C,WAAa3C,KAAKO,QAAQqC,cAAc,sBAAwB,KACrE,IAAK5C,KAAK2C,WAAY,CACpB3C,KAAK6C,gBAAgBC,IAAI9C,KAAKC,iB,EAQlC,MAAA8C,GACE,OACEC,EAAA,cAAAC,IAAA,2CAAYC,MAAOlD,KAAK6C,gBAAgBf,OAAQqB,KAAMnD,KAAKyC,UAAY,OAAS,SAAW,QAASA,QAASzC,KAAKyC,QAASC,aAAc1C,KAAK0C,cAC5IM,EAAA,QAAAC,IAAA,6CACCjD,KAAK2C,WACJK,EAAA,QAAMI,KAAK,WACTJ,EAAA,QAAMK,KAAK,aAGbL,EAAA,QAAME,MAAM,4BACVF,EAAA,4BAAmBP,QAAQ,OAAOa,MAAOtD,KAAKuC,SAASgB,MAAMC,YAAaC,QAASzD,KAAKmB,aACtF6B,EAAA,WAASU,KAAK,Y","ignoreList":[]}