@golemui/gui-lit 1.0.2 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/{abstract-calendar-BoqKPRmS.js → abstract-calendar-D0-077XJ.js} +18 -18
- package/{calendar-DTYKVYc3.js → calendar-BclCC9VJ.js} +26 -26
- package/{calendar.element-MubSE1bx.js → calendar.element-DcnTyvfg.js} +1 -1
- package/{currency.element-BHXWcOEu.js → currency.element-5GSakkxF.js} +16 -13
- package/{date-DTYg8sog.js → date-CDUlLuYy.js} +50 -45
- package/{date-input-BeQvyfln.js → date-input-DCdGWRio.js} +8 -8
- package/{date-picker.element-DabW_-0-.js → date-picker.element-k7AJFQ5W.js} +8 -6
- package/{date.element-BtVJSIRk.js → date.element-BZO0UQez.js} +1 -1
- package/{dropdown.element-DqzC6aXR.js → dropdown.element-CyJbVAA5.js} +23 -24
- package/index.js +67 -67
- package/index.umd.cjs +148 -145
- package/{number.element-BhEyoOtc.js → number.element-CBr47IiY.js} +18 -16
- package/numeric-jmOOKz30.js +12 -0
- package/package.json +6 -6
- package/{range-calendar-9skwbwlB.js → range-calendar-CBINu84w.js} +54 -54
- package/{range-calendar.element-QTE6vGNP.js → range-calendar.element-_1bHW_c1.js} +1 -1
- package/{range-date-input-Uy8134vi.js → range-date-input-BYXzqnr1.js} +26 -26
- package/{range-date-input.element-Dj29D_OQ.js → range-date-input.element-BqzAF0O3.js} +1 -1
- package/{range-date-picker.element-CuKIBkIO.js → range-date-picker.element-BCBefgvY.js} +2 -2
|
@@ -2,13 +2,14 @@ import { InputWidgetAdapter as v, formContext as y, inputContext as g } from "@g
|
|
|
2
2
|
import { LitElement as m, nothing as h, html as c } from "lit";
|
|
3
3
|
import { property as s, customElement as b } from "lit/decorators.js";
|
|
4
4
|
import { G as f, b as w, c as $ } from "./templates-Dk1jxLwS.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
5
|
+
import { b as x, a as N } from "./numeric-jmOOKz30.js";
|
|
6
|
+
import { styleMap as D } from "lit-html/directives/style-map.js";
|
|
7
|
+
import { consume as C, provide as A } from "@lit/context";
|
|
7
8
|
import "rxjs";
|
|
8
|
-
var
|
|
9
|
-
for (var
|
|
10
|
-
(p = t[l]) && (
|
|
11
|
-
return
|
|
9
|
+
var E = Object.defineProperty, O = Object.getOwnPropertyDescriptor, r = (t, i, e, u) => {
|
|
10
|
+
for (var o = u > 1 ? void 0 : u ? O(i, e) : i, l = t.length - 1, p; l >= 0; l--)
|
|
11
|
+
(p = t[l]) && (o = (u ? p(i, e, o) : p(o)) || o);
|
|
12
|
+
return u && o && E(i, e, o), o;
|
|
12
13
|
};
|
|
13
14
|
let a = class extends m {
|
|
14
15
|
constructor() {
|
|
@@ -40,8 +41,8 @@ let a = class extends m {
|
|
|
40
41
|
if (this.autoGrow)
|
|
41
42
|
if (t) {
|
|
42
43
|
t.style.width = "0px";
|
|
43
|
-
const
|
|
44
|
-
i.width = `${
|
|
44
|
+
const u = Math.max(23, t.scrollWidth);
|
|
45
|
+
i.width = `${u}px`, i.maxWidth = `${u}px`, t.style.width = "";
|
|
45
46
|
} else
|
|
46
47
|
i.width = "47px";
|
|
47
48
|
const e = {
|
|
@@ -68,7 +69,7 @@ let a = class extends m {
|
|
|
68
69
|
id=${this.uid}
|
|
69
70
|
data-cy=${`${this.uid}_number`}
|
|
70
71
|
class="gui-widget-input"
|
|
71
|
-
style=${
|
|
72
|
+
style=${D(i)}
|
|
72
73
|
value=${this.value}
|
|
73
74
|
?required=${this.required}
|
|
74
75
|
?disabled=${this.disabled}
|
|
@@ -77,6 +78,7 @@ let a = class extends m {
|
|
|
77
78
|
placeholder=${this.placeholder || h}
|
|
78
79
|
autocomplete=${this.autocomplete || h}
|
|
79
80
|
@input=${this.valueChanged}
|
|
81
|
+
@beforeinput=${x}
|
|
80
82
|
@keydown=${this.keyDown}
|
|
81
83
|
@blur=${this.onBlur}
|
|
82
84
|
/>
|
|
@@ -98,7 +100,7 @@ let a = class extends m {
|
|
|
98
100
|
`;
|
|
99
101
|
}
|
|
100
102
|
keyDown(t) {
|
|
101
|
-
switch (t.stopPropagation(), t.key) {
|
|
103
|
+
switch (t.stopPropagation(), N(t), t.key) {
|
|
102
104
|
case "ArrowUp":
|
|
103
105
|
t.preventDefault(), this.plus();
|
|
104
106
|
break;
|
|
@@ -206,10 +208,10 @@ a = r([
|
|
|
206
208
|
b("gui-number")
|
|
207
209
|
], a);
|
|
208
210
|
typeof customElements < "u" && !customElements.get("gui-number") && customElements.define("gui-number", a);
|
|
209
|
-
var
|
|
210
|
-
for (var
|
|
211
|
-
(p = t[l]) && (
|
|
212
|
-
return
|
|
211
|
+
var _ = Object.defineProperty, q = Object.getOwnPropertyDescriptor, n = (t, i, e, u) => {
|
|
212
|
+
for (var o = u > 1 ? void 0 : u ? q(i, e) : i, l = t.length - 1, p; l >= 0; l--)
|
|
213
|
+
(p = t[l]) && (o = (u ? p(i, e, o) : p(o)) || o);
|
|
214
|
+
return u && o && _(i, e, o), o;
|
|
213
215
|
};
|
|
214
216
|
let d = class extends m {
|
|
215
217
|
constructor() {
|
|
@@ -260,11 +262,11 @@ let d = class extends m {
|
|
|
260
262
|
}
|
|
261
263
|
};
|
|
262
264
|
n([
|
|
263
|
-
|
|
265
|
+
C({ context: y }),
|
|
264
266
|
s({ attribute: !1 })
|
|
265
267
|
], d.prototype, "formContext", 2);
|
|
266
268
|
n([
|
|
267
|
-
|
|
269
|
+
A({ context: g })
|
|
268
270
|
], d.prototype, "adapter", 2);
|
|
269
271
|
d = n([
|
|
270
272
|
b("gui-number-input")
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const r = /^[0-9.,eE+-]+$/;
|
|
2
|
+
function i(t) {
|
|
3
|
+
const a = t.data ?? t.dataTransfer?.getData("text");
|
|
4
|
+
a && (r.test(a) || t.preventDefault());
|
|
5
|
+
}
|
|
6
|
+
function o(t) {
|
|
7
|
+
t.ctrlKey || t.metaKey || t.altKey || t.isComposing || t.key.length === 1 && (r.test(t.key) || t.preventDefault());
|
|
8
|
+
}
|
|
9
|
+
export {
|
|
10
|
+
o as a,
|
|
11
|
+
i as b
|
|
12
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@golemui/gui-lit",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./index.umd.cjs",
|
|
@@ -22,11 +22,11 @@
|
|
|
22
22
|
"*.md"
|
|
23
23
|
],
|
|
24
24
|
"peerDependencies": {
|
|
25
|
-
"@golemui/lit": "1.0.
|
|
26
|
-
"@golemui/core": "1.0.
|
|
27
|
-
"@golemui/gui-components": "1.0.
|
|
28
|
-
"@golemui/gui-shared": "1.0.
|
|
29
|
-
"@golemui/gui-validators": "1.0.
|
|
25
|
+
"@golemui/lit": "1.0.3",
|
|
26
|
+
"@golemui/core": "1.0.3",
|
|
27
|
+
"@golemui/gui-components": "1.0.3",
|
|
28
|
+
"@golemui/gui-shared": "1.0.3",
|
|
29
|
+
"@golemui/gui-validators": "1.0.3",
|
|
30
30
|
"@lit/context": "^1.1.6",
|
|
31
31
|
"lit-html": "^3.3.1",
|
|
32
32
|
"lit": "^3.3.1",
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { html as
|
|
2
|
-
import { property as D, state as
|
|
3
|
-
import { classMap as
|
|
4
|
-
import { i as
|
|
5
|
-
import { A } from "./abstract-calendar-
|
|
1
|
+
import { html as b, nothing as p } from "lit";
|
|
2
|
+
import { property as D, state as v, customElement as $ } from "lit/decorators.js";
|
|
3
|
+
import { classMap as M } from "lit/directives/class-map.js";
|
|
4
|
+
import { p as h, i as d, t as O, a as w, b as f, g as A, m as E, c as _ } from "./date-CDUlLuYy.js";
|
|
5
|
+
import { A as P } from "./abstract-calendar-D0-077XJ.js";
|
|
6
6
|
import "./pills-B66qz_KX.js";
|
|
7
|
-
var
|
|
8
|
-
for (var a = n > 1 ? void 0 : n ?
|
|
7
|
+
var C = Object.defineProperty, k = Object.getOwnPropertyDescriptor, g = (e, i, s, n) => {
|
|
8
|
+
for (var a = n > 1 ? void 0 : n ? k(i, s) : i, t = e.length - 1, r; t >= 0; t--)
|
|
9
9
|
(r = e[t]) && (a = (n ? r(i, s, a) : r(a)) || a);
|
|
10
|
-
return n && a &&
|
|
10
|
+
return n && a && C(i, s, a), a;
|
|
11
11
|
};
|
|
12
|
-
let c = class extends
|
|
12
|
+
let c = class extends P {
|
|
13
13
|
constructor() {
|
|
14
14
|
super(...arguments), this.value = [], this.focusDate = void 0, this.hidePills = !1, this.removePillAriaLabel = void 0, this._anchorDate = null, this._nextDate = null, this._isSelecting = !1, this._skipValueNavigation = !1, this.onPillRemoveEvent = (e) => {
|
|
15
15
|
if (this.disabled || this.readOnly) return;
|
|
@@ -45,14 +45,14 @@ let c = class extends A {
|
|
|
45
45
|
else if (this.value) {
|
|
46
46
|
const i = Array.isArray(this.value) ? this.value : [{ start: this.value }];
|
|
47
47
|
if (i.length > 0 && i[0].start) {
|
|
48
|
-
const s =
|
|
49
|
-
!isNaN(s.getTime()) && !
|
|
48
|
+
const s = h(i[0].start);
|
|
49
|
+
!isNaN(s.getTime()) && !d(s, this._currentDate, this.numberOfMonths ?? 1) && (this._currentDate = s);
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
53
|
if (e.has("focusDate") && this.focusDate) {
|
|
54
|
-
const i =
|
|
55
|
-
isNaN(i.getTime()) || (
|
|
54
|
+
const i = h(this.focusDate);
|
|
55
|
+
isNaN(i.getTime()) || (d(i, this._currentDate, this.numberOfMonths ?? 1) || (this._currentDate = i), this.focusDate = void 0);
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
renderDay(e) {
|
|
@@ -68,14 +68,14 @@ let c = class extends A {
|
|
|
68
68
|
"is-selecting": e.isSelecting,
|
|
69
69
|
disabled: e.isDisabled
|
|
70
70
|
};
|
|
71
|
-
return
|
|
71
|
+
return b`
|
|
72
72
|
<button
|
|
73
73
|
type="button"
|
|
74
74
|
role="gridcell"
|
|
75
|
-
class=${
|
|
75
|
+
class=${M(i)}
|
|
76
76
|
tabindex=${e.isFocusable ? 0 : -1}
|
|
77
77
|
?disabled=${!e.isCurrentMonth || e.isDisabled}
|
|
78
|
-
data-date=${e.date
|
|
78
|
+
data-date=${O(e.date)}
|
|
79
79
|
@click=${(s) => this.selectDate(e, s)}
|
|
80
80
|
@mouseover=${() => this.onMouseOver(e)}
|
|
81
81
|
@focus=${() => this.onMouseOver(e)}
|
|
@@ -91,30 +91,30 @@ let c = class extends A {
|
|
|
91
91
|
i.setDate(1), i.setMonth(i.getMonth() + e);
|
|
92
92
|
const s = this.generateDateGrid(e), n = i.getMonth();
|
|
93
93
|
let a = s.map((t) => {
|
|
94
|
-
const r = t.getMonth() === n, l = this.isDisabled(t), o =
|
|
94
|
+
const r = t.getMonth() === n, l = this.isDisabled(t), o = w(t), { isRangeStart: u, isRangeEnd: m, isInRange: y, isSelecting: R } = this.checkDateStatus(t), S = o || u, T = this._anchorDate ? f(t, this._anchorDate) : !1;
|
|
95
95
|
return {
|
|
96
96
|
date: t,
|
|
97
|
-
dayLabel:
|
|
97
|
+
dayLabel: A(this.localeId, t),
|
|
98
98
|
isCurrentMonth: r,
|
|
99
99
|
isToday: o,
|
|
100
|
-
isRangeStart:
|
|
101
|
-
isRangeEnd:
|
|
102
|
-
isInRange:
|
|
100
|
+
isRangeStart: u,
|
|
101
|
+
isRangeEnd: m,
|
|
102
|
+
isInRange: y,
|
|
103
103
|
isDisabled: l,
|
|
104
|
-
isOneDayRange:
|
|
104
|
+
isOneDayRange: u && m,
|
|
105
105
|
isAnchor: T,
|
|
106
|
-
isFocusable:
|
|
107
|
-
isSelecting:
|
|
106
|
+
isFocusable: S,
|
|
107
|
+
isSelecting: R && r
|
|
108
108
|
};
|
|
109
109
|
});
|
|
110
110
|
for (let t = 0; t < 2; t++)
|
|
111
111
|
a.slice(-7).every((l) => !l.isCurrentMonth) && (a = a.slice(0, -7));
|
|
112
112
|
if (e === 0 && !a.some((t) => t.isFocusable)) {
|
|
113
|
-
const t = this.numberOfMonths ?? 1, r =
|
|
114
|
-
(o) =>
|
|
113
|
+
const t = this.numberOfMonths ?? 1, r = d(/* @__PURE__ */ new Date(), this._currentDate, t), l = this.value?.some(
|
|
114
|
+
(o) => d(h(o.start), this._currentDate, t)
|
|
115
115
|
) ?? !1;
|
|
116
116
|
if (!r && !l) {
|
|
117
|
-
const o = a.find((
|
|
117
|
+
const o = a.find((u) => u.isCurrentMonth && !u.isDisabled);
|
|
118
118
|
o && (o.isFocusable = !0);
|
|
119
119
|
}
|
|
120
120
|
}
|
|
@@ -128,12 +128,12 @@ let c = class extends A {
|
|
|
128
128
|
}
|
|
129
129
|
if (this.value && Array.isArray(this.value))
|
|
130
130
|
for (const t of this.value) {
|
|
131
|
-
const r =
|
|
132
|
-
if (
|
|
133
|
-
const l =
|
|
134
|
-
|
|
135
|
-
const o = e.getTime(),
|
|
136
|
-
o >
|
|
131
|
+
const r = h(t.start);
|
|
132
|
+
if (f(e, r) && (i = !0, s = !t.end), t.end) {
|
|
133
|
+
const l = h(t.end);
|
|
134
|
+
f(e, l) && (s = !0);
|
|
135
|
+
const o = e.getTime(), u = r.getTime(), m = l.getTime();
|
|
136
|
+
o > u && o < m && (n = !0);
|
|
137
137
|
}
|
|
138
138
|
}
|
|
139
139
|
return { isRangeStart: i, isRangeEnd: s, isInRange: n, isSelecting: a };
|
|
@@ -148,7 +148,7 @@ let c = class extends A {
|
|
|
148
148
|
let n = this._anchorDate, a = s;
|
|
149
149
|
s < n && (n = s, a = this._anchorDate);
|
|
150
150
|
const t = this.calculateValidRanges(n, a), r = [...this.value || [], ...t];
|
|
151
|
-
this._skipValueNavigation = !0, this.value =
|
|
151
|
+
this._skipValueNavigation = !0, this.value = E(r), this._isSelecting = !1, this._nextDate = null, this._anchorDate = null, this.dispatchEvent(
|
|
152
152
|
new CustomEvent("change", {
|
|
153
153
|
detail: { value: this.value },
|
|
154
154
|
bubbles: !0,
|
|
@@ -173,20 +173,20 @@ let c = class extends A {
|
|
|
173
173
|
t || (t = new Date(n));
|
|
174
174
|
else if (t) {
|
|
175
175
|
const l = new Date(n);
|
|
176
|
-
l.setDate(n.getDate() - 1), s.push(
|
|
176
|
+
l.setDate(n.getDate() - 1), s.push(_(t, l)), t = null;
|
|
177
177
|
}
|
|
178
178
|
n.setDate(n.getDate() + 1);
|
|
179
179
|
}
|
|
180
|
-
return t && s.push(
|
|
180
|
+
return t && s.push(_(t, i)), s;
|
|
181
181
|
}
|
|
182
182
|
onMouseOver(e) {
|
|
183
183
|
this._isSelecting && (this._nextDate = e);
|
|
184
184
|
}
|
|
185
185
|
// --- Pills ---
|
|
186
186
|
renderAboveCalendar() {
|
|
187
|
-
if (this.hidePills) return
|
|
187
|
+
if (this.hidePills) return p;
|
|
188
188
|
const e = this.getSortedPills();
|
|
189
|
-
if (e.length === 0) return
|
|
189
|
+
if (e.length === 0) return p;
|
|
190
190
|
const i = e.map((s) => {
|
|
191
191
|
const n = this.formatDateForDisplay(s.start), a = s.end ? this.formatDateForDisplay(s.end) : n, t = `${n} - ${a}`;
|
|
192
192
|
return {
|
|
@@ -195,7 +195,7 @@ let c = class extends A {
|
|
|
195
195
|
ariaLabel: `${this.removePillAriaLabel ?? "Remove date"} ${t}`
|
|
196
196
|
};
|
|
197
197
|
});
|
|
198
|
-
return
|
|
198
|
+
return b`
|
|
199
199
|
<gui-pills
|
|
200
200
|
class="gui-range-calendar__pills"
|
|
201
201
|
.items=${i}
|
|
@@ -211,7 +211,7 @@ let c = class extends A {
|
|
|
211
211
|
`;
|
|
212
212
|
}
|
|
213
213
|
formatDateForDisplay(e) {
|
|
214
|
-
const i =
|
|
214
|
+
const i = h(e);
|
|
215
215
|
return isNaN(i.getTime()) ? e : new Intl.DateTimeFormat(this.localeId ?? "en", {
|
|
216
216
|
year: "numeric",
|
|
217
217
|
month: "2-digit",
|
|
@@ -220,36 +220,36 @@ let c = class extends A {
|
|
|
220
220
|
}
|
|
221
221
|
getSortedPills() {
|
|
222
222
|
return !this.value || !Array.isArray(this.value) ? [] : [...this.value].sort(
|
|
223
|
-
(e, i) =>
|
|
223
|
+
(e, i) => h(e.start).getTime() - h(i.start).getTime()
|
|
224
224
|
);
|
|
225
225
|
}
|
|
226
226
|
navigateToDate(e) {
|
|
227
|
-
const i =
|
|
228
|
-
!isNaN(i.getTime()) && !
|
|
227
|
+
const i = h(e);
|
|
228
|
+
!isNaN(i.getTime()) && !d(i, this._currentDate, this.numberOfMonths ?? 1) && (this._currentDate = i);
|
|
229
229
|
}
|
|
230
230
|
};
|
|
231
|
-
|
|
231
|
+
g([
|
|
232
232
|
D({ type: Array })
|
|
233
233
|
], c.prototype, "value", 2);
|
|
234
|
-
|
|
234
|
+
g([
|
|
235
235
|
D({ type: String })
|
|
236
236
|
], c.prototype, "focusDate", 2);
|
|
237
|
-
|
|
237
|
+
g([
|
|
238
238
|
D({ type: Boolean })
|
|
239
239
|
], c.prototype, "hidePills", 2);
|
|
240
|
-
|
|
240
|
+
g([
|
|
241
241
|
D({ type: String })
|
|
242
242
|
], c.prototype, "removePillAriaLabel", 2);
|
|
243
|
-
|
|
244
|
-
|
|
243
|
+
g([
|
|
244
|
+
v()
|
|
245
245
|
], c.prototype, "_anchorDate", 2);
|
|
246
|
-
|
|
247
|
-
|
|
246
|
+
g([
|
|
247
|
+
v()
|
|
248
248
|
], c.prototype, "_nextDate", 2);
|
|
249
|
-
|
|
250
|
-
|
|
249
|
+
g([
|
|
250
|
+
v()
|
|
251
251
|
], c.prototype, "_isSelecting", 2);
|
|
252
|
-
c =
|
|
252
|
+
c = g([
|
|
253
253
|
$("gui-range-calendar")
|
|
254
254
|
], c);
|
|
255
255
|
typeof customElements < "u" && !customElements.get("gui-range-calendar") && customElements.define("gui-range-calendar", c);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { InputWidgetAdapter as d, formContext as o, inputContext as h } from "@golemui/lit";
|
|
2
|
-
import "./range-calendar-
|
|
2
|
+
import "./range-calendar-CBINu84w.js";
|
|
3
3
|
import { consume as m, provide as u } from "@lit/context";
|
|
4
4
|
import { LitElement as c, html as b } from "lit";
|
|
5
5
|
import { property as D, customElement as $ } from "lit/decorators.js";
|
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import { LitElement as
|
|
2
|
-
import { repeat as
|
|
3
|
-
import { property as h, state as
|
|
4
|
-
import { classMap as
|
|
5
|
-
import { live as
|
|
6
|
-
import { G as
|
|
7
|
-
import { t as
|
|
1
|
+
import { LitElement as D, nothing as g, html as c } from "lit";
|
|
2
|
+
import { repeat as b } from "lit-html/directives/repeat.js";
|
|
3
|
+
import { property as h, state as v, customElement as _ } from "lit/decorators.js";
|
|
4
|
+
import { classMap as $ } from "lit/directives/class-map.js";
|
|
5
|
+
import { live as I } from "lit/directives/live.js";
|
|
6
|
+
import { G as A, b as w, c as P } from "./templates-Dk1jxLwS.js";
|
|
7
|
+
import { p as y, t as f, m as S } from "./date-CDUlLuYy.js";
|
|
8
8
|
import "./pills-B66qz_KX.js";
|
|
9
9
|
import { styleMap as E } from "lit-html/directives/style-map.js";
|
|
10
|
-
var
|
|
11
|
-
for (var r = a > 1 ? void 0 : a ?
|
|
10
|
+
var M = Object.defineProperty, C = Object.getOwnPropertyDescriptor, d = (t, e, s, a) => {
|
|
11
|
+
for (var r = a > 1 ? void 0 : a ? C(e, s) : e, i = t.length - 1, l; i >= 0; i--)
|
|
12
12
|
(l = t[i]) && (r = (a ? l(e, s, r) : l(r)) || r);
|
|
13
|
-
return a && r &&
|
|
13
|
+
return a && r && M(e, s, r), r;
|
|
14
14
|
};
|
|
15
|
-
let o = class extends
|
|
15
|
+
let o = class extends D {
|
|
16
16
|
constructor() {
|
|
17
|
-
super(...arguments), this.uid = void 0, this.label = void 0, this.localeId = void 0, this.errors = [], this.showErrors = !0, this.touched = !1, this.required = !1, this.disabled = !1, this.readOnly = !1, this.value = [], this.hint = void 0, this.icon = "", this.removePillAriaLabel = void 0, this.startDateAriaLabel = void 0, this.endDateAriaLabel = void 0, this.separator = void 0, this._startDate = { day: "", month: "", year: "" }, this._endDate = { day: "", month: "", year: "" }, this.MIN_DAY = 1, this.MAX_DAY = 31, this.MAX_VALID_DAY = (t, e) => t === 2 ? new Date(e, 1, 29).getDate() === 29 || !e ? 29 : 28 : t === 4 || t === 6 || t === 9 || t === 11 ? 30 : 31, this.MIN_MONTH = 1, this.MAX_MONTH = 12, this.MIN_YEAR = 1e3, this.MAX_YEAR = 9999, this.ariaController = new
|
|
17
|
+
super(...arguments), this.uid = void 0, this.label = void 0, this.localeId = void 0, this.errors = [], this.showErrors = !0, this.touched = !1, this.required = !1, this.disabled = !1, this.readOnly = !1, this.value = [], this.hint = void 0, this.icon = "", this.removePillAriaLabel = void 0, this.startDateAriaLabel = void 0, this.endDateAriaLabel = void 0, this.separator = void 0, this._startDate = { day: "", month: "", year: "" }, this._endDate = { day: "", month: "", year: "" }, this.MIN_DAY = 1, this.MAX_DAY = 31, this.MAX_VALID_DAY = (t, e) => t === 2 ? new Date(e, 1, 29).getDate() === 29 || !e ? 29 : 28 : t === 4 || t === 6 || t === 9 || t === 11 ? 30 : 31, this.MIN_MONTH = 1, this.MAX_MONTH = 12, this.MIN_YEAR = 1e3, this.MAX_YEAR = 9999, this.ariaController = new A(this, {
|
|
18
18
|
getTargets: () => this.querySelectorAll(".gui-range-date-input"),
|
|
19
19
|
getState: () => ({
|
|
20
20
|
uid: this.uid,
|
|
@@ -84,7 +84,7 @@ let o = class extends v {
|
|
|
84
84
|
[this.icon]: !!this.icon
|
|
85
85
|
};
|
|
86
86
|
return c`
|
|
87
|
-
${this.label ?
|
|
87
|
+
${this.label ? w(this.uid, t, !1, void 0, !1) : g}
|
|
88
88
|
|
|
89
89
|
<div class="gui-widget">
|
|
90
90
|
<div
|
|
@@ -92,7 +92,7 @@ let o = class extends v {
|
|
|
92
92
|
role="group"
|
|
93
93
|
aria-label=${this.label ?? "Date range input"}
|
|
94
94
|
>
|
|
95
|
-
${this.icon ? c`<span class=${
|
|
95
|
+
${this.icon ? c`<span class=${$(r)} data-icon=${this.icon}></span>` : g}
|
|
96
96
|
|
|
97
97
|
<gui-pills
|
|
98
98
|
class="gui-range-date-input__pills"
|
|
@@ -130,13 +130,13 @@ let o = class extends v {
|
|
|
130
130
|
</div>
|
|
131
131
|
</div>
|
|
132
132
|
|
|
133
|
-
${this.showErrors && this.errors?.length ?
|
|
133
|
+
${this.showErrors && this.errors?.length ? P(this.uid, t) : g}
|
|
134
134
|
</div>
|
|
135
135
|
`;
|
|
136
136
|
}
|
|
137
137
|
renderDateInputs(t, e) {
|
|
138
138
|
const s = t === "start" ? this._startDate : this._endDate;
|
|
139
|
-
return
|
|
139
|
+
return b(
|
|
140
140
|
e,
|
|
141
141
|
(a) => `${t}-${a.type}`,
|
|
142
142
|
(a, r) => {
|
|
@@ -172,7 +172,7 @@ let o = class extends v {
|
|
|
172
172
|
?disabled=${this.disabled}
|
|
173
173
|
?readonly=${this.readOnly}
|
|
174
174
|
autocomplete="off"
|
|
175
|
-
.value=${
|
|
175
|
+
.value=${I(i)}
|
|
176
176
|
@keydown=${this.handleKeyDown}
|
|
177
177
|
@keyup=${(l) => this.handleKeyUp(l, t, e)}
|
|
178
178
|
@focus=${this.handleFocus}
|
|
@@ -184,7 +184,7 @@ let o = class extends v {
|
|
|
184
184
|
`;
|
|
185
185
|
}
|
|
186
186
|
formatDateForDisplay(t) {
|
|
187
|
-
const e =
|
|
187
|
+
const e = y(t);
|
|
188
188
|
return isNaN(e.getTime()) ? t : new Intl.DateTimeFormat(this.localeId ?? "en", {
|
|
189
189
|
year: "numeric",
|
|
190
190
|
month: "2-digit",
|
|
@@ -193,7 +193,7 @@ let o = class extends v {
|
|
|
193
193
|
}
|
|
194
194
|
getSortedPills() {
|
|
195
195
|
return !this.value || !Array.isArray(this.value) ? [] : [...this.value].sort(
|
|
196
|
-
(t, e) =>
|
|
196
|
+
(t, e) => y(t.start).getTime() - y(e.start).getTime()
|
|
197
197
|
);
|
|
198
198
|
}
|
|
199
199
|
onPillClick(t) {
|
|
@@ -258,8 +258,8 @@ let o = class extends v {
|
|
|
258
258
|
if (e !== u) {
|
|
259
259
|
const p = this.getGroupInputs(u);
|
|
260
260
|
if (p.length > 0) {
|
|
261
|
-
const
|
|
262
|
-
|
|
261
|
+
const m = p[p.length - 1];
|
|
262
|
+
m.focus(), m.select();
|
|
263
263
|
}
|
|
264
264
|
}
|
|
265
265
|
}
|
|
@@ -322,8 +322,8 @@ let o = class extends v {
|
|
|
322
322
|
if (!t || !e) return;
|
|
323
323
|
let s = t, a = e;
|
|
324
324
|
e.getTime() < t.getTime() && (s = e, a = t);
|
|
325
|
-
const r =
|
|
326
|
-
n.push(l), this.value =
|
|
325
|
+
const r = f(s), i = f(a), l = r === i ? { start: r } : { start: r, end: i }, n = this.value ? [...this.value] : [];
|
|
326
|
+
n.push(l), this.value = S(n), this._startDate = { day: "", month: "", year: "" }, this._endDate = { day: "", month: "", year: "" }, this.dispatchEvent(
|
|
327
327
|
new CustomEvent("change", {
|
|
328
328
|
detail: { value: this.value },
|
|
329
329
|
bubbles: !0,
|
|
@@ -384,12 +384,12 @@ d([
|
|
|
384
384
|
h({ type: String })
|
|
385
385
|
], o.prototype, "separator", 2);
|
|
386
386
|
d([
|
|
387
|
-
|
|
387
|
+
v()
|
|
388
388
|
], o.prototype, "_startDate", 2);
|
|
389
389
|
d([
|
|
390
|
-
|
|
390
|
+
v()
|
|
391
391
|
], o.prototype, "_endDate", 2);
|
|
392
392
|
o = d([
|
|
393
|
-
|
|
393
|
+
_("gui-range-date")
|
|
394
394
|
], o);
|
|
395
395
|
typeof customElements < "u" && !customElements.get("gui-range-date") && customElements.define("gui-range-date", o);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { InputWidgetAdapter as n, formContext as o, inputContext as u } from "@golemui/lit";
|
|
2
|
-
import "./range-date-input-
|
|
2
|
+
import "./range-date-input-BYXzqnr1.js";
|
|
3
3
|
import { consume as h, provide as m } from "@lit/context";
|
|
4
4
|
import { LitElement as c, html as b } from "lit";
|
|
5
5
|
import { property as D, customElement as g } from "lit/decorators.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { InputWidgetAdapter as c, formContext as u, inputContext as m } from "@golemui/lit";
|
|
2
2
|
import { a as g, b as D, c as C } from "./templates-Dk1jxLwS.js";
|
|
3
|
-
import "./range-calendar-
|
|
4
|
-
import "./range-date-input-
|
|
3
|
+
import "./range-calendar-CBINu84w.js";
|
|
4
|
+
import "./range-date-input-BYXzqnr1.js";
|
|
5
5
|
import { consume as $, provide as f } from "@lit/context";
|
|
6
6
|
import { LitElement as v, html as d, nothing as b } from "lit";
|
|
7
7
|
import { property as w, query as p, state as h, customElement as y } from "lit/decorators.js";
|