@sankhyalabs/ezui 2.2.3 → 2.3.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 (63) hide show
  1. package/dist/cjs/ez-chip.cjs.entry.js +1 -1
  2. package/dist/cjs/ez-combo-box.cjs.entry.js +2 -7
  3. package/dist/cjs/ez-date-input.cjs.entry.js +2 -10
  4. package/dist/cjs/ez-date-time-input.cjs.entry.js +2 -10
  5. package/dist/cjs/ez-filter-input.cjs.entry.js +2 -7
  6. package/dist/cjs/ez-form.cjs.entry.js +1 -1
  7. package/dist/cjs/ez-number-input.cjs.entry.js +2 -7
  8. package/dist/cjs/ez-search.cjs.entry.js +2 -7
  9. package/dist/cjs/ez-tabselector.cjs.entry.js +4 -4
  10. package/dist/cjs/ez-text-area.cjs.entry.js +2 -7
  11. package/dist/cjs/ez-text-edit.cjs.entry.js +2 -7
  12. package/dist/cjs/ez-text-input.cjs.entry.js +2 -7
  13. package/dist/cjs/ez-time-input.cjs.entry.js +2 -7
  14. package/dist/collection/components/ez-chip/ez-chip.js +1 -1
  15. package/dist/collection/components/ez-combo-box/ez-combo-box.js +2 -7
  16. package/dist/collection/components/ez-date-input/ez-date-input.js +3 -11
  17. package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +3 -11
  18. package/dist/collection/components/ez-filter-input/ez-filter-input.js +2 -7
  19. package/dist/collection/components/ez-form/ez-form.js +1 -1
  20. package/dist/collection/components/ez-number-input/ez-number-input.js +2 -7
  21. package/dist/collection/components/ez-search/ez-search.js +2 -7
  22. package/dist/collection/components/ez-tabselector/ez-tabselector.js +4 -4
  23. package/dist/collection/components/ez-text-area/ez-text-area.js +2 -7
  24. package/dist/collection/components/ez-text-edit/ez-text-edit.js +2 -7
  25. package/dist/collection/components/ez-text-input/ez-text-input.js +2 -7
  26. package/dist/collection/components/ez-time-input/ez-time-input.js +2 -7
  27. package/dist/custom-elements/index.js +26 -82
  28. package/dist/esm/ez-chip.entry.js +1 -1
  29. package/dist/esm/ez-combo-box.entry.js +2 -7
  30. package/dist/esm/ez-date-input.entry.js +2 -10
  31. package/dist/esm/ez-date-time-input.entry.js +2 -10
  32. package/dist/esm/ez-filter-input.entry.js +2 -7
  33. package/dist/esm/ez-form.entry.js +1 -1
  34. package/dist/esm/ez-number-input.entry.js +2 -7
  35. package/dist/esm/ez-search.entry.js +2 -7
  36. package/dist/esm/ez-tabselector.entry.js +4 -4
  37. package/dist/esm/ez-text-area.entry.js +2 -7
  38. package/dist/esm/ez-text-edit.entry.js +2 -7
  39. package/dist/esm/ez-text-input.entry.js +2 -7
  40. package/dist/esm/ez-time-input.entry.js +2 -7
  41. package/dist/ezui/ezui.esm.js +1 -1
  42. package/dist/ezui/{p-b484a0b3.entry.js → p-0fb5f4be.entry.js} +1 -1
  43. package/dist/ezui/p-66ebdf34.entry.js +1 -0
  44. package/dist/ezui/p-6bcf35fd.entry.js +1 -0
  45. package/dist/ezui/{p-587e8dca.entry.js → p-72d755a8.entry.js} +1 -1
  46. package/dist/ezui/p-7cf71eb3.entry.js +1 -0
  47. package/dist/ezui/{p-107aff56.entry.js → p-81fb0c90.entry.js} +1 -1
  48. package/dist/ezui/p-855f99f8.entry.js +1 -0
  49. package/dist/ezui/{p-8eae779b.entry.js → p-941d9bf9.entry.js} +1 -1
  50. package/dist/ezui/p-ac15d77e.entry.js +1 -0
  51. package/dist/ezui/p-c2ebc450.entry.js +1 -0
  52. package/dist/ezui/p-ca9a0a49.entry.js +1 -0
  53. package/dist/ezui/{p-a595dd4e.entry.js → p-cba61296.entry.js} +1 -1
  54. package/dist/ezui/p-f4d2438e.entry.js +1 -0
  55. package/package.json +2 -2
  56. package/dist/ezui/p-019c7fc4.entry.js +0 -1
  57. package/dist/ezui/p-4b2595f4.entry.js +0 -1
  58. package/dist/ezui/p-6a8e7fb2.entry.js +0 -1
  59. package/dist/ezui/p-74e6c2a9.entry.js +0 -1
  60. package/dist/ezui/p-7b8d1f1c.entry.js +0 -1
  61. package/dist/ezui/p-c55f63c6.entry.js +0 -1
  62. package/dist/ezui/p-dff2b725.entry.js +0 -1
  63. package/dist/ezui/p-fe578dc0.entry.js +0 -1
@@ -826,7 +826,7 @@ let EzChip$1 = class extends HTMLElement$1 {
826
826
  if (this._containerElem) {
827
827
  this.observeValue();
828
828
  this.observeEnabled();
829
- this._containerElem.setAttribute("data-element-id", 'ezChip_internal_button');
829
+ this._containerElem.setAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME, 'ezChip_internal_button');
830
830
  ElementIDUtils.addIDInfo(this._containerElem);
831
831
  }
832
832
  }
@@ -1331,12 +1331,6 @@ let EzComboBox$1 = class extends HTMLElement$1 {
1331
1331
  componentDidLoad() {
1332
1332
  CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
1333
1333
  this.setInputValue(false);
1334
- if (this.el) {
1335
- ElementIDUtils.addIDInfo(this.el, 'input');
1336
- if (this._textInput) {
1337
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this.el.getAttribute("data-element-id") });
1338
- }
1339
- }
1340
1334
  }
1341
1335
  //---------------------------------------------
1342
1336
  // Event handlers
@@ -1429,7 +1423,8 @@ let EzComboBox$1 = class extends HTMLElement$1 {
1429
1423
  }
