@mgdis/mg-components 6.15.0 → 6.17.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 (155) hide show
  1. package/dist/cjs/events.utils-D5SAtkpQ.js +25 -0
  2. package/dist/cjs/{index-BGxkpQwi.js → index-DCZEYvlH.js} +48 -29
  3. package/dist/cjs/{index-iUZvsp-F.js → index-TUElr4Wv.js} +18 -30
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/mg-action-more_37.cjs.entry.js +100 -365
  6. package/dist/cjs/mg-alert.cjs.entry.js +2 -2
  7. package/dist/cjs/mg-components.cjs.js +3 -3
  8. package/dist/cjs/mg-input-combobox.cjs.entry.js +78 -140
  9. package/dist/cjs/mg-input-rich-text-editor.cjs.entry.js +4 -4
  10. package/dist/cjs/{mg-input.conf-CwjEAih3.js → mg-input.conf-WTsvDfpC.js} +0 -7
  11. package/dist/cjs/mg-loader.cjs.entry.js +2 -2
  12. package/dist/cjs/mg-progress.cjs.entry.js +1 -1
  13. package/dist/collection/collection-manifest.json +1 -1
  14. package/dist/collection/components/atoms/internals/mg-character-left/mg-character-left.js +5 -5
  15. package/dist/collection/components/atoms/internals/mg-input-title/mg-input-title.js +7 -7
  16. package/dist/collection/components/atoms/mg-badge/mg-badge.js +6 -6
  17. package/dist/collection/components/atoms/mg-button/mg-button.js +13 -13
  18. package/dist/collection/components/atoms/mg-card/mg-card.js +2 -2
  19. package/dist/collection/components/atoms/mg-divider/mg-divider.js +1 -1
  20. package/dist/collection/components/atoms/mg-icon/mg-icon.conf.js +1 -1
  21. package/dist/collection/components/atoms/mg-icon/mg-icon.js +32 -26
  22. package/dist/collection/components/atoms/mg-tag/mg-tag.js +3 -3
  23. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js +2 -2
  24. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +6 -6
  25. package/dist/collection/components/molecules/inputs/mg-input/mg-input.conf.js +0 -6
  26. package/dist/collection/components/molecules/inputs/mg-input/mg-input.js +37 -108
  27. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js +1 -2
  28. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +6 -8
  29. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +42 -99
  30. package/dist/collection/components/molecules/inputs/mg-input-combobox/mg-input-combobox.js +82 -167
  31. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +27 -44
  32. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +40 -55
  33. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +26 -26
  34. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +32 -86
  35. package/dist/collection/components/molecules/inputs/mg-input-rich-text-editor/mg-input-rich-text-editor.js +26 -27
  36. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +33 -82
  37. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +33 -34
  38. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +32 -32
  39. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +27 -161
  40. package/dist/collection/components/molecules/internals/mg-item-more/mg-item-more.js +2 -4
  41. package/dist/collection/components/molecules/menus/mg-menu/mg-menu.js +4 -5
  42. package/dist/collection/components/molecules/menus/mg-menu-item/mg-menu-item.js +7 -7
  43. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +1 -4
  44. package/dist/collection/components/molecules/mg-alert/mg-alert.js +4 -4
  45. package/dist/collection/components/molecules/mg-details/mg-details.js +6 -6
  46. package/dist/collection/components/molecules/mg-form/mg-form.js +13 -13
  47. package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +2 -2
  48. package/dist/collection/components/molecules/mg-loader/mg-loader.js +3 -3
  49. package/dist/collection/components/molecules/mg-message/mg-message.js +2 -2
  50. package/dist/collection/components/molecules/mg-modal/mg-modal.js +6 -6
  51. package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +7 -8
  52. package/dist/collection/components/molecules/mg-panel/mg-panel.js +13 -13
  53. package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js +1 -1
  54. package/dist/collection/components/molecules/mg-popover/mg-popover.js +6 -6
  55. package/dist/collection/components/molecules/mg-progress/mg-progress.js +6 -6
  56. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +0 -1
  57. package/dist/collection/components/molecules/mg-table/mg-table.js +2 -3
  58. package/dist/collection/components/molecules/mg-tabs/mg-tabs.js +6 -7
  59. package/dist/collection/locales/en/messages.json +8 -13
  60. package/dist/collection/locales/fr/messages.json +8 -13
  61. package/dist/components/index2.js +1 -1
  62. package/dist/components/index3.js +18 -30
  63. package/dist/components/mg-action-more.js +4 -2
  64. package/dist/components/mg-alert.js +4 -2
  65. package/dist/components/mg-badge2.js +4 -2
  66. package/dist/components/mg-button2.js +4 -2
  67. package/dist/components/mg-card2.js +4 -2
  68. package/dist/components/mg-character-left2.js +4 -2
  69. package/dist/components/mg-details.js +99 -1
  70. package/dist/components/mg-divider2.js +4 -2
  71. package/dist/components/mg-form.js +4 -2
  72. package/dist/components/mg-icon2.js +29 -21
  73. package/dist/components/mg-illustrated-message.js +4 -2
  74. package/dist/components/mg-input-checkbox-paginated2.js +6 -7
  75. package/dist/components/mg-input-checkbox.js +23 -65
  76. package/dist/components/mg-input-combobox.js +64 -132
  77. package/dist/components/mg-input-date.js +8 -29
  78. package/dist/components/mg-input-numeric.js +8 -27
  79. package/dist/components/mg-input-password.js +6 -10
  80. package/dist/components/mg-input-radio.js +16 -55
  81. package/dist/components/mg-input-rich-text-editor.js +6 -10
  82. package/dist/components/mg-input-select2.js +12 -46
  83. package/dist/components/mg-input-text2.js +6 -10
  84. package/dist/components/mg-input-textarea.js +6 -10
  85. package/dist/components/mg-input-title2.js +4 -2
  86. package/dist/components/mg-input-toggle.js +15 -98
  87. package/dist/components/mg-input2.js +26 -101
  88. package/dist/components/mg-item-more2.js +8 -4
  89. package/dist/components/mg-loader2.js +4 -2
  90. package/dist/components/mg-menu-item2.js +4 -2
  91. package/dist/components/mg-message2.js +4 -2
  92. package/dist/components/mg-modal.js +4 -2
  93. package/dist/components/mg-pagination.js +6 -10
  94. package/dist/components/mg-panel.js +11 -15
  95. package/dist/components/mg-popover-content2.js +4 -2
  96. package/dist/components/mg-popover2.js +4 -2
  97. package/dist/components/mg-progress.js +4 -2
  98. package/dist/components/mg-skip-links.js +4 -2
  99. package/dist/components/mg-table.js +4 -2
  100. package/dist/components/mg-tabs2.js +4 -2
  101. package/dist/components/mg-tag.js +4 -2
  102. package/dist/components/mg-tooltip-content2.js +4 -2
  103. package/dist/components/mg-tooltip2.js +4 -2
  104. package/dist/esm/events.utils-yMGqY8YG.js +23 -0
  105. package/dist/esm/{index-CKB-AnCZ.js → index-CNX6lq0x.js} +18 -30
  106. package/dist/esm/{index-DhAOnZJn.js → index-T6kOJXP1.js} +48 -29
  107. package/dist/esm/loader.js +3 -3
  108. package/dist/esm/mg-action-more_37.entry.js +96 -361
  109. package/dist/esm/mg-alert.entry.js +2 -2
  110. package/dist/esm/mg-components.js +4 -4
  111. package/dist/esm/mg-input-combobox.entry.js +59 -121
  112. package/dist/esm/mg-input-rich-text-editor.entry.js +4 -4
  113. package/dist/esm/{mg-input.conf-BAUTlb6r.js → mg-input.conf-CNgv8hc5.js} +1 -7
  114. package/dist/esm/mg-loader.entry.js +2 -2
  115. package/dist/esm/mg-progress.entry.js +1 -1
  116. package/dist/mg-components/locales/en/messages.json +8 -13
  117. package/dist/mg-components/locales/fr/messages.json +8 -13
  118. package/dist/mg-components/mg-components.esm.js +1 -1
  119. package/dist/mg-components/{p-47e19783.entry.js → p-0e6b40d6.entry.js} +1 -1
  120. package/dist/mg-components/{p-67af6274.entry.js → p-397bf67b.entry.js} +1 -1
  121. package/dist/mg-components/{p-a0fa44cf.entry.js → p-5dc3a1fb.entry.js} +1 -1
  122. package/dist/mg-components/p-8a69175b.entry.js +1 -0
  123. package/dist/mg-components/p-CNX6lq0x.js +1 -0
  124. package/dist/mg-components/p-CNgv8hc5.js +1 -0
  125. package/dist/mg-components/p-T6kOJXP1.js +2 -0
  126. package/dist/mg-components/{p-420daa1e.entry.js → p-c5da335e.entry.js} +1 -1
  127. package/dist/mg-components/p-d84d87ea.entry.js +1 -0
  128. package/dist/mg-components/p-yMGqY8YG.js +1 -0
  129. package/dist/types/components/atoms/mg-icon/mg-icon.conf.d.ts +1 -1
  130. package/dist/types/components/atoms/mg-icon/mg-icon.d.ts +0 -5
  131. package/dist/types/components/molecules/inputs/mg-input/mg-input.conf.d.ts +0 -13
  132. package/dist/types/components/molecules/inputs/mg-input/mg-input.d.ts +4 -15
  133. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.d.ts +3 -21
  134. package/dist/types/components/molecules/inputs/mg-input-combobox/mg-input-combobox.d.ts +2 -16
  135. package/dist/types/components/molecules/inputs/mg-input-radio/mg-input-radio.d.ts +0 -18
  136. package/dist/types/components/molecules/inputs/mg-input-select/mg-input-select.d.ts +0 -18
  137. package/dist/types/components/molecules/inputs/mg-input-toggle/mg-input-toggle.d.ts +4 -40
  138. package/dist/types/components.d.ts +7 -63
  139. package/dist/types/stencil-public-runtime.d.ts +39 -2
  140. package/dist/types/types/index.d.ts +1 -1
  141. package/ide/intellij/web-types.json +23 -304
  142. package/ide/vscode/html-custom-data.json +18 -113
  143. package/package.json +22 -22
  144. package/dist/cjs/mg-input.utils-D-ASK4ua.js +0 -49
  145. package/dist/collection/components/molecules/inputs/mg-input/mg-input.utils.js +0 -21
  146. package/dist/components/mg-details2.js +0 -99
  147. package/dist/components/mg-input.utils.js +0 -24
  148. package/dist/esm/mg-input.utils-BYI03zSi.js +0 -46
  149. package/dist/mg-components/p-31856cff.entry.js +0 -1
  150. package/dist/mg-components/p-698dfc6c.entry.js +0 -1
  151. package/dist/mg-components/p-BAUTlb6r.js +0 -1
  152. package/dist/mg-components/p-CKB-AnCZ.js +0 -1
  153. package/dist/mg-components/p-DhAOnZJn.js +0 -2
  154. package/dist/mg-components/p-PuX-pdL4.js +0 -1
  155. package/dist/types/components/molecules/inputs/mg-input/mg-input.utils.d.ts +0 -8
