@sankhyalabs/ezui 1.1.67 → 1.1.70

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 (98) hide show
  1. package/dist/cjs/ez-action-chip.cjs.entry.js +1 -1
  2. package/dist/cjs/ez-button_16.cjs.entry.js +133 -144
  3. package/dist/cjs/ez-dialog.cjs.entry.js +7 -1
  4. package/dist/cjs/ez-modal.cjs.entry.js +16 -69
  5. package/dist/cjs/ez-number-input.cjs.entry.js +9 -9
  6. package/dist/cjs/ez-popover.cjs.entry.js +13 -18
  7. package/dist/cjs/ez-popup.cjs.entry.js +2 -2
  8. package/dist/cjs/ez-time-input.cjs.entry.js +6 -6
  9. package/dist/cjs/ezui.cjs.js +1 -1
  10. package/dist/cjs/loader.cjs.js +1 -1
  11. package/dist/collection/components/ez-action-chip/ez-action-chip.css +2 -1
  12. package/dist/collection/components/ez-action-chip/ez-action-chip.js +1 -1
  13. package/dist/collection/components/ez-button/ez-button.css +48 -45
  14. package/dist/collection/components/ez-button/ez-button.js +5 -5
  15. package/dist/collection/components/ez-calendar/ez-calendar.css +2 -2
  16. package/dist/collection/components/ez-check/ez-check.css +78 -78
  17. package/dist/collection/components/ez-check/ez-check.js +7 -7
  18. package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.css +2 -2
  19. package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.js +1 -1
  20. package/dist/collection/components/ez-combo-box/ez-combo-box.css +46 -44
  21. package/dist/collection/components/ez-combo-box/ez-combo-box.js +38 -39
  22. package/dist/collection/components/ez-date-input/ez-date-input.js +9 -9
  23. package/dist/collection/components/ez-dialog/ez-dialog.css +43 -43
  24. package/dist/collection/components/ez-dialog/ez-dialog.js +10 -4
  25. package/dist/collection/components/ez-form/subcomponents/structure/Field.js +6 -6
  26. package/dist/collection/components/ez-form/subcomponents/structure/FormSheet.js +1 -1
  27. package/dist/collection/components/ez-icon/ez-icon.css +3 -1
  28. package/dist/collection/components/ez-icon/ez-icon.js +5 -3
  29. package/dist/collection/components/ez-label-chip/ez-label-chip.css +2 -1
  30. package/dist/collection/components/ez-label-chip/ez-label-chip.js +1 -1
  31. package/dist/collection/components/ez-modal/ez-modal.css +1 -1
  32. package/dist/collection/components/ez-modal/ez-modal.js +30 -83
  33. package/dist/collection/components/ez-number-input/ez-number-input.js +11 -11
  34. package/dist/collection/components/ez-numeric-input/ez-numeric-input.css +1 -1
  35. package/dist/collection/components/ez-numeric-input/ez-numeric-input.js +9 -9
  36. package/dist/collection/components/ez-popover/ez-popover.css +4 -5
  37. package/dist/collection/components/ez-popover/ez-popover.js +25 -30
  38. package/dist/collection/components/ez-popup/ez-popup.css +7 -7
  39. package/dist/collection/components/ez-popup/ez-popup.js +4 -4
  40. package/dist/collection/components/ez-search/ez-search.js +5 -5
  41. package/dist/collection/components/ez-tabselector/ez-tabselector.css +7 -10
  42. package/dist/collection/components/ez-tabselector/ez-tabselector.js +68 -70
  43. package/dist/collection/components/ez-text-area/ez-text-area.css +6 -0
  44. package/dist/collection/components/ez-text-area/ez-text-area.js +9 -9
  45. package/dist/collection/components/ez-text-input/ez-text-input.css +68 -60
  46. package/dist/collection/components/ez-text-input/ez-text-input.js +14 -38
  47. package/dist/collection/components/ez-time-input/ez-time-input.css +8 -0
  48. package/dist/collection/components/ez-time-input/ez-time-input.js +9 -9
  49. package/dist/collection/components/ez-toast/ez-toast.css +2 -2
  50. package/dist/collection/components/ez-upload/ez-upload.css +4 -1
  51. package/dist/collection/components/ez-upload/ez-upload.js +3 -3
  52. package/dist/custom-elements/index.js +198 -261
  53. package/dist/esm/ez-action-chip.entry.js +1 -1
  54. package/dist/esm/ez-button_16.entry.js +133 -144
  55. package/dist/esm/ez-dialog.entry.js +7 -1
  56. package/dist/esm/ez-modal.entry.js +16 -69
  57. package/dist/esm/ez-number-input.entry.js +9 -9
  58. package/dist/esm/ez-popover.entry.js +13 -18
  59. package/dist/esm/ez-popup.entry.js +2 -2
  60. package/dist/esm/ez-time-input.entry.js +6 -6
  61. package/dist/esm/ezui.js +1 -1
  62. package/dist/esm/loader.js +1 -1
  63. package/dist/ezui/ezui.esm.js +1 -1
  64. package/dist/ezui/p-1bc9ddad.entry.js +1 -0
  65. package/dist/ezui/{p-4f4b8aae.entry.js → p-1c33a56d.entry.js} +1 -1
  66. package/dist/ezui/{p-d8a47f23.entry.js → p-74e4415e.entry.js} +1 -1
  67. package/dist/ezui/p-a7e23f65.entry.js +1 -0
  68. package/dist/ezui/p-a88ee12f.entry.js +1 -0
  69. package/dist/ezui/p-b692a0ab.entry.js +1 -0
  70. package/dist/ezui/p-b6e0fd3e.entry.js +1 -0
  71. package/dist/ezui/{p-7f528c19.entry.js → p-f7d7fb7f.entry.js} +1 -1
  72. package/dist/types/components/ez-action-chip/ez-action-chip.d.ts +1 -1
  73. package/dist/types/components/ez-button/ez-button.d.ts +1 -1
  74. package/dist/types/components/ez-check/ez-check.d.ts +3 -3
  75. package/dist/types/components/ez-collapsible-box/ez-collapsible-box.d.ts +1 -1
  76. package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +8 -8
  77. package/dist/types/components/ez-date-input/ez-date-input.d.ts +2 -2
  78. package/dist/types/components/ez-dialog/ez-dialog.d.ts +8 -2
  79. package/dist/types/components/ez-icon/ez-icon.d.ts +6 -0
  80. package/dist/types/components/ez-label-chip/ez-label-chip.d.ts +1 -1
  81. package/dist/types/components/ez-modal/ez-modal.d.ts +9 -9
  82. package/dist/types/components/ez-number-input/ez-number-input.d.ts +1 -1
  83. package/dist/types/components/ez-numeric-input/ez-numeric-input.d.ts +3 -3
  84. package/dist/types/components/ez-popover/ez-popover.d.ts +4 -5
  85. package/dist/types/components/ez-popup/ez-popup.d.ts +3 -3
  86. package/dist/types/components/ez-search/ez-search.d.ts +3 -3
  87. package/dist/types/components/ez-tabselector/ez-tabselector.d.ts +19 -10
  88. package/dist/types/components/ez-text-area/ez-text-area.d.ts +4 -4
  89. package/dist/types/components/ez-text-input/ez-text-input.d.ts +4 -8
  90. package/dist/types/components/ez-time-input/ez-time-input.d.ts +2 -2
  91. package/dist/types/components/ez-upload/ez-upload.d.ts +3 -3
  92. package/dist/types/components.d.ts +142 -114
  93. package/package.json +2 -1
  94. package/dist/ezui/p-7c7dbfcb.entry.js +0 -1
  95. package/dist/ezui/p-8c8f1c00.entry.js +0 -1
  96. package/dist/ezui/p-afc553a4.entry.js +0 -1
  97. package/dist/ezui/p-d185d7e8.entry.js +0 -1
  98. package/dist/ezui/p-ee5058c1.entry.js +0 -1
