@sankhyalabs/sankhyablocks 0.0.0-bugfix-dev-KB-74246.1 → 0.0.0-bugfix-dev-KB-76362.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/dist/cjs/{SnkFormConfigManager-bff848f1.js → SnkFormConfigManager-63369164.js} +3 -3
  2. package/dist/cjs/{SnkMessageBuilder-bae64d0d.js → SnkMessageBuilder-7691a2c1.js} +10 -0
  3. package/dist/cjs/index-f9e81701.js +8 -0
  4. package/dist/cjs/input-distinct-search_2.cjs.entry.js +471 -0
  5. package/dist/cjs/loader.cjs.js +1 -1
  6. package/dist/cjs/sankhyablocks.cjs.js +1 -1
  7. package/dist/cjs/snk-application.cjs.entry.js +1 -1
  8. package/dist/cjs/snk-config-options_3.cjs.entry.js +1 -1
  9. package/dist/cjs/snk-data-exporter.cjs.entry.js +2 -2
  10. package/dist/cjs/{snk-data-unit-3d4d0e2a.js → snk-data-unit-7dbdad0e.js} +1 -1
  11. package/dist/cjs/snk-data-unit.cjs.entry.js +2 -2
  12. package/dist/cjs/snk-detail-view.cjs.entry.js +3 -3
  13. package/dist/cjs/snk-distinct-search.cjs.entry.js +123 -0
  14. package/dist/cjs/{snk-guides-viewer-2b44c804.js → snk-guides-viewer-eee43c8b.js} +1 -1
  15. package/dist/cjs/snk-guides-viewer.cjs.entry.js +2 -2
  16. package/dist/cjs/snk-simple-crud.cjs.entry.js +1 -1
  17. package/dist/collection/collection-manifest.json +3 -0
  18. package/dist/collection/components/snk-distinct-search/snk-distinct-search.css +4 -0
  19. package/dist/collection/components/snk-distinct-search/snk-distinct-search.js +372 -0
  20. package/dist/collection/components/snk-distinct-search/subcomponents/input-distinct-search/input-distinct-search.css +110 -0
  21. package/dist/collection/components/snk-distinct-search/subcomponents/input-distinct-search/input-distinct-search.js +544 -0
  22. package/dist/collection/components/snk-distinct-search/subcomponents/search-modal/search-modal.css +28 -0
  23. package/dist/collection/components/snk-distinct-search/subcomponents/search-modal/search-modal.js +593 -0
  24. package/dist/collection/components/snk-distinct-search/types/index.js +1 -0
  25. package/dist/collection/components/snk-distinct-search/utils/filter-distinct-search.js +15 -0
  26. package/dist/collection/components/snk-form-config/SnkFormConfigManager.js +3 -3
  27. package/dist/collection/lib/http/data-fetcher/fetchers/distinct-search-fetcher.js +25 -0
  28. package/dist/collection/lib/message/SnkMessageBuilder.js +2 -0
  29. package/dist/collection/lib/message/resources/snk-distinct-search.msg.js +9 -0
  30. package/dist/components/SnkFormConfigManager.js +3 -3
  31. package/dist/components/SnkMessageBuilder.js +10 -0
  32. package/dist/components/filter-distinct-search.js +17 -0
  33. package/dist/components/index.d.ts +3 -0
  34. package/dist/components/index.js +3 -0
  35. package/dist/components/input-distinct-search.d.ts +11 -0
  36. package/dist/components/input-distinct-search.js +6 -0
  37. package/dist/components/input-distinct-search2.js +264 -0
  38. package/dist/components/search-modal.d.ts +11 -0
  39. package/dist/components/search-modal.js +6 -0
  40. package/dist/components/search-modal2.js +264 -0
  41. package/dist/components/snk-distinct-search.d.ts +11 -0
  42. package/dist/components/snk-distinct-search.js +163 -0
  43. package/dist/esm/{SnkFormConfigManager-f0532f7d.js → SnkFormConfigManager-b409c745.js} +3 -3
  44. package/dist/esm/{SnkMessageBuilder-6fff4a4c.js → SnkMessageBuilder-7ace6803.js} +10 -0
  45. package/dist/esm/index-a7d3d3f1.js +8 -0
  46. package/dist/esm/input-distinct-search_2.entry.js +466 -0
  47. package/dist/esm/loader.js +1 -1
  48. package/dist/esm/sankhyablocks.js +1 -1
  49. package/dist/esm/snk-application.entry.js +1 -1
  50. package/dist/esm/snk-config-options_3.entry.js +1 -1
  51. package/dist/esm/snk-data-exporter.entry.js +2 -2
  52. package/dist/esm/{snk-data-unit-618e0b80.js → snk-data-unit-7a579dbd.js} +1 -1
  53. package/dist/esm/snk-data-unit.entry.js +2 -2
  54. package/dist/esm/snk-detail-view.entry.js +3 -3
  55. package/dist/esm/snk-distinct-search.entry.js +119 -0
  56. package/dist/esm/{snk-guides-viewer-15c916a3.js → snk-guides-viewer-e8ca764a.js} +1 -1
  57. package/dist/esm/snk-guides-viewer.entry.js +2 -2
  58. package/dist/esm/snk-simple-crud.entry.js +1 -1
  59. package/dist/sankhyablocks/{p-9c3138f5.entry.js → p-00f9fe5c.entry.js} +1 -1
  60. package/dist/sankhyablocks/p-0e206e62.js +1 -0
  61. package/dist/sankhyablocks/{p-c88ad28e.entry.js → p-0e250436.entry.js} +1 -1
  62. package/dist/sankhyablocks/{p-da87e42c.entry.js → p-154aa2a6.entry.js} +1 -1
  63. package/dist/sankhyablocks/p-18cb1acb.entry.js +1 -0
  64. package/dist/sankhyablocks/{p-bab79110.entry.js → p-30ebcbe0.entry.js} +1 -1
  65. package/dist/sankhyablocks/p-3755b46f.entry.js +1 -0
  66. package/dist/sankhyablocks/{p-d1da52e1.entry.js → p-42130213.entry.js} +1 -1
  67. package/dist/sankhyablocks/{p-e41bd8ee.entry.js → p-b389ed49.entry.js} +1 -1
  68. package/dist/sankhyablocks/{p-a75e9dcc.js → p-c75fae8e.js} +1 -1
  69. package/dist/sankhyablocks/p-d8665750.js +1 -0
  70. package/dist/sankhyablocks/{p-ae50d69f.js → p-e3a285a2.js} +1 -1
  71. package/dist/sankhyablocks/{p-c1adf0dd.entry.js → p-f4e221b2.entry.js} +1 -1
  72. package/dist/sankhyablocks/sankhyablocks.esm.js +1 -1
  73. package/dist/types/components/snk-distinct-search/snk-distinct-search.d.ts +83 -0
  74. package/dist/types/components/snk-distinct-search/subcomponents/input-distinct-search/input-distinct-search.d.ts +105 -0
  75. package/dist/types/components/snk-distinct-search/subcomponents/search-modal/search-modal.d.ts +127 -0
  76. package/dist/types/components/snk-distinct-search/types/index.d.ts +12 -0
  77. package/dist/types/components/snk-distinct-search/utils/filter-distinct-search.d.ts +4 -0
  78. package/dist/types/components.d.ts +393 -1
  79. package/dist/types/lib/http/data-fetcher/fetchers/distinct-search-fetcher.d.ts +6 -0
  80. package/dist/types/lib/message/resources/snk-distinct-search.msg.d.ts +2 -0
  81. package/package.json +1 -1
  82. package/react/components.d.ts +3 -0
  83. package/react/components.js +3 -0
  84. package/react/components.js.map +1 -1
  85. package/dist/sankhyablocks/p-17425c72.js +0 -1
  86. package/dist/sankhyablocks/p-a0ebd886.js +0 -1