1430
1424
  render() {
1431
1425
  var _a;
1432
- return (h(Host, null, h("ez-text-input", { class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: this.searchMode ? "leftIcon" : "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: this.searchMode ? "search" : "chevron-down" })), this.searchMode && ((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value)
1426
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
1427
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: this.searchMode ? "leftIcon" : "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: this.searchMode ? "search" : "chevron-down" })), this.searchMode && ((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value)
1433
1428
  ? h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, h("ez-icon", { iconName: "close" }))
1434
1429
  : undefined), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("div", { class: "list-options", ref: elem => this._optionsList = elem }, this._visibleOptions.length === 0
1435
1430
  && h("div", { class: "message" }, !this._showLoading && h("span", { class: "message__no-result" }, this._textEmptyList), this._showLoading && h("div", { class: "message__loading" })), this.showOptionValue
@@ -1588,18 +1583,10 @@ let EzDateInput$1 = class extends HTMLElement$1 {
1588
1583
  componentDidLoad() {
1589
1584
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
1590
1585
  this.setInputValue();
1591
- if (this._elem) {
1592
- ElementIDUtils.addIDInfo(this._elem, 'input');
1593
- if (this._textInput) {
1594
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
1595
- }
1596
- if (this._calendar) {
1597
- ElementIDUtils.addIDInfo(this._calendar, 'internal_calendar', { id: this._elem.getAttribute("data-element-id") });
1598
- }
1599
- }
1600
1586
  }
1601
1587
  render() {
1602
- return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
1588
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
1589
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
1603
1590
  }
1604
1591
  get _elem() { return this; }
1605
1592
  static get watchers() { return {
@@ -1803,18 +1790,10 @@ let EzDateTimeInput$1 = class extends HTMLElement$1 {
1803
1790
  componentDidLoad() {
1804
1791
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
1805
1792
  this.setInputValue();
1806
- if (this._elem) {
1807
- ElementIDUtils.addIDInfo(this._elem, 'input');
1808
- if (this._textInput) {
1809
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
1810
- }
1811
- if (this._calendar) {
1812
- ElementIDUtils.addIDInfo(this._calendar, 'internal_calendar', { id: this._elem.getAttribute("data-element-id") });
1813
- }
1814
- }
1815
1793
  }
1816
1794
  render() {
1817
- return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick() }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
1795
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
1796
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick() }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "calendar"), onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
1818
1797
  }
1819
1798
  get _elem() { return this; }
1820
1799
  static get watchers() { return {
@@ -2026,15 +2005,10 @@ let EzFilterInput$1 = class extends HTMLElement$1 {
2026
2005
  }
2027
2006
  componentDidLoad() {
2028
2007
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
2029
- if (this._elem) {
2030
- ElementIDUtils.addIDInfo(this._elem, 'input');
2031
- if (this._textInput) {
2032
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
2033
- }
2034
- }
2035
2008
  }
2036
2009
  render() {
2037
- return (h("ez-text-input", { ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.changeValue(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, loading: this.loading, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "search" })));
2010
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
2011
+ return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.changeValue(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, loading: this.loading, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "search" })));
2038
2012
  }
2039
2013
  get _elem() { return this; }
2040
2014
  static get watchers() { return {
@@ -3064,7 +3038,7 @@ let EzForm$1 = class extends HTMLElement$1 {
3064
3038
  }
3065
3039
  buildIdTabSelector(tabs) {
3066
3040
  if (tabs) {
3067
- tabs.forEach(tab => tab["data-element-id"] = `${this._dataElementIdEzForm}_${StringUtils$1.toCamelCase(tab.label)}`);
3041
+ tabs.forEach(tab => tab[ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME] = `${this._dataElementIdEzForm}_${StringUtils$1.toCamelCase(tab.label)}`);
3068
3042
  }
3069
3043
  return tabs;
3070
3044
  }
@@ -119284,15 +119258,10 @@ let EzNumberInput$1 = class extends HTMLElement$1 {
119284
119258
  componentDidLoad() {
119285
119259
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
119286
119260
  this.setInputValue();
119287
- if (this._elem) {
119288
- ElementIDUtils.addIDInfo(this._elem, 'input');
119289
- if (this._textInput) {
119290
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
119291
- }
119292
- }
119293
119261
  }
119294
119262
  render() {
119295
- return (h("ez-text-input", { ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }));
119263
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
119264
+ return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }));
119296
119265
  }
119297
119266
  get _elem() { return this; }
119298
119267
  static get watchers() { return {
@@ -119788,15 +119757,10 @@ let EzSearch$1 = class extends HTMLElement$1 {
119788
119757
  }
119789
119758
  componentDidLoad() {
119790
119759
  CSSVarsUtils.applyVarsTextInput(this._elem, this._comboElement);
119791
- if (this._elem) {
119792
- ElementIDUtils.addIDInfo(this._elem, 'input');
119793
- if (this._comboElement) {
119794
- ElementIDUtils.addIDInfo(this._comboElement, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
119795
- }
119796
- }
119797
119760
  }
119798
119761
  render() {
119799
- return (h("ez-combo-box", { ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode }));
119762
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
119763
+ return (h("ez-combo-box", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "combo"), ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode }));
119800
119764
  }
119801
119765
  ;
119802
119766
  get _elem() { return this; }
@@ -119913,7 +119877,7 @@ let EzTabselector$1 = class extends HTMLElement$1 {
119913
119877
  }
119914
119878
  componentDidLoad() {
119915
119879
  this._hostElem.shadowRoot.querySelectorAll('button[name="tab-button"]').forEach((elem) => {
119916
- const elemIdTabSelector = this._hostElem.getAttribute("data-element-id");
119880
+ const elemIdTabSelector = this._hostElem.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME);
119917
119881
  const dataInfo = { id: `${elemIdTabSelector}_${StringUtils$1.toCamelCase(elem.id)}` };
119918
119882
  ElementIDUtils.addIDInfo(elem, null, dataInfo);
119919
119883
  });
@@ -120005,10 +119969,10 @@ let EzTabselector$1 = class extends HTMLElement$1 {
120005
119969
  }
120006
119970
  buildElementIdTab(tabs) {
120007
119971
  tabs.forEach(tab => {
120008
- if (!tab.hasOwnProperty("data-element-id")) {
120009
- const elemIdTabSelector = this._hostElem.getAttribute("data-element-id");
119972
+ if (!tab.hasOwnProperty(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME)) {
119973
+ const elemIdTabSelector = this._hostElem.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME);
120010
119974
  const dataElementID = `${elemIdTabSelector}_${StringUtils$1.toCamelCase(tab.tabKey)}`;
120011
- tab["data-element-id"] = dataElementID;
119975
+ tab[ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME] = dataElementID;
120012
119976
  }
120013
119977
  });
120014
119978
  }
@@ -120171,17 +120135,12 @@ let EzTextArea$1 = class extends HTMLElement$1 {
120171
120135
  this.observeErrorMessage();
120172
120136
  this.adjustFloatingLabel();
120173
120137
  this.observeMode();
120174
- if (this._hostElement) {
120175
- ElementIDUtils.addIDInfo(this._hostElement, 'input');
120176
- if (this._inputElem) {
120177
- ElementIDUtils.addIDInfo(this._inputElem, 'internal_input', { id: this._hostElement.getAttribute("data-element-id") });
120178
- }
120179
- }
120180
120138
  }
120181
120139
  render() {
120140
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
120182
120141
  return (h(Host, null, h("div", { class: "textarea", ref: (el) => this._container = el }, this.label && this.mode != "slim" ?
120183
120142
  h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "textarea__label" : "textarea__label textarea__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
120184
- : null, h("textarea", { onFocus: () => this.handleFocus(), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class: this.mode === "slim" ? "textarea--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, onKeyDown: event => event.stopPropagation(), rows: this.rows })), this.canShowError && this.mode != "slim" &&
120143
+ : null, h("textarea", { onFocus: () => this.handleFocus(), "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "input"), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class: this.mode === "slim" ? "textarea--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, onKeyDown: event => event.stopPropagation(), rows: this.rows })), this.canShowError && this.mode != "slim" &&
120185
120144
  h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
120186
120145
  }
120187
120146
  get _hostElement() { return this; }
@@ -120278,18 +120237,13 @@ let EzTextEdit$1 = class extends HTMLElement$1 {
120278
120237
  componentDidLoad() {
120279
120238
  this.applyFocusSelect();
120280
120239
  this.setNewValue(this.value);
120281
- if (this._element) {
120282
- ElementIDUtils.addIDInfo(this._element, 'input');
120283
- if (this._inputElement) {
120284
- ElementIDUtils.addIDInfo(this._inputElement, 'internal_input', { id: this._element.getAttribute("data-element-id") });
120285
- }
120286
- }
120287
120240
  }
120288
120241
  componentDidRender() {
120289
120242
  this.setStyledInput();
120290
120243
  }
120291
120244
  render() {
120292
- return (h(Host, null, h("span", { class: "text-edit__hidden-value", ref: elem => this._valueBasis = elem }), h("ez-text-input", { onInput: () => { this.calcSizeInput(this._newValue); }, class: "text-edit__form-input", value: this._newValue, ref: (elem) => this._inputElement = elem, mode: "slim", onEzChange: (evt) => this.setNewValue(evt === null || evt === void 0 ? void 0 : evt.detail), noBorder: true }), h("ez-button", { class: "text-edit__icon-check", mode: "icon", iconName: "check", size: "small", onClick: () => { this.handleSaveEdition(); } }), h("ez-button", { class: "text-edit__icon-close", mode: "icon", iconName: "close", size: "small", onClick: () => { this.cancelEdition.emit(); } })));
120245
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._element, 'input');
120246
+ return (h(Host, null, h("span", { class: "text-edit__hidden-value", ref: elem => this._valueBasis = elem }), h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), onInput: () => { this.calcSizeInput(this._newValue); }, class: "text-edit__form-input", value: this._newValue, ref: (elem) => this._inputElement = elem, mode: "slim", onEzChange: (evt) => this.setNewValue(evt === null || evt === void 0 ? void 0 : evt.detail), noBorder: true }), h("ez-button", { class: "text-edit__icon-check", mode: "icon", iconName: "check", size: "small", onClick: () => { this.handleSaveEdition(); } }), h("ez-button", { class: "text-edit__icon-close", mode: "icon", iconName: "close", size: "small", onClick: () => { this.cancelEdition.emit(); } })));
120293
120247
  }
120294
120248
  get _element() { return this; }
120295
120249
  static get style() { return ezTextEditCss; }
@@ -120505,12 +120459,6 @@ let EzTextInput$1 = class extends HTMLElement$1 {
120505
120459
  this.observeMask();
120506
120460
  this.adjustFloatingLabel();
120507
120461
  this.adjustBorderInput();
120508
- if (this._hostElement) {
120509
- ElementIDUtils.addIDInfo(this._hostElement, 'input');
120510
- if (this._inputElem) {
120511
- ElementIDUtils.addIDInfo(this._inputElem, 'internal_input', { id: this._hostElement.getAttribute("data-element-id") });
120512
- }
120513
- }
120514
120462
  }
120515
120463
  componentWillLoad() {
120516
120464
  this.observeMask();
@@ -120530,9 +120478,10 @@ let EzTextInput$1 = class extends HTMLElement$1 {
120530
120478
  }
120531
120479
  }
120532
120480
  render() {
120481
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
120533
120482
  return (h(Host, null, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label && this.mode != "slim" ?
120534
120483
  h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
120535
- : null, h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
120484
+ : null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
120536
120485
  h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
120537
120486
  }
120538
120487
  get _hostElement() { return this; }
@@ -120682,12 +120631,6 @@ let EzTimeInput$1 = class extends HTMLElement$1 {
120682
120631
  //---------------------------------------------
120683
120632
  componentDidLoad() {
120684
120633
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
120685
- if (this._elem) {
120686
- ElementIDUtils.addIDInfo(this._elem, 'input');
120687
- if (this._textInput) {
120688
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
120689
- }
120690
- }
120691
120634
  }
120692
120635
  componentWillLoad() {
120693
120636
  this.observeShowSeconds();
@@ -120699,7 +120642,8 @@ let EzTimeInput$1 = class extends HTMLElement$1 {
120699
120642
  }
120700
120643
  }
120701
120644
  render() {
120702
- return (h(Host, null, h("ez-text-input", { ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
120645
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
120646
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
120703
120647
  }
120704
120648
  static get assetsDirs() { return ["../assets"]; }
120705
120649
  get _elem() { return this; }
@@ -92,7 +92,7 @@ let EzChip = class {
92
92
  if (this._containerElem) {
93
93
  this.observeValue();
94
94
  this.observeEnabled();
95
- this._containerElem.setAttribute("data-element-id", 'ezChip_internal_button');
95
+ this._containerElem.setAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME, 'ezChip_internal_button');
96
96
  ElementIDUtils.addIDInfo(this._containerElem);
97
97
  }
98
98
  }
@@ -355,12 +355,6 @@ let EzComboBox = class {
355
355
  componentDidLoad() {
356
356
  CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
357
357
  this.setInputValue(false);
358
- if (this.el) {
359
- ElementIDUtils.addIDInfo(this.el, 'input');
360
- if (this._textInput) {
361
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this.el.getAttribute("data-element-id") });
362
- }
363
- }
364
358
  }
365
359
  //---------------------------------------------
366
360
  // Event handlers
@@ -453,7 +447,8 @@ let EzComboBox = class {
453
447
  }
454
448
  render() {
455
449
  var _a;
456
- return (h(Host, null, h("ez-text-input", { class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: this.searchMode ? "leftIcon" : "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: this.searchMode ? "search" : "chevron-down" })), this.searchMode && ((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value)
450
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
451
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: this.searchMode ? "leftIcon" : "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: this.searchMode ? "search" : "chevron-down" })), this.searchMode && ((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value)
457
452
  ? h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, h("ez-icon", { iconName: "close" }))
458
453
  : undefined), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("div", { class: "list-options", ref: elem => this._optionsList = elem }, this._visibleOptions.length === 0
459
454
  && h("div", { class: "message" }, !this._showLoading && h("span", { class: "message__no-result" }, this._textEmptyList), this._showLoading && h("div", { class: "message__loading" })), this.showOptionValue
@@ -138,18 +138,10 @@ let EzDateInput = class {
138
138
  componentDidLoad() {
139
139
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
140
140
  this.setInputValue();
141
- if (this._elem) {
142
- ElementIDUtils.addIDInfo(this._elem, 'input');
143
- if (this._textInput) {
144
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
145
- }
146
- if (this._calendar) {
147
- ElementIDUtils.addIDInfo(this._calendar, 'internal_calendar', { id: this._elem.getAttribute("data-element-id") });
148
- }
149
- }
150
141
  }
151
142
  render() {
152
- return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
143
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
144
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
153
145
  }
154
146
  get _elem() { return getElement(this); }
155
147
  static get watchers() { return {
@@ -193,18 +193,10 @@ let EzDateTimeInput = class {
193
193
  componentDidLoad() {
194
194
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
195
195
  this.setInputValue();
196
- if (this._elem) {
197
- ElementIDUtils.addIDInfo(this._elem, 'input');
198
- if (this._textInput) {
199
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
200
- }
201
- if (this._calendar) {
202
- ElementIDUtils.addIDInfo(this._calendar, 'internal_calendar', { id: this._elem.getAttribute("data-element-id") });
203
- }
204
- }
205
196
  }
206
197
  render() {
207
- return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick() }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
198
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
199
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick() }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "calendar"), onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
208
200
  }
209
201
  get _elem() { return getElement(this); }
210
202
  static get watchers() { return {
@@ -60,15 +60,10 @@ let EzFilterInput = class {
60
60
  }
61
61
  componentDidLoad() {
62
62
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
63
- if (this._elem) {
64
- ElementIDUtils.addIDInfo(this._elem, 'input');
65
- if (this._textInput) {
66
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
67
- }
68
- }
69
63
  }
70
64
  render() {
71
- return (h("ez-text-input", { ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.changeValue(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, loading: this.loading, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "search" })));
65
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
66
+ return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.changeValue(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, loading: this.loading, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "search" })));
72
67
  }
73
68
  get _elem() { return getElement(this); }
74
69
  static get watchers() { return {
@@ -1022,7 +1022,7 @@ let EzForm = class {
1022
1022
  }
1023
1023
  buildIdTabSelector(tabs) {
1024
1024
  if (tabs) {
1025
- tabs.forEach(tab => tab["data-element-id"] = `${this._dataElementIdEzForm}_${StringUtils.toCamelCase(tab.label)}`);
1025
+ tabs.forEach(tab => tab[ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME] = `${this._dataElementIdEzForm}_${StringUtils.toCamelCase(tab.label)}`);
1026
1026
  }
1027
1027
  return tabs;
1028
1028
  }
@@ -133,15 +133,10 @@ let EzNumberInput = class {
133
133
  componentDidLoad() {
134
134
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
135
135
  this.setInputValue();
136
- if (this._elem) {
137
- ElementIDUtils.addIDInfo(this._elem, 'input');
138
- if (this._textInput) {
139
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
140
- }
141
- }
142
136
  }
143
137
  render() {
144
- return (h("ez-text-input", { ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }));
138
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
139
+ return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode }));
145
140
  }
146
141
  get _elem() { return getElement(this); }
147
142
  static get watchers() { return {
@@ -68,15 +68,10 @@ let EzSearch = class {
68
68
  }
69
69
  componentDidLoad() {
70
70
  CSSVarsUtils.applyVarsTextInput(this._elem, this._comboElement);
71
- if (this._elem) {
72
- ElementIDUtils.addIDInfo(this._elem, 'input');
73
- if (this._comboElement) {
74
- ElementIDUtils.addIDInfo(this._comboElement, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
75
- }
76
- }
77
71
  }
78
72
  render() {
79
- return (h("ez-combo-box", { ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode }));
73
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
74
+ return (h("ez-combo-box", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "combo"), ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: event => this.onComboChange(event), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue, suppressEmptyOption: this.suppressEmptyOption, mode: this.mode }));
80
75
  }
81
76
  ;
82
77
  get _elem() { return getElement(this); }
@@ -105,7 +105,7 @@ let EzTabselector = class {
105
105
  }
106
106
  componentDidLoad() {
107
107
  this._hostElem.shadowRoot.querySelectorAll('button[name="tab-button"]').forEach((elem) => {
108
- const elemIdTabSelector = this._hostElem.getAttribute("data-element-id");
108
+ const elemIdTabSelector = this._hostElem.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME);
109
109
  const dataInfo = { id: `${elemIdTabSelector}_${StringUtils.toCamelCase(elem.id)}` };
110
110
  ElementIDUtils.addIDInfo(elem, null, dataInfo);
111
111
  });
@@ -197,10 +197,10 @@ let EzTabselector = class {
197
197
  }
198
198
  buildElementIdTab(tabs) {
199
199
  tabs.forEach(tab => {
200
- if (!tab.hasOwnProperty("data-element-id")) {
201
- const elemIdTabSelector = this._hostElem.getAttribute("data-element-id");
200
+ if (!tab.hasOwnProperty(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME)) {
201
+ const elemIdTabSelector = this._hostElem.getAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME);
202
202
  const dataElementID = `${elemIdTabSelector}_${StringUtils.toCamelCase(tab.tabKey)}`;
203
- tab["data-element-id"] = dataElementID;
203
+ tab[ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME] = dataElementID;
204
204
  }
205
205
  });
206
206
  }
@@ -139,17 +139,12 @@ let EzTextArea = class {
139
139
  this.observeErrorMessage();
140
140
  this.adjustFloatingLabel();
141
141
  this.observeMode();
142
- if (this._hostElement) {
143
- ElementIDUtils.addIDInfo(this._hostElement, 'input');
144
- if (this._inputElem) {
145
- ElementIDUtils.addIDInfo(this._inputElem, 'internal_input', { id: this._hostElement.getAttribute("data-element-id") });
146
- }
147
- }
148
142
  }
149
143
  render() {
144
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
150
145
  return (h(Host, null, h("div", { class: "textarea", ref: (el) => this._container = el }, this.label && this.mode != "slim" ?
151
146
  h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "textarea__label" : "textarea__label textarea__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
152
- : null, h("textarea", { onFocus: () => this.handleFocus(), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class: this.mode === "slim" ? "textarea--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, onKeyDown: event => event.stopPropagation(), rows: this.rows })), this.canShowError && this.mode != "slim" &&
147
+ : null, h("textarea", { onFocus: () => this.handleFocus(), "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "input"), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class: this.mode === "slim" ? "textarea--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, onKeyDown: event => event.stopPropagation(), rows: this.rows })), this.canShowError && this.mode != "slim" &&
153
148
  h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
154
149
  }
155
150
  get _hostElement() { return getElement(this); }
@@ -86,18 +86,13 @@ let EzTextEdit = class {
86
86
  componentDidLoad() {
87
87
  this.applyFocusSelect();
88
88
  this.setNewValue(this.value);
89
- if (this._element) {
90
- ElementIDUtils.addIDInfo(this._element, 'input');
91
- if (this._inputElement) {
92
- ElementIDUtils.addIDInfo(this._inputElement, 'internal_input', { id: this._element.getAttribute("data-element-id") });
93
- }
94
- }
95
89
  }
96
90
  componentDidRender() {
97
91
  this.setStyledInput();
98
92
  }
99
93
  render() {
100
- return (h(Host, null, h("span", { class: "text-edit__hidden-value", ref: elem => this._valueBasis = elem }), h("ez-text-input", { onInput: () => { this.calcSizeInput(this._newValue); }, class: "text-edit__form-input", value: this._newValue, ref: (elem) => this._inputElement = elem, mode: "slim", onEzChange: (evt) => this.setNewValue(evt === null || evt === void 0 ? void 0 : evt.detail), noBorder: true }), h("ez-button", { class: "text-edit__icon-check", mode: "icon", iconName: "check", size: "small", onClick: () => { this.handleSaveEdition(); } }), h("ez-button", { class: "text-edit__icon-close", mode: "icon", iconName: "close", size: "small", onClick: () => { this.cancelEdition.emit(); } })));
94
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._element, 'input');
95
+ return (h(Host, null, h("span", { class: "text-edit__hidden-value", ref: elem => this._valueBasis = elem }), h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), onInput: () => { this.calcSizeInput(this._newValue); }, class: "text-edit__form-input", value: this._newValue, ref: (elem) => this._inputElement = elem, mode: "slim", onEzChange: (evt) => this.setNewValue(evt === null || evt === void 0 ? void 0 : evt.detail), noBorder: true }), h("ez-button", { class: "text-edit__icon-check", mode: "icon", iconName: "check", size: "small", onClick: () => { this.handleSaveEdition(); } }), h("ez-button", { class: "text-edit__icon-close", mode: "icon", iconName: "close", size: "small", onClick: () => { this.cancelEdition.emit(); } })));
101
96
  }
102
97
  get _element() { return getElement(this); }
103
98
  };
@@ -209,12 +209,6 @@ let EzTextInput = class {
209
209
  this.observeMask();
210
210
  this.adjustFloatingLabel();
211
211
  this.adjustBorderInput();
212
- if (this._hostElement) {
213
- ElementIDUtils.addIDInfo(this._hostElement, 'input');
214
- if (this._inputElem) {
215
- ElementIDUtils.addIDInfo(this._inputElem, 'internal_input', { id: this._hostElement.getAttribute("data-element-id") });
216
- }
217
- }
218
212
  }
219
213
  componentWillLoad() {
220
214
  this.observeMask();
@@ -234,9 +228,10 @@ let EzTextInput = class {
234
228
  }
235
229
  }
236
230
  render() {
231
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
237
232
  return (h(Host, null, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label && this.mode != "slim" ?
238
233
  h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
239
- : null, h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
234
+ : null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
240
235
  h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
241
236
  }
242
237
  get _hostElement() { return getElement(this); }
@@ -138,12 +138,6 @@ let EzTimeInput = class {
138
138
  //---------------------------------------------
139
139
  componentDidLoad() {
140
140
  CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
141
- if (this._elem) {
142
- ElementIDUtils.addIDInfo(this._elem, 'input');
143
- if (this._textInput) {
144
- ElementIDUtils.addIDInfo(this._textInput, 'internal_input', { id: this._elem.getAttribute("data-element-id") });
145
- }
146
- }
147
141
  }
148
142
  componentWillLoad() {
149
143
  this.observeShowSeconds();
@@ -155,7 +149,8 @@ let EzTimeInput = class {
155
149
  }
156
150
  }
157
151
  render() {
158
- return (h(Host, null, h("ez-text-input", { ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
152
+ let elementId = ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
153
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo(elementId, "textInput"), ref: (el) => this._textInput = el, "data-slave-mode": "true", value: this._viewValue, enabled: this.enabled, label: this.label, restrict: "0123456789:", onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), errorMessage: this.errorMessage, mode: this.mode }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
159
154
  }
160
155
  static get assetsDirs() { return ["../assets"]; }
161
156
  get _elem() { return getElement(this); }
@@ -1 +1 @@
1
- import{p as e,b as o}from"./p-3c7ea91b.js";(()=>{const o=import.meta.url,s={};return""!==o&&(s.resourcesUrl=new URL(".",o).href),e(s)})().then((e=>o([["p-8c2105a5",[[1,"ez-actions-button",{enabled:[516],actions:[1040],size:[513],showLabel:[516,"show-label"],displayIcon:[513,"display-icon"],checkOption:[516,"check-option"],value:[513],isTransparent:[516,"is-transparent"],arrowActive:[516,"arrow-active"],_selectedAction:[32],hideActions:[64],isOpened:[64]}]]],["p-f6afdc4d",[[1,"ez-dialog",{confirm:[1028],dialogType:[1025,"dialog-type"],message:[1025],opened:[1540],personalizedIconPath:[1025,"personalized-icon-path"],ezTitle:[1025,"ez-title"],handleButtonClick:[64],show:[64]}]]],["p-fe578dc0",[[1,"ez-filter-input",{label:[1],value:[1537],enabled:[4],loading:[516],errorMessage:[1537,"error-message"],restrict:[1],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-77b7b623",[[6,"ez-grid",{multipleSelection:[4,"multiple-selection"],config:[1040],serverUrl:[1,"server-url"],dataUnit:[16],statusResolver:[16],_paginationInfo:[32],setColumnsDef:[64],addColumnMenuItem:[64],setColumnsState:[64],setData:[64],getSelection:[64],getColumnsState:[64],getColumns:[64],quickFilter:[64]}]]],["p-def4cd05",[[6,"ez-modal-container",{modalTitle:[1,"modal-title"],modalSubTitle:[1,"modal-sub-title"],showTitleBar:[4,"show-title-bar"],cancelButtonLabel:[1,"cancel-button-label"],okButtonLabel:[1,"ok-button-label"],cancelButtonStatus:[1,"cancel-button-status"],okButtonStatus:[1,"ok-button-status"]}]]],["p-7b8d1f1c",[[1,"ez-chip",{label:[513],enabled:[516],removePosition:[513,"remove-position"],mode:[513],value:[1540],setFocus:[64],setBlur:[64]}]]],["p-1cc11468",[[0,"ez-application"]]],["p-3cfefc57",[[1,"ez-card-item",{item:[16]}]]],["p-42c6493e",[[1,"ez-list",{dataSource:[1040],useGroups:[1540,"use-groups"],ezDraggable:[1028,"ez-draggable"],ezSelectable:[1028,"ez-selectable"],itemSlotBuilder:[1040],_listItems:[32],_listGroupItems:[32],clearHistory:[64],scrollToTop:[64],setSelection:[64],getSelection:[64],getList:[64]}]]],["p-ed2135a5",[[1,"ez-loading-bar",{_showLoading:[32],hide:[64],show:[64]}]]],["p-7c227b86",[[1,"ez-modal",{modalSize:[1,"modal-size"],align:[1],opened:[1028],closeEsc:[4,"close-esc"],closeOutsideClick:[4,"close-outside-click"]}]]],["p-bffae598",[[1,"ez-popover",{autoClose:[516,"auto-close"],top:[1537],left:[1537],bottom:[1537],right:[1537],boxWidth:[513,"box-width"],opened:[1540],innerElement:[1537,"inner-element"],updatePosition:[64],show:[64],hide:[64]}]]],["p-cfcc23e6",[[1,"ez-popup",{size:[1],opened:[1540],useHeader:[1540,"use-header"],heightMode:[1537,"height-mode"],ezTitle:[1,"ez-title"]}]]],["p-e38c4efe",[[1,"ez-radio-button",{value:[1544],options:[1040],enabled:[516],label:[513],direction:[1537]}]]],["p-1ba371a3",[[1,"ez-scroller",{direction:[1],locked:[4],activeShadow:[4,"active-shadow"],isFirefox:[32]},[[2,"click","clickListener"],[1,"mousedown","mouseDownHandler"],[1,"mouseup","mouseUpHandler"],[1,"mousemove","mouseMoveHandler"]]]]],["p-482c3dd8",[[1,"ez-toast",{message:[1025],fadeTime:[1026,"fade-time"],useIcon:[1028,"use-icon"],canClose:[1028,"can-close"],show:[64]}]]],["p-04fab1e9",[[0,"ez-view-stack",{show:[64],getSelectedIndex:[64]}]]],["p-019c7fc4",[[1,"ez-text-input",{label:[513],value:[1537],enabled:[516],loading:[516],errorMessage:[1537,"error-message"],mask:[1],canShowError:[516,"can-show-error"],restrict:[1],mode:[513],noBorder:[516,"no-border"],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-8c874b58",[[1,"ez-collapsible-box",{value:[1540],label:[513],headerSize:[513,"header-size"],iconPlacement:[513,"icon-placement"],stretchTitle:[516,"stretch-title"],removable:[516],editable:[516],conditionalSave:[16],_activeEditText:[32],showHide:[64],applyFocusTextEdit:[64],cancelEdition:[64]}]]],["p-b484a0b3",[[1,"ez-search",{value:[1537],label:[1537],enabled:[1540],errorMessage:[1537,"error-message"],optionLoader:[16],showSelectedValue:[4,"show-selected-value"],showOptionValue:[4,"show-option-value"],suppressEmptyOption:[4,"suppress-empty-option"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-c55f63c6",[[1,"ez-date-input",{label:[513],value:[1040],enabled:[516],errorMessage:[1537,"error-message"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-4b2595f4",[[1,"ez-date-time-input",{label:[513],value:[1040],enabled:[516],errorMessage:[1537,"error-message"],showSeconds:[516,"show-seconds"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-587e8dca",[[1,"ez-time-input",{label:[513],value:[1026],enabled:[516],errorMessage:[1537,"error-message"],showSeconds:[516,"show-seconds"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-8eae779b",[[1,"ez-number-input",{label:[1],value:[1538],enabled:[4],errorMessage:[1537,"error-message"],precision:[2],prettyPrecision:[2,"pretty-precision"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-dff2b725",[[1,"ez-tabselector",{selectedIndex:[1538,"selected-index"],selectedTab:[1537,"selected-tab"],tabs:[1],_processedTabs:[32]}]]],["p-6700360e",[[1,"ez-check",{label:[513],value:[1540],enabled:[1540],indeterminate:[4],mode:[513],getMode:[64],setFocus:[64]}]]],["p-74e6c2a9",[[1,"ez-text-area",{label:[513],value:[1537],enabled:[516],loading:[516],errorMessage:[1537,"error-message"],rows:[1538],canShowError:[516,"can-show-error"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-a713a1aa",[[1,"ez-upload",{label:[1],enabled:[4],maxFileSize:[2,"max-file-size"],maxFiles:[2,"max-files"],requestHeaders:[8,"request-headers"],urlUpload:[1,"url-upload"],urlDelete:[1,"url-delete"],value:[1040],addFiles:[64],setFocus:[64],setBlur:[64]}]]],["p-107aff56",[[1,"ez-text-edit",{value:[1],styled:[16],_newValue:[32],applyFocusSelect:[64]}]]],["p-6a8e7fb2",[[1,"ez-combo-box",{value:[1537],label:[513],enabled:[516],options:[1040],errorMessage:[1537,"error-message"],searchMode:[4,"search-mode"],showSelectedValue:[4,"show-selected-value"],showOptionValue:[4,"show-option-value"],suppressSearch:[4,"suppress-search"],optionLoader:[16],suppressEmptyOption:[4,"suppress-empty-option"],canShowError:[516,"can-show-error"],mode:[513],_preSelection:[32],_visibleOptions:[32],_startLoading:[32],_showLoading:[32],_criteria:[32],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-9d57e44a",[[1,"ez-calendar",{value:[1040],floating:[516],time:[516],showSeconds:[516,"show-seconds"],show:[64],fitVertical:[64],hide:[64]}]]],["p-ec9decf2",[[1,"ez-icon",{size:[513],href:[513],iconName:[513,"icon-name"]}]]],["p-88d0fc06",[[1,"ez-button",{label:[513],enabled:[516],mode:[513],image:[513],iconName:[513,"icon-name"],size:[513],setFocus:[64],setBlur:[64]}]]],["p-a595dd4e",[[0,"ez-form",{dataUnit:[1040],config:[16],recordsValidator:[16],submit:[64],cancel:[64],validate:[64]}]]]],e)));
1
+ import{p as e,b as o}from"./p-3c7ea91b.js";(()=>{const o=import.meta.url,s={};return""!==o&&(s.resourcesUrl=new URL(".",o).href),e(s)})().then((e=>o([["p-8c2105a5",[[1,"ez-actions-button",{enabled:[516],actions:[1040],size:[513],showLabel:[516,"show-label"],displayIcon:[513,"display-icon"],checkOption:[516,"check-option"],value:[513],isTransparent:[516,"is-transparent"],arrowActive:[516,"arrow-active"],_selectedAction:[32],hideActions:[64],isOpened:[64]}]]],["p-f6afdc4d",[[1,"ez-dialog",{confirm:[1028],dialogType:[1025,"dialog-type"],message:[1025],opened:[1540],personalizedIconPath:[1025,"personalized-icon-path"],ezTitle:[1025,"ez-title"],handleButtonClick:[64],show:[64]}]]],["p-855f99f8",[[1,"ez-filter-input",{label:[1],value:[1537],enabled:[4],loading:[516],errorMessage:[1537,"error-message"],restrict:[1],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-77b7b623",[[6,"ez-grid",{multipleSelection:[4,"multiple-selection"],config:[1040],serverUrl:[1,"server-url"],dataUnit:[16],statusResolver:[16],_paginationInfo:[32],setColumnsDef:[64],addColumnMenuItem:[64],setColumnsState:[64],setData:[64],getSelection:[64],getColumnsState:[64],getColumns:[64],quickFilter:[64]}]]],["p-def4cd05",[[6,"ez-modal-container",{modalTitle:[1,"modal-title"],modalSubTitle:[1,"modal-sub-title"],showTitleBar:[4,"show-title-bar"],cancelButtonLabel:[1,"cancel-button-label"],okButtonLabel:[1,"ok-button-label"],cancelButtonStatus:[1,"cancel-button-status"],okButtonStatus:[1,"ok-button-status"]}]]],["p-66ebdf34",[[1,"ez-chip",{label:[513],enabled:[516],removePosition:[513,"remove-position"],mode:[513],value:[1540],setFocus:[64],setBlur:[64]}]]],["p-1cc11468",[[0,"ez-application"]]],["p-3cfefc57",[[1,"ez-card-item",{item:[16]}]]],["p-42c6493e",[[1,"ez-list",{dataSource:[1040],useGroups:[1540,"use-groups"],ezDraggable:[1028,"ez-draggable"],ezSelectable:[1028,"ez-selectable"],itemSlotBuilder:[1040],_listItems:[32],_listGroupItems:[32],clearHistory:[64],scrollToTop:[64],setSelection:[64],getSelection:[64],getList:[64]}]]],["p-ed2135a5",[[1,"ez-loading-bar",{_showLoading:[32],hide:[64],show:[64]}]]],["p-7c227b86",[[1,"ez-modal",{modalSize:[1,"modal-size"],align:[1],opened:[1028],closeEsc:[4,"close-esc"],closeOutsideClick:[4,"close-outside-click"]}]]],["p-bffae598",[[1,"ez-popover",{autoClose:[516,"auto-close"],top:[1537],left:[1537],bottom:[1537],right:[1537],boxWidth:[513,"box-width"],opened:[1540],innerElement:[1537,"inner-element"],updatePosition:[64],show:[64],hide:[64]}]]],["p-cfcc23e6",[[1,"ez-popup",{size:[1],opened:[1540],useHeader:[1540,"use-header"],heightMode:[1537,"height-mode"],ezTitle:[1,"ez-title"]}]]],["p-e38c4efe",[[1,"ez-radio-button",{value:[1544],options:[1040],enabled:[516],label:[513],direction:[1537]}]]],["p-1ba371a3",[[1,"ez-scroller",{direction:[1],locked:[4],activeShadow:[4,"active-shadow"],isFirefox:[32]},[[2,"click","clickListener"],[1,"mousedown","mouseDownHandler"],[1,"mouseup","mouseUpHandler"],[1,"mousemove","mouseMoveHandler"]]]]],["p-482c3dd8",[[1,"ez-toast",{message:[1025],fadeTime:[1026,"fade-time"],useIcon:[1028,"use-icon"],canClose:[1028,"can-close"],show:[64]}]]],["p-04fab1e9",[[0,"ez-view-stack",{show:[64],getSelectedIndex:[64]}]]],["p-ac15d77e",[[1,"ez-text-input",{label:[513],value:[1537],enabled:[516],loading:[516],errorMessage:[1537,"error-message"],mask:[1],canShowError:[516,"can-show-error"],restrict:[1],mode:[513],noBorder:[516,"no-border"],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-8c874b58",[[1,"ez-collapsible-box",{value:[1540],label:[513],headerSize:[513,"header-size"],iconPlacement:[513,"icon-placement"],stretchTitle:[516,"stretch-title"],removable:[516],editable:[516],conditionalSave:[16],_activeEditText:[32],showHide:[64],applyFocusTextEdit:[64],cancelEdition:[64]}]]],["p-0fb5f4be",[[1,"ez-search",{value:[1537],label:[1537],enabled:[1540],errorMessage:[1537,"error-message"],optionLoader:[16],showSelectedValue:[4,"show-selected-value"],showOptionValue:[4,"show-option-value"],suppressEmptyOption:[4,"suppress-empty-option"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-c2ebc450",[[1,"ez-date-input",{label:[513],value:[1040],enabled:[516],errorMessage:[1537,"error-message"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-7cf71eb3",[[1,"ez-date-time-input",{label:[513],value:[1040],enabled:[516],errorMessage:[1537,"error-message"],showSeconds:[516,"show-seconds"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-72d755a8",[[1,"ez-time-input",{label:[513],value:[1026],enabled:[516],errorMessage:[1537,"error-message"],showSeconds:[516,"show-seconds"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-941d9bf9",[[1,"ez-number-input",{label:[1],value:[1538],enabled:[4],errorMessage:[1537,"error-message"],precision:[2],prettyPrecision:[2,"pretty-precision"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-f4d2438e",[[1,"ez-tabselector",{selectedIndex:[1538,"selected-index"],selectedTab:[1537,"selected-tab"],tabs:[1],_processedTabs:[32]}]]],["p-6700360e",[[1,"ez-check",{label:[513],value:[1540],enabled:[1540],indeterminate:[4],mode:[513],getMode:[64],setFocus:[64]}]]],["p-6bcf35fd",[[1,"ez-text-area",{label:[513],value:[1537],enabled:[516],loading:[516],errorMessage:[1537,"error-message"],rows:[1538],canShowError:[516,"can-show-error"],mode:[513],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-a713a1aa",[[1,"ez-upload",{label:[1],enabled:[4],maxFileSize:[2,"max-file-size"],maxFiles:[2,"max-files"],requestHeaders:[8,"request-headers"],urlUpload:[1,"url-upload"],urlDelete:[1,"url-delete"],value:[1040],addFiles:[64],setFocus:[64],setBlur:[64]}]]],["p-81fb0c90",[[1,"ez-text-edit",{value:[1],styled:[16],_newValue:[32],applyFocusSelect:[64]}]]],["p-ca9a0a49",[[1,"ez-combo-box",{value:[1537],label:[513],enabled:[516],options:[1040],errorMessage:[1537,"error-message"],searchMode:[4,"search-mode"],showSelectedValue:[4,"show-selected-value"],showOptionValue:[4,"show-option-value"],suppressSearch:[4,"suppress-search"],optionLoader:[16],suppressEmptyOption:[4,"suppress-empty-option"],canShowError:[516,"can-show-error"],mode:[513],_preSelection:[32],_visibleOptions:[32],_startLoading:[32],_showLoading:[32],_criteria:[32],setFocus:[64],setBlur:[64],isInvalid:[64]}]]],["p-9d57e44a",[[1,"ez-calendar",{value:[1040],floating:[516],time:[516],showSeconds:[516,"show-seconds"],show:[64],fitVertical:[64],hide:[64]}]]],["p-ec9decf2",[[1,"ez-icon",{size:[513],href:[513],iconName:[513,"icon-name"]}]]],["p-88d0fc06",[[1,"ez-button",{label:[513],enabled:[516],mode:[513],image:[513],iconName:[513,"icon-name"],size:[513],setFocus:[64],setBlur:[64]}]]],["p-cba61296",[[0,"ez-form",{dataUnit:[1040],config:[16],recordsValidator:[16],submit:[64],cancel:[64],validate:[64]}]]]],e)));
@@ -1 +1 @@
1
- import{r as s,c as t,h as e,g as i}from"./p-3c7ea91b.js";import{C as h}from"./p-4a5e37a7.js";import{ElementIDUtils as r}from"@sankhyalabs/core";let o=class{constructor(e){s(this,e),this.ezChange=t(this,"ezChange",7),this.showPopup=t(this,"showPopup",7),this.enabled=!0,this.showSelectedValue=!0,this.showOptionValue=!0,this.suppressEmptyOption=!1,this.mode="regular"}observeErrorMessage(){this._comboElement&&(this._comboElement.errorMessage=this.errorMessage)}observeValue(){this._comboElement&&(this._comboElement.value=this.value)}async setFocus(){this._comboElement.setFocus()}async setBlur(){this._comboElement.setBlur()}async isInvalid(){return"string"==typeof this.errorMessage&&""!==this.errorMessage.trim()}onComboChange(s){s.stopPropagation(),this.value=s.detail,this.ezChange.emit(s.detail),this.errorMessage!==this._comboElement.errorMessage&&(this.errorMessage=this._comboElement.errorMessage)}componentDidLoad(){h.applyVarsTextInput(this._elem,this._comboElement),this._elem&&(r.addIDInfo(this._elem,"input"),this._comboElement&&r.addIDInfo(this._comboElement,"internal_input",{id:this._elem.getAttribute("data-element-id")}))}render(){return e("ez-combo-box",{ref:s=>this._comboElement=s,value:this.value,label:this.label,enabled:this.enabled,errorMessage:this.errorMessage,optionLoader:this.optionLoader,searchMode:!0,onEzChange:s=>this.onComboChange(s),showSelectedValue:this.showSelectedValue,showOptionValue:this.showOptionValue,suppressEmptyOption:this.suppressEmptyOption,mode:this.mode})}get _elem(){return i(this)}static get watchers(){return{errorMessage:["observeErrorMessage"],value:["observeValue"]}}};o.style=":host{width:100%}";export{o as ez_search}
1
+ import{r as s,c as t,h as e,g as i}from"./p-3c7ea91b.js";import{C as h}from"./p-4a5e37a7.js";import{ElementIDUtils as r}from"@sankhyalabs/core";let o=class{constructor(e){s(this,e),this.ezChange=t(this,"ezChange",7),this.showPopup=t(this,"showPopup",7),this.enabled=!0,this.showSelectedValue=!0,this.showOptionValue=!0,this.suppressEmptyOption=!1,this.mode="regular"}observeErrorMessage(){this._comboElement&&(this._comboElement.errorMessage=this.errorMessage)}observeValue(){this._comboElement&&(this._comboElement.value=this.value)}async setFocus(){this._comboElement.setFocus()}async setBlur(){this._comboElement.setBlur()}async isInvalid(){return"string"==typeof this.errorMessage&&""!==this.errorMessage.trim()}onComboChange(s){s.stopPropagation(),this.value=s.detail,this.ezChange.emit(s.detail),this.errorMessage!==this._comboElement.errorMessage&&(this.errorMessage=this._comboElement.errorMessage)}componentDidLoad(){h.applyVarsTextInput(this._elem,this._comboElement)}render(){let s=r.addIDInfoIfNotExists(this._elem,"input");return e("ez-combo-box",{"data-element-id":r.getInternalIDInfo(s,"combo"),ref:s=>this._comboElement=s,value:this.value,label:this.label,enabled:this.enabled,errorMessage:this.errorMessage,optionLoader:this.optionLoader,searchMode:!0,onEzChange:s=>this.onComboChange(s),showSelectedValue:this.showSelectedValue,showOptionValue:this.showOptionValue,suppressEmptyOption:this.suppressEmptyOption,mode:this.mode})}get _elem(){return i(this)}static get watchers(){return{errorMessage:["observeErrorMessage"],value:["observeValue"]}}};o.style=":host{width:100%}";export{o as ez_search}
@@ -0,0 +1 @@
1
+ import{r as e,c as l,h as a,g as r}from"./p-3c7ea91b.js";import{ElementIDUtils as i}from"@sankhyalabs/core";let o=class{constructor(a){e(this,a),this.valueChange=l(this,"valueChange",7),this.removeChip=l(this,"removeChip",7),this.actionClick=l(this,"actionClick",7),this.enabled=!0,this.value=!1}async setFocus(){this._labelElem.focus()}async setBlur(){this._labelElem.blur()}handleSlotChange(e){e.target.assignedElements()[0].style.setProperty("--ez-icon--color","var(--ez-icon--color)")}handleValueChange(){this.swichState(),this.valueChange.emit(this.value)}handleClick(e){const l=e.target;if(this.enabled)return"action"===this.mode?this.actionClick.emit():"ez-icon"!==l.tagName.toLowerCase()?this.handleValueChange():l.classList.contains("btn-close")?this.removeChip.emit():void 0}swichState(){this.enabled&&(this.value=!this.value)}formatLabel(){return this.label.length>t.CHAR_LIMIT?this.label.substring(0,t.CHAR_LIMIT)+"...":this.label}observeValue(){this.value&&"action"!==this.mode?this._containerElem.classList.add("label__container--active"):this._containerElem.classList.remove("label__container--active")}observeEnabled(){this.enabled?(this._containerElem.classList.remove("label__container--disabled"),this._labelElem.classList.remove("lbl--disabled"),this._labelElem.classList.remove("cursor-disable")):(this._containerElem.classList.add("label__container--disabled"),this._labelElem.classList.add("lbl--disabled"),this._labelElem.classList.add("cursor-disable"))}componentDidLoad(){this._element&&i.addIDInfo(this._element,"ezChip"),this._containerElem&&(this.observeValue(),this.observeEnabled(),this._containerElem.setAttribute(i.DATA_ELEMENT_ID_ATTRIBUTE_NAME,"ezChip_internal_button"),i.addIDInfo(this._containerElem))}render(){return a("button",{onClick:e=>this.handleClick(e),class:"label__container"+("left"===this.removePosition?" label__container--row-reverse":""),ref:e=>this._containerElem=e},a("div",{class:"label__content"},a("slot",{name:"leftIcon",onSlotchange:e=>{this.handleSlotChange(e)}}),a("label",{class:"lbl "+(this.value?"lbl--active ":""),ref:e=>this._labelElem=e,title:this.label},this.formatLabel()),a("slot",{name:"rightIcon",onSlotchange:e=>{this.handleSlotChange(e)}})),"action"!==this.mode&&this.removePosition&&a("ez-icon",{class:"btn-close",size:"small","icon-name":"close"}))}get _element(){return r(this)}static get watchers(){return{value:["observeValue"],enabled:["observeEnabled"]}}};var t;!function(e){e[e.CHAR_LIMIT=28]="CHAR_LIMIT"}(t||(t={})),o.style=":host{--ez-label-chip--height:30px;--ez-label-chip__label--font-size:var(--text--medium, 14px);--ez-label-chip__label--font-family:var(--font-pattern, Arial);--ez-label-chip__label--font-weight:var(--text-weight--medium, 400);--ez-label-chip__label--space--medium:var(--space--medium, 12px);--ez-label-chip__label--title--primary:var(--title--primary, #2B3A54);--ez-label-chip__label--text--primary:var(--text--primary, #626e82);--ez-label-chip__label__container--border-radius:var(--border--radius-large, 24px);--ez-label-chip__label__container--border:1px solid;--ez-label-chip__label__container--border-color-strokes:var(--color--strokes, #DCE0E8);--ez-label-chip__label__container--color-primary:var(--color--primary, #008561);--ez-label-chip__label__container-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--ez-label-chip__label__container--background-color:var(--color--primary-300);--ez-label-chip__label__container--border-color:#0085610F;--ez-label-chip__label__container--default--border-color--active:var(--color--primary, #007a5a);--ez-label-chip__label__container--default--background-color--hover:var(--color--primary-300, #f2faf8);--ez-label-chip__label__container--default--color--hover:var(--color--primary, #f2faf8);--ez-label-chip__label__container--text--disabled:var(--text--disable, #AFB6C0);--ez-label-chip__label__container--default--border-color--active:var(--color--primary)}.lbl{display:flex;white-space:nowrap;align-items:center;cursor:pointer;user-select:none;color:var(--ez-label-chip__label--title--primary);height:var(--ez-label-chip--height);font-family:var(--ez-label-chip__label--font-family);font-size:var(--ez-label-chip__label--font-size);font-weight:var(--ez-label-chip__label--font-weight)}.lbl--active{color:var(--ez-label-chip__label__container--default--color--hover)}.lbl--disabled{color:var(--ez-label-chip__label__container--text--disabled)}.label__container{cursor:pointer;width:max-content;display:flex;flex-wrap:wrap;align-items:center;background-color:#FFFFFF;color:var(--ez-label-chip__label--text--primary);fill:var(--ez-label-chip__label--text--primary);--ez-icon--color:var(--ez-label-chip__label--text--primary);border:var(--ez-label-chip__label__container--border);border-radius:var(--ez-label-chip__label__container--border-radius);border-color:var(--ez-label-chip__label__container--border-color-strokes);padding-right:var(--ez-label-chip__label--space--medium);padding-left:var(--ez-label-chip__label--space--medium);outline-color:var(--ez-label-chip__label__container--default--border-color--active)}.label__content{display:flex;align-items:center;flex-wrap:wrap;--ez-icon--color:var(--ez-label-chip__label--text--primary)}.label__container--disabled{cursor:default;border-color:var(--ez-label-chip__label__container-color--disable-secondary);background-color:var(--ez-label-chip__label__container-color--disable-secondary);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);--ez-icon--color:var(--ez-label-chip__label__container--text--disabled)}.label__container--active{border-color:var(--ez-label-chip__label__container--default--background-color--hover);background-color:var(--ez-label-chip__label__container--default--background-color--hover);color:var(--ez-label-chip__label__container--default--color--hover);fill:var(--ez-label-chip__label__container--default--color--hover);--ez-icon--color:var(--ez-label-chip__label__container--default--color--hover)}.label__container:hover{border-color:var(--ez-label-chip__label__container--default--border-color--active)}.label__container--disabled:hover{cursor:default;border:var(--ez-label-chip__label__container--border);border-color:var(--ez-label-chip__label__container-color--disable-secondary);background-color:var(--ez-label-chip__label__container-color--disable-secondary);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);--ez-icon--color:var(--ez-label-chip__label__container--text--disabled)}.label__content__icon{display:flex;cursor:pointer;color:var(--ez-label-chip__label--text--primary);fill:var(--ez-label-chip__label--text--primary);--ez-icon--color:var(--ez-label-chip__label--text--primary)}.label__container--row-reverse{flex-direction:row-reverse}.label__container .btn-close{padding:0px 0px 0px 8px}.label__container--row-reverse .btn-close{padding:0px 8px 0px 0px}.cursor-disable{cursor:default}ez-icon{--ez-icon--color:inherit}";export{o as ez_chip}