@@ -2,63 +2,65 @@
2
2
 
3
3
  /* dimensions */
4
4
  /*@doc Define altura do input.*/
5
- --cx--height: 42px;
5
+ --combo-box--height: 42px;
6
6
  /*@doc Define largura do input.*/
7
- --cx--width: 100%;
7
+ --combo-box--width: 100%;
8
8
  /*@doc Define largura do slot do ícone do input.*/
9
- --cx__icon--width: 48px;
9
+ --combo-box__icon--width: 48px;
10
10
 
11
11
  /* general */
12
12
  /*@doc Define o raio da borda do input.*/
13
- --cx--border-radius: var(--border--radius-medium, 12px);
13
+ --combo-box--border-radius: var(--border--radius-medium, 12px);
14
14
  /*@doc Define o raio da borda do input quando pequeno.*/
15
- --cx--border-radius-small: var(--border--radius-small, 6px);
15
+ --combo-box--border-radius-small: var(--border--radius-small, 6px);
16
16
  /*@doc Define o tamanho da fonte dentro do input.*/
17
- --cx--font-size: var(--text--medium, 14px);
17
+ --combo-box--font-size: var(--text--medium, 14px);
18
18
  /*@doc Define a família da fonte dentro do input.*/
19
- --cx--font-family: var(--font-pattern, Arial);
19
+ --combo-box--font-family: var(--font-pattern, Arial);
20
20
  /*@doc Define o peso da fonte dentro do input quando pesada.*/
