@sankhyalabs/ezui 5.22.0-dev.117 → 5.22.0-dev.119

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 (83) hide show
  1. package/dist/cjs/{DataBinder-c2060474.js → DataBinder-b9973a19.js} +39 -11
  2. package/dist/cjs/ez-check.cjs.entry.js +18 -10
  3. package/dist/cjs/ez-combo-box.cjs.entry.js +2 -1
  4. package/dist/cjs/ez-date-input.cjs.entry.js +2 -1
  5. package/dist/cjs/ez-date-time-input.cjs.entry.js +2 -1
  6. package/dist/cjs/ez-dialog.cjs.entry.js +3 -2
  7. package/dist/cjs/ez-form.cjs.entry.js +1 -1
  8. package/dist/cjs/ez-grid.cjs.entry.js +2 -2
  9. package/dist/cjs/ez-number-input.cjs.entry.js +2 -1
  10. package/dist/cjs/ez-search.cjs.entry.js +2 -1
  11. package/dist/cjs/ez-text-area.cjs.entry.js +24 -3
  12. package/dist/cjs/ez-text-input.cjs.entry.js +27 -3
  13. package/dist/cjs/ez-time-input.cjs.entry.js +2 -1
  14. package/dist/cjs/ezui.cjs.js +1 -1
  15. package/dist/cjs/loader.cjs.js +1 -1
  16. package/dist/collection/components/ez-check/ez-check.css +9 -0
  17. package/dist/collection/components/ez-check/ez-check.js +34 -9
  18. package/dist/collection/components/ez-combo-box/ez-combo-box.js +19 -1
  19. package/dist/collection/components/ez-date-input/ez-date-input.js +19 -1
  20. package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +19 -1
  21. package/dist/collection/components/ez-dialog/ez-dialog.css +24 -21
  22. package/dist/collection/components/ez-dialog/ez-dialog.js +2 -1
  23. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +1 -1
  24. package/dist/collection/components/ez-number-input/ez-number-input.js +19 -1
  25. package/dist/collection/components/ez-search/ez-search.js +19 -1
  26. package/dist/collection/components/ez-text-area/ez-text-area.js +47 -2
  27. package/dist/collection/components/ez-text-input/ez-text-input.js +47 -3
  28. package/dist/collection/components/ez-time-input/ez-time-input.js +19 -1
  29. package/dist/collection/utils/form/DataBinder.js +40 -12
  30. package/dist/collection/utils/form/test/DataBinder.test.js +14 -0
  31. package/dist/custom-elements/index.js +134 -46
  32. package/dist/esm/{DataBinder-89946126.js → DataBinder-1035e36f.js} +40 -12
  33. package/dist/esm/ez-check.entry.js +18 -10
  34. package/dist/esm/ez-combo-box.entry.js +2 -1
  35. package/dist/esm/ez-date-input.entry.js +2 -1
  36. package/dist/esm/ez-date-time-input.entry.js +2 -1
  37. package/dist/esm/ez-dialog.entry.js +3 -2
  38. package/dist/esm/ez-form.entry.js +1 -1
  39. package/dist/esm/ez-grid.entry.js +2 -2
  40. package/dist/esm/ez-number-input.entry.js +2 -1
  41. package/dist/esm/ez-search.entry.js +2 -1
  42. package/dist/esm/ez-text-area.entry.js +24 -3
  43. package/dist/esm/ez-text-input.entry.js +27 -3
  44. package/dist/esm/ez-time-input.entry.js +2 -1
  45. package/dist/esm/ezui.js +1 -1
  46. package/dist/esm/loader.js +1 -1
  47. package/dist/ezui/ezui.esm.js +1 -1
  48. package/dist/ezui/p-15ea0c98.js +1 -0
  49. package/dist/ezui/p-3ba9565c.entry.js +1 -0
  50. package/dist/ezui/p-496f7832.entry.js +1 -0
  51. package/dist/ezui/p-4bd6dd6a.entry.js +1 -0
  52. package/dist/ezui/p-629d15ed.entry.js +1 -0
  53. package/dist/ezui/p-7019f782.entry.js +1 -0
  54. package/dist/ezui/{p-da069110.entry.js → p-91b118a7.entry.js} +2 -2
  55. package/dist/ezui/p-9478b13b.entry.js +1 -0
  56. package/dist/ezui/p-b81881ac.entry.js +1 -0
  57. package/dist/ezui/p-c00df4be.entry.js +1 -0
  58. package/dist/ezui/p-cb75eb46.entry.js +1 -0
  59. package/dist/ezui/p-ebd23857.entry.js +1 -0
  60. package/dist/ezui/{p-8ac8093c.entry.js → p-f6316720.entry.js} +1 -1
  61. package/dist/types/components/ez-check/ez-check.d.ts +7 -2
  62. package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +4 -0
  63. package/dist/types/components/ez-date-input/ez-date-input.d.ts +4 -0
  64. package/dist/types/components/ez-date-time-input/ez-date-time-input.d.ts +4 -0
  65. package/dist/types/components/ez-number-input/ez-number-input.d.ts +4 -0
  66. package/dist/types/components/ez-search/ez-search.d.ts +4 -0
  67. package/dist/types/components/ez-text-area/ez-text-area.d.ts +8 -0
  68. package/dist/types/components/ez-text-input/ez-text-input.d.ts +9 -0
  69. package/dist/types/components/ez-time-input/ez-time-input.d.ts +4 -0
  70. package/dist/types/components.d.ts +72 -0
  71. package/dist/types/utils/form/DataBinder.d.ts +4 -2
  72. package/package.json +1 -1
  73. package/dist/ezui/p-13249c07.entry.js +0 -1
  74. package/dist/ezui/p-17de16e5.entry.js +0 -1
  75. package/dist/ezui/p-1a060042.entry.js +0 -1
  76. package/dist/ezui/p-31b71e50.entry.js +0 -1
  77. package/dist/ezui/p-58545666.entry.js +0 -1
  78. package/dist/ezui/p-7fdd479f.entry.js +0 -1
  79. package/dist/ezui/p-9f22e1dc.entry.js +0 -1
  80. package/dist/ezui/p-a64cfcfc.js +0 -1
  81. package/dist/ezui/p-c1527804.entry.js +0 -1
  82. package/dist/ezui/p-cd07f8be.entry.js +0 -1
  83. package/dist/ezui/p-e3544d23.entry.js +0 -1
