@sankhyalabs/ezui 1.1.108 → 1.1.111

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (101) hide show
  1. package/dist/cjs/ApplicationUtils-c8f07135.js +39 -0
  2. package/dist/cjs/AssetsUtils-4909c6de.js +24 -0
  3. package/dist/cjs/CSSVarsUtils-8fbdf2e0.js +19 -0
  4. package/dist/cjs/ez-button.cjs.entry.js +79 -0
  5. package/dist/cjs/ez-calendar.cjs.entry.js +223 -0
  6. package/dist/cjs/ez-check.cjs.entry.js +76 -0
  7. package/dist/cjs/ez-collapsible-box.cjs.entry.js +47 -0
  8. package/dist/cjs/ez-combo-box.cjs.entry.js +278 -0
  9. package/dist/cjs/ez-date-input.cjs.entry.js +102 -0
  10. package/dist/cjs/ez-date-time-input.cjs.entry.js +145 -0
  11. package/dist/cjs/ez-form.cjs.entry.js +785 -0
  12. package/dist/cjs/ez-grid.cjs.entry.js +9 -8
  13. package/dist/cjs/ez-icon.cjs.entry.js +41 -0
  14. package/dist/cjs/{ez-button_3.cjs.entry.js → ez-list.cjs.entry.js} +0 -89
  15. package/dist/cjs/ez-modal.cjs.entry.js +65 -0
  16. package/dist/cjs/ez-number-input.cjs.entry.js +86 -0
  17. package/dist/cjs/ez-popover.cjs.entry.js +4 -5
  18. package/dist/cjs/ez-search.cjs.entry.js +64 -0
  19. package/dist/cjs/ez-tabselector.cjs.entry.js +198 -0
  20. package/dist/cjs/ez-text-area.cjs.entry.js +114 -0
  21. package/dist/cjs/ez-text-input.cjs.entry.js +201 -0
  22. package/dist/cjs/ez-time-input.cjs.entry.js +118 -0
  23. package/dist/cjs/ez-upload.cjs.entry.js +356 -0
  24. package/dist/cjs/ezui.cjs.js +1 -1
  25. package/dist/cjs/{ez-modal_2.cjs.entry.js → grid-config.cjs.entry.js} +3 -62
  26. package/dist/cjs/loader.cjs.js +1 -1
  27. package/dist/cjs/select-box.cjs.entry.js +22 -0
  28. package/dist/cjs/test-du.cjs.entry.js +76 -0
  29. package/dist/collection/collection-manifest.json +132 -1
  30. package/dist/custom-elements/index.js +3 -1577
  31. package/dist/esm/ApplicationUtils-36e38de9.js +37 -0
  32. package/dist/esm/AssetsUtils-9b1329a3.js +22 -0
  33. package/dist/esm/CSSVarsUtils-667e0016.js +17 -0
  34. package/dist/esm/ez-button.entry.js +75 -0
  35. package/dist/esm/ez-calendar.entry.js +219 -0
  36. package/dist/esm/ez-check.entry.js +72 -0
  37. package/dist/esm/ez-collapsible-box.entry.js +43 -0
  38. package/dist/esm/ez-combo-box.entry.js +274 -0
  39. package/dist/esm/ez-date-input.entry.js +98 -0
  40. package/dist/esm/ez-date-time-input.entry.js +141 -0
  41. package/dist/esm/ez-form.entry.js +781 -0
  42. package/dist/esm/ez-grid.entry.js +2 -1
  43. package/dist/esm/ez-icon.entry.js +37 -0
  44. package/dist/esm/{ez-button_3.entry.js → ez-list.entry.js} +2 -89
  45. package/dist/esm/ez-modal.entry.js +61 -0
  46. package/dist/esm/ez-number-input.entry.js +82 -0
  47. package/dist/esm/ez-popover.entry.js +1 -2
  48. package/dist/esm/ez-search.entry.js +60 -0
  49. package/dist/esm/ez-tabselector.entry.js +194 -0
  50. package/dist/esm/ez-text-area.entry.js +110 -0
  51. package/dist/esm/ez-text-input.entry.js +197 -0
  52. package/dist/esm/ez-time-input.entry.js +114 -0
  53. package/dist/esm/ez-upload.entry.js +352 -0
  54. package/dist/esm/ezui.js +1 -1
  55. package/dist/esm/{ez-modal_2.entry.js → grid-config.entry.js} +3 -61
  56. package/dist/esm/loader.js +1 -1
  57. package/dist/esm/select-box.entry.js +18 -0
  58. package/dist/esm/test-du.entry.js +72 -0
  59. package/dist/ezui/ezui.esm.js +1 -1
  60. package/dist/ezui/p-080045a0.entry.js +1 -0
  61. package/dist/ezui/p-25e87823.entry.js +1 -0
  62. package/dist/ezui/p-31b0e21a.entry.js +1 -0
  63. package/dist/ezui/p-363fc3af.entry.js +1 -0
  64. package/dist/ezui/p-3662c09e.entry.js +1 -0
  65. package/dist/ezui/p-3a8bf0a8.entry.js +1 -0
  66. package/dist/ezui/p-3c954800.entry.js +1 -0
  67. package/dist/ezui/p-44d4f8d6.entry.js +1 -0
  68. package/dist/ezui/p-477bb703.js +1 -0
  69. package/dist/ezui/p-59a8448a.entry.js +1 -0
  70. package/dist/ezui/p-62daf508.js +1 -0
  71. package/dist/ezui/p-65893e25.entry.js +1 -0
  72. package/dist/ezui/p-73d3f767.entry.js +1 -0
  73. package/dist/ezui/p-73d45b12.entry.js +1 -0
  74. package/dist/ezui/p-804c118a.entry.js +1 -0
  75. package/dist/ezui/p-97f77023.entry.js +1 -0
  76. package/dist/ezui/p-9aecc079.entry.js +1 -0
  77. package/dist/ezui/{p-db1797d7.entry.js → p-a038e7a5.entry.js} +28 -28
  78. package/dist/ezui/p-a5f1f9c4.entry.js +1 -0
  79. package/dist/ezui/p-bc2834fa.entry.js +1 -0
  80. package/dist/ezui/p-c27495d9.entry.js +1 -0
  81. package/dist/ezui/p-c6f2aa6c.entry.js +1 -0
  82. package/dist/ezui/p-d54c157f.js +1 -0
  83. package/dist/ezui/p-f26f6d67.entry.js +1 -0
  84. package/dist/ezui/p-f3f9c7e6.entry.js +1 -0
  85. package/dist/ezui/p-f78c7ec9.entry.js +1 -0
  86. package/package.json +5 -4
  87. package/dist/cjs/AssetsUtils-697927e8.js +0 -79
  88. package/dist/cjs/FloatingManager-751368a8.js +0 -126
  89. package/dist/cjs/UnitMetadata-de809a4b.js +0 -1346
  90. package/dist/cjs/ez-calendar_16.cjs.entry.js +0 -2916
  91. package/dist/esm/AssetsUtils-f75711ac.js +0 -76
  92. package/dist/esm/FloatingManager-ee1f7fdf.js +0 -124
  93. package/dist/esm/UnitMetadata-d300ae38.js +0 -1340
  94. package/dist/esm/ez-calendar_16.entry.js +0 -2897
  95. package/dist/ezui/p-3e6fa4ca.entry.js +0 -1
  96. package/dist/ezui/p-47cf74f0.js +0 -1
  97. package/dist/ezui/p-6b257393.entry.js +0 -1
  98. package/dist/ezui/p-780fbe22.entry.js +0 -1
  99. package/dist/ezui/p-81fc41a5.js +0 -1
  100. package/dist/ezui/p-b05feb1f.js +0 -1
  101. package/dist/ezui/p-c451d6e6.entry.js +0 -1
