@mgdis/mg-components 6.6.1 → 6.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/README.md +1 -1
  2. package/dist/cjs/index-1a5a1081.js +2 -2
  3. package/dist/cjs/{index-019dd5c0.js → index-234e834a.js} +75 -39
  4. package/dist/cjs/index-234e834a.js.map +1 -0
  5. package/dist/cjs/{index.es-903492c5.js → index.es-b90f74d4.js} +2 -2
  6. package/dist/cjs/index.es-b90f74d4.js.map +1 -0
  7. package/dist/cjs/loader.cjs.js +1 -1
  8. package/dist/cjs/{mg-action-more_36.cjs.entry.js → mg-action-more_37.cjs.entry.js} +522 -98
  9. package/dist/cjs/mg-action-more_37.cjs.entry.js.map +1 -0
  10. package/dist/cjs/mg-alert.cjs.entry.js +2 -2
  11. package/dist/cjs/mg-components.cjs.js +1 -1
  12. package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js +2 -2
  13. package/dist/cjs/mg-loader.cjs.entry.js +3 -3
  14. package/dist/cjs/mg-loader.cjs.entry.js.map +1 -1
  15. package/dist/cjs/mg-progress.cjs.entry.js +1 -1
  16. package/dist/collection/assets/icons/index.js +1 -1
  17. package/dist/collection/assets/icons/index.js.map +1 -1
  18. package/dist/collection/collection-manifest.json +1 -0
  19. package/dist/collection/components/atoms/mg-button/mg-button.js +10 -10
  20. package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
  21. package/dist/collection/components/atoms/mg-icon/mg-icon.js +22 -7
  22. package/dist/collection/components/atoms/mg-icon/mg-icon.js.map +1 -1
  23. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +2 -2
  24. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js.map +1 -1
  25. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.conf.js +1 -1
  26. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.conf.js.map +1 -1
  27. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +46 -19
  28. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js.map +1 -1
  29. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +57 -28
  30. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js.map +1 -1
  31. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js +7 -1
  32. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js.map +1 -1
  33. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +44 -13
  34. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js.map +1 -1
  35. package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.js +1 -1
  36. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +1 -1
  37. package/dist/collection/components/molecules/mg-loader/mg-loader.js +1 -1
  38. package/dist/collection/components/molecules/mg-loader/mg-loader.js.map +1 -1
  39. package/dist/collection/components/molecules/mg-popover/mg-popover.js +41 -5
  40. package/dist/collection/components/molecules/mg-popover/mg-popover.js.map +1 -1
  41. package/dist/collection/components/molecules/mg-table/mg-table.conf.js +13 -0
  42. package/dist/collection/components/molecules/mg-table/mg-table.conf.js.map +1 -0
  43. package/dist/collection/components/molecules/mg-table/mg-table.js +364 -0
  44. package/dist/collection/components/molecules/mg-table/mg-table.js.map +1 -0
  45. package/dist/collection/locales/en/messages.json +33 -16
  46. package/dist/collection/locales/fr/messages.json +36 -19
  47. package/dist/collection/utils/floating-ui.utils.js +2 -0
  48. package/dist/collection/utils/floating-ui.utils.js.map +1 -1
  49. package/dist/components/floating-ui.utils.js +5 -3
  50. package/dist/components/floating-ui.utils.js.map +1 -1
  51. package/dist/components/index.es.js +1 -1
  52. package/dist/components/index.es.js.map +1 -1
  53. package/dist/components/index2.js +73 -37
  54. package/dist/components/index2.js.map +1 -1
  55. package/dist/components/mg-button2.js +10 -10
  56. package/dist/components/mg-button2.js.map +1 -1
  57. package/dist/components/mg-icon2.js +22 -7
  58. package/dist/components/mg-icon2.js.map +1 -1
  59. package/dist/components/mg-input-checkbox-paginated2.js +2 -2
  60. package/dist/components/mg-input-checkbox-paginated2.js.map +1 -1
  61. package/dist/components/mg-input-date.js +47 -19
  62. package/dist/components/mg-input-date.js.map +1 -1
  63. package/dist/components/mg-input-numeric.js +58 -29
  64. package/dist/components/mg-input-numeric.js.map +1 -1
  65. package/dist/components/mg-input-text2.js +50 -14
  66. package/dist/components/mg-input-text2.js.map +1 -1
  67. package/dist/components/mg-loader.js +1 -1
  68. package/dist/components/mg-loader.js.map +1 -1
  69. package/dist/components/mg-popover2.js +41 -5
  70. package/dist/components/mg-popover2.js.map +1 -1
  71. package/dist/components/mg-table.d.ts +11 -0
  72. package/dist/components/mg-table.js +320 -0
  73. package/dist/components/mg-table.js.map +1 -0
  74. package/dist/components/mg-tooltip2.js +1 -1
  75. package/dist/esm/index-5059254f.js +2 -2
  76. package/dist/esm/{index-6b7bdd63.js → index-544778a7.js} +75 -39
  77. package/dist/esm/index-544778a7.js.map +1 -0
  78. package/dist/esm/{index.es-b80b758c.js → index.es-517b1bf2.js} +2 -2
  79. package/dist/esm/index.es-517b1bf2.js.map +1 -0
  80. package/dist/esm/loader.js +1 -1
  81. package/dist/esm/{mg-action-more_36.entry.js → mg-action-more_37.entry.js} +522 -99
  82. package/dist/esm/mg-action-more_37.entry.js.map +1 -0
  83. package/dist/esm/mg-alert.entry.js +2 -2
  84. package/dist/esm/mg-components.js +1 -1
  85. package/dist/esm/mg-input-rich-text-editor.entry.js +2 -2
  86. package/dist/esm/mg-loader.entry.js +3 -3
  87. package/dist/esm/mg-loader.entry.js.map +1 -1
  88. package/dist/esm/mg-progress.entry.js +1 -1
  89. package/dist/mg-components/locales/en/messages.json +33 -16
  90. package/dist/mg-components/locales/fr/messages.json +36 -19
  91. package/dist/mg-components/mg-components.esm.js +1 -1
  92. package/dist/mg-components/mg-components.esm.js.map +1 -1
  93. package/dist/mg-components/{p-3c6710be.js → p-12a1edee.js} +2 -2
  94. package/dist/mg-components/p-12a1edee.js.map +1 -0
  95. package/dist/mg-components/p-9bc53279.js +2 -0
  96. package/dist/mg-components/{p-4049bd40.js.map → p-9bc53279.js.map} +1 -1
  97. package/dist/mg-components/{p-c4f37d1f.entry.js → p-ad98f3d8.entry.js} +2 -2
  98. package/dist/mg-components/p-ad98f3d8.entry.js.map +1 -0
  99. package/dist/mg-components/{p-0ae49cc4.entry.js → p-c10433db.entry.js} +2 -2
  100. package/dist/mg-components/{p-17f0b7eb.entry.js → p-c67e4934.entry.js} +2 -2
  101. package/dist/mg-components/p-f72efb64.entry.js +2 -0
  102. package/dist/mg-components/p-f72efb64.entry.js.map +1 -0
  103. package/dist/mg-components/{p-361cc090.entry.js → p-fd4a7980.entry.js} +2 -2
  104. package/dist/types/assets/icons/index.d.ts +4 -0
  105. package/dist/types/components/atoms/mg-button/mg-button.d.ts +1 -1
  106. package/dist/types/components/molecules/inputs/mg-input-date/mg-input-date.conf.d.ts +1 -0
  107. package/dist/types/components/molecules/inputs/mg-input-numeric/mg-input-numeric.d.ts +6 -5
  108. package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.conf.d.ts +4 -2
  109. package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.d.ts +8 -2
  110. package/dist/types/components/molecules/mg-popover/mg-popover.d.ts +14 -0
  111. package/dist/types/components/molecules/mg-table/mg-table.conf.d.ts +19 -0
  112. package/dist/types/components/molecules/mg-table/mg-table.d.ts +58 -0
  113. package/dist/types/components.d.ts +39 -0
  114. package/dist/types/utils/floating-ui.utils.d.ts +1 -0
  115. package/ide/intellij/web-types.json +79 -15
  116. package/ide/vscode/html-custom-data.json +112 -4
  117. package/package.json +26 -24
  118. package/dist/cjs/index-019dd5c0.js.map +0 -1
  119. package/dist/cjs/index.es-903492c5.js.map +0 -1
  120. package/dist/cjs/mg-action-more_36.cjs.entry.js.map +0 -1
  121. package/dist/esm/index-6b7bdd63.js.map +0 -1
  122. package/dist/esm/index.es-b80b758c.js.map +0 -1
  123. package/dist/esm/mg-action-more_36.entry.js.map +0 -1
  124. package/dist/mg-components/p-3c6710be.js.map +0 -1
  125. package/dist/mg-components/p-4049bd40.js +0 -2
  126. package/dist/mg-components/p-8dbb78aa.entry.js +0 -2
  127. package/dist/mg-components/p-8dbb78aa.entry.js.map +0 -1
  128. package/dist/mg-components/p-c4f37d1f.entry.js.map +0 -1
  129. /package/dist/mg-components/{p-0ae49cc4.entry.js.map → p-c10433db.entry.js.map} +0 -0
  130. /package/dist/mg-components/{p-17f0b7eb.entry.js.map → p-c67e4934.entry.js.map} +0 -0
  131. /package/dist/mg-components/{p-361cc090.entry.js.map → p-fd4a7980.entry.js.map} +0 -0