@@ -90,13 +90,13 @@ class SnkFormConfigManager {
90
90
  const fields = (_a = this._config) === null || _a === void 0 ? void 0 : _a.fields;
91
91
  const hasConfig = this.hasConfig();
92
92
  if (hasConfig && !forceEmptyConfig) {
93
- return fields.map(({ label, name, readOnly, visible, required, tab, group }) => {
93
+ return fields.map(({ label, name, readOnly, visible, required, tab }) => {
94
94
  var _a;
95
95
  if (label == undefined) {
96
96
  const currentField = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getField(name);
97
- return Object.assign(Object.assign({}, currentField), { name: name !== null && name !== void 0 ? name : currentField.name, readOnly: readOnly !== null && readOnly !== void 0 ? readOnly : currentField.readOnly, visible: visible !== null && visible !== void 0 ? visible : currentField.visible, required: required !== null && required !== void 0 ? required : currentField.required, tab: tab, group: group });
97
+ return Object.assign(Object.assign({}, currentField), { name: name !== null && name !== void 0 ? name : currentField.name, readOnly: readOnly !== null && readOnly !== void 0 ? readOnly : currentField.readOnly, visible: visible !== null && visible !== void 0 ? visible : currentField.visible, required: required !== null && required !== void 0 ? required : currentField.required, tab: tab });
98
98
  }
99
- return { name, label, readOnly, visible, required, tab, group };
99
+ return { name, label, readOnly, visible, required, tab };
100
100
  })
101
101
  .filter(field => this.isFieldVisible(field, descriptionFilter));
102
102
  }
@@ -194,6 +194,15 @@ const snkAttachMessages$1 = {
194
194
  }
195
195
  };
196
196
 
197
+ const snkDistinctSearchMessages = {
198
+ titleBadgeNew: "novo",
199
+ titleAdd: "Adicionar",
200
+ availableResults: "resultados disponíveis",
201
+ availableResult: "resultado disponível",
202
+ limitResult: "Esta pesquisa foi limitada, existem mais resultados",
203
+ emptyResult: "Nenhum resultado disponível. <br/>Você pode adicionar um novo termo",
204
+ };
205
+
197
206
  const snkConfigOptionsMessages = {
198
207
  label: {
199
208
  nameField: "Nome do Campo *",
@@ -574,6 +583,7 @@ class SnkMessageBuilder {
574
583
  snkEntityList: snkEntityListMessages,
575
584
  snkActionsButton: snkActionsButtonMessages,
576
585
  snkPrintSelector: snkPrintSelectorMessages,
586
+ snkDistinctSearch: snkDistinctSearchMessages,
577
587
  };
578
588
  this._currentOperation = exports.OperationMap.CLEAN;
579
589
  this._domainName = domainName;
@@ -2132,6 +2132,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
2132
2132
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2133
2133
  /* webpackMode: "lazy" */
2134
2134
  './snk-custom-slot-elements.cjs.entry.js')); }).then(processMod, consoleError);
