@febkosq8/arc 0.7.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/README.md +1 -0
  2. package/dist/arc.js +151 -194
  3. package/dist/{grid-loader.d.ts → components/grid-loader.d.ts} +3 -1
  4. package/dist/components/index.d.ts +44 -0
  5. package/dist/index.d.ts +2 -47
  6. package/dist/utilities/index.d.ts +3 -0
  7. package/package.json +1 -1
  8. /package/dist/{avatar.d.ts → components/avatar.d.ts} +0 -0
  9. /package/dist/{button-double-click.d.ts → components/button-double-click.d.ts} +0 -0
  10. /package/dist/{button-group.d.ts → components/button-group.d.ts} +0 -0
  11. /package/dist/{button-long-press.d.ts → components/button-long-press.d.ts} +0 -0
  12. /package/dist/{button.d.ts → components/button.d.ts} +0 -0
  13. /package/dist/{card.d.ts → components/card.d.ts} +0 -0
  14. /package/dist/{divider.d.ts → components/divider.d.ts} +0 -0
  15. /package/dist/{dropdown-multi.d.ts → components/dropdown-multi.d.ts} +0 -0
  16. /package/dist/{dropdown.d.ts → components/dropdown.d.ts} +0 -0
  17. /package/dist/{error-text.d.ts → components/error-text.d.ts} +0 -0
  18. /package/dist/{input-timestamp.d.ts → components/input-timestamp.d.ts} +0 -0
  19. /package/dist/{input.d.ts → components/input.d.ts} +0 -0
  20. /package/dist/{label-field.d.ts → components/label-field.d.ts} +0 -0
  21. /package/dist/{menu.d.ts → components/menu.d.ts} +0 -0
  22. /package/dist/{modal.d.ts → components/modal.d.ts} +0 -0
  23. /package/dist/{pill-link.d.ts → components/pill-link.d.ts} +0 -0
  24. /package/dist/{pill.d.ts → components/pill.d.ts} +0 -0
  25. /package/dist/{preview-card.d.ts → components/preview-card.d.ts} +0 -0
  26. /package/dist/{select.d.ts → components/select.d.ts} +0 -0
  27. /package/dist/{switch.d.ts → components/switch.d.ts} +0 -0
  28. /package/dist/{table.d.ts → components/table.d.ts} +0 -0
  29. /package/dist/{tag.d.ts → components/tag.d.ts} +0 -0
  30. /package/dist/{text-link.d.ts → components/text-link.d.ts} +0 -0
  31. /package/dist/{theme-switcher.d.ts → components/theme-switcher.d.ts} +0 -0
  32. /package/dist/{typing-animation.d.ts → components/typing-animation.d.ts} +0 -0
  33. /package/dist/{date-handler.d.ts → utilities/date-handler.d.ts} +0 -0
  34. /package/dist/{hash-navigation.d.ts → utilities/hash-navigation.d.ts} +0 -0
package/README.md CHANGED
@@ -64,6 +64,7 @@ export function Example() {
64
64
  - [npm package](https://www.npmjs.com/package/@febkosq8/arc)
65
65
  - [GitHub repository](https://github.com/febkosq8/arc)
66
66
  - [Component source](./components/)
67
+ - [Utility source](./utilities/)
67
68
  - [Storybook stories](./stories/)
68
69
 
69
70
  Arc is primarily built to meet my own projects' needs. It's shared publicly for anyone who might find the code useful, but it isn't intended as a polished, general-purpose replacement for a larger UI framework.
package/dist/arc.js CHANGED
@@ -190,45 +190,7 @@ var Se = ({ className: e, orientation: r = "horizontal", selectedVariant: o, chi
190
190
  }
191
191
  })]
192
192
  });