21
- --cx--font-weight--large: var(--text-weight--large, 500);
21
+ --combo-box--font-weight--large: var(--text-weight--large, 500);
22
22
  /*@doc Define o peso da fonte dentro do input quando média.*/
23
- --cx--font-weight--medium: var(--text-weight--medium, 400);
23
+ --combo-box--font-weight--medium: var(--text-weight--medium, 400);
24
24
  /*@doc Define a cor de fundo da lista de opções.*/
25
- --cx--background-color--xlight: var(--background--xlight, #fff);
25
+ --combo-box--background-color--xlight: var(--background--xlight, #fff);
26
26
 
27
27
  /* input */
28
28
  /*@doc Define a cor de fundo do input.*/
29
- --cx__input--background-color: var(--background--medium, #e0e0e0);
29
+ --combo-box__input--background-color: var(--background--medium, #e0e0e0);
30
30
  /*@doc Define o estilo da borda do input.*/
31
- --cx__input--border: var(--border--medium, 2px solid);
31
+ --combo-box__input--border: var(--border--medium, 2px solid);
32
32
  /*@doc Define a cor da borda do input.*/
33
- --cx__input--border-color: var(--cx__input--background-color);
33
+ --combo-box__input--border-color: var(--combo-box__input--background-color);
34
34
  /*no modo normal usamos a borda com a mesma cor do bg*/
35
35
  /*@doc Define a cor da borda do input quando focado.*/
36
- --cx__input--focus--border-color: var(--color--primary, #008561);
36
+ --combo-box__input--focus--border-color: var(--color--primary, #008561);
37
37
  /*@doc Define a cor de fundo do input quando desabilitado.*/
38
- --cx__input--disabled--background-color: var(--color--disable-secondary, #F2F5F8);
38
+ --combo-box__input--disabled--background-color: var(--color--disable-secondary, #F2F5F8);
39
39
  /*@doc Define a cor do texto dentro do input quando desabilitado.*/
40
- --cx__input--disabled--color: var(--text--disable, #AFB6C0);
40
+ --combo-box__input--disabled--color: var(--text--disable, #AFB6C0);
41
41
  /*@doc Define a cor da borda do input quando com erro.*/
42
- --cx__input--error--border-color: #CC2936;
42
+ --combo-box__input--error--border-color: #CC2936;
43
43
 
44
44
  /* label */
45
45
  /*@doc Define a cor do label.*/
46
- --cx__label--color: var(--title--primary, #919191);
46
+ --combo-box__label--color: var(--title--primary, #919191);
47
47
 
48
48
  /* list */
49
49
  /*@doc Define a cor do texto da lista de opções.*/
50
- --cx__list-text--primary: var(--text--primary, #626e82);
50
+ --combo-box__list-text--primary: var(--text--primary, #626e82);
51
51
  /*@doc Define a altura do box da lista de opções.*/
52
- --cx__list-height: calc(var(--cx--font-size) + var(--cx--space--medium));
52
+ --combo-box__list-height: calc(var(--combo-box--font-size) + var(--combo-box--space--medium));
53
53
 
54
54
  /*@doc Contém a imagem do ícone que aciona a lista.*/
55
- --cx--drop-down__image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="16px" width="16px"><path d="M 1.8585859,3.0707069 7.9999998,9.2121212 14.141414,3.0707069 16,5.0101006 7.9999998,12.929293 0,4.9292932 Z"/></svg>');
55
+ --combo-box--drop-down__image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="16px" width="16px"><path d="M 1.8585859,3.0707069 7.9999998,9.2121212 14.141414,3.0707069 16,5.0101006 7.9999998,12.929293 0,4.9292932 Z"/></svg>');
56
56
  /*@doc Contém a imagem do ícone de pesquisa.*/
57
- --cx--search__image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="22px" width="22px"><path d="m 9.4,2.3 c 4.1,0 7.4,3.2 7.4,7.2 0,1.8 -0.7,3.4 -1.8,4.7 l 0.3,0.3 h 0.9 l 5.7,5.6 -1.7,1.7 -5.7,-5.6 V 15.3 L 14.3,15 C 13,16.1 11.3,16.7 9.5,16.7 5.3,16.7 2,13.5 2,9.5 2,5.5 5.3,2.3 9.4,2.3 m 0,2.2 c -2.9,0 -5.1,2.2 -5.1,5 0,2.8 2.3,5 5.1,5 2.8,0 5.1,-2.2 5.1,-5 0,-2.8 -2.2,-5 -5.1,-5 z"/></svg>');
57
+ --combo-box--search__image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="22px" width="22px"><path d="m 9.4,2.3 c 4.1,0 7.4,3.2 7.4,7.2 0,1.8 -0.7,3.4 -1.8,4.7 l 0.3,0.3 h 0.9 l 5.7,5.6 -1.7,1.7 -5.7,-5.6 V 15.3 L 14.3,15 C 13,16.1 11.3,16.7 9.5,16.7 5.3,16.7 2,13.5 2,9.5 2,5.5 5.3,2.3 9.4,2.3 m 0,2.2 c -2.9,0 -5.1,2.2 -5.1,5 0,2.8 2.3,5 5.1,5 2.8,0 5.1,-2.2 5.1,-5 0,-2.8 -2.2,-5 -5.1,-5 z"/></svg>');
58
58
 
59
59
  /* espaçamento */
60
- --cx--space--medium: var(--space--medium, 12px);
61
- --cx--space--small: var(--space--small, 6px);
60
+ /*@doc Define um espaçamento mediano entre elementos do componente.*/
61
+ --combo-box--space--medium: var(--space--medium, 12px);
62
+ /*@doc Define um espaçamento pequeno entre elementos do componente.*/
63
+ --combo-box--space--small: var(--space--small, 6px);
62
64
 
63
65
  /***************
64
66
  host style
@@ -68,12 +70,12 @@
68
70
  flex-wrap: wrap;
69
71
  position: relative;
70
72
  /*public*/
71
- width: var(--cx--width);
73
+ width: var(--combo-box--width);
72
74
  }
73
75
 
74
76
  ez-text-input {
75
- --it__input--background-color: var(--cx__input--background-color, #FFFFFF);
76
- --it__input--border-color: var(--cx__input--border-color, #DCE0E8);
77
+ --it__input--background-color: var(--combo-box__input--background-color, #FFFFFF);
78
+ --it__input--border-color: var(--combo-box__input--border-color, #DCE0E8);
77
79
  }
78
80
 
79
81
  .list-container {
@@ -91,12 +93,12 @@ ez-text-input {
91
93
  flex-direction: column;
92
94
 
93
95
  /*public*/
94
- background-color: var(--cx--background-color--xlight);
95
- padding: var(--cx--space--small);
96
- border-radius: var(--cx--border-radius);
96
+ background-color: var(--combo-box--background-color--xlight);
97
+ padding: var(--combo-box--space--small);
98
+ border-radius: var(--combo-box--border-radius);
97
99
  box-shadow: var(--shadow, 0px 0px 16px 0px #000);
98
100
  scroll-behavior: smooth;
99
- max-height: calc(4*var(--cx__list-height) + 2*var(--cx--space--small));
101
+ max-height: calc(4*var(--combo-box__list-height) + 2*var(--combo-box--space--small));
100
102
  overflow: auto;
101
103
  }
102
104
 
@@ -105,11 +107,11 @@ ez-text-input {
105
107
  display: flex;
106
108
  justify-content: space-between;
107
109
  align-items: center;
108
- border-radius: var(--cx--border-radius-small);
109
- padding: 0 var(--cx--space--small);
110
+ border-radius: var(--combo-box--border-radius-small);
111
+ padding: 0 var(--combo-box--space--small);
110
112
  list-style-type: none;
111
113
 
112
- min-height: var(--cx__list-height);
114
+ min-height: var(--combo-box__list-height);
113
115
  ;
114
116
  }
115
117
 
@@ -117,9 +119,9 @@ ez-text-input {
117
119
  text-align: left;
118
120
  flex-basis: 85%;
119
121
  flex-grow: 1;
120
- color: var(--cx__list-text--primary);
121
- font-weight: var(--cx--font-weight--large);
122
- font-family: var(--cx--font-family);
122
+ color: var(--combo-box__list-text--primary);
123
+ font-weight: var(--combo-box--font-weight--large);
124
+ font-family: var(--combo-box--font-family);
123
125
  white-space: nowrap;
124
126
  overflow: hidden;
125
127
  text-overflow: ellipsis;
@@ -129,9 +131,9 @@ ez-text-input {
129
131
  text-align: right;
130
132
  flex-basis: 15%;
131
133
  flex-grow: 0;
132
- color: var(--cx__list-text--primary);
133
- font-weight: var(--cx--font-weight--large);
134
- font-family: var(--cx--font-family);
134
+ color: var(--combo-box__list-text--primary);
135
+ font-weight: var(--combo-box--font-weight--large);
136
+ font-family: var(--combo-box--font-family);
135
137
  white-space: nowrap;
136
138
  overflow: hidden;
137
139
  text-overflow: ellipsis;
@@ -162,8 +164,8 @@ li:hover {
162
164
  background-color: var(--text--primary, #008561);
163
165
  width: 16px;
164
166
  height: 16px;
165
- -webkit-mask-image: var(--cx--drop-down__image);
166
- mask-image: var(--cx--drop-down__image);
167
+ -webkit-mask-image: var(--combo-box--drop-down__image);
168
+ mask-image: var(--combo-box--drop-down__image);
167
169
  }
168
170
 
169
171
  .btn-open-options:disabled:after {
@@ -191,8 +193,8 @@ li:hover {
191
193
  background-color: var(--text--primary, #008561);
192
194
  width: 22px;
193
195
  height: 22px;
194
- -webkit-mask-image: var(--cx--search__image);
195
- mask-image: var(--cx--search__image);
196
+ -webkit-mask-image: var(--combo-box--search__image);
197
+ mask-image: var(--combo-box--search__image);
196
198
  }
197
199
 
198
200
  .btn-open-search:disabled:after {
@@ -1,5 +1,5 @@
1
- import { FloatingManager } from '@sankhyalabs/core';
2
- import { Component, h, Host, Prop, State, Event, Element, Watch } from '@stencil/core';
1
+ import { FloatingManager } from "@sankhyalabs/core";
2
+ import { Component, h, Host, Prop, State, Event, Element, Watch } from "@stencil/core";
3
3
  export class EzComboBox {
4
4
  constructor() {
5
5
  /**
@@ -9,11 +9,11 @@ export class EzComboBox {
9
9
  /**
10
10
  * Ajusta a opção de mostrar o "value" ao selecionar uma opção. Por padrão não mostra.
11
11
  */
12
- this.showselectedvalue = false;
12
+ this.showSelectedValue = false;
13
13
  /**
14
14
  * Ajusta a opção de mostrar o "value" para cada opção. Por padrão não mostra
15
15
  */
16
- this.showoptionvalue = false;
16
+ this.showOptionValue = false;
17
17
  }
18
18
  internalUpdate() {
19
19
  if (this._inputElement) {
@@ -25,31 +25,31 @@ export class EzComboBox {
25
25
  this.updateVisibleOptions();
26
26
  }
27
27
  getText() {
28
- let text = '';
28
+ let text = "";
29
29
  const selected = this.getSelectedOption();
30
30
  if (selected) {
31
- text = this.showselectedvalue ? `${selected.value} - ${selected.label}` : selected.label;
31
+ text = this.showSelectedValue ? `${selected.value} - ${selected.label}` : selected.label;
32
32
  }
33
33
  return text;
34
34
  }
35
35
  getSelectedOption() {
36
- if (typeof this.value === 'string' || this.value instanceof String) {
36
+ if (typeof this.value === "string" || this.value instanceof String) {
37
37
  return this._visibleOptions.find(o => o.value === this.value);
38
38
  }
39
39
  return this.value;
40
40
  }
41
41
  updateVisibleOptions() {
42
42
  let opts = this._source || [];
43
- if (!this.searchmode && this._criteria) {
43
+ if (!this.searchMode && this._criteria) {
44
44
  const upperCriteria = this._criteria.toUpperCase();
45
45
  opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
46
46
  }
47
- this._visibleOptions = [{ value: null, label: '' }].concat(opts);
47
+ this._visibleOptions = [{ value: undefined, label: "" }].concat(opts);
48
48
  }
49
49
  buildItem(opt, index) {
50
50
  return h("li", { class: index === this._preSelection ? "item preselected" : "item", id: `item_${opt.value}`, onMouseDown: () => this.selectOption(opt), onMouseOver: () => this._preSelection = undefined },
51
51
  h("span", { class: "item--label", title: opt.label }, opt.label),
52
- this.showoptionvalue ? h("span", { class: "item--value", title: opt.value }, opt.value) : null);
52
+ this.showOptionValue ? h("span", { class: "item--value", title: opt.value }, opt.value) : undefined);
53
53
  }
54
54
  showOptions() {
55
55
  if (!this.enabled) {
@@ -58,10 +58,10 @@ export class EzComboBox {
58
58
  //FIXME: Provavelmente isso fará com que o popup abra em uma
59
59
  //posição errada no futuro. Preferi fazer simples no começo,
60
60
  //porque não quis onerar o text input com essa funcionalidade...
61
- const top = this.errormessage ? '0px' : '-17px';
61
+ const top = this.errorMessage ? "0px" : "-17px";
62
62
  this._floatingID = FloatingManager.float(this._optionsList, this._listContainer, { autoClose: true, top });
63
63
  window.requestAnimationFrame(() => {
64
- this._optionsList.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });
64
+ this._optionsList.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
65
65
  });
66
66
  }
67
67
  hideOptions() {
@@ -74,7 +74,7 @@ export class EzComboBox {
74
74
  return this._floatingID !== undefined && FloatingManager.isFloating(this._floatingID);
75
75
  }
76
76
  nextOption() {
77
- if (this.searchmode && !this.isOptionsVisible()) {
77
+ if (this.searchMode && !this.isOptionsVisible()) {
78
78
  return;
79
79
  }
80
80
  this.showOptions();
@@ -110,7 +110,7 @@ export class EzComboBox {
110
110
  selectOption(opt) {
111
111
  const currentOpt = this.getSelectedOption();
112
112
  if (currentOpt !== opt) {
113
- const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? null : opt;
113
+ const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? undefined : opt;
114
114
  this.value = adjustedOpt;
115
115
  this.ezChange.emit(adjustedOpt);
116
116
  }
@@ -128,10 +128,10 @@ export class EzComboBox {
128
128
  this.updateVisibleOptions();
129
129
  }
130
130
  }
131
- loadOptions(mode, argument = '') {
131
+ loadOptions(mode, argument = "") {
132
132
  this._criteria = argument;
133
- if (this.optionloader) {
134
- this.updateSource(this.optionloader({ mode, argument }));
133
+ if (this.optionLoader) {
134
+ this.updateSource(this.optionLoader({ mode, argument }));
135
135
  }
136
136
  else {
137
137
  this.updateSource(this.options);
@@ -139,7 +139,7 @@ export class EzComboBox {
139
139
  }
140
140
  cancelPreselection() {
141
141
  if (!this._inputElement.value && this.value) {
142
- this.selectOption(null);
142
+ this.selectOption(undefined);
143
143
  }
144
144
  else {
145
145
  this.internalUpdate();
@@ -151,11 +151,11 @@ export class EzComboBox {
151
151
  componentWillLoad() {
152
152
  if (this.options === undefined) {
153
153
  this.options = [];
154
- const optionsTags = this.el.querySelectorAll('option');
154
+ const optionsTags = this.el.querySelectorAll("option");
155
155
  if (optionsTags) {
156
156
  optionsTags.forEach(e => {
157
157
  let label = e.innerText;
158
- let value = e.getAttribute('value');
158
+ let value = e.getAttribute("value");
159
159
  if (!value) {
160
160
  value = label;
161
161
  }
@@ -164,11 +164,11 @@ export class EzComboBox {
164
164
  });
165
165
  }
166
166
  }
167
- if (this.searchmode) {
167
+ if (this.searchMode) {
168
168
  this.updateSource([]);
169
169
  }
170
170
  else {
171
- this.loadOptions('PRELOAD');
171
+ this.loadOptions("PRELOAD");
172
172
  }
173
173
  }
174
174
  componentDidRender() {
@@ -186,13 +186,12 @@ export class EzComboBox {
186
186
  const argument = event.target.value;
187
187
  this._criteria = argument;
188
188
  if (this._criteria) {
189
- if (this.searchmode) {
189
+ if (this.searchMode) {
190
190
  if (this._changeDeboucingTimeout) {
191
191
  window.clearTimeout(this._changeDeboucingTimeout);
192
192
  }
193
193
  this._changeDeboucingTimeout = window.setTimeout(() => {
194
- /* load data */
195
- this.loadOptions('PREDICTIVE', argument);
194
+ this.loadOptions("PREDICTIVE", argument);
196
195
  }, 200);
197
196
  }
198
197
  else {
@@ -202,7 +201,7 @@ export class EzComboBox {
202
201
  }
203
202
  }
204
203
  onTextInputClickHandler() {
205
- if (!this.searchmode) {
204
+ if (!this.searchMode) {
206
205
  this.showOptions();
207
206
  }
208
207
  }
@@ -228,8 +227,8 @@ export class EzComboBox {
228
227
  }
229
228
  render() {
230
229
  return (h(Host, null,
231
- h("ez-text-input", { ref: elem => this._inputElement = elem, enabled: this.enabled, onInput: evt => this.onTextInputChangeHandler(evt), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onEzChange: event => event.stopPropagation(), onKeyDown: event => this.keyDownHandler(event), label: this.label, value: this.getText(), errormessage: this.errormessage }, this.searchmode ?
232
- h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-search", onClick: () => { this.loadOptions('ADVANCED'); }, slot: "leftIcon" })
230
+ h("ez-text-input", { ref: elem => this._inputElement = elem, enabled: this.enabled, onInput: evt => this.onTextInputChangeHandler(evt), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onEzChange: event => event.stopPropagation(), onKeyDown: event => this.keyDownHandler(event), label: this.label, value: this.getText(), errorMessage: this.errorMessage }, this.searchMode ?
231
+ h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-search", onClick: () => { this.loadOptions("ADVANCED"); }, slot: "leftIcon" })
233
232
  :
234
233
  h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-options", slot: "rightIcon", onClick: () => this.showOptions() })),
235
234
  h("section", { class: "list-container", ref: elem => this._listContainer = elem },
@@ -277,7 +276,7 @@ export class EzComboBox {
277
276
  "optional": false,
278
277
  "docs": {
279
278
  "tags": [],
280
- "text": "Label \u00E9 o t\u00EDtulo do campo"
279
+ "text": "T\u00EDtulo do campo"
281
280
  },
282
281
  "attribute": "label",
283
282
  "reflect": true
@@ -319,10 +318,10 @@ export class EzComboBox {
319
318
  "optional": false,
320
319
  "docs": {
321
320
  "tags": [],
322
- "text": "Array no formato \"{value: string, label: string} que alimenta as op\u00E7\u00F5es do Combobox\""
321
+ "text": "Array no formato \"{value: string, label: string}\" que alimenta as op\u00E7\u00F5es do Combobox"
323
322
  }
324
323
  },
325
- "errormessage": {
324
+ "errorMessage": {
326
325
  "type": "string",
327
326
  "mutable": true,
328
327
  "complexType": {
@@ -336,10 +335,10 @@ export class EzComboBox {
336
335
  "tags": [],
337
336
  "text": "Quando h\u00E1 um problema de valida\u00E7\u00E3o, serve como orienta\u00E7\u00E3o ao usu\u00E1rio"
338
337
  },
339
- "attribute": "errormessage",
338
+ "attribute": "error-message",
340
339
  "reflect": true
341
340
  },
342
- "searchmode": {
341
+ "searchMode": {
343
342
  "type": "boolean",
344
343
  "mutable": false,
345
344
  "complexType": {
@@ -353,10 +352,10 @@ export class EzComboBox {
353
352
  "tags": [],
354
353
  "text": ""
355
354
  },
356
- "attribute": "searchmode",
355
+ "attribute": "search-mode",
357
356
  "reflect": false
358
357
  },
359
- "showselectedvalue": {
358
+ "showSelectedValue": {
360
359
  "type": "boolean",
361
360
  "mutable": false,
362
361
  "complexType": {
@@ -370,11 +369,11 @@ export class EzComboBox {
370
369
  "tags": [],
371
370
  "text": "Ajusta a op\u00E7\u00E3o de mostrar o \"value\" ao selecionar uma op\u00E7\u00E3o. Por padr\u00E3o n\u00E3o mostra."
372
371
  },
373
- "attribute": "showselectedvalue",
372
+ "attribute": "show-selected-value",
374
373
  "reflect": false,
375
374
  "defaultValue": "false"
376
375
  },
377
- "showoptionvalue": {
376
+ "showOptionValue": {
378
377
  "type": "boolean",
379
378
  "mutable": false,
380
379
  "complexType": {
@@ -388,11 +387,11 @@ export class EzComboBox {
388
387
  "tags": [],
389
388
  "text": "Ajusta a op\u00E7\u00E3o de mostrar o \"value\" para cada op\u00E7\u00E3o. Por padr\u00E3o n\u00E3o mostra"
390
389
  },
391
- "attribute": "showoptionvalue",
390
+ "attribute": "show-option-value",
392
391
  "reflect": false,
393
392
  "defaultValue": "false"
394
393
  },
395
- "optionloader": {
394
+ "optionLoader": {
396
395
  "type": "unknown",
397
396
  "mutable": false,
398
397
  "complexType": {
@@ -11,7 +11,7 @@ export class EzDateInput {
11
11
  this._textInput.label = this.label;
12
12
  }
13
13
  setErrorMessage() {
14
- this._textInput.errormessage = this.errormessage;
14
+ this._textInput.errorMessage = this.errorMessage;
15
15
  }
16
16
  applyValueToInput() {
17
17
  if (this._textInput) {
@@ -20,7 +20,7 @@ export class EzDateInput {
20
20
  }
21
21
  changeValue(newValue) {
22
22
  newValue = newValue == null ? null : DateUtils.clearTime(newValue);
23
- this._textInput.errormessage = "";
23
+ this._textInput.errorMessage = "";
24
24
  if (this.getTextValue(newValue) !== this.getTextValue(this.value)) {
25
25
  this.value = newValue;
26
26
  this.ezChange.emit();
@@ -32,7 +32,7 @@ export class EzDateInput {
32
32
  //FIXME: Provavelmente isso fará com que o popup abra em uma
33
33
  //posição errada no futuro. Preferi fazer simples no começo,
34
34
  //porque não quis onerar o text input com essa funcionalidade...
35
- const top = this._textInput.errormessage ? 0 : -17;
35
+ const top = this._textInput.errorMessage ? 0 : -17;
36
36
  this._calendar.fitVertical(top, this._elem.clientHeight);
37
37
  }
38
38
  hideCalendar() {
@@ -51,7 +51,7 @@ export class EzDateInput {
51
51
  }
52
52
  }
53
53
  else {
54
- this._textInput.errormessage = "O valor digitado não é uma data válida";
54
+ this._textInput.errorMessage = "O valor digitado não é uma data válida";
55
55
  }
56
56
  }
57
57
  getTextValue(d) {
@@ -60,7 +60,7 @@ export class EzDateInput {
60
60
  render() {
61
61
  return (h(Host, null,
62
62
  h("ez-text-input", { class: "text-input", ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => { if (event.key === 'H' || event.key === 'h')
63
- this.changeValue(new Date()); }, label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errormessage: this.errormessage },
63
+ this.changeValue(new Date()); }, label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage },
64
64
  h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })),
65
65
  h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
66
66
  }
@@ -85,7 +85,7 @@ export class EzDateInput {
85
85
  "optional": false,
86
86
  "docs": {
87
87
  "tags": [],
88
- "text": "Label \u00E9 o t\u00EDtulo do campo"
88
+ "text": "T\u00EDtulo do campo"
89
89
  },
90
90
  "attribute": "label",
91
91
  "reflect": true
@@ -127,7 +127,7 @@ export class EzDateInput {
127
127
  "reflect": true,
128
128
  "defaultValue": "true"
129
129
  },
130
- "errormessage": {
130
+ "errorMessage": {
131
131
  "type": "string",
132
132
  "mutable": true,
133
133
  "complexType": {
@@ -141,7 +141,7 @@ export class EzDateInput {
141
141
  "tags": [],
142
142
  "text": "Quando h\u00E1 um problema de valida\u00E7\u00E3o, serve como orienta\u00E7\u00E3o ao usu\u00E1rio"
143
143
  },
144
- "attribute": "errormessage",
144
+ "attribute": "error-message",
145
145
  "reflect": true
146
146
  }
147
147
  }; }
@@ -166,7 +166,7 @@ export class EzDateInput {
166
166
  "propName": "label",
167
167
  "methodName": "setLabel"
168
168
  }, {
169
- "propName": "errormessage",
169
+ "propName": "errorMessage",
170
170
  "methodName": "setErrorMessage"
171
171
  }, {
172
172
  "propName": "value",