@mgdis/mg-components 6.13.1 → 6.14.0

package/dist/mg-components/mg-loader.entry.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mg-loader.entry.esm.js","sources":["../styles/dist/components/mg-loader.css?tag=mg-loader&encapsulation=shadow","src/components/molecules/mg-loader/mg-loader.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{display:block}.mg-c-loader{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--mg-b-size-4);text-align:center}/*# sourceMappingURL=mg-loader.css.map */\n","import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { isValidString, toString } from '@mgdis/core-ui-helpers/dist/utils';\n\n@Component({\n  tag: 'mg-loader',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-loader.css',\n  shadow: true,\n})\nexport class MgLoader {\n  /************\n   * Internal *\n   ************/\n\n  // Locales\n  private messages;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgLoaderElement;\n\n  /**\n   * Override loader message\n   */\n  @Prop() message?: string;\n  @Watch('message')\n  watchMessage(newValue: MgLoader['message']): void {\n    if (newValue && !isValidString(newValue)) throw new Error(`<mg-loader> prop \"message\" must be a valid string. Passed value: ${toString(newValue)}.`);\n  }\n\n  /**\n   * Hide message\n   */\n  @Prop() messageHide = false;\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\n    // validate props\n    this.watchMessage(this.message);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <div class=\"mg-c-loader\" aria-live=\"polite\">\n        <mg-icon icon=\"loader\" spin></mg-icon>\n        <span class={{ 'mg-u-visually-hidden': this.messageHide }}>{this.message || this.messages.loader.inProgress}</span>\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;AAAA,MAAM,WAAW,GAAG,skBAAskB;;MCS7kB,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AA+BE;;AAEG;AACK,QAAA,IAAW,CAAA,WAAA,GAAG,KAAK;AA6B5B;AApCC,IAAA,YAAY,CAAC,QAA6B,EAAA;AACxC,QAAA,IAAI,QAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,CAAoE,iEAAA,EAAA,QAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;AAQtJ;;AAEe;AAEf;;AAEG;IACH,iBAAiB,GAAA;;QAEf,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ;;AAGlD,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC;;AAGjC;;;AAGG;IACH,MAAM,GAAA;AACJ,QAAA,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,eAAW,QAAQ,EAAA,EACzC,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAW,IAAA,EAAA,CAAA,EACtC,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,CAAC,WAAW,EAAE,EAAA,EAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,UAAU,CAAQ,CAC/G;;;;;;;;;;;"}

package/dist/mg-components/mg-progress.entry.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mg-progress.entry.esm.js","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/core-ui-helpers/dist/utils';\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"],"names":[],"mappings":";;;AAEA;;AAEG;AACI,MAAM,KAAK,GAAG,CAAC,aAAa,EAAE,OAAO,CAAU;;ACLtD,MAAM,aAAa,GAAG,kpCAAkpC;;MCS3pC,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAqBE;;;;AAIG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAkB,aAAa;AAQ/C;;;;AAIG;AACK,QAAA,IAAK,CAAA,KAAA,GAAY,CAAC;AAO1B;;AAEG;AACK,QAAA,IAAG,CAAA,GAAA,GAAY,CAAC;AAOxB;;AAEG;AACK,QAAA,IAAG,CAAA,GAAA,GAAY,GAAG;AA2C3B;AAvFC,IAAA,UAAU,CAAC,QAA6B,EAAA;AACtC,QAAA,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;YAC5B,MAAM,IAAI,KAAK,CAAC,CAAoE,iEAAA,EAAA,QAAQ,CAAC,QAAQ,CAAC,CAAG,CAAA,CAAA,CAAC;;;AAW9G,IAAA,aAAa,CAAC,QAAgC,EAAA;QAC5C,IAAI,QAAQ,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;AACzC,YAAA,MAAM,IAAI,KAAK,CAAC,CAAiD,8CAAA,EAAA,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmB,QAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;;AAW9H,IAAA,UAAU,CAAC,QAA6B,EAAA;QACtC,IAAI,QAAQ,KAAK,SAAS,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,EAAE,QAAQ,IAAI,IAAI,CAAC,GAAG,IAAI,QAAQ,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;AACzG,YAAA,MAAM,IAAI,KAAK,CAAC,gEAAgE,IAAI,CAAC,GAAG,CAAO,IAAA,EAAA,IAAI,CAAC,GAAG,mBAAmB,QAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;AAQpJ,IAAA,QAAQ,CAAC,QAA2B,EAAA;QAClC,IAAI,QAAQ,KAAK,CAAC,IAAI,QAAQ,KAAK,SAAS,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,QAAQ,IAAI,IAAI,CAAC,GAAG,CAAC;AAChG,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,sDAAA,EAAyD,IAAI,CAAC,GAAG,CAAmB,gBAAA,EAAA,QAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;AAQ9H,IAAA,QAAQ,CAAC,QAA2B,EAAA;QAClC,IAAI,QAAQ,KAAK,GAAG,IAAI,QAAQ,KAAK,SAAS,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,QAAQ,IAAI,IAAI,CAAC,GAAG,CAAC;AAClG,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,wDAAA,EAA2D,IAAI,CAAC,GAAG,CAAmB,gBAAA,EAAA,QAAQ,CAAC,QAAQ,CAAC,CAAA,CAAA,CAAG,CAAC;;AAGhI;;AAEe;AAEf;;AAEG;IACH,iBAAiB,GAAA;;AAEf,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;AAC3B,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC;AACjC,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC;AACvB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC;AACvB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;;AAG7B;;;AAGG;IACH,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAA,YAAA,EAAc,IAAI,CAAC,KAAK,EAAiB,eAAA,EAAA,IAAI,CAAC,KAAK,EAAiB,eAAA,EAAA,IAAI,CAAC,GAAG,EAAA,eAAA,EAAiB,IAAI,CAAC,GAAG,EAAA,EAC5H,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACxB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,EAAE,oBAAoB,EAAE,IAAI,EAAE,4BAA4B,EAAE,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,EAAA,EAC7F,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,CAAG,CAAA,CAAA;AACjF,aAAA,EAAA,CACI,CACH,CACF,CACD;;;;;;;;;;;;;;"}