@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.
@@ -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;--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}";
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 = undefined;
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: "alert-list__container", 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" }, index.h("ez-button", { mode: "icon", size: "small", iconName: "expand", "data-element-id": core.ElementIDUtils.getInternalIDInfo('expandButton'), onClick: () => { }, title: this.expanded ? 'Resumir' : 'Expandir' }), index.h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": core.ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
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: 0px 8px 24px 0px rgba(0, 38, 111, 0.1);
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 = undefined;
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: "alert-list__container", 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" }, h("ez-button", { mode: "icon", size: "small", iconName: "expand", "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), onClick: () => { }, title: this.expanded ? 'Resumir' : 'Expandir' }), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
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;--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}";
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 = undefined;
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: "alert-list__container", 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" }, h("ez-button", { mode: "icon", size: "small", iconName: "expand", "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), onClick: () => { }, title: this.expanded ? 'Resumir' : 'Expandir' }), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
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;--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}";
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 = undefined;
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: "alert-list__container", 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" }, h("ez-button", { mode: "icon", size: "small", iconName: "expand", "data-element-id": ElementIDUtils.getInternalIDInfo('expandButton'), onClick: () => { }, title: this.expanded ? 'Resumir' : 'Expandir' }), h("ez-button", { mode: "icon", size: "small", iconName: "close", "data-element-id": ElementIDUtils.getInternalIDInfo('closeButton'), onClick: () => {
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: {
@@ -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,6 +1,6 @@
1
1
  {
2
2
  "name": "@sankhyalabs/ezui",
3
- "version": "5.18.0-dev.2",
3
+ "version": "5.18.0-dev.3",
4
4
  "description": "Biblioteca de componentes Sankhya.",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/custom-elements/index.js",
@@ -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}