@sankhyalabs/ezui 5.18.0-dev.2 → 5.18.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-alert-list.cjs.entry.js +78 -22
- package/dist/collection/components/ez-alert-list/ez-alert-list.css +15 -1
- package/dist/collection/components/ez-alert-list/ez-alert-list.js +80 -22
- package/dist/custom-elements/index.js +78 -22
- package/dist/esm/ez-alert-list.entry.js +78 -22
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-d5ac1911.entry.js +1 -0
- package/dist/types/components/ez-alert-list/ez-alert-list.d.ts +32 -3
- package/package.json +1 -1
- package/dist/ezui/p-59bcb27c.entry.js +0 -1
|
@@ -5,14 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-1064511f.js');
|
|
6
6
|
const core = require('@sankhyalabs/core');
|
|
7
7
|
|
|
8
|
-
const ezAlertListCss = ":host{display:flex
|
|
8
|
+
const ezAlertListCss = ":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";
|
|
9
9
|
|
|
10
10
|
const EzAlertList = class {
|
|
11
11
|
constructor(hostRef) {
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
13
|
this.alerts = [];
|
|
14
14
|
this.enableDragAndDrop = undefined;
|
|
15
|
-
this.enableExpand =
|
|
15
|
+
this.enableExpand = true;
|
|
16
16
|
this.itemRightSlotBuilder = undefined;
|
|
17
17
|
this.opened = true;
|
|
18
18
|
this.expanded = false;
|
|
@@ -20,23 +20,92 @@ const EzAlertList = class {
|
|
|
20
20
|
observeOpened() {
|
|
21
21
|
this.manageOverlay();
|
|
22
22
|
}
|
|
23
|
+
/**
|
|
24
|
+
* Retorna o id do alerta a partir do título e do índice.
|
|
25
|
+
*/
|
|
26
|
+
alertId(title, index) {
|
|
27
|
+
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
28
|
+
return `alert-${index}-${concatTitle(title)}`;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Retorna o título do alerta a partir do id.
|
|
32
|
+
*/
|
|
33
|
+
getAlertTitle(id) {
|
|
34
|
+
var _a;
|
|
35
|
+
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Retorna o texto do título do alerta.
|
|
39
|
+
*/
|
|
40
|
+
getTitleText(item) {
|
|
41
|
+
var _a;
|
|
42
|
+
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
43
|
+
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* Gerencia a exibição do conteúdo expandido.
|
|
47
|
+
*/
|
|
48
|
+
toggleExpandContainer() {
|
|
49
|
+
if (!this.enableExpand) {
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
this.expanded = !this.expanded;
|
|
53
|
+
this._container.classList.toggle('expanded', this.expanded);
|
|
54
|
+
if (this.expanded) {
|
|
55
|
+
this.updatePosition(this.getBoundingRight(), this.getBoundingBottom());
|
|
56
|
+
}
|
|
57
|
+
else {
|
|
58
|
+
this.updatePosition(`10px`, `10px`);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
23
61
|
/**
|
|
24
62
|
* Gerencia a exibição do overlay usando FloatingManager do Core.
|
|
25
63
|
*/
|
|
26
64
|
async manageOverlay() {
|
|
27
65
|
if (this.opened) {
|
|
28
|
-
this._overlayId = core.FloatingManager.float(this._container, this._overlayRef,
|
|
29
|
-
autoClose: false,
|
|
30
|
-
isFixed: !this.enableDragAndDrop,
|
|
31
|
-
bottom: '10px',
|
|
32
|
-
right: '10px'
|
|
33
|
-
});
|
|
66
|
+
this._overlayId = core.FloatingManager.float(this._container, this._overlayRef, this.getFloatOptions());
|
|
34
67
|
}
|
|
35
68
|
else {
|
|
36
69
|
core.FloatingManager.close(this._overlayId);
|
|
37
70
|
this._overlayId = undefined;
|
|
38
71
|
}
|
|
39
72
|
}
|
|
73
|
+
/**
|
|
74
|
+
* Atualiza a posição da lista.
|
|
75
|
+
*/
|
|
76
|
+
updatePosition(right, bottom) {
|
|
77
|
+
core.FloatingManager.updateFloatPosition(this._container, this._overlayRef, Object.assign(Object.assign({}, this.getFloatOptions()), { right,
|
|
78
|
+
bottom }));
|
|
79
|
+
}
|
|
80
|
+
;
|
|
81
|
+
/**
|
|
82
|
+
* Retorna valores padrões do componente
|
|
83
|
+
*/
|
|
84
|
+
getFloatOptions() {
|
|
85
|
+
return {
|
|
86
|
+
autoClose: false,
|
|
87
|
+
isFixed: false,
|
|
88
|
+
bottom: '10px',
|
|
89
|
+
right: '10px',
|
|
90
|
+
};
|
|
91
|
+
}
|
|
92
|
+
;
|
|
93
|
+
/**
|
|
94
|
+
* Retorna o valor para o alinhamento horizontal do componente.
|
|
95
|
+
*/
|
|
96
|
+
getBoundingRight() {
|
|
97
|
+
const docWidth = document.body.clientWidth;
|
|
98
|
+
const boxWidth = this._container.getBoundingClientRect().width;
|
|
99
|
+
return ((docWidth - boxWidth) / 2) + 'px';
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* Retorna o valor para o alinhamento vertical do componente.
|
|
103
|
+
*/
|
|
104
|
+
getBoundingBottom() {
|
|
105
|
+
const docHeight = document.body.clientHeight;
|
|
106
|
+
const boxHeight = this._container.getBoundingClientRect().height;
|
|
107
|
+
return ((docHeight - boxHeight) / 2) + 'px';
|
|
108
|
+
}
|
|
40
109
|
componentDidRender() {
|
|
41
110
|
this.manageOverlay();
|
|
42
111
|
if (this.opened) {
|
|
@@ -46,21 +115,8 @@ const EzAlertList = class {
|
|
|
46
115
|
componentWillLoad() {
|
|
47
116
|
this.dataElementId = core.ElementIDUtils.addIDInfo(this._element, 'EzAlertList');
|
|
48
117
|
}
|
|
49
|
-
alertId(title, index) {
|
|
50
|
-
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
51
|
-
return `alert-${index}-${concatTitle(title)}`;
|
|
52
|
-
}
|
|
53
|
-
getAlertTitle(id) {
|
|
54
|
-
var _a;
|
|
55
|
-
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
56
|
-
}
|
|
57
|
-
getTitleText(item) {
|
|
58
|
-
var _a;
|
|
59
|
-
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
60
|
-
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
61
|
-
}
|
|
62
118
|
render() {
|
|
63
|
-
return (index.h(index.Host, Object.assign({}, { [core.ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), index.h("div", { ref: elem => (this._overlayRef = elem) }, index.h("div", { class:
|
|
119
|
+
return (index.h(index.Host, Object.assign({}, { [core.ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), index.h("div", { ref: elem => (this._overlayRef = elem) }, index.h("div", { class: `alert-list__container ${this.expanded ? 'expanded' : ''}`, ref: elem => (this._container = elem) }, index.h("div", { class: "alert-list__content" }, index.h("div", { class: "alert-list__header" }, index.h("div", { class: "alert-list__title" }, `Avisos (${this.alerts.length})`), index.h("div", { class: "alert-list__header__buttons" }, this.enableExpand && (index.h("ez-button", { mode: "icon", size: "small", iconName: "expand", onClick: () => this.toggleExpandContainer(), "data-element-id": core.ElementIDUtils.getInternalIDInfo('expandButton'), title: this.expanded ? 'Resumir' : 'Expandir' })), index.h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": core.ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
|
|
64
120
|
this.opened = false;
|
|
65
121
|
}, title: 'Fechar' }))), index.h("div", { class: "alert-list__expandable-content" }, index.h("ez-list", { hoverFeedback: true, itemLeftSlotBuilder: item => {
|
|
66
122
|
return (index.h("a", { href: "#", style: {
|
|
@@ -7,6 +7,11 @@
|
|
|
7
7
|
--ez-alert-list__container--width: 680px;
|
|
8
8
|
/*@doc Define a altura da lista minimizado */
|
|
9
9
|
--ez-alert-list__container--height: 220px;
|
|
10
|
+
|
|
11
|
+
/*@doc Define a largura da lista maximizada */
|
|
12
|
+
--ez-alert-list__container--width--expanded: 920px;
|
|
13
|
+
/*@doc Define a altura da lista maximizada */
|
|
14
|
+
--ez-alert-list__container--height--expanded: 540px;
|
|
10
15
|
|
|
11
16
|
/* Title */
|
|
12
17
|
/*@doc Define a fonte do título do componente */
|
|
@@ -44,7 +49,16 @@
|
|
|
44
49
|
width: var(--ez-alert-list__container--width);
|
|
45
50
|
border-radius: var(--border--radius-medium);
|
|
46
51
|
background-color: var(--background--xlight);
|
|
47
|
-
box-shadow:
|
|
52
|
+
box-shadow: var(--shadow--medium);
|
|
53
|
+
|
|
54
|
+
&.expanded {
|
|
55
|
+
height: var(--ez-alert-list__container--height--expanded);
|
|
56
|
+
width: var(--ez-alert-list__container--width--expanded);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
@media (max-height: 640px) {
|
|
60
|
+
max-height: calc(100vh - var(--space--3xl));
|
|
61
|
+
}
|
|
48
62
|
}
|
|
49
63
|
|
|
50
64
|
.alert-list__header {
|
|
@@ -4,7 +4,7 @@ export class EzAlertList {
|
|
|
4
4
|
constructor() {
|
|
5
5
|
this.alerts = [];
|
|
6
6
|
this.enableDragAndDrop = undefined;
|
|
7
|
-
this.enableExpand =
|
|
7
|
+
this.enableExpand = true;
|
|
8
8
|
this.itemRightSlotBuilder = undefined;
|
|
9
9
|
this.opened = true;
|
|
10
10
|
this.expanded = false;
|
|
@@ -12,23 +12,93 @@ export class EzAlertList {
|
|
|
12
12
|
observeOpened() {
|
|
13
13
|
this.manageOverlay();
|
|
14
14
|
}
|
|
15
|
+
/**
|
|
16
|
+
* Retorna o id do alerta a partir do título e do índice.
|
|
17
|
+
*/
|
|
18
|
+
alertId(title, index) {
|
|
19
|
+
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
20
|
+
return `alert-${index}-${concatTitle(title)}`;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Retorna o título do alerta a partir do id.
|
|
24
|
+
*/
|
|
25
|
+
getAlertTitle(id) {
|
|
26
|
+
var _a;
|
|
27
|
+
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
28
|
+
}
|
|
29
|
+
/**
|
|
30
|
+
* Retorna o texto do título do alerta.
|
|
31
|
+
*/
|
|
32
|
+
getTitleText(item) {
|
|
33
|
+
var _a;
|
|
34
|
+
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
35
|
+
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Gerencia a exibição do conteúdo expandido.
|
|
39
|
+
*/
|
|
40
|
+
toggleExpandContainer() {
|
|
41
|
+
if (!this.enableExpand) {
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
;
|
|
45
|
+
this.expanded = !this.expanded;
|
|
46
|
+
this._container.classList.toggle('expanded', this.expanded);
|
|
47
|
+
if (this.expanded) {
|
|
48
|
+
this.updatePosition(this.getBoundingRight(), this.getBoundingBottom());
|
|
49
|
+
}
|
|
50
|
+
else {
|
|
51
|
+
this.updatePosition(`10px`, `10px`);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
15
54
|
/**
|
|
16
55
|
* Gerencia a exibição do overlay usando FloatingManager do Core.
|
|
17
56
|
*/
|
|
18
57
|
async manageOverlay() {
|
|
19
58
|
if (this.opened) {
|
|
20
|
-
this._overlayId = FloatingManager.float(this._container, this._overlayRef,
|
|
21
|
-
autoClose: false,
|
|
22
|
-
isFixed: !this.enableDragAndDrop,
|
|
23
|
-
bottom: '10px',
|
|
24
|
-
right: '10px'
|
|
25
|
-
});
|
|
59
|
+
this._overlayId = FloatingManager.float(this._container, this._overlayRef, this.getFloatOptions());
|
|
26
60
|
}
|
|
27
61
|
else {
|
|
28
62
|
FloatingManager.close(this._overlayId);
|
|
29
63
|
this._overlayId = undefined;
|
|
30
64
|
}
|
|
31
65
|
}
|
|
66
|
+
/**
|
|
67
|
+
* Atualiza a posição da lista.
|
|
68
|
+
*/
|
|
69
|
+
updatePosition(right, bottom) {
|
|
70
|
+
FloatingManager.updateFloatPosition(this._container, this._overlayRef, Object.assign(Object.assign({}, this.getFloatOptions()), { right,
|
|
71
|
+
bottom }));
|
|
72
|
+
}
|
|
73
|
+
;
|
|
74
|
+
/**
|
|
75
|
+
* Retorna valores padrões do componente
|
|
76
|
+
*/
|
|
77
|
+
getFloatOptions() {
|
|
78
|
+
return {
|
|
79
|
+
autoClose: false,
|
|
80
|
+
isFixed: false,
|
|
81
|
+
bottom: '10px',
|
|
82
|
+
right: '10px',
|
|
83
|
+
};
|
|
84
|
+
}
|
|
85
|
+
;
|
|
86
|
+
/**
|
|
87
|
+
* Retorna o valor para o alinhamento horizontal do componente.
|
|
88
|
+
*/
|
|
89
|
+
getBoundingRight() {
|
|
90
|
+
const docWidth = document.body.clientWidth;
|
|
91
|
+
const boxWidth = this._container.getBoundingClientRect().width;
|
|
92
|
+
return ((docWidth - boxWidth) / 2) + 'px';
|
|
93
|
+
}
|
|
94
|
+
/**
|
|
95
|
+
* Retorna o valor para o alinhamento vertical do componente.
|
|
96
|
+
*/
|
|
97
|
+
getBoundingBottom() {
|
|
98
|
+
const docHeight = document.body.clientHeight;
|
|
99
|
+
const boxHeight = this._container.getBoundingClientRect().height;
|
|
100
|
+
return ((docHeight - boxHeight) / 2) + 'px';
|
|
101
|
+
}
|
|
32
102
|
componentDidRender() {
|
|
33
103
|
this.manageOverlay();
|
|
34
104
|
if (this.opened) {
|
|
@@ -38,21 +108,8 @@ export class EzAlertList {
|
|
|
38
108
|
componentWillLoad() {
|
|
39
109
|
this.dataElementId = ElementIDUtils.addIDInfo(this._element, 'EzAlertList');
|
|
40
110
|
}
|
|
41
|
-
alertId(title, index) {
|
|
42
|
-
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
43
|
-
return `alert-${index}-${concatTitle(title)}`;
|
|
44
|
-
}
|
|
45
|
-
getAlertTitle(id) {
|
|
46
|
-
var _a;
|
|
47
|
-
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
48
|
-
}
|
|
49
|
-
getTitleText(item) {
|
|
50
|
-
var _a;
|
|
51
|
-
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
52
|
-
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
53
|
-
}
|
|
54
111
|
render() {
|
|
55
|
-
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class:
|
|
112
|
+
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class: `alert-list__container ${this.expanded ? 'expanded' : ''}`, ref: elem => (this._container = elem) }, h("div", { class: "alert-list__content" }, h("div", { class: "alert-list__header" }, h("div", { class: "alert-list__title" }, `Avisos (${this.alerts.length})`), h("div", { class: "alert-list__header__buttons" }, this.enableExpand && (h("ez-button", { mode: "icon", size: "small", iconName: "expand", onClick: () => this.toggleExpandContainer(), "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), title: this.expanded ? 'Resumir' : 'Expandir' })), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
|
|
56
113
|
this.opened = false;
|
|
57
114
|
}, title: 'Fechar' }))), h("div", { class: "alert-list__expandable-content" }, h("ez-list", { hoverFeedback: true, itemLeftSlotBuilder: item => {
|
|
58
115
|
return (h("a", { href: "#", style: {
|
|
@@ -140,7 +197,8 @@ export class EzAlertList {
|
|
|
140
197
|
"text": "Define se o componente pode ser expandido."
|
|
141
198
|
},
|
|
142
199
|
"attribute": "enable-expand",
|
|
143
|
-
"reflect": true
|
|
200
|
+
"reflect": true,
|
|
201
|
+
"defaultValue": "true"
|
|
144
202
|
},
|
|
145
203
|
"itemRightSlotBuilder": {
|
|
146
204
|
"type": "unknown",
|
|
@@ -1113,7 +1113,7 @@ const EzAlert$1 = class extends HTMLElement$1 {
|
|
|
1113
1113
|
static get style() { return ezAlertCss; }
|
|
1114
1114
|
};
|
|
1115
1115
|
|
|
1116
|
-
const ezAlertListCss = ":host{display:flex
|
|
1116
|
+
const ezAlertListCss = ":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";
|
|
1117
1117
|
|
|
1118
1118
|
const EzAlertList$1 = class extends HTMLElement$1 {
|
|
1119
1119
|
constructor() {
|
|
@@ -1122,7 +1122,7 @@ const EzAlertList$1 = class extends HTMLElement$1 {
|
|
|
1122
1122
|
this.__attachShadow();
|
|
1123
1123
|
this.alerts = [];
|
|
1124
1124
|
this.enableDragAndDrop = undefined;
|
|
1125
|
-
this.enableExpand =
|
|
1125
|
+
this.enableExpand = true;
|
|
1126
1126
|
this.itemRightSlotBuilder = undefined;
|
|
1127
1127
|
this.opened = true;
|
|
1128
1128
|
this.expanded = false;
|
|
@@ -1130,23 +1130,92 @@ const EzAlertList$1 = class extends HTMLElement$1 {
|
|
|
1130
1130
|
observeOpened() {
|
|
1131
1131
|
this.manageOverlay();
|
|
1132
1132
|
}
|
|
1133
|
+
/**
|
|
1134
|
+
* Retorna o id do alerta a partir do título e do índice.
|
|
1135
|
+
*/
|
|
1136
|
+
alertId(title, index) {
|
|
1137
|
+
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
1138
|
+
return `alert-${index}-${concatTitle(title)}`;
|
|
1139
|
+
}
|
|
1140
|
+
/**
|
|
1141
|
+
* Retorna o título do alerta a partir do id.
|
|
1142
|
+
*/
|
|
1143
|
+
getAlertTitle(id) {
|
|
1144
|
+
var _a;
|
|
1145
|
+
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
1146
|
+
}
|
|
1147
|
+
/**
|
|
1148
|
+
* Retorna o texto do título do alerta.
|
|
1149
|
+
*/
|
|
1150
|
+
getTitleText(item) {
|
|
1151
|
+
var _a;
|
|
1152
|
+
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
1153
|
+
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
1154
|
+
}
|
|
1155
|
+
/**
|
|
1156
|
+
* Gerencia a exibição do conteúdo expandido.
|
|
1157
|
+
*/
|
|
1158
|
+
toggleExpandContainer() {
|
|
1159
|
+
if (!this.enableExpand) {
|
|
1160
|
+
return;
|
|
1161
|
+
}
|
|
1162
|
+
this.expanded = !this.expanded;
|
|
1163
|
+
this._container.classList.toggle('expanded', this.expanded);
|
|
1164
|
+
if (this.expanded) {
|
|
1165
|
+
this.updatePosition(this.getBoundingRight(), this.getBoundingBottom());
|
|
1166
|
+
}
|
|
1167
|
+
else {
|
|
1168
|
+
this.updatePosition(`10px`, `10px`);
|
|
1169
|
+
}
|
|
1170
|
+
}
|
|
1133
1171
|
/**
|
|
1134
1172
|
* Gerencia a exibição do overlay usando FloatingManager do Core.
|
|
1135
1173
|
*/
|
|
1136
1174
|
async manageOverlay() {
|
|
1137
1175
|
if (this.opened) {
|
|
1138
|
-
this._overlayId = FloatingManager.float(this._container, this._overlayRef,
|
|
1139
|
-
autoClose: false,
|
|
1140
|
-
isFixed: !this.enableDragAndDrop,
|
|
1141
|
-
bottom: '10px',
|
|
1142
|
-
right: '10px'
|
|
1143
|
-
});
|
|
1176
|
+
this._overlayId = FloatingManager.float(this._container, this._overlayRef, this.getFloatOptions());
|
|
1144
1177
|
}
|
|
1145
1178
|
else {
|
|
1146
1179
|
FloatingManager.close(this._overlayId);
|
|
1147
1180
|
this._overlayId = undefined;
|
|
1148
1181
|
}
|
|
1149
1182
|
}
|
|
1183
|
+
/**
|
|
1184
|
+
* Atualiza a posição da lista.
|
|
1185
|
+
*/
|
|
1186
|
+
updatePosition(right, bottom) {
|
|
1187
|
+
FloatingManager.updateFloatPosition(this._container, this._overlayRef, Object.assign(Object.assign({}, this.getFloatOptions()), { right,
|
|
1188
|
+
bottom }));
|
|
1189
|
+
}
|
|
1190
|
+
;
|
|
1191
|
+
/**
|
|
1192
|
+
* Retorna valores padrões do componente
|
|
1193
|
+
*/
|
|
1194
|
+
getFloatOptions() {
|
|
1195
|
+
return {
|
|
1196
|
+
autoClose: false,
|
|
1197
|
+
isFixed: false,
|
|
1198
|
+
bottom: '10px',
|
|
1199
|
+
right: '10px',
|
|
1200
|
+
};
|
|
1201
|
+
}
|
|
1202
|
+
;
|
|
1203
|
+
/**
|
|
1204
|
+
* Retorna o valor para o alinhamento horizontal do componente.
|
|
1205
|
+
*/
|
|
1206
|
+
getBoundingRight() {
|
|
1207
|
+
const docWidth = document.body.clientWidth;
|
|
1208
|
+
const boxWidth = this._container.getBoundingClientRect().width;
|
|
1209
|
+
return ((docWidth - boxWidth) / 2) + 'px';
|
|
1210
|
+
}
|
|
1211
|
+
/**
|
|
1212
|
+
* Retorna o valor para o alinhamento vertical do componente.
|
|
1213
|
+
*/
|
|
1214
|
+
getBoundingBottom() {
|
|
1215
|
+
const docHeight = document.body.clientHeight;
|
|
1216
|
+
const boxHeight = this._container.getBoundingClientRect().height;
|
|
1217
|
+
return ((docHeight - boxHeight) / 2) + 'px';
|
|
1218
|
+
}
|
|
1150
1219
|
componentDidRender() {
|
|
1151
1220
|
this.manageOverlay();
|
|
1152
1221
|
if (this.opened) {
|
|
@@ -1156,21 +1225,8 @@ const EzAlertList$1 = class extends HTMLElement$1 {
|
|
|
1156
1225
|
componentWillLoad() {
|
|
1157
1226
|
this.dataElementId = ElementIDUtils.addIDInfo(this._element, 'EzAlertList');
|
|
1158
1227
|
}
|
|
1159
|
-
alertId(title, index) {
|
|
1160
|
-
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
1161
|
-
return `alert-${index}-${concatTitle(title)}`;
|
|
1162
|
-
}
|
|
1163
|
-
getAlertTitle(id) {
|
|
1164
|
-
var _a;
|
|
1165
|
-
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
1166
|
-
}
|
|
1167
|
-
getTitleText(item) {
|
|
1168
|
-
var _a;
|
|
1169
|
-
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
1170
|
-
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
1171
|
-
}
|
|
1172
1228
|
render() {
|
|
1173
|
-
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class:
|
|
1229
|
+
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class: `alert-list__container ${this.expanded ? 'expanded' : ''}`, ref: elem => (this._container = elem) }, h("div", { class: "alert-list__content" }, h("div", { class: "alert-list__header" }, h("div", { class: "alert-list__title" }, `Avisos (${this.alerts.length})`), h("div", { class: "alert-list__header__buttons" }, this.enableExpand && (h("ez-button", { mode: "icon", size: "small", iconName: "expand", onClick: () => this.toggleExpandContainer(), "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), title: this.expanded ? 'Resumir' : 'Expandir' })), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
|
|
1174
1230
|
this.opened = false;
|
|
1175
1231
|
}, title: 'Fechar' }))), h("div", { class: "alert-list__expandable-content" }, h("ez-list", { hoverFeedback: true, itemLeftSlotBuilder: item => {
|
|
1176
1232
|
return (h("a", { href: "#", style: {
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host, g as getElement } from './index-296b8458.js';
|
|
2
2
|
import { FloatingManager, ElementIDUtils } from '@sankhyalabs/core';
|
|
3
3
|
|
|
4
|
-
const ezAlertListCss = ":host{display:flex
|
|
4
|
+
const ezAlertListCss = ":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";
|
|
5
5
|
|
|
6
6
|
const EzAlertList = class {
|
|
7
7
|
constructor(hostRef) {
|
|
8
8
|
registerInstance(this, hostRef);
|
|
9
9
|
this.alerts = [];
|
|
10
10
|
this.enableDragAndDrop = undefined;
|
|
11
|
-
this.enableExpand =
|
|
11
|
+
this.enableExpand = true;
|
|
12
12
|
this.itemRightSlotBuilder = undefined;
|
|
13
13
|
this.opened = true;
|
|
14
14
|
this.expanded = false;
|
|
@@ -16,23 +16,92 @@ const EzAlertList = class {
|
|
|
16
16
|
observeOpened() {
|
|
17
17
|
this.manageOverlay();
|
|
18
18
|
}
|
|
19
|
+
/**
|
|
20
|
+
* Retorna o id do alerta a partir do título e do índice.
|
|
21
|
+
*/
|
|
22
|
+
alertId(title, index) {
|
|
23
|
+
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
24
|
+
return `alert-${index}-${concatTitle(title)}`;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Retorna o título do alerta a partir do id.
|
|
28
|
+
*/
|
|
29
|
+
getAlertTitle(id) {
|
|
30
|
+
var _a;
|
|
31
|
+
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Retorna o texto do título do alerta.
|
|
35
|
+
*/
|
|
36
|
+
getTitleText(item) {
|
|
37
|
+
var _a;
|
|
38
|
+
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
39
|
+
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
40
|
+
}
|
|
41
|
+
/**
|
|
42
|
+
* Gerencia a exibição do conteúdo expandido.
|
|
43
|
+
*/
|
|
44
|
+
toggleExpandContainer() {
|
|
45
|
+
if (!this.enableExpand) {
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
48
|
+
this.expanded = !this.expanded;
|
|
49
|
+
this._container.classList.toggle('expanded', this.expanded);
|
|
50
|
+
if (this.expanded) {
|
|
51
|
+
this.updatePosition(this.getBoundingRight(), this.getBoundingBottom());
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
this.updatePosition(`10px`, `10px`);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
19
57
|
/**
|
|
20
58
|
* Gerencia a exibição do overlay usando FloatingManager do Core.
|
|
21
59
|
*/
|
|
22
60
|
async manageOverlay() {
|
|
23
61
|
if (this.opened) {
|
|
24
|
-
this._overlayId = FloatingManager.float(this._container, this._overlayRef,
|
|
25
|
-
autoClose: false,
|
|
26
|
-
isFixed: !this.enableDragAndDrop,
|
|
27
|
-
bottom: '10px',
|
|
28
|
-
right: '10px'
|
|
29
|
-
});
|
|
62
|
+
this._overlayId = FloatingManager.float(this._container, this._overlayRef, this.getFloatOptions());
|
|
30
63
|
}
|
|
31
64
|
else {
|
|
32
65
|
FloatingManager.close(this._overlayId);
|
|
33
66
|
this._overlayId = undefined;
|
|
34
67
|
}
|
|
35
68
|
}
|
|
69
|
+
/**
|
|
70
|
+
* Atualiza a posição da lista.
|
|
71
|
+
*/
|
|
72
|
+
updatePosition(right, bottom) {
|
|
73
|
+
FloatingManager.updateFloatPosition(this._container, this._overlayRef, Object.assign(Object.assign({}, this.getFloatOptions()), { right,
|
|
74
|
+
bottom }));
|
|
75
|
+
}
|
|
76
|
+
;
|
|
77
|
+
/**
|
|
78
|
+
* Retorna valores padrões do componente
|
|
79
|
+
*/
|
|
80
|
+
getFloatOptions() {
|
|
81
|
+
return {
|
|
82
|
+
autoClose: false,
|
|
83
|
+
isFixed: false,
|
|
84
|
+
bottom: '10px',
|
|
85
|
+
right: '10px',
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
;
|
|
89
|
+
/**
|
|
90
|
+
* Retorna o valor para o alinhamento horizontal do componente.
|
|
91
|
+
*/
|
|
92
|
+
getBoundingRight() {
|
|
93
|
+
const docWidth = document.body.clientWidth;
|
|
94
|
+
const boxWidth = this._container.getBoundingClientRect().width;
|
|
95
|
+
return ((docWidth - boxWidth) / 2) + 'px';
|
|
96
|
+
}
|
|
97
|
+
/**
|
|
98
|
+
* Retorna o valor para o alinhamento vertical do componente.
|
|
99
|
+
*/
|
|
100
|
+
getBoundingBottom() {
|
|
101
|
+
const docHeight = document.body.clientHeight;
|
|
102
|
+
const boxHeight = this._container.getBoundingClientRect().height;
|
|
103
|
+
return ((docHeight - boxHeight) / 2) + 'px';
|
|
104
|
+
}
|
|
36
105
|
componentDidRender() {
|
|
37
106
|
this.manageOverlay();
|
|
38
107
|
if (this.opened) {
|
|
@@ -42,21 +111,8 @@ const EzAlertList = class {
|
|
|
42
111
|
componentWillLoad() {
|
|
43
112
|
this.dataElementId = ElementIDUtils.addIDInfo(this._element, 'EzAlertList');
|
|
44
113
|
}
|
|
45
|
-
alertId(title, index) {
|
|
46
|
-
const concatTitle = (title) => { var _a; return (_a = title === null || title === void 0 ? void 0 : title.split(' ').join('-')) !== null && _a !== void 0 ? _a : ""; };
|
|
47
|
-
return `alert-${index}-${concatTitle(title)}`;
|
|
48
|
-
}
|
|
49
|
-
getAlertTitle(id) {
|
|
50
|
-
var _a;
|
|
51
|
-
return (_a = this.alerts.find((alert, index) => this.alertId(alert.title, index) === id)) === null || _a === void 0 ? void 0 : _a.title;
|
|
52
|
-
}
|
|
53
|
-
getTitleText(item) {
|
|
54
|
-
var _a;
|
|
55
|
-
const title = (_a = this.getAlertTitle(item.id)) !== null && _a !== void 0 ? _a : '';
|
|
56
|
-
return `${title}${(title && item.label) ? ':' : ''}`;
|
|
57
|
-
}
|
|
58
114
|
render() {
|
|
59
|
-
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class:
|
|
115
|
+
return (h(Host, Object.assign({}, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: this.dataElementId }), h("div", { ref: elem => (this._overlayRef = elem) }, h("div", { class: `alert-list__container ${this.expanded ? 'expanded' : ''}`, ref: elem => (this._container = elem) }, h("div", { class: "alert-list__content" }, h("div", { class: "alert-list__header" }, h("div", { class: "alert-list__title" }, `Avisos (${this.alerts.length})`), h("div", { class: "alert-list__header__buttons" }, this.enableExpand && (h("ez-button", { mode: "icon", size: "small", iconName: "expand", onClick: () => this.toggleExpandContainer(), "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), title: this.expanded ? 'Resumir' : 'Expandir' })), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
|
|
60
116
|
this.opened = false;
|
|
61
117
|
}, title: 'Fechar' }))), h("div", { class: "alert-list__expandable-content" }, h("ez-list", { hoverFeedback: true, itemLeftSlotBuilder: item => {
|
|
62
118
|
return (h("a", { href: "#", style: {
|
package/dist/ezui/ezui.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as o}from"./p-e318d280.js";export{s as setNonce}from"./p-e318d280.js";(()=>{const o=import.meta.url,t={};return""!==o&&(t.resourcesUrl=new URL(".",o).href),e(t)})().then((e=>o(JSON.parse('[["p-e309ad64",[[6,"ez-grid",{"multipleSelection":[4,"multiple-selection"],"config":[1040],"selectionToastConfig":[16],"serverUrl":[1,"server-url"],"dataUnit":[16],"statusResolver":[16],"columnfilterDataSource":[16],"useEnterLikeTab":[4,"use-enter-like-tab"],"recordsValidator":[16],"canEdit":[4,"can-edit"],"_paginationInfo":[32],"_paginationChangedByKeyboard":[32],"_showSelectionCounter":[32],"_isAllSelection":[32],"_currentPageSelected":[32],"_selectionCount":[32],"_hasLeftButtons":[32],"setColumnsDef":[64],"addColumnMenuItem":[64],"setColumnsState":[64],"setData":[64],"getSelection":[64],"getColumnsState":[64],"getColumns":[64],"quickFilter":[64],"locateColumn":[64],"filterColumns":[64]},[[0,"ezSelectionChange","onSelectionChange"]]]]],["p-f55d75e7",[[1,"ez-guide-navigator",{"open":[1540],"selectedId":[1537,"selected-id"],"items":[16],"tooltipResolver":[16],"filterText":[32],"disableItem":[64],"openGuideNavidator":[64],"enableItem":[64],"updateItem":[64],"getItem":[64],"getCurrentPath":[64],"selectGuide":[64],"getParent":[64]}]]],["p-59bcb27c",[[1,"ez-alert-list",{"alerts":[1040],"enableDragAndDrop":[516,"enable-drag-and-drop"],"enableExpand":[516,"enable-expand"],"itemRightSlotBuilder":[16],"opened":[1540],"expanded":[1540]}]]],["p-3e7cc8a4",[[1,"ez-actions-button",{"enabled":[516],"actions":[1040],"size":[513],"showLabel":[516,"show-label"],"displayIcon":[513,"display-icon"],"checkOption":[516,"check-option"],"value":[513],"isTransparent":[516,"is-transparent"],"arrowActive":[516,"arrow-active"],"_selectedAction":[32],"hideActions":[64],"showActions":[64],"isOpened":[64]}]]],["p-cd19a6f8",[[1,"ez-breadcrumb",{"items":[1040],"fillMode":[1025,"fill-mode"],"maxItems":[1026,"max-items"],"positionEllipsis":[1026,"position-ellipsis"],"visibleItems":[32],"hiddenItems":[32],"showDropdown":[32],"collapseConfigPosition":[32]}]]],["p-7319c253",[[1,"ez-dialog",{"confirm":[1028],"dialogType":[1025,"dialog-type"],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"beforeClose":[1040],"show":[64]},[[8,"keydown","handleKeyDown"]]]]],["p-a01068e1",[[6,"ez-modal-container",{"modalTitle":[1,"modal-title"],"modalSubTitle":[1,"modal-sub-title"],"showTitleBar":[4,"show-title-bar"],"cancelButtonLabel":[1,"cancel-button-label"],"okButtonLabel":[1,"ok-button-label"],"cancelButtonStatus":[1,"cancel-button-status"],"okButtonStatus":[1,"ok-button-status"]}]]],["p-60ba28ea",[[1,"ez-alert",{"alertType":[513,"alert-type"]}]]],["p-c49dbf23",[[1,"ez-badge",{"size":[513],"label":[513],"iconLeft":[513,"icon-left"],"iconRight":[513,"icon-right"],"position":[1040],"hasSlot":[32]}]]],["p-f4208819",[[1,"ez-chip",{"label":[513],"enabled":[516],"removePosition":[513,"remove-position"],"mode":[513],"value":[1540],"showNativeTooltip":[4,"show-native-tooltip"],"setFocus":[64],"setBlur":[64]}]]],["p-ccb4ccd9",[[1,"ez-file-item",{"canRemove":[4,"can-remove"],"fileName":[1,"file-name"],"iconName":[1,"icon-name"],"fileSize":[2,"file-size"],"progress":[2]}]]],["p-d51aa09b",[[0,"ez-application"]]],["p-47afb974",[[1,"ez-card-item",{"item":[16]}]]],["p-7525e604",[[1,"ez-loading-bar",{"_showLoading":[32],"hide":[64],"show":[64]}]]],["p-62304715",[[1,"ez-modal",{"modalSize":[1,"modal-size"],"align":[1],"heightMode":[1,"height-mode"],"opened":[1028],"closeEsc":[4,"close-esc"],"closeOutsideClick":[4,"close-outside-click"],"scrim":[1]}]]],["p-99692afa",[[1,"ez-popup",{"size":[1],"opened":[1540],"useHeader":[516,"use-header"],"heightMode":[513,"height-mode"],"ezTitle":[1,"ez-title"]}]]],["p-b11f035c",[[1,"ez-radio-button",{"value":[1544],"options":[1040],"enabled":[516],"label":[513],"direction":[1537]}]]],["p-5d6f2550",[[0,"ez-skeleton",{"count":[2],"variant":[1],"width":[1],"height":[1],"marginBottom":[1,"margin-bottom"],"animation":[1]}]]],["p-76d16a24",[[0,"ez-split-item"]]],["p-d20ed286",[[0,"ez-split-panel",{"direction":[1]}]]],["p-fa571a4e",[[1,"ez-toast",{"message":[1025],"fadeTime":[1026,"fade-time"],"useIcon":[1028,"use-icon"],"canClose":[1028,"can-close"],"show":[64]}]]],["p-9b347f04",[[0,"ez-view-stack",{"show":[64],"getSelectedIndex":[64]}]]],["p-74049254",[[1,"ez-dropdown",{"items":[1040],"value":[1040],"itemBuilder":[16]}]]],["p-83885b21",[[1,"ez-tabselector",{"selectedIndex":[1538,"selected-index"],"selectedTab":[1537,"selected-tab"],"tabs":[1],"_processedTabs":[32]}]]],["p-22208198",[[2,"ez-multi-selection-list",{"columnName":[1,"column-name"],"dataSource":[16],"useOptions":[1028,"use-options"],"options":[1040],"isTextSearch":[4,"is-text-search"],"filteredOptions":[32],"displayOptions":[32],"viewScenario":[32],"displayOptionToCheckAllItems":[32],"clearFilteredOptions":[64]}]]],["p-871c1a07",[[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],"showHide":[64],"applyFocusTextEdit":[64],"cancelEdition":[64]}]]],["p-5cef0264",[[1,"ez-calendar",{"value":[1040],"floating":[516],"time":[516],"showSeconds":[516,"show-seconds"],"show":[64],"fitVertical":[64],"fitHorizontal":[64],"hide":[64]},[[11,"scroll","scrollListener"]]]]],["p-52dd8b4c",[[1,"ez-text-input",{"label":[513],"value":[1537],"enabled":[516],"errorMessage":[1537,"error-message"],"mask":[1],"canShowError":[516,"can-show-error"],"restrict":[1],"mode":[513],"noBorder":[516,"no-border"],"password":[4],"setFocus":[64],"setBlur":[64],"isInvalid":[64]}]]],["p-d43b22f3",[[1,"ez-date-input",{"label":[513],"value":[1040],"enabled":[516],"errorMessage":[1537,"error-message"],"mode":[513],"canShowError":[516,"can-show-error"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"getValueAsync":[64]}]]],["p-ce035beb",[[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"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"getValueAsync":[64]}]]],["p-028f264f",[[1,"ez-time-input",{"label":[513],"value":[1026],"enabled":[516],"errorMessage":[1537,"error-message"],"showSeconds":[516,"show-seconds"],"mode":[513],"canShowError":[516,"can-show-error"],"setFocus":[64],"setBlur":[64],"isInvalid":[64]}]]],["p-e2dfd935",[[1,"ez-number-input",{"label":[1],"value":[1538],"enabled":[4],"canShowError":[516,"can-show-error"],"errorMessage":[1537,"error-message"],"precision":[2],"prettyPrecision":[2,"pretty-precision"],"mode":[513],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"getValueAsync":[64]}]]],["p-7fd54841",[[2,"ez-form-view",{"fields":[16],"showUp":[64]}]]],["p-2da09f70",[[1,"ez-popover",{"autoClose":[516,"auto-close"],"boxWidth":[513,"box-width"],"opened":[1540],"innerElement":[1537,"inner-element"],"overlayType":[513,"overlay-type"],"updatePosition":[64],"show":[64],"showUnder":[64],"hide":[64]}]]],["p-391de0e4",[[1,"ez-text-area",{"label":[513],"value":[1537],"enabled":[516],"errorMessage":[1537,"error-message"],"rows":[1538],"canShowError":[516,"can-show-error"],"mode":[513],"enableResize":[516,"enable-resize"],"appendTextToSelection":[64],"setFocus":[64],"setBlur":[64],"isInvalid":[64]}]]],["p-0b902469",[[1,"ez-upload",{"label":[1],"subtitle":[1],"enabled":[4],"maxFileSize":[2,"max-file-size"],"maxFiles":[2,"max-files"],"requestHeaders":[8,"request-headers"],"urlUpload":[1,"url-upload"],"urlDelete":[1,"url-delete"],"value":[1040],"addFiles":[64],"setFocus":[64],"setBlur":[64]}]]],["p-245a44ed",[[1,"ez-text-edit",{"value":[1],"styled":[16],"_newValue":[32],"applyFocusSelect":[64]}]]],["p-d81917fd",[[1,"ez-tree",{"items":[1040],"value":[1040],"selectedId":[1537,"selected-id"],"iconResolver":[16],"tooltipResolver":[16],"_tree":[32],"_waintingForLoad":[32],"selectItem":[64],"openItem":[64],"disableItem":[64],"enableItem":[64],"addChild":[64],"applyFilter":[64],"updateItem":[64],"getItem":[64],"getCurrentPath":[64],"getParent":[64]},[[2,"keydown","onKeyDownListener"]]],[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"]]],[1,"ez-sidebar-button"]]],["p-d3b5228e",[[1,"ez-list",{"dataSource":[1040],"listMode":[1,"list-mode"],"useGroups":[1540,"use-groups"],"ezDraggable":[1028,"ez-draggable"],"ezSelectable":[1028,"ez-selectable"],"itemSlotBuilder":[1040],"itemLeftSlotBuilder":[1040],"hoverFeedback":[1028,"hover-feedback"],"_listItems":[32],"_listGroupItems":[32],"clearHistory":[64],"scrollToTop":[64],"setSelection":[64],"getSelection":[64],"getList":[64],"removeSelection":[64]}]]],["p-ffa8ec98",[[1,"ez-combo-box",{"limitCharsToSearch":[2,"limit-chars-to-search"],"value":[1537],"label":[513],"enabled":[516],"options":[1040],"errorMessage":[1537,"error-message"],"searchMode":[4,"search-mode"],"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],"getValueAsync":[64],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"clearValue":[64]},[[11,"scroll","scrollListener"]]]]],["p-f8653522",[[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"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"clearValue":[64],"getValueAsync":[64]}]]],["p-87e85160",[[0,"multi-selection-box-message",{"message":[1]}],[1,"ez-filter-input",{"label":[1],"value":[1537],"enabled":[4],"errorMessage":[1537,"error-message"],"restrict":[1],"mode":[513],"asyncSearch":[516,"async-search"],"canShowError":[516,"can-show-error"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"setValue":[64],"endSearch":[64]}]]],["p-95426f93",[[1,"ez-check",{"label":[513],"value":[1540],"enabled":[1540],"indeterminate":[1540],"mode":[513],"compact":[4],"getMode":[64],"setFocus":[64]}]]],["p-b6867f19",[[1,"ez-icon",{"size":[513],"href":[513],"iconName":[513,"icon-name"]}]]],["p-32b4163f",[[1,"ez-button",{"label":[513],"enabled":[516],"mode":[513],"image":[513],"iconName":[513,"icon-name"],"size":[513],"setFocus":[64],"setBlur":[64]},[[2,"click","clickListener"]]]]],["p-8252d9b5",[[2,"ez-form",{"dataUnit":[1040],"config":[16],"recordsValidator":[16],"fieldToFocus":[1,"field-to-focus"],"validate":[64]}]]],["p-a42fe2ce",[[0,"filter-column",{"opened":[4],"columnName":[1,"column-name"],"columnLabel":[1,"column-label"],"gridHeaderHidden":[4,"grid-header-hidden"],"noHeaderTaskBar":[1028,"no-header-task-bar"],"dataSource":[16],"dataUnit":[16],"options":[1040],"selectedItems":[32],"fieldDescriptor":[32],"useOptions":[32],"isTextSearch":[32],"hide":[64],"show":[64]}]]]]'),e)));
|
|
1
|
+
import{p as e,b as o}from"./p-e318d280.js";export{s as setNonce}from"./p-e318d280.js";(()=>{const o=import.meta.url,t={};return""!==o&&(t.resourcesUrl=new URL(".",o).href),e(t)})().then((e=>o(JSON.parse('[["p-e309ad64",[[6,"ez-grid",{"multipleSelection":[4,"multiple-selection"],"config":[1040],"selectionToastConfig":[16],"serverUrl":[1,"server-url"],"dataUnit":[16],"statusResolver":[16],"columnfilterDataSource":[16],"useEnterLikeTab":[4,"use-enter-like-tab"],"recordsValidator":[16],"canEdit":[4,"can-edit"],"_paginationInfo":[32],"_paginationChangedByKeyboard":[32],"_showSelectionCounter":[32],"_isAllSelection":[32],"_currentPageSelected":[32],"_selectionCount":[32],"_hasLeftButtons":[32],"setColumnsDef":[64],"addColumnMenuItem":[64],"setColumnsState":[64],"setData":[64],"getSelection":[64],"getColumnsState":[64],"getColumns":[64],"quickFilter":[64],"locateColumn":[64],"filterColumns":[64]},[[0,"ezSelectionChange","onSelectionChange"]]]]],["p-f55d75e7",[[1,"ez-guide-navigator",{"open":[1540],"selectedId":[1537,"selected-id"],"items":[16],"tooltipResolver":[16],"filterText":[32],"disableItem":[64],"openGuideNavidator":[64],"enableItem":[64],"updateItem":[64],"getItem":[64],"getCurrentPath":[64],"selectGuide":[64],"getParent":[64]}]]],["p-d5ac1911",[[1,"ez-alert-list",{"alerts":[1040],"enableDragAndDrop":[516,"enable-drag-and-drop"],"enableExpand":[516,"enable-expand"],"itemRightSlotBuilder":[16],"opened":[1540],"expanded":[1540]}]]],["p-3e7cc8a4",[[1,"ez-actions-button",{"enabled":[516],"actions":[1040],"size":[513],"showLabel":[516,"show-label"],"displayIcon":[513,"display-icon"],"checkOption":[516,"check-option"],"value":[513],"isTransparent":[516,"is-transparent"],"arrowActive":[516,"arrow-active"],"_selectedAction":[32],"hideActions":[64],"showActions":[64],"isOpened":[64]}]]],["p-cd19a6f8",[[1,"ez-breadcrumb",{"items":[1040],"fillMode":[1025,"fill-mode"],"maxItems":[1026,"max-items"],"positionEllipsis":[1026,"position-ellipsis"],"visibleItems":[32],"hiddenItems":[32],"showDropdown":[32],"collapseConfigPosition":[32]}]]],["p-7319c253",[[1,"ez-dialog",{"confirm":[1028],"dialogType":[1025,"dialog-type"],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"beforeClose":[1040],"show":[64]},[[8,"keydown","handleKeyDown"]]]]],["p-a01068e1",[[6,"ez-modal-container",{"modalTitle":[1,"modal-title"],"modalSubTitle":[1,"modal-sub-title"],"showTitleBar":[4,"show-title-bar"],"cancelButtonLabel":[1,"cancel-button-label"],"okButtonLabel":[1,"ok-button-label"],"cancelButtonStatus":[1,"cancel-button-status"],"okButtonStatus":[1,"ok-button-status"]}]]],["p-60ba28ea",[[1,"ez-alert",{"alertType":[513,"alert-type"]}]]],["p-c49dbf23",[[1,"ez-badge",{"size":[513],"label":[513],"iconLeft":[513,"icon-left"],"iconRight":[513,"icon-right"],"position":[1040],"hasSlot":[32]}]]],["p-f4208819",[[1,"ez-chip",{"label":[513],"enabled":[516],"removePosition":[513,"remove-position"],"mode":[513],"value":[1540],"showNativeTooltip":[4,"show-native-tooltip"],"setFocus":[64],"setBlur":[64]}]]],["p-ccb4ccd9",[[1,"ez-file-item",{"canRemove":[4,"can-remove"],"fileName":[1,"file-name"],"iconName":[1,"icon-name"],"fileSize":[2,"file-size"],"progress":[2]}]]],["p-d51aa09b",[[0,"ez-application"]]],["p-47afb974",[[1,"ez-card-item",{"item":[16]}]]],["p-7525e604",[[1,"ez-loading-bar",{"_showLoading":[32],"hide":[64],"show":[64]}]]],["p-62304715",[[1,"ez-modal",{"modalSize":[1,"modal-size"],"align":[1],"heightMode":[1,"height-mode"],"opened":[1028],"closeEsc":[4,"close-esc"],"closeOutsideClick":[4,"close-outside-click"],"scrim":[1]}]]],["p-99692afa",[[1,"ez-popup",{"size":[1],"opened":[1540],"useHeader":[516,"use-header"],"heightMode":[513,"height-mode"],"ezTitle":[1,"ez-title"]}]]],["p-b11f035c",[[1,"ez-radio-button",{"value":[1544],"options":[1040],"enabled":[516],"label":[513],"direction":[1537]}]]],["p-5d6f2550",[[0,"ez-skeleton",{"count":[2],"variant":[1],"width":[1],"height":[1],"marginBottom":[1,"margin-bottom"],"animation":[1]}]]],["p-76d16a24",[[0,"ez-split-item"]]],["p-d20ed286",[[0,"ez-split-panel",{"direction":[1]}]]],["p-fa571a4e",[[1,"ez-toast",{"message":[1025],"fadeTime":[1026,"fade-time"],"useIcon":[1028,"use-icon"],"canClose":[1028,"can-close"],"show":[64]}]]],["p-9b347f04",[[0,"ez-view-stack",{"show":[64],"getSelectedIndex":[64]}]]],["p-74049254",[[1,"ez-dropdown",{"items":[1040],"value":[1040],"itemBuilder":[16]}]]],["p-83885b21",[[1,"ez-tabselector",{"selectedIndex":[1538,"selected-index"],"selectedTab":[1537,"selected-tab"],"tabs":[1],"_processedTabs":[32]}]]],["p-22208198",[[2,"ez-multi-selection-list",{"columnName":[1,"column-name"],"dataSource":[16],"useOptions":[1028,"use-options"],"options":[1040],"isTextSearch":[4,"is-text-search"],"filteredOptions":[32],"displayOptions":[32],"viewScenario":[32],"displayOptionToCheckAllItems":[32],"clearFilteredOptions":[64]}]]],["p-871c1a07",[[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],"showHide":[64],"applyFocusTextEdit":[64],"cancelEdition":[64]}]]],["p-5cef0264",[[1,"ez-calendar",{"value":[1040],"floating":[516],"time":[516],"showSeconds":[516,"show-seconds"],"show":[64],"fitVertical":[64],"fitHorizontal":[64],"hide":[64]},[[11,"scroll","scrollListener"]]]]],["p-52dd8b4c",[[1,"ez-text-input",{"label":[513],"value":[1537],"enabled":[516],"errorMessage":[1537,"error-message"],"mask":[1],"canShowError":[516,"can-show-error"],"restrict":[1],"mode":[513],"noBorder":[516,"no-border"],"password":[4],"setFocus":[64],"setBlur":[64],"isInvalid":[64]}]]],["p-d43b22f3",[[1,"ez-date-input",{"label":[513],"value":[1040],"enabled":[516],"errorMessage":[1537,"error-message"],"mode":[513],"canShowError":[516,"can-show-error"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"getValueAsync":[64]}]]],["p-ce035beb",[[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"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"getValueAsync":[64]}]]],["p-028f264f",[[1,"ez-time-input",{"label":[513],"value":[1026],"enabled":[516],"errorMessage":[1537,"error-message"],"showSeconds":[516,"show-seconds"],"mode":[513],"canShowError":[516,"can-show-error"],"setFocus":[64],"setBlur":[64],"isInvalid":[64]}]]],["p-e2dfd935",[[1,"ez-number-input",{"label":[1],"value":[1538],"enabled":[4],"canShowError":[516,"can-show-error"],"errorMessage":[1537,"error-message"],"precision":[2],"prettyPrecision":[2,"pretty-precision"],"mode":[513],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"getValueAsync":[64]}]]],["p-7fd54841",[[2,"ez-form-view",{"fields":[16],"showUp":[64]}]]],["p-2da09f70",[[1,"ez-popover",{"autoClose":[516,"auto-close"],"boxWidth":[513,"box-width"],"opened":[1540],"innerElement":[1537,"inner-element"],"overlayType":[513,"overlay-type"],"updatePosition":[64],"show":[64],"showUnder":[64],"hide":[64]}]]],["p-391de0e4",[[1,"ez-text-area",{"label":[513],"value":[1537],"enabled":[516],"errorMessage":[1537,"error-message"],"rows":[1538],"canShowError":[516,"can-show-error"],"mode":[513],"enableResize":[516,"enable-resize"],"appendTextToSelection":[64],"setFocus":[64],"setBlur":[64],"isInvalid":[64]}]]],["p-0b902469",[[1,"ez-upload",{"label":[1],"subtitle":[1],"enabled":[4],"maxFileSize":[2,"max-file-size"],"maxFiles":[2,"max-files"],"requestHeaders":[8,"request-headers"],"urlUpload":[1,"url-upload"],"urlDelete":[1,"url-delete"],"value":[1040],"addFiles":[64],"setFocus":[64],"setBlur":[64]}]]],["p-245a44ed",[[1,"ez-text-edit",{"value":[1],"styled":[16],"_newValue":[32],"applyFocusSelect":[64]}]]],["p-d81917fd",[[1,"ez-tree",{"items":[1040],"value":[1040],"selectedId":[1537,"selected-id"],"iconResolver":[16],"tooltipResolver":[16],"_tree":[32],"_waintingForLoad":[32],"selectItem":[64],"openItem":[64],"disableItem":[64],"enableItem":[64],"addChild":[64],"applyFilter":[64],"updateItem":[64],"getItem":[64],"getCurrentPath":[64],"getParent":[64]},[[2,"keydown","onKeyDownListener"]]],[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"]]],[1,"ez-sidebar-button"]]],["p-d3b5228e",[[1,"ez-list",{"dataSource":[1040],"listMode":[1,"list-mode"],"useGroups":[1540,"use-groups"],"ezDraggable":[1028,"ez-draggable"],"ezSelectable":[1028,"ez-selectable"],"itemSlotBuilder":[1040],"itemLeftSlotBuilder":[1040],"hoverFeedback":[1028,"hover-feedback"],"_listItems":[32],"_listGroupItems":[32],"clearHistory":[64],"scrollToTop":[64],"setSelection":[64],"getSelection":[64],"getList":[64],"removeSelection":[64]}]]],["p-ffa8ec98",[[1,"ez-combo-box",{"limitCharsToSearch":[2,"limit-chars-to-search"],"value":[1537],"label":[513],"enabled":[516],"options":[1040],"errorMessage":[1537,"error-message"],"searchMode":[4,"search-mode"],"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],"getValueAsync":[64],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"clearValue":[64]},[[11,"scroll","scrollListener"]]]]],["p-f8653522",[[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"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"clearValue":[64],"getValueAsync":[64]}]]],["p-87e85160",[[0,"multi-selection-box-message",{"message":[1]}],[1,"ez-filter-input",{"label":[1],"value":[1537],"enabled":[4],"errorMessage":[1537,"error-message"],"restrict":[1],"mode":[513],"asyncSearch":[516,"async-search"],"canShowError":[516,"can-show-error"],"setFocus":[64],"setBlur":[64],"isInvalid":[64],"setValue":[64],"endSearch":[64]}]]],["p-95426f93",[[1,"ez-check",{"label":[513],"value":[1540],"enabled":[1540],"indeterminate":[1540],"mode":[513],"compact":[4],"getMode":[64],"setFocus":[64]}]]],["p-b6867f19",[[1,"ez-icon",{"size":[513],"href":[513],"iconName":[513,"icon-name"]}]]],["p-32b4163f",[[1,"ez-button",{"label":[513],"enabled":[516],"mode":[513],"image":[513],"iconName":[513,"icon-name"],"size":[513],"setFocus":[64],"setBlur":[64]},[[2,"click","clickListener"]]]]],["p-8252d9b5",[[2,"ez-form",{"dataUnit":[1040],"config":[16],"recordsValidator":[16],"fieldToFocus":[1,"field-to-focus"],"validate":[64]}]]],["p-a42fe2ce",[[0,"filter-column",{"opened":[4],"columnName":[1,"column-name"],"columnLabel":[1,"column-label"],"gridHeaderHidden":[4,"grid-header-hidden"],"noHeaderTaskBar":[1028,"no-header-task-bar"],"dataSource":[16],"dataUnit":[16],"options":[1040],"selectedItems":[32],"fieldDescriptor":[32],"useOptions":[32],"isTextSearch":[32],"hide":[64],"show":[64]}]]]]'),e)));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,h as e,H as i,g as n}from"./p-e318d280.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}
|
|
@@ -29,16 +29,45 @@ export declare class EzAlertList {
|
|
|
29
29
|
*/
|
|
30
30
|
expanded: boolean;
|
|
31
31
|
observeOpened(): void;
|
|
32
|
+
/**
|
|
33
|
+
* Retorna o id do alerta a partir do título e do índice.
|
|
34
|
+
*/
|
|
35
|
+
private alertId;
|
|
36
|
+
/**
|
|
37
|
+
* Retorna o título do alerta a partir do id.
|
|
38
|
+
*/
|
|
39
|
+
private getAlertTitle;
|
|
40
|
+
/**
|
|
41
|
+
* Retorna o texto do título do alerta.
|
|
42
|
+
*/
|
|
43
|
+
private getTitleText;
|
|
44
|
+
/**
|
|
45
|
+
* Gerencia a exibição do conteúdo expandido.
|
|
46
|
+
*/
|
|
47
|
+
private toggleExpandContainer;
|
|
32
48
|
/**
|
|
33
49
|
* Gerencia a exibição do overlay usando FloatingManager do Core.
|
|
34
50
|
*/
|
|
35
51
|
private manageOverlay;
|
|
52
|
+
/**
|
|
53
|
+
* Atualiza a posição da lista.
|
|
54
|
+
*/
|
|
55
|
+
private updatePosition;
|
|
56
|
+
/**
|
|
57
|
+
* Retorna valores padrões do componente
|
|
58
|
+
*/
|
|
59
|
+
private getFloatOptions;
|
|
60
|
+
/**
|
|
61
|
+
* Retorna o valor para o alinhamento horizontal do componente.
|
|
62
|
+
*/
|
|
63
|
+
private getBoundingRight;
|
|
64
|
+
/**
|
|
65
|
+
* Retorna o valor para o alinhamento vertical do componente.
|
|
66
|
+
*/
|
|
67
|
+
private getBoundingBottom;
|
|
36
68
|
private dataElementId;
|
|
37
69
|
componentDidRender(): void;
|
|
38
70
|
componentWillLoad(): void;
|
|
39
|
-
private alertId;
|
|
40
|
-
private getAlertTitle;
|
|
41
|
-
private getTitleText;
|
|
42
71
|
render(): any;
|
|
43
72
|
}
|
|
44
73
|
export interface AlertItem {
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,h as e,H as i,g as r}from"./p-e318d280.js";import{FloatingManager as l,ElementIDUtils as a}from"@sankhyalabs/core";const s=class{constructor(e){t(this,e),this.alerts=[],this.enableDragAndDrop=void 0,this.enableExpand=void 0,this.itemRightSlotBuilder=void 0,this.opened=!0,this.expanded=!1}observeOpened(){this.manageOverlay()}async manageOverlay(){this.opened?this._overlayId=l.float(this._container,this._overlayRef,{autoClose:!1,isFixed:!this.enableDragAndDrop,bottom:"10px",right:"10px"}):(l.close(this._overlayId),this._overlayId=void 0)}componentDidRender(){this.manageOverlay(),this.opened&&this._container.focus()}componentWillLoad(){this.dataElementId=a.addIDInfo(this._element,"EzAlertList")}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?":":""}`}render(){return e(i,Object.assign({},{[a.DATA_ELEMENT_ID_ATTRIBUTE_NAME]:this.dataElementId}),e("div",{ref:t=>this._overlayRef=t},e("div",{class:"alert-list__container",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"},e("ez-button",{mode:"icon",size:"small",iconName:"expand","data-element-id":a.getInternalIDInfo("expandButton"),onClick:()=>{},title:this.expanded?"Resumir":"Expandir"}),e("ez-button",{mode:"icon",size:"small",iconName:"close","data-element-id":a.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 r(this)}static get watchers(){return{opened:["observeOpened"]}}};s.style=':host{display:flex;--ez-alert-list__container--width:680px;--ez-alert-list__container--height:220px;--ez-alert-list__title--font-family:var(--font-pattern, "Roboto");--ez-alert-list__title--font-size:var(--title--large, 20px);--ez-alert-list__title--color:var(--title--primary, #2b3a54);--ez-alert-list__title--font-weight:var(--text-weight--extra-large, 700);--ez-list__item--border-bottom:var(--border--small, 1px solid);--ez-list__item--border-bottom-color:var(--color--strokes, #DCE0E8);--ez-list__item--white-space:break-space}.alert-list__content{display:flex;flex-direction:column;gap:var(--space--xs);margin:var(--space--large, 24px);width:100%}.alert-list__container{z-index:var(--more-visible--2x, 3);display:flex;height:var(--ez-alert-list__container--height);width:var(--ez-alert-list__container--width);border-radius:var(--border--radius-medium);background-color:var(--background--xlight);box-shadow:0px 8px 24px 0px rgba(0, 38, 111, 0.1)}.alert-list__header{width:100%;display:flex;align-items:center;justify-content:space-between}.alert-list__title{font-family:var(--ez-alert-list__title--font-family);font-size:var(--ez-alert-list__title--font-size);font-weight:var(--ez-alert-list__title--font-weight);color:var(--ez-alert-list__title--color)}.alert-list__header__buttons{display:flex;gap:var(--space--xs)}.alert-list__expandable-content{overflow-y:auto;scrollbar-width:thin}';export{s as ez_alert_list}
|