193
- };
194
- //#endregion
195
- //#region components/hash-navigation.ts
196
- function Ee({ intervalMs: e = 500, maxAttempts: t = 20, behavior: n = "smooth", block: r } = {}) {
197
- if (typeof window > "u") return () => {};
198
- let i = 0, a = setInterval(() => {
199
- i += 1;
200
- let { hash: e } = window.location;
201
- if (!e || i > t) clearInterval(a);
202
- else try {
203
- let t = document.querySelector(e);
204
- t && (t.scrollIntoView({
205
- behavior: n,
206
- block: r
207
- }), clearInterval(a));
208
- } catch (t) {
209
- console.error(`Invalid hash in URL: ${e}`, t), clearInterval(a);
210
- }
211
- }, e);
212
- return () => clearInterval(a);
213
- }
214
- function De(e) {
215
- o(() => Ee(e), []);
216
- }
217
- function Oe({ container: e, sectionIds: t, hashFirstSection: n = !0, onActiveChange: r }) {
218
- let i = t.map((e) => document.getElementById(e)).filter((e) => e !== null), a = window.location.hash.toLowerCase().slice(1) || null, o = () => {
219
- let t = e.getBoundingClientRect(), o = t.top + t.height / 2, s = i.find((e) => {
220
- let t = e.getBoundingClientRect();
221
- return t.top <= o && t.bottom > o;
222
- }), c = s ? i.indexOf(s) : -1;
223
- if (r?.(c, i), !s || (a === s.id.toLowerCase() && (a = null), c === 0 && a)) return;
224
- let l = c === 0 && !n ? "" : `#${s.id}`;
225
- window.location.hash !== l && (window.history.replaceState(window.history.state, "", `${window.location.pathname}${window.location.search}${l}`), window.dispatchEvent(new HashChangeEvent("hashchange")));
226
- };
227
- return o(), e.addEventListener("scroll", o, { passive: !0 }), () => e.removeEventListener("scroll", o);
228
- }
229
- //#endregion
230
- //#region components/avatar.tsx
231
- var ke = e("arc-avatar inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-muted ring-1 ring-border transition-all", {
193
+ }, Ee = e("arc-avatar inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-muted ring-1 ring-border transition-all", {
232
194
  variants: { size: {
233
195
  xs: "size-6 text-xs",
234
196
  sm: "size-7 text-sm",
@@ -237,12 +199,12 @@ var ke = e("arc-avatar inline-flex shrink-0 items-center justify-center overflow
237
199
  xl: "size-12 text-xl"
238
200
  } },
239
201
  defaultVariants: { size: "md" }
240
- }), Ae = ({ name: e, image: n, size: r, className: i, ...a }) => {
202
+ }), De = ({ name: e, image: n, size: r, className: i, ...a }) => {
241
203
  let [s, l] = u(!1), d = n?.trim(), p = !!d && !s, m = c(() => e?.split(" ", 3)?.map((e) => e[0])?.filter((e) => /[A-Za-z]/.test(e))?.join("") || "U", [e]);
242
204
  return o(() => {
243
205
  l(!1);
244
206
  }, [d]), /* @__PURE__ */ f("span", {
245
- className: t(ke({
207
+ className: t(Ee({
246
208
  size: r,
247
209
  className: i
248
210
  })),
@@ -259,11 +221,11 @@ var ke = e("arc-avatar inline-flex shrink-0 items-center justify-center overflow
259
221
  children: m
260
222
  })
261
223
  });
262
- }, je = ({ className: e, ...n }) => /* @__PURE__ */ f("div", {
224
+ }, Oe = ({ className: e, ...n }) => /* @__PURE__ */ f("div", {
263
225
  role: "separator",
264
226
  className: t("arc-divider w-full border-b border-border", e),
265
227
  ...n
266
- }), Me = ({ items: e, value: n, onChange: r, className: i, placeholder: a = "Select an option", disabled: o, name: s, preventEmpty: c = !1, "data-name": l, "data-required": u }) => {
228
+ }), ke = ({ items: e, value: n, onChange: r, className: i, placeholder: a = "Select an option", disabled: o, name: s, preventEmpty: c = !1, "data-name": l, "data-required": u }) => {
267
229
  let d = e.find((e) => String(e.key) === String(n)) ?? null;
268
230
  return /* @__PURE__ */ f(m.Root, {
269
231
  items: e,
@@ -333,33 +295,7 @@ var ke = e("arc-avatar inline-flex shrink-0 items-center justify-center overflow
333
295
  ...r,
334
296
  children: i
335
297
  });
336
- }, Ne = [
337
- "(,,> ᴗ <,,)",
338
- "≽^•⩊•^≼",
339
- "(╥﹏╥)",
340
- "(˶ᵔ ᵕ ᵔ˶)",
341
- "•⩊•",
342
- "˚₊‧꒰ა ₍ᐢ. ̫.ᐢ₎ ໒꒱ ‧₊˚",
343
- "٩(ˊᗜˋ )و",
344
- "(≧◡≦)",
345
- "⸜(。˃ ᵕ ˂ )⸝♡",
346
- "(˶˃⤙˂˶)",
347
- "(˶′◡‵˶)",
348
- "(^▽^)",
349
- "˚₊‧꒰ა. .໒꒱ ‧₊˚",
350
- "( ˶ˆᗜˆ˵ )",
351
- "⊹ ₊ ⁺‧₊˚ ♡ ପ(๑•ᴗ•๑)ଓ ♡˚₊‧⁺ ₊ ⊹",
352
- "(つ﹏⊂)",
353
- "ʕ•̫͡•ʕ•̫͡•ʔ•̫͡•ʔ•̫͡•ʕ•̫͡•ʔ•̫͡ʕ•̫͡•ʕ•̫͡•ʔ•̫͡ʔ•̫͡•",
354
- "(´・` )♡",
355
- "(╥_╥)",
356
- "(♡ˊ͈ ꒳ ˋ͈)",
357
- "(⸝⸝๑ ̫ ๑⸝⸝⸝)",
358
- "(˶º⤙º˶)",
359
- "૮₍。´ᴖ ˔ ᴖ`。₎ა",
360
- "(•̀ᴗ•́)و ̑̑",
361
- "(─‿‿─)"
362
- ];
298
+ }, Ae = /* @__PURE__ */ "*.+.×.÷.=.~.!.?.@.#.%.&.§.¶.※.◇.◆.○.●.△.▽.□.■.♠.♣.♦.♤.♧.♢.♪.♫.∴.∵".split(".");
363
299
  function U(e, t, n) {
364
300
  let r = Math.sin((e + 1) * 12.9898 + t * 78.233 + n * 37.719) * 43758.5453;
365
301
  return r - Math.floor(r);
@@ -371,7 +307,7 @@ var W = [
371
307
  "star",
372
308
  "heart",
373
309
  "hexagon"
374
- ], Pe = e("arc-grid-loader__cell grid aspect-square w-full place-items-center overflow-hidden text-center leading-none break-all", {
310
+ ], je = e("arc-grid-loader__cell grid aspect-square w-full place-items-center overflow-hidden text-center leading-none break-all", {
375
311
  variants: { shape: {
376
312
  circle: "rounded-full",
377
313
  square: "rounded-md",
@@ -381,59 +317,39 @@ var W = [
381
317
  hexagon: "arc-grid-loader__cell--hexagon"
382
318
  } },
383
319
  defaultVariants: { shape: "circle" }
384
- }), Fe = ({ className: e, rows: n = 3, columns: r = 3, size: i = 120, maxSize: a = 24, shape: s = "circle", colors: c = [], label: l = "Loading", symbols: d = Ne, style: p, ...m }) => {
385
- let [h, g] = u([]), [_, v] = u([]), [y, b] = u([]), [x, S] = u(() => typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
320
+ }), Me = ({ className: e, rows: n = 3, columns: r = 3, size: i = 120, maxSize: a = 24, shape: s = "circle", shapes: c = W, colors: l = [], label: d = "Loading", symbols: p = Ae, style: m, ...h }) => {
321
+ let [g, _] = u([]), [v, y] = u([]), [b, x] = u([]), S = c.length > 0 ? c : W, [C, w] = u(() => typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
386
322
  if (o(() => {
387
- s === "mixed" && v(Array.from({ length: n * r }, () => W[Math.floor(Math.random() * W.length)]));
388
- }, [
389
- r,
390
- n,
391
- s
392
- ]), o(() => {
393
- s === "mixed" && c.length !== 0 && b(Array.from({ length: n * r }, () => Math.floor(Math.random() * c.length)));
323
+ s === "mixed" && y(Array.from({ length: n * r }, () => S[Math.floor(Math.random() * S.length)]));
394
324
  }, [
325
+ S,
395
326
  r,
396
- c.length,
397
327
  n,
398
328
  s
399
329
  ]), o(() => {
400
- let e = window.matchMedia("(prefers-reduced-motion: reduce)"), t = () => S(e.matches);
330
+ let e = window.matchMedia("(prefers-reduced-motion: reduce)"), t = () => w(e.matches);
401
331
  return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
402
332
  }, []), o(() => {
403
- if (x) return;
404
- let e = () => {
405
- let e = Array.from({ length: d.length }, (e, t) => t);
406
- for (let t = e.length - 1; t > 0; --t) {
407
- let n = Math.floor(Math.random() * (t + 1));
408
- [e[t], e[n]] = [e[n], e[t]];
409
- }
410
- g(Array.from({ length: n * r }, (t, n) => e[n % e.length]));
411
- };
412
- if (e(), d.length < 2) return;
413
- let t = window.setInterval(() => {
414
- e();
415
- }, 900);
416
- return () => window.clearInterval(t);
333
+ C || p.length === 0 || _(Array.from({ length: n * r }, () => Math.floor(Math.random() * p.length)));
417
334
  }, [
418
335
  r,
419
- x,
336
+ C,
420
337
  n,
421
- d
338
+ p
422
339
  ]), !Number.isInteger(n) || n < 1) throw RangeError("GridLoader rows must be a positive integer.");
423
340
  if (!Number.isInteger(r) || r < 1) throw RangeError("GridLoader columns must be a positive integer.");
424
341
  if (!Number.isFinite(i) || i <= 0) throw RangeError("GridLoader size must be a positive number.");
425
342
  if (!Number.isFinite(a) || a <= 0) throw RangeError("GridLoader maxSize must be a positive number.");
426
- if (d.length === 0) throw RangeError("GridLoader symbols must contain at least one item.");
427
343
  return /* @__PURE__ */ f("span", {
428
- ...m,
344
+ ...h,
429
345
  role: "status",
430
346
  "aria-live": "polite",
431
- "aria-label": l,
347
+ "aria-label": d,
432
348
  className: t("arc-grid-loader inline-flex shrink-0 items-center justify-center align-middle", e),
433
349
  style: {
434
350
  width: i,
435
351
  height: i,
436
- ...p
352
+ ...m
437
353
  },
438
354
  children: /* @__PURE__ */ f("span", {
439
355
  "aria-hidden": "true",
@@ -444,25 +360,31 @@ var W = [
444
360
  gridTemplateRows: `repeat(${n}, minmax(0, 1fr))`
445
361
  },
446
362
  children: Array.from({ length: n * r }, (e, o) => /* @__PURE__ */ f("span", {
447
- className: t(Pe({ shape: s === "mixed" ? _[o] ?? W[Math.floor(U(o, n, r) * W.length)] : s })),
363
+ className: t(je({ shape: s === "mixed" ? v[o] ?? S[Math.floor(U(o, n, r) * S.length)] : s })),
448
364
  onAnimationIteration: () => {
449
- s === "mixed" && (v((e) => {
450
- let t = [...e], i = t[o] ?? W[Math.floor(U(o, n, r) * W.length)], a = W.filter((e) => e !== i);
451
- return t[o] = a[Math.floor(Math.random() * a.length)], t;
452
- }), c.length > 1 && b((e) => {
365
+ s === "mixed" && y((e) => {
366
+ let t = [...e], i = t[o] ?? S[Math.floor(U(o, n, r) * S.length)], a = S.filter((e) => e !== i);
367
+ return t[o] = a.length > 0 ? a[Math.floor(Math.random() * a.length)] : i, t;
368
+ }), l.length > 1 && x((e) => {
369
+ let t = [...e];
370
+ return t[o] = (t[o] ?? 0) + 1, t;
371
+ }), p.length > 1 && _((e) => {
453
372
  let t = [...e];
454
- return t[o] = ((t[o] ?? o % c.length) + (1 + Math.floor(Math.random() * (c.length - 1)))) % c.length, t;
455
- }));
373
+ return t[o] = ((t[o] ?? o % p.length) + (1 + Math.floor(Math.random() * (p.length - 1)))) % p.length, t;
374
+ });
456
375
  },
457
376
  style: {
458
- animationDelay: `${-U(o, n, r) * 1200}ms`,
459
- animationDuration: `${900 + U(o, n, r) * 600}ms`,
460
- backgroundColor: c.length > 0 ? c[s === "mixed" ? y[o] ?? o % c.length : o % c.length] : void 0,
461
- fontSize: `${Math.min(i / Math.max(n, r), a) * .3}px`,
377
+ animationDelay: l.length > 1 ? `${o / (n * r) * 1200}ms` : `${-U(o, n, r) * 1200}ms`,
378
+ animationDuration: l.length > 1 ? "1200ms" : `${900 + U(o, n, r) * 600}ms`,
379
+ backgroundColor: l.length > 0 ? l[(o + (b[o] ?? 0)) % l.length] : void 0,
380
+ fontSize: `${Math.min(i / Math.max(n, r), a) * .4}px`,
462
381
  maxWidth: a,
463
382
  maxHeight: a
464
383
  },
465
- children: d[h[o] ?? o % d.length]
384
+ children: p.length > 0 && /* @__PURE__ */ f("span", {
385
+ className: "grid h-full w-full place-items-center text-center leading-none",
386
+ children: p[g[o] ?? o % p.length]
387
+ })
466
388
  }, o))
467
389
  })
468
390
  });
@@ -484,7 +406,7 @@ var W = [
484
406
  children: [/* @__PURE__ */ f(A.Arrow, { className: t("border-border bg-popover h-3 w-3 rotate-45", "data-[side=bottom]:-top-1.5 data-[side=bottom]:border-t data-[side=bottom]:border-l", "data-[side=top]:-bottom-1.5 data-[side=top]:border-r data-[side=top]:border-b", "data-[side=left]:-right-1.5 data-[side=left]:border-t data-[side=left]:border-r", "data-[side=right]:-left-1.5 data-[side=right]:border-b data-[side=right]:border-l") }), e]
485
407
  })
486
408
  }) })]
487
- }), Ie = ({ id: e, label: n, help: r, errors: i, className: a, ...o }) => {
409
+ }), Ne = ({ id: e, label: n, help: r, errors: i, className: a, ...o }) => {
488
410
  let s = Array.isArray(i) ? i.map((e) => e == null ? "" : String(e)) : typeof i == "string" ? i : null;
489
411
  return /* @__PURE__ */ p("div", {
490
412
  ...o,
@@ -515,7 +437,7 @@ var W = [
515
437
  s && (Array.isArray(s) ? s.length > 0 && /* @__PURE__ */ f(H, { data: s }) : /* @__PURE__ */ f(H, { data: s }))
516
438
  ]
517
439
  });
518
- }, Le = e("arc-input rounded border text-foreground placeholder:text-muted-foreground focus:border-transparent focus:outline-hidden focus:ring-2 focus:ring-ring disabled:cursor-not-allowed disabled:border-muted disabled:bg-muted", {
440
+ }, Pe = e("arc-input rounded border text-foreground placeholder:text-muted-foreground focus:border-transparent focus:outline-hidden focus:ring-2 focus:ring-ring disabled:cursor-not-allowed disabled:border-muted disabled:bg-muted", {
519
441
  variants: {
520
442
  variant: {
521
443
  default: "border-border bg-background",
@@ -531,7 +453,7 @@ var W = [
531
453
  as: "input"
532
454
  }
533
455
  }), K = ({ as: e = "input", className: n, variant: r, ...i }) => {
534
- let a = t(Le({
456
+ let a = t(Pe({
535
457
  as: e,
536
458
  variant: r
537
459
  }), n);
@@ -540,7 +462,7 @@ var W = [
540
462
  autoComplete: "off",
541
463
  className: a
542
464
  });
543
- }, Re = e("arc-card group relative rounded-lg border border-foreground/40 bg-card/90 p-3 shadow-xs", {
465
+ }, Fe = e("arc-card group relative rounded-lg border border-foreground/40 bg-card/90 p-3 shadow-xs", {
544
466
  variants: { variant: {
545
467
  primary: "border-primary bg-primary text-primary-foreground",
546
468
  secondary: "border-secondary bg-secondary text-secondary-foreground",
@@ -555,7 +477,7 @@ var W = [
555
477
  }), q = (e) => {
556
478
  let { className: n, variant: r, hoverable: i = !0, hoverLift: a = !0, hoverBorder: o = !0, hoverGradient: s = !0, postHeaderBorder: c = !0, preFooterBorder: l = !0, onPointerMove: u, ...d } = e, p = i && a, m = i && o, h = i && s;
557
479
  return /* @__PURE__ */ f("div", {
558
- className: t(Re({ variant: r }), h && "arc-card-cursor-border", c && "[&_.arc-card-header]:border-b", !c && "[&_.arc-card-header]:border-b-0", l && "[&_.arc-card-footer]:border-t", !l && "[&_.arc-card-footer]:border-t-0", (p || m) && "transition-[border-color,transform] duration-300 ease-out", p && "hover:-translate-y-1", m && "hover:border-primary", n),
480
+ className: t(Fe({ variant: r }), h && "arc-card-cursor-border", c && "[&_.arc-card-header]:border-b", !c && "[&_.arc-card-header]:border-b-0", l && "[&_.arc-card-footer]:border-t", !l && "[&_.arc-card-footer]:border-t-0", (p || m) && "transition-[border-color,transform] duration-300 ease-out", p && "hover:-translate-y-1", m && "hover:border-primary", n),
559
481
  onPointerMove: h ? (e) => {
560
482
  if (u?.(e), !h) return;
561
483
  let t = e.currentTarget.getBoundingClientRect();
@@ -584,8 +506,8 @@ q.Header = (e) => {
584
506
  });
585
507
  };
586
508
  //#endregion
587
- //#region components/date-handler.ts
588
- var ze = class e {
509
+ //#region utilities/date-handler.ts
510
+ var J = class e {
589
511
  static toDateTime(e) {
590
512
  if (e == null || e === "") return j.invalid("missing date");
591
513
  if (e instanceof Date) return j.fromJSDate(e);
@@ -602,7 +524,7 @@ var ze = class e {
602
524
  }
603
525
  return j.fromJSDate(new Date(String(e)));
604
526
  }
605
- static getDateTime(t, n = "dd/MM/yyyy hh:mm:ss a") {
527
+ static getDateTime(t, n = "dd/MMM/yyyy hh:mm:ss a") {
606
528
  let r = e.toDateTime(t);
607
529
  return r.isValid ? r.toFormat(n) : "";
608
530
  }
@@ -643,8 +565,8 @@ var ze = class e {
643
565
  let r = e.getDateTime(t), i = e.getRelativeTime(t);
644
566
  return n.replace("$ISO$", r).replace("$RELATIVE$", i);
645
567
  }
646
- }, Be = ({ value: e, format: t = "$ISO$ ($RELATIVE$)", ...n }) => {
647
- let r = c(() => e ? ze.getFormattedTime(e, t) : "", [e, t]);
568
+ }, Ie = ({ value: e, format: t = "$ISO$ ($RELATIVE$)", ...n }) => {
569
+ let r = c(() => e ? J.getFormattedTime(e, t) : "", [e, t]);
648
570
  return /* @__PURE__ */ f(K, {
649
571
  type: "text",
650
572
  disabled: !0,
@@ -653,7 +575,7 @@ var ze = class e {
653
575
  size: Math.max(r.length, 1),
654
576
  ...n
655
577
  });
656
- }, Ve = e("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", {
578
+ }, Le = e("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", {
657
579
  variants: {
658
580
  variant: {
659
581
  pill: "arc-pill-link min-w-fit border border-transparent text-base text-muted-foreground transition hover:text-primary hover:outline-none hover:ring-0 focus:outline-none focus-visible:ring-opacity-75",
@@ -674,8 +596,8 @@ var ze = class e {
674
596
  variant: "pill",
675
597
  size: "md"
676
598
  }
677
- }), He = ({ active: e = !1, className: n, size: r = "md", variant: i = "pill", ...a }) => /* @__PURE__ */ f("a", {
678
- className: t(Ve({
599
+ }), Re = ({ active: e = !1, className: n, size: r = "md", variant: i = "pill", ...a }) => /* @__PURE__ */ f("a", {
600
+ className: t(Le({
679
601
  variant: i,
680
602
  size: r
681
603
  }), e && {
@@ -685,15 +607,15 @@ var ze = class e {
685
607
  }[i], n),
686
608
  "aria-current": e ? "page" : void 0,
687
609
  ...a
688
- }), J = ({ active: e = !1, className: n, ...r }) => /* @__PURE__ */ f("button", {
610
+ }), Y = ({ active: e = !1, className: n, ...r }) => /* @__PURE__ */ f("button", {
689
611
  type: "button",
690
612
  className: t("arc-pill", "inline-flex h-10 pointer-coarse:h-11 w-full items-center justify-center whitespace-nowrap rounded-md border border-transparent px-3 py-2 text-base font-medium text-foreground transition hover:text-primary hover:outline-none hover:ring-0 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-opacity-75", e ? "text-primary!" : "text-muted-foreground", n),
691
613
  "aria-pressed": e,
692
614
  ...r
693
- }), Ue = ({ children: e }) => n.toArray(e).map((e, t) => /* @__PURE__ */ p(r, { children: [t > 0 && /* @__PURE__ */ f(M.Separator, { className: "mx-2 h-px bg-border" }), e] }, t)), Y = Object.assign(({ className: e, contentClassName: n, active: r, activeClassName: i, buttonText: a, children: o }) => /* @__PURE__ */ p(M.Root, {
615
+ }), ze = ({ children: e }) => n.toArray(e).map((e, t) => /* @__PURE__ */ p(r, { children: [t > 0 && /* @__PURE__ */ f(M.Separator, { className: "mx-2 h-px bg-border" }), e] }, t)), X = Object.assign(({ className: e, contentClassName: n, active: r, activeClassName: i, buttonText: a, children: o }) => /* @__PURE__ */ p(M.Root, {
694
616
  loopFocus: !0,
695
617
  children: [/* @__PURE__ */ p(M.Trigger, {
696
- render: /* @__PURE__ */ f(J, {
618
+ render: /* @__PURE__ */ f(Y, {
697
619
  active: r,
698
620
  className: t("w-fit", r && i, e)
699
621
  }),
@@ -707,7 +629,7 @@ var ze = class e {
707
629
  collisionPadding: 8,
708
630
  children: /* @__PURE__ */ f(M.Popup, {
709
631
  className: t("arc-menu-content z-50 flex bg-popover w-fit min-w-40 max-w-[calc(100vw-1rem)] origin-top-right flex-col overflow-hidden rounded-md border border-border text-foreground shadow-lg ring-1 ring-foreground/10 focus:outline-none", n),
710
- children: /* @__PURE__ */ f(Ue, { children: o })
632
+ children: /* @__PURE__ */ f(ze, { children: o })
711
633
  })
712
634
  }) })]
713
635
  }), {
@@ -748,12 +670,12 @@ var ze = class e {
748
670
  collisionPadding: 8,
749
671
  children: /* @__PURE__ */ f(M.Popup, {
750
672
  className: "arc-menu-content z-50 flex bg-popover w-fit min-w-40 max-w-[calc(100vw-1rem)] origin-top-right flex-col overflow-hidden rounded-md border border-border text-foreground shadow-lg ring-1 ring-foreground/10 focus:outline-none",
751
- children: /* @__PURE__ */ f(Ue, { children: i })
673
+ children: /* @__PURE__ */ f(ze, { children: i })
752
674
  })
753
675
  }) })]
754
676
  });
755
677
  }
756
- }), We = ({ open: e = !1, setOpen: n, children: r, initialFocus: i, headerContent: a, footerContent: s, width: c, height: l, className: u, customKeyHandler: d }) => (o(() => {
678
+ }), Be = ({ open: e = !1, setOpen: n, children: r, initialFocus: i, headerContent: a, footerContent: s, width: c, height: l, className: u, customKeyHandler: d }) => (o(() => {
757
679
  if (!e) return;
758
680
  let t = (e) => {
759
681
  let t = e.key === "Escape" ? "esc" : (e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "s" ? "ctrl+s" : null;
@@ -792,7 +714,7 @@ var ze = class e {
792
714
  ]
793
715
  })
794
716
  })] })
795
- })), Ge = ({ id: e, items: n, value: r, onChange: i, className: a, placeholder: o = "Select options", disabled: s, name: c, preventEmpty: l = !1, "data-name": u, "data-required": d }) => {
717
+ })), Ve = ({ id: e, items: n, value: r, onChange: i, className: a, placeholder: o = "Select options", disabled: s, name: c, preventEmpty: l = !1, "data-name": u, "data-required": d }) => {
796
718
  let h = n.filter((e) => r?.includes(String(e.key)));
797
719
  return /* @__PURE__ */ f(m.Root, {
798
720
  multiple: !0,
@@ -872,7 +794,7 @@ var ze = class e {
872
794
  }) })]
873
795
  })
874
796
  });
875
- }, X = ({ id: e, value: n, onChange: r, data: i, className: a, disabled: o, placeholder: s, ...c }) => /* @__PURE__ */ p(B.Root, {
797
+ }, Z = ({ id: e, value: n, onChange: r, data: i, className: a, disabled: o, placeholder: s, ...c }) => /* @__PURE__ */ p(B.Root, {
876
798
  value: n,
877
799
  onValueChange: (e) => {
878
800
  e !== null && r(e);
@@ -924,7 +846,7 @@ var ze = class e {
924
846
  })
925
847
  })
926
848
  }) })]
