@sankhyalabs/ezui 1.1.94 → 1.1.97

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 (93) hide show
  1. package/dist/cjs/{CSSVarsUtils-66e86394.js → CSSVarsUtils-8fbdf2e0.js} +1 -0
  2. package/dist/cjs/StringUtils-0ba09df4.js +57 -0
  3. package/dist/cjs/UnitMetadata-2e11c5d3.js +1310 -0
  4. package/dist/cjs/ez-button_3.cjs.entry.js +578 -0
  5. package/dist/cjs/ez-calendar_14.cjs.entry.js +2657 -0
  6. package/dist/cjs/{ez-button_11.cjs.entry.js → ez-grid.cjs.entry.js} +27 -1501
  7. package/dist/cjs/ez-icon.cjs.entry.js +42 -0
  8. package/dist/cjs/ez-modal_2.cjs.entry.js +317 -0
  9. package/dist/cjs/ez-popover.cjs.entry.js +1 -1
  10. package/dist/cjs/ez-time-input.cjs.entry.js +7 -7
  11. package/dist/cjs/ezui.cjs.js +1 -1
  12. package/dist/cjs/loader.cjs.js +1 -1
  13. package/dist/collection/components/ez-check/ez-check.css +4 -3
  14. package/dist/collection/components/ez-combo-box/ez-combo-box.js +52 -3
  15. package/dist/collection/components/ez-form/DataBinder.js +13 -0
  16. package/dist/collection/components/ez-form/fieldbuilder/FieldBuilder.js +4 -1
  17. package/dist/collection/components/ez-form/fieldbuilder/tpl/CheckBox.tpl.js +4 -4
  18. package/dist/collection/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.js +2 -2
  19. package/dist/collection/components/ez-form/fieldbuilder/tpl/DateInput.tpl.js +2 -2
  20. package/dist/collection/components/ez-form/fieldbuilder/tpl/FileInput.tpl.js +2 -2
  21. package/dist/collection/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.js +6 -6
  22. package/dist/collection/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.js +2 -2
  23. package/dist/collection/components/ez-form/fieldbuilder/tpl/TextArea.tpl.js +2 -2
  24. package/dist/collection/components/ez-form/structure/FormSheetMetadata.js +14 -8
  25. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +3 -2
  26. package/dist/collection/components/ez-grid/ez-grid.css +8 -0
  27. package/dist/collection/components/ez-grid/ez-grid.js +3 -3
  28. package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.css +28 -4
  29. package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.js +6 -5
  30. package/dist/collection/components/ez-grid/subcomponents/select-box/select-box.css +10 -7
  31. package/dist/collection/components/ez-grid/subcomponents/select-box/select-box.js +12 -17
  32. package/dist/collection/components/ez-icon/ez-icon.css +5 -0
  33. package/dist/collection/components/ez-list/ez-list.js +2 -2
  34. package/dist/collection/components/ez-text-input/ez-text-input.css +2 -2
  35. package/dist/collection/components/ez-text-input/ez-text-input.js +24 -1
  36. package/dist/collection/components/test-du/test-du.js +1 -1
  37. package/dist/collection/utils/CSSVarsUtils.js +1 -0
  38. package/dist/custom-elements/index.js +290 -6376
  39. package/dist/esm/{CSSVarsUtils-aeee9825.js → CSSVarsUtils-667e0016.js} +1 -0
  40. package/dist/esm/StringUtils-cbf10229.js +55 -0
  41. package/dist/esm/UnitMetadata-8b1bbaa2.js +1304 -0
  42. package/dist/esm/ez-button_3.entry.js +572 -0
  43. package/dist/esm/ez-calendar_14.entry.js +2640 -0
  44. package/dist/esm/{ez-button_11.entry.js → ez-grid.entry.js} +23 -1487
  45. package/dist/esm/ez-icon.entry.js +38 -0
  46. package/dist/esm/ez-modal_2.entry.js +312 -0
  47. package/dist/esm/ez-popover.entry.js +1 -1
  48. package/dist/esm/ez-time-input.entry.js +2 -2
  49. package/dist/esm/ezui.js +1 -1
  50. package/dist/esm/loader.js +1 -1
  51. package/dist/ezui/ezui.esm.js +1 -1
  52. package/dist/ezui/p-07b60fe9.js +1 -0
  53. package/dist/ezui/p-2336c9ce.entry.js +1 -0
  54. package/dist/ezui/p-2f84ba72.js +1 -0
  55. package/dist/ezui/{p-4b5c4408.entry.js → p-45a25c30.entry.js} +1 -1
  56. package/dist/ezui/{p-ca42d682.entry.js → p-532b5b24.entry.js} +46 -46
  57. package/dist/ezui/p-614fbb4e.entry.js +1 -0
  58. package/dist/ezui/p-7165ac4f.entry.js +1 -0
  59. package/dist/ezui/p-90f6d8a0.entry.js +1 -0
  60. package/dist/ezui/{p-7e1d9c29.entry.js → p-d3f87e18.entry.js} +1 -1
  61. package/dist/ezui/p-d54c157f.js +1 -0
  62. package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +8 -0
  63. package/dist/types/components/ez-form/DataBinder.d.ts +1 -0
  64. package/dist/types/components/ez-form/ez-form.d.ts +6 -1
  65. package/dist/types/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.d.ts +2 -1
  66. package/dist/types/components/ez-form/fieldbuilder/tpl/DateInput.tpl.d.ts +2 -1
  67. package/dist/types/components/ez-form/fieldbuilder/tpl/FileInput.tpl.d.ts +2 -1
  68. package/dist/types/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.d.ts +4 -2
  69. package/dist/types/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.d.ts +2 -1
  70. package/dist/types/components/ez-form/fieldbuilder/tpl/TextArea.tpl.d.ts +2 -1
  71. package/dist/types/components/ez-grid/subcomponents/select-box/select-box.d.ts +6 -4
  72. package/dist/types/components/ez-text-input/ez-text-input.d.ts +4 -0
  73. package/dist/types/components.d.ts +26 -2
  74. package/package.json +2 -2
  75. package/dist/cjs/ApplicationUtils-d1c1db56.js +0 -35
  76. package/dist/cjs/ez-calendar.cjs.entry.js +0 -224
  77. package/dist/cjs/ez-collapsible-box_7.cjs.entry.js +0 -853
  78. package/dist/cjs/ez-combo-box.cjs.entry.js +0 -254
  79. package/dist/cjs/ez-form.cjs.entry.js +0 -753
  80. package/dist/cjs/index-5c8eb919.js +0 -7460
  81. package/dist/esm/ApplicationUtils-01280a9d.js +0 -33
  82. package/dist/esm/ez-calendar.entry.js +0 -220
  83. package/dist/esm/ez-collapsible-box_7.entry.js +0 -843
  84. package/dist/esm/ez-combo-box.entry.js +0 -250
  85. package/dist/esm/ez-form.entry.js +0 -749
  86. package/dist/esm/index-4688c617.js +0 -7452
  87. package/dist/ezui/p-278ce681.entry.js +0 -1
  88. package/dist/ezui/p-33d1247f.entry.js +0 -1
  89. package/dist/ezui/p-5793a2e1.entry.js +0 -1
  90. package/dist/ezui/p-68f6b75e.entry.js +0 -1
  91. package/dist/ezui/p-7107d7ef.js +0 -1
  92. package/dist/ezui/p-7ff8b7f7.js +0 -1
  93. package/dist/ezui/p-8b099482.js +0 -1