@@ -1,2916 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88286449.js');
6
- const UnitMetadata = require('./UnitMetadata-de809a4b.js');
7
- const FloatingManager = require('./FloatingManager-751368a8.js');
8
- const AssetsUtils = require('./AssetsUtils-697927e8.js');
9
-
10
- class DateUtils {
11
- static clearTime(date, adjustDayLightSavingTime = true) {
12
- const newDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0, 0);
13
- return adjustDayLightSavingTime ? DateUtils.adjustDLST(newDate) : newDate;
14
- }
15
- static strToDate(strValue, adjustDayLightSavingTime = true, monthYearMode = false) {
16
- /** monthYearMode é um booleano para usar o formato MM/YYYY.
17
- * Quando ativado, é retornado o primeiro dia do mês apenas para construir a data.
18
- * Não há necessidade de verificar o horário de verão quando utilizado esse modo. */
19
- let parts;
20
- if (monthYearMode) {
21
- parts = /^(1[0-2]|0[1-9]|[1-9])[^\d]?(\d{2}|\d{4})(?:\s(\d{1,2}):(\d{1,2}):?(\d{0,2}))?$/.exec(strValue);
22
- }
23
- else {
24
- parts = /^(3[01]|[1-2]\d|0[1-9]|[1-9])[^\d]?(1[0-2]|0[1-9]|[1-9])[^\d]?(\d{2}|\d{4})(?:\s(\d{1,2}):(\d{1,2}):?(\d{0,2}))?$/.exec(strValue);
25
- }
26
- if (!parts) {
27
- return undefined;
28
- }
29
- const day = monthYearMode ? 1 : Number(parts[1]);
30
- const month = Number(parts[(monthYearMode ? 1 : 2)]);
31
- let year = Number(parts[(monthYearMode ? 2 : 3)]);
32
- const hour = Number(parts[(monthYearMode ? 3 : 4)] || 0);
33
- const min = Number(parts[(monthYearMode ? 4 : 5)] || 0);
34
- const sec = Number(parts[(monthYearMode ? 5 : 6)] || 0);
35
- if (year < 100) {
36
- year += year < 30 ? 2000 : 1900;
37
- }
38
- let date = new Date(year, month - 1, day, hour, min, sec, 0);
39
- if (adjustDayLightSavingTime === true && !monthYearMode && hour == 0) {
40
- date = DateUtils.adjustDLST(date);
41
- }
42
- return date;
43
- }
44
- static adjustDLST(date) {
45
- //Work around para corrigir o Bug do horário de verão.
46
- if (date.getHours() == 23) {
47
- return new Date(date.getFullYear(), date.getMonth(), date.getDate() + 1, 1, 0, 0, 0);
48
- }
49
- return date;
50
- }
51
- }
52
-
53
- class ApplicationContext {
54
- static getContextValue(key) {
55
- return ApplicationContext.getCtx()[key];
56
- }
57
- static setContextValue(key, value) {
58
- ApplicationContext.getCtx()[key] = value;
59
- }
60
- static getCtx() {
61
- let ctx = window.___snkcore___ctx___;
62
- if (!ctx) {
63
- ctx = {};
64
- window.___snkcore___ctx___ = ctx;
65
- }
66
- return ctx;
67
- }
68
- }
69
-
70
- const ezCalendarCss = ":host{--ez-calendar--font-family:var(--font-pattern, Arial);--ez-calendar--color:var(--title--primary, #626e82);--ez-calendar--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--ez-calendar__body--background-color:var(--background--xlight, #FFF);--ez-calendar__time--background-color:var(--background--xlight, #FAFAFA);--ez-calendar__body--padding:var(--space--medium, 12px) var(--space--small, 6px);--ez-calendar__body--border-radius:var(--border--radius-medium, 12px);--ez-calendar__body--shadow:var(--shadow, 0px 0px 16px 0px #000);--ez-container--z-index:var(--more-visible, 2);--ez-calendar__header-line--stroke:1px;--ez-calendar__header-line--color:var(--color--strokes, #C0C0C0);--ez-calendar__nav-btn--fill:var(--text--primary, #008561);--ez-calendar__nav-btn--hover--fill:var(--color--primary, #350404);--ez-calendar__nav-btn--width:10px;--ez-calendar__nav-btn--height:16px;--ez-calendar__nav-btn--previous-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 9.7808475,13.860393 3.9204526,8.0000004 9.7808475,2.0624965 7.9301965,0.28895552 0.21915255,8.0000004 7.9301965,15.711044 Z\"/></svg>');--ez-calendar__nav-btn--next-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>');--ez-calendar__cell--margin:0px 1.5px;--ez-calendar__cell--width:var(--space--large, 24px);--ez-calendar__cell--padding:1.5px 0px;--ez-calendar__cell--border-radius:var(--border--radius-small, 6px);--ez-calendar__cell--over--background-color:var(--color--primary, #E2F4EF);--ez-calendar__cell--over--color:var(--color--primary-300, #008561);--ez-calendar__cell--outset--color:var(--color--disable-primary, #E5EAF0);--ez-calendar__cell--selected--background-color:var(--color--primary, #008561);--ez-calendar__cell--selected--color:var(--color--inverted, #FFF);--ez-calendar__btn-today--color:var(--color--primary);--ez-calendar__btn-today--hover--background-color:var(--color--primary-300, #E2F4EF);--ez-calendar__btn-today--border-radius:var(--border--radius-small, 6px);position:relative;display:flex;user-select:none}.calendar__container{display:flex;z-index:var(--more-visible, 2)}.calendar{z-index:var(--more-visible, 2);display:flex;flex-direction:column;background-color:var(--ez-calendar__body--background-color);padding:var(--ez-calendar__body--padding);border-radius:var(--ez-calendar__body--border-radius);box-shadow:var(--ez-calendar__body--shadow)}.calendar__header{display:flex;justify-content:space-between;padding-bottom:var(--space--small, 6px);margin:0px var(--space--, 12px) var(--space--small, 6px) var(--space--, 12px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);border-bottom:solid var(--ez-calendar__header-line--stroke) var(--ez-calendar__header-line--color)}.calendar__btn-next,.calendar__btn-previous{outline:none;border:none;background-color:unset;cursor:pointer;padding:0px}.calendar__btn-next::after,.calendar__btn-previous::after{content:'';display:flex;background-color:var(--ez-calendar__nav-btn--fill);width:var(--ez-calendar__nav-btn--width);height:var(--ez-calendar__nav-btn--height)}.calendar__btn-previous::after{-webkit-mask-image:var(--ez-calendar__nav-btn--previous-image);mask-image:var(--ez-calendar__nav-btn--previous-image)}.calendar__btn-next::after{-webkit-mask-image:var(--ez-calendar__nav-btn--next-image);mask-image:var(--ez-calendar__nav-btn--next-image)}.calendar__btn-next:hover::after,.calendar__btn-previous:hover::after{background-color:var(--ez-calendar__nav-btn--hover--fill)}.calendar__lbl-month{font-weight:var(--text-weight--extra-large, 700);font-size:var(--title--small, 14px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.calendar__line{display:flex;padding:0px;margin:0px}.calendar__cell{display:flex;justify-content:center;align-content:center;cursor:pointer;font-size:var(--text--extra-small, 10px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);padding:var(--ez-calendar__cell--padding);margin:var(--ez-calendar__cell--margin);min-width:var(--ez-calendar__cell--width);border-radius:var(--ez-calendar__cell--border-radius)}.calendar__cell:hover{background-color:var(--ez-calendar__cell--over--background-color);color:var(--ez-calendar__cell--over--color)}.calendar__cell--secondary{color:var(--ez-calendar__cell--outset--color)}.calendar__cell--unselectable:hover{background-color:unset;border-radius:unset;cursor:unset}.calendar__cell--unselectable{font-weight:var(--text-weight--large, 600);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.calendar__cell--selected,.calendar__cell--selected:hover{background-color:var(--ez-calendar__cell--selected--background-color);color:var(--ez-calendar__cell--selected--color)}.calendar__footer{display:flex;flex-direction:column}.calendar__btn-today{border:none;background-color:unset;cursor:pointer;font-weight:var(--text-weight--large, 600);font-size:var(--title--extra-small, 12px);padding:0px;font-family:var(--ez-calendar--font-family);text-shadow:var(--ez-calendar--text-shadow);color:var(--ez-calendar__btn-today--color);border-radius:var(--ez-calendar__btn-today--border-radius)}.calendar__btn-today:hover{background-color:var(--ez-calendar__btn-today--hover--background-color)}section{display:flex}.calendar-time{margin-left:-10px;display:flex;flex-direction:column;padding:12px 0px 0px 10px;background-color:var(--ez-calendar__time--background-color);border-top-right-radius:var(--ez-calendar__body--border-radius);border-bottom-right-radius:var(--ez-calendar__body--border-radius);box-shadow:var(--ez-calendar__body--shadow)}.calendar__column{height:136px;padding:0px;margin:0px;overflow:auto}.calendar__column::-webkit-scrollbar{width:0px;max-width:0px;min-width:0px}.calendar-time__header{padding-left:var(--space--small, 6px);padding-right:var(--space--small, 6px);display:flex;justify-content:space-between;padding-bottom:var(--space--small, 6px);margin:0px var(--space--, 12px) var(--space--small, 6px) var(--space--, 12px);font-weight:var(--text-weight--extra-large, 700);font-size:var(--title--small, 14px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);border-bottom:solid var(--ez-calendar__header-line--stroke) var(--ez-calendar__header-line--color);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.separatorTime{color:#A2ABB9;padding:0px 1px;line-height:16px;font-size:17px;font-weight:normal}.endHidden{-webkit-mask-image:linear-gradient(180deg, #000 calc(100% - 48px), transparent 100%)}.calendar__column .calendar__cell{margin:0px;padding:1.5px 1.5px}";
71
-
72
- let EzCalendar = class {
73
- constructor(hostRef) {
74
- index.registerInstance(this, hostRef);
75
- this.ezChange = index.createEvent(this, "ezChange", 7);
76
- this._firstRender = true;
77
- this._todayLabel = "Hoje";
78
- this._weekDayLabels = ["D", "S", "T", "Q", "Q", "S", "S"];
79
- this._monthLabels = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
80
- this._hoursLabel = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"];
81
- this._minutosLabel = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
82
- /**
83
- * A data selecionada no calendário
84
- */
85
- this.value = new Date();
86
- /**
87
- * No modo floating o calendário só se tornará visível
88
- * quando o método show() for acionado.
89
- */
90
- this.floating = false;
91
- /**
92
- * Exibe ou não as horas e minutos no calendario
93
- */
94
- this.time = false;
95
- /**
96
- * Exibe ou não os segundos no calendario
97
- */
98
- this.showSeconds = false;
99
- }
100
- /**
101
- * Usado no modo floating. Faz com que o componente seja exibido.
102
- * É possível determinar ajustes de posicionamento através dos parâmetros
103
- * top, left, bottom e right. Esses parâmetros devem ser informados como
104
- * strings no formato css.
105
- */
106
- async show(top, left, bottom, right) {
107
- if (this.floating) {
108
- this._floatingID = FloatingManager.FloatingManager.float(this._box, this._container, { autoClose: true, top, left, bottom, right });
109
- window.requestAnimationFrame(() => {
110
- this._box.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
111
- });
112
- this.scroll();
113
- }
114
- }
115
- /**
116
- * Método necessário para ajustar o posicionamento do calendar acima ou abaixo do ez-date-input conforme a disponibilidade de espaço.
117
- */
118
- async fitVertical(topOffset, bottomOffset) {
119
- const neededHeight = this._container.getBoundingClientRect().bottom + this._calendarHeight;
120
- const availableBottom = (window.innerHeight || document.documentElement.clientHeight) > neededHeight;
121
- if (availableBottom) {
122
- this.show(topOffset + "px", undefined, "unset");
123
- }
124
- else {
125
- this.show("unset", undefined, bottomOffset + "px");
126
- }
127
- }
128
- /**
129
- * Usado no modo floating. Faz com que o componente seja ocultado.
130
- */
131
- async hide() {
132
- if (this._floatingID !== undefined) {
133
- FloatingManager.FloatingManager.close(this._floatingID);
134
- this._floatingID = undefined;
135
- }
136
- }
137
- valueChanged() {
138
- if (this.value) {
139
- this._currentPosition.setTime(this.value.getTime());
140
- this._currentPosition.setDate(1);
141
- }
142
- }
143
- getMonthLabel() {
144
- return this._monthLabels[this._currentPosition.getMonth()] + " " + this._currentPosition.getFullYear();
145
- }
146
- isSelectedDate(d) {
147
- if (this.value) {
148
- return this.value.getDate() == d.getDate() && this.value.getMonth() == d.getMonth() && this.value.getFullYear() == d.getFullYear();
149
- }
150
- return false;
151
- }
152
- changeMonth(offset) {
153
- this._currentPosition.setMonth(this._currentPosition.getMonth() + offset);
154
- index.forceUpdate(this);
155
- }
156
- selectDate(d) {
157
- let newDate = d;
158
- if (this.value && (this.time || this.showSeconds)) {
159
- newDate.setHours(this.value.getHours());
160
- newDate.setMinutes(this.value.getMinutes());
161
- if (this.showSeconds) {
162
- newDate.setSeconds(this.value.getSeconds());
163
- }
164
- else {
165
- newDate.setSeconds(0);
166
- }
167
- }
168
- this.value = newDate;
169
- this.ezChange.emit(this.value);
170
- }
171
- selectHours(hour) {
172
- if (!this.value) {
173
- this.value = new Date();
174
- }
175
- this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), hour, this.value.getMinutes(), this.value.getSeconds());
176
- this.ezChange.emit(this.value);
177
- }
178
- selectMinutes(minute) {
179
- if (!this.value) {
180
- this.value = new Date();
181
- }
182
- this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), this.value.getHours(), minute, this.value.getSeconds());
183
- this.ezChange.emit(this.value);
184
- }
185
- selectSeconds(second) {
186
- if (!this.value) {
187
- this.value = new Date();
188
- }
189
- this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), this.value.getHours(), this.value.getMinutes(), second);
190
- this.ezChange.emit(this.value);
191
- }
192
- updateScroll(element) {
193
- if (element) {
194
- const { scrollHeight, clientHeight, scrollTop } = element;
195
- const remainingScroll = scrollHeight - clientHeight - Math.ceil(scrollTop);
196
- if (remainingScroll > 0) {
197
- element.classList.add("endHidden");
198
- }
199
- else {
200
- element.classList.remove("endHidden");
201
- }
202
- }
203
- }
204
- componentDidRender() {
205
- if (this.floating && this._firstRender) {
206
- this._calendarHeight = this._box.clientHeight;
207
- this._box.remove();
208
- this._firstRender = false;
209
- }
210
- this.updateScroll(this._hoursScroll);
211
- this.updateScroll(this._minutesScroll);
212
- this.updateScroll(this._secondsScroll);
213
- }
214
- componentDidLoad() {
215
- this.scroll();
216
- }
217
- scroll() {
218
- if (this.time || this.showSeconds) {
219
- this._hoursScroll.scrollTop = this._hoursSelect.offsetTop - 64;
220
- this._minutesScroll.scrollTop = this._minutesSelect.offsetTop - 64;
221
- this.updateScroll(this._hoursScroll);
222
- this.updateScroll(this._minutesScroll);
223
- if (this.showSeconds) {
224
- this._secondsScroll.scrollTop = this._secondsSelect.offsetTop - 64;
225
- this.updateScroll(this._secondsScroll);
226
- }
227
- }
228
- }
229
- render() {
230
- if (this._currentPosition == null) {
231
- this._currentPosition = new Date();
232
- if (this.value) {
233
- this._currentPosition.setTime(this.value.getTime());
234
- }
235
- this._currentPosition.setDate(1);
236
- }
237
- const firstDate = new Date();
238
- firstDate.setTime(this._currentPosition.getTime());
239
- firstDate.setDate(1 - firstDate.getDay());
240
- return (index.h("section", { ref: elem => this._container = elem }, index.h("div", { ref: elem => this._box = elem, class: "calendar__container" }, index.h("div", { class: "calendar" }, index.h("div", { class: "calendar__header" }, index.h("button", { class: "calendar__btn-previous", onClick: () => this.changeMonth(-1) }), index.h("label", { class: "calendar__lbl-month" }, this.getMonthLabel()), index.h("button", { class: "calendar__btn-next", onClick: () => this.changeMonth(1) })), index.h("div", { class: "calendar__body" }, index.h("div", { class: "calendar__line" }, this._weekDayLabels.map(day => index.h("div", { class: "calendar__cell calendar__cell--unselectable" }, day))), [0, 7, 14, 21, 28, 35].map(offset => index.h("div", { class: "calendar__line" }, [0, 1, 2, 3, 4, 5, 6].map(index$1 => {
241
- const date = new Date();
242
- date.setTime(firstDate.getTime());
243
- date.setDate(date.getDate() + offset + index$1);
244
- let classNames = "calendar__cell";
245
- if (this._currentPosition.getMonth() != date.getMonth()) {
246
- classNames += " calendar__cell--secondary";
247
- }
248
- else if (this.isSelectedDate(date)) {
249
- classNames += " calendar__cell--selected";
250
- }
251
- return index.h("div", { class: classNames, onClick: () => this.selectDate(date) }, date.getDate());
252
- })))), index.h("div", { class: "calendar__footer" }, index.h("button", { class: "calendar__btn-today", onClick: () => this.selectDate(new Date()) }, this._todayLabel))), (this.time || this.showSeconds) &&
253
- index.h("div", { class: "calendar-time" }, index.h("div", { class: "calendar-time__header" }, index.h("div", null, "H"), index.h("div", { class: "separatorTime" }, ":"), index.h("div", null, "M"), this.showSeconds &&
254
- index.h("div", { class: "separatorTime" }, ":"), this.showSeconds &&
255
- index.h("div", null, "S")), index.h("div", { class: "calendar__body ", style: { display: 'flex', paddingLeft: '12px', paddingRight: '12px' } }, index.h("div", { class: "calendar__column", ref: elem => this._hoursScroll = elem, onScroll: () => this.updateScroll(this._hoursScroll) }, this._hoursLabel.map((offset, index$1) => {
256
- if (index$1 === this.value.getHours()) {
257
- return (index.h("div", { style: { display: 'flex' }, ref: elem => this._hoursSelect = elem }, index.h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectHours(index$1) }, offset), index.h("div", { class: "separatorTime" }, ":")));
258
- }
259
- else {
260
- return (index.h("div", { style: { display: 'flex' } }, index.h("div", { class: "calendar__cell", onClick: () => this.selectHours(index$1) }, offset), index.h("div", { class: "separatorTime" }, ":")));
261
- }
262
- })), index.h("div", { class: "calendar__column", ref: elem => this._minutesScroll = elem, onScroll: () => this.updateScroll(this._minutesScroll) }, this._minutosLabel.map((offset, index$1) => {
263
- if (index$1 === this.value.getMinutes()) {
264
- return (index.h("div", { style: { display: 'flex' }, ref: elem => this._minutesSelect = elem }, index.h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectMinutes(index$1) }, offset), this.showSeconds && index.h("div", { class: "separatorTime" }, ":")));
265
- }
266
- else {
267
- return (index.h("div", { style: { display: 'flex' } }, index.h("div", { class: "calendar__cell", onClick: () => this.selectMinutes(index$1) }, offset), this.showSeconds && index.h("div", { class: "separatorTime" }, ":")));
268
- }
269
- })), this.showSeconds &&
270
- index.h("div", { class: "calendar__column", ref: elem => this._secondsScroll = elem, onScroll: () => this.updateScroll(this._secondsScroll) }, this._minutosLabel.map((offset, index$1) => {
271
- if (index$1 === this.value.getSeconds()) {
272
- return (index.h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectSeconds(index$1), ref: elem => this._secondsSelect = elem }, offset));
273
- }
274
- else {
275
- return (index.h("div", { class: "calendar__cell", onClick: () => this.selectSeconds(index$1) }, offset));
276
- }
277
- })))))));
278
- }
279
- static get watchers() { return {
280
- "value": ["valueChanged"]
281
- }; }
282
- };
283
- EzCalendar.style = ezCalendarCss;
284
-
285
- const ezCheckCss = ":host{--ez-check--box--width:18px;--ez-check--box--height:18px;--ez-check--width:calc(var(--ez-check--box--width) + 14px);--ez-check--height:calc(var(--ez-check--box--width) + 14px);--ez-check--border-radius:var(--border--radius-small);--ez-check--checked--background-color:var(--color--primary-200);--ez-check--focus--background-color:var(--color--strokes, #FFFFFF);--ez-check--hover--background-color:var(--background--medium);--ez-check--checked--disabled--background-color:var(--color--disable-secondary);--ez-check--border:var(--border--medium) var(--title--primary);--ez-check--disabled--border:var(--border--medium) var(--color--strokes);--ez-check--checked--border:var(--border--medium) var(--color--primary);--ez-check--checked--hover--background-color:var(--color--primary-200);--ez-check--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--ez-check--check--image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"7\" viewBox=\"0 0 8 7\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.70002 0.398999L7.48502 0.207997C7.31524 0.0598858 7.09376 -0.0150438 6.86894 -0.000430025C6.64411 0.0141838 6.43419 0.117153 6.28502 0.285997L2.70002 4.332L1.61802 3.384C1.44837 3.23576 1.22697 3.16067 1.00214 3.17509C0.77732 3.18952 0.567332 3.2923 0.418019 3.461L0.229019 3.674C0.0752361 3.84797 -0.00437434 4.07521 0.00721192 4.30713C0.0187982 4.53904 0.120661 4.75722 0.291019 4.915L2.27402 6.762C2.35832 6.8432 2.45842 6.90618 2.56811 6.94702C2.67779 6.98787 2.79471 7.00571 2.91159 6.99942C3.02846 6.99314 3.14279 6.96287 3.24747 6.91049C3.35214 6.85812 3.44492 6.78477 3.52002 6.695L7.79102 1.638C7.94063 1.46048 8.01486 1.23149 7.99786 0.999963C7.98085 0.768436 7.87396 0.552749 7.70002 0.398999Z\"/></svg>');--ez-check--check--background-color:var(--color--primary);--ez-check--check--disabled--background-color:var(--color--strokes);--ez-switch--slider--width:34px;--ez-switch--slider--height:14px;--ez-switch--pin--width:20px;--ez-switch--pin--height:20px;--ez-switch--focus--width:32px;--ez-switch--focus--height:32px;--ez-switch--background-color:var(--color--strokes);--ez-switch--disabled--background-color:var(--color--disable-secondary);--ez-switch--checked--background-color:var(--color--primary-300);--ez-switch--pin--background-color:var(--background--xlight);--ez-switch--pin--disabled--background-color:var(--color--disable-secondary);--ez-switch--pin--checked--background-color:var(--color--primary);--ez-switch--pin--checked--disabled--background-color:#E8F7F4;--ez-switch--pin--focus--background-color:var(--text--disable);--ez-switch--pin--checked--focus--background-color:var(--color--primary);--ez-check--label--font-size:var(--text--medium, 14px);--ez-check--label--font-family:var(--font-pattern, Arial);--ez-check--label--color:var(--title--primary, #000);--ez-check--label--disabled--color:var(--text--disable, #AFB6C0);display:flex;width:100%;align-items:center;margin:0}input.regularMode{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;box-sizing:border-box;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;position:relative;width:var(--ez-check--width);height:var(--ez-check--height)}input.regularMode:enabled:hover{background-color:var(--ez-check--hover--background-color)}input.regularMode:enabled:focus{outline:none;background-color:var(--ez-check--focus--background-color)}input.regularMode:disabled{cursor:auto;background:none}input.regularMode::before{box-sizing:border-box;content:\"\";display:block;width:var(--ez-check--box--width);height:var(--ez-check--box--height);border-radius:var(--ez-check--border-radius);border:var(--ez-check--border)}input.regularMode:disabled::before{border:var(--ez-check--disabled--border)}input.regularMode:checked:enabled:hover{background-color:var(--ez-check--checked--hover--background-color)}input.regularMode:checked:enabled:focus{background-color:var(--ez-check--checked--focus--background-color)}input.regularMode:checked::before{border:var(--ez-check--checked--border);background-color:var(--ez-check--checked--background-color)}input.regularMode:checked:disabled:before{border:var(--ez-check--disabled--border);background-color:var(--ez-check--checked--disabled--background-color)}input.regularMode:checked::after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--ez-check--check--image);mask-image:var(--ez-check--check--image)}input.regularMode:checked:disabled::after{background-color:var(--ez-check--check--disabled--background-color)}input.switchMode{flex-shrink:0;-webkit-appearance:none;appearance:none;position:relative;outline:none;cursor:pointer;border-radius:20px;border:var(--border--small, 1px solid) var(--text--secondary, #a2abb9);transition:background-color var(--transition);width:var(--ez-switch--slider--width);height:var(--ez-switch--slider--height);background-color:var(--ez-switch--background-color)}input.switchMode:disabled{background-color:var(--ez-switch--disabled--background-color)}input.switchMode::after{content:\"\";display:block;position:absolute;box-shadow:var(--shadow);transition:transform var(--transition);transition:background-color var(--transition);transform:translateX(-2px) translateY(-3px);border-radius:50%;width:var(--ez-switch--pin--width);height:var(--ez-switch--pin--height);background-color:var(--ez-switch--pin--background-color)}input.switchMode:disabled::after{background-color:var(--ez-switch--pin--disabled--background-color)}input.switchMode:checked{transition:background-color var(--transition), border var(--transition);background-color:var(--ez-switch--checked--background-color);border:var(--border--small, 1px solid) var(--color--primary, #008561)}input.switchMode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--ez-switch--focus--width);height:var(--ez-switch--focus--height);top:calc((var(--ez-switch--slider--height) - var(--ez-switch--focus--height)) / 2);left:calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width))/2);background-color:var(--ez-switch--pin--focus--background-color)}input.switchMode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switchMode:checked:focus::before{background-color:var(--ez-switch--pin--checked--focus--background-color);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width)))}input.switchMode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width))) translateY(-3px);box-shadow:var(--shadow);background-color:var(--ez-switch--pin--checked--background-color)}input.switchMode:checked:disabled::after{background-color:var(--ez-switch--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-check--label--color);text-shadow:var(--text-shadow);font-size:var(--ez-check--label--font-size);font-family:var(--ez-check--label--font-family);cursor:default;padding-left:var(--space--small)}.label--disabled{color:var(--ez-check--label--disabled--color)}";
286
-
287
- let EzCheck = class {
288
- constructor(hostRef) {
289
- index.registerInstance(this, hostRef);
290
- this.ezChange = index.createEvent(this, "ezChange", 7);
291
- /**
292
- * Deixa o campo disponível ou não para interação com o usuário.
293
- */
294
- this.enabled = true;
295
- /**
296
- * Existem dois modos de visualização: regular e switch.
297
- * Se esta propriedade for omitida, o componete assume o formato "regular".
298
- * No modo "regular" a visualização é a tradicional de uma caixinha marcada/desmarcada.
299
- * No modo "switch" o campo tem uma interface em formato de um pino liga/desliga.
300
- */
301
- this.mode = "regular";
302
- }
303
- adjustMode() {
304
- if (this.mode === "switch") {
305
- this._inputElem.classList.remove("regularMode");
306
- this._inputElem.classList.add("switchMode");
307
- }
308
- else {
309
- this._inputElem.classList.remove("switchMode");
310
- this._inputElem.classList.add("regularMode");
311
- }
312
- }
313
- //---------------------------------------------
314
- // Public methods
315
- //---------------------------------------------
316
- /**
317
- * Devolve o modo escolhido para o componente
318
- */
319
- async getMode() {
320
- return this.mode;
321
- }
322
- /**
323
- * Faz o foco no componente de input
324
- */
325
- async setFocus() {
326
- this._inputElem.focus();
327
- }
328
- componentDidLoad() {
329
- this.adjustMode();
330
- }
331
- changeValue() {
332
- if (!this.enabled) {
333
- return;
334
- }
335
- this.value = !this.value;
336
- this.ezChange.emit(this.value);
337
- }
338
- getLabelClasses() {
339
- let classes = "label";
340
- if (!this.enabled) {
341
- classes += " label--disabled";
342
- }
343
- return classes;
344
- }
345
- render() {
346
- return (index.h(index.Host, null, index.h("input", { type: "checkbox", class: "regularMode", checked: this.value === true, onChange: () => { this.changeValue(); }, disabled: !this.enabled, ref: (el) => this._inputElem = el }), this.label ? index.h("label", { class: this.getLabelClasses(), onClick: () => { this.changeValue(); }, title: this.label }, this.label) : undefined));
347
- }
348
- static get watchers() { return {
349
- "mode": ["adjustMode"]
350
- }; }
351
- };
352
- EzCheck.style = ezCheckCss;
353
-
354
- const ezCollapsibleBoxCss = ":host{--ez-collapsible-box--height:42px;--ez-collapsible-box--font-size:var(--title--medium, 14px);--ez-collapsible-box--font-family:var(--font-pattern, Arial);--ez-collapsible-box--font-weight:var(--text-weight--large, 600);--ez-collapsible-box--color:var(--title--primary);--ez-collapsible-box__btn--image--xsmall:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"12px\" width=\"7.5px\"><path d=\"M 0,10.56 4.5967752,6.0000006 0,1.3800006 1.4516132,0 7.5,6.0000006 1.4516132,12 Z\"/></svg>');--ez-collapsible-box__btn--image--small:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"14px\" width=\"8.68px\"><path d=\"M 0,12.32 5.3200012,7.0000007 0,1.6100007 1.6800004,0 8.68,7.0000007 1.6800004,14 Z\"/></svg>');--ez-collapsible-box__btn--image--medium:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>');--ez-collapsible-box__btn--image--large:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"18px\" width=\"11.25px\"><path d=\"M 0,15.84 6.8951628,9.0000009 0,2.0700009 2.1774198,0 11.25,9.0000009 2.1774198,18 Z\"/></svg>');--ez-collapsible-box__btn--image--xlarge:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"20px\" width=\"12.5px\"><path d=\"M 0,17.6 7.661292,10.000001 0,2.300001 2.4193553,0 12.5,10.000001 2.4193553,20 Z\"/></svg>');--ez-collapsible-box__btn--fill:var(--ez-collapsible-box--color);--ez-collapsible-box__btn--width:10px;--ez-collapsible-box__btn--height:16px;display:flex;flex-wrap:wrap;width:100%}.collapsible-box__title{width:100%;align-self:center;display:flex;box-sizing:border-box}.collapsible-box__label{white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;width:100%;font-family:var(--ez-collapsible-box--font-family);font-size:var(--ez-collapsible-box--font-size);font-weight:var(--ez-collapsible-box--font-weight);color:var(--ez-collapsible-box--color)}.collapsible-box__label--icon-right{white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;font-family:var(--ez-collapsible-box--font-family);font-size:var(--ez-collapsible-box--font-size);font-weight:var(--ez-collapsible-box--font-weight);color:var(--ez-collapsible-box--color)}.collapsible-box__btn{outline:none;border:none;background-color:unset;cursor:pointer;padding:1px 6px}.collapsible-box__btn::after{content:'';display:flex;background-color:var(--ez-collapsible-box__btn--fill);width:var(--ez-collapsible-box__btn--width);height:var(--ez-collapsible-box__btn--height);transition:transform var(--transition);transform:rotate(90deg)}.collapsible-box__btn--xsmall::after{width:7.5px;height:12px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--xsmall);mask-image:var(--ez-collapsible-box__btn--image--xsmall)}.collapsible-box__btn--small::after{width:8.68px;height:14px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--small);mask-image:var(--ez-collapsible-box__btn--image--small)}.collapsible-box__btn--medium::after{width:10px;height:16px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--medium);mask-image:var(--ez-collapsible-box__btn--image--medium)}.collapsible-box__btn--large::after{width:11.25px;height:18px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--large);mask-image:var(--ez-collapsible-box__btn--image--large)}.collapsible-box__btn--xlarge::after{width:12.5px;height:20px;-webkit-mask-image:var(--ez-collapsible-box__btn--image--xlarge);mask-image:var(--ez-collapsible-box__btn--image--xlarge)}.collapsible-box__btn--collapsed::after{transform:rotate(0deg)}.font--xsmall{font-size:10px}.font--small{font-size:12px}.font--medium{font-size:14px}.font--large{font-size:16px}.font--xlarge{font-size:20px}";
355
-
356
- let EzCollapsibleBox = class {
357
- constructor(hostRef) {
358
- index.registerInstance(this, hostRef);
359
- this.ezChange = index.createEvent(this, "ezChange", 7);
360
- /**
361
- * Valor externalizado que garante a exibição ou não do componente
362
- */
363
- this.value = false;
364
- /**
365
- * Define o tamanho do texto e do ícone do componente.
366
- */
367
- this.headerSize = "small";
368
- /**
369
- * Define o local onde o ícone será renderizado.
370
- */
371
- this.iconPlacement = "left";
372
- }
373
- observeValue() {
374
- this.ezChange.emit(this.value);
375
- }
376
- /**
377
- * Esconde ou revela o conteúdo do componente
378
- */
379
- async showHide() {
380
- this.value = !this.value;
381
- }
382
- render() {
383
- return (index.h(index.Host, null, this.iconPlacement == "right" ?
384
- index.h("div", { class: "collapsible-box__title" }, index.h("label", { class: (this.iconPlacement == "right" ? "collapsible-box__label--icon-right " : "collapsible-box__label ") + (this.headerSize ? "font--" + this.headerSize : ""), onClick: () => this.showHide(), title: this.label }, this.label), index.h("button", { class: this.value ? "collapsible-box__btn collapsible-box__btn--collapsed " + "collapsible-box__btn--" + this.headerSize : "collapsible-box__btn " + "collapsible-box__btn--" + this.headerSize, onClick: () => this.showHide() }))
385
- :
386
- index.h("div", { class: "collapsible-box__title" }, index.h("button", { class: this.value ? "collapsible-box__btn collapsible-box__btn--collapsed " + "collapsible-box__btn--" + this.headerSize : "collapsible-box__btn " + "collapsible-box__btn--" + this.headerSize, onClick: () => this.showHide() }), index.h("label", { class: (this.iconPlacement == "right" ? "collapsible-box__label--icon-right " : "collapsible-box__label ") + (this.headerSize ? "font--" + this.headerSize : ""), onClick: () => this.showHide(), title: this.label }, this.label)), !this.value ? index.h("slot", null) : null));
387
- }
388
- static get watchers() { return {
389
- "value": ["observeValue"]
390
- }; }
391
- };
392
- EzCollapsibleBox.style = ezCollapsibleBoxCss;
393
-
394
- class CSSVarsUtils {
395
- static applyVarsTextInput(host, child) {
396
- if (child) {
397
- CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__input--background-color');
398
- CSSVarsUtils.applyIfExists(host, child, '--ez-text-input__input--border-color');
399
- CSSVarsUtils.applyIfExists(host, child, '--ez-text-input--height');
400
- }
401
- }
402
- static applyIfExists(host, element, varName) {
403
- const prop = getComputedStyle(host).getPropertyValue(varName);
404
- if (prop) {
405
- element.style.setProperty(varName, prop);
406
- }
407
- }
408
- }
409
-
410
- const ezComboBoxCss = ":host{--ez-combo-box--height:42px;--ez-combo-box--width:100%;--ez-combo-box__icon--width:48px;--ez-combo-box--border-radius:var(--border--radius-medium, 12px);--ez-combo-box--border-radius-small:var(--border--radius-small, 6px);--ez-combo-box--font-size:var(--text--medium, 14px);--ez-combo-box--font-family:var(--font-pattern, Arial);--ez-combo-box--font-weight--large:var(--text-weight--large, 500);--ez-combo-box--font-weight--medium:var(--text-weight--medium, 400);--ez-combo-box--background-color--xlight:var(--background--xlight, #fff);--ez-combo-box--background-medium:var(--background--medium, #f0f3f7);--ez-combo-box__input--background-color:var(--background--medium, #e0e0e0);--ez-combo-box__input--border:var(--border--medium, 2px solid);--ez-combo-box__input--border-color:var(--ez-combo-box__input--background-color);--ez-combo-box__input--focus--border-color:var(--color--primary, #008561);--ez-combo-box__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-combo-box__input--disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__input--error--border-color:#CC2936;--ez-combo-box__btn-search--background-color:var(--text--primary, #626e82);--ez-combo-box__btn-search-disabled--background-color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-search-hover--background-color:var(--color--primary, #4e4e4e);--ez-combo-box__btn-options--background-color:var(--text--primary, #626e82);--ez-combo-box__btn-options-disabled--background-color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-options-hover--background-color:var(--color--primary, #4e4e4e);--ez-combo-box__label--color:var(--title--primary, #919191);--ez-combo-box__list-text--primary:var(--text--primary, #626e82);--ez-combo-box__list-height:calc(var(--ez-combo-box--font-size) + var(--ez-combo-box--space--medium));--ez-combo-box__drop-down-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"16px\"><path d=\"M 1.8585859,3.0707069 7.9999998,9.2121212 14.141414,3.0707069 16,5.0101006 7.9999998,12.929293 0,4.9292932 Z\"/></svg>');--ez-combo-box__search-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"22px\" width=\"22px\"><path d=\"m 9.4,2.3 c 4.1,0 7.4,3.2 7.4,7.2 0,1.8 -0.7,3.4 -1.8,4.7 l 0.3,0.3 h 0.9 l 5.7,5.6 -1.7,1.7 -5.7,-5.6 V 15.3 L 14.3,15 C 13,16.1 11.3,16.7 9.5,16.7 5.3,16.7 2,13.5 2,9.5 2,5.5 5.3,2.3 9.4,2.3 m 0,2.2 c -2.9,0 -5.1,2.2 -5.1,5 0,2.8 2.3,5 5.1,5 2.8,0 5.1,-2.2 5.1,-5 0,-2.8 -2.2,-5 -5.1,-5 z\"/></svg>');--ez-combo-box--space--medium:var(--space--medium, 12px);--ez-combo-box--space--small:var(--space--small, 6px);display:flex;flex-wrap:wrap;position:relative;width:var(--ez-combo-box--width)}.list-container{position:relative;width:100%}.options-list{box-sizing:border-box;width:100%;z-index:var(--more-visible, 2);display:flex;flex-direction:column;background-color:var(--ez-combo-box--background-color--xlight);padding:var(--ez-combo-box--space--small);border-radius:var(--ez-combo-box--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);scroll-behavior:smooth;max-height:calc(4*var(--ez-combo-box__list-height) + 2*var(--ez-combo-box--space--small));overflow:auto}.item{text-align:left;display:flex;justify-content:space-between;align-items:center;border-radius:var(--ez-combo-box--border-radius-small);padding:0 var(--ez-combo-box--space--small);list-style-type:none;min-height:var(--ez-combo-box__list-height)}.item--label{text-align:left;flex-basis:85%;flex-grow:1;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large);font-family:var(--ez-combo-box--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item--value{text-align:right;flex-basis:15%;flex-grow:0;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large);font-family:var(--ez-combo-box--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}li:hover{background-color:var(--ez-combo-box--background-medium)}.preselected{background-color:var(--background--medium)}.btn-open-options{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-options:disabled{cursor:unset}.btn-open-options::after{content:'';display:flex;background-color:var(--ez-combo-box__btn-options--background-color);width:16px;height:16px;-webkit-mask-image:var(--ez-combo-box__drop-down-image);mask-image:var(--ez-combo-box__drop-down-image)}.btn-open-options:disabled:after{background-color:var(--ez-combo-box__btn-options-disabled--background-color)}.btn-open-options:enabled:hover::after{background-color:var(--ez-combo-box__btn-options-hover--background-color)}.btn-open-search{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-search:disabled{cursor:unset}.btn-open-search::after{content:'';display:flex;background-color:var(--ez-combo-box__btn-search--background-color);width:22px;height:22px;-webkit-mask-image:var(--ez-combo-box__search-image);mask-image:var(--ez-combo-box__search-image)}.btn-open-search:disabled:after{background-color:var(--ez-combo-box__btn-search-disabled--background-color)}.btn-open-search:enabled:hover::after{background-color:var(--ez-combo-box__btn-search-hover--background-color)}";
411
-
412
- let EzComboBox = class {
413
- constructor(hostRef) {
414
- index.registerInstance(this, hostRef);
415
- this.ezChange = index.createEvent(this, "ezChange", 7);
416
- /**
417
- * Deixa o campo disponível ou não para interação com usuário.
418
- */
419
- this.enabled = true;
420
- /**
421
- * Ajusta a opção de mostrar o "value" ao selecionar uma opção. Por padrão não mostra.
422
- */
423
- this.showSelectedValue = false;
424
- /**
425
- * Ajusta a opção de mostrar o "value" para cada opção. Por padrão não mostra
426
- */
427
- this.showOptionValue = false;
428
- /**
429
- * Remove a opção vazia da lista de opções
430
- */
431
- this.suppressEmptyOption = false;
432
- /**
433
- * Permite exibir a mensagem de erro.
434
- */
435
- this.canShowError = true;
436
- }
437
- internalUpdate() {
438
- if (this._inputElement) {
439
- this._inputElement.value = this.getText();
440
- }
441
- this.hideOptions();
442
- this._criteria = undefined;
443
- this._preSelection = undefined;
444
- this.updateVisibleOptions();
445
- }
446
- /**
447
- * Realiza o foco no componente de seleção
448
- */
449
- async setFocus() {
450
- this._inputElement.setFocus();
451
- }
452
- /**
453
- * Remove o foco no componente de seleção
454
- */
455
- async setBlur() {
456
- this._inputElement.setBlur();
457
- }
458
- getText() {
459
- let text = "";
460
- const selected = this.getSelectedOption();
461
- if (selected) {
462
- text = this.showSelectedValue ? `${selected.value} - ${selected.label}` : selected.label;
463
- }
464
- return text;
465
- }
466
- getSelectedOption() {
467
- if (typeof this.value === "string" || this.value instanceof String) {
468
- return this._visibleOptions.find(o => o.value === this.value);
469
- }
470
- return this.value;
471
- }
472
- updateVisibleOptions() {
473
- let opts = this._source || [];
474
- if (!this.searchMode && this._criteria) {
475
- const upperCriteria = this._criteria.toUpperCase();
476
- opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
477
- }
478
- if (this.suppressEmptyOption) {
479
- this._visibleOptions = opts;
480
- }
481
- else {
482
- this._visibleOptions = [{ value: undefined, label: "" }].concat(opts);
483
- }
484
- }
485
- buildItem(opt, index$1) {
486
- return index.h("li", { class: index$1 === this._preSelection ? "item preselected" : "item", id: `item_${opt.value}`, onMouseDown: () => this.selectOption(opt), onMouseOver: () => this._preSelection = undefined }, index.h("span", { class: "item--label", title: opt.label }, opt.label), this.showOptionValue ? index.h("span", { class: "item--value", title: opt.value }, opt.value) : undefined);
487
- }
488
- showOptions() {
489
- if (!this.enabled) {
490
- return;
491
- }
492
- //FIXME: Provavelmente isso fará com que o popup abra em uma
493
- //posição errada no futuro. Preferi fazer simples no começo,
494
- //porque não quis onerar o text input com essa funcionalidade...
495
- const top = (this.errorMessage || !this.canShowError) ? "0px" : "-17px";
496
- this._floatingID = FloatingManager.FloatingManager.float(this._optionsList, this._listContainer, { autoClose: true, top });
497
- window.requestAnimationFrame(() => {
498
- this._optionsList.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
499
- });
500
- }
501
- hideOptions() {
502
- if (this._floatingID !== undefined) {
503
- FloatingManager.FloatingManager.close(this._floatingID);
504
- }
505
- this._floatingID = undefined;
506
- }
507
- isOptionsVisible() {
508
- return this._floatingID !== undefined && FloatingManager.FloatingManager.isFloating(this._floatingID);
509
- }
510
- nextOption() {
511
- if (this.searchMode && !this.isOptionsVisible()) {
512
- return;
513
- }
514
- this.showOptions();
515
- this._preSelection = this._preSelection === undefined ? 0 : Math.min(this._preSelection + 1, this._visibleOptions.length - 1);
516
- this.scrollToOption(this._visibleOptions[this._preSelection], true);
517
- }
518
- previousOption() {
519
- this._preSelection = this._preSelection === undefined ? 0 : Math.max(this._preSelection - 1, 0);
520
- this.scrollToOption(this._visibleOptions[this._preSelection], false);
521
- }
522
- scrollToOption(opt, down) {
523
- window.requestAnimationFrame(() => {
524
- const liElem = this._optionsList.querySelector(`li#item_${opt.value}`);
525
- if (liElem) {
526
- const parent = liElem.parentElement;
527
- const parentRect = parent.getBoundingClientRect();
528
- const itemRect = liElem.getBoundingClientRect();
529
- if (down && itemRect.bottom > parentRect.bottom) {
530
- parent.scrollTop = itemRect.top;
531
- }
532
- else if (!down && itemRect.top < parentRect.top) {
533
- parent.scrollTop = 0;
534
- }
535
- }
536
- });
537
- }
538
- selectCurrentOption() {
539
- if (this._preSelection !== undefined) {
540
- this.selectOption(this._visibleOptions[this._preSelection]);
541
- this._preSelection = undefined;
542
- }
543
- }
544
- selectOption(opt) {
545
- const currentOpt = this.getSelectedOption();
546
- if (currentOpt !== opt) {
547
- const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? undefined : opt;
548
- this.value = adjustedOpt;
549
- this.errorMessage = "";
550
- this.ezChange.emit(adjustedOpt);
551
- }
552
- else {
553
- this.internalUpdate();
554
- }
555
- }
556
- updateSource(source) {
557
- if (source instanceof Promise) {
558
- source.then(result => this.updateSource(result));
559
- this.updateVisibleOptions();
560
- }
561
- else {
562
- this._source = source;
563
- this.updateVisibleOptions();
564
- }
565
- }
566
- loadOptions(mode, argument = "") {
567
- this._criteria = argument;
568
- if (this.optionLoader) {
569
- this.updateSource(this.optionLoader({ mode, argument }));
570
- }
571
- else {
572
- this.updateSource(this.options);
573
- }
574
- }
575
- cancelPreselection() {
576
- if (!this._inputElement.value && this.value) {
577
- this.selectOption(undefined);
578
- }
579
- else {
580
- this.internalUpdate();
581
- }
582
- }
583
- //---------------------------------------------
584
- // Lifecycle web component
585
- //---------------------------------------------
586
- componentWillLoad() {
587
- if (this.options === undefined) {
588
- this.options = [];
589
- const optionsTags = this.el.querySelectorAll("option");
590
- if (optionsTags) {
591
- optionsTags.forEach(e => {
592
- let label = e.innerText;
593
- let value = e.getAttribute("value");
594
- if (!value) {
595
- value = label;
596
- }
597
- this.options.push({ label, value });
598
- e.hidden = true;
599
- });
600
- }
601
- }
602
- if (this.searchMode) {
603
- this.updateSource([]);
604
- }
605
- else {
606
- this.loadOptions("PRELOAD");
607
- }
608
- }
609
- componentDidRender() {
610
- if (this._floatingID === undefined) {
611
- this._optionsList.remove();
612
- }
613
- }
614
- componentDidLoad() {
615
- CSSVarsUtils.applyVarsTextInput(this.el, this._inputElement);
616
- }
617
- //---------------------------------------------
618
- // Event handlers
619
- //---------------------------------------------
620
- onTextInputChangeHandler(event) {
621
- if (!this._criteria) {
622
- this._inputElement.value = event.data;
623
- }
624
- const argument = event.target.value;
625
- this._criteria = argument;
626
- if (this._criteria) {
627
- if (this.searchMode) {
628
- if (this._changeDeboucingTimeout) {
629
- window.clearTimeout(this._changeDeboucingTimeout);
630
- }
631
- this._changeDeboucingTimeout = window.setTimeout(() => {
632
- this.loadOptions("PREDICTIVE", argument);
633
- }, 200);
634
- }
635
- else {
636
- this.updateVisibleOptions();
637
- }
638
- this.showOptions();
639
- }
640
- }
641
- onTextInputClickHandler() {
642
- if (!this.searchMode) {
643
- this.showOptions();
644
- }
645
- }
646
- keyDownHandler(event) {
647
- switch (event.key) {
648
- case "ArrowDown":
649
- this.nextOption();
650
- break;
651
- case "ArrowUp":
652
- this.previousOption();
653
- break;
654
- case "Enter":
655
- this.selectCurrentOption();
656
- break;
657
- case "Escape":
658
- this.cancelPreselection();
659
- break;
660
- }
661
- event.stopPropagation();
662
- }
663
- onTextInputFocusOutHandler() {
664
- this.cancelPreselection();
665
- }
666
- render() {
667
- return (index.h(index.Host, null, index.h("ez-text-input", { ref: elem => this._inputElement = elem, enabled: this.enabled, onInput: evt => this.onTextInputChangeHandler(evt), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onEzChange: event => event.stopPropagation(), onKeyDown: event => this.keyDownHandler(event), label: this.label, value: this.getText(), canShowError: this.canShowError, errorMessage: this.errorMessage }, this.searchMode ?
668
- index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-search", onClick: () => { this.loadOptions("ADVANCED"); }, slot: "leftIcon" })
669
- :
670
- index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-options", slot: "rightIcon", onClick: () => this.showOptions() })), index.h("section", { class: "list-container", ref: elem => this._listContainer = elem }, index.h("div", { class: "options-list", ref: elem => this._optionsList = elem }, this._visibleOptions.map((opt, index) => this.buildItem(opt, index))))));
671
- }
672
- get el() { return index.getElement(this); }
673
- static get watchers() { return {
674
- "value": ["internalUpdate"]
675
- }; }
676
- };
677
- EzComboBox.style = ezComboBoxCss;
678
-
679
- const ezDateInputCss = ":host{display:block;width:100%;--ez-date-input__input--background-color:var(--background--medium, #e0e0e0);--ez-date-input__input--border-color:var(--ez-date-input__input--background-color);--ez-date-input__calendar-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"15px\"><path d=\"M 3.171875,5.25 C 2.6485088,5.25 2.21875,5.6797588 2.21875,6.203125 2.21875,6.7264912 2.6485088,7.15625 3.171875,7.15625 3.6952412,7.15625 4.125,6.7264912 4.125,6.203125 4.125,5.6797588 3.6952412,5.25 3.171875,5.25 Z m 2.875,0 C 5.5235088,5.25 5.09375,5.6797588 5.09375,6.203125 5.09375,6.7264912 5.5235088,7.15625 6.046875,7.15625 6.5702412,7.15625 7,6.7264912 7,6.203125 7,5.6797588 6.5702412,5.25 6.046875,5.25 Z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.9511719,-0.4297588 0.9511719,-0.953125 C 9.8730469,5.6797588 9.4452412,5.25 8.921875,5.25 Z m 2.873047,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.953125 0.953125,0.953125 0.523366,0 0.953125,-0.4297588 0.953125,-0.953125 C 12.748047,5.6797588 12.318288,5.25 11.794922,5.25 Z M 3.171875,8.1230469 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 0.5233662,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 C 6.5702412,10.029297 7,9.5995381 7,9.0761719 7,8.5528057 6.5702412,8.1230469 6.046875,8.1230469 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297587,0.9531251 0.953125,0.9531251 0.5233661,0 0.9531249,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.9531251 0.953125,0.9531251 0.523367,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.171875,10.998047 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 C 6.5702412,12.904297 7,12.474538 7,11.951172 7,11.427806 6.5702412,10.998047 6.046875,10.998047 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297587,0.953125 0.953125,0.953125 0.5233661,0 0.9531249,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.429759,0.953125 0.953125,0.953125 0.523367,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.5,0 c -0.554,0 -1,0.446 -1,1 v 0.050781 C 1.0853217,1.2909766 0,2.5186658 0,4 v 9 c 0,1.652487 1.3475134,3 3,3 h 9 c 1.652487,0 3,-1.347513 3,-3 V 4 C 15,2.5186658 13.914678,1.2909766 12.5,1.0507812 V 1 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 C 4.5,0.446 4.054,0 3.5,0 Z m 1,2.0996094 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 v -0.640625 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 V 2.1738281 C 13.311725,2.3905225 13.900391,3.11278 13.900391,4 v 9 c 0,1.062113 -0.838278,1.900391 -1.900391,1.900391 H 3 C 1.9378864,14.900391 1.0996094,14.062113 1.0996094,13 V 4 C 1.0996094,3.11278 1.6882747,2.3905225 2.5,2.1738281 v 0.5664063 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 z\"/></svg>')}.btn-open-cal{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-cal:disabled{cursor:unset}.btn-open-cal::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:15px;height:16px;-webkit-mask-image:var(--ez-date-input__calendar-image);mask-image:var(--ez-date-input__calendar-image)}.btn-open-cal:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-cal:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}ez-text-input{--text-input__input--background-color:var(--ez-date-input__input--background-color, #FFFFFF);--text-input__input--border-color:var(--ez-date-input__input--border-color, #DCE0E8)}";
680
-
681
- let EzDateInput = class {
682
- constructor(hostRef) {
683
- index.registerInstance(this, hostRef);
684
- this.ezChange = index.createEvent(this, "ezChange", 7);
685
- /**
686
- * Deixa o campo disponível ou não para uso.
687
- */
688
- this.enabled = true;
689
- }
690
- setLabel() {
691
- this._textInput.label = this.label;
692
- }
693
- setErrorMessage() {
694
- this._textInput.errorMessage = this.errorMessage;
695
- }
696
- applyValueToInput() {
697
- if (this._textInput) {
698
- this._textInput.value = this.getTextValue(this.value);
699
- }
700
- }
701
- /**
702
- * Realiza o foco no componente de data
703
- */
704
- async setFocus() {
705
- this._textInput.setFocus();
706
- }
707
- /**
708
- * Remove o foco no componente de data
709
- */
710
- async setBlur() {
711
- this._textInput.setBlur();
712
- }
713
- changeValue(newValue) {
714
- var _a;
715
- newValue = newValue instanceof Date ? DateUtils.clearTime(newValue) : null;
716
- this.value = this.value instanceof Date ? DateUtils.clearTime(this.value) : null;
717
- this._textInput.errorMessage = "";
718
- if ((newValue === null || newValue === void 0 ? void 0 : newValue.toString()) !== ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toString())) {
719
- this.value = newValue;
720
- this.ezChange.emit(this.value);
721
- }
722
- }
723
- showCalendar() {
724
- this.parseDate();
725
- this._calendar.value = this.value;
726
- //FIXME: Provavelmente isso fará com que o popup abra em uma
727
- //posição errada no futuro. Preferi fazer simples no começo,
728
- //porque não quis onerar o text input com essa funcionalidade...
729
- const top = this._textInput.errorMessage ? 0 : -17;
730
- this._calendar.fitVertical(top, this._elem.clientHeight);
731
- }
732
- hideCalendar() {
733
- this.changeValue(this._calendar.value);
734
- this._calendar.hide();
735
- }
736
- parseDate() {
737
- const strValue = this._textInput.value;
738
- const parsedDate = DateUtils.strToDate(strValue);
739
- if (parsedDate || !strValue) {
740
- if (this.value === parsedDate) {
741
- this.changeValue(this.value);
742
- }
743
- else {
744
- this.changeValue(parsedDate);
745
- }
746
- }
747
- else {
748
- this._textInput.errorMessage = "O valor digitado não é uma data válida";
749
- }
750
- }
751
- getTextValue(d) {
752
- return d ? new Intl.DateTimeFormat("pt-BR").format(d) : null;
753
- }
754
- componentDidLoad() {
755
- CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
756
- }
757
- render() {
758
- return (index.h(index.Host, null, index.h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => {
759
- if (event.key === "H" || event.key === "h")
760
- this.changeValue(new Date());
761
- }, label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), index.h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
762
- }
763
- get _elem() { return index.getElement(this); }
764
- static get watchers() { return {
765
- "label": ["setLabel"],
766
- "errorMessage": ["setErrorMessage"],
767
- "value": ["applyValueToInput"]
768
- }; }
769
- };
770
- EzDateInput.style = ezDateInputCss;
771
-
772
- const ezDateTimeInputCss = ":host{display:block;width:100%;--ez-date-input__input--background-color:var(--background--medium, #e0e0e0);--ez-date-input__input--border-color:var(--ez-date-input__input--background-color);--ez-date-input__calendar-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"15px\"><path d=\"M 3.171875,5.25 C 2.6485088,5.25 2.21875,5.6797588 2.21875,6.203125 2.21875,6.7264912 2.6485088,7.15625 3.171875,7.15625 3.6952412,7.15625 4.125,6.7264912 4.125,6.203125 4.125,5.6797588 3.6952412,5.25 3.171875,5.25 Z m 2.875,0 C 5.5235088,5.25 5.09375,5.6797588 5.09375,6.203125 5.09375,6.7264912 5.5235088,7.15625 6.046875,7.15625 6.5702412,7.15625 7,6.7264912 7,6.203125 7,5.6797588 6.5702412,5.25 6.046875,5.25 Z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.9511719,-0.4297588 0.9511719,-0.953125 C 9.8730469,5.6797588 9.4452412,5.25 8.921875,5.25 Z m 2.873047,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.953125 0.953125,0.953125 0.523366,0 0.953125,-0.4297588 0.953125,-0.953125 C 12.748047,5.6797588 12.318288,5.25 11.794922,5.25 Z M 3.171875,8.1230469 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 0.5233662,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 C 6.5702412,10.029297 7,9.5995381 7,9.0761719 7,8.5528057 6.5702412,8.1230469 6.046875,8.1230469 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297587,0.9531251 0.953125,0.9531251 0.5233661,0 0.9531249,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.9531251 0.953125,0.9531251 0.523367,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.171875,10.998047 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 C 6.5702412,12.904297 7,12.474538 7,11.951172 7,11.427806 6.5702412,10.998047 6.046875,10.998047 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297587,0.953125 0.953125,0.953125 0.5233661,0 0.9531249,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.429759,0.953125 0.953125,0.953125 0.523367,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.5,0 c -0.554,0 -1,0.446 -1,1 v 0.050781 C 1.0853217,1.2909766 0,2.5186658 0,4 v 9 c 0,1.652487 1.3475134,3 3,3 h 9 c 1.652487,0 3,-1.347513 3,-3 V 4 C 15,2.5186658 13.914678,1.2909766 12.5,1.0507812 V 1 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 C 4.5,0.446 4.054,0 3.5,0 Z m 1,2.0996094 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 v -0.640625 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 V 2.1738281 C 13.311725,2.3905225 13.900391,3.11278 13.900391,4 v 9 c 0,1.062113 -0.838278,1.900391 -1.900391,1.900391 H 3 C 1.9378864,14.900391 1.0996094,14.062113 1.0996094,13 V 4 C 1.0996094,3.11278 1.6882747,2.3905225 2.5,2.1738281 v 0.5664063 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 z\"/></svg>')}.btn-open-cal{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-cal:disabled{cursor:unset}.btn-open-cal::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:15px;height:16px;-webkit-mask-image:var(--ez-date-input__calendar-image);mask-image:var(--ez-date-input__calendar-image)}.btn-open-cal:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-cal:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}ez-text-input{--text-input__input--background-color:var(--ez-date-input__input--background-color, #FFFFFF);--text-input__input--border-color:var(--ez-date-input__input--border-color, #DCE0E8)}";
773
-
774
- let EzDateTimeInput = class {
775
- constructor(hostRef) {
776
- index.registerInstance(this, hostRef);
777
- this.ezChange = index.createEvent(this, "ezChange", 7);
778
- /**
779
- * Deixa o campo disponível ou não para uso.
780
- */
781
- this.enabled = true;
782
- /**
783
- * Exibe ou não os segundos no input
784
- */
785
- this.showSeconds = false;
786
- }
787
- setLabel() {
788
- this._textInput.label = this.label;
789
- }
790
- setErrorMessage() {
791
- this._textInput.errorMessage = this.errorMessage;
792
- }
793
- applyValueToInput() {
794
- if (this._textInput) {
795
- this._textInput.value = this.getTextValue(this.value);
796
- }
797
- }
798
- /**
799
- * Realiza o foco no componente de datetime
800
- */
801
- async setFocus() {
802
- this._textInput.setFocus();
803
- }
804
- /**
805
- * Remove o foco no componente de datetime
806
- */
807
- async setBlur() {
808
- this._textInput.setBlur();
809
- }
810
- onChangeKeyDown(ev) {
811
- const input = this._textInput.shadowRoot.querySelector('input');
812
- if (ev.key === "H" || ev.key === "h") {
813
- this.changeValue(new Date());
814
- }
815
- else if (ev.shiftKey && ev.key === "Tab") {
816
- if (input.selectionStart > 0) {
817
- let selectIni = input.value.lastIndexOf(" ", input.selectionStart);
818
- if (selectIni !== -1) {
819
- input.setSelectionRange(0, selectIni);
820
- ev.preventDefault();
821
- }
822
- }
823
- }
824
- else if (ev.key === "Tab") {
825
- if (input.value.length !== input.selectionEnd) {
826
- let selectIni = input.value.indexOf(" ", input.selectionEnd);
827
- selectIni = selectIni === -1 ? input.selectionEnd : selectIni + 1;
828
- input.setSelectionRange(selectIni, input.value.length);
829
- ev.preventDefault();
830
- }
831
- }
832
- }
833
- onFocused() {
834
- const input = this._textInput.shadowRoot.querySelector('input');
835
- if (input.selectionStart !== input.selectionEnd) {
836
- let selectIni = input.value.indexOf(" ", input.selectionStart);
837
- selectIni = selectIni === -1 ? input.value.length : selectIni;
838
- input.setSelectionRange(0, selectIni);
839
- }
840
- }
841
- onClicked() {
842
- const input = this._textInput.shadowRoot.querySelector('input');
843
- let selectIni = input.value.lastIndexOf(" ", input.selectionEnd);
844
- selectIni = selectIni === -1 ? 0 : selectIni + 1;
845
- selectIni = selectIni > input.selectionEnd ? 0 : selectIni;
846
- let selectFin = selectIni === 0 ? input.value.indexOf(" ") : input.value.length;
847
- input.setSelectionRange(selectIni, selectFin);
848
- }
849
- changeValue(newValue) {
850
- var _a;
851
- this._textInput.errorMessage = "";
852
- if ((newValue === null || newValue === void 0 ? void 0 : newValue.toString()) !== ((_a = this.value) === null || _a === void 0 ? void 0 : _a.toString())) {
853
- this.value = newValue;
854
- this.ezChange.emit(this.value);
855
- }
856
- }
857
- showCalendar() {
858
- const top = this._textInput.errorMessage ? 0 : -17;
859
- this._calendar.fitVertical(top, this._elem.clientHeight);
860
- this._calendar.style.visibility = 'inherit';
861
- }
862
- parseDate() {
863
- const strValue = this._textInput.value;
864
- const partsDateTime = (strValue && strValue.length > 0) ? strValue.split(" ") : [];
865
- const onlyDate = partsDateTime.length > 0 ? partsDateTime[0] : strValue;
866
- const onlyTime = partsDateTime[1] ? partsDateTime[1] : "";
867
- const parsedTime = UnitMetadata.TimeFormatter.prepareValue(onlyTime, this.showSeconds);
868
- const strDateTime = onlyDate + (parsedTime && " " + parsedTime);
869
- const parsedDate = DateUtils.strToDate(strDateTime);
870
- if (parsedDate || !strValue) {
871
- if (this.value === parsedDate) {
872
- this.changeValue(this.value);
873
- }
874
- else {
875
- this.changeValue(parsedDate);
876
- }
877
- }
878
- else {
879
- this._textInput.errorMessage = "O valor digitado não é uma data válida";
880
- }
881
- }
882
- getTextValue(d) {
883
- const options = {
884
- year: 'numeric', month: 'numeric', day: 'numeric',
885
- hour: 'numeric', minute: 'numeric'
886
- };
887
- const optionsSecond = {
888
- year: 'numeric', month: 'numeric', day: 'numeric',
889
- hour: 'numeric', minute: 'numeric', second: 'numeric'
890
- };
891
- return d ? (new Intl.DateTimeFormat('pt-BR', this.showSeconds ? optionsSecond : options).format(d)) : null;
892
- }
893
- componentDidLoad() {
894
- CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
895
- }
896
- render() {
897
- return (index.h(index.Host, null, index.h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => { this.onChangeKeyDown(event); }, label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, onFocus: () => this.onFocused(), onClick: () => this.onClicked() }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), index.h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
898
- }
899
- get _elem() { return index.getElement(this); }
900
- static get watchers() { return {
901
- "label": ["setLabel"],
902
- "errorMessage": ["setErrorMessage"],
903
- "value": ["applyValueToInput"]
904
- }; }
905
- };
906
- EzDateTimeInput.style = ezDateTimeInputCss;
907
-
908
- const buildTextArea = ({ name, label, readOnly }) => {
909
- return (index.h("div", { class: "col col--sd-12 padding-horizontal--small", key: name },
910
- index.h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name })));
911
- };
912
-
913
- const buildTextInput = ({ name, label }) => {
914
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
915
- index.h("ez-text-input", { label: label, "data-field-name": name, key: name })));
916
- };
917
-
918
- const buildSwitch = (fieldConfig) => {
919
- return buildField$1(fieldConfig.name, fieldConfig.label, fieldConfig.readOnly, true);
920
- };
921
- const buildCheckBox = (fieldConfig) => {
922
- return buildField$1(fieldConfig.name, fieldConfig.label, fieldConfig.readOnly, false);
923
- };
924
- function buildField$1(fieldName, fieldLabel, readOnly, switchMode = false) {
925
- return (index.h("div", { class: "col col--sd-12 col--tb-3 align--middle padding-horizontal--small padding-bottom--large" },
926
- index.h("ez-check", { enabled: !readOnly, label: fieldLabel, mode: switchMode ? "switch" : "regular", "data-field-name": fieldName, key: fieldName })));
927
- }
928
-
929
- const buildComboBox = ({ name, label, readOnly }, properties) => {
930
- const prop = properties === null || properties === void 0 ? void 0 : properties.options;
931
- let options;
932
- if (typeof prop === "string") {
933
- const parsed = JSON.parse(prop);
934
- options = Object.keys(parsed).map(key => { return { value: key, label: parsed[key] }; });
935
- }
936
- else {
937
- options = prop;
938
- }
939
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
940
- index.h("ez-combo-box", { enabled: !readOnly, label: label, "data-field-name": name, key: name, options: options })));
941
- };
942
-
943
- const buildSearch = ({ name, label, readOnly }) => {
944
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
945
- index.h("ez-search", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
946
- };
947
-
948
- const buildFile = ({ name, label, readOnly }) => {
949
- return (index.h("div", { class: "col col--sd-12 padding-horizontal--small" },
950
- index.h("ez-upload", { enabled: !readOnly, label: label, urlUpload: "", requestHeaders: "", maxFiles: 10, "data-field-name": name, key: name })));
951
- };
952
-
953
- const buildDate = ({ name, label, readOnly }) => {
954
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
955
- index.h("ez-date-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
956
- };
957
- const buildTime = ({ name, label }) => {
958
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
959
- index.h("ez-time-input", { label: label, "data-field-name": name, key: name })));
960
- };
961
- const buildTimeDate = ({ name, label }) => {
962
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
963
- index.h("ez-date-time-input", { label: label, "data-field-name": name, key: name })));
964
- };
965
-
966
- const buildDecimal = ({ name, label, readOnly }, properties) => {
967
- const precision = Number((properties === null || properties === void 0 ? void 0 : properties.precision) || 2);
968
- const prettyPrecision = Number((properties === null || properties === void 0 ? void 0 : properties.prettyPrecision) || precision);
969
- return buildNumeric(name, label, readOnly, precision, prettyPrecision);
970
- };
971
- const buildInteger = ({ name, label, readOnly }) => {
972
- return buildNumeric(name, label, readOnly, 0, 0);
973
- };
974
- function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision) {
975
- return (index.h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
976
- index.h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, key: fieldName })));
977
- }
978
-
979
- const uiBuilders = new Map();
980
- uiBuilders.set(UnitMetadata.UserInterface.LONGTEXT, buildTextArea);
981
- uiBuilders.set(UnitMetadata.UserInterface.CHECKBOX, buildCheckBox);
982
- uiBuilders.set(UnitMetadata.UserInterface.SWITCH, buildSwitch);
983
- uiBuilders.set(UnitMetadata.UserInterface.OPTIONSELECTOR, buildComboBox);
984
- uiBuilders.set(UnitMetadata.UserInterface.SEARCH, buildSearch);
985
- uiBuilders.set(UnitMetadata.UserInterface.FILE, buildFile);
986
- uiBuilders.set(UnitMetadata.UserInterface.DATE, buildDate);
987
- uiBuilders.set(UnitMetadata.UserInterface.TIME, buildTime);
988
- uiBuilders.set(UnitMetadata.UserInterface.DATETIME, buildTimeDate);
989
- uiBuilders.set(UnitMetadata.UserInterface.DECIMALNUMBER, buildDecimal);
990
- uiBuilders.set(UnitMetadata.UserInterface.INTEGERNUMBER, buildInteger);
991
- const buildField = (field) => {
992
- const descriptor = field.descriptor;
993
- const config = Object.assign({}, field.config);
994
- let builder;
995
- let props;
996
- if (descriptor) {
997
- if (!config.label) {
998
- config.label = descriptor.label;
999
- }
1000
- if (!config.name) {
1001
- config.name = descriptor.name;
1002
- }
1003
- if (config.required === undefined) {
1004
- config.required = descriptor.required;
1005
- }
1006
- if (config.readOnly === undefined) {
1007
- config.readOnly = descriptor.readOnly;
1008
- }
1009
- props = descriptor.properties;
1010
- builder = uiBuilders.get(descriptor.userInterface);
1011
- }
1012
- if (config.required) {
1013
- config.label = `* ${config.label} (obrigatório)`;
1014
- }
1015
- if (!builder) {
1016
- builder = buildTextInput;
1017
- }
1018
- return builder(config, props);
1019
- };
1020
-
1021
- const FormItem = ({ source }) => {
1022
- if ("items" in source) {
1023
- const fieldSet = source;
1024
- return index.h("ez-collapsible-box", { label: source.label }, fieldSet.items.map(fi => buildField(fi)));
1025
- }
1026
- else {
1027
- return buildField(source);
1028
- }
1029
- };
1030
-
1031
- const FormSheet = ({ store, source }) => {
1032
- return (index.h("div", { class: "box__container" },
1033
- index.h("div", { class: "row padding-vertical--small" }, source.items.map(item => index.h(FormItem, { store: store, source: item })))));
1034
- };
1035
-
1036
- class FormMetadata {
1037
- constructor() {
1038
- this._sheets = new Map();
1039
- this._requiredFields = [];
1040
- this._cleanOnCopyFields = [];
1041
- }
1042
- getSheet(name) {
1043
- return this._sheets.get(name);
1044
- }
1045
- getAllSheets() {
1046
- return this._sheets;
1047
- }
1048
- addSheet(sheet) {
1049
- this._sheets.set(sheet.name, sheet);
1050
- this._requiredFields = this._requiredFields.concat(sheet.requiredFields);
1051
- this._cleanOnCopyFields = this._cleanOnCopyFields.concat(sheet.cleanOnCopyFields);
1052
- }
1053
- getRequiredFields() {
1054
- return this._requiredFields;
1055
- }
1056
- getCleanOnCopyFields() {
1057
- return this._cleanOnCopyFields;
1058
- }
1059
- }
1060
- const buildFromDataUnit = (dataUnit) => {
1061
- var _a;
1062
- const unitMD = dataUnit.metadata;
1063
- const metadata = new FormMetadata();
1064
- if (unitMD) {
1065
- const visibleFields = (_a = unitMD.fields) === null || _a === void 0 ? void 0 : _a.filter(descriptor => descriptor.visible !== false);
1066
- metadata.addSheet({
1067
- label: unitMD.label,
1068
- name: unitMD.name,
1069
- items: visibleFields.map(descriptor => { return { descriptor }; }),
1070
- requiredFields: visibleFields
1071
- .filter(descriptor => descriptor.required)
1072
- .map(descriptor => descriptor.name),
1073
- cleanOnCopyFields: visibleFields
1074
- .filter(descriptor => { var _a; return (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy; })
1075
- .map(descriptor => descriptor.name)
1076
- });
1077
- }
1078
- return metadata;
1079
- };
1080
- function getTabConfig(tab, sheets) {
1081
- const tabConfig = (typeof tab === "string" ? Array.from(sheets.keys()).find(t => t.label === tab) : tab);
1082
- return tabConfig || { label: tab, visible: true };
1083
- }
1084
- const buildFromConfig = (fields, dataUnit) => {
1085
- const sheets = new Map();
1086
- const requiredFields = [];
1087
- const cleanOnCopyFields = [];
1088
- fields.forEach(config => {
1089
- var _a;
1090
- if (config.visible !== false) {
1091
- const tabConfig = getTabConfig(config.tab || "Geral", sheets);
1092
- const descriptor = dataUnit.getField(config.name);
1093
- if (descriptor && tabConfig.visible) {
1094
- if (!sheets.has(tabConfig)) {
1095
- sheets.set(tabConfig, new Map());
1096
- }
1097
- const tabItens = sheets.get(tabConfig);
1098
- const isRequired = config.required === undefined ? descriptor.required : config.required;
1099
- if (isRequired) {
1100
- requiredFields.push(config.name);
1101
- }
1102
- const clearOnCopy = config.cleanOnCopy === undefined ? (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy : config.cleanOnCopy;
1103
- if (clearOnCopy) {
1104
- cleanOnCopyFields.push(config.name);
1105
- }
1106
- const fieldMD = { config, descriptor };
1107
- const group = config.group;
1108
- if (group) {
1109
- const key = `group::${group}`;
1110
- if (!tabItens.has(key)) {
1111
- tabItens.set(key, { label: group, items: [fieldMD] });
1112
- }
1113
- else {
1114
- tabItens.get(key).items.push(fieldMD);
1115
- }
1116
- }
1117
- else {
1118
- tabItens.set(config.name, fieldMD);
1119
- }
1120
- }
1121
- }
1122
- });
1123
- const metadata = new FormMetadata();
1124
- Array.from(sheets.entries())
1125
- .sort((a, b) => (a[0].order || 10000) - (b[0].order || 10000))
1126
- .forEach(([key, value]) => {
1127
- metadata.addSheet({
1128
- label: key.label,
1129
- name: key.label,
1130
- items: Array.from(value.values()),
1131
- requiredFields,
1132
- cleanOnCopyFields
1133
- });
1134
- });
1135
- return metadata;
1136
- };
1137
-
1138
- /**
1139
- * Adapted from React: https://github.com/facebook/react/blob/master/packages/shared/formatProdErrorMessage.js
1140
- *
1141
- * Do not require this module directly! Use normal throw error calls. These messages will be replaced with error codes
1142
- * during build.
1143
- * @param {number} code
1144
- */
1145
- function formatProdErrorMessage(code) {
1146
- return "Minified Redux error #" + code + "; visit https://redux.js.org/Errors?code=" + code + " for the full message or " + 'use the non-minified dev environment for full errors. ';
1147
- }
1148
-
1149
- // Inlined version of the `symbol-observable` polyfill
1150
- var $$observable = (function () {
1151
- return typeof Symbol === 'function' && Symbol.observable || '@@observable';
1152
- })();
1153
-
1154
- /**
1155
- * These are private action types reserved by Redux.
1156
- * For any unknown actions, you must return the current state.
1157
- * If the current state is undefined, you must return the initial state.
1158
- * Do not reference these action types directly in your code.
1159
- */
1160
- var randomString = function randomString() {
1161
- return Math.random().toString(36).substring(7).split('').join('.');
1162
- };
1163
-
1164
- var ActionTypes = {
1165
- INIT: "@@redux/INIT" + randomString(),
1166
- REPLACE: "@@redux/REPLACE" + randomString(),
1167
- PROBE_UNKNOWN_ACTION: function PROBE_UNKNOWN_ACTION() {
1168
- return "@@redux/PROBE_UNKNOWN_ACTION" + randomString();
1169
- }
1170
- };
1171
-
1172
- /**
1173
- * @param {any} obj The object to inspect.
1174
- * @returns {boolean} True if the argument appears to be a plain object.
1175
- */
1176
- function isPlainObject(obj) {
1177
- if (typeof obj !== 'object' || obj === null) return false;
1178
- var proto = obj;
1179
-
1180
- while (Object.getPrototypeOf(proto) !== null) {
1181
- proto = Object.getPrototypeOf(proto);
1182
- }
1183
-
1184
- return Object.getPrototypeOf(obj) === proto;
1185
- }
1186
-
1187
- /**
1188
- * Creates a Redux store that holds the state tree.
1189
- * The only way to change the data in the store is to call `dispatch()` on it.
1190
- *
1191
- * There should only be a single store in your app. To specify how different
1192
- * parts of the state tree respond to actions, you may combine several reducers
1193
- * into a single reducer function by using `combineReducers`.
1194
- *
1195
- * @param {Function} reducer A function that returns the next state tree, given
1196
- * the current state tree and the action to handle.
1197
- *
1198
- * @param {any} [preloadedState] The initial state. You may optionally specify it
1199
- * to hydrate the state from the server in universal apps, or to restore a
1200
- * previously serialized user session.
1201
- * If you use `combineReducers` to produce the root reducer function, this must be
1202
- * an object with the same shape as `combineReducers` keys.
1203
- *
1204
- * @param {Function} [enhancer] The store enhancer. You may optionally specify it
1205
- * to enhance the store with third-party capabilities such as middleware,
1206
- * time travel, persistence, etc. The only store enhancer that ships with Redux
1207
- * is `applyMiddleware()`.
1208
- *
1209
- * @returns {Store} A Redux store that lets you read the state, dispatch actions
1210
- * and subscribe to changes.
1211
- */
1212
-
1213
- function createStore(reducer, preloadedState, enhancer) {
1214
- var _ref2;
1215
-
1216
- if (typeof preloadedState === 'function' && typeof enhancer === 'function' || typeof enhancer === 'function' && typeof arguments[3] === 'function') {
1217
- throw new Error(formatProdErrorMessage(0) );
1218
- }
1219
-
1220
- if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
1221
- enhancer = preloadedState;
1222
- preloadedState = undefined;
1223
- }
1224
-
1225
- if (typeof enhancer !== 'undefined') {
1226
- if (typeof enhancer !== 'function') {
1227
- throw new Error(formatProdErrorMessage(1) );
1228
- }
1229
-
1230
- return enhancer(createStore)(reducer, preloadedState);
1231
- }
1232
-
1233
- if (typeof reducer !== 'function') {
1234
- throw new Error(formatProdErrorMessage(2) );
1235
- }
1236
-
1237
- var currentReducer = reducer;
1238
- var currentState = preloadedState;
1239
- var currentListeners = [];
1240
- var nextListeners = currentListeners;
1241
- var isDispatching = false;
1242
- /**
1243
- * This makes a shallow copy of currentListeners so we can use
1244
- * nextListeners as a temporary list while dispatching.
1245
- *
1246
- * This prevents any bugs around consumers calling
1247
- * subscribe/unsubscribe in the middle of a dispatch.
1248
- */
1249
-
1250
- function ensureCanMutateNextListeners() {
1251
- if (nextListeners === currentListeners) {
1252
- nextListeners = currentListeners.slice();
1253
- }
1254
- }
1255
- /**
1256
- * Reads the state tree managed by the store.
1257
- *
1258
- * @returns {any} The current state tree of your application.
1259
- */
1260
-
1261
-
1262
- function getState() {
1263
- if (isDispatching) {
1264
- throw new Error(formatProdErrorMessage(3) );
1265
- }
1266
-
1267
- return currentState;
1268
- }
1269
- /**
1270
- * Adds a change listener. It will be called any time an action is dispatched,
1271
- * and some part of the state tree may potentially have changed. You may then
1272
- * call `getState()` to read the current state tree inside the callback.
1273
- *
1274
- * You may call `dispatch()` from a change listener, with the following
1275
- * caveats:
1276
- *
1277
- * 1. The subscriptions are snapshotted just before every `dispatch()` call.
1278
- * If you subscribe or unsubscribe while the listeners are being invoked, this
1279
- * will not have any effect on the `dispatch()` that is currently in progress.
1280
- * However, the next `dispatch()` call, whether nested or not, will use a more
1281
- * recent snapshot of the subscription list.
1282
- *
1283
- * 2. The listener should not expect to see all state changes, as the state
1284
- * might have been updated multiple times during a nested `dispatch()` before
1285
- * the listener is called. It is, however, guaranteed that all subscribers
1286
- * registered before the `dispatch()` started will be called with the latest
1287
- * state by the time it exits.
1288
- *
1289
- * @param {Function} listener A callback to be invoked on every dispatch.
1290
- * @returns {Function} A function to remove this change listener.
1291
- */
1292
-
1293
-
1294
- function subscribe(listener) {
1295
- if (typeof listener !== 'function') {
1296
- throw new Error(formatProdErrorMessage(4) );
1297
- }
1298
-
1299
- if (isDispatching) {
1300
- throw new Error(formatProdErrorMessage(5) );
1301
- }
1302
-
1303
- var isSubscribed = true;
1304
- ensureCanMutateNextListeners();
1305
- nextListeners.push(listener);
1306
- return function unsubscribe() {
1307
- if (!isSubscribed) {
1308
- return;
1309
- }
1310
-
1311
- if (isDispatching) {
1312
- throw new Error(formatProdErrorMessage(6) );
1313
- }
1314
-
1315
- isSubscribed = false;
1316
- ensureCanMutateNextListeners();
1317
- var index = nextListeners.indexOf(listener);
1318
- nextListeners.splice(index, 1);
1319
- currentListeners = null;
1320
- };
1321
- }
1322
- /**
1323
- * Dispatches an action. It is the only way to trigger a state change.
1324
- *
1325
- * The `reducer` function, used to create the store, will be called with the
1326
- * current state tree and the given `action`. Its return value will
1327
- * be considered the **next** state of the tree, and the change listeners
1328
- * will be notified.
1329
- *
1330
- * The base implementation only supports plain object actions. If you want to
1331
- * dispatch a Promise, an Observable, a thunk, or something else, you need to
1332
- * wrap your store creating function into the corresponding middleware. For
1333
- * example, see the documentation for the `redux-thunk` package. Even the
1334
- * middleware will eventually dispatch plain object actions using this method.
1335
- *
1336
- * @param {Object} action A plain object representing “what changed”. It is
1337
- * a good idea to keep actions serializable so you can record and replay user
1338
- * sessions, or use the time travelling `redux-devtools`. An action must have
1339
- * a `type` property which may not be `undefined`. It is a good idea to use
1340
- * string constants for action types.
1341
- *
1342
- * @returns {Object} For convenience, the same action object you dispatched.
1343
- *
1344
- * Note that, if you use a custom middleware, it may wrap `dispatch()` to
1345
- * return something else (for example, a Promise you can await).
1346
- */
1347
-
1348
-
1349
- function dispatch(action) {
1350
- if (!isPlainObject(action)) {
1351
- throw new Error(formatProdErrorMessage(7) );
1352
- }
1353
-
1354
- if (typeof action.type === 'undefined') {
1355
- throw new Error(formatProdErrorMessage(8) );
1356
- }
1357
-
1358
- if (isDispatching) {
1359
- throw new Error(formatProdErrorMessage(9) );
1360
- }
1361
-
1362
- try {
1363
- isDispatching = true;
1364
- currentState = currentReducer(currentState, action);
1365
- } finally {
1366
- isDispatching = false;
1367
- }
1368
-
1369
- var listeners = currentListeners = nextListeners;
1370
-
1371
- for (var i = 0; i < listeners.length; i++) {
1372
- var listener = listeners[i];
1373
- listener();
1374
- }
1375
-
1376
- return action;
1377
- }
1378
- /**
1379
- * Replaces the reducer currently used by the store to calculate the state.
1380
- *
1381
- * You might need this if your app implements code splitting and you want to
1382
- * load some of the reducers dynamically. You might also need this if you
1383
- * implement a hot reloading mechanism for Redux.
1384
- *
1385
- * @param {Function} nextReducer The reducer for the store to use instead.
1386
- * @returns {void}
1387
- */
1388
-
1389
-
1390
- function replaceReducer(nextReducer) {
1391
- if (typeof nextReducer !== 'function') {
1392
- throw new Error(formatProdErrorMessage(10) );
1393
- }
1394
-
1395
- currentReducer = nextReducer; // This action has a similiar effect to ActionTypes.INIT.
1396
- // Any reducers that existed in both the new and old rootReducer
1397
- // will receive the previous state. This effectively populates
1398
- // the new state tree with any relevant data from the old one.
1399
-
1400
- dispatch({
1401
- type: ActionTypes.REPLACE
1402
- });
1403
- }
1404
- /**
1405
- * Interoperability point for observable/reactive libraries.
1406
- * @returns {observable} A minimal observable of state changes.
1407
- * For more information, see the observable proposal:
1408
- * https://github.com/tc39/proposal-observable
1409
- */
1410
-
1411
-
1412
- function observable() {
1413
- var _ref;
1414
-
1415
- var outerSubscribe = subscribe;
1416
- return _ref = {
1417
- /**
1418
- * The minimal observable subscription method.
1419
- * @param {Object} observer Any object that can be used as an observer.
1420
- * The observer object should have a `next` method.
1421
- * @returns {subscription} An object with an `unsubscribe` method that can
1422
- * be used to unsubscribe the observable from the store, and prevent further
1423
- * emission of values from the observable.
1424
- */
1425
- subscribe: function subscribe(observer) {
1426
- if (typeof observer !== 'object' || observer === null) {
1427
- throw new Error(formatProdErrorMessage(11) );
1428
- }
1429
-
1430
- function observeState() {
1431
- if (observer.next) {
1432
- observer.next(getState());
1433
- }
1434
- }
1435
-
1436
- observeState();
1437
- var unsubscribe = outerSubscribe(observeState);
1438
- return {
1439
- unsubscribe: unsubscribe
1440
- };
1441
- }
1442
- }, _ref[$$observable] = function () {
1443
- return this;
1444
- }, _ref;
1445
- } // When a store is created, an "INIT" action is dispatched so that every
1446
- // reducer returns their initial state. This effectively populates
1447
- // the initial state tree.
1448
-
1449
-
1450
- dispatch({
1451
- type: ActionTypes.INIT
1452
- });
1453
- return _ref2 = {
1454
- dispatch: dispatch,
1455
- subscribe: subscribe,
1456
- getState: getState,
1457
- replaceReducer: replaceReducer
1458
- }, _ref2[$$observable] = observable, _ref2;
1459
- }
1460
-
1461
- const inicialState = {};
1462
- /////////////////////////////// REDUCERS ///////////////////////////////
1463
- function formReducer(state = inicialState, action) {
1464
- switch (action.type) {
1465
- case FormActions.METADATA_LOADED:
1466
- return Object.assign(Object.assign({}, state), { formMetadata: action.payload });
1467
- case FormActions.CHANGE_TAB:
1468
- return Object.assign(Object.assign({}, state), { currentSheet: action.payload });
1469
- default:
1470
- return state;
1471
- }
1472
- }
1473
- /////////////////////////////// ACTION CREATORS ///////////////////////////////
1474
- function loadMetadata(formMetadata) {
1475
- return {
1476
- type: FormActions.METADATA_LOADED,
1477
- payload: formMetadata
1478
- };
1479
- }
1480
- function changeTab(currentSheet) {
1481
- return {
1482
- type: FormActions.CHANGE_TAB,
1483
- payload: currentSheet.tabKey
1484
- };
1485
- }
1486
- /////////////////////////////// SELECTORS ///////////////////////////////
1487
- function selectFormMetadata(state) {
1488
- return state.formMetadata;
1489
- }
1490
- function selectCurrentSheet(state) {
1491
- return state.currentSheet ? state.formMetadata.getSheet(state.currentSheet) : Array.from(state.formMetadata.getAllSheets().values())[0];
1492
- }
1493
- /////////////////////////////// TYPES ///////////////////////////////
1494
- var FormActions;
1495
- (function (FormActions) {
1496
- FormActions["METADATA_LOADED"] = "FORM/METADATA_LOADED";
1497
- FormActions["CHANGE_TAB"] = "FORM/CHANGE_TAB";
1498
- })(FormActions || (FormActions = {}));
1499
-
1500
- class DataBinder {
1501
- constructor(dataUnit) {
1502
- this._fields = new Map();
1503
- this._dataUnit = dataUnit;
1504
- this._dataUnit.subscribe(_action => {
1505
- var _a;
1506
- (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
1507
- this.updateValue(field.fieldName, field.field);
1508
- });
1509
- });
1510
- }
1511
- bind(fields) {
1512
- fields.forEach(fieldElement => {
1513
- const fieldName = fieldElement.dataset.fieldName;
1514
- this.updateBind(fieldName, fieldElement);
1515
- this.updateValue(fieldName, fieldElement);
1516
- });
1517
- }
1518
- updateValue(fieldName, field) {
1519
- field["value"] = this._dataUnit.getFieldValue(fieldName);
1520
- }
1521
- updateBind(fieldName, field) {
1522
- const oldBind = this._fields.get(fieldName);
1523
- if (oldBind) {
1524
- oldBind.destroy();
1525
- }
1526
- this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
1527
- this.bindSearchOptionsLoader(fieldName, field);
1528
- }
1529
- setFieldValue(fieldName, newValue) {
1530
- if (this._dataUnit.records.length === 0) {
1531
- this._dataUnit.addRecord();
1532
- }
1533
- this._dataUnit.setFieldValue(fieldName, newValue);
1534
- }
1535
- bindSearchOptionsLoader(fieldName, field) {
1536
- if (field.nodeName === "EZ-SEARCH" && field["optionLoader"] === undefined) {
1537
- const loader = ApplicationContext.getContextValue("__EZUI__SEARCH__OPTION__LOADER__");
1538
- if (loader) {
1539
- field["optionLoader"] = (arg) => {
1540
- return loader(arg, fieldName, this._dataUnit);
1541
- };
1542
- }
1543
- }
1544
- }
1545
- }
1546
- class Bind {
1547
- destroy() {
1548
- this.field.removeEventListener(this.eventName, this.eventListener);
1549
- }
1550
- static create(fieldName, field, callback) {
1551
- const b = new Bind();
1552
- b.fieldName = fieldName;
1553
- b.field = field;
1554
- //FIXME: Verificar se o field é um EzField
1555
- b.eventListener = (evt) => { callback(fieldName, evt.detail); };
1556
- b.eventName = "ezChange";
1557
- b.field.addEventListener(b.eventName, b.eventListener);
1558
- return b;
1559
- }
1560
- }
1561
-
1562
- class ApplicationUtils {
1563
- static async showDialog(title, message, icon = null, confirm, critical = false) {
1564
- return new Promise(resolve => {
1565
- let dialog = document.querySelector("ez-dialog");
1566
- if (!dialog) {
1567
- dialog = document.createElement("ez-dialog");
1568
- window.document.body.appendChild(dialog);
1569
- }
1570
- dialog.show(title, message, critical, confirm, icon).then(ok => resolve(ok));
1571
- });
1572
- }
1573
- static async alert(title, message, icon = null) {
1574
- return ApplicationUtils.showDialog(title, message, icon, false, false);
1575
- }
1576
- static async error(title, message, icon = null) {
1577
- return ApplicationUtils.showDialog(title, message, icon, false, true);
1578
- }
1579
- static async confirm(title, message, icon = null, critical = false) {
1580
- return ApplicationUtils.showDialog(title, message, icon, true, critical);
1581
- }
1582
- static async info(message, options = ApplicationUtils.defaultMessageOptions) {
1583
- let toast = document.querySelector("ez-toast");
1584
- if (!toast) {
1585
- toast = document.createElement("ez-toast");
1586
- window.document.body.appendChild(toast);
1587
- }
1588
- toast.canClose = options.canClose;
1589
- toast.message = message;
1590
- toast.fadeTime = 4000;
1591
- toast.show();
1592
- }
1593
- }
1594
- ApplicationUtils.defaultMessageOptions = {
1595
- canClose: true
1596
- };
1597
-
1598
- const ezFormCss = "ez-form{display:flex;flex-direction:column;width:100%}";
1599
-
1600
- let EzForm = class {
1601
- constructor(hostRef) {
1602
- index.registerInstance(this, hostRef);
1603
- }
1604
- submit() {
1605
- return Promise.resolve();
1606
- }
1607
- cancel() {
1608
- return Promise.resolve();
1609
- }
1610
- validate() {
1611
- return new Promise((accept, reject) => {
1612
- const metadata = selectFormMetadata(this._store.getState());
1613
- const requiredFields = this._staticFields
1614
- .filter(f => f.dataset.required)
1615
- .map(f => f.dataset.fieldName)
1616
- .concat(metadata.getRequiredFields());
1617
- const records = this.dataUnit.records;
1618
- for (let i = 0; i < records.length; i++) {
1619
- if (!this.validateRequired(requiredFields, records[i])) {
1620
- reject();
1621
- break;
1622
- }
1623
- }
1624
- accept();
1625
- });
1626
- }
1627
- configChanged() {
1628
- this.processMetadata();
1629
- }
1630
- validateRequired(requiredFields, record) {
1631
- const invalidFields = [];
1632
- requiredFields.forEach(field => {
1633
- const value = record[field];
1634
- const fieldElem = this._element.querySelector(`[data-field-name=${field}]`);
1635
- if (value === null || value === undefined || value === "") {
1636
- invalidFields.push(field);
1637
- fieldElem["errorMessage"] = "Essa informação é obrigatória";
1638
- }
1639
- else {
1640
- fieldElem["errorMessage"] = "";
1641
- }
1642
- });
1643
- const isValid = invalidFields.length === 0;
1644
- if (!isValid) {
1645
- ApplicationUtils.info("Há pelo menos um campo obrigatório não preenchido.");
1646
- }
1647
- return isValid;
1648
- }
1649
- getDynamicContent() {
1650
- var _a;
1651
- const formMD = selectFormMetadata(this._store.getState());
1652
- if (!formMD)
1653
- return null;
1654
- const currentSheet = selectCurrentSheet((_a = this._store) === null || _a === void 0 ? void 0 : _a.getState());
1655
- if (!currentSheet) {
1656
- return null;
1657
- }
1658
- const allSheets = Array.from(formMD.getAllSheets().values());
1659
- const result = [];
1660
- if (allSheets.length > 1) {
1661
- result.push(index.h("ez-tabselector", { onEzChange: (evt) => this._store.dispatch(changeTab(evt.detail)), selectedTab: currentSheet.name }, allSheets.map(s => index.h("ez-tab", { tabKey: s.name, label: s.label }))));
1662
- }
1663
- result.push(index.h(FormSheet, { store: this._store, source: currentSheet }));
1664
- return result;
1665
- }
1666
- processMetadata() {
1667
- if (!this.isStatic()) {
1668
- const metadata = this.config && this.config.length > 0 ? buildFromConfig(this.config, this.dataUnit) : buildFromDataUnit(this.dataUnit);
1669
- this._store.dispatch(loadMetadata(metadata));
1670
- }
1671
- }
1672
- isStatic() {
1673
- var _a;
1674
- return ((_a = this._staticFields) === null || _a === void 0 ? void 0 : _a.length) > 0;
1675
- }
1676
- interceptAction(action) {
1677
- if (action.type === UnitMetadata.Action.RECORDS_COPIED) {
1678
- const metadata = selectFormMetadata(this._store.getState());
1679
- const cleanFields = metadata.getCleanOnCopyFields();
1680
- if (cleanFields) {
1681
- const records = action.payload;
1682
- return new UnitMetadata.DataUnitAction(UnitMetadata.Action.RECORDS_COPIED, records.map(record => {
1683
- const newRecord = Object.assign({}, record);
1684
- cleanFields.forEach(fieldName => delete newRecord[fieldName]);
1685
- return newRecord;
1686
- }));
1687
- }
1688
- }
1689
- return action;
1690
- }
1691
- componentWillLoad() {
1692
- if (this.dataUnit === undefined) {
1693
- this.dataUnit = new UnitMetadata.DataUnit("ez-form");
1694
- }
1695
- this.dataUnit.addInterceptor(this);
1696
- this.dataUnit.subscribe(action => {
1697
- if (action.type === UnitMetadata.Action.METADATA_LOADED) {
1698
- this.processMetadata();
1699
- }
1700
- });
1701
- this._dataBinder = new DataBinder(this.dataUnit);
1702
- this._store = createStore(formReducer);
1703
- this._store.subscribe(() => index.forceUpdate(this));
1704
- this._staticFields = Array.from(this._element.querySelectorAll("[data-field-name]"));
1705
- this.processMetadata();
1706
- }
1707
- componentDidRender() {
1708
- this._dataBinder.bind(Array.from(this._element.querySelectorAll("[data-field-name]")));
1709
- }
1710
- render() {
1711
- return (index.h(index.Host, null, this.isStatic() ? null : this.getDynamicContent()));
1712
- }
1713
- get _element() { return index.getElement(this); }
1714
- static get watchers() { return {
1715
- "config": ["configChanged"]
1716
- }; }
1717
- };
1718
- EzForm.style = ezFormCss;
1719
-
1720
- const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{color:var(--ez-icon--color)}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{font-family:'ez-icons' !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ez-icon-account-outline:before{content:\"\\ea01\"}.ez-icon-account:before{content:\"\\ea02\"}.ez-icon-alert-circle-inverted:before{content:\"\\ea03\"}.ez-icon-alert-circle:before{content:\"\\ea04\"}.ez-icon-alert-mail:before{content:\"\\ea05\"}.ez-icon-alert-outline:before{content:\"\\ea06\"}.ez-icon-alert-popup:before{content:\"\\ea07\"}.ez-icon-apps:before{content:\"\\ea08\"}.ez-icon-arrow_back:before{content:\"\\ea09\"}.ez-icon-bell-inverted:before{content:\"\\ea0a\"}.ez-icon-bell:before{content:\"\\ea0b\"}.ez-icon-business-center:before{content:\"\\ea0c\"}.ez-icon-calendar-text:before{content:\"\\ea0d\"}.ez-icon-calendar:before{content:\"\\ea0e\"}.ez-icon-check-circle-inverted:before{content:\"\\ea0f\"}.ez-icon-check-circle:before{content:\"\\ea10\"}.ez-icon-check:before{content:\"\\ea11\"}.ez-icon-chevron-down:before{content:\"\\ea12\"}.ez-icon-chevron-left:before{content:\"\\ea13\"}.ez-icon-chevron-right:before{content:\"\\ea14\"}.ez-icon-chevron-up:before{content:\"\\ea15\"}.ez-icon-circle--medium:before{content:\"\\ea16\"}.ez-icon-circle:before{content:\"\\ea17\"}.ez-icon-clipboard:before{content:\"\\ea18\"}.ez-icon-close-circle-inverted:before{content:\"\\ea19\"}.ez-icon-close-circle:before{content:\"\\ea1a\"}.ez-icon-close:before{content:\"\\ea1b\"}.ez-icon-comment-inverted:before{content:\"\\ea1c\"}.ez-icon-comment:before{content:\"\\ea1d\"}.ez-icon-configuration:before{content:\"\\ea1e\"}.ez-icon-copy:before{content:\"\\ea1f\"}.ez-icon-crop:before{content:\"\\ea20\"}.ez-icon-delete:before{content:\"\\ea21\"}.ez-icon-description:before{content:\"\\ea22\"}.ez-icon-dot-notification:before{content:\"\\ea23\"}.ez-icon-dots-horizontal:before{content:\"\\ea24\"}.ez-icon-dots-vertical:before{content:\"\\ea25\"}.ez-icon-drag-indicator:before{content:\"\\ea26\"}.ez-icon-edit-file:before{content:\"\\ea27\"}.ez-icon-edit-table:before{content:\"\\ea28\"}.ez-icon-edit-time:before{content:\"\\ea29\"}.ez-icon-edit:before{content:\"\\ea2a\"}.ez-icon-email-inverted:before{content:\"\\ea2b\"}.ez-icon-email:before{content:\"\\ea2c\"}.ez-icon-error-octagon:before{content:\"\\ea2d\"}.ez-icon-expand:before{content:\"\\ea2e\"}.ez-icon-eye-off:before{content:\"\\ea2f\"}.ez-icon-eye:before{content:\"\\ea30\"}.ez-icon-favorite:before{content:\"\\ea31\"}.ez-icon-file-download:before{content:\"\\ea32\"}.ez-icon-file-upload:before{content:\"\\ea33\"}.ez-icon-filter:before{content:\"\\ea34\"}.ez-icon-find-file:before{content:\"\\ea35\"}.ez-icon-find-page:before{content:\"\\ea36\"}.ez-icon-format-color-fill:before{content:\"\\ea37\"}.ez-icon-help-circle-outline:before{content:\"\\ea38\"}.ez-icon-help-inverted:before{content:\"\\ea39\"}.ez-icon-help:before{content:\"\\ea3a\"}.ez-icon-home:before{content:\"\\ea3b\"}.ez-icon-language:before{content:\"\\ea3c\"}.ez-icon-launch:before{content:\"\\ea3d\"}.ez-icon-lightbulb:before{content:\"\\ea3e\"}.ez-icon-list:before{content:\"\\ea3f\"}.ez-icon-loading:before{content:\"\\ea40\"}.ez-icon-lock-outline:before{content:\"\\ea41\"}.ez-icon-lock:before{content:\"\\ea42\"}.ez-icon-menu:before{content:\"\\ea43\"}.ez-icon-minus-circle-inverted:before{content:\"\\ea44\"}.ez-icon-minus:before{content:\"\\ea45\"}.ez-icon-money-off:before{content:\"\\ea46\"}.ez-icon-money:before{content:\"\\ea47\"}.ez-icon-north-west:before{content:\"\\ea48\"}.ez-icon-pause:before{content:\"\\ea49\"}.ez-icon-payments:before{content:\"\\ea4a\"}.ez-icon-play:before{content:\"\\ea4b\"}.ez-icon-plus-circle-inverted:before{content:\"\\ea4c\"}.ez-icon-plus-circle:before{content:\"\\ea4d\"}.ez-icon-plus:before{content:\"\\ea4e\"}.ez-icon-power:before{content:\"\\ea4f\"}.ez-icon-push-pin:before{content:\"\\ea50\"}.ez-icon-restore:before{content:\"\\ea51\"}.ez-icon-return:before{content:\"\\ea52\"}.ez-icon-rotate:before{content:\"\\ea53\"}.ez-icon-save:before{content:\"\\ea54\"}.ez-icon-search:before{content:\"\\ea55\"}.ez-icon-settings-inverted:before{content:\"\\ea56\"}.ez-icon-settings:before{content:\"\\ea57\"}.ez-icon-share:before{content:\"\\ea58\"}.ez-icon-shield:before{content:\"\\ea59\"}.ez-icon-south-east:before{content:\"\\ea5a\"}.ez-icon-success-circle:before{content:\"\\ea5b\"}.ez-icon-sync:before{content:\"\\ea5c\"}.ez-icon-table:before{content:\"\\ea5d\"}.ez-icon-timer-outline:before{content:\"\\ea5e\"}.ez-icon-user-circle:before{content:\"\\ea5f\"}.ez-icon-warning-minus:before{content:\"\\ea60\"}.ez-icon-warning-triangle:before{content:\"\\ea61\"}.x-small--font{font-size:12px}.small--font{font-size:16px}.medium--font{font-size:20px}.large--font{font-size:24px}.x-large--font{font-size:30px}";
1721
-
1722
- let EzIcon = class {
1723
- constructor(hostRef) {
1724
- index.registerInstance(this, hostRef);
1725
- /**
1726
- * Tamanho do ícone
1727
- */
1728
- this.size = 'medium';
1729
- }
1730
- isSprite() {
1731
- return this.href && this.href.indexOf('#') > -1;
1732
- }
1733
- getIconClassName() {
1734
- return `ez-icon-${this.iconName}`;
1735
- }
1736
- getIconContent() {
1737
- if (this.isSprite()) {
1738
- return index.h("svg", { class: this.size, role: "img" }, index.h("use", { xlinkHref: this.href }));
1739
- }
1740
- else if (!AssetsUtils.StringUtils.isEmpty(this.iconName)) {
1741
- return index.h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
1742
- }
1743
- else {
1744
- return index.h("img", { class: this.size, src: this.href });
1745
- }
1746
- }
1747
- render() {
1748
- return (index.h(index.Host, null, this.getIconContent()));
1749
- }
1750
- };
1751
- EzIcon.style = ezIconCss;
1752
-
1753
- const ezNumberInputCss = ":host{display:block;width:100%}";
1754
-
1755
- let EzNumberInput = class {
1756
- constructor(hostRef) {
1757
- index.registerInstance(this, hostRef);
1758
- this.ezChange = index.createEvent(this, "ezChange", 7);
1759
- /**
1760
- * Deixa o campo disponível ou não para uso.
1761
- */
1762
- this.enabled = true;
1763
- }
1764
- setLabel() {
1765
- this._textInput.label = this.label;
1766
- }
1767
- setErrorMessage() {
1768
- this._textInput.errorMessage = this.errorMessage;
1769
- }
1770
- applyValueToInput() {
1771
- if (this._textInput) {
1772
- this._textInput.value = this.getTextValue(this.value);
1773
- }
1774
- }
1775
- /**
1776
- * Realiza o foco no componente de input
1777
- */
1778
- async setFocus() {
1779
- this._textInput.setFocus();
1780
- }
1781
- /**
1782
- * Remove o foco no componente de input
1783
- */
1784
- async setBlur() {
1785
- this._textInput.setBlur();
1786
- }
1787
- changeValue(newValue) {
1788
- this.errorMessage = "";
1789
- if (newValue && newValue !== this.value) {
1790
- this.value = newValue;
1791
- this.ezChange.emit(this.value);
1792
- }
1793
- }
1794
- parseNumber() {
1795
- const parsedNumber = this._textInput.value ? UnitMetadata.NumberUtils.stringToNumber(this._textInput.value) : null;
1796
- if (parsedNumber != null && isNaN(parsedNumber)) {
1797
- this.errorMessage = "O valor digitado não é um número válido";
1798
- }
1799
- else {
1800
- try {
1801
- this.changeValue(parsedNumber);
1802
- }
1803
- catch (e) {
1804
- this.errorMessage = e.message;
1805
- return;
1806
- }
1807
- }
1808
- }
1809
- getTextValue(value) {
1810
- if (value) {
1811
- return this.precision > 0 ? UnitMetadata.NumberUtils.format(value.toString(), Number(this.precision), Number(this.prettyPrecision)) : value.toString();
1812
- }
1813
- return null;
1814
- }
1815
- componentDidLoad() {
1816
- CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
1817
- }
1818
- render() {
1819
- return (index.h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseNumber(), label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage }));
1820
- }
1821
- get _elem() { return index.getElement(this); }
1822
- static get watchers() { return {
1823
- "label": ["setLabel"],
1824
- "errorMessage": ["setErrorMessage"],
1825
- "value": ["applyValueToInput"]
1826
- }; }
1827
- };
1828
- EzNumberInput.style = ezNumberInputCss;
1829
-
1830
- const ezSearchCss = ":host{width:100%}";
1831
-
1832
- let EzSearch = class {
1833
- constructor(hostRef) {
1834
- index.registerInstance(this, hostRef);
1835
- this.ezChange = index.createEvent(this, "ezChange", 7);
1836
- this.showPopup = index.createEvent(this, "showPopup", 7);
1837
- /**
1838
- * Deixa o campo disponível ou não.
1839
- */
1840
- this.enabled = true;
1841
- /**
1842
- * Ajusta a opção de mostrar o "value" ao selecionar uma opção.
1843
- */
1844
- this.showSelectedValue = true;
1845
- /**
1846
- * Ajusta a opção de mostrar o "value" para cada opção.
1847
- */
1848
- this.showOptionValue = true;
1849
- }
1850
- updateValue() {
1851
- if (this._comboElement) {
1852
- this._comboElement.value = this.value;
1853
- }
1854
- }
1855
- /**
1856
- * Realiza o foco no componente de pesquisa
1857
- */
1858
- async setFocus() {
1859
- this._comboElement.setFocus();
1860
- }
1861
- /**
1862
- * Remove o foco no componente de pesquisa
1863
- */
1864
- async setBlur() {
1865
- this._comboElement.setBlur();
1866
- }
1867
- onComboChange(evt) {
1868
- evt.stopPropagation();
1869
- this.value = evt.detail;
1870
- this.ezChange.emit(evt.detail);
1871
- }
1872
- componentDidLoad() {
1873
- CSSVarsUtils.applyVarsTextInput(this._elem, this._comboElement);
1874
- }
1875
- render() {
1876
- return (index.h("ez-combo-box", { ref: elem => this._comboElement = elem, value: this.value, label: this.label, enabled: this.enabled, errorMessage: this.errorMessage, optionLoader: this.optionLoader, searchMode: true, onEzChange: evt => this.onComboChange(evt), showSelectedValue: this.showSelectedValue, showOptionValue: this.showOptionValue }));
1877
- }
1878
- ;
1879
- get _elem() { return index.getElement(this); }
1880
- static get watchers() { return {
1881
- "value": ["updateValue"]
1882
- }; }
1883
- };
1884
- EzSearch.style = ezSearchCss;
1885
-
1886
- const ezTabselectorCss = "@keyframes activate{0%{clip-path:inset(calc(100% - 3px) 50% 0px 50%)}100%{clip-path:inset(calc(100% - 3px) 0px 0px 0px)}}:host{display:flex;position:relative;width:100%;overflow:hidden;--tabselector--backward-icon:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 9.7808475,13.860393 3.9204526,8.0000004 9.7808475,2.0624965 7.9301965,0.28895552 0.21915255,8.0000004 7.9301965,15.711044 Z\"/></svg>');--tabselector--forward-icon:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>')}.scroll{display:flex;width:100%;scroll-behavior:smooth;overflow-x:auto;scrollbar-width:none}.scroll.startHidden{-webkit-mask-image:linear-gradient(90deg, transparent 20px, #000 48px)}.scroll.midle{-webkit-mask-image:linear-gradient(90deg, transparent 20px, #000 48px, #000 calc(100% - 48px), transparent calc(100% - 20px))}.scroll.endHidden{-webkit-mask-image:linear-gradient(90deg, #000 calc(100% - 48px), transparent calc(100% - 20px))}.tab{display:flex;border:none;min-width:100px;background-color:unset;cursor:pointer;padding:6px 12px;align-items:center;justify-content:center;color:var(--text--primary, #626e82);font-family:var(--font-pattern, \"Sora, Algerian\");font-size:var(--title--small, 14px)}.tab:focus,.forward-button,.backward-button{outline:none}.is-active{position:relative;color:var(--color--primary, #008561)}.is-active::after{content:\"\";position:absolute;width:100%;height:100%;background-color:var(--color--primary, #008561);clip-path:inset(calc(100% - 3px) 0px 0px 0px);animation:activate 0.25s ease-in-out}.is-focused{border:1px dashed var(--color--primary, #000000c5)}.tab-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:var(--text-shadow);margin-bottom:var(--space--extra-small, 3px)}.forward-button,.backward-button{position:absolute;z-index:1;display:flex;box-sizing:border-box;padding:0px;top:0px;right:0px;width:16px;height:100%;border:none;background-color:unset;cursor:pointer;justify-content:center;align-items:center}.backward-button{left:0px}.forward-button::after,.backward-button::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:10px;height:16px}.forward-button::after{-webkit-mask-image:var(--tabselector--forward-icon);mask-image:var(--tabselector--forward-icon)}.backward-button::after{-webkit-mask-image:var(--tabselector--backward-icon);mask-image:var(--tabselector--backward-icon)}.forward-button:hover::after,.backward-button:hover::after{background-color:var(--color--primary, #4e4e4e)}.hidden{display:none}.scroll::-webkit-scrollbar{display:none}";
1887
-
1888
- let EzTabselector = class {
1889
- constructor(hostRef) {
1890
- index.registerInstance(this, hostRef);
1891
- this.ezChange = index.createEvent(this, "ezChange", 7);
1892
- this.setFocusedParam = (ev) => {
1893
- if (ev.key === "Enter") {
1894
- const selectedTab = this._processedTabs[this._focusedIndex];
1895
- this.handleTabClick(selectedTab);
1896
- ev.preventDefault();
1897
- this.setFocusedTab(selectedTab.index);
1898
- }
1899
- else if (ev.key === "ArrowLeft" || ev.key === "ArrowRight") {
1900
- let operator = undefined;
1901
- if (ev.key === "ArrowLeft") {
1902
- operator = false;
1903
- }
1904
- else if (ev.key === "ArrowRight") {
1905
- operator = true;
1906
- }
1907
- else {
1908
- return;
1909
- }
1910
- if (this._focusedIndex === undefined) {
1911
- if (operator === false) {
1912
- this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex - 1 : undefined;
1913
- }
1914
- else {
1915
- this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex + 1 : undefined;
1916
- }
1917
- }
1918
- else {
1919
- if (operator === false) {
1920
- this._focusedIndex = this._focusedIndex - 1;
1921
- }
1922
- else {
1923
- this._focusedIndex = this._focusedIndex + 1;
1924
- }
1925
- }
1926
- if (this._focusedIndex < 0) {
1927
- this._focusedIndex = 0;
1928
- }
1929
- else if (this._focusedIndex > this._processedTabs.length - 1) {
1930
- this._focusedIndex = this._processedTabs.length - 1;
1931
- }
1932
- this.setFocusedBtn(true, this._focusedIndex);
1933
- this.setFocusedTab(this._focusedIndex);
1934
- }
1935
- else if (ev.key === "Tab" || ev.key === "Escape") {
1936
- const currentTab = this._processedTabs[this.selectedIndex];
1937
- this._focusedIndex = undefined;
1938
- this.handleTabClick(currentTab);
1939
- ev.preventDefault();
1940
- this.setFocusedTab(this.selectedIndex);
1941
- }
1942
- };
1943
- }
1944
- handleTabClick(tab) {
1945
- this.selectedIndex = tab.index;
1946
- this._focusedIndex = undefined;
1947
- this.selectedTab = tab.tabKey;
1948
- this.ezChange.emit(tab);
1949
- this.setFocusedBtn(false, tab.index);
1950
- }
1951
- componentWillRender() {
1952
- if (!this._processedTabs) {
1953
- this._processedTabs = [];
1954
- if (this.tabs) {
1955
- this.tabs.split(",").forEach((label) => {
1956
- label = label.trim();
1957
- this._processedTabs.push({ label, tabKey: label, index: this._processedTabs.length });
1958
- });
1959
- }
1960
- this._hostElem.querySelectorAll("ez-tab").forEach((elem) => {
1961
- const tabKey = elem.getAttribute("tabKey");
1962
- const label = elem.getAttribute("label");
1963
- const t = { label, tabKey, index: this._processedTabs.length };
1964
- const content = elem.firstChild;
1965
- if (content) {
1966
- content.setAttribute("slot", "tab" + t.index);
1967
- this._hostElem.appendChild(content);
1968
- }
1969
- this._processedTabs.push(t);
1970
- });
1971
- }
1972
- }
1973
- handleSlotChange(ev) {
1974
- const slot = ev.target;
1975
- const content = slot.assignedElements()[0];
1976
- if (content) {
1977
- content.style.marginLeft = "6px";
1978
- }
1979
- }
1980
- scrollBackward() {
1981
- const container = this._scrollContainer;
1982
- if (container) {
1983
- container.scrollLeft -= container.clientWidth;
1984
- }
1985
- }
1986
- scrollFoward() {
1987
- const container = this._scrollContainer;
1988
- if (container) {
1989
- let lastTab = null;
1990
- container.querySelectorAll(".tab").forEach((tab) => {
1991
- if (tab.getBoundingClientRect().right < container.clientWidth) {
1992
- lastTab = tab;
1993
- }
1994
- });
1995
- container.scrollLeft = lastTab.offsetLeft + lastTab.offsetWidth;
1996
- }
1997
- }
1998
- componentDidRender() {
1999
- this.updateScroll();
2000
- }
2001
- updateScroll() {
2002
- const container = this._scrollContainer;
2003
- if (container) {
2004
- const { scrollWidth, clientWidth, scrollLeft } = container;
2005
- const remainingScroll = scrollWidth - clientWidth - Math.ceil(scrollLeft);
2006
- this._startHidden = container.scrollLeft > 0;
2007
- this._endHidden = remainingScroll > 0;
2008
- if (this._startHidden) {
2009
- this._backwardButton.classList.remove("hidden");
2010
- }
2011
- else {
2012
- this._backwardButton.classList.add("hidden");
2013
- }
2014
- if (this._endHidden) {
2015
- this._forwardButton.classList.remove("hidden");
2016
- }
2017
- else {
2018
- this._forwardButton.classList.add("hidden");
2019
- }
2020
- const classNames = ["", "startHidden", "endHidden", "midle"];
2021
- const currentClass = classNames[Number(this._startHidden) | Number(this._endHidden) << 1];
2022
- classNames.forEach((name) => {
2023
- if (name !== currentClass && container.classList.contains(name)) {
2024
- container.classList.remove(name);
2025
- }
2026
- });
2027
- if (currentClass && !container.classList.contains(currentClass)) {
2028
- container.classList.add(currentClass);
2029
- }
2030
- }
2031
- }
2032
- domScrollHandler() {
2033
- window.clearTimeout(this._scrollCallBack);
2034
- this._scrollCallBack = window.setTimeout(() => { this.updateScroll(); }, 200);
2035
- }
2036
- setFocusedTab(index) {
2037
- window.clearTimeout(this._scrollCallBackTest);
2038
- this._scrollCallBackTest = window.setTimeout(() => {
2039
- const tabtoscroll = this._scrollContainer.querySelector(`#tab${index}`);
2040
- tabtoscroll.scrollIntoView();
2041
- }, 200);
2042
- }
2043
- getTextWidth(text) {
2044
- if (this._textMesurement === undefined) {
2045
- this._textMesurement = this._hostElem.shadowRoot.ownerDocument.createElement("canvas");
2046
- }
2047
- const context = this._textMesurement.getContext("2d");
2048
- context.font = "14px Sora, Algerian";
2049
- return Math.min(220, 24 + context.measureText(text).width) + "px";
2050
- }
2051
- ;
2052
- setFocusedBtn(visible, parameter) {
2053
- const tabsButtons = this._scrollContainer.querySelectorAll(".tab");
2054
- tabsButtons.forEach((el) => {
2055
- el.classList.remove("is-focused");
2056
- if (el.id === "tab" + parameter && visible) {
2057
- el.classList.add("is-focused");
2058
- }
2059
- });
2060
- }
2061
- render() {
2062
- return (index.h(index.Host, null, index.h("button", { class: "backward-button", ref: (el) => this._backwardButton = el, onClick: () => this.scrollBackward() }), index.h("div", { class: "scroll", ref: (el) => this._scrollContainer = el, onScroll: () => this.domScrollHandler(), onKeyDown: (ev) => this.setFocusedParam(ev) }, this._processedTabs.map((tab, index$1) => {
2063
- const labelStyle = { "min-width": this.getTextWidth(tab.label) };
2064
- const tabId = "tab" + index$1;
2065
- const isSelected = index$1 === this.selectedIndex || (this.selectedTab && tab.tabKey === this.selectedTab);
2066
- if (isSelected) {
2067
- this.selectedTab = tab.tabKey;
2068
- this.selectedIndex = index$1;
2069
- }
2070
- return index.h("button", { id: tabId, class: `tab${isSelected ? " is-active" : ""}`, onClick: () => this.handleTabClick(tab), style: labelStyle }, index.h("span", { class: "tab-label", title: tab.label }, tab.label), index.h("slot", { name: tabId, onSlotchange: (ev) => { this.handleSlotChange(ev); } }));
2071
- })), index.h("button", { class: "forward-button", ref: (el) => this._forwardButton = el, onClick: () => this.scrollFoward() })));
2072
- }
2073
- get _hostElem() { return index.getElement(this); }
2074
- };
2075
- EzTabselector.style = ezTabselectorCss;
2076
-
2077
- const ezTextAreaCss = ":host{--text-area--width:100%;--text-area--border-radius:var(--border--radius-medium, 12px);--text-area--font-size:var(--text--medium, 14px);--text-area--font-family:var(--font-pattern, Arial);--text-area--font-weight:var(--text-weight--large, 500);--text-area--color:var(--title--primary, #000);--text-area__input--background-color:var(--background--medium, #e0e0e0);--text-area__input--border:var(--border--medium, 2px solid);--text-area__input--border-color:var(--text-area__input--background-color);--text-area__input--focus--border-color:var(--color--primary, #008561);--text-area__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--text-area__input--disabled--color:var(--text--disable, #AFB6C0);--text-area__input--error--border-color:#CC2936;--text-area__message_box--font-size:var(--text--small, 12px);--text-area__message_box--info--color:var(--color--success, #22085d);--text-area__message_box--error--color:var(--color--error, #FF0000);--text-area__label--floating--top:6px;--text-area__label--padding-top:12px;--text-area__label--padding-left:14px;--text-area__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--text-area--width)}textarea{box-sizing:border-box;border:none;resize:none;margin-top:calc(var(--space--medium, 12px) + 4px);width:100%;font-weight:var(--text-weight--large, 600);font-family:var(--text-area--font-family);font-size:var(--text-area--font-size);color:var(--text-area--color);padding:0;background:none}textarea:focus{outline:none}textarea:disabled{background-color:transparent;color:var(--text-area__input--disabled--color)}.textarea{width:100%;box-sizing:border-box;padding-left:var(--space--medium);padding-right:var(--space--extra-small);border-radius:var(--text-area--border-radius);border:var(--text-area__input--border);border-color:var(--text-area__input--border-color);background-color:var(--text-area__input--background-color)}.textarea--focus{border-color:var(--text-area__input--focus--border-color)}.textarea.hasError{color:var(--text-area--color);border-color:var(--text-area__input--error--border-color)}.message-box{min-height:16px;min-width:100%;margin-top:3px;line-height:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--text-area--font-family);font-size:var(--text-area__message_box--font-size);color:var(--text-area__message_box--info--color)}.hasError{color:var(--text-area__message_box--error--color)}.textarea__label{box-sizing:border-box;position:absolute;z-index:var(--visible);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition:font-size .05s, top .05s;transition:font-size .05s, top .05s;width:calc(100% - var(--text-area__label--padding-right));left:var(--text-area--space--medium);font-family:var(--text-area--font-family);font-size:var(--text-area--font-size);font-weight:var(--text-area--font-weight);color:var(--text-area--color);top:var(--text-area__label--padding-top);left:var(--text-area__label--padding-left);padding-right:var(--text-area__label--padding-right)}.textarea__label--floated{font-family:var(--text-area--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--text-area__label--floating--top)}.textarea__label--disabled{color:var(--text-area__input--disabled--color)}";
2078
-
2079
- let EzTextArea = class {
2080
- constructor(hostRef) {
2081
- index.registerInstance(this, hostRef);
2082
- this.ezChange = index.createEvent(this, "ezChange", 7);
2083
- /**
2084
- * Deixa o campo disponível ou não para digitação.
2085
- */
2086
- this.enabled = true;
2087
- /**
2088
- * Ajusta o número de linhas e consequentemente o height do textarea. Valor default: 4
2089
- */
2090
- this.rows = 4;
2091
- }
2092
- showError() {
2093
- const hasError = typeof this.errorMessage === 'string' && this.errorMessage !== '';
2094
- if (hasError) {
2095
- this._container.classList.add('hasError');
2096
- this._messageBoxElem.classList.add('hasError');
2097
- }
2098
- else {
2099
- this._container.classList.remove('hasError');
2100
- this._messageBoxElem.classList.remove('hasError');
2101
- }
2102
- }
2103
- updateInputValue() {
2104
- this._inputElem.value = this.value === undefined ? "" : this.value;
2105
- this.handleChange();
2106
- this.adjustFloatingLabel();
2107
- this.ezChange.emit(this.value);
2108
- }
2109
- adjustFloatingLabel() {
2110
- if (this.label) {
2111
- const hasValue = this.value && this.value.toString().length > 0;
2112
- const containsFloatedClass = this._labelElem.classList.contains("textarea__label--floated");
2113
- if (hasValue || this.isFocused()) {
2114
- if (!containsFloatedClass) {
2115
- this._labelElem.classList.add("textarea__label--floated");
2116
- }
2117
- }
2118
- else {
2119
- if (containsFloatedClass) {
2120
- this._labelElem.classList.remove("textarea__label--floated");
2121
- }
2122
- }
2123
- }
2124
- }
2125
- isFocused() {
2126
- return this._hostElement.shadowRoot.activeElement !== null;
2127
- }
2128
- //---------------------------------------------
2129
- // Public methods
2130
- //---------------------------------------------
2131
- /**
2132
- * Faz o foco no componente de input
2133
- */
2134
- async setFocus() {
2135
- this._inputElem.focus();
2136
- }
2137
- /**
2138
- * Remove o foco no componente de input
2139
- */
2140
- async setBlur() {
2141
- this._inputElem.blur();
2142
- }
2143
- //---------------------------------------------
2144
- // Event handlers
2145
- //---------------------------------------------
2146
- handleFocusout() {
2147
- this.adjustFloatingLabel();
2148
- if (this._container && this._container.classList.contains("textarea--focus")) {
2149
- this._container.classList.remove("textarea--focus");
2150
- }
2151
- }
2152
- handleChange() {
2153
- this.errorMessage = "";
2154
- this.value = this._inputElem.value;
2155
- }
2156
- handleFocus() {
2157
- if (this.label && this._labelElem && !this._labelElem.classList.contains("textarea__label--floated")) {
2158
- this._labelElem.classList.add("textarea__label--floated");
2159
- }
2160
- if (this._container && !this._container.classList.contains("textarea--focus")) {
2161
- this._container.classList.add("textarea--focus");
2162
- }
2163
- }
2164
- //---------------------------------------------
2165
- // Lifecycle web component
2166
- //---------------------------------------------
2167
- componentDidLoad() {
2168
- this.showError();
2169
- this.adjustFloatingLabel();
2170
- }
2171
- render() {
2172
- return (index.h(index.Host, null, index.h("div", { class: "textarea", ref: (el) => this._container = el }, this.label ?
2173
- index.h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "textarea__label" : "textarea__label textarea__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
2174
- : null, index.h("textarea", { onFocus: () => this.handleFocus(), ref: (el) => this._inputElem = el, value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, onKeyDown: event => event.stopPropagation(), rows: this.rows })), index.h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
2175
- }
2176
- get _hostElement() { return index.getElement(this); }
2177
- static get watchers() { return {
2178
- "errorMessage": ["showError"],
2179
- "value": ["updateInputValue"]
2180
- }; }
2181
- };
2182
- EzTextArea.style = ezTextAreaCss;
2183
-
2184
- const ezTextInputCss = ":host{--ez-text-input--height:42px;--ez-text-input--width:100%;--ez-text-input__icon--width:48px;--ez-text-input--border-radius:var(--border--radius-medium, 12px);--ez-text-input--font-size:var(--text--medium, 14px);--ez-text-input--font-family:var(--font-pattern, Arial);--ez-text-input--font-weight:var(--text-weight--medium, 400);--ez-text-input--color:var(--title--primary, #000);--ez-text-input__input--background-color:var(--background--medium, #e0e0e0);--ez-text-input__input--border:var(--border--medium, 2px solid);--ez-text-input__input--border-color:var(--ez-text-input__input--background-color);--ez-text-input__input--focus--border-color:var(--color--primary, #008561);--ez-text-input__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-text-input__input--disabled--color:var(--text--disable, #AFB6C0);--ez-text-input__input--error--border-color:#CC2936;--ez-text-input__message_box--font-size:var(--text--small, 12px);--ez-text-input__message_box--info--color:var(--color--success, #22085d);--ez-text-input__message_box--error--color:var(--color--error, #FF0000);--ez-text-input__label--floating--top:6px;--ez-text-input__label--padding-top:12px;--ez-text-input__label--padding-left:14px;--ez-text-input__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--ez-text-input--width)}input{width:100%;box-sizing:border-box;padding:var(--space--medium, 6px);font-weight:var(--text-weight--large, 600);height:var(--ez-text-input--height);border-radius:var(--ez-text-input--border-radius);font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input--font-size);border:var(--ez-text-input__input--border);border-color:var(--ez-text-input__input--border-color);background-color:var(--ez-text-input__input--background-color);color:var(--ez-text-input--color)}input:disabled{background-color:var(--ez-text-input__input--disabled--background-color);color:var(--ez-text-input__input--disabled--color)}input:focus{outline:none;border-color:var(--ez-text-input__input--focus--border-color)}input.icon--left{padding-left:var(--ez-text-input__icon--width)}input.icon--right{padding-right:var(--ez-text-input__icon--width)}input.hasError{color:var(--ez-text-input--color);border-color:var(--ez-text-input__input--error--border-color)}input.text--right{text-align:right}.message-box{min-height:16px;min-width:100%;margin-top:3px;line-height:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input__message_box--font-size);color:var(--ez-text-input__message_box--info--color)}.hasError{color:var(--ez-text-input__message_box--error--color)}.input__label{box-sizing:border-box;position:absolute;z-index:var(--visible);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition:font-size .05s, top .05s;transition:font-size .05s, top .05s;width:calc(100% - var(--ez-text-input__label--padding-right));left:var(--ez-text-input--space--medium);font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input--font-size);font-weight:var(--ez-text-input--font-weight);color:var(--ez-text-input--color);top:var(--ez-text-input__label--padding-top);left:var(--ez-text-input__label--padding-left);padding-right:var(--ez-text-input__label--padding-right)}.input__label--floated{font-family:var(--ez-text-input--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--ez-text-input__label--floating--top)}.input__label--disabled{color:var(--ez-text-input__input--disabled--color)}.input__label--left{text-align:left;left:calc(var(--ez-text-input__icon--width) + 2px);width:calc(100% - var(--ez-text-input__icon--width))}.input__label--right{right:var(--ez-text-input__icon--width);width:calc(100% - var(--ez-text-input__icon--width))}.input__label--left.input__label--right{left:calc(var(--ez-text-input__icon--width) + 2px);width:calc(100% - var(--ez-text-input__icon--width) * 2)}.input--with--label{padding-bottom:0}";
2185
-
2186
- let EzTextInput = class {
2187
- constructor(hostRef) {
2188
- index.registerInstance(this, hostRef);
2189
- this.ezChange = index.createEvent(this, "ezChange", 7);
2190
- /**
2191
- * Deixa o campo disponível ou não para digitação.
2192
- */
2193
- this.enabled = true;
2194
- /**
2195
- * Permite exibir a mensagem de erro.
2196
- */
2197
- this.canShowError = true;
2198
- }
2199
- showError() {
2200
- const hasError = typeof this.errorMessage === "string" && this.errorMessage !== "";
2201
- if (hasError) {
2202
- this._inputElem.classList.add("hasError");
2203
- this._messageBoxElem.classList.add("hasError");
2204
- }
2205
- else {
2206
- this._inputElem.classList.remove("hasError");
2207
- this._messageBoxElem.classList.remove("hasError");
2208
- }
2209
- }
2210
- prepareMask() {
2211
- if (this.mask) {
2212
- if (this._maskFormatter == undefined) {
2213
- this._maskFormatter = new UnitMetadata.MaskFormatter(this.mask);
2214
- }
2215
- else {
2216
- this._maskFormatter.mask = this.mask;
2217
- }
2218
- }
2219
- }
2220
- updateInputValue() {
2221
- if (this._inputElem) {
2222
- this._inputElem.value = this.value;
2223
- }
2224
- this.handleChange();
2225
- this.errorMessage = "";
2226
- this.ezChange.emit(this.value);
2227
- this.adjustFloatingLabel();
2228
- }
2229
- adjustFloatingLabel() {
2230
- if (this.label && this._labelElem) {
2231
- if (this._inputElem && !this._inputElem.classList.contains("input--with--label")) {
2232
- this._inputElem.classList.add("input--with--label");
2233
- }
2234
- const hasValue = this.value && this.value.toString().length > 0;
2235
- const containsFloatedClass = this._labelElem.classList.contains("input__label--floated");
2236
- if (hasValue || this.isFocused()) {
2237
- if (!containsFloatedClass) {
2238
- this._labelElem.classList.add("input__label--floated");
2239
- }
2240
- }
2241
- else {
2242
- if (containsFloatedClass) {
2243
- this._labelElem.classList.remove("input__label--floated");
2244
- }
2245
- }
2246
- }
2247
- }
2248
- isFocused() {
2249
- return this._hostElement.shadowRoot.activeElement !== null;
2250
- }
2251
- //---------------------------------------------
2252
- // Public methods
2253
- //---------------------------------------------
2254
- /**
2255
- * Faz o foco no componente de input
2256
- */
2257
- async setFocus() {
2258
- this._inputElem.focus();
2259
- }
2260
- /**
2261
- * Remove o foco no componente de input
2262
- */
2263
- async setBlur() {
2264
- this._inputElem.blur();
2265
- }
2266
- //---------------------------------------------
2267
- // Event handlers
2268
- //---------------------------------------------
2269
- handleFocusout() {
2270
- const value = this._inputElem.value;
2271
- if (value && this._maskFormatter) {
2272
- try {
2273
- this._inputElem.value = this._maskFormatter.format(value);
2274
- }
2275
- catch (e) {
2276
- this.errorMessage = e.message;
2277
- }
2278
- }
2279
- this.value = this._inputElem.value;
2280
- this.adjustFloatingLabel();
2281
- }
2282
- isValidValue(value) {
2283
- if (this.restrict) {
2284
- return Array.from(value).reduce((valid, c) => valid && this.restrict.indexOf(c) > -1, true);
2285
- }
2286
- return true;
2287
- }
2288
- handleChange() {
2289
- if (!this._inputElem) {
2290
- return;
2291
- }
2292
- const value = this._inputElem.value;
2293
- if (this.isValidValue(value)) {
2294
- this._lastValidValue = value;
2295
- }
2296
- else {
2297
- this._inputElem.value = this._lastValidValue === undefined ? "" : this._lastValidValue;
2298
- }
2299
- this.value = this._inputElem.value;
2300
- }
2301
- handleSlotChange(ev) {
2302
- const slot = ev.target;
2303
- const content = slot.assignedElements()[0];
2304
- if (content) {
2305
- content.style.position = "absolute";
2306
- content.style.display = "flex";
2307
- content.style.alignItems = "center";
2308
- content.style.justifyContent = "center";
2309
- content.style.overflow = "hidden";
2310
- content.style.top = "0px";
2311
- content.style.width = "var(--ez-text-input__icon--width)";
2312
- content.style.height = "var(--ez-text-input--height)";
2313
- if (slot.name == "leftIcon") {
2314
- content.style.left = "0px";
2315
- content.style.borderRadius = "var(--ez-text-input--border-radius) 0 0 var(--ez-text-input--border-radius)";
2316
- this._inputElem.classList.add("icon--left");
2317
- if (this._labelElem) {
2318
- this._labelElem.classList.add("input__label--left");
2319
- }
2320
- }
2321
- else if (slot.name == "rightIcon") {
2322
- content.style.right = "0px";
2323
- content.style.borderRadius = "0 var(--ez-text-input--border-radius) var(--ez-text-input--border-radius) 0";
2324
- this._inputElem.classList.add("icon--right");
2325
- if (this._labelElem) {
2326
- this._labelElem.classList.add("input__label--right");
2327
- }
2328
- }
2329
- }
2330
- this.showError();
2331
- }
2332
- doFocus() {
2333
- if (this.label && this._labelElem && !this._labelElem.classList.contains("input__label--floated")) {
2334
- this._labelElem.classList.add("input__label--floated");
2335
- }
2336
- }
2337
- //---------------------------------------------
2338
- // Lifecycle web component
2339
- //---------------------------------------------
2340
- componentDidLoad() {
2341
- this.showError();
2342
- this.prepareMask();
2343
- this.adjustFloatingLabel();
2344
- }
2345
- componentWillLoad() {
2346
- this.prepareMask();
2347
- if (this.value) {
2348
- if (this._maskFormatter) {
2349
- try {
2350
- this.value = this._maskFormatter.format(this.value);
2351
- }
2352
- catch (e) {
2353
- this.errorMessage = e.message;
2354
- }
2355
- }
2356
- if (!this.isValidValue(this.value)) {
2357
- this._lastValidValue = "";
2358
- this.value = "";
2359
- }
2360
- }
2361
- }
2362
- render() {
2363
- return (index.h(index.Host, null, index.h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label ?
2364
- index.h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
2365
- : null, index.h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), index.h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError &&
2366
- index.h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
2367
- }
2368
- get _hostElement() { return index.getElement(this); }
2369
- static get watchers() { return {
2370
- "errorMessage": ["showError"],
2371
- "mask": ["prepareMask"],
2372
- "value": ["updateInputValue"]
2373
- }; }
2374
- };
2375
- EzTextInput.style = ezTextInputCss;
2376
-
2377
- const ezTimeInputCss = ":host{display:flex;flex-wrap:wrap;position:relative;width:100%}";
2378
-
2379
- let EzTimeInput = class {
2380
- constructor(hostRef) {
2381
- index.registerInstance(this, hostRef);
2382
- /**
2383
- * Deixa o campo disponível ou não para digitação.
2384
- */
2385
- this.enabled = true;
2386
- /**
2387
- * Define se o componente irá ou não considerar os segundos
2388
- */
2389
- this.showSeconds = false;
2390
- }
2391
- prepareMask() {
2392
- if (this.showSeconds) {
2393
- if (this._maskFormatter == undefined) {
2394
- this._maskFormatter = new UnitMetadata.MaskFormatter("##:##:##");
2395
- }
2396
- else {
2397
- this._maskFormatter.mask = "##:##:##";
2398
- }
2399
- }
2400
- else {
2401
- if (this._maskFormatter == undefined) {
2402
- this._maskFormatter = new UnitMetadata.MaskFormatter("##:##");
2403
- }
2404
- else {
2405
- this._maskFormatter.mask = "##:##";
2406
- }
2407
- }
2408
- }
2409
- onValueChanged() {
2410
- if (this.value === NaN) {
2411
- this.value = undefined;
2412
- this.handleFocusout();
2413
- }
2414
- }
2415
- //---------------------------------------------
2416
- // Public methods
2417
- //---------------------------------------------
2418
- /**
2419
- * Faz o foco no componente de input
2420
- */
2421
- async setFocus() {
2422
- this._inputElem.focus();
2423
- }
2424
- /**
2425
- * Remove o foco no componente de input
2426
- */
2427
- async setBlur() {
2428
- this._inputElem.blur();
2429
- }
2430
- //---------------------------------------------
2431
- // Event handlers
2432
- //---------------------------------------------
2433
- handleFocusout() {
2434
- this.errorMessage = "";
2435
- this.prepareValue(this.viewValue);
2436
- if (!UnitMetadata.TimeFormatter.validateTime(this.viewValue, this.showSeconds)) {
2437
- this.clearField();
2438
- this.errorMessage = "Favor inserir um horário válido.";
2439
- }
2440
- }
2441
- prepareValue(value) {
2442
- try {
2443
- this.viewValue = UnitMetadata.TimeFormatter.prepareValue(value, this.showSeconds);
2444
- }
2445
- catch (e) {
2446
- this.clearField();
2447
- this.errorMessage = e.message;
2448
- }
2449
- }
2450
- clearField() {
2451
- this.viewValue = this.value = undefined;
2452
- }
2453
- handleChange() {
2454
- this.viewValue = this._inputElem.value;
2455
- this.value = UnitMetadata.NumberUtils.stringToNumber(this.viewValue.replace(/\D/g, ""));
2456
- }
2457
- //---------------------------------------------
2458
- // Lifecycle web component
2459
- //---------------------------------------------
2460
- componentDidLoad() {
2461
- this.onValueChanged();
2462
- CSSVarsUtils.applyVarsTextInput(this._elem, this._inputElem);
2463
- }
2464
- componentWillLoad() {
2465
- this.prepareMask();
2466
- if (this.value) {
2467
- this.prepareValue(this.value.toString());
2468
- }
2469
- else if (this.viewValue) {
2470
- this.prepareValue(this.viewValue);
2471
- }
2472
- }
2473
- render() {
2474
- return (index.h(index.Host, null, index.h("ez-text-input", { ref: (el) => this._inputElem = el, value: this.viewValue, enabled: this.enabled, label: this.label, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, errorMessage: this.errorMessage }, index.h("ez-icon", { slot: "leftIcon", href: AssetsUtils.getSpritePath("timer-outline") }))));
2475
- }
2476
- static get assetsDirs() { return ["../assets"]; }
2477
- get _elem() { return index.getElement(this); }
2478
- static get watchers() { return {
2479
- "showSeconds": ["prepareMask"],
2480
- "value": ["onValueChanged"]
2481
- }; }
2482
- };
2483
- EzTimeInput.style = ezTimeInputCss;
2484
-
2485
- class RemoteFile {
2486
- constructor(file) {
2487
- this.file = file;
2488
- this.size = file.size;
2489
- this.name = file.name;
2490
- }
2491
- abortUpload() {
2492
- if (this._uploadingXhr) {
2493
- this._aborted = true;
2494
- this._uploadingXhr.abort();
2495
- this._uploadingXhr = undefined;
2496
- }
2497
- }
2498
- isUploading() {
2499
- return this._uploadingXhr !== undefined;
2500
- }
2501
- async upload(server, headers, updateCallBack) {
2502
- return new Promise((resolve, reject) => {
2503
- const xhr = new XMLHttpRequest();
2504
- this._uploadingXhr = xhr;
2505
- this._aborted = false;
2506
- this.progress = 0;
2507
- xhr.upload.onprogress = (e) => {
2508
- const loaded = e.loaded;
2509
- const total = e.total;
2510
- this.progress = ~~((loaded / total) * 100);
2511
- updateCallBack(this, loaded, total);
2512
- };
2513
- xhr.onreadystatechange = () => {
2514
- if (xhr.readyState == 4) {
2515
- this._uploadingXhr = undefined;
2516
- const status = xhr.status;
2517
- if (!this._aborted) {
2518
- if (status === 0) {
2519
- reject("Servidor indisponível");
2520
- }
2521
- else if (status >= 500) {
2522
- reject("Erro inesperado no servidor");
2523
- }
2524
- else if (status >= 400) {
2525
- reject("Operação não permitida");
2526
- }
2527
- }
2528
- const response = xhr.response;
2529
- if (response) {
2530
- resolve(JSON.parse(response));
2531
- }
2532
- }
2533
- };
2534
- xhr.ontimeout = () => {
2535
- reject("Tempo limite de transferência atingido.");
2536
- };
2537
- const formData = new FormData();
2538
- formData.append("ARQUIVO", this.file, this.file.name);
2539
- xhr.open("POST", server, true);
2540
- if (headers) {
2541
- headers.forEach((value, key) => xhr.setRequestHeader(key, value));
2542
- }
2543
- xhr.send(formData);
2544
- });
2545
- }
2546
- async delete(item, server, headers) {
2547
- return new Promise((resolve, reject) => {
2548
- const xhr = new XMLHttpRequest();
2549
- xhr.onreadystatechange = () => {
2550
- if (xhr.readyState == 4) {
2551
- if (xhr.status === 0) {
2552
- reject("Servidor indisponível");
2553
- }
2554
- else if (xhr.status >= 500) {
2555
- reject("Erro inesperado no servidor");
2556
- }
2557
- else if (xhr.status >= 400) {
2558
- reject("Operação não permitida");
2559
- }
2560
- resolve(true);
2561
- }
2562
- };
2563
- xhr.ontimeout = () => {
2564
- reject("Tempo limite de remoção atingido.");
2565
- };
2566
- xhr.open("DELETE", server, true);
2567
- if (headers) {
2568
- headers.forEach((value, key) => xhr.setRequestHeader(key, value));
2569
- }
2570
- xhr.send(JSON.stringify(item));
2571
- });
2572
- }
2573
- }
2574
-
2575
- const ezUploadCss = ":host{--ez-upload--height:42px;--ez-upload--width:100%;--ez-upload__icon--width:48px;--ez-upload__container--background-color:var(--background--medium, #d2dce9);--ez-upload__color--primary:var(--color--primary, #008561);--ez-upload--padding--extra-small:var(--space--extra-small, 3px);--ez-upload--padding--small:var(--space--small, 6px);--ez-upload--padding--medium:var(--space--medium, 12px);--ez-upload--padding--large:var(--space--large, 24px);--ez-upload__border--color:var(--color-strokes, #DCE0E8);--ez-upload--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--ez-upload--text--primary:var(--text-primary, #626e82);--ez-upload--font-size:var(--text--medium, 14px);--ez-upload--font-family:var(--font-pattern, Arial);--ez-upload--font-weight:var(--text-weight--large, 500);--ez-upload__btn__cancel-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"8x\" width=\"8px\"><path d=\"M 8,0.8 7.2,0 4,3.2 0.8,0 0,0.8 3.2,4 0,7.2 0.8,8 4,4.8 7.2,8 8,7.2 4.8,4 Z\"/></svg>');--ez-upload__file-icon-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"11x\" width=\"9px\"><path d=\"M 1.2272719,8.4999999 V 2.75 c 0,-1.1045695 1.4652499,-2 3.2727273,-2 1.8074777,0 3.2727281,0.8954305 3.2727281,2 V 8.9999999 C 7.7727273,9.690356 6.8569456,10.25 5.7272719,10.25 4.5975985,10.25 3.6818174,9.690356 3.6818174,8.9999999 V 3.75 c 0,-0.2761425 0.3663125,-0.5 0.8181818,-0.5 0.4518694,0 0.8181818,0.2238575 0.8181818,0.5 V 8.4999999 H 6.5454537 V 3.75 C 6.5454537,3.059644 5.6296725,2.5 4.4999992,2.5 3.3703258,2.5 2.4545446,3.059644 2.4545446,3.75 V 8.9999999 C 2.4545446,10.10457 3.9197945,11 5.7272719,11 7.5347496,11 9,10.10457 9,8.9999999 V 2.75 C 9,1.231217 6.9852809,0 4.4999992,0 2.0147181,5e-7 0,1.231217 0,2.75 v 5.7499999 z\"/></svg>');display:flex;flex-wrap:wrap;position:relative;font-family:var(--ez-upload--font-family);font-size:var(--ez-upload--font-size);width:var(--ez-upload--width);font-weight:var(--ez-upload--font-weight)}.iu{display:flex;flex-wrap:wrap;background-color:var(--ez-upload__container--background-color);padding:var(--ez-upload--padding--small);width:100%;border-radius:12px;box-sizing:border-box}.iu__container{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;border:2px dashed var(--ez-upload__border--color);border-radius:6px;box-sizing:border-box}.iu__footer{display:flex;flex-wrap:wrap;justify-content:flex-start;width:100%;padding:0 var(--ez-upload--padding--medium) var(--ez-upload--padding--medium) var(--ez-upload--padding--medium);box-sizing:border-box}.iu__item{display:flex;width:100%;justify-content:flex-start;align-items:center;align-self:center;padding-bottom:var(--ez-upload--padding--extra-small);box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.iu__item-label{display:flex;max-width:80%;align-self:stretch;align-items:center}.file__name{font-weight:200}.box__content{width:100%;justify-content:center;align-items:center;height:100%;border:1px dashed var(--ez-upload__border--color);border-radius:6px;box-sizing:border-box}.box__container{display:flex;flex-wrap:wrap;background-color:var(--ez-upload__container--background-color);padding:6px;width:100%;border-radius:12px}a:-webkit-any-link{color:#008561;fill:#008561;cursor:pointer;text-decoration:none}progress[value]{display:flex;width:100%;appearance:none;border:1px solid var(--ez-upload__border--color);height:12px;justify-content:flex-start;align-items:center;border-radius:3px;position:relative}progress[value]::-webkit-progress-bar{display:flex;-webkit-appearance:none;width:100%;background-color:rgb(255, 255, 255);border-radius:2px;padding:2px}progress[value]::-webkit-progress-value{display:flex;width:100%;background-color:var(--ez-upload__color--primary)}.text--center{text-align:center}.align--middle{align-self:center;align-items:center}.text{font-family:\"Sora\", \"Algerian\";text-shadow:0 0 0 #353535, 0 0 1px transparent}.text--primary{color:var(--ez-upload--text--primary);text-shadow:var(--ez-upload--text-shadow)}.text--ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.text--medium{font-size:14px}.text--small{font-size:12px}.btn-cancel{outline:none;border:none;background-color:unset;cursor:pointer}.btn-cancel::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:8px;height:8px;-webkit-mask-image:var(--ez-upload__btn__cancel-image);mask-image:var(--ez-upload__btn__cancel-image)}.iu_header{display:flex;flex-direction:column;width:100%}.iu__label{padding:var(--space--small);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ez-upload--font-family);font-size:var(--text--extra-small);font-weight:var(--ez-upload--font-weight);color:var(--ez-upload--text--primary);text-shadow:var(--ez-upload--text-shadow)}.iu__file-icon{outline:none;border:none;background-color:unset;cursor:pointer}.iu__file-icon:disabled{cursor:unset}.iu__file-icon::after{content:'';display:flex;background-color:var(--text--primary, #626e82);width:9px;height:11px;-webkit-mask-image:var(--ez-upload__file-icon-image);mask-image:var(--ez-upload__file-icon-image)}.iu__file-icon:disabled::after{background-color:var(--text--disable, #AFB6C0)}.iu__icon-label{justify-content:center;display:flex;cursor:pointer;padding:var(--ez-upload--padding--large) 0px;box-sizing:border-box}.background--disabled{background-color:var(--color--disable-secondary, #F2F5F8)}.text--disabled{color:var(--text--disable, #AFB6C0)}.mouse-pointer--disabled{cursor:unset}.appearanceNone{width:0px;height:0px}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
2576
-
2577
- let EzUpload = class {
2578
- constructor(hostRef) {
2579
- index.registerInstance(this, hostRef);
2580
- this.ezChange = index.createEvent(this, "ezChange", 7);
2581
- this._filePointers = new Map();
2582
- /**
2583
- * Deixa o campo disponível ou não para digitação.
2584
- */
2585
- this.enabled = true;
2586
- }
2587
- changeValue(newValue) {
2588
- if (newValue !== this._updatingValue) {
2589
- this._filePointers.forEach(f => {
2590
- if (this.isRemoteFile(f)) {
2591
- f.abortUpload();
2592
- }
2593
- });
2594
- this._filePointers = new Map();
2595
- this.updateFilePointers();
2596
- }
2597
- this._updatingValue = undefined;
2598
- }
2599
- updateFilePointers() {
2600
- if (this.value) {
2601
- this.value.forEach(ezFile => this._filePointers.set(ezFile.name, ezFile));
2602
- }
2603
- }
2604
- normalizeRequestHeaders() {
2605
- this._requestHeaders = new Map();
2606
- if (typeof this.requestHeaders == "string") {
2607
- try {
2608
- this.requestHeaders = JSON.parse(this.requestHeaders);
2609
- }
2610
- catch (e) {
2611
- this.requestHeaders = undefined;
2612
- }
2613
- }
2614
- for (var key in this.requestHeaders) {
2615
- this._requestHeaders.set(key, this.requestHeaders[key]);
2616
- }
2617
- }
2618
- /**
2619
- * Método responsável por adicionar um ou mais arquivos ao componente.
2620
- */
2621
- async addFiles(files) {
2622
- if (this.maxFiles > 0) {
2623
- let countDistinctFiles = this._filePointers.size;
2624
- files.forEach(file => {
2625
- if (!this._filePointers.has(file.name)) {
2626
- countDistinctFiles++;
2627
- }
2628
- });
2629
- if (countDistinctFiles > this.maxFiles) {
2630
- this.showError(`A quantidade máxima de arquivos é ${this.maxFiles}.`);
2631
- return;
2632
- }
2633
- }
2634
- Array.prototype.forEach.call(files, this.addFile.bind(this));
2635
- }
2636
- /**
2637
- * Realiza o foco no componente de upload
2638
- */
2639
- async setFocus() {
2640
- this._fileInput.focus();
2641
- }
2642
- /**
2643
- * Remove o foco no componente de upload
2644
- */
2645
- async setBlur() {
2646
- this._fileInput.blur();
2647
- }
2648
- async addFile(file) {
2649
- const oldFile = this._filePointers.get(file.name);
2650
- if (oldFile) {
2651
- ApplicationUtils.confirm("Substituir arquivo", `Já existe um arquivo chamado "${file.name}". Deseja substituí-lo?`)
2652
- .then(ok => {
2653
- if (ok) {
2654
- if (this.isRemoteFile(oldFile)) {
2655
- oldFile.abortUpload();
2656
- }
2657
- this.doAddFile(file);
2658
- }
2659
- });
2660
- }
2661
- else {
2662
- this.doAddFile(file);
2663
- }
2664
- }
2665
- async doAddFile(file) {
2666
- if (this.validateFile(file)) {
2667
- const uploadingFile = new RemoteFile(file);
2668
- this._filePointers.set(file.name, uploadingFile);
2669
- uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
2670
- .then((files) => files.forEach(ezFile => this.finishUpload(ezFile)))
2671
- .catch(msg => this.showError(msg));
2672
- index.forceUpdate(this);
2673
- }
2674
- }
2675
- finishUpload(ezFile) {
2676
- this._filePointers.set(ezFile.name, ezFile);
2677
- this.updateValue();
2678
- }
2679
- updateValue() {
2680
- this._updatingValue = [];
2681
- this._filePointers.forEach(f => {
2682
- if (!this.isRemoteFile(f)) {
2683
- this._updatingValue.push(f);
2684
- }
2685
- });
2686
- this.value = this._updatingValue;
2687
- this.ezChange.emit(this.value);
2688
- }
2689
- buildProgressId(uploading) {
2690
- let sanitizedName = uploading.name.replace(/[^a-z0-9_]/gi, "_");
2691
- return `PROGRESS_${sanitizedName}_${uploading.file.lastModified}`;
2692
- }
2693
- updateFeedback(uf) {
2694
- window.requestAnimationFrame(() => {
2695
- if (this._host) {
2696
- const progress = this._host.shadowRoot.querySelector("#" + this.buildProgressId(uf));
2697
- if (progress) {
2698
- progress.value = uf.progress;
2699
- }
2700
- }
2701
- });
2702
- }
2703
- validateFile(file) {
2704
- if (!this._filePointers.has(file.name) && this.maxFiles > 0 && this._filePointers.size >= this.maxFiles) {
2705
- this.showError(`A quantidade máxima de arquivos é ${this.maxFiles}.`);
2706
- return false;
2707
- }
2708
- if (file.size === 0) {
2709
- this.showError(`Erro de permissão: O arquivo "${file.name}" não pode ser enviado.`);
2710
- return false;
2711
- }
2712
- if (!this.urlUpload) {
2713
- this.showError("Endereço de upload não informado");
2714
- return false;
2715
- }
2716
- if (this.maxFileSize >= 0 && file.size > this.maxFileSize) {
2717
- this.showError("O tamanho máximo dos arquivos é de " + this.formatBytes(this.maxFileSize));
2718
- return false;
2719
- }
2720
- return true;
2721
- }
2722
- showError(message) {
2723
- ApplicationUtils.alert("Enviando arquivo", message);
2724
- }
2725
- formatBytes(bytes, decimals = 1) {
2726
- if (bytes === 0)
2727
- return "0 Bytes";
2728
- const k = 1024;
2729
- const dm = decimals < 0 ? 0 : decimals;
2730
- const sizes = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
2731
- const i = Math.floor(Math.log(bytes) / Math.log(k));
2732
- return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
2733
- }
2734
- onFileInputChange(event) {
2735
- const input = event.target;
2736
- this.addFiles(Array.from(input.files));
2737
- this._fileInput.value = "";
2738
- }
2739
- isRemoteFile(item) {
2740
- return "file" in item;
2741
- }
2742
- removeFromList(name) {
2743
- this._filePointers.delete(name);
2744
- this.updateValue();
2745
- }
2746
- removeFile(name) {
2747
- const item = this._filePointers.get(name);
2748
- if (this.isRemoteFile(item)) {
2749
- item.abortUpload();
2750
- this.removeFromList(name);
2751
- }
2752
- else {
2753
- if (this.urlDelete) {
2754
- const uploadingFile = new RemoteFile(null);
2755
- this._filePointers.set(item.name, uploadingFile);
2756
- uploadingFile.delete(item, this.urlDelete, null)
2757
- .then(_ok => this.removeFromList(name))
2758
- .catch(msg => this.showError(msg));
2759
- }
2760
- else {
2761
- this.removeFromList(name);
2762
- }
2763
- }
2764
- }
2765
- openFilesDialog() {
2766
- if (this.enabled) {
2767
- this._fileInput.click();
2768
- }
2769
- }
2770
- componentDidLoad() {
2771
- if (this.enabled && this._dropZone && window.FileList && window.File) {
2772
- this._dropZone.addEventListener("dragover", event => {
2773
- event.stopPropagation();
2774
- event.preventDefault();
2775
- event.dataTransfer.dropEffect = "copy";
2776
- this._dropZone.style.background = "#c2dbff";
2777
- });
2778
- this._dropZone.addEventListener("drop", event => {
2779
- event.stopPropagation();
2780
- event.preventDefault();
2781
- this.addFiles(Array.from(event.dataTransfer.files));
2782
- this._dropZone.style.background = "";
2783
- });
2784
- this._dropZone.addEventListener("dragleave", _event => {
2785
- this._dropZone.style.background = "";
2786
- });
2787
- }
2788
- }
2789
- componentWillRender() {
2790
- if (this.value) {
2791
- if (this._filePointers.size < this.value.length) {
2792
- this.updateFilePointers();
2793
- }
2794
- }
2795
- }
2796
- render() {
2797
- return (index.h("div", { ref: (el) => this._dropZone = el, class: this.evalDisabledClass("iu", "background--disabled") }, index.h("div", { class: "iu__container", onClick: () => this.openFilesDialog() }, index.h("div", { class: "iu_header" }, this.label ? index.h("label", { class: this.evalDisabledClass("iu__label", "text--disabled"), title: this.label }, this.label) : null, index.h("div", { class: this.evalDisabledClass("iu__icon-label", "mouse-pointer--disabled") }, index.h("button", { class: "iu__file-icon", disabled: !this.enabled }), index.h("div", { class: this.evalDisabledClass("text text--center text--medium text--primary", "text--disabled") }, this.enabled ? "Arraste e solte ou clique para adicionar arquivos" : "Somente leitura"))), this.buildFooter()), index.h("input", { ref: (el) => this._fileInput = el, onChange: (ev) => this.onFileInputChange(ev), type: "file", multiple: true, class: "appearanceNone" })));
2798
- }
2799
- buildFooter() {
2800
- if (this._filePointers.size === 0) {
2801
- return null;
2802
- }
2803
- const items = [];
2804
- this._filePointers.forEach(item => items.push(this.buildFileItem(item)));
2805
- return (index.h("div", { class: "iu__footer" }, items));
2806
- }
2807
- buildFileItem(item) {
2808
- const fileName = item.name;
2809
- const progress = Number(item["progress"]);
2810
- const downloadURL = item["downloadURL"];
2811
- const label = `${fileName} (${this.formatBytes(item.size)})`;
2812
- return (index.h("div", { class: "iu__item", key: fileName, onClick: evt => evt.stopPropagation() }, index.h("div", { class: "iu__item-label modificador" }, index.h("div", { title: label, class: "col--stretch align--middle file__name text text--primary text--small text--ellipsis align--middle" }, downloadURL ? index.h("a", { href: downloadURL, download: true }, label) : label)), isNaN(progress)
2813
- ?
2814
- null
2815
- :
2816
- index.h("div", { class: "col col--sd-4 col--stretch align--middle" }, index.h("progress", { id: this.buildProgressId(item), value: progress, max: "100" })), this.enabled
2817
- ?
2818
- index.h("div", { class: "col col--stretch align--middle" }, index.h("button", { class: "btn-cancel ", onClick: () => this.removeFile(fileName) }))
2819
- :
2820
- null));
2821
- }
2822
- evalDisabledClass(regularClasses, disabledClass) {
2823
- return this.enabled ? regularClasses : `${regularClasses} ${disabledClass}`;
2824
- }
2825
- get _host() { return index.getElement(this); }
2826
- static get watchers() { return {
2827
- "value": ["changeValue"],
2828
- "requestHeaders": ["normalizeRequestHeaders"]
2829
- }; }
2830
- };
2831
- EzUpload.style = ezUploadCss;
2832
-
2833
- const testDuCss = ":host{display:block}";
2834
-
2835
- let TestDu = class {
2836
- constructor(hostRef) {
2837
- index.registerInstance(this, hostRef);
2838
- }
2839
- /*private _ezButton// : HTMLEzButton;
2840
- private _ezComboBox// : HTMLEzComboBox;
2841
- private _ezDateInput// : HTMLEzDateInput;
2842
- private _ezDateTimeInput// : HTMLEzDateTimeInput;
2843
- private _ezNumberInput// : HTMLEzNumberInput
2844
- private _ezSearch// : HTMLEzSearch
2845
- private _ezUpload// : HTMLEzUpload*/
2846
- componentWillLoad() {
2847
- this.dataUnit = new UnitMetadata.DataUnit("testes_com_formulario");
2848
- this.dataUnit.metadata = {
2849
- name: "dd://br.com.sankhya.fin.cad.movimentacaoFinanceira/Financeiro",
2850
- label: "Parceiro",
2851
- fields: [
2852
- {
2853
- name: "CODPARC",
2854
- label: "Parceiro",
2855
- dataType: UnitMetadata.DataType.NUMBER,
2856
- userInterface: UnitMetadata.UserInterface.SEARCH,
2857
- required: true,
2858
- properties: {}
2859
- },
2860
- {
2861
- name: "RECDESP",
2862
- label: "Receita/Despesa",
2863
- dataType: UnitMetadata.DataType.TEXT,
2864
- userInterface: UnitMetadata.UserInterface.OPTIONSELECTOR,
2865
- required: true,
2866
- properties: { options: `{"-1": "Despesa", "1": "Receita"}` }
2867
- },
2868
- {
2869
- name: "P",
2870
- label: "pera",
2871
- dataType: UnitMetadata.DataType.TEXT,
2872
- userInterface: UnitMetadata.UserInterface.OPTIONSELECTOR,
2873
- properties: { options: `{"M": "Madura", "V": "Verde", "P": "Passada"}` }
2874
- },
2875
- {
2876
- name: "ME",
2877
- label: "ME",
2878
- dataType: UnitMetadata.DataType.NUMBER,
2879
- userInterface: UnitMetadata.UserInterface.DECIMALNUMBER,
2880
- properties: { precision: 4, prettyPrecision: 1 }
2881
- }
2882
- ]
2883
- };
2884
- this.dataUnit.dataLoader = () => new Promise(accept => accept([
2885
- {
2886
- __record__id__: "1321321321321321",
2887
- CODPARC: 10,
2888
- NOMEPARC: "Parceiro 10",
2889
- P: "M",
2890
- L: "Bagaço",
2891
- LI: "Azedo"
2892
- }
2893
- ]));
2894
- }
2895
- render() {
2896
- return (index.h("ez-form", { dataUnit: this.dataUnit }));
2897
- }
2898
- };
2899
- TestDu.style = testDuCss;
2900
-
2901
- exports.ez_calendar = EzCalendar;
2902
- exports.ez_check = EzCheck;
2903
- exports.ez_collapsible_box = EzCollapsibleBox;
2904
- exports.ez_combo_box = EzComboBox;
2905
- exports.ez_date_input = EzDateInput;
2906
- exports.ez_date_time_input = EzDateTimeInput;
2907
- exports.ez_form = EzForm;
2908
- exports.ez_icon = EzIcon;
2909
- exports.ez_number_input = EzNumberInput;
2910
- exports.ez_search = EzSearch;
2911
- exports.ez_tabselector = EzTabselector;
2912
- exports.ez_text_area = EzTextArea;
2913
- exports.ez_text_input = EzTextInput;
2914
- exports.ez_time_input = EzTimeInput;
2915
- exports.ez_upload = EzUpload;
2916
- exports.test_du = TestDu;