@base-framework/ui 1.0.316 → 1.0.318

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.
@@ -1,8 +1,8 @@
1
- import { Div as l, H5 as se, P as v, I as w, Li as W, Span as c, Ul as G, Button as p, OnState as B, Label as j, H2 as $, Form as oe, Header as L, Footer as N, A as J, H3 as ne, Checkbox as re, Input as C, Img as K, Nav as le, UseParent as Q, OnStateOpen as O, Time as ie, Dialog as ae } from "@base-framework/atoms";
2
- import { Atom as u, Component as k, Html as z, Dom as ce, base as ue, Data as A, Builder as X, Jot as D, Events as y, DateTime as E } from "@base-framework/base";
1
+ import { Div as l, H5 as se, P as w, I as C, Li as W, Span as c, Ul as G, Button as b, OnState as B, Label as j, H2 as $, Form as oe, Header as L, Footer as N, A as J, H3 as ne, Checkbox as le, Input as f, Img as K, Nav as re, UseParent as Q, OnStateOpen as O, Time as ie, Dialog as ae } from "@base-framework/atoms";
2
+ import { Atom as u, Component as k, Html as z, Dom as ce, base as ue, Data as A, Builder as X, Jot as I, Events as v, DateTime as E } from "@base-framework/base";
3
3
  import { P as F, b as de, R as he } from "./range-calendar-BMWSJTE0.js";
4
- import { C as fe, F as me, a as I } from "./veil-CVCuKSvj.js";
5
- import { B as m, I as b } from "./buttons-CHEs54Wl.js";
4
+ import { C as fe, F as me, a as D } from "./veil-CVCuKSvj.js";
5
+ import { B as h, I as x } from "./buttons-CHEs54Wl.js";
6
6
  import { Icons as d } from "./icons.es.js";
7
7
  import { Timer as ge, List as pe, DynamicTime as be } from "@base-framework/organisms";
8
8
  import { F as U } from "./format-DnofNaaz.js";
@@ -33,8 +33,8 @@ const V = {
33
33
  iconColor: "text-muted-foreground"
34
34
  }
35
35
  }, xe = (e, t) => l({ class: `flex items-center justify-center h-6 w-6 mr-3 ${t}` }, [
36
- w({ html: e })
37
- ]), ye = (e) => se({ class: "font-semibold" }, e), ve = (e) => v({ class: "text-sm text-muted-foreground" }, e), Ft = u(({ title: e, description: t, icon: s, type: o = "default" }) => {
36
+ C({ html: e })
37
+ ]), ye = (e) => se({ class: "font-semibold" }, e), ve = (e) => w({ class: "text-sm text-muted-foreground" }, e), Bt = u(({ title: e, description: t, icon: s, type: o = "default" }) => {
38
38
  const { borderColor: n, bgColor: r, iconColor: i } = V[o] || V.default;
39
39
  return l({ class: `flex items-start p-4 border rounded-lg ${r} ${n}` }, [
40
40
  // Icon and content
@@ -45,7 +45,7 @@ const V = {
45
45
  ])
46
46
  ]);
47
47
  });
48
- class Tt extends k {
48
+ class Lt extends k {
49
49
  /**
50
50
  * This will declare the props for the compiler.
51
51
  *
@@ -76,14 +76,14 @@ const we = (e) => c({ class: "ml-auto text-xs tracking-widest opacity-60" }, e),
76
76
  e.icon && Ce(e.icon),
77
77
  Se(e.label),
78
78
  e.shortcut && we(e.shortcut)
79
- ]), De = (e, t) => G({ class: "grid gap-2" }, [
79
+ ]), Ie = (e, t) => G({ class: "grid gap-2" }, [
80
80
  e.map((s) => ke(s, t))
81
- ]), Ie = (e) => l({ class: "w-full z-10" }, [
81
+ ]), De = (e) => l({ class: "w-full z-10" }, [
82
82
  l({
83
83
  class: "max-h-60 border rounded-md overflow-y-auto p-1 grid gap-2 divide-y divide-border",
84
- for: ["groups", (t) => De(t, e)]
84
+ for: ["groups", (t) => Ie(t, e)]
85
85
  })
86
- ]), $e = ({ label: e, icon: t, toggleDropdown: s }) => p({
86
+ ]), $e = ({ label: e, icon: t, toggleDropdown: s }) => b({
87
87
  cache: "button",
88
88
  class: `inline-flex items-center justify-between rounded-md border
89
89
  px-2 py-2 text-sm font-medium hover:bg-muted
@@ -91,7 +91,7 @@ const we = (e) => c({ class: "ml-auto text-xs tracking-widest opacity-60" }, e),
91
91
  click: s
92
92
  }, [
93
93
  e && c(e),
94
- t && w({ html: t })
94
+ t && C({ html: t })
95
95
  ]), Fe = ({ onSelect: e }) => l([
96
96
  B(
97
97
  "open",
@@ -100,11 +100,11 @@ const we = (e) => c({ class: "ml-auto text-xs tracking-widest opacity-60" }, e),
100
100
  parent: o,
101
101
  button: o.button
102
102
  }, [
103
- Ie(e)
103
+ De(e)
104
104
  ]) : null
105
105
  )
106
106
  ]);
107
- class Bt extends k {
107
+ class At extends k {
108
108
  /**
109
109
  * This will declare the props for the compiler.
110
110
  *
@@ -167,13 +167,13 @@ class Bt extends k {
167
167
  ]);
168
168
  }
169
169
  }
170
- const Te = u((e, t) => l({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t)), Be = u((e, t) => j({ ...e, class: "flex auto text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, t)), Le = u((e, t) => v({ ...e, class: "text-sm text-muted-foreground italic" }, t)), Ae = u((e, t) => v({ ...e, class: "text-sm text-destructive" }, t)), Lt = u((e, t = []) => fe({ class: "flex flex-auto flex-col gap-y-0", margin: "m-0", padding: "p-0" }, [
170
+ const Te = u((e, t) => l({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t)), Be = u((e, t) => j({ ...e, class: "flex auto text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" }, t)), Le = u((e, t) => w({ ...e, class: "text-sm text-muted-foreground italic" }, t)), Ae = u((e, t) => w({ ...e, class: "text-sm text-destructive" }, t)), Mt = u((e, t = []) => fe({ class: "flex flex-auto flex-col gap-y-0", margin: "m-0", padding: "p-0" }, [
171
171
  e.title && $({ class: "text-lg font-semibold py-4 px-6" }, e.title),
172
- e.description && v({ class: "text-sm text-muted-foreground pb-4 px-6 max-w-[700px]" }, e.description),
172
+ e.description && w({ class: "text-sm text-muted-foreground pb-4 px-6 max-w-[700px]" }, e.description),
173
173
  ...t
174
- ])), At = u((e, t = []) => me({ label: e.label, description: e.description, class: "py-4 px-6", border: e.border }, [
174
+ ])), Pt = u((e, t = []) => me({ label: e.label, description: e.description, class: "py-4 px-6", border: e.border }, [
175
175
  l({ class: "flex flex-col gap-y-6" }, t)
176
- ])), Mt = u((e, t = []) => {
176
+ ])), jt = u((e, t = []) => {
177
177
  const s = e.border ? "border-t" : "";
178
178
  return l({ ...e, class: `flex flex-col pb-4 px-6 gap-y-4 ${s} ${e.class || ""}` }, t);
179
179
  }), Me = (e) => e.tag === "input" || e.tag === "select" || e.tag === "textarea", Z = (e, t, s) => e.map((o) => !o || (o.children && o.children.length > 0 && (o.children = Z(o.children, t, s)), !o.required) ? o : Me(o) ? {
@@ -193,7 +193,7 @@ const Te = u((e, t) => l({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
193
193
  ...e,
194
194
  class: "w-full"
195
195
  }, n);
196
- }), Pt = I(
196
+ }), Nt = D(
197
197
  {
198
198
  /**
199
199
  * The initial state of the FormField.
@@ -236,24 +236,24 @@ const Te = u((e, t) => l({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
236
236
  e.target.checkValidity() && (e.preventDefault(), s && s(e, t));
237
237
  }, ee = u(
238
238
  (e, t) => oe({ ...e, submit: (s, o) => je(s, o, e.submit), class: `w-full ${e.class ?? ""}` }, t)
239
- ), jt = u((e, t) => l({ ...e, class: `flex flex-auto flex-col gap-y-6 p-4 md:p-6 divide-y ${e.class || ""}` }, t)), Nt = u((e, t = []) => l({ class: "flex flex-col gap-y-3 py-4" }, [
239
+ ), Ot = u((e, t) => l({ ...e, class: `flex flex-auto flex-col gap-y-6 p-4 md:p-6 divide-y ${e.class || ""}` }, t)), zt = u((e, t = []) => l({ class: "flex flex-col gap-y-3 py-4" }, [
240
240
  e.title && $({ class: "font-semibold" }, e.title),
241
241
  ...t
242
- ])), Ot = (e, t) => l({ class: "flex justify-between" }, [
242
+ ])), Et = (e, t) => l({ class: "flex justify-between" }, [
243
243
  c({ class: "text-muted-foreground" }, e),
244
244
  c(t)
245
- ]), zt = (e, t) => l({ class: "flex" }, [
245
+ ]), Ut = (e, t) => l({ class: "flex" }, [
246
246
  c({ class: "text-muted-foreground mr-8 w-24 truncate text-nowrap" }, e),
247
247
  c(t)
248
248
  ]), Ne = ({ title: e, description: t, back: s, icon: o, options: n = [] }) => L({ class: "modal-header bg-background/80 backdrop-blur-md sticky flex flex-none items-center py-4 px-6 z-10" }, [
249
249
  /**
250
250
  * Back Button
251
251
  */
252
- s && m({ variant: "icon", icon: d.arrows.left, class: "mr-2 p-0 flex sm:hidden", click: (r, i) => i.close() }),
252
+ s && h({ variant: "icon", icon: d.arrows.left, class: "mr-2 p-0 flex sm:hidden", click: (r, i) => i.close() }),
253
253
  /**
254
254
  * Icon
255
255
  */
256
- o && l({ class: "mr-2 w-12 h-12 rounded-full bg-muted flex flex-none items-center justify-center" }, [b(o)]),
256
+ o && l({ class: "mr-2 w-12 h-12 rounded-full bg-muted flex flex-none items-center justify-center" }, [x(o)]),
257
257
  /**
258
258
  * Title and Description
259
259
  */
@@ -277,7 +277,7 @@ const Te = u((e, t) => l({ ...e, class: "flex flex-auto flex-col gap-y-2" }, t))
277
277
  N({ class: "modal-footer sticky bg-background/80 backdrop-blur-md flex flex-none justify-between py-4 px-6 z-10" }, e.buttons)
278
278
  ])
