@sankhyalabs/ezui 5.20.0-dev.4 → 5.20.0-dev.6

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 (39) hide show
  1. package/dist/cjs/ez-card-item_3.cjs.entry.js +182 -0
  2. package/dist/cjs/ez-combo-box.cjs.entry.js +11 -155
  3. package/dist/cjs/ez-search.cjs.entry.js +611 -31
  4. package/dist/cjs/ez-split-panel.cjs.entry.js +1 -1
  5. package/dist/cjs/ezui.cjs.js +1 -1
  6. package/dist/cjs/index-a7b0c73d.js +2 -6
  7. package/dist/cjs/loader.cjs.js +1 -1
  8. package/dist/collection/collection-manifest.json +2 -2
  9. package/dist/collection/components/ez-card-item/ez-card-item.css +35 -0
  10. package/dist/collection/components/ez-combo-box/ez-combo-box.js +12 -173
  11. package/dist/collection/components/ez-search/ez-search.css +331 -0
  12. package/dist/collection/components/ez-search/ez-search.js +689 -55
  13. package/dist/collection/components/ez-split-panel/ez-split-panel.js +1 -1
  14. package/dist/custom-elements/index.js +630 -197
  15. package/dist/esm/ez-card-item_3.entry.js +176 -0
  16. package/dist/esm/ez-combo-box.entry.js +12 -156
  17. package/dist/esm/ez-search.entry.js +613 -33
  18. package/dist/esm/ez-split-panel.entry.js +1 -1
  19. package/dist/esm/ezui.js +1 -1
  20. package/dist/esm/index-baa5e267.js +2 -6
  21. package/dist/esm/loader.js +1 -1
  22. package/dist/ezui/ezui.esm.js +1 -1
  23. package/dist/ezui/p-133fae4a.entry.js +1 -0
  24. package/dist/ezui/p-428a05fe.entry.js +1 -0
  25. package/dist/ezui/{p-93c3df4f.entry.js → p-8d80101c.entry.js} +1 -1
  26. package/dist/ezui/p-e52cbcc7.entry.js +1 -0
  27. package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +0 -15
  28. package/dist/types/components/ez-search/ez-search.d.ts +100 -10
  29. package/dist/types/components.d.ts +23 -14
  30. package/dist/types/utils/interfaces/AbstractFieldMetadata.d.ts +2 -1
  31. package/package.json +1 -1
  32. package/dist/cjs/ez-card-item.cjs.entry.js +0 -52
  33. package/dist/cjs/ez-filter-input_2.cjs.entry.js +0 -137
  34. package/dist/esm/ez-card-item.entry.js +0 -48
  35. package/dist/esm/ez-filter-input_2.entry.js +0 -132
  36. package/dist/ezui/p-05f5a778.entry.js +0 -1
  37. package/dist/ezui/p-5613fe63.entry.js +0 -1
  38. package/dist/ezui/p-a32aaac6.entry.js +0 -1
  39. package/dist/ezui/p-a5ac7151.entry.js +0 -1