927
- }), Ke = e("arc-tag inline-flex w-fit items-center rounded-full border border-transparent px-1.5 py-0.5 text-xs font-bold", {
849
+ }), He = e("arc-tag inline-flex w-fit items-center rounded-full border border-transparent px-1.5 py-0.5 text-xs font-bold", {
928
850
  variants: { variant: {
929
851
  primary: "bg-primary text-primary-foreground",
930
852
  secondary: "border-border bg-secondary text-secondary-foreground",
@@ -934,23 +856,23 @@ var ze = class e {
934
856
  outline: "border-border bg-transparent text-foreground"
935
857
  } },
936
858
  defaultVariants: { variant: "primary" }
937
- }), qe = ({ className: e, variant: n, ...r }) => /* @__PURE__ */ f("div", {
938
- className: t(Ke({
859
+ }), Ue = ({ className: e, variant: n, ...r }) => /* @__PURE__ */ f("div", {
860
+ className: t(He({
939
861
  variant: n,
940
862
  className: e
941
863
  })),
942
864
  ...r
943
- }), Je = (e, t, n, r) => {
865
+ }), We = (e, t, n, r) => {
944
866
  let i = e.getValue(t), a = ee(i, n);
945
867
  return r({ itemRank: a }), a.passed;
946
- }, Z = {
947
- fuzzy: Je,
868
+ }, Q = {
869
+ fuzzy: We,
948
870
  includesString: le,
949
871
  select: (e, t, n) => {
950
872
  let r = e.getValue(t);
951
873
  return Array.isArray(r) ? r.some((e) => String(e) === String(n)) : typeof r == "string" && r.includes(",") ? r.split(",").map((e) => e.trim()).includes(String(n)) : String(r) === String(n);
952
874
  }
953
- }, Ye = ye({
875
+ }, Ge = ye({
954
876
  columnMeta: {},
955
877
  columnFilteringFeature: te,
956
878
  columnResizingFeature: ne,
@@ -970,23 +892,23 @@ var ze = class e {
970
892
  text: _e,
971
893
  textCaseSensitive: ve
972
894
  },
973
- filterFns: Z
895
+ filterFns: Q
974
896
  });
975
- function Xe(e) {
976
- return Object.prototype.hasOwnProperty.call(Z, e);
897
+ function Ke(e) {
898
+ return Object.prototype.hasOwnProperty.call(Q, e);
977
899
  }
978
- function Ze(e, t) {
900
+ function qe(e, t) {
979
901
  if (e !== !1) {
980
902
  if (e === void 0) return t ? "select" : void 0;
981
- if (typeof e == "function" || e === "auto" || Xe(e)) return e;
982
- throw Error(`Unsupported table filterFn "${e}". Use "auto" or one of: ${Object.keys(Z).join(", ")}.`);
903
+ if (typeof e == "function" || e === "auto" || Ke(e)) return e;
904
+ throw Error(`Unsupported table filterFn "${e}". Use "auto" or one of: ${Object.keys(Q).join(", ")}.`);
983
905
  }
984
906
  }
985
- var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, showHeader: a = !0, showFilters: o = !0, showSorting: l = !0 }) => {
907
+ var Je = ae(), Ye = ({ data: e, columnDef: n, pageSize: r = 10, className: i, showHeader: a = !0, showFilters: o = !0, showSorting: l = !0 }) => {
986
908
  let d = s(), [m, b] = u({
987
909
  pageIndex: 0,
988
910
  pageSize: r
989
- }), [x, w] = u([]), [T, D] = u(""), [O, k] = u([]), [A, j] = u({}), M = x.length > 0 || T !== "", N = c(() => n?.map((e) => Qe.accessor(e.accessorKey, {
911
+ }), [x, w] = u([]), [T, D] = u(""), [O, k] = u([]), [A, j] = u({}), M = x.length > 0 || T !== "", N = c(() => n?.map((e) => Je.accessor(e.accessorKey, {
990
912
  id: e.id,
991
913
  enableResizing: e.enableResizing,
992
914
  enableColumnFilter: e.filterFn !== !1 && e.enableColumnFilter,
@@ -995,7 +917,7 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
995
917
  size: e.size,
996
918
  minSize: e.minSize ?? 50,
997
919
  maxSize: e.maxSize ?? 1e3,
998
- filterFn: Ze(e.filterFn, e.filterSelectOptions),
920
+ filterFn: qe(e.filterFn, e.filterSelectOptions),
999
921
  meta: {
1000
922
  headerLabel: e.header,
1001
923
  filterSelectOptions: e.filterSelectOptions,
@@ -1039,8 +961,8 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
1039
961
  onSortingChange: k,
1040
962
  onColumnFiltersChange: w,
1041
963
  onGlobalFilterChange: D,
1042
- globalFilterFn: Je,
1043
- features: Ye,
964
+ globalFilterFn: We,
965
+ features: Ge,
1044
966
  defaultColumn: {
1045
967
  size: 200,
1046
968
  minSize: 50,
@@ -1065,7 +987,7 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
1065
987
  title: "Clear filters and sorting",
1066
988
  type: "button",
1067
989
  children: [/* @__PURE__ */ f(E, { className: "mr-1.5 h-3 w-3" }), "Clear filters and sorting"]
1068
- }), /* @__PURE__ */ f(nt, { table: P })]
990
+ }), /* @__PURE__ */ f(Qe, { table: P })]
1069
991
  }),
1070
992
  /* @__PURE__ */ p("nav", {
1071
993
  "aria-label": "Table pagination",
@@ -1174,7 +1096,7 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
1174
1096
  /* @__PURE__ */ p("label", {
1175
1097
  htmlFor: `${d}-page-size`,
1176
1098
  className: "text-muted-foreground flex w-full items-center justify-between gap-2 text-xs md:w-auto",
1177
- children: ["Rows per page", /* @__PURE__ */ f(X, {
1099
+ children: ["Rows per page", /* @__PURE__ */ f(Z, {
1178
1100
  id: `${d}-page-size`,
1179
1101
  value: P.state.pagination.pageSize.toString(),
1180
1102
  onChange: (e) => {
@@ -1213,7 +1135,7 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
1213
1135
  htmlFor: `${d}-sort`,
1214
1136
  className: "text-muted-foreground mb-1 block text-xs font-medium",
1215
1137
  children: "Sort by"
1216
- }), /* @__PURE__ */ f(X, {
1138
+ }), /* @__PURE__ */ f(Z, {
1217
1139
  id: `${d}-sort`,
1218
1140
  value: O[0]?.id ?? "__none__",
1219
1141
  onChange: (e) => {
@@ -1257,7 +1179,7 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
1257
1179
  htmlFor: n,
1258
1180
  className: "text-muted-foreground mb-1 block text-xs font-medium",
1259
1181
  children: t
1260
- }), /* @__PURE__ */ f(tt, {
1182
+ }), /* @__PURE__ */ f(Ze, {
1261
1183
  column: e,
1262
1184
  idPrefix: `${d}-`
1263
1185
  })]
@@ -1327,7 +1249,7 @@ var Qe = ae(), $e = ({ data: e, columnDef: n, pageSize: r = 10, className: i, sh
1327
1249
  ]
1328
1250
  });
1329
1251
  };
1330
- function et({ value: e, onChange: t, debounce: n = 500, ...r }) {
1252
+ function Xe({ value: e, onChange: t, debounce: n = 500, ...r }) {
1331
1253
  let [i, a] = u(e);
1332
1254
  return o(() => {
1333
1255
  a(e);
@@ -1347,7 +1269,7 @@ function et({ value: e, onChange: t, debounce: n = 500, ...r }) {
1347
1269
  autoComplete: "off"
1348
1270
  });
1349
1271
  }
1350
- function tt({ column: e, idPrefix: t = "" }) {
1272
+ function Ze({ column: e, idPrefix: t = "" }) {
1351
1273
  let n = `${t}${e.id}-filter`, r = {
1352
1274
  includesString: "Includes string",
1353
1275
  equalsString: "Equals string",
@@ -1355,7 +1277,7 @@ function tt({ column: e, idPrefix: t = "" }) {
1355
1277
  equals: "Equals",
1356
1278
  fuzzy: "Fuzzy"
1357
1279
  }, i = e.getFilterValue(), a = e.columnDef.meta?.filterSelectOptions;
1358
- return a ? /* @__PURE__ */ f(X, {
1280
+ return a ? /* @__PURE__ */ f(Z, {
1359
1281
  id: n,
1360
1282
  value: i ?? "__all__",
1361
1283
  onChange: (t) => e.setFilterValue(t === "__all__" ? void 0 : t),
@@ -1367,7 +1289,7 @@ function tt({ column: e, idPrefix: t = "" }) {
1367
1289
  key: e.value,
1368
1290
  label: e.label
1369
1291
  }))]
1370
- }) : /* @__PURE__ */ f(et, {
1292
+ }) : /* @__PURE__ */ f(Xe, {
1371
1293
  id: n,
1372
1294
  type: "text",
1373
1295
  name: e.id,
@@ -1378,7 +1300,7 @@ function tt({ column: e, idPrefix: t = "" }) {
1378
1300
  className: "border-border text-foreground placeholder:text-muted-foreground focus:ring-ring w-full rounded border bg-transparent px-2 py-1 text-xs shadow-sm focus:border-transparent focus:ring-1 focus:outline-hidden"
1379
1301
  });
1380
1302
  }
1381
- function nt({ table: e }) {
1303
+ function Qe({ table: e }) {
1382
1304
  return /* @__PURE__ */ p(G, {
1383
1305
  trigger: "click",
1384
1306
  triggerRender: /* @__PURE__ */ f(V, {
@@ -1410,31 +1332,31 @@ function nt({ table: e }) {
1410
1332
  }
1411
1333
  //#endregion
1412
1334
  //#region components/text-link.tsx
1413
- var rt = ({ className: e, href: n, text: r, target: i = "_blank", rel: a, ...o }) => /* @__PURE__ */ f("a", {
1335
+ var $e = ({ className: e, href: n, text: r, target: i = "_blank", rel: a, ...o }) => /* @__PURE__ */ f("a", {
1414
1336
  className: t("arc-text-link rounded-md text-primary underline transition hover:text-primary/80 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-opacity-75", e),
1415
1337
  href: n,
1416
1338
  target: i,
1417
1339
  rel: a ?? (i === "_blank" ? "noopener noreferrer" : void 0),
1418
1340
  ...o,
1419
1341
  children: r
1420
- }), it = ({ checked: e = !1, onChange: n, disabled: r = !1, variant: i = "primary", children: a, ...o }) => /* @__PURE__ */ f(xe.Root, {
1342
+ }), et = ({ checked: e = !1, onChange: n, disabled: r = !1, variant: i = "primary", children: a, ...o }) => /* @__PURE__ */ f(xe.Root, {
1421
1343
  checked: e,
1422
1344
  disabled: r,
1423
1345
  onCheckedChange: n,
1424
- className: t("arc-switch", at({
1346
+ className: t("arc-switch", tt({
1425
1347
  variant: i,
1426
1348
  disabled: r
1427
1349
  })),
1428
1350
  ...o,
1429
1351
  children: a ? a(e) : /* @__PURE__ */ f(xe.Thumb, {
1430
1352
  "aria-hidden": "true",
1431
- className: ot({
1353
+ className: nt({
1432
1354
  variant: i,
1433
1355
  checked: e,
1434
1356
  disabled: r
1435
1357
  })
1436
1358
  })
1437
- }), at = e("relative inline-flex h-7 w-12 items-center rounded-full border border-border bg-muted transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 hover:not-data-disabled:ring-2 hover:not-data-disabled:ring-ring/60 data-disabled:cursor-not-allowed data-disabled:opacity-60", { variants: {
1359
+ }), tt = e("relative inline-flex h-7 w-12 items-center rounded-full border border-border bg-muted transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 hover:not-data-disabled:ring-2 hover:not-data-disabled:ring-ring/60 data-disabled:cursor-not-allowed data-disabled:opacity-60", { variants: {
1438
1360
  variant: {
1439
1361
  danger: "data-checked:bg-destructive",
1440
1362
  success: "data-checked:bg-success",
@@ -1445,7 +1367,7 @@ var rt = ({ className: e, href: n, text: r, target: i = "_blank", rel: a, ...o }
1445
1367
  true: "ring-2 ring-border",
1446
1368
  false: ""
1447
1369
  }
1448
- } }), ot = e("absolute top-1/2 inline-block h-5 w-5 -translate-y-1/2 transform rounded-full border shadow-sm transition-[left,background-color,border-color] duration-300 ease-out", {
1370
+ } }), nt = e("absolute top-1/2 inline-block h-5 w-5 -translate-y-1/2 transform rounded-full border shadow-sm transition-[left,background-color,border-color] duration-300 ease-out", {
1449
1371
  variants: {
1450
1372
  variant: {
1451
1373
  primary: "",
@@ -1538,7 +1460,7 @@ var rt = ({ className: e, href: n, text: r, target: i = "_blank", rel: a, ...o }
1538
1460
  className: "border-success bg-success/70"
1539
1461
  }
1540
1462
  ]
1541
- }), Q = {
1463
+ }), rt = {
1542
1464
  light: L,
1543
1465
  dark: I,
1544
1466
  system: F
@@ -1546,25 +1468,25 @@ var rt = ({ className: e, href: n, text: r, target: i = "_blank", rel: a, ...o }
1546
1468
  light: "Light",
1547
1469
  dark: "Dark",
1548
1470
  system: "System"
1549
- }, st = "theme", ct = (e) => e === "dark" || e === "system" && typeof window < "u" && window.matchMedia("(prefers-color-scheme: dark)").matches, lt = () => {
1471
+ }, it = "theme", at = (e) => e === "dark" || e === "system" && typeof window < "u" && window.matchMedia("(prefers-color-scheme: dark)").matches, ot = () => {
1550
1472
  if (typeof window > "u") return "system";
1551
- let e = window.localStorage.getItem(st);
1473
+ let e = window.localStorage.getItem(it);
1552
1474
  return e === "light" || e === "dark" || e === "system" ? e : "system";
1553
- }, ut = (e) => e === "system" ? "light" : e === "light" ? "dark" : "system";
1554
- function dt({ variant: e = "dropdown", showLabel: n = !1 }) {
1555
- let [r, i] = u(lt);
1475
+ }, st = (e) => e === "system" ? "light" : e === "light" ? "dark" : "system";
1476
+ function ct({ variant: e = "dropdown", showLabel: n = !1 }) {
1477
+ let [r, i] = u(ot);
1556
1478
  o(() => {
1557
- typeof window < "u" && (document.documentElement.classList.toggle("dark", ct(r)), window.localStorage.setItem(st, r));
1479
+ typeof window < "u" && (document.documentElement.classList.toggle("dark", at(r)), window.localStorage.setItem(it, r));
1558
1480
  }, [r]);
1559
1481
  let a = () => {
1560
- i(ut(r));
1482
+ i(st(r));
1561
1483
  };
1562
1484
  if (e === "toggle") {
1563
- let e = Q[r], t = ut(r);
1485
+ let e = rt[r], t = st(r);
1564
1486
  return /* @__PURE__ */ f("div", {
1565
1487
  className: "arc-theme-switcher",
1566
- children: /* @__PURE__ */ p(J, {
1567
- active: ct(r),
1488
+ children: /* @__PURE__ */ p(Y, {
1489
+ active: at(r),
1568
1490
  "aria-label": `Switch to ${t} theme`,
1569
1491
  title: `Switch to ${t} theme`,
1570
1492
  onClick: a,
@@ -1573,18 +1495,18 @@ function dt({ variant: e = "dropdown", showLabel: n = !1 }) {
1573
1495
  })
1574
1496
  });
1575
1497
  }
1576
- let s = Q[r];
1498
+ let s = rt[r];
1577
1499
  return /* @__PURE__ */ f("div", {
1578
1500
  className: "arc-theme-switcher",
1579
- children: /* @__PURE__ */ p(Y, {
1501
+ children: /* @__PURE__ */ p(X, {
1580
1502
  className: "gap-3",
1581
1503
  contentClassName: "min-w-(--anchor-width)",
1582
1504
  buttonText: /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(s, { "aria-hidden": "true" }), n && $[r]] }),
1583
1505
  children: [
1584
- /* @__PURE__ */ f(Y.Item, {
1506
+ /* @__PURE__ */ f(X.Item, {
1585
1507
  asChild: !0,
1586
1508
  className: t("border-0! focus-visible:outline-none", n ? "px-3!" : "justify-center! p-0!"),
1587
- children: /* @__PURE__ */ p(J, {
1509
+ children: /* @__PURE__ */ p(Y, {
1588
1510
  active: r === "system",
1589
1511
  title: "System Theme",
1590
1512
  onClick: () => {
@@ -1597,10 +1519,10 @@ function dt({ variant: e = "dropdown", showLabel: n = !1 }) {
1597
1519
  }), n && $.system]
1598
1520
  })
1599
1521
  }),
1600
- /* @__PURE__ */ f(Y.Item, {
1522
+ /* @__PURE__ */ f(X.Item, {
1601
1523
  asChild: !0,
1602
1524
  className: t("border-0! focus-visible:outline-none", n ? "px-3!" : "justify-center! p-0!"),
1603
- children: /* @__PURE__ */ p(J, {
1525
+ children: /* @__PURE__ */ p(Y, {
1604
1526
  active: r === "light",
1605
1527
  title: "Light Theme",
1606
1528
  onClick: () => {
@@ -1613,10 +1535,10 @@ function dt({ variant: e = "dropdown", showLabel: n = !1 }) {
1613
1535
  }), n && $.light]
1614
1536
  })
1615
1537
  }),
1616
- /* @__PURE__ */ f(Y.Item, {
1538
+ /* @__PURE__ */ f(X.Item, {
1617
1539
  asChild: !0,
1618
1540
  className: t("border-0! focus-visible:outline-none", n ? "px-3!" : "justify-center! p-0!"),
1619
- children: /* @__PURE__ */ p(J, {
1541
+ children: /* @__PURE__ */ p(Y, {
1620
1542
  active: r === "dark",
1621
1543
  title: "Dark Theme",
1622
1544
  onClick: () => {
@@ -1635,16 +1557,16 @@ function dt({ variant: e = "dropdown", showLabel: n = !1 }) {
1635
1557
  }
1636
1558
  //#endregion
1637
1559
  //#region components/typing-animation.tsx
1638
- function ft(e) {
1560
+ function lt(e) {
1639
1561
  return e === "newline" ? "\n" : e === "comma" ? ", " : "";
1640
1562
  }
1641
- function pt(e, t, n, r, i) {
1563
+ function ut(e, t, n, r, i) {
1642
1564
  if (r === "character") return Math.max(0, Math.min(e.length, t + n * i));
1643
1565
  let a = [...e.matchAll(/\S+\s*/g)].map((e) => e.index + e[0].length), o = t;
1644
1566
  for (let t = 0; t < n; t += 1) o = i === 1 ? a.find((e) => e > o) ?? e.length : [...a].reverse().find((e) => e < o) ?? 0;
1645
1567
  return o;
1646
1568
  }
1647
- function mt({ strings: e, placeholder: t, perTick: n = {
1569
+ function dt({ strings: e, placeholder: t, perTick: n = {
1648
1570
  amount: 1,
1649
1571
  unit: "character"
1650
1572
  }, msDelay: r = {
@@ -1689,9 +1611,9 @@ function mt({ strings: e, placeholder: t, perTick: n = {
1689
1611
  T([]), C(""), N.current += 1, P.current = 0, t = setTimeout(r, _);
1690
1612
  return;
1691
1613
  }
1692
- if (L.current) P.current = pt(i, P.current, b, x, -1), C(i.slice(0, P.current)), P.current === 0 && (L.current = !1, N.current = (N.current + 1) % e.length);
1614
+ if (L.current) P.current = ut(i, P.current, b, x, -1), C(i.slice(0, P.current)), P.current === 0 && (L.current = !1, N.current = (N.current + 1) % e.length);
1693
1615
  else {
1694
- if (P.current = pt(i, P.current, b, x, 1), C(i.slice(0, P.current)), L.current = !n && P.current === i.length && (s || N.current < e.length - 1), !n && P.current === i.length && !L.current && !s) {
1616
+ if (P.current = ut(i, P.current, b, x, 1), C(i.slice(0, P.current)), L.current = !n && P.current === i.length && (s || N.current < e.length - 1), !n && P.current === i.length && !L.current && !s) {
1695
1617
  k(!0);
1696
1618
  return;
1697
1619
  }
@@ -1724,7 +1646,7 @@ function mt({ strings: e, placeholder: t, perTick: n = {
1724
1646
  O,
1725
1647
  v
1726
1648
  ]);
1727
- let R = A ? "." : "", z = d !== "clear", B = ft(d), ee = w.reduce((e, t) => e + t.split("\n").length, 0);
1649
+ let R = A ? "." : "", z = d !== "clear", B = lt(d), ee = w.reduce((e, t) => e + t.split("\n").length, 0);
1728
1650
  return z ? /* @__PURE__ */ f("div", {
1729
1651
  ref: (e) => {
1730
1652
  M.current = e;
@@ -1755,4 +1677,39 @@ function mt({ strings: e, placeholder: t, perTick: n = {
1755
1677
  });
1756
1678
  }
1757
1679
  //#endregion
1758
- export { Ae as Avatar, V as Button, Se as ButtonGroup, q as Card, ze as DateHandler, je as Divider, we as DoubleClickButton, Me as Dropdown, H as ErrorText, Fe as GridLoader, K as Input, Be as InputTimestamp, Ie as LabelField, Te as LongPressButton, Y as Menu, We as Modal, Ge as MultiDropdown, J as Pill, He as PillLink, G as PreviewCard, X as Select, it as Switch, $e as Table, qe as Tag, rt as TextLink, dt as ThemeSwitcher, mt as TypingAnimation, Ee as navigateToHashOnLoad, Oe as updateHashOnScroll, De as useHashNavigationOnLoad };
1680
+ //#region utilities/hash-navigation.ts
1681
+ function ft({ intervalMs: e = 500, maxAttempts: t = 20, behavior: n = "smooth", block: r } = {}) {
1682
+ if (typeof window > "u") return () => {};
1683
+ let i = 0, a = setInterval(() => {
1684
+ i += 1;
1685
+ let { hash: e } = window.location;
1686
+ if (!e || i > t) clearInterval(a);
1687
+ else try {
1688
+ let t = document.querySelector(e);
1689
+ t && (t.scrollIntoView({
1690
+ behavior: n,
1691
+ block: r
1692
+ }), clearInterval(a));
1693
+ } catch (t) {
1694
+ console.error(`Invalid hash in URL: ${e}`, t), clearInterval(a);
1695
+ }
1696
+ }, e);
1697
+ return () => clearInterval(a);
1698
+ }
1699
+ function pt(e) {
1700
+ o(() => ft(e), []);
1701
+ }
1702
+ function mt({ container: e, sectionIds: t, hashFirstSection: n = !0, onActiveChange: r }) {
1703
+ let i = t.map((e) => document.getElementById(e)).filter((e) => e !== null), a = window.location.hash.toLowerCase().slice(1) || null, o = () => {
1704
+ let t = e.getBoundingClientRect(), o = t.top + t.height / 2, s = i.find((e) => {
1705
+ let t = e.getBoundingClientRect();
1706
+ return t.top <= o && t.bottom > o;
1707
+ }), c = s ? i.indexOf(s) : -1;
1708
+ if (r?.(c, i), !s || (a === s.id.toLowerCase() && (a = null), c === 0 && a)) return;
1709
+ let l = c === 0 && !n ? "" : `#${s.id}`;
1710
+ window.location.hash !== l && (window.history.replaceState(window.history.state, "", `${window.location.pathname}${window.location.search}${l}`), window.dispatchEvent(new HashChangeEvent("hashchange")));
1711
+ };
1712
+ return o(), e.addEventListener("scroll", o, { passive: !0 }), () => e.removeEventListener("scroll", o);
1713
+ }
1714
+ //#endregion
1715
+ export { De as Avatar, V as Button, Se as ButtonGroup, q as Card, J as DateHandler, Oe as Divider, we as DoubleClickButton, ke as Dropdown, H as ErrorText, Me as GridLoader, K as Input, Ie as InputTimestamp, Ne as LabelField, Te as LongPressButton, X as Menu, Be as Modal, Ve as MultiDropdown, Y as Pill, Re as PillLink, G as PreviewCard, Z as Select, et as Switch, Ye as Table, Ue as Tag, $e as TextLink, ct as ThemeSwitcher, dt as TypingAnimation, ft as navigateToHashOnLoad, mt as updateHashOnScroll, pt as useHashNavigationOnLoad };
@@ -1,14 +1,16 @@
1
1
  declare const gridLoaderShapes: readonly ["circle", "square", "diamond", "star", "heart", "hexagon"];
2
2
  export type GridLoaderShape = (typeof gridLoaderShapes)[number] | "mixed";
3
+ export type GridLoaderCellShape = Exclude<GridLoaderShape, "mixed">;
3
4
  export interface GridLoaderProps extends React.ComponentPropsWithoutRef<"span"> {
4
5
  rows?: number;
5
6
  columns?: number;
6
7
  size?: number;
7
8
  maxSize?: number;
8
9
  shape?: GridLoaderShape;
10
+ shapes?: readonly GridLoaderCellShape[];
9
11
  colors?: string[];
10
12
  label?: string;
11
13
  symbols?: string[];
12
14
  }
13
- declare const GridLoader: ({ className, rows, columns, size, maxSize, shape, colors, label, symbols, style, ...props }: GridLoaderProps) => import('react').JSX.Element;
15
+ declare const GridLoader: ({ className, rows, columns, size, maxSize, shape, shapes, colors, label, symbols, style, ...props }: GridLoaderProps) => import('react').JSX.Element;
14
16
  export default GridLoader;
@@ -0,0 +1,44 @@
1
+ export { default as Button } from './button';
2
+ export { default as ButtonGroup } from './button-group';
3
+ export { default as DoubleClickButton } from './button-double-click';
4
+ export type { DoubleClickButtonFeedbackContent, DoubleClickButtonFeedbackContext, DoubleClickButtonProps, } from './button-double-click';
5
+ export { default as LongPressButton } from './button-long-press';
6
+ export type { LongPressButtonFeedbackContent, LongPressButtonFeedbackContext, LongPressButtonProps, } from './button-long-press';
7
+ export { default as Avatar } from './avatar';
8
+ export type { AvatarProps, AvatarSize } from './avatar';
9
+ export { default as Divider } from './divider';
10
+ export { default as Dropdown } from './dropdown';
11
+ export type { DropdownItem, DropdownProps } from './dropdown';
12
+ export { default as ErrorText } from './error-text';
13
+ export type { ErrorTextProps } from './error-text';
14
+ export { default as GridLoader } from './grid-loader';
15
+ export type { GridLoaderCellShape, GridLoaderProps, GridLoaderShape } from './grid-loader';
16
+ export { default as LabelField } from './label-field';
17
+ export type { LabelFieldProps } from './label-field';
18
+ export { default as Input } from './input';
19
+ export { default as Card } from './card';
20
+ export { default as InputTimestamp } from './input-timestamp';
21
+ export type { InputTimestampProps } from './input-timestamp';
22
+ export { default as PillLink } from './pill-link';
23
+ export type { PillLinkProps } from './pill-link';
24
+ export { default as Menu } from './menu';
25
+ export { default as Modal } from './modal';
26
+ export type { ModalProps } from './modal';
27
+ export { default as MultiDropdown } from './dropdown-multi';
28
+ export type { MultiDropdownProps } from './dropdown-multi';
29
+ export { default as Pill } from './pill';
30
+ export { default as PreviewCard } from './preview-card';
31
+ export type { PreviewCardProps } from './preview-card';
32
+ export { default as Select } from './select';
33
+ export type { SelectItem, SelectProps } from './select';
34
+ export { default as Tag } from './tag';
35
+ export type { TagProps, TagVariant } from './tag';
36
+ export { default as Table } from './table';
37
+ export type { TableColumnDef, TableProps } from './table';
38
+ export { default as TextLink } from './text-link';
39
+ export type { TextLinkProps } from './text-link';
40
+ export { default as Switch } from './switch';
41
+ export { default as ThemeSwitcher } from './theme-switcher';
42
+ export type { ThemeSwitcherProps } from './theme-switcher';
43
+ export { default as TypingAnimation } from './typing-animation';
44
+ export type { TypingAnimationPerTickUnit, TypingAnimationAfterString, TypingAnimationProps } from './typing-animation';
package/dist/index.d.ts CHANGED
@@ -1,47 +1,2 @@
1
- export { default as Button } from './button';
2
- export { default as ButtonGroup } from './button-group';
3
- export { default as DoubleClickButton } from './button-double-click';
4
- export type { DoubleClickButtonFeedbackContent, DoubleClickButtonFeedbackContext, DoubleClickButtonProps, } from './button-double-click';
5
- export { default as LongPressButton } from './button-long-press';
6
- export type { LongPressButtonFeedbackContent, LongPressButtonFeedbackContext, LongPressButtonProps, } from './button-long-press';
7
- export { navigateToHashOnLoad, updateHashOnScroll, useHashNavigationOnLoad } from './hash-navigation';
8
- export type { HashNavigationOptions, UpdateHashOnScrollOptions } from './hash-navigation';
9
- export { default as Avatar } from './avatar';
10
- export type { AvatarProps, AvatarSize } from './avatar';
11
- export { default as Divider } from './divider';
12
- export { default as Dropdown } from './dropdown';
13
- export type { DropdownItem, DropdownProps } from './dropdown';
14
- export { default as ErrorText } from './error-text';
15
- export type { ErrorTextProps } from './error-text';
16
- export { default as GridLoader } from './grid-loader';
17
- export type { GridLoaderProps, GridLoaderShape } from './grid-loader';
18
- export { default as LabelField } from './label-field';
19
- export type { LabelFieldProps } from './label-field';
20
- export { default as Input } from './input';
21
- export { default as Card } from './card';
22
- export { DateHandler } from './date-handler';
23
- export { default as InputTimestamp } from './input-timestamp';
24
- export type { InputTimestampProps } from './input-timestamp';
25
- export { default as PillLink } from './pill-link';
26
- export type { PillLinkProps } from './pill-link';
27
- export { default as Menu } from './menu';
28
- export { default as Modal } from './modal';
29
- export type { ModalProps } from './modal';
30
- export { default as MultiDropdown } from './dropdown-multi';
31
- export type { MultiDropdownProps } from './dropdown-multi';
32
- export { default as Pill } from './pill';
33
- export { default as PreviewCard } from './preview-card';
34
- export type { PreviewCardProps } from './preview-card';
35
- export { default as Select } from './select';
36
- export type { SelectItem, SelectProps } from './select';
37
- export { default as Tag } from './tag';
38
- export type { TagProps, TagVariant } from './tag';
39
- export { default as Table } from './table';
40
- export type { TableColumnDef, TableProps } from './table';
41
- export { default as TextLink } from './text-link';
42
- export type { TextLinkProps } from './text-link';
43
- export { default as Switch } from './switch';
44
- export { default as ThemeSwitcher } from './theme-switcher';
45
- export type { ThemeSwitcherProps } from './theme-switcher';
46
- export { default as TypingAnimation } from './typing-animation';
47
- export type { TypingAnimationPerTickUnit, TypingAnimationAfterString, TypingAnimationProps } from './typing-animation';
1
+ export * from './components';
2
+ export * from './utilities';
@@ -0,0 +1,3 @@
1
+ export { DateHandler } from './date-handler';
2
+ export { navigateToHashOnLoad, updateHashOnScroll, useHashNavigationOnLoad } from './hash-navigation';
3
+ export type { HashNavigationOptions, UpdateHashOnScrollOptions } from './hash-navigation';
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@febkosq8/arc",
3
3
  "description": "A React components library for febkosq8",
4
4
  "private": false,
5
- "version": "0.7.0",
5
+ "version": "0.8.0",
6
6
  "type": "module",
7
7
  "main": "./dist/arc.js",
8
8
  "types": "./dist/index.d.ts",
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes