@mgdis/mg-components 5.21.1 → 5.23.0

package/dist/components/MgInput.js.map

@@ -1 +1 @@
-{"file":"MgInput.js","mappings":";;;AAAA;;;AAGO,MAAM,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,CAAU,CAAC;AAmBlD;;;IAGY;AAAZ,WAAY,OAAO;IACjB,wBAAa,CAAA;IACb,0BAAe,CAAA;AACjB,CAAC,EAHW,OAAO,KAAP,OAAO;;ACpBnB;;;;;;;AAOA,MAAM,oBAAoB,GAAG,CAAC,QAAiB,EAAE,kBAA+B,EAAE,KAA0B,KAC1G,KAAK,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK;IACvB,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAc,CAAC,EAAE;QAClE,uCACK,KAAK,KACR,MAAM,kCACD,KAAK,CAAC,MAAM,KACf,kBAAkB,EAAE,CAAC,GAAG,kBAAkB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,OAEvD;KACH;;IAGD,IAAI,KAAK,CAAC,SAAS,KAAK,IAAI;QAAE,yBAAY,KAAK,EAAG;IAClD,uCACK,KAAK,KACR,SAAS,EAAE,oBAAoB,CAAC,KAAK,CAAC,SAAS,EAAE,kBAAkB,EAAE,KAAK,CAAC,IAC3E;AACJ,CAAC,CAAC,CAAC;AAEL;;;;AAIA,MAAM,aAAa,GAAG,CAAC,KAAmB;IACxC,KAAK,CAAC,eAAe,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;IAExC,IAAI,KAAK,CAAC,UAAU;QAAE,KAAK,CAAC,eAAe,CAAC,GAAG,CAAC,0BAA0B,CAAC,CAAC;;QACvE,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC;IAE9D,IAAI,KAAK,CAAC,QAAQ;QAAE,KAAK,CAAC,eAAe,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAC;;QACjE,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC;IAE1D,MAAM,CAAC,OAAO,CAAC,KAAK;QAClB,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,qBAAqB,KAAK,EAAE,CAAC,CAAC;KAC5D,CAAC,CAAC;IACH,IAAI,KAAK,CAAC,OAAO,KAAK,SAAS;QAAE,KAAK,CAAC,eAAe,CAAC,GAAG,CAAC,qBAAqB,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;AACnG,CAAC,CAAC;AAEF;;;;;AAKA,MAAM,UAAU,GAAG,CAAC,UAAsC,EAAE,QAAkC,MAAc,CAAC,UAAU,IAAI,QAAQ,GAAG,KAAK,GAAG,UAAU,CAAC,CAAC;AA+B1J;;;;;;;MAOa,OAAO,GAAsC,CAAC,KAAmB,EAAE,QAAiB,EAAE,KAA0B;;;;IAI3H,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,UAAU,CAAC,EAAE;QACpC,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;KAC9D;IACD,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;QAC/B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;KACzD;IACD,IAAI,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,SAAS,EAAE;QACvC,MAAM,IAAI,KAAK,CAAC,4EAA4E,CAAC,CAAC;KAC/F;;;;IAKD,IAAI,KAAK,CAAC,aAAa,KAAK,SAAS;QAAE,KAAK,CAAC,aAAa,GAAG,KAAK,CAAC,KAAK,CAAC;;;;IAKzE,aAAa,CAAC,KAAK,CAAC,CAAC;;;;IAKrB,MAAM,kBAAkB,GAAgB,IAAI,GAAG,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC;;IAG1E,MAAM,UAAU,GAAG,GAAG,KAAK,CAAC,UAAU,YAAY,CAAC;IACnD,IAAI,OAAO,KAAK,CAAC,QAAQ,KAAK,QAAQ,IAAI,KAAK,CAAC,QAAQ,KAAK,EAAE,EAAE;QAC/D,kBAAkB,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;KACpC;;IAGD,MAAM,eAAe,GAAG,GAAG,KAAK,CAAC,UAAU,QAAQ,CAAC;IACpD,IAAI,OAAO,KAAK,CAAC,YAAY,KAAK,QAAQ,IAAI,KAAK,CAAC,YAAY,KAAK,EAAE,EAAE;QACvE,kBAAkB,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;KACzC;;;;;;;;;;;;;;;;IAkBD,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;;;;;IAM7D,MAAM,UAAU,GAAG,OACjB,kBAAY,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,UAAU,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO;QAC3E,eAAS,IAAI,EAAC,aAAa,GAAW,CAC3B,CACd,CAAC;;;;;;IAOF,MAAM,aAAa,GAAG,OACpB,sBACE,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,KAAK,EAAE,KAAK,CAAC,SAAS,GAAG,sBAAsB,GAAG,SAAS,EAC3D,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,QAAQ,eACnD,KAAK,CAAC,UAAU,IAE1B,KAAK,CAAC,KAAK,CACG,CAClB,CAAC;IAEF,QACE,EAAC,OAAO,IAAC,KAAK,EAAE,KAAK,CAAC,eAAe,CAAC,IAAI,EAAE;QACzC,KAAK,CAAC,UAAU,IACf,WAAK,KAAK,EAAC,mBAAmB;YAC3B,aAAa,EAAE;YACf,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,IAAI,UAAU,EAAE,CAC7C,KAEN,aAAa,EAAE,CAChB;QACA,KAAK,CAAC,QAAQ,IACb,WAAK,KAAK,EAAC,6BAA6B;YACtC,kBAAS,KAAK,CAAC,aAAa,CAAU;YACrC,QAAQ,CAAC,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC,CACpE,KAEN,WAAK,KAAK,EAAC,6BAA6B;YACtC,WAAK,KAAK,EAAE,EAAE,mBAAmB,EAAE,IAAI,EAAE,8BAA8B,EAAE,KAAK,CAAC,YAAY,KAAK,SAAS,EAAE;gBACxG,oBAAoB,CAAC,QAAQ,EAAE,kBAAkB,EAAE,KAAK,CAAC;gBACzD,CAAC,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,OAAO,IAAI,UAAU,EAAE,CAC/C;YACL,KAAK,CAAC,QAAQ,IAAI,WAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAC,uBAAuB,EAAC,SAAS,EAAE,KAAK,CAAC,QAAQ,GAAQ;YACtG,KAAK,CAAC,YAAY,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,QAAQ,KACvD,WAAK,EAAE,EAAE,eAAe,EAAE,KAAK,EAAC,mBAAmB,EAAC,SAAS,EAAE,KAAK,CAAC,YAAY,eAAY,WAAW,GAAO,CAChH,CACG,CACP,CACO,EACV;AACJ;;;;","names":[],"sources":["src/components/molecules/inputs/MgInput.conf.ts","src/components/molecules/inputs/MgInput.tsx"],"sourcesContent":["/**\n * Possible input width\n */\nexport const widths = [2, 4, 16, 'full'] as const;\n\nexport type Width = (typeof widths)[number];\n\n/**\n * Possible Input types\n */\n\nexport type HTMLMgInputsElement =\n  | HTMLMgInputCheckboxElement\n  | HTMLMgInputDateElement\n  | HTMLMgInputNumericElement\n  | HTMLMgInputPasswordElement\n  | HTMLMgInputRadioElement\n  | HTMLMgInputSelectElement\n  | HTMLMgInputTextElement\n  | HTMLMgInputTextareaElement\n  | (HTMLMgInputToggleElement & { required: true; invalid: false; displayError: () => void });\n\n/**\n * Available handlers\n */\nexport enum Handler {\n  BLUR = 'blur',\n  FOCUS = 'focus',\n}\n","import { FunctionalComponent, h, VNode, FunctionalUtilities } from '@stencil/core';\nimport { widths, Width } from './MgInput.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\nimport { MgInputTitle } from '../../atoms/mg-input-title/mg-input-title';\n\n/**\n * Apply in all input child node the aria-describedby attribute\n * @param children - Represent scoped elements\n * @param ariaDescribedbyIDs - List of IDs\n * @param utils - Stencil.js utils\n * @returns Children with aria-describedby attribute\n */\nconst applyAriadescribedBy = (children: VNode[], ariaDescribedbyIDs: Set<string>, utils: FunctionalUtilities): VNode[] =>\n  utils.map(children, child => {\n    if (['input', 'select', 'textarea'].includes(child.vtag as string)) {\n      return {\n        ...child,\n        vattrs: {\n          ...child.vattrs,\n          'aria-describedby': [...ariaDescribedbyIDs].join(' '),\n        },\n      };\n    }\n\n    // we recursively apply ariadescribedBy attributes to child input nodes if exists\n    if (child.vchildren === null) return { ...child };\n    return {\n      ...child,\n      vchildren: applyAriadescribedBy(child.vchildren, ariaDescribedbyIDs, utils),\n    };\n  });\n\n/**\n * Add classes based on props\n * @param props - MgInput Interface Props\n */\nconst manageClasses = (props: MgInputProps): void => {\n  props.classCollection.add('mg-c-input');\n\n  if (props.labelOnTop) props.classCollection.add('mg-c-input--label-on-top');\n  else props.classCollection.delete('mg-c-input--label-on-top');\n\n  if (props.readonly) props.classCollection.add('mg-c-input--readonly');\n  else props.classCollection.delete('mg-c-input--readonly');\n\n  widths.forEach(width => {\n    props.classCollection.delete(`mg-c-input--width-${width}`);\n  });\n  if (props.mgWidth !== undefined) props.classCollection.add(`mg-c-input--width-${props.mgWidth}`);\n};\n\n/**\n * Get tagname\n * @param isFieldset - is fieldset\n * @returns tag name\n */\nconst getTagName = (isFieldset: MgInputProps['isFieldset'], readOnly: MgInputProps['readonly']): string => (!isFieldset || readOnly ? 'div' : 'fieldset');\n\n/**\n * MgInput Interface\n */\ninterface MgInputProps {\n  // Global\n  identifier: string;\n  classCollection: ClassList;\n  // Label\n  label: string;\n  labelOnTop: boolean;\n  labelHide: boolean;\n  isFieldset: MgInputTitle['isLegend'];\n  // Input\n  value: string;\n  readonlyValue: string;\n  required: boolean;\n  readonly: boolean;\n  mgWidth: Width;\n  disabled: boolean;\n  // Tooltip\n  tooltip: string;\n  // Help Text\n  helpText: string;\n  // Error Message\n  errorMessage: string;\n  // ariaDescribedbyIDs\n  ariaDescribedbyIDs: string[];\n}\n\n/**\n * Get input template\n * @param props - MgInput Interface Props\n * @param children - Represent scoped elements\n * @param utils - Stencil.js utils\n * @returns input template\n */\nexport const MgInput: FunctionalComponent<MgInputProps> = (props: MgInputProps, children: VNode[], utils: FunctionalUtilities): VNode[] => {\n  /**\n   * Check required properties\n   */\n  if (!isValidString(props.identifier)) {\n    throw new Error('<mg-input> prop \"identifier\" is required.');\n  }\n  if (!isValidString(props.label)) {\n    throw new Error('<mg-input> prop \"label\" is required.');\n  }\n  if (props.labelOnTop && props.labelHide) {\n    throw new Error('<mg-input> prop \"labelOnTop\" must not be paired with the prop \"labelHide\".');\n  }\n\n  /**\n   * Set readonly value\n   */\n  if (props.readonlyValue === undefined) props.readonlyValue = props.value;\n\n  /**\n   * Component classes\n   */\n  manageClasses(props);\n\n  /**\n   * a11y IDs\n   */\n  const ariaDescribedbyIDs: Set<string> = new Set(props.ariaDescribedbyIDs);\n\n  // Help text\n  const helpTextId = `${props.identifier}-help-text`;\n  if (typeof props.helpText === 'string' && props.helpText !== '') {\n    ariaDescribedbyIDs.add(helpTextId);\n  }\n\n  // Error Message\n  const helpTextErrorId = `${props.identifier}-error`;\n  if (typeof props.errorMessage === 'string' && props.errorMessage !== '') {\n    ariaDescribedbyIDs.add(helpTextErrorId);\n  }\n\n  /**\n   * Return template\n   *\n   * +--------+--------------+---------+\n   * |  label | input        | tooltip |\n   * |        +--------------+---------+\n   * |        | nb Char Left           |\n   * |        +------------------------+\n   * |        | Help Text              |\n   * |        +------------------------+\n   * |        | Error                  |\n   * +--------+------------------------+\n   *\n   * Error message is based on this aria method: https://www.w3.org/WAI/tutorials/forms/notifications/#on-focus-change\n   */\n\n  const TagName = getTagName(props.isFieldset, props.readonly);\n\n  /**\n   * Get tooltip node\n   * @returns mg-tooltip\n   */\n  const getTooltip = (): VNode[] => (\n    <mg-tooltip identifier={`${props.identifier}-tooltip`} message={props.tooltip}>\n      <mg-icon icon=\"info-circle\"></mg-icon>\n    </mg-tooltip>\n  );\n\n  /**\n   * Get input title (label) node\n   * Display asterisk only if not disabled and not readonly\n   * @returns mg-input-title\n   */\n  const getInputTitle = (): VNode[] => (\n    <mg-input-title\n      identifier={props.identifier}\n      readonly={props.readonly}\n      class={props.labelHide ? 'mg-u-visually-hidden' : undefined}\n      required={props.required && !props.disabled && !props.readonly}\n      is-legend={props.isFieldset}\n    >\n      {props.label}\n    </mg-input-title>\n  );\n\n  return (\n    <TagName class={props.classCollection.join()}>\n      {props.labelOnTop ? (\n        <div class=\"mg-c-input__title\">\n          {getInputTitle()}\n          {!props.readonly && props.tooltip && getTooltip()}\n        </div>\n      ) : (\n        getInputTitle()\n      )}\n      {props.readonly ? (\n        <div class=\"mg-c-input__input-container\">\n          <strong>{props.readonlyValue}</strong>\n          {children.filter(child => Object.values(child).includes('append-input'))}\n        </div>\n      ) : (\n        <div class=\"mg-c-input__input-container\">\n          <div class={{ 'mg-c-input__input': true, 'mg-c-input__input--has-error': props.errorMessage !== undefined }}>\n            {applyAriadescribedBy(children, ariaDescribedbyIDs, utils)}\n            {!props.labelOnTop && props.tooltip && getTooltip()}\n          </div>\n          {props.helpText && <div id={helpTextId} class=\"mg-c-input__help-text\" innerHTML={props.helpText}></div>}\n          {props.errorMessage && !props.readonly && !props.disabled && (\n            <div id={helpTextErrorId} class=\"mg-c-input__error\" innerHTML={props.errorMessage} aria-live=\"assertive\"></div>\n          )}\n        </div>\n      )}\n    </TagName>\n  );\n};\n"],"version":3}
+{"file":"MgInput.js","mappings":"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","names":["isValidString"],"sources":["src/components/molecules/inputs/MgInput.conf.ts","src/components/molecules/inputs/MgInput.tsx"],"sourcesContent":["/**\n * Possible input width\n */\nexport const widths = [2, 4, 16, 'full'] as const;\n\nexport type Width = (typeof widths)[number];\n\n/**\n * Possible Input types\n */\n\nexport type HTMLMgInputsElement =\n  | HTMLMgInputCheckboxElement\n  | HTMLMgInputDateElement\n  | HTMLMgInputNumericElement\n  | HTMLMgInputPasswordElement\n  | HTMLMgInputRadioElement\n  | HTMLMgInputSelectElement\n  | HTMLMgInputTextElement\n  | HTMLMgInputTextareaElement\n  | (HTMLMgInputToggleElement & { required: true; invalid: false; displayError: () => void });\n\n/**\n * Available handlers\n */\nexport enum Handler {\n  BLUR = 'blur',\n  FOCUS = 'focus',\n}\n","import { FunctionalComponent, h, VNode, FunctionalUtilities } from '@stencil/core';\nimport { widths, Width } from './MgInput.conf';\nimport { ClassList, isValidString } from '@mgdis/stencil-helpers';\nimport { MgInputTitle } from '../../atoms/mg-input-title/mg-input-title';\n\n/**\n * Apply in all input child node the aria-describedby attribute\n * @param children - Represent scoped elements\n * @param ariaDescribedbyIDs - List of IDs\n * @param utils - Stencil.js utils\n * @returns Children with aria-describedby attribute\n */\nconst applyAriadescribedBy = (children: VNode[], ariaDescribedbyIDs: Set<string>, utils: FunctionalUtilities): VNode[] =>\n  utils.map(children, child => {\n    if (['input', 'select', 'textarea'].includes(child.vtag as string)) {\n      return {\n        ...child,\n        vattrs: {\n          ...child.vattrs,\n          'aria-describedby': [...ariaDescribedbyIDs].join(' '),\n        },\n      };\n    }\n\n    // we recursively apply ariadescribedBy attributes to child input nodes if exists\n    if (child.vchildren === null) return { ...child };\n    return {\n      ...child,\n      vchildren: applyAriadescribedBy(child.vchildren, ariaDescribedbyIDs, utils),\n    };\n  });\n\n/**\n * Add classes based on props\n * @param props - MgInput Interface Props\n */\nconst manageClasses = (props: MgInputProps): void => {\n  props.classCollection.add('mg-c-input');\n\n  if (props.labelOnTop) props.classCollection.add('mg-c-input--label-on-top');\n  else props.classCollection.delete('mg-c-input--label-on-top');\n\n  if (props.readonly) props.classCollection.add('mg-c-input--readonly');\n  else props.classCollection.delete('mg-c-input--readonly');\n\n  widths.forEach(width => {\n    props.classCollection.delete(`mg-c-input--width-${width}`);\n  });\n  if (props.mgWidth !== undefined) props.classCollection.add(`mg-c-input--width-${props.mgWidth}`);\n};\n\n/**\n * Get tagname\n * @param isFieldset - is fieldset\n * @returns tag name\n */\nconst getTagName = (isFieldset: MgInputProps['isFieldset'], readOnly: MgInputProps['readonly']): string => (!isFieldset || readOnly ? 'div' : 'fieldset');\n\n/**\n * MgInput Interface\n */\ninterface MgInputProps {\n  // Global\n  identifier: string;\n  classCollection: ClassList;\n  // Label\n  label: string;\n  labelOnTop: boolean;\n  labelHide: boolean;\n  isFieldset: MgInputTitle['isLegend'];\n  // Input\n  value: string;\n  readonlyValue: string;\n  required: boolean;\n  readonly: boolean;\n  mgWidth: Width;\n  disabled: boolean;\n  // Tooltip\n  tooltip: string;\n  // Help Text\n  helpText: string;\n  // Error Message\n  errorMessage: string;\n  // ariaDescribedbyIDs\n  ariaDescribedbyIDs: string[];\n}\n\n/**\n * Get input template\n * @param props - MgInput Interface Props\n * @param children - Represent scoped elements\n * @param utils - Stencil.js utils\n * @returns input template\n */\nexport const MgInput: FunctionalComponent<MgInputProps> = (props: MgInputProps, children: VNode[], utils: FunctionalUtilities): VNode[] => {\n  /**\n   * Check required properties\n   */\n  if (!isValidString(props.identifier)) {\n    throw new Error('<mg-input> prop \"identifier\" is required.');\n  }\n  if (!isValidString(props.label)) {\n    throw new Error('<mg-input> prop \"label\" is required.');\n  }\n  if (props.labelOnTop && props.labelHide) {\n    throw new Error('<mg-input> prop \"labelOnTop\" must not be paired with the prop \"labelHide\".');\n  }\n\n  /**\n   * Set readonly value\n   */\n  if (props.readonlyValue === undefined) props.readonlyValue = props.value;\n\n  /**\n   * Component classes\n   */\n  manageClasses(props);\n\n  /**\n   * a11y IDs\n   */\n  const ariaDescribedbyIDs: Set<string> = new Set(props.ariaDescribedbyIDs);\n\n  // Help text\n  const helpTextId = `${props.identifier}-help-text`;\n  if (typeof props.helpText === 'string' && props.helpText !== '') {\n    ariaDescribedbyIDs.add(helpTextId);\n  }\n\n  // Error Message\n  const helpTextErrorId = `${props.identifier}-error`;\n  if (typeof props.errorMessage === 'string' && props.errorMessage !== '') {\n    ariaDescribedbyIDs.add(helpTextErrorId);\n  }\n\n  /**\n   * Return template\n   *\n   * +--------+--------------+---------+\n   * |  label | input        | tooltip |\n   * |        +--------------+---------+\n   * |        | nb Char Left           |\n   * |        +------------------------+\n   * |        | Help Text              |\n   * |        +------------------------+\n   * |        | Error                  |\n   * +--------+------------------------+\n   *\n   * Error message is based on this aria method: https://www.w3.org/WAI/tutorials/forms/notifications/#on-focus-change\n   */\n\n  const TagName = getTagName(props.isFieldset, props.readonly);\n\n  /**\n   * Get tooltip node\n   * @returns mg-tooltip\n   */\n  const getTooltip = (): VNode[] => (\n    <mg-tooltip identifier={`${props.identifier}-tooltip`} message={props.tooltip}>\n      <mg-icon icon=\"info-circle\"></mg-icon>\n    </mg-tooltip>\n  );\n\n  /**\n   * Get input title (label) node\n   * Display asterisk only if not disabled and not readonly\n   * @returns mg-input-title\n   */\n  const getInputTitle = (): VNode[] => (\n    <mg-input-title\n      identifier={props.identifier}\n      readonly={props.readonly}\n      class={props.labelHide ? 'mg-u-visually-hidden' : undefined}\n      required={props.required && !props.disabled && !props.readonly}\n      is-legend={props.isFieldset}\n    >\n      {props.label}\n    </mg-input-title>\n  );\n\n  return (\n    <TagName class={props.classCollection.join()}>\n      {props.labelOnTop ? (\n        <div class=\"mg-c-input__title\">\n          {getInputTitle()}\n          {!props.readonly && props.tooltip && getTooltip()}\n        </div>\n      ) : (\n        getInputTitle()\n      )}\n      {props.readonly ? (\n        <div class=\"mg-c-input__input-container\">\n          <strong>{props.readonlyValue}</strong>\n          {children.filter(child => Object.values(child).includes('append-input'))}\n        </div>\n      ) : (\n        <div class=\"mg-c-input__input-container\">\n          <div class={{ 'mg-c-input__input': true, 'mg-c-input__input--has-error': props.errorMessage !== undefined }}>\n            {applyAriadescribedBy(children, ariaDescribedbyIDs, utils)}\n            {!props.labelOnTop && props.tooltip && getTooltip()}\n          </div>\n          {props.helpText && <div id={helpTextId} class=\"mg-c-input__help-text\" innerHTML={props.helpText}></div>}\n          {props.errorMessage && !props.readonly && !props.disabled && (\n            <div id={helpTextErrorId} class=\"mg-c-input__error\" innerHTML={props.errorMessage} aria-live=\"assertive\"></div>\n          )}\n        </div>\n      )}\n    </TagName>\n  );\n};\n"],"version":3}

