bank20baht-ui 0.5.4 → 0.5.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/{baht-workflow-DXR5kjJz.js → baht-workflow-Jo9JmAdE.js} +937 -929
- package/dist/chunks/{display-CX-bz0Da.js → display-Cm3Pmp9U.js} +210 -189
- package/dist/components/primitives/baht-datepicker.d.ts +6 -1
- package/dist/core/dates.d.ts +6 -0
- package/dist/core/index.d.ts +1 -1
- package/dist/core/types.d.ts +12 -1
- package/dist/custom-elements.json +26 -1
- package/dist/engine.js +29 -27
- package/dist/index.js +92 -90
- package/dist/ssr.js +1 -1
- package/dist/tokens.css +21 -0
- package/dist/web-types.json +1 -1
- package/package.json +1 -1
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { nothing as h, html as l, svg as R } from "lit";
|
|
2
|
-
import { property as n, customElement as f, state as v, query as
|
|
3
|
-
import { B as y, b as ce, h as
|
|
2
|
+
import { property as n, customElement as f, state as v, query as Bt } from "lit/decorators.js";
|
|
3
|
+
import { B as y, b as ce, h as j, a as X } from "./base-D1pT3J5T.js";
|
|
4
4
|
import { t as u } from "./i18n-CWv5lrun.js";
|
|
5
|
-
import {
|
|
5
|
+
import { k as Re, j as ae, u as ye, n as qt, x as ws, o as xs, p as _s, d as ie, a as ps, s as ze, v as Ve, l as ge, t as we, c as ks, M as Ke, e as Os, h as Ps, q as Cs } from "./display-Cm3Pmp9U.js";
|
|
6
6
|
import { repeat as Fe } from "lit/directives/repeat.js";
|
|
7
|
-
import { html as
|
|
8
|
-
import { r as
|
|
7
|
+
import { html as se, unsafeStatic as ds } from "lit/static-html.js";
|
|
8
|
+
import { r as T, e as Ds, i as us, d as pe, c as bs } from "./baht-toast-8qUXxEvh.js";
|
|
9
9
|
import { live as Z } from "lit/directives/live.js";
|
|
10
10
|
import { ifDefined as L } from "lit/directives/if-defined.js";
|
|
11
|
-
import
|
|
12
|
-
var
|
|
13
|
-
for (var
|
|
14
|
-
(o = t[r]) && (
|
|
15
|
-
return i &&
|
|
11
|
+
import Ss from "flatpickr";
|
|
12
|
+
var Fs = Object.defineProperty, Ms = Object.getOwnPropertyDescriptor, de = (t, e, s, i) => {
|
|
13
|
+
for (var a = i > 1 ? void 0 : i ? Ms(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
14
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
15
|
+
return i && a && Fs(e, s, a), a;
|
|
16
16
|
};
|
|
17
|
-
let
|
|
17
|
+
let Vt = class extends y {
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments), this.tone = "neutral", this.label = "", this.dot = null;
|
|
20
20
|
}
|
|
@@ -30,20 +30,20 @@ let Kt = class extends y {
|
|
|
30
30
|
};
|
|
31
31
|
de([
|
|
32
32
|
n()
|
|
33
|
-
],
|
|
33
|
+
], Vt.prototype, "tone", 2);
|
|
34
34
|
de([
|
|
35
35
|
n()
|
|
36
|
-
],
|
|
36
|
+
], Vt.prototype, "label", 2);
|
|
37
37
|
de([
|
|
38
38
|
n({ attribute: !1 })
|
|
39
|
-
],
|
|
40
|
-
|
|
39
|
+
], Vt.prototype, "dot", 2);
|
|
40
|
+
Vt = de([
|
|
41
41
|
f("baht-badge")
|
|
42
|
-
],
|
|
43
|
-
var
|
|
44
|
-
for (var
|
|
45
|
-
(o = t[r]) && (
|
|
46
|
-
return i &&
|
|
42
|
+
], Vt);
|
|
43
|
+
var Is = Object.defineProperty, Bs = Object.getOwnPropertyDescriptor, Ee = (t, e, s, i) => {
|
|
44
|
+
for (var a = i > 1 ? void 0 : i ? Bs(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
45
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
46
|
+
return i && a && Is(e, s, a), a;
|
|
47
47
|
};
|
|
48
48
|
let re = class extends y {
|
|
49
49
|
constructor() {
|
|
@@ -66,10 +66,10 @@ Ee([
|
|
|
66
66
|
re = Ee([
|
|
67
67
|
f("baht-code")
|
|
68
68
|
], re);
|
|
69
|
-
var
|
|
70
|
-
for (var
|
|
71
|
-
(o = t[r]) && (
|
|
72
|
-
return i &&
|
|
69
|
+
var Ts = Object.defineProperty, js = Object.getOwnPropertyDescriptor, gt = (t, e, s, i) => {
|
|
70
|
+
for (var a = i > 1 ? void 0 : i ? js(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
71
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
72
|
+
return i && a && Ts(e, s, a), a;
|
|
73
73
|
};
|
|
74
74
|
let ht = class extends y {
|
|
75
75
|
constructor() {
|
|
@@ -84,12 +84,12 @@ let ht = class extends y {
|
|
|
84
84
|
}
|
|
85
85
|
/** Visible page numbers with `null` marking an ellipsis gap. */
|
|
86
86
|
get pageItems() {
|
|
87
|
-
const { page: t, totalPages: e, siblings:
|
|
88
|
-
for (let c = t -
|
|
87
|
+
const { page: t, totalPages: e, siblings: s } = this, i = /* @__PURE__ */ new Set([1, e]);
|
|
88
|
+
for (let c = t - s; c <= t + s; c++)
|
|
89
89
|
c >= 1 && c <= e && i.add(c);
|
|
90
|
-
const
|
|
90
|
+
const a = [...i].sort((c, m) => c - m), r = [];
|
|
91
91
|
let o = 0;
|
|
92
|
-
for (const c of
|
|
92
|
+
for (const c of a)
|
|
93
93
|
o && c - o === 2 ? r.push(o + 1) : o && c - o > 2 && r.push(null), r.push(c), o = c;
|
|
94
94
|
return r;
|
|
95
95
|
}
|
|
@@ -103,12 +103,12 @@ let ht = class extends y {
|
|
|
103
103
|
return l`<nav class="baht-pagination" aria-label="Pagination">
|
|
104
104
|
<button type="button" aria-label="Previous page" ?disabled=${t} @click=${() => this.go(this.page - 1)}><span aria-hidden="true">«</span></button>
|
|
105
105
|
${this.variant === "compact" ? l`<span class="baht-pagination-label">Page ${this.page} of ${this.totalPages}</span>` : this.pageItems.map(
|
|
106
|
-
(
|
|
106
|
+
(s) => s === null ? l`<span class="baht-pagination-ellipsis" aria-hidden="true">…</span>` : l`<button
|
|
107
107
|
type="button"
|
|
108
|
-
aria-current=${
|
|
109
|
-
aria-label="Page ${
|
|
110
|
-
@click=${() => this.go(
|
|
111
|
-
>${
|
|
108
|
+
aria-current=${s === this.page ? "page" : h}
|
|
109
|
+
aria-label="Page ${s}"
|
|
110
|
+
@click=${() => this.go(s)}
|
|
111
|
+
>${s}</button>`
|
|
112
112
|
)}
|
|
113
113
|
<button type="button" aria-label="Next page" ?disabled=${e} @click=${() => this.go(this.page + 1)}><span aria-hidden="true">»</span></button>
|
|
114
114
|
</nav>`;
|
|
@@ -135,12 +135,12 @@ gt([
|
|
|
135
135
|
ht = gt([
|
|
136
136
|
f("baht-pagination")
|
|
137
137
|
], ht);
|
|
138
|
-
var
|
|
139
|
-
for (var
|
|
140
|
-
(o = t[r]) && (
|
|
141
|
-
return i &&
|
|
138
|
+
var As = Object.defineProperty, Es = Object.getOwnPropertyDescriptor, O = (t, e, s, i) => {
|
|
139
|
+
for (var a = i > 1 ? void 0 : i ? Es(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
140
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
141
|
+
return i && a && As(e, s, a), a;
|
|
142
142
|
};
|
|
143
|
-
const
|
|
143
|
+
const Ls = " › ", xe = (t) => t !== null && typeof t == "object" && !Array.isArray(t) && !(t instanceof Date), ee = (t) => t.replace(/_/g, " ").replace(/\b\w/g, (e) => e.toUpperCase());
|
|
144
144
|
let x = class extends y {
|
|
145
145
|
constructor() {
|
|
146
146
|
super(...arguments), this.items = [], this.columns = {}, this.loading = !1, this.error = !1, this.errorMessage = "Couldn't load data. Try again.", this.emptyMessage = "No records yet.", this.showIndex = !0, this.indexOffset = 0, this.skeletonRows = 10, this.rowKey = "", this.clickable = !0, this.renderers = {}, this.visibleColumns = [], this.columnPicker = !0, this.selectable = !1, this.selected = [], this.sortable = !1, this.sort = null, this.rowActions = !1, this.page = 1, this.totalPages = 1, this.cursorMode = !1, this.hasNext = !1, this.hasPrev = !1, this.pickerOpen = !1, this.pickedColumns = null, this.draftColumns = [], this.pickAvail = [], this.pickSel = [], this.expanded = [], this.pickerPreviousFocus = null, this.onPickerKeydown = (t) => {
|
|
@@ -162,11 +162,11 @@ let x = class extends y {
|
|
|
162
162
|
trapPickerFocus(t) {
|
|
163
163
|
const e = this.pickerFocusables();
|
|
164
164
|
if (e.length === 0) return;
|
|
165
|
-
const
|
|
166
|
-
r != null && r.contains(
|
|
165
|
+
const s = e[0], i = e[e.length - 1], a = document.activeElement, r = this.querySelector(".baht-table-picker-modal");
|
|
166
|
+
r != null && r.contains(a) ? t.shiftKey && a === s ? (i.focus(), t.preventDefault()) : !t.shiftKey && a === i && (s.focus(), t.preventDefault()) : (s.focus(), t.preventDefault());
|
|
167
167
|
}
|
|
168
168
|
disconnectedCallback() {
|
|
169
|
-
super.disconnectedCallback(),
|
|
169
|
+
super.disconnectedCallback(), j() && document.removeEventListener("keydown", this.onPickerKeydown);
|
|
170
170
|
}
|
|
171
171
|
willUpdate(t) {
|
|
172
172
|
t.has("visibleColumns") && !t.has("columns") && (this.pickedColumns = null);
|
|
@@ -178,23 +178,23 @@ let x = class extends y {
|
|
|
178
178
|
const t = this.items[0];
|
|
179
179
|
if (!t) return {};
|
|
180
180
|
const e = {};
|
|
181
|
-
for (const [
|
|
182
|
-
e[
|
|
183
|
-
label:
|
|
184
|
-
fields: Object.fromEntries(Object.keys(i).map((
|
|
185
|
-
} :
|
|
181
|
+
for (const [s, i] of Object.entries(t))
|
|
182
|
+
e[s] = xe(i) ? {
|
|
183
|
+
label: ee(s),
|
|
184
|
+
fields: Object.fromEntries(Object.keys(i).map((a) => [a, ee(a)]))
|
|
185
|
+
} : ee(s);
|
|
186
186
|
return e;
|
|
187
187
|
}
|
|
188
188
|
/** Walk a dotted key through the spec; undefined when no such column exists. */
|
|
189
189
|
specAt(t) {
|
|
190
|
-
let e = this.spec,
|
|
190
|
+
let e = this.spec, s;
|
|
191
191
|
for (const i of t.split(".")) {
|
|
192
|
-
const
|
|
193
|
-
if (
|
|
194
|
-
const r = typeof
|
|
195
|
-
|
|
192
|
+
const a = e == null ? void 0 : e[i];
|
|
193
|
+
if (a === void 0) return;
|
|
194
|
+
const r = typeof a == "string" ? { label: a } : a;
|
|
195
|
+
s = r, e = r.fields;
|
|
196
196
|
}
|
|
197
|
-
return
|
|
197
|
+
return s;
|
|
198
198
|
}
|
|
199
199
|
isReference(t) {
|
|
200
200
|
var e;
|
|
@@ -202,11 +202,11 @@ let x = class extends y {
|
|
|
202
202
|
}
|
|
203
203
|
childrenOf(t) {
|
|
204
204
|
var e;
|
|
205
|
-
return Object.keys(((e = this.specAt(t)) == null ? void 0 : e.fields) ?? {}).map((
|
|
205
|
+
return Object.keys(((e = this.specAt(t)) == null ? void 0 : e.fields) ?? {}).map((s) => `${t}.${s}`);
|
|
206
206
|
}
|
|
207
207
|
/** Every pickable key, reference fields included (`requester`, `requester.name`, ...). */
|
|
208
208
|
allPaths(t = "") {
|
|
209
|
-
return (t ? this.childrenOf(t) : this.allColumnKeys).flatMap((
|
|
209
|
+
return (t ? this.childrenOf(t) : this.allColumnKeys).flatMap((s) => this.isReference(s) ? [s, ...this.allPaths(s)] : [s]);
|
|
210
210
|
}
|
|
211
211
|
get allColumnKeys() {
|
|
212
212
|
return Object.keys(this.spec);
|
|
@@ -217,29 +217,29 @@ let x = class extends y {
|
|
|
217
217
|
/** "Requested by › Department" for a dotted key; the plain label otherwise. */
|
|
218
218
|
labelFor(t) {
|
|
219
219
|
const e = [];
|
|
220
|
-
let
|
|
220
|
+
let s = this.spec;
|
|
221
221
|
for (const i of t.split(".")) {
|
|
222
|
-
const
|
|
223
|
-
if (
|
|
224
|
-
e.push(
|
|
222
|
+
const a = s == null ? void 0 : s[i];
|
|
223
|
+
if (a === void 0) {
|
|
224
|
+
e.push(ee(i)), s = void 0;
|
|
225
225
|
continue;
|
|
226
226
|
}
|
|
227
|
-
e.push(typeof
|
|
227
|
+
e.push(typeof a == "string" ? a : a.label), s = typeof a == "string" ? void 0 : a.fields;
|
|
228
228
|
}
|
|
229
|
-
return e.join(
|
|
229
|
+
return e.join(Ls);
|
|
230
230
|
}
|
|
231
231
|
/** The row's value at a dotted key (`requester.department`). */
|
|
232
232
|
static valueAt(t, e) {
|
|
233
|
-
let
|
|
233
|
+
let s = t;
|
|
234
234
|
for (const i of e.split(".")) {
|
|
235
|
-
if (!xe(
|
|
236
|
-
|
|
235
|
+
if (!xe(s)) return;
|
|
236
|
+
s = s[i];
|
|
237
237
|
}
|
|
238
|
-
return
|
|
238
|
+
return s;
|
|
239
239
|
}
|
|
240
240
|
// ---- picker -----------------------------------------------------------
|
|
241
241
|
openPicker() {
|
|
242
|
-
this.draftColumns = this.columnKeys.slice(), this.pickAvail = [], this.pickSel = [], this.pickerOpen = !0, this.pickerPreviousFocus = document.activeElement,
|
|
242
|
+
this.draftColumns = this.columnKeys.slice(), this.pickAvail = [], this.pickSel = [], this.pickerOpen = !0, this.pickerPreviousFocus = document.activeElement, j() && document.addEventListener("keydown", this.onPickerKeydown), this.updateComplete.then(() => {
|
|
243
243
|
var t;
|
|
244
244
|
this.pickerOpen && ((t = this.pickerFocusables()[0]) == null || t.focus());
|
|
245
245
|
});
|
|
@@ -247,7 +247,7 @@ let x = class extends y {
|
|
|
247
247
|
closePicker() {
|
|
248
248
|
var e;
|
|
249
249
|
if (!this.pickerOpen) return;
|
|
250
|
-
this.pickerOpen = !1,
|
|
250
|
+
this.pickerOpen = !1, j() && document.removeEventListener("keydown", this.onPickerKeydown);
|
|
251
251
|
const t = this.pickerPreviousFocus;
|
|
252
252
|
this.pickerPreviousFocus = null, t != null && t.isConnected && ((e = t.focus) == null || e.call(t));
|
|
253
253
|
}
|
|
@@ -270,10 +270,10 @@ let x = class extends y {
|
|
|
270
270
|
this.draftColumns = this.draftColumns.filter((t) => !this.pickSel.includes(t)), this.pickSel = [];
|
|
271
271
|
}
|
|
272
272
|
moveSelected(t) {
|
|
273
|
-
const e = [...this.draftColumns],
|
|
274
|
-
for (const i of
|
|
275
|
-
const
|
|
276
|
-
|
|
273
|
+
const e = [...this.draftColumns], s = this.pickSel.map((i) => e.indexOf(i)).filter((i) => i >= 0).sort((i, a) => t === -1 ? i - a : a - i);
|
|
274
|
+
for (const i of s) {
|
|
275
|
+
const a = i + t;
|
|
276
|
+
a < 0 || a >= e.length || ([e[i], e[a]] = [e[a], e[i]]);
|
|
277
277
|
}
|
|
278
278
|
this.draftColumns = e;
|
|
279
279
|
}
|
|
@@ -300,11 +300,11 @@ let x = class extends y {
|
|
|
300
300
|
return this.selected.includes(this.keyOf(t, e));
|
|
301
301
|
}
|
|
302
302
|
emitSelection(t) {
|
|
303
|
-
const e = this.items.filter((
|
|
303
|
+
const e = this.items.filter((s, i) => t.includes(this.keyOf(s, i)));
|
|
304
304
|
this.emit("baht-selection-change", { selected: t, rows: e });
|
|
305
305
|
}
|
|
306
306
|
toggleRow(t, e) {
|
|
307
|
-
const
|
|
307
|
+
const s = this.keyOf(t, e), i = this.isSelected(t, e) ? this.selected.filter((a) => a !== s) : [...this.selected, s];
|
|
308
308
|
this.emitSelection(i);
|
|
309
309
|
}
|
|
310
310
|
get pageKeys() {
|
|
@@ -332,8 +332,8 @@ let x = class extends y {
|
|
|
332
332
|
return this.sortable || ((e = this.specAt(t)) == null ? void 0 : e.sortable) === !0;
|
|
333
333
|
}
|
|
334
334
|
requestSort(t) {
|
|
335
|
-
var
|
|
336
|
-
const e = ((
|
|
335
|
+
var s;
|
|
336
|
+
const e = ((s = this.sort) == null ? void 0 : s.key) === t && this.sort.direction === "asc" ? "desc" : "asc";
|
|
337
337
|
this.emit("baht-sort-change", { key: t, direction: e });
|
|
338
338
|
}
|
|
339
339
|
/** Alignment class for a column (explicit `align` beats `numeric`). */
|
|
@@ -342,11 +342,11 @@ let x = class extends y {
|
|
|
342
342
|
return e != null && e.align ? ` baht-table-align-${e.align}` : e != null && e.numeric ? " baht-table-numeric" : "";
|
|
343
343
|
}
|
|
344
344
|
cell(t, e) {
|
|
345
|
-
const
|
|
346
|
-
if (
|
|
345
|
+
const s = this.renderers[e], i = x.valueAt(t, e);
|
|
346
|
+
if (s) return s(i, t);
|
|
347
347
|
if (xe(i)) {
|
|
348
|
-
const
|
|
349
|
-
return
|
|
348
|
+
const a = i.name ?? i.label ?? i.title ?? i.id;
|
|
349
|
+
return a == null ? "" : String(a);
|
|
350
350
|
}
|
|
351
351
|
return i == null ? "" : String(i);
|
|
352
352
|
}
|
|
@@ -354,36 +354,36 @@ let x = class extends y {
|
|
|
354
354
|
const e = t.length + (this.showIndex ? 1 : 0) + (this.selectable ? 1 : 0) + (this.rowActions ? 1 : 0);
|
|
355
355
|
return this.loading ? l`${Array.from(
|
|
356
356
|
{ length: this.skeletonRows },
|
|
357
|
-
(
|
|
357
|
+
(s, i) => l`<tr class="baht-table-row">
|
|
358
358
|
${this.selectable ? l`<td class="baht-table-select"></td>` : h}
|
|
359
359
|
${this.showIndex ? l`<td class="baht-table-index">${this.indexOffset + i + 1}</td>` : h}
|
|
360
360
|
${t.map(() => l`<td><span class="baht-skeleton" style="height:16px;"></span></td>`)}
|
|
361
361
|
${this.rowActions ? l`<td class="baht-table-actions"></td>` : h}
|
|
362
362
|
</tr>`
|
|
363
|
-
)}` : this.error ? l`<tr><td colspan=${e}><div class="baht-table-state baht-table-state--error" role="alert">${this.errorMessage}</div></td></tr>` : this.items.length === 0 ? l`<tr><td colspan=${e}><div class="baht-table-state">${this.emptyMessage}</div></td></tr>` : l`${this.items.map((
|
|
364
|
-
const
|
|
363
|
+
)}` : this.error ? l`<tr><td colspan=${e}><div class="baht-table-state baht-table-state--error" role="alert">${this.errorMessage}</div></td></tr>` : this.items.length === 0 ? l`<tr><td colspan=${e}><div class="baht-table-state">${this.emptyMessage}</div></td></tr>` : l`${this.items.map((s, i) => {
|
|
364
|
+
const a = this.selectable && this.isSelected(s, i);
|
|
365
365
|
return l`<tr
|
|
366
|
-
class="baht-table-row${
|
|
367
|
-
aria-selected=${this.selectable ?
|
|
366
|
+
class="baht-table-row${a ? " baht-table-row--selected" : ""}"
|
|
367
|
+
aria-selected=${this.selectable ? a ? "true" : "false" : h}
|
|
368
368
|
tabindex=${this.clickable ? "0" : h}
|
|
369
|
-
@click=${() => this.emitRow(
|
|
369
|
+
@click=${() => this.emitRow(s, i)}
|
|
370
370
|
@keydown=${(r) => {
|
|
371
|
-
r.key !== "Enter" && r.key !== " " || r.target === r.currentTarget && (r.preventDefault(), this.emitRow(
|
|
371
|
+
r.key !== "Enter" && r.key !== " " || r.target === r.currentTarget && (r.preventDefault(), this.emitRow(s, i));
|
|
372
372
|
}}
|
|
373
373
|
>
|
|
374
374
|
${this.selectable ? l`<td class="baht-table-select">
|
|
375
375
|
<input
|
|
376
376
|
type="checkbox"
|
|
377
377
|
aria-label=${u("selectRow", { n: this.indexOffset + i + 1 })}
|
|
378
|
-
.checked=${
|
|
378
|
+
.checked=${a}
|
|
379
379
|
@click=${(r) => {
|
|
380
|
-
r.stopPropagation(), this.toggleRow(
|
|
380
|
+
r.stopPropagation(), this.toggleRow(s, i);
|
|
381
381
|
}}
|
|
382
382
|
/>
|
|
383
383
|
</td>` : h}
|
|
384
384
|
${this.showIndex ? l`<td class="baht-table-index">${this.indexOffset + i + 1}</td>` : h}
|
|
385
385
|
${t.map(
|
|
386
|
-
(r) => l`<td data-col=${r} class="baht-table-cell${this.alignClass(r)}">${this.cell(
|
|
386
|
+
(r) => l`<td data-col=${r} class="baht-table-cell${this.alignClass(r)}">${this.cell(s, r)}</td>`
|
|
387
387
|
)}
|
|
388
388
|
${this.rowActions ? l`<td class="baht-table-actions">
|
|
389
389
|
<button
|
|
@@ -391,27 +391,27 @@ let x = class extends y {
|
|
|
391
391
|
class="baht-table-actions-btn baht-button baht-button--ghost baht-button--icon baht-button--sm"
|
|
392
392
|
aria-label=${u("rowActions")}
|
|
393
393
|
@click=${(r) => {
|
|
394
|
-
r.stopPropagation(), this.emit("baht-row-actions", { row:
|
|
394
|
+
r.stopPropagation(), this.emit("baht-row-actions", { row: s, index: i, id: this.idOf(s) });
|
|
395
395
|
}}
|
|
396
|
-
>${
|
|
396
|
+
>${T("more")}</button>
|
|
397
397
|
</td>` : h}
|
|
398
398
|
</tr>`;
|
|
399
399
|
})}`;
|
|
400
400
|
}
|
|
401
401
|
renderHeaderCell(t) {
|
|
402
402
|
var o;
|
|
403
|
-
const e = this.labelFor(t),
|
|
403
|
+
const e = this.labelFor(t), s = ((o = this.sort) == null ? void 0 : o.key) === t ? this.sort.direction : null, i = s === "asc" ? "ascending" : s === "desc" ? "descending" : h, a = `baht-table-cell${this.alignClass(t)}`;
|
|
404
404
|
if (!this.isSortable(t))
|
|
405
|
-
return l`<th scope="col" data-col=${t} class=${
|
|
406
|
-
const r =
|
|
407
|
-
return l`<th scope="col" data-col=${t} class=${
|
|
405
|
+
return l`<th scope="col" data-col=${t} class=${a}>${e}</th>`;
|
|
406
|
+
const r = s === "asc" ? "chevron-up" : s === "desc" ? "chevron-down" : "sort";
|
|
407
|
+
return l`<th scope="col" data-col=${t} class=${a} aria-sort=${i}>
|
|
408
408
|
<button
|
|
409
409
|
type="button"
|
|
410
|
-
class="baht-table-sort${
|
|
410
|
+
class="baht-table-sort${s ? " baht-table-sort--active" : ""}"
|
|
411
411
|
aria-label=${u("sortBy", { label: e })}
|
|
412
412
|
@click=${() => this.requestSort(t)}
|
|
413
413
|
>
|
|
414
|
-
<span>${e}</span>${
|
|
414
|
+
<span>${e}</span>${T(r)}
|
|
415
415
|
</button>
|
|
416
416
|
</th>`;
|
|
417
417
|
}
|
|
@@ -437,7 +437,7 @@ let x = class extends y {
|
|
|
437
437
|
aria-haspopup="dialog"
|
|
438
438
|
aria-expanded=${this.pickerOpen ? "true" : "false"}
|
|
439
439
|
@click=${() => this.openPicker()}
|
|
440
|
-
>${
|
|
440
|
+
>${T("columns")}</button>`;
|
|
441
441
|
}
|
|
442
442
|
/**
|
|
443
443
|
* One row of the Available tree. A reference column gets an expander that
|
|
@@ -445,16 +445,16 @@ let x = class extends y {
|
|
|
445
445
|
* list works from the keyboard without the native multi-select.
|
|
446
446
|
*/
|
|
447
447
|
renderAvailRow(t, e) {
|
|
448
|
-
const
|
|
448
|
+
const s = this.specAt(t), i = (s == null ? void 0 : s.fields) !== void 0, a = this.expanded.includes(t), r = this.draftColumns.includes(t);
|
|
449
449
|
return l`<li class="baht-table-picker-node" style="--baht-picker-depth:${e}">
|
|
450
450
|
<div class="baht-table-picker-row">
|
|
451
451
|
${i ? l`<button
|
|
452
452
|
type="button"
|
|
453
453
|
class="baht-table-picker-expand"
|
|
454
|
-
aria-label=${
|
|
455
|
-
aria-expanded=${
|
|
454
|
+
aria-label=${a ? `Collapse ${s == null ? void 0 : s.label}` : `Expand ${s == null ? void 0 : s.label}`}
|
|
455
|
+
aria-expanded=${a ? "true" : "false"}
|
|
456
456
|
@click=${() => this.toggleExpanded(t)}
|
|
457
|
-
>${
|
|
457
|
+
>${T(a ? "chevron-down" : "chevron-right")}</button>` : l`<span class="baht-table-picker-expand baht-table-picker-expand--leaf"></span>`}
|
|
458
458
|
<button
|
|
459
459
|
type="button"
|
|
460
460
|
class="baht-table-picker-option"
|
|
@@ -462,15 +462,15 @@ let x = class extends y {
|
|
|
462
462
|
?disabled=${r}
|
|
463
463
|
aria-pressed=${this.pickAvail.includes(t) ? "true" : "false"}
|
|
464
464
|
@click=${() => this.toggleAvail(t)}
|
|
465
|
-
>${e === 0 ? this.labelFor(t) : (
|
|
465
|
+
>${e === 0 ? this.labelFor(t) : (s == null ? void 0 : s.label) ?? t}</button>
|
|
466
466
|
</div>
|
|
467
|
-
${i &&
|
|
467
|
+
${i && a ? l`<ul class="baht-table-picker-tree">
|
|
468
468
|
${this.childrenOf(t).map((o) => this.renderAvailRow(o, e + 1))}
|
|
469
469
|
</ul>` : h}
|
|
470
470
|
</li>`;
|
|
471
471
|
}
|
|
472
472
|
renderColumnModal() {
|
|
473
|
-
const t = this.allColumnKeys, e = this.allPaths().filter((i) => !this.draftColumns.includes(i)).length,
|
|
473
|
+
const t = this.allColumnKeys, e = this.allPaths().filter((i) => !this.draftColumns.includes(i)).length, s = (i) => (a) => i(x.selectedValues(a));
|
|
474
474
|
return l`<div
|
|
475
475
|
class="baht-table-picker-scrim"
|
|
476
476
|
@click=${(i) => i.target === i.currentTarget && this.closePicker()}
|
|
@@ -495,7 +495,7 @@ let x = class extends y {
|
|
|
495
495
|
</div>
|
|
496
496
|
<div>
|
|
497
497
|
<div class="baht-table-picker-collabel">Selected (${this.draftColumns.length})</div>
|
|
498
|
-
<select multiple size="10" class="baht-table-picker-select" aria-label="Selected columns" @change=${
|
|
498
|
+
<select multiple size="10" class="baht-table-picker-select" aria-label="Selected columns" @change=${s((i) => this.pickSel = i)}>
|
|
499
499
|
${this.draftColumns.map(
|
|
500
500
|
(i) => l`<option value=${i} ?selected=${this.pickSel.includes(i)}>${this.labelFor(i)}</option>`
|
|
501
501
|
)}
|
|
@@ -654,10 +654,10 @@ O([
|
|
|
654
654
|
x = O([
|
|
655
655
|
f("baht-table")
|
|
656
656
|
], x);
|
|
657
|
-
var
|
|
658
|
-
for (var
|
|
659
|
-
(o = t[r]) && (
|
|
660
|
-
return i &&
|
|
657
|
+
var Ns = Object.defineProperty, qs = Object.getOwnPropertyDescriptor, ut = (t, e, s, i) => {
|
|
658
|
+
for (var a = i > 1 ? void 0 : i ? qs(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
659
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
660
|
+
return i && a && Ns(e, s, a), a;
|
|
661
661
|
};
|
|
662
662
|
let ot = class extends y {
|
|
663
663
|
constructor() {
|
|
@@ -681,8 +681,8 @@ let ot = class extends y {
|
|
|
681
681
|
role="listitem"
|
|
682
682
|
tabindex=${this.clickable ? "0" : h}
|
|
683
683
|
@click=${() => this.emitItem(t, e)}
|
|
684
|
-
@keydown=${(
|
|
685
|
-
|
|
684
|
+
@keydown=${(s) => {
|
|
685
|
+
s.key !== "Enter" && s.key !== " " || (s.preventDefault(), this.emitItem(t, e));
|
|
686
686
|
}}
|
|
687
687
|
>
|
|
688
688
|
<div class="baht-list-main">
|
|
@@ -723,10 +723,10 @@ ut([
|
|
|
723
723
|
ot = ut([
|
|
724
724
|
f("baht-list")
|
|
725
725
|
], ot);
|
|
726
|
-
var
|
|
727
|
-
for (var
|
|
728
|
-
(o = t[r]) && (
|
|
729
|
-
return i &&
|
|
726
|
+
var Rs = Object.defineProperty, zs = Object.getOwnPropertyDescriptor, Wt = (t, e, s, i) => {
|
|
727
|
+
for (var a = i > 1 ? void 0 : i ? zs(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
728
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
729
|
+
return i && a && Rs(e, s, a), a;
|
|
730
730
|
};
|
|
731
731
|
let Ot = class extends y {
|
|
732
732
|
constructor() {
|
|
@@ -767,25 +767,25 @@ let Ot = class extends y {
|
|
|
767
767
|
</span>`;
|
|
768
768
|
}
|
|
769
769
|
};
|
|
770
|
-
|
|
770
|
+
Wt([
|
|
771
771
|
n()
|
|
772
772
|
], Ot.prototype, "text", 2);
|
|
773
|
-
|
|
773
|
+
Wt([
|
|
774
774
|
n()
|
|
775
775
|
], Ot.prototype, "position", 2);
|
|
776
|
-
|
|
777
|
-
|
|
776
|
+
Wt([
|
|
777
|
+
Bt(".baht-tooltip-anchor")
|
|
778
778
|
], Ot.prototype, "anchorEl", 2);
|
|
779
|
-
|
|
779
|
+
Wt([
|
|
780
780
|
v()
|
|
781
781
|
], Ot.prototype, "dismissed", 2);
|
|
782
|
-
Ot =
|
|
782
|
+
Ot = Wt([
|
|
783
783
|
f("baht-tooltip")
|
|
784
784
|
], Ot);
|
|
785
|
-
var
|
|
786
|
-
for (var
|
|
787
|
-
(o = t[r]) && (
|
|
788
|
-
return i &&
|
|
785
|
+
var Vs = Object.defineProperty, Ks = Object.getOwnPropertyDescriptor, Tt = (t, e, s, i) => {
|
|
786
|
+
for (var a = i > 1 ? void 0 : i ? Ks(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
787
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
788
|
+
return i && a && Vs(e, s, a), a;
|
|
789
789
|
};
|
|
790
790
|
let mt = class extends y {
|
|
791
791
|
constructor() {
|
|
@@ -798,12 +798,12 @@ let mt = class extends y {
|
|
|
798
798
|
this.emit("baht-dismiss");
|
|
799
799
|
const t = this.generation, e = () => {
|
|
800
800
|
t === this.generation && (this.dismissed = !0);
|
|
801
|
-
},
|
|
802
|
-
if (!
|
|
801
|
+
}, s = this.querySelector(".baht-alert");
|
|
802
|
+
if (!s) {
|
|
803
803
|
e();
|
|
804
804
|
return;
|
|
805
805
|
}
|
|
806
|
-
|
|
806
|
+
s.classList.add("baht-alert--leaving"), Ds(s, e);
|
|
807
807
|
}
|
|
808
808
|
render() {
|
|
809
809
|
return this.dismissed ? h : l`<div class="baht-alert baht-alert--${this.tone}" role="alert">
|
|
@@ -815,28 +815,28 @@ let mt = class extends y {
|
|
|
815
815
|
</div>`;
|
|
816
816
|
}
|
|
817
817
|
};
|
|
818
|
-
|
|
818
|
+
Tt([
|
|
819
819
|
n()
|
|
820
820
|
], mt.prototype, "tone", 2);
|
|
821
|
-
|
|
821
|
+
Tt([
|
|
822
822
|
n()
|
|
823
823
|
], mt.prototype, "heading", 2);
|
|
824
|
-
|
|
824
|
+
Tt([
|
|
825
825
|
n()
|
|
826
826
|
], mt.prototype, "message", 2);
|
|
827
|
-
|
|
827
|
+
Tt([
|
|
828
828
|
n({ type: Boolean })
|
|
829
829
|
], mt.prototype, "dismissible", 2);
|
|
830
|
-
|
|
830
|
+
Tt([
|
|
831
831
|
v()
|
|
832
832
|
], mt.prototype, "dismissed", 2);
|
|
833
|
-
mt =
|
|
833
|
+
mt = Tt([
|
|
834
834
|
f("baht-alert")
|
|
835
835
|
], mt);
|
|
836
|
-
var
|
|
837
|
-
for (var
|
|
838
|
-
(o = t[r]) && (
|
|
839
|
-
return i &&
|
|
836
|
+
var Us = Object.defineProperty, Hs = Object.getOwnPropertyDescriptor, jt = (t, e, s, i) => {
|
|
837
|
+
for (var a = i > 1 ? void 0 : i ? Hs(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
838
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
839
|
+
return i && a && Us(e, s, a), a;
|
|
840
840
|
};
|
|
841
841
|
let vt = class extends y {
|
|
842
842
|
constructor() {
|
|
@@ -852,13 +852,13 @@ let vt = class extends y {
|
|
|
852
852
|
onKeydown(t, e) {
|
|
853
853
|
var i;
|
|
854
854
|
if (this.readonly) return;
|
|
855
|
-
let
|
|
856
|
-
if (t.key === "ArrowRight" || t.key === "ArrowUp")
|
|
857
|
-
else if (t.key === "ArrowLeft" || t.key === "ArrowDown")
|
|
858
|
-
else if (t.key === "Home")
|
|
859
|
-
else if (t.key === "End")
|
|
855
|
+
let s;
|
|
856
|
+
if (t.key === "ArrowRight" || t.key === "ArrowUp") s = Math.min(e + 1, this.max);
|
|
857
|
+
else if (t.key === "ArrowLeft" || t.key === "ArrowDown") s = Math.max(e - 1, 1);
|
|
858
|
+
else if (t.key === "Home") s = 1;
|
|
859
|
+
else if (t.key === "End") s = this.max;
|
|
860
860
|
else return;
|
|
861
|
-
t.preventDefault(), this.emitValue(
|
|
861
|
+
t.preventDefault(), this.emitValue(s), (i = this.querySelectorAll("button")[s - 1]) == null || i.focus();
|
|
862
862
|
}
|
|
863
863
|
setHover(t) {
|
|
864
864
|
this.readonly || (this.hover = t);
|
|
@@ -871,15 +871,15 @@ let vt = class extends y {
|
|
|
871
871
|
aria-label=${this.label}
|
|
872
872
|
@mouseleave=${() => this.setHover(0)}
|
|
873
873
|
>
|
|
874
|
-
${Array.from({ length: this.max }, (e,
|
|
875
|
-
const i =
|
|
874
|
+
${Array.from({ length: this.max }, (e, s) => {
|
|
875
|
+
const i = s + 1, a = this.value || 1;
|
|
876
876
|
return l`<button
|
|
877
877
|
type="button"
|
|
878
878
|
class=${i <= t ? "baht-rating--on" : ""}
|
|
879
879
|
role="radio"
|
|
880
880
|
aria-checked=${i === this.value}
|
|
881
881
|
aria-label="${i} of ${this.max}"
|
|
882
|
-
tabindex=${i ===
|
|
882
|
+
tabindex=${i === a ? "0" : "-1"}
|
|
883
883
|
?disabled=${this.readonly}
|
|
884
884
|
@mouseenter=${() => this.setHover(i)}
|
|
885
885
|
@click=${() => this.pick(i)}
|
|
@@ -889,28 +889,28 @@ let vt = class extends y {
|
|
|
889
889
|
</div>`;
|
|
890
890
|
}
|
|
891
891
|
};
|
|
892
|
-
|
|
892
|
+
jt([
|
|
893
893
|
n({ type: Number })
|
|
894
894
|
], vt.prototype, "value", 2);
|
|
895
|
-
|
|
895
|
+
jt([
|
|
896
896
|
n({ type: Number })
|
|
897
897
|
], vt.prototype, "max", 2);
|
|
898
|
-
|
|
898
|
+
jt([
|
|
899
899
|
n({ type: Boolean })
|
|
900
900
|
], vt.prototype, "readonly", 2);
|
|
901
|
-
|
|
901
|
+
jt([
|
|
902
902
|
n()
|
|
903
903
|
], vt.prototype, "label", 2);
|
|
904
|
-
|
|
904
|
+
jt([
|
|
905
905
|
v()
|
|
906
906
|
], vt.prototype, "hover", 2);
|
|
907
|
-
vt =
|
|
907
|
+
vt = jt([
|
|
908
908
|
f("baht-rating")
|
|
909
909
|
], vt);
|
|
910
|
-
var
|
|
911
|
-
for (var
|
|
912
|
-
(o = t[r]) && (
|
|
913
|
-
return i &&
|
|
910
|
+
var Gs = Object.defineProperty, Ws = Object.getOwnPropertyDescriptor, bt = (t, e, s, i) => {
|
|
911
|
+
for (var a = i > 1 ? void 0 : i ? Ws(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
912
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
913
|
+
return i && a && Gs(e, s, a), a;
|
|
914
914
|
};
|
|
915
915
|
let lt = class extends y {
|
|
916
916
|
constructor() {
|
|
@@ -967,10 +967,10 @@ bt([
|
|
|
967
967
|
lt = bt([
|
|
968
968
|
f("baht-range")
|
|
969
969
|
], lt);
|
|
970
|
-
var
|
|
971
|
-
for (var
|
|
972
|
-
(o = t[r]) && (
|
|
973
|
-
return i &&
|
|
970
|
+
var Js = Object.defineProperty, Xs = Object.getOwnPropertyDescriptor, At = (t, e, s, i) => {
|
|
971
|
+
for (var a = i > 1 ? void 0 : i ? Xs(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
972
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
973
|
+
return i && a && Js(e, s, a), a;
|
|
974
974
|
};
|
|
975
975
|
let $t = class extends y {
|
|
976
976
|
constructor() {
|
|
@@ -985,46 +985,46 @@ let $t = class extends y {
|
|
|
985
985
|
willUpdate(t) {
|
|
986
986
|
super.willUpdate(t);
|
|
987
987
|
const e = t.has("value") && this.value !== this._lastValue;
|
|
988
|
-
!this.hasUpdated || e ? (this._chars = Array.from({ length: this.length }, (
|
|
988
|
+
!this.hasUpdated || e ? (this._chars = Array.from({ length: this.length }, (s, i) => this.value[i] ?? ""), this._lastValue = this.value, this._wasFull = this._chars.length > 0 && this._chars.every((s) => s !== "")) : this._chars.length !== this.length && (this._chars = Array.from({ length: this.length }, (s, i) => this._chars[i] ?? ""));
|
|
989
989
|
}
|
|
990
990
|
/** Writes `text` into `_chars` starting at `start`. Returns the index just
|
|
991
991
|
* past the last box written (may equal `this.length`). */
|
|
992
992
|
fill(t, e) {
|
|
993
|
-
let
|
|
993
|
+
let s = t;
|
|
994
994
|
for (const i of e) {
|
|
995
|
-
if (
|
|
996
|
-
this._chars[
|
|
995
|
+
if (s >= this.length) break;
|
|
996
|
+
this._chars[s] = i, s += 1;
|
|
997
997
|
}
|
|
998
|
-
return
|
|
998
|
+
return s;
|
|
999
999
|
}
|
|
1000
1000
|
commit() {
|
|
1001
1001
|
const t = this._chars.join("").slice(0, this.length);
|
|
1002
1002
|
this.value = t, this._lastValue = t, this.requestUpdate(), this.emit("baht-change", { value: this.value });
|
|
1003
|
-
const e = this._chars.length > 0 && this._chars.every((
|
|
1003
|
+
const e = this._chars.length > 0 && this._chars.every((s) => s !== "");
|
|
1004
1004
|
e && !this._wasFull && this.emit("baht-otp-complete", { value: this.value }), this._wasFull = e;
|
|
1005
1005
|
}
|
|
1006
1006
|
onInput(t, e) {
|
|
1007
1007
|
var r, o;
|
|
1008
|
-
const
|
|
1008
|
+
const s = e.target, i = this.clean(s.value);
|
|
1009
1009
|
if (i.length > 1) {
|
|
1010
1010
|
const c = this.fill(t, i);
|
|
1011
|
-
|
|
1011
|
+
s.value = this._chars[t] ?? "", this.commit(), (r = this.inputs()[Math.min(c, this.length - 1)]) == null || r.focus();
|
|
1012
1012
|
return;
|
|
1013
1013
|
}
|
|
1014
|
-
const
|
|
1015
|
-
|
|
1014
|
+
const a = i.slice(-1);
|
|
1015
|
+
s.value = a, this._chars[t] = a, this.commit(), a && t < this.length - 1 && ((o = this.inputs()[t + 1]) == null || o.focus());
|
|
1016
1016
|
}
|
|
1017
1017
|
onKeydown(t, e) {
|
|
1018
|
-
var
|
|
1019
|
-
e.key === "Backspace" && !this._chars[t] && t > 0 && (this._chars[t - 1] = "", this.commit(), (
|
|
1018
|
+
var s;
|
|
1019
|
+
e.key === "Backspace" && !this._chars[t] && t > 0 && (this._chars[t - 1] = "", this.commit(), (s = this.inputs()[t - 1]) == null || s.focus(), e.preventDefault());
|
|
1020
1020
|
}
|
|
1021
1021
|
onPaste(t) {
|
|
1022
|
-
var i,
|
|
1022
|
+
var i, a;
|
|
1023
1023
|
t.preventDefault();
|
|
1024
1024
|
const e = this.clean(((i = t.clipboardData) == null ? void 0 : i.getData("text")) ?? "").slice(0, this.length);
|
|
1025
1025
|
if (!e) return;
|
|
1026
|
-
const
|
|
1027
|
-
this.commit(), (
|
|
1026
|
+
const s = this.fill(0, e);
|
|
1027
|
+
this.commit(), (a = this.inputs()[Math.min(s, this.length - 1)]) == null || a.focus();
|
|
1028
1028
|
}
|
|
1029
1029
|
render() {
|
|
1030
1030
|
return l`<div class="baht-otp" role="group" aria-label=${this.label} @paste=${(t) => this.onPaste(t)}>
|
|
@@ -1037,8 +1037,8 @@ let $t = class extends y {
|
|
|
1037
1037
|
aria-label=${u("otpCharacter", { i: e + 1, n: this.length })}
|
|
1038
1038
|
.value=${t}
|
|
1039
1039
|
?disabled=${this.disabled}
|
|
1040
|
-
@input=${(
|
|
1041
|
-
@keydown=${(
|
|
1040
|
+
@input=${(s) => this.onInput(e, s)}
|
|
1041
|
+
@keydown=${(s) => this.onKeydown(e, s)}
|
|
1042
1042
|
/>`
|
|
1043
1043
|
)}
|
|
1044
1044
|
</div>`;
|
|
@@ -1062,10 +1062,10 @@ At([
|
|
|
1062
1062
|
$t = At([
|
|
1063
1063
|
f("baht-otp")
|
|
1064
1064
|
], $t);
|
|
1065
|
-
var
|
|
1066
|
-
for (var
|
|
1067
|
-
(o = t[r]) && (
|
|
1068
|
-
return i &&
|
|
1065
|
+
var Ys = Object.defineProperty, Zs = Object.getOwnPropertyDescriptor, Et = (t, e, s, i) => {
|
|
1066
|
+
for (var a = i > 1 ? void 0 : i ? Zs(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1067
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1068
|
+
return i && a && Ys(e, s, a), a;
|
|
1069
1069
|
};
|
|
1070
1070
|
let yt = class extends y {
|
|
1071
1071
|
constructor() {
|
|
@@ -1073,8 +1073,8 @@ let yt = class extends y {
|
|
|
1073
1073
|
}
|
|
1074
1074
|
toggle(t) {
|
|
1075
1075
|
const e = this.selected.includes(t);
|
|
1076
|
-
let
|
|
1077
|
-
this.multiple ? (
|
|
1076
|
+
let s;
|
|
1077
|
+
this.multiple ? (s = e ? this.selected.filter((a) => a !== t) : [...this.selected, t], s = this.options.map((a) => a.key).filter((a) => s.includes(a))) : s = e ? [] : [t], this.emit("baht-change", { selected: s });
|
|
1078
1078
|
}
|
|
1079
1079
|
render() {
|
|
1080
1080
|
return l`<div class="baht-filter" role="group" aria-label=${this.label}>
|
|
@@ -1107,12 +1107,12 @@ Et([
|
|
|
1107
1107
|
yt = Et([
|
|
1108
1108
|
f("baht-filter")
|
|
1109
1109
|
], yt);
|
|
1110
|
-
var
|
|
1111
|
-
for (var
|
|
1112
|
-
(o = t[r]) && (
|
|
1113
|
-
return i &&
|
|
1110
|
+
var Qs = Object.defineProperty, ta = Object.getOwnPropertyDescriptor, ue = (t, e, s, i) => {
|
|
1111
|
+
for (var a = i > 1 ? void 0 : i ? ta(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1112
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1113
|
+
return i && a && Qs(e, s, a), a;
|
|
1114
1114
|
};
|
|
1115
|
-
let
|
|
1115
|
+
let Kt = class extends y {
|
|
1116
1116
|
constructor() {
|
|
1117
1117
|
super(...arguments), this.variant = "rect", this.width = "100%", this.height = "";
|
|
1118
1118
|
}
|
|
@@ -1127,30 +1127,30 @@ let Ut = class extends y {
|
|
|
1127
1127
|
};
|
|
1128
1128
|
ue([
|
|
1129
1129
|
n()
|
|
1130
|
-
],
|
|
1130
|
+
], Kt.prototype, "variant", 2);
|
|
1131
1131
|
ue([
|
|
1132
1132
|
n()
|
|
1133
|
-
],
|
|
1133
|
+
], Kt.prototype, "width", 2);
|
|
1134
1134
|
ue([
|
|
1135
1135
|
n()
|
|
1136
|
-
],
|
|
1137
|
-
|
|
1136
|
+
], Kt.prototype, "height", 2);
|
|
1137
|
+
Kt = ue([
|
|
1138
1138
|
f("baht-skeleton")
|
|
1139
|
-
],
|
|
1140
|
-
var
|
|
1141
|
-
for (var
|
|
1142
|
-
(o = t[r]) && (
|
|
1143
|
-
return i &&
|
|
1139
|
+
], Kt);
|
|
1140
|
+
var ea = Object.defineProperty, sa = Object.getOwnPropertyDescriptor, Jt = (t, e, s, i) => {
|
|
1141
|
+
for (var a = i > 1 ? void 0 : i ? sa(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1142
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1143
|
+
return i && a && ea(e, s, a), a;
|
|
1144
1144
|
};
|
|
1145
1145
|
let Pt = class extends y {
|
|
1146
1146
|
constructor() {
|
|
1147
1147
|
super(...arguments), this.value = null, this.tone = "primary", this.showLabel = !1, this.label = "Progress";
|
|
1148
1148
|
}
|
|
1149
1149
|
render() {
|
|
1150
|
-
const t = this.value == null || Number.isNaN(this.value), e = t ? 0 : Math.min(100, Math.max(0, this.value)),
|
|
1150
|
+
const t = this.value == null || Number.isNaN(this.value), e = t ? 0 : Math.min(100, Math.max(0, this.value)), s = this.tone === "primary" ? "" : ` baht-progress--${this.tone}`;
|
|
1151
1151
|
return l`<div>
|
|
1152
1152
|
<div
|
|
1153
|
-
class="baht-progress${
|
|
1153
|
+
class="baht-progress${s}${t ? " baht-progress--indeterminate" : ""}"
|
|
1154
1154
|
role="progressbar"
|
|
1155
1155
|
aria-label=${this.label}
|
|
1156
1156
|
aria-valuemin="0"
|
|
@@ -1163,25 +1163,25 @@ let Pt = class extends y {
|
|
|
1163
1163
|
</div>`;
|
|
1164
1164
|
}
|
|
1165
1165
|
};
|
|
1166
|
-
|
|
1166
|
+
Jt([
|
|
1167
1167
|
n({ type: Number })
|
|
1168
1168
|
], Pt.prototype, "value", 2);
|
|
1169
|
-
|
|
1169
|
+
Jt([
|
|
1170
1170
|
n()
|
|
1171
1171
|
], Pt.prototype, "tone", 2);
|
|
1172
|
-
|
|
1172
|
+
Jt([
|
|
1173
1173
|
n({ type: Boolean, attribute: "show-label" })
|
|
1174
1174
|
], Pt.prototype, "showLabel", 2);
|
|
1175
|
-
|
|
1175
|
+
Jt([
|
|
1176
1176
|
n()
|
|
1177
1177
|
], Pt.prototype, "label", 2);
|
|
1178
|
-
Pt =
|
|
1178
|
+
Pt = Jt([
|
|
1179
1179
|
f("baht-progress")
|
|
1180
1180
|
], Pt);
|
|
1181
|
-
var
|
|
1182
|
-
for (var
|
|
1183
|
-
(o = t[r]) && (
|
|
1184
|
-
return i &&
|
|
1181
|
+
var aa = Object.defineProperty, ia = Object.getOwnPropertyDescriptor, Le = (t, e, s, i) => {
|
|
1182
|
+
for (var a = i > 1 ? void 0 : i ? ia(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1183
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1184
|
+
return i && a && aa(e, s, a), a;
|
|
1185
1185
|
};
|
|
1186
1186
|
let oe = class extends y {
|
|
1187
1187
|
constructor() {
|
|
@@ -1201,10 +1201,10 @@ Le([
|
|
|
1201
1201
|
oe = Le([
|
|
1202
1202
|
f("baht-spinner")
|
|
1203
1203
|
], oe);
|
|
1204
|
-
var
|
|
1205
|
-
for (var
|
|
1206
|
-
(o = t[r]) && (
|
|
1207
|
-
return i &&
|
|
1204
|
+
var ra = Object.defineProperty, oa = Object.getOwnPropertyDescriptor, Xt = (t, e, s, i) => {
|
|
1205
|
+
for (var a = i > 1 ? void 0 : i ? oa(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1206
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1207
|
+
return i && a && ra(e, s, a), a;
|
|
1208
1208
|
};
|
|
1209
1209
|
let Ct = class extends y {
|
|
1210
1210
|
constructor() {
|
|
@@ -1221,25 +1221,25 @@ let Ct = class extends y {
|
|
|
1221
1221
|
</div>`;
|
|
1222
1222
|
}
|
|
1223
1223
|
};
|
|
1224
|
-
|
|
1224
|
+
Xt([
|
|
1225
1225
|
n()
|
|
1226
1226
|
], Ct.prototype, "heading", 2);
|
|
1227
|
-
|
|
1227
|
+
Xt([
|
|
1228
1228
|
n()
|
|
1229
1229
|
], Ct.prototype, "subtitle", 2);
|
|
1230
|
-
|
|
1230
|
+
Xt([
|
|
1231
1231
|
n({ type: Boolean })
|
|
1232
1232
|
], Ct.prototype, "hero", 2);
|
|
1233
|
-
|
|
1234
|
-
|
|
1233
|
+
Xt([
|
|
1234
|
+
Bt(".baht-card-body")
|
|
1235
1235
|
], Ct.prototype, "bodyEl", 2);
|
|
1236
|
-
Ct =
|
|
1236
|
+
Ct = Xt([
|
|
1237
1237
|
f("baht-card")
|
|
1238
1238
|
], Ct);
|
|
1239
|
-
var
|
|
1240
|
-
for (var
|
|
1241
|
-
(o = t[r]) && (
|
|
1242
|
-
return i &&
|
|
1239
|
+
var la = Object.defineProperty, na = Object.getOwnPropertyDescriptor, Yt = (t, e, s, i) => {
|
|
1240
|
+
for (var a = i > 1 ? void 0 : i ? na(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1241
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1242
|
+
return i && a && la(e, s, a), a;
|
|
1243
1243
|
};
|
|
1244
1244
|
let Dt = class extends y {
|
|
1245
1245
|
constructor() {
|
|
@@ -1256,25 +1256,25 @@ let Dt = class extends y {
|
|
|
1256
1256
|
</fieldset>`;
|
|
1257
1257
|
}
|
|
1258
1258
|
};
|
|
1259
|
-
|
|
1259
|
+
Yt([
|
|
1260
1260
|
n()
|
|
1261
1261
|
], Dt.prototype, "legend", 2);
|
|
1262
|
-
|
|
1262
|
+
Yt([
|
|
1263
1263
|
n()
|
|
1264
1264
|
], Dt.prototype, "help", 2);
|
|
1265
|
-
|
|
1265
|
+
Yt([
|
|
1266
1266
|
n({ type: Boolean })
|
|
1267
1267
|
], Dt.prototype, "disabled", 2);
|
|
1268
|
-
|
|
1269
|
-
|
|
1268
|
+
Yt([
|
|
1269
|
+
Bt(".baht-fieldset-body")
|
|
1270
1270
|
], Dt.prototype, "bodyEl", 2);
|
|
1271
|
-
Dt =
|
|
1271
|
+
Dt = Yt([
|
|
1272
1272
|
f("baht-fieldset")
|
|
1273
1273
|
], Dt);
|
|
1274
|
-
var
|
|
1275
|
-
for (var
|
|
1276
|
-
(o = t[r]) && (
|
|
1277
|
-
return i &&
|
|
1274
|
+
var ha = Object.defineProperty, ca = Object.getOwnPropertyDescriptor, fs = (t, e, s, i) => {
|
|
1275
|
+
for (var a = i > 1 ? void 0 : i ? ca(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1276
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1277
|
+
return i && a && ha(e, s, a), a;
|
|
1278
1278
|
};
|
|
1279
1279
|
let Me = class extends y {
|
|
1280
1280
|
constructor() {
|
|
@@ -1306,10 +1306,10 @@ fs([
|
|
|
1306
1306
|
Me = fs([
|
|
1307
1307
|
f("baht-timeline")
|
|
1308
1308
|
], Me);
|
|
1309
|
-
var
|
|
1310
|
-
for (var
|
|
1311
|
-
(o = t[r]) && (
|
|
1312
|
-
return i &&
|
|
1309
|
+
var pa = Object.defineProperty, da = Object.getOwnPropertyDescriptor, be = (t, e, s, i) => {
|
|
1310
|
+
for (var a = i > 1 ? void 0 : i ? da(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1311
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1312
|
+
return i && a && pa(e, s, a), a;
|
|
1313
1313
|
};
|
|
1314
1314
|
let St = class extends y {
|
|
1315
1315
|
constructor() {
|
|
@@ -1321,30 +1321,30 @@ let St = class extends y {
|
|
|
1321
1321
|
willUpdate(t) {
|
|
1322
1322
|
if (t.has("items")) {
|
|
1323
1323
|
const e = St.fingerprint(this.items);
|
|
1324
|
-
e !== this.itemsFingerprint && (this.itemsFingerprint = e, this.openSet = new Set(this.items.flatMap((
|
|
1324
|
+
e !== this.itemsFingerprint && (this.itemsFingerprint = e, this.openSet = new Set(this.items.flatMap((s, i) => s.open ? [i] : [])));
|
|
1325
1325
|
}
|
|
1326
1326
|
}
|
|
1327
1327
|
toggle(t) {
|
|
1328
|
-
const e = !this.openSet.has(t),
|
|
1329
|
-
e ?
|
|
1328
|
+
const e = !this.openSet.has(t), s = this.multiple ? new Set(this.openSet) : /* @__PURE__ */ new Set();
|
|
1329
|
+
e ? s.add(t) : s.delete(t), this.openSet = s, this.emit("baht-toggle", { index: t, open: e });
|
|
1330
1330
|
}
|
|
1331
1331
|
render() {
|
|
1332
1332
|
return l`<div class="baht-accordion">
|
|
1333
1333
|
${this.items.map((t, e) => {
|
|
1334
|
-
const
|
|
1335
|
-
return l`<div class="baht-accordion-item${
|
|
1334
|
+
const s = this.openSet.has(e), i = `baht-acc-${this.uid}-t-${e}`, a = `baht-acc-${this.uid}-p-${e}`;
|
|
1335
|
+
return l`<div class="baht-accordion-item${s ? " baht-accordion-item--open" : ""}">
|
|
1336
1336
|
<button
|
|
1337
1337
|
type="button"
|
|
1338
1338
|
class="baht-accordion-trigger"
|
|
1339
1339
|
id=${i}
|
|
1340
|
-
aria-expanded=${
|
|
1341
|
-
aria-controls=${
|
|
1340
|
+
aria-expanded=${s}
|
|
1341
|
+
aria-controls=${s ? a : h}
|
|
1342
1342
|
@click=${() => this.toggle(e)}
|
|
1343
1343
|
>
|
|
1344
1344
|
<span>${t.title}</span>
|
|
1345
|
-
<span class="baht-accordion-chevron" aria-hidden="true">${
|
|
1345
|
+
<span class="baht-accordion-chevron" aria-hidden="true">${T("chevron-down")}</span>
|
|
1346
1346
|
</button>
|
|
1347
|
-
${
|
|
1347
|
+
${s ? l`<div class="baht-accordion-content" id=${a} role="region" aria-labelledby=${i}>${t.content}</div>` : h}
|
|
1348
1348
|
</div>`;
|
|
1349
1349
|
})}
|
|
1350
1350
|
</div>`;
|
|
@@ -1362,10 +1362,10 @@ be([
|
|
|
1362
1362
|
St = be([
|
|
1363
1363
|
f("baht-accordion")
|
|
1364
1364
|
], St);
|
|
1365
|
-
var
|
|
1366
|
-
for (var
|
|
1367
|
-
(o = t[r]) && (
|
|
1368
|
-
return i &&
|
|
1365
|
+
var ua = Object.defineProperty, ba = Object.getOwnPropertyDescriptor, Zt = (t, e, s, i) => {
|
|
1366
|
+
for (var a = i > 1 ? void 0 : i ? ba(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1367
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1368
|
+
return i && a && ua(e, s, a), a;
|
|
1369
1369
|
};
|
|
1370
1370
|
let Ft = class extends y {
|
|
1371
1371
|
constructor() {
|
|
@@ -1380,25 +1380,25 @@ let Ft = class extends y {
|
|
|
1380
1380
|
>${this.label}${this.external ? l` <span class="baht-link-external" aria-hidden="true">↗</span><span class="baht-visually-hidden"> (${this.externalHint})</span>` : h}</a>`;
|
|
1381
1381
|
}
|
|
1382
1382
|
};
|
|
1383
|
-
|
|
1383
|
+
Zt([
|
|
1384
1384
|
n()
|
|
1385
1385
|
], Ft.prototype, "href", 2);
|
|
1386
|
-
|
|
1386
|
+
Zt([
|
|
1387
1387
|
n()
|
|
1388
1388
|
], Ft.prototype, "label", 2);
|
|
1389
|
-
|
|
1389
|
+
Zt([
|
|
1390
1390
|
n({ type: Boolean })
|
|
1391
1391
|
], Ft.prototype, "external", 2);
|
|
1392
|
-
|
|
1392
|
+
Zt([
|
|
1393
1393
|
n({ attribute: "external-hint" })
|
|
1394
1394
|
], Ft.prototype, "externalHint", 2);
|
|
1395
|
-
Ft =
|
|
1395
|
+
Ft = Zt([
|
|
1396
1396
|
f("baht-link")
|
|
1397
1397
|
], Ft);
|
|
1398
|
-
var
|
|
1399
|
-
for (var
|
|
1400
|
-
(o = t[r]) && (
|
|
1401
|
-
return i &&
|
|
1398
|
+
var fa = Object.defineProperty, ma = Object.getOwnPropertyDescriptor, Ne = (t, e, s, i) => {
|
|
1399
|
+
for (var a = i > 1 ? void 0 : i ? ma(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1400
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1401
|
+
return i && a && fa(e, s, a), a;
|
|
1402
1402
|
};
|
|
1403
1403
|
let le = class extends y {
|
|
1404
1404
|
constructor() {
|
|
@@ -1410,13 +1410,13 @@ let le = class extends y {
|
|
|
1410
1410
|
render() {
|
|
1411
1411
|
const t = this.items.length - 1;
|
|
1412
1412
|
return l`<nav class="baht-breadcrumbs" aria-label="Breadcrumb">
|
|
1413
|
-
${this.items.map((e,
|
|
1414
|
-
const i =
|
|
1415
|
-
return
|
|
1413
|
+
${this.items.map((e, s) => {
|
|
1414
|
+
const i = s < t ? l`<span class="baht-breadcrumbs-sep" aria-hidden="true">${this.separator}</span>` : h;
|
|
1415
|
+
return s === t ? l`<span class="baht-breadcrumbs-current" aria-current="page">${e.label}</span>${i}` : e.href ? l`<a class="baht-link" href=${e.href}>${e.label}</a>${i}` : l`<a
|
|
1416
1416
|
class="baht-link"
|
|
1417
1417
|
href="#"
|
|
1418
|
-
@click=${(
|
|
1419
|
-
|
|
1418
|
+
@click=${(a) => {
|
|
1419
|
+
a.preventDefault(), this.navigate(e, s);
|
|
1420
1420
|
}}
|
|
1421
1421
|
>${e.label}</a>${i}`;
|
|
1422
1422
|
})}
|
|
@@ -1432,12 +1432,12 @@ Ne([
|
|
|
1432
1432
|
le = Ne([
|
|
1433
1433
|
f("baht-breadcrumbs")
|
|
1434
1434
|
], le);
|
|
1435
|
-
var
|
|
1436
|
-
for (var
|
|
1437
|
-
(o = t[r]) && (
|
|
1438
|
-
return
|
|
1435
|
+
var va = Object.getOwnPropertyDescriptor, $a = (t, e, s, i) => {
|
|
1436
|
+
for (var a = i > 1 ? void 0 : i ? va(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1437
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1438
|
+
return a;
|
|
1439
1439
|
};
|
|
1440
|
-
let
|
|
1440
|
+
let Ue = class extends X {
|
|
1441
1441
|
renderControl() {
|
|
1442
1442
|
return l`<input
|
|
1443
1443
|
class="baht-control baht-control--text"
|
|
@@ -1456,15 +1456,15 @@ let Ke = class extends X {
|
|
|
1456
1456
|
/>`;
|
|
1457
1457
|
}
|
|
1458
1458
|
};
|
|
1459
|
-
|
|
1459
|
+
Ue = $a([
|
|
1460
1460
|
f("baht-input")
|
|
1461
|
-
],
|
|
1462
|
-
var
|
|
1463
|
-
for (var
|
|
1464
|
-
(o = t[r]) && (
|
|
1465
|
-
return
|
|
1461
|
+
], Ue);
|
|
1462
|
+
var ya = Object.getOwnPropertyDescriptor, ga = (t, e, s, i) => {
|
|
1463
|
+
for (var a = i > 1 ? void 0 : i ? ya(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1464
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1465
|
+
return a;
|
|
1466
1466
|
};
|
|
1467
|
-
let
|
|
1467
|
+
let He = class extends X {
|
|
1468
1468
|
renderControl() {
|
|
1469
1469
|
return l`<textarea
|
|
1470
1470
|
class="baht-control baht-control--textarea"
|
|
@@ -1483,15 +1483,15 @@ let Ue = class extends X {
|
|
|
1483
1483
|
></textarea>`;
|
|
1484
1484
|
}
|
|
1485
1485
|
};
|
|
1486
|
-
|
|
1486
|
+
He = ga([
|
|
1487
1487
|
f("baht-textarea")
|
|
1488
|
-
],
|
|
1489
|
-
var
|
|
1490
|
-
for (var
|
|
1491
|
-
(o = t[r]) && (
|
|
1492
|
-
return
|
|
1488
|
+
], He);
|
|
1489
|
+
var wa = Object.getOwnPropertyDescriptor, xa = (t, e, s, i) => {
|
|
1490
|
+
for (var a = i > 1 ? void 0 : i ? wa(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1491
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1492
|
+
return a;
|
|
1493
1493
|
};
|
|
1494
|
-
let
|
|
1494
|
+
let Ge = class extends X {
|
|
1495
1495
|
renderControl() {
|
|
1496
1496
|
return l`<input
|
|
1497
1497
|
class="baht-control baht-control--number"
|
|
@@ -1514,31 +1514,31 @@ let He = class extends X {
|
|
|
1514
1514
|
/>`;
|
|
1515
1515
|
}
|
|
1516
1516
|
};
|
|
1517
|
-
|
|
1517
|
+
Ge = xa([
|
|
1518
1518
|
f("baht-number")
|
|
1519
|
-
],
|
|
1520
|
-
var
|
|
1521
|
-
for (var
|
|
1522
|
-
(o = t[r]) && (
|
|
1523
|
-
return i &&
|
|
1519
|
+
], Ge);
|
|
1520
|
+
var _a = Object.defineProperty, ka = Object.getOwnPropertyDescriptor, ms = (t, e, s, i) => {
|
|
1521
|
+
for (var a = i > 1 ? void 0 : i ? ka(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1522
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1523
|
+
return i && a && _a(e, s, a), a;
|
|
1524
1524
|
};
|
|
1525
|
-
function
|
|
1525
|
+
function We(t) {
|
|
1526
1526
|
const e = t.replace(/,/g, "").trim();
|
|
1527
1527
|
if (e === "" || e === "-") return null;
|
|
1528
|
-
const
|
|
1529
|
-
return Number.isNaN(
|
|
1528
|
+
const s = Number(e);
|
|
1529
|
+
return Number.isNaN(s) ? null : s;
|
|
1530
1530
|
}
|
|
1531
|
-
function
|
|
1531
|
+
function Oa(t) {
|
|
1532
1532
|
return t.toLocaleString("en-US", { maximumFractionDigits: 2 });
|
|
1533
1533
|
}
|
|
1534
|
-
let
|
|
1534
|
+
let Ie = class extends X {
|
|
1535
1535
|
constructor() {
|
|
1536
1536
|
super(...arguments), this.focused = !1;
|
|
1537
1537
|
}
|
|
1538
1538
|
displayFor(t) {
|
|
1539
1539
|
if (t == null || t === "") return "";
|
|
1540
|
-
const e = typeof t == "number" ? t :
|
|
1541
|
-
return e == null ? String(t) : this.focused ? String(e) :
|
|
1540
|
+
const e = typeof t == "number" ? t : We(String(t));
|
|
1541
|
+
return e == null ? String(t) : this.focused ? String(e) : Oa(e);
|
|
1542
1542
|
}
|
|
1543
1543
|
renderControl() {
|
|
1544
1544
|
return l`<input
|
|
@@ -1562,23 +1562,23 @@ let Be = class extends X {
|
|
|
1562
1562
|
}}
|
|
1563
1563
|
@input=${(t) => {
|
|
1564
1564
|
const e = t.target.value;
|
|
1565
|
-
this.emitTyped(e === "" ? null :
|
|
1565
|
+
this.emitTyped(e === "" ? null : We(e));
|
|
1566
1566
|
}}
|
|
1567
1567
|
/>`;
|
|
1568
1568
|
}
|
|
1569
1569
|
};
|
|
1570
1570
|
ms([
|
|
1571
1571
|
v()
|
|
1572
|
-
],
|
|
1573
|
-
|
|
1572
|
+
], Ie.prototype, "focused", 2);
|
|
1573
|
+
Ie = ms([
|
|
1574
1574
|
f("baht-currency")
|
|
1575
|
-
],
|
|
1576
|
-
var
|
|
1577
|
-
for (var
|
|
1578
|
-
(o = t[r]) && (
|
|
1579
|
-
return i &&
|
|
1575
|
+
], Ie);
|
|
1576
|
+
var Pa = Object.defineProperty, Ca = Object.getOwnPropertyDescriptor, qe = (t, e, s, i) => {
|
|
1577
|
+
for (var a = i > 1 ? void 0 : i ? Ca(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1578
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
1579
|
+
return i && a && Pa(e, s, a), a;
|
|
1580
1580
|
};
|
|
1581
|
-
const
|
|
1581
|
+
const Da = 500;
|
|
1582
1582
|
let ne = class extends X {
|
|
1583
1583
|
constructor() {
|
|
1584
1584
|
super(...arguments), this.open = !1, this.active = 0, this.typeBuffer = "", this.onDocMousedown = (t) => {
|
|
@@ -1586,7 +1586,7 @@ let ne = class extends X {
|
|
|
1586
1586
|
};
|
|
1587
1587
|
}
|
|
1588
1588
|
disconnectedCallback() {
|
|
1589
|
-
super.disconnectedCallback(), clearTimeout(this.typeTimer),
|
|
1589
|
+
super.disconnectedCallback(), clearTimeout(this.typeTimer), j() && document.removeEventListener("mousedown", this.onDocMousedown);
|
|
1590
1590
|
}
|
|
1591
1591
|
get listId() {
|
|
1592
1592
|
return `${this.controlId}-list`;
|
|
@@ -1621,10 +1621,10 @@ let ne = class extends X {
|
|
|
1621
1621
|
(e = t == null ? void 0 : t.scrollIntoView) == null || e.call(t, { block: "nearest" });
|
|
1622
1622
|
}
|
|
1623
1623
|
openList() {
|
|
1624
|
-
!this.interactive || this.open || (this.active = this.selectedIndex, this.open = !0,
|
|
1624
|
+
!this.interactive || this.open || (this.active = this.selectedIndex, this.open = !0, j() && document.addEventListener("mousedown", this.onDocMousedown));
|
|
1625
1625
|
}
|
|
1626
1626
|
close() {
|
|
1627
|
-
this.open && (this.open = !1,
|
|
1627
|
+
this.open && (this.open = !1, j() && document.removeEventListener("mousedown", this.onDocMousedown));
|
|
1628
1628
|
}
|
|
1629
1629
|
toggle() {
|
|
1630
1630
|
this.open ? this.close() : this.openList();
|
|
@@ -1642,12 +1642,12 @@ let ne = class extends X {
|
|
|
1642
1642
|
}
|
|
1643
1643
|
/** Type-to-select: first option (after the highlighted one) starting with the buffer. */
|
|
1644
1644
|
typeahead(t) {
|
|
1645
|
-
clearTimeout(this.typeTimer), this.typeBuffer += t.toLowerCase(), this.typeTimer = setTimeout(() => this.typeBuffer = "",
|
|
1646
|
-
const e = this.rows,
|
|
1645
|
+
clearTimeout(this.typeTimer), this.typeBuffer += t.toLowerCase(), this.typeTimer = setTimeout(() => this.typeBuffer = "", Da);
|
|
1646
|
+
const e = this.rows, s = this.typeBuffer.length === 1 ? this.active + 1 : this.active;
|
|
1647
1647
|
for (let i = 0; i < e.length; i++) {
|
|
1648
|
-
const
|
|
1649
|
-
if (
|
|
1650
|
-
this.open ? this.active =
|
|
1648
|
+
const a = (s + i) % e.length;
|
|
1649
|
+
if (a !== 0 && e[a].label.toLowerCase().startsWith(this.typeBuffer)) {
|
|
1650
|
+
this.open ? this.active = a : this.commit(a);
|
|
1651
1651
|
return;
|
|
1652
1652
|
}
|
|
1653
1653
|
}
|
|
@@ -1687,11 +1687,11 @@ let ne = class extends X {
|
|
|
1687
1687
|
}
|
|
1688
1688
|
}
|
|
1689
1689
|
renderControl() {
|
|
1690
|
-
const t = this.rows, e = this.selectedIndex,
|
|
1690
|
+
const t = this.rows, e = this.selectedIndex, s = e === 0;
|
|
1691
1691
|
return l`<div class="baht-select${this.open ? " baht-select--open" : ""}">
|
|
1692
1692
|
<button
|
|
1693
1693
|
type="button"
|
|
1694
|
-
class="baht-control baht-control--select baht-select-trigger${
|
|
1694
|
+
class="baht-control baht-control--select baht-select-trigger${s ? " baht-select-trigger--placeholder" : ""}"
|
|
1695
1695
|
id=${this.controlId}
|
|
1696
1696
|
role="combobox"
|
|
1697
1697
|
aria-haspopup="listbox"
|
|
@@ -1708,7 +1708,7 @@ let ne = class extends X {
|
|
|
1708
1708
|
@keydown=${(i) => this.onKeydown(i)}
|
|
1709
1709
|
>
|
|
1710
1710
|
<span class="baht-select-value">${t[e].label}</span>
|
|
1711
|
-
<span class="baht-select-chevron" aria-hidden="true">${
|
|
1711
|
+
<span class="baht-select-chevron" aria-hidden="true">${T("chevron-down")}</span>
|
|
1712
1712
|
</button>
|
|
1713
1713
|
<div
|
|
1714
1714
|
class="baht-listbox baht-select-list"
|
|
@@ -1719,15 +1719,15 @@ let ne = class extends X {
|
|
|
1719
1719
|
>
|
|
1720
1720
|
${t.map(
|
|
1721
1721
|
// eslint-disable-next-line lit-a11y/click-events-have-key-events -- keyboard lives on the combobox (aria-activedescendant pattern); options are never focused
|
|
1722
|
-
(i,
|
|
1723
|
-
class="baht-listbox-option${
|
|
1724
|
-
id=${this.optionId(
|
|
1722
|
+
(i, a) => l`<div
|
|
1723
|
+
class="baht-listbox-option${a === this.active ? " baht-listbox-option--active" : ""}${a === 0 ? " baht-listbox-option--placeholder" : ""}"
|
|
1724
|
+
id=${this.optionId(a)}
|
|
1725
1725
|
role="option"
|
|
1726
|
-
aria-selected=${
|
|
1726
|
+
aria-selected=${a === e ? "true" : "false"}
|
|
1727
1727
|
data-key=${i.key}
|
|
1728
1728
|
@mousedown=${(r) => r.preventDefault()}
|
|
1729
|
-
@mousemove=${() => this.highlight(
|
|
1730
|
-
@click=${() => this.commit(
|
|
1729
|
+
@mousemove=${() => this.highlight(a)}
|
|
1730
|
+
@click=${() => this.commit(a)}
|
|
1731
1731
|
>
|
|
1732
1732
|
${i.label}
|
|
1733
1733
|
</div>`
|
|
@@ -1745,18 +1745,18 @@ qe([
|
|
|
1745
1745
|
ne = qe([
|
|
1746
1746
|
f("baht-select")
|
|
1747
1747
|
], ne);
|
|
1748
|
-
var
|
|
1749
|
-
for (var
|
|
1750
|
-
(o = t[r]) && (
|
|
1751
|
-
return
|
|
1748
|
+
var Sa = Object.getOwnPropertyDescriptor, Fa = (t, e, s, i) => {
|
|
1749
|
+
for (var a = i > 1 ? void 0 : i ? Sa(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1750
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1751
|
+
return a;
|
|
1752
1752
|
};
|
|
1753
|
-
let
|
|
1753
|
+
let Je = class extends X {
|
|
1754
1754
|
get selected() {
|
|
1755
1755
|
return Array.isArray(this.value) ? this.value : [];
|
|
1756
1756
|
}
|
|
1757
1757
|
toggle(t, e) {
|
|
1758
|
-
const
|
|
1759
|
-
this.emitInput(i.filter((
|
|
1758
|
+
const s = e ? [...this.selected, t] : this.selected.filter((a) => a !== t), i = (this.field.options ?? []).map((a) => a.key);
|
|
1759
|
+
this.emitInput(i.filter((a) => s.includes(a)));
|
|
1760
1760
|
}
|
|
1761
1761
|
renderControl() {
|
|
1762
1762
|
return l`<div
|
|
@@ -1780,15 +1780,15 @@ let We = class extends X {
|
|
|
1780
1780
|
</div>`;
|
|
1781
1781
|
}
|
|
1782
1782
|
};
|
|
1783
|
-
|
|
1783
|
+
Je = Fa([
|
|
1784
1784
|
f("baht-multiselect")
|
|
1785
|
-
],
|
|
1786
|
-
var
|
|
1787
|
-
for (var
|
|
1788
|
-
(o = t[r]) && (
|
|
1789
|
-
return
|
|
1785
|
+
], Je);
|
|
1786
|
+
var Ma = Object.getOwnPropertyDescriptor, Ia = (t, e, s, i) => {
|
|
1787
|
+
for (var a = i > 1 ? void 0 : i ? Ma(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1788
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1789
|
+
return a;
|
|
1790
1790
|
};
|
|
1791
|
-
let
|
|
1791
|
+
let Xe = class extends X {
|
|
1792
1792
|
/** Label sits beside the box, so suppress the block label. */
|
|
1793
1793
|
renderLabel() {
|
|
1794
1794
|
return h;
|
|
@@ -1811,15 +1811,15 @@ let Je = class extends X {
|
|
|
1811
1811
|
</label>`;
|
|
1812
1812
|
}
|
|
1813
1813
|
};
|
|
1814
|
-
|
|
1814
|
+
Xe = Ia([
|
|
1815
1815
|
f("baht-checkbox")
|
|
1816
|
-
],
|
|
1817
|
-
var Ba = Object.getOwnPropertyDescriptor,
|
|
1818
|
-
for (var
|
|
1819
|
-
(o = t[r]) && (
|
|
1820
|
-
return
|
|
1816
|
+
], Xe);
|
|
1817
|
+
var Ba = Object.getOwnPropertyDescriptor, Ta = (t, e, s, i) => {
|
|
1818
|
+
for (var a = i > 1 ? void 0 : i ? Ba(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1819
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1820
|
+
return a;
|
|
1821
1821
|
};
|
|
1822
|
-
let
|
|
1822
|
+
let Ye = class extends X {
|
|
1823
1823
|
renderOption(t) {
|
|
1824
1824
|
return l`<label class="baht-option">
|
|
1825
1825
|
<input
|
|
@@ -1844,7 +1844,7 @@ let Xe = class extends X {
|
|
|
1844
1844
|
?disabled=${this.disabled || this.readonly}
|
|
1845
1845
|
@change=${() => this.emitInput(t.key)}
|
|
1846
1846
|
/>
|
|
1847
|
-
${t.icon && us(t.icon) ? l`<span class="baht-option-card-icon">${
|
|
1847
|
+
${t.icon && us(t.icon) ? l`<span class="baht-option-card-icon">${T(t.icon)}</span>` : h}
|
|
1848
1848
|
<span class="baht-option-card-title">${t.label}</span>
|
|
1849
1849
|
</span>
|
|
1850
1850
|
${t.description ? l`<span class="baht-option-card-desc">${t.description}</span>` : h}
|
|
@@ -1866,15 +1866,15 @@ let Xe = class extends X {
|
|
|
1866
1866
|
</div>`;
|
|
1867
1867
|
}
|
|
1868
1868
|
};
|
|
1869
|
-
|
|
1869
|
+
Ye = Ta([
|
|
1870
1870
|
f("baht-radio")
|
|
1871
|
-
],
|
|
1872
|
-
var ja = Object.getOwnPropertyDescriptor,
|
|
1873
|
-
for (var
|
|
1874
|
-
(o = t[r]) && (
|
|
1875
|
-
return
|
|
1871
|
+
], Ye);
|
|
1872
|
+
var ja = Object.getOwnPropertyDescriptor, Aa = (t, e, s, i) => {
|
|
1873
|
+
for (var a = i > 1 ? void 0 : i ? ja(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1874
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1875
|
+
return a;
|
|
1876
1876
|
};
|
|
1877
|
-
let
|
|
1877
|
+
let Ze = class extends X {
|
|
1878
1878
|
renderLabel() {
|
|
1879
1879
|
return h;
|
|
1880
1880
|
}
|
|
@@ -1899,15 +1899,15 @@ let Ye = class extends X {
|
|
|
1899
1899
|
</label>`;
|
|
1900
1900
|
}
|
|
1901
1901
|
};
|
|
1902
|
-
|
|
1902
|
+
Ze = Aa([
|
|
1903
1903
|
f("baht-toggle")
|
|
1904
|
-
],
|
|
1905
|
-
var
|
|
1906
|
-
for (var
|
|
1907
|
-
(o = t[r]) && (
|
|
1908
|
-
return
|
|
1904
|
+
], Ze);
|
|
1905
|
+
var Ea = Object.getOwnPropertyDescriptor, La = (t, e, s, i) => {
|
|
1906
|
+
for (var a = i > 1 ? void 0 : i ? Ea(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
1907
|
+
(o = t[r]) && (a = o(a) || a);
|
|
1908
|
+
return a;
|
|
1909
1909
|
};
|
|
1910
|
-
let
|
|
1910
|
+
let Qe = class extends X {
|
|
1911
1911
|
constructor() {
|
|
1912
1912
|
super(...arguments), this.lastEmitted = null;
|
|
1913
1913
|
}
|
|
@@ -1925,7 +1925,7 @@ let Ze = class extends X {
|
|
|
1925
1925
|
aria-invalid=${this.invalid}
|
|
1926
1926
|
aria-describedby=${this.describedBy}
|
|
1927
1927
|
/>
|
|
1928
|
-
<span class="baht-datepicker-field-icon" aria-hidden="true">${
|
|
1928
|
+
<span class="baht-datepicker-field-icon" aria-hidden="true">${T("calendar")}</span>
|
|
1929
1929
|
</span>`;
|
|
1930
1930
|
}
|
|
1931
1931
|
connectedCallback() {
|
|
@@ -1941,7 +1941,7 @@ let Ze = class extends X {
|
|
|
1941
1941
|
return;
|
|
1942
1942
|
}
|
|
1943
1943
|
if (!this.fp || this.fp.input !== e || t.has("field") || t.has("disabled") || t.has("readonly")) {
|
|
1944
|
-
this.teardown(), this.fp =
|
|
1944
|
+
this.teardown(), this.fp = Ss(e, this.options());
|
|
1945
1945
|
return;
|
|
1946
1946
|
}
|
|
1947
1947
|
t.has("value") && (this.lastEmitted = null, this.syncValue());
|
|
@@ -1954,30 +1954,37 @@ let Ze = class extends X {
|
|
|
1954
1954
|
syncValue() {
|
|
1955
1955
|
if (!this.fp) return;
|
|
1956
1956
|
const t = this.datesOf(this.value);
|
|
1957
|
-
|
|
1957
|
+
this.sameInstants(this.fp.selectedDates, t) || (t.length === 0 ? this.fp.clear(!1) : this.fp.setDate(t, !1));
|
|
1958
|
+
}
|
|
1959
|
+
/** Value-equality for the picker's own selection (minute-precise with `enable_time`). */
|
|
1960
|
+
sameInstants(t, e) {
|
|
1961
|
+
if (t.length !== e.length) return !1;
|
|
1962
|
+
const s = this.field.enable_time ? Re : ae;
|
|
1963
|
+
return t.every((i, a) => s(i) === s(e[a]));
|
|
1958
1964
|
}
|
|
1959
1965
|
options() {
|
|
1960
|
-
const t = this.field, e = ye(t),
|
|
1966
|
+
const t = this.field, e = ye(t), s = qt(t.min), i = qt(t.max);
|
|
1961
1967
|
return {
|
|
1962
1968
|
static: !0,
|
|
1963
1969
|
disableMobile: !0,
|
|
1964
1970
|
// our calendar everywhere — never the OS date wheel
|
|
1965
1971
|
mode: e,
|
|
1966
|
-
dateFormat: t.date_format ?? "Y-m-d",
|
|
1972
|
+
dateFormat: t.date_format ?? (t.enable_time ? "Y-m-d H:i" : "Y-m-d"),
|
|
1973
|
+
...t.enable_time ? { enableTime: !0, time_24hr: t.time_24hr ?? !1 } : {},
|
|
1967
1974
|
allowInput: !0,
|
|
1968
1975
|
clickOpens: !this.disabled && !this.readonly,
|
|
1969
1976
|
defaultDate: this.datesOf(this.value),
|
|
1970
|
-
...
|
|
1977
|
+
...s ? { minDate: s } : {},
|
|
1971
1978
|
...i ? { maxDate: i } : {},
|
|
1972
1979
|
disable: es(t),
|
|
1973
|
-
onReady: (
|
|
1980
|
+
onReady: (a, r, o) => this.mountFooter(o),
|
|
1974
1981
|
onOpen: () => this.refreshFooter(),
|
|
1975
|
-
onChange: (
|
|
1976
|
-
this.refreshFooter(), !(e === "range" &&
|
|
1982
|
+
onChange: (a) => {
|
|
1983
|
+
this.refreshFooter(), !(e === "range" && a.length === 1) && this.emitIfChanged(a);
|
|
1977
1984
|
},
|
|
1978
|
-
onClose: (
|
|
1985
|
+
onClose: (a) => {
|
|
1979
1986
|
var r, o;
|
|
1980
|
-
e === "range" &&
|
|
1987
|
+
e === "range" && a.length === 1 && ((r = this.fp) == null || r.clear(!1)), this.emitIfChanged(((o = this.fp) == null ? void 0 : o.selectedDates) ?? []);
|
|
1981
1988
|
}
|
|
1982
1989
|
};
|
|
1983
1990
|
}
|
|
@@ -1985,13 +1992,13 @@ let Ze = class extends X {
|
|
|
1985
1992
|
mountFooter(t) {
|
|
1986
1993
|
const e = document.createElement("div");
|
|
1987
1994
|
e.className = "baht-datepicker-footer";
|
|
1988
|
-
const
|
|
1989
|
-
|
|
1995
|
+
const s = document.createElement("button");
|
|
1996
|
+
s.type = "button", s.className = "baht-button baht-button--sm baht-datepicker-today", s.textContent = u("today"), s.addEventListener("click", () => this.pickToday());
|
|
1990
1997
|
const i = document.createElement("button");
|
|
1991
1998
|
i.type = "button", i.className = "baht-button baht-button--danger baht-button--sm baht-datepicker-clear", i.textContent = u("clear"), i.addEventListener("click", () => {
|
|
1992
|
-
var
|
|
1993
|
-
(
|
|
1994
|
-
}), e.append(
|
|
1999
|
+
var a, r;
|
|
2000
|
+
(a = this.fp) == null || a.clear(), (r = this.fp) == null || r.close();
|
|
2001
|
+
}), e.append(s, i), t.calendarContainer.appendChild(e), this.todayBtn = s, this.clearBtn = i, this.refreshFooter(t);
|
|
1995
2002
|
}
|
|
1996
2003
|
/** Today greys out when the rules exclude it; Clear when there is nothing to clear.
|
|
1997
2004
|
* `fp` is passed explicitly from onReady — it fires inside the flatpickr()
|
|
@@ -2000,16 +2007,16 @@ let Ze = class extends X {
|
|
|
2000
2007
|
t && (this.todayBtn && (this.todayBtn.disabled = !this.todayAllowed()), this.clearBtn && (this.clearBtn.disabled = t.selectedDates.length === 0));
|
|
2001
2008
|
}
|
|
2002
2009
|
todayAllowed() {
|
|
2003
|
-
const t = kt(/* @__PURE__ */ new Date()), e = qt(this.field.min),
|
|
2004
|
-
if (e && t < kt(e) ||
|
|
2010
|
+
const t = kt(/* @__PURE__ */ new Date()), e = qt(this.field.min), s = qt(this.field.max);
|
|
2011
|
+
if (e && t < kt(e) || s && t > kt(s)) return !1;
|
|
2005
2012
|
for (const i of es(this.field) ?? [])
|
|
2006
2013
|
if (i instanceof Date) {
|
|
2007
|
-
if (
|
|
2014
|
+
if (ts(i, t)) return !1;
|
|
2008
2015
|
} else if (typeof i == "function") {
|
|
2009
2016
|
if (i(t)) return !1;
|
|
2010
2017
|
} else if (typeof i == "object" && "from" in i) {
|
|
2011
|
-
const
|
|
2012
|
-
if (t >=
|
|
2018
|
+
const a = kt(new Date(i.from)), r = kt(new Date(i.to));
|
|
2019
|
+
if (t >= a && t <= r) return !1;
|
|
2013
2020
|
}
|
|
2014
2021
|
return !0;
|
|
2015
2022
|
}
|
|
@@ -2022,7 +2029,7 @@ let Ze = class extends X {
|
|
|
2022
2029
|
t.setDate([e, e], !0);
|
|
2023
2030
|
break;
|
|
2024
2031
|
case "multiple": {
|
|
2025
|
-
t.selectedDates.some((i) =>
|
|
2032
|
+
t.selectedDates.some((i) => ts(i, e)) || t.setDate([...t.selectedDates, e], !0);
|
|
2026
2033
|
break;
|
|
2027
2034
|
}
|
|
2028
2035
|
default:
|
|
@@ -2032,50 +2039,51 @@ let Ze = class extends X {
|
|
|
2032
2039
|
}
|
|
2033
2040
|
emitIfChanged(t) {
|
|
2034
2041
|
const e = this.lastEmitted ?? this.datesOf(this.value);
|
|
2035
|
-
|
|
2042
|
+
this.sameInstants(t, e) || (this.lastEmitted = [...t], this.emitInput(this.toValue(t)));
|
|
2036
2043
|
}
|
|
2037
|
-
/** Host value (any mode) -> the Date list flatpickr works with.
|
|
2044
|
+
/** Host value (any mode) -> the Date list flatpickr works with. A bare
|
|
2045
|
+
* day is accepted even with `enable_time` on (defaults to midnight) -
|
|
2046
|
+
* a host may not always have a time to feed back (an edited record that
|
|
2047
|
+
* predates this field, for one). */
|
|
2038
2048
|
datesOf(t) {
|
|
2039
|
-
|
|
2049
|
+
const e = (s) => (this.field.enable_time ? xs(s) : null) ?? qt(s);
|
|
2050
|
+
return ws(t).map(e).filter((s) => s !== null);
|
|
2040
2051
|
}
|
|
2041
2052
|
/** flatpickr's selection -> the value shape of the field's mode. */
|
|
2042
2053
|
toValue(t) {
|
|
2043
|
-
const e = t.map(
|
|
2054
|
+
const e = this.field.enable_time ? Re : ae, s = t.map(e);
|
|
2044
2055
|
switch (ye(this.field)) {
|
|
2045
2056
|
case "range":
|
|
2046
|
-
return
|
|
2057
|
+
return s.length === 2 ? [s[0], s[1]] : null;
|
|
2047
2058
|
case "multiple":
|
|
2048
|
-
return
|
|
2059
|
+
return s;
|
|
2049
2060
|
default:
|
|
2050
|
-
return
|
|
2061
|
+
return s[0] ?? null;
|
|
2051
2062
|
}
|
|
2052
2063
|
}
|
|
2053
2064
|
};
|
|
2054
|
-
|
|
2065
|
+
Qe = La([
|
|
2055
2066
|
f("baht-datepicker")
|
|
2056
|
-
],
|
|
2067
|
+
], Qe);
|
|
2057
2068
|
function kt(t) {
|
|
2058
2069
|
return new Date(t.getFullYear(), t.getMonth(), t.getDate());
|
|
2059
2070
|
}
|
|
2060
|
-
function Qe(t, e) {
|
|
2061
|
-
return Vt(t) === Vt(e);
|
|
2062
|
-
}
|
|
2063
2071
|
function ts(t, e) {
|
|
2064
|
-
return t
|
|
2072
|
+
return ae(t) === ae(e);
|
|
2065
2073
|
}
|
|
2066
2074
|
function es(t) {
|
|
2067
2075
|
const e = [];
|
|
2068
2076
|
for (const i of t.disabled_dates ?? []) {
|
|
2069
|
-
const
|
|
2070
|
-
|
|
2077
|
+
const a = _s(i);
|
|
2078
|
+
a && e.push(a[0].getTime() === a[1].getTime() ? a[0] : { from: a[0], to: a[1] });
|
|
2071
2079
|
}
|
|
2072
|
-
const
|
|
2073
|
-
return
|
|
2080
|
+
const s = t.disabled_weekdays;
|
|
2081
|
+
return s != null && s.length && e.push((i) => s.includes(i.getDay())), e;
|
|
2074
2082
|
}
|
|
2075
|
-
var
|
|
2076
|
-
for (var
|
|
2077
|
-
(o = t[r]) && (
|
|
2078
|
-
return i &&
|
|
2083
|
+
var Na = Object.defineProperty, qa = Object.getOwnPropertyDescriptor, Qt = (t, e, s, i) => {
|
|
2084
|
+
for (var a = i > 1 ? void 0 : i ? qa(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2085
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2086
|
+
return i && a && Na(e, s, a), a;
|
|
2079
2087
|
};
|
|
2080
2088
|
function ss(t) {
|
|
2081
2089
|
return t !== null && typeof t == "object" && typeof t.url == "string";
|
|
@@ -2097,9 +2105,9 @@ let Mt = class extends X {
|
|
|
2097
2105
|
if (!this.uploader) return;
|
|
2098
2106
|
this.uploadError = null, this.uploadingCount += t.length;
|
|
2099
2107
|
const e = this.field.multiple ? [...this.refs] : [];
|
|
2100
|
-
for (const
|
|
2108
|
+
for (const s of t)
|
|
2101
2109
|
try {
|
|
2102
|
-
e.push(await this.uploader(
|
|
2110
|
+
e.push(await this.uploader(s));
|
|
2103
2111
|
} catch {
|
|
2104
2112
|
this.uploadError = u("uploadFailed");
|
|
2105
2113
|
} finally {
|
|
@@ -2112,8 +2120,8 @@ let Mt = class extends X {
|
|
|
2112
2120
|
this.take(Array.from(e.files ?? []), e);
|
|
2113
2121
|
}
|
|
2114
2122
|
take(t, e) {
|
|
2115
|
-
const
|
|
2116
|
-
if (this.rejectedNames =
|
|
2123
|
+
const s = this.field.max_size, i = s ? t.filter((r) => r.size <= s) : t, a = s ? t.filter((r) => r.size > s) : [];
|
|
2124
|
+
if (this.rejectedNames = a.map((r) => r.name), this.uploader) {
|
|
2117
2125
|
e && (e.value = ""), this.uploadAll(i);
|
|
2118
2126
|
return;
|
|
2119
2127
|
}
|
|
@@ -2129,20 +2137,20 @@ let Mt = class extends X {
|
|
|
2129
2137
|
), this.field.max_size && t.push(u("uploadMaxSize", { size: _e(this.field.max_size) })), t.join(" · ");
|
|
2130
2138
|
}
|
|
2131
2139
|
renderControl() {
|
|
2132
|
-
const t = this.disabled || this.readonly || this.uploadingCount > 0, e = this.hintText(),
|
|
2140
|
+
const t = this.disabled || this.readonly || this.uploadingCount > 0, e = this.hintText(), s = [
|
|
2133
2141
|
"baht-dropzone",
|
|
2134
2142
|
t ? "baht-dropzone--disabled" : "",
|
|
2135
2143
|
this.invalid === "true" ? "baht-dropzone--invalid" : ""
|
|
2136
2144
|
].filter(Boolean).join(" ");
|
|
2137
2145
|
return l`<div
|
|
2138
|
-
class=${
|
|
2146
|
+
class=${s}
|
|
2139
2147
|
@dragover=${(i) => {
|
|
2140
2148
|
t || (i.preventDefault(), i.currentTarget.classList.add("baht-dropzone--over"));
|
|
2141
2149
|
}}
|
|
2142
2150
|
@dragleave=${(i) => i.currentTarget.classList.remove("baht-dropzone--over")}
|
|
2143
2151
|
@drop=${(i) => {
|
|
2144
|
-
var
|
|
2145
|
-
i.preventDefault(), i.currentTarget.classList.remove("baht-dropzone--over"), t || this.take(Array.from(((
|
|
2152
|
+
var a;
|
|
2153
|
+
i.preventDefault(), i.currentTarget.classList.remove("baht-dropzone--over"), t || this.take(Array.from(((a = i.dataTransfer) == null ? void 0 : a.files) ?? []));
|
|
2146
2154
|
}}
|
|
2147
2155
|
>
|
|
2148
2156
|
<input
|
|
@@ -2188,57 +2196,57 @@ let Mt = class extends X {
|
|
|
2188
2196
|
class="baht-file-remove"
|
|
2189
2197
|
aria-label=${u("removeFile")}
|
|
2190
2198
|
title=${u("removeFile")}
|
|
2191
|
-
@click=${() => this.emitRefs(this.refs.filter((
|
|
2199
|
+
@click=${() => this.emitRefs(this.refs.filter((a) => a !== i))}
|
|
2192
2200
|
>
|
|
2193
|
-
${
|
|
2201
|
+
${T("close")}
|
|
2194
2202
|
</button>`}
|
|
2195
2203
|
</span>`
|
|
2196
2204
|
)}`;
|
|
2197
2205
|
}
|
|
2198
2206
|
};
|
|
2199
|
-
|
|
2207
|
+
Qt([
|
|
2200
2208
|
n({ attribute: !1 })
|
|
2201
2209
|
], Mt.prototype, "uploader", 2);
|
|
2202
|
-
|
|
2210
|
+
Qt([
|
|
2203
2211
|
v()
|
|
2204
2212
|
], Mt.prototype, "uploadingCount", 2);
|
|
2205
|
-
|
|
2213
|
+
Qt([
|
|
2206
2214
|
v()
|
|
2207
2215
|
], Mt.prototype, "uploadError", 2);
|
|
2208
|
-
|
|
2216
|
+
Qt([
|
|
2209
2217
|
v()
|
|
2210
2218
|
], Mt.prototype, "rejectedNames", 2);
|
|
2211
|
-
Mt =
|
|
2219
|
+
Mt = Qt([
|
|
2212
2220
|
f("baht-file")
|
|
2213
2221
|
], Mt);
|
|
2214
|
-
var
|
|
2215
|
-
for (var
|
|
2216
|
-
(o = t[r]) && (
|
|
2217
|
-
return i &&
|
|
2222
|
+
var Ra = Object.defineProperty, za = Object.getOwnPropertyDescriptor, I = (t, e, s, i) => {
|
|
2223
|
+
for (var a = i > 1 ? void 0 : i ? za(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2224
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2225
|
+
return i && a && Ra(e, s, a), a;
|
|
2218
2226
|
};
|
|
2219
|
-
function
|
|
2220
|
-
return e.split(".").reduce((
|
|
2221
|
-
if (
|
|
2227
|
+
function Va(t, e) {
|
|
2228
|
+
return e.split(".").reduce((s, i) => {
|
|
2229
|
+
if (s !== null && typeof s == "object") return s[i];
|
|
2222
2230
|
}, t);
|
|
2223
2231
|
}
|
|
2224
|
-
function
|
|
2225
|
-
const
|
|
2226
|
-
if (!
|
|
2232
|
+
function Ka(t, e) {
|
|
2233
|
+
const s = t.trim();
|
|
2234
|
+
if (!s) return null;
|
|
2227
2235
|
try {
|
|
2228
|
-
const i = JSON.parse(
|
|
2236
|
+
const i = JSON.parse(s);
|
|
2229
2237
|
if (typeof i == "string") return i;
|
|
2230
|
-
const
|
|
2231
|
-
return typeof
|
|
2238
|
+
const a = e ? Va(i, e) : i;
|
|
2239
|
+
return typeof a == "string" && a ? a : null;
|
|
2232
2240
|
} catch {
|
|
2233
|
-
return /^(https?:\/\/|\/|data:|blob:)/.test(
|
|
2241
|
+
return /^(https?:\/\/|\/|data:|blob:)/.test(s) ? s : null;
|
|
2234
2242
|
}
|
|
2235
2243
|
}
|
|
2236
|
-
function
|
|
2237
|
-
const
|
|
2244
|
+
function Ua(t) {
|
|
2245
|
+
const s = (t.split(/[?#]/)[0] ?? t).split("/").filter(Boolean).pop() ?? t;
|
|
2238
2246
|
try {
|
|
2239
|
-
return decodeURIComponent(
|
|
2247
|
+
return decodeURIComponent(s);
|
|
2240
2248
|
} catch {
|
|
2241
|
-
return
|
|
2249
|
+
return s;
|
|
2242
2250
|
}
|
|
2243
2251
|
}
|
|
2244
2252
|
function ke(t) {
|
|
@@ -2255,7 +2263,7 @@ let S = class extends y {
|
|
|
2255
2263
|
return `baht-upload-${this.uid}`;
|
|
2256
2264
|
}
|
|
2257
2265
|
fileFor(t) {
|
|
2258
|
-
return this.known.get(t) ?? { name:
|
|
2266
|
+
return this.known.get(t) ?? { name: Ua(t), size: 0, url: t };
|
|
2259
2267
|
}
|
|
2260
2268
|
/** Empty the value (does not delete anything on the server). */
|
|
2261
2269
|
clear() {
|
|
@@ -2265,15 +2273,15 @@ let S = class extends y {
|
|
|
2265
2273
|
const e = this.multiple ? t : t[0] ?? null;
|
|
2266
2274
|
this.value = e, this.emit("baht-change", {
|
|
2267
2275
|
value: e,
|
|
2268
|
-
files: t.map((
|
|
2276
|
+
files: t.map((s) => this.fileFor(s))
|
|
2269
2277
|
});
|
|
2270
2278
|
}
|
|
2271
2279
|
accept_(t) {
|
|
2272
2280
|
if (this.disabled || t.length === 0) return;
|
|
2273
|
-
const e = this.maxSize,
|
|
2274
|
-
this.rejectedNames = e ? t.filter((
|
|
2275
|
-
const i = this.multiple ?
|
|
2276
|
-
for (const
|
|
2281
|
+
const e = this.maxSize, s = e ? t.filter((a) => a.size <= e) : t;
|
|
2282
|
+
this.rejectedNames = e ? t.filter((a) => a.size > e).map((a) => a.name) : [];
|
|
2283
|
+
const i = this.multiple ? s : s.slice(0, 1);
|
|
2284
|
+
for (const a of i) this.start(a);
|
|
2277
2285
|
}
|
|
2278
2286
|
onPick(t) {
|
|
2279
2287
|
const e = t.target;
|
|
@@ -2294,36 +2302,36 @@ let S = class extends y {
|
|
|
2294
2302
|
this.pending = this.multiple ? [...this.pending, e] : [e], this.emit("baht-upload-start", { file: t }), this.send(e);
|
|
2295
2303
|
}
|
|
2296
2304
|
patch(t, e) {
|
|
2297
|
-
this.pending = this.pending.map((
|
|
2305
|
+
this.pending = this.pending.map((s) => s.id === t ? { ...s, ...e } : s);
|
|
2298
2306
|
}
|
|
2299
2307
|
send(t) {
|
|
2300
2308
|
const e = new XMLHttpRequest();
|
|
2301
2309
|
e.open(this.method || "POST", this.url);
|
|
2302
|
-
for (const [i,
|
|
2310
|
+
for (const [i, a] of Object.entries(this.headers ?? {})) e.setRequestHeader(i, a);
|
|
2303
2311
|
e.withCredentials = this.withCredentials, e.upload.onprogress = (i) => {
|
|
2304
|
-
const
|
|
2305
|
-
this.patch(t.id, { percent:
|
|
2312
|
+
const a = i.total > 0 ? Math.round(i.loaded / i.total * 100) : 0;
|
|
2313
|
+
this.patch(t.id, { percent: a }), this.emit("baht-upload-progress", {
|
|
2306
2314
|
file: t.file,
|
|
2307
2315
|
loaded: i.loaded,
|
|
2308
2316
|
total: i.total,
|
|
2309
|
-
percent:
|
|
2317
|
+
percent: a
|
|
2310
2318
|
});
|
|
2311
2319
|
}, e.onload = () => {
|
|
2312
|
-
const i = e.status >= 200 && e.status < 300,
|
|
2313
|
-
if (!i || !
|
|
2314
|
-
this.known.set(
|
|
2320
|
+
const i = e.status >= 200 && e.status < 300, a = i ? Ka(e.responseText, this.responseKey) : null;
|
|
2321
|
+
if (!i || !a) return this.failed(t, i ? 0 : e.status);
|
|
2322
|
+
this.known.set(a, {
|
|
2315
2323
|
name: t.file.name,
|
|
2316
2324
|
size: t.file.size,
|
|
2317
2325
|
type: t.file.type || void 0,
|
|
2318
|
-
url:
|
|
2319
|
-
}), this.pending = this.pending.filter((r) => r.id !== t.id), this.emitValue(this.multiple ? [...this.urls,
|
|
2326
|
+
url: a
|
|
2327
|
+
}), this.pending = this.pending.filter((r) => r.id !== t.id), this.emitValue(this.multiple ? [...this.urls, a] : [a]);
|
|
2320
2328
|
}, e.onerror = () => this.failed(t, 0);
|
|
2321
|
-
const
|
|
2322
|
-
|
|
2329
|
+
const s = new FormData();
|
|
2330
|
+
s.append(this.fieldName || "file", t.file, t.file.name), e.send(s);
|
|
2323
2331
|
}
|
|
2324
2332
|
failed(t, e) {
|
|
2325
|
-
const
|
|
2326
|
-
this.patch(t.id, { error:
|
|
2333
|
+
const s = u("uploadFailed");
|
|
2334
|
+
this.patch(t.id, { error: s, percent: 0 }), this.emit("baht-upload-error", { file: t.file, status: e, message: s });
|
|
2327
2335
|
}
|
|
2328
2336
|
retry(t) {
|
|
2329
2337
|
this.patch(t.id, { error: null, percent: 0 }), this.send({ ...t, error: null, percent: 0 });
|
|
@@ -2338,7 +2346,7 @@ let S = class extends y {
|
|
|
2338
2346
|
), this.maxSize && t.push(u("uploadMaxSize", { size: ke(this.maxSize) })), t.join(" · ");
|
|
2339
2347
|
}
|
|
2340
2348
|
render() {
|
|
2341
|
-
const t = this.pending.some((c) => !c.error), e = !!this.error,
|
|
2349
|
+
const t = this.pending.some((c) => !c.error), e = !!this.error, s = this.hint || this.defaultHint(), i = s ? `${this.inputId}-hint` : void 0, a = this.error ? `${this.inputId}-error` : void 0, r = [i, a].filter(Boolean).join(" ") || void 0, o = [
|
|
2342
2350
|
"baht-dropzone",
|
|
2343
2351
|
this.dragging ? "baht-dropzone--over" : "",
|
|
2344
2352
|
this.disabled ? "baht-dropzone--disabled" : "",
|
|
@@ -2373,7 +2381,7 @@ let S = class extends y {
|
|
|
2373
2381
|
>
|
|
2374
2382
|
<span class="baht-dropzone-or">${u("orDropHere")}</span>
|
|
2375
2383
|
</span>
|
|
2376
|
-
${
|
|
2384
|
+
${s ? l`<span class="baht-dropzone-hint" id=${L(i)}>${s}</span>` : h}
|
|
2377
2385
|
</div>
|
|
2378
2386
|
|
|
2379
2387
|
${this.pending.length > 0 || this.urls.length > 0 ? l`<ul class="baht-upload-list" aria-live="polite" aria-busy=${t ? "true" : "false"}>
|
|
@@ -2383,13 +2391,13 @@ let S = class extends y {
|
|
|
2383
2391
|
${this.rejectedNames.length > 0 ? l`<p class="baht-error" role="alert">
|
|
2384
2392
|
${u("fileRejectedTooLarge", { names: this.rejectedNames.join(", ") })}
|
|
2385
2393
|
</p>` : h}
|
|
2386
|
-
${this.error ? l`<p class="baht-error" id=${L(
|
|
2394
|
+
${this.error ? l`<p class="baht-error" id=${L(a)} role="alert">${this.error}</p>` : h}
|
|
2387
2395
|
</div>`;
|
|
2388
2396
|
}
|
|
2389
2397
|
renderStored(t) {
|
|
2390
2398
|
const e = this.fileFor(t);
|
|
2391
2399
|
return l`<li class="baht-file-chip baht-file-chip--done">
|
|
2392
|
-
<span class="baht-file-chip-icon" aria-hidden="true">${
|
|
2400
|
+
<span class="baht-file-chip-icon" aria-hidden="true">${T("check")}</span>
|
|
2393
2401
|
<a class="baht-file-name" href=${t} target="_blank" rel="noreferrer"
|
|
2394
2402
|
>${e.name}<span class="baht-visually-hidden"> (${u("opensInNewTab")})</span></a
|
|
2395
2403
|
>
|
|
@@ -2399,9 +2407,9 @@ let S = class extends y {
|
|
|
2399
2407
|
class="baht-file-remove"
|
|
2400
2408
|
aria-label=${u("removeFile")}
|
|
2401
2409
|
title=${u("removeFile")}
|
|
2402
|
-
@click=${() => this.emitValue(this.urls.filter((
|
|
2410
|
+
@click=${() => this.emitValue(this.urls.filter((s) => s !== t))}
|
|
2403
2411
|
>
|
|
2404
|
-
${
|
|
2412
|
+
${T("close")}
|
|
2405
2413
|
</button>`}
|
|
2406
2414
|
</li>`;
|
|
2407
2415
|
}
|
|
@@ -2420,7 +2428,7 @@ let S = class extends y {
|
|
|
2420
2428
|
title=${u("removeFile")}
|
|
2421
2429
|
@click=${() => this.dismiss(t)}
|
|
2422
2430
|
>
|
|
2423
|
-
${
|
|
2431
|
+
${T("close")}
|
|
2424
2432
|
</button>` : l`<span
|
|
2425
2433
|
class="baht-upload-bar"
|
|
2426
2434
|
role="progressbar"
|
|
@@ -2433,69 +2441,69 @@ let S = class extends y {
|
|
|
2433
2441
|
</li>`;
|
|
2434
2442
|
}
|
|
2435
2443
|
};
|
|
2436
|
-
|
|
2444
|
+
I([
|
|
2437
2445
|
n()
|
|
2438
2446
|
], S.prototype, "url", 2);
|
|
2439
|
-
|
|
2447
|
+
I([
|
|
2440
2448
|
n()
|
|
2441
2449
|
], S.prototype, "method", 2);
|
|
2442
|
-
|
|
2450
|
+
I([
|
|
2443
2451
|
n({ attribute: "field-name" })
|
|
2444
2452
|
], S.prototype, "fieldName", 2);
|
|
2445
|
-
|
|
2453
|
+
I([
|
|
2446
2454
|
n({ attribute: "response-key" })
|
|
2447
2455
|
], S.prototype, "responseKey", 2);
|
|
2448
|
-
|
|
2456
|
+
I([
|
|
2449
2457
|
n({ attribute: !1 })
|
|
2450
2458
|
], S.prototype, "headers", 2);
|
|
2451
|
-
|
|
2459
|
+
I([
|
|
2452
2460
|
n({ type: Boolean, attribute: "with-credentials" })
|
|
2453
2461
|
], S.prototype, "withCredentials", 2);
|
|
2454
|
-
|
|
2462
|
+
I([
|
|
2455
2463
|
n({ attribute: !1 })
|
|
2456
2464
|
], S.prototype, "value", 2);
|
|
2457
|
-
|
|
2465
|
+
I([
|
|
2458
2466
|
n()
|
|
2459
2467
|
], S.prototype, "label", 2);
|
|
2460
|
-
|
|
2468
|
+
I([
|
|
2461
2469
|
n()
|
|
2462
2470
|
], S.prototype, "hint", 2);
|
|
2463
|
-
|
|
2471
|
+
I([
|
|
2464
2472
|
n()
|
|
2465
2473
|
], S.prototype, "accept", 2);
|
|
2466
|
-
|
|
2474
|
+
I([
|
|
2467
2475
|
n({ type: Boolean })
|
|
2468
2476
|
], S.prototype, "multiple", 2);
|
|
2469
|
-
|
|
2477
|
+
I([
|
|
2470
2478
|
n({ type: Number, attribute: "max-size" })
|
|
2471
2479
|
], S.prototype, "maxSize", 2);
|
|
2472
|
-
|
|
2480
|
+
I([
|
|
2473
2481
|
n({ type: Boolean })
|
|
2474
2482
|
], S.prototype, "disabled", 2);
|
|
2475
|
-
|
|
2483
|
+
I([
|
|
2476
2484
|
n({ type: Boolean })
|
|
2477
2485
|
], S.prototype, "required", 2);
|
|
2478
|
-
|
|
2486
|
+
I([
|
|
2479
2487
|
n()
|
|
2480
2488
|
], S.prototype, "error", 2);
|
|
2481
|
-
|
|
2489
|
+
I([
|
|
2482
2490
|
v()
|
|
2483
2491
|
], S.prototype, "pending", 2);
|
|
2484
|
-
|
|
2492
|
+
I([
|
|
2485
2493
|
v()
|
|
2486
2494
|
], S.prototype, "rejectedNames", 2);
|
|
2487
|
-
|
|
2495
|
+
I([
|
|
2488
2496
|
v()
|
|
2489
2497
|
], S.prototype, "dragging", 2);
|
|
2490
|
-
S =
|
|
2498
|
+
S = I([
|
|
2491
2499
|
f("baht-upload")
|
|
2492
2500
|
], S);
|
|
2493
|
-
var
|
|
2494
|
-
for (var
|
|
2495
|
-
(o = t[r]) && (
|
|
2496
|
-
return i &&
|
|
2501
|
+
var Ha = Object.defineProperty, Ga = Object.getOwnPropertyDescriptor, vs = (t, e, s, i) => {
|
|
2502
|
+
for (var a = i > 1 ? void 0 : i ? Ga(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2503
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2504
|
+
return i && a && Ha(e, s, a), a;
|
|
2497
2505
|
};
|
|
2498
|
-
let
|
|
2506
|
+
let Be = class extends y {
|
|
2499
2507
|
render() {
|
|
2500
2508
|
if (!this.field) return h;
|
|
2501
2509
|
const t = this.field.variant ?? "body";
|
|
@@ -2504,16 +2512,16 @@ let Ie = class extends y {
|
|
|
2504
2512
|
};
|
|
2505
2513
|
vs([
|
|
2506
2514
|
n({ attribute: !1 })
|
|
2507
|
-
],
|
|
2508
|
-
|
|
2515
|
+
], Be.prototype, "field", 2);
|
|
2516
|
+
Be = vs([
|
|
2509
2517
|
f("baht-text")
|
|
2510
|
-
],
|
|
2511
|
-
var
|
|
2512
|
-
for (var
|
|
2513
|
-
(o = t[r]) && (
|
|
2514
|
-
return i &&
|
|
2518
|
+
], Be);
|
|
2519
|
+
var Wa = Object.defineProperty, Ja = Object.getOwnPropertyDescriptor, $s = (t, e, s, i) => {
|
|
2520
|
+
for (var a = i > 1 ? void 0 : i ? Ja(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2521
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2522
|
+
return i && a && Wa(e, s, a), a;
|
|
2515
2523
|
};
|
|
2516
|
-
let
|
|
2524
|
+
let Te = class extends y {
|
|
2517
2525
|
render() {
|
|
2518
2526
|
return this.field ? l`<div class="baht-section">
|
|
2519
2527
|
<span class="baht-section-label">${this.field.text ?? this.field.label ?? ""}</span>
|
|
@@ -2522,16 +2530,16 @@ let je = class extends y {
|
|
|
2522
2530
|
};
|
|
2523
2531
|
$s([
|
|
2524
2532
|
n({ attribute: !1 })
|
|
2525
|
-
],
|
|
2526
|
-
|
|
2533
|
+
], Te.prototype, "field", 2);
|
|
2534
|
+
Te = $s([
|
|
2527
2535
|
f("baht-section")
|
|
2528
|
-
],
|
|
2529
|
-
var
|
|
2530
|
-
for (var
|
|
2531
|
-
(o = t[r]) && (
|
|
2532
|
-
return i &&
|
|
2536
|
+
], Te);
|
|
2537
|
+
var Xa = Object.defineProperty, Ya = Object.getOwnPropertyDescriptor, fe = (t, e, s, i) => {
|
|
2538
|
+
for (var a = i > 1 ? void 0 : i ? Ya(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2539
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2540
|
+
return i && a && Xa(e, s, a), a;
|
|
2533
2541
|
};
|
|
2534
|
-
let
|
|
2542
|
+
let Ut = class extends y {
|
|
2535
2543
|
constructor() {
|
|
2536
2544
|
super(...arguments), this.total = 0, this.label = "", this.color = "";
|
|
2537
2545
|
}
|
|
@@ -2547,35 +2555,35 @@ let Ht = class extends y {
|
|
|
2547
2555
|
};
|
|
2548
2556
|
fe([
|
|
2549
2557
|
n({ type: Number })
|
|
2550
|
-
],
|
|
2558
|
+
], Ut.prototype, "total", 2);
|
|
2551
2559
|
fe([
|
|
2552
2560
|
n()
|
|
2553
|
-
],
|
|
2561
|
+
], Ut.prototype, "label", 2);
|
|
2554
2562
|
fe([
|
|
2555
2563
|
n()
|
|
2556
|
-
],
|
|
2557
|
-
|
|
2564
|
+
], Ut.prototype, "color", 2);
|
|
2565
|
+
Ut = fe([
|
|
2558
2566
|
f("baht-stat-chart")
|
|
2559
|
-
],
|
|
2560
|
-
var
|
|
2561
|
-
for (var
|
|
2562
|
-
(o = t[r]) && (
|
|
2563
|
-
return
|
|
2567
|
+
], Ut);
|
|
2568
|
+
var Za = Object.defineProperty, Lt = (t, e, s, i) => {
|
|
2569
|
+
for (var a = void 0, r = t.length - 1, o; r >= 0; r--)
|
|
2570
|
+
(o = t[r]) && (a = o(e, s, a) || a);
|
|
2571
|
+
return a && Za(e, s, a), a;
|
|
2564
2572
|
};
|
|
2565
|
-
const
|
|
2573
|
+
const Qa = 10;
|
|
2566
2574
|
function ft(t, e) {
|
|
2567
|
-
return e && t === 0 ? e : `var(--baht-chart-${t %
|
|
2575
|
+
return e && t === 0 ? e : `var(--baht-chart-${t % Qa + 1})`;
|
|
2568
2576
|
}
|
|
2569
2577
|
function as(t, e = 5) {
|
|
2570
2578
|
return `var(--baht-chart-seq-${Math.min(e - 1, Math.max(0, t)) + 1})`;
|
|
2571
2579
|
}
|
|
2572
|
-
function zt(t, e = "number",
|
|
2580
|
+
function zt(t, e = "number", s = "THB") {
|
|
2573
2581
|
if (!Number.isFinite(t)) return "—";
|
|
2574
2582
|
switch (e) {
|
|
2575
2583
|
case "currency":
|
|
2576
2584
|
return new Intl.NumberFormat("en-US", {
|
|
2577
2585
|
style: "currency",
|
|
2578
|
-
currency:
|
|
2586
|
+
currency: s || "THB",
|
|
2579
2587
|
currencyDisplay: "narrowSymbol",
|
|
2580
2588
|
maximumFractionDigits: 0
|
|
2581
2589
|
}).format(t).replace(/THB\s?/, "฿");
|
|
@@ -2593,35 +2601,35 @@ function zt(t, e = "number", a = "THB") {
|
|
|
2593
2601
|
return new Intl.NumberFormat("en-US", { maximumFractionDigits: 0 }).format(t);
|
|
2594
2602
|
}
|
|
2595
2603
|
}
|
|
2596
|
-
function
|
|
2604
|
+
function je(t, e = 4) {
|
|
2597
2605
|
if (!Number.isFinite(t) || t <= 0) return [0, 1];
|
|
2598
|
-
const
|
|
2599
|
-
for (let c = 0; c <= r +
|
|
2606
|
+
const s = t / (Math.max(1, e) + 1), i = 10 ** Math.floor(Math.log10(s)), a = [1, 2, 2.5, 5, 10].map((c) => c * i).find((c) => c >= s - 1e-9) ?? 10 * i, r = Math.ceil(t / a) * a, o = [];
|
|
2607
|
+
for (let c = 0; c <= r + a / 1e3; c += a) o.push(Number(c.toFixed(10)));
|
|
2600
2608
|
return o;
|
|
2601
2609
|
}
|
|
2602
2610
|
function he(t, e) {
|
|
2603
|
-
const [
|
|
2604
|
-
return !Number.isFinite(o) || o === 0 ? () =>
|
|
2611
|
+
const [s, i] = t, [a, r] = e, o = i - s;
|
|
2612
|
+
return !Number.isFinite(o) || o === 0 ? () => a : (c) => a + (c - s) / o * (r - a);
|
|
2605
2613
|
}
|
|
2606
|
-
function
|
|
2614
|
+
function ti(t, e, s = "Other") {
|
|
2607
2615
|
if (t.length <= e) return t;
|
|
2608
|
-
const i = t.slice(0, e - 1),
|
|
2609
|
-
return [...i, { label:
|
|
2616
|
+
const i = t.slice(0, e - 1), a = t.slice(e - 1).reduce((r, o) => r + o.count, 0);
|
|
2617
|
+
return [...i, { label: s, count: a }];
|
|
2610
2618
|
}
|
|
2611
|
-
function me(t, e,
|
|
2619
|
+
function me(t, e, s, i = "View as table") {
|
|
2612
2620
|
return l`<details class="baht-chart-table">
|
|
2613
2621
|
<summary>${i}</summary>
|
|
2614
2622
|
<table>
|
|
2615
2623
|
<caption>${t}</caption>
|
|
2616
2624
|
<thead>
|
|
2617
2625
|
<tr>
|
|
2618
|
-
${e.map((
|
|
2626
|
+
${e.map((a) => l`<th scope="col">${a}</th>`)}
|
|
2619
2627
|
</tr>
|
|
2620
2628
|
</thead>
|
|
2621
2629
|
<tbody>
|
|
2622
|
-
${
|
|
2623
|
-
(
|
|
2624
|
-
${
|
|
2630
|
+
${s.map(
|
|
2631
|
+
(a) => l`<tr>
|
|
2632
|
+
${a.map(
|
|
2625
2633
|
(r, o) => o === 0 ? l`<th scope="row">${r}</th>` : l`<td class="baht-chart-num">${r}</td>`
|
|
2626
2634
|
)}
|
|
2627
2635
|
</tr>`
|
|
@@ -2658,14 +2666,14 @@ class at extends y {
|
|
|
2658
2666
|
* Content is assigned with `textContent`: category and series names are
|
|
2659
2667
|
* untrusted data (interaction.md).
|
|
2660
2668
|
*/
|
|
2661
|
-
showTip(e,
|
|
2669
|
+
showTip(e, s) {
|
|
2662
2670
|
var $;
|
|
2663
2671
|
const i = this.tipEl;
|
|
2664
2672
|
if (!i) return;
|
|
2665
|
-
i.textContent =
|
|
2666
|
-
const
|
|
2667
|
-
if (!
|
|
2668
|
-
const r =
|
|
2673
|
+
i.textContent = s, i.hidden = !1;
|
|
2674
|
+
const a = this.querySelector(".baht-chart");
|
|
2675
|
+
if (!a || typeof a.getBoundingClientRect != "function") return;
|
|
2676
|
+
const r = a.getBoundingClientRect(), o = e;
|
|
2669
2677
|
let c, m;
|
|
2670
2678
|
if (typeof o.clientX == "number" && (o.clientX !== 0 || o.clientY !== 0))
|
|
2671
2679
|
c = o.clientX - r.left, m = o.clientY - r.top;
|
|
@@ -2685,12 +2693,12 @@ class at extends y {
|
|
|
2685
2693
|
return l`<div class="baht-chart-empty">${this.emptyMessage}</div>`;
|
|
2686
2694
|
}
|
|
2687
2695
|
/** Legend rows — only ever rendered for 2+ series (marks-and-anatomy.md). */
|
|
2688
|
-
renderLegend(e,
|
|
2696
|
+
renderLegend(e, s = "rect") {
|
|
2689
2697
|
return e.length < 2 ? h : l`<div class="baht-chart-legend">
|
|
2690
2698
|
${e.map(
|
|
2691
2699
|
(i) => l`<div class="baht-chart-legend-row">
|
|
2692
2700
|
<span
|
|
2693
|
-
class="baht-chart-swatch${
|
|
2701
|
+
class="baht-chart-swatch${s === "line" ? " baht-chart-swatch--line" : ""}"
|
|
2694
2702
|
style="background:${i.color}"
|
|
2695
2703
|
aria-hidden="true"
|
|
2696
2704
|
></span>
|
|
@@ -2718,12 +2726,12 @@ Lt([
|
|
|
2718
2726
|
n()
|
|
2719
2727
|
], at.prototype, "currency");
|
|
2720
2728
|
Lt([
|
|
2721
|
-
|
|
2729
|
+
Bt(".baht-chart-tooltip")
|
|
2722
2730
|
], at.prototype, "tipEl");
|
|
2723
|
-
var
|
|
2724
|
-
for (var
|
|
2725
|
-
(o = t[r]) && (
|
|
2726
|
-
return i &&
|
|
2731
|
+
var ei = Object.defineProperty, si = Object.getOwnPropertyDescriptor, wt = (t, e, s, i) => {
|
|
2732
|
+
for (var a = i > 1 ? void 0 : i ? si(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2733
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2734
|
+
return i && a && ei(e, s, a), a;
|
|
2727
2735
|
};
|
|
2728
2736
|
let ct = class extends y {
|
|
2729
2737
|
constructor() {
|
|
@@ -2732,12 +2740,12 @@ let ct = class extends y {
|
|
|
2732
2740
|
render() {
|
|
2733
2741
|
const t = (this.values ?? []).filter((g) => Number.isFinite(g));
|
|
2734
2742
|
if (t.length < 2) return h;
|
|
2735
|
-
const e = Math.max(16, this.width),
|
|
2743
|
+
const e = Math.max(16, this.width), s = Math.max(8, this.height), i = 3, a = Math.min(...t), r = Math.max(...t), o = he([0, t.length - 1], [i, e - i]), c = he([a, r === a ? a + 1 : r], [s - i, i]), m = t.map((g, b) => `${o(b).toFixed(2)},${c(g).toFixed(2)}`).join(" "), $ = o(t.length - 1), _ = c(t[t.length - 1]), p = this.color || "var(--baht-chart-muted)", C = this.label || `Trend of ${t.length} points`;
|
|
2736
2744
|
return l`<svg
|
|
2737
2745
|
class="baht-sparkline"
|
|
2738
2746
|
width=${e}
|
|
2739
|
-
height=${
|
|
2740
|
-
viewBox="0 0 ${e} ${
|
|
2747
|
+
height=${s}
|
|
2748
|
+
viewBox="0 0 ${e} ${s}"
|
|
2741
2749
|
role="img"
|
|
2742
2750
|
aria-label=${C}
|
|
2743
2751
|
>
|
|
@@ -2768,10 +2776,10 @@ wt([
|
|
|
2768
2776
|
ct = wt([
|
|
2769
2777
|
f("baht-sparkline")
|
|
2770
2778
|
], ct);
|
|
2771
|
-
var
|
|
2772
|
-
for (var
|
|
2773
|
-
(o = t[r]) && (
|
|
2774
|
-
return i &&
|
|
2779
|
+
var ai = Object.defineProperty, ii = Object.getOwnPropertyDescriptor, Y = (t, e, s, i) => {
|
|
2780
|
+
for (var a = i > 1 ? void 0 : i ? ii(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2781
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2782
|
+
return i && a && ai(e, s, a), a;
|
|
2775
2783
|
};
|
|
2776
2784
|
let W = class extends y {
|
|
2777
2785
|
constructor() {
|
|
@@ -2791,17 +2799,17 @@ let W = class extends y {
|
|
|
2791
2799
|
return this.deltaKind === "pct" ? `${zt(e / 100, "percent")}` : zt(e, this.format, this.currency);
|
|
2792
2800
|
}
|
|
2793
2801
|
render() {
|
|
2794
|
-
const t = this.delta != null && Number.isFinite(this.delta), e = this.tone,
|
|
2802
|
+
const t = this.delta != null && Number.isFinite(this.delta), e = this.tone, s = (this.delta ?? 0) > 0 ? "up" : (this.delta ?? 0) < 0 ? "down" : "flat";
|
|
2795
2803
|
return l`<div class="baht-stat${this.size === "hero" ? " baht-stat--hero" : ""}">
|
|
2796
2804
|
${this.label ? l`<div class="baht-stat-label-row">
|
|
2797
|
-
${this.icon && us(this.icon) ? l`<span class="baht-stat-icon">${
|
|
2805
|
+
${this.icon && us(this.icon) ? l`<span class="baht-stat-icon">${T(this.icon)}</span>` : h}
|
|
2798
2806
|
<span class="baht-stat-label">${this.label}</span>
|
|
2799
2807
|
</div>` : h}
|
|
2800
2808
|
<div class="baht-stat-value">${zt(this.value, this.format, this.currency)}</div>
|
|
2801
2809
|
${t ? l`<div class="baht-stat-delta baht-stat-delta--${e}">
|
|
2802
2810
|
<span class="baht-stat-arrow" aria-hidden="true">${this.arrow}</span>
|
|
2803
2811
|
<span class="baht-stat-delta-value">${this.deltaText}</span>
|
|
2804
|
-
<span class="baht-visually-hidden">${
|
|
2812
|
+
<span class="baht-visually-hidden">${s}</span>
|
|
2805
2813
|
${this.deltaLabel ? l`<span class="baht-stat-delta-label">${this.deltaLabel}</span>` : h}
|
|
2806
2814
|
</div>` : h}
|
|
2807
2815
|
${!t && this.deltaLabel ? l`<div class="baht-stat-caption">${this.deltaLabel}</div>` : h}
|
|
@@ -2849,10 +2857,10 @@ Y([
|
|
|
2849
2857
|
W = Y([
|
|
2850
2858
|
f("baht-stat")
|
|
2851
2859
|
], W);
|
|
2852
|
-
var
|
|
2853
|
-
for (var
|
|
2854
|
-
(o = t[r]) && (
|
|
2855
|
-
return i &&
|
|
2860
|
+
var ri = Object.defineProperty, oi = Object.getOwnPropertyDescriptor, Nt = (t, e, s, i) => {
|
|
2861
|
+
for (var a = i > 1 ? void 0 : i ? oi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2862
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2863
|
+
return i && a && ri(e, s, a), a;
|
|
2856
2864
|
};
|
|
2857
2865
|
const is = 6;
|
|
2858
2866
|
let Q = class extends at {
|
|
@@ -2863,10 +2871,10 @@ let Q = class extends at {
|
|
|
2863
2871
|
const t = this.hold(this.groups ?? []);
|
|
2864
2872
|
if (t.length === 0)
|
|
2865
2873
|
return l`<div class=${this.rootClass("baht-donut-chart")}>${this.renderEmpty()}</div>`;
|
|
2866
|
-
const e =
|
|
2874
|
+
const e = ti(t, is, this.otherLabel), s = e.reduce((p, C) => p + C.count, 0) || 1, i = this.total ?? t.reduce((p, C) => p + C.count, 0), a = Q.R, r = 2 * Math.PI * a, o = e.length > 1 ? Q.GAP : 0, c = t.length > is;
|
|
2867
2875
|
let m = 0;
|
|
2868
2876
|
const $ = e.map((p, C) => {
|
|
2869
|
-
const g = p.count /
|
|
2877
|
+
const g = p.count / s, b = Math.max(0, g * r - o), w = {
|
|
2870
2878
|
...p,
|
|
2871
2879
|
frac: g,
|
|
2872
2880
|
dash: `${b} ${r - b}`,
|
|
@@ -2880,7 +2888,7 @@ let Q = class extends at {
|
|
|
2880
2888
|
<svg width="160" height="160" viewBox="0 0 160 160" role="img" aria-label=${_}>
|
|
2881
2889
|
<g transform="translate(80,80) rotate(-90)">
|
|
2882
2890
|
${$.map(
|
|
2883
|
-
(p) => R`<circle r=${
|
|
2891
|
+
(p) => R`<circle r=${a} cx="0" cy="0" fill="none" stroke=${p.color}
|
|
2884
2892
|
stroke-width="22" stroke-dasharray=${p.dash} stroke-dashoffset=${p.offset}/>`
|
|
2885
2893
|
)}
|
|
2886
2894
|
</g>
|
|
@@ -2929,36 +2937,36 @@ Nt([
|
|
|
2929
2937
|
Q = Nt([
|
|
2930
2938
|
f("baht-donut-chart")
|
|
2931
2939
|
], Q);
|
|
2932
|
-
var
|
|
2933
|
-
for (var
|
|
2934
|
-
(o = t[r]) && (
|
|
2935
|
-
return i &&
|
|
2940
|
+
var li = Object.defineProperty, ni = Object.getOwnPropertyDescriptor, G = (t, e, s, i) => {
|
|
2941
|
+
for (var a = i > 1 ? void 0 : i ? ni(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
2942
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
2943
|
+
return i && a && li(e, s, a), a;
|
|
2936
2944
|
};
|
|
2937
|
-
const rs = 24, os = 2,
|
|
2945
|
+
const rs = 24, os = 2, hi = 56, ci = 26;
|
|
2938
2946
|
let K = class extends at {
|
|
2939
2947
|
constructor() {
|
|
2940
2948
|
super(...arguments), this.groups = [], this.series = [], this.categories = [], this.orientation = "horizontal", this.stacked = !1, this.compare = [], this.compareLabel = "Previous period", this.markers = [], this.labelValues = "ends", this.emphasis = null, this.color = "", this.label = "", this.band = 0;
|
|
2941
2949
|
}
|
|
2942
2950
|
connectedCallback() {
|
|
2943
|
-
super.connectedCallback(), !(!
|
|
2951
|
+
super.connectedCallback(), !(!j() || typeof ResizeObserver > "u") && (this.resizeObserver = new ResizeObserver(() => this.measure()), this.resizeObserver.observe(this));
|
|
2944
2952
|
}
|
|
2945
2953
|
disconnectedCallback() {
|
|
2946
2954
|
var t;
|
|
2947
2955
|
(t = this.resizeObserver) == null || t.disconnect(), this.resizeObserver = void 0, super.disconnectedCallback();
|
|
2948
2956
|
}
|
|
2949
2957
|
firstUpdated() {
|
|
2950
|
-
|
|
2958
|
+
j() && queueMicrotask(() => this.measure());
|
|
2951
2959
|
}
|
|
2952
2960
|
/** Host width → px per category. Never runs on the server (`hasDom` guard). */
|
|
2953
2961
|
measure() {
|
|
2954
2962
|
var r;
|
|
2955
|
-
if (!
|
|
2963
|
+
if (!j() || !this.isConnected || this.orientation !== "vertical") return;
|
|
2956
2964
|
const t = this.columnCount;
|
|
2957
2965
|
if (t === 0) return;
|
|
2958
2966
|
const e = ((r = this.getBoundingClientRect) == null ? void 0 : r.call(this).width) ?? 0;
|
|
2959
2967
|
if (!e) return;
|
|
2960
|
-
const i = (Math.max(0, e -
|
|
2961
|
-
Math.abs(
|
|
2968
|
+
const i = (Math.max(0, e - hi) - os * (t - 1)) / t, a = i > 0 ? Math.floor(i * 100) / 100 : 0;
|
|
2969
|
+
Math.abs(a - this.band) > 0.01 && (this.band = a);
|
|
2962
2970
|
}
|
|
2963
2971
|
get columnCount() {
|
|
2964
2972
|
const t = this.model.series;
|
|
@@ -2971,40 +2979,40 @@ let K = class extends at {
|
|
|
2971
2979
|
return { series: this.series, categories: this.categories ?? [], legacy: !1 };
|
|
2972
2980
|
const t = this.groups ?? [];
|
|
2973
2981
|
return {
|
|
2974
|
-
series: t.length ? [{ name: this.label || "Value", values: t.map((
|
|
2975
|
-
categories: t.map((
|
|
2982
|
+
series: t.length ? [{ name: this.label || "Value", values: t.map((s) => s.count) }] : [],
|
|
2983
|
+
categories: t.map((s) => s.label),
|
|
2976
2984
|
legacy: !0
|
|
2977
2985
|
};
|
|
2978
2986
|
}
|
|
2979
|
-
colorFor(t, e,
|
|
2987
|
+
colorFor(t, e, s) {
|
|
2980
2988
|
const i = this.model.series[t];
|
|
2981
|
-
return this.emphasis != null && !(
|
|
2989
|
+
return this.emphasis != null && !(s ? t === this.emphasis : e === this.emphasis) ? "var(--baht-chart-muted)" : ft(s ? t : 0, this.color || (i == null ? void 0 : i.color) || void 0);
|
|
2982
2990
|
}
|
|
2983
2991
|
render() {
|
|
2984
2992
|
const t = this.hold(this.model);
|
|
2985
2993
|
return t.series.length === 0 ? l`<div class=${this.rootClass("baht-bar-chart")}>${this.renderEmpty()}</div>` : this.orientation === "vertical" ? this.renderVertical(t) : this.renderHorizontal(t);
|
|
2986
2994
|
}
|
|
2987
2995
|
/** Largest value a bar can reach: the raw max for `groups`, a clean tick otherwise. */
|
|
2988
|
-
domainMax(t, e,
|
|
2989
|
-
const i = Math.max(...t.map((c) => c.values.length)),
|
|
2996
|
+
domainMax(t, e, s) {
|
|
2997
|
+
const i = Math.max(...t.map((c) => c.values.length)), a = Array.from(
|
|
2990
2998
|
{ length: i },
|
|
2991
2999
|
(c, m) => e ? t.reduce(($, _) => $ + (_.values[m] ?? 0), 0) : Math.max(...t.map(($) => $.values[m] ?? 0))
|
|
2992
3000
|
), r = Math.max(
|
|
2993
3001
|
1,
|
|
2994
|
-
...
|
|
3002
|
+
...a,
|
|
2995
3003
|
...this.compare ?? [],
|
|
2996
3004
|
...(this.markers ?? []).map((c) => c.value)
|
|
2997
3005
|
);
|
|
2998
|
-
if (
|
|
2999
|
-
const o =
|
|
3006
|
+
if (s) return r;
|
|
3007
|
+
const o = je(r, 4);
|
|
3000
3008
|
return o[o.length - 1] ?? r;
|
|
3001
3009
|
}
|
|
3002
|
-
tableTwin(t, e,
|
|
3010
|
+
tableTwin(t, e, s) {
|
|
3003
3011
|
var r;
|
|
3004
3012
|
if (!this.showTable) return h;
|
|
3005
3013
|
const i = ["Category", ...t.map((o) => o.name || "Value")];
|
|
3006
3014
|
(r = this.compare) != null && r.length && i.push(this.compareLabel);
|
|
3007
|
-
const
|
|
3015
|
+
const a = Array.from({ length: s }, (o, c) => {
|
|
3008
3016
|
var $;
|
|
3009
3017
|
const m = [
|
|
3010
3018
|
e[c] || "(empty)",
|
|
@@ -3013,12 +3021,12 @@ let K = class extends at {
|
|
|
3013
3021
|
return ($ = this.compare) != null && $.length && m.push(this.fmt(this.compare[c] ?? 0)), m;
|
|
3014
3022
|
});
|
|
3015
3023
|
for (const o of this.markers ?? [])
|
|
3016
|
-
|
|
3024
|
+
a.push([
|
|
3017
3025
|
`${o.label ?? "Target"}${o.category ? ` (${o.category})` : ""}`,
|
|
3018
3026
|
this.fmt(o.value),
|
|
3019
3027
|
...Array.from({ length: i.length - 2 }, () => "—")
|
|
3020
3028
|
]);
|
|
3021
|
-
return me(this.label || "Bar chart data", i,
|
|
3029
|
+
return me(this.label || "Bar chart data", i, a);
|
|
3022
3030
|
}
|
|
3023
3031
|
/** Markers with no `category` span the chart; the rest ride their own row. */
|
|
3024
3032
|
markersFor(t) {
|
|
@@ -3042,9 +3050,9 @@ let K = class extends at {
|
|
|
3042
3050
|
*/
|
|
3043
3051
|
markerOverlay(t, e) {
|
|
3044
3052
|
return this.markersFor(e).map(
|
|
3045
|
-
(
|
|
3053
|
+
(s) => l`<span
|
|
3046
3054
|
class="baht-bar-chart-marker"
|
|
3047
|
-
style=${`left:${Math.min(100,
|
|
3055
|
+
style=${`left:${Math.min(100, s.value / t * 100).toFixed(2)}%`}
|
|
3048
3056
|
aria-hidden="true"
|
|
3049
3057
|
></span>`
|
|
3050
3058
|
);
|
|
@@ -3056,12 +3064,12 @@ let K = class extends at {
|
|
|
3056
3064
|
* each other, a row's own markers only with that row's.
|
|
3057
3065
|
*/
|
|
3058
3066
|
place(t, e) {
|
|
3059
|
-
const
|
|
3060
|
-
for (const
|
|
3061
|
-
const r = Math.min(100, Math.max(0,
|
|
3062
|
-
o && r - o.pct < 12 ||
|
|
3067
|
+
const s = [], i = [...t].sort((a, r) => a.value - r.value);
|
|
3068
|
+
for (const a of i) {
|
|
3069
|
+
const r = Math.min(100, Math.max(0, a.value / e * 100)), o = s[s.length - 1];
|
|
3070
|
+
o && r - o.pct < 12 || s.push({ m: a, pct: r });
|
|
3063
3071
|
}
|
|
3064
|
-
return
|
|
3072
|
+
return s;
|
|
3065
3073
|
}
|
|
3066
3074
|
/** Chart-wide marker labels — the strip above the rows / the end of the line. */
|
|
3067
3075
|
placedMarkers(t) {
|
|
@@ -3070,26 +3078,26 @@ let K = class extends at {
|
|
|
3070
3078
|
/** A row's own marker labels, drawn beside their line inside that row. */
|
|
3071
3079
|
rowMarkerLabels(t, e) {
|
|
3072
3080
|
return this.place(this.categoryMarkers(t), e).map(
|
|
3073
|
-
({ m:
|
|
3081
|
+
({ m: s, pct: i }) => l`<span
|
|
3074
3082
|
class="baht-bar-chart-marker-label baht-bar-chart-marker-label--row"
|
|
3075
3083
|
style=${`left:${i.toFixed(2)}%;transform:translateX(${i > 70 ? "calc(-100% - 4px)" : "4px"})`}
|
|
3076
|
-
>${this.markerText(
|
|
3084
|
+
>${this.markerText(s)}</span
|
|
3077
3085
|
>`
|
|
3078
3086
|
);
|
|
3079
3087
|
}
|
|
3080
3088
|
/** Legend rows: one per series, plus the muted `compare` key when it is set. */
|
|
3081
3089
|
legendEntries(t) {
|
|
3082
|
-
const e = t.map((
|
|
3083
|
-
label:
|
|
3084
|
-
color: ft(i,
|
|
3090
|
+
const e = t.map((s, i) => ({
|
|
3091
|
+
label: s.name || "Value",
|
|
3092
|
+
color: ft(i, s.color)
|
|
3085
3093
|
}));
|
|
3086
3094
|
return (this.compare ?? []).length > 0 && e.push({ label: this.compareLabel, color: "var(--baht-chart-muted)" }), e;
|
|
3087
3095
|
}
|
|
3088
3096
|
renderHorizontal(t) {
|
|
3089
|
-
const { series: e, categories:
|
|
3090
|
-
const b =
|
|
3097
|
+
const { series: e, categories: s, legacy: i } = t, a = e.length > 1, r = Math.max(...e.map((C) => C.values.length)), o = this.domainMax(e, this.stacked, i), c = (this.compare ?? []).length > 0, m = (this.stacked ? 1 : e.length) + (c ? 1 : 0), $ = Math.min(rs, Math.max(6, Math.floor(48 / m))), _ = Array.from({ length: r }, (C, g) => {
|
|
3098
|
+
const b = s[g] || "(empty)", w = e.reduce((D, E) => D + (E.values[g] ?? 0), 0), P = `${b}: ${e.map((D) => `${D.name ? `${D.name} ` : ""}${this.fmt(D.values[g] ?? 0)}`).join(", ")}${c ? `, previous ${this.fmt(this.compare[g] ?? 0)}` : ""}`, H = e.map((D, E) => ({
|
|
3091
3099
|
value: D.values[g] ?? 0,
|
|
3092
|
-
color: this.colorFor(E, g,
|
|
3100
|
+
color: this.colorFor(E, g, a),
|
|
3093
3101
|
name: D.name
|
|
3094
3102
|
}));
|
|
3095
3103
|
return l`<div class="baht-bar-chart-row">
|
|
@@ -3148,13 +3156,13 @@ let K = class extends at {
|
|
|
3148
3156
|
${_}
|
|
3149
3157
|
${this.renderTooltip()}
|
|
3150
3158
|
${this.renderLegend(this.legendEntries(e))}
|
|
3151
|
-
${this.tableTwin(e,
|
|
3159
|
+
${this.tableTwin(e, s, r)}
|
|
3152
3160
|
</div>`;
|
|
3153
3161
|
}
|
|
3154
3162
|
renderVertical(t) {
|
|
3155
|
-
const { series: e, categories:
|
|
3163
|
+
const { series: e, categories: s, legacy: i } = t, a = e.length > 1, r = Math.max(...e.map((w) => w.values.length)), o = this.domainMax(e, this.stacked, i), c = je(o, 4), m = (this.compare ?? []).length > 0, $ = (this.stacked ? 1 : e.length) + (m ? 1 : 0), _ = this.band > 0 ? (this.band - os) / $ : 48 / $, p = Math.min(rs, Math.max(2, Math.floor(_))), C = this.band > 0 ? Math.max(1, Math.ceil(ci / Math.max(1, this.band))) : Math.max(1, Math.ceil(r / 12)), g = (this.markers ?? []).map(
|
|
3156
3164
|
(w) => `${this.markerText(w)}${w.category ? ` on ${w.category}` : ""}`
|
|
3157
|
-
), b = this.label || `Column chart, ${r} categories. ${
|
|
3165
|
+
), b = this.label || `Column chart, ${r} categories. ${s.map((w, P) => `${w} ${this.fmt(e[0].values[P] ?? 0)}`).join(", ")}${g.length ? `. Reference lines: ${g.join(", ")}` : ""}`;
|
|
3158
3166
|
return l`<div class=${this.rootClass("baht-bar-chart baht-bar-chart--vertical")}>
|
|
3159
3167
|
<div class="baht-bar-chart-plot" role="img" aria-label=${b}>
|
|
3160
3168
|
<div class="baht-bar-chart-yaxis" aria-hidden="true">
|
|
@@ -3178,7 +3186,7 @@ let K = class extends at {
|
|
|
3178
3186
|
${[...c].reverse().map(() => l`<span class="baht-chart-grid-rule" aria-hidden="true"></span>`)}
|
|
3179
3187
|
<div class="baht-bar-chart-columns">
|
|
3180
3188
|
${Array.from({ length: r }, (w, P) => {
|
|
3181
|
-
const H =
|
|
3189
|
+
const H = s[P] || "(empty)", D = `${H}: ${e.map((E) => `${E.name ? `${E.name} ` : ""}${this.fmt(E.values[P] ?? 0)}`).join(", ")}`;
|
|
3182
3190
|
return l`<div
|
|
3183
3191
|
class="baht-bar-chart-column"
|
|
3184
3192
|
style=${this.band > 0 ? `flex:0 0 auto;width:${this.band}px` : h}
|
|
@@ -3205,7 +3213,7 @@ let K = class extends at {
|
|
|
3205
3213
|
${e.map(
|
|
3206
3214
|
(E, d) => l`<div
|
|
3207
3215
|
class="baht-bar-chart-col"
|
|
3208
|
-
style=${`height:${Math.max(1, (E.values[P] ?? 0) / o * 100)}%;width:${p}px;background:${this.colorFor(d, P,
|
|
3216
|
+
style=${`height:${Math.max(1, (E.values[P] ?? 0) / o * 100)}%;width:${p}px;background:${this.colorFor(d, P, a)}`}
|
|
3209
3217
|
></div>`
|
|
3210
3218
|
)}
|
|
3211
3219
|
${m ? l`<div
|
|
@@ -3221,7 +3229,7 @@ let K = class extends at {
|
|
|
3221
3229
|
</div>
|
|
3222
3230
|
${this.renderTooltip()}
|
|
3223
3231
|
${this.renderLegend(this.legendEntries(e))}
|
|
3224
|
-
${this.tableTwin(e,
|
|
3232
|
+
${this.tableTwin(e, s, r)}
|
|
3225
3233
|
</div>`;
|
|
3226
3234
|
}
|
|
3227
3235
|
};
|
|
@@ -3267,10 +3275,10 @@ G([
|
|
|
3267
3275
|
K = G([
|
|
3268
3276
|
f("baht-bar-chart")
|
|
3269
3277
|
], K);
|
|
3270
|
-
var
|
|
3271
|
-
for (var
|
|
3272
|
-
(o = t[r]) && (
|
|
3273
|
-
return i &&
|
|
3278
|
+
var pi = Object.defineProperty, di = Object.getOwnPropertyDescriptor, nt = (t, e, s, i) => {
|
|
3279
|
+
for (var a = i > 1 ? void 0 : i ? di(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3280
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3281
|
+
return i && a && pi(e, s, a), a;
|
|
3274
3282
|
};
|
|
3275
3283
|
const ls = 640, Oe = 260, M = { top: 14, right: 72, bottom: 30, left: 60 };
|
|
3276
3284
|
let st = class extends at {
|
|
@@ -3287,10 +3295,10 @@ let st = class extends at {
|
|
|
3287
3295
|
return d && ((k = d.values) == null ? void 0 : k.length);
|
|
3288
3296
|
}),
|
|
3289
3297
|
categories: this.categories ?? []
|
|
3290
|
-
}), { series: e, categories:
|
|
3298
|
+
}), { series: e, categories: s } = t;
|
|
3291
3299
|
if (e.length === 0)
|
|
3292
3300
|
return l`<div class=${this.rootClass("baht-line-chart")}>${this.renderEmpty()}</div>`;
|
|
3293
|
-
const i = Math.max(...e.map((d) => d.values.length)),
|
|
3301
|
+
const i = Math.max(...e.map((d) => d.values.length)), a = e.flatMap((d) => d.values).filter((d) => Number.isFinite(d)), r = Math.max(0, ...a, ...(this.markers ?? []).map((d) => d.value)), o = je(r, 4), c = o[o.length - 1] ?? 1, { w: m, h: $ } = this.plot, _ = he([0, Math.max(1, i - 1)], [M.left, M.left + m]), p = he([0, c], [M.top + $, M.top]), C = Math.max(0, i - 1 - Math.max(0, this.forecast)), g = (d, k, et) => d.slice(k, et + 1).map((it, rt) => `${rt === 0 ? "M" : "L"}${_(k + rt).toFixed(2)},${p(it).toFixed(2)}`).join(" "), b = e.map((d, k) => ({
|
|
3294
3302
|
i: k,
|
|
3295
3303
|
name: d.name,
|
|
3296
3304
|
value: d.values[d.values.length - 1] ?? 0,
|
|
@@ -3342,11 +3350,11 @@ let st = class extends at {
|
|
|
3342
3350
|
<text class="baht-chart-end-label" x=${_(i - 1) + 10} y=${(d.yPos + 4).toFixed(2)}
|
|
3343
3351
|
text-anchor="start">${this.fmt(d.value)}</text>`
|
|
3344
3352
|
) : h}
|
|
3345
|
-
${
|
|
3353
|
+
${s.map(
|
|
3346
3354
|
(d, k) => k % D === 0 ? R`<text class="baht-chart-tick" x=${_(k).toFixed(2)} y=${Oe - 10} text-anchor="middle">${d}</text>` : h
|
|
3347
3355
|
)}
|
|
3348
3356
|
${Array.from({ length: i }, (d, k) => {
|
|
3349
|
-
const et = m / Math.max(1, i - 1), it = `${
|
|
3357
|
+
const et = m / Math.max(1, i - 1), it = `${s[k] ?? `Point ${k + 1}`}: ${e.map((rt) => `${rt.name} ${this.fmt(rt.values[k] ?? 0)}`).join(", ")}`;
|
|
3350
3358
|
return R`<rect class="baht-chart-hit" x=${(_(k) - et / 2).toFixed(2)} y=${M.top}
|
|
3351
3359
|
width=${Math.max(24, et).toFixed(2)} height=${$} tabindex="0" role="button"
|
|
3352
3360
|
aria-label=${it}
|
|
@@ -3367,14 +3375,14 @@ let st = class extends at {
|
|
|
3367
3375
|
this.label || "Line chart data",
|
|
3368
3376
|
["Point", ...e.map((d) => d.name)],
|
|
3369
3377
|
Array.from({ length: i }, (d, k) => [
|
|
3370
|
-
|
|
3378
|
+
s[k] ?? `Point ${k + 1}`,
|
|
3371
3379
|
...e.map((et) => this.fmt(et.values[k] ?? 0))
|
|
3372
3380
|
])
|
|
3373
3381
|
) : h}
|
|
3374
3382
|
</div>`;
|
|
3375
3383
|
}
|
|
3376
|
-
onHover(t, e,
|
|
3377
|
-
this.crosshairAt = e, this.requestUpdate(), this.showTip(t,
|
|
3384
|
+
onHover(t, e, s) {
|
|
3385
|
+
this.crosshairAt = e, this.requestUpdate(), this.showTip(t, s);
|
|
3378
3386
|
}
|
|
3379
3387
|
onLeave() {
|
|
3380
3388
|
this.crosshairAt = null, this.requestUpdate(), this.hideTip();
|
|
@@ -3407,12 +3415,12 @@ nt([
|
|
|
3407
3415
|
st = nt([
|
|
3408
3416
|
f("baht-line-chart")
|
|
3409
3417
|
], st);
|
|
3410
|
-
var
|
|
3411
|
-
for (var
|
|
3412
|
-
(o = t[r]) && (
|
|
3413
|
-
return i &&
|
|
3418
|
+
var ui = Object.defineProperty, bi = Object.getOwnPropertyDescriptor, xt = (t, e, s, i) => {
|
|
3419
|
+
for (var a = i > 1 ? void 0 : i ? bi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3420
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3421
|
+
return i && a && ui(e, s, a), a;
|
|
3414
3422
|
};
|
|
3415
|
-
const Pe = 22, Rt = 24, ns = 34, Ce = 18,
|
|
3423
|
+
const Pe = 22, Rt = 24, ns = 34, Ce = 18, fi = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
|
|
3416
3424
|
function De(t) {
|
|
3417
3425
|
const e = /^(\d{4})-(\d{2})-(\d{2})/.exec(t ?? "");
|
|
3418
3426
|
return e ? new Date(Date.UTC(+e[1], +e[2] - 1, +e[3])) : null;
|
|
@@ -3425,18 +3433,18 @@ let pt = class extends at {
|
|
|
3425
3433
|
super(...arguments), this.values = [], this.from = "", this.to = "", this.lessLabel = "Less", this.moreLabel = "More", this.label = "";
|
|
3426
3434
|
}
|
|
3427
3435
|
get range() {
|
|
3428
|
-
const t = (this.values ?? []).map((i) => De(i.date)).filter((i) => !!i), e = De(this.from) ?? (t.length ? new Date(Math.min(...t.map((i) => +i))) : null),
|
|
3429
|
-
return !e || !
|
|
3436
|
+
const t = (this.values ?? []).map((i) => De(i.date)).filter((i) => !!i), e = De(this.from) ?? (t.length ? new Date(Math.min(...t.map((i) => +i))) : null), s = De(this.to) ?? (t.length ? new Date(Math.max(...t.map((i) => +i))) : null);
|
|
3437
|
+
return !e || !s || +s < +e ? null : { start: e, end: s };
|
|
3430
3438
|
}
|
|
3431
3439
|
render() {
|
|
3432
3440
|
const t = this.hold({ values: this.values ?? [], range: this.range }), e = t.range;
|
|
3433
3441
|
if (!e || t.values.length === 0)
|
|
3434
3442
|
return l`<div class=${this.rootClass("baht-heatmap")}>${this.renderEmpty()}</div>`;
|
|
3435
|
-
const
|
|
3443
|
+
const s = new Map(t.values.map((b) => [b.date.slice(0, 10), b.value])), i = [], a = new Date(e.start), r = (e.start.getUTCDay() + 6) % 7;
|
|
3436
3444
|
let o = 0;
|
|
3437
|
-
for (; +
|
|
3438
|
-
const b = Se(
|
|
3439
|
-
i.push({ iso: b, value:
|
|
3445
|
+
for (; +a <= +e.end; ) {
|
|
3446
|
+
const b = Se(a), w = (a.getUTCDay() + 6) % 7, P = Math.floor((r + o) / 7);
|
|
3447
|
+
i.push({ iso: b, value: s.has(b) ? s.get(b) : null, col: P, row: w }), a.setUTCDate(a.getUTCDate() + 1), o += 1;
|
|
3440
3448
|
}
|
|
3441
3449
|
const c = Math.max(1, ...i.map((b) => b.col + 1)), m = ns + c * Rt, $ = Ce + 7 * Rt + 4, _ = Math.max(1, ...i.map((b) => b.value ?? 0)), p = (b) => Math.min(4, Math.max(0, Math.ceil(b / _ * 5) - 1)), C = i.reduce((b, w) => b + (w.value ?? 0), 0), g = this.label || `Calendar heatmap, ${i.length} days from ${Se(e.start)} to ${Se(e.end)}, total ${this.fmt(C)}`;
|
|
3442
3450
|
return l`<div class=${this.rootClass("baht-heatmap")}>
|
|
@@ -3449,7 +3457,7 @@ let pt = class extends at {
|
|
|
3449
3457
|
role="img"
|
|
3450
3458
|
aria-label=${g}
|
|
3451
3459
|
>
|
|
3452
|
-
${
|
|
3460
|
+
${fi.map(
|
|
3453
3461
|
(b, w) => w % 2 === 0 ? R`<text class="baht-chart-tick" x="0" y=${Ce + w * Rt + Pe / 2 + 4}>${b}</text>` : h
|
|
3454
3462
|
)}
|
|
3455
3463
|
${i.map((b) => {
|
|
@@ -3503,10 +3511,10 @@ xt([
|
|
|
3503
3511
|
pt = xt([
|
|
3504
3512
|
f("baht-heatmap")
|
|
3505
3513
|
], pt);
|
|
3506
|
-
var
|
|
3507
|
-
for (var
|
|
3508
|
-
(o = t[r]) && (
|
|
3509
|
-
return i &&
|
|
3514
|
+
var mi = Object.defineProperty, vi = Object.getOwnPropertyDescriptor, tt = (t, e, s, i) => {
|
|
3515
|
+
for (var a = i > 1 ? void 0 : i ? vi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3516
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3517
|
+
return i && a && mi(e, s, a), a;
|
|
3510
3518
|
};
|
|
3511
3519
|
let J = class extends y {
|
|
3512
3520
|
constructor() {
|
|
@@ -3523,8 +3531,8 @@ let J = class extends y {
|
|
|
3523
3531
|
* `warning` stays inclusive (`>=`).
|
|
3524
3532
|
*/
|
|
3525
3533
|
get severity() {
|
|
3526
|
-
const { warning: t, danger: e } = this.thresholds ?? { warning: 0.8, danger: 1 },
|
|
3527
|
-
return
|
|
3534
|
+
const { warning: t, danger: e } = this.thresholds ?? { warning: 0.8, danger: 1 }, s = this.fraction;
|
|
3535
|
+
return s > e ? "danger" : s >= t ? "warning" : "ok";
|
|
3528
3536
|
}
|
|
3529
3537
|
get statusText() {
|
|
3530
3538
|
const { danger: t } = this.thresholds ?? { danger: 1 }, e = this.severity;
|
|
@@ -3532,11 +3540,11 @@ let J = class extends y {
|
|
|
3532
3540
|
}
|
|
3533
3541
|
render() {
|
|
3534
3542
|
var c;
|
|
3535
|
-
const t = this.severity, e = Math.min(100, this.fraction * 100),
|
|
3543
|
+
const t = this.severity, e = Math.min(100, this.fraction * 100), s = (m) => zt(m, this.format, this.currency), i = this.expected != null && Number.isFinite(this.expected) && this.max ? Math.min(100, Math.max(0, this.expected / this.max * 100)) : null, a = `${s(this.value)} of ${s(this.max)}`, r = t === "warning" && this.fraction >= (((c = this.thresholds) == null ? void 0 : c.danger) ?? 1), o = t === "danger" ? "!" : r ? "=" : t === "warning" ? "△" : "";
|
|
3536
3544
|
return l`<div class="baht-meter baht-meter--${t}">
|
|
3537
3545
|
<div class="baht-meter-head">
|
|
3538
3546
|
${this.label ? l`<span class="baht-meter-label">${this.label}</span>` : h}
|
|
3539
|
-
<span class="baht-meter-value">${
|
|
3547
|
+
<span class="baht-meter-value">${a}</span>
|
|
3540
3548
|
${this.statusText ? l`<span class="baht-meter-status"
|
|
3541
3549
|
><span class="baht-meter-icon" aria-hidden="true">${o}</span
|
|
3542
3550
|
>${this.statusText}</span
|
|
@@ -3549,7 +3557,7 @@ let J = class extends y {
|
|
|
3549
3557
|
aria-valuemin="0"
|
|
3550
3558
|
aria-valuemax=${this.max}
|
|
3551
3559
|
aria-valuenow=${this.value}
|
|
3552
|
-
aria-valuetext=${`${
|
|
3560
|
+
aria-valuetext=${`${a}${this.statusText ? `, ${this.statusText}` : ""}`}
|
|
3553
3561
|
>
|
|
3554
3562
|
<div class="baht-meter-fill" style=${`width:${e.toFixed(2)}%`}></div>
|
|
3555
3563
|
${i != null ? l`<span
|
|
@@ -3558,7 +3566,7 @@ let J = class extends y {
|
|
|
3558
3566
|
aria-hidden="true"
|
|
3559
3567
|
></span>` : h}
|
|
3560
3568
|
</div>
|
|
3561
|
-
${i != null ? l`<div class="baht-meter-pace">Expected by now ${
|
|
3569
|
+
${i != null ? l`<div class="baht-meter-pace">Expected by now ${s(this.expected)}</div>` : h}
|
|
3562
3570
|
</div>`;
|
|
3563
3571
|
}
|
|
3564
3572
|
};
|
|
@@ -3595,12 +3603,12 @@ tt([
|
|
|
3595
3603
|
J = tt([
|
|
3596
3604
|
f("baht-meter")
|
|
3597
3605
|
], J);
|
|
3598
|
-
var
|
|
3599
|
-
for (var
|
|
3600
|
-
(o = t[r]) && (
|
|
3601
|
-
return i &&
|
|
3606
|
+
var $i = Object.defineProperty, yi = Object.getOwnPropertyDescriptor, ve = (t, e, s, i) => {
|
|
3607
|
+
for (var a = i > 1 ? void 0 : i ? yi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3608
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3609
|
+
return i && a && $i(e, s, a), a;
|
|
3602
3610
|
};
|
|
3603
|
-
let
|
|
3611
|
+
let Ht = class extends y {
|
|
3604
3612
|
constructor() {
|
|
3605
3613
|
super(...arguments), this.icon = "empty-box", this.message = "Nothing to display", this.hint = "";
|
|
3606
3614
|
}
|
|
@@ -3614,22 +3622,22 @@ let Gt = class extends y {
|
|
|
3614
3622
|
};
|
|
3615
3623
|
ve([
|
|
3616
3624
|
n()
|
|
3617
|
-
],
|
|
3625
|
+
], Ht.prototype, "icon", 2);
|
|
3618
3626
|
ve([
|
|
3619
3627
|
n()
|
|
3620
|
-
],
|
|
3628
|
+
], Ht.prototype, "message", 2);
|
|
3621
3629
|
ve([
|
|
3622
3630
|
n()
|
|
3623
|
-
],
|
|
3624
|
-
|
|
3631
|
+
], Ht.prototype, "hint", 2);
|
|
3632
|
+
Ht = ve([
|
|
3625
3633
|
f("baht-empty-state")
|
|
3626
|
-
],
|
|
3627
|
-
var
|
|
3628
|
-
for (var
|
|
3629
|
-
(o = t[r]) && (
|
|
3630
|
-
return i &&
|
|
3634
|
+
], Ht);
|
|
3635
|
+
var gi = Object.defineProperty, wi = Object.getOwnPropertyDescriptor, te = (t, e, s, i) => {
|
|
3636
|
+
for (var a = i > 1 ? void 0 : i ? wi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3637
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3638
|
+
return i && a && gi(e, s, a), a;
|
|
3631
3639
|
};
|
|
3632
|
-
let
|
|
3640
|
+
let It = class extends y {
|
|
3633
3641
|
constructor() {
|
|
3634
3642
|
super(...arguments), this.icon = "error", this.heading = "Something went wrong", this.message = "", this.retryLabel = "";
|
|
3635
3643
|
}
|
|
@@ -3645,25 +3653,25 @@ let Bt = class extends y {
|
|
|
3645
3653
|
</div>`;
|
|
3646
3654
|
}
|
|
3647
3655
|
};
|
|
3648
|
-
|
|
3656
|
+
te([
|
|
3649
3657
|
n()
|
|
3650
|
-
],
|
|
3651
|
-
|
|
3658
|
+
], It.prototype, "icon", 2);
|
|
3659
|
+
te([
|
|
3652
3660
|
n()
|
|
3653
|
-
],
|
|
3654
|
-
|
|
3661
|
+
], It.prototype, "heading", 2);
|
|
3662
|
+
te([
|
|
3655
3663
|
n()
|
|
3656
|
-
],
|
|
3657
|
-
|
|
3664
|
+
], It.prototype, "message", 2);
|
|
3665
|
+
te([
|
|
3658
3666
|
n({ attribute: "retry-label" })
|
|
3659
|
-
],
|
|
3660
|
-
|
|
3667
|
+
], It.prototype, "retryLabel", 2);
|
|
3668
|
+
It = te([
|
|
3661
3669
|
f("baht-error-state")
|
|
3662
|
-
],
|
|
3663
|
-
var
|
|
3664
|
-
for (var
|
|
3665
|
-
(o = t[r]) && (
|
|
3666
|
-
return i &&
|
|
3670
|
+
], It);
|
|
3671
|
+
var xi = Object.defineProperty, _i = Object.getOwnPropertyDescriptor, _t = (t, e, s, i) => {
|
|
3672
|
+
for (var a = i > 1 ? void 0 : i ? _i(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3673
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3674
|
+
return i && a && xi(e, s, a), a;
|
|
3667
3675
|
};
|
|
3668
3676
|
let dt = class extends y {
|
|
3669
3677
|
constructor() {
|
|
@@ -3675,8 +3683,8 @@ let dt = class extends y {
|
|
|
3675
3683
|
e !== this.syncedJson && (this.syncedJson = e, this.rows = this.toRows(this.value));
|
|
3676
3684
|
}
|
|
3677
3685
|
toRows(t) {
|
|
3678
|
-
const e = Object.entries(t ?? {}).map(([
|
|
3679
|
-
k:
|
|
3686
|
+
const e = Object.entries(t ?? {}).map(([s, i]) => ({
|
|
3687
|
+
k: s,
|
|
3680
3688
|
v: typeof i == "string" ? i : JSON.stringify(i)
|
|
3681
3689
|
}));
|
|
3682
3690
|
return e.length > 0 ? e : [{ k: "", v: "" }];
|
|
@@ -3684,11 +3692,11 @@ let dt = class extends y {
|
|
|
3684
3692
|
commit(t) {
|
|
3685
3693
|
this.rows = t.length > 0 ? t : [{ k: "", v: "" }];
|
|
3686
3694
|
const e = {};
|
|
3687
|
-
for (const
|
|
3695
|
+
for (const s of t) s.k.trim() && (e[s.k.trim()] = s.v);
|
|
3688
3696
|
this.syncedJson = JSON.stringify(e), this.emit("baht-change", { value: e });
|
|
3689
3697
|
}
|
|
3690
3698
|
edit(t, e) {
|
|
3691
|
-
this.commit(this.rows.map((
|
|
3699
|
+
this.commit(this.rows.map((s, i) => i === t ? { ...s, ...e } : s));
|
|
3692
3700
|
}
|
|
3693
3701
|
addRow() {
|
|
3694
3702
|
this.rows = [...this.rows, { k: "", v: "" }];
|
|
@@ -3703,7 +3711,7 @@ let dt = class extends y {
|
|
|
3703
3711
|
aria-label="${this.keyPlaceholder} ${e + 1}"
|
|
3704
3712
|
.value=${t.k}
|
|
3705
3713
|
?disabled=${this.disabled}
|
|
3706
|
-
@input=${(
|
|
3714
|
+
@input=${(s) => this.edit(e, { k: s.target.value })}
|
|
3707
3715
|
/>
|
|
3708
3716
|
<span class="baht-keyvalue-eq" aria-hidden="true">=</span>
|
|
3709
3717
|
<input
|
|
@@ -3712,15 +3720,15 @@ let dt = class extends y {
|
|
|
3712
3720
|
aria-label="${this.valuePlaceholder} ${e + 1}"
|
|
3713
3721
|
.value=${t.v}
|
|
3714
3722
|
?disabled=${this.disabled}
|
|
3715
|
-
@input=${(
|
|
3723
|
+
@input=${(s) => this.edit(e, { v: s.target.value })}
|
|
3716
3724
|
/>
|
|
3717
3725
|
<button
|
|
3718
3726
|
type="button"
|
|
3719
3727
|
class="baht-keyvalue-remove"
|
|
3720
3728
|
aria-label="Remove row ${e + 1}"
|
|
3721
3729
|
?disabled=${this.disabled}
|
|
3722
|
-
@click=${() => this.commit(this.rows.filter((
|
|
3723
|
-
>${
|
|
3730
|
+
@click=${() => this.commit(this.rows.filter((s, i) => i !== e))}
|
|
3731
|
+
>${T("close")}</button>
|
|
3724
3732
|
</div>`
|
|
3725
3733
|
)}
|
|
3726
3734
|
<button
|
|
@@ -3728,7 +3736,7 @@ let dt = class extends y {
|
|
|
3728
3736
|
class="baht-keyvalue-add"
|
|
3729
3737
|
?disabled=${this.disabled}
|
|
3730
3738
|
@click=${this.addRow}
|
|
3731
|
-
>${
|
|
3739
|
+
>${T("plus")}${this.add_label}</button>
|
|
3732
3740
|
</div>`;
|
|
3733
3741
|
}
|
|
3734
3742
|
};
|
|
@@ -3753,10 +3761,10 @@ _t([
|
|
|
3753
3761
|
dt = _t([
|
|
3754
3762
|
f("baht-keyvalue-editor")
|
|
3755
3763
|
], dt);
|
|
3756
|
-
var
|
|
3757
|
-
for (var
|
|
3758
|
-
(o = t[r]) && (
|
|
3759
|
-
return i &&
|
|
3764
|
+
var ki = Object.defineProperty, Oi = Object.getOwnPropertyDescriptor, q = (t, e, s, i) => {
|
|
3765
|
+
for (var a = i > 1 ? void 0 : i ? Oi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3766
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3767
|
+
return i && a && ki(e, s, a), a;
|
|
3760
3768
|
};
|
|
3761
3769
|
let A = class extends y {
|
|
3762
3770
|
constructor() {
|
|
@@ -3768,16 +3776,16 @@ let A = class extends y {
|
|
|
3768
3776
|
return `baht-refpicker-list-${this.uid}`;
|
|
3769
3777
|
}
|
|
3770
3778
|
disconnectedCallback() {
|
|
3771
|
-
super.disconnectedCallback(), clearTimeout(this.timer),
|
|
3779
|
+
super.disconnectedCallback(), clearTimeout(this.timer), j() && document.removeEventListener("mousedown", this.onDocMousedown);
|
|
3772
3780
|
}
|
|
3773
3781
|
openLookup() {
|
|
3774
|
-
this.disabled || this.open || (this.open = !0, this.term = "", this.activeIndex = -1,
|
|
3782
|
+
this.disabled || this.open || (this.open = !0, this.term = "", this.activeIndex = -1, j() && document.addEventListener("mousedown", this.onDocMousedown), this.search(""), this.updateComplete.then(() => {
|
|
3775
3783
|
var t;
|
|
3776
3784
|
return (t = this.inputEl) == null ? void 0 : t.focus();
|
|
3777
3785
|
}));
|
|
3778
3786
|
}
|
|
3779
3787
|
close() {
|
|
3780
|
-
this.open && (this.open = !1, this.loading = !1, clearTimeout(this.timer),
|
|
3788
|
+
this.open && (this.open = !1, this.loading = !1, clearTimeout(this.timer), j() && document.removeEventListener("mousedown", this.onDocMousedown));
|
|
3781
3789
|
}
|
|
3782
3790
|
search(t) {
|
|
3783
3791
|
clearTimeout(this.timer), this.timer = setTimeout(async () => {
|
|
@@ -3785,8 +3793,8 @@ let A = class extends y {
|
|
|
3785
3793
|
const e = ++this.fetchSeq;
|
|
3786
3794
|
this.loading = !0;
|
|
3787
3795
|
try {
|
|
3788
|
-
const
|
|
3789
|
-
e === this.fetchSeq && (this.options =
|
|
3796
|
+
const s = await this.fetcher(t);
|
|
3797
|
+
e === this.fetchSeq && (this.options = s);
|
|
3790
3798
|
} catch {
|
|
3791
3799
|
e === this.fetchSeq && (this.options = []);
|
|
3792
3800
|
} finally {
|
|
@@ -3810,8 +3818,8 @@ let A = class extends y {
|
|
|
3810
3818
|
if (this.open)
|
|
3811
3819
|
if (t.key === "ArrowDown" || t.key === "ArrowUp") {
|
|
3812
3820
|
t.preventDefault();
|
|
3813
|
-
const e = t.key === "ArrowDown" ? 1 : -1,
|
|
3814
|
-
|
|
3821
|
+
const e = t.key === "ArrowDown" ? 1 : -1, s = this.options.length;
|
|
3822
|
+
s > 0 && (this.activeIndex = (this.activeIndex + e + s) % s);
|
|
3815
3823
|
} else if (t.key === "Enter") {
|
|
3816
3824
|
t.preventDefault();
|
|
3817
3825
|
const e = this.options[this.activeIndex];
|
|
@@ -3846,7 +3854,7 @@ let A = class extends y {
|
|
|
3846
3854
|
aria-label="Clear"
|
|
3847
3855
|
@mousedown=${(e) => e.preventDefault()}
|
|
3848
3856
|
@click=${() => this.clear()}
|
|
3849
|
-
>${
|
|
3857
|
+
>${T("close")}</button>` : h}
|
|
3850
3858
|
</div>
|
|
3851
3859
|
<button
|
|
3852
3860
|
type="button"
|
|
@@ -3855,13 +3863,13 @@ let A = class extends y {
|
|
|
3855
3863
|
title=${this.lookupLabel}
|
|
3856
3864
|
?disabled=${this.disabled}
|
|
3857
3865
|
@click=${() => this.open ? this.close() : this.openLookup()}
|
|
3858
|
-
>${
|
|
3866
|
+
>${T("search")}</button>
|
|
3859
3867
|
${this.value && this.href ? l`<a
|
|
3860
3868
|
class="baht-refpicker-open"
|
|
3861
3869
|
href=${this.href}
|
|
3862
3870
|
aria-label="Open record"
|
|
3863
3871
|
title="Open record"
|
|
3864
|
-
>${
|
|
3872
|
+
>${T("external")}</a>` : h}
|
|
3865
3873
|
<div
|
|
3866
3874
|
class="baht-refpicker-list"
|
|
3867
3875
|
id=${this.listboxId}
|
|
@@ -3871,10 +3879,10 @@ let A = class extends y {
|
|
|
3871
3879
|
?hidden=${!this.open}
|
|
3872
3880
|
>
|
|
3873
3881
|
${this.loading ? l`<div class="baht-refpicker-note" role="option" aria-disabled="true" aria-selected="false">Searching…</div>` : this.options.length === 0 ? l`<div class="baht-refpicker-note" role="option" aria-disabled="true" aria-selected="false">No matches</div>` : this.options.map(
|
|
3874
|
-
(e,
|
|
3882
|
+
(e, s) => l`<button
|
|
3875
3883
|
type="button"
|
|
3876
|
-
class="baht-refpicker-option${
|
|
3877
|
-
id="${this.listboxId}-${
|
|
3884
|
+
class="baht-refpicker-option${s === this.activeIndex ? " baht-refpicker-option--active" : ""}"
|
|
3885
|
+
id="${this.listboxId}-${s}"
|
|
3878
3886
|
role="option"
|
|
3879
3887
|
aria-selected=${e.key === this.value ? "true" : "false"}
|
|
3880
3888
|
@mousedown=${(i) => i.preventDefault()}
|
|
@@ -3934,15 +3942,15 @@ q([
|
|
|
3934
3942
|
v()
|
|
3935
3943
|
], A.prototype, "activeIndex", 2);
|
|
3936
3944
|
q([
|
|
3937
|
-
|
|
3945
|
+
Bt("input")
|
|
3938
3946
|
], A.prototype, "inputEl", 2);
|
|
3939
3947
|
A = q([
|
|
3940
3948
|
f("baht-reference-picker")
|
|
3941
3949
|
], A);
|
|
3942
|
-
var
|
|
3943
|
-
for (var
|
|
3944
|
-
(o = t[r]) && (
|
|
3945
|
-
return i &&
|
|
3950
|
+
var Pi = Object.defineProperty, Ci = Object.getOwnPropertyDescriptor, B = (t, e, s, i) => {
|
|
3951
|
+
for (var a = i > 1 ? void 0 : i ? Ci(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
3952
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
3953
|
+
return i && a && Pi(e, s, a), a;
|
|
3946
3954
|
};
|
|
3947
3955
|
let F = class extends y {
|
|
3948
3956
|
constructor() {
|
|
@@ -3960,7 +3968,7 @@ let F = class extends y {
|
|
|
3960
3968
|
return `${this.listboxId}-${t}`;
|
|
3961
3969
|
}
|
|
3962
3970
|
disconnectedCallback() {
|
|
3963
|
-
super.disconnectedCallback(), clearTimeout(this.timer),
|
|
3971
|
+
super.disconnectedCallback(), clearTimeout(this.timer), j() && document.removeEventListener("mousedown", this.onDocMousedown);
|
|
3964
3972
|
}
|
|
3965
3973
|
willUpdate(t) {
|
|
3966
3974
|
super.willUpdate(t), t.has("value") && this.timer === void 0 && (this.term = this.value);
|
|
@@ -3973,15 +3981,15 @@ let F = class extends y {
|
|
|
3973
3981
|
}
|
|
3974
3982
|
// ---- suggestions -----------------------------------------------------
|
|
3975
3983
|
filterStatic(t) {
|
|
3976
|
-
var
|
|
3984
|
+
var a;
|
|
3977
3985
|
const e = t.trim().toLowerCase();
|
|
3978
3986
|
if (!e) return this.options.slice(0, this.maxItems);
|
|
3979
|
-
const
|
|
3987
|
+
const s = [], i = [];
|
|
3980
3988
|
for (const r of this.options) {
|
|
3981
3989
|
const o = r.label.toLowerCase();
|
|
3982
|
-
o.startsWith(e) ?
|
|
3990
|
+
o.startsWith(e) ? s.push(r) : (o.includes(e) || (a = r.sub) != null && a.toLowerCase().includes(e)) && i.push(r);
|
|
3983
3991
|
}
|
|
3984
|
-
return [...
|
|
3992
|
+
return [...s, ...i].slice(0, this.maxItems);
|
|
3985
3993
|
}
|
|
3986
3994
|
async suggest(t) {
|
|
3987
3995
|
if (t.length < this.minChars) {
|
|
@@ -3995,8 +4003,8 @@ let F = class extends y {
|
|
|
3995
4003
|
const e = ++this.fetchSeq;
|
|
3996
4004
|
this.loading = !0, this.open = !0, this.listen();
|
|
3997
4005
|
try {
|
|
3998
|
-
const
|
|
3999
|
-
e === this.fetchSeq && (this.results =
|
|
4006
|
+
const s = await this.fetcher(t);
|
|
4007
|
+
e === this.fetchSeq && (this.results = s.slice(0, this.maxItems));
|
|
4000
4008
|
} catch {
|
|
4001
4009
|
e === this.fetchSeq && (this.results = []);
|
|
4002
4010
|
} finally {
|
|
@@ -4007,10 +4015,10 @@ let F = class extends y {
|
|
|
4007
4015
|
this.activeIndex !== t && (this.activeIndex = t);
|
|
4008
4016
|
}
|
|
4009
4017
|
listen() {
|
|
4010
|
-
|
|
4018
|
+
j() && document.addEventListener("mousedown", this.onDocMousedown);
|
|
4011
4019
|
}
|
|
4012
4020
|
close() {
|
|
4013
|
-
|
|
4021
|
+
j() && document.removeEventListener("mousedown", this.onDocMousedown), this.open && (this.open = !1, this.activeIndex = -1);
|
|
4014
4022
|
}
|
|
4015
4023
|
// ---- events ------------------------------------------------------------
|
|
4016
4024
|
emitChange(t, e) {
|
|
@@ -4054,8 +4062,8 @@ let F = class extends y {
|
|
|
4054
4062
|
t.preventDefault(), this.open && e > 0 && (this.activeIndex = (this.activeIndex - 1 + e) % e);
|
|
4055
4063
|
break;
|
|
4056
4064
|
case "Enter": {
|
|
4057
|
-
const
|
|
4058
|
-
|
|
4065
|
+
const s = this.open ? this.results[this.activeIndex] : void 0;
|
|
4066
|
+
s ? (t.preventDefault(), this.pick(s)) : (this.flush(), this.close());
|
|
4059
4067
|
break;
|
|
4060
4068
|
}
|
|
4061
4069
|
case "Escape":
|
|
@@ -4084,8 +4092,8 @@ let F = class extends y {
|
|
|
4084
4092
|
placeholder=${this.placeholder || h}
|
|
4085
4093
|
.value=${Z(this.term)}
|
|
4086
4094
|
?disabled=${this.disabled}
|
|
4087
|
-
@input=${(
|
|
4088
|
-
@keydown=${(
|
|
4095
|
+
@input=${(s) => this.onInput(s)}
|
|
4096
|
+
@keydown=${(s) => this.onKeydown(s)}
|
|
4089
4097
|
@blur=${() => this.onBlur()}
|
|
4090
4098
|
/>
|
|
4091
4099
|
<div
|
|
@@ -4098,82 +4106,82 @@ let F = class extends y {
|
|
|
4098
4106
|
>
|
|
4099
4107
|
${this.loading ? l`<div class="baht-listbox-note" role="option" aria-disabled="true" aria-selected="false">Searching…</div>` : e ? l`<div class="baht-listbox-note" role="option" aria-disabled="true" aria-selected="false">No matches</div>` : this.results.map(
|
|
4100
4108
|
// eslint-disable-next-line lit-a11y/click-events-have-key-events -- keyboard lives on the combobox input (aria-activedescendant pattern)
|
|
4101
|
-
(
|
|
4109
|
+
(s, i) => l`<div
|
|
4102
4110
|
class="baht-listbox-option${i === this.activeIndex ? " baht-listbox-option--active" : ""}"
|
|
4103
4111
|
id=${this.optionId(i)}
|
|
4104
4112
|
role="option"
|
|
4105
4113
|
aria-selected=${i === this.activeIndex ? "true" : "false"}
|
|
4106
|
-
data-key=${
|
|
4107
|
-
@mousedown=${(
|
|
4114
|
+
data-key=${s.key}
|
|
4115
|
+
@mousedown=${(a) => a.preventDefault()}
|
|
4108
4116
|
@mousemove=${() => this.highlight(i)}
|
|
4109
4117
|
@click=${() => {
|
|
4110
|
-
var
|
|
4111
|
-
this.pick(
|
|
4118
|
+
var a;
|
|
4119
|
+
this.pick(s), (a = this.inputEl) == null || a.focus();
|
|
4112
4120
|
}}
|
|
4113
4121
|
>
|
|
4114
|
-
<span class="baht-listbox-option-label">${
|
|
4115
|
-
${
|
|
4122
|
+
<span class="baht-listbox-option-label">${s.label}</span>
|
|
4123
|
+
${s.sub ? l`<span class="baht-listbox-option-sub">${s.sub}</span>` : h}
|
|
4116
4124
|
</div>`
|
|
4117
4125
|
)}
|
|
4118
4126
|
</div>
|
|
4119
4127
|
</div>`;
|
|
4120
4128
|
}
|
|
4121
4129
|
};
|
|
4122
|
-
|
|
4130
|
+
B([
|
|
4123
4131
|
n()
|
|
4124
4132
|
], F.prototype, "label", 2);
|
|
4125
|
-
|
|
4133
|
+
B([
|
|
4126
4134
|
n()
|
|
4127
4135
|
], F.prototype, "value", 2);
|
|
4128
|
-
|
|
4136
|
+
B([
|
|
4129
4137
|
n()
|
|
4130
4138
|
], F.prototype, "placeholder", 2);
|
|
4131
|
-
|
|
4139
|
+
B([
|
|
4132
4140
|
n({ type: Boolean })
|
|
4133
4141
|
], F.prototype, "disabled", 2);
|
|
4134
|
-
|
|
4142
|
+
B([
|
|
4135
4143
|
n({ type: Boolean })
|
|
4136
4144
|
], F.prototype, "invalid", 2);
|
|
4137
|
-
|
|
4145
|
+
B([
|
|
4138
4146
|
n({ attribute: !1 })
|
|
4139
4147
|
], F.prototype, "options", 2);
|
|
4140
|
-
|
|
4148
|
+
B([
|
|
4141
4149
|
n({ attribute: !1 })
|
|
4142
4150
|
], F.prototype, "fetcher", 2);
|
|
4143
|
-
|
|
4151
|
+
B([
|
|
4144
4152
|
n({ type: Number })
|
|
4145
4153
|
], F.prototype, "debounce", 2);
|
|
4146
|
-
|
|
4154
|
+
B([
|
|
4147
4155
|
n({ type: Number, attribute: "min-chars" })
|
|
4148
4156
|
], F.prototype, "minChars", 2);
|
|
4149
|
-
|
|
4157
|
+
B([
|
|
4150
4158
|
n({ type: Number, attribute: "max-items" })
|
|
4151
4159
|
], F.prototype, "maxItems", 2);
|
|
4152
|
-
|
|
4160
|
+
B([
|
|
4153
4161
|
n({ attribute: "free-text", converter: (t) => t !== "false" })
|
|
4154
4162
|
], F.prototype, "freeText", 2);
|
|
4155
|
-
|
|
4163
|
+
B([
|
|
4156
4164
|
n()
|
|
4157
4165
|
], F.prototype, "autocomplete", 2);
|
|
4158
|
-
|
|
4166
|
+
B([
|
|
4159
4167
|
v()
|
|
4160
4168
|
], F.prototype, "term", 2);
|
|
4161
|
-
|
|
4169
|
+
B([
|
|
4162
4170
|
v()
|
|
4163
4171
|
], F.prototype, "open", 2);
|
|
4164
|
-
|
|
4172
|
+
B([
|
|
4165
4173
|
v()
|
|
4166
4174
|
], F.prototype, "results", 2);
|
|
4167
|
-
|
|
4175
|
+
B([
|
|
4168
4176
|
v()
|
|
4169
4177
|
], F.prototype, "loading", 2);
|
|
4170
|
-
|
|
4178
|
+
B([
|
|
4171
4179
|
v()
|
|
4172
4180
|
], F.prototype, "activeIndex", 2);
|
|
4173
|
-
|
|
4174
|
-
|
|
4181
|
+
B([
|
|
4182
|
+
Bt("input")
|
|
4175
4183
|
], F.prototype, "inputEl", 2);
|
|
4176
|
-
F =
|
|
4184
|
+
F = B([
|
|
4177
4185
|
f("baht-typeahead")
|
|
4178
4186
|
], F);
|
|
4179
4187
|
const ys = {
|
|
@@ -4194,18 +4202,18 @@ const ys = {
|
|
|
4194
4202
|
section: "baht-section",
|
|
4195
4203
|
repeater: "baht-repeater"
|
|
4196
4204
|
};
|
|
4197
|
-
var
|
|
4198
|
-
for (var
|
|
4199
|
-
(o = t[r]) && (
|
|
4200
|
-
return i &&
|
|
4205
|
+
var Di = Object.defineProperty, Si = Object.getOwnPropertyDescriptor, gs = (t, e, s, i) => {
|
|
4206
|
+
for (var a = i > 1 ? void 0 : i ? Si(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
4207
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
4208
|
+
return i && a && Di(e, s, a), a;
|
|
4201
4209
|
};
|
|
4202
|
-
const
|
|
4210
|
+
const Fi = {
|
|
4203
4211
|
"1/4": "baht-field--w-1-4",
|
|
4204
4212
|
"1/2": "baht-field--w-1-2",
|
|
4205
4213
|
"3/4": "baht-field--w-3-4",
|
|
4206
4214
|
full: "baht-field--w-full"
|
|
4207
4215
|
}, hs = /* @__PURE__ */ new Map();
|
|
4208
|
-
function
|
|
4216
|
+
function Mi(t) {
|
|
4209
4217
|
let e = hs.get(t);
|
|
4210
4218
|
return e || (e = ds(t), hs.set(t, e)), e;
|
|
4211
4219
|
}
|
|
@@ -4222,9 +4230,9 @@ let Ae = class extends X {
|
|
|
4222
4230
|
get subFields() {
|
|
4223
4231
|
return [...this.field.fields ?? []].sort((t, e) => t.order - e.order).filter((t) => t.type !== "repeater");
|
|
4224
4232
|
}
|
|
4225
|
-
patchRow(t, e,
|
|
4233
|
+
patchRow(t, e, s) {
|
|
4226
4234
|
const i = [...this.rows];
|
|
4227
|
-
i[t] = { ...i[t], [e]:
|
|
4235
|
+
i[t] = { ...i[t], [e]: s }, this.emitInput(i);
|
|
4228
4236
|
}
|
|
4229
4237
|
addRow() {
|
|
4230
4238
|
const t = {};
|
|
@@ -4233,49 +4241,49 @@ let Ae = class extends X {
|
|
|
4233
4241
|
this.emitInput([...this.rows, t]);
|
|
4234
4242
|
}
|
|
4235
4243
|
removeRow(t) {
|
|
4236
|
-
this.emitInput(this.rows.filter((e,
|
|
4244
|
+
this.emitInput(this.rows.filter((e, s) => s !== t));
|
|
4237
4245
|
}
|
|
4238
4246
|
/** Pending keystrokes in any row land in the array before the host reads it. */
|
|
4239
4247
|
flushTyped() {
|
|
4240
4248
|
var t;
|
|
4241
|
-
if (!
|
|
4249
|
+
if (!j()) return super.flushTyped();
|
|
4242
4250
|
for (const e of this.querySelectorAll(".baht-repeater-row > .baht-field > *"))
|
|
4243
4251
|
(t = e.flushTyped) == null || t.call(e);
|
|
4244
4252
|
super.flushTyped();
|
|
4245
4253
|
}
|
|
4246
4254
|
errorFor(t, e) {
|
|
4247
4255
|
var i;
|
|
4248
|
-
const
|
|
4249
|
-
return ((i = this.rowErrors.find((
|
|
4256
|
+
const s = `${this.field.key}[${t}].${e}`;
|
|
4257
|
+
return ((i = this.rowErrors.find((a) => a.key === s)) == null ? void 0 : i.message) ?? null;
|
|
4250
4258
|
}
|
|
4251
4259
|
/**
|
|
4252
4260
|
* Sub-controls render declaratively (one static-tag template per primitive, rows
|
|
4253
4261
|
* keyed by index) so Lit reuses the same node across re-renders — typing keeps
|
|
4254
4262
|
* focus, same as <baht-form> — and the whole thing renders on the server.
|
|
4255
4263
|
*/
|
|
4256
|
-
renderSub(t, e,
|
|
4257
|
-
const i = ys[
|
|
4264
|
+
renderSub(t, e, s) {
|
|
4265
|
+
const i = ys[s.type];
|
|
4258
4266
|
if (!i) return h;
|
|
4259
|
-
const
|
|
4267
|
+
const a = Mi(i), r = Fi[s.width ?? "full"] ?? "baht-field--w-full", o = (c) => {
|
|
4260
4268
|
c.stopPropagation();
|
|
4261
4269
|
const { value: m } = c.detail;
|
|
4262
|
-
this.patchRow(e,
|
|
4270
|
+
this.patchRow(e, s.key, m);
|
|
4263
4271
|
};
|
|
4264
|
-
return l`<div class="baht-field ${r}" data-key=${
|
|
4265
|
-
${
|
|
4266
|
-
.field=${
|
|
4267
|
-
.value=${Object.hasOwn(t,
|
|
4272
|
+
return l`<div class="baht-field ${r}" data-key=${s.key} data-type=${s.type}>
|
|
4273
|
+
${se`<${a}
|
|
4274
|
+
.field=${s}
|
|
4275
|
+
.value=${Object.hasOwn(t, s.key) ? t[s.key] : ie(s)}
|
|
4268
4276
|
.disabled=${this.disabled}
|
|
4269
4277
|
.readonly=${this.readonly}
|
|
4270
|
-
.required=${!!
|
|
4271
|
-
.error=${this.errorFor(e,
|
|
4278
|
+
.required=${!!s.required}
|
|
4279
|
+
.error=${this.errorFor(e, s.key)}
|
|
4272
4280
|
.debounce=${this.debounce}
|
|
4273
4281
|
@baht-input=${o}
|
|
4274
|
-
></${
|
|
4282
|
+
></${a}>`}
|
|
4275
4283
|
</div>`;
|
|
4276
4284
|
}
|
|
4277
4285
|
renderControl() {
|
|
4278
|
-
const t = this.rows, e = !this.disabled && !this.readonly,
|
|
4286
|
+
const t = this.rows, e = !this.disabled && !this.readonly, s = this.field.max_rows !== void 0 && t.length >= this.field.max_rows;
|
|
4279
4287
|
return l`<div
|
|
4280
4288
|
class="baht-repeater"
|
|
4281
4289
|
id=${this.controlId}
|
|
@@ -4285,24 +4293,24 @@ let Ae = class extends X {
|
|
|
4285
4293
|
>
|
|
4286
4294
|
${Fe(
|
|
4287
4295
|
t,
|
|
4288
|
-
(i,
|
|
4289
|
-
(i,
|
|
4296
|
+
(i, a) => a,
|
|
4297
|
+
(i, a) => l`<div
|
|
4290
4298
|
class="baht-repeater-row"
|
|
4291
|
-
data-row=${
|
|
4299
|
+
data-row=${a}
|
|
4292
4300
|
role="group"
|
|
4293
|
-
aria-label=${u("row", { n:
|
|
4301
|
+
aria-label=${u("row", { n: a + 1 })}
|
|
4294
4302
|
>
|
|
4295
4303
|
${Fe(
|
|
4296
4304
|
this.subFields,
|
|
4297
4305
|
(r) => r.key,
|
|
4298
|
-
(r) => this.renderSub(i,
|
|
4306
|
+
(r) => this.renderSub(i, a, r)
|
|
4299
4307
|
)}
|
|
4300
4308
|
${e ? l`<button
|
|
4301
4309
|
type="button"
|
|
4302
4310
|
class="baht-repeater-remove"
|
|
4303
|
-
aria-label=${u("removeRowN", { n:
|
|
4304
|
-
title=${u("removeRowN", { n:
|
|
4305
|
-
@click=${() => this.removeRow(
|
|
4311
|
+
aria-label=${u("removeRowN", { n: a + 1 })}
|
|
4312
|
+
title=${u("removeRowN", { n: a + 1 })}
|
|
4313
|
+
@click=${() => this.removeRow(a)}
|
|
4306
4314
|
>
|
|
4307
4315
|
✕
|
|
4308
4316
|
</button>` : h}
|
|
@@ -4311,7 +4319,7 @@ let Ae = class extends X {
|
|
|
4311
4319
|
${this.readonly ? h : l`<button
|
|
4312
4320
|
type="button"
|
|
4313
4321
|
class="baht-repeater-add"
|
|
4314
|
-
?disabled=${this.disabled ||
|
|
4322
|
+
?disabled=${this.disabled || s}
|
|
4315
4323
|
@click=${() => this.addRow()}
|
|
4316
4324
|
>
|
|
4317
4325
|
+ ${this.field.add_label ?? u("addRow")}
|
|
@@ -4325,12 +4333,12 @@ gs([
|
|
|
4325
4333
|
Ae = gs([
|
|
4326
4334
|
f("baht-repeater")
|
|
4327
4335
|
], Ae);
|
|
4328
|
-
var
|
|
4329
|
-
for (var
|
|
4330
|
-
(o = t[r]) && (
|
|
4331
|
-
return i &&
|
|
4336
|
+
var Ii = Object.defineProperty, Bi = Object.getOwnPropertyDescriptor, $e = (t, e, s, i) => {
|
|
4337
|
+
for (var a = i > 1 ? void 0 : i ? Bi(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
4338
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
4339
|
+
return i && a && Ii(e, s, a), a;
|
|
4332
4340
|
};
|
|
4333
|
-
let
|
|
4341
|
+
let Gt = class extends y {
|
|
4334
4342
|
constructor() {
|
|
4335
4343
|
super(...arguments), this.steps = [], this.current = 0, this.variant = "default";
|
|
4336
4344
|
}
|
|
@@ -4340,13 +4348,13 @@ let Wt = class extends y {
|
|
|
4340
4348
|
class="baht-steps ${t ? "baht-steps--sidebar" : ""}"
|
|
4341
4349
|
aria-label=${u("step", { current: this.current + 1, total: this.steps.length })}
|
|
4342
4350
|
>
|
|
4343
|
-
${this.steps.map((e,
|
|
4344
|
-
const i =
|
|
4351
|
+
${this.steps.map((e, s) => {
|
|
4352
|
+
const i = s < this.current ? "done" : s === this.current ? "current" : "todo";
|
|
4345
4353
|
return l`<li
|
|
4346
4354
|
class="baht-step baht-step--${i} ${t ? "baht-step--sidebar" : ""}"
|
|
4347
4355
|
aria-current=${i === "current" ? "step" : "false"}
|
|
4348
4356
|
>
|
|
4349
|
-
${t ? h : l`<span class="baht-step-marker" aria-hidden="true">${i === "done" ? "✓" :
|
|
4357
|
+
${t ? h : l`<span class="baht-step-marker" aria-hidden="true">${i === "done" ? "✓" : s + 1}</span>`}
|
|
4350
4358
|
<span class="baht-step-label">${e}</span>
|
|
4351
4359
|
${i === "done" ? l`<span class="baht-visually-hidden"> (${u("stepDone")})</span>` : i === "current" ? l`<span class="baht-visually-hidden"> (${u("stepCurrent")})</span>` : h}
|
|
4352
4360
|
</li>`;
|
|
@@ -4356,28 +4364,28 @@ let Wt = class extends y {
|
|
|
4356
4364
|
};
|
|
4357
4365
|
$e([
|
|
4358
4366
|
n({ attribute: !1 })
|
|
4359
|
-
],
|
|
4367
|
+
], Gt.prototype, "steps", 2);
|
|
4360
4368
|
$e([
|
|
4361
4369
|
n({ type: Number })
|
|
4362
|
-
],
|
|
4370
|
+
], Gt.prototype, "current", 2);
|
|
4363
4371
|
$e([
|
|
4364
4372
|
n()
|
|
4365
|
-
],
|
|
4366
|
-
|
|
4373
|
+
], Gt.prototype, "variant", 2);
|
|
4374
|
+
Gt = $e([
|
|
4367
4375
|
f("baht-steps")
|
|
4368
|
-
],
|
|
4369
|
-
var
|
|
4370
|
-
for (var
|
|
4371
|
-
(o = t[r]) && (
|
|
4372
|
-
return i &&
|
|
4376
|
+
], Gt);
|
|
4377
|
+
var Ti = Object.defineProperty, ji = Object.getOwnPropertyDescriptor, U = (t, e, s, i) => {
|
|
4378
|
+
for (var a = i > 1 ? void 0 : i ? ji(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
4379
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
4380
|
+
return i && a && Ti(e, s, a), a;
|
|
4373
4381
|
};
|
|
4374
|
-
const
|
|
4382
|
+
const Ai = {
|
|
4375
4383
|
"1/4": "baht-field--w-1-4",
|
|
4376
4384
|
"1/2": "baht-field--w-1-2",
|
|
4377
4385
|
"3/4": "baht-field--w-3-4",
|
|
4378
4386
|
full: "baht-field--w-full"
|
|
4379
4387
|
}, cs = /* @__PURE__ */ new Map();
|
|
4380
|
-
function
|
|
4388
|
+
function Ei(t) {
|
|
4381
4389
|
let e = cs.get(t);
|
|
4382
4390
|
return e || (e = ds(t), cs.set(t, e)), e;
|
|
4383
4391
|
}
|
|
@@ -4401,16 +4409,16 @@ let z = class extends y {
|
|
|
4401
4409
|
* dropped by epoch).
|
|
4402
4410
|
*/
|
|
4403
4411
|
syncDynamicOptions() {
|
|
4404
|
-
var e,
|
|
4412
|
+
var e, s;
|
|
4405
4413
|
const t = this.getData();
|
|
4406
4414
|
for (const i of ((e = this.effectiveForm) == null ? void 0 : e.fields) ?? []) {
|
|
4407
4415
|
if (!i.options_from) continue;
|
|
4408
|
-
const
|
|
4409
|
-
if (this.optionsSnapshots.get(i.key) ===
|
|
4410
|
-
this.optionsSnapshots.set(i.key,
|
|
4416
|
+
const a = JSON.stringify((i.options_deps ?? []).map((m) => t[m] ?? null));
|
|
4417
|
+
if (this.optionsSnapshots.get(i.key) === a) continue;
|
|
4418
|
+
this.optionsSnapshots.set(i.key, a);
|
|
4411
4419
|
const r = (this.optionsEpoch.get(i.key) ?? 0) + 1;
|
|
4412
4420
|
this.optionsEpoch.set(i.key, r);
|
|
4413
|
-
const o = (
|
|
4421
|
+
const o = (s = this.registry.options) == null ? void 0 : s[i.options_from];
|
|
4414
4422
|
if (!o) {
|
|
4415
4423
|
console.warn(`[bahtui] unknown options fetcher "${i.options_from}" — skipped`), this.dynamicOptions.set(i.key, []);
|
|
4416
4424
|
continue;
|
|
@@ -4429,18 +4437,18 @@ let z = class extends y {
|
|
|
4429
4437
|
* (province -> district -> subdistrict).
|
|
4430
4438
|
*/
|
|
4431
4439
|
clearDependents(t) {
|
|
4432
|
-
var i,
|
|
4433
|
-
const e = [t],
|
|
4440
|
+
var i, a;
|
|
4441
|
+
const e = [t], s = /* @__PURE__ */ new Set();
|
|
4434
4442
|
for (; e.length > 0; ) {
|
|
4435
4443
|
const r = e.shift();
|
|
4436
4444
|
for (const o of ((i = this.effectiveForm) == null ? void 0 : i.fields) ?? [])
|
|
4437
|
-
!((
|
|
4445
|
+
!((a = o.options_deps) != null && a.includes(r)) || s.has(o.key) || (s.add(o.key), this.edits = { ...this.edits, [o.key]: ie(o) }, e.push(o.key));
|
|
4438
4446
|
}
|
|
4439
4447
|
}
|
|
4440
4448
|
get sortedFields() {
|
|
4441
4449
|
if (!this.form) return [];
|
|
4442
|
-
const t =
|
|
4443
|
-
return t || (this.view !== void 0 && !this.warnedViews.has(this.view) && (this.warnedViews.add(this.view), console.warn(`[bahtui] unknown view "${this.view}" — showing the full form`)),
|
|
4450
|
+
const t = ze(this.effectiveForm, this.view);
|
|
4451
|
+
return t || (this.view !== void 0 && !this.warnedViews.has(this.view) && (this.warnedViews.add(this.view), console.warn(`[bahtui] unknown view "${this.view}" — showing the full form`)), ze(this.effectiveForm) ?? []);
|
|
4444
4452
|
}
|
|
4445
4453
|
stateFor(t) {
|
|
4446
4454
|
const e = this.fieldStates[t.key] ?? {
|
|
@@ -4449,8 +4457,8 @@ let z = class extends y {
|
|
|
4449
4457
|
readonly: !!t.readonly,
|
|
4450
4458
|
required: !!t.required,
|
|
4451
4459
|
computed: !1
|
|
4452
|
-
},
|
|
4453
|
-
return
|
|
4460
|
+
}, s = this.scriptStates[t.key];
|
|
4461
|
+
return s ? { ...e, ...s } : e;
|
|
4454
4462
|
}
|
|
4455
4463
|
valueFor(t) {
|
|
4456
4464
|
return Object.hasOwn(this.edits, t.key) ? this.edits[t.key] : Object.hasOwn(this.value, t.key) ? this.value[t.key] : ie(t);
|
|
@@ -4459,7 +4467,7 @@ let z = class extends y {
|
|
|
4459
4467
|
/** Debounced keystrokes still in a control land in `edits` before anyone reads them. */
|
|
4460
4468
|
flushTyped() {
|
|
4461
4469
|
var t;
|
|
4462
|
-
if (
|
|
4470
|
+
if (j())
|
|
4463
4471
|
for (const e of this.querySelectorAll(":scope > .baht-form > .baht-field > *"))
|
|
4464
4472
|
(t = e.flushTyped) == null || t.call(e);
|
|
4465
4473
|
}
|
|
@@ -4467,8 +4475,8 @@ let z = class extends y {
|
|
|
4467
4475
|
var e;
|
|
4468
4476
|
this.flushTyped();
|
|
4469
4477
|
const t = {};
|
|
4470
|
-
for (const
|
|
4471
|
-
|
|
4478
|
+
for (const s of ((e = this.effectiveForm) == null ? void 0 : e.fields) ?? [])
|
|
4479
|
+
s.type === "label" || s.type === "section" || (t[s.key] = this.valueFor(s));
|
|
4472
4480
|
return t;
|
|
4473
4481
|
}
|
|
4474
4482
|
/**
|
|
@@ -4479,18 +4487,18 @@ let z = class extends y {
|
|
|
4479
4487
|
setValue(t) {
|
|
4480
4488
|
const e = this.getData();
|
|
4481
4489
|
this.edits = { ...this.edits, ...t }, this.requestUpdate();
|
|
4482
|
-
for (const
|
|
4483
|
-
this.runChangeScripts(
|
|
4490
|
+
for (const s of Object.keys(t))
|
|
4491
|
+
this.runChangeScripts(s, e[s], t[s], !1);
|
|
4484
4492
|
}
|
|
4485
4493
|
/** Declarative + registry validators over the visible fields (no scripts). */
|
|
4486
4494
|
runValidators() {
|
|
4487
4495
|
const t = [], e = this.getData();
|
|
4488
|
-
for (const
|
|
4489
|
-
if (
|
|
4490
|
-
const i = this.stateFor(
|
|
4496
|
+
for (const s of this.sortedFields) {
|
|
4497
|
+
if (s.type === "label" || s.type === "section") continue;
|
|
4498
|
+
const i = this.stateFor(s);
|
|
4491
4499
|
if (!i.visible) continue;
|
|
4492
|
-
const
|
|
4493
|
-
t.push(...
|
|
4500
|
+
const a = i.required === !!s.required ? s : { ...s, required: i.required };
|
|
4501
|
+
t.push(...Ve(a, this.valueFor(s), this.registry, e));
|
|
4494
4502
|
}
|
|
4495
4503
|
return t;
|
|
4496
4504
|
}
|
|
@@ -4509,14 +4517,14 @@ let z = class extends y {
|
|
|
4509
4517
|
g: this.g(e),
|
|
4510
4518
|
on: "submit",
|
|
4511
4519
|
detail: { isLoading: !1, data: this.getData() }
|
|
4512
|
-
}),
|
|
4513
|
-
!i &&
|
|
4520
|
+
}), a = this.formMessages.filter((r) => r.type === "error").map((r) => ({ key: "$", message: r.message }));
|
|
4521
|
+
!i && a.length === 0 && a.push({ key: "$", message: u("scriptBlocked") }), t.push(...a);
|
|
4514
4522
|
}
|
|
4515
4523
|
this.errors = t;
|
|
4516
|
-
const
|
|
4524
|
+
const s = { valid: t.length === 0, errors: t };
|
|
4517
4525
|
return this.dispatchEvent(
|
|
4518
|
-
new CustomEvent("baht-validity", { detail:
|
|
4519
|
-
),
|
|
4526
|
+
new CustomEvent("baht-validity", { detail: s, bubbles: !0, composed: !0 })
|
|
4527
|
+
), s;
|
|
4520
4528
|
}
|
|
4521
4529
|
reset() {
|
|
4522
4530
|
this.edits = {}, this.value = {}, this.errors = [], this.scriptStates = {}, this.fieldMessages = {}, this.formMessages = [], this.requestUpdate();
|
|
@@ -4524,13 +4532,13 @@ let z = class extends y {
|
|
|
4524
4532
|
// ---- client scripts (spec 01 §14) ----
|
|
4525
4533
|
/** The `g` (g_form) for the current form — built lazily over this component's state. */
|
|
4526
4534
|
g(t) {
|
|
4527
|
-
return this.scriptContext && this.scriptContextForm === t ? this.scriptContext : (this.scriptContextForm = t, this.scriptContext =
|
|
4535
|
+
return this.scriptContext && this.scriptContextForm === t ? this.scriptContext : (this.scriptContextForm = t, this.scriptContext = ks(t, {
|
|
4528
4536
|
getData: () => this.getData(),
|
|
4529
|
-
setValue: (e,
|
|
4530
|
-
setState: (e,
|
|
4537
|
+
setValue: (e, s) => this.applyScriptValue(e, s),
|
|
4538
|
+
setState: (e, s) => {
|
|
4531
4539
|
this.scriptStates = {
|
|
4532
4540
|
...this.scriptStates,
|
|
4533
|
-
[e]: { ...this.scriptStates[e], ...
|
|
4541
|
+
[e]: { ...this.scriptStates[e], ...s }
|
|
4534
4542
|
};
|
|
4535
4543
|
},
|
|
4536
4544
|
resetState: (e) => {
|
|
@@ -4538,12 +4546,12 @@ let z = class extends y {
|
|
|
4538
4546
|
this.scriptStates = {};
|
|
4539
4547
|
return;
|
|
4540
4548
|
}
|
|
4541
|
-
const
|
|
4542
|
-
delete
|
|
4549
|
+
const s = { ...this.scriptStates };
|
|
4550
|
+
delete s[e], this.scriptStates = s;
|
|
4543
4551
|
},
|
|
4544
|
-
setFieldMessage: (e,
|
|
4552
|
+
setFieldMessage: (e, s) => {
|
|
4545
4553
|
const i = { ...this.fieldMessages };
|
|
4546
|
-
|
|
4554
|
+
s ? i[e] = s : delete i[e], this.fieldMessages = i;
|
|
4547
4555
|
},
|
|
4548
4556
|
addFormMessage: (e) => {
|
|
4549
4557
|
this.formMessages = [...this.formMessages, e];
|
|
@@ -4555,33 +4563,33 @@ let z = class extends y {
|
|
|
4555
4563
|
}
|
|
4556
4564
|
/** A script wrote a value: same path as a user edit (emit + cascade), minus the formatter. */
|
|
4557
4565
|
applyScriptValue(t, e) {
|
|
4558
|
-
const
|
|
4566
|
+
const s = this.getData()[t];
|
|
4559
4567
|
this.edits = { ...this.edits, [t]: e }, this.clearDependents(t), this.syncDynamicOptions(), this.dispatchEvent(
|
|
4560
4568
|
new CustomEvent("baht-change", {
|
|
4561
4569
|
detail: { form_name: this.form.form_name, key: t, value: e, data: this.getData() },
|
|
4562
4570
|
bubbles: !0,
|
|
4563
4571
|
composed: !0
|
|
4564
4572
|
})
|
|
4565
|
-
), this.runChangeScripts(t,
|
|
4573
|
+
), this.runChangeScripts(t, s, e, !1);
|
|
4566
4574
|
}
|
|
4567
|
-
runChangeScripts(t, e,
|
|
4568
|
-
const
|
|
4569
|
-
if (!(!
|
|
4570
|
-
if (this.scriptDepth >=
|
|
4575
|
+
runChangeScripts(t, e, s, i) {
|
|
4576
|
+
const a = this.effectiveForm;
|
|
4577
|
+
if (!(!a || !ge(a, "change", t))) {
|
|
4578
|
+
if (this.scriptDepth >= Ke) {
|
|
4571
4579
|
console.warn(
|
|
4572
|
-
`[bahtui] script cascade on "${
|
|
4580
|
+
`[bahtui] script cascade on "${a.form_name}.${t}" exceeded ${Ke} levels — stopped (setValue ping-pong between change scripts?)`
|
|
4573
4581
|
);
|
|
4574
4582
|
return;
|
|
4575
4583
|
}
|
|
4576
4584
|
this.scriptDepth++;
|
|
4577
4585
|
try {
|
|
4578
4586
|
we({
|
|
4579
|
-
form:
|
|
4587
|
+
form: a,
|
|
4580
4588
|
registry: this.registry,
|
|
4581
|
-
g: this.g(
|
|
4589
|
+
g: this.g(a),
|
|
4582
4590
|
on: "change",
|
|
4583
4591
|
key: t,
|
|
4584
|
-
detail: { oldValue: e, newValue:
|
|
4592
|
+
detail: { oldValue: e, newValue: s, isLoading: i, data: this.getData() }
|
|
4585
4593
|
});
|
|
4586
4594
|
} finally {
|
|
4587
4595
|
this.scriptDepth--;
|
|
@@ -4594,9 +4602,9 @@ let z = class extends y {
|
|
|
4594
4602
|
* workflow reuses this element across steps, so each step loads.
|
|
4595
4603
|
*/
|
|
4596
4604
|
runLoadScripts() {
|
|
4597
|
-
var
|
|
4605
|
+
var s;
|
|
4598
4606
|
const t = this.effectiveForm;
|
|
4599
|
-
if (!((
|
|
4607
|
+
if (!((s = t == null ? void 0 : t.scripts) != null && s.length)) return;
|
|
4600
4608
|
const e = this.getData();
|
|
4601
4609
|
for (const i of t.fields)
|
|
4602
4610
|
i.type === "label" || i.type === "section" || this.runChangeScripts(i.key, void 0, e[i.key], !0);
|
|
@@ -4609,92 +4617,92 @@ let z = class extends y {
|
|
|
4609
4617
|
});
|
|
4610
4618
|
}
|
|
4611
4619
|
updated(t) {
|
|
4612
|
-
super.updated(t),
|
|
4620
|
+
super.updated(t), j() && this.form && this.loadedForm !== this.form && (this.loadedForm = this.form, this.runLoadScripts());
|
|
4613
4621
|
}
|
|
4614
4622
|
// ---- internal ----
|
|
4615
4623
|
onFieldInput(t, e) {
|
|
4616
4624
|
var r;
|
|
4617
4625
|
e.stopPropagation();
|
|
4618
|
-
let { value:
|
|
4626
|
+
let { value: s } = e.detail;
|
|
4619
4627
|
const i = t.formatter ? (r = this.registry.formatters) == null ? void 0 : r[t.formatter] : void 0;
|
|
4620
|
-
t.formatter && !i && console.warn(`[bahtui] unknown formatter "${t.formatter}" — skipped`), i && (
|
|
4621
|
-
const
|
|
4622
|
-
this.edits = { ...this.edits, [t.key]:
|
|
4628
|
+
t.formatter && !i && console.warn(`[bahtui] unknown formatter "${t.formatter}" — skipped`), i && (s = i(s));
|
|
4629
|
+
const a = this.valueFor(t);
|
|
4630
|
+
this.edits = { ...this.edits, [t.key]: s }, this.clearDependents(t.key), this.syncDynamicOptions(), (this.options.validateOn ?? "change") === "change" && this.errors.length > 0 && (this.errors = this.runValidators()), this.dispatchEvent(
|
|
4623
4631
|
new CustomEvent("baht-change", {
|
|
4624
|
-
detail: { form_name: this.form.form_name, key: t.key, value:
|
|
4632
|
+
detail: { form_name: this.form.form_name, key: t.key, value: s, data: this.getData() },
|
|
4625
4633
|
bubbles: !0,
|
|
4626
4634
|
composed: !0
|
|
4627
4635
|
})
|
|
4628
|
-
), this.runChangeScripts(t.key,
|
|
4636
|
+
), this.runChangeScripts(t.key, a, s, !1);
|
|
4629
4637
|
}
|
|
4630
4638
|
/** Validate a single field against current form data (siblings included). */
|
|
4631
4639
|
validateOneField(t) {
|
|
4632
4640
|
const e = this.stateFor(t);
|
|
4633
4641
|
if (!e.visible) return [];
|
|
4634
|
-
const
|
|
4635
|
-
return
|
|
4642
|
+
const s = this.getData(), i = e.required === !!t.required ? t : { ...t, required: e.required };
|
|
4643
|
+
return Ve(i, this.valueFor(t), this.registry, s);
|
|
4636
4644
|
}
|
|
4637
4645
|
/** `validateOn: 'blur'` — validate just the field the user left, same as
|
|
4638
4646
|
* how errors are shown elsewhere (merged into `this.errors`, painted by
|
|
4639
4647
|
* `renderField`/`.baht-error`). No-op for 'change'/'submit' modes. */
|
|
4640
4648
|
onFieldBlur(t) {
|
|
4641
4649
|
if ((this.options.validateOn ?? "change") !== "blur") return;
|
|
4642
|
-
const e = this.validateOneField(t),
|
|
4643
|
-
this.errors = [...
|
|
4650
|
+
const e = this.validateOneField(t), s = this.errors.filter((i) => i.key !== t.key);
|
|
4651
|
+
this.errors = [...s, ...e];
|
|
4644
4652
|
}
|
|
4645
4653
|
renderField(t) {
|
|
4646
4654
|
var b, w;
|
|
4647
4655
|
const e = ys[t.type];
|
|
4648
4656
|
if (!e)
|
|
4649
4657
|
return console.warn(`[bahtui] unknown field type "${t.type}" — skipped`), h;
|
|
4650
|
-
const
|
|
4658
|
+
const s = this.stateFor(t), i = Ai[t.width ?? "full"] ?? "baht-field--w-full", a = ((b = this.errors.find((P) => P.key === t.key)) == null ? void 0 : b.message) ?? null;
|
|
4651
4659
|
if (this.readonly && t.type !== "label" && t.type !== "section")
|
|
4652
|
-
return this.renderReadonlyField(t, i,
|
|
4653
|
-
const r = t.options_from ? { ...t, options: this.dynamicOptions.get(t.key) ?? t.options ?? [] } : t, o = this.valueFor(t), c = !
|
|
4660
|
+
return this.renderReadonlyField(t, i, s.visible);
|
|
4661
|
+
const r = t.options_from ? { ...t, options: this.dynamicOptions.get(t.key) ?? t.options ?? [] } : t, o = this.valueFor(t), c = !s.enabled, m = this.readonly || s.readonly, $ = this.options.inputDebounce, _ = (P) => this.onControlInput(t.key, P), p = Ei(e);
|
|
4654
4662
|
let C;
|
|
4655
4663
|
if (t.type === "repeater") {
|
|
4656
4664
|
const P = this.errors.filter((H) => H.key.startsWith(`${t.key}[`));
|
|
4657
|
-
C =
|
|
4665
|
+
C = se`<${p}
|
|
4658
4666
|
.field=${r}
|
|
4659
4667
|
.value=${o}
|
|
4660
4668
|
.disabled=${c}
|
|
4661
4669
|
.readonly=${m}
|
|
4662
|
-
.required=${
|
|
4670
|
+
.required=${s.required}
|
|
4663
4671
|
.showOptional=${this.showOptional}
|
|
4664
|
-
.error=${
|
|
4672
|
+
.error=${a}
|
|
4665
4673
|
.debounce=${$}
|
|
4666
4674
|
.rowErrors=${P}
|
|
4667
4675
|
@baht-input=${_}
|
|
4668
4676
|
></${p}>`;
|
|
4669
4677
|
} else if (t.type === "file") {
|
|
4670
4678
|
let P;
|
|
4671
|
-
t.uploader && (P = (w = this.registry.uploaders) == null ? void 0 : w[t.uploader], P || console.warn(`[bahtui] unknown uploader "${t.uploader}" — capture only`)), C =
|
|
4679
|
+
t.uploader && (P = (w = this.registry.uploaders) == null ? void 0 : w[t.uploader], P || console.warn(`[bahtui] unknown uploader "${t.uploader}" — capture only`)), C = se`<${p}
|
|
4672
4680
|
.field=${r}
|
|
4673
4681
|
.value=${o}
|
|
4674
4682
|
.disabled=${c}
|
|
4675
4683
|
.readonly=${m}
|
|
4676
|
-
.required=${
|
|
4684
|
+
.required=${s.required}
|
|
4677
4685
|
.showOptional=${this.showOptional}
|
|
4678
|
-
.error=${
|
|
4686
|
+
.error=${a}
|
|
4679
4687
|
.debounce=${$}
|
|
4680
4688
|
.uploader=${P}
|
|
4681
4689
|
@baht-input=${_}
|
|
4682
4690
|
></${p}>`;
|
|
4683
4691
|
} else
|
|
4684
|
-
C =
|
|
4692
|
+
C = se`<${p}
|
|
4685
4693
|
.field=${r}
|
|
4686
4694
|
.value=${o}
|
|
4687
4695
|
.disabled=${c}
|
|
4688
4696
|
.readonly=${m}
|
|
4689
|
-
.required=${
|
|
4697
|
+
.required=${s.required}
|
|
4690
4698
|
.showOptional=${this.showOptional}
|
|
4691
|
-
.error=${
|
|
4699
|
+
.error=${a}
|
|
4692
4700
|
.debounce=${$}
|
|
4693
4701
|
@baht-input=${_}
|
|
4694
4702
|
></${p}>`;
|
|
4695
4703
|
const g = this.fieldMessages[t.key];
|
|
4696
4704
|
return l`<div
|
|
4697
|
-
class="baht-field ${i} ${
|
|
4705
|
+
class="baht-field ${i} ${s.visible ? "" : "baht-field--hidden"}"
|
|
4698
4706
|
data-key=${t.key}
|
|
4699
4707
|
data-type=${t.type}
|
|
4700
4708
|
data-testid="${this.form.form_id}.${t.key}"
|
|
@@ -4715,14 +4723,14 @@ let z = class extends y {
|
|
|
4715
4723
|
*/
|
|
4716
4724
|
onControlInput(t, e) {
|
|
4717
4725
|
var i;
|
|
4718
|
-
const
|
|
4719
|
-
|
|
4726
|
+
const s = (i = this.effectiveForm) == null ? void 0 : i.fields.find((a) => a.key === t);
|
|
4727
|
+
s && this.onFieldInput(s, e);
|
|
4720
4728
|
}
|
|
4721
|
-
renderReadonlyField(t, e,
|
|
4722
|
-
const i = t.options_from ? this.dynamicOptions.get(t.key) ?? t.options ?? [] : t.options,
|
|
4723
|
-
>${
|
|
4729
|
+
renderReadonlyField(t, e, s) {
|
|
4730
|
+
const i = t.options_from ? this.dynamicOptions.get(t.key) ?? t.options ?? [] : t.options, a = Os(t, this.valueFor(t), i), r = a.kind === "empty" ? l`<span class="baht-readonly-value baht-readonly-value--empty">${u("emptyValue")}</span>` : a.kind === "text" ? l`<span class="baht-readonly-value">${a.text}</span>` : a.kind === "chips" ? l`<span class="baht-readonly-value baht-readonly-chips"
|
|
4731
|
+
>${a.items.map((o) => l`<span class="baht-readonly-chip">${o}</span>`)}</span
|
|
4724
4732
|
>` : l`<div class="baht-readonly-rows">
|
|
4725
|
-
${
|
|
4733
|
+
${a.rows.map(
|
|
4726
4734
|
(o) => l`<div class="baht-readonly-row">
|
|
4727
4735
|
${o.map(
|
|
4728
4736
|
(c) => l`<span class="baht-readonly-cell"
|
|
@@ -4734,7 +4742,7 @@ let z = class extends y {
|
|
|
4734
4742
|
)}
|
|
4735
4743
|
</div>`;
|
|
4736
4744
|
return l`<div
|
|
4737
|
-
class="baht-field ${e} baht-field--readonly ${
|
|
4745
|
+
class="baht-field ${e} baht-field--readonly ${s ? "" : "baht-field--hidden"}"
|
|
4738
4746
|
data-key=${t.key}
|
|
4739
4747
|
data-type=${t.type}
|
|
4740
4748
|
data-testid="${this.form.form_id}.${t.key}"
|
|
@@ -4808,10 +4816,10 @@ U([
|
|
|
4808
4816
|
z = U([
|
|
4809
4817
|
f("baht-form")
|
|
4810
4818
|
], z);
|
|
4811
|
-
var
|
|
4812
|
-
for (var
|
|
4813
|
-
(o = t[r]) && (
|
|
4814
|
-
return i &&
|
|
4819
|
+
var Li = Object.defineProperty, Ni = Object.getOwnPropertyDescriptor, V = (t, e, s, i) => {
|
|
4820
|
+
for (var a = i > 1 ? void 0 : i ? Ni(e, s) : e, r = t.length - 1, o; r >= 0; r--)
|
|
4821
|
+
(o = t[r]) && (a = (i ? o(e, s, a) : o(a)) || a);
|
|
4822
|
+
return i && a && Li(e, s, a), a;
|
|
4815
4823
|
};
|
|
4816
4824
|
let N = class extends y {
|
|
4817
4825
|
constructor() {
|
|
@@ -4828,19 +4836,19 @@ let N = class extends y {
|
|
|
4828
4836
|
}), this.flagCache.out) : this.workflow;
|
|
4829
4837
|
}
|
|
4830
4838
|
willUpdate(t) {
|
|
4831
|
-
var e,
|
|
4832
|
-
t.has("workflow") || t.has("value") ? (this.data = structuredClone(this.value ?? {}), this.reevaluate(), this.history = [], this.current = ((e = this.visibleForms[0]) == null ? void 0 : e.form_name) ?? null, this.approvalError = null) : t.has("flags") && (this.reevaluate(), this.current && !this.visibleForms.some((i) => i.form_name === this.current) && (this.current = ((
|
|
4839
|
+
var e, s;
|
|
4840
|
+
t.has("workflow") || t.has("value") ? (this.data = structuredClone(this.value ?? {}), this.reevaluate(), this.history = [], this.current = ((e = this.visibleForms[0]) == null ? void 0 : e.form_name) ?? null, this.approvalError = null) : t.has("flags") && (this.reevaluate(), this.current && !this.visibleForms.some((i) => i.form_name === this.current) && (this.current = ((s = this.visibleForms[0]) == null ? void 0 : s.form_name) ?? null));
|
|
4833
4841
|
}
|
|
4834
4842
|
reevaluate() {
|
|
4835
|
-
this.derived =
|
|
4843
|
+
this.derived = Ps(this.effectiveWorkflow, this.data), this.data = this.derived.data;
|
|
4836
4844
|
}
|
|
4837
4845
|
/** Forms in ascending order whose derived visibility is true. */
|
|
4838
4846
|
get visibleForms() {
|
|
4839
4847
|
var e;
|
|
4840
|
-
const t = [...((e = this.effectiveWorkflow) == null ? void 0 : e.forms) ?? []].sort((
|
|
4841
|
-
return this.derived ? t.filter((
|
|
4848
|
+
const t = [...((e = this.effectiveWorkflow) == null ? void 0 : e.forms) ?? []].sort((s, i) => s.order - i.order);
|
|
4849
|
+
return this.derived ? t.filter((s) => {
|
|
4842
4850
|
var i;
|
|
4843
|
-
return ((i = this.derived.forms[
|
|
4851
|
+
return ((i = this.derived.forms[s.form_name]) == null ? void 0 : i.visible) !== !1;
|
|
4844
4852
|
}) : t;
|
|
4845
4853
|
}
|
|
4846
4854
|
get currentForm() {
|
|
@@ -4852,9 +4860,9 @@ let N = class extends y {
|
|
|
4852
4860
|
if (!this.current) return "end";
|
|
4853
4861
|
const t = this.effectiveWorkflow;
|
|
4854
4862
|
if (t.transitions && t.transitions.length > 0)
|
|
4855
|
-
return
|
|
4856
|
-
const e = this.visibleForms,
|
|
4857
|
-
return ((i = e[
|
|
4863
|
+
return Cs(t, this.current, this.data);
|
|
4864
|
+
const e = this.visibleForms, s = e.findIndex((a) => a.form_name === this.current);
|
|
4865
|
+
return ((i = e[s + 1]) == null ? void 0 : i.form_name) ?? "end";
|
|
4858
4866
|
}
|
|
4859
4867
|
get isLast() {
|
|
4860
4868
|
return this.current !== null && this.navTarget === "end";
|
|
@@ -4862,9 +4870,9 @@ let N = class extends y {
|
|
|
4862
4870
|
fieldStatesFor(t) {
|
|
4863
4871
|
const e = {};
|
|
4864
4872
|
if (!this.derived) return e;
|
|
4865
|
-
const
|
|
4866
|
-
for (const [i,
|
|
4867
|
-
i.startsWith(
|
|
4873
|
+
const s = `${t}.`;
|
|
4874
|
+
for (const [i, a] of Object.entries(this.derived.fields))
|
|
4875
|
+
i.startsWith(s) && (e[i.slice(s.length)] = a);
|
|
4868
4876
|
return e;
|
|
4869
4877
|
}
|
|
4870
4878
|
get formEl() {
|
|
@@ -4881,8 +4889,8 @@ let N = class extends y {
|
|
|
4881
4889
|
* that re-feeding the `value` prop causes.
|
|
4882
4890
|
*/
|
|
4883
4891
|
setValue(t, e) {
|
|
4884
|
-
var
|
|
4885
|
-
this.data = { ...this.data, [t]: { ...this.data[t], ...e } }, this.reevaluate(), this.current && !this.visibleForms.some((i) => i.form_name === this.current) && (this.current = ((
|
|
4892
|
+
var s;
|
|
4893
|
+
this.data = { ...this.data, [t]: { ...this.data[t], ...e } }, this.reevaluate(), this.current && !this.visibleForms.some((i) => i.form_name === this.current) && (this.current = ((s = this.visibleForms[0]) == null ? void 0 : s.form_name) ?? null), this.emit("baht-data-change", { data: this.getData() });
|
|
4886
4894
|
}
|
|
4887
4895
|
next() {
|
|
4888
4896
|
const t = this.currentForm;
|
|
@@ -4896,20 +4904,20 @@ let N = class extends y {
|
|
|
4896
4904
|
}
|
|
4897
4905
|
/** Advance past the current form: submit+complete at 'end', else step to navTarget. */
|
|
4898
4906
|
advance(t = {}) {
|
|
4899
|
-
const e = { ...t, data: this.getData() },
|
|
4900
|
-
if (
|
|
4907
|
+
const e = { ...t, data: this.getData() }, s = this.navTarget;
|
|
4908
|
+
if (s === "end") {
|
|
4901
4909
|
this.emit("baht-submit", e), this.emit("baht-complete", { data: this.getData(), status: "completed" });
|
|
4902
4910
|
return;
|
|
4903
4911
|
}
|
|
4904
|
-
const i = this.visibleForms.find((
|
|
4912
|
+
const i = this.visibleForms.find((a) => a.form_name === s);
|
|
4905
4913
|
if (!i || i.form_name === this.current) {
|
|
4906
|
-
const
|
|
4914
|
+
const a = i ? "self-transition" : "target-hidden";
|
|
4907
4915
|
console.warn(
|
|
4908
|
-
`[bahtui] cannot advance from "${this.current}": target "${
|
|
4916
|
+
`[bahtui] cannot advance from "${this.current}": target "${s}" is ` + (i ? "the current form (self-transition)" : "not visible")
|
|
4909
4917
|
), this.emit("baht-nav-blocked", {
|
|
4910
4918
|
form_name: this.current,
|
|
4911
|
-
target:
|
|
4912
|
-
reason:
|
|
4919
|
+
target: s,
|
|
4920
|
+
reason: a,
|
|
4913
4921
|
data: this.getData()
|
|
4914
4922
|
});
|
|
4915
4923
|
return;
|
|
@@ -4932,8 +4940,8 @@ let N = class extends y {
|
|
|
4932
4940
|
var m;
|
|
4933
4941
|
const e = this.currentForm;
|
|
4934
4942
|
if (!e || e.kind !== "approval") return;
|
|
4935
|
-
const
|
|
4936
|
-
if ((
|
|
4943
|
+
const s = e.approval ?? {}, i = String(((m = this.data[e.form_name]) == null ? void 0 : m.comment) ?? ""), a = s.comment ?? "optional";
|
|
4944
|
+
if ((a === "required" || a === "requireOnReject" && t === "rejected") && i.trim() === "") {
|
|
4937
4945
|
this.approvalError = u("commentRequired");
|
|
4938
4946
|
return;
|
|
4939
4947
|
}
|
|
@@ -4947,23 +4955,23 @@ let N = class extends y {
|
|
|
4947
4955
|
return;
|
|
4948
4956
|
}
|
|
4949
4957
|
this.emit("baht-reject", o);
|
|
4950
|
-
const c =
|
|
4958
|
+
const c = s.on_reject ?? { action: "end" };
|
|
4951
4959
|
c.action === "goto" && this.visibleForms.some(($) => $.form_name === c.form) ? this.gotoForm(c.form) : this.emit("baht-complete", { data: this.getData(), status: "rejected" });
|
|
4952
4960
|
}
|
|
4953
4961
|
/** Jump back to a visible form, truncating the history to that point. */
|
|
4954
4962
|
gotoForm(t) {
|
|
4955
4963
|
const e = this.history.indexOf(t);
|
|
4956
4964
|
this.history = e >= 0 ? this.history.slice(0, e) : [], this.current = t;
|
|
4957
|
-
const
|
|
4958
|
-
this.emit("baht-step-change", { form_name: t, order: (
|
|
4965
|
+
const s = this.effectiveWorkflow.forms.find((i) => i.form_name === t);
|
|
4966
|
+
this.emit("baht-step-change", { form_name: t, order: (s == null ? void 0 : s.order) ?? 0, direction: "back" });
|
|
4959
4967
|
}
|
|
4960
4968
|
back() {
|
|
4961
4969
|
let t = this.history.pop();
|
|
4962
|
-
for (; t !== void 0 && !this.visibleForms.some((
|
|
4970
|
+
for (; t !== void 0 && !this.visibleForms.some((s) => s.form_name === t); )
|
|
4963
4971
|
t = this.history.pop();
|
|
4964
4972
|
if (!t) return;
|
|
4965
4973
|
this.current = t, this.approvalError = null;
|
|
4966
|
-
const e = this.effectiveWorkflow.forms.find((
|
|
4974
|
+
const e = this.effectiveWorkflow.forms.find((s) => s.form_name === t);
|
|
4967
4975
|
this.emit("baht-step-change", { form_name: t, order: (e == null ? void 0 : e.order) ?? 0, direction: "back" });
|
|
4968
4976
|
}
|
|
4969
4977
|
gotoStart() {
|
|
@@ -4972,10 +4980,10 @@ let N = class extends y {
|
|
|
4972
4980
|
}
|
|
4973
4981
|
// ---- internal ----
|
|
4974
4982
|
onFormChange(t) {
|
|
4975
|
-
var
|
|
4983
|
+
var a;
|
|
4976
4984
|
t.stopPropagation();
|
|
4977
|
-
const { form_name: e, key:
|
|
4978
|
-
this.data = { ...this.data, [e]: { ...this.data[e], [
|
|
4985
|
+
const { form_name: e, key: s, value: i } = t.detail;
|
|
4986
|
+
this.data = { ...this.data, [e]: { ...this.data[e], [s]: i } }, this.reevaluate(), this.current && !this.visibleForms.some((r) => r.form_name === this.current) && (this.current = ((a = this.visibleForms[0]) == null ? void 0 : a.form_name) ?? null), this.emit("baht-data-change", { data: this.getData() });
|
|
4979
4987
|
}
|
|
4980
4988
|
onCommentInput(t, e) {
|
|
4981
4989
|
this.data = { ...this.data, [t]: { ...this.data[t], comment: e } }, this.reevaluate(), e.trim() !== "" && (this.approvalError = null), this.emit("baht-data-change", { data: this.getData() });
|
|
@@ -4984,17 +4992,17 @@ let N = class extends y {
|
|
|
4984
4992
|
/** Forms the approval step summarizes: configured list, else every earlier plain form. */
|
|
4985
4993
|
summary_forms(t) {
|
|
4986
4994
|
var i;
|
|
4987
|
-
const e = (i = t.approval) == null ? void 0 : i.summary_forms,
|
|
4988
|
-
(
|
|
4995
|
+
const e = (i = t.approval) == null ? void 0 : i.summary_forms, s = this.visibleForms.filter(
|
|
4996
|
+
(a) => a.form_name !== t.form_name && a.kind !== "approval"
|
|
4989
4997
|
);
|
|
4990
|
-
return e ?
|
|
4998
|
+
return e ? s.filter((a) => e.includes(a.form_name)) : s.filter((a) => a.order < t.order);
|
|
4991
4999
|
}
|
|
4992
5000
|
renderApproval(t) {
|
|
4993
|
-
var i,
|
|
4994
|
-
const e = ((i = t.approval) == null ? void 0 : i.comment) ?? "optional",
|
|
5001
|
+
var i, a;
|
|
5002
|
+
const e = ((i = t.approval) == null ? void 0 : i.comment) ?? "optional", s = this.summary_forms(t);
|
|
4995
5003
|
return l`<div class="baht-approval">
|
|
4996
5004
|
<div class="baht-approval-summary">
|
|
4997
|
-
${
|
|
5005
|
+
${s.length === 0 ? l`<p class="baht-approval-empty">${u("nothingToReview")}</p>` : s.map(
|
|
4998
5006
|
(r) => l`<section class="baht-approval-group">
|
|
4999
5007
|
<h4 class="baht-approval-group-title">${r.form_name}</h4>
|
|
5000
5008
|
<baht-form
|
|
@@ -5014,7 +5022,7 @@ let N = class extends y {
|
|
|
5014
5022
|
rows="3"
|
|
5015
5023
|
aria-required=${e === "required" ? "true" : h}
|
|
5016
5024
|
aria-invalid=${this.approvalError ? "true" : h}
|
|
5017
|
-
.value=${String(((
|
|
5025
|
+
.value=${String(((a = this.data[t.form_name]) == null ? void 0 : a.comment) ?? "")}
|
|
5018
5026
|
@input=${(r) => this.onCommentInput(t.form_name, r.target.value)}
|
|
5019
5027
|
></textarea>
|
|
5020
5028
|
</label>` : h}
|
|
@@ -5022,20 +5030,20 @@ let N = class extends y {
|
|
|
5022
5030
|
</div>`;
|
|
5023
5031
|
}
|
|
5024
5032
|
render() {
|
|
5025
|
-
var
|
|
5033
|
+
var a, r;
|
|
5026
5034
|
const t = this.currentForm;
|
|
5027
5035
|
if (!t) return l`<div class="baht-workflow"></div>`;
|
|
5028
|
-
const e = t.kind === "approval",
|
|
5036
|
+
const e = t.kind === "approval", s = this.visibleForms, i = s.findIndex((o) => o.form_name === t.form_name);
|
|
5029
5037
|
return l`<div
|
|
5030
5038
|
class="baht-workflow"
|
|
5031
5039
|
data-step=${t.form_name}
|
|
5032
5040
|
data-testid="${this.workflow.workflow_id}.${t.form_name}"
|
|
5033
5041
|
>
|
|
5034
5042
|
<div class="baht-visually-hidden" role="status">
|
|
5035
|
-
${u("step", { current: i + 1, total:
|
|
5043
|
+
${u("step", { current: i + 1, total: s.length })}
|
|
5036
5044
|
</div>
|
|
5037
5045
|
${this.showSteps ? l`<baht-steps
|
|
5038
|
-
.steps=${
|
|
5046
|
+
.steps=${s.map((o) => o.form_name)}
|
|
5039
5047
|
.current=${i}
|
|
5040
5048
|
.variant=${this.stepsVariant}
|
|
5041
5049
|
></baht-steps>` : h}
|
|
@@ -5060,7 +5068,7 @@ let N = class extends y {
|
|
|
5060
5068
|
data-testid="${this.workflow.workflow_id}.reject"
|
|
5061
5069
|
@click=${() => this.decide("rejected")}
|
|
5062
5070
|
>
|
|
5063
|
-
${((
|
|
5071
|
+
${((a = t.approval) == null ? void 0 : a.reject_label) ?? u("reject")}
|
|
5064
5072
|
</button>
|
|
5065
5073
|
<button
|
|
5066
5074
|
type="button"
|
|
@@ -5133,24 +5141,24 @@ export {
|
|
|
5133
5141
|
St as B,
|
|
5134
5142
|
ht as C,
|
|
5135
5143
|
Pt as D,
|
|
5136
|
-
|
|
5144
|
+
Ye as E,
|
|
5137
5145
|
lt as F,
|
|
5138
5146
|
vt as G,
|
|
5139
5147
|
A as H,
|
|
5140
5148
|
Ae as I,
|
|
5141
|
-
|
|
5149
|
+
Te as J,
|
|
5142
5150
|
ne as K,
|
|
5143
|
-
|
|
5151
|
+
Kt as L,
|
|
5144
5152
|
ct as M,
|
|
5145
5153
|
oe as N,
|
|
5146
5154
|
W as O,
|
|
5147
|
-
|
|
5148
|
-
|
|
5155
|
+
Ut as P,
|
|
5156
|
+
Gt as Q,
|
|
5149
5157
|
x as R,
|
|
5150
|
-
|
|
5151
|
-
|
|
5158
|
+
Be as S,
|
|
5159
|
+
He as T,
|
|
5152
5160
|
Me as U,
|
|
5153
|
-
|
|
5161
|
+
Ze as V,
|
|
5154
5162
|
Ot as W,
|
|
5155
5163
|
F as X,
|
|
5156
5164
|
S as Y,
|
|
@@ -5158,34 +5166,34 @@ export {
|
|
|
5158
5166
|
ys as _,
|
|
5159
5167
|
mt as a,
|
|
5160
5168
|
as as a0,
|
|
5161
|
-
|
|
5169
|
+
ti as a1,
|
|
5162
5170
|
zt as a2,
|
|
5163
5171
|
he as a3,
|
|
5164
|
-
|
|
5172
|
+
je as a4,
|
|
5165
5173
|
me as a5,
|
|
5166
|
-
|
|
5174
|
+
Vt as b,
|
|
5167
5175
|
K as c,
|
|
5168
5176
|
le as d,
|
|
5169
5177
|
Ct as e,
|
|
5170
5178
|
at as f,
|
|
5171
|
-
|
|
5179
|
+
Xe as g,
|
|
5172
5180
|
re as h,
|
|
5173
|
-
|
|
5174
|
-
|
|
5181
|
+
Ie as i,
|
|
5182
|
+
Qe as j,
|
|
5175
5183
|
Q as k,
|
|
5176
|
-
|
|
5177
|
-
|
|
5184
|
+
Ht as l,
|
|
5185
|
+
It as m,
|
|
5178
5186
|
Dt as n,
|
|
5179
5187
|
Mt as o,
|
|
5180
5188
|
yt as p,
|
|
5181
5189
|
z as q,
|
|
5182
5190
|
pt as r,
|
|
5183
|
-
|
|
5191
|
+
Ue as s,
|
|
5184
5192
|
dt as t,
|
|
5185
5193
|
st as u,
|
|
5186
5194
|
Ft as v,
|
|
5187
5195
|
ot as w,
|
|
5188
5196
|
J as x,
|
|
5189
|
-
|
|
5190
|
-
|
|
5197
|
+
Je as y,
|
|
5198
|
+
Ge as z
|
|
5191
5199
|
};
|