@@ -1,9 +1,8 @@
1
1
  import { h } from "@stencil/core";
2
2
  import { allItemsAreString, ClassList, getObjectValueFromKey, isValidString, nextTick, Page, Paginate, Cursor, toString, isObject, formatID, } from "@mgdis/core-ui-helpers/dist/utils";
3
- import { widths, classReadonly, classDisabled, CustomError } from "../mg-input/mg-input.conf";
3
+ import { widths, classReadonly, classDisabled } from "../mg-input/mg-input.conf";
4
4
  import { initLocales } from "../../../../locales";
5
5
  import { Keys } from "../../../../utils/events.utils";
6
- import { defineErrorMessage } from "../mg-input/mg-input.utils";
7
6
  /**
8
7
  * Check if object is an item
9
8
  * @param item - object to check
@@ -127,12 +126,10 @@ export class MgInputCombobox {
127
126
  */
128
127
  this.handleFilterInput = () => {
129
128
  this.checkValidity();
130
- if (this.hasDisplayedError) {
129
+ if (this.hasDisplayedError)
131
130
  this.setErrorMessage();
132
- }
133
- if (!this.popoverDisplay) {
131
+ if (!this.popoverDisplay)
134
132
  this.popoverDisplay = true;
135
- }
136
133
  // update filter with debounce to prevent filter update overload
137
134
  if (!this.debounce) {
138
135
  this.debounce = true;
@@ -178,6 +175,7 @@ export class MgInputCombobox {
178
175
  * @param event - keyboard event
179
176
  */
180
177
  this.handleFilterKeydown = (event) => {
178
+ var _a;
181
179
  if (this.disabled || event.ctrlKey || event.shiftKey)
182
180
  return;
183
181
  let guard = false;
@@ -186,10 +184,11 @@ export class MgInputCombobox {
186
184
  case Keys.TAB:
187
185
  case Keys.ENTER:
188
186
  guard = event.key === Keys.ENTER;
189
- const option = this.option || this.options.items.find(this.isCurrentOption);
187
+ const option = (_a = this.option) !== null && _a !== void 0 ? _a : this.options.items.find(this.isCurrentOption);
190
188
  // Sets the value to the content of the focused option in the listbox.
191
- if (this.popoverDisplay)
189
+ if (this.popoverDisplay) {
192
190
  this.setValue(option);
191
+ }
193
192
  // Closes the popover.
194
193
  this.popoverDisplay = false;
195
194
  break;
@@ -310,46 +309,27 @@ export class MgInputCombobox {
310
309
  else
311
310
  return '';
312
311
  };
313
- /**
314
- * Test if component has no value error message displayed
315
- * @returns truthy if compent display no value error message
316
- */
317
- this.hasNoValueError = () => this.customError === CustomError.NoValue;
318
312
  /**
319
313
  * Check if input is valid
320
314
  */
321
315
  this.checkValidity = () => {
322
- // force validity with readonly|disabled states
323
- this.setValidity(this.readonly || this.disabled);
316
+ this.setValidity(this.readonly || this.disabled || this.input.checkValidity());
324
317
  };
325
318
  /**
326
319
  * Set input error message
320
+ * @param errorMessage - errorMessage override
327
321
  */
328
- this.setErrorMessage = () => {
322
+ this.setErrorMessage = (errorMessage) => {
329
323
  // Set error message
330
324
  this.errorMessage = undefined;
331
- if (!this.valid) {
332
- // Does have a custom error message
333
- if (this.customError !== undefined && !Object.values(CustomError).includes(this.customError)) {
334
- this.errorMessage = this.customError;
335
- }
336
- // no items
337
- else if (this.hasNoValueError()) {
338
- this.errorMessage = this.messages.errors.noValue;
339
- }
340
- // required
341
- else if (this.input.validity.valueMissing) {
342
- this.errorMessage = this.messages.errors.required;
343
- }
325
+ // Does have a custom error message
326
+ if (!this.valid && errorMessage !== undefined) {
327
+ this.errorMessage = errorMessage;
328
+ }
329
+ // required
330
+ else if (!this.valid && this.input.validity.valueMissing) {
331
+ this.errorMessage = this.messages.errors.required;
344
332
  }
345
- };
346
- /**
347
- * Reset error message
348
- */
349
- this.resetErrorMessage = () => {
350
- this.checkValidity();
351
- this.errorMessage = undefined;
352
- this.hasDisplayedError = false;
353
333
  };
354
334
  /**
355
335
  * Get filtered options from `filter` input value
@@ -423,14 +403,14 @@ export class MgInputCombobox {
423
403
  */
424
404
  this.goToNextPage = () => {
425
405
  this.showMore.emit();
426
- if (this.fetchurl !== undefined) {
406
+ if (Boolean(this.fetchurl)) {
427
407
  return this.getOptions(typeof this.page.next === 'string' ? this.page.next : undefined).then(nextPage => {
428
- if (isObject(nextPage)) {
429
- // merge items from current page and next page
430
- const items = [...this.page.items, ...nextPage.items];
431
- // create new options pagination withe merged items
432
- this.options = new Paginate(items, { total: nextPage.total, next: nextPage.next, top: items.length });
433
- }
408
+ if (!Boolean(nextPage))
409
+ return;
410
+ // merge items from current page and next page
411
+ const items = [...this.page.items, ...nextPage.items];
412
+ // create new options pagination withe merged items
413
+ this.options = new Paginate(items, { total: nextPage.total, next: nextPage.next, top: items.length });
434
414
  });
435
415
  }
436
416
  else {
@@ -447,20 +427,12 @@ export class MgInputCombobox {
447
427
  * @returns promise
448
428
  */
449
429
  this.updatePage = async () => {
450
- if (this.fetchurl !== undefined) {
430
+ if (Boolean(this.fetchurl)) {
451
431
  return this.getOptions().then(page => {
452
- if (isObject(page)) {
453
- // reset current options pagination from API response
454
- this.options = new Paginate(page.items, { total: page.total, next: page.next, top: page.top });
455
- // has items aren't updated with fetch mode we run the noValueError control here
456
- if (this.filter.length === 0 && page.total === 0) {
457
- this.displayError();
458
- }
459
- // force to reset error when noValueError is displaied
460
- else if (this.invalid && this.hasNoValueError()) {
461
- this.resetErrorMessage();
462
- }
463
- }
432
+ if (!Boolean(page))
433
+ return;
434
+ // reset current options pagination from API response
435
+ this.options = new Paginate(page.items, { total: page.total, next: page.next, top: page.top });
464
436
  });
465
437
  }
466
438
  else {
@@ -479,16 +451,14 @@ export class MgInputCombobox {
479
451
  const response = await fetch(updateUrl, this.fetchoptions);
480
452
  if (!response.ok) {
481
453
  this.fetchError.emit(new Error(`${response.status} - ${response.statusText}`));
482
- this.displayError();
483
454
  return;
484
455
  }
485
456
  const json = await response.json();
486
- const defaultItems = [];
487
- const items = getObjectValueFromKey(json, this.fetchmappings.response.items, defaultItems).map((item) => ({
488
- title: getObjectValueFromKey(item, this.fetchmappings.response.itemTitle, typeof item === 'string' ? item : JSON.stringify(item)),
489
- value: getObjectValueFromKey(item, this.fetchmappings.response.itemValue, item),
457
+ const items = getObjectValueFromKey(json, this.fetchmappings.response.items).map((item) => ({
458
+ title: getObjectValueFromKey(item, this.fetchmappings.response.itemTitle),
459
+ value: this.fetchmappings.response.itemValue !== undefined ? getObjectValueFromKey(item, this.fetchmappings.response.itemValue) : item,
490
460
  }));
491
- const total = Number(getObjectValueFromKey(json, this.fetchmappings.response.total, defaultItems.length));
461
+ const total = Number(getObjectValueFromKey(json, this.fetchmappings.response.total, 0));
492
462
  let next = getObjectValueFromKey(json, this.fetchmappings.response.next);
493
463
  if (URL.canParse(updateUrl) && Boolean(next) && !URL.canParse(next)) {
494
464
  const previousUrl = new URL(updateUrl);
@@ -500,7 +470,6 @@ export class MgInputCombobox {
500
470
  }
501
471
  catch (error) {
502
472
  this.fetchError.emit(error);
503
- this.displayError();
504
473
  }
505
474
  };
506
475
  }
@@ -509,35 +478,24 @@ export class MgInputCombobox {
509
478
  this.valueChange.emit(newValue);
510
479
  }
511
480
  watchItems(newValue) {
512
- // fetch items
513
- if (![undefined, null].includes(this.fetchurl) && [undefined, null].includes(newValue)) {
481
+ if (Boolean(this.fetchurl) && !Boolean(newValue)) {
514
482
  // skip newValue check
515
483
  return;
516
484
  }
517
- // invalid items
518
- else if (![undefined, null].includes(this.fetchurl) && Array.isArray(newValue)) {
485
+ else if (Boolean(this.fetchurl) && Boolean(newValue)) {
519
486
  throw new Error(`<mg-input-combobox> prop "items" values cannot be use with "fetchurl" prop defined. Passed value: ${toString(newValue)}.`);
520
487
  }
521
- // Empty items
522
- else if ([undefined, null].includes(newValue) || (Array.isArray(newValue) && newValue.length === 0)) {
488
+ // Empty options
489
+ else if (Array.isArray(newValue) && newValue.length === 0) {
523
490
  this.options = new Paginate([]);
524
- this.displayError();
525
491
  }
526
492
  // String array
527
493
  else if (allItemsAreString(newValue)) {
528
494
  this.options = new Paginate(newValue.map(item => ({ title: item, value: item })), { total: newValue.length });
529
- // force to reset error when noValueError is displayed
530
- if (this.invalid && this.hasNoValueError()) {
531
- this.resetErrorMessage();
532
- }
533
495
  }
534
496
  // Object array
535
497
  else if (isItems(newValue)) {
536
498
  this.options = new Paginate(newValue, { total: newValue.length });
537
- // force to reset error when noValueError is displayed
538
- if (this.invalid && this.hasNoValueError()) {
539
- this.resetErrorMessage();
540
- }
541
499
  }
542
500
  else {
543
501
  throw new Error(`<mg-input-combobox> prop "items" values must be the same type, string or Option. Passed value: ${toString(newValue)}.`);
@@ -605,7 +563,7 @@ export class MgInputCombobox {
605
563
  }
606
564
  }
607
565
  watchOptions(newValue) {
608
- this.page = newValue.getPage(0, this.filter.length > 0 ? this.optionsFilter : undefined);
566
+ this.page = newValue.getPage(0, Boolean(this.filter) ? this.optionsFilter : undefined);
609
567
  }
610
568
  watchFilter(newValue) {
611
569
  this.loadingWrapper({ name: 'load-data' });
@@ -671,8 +629,8 @@ export class MgInputCombobox {
671
629
  throw new Error('<mg-input-combobox> method "setError()" param "errorMessage" must be a string.');
672
630
  }
673
631
  else {
674
- this.setValidity(valid, errorMessage);
675
- this.setErrorMessage();
632
+ this.setValidity(valid);
633
+ this.setErrorMessage(valid ? undefined : errorMessage);
676
634
  this.hasDisplayedError = this.invalid;
677
635
  }
678
636
  }
@@ -692,7 +650,9 @@ export class MgInputCombobox {
692
650
  // - Keep everything in sync both inside and outside the component
693
651
  return new Promise(resolve => {
694
652
  requestAnimationFrame(() => {
695
- this.resetErrorMessage();
653
+ this.checkValidity();
654
+ this.errorMessage = undefined;
655
+ this.hasDisplayedError = false;
696
656
  resolve();
697
657
  });
698
658
  });
@@ -715,34 +675,15 @@ export class MgInputCombobox {
715
675
  }
716
676
  /**
717
677
  * Method to set validity values
718
- * @param newValidValue - new valid value. `true` will bypass input check.
719
- * @param customErrorMessage - custom error message
678
+ * @param newValue - valid new value
720
679
  */
721
- setValidity(newValidValue, customErrorMessage) {
722
- var _a;
680
+ setValidity(newValue) {
723
681
  const oldValidValue = this.valid;
724
- let valid = newValidValue;
725
- // Set custom validity
726
- if (!valid && this.input !== undefined) {
727
- // custom errror, start by reset it
728
- this.customError = undefined;
729
- if (isValidString(customErrorMessage)) {
730
- this.customError = customErrorMessage;
731
- }
732
- // no value
733
- else if ((this.fetchurl === undefined ? ((_a = this.items) !== null && _a !== void 0 ? _a : []).length : this.page.total) === 0) {
734
- this.customError = CustomError.NoValue;
735
- }
736
- // get new input validity from validity state
737
- valid = this.input.checkValidity() && this.customError === undefined;
738
- }
739
- // set valid/invalid props
740
- this.valid = valid;
682
+ this.valid = newValue;
741
683
  this.invalid = !this.valid;
742
684
  // We need to send valid event even if it is the same value
743
- if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue)) {
685
+ if (this.handlerInProgress === undefined || (this.handlerInProgress === 'blur' && this.valid !== oldValidValue))
744
686
  this.inputValid.emit(this.valid);
745
- }
746
687
  }
747
688
  /*************
748
689
  * Lifecycle *
@@ -783,19 +724,15 @@ export class MgInputCombobox {
783
724
  const listId = `${this.identifier}-list`;
784
725
  const readonlyValue = this.getValueTitle();
785
726
  const withResetButton = this.value && !this.disabled;
786
- const disabled = this.disabled || this.hasNoValueError();
787
727
  let popoverContent;
788
- if (((_a = this.page) === null || _a === void 0 ? void 0 : _a.items.length) > 0) {
728
+ if (((_a = this.page) === null || _a === void 0 ? void 0 : _a.items.length) > 0)
789
729
  popoverContent = 'list';
790
- }
791
- else if (((_b = this.page) === null || _b === void 0 ? void 0 : _b.items.length) === 0 && this.filter.length > 0) {
730
+ else if (((_b = this.page) === null || _b === void 0 ? void 0 : _b.items.length) === 0 && Boolean(this.filter))
792
731
  popoverContent = 'notfound';
793
- }
794
- else if (((_c = this.page) === null || _c === void 0 ? void 0 : _c.items.length) === 0) {
732
+ else if (((_c = this.page) === null || _c === void 0 ? void 0 : _c.items.length) === 0)
795
733
  popoverContent = 'notavailable';
796
- }
797
734
  let activeDescendant;
798
- if (![null, undefined].includes((_d = this.option) === null || _d === void 0 ? void 0 : _d.value)) {
735
+ if (Boolean((_d = this.option) === null || _d === void 0 ? void 0 : _d.value)) {
799
736
  activeDescendant = this.option.value;
800
737
  }
801
738
  else if (typeof this.value === 'string') {
@@ -804,12 +741,12 @@ export class MgInputCombobox {
804
741
  else {
805
742
  activeDescendant = (_e = this.value) === null || _e === void 0 ? void 0 : _e.value;
806
743
  }
807
- return (h("mg-input", { key: 'fa0977713a1150c39b4f989bbb139e0e345b4c5f', label: this.label, identifier: this.identifier, class: this.classCollection.classes.join(' '), ariaDescribedbyIDs: popoverContent && popoverContent !== 'list' ? popoverContent : undefined, 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: defineErrorMessage(this.errorMessage, this.noValueErrorDetail) }, this.readonly ? (readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, readonlyValue)) : (h("mg-popover", { identifier: this.popoverId, placement: "bottom-start", display: this.popoverDisplay, "arrow-hide": true, style: {
744
+ return (h("mg-input", { key: '79e5263cd3b1c0fa0b3f386a547f2bdd48a33b28', label: this.label, identifier: this.identifier, class: this.classCollection.classes.join(' '), ariaDescribedbyIDs: popoverContent && popoverContent !== 'list' ? popoverContent : undefined, 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 ? (readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, readonlyValue)) : (h("mg-popover", { identifier: this.popoverId, placement: "bottom-start", display: this.popoverDisplay, "arrow-hide": true, style: {
808
745
  '--mg-c-input-list-width': Boolean((_f = this.input) === null || _f === void 0 ? void 0 : _f.offsetWidth) ? `${this.input.offsetWidth}px` : undefined,
809
- }, "data-fallback-placement": "bottom-end", "onDisplay-change": this.handlePopoverDisplay }, h("div", { class: "mg-c-input__input-group-container" }, h("mg-icon", { icon: "magnifying-glass" }), h("input", { type: "text", role: "combobox", class: "mg-c-input__box mg-c-input__box--width", value: this.filter, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: disabled, required: this.required, autocomplete: "off", "aria-autocomplete": "list", "aria-expanded": this.popoverDisplay.toString(), "aria-controls": listId, "aria-invalid": (this.invalid === true).toString(), "aria-activedescendant": formatID(activeDescendant), onInput: this.handleFilterInput, onBlur: this.handleFilterBlur, onFocus: this.handleFilterFocus, onKeyDown: this.handleFilterKeydown, ref: (el) => {
746
+ }, "data-fallback-placement": "bottom-end", "onDisplay-change": this.handlePopoverDisplay }, h("div", { class: "mg-c-input__input-group-container" }, h("mg-icon", { icon: "magnifying-glass" }), h("input", { type: "text", role: "combobox", class: "mg-c-input__box mg-c-input__box--width", value: this.filter, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: "off", "aria-autocomplete": "list", "aria-expanded": this.popoverDisplay.toString(), "aria-controls": listId, "aria-invalid": (this.invalid === true).toString(), "aria-activedescendant": formatID(activeDescendant), onInput: this.handleFilterInput, onBlur: this.handleFilterBlur, onFocus: this.handleFilterFocus, onKeyDown: this.handleFilterKeydown, ref: (el) => {
810
747
  if (el !== null)
811
748
  this.input = el;
812
- } }), withResetButton ? (h("mg-button", { class: "mg-c-input__box-append mg-c-input__reset", variant: "flat", "is-icon": true, label: this.messages.general.reset, "aria-controls": this.identifier, tabindex: "-1", onClick: this.handleResetButton, disabled: disabled }, h("mg-icon", { icon: "cross" }))) : (h("mg-button", { class: "mg-c-input__box-append", variant: "flat", "is-icon": true, label: this.itemsLabel, tabindex: "-1", disabled: disabled }, h("mg-icon", { icon: `chevron-${this.popoverDisplay ? 'up' : 'down'}` })))), h("div", { slot: "content", class: "mg-c-input__popover-container" }, popoverContent === 'list' && [
749
+ } }), withResetButton ? (h("mg-button", { class: "mg-c-input__box-append mg-c-input__reset", variant: "flat", "is-icon": true, label: this.messages.general.reset, "aria-controls": this.identifier, tabindex: "-1", onClick: this.handleResetButton }, h("mg-icon", { icon: "cross" }))) : (h("mg-button", { class: "mg-c-input__box-append", variant: "flat", "is-icon": true, label: this.itemsLabel, tabindex: "-1", disabled: this.disabled }, h("mg-icon", { icon: `chevron-${this.popoverDisplay ? 'up' : 'down'}` })))), h("div", { slot: "content", class: "mg-c-input__popover-container" }, popoverContent === 'list' && [
813
750
  // eslint-disable-next-line jsx-a11y/role-supports-aria-props
814
751
  h("ul", { key: "list", class: "mg-c-input__input-list", role: "listbox", id: listId, "aria-label": this.itemsLabel, "aria-setsize": this.page.total }, this.page.items.map(option => {
815
752
  var _a;
@@ -844,7 +781,6 @@ export class MgInputCombobox {
844
781
  return {
845
782
  "value": {
846
783
  "type": "string",
847
- "attribute": "value",
848
784
  "mutable": true,
849
785
  "complexType": {
850
786
  "original": "string | Option",
@@ -865,11 +801,11 @@ export class MgInputCombobox {
865
801
  },
866
802
  "getter": false,
867
803
  "setter": false,
868
- "reflect": true
804
+ "reflect": true,
805
+ "attribute": "value"
869
806
  },
870
807
  "items": {
871
808
  "type": "unknown",
872
- "attribute": "items",
873
809
  "mutable": false,
874
810
  "complexType": {
875
811
  "original": "(string | Option)[]",
@@ -893,7 +829,6 @@ export class MgInputCombobox {
893
829
  },
894
830
  "itemsLabel": {
895
831
  "type": "string",
896
- "attribute": "items-label",
897
832
  "mutable": false,
898
833
  "complexType": {
899
834
  "original": "string",
@@ -911,11 +846,11 @@ export class MgInputCombobox {
911
846
  },
912
847
  "getter": false,
913
848
  "setter": false,
914
- "reflect": false
849
+ "reflect": false,
850
+ "attribute": "items-label"
915
851
  },
916
852
  "identifier": {
917
853
  "type": "string",
918
- "attribute": "identifier",
919
854
  "mutable": false,
920
855
  "complexType": {
921
856
  "original": "string",
@@ -930,11 +865,11 @@ export class MgInputCombobox {
930
865
  },
931
866
  "getter": false,
932
867
  "setter": false,
933
- "reflect": false
868
+ "reflect": false,
869
+ "attribute": "identifier"
934
870
  },
935
871
  "name": {
936
872
  "type": "string",
937
- "attribute": "name",
938
873
  "mutable": false,
939
874
  "complexType": {
940
875
  "original": "string",
@@ -950,11 +885,11 @@ export class MgInputCombobox {
950
885
  "getter": false,
951
886
  "setter": false,
952
887
  "reflect": false,
888
+ "attribute": "name",
953
889
  "defaultValue": "this.identifier"
954
890
  },
955
891
  "label": {
956
892
  "type": "string",
957
- "attribute": "label",
958
893
  "mutable": false,
959
894
  "complexType": {
960
895
  "original": "string",
@@ -969,11 +904,11 @@ export class MgInputCombobox {
969
904
  },
970
905
  "getter": false,
971
906
  "setter": false,
972
- "reflect": false
907
+ "reflect": false,
908
+ "attribute": "label"
973
909
  },
974
910
  "labelOnTop": {
975
911
  "type": "boolean",
976
- "attribute": "label-on-top",
977
912
  "mutable": false,
978
913
  "complexType": {
979
914
  "original": "boolean",
@@ -989,11 +924,11 @@ export class MgInputCombobox {
989
924
  "getter": false,
990
925
  "setter": false,
991
926
  "reflect": false,
927
+ "attribute": "label-on-top",
992
928
  "defaultValue": "false"
993
929
  },
994
930
  "labelHide": {
995
931
  "type": "boolean",
996
- "attribute": "label-hide",
997
932
  "mutable": false,
998
933
  "complexType": {
999
934
  "original": "boolean",
@@ -1009,11 +944,11 @@ export class MgInputCombobox {
1009
944
  "getter": false,
1010
945
  "setter": false,
1011
946
  "reflect": false,
947
+ "attribute": "label-hide",
1012
948
  "defaultValue": "false"
1013
949
  },
1014
950
  "placeholder": {
1015
951
  "type": "string",
1016
- "attribute": "placeholder",
1017
952
  "mutable": false,
1018
953
  "complexType": {
1019
954
  "original": "string",
@@ -1028,11 +963,11 @@ export class MgInputCombobox {
1028
963
  },
1029
964
  "getter": false,
1030
965
  "setter": false,
1031
- "reflect": false
966
+ "reflect": false,
967
+ "attribute": "placeholder"
1032
968
  },
1033
969
  "required": {
1034
970
  "type": "boolean",
1035
- "attribute": "required",
1036
971
  "mutable": false,
1037
972
  "complexType": {
1038
973
  "original": "boolean",
@@ -1048,11 +983,11 @@ export class MgInputCombobox {
1048
983
  "getter": false,
1049
984
  "setter": false,
1050
985
  "reflect": false,
986
+ "attribute": "required",
1051
987
  "defaultValue": "false"
1052
988
  },
1053
989
  "readonly": {
1054
990
  "type": "boolean",
1055
- "attribute": "readonly",
1056
991
  "mutable": false,
1057
992
  "complexType": {
1058
993
  "original": "boolean",
@@ -1068,11 +1003,11 @@ export class MgInputCombobox {
1068
1003
  "getter": false,
1069
1004
  "setter": false,
1070
1005
  "reflect": false,
1006
+ "attribute": "readonly",
1071
1007
  "defaultValue": "false"
1072
1008
  },
1073
1009
  "disabled": {
1074
1010
  "type": "boolean",
1075
- "attribute": "disabled",
1076
1011
  "mutable": false,
1077
1012
  "complexType": {
1078
1013
  "original": "boolean",
@@ -1088,11 +1023,11 @@ export class MgInputCombobox {
1088
1023
  "getter": false,
1089
1024
  "setter": false,
1090
1025
  "reflect": false,
1026
+ "attribute": "disabled",
1091
1027
  "defaultValue": "false"
1092
1028
  },
1093
1029
  "mgWidth": {
1094
1030
  "type": "any",
1095
- "attribute": "mg-width",
1096
1031
  "mutable": false,
1097
1032
  "complexType": {
1098
1033
  "original": "Width",
@@ -1114,11 +1049,11 @@ export class MgInputCombobox {
1114
1049
  "getter": false,
1115
1050
  "setter": false,
1116
1051
  "reflect": false,
1052
+ "attribute": "mg-width",
1117
1053
  "defaultValue": "'full'"
1118
1054
  },
1119
1055
  "tooltip": {
1120
1056
  "type": "string",
1121
- "attribute": "tooltip",
1122
1057
  "mutable": false,
1123
1058
  "complexType": {
1124
1059
  "original": "string",
@@ -1133,11 +1068,11 @@ export class MgInputCombobox {
1133
1068
  },
1134
1069
  "getter": false,
1135
1070
  "setter": false,
1136
- "reflect": false
1071
+ "reflect": false,
1072
+ "attribute": "tooltip"
1137
1073
  },
1138
1074
  "tooltipPosition": {
1139
1075
  "type": "string",
1140
- "attribute": "tooltip-position",
1141
1076
  "mutable": false,
1142
1077
  "complexType": {
1143
1078
  "original": "TooltipPosition",
@@ -1159,11 +1094,11 @@ export class MgInputCombobox {
1159
1094
  "getter": false,
1160
1095
  "setter": false,
1161
1096
  "reflect": false,
1097
+ "attribute": "tooltip-position",
1162
1098
  "defaultValue": "'input'"
1163
1099
  },
1164
1100
  "helpText": {
1165
1101
  "type": "string",
1166
- "attribute": "help-text",
1167
1102
  "mutable": false,
1168
1103
  "complexType": {
1169
1104
  "original": "string",
@@ -1178,11 +1113,11 @@ export class MgInputCombobox {
1178
1113
  },
1179
1114
  "getter": false,
1180
1115
  "setter": false,
1181
- "reflect": false
1116
+ "reflect": false,
1117
+ "attribute": "help-text"
1182
1118
  },
1183
1119
  "fetchurl": {
1184
1120
  "type": "string",
1185
- "attribute": "fetchurl",
1186
1121
  "mutable": false,
1187
1122
  "complexType": {
1188
1123
  "original": "string | URL",
@@ -1205,11 +1140,11 @@ export class MgInputCombobox {
1205
1140
  },
1206
1141
  "getter": false,
1207
1142
  "setter": false,
1208
- "reflect": false
1143
+ "reflect": false,
1144
+ "attribute": "fetchurl"
1209
1145
  },
1210
1146
  "fetchoptions": {
1211
1147
  "type": "unknown",
1212
- "attribute": "fetchoptions",
1213
1148
  "mutable": false,
1214
1149
  "complexType": {
1215
1150
  "original": "RequestInit",
@@ -1238,7 +1173,6 @@ export class MgInputCombobox {
1238
1173
  },
1239
1174
  "fetchmappings": {
1240
1175
  "type": "unknown",
1241
- "attribute": "fetchmappings",
1242
1176
  "mutable": false,
1243
1177
  "complexType": {
1244
1178
  "original": "{ request: RequestMappingType; response: ResponseMappingType }",
@@ -1268,28 +1202,8 @@ export class MgInputCombobox {
1268
1202
  "getter": false,
1269
1203
  "setter": false
1270
1204
  },
1271
- "noValueErrorDetail": {
1272
- "type": "string",
1273
- "attribute": "no-value-error-detail",
1274
- "mutable": false,
1275
- "complexType": {
1276
- "original": "string",
1277
- "resolved": "string",
1278
- "references": {}
1279
- },
1280
- "required": false,
1281
- "optional": true,
1282
- "docs": {
1283
- "tags": [],
1284
- "text": "Define no value error detail"
1285
- },
1286
- "getter": false,
1287
- "setter": false,
1288
- "reflect": false
1289
- },
1290
1205
  "valid": {
1291
1206
  "type": "boolean",
1292
- "attribute": "valid",
1293
1207
  "mutable": true,
1294
1208
  "complexType": {
1295
1209
  "original": "boolean",
@@ -1304,11 +1218,11 @@ export class MgInputCombobox {
1304
1218
  },
1305
1219
  "getter": false,
1306
1220
  "setter": false,
1307
- "reflect": false
1221
+ "reflect": false,
1222
+ "attribute": "valid"
1308
1223
  },
1309
1224
  "invalid": {
1310
1225
  "type": "boolean",
1311
- "attribute": "invalid",
1312
1226
  "mutable": true,
1313
1227
  "complexType": {
1314
1228
  "original": "boolean",
@@ -1323,7 +1237,8 @@ export class MgInputCombobox {
1323
1237
  },
1324
1238
  "getter": false,
1325
1239
  "setter": false,
1326
- "reflect": false
1240
+ "reflect": false,
1241
+ "attribute": "invalid"
1327
1242
  }
1328
1243
  };
1329
1244
  }