@@ -1 +1 @@
1
- {"file":"mg-input-numeric.js","mappings":"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","names":["MgInputNumeric","ClassList","localeNumber","localeCurrency","localePercent","localeUnit","toString","isValidString"],"sources":["src/components/molecules/inputs/mg-input-numeric/mg-input-numeric.conf.ts","../styles/dist/components/mg-input-numeric.css?tag=mg-input-numeric&encapsulation=shadow","src/components/molecules/inputs/mg-input-numeric/mg-input-numeric.tsx"],"sourcesContent":["import type { InputError } from '../../../../types';\n\n/**\n * List of all possibles types\n */\nexport const types = ['decimal', 'integer'] as const;\n\nexport type NumericType = (typeof types)[number];\n\nexport const formats = ['none', 'number', 'currency', 'percent', 'unit'] as const;\n\nexport type Format = (typeof formats)[number];\n\nexport type InputNumericError = InputError & ('min' | 'max' | 'minMax' | 'required');\n",".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left: 0;--mg-c-button-border-radius-bottom-left: 0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right: 0;--mg-c-button-border-radius-bottom-right: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right: var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right: var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}/*# sourceMappingURL=mg-input-numeric.css.map */\n","import { Component, Element, Event, h, Prop, EventEmitter, State, Watch, Method } from '@stencil/core';\nimport { ClassList, isValidString, localeCurrency, localeNumber, localePercent, localeUnit, toString } from '@mgdis/stencil-helpers';\nimport { types, type InputNumericError, type NumericType, type Format, formats } from './mg-input-numeric.conf';\nimport { type TooltipPosition, type Width, type EventType, classReadonly, classDisabled, widths } from '../mg-input/mg-input.conf';\nimport { initLocales } from '../../../../locales/';\n\n/**\n * @slot append-input - Content to display next to the input\n */\n@Component({\n tag: 'mg-input-numeric',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-numeric.css',\n shadow: true,\n})\nexport class MgInputNumeric {\n /************\n * Internal *\n ************/\n\n // Manage different values\n private storedValue: string;\n private numericValue: number;\n private readonlyValue: string;\n private slotContent: string;\n\n // HTML selector\n private input: HTMLInputElement;\n\n // Locales\n private locale: string;\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n private handlerInProgress: EventType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputNumericElement;\n\n /**\n * Component value\n */\n @Prop({ mutable: true, reflect: true }) value: string;\n @Watch('value')\n validateValue(newValue: MgInputNumeric['value']): void {\n // has input value is always render as string we get a stringified value or a '' for nullish value, so we test string type\n if (typeof newValue === 'string') {\n // Split number and decimal\n const [integer, decimal = ''] = newValue.replace('-', '').split(/[.,]/);\n // Regex\n const regex = this.type === 'integer' ? /^-?\\d+$/ : /^-?\\d+(?:[.,]\\d*)?$/;\n // Filter input\n if (this.isValidValue(newValue, regex, integer, decimal)) {\n this.storedValue = newValue;\n } else {\n newValue = this.handleInvalidValue();\n }\n // Set value and input value\n this.updateValues(newValue);\n }\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n\n /**\n * Input name\n * If not set the value equals the identifier\n */\n @Prop() name: string = this.identifier;\n\n /**\n * Input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop?: boolean;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Input placeholder.\n * It should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n */\n @Prop() placeholder?: string;\n\n /**\n * Define if input is required\n */\n @Prop() required = false;\n\n /**\n * Define if input is readonly\n */\n @Prop() readonly = false;\n @Watch('readonly')\n watchReadonly(newValue: MgInputNumeric['readonly']): void {\n if (newValue) this.classCollection.add(classReadonly);\n else this.classCollection.delete(classReadonly);\n }\n\n /**\n * Maximum value\n */\n @Prop() max?: number;\n\n /**\n * Minimum value\n */\n @Prop() min?: number;\n\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n @Watch('min')\n @Watch('max')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (this.input !== undefined) {\n this.input[prop] = newValue;\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n this.hasDisplayedError = false;\n }\n }\n }\n\n @Watch('disabled')\n watchDisabled(newValue: MgInputNumeric['disabled']): void {\n if (newValue) this.classCollection.add(classDisabled);\n else this.classCollection.delete(classDisabled);\n }\n\n /**\n * Define input width\n */\n @Prop() mgWidth?: Width;\n @Watch('mgWidth')\n watchMgWidth(newValue: MgInputNumeric['mgWidth']): void {\n // reset width class\n widths.forEach(width => {\n this.classCollection.delete(`mg-c-input--width-${width}`);\n });\n\n // apply new width\n if (newValue !== undefined) this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText?: string;\n\n /**\n * Define numeric type\n */\n @Prop() type: NumericType = 'decimal';\n @Watch('type')\n validateType(newValue: MgInputNumeric['type']): void {\n if (!types.includes(newValue)) {\n throw new Error(`<mg-input-numeric> prop \"type\" must be one of: ${types.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Set local formatting.\n * Numbers are formatted based on the locale.\n */\n @Prop() format: Format = 'number';\n @Watch('format')\n watchFormat(newValue: MgInputNumeric['format']): void {\n if (!formats.includes(newValue)) {\n throw new Error(`<mg-input-numeric> prop \"format\" must be one of: ${formats.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define currency\n */\n @Prop() currency = 'EUR';\n\n /**\n * Define unit symbol (km, L, etc.)\n */\n @Prop() unit?: Intl.NumberFormatOptions['unit'];\n\n /**\n * Define unit display format ('short', 'long', 'narrow')\n */\n @Prop() unitDisplay: Intl.NumberFormatOptions['unitDisplay'] = 'short';\n\n /**\n * Override integer length\n * integer is the number before the decimal point\n */\n @Prop() integerLength = 13;\n @Watch('integerLength')\n validateIntegerLength(newValue: MgInputNumeric['integerLength']): void {\n if (newValue < 1) {\n throw new Error(`<mg-input-numeric> prop \"integer-length\" must be a positive number. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Override decimal length\n * decimal is the number after the decimal point\n */\n @Prop() decimalLength = 2;\n @Watch('decimalLength')\n validateDecimalLength(newValue: MgInputNumeric['decimalLength']): void {\n if (newValue < 1) {\n throw new Error(`<mg-input-numeric> prop \"decimal-length\" must be a positive number, consider using prop \"type\" to \"integer\" instead. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define input pattern to validate\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input pattern error message\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-input--numeric']);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Define if input has focus\n */\n @State() hasFocus: boolean;\n\n /**\n * Emited event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<number>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<HTMLMgInputNumericElement['valid']>;\n\n /**\n * Display input error if it exists.\n */\n @Method()\n displayError(): Promise<void> {\n // Use `Promise` as requested for stencil method\n // Use `requestAnimationFrame` to ensure:\n // - DOM is fully updated before validation\n // - Async operations are completed\n // - No timing issues with Stencil's render cycle\n // - Keep everything in sync both inside and outside the component\n return new Promise(resolve => {\n requestAnimationFrame(() => {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n resolve();\n });\n });\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputNumeric['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-numeric> method \"setError()\" param \"valid\" must be a boolean.');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-numeric> method \"setError()\" param \"errorMessage\" must be a string.');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Reset value, validity and error state\n */\n @Method()\n async reset(): Promise<void> {\n if (!this.readonly) {\n this.value = '';\n this.checkValidity();\n this.errorMessage = undefined;\n this.hasDisplayedError = false;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputNumeric['valid']) {\n const oldValidValue = this.valid;\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) this.inputValid.emit(this.valid);\n }\n\n /**\n * Checks if the given value is valid according to the defined rules.\n * @param value - The input value to validate.\n * @param regex - The regular expression for validation.\n * @param integer - The integer part of the value.\n * @param decimal - The decimal part of the value.\n * @returns Returns true if the value is valid, otherwise false.\n */\n private isValidValue(value: string, regex: RegExp, integer: string, decimal: string): boolean {\n return (\n ['', '-'].includes(value) || (regex.exec(value) !== null && integer.length <= this.integerLength && decimal.length <= (this.type === 'integer' ? 0 : this.decimalLength))\n );\n }\n\n /**\n * Handles invalid input values and returns a corrected value.\n * @returns The corrected value.\n */\n private handleInvalidValue(): string | null {\n return this.storedValue ?? null;\n }\n\n /**\n * Updates the component values based on the validated input value.\n * @param newValue - The validated input value.\n */\n private updateValues(newValue: string | null): void {\n this.value = newValue;\n if (this.input !== undefined) this.input.value = this.value;\n\n this.numericValue = !['', null].includes(this.value) ? parseFloat(this.value.replace(',', '.')) : null;\n this.valueChange.emit(this.numericValue);\n\n this.readonlyValue = this.numericValue !== null ? this.formatValue(this.numericValue) : '';\n }\n\n /**\n * Displayed value in input\n * Change on focus/blur\n * @returns display value\n */\n private displayValue(): MgInputNumeric['value'] | MgInputNumeric['readonlyValue'] {\n return this.hasFocus ? this.value : this.readonlyValue;\n }\n\n /**\n * Handle input event\n */\n private handleInput = (): void => {\n // Check validity\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n }\n this.value = this.input.value;\n };\n\n /**\n * Handle focus event\n */\n private handleFocus = (): void => {\n this.hasFocus = true;\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n if (this.value === '-') this.value = '';\n // Display Error\n this.handlerInProgress = 'blur';\n this.displayError().finally(() => {\n // reset guard\n this.handlerInProgress = undefined;\n this.hasFocus = false;\n });\n };\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || this.getInputError() === null);\n };\n\n /**\n * Format min/max value for error message\n * @param value - value to format\n * @returns formatted value according to locale\n */\n private formatErrorValue = (value: number): string => localeNumber(value, this.locale, !Number.isInteger(value) && this.type === 'decimal' ? this.decimalLength : 0);\n\n /**\n * Set input error message\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n if (!this.valid) {\n const inputError = this.getInputError();\n if (errorMessage !== undefined) {\n this.errorMessage = errorMessage;\n } else if (inputError === 'required') {\n this.errorMessage = this.messages.errors[inputError];\n } else {\n const formattedMin = this.formatErrorValue(this.min);\n const formattedMax = this.formatErrorValue(this.max);\n this.errorMessage = this.messages.errors.numeric[inputError].replace('{min}', formattedMin).replace('{max}', formattedMax);\n }\n }\n };\n\n /**\n * Get input error code\n * @returns error code\n */\n private getInputError = (): null | InputNumericError => {\n let inputError: InputNumericError = null;\n const hasNotEmptyValues = (toControl: number[]) => !toControl.some(value => [null, undefined].includes(value));\n\n // required\n if (!this.input.checkValidity() && this.input.validity.valueMissing) {\n inputError = 'required';\n }\n // Min & Max\n else if (hasNotEmptyValues([this.min, this.numericValue]) && this.numericValue < this.min && this.max === undefined) {\n // Only a min value is set\n inputError = 'min';\n } else if (hasNotEmptyValues([this.max, this.numericValue]) && this.numericValue > this.max && this.min === undefined) {\n // Only a max value is set\n inputError = 'max';\n } else if (hasNotEmptyValues([this.min, this.max, this.numericValue]) && (this.numericValue < this.min || this.numericValue > this.max)) {\n // both min and max values are set\n inputError = 'minMax';\n }\n return inputError;\n };\n\n /**\n * Format value based on type\n * @param value - value to format\n * @returns formated local value\n */\n private formatValue = (value: number): string => {\n switch (this.format) {\n case 'number':\n return localeNumber(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);\n case 'currency':\n return localeCurrency(value, this.locale, this.currency);\n case 'percent':\n return localePercent(value / 100, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);\n case 'unit':\n return localeUnit(value, this.locale, this.unit, this.unitDisplay, this.type === 'decimal' ? this.decimalLength : undefined);\n case 'none':\n return value.toString();\n }\n };\n\n /**\n * Validate append slot\n */\n private validateAppendSlot = (): void => {\n const slotAppendInput: HTMLSlotElement = this.element.querySelector('[slot=\"append-input\"]');\n if (slotAppendInput !== null) {\n if (slotAppendInput.nodeName === 'MG-BUTTON') {\n this.classCollection.add('mg-c-input--is-input-group-append');\n } else {\n this.classCollection.add('mg-c-input--is-append-input-slot-content');\n this.slotContent = slotAppendInput.textContent;\n }\n }\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n const locales = initLocales(this.element);\n this.locale = locales.locale;\n this.messages = locales.messages;\n // Validate component config\n this.watchFormat(this.format);\n this.validateType(this.type);\n this.validateIntegerLength(this.integerLength);\n this.validateDecimalLength(this.decimalLength);\n // validate value\n this.validateValue(this.value);\n this.validateAppendSlot();\n this.watchReadonly(this.readonly);\n this.watchDisabled(this.disabled);\n this.watchMgWidth(this.mgWidth);\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * Renders the readonly content of the input component.\n * @returns The readonly content element.\n */\n private renderReadonly = (): HTMLElement => {\n return this.slotContent !== undefined ? (\n <span class=\"mg-c-input__readonly-value\">\n <b>{this.readonlyValue}</b>\n {this.slotContent}\n </span>\n ) : (\n <b class=\"mg-c-input__readonly-value\">{this.readonlyValue}</b>\n );\n };\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-input\n label={this.label}\n identifier={this.identifier}\n class={this.classCollection.join()}\n ariaDescribedbyIDs={[]}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={this.required}\n tooltip={this.tooltip}\n tooltipPosition={this.readonly && this.value === undefined ? 'label' : this.tooltipPosition}\n helpText={this.helpText}\n errorMessage={this.errorMessage}\n >\n {this.readonly\n ? this.readonlyValue && this.renderReadonly()\n : [\n <input\n key=\"input\"\n type=\"text\"\n class=\"mg-c-input__box mg-c-input__box--width\"\n value={this.displayValue()}\n id={this.identifier}\n name={this.name}\n placeholder={this.placeholder}\n title={this.placeholder}\n disabled={this.disabled}\n required={this.required}\n autocomplete=\"off\"\n aria-invalid={(this.invalid === true).toString()}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={(el: HTMLInputElement) => {\n if (el !== null) this.input = el;\n }}\n />,\n <slot key=\"slot\" name=\"append-input\"></slot>,\n ]}\n </mg-input>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-input-numeric.js","mappings":"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","names":["MgInputNumeric","ClassList","localeNumber","localeCurrency","localePercent","localeUnit","isValidString","toString"],"sources":["src/components/molecules/inputs/mg-input-numeric/mg-input-numeric.conf.ts","../styles/dist/components/mg-input-numeric.css?tag=mg-input-numeric&encapsulation=shadow","src/components/molecules/inputs/mg-input-numeric/mg-input-numeric.tsx"],"sourcesContent":["import type { InputError } from '../../../../types';\n\n/**\n * List of all possibles types\n */\nexport const types = ['decimal', 'integer'] as const;\n\nexport type NumericType = (typeof types)[number];\n\nexport const formats = ['none', 'number', 'currency', 'percent', 'unit'] as const;\n\nexport type Format = (typeof formats)[number];\n\nexport type InputNumericError = InputError & ('min' | 'max' | 'minMax' | 'required');\n",".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left: 0;--mg-c-button-border-radius-bottom-left: 0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right: 0;--mg-c-button-border-radius-bottom-right: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right: var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right: var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}/*# sourceMappingURL=mg-input-numeric.css.map */\n","import { Component, Element, Event, h, Prop, EventEmitter, State, Watch, Method } from '@stencil/core';\nimport { ClassList, isValidString, localeCurrency, localeNumber, localePercent, localeUnit, toString } from '@mgdis/stencil-helpers';\nimport { types, type InputNumericError, type NumericType, type Format, formats } from './mg-input-numeric.conf';\nimport { type TooltipPosition, type Width, type EventType, classReadonly, classDisabled, widths } from '../mg-input/mg-input.conf';\nimport { initLocales } from '../../../../locales/';\n\n/**\n * @slot append-input - Content to display next to the input\n */\n@Component({\n tag: 'mg-input-numeric',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-numeric.css',\n shadow: true,\n})\nexport class MgInputNumeric {\n /************\n * Internal *\n ************/\n\n // Manage different values\n private storedValue: string;\n private numericValue: number;\n private readonlyValue: string;\n private slotContent: string;\n\n // HTML selector\n private input: HTMLInputElement;\n\n // Locales\n private locale: string;\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n private handlerInProgress: EventType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputNumericElement;\n\n /**\n * Component value\n */\n @Prop({ mutable: true, reflect: true }) value: string;\n @Watch('value')\n validateValue(newValue: MgInputNumeric['value']): void {\n // has input value is always render as string we get a stringified value or a '' for nullish value, so we test string type\n if (typeof newValue === 'string') {\n // Split number and decimal\n const [integer, decimal = ''] = newValue.replace('-', '').split(/[.,]/);\n // Regex\n const regex = this.type === 'integer' ? /^(?!-?0\\d)-?\\d+$/ : /^(?!-?0\\d)-?\\d+(?:[.,]\\d*)?$/;\n // Filter input\n if (this.isValidValue(newValue, regex, integer, decimal)) {\n this.storedValue = newValue;\n } else {\n newValue = this.storedValue ?? null;\n }\n // Set value and input value\n this.updateValues(newValue);\n }\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n\n /**\n * Input name\n * If not set the value equals the identifier\n */\n @Prop() name: string = this.identifier;\n\n /**\n * Input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop?: boolean;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Input placeholder.\n * It should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n */\n @Prop() placeholder?: string;\n\n /**\n * Define if input is required\n */\n @Prop() required = false;\n\n /**\n * Define if input is readonly\n */\n @Prop() readonly = false;\n @Watch('readonly')\n watchReadonly(newValue: MgInputNumeric['readonly']): void {\n if (newValue) this.classCollection.add(classReadonly);\n else this.classCollection.delete(classReadonly);\n }\n\n /**\n * Maximum value\n */\n @Prop() max?: number;\n\n /**\n * Minimum value\n */\n @Prop() min?: number;\n\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n @Watch('min')\n @Watch('max')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (this.input !== undefined) {\n this.input[prop] = newValue;\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n this.hasDisplayedError = false;\n }\n }\n }\n\n @Watch('disabled')\n watchDisabled(newValue: MgInputNumeric['disabled']): void {\n if (newValue) this.classCollection.add(classDisabled);\n else this.classCollection.delete(classDisabled);\n }\n\n /**\n * Define input width\n */\n @Prop() mgWidth?: Width;\n @Watch('mgWidth')\n watchMgWidth(newValue: MgInputNumeric['mgWidth']): void {\n // reset width class\n widths.forEach(width => {\n this.classCollection.delete(`mg-c-input--width-${width}`);\n });\n\n // apply new width\n if (newValue !== undefined) this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText?: string;\n\n /**\n * Define numeric type\n */\n @Prop() type: NumericType = 'decimal';\n @Watch('type')\n validateType(newValue: MgInputNumeric['type']): void {\n if (!types.includes(newValue)) {\n throw new Error(`<mg-input-numeric> prop \"type\" must be one of: ${types.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Set local formatting.\n * Numbers are formatted based on the locale.\n */\n @Prop() format: Format = 'number';\n @Watch('format')\n watchFormat(newValue: MgInputNumeric['format']): void {\n if (!formats.includes(newValue)) {\n throw new Error(`<mg-input-numeric> prop \"format\" must be one of: ${formats.join(', ')}. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define currency\n */\n @Prop() currency = 'EUR';\n\n /**\n * Define unit symbol (km, L, etc.)\n */\n @Prop() unit?: Intl.NumberFormatOptions['unit'];\n\n /**\n * Define unit display format ('short', 'long', 'narrow')\n */\n @Prop() unitDisplay: Intl.NumberFormatOptions['unitDisplay'] = 'short';\n\n /**\n * Override integer length\n * integer is the number before the decimal point\n */\n @Prop() integerLength = 13;\n @Watch('integerLength')\n validateIntegerLength(newValue: MgInputNumeric['integerLength']): void {\n if (newValue < 1) {\n throw new Error(`<mg-input-numeric> prop \"integer-length\" must be a positive number. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Override decimal length\n * decimal is the number after the decimal point\n */\n @Prop() decimalLength = 2;\n @Watch('decimalLength')\n validateDecimalLength(newValue: MgInputNumeric['decimalLength']): void {\n if (newValue < 1) {\n throw new Error(`<mg-input-numeric> prop \"decimal-length\" must be a positive number, consider using prop \"type\" to \"integer\" instead. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Define input pattern to validate\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input pattern error message\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-input--numeric']);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Define if input has focus\n */\n @State() hasFocus: boolean;\n\n /**\n * Emited event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<number>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<HTMLMgInputNumericElement['valid']>;\n\n /**\n * Display input error if it exists.\n */\n @Method()\n displayError(): Promise<void> {\n // Use `Promise` as requested for stencil method\n // Use `requestAnimationFrame` to ensure:\n // - DOM is fully updated before validation\n // - Async operations are completed\n // - No timing issues with Stencil's render cycle\n // - Keep everything in sync both inside and outside the component\n return new Promise(resolve => {\n requestAnimationFrame(() => {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n resolve();\n });\n });\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputNumeric['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-numeric> method \"setError()\" param \"valid\" must be a boolean.');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-numeric> method \"setError()\" param \"errorMessage\" must be a string.');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Reset value, validity and error state\n */\n @Method()\n async reset(): Promise<void> {\n if (!this.readonly) {\n this.value = '';\n this.checkValidity();\n this.errorMessage = undefined;\n this.hasDisplayedError = false;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputNumeric['valid']) {\n const oldValidValue = this.valid;\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) this.inputValid.emit(this.valid);\n }\n\n /**\n * Checks if the given value is valid according to the defined rules.\n * @param value - The input value to validate.\n * @param regex - The regular expression for validation.\n * @param integer - The integer part of the value.\n * @param decimal - The decimal part of the value.\n * @returns Returns true if the value is valid, otherwise false.\n */\n private isValidValue(value: string, regex: RegExp, integer: string, decimal: string): boolean {\n return (\n ['', '-'].includes(value) || (regex.exec(value) !== null && integer.length <= this.integerLength && decimal.length <= (this.type === 'integer' ? 0 : this.decimalLength))\n );\n }\n\n /**\n * Updates the component values based on the validated input value.\n * @param newValue - The validated input value.\n */\n private updateValues(newValue: string | null): void {\n this.value = newValue;\n\n if (this.input !== undefined) {\n this.input.value = this.value;\n }\n\n this.numericValue = !['', null].includes(this.value) && !isNaN(parseFloat(this.value)) ? parseFloat(this.value.replace(',', '.')) : null;\n\n if (newValue === null || (newValue === this.storedValue && !Object.is(this.numericValue, -0))) {\n this.valueChange.emit(this.numericValue);\n }\n\n this.readonlyValue = this.numericValue !== null ? this.formatValue(this.numericValue) : '';\n }\n\n /**\n * Displayed value in input\n * Change on focus/blur\n * @returns display value\n */\n private displayValue(): MgInputNumeric['value'] | MgInputNumeric['readonlyValue'] {\n return this.hasFocus ? this.value : this.readonlyValue;\n }\n\n /**\n * Handle input event\n */\n private handleInput = (): void => {\n // Check validity\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n }\n this.value = this.input.value;\n };\n\n /**\n * Handle focus event\n */\n private handleFocus = (): void => {\n this.hasFocus = true;\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n if (this.value === '-') this.value = '';\n // Display Error\n this.handlerInProgress = 'blur';\n this.displayError().finally(() => {\n // reset guard\n this.handlerInProgress = undefined;\n this.hasFocus = false;\n });\n };\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || this.getInputError() === null);\n };\n\n /**\n * Format min/max value for error message\n * @param value - value to format\n * @returns formatted value according to locale\n */\n private formatErrorValue = (value: number): string => localeNumber(value, this.locale, !Number.isInteger(value) && this.type === 'decimal' ? this.decimalLength : 0);\n\n /**\n * Set input error message\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n if (!this.valid) {\n const inputError = this.getInputError();\n if (errorMessage !== undefined) {\n this.errorMessage = errorMessage;\n } else if (inputError === 'required') {\n this.errorMessage = this.messages.errors[inputError];\n } else {\n const formattedMin = this.formatErrorValue(this.min);\n const formattedMax = this.formatErrorValue(this.max);\n this.errorMessage = this.messages.input.numeric.helpText[inputError].replace('{min}', formattedMin).replace('{max}', formattedMax);\n }\n }\n };\n\n /**\n * Get input error code\n * @returns error code\n */\n private getInputError = (): null | InputNumericError => {\n const hasNotEmptyValues = (toControl: number[]) => !toControl.some(value => [null, undefined].includes(value));\n\n // required\n if (!this.input.checkValidity() && this.input.validity.valueMissing) {\n return 'required';\n }\n\n // Only a min value is set\n if (hasNotEmptyValues([this.min, this.numericValue]) && this.numericValue < this.min && this.max === undefined) {\n return 'min';\n }\n\n // Only a max value is set\n if (hasNotEmptyValues([this.max, this.numericValue]) && this.numericValue > this.max && this.min === undefined) {\n return 'max';\n }\n\n // both min and max values are set\n if (hasNotEmptyValues([this.min, this.max, this.numericValue]) && (this.numericValue < this.min || this.numericValue > this.max)) {\n return 'minMax';\n }\n\n return null;\n };\n\n /**\n * Format value based on type\n * @param value - value to format\n * @returns formated local value\n */\n private formatValue = (value: number): string => {\n switch (this.format) {\n case 'number':\n return localeNumber(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);\n case 'currency':\n return localeCurrency(value, this.locale, this.currency);\n case 'percent':\n return localePercent(value / 100, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);\n case 'unit':\n return localeUnit(value, this.locale, this.unit, this.unitDisplay, this.type === 'decimal' ? this.decimalLength : undefined);\n case 'none':\n return value.toString();\n }\n };\n\n /**\n * Validate append slot\n */\n private validateAppendSlot = (): void => {\n const slotAppendInput: HTMLSlotElement = this.element.querySelector('[slot=\"append-input\"]');\n if (slotAppendInput !== null) {\n if (slotAppendInput.nodeName === 'MG-BUTTON') {\n this.classCollection.add('mg-c-input--is-input-group-append');\n } else {\n this.classCollection.add('mg-c-input--is-append-input-slot-content');\n this.slotContent = slotAppendInput.textContent;\n }\n }\n };\n\n /**\n * Format help text to display\n * @param helpText - help text format\n * @returns formatted help text with range information if applicable\n */\n private formatHelpText = (helpText: string): string => {\n // If the component is in readonly mode, return undefined because the message will not be rendered\n if (this.readonly) {\n return undefined;\n }\n\n // If a custom helpText is provided, store it but don't return it directly\n const text = isValidString(helpText) ? helpText : undefined;\n\n // If neither min nor max are defined, and there's no custom helpText,\n // we can return undefined as there's no message to display\n if (this.min === undefined && this.max === undefined && text === undefined) {\n return undefined;\n }\n\n // Generate range message based on available constraints\n let rangeMessage: string;\n if (this.min !== undefined && this.max !== undefined) {\n rangeMessage = this.messages.input.numeric.helpText.minMax.replace('{min}', this.formatErrorValue(this.min)).replace('{max}', this.formatErrorValue(this.max));\n } else if (this.min !== undefined) {\n rangeMessage = this.messages.input.numeric.helpText.min.replace('{min}', this.formatErrorValue(this.min));\n } else if (this.max !== undefined) {\n rangeMessage = this.messages.input.numeric.helpText.max.replace('{max}', this.formatErrorValue(this.max));\n }\n\n // Combine custom helpText with range message if both exist\n if (text !== undefined && rangeMessage !== undefined) {\n return `${text}<br>${rangeMessage}`;\n }\n\n // Return either custom helpText or range message\n return text || rangeMessage;\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n const locales = initLocales(this.element);\n this.locale = locales.locale;\n this.messages = locales.messages;\n // Validate component config\n this.watchFormat(this.format);\n this.validateType(this.type);\n this.validateIntegerLength(this.integerLength);\n this.validateDecimalLength(this.decimalLength);\n // validate value\n this.validateValue(this.value);\n this.validateAppendSlot();\n this.watchReadonly(this.readonly);\n this.watchDisabled(this.disabled);\n this.watchMgWidth(this.mgWidth);\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * Renders the readonly content of the input component.\n * @returns The readonly content element.\n */\n private renderReadonly = (): HTMLElement => {\n return this.slotContent !== undefined ? (\n <span class=\"mg-c-input__readonly-value\">\n <b>{this.readonlyValue}</b>\n {this.slotContent}\n </span>\n ) : (\n <b class=\"mg-c-input__readonly-value\">{this.readonlyValue}</b>\n );\n };\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-input\n label={this.label}\n identifier={this.identifier}\n class={this.classCollection.join()}\n ariaDescribedbyIDs={[]}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={this.required}\n tooltip={this.tooltip}\n tooltipPosition={this.readonly && this.value === undefined ? 'label' : this.tooltipPosition}\n helpText={this.formatHelpText(this.helpText)}\n errorMessage={this.errorMessage}\n >\n {this.readonly\n ? this.readonlyValue && this.renderReadonly()\n : [\n <input\n key=\"input\"\n type=\"text\"\n class=\"mg-c-input__box mg-c-input__box--width\"\n value={this.displayValue()}\n id={this.identifier}\n name={this.name}\n placeholder={this.placeholder}\n title={this.placeholder}\n disabled={this.disabled}\n required={this.required}\n autocomplete=\"off\"\n aria-invalid={(this.invalid === true).toString()}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={(el: HTMLInputElement) => {\n if (el !== null) this.input = el;\n }}\n />,\n <slot key=\"slot\" name=\"append-input\"></slot>,\n ]}\n </mg-input>\n );\n }\n}\n"],"version":3}
@@ -1,5 +1,5 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
- import { Z as Ze, J as Je, V as Ve, m as me } from './index.es.js';
2
+ import { Z as Ze, m as me, J as Je, V as Ve } from './index.es.js';
3
3
  import { d as defineCustomElement$4, b as classReadonly, e as classDisabled, w as widths } from './mg-input2.js';
4
4
  import { i as initLocales } from './index2.js';
5
5
  import { d as defineCustomElement$6 } from './mg-character-left2.js';
@@ -8,6 +8,14 @@ import { d as defineCustomElement$3 } from './mg-input-title2.js';
8
8
  import { d as defineCustomElement$2 } from './mg-tooltip2.js';
9
9
  import { d as defineCustomElement$1 } from './mg-tooltip-content2.js';
10
10
 
11
+ /**
12
+ * TextType from text types
13
+ */
14
+ // Define possible text types with help text
15
+ const helpTextTypes = ['email', 'emails', 'url'];
16
+ // Define possible text types
17
+ const textTypes = ['text', 'search', 'tel', ...helpTextTypes];
18
+
11
19
  const mgInputTextCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__with-character-left{position:relative;width:100%}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left .mg-c-input__box{padding-right:max(var(--mg-c-character-left-message-length)*(.35ch + .3rem) + var(--mg-b-size-16)*clamp(0,var(--mg-c-character-left-message-length),1),var(--mg-b-size-8))}.mg-c-input__with-character-left mg-character-left{position:absolute;top:50%;right:var(--mg-b-size-8);display:none;font-size:var(--mg-b-font-size-small);opacity:.6;transform:translateY(-50%)}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{display:block}.mg-c-input.mg-c-input--readonly b{min-height:var(--mg-b-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}";
12
20
  const MgInputTextStyle0 = mgInputTextCss;
13
21
 
@@ -86,6 +94,16 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
86
94
  * Component classes
87
95
  */
88
96
  this.classCollection = new Ze(['mg-c-input--text']);
97
+ /**
98
+ * Validate pattern configuration
99
+ */
100
+ this.validatePattern = () => {
101
+ if ((this.pattern !== undefined || this.patternErrorMessage !== undefined) && // At least one is defined
102
+ (!me(this.pattern) || (!helpTextTypes.includes(this.type) && !me(this.patternErrorMessage))) // Both must be defined
103
+ ) {
104
+ throw new Error(`<mg-input-text> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${this.pattern}'" and "patternErrorMessage='${this.patternErrorMessage}'".`);
105
+ }
106
+ };
89
107
  /**
90
108
  * Handle input event
91
109
  */
@@ -128,15 +146,20 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
128
146
  * @param errorMessage - errorMessage override
129
147
  */
130
148
  this.setErrorMessage = (errorMessage) => {
149
+ var _a;
131
150
  // Set error message
132
151
  this.errorMessage = undefined;
133
152
  // Does have a custom error message
134
153
  if (!this.valid && errorMessage !== undefined) {
135
154
  this.errorMessage = errorMessage;
136
155
  }
156
+ // Does not match type (email, emails, tel, url, etc.)
157
+ else if (!this.valid && this.input.validity.typeMismatch) {
158
+ this.errorMessage = `${this.messages.input.text.errors.typeMismatch} ${this.messages.input.text.helpText[this.type]}`;
159
+ }
137
160
  // Does not match pattern
138
161
  else if (!this.valid && this.input.validity.patternMismatch) {
139
- this.errorMessage = this.patternErrorMessage;
162
+ this.errorMessage = (_a = this.patternErrorMessage) !== null && _a !== void 0 ? _a : `${this.messages.input.text.errors.typeMismatch} ${this.messages.input.text.helpText[this.type]}`;
140
163
  }
141
164
  // required
142
165
  else if (!this.valid && this.input.validity.valueMissing) {
@@ -184,6 +207,11 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
184
207
  this.valueChange.emit(newValue);
185
208
  }
186
209
  }
210
+ validateType(newValue) {
211
+ if (!textTypes.includes(newValue)) {
212
+ throw new Error(`<mg-input-text> prop "type" must be one of the following values: ${textTypes.join(', ')}. Passed value: ${newValue}.`);
213
+ }
214
+ }
187
215
  validateIcon(newValue) {
188
216
  if (newValue !== undefined) {
189
217
  this.classCollection.add(this.classHasIcon);
@@ -228,9 +256,12 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
228
256
  if (newValue !== undefined)
229
257
  this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);
230
258
  }
231
- validatePattern(newValue) {
232
- if (newValue !== undefined && !(me(this.pattern) && me(this.patternErrorMessage))) {
233
- throw new Error(`<mg-input-text> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${Ve(this.pattern)}'" and "patternErrorMessage='${Ve(this.patternErrorMessage)}'".`);
259
+ watchPattern() {
260
+ this.validatePattern();
261
+ }
262
+ watchHelpText(newValue) {
263
+ if (!me(newValue) && helpTextTypes.includes(this.type)) {
264
+ this.helpText = this.messages.input.text.helpText[this.type];
234
265
  }
235
266
  }
236
267
  /**
@@ -317,12 +348,13 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
317
348
  // Validate
318
349
  this.validateIcon(this.icon);
319
350
  this.validateDatalistoptions(this.datalistoptions);
320
- this.validatePattern(this.pattern);
321
- this.validatePattern(this.patternErrorMessage);
351
+ this.watchPattern();
322
352
  this.validateAppendSlot();
323
353
  this.watchMgWidth(this.mgWidth);
324
354
  this.watchReadonly(this.readonly);
325
355
  this.watchDisabled(this.disabled);
356
+ this.validateType(this.type);
357
+ this.watchHelpText(this.helpText);
326
358
  // Check validity when component is ready
327
359
  // return a promise to process action only in the FIRST render().
328
360
  // https://stenciljs.com/docs/component-lifecycle#componentwillload
@@ -335,12 +367,12 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
335
367
  * @returns HTML Element
336
368
  */
337
369
  render() {
338
- return (h("mg-input", { key: '3677b48b65765727f36e9379af1282d5a8f3762c', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly
370
+ return (h("mg-input", { key: '388b69180071e34fa5ed51643126f5df43e14a7e', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly
339
371
  ? this.value && this.renderReadonly()
340
372
  : [
341
373
  h("div", { key: "input", class: "mg-c-input__with-character-left", style: {
342
374
  '--mg-c-character-left-message-length': (!this.characterLeftHide ? this.maxlength.toString().length * 2 + 1 : 0).toString(),
343
- } }, this.icon !== undefined && h("mg-icon", { icon: this.icon }), h("input", { type: this.type, class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, list: this.hasDatalist() ? this.datalistId : undefined, autocomplete: this.hasDatalist() ? 'off' : undefined, name: this.name, placeholder: this.placeholder, title: this.placeholder, maxlength: this.maxlength, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), pattern: this.pattern, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, ref: (el) => {
375
+ } }, this.icon !== undefined && h("mg-icon", { icon: this.icon }), h("input", { type: this.type === 'emails' ? 'email' : this.type, multiple: this.type === 'emails', class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, list: this.hasDatalist() ? this.datalistId : undefined, autocomplete: this.hasDatalist() ? 'off' : undefined, name: this.name, placeholder: this.placeholder, title: this.placeholder, maxlength: this.maxlength, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), pattern: this.pattern, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, ref: (el) => {
344
376
  if (el !== null)
345
377
  this.input = el;
346
378
  } }), this.hasDatalist() && (h("datalist", { id: this.datalistId }, this.datalistoptions.map(option => (h("option", { value: isOption(option) ? option.title : option, key: option }))))), !this.characterLeftHide && this.maxlength > 0 && (h("mg-character-left", { identifier: this.characterLeftId, characters: this.value, maxlength: this.maxlength }))),
@@ -350,14 +382,16 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
350
382
  get element() { return this; }
351
383
  static get watchers() { return {
352
384
  "value": ["handleValue"],
385
+ "type": ["validateType"],
353
386
  "icon": ["validateIcon"],
354
387
  "datalistoptions": ["validateDatalistoptions"],
355
388
  "readonly": ["watchReadonly", "handleValidityChange"],
356
389
  "required": ["handleValidityChange"],
357
390
  "disabled": ["handleValidityChange", "watchDisabled"],
358
391
  "mgWidth": ["watchMgWidth"],
359
- "pattern": ["validatePattern"],
360
- "patternErrorMessage": ["validatePattern"]
392
+ "pattern": ["watchPattern"],
393
+ "patternErrorMessage": ["watchPattern"],
394
+ "helpText": ["watchHelpText"]
361
395
  }; }
362
396
  static get style() { return MgInputTextStyle0; }
363
397
  }, [1, "mg-input-text", {
@@ -381,7 +415,7 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
381
415
  "tooltip": [1],
382
416
  "tooltipPosition": [1, "tooltip-position"],
383
417
  "characterLeftHide": [4, "character-left-hide"],
384
- "helpText": [1, "help-text"],
418
+ "helpText": [1025, "help-text"],
385
419
  "valid": [1028],
386
420
  "invalid": [1028],
387
421
  "classCollection": [32],
@@ -392,14 +426,16 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class MgInputText extends H
392
426
  "reset": [64]
393
427
  }, undefined, {
394
428
  "value": ["handleValue"],
429
+ "type": ["validateType"],
395
430
  "icon": ["validateIcon"],
396
431
  "datalistoptions": ["validateDatalistoptions"],
397
432
  "readonly": ["watchReadonly", "handleValidityChange"],
398
433
  "required": ["handleValidityChange"],
399
434
  "disabled": ["handleValidityChange", "watchDisabled"],
400
435
  "mgWidth": ["watchMgWidth"],
401
- "pattern": ["validatePattern"],
402
- "patternErrorMessage": ["validatePattern"]
436
+ "pattern": ["watchPattern"],
437
+ "patternErrorMessage": ["watchPattern"],
438
+ "helpText": ["watchHelpText"]
403
439
  }]);
404
440
  function defineCustomElement() {
405
441
  if (typeof customElements === "undefined") {
@@ -1 +1 @@
1
- {"file":"mg-input-text2.js","mappings":"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","names":["allItemsAreString","ClassList","toString","isValidString"],"sources":["../styles/dist/components/mg-input-text.css?tag=mg-input-text&encapsulation=shadow","src/components/molecules/inputs/mg-input-text/mg-input-text.tsx"],"sourcesContent":[".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left: 0;--mg-c-button-border-radius-bottom-left: 0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right: 0;--mg-c-button-border-radius-bottom-right: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right: var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right: var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__with-character-left{position:relative;width:100%}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left .mg-c-input__box{padding-right:max(var(--mg-c-character-left-message-length)*(.35ch + .3rem) + var(--mg-b-size-16)*clamp(0,var(--mg-c-character-left-message-length),1),var(--mg-b-size-8))}.mg-c-input__with-character-left mg-character-left{position:absolute;top:50%;right:var(--mg-b-size-8);display:none;font-size:var(--mg-b-font-size-small);opacity:.6;transform:translateY(-50%)}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{display:block}.mg-c-input.mg-c-input--readonly b{min-height:var(--mg-b-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}/*# sourceMappingURL=mg-input-text.css.map */\n","import { Component, Event, h, Prop, EventEmitter, State, Element, Method, Watch } from '@stencil/core';\nimport { allItemsAreString, ClassList, isValidString, toString } from '@mgdis/stencil-helpers';\nimport { OptionType, TextType } from './mg-input-text.conf';\nimport { type TooltipPosition, type Width, type EventType, widths, classReadonly, classDisabled } from '../mg-input/mg-input.conf';\nimport { initLocales } from '../../../../locales';\nimport { IconType } from '../../../../components';\n\n/**\n * Check if object is an option\n * @param option - object to validate\n * @returns true id object is an option\n */\n\nconst isOption = (option: unknown): option is OptionType =>\n typeof option === 'object' && typeof (option as OptionType).title === 'string' && (option as OptionType).value !== undefined;\n\n/**\n * Check if datalist options are well structured.\n * @param options - Datalist options to check.\n * @returns True if datalist is well structured.\n */\nconst isDatalistOptions = (options: unknown[]): options is string[] => allItemsAreString(options) || (Array.isArray(options) && options.every(isOption));\n\n/**\n * @slot append-input - Content to display next to the input\n */\n@Component({\n tag: 'mg-input-text',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-text.css',\n shadow: true,\n})\nexport class MgInputText {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classFocus = 'mg-u-is-focused';\n private readonly classIsInputGroupAppend = 'mg-c-input--is-input-group-append';\n private readonly classHasIcon = 'mg-c-input--has-icon';\n private readonly classHasButtonsGroupAppend = 'mg-c-input--has-buttons-group-append';\n private readonly classIsAppendInputSlotContent = 'mg-c-input--is-append-input-slot-content';\n\n // IDs\n private characterLeftId: string;\n private datalistId: string;\n private slotContent: string;\n\n // HTML selector\n private input: HTMLInputElement;\n\n // Locales\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n\n private handlerInProgress: EventType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputTextElement;\n\n /**\n * Component value\n */\n @Prop({ mutable: true, reflect: true }) value: any; // eslint-disable-line @typescript-eslint/no-explicit-any\n @Watch('value')\n handleValue(newValue: string): void {\n if (this.datalistoptions?.every(isOption)) {\n this.valueChange.emit(this.datalistoptions.find(option => option.title === newValue)?.value || newValue);\n } else {\n this.valueChange.emit(newValue);\n }\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n\n /**\n * Input name\n * If not set the value equals the identifier\n */\n @Prop() name: string = this.identifier;\n\n /**\n * Input label\n */\n @Prop() label!: string;\n\n /**\n * Input type\n */\n @Prop() type: TextType = 'text';\n\n /**\n * Input icon\n */\n @Prop() icon?: IconType;\n @Watch('icon')\n validateIcon(newValue: string): void {\n if (newValue !== undefined) {\n this.classCollection.add(this.classHasIcon);\n } else {\n this.classCollection.delete(this.classHasIcon);\n }\n }\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop?: boolean;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Input placeholder.\n * It should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n */\n @Prop() placeholder?: string;\n\n /**\n * Define datalist options\n */\n @Prop() datalistoptions: string[] | OptionType[];\n @Watch('datalistoptions')\n validateDatalistoptions(newValue: MgInputText['datalistoptions']) {\n if (Boolean(newValue) && !isDatalistOptions(newValue)) {\n throw new Error(`<mg-input-text> prop \"datalistoptions\" values must be the same type, string or OptionType. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Input max length\n */\n @Prop() maxlength = 400;\n\n /**\n * Define if input is required\n */\n @Prop() required = false;\n\n /**\n * Define if input is readonly\n */\n @Prop() readonly = false;\n @Watch('readonly')\n watchReadonly(newValue: MgInputText['readonly']): void {\n if (newValue) this.classCollection.add(classReadonly);\n else this.classCollection.delete(classReadonly);\n }\n\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (this.input !== undefined) {\n this.input[prop] = newValue;\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n this.hasDisplayedError = false;\n }\n }\n }\n\n @Watch('disabled')\n watchDisabled(newValue: MgInputText['disabled']): void {\n if (newValue) this.classCollection.add(classDisabled);\n else this.classCollection.delete(classDisabled);\n }\n\n /**\n * Define input width\n */\n @Prop() mgWidth: Width = 'full';\n @Watch('mgWidth')\n watchMgWidth(newValue: MgInputText['mgWidth']): void {\n // reset width class\n widths.forEach(width => {\n this.classCollection.delete(`mg-c-input--width-${width}`);\n });\n\n // apply new width\n if (newValue !== undefined) this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);\n }\n\n /**\n * Define input pattern to validate\n * Please refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n */\n @Prop() pattern?: string;\n\n /**\n * Define input pattern error message\n */\n @Prop() patternErrorMessage?: string;\n @Watch('pattern')\n @Watch('patternErrorMessage')\n validatePattern(newValue: string): void {\n if (newValue !== undefined && !(isValidString(this.pattern) && isValidString(this.patternErrorMessage))) {\n throw new Error(\n `<mg-input-text> props \"pattern\" and \"patternErrorMessage\" must be non-empty string and paired. Passed value: \"pattern='${toString(this.pattern)}'\" and \"patternErrorMessage='${toString(this.patternErrorMessage)}'\".`,\n );\n }\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n\n /**\n * Define if component should display character left\n */\n @Prop() characterLeftHide = false;\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText?: string;\n\n /**\n * Define input valid state\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input invalid state\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-input--text']);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Emited event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<HTMLMgInputTextElement['value']>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<HTMLMgInputTextElement['valid']>;\n\n /**\n * Public method to play input focus\n */\n @Method()\n async setFocus(): Promise<void> {\n this.input.focus();\n }\n\n /**\n * Display input error if it exists.\n */\n @Method()\n displayError(): Promise<void> {\n // Use `Promise` as requested for stencil method\n // Use `requestAnimationFrame` to ensure:\n // - DOM is fully updated before validation\n // - Async operations are completed\n // - No timing issues with Stencil's render cycle\n // - Keep everything in sync both inside and outside the component\n return new Promise(resolve => {\n requestAnimationFrame(() => {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n resolve();\n });\n });\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputText['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-text> method \"setError()\" param \"valid\" must be a boolean.');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-text> method \"setError()\" param \"errorMessage\" must be a string.');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Reset value, validity and error state\n */\n @Method()\n async reset(): Promise<void> {\n if (!this.readonly) {\n this.value = '';\n this.checkValidity();\n this.errorMessage = undefined;\n this.hasDisplayedError = false;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputText['valid']) {\n const oldValidValue = this.valid;\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) this.inputValid.emit(this.valid);\n }\n\n /**\n * Handle input event\n */\n private handleInput = (): void => {\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n }\n this.value = this.input.value;\n };\n\n /**\n * Handle focus event\n */\n private handleFocus = (): void => {\n this.classCollection.add(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n // Manage focus\n this.classCollection.delete(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n // Display Error\n this.handlerInProgress = 'blur';\n this.displayError().finally(() => {\n // reset guard\n this.handlerInProgress = undefined;\n });\n };\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || this.input.checkValidity());\n };\n\n /**\n * Set input error message\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n // Does have a custom error message\n if (!this.valid && errorMessage !== undefined) {\n this.errorMessage = errorMessage;\n }\n // Does not match pattern\n else if (!this.valid && this.input.validity.patternMismatch) {\n this.errorMessage = this.patternErrorMessage;\n }\n // required\n else if (!this.valid && this.input.validity.valueMissing) {\n this.errorMessage = this.messages.errors.required;\n }\n };\n\n /**\n * Validate append slot\n */\n private validateAppendSlot = (): void => {\n const slotAppendInput: HTMLSlotElement[] = Array.from(this.element.querySelectorAll('[slot=\"append-input\"]'));\n\n if (slotAppendInput.length === 1) {\n if (slotAppendInput[0].nodeName === 'MG-BUTTON') {\n this.classCollection.add(this.classIsInputGroupAppend);\n } else {\n this.classCollection.add(this.classIsAppendInputSlotContent);\n this.slotContent = slotAppendInput[0].textContent;\n }\n } else if (slotAppendInput.filter(slot => slot.nodeName === 'MG-BUTTON').length > 1) {\n this.classCollection.add(this.classIsInputGroupAppend);\n this.classCollection.add(this.classHasButtonsGroupAppend);\n }\n };\n\n /**\n * Method to control datalist display condition\n * @returns true if display condition success\n */\n private hasDatalist = (): boolean => isDatalistOptions(this.datalistoptions) && this.datalistoptions.length > 0;\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n this.messages = initLocales(this.element).messages;\n this.characterLeftId = `${this.identifier}-character-left`;\n this.datalistId = `${this.identifier}-datalist`;\n // Validate\n this.validateIcon(this.icon);\n this.validateDatalistoptions(this.datalistoptions);\n this.validatePattern(this.pattern);\n this.validatePattern(this.patternErrorMessage);\n this.validateAppendSlot();\n this.watchMgWidth(this.mgWidth);\n this.watchReadonly(this.readonly);\n this.watchDisabled(this.disabled);\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * Renders the readonly content of the input component.\n * @returns The readonly content element.\n */\n private renderReadonly = (): HTMLElement => {\n return this.slotContent !== undefined ? (\n <span class=\"mg-c-input__readonly-value\">\n <b>{this.value}</b>\n {this.slotContent}\n </span>\n ) : (\n <b class=\"mg-c-input__readonly-value\">{this.value}</b>\n );\n };\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-input\n label={this.label}\n identifier={this.identifier}\n class={this.classCollection.join()}\n ariaDescribedbyIDs={[this.characterLeftId]}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={this.required}\n tooltip={this.tooltip}\n tooltipPosition={this.readonly && this.value === undefined ? 'label' : this.tooltipPosition}\n helpText={this.helpText}\n errorMessage={this.errorMessage}\n >\n {this.readonly\n ? this.value && this.renderReadonly()\n : [\n <div\n key=\"input\"\n class=\"mg-c-input__with-character-left\"\n style={{\n '--mg-c-character-left-message-length': (!this.characterLeftHide ? this.maxlength.toString().length * 2 + 1 : 0).toString(),\n }}\n >\n {this.icon !== undefined && <mg-icon icon={this.icon}></mg-icon>}\n <input\n type={this.type}\n class=\"mg-c-input__box mg-c-input__box--width\"\n value={this.value}\n id={this.identifier}\n list={this.hasDatalist() ? this.datalistId : undefined}\n autocomplete={this.hasDatalist() ? 'off' : undefined}\n name={this.name}\n placeholder={this.placeholder}\n title={this.placeholder}\n maxlength={this.maxlength}\n disabled={this.disabled}\n required={this.required}\n aria-invalid={(this.invalid === true).toString()}\n pattern={this.pattern}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={(el: HTMLInputElement) => {\n if (el !== null) this.input = el;\n }}\n />\n {this.hasDatalist() && (\n <datalist id={this.datalistId}>\n {this.datalistoptions.map(option => (\n <option value={isOption(option) ? option.title : option} key={option}></option>\n ))}\n </datalist>\n )}\n {!this.characterLeftHide && this.maxlength > 0 && (\n <mg-character-left identifier={this.characterLeftId} characters={this.value} maxlength={this.maxlength}></mg-character-left>\n )}\n </div>,\n <slot key=\"slot\" name=\"append-input\"></slot>,\n ]}\n </mg-input>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-input-text2.js","mappings":"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","names":["allItemsAreString","ClassList","isValidString","toString"],"sources":["src/components/molecules/inputs/mg-input-text/mg-input-text.conf.ts","../styles/dist/components/mg-input-text.css?tag=mg-input-text&encapsulation=shadow","src/components/molecules/inputs/mg-input-text/mg-input-text.tsx"],"sourcesContent":["import type { Option } from '../../../../types';\n\n/**\n * TextType from text types\n */\n// Define possible text types with help text\nexport const helpTextTypes = ['email', 'emails', 'url'] as const;\n// Define possible text types\nexport const textTypes = ['text', 'search', 'tel', ...helpTextTypes] as const;\n// Define TextType type\nexport type TextType = (typeof textTypes)[number];\n\n/**\n * Option type\n */\nexport type OptionType = Option;\n",".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left: 0;--mg-c-button-border-radius-bottom-left: 0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right: 0;--mg-c-button-border-radius-bottom-right: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width: 0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right: var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right: var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__with-character-left{position:relative;width:100%}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left .mg-c-input__box{padding-right:max(var(--mg-c-character-left-message-length)*(.35ch + .3rem) + var(--mg-b-size-16)*clamp(0,var(--mg-c-character-left-message-length),1),var(--mg-b-size-8))}.mg-c-input__with-character-left mg-character-left{position:absolute;top:50%;right:var(--mg-b-size-8);display:none;font-size:var(--mg-b-font-size-small);opacity:.6;transform:translateY(-50%)}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{display:block}.mg-c-input.mg-c-input--readonly b{min-height:var(--mg-b-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}/*# sourceMappingURL=mg-input-text.css.map */\n","import { Component, Event, h, Prop, EventEmitter, State, Element, Method, Watch } from '@stencil/core';\nimport { allItemsAreString, ClassList, isValidString, toString } from '@mgdis/stencil-helpers';\nimport { helpTextTypes, type OptionType, type TextType, textTypes } from './mg-input-text.conf';\nimport { type TooltipPosition, type Width, type EventType, widths, classReadonly, classDisabled } from '../mg-input/mg-input.conf';\nimport { initLocales } from '../../../../locales';\nimport { IconType } from '../../../../components';\n\n/**\n * Check if object is an option\n * @param option - object to validate\n * @returns true id object is an option\n */\n\nconst isOption = (option: unknown): option is OptionType =>\n typeof option === 'object' && typeof (option as OptionType).title === 'string' && (option as OptionType).value !== undefined;\n\n/**\n * Check if datalist options are well structured.\n * @param options - Datalist options to check.\n * @returns True if datalist is well structured.\n */\nconst isDatalistOptions = (options: unknown[]): options is string[] => allItemsAreString(options) || (Array.isArray(options) && options.every(isOption));\n\n/**\n * @slot append-input - Content to display next to the input\n */\n@Component({\n tag: 'mg-input-text',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-text.css',\n shadow: true,\n})\nexport class MgInputText {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classFocus = 'mg-u-is-focused';\n private readonly classIsInputGroupAppend = 'mg-c-input--is-input-group-append';\n private readonly classHasIcon = 'mg-c-input--has-icon';\n private readonly classHasButtonsGroupAppend = 'mg-c-input--has-buttons-group-append';\n private readonly classIsAppendInputSlotContent = 'mg-c-input--is-append-input-slot-content';\n\n // IDs\n private characterLeftId: string;\n private datalistId: string;\n private slotContent: string;\n\n // HTML selector\n private input: HTMLInputElement;\n\n // Locales\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n\n private handlerInProgress: EventType;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputTextElement;\n\n /**\n * Component value\n */\n @Prop({ mutable: true, reflect: true }) value: any; // eslint-disable-line @typescript-eslint/no-explicit-any\n @Watch('value')\n handleValue(newValue: string): void {\n if (this.datalistoptions?.every(isOption)) {\n this.valueChange.emit(this.datalistoptions.find(option => option.title === newValue)?.value || newValue);\n } else {\n this.valueChange.emit(newValue);\n }\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier!: string;\n\n /**\n * Input name\n * If not set the value equals the identifier\n */\n @Prop() name: string = this.identifier;\n\n /**\n * Input label\n */\n @Prop() label!: string;\n\n /**\n * Input type\n */\n @Prop() type: TextType = 'text';\n @Watch('type')\n validateType(newValue: TextType): void {\n if (!textTypes.includes(newValue)) {\n throw new Error(`<mg-input-text> prop \"type\" must be one of the following values: ${textTypes.join(', ')}. Passed value: ${newValue}.`);\n }\n }\n\n /**\n * Input icon\n */\n @Prop() icon?: IconType;\n @Watch('icon')\n validateIcon(newValue: string): void {\n if (newValue !== undefined) {\n this.classCollection.add(this.classHasIcon);\n } else {\n this.classCollection.delete(this.classHasIcon);\n }\n }\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop?: boolean;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Input placeholder.\n * It should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n */\n @Prop() placeholder?: string;\n\n /**\n * Define datalist options\n */\n @Prop() datalistoptions: string[] | OptionType[];\n @Watch('datalistoptions')\n validateDatalistoptions(newValue: MgInputText['datalistoptions']) {\n if (Boolean(newValue) && !isDatalistOptions(newValue)) {\n throw new Error(`<mg-input-text> prop \"datalistoptions\" values must be the same type, string or OptionType. Passed value: ${toString(newValue)}.`);\n }\n }\n\n /**\n * Input max length\n */\n @Prop() maxlength = 400;\n\n /**\n * Define if input is required\n */\n @Prop() required = false;\n\n /**\n * Define if input is readonly\n */\n @Prop() readonly = false;\n @Watch('readonly')\n watchReadonly(newValue: MgInputText['readonly']): void {\n if (newValue) this.classCollection.add(classReadonly);\n else this.classCollection.delete(classReadonly);\n }\n\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (this.input !== undefined) {\n this.input[prop] = newValue;\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n this.hasDisplayedError = false;\n }\n }\n }\n\n @Watch('disabled')\n watchDisabled(newValue: MgInputText['disabled']): void {\n if (newValue) this.classCollection.add(classDisabled);\n else this.classCollection.delete(classDisabled);\n }\n\n /**\n * Define input width\n */\n @Prop() mgWidth: Width = 'full';\n @Watch('mgWidth')\n watchMgWidth(newValue: MgInputText['mgWidth']): void {\n // reset width class\n widths.forEach(width => {\n this.classCollection.delete(`mg-c-input--width-${width}`);\n });\n\n // apply new width\n if (newValue !== undefined) this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);\n }\n\n /**\n * Define input pattern to validate\n * Please refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n */\n @Prop() pattern?: string;\n\n /**\n * Define input pattern error message\n */\n @Prop() patternErrorMessage?: string;\n @Watch('pattern')\n @Watch('patternErrorMessage')\n watchPattern(): void {\n this.validatePattern();\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip?: string;\n\n /**\n * Define tooltip position\n */\n @Prop() tooltipPosition: TooltipPosition = 'input';\n\n /**\n * Define if component should display character left\n */\n @Prop() characterLeftHide = false;\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop({ mutable: true }) helpText?: string;\n @Watch('helpText')\n watchHelpText(newValue: string): void {\n if (!isValidString(newValue) && (helpTextTypes as unknown as string).includes(this.type)) {\n this.helpText = this.messages.input.text.helpText[this.type];\n }\n }\n\n /**\n * Define input valid state\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input invalid state\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-input--text']);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Emited event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<HTMLMgInputTextElement['value']>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<HTMLMgInputTextElement['valid']>;\n\n /**\n * Public method to play input focus\n */\n @Method()\n async setFocus(): Promise<void> {\n this.input.focus();\n }\n\n /**\n * Display input error if it exists.\n */\n @Method()\n displayError(): Promise<void> {\n // Use `Promise` as requested for stencil method\n // Use `requestAnimationFrame` to ensure:\n // - DOM is fully updated before validation\n // - Async operations are completed\n // - No timing issues with Stencil's render cycle\n // - Keep everything in sync both inside and outside the component\n return new Promise(resolve => {\n requestAnimationFrame(() => {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n resolve();\n });\n });\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputText['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-text> method \"setError()\" param \"valid\" must be a boolean.');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-text> method \"setError()\" param \"errorMessage\" must be a string.');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Reset value, validity and error state\n */\n @Method()\n async reset(): Promise<void> {\n if (!this.readonly) {\n this.value = '';\n this.checkValidity();\n this.errorMessage = undefined;\n this.hasDisplayedError = false;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputText['valid']) {\n const oldValidValue = this.valid;\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) this.inputValid.emit(this.valid);\n }\n\n /**\n * Validate pattern configuration\n */\n private validatePattern = (): void => {\n if (\n (this.pattern !== undefined || this.patternErrorMessage !== undefined) && // At least one is defined\n (!isValidString(this.pattern) || (!(helpTextTypes as unknown as string).includes(this.type) && !isValidString(this.patternErrorMessage))) // Both must be defined\n ) {\n throw new Error(\n `<mg-input-text> props \"pattern\" and \"patternErrorMessage\" must be non-empty string and paired. Passed value: \"pattern='${this.pattern}'\" and \"patternErrorMessage='${this.patternErrorMessage}'\".`,\n );\n }\n };\n\n /**\n * Handle input event\n */\n private handleInput = (): void => {\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.setErrorMessage();\n }\n this.value = this.input.value;\n };\n\n /**\n * Handle focus event\n */\n private handleFocus = (): void => {\n this.classCollection.add(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n // Manage focus\n this.classCollection.delete(this.classFocus);\n this.classCollection = new ClassList(this.classCollection.classes);\n // Display Error\n this.handlerInProgress = 'blur';\n this.displayError().finally(() => {\n // reset guard\n this.handlerInProgress = undefined;\n });\n };\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || this.input.checkValidity());\n };\n\n /**\n * Set input error message\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n // Does have a custom error message\n if (!this.valid && errorMessage !== undefined) {\n this.errorMessage = errorMessage;\n }\n // Does not match type (email, emails, tel, url, etc.)\n else if (!this.valid && this.input.validity.typeMismatch) {\n this.errorMessage = `${this.messages.input.text.errors.typeMismatch} ${this.messages.input.text.helpText[this.type]}`;\n }\n // Does not match pattern\n else if (!this.valid && this.input.validity.patternMismatch) {\n this.errorMessage = this.patternErrorMessage ?? `${this.messages.input.text.errors.typeMismatch} ${this.messages.input.text.helpText[this.type]}`;\n }\n // required\n else if (!this.valid && this.input.validity.valueMissing) {\n this.errorMessage = this.messages.errors.required;\n }\n };\n\n /**\n * Validate append slot\n */\n private validateAppendSlot = (): void => {\n const slotAppendInput: HTMLSlotElement[] = Array.from(this.element.querySelectorAll('[slot=\"append-input\"]'));\n\n if (slotAppendInput.length === 1) {\n if (slotAppendInput[0].nodeName === 'MG-BUTTON') {\n this.classCollection.add(this.classIsInputGroupAppend);\n } else {\n this.classCollection.add(this.classIsAppendInputSlotContent);\n this.slotContent = slotAppendInput[0].textContent;\n }\n } else if (slotAppendInput.filter(slot => slot.nodeName === 'MG-BUTTON').length > 1) {\n this.classCollection.add(this.classIsInputGroupAppend);\n this.classCollection.add(this.classHasButtonsGroupAppend);\n }\n };\n\n /**\n * Method to control datalist display condition\n * @returns true if display condition success\n */\n private hasDatalist = (): boolean => isDatalistOptions(this.datalistoptions) && this.datalistoptions.length > 0;\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n this.messages = initLocales(this.element).messages;\n this.characterLeftId = `${this.identifier}-character-left`;\n this.datalistId = `${this.identifier}-datalist`;\n // Validate\n this.validateIcon(this.icon);\n this.validateDatalistoptions(this.datalistoptions);\n this.watchPattern();\n this.validateAppendSlot();\n this.watchMgWidth(this.mgWidth);\n this.watchReadonly(this.readonly);\n this.watchDisabled(this.disabled);\n this.validateType(this.type);\n this.watchHelpText(this.helpText);\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * Renders the readonly content of the input component.\n * @returns The readonly content element.\n */\n private renderReadonly = (): HTMLElement => {\n return this.slotContent !== undefined ? (\n <span class=\"mg-c-input__readonly-value\">\n <b>{this.value}</b>\n {this.slotContent}\n </span>\n ) : (\n <b class=\"mg-c-input__readonly-value\">{this.value}</b>\n );\n };\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <mg-input\n label={this.label}\n identifier={this.identifier}\n class={this.classCollection.join()}\n ariaDescribedbyIDs={[this.characterLeftId]}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={this.required}\n tooltip={this.tooltip}\n tooltipPosition={this.readonly && this.value === undefined ? 'label' : this.tooltipPosition}\n helpText={this.helpText}\n errorMessage={this.errorMessage}\n >\n {this.readonly\n ? this.value && this.renderReadonly()\n : [\n <div\n key=\"input\"\n class=\"mg-c-input__with-character-left\"\n style={{\n '--mg-c-character-left-message-length': (!this.characterLeftHide ? this.maxlength.toString().length * 2 + 1 : 0).toString(),\n }}\n >\n {this.icon !== undefined && <mg-icon icon={this.icon}></mg-icon>}\n <input\n type={this.type === 'emails' ? 'email' : this.type}\n multiple={this.type === 'emails'}\n class=\"mg-c-input__box mg-c-input__box--width\"\n value={this.value}\n id={this.identifier}\n list={this.hasDatalist() ? this.datalistId : undefined}\n autocomplete={this.hasDatalist() ? 'off' : undefined}\n name={this.name}\n placeholder={this.placeholder}\n title={this.placeholder}\n maxlength={this.maxlength}\n disabled={this.disabled}\n required={this.required}\n aria-invalid={(this.invalid === true).toString()}\n pattern={this.pattern}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n ref={(el: HTMLInputElement) => {\n if (el !== null) this.input = el;\n }}\n />\n {this.hasDatalist() && (\n <datalist id={this.datalistId}>\n {this.datalistoptions.map(option => (\n <option value={isOption(option) ? option.title : option} key={option}></option>\n ))}\n </datalist>\n )}\n {!this.characterLeftHide && this.maxlength > 0 && (\n <mg-character-left identifier={this.characterLeftId} characters={this.value} maxlength={this.maxlength}></mg-character-left>\n )}\n </div>,\n <slot key=\"slot\" name=\"append-input\"></slot>,\n ]}\n </mg-input>\n );\n }\n}\n"],"version":3}
@@ -33,7 +33,7 @@ const MgLoader$1 = /*@__PURE__*/ proxyCustomElement(class MgLoader extends HTMLE
33
33
  * @returns HTML Element
34
34
  */
35
35
  render() {
36
- return (h("div", { key: 'b9442e1060b119499a8f35444be6b371d340dffc', class: "mg-c-loader", "aria-live": "polite" }, h("mg-icon", { key: '9ef418d26dd97c570147c99948509368a8abe84b', icon: "loader", spin: true }), h("span", { key: '4cff50728afc076ffa202fa1b3973573d2a073e8', class: { 'mg-u-visually-hidden': this.messageHide } }, this.message || this.messages.loader.inProgess)));
36
+ return (h("div", { key: 'b9442e1060b119499a8f35444be6b371d340dffc', class: "mg-c-loader", "aria-live": "polite" }, h("mg-icon", { key: '9ef418d26dd97c570147c99948509368a8abe84b', icon: "loader", spin: true }), h("span", { key: '4cff50728afc076ffa202fa1b3973573d2a073e8', class: { 'mg-u-visually-hidden': this.messageHide } }, this.message || this.messages.loader.inProgress)));
37
37
  }
38
38
  get element() { return this; }
39
39
  static get watchers() { return {
@@ -1 +1 @@
1
- {"file":"mg-loader.js","mappings":";;;;;AAAA,MAAM,WAAW,GAAG,skBAAskB,CAAC;AAC3lB,uBAAe,WAAW;;MCQbA,UAAQ;;;;;;IAsBnB,YAAY,CAAC,QAA6B;QACxC,IAAI,QAAQ,IAAI,CAACC,EAAa,CAAC,QAAQ,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,oEAAoEC,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;KACtJ;;;;;;;IAcD,iBAAiB;;QAEf,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC;;QAGnD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACjC;;;;;IAMD,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,aAAa,eAAW,QAAQ,IACzC,gEAAS,IAAI,EAAC,QAAQ,EAAC,IAAI,SAAW,EACtC,6DAAM,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,CAAC,WAAW,EAAE,IAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAS,CAAQ,CAC9G,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgLoader","isValidString","toString"],"sources":["../styles/dist/components/mg-loader.css?tag=mg-loader&encapsulation=shadow","src/components/molecules/mg-loader/mg-loader.tsx"],"sourcesContent":[".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host{display:block}.mg-c-loader{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--mg-b-size-4);text-align:center}/*# sourceMappingURL=mg-loader.css.map */\n","import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { isValidString, toString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-loader',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-loader.css',\n shadow: true,\n})\nexport class MgLoader {\n /************\n * Internal *\n ************/\n\n // Locales\n private messages;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgLoaderElement;\n\n /**\n * Override loader message\n */\n @Prop() message?: string;\n @Watch('message')\n watchMessage(newValue: MgLoader['message']): void {\n if (newValue && !isValidString(newValue)) throw new Error(`<mg-loader> prop \"message\" must be a valid string. Passed value: ${toString(newValue)}.`);\n }\n\n /**\n * Hide message\n */\n @Prop() messageHide?: boolean;\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n\n // validate props\n this.watchMessage(this.message);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div class=\"mg-c-loader\" aria-live=\"polite\">\n <mg-icon icon=\"loader\" spin></mg-icon>\n <span class={{ 'mg-u-visually-hidden': this.messageHide }}>{this.message || this.messages.loader.inProgess}</span>\n </div>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-loader.js","mappings":";;;;;AAAA,MAAM,WAAW,GAAG,skBAAskB,CAAC;AAC3lB,uBAAe,WAAW;;MCQbA,UAAQ;;;;;;IAsBnB,YAAY,CAAC,QAA6B;QACxC,IAAI,QAAQ,IAAI,CAACC,EAAa,CAAC,QAAQ,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,oEAAoEC,EAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;KACtJ;;;;;;;IAcD,iBAAiB;;QAEf,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC;;QAGnD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACjC;;;;;IAMD,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,aAAa,eAAW,QAAQ,IACzC,gEAAS,IAAI,EAAC,QAAQ,EAAC,IAAI,SAAW,EACtC,6DAAM,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,CAAC,WAAW,EAAE,IAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,UAAU,CAAQ,CAC/G,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgLoader","isValidString","toString"],"sources":["../styles/dist/components/mg-loader.css?tag=mg-loader&encapsulation=shadow","src/components/molecules/mg-loader/mg-loader.tsx"],"sourcesContent":[".mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media(prefers-reduced-motion){*{animation:none !important;transition:none !important}}:host{display:block}.mg-c-loader{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--mg-b-size-4);text-align:center}/*# sourceMappingURL=mg-loader.css.map */\n","import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { isValidString, toString } from '@mgdis/stencil-helpers';\n\n@Component({\n tag: 'mg-loader',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-loader.css',\n shadow: true,\n})\nexport class MgLoader {\n /************\n * Internal *\n ************/\n\n // Locales\n private messages;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgLoaderElement;\n\n /**\n * Override loader message\n */\n @Prop() message?: string;\n @Watch('message')\n watchMessage(newValue: MgLoader['message']): void {\n if (newValue && !isValidString(newValue)) throw new Error(`<mg-loader> prop \"message\" must be a valid string. Passed value: ${toString(newValue)}.`);\n }\n\n /**\n * Hide message\n */\n @Prop() messageHide?: boolean;\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n // Get locales\n this.messages = initLocales(this.element).messages;\n\n // validate props\n this.watchMessage(this.message);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div class=\"mg-c-loader\" aria-live=\"polite\">\n <mg-icon icon=\"loader\" spin></mg-icon>\n <span class={{ 'mg-u-visually-hidden': this.messageHide }}>{this.message || this.messages.loader.inProgress}</span>\n </div>\n );\n }\n}\n"],"version":3}