package/dist/components/index.es.js

@@ -0,0 +1,75 @@
+var le = Object.defineProperty;
+var oe = (t, e, n) => e in t ? le(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var g = (t, e, n) => (oe(t, typeof e != "symbol" ? e + "" : e, n), n);
+const Ee = (t) => {
+  const e = { value: "2023", pattern: "yyyy" }, n = { value: "12", pattern: "mm" }, s = { value: "24", pattern: "dd" };
+  return be([e.value, n.value, s.value].join("-"), t).replace(e.value, e.pattern).replace(n.value, n.pattern).replace(s.value, s.pattern);
+}, Ae = (t) => t.toISOString().split("T")[0], ve = (t, e, n) => {
+  const s = t.closest("[lang]"), l = Intl.NumberFormat.supportedLocalesOf(s == null ? void 0 : s.lang), r = l.length > 0 && typeof l[0] == "string" ? l[0] : navigator.language || n, o = r.split("-").shift();
+  return {
+    locale: r,
+    messages: e[o] || e[n]
+  };
+}, Re = (t, e, n) => new Intl.NumberFormat(e, { style: "currency", currency: n }).format(t), Me = (t, e) => new Intl.NumberFormat(e).format(t), Se = /^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/, be = (t, e) => typeof t != "string" || t === "" || !Se.test(t) ? "" : new Intl.DateTimeFormat(e).format(new Date(t)), Oe = (t, e) => (n) => ve(n, t, e), je = (t = "", e = 10) => {
+  const n = new Uint8Array(e);
+  crypto.getRandomValues(n);
+  const s = Array.from(n).map((l) => l.toString(16).padStart(2, "0")).join("").slice(0, e);
+  return t !== "" ? `${t}-${s}` : s;
+};
+class Fe {
+  constructor(e = []) {
+    /**
+     * Available classes
+     */
+    g(this, "classes");
+    /**
+     * Add class
+     * @param className - class name to add
+     */
+    g(this, "add", (e) => {
+      this.has(e) || this.classes.push(e);
+    });
+    /**
+     * Delete class
+     * @param className - class name to delete
+     */
+    g(this, "delete", (e) => {
+      const n = this.classes.indexOf(e);
+      n > -1 && this.classes.splice(n, 1);
+    });
+    /**
+     * Check if class exist in list
+     * @param className - class name to check
+     * @returns class name is in the list
+     */
+    g(this, "has", (e) => this.classes.includes(e));
+    /**
+     * Join classes seperated by spaces
+     * @returns joined values
+     */
+    g(this, "join", () => this.classes.join(" "));
+    this.classes = e;
+  }
+}
+const De = (t) => Array.isArray(t) && t.every((e) => typeof e == "string"), _e = (t, e) => e.includes(t == null ? void 0 : t.tagName.toLowerCase()), Be = 'a[href], button, input, textarea, select, details, [tabindex]:not([tabindex="-1"]), [identifier], mg-button', Ne = (t) => {
+  const e = se(t), n = ne(t);
+  return [t, ...e, ...n];
+}, se = (t, e = []) => {
+  if (t.self !== t.top)
+    try {
+      const n = t.parent;
+      return n ? (e.push(n), se(n, e)) : e;
+    } catch (n) {
+      return console.error("Different hosts between iframes:", n), e;
+    }
+  return e;
+}, ne = (t, e = []) => {
+  if (t.frames.length > 0)
+    for (const n of Array.from(t.frames))
+      e.push(n), ne(n, e);
+  return e;
+}, He = (t) => typeof t == "string" && t.trim() !== "", Ce = (t) => typeof t == "string" ? t.toLocaleLowerCase().normalize("NFD").replaceAll(/[\u0300-\u036f]/g, "") : t, Pe = async (t) => t();
+
+export { Ae as A, Be as B, Ce as C, De as D, Ee as E, Fe as F, He as H, Me as M, Ne as N, Oe as O, Pe as P, Re as R, Se as S, _e as _, be as b, je as j };
+
+//# sourceMappingURL=index.es.js.map

package/dist/components/index.es.js.map

@@ -0,0 +1 @@
+{"file":"index.es.js","mappings":"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","names":[],"sources":["../stencil-helpers/dist/index.es.js"],"sourcesContent":["var le = Object.defineProperty;\nvar oe = (t, e, n) => e in t ? le(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;\nvar g = (t, e, n) => (oe(t, typeof e != \"symbol\" ? e + \"\" : e, n), n);\nconst I = {\n  allRenderFn: !1,\n  cmpDidLoad: !0,\n  cmpDidUnload: !1,\n  cmpDidUpdate: !0,\n  cmpDidRender: !0,\n  cmpWillLoad: !0,\n  cmpWillUpdate: !0,\n  cmpWillRender: !0,\n  connectedCallback: !0,\n  disconnectedCallback: !0,\n  element: !0,\n  event: !0,\n  hasRenderFn: !0,\n  lifecycle: !0,\n  hostListener: !0,\n  hostListenerTargetWindow: !0,\n  hostListenerTargetDocument: !0,\n  hostListenerTargetBody: !0,\n  hostListenerTargetParent: !1,\n  hostListenerTarget: !0,\n  member: !0,\n  method: !0,\n  mode: !0,\n  observeAttribute: !0,\n  prop: !0,\n  propMutable: !0,\n  reflect: !0,\n  scoped: !0,\n  shadowDom: !0,\n  slot: !0,\n  cssAnnotations: !0,\n  state: !0,\n  style: !0,\n  formAssociated: !1,\n  svg: !0,\n  updatable: !0,\n  vdomAttribute: !0,\n  vdomXlink: !0,\n  vdomClass: !0,\n  vdomFunctional: !0,\n  vdomKey: !0,\n  vdomListener: !0,\n  vdomRef: !0,\n  vdomPropOrAttr: !0,\n  vdomRender: !0,\n  vdomStyle: !0,\n  vdomText: !0,\n  watchCallback: !0,\n  taskQueue: !0,\n  hotModuleReplacement: !1,\n  isDebug: !1,\n  isDev: !1,\n  isTesting: !1,\n  hydrateServerSide: !1,\n  hydrateClientSide: !1,\n  lifecycleDOMEvents: !1,\n  lazyLoad: !1,\n  profile: !1,\n  slotRelocation: !0,\n  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior\n  appendChildSlotFix: !1,\n  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior\n  cloneNodeFix: !1,\n  hydratedAttribute: !1,\n  hydratedClass: !0,\n  scriptDataOpts: !1,\n  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior\n  scopedSlotTextContentFix: !1,\n  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field\n  shadowDomShim: !1,\n  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior\n  slotChildNodesFix: !1,\n  invisiblePrehydration: !0,\n  propBoolean: !0,\n  propNumber: !0,\n  propString: !0,\n  constructableCSS: !0,\n  cmpShouldUpdate: !0,\n  devTools: !1,\n  shadowDelegatesFocus: !0,\n  initializeNextTick: !1,\n  asyncLoading: !1,\n  asyncQueue: !1,\n  transformTagName: !1,\n  attachStyles: !0,\n  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior\n  experimentalSlotFixes: !1\n};\nlet T, F, m, X = !1, M = !1, D = !1, h = !1;\nconst N = \"http://www.w3.org/1999/xlink\", H = {}, re = \"http://www.w3.org/2000/svg\", ie = \"http://www.w3.org/1999/xhtml\", ce = (t) => t != null, q = (t) => (t = typeof t, t === \"object\" || t === \"function\"), G = (t, e, ...n) => {\n  let s = null, l = null, r = null, o = !1, c = !1;\n  const i = [], d = (f) => {\n    for (let $ = 0; $ < f.length; $++)\n      s = f[$], Array.isArray(s) ? d(s) : s != null && typeof s != \"boolean\" && ((o = typeof t != \"function\" && !q(s)) && (s = String(s)), o && c ? i[i.length - 1].$text$ += s : i.push(o ? O(null, s) : s), c = o);\n  };\n  if (d(n), e) {\n    e.key && (l = e.key), e.name && (r = e.name);\n    {\n      const f = e.className || e.class;\n      f && (e.class = typeof f != \"object\" ? f : Object.keys(f).filter(($) => f[$]).join(\" \"));\n    }\n  }\n  if (typeof t == \"function\")\n    return t(e === null ? {} : e, i, $e);\n  const u = O(t, null);\n  return u.$attrs$ = e, i.length > 0 && (u.$children$ = i), u.$key$ = l, u.$name$ = r, u;\n}, O = (t, e) => {\n  const n = {\n    $flags$: 0,\n    $tag$: t,\n    $text$: e,\n    $elm$: null,\n    $children$: null\n  };\n  return n.$attrs$ = null, n.$key$ = null, n.$name$ = null, n;\n}, fe = {}, ae = (t) => t && t.$tag$ === fe, $e = {\n  forEach: (t, e) => t.map(C).forEach(e),\n  map: (t, e) => t.map(C).map(e).map(ue)\n}, C = (t) => ({\n  vattrs: t.$attrs$,\n  vchildren: t.$children$,\n  vkey: t.$key$,\n  vname: t.$name$,\n  vtag: t.$tag$,\n  vtext: t.$text$\n}), ue = (t) => {\n  if (typeof t.vtag == \"function\") {\n    const n = Object.assign({}, t.vattrs);\n    return t.vkey && (n.key = t.vkey), t.vname && (n.name = t.vname), G(t.vtag, n, ...t.vchildren || []);\n  }\n  const e = O(t.vtag, t.vtext);\n  return e.$attrs$ = t.vattrs, e.$children$ = t.vchildren, e.$key$ = t.vkey, e.$name$ = t.vname, e;\n}, P = (t, e, n, s, l, r) => {\n  if (n !== s) {\n    let o = z(t, e), c = e.toLowerCase();\n    if (e === \"class\") {\n      const i = t.classList, d = U(n), u = U(s);\n      i.remove(...d.filter((f) => f && !u.includes(f))), i.add(...u.filter((f) => f && !d.includes(f)));\n    } else if (e === \"style\") {\n      for (const i in n)\n        (!s || s[i] == null) && (i.includes(\"-\") ? t.style.removeProperty(i) : t.style[i] = \"\");\n      for (const i in s)\n        (!n || s[i] !== n[i]) && (i.includes(\"-\") ? t.style.setProperty(i, s[i]) : t.style[i] = s[i]);\n    } else if (e !== \"key\")\n      if (e === \"ref\")\n        s && s(t);\n      else if (!t.__lookupSetter__(e) && e[0] === \"o\" && e[1] === \"n\") {\n        if (e[2] === \"-\" ? e = e.slice(3) : z(B, c) ? e = c.slice(2) : e = c[2] + e.slice(3), n || s) {\n          const i = e.endsWith(K);\n          e = e.replace(pe, \"\"), n && x.rel(t, e, n, i), s && x.ael(t, e, s, i);\n        }\n      } else {\n        const i = q(s);\n        if ((o || i && s !== null) && !l)\n          try {\n            if (t.tagName.includes(\"-\"))\n              t[e] = s;\n            else {\n              const u = s ?? \"\";\n              e === \"list\" ? o = !1 : (n == null || t[e] != u) && (t[e] = u);\n            }\n          } catch {\n          }\n        let d = !1;\n        c !== (c = c.replace(/^xlink\\:?/, \"\")) && (e = c, d = !0), s == null || s === !1 ? (s !== !1 || t.getAttribute(e) === \"\") && (d ? t.removeAttributeNS(N, e) : t.removeAttribute(e)) : (!o || r & 4 || l) && !i && (s = s === !0 ? \"\" : s, d ? t.setAttributeNS(N, e, s) : t.setAttribute(e, s));\n      }\n  }\n}, de = /\\s/, U = (t) => t ? t.split(de) : [], K = \"Capture\", pe = new RegExp(K + \"$\"), Q = (t, e, n, s) => {\n  const l = e.$elm$.nodeType === 11 && e.$elm$.host ? e.$elm$.host : e.$elm$, r = t && t.$attrs$ || H, o = e.$attrs$ || H;\n  for (s in r)\n    s in o || P(l, s, r[s], void 0, n, e.$flags$);\n  for (s in o)\n    P(l, s, r[s], o[s], n, e.$flags$);\n}, j = (t, e, n, s) => {\n  const l = e.$children$[n];\n  let r = 0, o, c, i;\n  if (X || (D = !0, l.$tag$ === \"slot\" && (T && s.classList.add(T + \"-s\"), l.$flags$ |= l.$children$ ? (\n    // slot element has fallback content\n    2\n  ) : (\n    // slot element does not have fallback content\n    1\n  ))), l.$text$ !== null)\n    o = l.$elm$ = R.createTextNode(l.$text$);\n  else if (l.$flags$ & 1)\n    o = l.$elm$ = R.createTextNode(\"\");\n  else {\n    if (h || (h = l.$tag$ === \"svg\"), o = l.$elm$ = R.createElementNS(h ? re : ie, l.$flags$ & 2 ? \"slot-fb\" : l.$tag$), h && l.$tag$ === \"foreignObject\" && (h = !1), Q(null, l, h), ce(T) && o[\"s-si\"] !== T && o.classList.add(o[\"s-si\"] = T), l.$children$)\n      for (r = 0; r < l.$children$.length; ++r)\n        c = j(t, l, r, o), c && o.appendChild(c);\n    l.$tag$ === \"svg\" ? h = !1 : o.tagName === \"foreignObject\" && (h = !0);\n  }\n  return o[\"s-hn\"] = m, l.$flags$ & 3 && (o[\"s-sr\"] = !0, o[\"s-cr\"] = F, o[\"s-sn\"] = l.$name$ || \"\", i = t && t.$children$ && t.$children$[n], i && i.$tag$ === l.$tag$ && t.$elm$ && L(t.$elm$, !1)), o;\n}, L = (t, e) => {\n  x.$flags$ |= 1;\n  const n = t.childNodes;\n  for (let s = n.length - 1; s >= 0; s--) {\n    const l = n[s];\n    l[\"s-hn\"] !== m && l[\"s-ol\"] && (Z(l).insertBefore(l, _(l)), l[\"s-ol\"].remove(), l[\"s-ol\"] = void 0, l[\"s-sh\"] = void 0, D = !0), e && L(l, e);\n  }\n  x.$flags$ &= -2;\n}, J = (t, e, n, s, l, r) => {\n  let o = t[\"s-cr\"] && t[\"s-cr\"].parentNode || t, c;\n  for (o.shadowRoot && o.tagName === m && (o = o.shadowRoot); l <= r; ++l)\n    s[l] && (c = j(null, n, l, t), c && (s[l].$elm$ = c, o.insertBefore(c, _(e))));\n}, Y = (t, e, n) => {\n  for (let s = e; s <= n; ++s) {\n    const l = t[s];\n    if (l) {\n      const r = l.$elm$;\n      ee(l), r && (M = !0, r[\"s-ol\"] ? r[\"s-ol\"].remove() : L(r, !0), r.remove());\n    }\n  }\n}, ge = (t, e, n, s, l = !1) => {\n  let r = 0, o = 0, c = 0, i = 0, d = e.length - 1, u = e[0], f = e[d], $ = s.length - 1, a = s[0], p = s[$], v, y;\n  for (; r <= d && o <= $; )\n    if (u == null)\n      u = e[++r];\n    else if (f == null)\n      f = e[--d];\n    else if (a == null)\n      a = s[++o];\n    else if (p == null)\n      p = s[--$];\n    else if (A(u, a, l))\n      k(u, a, l), u = e[++r], a = s[++o];\n    else if (A(f, p, l))\n      k(f, p, l), f = e[--d], p = s[--$];\n    else if (A(u, p, l))\n      (u.$tag$ === \"slot\" || p.$tag$ === \"slot\") && L(u.$elm$.parentNode, !1), k(u, p, l), t.insertBefore(u.$elm$, f.$elm$.nextSibling), u = e[++r], p = s[--$];\n    else if (A(f, a, l))\n      (u.$tag$ === \"slot\" || p.$tag$ === \"slot\") && L(f.$elm$.parentNode, !1), k(f, a, l), t.insertBefore(f.$elm$, u.$elm$), f = e[--d], a = s[++o];\n    else {\n      for (c = -1, i = r; i <= d; ++i)\n        if (e[i] && e[i].$key$ !== null && e[i].$key$ === a.$key$) {\n          c = i;\n          break;\n        }\n      c >= 0 ? (y = e[c], y.$tag$ !== a.$tag$ ? v = j(e && e[o], n, c, t) : (k(y, a, l), e[c] = void 0, v = y.$elm$), a = s[++o]) : (v = j(e && e[o], n, o, t), a = s[++o]), v && Z(u.$elm$).insertBefore(v, _(u.$elm$));\n    }\n  r > d ? J(t, s[$ + 1] == null ? null : s[$ + 1].$elm$, n, s, o, $) : o > $ && Y(e, r, d);\n}, A = (t, e, n = !1) => t.$tag$ === e.$tag$ ? t.$tag$ === \"slot\" ? t.$name$ === e.$name$ : n ? !0 : t.$key$ === e.$key$ : !1, _ = (t) => t && t[\"s-ol\"] || t, Z = (t) => (t[\"s-ol\"] ? t[\"s-ol\"] : t).parentNode, k = (t, e, n = !1) => {\n  const s = e.$elm$ = t.$elm$, l = t.$children$, r = e.$children$, o = e.$tag$, c = e.$text$;\n  let i;\n  c === null ? (h = o === \"svg\" ? !0 : o === \"foreignObject\" ? !1 : h, o === \"slot\" || Q(t, e, h), l !== null && r !== null ? ge(s, l, e, r, n) : r !== null ? (t.$text$ !== null && (s.textContent = \"\"), J(s, null, e, r, 0, r.length - 1)) : l !== null && Y(l, 0, l.length - 1), h && o === \"svg\" && (h = !1)) : (i = s[\"s-cr\"]) ? i.parentNode.textContent = c : t.$text$ !== c && (s.data = c);\n}, w = (t) => {\n  const e = t.childNodes;\n  for (const n of e)\n    if (n.nodeType === 1) {\n      if (n[\"s-sr\"]) {\n        const s = n[\"s-sn\"];\n        n.hidden = !1;\n        for (const l of e)\n          if (l !== n) {\n            if (l[\"s-hn\"] !== n[\"s-hn\"] || s !== \"\") {\n              if (l.nodeType === 1 && (s === l.getAttribute(\"slot\") || s === l[\"s-sn\"])) {\n                n.hidden = !0;\n                break;\n              }\n            } else if (l.nodeType === 1 || l.nodeType === 3 && l.textContent.trim() !== \"\") {\n              n.hidden = !0;\n              break;\n            }\n          }\n      }\n      w(n);\n    }\n}, S = [], V = (t) => {\n  let e, n, s;\n  for (const l of t.childNodes) {\n    if (l[\"s-sr\"] && (e = l[\"s-cr\"]) && e.parentNode) {\n      n = e.parentNode.childNodes;\n      const r = l[\"s-sn\"];\n      for (s = n.length - 1; s >= 0; s--)\n        if (e = n[s], !e[\"s-cn\"] && !e[\"s-nr\"] && e[\"s-hn\"] !== l[\"s-hn\"] && !I.experimentalSlotFixes)\n          if (W(e, r)) {\n            let o = S.find((c) => c.$nodeToRelocate$ === e);\n            M = !0, e[\"s-sn\"] = e[\"s-sn\"] || r, o ? (o.$nodeToRelocate$[\"s-sh\"] = l[\"s-hn\"], o.$slotRefNode$ = l) : (e[\"s-sh\"] = l[\"s-hn\"], S.push({\n              $slotRefNode$: l,\n              $nodeToRelocate$: e\n            })), e[\"s-sr\"] && S.map((c) => {\n              W(c.$nodeToRelocate$, e[\"s-sn\"]) && (o = S.find((i) => i.$nodeToRelocate$ === e), o && !c.$slotRefNode$ && (c.$slotRefNode$ = o.$slotRefNode$));\n            });\n          } else\n            S.some((o) => o.$nodeToRelocate$ === e) || S.push({\n              $nodeToRelocate$: e\n            });\n    }\n    l.nodeType === 1 && V(l);\n  }\n}, W = (t, e) => t.nodeType === 1 ? t.getAttribute(\"slot\") === null && e === \"\" || t.getAttribute(\"slot\") === e : t[\"s-sn\"] === e ? !0 : e === \"\", ee = (t) => {\n  t.$attrs$ && t.$attrs$.ref && t.$attrs$.ref(null), t.$children$ && t.$children$.map(ee);\n}, he = (t, e, n = !1) => {\n  var s, l, r, o, c;\n  const i = t.$hostElement$, d = t.$cmpMeta$, u = t.$vnode$ || O(null, null), f = ae(e) ? e : G(null, null, e);\n  if (m = i.tagName, d.$attrsToReflect$ && (f.$attrs$ = f.$attrs$ || {}, d.$attrsToReflect$.map(([$, a]) => f.$attrs$[a] = i[$])), n && f.$attrs$)\n    for (const $ of Object.keys(f.$attrs$))\n      i.hasAttribute($) && ![\"key\", \"ref\", \"style\", \"class\"].includes($) && (f.$attrs$[$] = i[$]);\n  f.$tag$ = null, f.$flags$ |= 4, t.$vnode$ = f, f.$elm$ = u.$elm$ = i.shadowRoot || i, T = i[\"s-sc\"], F = i[\"s-cr\"], X = (d.$flags$ & 1) !== 0, M = !1, k(u, f, n);\n  {\n    if (x.$flags$ |= 1, D) {\n      V(f.$elm$);\n      for (const $ of S) {\n        const a = $.$nodeToRelocate$;\n        if (!a[\"s-ol\"]) {\n          const p = R.createTextNode(\"\");\n          p[\"s-nr\"] = a, a.parentNode.insertBefore(a[\"s-ol\"] = p, a);\n        }\n      }\n      for (const $ of S) {\n        const a = $.$nodeToRelocate$, p = $.$slotRefNode$;\n        if (p) {\n          const v = p.parentNode;\n          let y = p.nextSibling;\n          {\n            let E = (s = a[\"s-ol\"]) === null || s === void 0 ? void 0 : s.previousSibling;\n            for (; E; ) {\n              let b = (l = E[\"s-nr\"]) !== null && l !== void 0 ? l : null;\n              if (b && b[\"s-sn\"] === a[\"s-sn\"] && v === b.parentNode && (b = b.nextSibling, !b || !b[\"s-nr\"])) {\n                y = b;\n                break;\n              }\n              E = E.previousSibling;\n            }\n          }\n          (!y && v !== a.parentNode || a.nextSibling !== y) && a !== y && (!a[\"s-hn\"] && a[\"s-ol\"] && (a[\"s-hn\"] = a[\"s-ol\"].parentNode.nodeName), v.insertBefore(a, y), a.nodeType === 1 && (a.hidden = (r = a[\"s-ih\"]) !== null && r !== void 0 ? r : !1));\n        } else\n          a.nodeType === 1 && (n && (a[\"s-ih\"] = (o = a.hidden) !== null && o !== void 0 ? o : !1), a.hidden = !0);\n      }\n    }\n    M && w(f.$elm$), x.$flags$ &= -2, S.length = 0;\n  }\n  if (I.experimentalScopedSlotChanges && d.$flags$ & 2)\n    for (const $ of f.$elm$.childNodes)\n      $[\"s-hn\"] !== m && !$[\"s-sh\"] && (n && $[\"s-ih\"] == null && ($[\"s-ih\"] = (c = $.hidden) !== null && c !== void 0 ? c : !1), $.hidden = !0);\n  F = void 0;\n}, z = (t, e) => e in t, B = typeof window < \"u\" ? window : {}, R = B.document || { head: {} };\nB.HTMLElement;\nconst x = {\n  $flags$: 0,\n  $resourcesUrl$: \"\",\n  jmp: (t) => t(),\n  raf: (t) => requestAnimationFrame(t),\n  ael: (t, e, n, s) => t.addEventListener(e, n, s),\n  rel: (t, e, n, s) => t.removeEventListener(e, n, s),\n  ce: (t, e) => new CustomEvent(t, e)\n}, ye = (t, e, n) => {\n  [null, void 0, \"\", !1].includes(n) || [\"innerHTML\", \"style\"].includes(e) || t.setAttribute(e, [\"object\", \"function\"].includes(typeof n) ? \"/!\\\\ Object props are not rendered in the code example\" : n);\n}, te = (t, e, n, s, l) => {\n  if (e && typeof e == \"string\") {\n    const r = document.createElement(e);\n    Object.keys(n || {}).forEach((o) => {\n      ye(r, o, n[o]);\n    }), s == null || s.forEach((o) => {\n      te(r, o.$tag$, o.$attrs$, o.$children$, o.$text$);\n    }), n != null && n.innerHTML && (r.innerHTML = n.innerHTML), t.appendChild(r);\n  }\n  l && (t.innerHTML = l);\n}, xe = (t, e) => {\n  const n = {};\n  if (typeof t != \"object\")\n    throw new Error(\"filterArgs - args isn't an object.\");\n  for (const s in t)\n    if (!s.startsWith(\"slot\")) {\n      const l = t[s], r = s.replace(/([a-z])([A-Z])/g, \"$1-$2\").toLowerCase();\n      (!e || !Object.keys(e).includes(s) || e[s] !== l) && (n[r] = l);\n    }\n  return n;\n}, me = (t, e) => {\n  var s, l;\n  const n = document.getElementById(\"storybook-root\");\n  if (n)\n    return (l = document.querySelector(\"[lang]\")) == null || l.setAttribute(\"lang\", ((s = e.globals) == null ? void 0 : s.locale) || \"en\"), he(\n      {\n        $ancestorComponent$: void 0,\n        $flags$: 0,\n        $modeName$: void 0,\n        $cmpMeta$: {\n          $flags$: 0,\n          $tagName$: n.tagName\n        },\n        $hostElement$: n\n      },\n      t(e)\n    ), n.children[n.children.length - 1];\n}, Le = ({ $tag$: t, $attrs$: e, $children$: n, $text$: s }) => {\n  const l = document.createElement(\"div\");\n  return te(l, t, e, n, s), l.innerHTML;\n}, Ee = (t) => {\n  const e = { value: \"2023\", pattern: \"yyyy\" }, n = { value: \"12\", pattern: \"mm\" }, s = { value: \"24\", pattern: \"dd\" };\n  return be([e.value, n.value, s.value].join(\"-\"), t).replace(e.value, e.pattern).replace(n.value, n.pattern).replace(s.value, s.pattern);\n}, Ae = (t) => t.toISOString().split(\"T\")[0], ve = (t, e, n) => {\n  const s = t.closest(\"[lang]\"), l = Intl.NumberFormat.supportedLocalesOf(s == null ? void 0 : s.lang), r = l.length > 0 && typeof l[0] == \"string\" ? l[0] : navigator.language || n, o = r.split(\"-\").shift();\n  return {\n    locale: r,\n    messages: e[o] || e[n]\n  };\n}, Re = (t, e, n) => new Intl.NumberFormat(e, { style: \"currency\", currency: n }).format(t), Me = (t, e) => new Intl.NumberFormat(e).format(t), Se = /^\\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01])$/, be = (t, e) => typeof t != \"string\" || t === \"\" || !Se.test(t) ? \"\" : new Intl.DateTimeFormat(e).format(new Date(t)), Oe = (t, e) => (n) => ve(n, t, e), je = (t = \"\", e = 10) => {\n  const n = new Uint8Array(e);\n  crypto.getRandomValues(n);\n  const s = Array.from(n).map((l) => l.toString(16).padStart(2, \"0\")).join(\"\").slice(0, e);\n  return t !== \"\" ? `${t}-${s}` : s;\n};\nclass Fe {\n  constructor(e = []) {\n    /**\n     * Available classes\n     */\n    g(this, \"classes\");\n    /**\n     * Add class\n     * @param className - class name to add\n     */\n    g(this, \"add\", (e) => {\n      this.has(e) || this.classes.push(e);\n    });\n    /**\n     * Delete class\n     * @param className - class name to delete\n     */\n    g(this, \"delete\", (e) => {\n      const n = this.classes.indexOf(e);\n      n > -1 && this.classes.splice(n, 1);\n    });\n    /**\n     * Check if class exist in list\n     * @param className - class name to check\n     * @returns class name is in the list\n     */\n    g(this, \"has\", (e) => this.classes.includes(e));\n    /**\n     * Join classes seperated by spaces\n     * @returns joined values\n     */\n    g(this, \"join\", () => this.classes.join(\" \"));\n    this.classes = e;\n  }\n}\nconst De = (t) => Array.isArray(t) && t.every((e) => typeof e == \"string\"), _e = (t, e) => e.includes(t == null ? void 0 : t.tagName.toLowerCase()), Be = 'a[href], button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"]), [identifier], mg-button', Ne = (t) => {\n  const e = se(t), n = ne(t);\n  return [t, ...e, ...n];\n}, se = (t, e = []) => {\n  if (t.self !== t.top)\n    try {\n      const n = t.parent;\n      return n ? (e.push(n), se(n, e)) : e;\n    } catch (n) {\n      return console.error(\"Different hosts between iframes:\", n), e;\n    }\n  return e;\n}, ne = (t, e = []) => {\n  if (t.frames.length > 0)\n    for (const n of Array.from(t.frames))\n      e.push(n), ne(n, e);\n  return e;\n}, He = (t) => typeof t == \"string\" && t.trim() !== \"\", Ce = (t) => typeof t == \"string\" ? t.toLocaleLowerCase().normalize(\"NFD\").replaceAll(/[\\u0300-\\u036f]/g, \"\") : t, Pe = async (t) => t(), Ue = ({ disconnect: t, observe: e, takeRecords: n }) => {\n  class s {\n    constructor(r) {\n      /**\n       *\n       */\n      g(this, \"disconnect\", t);\n      /**\n       *\n       */\n      g(this, \"observe\", e);\n      /**\n       *\n       */\n      g(this, \"takeRecords\", n);\n      /**\n       *\n       */\n      g(this, \"cb\");\n      this.cb = r;\n    }\n  }\n  return [window, global].forEach((l) => {\n    Object.defineProperty(l, \"MutationObserver\", {\n      writable: !0,\n      configurable: !0,\n      value: s\n    });\n  }), s;\n}, We = ({ disconnect: t, observe: e }) => {\n  class n {\n    constructor(l) {\n      /**\n       *\n       */\n      g(this, \"disconnect\", t);\n      /**\n       *\n       */\n      g(this, \"observe\", e);\n      /**\n       *\n       */\n      g(this, \"unobserve\");\n      /**\n       *\n       */\n      g(this, \"cb\");\n      this.cb = l;\n    }\n  }\n  return [window, global].forEach((s) => {\n    Object.defineProperty(s, \"ResizeObserver\", {\n      writable: !0,\n      configurable: !0,\n      value: n\n    });\n  }), n;\n};\nclass Te extends Event {\n  constructor() {\n    super(...arguments);\n    /**\n     *\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    g(this, \"detail\");\n  }\n}\nconst ze = () => {\n  class t extends Te {\n  }\n  return [window, global].forEach((e) => {\n    Object.defineProperty(e, \"SubmitEvent\", {\n      writable: !0,\n      configurable: !0,\n      value: t\n    });\n  }), t;\n};\nexport {\n  Fe as ClassList,\n  De as allItemsAreString,\n  Ce as cleanString,\n  je as createID,\n  Se as dateRegExp,\n  Ae as dateToString,\n  Oe as defineLocales,\n  xe as filterArgs,\n  Be as focusableElements,\n  Ee as getLocaleDatePattern,\n  se as getParentWindows,\n  Le as getStoryHTML,\n  Ne as getWindows,\n  _e as isTagName,\n  He as isValidString,\n  Re as localeCurrency,\n  be as localeDate,\n  Me as localeNumber,\n  Pe as nextTick,\n  Ue as setupMutationObserverMock,\n  We as setupResizeObserverMock,\n  ze as setupSubmitEventMock,\n  me as stencilWrapper\n};\n//# sourceMappingURL=index.es.js.map\n"],"version":3}

package/dist/components/index2.js

@@ -1,7 +1,9 @@
+import { O as Oe } from './index.es.js';
+
 const errors$1 = {
 	required: "This field is required.",
 	date: {
-		badInput: "The date format must be <span aria-hidden=\"true\">mm/dd/yyyy</span><span class=\"mg-u-visually-hidden\">m m / d d / y y y y</span> and the date must be greater than {min}",
+		badInput: "The date format must be {pattern} and the date must be greater than {min}",
 		min: "The date cannot be earlier than {min}",
 		max: "The date cannot be later than {max}",
 		minMax: "The date must be between {min} and {max}"
@@ -32,14 +34,24 @@ const input$1 = {
 			selected: {
 				title: "Selected",
 				titlePlurial: "Selected",
-				action: "Unselect all"
+				action: "Unselect all",
+				tooltip: "Unselect all current search results"
 			},
 			notSelected: {
 				title: "Not selected",
 				titlePlurial: "Not selected",
-				action: "Select all"
+				action: "Select all",
+				tooltip: "Select all current search results"
 			}
 		}
+	},
+	date: {
+		helpText: "Expected format: {pattern} (ex: {date})",
+		pattern: {
+			dd: "dd",
+			mm: "mm",
+			yyyy: "yyyy"
+		}
 	}
 };
 const form$1 = {
@@ -100,7 +112,7 @@ const en = {
 const errors = {
 	required: "Ce champ est obligatoire.",
 	date: {
-		badInput: "Le format de la date doit être du type <span aria-hidden=\"true\">jj/mm/aaaa</span><span class=\"mg-u-visually-hidden\">j j / m m / a a a a</span> et la date supérieure au {min}",
+		badInput: "Le format de la date doit être du type {pattern} et la date supérieure au {min}",
 		min: "La date ne peut pas être antérieure au {min}",
 		max: "La date ne peut pas être postérieure au {max}",
 		minMax: "La date doit être comprise entre le {min} et le {max}"
@@ -131,14 +143,24 @@ const input = {
 			selected: {
 				title: "Sélectionné",
 				titlePlurial: "Sélectionnés",
-				action: "Tout désélectionner"
+				action: "Tout désélectionner",
+				tooltip: "Désélectionne tous les résultats de la recherche en cours"
 			},
 			notSelected: {
 				title: "Non sélectionné",
 				titlePlurial: "Non sélectionnés",
-				action: "Tout sélectionner"
+				action: "Tout sélectionner",
+				tooltip: "Sélectionne tous les résultats de la recherche en cours"
 			}
 		}
+	},
+	date: {
+		helpText: "Format attendu&nbsp;: {pattern} (ex&nbsp;: {date})",
+		pattern: {
+			dd: "jj",
+			mm: "mm",
+			yyyy: "aaaa"
+		}
 	}
 };
 const form = {
@@ -196,63 +218,6 @@ const fr = {
 	actionMore: actionMore
 };
 
-/**
- * Format number to the locale currency
- * @param number - number to format
- * @param locale - locale to apply
- * @param currency - currency to apply
- * @returns formatted currency
- */
-const localeCurrency = (number, locale, currency) => {
-    return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(number);
-};
-/**
- * Format number to locale
- * @param number - number to format
- * @param locale - locale to apply
- * @returns formatted number
- */
-const localeNumber = (number, locale) => {
-    return new Intl.NumberFormat(locale).format(number);
-};
-/**
- * Date RegExp
- */
-const dateRegExp = /^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/;
-/**
- * Locale date format
- * @param date - date to format
- * @param locale - locale to apply
- * @returns formatted date
- */
-const localeDate = (date, locale) => {
-    if (typeof date !== 'string' || date === '' || !dateRegExp.test(date)) {
-        return '';
-    }
-    return new Intl.DateTimeFormat(locale).format(new Date(date));
-};
-/**
- * Get locale and messages
- * We load the defined locale but for now we only support the first subtag for messages
- * @param element - element we need to get the language
- * @param messages - messages to use
- * @param defaultLocale - default messages locale
- * @returns messages object
- */
-const getLocaleMessages = (element, messages, defaultLocale) => {
-    // Get local
-    const closestLangAttribute = element.closest('[lang]');
-    const closestLang = Intl.NumberFormat.supportedLocalesOf(closestLangAttribute === null || closestLangAttribute === void 0 ? void 0 : closestLangAttribute.lang);
-    const locale = closestLang.length > 0 ? closestLang[0] : navigator.language || defaultLocale;
-    // Only keep first subtag
-    const localeSubtag = locale.split('-').shift();
-    // Return
-    return {
-        locale,
-        messages: messages[localeSubtag] || messages[defaultLocale],
-    };
-};
-
 const defaultLocale = 'en';
 const messages = { en, fr };
 /**
@@ -260,8 +225,8 @@ const messages = { en, fr };
  * @param element - element we need to get the language
  * @returns messages object
  */
-const initLocales = (element) => getLocaleMessages(element, messages, defaultLocale);
+const initLocales = Oe(messages, defaultLocale);
 
-export { localeCurrency as a, localeNumber as b, dateRegExp as d, initLocales as i, localeDate as l };
+export { initLocales as i };
 
 //# sourceMappingURL=index2.js.map

package/dist/components/index2.js.map

@@ -1 +1 @@
-{"file":"index2.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;MAOa,cAAc,GAAG,CAAC,MAAc,EAAE,MAAc,EAAE,QAAgB;IAC7E,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AACvF,EAAE;AAEF;;;;;;MAMa,YAAY,GAAG,CAAC,MAAc,EAAE,MAAc;IACzD,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AACtD,EAAE;AAEF;;;MAGa,UAAU,GAAG,gDAAgD;AAE1E;;;;;;MAMa,UAAU,GAAG,CAAC,IAAY,EAAE,MAAc;IACrD,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;QACrE,OAAO,EAAE,CAAC;KACX;IACD,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;AAChE,EAAE;AAEF;;;;;;;;AAQO,MAAM,iBAAiB,GAAG,CAAC,OAAoB,EAAE,QAAiB,EAAE,aAAqB;;IAE9F,MAAM,oBAAoB,GAAgB,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IACpE,MAAM,WAAW,GAAa,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,IAAI,CAAC,CAAC;IAC/F,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,QAAQ,IAAI,aAAa,CAAC;;IAE7F,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC;;IAE/C,OAAO;QACL,MAAM;QACN,QAAQ,EAAE,QAAQ,CAAC,YAAY,CAAC,IAAI,QAAQ,CAAC,aAAa,CAAC;KAC5D,CAAC;AACJ,CAAC;;ACvDD,MAAM,aAAa,GAAG,IAAI,CAAC;AAC3B,MAAM,QAAQ,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;AAE5B;;;;;MAKa,WAAW,GAAG,CAAC,OAAoB,KAA4D,iBAAiB,CAAC,OAAO,EAAE,QAAQ,EAAE,aAAa;;;;","names":[],"sources":["src/utils/locale.utils.ts","src/locales/index.ts"],"sourcesContent":["/**\n * Format number to the locale currency\n * @param number - number to format\n * @param locale - locale to apply\n * @param currency - currency to apply\n * @returns formatted currency\n */\nexport const localeCurrency = (number: number, locale: string, currency: string): string => {\n  return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(number);\n};\n\n/**\n * Format number to locale\n * @param number - number to format\n * @param locale - locale to apply\n * @returns formatted number\n */\nexport const localeNumber = (number: number, locale: string): string => {\n  return new Intl.NumberFormat(locale).format(number);\n};\n\n/**\n * Date RegExp\n */\nexport const dateRegExp = /^\\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01])$/;\n\n/**\n * Locale date format\n * @param date - date to format\n * @param locale - locale to apply\n * @returns formatted date\n */\nexport const localeDate = (date: string, locale: string): string => {\n  if (typeof date !== 'string' || date === '' || !dateRegExp.test(date)) {\n    return '';\n  }\n  return new Intl.DateTimeFormat(locale).format(new Date(date));\n};\n\n/**\n * Get locale and messages\n * We load the defined locale but for now we only support the first subtag for messages\n * @param element - element we need to get the language\n * @param messages - messages to use\n * @param defaultLocale - default messages locale\n * @returns messages object\n */\nexport const getLocaleMessages = (element: HTMLElement, messages: unknown, defaultLocale: string): { locale: string; messages: Record<string, unknown> } => {\n  // Get local\n  const closestLangAttribute: HTMLElement = element.closest('[lang]');\n  const closestLang: string[] = Intl.NumberFormat.supportedLocalesOf(closestLangAttribute?.lang);\n  const locale = closestLang.length > 0 ? closestLang[0] : navigator.language || defaultLocale;\n  // Only keep first subtag\n  const localeSubtag = locale.split('-').shift();\n  // Return\n  return {\n    locale,\n    messages: messages[localeSubtag] || messages[defaultLocale],\n  };\n};\n","import en from './en/messages.json';\nimport fr from './fr/messages.json';\nimport { getLocaleMessages } from '../utils/locale.utils';\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 = (element: HTMLElement): { locale: string; messages: Record<string, unknown> } => getLocaleMessages(element, messages, defaultLocale);\n"],"version":3}
+{"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}

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

@@ -1,8 +1,8 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { i as initLocales } from './index2.js';
-import { S as Status, d as defineCustomElement$4 } from './mg-menu-item2.js';
+import { d as defineCustomElement$4, S as Status } from './mg-menu-item2.js';
 import { D as Direction } from './mg-menu.conf.js';
-import { c as createID } from './components.utils.js';
+import { j as je } from './index.es.js';
 import { d as defineCustomElement$9 } from './mg-badge2.js';
 import { d as defineCustomElement$8 } from './mg-button2.js';
 import { d as defineCustomElement$7 } from './mg-card2.js';
@@ -12,6 +12,7 @@ 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-popover-padding-vertical:1rem;--mg-popover-padding-horizontal:0;--mg-popover-max-width:unset}.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
@@ -50,7 +51,7 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
          ************/
         this.name = 'mg-action-more';
         this.classBase = 'mg-c-action-more';
-        this.mgPopoverIdentifier = createID(this.name);
+        this.mgPopoverIdentifier = je(this.name);
         /************
          * Methods *
          ***********/
@@ -151,7 +152,7 @@ const MgActionMore$1 = /*@__PURE__*/ proxyCustomElement(class MgActionMore exten
         "items": ["validateItems"],
         "displayChevron": ["validateDisplayChevron"]
     }; }
-    static get style() { return mgActionMoreCss; }
+    static get style() { return MgActionMoreStyle0; }
 }, [1, "mg-action-more", {
         "icon": [1040],
         "button": [16],

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

@@ -1 +1 @@
-{"file":"mg-action-more.js","mappings":";;;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,gqBAAgqB;;ACOxrB;;;;;AAKA,MAAM,mBAAmB,GAAG,CAAC,IAAa;IACxC,MAAM,KAAK,GAAG,IAA8B,CAAC;IAC7C,OAAO,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,IAAI,OAAO,IAAI,CAAC,iBAAiB,KAAK,UAAU,CAAC,CAAC;AACtK,CAAC,CAAC;AAEF;;;;;AAKA,MAAM,oBAAoB,GAAG,CAAC,IAAa;IACzC,MAAM,MAAM,GAAG,IAA8B,CAAC;IAC9C,OAAO,OAAO,MAAM,KAAK,QAAQ,IAAI,OAAO,MAAM,CAAC,OAAO,KAAK,QAAQ,IAAI,OAAO,MAAM,CAAC,MAAM,KAAK,SAAS,CAAC;AAChH,CAAC,CAAC;AAEF;;;;;AAKA,MAAM,kBAAkB,GAAG,CAAC,IAAa;IACvC,MAAM,IAAI,GAAG,IAA4B,CAAC;IAC1C,OAAO,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC;AACnE,CAAC,CAAC;MAOWA,cAAY;;;;;;;;QAKN,SAAI,GAAG,gBAAgB,CAAC;QACxB,cAAS,GAAG,kBAAkB,CAAC;QAC/B,wBAAmB,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;;;;;;;QAqEnD,mBAAc,GAAG;YACvB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;SAChC,CAAC;;;;;QAMM,wBAAmB,GAAG,CAAC,KAAkB;YAC/C,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC;SAC9B,CAAC;;;;QAKM,iBAAY,GAAG;YACrB,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB,CAAC;;;;;;QAOM,oBAAe,GAAG,CAAC,KAAiB,EAAE,aAAwD;YACpG,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,aAAa,CAAC,KAAK,CAAC,CAAC;SACtB,CAAC;;sBApEuC,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE;;;wBAgCtD,KAAK;;IA3CzB,YAAY,CAAC,QAA8B;QACzC,IAAI,QAAQ,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,EAAE;YAC7C,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,8CAA8C,CAAC,CAAC;SAC9E;aAAM,IAAI,EAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,CAAA,IAAI,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;YACzD,IAAI,CAAC,IAAI,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;SAClC;KACF;IAOD,cAAc,CAAC,QAAgC;QAC7C,IAAI,QAAQ,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC,EAAE;YAC/C,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,kDAAkD,CAAC,CAAC;SAClF;KACF;IAOD,aAAa,CAAC,QAA+B;QAC3C,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,EAAE;YAClC,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,wFAAwF,CAAC,CAAC;SACxH;KACF;IAOD,sBAAsB,CAAC,QAAwC;QAC7D,IAAI,QAAQ,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,KAAK,IAAI,EAAE;YAC3C,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,gFAAgF,CAAC,CAAC;SAChH;KACF;;;;;;;IAiDD,iBAAiB;QACf,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,UAAqC,CAAC;QACzF,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACjC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7B,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KAClD;;;;;IAMD,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;QAC7D,MAAM,aAAa,GAAG,CAAC,WAAW,CAAC,CAAC;QAEpC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC,cAAc,EAAE;YAC9C,aAAa,CAAC,IAAI,CAChB,YACE,KAAK,EAAE;oBACL,CAAC,GAAG,IAAI,CAAC,SAAS,WAAW,GAAG,IAAI;oBACpC,CAAC,GAAG,IAAI,CAAC,SAAS,mBAAmB,GAAG,IAAI,CAAC,QAAQ,KAAK,IAAI;iBAC/D,IAED,eAAS,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,OAAO,GAAW,CAC/C,CACR,CAAC;SACH;QAED,QACE,EAAC,IAAI,6BAAwB,IAAI,CAAC,mBAAmB,IACnD,YAAM,KAAK,EAAC,gBAAgB,IAC1B,kBAAY,UAAU,EAAE,IAAI,CAAC,mBAAmB,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,sBAAoB,IAAI,CAAC,mBAAmB,IAClH,iBAAW,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,IAC9J,IAAI,CAAC,IAAI,IAAI,+BAAa,IAAI,CAAC,IAAI,EAAY,EAC/C,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,aAAa,CAC3B,EACZ,WAAK,IAAI,EAAC,SAAS,IACjB,eAAS,SAAS,EAAE,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,IAC/D,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI;;YAAI;;YAEtB,oBAAc,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IACjJ,IAAI,CAAC,IAAI,IAAI,eAAS,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,GAAW,EAC/D,YAAM,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,EACrC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,KAAI,gBAAU,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,EAAC,aAAa,EAAC,OAAO,EAAC,YAAY,GAAY,CACxH,EAChB;SAAA,CAAC,CACM,CACN,CACK,CACR,CACF,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgActionMore"],"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-popover-padding-vertical: 1rem;--mg-popover-padding-horizontal: 0;--mg-popover-max-width: unset}.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 { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreMessageType } from './mg-action-more.conf';\nimport { initLocales } from '../../../locales';\nimport { Status } from '../menu/mg-menu-item/mg-menu-item.conf';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport { createID } from '../../../utils/components.utils';\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 typeof items === 'object' && items.every(item => typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function');\n};\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: MgActionMoreMessageType;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgActionMoreElement;\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.`);\n    } else if (!newValue?.icon && 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.`);\n    }\n  }\n\n  /**\n   * Define the menu-items elements\n   */\n  @Prop() items!: MgActionMoreItemType[];\n  @Watch('items')\n  validateItems(newValue: MgActionMore['items']): void {\n    if (!isMgActionMoreItems(newValue)) {\n      throw new Error(`<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType.`);\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 MgActionMoreMessageType;\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\" size=\"small\"></mg-icon>\n        </span>,\n      );\n    }\n\n    return (\n      <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n        <span class=\"mg-action-more\">\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={Direction.VERTICAL} label={this.messages.label}>\n                {this.items.map(item => (\n                  // eslint-disable-next-line react/jsx-no-bind\n                  <mg-menu-item key={item.label} status={item.status || Status.VISIBLE} onClick={e => this.handleItemClick(e, item.mouseEventHandler)} href={item.href}>\n                    {item.icon && <mg-icon icon={item.icon} 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              </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","createID"],"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-popover-padding-vertical: 1rem;--mg-popover-padding-horizontal: 0;--mg-popover-max-width: unset}.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 { MgActionMoreItemType, MgActionMoreButtonType, MgActionMoreIconType, MgActionMoreMessageType } from './mg-action-more.conf';\nimport { initLocales } from '../../../locales';\nimport { Status } from '../menu/mg-menu-item/mg-menu-item.conf';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport { createID } from '@mgdis/stencil-helpers';\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 typeof items === 'object' && items.every(item => typeof item === 'object' && typeof item.label === 'string' && typeof item.mouseEventHandler === 'function');\n};\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: MgActionMoreMessageType;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Get component DOM element\n   */\n  @Element() element: HTMLMgActionMoreElement;\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.`);\n    } else if (!newValue?.icon && 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.`);\n    }\n  }\n\n  /**\n   * Define the menu-items elements\n   */\n  @Prop() items!: MgActionMoreItemType[];\n  @Watch('items')\n  validateItems(newValue: MgActionMore['items']): void {\n    if (!isMgActionMoreItems(newValue)) {\n      throw new Error(`<${this.name}> prop \"items\" is required and all values must be the same type, MgActionMoreItemType.`);\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 MgActionMoreMessageType;\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\" size=\"small\"></mg-icon>\n        </span>,\n      );\n    }\n\n    return (\n      <Host data-mg-popover-guard={this.mgPopoverIdentifier}>\n        <span class=\"mg-action-more\">\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={Direction.VERTICAL} label={this.messages.label}>\n                {this.items.map(item => (\n                  // eslint-disable-next-line react/jsx-no-bind\n                  <mg-menu-item key={item.label} status={item.status || Status.VISIBLE} onClick={e => this.handleItemClick(e, item.mouseEventHandler)} href={item.href}>\n                    {item.icon && <mg-icon icon={item.icon} 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              </mg-menu>\n            </div>\n          </mg-popover>\n        </span>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/mg-badge2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { C as ClassList, i as isValidString } from './components.utils.js';
+import { F as Fe, H as He } from './index.es.js';
 
 /**
  * List of all possibles variants
@@ -7,6 +7,7 @@ import { C as ClassList, i as isValidString } from './components.utils.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}}.mg-c-badge{min-width:var(--mg-badge-size);height:var(--mg-badge-size);box-sizing:border-box;padding:0 .4rem;border:.1rem solid;border-radius:calc(var(--mg-badge-size)/2);font-size:var(--mg-badge-font-size);font-weight:600;line-height:var(--mg-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:hsl(var(--color-dark));background-color:hsl(var(--color-dark));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--secondary{border-color:hsl(var(--color-light));background-color:hsl(var(--color-light));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--success{border-color:hsl(var(--color-success));background-color:hsl(var(--color-success));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-success))}.mg-c-badge.mg-c-badge--warning{border-color:hsl(var(--color-warning));background-color:hsl(var(--color-warning));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-warning))}.mg-c-badge.mg-c-badge--danger{border-color:hsl(var(--color-danger));background-color:hsl(var(--color-danger));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-danger))}.mg-c-badge.mg-c-badge--info{border-color:hsl(var(--color-info));background-color:hsl(var(--color-info));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-info))}.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:hsl(var(--mg-badge-text-color, var(--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,7 +23,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
         this.label = undefined;
         this.variant = variants[0];
         this.outline = undefined;
-        this.classCollection = new ClassList(['mg-c-badge']);
+        this.classCollection = new Fe(['mg-c-badge']);
     }
     validateValue(newValue) {
         if (/^(\d+\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {
@@ -30,7 +31,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
         }
     }
     validateLabel(newValue) {
-        if (!isValidString(newValue)) {
+        if (!He(newValue)) {
             throw new Error('<mg-badge> prop "label" is required.');
         }
     }
@@ -73,7 +74,7 @@ const MgBadge = /*@__PURE__*/ proxyCustomElement(class MgBadge extends HTMLEleme
         "variant": ["validateVariant"],
         "outline": ["validateOutline"]
     }; }
-    static get style() { return mgBadgeCss; }
+    static get style() { return MgBadgeStyle0; }
 }, [1, "mg-badge", {
         "value": [8],
         "label": [1],

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

@@ -1 +1 @@
-{"file":"mg-badge2.js","mappings":";;;AAAA;;;AAGO,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,CAAU;;ACH/G,MAAM,UAAU,GAAG,yoFAAyoF;;MCQ/oF,OAAO;;;;;;;;;QAMD,iBAAY,GAAG,qBAAqB,CAAC;;;uBAgCjB,QAAQ,CAAC,CAAC,CAAC;;+BA0BV,IAAI,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;;IA/CnE,aAAa,CAAC,QAA0B;QACtC,IAAI,sBAAsB,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,KAAK,IAAI,EAAE;YACvD,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;SACtF;KACF;IAQD,aAAa,CAAC,QAA0B;QACtC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;YAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;SACzD;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,GAAG,CAAC,CAAC;SACtF;aAAM;YACL,IAAI,QAAQ,KAAK,SAAS,EAAE;gBAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;aACxD;YACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;SACrD;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,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,IACtC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACnD,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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":["/**\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 = (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}}.mg-c-badge{min-width:var(--mg-badge-size);height:var(--mg-badge-size);box-sizing:border-box;padding:0 .4rem;border:.1rem solid;border-radius:calc(var(--mg-badge-size)/2);font-size:var(--mg-badge-font-size);font-weight:600;line-height:var(--mg-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:hsl(var(--color-dark));background-color:hsl(var(--color-dark));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--secondary{border-color:hsl(var(--color-light));background-color:hsl(var(--color-light));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--success{border-color:hsl(var(--color-success));background-color:hsl(var(--color-success));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-success))}.mg-c-badge.mg-c-badge--warning{border-color:hsl(var(--color-warning));background-color:hsl(var(--color-warning));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-warning))}.mg-c-badge.mg-c-badge--danger{border-color:hsl(var(--color-danger));background-color:hsl(var(--color-danger));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-danger))}.mg-c-badge.mg-c-badge--info{border-color:hsl(var(--color-info));background-color:hsl(var(--color-info));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-info))}.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:hsl(var(--mg-badge-text-color, var(--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 } from '../../../utils/components.utils';\n@Component({\n  tag: 'mg-badge',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css',\n  shadow: true,\n})\nexport class MgBadge {\n  /************\n   * Internal *\n   ************/\n\n  // Classes\n  private readonly classOutline = `mg-c-badge--outline`;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Badge value\n   */\n  @Prop() value!: string | number;\n  @Watch('value')\n  validateValue(newValue: MgBadge['value']): void {\n    if (/^(\\d+\\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {\n      throw new Error('<mg-badge> prop \"value\" must be integer or ponctuation character.');\n    }\n  }\n\n  /**\n   * Badge label. Include short description.\n   * Required for accessibility\n   */\n  @Prop() label!: string;\n  @Watch('label')\n  validateLabel(newValue: MgBadge['label']): void {\n    if (!isValidString(newValue)) {\n      throw new Error('<mg-badge> prop \"label\" is required.');\n    }\n  }\n\n  /**\n   * Define button variant\n   */\n  @Prop() variant?: BadgeVariantType = variants[0]; // info\n  @Watch('variant')\n  validateVariant(newValue: MgBadge['variant'], oldValue?: MgBadge['variant']): void {\n    if (!variants.includes(newValue)) {\n      throw new Error(`<mg-badge> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n    } else {\n      if (oldValue !== undefined) {\n        this.classCollection.delete(`mg-c-badge--${oldValue}`);\n      }\n      this.classCollection.add(`mg-c-badge--${newValue}`);\n    }\n  }\n\n  /**\n   * Define if button is using outline style\n   */\n  @Prop() outline: boolean;\n  @Watch('outline')\n  validateOutline(newValue: MgBadge['outline']): void {\n    if (newValue) this.classCollection.add(this.classOutline);\n    else this.classCollection.delete(this.classOutline);\n  }\n\n  /**\n   * Component classes\n   */\n  @State() classCollection: ClassList = new ClassList(['mg-c-badge']);\n\n  /**\n   * Check if props are well configured on init\n   */\n  componentWillLoad(): void {\n    this.validateValue(this.value);\n    this.validateLabel(this.label);\n    this.validateVariant(this.variant);\n    this.validateOutline(this.outline);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <span class={this.classCollection.join()}>\n        <span class=\"mg-c-badge__value\">{this.value}</span>\n        <span class=\"mg-u-visually-hidden\">{this.label}</span>\n      </span>\n    );\n  }\n}\n"],"version":3}
+{"file":"mg-badge2.js","mappings":";;;AAAA;;;AAGO,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,CAAU;;ACH/G,MAAM,UAAU,GAAG,yoFAAyoF,CAAC;AAC7pF,sBAAe,UAAU;;MCOZ,OAAO;;;;;;;;;QAMD,iBAAY,GAAG,qBAAqB,CAAC;;;uBAgCjB,QAAQ,CAAC,CAAC,CAAC;;+BA0BV,IAAIA,EAAS,CAAC,CAAC,YAAY,CAAC,CAAC;;IA/CnE,aAAa,CAAC,QAA0B;QACtC,IAAI,sBAAsB,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,KAAK,IAAI,EAAE;YACvD,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;SACtF;KACF;IAQD,aAAa,CAAC,QAA0B;QACtC,IAAI,CAACC,EAAa,CAAC,QAAQ,CAAC,EAAE;YAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;SACzD;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,GAAG,CAAC,CAAC;SACtF;aAAM;YACL,IAAI,QAAQ,KAAK,SAAS,EAAE;gBAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;aACxD;YACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;SACrD;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,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,IACtC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ,EACnD,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ClassList","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":["/**\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 = (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}}.mg-c-badge{min-width:var(--mg-badge-size);height:var(--mg-badge-size);box-sizing:border-box;padding:0 .4rem;border:.1rem solid;border-radius:calc(var(--mg-badge-size)/2);font-size:var(--mg-badge-font-size);font-weight:600;line-height:var(--mg-badge-size);text-align:center}.mg-c-badge.mg-c-badge--primary{border-color:hsl(var(--color-dark));background-color:hsl(var(--color-dark));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--primary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--secondary{border-color:hsl(var(--color-light));background-color:hsl(var(--color-light));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--secondary.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--success{border-color:hsl(var(--color-success));background-color:hsl(var(--color-success));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--success.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-success))}.mg-c-badge.mg-c-badge--warning{border-color:hsl(var(--color-warning));background-color:hsl(var(--color-warning));color:hsl(var(--color-dark))}.mg-c-badge.mg-c-badge--warning.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-warning))}.mg-c-badge.mg-c-badge--danger{border-color:hsl(var(--color-danger));background-color:hsl(var(--color-danger));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--danger.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-danger))}.mg-c-badge.mg-c-badge--info{border-color:hsl(var(--color-info));background-color:hsl(var(--color-info));color:hsl(var(--color-light))}.mg-c-badge.mg-c-badge--info.mg-c-badge--outline{background-color:rgba(0,0,0,0);color:hsl(var(--color-info))}.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:hsl(var(--mg-badge-text-color, var(--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 } from '@mgdis/stencil-helpers';\n@Component({\n  tag: 'mg-badge',\n  styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css',\n  shadow: true,\n})\nexport class MgBadge {\n  /************\n   * Internal *\n   ************/\n\n  // Classes\n  private readonly classOutline = `mg-c-badge--outline`;\n\n  /**************\n   * Decorators *\n   **************/\n\n  /**\n   * Badge value\n   */\n  @Prop() value!: string | number;\n  @Watch('value')\n  validateValue(newValue: MgBadge['value']): void {\n    if (/^(\\d+\\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {\n      throw new Error('<mg-badge> prop \"value\" must be integer or ponctuation character.');\n    }\n  }\n\n  /**\n   * Badge label. Include short description.\n   * Required for accessibility\n   */\n  @Prop() label!: string;\n  @Watch('label')\n  validateLabel(newValue: MgBadge['label']): void {\n    if (!isValidString(newValue)) {\n      throw new Error('<mg-badge> prop \"label\" is required.');\n    }\n  }\n\n  /**\n   * Define button variant\n   */\n  @Prop() variant?: BadgeVariantType = variants[0]; // info\n  @Watch('variant')\n  validateVariant(newValue: MgBadge['variant'], oldValue?: MgBadge['variant']): void {\n    if (!variants.includes(newValue)) {\n      throw new Error(`<mg-badge> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n    } else {\n      if (oldValue !== undefined) {\n        this.classCollection.delete(`mg-c-badge--${oldValue}`);\n      }\n      this.classCollection.add(`mg-c-badge--${newValue}`);\n    }\n  }\n\n  /**\n   * Define if button is using outline style\n   */\n  @Prop() outline: boolean;\n  @Watch('outline')\n  validateOutline(newValue: MgBadge['outline']): void {\n    if (newValue) this.classCollection.add(this.classOutline);\n    else this.classCollection.delete(this.classOutline);\n  }\n\n  /**\n   * Component classes\n   */\n  @State() classCollection: ClassList = new ClassList(['mg-c-badge']);\n\n  /**\n   * Check if props are well configured on init\n   */\n  componentWillLoad(): void {\n    this.validateValue(this.value);\n    this.validateLabel(this.label);\n    this.validateVariant(this.variant);\n    this.validateOutline(this.outline);\n  }\n\n  /**\n   * Render\n   * @returns HTML Element\n   */\n  render(): HTMLElement {\n    return (\n      <span class={this.classCollection.join()}>\n        <span class=\"mg-c-badge__value\">{this.value}</span>\n        <span class=\"mg-u-visually-hidden\">{this.label}</span>\n      </span>\n    );\n  }\n}\n"],"version":3}

package/dist/components/mg-button2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { C as ClassList, i as isValidString, n as nextTick } from './components.utils.js';
+import { F as Fe, H as He, P as Pe } from './index.es.js';
 import { d as defineCustomElement$1 } from './mg-icon2.js';
 
 /**
@@ -8,6 +8,7 @@ import { d as defineCustomElement$1 } from './mg-icon2.js';
 const variants = ['primary', 'secondary', 'danger', 'danger-alt', 'info', 'flat', 'success', 'link'];
 
 const mgButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle}:host(:hover) .mg-c-button--flat:not(.mg-c-button--disabled){background:hsl(var(--color-dark)/10%)}:host([full-width]){display:block}:host([disabled]),:host([aria-disabled=true]){pointer-events:none}.mg-c-button.mg-c-button--primary{border-color:hsl(var(--mg-button-primary-border-color, var(--mg-button-primary-color-h), var(--mg-button-primary-color-s), calc(var(--mg-button-primary-color-l) - var(--mg-button-border-variation) * 10%)));background:linear-gradient(to bottom, hsl(var(--mg-button-primary-color-h), var(--mg-button-primary-color-s), var(--mg-button-primary-color-l)), hsl(var(--mg-button-primary-color-h), var(--mg-button-primary-color-s), calc(var(--mg-button-primary-color-l) - var(--mg-button-gradient) * 10%)));color:hsl(var(--mg-button-primary-font-color))}:host(:hover) .mg-c-button--primary:not(.mg-c-button--disabled){background:hsl(var(--mg-button-primary-color-h), var(--mg-button-primary-color-s), var(--mg-button-primary-color-l))}.mg-c-button.mg-c-button--secondary{border-color:hsl(var(--mg-button-secondary-border-color, var(--mg-button-secondary-color-h), var(--mg-button-secondary-color-s), calc(var(--mg-button-secondary-color-l) - var(--mg-button-border-variation) * 10%)));background:linear-gradient(to bottom, hsl(var(--mg-button-secondary-color-h), var(--mg-button-secondary-color-s), var(--mg-button-secondary-color-l)), hsl(var(--mg-button-secondary-color-h), var(--mg-button-secondary-color-s), calc(var(--mg-button-secondary-color-l) - var(--mg-button-gradient) * 10%)));color:hsl(var(--mg-button-secondary-font-color))}:host(:hover) .mg-c-button--secondary:not(.mg-c-button--disabled){background:hsl(var(--mg-button-secondary-color-h), var(--mg-button-secondary-color-s), var(--mg-button-secondary-color-l))}.mg-c-button.mg-c-button--danger{border-color:hsl(var(--mg-button-danger-border-color, var(--color-danger-h), var(--color-danger-s), calc(var(--color-danger-l) - var(--mg-button-border-variation) * 10%)));background:linear-gradient(to bottom, hsl(var(--color-danger-h), var(--color-danger-s), var(--color-danger-l)), hsl(var(--color-danger-h), var(--color-danger-s), calc(var(--color-danger-l) - var(--mg-button-gradient) * 10%)));color:hsl(var(--color-neutral))}:host(:hover) .mg-c-button--danger:not(.mg-c-button--disabled){background:hsl(var(--color-danger-h), var(--color-danger-s), var(--color-danger-l))}.mg-c-button.mg-c-button--danger-alt{border-color:hsl(var(--mg-button-danger-alt-border-color, var(--color-neutral-h), var(--color-neutral-s), calc(var(--color-neutral-l) - var(--mg-button-border-variation) * 10%)));background:linear-gradient(to bottom, hsl(var(--color-neutral-h), var(--color-neutral-s), var(--color-neutral-l)), hsl(var(--color-neutral-h), var(--color-neutral-s), calc(var(--color-neutral-l) - var(--mg-button-gradient) * 10%)));color:hsl(var(--color-danger))}:host(:hover) .mg-c-button--danger-alt:not(.mg-c-button--disabled){background:hsl(var(--color-neutral-h), var(--color-neutral-s), var(--color-neutral-l))}.mg-c-button.mg-c-button--info{border-color:hsl(var(--mg-button-info-border-color, var(--color-info-h), var(--color-info-s), calc(var(--color-info-l) - var(--mg-button-border-variation) * 10%)));background:linear-gradient(to bottom, hsl(var(--color-info-h), var(--color-info-s), var(--color-info-l)), hsl(var(--color-info-h), var(--color-info-s), calc(var(--color-info-l) - var(--mg-button-gradient) * 10%)));color:hsl(var(--color-neutral))}:host(:hover) .mg-c-button--info:not(.mg-c-button--disabled){background:hsl(var(--color-info-h), var(--color-info-s), var(--color-info-l))}.mg-c-button.mg-c-button--success{border-color:hsl(var(--mg-button-success-border-color, var(--color-success-h), var(--color-success-s), calc(var(--color-success-l) - var(--mg-button-border-variation) * 10%)));background:linear-gradient(to bottom, hsl(var(--color-success-h), var(--color-success-s), var(--color-success-l)), hsl(var(--color-success-h), var(--color-success-s), calc(var(--color-success-l) - var(--mg-button-gradient) * 10%)));color:hsl(var(--color-dark))}:host(:hover) .mg-c-button--success:not(.mg-c-button--disabled){background:hsl(var(--color-success-h), var(--color-success-s), var(--color-success-l))}.mg-c-button{position:relative;display:inline-flex;min-height:var(--default-size);box-sizing:border-box;align-items:center;padding:calc((var(--default-size) - .2rem - var(--font-size)*var(--line-height))/2) 1.1rem;border-width:var(--mg-button-border-top-width, 0.1rem) var(--mg-button-border-right-width, 0.1rem) var(--mg-button-border-bottom-width, 0.1rem) var(--mg-button-border-left-width, 0.1rem);border-style:solid;border-radius:var(--mg-button-border-radius-top-left, var(--mg-button-border-radius)) var(--mg-button-border-radius-top-right, var(--mg-button-border-radius)) var(--mg-button-border-radius-bottom-right, var(--mg-button-border-radius)) var(--mg-button-border-radius-bottom-left, var(--mg-button-border-radius));background-image:none;column-gap:.6rem;cursor:pointer;touch-action:manipulation;font-family:inherit;font-size:var(--font-size);font-weight:var(--mg-button-font-weight, normal);text-align:left;text-decoration:none}.mg-c-button.mg-c-button--disabled{cursor:default;opacity:var(--mg-button-disabled-opacity)}.mg-c-button.mg-c-button--icon{width:var(--default-size);height:var(--default-size);justify-content:center;padding:0;border-radius:var(--mg-button-border-radius-top-left, var(--mg-button-icon-border-radius)) var(--mg-button-border-radius-top-right, var(--mg-button-icon-border-radius)) var(--mg-button-border-radius-bottom-right, var(--mg-button-icon-border-radius)) var(--mg-button-border-radius-bottom-left, var(--mg-button-icon-border-radius));font-size:var(--font-size);line-height:var(--font-size)}.mg-c-button.mg-c-button--flat{border:none;background:none}.mg-c-button slot,.mg-c-button ::slotted(*:not(mg-icon)){font-family:inherit;font-size:var(--font-size);font-weight:var(--mg-button-font-weight, normal);text-align:left;text-decoration:none;display:flex;align-items:center;column-gap:.6rem}.mg-c-button.mg-c-button--link{min-height:unset;padding:unset;border:unset;border-radius:unset;background:unset;text-decoration:underline}.mg-c-button.mg-c-button--link slot{font-weight:600}.mg-c-button.mg-c-button--link:hover{text-decoration:none}.mg-c-button.mg-c-button--full-width{display:flex;justify-content:center}.mg-c-button mg-icon:only-child,.mg-c-button ::slotted(mg-icon){display:inline-flex;flex-shrink:0;margin:auto 0;line-height:1}.mg-c-button.mg-c-button--loading>mg-icon:first-of-type{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.mg-c-button.mg-c-button--loading .mg-c-button__content{opacity:0}:host(:focus-visible){outline:0}:host(:focus-visible) .mg-c-button{outline-color:-webkit-focus-ring-color;outline-style:auto;outline-width:.2rem}";
+const MgButtonStyle0 = mgButtonCss;
 
 const MgButton = /*@__PURE__*/ proxyCustomElement(class MgButton extends HTMLElement {
     constructor() {
@@ -68,7 +69,7 @@ const MgButton = /*@__PURE__*/ proxyCustomElement(class MgButton extends HTMLEle
         this.isIcon = false;
         this.disableOnClick = false;
         this.loading = false;
-        this.classCollection = new ClassList(['mg-c-button']);
+        this.classCollection = new Fe(['mg-c-button']);
     }
     validateVariant(newValue, oldValue) {
         if (!variants.includes(newValue)) {
@@ -127,7 +128,7 @@ const MgButton = /*@__PURE__*/ proxyCustomElement(class MgButton extends HTMLEle
         this.validateFullWidth(this.fullWidth);
         if (this.isIcon) {
             this.classCollection.add(`mg-c-button--icon`);
-            if (!isValidString(this.label)) {
+            if (!He(this.label)) {
                 throw new Error(`<mg-button> prop "label" is mandatory when prop "isIcon" is set to true.`);
             }
         }
@@ -139,7 +140,7 @@ const MgButton = /*@__PURE__*/ proxyCustomElement(class MgButton extends HTMLEle
      * Add listners
      */
     componentDidLoad() {
-        nextTick(() => {
+        Pe(() => {
             var _a;
             const closestForm = this.element.closest('form') || ((_a = this.element.closest('mg-form')) === null || _a === void 0 ? void 0 : _a.shadowRoot.querySelector('form'));
             // submit buttons should trigger form submition;
@@ -165,7 +166,7 @@ const MgButton = /*@__PURE__*/ proxyCustomElement(class MgButton extends HTMLEle
         "disabled": ["disabledHandler"],
         "loading": ["loadingHandler"]
     }; }
-    static get style() { return mgButtonCss; }
+    static get style() { return MgButtonStyle0; }
 }, [1, "mg-button", {
         "variant": [1],
         "identifier": [1],