@contember/echo 0.0.30 → 0.0.32

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/echo.es.js CHANGED
@@ -1,6 +1,6 @@
1
- import { sharedConfig as L, createRoot as Ue, createRenderEffect as b, untrack as Ye, getOwner as De, createEffect as Y, runWithOwner as lt, createMemo as k, createSignal as A, onCleanup as ee, $PROXY as R, $TRACK as Fe, getListener as Ce, batch as ct, onMount as ye, createContext as dt, createComponent as f, useContext as ut, For as _, Show as D, mergeProps as ge, Switch as ht, Match as te } from "solid-js";
2
- import ft from "html2canvas";
3
- const gt = [
1
+ import { sharedConfig as L, createRoot as Ue, createRenderEffect as b, untrack as Ye, getOwner as De, createEffect as ee, runWithOwner as lt, createMemo as k, createSignal as A, onCleanup as te, $PROXY as Y, $TRACK as Fe, getListener as $e, batch as ct, onMount as ye, createContext as dt, createComponent as g, useContext as ut, For as W, Show as D, mergeProps as ae, Switch as ht, Match as ne } from "solid-js";
2
+ import gt from "html2canvas";
3
+ const ft = [
4
4
  "allowfullscreen",
5
5
  "async",
6
6
  "autofocus",
@@ -34,7 +34,7 @@ const gt = [
34
34
  "isMap",
35
35
  "noModule",
36
36
  "playsInline",
37
- ...gt
37
+ ...ft
38
38
  ]), vt = /* @__PURE__ */ new Set([
39
39
  "innerHTML",
40
40
  "textContent",
@@ -68,11 +68,11 @@ const gt = [
68
68
  TEXTAREA: 1
69
69
  }
70
70
  });
71
- function yt(e, n) {
71
+ function pt(e, n) {
72
72
  const t = wt[e];
73
73
  return typeof t == "object" ? t[n] ? t.$ : void 0 : t;
74
74
  }
75
- const pt = /* @__PURE__ */ new Set([
75
+ const yt = /* @__PURE__ */ new Set([
76
76
  "beforeinput",
77
77
  "click",
78
78
  "dblclick",
@@ -106,29 +106,29 @@ function xt(e, n, t) {
106
106
  for (; n[a - 1] === t[o - 1]; )
107
107
  a--, o--;
108
108
  if (a === i) {
109
- const d = o < r ? l ? t[l - 1].nextSibling : t[o - l] : s;
110
- for (; l < o; ) e.insertBefore(t[l++], d);
109
+ const u = o < r ? l ? t[l - 1].nextSibling : t[o - l] : s;
110
+ for (; l < o; ) e.insertBefore(t[l++], u);
111
111
  } else if (o === l)
112
112
  for (; i < a; )
113
113
  (!c || !c.has(n[i])) && n[i].remove(), i++;
114
114
  else if (n[i] === t[o - 1] && t[l] === n[a - 1]) {
115
- const d = n[--a].nextSibling;
116
- e.insertBefore(t[l++], n[i++].nextSibling), e.insertBefore(t[--o], d), n[a] = t[o];
115
+ const u = n[--a].nextSibling;
116
+ e.insertBefore(t[l++], n[i++].nextSibling), e.insertBefore(t[--o], u), n[a] = t[o];
117
117
  } else {
118
118
  if (!c) {
119
119
  c = /* @__PURE__ */ new Map();
120
120
  let h = l;
121
121
  for (; h < o; ) c.set(t[h], h++);
122
122
  }
123
- const d = c.get(n[i]);
124
- if (d != null)
125
- if (l < d && d < o) {
126
- let h = i, g = 1, m;
127
- for (; ++h < a && h < o && !((m = c.get(n[h])) == null || m !== d + g); )
128
- g++;
129
- if (g > d - l) {
130
- const y = n[i];
131
- for (; l < d; ) e.insertBefore(t[l++], y);
123
+ const u = c.get(n[i]);
124
+ if (u != null)
125
+ if (l < u && u < o) {
126
+ let h = i, f = 1, m;
127
+ for (; ++h < a && h < o && !((m = c.get(n[h])) == null || m !== u + f); )
128
+ f++;
129
+ if (f > u - l) {
130
+ const p = n[i];
131
+ for (; l < u; ) e.insertBefore(t[l++], p);
132
132
  } else e.replaceChild(t[l++], n[i++]);
133
133
  } else i++;
134
134
  else n[i++].remove();
@@ -159,14 +159,14 @@ function T(e, n = window.document) {
159
159
  t.has(o) || (t.add(o), n.addEventListener(o, zt));
160
160
  }
161
161
  }
162
- function u(e, n, t) {
163
- ce(e) || (t == null ? e.removeAttribute(n) : e.setAttribute(n, t));
162
+ function d(e, n, t) {
163
+ de(e) || (t == null ? e.removeAttribute(n) : e.setAttribute(n, t));
164
164
  }
165
165
  function St(e, n, t) {
166
- ce(e) || (t ? e.setAttribute(n, "") : e.removeAttribute(n));
166
+ de(e) || (t ? e.setAttribute(n, "") : e.removeAttribute(n));
167
167
  }
168
168
  function Re(e, n) {
169
- ce(e) || (n == null ? e.removeAttribute("class") : e.className = n);
169
+ de(e) || (n == null ? e.removeAttribute("class") : e.className = n);
170
170
  }
171
171
  function U(e, n, t, r) {
172
172
  if (r)
@@ -190,7 +190,7 @@ function Ct(e, n, t = {}) {
190
190
  return t;
191
191
  }
192
192
  function F(e, n, t) {
193
- if (!n) return t ? u(e, "style") : n;
193
+ if (!n) return t ? d(e, "style") : n;
194
194
  const r = e.style;
195
195
  if (typeof n == "string") return r.cssText = n;
196
196
  typeof t == "string" && (r.cssText = t = void 0), t || (t = {}), n || (n = {});
@@ -204,15 +204,15 @@ function F(e, n, t) {
204
204
  function $t(e, n = {}, t, r) {
205
205
  const a = {};
206
206
  return b(
207
- () => a.children = ae(e, n.children, a.children)
207
+ () => a.children = ie(e, n.children, a.children)
208
208
  ), b(() => typeof n.ref == "function" && V(n.ref, e)), b(() => Et(e, n, t, !0, a, !0)), a;
209
209
  }
210
210
  function V(e, n, t) {
211
211
  return Ye(() => e(n, t));
212
212
  }
213
213
  function v(e, n, t, r) {
214
- if (t !== void 0 && !r && (r = []), typeof n != "function") return ae(e, n, r, t);
215
- b((a) => ae(e, n(), a, t), r);
214
+ if (t !== void 0 && !r && (r = []), typeof n != "function") return ie(e, n, r, t);
215
+ b((a) => ie(e, n(), a, t), r);
216
216
  }
217
217
  function Et(e, n, t, r, a = {}, o = !1) {
218
218
  n || (n = {});
@@ -228,7 +228,7 @@ function Et(e, n, t, r, a = {}, o = !1) {
228
228
  a[i] = Ne(e, i, l, a[i], t, o, n);
229
229
  }
230
230
  }
231
- function ce(e) {
231
+ function de(e) {
232
232
  return !!L.context && !L.done && (!e || e.isConnected);
233
233
  }
234
234
  function Pt(e) {
@@ -240,36 +240,36 @@ function je(e, n, t) {
240
240
  e.classList.toggle(r[a], t);
241
241
  }
242
242
  function Ne(e, n, t, r, a, o, i) {
243
- let l, s, c, d, h;
243
+ let l, s, c, u, h;
244
244
  if (n === "style") return F(e, t, r);
245
245
  if (n === "classList") return Ct(e, t, r);
246
246
  if (t === r) return r;
247
247
  if (n === "ref")
248
248
  o || t(e);
249
249
  else if (n.slice(0, 3) === "on:") {
250
- const g = n.slice(3);
251
- r && e.removeEventListener(g, r, typeof r != "function" && r), t && e.addEventListener(g, t, typeof t != "function" && t);
250
+ const f = n.slice(3);
251
+ r && e.removeEventListener(f, r, typeof r != "function" && r), t && e.addEventListener(f, t, typeof t != "function" && t);
252
252
  } else if (n.slice(0, 10) === "oncapture:") {
253
- const g = n.slice(10);
254
- r && e.removeEventListener(g, r, !0), t && e.addEventListener(g, t, !0);
253
+ const f = n.slice(10);
254
+ r && e.removeEventListener(f, r, !0), t && e.addEventListener(f, t, !0);
255
255
  } else if (n.slice(0, 2) === "on") {
256
- const g = n.slice(2).toLowerCase(), m = pt.has(g);
256
+ const f = n.slice(2).toLowerCase(), m = yt.has(f);
257
257
  if (!m && r) {
258
- const y = Array.isArray(r) ? r[0] : r;
259
- e.removeEventListener(g, y);
258
+ const p = Array.isArray(r) ? r[0] : r;
259
+ e.removeEventListener(f, p);
260
260
  }
261
- (m || t) && (U(e, g, t, m), m && T([g]));
261
+ (m || t) && (U(e, f, t, m), m && T([f]));
262
262
  } else if (n.slice(0, 5) === "attr:")
263
- u(e, n.slice(5), t);
263
+ d(e, n.slice(5), t);
264
264
  else if (n.slice(0, 5) === "bool:")
265
265
  St(e, n.slice(5), t);
266
- else if ((h = n.slice(0, 5) === "prop:") || (c = vt.has(n)) || (d = yt(n, e.tagName)) || (s = mt.has(n)) || (l = e.nodeName.includes("-") || "is" in i)) {
266
+ else if ((h = n.slice(0, 5) === "prop:") || (c = vt.has(n)) || (u = pt(n, e.tagName)) || (s = mt.has(n)) || (l = e.nodeName.includes("-") || "is" in i)) {
267
267
  if (h)
268
268
  n = n.slice(5), s = !0;
269
- else if (ce(e)) return t;
270
- n === "class" || n === "className" ? Re(e, t) : l && !s && !c ? e[Pt(n)] = t : e[d || n] = t;
269
+ else if (de(e)) return t;
270
+ n === "class" || n === "className" ? Re(e, t) : l && !s && !c ? e[Pt(n)] = t : e[u || n] = t;
271
271
  } else
272
- u(e, bt[n] || n, t);
272
+ d(e, bt[n] || n, t);
273
273
  return t;
274
274
  }
275
275
  function zt(e) {
@@ -308,14 +308,14 @@ function zt(e) {
308
308
  } else l();
309
309
  o(r);
310
310
  }
311
- function ae(e, n, t, r, a) {
312
- const o = ce(e);
311
+ function ie(e, n, t, r, a) {
312
+ const o = de(e);
313
313
  if (o) {
314
314
  !t && (t = [...e.childNodes]);
315
315
  let s = [];
316
316
  for (let c = 0; c < t.length; c++) {
317
- const d = t[c];
318
- d.nodeType === 8 && d.data.slice(0, 2) === "!$" ? d.remove() : s.push(d);
317
+ const u = t[c];
318
+ u.nodeType === 8 && u.data.slice(0, 2) === "!$" ? u.remove() : s.push(u);
319
319
  }
320
320
  t = s;
321
321
  }
@@ -327,59 +327,59 @@ function ae(e, n, t, r, a) {
327
327
  return t;
328
328
  if (l) {
329
329
  let s = t[0];
330
- s && s.nodeType === 3 ? s.data !== n && (s.data = n) : s = document.createTextNode(n), t = X(e, t, r, s);
330
+ s && s.nodeType === 3 ? s.data !== n && (s.data = n) : s = document.createTextNode(n), t = G(e, t, r, s);
331
331
  } else
332
332
  t !== "" && typeof t == "string" ? t = e.firstChild.data = n : t = e.textContent = n;
333
333
  } else if (n == null || i === "boolean") {
334
334
  if (o) return t;
335
- t = X(e, t, r);
335
+ t = G(e, t, r);
336
336
  } else {
337
337
  if (i === "function")
338
338
  return b(() => {
339
339
  let s = n();
340
340
  for (; typeof s == "function"; ) s = s();
341
- t = ae(e, s, t, r);
341
+ t = ie(e, s, t, r);
342
342
  }), () => t;
343
343
  if (Array.isArray(n)) {
344
344
  const s = [], c = t && Array.isArray(t);
345
- if ($e(s, n, t, a))
346
- return b(() => t = ae(e, s, t, r, !0)), () => t;
345
+ if (Ee(s, n, t, a))
346
+ return b(() => t = ie(e, s, t, r, !0)), () => t;
347
347
  if (o) {
348
348
  if (!s.length) return t;
349
349
  if (r === void 0) return t = [...e.childNodes];
350
- let d = s[0];
351
- if (d.parentNode !== e) return t;
352
- const h = [d];
353
- for (; (d = d.nextSibling) !== r; ) h.push(d);
350
+ let u = s[0];
351
+ if (u.parentNode !== e) return t;
352
+ const h = [u];
353
+ for (; (u = u.nextSibling) !== r; ) h.push(u);
354
354
  return t = h;
355
355
  }
356
356
  if (s.length === 0) {
357
- if (t = X(e, t, r), l) return t;
358
- } else c ? t.length === 0 ? qe(e, s, r) : xt(e, t, s) : (t && X(e), qe(e, s));
357
+ if (t = G(e, t, r), l) return t;
358
+ } else c ? t.length === 0 ? qe(e, s, r) : xt(e, t, s) : (t && G(e), qe(e, s));
359
359
  t = s;
360
360
  } else if (n.nodeType) {
361
361
  if (o && n.parentNode) return t = l ? [n] : n;
362
362
  if (Array.isArray(t)) {
363
- if (l) return t = X(e, t, r, n);
364
- X(e, t, null, n);
363
+ if (l) return t = G(e, t, r, n);
364
+ G(e, t, null, n);
365
365
  } else t == null || t === "" || !e.firstChild ? e.appendChild(n) : e.replaceChild(n, e.firstChild);
366
366
  t = n;
367
367
  }
368
368
  }
369
369
  return t;
370
370
  }
371
- function $e(e, n, t, r) {
371
+ function Ee(e, n, t, r) {
372
372
  let a = !1;
373
373
  for (let o = 0, i = n.length; o < i; o++) {
374
374
  let l = n[o], s = t && t[e.length], c;
375
375
  if (!(l == null || l === !0 || l === !1)) if ((c = typeof l) == "object" && l.nodeType)
376
376
  e.push(l);
377
377
  else if (Array.isArray(l))
378
- a = $e(e, l, s) || a;
378
+ a = Ee(e, l, s) || a;
379
379
  else if (c === "function")
380
380
  if (r) {
381
381
  for (; typeof l == "function"; ) l = l();
382
- a = $e(
382
+ a = Ee(
383
383
  e,
384
384
  Array.isArray(l) ? l : [l],
385
385
  Array.isArray(s) ? s : [s]
@@ -387,8 +387,8 @@ function $e(e, n, t, r) {
387
387
  } else
388
388
  e.push(l), a = !0;
389
389
  else {
390
- const d = String(l);
391
- s && s.nodeType === 3 && s.data === d ? e.push(s) : e.push(document.createTextNode(d));
390
+ const u = String(l);
391
+ s && s.nodeType === 3 && s.data === u ? e.push(s) : e.push(document.createTextNode(u));
392
392
  }
393
393
  }
394
394
  return a;
@@ -396,7 +396,7 @@ function $e(e, n, t, r) {
396
396
  function qe(e, n, t = null) {
397
397
  for (let r = 0, a = n.length; r < a; r++) e.insertBefore(n[r], t);
398
398
  }
399
- function X(e, n, t, r) {
399
+ function G(e, n, t, r) {
400
400
  if (t === void 0) return e.textContent = "";
401
401
  const a = r || document.createTextNode("");
402
402
  if (n.length) {
@@ -418,13 +418,13 @@ function It(e, n = !1) {
418
418
  function Ot(e) {
419
419
  const { useShadow: n } = e, t = document.createTextNode(""), r = () => e.mount || document.body, a = De();
420
420
  let o, i = !!L.context;
421
- return Y(
421
+ return ee(
422
422
  () => {
423
423
  i && (De().user = i = !1), o || (o = lt(a, () => k(() => e.children)));
424
424
  const l = r();
425
425
  if (l instanceof HTMLHeadElement) {
426
- const [s, c] = A(!1), d = () => c(!0);
427
- Ue((h) => v(l, () => s() ? h() : o(), null)), ee(d);
426
+ const [s, c] = A(!1), u = () => c(!0);
427
+ Ue((h) => v(l, () => s() ? h() : o(), null)), te(u);
428
428
  } else {
429
429
  const s = It(e.isSVG ? "g" : "div", e.isSVG), c = n && s.attachShadow ? s.attachShadow({
430
430
  mode: "open"
@@ -434,7 +434,7 @@ function Ot(e) {
434
434
  return t.parentNode;
435
435
  },
436
436
  configurable: !0
437
- }), v(c, o), l.appendChild(s), e.ref && e.ref(s), ee(() => l.removeChild(s));
437
+ }), v(c, o), l.appendChild(s), e.ref && e.ref(s), te(() => l.removeChild(s));
438
438
  }
439
439
  },
440
440
  void 0,
@@ -485,26 +485,26 @@ const Mt = 5e3, At = (e) => {
485
485
  return (...r) => {
486
486
  clearTimeout(t), t = window.setTimeout(() => e(...r), n);
487
487
  };
488
- }, Ft = "echo_", K = "echo-pages", Ge = (e) => {
488
+ }, Ft = "echo_", R = "echo-pages", Ge = (e) => {
489
489
  if (!e || e === "/") return "/";
490
490
  const n = e.split("/");
491
491
  return n.length <= 4 ? e : `/${n[1]}/.../${n[n.length - 1]}`;
492
492
  }, Xe = () => {
493
493
  window.dispatchEvent(new Event("echo-storage-change"));
494
- }, Je = (e) => `${Ft}${e}`, G = (e, n) => {
494
+ }, Je = (e) => `${Ft}${e}`, K = (e, n) => {
495
495
  try {
496
496
  const t = localStorage.getItem(Je(e));
497
497
  return t ? JSON.parse(t) : n;
498
498
  } catch {
499
499
  return n;
500
500
  }
501
- }, ie = (e, n) => {
501
+ }, se = (e, n) => {
502
502
  try {
503
503
  localStorage.setItem(Je(e), JSON.stringify(n));
504
504
  } catch (t) {
505
505
  console.warn("Failed to save to localStorage:", t);
506
506
  }
507
- }, Ee = () => {
507
+ }, Pe = () => {
508
508
  const e = window.location.pathname || "/", n = window.location.search;
509
509
  return `${e}${n}`;
510
510
  }, Lt = (e, n) => {
@@ -513,41 +513,41 @@ const Mt = 5e3, At = (e) => {
513
513
  const t = {
514
514
  message: n.feedback.message,
515
515
  customInputValues: n.feedback.customInputValues
516
- }, r = G(K, {}), a = Ge(e);
516
+ }, r = K(R, {}), a = Ge(e);
517
517
  (t || n.drawing.shapes.length > 0) && (r[a] = {
518
518
  ...r[a] || {},
519
519
  ...t ? { feedback: t } : {},
520
520
  drawing: {
521
521
  shapes: n.drawing.shapes
522
522
  }
523
- }), ie(K, r), Xe();
523
+ }), se(R, r), Xe();
524
524
  } catch (t) {
525
525
  console.warn("Failed to save page state:", t);
526
526
  }
527
- }, ze = (e) => {
527
+ }, Te = (e) => {
528
528
  try {
529
- return G(K, {})[e];
529
+ return K(R, {})[e];
530
530
  } catch (n) {
531
531
  console.error("Failed to load page state:", n);
532
532
  return;
533
533
  }
534
534
  }, Ze = (e) => {
535
535
  try {
536
- const n = G(K, {});
537
- delete n[e], ie(K, n), Xe();
536
+ const n = K(R, {});
537
+ delete n[e], se(R, n), Xe();
538
538
  } catch (n) {
539
539
  console.error("Failed to clear page state:", n);
540
540
  }
541
541
  }, Qe = () => {
542
542
  try {
543
- const e = G(K, {});
543
+ const e = K(R, {});
544
544
  return Object.keys(e).length;
545
545
  } catch (e) {
546
546
  return console.error("Failed to get stored pages count:", e), 0;
547
547
  }
548
- }, xe = () => {
548
+ }, ke = () => {
549
549
  try {
550
- const e = G(K, {});
550
+ const e = K(R, {});
551
551
  return Object.entries(e).map(([n, t]) => ({
552
552
  path: Ge(n),
553
553
  state: t
@@ -557,10 +557,10 @@ const Mt = 5e3, At = (e) => {
557
557
  }
558
558
  }, jt = (e) => Dt((n, t, r = !1) => {
559
559
  (!r || t.feedback.message.trim().length > 0 || t.drawing.shapes.length > 0) && (Lt(n, t), e.setState({ pagesCount: Qe() }));
560
- }, 1e3), Pe = Symbol("store-raw"), J = Symbol("store-node"), j = Symbol("store-has"), et = Symbol("store-self");
560
+ }, 1e3), ze = Symbol("store-raw"), J = Symbol("store-node"), j = Symbol("store-has"), et = Symbol("store-self");
561
561
  function tt(e) {
562
- let n = e[R];
563
- if (!n && (Object.defineProperty(e, R, {
562
+ let n = e[Y];
563
+ if (!n && (Object.defineProperty(e, Y, {
564
564
  value: n = new Proxy(e, Vt)
565
565
  }), !Array.isArray(e))) {
566
566
  const t = Object.keys(e), r = Object.getOwnPropertyDescriptors(e);
@@ -576,21 +576,21 @@ function tt(e) {
576
576
  }
577
577
  function me(e) {
578
578
  let n;
579
- return e != null && typeof e == "object" && (e[R] || !(n = Object.getPrototypeOf(e)) || n === Object.prototype || Array.isArray(e));
579
+ return e != null && typeof e == "object" && (e[Y] || !(n = Object.getPrototypeOf(e)) || n === Object.prototype || Array.isArray(e));
580
580
  }
581
- function se(e, n = /* @__PURE__ */ new Set()) {
581
+ function le(e, n = /* @__PURE__ */ new Set()) {
582
582
  let t, r, a, o;
583
- if (t = e != null && e[Pe]) return t;
583
+ if (t = e != null && e[ze]) return t;
584
584
  if (!me(e) || n.has(e)) return e;
585
585
  if (Array.isArray(e)) {
586
586
  Object.isFrozen(e) ? e = e.slice(0) : n.add(e);
587
587
  for (let i = 0, l = e.length; i < l; i++)
588
- a = e[i], (r = se(a, n)) !== a && (e[i] = r);
588
+ a = e[i], (r = le(a, n)) !== a && (e[i] = r);
589
589
  } else {
590
590
  Object.isFrozen(e) ? e = Object.assign({}, e) : n.add(e);
591
591
  const i = Object.keys(e), l = Object.getOwnPropertyDescriptors(e);
592
592
  for (let s = 0, c = i.length; s < c; s++)
593
- o = i[s], !l[o].get && (a = e[o], (r = se(a, n)) !== a && (e[o] = r));
593
+ o = i[s], !l[o].get && (a = e[o], (r = le(a, n)) !== a && (e[o] = r));
594
594
  }
595
595
  return e;
596
596
  }
@@ -600,7 +600,7 @@ function ve(e, n) {
600
600
  value: t = /* @__PURE__ */ Object.create(null)
601
601
  }), t;
602
602
  }
603
- function le(e, n, t) {
603
+ function ce(e, n, t) {
604
604
  if (e[n]) return e[n];
605
605
  const [r, a] = A(t, {
606
606
  equals: !1,
@@ -610,18 +610,18 @@ function le(e, n, t) {
610
610
  }
611
611
  function Nt(e, n) {
612
612
  const t = Reflect.getOwnPropertyDescriptor(e, n);
613
- return !t || t.get || !t.configurable || n === R || n === J || (delete t.value, delete t.writable, t.get = () => e[R][n]), t;
613
+ return !t || t.get || !t.configurable || n === Y || n === J || (delete t.value, delete t.writable, t.get = () => e[Y][n]), t;
614
614
  }
615
615
  function nt(e) {
616
- Ce() && le(ve(e, J), et)();
616
+ $e() && ce(ve(e, J), et)();
617
617
  }
618
618
  function qt(e) {
619
619
  return nt(e), Reflect.ownKeys(e);
620
620
  }
621
621
  const Vt = {
622
622
  get(e, n, t) {
623
- if (n === Pe) return e;
624
- if (n === R) return t;
623
+ if (n === ze) return e;
624
+ if (n === Y) return t;
625
625
  if (n === Fe)
626
626
  return nt(e), t;
627
627
  const r = ve(e, J), a = r[n];
@@ -629,12 +629,12 @@ const Vt = {
629
629
  if (n === J || n === j || n === "__proto__") return o;
630
630
  if (!a) {
631
631
  const i = Object.getOwnPropertyDescriptor(e, n);
632
- Ce() && (typeof o != "function" || e.hasOwnProperty(n)) && !(i && i.get) && (o = le(r, n, o)());
632
+ $e() && (typeof o != "function" || e.hasOwnProperty(n)) && !(i && i.get) && (o = ce(r, n, o)());
633
633
  }
634
634
  return me(o) ? tt(o) : o;
635
635
  },
636
636
  has(e, n) {
637
- return n === Pe || n === R || n === Fe || n === J || n === j || n === "__proto__" ? !0 : (Ce() && le(ve(e, j), n)(), n in e);
637
+ return n === ze || n === Y || n === Fe || n === J || n === j || n === "__proto__" ? !0 : ($e() && ce(ve(e, j), n)(), n in e);
638
638
  },
639
639
  set() {
640
640
  return !0;
@@ -650,9 +650,9 @@ function be(e, n, t, r = !1) {
650
650
  const a = e[n], o = e.length;
651
651
  t === void 0 ? (delete e[n], e[j] && e[j][n] && a !== void 0 && e[j][n].$()) : (e[n] = t, e[j] && e[j][n] && a === void 0 && e[j][n].$());
652
652
  let i = ve(e, J), l;
653
- if ((l = le(i, n, a)) && l.$(() => t), Array.isArray(e) && e.length !== o) {
653
+ if ((l = ce(i, n, a)) && l.$(() => t), Array.isArray(e) && e.length !== o) {
654
654
  for (let s = e.length; s < o; s++) (l = i[s]) && l.$();
655
- (l = le(i, "length", o)) && l.$(e.length);
655
+ (l = ce(i, "length", o)) && l.$(e.length);
656
656
  }
657
657
  (l = i[et]) && l.$();
658
658
  }
@@ -664,7 +664,7 @@ function rt(e, n) {
664
664
  }
665
665
  }
666
666
  function Bt(e, n) {
667
- if (typeof n == "function" && (n = n(e)), n = se(n), Array.isArray(n)) {
667
+ if (typeof n == "function" && (n = n(e)), n = le(n), Array.isArray(n)) {
668
668
  if (e === n) return;
669
669
  let t = 0, r = n.length;
670
670
  for (; t < r; t++) {
@@ -674,38 +674,38 @@ function Bt(e, n) {
674
674
  be(e, "length", r);
675
675
  } else rt(e, n);
676
676
  }
677
- function re(e, n, t = []) {
677
+ function oe(e, n, t = []) {
678
678
  let r, a = e;
679
679
  if (n.length > 1) {
680
680
  r = n.shift();
681
681
  const i = typeof r, l = Array.isArray(e);
682
682
  if (Array.isArray(r)) {
683
683
  for (let s = 0; s < r.length; s++)
684
- re(e, [r[s]].concat(n), t);
684
+ oe(e, [r[s]].concat(n), t);
685
685
  return;
686
686
  } else if (l && i === "function") {
687
687
  for (let s = 0; s < e.length; s++)
688
- r(e[s], s) && re(e, [s].concat(n), t);
688
+ r(e[s], s) && oe(e, [s].concat(n), t);
689
689
  return;
690
690
  } else if (l && i === "object") {
691
- const { from: s = 0, to: c = e.length - 1, by: d = 1 } = r;
692
- for (let h = s; h <= c; h += d)
693
- re(e, [h].concat(n), t);
691
+ const { from: s = 0, to: c = e.length - 1, by: u = 1 } = r;
692
+ for (let h = s; h <= c; h += u)
693
+ oe(e, [h].concat(n), t);
694
694
  return;
695
695
  } else if (n.length > 1) {
696
- re(e[r], n, [r].concat(t));
696
+ oe(e[r], n, [r].concat(t));
697
697
  return;
698
698
  }
699
699
  a = e[r], t = [r].concat(t);
700
700
  }
701
701
  let o = n[0];
702
- typeof o == "function" && (o = o(a, t), o === a) || r === void 0 && o == null || (o = se(o), r === void 0 || me(a) && me(o) && !Array.isArray(o) ? rt(a, o) : be(e, r, o));
702
+ typeof o == "function" && (o = o(a, t), o === a) || r === void 0 && o == null || (o = le(o), r === void 0 || me(a) && me(o) && !Array.isArray(o) ? rt(a, o) : be(e, r, o));
703
703
  }
704
- function Te(...[e, n]) {
705
- const t = se(e || {}), r = Array.isArray(t), a = tt(t);
704
+ function Ie(...[e, n]) {
705
+ const t = le(e || {}), r = Array.isArray(t), a = tt(t);
706
706
  function o(...i) {
707
707
  ct(() => {
708
- r && i.length === 1 ? Bt(t, i[0]) : re(t, i);
708
+ r && i.length === 1 ? Bt(t, i[0]) : oe(t, i);
709
709
  });
710
710
  }
711
711
  return [a, o];
@@ -731,12 +731,12 @@ const B = {
731
731
  default: 1
732
732
  }
733
733
  }
734
- }, Wt = (e) => {
734
+ }, _t = (e) => {
735
735
  const n = e.replace("#", ""), t = Number.parseInt(n.slice(0, 2), 16) / 255, r = Number.parseInt(n.slice(2, 2), 16) / 255, a = Number.parseInt(n.slice(4, 2), 16) / 255;
736
736
  return 0.2126 * t + 0.7152 * r + 0.0722 * a;
737
- }, _t = (e) => Wt(e) < 0.5 ? "#FFFFFF" : "#000000";
737
+ }, Wt = (e) => _t(e) < 0.5 ? "#FFFFFF" : "#000000";
738
738
  let N = [], O = null, Z = null, Q = null;
739
- const ke = (e, n) => (...t) => {
739
+ const Se = (e, n) => (...t) => {
740
740
  const r = (o) => {
741
741
  if (typeof o == "string") return o;
742
742
  if (o instanceof Error) return o.stack || o.message;
@@ -779,7 +779,7 @@ Location: ${n}:${t}:${r}`,
779
779
  message: `Unhandled Promise Rejection: ${(n == null ? void 0 : n.stack) || (n == null ? void 0 : n.message) || n}`,
780
780
  timestamp: (/* @__PURE__ */ new Date()).toISOString()
781
781
  }), Q && Q(e);
782
- }, console.log = ke("log", O.log), console.warn = ke("warn", O.warn), console.error = ke("error", O.error), window.addEventListener("error", (e) => {
782
+ }, console.log = Se("log", O.log), console.warn = Se("warn", O.warn), console.error = Se("error", O.error), window.addEventListener("error", (e) => {
783
783
  const { message: n, filename: t, lineno: r, colno: a, error: o } = e, i = (o == null ? void 0 : o.stack) || (o == null ? void 0 : o.message) || n;
784
784
  N.push({
785
785
  type: "error",
@@ -794,7 +794,7 @@ Location: ${t}:${r}:${a}`,
794
794
  }, Yt = () => [...N], Rt = () => {
795
795
  var e;
796
796
  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || ((e = window.matchMedia) == null ? void 0 : e.call(window, "(max-width: 768px)").matches);
797
- }, he = (e, { useClientCoords: n = !1 } = {}) => {
797
+ }, ge = (e, { useClientCoords: n = !1 } = {}) => {
798
798
  const r = typeof TouchEvent < "u" && e instanceof TouchEvent ? e.touches[0] : null;
799
799
  return {
800
800
  x: r ? n ? r.clientX : r.pageX : n ? e.clientX : e.pageX,
@@ -812,41 +812,41 @@ Location: ${t}:${r}:${a}`,
812
812
  width: Math.abs(t.x - n.x),
813
813
  height: Math.abs(t.y - n.y)
814
814
  };
815
- }, Kt = (e) => e.length < 2 ? null : `M ${e[0].x} ${e[0].y} ${e.slice(1).map((n) => `L ${n.x} ${n.y}`).join(" ")}`, Ie = window.EventTarget.prototype.addEventListener, oe = window.EventTarget.prototype.removeEventListener;
816
- let we = !1;
817
- const Gt = (e, n, t, r) => {
818
- Ie.call(e, n, t, r);
815
+ }, Kt = (e) => e.length < 2 ? null : `M ${e[0].x} ${e[0].y} ${e.slice(1).map((n) => `L ${n.x} ${n.y}`).join(" ")}`, we = window.EventTarget.prototype.addEventListener, X = window.EventTarget.prototype.removeEventListener;
816
+ let pe = !1;
817
+ const re = /* @__PURE__ */ new WeakMap(), Gt = (e, n, t, r) => {
818
+ we.call(e, n, t, r);
819
819
  }, Xt = (e, n, t, r) => {
820
- oe.call(e, n, t, r);
821
- }, ne = /* @__PURE__ */ new WeakMap(), Jt = (e) => {
822
- we || (we = !0, window.EventTarget.prototype.addEventListener = function(n, t, r) {
820
+ X.call(e, n, t, r);
821
+ }, Jt = (e) => {
822
+ pe || (pe = !0, window.EventTarget.prototype.addEventListener = function(n, t, r) {
823
+ if (!t)
824
+ return we.call(this, n, t, r);
823
825
  const a = Qt(t, e);
824
- ne.has(this) || ne.set(this, /* @__PURE__ */ new Map());
825
- const o = { listener: t }, i = ne.get(this);
826
- i && i.set(t, o), Ie.call(this, n, a, r);
826
+ re.has(this) || re.set(this, /* @__PURE__ */ new Map()), re.get(this).set(t, a), we.call(this, n, a, r);
827
827
  }, window.EventTarget.prototype.removeEventListener = function(n, t, r) {
828
- const a = ne.get(this);
829
- if (!a) {
830
- oe.call(this, n, t, r);
831
- return;
832
- }
828
+ if (!t || typeof this != "object")
829
+ return X.call(this, n, t, r);
830
+ const a = re.get(this);
831
+ if (!a)
832
+ return X.call(this, n, t, r);
833
833
  const o = a.get(t);
834
- o ? (oe.call(this, n, o.listener, r), a.delete(t), a.size === 0 && ne.delete(this)) : oe.call(this, n, t, r);
834
+ o ? (X.call(this, n, o, r), a.delete(t), a.size === 0 && re.delete(this)) : X.call(this, n, t, r);
835
835
  });
836
836
  }, Zt = () => {
837
- we && (window.EventTarget.prototype.addEventListener = Ie, window.EventTarget.prototype.removeEventListener = oe, we = !1);
837
+ pe && (window.EventTarget.prototype.addEventListener = we, window.EventTarget.prototype.removeEventListener = X, pe = !1);
838
838
  }, M = (e) => {
839
839
  const { event: n, callback: t, onMount: r, onCleanup: a, useOriginal: o = !0 } = e;
840
840
  ye(() => {
841
841
  r == null || r(), o ? Gt(window, n, t) : window.addEventListener(n, t);
842
- }), ee(() => {
842
+ }), te(() => {
843
843
  a == null || a(), o ? Xt(window, n, t) : window.removeEventListener(n, t);
844
844
  });
845
845
  }, Oe = (e) => {
846
846
  const { target: n, options: t, callback: r, onMount: a, onCleanup: o } = e, i = new MutationObserver(r);
847
847
  ye(() => {
848
848
  a == null || a(), i.observe(n, t);
849
- }), ee(() => {
849
+ }), te(() => {
850
850
  o == null || o(), i.disconnect();
851
851
  });
852
852
  }, Qt = (e, n) => function(t) {
@@ -856,7 +856,7 @@ const Gt = (e, n, t, r) => {
856
856
  try {
857
857
  const n = document.createElement("style");
858
858
  document.head.appendChild(n), (e = n.sheet) == null || e.insertRule("body > div:last-child img { display: inline-block; }");
859
- const t = await ft(document.body, {
859
+ const t = await gt(document.body, {
860
860
  logging: !1,
861
861
  useCORS: !0,
862
862
  scale: window.devicePixelRatio,
@@ -887,9 +887,9 @@ const Gt = (e, n, t, r) => {
887
887
  throw new Error("Echo initialization failed: onSubmit must be a function");
888
888
  if (e.primaryColor && !/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/.test(e.primaryColor))
889
889
  throw new Error("Echo initialization failed: primaryColor must be a valid hex color");
890
- }, Be = 5, We = (e, n) => B[e].getCursor(n), on = (e, n, t) => {
890
+ }, Be = 5, _e = (e, n) => B[e].getCursor(n), on = (e, n, t) => {
891
891
  var l, s;
892
- const [r, a] = Te({
892
+ const [r, a] = Ie({
893
893
  isDrawing: !1,
894
894
  currentPoints: [],
895
895
  selectedShapeId: null,
@@ -897,19 +897,19 @@ const Gt = (e, n, t, r) => {
897
897
  showTooltip: !0,
898
898
  mousePosition: { x: 0, y: 0 },
899
899
  selectedColor: e.primaryColor,
900
- shapes: ((s = (l = ze(n)) == null ? void 0 : l.drawing) == null ? void 0 : s.shapes) || [],
900
+ shapes: ((s = (l = Te(n)) == null ? void 0 : l.drawing) == null ? void 0 : s.shapes) || [],
901
901
  hasDrawn: !1,
902
902
  isDragging: !1,
903
903
  dragStartPos: null,
904
904
  initialClickPos: null,
905
905
  dragOffset: null,
906
- cursor: We("rectangle", e.primaryColor)
907
- }), o = (c, d = !1) => {
906
+ cursor: _e("rectangle", e.primaryColor)
907
+ }), o = (c, u = !1) => {
908
908
  if (c.selectedTool || c.selectedColor) {
909
- const h = c.selectedTool || r.selectedTool, g = c.selectedColor || r.selectedColor;
910
- c.cursor = We(h, g);
909
+ const h = c.selectedTool || r.selectedTool, f = c.selectedColor || r.selectedColor;
910
+ c.cursor = _e(h, f);
911
911
  }
912
- a(c), t == null || t(c, d);
912
+ a(c), t == null || t(c, u);
913
913
  }, i = {
914
914
  startDrawing: (c) => {
915
915
  o({
@@ -943,27 +943,27 @@ const Gt = (e, n, t, r) => {
943
943
  if (!h.classList.contains("echo-drawing-layer-mask") && !h.classList.contains("echo-shape"))
944
944
  return;
945
945
  }
946
- const d = he(c);
946
+ const u = ge(c);
947
947
  if (c.target instanceof SVGElement && c.target.classList.contains("echo-shape")) {
948
948
  const h = c.target.dataset.shapeId;
949
949
  if (h && r.selectedShapeId === h) {
950
- const g = r.shapes.find((m) => m.id === h);
951
- if (g) {
952
- i.startDrag(d), i.updateDragOffset(g, d);
950
+ const f = r.shapes.find((m) => m.id === h);
951
+ if (f) {
952
+ i.startDrag(u), i.updateDragOffset(f, u);
953
953
  return;
954
954
  }
955
955
  }
956
956
  }
957
- i.setInitialClick(d);
957
+ i.setInitialClick(u);
958
958
  },
959
959
  handleMove: (c) => {
960
- const d = he(c, { useClientCoords: !0 }), h = he(c);
961
- if (o({ mousePosition: d }), r.isDragging && r.selectedShapeId && r.dragStartPos && r.shapes.find((m) => m.id === r.selectedShapeId)) {
962
- const m = h.x - r.dragStartPos.x, y = h.y - r.dragStartPos.y, E = r.shapes.map((S) => S.id === r.selectedShapeId ? {
960
+ const u = ge(c, { useClientCoords: !0 }), h = ge(c);
961
+ if (o({ mousePosition: u }), r.isDragging && r.selectedShapeId && r.dragStartPos && r.shapes.find((m) => m.id === r.selectedShapeId)) {
962
+ const m = h.x - r.dragStartPos.x, p = h.y - r.dragStartPos.y, E = r.shapes.map((S) => S.id === r.selectedShapeId ? {
963
963
  ...S,
964
964
  points: S.points.map((C) => ({
965
965
  x: C.x + m,
966
- y: C.y + y
966
+ y: C.y + p
967
967
  }))
968
968
  } : S);
969
969
  o({ shapes: E }), i.startDrag(h);
@@ -981,10 +981,10 @@ const Gt = (e, n, t, r) => {
981
981
  return;
982
982
  }
983
983
  if (r.initialClickPos && !r.isDrawing) {
984
- const d = he(c);
985
- if (Ve(r.initialClickPos, d) < Be && c.target instanceof SVGElement && c.target.classList.contains("echo-shape")) {
986
- const g = c.target.dataset.shapeId;
987
- g && o({ selectedShapeId: g });
984
+ const u = ge(c);
985
+ if (Ve(r.initialClickPos, u) < Be && c.target instanceof SVGElement && c.target.classList.contains("echo-shape")) {
986
+ const f = c.target.dataset.shapeId;
987
+ f && o({ selectedShapeId: f });
988
988
  }
989
989
  }
990
990
  i.setInitialClick(null), i.finishDrawing();
@@ -1013,11 +1013,11 @@ const Gt = (e, n, t, r) => {
1013
1013
  initialClickPos: c
1014
1014
  });
1015
1015
  },
1016
- updateDragOffset: (c, d) => {
1016
+ updateDragOffset: (c, u) => {
1017
1017
  o({
1018
1018
  dragOffset: {
1019
- x: d.x - c.points[0].x,
1020
- y: d.y - c.points[0].y
1019
+ x: u.x - c.points[0].x,
1020
+ y: u.y - c.points[0].y
1021
1021
  }
1022
1022
  });
1023
1023
  }
@@ -1030,12 +1030,12 @@ const Gt = (e, n, t, r) => {
1030
1030
  }, an = (e, n, t, r) => {
1031
1031
  var h;
1032
1032
  const a = (r == null ? void 0 : r.reduce(
1033
- (g, m) => (g[m.id] = m.defaultValue ?? (m.type === "checkbox" ? [] : ""), g),
1033
+ (f, m) => (f[m.id] = m.defaultValue ?? (m.type === "checkbox" ? [] : ""), f),
1034
1034
  {}
1035
- )) || {}, o = ze(n), i = (o == null ? void 0 : o.feedback.customInputValues) || {}, l = {
1035
+ )) || {}, o = Te(n), i = (o == null ? void 0 : o.feedback.customInputValues) || {}, l = {
1036
1036
  ...a,
1037
1037
  ...i
1038
- }, [s, c] = Te({
1038
+ }, [s, c] = Ie({
1039
1039
  message: ((h = o == null ? void 0 : o.feedback) == null ? void 0 : h.message) || "",
1040
1040
  screenshot: void 0,
1041
1041
  isCapturing: !1,
@@ -1045,13 +1045,13 @@ const Gt = (e, n, t, r) => {
1045
1045
  });
1046
1046
  return {
1047
1047
  state: s,
1048
- setState: (g, m = !1) => {
1049
- const y = "isCapturing" in g || "isMinimized" in g || m;
1050
- !y && !s.hasUserInteracted && c({ hasUserInteracted: !0 }), c(g), (s.hasUserInteracted || y) && (t == null || t(g, m));
1048
+ setState: (f, m = !1) => {
1049
+ const p = "isCapturing" in f || "isMinimized" in f || m;
1050
+ !p && !s.hasUserInteracted && c({ hasUserInteracted: !0 }), c(f), (s.hasUserInteracted || p) && (t == null || t(f, m));
1051
1051
  }
1052
1052
  };
1053
1053
  }, sn = (e, n) => {
1054
- const [t, r] = Te({
1054
+ const [t, r] = Ie({
1055
1055
  text: e.textConfig,
1056
1056
  isOpen: !1,
1057
1057
  primaryColor: e.primaryColor,
@@ -1074,49 +1074,49 @@ const Gt = (e, n, t, r) => {
1074
1074
  state: t,
1075
1075
  setState: r
1076
1076
  };
1077
- }, _e = (e) => {
1077
+ }, We = (e) => {
1078
1078
  var n;
1079
1079
  return ((n = e.customInputs) == null ? void 0 : n.reduce(
1080
1080
  (t, r) => (t[r.id] = r.defaultValue ?? (r.type === "checkbox" ? [] : ""), t),
1081
1081
  {}
1082
1082
  )) || {};
1083
1083
  }, ln = (e) => {
1084
- let n = Ee();
1084
+ let n = Pe();
1085
1085
  const t = sn(e), r = jt(t), a = At(t), o = an(
1086
1086
  e,
1087
1087
  n,
1088
- (c, d) => {
1088
+ (c, u) => {
1089
1089
  r(
1090
1090
  n,
1091
1091
  {
1092
1092
  feedback: { ...o.state, ...c },
1093
1093
  drawing: i.state
1094
1094
  },
1095
- d
1095
+ u
1096
1096
  );
1097
1097
  },
1098
1098
  e.customInputs
1099
- ), i = on(e, n, (c, d) => {
1099
+ ), i = on(e, n, (c, u) => {
1100
1100
  r(
1101
1101
  n,
1102
1102
  {
1103
1103
  feedback: o.state,
1104
1104
  drawing: { ...i.state, ...c }
1105
1105
  },
1106
- d
1106
+ u
1107
1107
  );
1108
1108
  }), l = (c) => {
1109
1109
  n = c;
1110
- const d = ze(n), h = {
1111
- ..._e(e),
1112
- ...d == null ? void 0 : d.feedback.customInputValues
1110
+ const u = Te(n), h = {
1111
+ ...We(e),
1112
+ ...u == null ? void 0 : u.feedback.customInputValues
1113
1113
  };
1114
1114
  o.setState({
1115
- message: (d == null ? void 0 : d.feedback.message) || "",
1115
+ message: (u == null ? void 0 : u.feedback.message) || "",
1116
1116
  customInputValues: h,
1117
1117
  hasUserInteracted: !1
1118
1118
  }), i.setState({
1119
- shapes: (d == null ? void 0 : d.drawing.shapes) || []
1119
+ shapes: (u == null ? void 0 : u.drawing.shapes) || []
1120
1120
  });
1121
1121
  }, s = () => {
1122
1122
  Ze(n);
@@ -1127,7 +1127,7 @@ const Gt = (e, n, t, r) => {
1127
1127
  isCapturing: !1,
1128
1128
  isMinimized: !1,
1129
1129
  hasUserInteracted: !1,
1130
- customInputValues: _e(e)
1130
+ customInputValues: We(e)
1131
1131
  },
1132
1132
  drawing: {
1133
1133
  isDrawing: !1,
@@ -1161,8 +1161,8 @@ const Gt = (e, n, t, r) => {
1161
1161
  submit: async (c) => {
1162
1162
  t.setState({ isOpen: !1 });
1163
1163
  try {
1164
- const d = await e.onSubmit(c);
1165
- return d instanceof Response && !d.ok ? (a.show({ type: "error", message: "Submission failed" }), d) : (s(), a.show({ type: "success", message: "Feedback submitted" }), d);
1164
+ const u = await e.onSubmit(c);
1165
+ return u instanceof Response && !u.ok ? (a.show({ type: "error", message: "Submission failed" }), u) : (s(), a.show({ type: "success", message: "Feedback submitted" }), u);
1166
1166
  } catch {
1167
1167
  a.show({ type: "error", message: "Submission failed" });
1168
1168
  }
@@ -1177,7 +1177,7 @@ const Gt = (e, n, t, r) => {
1177
1177
  position: e.position,
1178
1178
  customInputs: e.customInputs
1179
1179
  });
1180
- return f(at.Provider, {
1180
+ return g(at.Provider, {
1181
1181
  value: n,
1182
1182
  get children() {
1183
1183
  return e.children;
@@ -1215,9 +1215,9 @@ const Gt = (e, n, t, r) => {
1215
1215
  callback: r
1216
1216
  }), n;
1217
1217
  }, un = ({ onUrlChange: e }) => {
1218
- let n = Ee();
1218
+ let n = Pe();
1219
1219
  const t = () => {
1220
- const r = Ee();
1220
+ const r = Pe();
1221
1221
  r !== n && (n = r, e(r));
1222
1222
  };
1223
1223
  M({ event: "popstate", callback: t }), M({ event: "pushstate", callback: t }), M({ event: "replacestate", callback: t }), Oe({
@@ -1228,8 +1228,8 @@ const Gt = (e, n, t, r) => {
1228
1228
  },
1229
1229
  callback: t
1230
1230
  });
1231
- }, hn = `*,*:before,*:after{box-sizing:border-box}.echo-root{position:absolute;top:0;left:0;z-index:var(--z-root);isolation:isolate;pointer-events:none;--z-root: 999999;--z-launcher: 2;--z-overlay: 1;--z-drawing-toolbar: 3;--z-drawing-tooltip: 3;--z-shape-actions: 3;--z-notification: 2;--z-welcome-message: 2;--z-widget-button: 2;--z-feedback-form: 4;--primary-color: #000;--primary-text-color: #fff;--error-color: #f44336;--success-color: var(--primary-color);--text-dark: #1a1a1a;--text-medium: #333;--text-light: #666;--text-lighter: #999;--border-color: rgba(0, 0, 0, .1);--border-color-light: rgba(0, 0, 0, .05);--border-color-medium: rgba(0, 0, 0, .08);--primary-color-lighter: color-mix(in srgb, var(--primary-color) 100%, white 40%);--primary-color-lightest: color-mix(in srgb, var(--primary-color) 7%, white 100%);--hover-color: color-mix(in srgb, var(--primary-color) 80%, #fff);--shadow-color-dark: rgba(0, 0, 0, .6);--shadow-color-light: rgba(255, 255, 255, .1);--shadow-color-medium: rgba(0, 0, 0, .2);--shadow-sm: 0 1px 3px;--shadow-md: 0 4px 10px;--shadow-lg: 0 10px 20px;--shadow-black-sm: var(--shadow-sm) rgba(0, 0, 0, .5);--shadow-black-md: var(--shadow-md) rgba(0, 0, 0, .5);--shadow-black-lg: var(--shadow-lg) rgba(0, 0, 0, .5);--shadow-black-lightened-sm: var(--shadow-sm) var(--shadow-color-medium);--shadow-black-lightened-md: var(--shadow-md) var(--shadow-color-medium);--shadow-black-lightened-lg: var(--shadow-lg) var(--shadow-color-medium);--shadow-primary-sm: var(--shadow-sm) color-mix(in srgb, var(--primary-color) 60%, transparent 80%);--shadow-primary-md: var(--shadow-md) color-mix(in srgb, var(--primary-color) 50%, transparent 80%);--shadow-primary-lg: var(--shadow-lg) color-mix(in srgb, var(--primary-color) 40%, transparent 80%);--shadow-primary-lighter-sm: var(--shadow-sm) color-mix(in srgb, var(--primary-color-lighter) 70%, transparent 80%);--shadow-primary-lighter-md: var(--shadow-md) color-mix(in srgb, var(--primary-color-lighter) 60%, transparent 80%);--shadow-primary-lighter-lg: var(--shadow-lg) color-mix(in srgb, var(--primary-color-lighter) 50%, transparent 80%);--shadow-primary-lightest-sm: var(--shadow-sm) color-mix(in srgb, var(--primary-color-lightest) 70%, transparent 80%);--shadow-primary-lightest-md: var(--shadow-md) color-mix(in srgb, var(--primary-color-lightest) 60%, transparent 80%);--shadow-primary-lightest-lg: var(--shadow-lg) color-mix(in srgb, var(--primary-color-lightest) 50%, transparent 80%);--shadow-combined-sm: var(--shadow-primary-sm), var(--shadow-black-lightened-sm);--shadow-combined-md: var(--shadow-primary-md), var(--shadow-black-lightened-md);--shadow-combined-lg: var(--shadow-primary-lg), var(--shadow-black-lightened-lg);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 20px;--spacing-2xl: 24px;--spacing-3xl: 32px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--font-xs: .8125rem;--font-sm: .875rem;--font-base: .9375rem;--font-md: 1rem;--font-lg: 1.125rem;--duration-fast: .1s;--duration-base: .2s;--duration-slow: .3s;--duration-slower: .4s;--duration-slowest: .6s;--ease-default: ease;--ease-in-out: ease-in-out;--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--ease-spring: cubic-bezier(.16, 1, .3, 1)}.echo-stored-feedback{position:absolute;display:flex;flex-direction:column;bottom:calc(100% + var(--spacing-lg));right:0;width:320px;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-black-lightened-lg);animation:slideUpFade var(--duration-base) var(--ease-smooth);z-index:calc(var(--z-widget-button) + 1);transform-origin:bottom right;transition:all var(--duration-base) var(--ease-smooth)}.echo-stored-feedback-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-lg)}.echo-stored-feedback-header h3{margin:0;font-size:var(--font-md);font-weight:600}.echo-stored-feedback-list{max-height:400px;overflow-y:auto;border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.echo-stored-feedback-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--border-color-light);transition:all var(--duration-base) var(--ease-smooth);background:#fff;position:relative}.echo-stored-feedback-item:hover{background:var(--primary-color-lightest)}.echo-stored-feedback-item-current{background:var(--primary-color-lightest);padding-left:calc(var(--spacing-lg) - 3px)}.echo-stored-feedback-item-current:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--primary-color);border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg)}.echo-stored-feedback-item:last-child{border-bottom:none;border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.echo-stored-feedback-item:last-child.echo-stored-feedback-item-current:before{border-bottom-left-radius:var(--radius-lg)}.echo-stored-feedback-content{flex:1;min-width:0;margin-right:var(--spacing-md)}.echo-stored-feedback-path{font-size:var(--font-sm);font-weight:500;color:var(--text-medium);margin-bottom:var(--spacing-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.echo-stored-feedback-preview{font-size:var(--font-xs);color:var(--text-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.echo-stored-feedback-actions{display:flex;align-items:center;gap:var(--spacing-sm)}.echo-stored-feedback-link{color:var(--text-light)}.echo-stored-feedback-link:hover{color:var(--primary-color)}.echo-stored-feedback-delete{color:var(--text-light);font-size:var(--font-xs);padding:var(--spacing-xs) var(--spacing-md)}.echo-stored-feedback-delete:hover{color:var(--error-color);background:color-mix(in srgb,var(--error-color) 10%,transparent)}.echo-stored-feedback-empty{padding:var(--spacing-3xl) var(--spacing-lg);text-align:center;color:var(--text-light);font-size:var(--font-sm);border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.echo-launcher{position:fixed;z-index:var(--z-launcher);bottom:var(--spacing-xl);right:var(--spacing-xl);pointer-events:none}.echo-overlay{position:absolute;top:0;left:0;margin:0;padding:0;max-width:none;max-height:none;border:3px solid var(--primary-color);background:transparent}.echo-overlay::backdrop{background:transparent}[data-hidden=true],[data-hidden=false]{transition:opacity var(--duration-slow) var(--ease-in-out),visibility var(--duration-slow) var(--ease-in-out)}[data-hidden=true]{opacity:0;visibility:hidden;pointer-events:none}[data-hidden=false]{opacity:1;visibility:visible;pointer-events:auto;user-select:none;-webkit-user-select:none}.echo-launcher-button{z-index:var(--z-widget-button);position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;background:radial-gradient(circle at 40% 40%,var(--primary-color) 0%,var(--primary-color-lighter) 65%,var(--primary-color-lighter) 100%);border:none;border-radius:var(--radius-full);width:48px;height:48px;box-shadow:var(--shadow-black-md);transition:all var(--duration-slow) var(--ease-default),transform var(--duration-slower) var(--ease-smooth),opacity var(--duration-slow) var(--ease-in-out);will-change:transform}.echo-launcher-button:hover{box-shadow:var(--shadow-black-lg);transform:translateY(-2px)}.echo-launcher-button:active{transform:scale(.95)}.echo-launcher-button-count{position:absolute;top:calc(-1 * var(--spacing-xs));right:calc(-1 * var(--spacing-xs));background:var(--primary-color-lightest);color:var(--primary-color-lighter);border-radius:var(--radius-md);min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-black-sm);padding:0 var(--spacing-xs);font-weight:600;pointer-events:auto;cursor:pointer;transform-origin:center center;animation:popIn var(--duration-slow) var(--ease-bounce);transition:transform var(--duration-base) var(--ease-default)}.echo-launcher-button-count:hover{transform:scale(1.1)}.echo-feedback{position:fixed;bottom:var(--spacing-xl);right:var(--spacing-xl);width:min(calc(100vw - var(--spacing-2xl)),24rem);z-index:var(--z-feedback-form);box-shadow:var(--shadow-black-lightened-lg);display:flex;flex-direction:column;gap:var(--spacing-lg);background:#fff;border-radius:var(--radius-lg);will-change:transform;padding:var(--spacing-lg)}.echo-feedback[data-minimized=true]{transition:transform .4s var(--ease-default),box-shadow .4s var(--ease-default);transform:translate(calc(100% - 48px),calc(100% - 48px));box-shadow:0 8px 16px #0003}.echo-feedback[data-minimized=true]:hover{cursor:pointer;transform:translate(calc(100% - 48px),calc(100% - 48px)) rotate(-2deg) scale(1.1);box-shadow:0 12px 24px #00000040}.echo-feedback[data-minimized=false]{transition:transform .4s var(--ease-smooth),box-shadow .4s var(--ease-smooth);transform:translate(0)}.echo-feedback[style*=transition]{pointer-events:none}.echo-feedback-content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.echo-feedback-header{display:flex;justify-content:space-between;align-items:center}.echo-feedback-title{font-size:var(--font-lg);font-weight:600;color:var(--text-dark);margin:0}.echo-feedback-header-actions{display:flex;gap:var(--spacing-xs);margin:calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) 0}.echo-feedback-form-textarea{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;color:var(--text-medium);font-size:var(--font-sm);transition:all var(--duration-base) var(--ease-default);min-height:120px;resize:vertical;font-family:inherit}.echo-feedback-form-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-feedback-form-textarea::placeholder{color:var(--text-lighter)}[data-hide-when-drawing=true]{opacity:1;visibility:visible;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}[data-drawing=true] [data-hide-when-drawing=true]{opacity:0;visibility:hidden;pointer-events:none;user-select:none;-webkit-user-select:none}.echo-drawing-layer,.echo-drawing-layer-container{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;user-select:none;-webkit-user-select:none}.echo-drawing-layer-container svg{pointer-events:auto}.echo-drawing-toolbar{position:fixed;top:var(--spacing-xl);left:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-sm);z-index:var(--z-drawing-toolbar);opacity:1;transition:opacity var(--duration-base) var(--ease-default)}.echo-drawing-toolbar-button{width:50px;height:50px;border-radius:var(--radius-full);border:2px solid #ddd;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:all var(--duration-base) var(--ease-default);box-shadow:var(--shadow-black-sm);position:relative}.echo-drawing-toolbar-icon{width:25px;height:25px;color:var(--primary-color);transition:color var(--duration-base) var(--ease-default)}.echo-drawing-toolbar-button:hover{transform:scale(1.05);border-color:var(--hover-color)}.echo-drawing-toolbar-button[data-selected=true]{background:var(--primary-color-lightest);border-color:var(--primary-color)}.echo-color-selector{position:relative}.echo-color-selector:hover .echo-drawing-toolbar-button{border-top-right-radius:0;border-bottom-right-radius:0;transform:scale(1.05);border-right-color:transparent;background:rgba(var(--primary-color),.9);border-color:var(--hover-color)}.echo-color-swatch-wrapper{position:absolute;left:calc(100% - 2px);top:50%;transform:translateY(-50%);height:52.5px;padding-right:var(--spacing-sm);display:none}.echo-color-selector:hover .echo-color-swatch-wrapper{display:block}.echo-color-swatch{height:100%;background:#fff;border-radius:var(--radius-md);border-top-left-radius:0;border-bottom-left-radius:0;padding:var(--spacing-sm);padding-left:var(--spacing-md);box-shadow:var(--shadow-black-sm);display:flex;align-items:center;gap:var(--spacing-sm);border:2px solid #ddd;border-left:none}.echo-color-selector:hover .echo-color-swatch{border-color:var(--hover-color)}.echo-color-swatch-button{width:24px;height:24px;border-radius:var(--radius-full);border:2px solid transparent;cursor:pointer;padding:0;transition:transform var(--duration-base) var(--ease-default)}.echo-color-swatch-button:hover{transform:scale(1.1)}.echo-color-swatch-button[data-selected=true]{border-color:var(--primary-color)}.echo-drawing-tooltip{display:flex;text-wrap:nowrap;position:fixed;background:#fff;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-combined-sm);font-size:var(--font-sm);color:var(--primary-color);z-index:var(--z-drawing-tooltip);pointer-events:none;animation:slideDownFade var(--duration-slow) var(--ease-default);border:1px solid var(--primary-color);background:var(--primary-color-lightest)}.echo-shape-actions{position:fixed;z-index:var(--z-shape-actions);display:flex;gap:var(--spacing-xs);background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-combined-md);transform:translate(-50%,-100%) translateY(calc(-1 * var(--spacing-sm)));animation:popInSlideDown var(--duration-fast) var(--ease-default);cursor:default;pointer-events:auto;padding:var(--spacing-xs);border:1px solid var(--primary-color)}.echo-shape-actions-divider{width:1px;margin:var(--spacing-sm) 0;background:var(--border-color);pointer-events:none}.echo-shape-actions[hidden]{display:none}.echo-notification{position:absolute;z-index:var(--z-notification);bottom:70px;right:0;width:300px;padding:var(--spacing-2xl);border-radius:var(--radius-lg);font-size:var(--font-md);font-weight:500;box-shadow:var(--shadow-combined-md);background:#fff;border:1px solid var(--primary-color);transform-origin:bottom right;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl);opacity:1;pointer-events:auto;transition:all var(--duration-base) var(--ease-smooth)}.echo-notification:not([data-empty=true]){animation:popInSlideUp var(--duration-slower) var(--ease-spring)}.echo-notification[data-empty=true]{opacity:0;pointer-events:none;transform:translateY(var(--spacing-sm)) scale(.95);transition:none}.echo-notification-hide{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:24px;height:24px;padding:var(--spacing-xs);border:none;background:transparent;color:var(--text-light);opacity:.7;cursor:pointer;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;transition:all var(--duration-base) var(--ease-bounce);flex-shrink:0}.echo-notification-hide:hover{opacity:1;background:var(--primary-color-lightest);transform:scale(1.1);color:var(--primary-color)}.echo-notification-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transform:scale(1.5);background:var(--primary-color-lightest);padding:var(--spacing-md);border-radius:var(--radius-full);margin-top:var(--spacing-md);transition:all var(--duration-base) var(--ease-bounce)}.echo-notification[data-type=success]{border-color:var(--success-color)}.echo-notification[data-type=success] .echo-notification-icon{color:var(--success-color)}.echo-notification[data-type=error]{border-color:var(--error-color)}.echo-notification[data-type=error] .echo-notification-icon{color:var(--error-color);background:color-mix(in srgb,var(--error-color) 10%,white)}.echo-notification-content{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:0 12px}.echo-notification-title{font-size:1rem;font-weight:600;color:#1a1a1a}.echo-notification-message{font-size:.875rem;font-weight:400;color:#666;line-height:1.4;max-width:100%}@media (max-width: 768px){.echo-notification{right:0;width:calc(100vw - 40px);height:auto;min-height:180px;-webkit-backdrop-filter:none;backdrop-filter:none;font-size:.9375rem;padding:20px;gap:16px;bottom:calc(100% + 20px)}.echo-notification-icon{transform:scale(1.3);padding:10px;margin-top:8px}.echo-notification-title{font-size:.9375rem}.echo-notification-message{font-size:.8125rem}}.echo-welcome-message{display:flex;align-items:center;gap:var(--spacing-xs);position:fixed;z-index:var(--z-welcome-message);background:var(--primary-color-lightest);border:1px solid var(--primary-color);color:var(--primary-color);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-lg);font-size:var(--font-sm);font-weight:500;box-shadow:var(--shadow-combined-md);opacity:1;transform:translateY(0) scale(1);transition:all var(--duration-slow) var(--ease-smooth);animation:bounceIn var(--duration-slowest) var(--ease-bounce);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;cursor:pointer;text-align:left}.echo-welcome-message:hover{transform:translateY(-2px) scale(1.02);background:var(--primary-color-lightest);box-shadow:var(--shadow-combined-lg)}.echo-welcome-message:active{transform:translateY(0) scale(.98)}.echo-welcome-message-close{width:20px;height:20px;padding:2px;margin-left:var(--spacing-xs);border:none;background:transparent;opacity:.7;cursor:pointer;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;transition:all var(--duration-base) var(--ease-default)}.echo-welcome-message-close:hover{opacity:1;background:var(--shadow-color-light);transform:scale(1.1)}.echo-welcome-message-close:active{transform:scale(.95)}.echo-welcome-message:after{content:"";position:absolute;bottom:-4px;right:17px;width:16px;height:16px;background:inherit;transform:rotate(45deg);border-radius:var(--radius-xs);border:1px solid var(--primary-color);z-index:-2}.echo-welcome-message:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--primary-color-lightest);z-index:-1;border-radius:var(--radius-lg)}.echo-welcome-message-pulsar{content:"";display:inline-block;width:6px;height:6px;background:var(--primary-color);border-radius:50%;margin-right:8px;animation:pulse 1.5s var(--ease-in-out) infinite}.echo-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--radius-md);font-weight:500;cursor:pointer;transition:all var(--duration-base) var(--ease-default);line-height:1}.echo-button:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.echo-button-primary{background:var(--primary-color);color:#fff}.echo-button-primary:hover{background:var(--hover-color);transform:translateY(-1px)}.echo-button-primary:active{transform:translateY(0)}.echo-button-secondary{background:transparent;color:var(--text-light)}.echo-button-secondary:hover{background-color:var(--primary-color-lightest);color:var(--primary-color)}.echo-button-xs{padding:var(--spacing-xs);font-size:var(--font-xs)}.echo-button-sm{padding:var(--spacing-xs);font-size:var(--font-sm)}.echo-button-md{padding:var(--spacing-md) var(--spacing-2xl);font-size:var(--font-base)}.echo-button-lg{padding:var(--spacing-md) var(--spacing-3xl);font-size:var(--font-md)}@keyframes slideUpFade{0%{opacity:0;transform:translateY(var(--spacing-sm))}to{opacity:1;transform:translateY(0)}}@keyframes slideDownFade{0%{opacity:0;transform:translateY(calc(-1 * var(--spacing-sm)))}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popInSlideUp{0%{opacity:0;transform:translateY(var(--spacing-sm)) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes popInSlideDown{0%{opacity:0;transform:translate(-50%,-100%) translateY(calc(-1 * var(--spacing-xs))) scale(.95)}to{opacity:1;transform:translate(-50%,-100%) translateY(calc(-1 * var(--spacing-sm))) scale(1)}}@keyframes bounceIn{0%{opacity:0;transform:translateY(var(--spacing-xl)) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}to{transform:scale(1);opacity:1}}.echo-inputs{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem}.echo-input{display:flex;flex-direction:column;gap:.5rem}.echo-input-label{font-size:.875rem;font-weight:500;color:var(--text-color)}.echo-input-required{color:#dc2626;margin-left:.25rem}.echo-input-field{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;color:var(--text-medium);font-size:var(--font-sm);transition:all var(--duration-base) var(--ease-default)}.echo-input-field:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-input-field::placeholder{color:var(--text-lighter)}select.echo-input-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;padding-right:2.5rem;cursor:pointer}.echo-input-options{display:flex;flex-direction:column;gap:var(--spacing-sm);border:none;margin:0;padding:0}.echo-input-option{display:flex;align-items:center;gap:.5rem;cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--duration-base) var(--ease-default)}.echo-input-option:hover{background:var(--primary-color-lightest)}.echo-input-option input[type=radio],.echo-input-option input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;width:18px;height:18px;border:1px solid var(--border-color);background-color:#fff;display:grid;place-content:center;cursor:pointer;transition:all var(--duration-base) var(--ease-default)}.echo-input-option input[type=radio]{border-radius:50%}.echo-input-option input[type=radio]:before{content:"";width:10px;height:10px;border-radius:50%;transform:scale(0);transition:transform var(--duration-base) var(--ease-default);background-color:var(--primary-color)}.echo-input-option input[type=radio]:checked:before{transform:scale(1)}.echo-input-option input[type=checkbox]{border-radius:var(--radius-sm)}.echo-input-option input[type=checkbox]:before{content:"";width:12px;height:12px;transform:scale(0);transition:all var(--duration-base) var(--ease-default);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.echo-input-option input[type=checkbox]:checked{background-color:var(--primary-color-lighter);border-color:var(--primary-color-lighter)}.echo-input-option input[type=checkbox]:checked:before{transform:scale(1)}.echo-input-option input[type=radio]:hover,.echo-input-option input[type=checkbox]:hover{border-color:var(--primary-color-lighter)}.echo-input-option input[type=radio]:focus,.echo-input-option input[type=checkbox]:focus{outline:none;border-color:var(--primary-color-lighter);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-input-option input[type=radio]:checked,.echo-input-option input[type=checkbox]:checked{border-color:var(--primary-color-lighter)}.echo-input-option span{font-size:var(--font-sm);color:var(--text-medium);-webkit-user-select:none;user-select:none}.echo-select{position:relative;width:100%}.echo-select-trigger{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;color:var(--text-medium);font-size:var(--font-sm);transition:all var(--duration-base) var(--ease-default);cursor:pointer;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:.5rem;outline:none}.echo-select-trigger[data-placeholder=true]{color:var(--text-lighter)}.echo-select-trigger:hover{border-color:var(--border-color-medium)}.echo-select-trigger:focus,.echo-select-trigger[data-open=true]{border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-select-arrow{flex-shrink:0;transition:transform var(--duration-base) var(--ease-default)}.echo-select-trigger[data-open=true] .echo-select-arrow{transform:rotate(180deg)}.echo-select-dropdown{position:absolute;top:calc(100% + .25rem);left:0;right:0;background:#fff;border:1px solid var(--border-color-medium);border-radius:var(--radius-md);box-shadow:var(--shadow-black-lightened-md);max-height:15rem;overflow-y:auto;z-index:10;animation:slideDownFade var(--duration-base) var(--ease-default);padding:var(--spacing-xs)}.echo-select-option{width:100%;padding:.5rem .75rem;background:none;border:none;text-align:left;color:var(--text-medium);font-size:var(--font-sm);cursor:pointer;transition:all var(--duration-base) var(--ease-default);outline:none;border-radius:var(--radius-sm)}.echo-select-option:hover{background:var(--primary-color-lightest)}.echo-select-option:focus{background:var(--primary-color-lightest);box-shadow:0 0 0 1px var(--primary-color) inset}.echo-select-option[data-selected=true]{background:var(--primary-color-lightest);color:var(--primary-color);font-weight:500}select.echo-input-field{display:none}.visually-hidden{position:absolute;left:50%;bottom:0;transform:translate(-50%);width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}`;
1232
- var fn = /* @__PURE__ */ w('<div class=echo-color-selector role=group aria-label="Color Selection"><button class=echo-drawing-toolbar-button title="Current Color"></button><div class=echo-color-swatch-wrapper role=listbox aria-label="Available Colors"><div class=echo-color-swatch>'), gn = /* @__PURE__ */ w("<button class=echo-color-swatch-button role=option>");
1231
+ }, hn = `*,*:before,*:after{box-sizing:border-box}.echo-root{position:absolute;top:0;left:0;z-index:var(--z-root);isolation:isolate;pointer-events:none;--z-root: 999999;--z-launcher: 2;--z-overlay: 1;--z-drawing-toolbar: 3;--z-drawing-tooltip: 3;--z-shape-actions: 3;--z-notification: 2;--z-welcome-message: 2;--z-widget-button: 2;--z-feedback-form: 4;--primary-color: #000;--primary-text-color: #fff;--error-color: #f44336;--success-color: var(--primary-color);--text-dark: #1a1a1a;--text-medium: #333;--text-light: #666;--text-lighter: #999;--border-color: rgba(0, 0, 0, .1);--border-color-light: rgba(0, 0, 0, .05);--border-color-medium: rgba(0, 0, 0, .08);--background-color: #fff;--primary-color-lighter: color-mix(in srgb, var(--primary-color) 100%, white 40%);--primary-color-lightest: color-mix(in srgb, var(--primary-color) 7%, white 100%);--hover-color: color-mix(in srgb, var(--primary-color) 80%, #fff);--shadow-color-dark: rgba(0, 0, 0, .6);--shadow-color-light: rgba(255, 255, 255, .1);--shadow-color-medium: rgba(0, 0, 0, .2);--shadow-sm: 0 1px 3px;--shadow-md: 0 4px 10px;--shadow-lg: 0 10px 20px;--shadow-black-sm: var(--shadow-sm) rgba(0, 0, 0, .5);--shadow-black-md: var(--shadow-md) rgba(0, 0, 0, .5);--shadow-black-lg: var(--shadow-lg) rgba(0, 0, 0, .5);--shadow-black-lightened-sm: var(--shadow-sm) var(--shadow-color-medium);--shadow-black-lightened-md: var(--shadow-md) var(--shadow-color-medium);--shadow-black-lightened-lg: var(--shadow-lg) var(--shadow-color-medium);--shadow-primary-sm: var(--shadow-sm) color-mix(in srgb, var(--primary-color) 60%, transparent 80%);--shadow-primary-md: var(--shadow-md) color-mix(in srgb, var(--primary-color) 50%, transparent 80%);--shadow-primary-lg: var(--shadow-lg) color-mix(in srgb, var(--primary-color) 40%, transparent 80%);--shadow-primary-lighter-sm: var(--shadow-sm) color-mix(in srgb, var(--primary-color-lighter) 70%, transparent 80%);--shadow-primary-lighter-md: var(--shadow-md) color-mix(in srgb, var(--primary-color-lighter) 60%, transparent 80%);--shadow-primary-lighter-lg: var(--shadow-lg) color-mix(in srgb, var(--primary-color-lighter) 50%, transparent 80%);--shadow-primary-lightest-sm: var(--shadow-sm) color-mix(in srgb, var(--primary-color-lightest) 70%, transparent 80%);--shadow-primary-lightest-md: var(--shadow-md) color-mix(in srgb, var(--primary-color-lightest) 60%, transparent 80%);--shadow-primary-lightest-lg: var(--shadow-lg) color-mix(in srgb, var(--primary-color-lightest) 50%, transparent 80%);--shadow-combined-sm: var(--shadow-primary-sm), var(--shadow-black-lightened-sm);--shadow-combined-md: var(--shadow-primary-md), var(--shadow-black-lightened-md);--shadow-combined-lg: var(--shadow-primary-lg), var(--shadow-black-lightened-lg);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 20px;--spacing-2xl: 24px;--spacing-3xl: 32px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--font-xs: .8125rem;--font-sm: .875rem;--font-base: .9375rem;--font-md: 1rem;--font-lg: 1.125rem;--duration-fast: .1s;--duration-base: .2s;--duration-slow: .3s;--duration-slower: .4s;--duration-slowest: .6s;--ease-default: ease;--ease-in-out: ease-in-out;--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--ease-spring: cubic-bezier(.16, 1, .3, 1)}.echo-stored-feedback{position:absolute;display:flex;flex-direction:column;bottom:calc(100% + var(--spacing-lg));right:0;width:320px;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-black-lightened-lg);animation:slideUpFade var(--duration-base) var(--ease-smooth);z-index:calc(var(--z-widget-button) + 1);transform-origin:bottom right;transition:all var(--duration-base) var(--ease-smooth)}.echo-stored-feedback-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-lg)}.echo-stored-feedback-header h3{margin:0;font-size:var(--font-md);font-weight:600}.echo-stored-feedback-list{max-height:400px;overflow-y:auto;border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.echo-stored-feedback-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--border-color-light);transition:all var(--duration-base) var(--ease-smooth);background:#fff;position:relative}.echo-stored-feedback-item:hover{background:var(--primary-color-lightest)}.echo-stored-feedback-item-current{background:var(--primary-color-lightest);padding-left:calc(var(--spacing-lg) - 3px)}.echo-stored-feedback-item-current:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--primary-color);border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg)}.echo-stored-feedback-item:last-child{border-bottom:none;border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.echo-stored-feedback-item:last-child.echo-stored-feedback-item-current:before{border-bottom-left-radius:var(--radius-lg)}.echo-stored-feedback-content{flex:1;min-width:0;margin-right:var(--spacing-md)}.echo-stored-feedback-path{font-size:var(--font-sm);font-weight:500;color:var(--text-medium);margin-bottom:var(--spacing-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.echo-stored-feedback-preview{font-size:var(--font-xs);color:var(--text-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.echo-stored-feedback-actions{display:flex;align-items:center;gap:var(--spacing-sm)}.echo-stored-feedback-link{color:var(--text-light)}.echo-stored-feedback-link:hover{color:var(--primary-color)}.echo-stored-feedback-delete{color:var(--text-light);font-size:var(--font-xs);padding:var(--spacing-xs) var(--spacing-md)}.echo-stored-feedback-delete:hover{color:var(--error-color);background:color-mix(in srgb,var(--error-color) 10%,transparent)}.echo-stored-feedback-empty{padding:var(--spacing-3xl) var(--spacing-lg);text-align:center;color:var(--text-light);font-size:var(--font-sm);border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.echo-launcher{position:fixed;z-index:var(--z-launcher);bottom:var(--spacing-xl);right:var(--spacing-xl);pointer-events:none}.echo-overlay{position:absolute;top:0;left:0;margin:0;padding:0;max-width:none;max-height:none;border:3px solid var(--primary-color);background:transparent}.echo-overlay::backdrop{background:transparent}[data-hidden=true],[data-hidden=false]{transition:opacity var(--duration-slow) var(--ease-in-out),visibility var(--duration-slow) var(--ease-in-out)}[data-hidden=true]{opacity:0;visibility:hidden;pointer-events:none}[data-hidden=false]{opacity:1;visibility:visible;pointer-events:auto;user-select:none;-webkit-user-select:none}.echo-launcher-button{z-index:var(--z-widget-button);position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;background:radial-gradient(circle at 40% 40%,var(--primary-color) 0%,var(--primary-color-lighter) 65%,var(--primary-color-lighter) 100%);border:none;border-radius:var(--radius-full);width:48px;height:48px;box-shadow:var(--shadow-black-md);transition:all var(--duration-slow) var(--ease-default),transform var(--duration-slower) var(--ease-smooth),opacity var(--duration-slow) var(--ease-in-out);will-change:transform}.echo-launcher-button:hover{box-shadow:var(--shadow-black-lg);transform:translateY(-2px)}.echo-launcher-button:active{transform:scale(.95)}.echo-launcher-button-count{position:absolute;top:calc(-1 * var(--spacing-xs));left:calc(-1 * var(--spacing-xs));background:var(--primary-color-lightest);color:var(--primary-color-lighter);border-radius:var(--radius-md);min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-black-sm);padding:0 var(--spacing-xs);font-weight:600;pointer-events:auto;cursor:pointer;transform-origin:center center;animation:popIn var(--duration-slow) var(--ease-bounce);transition:transform var(--duration-base) var(--ease-default)}.echo-launcher-button-count:hover{transform:scale(1.1)}.echo-feedback{position:fixed;bottom:var(--spacing-xl);right:var(--spacing-xl);width:min(calc(100vw - var(--spacing-xl) * 2),24rem);max-height:calc(100vh - var(--spacing-xl) * 2);z-index:var(--z-feedback-form);box-shadow:var(--shadow-black-lightened-lg);display:flex;flex-direction:column;gap:var(--spacing-lg);background:var(--background-color);border-radius:var(--radius-lg);overflow-y:auto;will-change:transform;padding:0 var(--spacing-lg)}.echo-feedback[data-minimized=true]{transition:transform .4s var(--ease-default),box-shadow .4s var(--ease-default);transform:translate(calc(100% - 48px),calc(100% - 48px));box-shadow:0 8px 16px #0003}.echo-feedback[data-minimized=true]:hover{cursor:pointer;transform:translate(calc(100% - 48px),calc(100% - 48px)) rotate(-2deg) scale(1.1);box-shadow:0 12px 24px #00000040}.echo-feedback[data-minimized=false]{transition:transform .4s var(--ease-smooth),box-shadow .4s var(--ease-smooth);transform:translate(0)}.echo-feedback[style*=transition]{pointer-events:none}.echo-feedback-content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.echo-feedback-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg) 0;background-color:var(--background-color);position:sticky;top:0;z-index:1}.echo-feedback-footer{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg) 0;background-color:var(--background-color);position:sticky;bottom:0;z-index:1}.echo-feedback-title{font-size:var(--font-lg);font-weight:600;color:var(--text-dark);margin:0}.echo-feedback-header-actions{display:flex;gap:var(--spacing-xs);margin:calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) 0}.echo-feedback-form-textarea{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;color:var(--text-medium);font-size:var(--font-sm);transition:all var(--duration-base) var(--ease-default);min-height:120px;resize:vertical;font-family:inherit}.echo-feedback-form-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-feedback-form-textarea::placeholder{color:var(--text-lighter)}[data-hide-when-drawing=true]{opacity:1;visibility:visible;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}[data-drawing=true] [data-hide-when-drawing=true]{opacity:0;visibility:hidden;pointer-events:none;user-select:none;-webkit-user-select:none}.echo-drawing-layer,.echo-drawing-layer-container{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;user-select:none;-webkit-user-select:none}.echo-drawing-layer-container svg{pointer-events:auto}.echo-drawing-toolbar{position:fixed;top:var(--spacing-xl);left:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-sm);z-index:var(--z-drawing-toolbar);opacity:1;transition:opacity var(--duration-base) var(--ease-default)}.echo-drawing-toolbar-button{width:50px;height:50px;border-radius:var(--radius-full);border:2px solid #ddd;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:all var(--duration-base) var(--ease-default);box-shadow:var(--shadow-black-sm);position:relative}.echo-drawing-toolbar-icon{width:25px;height:25px;color:var(--primary-color);transition:color var(--duration-base) var(--ease-default)}.echo-drawing-toolbar-button:hover{transform:scale(1.05);border-color:var(--hover-color)}.echo-drawing-toolbar-button[data-selected=true]{background:var(--primary-color-lightest);border-color:var(--primary-color)}.echo-color-selector{position:relative}.echo-color-selector:hover .echo-drawing-toolbar-button{border-top-right-radius:0;border-bottom-right-radius:0;transform:scale(1.05);border-right-color:transparent;background:rgba(var(--primary-color),.9);border-color:var(--hover-color)}.echo-color-swatch-wrapper{position:absolute;left:calc(100% - 2px);top:50%;transform:translateY(-50%);height:52.5px;padding-right:var(--spacing-sm);display:none}.echo-color-selector:hover .echo-color-swatch-wrapper{display:block}.echo-color-swatch{height:100%;background:#fff;border-radius:var(--radius-md);border-top-left-radius:0;border-bottom-left-radius:0;padding:var(--spacing-sm);padding-left:var(--spacing-md);box-shadow:var(--shadow-black-sm);display:flex;align-items:center;gap:var(--spacing-sm);border:2px solid #ddd;border-left:none}.echo-color-selector:hover .echo-color-swatch{border-color:var(--hover-color)}.echo-color-swatch-button{width:24px;height:24px;border-radius:var(--radius-full);border:2px solid transparent;cursor:pointer;padding:0;transition:transform var(--duration-base) var(--ease-default)}.echo-color-swatch-button:hover{transform:scale(1.1)}.echo-color-swatch-button[data-selected=true]{border-color:var(--primary-color)}.echo-drawing-tooltip{display:flex;text-wrap:nowrap;position:fixed;background:#fff;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-combined-sm);font-size:var(--font-sm);color:var(--primary-color);z-index:var(--z-drawing-tooltip);pointer-events:none;animation:slideDownFade var(--duration-slow) var(--ease-default);border:1px solid var(--primary-color);background:var(--primary-color-lightest)}.echo-shape-actions{position:fixed;z-index:var(--z-shape-actions);display:flex;gap:var(--spacing-xs);background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-combined-md);transform:translate(-50%,-100%) translateY(calc(-1 * var(--spacing-sm)));animation:popInSlideDown var(--duration-fast) var(--ease-default);cursor:default;pointer-events:auto;padding:var(--spacing-xs);border:1px solid var(--primary-color)}.echo-shape-actions-divider{width:1px;margin:var(--spacing-sm) 0;background:var(--border-color);pointer-events:none}.echo-shape-actions[hidden]{display:none}.echo-notification{position:absolute;z-index:var(--z-notification);bottom:70px;right:0;width:300px;padding:var(--spacing-2xl);border-radius:var(--radius-lg);font-size:var(--font-md);font-weight:500;box-shadow:var(--shadow-combined-md);background:#fff;border:1px solid var(--primary-color);transform-origin:bottom right;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl);opacity:1;pointer-events:auto;transition:all var(--duration-base) var(--ease-smooth)}.echo-notification:not([data-empty=true]){animation:popInSlideUp var(--duration-slower) var(--ease-spring)}.echo-notification[data-empty=true]{opacity:0;pointer-events:none;transform:translateY(var(--spacing-sm)) scale(.95);transition:none}.echo-notification-hide{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:24px;height:24px;padding:var(--spacing-xs);border:none;background:transparent;color:var(--text-light);opacity:.7;cursor:pointer;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;transition:all var(--duration-base) var(--ease-bounce);flex-shrink:0}.echo-notification-hide:hover{opacity:1;background:var(--primary-color-lightest);transform:scale(1.1);color:var(--primary-color)}.echo-notification-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transform:scale(1.5);background:var(--primary-color-lightest);padding:var(--spacing-md);border-radius:var(--radius-full);margin-top:var(--spacing-md);transition:all var(--duration-base) var(--ease-bounce)}.echo-notification[data-type=success]{border-color:var(--success-color)}.echo-notification[data-type=success] .echo-notification-icon{color:var(--success-color)}.echo-notification[data-type=error]{border-color:var(--error-color)}.echo-notification[data-type=error] .echo-notification-icon{color:var(--error-color);background:color-mix(in srgb,var(--error-color) 10%,white)}.echo-notification-content{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:0 12px}.echo-notification-title{font-size:1rem;font-weight:600;color:#1a1a1a}.echo-notification-message{font-size:.875rem;font-weight:400;color:#666;line-height:1.4;max-width:100%}@media (max-width: 768px){.echo-notification{right:0;width:calc(100vw - 40px);height:auto;min-height:180px;-webkit-backdrop-filter:none;backdrop-filter:none;font-size:.9375rem;padding:20px;gap:16px;bottom:calc(100% + 20px)}.echo-notification-icon{transform:scale(1.3);padding:10px;margin-top:8px}.echo-notification-title{font-size:.9375rem}.echo-notification-message{font-size:.8125rem}}.echo-welcome-message{display:flex;align-items:center;gap:var(--spacing-xs);position:fixed;z-index:var(--z-welcome-message);background:var(--primary-color-lightest);border:1px solid var(--primary-color);color:var(--primary-color);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-lg);font-size:var(--font-sm);font-weight:500;box-shadow:var(--shadow-combined-md);opacity:1;transform:translateY(0) scale(1);transition:all var(--duration-slow) var(--ease-smooth);animation:bounceIn var(--duration-slowest) var(--ease-bounce);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;cursor:pointer;text-align:left}.echo-welcome-message:hover{transform:translateY(-2px) scale(1.02);background:var(--primary-color-lightest);box-shadow:var(--shadow-combined-lg)}.echo-welcome-message:active{transform:translateY(0) scale(.98)}.echo-welcome-message-close{width:20px;height:20px;padding:2px;margin-left:var(--spacing-xs);border:none;background:transparent;opacity:.7;cursor:pointer;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;transition:all var(--duration-base) var(--ease-default)}.echo-welcome-message-close:hover{opacity:1;background:var(--shadow-color-light);transform:scale(1.1)}.echo-welcome-message-close:active{transform:scale(.95)}.echo-welcome-message:after{content:"";position:absolute;bottom:-4px;right:17px;width:16px;height:16px;background:inherit;transform:rotate(45deg);border-radius:var(--radius-xs);border:1px solid var(--primary-color);z-index:-2}.echo-welcome-message:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--primary-color-lightest);z-index:-1;border-radius:var(--radius-lg)}.echo-welcome-message-pulsar{content:"";display:inline-block;width:6px;height:6px;background:var(--primary-color);border-radius:50%;margin-right:8px;animation:pulse 1.5s var(--ease-in-out) infinite}.echo-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--radius-md);font-weight:500;cursor:pointer;transition:all var(--duration-base) var(--ease-default);line-height:1}.echo-button:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.echo-button-primary{background:var(--primary-color);color:#fff}.echo-button-primary:hover{background:var(--hover-color);transform:translateY(-1px)}.echo-button-primary:active{transform:translateY(0)}.echo-button-secondary{background:transparent;color:var(--text-light)}.echo-button-secondary:hover{background-color:var(--primary-color-lightest);color:var(--primary-color)}.echo-button-xs{padding:var(--spacing-xs);font-size:var(--font-xs)}.echo-button-sm{padding:var(--spacing-xs);font-size:var(--font-sm)}.echo-button-md{padding:var(--spacing-md) var(--spacing-2xl);font-size:var(--font-base)}.echo-button-lg{padding:var(--spacing-md) var(--spacing-3xl);font-size:var(--font-md)}@keyframes slideUpFade{0%{opacity:0;transform:translateY(var(--spacing-sm))}to{opacity:1;transform:translateY(0)}}@keyframes slideDownFade{0%{opacity:0;transform:translateY(calc(-1 * var(--spacing-sm)))}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popInSlideUp{0%{opacity:0;transform:translateY(var(--spacing-sm)) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes popInSlideDown{0%{opacity:0;transform:translate(-50%,-100%) translateY(calc(-1 * var(--spacing-xs))) scale(.95)}to{opacity:1;transform:translate(-50%,-100%) translateY(calc(-1 * var(--spacing-sm))) scale(1)}}@keyframes bounceIn{0%{opacity:0;transform:translateY(var(--spacing-xl)) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}to{transform:scale(1);opacity:1}}.echo-inputs{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem}.echo-input{display:flex;flex-direction:column;gap:.5rem}.echo-input-label{font-size:.875rem;font-weight:500;color:var(--text-color)}.echo-input-required{color:#dc2626;margin-left:.25rem}.echo-input-field{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;color:var(--text-medium);font-size:var(--font-sm);transition:all var(--duration-base) var(--ease-default)}.echo-input-field:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-input-field:disabled{opacity:.5}.echo-input-field::placeholder{color:var(--text-lighter)}select.echo-input-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;padding-right:2.5rem;cursor:pointer}.echo-input-options-wrapper{display:flex;flex-direction:column;gap:var(--spacing-xl);border:none;margin:0;padding:0}.echo-input-options{display:flex;flex-direction:column;gap:var(--spacing-sm);border:none;margin:0;padding:0}.echo-input-option{display:flex;align-items:center;gap:.5rem;cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--duration-base) var(--ease-default)}.echo-input-option:hover{background:var(--primary-color-lightest)}.echo-input-option input[type=radio],.echo-input-option input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;width:18px;height:18px;border:1px solid var(--border-color);background-color:#fff;display:grid;place-content:center;cursor:pointer;transition:all var(--duration-base) var(--ease-default)}.echo-input-option input[type=radio]{border-radius:50%}.echo-input-option input[type=radio]:before{content:"";width:10px;height:10px;border-radius:50%;transform:scale(0);transition:transform var(--duration-base) var(--ease-default);background-color:var(--primary-color)}.echo-input-option input[type=radio]:checked:before{transform:scale(1)}.echo-input-option input[type=checkbox]{border-radius:var(--radius-sm)}.echo-input-option input[type=checkbox]:before{content:"";width:12px;height:12px;transform:scale(0);transition:all var(--duration-base) var(--ease-default);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.echo-input-option input[type=checkbox]:checked{background-color:var(--primary-color-lighter);border-color:var(--primary-color-lighter)}.echo-input-option input[type=checkbox]:checked:before{transform:scale(1)}.echo-input-option input[type=radio]:hover,.echo-input-option input[type=checkbox]:hover{border-color:var(--primary-color-lighter)}.echo-input-option input[type=radio]:focus,.echo-input-option input[type=checkbox]:focus{outline:none;border-color:var(--primary-color-lighter);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-input-option input[type=radio]:checked,.echo-input-option input[type=checkbox]:checked{border-color:var(--primary-color-lighter)}.echo-input-option span{font-size:var(--font-sm);color:var(--text-medium);-webkit-user-select:none;user-select:none}.echo-select{position:relative;width:100%}.echo-select-trigger{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:#fff;color:var(--text-medium);font-size:var(--font-sm);transition:all var(--duration-base) var(--ease-default);cursor:pointer;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:.5rem;outline:none}.echo-select-trigger[data-placeholder=true]{color:var(--text-lighter)}.echo-select-trigger:hover{border-color:var(--border-color-medium)}.echo-select-trigger:focus,.echo-select-trigger[data-open=true]{border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 15%,transparent)}.echo-select-arrow{flex-shrink:0;transition:transform var(--duration-base) var(--ease-default)}.echo-select-trigger[data-open=true] .echo-select-arrow{transform:rotate(180deg)}.echo-select-dropdown{position:absolute;top:calc(100% + .25rem);left:0;right:0;background:#fff;border:1px solid var(--border-color-medium);border-radius:var(--radius-md);box-shadow:var(--shadow-black-lightened-md);max-height:15rem;overflow-y:auto;z-index:10;animation:slideDownFade var(--duration-base) var(--ease-default);padding:var(--spacing-xs)}.echo-select-option{width:100%;padding:.5rem .75rem;background:none;border:none;text-align:left;color:var(--text-medium);font-size:var(--font-sm);cursor:pointer;transition:all var(--duration-base) var(--ease-default);outline:none;border-radius:var(--radius-sm)}.echo-select-option:hover{background:var(--primary-color-lightest)}.echo-select-option:focus{background:var(--primary-color-lightest);box-shadow:0 0 0 1px var(--primary-color) inset}.echo-select-option[data-selected=true]{background:var(--primary-color-lightest);color:var(--primary-color);font-weight:500}select.echo-input-field{display:none}.visually-hidden{position:absolute;left:50%;bottom:0;transform:translate(-50%);width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}`;
1232
+ var gn = /* @__PURE__ */ w('<div class=echo-color-selector role=group aria-label="Color Selection"><button class=echo-drawing-toolbar-button title="Current Color"></button><div class=echo-color-swatch-wrapper role=listbox aria-label="Available Colors"><div class=echo-color-swatch>'), fn = /* @__PURE__ */ w("<button class=echo-color-swatch-button role=option>");
1233
1233
  const mn = [
1234
1234
  "#ff6b6b",
1235
1235
  // Soft Red
@@ -1256,21 +1256,21 @@ const mn = [
1256
1256
  "#66d9e8": "Soft Cyan",
1257
1257
  "#ffa94d": "Soft Orange",
1258
1258
  "#e599f7": "Soft Pink"
1259
- }, Se = (e) => vn[e] || "Primary", bn = () => {
1259
+ }, Ce = (e) => vn[e] || "Primary", bn = () => {
1260
1260
  const e = $();
1261
1261
  return (() => {
1262
- var n = fn(), t = n.firstChild, r = t.nextSibling, a = r.firstChild;
1263
- return u(t, "aria-expanded", !1), v(a, f(_, {
1262
+ var n = gn(), t = n.firstChild, r = t.nextSibling, a = r.firstChild;
1263
+ return d(t, "aria-expanded", !1), v(a, g(W, {
1264
1264
  get each() {
1265
1265
  return [e.widget.state.primaryColor, ...mn];
1266
1266
  },
1267
1267
  children: (o) => (() => {
1268
- var i = gn();
1268
+ var i = fn();
1269
1269
  return i.$$click = () => e.drawing.setState({
1270
1270
  selectedColor: o
1271
1271
  }), o != null ? i.style.setProperty("background-color", o) : i.style.removeProperty("background-color"), b((l) => {
1272
- var s = `Select ${Se(o)} color`, c = e.drawing.state.selectedColor === o, d = `${Se(o)} color`, h = e.drawing.state.selectedColor === o;
1273
- return s !== l.e && u(i, "title", l.e = s), c !== l.t && u(i, "data-selected", l.t = c), d !== l.a && u(i, "aria-label", l.a = d), h !== l.o && u(i, "aria-selected", l.o = h), l;
1272
+ var s = `Select ${Ce(o)} color`, c = e.drawing.state.selectedColor === o, u = `${Ce(o)} color`, h = e.drawing.state.selectedColor === o;
1273
+ return s !== l.e && d(i, "title", l.e = s), c !== l.t && d(i, "data-selected", l.t = c), u !== l.a && d(i, "aria-label", l.a = u), h !== l.o && d(i, "aria-selected", l.o = h), l;
1274
1274
  }, {
1275
1275
  e: void 0,
1276
1276
  t: void 0,
@@ -1279,8 +1279,8 @@ const mn = [
1279
1279
  }), i;
1280
1280
  })()
1281
1281
  })), b((o) => {
1282
- var i = `Current color: ${Se(e.drawing.state.selectedColor)}`, l = e.drawing.state.selectedColor;
1283
- return i !== o.e && u(t, "aria-label", o.e = i), l !== o.t && ((o.t = l) != null ? t.style.setProperty("background-color", l) : t.style.removeProperty("background-color")), o;
1282
+ var i = `Current color: ${Ce(e.drawing.state.selectedColor)}`, l = e.drawing.state.selectedColor;
1283
+ return i !== o.e && d(t, "aria-label", o.e = i), l !== o.t && ((o.t = l) != null ? t.style.setProperty("background-color", l) : t.style.removeProperty("background-color")), o;
1284
1284
  }, {
1285
1285
  e: void 0,
1286
1286
  t: void 0
@@ -1289,11 +1289,11 @@ const mn = [
1289
1289
  };
1290
1290
  T(["click"]);
1291
1291
  var wn = /* @__PURE__ */ w('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"stroke-linecap=round stroke-linejoin=round><path d="m9 18 6-6-6-6">');
1292
- const yn = (e) => (() => {
1292
+ const pn = (e) => (() => {
1293
1293
  var n = wn();
1294
1294
  return b((t) => {
1295
1295
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1296
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1296
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1297
1297
  }, {
1298
1298
  e: void 0,
1299
1299
  t: void 0,
@@ -1304,12 +1304,12 @@ const yn = (e) => (() => {
1304
1304
  s: void 0
1305
1305
  }), n;
1306
1306
  })();
1307
- var pn = /* @__PURE__ */ w('<svg viewBox="0 0 64 66"fill=none><path d="M59.716 36.936L54.9 33l-6.17 5.108a77.278 77.278 0 00-12.744 13.469l-3.637 4.914-3.778-5.017a83.719 83.719 0 00-13.956-14.538L9.799 33l2.86-2.332A104.39 104.39 0 0030.1 12.5l2.24-2.98 1.736 2.298a111.905 111.905 0 0018.608 19.384l2.206 1.81 2.861-2.333a104.13 104.13 0 005.297-4.641C59.978 11.294 47.409.26 32.349.26 14.997.26.92 14.923.92 33c0 18.076 14.077 32.74 31.43 32.74 15.102 0 27.715-11.103 30.73-25.892a75.808 75.808 0 00-3.375-2.912h.011z">');
1307
+ var yn = /* @__PURE__ */ w('<svg viewBox="0 0 64 66"fill=none><path d="M59.716 36.936L54.9 33l-6.17 5.108a77.278 77.278 0 00-12.744 13.469l-3.637 4.914-3.778-5.017a83.719 83.719 0 00-13.956-14.538L9.799 33l2.86-2.332A104.39 104.39 0 0030.1 12.5l2.24-2.98 1.736 2.298a111.905 111.905 0 0018.608 19.384l2.206 1.81 2.861-2.333a104.13 104.13 0 005.297-4.641C59.978 11.294 47.409.26 32.349.26 14.997.26.92 14.923.92 33c0 18.076 14.077 32.74 31.43 32.74 15.102 0 27.715-11.103 30.73-25.892a75.808 75.808 0 00-3.375-2.912h.011z">');
1308
1308
  const xn = (e) => (() => {
1309
- var n = pn(), t = n.firstChild;
1309
+ var n = yn(), t = n.firstChild;
1310
1310
  return b((r) => {
1311
1311
  var a = e.size ?? 24, o = e.size ?? 24, i = e.class, l = e.style, s = e.fill ?? "currentColor";
1312
- return a !== r.e && u(n, "width", r.e = a), o !== r.t && u(n, "height", r.t = o), i !== r.a && u(n, "class", r.a = i), r.o = F(n, l, r.o), s !== r.i && u(t, "fill", r.i = s), r;
1312
+ return a !== r.e && d(n, "width", r.e = a), o !== r.t && d(n, "height", r.t = o), i !== r.a && d(n, "class", r.a = i), r.o = F(n, l, r.o), s !== r.i && d(t, "fill", r.i = s), r;
1313
1313
  }, {
1314
1314
  e: void 0,
1315
1315
  t: void 0,
@@ -1323,7 +1323,7 @@ const Sn = (e) => (() => {
1323
1323
  var n = kn();
1324
1324
  return b((t) => {
1325
1325
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1326
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1326
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1327
1327
  }, {
1328
1328
  e: void 0,
1329
1329
  t: void 0,
@@ -1339,7 +1339,7 @@ const $n = (e) => (() => {
1339
1339
  var n = Cn();
1340
1340
  return b((t) => {
1341
1341
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1342
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1342
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1343
1343
  }, {
1344
1344
  e: void 0,
1345
1345
  t: void 0,
@@ -1355,7 +1355,7 @@ const it = (e) => (() => {
1355
1355
  var n = En();
1356
1356
  return b((t) => {
1357
1357
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1358
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1358
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1359
1359
  }, {
1360
1360
  e: void 0,
1361
1361
  t: void 0,
@@ -1371,7 +1371,7 @@ const zn = (e) => (() => {
1371
1371
  var n = Pn();
1372
1372
  return b((t) => {
1373
1373
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1374
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1374
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1375
1375
  }, {
1376
1376
  e: void 0,
1377
1377
  t: void 0,
@@ -1387,7 +1387,7 @@ const In = (e) => (() => {
1387
1387
  var n = Tn();
1388
1388
  return b((t) => {
1389
1389
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1390
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1390
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1391
1391
  }, {
1392
1392
  e: void 0,
1393
1393
  t: void 0,
@@ -1399,11 +1399,11 @@ const In = (e) => (() => {
1399
1399
  }), n;
1400
1400
  })();
1401
1401
  var On = /* @__PURE__ */ w('<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"stroke-linecap=round stroke-linejoin=round><path d="M18 6 6 18"></path><path d="m6 6 12 12">');
1402
- const pe = (e) => (() => {
1402
+ const xe = (e) => (() => {
1403
1403
  var n = On();
1404
1404
  return b((t) => {
1405
1405
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1406
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1406
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1407
1407
  }, {
1408
1408
  e: void 0,
1409
1409
  t: void 0,
@@ -1422,7 +1422,7 @@ const Dn = {
1422
1422
  const e = $(), n = Object.values(B);
1423
1423
  return (() => {
1424
1424
  var t = Mn(), r = t.firstChild;
1425
- return v(t, f(_, {
1425
+ return v(t, g(W, {
1426
1426
  each: n,
1427
1427
  children: (a) => {
1428
1428
  const o = Dn[a.id];
@@ -1430,12 +1430,12 @@ const Dn = {
1430
1430
  var i = An();
1431
1431
  return i.$$click = () => e.drawing.setState({
1432
1432
  selectedTool: a.id
1433
- }), v(i, f(o, {
1433
+ }), v(i, g(o, {
1434
1434
  class: "echo-drawing-toolbar-icon",
1435
1435
  "aria-hidden": "true"
1436
1436
  })), b((l) => {
1437
- var s = a.label, c = e.drawing.state.selectedTool === a.id, d = a.label, h = e.drawing.state.selectedTool === a.id;
1438
- return s !== l.e && u(i, "title", l.e = s), c !== l.t && u(i, "data-selected", l.t = c), d !== l.a && u(i, "aria-label", l.a = d), h !== l.o && u(i, "aria-pressed", l.o = h), l;
1437
+ var s = a.label, c = e.drawing.state.selectedTool === a.id, u = a.label, h = e.drawing.state.selectedTool === a.id;
1438
+ return s !== l.e && d(i, "title", l.e = s), c !== l.t && d(i, "data-selected", l.t = c), u !== l.a && d(i, "aria-label", l.a = u), h !== l.o && d(i, "aria-pressed", l.o = h), l;
1439
1439
  }, {
1440
1440
  e: void 0,
1441
1441
  t: void 0,
@@ -1444,9 +1444,9 @@ const Dn = {
1444
1444
  }), i;
1445
1445
  })();
1446
1446
  }
1447
- }), r), v(t, f(bn, {}), r), r.$$click = () => e.drawing.setState({
1447
+ }), r), v(t, g(bn, {}), r), r.$$click = () => e.drawing.setState({
1448
1448
  shapes: []
1449
- }, !0), v(r, f(it, {
1449
+ }, !0), v(r, g(it, {
1450
1450
  class: "echo-drawing-toolbar-icon",
1451
1451
  "aria-hidden": "true"
1452
1452
  })), t;
@@ -1456,7 +1456,7 @@ T(["click"]);
1456
1456
  var Ln = /* @__PURE__ */ w("<div class=echo-drawing-tooltip data-hide-when-drawing=true>");
1457
1457
  const jn = () => {
1458
1458
  const e = $(), n = k(() => e.drawing.state.showTooltip && e.drawing.state.mousePosition.y && e.drawing.state.mousePosition.x && e.widget.state.isOpen && !Rt());
1459
- return f(D, {
1459
+ return g(D, {
1460
1460
  get when() {
1461
1461
  return n();
1462
1462
  },
@@ -1473,11 +1473,11 @@ const jn = () => {
1473
1473
  });
1474
1474
  };
1475
1475
  var Nn = /* @__PURE__ */ w("<button>");
1476
- const W = (e) => {
1476
+ const _ = (e) => {
1477
1477
  const n = () => e.variant || "primary", t = () => e.size || "md";
1478
1478
  return (() => {
1479
1479
  var r = Nn();
1480
- return $t(r, ge(e, {
1480
+ return $t(r, ae(e, {
1481
1481
  get class() {
1482
1482
  return `echo-button echo-button-${n()} echo-button-${t()} ${e.class}`;
1483
1483
  }
@@ -1489,7 +1489,7 @@ const Vn = (e) => (() => {
1489
1489
  var n = qn();
1490
1490
  return b((t) => {
1491
1491
  var r = e.size ?? 24, a = e.size ?? 24, o = e.fill ?? "none", i = e.stroke ?? "currentColor", l = e.strokeWidth ?? 2, s = e.class, c = e.style;
1492
- return r !== t.e && u(n, "width", t.e = r), a !== t.t && u(n, "height", t.t = a), o !== t.a && u(n, "fill", t.a = o), i !== t.o && u(n, "stroke", t.o = i), l !== t.i && u(n, "stroke-width", t.i = l), s !== t.n && u(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1492
+ return r !== t.e && d(n, "width", t.e = r), a !== t.t && d(n, "height", t.t = a), o !== t.a && d(n, "fill", t.a = o), i !== t.o && d(n, "stroke", t.o = i), l !== t.i && d(n, "stroke-width", t.i = l), s !== t.n && d(n, "class", t.n = s), t.s = F(n, c, t.s), t;
1493
1493
  }, {
1494
1494
  e: void 0,
1495
1495
  t: void 0,
@@ -1500,11 +1500,11 @@ const Vn = (e) => (() => {
1500
1500
  s: void 0
1501
1501
  }), n;
1502
1502
  })();
1503
- var Bn = /* @__PURE__ */ w("<div class=echo-stored-feedback-empty>No unsubmitted feedback"), Wn = /* @__PURE__ */ w("<div class=echo-stored-feedback><div class=echo-stored-feedback-header><h3>Unsubmitted Feedback</h3></div><div class=echo-stored-feedback-list>"), _n = /* @__PURE__ */ w("<div><div class=echo-stored-feedback-content><div class=echo-stored-feedback-path></div><div class=echo-stored-feedback-preview></div></div><div class=echo-stored-feedback-actions>");
1503
+ var Bn = /* @__PURE__ */ w("<div class=echo-stored-feedback-empty>No unsubmitted feedback"), _n = /* @__PURE__ */ w("<div class=echo-stored-feedback><div class=echo-stored-feedback-header><h3>Unsubmitted Feedback</h3></div><div class=echo-stored-feedback-list>"), Wn = /* @__PURE__ */ w("<div><div class=echo-stored-feedback-content><div class=echo-stored-feedback-path></div><div class=echo-stored-feedback-preview></div></div><div class=echo-stored-feedback-actions>");
1504
1504
  const Hn = () => {
1505
1505
  const e = $();
1506
1506
  let n;
1507
- const [t, r] = A(xe()), [a, o] = A(window.location.pathname), i = (m) => {
1507
+ const [t, r] = A(ke()), [a, o] = A(window.location.pathname), i = (m) => {
1508
1508
  m.key === "Escape" && e.widget.state.isStoredFeedbackOpen && e.widget.setState({
1509
1509
  isStoredFeedbackOpen: !1
1510
1510
  });
@@ -1514,7 +1514,7 @@ const Hn = () => {
1514
1514
  isStoredFeedbackOpen: !1
1515
1515
  });
1516
1516
  }, s = () => {
1517
- const m = xe();
1517
+ const m = ke();
1518
1518
  r(m), e.widget.setState({
1519
1519
  pagesCount: m.length
1520
1520
  });
@@ -1543,76 +1543,76 @@ const Hn = () => {
1543
1543
  event: "click",
1544
1544
  callback: l
1545
1545
  });
1546
- const d = (m, y) => {
1547
- const E = y ? `${m}${y}` : m;
1546
+ const u = (m, p) => {
1547
+ const E = p ? `${m}${p}` : m;
1548
1548
  window.location.href = E, e.widget.setState({
1549
1549
  isStoredFeedbackOpen: !1
1550
1550
  });
1551
1551
  }, h = (m) => {
1552
1552
  a() === m && e.methods.reset(), Ze(m);
1553
- const y = xe();
1554
- r(y), e.widget.setState({
1555
- pagesCount: y.length
1553
+ const p = ke();
1554
+ r(p), e.widget.setState({
1555
+ pagesCount: p.length
1556
1556
  });
1557
- }, g = (m) => {
1557
+ }, f = (m) => {
1558
1558
  if (m === "/") return "/";
1559
- const y = m.split("/");
1560
- return y.length <= 4 ? m : `/${y[1]}/.../${y[y.length - 1]}`;
1559
+ const p = m.split("/");
1560
+ return p.length <= 4 ? m : `/${p[1]}/.../${p[p.length - 1]}`;
1561
1561
  };
1562
- return f(D, {
1562
+ return g(D, {
1563
1563
  get when() {
1564
1564
  return e.widget.state.isStoredFeedbackOpen;
1565
1565
  },
1566
1566
  get children() {
1567
- var m = Wn(), y = m.firstChild;
1568
- y.firstChild;
1569
- var E = y.nextSibling, S = n;
1570
- return typeof S == "function" ? V(S, m) : n = m, v(y, f(W, {
1567
+ var m = _n(), p = m.firstChild;
1568
+ p.firstChild;
1569
+ var E = p.nextSibling, S = n;
1570
+ return typeof S == "function" ? V(S, m) : n = m, v(p, g(_, {
1571
1571
  variant: "secondary",
1572
1572
  size: "sm",
1573
1573
  onClick: () => e.widget.setState({
1574
1574
  isStoredFeedbackOpen: !1
1575
1575
  }),
1576
1576
  get children() {
1577
- return f(pe, {
1577
+ return g(xe, {
1578
1578
  size: 20
1579
1579
  });
1580
1580
  }
1581
- }), null), v(E, f(_, {
1581
+ }), null), v(E, g(W, {
1582
1582
  get each() {
1583
1583
  return t();
1584
1584
  },
1585
1585
  children: (C) => {
1586
- const p = k(() => C.path === a());
1586
+ const y = k(() => C.path === a());
1587
1587
  return (() => {
1588
- var P = _n(), z = P.firstChild, x = z.firstChild, H = x.nextSibling, q = z.nextSibling;
1589
- return v(x, () => g(C.path)), v(H, () => C.state.feedback.message), v(q, (() => {
1590
- var I = k(() => !p());
1591
- return () => I() && f(W, {
1588
+ var P = Wn(), z = P.firstChild, x = z.firstChild, H = x.nextSibling, q = z.nextSibling;
1589
+ return v(x, () => f(C.path)), v(H, () => C.state.feedback.message), v(q, (() => {
1590
+ var I = k(() => !y());
1591
+ return () => I() && g(_, {
1592
1592
  class: "echo-stored-feedback-link",
1593
1593
  variant: "secondary",
1594
1594
  size: "sm",
1595
- onClick: () => d(C.path, C.state.latestQuery),
1595
+ onClick: () => u(C.path, C.state.latestQuery),
1596
1596
  get children() {
1597
- return f(Vn, {});
1597
+ return g(Vn, {});
1598
1598
  }
1599
1599
  });
1600
- })(), null), v(q, f(W, {
1600
+ })(), null), v(q, g(_, {
1601
1601
  class: "echo-stored-feedback-delete",
1602
1602
  variant: "secondary",
1603
1603
  size: "sm",
1604
1604
  onClick: () => h(C.path),
1605
1605
  children: "Delete"
1606
1606
  }), null), b((I) => {
1607
- var Me = `echo-stored-feedback-item ${p() ? "echo-stored-feedback-item-current" : ""}`, Ae = C.path;
1608
- return Me !== I.e && Re(P, I.e = Me), Ae !== I.t && u(x, "title", I.t = Ae), I;
1607
+ var Me = `echo-stored-feedback-item ${y() ? "echo-stored-feedback-item-current" : ""}`, Ae = C.path;
1608
+ return Me !== I.e && Re(P, I.e = Me), Ae !== I.t && d(x, "title", I.t = Ae), I;
1609
1609
  }, {
1610
1610
  e: void 0,
1611
1611
  t: void 0
1612
1612
  }), P;
1613
1613
  })();
1614
1614
  }
1615
- }), null), v(E, f(D, {
1615
+ }), null), v(E, g(D, {
1616
1616
  get when() {
1617
1617
  return t().length === 0;
1618
1618
  },
@@ -1629,7 +1629,7 @@ const Rn = () => {
1629
1629
  let r;
1630
1630
  const a = () => {
1631
1631
  r && window.clearTimeout(r), r = window.setTimeout(() => {
1632
- const c = G("welcome_message_shown", !1);
1632
+ const c = K("welcome_message_shown", !1);
1633
1633
  !e.widget.state.isOpen && !e.widget.state.isStoredFeedbackOpen && c && t(!0);
1634
1634
  }, 4e3);
1635
1635
  }, o = () => {
@@ -1641,9 +1641,9 @@ const Rn = () => {
1641
1641
  isOpen: !e.widget.state.isOpen
1642
1642
  }), e.widget.setState({
1643
1643
  welcomeMessageIsClosing: !0
1644
- }), ie("welcome_message_shown", !0);
1644
+ }), se("welcome_message_shown", !0);
1645
1645
  };
1646
- Y(() => {
1646
+ ee(() => {
1647
1647
  e.widget.state.isOpen || (t(!1), a()), e.widget.state.isStoredFeedbackOpen && t(!1);
1648
1648
  });
1649
1649
  const s = (c) => {
@@ -1653,25 +1653,25 @@ const Rn = () => {
1653
1653
  };
1654
1654
  return [(() => {
1655
1655
  var c = Un();
1656
- return c.addEventListener("pointerleave", i), c.addEventListener("pointerenter", o), c.$$click = l, v(c, f(xn, {
1656
+ return c.addEventListener("pointerleave", i), c.addEventListener("pointerenter", o), c.$$click = l, v(c, g(xn, {
1657
1657
  stroke: "white",
1658
1658
  fill: "#ffffff",
1659
1659
  "aria-hidden": "true"
1660
1660
  }), null), v(c, (() => {
1661
- var d = k(() => e.widget.state.pagesCount > 0);
1662
- return () => d() && (() => {
1661
+ var u = k(() => e.widget.state.pagesCount > 0);
1662
+ return () => u() && (() => {
1663
1663
  var h = Yn();
1664
- return h.$$click = s, v(h, () => e.widget.state.pagesCount), b(() => u(h, "aria-label", `View ${e.widget.state.pagesCount} stored feedback items`)), h;
1664
+ return h.$$click = s, v(h, () => e.widget.state.pagesCount), b(() => d(h, "aria-label", `View ${e.widget.state.pagesCount} stored feedback items`)), h;
1665
1665
  })();
1666
- })(), null), b((d) => {
1667
- var h = e.widget.state.isOpen, g = `translateX(${n() ? "45px" : "0"})`, m = e.widget.state.isOpen;
1668
- return h !== d.e && u(c, "data-hidden", d.e = h), g !== d.t && ((d.t = g) != null ? c.style.setProperty("transform", g) : c.style.removeProperty("transform")), m !== d.a && u(c, "aria-expanded", d.a = m), d;
1666
+ })(), null), b((u) => {
1667
+ var h = e.widget.state.isOpen, f = `translateX(${n() ? "45px" : "0"})`, m = e.widget.state.isOpen;
1668
+ return h !== u.e && d(c, "data-hidden", u.e = h), f !== u.t && ((u.t = f) != null ? c.style.setProperty("transform", f) : c.style.removeProperty("transform")), m !== u.a && d(c, "aria-expanded", u.a = m), u;
1669
1669
  }, {
1670
1670
  e: void 0,
1671
1671
  t: void 0,
1672
1672
  a: void 0
1673
1673
  }), c;
1674
- })(), f(Hn, {})];
1674
+ })(), g(Hn, {})];
1675
1675
  };
1676
1676
  T(["click"]);
1677
1677
  var Kn = /* @__PURE__ */ w("<div class=echo-notification><div class=echo-notification-icon></div><div class=echo-notification-content><div class=echo-notification-title></div><div class=echo-notification-message>");
@@ -1695,7 +1695,7 @@ const Gn = () => {
1695
1695
  };
1696
1696
  return (() => {
1697
1697
  var r = Kn(), a = r.firstChild, o = a.nextSibling, i = o.firstChild, l = i.nextSibling;
1698
- return v(r, f(W, {
1698
+ return v(r, g(_, {
1699
1699
  class: "echo-notification-hide",
1700
1700
  variant: "secondary",
1701
1701
  size: "sm",
@@ -1704,17 +1704,17 @@ const Gn = () => {
1704
1704
  return e.widget.state.text.notification.hideTitle;
1705
1705
  },
1706
1706
  get children() {
1707
- return f(pe, {
1707
+ return g(xe, {
1708
1708
  size: 20
1709
1709
  });
1710
1710
  }
1711
1711
  }), a), v(a, (() => {
1712
1712
  var s = k(() => e.widget.state.notification.type === "success");
1713
- return () => s() ? f(zn, {
1713
+ return () => s() ? g(zn, {
1714
1714
  size: 32
1715
1715
  }) : (() => {
1716
1716
  var c = k(() => e.widget.state.notification.type === "error");
1717
- return () => c() ? f(In, {
1717
+ return () => c() ? g(In, {
1718
1718
  size: 32
1719
1719
  }) : null;
1720
1720
  })();
@@ -1722,8 +1722,8 @@ const Gn = () => {
1722
1722
  var s;
1723
1723
  return (s = e.widget.state.notification) == null ? void 0 : s.message;
1724
1724
  }), b((s) => {
1725
- var c = e.widget.state.notification.type, d = !e.widget.state.notification.type, h = !e.widget.state.notification.show;
1726
- return c !== s.e && u(r, "data-type", s.e = c), d !== s.t && u(r, "data-empty", s.t = d), h !== s.a && u(r, "data-hidden", s.a = h), s;
1725
+ var c = e.widget.state.notification.type, u = !e.widget.state.notification.type, h = !e.widget.state.notification.show;
1726
+ return c !== s.e && d(r, "data-type", s.e = c), u !== s.t && d(r, "data-empty", s.t = u), h !== s.a && d(r, "data-hidden", s.a = h), s;
1727
1727
  }, {
1728
1728
  e: void 0,
1729
1729
  t: void 0,
@@ -1756,43 +1756,43 @@ const Jn = () => {
1756
1756
  }, i = k(() => e.drawing.state.selectedShapeId ? e.drawing.state.shapes.find((s) => s.id === e.drawing.state.selectedShapeId) : null), l = k(() => {
1757
1757
  const s = i(), c = n == null ? void 0 : n.getBoundingClientRect();
1758
1758
  if (!s || !c) return null;
1759
- let d = null;
1759
+ let u = null;
1760
1760
  if (s.type === "rectangle") {
1761
1761
  const m = ot(s.points);
1762
1762
  if (!m) return null;
1763
- d = {
1763
+ u = {
1764
1764
  x: m.x + m.width / 2,
1765
1765
  y: m.y
1766
1766
  };
1767
1767
  } else if (s.type === "path" && s.points.length > 0)
1768
- d = {
1768
+ u = {
1769
1769
  x: s.points[0].x,
1770
1770
  y: s.points[0].y
1771
1771
  };
1772
1772
  else
1773
1773
  return null;
1774
- const h = 8, g = t();
1774
+ const h = 8, f = t();
1775
1775
  return {
1776
- x: Math.max(c.width / 2 + h, Math.min(window.innerWidth - c.width / 2 - h, d.x - g.x)),
1777
- y: Math.max(c.height + h, Math.min(window.innerHeight - h, d.y - g.y))
1776
+ x: Math.max(c.width / 2 + h, Math.min(window.innerWidth - c.width / 2 - h, u.x - f.x)),
1777
+ y: Math.max(c.height + h, Math.min(window.innerHeight - h, u.y - f.y))
1778
1778
  };
1779
1779
  });
1780
1780
  return (() => {
1781
1781
  var s = Xn(), c = n;
1782
- return typeof c == "function" ? V(c, s) : n = s, s.style.setProperty("top", "0"), s.style.setProperty("left", "0"), v(s, f(W, {
1782
+ return typeof c == "function" ? V(c, s) : n = s, s.style.setProperty("top", "0"), s.style.setProperty("left", "0"), v(s, g(_, {
1783
1783
  onClick: o,
1784
1784
  size: "sm",
1785
1785
  variant: "secondary",
1786
1786
  title: "Delete shape",
1787
1787
  get children() {
1788
- return f(it, {
1788
+ return g(it, {
1789
1789
  size: 20
1790
1790
  });
1791
1791
  }
1792
- })), b((d) => {
1793
- var m, y;
1794
- var h = !l(), g = `translate(calc(${(m = l()) == null ? void 0 : m.x}px - 50%), calc(${(y = l()) == null ? void 0 : y.y}px - 125%))`;
1795
- return h !== d.e && (s.hidden = d.e = h), g !== d.t && ((d.t = g) != null ? s.style.setProperty("transform", g) : s.style.removeProperty("transform")), d;
1792
+ })), b((u) => {
1793
+ var m, p;
1794
+ var h = !l(), f = `translate(calc(${(m = l()) == null ? void 0 : m.x}px - 50%), calc(${(p = l()) == null ? void 0 : p.y}px - 125%))`;
1795
+ return h !== u.e && (s.hidden = u.e = h), f !== u.t && ((u.t = f) != null ? s.style.setProperty("transform", f) : s.style.removeProperty("transform")), u;
1796
1796
  }, {
1797
1797
  e: void 0,
1798
1798
  t: void 0
@@ -1801,25 +1801,25 @@ const Jn = () => {
1801
1801
  };
1802
1802
  var Zn = /* @__PURE__ */ w("<button class=echo-welcome-message><span class=echo-welcome-message-pulsar></span><div class=echo-welcome-message-close role=button tabindex=0>");
1803
1803
  const Qn = () => {
1804
- const e = $(), n = G("welcome_message_shown", !1), t = (a) => {
1804
+ const e = $(), n = K("welcome_message_shown", !1), t = (a) => {
1805
1805
  a.stopPropagation(), e.widget.setState({
1806
1806
  welcomeMessageIsClosing: !0
1807
- }), ie("welcome_message_shown", !0);
1807
+ }), se("welcome_message_shown", !0);
1808
1808
  }, r = () => {
1809
1809
  e.widget.setState({
1810
1810
  isOpen: !0
1811
1811
  }), e.widget.setState({
1812
1812
  welcomeMessageIsClosing: !0
1813
- }), ie("welcome_message_shown", !0);
1813
+ }), se("welcome_message_shown", !0);
1814
1814
  };
1815
1815
  return n ? null : (() => {
1816
1816
  var a = Zn(), o = a.firstChild, i = o.nextSibling;
1817
- return a.$$click = r, a.style.setProperty("bottom", "80px"), a.style.setProperty("right", "20px"), v(a, () => e.widget.state.text.welcomeMessage.text, i), i.$$keydown = (l) => l.key === "Enter" && t(l), i.$$click = t, v(i, f(pe, {
1817
+ return a.$$click = r, a.style.setProperty("bottom", "80px"), a.style.setProperty("right", "20px"), v(a, () => e.widget.state.text.welcomeMessage.text, i), i.$$keydown = (l) => l.key === "Enter" && t(l), i.$$click = t, v(i, g(xe, {
1818
1818
  size: 16,
1819
1819
  strokeWidth: 3
1820
1820
  })), b((l) => {
1821
1821
  var s = e.widget.state.welcomeMessageIsClosing, c = e.widget.state.text.welcomeMessage.closeAriaLabel;
1822
- return s !== l.e && u(a, "data-hidden", l.e = s), c !== l.t && u(i, "aria-label", l.t = c), l;
1822
+ return s !== l.e && d(a, "data-hidden", l.e = s), c !== l.t && d(i, "aria-label", l.t = c), l;
1823
1823
  }, {
1824
1824
  e: void 0,
1825
1825
  t: void 0
@@ -1830,23 +1830,23 @@ T(["click", "keydown"]);
1830
1830
  var er = /* @__PURE__ */ w("<svg><rect class=echo-shape fill=transparent vector-effect=non-scaling-stroke role=img></svg>", !1, !0), tr = /* @__PURE__ */ w("<svg><path class=echo-shape fill=none vector-effect=non-scaling-stroke stroke-linecap=round role=img></svg>", !1, !0);
1831
1831
  const He = (e) => {
1832
1832
  const n = k(() => e.id === e.selectedShapeId);
1833
- return [f(D, {
1833
+ return [g(D, {
1834
1834
  get when() {
1835
1835
  return e.type === "rectangle";
1836
1836
  },
1837
1837
  get children() {
1838
- return f(nr, ge(e, {
1838
+ return g(nr, ae(e, {
1839
1839
  get isSelected() {
1840
1840
  return n();
1841
1841
  }
1842
1842
  }));
1843
1843
  }
1844
- }), f(D, {
1844
+ }), g(D, {
1845
1845
  get when() {
1846
1846
  return e.type === "path";
1847
1847
  },
1848
1848
  get children() {
1849
- return f(rr, ge(e, {
1849
+ return g(rr, ae(e, {
1850
1850
  get isSelected() {
1851
1851
  return n();
1852
1852
  }
@@ -1855,7 +1855,7 @@ const He = (e) => {
1855
1855
  })];
1856
1856
  }, nr = (e) => {
1857
1857
  const n = k(() => ot(e.points));
1858
- return f(D, {
1858
+ return g(D, {
1859
1859
  get when() {
1860
1860
  return n();
1861
1861
  },
@@ -1868,8 +1868,8 @@ const He = (e) => {
1868
1868
  var r;
1869
1869
  return (r = e.onShapeClick) == null ? void 0 : r.call(e, e.id);
1870
1870
  }, b((r) => {
1871
- var a = e.id, o = e.isSelected, i = n().x, l = n().y, s = n().width, c = n().height, d = e.color, h = B.rectangle.strokeWidth, g = e.isSelected ? B.rectangle.opacity.selected : B.rectangle.opacity.default, m = e.isSelected ? "5,5" : "none", y = e.isSelected ? "move" : "pointer", E = `Rectangle shape ${e.isSelected ? "(selected)" : ""}`, S = e.onShapeClick ? 0 : -1;
1872
- return a !== r.e && u(t, "data-shape-id", r.e = a), o !== r.t && u(t, "data-selected", r.t = o), i !== r.a && u(t, "x", r.a = i), l !== r.o && u(t, "y", r.o = l), s !== r.i && u(t, "width", r.i = s), c !== r.n && u(t, "height", r.n = c), d !== r.s && u(t, "stroke", r.s = d), h !== r.h && u(t, "stroke-width", r.h = h), g !== r.r && u(t, "opacity", r.r = g), m !== r.d && u(t, "stroke-dasharray", r.d = m), y !== r.l && u(t, "cursor", r.l = y), E !== r.u && u(t, "aria-label", r.u = E), S !== r.c && u(t, "tabindex", r.c = S), r;
1871
+ var a = e.id, o = e.isSelected, i = n().x, l = n().y, s = n().width, c = n().height, u = e.color, h = B.rectangle.strokeWidth, f = e.isSelected ? B.rectangle.opacity.selected : B.rectangle.opacity.default, m = e.isSelected ? "5,5" : "none", p = e.isSelected ? "move" : "pointer", E = `Rectangle shape ${e.isSelected ? "(selected)" : ""}`, S = e.onShapeClick ? 0 : -1;
1872
+ return a !== r.e && d(t, "data-shape-id", r.e = a), o !== r.t && d(t, "data-selected", r.t = o), i !== r.a && d(t, "x", r.a = i), l !== r.o && d(t, "y", r.o = l), s !== r.i && d(t, "width", r.i = s), c !== r.n && d(t, "height", r.n = c), u !== r.s && d(t, "stroke", r.s = u), h !== r.h && d(t, "stroke-width", r.h = h), f !== r.r && d(t, "opacity", r.r = f), m !== r.d && d(t, "stroke-dasharray", r.d = m), p !== r.l && d(t, "cursor", r.l = p), E !== r.u && d(t, "aria-label", r.u = E), S !== r.c && d(t, "tabindex", r.c = S), r;
1873
1873
  }, {
1874
1874
  e: void 0,
1875
1875
  t: void 0,
@@ -1889,7 +1889,7 @@ const He = (e) => {
1889
1889
  });
1890
1890
  }, rr = (e) => {
1891
1891
  const n = k(() => Kt(e.points));
1892
- return f(D, {
1892
+ return g(D, {
1893
1893
  get when() {
1894
1894
  return n();
1895
1895
  },
@@ -1902,8 +1902,8 @@ const He = (e) => {
1902
1902
  var r;
1903
1903
  return (r = e.onShapeClick) == null ? void 0 : r.call(e, e.id);
1904
1904
  }, b((r) => {
1905
- var a = e.id, o = e.isSelected, i = n(), l = e.color, s = B.path.strokeWidth, c = e.isSelected ? B.path.opacity.selected : B.path.opacity.default, d = e.isSelected ? "move" : "pointer", h = `Freehand shape ${e.isSelected ? "(selected)" : ""}`, g = e.onShapeClick ? 0 : -1;
1906
- return a !== r.e && u(t, "data-shape-id", r.e = a), o !== r.t && u(t, "data-selected", r.t = o), i !== r.a && u(t, "d", r.a = i), l !== r.o && u(t, "stroke", r.o = l), s !== r.i && u(t, "stroke-width", r.i = s), c !== r.n && u(t, "opacity", r.n = c), d !== r.s && u(t, "cursor", r.s = d), h !== r.h && u(t, "aria-label", r.h = h), g !== r.r && u(t, "tabindex", r.r = g), r;
1905
+ var a = e.id, o = e.isSelected, i = n(), l = e.color, s = B.path.strokeWidth, c = e.isSelected ? B.path.opacity.selected : B.path.opacity.default, u = e.isSelected ? "move" : "pointer", h = `Freehand shape ${e.isSelected ? "(selected)" : ""}`, f = e.onShapeClick ? 0 : -1;
1906
+ return a !== r.e && d(t, "data-shape-id", r.e = a), o !== r.t && d(t, "data-selected", r.t = o), i !== r.a && d(t, "d", r.a = i), l !== r.o && d(t, "stroke", r.o = l), s !== r.i && d(t, "stroke-width", r.i = s), c !== r.n && d(t, "opacity", r.n = c), u !== r.s && d(t, "cursor", r.s = u), h !== r.h && d(t, "aria-label", r.h = h), f !== r.r && d(t, "tabindex", r.r = f), r;
1907
1907
  }, {
1908
1908
  e: void 0,
1909
1909
  t: void 0,
@@ -1927,11 +1927,11 @@ const ar = () => {
1927
1927
  n == null || n.addEventListener("mousemove", e.drawing.methods.handleMove), n == null || n.addEventListener("mouseup", e.drawing.methods.handleEnd), n == null || n.addEventListener("touchmove", e.drawing.methods.handleMove, {
1928
1928
  passive: !1
1929
1929
  }), n == null || n.addEventListener("touchend", e.drawing.methods.handleEnd);
1930
- }), ee(() => {
1930
+ }), te(() => {
1931
1931
  n == null || n.removeEventListener("mousemove", e.drawing.methods.handleMove), n == null || n.removeEventListener("mouseup", e.drawing.methods.handleEnd), n == null || n.removeEventListener("touchmove", e.drawing.methods.handleMove), n == null || n.removeEventListener("touchend", e.drawing.methods.handleEnd);
1932
1932
  }), (() => {
1933
1933
  var t = or(), r = t.firstChild, a = r.firstChild, o = n;
1934
- return typeof o == "function" ? V(o, t) : n = t, v(t, f(jn, {}), r), v(t, f(Jn, {}), r), U(r, "touchend", e.drawing.methods.handleLeave, !0), U(r, "mouseleave", e.drawing.methods.handleLeave), U(r, "mouseenter", e.drawing.methods.handleEnter), r.$$touchmove = (i) => {
1934
+ return typeof o == "function" ? V(o, t) : n = t, v(t, g(jn, {}), r), v(t, g(Jn, {}), r), U(r, "touchend", e.drawing.methods.handleLeave, !0), U(r, "mouseleave", e.drawing.methods.handleLeave), U(r, "mouseenter", e.drawing.methods.handleEnter), r.$$touchmove = (i) => {
1935
1935
  i.preventDefault(), e.drawing.methods.handleMove(i);
1936
1936
  }, U(r, "mousemove", e.drawing.methods.handleMove, !0), r.$$touchstart = (i) => {
1937
1937
  i.preventDefault(), e.drawing.methods.handleStart(i), e.drawing.methods.handleEnter(i), e.drawing.setState({
@@ -1943,11 +1943,11 @@ const ar = () => {
1943
1943
  showTooltip: !1,
1944
1944
  hasDrawn: !0
1945
1945
  });
1946
- }, v(r, f(_, {
1946
+ }, v(r, g(W, {
1947
1947
  get each() {
1948
1948
  return e.drawing.state.shapes;
1949
1949
  },
1950
- children: (i) => f(He, {
1950
+ children: (i) => g(He, {
1951
1951
  get id() {
1952
1952
  return i.id;
1953
1953
  },
@@ -1967,7 +1967,7 @@ const ar = () => {
1967
1967
  return e.drawing.methods.handleShapeClick;
1968
1968
  }
1969
1969
  })
1970
- }), null), v(r, f(He, {
1970
+ }), null), v(r, g(He, {
1971
1971
  id: "temp",
1972
1972
  get type() {
1973
1973
  return e.drawing.state.selectedTool;
@@ -1986,7 +1986,7 @@ const ar = () => {
1986
1986
  width: e.widget.state.dimensions.width,
1987
1987
  height: e.widget.state.dimensions.height
1988
1988
  }, e.drawing.state.currentPoints, e.drawing.state.shapes);
1989
- return l !== i.e && ((i.e = l) != null ? t.style.setProperty("cursor", l) : t.style.removeProperty("cursor")), s !== i.t && u(a, "d", i.t = s), i;
1989
+ return l !== i.e && ((i.e = l) != null ? t.style.setProperty("cursor", l) : t.style.removeProperty("cursor")), s !== i.t && d(a, "d", i.t = s), i;
1990
1990
  }, {
1991
1991
  e: void 0,
1992
1992
  t: void 0
@@ -1994,7 +1994,7 @@ const ar = () => {
1994
1994
  })();
1995
1995
  };
1996
1996
  T(["mousedown", "touchstart", "mousemove", "touchmove", "touchend"]);
1997
- const de = (e) => ({
1997
+ const ue = (e) => ({
1998
1998
  handleTextChange: (o) => {
1999
1999
  const i = o.target;
2000
2000
  e(i.value);
@@ -2009,7 +2009,7 @@ const de = (e) => ({
2009
2009
  getCheckboxValue: (o) => Array.isArray(o) ? o : []
2010
2010
  });
2011
2011
  var ir = /* @__PURE__ */ w("<div class=echo-input role=group>"), sr = /* @__PURE__ */ w("<label class=echo-input-label><span>"), lr = /* @__PURE__ */ w('<span class=echo-input-required aria-label="Required field">*');
2012
- const ue = (e) => (() => {
2012
+ const he = (e) => (() => {
2013
2013
  var n = ir();
2014
2014
  return v(n, (() => {
2015
2015
  var t = k(() => !!e.label);
@@ -2026,8 +2026,8 @@ var cr = /* @__PURE__ */ w("<textarea class=echo-input-field rows=5>"), dr = /*
2026
2026
  const st = (e) => {
2027
2027
  const {
2028
2028
  handleTextChange: n
2029
- } = de(e.onChange);
2030
- return f(ue, {
2029
+ } = ue(e.onChange);
2030
+ return g(he, {
2031
2031
  get label() {
2032
2032
  return e.config.label;
2033
2033
  },
@@ -2038,8 +2038,8 @@ const st = (e) => {
2038
2038
  return [(() => {
2039
2039
  var t = cr();
2040
2040
  return U(t, "input", n, !0), b((r) => {
2041
- var a = e.config.id, o = e.config.placeholder, i = e.config.required, l = e.config.label || e.config.placeholder, s = e.config.required, c = e.value === "", d = `${e.config.id}-description`;
2042
- return a !== r.e && u(t, "id", r.e = a), o !== r.t && u(t, "placeholder", r.t = o), i !== r.a && (t.required = r.a = i), l !== r.o && u(t, "aria-label", r.o = l), s !== r.i && u(t, "aria-required", r.i = s), c !== r.n && u(t, "aria-invalid", r.n = c), d !== r.s && u(t, "aria-describedby", r.s = d), r;
2041
+ var a = e.config.id, o = e.config.placeholder, i = e.config.required, l = e.config.label || e.config.placeholder, s = e.config.required, c = e.value === "", u = `${e.config.id}-description`;
2042
+ return a !== r.e && d(t, "id", r.e = a), o !== r.t && d(t, "placeholder", r.t = o), i !== r.a && (t.required = r.a = i), l !== r.o && d(t, "aria-label", r.o = l), s !== r.i && d(t, "aria-required", r.i = s), c !== r.n && d(t, "aria-invalid", r.n = c), u !== r.s && d(t, "aria-describedby", r.s = u), r;
2043
2043
  }, {
2044
2044
  e: void 0,
2045
2045
  t: void 0,
@@ -2051,19 +2051,19 @@ const st = (e) => {
2051
2051
  }), b(() => t.value = e.value === void 0 ? "" : e.value), t;
2052
2052
  })(), (() => {
2053
2053
  var t = dr();
2054
- return v(t, () => e.config.placeholder), b(() => u(t, "id", `${e.config.id}-description`)), t;
2054
+ return v(t, () => e.config.placeholder), b(() => d(t, "id", `${e.config.id}-description`)), t;
2055
2055
  })()];
2056
2056
  }
2057
2057
  });
2058
2058
  };
2059
2059
  T(["input"]);
2060
2060
  var ur = /* @__PURE__ */ w("<fieldset class=echo-input-options role=group>"), hr = /* @__PURE__ */ w("<label class=echo-input-option><input type=checkbox><span>");
2061
- const fr = (e) => {
2061
+ const gr = (e) => {
2062
2062
  const {
2063
2063
  handleCheckboxChange: n,
2064
2064
  getCheckboxValue: t
2065
- } = de(e.onChange), r = () => t(e.value), a = () => r().length > 0;
2066
- return f(ue, {
2065
+ } = ue(e.onChange), r = () => t(e.value), a = () => r().length > 0;
2066
+ return g(he, {
2067
2067
  get label() {
2068
2068
  return e.config.label;
2069
2069
  },
@@ -2072,24 +2072,24 @@ const fr = (e) => {
2072
2072
  },
2073
2073
  get children() {
2074
2074
  var o = ur();
2075
- return v(o, f(_, {
2075
+ return v(o, g(W, {
2076
2076
  get each() {
2077
2077
  return e.config.options;
2078
2078
  },
2079
2079
  children: (i, l) => (() => {
2080
- var s = hr(), c = s.firstChild, d = c.nextSibling;
2081
- return c.addEventListener("change", (h) => n(r(), i.value, h.currentTarget.checked)), v(d, () => i.label), b(() => c.required = e.config.required && !a() && l() === 0), b(() => c.value = i.value), b(() => c.checked = r().includes(i.value)), s;
2080
+ var s = hr(), c = s.firstChild, u = c.nextSibling;
2081
+ return c.addEventListener("change", (h) => n(r(), i.value, h.currentTarget.checked)), v(u, () => i.label), b(() => c.required = e.config.required && !a() && l() === 0), b(() => c.value = i.value), b(() => c.checked = r().includes(i.value)), s;
2082
2082
  })()
2083
- })), b(() => u(o, "aria-required", e.config.required)), o;
2083
+ })), b(() => d(o, "aria-required", e.config.required)), o;
2084
2084
  }
2085
2085
  });
2086
2086
  };
2087
- var gr = /* @__PURE__ */ w("<fieldset class=echo-input-options role=radiogroup>"), mr = /* @__PURE__ */ w("<label class=echo-input-option><input type=radio><span>");
2087
+ var fr = /* @__PURE__ */ w("<fieldset class=echo-input-options role=radiogroup>"), mr = /* @__PURE__ */ w("<label class=echo-input-option><input type=radio><span>");
2088
2088
  const vr = (e) => {
2089
2089
  const {
2090
2090
  handleSelectChange: n
2091
- } = de(e.onChange);
2092
- return f(ue, {
2091
+ } = ue(e.onChange);
2092
+ return g(he, {
2093
2093
  get label() {
2094
2094
  return e.config.label;
2095
2095
  },
@@ -2097,8 +2097,8 @@ const vr = (e) => {
2097
2097
  return e.config.required;
2098
2098
  },
2099
2099
  get children() {
2100
- var t = gr();
2101
- return v(t, f(_, {
2100
+ var t = fr();
2101
+ return v(t, g(W, {
2102
2102
  get each() {
2103
2103
  return e.config.options;
2104
2104
  },
@@ -2106,24 +2106,24 @@ const vr = (e) => {
2106
2106
  var a = mr(), o = a.firstChild, i = o.nextSibling;
2107
2107
  return o.addEventListener("change", () => n(r.value)), v(i, () => r.label), b((l) => {
2108
2108
  var s = e.config.id, c = e.config.required;
2109
- return s !== l.e && u(o, "name", l.e = s), c !== l.t && (o.required = l.t = c), l;
2109
+ return s !== l.e && d(o, "name", l.e = s), c !== l.t && (o.required = l.t = c), l;
2110
2110
  }, {
2111
2111
  e: void 0,
2112
2112
  t: void 0
2113
2113
  }), b(() => o.value = r.value), b(() => o.checked = e.value === r.value), a;
2114
2114
  })()
2115
- })), b(() => u(t, "aria-required", e.config.required)), t;
2115
+ })), b(() => d(t, "aria-required", e.config.required)), t;
2116
2116
  }
2117
2117
  });
2118
2118
  };
2119
- var br = /* @__PURE__ */ w("<div class=echo-select-dropdown role=listbox>"), wr = /* @__PURE__ */ w('<div class=echo-select><button type=button class=echo-select-trigger aria-haspopup=listbox><span></span><svg class=echo-select-arrow width=16 height=16 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="m6 9 6 6 6-6"></path></svg></button><input type=text class=visually-hidden aria-hidden=true>'), yr = /* @__PURE__ */ w("<button type=button class=echo-select-option role=option>");
2120
- const pr = (e) => {
2119
+ var br = /* @__PURE__ */ w("<div class=echo-select-dropdown role=listbox>"), wr = /* @__PURE__ */ w('<div class=echo-select><button type=button class=echo-select-trigger aria-haspopup=listbox><span></span><svg class=echo-select-arrow width=16 height=16 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><path d="m6 9 6 6 6-6"></path></svg></button><input type=text class=visually-hidden aria-hidden=true>'), pr = /* @__PURE__ */ w("<button type=button class=echo-select-option role=option>");
2120
+ const yr = (e) => {
2121
2121
  const {
2122
2122
  handleSelectChange: n
2123
- } = de(e.onChange), [t, r] = A(!1);
2123
+ } = ue(e.onChange), [t, r] = A(!1);
2124
2124
  let a, o, i;
2125
- const l = () => e.config.options.find((h) => h.value === (e.value === void 0 ? "" : e.value)), s = (h, g) => {
2126
- g.stopPropagation(), h.value === e.value ? e.config.required || n("") : n(h.value), r(!1);
2125
+ const l = () => e.config.options.find((h) => h.value === (e.value === void 0 ? "" : e.value)), s = (h, f) => {
2126
+ f.stopPropagation(), h.value === e.value ? e.config.required || n("") : n(h.value), r(!1);
2127
2127
  }, c = () => {
2128
2128
  r(!t());
2129
2129
  };
@@ -2133,7 +2133,7 @@ const pr = (e) => {
2133
2133
  if (!t() || !a) return;
2134
2134
  h.composedPath().includes(a) || r(!1);
2135
2135
  }
2136
- }), f(ue, {
2136
+ }), g(he, {
2137
2137
  get label() {
2138
2138
  return e.config.label;
2139
2139
  },
@@ -2141,41 +2141,41 @@ const pr = (e) => {
2141
2141
  return e.config.required;
2142
2142
  },
2143
2143
  get children() {
2144
- var h = wr(), g = h.firstChild, m = g.firstChild, y = g.nextSibling, E = a;
2145
- typeof E == "function" ? V(E, h) : a = h, g.$$click = (p) => {
2146
- p.stopPropagation(), c();
2144
+ var h = wr(), f = h.firstChild, m = f.firstChild, p = f.nextSibling, E = a;
2145
+ typeof E == "function" ? V(E, h) : a = h, f.$$click = (y) => {
2146
+ y.stopPropagation(), c();
2147
2147
  };
2148
2148
  var S = o;
2149
- typeof S == "function" ? V(S, g) : o = g, v(m, () => {
2150
- var p;
2151
- return ((p = l()) == null ? void 0 : p.label) || e.config.placeholder;
2152
- }), v(h, f(D, {
2149
+ typeof S == "function" ? V(S, f) : o = f, v(m, () => {
2150
+ var y;
2151
+ return ((y = l()) == null ? void 0 : y.label) || e.config.placeholder;
2152
+ }), v(h, g(D, {
2153
2153
  get when() {
2154
2154
  return t();
2155
2155
  },
2156
2156
  get children() {
2157
- var p = br();
2158
- return v(p, f(_, {
2157
+ var y = br();
2158
+ return v(y, g(W, {
2159
2159
  get each() {
2160
2160
  return e.config.options;
2161
2161
  },
2162
2162
  children: (P) => (() => {
2163
- var z = yr();
2163
+ var z = pr();
2164
2164
  return z.$$click = (x) => s(P, x), v(z, () => P.label), b((x) => {
2165
2165
  var H = P.value === e.value, q = P.value === e.value;
2166
- return H !== x.e && u(z, "aria-selected", x.e = H), q !== x.t && u(z, "data-selected", x.t = q), x;
2166
+ return H !== x.e && d(z, "aria-selected", x.e = H), q !== x.t && d(z, "data-selected", x.t = q), x;
2167
2167
  }, {
2168
2168
  e: void 0,
2169
2169
  t: void 0
2170
2170
  }), z;
2171
2171
  })()
2172
- })), p;
2172
+ })), y;
2173
2173
  }
2174
- }), y);
2174
+ }), p);
2175
2175
  var C = i;
2176
- return typeof C == "function" ? V(C, y) : i = y, b((p) => {
2176
+ return typeof C == "function" ? V(C, p) : i = p, b((y) => {
2177
2177
  var P = t(), z = !e.value, x = e.config.required, H = t(), q = e.config.required, I = e.config.required;
2178
- return P !== p.e && u(g, "data-open", p.e = P), z !== p.t && u(g, "data-placeholder", p.t = z), x !== p.a && u(g, "data-required", p.a = x), H !== p.o && u(g, "aria-expanded", p.o = H), q !== p.i && u(g, "aria-required", p.i = q), I !== p.n && (y.required = p.n = I), p;
2178
+ return P !== y.e && d(f, "data-open", y.e = P), z !== y.t && d(f, "data-placeholder", y.t = z), x !== y.a && d(f, "data-required", y.a = x), H !== y.o && d(f, "aria-expanded", y.o = H), q !== y.i && d(f, "aria-required", y.i = q), I !== y.n && (p.required = y.n = I), y;
2179
2179
  }, {
2180
2180
  e: void 0,
2181
2181
  t: void 0,
@@ -2183,7 +2183,7 @@ const pr = (e) => {
2183
2183
  o: void 0,
2184
2184
  i: void 0,
2185
2185
  n: void 0
2186
- }), b(() => y.value = e.value === void 0 ? "" : e.value), h;
2186
+ }), b(() => p.value = e.value === void 0 ? "" : e.value), h;
2187
2187
  }
2188
2188
  });
2189
2189
  };
@@ -2192,8 +2192,8 @@ var xr = /* @__PURE__ */ w("<input type=text class=echo-input-field>");
2192
2192
  const kr = (e) => {
2193
2193
  const {
2194
2194
  handleTextChange: n
2195
- } = de(e.onChange);
2196
- return f(ue, {
2195
+ } = ue(e.onChange);
2196
+ return g(he, {
2197
2197
  get label() {
2198
2198
  return e.config.label;
2199
2199
  },
@@ -2203,18 +2203,19 @@ const kr = (e) => {
2203
2203
  get children() {
2204
2204
  var t = xr();
2205
2205
  return U(t, "input", n, !0), b((r) => {
2206
- var a = e.config.placeholder, o = e.config.required;
2207
- return a !== r.e && u(t, "placeholder", r.e = a), o !== r.t && (t.required = r.t = o), r;
2206
+ var a = e.config.placeholder, o = e.config.required, i = e.config.disabled;
2207
+ return a !== r.e && d(t, "placeholder", r.e = a), o !== r.t && (t.required = r.t = o), i !== r.a && (t.disabled = r.a = i), r;
2208
2208
  }, {
2209
2209
  e: void 0,
2210
- t: void 0
2210
+ t: void 0,
2211
+ a: void 0
2211
2212
  }), b(() => t.value = e.value === void 0 ? "" : e.value), t;
2212
2213
  }
2213
2214
  });
2214
2215
  };
2215
2216
  T(["input"]);
2216
2217
  var Sr = /* @__PURE__ */ w("<div class=echo-input-error>Invalid input type"), Cr = /* @__PURE__ */ w("<div class=echo-input-error>Unsupported input type: ");
2217
- const $r = (e) => f(D, {
2218
+ const $r = (e) => g(D, {
2218
2219
  get when() {
2219
2220
  return e.config.type;
2220
2221
  },
@@ -2223,7 +2224,7 @@ const $r = (e) => f(D, {
2223
2224
  return Sr();
2224
2225
  },
2225
2226
  get children() {
2226
- return f(ht, {
2227
+ return g(ht, {
2227
2228
  get fallback() {
2228
2229
  return (() => {
2229
2230
  var n = Cr();
@@ -2231,29 +2232,26 @@ const $r = (e) => f(D, {
2231
2232
  })();
2232
2233
  },
2233
2234
  get children() {
2234
- return [f(te, {
2235
+ return [g(ne, {
2235
2236
  get when() {
2236
2237
  return e.config.type === "text";
2237
2238
  },
2238
2239
  get children() {
2239
- return f(kr, {
2240
- get config() {
2241
- return e.config;
2242
- },
2240
+ return g(kr, ae(e, {
2243
2241
  get value() {
2244
2242
  return e.value;
2245
2243
  },
2246
- get onChange() {
2247
- return e.onChange;
2244
+ get config() {
2245
+ return e.config;
2248
2246
  }
2249
- });
2247
+ }));
2250
2248
  }
2251
- }), f(te, {
2249
+ }), g(ne, {
2252
2250
  get when() {
2253
2251
  return e.config.type === "textarea";
2254
2252
  },
2255
2253
  get children() {
2256
- return f(st, {
2254
+ return g(st, {
2257
2255
  get config() {
2258
2256
  return e.config;
2259
2257
  },
@@ -2265,12 +2263,12 @@ const $r = (e) => f(D, {
2265
2263
  }
2266
2264
  });
2267
2265
  }
2268
- }), f(te, {
2266
+ }), g(ne, {
2269
2267
  get when() {
2270
2268
  return e.config.type === "radio";
2271
2269
  },
2272
2270
  get children() {
2273
- return f(vr, {
2271
+ return g(vr, {
2274
2272
  get config() {
2275
2273
  return e.config;
2276
2274
  },
@@ -2282,12 +2280,12 @@ const $r = (e) => f(D, {
2282
2280
  }
2283
2281
  });
2284
2282
  }
2285
- }), f(te, {
2283
+ }), g(ne, {
2286
2284
  get when() {
2287
2285
  return e.config.type === "checkbox";
2288
2286
  },
2289
2287
  get children() {
2290
- return f(fr, {
2288
+ return g(gr, {
2291
2289
  get config() {
2292
2290
  return e.config;
2293
2291
  },
@@ -2299,12 +2297,12 @@ const $r = (e) => f(D, {
2299
2297
  }
2300
2298
  });
2301
2299
  }
2302
- }), f(te, {
2300
+ }), g(ne, {
2303
2301
  get when() {
2304
2302
  return e.config.type === "select";
2305
2303
  },
2306
2304
  get children() {
2307
- return f(pr, {
2305
+ return g(yr, {
2308
2306
  get config() {
2309
2307
  return e.config;
2310
2308
  },
@@ -2365,7 +2363,7 @@ const $r = (e) => f(D, {
2365
2363
  timeInfo: Tr(),
2366
2364
  console: Yt()
2367
2365
  });
2368
- var Or = /* @__PURE__ */ w("<fieldset class=echo-input-options><legend class=visually-hidden>Additional Information"), Mr = /* @__PURE__ */ w('<section class=echo-feedback data-hide-when-drawing=true role=dialog aria-label="Feedback Form"><form class=echo-feedback-content aria-label="Submit Feedback"><header class=echo-feedback-header><h3 class=echo-feedback-title id=feedback-form-title></h3><div class=echo-feedback-header-actions role=toolbar aria-label="Form controls"></div></header><fieldset class=echo-input-options><legend class=visually-hidden>Feedback Message');
2366
+ var Or = /* @__PURE__ */ w("<fieldset class=echo-input-options-wrapper><legend class=visually-hidden>Additional Information"), Mr = /* @__PURE__ */ w('<section class=echo-feedback data-hide-when-drawing=true role=dialog aria-label="Feedback Form"><form class=echo-feedback-content aria-label="Submit Feedback"><header class=echo-feedback-header><h3 class=echo-feedback-title id=feedback-form-title></h3><div class=echo-feedback-header-actions role=toolbar aria-label="Form controls"></div></header><fieldset class=echo-input-options-wrapper><legend class=visually-hidden>Feedback Message</legend></fieldset><footer class=echo-feedback-footer>');
2369
2367
  const Ar = () => {
2370
2368
  const e = $(), n = async (a) => {
2371
2369
  a.preventDefault();
@@ -2385,14 +2383,16 @@ const Ar = () => {
2385
2383
  isMinimized: !1
2386
2384
  });
2387
2385
  };
2388
- return Y(() => {
2386
+ return ee(() => {
2389
2387
  e.widget.state.isOpen && requestAnimationFrame(() => {
2390
2388
  var a;
2391
2389
  (a = document.querySelector(".echo-input-field")) == null || a.focus();
2392
2390
  });
2393
2391
  }), (() => {
2394
2392
  var a = Mr(), o = a.firstChild, i = o.firstChild, l = i.firstChild, s = l.nextSibling, c = i.nextSibling;
2395
- return c.firstChild, a.$$click = () => e.feedback.state.isMinimized && r(), o.addEventListener("submit", n), v(l, () => e.widget.state.text.feedbackForm.title), v(s, f(W, {
2393
+ c.firstChild;
2394
+ var u = c.nextSibling;
2395
+ return a.$$click = () => e.feedback.state.isMinimized && r(), o.addEventListener("submit", n), v(l, () => e.widget.state.text.feedbackForm.title), v(s, g(_, {
2396
2396
  type: "button",
2397
2397
  title: "Hide form",
2398
2398
  variant: "secondary",
@@ -2400,11 +2400,11 @@ const Ar = () => {
2400
2400
  onClick: t,
2401
2401
  "aria-label": "Minimize feedback form",
2402
2402
  get children() {
2403
- return f(yn, {
2403
+ return g(pn, {
2404
2404
  size: 20
2405
2405
  });
2406
2406
  }
2407
- }), null), v(s, f(W, {
2407
+ }), null), v(s, g(_, {
2408
2408
  type: "button",
2409
2409
  title: "Close form",
2410
2410
  variant: "secondary",
@@ -2414,11 +2414,11 @@ const Ar = () => {
2414
2414
  }),
2415
2415
  "aria-label": "Close feedback form",
2416
2416
  get children() {
2417
- return f(pe, {
2417
+ return g(xe, {
2418
2418
  size: 20
2419
2419
  });
2420
2420
  }
2421
- }), null), v(c, f(st, {
2421
+ }), null), v(c, g(st, {
2422
2422
  get config() {
2423
2423
  return {
2424
2424
  type: "textarea",
@@ -2431,35 +2431,35 @@ const Ar = () => {
2431
2431
  get value() {
2432
2432
  return e.feedback.state.message;
2433
2433
  },
2434
- onChange: (d) => e.feedback.setState({
2435
- message: d
2434
+ onChange: (h) => e.feedback.setState({
2435
+ message: h
2436
2436
  })
2437
- }), null), v(o, f(D, {
2437
+ }), null), v(o, g(D, {
2438
2438
  get when() {
2439
- var d;
2440
- return (d = e.widget.state.customInputs) == null ? void 0 : d.length;
2439
+ var h;
2440
+ return (h = e.widget.state.customInputs) == null ? void 0 : h.length;
2441
2441
  },
2442
2442
  get children() {
2443
- var d = Or();
2444
- return d.firstChild, v(d, f(_, {
2443
+ var h = Or();
2444
+ return h.firstChild, v(h, g(W, {
2445
2445
  get each() {
2446
2446
  return e.widget.state.customInputs;
2447
2447
  },
2448
- children: (h) => f($r, {
2449
- config: h,
2448
+ children: (f) => g($r, {
2449
+ config: f,
2450
2450
  get value() {
2451
- return e.feedback.state.customInputValues[h.id];
2451
+ return e.feedback.state.customInputValues[f.id];
2452
2452
  },
2453
- onChange: (g) => e.feedback.setState({
2453
+ onChange: (m) => e.feedback.setState({
2454
2454
  customInputValues: {
2455
2455
  ...e.feedback.state.customInputValues,
2456
- [h.id]: g
2456
+ [f.id]: m
2457
2457
  }
2458
2458
  })
2459
2459
  })
2460
- }), null), d;
2460
+ }), null), h;
2461
2461
  }
2462
- }), null), v(o, f(W, {
2462
+ }), u), v(u, g(_, {
2463
2463
  type: "submit",
2464
2464
  variant: "primary",
2465
2465
  size: "lg",
@@ -2470,9 +2470,9 @@ const Ar = () => {
2470
2470
  get children() {
2471
2471
  return e.widget.state.text.feedbackForm.submitButton;
2472
2472
  }
2473
- }), null), b((d) => {
2474
- var h = e.feedback.state.isMinimized, g = e.feedback.state.isMinimized ? "pointer" : "default", m = !e.feedback.state.isMinimized;
2475
- return h !== d.e && u(a, "data-minimized", d.e = h), g !== d.t && ((d.t = g) != null ? a.style.setProperty("cursor", g) : a.style.removeProperty("cursor")), m !== d.a && u(a, "aria-expanded", d.a = m), d;
2473
+ })), b((h) => {
2474
+ var f = e.feedback.state.isMinimized, m = e.feedback.state.isMinimized ? "pointer" : "default", p = !e.feedback.state.isMinimized;
2475
+ return f !== h.e && d(a, "data-minimized", h.e = f), m !== h.t && ((h.t = m) != null ? a.style.setProperty("cursor", m) : a.style.removeProperty("cursor")), p !== h.a && d(a, "aria-expanded", h.a = p), h;
2476
2476
  }, {
2477
2477
  e: void 0,
2478
2478
  t: void 0,
@@ -2482,21 +2482,21 @@ const Ar = () => {
2482
2482
  };
2483
2483
  T(["click"]);
2484
2484
  var Dr = /* @__PURE__ */ w("<style>"), Fr = /* @__PURE__ */ w("<div class=echo-launcher>"), Lr = /* @__PURE__ */ w("<dialog class=echo-overlay>"), jr = /* @__PURE__ */ w("<div class=echo-root>");
2485
- const Nr = (e) => f(Ot, {
2485
+ const Nr = (e) => g(Ot, {
2486
2486
  useShadow: !0,
2487
2487
  get mount() {
2488
2488
  return document.body;
2489
2489
  },
2490
2490
  get children() {
2491
- return f(cn, ge(e, {
2491
+ return g(cn, ae(e, {
2492
2492
  get children() {
2493
- return f(Wr, {
2493
+ return g(_r, {
2494
2494
  get children() {
2495
- return [f(qr, {
2495
+ return [g(qr, {
2496
2496
  get primaryColor() {
2497
2497
  return e.primaryColor;
2498
2498
  }
2499
- }), f(Vr, {})];
2499
+ }), g(Vr, {})];
2500
2500
  }
2501
2501
  });
2502
2502
  }
@@ -2504,11 +2504,11 @@ const Nr = (e) => f(Ot, {
2504
2504
  }
2505
2505
  }), qr = (e) => {
2506
2506
  const [n, t] = A("");
2507
- return Y(() => {
2507
+ return ee(() => {
2508
2508
  const r = `
2509
2509
  .echo-root {
2510
2510
  --primary-color: ${e.primaryColor};
2511
- --primary-text-color: ${_t(e.primaryColor)};
2511
+ --primary-text-color: ${Wt(e.primaryColor)};
2512
2512
  }
2513
2513
  `;
2514
2514
  t(r);
@@ -2518,22 +2518,21 @@ const Nr = (e) => f(Ot, {
2518
2518
  })();
2519
2519
  }, Vr = () => {
2520
2520
  const e = $();
2521
- return Y(() => {
2522
- }), [(() => {
2521
+ return [(() => {
2523
2522
  var n = Fr();
2524
- return v(n, f(Rn, {}), null), v(n, f(Qn, {}), null), v(n, f(Gn, {}), null), b(() => u(n, "data-hidden", e.widget.state.isOpen)), n;
2525
- })(), f(Br, {
2523
+ return v(n, g(Rn, {}), null), v(n, g(Qn, {}), null), v(n, g(Gn, {}), null), b(() => d(n, "data-hidden", e.widget.state.isOpen)), n;
2524
+ })(), g(Br, {
2526
2525
  get children() {
2527
- return [f(Ar, {}), f(Fn, {}), f(ar, {})];
2526
+ return [g(Ar, {}), g(Fn, {}), g(ar, {})];
2528
2527
  }
2529
2528
  })];
2530
2529
  }, Br = (e) => {
2531
2530
  const [n, t] = A(), r = $(), a = dn(() => n());
2532
- return Y(() => {
2531
+ return ee(() => {
2533
2532
  n() && r.widget.setState({
2534
2533
  dimensions: a()
2535
2534
  });
2536
- }), Y(() => {
2535
+ }), ee(() => {
2537
2536
  var o, i;
2538
2537
  r.widget.state.isOpen ? (o = n()) == null || o.showModal() : (i = n()) == null || i.close();
2539
2538
  }), (() => {
@@ -2542,14 +2541,14 @@ const Nr = (e) => f(Ot, {
2542
2541
  isOpen: !1
2543
2542
  })), V(t, o), v(o, () => e.children), b((i) => {
2544
2543
  var l = `${a().height}px`, s = `${a().width}px`, c = !r.widget.state.isOpen;
2545
- return l !== i.e && ((i.e = l) != null ? o.style.setProperty("height", l) : o.style.removeProperty("height")), s !== i.t && ((i.t = s) != null ? o.style.setProperty("width", s) : o.style.removeProperty("width")), c !== i.a && u(o, "data-hidden", i.a = c), i;
2544
+ return l !== i.e && ((i.e = l) != null ? o.style.setProperty("height", l) : o.style.removeProperty("height")), s !== i.t && ((i.t = s) != null ? o.style.setProperty("width", s) : o.style.removeProperty("width")), c !== i.a && d(o, "data-hidden", i.a = c), i;
2546
2545
  }, {
2547
2546
  e: void 0,
2548
2547
  t: void 0,
2549
2548
  a: void 0
2550
2549
  }), o;
2551
2550
  })();
2552
- }, Wr = (e) => {
2551
+ }, _r = (e) => {
2553
2552
  const n = $();
2554
2553
  return un({
2555
2554
  onUrlChange: (t) => n.methods.handlePageChange(t)
@@ -2562,13 +2561,13 @@ const Nr = (e) => f(Ot, {
2562
2561
  break;
2563
2562
  }
2564
2563
  });
2565
- }), ee(() => {
2564
+ }), te(() => {
2566
2565
  Ut(), Zt();
2567
2566
  }), (() => {
2568
2567
  var t = jr();
2569
- return v(t, () => e.children), b(() => u(t, "data-drawing", n.drawing.state.isDrawing)), t;
2568
+ return v(t, () => e.children), b(() => d(t, "data-drawing", n.drawing.state.isDrawing)), t;
2570
2569
  })();
2571
- }, _r = {
2570
+ }, Wr = {
2572
2571
  welcomeMessage: {
2573
2572
  text: "Click here to leave feedback",
2574
2573
  closeAriaLabel: "Close welcome message"
@@ -2604,9 +2603,9 @@ function Yr(e) {
2604
2603
  onSubmit: r,
2605
2604
  textConfig: a = {},
2606
2605
  customInputs: o = []
2607
- } = e, i = Ke(_r, a), l = document.createElement("div");
2606
+ } = e, i = Ke(Wr, a), l = document.createElement("div");
2608
2607
  l.id = "echo-container", document.body.appendChild(l);
2609
- const s = kt(() => f(Nr, {
2608
+ const s = kt(() => g(Nr, {
2610
2609
  position: n,
2611
2610
  primaryColor: t,
2612
2611
  textConfig: i,