2135
+ case 'snk-distinct-search.cjs':
2136
+ return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2137
+ /* webpackMode: "lazy" */
2138
+ './snk-distinct-search.cjs.entry.js')); }).then(processMod, consoleError);
2135
2139
  case 'snk-entity-list.cjs':
2136
2140
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2137
2141
  /* webpackMode: "lazy" */
@@ -2176,6 +2180,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
2176
2180
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2177
2181
  /* webpackMode: "lazy" */
2178
2182
  './teste-pesquisa.cjs.entry.js')); }).then(processMod, consoleError);
2183
+ case 'input-distinct-search_2.cjs':
2184
+ return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2185
+ /* webpackMode: "lazy" */
2186
+ './input-distinct-search_2.cjs.entry.js')); }).then(processMod, consoleError);
2179
2187
  case 'snk-filter-modal-item.cjs':
2180
2188
  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
2181
2189
  /* webpackMode: "lazy" */
@@ -0,0 +1,471 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-f9e81701.js');
6
+ const core = require('@sankhyalabs/core');
7
+ const EzScrollDirection = require('@sankhyalabs/ezui/dist/collection/components/ez-scroller/EzScrollDirection');
8
+
9
+ function normalizeString(text = "") {
10
+ return text.normalize('NFD').replace(/[\u0300-\u036f/\s'"&.-]/g, "").toUpperCase();
11
+ }
12
+ function filterItems(searchArgument, distinctItems, maxItems) {
13
+ const normalizedSearch = normalizeString(searchArgument);
14
+ const filteredDistincts = distinctItems.filter((item) => normalizeString(item).includes(normalizedSearch));
15
+ const isLimited = filteredDistincts.length > maxItems;
16
+ const items = filteredDistincts.slice(0, maxItems);
17
+ return { items, isLimited };
18
+ }
19
+ function getMatchOption(value, distinctItems) {
20
+ const normalizedSearch = normalizeString(value);
21
+ const item = distinctItems.find((item) => normalizeString(item) === normalizedSearch);
22
+ return item;
23
+ }
24
+
25
+ const inputDistinctSearchCss = ":host{--max-height-popover:180px;--scrollbar--color-default:var(--scrollbar--default, #626e82);--scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--scrollbar--border-radius:var(--border--radius-small, 6px);--scrollbar--width:var(--space--medium, 12px)}.divider{margin:var(--space--extra-small, 3px) 0;border:var(--border--small, 1px solid) var(--color--disable-secondary, #F2F5F8)}.new-value{color:var(--text--primary, #626e82);padding:var(--space--2xs, 8px) var(--space--3xs, 4px);font-size:var(--text--medium, 14px);font-family:var(--font-pattern, Roboto);cursor:pointer;border-radius:var(--border--radius-small, 6px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:none;background:none;width:100%;display:flex;min-height:max-content}.new-value-selected{background-color:var(--color--primary-300, #E2F4EF)}.new-value:hover{background-color:var(--background--medium, #e0e0e0)}.popover-content{margin:var(--space--small, 6px);max-height:calc(var(--max-height-popover) - (2 * var(--space--small, 6px)));display:flex;flex-direction:column}.list-container{overflow:auto;scrollbar-width:thin;scrollbar-color:var(--scrollbar--color-clicked) var(--scrollbar--color-background);padding-right:var(--space--small, 6px)}.list-container::-webkit-scrollbar{background-color:var(--scrollbar--color-background);width:var(--scrollbar--width);max-width:var(--scrollbar--width);min-width:var(--scrollbar--width)}.list-container::-webkit-scrollbar-track{background-color:var(--scrollbar--color-background);border-radius:var(--scrollbar--border-radius)}.list-container::-webkit-scrollbar-thumb{background-color:var(--scrollbar--color-default);border-radius:var(--scrollbar--border-radius)}.list-container::-webkit-scrollbar-thumb:vertical:hover,.list-container::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--scrollbar--color-hover)}.list-container::-webkit-scrollbar-thumb:vertical:active,.list-container::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--scrollbar--color-clicked)}ez-popover{--ez-popover__box--z-index:15}.space-error{--ez-popover__margin:-19px 0 0 0}ez-list{--ez-list__item--margin:0}ez-text-input{--ez-text-input__icon--margin:var(--space--xs, 12px)}.badge-primary{--ez-badge--background-color:var(--color--primary-300);--ez-badge--color:var(--color--primary)}";
26
+
27
+ const InputDistinctSearch = class {
28
+ constructor(hostRef) {
29
+ index.registerInstance(this, hostRef);
30
+ this.changeValue = index.createEvent(this, "changeValue", 7);
31
+ this.iconClick = index.createEvent(this, "iconClick", 7);
32
+ this.textValue = "";
33
+ this.isNewItem = false;
34
+ this.filteredItems = [];
35
+ this.isNewItemSelected = false;
36
+ this.application = undefined;
37
+ this.distinctItems = [];
38
+ this.label = "";
39
+ this.value = "";
40
+ this.maxItems = 100;
41
+ this.debounceTime = 300;
42
+ this.canShowError = false;
43
+ this.mode = 'regular';
44
+ this.restrict = undefined;
45
+ this.errorMessage = undefined;
46
+ }
47
+ async observerValue(newValue) {
48
+ await this.selectedNewItem(newValue, true);
49
+ }
50
+ /**
51
+ * Seleciona um item
52
+ */
53
+ async selectValue(value, isNewItem = false) {
54
+ this.isNewItem = isNewItem;
55
+ this.textValue = value;
56
+ await this._refFilterInput.setValue(value);
57
+ }
58
+ /**
59
+ * Método para limpa o campo de entrada de pesquisa
60
+ */
61
+ clearInput() {
62
+ this._refFilterInput.setValue("");
63
+ }
64
+ /**
65
+ * Retorna se o conteúdo é inválido.
66
+ */
67
+ isInvalid() {
68
+ return this._refFilterInput.isInvalid();
69
+ }
70
+ /**
71
+ * Remove o foco do campo
72
+ */
73
+ setBlur() {
74
+ this._refFilterInput.setBlur();
75
+ }
76
+ /**
77
+ * Aplica o foco do campo
78
+ */
79
+ setFocus() {
80
+ this._refFilterInput.setFocus();
81
+ }
82
+ getMessage(key) {
83
+ return this.application.messagesBuilder.getMessage(key, null);
84
+ }
85
+ async optionLoader(searchArgument) {
86
+ return new Promise((resolve) => {
87
+ if (this._debounceTimeout) {
88
+ clearTimeout(this._debounceTimeout);
89
+ }
90
+ this._debounceTimeout = setTimeout(() => {
91
+ const { items } = filterItems(searchArgument, this.distinctItems, this.maxItems);
92
+ this.filteredItems = items;
93
+ resolve();
94
+ }, this.debounceTime);
95
+ });
96
+ }
97
+ async openPopOver() {
98
+ var _a;
99
+ await ((_a = this._refPopOver) === null || _a === void 0 ? void 0 : _a.showUnder(this._refFilterInput));
100
+ }
101
+ async closePopOver() {
102
+ var _a;
103
+ this.isNewItemSelected = false;
104
+ await ((_a = this._refPopOver) === null || _a === void 0 ? void 0 : _a.hide());
105
+ await this._refList.removeSelection();
106
+ }
107
+ async onTextChange(event) {
108
+ this.textValue = event.detail;
109
+ await this.optionLoader(event.detail);
110
+ await this.selectFirstItem();
111
+ }
112
+ onIconClick() {
113
+ this.iconClick.emit();
114
+ }
115
+ buidItems() {
116
+ var _a;
117
+ const items = (_a = this.filteredItems) === null || _a === void 0 ? void 0 : _a.map((item) => ({
118
+ label: item,
119
+ id: normalizeString(item),
120
+ }));
121
+ return items;
122
+ }
123
+ async setValue(value, isNewItem = false, preventEventEmit = false) {
124
+ this.isNewItem = isNewItem;
125
+ this.textValue = value;
126
+ await this._refFilterInput.setValue(value);
127
+ await this.closePopOver();
128
+ if (!preventEventEmit) {
129
+ this.changeValue.emit({
130
+ value,
131
+ isNewItem,
132
+ });
133
+ }
134
+ }
135
+ async selectedNewItem(value, preventEventEmit = false) {
136
+ if (!this.textValue && !value) {
137
+ await this.setValue("", false, preventEventEmit);
138
+ return;
139
+ }
140
+ const item = getMatchOption(value !== null && value !== void 0 ? value : this.textValue, this.distinctItems);
141
+ if (item) {
142
+ await this.setValue(item, false, preventEventEmit);
143
+ return;
144
+ }
145
+ await this.setValue(this.textValue || value, true, preventEventEmit);
146
+ }
147
+ async setSelectedValue() {
148
+ const selectedValue = await this._refList.getSelection();
149
+ await this.selectedNewItem((selectedValue === null || selectedValue === void 0 ? void 0 : selectedValue.label) || this.textValue, true);
150
+ await this._refFilterInput.setBlur();
151
+ this._element.focus();
152
+ }
153
+ async selectNextItem() {
154
+ if (this.isNewItemSelected) {
155
+ return;
156
+ }
157
+ const itemSelected = await this._refList.getSelection();
158
+ const itemsAmount = this.filteredItems.length;
159
+ const indexSelected = this.filteredItems.findIndex((item) => item === (itemSelected === null || itemSelected === void 0 ? void 0 : itemSelected.label));
160
+ const isLastItemSelected = indexSelected === (itemsAmount - 1);
161
+ const optionNewItemIsAvailable = !!this.textValue;
162
+ if (!isLastItemSelected || !optionNewItemIsAvailable) {
163
+ this.isNewItemSelected = false;
164
+ await this._refList.selectNextItem();
165
+ return;
166
+ }
167
+ this.isNewItemSelected = true;
168
+ await this._refList.removeSelection();
169
+ }
170
+ async selectPreviousItem() {
171
+ const itemsAmount = this.filteredItems.length;
172
+ const lastItem = this.filteredItems[itemsAmount - 1];
173
+ if (this.isNewItemSelected && lastItem) {
174
+ this.isNewItemSelected = false;
175
+ await this._refList.setSelection({
176
+ id: normalizeString(lastItem),
177
+ label: lastItem
178
+ });
179
+ return;
180
+ }
181
+ await this._refList.selectPreviousItem();
182
+ }
183
+ bindKeyboardManager() {
184
+ this._keyboardManager = new core.KeyboardManager({ propagate: false, element: this._element });
185
+ this._keyboardManager
186
+ .bind("ArrowDown", () => { this.selectNextItem(); })
187
+ .bind("ArrowUp", () => { this.selectPreviousItem(); })
188
+ .bind("Enter", () => { this.setSelectedValue(); })
189
+ .bind("Tab", () => { this.setSelectedValue(); });
190
+ }
191
+ unbindKeyboardManager() {
192
+ this._keyboardManager
193
+ .unbind("ArrowDown")
194
+ .unbind("ArrowUp")
195
+ .unbind("Enter")
196
+ .unbind("Tab");
197
+ }
198
+ async selectFirstItem() {
199
+ if (!this.filteredItems.length) {
200
+ await this._refList.removeSelection();
201
+ this.isNewItemSelected = true;
202
+ return;
203
+ }
204
+ const firstItem = this.filteredItems[0];
205
+ this.isNewItemSelected = false;
206
+ await this._refList.setSelection({
207
+ id: normalizeString(firstItem),
208
+ label: firstItem,
209
+ });
210
+ }
211
+ initializeComponent() {
212
+ const { items } = filterItems("", this.distinctItems, this.maxItems);
213
+ this.filteredItems = items;
214
+ }
215
+ componentWillLoad() {
216
+ this.initializeComponent();
217
+ }
218
+ async componentDidLoad() {
219
+ this.bindKeyboardManager();
220
+ this.selectFirstItem();
221
+ await this.selectedNewItem(this.value, true);
222
+ }
223
+ disconnectedCallback() {
224
+ this.unbindKeyboardManager();
225
+ }
226
+ buildNewItemOption() {
227
+ if (!this.textValue) {
228
+ return;
229
+ }
230
+ return (index.h(index.Fragment, null, !!this.filteredItems.length &&
231
+ index.h("hr", { class: "divider" }), index.h("button", { slot: "bottomSlot", class: {
232
+ "new-value": true,
233
+ "new-value-selected": this.isNewItemSelected,
234
+ }, title: `${this.getMessage("snkDistinctSearch.titleAdd")} '${this.textValue}'`, onClick: () => this.selectedNewItem.bind(this)(undefined, true) }, this.getMessage("snkDistinctSearch.titleAdd"), " '", this.textValue, "'")));
235
+ }
236
+ render() {
237
+ return (index.h(index.Host, { onBlur: () => this.selectedNewItem.bind(this)() }, index.h("ez-filter-input", { ref: (ref) => this._refFilterInput = ref, label: this.label, value: this.textValue, onEzChange: this.onTextChange.bind(this), onEzIconClick: this.onIconClick.bind(this), onEzFocusIn: this.openPopOver.bind(this), canShowError: this.canShowError, mode: this.mode, restrict: this.restrict, errorMessage: this.errorMessage, enabledIconClick: true }, this.isNewItem &&
238
+ index.h("ez-badge", { slot: "right", label: this.getMessage("snkDistinctSearch.titleBadgeNew"), size: "small-medium", class: "badge-primary" })), index.h("ez-popover", { ref: (ref) => this._refPopOver = ref, boxWidth: "full-width", autoClose: false, overlayType: "none", class: {
239
+ 'space-error': this.canShowError,
240
+ } }, index.h("div", { class: "popover-content" }, index.h("section", { class: "list-container" }, index.h("ez-list", { ref: (ref) => this._refList = ref, dataSource: this.buidItems(), onEzClickItem: ({ detail }) => this.setValue.bind(this)(detail.label, false, true), ezSelectable: true, hoverFeedback: true, disableShortcuts: true })), this.buildNewItemOption()))));
241
+ }
242
+ get _element() { return index.getElement(this); }
243
+ static get watchers() { return {
244
+ "value": ["observerValue"]
245
+ }; }
246
+ };
247
+ InputDistinctSearch.style = inputDistinctSearchCss;
248
+
249
+ const searchModalCss = ".sc-search-modal-h{display:block}ez-popup.sc-search-modal{--ez-popup__title--font-size:var(--title--large, 20px);--ez-popup__container--height:380px}.search-modal-scroller.sc-search-modal{height:174px}.search-modal-text.sc-search-modal{font-family:var(--font-pattern);color:var(--text--primary);font-size:var(--text--medium)}ez-filter-input.sc-search-modal>input.sc-search-modal{text-overflow:ellipsis}.ez-content.sc-search-modal{height:190px;display:flex;align-items:center;justify-content:center}";
250
+
251
+ const SearchModal = class {
252
+ constructor(hostRef) {
253
+ index.registerInstance(this, hostRef);
254
+ this.popupClose = index.createEvent(this, "popupClose", 7);
255
+ this.changeValue = index.createEvent(this, "changeValue", 7);
256
+ this.debounceTimeout = null;
257
+ this.filteredItems = [];
258
+ this.searchFocus = false;
259
+ this.isLimited = false;
260
+ this.application = undefined;
261
+ this.listItens = [];
262
+ this.opened = false;
263
+ this.value = undefined;
264
+ this.canShowError = false;
265
+ this.emptyMessage = undefined;
266
+ this.debounceTime = 300;
267
+ this.maxItens = 100;
268
+ this.label = 'Pesquisar';
269
+ this.mode = 'regular';
270
+ this.restrict = undefined;
271
+ this.errorMessage = undefined;
272
+ }
273
+ /**
274
+ * Método para adicionar a nova palavra e chamar o método closeModal() para fechar o modal
275
+ */
276
+ addNewItem() {
277
+ this.closeModal();
278
+ this.changeValue.emit({ isNewItem: true, value: this.value });
279
+ }
280
+ /**
281
+ * Método para limpa o campo de entrada de pesquisa
282
+ */
283
+ clearInput() {
284
+ this._refFilterInput.setValue("");
285
+ }
286
+ /**
287
+ * Método para fechar o modal
288
+ */
289
+ closeModal() {
290
+ this._popupElement.opened = false;
291
+ this.popupClose.emit(false);
292
+ }
293
+ /**
294
+ * Método para abrir o modal
295
+ */
296
+ openModal() {
297
+ this._popupElement.opened = true;
298
+ setTimeout(() => this.setFocus(), 100);
299
+ }
300
+ /**
301
+ * Retorna se o conteúdo é inválido.
302
+ */
303
+ isInvalid() {
304
+ this._refFilterInput.isInvalid();
305
+ }
306
+ /**
307
+ * Remove o foco do campo
308
+ */
309
+ setBlur() {
310
+ this._refFilterInput.setBlur();
311
+ this.searchFocus = false;
312
+ }
313
+ /**
314
+ * Aplica o foco do campo
315
+ */
316
+ setFocus() {
317
+ this._refFilterInput.setFocus();
318
+ this.searchFocus = true;
319
+ }
320
+ /**
321
+ * Método para tratar a mensagem de erro
322
+ */
323
+ watchPropErrorMessage() {
324
+ this._refFilterInput.errorMessage = this.errorMessage;
325
+ }
326
+ /**
327
+ * Método para tratar o value do input
328
+ */
329
+ watchPropValue() {
330
+ this._refFilterInput.value = this.value;
331
+ }
332
+ /**
333
+ * Atualiza a lista de itens à medida que o usuário digita no campo de pesquisa.
334
+ */
335
+ async handleInput(event) {
336
+ if (this.debounceTimeout) {
337
+ clearTimeout(this.debounceTimeout);
338
+ }
339
+ this.value = event.detail;
340
+ this.debounceTimeout = setTimeout(async () => {
341
+ var _a;
342
+ const { isLimited, items } = filterItems(event.detail, this.listItens, this.maxItens);
343
+ this.filteredItems = items;
344
+ this.isLimited = isLimited;
345
+ await ((_a = this._refList) === null || _a === void 0 ? void 0 : _a.removeSelection());
346
+ }, this.debounceTime);
347
+ }
348
+ initializeComponent() {
349
+ this.filteredItems = this.listItens;
350
+ }
351
+ getMessage(key) {
352
+ return this.application.messagesBuilder.getMessage(key, null);
353
+ }
354
+ componentWillLoad() {
355
+ this.initializeComponent();
356
+ }
357
+ componentDidLoad() {
358
+ this.bindKeyboardManager();
359
+ this._refFilterInput.value = this.value;
360
+ const { isLimited, items } = filterItems(this.value, this.listItens, this.maxItens);
361
+ this.filteredItems = items;
362
+ this.isLimited = isLimited;
363
+ }
364
+ disconnectedCallback() {
365
+ this.unbindKeyboardManager();
366
+ }
367
+ buildItems() {
368
+ var _a;
369
+ const items = (_a = this.filteredItems) === null || _a === void 0 ? void 0 : _a.map((item) => ({
370
+ label: item,
371
+ id: normalizeString(item),
372
+ }));
373
+ return items;
374
+ }
375
+ async tabSelect() {
376
+ var _a;
377
+ const selectedValue = await ((_a = this._refList) === null || _a === void 0 ? void 0 : _a.getSelection());
378
+ if (this.searchFocus && this._refList) {
379
+ this.searchFocus = false;
380
+ this._refList.focus();
381
+ await this.selectFirstItem();
382
+ }
383
+ else if (selectedValue) {
384
+ await this._refList.removeSelection();
385
+ await this._refButton.setFocus();
386
+ }
387
+ else {
388
+ await this._refButton.setBlur();
389
+ this.setFocus();
390
+ }
391
+ }
392
+ bindKeyboardManager() {
393
+ this._keyboardManager = new core.KeyboardManager({ propagate: false, element: this._element });
394
+ this._keyboardManager
395
+ .bind("ArrowDown", () => { this.selectNextItem(); })
396
+ .bind("ArrowUp", () => { this.selectPreviousItem(); })
397
+ .bind("Enter", () => { this.setSelectedValue(); })
398
+ .bind("Tab", () => { this.tabSelect(); });
399
+ }
400
+ unbindKeyboardManager() {
401
+ this._keyboardManager
402
+ .unbind("ArrowDown")
403
+ .unbind("ArrowUp")
404
+ .unbind("Enter")
405
+ .unbind("Tab");
406
+ }
407
+ async setSelectedValue() {
408
+ var _a;
409
+ const selectedValue = await ((_a = this._refList) === null || _a === void 0 ? void 0 : _a.getSelection());
410
+ if (selectedValue) {
411
+ this.changeValue.emit({ isNewItem: false, value: selectedValue.label });
412
+ this.closeModal();
413
+ }
414
+ else if (this.searchFocus && this.enabledButtonNewItem()) {
415
+ this.addNewItem();
416
+ }
417
+ }
418
+ async selectNextItem() {
419
+ var _a;
420
+ const itemSelected = await ((_a = this._refList) === null || _a === void 0 ? void 0 : _a.getSelection());
421
+ if (this.searchFocus && !itemSelected) {
422
+ this.setBlur();
423
+ await this.selectFirstItem();
424
+ return;
425
+ }
426
+ await this._refList.selectNextItem();
427
+ }
428
+ async selectPreviousItem() {
429
+ const itemSelected = await this._refList.getSelection();
430
+ if (itemSelected === undefined)
431
+ return;
432
+ await this._refList.selectPreviousItem();
433
+ }
434
+ async selectFirstItem() {
435
+ if (!this.filteredItems.length) {
436
+ await this._refList.removeSelection();
437
+ return;
438
+ }
439
+ const firstItem = this.filteredItems[0];
440
+ await this._refList.setSelection({
441
+ id: normalizeString(firstItem),
442
+ label: firstItem,
443
+ });
444
+ }
445
+ enabledButtonNewItem() {
446
+ if (this.value === undefined)
447
+ return false;
448
+ if (getMatchOption(this.value, this.listItens))
449
+ return false;
450
+ return this.value.trim().length === 0 ? false : true;
451
+ }
452
+ buildMessage() {
453
+ if (this.isLimited) {
454
+ return this.getMessage("snkDistinctSearch.limitResult");
455
+ }
456
+ return `${this.filteredItems.length} ${this.filteredItems.length > 1 ? this.getMessage("snkDistinctSearch.availableResults") : this.getMessage("snkDistinctSearch.availableResult")}`;
457
+ }
458
+ render() {
459
+ var _a;
460
+ return (index.h(index.Host, null, index.h("ez-popup", { ref: (ref) => this._popupElement = ref, size: "400px", "ez-title": this.label, onEzClosePopup: () => this.popupClose.emit(false), "height-mode": "full" }, index.h("div", null, index.h("ez-filter-input", { ref: (ref) => this._refFilterInput = ref, label: "Pesquisar", onEzChange: this.handleInput.bind(this), onBlur: () => this.searchFocus = false, onEzFocusIn: () => this.searchFocus = true, errorMessage: this.errorMessage, canShowError: this.canShowError, mode: this.mode, value: this.value, restrict: this.restrict }), this.filteredItems.length === 0 ? (index.h("div", { class: "ez-content" }, index.h("div", { class: "ez-text--center search-modal-text" }, this.emptyMessage))) : (index.h("div", null, index.h("div", { class: "search-modal-text ez-padding-vertical--medium" }, this.buildMessage()), index.h("ez-scroller", { class: "search-modal-scroller", direction: EzScrollDirection.EzScrollDirection.VERTICAL }, index.h("ez-list", { ref: (ref) => this._refList = ref, dataSource: this.buildItems(), onEzClickItem: ({ label }) => this.setSelectedValue.bind(this)(label), ezSelectable: true, hoverFeedback: true, disableShortcuts: true })))), index.h("div", { class: "ez-flex ez-flex--justify-end" }, index.h("ez-button", { ref: (ref) => this._refButton = ref, class: "ez-button--tertiary", enabled: this.enabledButtonNewItem(), label: `${this.getMessage("snkDistinctSearch.titleAdd")} ${(_a = this.label) === null || _a === void 0 ? void 0 : _a.toLocaleLowerCase()}`, onClick: () => this.addNewItem() }))))));
461
+ }
462
+ get _element() { return index.getElement(this); }
463
+ static get watchers() { return {
464
+ "errorMessage": ["watchPropErrorMessage"],
465
+ "value": ["watchPropValue"]
466
+ }; }
467
+ };
468
+ SearchModal.style = searchModalCss;
469
+
470
+ exports.input_distinct_search = InputDistinctSearch;
471
+ exports.search_modal = SearchModal;