@cal.macconnachie/web-components 0.0.1

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.
@@ -0,0 +1,2479 @@
1
+ const z = globalThis, Z = z.ShadowRoot && (z.ShadyCSS === void 0 || z.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, Q = Symbol(), ot = /* @__PURE__ */ new WeakMap();
2
+ let wt = class {
3
+ constructor(t, s, i) {
4
+ if (this._$cssResult$ = !0, i !== Q) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
5
+ this.cssText = t, this.t = s;
6
+ }
7
+ get styleSheet() {
8
+ let t = this.o;
9
+ const s = this.t;
10
+ if (Z && t === void 0) {
11
+ const i = s !== void 0 && s.length === 1;
12
+ i && (t = ot.get(s)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), i && ot.set(s, t));
13
+ }
14
+ return t;
15
+ }
16
+ toString() {
17
+ return this.cssText;
18
+ }
19
+ };
20
+ const xt = (e) => new wt(typeof e == "string" ? e : e + "", void 0, Q), Et = (e, ...t) => {
21
+ const s = e.length === 1 ? e[0] : t.reduce(((i, r, o) => i + ((a) => {
22
+ if (a._$cssResult$ === !0) return a.cssText;
23
+ if (typeof a == "number") return a;
24
+ throw Error("Value passed to 'css' function must be a 'css' function result: " + a + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
25
+ })(r) + e[o + 1]), e[0]);
26
+ return new wt(s, e, Q);
27
+ }, Tt = (e, t) => {
28
+ if (Z) e.adoptedStyleSheets = t.map(((s) => s instanceof CSSStyleSheet ? s : s.styleSheet));
29
+ else for (const s of t) {
30
+ const i = document.createElement("style"), r = z.litNonce;
31
+ r !== void 0 && i.setAttribute("nonce", r), i.textContent = s.cssText, e.appendChild(i);
32
+ }
33
+ }, at = Z ? (e) => e : (e) => e instanceof CSSStyleSheet ? ((t) => {
34
+ let s = "";
35
+ for (const i of t.cssRules) s += i.cssText;
36
+ return xt(s);
37
+ })(e) : e;
38
+ const { is: Pt, defineProperty: Ot, getOwnPropertyDescriptor: Dt, getOwnPropertyNames: Ut, getOwnPropertySymbols: Rt, getPrototypeOf: It } = Object, F = globalThis, nt = F.trustedTypes, Nt = nt ? nt.emptyScript : "", Lt = F.reactiveElementPolyfillSupport, M = (e, t) => e, Y = { toAttribute(e, t) {
39
+ switch (t) {
40
+ case Boolean:
41
+ e = e ? Nt : null;
42
+ break;
43
+ case Object:
44
+ case Array:
45
+ e = e == null ? e : JSON.stringify(e);
46
+ }
47
+ return e;
48
+ }, fromAttribute(e, t) {
49
+ let s = e;
50
+ switch (t) {
51
+ case Boolean:
52
+ s = e !== null;
53
+ break;
54
+ case Number:
55
+ s = e === null ? null : Number(e);
56
+ break;
57
+ case Object:
58
+ case Array:
59
+ try {
60
+ s = JSON.parse(e);
61
+ } catch {
62
+ s = null;
63
+ }
64
+ }
65
+ return s;
66
+ } }, X = (e, t) => !Pt(e, t), lt = { attribute: !0, type: String, converter: Y, reflect: !1, useDefault: !1, hasChanged: X };
67
+ Symbol.metadata ??= Symbol("metadata"), F.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
68
+ let U = class extends HTMLElement {
69
+ static addInitializer(t) {
70
+ this._$Ei(), (this.l ??= []).push(t);
71
+ }
72
+ static get observedAttributes() {
73
+ return this.finalize(), this._$Eh && [...this._$Eh.keys()];
74
+ }
75
+ static createProperty(t, s = lt) {
76
+ if (s.state && (s.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((s = Object.create(s)).wrapped = !0), this.elementProperties.set(t, s), !s.noAccessor) {
77
+ const i = Symbol(), r = this.getPropertyDescriptor(t, i, s);
78
+ r !== void 0 && Ot(this.prototype, t, r);
79
+ }
80
+ }
81
+ static getPropertyDescriptor(t, s, i) {
82
+ const { get: r, set: o } = Dt(this.prototype, t) ?? { get() {
83
+ return this[s];
84
+ }, set(a) {
85
+ this[s] = a;
86
+ } };
87
+ return { get: r, set(a) {
88
+ const h = r?.call(this);
89
+ o?.call(this, a), this.requestUpdate(t, h, i);
90
+ }, configurable: !0, enumerable: !0 };
91
+ }
92
+ static getPropertyOptions(t) {
93
+ return this.elementProperties.get(t) ?? lt;
94
+ }
95
+ static _$Ei() {
96
+ if (this.hasOwnProperty(M("elementProperties"))) return;
97
+ const t = It(this);
98
+ t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
99
+ }
100
+ static finalize() {
101
+ if (this.hasOwnProperty(M("finalized"))) return;
102
+ if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(M("properties"))) {
103
+ const s = this.properties, i = [...Ut(s), ...Rt(s)];
104
+ for (const r of i) this.createProperty(r, s[r]);
105
+ }
106
+ const t = this[Symbol.metadata];
107
+ if (t !== null) {
108
+ const s = litPropertyMetadata.get(t);
109
+ if (s !== void 0) for (const [i, r] of s) this.elementProperties.set(i, r);
110
+ }
111
+ this._$Eh = /* @__PURE__ */ new Map();
112
+ for (const [s, i] of this.elementProperties) {
113
+ const r = this._$Eu(s, i);
114
+ r !== void 0 && this._$Eh.set(r, s);
115
+ }
116
+ this.elementStyles = this.finalizeStyles(this.styles);
117
+ }
118
+ static finalizeStyles(t) {
119
+ const s = [];
120
+ if (Array.isArray(t)) {
121
+ const i = new Set(t.flat(1 / 0).reverse());
122
+ for (const r of i) s.unshift(at(r));
123
+ } else t !== void 0 && s.push(at(t));
124
+ return s;
125
+ }
126
+ static _$Eu(t, s) {
127
+ const i = s.attribute;
128
+ return i === !1 ? void 0 : typeof i == "string" ? i : typeof t == "string" ? t.toLowerCase() : void 0;
129
+ }
130
+ constructor() {
131
+ super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
132
+ }
133
+ _$Ev() {
134
+ this._$ES = new Promise(((t) => this.enableUpdating = t)), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach(((t) => t(this)));
135
+ }
136
+ addController(t) {
137
+ (this._$EO ??= /* @__PURE__ */ new Set()).add(t), this.renderRoot !== void 0 && this.isConnected && t.hostConnected?.();
138
+ }
139
+ removeController(t) {
140
+ this._$EO?.delete(t);
141
+ }
142
+ _$E_() {
143
+ const t = /* @__PURE__ */ new Map(), s = this.constructor.elementProperties;
144
+ for (const i of s.keys()) this.hasOwnProperty(i) && (t.set(i, this[i]), delete this[i]);
145
+ t.size > 0 && (this._$Ep = t);
146
+ }
147
+ createRenderRoot() {
148
+ const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
149
+ return Tt(t, this.constructor.elementStyles), t;
150
+ }
151
+ connectedCallback() {
152
+ this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach(((t) => t.hostConnected?.()));
153
+ }
154
+ enableUpdating(t) {
155
+ }
156
+ disconnectedCallback() {
157
+ this._$EO?.forEach(((t) => t.hostDisconnected?.()));
158
+ }
159
+ attributeChangedCallback(t, s, i) {
160
+ this._$AK(t, i);
161
+ }
162
+ _$ET(t, s) {
163
+ const i = this.constructor.elementProperties.get(t), r = this.constructor._$Eu(t, i);
164
+ if (r !== void 0 && i.reflect === !0) {
165
+ const o = (i.converter?.toAttribute !== void 0 ? i.converter : Y).toAttribute(s, i.type);
166
+ this._$Em = t, o == null ? this.removeAttribute(r) : this.setAttribute(r, o), this._$Em = null;
167
+ }
168
+ }
169
+ _$AK(t, s) {
170
+ const i = this.constructor, r = i._$Eh.get(t);
171
+ if (r !== void 0 && this._$Em !== r) {
172
+ const o = i.getPropertyOptions(r), a = typeof o.converter == "function" ? { fromAttribute: o.converter } : o.converter?.fromAttribute !== void 0 ? o.converter : Y;
173
+ this._$Em = r;
174
+ const h = a.fromAttribute(s, o.type);
175
+ this[r] = h ?? this._$Ej?.get(r) ?? h, this._$Em = null;
176
+ }
177
+ }
178
+ requestUpdate(t, s, i) {
179
+ if (t !== void 0) {
180
+ const r = this.constructor, o = this[t];
181
+ if (i ??= r.getPropertyOptions(t), !((i.hasChanged ?? X)(o, s) || i.useDefault && i.reflect && o === this._$Ej?.get(t) && !this.hasAttribute(r._$Eu(t, i)))) return;
182
+ this.C(t, s, i);
183
+ }
184
+ this.isUpdatePending === !1 && (this._$ES = this._$EP());
185
+ }
186
+ C(t, s, { useDefault: i, reflect: r, wrapped: o }, a) {
187
+ i && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(t) && (this._$Ej.set(t, a ?? s ?? this[t]), o !== !0 || a !== void 0) || (this._$AL.has(t) || (this.hasUpdated || i || (s = void 0), this._$AL.set(t, s)), r === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
188
+ }
189
+ async _$EP() {
190
+ this.isUpdatePending = !0;
191
+ try {
192
+ await this._$ES;
193
+ } catch (s) {
194
+ Promise.reject(s);
195
+ }
196
+ const t = this.scheduleUpdate();
197
+ return t != null && await t, !this.isUpdatePending;
198
+ }
199
+ scheduleUpdate() {
200
+ return this.performUpdate();
201
+ }
202
+ performUpdate() {
203
+ if (!this.isUpdatePending) return;
204
+ if (!this.hasUpdated) {
205
+ if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
206
+ for (const [r, o] of this._$Ep) this[r] = o;
207
+ this._$Ep = void 0;
208
+ }
209
+ const i = this.constructor.elementProperties;
210
+ if (i.size > 0) for (const [r, o] of i) {
211
+ const { wrapped: a } = o, h = this[r];
212
+ a !== !0 || this._$AL.has(r) || h === void 0 || this.C(r, void 0, o, h);
213
+ }
214
+ }
215
+ let t = !1;
216
+ const s = this._$AL;
217
+ try {
218
+ t = this.shouldUpdate(s), t ? (this.willUpdate(s), this._$EO?.forEach(((i) => i.hostUpdate?.())), this.update(s)) : this._$EM();
219
+ } catch (i) {
220
+ throw t = !1, this._$EM(), i;
221
+ }
222
+ t && this._$AE(s);
223
+ }
224
+ willUpdate(t) {
225
+ }
226
+ _$AE(t) {
227
+ this._$EO?.forEach(((s) => s.hostUpdated?.())), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
228
+ }
229
+ _$EM() {
230
+ this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
231
+ }
232
+ get updateComplete() {
233
+ return this.getUpdateComplete();
234
+ }
235
+ getUpdateComplete() {
236
+ return this._$ES;
237
+ }
238
+ shouldUpdate(t) {
239
+ return !0;
240
+ }
241
+ update(t) {
242
+ this._$Eq &&= this._$Eq.forEach(((s) => this._$ET(s, this[s]))), this._$EM();
243
+ }
244
+ updated(t) {
245
+ }
246
+ firstUpdated(t) {
247
+ }
248
+ };
249
+ U.elementStyles = [], U.shadowRootOptions = { mode: "open" }, U[M("elementProperties")] = /* @__PURE__ */ new Map(), U[M("finalized")] = /* @__PURE__ */ new Map(), Lt?.({ ReactiveElement: U }), (F.reactiveElementVersions ??= []).push("2.1.1");
250
+ const tt = globalThis, K = tt.trustedTypes, ht = K ? K.createPolicy("lit-html", { createHTML: (e) => e }) : void 0, bt = "$lit$", C = `lit$${Math.random().toFixed(9).slice(2)}$`, vt = "?" + C, Mt = `<${vt}>`, D = document, j = () => D.createComment(""), q = (e) => e === null || typeof e != "object" && typeof e != "function", et = Array.isArray, Ht = (e) => et(e) || typeof e?.[Symbol.iterator] == "function", W = `[
251
+ \f\r]`, N = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, ct = /-->/g, dt = />/g, T = RegExp(`>|${W}(?:([^\\s"'>=/]+)(${W}*=${W}*(?:[^
252
+ \f\r"'\`<>=]|("|')|))|$)`, "g"), pt = /'/g, ut = /"/g, At = /^(?:script|style|textarea|title)$/i, jt = (e) => (t, ...s) => ({ _$litType$: e, strings: t, values: s }), f = jt(1), x = Symbol.for("lit-noChange"), g = Symbol.for("lit-nothing"), gt = /* @__PURE__ */ new WeakMap(), O = D.createTreeWalker(D, 129);
253
+ function _t(e, t) {
254
+ if (!et(e) || !e.hasOwnProperty("raw")) throw Error("invalid template strings array");
255
+ return ht !== void 0 ? ht.createHTML(t) : t;
256
+ }
257
+ const qt = (e, t) => {
258
+ const s = e.length - 1, i = [];
259
+ let r, o = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", a = N;
260
+ for (let h = 0; h < s; h++) {
261
+ const n = e[h];
262
+ let c, p, l = -1, d = 0;
263
+ for (; d < n.length && (a.lastIndex = d, p = a.exec(n), p !== null); ) d = a.lastIndex, a === N ? p[1] === "!--" ? a = ct : p[1] !== void 0 ? a = dt : p[2] !== void 0 ? (At.test(p[2]) && (r = RegExp("</" + p[2], "g")), a = T) : p[3] !== void 0 && (a = T) : a === T ? p[0] === ">" ? (a = r ?? N, l = -1) : p[1] === void 0 ? l = -2 : (l = a.lastIndex - p[2].length, c = p[1], a = p[3] === void 0 ? T : p[3] === '"' ? ut : pt) : a === ut || a === pt ? a = T : a === ct || a === dt ? a = N : (a = T, r = void 0);
264
+ const u = a === T && e[h + 1].startsWith("/>") ? " " : "";
265
+ o += a === N ? n + Mt : l >= 0 ? (i.push(c), n.slice(0, l) + bt + n.slice(l) + C + u) : n + C + (l === -2 ? h : u);
266
+ }
267
+ return [_t(e, o + (e[s] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), i];
268
+ };
269
+ class B {
270
+ constructor({ strings: t, _$litType$: s }, i) {
271
+ let r;
272
+ this.parts = [];
273
+ let o = 0, a = 0;
274
+ const h = t.length - 1, n = this.parts, [c, p] = qt(t, s);
275
+ if (this.el = B.createElement(c, i), O.currentNode = this.el.content, s === 2 || s === 3) {
276
+ const l = this.el.content.firstChild;
277
+ l.replaceWith(...l.childNodes);
278
+ }
279
+ for (; (r = O.nextNode()) !== null && n.length < h; ) {
280
+ if (r.nodeType === 1) {
281
+ if (r.hasAttributes()) for (const l of r.getAttributeNames()) if (l.endsWith(bt)) {
282
+ const d = p[a++], u = r.getAttribute(l).split(C), $ = /([.?@])?(.*)/.exec(d);
283
+ n.push({ type: 1, index: o, name: $[2], strings: u, ctor: $[1] === "." ? zt : $[1] === "?" ? Yt : $[1] === "@" ? Kt : V }), r.removeAttribute(l);
284
+ } else l.startsWith(C) && (n.push({ type: 6, index: o }), r.removeAttribute(l));
285
+ if (At.test(r.tagName)) {
286
+ const l = r.textContent.split(C), d = l.length - 1;
287
+ if (d > 0) {
288
+ r.textContent = K ? K.emptyScript : "";
289
+ for (let u = 0; u < d; u++) r.append(l[u], j()), O.nextNode(), n.push({ type: 2, index: ++o });
290
+ r.append(l[d], j());
291
+ }
292
+ }
293
+ } else if (r.nodeType === 8) if (r.data === vt) n.push({ type: 2, index: o });
294
+ else {
295
+ let l = -1;
296
+ for (; (l = r.data.indexOf(C, l + 1)) !== -1; ) n.push({ type: 7, index: o }), l += C.length - 1;
297
+ }
298
+ o++;
299
+ }
300
+ }
301
+ static createElement(t, s) {
302
+ const i = D.createElement("template");
303
+ return i.innerHTML = t, i;
304
+ }
305
+ }
306
+ function R(e, t, s = e, i) {
307
+ if (t === x) return t;
308
+ let r = i !== void 0 ? s._$Co?.[i] : s._$Cl;
309
+ const o = q(t) ? void 0 : t._$litDirective$;
310
+ return r?.constructor !== o && (r?._$AO?.(!1), o === void 0 ? r = void 0 : (r = new o(e), r._$AT(e, s, i)), i !== void 0 ? (s._$Co ??= [])[i] = r : s._$Cl = r), r !== void 0 && (t = R(e, r._$AS(e, t.values), r, i)), t;
311
+ }
312
+ let Bt = class {
313
+ constructor(t, s) {
314
+ this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = s;
315
+ }
316
+ get parentNode() {
317
+ return this._$AM.parentNode;
318
+ }
319
+ get _$AU() {
320
+ return this._$AM._$AU;
321
+ }
322
+ u(t) {
323
+ const { el: { content: s }, parts: i } = this._$AD, r = (t?.creationScope ?? D).importNode(s, !0);
324
+ O.currentNode = r;
325
+ let o = O.nextNode(), a = 0, h = 0, n = i[0];
326
+ for (; n !== void 0; ) {
327
+ if (a === n.index) {
328
+ let c;
329
+ n.type === 2 ? c = new I(o, o.nextSibling, this, t) : n.type === 1 ? c = new n.ctor(o, n.name, n.strings, this, t) : n.type === 6 && (c = new Ft(o, this, t)), this._$AV.push(c), n = i[++h];
330
+ }
331
+ a !== n?.index && (o = O.nextNode(), a++);
332
+ }
333
+ return O.currentNode = D, r;
334
+ }
335
+ p(t) {
336
+ let s = 0;
337
+ for (const i of this._$AV) i !== void 0 && (i.strings !== void 0 ? (i._$AI(t, i, s), s += i.strings.length - 2) : i._$AI(t[s])), s++;
338
+ }
339
+ };
340
+ class I {
341
+ get _$AU() {
342
+ return this._$AM?._$AU ?? this._$Cv;
343
+ }
344
+ constructor(t, s, i, r) {
345
+ this.type = 2, this._$AH = g, this._$AN = void 0, this._$AA = t, this._$AB = s, this._$AM = i, this.options = r, this._$Cv = r?.isConnected ?? !0;
346
+ }
347
+ get parentNode() {
348
+ let t = this._$AA.parentNode;
349
+ const s = this._$AM;
350
+ return s !== void 0 && t?.nodeType === 11 && (t = s.parentNode), t;
351
+ }
352
+ get startNode() {
353
+ return this._$AA;
354
+ }
355
+ get endNode() {
356
+ return this._$AB;
357
+ }
358
+ _$AI(t, s = this) {
359
+ t = R(this, t, s), q(t) ? t === g || t == null || t === "" ? (this._$AH !== g && this._$AR(), this._$AH = g) : t !== this._$AH && t !== x && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : Ht(t) ? this.k(t) : this._(t);
360
+ }
361
+ O(t) {
362
+ return this._$AA.parentNode.insertBefore(t, this._$AB);
363
+ }
364
+ T(t) {
365
+ this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
366
+ }
367
+ _(t) {
368
+ this._$AH !== g && q(this._$AH) ? this._$AA.nextSibling.data = t : this.T(D.createTextNode(t)), this._$AH = t;
369
+ }
370
+ $(t) {
371
+ const { values: s, _$litType$: i } = t, r = typeof i == "number" ? this._$AC(t) : (i.el === void 0 && (i.el = B.createElement(_t(i.h, i.h[0]), this.options)), i);
372
+ if (this._$AH?._$AD === r) this._$AH.p(s);
373
+ else {
374
+ const o = new Bt(r, this), a = o.u(this.options);
375
+ o.p(s), this.T(a), this._$AH = o;
376
+ }
377
+ }
378
+ _$AC(t) {
379
+ let s = gt.get(t.strings);
380
+ return s === void 0 && gt.set(t.strings, s = new B(t)), s;
381
+ }
382
+ k(t) {
383
+ et(this._$AH) || (this._$AH = [], this._$AR());
384
+ const s = this._$AH;
385
+ let i, r = 0;
386
+ for (const o of t) r === s.length ? s.push(i = new I(this.O(j()), this.O(j()), this, this.options)) : i = s[r], i._$AI(o), r++;
387
+ r < s.length && (this._$AR(i && i._$AB.nextSibling, r), s.length = r);
388
+ }
389
+ _$AR(t = this._$AA.nextSibling, s) {
390
+ for (this._$AP?.(!1, !0, s); t !== this._$AB; ) {
391
+ const i = t.nextSibling;
392
+ t.remove(), t = i;
393
+ }
394
+ }
395
+ setConnected(t) {
396
+ this._$AM === void 0 && (this._$Cv = t, this._$AP?.(t));
397
+ }
398
+ }
399
+ class V {
400
+ get tagName() {
401
+ return this.element.tagName;
402
+ }
403
+ get _$AU() {
404
+ return this._$AM._$AU;
405
+ }
406
+ constructor(t, s, i, r, o) {
407
+ this.type = 1, this._$AH = g, this._$AN = void 0, this.element = t, this.name = s, this._$AM = r, this.options = o, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = g;
408
+ }
409
+ _$AI(t, s = this, i, r) {
410
+ const o = this.strings;
411
+ let a = !1;
412
+ if (o === void 0) t = R(this, t, s, 0), a = !q(t) || t !== this._$AH && t !== x, a && (this._$AH = t);
413
+ else {
414
+ const h = t;
415
+ let n, c;
416
+ for (t = o[0], n = 0; n < o.length - 1; n++) c = R(this, h[i + n], s, n), c === x && (c = this._$AH[n]), a ||= !q(c) || c !== this._$AH[n], c === g ? t = g : t !== g && (t += (c ?? "") + o[n + 1]), this._$AH[n] = c;
417
+ }
418
+ a && !r && this.j(t);
419
+ }
420
+ j(t) {
421
+ t === g ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
422
+ }
423
+ }
424
+ class zt extends V {
425
+ constructor() {
426
+ super(...arguments), this.type = 3;
427
+ }
428
+ j(t) {
429
+ this.element[this.name] = t === g ? void 0 : t;
430
+ }
431
+ }
432
+ class Yt extends V {
433
+ constructor() {
434
+ super(...arguments), this.type = 4;
435
+ }
436
+ j(t) {
437
+ this.element.toggleAttribute(this.name, !!t && t !== g);
438
+ }
439
+ }
440
+ class Kt extends V {
441
+ constructor(t, s, i, r, o) {
442
+ super(t, s, i, r, o), this.type = 5;
443
+ }
444
+ _$AI(t, s = this) {
445
+ if ((t = R(this, t, s, 0) ?? g) === x) return;
446
+ const i = this._$AH, r = t === g && i !== g || t.capture !== i.capture || t.once !== i.once || t.passive !== i.passive, o = t !== g && (i === g || r);
447
+ r && this.element.removeEventListener(this.name, this, i), o && this.element.addEventListener(this.name, this, t), this._$AH = t;
448
+ }
449
+ handleEvent(t) {
450
+ typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, t) : this._$AH.handleEvent(t);
451
+ }
452
+ }
453
+ class Ft {
454
+ constructor(t, s, i) {
455
+ this.element = t, this.type = 6, this._$AN = void 0, this._$AM = s, this.options = i;
456
+ }
457
+ get _$AU() {
458
+ return this._$AM._$AU;
459
+ }
460
+ _$AI(t) {
461
+ R(this, t);
462
+ }
463
+ }
464
+ const Vt = { I }, Wt = tt.litHtmlPolyfillSupport;
465
+ Wt?.(B, I), (tt.litHtmlVersions ??= []).push("3.3.1");
466
+ const Gt = (e, t, s) => {
467
+ const i = s?.renderBefore ?? t;
468
+ let r = i._$litPart$;
469
+ if (r === void 0) {
470
+ const o = s?.renderBefore ?? null;
471
+ i._$litPart$ = r = new I(t.insertBefore(j(), o), o, void 0, s ?? {});
472
+ }
473
+ return r._$AI(e), r;
474
+ };
475
+ const st = globalThis;
476
+ let H = class extends U {
477
+ constructor() {
478
+ super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
479
+ }
480
+ createRenderRoot() {
481
+ const t = super.createRenderRoot();
482
+ return this.renderOptions.renderBefore ??= t.firstChild, t;
483
+ }
484
+ update(t) {
485
+ const s = this.render();
486
+ this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = Gt(s, this.renderRoot, this.renderOptions);
487
+ }
488
+ connectedCallback() {
489
+ super.connectedCallback(), this._$Do?.setConnected(!0);
490
+ }
491
+ disconnectedCallback() {
492
+ super.disconnectedCallback(), this._$Do?.setConnected(!1);
493
+ }
494
+ render() {
495
+ return x;
496
+ }
497
+ };
498
+ H._$litElement$ = !0, H.finalized = !0, st.litElementHydrateSupport?.({ LitElement: H });
499
+ const Jt = st.litElementPolyfillSupport;
500
+ Jt?.({ LitElement: H });
501
+ (st.litElementVersions ??= []).push("4.2.1");
502
+ const Zt = (e) => (t, s) => {
503
+ s !== void 0 ? s.addInitializer((() => {
504
+ customElements.define(e, t);
505
+ })) : customElements.define(e, t);
506
+ };
507
+ const Qt = { attribute: !0, type: String, converter: Y, reflect: !1, hasChanged: X }, Xt = (e = Qt, t, s) => {
508
+ const { kind: i, metadata: r } = s;
509
+ let o = globalThis.litPropertyMetadata.get(r);
510
+ if (o === void 0 && globalThis.litPropertyMetadata.set(r, o = /* @__PURE__ */ new Map()), i === "setter" && ((e = Object.create(e)).wrapped = !0), o.set(s.name, e), i === "accessor") {
511
+ const { name: a } = s;
512
+ return { set(h) {
513
+ const n = t.get.call(this);
514
+ t.set.call(this, h), this.requestUpdate(a, n, e);
515
+ }, init(h) {
516
+ return h !== void 0 && this.C(a, void 0, e, h), h;
517
+ } };
518
+ }
519
+ if (i === "setter") {
520
+ const { name: a } = s;
521
+ return function(h) {
522
+ const n = this[a];
523
+ t.call(this, h), this.requestUpdate(a, n, e);
524
+ };
525
+ }
526
+ throw Error("Unsupported decorator location: " + i);
527
+ };
528
+ function S(e) {
529
+ return (t, s) => typeof s == "object" ? Xt(e, t, s) : ((i, r, o) => {
530
+ const a = r.hasOwnProperty(o);
531
+ return r.constructor.createProperty(o, i), a ? Object.getOwnPropertyDescriptor(r, o) : void 0;
532
+ })(e, t, s);
533
+ }
534
+ function b(e) {
535
+ return S({ ...e, state: !0, attribute: !1 });
536
+ }
537
+ const te = (e, t, s) => (s.configurable = !0, s.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(e, t, s), s);
538
+ function it(e, t) {
539
+ return (s, i, r) => {
540
+ const o = (a) => a.renderRoot?.querySelector(e) ?? null;
541
+ return te(s, i, { get() {
542
+ return o(this);
543
+ } });
544
+ };
545
+ }
546
+ const St = { ATTRIBUTE: 1, CHILD: 2 }, kt = (e) => (...t) => ({ _$litDirective$: e, values: t });
547
+ class Ct {
548
+ constructor(t) {
549
+ }
550
+ get _$AU() {
551
+ return this._$AM._$AU;
552
+ }
553
+ _$AT(t, s, i) {
554
+ this._$Ct = t, this._$AM = s, this._$Ci = i;
555
+ }
556
+ _$AS(t, s) {
557
+ return this.update(t, s);
558
+ }
559
+ update(t, s) {
560
+ return this.render(...s);
561
+ }
562
+ }
563
+ const mt = kt(class extends Ct {
564
+ constructor(e) {
565
+ if (super(e), e.type !== St.ATTRIBUTE || e.name !== "class" || e.strings?.length > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
566
+ }
567
+ render(e) {
568
+ return " " + Object.keys(e).filter(((t) => e[t])).join(" ") + " ";
569
+ }
570
+ update(e, [t]) {
571
+ if (this.st === void 0) {
572
+ this.st = /* @__PURE__ */ new Set(), e.strings !== void 0 && (this.nt = new Set(e.strings.join(" ").split(/\s/).filter(((i) => i !== ""))));
573
+ for (const i in t) t[i] && !this.nt?.has(i) && this.st.add(i);
574
+ return this.render(t);
575
+ }
576
+ const s = e.element.classList;
577
+ for (const i of this.st) i in t || (s.remove(i), this.st.delete(i));
578
+ for (const i in t) {
579
+ const r = !!t[i];
580
+ r === this.st.has(i) || this.nt?.has(i) || (r ? (s.add(i), this.st.add(i)) : (s.remove(i), this.st.delete(i)));
581
+ }
582
+ return x;
583
+ }
584
+ });
585
+ const { I: ee } = Vt, ft = () => document.createComment(""), L = (e, t, s) => {
586
+ const i = e._$AA.parentNode, r = t === void 0 ? e._$AB : t._$AA;
587
+ if (s === void 0) {
588
+ const o = i.insertBefore(ft(), r), a = i.insertBefore(ft(), r);
589
+ s = new ee(o, a, e, e.options);
590
+ } else {
591
+ const o = s._$AB.nextSibling, a = s._$AM, h = a !== e;
592
+ if (h) {
593
+ let n;
594
+ s._$AQ?.(e), s._$AM = e, s._$AP !== void 0 && (n = e._$AU) !== a._$AU && s._$AP(n);
595
+ }
596
+ if (o !== r || h) {
597
+ let n = s._$AA;
598
+ for (; n !== o; ) {
599
+ const c = n.nextSibling;
600
+ i.insertBefore(n, r), n = c;
601
+ }
602
+ }
603
+ }
604
+ return s;
605
+ }, P = (e, t, s = e) => (e._$AI(t, s), e), se = {}, ie = (e, t = se) => e._$AH = t, re = (e) => e._$AH, G = (e) => {
606
+ e._$AR(), e._$AA.remove();
607
+ };
608
+ const yt = (e, t, s) => {
609
+ const i = /* @__PURE__ */ new Map();
610
+ for (let r = t; r <= s; r++) i.set(e[r], r);
611
+ return i;
612
+ }, $t = kt(class extends Ct {
613
+ constructor(e) {
614
+ if (super(e), e.type !== St.CHILD) throw Error("repeat() can only be used in text expressions");
615
+ }
616
+ dt(e, t, s) {
617
+ let i;
618
+ s === void 0 ? s = t : t !== void 0 && (i = t);
619
+ const r = [], o = [];
620
+ let a = 0;
621
+ for (const h of e) r[a] = i ? i(h, a) : a, o[a] = s(h, a), a++;
622
+ return { values: o, keys: r };
623
+ }
624
+ render(e, t, s) {
625
+ return this.dt(e, t, s).values;
626
+ }
627
+ update(e, [t, s, i]) {
628
+ const r = re(e), { values: o, keys: a } = this.dt(t, s, i);
629
+ if (!Array.isArray(r)) return this.ut = a, o;
630
+ const h = this.ut ??= [], n = [];
631
+ let c, p, l = 0, d = r.length - 1, u = 0, $ = o.length - 1;
632
+ for (; l <= d && u <= $; ) if (r[l] === null) l++;
633
+ else if (r[d] === null) d--;
634
+ else if (h[l] === a[u]) n[u] = P(r[l], o[u]), l++, u++;
635
+ else if (h[d] === a[$]) n[$] = P(r[d], o[$]), d--, $--;
636
+ else if (h[l] === a[$]) n[$] = P(r[l], o[$]), L(e, n[$ + 1], r[l]), l++, $--;
637
+ else if (h[d] === a[u]) n[u] = P(r[d], o[u]), L(e, r[l], r[d]), d--, u++;
638
+ else if (c === void 0 && (c = yt(a, u, $), p = yt(h, l, d)), c.has(h[l])) if (c.has(h[d])) {
639
+ const v = p.get(a[u]), A = v !== void 0 ? r[v] : null;
640
+ if (A === null) {
641
+ const w = L(e, r[l]);
642
+ P(w, o[u]), n[u] = w;
643
+ } else n[u] = P(A, o[u]), L(e, r[l], A), r[v] = null;
644
+ u++;
645
+ } else G(r[d]), d--;
646
+ else G(r[l]), l++;
647
+ for (; u <= $; ) {
648
+ const v = L(e, n[$ + 1]);
649
+ P(v, o[u]), n[u++] = v;
650
+ }
651
+ for (; l <= d; ) {
652
+ const v = r[l++];
653
+ v !== null && G(v);
654
+ }
655
+ return this.ut = a, ie(e, n), x;
656
+ }
657
+ }), oe = ({
658
+ baseUrl: e
659
+ }) => {
660
+ const t = {
661
+ login: "auth/login",
662
+ logout: "auth/logout",
663
+ refresh: "auth/refresh",
664
+ requestRegisterOtp: "auth/request-register-otp",
665
+ register: "auth/register",
666
+ requestResetPassword: "auth/request-reset-password",
667
+ resetPassword: "auth/reset-password"
668
+ };
669
+ return {
670
+ login: async ({
671
+ email: c,
672
+ password: p,
673
+ accessToken: l,
674
+ refreshToken: d,
675
+ idToken: u
676
+ }) => {
677
+ const $ = await fetch(`${e}${t.login}`, {
678
+ method: "POST",
679
+ headers: {
680
+ "Content-Type": "application/json"
681
+ },
682
+ body: JSON.stringify({
683
+ email: c,
684
+ password: p,
685
+ accessToken: l,
686
+ refreshToken: d,
687
+ idToken: u
688
+ })
689
+ });
690
+ if (!$.ok) {
691
+ const v = await $.json();
692
+ throw new Error(v.message || v.error || "Login failed");
693
+ }
694
+ return $.json();
695
+ },
696
+ logout: async ({
697
+ accessToken: c,
698
+ refreshToken: p,
699
+ authToken: l
700
+ }) => {
701
+ const d = await fetch(`${e}${t.logout}`, {
702
+ method: "POST",
703
+ headers: {
704
+ "Content-Type": "application/json",
705
+ Authorization: `Bearer ${l}`
706
+ },
707
+ body: JSON.stringify({
708
+ accessToken: c,
709
+ refreshToken: p
710
+ })
711
+ });
712
+ if (!d.ok) {
713
+ const u = await d.json();
714
+ throw new Error(u.message || u.error || "Logout failed");
715
+ }
716
+ return d.json();
717
+ },
718
+ refresh: async ({ refreshToken: c }) => {
719
+ const p = await fetch(`${e}${t.refresh}`, {
720
+ method: "POST",
721
+ headers: {
722
+ "Content-Type": "application/json"
723
+ },
724
+ body: JSON.stringify({
725
+ refreshToken: c
726
+ })
727
+ });
728
+ if (!p.ok) {
729
+ const l = await p.json();
730
+ throw new Error(l.message || l.error || "Failed to refresh token");
731
+ }
732
+ return p.json();
733
+ },
734
+ requestRegisterOtp: async ({ email: c }) => {
735
+ const p = await fetch(`${e}${t.requestRegisterOtp}`, {
736
+ method: "POST",
737
+ headers: {
738
+ "Content-Type": "application/json"
739
+ },
740
+ body: JSON.stringify({
741
+ email: c
742
+ })
743
+ });
744
+ if (!p.ok) {
745
+ const l = await p.json();
746
+ throw new Error(l.message || l.error || "Failed to request OTP");
747
+ }
748
+ return p.json();
749
+ },
750
+ register: async ({
751
+ email: c,
752
+ password: p,
753
+ phone_number: l,
754
+ family_name: d,
755
+ given_name: u,
756
+ code: $
757
+ }) => {
758
+ const v = await fetch(`${e}${t.register}`, {
759
+ method: "POST",
760
+ headers: {
761
+ "Content-Type": "application/json"
762
+ },
763
+ body: JSON.stringify({
764
+ email: c,
765
+ password: p,
766
+ phone_number: l,
767
+ family_name: d,
768
+ given_name: u,
769
+ code: $
770
+ })
771
+ });
772
+ if (!v.ok) {
773
+ const A = await v.json();
774
+ throw new Error(A.message || A.error || "Registration failed");
775
+ }
776
+ return v.json();
777
+ },
778
+ requestResetPassword: async ({ email: c }) => {
779
+ const p = await fetch(`${e}${t.requestResetPassword}`, {
780
+ method: "POST",
781
+ headers: {
782
+ "Content-Type": "application/json"
783
+ },
784
+ body: JSON.stringify({
785
+ email: c
786
+ })
787
+ });
788
+ if (!p.ok) {
789
+ const l = await p.json();
790
+ throw new Error(l.message || l.error || "Failed to request password reset");
791
+ }
792
+ return p.json();
793
+ },
794
+ resetPassword: async ({
795
+ email: c,
796
+ otp: p,
797
+ newPassword: l
798
+ }) => {
799
+ const d = await fetch(`${e}${t.resetPassword}`, {
800
+ method: "POST",
801
+ headers: {
802
+ "Content-Type": "application/json"
803
+ },
804
+ body: JSON.stringify({
805
+ email: c,
806
+ otp: p,
807
+ newPassword: l
808
+ })
809
+ });
810
+ if (!d.ok) {
811
+ const u = await d.json();
812
+ throw new Error(u.message || u.error || "Failed to reset password");
813
+ }
814
+ return d.json();
815
+ }
816
+ };
817
+ }, J = {
818
+ AUTH_TOKEN: "authToken",
819
+ ACCESS_TOKEN: "accessToken",
820
+ REFRESH_TOKEN: "refreshToken"
821
+ }, ae = {
822
+ maxAge: 3600 * 24 * 7,
823
+ // 7 days
824
+ secure: !0,
825
+ sameSite: "lax",
826
+ path: "/"
827
+ }, ne = () => {
828
+ const e = (n, c, p = {}) => {
829
+ const {
830
+ maxAge: l,
831
+ path: d = "/",
832
+ secure: u = window.location.protocol === "https:",
833
+ sameSite: $ = "lax",
834
+ domain: v
835
+ } = p;
836
+ let A = `${encodeURIComponent(n)}=${encodeURIComponent(c)}`;
837
+ l !== void 0 && (A += `; Max-Age=${l}`), A += `; Path=${d}`, u && (A += "; Secure"), A += `; SameSite=${$}`, v && (A += `; Domain=${v}`), document.cookie = A;
838
+ }, t = (n) => {
839
+ const c = encodeURIComponent(n) + "=", p = document.cookie.split(";");
840
+ for (let l = 0; l < p.length; l++) {
841
+ let d = p[l];
842
+ for (; d.charAt(0) === " "; )
843
+ d = d.substring(1);
844
+ if (d.indexOf(c) === 0)
845
+ return decodeURIComponent(d.substring(c.length));
846
+ }
847
+ return null;
848
+ }, s = (n, c = {}) => {
849
+ e(n, "", {
850
+ ...c,
851
+ maxAge: -1
852
+ });
853
+ }, i = (n) => t(n) !== null, r = (n, c) => {
854
+ e(J[n], c, ae);
855
+ }, o = (n) => t(J[n]), a = (n) => {
856
+ s(J[n]);
857
+ };
858
+ return {
859
+ setCookie: e,
860
+ getCookie: t,
861
+ removeCookie: s,
862
+ hasCookie: i,
863
+ setAuthToken: r,
864
+ getAuthToken: o,
865
+ removeAuthToken: a,
866
+ clearAllAuthTokens: () => {
867
+ a("AUTH_TOKEN"), a("ACCESS_TOKEN"), a("REFRESH_TOKEN");
868
+ }
869
+ };
870
+ }, le = ["code", "state", "error", "error_description"], he = (e) => {
871
+ if (e) return e;
872
+ const t = new URL(window.location.href);
873
+ return le.forEach((s) => t.searchParams.delete(s)), t.toString();
874
+ }, ce = ({
875
+ domain: e,
876
+ cognitoRegion: t,
877
+ userPoolId: s,
878
+ clientId: i,
879
+ redirectUri: r
880
+ }) => {
881
+ const o = {
882
+ domain: e,
883
+ clientId: i,
884
+ redirectUri: he(r)
885
+ }, a = (w) => {
886
+ const _ = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-._~", k = new Uint8Array(w);
887
+ return crypto.getRandomValues(k), Array.from(k).map((E) => _[E % _.length]).join("");
888
+ }, h = async (w) => {
889
+ const k = new TextEncoder().encode(w), E = await crypto.subtle.digest("SHA-256", k);
890
+ return btoa(String.fromCharCode(...new Uint8Array(E))).replace(/\+/g, "-").replace(/\//g, "_").replace(/=/g, "");
891
+ }, n = async () => {
892
+ const w = a(128), _ = await h(w);
893
+ return sessionStorage.setItem("pkce_code_verifier", w), { codeVerifier: w, codeChallenge: _ };
894
+ }, c = () => {
895
+ const w = a(32);
896
+ return sessionStorage.setItem("oauth_state", w), w;
897
+ }, p = async () => {
898
+ const { codeChallenge: w } = await n(), _ = c(), k = new URLSearchParams({
899
+ response_type: "code",
900
+ client_id: o.clientId,
901
+ redirect_uri: o.redirectUri,
902
+ identity_provider: "Google",
903
+ scope: "openid email profile",
904
+ state: _,
905
+ code_challenge_method: "S256",
906
+ code_challenge: w,
907
+ prompt: "select_account"
908
+ });
909
+ return `${o.domain}/oauth2/authorize?${k.toString()}`;
910
+ }, l = async () => {
911
+ const w = await p();
912
+ window.location.href = w;
913
+ }, d = async () => {
914
+ const { codeChallenge: w } = await n(), _ = c(), k = new URLSearchParams({
915
+ response_type: "code",
916
+ client_id: o.clientId,
917
+ redirect_uri: o.redirectUri,
918
+ identity_provider: "SignInWithApple",
919
+ scope: "openid email profile",
920
+ state: _,
921
+ code_challenge_method: "S256",
922
+ code_challenge: w
923
+ });
924
+ return `${o.domain}/oauth2/authorize?${k.toString()}`;
925
+ }, u = async () => {
926
+ const w = await d();
927
+ window.location.href = w;
928
+ }, $ = (w) => {
929
+ const _ = sessionStorage.getItem("oauth_state");
930
+ return sessionStorage.removeItem("oauth_state"), _ === w;
931
+ }, v = () => {
932
+ const w = sessionStorage.getItem("pkce_code_verifier");
933
+ return sessionStorage.removeItem("pkce_code_verifier"), w;
934
+ };
935
+ return {
936
+ redirectToGoogleAuth: l,
937
+ redirectToAppleAuth: u,
938
+ validateState: $,
939
+ getCodeVerifier: v,
940
+ exchangeCodeForTokens: async (w) => {
941
+ const _ = v();
942
+ if (!_)
943
+ throw new Error("PKCE code verifier not found. Please restart the authentication flow.");
944
+ const k = new URLSearchParams({
945
+ grant_type: "authorization_code",
946
+ client_id: o.clientId,
947
+ code: w,
948
+ redirect_uri: o.redirectUri,
949
+ code_verifier: _
950
+ }), E = await fetch(`${o.domain}/oauth2/token`, {
951
+ method: "POST",
952
+ headers: {
953
+ "Content-Type": "application/x-www-form-urlencoded"
954
+ },
955
+ body: k.toString()
956
+ });
957
+ if (!E.ok) {
958
+ const rt = await E.text();
959
+ throw new Error(`Token exchange failed: ${rt}`);
960
+ }
961
+ return E.json();
962
+ }
963
+ };
964
+ }, de = () => Et`
965
+ :host {
966
+ display: inline-block;
967
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
968
+ box-sizing: border-box;
969
+ --color-primary: var(--cals-auth-color-primary, #2563eb);
970
+ --color-bg-primary: var(--cals-auth-color-bg-primary, #ffffff);
971
+ --color-bg-secondary: var(--cals-auth-color-bg-secondary, #f8fafc);
972
+ --color-text-primary: var(--cals-auth-color-text-primary, #0f172a);
973
+ --color-text-secondary: var(--cals-auth-color-text-secondary, #64748b);
974
+ --color-text-muted: var(--cals-auth-color-text-muted, #94a3b8);
975
+ --color-border: var(--cals-auth-color-border, #e2e8f0);
976
+ --color-error: var(--cals-auth-color-error, #dc2626);
977
+ --color-success: var(--cals-auth-color-success, #16a34a);
978
+ --transition-slow: var(--cals-auth-transition-slow, 300ms);
979
+ --radius-md: var(--cals-auth-radius-md, 0.5rem);
980
+ --radius-lg: var(--cals-auth-radius-lg, 0.75rem);
981
+ --radius-xl: var(--cals-auth-radius-xl, 1.25rem);
982
+ --space-2: var(--cals-auth-space-2, 0.5rem);
983
+ --space-3: var(--cals-auth-space-3, 0.75rem);
984
+ --space-4: var(--cals-auth-space-4, 1rem);
985
+ --space-5: var(--cals-auth-space-5, 1.25rem);
986
+ --space-6: var(--cals-auth-space-6, 1.5rem);
987
+ }
988
+
989
+ *,
990
+ *::before,
991
+ *::after {
992
+ box-sizing: border-box;
993
+ }
994
+
995
+ /* Body scroll lock */
996
+ :host(.modal-open) {
997
+ overflow: hidden;
998
+ }
999
+
1000
+ .modal-overlay {
1001
+ position: fixed;
1002
+ top: 0;
1003
+ left: 0;
1004
+ right: 0;
1005
+ bottom: 0;
1006
+ background: rgba(0, 0, 0, 0.5);
1007
+ display: flex;
1008
+ align-items: flex-end;
1009
+ justify-content: center;
1010
+ z-index: 1000;
1011
+ backdrop-filter: none;
1012
+ animation: fadeIn 0.2s ease-out;
1013
+ }
1014
+
1015
+ .modal-overlay--closing {
1016
+ animation: fadeOut var(--transition-slow) ease-out forwards;
1017
+ }
1018
+
1019
+ .modal-container {
1020
+ background: var(--color-bg-primary);
1021
+ border-top-left-radius: var(--radius-xl);
1022
+ border-top-right-radius: var(--radius-xl);
1023
+ box-shadow: 0 -4px 6px -1px rgba(0, 0, 0, 0.1), 0 -2px 4px -1px rgba(0, 0, 0, 0.06);
1024
+ width: 100vw;
1025
+ max-width: 100vw;
1026
+ height: 85dvh;
1027
+ display: flex;
1028
+ flex-direction: column;
1029
+ overflow: hidden;
1030
+ animation: slideUp var(--transition-slow);
1031
+ transform-origin: bottom center;
1032
+ transition: height var(--transition-slow) cubic-bezier(0.4, 0, 0.2, 1);
1033
+ }
1034
+
1035
+ .modal-container--closing {
1036
+ animation: slideDown var(--transition-slow);
1037
+ }
1038
+
1039
+ .modal-container--dragging {
1040
+ user-select: none;
1041
+ -webkit-user-select: none;
1042
+ cursor: grabbing;
1043
+ }
1044
+
1045
+ .drawer-handle {
1046
+ display: flex;
1047
+ justify-content: center;
1048
+ padding-top: var(--space-3);
1049
+ padding-bottom: var(--space-2);
1050
+ flex-shrink: 0;
1051
+ cursor: pointer;
1052
+ user-select: none;
1053
+ -webkit-tap-highlight-color: transparent;
1054
+ }
1055
+
1056
+ .drawer-handle:hover .drawer-handle-bar {
1057
+ opacity: 0.7;
1058
+ }
1059
+
1060
+ .drawer-handle-bar {
1061
+ width: 36px;
1062
+ height: 5px;
1063
+ background: var(--color-text-muted);
1064
+ border-radius: 100px;
1065
+ opacity: 0.5;
1066
+ transition: opacity var(--transition-slow) ease;
1067
+ }
1068
+
1069
+ .drawer-content {
1070
+ width: 100%;
1071
+ max-width: 100%;
1072
+ margin: 0 auto;
1073
+ display: flex;
1074
+ flex-direction: column;
1075
+ overflow: hidden;
1076
+ height: 100%;
1077
+ }
1078
+
1079
+ .drawer-content--sm {
1080
+ max-width: 400px;
1081
+ }
1082
+
1083
+ .drawer-content--md {
1084
+ max-width: 600px;
1085
+ }
1086
+
1087
+ .drawer-content--lg {
1088
+ max-width: 900px;
1089
+ }
1090
+
1091
+ .modal-header {
1092
+ display: flex;
1093
+ align-items: center;
1094
+ justify-content: center;
1095
+ padding: var(--space-4) var(--space-6);
1096
+ flex-shrink: 0;
1097
+ }
1098
+
1099
+ .auth-logo {
1100
+ display: block;
1101
+ }
1102
+ .auth-logo {
1103
+ position: relative;
1104
+ transition: all 0.3s ease;
1105
+ }
1106
+ .auth-logo[src] {
1107
+ opacity: 1;
1108
+ position: relative;
1109
+ z-index: 1;
1110
+ }
1111
+ :host([data-theme='dark']) .auth-header {
1112
+ filter: brightness(0) saturate(100%) invert(98%) sepia(4%) saturate(346%)
1113
+ hue-rotate(183deg) brightness(106%) contrast(93%);
1114
+ }
1115
+
1116
+ .modal-body {
1117
+ padding: var(--space-4) var(--space-6);
1118
+ overflow-y: auto;
1119
+ flex: 1;
1120
+ min-height: 0;
1121
+ }
1122
+
1123
+ .auth-form {
1124
+ display: flex;
1125
+ flex-direction: column;
1126
+ gap: var(--space-5);
1127
+ }
1128
+
1129
+ .field {
1130
+ display: flex;
1131
+ flex-direction: column;
1132
+ gap: var(--space-1);
1133
+ }
1134
+
1135
+ .field-label {
1136
+ font-weight: 500;
1137
+ font-size: 0.875rem;
1138
+ color: var(--color-text-primary);
1139
+ }
1140
+
1141
+ .field-input {
1142
+ width: 100%;
1143
+ padding: 0.75rem 1rem;
1144
+ border: 1px solid var(--color-border);
1145
+ border-radius: var(--radius-md);
1146
+ background: var(--color-bg-primary);
1147
+ color: var(--color-text-primary);
1148
+ font-size: 1rem;
1149
+ transition: all 0.15s ease;
1150
+ }
1151
+
1152
+ .field-input:focus {
1153
+ outline: none;
1154
+ border-color: var(--color-primary);
1155
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 25%, transparent);
1156
+ }
1157
+
1158
+ .field-input:-webkit-autofill,
1159
+ .field-input:-webkit-autofill:hover,
1160
+ .field-input:-webkit-autofill:focus,
1161
+ .field-input:-webkit-autofill:active {
1162
+ -webkit-box-shadow: 0 0 0 1000px var(--color-bg-primary) inset !important;
1163
+ -webkit-text-fill-color: var(--color-text-primary) !important;
1164
+ transition: background-color 5000s ease-in-out 0s;
1165
+ }
1166
+
1167
+ .field-input:-moz-autofill {
1168
+ box-shadow: 0 0 0 1000px var(--color-bg-primary) inset !important;
1169
+ color: var(--color-text-primary) !important;
1170
+ }
1171
+
1172
+ .field-input--error {
1173
+ border-color: var(--color-error);
1174
+ }
1175
+
1176
+ .field-error {
1177
+ color: var(--color-error);
1178
+ font-size: 0.875rem;
1179
+ }
1180
+
1181
+ .forgot-row {
1182
+ display: flex;
1183
+ justify-content: flex-end;
1184
+ margin-top: calc(var(--space-2) * -1);
1185
+ }
1186
+
1187
+ .text-btn {
1188
+ background: none;
1189
+ border: none;
1190
+ color: var(--color-primary);
1191
+ cursor: pointer;
1192
+ font-weight: 600;
1193
+ font-size: 0.875rem;
1194
+ padding: 0;
1195
+ text-decoration: none;
1196
+ }
1197
+
1198
+ .text-btn:hover {
1199
+ text-decoration: underline;
1200
+ }
1201
+
1202
+ .form-actions {
1203
+ display: flex;
1204
+ flex-direction: column;
1205
+ gap: var(--space-3);
1206
+ margin-top: var(--space-2);
1207
+ }
1208
+
1209
+ .cta {
1210
+ width: 100%;
1211
+ padding: 0.875rem 1rem;
1212
+ border: none;
1213
+ border-radius: var(--radius-md);
1214
+ background: var(--color-primary);
1215
+ color: white;
1216
+ font-weight: 600;
1217
+ font-size: 1rem;
1218
+ cursor: pointer;
1219
+ transition: all 0.15s ease;
1220
+ }
1221
+
1222
+ .cta:hover:not(:disabled) {
1223
+ background: color-mix(in srgb, var(--color-primary), black 10%);
1224
+ transform: translateY(-1px);
1225
+ }
1226
+
1227
+ .cta:disabled {
1228
+ opacity: 0.5;
1229
+ cursor: not-allowed;
1230
+ }
1231
+
1232
+ .button-row {
1233
+ display: flex;
1234
+ gap: var(--space-3);
1235
+ width: 100%;
1236
+ }
1237
+
1238
+ .oauth-btn {
1239
+ flex: 1;
1240
+ padding: 0.875rem 1rem;
1241
+ border: 1px solid var(--color-border);
1242
+ border-radius: var(--radius-md);
1243
+ background: var(--color-bg-primary);
1244
+ cursor: pointer;
1245
+ transition: all 0.15s ease;
1246
+ display: flex;
1247
+ align-items: center;
1248
+ justify-content: center;
1249
+ }
1250
+
1251
+ .oauth-btn:hover:not(:disabled) {
1252
+ background: var(--color-bg-secondary);
1253
+ border-color: var(--color-text-muted);
1254
+ }
1255
+
1256
+ .oauth-btn:disabled {
1257
+ opacity: 0.5;
1258
+ cursor: not-allowed;
1259
+ }
1260
+
1261
+ .apple-icon path {
1262
+ fill: #0b0b0a;
1263
+ }
1264
+
1265
+ /* Dark theme */
1266
+ :host([data-theme='dark']) {
1267
+ --color-primary: #3b82f6;
1268
+ --color-bg-primary: #1e293b;
1269
+ --color-bg-secondary: #0f172a;
1270
+ --color-text-primary: #f8fafc;
1271
+ --color-text-secondary: #cbd5e1;
1272
+ --color-text-muted: #94a3b8;
1273
+ --color-border: #334155;
1274
+ --color-error: #ef4444;
1275
+ --color-success: #10b981;
1276
+ }
1277
+
1278
+ :host([data-theme='dark']) .apple-icon path {
1279
+ fill: #8e8e93;
1280
+ }
1281
+
1282
+ @media (prefers-color-scheme: dark) {
1283
+ .apple-icon path {
1284
+ fill: #8e8e93;
1285
+ }
1286
+ }
1287
+
1288
+ .otp-section {
1289
+ display: flex;
1290
+ flex-direction: column;
1291
+ gap: var(--space-2);
1292
+ }
1293
+
1294
+ .otp-label {
1295
+ display: block;
1296
+ font-weight: 500;
1297
+ font-size: 0.875rem;
1298
+ color: var(--color-text-primary);
1299
+ }
1300
+
1301
+ .otp-inputs {
1302
+ display: flex;
1303
+ gap: var(--space-2);
1304
+ justify-content: center;
1305
+ }
1306
+
1307
+ .otp-input {
1308
+ width: 44px;
1309
+ height: 52px;
1310
+ text-align: center;
1311
+ font-size: 1.25rem;
1312
+ font-weight: 600;
1313
+ border: 1px solid var(--color-border);
1314
+ border-radius: var(--radius-md);
1315
+ background: var(--color-bg-primary);
1316
+ color: var(--color-text-primary);
1317
+ transition: all 0.15s ease;
1318
+ }
1319
+
1320
+ .otp-input:focus {
1321
+ outline: none;
1322
+ border-color: var(--color-primary);
1323
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 25%, transparent);
1324
+ }
1325
+
1326
+ .otp-input--error {
1327
+ border-color: var(--color-error);
1328
+ }
1329
+
1330
+ .otp-error {
1331
+ margin: 0;
1332
+ color: var(--color-error);
1333
+ font-size: 0.875rem;
1334
+ text-align: center;
1335
+ }
1336
+
1337
+ .new-password-fields {
1338
+ display: flex;
1339
+ flex-direction: column;
1340
+ gap: var(--space-5);
1341
+ animation: fadeSlide 0.2s ease;
1342
+ }
1343
+
1344
+ .alert {
1345
+ padding: var(--space-3) var(--space-4);
1346
+ border-radius: var(--radius-md);
1347
+ font-size: 0.875rem;
1348
+ display: flex;
1349
+ align-items: center;
1350
+ justify-content: space-between;
1351
+ gap: var(--space-2);
1352
+ }
1353
+
1354
+ .alert--success {
1355
+ background: color-mix(in srgb, var(--color-success) 10%, transparent);
1356
+ border: 1px solid color-mix(in srgb, var(--color-success) 30%, transparent);
1357
+ color: var(--color-success);
1358
+ }
1359
+
1360
+ .alert--error {
1361
+ background: color-mix(in srgb, var(--color-error) 10%, transparent);
1362
+ border: 1px solid color-mix(in srgb, var(--color-error) 30%, transparent);
1363
+ color: var(--color-error);
1364
+ }
1365
+
1366
+ .alert-close {
1367
+ background: none;
1368
+ border: none;
1369
+ color: inherit;
1370
+ cursor: pointer;
1371
+ font-size: 1.5rem;
1372
+ line-height: 1;
1373
+ padding: 0;
1374
+ opacity: 0.7;
1375
+ }
1376
+
1377
+ .alert-close:hover {
1378
+ opacity: 1;
1379
+ }
1380
+
1381
+ .auth-footer {
1382
+ display: flex;
1383
+ align-items: center;
1384
+ justify-content: center;
1385
+ gap: var(--space-2);
1386
+ padding-top: var(--space-4);
1387
+ text-align: center;
1388
+ }
1389
+
1390
+ .toggle-text {
1391
+ margin: 0;
1392
+ font-size: 0.875rem;
1393
+ color: var(--color-text-secondary);
1394
+ }
1395
+
1396
+ .toggle-text a {
1397
+ color: var(--color-primary);
1398
+ text-decoration: none;
1399
+ }
1400
+
1401
+ .toggle-text a:hover {
1402
+ text-decoration: underline;
1403
+ }
1404
+
1405
+ @keyframes fadeIn {
1406
+ from {
1407
+ opacity: 0;
1408
+ }
1409
+ to {
1410
+ opacity: 1;
1411
+ }
1412
+ }
1413
+
1414
+ @keyframes fadeOut {
1415
+ from {
1416
+ opacity: 1;
1417
+ }
1418
+ to {
1419
+ opacity: 0;
1420
+ }
1421
+ }
1422
+
1423
+ @keyframes slideUp {
1424
+ from {
1425
+ transform: translateY(100%);
1426
+ }
1427
+ to {
1428
+ transform: translateY(0);
1429
+ }
1430
+ }
1431
+
1432
+ @keyframes slideDown {
1433
+ from {
1434
+ transform: translateY(0);
1435
+ }
1436
+ to {
1437
+ transform: translateY(100%);
1438
+ }
1439
+ }
1440
+
1441
+ @keyframes fadeSlide {
1442
+ from {
1443
+ opacity: 0;
1444
+ transform: translateY(6px);
1445
+ }
1446
+ to {
1447
+ opacity: 1;
1448
+ transform: translateY(0);
1449
+ }
1450
+ }
1451
+
1452
+ @media (max-width: 640px) {
1453
+ .modal-container {
1454
+ height: 80dvh;
1455
+ }
1456
+ }
1457
+
1458
+ @media (prefers-reduced-motion: reduce) {
1459
+ * {
1460
+ animation: none !important;
1461
+ transition: none !important;
1462
+ }
1463
+ }`;
1464
+ var pe = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, y = (e, t, s, i) => {
1465
+ for (var r = i > 1 ? void 0 : i ? ue(t, s) : t, o = e.length - 1, a; o >= 0; o--)
1466
+ (a = e[o]) && (r = (i ? a(t, s, r) : a(r)) || r);
1467
+ return i && r && pe(t, s, r), r;
1468
+ };
1469
+ const ge = ["code", "state", "error", "error_description"];
1470
+ let m = class extends H {
1471
+ constructor() {
1472
+ super(...arguments), this.open = !1, this.initialMode = "signin", this.logoUrl = "", this.baseUrl = "", this.oauthDomain = "", this.oauthRegion = "", this.oauthUserPoolId = "", this.oauthClientId = "", this.oauthRedirectUri = "", this.size = "sm", this.theme = "light", this.mode = "signin", this.resetStep = "none", this.signupStep = "form", this.isLoading = !1, this.isClosing = !1, this.isVisible = !1, this.isLoggedIn = !1, this.email = "", this.password = "", this.givenName = "", this.familyName = "", this.newPassword = "", this.confirmPassword = "", this.notice = "", this.error = "", this.errors = {}, this.otpDigits = ["", "", "", "", "", ""], this.signupOtpDigits = ["", "", "", "", "", ""], this.isDragging = !1, this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, this.lastDragEndTime = 0, this.cookies = ne(), this.scrollPosition = 0, this.transitionDuration = 300, this.hasHandledOAuthCallback = !1, this.boundKeyHandler = (e) => {
1473
+ e.key === "Escape" && this.isVisible && this.handleClose();
1474
+ }, this.baseUrlErrorMessage = "Authentication service is not configured correctly. Please add an API domain or contact support.", this.handleClose = () => {
1475
+ this.isClosing || !this.isVisible || (this.cleanupInlineStyles(), this.isDragging = !1, this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, this.isClosing = !0, setTimeout(() => {
1476
+ this.isClosing = !1, this.isVisible = !1, this.open = !1;
1477
+ }, this.transitionDuration));
1478
+ }, this.handleOverlayClick = () => {
1479
+ this.handleClose();
1480
+ }, this.handleDragStart = (e) => {
1481
+ if (!this.modalContainer || this.modalBody && this.modalBody.scrollTop > 0)
1482
+ return;
1483
+ const t = e.target;
1484
+ !(t.classList.contains("drawer-handle") || t.classList.contains("drawer-handle-bar") || t.closest(".drawer-handle")) && this.modalBody && this.modalBody.scrollTop > 0 || (this.modalContainer.style.transition = "", this.modalContainer.style.transform = "", this.isDragging = !0, this.dragStartTime = Date.now(), e instanceof TouchEvent ? (this.dragStartY = e.touches[0].clientY, this.dragCurrentY = e.touches[0].clientY) : (this.dragStartY = e.clientY, this.dragCurrentY = e.clientY));
1485
+ }, this.handleDragMove = (e) => {
1486
+ if (!this.isDragging || !this.modalContainer) return;
1487
+ e instanceof TouchEvent ? this.dragCurrentY = e.touches[0].clientY : this.dragCurrentY = e.clientY;
1488
+ const t = this.dragCurrentY - this.dragStartY;
1489
+ t > 0 && (e.preventDefault(), this.modalContainer.style.transform = `translateY(${t}px)`, this.modalContainer.style.transition = "none");
1490
+ }, this.handleDragEnd = () => {
1491
+ if (!this.isDragging || !this.modalContainer) return;
1492
+ const e = Math.max(0, this.dragCurrentY - this.dragStartY);
1493
+ e > 5 && (this.lastDragEndTime = Date.now());
1494
+ const t = Date.now() - this.dragStartTime, s = e / t, i = this.modalContainer.offsetHeight, r = Math.max(150, i * 0.3), a = e > r || s > 0.5;
1495
+ this.isDragging = !1;
1496
+ const h = this.modalContainer, n = a ? i + i * 0.1 : 0;
1497
+ h.style.transition = "none", h.style.transform = `translateY(${e}px)`, requestAnimationFrame(() => {
1498
+ h.style.transition = `transform ${this.transitionDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`, h.style.transform = `translateY(${n}px)`;
1499
+ }), setTimeout(() => {
1500
+ this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, a ? (this.isVisible = !1, this.open = !1) : this.modalContainer && (this.modalContainer.style.transition = "", this.modalContainer.style.transform = "");
1501
+ }, this.transitionDuration);
1502
+ }, this.handleHandleClick = (e) => {
1503
+ if (Date.now() - this.lastDragEndTime < 200) {
1504
+ e.preventDefault(), e.stopPropagation();
1505
+ return;
1506
+ }
1507
+ this.handleClose();
1508
+ };
1509
+ }
1510
+ hasApiBaseUrl() {
1511
+ return this.baseUrl.trim().length > 0;
1512
+ }
1513
+ getNormalizedBaseUrl() {
1514
+ const e = this.baseUrl.trim();
1515
+ if (!e) return "";
1516
+ const t = e.endsWith("/") ? e : `${e}/`;
1517
+ return t.startsWith("http://") || t.startsWith("https://") ? t : `https://${t}`;
1518
+ }
1519
+ getApiService() {
1520
+ if (!this.hasApiBaseUrl())
1521
+ throw new Error("API domain is not set");
1522
+ return this.apiService || (this.apiService = oe({
1523
+ baseUrl: this.getNormalizedBaseUrl()
1524
+ })), this.apiService;
1525
+ }
1526
+ connectedCallback() {
1527
+ super.connectedCallback(), window.addEventListener("keyup", this.boundKeyHandler);
1528
+ const e = this.cookies.getAuthToken("AUTH_TOKEN"), t = this.cookies.getAuthToken("REFRESH_TOKEN");
1529
+ this.isLoggedIn = !!(e && t), this.mode = this.initialMode, this.hasApiBaseUrl() || (this.error = this.baseUrlErrorMessage), this.handleOAuthCallbackIfPresent();
1530
+ }
1531
+ disconnectedCallback() {
1532
+ window.removeEventListener("keyup", this.boundKeyHandler), this.unlockBodyScroll(), super.disconnectedCallback();
1533
+ }
1534
+ firstUpdated() {
1535
+ this.open && (this.isVisible = !0);
1536
+ }
1537
+ updated(e) {
1538
+ e.has("baseUrl") && (this.apiService = void 0, this.hasApiBaseUrl() ? (this.error === this.baseUrlErrorMessage && (this.error = ""), this.hasHandledOAuthCallback || this.handleOAuthCallbackIfPresent()) : this.error = this.baseUrlErrorMessage), (e.has("oauthDomain") || e.has("oauthRegion") || e.has("oauthUserPoolId") || e.has("oauthClientId") || e.has("oauthRedirectUri")) && (this.oauthService = void 0, this.handleOAuthCallbackIfPresent()), e.has("open") && (this.open ? (this.isVisible = !0, this.lockBodyScroll(), setTimeout(() => {
1539
+ this.emailInput?.focus();
1540
+ }, 100)) : this.isVisible && this.handleClose()), e.has("isVisible") && (this.isVisible ? (this.lockBodyScroll(), this.cleanupInlineStyles()) : (this.unlockBodyScroll(), this.resetState()));
1541
+ }
1542
+ lockBodyScroll() {
1543
+ this.scrollPosition = window.scrollY, document.body.classList.add("modal-open"), document.body.style.top = `-${this.scrollPosition}px`;
1544
+ }
1545
+ unlockBodyScroll() {
1546
+ document.body.classList.remove("modal-open"), document.body.style.top = "", window.scrollTo(0, this.scrollPosition);
1547
+ }
1548
+ cleanupInlineStyles() {
1549
+ setTimeout(() => {
1550
+ this.modalContainer && (this.modalContainer.style.transition = "", this.modalContainer.style.transform = "");
1551
+ }, 0);
1552
+ }
1553
+ resetState() {
1554
+ this.isDragging = !1, this.lastDragEndTime = 0, this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, this.error = "", this.notice = "", this.errors = {}, this.email = "", this.password = "", this.givenName = "", this.familyName = "", this.newPassword = "", this.confirmPassword = "", this.otpDigits = ["", "", "", "", "", ""], this.signupOtpDigits = ["", "", "", "", "", ""], this.resetStep = "none", this.signupStep = "form", this.mode = this.initialMode;
1555
+ }
1556
+ toggleMode() {
1557
+ this.resetStep === "none" && (this.mode = this.mode === "signin" ? "signup" : "signin", this.signupStep = "form", this.error = "", this.notice = "", this.errors = {}, this.confirmPassword = "", this.mode === "signin" && (this.givenName = "", this.familyName = "", this.signupOtpDigits = ["", "", "", "", "", ""]));
1558
+ }
1559
+ startReset() {
1560
+ this.mode = "signin", this.resetStep = "request", this.error = "", this.notice = "", this.errors = {}, this.password = "", this.newPassword = "", this.confirmPassword = "";
1561
+ }
1562
+ cancelReset() {
1563
+ this.resetStep = "none", this.error = "", this.notice = "", this.otpDigits = ["", "", "", "", "", ""], this.errors = {}, this.newPassword = "", this.confirmPassword = "";
1564
+ }
1565
+ backToRequest() {
1566
+ this.resetStep = "request", this.error = "", this.notice = "", this.otpDigits = ["", "", "", "", "", ""], this.errors = {}, this.newPassword = "", this.confirmPassword = "";
1567
+ }
1568
+ backToSignupForm() {
1569
+ this.signupStep = "form", this.error = "", this.notice = "", this.signupOtpDigits = ["", "", "", "", "", ""], this.errors = {};
1570
+ }
1571
+ // Validation
1572
+ validate() {
1573
+ const e = {};
1574
+ if (this.email.trim() ? /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(this.email) || (e.email = "Enter a valid email") : e.email = "Email is required", this.resetStep === "none" && this.signupStep === "form") {
1575
+ if (!this.password)
1576
+ e.password = "Password is required";
1577
+ else if (this.password.length < 8)
1578
+ e.password = "Password must be at least 8 characters";
1579
+ else if (this.mode === "signup") {
1580
+ const t = /[A-Z]/.test(this.password), s = /[a-z]/.test(this.password), i = /[0-9]/.test(this.password);
1581
+ (!t || !s || !i) && (e.password = "Password must contain uppercase, lowercase, and number");
1582
+ }
1583
+ }
1584
+ if (this.mode === "signup" && this.resetStep === "none" && this.signupStep === "form" && (this.givenName.trim() ? /^[a-zA-Z\s-']+$/.test(this.givenName.trim()) || (e.givenName = "Invalid first name") : e.givenName = "First name is required", this.familyName.trim() ? /^[a-zA-Z\s-']+$/.test(this.familyName.trim()) || (e.familyName = "Invalid last name") : e.familyName = "Last name is required", this.confirmPassword ? this.password !== this.confirmPassword && (e.confirm_password = "Passwords must match") : e.confirm_password = "Please confirm your password"), this.signupStep === "otp") {
1585
+ const t = this.signupOtpDigits.join("");
1586
+ (t.length !== 6 || !/^\d{6}$/.test(t)) && (e.signup_otp = "Enter the 6-digit code");
1587
+ }
1588
+ if (this.resetStep === "confirm") {
1589
+ const t = this.otpDigits.join("");
1590
+ if ((t.length !== 6 || !/^\d{6}$/.test(t)) && (e.otp = "Enter the 6-digit code"), t.length === 6) {
1591
+ if (!this.newPassword)
1592
+ e.new_password = "New password is required";
1593
+ else if (this.newPassword.length < 8)
1594
+ e.new_password = "Password must be at least 8 characters";
1595
+ else {
1596
+ const s = /[A-Z]/.test(this.newPassword), i = /[a-z]/.test(this.newPassword), r = /[0-9]/.test(this.newPassword);
1597
+ (!s || !i || !r) && (e.new_password = "Password must contain uppercase, lowercase, and number");
1598
+ }
1599
+ this.confirmPassword ? this.newPassword !== this.confirmPassword && (e.confirm_password = "Passwords must match") : e.confirm_password = "Please confirm your password";
1600
+ }
1601
+ }
1602
+ return this.errors = e, Object.keys(e).length === 0;
1603
+ }
1604
+ // Form submission
1605
+ async handleSubmit(e) {
1606
+ if (e.preventDefault(), this.notice = "", this.error = "", !this.hasApiBaseUrl()) {
1607
+ this.error = this.baseUrlErrorMessage;
1608
+ return;
1609
+ }
1610
+ if (this.validate()) {
1611
+ this.isLoading = !0;
1612
+ try {
1613
+ switch (`${this.resetStep}-${this.mode}-${this.signupStep}`) {
1614
+ case "request-signin-form":
1615
+ try {
1616
+ await this.handleRequestReset();
1617
+ } catch {
1618
+ this.error = "Reset request failed. Please check your details and try again.";
1619
+ }
1620
+ break;
1621
+ case "confirm-signin-form":
1622
+ try {
1623
+ await this.handleConfirmReset();
1624
+ } catch {
1625
+ this.error = "Reset confirmation failed. Please check your details and try again.";
1626
+ }
1627
+ break;
1628
+ case "none-signup-form":
1629
+ try {
1630
+ await this.handleRequestSignupOtp();
1631
+ } catch {
1632
+ this.error = "Signup failed. Please check your details and try again.";
1633
+ }
1634
+ break;
1635
+ case "none-signup-otp":
1636
+ try {
1637
+ await this.handleSignupWithOtp();
1638
+ } catch {
1639
+ this.error = "Signup failed. Please check your details and try again.";
1640
+ }
1641
+ break;
1642
+ default:
1643
+ try {
1644
+ await this.handleSignIn();
1645
+ } catch {
1646
+ this.error = "Login failed. Please check your credentials and try again.";
1647
+ }
1648
+ break;
1649
+ }
1650
+ } finally {
1651
+ this.isLoading = !1;
1652
+ }
1653
+ }
1654
+ }
1655
+ setAuthTokens(e, t, s) {
1656
+ this.cookies.setAuthToken("ACCESS_TOKEN", e), this.cookies.setAuthToken("AUTH_TOKEN", t), this.cookies.setAuthToken("REFRESH_TOKEN", s), this.isLoggedIn = !0;
1657
+ }
1658
+ async handleSignIn() {
1659
+ const e = {
1660
+ email: this.email.trim(),
1661
+ password: this.password
1662
+ }, { accessToken: t, idToken: s, refreshToken: i } = await this.getApiService().login(e);
1663
+ this.setAuthTokens(t, s, i), this.handleClose();
1664
+ }
1665
+ isOAuthConfigured() {
1666
+ return [this.oauthDomain, this.oauthRegion, this.oauthUserPoolId, this.oauthClientId].every(
1667
+ (e) => !!e?.trim()
1668
+ );
1669
+ }
1670
+ getOAuthService() {
1671
+ if (!this.isOAuthConfigured())
1672
+ return null;
1673
+ if (!this.oauthService) {
1674
+ const e = this.oauthRedirectUri?.trim() ? this.oauthRedirectUri.trim() : void 0;
1675
+ this.oauthService = ce({
1676
+ domain: this.oauthDomain.trim(),
1677
+ cognitoRegion: this.oauthRegion.trim(),
1678
+ userPoolId: this.oauthUserPoolId.trim(),
1679
+ clientId: this.oauthClientId.trim(),
1680
+ redirectUri: e
1681
+ });
1682
+ }
1683
+ return this.oauthService;
1684
+ }
1685
+ stripOAuthParamsFromUrl() {
1686
+ const e = new URL(window.location.href);
1687
+ let t = !1;
1688
+ for (const s of ge)
1689
+ e.searchParams.has(s) && (e.searchParams.delete(s), t = !0);
1690
+ if (t) {
1691
+ const s = e.searchParams.toString(), i = `${e.pathname}${s ? `?${s}` : ""}${e.hash}`;
1692
+ window.history.replaceState({}, document.title, i);
1693
+ }
1694
+ }
1695
+ async handleOAuthCallbackIfPresent() {
1696
+ const e = new URLSearchParams(window.location.search), t = e.get("code"), s = e.get("state"), i = e.get("error"), r = e.get("error_description");
1697
+ if (!(!t && !i) && !this.hasHandledOAuthCallback && this.isOAuthConfigured()) {
1698
+ if (!this.hasApiBaseUrl()) {
1699
+ this.error = this.baseUrlErrorMessage;
1700
+ return;
1701
+ }
1702
+ this.hasHandledOAuthCallback = !0, this.isLoading = !0, this.error = "";
1703
+ try {
1704
+ if (i)
1705
+ throw new Error(r || `OAuth error: ${i}`);
1706
+ if (!t || !s)
1707
+ throw new Error("Missing authorization code or state parameter");
1708
+ const o = this.getOAuthService();
1709
+ if (!o)
1710
+ throw new Error("OAuth is not configured correctly. Please try again later.");
1711
+ if (!o.validateState(s))
1712
+ throw new Error("Invalid state parameter. Please try signing in again.");
1713
+ const a = await o.exchangeCodeForTokens(t), { accessToken: h, idToken: n, refreshToken: c } = await this.getApiService().login({
1714
+ accessToken: a.access_token,
1715
+ refreshToken: a.refresh_token,
1716
+ idToken: a.id_token
1717
+ });
1718
+ this.setAuthTokens(h, n, c ?? a.refresh_token);
1719
+ } catch (o) {
1720
+ this.error = o.message || "An unexpected error occurred during authentication";
1721
+ } finally {
1722
+ this.stripOAuthParamsFromUrl(), this.isLoading = !1;
1723
+ }
1724
+ }
1725
+ }
1726
+ async handleRequestSignupOtp() {
1727
+ this.signupStep = "otp", this.notice = "A 6-digit code has been sent to your email", this.signupOtpDigits = ["", "", "", "", "", ""], await this.getApiService().requestRegisterOtp({ email: this.email.trim() }), setTimeout(() => {
1728
+ this.shadowRoot?.querySelector(".signup-otp-input")?.focus();
1729
+ }, 200);
1730
+ }
1731
+ async handleSignupWithOtp() {
1732
+ const e = {
1733
+ email: this.email.trim(),
1734
+ password: this.password,
1735
+ givenName: this.givenName.trim(),
1736
+ familyName: this.familyName.trim(),
1737
+ code: this.signupOtpDigits.join("")
1738
+ };
1739
+ await this.getApiService().register({
1740
+ email: e.email,
1741
+ password: e.password,
1742
+ given_name: e.givenName,
1743
+ family_name: e.familyName,
1744
+ code: e.code
1745
+ }), await this.handleSignIn();
1746
+ }
1747
+ async handleRequestReset() {
1748
+ const e = {
1749
+ email: this.email.trim()
1750
+ };
1751
+ this.resetStep = "confirm", this.notice = "If an account exists, a 6-digit code has been sent", this.otpDigits = ["", "", "", "", "", ""], await this.getApiService().requestResetPassword(e), setTimeout(() => {
1752
+ this.shadowRoot?.querySelector(".reset-otp-input")?.focus();
1753
+ }, 100);
1754
+ }
1755
+ async handleConfirmReset() {
1756
+ const e = {
1757
+ email: this.email.trim(),
1758
+ newPassword: this.newPassword,
1759
+ otp: this.otpDigits.join("")
1760
+ };
1761
+ await this.getApiService().resetPassword({
1762
+ email: e.email,
1763
+ newPassword: e.newPassword,
1764
+ otp: e.otp
1765
+ }), await this.handleSignIn();
1766
+ }
1767
+ async logout() {
1768
+ const e = this.cookies.getAuthToken("ACCESS_TOKEN"), t = this.cookies.getAuthToken("AUTH_TOKEN"), s = this.cookies.getAuthToken("REFRESH_TOKEN");
1769
+ if (e == null || s == null || t == null) {
1770
+ this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1;
1771
+ return;
1772
+ }
1773
+ if (!this.hasApiBaseUrl()) {
1774
+ this.error = this.baseUrlErrorMessage;
1775
+ return;
1776
+ }
1777
+ const i = this.getApiService(), {
1778
+ redirectUrl: r,
1779
+ requiresRedirect: o
1780
+ } = await i.logout({
1781
+ accessToken: e,
1782
+ refreshToken: s,
1783
+ authToken: t
1784
+ });
1785
+ if (this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1, o && r) {
1786
+ const a = window.location.host;
1787
+ new URL(r).host !== a ? window.open(r, "newWindow", "width=400,height=400,resizable=yes,scrollbars=yes,status=yes") : window.location.href = r;
1788
+ }
1789
+ }
1790
+ // OAuth handlers
1791
+ handleGoogleSignIn() {
1792
+ this.getOAuthService()?.redirectToGoogleAuth();
1793
+ }
1794
+ handleAppleSignIn() {
1795
+ this.getOAuthService()?.redirectToAppleAuth();
1796
+ }
1797
+ // OTP input handlers
1798
+ handleOtpInput(e, t, s) {
1799
+ const i = t.target, r = i.value.replace(/\D/g, "");
1800
+ if (!r) {
1801
+ s ? (this.signupOtpDigits[e] = "", this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e] = "", this.otpDigits = [...this.otpDigits]);
1802
+ return;
1803
+ }
1804
+ const o = r[r.length - 1];
1805
+ if (s ? (this.signupOtpDigits[e] = o, this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e] = o, this.otpDigits = [...this.otpDigits]), e < 5) {
1806
+ const a = this.shadowRoot?.querySelector(
1807
+ `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e + 1}"]`
1808
+ );
1809
+ a?.focus(), a?.select();
1810
+ } else
1811
+ i.blur();
1812
+ }
1813
+ handleOtpKeydown(e, t, s) {
1814
+ const i = s ? this.signupOtpDigits : this.otpDigits;
1815
+ if (t.key === "Backspace") {
1816
+ if (i[e]) {
1817
+ s ? (this.signupOtpDigits[e] = "", this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e] = "", this.otpDigits = [...this.otpDigits]);
1818
+ return;
1819
+ }
1820
+ if (e > 0) {
1821
+ const r = this.shadowRoot?.querySelector(
1822
+ `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e - 1}"]`
1823
+ );
1824
+ r?.focus(), r?.select(), s ? (this.signupOtpDigits[e - 1] = "", this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e - 1] = "", this.otpDigits = [...this.otpDigits]);
1825
+ }
1826
+ }
1827
+ if (t.key === "ArrowLeft" && e > 0) {
1828
+ const r = this.shadowRoot?.querySelector(
1829
+ `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e - 1}"]`
1830
+ );
1831
+ r?.focus(), r?.select(), t.preventDefault();
1832
+ }
1833
+ if (t.key === "ArrowRight" && e < 5) {
1834
+ const r = this.shadowRoot?.querySelector(
1835
+ `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e + 1}"]`
1836
+ );
1837
+ r?.focus(), r?.select(), t.preventDefault();
1838
+ }
1839
+ t.key.length === 1 && /\D/.test(t.key) && t.preventDefault();
1840
+ }
1841
+ handleOtpPaste(e, t) {
1842
+ const i = (e.clipboardData?.getData("text") || "").replace(/\D/g, "").slice(0, 6).split("");
1843
+ if (i.length === 0) return;
1844
+ e.preventDefault();
1845
+ for (let o = 0; o < 6; o++)
1846
+ t ? this.signupOtpDigits[o] = i[o] || "" : this.otpDigits[o] = i[o] || "";
1847
+ t ? this.signupOtpDigits = [...this.signupOtpDigits] : this.otpDigits = [...this.otpDigits];
1848
+ const r = (t ? this.signupOtpDigits : this.otpDigits).findIndex((o) => !o);
1849
+ if (r === -1)
1850
+ this.shadowRoot?.querySelector(
1851
+ `${t ? ".signup-otp-input" : ".reset-otp-input"}[data-index="5"]`
1852
+ )?.blur();
1853
+ else {
1854
+ const o = this.shadowRoot?.querySelector(
1855
+ `${t ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${r}"]`
1856
+ );
1857
+ o?.focus(), o?.select();
1858
+ }
1859
+ }
1860
+ render() {
1861
+ if (!this.isVisible)
1862
+ return g;
1863
+ const e = {
1864
+ "modal-overlay": !0,
1865
+ "modal-overlay--closing": this.isClosing
1866
+ }, t = {
1867
+ "modal-container": !0,
1868
+ "modal-container--drawer": !0,
1869
+ "modal-container--closing": this.isClosing,
1870
+ "modal-container--dragging": this.isDragging,
1871
+ [`modal-container--${this.size}`]: !0
1872
+ };
1873
+ return f`
1874
+ <!-- Modal/Drawer -->
1875
+ <div
1876
+ class=${mt(e)}
1877
+ @click=${this.handleOverlayClick}
1878
+ @touchstart=${this.handleDragStart}
1879
+ @touchmove=${this.handleDragMove}
1880
+ @touchend=${this.handleDragEnd}
1881
+ @mousedown=${this.handleDragStart}
1882
+ >
1883
+ <div
1884
+ class=${mt(t)}
1885
+ @click=${(s) => s.stopPropagation()}
1886
+ role="dialog"
1887
+ aria-modal="true"
1888
+ @mousemove=${this.handleDragMove}
1889
+ @mouseup=${this.handleDragEnd}
1890
+ >
1891
+ <!-- Drawer Handle -->
1892
+ <div
1893
+ class="drawer-handle"
1894
+ @click=${this.handleHandleClick}
1895
+ role="button"
1896
+ tabindex="0"
1897
+ aria-label="Close drawer"
1898
+ >
1899
+ <div class="drawer-handle-bar"></div>
1900
+ </div>
1901
+
1902
+ <!-- Drawer Content Wrapper -->
1903
+ <div class="drawer-content drawer-content--${this.size}">
1904
+ ${this.renderContent()}
1905
+ </div>
1906
+ </div>
1907
+ </div>
1908
+ `;
1909
+ }
1910
+ renderContent() {
1911
+ if (!this.hasApiBaseUrl()) {
1912
+ const e = this.baseUrlErrorMessage;
1913
+ return f`
1914
+ ${this.logoUrl.length > 0 ? f`
1915
+ <header class="modal-header">
1916
+ <div class="auth-header">
1917
+ <img
1918
+ src="${this.logoUrl}"
1919
+ width="48"
1920
+ height="48"
1921
+ alt="Logo"
1922
+ class="auth-logo"
1923
+ />
1924
+ </div>
1925
+ </header>
1926
+ ` : g}
1927
+
1928
+ <div class="modal-body">
1929
+ <div class="auth-form">
1930
+ <div class="alert alert--error">
1931
+ ${e}
1932
+ </div>
1933
+ </div>
1934
+ </div>
1935
+ `;
1936
+ }
1937
+ return this.isLoggedIn ? f`
1938
+ <!-- Header -->
1939
+ ${this.logoUrl.length > 0 ? f`
1940
+ <header class="modal-header">
1941
+ <div class="auth-header">
1942
+ <img
1943
+ src="${this.logoUrl}"
1944
+ width="48"
1945
+ height="48"
1946
+ alt="Logo"
1947
+ class="auth-logo"
1948
+ />
1949
+ </div>
1950
+ </header>
1951
+ ` : g}
1952
+
1953
+ <!-- Body -->
1954
+ <div class="modal-body">
1955
+ <div class="auth-form">
1956
+ <div class="form-actions">
1957
+ <button type="button" class="cta" @click=${this.logout}>Logout</button>
1958
+ </div>
1959
+ ${this.renderAlerts()}
1960
+ </div>
1961
+ </div>
1962
+ ` : f`
1963
+ <!-- Header -->
1964
+ ${(!this.mode || this.resetStep === "none") && this.logoUrl.length > 0 && this.mode === "signin" ? f`
1965
+ <header class="modal-header">
1966
+
1967
+ <div class="auth-header">
1968
+ <img
1969
+ src="${this.logoUrl}"
1970
+ width="48"
1971
+ height="48"
1972
+ alt="Logo"
1973
+ class="auth-logo"
1974
+ />
1975
+ </div>
1976
+ </header>
1977
+ ` : g}
1978
+
1979
+ <!-- Body -->
1980
+ <div class="modal-body">
1981
+ <form @submit=${this.handleSubmit} class="auth-form" novalidate>
1982
+ ${this.renderFormContent()}
1983
+
1984
+ <!-- Actions -->
1985
+ <div class="form-actions">
1986
+ ${this.renderActions()}
1987
+ </div>
1988
+
1989
+ ${this.renderAlerts()}
1990
+ </form>
1991
+
1992
+ ${this.renderFooter()}
1993
+ </div>
1994
+ `;
1995
+ }
1996
+ renderFormContent() {
1997
+ if (this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form"))
1998
+ return f`
1999
+ <!-- Email -->
2000
+ <label class="field">
2001
+ <span class="field-label">Email Address</span>
2002
+ <input
2003
+ id="email-input"
2004
+ type="email"
2005
+ class="field-input ${this.errors.email ? "field-input--error" : ""}"
2006
+ placeholder="Enter your email"
2007
+ .value=${this.email}
2008
+ @input=${(e) => this.email = e.target.value}
2009
+ required
2010
+ autocomplete="email"
2011
+ />
2012
+ ${this.errors.email ? f`<span class="field-error">${this.errors.email}</span>` : g}
2013
+ </label>
2014
+
2015
+ <!-- Password -->
2016
+ <label class="field">
2017
+ <span class="field-label">Password</span>
2018
+ <input
2019
+ type="password"
2020
+ class="field-input ${this.errors.password ? "field-input--error" : ""}"
2021
+ placeholder="Enter your password"
2022
+ .value=${this.password}
2023
+ @input=${(e) => this.password = e.target.value}
2024
+ required
2025
+ autocomplete=${this.mode === "signup" ? "new-password" : "current-password"}
2026
+ />
2027
+ ${this.errors.password ? f`<span class="field-error">${this.errors.password}</span>` : g}
2028
+ </label>
2029
+
2030
+ ${this.mode === "signin" && this.error ? f`
2031
+ <div class="forgot-row">
2032
+ <button type="button" class="text-btn" @click=${this.startReset}>
2033
+ Forgot your password?
2034
+ </button>
2035
+ </div>
2036
+ ` : g}
2037
+
2038
+ ${this.mode === "signup" ? f`
2039
+ <!-- Confirm Password -->
2040
+ <label class="field">
2041
+ <span class="field-label">Confirm Password</span>
2042
+ <input
2043
+ type="password"
2044
+ class="field-input ${this.errors.confirm_password ? "field-input--error" : ""}"
2045
+ placeholder="Re-enter your password"
2046
+ .value=${this.confirmPassword}
2047
+ @input=${(e) => this.confirmPassword = e.target.value}
2048
+ required
2049
+ autocomplete="new-password"
2050
+ />
2051
+ ${this.errors.confirm_password ? f`<span class="field-error">${this.errors.confirm_password}</span>` : g}
2052
+ </label>
2053
+
2054
+ <!-- First Name -->
2055
+ <label class="field">
2056
+ <span class="field-label">First Name</span>
2057
+ <input
2058
+ type="text"
2059
+ class="field-input ${this.errors.givenName ? "field-input--error" : ""}"
2060
+ placeholder="Enter your first name"
2061
+ .value=${this.givenName}
2062
+ @input=${(e) => this.givenName = e.target.value}
2063
+ required
2064
+ autocomplete="given-name"
2065
+ />
2066
+ ${this.errors.givenName ? f`<span class="field-error">${this.errors.givenName}</span>` : g}
2067
+ </label>
2068
+
2069
+ <!-- Last Name -->
2070
+ <label class="field">
2071
+ <span class="field-label">Last Name</span>
2072
+ <input
2073
+ type="text"
2074
+ class="field-input ${this.errors.familyName ? "field-input--error" : ""}"
2075
+ placeholder="Enter your last name"
2076
+ .value=${this.familyName}
2077
+ @input=${(e) => this.familyName = e.target.value}
2078
+ required
2079
+ autocomplete="family-name"
2080
+ />
2081
+ ${this.errors.familyName ? f`<span class="field-error">${this.errors.familyName}</span>` : g}
2082
+ </label>
2083
+ ` : g}
2084
+ `;
2085
+ if (this.mode === "signup" && this.signupStep === "otp")
2086
+ return f`
2087
+ <div class="otp-section">
2088
+ <label class="otp-label">Enter 6-digit code</label>
2089
+ <div class="otp-inputs" role="group" aria-label="One time code">
2090
+ ${$t(
2091
+ Array.from({ length: 6 }, (e, t) => t),
2092
+ (e) => e,
2093
+ (e) => f`
2094
+ <input
2095
+ class="otp-input signup-otp-input ${this.errors.signup_otp ? "otp-input--error" : ""}"
2096
+ type="text"
2097
+ inputmode="numeric"
2098
+ pattern="[0-9]*"
2099
+ maxlength="1"
2100
+ data-index="${e}"
2101
+ .value=${this.signupOtpDigits[e]}
2102
+ @input=${(t) => this.handleOtpInput(e, t, !0)}
2103
+ @keydown=${(t) => this.handleOtpKeydown(e, t, !0)}
2104
+ @paste=${(t) => this.handleOtpPaste(t, !0)}
2105
+ aria-label="Digit ${e + 1}"
2106
+ />
2107
+ `
2108
+ )}
2109
+ </div>
2110
+ ${this.errors.signup_otp ? f`<p class="otp-error">${this.errors.signup_otp}</p>` : g}
2111
+ </div>
2112
+ <div class="forgot-row">
2113
+ <button type="button" class="text-btn" @click=${this.backToSignupForm}>
2114
+ Didn't get a code? Go back
2115
+ </button>
2116
+ </div>
2117
+ `;
2118
+ if (this.resetStep === "request")
2119
+ return f`
2120
+ <label class="field">
2121
+ <span class="field-label">Email Address</span>
2122
+ <input
2123
+ id="email-input"
2124
+ type="email"
2125
+ class="field-input ${this.errors.email ? "field-input--error" : ""}"
2126
+ placeholder="Enter your email"
2127
+ .value=${this.email}
2128
+ @input=${(e) => this.email = e.target.value}
2129
+ required
2130
+ autocomplete="email"
2131
+ />
2132
+ ${this.errors.email ? f`<span class="field-error">${this.errors.email}</span>` : g}
2133
+ </label>
2134
+ <div class="forgot-row">
2135
+ <button type="button" class="text-btn" @click=${this.cancelReset}>
2136
+ Back to Sign In
2137
+ </button>
2138
+ </div>
2139
+ `;
2140
+ if (this.resetStep === "confirm") {
2141
+ const e = this.otpDigits.every((t) => /^\d$/.test(t));
2142
+ return f`
2143
+ <label class="field">
2144
+ <span class="field-label">Email Address</span>
2145
+ <input
2146
+ type="email"
2147
+ class="field-input ${this.errors.email ? "field-input--error" : ""}"
2148
+ placeholder="Enter your email"
2149
+ .value=${this.email}
2150
+ @input=${(t) => this.email = t.target.value}
2151
+ required
2152
+ autocomplete="email"
2153
+ />
2154
+ ${this.errors.email ? f`<span class="field-error">${this.errors.email}</span>` : g}
2155
+ </label>
2156
+
2157
+ <div class="otp-section">
2158
+ <label class="otp-label">Enter 6-digit code</label>
2159
+ <div class="otp-inputs" role="group" aria-label="One time code">
2160
+ ${$t(
2161
+ Array.from({ length: 6 }, (t, s) => s),
2162
+ (t) => t,
2163
+ (t) => f`
2164
+ <input
2165
+ class="otp-input reset-otp-input ${this.errors.otp ? "otp-input--error" : ""}"
2166
+ type="text"
2167
+ inputmode="numeric"
2168
+ pattern="[0-9]*"
2169
+ maxlength="1"
2170
+ data-index="${t}"
2171
+ .value=${this.otpDigits[t]}
2172
+ @input=${(s) => this.handleOtpInput(t, s, !1)}
2173
+ @keydown=${(s) => this.handleOtpKeydown(t, s, !1)}
2174
+ @paste=${(s) => this.handleOtpPaste(s, !1)}
2175
+ aria-label="Digit ${t + 1}"
2176
+ />
2177
+ `
2178
+ )}
2179
+ </div>
2180
+ ${this.errors.otp ? f`<p class="otp-error">${this.errors.otp}</p>` : g}
2181
+ </div>
2182
+
2183
+ ${e ? f`
2184
+ <div class="new-password-fields">
2185
+ <label class="field">
2186
+ <span class="field-label">New Password</span>
2187
+ <input
2188
+ type="password"
2189
+ class="field-input ${this.errors.new_password ? "field-input--error" : ""}"
2190
+ placeholder="Enter your new password"
2191
+ .value=${this.newPassword}
2192
+ @input=${(t) => this.newPassword = t.target.value}
2193
+ required
2194
+ autocomplete="new-password"
2195
+ />
2196
+ ${this.errors.new_password ? f`<span class="field-error">${this.errors.new_password}</span>` : g}
2197
+ </label>
2198
+
2199
+ <label class="field">
2200
+ <span class="field-label">Confirm New Password</span>
2201
+ <input
2202
+ type="password"
2203
+ class="field-input ${this.errors.confirm_password ? "field-input--error" : ""}"
2204
+ placeholder="Re-enter your new password"
2205
+ .value=${this.confirmPassword}
2206
+ @input=${(t) => this.confirmPassword = t.target.value}
2207
+ required
2208
+ autocomplete="new-password"
2209
+ />
2210
+ ${this.errors.confirm_password ? f`<span class="field-error">${this.errors.confirm_password}</span>` : g}
2211
+ </label>
2212
+ </div>
2213
+ ` : g}
2214
+
2215
+ <div class="forgot-row">
2216
+ <button type="button" class="text-btn" @click=${this.backToRequest}>
2217
+ Didn't get a code? Resend
2218
+ </button>
2219
+ </div>
2220
+ `;
2221
+ }
2222
+ return g;
2223
+ }
2224
+ renderActions() {
2225
+ if (this.resetStep === "request")
2226
+ return f`
2227
+ <button type="submit" class="cta" ?disabled=${this.isLoading}>
2228
+ ${this.isLoading ? "Sending..." : "Send Reset Code"}
2229
+ </button>
2230
+ `;
2231
+ if (this.resetStep === "confirm")
2232
+ return this.otpDigits.every((t) => /^\d$/.test(t)) ? f`
2233
+ <button type="submit" class="cta" ?disabled=${this.isLoading}>
2234
+ ${this.isLoading ? "Resetting..." : "Reset Password"}
2235
+ </button>
2236
+ ` : g;
2237
+ if (this.mode === "signup" && this.signupStep === "otp") {
2238
+ const e = this.signupOtpDigits.every((t) => /^\d$/.test(t));
2239
+ return f`
2240
+ <button type="submit" class="cta" ?disabled=${!e || this.isLoading}>
2241
+ ${this.isLoading ? "Completing..." : "Complete Registration"}
2242
+ </button>
2243
+ `;
2244
+ }
2245
+ return f`
2246
+ <button type="submit" class="cta" ?disabled=${this.isLoading}>
2247
+ ${this.isLoading ? "Loading..." : this.mode === "signup" ? "Continue" : "Sign In"}
2248
+ </button>
2249
+
2250
+ ${this.isOAuthConfigured() && this.mode === "signin" ? f`
2251
+ <div class="button-row">
2252
+ <button
2253
+ type="button"
2254
+ class="oauth-btn"
2255
+ @click=${this.handleGoogleSignIn}
2256
+ ?disabled=${this.isLoading}
2257
+ >
2258
+ ${this.renderGoogleIcon()}
2259
+ </button>
2260
+
2261
+ <button
2262
+ type="button"
2263
+ class="oauth-btn"
2264
+ @click=${this.handleAppleSignIn}
2265
+ ?disabled=${this.isLoading}
2266
+ >
2267
+ ${this.renderAppleIcon()}
2268
+ </button>
2269
+ </div>
2270
+ ` : g}
2271
+ `;
2272
+ }
2273
+ renderAlerts() {
2274
+ return f`
2275
+ ${this.notice ? f`
2276
+ <div class="alert alert--success">
2277
+ ${this.notice}
2278
+ <button class="alert-close" @click=${() => this.notice = ""} aria-label="Dismiss">
2279
+ ×
2280
+ </button>
2281
+ </div>
2282
+ ` : g}
2283
+ ${this.error ? f`
2284
+ <div class="alert alert--error">
2285
+ ${this.error}
2286
+ <button class="alert-close" @click=${() => this.error = ""} aria-label="Dismiss">
2287
+ ×
2288
+ </button>
2289
+ </div>
2290
+ ` : g}
2291
+ `;
2292
+ }
2293
+ renderFooter() {
2294
+ return this.isLoggedIn ? g : this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form") ? f`
2295
+ <div class="auth-footer">
2296
+ <p class="toggle-text">
2297
+ ${this.mode === "signup" ? "Already have an account?" : "Don't have an account?"}
2298
+ </p>
2299
+ <button type="button" class="text-btn" @click=${this.toggleMode}>
2300
+ ${this.mode === "signup" ? "Sign In" : "Sign Up"}
2301
+ </button>
2302
+ </div>
2303
+ ` : f`
2304
+ <div class="auth-footer">
2305
+ <p class="toggle-text">
2306
+ Having trouble? Email
2307
+ <a href="mailto:support@example.com">support@example.com</a>
2308
+ </p>
2309
+ </div>
2310
+ `;
2311
+ }
2312
+ renderGoogleIcon() {
2313
+ return f`
2314
+ <svg viewBox="-0.5 0 48 48" width="18" height="18" fill="none">
2315
+ <path d="M9.82727273,24 C9.82727273,22.4757333 10.0804318,21.0144 10.5322727,19.6437333 L2.62345455,13.6042667 C1.08206818,16.7338667 0.213636364,20.2602667 0.213636364,24 C0.213636364,27.7365333 1.081,31.2608 2.62025,34.3882667 L10.5247955,28.3370667 C10.0772273,26.9728 9.82727273,25.5168 9.82727273,24" fill="#FBBC05"></path>
2316
+ <path d="M23.7136364,10.1333333 C27.025,10.1333333 30.0159091,11.3066667 32.3659091,13.2266667 L39.2022727,6.4 C35.0363636,2.77333333 29.6954545,0.533333333 23.7136364,0.533333333 C14.4268636,0.533333333 6.44540909,5.84426667 2.62345455,13.6042667 L10.5322727,19.6437333 C12.3545909,14.112 17.5491591,10.1333333 23.7136364,10.1333333" fill="#EB4335"></path>
2317
+ <path d="M23.7136364,37.8666667 C17.5491591,37.8666667 12.3545909,33.888 10.5322727,28.3562667 L2.62345455,34.3946667 C6.44540909,42.1557333 14.4268636,47.4666667 23.7136364,47.4666667 C29.4455,47.4666667 34.9177955,45.4314667 39.0249545,41.6181333 L31.5177727,35.8144 C29.3995682,37.1488 26.7323182,37.8666667 23.7136364,37.8666667" fill="#34A853"></path>
2318
+ <path d="M46.1454545,24 C46.1454545,22.6133333 45.9318182,21.12 45.6113636,19.7333333 L23.7136364,19.7333333 L23.7136364,28.8 L36.3181818,28.8 C35.6879545,31.8912 33.9724545,34.2677333 31.5177727,35.8144 L39.0249545,41.6181333 C43.3393409,37.6138667 46.1454545,31.6490667 46.1454545,24" fill="#4285F4"></path>
2319
+ </svg>
2320
+ `;
2321
+ }
2322
+ renderAppleIcon() {
2323
+ return f`
2324
+ <svg viewBox="-3.5 0 48 48" width="18" height="18" class="apple-icon">
2325
+ <path d="M231.174735,567.792499 C232.740177,565.771699 233.926883,562.915484 233.497649,560 C230.939077,560.177808 227.948466,561.814769 226.203475,563.948463 C224.612784,565.88177 223.305444,568.757742 223.816036,571.549042 C226.613071,571.636535 229.499881,569.960061 231.174735,567.792499 L231.174735,567.792499 Z M245,595.217241 C243.880625,597.712195 243.341978,598.827022 241.899976,601.03692 C239.888467,604.121745 237.052156,607.962958 233.53412,607.991182 C230.411652,608.02505 229.606488,605.94498 225.367451,605.970382 C221.128414,605.99296 220.244696,608.030695 217.116618,607.999649 C213.601387,607.968603 210.913765,604.502761 208.902256,601.417937 C203.27452,592.79849 202.68257,582.680377 206.152914,577.298162 C208.621711,573.476705 212.515678,571.241407 216.173986,571.241407 C219.89682,571.241407 222.239372,573.296075 225.322563,573.296075 C228.313175,573.296075 230.133913,571.235762 234.440281,571.235762 C237.700215,571.235762 241.153726,573.022307 243.611302,576.10431 C235.554045,580.546683 236.85858,592.121127 245,595.217241 L245,595.217241 Z" transform="translate(-204.000000, -560.000000)" fill="#0b0b0a"></path>
2326
+ </svg>
2327
+ `;
2328
+ }
2329
+ // Public methods for external control
2330
+ setError(e) {
2331
+ this.error = e;
2332
+ }
2333
+ setNotice(e) {
2334
+ this.notice = e;
2335
+ }
2336
+ closeModal() {
2337
+ this.handleClose();
2338
+ }
2339
+ openModal() {
2340
+ this.open = !0, this.isVisible = !0;
2341
+ }
2342
+ async refresh() {
2343
+ try {
2344
+ if (!this.hasApiBaseUrl()) {
2345
+ this.error = this.baseUrlErrorMessage;
2346
+ return;
2347
+ }
2348
+ const e = this.cookies.getAuthToken("REFRESH_TOKEN"), t = this.cookies.getAuthToken("ACCESS_TOKEN"), s = this.cookies.getAuthToken("AUTH_TOKEN");
2349
+ if (!e || !t || !s) {
2350
+ this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1;
2351
+ return;
2352
+ }
2353
+ const { accessToken: i, idToken: r, refreshToken: o } = await this.getApiService().refresh({
2354
+ refreshToken: e
2355
+ });
2356
+ this.cookies.setAuthToken("ACCESS_TOKEN", i), this.cookies.setAuthToken("AUTH_TOKEN", r), this.cookies.setAuthToken("REFRESH_TOKEN", o ?? e);
2357
+ } catch {
2358
+ this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1;
2359
+ }
2360
+ }
2361
+ };
2362
+ m.styles = de();
2363
+ y([
2364
+ S({ type: Boolean, reflect: !0 })
2365
+ ], m.prototype, "open", 2);
2366
+ y([
2367
+ S({ type: String, attribute: "initial-mode" })
2368
+ ], m.prototype, "initialMode", 2);
2369
+ y([
2370
+ S({ type: String, attribute: "logo-url" })
2371
+ ], m.prototype, "logoUrl", 2);
2372
+ y([
2373
+ S({ type: String, attribute: "api-domain" })
2374
+ ], m.prototype, "baseUrl", 2);
2375
+ y([
2376
+ S({ type: String, attribute: "oauth-domain" })
2377
+ ], m.prototype, "oauthDomain", 2);
2378
+ y([
2379
+ S({ type: String, attribute: "oauth-region" })
2380
+ ], m.prototype, "oauthRegion", 2);
2381
+ y([
2382
+ S({ type: String, attribute: "oauth-user-pool-id" })
2383
+ ], m.prototype, "oauthUserPoolId", 2);
2384
+ y([
2385
+ S({ type: String, attribute: "oauth-client-id" })
2386
+ ], m.prototype, "oauthClientId", 2);
2387
+ y([
2388
+ S({ type: String, attribute: "oauth-redirect-uri" })
2389
+ ], m.prototype, "oauthRedirectUri", 2);
2390
+ y([
2391
+ S({ type: String, attribute: "size" })
2392
+ ], m.prototype, "size", 2);
2393
+ y([
2394
+ S({ type: String, attribute: "data-theme", reflect: !0 })
2395
+ ], m.prototype, "theme", 2);
2396
+ y([
2397
+ b()
2398
+ ], m.prototype, "mode", 2);
2399
+ y([
2400
+ b()
2401
+ ], m.prototype, "resetStep", 2);
2402
+ y([
2403
+ b()
2404
+ ], m.prototype, "signupStep", 2);
2405
+ y([
2406
+ b()
2407
+ ], m.prototype, "isLoading", 2);
2408
+ y([
2409
+ b()
2410
+ ], m.prototype, "isClosing", 2);
2411
+ y([
2412
+ b()
2413
+ ], m.prototype, "isVisible", 2);
2414
+ y([
2415
+ b()
2416
+ ], m.prototype, "isLoggedIn", 2);
2417
+ y([
2418
+ b()
2419
+ ], m.prototype, "email", 2);
2420
+ y([
2421
+ b()
2422
+ ], m.prototype, "password", 2);
2423
+ y([
2424
+ b()
2425
+ ], m.prototype, "givenName", 2);
2426
+ y([
2427
+ b()
2428
+ ], m.prototype, "familyName", 2);
2429
+ y([
2430
+ b()
2431
+ ], m.prototype, "newPassword", 2);
2432
+ y([
2433
+ b()
2434
+ ], m.prototype, "confirmPassword", 2);
2435
+ y([
2436
+ b()
2437
+ ], m.prototype, "notice", 2);
2438
+ y([
2439
+ b()
2440
+ ], m.prototype, "error", 2);
2441
+ y([
2442
+ b()
2443
+ ], m.prototype, "errors", 2);
2444
+ y([
2445
+ b()
2446
+ ], m.prototype, "otpDigits", 2);
2447
+ y([
2448
+ b()
2449
+ ], m.prototype, "signupOtpDigits", 2);
2450
+ y([
2451
+ b()
2452
+ ], m.prototype, "isDragging", 2);
2453
+ y([
2454
+ b()
2455
+ ], m.prototype, "dragStartY", 2);
2456
+ y([
2457
+ b()
2458
+ ], m.prototype, "dragCurrentY", 2);
2459
+ y([
2460
+ b()
2461
+ ], m.prototype, "dragStartTime", 2);
2462
+ y([
2463
+ b()
2464
+ ], m.prototype, "lastDragEndTime", 2);
2465
+ y([
2466
+ it(".modal-container")
2467
+ ], m.prototype, "modalContainer", 2);
2468
+ y([
2469
+ it("#email-input")
2470
+ ], m.prototype, "emailInput", 2);
2471
+ y([
2472
+ it(".modal-body")
2473
+ ], m.prototype, "modalBody", 2);
2474
+ m = y([
2475
+ Zt("cals-auth")
2476
+ ], m);
2477
+ export {
2478
+ m as CalsAuth
2479
+ };