@sankhyalabs/ezui 5.20.0-dev.2 → 5.20.0-dev.4
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/README.md +4 -5
- package/dist/cjs/ez-alert-list.cjs.entry.js +33 -28
- package/dist/cjs/ez-card-item.cjs.entry.js +52 -0
- package/dist/cjs/ez-combo-box.cjs.entry.js +155 -11
- package/dist/cjs/ez-filter-input_2.cjs.entry.js +137 -0
- package/dist/cjs/ez-form-view.cjs.entry.js +4 -2
- package/dist/cjs/ez-grid.cjs.entry.js +3 -3
- package/dist/cjs/ez-icon.cjs.entry.js +1 -1
- package/dist/cjs/ez-search.cjs.entry.js +31 -611
- package/dist/cjs/ez-split-panel.cjs.entry.js +3 -2
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/index-a7b0c73d.js +6 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/ez-alert-list/ez-alert-list.js +33 -28
- package/dist/collection/components/ez-card-item/ez-card-item.css +0 -16
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +173 -12
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/FileInput.tpl.js +4 -2
- package/dist/collection/components/ez-grid/ez-grid.css +1 -0
- package/dist/collection/components/ez-grid/ez-grid.js +2 -2
- package/dist/collection/components/ez-icon/ez-icon.css +1 -1
- package/dist/collection/components/ez-search/ez-search.css +0 -330
- package/dist/collection/components/ez-search/ez-search.js +55 -689
- package/dist/collection/components/ez-split-panel/ez-split-panel.css +7 -0
- package/dist/collection/components/ez-split-panel/ez-split-panel.js +19 -1
- package/dist/custom-elements/index.js +240 -665
- package/dist/esm/ez-alert-list.entry.js +33 -28
- package/dist/esm/ez-card-item.entry.js +48 -0
- package/dist/esm/ez-combo-box.entry.js +156 -12
- package/dist/esm/ez-filter-input_2.entry.js +132 -0
- package/dist/esm/ez-form-view.entry.js +4 -2
- package/dist/esm/ez-grid.entry.js +3 -3
- package/dist/esm/ez-icon.entry.js +1 -1
- package/dist/esm/ez-search.entry.js +33 -613
- package/dist/esm/ez-split-panel.entry.js +3 -2
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/index-baa5e267.js +6 -2
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-05f5a778.entry.js +1 -0
- package/dist/ezui/p-13dbad96.entry.js +1 -0
- package/dist/ezui/p-5613fe63.entry.js +1 -0
- package/dist/ezui/p-60848ef6.entry.js +1 -0
- package/dist/ezui/{p-6e2f8e6b.entry.js → p-844ee673.entry.js} +1 -1
- package/dist/ezui/{p-f56dd1da.entry.js → p-93c3df4f.entry.js} +1 -1
- package/dist/ezui/p-940ed30b.entry.js +1 -0
- package/dist/ezui/p-a32aaac6.entry.js +1 -0
- package/dist/ezui/p-a5ac7151.entry.js +1 -0
- package/dist/types/components/ez-alert-list/ez-alert-list.d.ts +1 -1
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +15 -0
- package/dist/types/components/ez-search/ez-search.d.ts +10 -100
- package/dist/types/components.d.ts +22 -23
- package/dist/types/utils/interfaces/AbstractFieldMetadata.d.ts +1 -2
- package/package.json +16 -8
- package/dist/cjs/ez-card-item_3.cjs.entry.js +0 -182
- package/dist/esm/ez-card-item_3.entry.js +0 -176
- package/dist/ezui/p-133fae4a.entry.js +0 -1
- package/dist/ezui/p-43b03119.entry.js +0 -1
- package/dist/ezui/p-4a7f113d.entry.js +0 -1
- package/dist/ezui/p-76ba9d67.entry.js +0 -1
- package/dist/ezui/p-796c1a88.entry.js +0 -1
- package/dist/ezui/p-ba875f37.entry.js +0 -1
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const index = require('./index-a7b0c73d.js');
|
|
6
|
-
const core = require('@sankhyalabs/core');
|
|
7
|
-
const CSSVarsUtils = require('./CSSVarsUtils-b136a156.js');
|
|
8
|
-
|
|
9
|
-
const ezCardItemCss = ":host {\n /*@doc Define o tamanho da fonte do componente.*/\n --ez-card-item--font-size: var(--text--medium, 14px);\n\n /*@doc Define a família da fonte do componente.*/\n --ez-card-item--font-family: var(--font-pattern, Arial);\n\n /*@doc Define o peso da fonte do componente.*/\n --ez-card-item--font-weight: var(--text-weight--medium, 400);\n\n /*@doc Define o peso da fonte do title do componente.*/\n --ez-card-item--font-weight-large: var(--text-weight--large, 600);\n\n /*@doc Define a cor da fonte do componente.*/\n --ez-card-item--color: var(--title--primary, #2B3A54);\n\n /*@doc Define a cor da fonte da key do componente.*/\n --ez-card-item__key--color: var(--text--primary, #626e82);\n\n /*@doc Define a cor da fonte do label do detalhe do componente.*/\n --ez-card-item__detail-label--color: var(--text--secondary, #A2ABB9);\n\n /*@doc Define o espaçamento inferior dos detalhes do componente.*/\n --ez-card-item__detail--padding-bottom: var(--space--extra-small, 3px);\n\n /*@doc Define o espaçamento inferior do title do componente.*/\n --ez-card-item__title--padding-bottom: var(--space--extra-small, 3px);\n\n /*@doc Define a cor do highlight / marcação nos textos do componente.*/\n --ez-card-item__highlight--color: var(--color--primary-300, #E2F4EF);\n\n width: 100%;\n display: flex;\n cursor: pointer;\n}\n\n.card-item {\n display: flex;\n flex-direction: column;\n width: 100%;\n cursor: pointer;\n padding: 12px;\n z-index: 0;\n position: relative;\n container-type: inline-size;\n container-name: box;\n}\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}";
|
|
10
|
-
|
|
11
|
-
const EzCardItem = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
index.registerInstance(this, hostRef);
|
|
14
|
-
this.ezClick = index.createEvent(this, "ezClick", 7);
|
|
15
|
-
this.item = undefined;
|
|
16
|
-
}
|
|
17
|
-
componentWillRender() {
|
|
18
|
-
this.createDetailList();
|
|
19
|
-
}
|
|
20
|
-
componentDidLoad() {
|
|
21
|
-
var _a, _b;
|
|
22
|
-
const dataInfo = { id: core.StringUtils.toCamelCase(((_a = this.item) === null || _a === void 0 ? void 0 : _a.key) || ((_b = this.item) === null || _b === void 0 ? void 0 : _b.title) || "") };
|
|
23
|
-
core.ElementIDUtils.addIDInfo(this._element, null, dataInfo);
|
|
24
|
-
}
|
|
25
|
-
createDetailList() {
|
|
26
|
-
var _a, _b, _c;
|
|
27
|
-
this._details = { detailsLeft: [], detailsRight: [] };
|
|
28
|
-
let cont = 0;
|
|
29
|
-
if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.details) {
|
|
30
|
-
for (const attribute in this.item.details) {
|
|
31
|
-
cont < 3 ?
|
|
32
|
-
this._details.detailsLeft.push({ label: attribute, value: (_b = this.item.details[attribute]) === null || _b === void 0 ? void 0 : _b.toString() }) :
|
|
33
|
-
this._details.detailsRight.push({ label: attribute, value: (_c = this.item.details[attribute]) === null || _c === void 0 ? void 0 : _c.toString() });
|
|
34
|
-
cont++;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
buildDetailContent(detail) {
|
|
39
|
-
return index.h("div", { class: "card-item__detail" }, index.h("label", { class: "card-item__detail-label" }, detail.label), ": ", index.h("label", { class: "card-item__detail-value", innerHTML: detail.value }));
|
|
40
|
-
}
|
|
41
|
-
render() {
|
|
42
|
-
return (index.h(index.Host, null, this.item &&
|
|
43
|
-
index.h("div", { class: "card-item", onClick: () => { this.ezClick.emit(this.item); } }, index.h("label", { class: "card-item__title" }, index.h("span", { class: "card-item__key", innerHTML: this.item.key }), index.h("span", { innerHTML: this.item.title })), index.h("div", { class: "card-item__details" }, index.h("div", { class: "card-item__details-left" }, this._details.detailsLeft.map(detail => {
|
|
44
|
-
return this.buildDetailContent(detail);
|
|
45
|
-
})), index.h("div", { class: "card-item__details-right" }, this._details.detailsRight.map(detail => {
|
|
46
|
-
return this.buildDetailContent(detail);
|
|
47
|
-
}))))));
|
|
48
|
-
}
|
|
49
|
-
get _element() { return index.getElement(this); }
|
|
50
|
-
};
|
|
51
|
-
EzCardItem.style = ezCardItemCss;
|
|
52
|
-
|
|
53
|
-
const ezFilterInputCss = ":host{display:block;width:100%}";
|
|
54
|
-
|
|
55
|
-
const EzFilterInput = class {
|
|
56
|
-
constructor(hostRef) {
|
|
57
|
-
index.registerInstance(this, hostRef);
|
|
58
|
-
this.ezChange = index.createEvent(this, "ezChange", 7);
|
|
59
|
-
this.ezSearching = index.createEvent(this, "ezSearching", 7);
|
|
60
|
-
this.ezFocusIn = index.createEvent(this, "ezFocusIn", 7);
|
|
61
|
-
this._searchingText = "";
|
|
62
|
-
this.handleFocus = () => {
|
|
63
|
-
if (this._searchingText === "") {
|
|
64
|
-
this._textInput.value = "";
|
|
65
|
-
}
|
|
66
|
-
else {
|
|
67
|
-
this._textInput.value = this._searchingText;
|
|
68
|
-
}
|
|
69
|
-
this.ezFocusIn.emit();
|
|
70
|
-
};
|
|
71
|
-
this.label = undefined;
|
|
72
|
-
this.value = undefined;
|
|
73
|
-
this.enabled = true;
|
|
74
|
-
this.errorMessage = undefined;
|
|
75
|
-
this.restrict = undefined;
|
|
76
|
-
this.mode = "regular";
|
|
77
|
-
this.asyncSearch = false;
|
|
78
|
-
this.canShowError = true;
|
|
79
|
-
}
|
|
80
|
-
observeLabel() {
|
|
81
|
-
if (this._textInput) {
|
|
82
|
-
this._textInput.label = this.label;
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
observeErrorMessage() {
|
|
86
|
-
if (this._textInput) {
|
|
87
|
-
this._textInput.errorMessage = this.errorMessage;
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
observeValue(newValue, oldValue) {
|
|
91
|
-
if (this._textInput && newValue != oldValue) {
|
|
92
|
-
this._textInput.value = newValue;
|
|
93
|
-
this.ezChange.emit(newValue);
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
/**
|
|
97
|
-
* Aplica o foco no campo.
|
|
98
|
-
*/
|
|
99
|
-
async setFocus() {
|
|
100
|
-
this._textInput.setFocus();
|
|
101
|
-
}
|
|
102
|
-
/**
|
|
103
|
-
* Remove o foco do campo.
|
|
104
|
-
*/
|
|
105
|
-
async setBlur() {
|
|
106
|
-
this._textInput.setBlur();
|
|
107
|
-
}
|
|
108
|
-
/**
|
|
109
|
-
* Retorna se o conteúdo é inválido.
|
|
110
|
-
*/
|
|
111
|
-
async isInvalid() {
|
|
112
|
-
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
113
|
-
}
|
|
114
|
-
/**
|
|
115
|
-
* Método responsável por setar um novo valor ao campo.
|
|
116
|
-
*/
|
|
117
|
-
async setValue(newValue) {
|
|
118
|
-
if (!this.asyncSearch || this._textInput == undefined) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
if (newValue !== this.value) {
|
|
122
|
-
this.value = newValue;
|
|
123
|
-
this._searchingText = "";
|
|
124
|
-
}
|
|
125
|
-
else {
|
|
126
|
-
this._textInput.value = newValue;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
/**
|
|
130
|
-
* Método responsável por resetar o valor do campo para o ultimo valor inputado.
|
|
131
|
-
*/
|
|
132
|
-
async endSearch() {
|
|
133
|
-
if (!this.asyncSearch || this._textInput == undefined) {
|
|
134
|
-
return;
|
|
135
|
-
}
|
|
136
|
-
if (this._textInput.value !== this.value) {
|
|
137
|
-
this._textInput.value = this.value;
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
handleChange(evt) {
|
|
141
|
-
const newValue = evt.detail;
|
|
142
|
-
this.errorMessage = "";
|
|
143
|
-
if (this.asyncSearch) {
|
|
144
|
-
this._searchingText = newValue;
|
|
145
|
-
this.ezSearching.emit(newValue);
|
|
146
|
-
}
|
|
147
|
-
else if (newValue !== this.value) {
|
|
148
|
-
this.value = newValue;
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
componentDidLoad() {
|
|
152
|
-
CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
|
|
153
|
-
}
|
|
154
|
-
render() {
|
|
155
|
-
core.ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
|
|
156
|
-
return (index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.handleChange(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, mode: this.mode, onFocusin: this.handleFocus, canShowError: this.canShowError }, index.h("ez-icon", { slot: "leftIcon", iconName: "search" })));
|
|
157
|
-
}
|
|
158
|
-
get _elem() { return index.getElement(this); }
|
|
159
|
-
static get watchers() { return {
|
|
160
|
-
"label": ["observeLabel"],
|
|
161
|
-
"errorMessage": ["observeErrorMessage"],
|
|
162
|
-
"value": ["observeValue"]
|
|
163
|
-
}; }
|
|
164
|
-
};
|
|
165
|
-
EzFilterInput.style = ezFilterInputCss;
|
|
166
|
-
|
|
167
|
-
const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
|
|
168
|
-
|
|
169
|
-
const MultiSelectionBoxMessage = class {
|
|
170
|
-
constructor(hostRef) {
|
|
171
|
-
index.registerInstance(this, hostRef);
|
|
172
|
-
this.message = undefined;
|
|
173
|
-
}
|
|
174
|
-
render() {
|
|
175
|
-
return (index.h("div", { class: "multi-selection__message" }, index.h("span", { class: "multi-selection__text-message" }, this.message)));
|
|
176
|
-
}
|
|
177
|
-
};
|
|
178
|
-
MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
|
|
179
|
-
|
|
180
|
-
exports.ez_card_item = EzCardItem;
|
|
181
|
-
exports.ez_filter_input = EzFilterInput;
|
|
182
|
-
exports.multi_selection_box_message = MultiSelectionBoxMessage;
|
|
@@ -1,176 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-baa5e267.js';
|
|
2
|
-
import { StringUtils, ElementIDUtils } from '@sankhyalabs/core';
|
|
3
|
-
import { C as CSSVarsUtils } from './CSSVarsUtils-a97cfa29.js';
|
|
4
|
-
|
|
5
|
-
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}";
|
|
6
|
-
|
|
7
|
-
const EzCardItem = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
registerInstance(this, hostRef);
|
|
10
|
-
this.ezClick = createEvent(this, "ezClick", 7);
|
|
11
|
-
this.item = undefined;
|
|
12
|
-
}
|
|
13
|
-
componentWillRender() {
|
|
14
|
-
this.createDetailList();
|
|
15
|
-
}
|
|
16
|
-
componentDidLoad() {
|
|
17
|
-
var _a, _b;
|
|
18
|
-
const dataInfo = { id: StringUtils.toCamelCase(((_a = this.item) === null || _a === void 0 ? void 0 : _a.key) || ((_b = this.item) === null || _b === void 0 ? void 0 : _b.title) || "") };
|
|
19
|
-
ElementIDUtils.addIDInfo(this._element, null, dataInfo);
|
|
20
|
-
}
|
|
21
|
-
createDetailList() {
|
|
22
|
-
var _a, _b, _c;
|
|
23
|
-
this._details = { detailsLeft: [], detailsRight: [] };
|
|
24
|
-
let cont = 0;
|
|
25
|
-
if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.details) {
|
|
26
|
-
for (const attribute in this.item.details) {
|
|
27
|
-
cont < 3 ?
|
|
28
|
-
this._details.detailsLeft.push({ label: attribute, value: (_b = this.item.details[attribute]) === null || _b === void 0 ? void 0 : _b.toString() }) :
|
|
29
|
-
this._details.detailsRight.push({ label: attribute, value: (_c = this.item.details[attribute]) === null || _c === void 0 ? void 0 : _c.toString() });
|
|
30
|
-
cont++;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
buildDetailContent(detail) {
|
|
35
|
-
return h("div", { class: "card-item__detail" }, h("label", { class: "card-item__detail-label" }, detail.label), ": ", h("label", { class: "card-item__detail-value", innerHTML: detail.value }));
|
|
36
|
-
}
|
|
37
|
-
render() {
|
|
38
|
-
return (h(Host, null, this.item &&
|
|
39
|
-
h("div", { class: "card-item", onClick: () => { this.ezClick.emit(this.item); } }, h("label", { class: "card-item__title" }, h("span", { class: "card-item__key", innerHTML: this.item.key }), h("span", { innerHTML: this.item.title })), h("div", { class: "card-item__details" }, h("div", { class: "card-item__details-left" }, this._details.detailsLeft.map(detail => {
|
|
40
|
-
return this.buildDetailContent(detail);
|
|
41
|
-
})), h("div", { class: "card-item__details-right" }, this._details.detailsRight.map(detail => {
|
|
42
|
-
return this.buildDetailContent(detail);
|
|
43
|
-
}))))));
|
|
44
|
-
}
|
|
45
|
-
get _element() { return getElement(this); }
|
|
46
|
-
};
|
|
47
|
-
EzCardItem.style = ezCardItemCss;
|
|
48
|
-
|
|
49
|
-
const ezFilterInputCss = ":host{display:block;width:100%}";
|
|
50
|
-
|
|
51
|
-
const EzFilterInput = class {
|
|
52
|
-
constructor(hostRef) {
|
|
53
|
-
registerInstance(this, hostRef);
|
|
54
|
-
this.ezChange = createEvent(this, "ezChange", 7);
|
|
55
|
-
this.ezSearching = createEvent(this, "ezSearching", 7);
|
|
56
|
-
this.ezFocusIn = createEvent(this, "ezFocusIn", 7);
|
|
57
|
-
this._searchingText = "";
|
|
58
|
-
this.handleFocus = () => {
|
|
59
|
-
if (this._searchingText === "") {
|
|
60
|
-
this._textInput.value = "";
|
|
61
|
-
}
|
|
62
|
-
else {
|
|
63
|
-
this._textInput.value = this._searchingText;
|
|
64
|
-
}
|
|
65
|
-
this.ezFocusIn.emit();
|
|
66
|
-
};
|
|
67
|
-
this.label = undefined;
|
|
68
|
-
this.value = undefined;
|
|
69
|
-
this.enabled = true;
|
|
70
|
-
this.errorMessage = undefined;
|
|
71
|
-
this.restrict = undefined;
|
|
72
|
-
this.mode = "regular";
|
|
73
|
-
this.asyncSearch = false;
|
|
74
|
-
this.canShowError = true;
|
|
75
|
-
}
|
|
76
|
-
observeLabel() {
|
|
77
|
-
if (this._textInput) {
|
|
78
|
-
this._textInput.label = this.label;
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
observeErrorMessage() {
|
|
82
|
-
if (this._textInput) {
|
|
83
|
-
this._textInput.errorMessage = this.errorMessage;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
observeValue(newValue, oldValue) {
|
|
87
|
-
if (this._textInput && newValue != oldValue) {
|
|
88
|
-
this._textInput.value = newValue;
|
|
89
|
-
this.ezChange.emit(newValue);
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
/**
|
|
93
|
-
* Aplica o foco no campo.
|
|
94
|
-
*/
|
|
95
|
-
async setFocus() {
|
|
96
|
-
this._textInput.setFocus();
|
|
97
|
-
}
|
|
98
|
-
/**
|
|
99
|
-
* Remove o foco do campo.
|
|
100
|
-
*/
|
|
101
|
-
async setBlur() {
|
|
102
|
-
this._textInput.setBlur();
|
|
103
|
-
}
|
|
104
|
-
/**
|
|
105
|
-
* Retorna se o conteúdo é inválido.
|
|
106
|
-
*/
|
|
107
|
-
async isInvalid() {
|
|
108
|
-
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
109
|
-
}
|
|
110
|
-
/**
|
|
111
|
-
* Método responsável por setar um novo valor ao campo.
|
|
112
|
-
*/
|
|
113
|
-
async setValue(newValue) {
|
|
114
|
-
if (!this.asyncSearch || this._textInput == undefined) {
|
|
115
|
-
return;
|
|
116
|
-
}
|
|
117
|
-
if (newValue !== this.value) {
|
|
118
|
-
this.value = newValue;
|
|
119
|
-
this._searchingText = "";
|
|
120
|
-
}
|
|
121
|
-
else {
|
|
122
|
-
this._textInput.value = newValue;
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
/**
|
|
126
|
-
* Método responsável por resetar o valor do campo para o ultimo valor inputado.
|
|
127
|
-
*/
|
|
128
|
-
async endSearch() {
|
|
129
|
-
if (!this.asyncSearch || this._textInput == undefined) {
|
|
130
|
-
return;
|
|
131
|
-
}
|
|
132
|
-
if (this._textInput.value !== this.value) {
|
|
133
|
-
this._textInput.value = this.value;
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
handleChange(evt) {
|
|
137
|
-
const newValue = evt.detail;
|
|
138
|
-
this.errorMessage = "";
|
|
139
|
-
if (this.asyncSearch) {
|
|
140
|
-
this._searchingText = newValue;
|
|
141
|
-
this.ezSearching.emit(newValue);
|
|
142
|
-
}
|
|
143
|
-
else if (newValue !== this.value) {
|
|
144
|
-
this.value = newValue;
|
|
145
|
-
}
|
|
146
|
-
}
|
|
147
|
-
componentDidLoad() {
|
|
148
|
-
CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
|
|
149
|
-
}
|
|
150
|
-
render() {
|
|
151
|
-
ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
|
|
152
|
-
return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.handleChange(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, mode: this.mode, onFocusin: this.handleFocus, canShowError: this.canShowError }, h("ez-icon", { slot: "leftIcon", iconName: "search" })));
|
|
153
|
-
}
|
|
154
|
-
get _elem() { return getElement(this); }
|
|
155
|
-
static get watchers() { return {
|
|
156
|
-
"label": ["observeLabel"],
|
|
157
|
-
"errorMessage": ["observeErrorMessage"],
|
|
158
|
-
"value": ["observeValue"]
|
|
159
|
-
}; }
|
|
160
|
-
};
|
|
161
|
-
EzFilterInput.style = ezFilterInputCss;
|
|
162
|
-
|
|
163
|
-
const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
|
|
164
|
-
|
|
165
|
-
const MultiSelectionBoxMessage = class {
|
|
166
|
-
constructor(hostRef) {
|
|
167
|
-
registerInstance(this, hostRef);
|
|
168
|
-
this.message = undefined;
|
|
169
|
-
}
|
|
170
|
-
render() {
|
|
171
|
-
return (h("div", { class: "multi-selection__message" }, h("span", { class: "multi-selection__text-message" }, this.message)));
|
|
172
|
-
}
|
|
173
|
-
};
|
|
174
|
-
MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
|
|
175
|
-
|
|
176
|
-
export { EzCardItem as ez_card_item, EzFilterInput as ez_filter_input, MultiSelectionBoxMessage as multi_selection_box_message };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as o,c as i,h as t,H as e,g as s}from"./p-23a36bb6.js";import{ObjectUtils as r,FloatingManager as l,ElementIDUtils as a}from"@sankhyalabs/core";import"./p-2187f86c.js";import{C as n}from"./p-7eb3e1a5.js";import"./p-ab574d59.js";import"./p-b853763b.js";const h=class{constructor(t){o(this,t),this.ezChange=i(this,"ezChange",7),this._changeDeboucingTimeout=null,this._deboucingTime=300,this._maxWidthValue=0,this._tabPressed=!1,this._textEmptyList="Nenhum resultado encontrado",this._lookupMode=!1,this._preSelection=void 0,this._visibleOptions=void 0,this._startLoading=!1,this._showLoading=!0,this._criteria=void 0,this.limitCharsToSearch=3,this.value=void 0,this.label=void 0,this.enabled=!0,this.options=void 0,this.errorMessage=void 0,this.showSelectedValue=!1,this.showOptionValue=!1,this.suppressSearch=!1,this.optionLoader=void 0,this.suppressEmptyOption=!1,this.canShowError=!0,this.mode="regular",this.hideErrorOnFocusOut=!0,this.listOptionsPosition=void 0,this.isTextSearch=!1}observeErrorMessage(){var o;this._textInput&&(this._textInput.errorMessage=this.errorMessage,(null===(o=this.errorMessage)||void 0===o?void 0:o.trim())||this.setInputValue())}observeValue(o,i){if(this._textInput&&o!=i)try{if("string"==typeof o)return void this.setInputValue();const t=this.getSelectedOption(o),e=this.getSelectedOption(i),s=this.getSelectedOption(this.value);this.isDifferentValues(s,t)&&(this.value=t),this.isDifferentValues(t,e)&&(this.setInputValue(),this._lookupMode||this.ezChange.emit(null===t?void 0:t)),this.resetOptions()}finally{this._lookupMode=!1}}observeOptions(o,i){(null==o?void 0:o.join(""))!==(null==i?void 0:i.join(""))&&this.loadOptions(b.PRELOAD)}async getValueAsync(){return new Promise(this._showLoading?o=>{let i=setInterval((()=>{this._showLoading||(clearInterval(i),o(this.value))}),100)}:o=>o(this.value))}async setFocus(){this._textInput&&this._textInput.setFocus()}async setBlur(){this._textInput&&this._textInput.setBlur()}async isInvalid(){return"string"==typeof this.errorMessage&&""!==this.errorMessage.trim()}async clearValue(){this.clearSearch()}scrollListener(){var o;null!=this._floatingID&&((null===(o=this.listOptionsPosition)||void 0===o?void 0:o.hardPosition)?this.hideOptions():window.requestAnimationFrame((()=>{this.updateListPosition()})))}updateListPosition(){let{verticalPosition:o,horizontalPosition:i,fromBottom:t,fromRight:e,bottomLimit:s,hardPosition:r}=this.getListPosition();const l=this._listWrapper.getBoundingClientRect(),a=this._listContainer.getBoundingClientRect(),n=this._textInput.getBoundingClientRect(),h=s||window.innerHeight;!t&&(l.top<0||a.bottom+l.height>h)&&(t=!0),r||(o=o||0,i=i||0,t?o=window.innerHeight-n.top+o:o+=a.top,e?i=window.innerWidth-n.right+i:i+=a.left),null!=o&&(this._listWrapper.style[t?"bottom":"top"]=`${o}px`,this._listWrapper.style[t?"top":"bottom"]=""),null!=i&&(this._listWrapper.style[e?"right":"left"]=`${i}px`,this._listWrapper.style[e?"left":"right"]="")}getListPosition(){return this.listOptionsPosition?this.listOptionsPosition:{verticalPosition:this.errorMessage||!this.canShowError||"slim"===this.mode?6:-13}}isDifferentValues(o,i){return r.objectToString(o||{})!==r.objectToString(i||{})}getFormattedText(o){if(null!=o)return this.showSelectedValue&&null!=o.value?o.label?`${o.value} - ${o.label}`:o.value:o.label}getText(){const o=this.getSelectedOption(this.value),i=this.getFormattedText(o);if(null!=i)return String(i).replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,'"')}getSelectedOption(o){return"string"==typeof o||o instanceof String?this._visibleOptions.find((i=>i.value===o)):o}updateVisibleOptions(){let o=this._source||[];if(this._criteria){const i=this._criteria.toUpperCase();o=o.filter((o=>o.label.toLocaleUpperCase().indexOf(i)>-1))}this._visibleOptions=this.suppressEmptyOption?o:[{value:void 0,label:""}].concat(o),this._maxWidthValue=this.getMaxWidthValue()}getMaxWidthValue(){var o;if(this.showOptionValue){const i=[];return null===(o=this._visibleOptions)||void 0===o||o.forEach((o=>{const t=this.getWidthValue(o.value);i.includes(t)||i.push(t)})),i.length>1?Math.max(...i):0}return 0}getWidthValue(o){if(null!=this._itemValueBasis){const i=this._itemValueBasis;if(null!=o)return i.innerHTML=o,i.clientWidth>0?i.clientWidth+2:0;i.innerHTML=""}return 0}buildItem(o,i){const e=this.showOptionValue&&this._maxWidthValue>0?`${this._maxWidthValue}px`:"";return o.label=o.label||o.value,t("li",{class:i===this._preSelection?"item preselected":"item",id:`item_${o.value}`,onMouseDown:()=>this.selectOption(o),onMouseOver:()=>this._preSelection=i},this.showOptionValue?t("span",{class:"item__value",title:o.value,style:{width:e,minWidth:e,maxWidth:e}},o.value):void 0,t("span",{class:"item__label "+(this.showOptionValue?"item__label--bold":""),title:o.label},o.label))}showOptions(){this.enabled&&(this.isOptionsVisible()||(this._resizeObserver&&this._resizeObserver.observe(this._textInput),this._floatingID=l.float(this._listWrapper,this._listContainer,{autoClose:!0,isFixed:!0,backClickListener:()=>this.hideOptions()}),this.setFocus(),window.requestAnimationFrame((()=>{this.updateListPosition(),this.listOptionsPosition||this._listWrapper.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}))))}hideOptions(){void 0!==this._floatingID&&l.close(this._floatingID),this._floatingID=void 0,this._resizeObserver&&this._resizeObserver.unobserve(this._textInput)}isOptionsVisible(){return void 0!==this._floatingID&&l.isFloating(this._floatingID)}nextOption(){this.isOptionsVisible()&&(this.showOptions(),this._preSelection=void 0===this._preSelection?0:Math.min(this._preSelection+1,this._visibleOptions.length-1),this.scrollToOption(this._visibleOptions[this._preSelection]))}previousOption(){this._preSelection=void 0===this._preSelection?0:Math.max(this._preSelection-1,0),this.scrollToOption(this._visibleOptions[this._preSelection])}scrollToOption(o){window.requestAnimationFrame((()=>{const i=(null==o?void 0:o.value)?this._optionsList.querySelector(`li#item_${o.value.replace(/[<>\[\]#=]/g,"\\$&").replace(/:/g,"\\:")}`):void 0;i&&i.scrollIntoView({behavior:"smooth",block:"nearest"})}))}selectCurrentOption(){void 0!==this._preSelection&&(this.selectOption(this._visibleOptions[this._preSelection]),this._preSelection=void 0)}updateSource(o){this._startLoading=!1,o instanceof Promise?(this._showLoading=!0,o.then((o=>{this._showLoading=!1,this.updateSource(o)})).catch((()=>this._showLoading=!1)),this.updateVisibleOptions()):(this._showLoading=!1,Array.isArray(o)?(this._source=o,this.updateVisibleOptions(),this._tabPressed&&(this._tabPressed=!1)):this.selectOption(o))}selectOption(o){var i,t;const e=this.getSelectedOption(this.value);(null===(i=null==e?void 0:e.value)||void 0===i?void 0:i.toString())!==(null===(t=null==o?void 0:o.value)||void 0===t?void 0:t.toString())||null==e&&null!=o&&"value"in o?this.value=(null==o?void 0:o.value)?o:void 0:this.resetOptions()}loadOptions(o,i=""){this._criteria=i,this._startLoading=!0,this.updateSource(this.optionLoader?this.optionLoader({mode:o,argument:i}):this.options)}cancelPreselection(){!this._textInput.value&&this.value?this.selectOption(void 0):window.setTimeout((()=>{this.setInputValue()}),this._deboucingTime),this.resetOptions()}setInputValue(o=!0){const i=this.getText();(this._textInput.value||"")!==i&&(this._textInput.value=i,o&&(this.errorMessage=null))}clearSearch(){this.value=null}resetOptions(){this.hideOptions(),this._criteria=void 0,this._preSelection=void 0,this.updateVisibleOptions()}componentWillLoad(){if(void 0===this.options){this.options=[];const o=this.el.querySelectorAll("option");o&&o.forEach((o=>{let i=o.innerText,t=o.getAttribute("value");t||(t=i),this.options.push({label:i,value:t}),o.hidden=!0}))}this.loadOptions(b.PRELOAD)}componentDidRender(){var o;void 0===this._floatingID&&this._listWrapper.remove(),null===(o=this._optionsList)||void 0===o||o.querySelectorAll(".item").forEach((o=>{a.addIDInfoIfNotExists(o,"itemComboBox")}))}componentDidLoad(){n.applyVarsTextInput(this.el,this._textInput),this.setInputValue(!1),this._resizeObserver=new ResizeObserver((o=>{window.requestAnimationFrame((()=>{if(!Array.isArray(o)||!o.length)return;const{clientWidth:i}=this._listContainer;i>0&&this._listWrapper&&(this._listWrapper.style.width=`${i}px`)}))}))}handlerIconClick(){this.showOptions()}onTextInputChangeHandler(o){var i;if(this.clearDeboucingTimeout(),this._startLoading)return void(this._changeDeboucingTimeout=window.setTimeout((()=>{this.onTextInputChangeHandler(o)}),this._deboucingTime));const t=null===(i=o.target.value)||void 0===i?void 0:i.trim();this._criteria||(this._textInput.value=o.data||t),this._criteria=t,t?(this.updateVisibleOptions(),this.showOptions()):(this.hideOptions(),this.updateVisibleOptions())}clearDeboucingTimeout(){this._changeDeboucingTimeout&&(window.clearTimeout(this._changeDeboucingTimeout),this._changeDeboucingTimeout=null)}onTextInputClickHandler(){this.showOptions()}keyDownHandler(o){switch(this._tabPressed=!1,o.ctrlKey&&("f"!==o.key&&"F"!==o.key||(this.loadOptions(b.ADVANCED),o.stopPropagation(),o.stopImmediatePropagation(),o.preventDefault())),o.key){case"ArrowDown":this.nextOption(),o.stopPropagation();break;case"ArrowUp":this.previousOption(),o.stopPropagation();break;case"Enter":this.selectCurrentOption();break;case"Escape":this.cancelPreselection();break;case"Tab":this._tabPressed=!0}}onTextInputFocusOutHandler(){this.hideErrorOnFocusOut&&this.cancelPreselection()}canShowListOptions(){return!this._showLoading&&this._visibleOptions.length>0}render(){return a.addIDInfoIfNotExists(this.el,"input"),t(e,null,t("ez-text-input",{"data-element-id":a.getInternalIDInfo("textInput"),class:this.suppressSearch?"suppressed-search-input":"",ref:o=>this._textInput=o,"data-slave-mode":"true",enabled:this.enabled&&!this.suppressSearch,onInput:o=>this.onTextInputChangeHandler(o),onClick:()=>this.onTextInputClickHandler(),onFocusout:()=>this.onTextInputFocusOutHandler(),onKeyDown:o=>this.keyDownHandler(o),label:this.label,canShowError:this.canShowError,errorMessage:this.errorMessage,mode:this.mode},t("button",{class:"btn",slot:"rightIcon",disabled:!this.enabled,tabindex:-1,onClick:()=>this.handlerIconClick()},t("ez-icon",{iconName:"chevron-down"}))),t("section",{class:"list-container",ref:o=>this._listContainer=o},t("div",{class:"list-wrapper",ref:o=>this._listWrapper=o},t("ul",{class:"list-options",ref:o=>this._optionsList=o},!this._showLoading&&0===this._visibleOptions.length&&t("div",{class:"message"},t("span",{class:"message__no-result"},this._textEmptyList)),this._showLoading&&t("div",{class:"message"},t("div",{class:"message__loading"})),this.showOptionValue?t("span",{class:"item__value item__value--hidden",ref:o=>this._itemValueBasis=o}):void 0,this.canShowListOptions()&&this._visibleOptions.map(((o,i)=>this.buildItem(o,i)))))))}get el(){return s(this)}static get watchers(){return{errorMessage:["observeErrorMessage"],value:["observeValue"],options:["observeOptions"]}}};var b;!function(o){o.ADVANCED="ADVANCED",o.PRELOAD="PRELOAD",o.PREDICTIVE="PREDICTIVE"}(b||(b={})),h.style=":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)}}";export{h as ez_combo_box}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as e,c as t,h as i,H as n,g as a}from"./p-23a36bb6.js";import{StringUtils as o,ElementIDUtils as r}from"@sankhyalabs/core";import{C as s}from"./p-7eb3e1a5.js";const l=class{constructor(i){e(this,i),this.ezClick=t(this,"ezClick",7),this.item=void 0}componentWillRender(){this.createDetailList()}componentDidLoad(){var e,t;const i={id:o.toCamelCase((null===(e=this.item)||void 0===e?void 0:e.key)||(null===(t=this.item)||void 0===t?void 0:t.title)||"")};r.addIDInfo(this._element,null,i)}createDetailList(){var e,t,i;this._details={detailsLeft:[],detailsRight:[]};let n=0;if(null===(e=this.item)||void 0===e?void 0:e.details)for(const e in this.item.details)n<3?this._details.detailsLeft.push({label:e,value:null===(t=this.item.details[e])||void 0===t?void 0:t.toString()}):this._details.detailsRight.push({label:e,value:null===(i=this.item.details[e])||void 0===i?void 0:i.toString()}),n++}buildDetailContent(e){return i("div",{class:"card-item__detail"},i("label",{class:"card-item__detail-label"},e.label),": ",i("label",{class:"card-item__detail-value",innerHTML:e.value}))}render(){return i(n,null,this.item&&i("div",{class:"card-item",onClick:()=>{this.ezClick.emit(this.item)}},i("label",{class:"card-item__title"},i("span",{class:"card-item__key",innerHTML:this.item.key}),i("span",{innerHTML:this.item.title})),i("div",{class:"card-item__details"},i("div",{class:"card-item__details-left"},this._details.detailsLeft.map((e=>this.buildDetailContent(e)))),i("div",{class:"card-item__details-right"},this._details.detailsRight.map((e=>this.buildDetailContent(e)))))))}get _element(){return a(this)}};l.style=":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}";const d=class{constructor(i){e(this,i),this.ezChange=t(this,"ezChange",7),this.ezSearching=t(this,"ezSearching",7),this.ezFocusIn=t(this,"ezFocusIn",7),this._searchingText="",this.handleFocus=()=>{this._textInput.value=""===this._searchingText?"":this._searchingText,this.ezFocusIn.emit()},this.label=void 0,this.value=void 0,this.enabled=!0,this.errorMessage=void 0,this.restrict=void 0,this.mode="regular",this.asyncSearch=!1,this.canShowError=!0}observeLabel(){this._textInput&&(this._textInput.label=this.label)}observeErrorMessage(){this._textInput&&(this._textInput.errorMessage=this.errorMessage)}observeValue(e,t){this._textInput&&e!=t&&(this._textInput.value=e,this.ezChange.emit(e))}async setFocus(){this._textInput.setFocus()}async setBlur(){this._textInput.setBlur()}async isInvalid(){return"string"==typeof this.errorMessage&&""!==this.errorMessage.trim()}async setValue(e){this.asyncSearch&&null!=this._textInput&&(e!==this.value?(this.value=e,this._searchingText=""):this._textInput.value=e)}async endSearch(){this.asyncSearch&&null!=this._textInput&&this._textInput.value!==this.value&&(this._textInput.value=this.value)}handleChange(e){const t=e.detail;this.errorMessage="",this.asyncSearch?(this._searchingText=t,this.ezSearching.emit(t)):t!==this.value&&(this.value=t)}componentDidLoad(){s.applyVarsTextInput(this._elem,this._textInput)}render(){return r.addIDInfoIfNotExists(this._elem,"input"),i("ez-text-input",{"data-element-id":r.getInternalIDInfo("textInput"),ref:e=>this._textInput=e,label:this.label,onEzChange:e=>this.handleChange(e),value:this.value,enabled:this.enabled,errorMessage:this.errorMessage,restrict:this.restrict,mode:this.mode,onFocusin:this.handleFocus,canShowError:this.canShowError},i("ez-icon",{slot:"leftIcon",iconName:"search"}))}get _elem(){return a(this)}static get watchers(){return{label:["observeLabel"],errorMessage:["observeErrorMessage"],value:["observeValue"]}}};d.style=":host{display:block;width:100%}";const c=class{constructor(t){e(this,t),this.message=void 0}render(){return i("div",{class:"multi-selection__message"},i("span",{class:"multi-selection__text-message"},this.message))}};c.style=".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";export{l as ez_card_item,d as ez_filter_input,c as multi_selection_box_message}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{h as e,r as a,c as t,H as l,g as o}from"./p-23a36bb6.js";import{ObjectUtils as n,UserInterface as r,ElementIDUtils as s}from"@sankhyalabs/core";import{R as d}from"./p-05e1f4e7.js";import{C as i}from"./p-b853763b.js";function c(a,t,l,o,n){return e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-align--middle ez-padding-horizontal--small ez-padding-bottom--large"},e("ez-check",{enabled:!l,label:t,mode:n?i.SWITCH:i.REGULAR,"data-field-name":a,"data-context-name":o,key:a}))}function m(a,t,l,o,n,r,s){return e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-number-input",{enabled:!l,label:t,precision:o,prettyPrecision:n,"data-field-name":a,"data-context-name":r,key:a,canShowError:s}))}const z=({name:a,label:t,readOnly:l,contextName:o,canShowError:n})=>e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-text-input",{label:t,"data-field-name":a,"data-context-name":o,key:a,enabled:!l,canShowError:n})),h=new Map;h.set(r.CHECKBOX,(e=>c(e.name,e.label,e.readOnly,e.contextName,!1))),h.set(r.SWITCH,(e=>c(e.name,e.label,e.readOnly,e.contextName,!0))),h.set(r.OPTIONSELECTOR,(({name:a,label:t,readOnly:l,required:o,props:n,contextName:r,canShowError:s})=>{const d=null==n?void 0:n.options;let i;if("string"==typeof d){const e=JSON.parse(d);i=Object.keys(e).map((a=>({value:a,label:e[a]})))}else i=d;return e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-combo-box",{enabled:!l,suppressEmptyOption:o,label:t,"data-field-name":a,"data-context-name":r,key:a,options:i,canShowError:s}))})),h.set(r.DATE,(({name:a,label:t,readOnly:l,canShowError:o})=>e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-date-input",{enabled:!l,label:t,"data-field-name":a,key:a,canShowError:o})))),h.set(r.TIME,(({name:a,label:t,readOnly:l,canShowError:o})=>e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-time-input",{enabled:!l,label:t,"data-field-name":a,key:a,canShowError:o})))),h.set(r.DATETIME,(({name:a,label:t,readOnly:l,contextName:o,canShowError:n})=>e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-date-time-input",{enabled:!l,label:t,"data-field-name":a,"data-context-name":o,key:a,canShowError:n})))),h.set(r.FILE,(({name:a,label:t,readOnly:l,contextName:o,props:r})=>{const s=n.removeEmptyValues({subTitle:r.subTitle,requestHeaders:r.STORAGESTRATEGY?{STORAGESTRATEGY:r.STORAGESTRATEGY}:null});return e("div",{class:"ez-col ez-col--sd-12 ez-padding-horizontal--small"},e("ez-upload",Object.assign({enabled:!l,label:t,"data-field-name":a,"data-context-name":o,key:a},s)))})),h.set(r.DECIMALNUMBER,(({name:e,label:a,readOnly:t,props:l,contextName:o,canShowError:n})=>{const r=Number((null==l?void 0:l.precision)||2);return m(e,a,t,r,Number((null==l?void 0:l.prettyPrecision)||r),o,n)})),h.set(r.INTEGERNUMBER,(({name:e,label:a,readOnly:t,contextName:l,canShowError:o})=>m(e,a,t,0,0,l,o))),h.set(r.SEARCH,(({name:a,label:t,readOnly:l,required:o,contextName:n,canShowError:r,optionLoader:s})=>e("div",{class:"ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small"},e("ez-search",{enabled:!l,suppressEmptyOption:o,label:t,"data-field-name":a,"data-context-name":n,key:a,canShowError:r,optionLoader:s})))),h.set(r.LONGTEXT,(({name:a,label:t,readOnly:l,contextName:o,rows:n,canShowError:r})=>e("div",{class:"ez-col ez-col--sd-12 ez-padding-horizontal--small",key:a},e("ez-text-area",{enabled:!l,label:t,"data-field-name":a,"data-context-name":o,rows:n,canShowError:r}))));const b=e=>{const a=h.get(e.userInterface)||z,t=e.required?`${e.label}${d}`:e.label,l=a(Object.assign(Object.assign({},e),{label:t}));return l.t["data-form-item"]=e.name,l};class p{constructor(e){this.elem=e}addRightElement(e){this.removeRightElement(),e.classList.add("ez-padding-left--small"),e.setAttribute("data-custom-item","true"),this.elem.classList.add("ez-col--nowrap"),this.elem.appendChild(e)}removeRightElement(){Array.from(this.elem.querySelectorAll('[data-custom-item="true"]')).forEach((e=>e.remove()))}get fieldName(){return this.elem.getAttribute("data-form-item")}}class u{constructor(e,a){this.items=new Map,this.formId=a,e.forEach((e=>{const a=new p(e);this.items.set(a.fieldName,a)}))}getItem(e){return this.items.get(e)}get formName(){return this.formId}}const y=class{constructor(e){a(this,e),this.ezContentReady=t(this,"ezContentReady",7),this.formItemsReady=t(this,"formItemsReady",7),this.fields=void 0}async showUp(){this._element.scrollIntoView({behavior:"smooth",block:"start"})}groupFields(e){const a=new Map;return e.forEach((e=>{const t=e.group;if(t){let l=a.get(t);null==l&&(l=[],a.set(t,l)),l.push(e)}else a.set(e.name,e)})),a}componentDidRender(){this.ezContentReady.emit(Array.from(this._element.querySelectorAll("[data-field-name]")));const e=new u(Array.from(this._element.querySelectorAll("[data-form-item]")));this.formItemsReady.emit(e)}render(){if(s.addIDInfoIfNotExists(this._element,"ezFormView"),null!=this.fields)return e(l,null,Array.from(this.groupFields(this.fields).entries()).map((([a,t])=>Array.isArray(t)?e("ez-collapsible-box",{id:`group-${a}`,label:a,"header-size":"large",key:a},t.map((e=>b(e)))):b(t))))}get _element(){return o(this)}};y.style=".sc-ez-form-view-h{display:flex;flex-direction:row;flex-wrap:wrap;width:100%}";export{y as ez_form_view}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,h as e,H as i,g as n}from"./p-23a36bb6.js";import{FloatingManager as a,ElementIDUtils as o}from"@sankhyalabs/core";const r=class{constructor(e){t(this,e),this.alerts=[],this.enableDragAndDrop=void 0,this.enableExpand=!0,this.itemRightSlotBuilder=void 0,this.opened=!0,this.expanded=!1}observeOpened(){this.manageOverlay()}alertId(t,e){return`alert-${e}-${(t=>{var e;return null!==(e=null==t?void 0:t.split(" ").join("-"))&&void 0!==e?e:""})(t)}`}getAlertTitle(t){var e;return null===(e=this.alerts.find(((e,i)=>this.alertId(e.title,i)===t)))||void 0===e?void 0:e.title}getTitleText(t){var e;const i=null!==(e=this.getAlertTitle(t.id))&&void 0!==e?e:"";return`${i}${i&&t.label?":":""}`}toggleExpandContainer(){this.enableExpand&&(this.expanded=!this.expanded,this._container.classList.toggle("expanded",this.expanded),this.expanded?this.updatePosition(this.getBoundingRight(),this.getBoundingBottom()):this.updatePosition("10px","10px"))}async manageOverlay(){this.opened?this._overlayId=a.float(this._container,this._overlayRef,this.getFloatOptions()):(a.close(this._overlayId),this._overlayId=void 0)}updatePosition(t,e){a.updateFloatPosition(this._container,this._overlayRef,Object.assign(Object.assign({},this.getFloatOptions()),{right:t,bottom:e}))}getFloatOptions(){return{autoClose:!1,isFixed:!1,bottom:"10px",right:"10px"}}getBoundingRight(){return(document.body.clientWidth-this._container.getBoundingClientRect().width)/2+"px"}getBoundingBottom(){return(document.body.clientHeight-this._container.getBoundingClientRect().height)/2+"px"}componentDidRender(){this.manageOverlay(),this.opened&&this._container.focus()}componentWillLoad(){this.dataElementId=o.addIDInfo(this._element,"EzAlertList")}render(){return e(i,Object.assign({},{[o.DATA_ELEMENT_ID_ATTRIBUTE_NAME]:this.dataElementId}),e("div",{ref:t=>this._overlayRef=t},e("div",{class:"alert-list__container "+(this.expanded?"expanded":""),ref:t=>this._container=t},e("div",{class:"alert-list__content"},e("div",{class:"alert-list__header"},e("div",{class:"alert-list__title"},`Avisos (${this.alerts.length})`),e("div",{class:"alert-list__header__buttons"},this.enableExpand&&e("ez-button",{mode:"icon",size:"small",iconName:"expand",onClick:()=>this.toggleExpandContainer(),"data-element-id":o.getInternalIDInfo("expandButton"),title:this.expanded?"Resumir":"Expandir"}),e("ez-button",{mode:"icon",size:"small",iconName:"close","data-element-id":o.getInternalIDInfo("closeButton"),onClick:()=>{this.opened=!1},title:"Fechar"}))),e("div",{class:"alert-list__expandable-content"},e("ez-list",{hoverFeedback:!0,itemLeftSlotBuilder:t=>e("a",{href:"#",style:{fontFamily:"var(--font-pattern, 'Roboto')",fontSize:"var(--text--medium, 14px)",fontWeight:"var(--text-weight--medium, 400)",color:"var(--color--primary, #008561)",marginRight:"4px",cursor:"pointer",display:"flex",width:"max-content",textDecoration:"none"}},this.getTitleText(t)),dataSource:this.alerts.map(((t,e)=>{var i;return{id:this.alertId(t.title,e),label:null!==(i=t.detail)&&void 0!==i?i:""}}))}))))))}get _element(){return n(this)}static get watchers(){return{opened:["observeOpened"]}}};r.style=':host {\n display: flex;\n\n /* Alert List */\n \n /*@doc Define a largura da lista minimizado */\n --ez-alert-list__container--width: 680px;\n /*@doc Define a altura da lista minimizado */\n --ez-alert-list__container--height: 220px;\n \n /*@doc Define a largura da lista maximizada */\n --ez-alert-list__container--width--expanded: 920px;\n /*@doc Define a altura da lista maximizada */\n --ez-alert-list__container--height--expanded: 540px;\n\n /* Title */\n /*@doc Define a fonte do título do componente */\n --ez-alert-list__title--font-family: var(--font-pattern, "Roboto");\n /*@doc Define o tamanho da fonte do título do popup.*/\n --ez-alert-list__title--font-size: var(--title--large, 20px);\n /*@doc Define a cor da fonte do título do popup.*/\n --ez-alert-list__title--color: var(--title--primary, #2b3a54);\n /*@doc Define o peso da fonte do título do popup.*/\n --ez-alert-list__title--font-weight: var(--text-weight--extra-large, 700);\n\n /* @doc Define a borda inferior do item da lista. */\n --ez-list__item--border-bottom: var(--border--small, 1px solid);\n\n /* @doc Define a cor da borda inferior do item da lista. */\n --ez-list__item--border-bottom-color: var(--color--strokes, #DCE0E8);\n\n /* @doc Define o tipo da quebra de linha do item da lista. */\n --ez-list__item--white-space: break-space;\n}\n\n.alert-list__content {\n display: flex;\n flex-direction: column;\n \n gap: var(--space--xs);\n margin: var(--space--large, 24px);\n width: 100%;\n}\n\n.alert-list__container {\n z-index: var(--more-visible--2x, 3);\n display: flex;\n height: var(--ez-alert-list__container--height);\n width: var(--ez-alert-list__container--width);\n border-radius: var(--border--radius-medium);\n background-color: var(--background--xlight);\n box-shadow: var(--shadow--medium);\n\n &.expanded {\n height: var(--ez-alert-list__container--height--expanded);\n width: var(--ez-alert-list__container--width--expanded);\n }\n\n @media (max-height: 640px) {\n max-height: calc(100vh - var(--space--3xl));\n } \n}\n\n.alert-list__header {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.alert-list__title {\n font-family: var(--ez-alert-list__title--font-family);\n font-size: var(--ez-alert-list__title--font-size);\n font-weight: var(--ez-alert-list__title--font-weight);\n color: var(--ez-alert-list__title--color);\n}\n\n.alert-list__header__buttons {\n display: flex;\n gap: var(--space--xs);\n}\n\n.alert-list__expandable-content {\n overflow-y: auto;\n scrollbar-width: thin;\n}\n\n';export{r as ez_alert_list}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as e,h as o,H as n,g as t}from"./p-23a36bb6.js";import{StringUtils as c,ElementIDUtils as i}from"@sankhyalabs/core";const r=class{constructor(o){e(this,o),this.size="medium",this.href=void 0,this.iconName=void 0}isSprite(){return this.href&&this.href.indexOf("#")>-1}getIconClassName(){return`ez-icon-${this.iconName}`}getIconContent(){return this.isSprite()?o("svg",{class:this.size,role:"img"},o("use",{xlinkHref:this.href})):c.isEmpty(this.iconName)?o("img",{class:this.size,src:this.href}):o("span",{class:`icon-content ${this.getIconClassName()} ${this.size}--font`})}componentDidLoad(){i.addIDInfo(this._hostElement,"icon")}render(){return o(n,null,this.getIconContent())}get _hostElement(){return t(this)}};r.style=':host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}[class^="ez-icon-"],[class*=" ez-icon-"]{color:var(--ez-icon--color)}[class^="ez-icon-"],[class*=" ez-icon-"]{font-family:\'ez-icons\' !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ez-icon-2chevron-down:before{content:"\\ea01"}.ez-icon-2chevron-up:before{content:"\\ea02"}.ez-icon-acao:before{content:"\\ea03"}.ez-icon-account-outline:before{content:"\\ea04"}.ez-icon-account:before{content:"\\ea05"}.ez-icon-alert-circle-inverted:before{content:"\\ea06"}.ez-icon-alert-circle:before{content:"\\ea07"}.ez-icon-alert-mail:before{content:"\\ea08"}.ez-icon-alert-popup:before{content:"\\ea09"}.ez-icon-anexo:before{content:"\\ea0a"}.ez-icon-antecipação:before{content:"\\ea0b"}.ez-icon-apps:before{content:"\\ea0c"}.ez-icon-arrow-forward:before{content:"\\ea0d"}.ez-icon-arrow-upward:before{content:"\\ea0e"}.ez-icon-arrow_back:before{content:"\\ea0f"}.ez-icon-arrow_downward:before{content:"\\ea10"}.ez-icon-baixa:before{content:"\\ea11"}.ez-icon-balance:before{content:"\\ea12"}.ez-icon-bell-inverted:before{content:"\\ea13"}.ez-icon-bell:before{content:"\\ea14"}.ez-icon-boleto:before{content:"\\ea15"}.ez-icon-boolean:before{content:"\\ea16"}.ez-icon-business-center:before{content:"\\ea17"}.ez-icon-calendar-clock:before{content:"\\ea18"}.ez-icon-calendar:before{content:"\\ea19"}.ez-icon-cash-remove:before{content:"\\ea1a"}.ez-icon-check-circle-inverted:before{content:"\\ea1b"}.ez-icon-check-circle:before{content:"\\ea1c"}.ez-icon-check:before{content:"\\ea1d"}.ez-icon-chevron-down:before{content:"\\ea1e"}.ez-icon-chevron-left:before{content:"\\ea1f"}.ez-icon-chevron-right:before{content:"\\ea20"}.ez-icon-chevron-up:before{content:"\\ea21"}.ez-icon-circle--medium:before{content:"\\ea22"}.ez-icon-circle:before{content:"\\ea23"}.ez-icon-cleaning:before{content:"\\ea24"}.ez-icon-clipboard:before{content:"\\ea25"}.ez-icon-close:before{content:"\\ea26"}.ez-icon-cobrar:before{content:"\\ea27"}.ez-icon-code:before{content:"\\ea28"}.ez-icon-configuration:before{content:"\\ea29"}.ez-icon-content-cut:before{content:"\\ea2a"}.ez-icon-copy:before{content:"\\ea2b"}.ez-icon-credit_card:before{content:"\\ea2c"}.ez-icon-crop:before{content:"\\ea2d"}.ez-icon-custom:before{content:"\\ea2e"}.ez-icon-delete-file:before{content:"\\ea2f"}.ez-icon-delete:before{content:"\\ea30"}.ez-icon-description:before{content:"\\ea31"}.ez-icon-dividir:before{content:"\\ea32"}.ez-icon-docx:before{content:"\\ea33"}.ez-icon-dot-notification:before{content:"\\ea34"}.ez-icon-dots-horizontal:before{content:"\\ea35"}.ez-icon-dots-vertical:before{content:"\\ea36"}.ez-icon-drag-indicator:before{content:"\\ea37"}.ez-icon-dual-chevron-down:before{content:"\\ea38"}.ez-icon-dual-chevron-left:before{content:"\\ea39"}.ez-icon-dual-chevron-right:before{content:"\\ea3a"}.ez-icon-dual-chevron-up:before{content:"\\ea3b"}.ez-icon-edit-file:before{content:"\\ea3c"}.ez-icon-edit-table:before{content:"\\ea3d"}.ez-icon-edit-time:before{content:"\\ea3e"}.ez-icon-edit-value:before{content:"\\ea3f"}.ez-icon-edit:before{content:"\\ea40"}.ez-icon-email:before{content:"\\ea41"}.ez-icon-estorno:before{content:"\\ea42"}.ez-icon-exe:before{content:"\\ea43"}.ez-icon-expand:before{content:"\\ea44"}.ez-icon-expandir_card:before{content:"\\ea45"}.ez-icon-extrato:before{content:"\\ea46"}.ez-icon-eye-off:before{content:"\\ea47"}.ez-icon-eye:before{content:"\\ea48"}.ez-icon-favorite:before{content:"\\ea49"}.ez-icon-figma:before{content:"\\ea4a"}.ez-icon-file-download:before{content:"\\ea4b"}.ez-icon-file-upload:before{content:"\\ea4c"}.ez-icon-filter:before{content:"\\ea4d"}.ez-icon-find-file:before{content:"\\ea4e"}.ez-icon-find-page:before{content:"\\ea4f"}.ez-icon-format-color-fill:before{content:"\\ea50"}.ez-icon-generic:before{content:"\\ea51"}.ez-icon-gif:before{content:"\\ea52"}.ez-icon-graph_bar:before{content:"\\ea53"}.ez-icon-handshake:before{content:"\\ea54"}.ez-icon-help-inverted:before{content:"\\ea55"}.ez-icon-help:before{content:"\\ea56"}.ez-icon-hide_menu:before{content:"\\ea57"}.ez-icon-home:before{content:"\\ea58"}.ez-icon-icons104:before{content:"\\ea59"}.ez-icon-language:before{content:"\\ea5a"}.ez-icon-launch:before{content:"\\ea5b"}.ez-icon-lightbulb:before{content:"\\ea5c"}.ez-icon-list:before{content:"\\ea5d"}.ez-icon-location:before{content:"\\ea5e"}.ez-icon-lock-outline:before{content:"\\ea5f"}.ez-icon-lock:before{content:"\\ea60"}.ez-icon-menu:before{content:"\\ea61"}.ez-icon-mid:before{content:"\\ea62"}.ez-icon-minus:before{content:"\\ea63"}.ez-icon-money-off:before{content:"\\ea64"}.ez-icon-money:before{content:"\\ea65"}.ez-icon-more:before{content:"\\ea66"}.ez-icon-mp3:before{content:"\\ea67"}.ez-icon-mp4:before{content:"\\ea68"}.ez-icon-multiple-files:before{content:"\\ea69"}.ez-icon-north-west:before{content:"\\ea6a"}.ez-icon-number:before{content:"\\ea6b"}.ez-icon-ordem-ascendente:before{content:"\\ea6c"}.ez-icon-ordem-descendente:before{content:"\\ea6d"}.ez-icon-parcelar:before{content:"\\ea6e"}.ez-icon-pause:before{content:"\\ea6f"}.ez-icon-payments:before{content:"\\ea70"}.ez-icon-pdf:before{content:"\\ea71"}.ez-icon-play:before{content:"\\ea72"}.ez-icon-plus:before{content:"\\ea73"}.ez-icon-png:before{content:"\\ea74"}.ez-icon-power:before{content:"\\ea75"}.ez-icon-pptx:before{content:"\\ea76"}.ez-icon-preview:before{content:"\\ea77"}.ez-icon-print:before{content:"\\ea78"}.ez-icon-push-pin:before{content:"\\ea79"}.ez-icon-rateio:before{content:"\\ea7a"}.ez-icon-receipt:before{content:"\\ea7b"}.ez-icon-recolher_card:before{content:"\\ea7c"}.ez-icon-restore:before{content:"\\ea7d"}.ez-icon-return:before{content:"\\ea7e"}.ez-icon-sankhya-place:before{content:"\\ea7f"}.ez-icon-save:before{content:"\\ea80"}.ez-icon-search:before{content:"\\ea81"}.ez-icon-settings-inverted:before{content:"\\ea82"}.ez-icon-settings:before{content:"\\ea83"}.ez-icon-share:before{content:"\\ea84"}.ez-icon-shield:before{content:"\\ea85"}.ez-icon-show_menu:before{content:"\\ea86"}.ez-icon-south-east:before{content:"\\ea87"}.ez-icon-sync:before{content:"\\ea88"}.ez-icon-table:before{content:"\\ea89"}.ez-icon-tag_code:before{content:"\\ea8a"}.ez-icon-text:before{content:"\\ea8b"}.ez-icon-timeline:before{content:"\\ea8c"}.ez-icon-timer-outline:before{content:"\\ea8d"}.ez-icon-trending-up:before{content:"\\ea8e"}.ez-icon-tune:before{content:"\\ea8f"}.ez-icon-txt:before{content:"\\ea90"}.ez-icon-un-pin:before{content:"\\ea91"}.ez-icon-unfold_less:before{content:"\\ea92"}.ez-icon-unfold_more:before{content:"\\ea93"}.ez-icon-user-circle:before{content:"\\ea94"}.ez-icon-warning-outline:before{content:"\\ea95"}.ez-icon-warning_triangle:before{content:"\\ea96"}.ez-icon-whatshot:before{content:"\\ea97"}.ez-icon-xlsx:before{content:"\\ea98"}.ez-icon-zip:before{content:"\\ea99"}.x-small--font{font-size:12px}.small--font{font-size:16px}.medium--font{font-size:20px}.large--font{font-size:24px}.x-large--font{font-size:30px}';export{r as ez_icon}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as i,c as t,h as s,H as e,g as r}from"./p-23a36bb6.js";import{C as o}from"./p-7eb3e1a5.js";import{ObjectUtils as a,StringUtils as h,FloatingManager as l,ElementIDUtils as n}from"@sankhyalabs/core";import{A as c}from"./p-2187f86c.js";import"./p-ab574d59.js";import"./p-b853763b.js";import{R as d}from"./p-05e1f4e7.js";const u=class{constructor(s){i(this,s),this.ezChange=t(this,"ezChange",7),this._changeDeboucingTimeout=null,this._limitCharsToSearch=3,this._deboucingTime=300,this._maxWidthValue=0,this._tabPressed=!1,this._textEmptyList="Nenhum resultado encontrado",this._textEmptySearch="Nenhum resultado de {0} encontrado",this._lookupMode=!1,this._startHighlightTag="<span class='card-item__highlight'>",this._endHighlightTag="</span>",this._preSelection=void 0,this._visibleOptions=void 0,this._startLoading=!1,this._showLoading=!0,this._criteria=void 0,this.value=void 0,this.label=void 0,this.enabled=!0,this.errorMessage=void 0,this.optionLoader=void 0,this.showSelectedValue=!0,this.showOptionValue=!0,this.suppressEmptyOption=!1,this.mode="regular",this.canShowError=!0,this.hideErrorOnFocusOut=!0,this.listOptionsPosition=void 0,this.isTextSearch=!1,this.ignoreLimitCharsToSearch=!1,this.options=void 0,this.suppressSearch=!1}observeErrorMessage(){var i;this._textInput&&(this._textInput.errorMessage=this.errorMessage,(null===(i=this.errorMessage)||void 0===i?void 0:i.trim())||this.setInputValue())}observeValue(i,t){if(this._textInput&&i!=t)try{if("string"===i)return void this.setInputValue();const s=this.getSelectedOption(i),e=this.getSelectedOption(t),r=this.getSelectedOption(this.value);this.isDifferentValues(r,s)&&(this.value=s),this.isDifferentValues(s,e)&&(this.setInputValue(),this._lookupMode||this.ezChange.emit(null===s?void 0:s)),this.resetOptions()}finally{this._lookupMode=!1}}observeOptions(i,t){(null==i?void 0:i.join(""))!==(null==t?void 0:t.join(""))&&this.loadOptions(v.PRELOAD)}async getValueAsync(){return new Promise(this._showLoading?i=>{let t=setInterval((()=>{this._showLoading||(clearInterval(t),i(this.value))}),100)}:i=>i(this.value))}async setFocus(){this._textInput&&this._textInput.setFocus()}async setBlur(){this._textInput&&this._textInput.setBlur()}async isInvalid(){return"string"==typeof this.errorMessage&&""!==this.errorMessage.trim()}async clearValue(){this.clearSearch()}scrollListener(){var i;null!=this._floatingID&&((null===(i=this.listOptionsPosition)||void 0===i?void 0:i.hardPosition)?this.hideOptions():window.requestAnimationFrame((()=>{this.updateListPosition()})))}updateListPosition(){let{verticalPosition:i,horizontalPosition:t,fromBottom:s,fromRight:e,bottomLimit:r,hardPosition:o}=this.getListPosition();const a=this._listWrapper.getBoundingClientRect(),h=this._listContainer.getBoundingClientRect(),l=this._textInput.getBoundingClientRect(),n=r||window.innerHeight;!s&&(a.top<0||h.bottom+a.height>n)&&(s=!0),o||(i=i||0,t=t||0,s?i=window.innerHeight-l.top+i:i+=h.top,e?t=window.innerWidth-l.right+t:t+=h.left),null!=i&&(this._listWrapper.style[s?"bottom":"top"]=`${i}px`,this._listWrapper.style[s?"top":"bottom"]=""),null!=t&&(this._listWrapper.style[e?"right":"left"]=`${t}px`,this._listWrapper.style[e?"left":"right"]="")}getListPosition(){return this.listOptionsPosition?this.listOptionsPosition:{verticalPosition:this.errorMessage||!this.canShowError||"slim"===this.mode?6:-13}}isDifferentValues(i,t){return a.objectToString(i||{})!==a.objectToString(t||{})}getFormattedText(i){if(null!=i)return this.showSelectedValue&&null!=i.value?i.label?`${i.value} - ${i.label}`:i.value:i.label}getText(){const i=this.getSelectedOption(this.value),t=this.getFormattedText(i);if(null!=t)return String(t).replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,'"')}getSelectedOption(i){return"string"==typeof i||i instanceof String?this._visibleOptions.find((t=>t.value===i)):i}updateVisibleOptions(){let i=this._source||[];this._visibleOptions=this.suppressEmptyOption?i:[{value:void 0,label:""}].concat(i),this._maxWidthValue=this.getMaxWidthValue()}getMaxWidthValue(){var i;const t=[];return null===(i=this._visibleOptions)||void 0===i||i.forEach((i=>{const s=this.getWidthValue(i.value);t.includes(s)||t.push(s)})),t.length>1?Math.max(...t):0}getWidthValue(i){if(null!=this._itemValueBasis){const t=this._itemValueBasis;if(null!=i)return t.innerHTML=i,t.clientWidth>0?t.clientWidth+2:0;t.innerHTML=""}return 0}createOption(i){let{key:t,title:s}=i;const e=new RegExp(this._startHighlightTag,"g"),r=new RegExp(this._endHighlightTag,"g");s=h.decodeHtmlEntities(s);const o={value:null==t?void 0:t.replace(e,"").replace(r,""),label:null==s?void 0:s.replace(e,"").replace(r,"")};this.selectOption(o)}buildItem(i,t){i.label=i.label||i.value;const e={key:i.value,title:i.label,details:i.details};return s("div",{style:{height:"100%"},onMouseDown:()=>this.createOption(e),onMouseOver:()=>this._preSelection=t},s("ez-card-item",{item:e}))}showOptions(){this.enabled&&(this.isOptionsVisible()||(this._resizeObserver&&this._resizeObserver.observe(this._textInput),this._floatingID=l.float(this._listWrapper,this._listContainer,{autoClose:!1,isFixed:!0,backClickListener:()=>this.hideOptions()}),this.setFocus(),window.requestAnimationFrame((()=>{this.updateListPosition(),this.listOptionsPosition||this._listWrapper.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})}))))}hideOptions(){void 0!==this._floatingID&&l.close(this._floatingID),this._floatingID=void 0,this._resizeObserver&&this._resizeObserver.unobserve(this._textInput)}isOptionsVisible(){return void 0!==this._floatingID&&l.isFloating(this._floatingID)}nextOption(){this.isOptionsVisible()&&(this.showOptions(),this._preSelection=void 0===this._preSelection?0:Math.min(this._preSelection+1,this._visibleOptions.length-1),this.scrollToOption(this._visibleOptions[this._preSelection]))}previousOption(){this._preSelection=void 0===this._preSelection?0:Math.max(this._preSelection-1,0),this.scrollToOption(this._visibleOptions[this._preSelection])}scrollToOption(i){window.requestAnimationFrame((()=>{const t=(null==i?void 0:i.value)?this._optionsList.querySelector(`li#item_${i.value.replace(/[<>\[\]#=]/g,"\\$&").replace(/:/g,"\\:")}`):void 0;t&&t.scrollIntoView({behavior:"smooth",block:"nearest"})}))}selectCurrentOption(){void 0!==this._preSelection?(this.selectOption(this._visibleOptions[this._preSelection]),this._preSelection=void 0):this.controlListWithOnlyOne()}updateSource(i){this._startLoading=!1,i instanceof Promise?(this._showLoading=!0,i.then((i=>{this._showLoading=!1,this.updateSource(i)})).catch((()=>this._showLoading=!1)),this.updateVisibleOptions()):(this._showLoading=!1,Array.isArray(i)?(this._source=i,this.updateVisibleOptions(),this._tabPressed&&(this._tabPressed=!1,this.controlEmptySearch())):this.selectOption(i))}clearSource(){this._source=[],this.updateVisibleOptions()}selectOption(i){var t,s;const e=this.getSelectedOption(this.value);(null===(t=null==e?void 0:e.value)||void 0===t?void 0:t.toString())!==(null===(s=null==i?void 0:i.value)||void 0===s?void 0:s.toString())||null==e&&null!=i&&"value"in i?this.value=(null==i?void 0:i.value)?i:void 0:this.resetOptions(),this._visibleOptions=[],this.clearSource()}loadOptions(i,t=""){this._criteria=t,this._startLoading=!0,this.updateSource(this.optionLoader?this.optionLoader({mode:i,argument:t}):this.options)}cancelPreselection(){!this._textInput.value&&this.value?this.selectOption(void 0):window.setTimeout((()=>{this.setInputValue()}),this._deboucingTime),this.resetOptions()}setInputValue(i=!0){const t=this.getText();(this._textInput.value||"")!==t&&(this._textInput.value=t,i&&(this.errorMessage=null))}clearSearch(){this.value=null}controlListWithOnlyOne(){var i,t;const s=null===(i=this._visibleOptions)||void 0===i?void 0:i.filter((i=>""!==i.label&&null!=i.value));if((null==s?void 0:s.length)>0){const i=new RegExp(this._startHighlightTag,"g"),e=new RegExp(this._endHighlightTag,"g");let r=h.decodeHtmlEntities(s[0].label);const o={value:null===(t=s[0].value)||void 0===t?void 0:t.replace(i,"").replace(e,""),label:null==r?void 0:r.replace(i,"").replace(e,"")};this.selectOption(o)}}controlEmptySearch(){var i;(null===(i=this._visibleOptions)||void 0===i?void 0:i.length)?this.controlListWithOnlyOne():(this.clearSearch(),c.info(this._textEmptyList))}validateDescriptionValue(){if(h.isEmpty(this.value))return;let i=this.value;"object"!=typeof i&&(h.isEmpty(i)||this.loadDescriptionValue(i))}async loadDescriptionValue(i){var t,s;if(null==i)return;if((null===(t=this.options)||void 0===t?void 0:t.length)>0)return void this.loadOptionValue(i);const e={mode:v.PREDICTIVE,argument:i},r=await(null===(s=this.optionLoader)||void 0===s?void 0:s.call(this,e));null!=r&&(r instanceof Promise?r.then((i=>{this.setDescriptionValue(i)})):this.setDescriptionValue(r))}setDescriptionValue(i){const t=(null==i?void 0:i[0])||i;null!=t&&Object.keys(t).length?(this._lookupMode=!0,this.value=t):this.showNoResultMessage()}loadOptionValue(i){var t;const s=null===(t=this.options)||void 0===t?void 0:t.find((t=>t.value===i));null!=s?this.selectOption(s):this.showNoResultMessage()}async showNoResultMessage(){this.clearSearch(),c.info(this._textEmptySearch.replace("{0}",this.getFieldLabel()))}getFieldLabel(){var i;return null===(i=this.label)||void 0===i?void 0:i.replace(d,"").toUpperCase()}resetOptions(){this.hideOptions(),this._criteria=void 0,this._preSelection=void 0,this.updateVisibleOptions()}componentWillLoad(){if(void 0===this.options){this.options=[];const i=this.el.querySelectorAll("option");i&&i.forEach((i=>{let t=i.innerText,s=i.getAttribute("value"),e=i.getAttribute("details");s||(s=t),this.options.push({label:t,value:s,details:e}),i.hidden=!0}))}this.updateSource([])}componentDidRender(){var i;void 0===this._floatingID&&this._listWrapper.remove(),null===(i=this._optionsList)||void 0===i||i.querySelectorAll(".item").forEach((i=>{n.addIDInfoIfNotExists(i,"itemSearch")})),this.validateDescriptionValue()}componentDidLoad(){o.applyVarsTextInput(this.el,this._textInput),this.setInputValue(!1),this._resizeObserver=new ResizeObserver((i=>{window.requestAnimationFrame((()=>{if(!Array.isArray(i)||!i.length)return;const{clientWidth:t}=this._listContainer;t>0&&this._listWrapper&&(this._listWrapper.style.width=`${t}px`)}))}))}handlerIconClick(){this.loadOptions(v.ADVANCED)}buildNumberArgument(i){return this.isTextSearch?NaN:Number(i||void 0)}onTextInputChangeHandler(i){var t;if(this.clearDeboucingTimeout(),this._startLoading)return void(this._changeDeboucingTimeout=window.setTimeout((()=>{this.onTextInputChangeHandler(i)}),this._deboucingTime));const s=null===(t=i.target.value)||void 0===t?void 0:t.trim(),e=this.buildNumberArgument(s);this._criteria||(this._textInput.value=i.data||s),this._criteria=s,s?(this._showLoading=!1,this.clearSource(),!isNaN(e)||s.length>=this._limitCharsToSearch?(this._showLoading=!0,this._changeDeboucingTimeout=window.setTimeout((()=>{this.loadOptions(v.PREDICTIVE,isNaN(e)?s:e.toString())}),this._deboucingTime),this.showOptions()):this.hideOptions()):(this.hideOptions(),this._showLoading=!1,this.clearSource())}clearDeboucingTimeout(){this._changeDeboucingTimeout&&(window.clearTimeout(this._changeDeboucingTimeout),this._changeDeboucingTimeout=null)}keyDownHandler(i){switch(this._tabPressed=!1,i.ctrlKey&&("f"!==i.key&&"F"!==i.key||(this.loadOptions(v.ADVANCED),i.stopPropagation(),i.stopImmediatePropagation(),i.preventDefault())),i.key){case"ArrowDown":this.nextOption(),i.stopPropagation();break;case"ArrowUp":this.previousOption(),i.stopPropagation();break;case"Enter":this.selectCurrentOption();break;case"Escape":this.cancelPreselection();break;case"Tab":this._tabPressed=!0,this.controlListWithOnlyOne()}}onTextInputFocusOutHandler(){this.hideErrorOnFocusOut&&this.cancelPreselection()}canShowListOptions(){return!this._showLoading&&this._visibleOptions.length>0}render(){var i;return n.addIDInfoIfNotExists(this.el,"input"),s(e,null,s("ez-text-input",{"data-element-id":n.getInternalIDInfo("textInput"),class:this.suppressSearch?"suppressed-search-input":"",ref:i=>this._textInput=i,"data-slave-mode":"true",enabled:this.enabled&&!this.suppressSearch,onInput:i=>this.onTextInputChangeHandler(i),onFocusout:()=>this.onTextInputFocusOutHandler(),onKeyDown:i=>this.keyDownHandler(i),label:this.label,canShowError:this.canShowError,errorMessage:this.errorMessage,mode:this.mode},s("button",{class:"btn",slot:"leftIcon",disabled:!this.enabled,tabindex:-1,onClick:()=>this.handlerIconClick()},s("ez-icon",{iconName:"search"})),(null===(i=this._textInput)||void 0===i?void 0:i.value)&&(this._criteria||this.value)?s("button",{class:"btn btn__close",slot:"rightIcon",disabled:!this.enabled,tabindex:-1,onClick:()=>this.clearSearch()},s("ez-icon",{iconName:"close"})):void 0),s("section",{class:"list-container",ref:i=>this._listContainer=i},s("div",{class:"list-wrapper",ref:i=>this._listWrapper=i},s("ul",{class:"list-options",ref:i=>this._optionsList=i},!this._showLoading&&0===this._visibleOptions.length&&s("div",{class:"message"},s("span",{class:"message__no-result"},this._textEmptyList)),this._showLoading&&s("div",{class:"message"},s("div",{class:"message__loading"})),s("span",{class:"item__value item__value--hidden",ref:i=>this._itemValueBasis=i}),this.canShowListOptions()&&this._visibleOptions.map(((i,t)=>this.buildItem(i,t)))))))}get el(){return r(this)}static get watchers(){return{errorMessage:["observeErrorMessage"],value:["observeValue"],options:["observeOptions"]}}};var v;!function(i){i.ADVANCED="ADVANCED",i.PRELOAD="PRELOAD",i.PREDICTIVE="PREDICTIVE"}(v||(v={})),u.style=":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)}}";export{u as ez_search}
|