@@ -0,0 +1,182 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-a7b0c73d.js');
6
+ const core = require('@sankhyalabs/core');
7
+ const CSSVarsUtils = require('./CSSVarsUtils-b136a156.js');
8
+
9
+ const ezCardItemCss = ":host {\n /*@doc Define o tamanho da fonte do componente.*/\n --ez-card-item--font-size: var(--text--medium, 14px);\n\n /*@doc Define a família da fonte do componente.*/\n --ez-card-item--font-family: var(--font-pattern, Arial);\n\n /*@doc Define o peso da fonte do componente.*/\n --ez-card-item--font-weight: var(--text-weight--medium, 400);\n\n /*@doc Define o peso da fonte do title do componente.*/\n --ez-card-item--font-weight-large: var(--text-weight--large, 600);\n\n /*@doc Define a cor da fonte do componente.*/\n --ez-card-item--color: var(--title--primary, #2B3A54);\n\n /*@doc Define a cor da fonte da key do componente.*/\n --ez-card-item__key--color: var(--text--primary, #626e82);\n\n /*@doc Define a cor da fonte do label do detalhe do componente.*/\n --ez-card-item__detail-label--color: var(--text--secondary, #A2ABB9);\n\n /*@doc Define o espaçamento inferior dos detalhes do componente.*/\n --ez-card-item__detail--padding-bottom: var(--space--extra-small, 3px);\n\n /*@doc Define o espaçamento inferior do title do componente.*/\n --ez-card-item__title--padding-bottom: var(--space--extra-small, 3px);\n\n /*@doc Define a cor do highlight / marcação nos textos do componente.*/\n --ez-card-item__highlight--color: var(--color--primary-300, #E2F4EF);\n\n width: 100%;\n display: flex;\n cursor: pointer;\n}\n\n.card-item {\n display: flex;\n flex-direction: column;\n width: 100%;\n cursor: pointer;\n padding: 12px;\n z-index: 0;\n position: relative;\n container-type: inline-size;\n container-name: box;\n white-space: pre-line;\n}\n\n.card-item:hover {\n background: #F0F3F7;\n border-radius: 12px;\n}\n\n.card-item__title {\n display: flex;\n align-items: center;\n line-height: 18px;\n cursor: pointer;\n\n /*public*/\n font-size: var(--ez-card-item--font-size);\n font-family: var(--ez-card-item--font-family);\n font-weight: var(--ez-card-item--font-weight-large);\n color: var(--ez-card-item--color);\n padding-bottom: var(--ez-card-item__title--padding-bottom);\n gap: var(--space--small, 6px);\n}\n\n.card-item__key {\n /*public*/\n color: var(--ez-card-item__key--color);\n}\n\n.card-item__details {\n display: flex;\n cursor: pointer;\n justify-content: space-between;\n gap: var(--space--small, 6px);\n}\n\n.card-item__details-left {\n white-space: pre-line;\n cursor: pointer;\n width: 50%;\n}\n\n.card-item__details-right {\n white-space: pre-line;\n width: 50%;\n cursor: pointer;\n}\n\n.card-item__detail:not(:last-child) {\n cursor: pointer;\n white-space: pre-line;\n\n /*public*/\n padding-bottom: var(--ez-card-item__detail--padding-bottom);\n}\n\n.card-item__detail-label {\n cursor: pointer;\n\n /*public*/\n font-size: var(--ez-card-item--font-size);\n font-family: var(--ez-card-item--font-family);\n font-weight: var(--ez-card-item--font-weight);\n color: var(--ez-card-item__detail-label--color);\n}\n\n.card-item__detail-value {\n cursor: pointer;\n line-break: anywhere;\n\n /*public*/\n font-size: var(--ez-card-item--font-size);\n font-family: var(--ez-card-item--font-family);\n font-weight: var(--ez-card-item--font-weight);\n color: var(--ez-card-item--color);\n}\n\n.card-item__highlight {\n position: relative;\n border-radius: 8px;\n z-index: -1;\n\n /*public*/\n background-color: var(--ez-card-item__highlight--color);\n outline: 2px solid var(--ez-card-item__highlight--color);\n box-shadow: -4px 0px 0px 0px var(--ez-card-item__highlight--color), \n 4px 0px 0px 0px var(--ez-card-item__highlight--color);\n}\n\n@container box (max-width: 550px) {\n .card-item__details {\n flex-direction: column;\n }\n\n .card-item__details-left {\n width: 100%;\n }\n \n .card-item__details-right {\n width: 100%;\n }\n}\n\n@container box (max-width: 200px) {\n .card-item__title {\n font-size: 10px;\n }\n\n .card-item__detail-label {\n font-size: 10px;\n }\n\n .card-item__detail-value {\n font-size: 10px;\n }\n\n}";
10
+
11
+ const EzCardItem = class {
12
+ constructor(hostRef) {
13
+ index.registerInstance(this, hostRef);
14
+ this.ezClick = index.createEvent(this, "ezClick", 7);
15
+ this.item = undefined;
16
+ }
17
+ componentWillRender() {
18
+ this.createDetailList();
19
+ }
20
+ componentDidLoad() {
21
+ var _a, _b;
22
+ const dataInfo = { id: core.StringUtils.toCamelCase(((_a = this.item) === null || _a === void 0 ? void 0 : _a.key) || ((_b = this.item) === null || _b === void 0 ? void 0 : _b.title) || "") };
23
+ core.ElementIDUtils.addIDInfo(this._element, null, dataInfo);
24
+ }
25
+ createDetailList() {
26
+ var _a, _b, _c;
27
+ this._details = { detailsLeft: [], detailsRight: [] };
28
+ let cont = 0;
29
+ if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.details) {
30
+ for (const attribute in this.item.details) {
31
+ cont < 3 ?
32
+ this._details.detailsLeft.push({ label: attribute, value: (_b = this.item.details[attribute]) === null || _b === void 0 ? void 0 : _b.toString() }) :
33
+ this._details.detailsRight.push({ label: attribute, value: (_c = this.item.details[attribute]) === null || _c === void 0 ? void 0 : _c.toString() });
34
+ cont++;
35
+ }
36
+ }
37
+ }
38
+ buildDetailContent(detail) {
39
+ return index.h("div", { class: "card-item__detail" }, index.h("label", { class: "card-item__detail-label" }, detail.label), ": ", index.h("label", { class: "card-item__detail-value", innerHTML: detail.value }));
40
+ }
41
+ render() {
42
+ return (index.h(index.Host, null, this.item &&
43
+ index.h("div", { class: "card-item", onClick: () => { this.ezClick.emit(this.item); } }, index.h("label", { class: "card-item__title" }, index.h("span", { class: "card-item__key", innerHTML: this.item.key }), index.h("span", { innerHTML: this.item.title })), index.h("div", { class: "card-item__details" }, index.h("div", { class: "card-item__details-left" }, this._details.detailsLeft.map(detail => {
44
+ return this.buildDetailContent(detail);
45
+ })), index.h("div", { class: "card-item__details-right" }, this._details.detailsRight.map(detail => {
46
+ return this.buildDetailContent(detail);
47
+ }))))));
48
+ }
49
+ get _element() { return index.getElement(this); }
50
+ };
51
+ EzCardItem.style = ezCardItemCss;
52
+
53
+ const ezFilterInputCss = ":host{display:block;width:100%}";
54
+
55
+ const EzFilterInput = class {
56
+ constructor(hostRef) {
57
+ index.registerInstance(this, hostRef);
58
+ this.ezChange = index.createEvent(this, "ezChange", 7);
59
+ this.ezSearching = index.createEvent(this, "ezSearching", 7);
60
+ this.ezFocusIn = index.createEvent(this, "ezFocusIn", 7);
61
+ this._searchingText = "";
62
+ this.handleFocus = () => {
63
+ if (this._searchingText === "") {
64
+ this._textInput.value = "";
65
+ }
66
+ else {
67
+ this._textInput.value = this._searchingText;
68
+ }
69
+ this.ezFocusIn.emit();
70
+ };
71
+ this.label = undefined;
72
+ this.value = undefined;
73
+ this.enabled = true;
74
+ this.errorMessage = undefined;
75
+ this.restrict = undefined;
76
+ this.mode = "regular";
77
+ this.asyncSearch = false;
78
+ this.canShowError = true;
79
+ }
80
+ observeLabel() {
81
+ if (this._textInput) {
82
+ this._textInput.label = this.label;
83
+ }
84
+ }
85
+ observeErrorMessage() {
86
+ if (this._textInput) {
87
+ this._textInput.errorMessage = this.errorMessage;
88
+ }
89
+ }
90
+ observeValue(newValue, oldValue) {
91
+ if (this._textInput && newValue != oldValue) {
92
+ this._textInput.value = newValue;
93
+ this.ezChange.emit(newValue);
94
+ }
95
+ }
96
+ /**
97
+ * Aplica o foco no campo.
98
+ */
99
+ async setFocus() {
100
+ this._textInput.setFocus();
101
+ }
102
+ /**
103
+ * Remove o foco do campo.
104
+ */
105
+ async setBlur() {
106
+ this._textInput.setBlur();
107
+ }
108
+ /**
109
+ * Retorna se o conteúdo é inválido.
110
+ */
111
+ async isInvalid() {
112
+ return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
113
+ }
114
+ /**
115
+ * Método responsável por setar um novo valor ao campo.
116
+ */
117
+ async setValue(newValue) {
118
+ if (!this.asyncSearch || this._textInput == undefined) {
119
+ return;
120
+ }
121
+ if (newValue !== this.value) {
122
+ this.value = newValue;
123
+ this._searchingText = "";
124
+ }
125
+ else {
126
+ this._textInput.value = newValue;
127
+ }
128
+ }
129
+ /**
130
+ * Método responsável por resetar o valor do campo para o ultimo valor inputado.
131
+ */
132
+ async endSearch() {
133
+ if (!this.asyncSearch || this._textInput == undefined) {
134
+ return;
135
+ }
136
+ if (this._textInput.value !== this.value) {
137
+ this._textInput.value = this.value;
138
+ }
139
+ }
140
+ handleChange(evt) {
141
+ const newValue = evt.detail;
142
+ this.errorMessage = "";
143
+ if (this.asyncSearch) {
144
+ this._searchingText = newValue;
145
+ this.ezSearching.emit(newValue);
146
+ }
147
+ else if (newValue !== this.value) {
148
+ this.value = newValue;
149
+ }
150
+ }
151
+ componentDidLoad() {
152
+ CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
153
+ }
154
+ render() {
155
+ core.ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
156
+ return (index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.handleChange(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, mode: this.mode, onFocusin: this.handleFocus, canShowError: this.canShowError }, index.h("ez-icon", { slot: "leftIcon", iconName: "search" })));
157
+ }
158
+ get _elem() { return index.getElement(this); }
159
+ static get watchers() { return {
160
+ "label": ["observeLabel"],
161
+ "errorMessage": ["observeErrorMessage"],
162
+ "value": ["observeValue"]
163
+ }; }
164
+ };
165
+ EzFilterInput.style = ezFilterInputCss;
166
+
167
+ const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
168
+
169
+ const MultiSelectionBoxMessage = class {
170
+ constructor(hostRef) {
171
+ index.registerInstance(this, hostRef);
172
+ this.message = undefined;
173
+ }
174
+ render() {
175
+ return (index.h("div", { class: "multi-selection__message" }, index.h("span", { class: "multi-selection__text-message" }, this.message)));
176
+ }
177
+ };
178
+ MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
179
+
180
+ exports.ez_card_item = EzCardItem;
181
+ exports.ez_filter_input = EzFilterInput;
182
+ exports.multi_selection_box_message = MultiSelectionBoxMessage;
@@ -4,11 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a7b0c73d.js');
6
6
  const core = require('@sankhyalabs/core');
