@sankhyalabs/ezui 5.20.0-dev.1 → 5.20.0-dev.3
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.
- package/dist/cjs/ez-card-item_3.cjs.entry.js +182 -0
- package/dist/cjs/ez-combo-box.cjs.entry.js +11 -155
- package/dist/cjs/ez-search.cjs.entry.js +611 -31
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/index-a7b0c73d.js +2 -6
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/ez-card-item/ez-card-item.css +16 -0
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +12 -173
- package/dist/collection/components/ez-search/ez-search.css +330 -0
- package/dist/collection/components/ez-search/ez-search.js +689 -55
- package/dist/custom-elements/index.js +628 -195
- package/dist/esm/ez-card-item_3.entry.js +176 -0
- package/dist/esm/ez-combo-box.entry.js +12 -156
- package/dist/esm/ez-search.entry.js +613 -33
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/index-baa5e267.js +2 -6
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-133fae4a.entry.js +1 -0
- package/dist/ezui/p-43b03119.entry.js +1 -0
- package/dist/ezui/p-ba875f37.entry.js +1 -0
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +0 -15
- package/dist/types/components/ez-search/ez-search.d.ts +100 -10
- package/dist/types/components.d.ts +23 -14
- package/dist/types/utils/interfaces/AbstractFieldMetadata.d.ts +2 -1
- package/package.json +1 -1
- package/dist/cjs/ez-card-item.cjs.entry.js +0 -52
- package/dist/cjs/ez-filter-input_2.cjs.entry.js +0 -137
- package/dist/esm/ez-card-item.entry.js +0 -48
- package/dist/esm/ez-filter-input_2.entry.js +0 -132
- package/dist/ezui/p-05f5a778.entry.js +0 -1
- package/dist/ezui/p-5613fe63.entry.js +0 -1
- package/dist/ezui/p-a32aaac6.entry.js +0 -1
- package/dist/ezui/p-a5ac7151.entry.js +0 -1
|
@@ -1981,7 +1981,7 @@ const EzCalendar$1 = class extends HTMLElement$1 {
|
|
|
1981
1981
|
static get style() { return ezCalendarCss; }
|
|
1982
1982
|
};
|
|
1983
1983
|
|
|
1984
|
-
const ezCardItemCss = ":host{--ez-card-item--font-size:var(--text--medium, 14px)
|
|
1984
|
+
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}\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 cursor: pointer;\n width: 50%;\n}\n\n.card-item__details-right {\n width: 50%;\n cursor: pointer;\n}\n\n.card-item__detail:not(:last-child) {\n cursor: pointer;\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: 500px) {\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}";
|
|
1985
1985
|
|
|
1986
1986
|
const EzCardItem$1 = class extends HTMLElement$1 {
|
|
1987
1987
|
constructor() {
|
|
@@ -2348,10 +2348,6 @@ const EzCollapsibleBox$1 = class extends HTMLElement$1 {
|
|
|
2348
2348
|
static get style() { return ezCollapsibleBoxCss; }
|
|
2349
2349
|
};
|
|
2350
2350
|
|
|
2351
|
-
const REQUIRED_INFO = " (obrigatório) *";
|
|
2352
|
-
const DISTINCT_FILTER_NAME_PREFIX = 'FILTRO_COLUNA_';
|
|
2353
|
-
const EZ_GRID_LOADING_SOURCE = "EZ_GRID_LOADING_SOURCE";
|
|
2354
|
-
|
|
2355
2351
|
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)}}";
|
|
2356
2352
|
|
|
2357
2353
|
const EzComboBox$1 = class extends HTMLElement$1 {
|
|
@@ -2365,7 +2361,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2365
2361
|
this._maxWidthValue = 0;
|
|
2366
2362
|
this._tabPressed = false;
|
|
2367
2363
|
this._textEmptyList = "Nenhum resultado encontrado";
|
|
2368
|
-
this._textEmptySearch = "Nenhum resultado de {0} encontrado";
|
|
2369
2364
|
this._lookupMode = false;
|
|
2370
2365
|
this._preSelection = undefined;
|
|
2371
2366
|
this._visibleOptions = undefined;
|
|
@@ -2378,7 +2373,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2378
2373
|
this.enabled = true;
|
|
2379
2374
|
this.options = undefined;
|
|
2380
2375
|
this.errorMessage = undefined;
|
|
2381
|
-
this.searchMode = undefined;
|
|
2382
2376
|
this.showSelectedValue = false;
|
|
2383
2377
|
this.showOptionValue = false;
|
|
2384
2378
|
this.suppressSearch = false;
|
|
@@ -2402,7 +2396,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2402
2396
|
observeValue(newValue, oldValue) {
|
|
2403
2397
|
if (this._textInput && newValue != oldValue) {
|
|
2404
2398
|
try {
|
|
2405
|
-
if (
|
|
2399
|
+
if (typeof newValue === "string") {
|
|
2406
2400
|
this.setInputValue();
|
|
2407
2401
|
return;
|
|
2408
2402
|
}
|
|
@@ -2429,7 +2423,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2429
2423
|
observeOptions(newOptions, oldOptions) {
|
|
2430
2424
|
if ((newOptions === null || newOptions === void 0 ? void 0 : newOptions.join('')) === (oldOptions === null || oldOptions === void 0 ? void 0 : oldOptions.join('')))
|
|
2431
2425
|
return;
|
|
2432
|
-
this.loadOptions(SearchMode.PRELOAD);
|
|
2426
|
+
this.loadOptions(SearchMode$1.PRELOAD);
|
|
2433
2427
|
}
|
|
2434
2428
|
/*
|
|
2435
2429
|
* Retorna uma promise com o valor da opção selecionada,
|
|
@@ -2565,7 +2559,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2565
2559
|
}
|
|
2566
2560
|
updateVisibleOptions() {
|
|
2567
2561
|
let opts = this._source || [];
|
|
2568
|
-
if (
|
|
2562
|
+
if (this._criteria) {
|
|
2569
2563
|
const upperCriteria = this._criteria.toUpperCase();
|
|
2570
2564
|
opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
|
|
2571
2565
|
}
|
|
@@ -2640,7 +2634,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2640
2634
|
return this._floatingID !== undefined && FloatingManager.isFloating(this._floatingID);
|
|
2641
2635
|
}
|
|
2642
2636
|
nextOption() {
|
|
2643
|
-
if (
|
|
2637
|
+
if (!this.isOptionsVisible()) {
|
|
2644
2638
|
return;
|
|
2645
2639
|
}
|
|
2646
2640
|
this.showOptions();
|
|
@@ -2663,9 +2657,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2663
2657
|
this.selectOption(this._visibleOptions[this._preSelection]);
|
|
2664
2658
|
this._preSelection = undefined;
|
|
2665
2659
|
}
|
|
2666
|
-
else {
|
|
2667
|
-
this.controlListWithOnlyOne();
|
|
2668
|
-
}
|
|
2669
2660
|
}
|
|
2670
2661
|
updateSource(source) {
|
|
2671
2662
|
this._startLoading = false;
|
|
@@ -2684,7 +2675,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2684
2675
|
this.updateVisibleOptions();
|
|
2685
2676
|
if (this._tabPressed) {
|
|
2686
2677
|
this._tabPressed = false;
|
|
2687
|
-
this.controlEmptySearch();
|
|
2688
2678
|
}
|
|
2689
2679
|
}
|
|
2690
2680
|
else {
|
|
@@ -2692,10 +2682,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2692
2682
|
}
|
|
2693
2683
|
}
|
|
2694
2684
|
}
|
|
2695
|
-
clearSource() {
|
|
2696
|
-
this._source = [];
|
|
2697
|
-
this.updateVisibleOptions();
|
|
2698
|
-
}
|
|
2699
2685
|
selectOption(newOption) {
|
|
2700
2686
|
var _a, _b;
|
|
2701
2687
|
const currentValue = this.getSelectedOption(this.value);
|
|
@@ -2707,10 +2693,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2707
2693
|
else {
|
|
2708
2694
|
this.resetOptions();
|
|
2709
2695
|
}
|
|
2710
|
-
if (this.searchMode) {
|
|
2711
|
-
this._visibleOptions = [];
|
|
2712
|
-
this.clearSource();
|
|
2713
|
-
}
|
|
2714
2696
|
}
|
|
2715
2697
|
loadOptions(mode, argument = "") {
|
|
2716
2698
|
this._criteria = argument;
|
|
@@ -2746,93 +2728,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2746
2728
|
clearSearch() {
|
|
2747
2729
|
this.value = null;
|
|
2748
2730
|
}
|
|
2749
|
-
controlListWithOnlyOne() {
|
|
2750
|
-
var _a;
|
|
2751
|
-
if (this.searchMode) {
|
|
2752
|
-
const source = (_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.filter((opt) => opt.label !== "" && opt.value != undefined);
|
|
2753
|
-
if ((source === null || source === void 0 ? void 0 : source.length) === 1) {
|
|
2754
|
-
this.selectOption(source[0]);
|
|
2755
|
-
}
|
|
2756
|
-
}
|
|
2757
|
-
}
|
|
2758
|
-
controlEmptySearch() {
|
|
2759
|
-
var _a;
|
|
2760
|
-
if (this.searchMode) {
|
|
2761
|
-
if (!((_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
2762
|
-
this.clearSearch();
|
|
2763
|
-
ApplicationUtils.info(this._textEmptyList);
|
|
2764
|
-
}
|
|
2765
|
-
else {
|
|
2766
|
-
this.controlListWithOnlyOne();
|
|
2767
|
-
}
|
|
2768
|
-
}
|
|
2769
|
-
}
|
|
2770
|
-
validateDescriptionValue() {
|
|
2771
|
-
if (!this.searchMode || StringUtils$1.isEmpty(this.value)) {
|
|
2772
|
-
return;
|
|
2773
|
-
}
|
|
2774
|
-
let value = this.value;
|
|
2775
|
-
if (typeof value === "object") {
|
|
2776
|
-
return;
|
|
2777
|
-
}
|
|
2778
|
-
if (StringUtils$1.isEmpty(value)) {
|
|
2779
|
-
return;
|
|
2780
|
-
}
|
|
2781
|
-
this.loadDescriptionValue(value);
|
|
2782
|
-
}
|
|
2783
|
-
async loadDescriptionValue(argument) {
|
|
2784
|
-
var _a, _b;
|
|
2785
|
-
if (argument == undefined) {
|
|
2786
|
-
return;
|
|
2787
|
-
}
|
|
2788
|
-
if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
2789
|
-
this.loadOptionValue(argument);
|
|
2790
|
-
return;
|
|
2791
|
-
}
|
|
2792
|
-
const searchArgument = {
|
|
2793
|
-
mode: SearchMode.PREDICTIVE,
|
|
2794
|
-
argument
|
|
2795
|
-
};
|
|
2796
|
-
const source = await ((_b = this.optionLoader) === null || _b === void 0 ? void 0 : _b.call(this, searchArgument));
|
|
2797
|
-
if (source == undefined) {
|
|
2798
|
-
return;
|
|
2799
|
-
}
|
|
2800
|
-
if (source instanceof Promise) {
|
|
2801
|
-
source.then((result) => {
|
|
2802
|
-
this.setDescriptionValue(result);
|
|
2803
|
-
});
|
|
2804
|
-
}
|
|
2805
|
-
else {
|
|
2806
|
-
this.setDescriptionValue(source);
|
|
2807
|
-
}
|
|
2808
|
-
}
|
|
2809
|
-
setDescriptionValue(source) {
|
|
2810
|
-
const value = (source === null || source === void 0 ? void 0 : source[0]) || source;
|
|
2811
|
-
if (value == undefined || !Object.keys(value).length) {
|
|
2812
|
-
this.showNoResultMessage();
|
|
2813
|
-
return;
|
|
2814
|
-
}
|
|
2815
|
-
this._lookupMode = true;
|
|
2816
|
-
this.value = value;
|
|
2817
|
-
}
|
|
2818
|
-
loadOptionValue(argument) {
|
|
2819
|
-
var _a;
|
|
2820
|
-
const source = (_a = this.options) === null || _a === void 0 ? void 0 : _a.find((opt) => opt.value === argument);
|
|
2821
|
-
if (source != undefined) {
|
|
2822
|
-
this.selectOption(source);
|
|
2823
|
-
}
|
|
2824
|
-
else {
|
|
2825
|
-
this.showNoResultMessage();
|
|
2826
|
-
}
|
|
2827
|
-
}
|
|
2828
|
-
async showNoResultMessage() {
|
|
2829
|
-
this.clearSearch();
|
|
2830
|
-
ApplicationUtils.info(this._textEmptySearch.replace("{0}", this.getFieldLabel()));
|
|
2831
|
-
}
|
|
2832
|
-
getFieldLabel() {
|
|
2833
|
-
var _a;
|
|
2834
|
-
return (_a = this.label) === null || _a === void 0 ? void 0 : _a.replace(REQUIRED_INFO, "").toUpperCase();
|
|
2835
|
-
}
|
|
2836
2731
|
resetOptions() {
|
|
2837
2732
|
this.hideOptions();
|
|
2838
2733
|
this._criteria = undefined;
|
|
@@ -2858,12 +2753,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2858
2753
|
});
|
|
2859
2754
|
}
|
|
2860
2755
|
}
|
|
2861
|
-
|
|
2862
|
-
this.updateSource([]);
|
|
2863
|
-
}
|
|
2864
|
-
else {
|
|
2865
|
-
this.loadOptions(SearchMode.PRELOAD);
|
|
2866
|
-
}
|
|
2756
|
+
this.loadOptions(SearchMode$1.PRELOAD);
|
|
2867
2757
|
}
|
|
2868
2758
|
componentDidRender() {
|
|
2869
2759
|
var _a;
|
|
@@ -2873,7 +2763,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2873
2763
|
(_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
|
|
2874
2764
|
ElementIDUtils.addIDInfoIfNotExists(elem, "itemComboBox");
|
|
2875
2765
|
});
|
|
2876
|
-
this.validateDescriptionValue();
|
|
2877
2766
|
}
|
|
2878
2767
|
componentDidLoad() {
|
|
2879
2768
|
CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
|
|
@@ -2893,13 +2782,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2893
2782
|
// Event handlers
|
|
2894
2783
|
//---------------------------------------------
|
|
2895
2784
|
handlerIconClick() {
|
|
2896
|
-
this.
|
|
2897
|
-
}
|
|
2898
|
-
buildNumberArgument(argument) {
|
|
2899
|
-
if (this.isTextSearch) {
|
|
2900
|
-
return NaN;
|
|
2901
|
-
}
|
|
2902
|
-
return Number(argument || undefined);
|
|
2785
|
+
this.showOptions();
|
|
2903
2786
|
}
|
|
2904
2787
|
onTextInputChangeHandler(event) {
|
|
2905
2788
|
var _a;
|
|
@@ -2916,36 +2799,12 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2916
2799
|
}
|
|
2917
2800
|
this._criteria = argument;
|
|
2918
2801
|
if (argument) {
|
|
2919
|
-
|
|
2920
|
-
|
|
2921
|
-
this.clearSource();
|
|
2922
|
-
const enoughChars = argument.length >= this.limitCharsToSearch;
|
|
2923
|
-
const argumentNumber = this.buildNumberArgument(argument);
|
|
2924
|
-
if (enoughChars || !isNaN(argumentNumber)) {
|
|
2925
|
-
this._showLoading = true;
|
|
2926
|
-
this._changeDeboucingTimeout = window.setTimeout(() => {
|
|
2927
|
-
this.loadOptions(SearchMode.PREDICTIVE, isNaN(argumentNumber) ? argument : argumentNumber.toString());
|
|
2928
|
-
}, this._deboucingTime);
|
|
2929
|
-
this.showOptions();
|
|
2930
|
-
}
|
|
2931
|
-
else {
|
|
2932
|
-
this.hideOptions();
|
|
2933
|
-
}
|
|
2934
|
-
}
|
|
2935
|
-
else {
|
|
2936
|
-
this.updateVisibleOptions();
|
|
2937
|
-
this.showOptions();
|
|
2938
|
-
}
|
|
2802
|
+
this.updateVisibleOptions();
|
|
2803
|
+
this.showOptions();
|
|
2939
2804
|
}
|
|
2940
2805
|
else {
|
|
2941
2806
|
this.hideOptions();
|
|
2942
|
-
|
|
2943
|
-
this._showLoading = false;
|
|
2944
|
-
this.clearSource();
|
|
2945
|
-
}
|
|
2946
|
-
else {
|
|
2947
|
-
this.updateVisibleOptions();
|
|
2948
|
-
}
|
|
2807
|
+
this.updateVisibleOptions();
|
|
2949
2808
|
}
|
|
2950
2809
|
}
|
|
2951
2810
|
clearDeboucingTimeout() {
|
|
@@ -2955,15 +2814,13 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2955
2814
|
}
|
|
2956
2815
|
}
|
|
2957
2816
|
onTextInputClickHandler() {
|
|
2958
|
-
|
|
2959
|
-
this.showOptions();
|
|
2960
|
-
}
|
|
2817
|
+
this.showOptions();
|
|
2961
2818
|
}
|
|
2962
2819
|
keyDownHandler(event) {
|
|
2963
2820
|
this._tabPressed = false;
|
|
2964
2821
|
if (event.ctrlKey) {
|
|
2965
2822
|
if (event.key === "f" || event.key === "F") {
|
|
2966
|
-
this.loadOptions(SearchMode.ADVANCED);
|
|
2823
|
+
this.loadOptions(SearchMode$1.ADVANCED);
|
|
2967
2824
|
//ATENÇÃO: Ctrl + F tem ação específica nos browsers
|
|
2968
2825
|
//nesse caso, como vamos abrir o popup de busca avançada,
|
|
2969
2826
|
//não é interessante deixar o evento propagar;
|
|
@@ -2989,7 +2846,6 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
2989
2846
|
break;
|
|
2990
2847
|
case "Tab":
|
|
2991
2848
|
this._tabPressed = true;
|
|
2992
|
-
this.controlListWithOnlyOne();
|
|
2993
2849
|
break;
|
|
2994
2850
|
}
|
|
2995
2851
|
//ATENÇÃO: Existe a necessidade de propagar o evento de teclado.
|
|
@@ -3006,11 +2862,8 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
3006
2862
|
return !this._showLoading && this._visibleOptions.length > 0;
|
|
3007
2863
|
}
|
|
3008
2864
|
render() {
|
|
3009
|
-
var _a;
|
|
3010
2865
|
ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
|
|
3011
|
-
return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot:
|
|
3012
|
-
? h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, h("ez-icon", { iconName: "close" }))
|
|
3013
|
-
: undefined), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
2866
|
+
return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: "chevron-down" }))), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
3014
2867
|
&& this._visibleOptions.length === 0
|
|
3015
2868
|
&& h("div", { class: "message" }, h("span", { class: "message__no-result" }, this._textEmptyList)), this._showLoading
|
|
3016
2869
|
&& h("div", { class: "message" }, h("div", { class: "message__loading" })), this.showOptionValue
|
|
@@ -3025,12 +2878,12 @@ const EzComboBox$1 = class extends HTMLElement$1 {
|
|
|
3025
2878
|
}; }
|
|
3026
2879
|
static get style() { return ezComboBoxCss; }
|
|
3027
2880
|
};
|
|
3028
|
-
var SearchMode;
|
|
2881
|
+
var SearchMode$1;
|
|
3029
2882
|
(function (SearchMode) {
|
|
3030
2883
|
SearchMode["ADVANCED"] = "ADVANCED";
|
|
3031
2884
|
SearchMode["PRELOAD"] = "PRELOAD";
|
|
3032
2885
|
SearchMode["PREDICTIVE"] = "PREDICTIVE";
|
|
3033
|
-
})(SearchMode || (SearchMode = {}));
|
|
2886
|
+
})(SearchMode$1 || (SearchMode$1 = {}));
|
|
3034
2887
|
|
|
3035
2888
|
const ezDateInputCss = ":host{display:block;width:100%;--ez-date-input__input--background-color:var(--background--medium, #e0e0e0);--ez-date-input__input--border-color:var(--ez-date-input__input--background-color);--ez-date-input__calendar-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"15px\"><path d=\"M 3.171875,5.25 C 2.6485088,5.25 2.21875,5.6797588 2.21875,6.203125 2.21875,6.7264912 2.6485088,7.15625 3.171875,7.15625 3.6952412,7.15625 4.125,6.7264912 4.125,6.203125 4.125,5.6797588 3.6952412,5.25 3.171875,5.25 Z m 2.875,0 C 5.5235088,5.25 5.09375,5.6797588 5.09375,6.203125 5.09375,6.7264912 5.5235088,7.15625 6.046875,7.15625 6.5702412,7.15625 7,6.7264912 7,6.203125 7,5.6797588 6.5702412,5.25 6.046875,5.25 Z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.9511719,-0.4297588 0.9511719,-0.953125 C 9.8730469,5.6797588 9.4452412,5.25 8.921875,5.25 Z m 2.873047,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.953125 0.953125,0.953125 0.523366,0 0.953125,-0.4297588 0.953125,-0.953125 C 12.748047,5.6797588 12.318288,5.25 11.794922,5.25 Z M 3.171875,8.1230469 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 0.5233662,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 C 6.5702412,10.029297 7,9.5995381 7,9.0761719 7,8.5528057 6.5702412,8.1230469 6.046875,8.1230469 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297587,0.9531251 0.953125,0.9531251 0.5233661,0 0.9531249,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.9531251 0.953125,0.9531251 0.523367,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.171875,10.998047 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 C 6.5702412,12.904297 7,12.474538 7,11.951172 7,11.427806 6.5702412,10.998047 6.046875,10.998047 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297587,0.953125 0.953125,0.953125 0.5233661,0 0.9531249,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.429759,0.953125 0.953125,0.953125 0.523367,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.5,0 c -0.554,0 -1,0.446 -1,1 v 0.050781 C 1.0853217,1.2909766 0,2.5186658 0,4 v 9 c 0,1.652487 1.3475134,3 3,3 h 9 c 1.652487,0 3,-1.347513 3,-3 V 4 C 15,2.5186658 13.914678,1.2909766 12.5,1.0507812 V 1 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 C 4.5,0.446 4.054,0 3.5,0 Z m 1,2.0996094 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 v -0.640625 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 V 2.1738281 C 13.311725,2.3905225 13.900391,3.11278 13.900391,4 v 9 c 0,1.062113 -0.838278,1.900391 -1.900391,1.900391 H 3 C 1.9378864,14.900391 1.0996094,14.062113 1.0996094,13 V 4 C 1.0996094,3.11278 1.6882747,2.3905225 2.5,2.1738281 v 0.5664063 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 z\"/></svg>')}.btn-open-cal{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-cal:disabled{cursor:unset}.btn-open-cal::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:15px;height:16px;-webkit-mask-image:var(--ez-date-input__calendar-image);mask-image:var(--ez-date-input__calendar-image)}.btn-open-cal:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-cal:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}ez-text-input{--text-input__input--background-color:var(--ez-date-input__input--background-color, #FFFFFF);--text-input__input--border-color:var(--ez-date-input__input--border-color, #DCE0E8)}";
|
|
3036
2889
|
|
|
@@ -4834,6 +4687,10 @@ const EzForm$1 = class extends HTMLElement$1 {
|
|
|
4834
4687
|
static get style() { return ezFormCss; }
|
|
4835
4688
|
};
|
|
4836
4689
|
|
|
4690
|
+
const REQUIRED_INFO = " (obrigatório) *";
|
|
4691
|
+
const DISTINCT_FILTER_NAME_PREFIX = 'FILTRO_COLUNA_';
|
|
4692
|
+
const EZ_GRID_LOADING_SOURCE = "EZ_GRID_LOADING_SOURCE";
|
|
4693
|
+
|
|
4837
4694
|
const buildSwitch$1 = (field) => {
|
|
4838
4695
|
return buildField(field.name, field.label, field.readOnly, field.contextName, true);
|
|
4839
4696
|
};
|
|
@@ -127628,7 +127485,7 @@ class ScrollCtrl {
|
|
|
127628
127485
|
}
|
|
127629
127486
|
}
|
|
127630
127487
|
|
|
127631
|
-
const ezSearchCss = ":host{width:100%}";
|
|
127488
|
+
const ezSearchCss = ":host{--ez-search--height:42px;--ez-search--width:100%;--ez-search__icon--width:48px;--ez-search--border-radius:var(--border--radius-medium, 12px);--ez-search--border-radius-small:var(--border--radius-small, 6px);--ez-search--font-size:var(--text--medium, 14px);--ez-search--font-family:var(--font-pattern, Arial);--ez-search--font-weight--large:var(--text-weight--large, 500);--ez-search--font-weight--medium:var(--text-weight--medium, 400);--ez-search--background-color--xlight:var(--background--xlight, #fff);--ez-search--background-medium:var(--background--medium, #f0f3f7);--ez-search--line-height:calc(var(--text--medium, 14px) + 4px);--ez-search__input--background-color:var(--background--medium, #e0e0e0);--ez-search__input--border:var(--border--medium, 2px solid);--ez-search__input--border-color:var(--ez-search__input--background-color);--ez-search__input--focus--border-color:var(--color--primary, #008561);--ez-search__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-search__input--disabled--color:var(--text--disable, #AFB6C0);--ez-search__input--error--border-color:#CC2936;--ez-search__btn--color:var(--title--primary, #2B3A54);--ez-search__btn-disabled--color:var(--text--disable, #AFB6C0);--ez-search__btn-hover--color:var(--color--primary, #4e4e4e);--ez-search__label--color:var(--title--primary, #2B3A54);--ez-search__list-title--primary:var(--title--primary, #2B3A54);--ez-search__list-text--primary:var(--text--primary, #626e82);--ez-search__list-height:calc(var(--ez-search--font-size) + var(--ez-search--space--medium) + 4px);--ez-search__list-min-width:64px;--ez-search--space--medium:var(--space--medium, 12px);--ez-search--space--small:var(--space--small, 6px);--ez-search__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-search__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-search__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-search__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-search__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-search__scrollbar--width:var(--space--medium, 12px);display:flex;flex-wrap:wrap;position:relative;width:var(--ez-search--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-search__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:350px;background-color:var(--ez-search--background-color--xlight);border-radius:var(--ez-search--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);padding:var(--ez-search--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-search__scrollbar--color-clicked) var(--ez-search__scrollbar--color-background)}.list-options::-webkit-scrollbar{background-color:var(--ez-search__scrollbar--color-background);width:var(--ez-search__scrollbar--width);max-width:var(--ez-search__scrollbar--width);min-width:var(--ez-search__scrollbar--width)}.list-options::-webkit-scrollbar-track{background-color:var(--ez-search__scrollbar--color-background);border-radius:var(--ez-search__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb{background-color:var(--ez-search__scrollbar--color-default);border-radius:var(--ez-search__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb:vertical:hover,.list-options::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-search__scrollbar--color-hover)}.list-options::-webkit-scrollbar-thumb:vertical:active,.list-options::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-search__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-search--border-radius-small);padding:var(--ez-search--space--small);min-height:var(--ez-search__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-search__list-title--primary);font-family:var(--ez-search--font-family);font-size:var(--ez-search--font-size);line-height:var(--ez-search--line-height)}.item__label{font-weight:var(--ez-search--font-weight--medium)}.item__label--bold{font-weight:var(--ez-search--font-weight--large)}.item__value{text-align:center;color:var(--ez-search__list-text--primary);font-weight:var(--ez-search--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-search__list-height)}.message__no-result{color:var(--ez-search__list-title--primary);font-family:var(--ez-search--font-family);font-size:var(--ez-search--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-search__list-title--primary);border-top:3px solid transparent}.item__list>li:hover{background-color:var(--ez-search--background-medium)}.preselected{background-color:var(--background--medium)}.btn{outline:none;border:none;background:none;cursor:pointer;color:var(--ez-search__btn--color)}.btn:disabled{cursor:unset;color:var(--ez-search__btn-disabled--color)}.btn:disabled:hover{cursor:unset;color:var(--ez-search__btn-disabled--color)}.btn:hover{color:var(--ez-search__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)}}";
|
|
127632
127489
|
|
|
127633
127490
|
const EzSearch$1 = class extends HTMLElement$1 {
|
|
127634
127491
|
constructor() {
|
|
@@ -127636,6 +127493,21 @@ const EzSearch$1 = class extends HTMLElement$1 {
|
|
|
127636
127493
|
this.__registerHost();
|
|
127637
127494
|
this.__attachShadow();
|
|
127638
127495
|
this.ezChange = createEvent(this, "ezChange", 7);
|
|
127496
|
+
this._changeDeboucingTimeout = null;
|
|
127497
|
+
this._limitCharsToSearch = 3;
|
|
127498
|
+
this._deboucingTime = 300;
|
|
127499
|
+
this._maxWidthValue = 0;
|
|
127500
|
+
this._tabPressed = false;
|
|
127501
|
+
this._textEmptyList = "Nenhum resultado encontrado";
|
|
127502
|
+
this._textEmptySearch = "Nenhum resultado de {0} encontrado";
|
|
127503
|
+
this._lookupMode = false;
|
|
127504
|
+
this._startHighlightTag = "<span class='card-item__highlight'>";
|
|
127505
|
+
this._endHighlightTag = "</span>";
|
|
127506
|
+
this._preSelection = undefined;
|
|
127507
|
+
this._visibleOptions = undefined;
|
|
127508
|
+
this._startLoading = false;
|
|
127509
|
+
this._showLoading = true;
|
|
127510
|
+
this._criteria = undefined;
|
|
127639
127511
|
this.value = undefined;
|
|
127640
127512
|
this.label = undefined;
|
|
127641
127513
|
this.enabled = true;
|
|
@@ -127650,28 +127522,82 @@ const EzSearch$1 = class extends HTMLElement$1 {
|
|
|
127650
127522
|
this.listOptionsPosition = undefined;
|
|
127651
127523
|
this.isTextSearch = false;
|
|
127652
127524
|
this.ignoreLimitCharsToSearch = false;
|
|
127525
|
+
this.options = undefined;
|
|
127526
|
+
this.suppressSearch = false;
|
|
127653
127527
|
}
|
|
127654
127528
|
observeErrorMessage() {
|
|
127655
|
-
|
|
127656
|
-
|
|
127529
|
+
var _a;
|
|
127530
|
+
if (this._textInput) {
|
|
127531
|
+
this._textInput.errorMessage = this.errorMessage;
|
|
127532
|
+
if (!((_a = this.errorMessage) === null || _a === void 0 ? void 0 : _a.trim())) {
|
|
127533
|
+
this.setInputValue();
|
|
127534
|
+
}
|
|
127657
127535
|
}
|
|
127658
127536
|
}
|
|
127659
|
-
observeValue() {
|
|
127660
|
-
if (this.
|
|
127661
|
-
|
|
127537
|
+
observeValue(newValue, oldValue) {
|
|
127538
|
+
if (this._textInput && newValue != oldValue) {
|
|
127539
|
+
try {
|
|
127540
|
+
if (newValue === "string") {
|
|
127541
|
+
this.setInputValue();
|
|
127542
|
+
return;
|
|
127543
|
+
}
|
|
127544
|
+
const newValueSelected = this.getSelectedOption(newValue);
|
|
127545
|
+
const oldValueSelected = this.getSelectedOption(oldValue);
|
|
127546
|
+
const currentValue = this.getSelectedOption(this.value);
|
|
127547
|
+
if (this.isDifferentValues(currentValue, newValueSelected)) {
|
|
127548
|
+
this.value = newValueSelected;
|
|
127549
|
+
}
|
|
127550
|
+
if (this.isDifferentValues(newValueSelected, oldValueSelected)) {
|
|
127551
|
+
this.setInputValue();
|
|
127552
|
+
const valueEmitted = newValueSelected === null ? undefined : newValueSelected;
|
|
127553
|
+
if (!this._lookupMode) {
|
|
127554
|
+
this.ezChange.emit(valueEmitted);
|
|
127555
|
+
}
|
|
127556
|
+
}
|
|
127557
|
+
this.resetOptions();
|
|
127558
|
+
}
|
|
127559
|
+
finally {
|
|
127560
|
+
this._lookupMode = false;
|
|
127561
|
+
}
|
|
127562
|
+
}
|
|
127563
|
+
}
|
|
127564
|
+
observeOptions(newOptions, oldOptions) {
|
|
127565
|
+
if ((newOptions === null || newOptions === void 0 ? void 0 : newOptions.join('')) === (oldOptions === null || oldOptions === void 0 ? void 0 : oldOptions.join('')))
|
|
127566
|
+
return;
|
|
127567
|
+
this.loadOptions(SearchMode.PRELOAD);
|
|
127568
|
+
}
|
|
127569
|
+
/*
|
|
127570
|
+
* Retorna uma promise com o valor da opção selecionada,
|
|
127571
|
+
* que será resolvida quando o backend devolver este dado.
|
|
127572
|
+
*/
|
|
127573
|
+
async getValueAsync() {
|
|
127574
|
+
if (!this._showLoading) {
|
|
127575
|
+
return new Promise(resolve => resolve(this.value));
|
|
127662
127576
|
}
|
|
127577
|
+
return new Promise(resolve => {
|
|
127578
|
+
let id = setInterval(() => {
|
|
127579
|
+
if (!this._showLoading) {
|
|
127580
|
+
clearInterval(id);
|
|
127581
|
+
resolve(this.value);
|
|
127582
|
+
}
|
|
127583
|
+
}, 100);
|
|
127584
|
+
});
|
|
127663
127585
|
}
|
|
127664
127586
|
/**
|
|
127665
|
-
|
|
127666
|
-
|
|
127587
|
+
* Aplica o foco no campo.
|
|
127588
|
+
*/
|
|
127667
127589
|
async setFocus() {
|
|
127668
|
-
this.
|
|
127590
|
+
if (this._textInput) {
|
|
127591
|
+
this._textInput.setFocus();
|
|
127592
|
+
}
|
|
127669
127593
|
}
|
|
127670
127594
|
/**
|
|
127671
|
-
|
|
127672
|
-
|
|
127595
|
+
* Remove o foco do campo.
|
|
127596
|
+
*/
|
|
127673
127597
|
async setBlur() {
|
|
127674
|
-
this.
|
|
127598
|
+
if (this._textInput) {
|
|
127599
|
+
this._textInput.setBlur();
|
|
127600
|
+
}
|
|
127675
127601
|
}
|
|
127676
127602
|
/**
|
|
127677
127603
|
* Retorna se o conteúdo é inválido.
|
|
@@ -127683,40 +127609,547 @@ const EzSearch$1 = class extends HTMLElement$1 {
|
|
|
127683
127609
|
* Limpa o valor do campo de pesquisa
|
|
127684
127610
|
*/
|
|
127685
127611
|
async clearValue() {
|
|
127612
|
+
this.clearSearch();
|
|
127613
|
+
}
|
|
127614
|
+
scrollListener() {
|
|
127615
|
+
var _a;
|
|
127616
|
+
if (this._floatingID == undefined) {
|
|
127617
|
+
return;
|
|
127618
|
+
}
|
|
127619
|
+
if ((_a = this.listOptionsPosition) === null || _a === void 0 ? void 0 : _a.hardPosition) {
|
|
127620
|
+
this.hideOptions();
|
|
127621
|
+
}
|
|
127622
|
+
else {
|
|
127623
|
+
window.requestAnimationFrame(() => {
|
|
127624
|
+
this.updateListPosition();
|
|
127625
|
+
});
|
|
127626
|
+
}
|
|
127627
|
+
}
|
|
127628
|
+
updateListPosition() {
|
|
127629
|
+
let { verticalPosition, horizontalPosition, fromBottom, fromRight, bottomLimit, hardPosition } = this.getListPosition();
|
|
127630
|
+
const elementRect = this._listWrapper.getBoundingClientRect();
|
|
127631
|
+
const containerRect = this._listContainer.getBoundingClientRect();
|
|
127632
|
+
const textInputRect = this._textInput.getBoundingClientRect();
|
|
127633
|
+
const limitHeight = bottomLimit || window.innerHeight;
|
|
127634
|
+
const neededHeight = containerRect.bottom + elementRect.height;
|
|
127635
|
+
if (!fromBottom && (elementRect.top < 0 || neededHeight > limitHeight)) {
|
|
127636
|
+
fromBottom = true;
|
|
127637
|
+
}
|
|
127638
|
+
if (!hardPosition) {
|
|
127639
|
+
verticalPosition = verticalPosition || 0;
|
|
127640
|
+
horizontalPosition = horizontalPosition || 0;
|
|
127641
|
+
if (fromBottom) {
|
|
127642
|
+
verticalPosition = window.innerHeight - textInputRect.top + verticalPosition;
|
|
127643
|
+
}
|
|
127644
|
+
else {
|
|
127645
|
+
verticalPosition += containerRect.top;
|
|
127646
|
+
}
|
|
127647
|
+
if (fromRight) {
|
|
127648
|
+
horizontalPosition = window.innerWidth - textInputRect.right + horizontalPosition;
|
|
127649
|
+
}
|
|
127650
|
+
else {
|
|
127651
|
+
horizontalPosition += containerRect.left;
|
|
127652
|
+
}
|
|
127653
|
+
}
|
|
127654
|
+
if (verticalPosition != undefined) {
|
|
127655
|
+
this._listWrapper.style[fromBottom ? "bottom" : "top"] = `${verticalPosition}px`;
|
|
127656
|
+
this._listWrapper.style[fromBottom ? "top" : "bottom"] = "";
|
|
127657
|
+
}
|
|
127658
|
+
if (horizontalPosition != undefined) {
|
|
127659
|
+
this._listWrapper.style[fromRight ? "right" : "left"] = `${horizontalPosition}px`;
|
|
127660
|
+
this._listWrapper.style[fromRight ? "left" : "right"] = "";
|
|
127661
|
+
}
|
|
127662
|
+
}
|
|
127663
|
+
getListPosition() {
|
|
127664
|
+
if (this.listOptionsPosition) {
|
|
127665
|
+
return this.listOptionsPosition;
|
|
127666
|
+
}
|
|
127667
|
+
return {
|
|
127668
|
+
verticalPosition: (this.errorMessage || !this.canShowError || this.mode === "slim") ? 6 : -13
|
|
127669
|
+
};
|
|
127670
|
+
}
|
|
127671
|
+
isDifferentValues(firstValue, secondValue) {
|
|
127672
|
+
return ObjectUtils$1.objectToString(firstValue || {}) !== ObjectUtils$1.objectToString(secondValue || {});
|
|
127673
|
+
}
|
|
127674
|
+
getFormattedText(currentValue) {
|
|
127675
|
+
if (currentValue == undefined) {
|
|
127676
|
+
return;
|
|
127677
|
+
}
|
|
127678
|
+
if (!this.showSelectedValue || currentValue.value == undefined) {
|
|
127679
|
+
return currentValue.label;
|
|
127680
|
+
}
|
|
127681
|
+
return currentValue.label ? `${currentValue.value} - ${currentValue.label}` : currentValue.value;
|
|
127682
|
+
}
|
|
127683
|
+
getText() {
|
|
127684
|
+
const currentValue = this.getSelectedOption(this.value);
|
|
127685
|
+
const text = this.getFormattedText(currentValue);
|
|
127686
|
+
if (text == undefined) {
|
|
127687
|
+
return;
|
|
127688
|
+
}
|
|
127689
|
+
return String(text)
|
|
127690
|
+
.replace(/&/g, '&')
|
|
127691
|
+
.replace(/</g, '<')
|
|
127692
|
+
.replace(/>/g, '>')
|
|
127693
|
+
.replace(/"/g, '"');
|
|
127694
|
+
}
|
|
127695
|
+
getSelectedOption(value) {
|
|
127696
|
+
if (typeof value === "string" || value instanceof String) {
|
|
127697
|
+
return this._visibleOptions.find(o => o.value === value);
|
|
127698
|
+
}
|
|
127699
|
+
return value;
|
|
127700
|
+
}
|
|
127701
|
+
updateVisibleOptions() {
|
|
127702
|
+
let opts = this._source || [];
|
|
127703
|
+
if (this.suppressEmptyOption) {
|
|
127704
|
+
this._visibleOptions = opts;
|
|
127705
|
+
}
|
|
127706
|
+
else {
|
|
127707
|
+
this._visibleOptions = [{ value: undefined, label: "" }].concat(opts);
|
|
127708
|
+
}
|
|
127709
|
+
this._maxWidthValue = this.getMaxWidthValue();
|
|
127710
|
+
}
|
|
127711
|
+
getMaxWidthValue() {
|
|
127712
|
+
var _a;
|
|
127713
|
+
const arrValues = [];
|
|
127714
|
+
(_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.forEach(opt => {
|
|
127715
|
+
const widthValue = this.getWidthValue(opt.value);
|
|
127716
|
+
if (!arrValues.includes(widthValue)) {
|
|
127717
|
+
arrValues.push(widthValue);
|
|
127718
|
+
}
|
|
127719
|
+
});
|
|
127720
|
+
return arrValues.length > 1 ? Math.max(...arrValues) : 0;
|
|
127721
|
+
}
|
|
127722
|
+
getWidthValue(value) {
|
|
127723
|
+
if (this._itemValueBasis != undefined) {
|
|
127724
|
+
const span = this._itemValueBasis;
|
|
127725
|
+
if (value != undefined) {
|
|
127726
|
+
span.innerHTML = value;
|
|
127727
|
+
return span.clientWidth > 0 ? (span.clientWidth + 2) : 0;
|
|
127728
|
+
}
|
|
127729
|
+
else {
|
|
127730
|
+
span.innerHTML = "";
|
|
127731
|
+
}
|
|
127732
|
+
}
|
|
127733
|
+
return 0;
|
|
127734
|
+
}
|
|
127735
|
+
createOption(detail) {
|
|
127736
|
+
let { key, title } = detail;
|
|
127737
|
+
const startHighlight = new RegExp(this._startHighlightTag, 'g');
|
|
127738
|
+
const endHighlight = new RegExp(this._endHighlightTag, 'g');
|
|
127739
|
+
title = StringUtils$1.decodeHtmlEntities(title);
|
|
127740
|
+
const option = {
|
|
127741
|
+
value: key === null || key === void 0 ? void 0 : key.replace(startHighlight, '').replace(endHighlight, ''),
|
|
127742
|
+
label: title === null || title === void 0 ? void 0 : title.replace(startHighlight, '').replace(endHighlight, '')
|
|
127743
|
+
};
|
|
127744
|
+
this.selectOption(option);
|
|
127745
|
+
}
|
|
127746
|
+
buildItem(opt, index) {
|
|
127747
|
+
opt.label = opt.label || opt.value;
|
|
127748
|
+
const card = {
|
|
127749
|
+
key: opt.value,
|
|
127750
|
+
title: opt.label,
|
|
127751
|
+
details: opt.details
|
|
127752
|
+
};
|
|
127753
|
+
return h("div", { style: { "height": "100%" }, onMouseDown: () => this.createOption(card), onMouseOver: () => this._preSelection = index }, h("ez-card-item", { item: card }));
|
|
127754
|
+
}
|
|
127755
|
+
showOptions() {
|
|
127756
|
+
if (!this.enabled)
|
|
127757
|
+
return;
|
|
127758
|
+
if (this.isOptionsVisible()) {
|
|
127759
|
+
return;
|
|
127760
|
+
}
|
|
127761
|
+
if (!!this._resizeObserver)
|
|
127762
|
+
this._resizeObserver.observe(this._textInput);
|
|
127763
|
+
this._floatingID = FloatingManager.float(this._listWrapper, this._listContainer, { autoClose: false, isFixed: true, backClickListener: () => this.hideOptions() });
|
|
127764
|
+
this.setFocus();
|
|
127765
|
+
window.requestAnimationFrame(() => {
|
|
127766
|
+
this.updateListPosition();
|
|
127767
|
+
if (!this.listOptionsPosition) {
|
|
127768
|
+
this._listWrapper.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
|
|
127769
|
+
}
|
|
127770
|
+
});
|
|
127771
|
+
}
|
|
127772
|
+
hideOptions() {
|
|
127773
|
+
if (this._floatingID !== undefined) {
|
|
127774
|
+
FloatingManager.close(this._floatingID);
|
|
127775
|
+
}
|
|
127776
|
+
this._floatingID = undefined;
|
|
127777
|
+
if (!!this._resizeObserver)
|
|
127778
|
+
this._resizeObserver.unobserve(this._textInput);
|
|
127779
|
+
}
|
|
127780
|
+
isOptionsVisible() {
|
|
127781
|
+
return this._floatingID !== undefined && FloatingManager.isFloating(this._floatingID);
|
|
127782
|
+
}
|
|
127783
|
+
nextOption() {
|
|
127784
|
+
if (!this.isOptionsVisible()) {
|
|
127785
|
+
return;
|
|
127786
|
+
}
|
|
127787
|
+
this.showOptions();
|
|
127788
|
+
this._preSelection = this._preSelection === undefined ? 0 : Math.min(this._preSelection + 1, this._visibleOptions.length - 1);
|
|
127789
|
+
this.scrollToOption(this._visibleOptions[this._preSelection]);
|
|
127790
|
+
}
|
|
127791
|
+
previousOption() {
|
|
127792
|
+
this._preSelection = this._preSelection === undefined ? 0 : Math.max(this._preSelection - 1, 0);
|
|
127793
|
+
this.scrollToOption(this._visibleOptions[this._preSelection]);
|
|
127794
|
+
}
|
|
127795
|
+
scrollToOption(opt) {
|
|
127796
|
+
window.requestAnimationFrame(() => {
|
|
127797
|
+
const liElem = (opt === null || opt === void 0 ? void 0 : opt.value) ? this._optionsList.querySelector(`li#item_${opt.value.replace(/[<>\[\]#=]/g, '\\$&').replace(/:/g, '\\:')}`) : undefined;
|
|
127798
|
+
if (liElem)
|
|
127799
|
+
liElem.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
127800
|
+
});
|
|
127801
|
+
}
|
|
127802
|
+
selectCurrentOption() {
|
|
127803
|
+
if (this._preSelection !== undefined) {
|
|
127804
|
+
this.selectOption(this._visibleOptions[this._preSelection]);
|
|
127805
|
+
this._preSelection = undefined;
|
|
127806
|
+
}
|
|
127807
|
+
else {
|
|
127808
|
+
this.controlListWithOnlyOne();
|
|
127809
|
+
}
|
|
127810
|
+
}
|
|
127811
|
+
updateSource(source) {
|
|
127812
|
+
this._startLoading = false;
|
|
127813
|
+
if (source instanceof Promise) {
|
|
127814
|
+
this._showLoading = true;
|
|
127815
|
+
source.then(result => {
|
|
127816
|
+
this._showLoading = false;
|
|
127817
|
+
this.updateSource(result);
|
|
127818
|
+
}).catch(() => this._showLoading = false);
|
|
127819
|
+
this.updateVisibleOptions();
|
|
127820
|
+
}
|
|
127821
|
+
else {
|
|
127822
|
+
this._showLoading = false;
|
|
127823
|
+
if (Array.isArray(source)) {
|
|
127824
|
+
this._source = source;
|
|
127825
|
+
this.updateVisibleOptions();
|
|
127826
|
+
if (this._tabPressed) {
|
|
127827
|
+
this._tabPressed = false;
|
|
127828
|
+
this.controlEmptySearch();
|
|
127829
|
+
}
|
|
127830
|
+
}
|
|
127831
|
+
else {
|
|
127832
|
+
this.selectOption(source);
|
|
127833
|
+
}
|
|
127834
|
+
}
|
|
127835
|
+
}
|
|
127836
|
+
clearSource() {
|
|
127837
|
+
this._source = [];
|
|
127838
|
+
this.updateVisibleOptions();
|
|
127839
|
+
}
|
|
127840
|
+
selectOption(newOption) {
|
|
127686
127841
|
var _a, _b;
|
|
127687
|
-
|
|
127842
|
+
const currentValue = this.getSelectedOption(this.value);
|
|
127843
|
+
if ((((_a = currentValue === null || currentValue === void 0 ? void 0 : currentValue.value) === null || _a === void 0 ? void 0 : _a.toString()) !== ((_b = newOption === null || newOption === void 0 ? void 0 : newOption.value) === null || _b === void 0 ? void 0 : _b.toString()))
|
|
127844
|
+
|| (currentValue == undefined && newOption != undefined && "value" in newOption)) {
|
|
127845
|
+
const adjustedOpt = !(newOption === null || newOption === void 0 ? void 0 : newOption.value) ? undefined : newOption;
|
|
127846
|
+
this.value = adjustedOpt;
|
|
127847
|
+
}
|
|
127848
|
+
else {
|
|
127849
|
+
this.resetOptions();
|
|
127850
|
+
}
|
|
127851
|
+
this._visibleOptions = [];
|
|
127852
|
+
this.clearSource();
|
|
127688
127853
|
}
|
|
127689
|
-
|
|
127690
|
-
|
|
127691
|
-
|
|
127692
|
-
|
|
127693
|
-
|
|
127854
|
+
loadOptions(mode, argument = "") {
|
|
127855
|
+
this._criteria = argument;
|
|
127856
|
+
this._startLoading = true;
|
|
127857
|
+
if (this.optionLoader) {
|
|
127858
|
+
const searchArgument = { mode, argument };
|
|
127859
|
+
this.updateSource(this.optionLoader(searchArgument));
|
|
127860
|
+
}
|
|
127861
|
+
else {
|
|
127862
|
+
this.updateSource(this.options);
|
|
127863
|
+
}
|
|
127864
|
+
}
|
|
127865
|
+
cancelPreselection() {
|
|
127866
|
+
if (!this._textInput.value && this.value) {
|
|
127867
|
+
this.selectOption(undefined);
|
|
127868
|
+
}
|
|
127869
|
+
else {
|
|
127870
|
+
window.setTimeout(() => {
|
|
127871
|
+
this.setInputValue();
|
|
127872
|
+
}, this._deboucingTime);
|
|
127873
|
+
}
|
|
127874
|
+
this.resetOptions();
|
|
127875
|
+
}
|
|
127876
|
+
setInputValue(clearError = true) {
|
|
127877
|
+
const textValue = this.getText();
|
|
127878
|
+
if ((this._textInput.value || '') !== textValue) {
|
|
127879
|
+
this._textInput.value = textValue;
|
|
127880
|
+
if (clearError) {
|
|
127881
|
+
this.errorMessage = null;
|
|
127882
|
+
}
|
|
127883
|
+
}
|
|
127884
|
+
}
|
|
127885
|
+
clearSearch() {
|
|
127886
|
+
this.value = null;
|
|
127887
|
+
}
|
|
127888
|
+
controlListWithOnlyOne() {
|
|
127889
|
+
var _a, _b;
|
|
127890
|
+
const source = (_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.filter((opt) => opt.label !== "" && opt.value != undefined);
|
|
127891
|
+
if ((source === null || source === void 0 ? void 0 : source.length) > 0) {
|
|
127892
|
+
const startHighlight = new RegExp(this._startHighlightTag, 'g');
|
|
127893
|
+
const endHighlight = new RegExp(this._endHighlightTag, 'g');
|
|
127894
|
+
let title = StringUtils$1.decodeHtmlEntities(source[0].label);
|
|
127895
|
+
const option = {
|
|
127896
|
+
value: (_b = source[0].value) === null || _b === void 0 ? void 0 : _b.replace(startHighlight, '').replace(endHighlight, ''),
|
|
127897
|
+
label: title === null || title === void 0 ? void 0 : title.replace(startHighlight, '').replace(endHighlight, '')
|
|
127898
|
+
};
|
|
127899
|
+
this.selectOption(option);
|
|
127900
|
+
}
|
|
127901
|
+
}
|
|
127902
|
+
controlEmptySearch() {
|
|
127694
127903
|
var _a;
|
|
127695
|
-
|
|
127904
|
+
if (!((_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
127905
|
+
this.clearSearch();
|
|
127906
|
+
ApplicationUtils.info(this._textEmptyList);
|
|
127907
|
+
}
|
|
127908
|
+
else {
|
|
127909
|
+
this.controlListWithOnlyOne();
|
|
127910
|
+
}
|
|
127696
127911
|
}
|
|
127697
|
-
|
|
127698
|
-
|
|
127699
|
-
|
|
127700
|
-
|
|
127701
|
-
|
|
127702
|
-
|
|
127912
|
+
validateDescriptionValue() {
|
|
127913
|
+
if (StringUtils$1.isEmpty(this.value)) {
|
|
127914
|
+
return;
|
|
127915
|
+
}
|
|
127916
|
+
let value = this.value;
|
|
127917
|
+
if (typeof value === "object") {
|
|
127918
|
+
return;
|
|
127919
|
+
}
|
|
127920
|
+
if (StringUtils$1.isEmpty(value)) {
|
|
127921
|
+
return;
|
|
127922
|
+
}
|
|
127923
|
+
this.loadDescriptionValue(value);
|
|
127924
|
+
}
|
|
127925
|
+
async loadDescriptionValue(argument) {
|
|
127926
|
+
var _a, _b;
|
|
127927
|
+
if (argument == undefined) {
|
|
127928
|
+
return;
|
|
127929
|
+
}
|
|
127930
|
+
if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
127931
|
+
this.loadOptionValue(argument);
|
|
127932
|
+
return;
|
|
127933
|
+
}
|
|
127934
|
+
const searchArgument = {
|
|
127935
|
+
mode: SearchMode.PREDICTIVE,
|
|
127936
|
+
argument
|
|
127937
|
+
};
|
|
127938
|
+
const source = await ((_b = this.optionLoader) === null || _b === void 0 ? void 0 : _b.call(this, searchArgument));
|
|
127939
|
+
if (source == undefined) {
|
|
127940
|
+
return;
|
|
127941
|
+
}
|
|
127942
|
+
if (source instanceof Promise) {
|
|
127943
|
+
source.then((result) => {
|
|
127944
|
+
this.setDescriptionValue(result);
|
|
127945
|
+
});
|
|
127946
|
+
}
|
|
127947
|
+
else {
|
|
127948
|
+
this.setDescriptionValue(source);
|
|
127949
|
+
}
|
|
127950
|
+
}
|
|
127951
|
+
setDescriptionValue(source) {
|
|
127952
|
+
const value = (source === null || source === void 0 ? void 0 : source[0]) || source;
|
|
127953
|
+
if (value == undefined || !Object.keys(value).length) {
|
|
127954
|
+
this.showNoResultMessage();
|
|
127955
|
+
return;
|
|
127956
|
+
}
|
|
127957
|
+
this._lookupMode = true;
|
|
127958
|
+
this.value = value;
|
|
127959
|
+
}
|
|
127960
|
+
loadOptionValue(argument) {
|
|
127961
|
+
var _a;
|
|
127962
|
+
const source = (_a = this.options) === null || _a === void 0 ? void 0 : _a.find((opt) => opt.value === argument);
|
|
127963
|
+
if (source != undefined) {
|
|
127964
|
+
this.selectOption(source);
|
|
127965
|
+
}
|
|
127966
|
+
else {
|
|
127967
|
+
this.showNoResultMessage();
|
|
127968
|
+
}
|
|
127969
|
+
}
|
|
127970
|
+
async showNoResultMessage() {
|
|
127971
|
+
this.clearSearch();
|
|
127972
|
+
ApplicationUtils.info(this._textEmptySearch.replace("{0}", this.getFieldLabel()));
|
|
127973
|
+
}
|
|
127974
|
+
getFieldLabel() {
|
|
127975
|
+
var _a;
|
|
127976
|
+
return (_a = this.label) === null || _a === void 0 ? void 0 : _a.replace(REQUIRED_INFO, "").toUpperCase();
|
|
127977
|
+
}
|
|
127978
|
+
resetOptions() {
|
|
127979
|
+
this.hideOptions();
|
|
127980
|
+
this._criteria = undefined;
|
|
127981
|
+
this._preSelection = undefined;
|
|
127982
|
+
this.updateVisibleOptions();
|
|
127983
|
+
}
|
|
127984
|
+
//---------------------------------------------
|
|
127985
|
+
// Lifecycle web component
|
|
127986
|
+
//---------------------------------------------
|
|
127987
|
+
componentWillLoad() {
|
|
127988
|
+
if (this.options === undefined) {
|
|
127989
|
+
this.options = [];
|
|
127990
|
+
const optionsTags = this.el.querySelectorAll("option");
|
|
127991
|
+
if (optionsTags) {
|
|
127992
|
+
optionsTags.forEach(e => {
|
|
127993
|
+
let label = e.innerText;
|
|
127994
|
+
let value = e.getAttribute("value");
|
|
127995
|
+
let details = e.getAttribute("details");
|
|
127996
|
+
if (!value) {
|
|
127997
|
+
value = label;
|
|
127998
|
+
}
|
|
127999
|
+
this.options.push({ label, value, details });
|
|
128000
|
+
e.hidden = true;
|
|
128001
|
+
});
|
|
128002
|
+
}
|
|
127703
128003
|
}
|
|
128004
|
+
this.updateSource([]);
|
|
128005
|
+
}
|
|
128006
|
+
componentDidRender() {
|
|
128007
|
+
var _a;
|
|
128008
|
+
if (this._floatingID === undefined) {
|
|
128009
|
+
this._listWrapper.remove();
|
|
128010
|
+
}
|
|
128011
|
+
(_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
|
|
128012
|
+
ElementIDUtils.addIDInfoIfNotExists(elem, "itemSearch");
|
|
128013
|
+
});
|
|
128014
|
+
this.validateDescriptionValue();
|
|
127704
128015
|
}
|
|
127705
128016
|
componentDidLoad() {
|
|
127706
|
-
CSSVarsUtils.applyVarsTextInput(this.
|
|
128017
|
+
CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
|
|
128018
|
+
this.setInputValue(false);
|
|
128019
|
+
this._resizeObserver = new ResizeObserver((entries) => {
|
|
128020
|
+
window.requestAnimationFrame(() => {
|
|
128021
|
+
if (!Array.isArray(entries) || !entries.length)
|
|
128022
|
+
return;
|
|
128023
|
+
const { clientWidth } = this._listContainer;
|
|
128024
|
+
if (clientWidth > 0 && !!this._listWrapper) {
|
|
128025
|
+
this._listWrapper.style.width = `${clientWidth}px`;
|
|
128026
|
+
}
|
|
128027
|
+
});
|
|
128028
|
+
});
|
|
128029
|
+
}
|
|
128030
|
+
//---------------------------------------------
|
|
128031
|
+
// Event handlers
|
|
128032
|
+
//---------------------------------------------
|
|
128033
|
+
handlerIconClick() {
|
|
128034
|
+
this.loadOptions(SearchMode.ADVANCED);
|
|
128035
|
+
}
|
|
128036
|
+
buildNumberArgument(argument) {
|
|
128037
|
+
if (this.isTextSearch) {
|
|
128038
|
+
return NaN;
|
|
128039
|
+
}
|
|
128040
|
+
return Number(argument || undefined);
|
|
128041
|
+
}
|
|
128042
|
+
onTextInputChangeHandler(event) {
|
|
128043
|
+
var _a;
|
|
128044
|
+
this.clearDeboucingTimeout();
|
|
128045
|
+
if (this._startLoading) {
|
|
128046
|
+
this._changeDeboucingTimeout = window.setTimeout(() => {
|
|
128047
|
+
this.onTextInputChangeHandler(event);
|
|
128048
|
+
}, this._deboucingTime);
|
|
128049
|
+
return;
|
|
128050
|
+
}
|
|
128051
|
+
const argument = (_a = event.target.value) === null || _a === void 0 ? void 0 : _a.trim();
|
|
128052
|
+
const argumentNumber = this.buildNumberArgument(argument);
|
|
128053
|
+
if (!this._criteria) {
|
|
128054
|
+
this._textInput.value = event.data || argument;
|
|
128055
|
+
}
|
|
128056
|
+
this._criteria = argument;
|
|
128057
|
+
if (argument) {
|
|
128058
|
+
this._showLoading = false;
|
|
128059
|
+
this.clearSource();
|
|
128060
|
+
if (!isNaN(argumentNumber) || argument.length >= this._limitCharsToSearch) {
|
|
128061
|
+
this._showLoading = true;
|
|
128062
|
+
this._changeDeboucingTimeout = window.setTimeout(() => {
|
|
128063
|
+
this.loadOptions(SearchMode.PREDICTIVE, isNaN(argumentNumber) ? argument : argumentNumber.toString());
|
|
128064
|
+
}, this._deboucingTime);
|
|
128065
|
+
this.showOptions();
|
|
128066
|
+
}
|
|
128067
|
+
else {
|
|
128068
|
+
this.hideOptions();
|
|
128069
|
+
}
|
|
128070
|
+
}
|
|
128071
|
+
else {
|
|
128072
|
+
this.hideOptions();
|
|
128073
|
+
this._showLoading = false;
|
|
128074
|
+
this.clearSource();
|
|
128075
|
+
}
|
|
128076
|
+
}
|
|
128077
|
+
clearDeboucingTimeout() {
|
|
128078
|
+
if (this._changeDeboucingTimeout) {
|
|
128079
|
+
window.clearTimeout(this._changeDeboucingTimeout);
|
|
128080
|
+
this._changeDeboucingTimeout = null;
|
|
128081
|
+
}
|
|
128082
|
+
}
|
|
128083
|
+
keyDownHandler(event) {
|
|
128084
|
+
this._tabPressed = false;
|
|
128085
|
+
if (event.ctrlKey) {
|
|
128086
|
+
if (event.key === "f" || event.key === "F") {
|
|
128087
|
+
this.loadOptions(SearchMode.ADVANCED);
|
|
128088
|
+
//ATENÇÃO: Ctrl + F tem ação específica nos browsers
|
|
128089
|
+
//nesse caso, como vamos abrir o popup de busca avançada,
|
|
128090
|
+
//não é interessante deixar o evento propagar;
|
|
128091
|
+
event.stopPropagation();
|
|
128092
|
+
event.stopImmediatePropagation();
|
|
128093
|
+
event.preventDefault();
|
|
128094
|
+
}
|
|
128095
|
+
}
|
|
128096
|
+
switch (event.key) {
|
|
128097
|
+
case "ArrowDown":
|
|
128098
|
+
this.nextOption();
|
|
128099
|
+
event.stopPropagation();
|
|
128100
|
+
break;
|
|
128101
|
+
case "ArrowUp":
|
|
128102
|
+
this.previousOption();
|
|
128103
|
+
event.stopPropagation();
|
|
128104
|
+
break;
|
|
128105
|
+
case "Enter":
|
|
128106
|
+
this.selectCurrentOption();
|
|
128107
|
+
break;
|
|
128108
|
+
case "Escape":
|
|
128109
|
+
this.cancelPreselection();
|
|
128110
|
+
break;
|
|
128111
|
+
case "Tab":
|
|
128112
|
+
this._tabPressed = true;
|
|
128113
|
+
this.controlListWithOnlyOne();
|
|
128114
|
+
break;
|
|
128115
|
+
}
|
|
128116
|
+
//ATENÇÃO: Existe a necessidade de propagar o evento de teclado.
|
|
128117
|
+
//Por exemplo, quando o usuário dá um Enter, além de selecionar
|
|
128118
|
+
//um valor, também significa que a ateração finalizou,
|
|
128119
|
+
//e o contexto pode reagir (fechar um popup por exemplo).
|
|
128120
|
+
//event.stopPropagation();
|
|
128121
|
+
}
|
|
128122
|
+
onTextInputFocusOutHandler() {
|
|
128123
|
+
if (this.hideErrorOnFocusOut)
|
|
128124
|
+
this.cancelPreselection();
|
|
128125
|
+
}
|
|
128126
|
+
canShowListOptions() {
|
|
128127
|
+
return !this._showLoading && this._visibleOptions.length > 0;
|
|
127707
128128
|
}
|
|
127708
128129
|
render() {
|
|
127709
|
-
|
|
127710
|
-
|
|
128130
|
+
var _a;
|
|
128131
|
+
ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
|
|
128132
|
+
return (h(Host, null, h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, h("button", { class: "btn", slot: "leftIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, h("ez-icon", { iconName: "search" })), ((_a = this._textInput) === null || _a === void 0 ? void 0 : _a.value) && (this._criteria || this.value)
|
|
128133
|
+
? h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, h("ez-icon", { iconName: "close" }))
|
|
128134
|
+
: undefined), h("section", { class: "list-container", ref: elem => this._listContainer = elem }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
128135
|
+
&& this._visibleOptions.length === 0
|
|
128136
|
+
&& h("div", { class: "message" }, h("span", { class: "message__no-result" }, this._textEmptyList)), this._showLoading
|
|
128137
|
+
&& h("div", { class: "message" }, h("div", { class: "message__loading" })), h("span", { class: "item__value item__value--hidden", ref: elem => this._itemValueBasis = elem }), this.canShowListOptions() && this._visibleOptions.map((opt, index) => this.buildItem(opt, index)))))));
|
|
127711
128138
|
}
|
|
127712
|
-
;
|
|
127713
|
-
get _elem() { return this; }
|
|
128139
|
+
get el() { return this; }
|
|
127714
128140
|
static get watchers() { return {
|
|
127715
128141
|
"errorMessage": ["observeErrorMessage"],
|
|
127716
|
-
"value": ["observeValue"]
|
|
128142
|
+
"value": ["observeValue"],
|
|
128143
|
+
"options": ["observeOptions"]
|
|
127717
128144
|
}; }
|
|
127718
128145
|
static get style() { return ezSearchCss; }
|
|
127719
128146
|
};
|
|
128147
|
+
var SearchMode;
|
|
128148
|
+
(function (SearchMode) {
|
|
128149
|
+
SearchMode["ADVANCED"] = "ADVANCED";
|
|
128150
|
+
SearchMode["PRELOAD"] = "PRELOAD";
|
|
128151
|
+
SearchMode["PREDICTIVE"] = "PREDICTIVE";
|
|
128152
|
+
})(SearchMode || (SearchMode = {}));
|
|
127720
128153
|
|
|
127721
128154
|
const ezSidebarButtonCss = ":host{position:relative;--ez-sidebar-button--width:6px;--ez-sidebar-button--hover--width:12px;--ez-sidebar-button--height:96px;--ez-sidebar-button--background-color--xlight:var(--background--xlight, #fff);--ez-sidebar-button--background-color--primary:var(--color--primary);--ez-sidebar-button--space--small:var(--space--small, 6px);--ez-sidebar-button--space--medium:var(--space--medium, 12px);--ez-sidebar-button--box-shadow:var(--shadow--small, 0px 0px 16px rgba(0, 38, 111, 0.07));--ez-sidebar-button--hover--box-shadow:var(--shadow--hard, 0px 0px 16px rgba(43, 58, 84, 0.24));--ez-sidebar-button--border--radius-small:var(--border--radius-small);--ez-sidebar-button--border--radius-medium:var(--border--radius-medium)}button{position:absolute;display:flex;background:var(--ez-sidebar-button--background-color--xlight);border:0;border-radius:0 var(--ez-sidebar-button--border--radius-medium) var(--ez-sidebar-button--border--radius-medium) 0;box-shadow:var(--ez-sidebar-button--box-shadow);padding:0;cursor:pointer}span{width:var(--ez-sidebar-button--width);height:var(--ez-sidebar-button--height);margin:var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--small) var(--ez-sidebar-button--space--medium) 0;background:var(--ez-sidebar-button--background-color--primary);border-radius:0 var(--ez-sidebar-button--border--radius-small) var(--ez-sidebar-button--border--radius-small) 0}button:hover{box-shadow:var(--ez-sidebar-button--hover--box-shadow)}button:hover span{width:var(--ez-sidebar-button--hover--width);margin:var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--medium) 0}";
|
|
127722
128155
|
|
|
@@ -130798,7 +131231,7 @@ const EzCardItem = /*@__PURE__*/proxyCustomElement(EzCardItem$1, [1,"ez-card-ite
|
|
|
130798
131231
|
const EzCheck = /*@__PURE__*/proxyCustomElement(EzCheck$1, [1,"ez-check",{"label":[513],"value":[1540],"enabled":[1540],"indeterminate":[1540],"mode":[513],"compact":[4]}]);
|
|
130799
131232
|
const EzChip = /*@__PURE__*/proxyCustomElement(EzChip$1, [1,"ez-chip",{"label":[513],"enabled":[516],"removePosition":[513,"remove-position"],"mode":[513],"value":[1540],"showNativeTooltip":[4,"show-native-tooltip"]}]);
|
|
130800
131233
|
const EzCollapsibleBox = /*@__PURE__*/proxyCustomElement(EzCollapsibleBox$1, [1,"ez-collapsible-box",{"value":[1540],"boxBordered":[4,"box-bordered"],"label":[513],"subtitle":[513],"headerSize":[513,"header-size"],"iconPlacement":[513,"icon-placement"],"headerAlign":[513,"header-align"],"removable":[516],"editable":[516],"conditionalSave":[16],"_activeEditText":[32]}]);
|
|
130801
|
-
const EzComboBox = /*@__PURE__*/proxyCustomElement(EzComboBox$1, [1,"ez-combo-box",{"limitCharsToSearch":[2,"limit-chars-to-search"],"value":[1537],"label":[513],"enabled":[516],"options":[1040],"errorMessage":[1537,"error-message"],"
|
|
131234
|
+
const EzComboBox = /*@__PURE__*/proxyCustomElement(EzComboBox$1, [1,"ez-combo-box",{"limitCharsToSearch":[2,"limit-chars-to-search"],"value":[1537],"label":[513],"enabled":[516],"options":[1040],"errorMessage":[1537,"error-message"],"showSelectedValue":[4,"show-selected-value"],"showOptionValue":[4,"show-option-value"],"suppressSearch":[4,"suppress-search"],"optionLoader":[16],"suppressEmptyOption":[4,"suppress-empty-option"],"canShowError":[516,"can-show-error"],"mode":[513],"hideErrorOnFocusOut":[4,"hide-error-on-focus-out"],"listOptionsPosition":[16],"isTextSearch":[4,"is-text-search"],"_preSelection":[32],"_visibleOptions":[32],"_startLoading":[32],"_showLoading":[32],"_criteria":[32]},[[11,"scroll","scrollListener"]]]);
|
|
130802
131235
|
const EzDateInput = /*@__PURE__*/proxyCustomElement(EzDateInput$1, [1,"ez-date-input",{"label":[513],"value":[1040],"enabled":[516],"errorMessage":[1537,"error-message"],"mode":[513],"canShowError":[516,"can-show-error"]}]);
|
|
130803
131236
|
const EzDateTimeInput = /*@__PURE__*/proxyCustomElement(EzDateTimeInput$1, [1,"ez-date-time-input",{"label":[513],"value":[1040],"enabled":[516],"errorMessage":[1537,"error-message"],"showSeconds":[516,"show-seconds"],"mode":[513],"canShowError":[516,"can-show-error"]}]);
|
|
130804
131237
|
const EzDialog = /*@__PURE__*/proxyCustomElement(EzDialog$1, [1,"ez-dialog",{"confirm":[1028],"dialogType":[1025,"dialog-type"],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"beforeClose":[1040]},[[8,"keydown","handleKeyDown"]]]);
|
|
@@ -130820,7 +131253,7 @@ const EzPopover = /*@__PURE__*/proxyCustomElement(EzPopover$1, [1,"ez-popover",{
|
|
|
130820
131253
|
const EzPopup = /*@__PURE__*/proxyCustomElement(EzPopup$1, [1,"ez-popup",{"size":[1],"opened":[1540],"useHeader":[516,"use-header"],"heightMode":[513,"height-mode"],"ezTitle":[1,"ez-title"]}]);
|
|
130821
131254
|
const EzRadioButton = /*@__PURE__*/proxyCustomElement(EzRadioButton$1, [1,"ez-radio-button",{"value":[1544],"options":[1040],"enabled":[516],"label":[513],"direction":[1537]}]);
|
|
130822
131255
|
const EzScroller = /*@__PURE__*/proxyCustomElement(EzScroller$1, [1,"ez-scroller",{"direction":[1],"locked":[4],"activeShadow":[4,"active-shadow"],"isActive":[32]},[[2,"click","clickListener"],[1,"mousedown","mouseDownHandler"],[1,"mouseup","mouseUpHandler"],[1,"mousemove","mouseMoveHandler"]]]);
|
|
130823
|
-
const EzSearch = /*@__PURE__*/proxyCustomElement(EzSearch$1, [1,"ez-search",{"value":[1537],"label":[1537],"enabled":[1540],"errorMessage":[1537,"error-message"],"optionLoader":[16],"showSelectedValue":[4,"show-selected-value"],"showOptionValue":[4,"show-option-value"],"suppressEmptyOption":[4,"suppress-empty-option"],"mode":[513],"canShowError":[516,"can-show-error"],"hideErrorOnFocusOut":[4,"hide-error-on-focus-out"],"listOptionsPosition":[16],"isTextSearch":[4,"is-text-search"],"ignoreLimitCharsToSearch":[4,"ignore-limit-chars-to-search"]}]);
|
|
131256
|
+
const EzSearch = /*@__PURE__*/proxyCustomElement(EzSearch$1, [1,"ez-search",{"value":[1537],"label":[1537],"enabled":[1540],"errorMessage":[1537,"error-message"],"optionLoader":[16],"showSelectedValue":[4,"show-selected-value"],"showOptionValue":[4,"show-option-value"],"suppressEmptyOption":[4,"suppress-empty-option"],"mode":[513],"canShowError":[516,"can-show-error"],"hideErrorOnFocusOut":[4,"hide-error-on-focus-out"],"listOptionsPosition":[16],"isTextSearch":[4,"is-text-search"],"ignoreLimitCharsToSearch":[4,"ignore-limit-chars-to-search"],"options":[1040],"suppressSearch":[4,"suppress-search"],"_preSelection":[32],"_visibleOptions":[32],"_startLoading":[32],"_showLoading":[32],"_criteria":[32]},[[11,"scroll","scrollListener"]]]);
|
|
130824
131257
|
const EzSidebarButton = /*@__PURE__*/proxyCustomElement(EzSidebarButton$1, [1,"ez-sidebar-button"]);
|
|
130825
131258
|
const EzSkeleton = /*@__PURE__*/proxyCustomElement(EzSkeleton$1, [0,"ez-skeleton",{"count":[2],"variant":[1],"width":[1],"height":[1],"marginBottom":[1,"margin-bottom"],"animation":[1]}]);
|
|
130826
131259
|
const EzSplitItem = /*@__PURE__*/proxyCustomElement(SplitItem, [0,"ez-split-item"]);
|