@@ -1,33 +0,0 @@
1
- class ApplicationUtils {
2
- static async showDialog(title, message, icon = null, confirm, critical = false) {
3
- return new Promise(resolve => {
4
- let dialog = document.querySelector("ez-dialog");
5
- if (!dialog) {
6
- dialog = document.createElement("ez-dialog");
7
- window.document.body.appendChild(dialog);
8
- }
9
- dialog.show(title, message, critical, confirm, icon).then(ok => resolve(ok));
10
- });
11
- }
12
- static async alert(title, message, icon = null) {
13
- return ApplicationUtils.showDialog(title, message, icon, false, false);
14
- }
15
- static async error(title, message, icon = null) {
16
- return ApplicationUtils.showDialog(title, message, icon, false, true);
17
- }
18
- static async confirm(title, message, icon = null, critical = false) {
19
- return ApplicationUtils.showDialog(title, message, icon, true, critical);
20
- }
21
- static async info(message) {
22
- let toast = document.querySelector("ez-toast");
23
- if (!toast) {
24
- toast = document.createElement("ez-toast");
25
- window.document.body.appendChild(toast);
26
- }
27
- toast.message = message;
28
- toast.fadeTime = 4000;
29
- toast.show();
30
- }
31
- }
32
-
33
- export { ApplicationUtils as A };
@@ -1,220 +0,0 @@
1
- import { r as registerInstance, c as createEvent, f as forceUpdate, h } from './index-6b8bfbeb.js';
2
- import './index-4688c617.js';
3
- import { F as FloatingManager } from './FloatingManager-bb90ef41.js';
4
-
5
- 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-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{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}.calendarTime{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}.calendarTime__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}";
6
-
7
- let EzCalendar = class {
8
- constructor(hostRef) {
9
- registerInstance(this, hostRef);
10
- this.ezChange = createEvent(this, "ezChange", 7);
11
- this._firstRender = true;
12
- this._todayLabel = "Hoje";
13
- this._weekDayLabels = ["D", "S", "T", "Q", "Q", "S", "S"];
14
- this._monthLabels = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
15
- 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"];
16
- 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"];
17
- /**
18
- * A data selecionada no calendário
19
- */
20
- this.value = new Date();
21
- /**
22
- * No modo floating o calendário só se tornará visível
23
- * quando o método show() for acionado.
24
- */
25
- this.floating = false;
26
- /**
27
- * Exibe ou não as horas e minutos no calendario
28
- */
29
- this.time = false;
30
- /**
31
- * Exibe ou não os segundos no calendario
32
- */
33
- this.showSeconds = false;
34
- }
35
- /**
36
- * Usado no modo floating. Faz com que o componente seja exibido.
37
- * É possível determinar ajustes de posicionamento através dos parâmetros
38
- * top, left, bottom e right. Esses parâmetros devem ser informados como
39
- * strings no formato css.
40
- */
41
- async show(top, left, bottom, right) {
42
- if (this.floating) {
43
- this._floatingID = FloatingManager.float(this._box, this._container, { autoClose: true, top, left, bottom, right });
44
- window.requestAnimationFrame(() => {
45
- this._box.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
46
- });
47
- this.scroll();
48
- }
49
- }
50
- /**
51
- * Método necessário para ajustar o posicionamento do calendar acima ou abaixo do ez-date-input conforme a disponibilidade de espaço.
52
- */
53
- async fitVertical(topOffset, bottomOffset) {
54
- const neededHeight = this._container.getBoundingClientRect().bottom + this._calendarHeight;
55
- const availableBottom = (window.innerHeight || document.documentElement.clientHeight) > neededHeight;
56
- if (availableBottom) {
57
- this.show(topOffset + "px", undefined, "unset");
58
- }
59
- else {
60
- this.show("unset", undefined, bottomOffset + "px");
61
- }
62
- }
63
- /**
64
- * Usado no modo floating. Faz com que o componente seja ocultado.
65
- */
66
- async hide() {
67
- if (this._floatingID !== undefined) {
68
- FloatingManager.close(this._floatingID);
69
- this._floatingID = undefined;
70
- }
71
- }
72
- valueChanged() {
73
- if (this.value) {
74
- this._currentPosition.setTime(this.value.getTime());
75
- this._currentPosition.setDate(1);
76
- }
77
- }
78
- getMonthLabel() {
79
- return this._monthLabels[this._currentPosition.getMonth()] + " " + this._currentPosition.getFullYear();
80
- }
81
- isSelectedDate(d) {
82
- if (this.value) {
83
- return this.value.getDate() == d.getDate() && this.value.getMonth() == d.getMonth() && this.value.getFullYear() == d.getFullYear();
84
- }
85
- return false;
86
- }
87
- changeMonth(offset) {
88
- this._currentPosition.setMonth(this._currentPosition.getMonth() + offset);
89
- forceUpdate(this);
90
- }
91
- selectDate(d) {
92
- let newDate = d;
93
- if (this.value && (this.time || this.showSeconds)) {
94
- newDate.setHours(this.value.getHours());
95
- newDate.setMinutes(this.value.getMinutes());
96
- if (this.showSeconds) {
97
- newDate.setSeconds(this.value.getSeconds());
98
- }
99
- else {
100
- newDate.setSeconds(0);
101
- }
102
- }
103
- this.value = newDate;
104
- this.ezChange.emit();
105
- }
106
- selectHours(hour) {
107
- if (!this.value) {
108
- this.value = new Date();
109
- }
110
- this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), hour, this.value.getMinutes(), this.value.getSeconds());
111
- this.ezChange.emit();
112
- }
113
- selectMinutes(minute) {
114
- if (!this.value) {
115
- this.value = new Date();
116
- }
117
- this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), this.value.getHours(), minute, this.value.getSeconds());
118
- this.ezChange.emit();
119
- }
120
- selectSeconds(second) {
121
- if (!this.value) {
122
- this.value = new Date();
123
- }
124
- this.value = new Date(this.value.getFullYear(), this.value.getMonth(), this.value.getDate(), this.value.getHours(), this.value.getMinutes(), second);
125
- this.ezChange.emit();
126
- }
127
- updateScroll(element) {
128
- if (element) {
129
- const { scrollHeight, clientHeight, scrollTop } = element;
130
- const remainingScroll = scrollHeight - clientHeight - Math.ceil(scrollTop);
131
- if (remainingScroll > 0) {
132
- element.classList.add("endHidden");
133
- }
134
- else {
135
- element.classList.remove("endHidden");
136
- }
137
- }
138
- }
139
- componentDidRender() {
140
- if (this.floating && this._firstRender) {
141
- this._calendarHeight = this._box.clientHeight;
142
- this._box.remove();
143
- this._firstRender = false;
144
- }
145
- this.updateScroll(this._hoursScroll);
146
- this.updateScroll(this._minutesScroll);
147
- this.updateScroll(this._secondsScroll);
148
- }
149
- componentDidLoad() {
150
- this.scroll();
151
- }
152
- scroll() {
153
- if (this.time || this.showSeconds) {
154
- this._hoursScroll.scrollTop = this._hoursSelect.offsetTop - 64;
155
- this._minutesScroll.scrollTop = this._minutesSelect.offsetTop - 64;
156
- this.updateScroll(this._hoursScroll);
157
- this.updateScroll(this._minutesScroll);
158
- if (this.showSeconds) {
159
- this._secondsScroll.scrollTop = this._secondsSelect.offsetTop - 64;
160
- this.updateScroll(this._secondsScroll);
161
- }
162
- }
163
- }
164
- render() {
165
- if (this._currentPosition == null) {
166
- this._currentPosition = new Date();
167
- if (this.value) {
168
- this._currentPosition.setTime(this.value.getTime());
169
- }
170
- this._currentPosition.setDate(1);
171
- }
172
- const firstDate = new Date();
173
- firstDate.setTime(this._currentPosition.getTime());
174
- firstDate.setDate(1 - firstDate.getDay());
175
- return (h("section", { ref: elem => this._container = elem }, h("div", { ref: elem => this._box = elem, style: { display: 'flex' } }, h("div", { class: "calendar" }, h("div", { class: "calendar__header" }, h("button", { class: "calendar__btn-previous", onClick: () => this.changeMonth(-1) }), h("label", { class: "calendar__lbl-month" }, this.getMonthLabel()), h("button", { class: "calendar__btn-next", onClick: () => this.changeMonth(1) })), h("div", { class: "calendar__body" }, h("div", { class: "calendar__line" }, this._weekDayLabels.map(day => h("div", { class: "calendar__cell calendar__cell--unselectable" }, day))), [0, 7, 14, 21, 28, 35].map(offset => h("div", { class: "calendar__line" }, [0, 1, 2, 3, 4, 5, 6].map(index => {
176
- const date = new Date();
177
- date.setTime(firstDate.getTime());
178
- date.setDate(date.getDate() + offset + index);
179
- let classNames = "calendar__cell";
180
- if (this._currentPosition.getMonth() != date.getMonth()) {
181
- classNames += " calendar__cell--secondary";
182
- }
183
- else if (this.isSelectedDate(date)) {
184
- classNames += " calendar__cell--selected";
185
- }
186
- return h("div", { class: classNames, onClick: () => this.selectDate(date) }, date.getDate());
187
- })))), h("div", { class: "calendar__footer" }, h("button", { class: "calendar__btn-today", onClick: () => this.selectDate(new Date()) }, this._todayLabel))), (this.time || this.showSeconds) &&
188
- h("div", { class: "calendarTime" }, h("div", { class: "calendarTime__header" }, h("div", null, "H"), h("div", { class: "separatorTime" }, ":"), h("div", null, "M"), this.showSeconds &&
189
- h("div", { class: "separatorTime" }, ":"), this.showSeconds &&
190
- h("div", null, "S")), h("div", { class: "calendar__body ", style: { display: 'flex', paddingLeft: '12px', paddingRight: '12px' } }, h("div", { class: "calendar__column", ref: elem => this._hoursScroll = elem, onScroll: () => this.updateScroll(this._hoursScroll) }, this._hoursLabel.map((offset, index) => {
191
- if (index === this.value.getHours()) {
192
- return (h("div", { style: { display: 'flex' }, ref: elem => this._hoursSelect = elem }, h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectHours(index) }, offset), h("div", { class: "separatorTime" }, ":")));
193
- }
194
- else {
195
- return (h("div", { style: { display: 'flex' } }, h("div", { class: "calendar__cell", onClick: () => this.selectHours(index) }, offset), h("div", { class: "separatorTime" }, ":")));
196
- }
197
- })), h("div", { class: "calendar__column", ref: elem => this._minutesScroll = elem, onScroll: () => this.updateScroll(this._minutesScroll) }, this._minutosLabel.map((offset, index) => {
198
- if (index === this.value.getMinutes()) {
199
- return (h("div", { style: { display: 'flex' }, ref: elem => this._minutesSelect = elem }, h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectMinutes(index) }, offset), this.showSeconds && h("div", { class: "separatorTime" }, ":")));
200
- }
201
- else {
202
- return (h("div", { style: { display: 'flex' } }, h("div", { class: "calendar__cell", onClick: () => this.selectMinutes(index) }, offset), this.showSeconds && h("div", { class: "separatorTime" }, ":")));
203
- }
204
- })), this.showSeconds &&
205
- h("div", { class: "calendar__column", ref: elem => this._secondsScroll = elem, onScroll: () => this.updateScroll(this._secondsScroll) }, this._minutosLabel.map((offset, index) => {
206
- if (index === this.value.getSeconds()) {
207
- return (h("div", { class: "calendar__cell calendar__cell--selected", onClick: () => this.selectSeconds(index), ref: elem => this._secondsSelect = elem }, offset));
208
- }
209
- else {
210
- return (h("div", { class: "calendar__cell", onClick: () => this.selectSeconds(index) }, offset));
211
- }
212
- })))))));
213
- }
214
- static get watchers() { return {
215
- "value": ["valueChanged"]
216
- }; }
217
- };
218
- EzCalendar.style = ezCalendarCss;
219
-
220
- export { EzCalendar as ez_calendar };