7
- const ApplicationUtils = require('./ApplicationUtils-c9d1205c.js');
7
+ require('./ApplicationUtils-c9d1205c.js');
8
8
  const CSSVarsUtils = require('./CSSVarsUtils-b136a156.js');
9
9
  require('./DialogType-2114c337.js');
10
10
  require('./CheckMode-ecb90b87.js');
11
- const constants = require('./constants-2714478b.js');
12
11
 
13
12
  const ezComboBoxCss = ":host{--ez-combo-box--height:42px;--ez-combo-box--width:100%;--ez-combo-box__icon--width:48px;--ez-combo-box--border-radius:var(--border--radius-medium, 12px);--ez-combo-box--border-radius-small:var(--border--radius-small, 6px);--ez-combo-box--font-size:var(--text--medium, 14px);--ez-combo-box--font-family:var(--font-pattern, Arial);--ez-combo-box--font-weight--large:var(--text-weight--large, 500);--ez-combo-box--font-weight--medium:var(--text-weight--medium, 400);--ez-combo-box--background-color--xlight:var(--background--xlight, #fff);--ez-combo-box--background-medium:var(--background--medium, #f0f3f7);--ez-combo-box--line-height:calc(var(--text--medium, 14px) + 4px);--ez-combo-box__input--background-color:var(--background--medium, #e0e0e0);--ez-combo-box__input--border:var(--border--medium, 2px solid);--ez-combo-box__input--border-color:var(--ez-combo-box__input--background-color);--ez-combo-box__input--focus--border-color:var(--color--primary, #008561);--ez-combo-box__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-combo-box__input--disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__input--error--border-color:#CC2936;--ez-combo-box__btn--color:var(--title--primary, #2B3A54);--ez-combo-box__btn-disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-hover--color:var(--color--primary, #4e4e4e);--ez-combo-box__label--color:var(--title--primary, #2B3A54);--ez-combo-box__list-title--primary:var(--title--primary, #2B3A54);--ez-combo-box__list-text--primary:var(--text--primary, #626e82);--ez-combo-box__list-height:calc(var(--ez-combo-box--font-size) + var(--ez-combo-box--space--medium) + 4px);--ez-combo-box__list-min-width:64px;--ez-combo-box--space--medium:var(--space--medium, 12px);--ez-combo-box--space--small:var(--space--small, 6px);--ez-combo-box__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-combo-box__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-combo-box__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-combo-box__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-combo-box__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-combo-box__scrollbar--width:var(--space--medium, 12px);display:flex;flex-wrap:wrap;position:relative;width:var(--ez-combo-box--width)}ez-icon{--ez-icon--color:inherit;font-weight:var(--text-weight--large, 600)}.suppressed-search-input{--ez-text-input__input--border-color:var(--color--strokes, #dce0e8);--ez-text-input__input--disabled--background-color:var(--background--xlight, #fff);--ez-text-input__input--disabled--color:var(--title--primary, #2B3A54)}.list-container{min-width:var(--ez-combo-box__list-min-width);position:relative;width:100%}.list-wrapper{display:flex;flex-direction:column;box-sizing:border-box;width:0;z-index:var(--more-visible, 2);max-height:calc(4*var(--ez-combo-box__list-height) + 2*var(--ez-combo-box--space--small) + 9px);background-color:var(--ez-combo-box--background-color--xlight);border-radius:var(--ez-combo-box--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);padding:var(--ez-combo-box--space--small)}.list-options{box-sizing:border-box;width:100%;height:100%;padding:0;display:flex;flex-direction:column;scroll-behavior:smooth;overflow:auto;scrollbar-width:thin;gap:3px;scrollbar-color:var(--ez-combo-box__scrollbar--color-clicked) var(--ez-combo-box__scrollbar--color-background)}.list-options::-webkit-scrollbar{background-color:var(--ez-combo-box__scrollbar--color-background);width:var(--ez-combo-box__scrollbar--width);max-width:var(--ez-combo-box__scrollbar--width);min-width:var(--ez-combo-box__scrollbar--width)}.list-options::-webkit-scrollbar-track{background-color:var(--ez-combo-box__scrollbar--color-background);border-radius:var(--ez-combo-box__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb{background-color:var(--ez-combo-box__scrollbar--color-default);border-radius:var(--ez-combo-box__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb:vertical:hover,.list-options::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-combo-box__scrollbar--color-hover)}.list-options::-webkit-scrollbar-thumb:vertical:active,.list-options::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-combo-box__scrollbar--color-clicked)}.item{display:flex;align-items:center;width:100%;box-sizing:border-box;list-style-type:none;cursor:pointer;border-radius:var(--ez-combo-box--border-radius-small);padding:var(--ez-combo-box--space--small);min-height:var(--ez-combo-box__list-height);gap:var(--space--small, 6px)}.item__value,.item__label{flex-basis:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-combo-box__list-title--primary);font-family:var(--ez-combo-box--font-family);font-size:var(--ez-combo-box--font-size);line-height:var(--ez-combo-box--line-height)}.item__label{font-weight:var(--ez-combo-box--font-weight--medium)}.item__label--bold{font-weight:var(--ez-combo-box--font-weight--large)}.item__value{text-align:center;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large)}.item__value--hidden{visibility:hidden;position:absolute;white-space:nowrap;z-index:-1;top:0;left:0}.item__label{text-align:left}.message{text-align:center;display:flex;justify-content:center;align-items:center;list-style-type:none;min-height:var(--ez-combo-box__list-height)}.message__no-result{color:var(--ez-combo-box__list-title--primary);font-family:var(--ez-combo-box--font-family);font-size:var(--ez-combo-box--font-size)}.message__loading{border-radius:50%;width:14px;height:14px;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:3px solid var(--ez-combo-box__list-title--primary);border-top:3px solid transparent}li:hover{background-color:var(--ez-combo-box--background-medium)}.preselected{background-color:var(--background--medium)}.btn{outline:none;border:none;background:none;cursor:pointer;color:var(--ez-combo-box__btn--color)}.btn:disabled{cursor:unset;color:var(--ez-combo-box__btn-disabled--color)}.btn:disabled:hover{cursor:unset;color:var(--ez-combo-box__btn-disabled--color)}.btn:hover{color:var(--ez-combo-box__btn-hover--color)}.btn__close{visibility:hidden}ez-text-input:hover .btn__close,ez-text-input:focus .btn__close{visibility:visible}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