@@ -17,6 +17,7 @@ export class EzNumberInput {
17
17
  this.prettyPrecision = undefined;
18
18
  this.mode = "regular";
19
19
  this.autoFocus = false;
20
+ this.alternativePlaceholder = undefined;
20
21
  }
21
22
  /**
22
23
  * Aplica o foco no campo.
@@ -175,7 +176,7 @@ export class EzNumberInput {
175
176
  if (this.allowNegative) {
176
177
  restrict += '-';
177
178
  }
178
- return (h("ez-text-input", { class: "number__input", "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: restrict, enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError, value: this._value }));
179
+ return (h("ez-text-input", { class: "number__input", "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: () => this.handleInput(), restrict: restrict, enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError, value: this._value, alternativePlaceholder: this.alternativePlaceholder }));
179
180
  }
180
181
  static get is() { return "ez-number-input"; }
181
182
  static get encapsulation() { return "shadow"; }
@@ -365,6 +366,23 @@ export class EzNumberInput {
365
366
  "attribute": "auto-focus",
366
367
  "reflect": false,
367
368
  "defaultValue": "false"
369
+ },
370
+ "alternativePlaceholder": {
371
+ "type": "string",
372
+ "mutable": false,
373
+ "complexType": {
374
+ "original": "string",
375
+ "resolved": "string",
376
+ "references": {}
377
+ },
378
+ "required": false,
379
+ "optional": false,
380
+ "docs": {
381
+ "tags": [],
382
+ "text": "Texto alternativo a ser apresentado como t\u00EDtulo do campo."
383
+ },
384
+ "attribute": "alternative-placeholder",
385
+ "reflect": false
368
386
  }
369
387
  };
370
388
  }
@@ -42,6 +42,7 @@ export class EzSearch {
42
42
  this.ensureClearButtonVisible = false;
43
43
  this.suppressPreLoad = true;
44
44
  this.autoFocus = false;
45
+ this.alternativePlaceholder = undefined;
45
46
  }
46
47
  observeErrorMessage() {
47
48
  var _a;
@@ -596,7 +597,7 @@ export class EzSearch {
596
597
  render() {
597
598
  var _a;
598
599
  ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
599
- return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("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), 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: "leftIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, this.canShowLoadSpinDescription() ? h("div", { class: "message__loading" }) : h("ez-icon", { iconName: "search" })), (((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value) || this.ensureClearButtonVisible)
600
+ return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("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), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode, alternativePlaceholder: this.alternativePlaceholder }, h("button", { class: "btn", slot: "leftIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, this.canShowLoadSpinDescription() ? h("div", { class: "message__loading" }) : h("ez-icon", { iconName: "search" })), (((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value) || this.ensureClearButtonVisible)
600
601
  ? h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, h("ez-icon", { iconName: "close" }))
601
602
  : undefined), h("ez-popover-plus", { ref: elem => this._ezPopOverPlusElement = elem, autoClose: false, overlayType: "none", useAnchorSize: true, anchorElement: [this._textInput, this.el] }, h("search-list", { ref: (ref) => this._searchList = ref, showLoading: this._showLoading, visibleOptions: this._visibleOptions, textEmptyList: this._textEmptyList, canShowListOptions: this.canShowListOptions(), value: this.value, showOptionValue: this.showOptionValue, preSelection: this._preSelection, onChangeValue: ({ detail }) => this.selectOption(detail), onChangePreSelection: ({ detail }) => this.onChangePreSelection(detail) }))));
602
603
  }
@@ -1007,6 +1008,23 @@ export class EzSearch {
1007
1008
  "attribute": "auto-focus",
1008
1009
  "reflect": false,
1009
1010
  "defaultValue": "false"
1011
+ },
1012
+ "alternativePlaceholder": {
1013
+ "type": "string",
1014
+ "mutable": false,
1015
+ "complexType": {
1016
+ "original": "string",
1017
+ "resolved": "string",
1018
+ "references": {}
1019
+ },
1020
+ "required": false,
1021
+ "optional": false,
1022
+ "docs": {
1023
+ "tags": [],
1024
+ "text": "Texto alternativo a ser apresentado como t\u00EDtulo do campo."
1025
+ },
1026
+ "attribute": "alternative-placeholder",
1027
+ "reflect": true
1010
1028
  }
1011
1029
  };
1012
1030
  }
@@ -14,6 +14,8 @@ export class EzTextArea {
14
14
  this.enableResize = true;
15
15
  this.autoRows = false;
16
16
  this.autoFocus = false;
17
+ this.alternativePlaceholder = undefined;
18
+ this.forceLabelFloat = false;
17
19
  }
18
20
  observeErrorMessage() {
19
21
  var _a, _b, _c, _d;
@@ -64,6 +66,9 @@ export class EzTextArea {
64
66
  (_b = this._resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
65
67
  }
66
68
  }
69
+ observeAlternativePlaceholder(newValue) {
70
+ this.forceLabelFloat = !!newValue;
71
+ }
67
72
  //---------------------------------------------
68
73
  // Public methods
69
74
  //---------------------------------------------
@@ -112,6 +117,8 @@ export class EzTextArea {
112
117
  return this._inputElem && (this.value || "") !== this._inputElem.value;
113
118
  }
114
119
  adjustFloatingLabel() {
120
+ if (this.forceLabelFloat)
121
+ return;
115
122
  if (this.label && this._labelElem) {
116
123
  const hasValue = this.value && this.value.toString().length > 0;
117
124
  const containsFloatedClass = this._labelElem.classList.contains("textarea__label--floated");
@@ -195,6 +202,19 @@ export class EzTextArea {
195
202
  var _a;
196
203
  (_a = this._resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
197
204
  }
205
+ buildPlaceholder() {
206
+ if (this.alternativePlaceholder)
207
+ return this.alternativePlaceholder;
208
+ return (this.mode === "slim" && this.label) ? this.label : '';
209
+ }
210
+ buildLabelClass() {
211
+ let classList = this.enabled ? 'textarea__label' : 'textarea__label textarea__label--disabled';
212
+ if (this.errorMessage)
213
+ classList = classList + ' hasError';
214
+ if (this.forceLabelFloat)
215
+ classList = classList + ' textarea__label--floated';
216
+ return classList;
217
+ }
198
218
  //---------------------------------------------
199
219
  // Lifecycle web component
200
220
  //---------------------------------------------
@@ -211,11 +231,11 @@ export class EzTextArea {
211
231
  render() {
212
232
  ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
213
233
  return (h(Host, null, h("div", { class: `textarea ${this.enabled ? "" : "textarea--disabled"}`, ref: (el) => this._container = el }, this.label && this.mode != "slim" ?
214
- 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)
234
+ h("label", { ref: (el) => this._labelElem = el, class: this.buildLabelClass(), onClick: () => this._inputElem.focus(), title: this.label }, this.label)
215
235
  : null, h("textarea", { onFocus: () => this.handleFocus(), "data-element-id": ElementIDUtils.getInternalIDInfo("input"), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, class: {
216
236
  "textarea--slim": this.mode === "slim",
217
237
  "textarea--resizable": this.enableResize
218
- }, placeholder: this.mode === "slim" && this.label ? this.label : "", onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, rows: this.rows })), this.canShowError && this.mode != "slim" &&
238
+ }, placeholder: this.buildPlaceholder(), onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, rows: this.rows })), this.canShowError && this.mode != "slim" &&
219
239
  h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
220
240
  }
221
241
  static get is() { return "ez-text-area"; }
@@ -408,9 +428,31 @@ export class EzTextArea {
408
428
  "attribute": "auto-focus",
409
429
  "reflect": false,
410
430
  "defaultValue": "false"
431
+ },
432
+ "alternativePlaceholder": {
433
+ "type": "string",
434
+ "mutable": false,
435
+ "complexType": {
436
+ "original": "string",
437
+ "resolved": "string",
438
+ "references": {}
439
+ },
440
+ "required": false,
441
+ "optional": false,
442
+ "docs": {
443
+ "tags": [],
444
+ "text": "Texto alternativo a ser apresentado como t\u00EDtulo do campo."
445
+ },
446
+ "attribute": "alternative-placeholder",
447
+ "reflect": true
411
448
  }
412
449
  };
413
450
  }
451
+ static get states() {
452
+ return {
453
+ "forceLabelFloat": {}
454
+ };
455
+ }
414
456
  static get events() {
415
457
  return [{
416
458
  "method": "ezChange",
@@ -523,6 +565,9 @@ export class EzTextArea {
523
565
  }, {
524
566
  "propName": "autoRows",
525
567
  "methodName": "observeAutoRows"
568
+ }, {
569
+ "propName": "alternativePlaceholder",
570
+ "methodName": "observeAlternativePlaceholder"
526
571
  }];
527
572
  }
528
573
  }
@@ -4,6 +4,7 @@ export class EzTextInput {
4
4
  constructor() {
5
5
  this._isOverflowing = false;
6
6
  this.label = undefined;
7
+ this.alternativePlaceholder = undefined;
7
8
  this.value = undefined;
8
9
  this.enabled = true;
9
10
  this.errorMessage = undefined;
@@ -17,6 +18,7 @@ export class EzTextInput {
17
18
  this.password = false;
18
19
  this.autoFocus = false;
19
20
  this.hasRightSlotContent = false;
21
+ this.forceLabelFloat = false;
20
22
  }
21
23
  observeHasInvalid(newValue, oldValue) {
22
24
  if (newValue === oldValue) {
@@ -48,6 +50,9 @@ export class EzTextInput {
48
50
  }
49
51
  }
50
52
  }
53
+ observeAlternativePlaceholder(newValue) {
54
+ this.forceLabelFloat = !!newValue;
55
+ }
51
56
  //---------------------------------------------
52
57
  // Private methods
53
58
  //---------------------------------------------
@@ -75,6 +80,8 @@ export class EzTextInput {
75
80
  if (this._inputElem && !this._inputElem.classList.contains("input--with--label")) {
76
81
  this._inputElem.classList.add("input--with--label");
77
82
  }
83
+ if (this.forceLabelFloat)
84
+ return;
78
85
  const hasValue = this.value && this.value.toString().length > 0;
79
86
  const containsFloatedClass = this._labelElem.classList.contains("input__label--floated");
80
87
  if (hasValue || this.isFocused()) {
@@ -250,6 +257,19 @@ export class EzTextInput {
250
257
  getValue() {
251
258
  return this.mask && this.cleanValueMask ? this.applyMask(this.value) : this.value;
252
259
  }
260
+ buildLabelClass() {
261
+ let classList = this.enabled ? 'input__label' : 'input__label input__label--disabled';
262
+ if (this.errorMessage)
263
+ classList = classList + ' hasError';
264
+ if (this.forceLabelFloat)
265
+ classList = classList + ' input__label--floated';
266
+ return classList;
267
+ }
268
+ buildPlaceholder() {
269
+ if (this.alternativePlaceholder)
270
+ return this.alternativePlaceholder;
271
+ return (this.mode === "slim" && this.label) ? this.label : '';
272
+ }
253
273
  checkIsOverflowing() {
254
274
  if (this._inputElem) {
255
275
  this._isOverflowing = this._inputElem.offsetWidth < this._inputElem.scrollWidth;
@@ -299,11 +319,14 @@ export class EzTextInput {
299
319
  this._inputElem.setSelectionRange(0, (_a = this._inputElem) === null || _a === void 0 ? void 0 : _a.value.length);
300
320
  });
301
321
  }
322
+ componentDidRender() {
323
+ this.adjustFloatingLabel();
324
+ }
302
325
  render() {
303
326
  ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
304
327
  return (h(Host, { style: this._hostElement.classList.contains("grid_editor") ? { "height": "100%" } : null }, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label && this.mode != "slim" ?
305
- h("label", { ref: (el) => this._labelElem = el, class: `${this.enabled ? "input__label" : "input__label input__label--disabled"} ${this.errorMessage ? "hasError" : ""}`, onClick: () => this._inputElem.focus(), title: this.label }, this.label)
306
- : null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo("input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: this.password ? "password" : "text", class: `${this.mode === "slim" ? "input--slim" : ""}`, placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.getValue(), disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("ez-tooltip", { anchoringElement: this._hostElement, message: this.getValue(), active: this._isOverflowing, useAnchorSize: true }), this.canShowError && this.mode != "slim" && this.errorMessage &&
328
+ h("label", { ref: (el) => this._labelElem = el, class: this.buildLabelClass(), onClick: () => this._inputElem.focus(), title: this.label }, this.label)
329
+ : null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo("input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: this.password ? "password" : "text", class: `${this.mode === "slim" ? "input--slim" : ""}`, placeholder: this.buildPlaceholder(), value: this.getValue(), disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("ez-tooltip", { anchoringElement: this._hostElement, message: this.getValue(), active: this._isOverflowing, useAnchorSize: true }), this.canShowError && this.mode != "slim" && this.errorMessage &&
307
330
  h("ez-tooltip", { type: "error", message: this.errorMessage }, h("ez-icon", { class: `tooltip-icon ${this.errorMessage ? "hasError" : ""} ${this.hasRightSlotContent ? "rightIconSlot" : ""}`, "data-element-id": ElementIDUtils.getInternalIDInfo("tooltip-icon"), ref: (el) => this._tooltipIconElem = el, iconName: "alert-circle" })), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }, " ")));
308
331
  }
309
332
  static get is() { return "ez-text-input"; }
@@ -337,6 +360,23 @@ export class EzTextInput {
337
360
  "attribute": "label",
338
361
  "reflect": true
339
362
  },
363
+ "alternativePlaceholder": {
364
+ "type": "string",
365
+ "mutable": false,
366
+ "complexType": {
367
+ "original": "string",
368
+ "resolved": "string",
369
+ "references": {}
370
+ },
371
+ "required": false,
372
+ "optional": false,
373
+ "docs": {
374
+ "tags": [],
375
+ "text": "Texto alternativo a ser apresentado como t\u00EDtulo do campo."
376
+ },
377
+ "attribute": "alternative-placeholder",
378
+ "reflect": true
379
+ },
340
380
  "value": {
341
381
  "type": "string",
342
382
  "mutable": true,
@@ -553,7 +593,8 @@ export class EzTextInput {
553
593
  }
554
594
  static get states() {
555
595
  return {
556
- "hasRightSlotContent": {}
596
+ "hasRightSlotContent": {},
597
+ "forceLabelFloat": {}
557
598
  };
558
599
  }
559
600
  static get events() {
@@ -649,6 +690,9 @@ export class EzTextInput {
649
690
  }, {
650
691
  "propName": "value",
651
692
  "methodName": "observeValue"
693
+ }, {
694
+ "propName": "alternativePlaceholder",
695
+ "methodName": "observeAlternativePlaceholder"
652
696
  }];
653
697
  }
654
698
  }
@@ -11,6 +11,7 @@ export class EzTimeInput {
11
11
  this.mode = "regular";
12
12
  this.canShowError = true;
13
13
  this.autoFocus = false;
14
+ this.alternativePlaceholder = undefined;
14
15
  }
15
16
  observeErrorMessage() {
16
17
  var _a;
@@ -148,7 +149,7 @@ export class EzTimeInput {
148
149
  }
149
150
  render() {
150
151
  ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
151
- return (h(Host, null, h("ez-text-input", { class: "time__input", "data-element-id": ElementIDUtils.getInternalIDInfo("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, canShowError: this.canShowError }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
152
+ return (h(Host, null, h("ez-text-input", { class: "time__input", "data-element-id": ElementIDUtils.getInternalIDInfo("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, canShowError: this.canShowError, alternativePlaceholder: this.alternativePlaceholder }, h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
152
153
  }
153
154
  static get is() { return "ez-time-input"; }
154
155
  static get encapsulation() { return "shadow"; }
@@ -305,6 +306,23 @@ export class EzTimeInput {
305
306
  "attribute": "auto-focus",
306
307
  "reflect": false,
307
308
  "defaultValue": "false"
309
+ },
310
+ "alternativePlaceholder": {
311
+ "type": "string",
312
+ "mutable": false,
313
+ "complexType": {
314
+ "original": "string",
315
+ "resolved": "string",
316
+ "references": {}
317
+ },
318
+ "required": false,
319
+ "optional": false,
320
+ "docs": {
321
+ "tags": [],
322
+ "text": "Texto alternativo ser apresentado como t\u00EDtulo do campo."
323
+ },
324
+ "attribute": "alternative-placeholder",
325
+ "reflect": false
308
326
  }
309
327
  };
310
328
  }
@@ -1,10 +1,14 @@
1
- import { ApplicationContext, Action, WaitingChangeException, DataUnitAction, StringUtils } from "@sankhyalabs/core";
1
+ import { ApplicationContext, Action, WaitingChangeException, DataUnitAction, StringUtils, ObjectUtils, } from '@sankhyalabs/core';
2
2
  import { RecordValidationProcessor } from "../validators/recordvalidator/RecordValidationProcessor";
3
3
  export default class DataBinder {
4
4
  constructor(dataUnit) {
5
5
  this.onDataUnitEvent = (action) => {
6
- var _a, _b;
6
+ var _a;
7
7
  switch (action.type) {
8
+ case Action.MULTIPLE_EDITION_CHANGED:
9
+ this.clearInvalid();
10
+ this.updateAllFieldsValues();
11
+ break;
8
12
  case Action.DATA_LOADED:
9
13
  case Action.DATA_SAVED:
10
14
  case Action.RECORDS_REMOVED:
@@ -19,13 +23,11 @@ export default class DataBinder {
19
23
  case Action.CHANGE_UNDONE:
20
24
  case Action.CHANGE_REDONE:
21
25
  case Action.RECORD_LOADED:
22
- (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
23
- this.updateValue(field.fieldName, field.field);
24
- });
26
+ this.updateAllFieldsValues();
25
27
  this.clearFieldError(Object.keys(action.payload)[0]);
26
28
  break;
27
29
  case Action.FIELD_INVALIDATED:
28
- (_b = this._fields) === null || _b === void 0 ? void 0 : _b.forEach(field => {
30
+ (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
29
31
  this.updateErrorMessage(field.fieldName, field.field);
30
32
  });
31
33
  break;
@@ -123,13 +125,19 @@ export default class DataBinder {
123
125
  this._dataUnit.clearInvalid(this.getCurrentRecordId(), fieldName);
124
126
  }
125
127
  }
126
- updateValue(fieldName, field) {
128
+ updateFieldValue(fieldName, field) {
127
129
  const bind = this._fields.get(fieldName);
128
130
  try {
129
- if (bind) {
131
+ if (bind)
130
132
  bind.listen = false;
133
+ if (this._dataUnit.isMultipleEdition && this.hasMultipleValuesBetweenRecords(fieldName)) {
134
+ field['value'] = undefined;
135
+ field['alternativePlaceholder'] = 'Múltiplos Valores';
136
+ }
137
+ else {
138
+ field["value"] = this._dataUnit.getFieldValue(fieldName);
139
+ field['alternativePlaceholder'] = undefined;
131
140
  }
132
- field["value"] = this._dataUnit.getFieldValue(fieldName);
133
141
  this.updateErrorMessage(fieldName, field);
134
142
  }
135
143
  finally {
@@ -138,6 +146,14 @@ export default class DataBinder {
138
146
  }
139
147
  }
140
148
  }
149
+ hasMultipleValuesBetweenRecords(key) {
150
+ var _a, _b;
151
+ const selectedRecords = (_b = (_a = this._dataUnit.getSelectionInfo()) === null || _a === void 0 ? void 0 : _a.records) !== null && _b !== void 0 ? _b : [];
152
+ if (selectedRecords.length <= 1)
153
+ return false;
154
+ const firstValue = selectedRecords[0][key];
155
+ return !selectedRecords.every(record => ObjectUtils.equals(record[key], firstValue));
156
+ }
141
157
  validate() {
142
158
  return this._recordValidatorProcessor.validate();
143
159
  }
@@ -176,7 +192,7 @@ export default class DataBinder {
176
192
  oldBind.destroy();
177
193
  }
178
194
  this.bindSearchOptionsLoader(fieldName, field);
179
- field["value"] = this._dataUnit.getFieldValue(fieldName);
195
+ this.updateFieldValue(fieldName, field);
180
196
  this.updateErrorMessage(fieldName, field);
181
197
  this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, waitingChange) => this.changeStarted(fieldName, waitingChange), (fieldName) => this.cancelWaitingChange(fieldName), (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
182
198
  this.applyEzUploadContext(fieldName, field);
@@ -218,8 +234,14 @@ export default class DataBinder {
218
234
  this._dataUnit.addRecord();
219
235
  }
220
236
  this._dataUnit.clearInvalid(this.getCurrentRecordId(), fieldName);
221
- const record = this._dataUnit.getSelectedRecord();
222
- this._dataUnit.setFieldValue(fieldName, newValue, record ? [record.__record__id__] : undefined);
237
+ if (this._dataUnit.isMultipleEdition) {
238
+ const selectionInfo = this._dataUnit.getSelectionInfo();
239
+ this._dataUnit.setFieldValue(fieldName, newValue, selectionInfo.recordIds);
240
+ }
241
+ else {
242
+ const record = this._dataUnit.getSelectedRecord();
243
+ this._dataUnit.setFieldValue(fieldName, newValue, record ? [record.__record__id__] : undefined);
244
+ }
223
245
  if (this._dataUnit.waitingForChange(fieldName)) {
224
246
  const bind = this._fields.get(fieldName);
225
247
  if (bind) {
@@ -251,6 +273,12 @@ export default class DataBinder {
251
273
  field["maxFiles"] = ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.MAX_FILES) || 0;
252
274
  }
253
275
  }
276
+ updateAllFieldsValues() {
277
+ var _a;
278
+ (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
279
+ this.updateFieldValue(field.fieldName, field.field);
280
+ });
281
+ }
254
282
  interceptAction(action) {
255
283
  if (action.type === Action.RECORDS_COPIED) {
256
284
  const cleanFields = this._formMetadata.getCleanOnCopyFields();
@@ -43,4 +43,18 @@ describe('DataBinder', () => {
43
43
  const dataBindersByDataUnit = ApplicationContext.getContextValue("__DATABINDER_BY_DATAUNIT__") || new Map();
44
44
  expect(dataBindersByDataUnit.get(dataUnit.dataUnitId).length).toBe(0);
45
45
  });
46
+ it('Should tell if has multiple values between fields', () => {
47
+ dataBinder['_dataUnit'].getSelectionInfo = jest.fn().mockReturnValue({ records: mockRecords() });
48
+ const hasMultiplesLabels = dataBinder['hasMultipleValuesBetweenRecords']('label');
49
+ const hasMultiplesValues = dataBinder['hasMultipleValuesBetweenRecords']('value');
50
+ expect(hasMultiplesLabels).toBe(false);
51
+ expect(hasMultiplesValues).toBe(true);
52
+ });
46
53
  });
54
+ function mockRecords() {
55
+ return [
56
+ { label: 'label mocked', value: 'value mocked 1' },
57
+ { label: 'label mocked', value: 'value mocked 2' },
58
+ { label: 'label mocked', value: 'value mocked 3' },
59
+ ];
60
+ }