279
279
  ])), ze = (e) => X.render(e, app.root);
280
- class Et extends k {
280
+ class Vt extends k {
281
281
  /**
282
282
  * This will declare the props for the compiler.
283
283
  *
@@ -341,8 +341,8 @@ class Et extends k {
341
341
  */
342
342
  getButtons() {
343
343
  return [
344
- m({ variant: "outline", click: () => this.destroy() }, "Cancel"),
345
- this.hidePrimaryButton !== !0 && m({ variant: "primary", type: "submit" }, "Save")
344
+ h({ variant: "outline", click: () => this.destroy() }, "Cancel"),
345
+ this.hidePrimaryButton !== !0 && h({ variant: "primary", type: "submit" }, "Save")
346
346
  ];
347
347
  }
348
348
  /**
@@ -536,8 +536,8 @@ class Re extends k {
536
536
  getButtons() {
537
537
  return [
538
538
  l({ class: "flex flex-row mt-6 gap-2" }, [
539
- this.secondary && m({ variant: "outline", click: () => this.secondaryAction && this.secondaryAction() }, this.secondary),
540
- this.primary && m({ click: () => this.primaryAction && this.primaryAction() }, this.primary)
539
+ this.secondary && h({ variant: "outline", click: () => this.secondaryAction && this.secondaryAction() }, this.secondary),
540
+ this.primary && h({ click: () => this.primaryAction && this.primaryAction() }, this.primary)
541
541
  ])
542
542
  ];
543
543
  }
@@ -550,16 +550,16 @@ class Re extends k {
550
550
  getChildren(t) {
551
551
  return [
552
552
  l({ class: "flex items-start" }, [
553
- this.icon && w({ class: `mr-4 ${t}`, html: this.icon }),
553
+ this.icon && C({ class: `mr-4 ${t}`, html: this.icon }),
554
554
  l({ class: "flex flex-auto flex-col" }, [
555
555
  l({ class: "flex flex-auto flex-row items-center w-full pr-12" }, [
556
556
  this.title && Ee(this.title)
557
557
  ]),
558
- v({ class: "text-base text-muted-foreground m-0 pr-12" }, this.description),
558
+ w({ class: "text-base text-muted-foreground m-0 pr-12" }, this.description),
559
559
  (this.primary || this.secondary) && N({ class: "margin-top-24 flex align-center" }, this.getButtons())
560
560
  ])
561
561
  ]),
562
- m({
562
+ h({
563
563
  class: "absolute top-[12px] right-[12px]",
564
564
  variant: "icon",
565
565
  icon: d.x,
@@ -577,8 +577,8 @@ class Re extends k {
577
577
  t && t.stopPropagation(), this.duration !== "infinite" && this.timer.stop(), this.onClick && this.onClick(), this.destroy();
578
578
  }
579
579
  }
580
- let Ye = 0;
581
- class Ut extends k {
580
+ let He = 0;
581
+ class Rt extends k {
582
582
  /**
583
583
  * This will render the component.
584
584
  *
@@ -601,7 +601,7 @@ class Ut extends k {
601
601
  * @returns {void}
602
602
  */
603
603
  addNotice(t = {}) {
604
- t.id = Ye++, t.callBack = () => this.removeNotice(t), this.list.append([t]), this.panel.hidePopover(), this.panel.showPopover();
604
+ t.id = He++, t.callBack = () => this.removeNotice(t), this.list.append([t]), this.panel.hidePopover(), this.panel.showPopover();
605
605
  }
606
606
  /**
607
607
  * This will remove a notification.
@@ -613,25 +613,25 @@ class Ut extends k {
613
613
  this.list.delete(t.id), this.list.isEmpty() && this.panel.hidePopover();
614
614
  }
615
615
  }
616
- const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
616
+ const H = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => b({
617
617
  class: 'text-sm gap-1 font-medium leading-none disabled:cursor-not-allowed disabled:opacity-70 flex flex-col items-center justify-between rounded-md border-2 bg-popover p-4 hover:bg-accent hover:text-accent-foreground data-[state="active"]:border-primary [&:has([data-state="active"])]:border-primary',
618
618
  onState: ["method", { active: e }],
619
619
  dataSet: ["method", ["state", e, "active"]],
620
620
  click: (o, { state: n }) => {
621
- n.method = e, localStorage.setItem("theme", e), e === "system" && localStorage.removeItem("theme"), qe(e);
621
+ n.method = e, localStorage.setItem("theme", e), e === "system" && localStorage.removeItem("theme"), Ye(e);
622
622
  }
623
623
  }, [
624
- b(s),
624
+ x(s),
625
625
  c(t)
626
- ])), qe = (e) => {
626
+ ])), Ye = (e) => {
627
627
  const t = document.documentElement;
628
- if (e === "system" && (e = globalThis.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light"), Y && !Y("(prefers-color-scheme: " + e + ")").matches) {
628
+ if (e === "system" && (e = globalThis.matchMedia?.("(prefers-color-scheme: dark)").matches ? "dark" : "light"), H && !H("(prefers-color-scheme: " + e + ")").matches) {
629
629
  t.classList.add(e);
630
630
  return;
631
631
  }
632
632
  const s = e === "light" ? "dark" : "light";
633
633
  t.classList.remove(s);
634
- }, Vt = D(
634
+ }, Ht = I(
635
635
  {
636
636
  /**
637
637
  * This will render the component.
@@ -658,7 +658,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
658
658
  };
659
659
  }
660
660
  }
661
- ), Rt = I(
661
+ ), Yt = D(
662
662
  {
663
663
  /**
664
664
  * The initial state of the Toggle.
@@ -685,14 +685,14 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
685
685
  * @returns {object}
686
686
  */
687
687
  render() {
688
- return p({
688
+ return b({
689
689
  class: "relative inline-flex h-6 w-11 min-w-11 items-center rounded-full bg-muted transition-colors focus:outline-none",
690
690
  onState: ["active", { "bg-primary": !0, "bg-muted": !1 }],
691
691
  click: (t, { state: s }) => {
692
692
  s.toggle("active"), this.checkbox.checked = s.active, this.change && this.change(s.active, t, this);
693
693
  }
694
694
  }, [
695
- re({
695
+ le({
696
696
  cache: "checkbox",
697
697
  class: "opacity-0 absolute top-0 left-0 bottom-0 right-0 w-full h-full",
698
698
  /**
@@ -720,9 +720,9 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
720
720
  OFFLINE: "bg-gray-500",
721
721
  BUSY: "bg-red-500",
722
722
  AWAY: "bg-yellow-500"
723
- }, He = (e = "") => (e = e.toUpperCase(), S[e] || S.OFFLINE), Yt = (e) => l({
724
- class: `absolute bottom-0 right-0 w-3 h-3 border-2 rounded-full ${He(e)}`
725
- }), qt = ({ propName: e = "status" } = {}) => l({
723
+ }, qe = (e = "") => (e = e.toUpperCase(), S[e] || S.OFFLINE), qt = (e) => l({
724
+ class: `absolute bottom-0 right-0 w-3 h-3 border-2 rounded-full ${qe(e)}`
725
+ }), _t = ({ propName: e = "status" } = {}) => l({
726
726
  class: "absolute bottom-0 right-0 w-3 h-3 border-2 rounded-full",
727
727
  onSet: [e, {
728
728
  [S.ONLINE]: T.ONLINE,
@@ -730,7 +730,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
730
730
  [S.BUSY]: T.BUSY,
731
731
  [S.AWAY]: T.AWAY
732
732
  }]
733
- }), _e = (e) => e.indexOf(".") === -1 && e.indexOf("[[") === -1, Ht = D(
733
+ }), _e = (e) => e.indexOf(".") === -1 && e.indexOf("[[") === -1, Wt = I(
734
734
  {
735
735
  /**
736
736
  * Get the initial state for the component.
@@ -750,7 +750,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
750
750
  */
751
751
  openFileBrowse() {
752
752
  const e = this.input;
753
- e && (e.value = "", y.trigger("click", e));
753
+ e && (e.value = "", v.trigger("click", e));
754
754
  },
755
755
  /**
756
756
  * Get the URL for the uploaded file.
@@ -769,7 +769,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
769
769
  render() {
770
770
  const e = "image-upload", t = this.onChange || null;
771
771
  return l({ class: "flex-none items-center" }, [
772
- C({
772
+ f({
773
773
  id: e,
774
774
  cache: "input",
775
775
  type: "file",
@@ -790,7 +790,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
790
790
  htmlFor: e,
791
791
  class: "z-10 flex flex-col items-center justify-center text-sm text-muted-foreground group-hover:text-primary"
792
792
  }, [
793
- b(d.upload),
793
+ x(d.upload),
794
794
  l("Upload Image")
795
795
  ]) : K({
796
796
  // @ts-ignore
@@ -801,7 +801,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
801
801
  ]);
802
802
  }
803
803
  }
804
- ), _t = D(
804
+ ), Gt = I(
805
805
  {
806
806
  /**
807
807
  * Get the initial state for the component.
@@ -821,7 +821,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
821
821
  */
822
822
  openFileBrowse() {
823
823
  const e = this.input;
824
- e && (e.value = "", y.trigger("click", e));
824
+ e && (e.value = "", v.trigger("click", e));
825
825
  },
826
826
  /**
827
827
  * Get the URL for the uploaded file.
@@ -840,7 +840,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
840
840
  render() {
841
841
  const e = "logo-upload", t = this.onChange || null;
842
842
  return l({ class: "flex-none items-center" }, [
843
- C({
843
+ f({
844
844
  id: e,
845
845
  cache: "input",
846
846
  type: "file",
@@ -867,7 +867,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
867
867
  htmlFor: e,
868
868
  class: "z-10 flex flex-col items-center justify-center text-sm text-muted-foreground group-hover:text-primary"
869
869
  }, [
870
- b(d.upload),
870
+ x(d.upload),
871
871
  l("Upload logo")
872
872
  ])
873
873
  )
@@ -883,14 +883,14 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
883
883
  class: "text-muted-foreground font-medium hover:text-foreground"
884
884
  },
885
885
  [c(t)]
886
- ), Ge = () => b({
886
+ ), Ge = () => x({
887
887
  class: "mx-3 text-muted-foreground",
888
888
  "aria-hidden": !0,
889
889
  size: "xs"
890
890
  }, d.chevron.single.right), Je = (e) => l({ class: "flex items-center" }, [
891
891
  e.href ? We(e.href, e.label) : c(e.label),
892
892
  e.separator && Ge()
893
- ]), Wt = D(
893
+ ]), Jt = I(
894
894
  {
895
895
  /**
896
896
  * Set initial data
@@ -910,7 +910,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
910
910
  */
911
911
  render() {
912
912
  const e = this.data.items.length - 1;
913
- return le(
913
+ return re(
914
914
  {
915
915
  "aria-label": "Breadcrumb",
916
916
  class: "flex items-center gap-x-1 text-sm"
@@ -929,7 +929,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
929
929
  );
930
930
  }
931
931
  }
932
- ), q = {
932
+ ), Y = {
933
933
  xs: "h-1 w-1",
934
934
  sm: "h-2 w-2",
935
935
  md: "h-4 w-4",
@@ -938,7 +938,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
938
938
  "2xl": "h-16 w-16",
939
939
  "3xl": "h-24 w-24",
940
940
  default: "h-4 w-4"
941
- }, Ke = (e) => q[e] || q.default, Qe = ({ index: e, size: t }) => l({ class: `${t} rounded-full bg-muted cursor-pointer` }, [
941
+ }, Ke = (e) => Y[e] || Y.default, Qe = ({ index: e, size: t }) => l({ class: `${t} rounded-full bg-muted cursor-pointer` }, [
942
942
  c({
943
943
  class: "block w-full h-full rounded-full transition-colors",
944
944
  onSet: ["activeIndex", {
@@ -952,7 +952,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
952
952
  ]), Xe = (e, t) => Array.from({ length: e }, (s, o) => Qe({
953
953
  index: o,
954
954
  size: t
955
- })), Gt = D(
955
+ })), Kt = I(
956
956
  {
957
957
  /**
958
958
  * Defines component data (props).
@@ -983,7 +983,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
983
983
  );
984
984
  }
985
985
  }
986
- ), Ze = ({ toggleDropdown: e }) => p(
986
+ ), Ze = ({ toggleDropdown: e }) => b(
987
987
  {
988
988
  cache: "button",
989
989
  class: "relative z-[2] inline-flex items-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border bg-input hover:bg-muted h-10 px-4 py-2 justify-between",
@@ -991,14 +991,14 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
991
991
  },
992
992
  [
993
993
  c({ onState: ["selectedLabel", (t) => t || "Select item..."] }),
994
- w({ html: d.chevron.upDown })
994
+ C({ html: d.chevron.upDown })
995
995
  ]
996
996
  ), et = (e, t, s) => W({
997
997
  class: "flex flex-auto items-center cursor-pointer p-2 hover:bg-muted/50 rounded-sm",
998
998
  click: () => t(e),
999
999
  onState: [s, "selectedValue", { "bg-secondary": e.value }]
1000
1000
  }, [
1001
- e.icon && c({ class: "mr-2 flex items-baseline" }, [b({ size: "xs" }, e.icon)]),
1001
+ e.icon && c({ class: "mr-2 flex items-baseline" }, [x({ size: "xs" }, e.icon)]),
1002
1002
  c({ class: "text-base font-normal" }, e.label)
1003
1003
  ]), tt = (e, t) => l({ class: "w-full border rounded-md" }, [
1004
1004
  G({ class: "max-h-60 overflow-y-auto p-2 grid gap-1", for: ["items", (s) => et(s, e, t)] })
@@ -1013,7 +1013,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1013
1013
  tt(e, t)
1014
1014
  ]) : null
1015
1015
  )
1016
- ]), Jt = D(
1016
+ ]), Qt = I(
1017
1017
  {
1018
1018
  /**
1019
1019
  * This will set up the data.
@@ -1103,7 +1103,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1103
1103
  }),
1104
1104
  // Hidden required input for form validation
1105
1105
  // @ts-ignore
1106
- this.required && C({
1106
+ this.required && f({
1107
1107
  class: "opacity-0 absolute top-0 left-0 z-[1]",
1108
1108
  type: "text",
1109
1109
  // @ts-ignore
@@ -1115,7 +1115,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1115
1115
  ]);
1116
1116
  }
1117
1117
  }
1118
- ), te = ({ icon: e, click: t, ariaLabel: s }) => m({
1118
+ ), te = ({ icon: e, click: t, ariaLabel: s }) => h({
1119
1119
  variant: "icon",
1120
1120
  class: "flex flex-none",
1121
1121
  click: t,
@@ -1129,7 +1129,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1129
1129
  icon: d.circlePlus,
1130
1130
  click: e,
1131
1131
  ariaLabel: "Increment"
1132
- }), rt = ({ bind: e, min: t, max: s, readonly: o = !1 }) => Q(({ state: n }) => C({
1132
+ }), lt = ({ bind: e, min: t, max: s, readonly: o = !1 }) => Q(({ state: n }) => f({
1133
1133
  value: ["[[count]]", n],
1134
1134
  bind: e,
1135
1135
  blur: (r, { state: i }) => {
@@ -1142,7 +1142,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1142
1142
  max: s,
1143
1143
  type: "number",
1144
1144
  "aria-label": "Counter"
1145
- })), Kt = I(
1145
+ })), Xt = D(
1146
1146
  {
1147
1147
  /**
1148
1148
  * Initial state for the counter component.
@@ -1166,7 +1166,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1166
1166
  const e = this.class ?? "";
1167
1167
  return l({ class: `flex flex-auto items-center justify-between gap-x-4 p-4 ${e}` }, [
1168
1168
  ot({ click: () => this.state.decrement("count") }),
1169
- rt({
1169
+ lt({
1170
1170
  bind: this.bind,
1171
1171
  readonly: this.readonly,
1172
1172
  min: this.min,
@@ -1176,41 +1176,45 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1176
1176
  ]);
1177
1177
  }
1178
1178
  }
1179
- ), lt = ({ placeholder: e, handleInputChange: t, handleInputFocus: s, bind: o, required: n }) => C({
1179
+ ), rt = ({ bind: e, required: t }) => f({
1180
+ cache: "input",
1181
+ class: "opacity-0 absolute top-0 left-0 w-full h-full pointer-events-none",
1182
+ bind: e,
1183
+ required: t
1184
+ }), it = ({ placeholder: e, handleInputChange: t, handleInputFocus: s }) => f({
1180
1185
  cache: "dateInput",
1181
1186
  class: "flex-1 bg-transparent outline-none placeholder:text-muted-foreground border-0",
1182
1187
  placeholder: e || "mm/dd/yyyy",
1183
1188
  input: t,
1184
1189
  focus: s,
1185
- bind: o,
1186
- required: n,
1187
- onState: ["selectedDate", (r) => {
1188
- if (r) {
1189
- const i = new Date(r);
1190
- if (!isNaN(i.getTime())) {
1191
- const a = (i.getMonth() + 1).toString().padStart(2, "0"), h = i.getDate().toString().padStart(2, "0"), f = i.getFullYear();
1192
- return `${a}/${h}/${f}`;
1190
+ onState: ["selectedDate", (o) => {
1191
+ if (o) {
1192
+ const n = new Date(o);
1193
+ if (!isNaN(n.getTime())) {
1194
+ const r = (n.getMonth() + 1).toString().padStart(2, "0"), i = n.getDate().toString().padStart(2, "0"), a = n.getFullYear();
1195
+ return `${r}/${i}/${a}`;
1193
1196
  }
1194
1197
  }
1195
1198
  return "";
1196
1199
  }]
1197
- }), it = ({ bind: e, required: t, toggleOpen: s, handleInputChange: o, handleInputFocus: n, placeholder: r }) => l(
1200
+ }), at = ({ bind: e, required: t, toggleOpen: s, handleInputChange: o, handleInputFocus: n, placeholder: r }) => l(
1198
1201
  {
1199
1202
  class: "relative flex items-center gap-2 w-full justify-between border bg-input hover:bg-muted rounded-md h-10 pr-4 py-2"
1200
1203
  },
1201
1204
  [
1202
- lt({ placeholder: r, handleInputChange: o, handleInputFocus: n, bind: e, required: t }),
1203
- p(
1205
+ rt({ bind: e, required: t }),
1206
+ it({ placeholder: r, handleInputChange: o, handleInputFocus: n }),
1207
+ b(
1204
1208
  {
1205
1209
  class: "flex-shrink-0 hover:bg-muted/50 rounded p-1",
1206
1210
  click: s
1207
1211
  },
1208
1212
  [
1209
- w({ html: d.calendar.days })
1213
+ C({ html: d.calendar.days })
1210
1214
  ]
1211
1215
  )
1212
1216
  ]
1213
- ), at = ({ handleDateSelect: e, blockPriorDates: t }) => O(
1217
+ ), ct = ({ handleDateSelect: e, blockPriorDates: t }) => O(
1214
1218
  (s, o, n) => new F({
1215
1219
  cache: "dropdown",
1216
1220
  parent: n,
@@ -1223,7 +1227,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1223
1227
  blockPriorDates: t
1224
1228
  })
1225
1229
  ])
1226
- ), Qt = I(
1230
+ ), Zt = D(
1227
1231
  {
1228
1232
  /**
1229
1233
  * The initial state of the DatePicker.
@@ -1255,21 +1259,21 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1255
1259
  const i = n.target.value.replace(/\D/g, "");
1256
1260
  let a = "";
1257
1261
  if (i.length > 0 && (a = i.substring(0, 2), i.length > 2 && (a += "/" + i.substring(2, 4), i.length > 4 && (a += "/" + i.substring(4, 8)))), n.target.value = a, i.length === 8) {
1258
- const h = parseInt(i.substring(0, 2), 10), f = parseInt(i.substring(2, 4), 10), x = parseInt(i.substring(4, 8), 10);
1259
- if (h >= 1 && h <= 12 && f >= 1 && f <= 31 && x >= 1900) {
1260
- const g = `${x}-${h.toString().padStart(2, "0")}-${f.toString().padStart(2, "0")}`;
1261
- this.state.selectedDate = g, this.input.value = g, y.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(g);
1262
+ const m = parseInt(i.substring(0, 2), 10), g = parseInt(i.substring(2, 4), 10), y = parseInt(i.substring(4, 8), 10);
1263
+ if (m >= 1 && m <= 12 && g >= 1 && g <= 31 && y >= 1900) {
1264
+ const p = `${y}-${m.toString().padStart(2, "0")}-${g.toString().padStart(2, "0")}`;
1265
+ this.state.selectedDate = p, this.input.value = p, v.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(p);
1262
1266
  }
1263
1267
  }
1264
1268
  }, s = (n) => {
1265
1269
  n.target.select();
1266
1270
  }, o = (n) => {
1267
- this.state.selectedDate = n, this.state.open = !1, this.input.value = n, y.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(n);
1271
+ this.state.selectedDate = n, this.state.open = !1, this.input.value = n, v.trigger("change", this.input), typeof this.onChange == "function" && this.onChange(n);
1268
1272
  };
1269
1273
  return l(
1270
1274
  { class: "relative w-full max-w-[320px]" },
1271
1275
  [
1272
- it({
1276
+ at({
1273
1277
  toggleOpen: e,
1274
1278
  bind: this.bind,
1275
1279
  required: this.required,
@@ -1277,7 +1281,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1277
1281
  handleInputFocus: s,
1278
1282
  placeholder: this.placeholder
1279
1283
  }),
1280
- at({
1284
+ ct({
1281
1285
  handleDateSelect: o,
1282
1286
  blockPriorDates: this.blockPriorDates || !1
1283
1287
  })
@@ -1285,23 +1289,23 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1285
1289
  );
1286
1290
  }
1287
1291
  }
1288
- ), ct = ({ bind: e, required: t }) => C({
1292
+ ), ut = ({ bind: e, required: t }) => f({
1289
1293
  cache: "input",
1290
1294
  class: "opacity-0 absolute top-0 left-0 w-full h-full pointer-events-none",
1291
1295
  bind: e,
1292
1296
  required: t
1293
- }), ut = ({ bind: e, required: t, toggleOpen: s }) => p({
1297
+ }), dt = ({ bind: e, required: t, toggleOpen: s }) => b({
1294
1298
  class: "relative flex items-center gap-2 w-full justify-between border bg-input hover:bg-muted rounded-md h-10 px-4 py-2",
1295
1299
  click: s
1296
1300
  }, [
1297
- ct({ bind: e, required: t }),
1301
+ ut({ bind: e, required: t }),
1298
1302
  Q(({ state: o }) => [
1299
1303
  c(U.date(["[[start]]", o], "Start Date")),
1300
1304
  c(" - "),
1301
1305
  c(U.date(["[[end]]", o], "End Date"))
1302
1306
  ]),
1303
- w({ html: d.calendar.days })
1304
- ]), dt = ({ handleDateSelect: e, blockPriorDates: t }) => O((s, o, n) => new F({
1307
+ C({ html: d.calendar.days })
1308
+ ]), ht = ({ handleDateSelect: e, blockPriorDates: t }) => O((s, o, n) => new F({
1305
1309
  cache: "dropdown",
1306
1310
  parent: n,
1307
1311
  button: n.panel,
@@ -1313,7 +1317,7 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1313
1317
  onRangeSelect: e,
1314
1318
  blockPriorDates: t
1315
1319
  })
1316
- ])), Xt = I(
1320
+ ])), es = D(
1317
1321
  {
1318
1322
  /**
1319
1323
  * The initial state of the DateRangePicker.
@@ -1346,22 +1350,22 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1346
1350
  */
1347
1351
  render() {
1348
1352
  const e = (s, { state: o }) => o.toggle("open"), t = (s, o) => {
1349
- this.state.start = s, this.state.end = o, this.state.open = !1, this.input.value = `${s}-${o}`, y.trigger("change", this.input), typeof this.onChange == "function" && this.onChange({ start: s, end: o }, this.parent);
1353
+ this.state.start = s, this.state.end = o, this.state.open = !1, this.input.value = `${s}-${o}`, v.trigger("change", this.input), typeof this.onChange == "function" && this.onChange({ start: s, end: o }, this.parent);
1350
1354
  };
1351
1355
  return l({ class: "relative w-full max-w-[320px]" }, [
1352
- ut({
1356
+ dt({
1353
1357
  toggleOpen: e,
1354
1358
  bind: this.bind,
1355
1359
  required: this.required
1356
1360
  }),
1357
- dt({
1361
+ ht({
1358
1362
  handleDateSelect: t,
1359
1363
  blockPriorDates: this.blockPriorDates || !1
1360
1364
  })
1361
1365
  ]);
1362
1366
  }
1363
1367
  }
1364
- ), Zt = ({ dateTime: e = "", remoteTimeZone: t = "America/Denver", filter: s = null }) => ie([
1368
+ ), ts = ({ dateTime: e = "", remoteTimeZone: t = "America/Denver", filter: s = null }) => ie([
1365
1369
  new be({
1366
1370
  dateTime: e,
1367
1371
  filter: s || ((o) => {
@@ -1370,32 +1374,39 @@ const Y = globalThis.matchMedia, M = u(({ value: e, label: t, icon: s }) => p({
1370
1374
  })
1371
1375
  })
1372
1376
  ]);
1373
- function ht({ placeholder: e, handleInputChange: t, handleInputFocus: s, bind: o, required: n }) {
1374
- return C({
1377
+ function ft({ bind: e, required: t }) {
1378
+ return f({
1379
+ cache: "input",
1380
+ class: "opacity-0 absolute top-0 left-0 w-full h-full pointer-events-none",
1381
+ bind: e,
1382
+ required: t
1383
+ });
1384
+ }
1385
+ function mt({ placeholder: e, handleInputChange: t, handleInputFocus: s }) {
1386
+ return f({
1375
1387
  cache: "timeInput",
1376
1388
  class: "flex-1 bg-transparent outline-none placeholder:text-muted-foreground border-0",
1377
1389
  placeholder: e || "hh:mm AM/PM",
1378
- bind: o,
1379
- required: n,
1380
1390
  input: t,
1381
1391
  focus: s,
1382
- onState: ["selectedTime", (r) => r || ""]
1392
+ onState: ["selectedTime", (o) => o || ""]
1383
1393
  });
1384
1394
  }
1385
- function ft({ bind: e, required: t, toggleOpen: s, handleInputChange: o, handleInputFocus: n, placeholder: r }) {
1395
+ function gt({ bind: e, required: t, toggleOpen: s, handleInputChange: o, handleInputFocus: n, placeholder: r }) {
1386
1396
  return l(
1387
1397
  {
1388
1398
  class: "relative flex items-center gap-2 w-full justify-between border bg-input hover:bg-muted rounded-md h-10 px-4 py-2"
1389
1399
  },
1390
1400
  [
1391
- ht({ placeholder: r, handleInputChange: o, handleInputFocus: n, bind: e, required: t }),
1392
- p(
1401
+ ft({ bind: e, required: t }),
1402
+ mt({ placeholder: r, handleInputChange: o, handleInputFocus: n }),
1403
+ b(
1393
1404
  {
1394
1405
  class: "flex-shrink-0 hover:bg-muted/50 rounded p-1",
1395
1406
  click: s
1396
1407
  },
1397
1408
  [
1398
- w({ html: d.clock })
1409
+ C({ html: d.clock })
1399
1410
  ]
1400
1411
  )
1401
1412
  ]
@@ -1406,7 +1417,7 @@ function P({ items: e, handleTimeSelect: t, state: s, stateValue: o, pad: n = !1
1406
1417
  { class: "flex flex-col max-h-[200px] overflow-y-auto" },
1407
1418
  e.map((r) => {
1408
1419
  let i = n ? r.toString().padStart(2, "0") : r.toString();
1409
- return p({
1420
+ return b({
1410
1421
  text: i,
1411
1422
  class: "hover:bg-muted/50 rounded-md pr-2 py-1",
1412
1423
  click: () => t({ [o]: i }),
@@ -1415,7 +1426,7 @@ function P({ items: e, handleTimeSelect: t, state: s, stateValue: o, pad: n = !1
1415
1426
  })
1416
1427
  );
1417
1428
  }
1418
- function mt({ handleTimeSelect: e }) {
1429
+ function pt({ handleTimeSelect: e }) {
1419
1430
  return O(
1420
1431
  (t, s, o) => new F(
1421
1432
  {
@@ -1462,7 +1473,7 @@ function mt({ handleTimeSelect: e }) {
1462
1473
  )
1463
1474
  );
1464
1475
  }
1465
- function H(e) {
1476
+ function q(e) {
1466
1477
  if (!e)
1467
1478
  return { hour: null, minute: null, meridian: null };
1468
1479
  const t = /^(\d{1,2}):(\d{2})(?::(\d{2}))?\s?(AM|PM)?$/i, s = e.match(t);
@@ -1475,7 +1486,7 @@ function H(e) {
1475
1486
  meridian: r
1476
1487
  });
1477
1488
  }
1478
- const es = I(
1489
+ const ss = D(
1479
1490
  {
1480
1491
  /**
1481
1492
  * The initial shallow state of the TimePicker.
@@ -1483,7 +1494,7 @@ const es = I(
1483
1494
  * @member {object} state
1484
1495
  */
1485
1496
  state() {
1486
- const e = this.selectedTime ?? null, { hour: t, minute: s, meridian: o } = H(e);
1497
+ const e = this.selectedTime ?? null, { hour: t, minute: s, meridian: o } = q(e);
1487
1498
  return {
1488
1499
  selectedTime: e,
1489
1500
  open: !1,
@@ -1499,7 +1510,7 @@ const es = I(
1499
1510
  */
1500
1511
  after() {
1501
1512
  if (this.input.value) {
1502
- const { hour: e, minute: t, meridian: s } = H(this.input.value);
1513
+ const { hour: e, minute: t, meridian: s } = q(this.input.value);
1503
1514
  this.state.set({
1504
1515
  hour: e,
1505
1516
  minute: t,
@@ -1517,17 +1528,17 @@ const es = I(
1517
1528
  const e = (n, { state: r }) => r.toggle("open"), t = (n) => {
1518
1529
  let r = n.target.value.replace(/[^\d]/g, ""), i = "";
1519
1530
  if (r.length > 0 && (i = r.substring(0, 2), r.length > 2 && (i += ":" + r.substring(2, 4))), r.length >= 4) {
1520
- const a = parseInt(r.substring(0, 2), 10), h = parseInt(r.substring(2, 4), 10);
1521
- if (a >= 0 && a <= 23 && h >= 0 && h <= 59) {
1522
- let f = a, x = "AM";
1523
- a === 0 ? f = 12 : a > 12 ? (f = a - 12, x = "PM") : a === 12 && (x = "PM");
1524
- const g = `${f.toString().padStart(2, "0")}:${h.toString().padStart(2, "0")} ${x}`;
1525
- i = g, this.state.set({
1526
- hour: f.toString().padStart(2, "0"),
1527
- minute: h.toString().padStart(2, "0"),
1528
- meridian: x,
1529
- selectedTime: g
1530
- }), this.input.value = g, y.trigger("change", this.input), typeof this.change == "function" && this.change(g);
1531
+ const a = parseInt(r.substring(0, 2), 10), m = parseInt(r.substring(2, 4), 10);
1532
+ if (a >= 0 && a <= 23 && m >= 0 && m <= 59) {
1533
+ let g = a, y = "AM";
1534
+ a === 0 ? g = 12 : a > 12 ? (g = a - 12, y = "PM") : a === 12 && (y = "PM");
1535
+ const p = `${g.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")} ${y}`;
1536
+ i = p, this.state.set({
1537
+ hour: g.toString().padStart(2, "0"),
1538
+ minute: m.toString().padStart(2, "0"),
1539
+ meridian: y,
1540
+ selectedTime: p
1541
+ }), this.input.value = p, v.trigger("change", this.input), typeof this.change == "function" && this.change(p);
1531
1542
  }
1532
1543
  }
1533
1544
  n.target.value = i;
@@ -1536,13 +1547,13 @@ const es = I(
1536
1547
  }, o = ({ hour: n, minute: r, meridian: i }) => {
1537
1548
  if (n && (this.state.hour = n), r && (this.state.minute = r), i && (this.state.meridian = i), this.state.hour && this.state.minute && this.state.meridian) {
1538
1549
  const a = `${this.state.hour}:${this.state.minute} ${this.state.meridian}`;
1539
- this.state.selectedTime = a, this.state.open = !1, this.input.value = a, y.trigger("change", this.input), typeof this.change == "function" && this.change(a);
1550
+ this.state.selectedTime = a, this.state.open = !1, this.input.value = a, v.trigger("change", this.input), typeof this.change == "function" && this.change(a);
1540
1551
  }
1541
1552
  };
1542
1553
  return l(
1543
1554
  { class: "relative w-full max-w-[320px]" },
1544
1555
  [
1545
- ft({
1556
+ gt({
1546
1557
  toggleOpen: e,
1547
1558
  bind: this.bind,
1548
1559
  required: this.required,
@@ -1550,18 +1561,18 @@ const es = I(
1550
1561
  handleInputFocus: s,
1551
1562
  placeholder: this.placeholder
1552
1563
  }),
1553
- mt({
1564
+ pt({
1554
1565
  handleTimeSelect: o
1555
1566
  })
1556
1567
  ]
1557
1568
  );
1558
1569
  }
1559
1570
  }
1560
- ), gt = (e, t) => l({ class: `hidden md:flex items-start justify-center w-6 h-6 mr-3 ${t}` }, [
1561
- b({ size: "lg" }, e)
1562
- ]), pt = ({ title: e }) => L({ class: "flex flex-auto items-center" }, [
1571
+ ), bt = (e, t) => l({ class: `hidden md:flex items-start justify-center w-6 h-6 mr-3 ${t}` }, [
1572
+ x({ size: "lg" }, e)
1573
+ ]), xt = ({ title: e }) => L({ class: "flex flex-auto items-center" }, [
1563
1574
  $({ class: "text-lg font-semibold" }, e)
1564
- ]), bt = u((e, t) => ae(
1575
+ ]), yt = u((e, t) => ae(
1565
1576
  {
1566
1577
  class: `fixed pullUpIn z-30 w-[98%] border md:w-full max-w-lg bg-popover text-foreground shadow-lg duration-200
1567
1578
  rounded-lg flex flex-auto flex-col
@@ -1572,18 +1583,18 @@ const es = I(
1572
1583
  [
1573
1584
  l({ class: "flex flex-auto p-6 pb-12 md:pb-6" }, [
1574
1585
  // Icon and content
1575
- e.icon && gt(e.icon, e.iconColor),
1586
+ e.icon && bt(e.icon, e.iconColor),
1576
1587
  l({ class: "flex flex-auto flex-col gap-4" }, [
1577
1588
  l({ class: "flex flex-auto flex-col gap-y-2" }, [
1578
- pt(e),
1579
- e.description && v({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, e.description),
1589
+ xt(e),
1590
+ e.description && w({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, e.description),
1580
1591
  l({ class: "flex flex-auto flex-col text-sm text-muted-foreground" }, t)
1581
1592
  ]),
1582
1593
  e.buttons && N({ class: "flex flex-col-reverse sm:flex-row sm:justify-end mt-6 gap-2 sm:gap-0 sm:gap-x-2" }, e.buttons)
1583
1594
  ])
1584
1595
  ])
1585
1596
  ]
1586
- )), xt = (e) => X.render(e, app.root), _ = {
1597
+ )), vt = (e) => X.render(e, app.root), _ = {
1587
1598
  info: {
1588
1599
  borderColor: "border-blue-500",
1589
1600
  bgColor: "bg-muted/10",
@@ -1610,7 +1621,7 @@ const es = I(
1610
1621
  iconColor: "text-muted-foreground"
1611
1622
  }
1612
1623
  };
1613
- class yt extends k {
1624
+ class wt extends k {
1614
1625
  /**
1615
1626
  * This will declare the props for the compiler.
1616
1627
  *
@@ -1628,7 +1639,7 @@ class yt extends k {
1628
1639
  const t = (a) => {
1629
1640
  a.target === this.panel && this.close();
1630
1641
  }, { borderColor: s, bgColor: o, iconColor: n } = _[this.type] || _.default, r = `${this.getMainClass()} ${o} ${s}`, i = this.title || "Dialog Title";
1631
- return bt({
1642
+ return yt({
1632
1643
  class: r,
1633
1644
  title: i,
1634
1645
  click: t,
@@ -1645,7 +1656,7 @@ class yt extends k {
1645
1656
  */
1646
1657
  getButtons() {
1647
1658
  return this.hideFooter ? null : this.buttons ? this.buttons : [
1648
- m({ variant: "outline", click: () => this.close() }, "Close")
1659
+ h({ variant: "outline", click: () => this.close() }, "Close")
1649
1660
  ];
1650
1661
  }
1651
1662
  /**
@@ -1672,7 +1683,7 @@ class yt extends k {
1672
1683
  * @returns {void}
1673
1684
  */
1674
1685
  open() {
1675
- xt(this), this.panel.showModal(), this.state.open = !0;
1686
+ vt(this), this.panel.showModal(), this.state.open = !0;
1676
1687
  }
1677
1688
  /**
1678
1689
  * This will close the modal.
@@ -1683,7 +1694,7 @@ class yt extends k {
1683
1694
  this.state.open = !1, this.panel.close(), typeof this.onClose == "function" && this.onClose(), this.destroy();
1684
1695
  }
1685
1696
  }
1686
- class ts extends yt {
1697
+ class os extends wt {
1687
1698
  /**
1688
1699
  * This will declare the props for the compiler.
1689
1700
  *
@@ -1700,8 +1711,8 @@ class ts extends yt {
1700
1711
  getButtons() {
1701
1712
  const t = this.confirmTextLabel || "Confirm";
1702
1713
  return [
1703
- m({ variant: "outline", click: () => this.close() }, "Cancel"),
1704
- m({ variant: "primary", click: () => this.confirm() }, t)
1714
+ h({ variant: "outline", click: () => this.close() }, "Cancel"),
1715
+ h({ variant: "primary", click: () => this.confirm() }, t)
1705
1716
  ];
1706
1717
  }
1707
1718
  /**
@@ -1713,67 +1724,67 @@ class ts extends yt {
1713
1724
  this.confirmed && this.confirmed(), this.close();
1714
1725
  }
1715
1726
  }
1716
- const ss = u((e, t = []) => l({ class: "w-full max-w-md p-6 m-auto" }, [
1727
+ const ns = u((e, t = []) => l({ class: "w-full max-w-md p-6 m-auto" }, [
1717
1728
  ee({ class: "flex flex-auto flex-col" }, [
1718
1729
  l({ class: "flex flex-auto flex-col gap-y-4" }, [
1719
1730
  l({ class: "flex flex-auto items-center justify-center" }, [
1720
1731
  e.icon && l({ class: "w-16 h-16 mb-2 text-primary" }, [
1721
- b(e.icon)
1732
+ x(e.icon)
1722
1733
  ])
1723
1734
  ]),
1724
1735
  L({ class: "py-4 text-center" }, [
1725
1736
  $({ class: "text-xl font-bold" }, e.title),
1726
- v({ class: "pb-8 text-muted-foreground" }, e.description || ""),
1737
+ w({ class: "pb-8 text-muted-foreground" }, e.description || ""),
1727
1738
  ...t
1728
1739
  ])
1729
1740
  ])
1730
1741
  ])
1731
1742
  ]));
1732
1743
  export {
1733
- Ft as A,
1734
- Wt as B,
1735
- zt as C,
1736
- Tt as D,
1737
- Qt as E,
1744
+ Bt as A,
1745
+ Jt as B,
1746
+ Ut as C,
1747
+ Lt as D,
1748
+ Zt as E,
1738
1749
  Te as F,
1739
- Xt as G,
1740
- Zt as H,
1741
- Ht as I,
1742
- es as J,
1743
- ts as K,
1744
- _t as L,
1745
- Et as M,
1746
- Ut as N,
1747
- bt as O,
1750
+ es as G,
1751
+ ts as H,
1752
+ Wt as I,
1753
+ ss as J,
1754
+ os as K,
1755
+ Gt as L,
1756
+ Vt as M,
1757
+ Rt as N,
1758
+ yt as O,
1748
1759
  nt as P,
1749
- yt as Q,
1750
- ss as R,
1751
- Ot as S,
1752
- Vt as T,
1760
+ wt as Q,
1761
+ ns as R,
1762
+ Et as S,
1763
+ Ht as T,
1753
1764
  ke as a,
1754
- Bt as b,
1755
- Ie as c,
1765
+ At as b,
1766
+ De as c,
1756
1767
  Be as d,
1757
1768
  Le as e,
1758
1769
  Ae as f,
1759
- Lt as g,
1760
- At as h,
1761
- Mt as i,
1770
+ Mt as g,
1771
+ Pt as h,
1772
+ jt as i,
1762
1773
  Pe as j,
1763
- Pt as k,
1774
+ Nt as k,
1764
1775
  ee as l,
1765
- jt as m,
1766
- Nt as n,
1776
+ Ot as m,
1777
+ zt as n,
1767
1778
  Re as o,
1768
- Rt as p,
1769
- Yt as q,
1770
- qt as r,
1779
+ Yt as p,
1780
+ qt as q,
1781
+ _t as r,
1771
1782
  T as s,
1772
1783
  S as t,
1773
- He as u,
1774
- Gt as v,
1775
- Jt as w,
1784
+ qe as u,
1785
+ Kt as v,
1786
+ Qt as w,
1776
1787
  ot as x,
1777
- rt as y,
1778
- Kt as z
1788
+ lt as y,
1789
+ Xt as z
1779
1790
  };
package/dist/index.es.js CHANGED
@@ -3,7 +3,7 @@ import { B as u, I as g, L as C } from "./buttons-CHEs54Wl.js";
3
3
  import { C as T, F as b, V as D, a as I } from "./veil-CVCuKSvj.js";
4
4
  import { C as F, d as B, D as P, c as k, E as M, F as v, H as x, I as N, M as f, N as y, P as h, R as U, T as L, a as W, b as H, U as R, W as w } from "./inputs-9udyzkHR.js";
5
5
  import { Icons as G } from "./icons.es.js";
6
- import { A as E, B as V, C as j, w as q, K as J, y as z, z as K, E as Q, G as _, D as X, m as Y, n as Z, Q as $, O as aa, v as ea, c as sa, a as oa, b as ta, R as ra, l as na, g as la, i as ia, h as pa, j as da, e as ma, k as ua, F as ga, d as Ca, f as ca, I as Ta, L as ba, x as Da, M as Ia, o as Sa, N as Fa, P as Ba, s as Pa, t as ka, S as Ma, q as va, r as xa, T as Na, H as fa, J as ya, p as ha, u as Ua } from "./empty-state-C6Kem7VX.js";
6
+ import { A as E, B as V, C as j, w as q, K as J, y as z, z as K, E as Q, G as _, D as X, m as Y, n as Z, Q as $, O as aa, v as ea, c as sa, a as oa, b as ta, R as ra, l as na, g as la, i as ia, h as pa, j as da, e as ma, k as ua, F as ga, d as Ca, f as ca, I as Ta, L as ba, x as Da, M as Ia, o as Sa, N as Fa, P as Ba, s as Pa, t as ka, S as Ma, q as va, r as xa, T as Na, H as fa, J as ya, p as ha, u as Ua } from "./empty-state-CmJE_BQv.js";
7
7
  import { A as Wa, b as Ha, C as Ra, D as wa, a as Aa, F as Ga, M as Oa, P as Ea, R as Va, c as ja, g as qa, p as Ja } from "./range-calendar-BMWSJTE0.js";
8
8
  import { B as Ka, p as Qa, C as _a, j as Xa, D as Ya, m as Za, k as $a, H as ae, I as ee, N as se, O as oe, P as te, S as re, n as ne, o as le, x as ie, s as pe, q as de, r as me, T as ue, t as ge, w as Ce, u as ce, v as Te, l as be, U as De, W as Ie, f as Se, h as Fe, i as Be, c as Pe, d as ke, b as Me, e as ve, a as xe, g as Ne } from "./signature-panel-1P_xBZA9.js";
9
9
  import { B as ye, I as he, M as Ue, d as Le, e as We, g as He, N as Re, b as we, a as Ae, f as Ge, P as Oe, c as Ee, S as Ve, T as je } from "./mobile-nav-wrapper-CWqhZ0qz.js";
@@ -1,4 +1,4 @@
1
- import { A as s, B as t, C as e, w as r, K as i, y as n, z as m, E as l, G as d, D as C, m as p, n as S, Q as g, O as u, v as D, c, a as F, b as T, R as P, l as A, g as I, i as f, h as w, j as b, e as y, k as B, F as M, d as k, f as x, I as L, L as R, x as U, M as v, o as E, N, P as h, s as G, t as O, S as j, q, r as z, T as H, H as J, J as K, p as Q, u as _ } from "./empty-state-C6Kem7VX.js";
1
+ import { A as s, B as t, C as e, w as r, K as i, y as n, z as m, E as l, G as d, D as C, m as p, n as S, Q as g, O as u, v as D, c, a as F, b as T, R as P, l as A, g as I, i as f, h as w, j as b, e as y, k as B, F as M, d as k, f as x, I as L, L as R, x as U, M as v, o as E, N, P as h, s as G, t as O, S as j, q, r as z, T as H, H as J, J as K, p as Q, u as _ } from "./empty-state-CmJE_BQv.js";
2
2
  import { A as W, P as X, g as Y } from "./range-calendar-BMWSJTE0.js";
3
3
  export {
4
4
  s as Alert,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@base-framework/ui",
3
- "version": "1.0.316",
3
+ "version": "1.0.318",
4
4
  "description": "This is a UI package that adds components and atoms that use Tailwind CSS and a theme based on Shadcn.",
5
5
  "main": "./dist/index.es.js",
6
6
  "scripts": {