14
13
 
@@ -21,7 +20,6 @@ const EzComboBox = class {
21
20
  this._maxWidthValue = 0;
22
21
  this._tabPressed = false;
23
22
  this._textEmptyList = "Nenhum resultado encontrado";
24
- this._textEmptySearch = "Nenhum resultado de {0} encontrado";
25
23
  this._lookupMode = false;
26
24
  this._preSelection = undefined;
27
25
  this._visibleOptions = undefined;
@@ -34,7 +32,6 @@ const EzComboBox = class {
34
32
  this.enabled = true;
35
33
  this.options = undefined;
36
34
  this.errorMessage = undefined;
37
- this.searchMode = undefined;
38
35
  this.showSelectedValue = false;
39
36
  this.showOptionValue = false;
40
37
  this.suppressSearch = false;
@@ -58,7 +55,7 @@ const EzComboBox = class {
58
55
  observeValue(newValue, oldValue) {
59
56
  if (this._textInput && newValue != oldValue) {
60
57
  try {
61
- if (this.searchMode && typeof newValue === "string") {
58
+ if (typeof newValue === "string") {
62
59
  this.setInputValue();
63
60
  return;
64
61
  }
@@ -221,7 +218,7 @@ const EzComboBox = class {
221
218
  }
222
219
  updateVisibleOptions() {
223
220
  let opts = this._source || [];
224
- if (!this.searchMode && this._criteria) {
221
+ if (this._criteria) {
225
222
  const upperCriteria = this._criteria.toUpperCase();
226
223
  opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
227
224
  }
@@ -296,7 +293,7 @@ const EzComboBox = class {
296
293
  return this._floatingID !== undefined && core.FloatingManager.isFloating(this._floatingID);
297
294
  }
298
295
  nextOption() {
299
- if (this.searchMode && !this.isOptionsVisible()) {
296
+ if (!this.isOptionsVisible()) {
300
297
  return;
301
298
  }
302
299
  this.showOptions();
@@ -319,9 +316,6 @@ const EzComboBox = class {
319
316
  this.selectOption(this._visibleOptions[this._preSelection]);
320
317
  this._preSelection = undefined;
321
318
  }
322
- else {
323
- this.controlListWithOnlyOne();
324
- }
325
319
  }
326
320
  updateSource(source) {
327
321
  this._startLoading = false;
@@ -340,7 +334,6 @@ const EzComboBox = class {
340
334
  this.updateVisibleOptions();
341
335
  if (this._tabPressed) {
342
336
  this._tabPressed = false;
343
- this.controlEmptySearch();
344
337
  }
345
338
  }
346
339
  else {
@@ -348,10 +341,6 @@ const EzComboBox = class {
348
341
  }
349
342
  }
350
343
  }
351
- clearSource() {
352
- this._source = [];
353
- this.updateVisibleOptions();
354
- }
355
344
  selectOption(newOption) {
356
345
  var _a, _b;
357
346
  const currentValue = this.getSelectedOption(this.value);
@@ -363,10 +352,6 @@ const EzComboBox = class {
363
352
  else {
364
353
  this.resetOptions();
365
354
  }
366
- if (this.searchMode) {
367
- this._visibleOptions = [];
368
- this.clearSource();
369
- }
370
355
  }
371
356
  loadOptions(mode, argument = "") {
372
357
  this._criteria = argument;
@@ -402,93 +387,6 @@ const EzComboBox = class {
402
387
  clearSearch() {
403
388
  this.value = null;
404
389
  }
405
- controlListWithOnlyOne() {
406
- var _a;
407
- if (this.searchMode) {
408
- const source = (_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.filter((opt) => opt.label !== "" && opt.value != undefined);
409
- if ((source === null || source === void 0 ? void 0 : source.length) === 1) {
410
- this.selectOption(source[0]);
411
- }
412
- }
413
- }
414
- controlEmptySearch() {
415
- var _a;
416
- if (this.searchMode) {
417
- if (!((_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.length)) {
418
- this.clearSearch();
419
- ApplicationUtils.ApplicationUtils.info(this._textEmptyList);
420
- }
421
- else {
422
- this.controlListWithOnlyOne();
423
- }
424
- }
425
- }
426
- validateDescriptionValue() {
427
- if (!this.searchMode || core.StringUtils.isEmpty(this.value)) {
428
- return;
429
- }
430
- let value = this.value;
431
- if (typeof value === "object") {
432
- return;
433
- }
434
- if (core.StringUtils.isEmpty(value)) {
435
- return;
436
- }
437
- this.loadDescriptionValue(value);
438
- }
439
- async loadDescriptionValue(argument) {
440
- var _a, _b;
441
- if (argument == undefined) {
442
- return;
443
- }
444
- if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0) {
445
- this.loadOptionValue(argument);
446
- return;
447
- }
448
- const searchArgument = {
449
- mode: SearchMode.PREDICTIVE,
450
- argument
451
- };
452
- const source = await ((_b = this.optionLoader) === null || _b === void 0 ? void 0 : _b.call(this, searchArgument));
453
- if (source == undefined) {
454
- return;
455
- }
456
- if (source instanceof Promise) {
457
- source.then((result) => {
458
- this.setDescriptionValue(result);
459
- });
460
- }
461
- else {
462
- this.setDescriptionValue(source);
463
- }
464
- }
465
- setDescriptionValue(source) {
466
- const value = (source === null || source === void 0 ? void 0 : source[0]) || source;
467
- if (value == undefined || !Object.keys(value).length) {
468
- this.showNoResultMessage();
469
- return;
470
- }
471
- this._lookupMode = true;
472
- this.value = value;
473
- }
474
- loadOptionValue(argument) {
475
- var _a;
476
- const source = (_a = this.options) === null || _a === void 0 ? void 0 : _a.find((opt) => opt.value === argument);
477
- if (source != undefined) {
478
- this.selectOption(source);
479
- }
480
- else {
481
- this.showNoResultMessage();
482
- }
483
- }
484
- async showNoResultMessage() {
485
- this.clearSearch();
486
- ApplicationUtils.ApplicationUtils.info(this._textEmptySearch.replace("{0}", this.getFieldLabel()));
487
- }
488
- getFieldLabel() {
489
- var _a;
490
- return (_a = this.label) === null || _a === void 0 ? void 0 : _a.replace(constants.REQUIRED_INFO, "").toUpperCase();
491
- }
492
390
  resetOptions() {
493
391
  this.hideOptions();
494
392
  this._criteria = undefined;
@@ -514,12 +412,7 @@ const EzComboBox = class {
514
412
  });
515
413
  }
516
414
  }
517
- if (this.searchMode) {
518
- this.updateSource([]);
519
- }
520
- else {
521
- this.loadOptions(SearchMode.PRELOAD);
522
- }
415
+ this.loadOptions(SearchMode.PRELOAD);
523
416
  }
524
417
  componentDidRender() {
525
418
  var _a;
@@ -529,7 +422,6 @@ const EzComboBox = class {
529
422
  (_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
530
423
  core.ElementIDUtils.addIDInfoIfNotExists(elem, "itemComboBox");
531
424
  });
532
- this.validateDescriptionValue();
533
425
  }
534
426
  componentDidLoad() {
535
427
  CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
@@ -549,13 +441,7 @@ const EzComboBox = class {
549
441
  // Event handlers
550
442
  //---------------------------------------------
551
443
  handlerIconClick() {
552
- this.searchMode ? this.loadOptions(SearchMode.ADVANCED) : this.showOptions();
553
- }
554
- buildNumberArgument(argument) {
555
- if (this.isTextSearch) {
556
- return NaN;
557
- }
558
- return Number(argument || undefined);
444
+ this.showOptions();
559
445
  }
560
446
  onTextInputChangeHandler(event) {
561
447
  var _a;
@@ -572,36 +458,12 @@ const EzComboBox = class {
572
458
  }
573
459
  this._criteria = argument;
574
460
  if (argument) {
575
- if (this.searchMode) {
576
- this._showLoading = false;
577
- this.clearSource();
578
- const enoughChars = argument.length >= this.limitCharsToSearch;
579
- const argumentNumber = this.buildNumberArgument(argument);
580
- if (enoughChars || !isNaN(argumentNumber)) {
581
- this._showLoading = true;
582
- this._changeDeboucingTimeout = window.setTimeout(() => {
583
- this.loadOptions(SearchMode.PREDICTIVE, isNaN(argumentNumber) ? argument : argumentNumber.toString());
584
- }, this._deboucingTime);
585
- this.showOptions();
586
- }
587
- else {
588
- this.hideOptions();
589
- }
590
- }
591
- else {
592
- this.updateVisibleOptions();
593
- this.showOptions();
594
- }
461
+ this.updateVisibleOptions();
462
+ this.showOptions();
595
463
  }
596
464
  else {
597
465
  this.hideOptions();
598
- if (this.searchMode) {
599
- this._showLoading = false;
600
- this.clearSource();
601
- }
602
- else {
603
- this.updateVisibleOptions();
604
- }
466
+ this.updateVisibleOptions();
605
467
  }
606
468
  }
607
469
  clearDeboucingTimeout() {
@@ -611,9 +473,7 @@ const EzComboBox = class {
611
473
  }
612
474
  }
613
475
  onTextInputClickHandler() {
614
- if (!this.searchMode) {
615
- this.showOptions();
616
- }
476
+ this.showOptions();
617
477
  }
618
478
  keyDownHandler(event) {
619
479
  this._tabPressed = false;
@@ -645,7 +505,6 @@ const EzComboBox = class {
645
505
  break;
646
506
  case "Tab":
647
507
  this._tabPressed = true;
648
- this.controlListWithOnlyOne();
649
508
  break;
650
509
  }
651
510
  //ATENÇÃO: Existe a necessidade de propagar o evento de teclado.
@@ -662,11 +521,8 @@ const EzComboBox = class {
662
521
  return !this._showLoading && this._visibleOptions.length > 0;
663
522
  }
664
523
  render() {
665
- var _a;
666
524
  core.ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
667
- return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.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), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, index.h("button", { class: "btn", slot: this.searchMode ? "leftIcon" : "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, index.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)
668
- ? index.h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, index.h("ez-icon", { iconName: "close" }))
669
- : undefined), index.h("section", { class: "list-container", ref: elem => this._listContainer = elem }, index.h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, index.h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
525
+ return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.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), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, index.h("button", { class: "btn", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, index.h("ez-icon", { iconName: "chevron-down" }))), index.h("section", { class: "list-container", ref: elem => this._listContainer = elem }, index.h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, index.h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
670
526
  && this._visibleOptions.length === 0
671
527
  && index.h("div", { class: "message" }, index.h("span", { class: "message__no-result" }, this._textEmptyList)), this._showLoading
672
528
  && index.h("div", { class: "message" }, index.h("div", { class: "message__loading" })), this.showOptionValue