@base-framework/ui 1.2.15 → 1.2.16

package/dist/simple-search-input-DBNmoBCn.js

@@ -1,1730 +0,0 @@
-import { Div as r, Span as N, Button as K, OnState as J, On as T, Th as G, UseParent as et, I as st, Thead as at, Tr as nt, Table as j, P as $, Li as X, Time as ot, Ul as rt, Input as lt } from "@base-framework/atoms";
-import { Component as R, Data as P, Atom as m, DateTime as H, DataTracker as _, Jot as it } from "@base-framework/base";
-import { B as y, U as q } from "./buttons-C-_NH7ie.js";
-import { Icons as S } from "./icons.es.js";
-import { TableBody as ct, DataTableBody as dt, ScrollableTableBody as ht, List as ut } from "@base-framework/organisms";
-import { I as ft, C as mt, c as gt } from "./image-XjAp5NjV.js";
-const yt = (t, e) => {
-  const s = t ? t.getBoundingClientRect() : { top: 0, bottom: 0, left: 0 }, a = e.getBoundingClientRect(), n = 10, o = globalThis.scrollX, c = globalThis.scrollY;
-  let l = s.left + o, u = s.bottom + c;
-  const f = globalThis.innerHeight - s.bottom, g = s.top;
-  return l + a.width > globalThis.innerWidth && (l = globalThis.innerWidth - a.width - n), f < a.height && g > f ? u = s.top + c - a.height - n : f < a.height && (u = s.bottom + c - (a.height - f) - n), { x: l, y: u };
-};
-class wt extends R {
-  /**
-   * This will set up the data.
-   *
-   * @returns {object}
-   */
-  setData() {
-    const e = this.parent.data || new P();
-    return e.set({
-      position: { x: 0, y: 0 }
-    }), e;
-  }
-  /**
-   * This will get the class size.
-   *
-   * @returns {string}
-   */
-  getSize() {
-    switch (this.size || "lg") {
-      // @ts-ignore
-      case "sm":
-        return "w-48";
-      // @ts-ignore
-      case "md":
-        return "w-64";
-      case "lg":
-        return "w-[250px]";
-      // @ts-ignore
-      case "xl":
-        return "w-96";
-      // @ts-ignore
-      case "2xl":
-        return "w-[400px]";
-      // @ts-ignore
-      case "fit":
-        return "w-fit";
-      // @ts-ignore
-      case "full":
-        return "w-full";
-    }
-  }
-  /**
-   * This will render the modal component.
-   *
-   * @returns {object}
-   */
-  render() {
-    const e = this.getSize();
-    return r({
-      class: `absolute inset-auto fadeIn mt-2 rounded-md p-0 shadow-lg bg-popover min-h-12 backdrop:bg-transparent text-inherit r z-30 ${e}`,
-      popover: "manual",
-      toggle: (s, { state: a }) => s.newState === "closed" ? a.open = !1 : null,
-      style: "top: [[position.y]]px; left: [[position.x]]px"
-      // @ts-ignore
-    }, this.children);
-  }
-  /**
-   * This will setup the states.
-   *
-   * @returns {object}
-   */
-  setupStates() {
-    return {
-      open: {
-        id: this.parent.getId(),
-        callBack: (a) => {
-          this.state.open === !1 && this.destroy();
-        }
-      }
-    };
-  }
-  /**
-   * Updates the dropdown position.
-   *
-   * @returns {void}
-   */
-  updatePosition() {
-    const e = this.button ?? null, s = this.panel, a = yt(e, s);
-    this.data.position = a;
-  }
-  /**
-   * This will run after the setup.
-   *
-   * @returns {void}
-   */
-  afterSetup() {
-    this.panel.showPopover(), this.updatePosition();
-  }
-  /**
-   * This will check if the element clicked was in the
-   * component of the button.
-   *
-   * @param {object} element
-   * @returns {boolean}
-   */
-  isOutsideClick(e) {
-    return !this.panel.contains(e) && this.button && !this.button.contains(e);
-  }
-  /**
-   * This will set up the events.
-   *
-   * @returns {array}
-   */
-  setupEvents() {
-    return [
-      ["click", document, (e) => {
-        this.isOutsideClick(e.target) && (this.state.open = !1);
-      }],
-      ["resize", globalThis, (e) => this.updatePosition()],
-      ["scroll", document, (e) => this.updatePosition()]
-    ];
-  }
-  /**
-   * This will override the set up to use the app shell.
-   *
-   * @param {object} container
-   */
-  setContainer(e) {
-    this.container = app.root;
-  }
-  /**
-   * This will hide the popover before destroying.
-   *
-   * @returns {void}
-   */
-  beforeDestroy() {
-    this?.panel?.hidePopover();
-  }
-}
-const xt = m(({ src: t, alt: e }) => !t || t.indexOf(".") === -1 && t.indexOf("[[") === -1 ? null : ft({
-  src: t,
-  alt: e,
-  class: "rounded-full"
-})), bt = (t) => t && (Array.isArray(t) && (t = t.join(" ")), typeof t != "string" && (t = String(t)), t.split(" ").map((e) => e.charAt(0)).join("").toUpperCase()), V = (t) => !t || t.length < 2 ? t : bt(t), Dt = (t) => N([t, (e, s) => {
-  s.textContent = V(e);
-}]), L = {
-  xs: "h-6 w-6",
-  sm: "h-8 w-8",
-  md: "h-12 w-12",
-  lg: "h-16 w-16",
-  xl: "h-24 w-24",
-  "2xl": "h-32 w-32",
-  "3xl": "h-48 w-48",
-  "4xl": "h-64 w-64",
-  default: "h-12 w-12"
-}, U = {
-  xs: "text-[7px]",
-  sm: "text-xs",
-  md: "text-base",
-  lg: "text-xl",
-  xl: "text-2xl",
-  "2xl": "text-3xl",
-  "3xl": "text-4xl",
-  "4xl": "text-5xl",
-  default: "text-base"
-}, pt = (t) => L[t] || L.default, vt = (t) => U[t] || U.default, kt = (t, e = null, s = "md") => {
-  const a = V(String(t)), n = vt(s);
-  return r(
-    {
-      class: `
-			flex items-center justify-center w-full h-full rounded-full
-			bg-muted text-muted-foreground font-medium
-			${n}
-		`
-    },
-    [
-      e ? Dt(e) : N({ class: "uppercase" }, a)
-    ]
-  );
-}, St = m(({ src: t, alt: e, fallbackText: s, watcherFallback: a, size: n }) => {
-  const o = pt(n);
-  return r(
-    {
-      class: `relative flex items-center justify-center ${o}`
-    },
-    [
-      xt({ src: t, alt: e }),
-      kt(s, a, n)
-    ]
-  );
-}), Ct = ({ currentMonth: t, currentYear: e, onSelect: s }) => r(
-  { class: "grid grid-cols-3 gap-2" },
-  H.monthNames.map(
-    (a, n) => y(
-      {
-        click: (o) => {
-          o.preventDefault(), o.stopPropagation(), s(n);
-        },
-        variant: t === n ? "primary" : "ghost",
-        "aria-label": `Select ${a} ${e}`
-      },
-      a.substring(0, 3)
-    )
-  )
-), b = (t) => (t *= 1, t < 10 ? `0${t}` : String(t)), Mt = (t) => (t.indexOf("T") === -1 && t.indexOf(" ") === -1 && (t += "T00:00:01"), t.replace(" ", "T"), t), p = (t, e, s) => `${t}-${b(e + 1)}-${b(s)}`, It = (t) => t ? "bg-accent text-primary" : "", Ot = (t) => t ? "text-muted-foreground opacity-50" : "", Tt = (t, e) => t === e, $t = (t, e) => Tt(t, e) ? "bg-primary text-primary-foreground" : "", Rt = (t, e, s, a) => {
-  const n = $t(e, a);
-  return n || (t ? It(t) : s ? Ot(s) : "text-foreground");
-}, Y = (t) => {
-  const {
-    day: e,
-    currentDate: s,
-    date: a,
-    isToday: n,
-    isOutsideMonth: o,
-    select: c,
-    disabled: l
-  } = t;
-  return K(
-    {
-      class: `
-				flex items-center justify-center h-9 w-auto p-0 font-normal text-sm rounded-md cursor-pointer
-				${Rt(n, s, o, a)}
-				hover:bg-muted/50 hover:text-muted-foreground focus:z-10
-                disabled:pointer-events-none disabled:opacity-50
-			`,
-      disabled: l || e === null,
-      "aria-label": e ? `Day ${e}` : null,
-      // Only call select if it's not disabled.
-      click: () => !l && c(a)
-    },
-    e.toString()
-  );
-}, z = (t, e, s, a) => t === a.date && e === a.month && s === a.year, Pt = (t, e, s, a = !1) => {
-  const { year: n, month: o } = t, c = p(n, o, t.date), l = new Date(n, o, 1).getDay(), u = new Date(n, o + 1, 0).getDate(), f = new Date(n, o, 0).getDate(), g = [], C = o === 0 ? 11 : o - 1, v = o === 0 ? n - 1 : n;
-  for (let i = l - 1; i >= 0; i--) {
-    const h = f - i, w = z(h, C, v, e), x = new Date(v, C, h) < new Date(e.year, e.month, e.date), D = a && x;
-    g.push(
-      Y({
-        day: h,
-        currentDate: c,
-        date: p(v, C, h),
-        isToday: w,
-        isOutsideMonth: !0,
-        select: s,
-        disabled: D
-      })
-    );
-  }
-  for (let i = 1; i <= u; i++) {
-    const h = z(i, o, n, e), w = new Date(n, o, i) < new Date(e.year, e.month, e.date), x = a && w;
-    g.push(
-      Y({
-        day: i,
-        currentDate: c,
-        date: p(n, o, i),
-        isToday: h,
-        isOutsideMonth: !1,
-        select: s,
-        disabled: x
-      })
-    );
-  }
-  const k = o === 11 ? 0 : o + 1, B = o === 11 ? n + 1 : n, d = (7 - g.length % 7) % 7;
-  for (let i = 1; i <= d; i++) {
-    const h = z(i, k, B, e), w = new Date(B, k, i) < new Date(e.year, e.month, e.date), x = a && w;
-    g.push(
-      Y({
-        day: i,
-        currentDate: c,
-        date: p(B, k, i),
-        isToday: h,
-        isOutsideMonth: !0,
-        select: s,
-        disabled: x
-      })
-    );
-  }
-  return g;
-}, E = ({ label: t, click: e }) => y(
-  {
-    class: `
-			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
-			opacity-50 hover:opacity-100 text-muted-foreground absolute
-			${t === "Previous" ? "left-1" : "right-1"}
-			focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
-		  `,
-    click: e,
-    "aria-label": `${t} month`,
-    variant: "icon",
-    icon: t === "Previous" ? S.chevron.single.left : S.chevron.single.right
-  }
-), Bt = ({ onMonthClick: t, onYearClick: e, next: s, previous: a }) => r({ class: "flex items-center justify-center gap-x-2 relative min-h-12 text-sm font-medium" }, [
-  y({ click: t, variant: "ghost", "aria-label": "Select month" }, "[[monthName]]"),
-  y({ click: e, variant: "ghost", "aria-label": "Select year" }, "[[current.year]]"),
-  E({ label: "Previous", click: a }),
-  E({ label: "Next", click: s })
-]), Nt = (t) => r(
-  { class: "flex items-center justify-center h-9 w-auto text-[0.8rem] font-normal text-muted-foreground" },
-  t
-), Ht = () => ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(Nt), Yt = (t) => r({ class: "rdp flex flex-auto flex-col w-full gap-y-1" }, [
-  Bt({
-    onMonthClick: t.onMonthClick,
-    onYearClick: t.onYearClick,
-    next: t.next,
-    previous: t.previous
-  }),
-  r({
-    class: "flex flex-auto flex-col w-full",
-    onSet: [
-      "currentDate",
-      () => [
-        r({ class: "grid grid-cols-7" }, Ht()),
-        r(
-          { class: "grid grid-cols-7" },
-          Pt(
-            t.current,
-            t.today,
-            t.select,
-            t.blockPriorDates
-          )
-        )
-      ]
-    ]
-  })
-]), zt = ({ currentMonth: t, currentYear: e, onSelect: s }) => {
-  const a = e - 50, n = Array.from({ length: 101 }, (o, c) => a + c);
-  return r(
-    { class: "grid grid-cols-4 gap-2 overflow-y-auto max-h-72" },
-    n.map(
-      (o) => y(
-        {
-          click: (c) => {
-            c.preventDefault(), c.stopPropagation(), s(o);
-          },
-          variant: o === e ? "primary" : "ghost",
-          "aria-label": `Select ${o}`
-        },
-        o.toString()
-      )
-    )
-  );
-};
-class De extends R {
-  /**
-   * This will declare the props for the compiler.
-   *
-   * @returns {void}
-   */
-  declareProps() {
-    this.selectedDate = null, this.selectedCallBack = null, this.blockPriorDates = !1;
-  }
-  /**
-   * This will get the selected data.
-   *
-   * @param {object} today
-   * @returns {Date}
-   */
-  getSelectedDate(e) {
-    const s = this.selectedDate ? new Date(Mt(this.selectedDate)) : e;
-    return new Date(s.getFullYear(), s.getMonth(), s.getDate());
-  }
-  /**
-   * This will set up the data for the calendar.
-   *
-   * @returns {Data}
-   */
-  setData() {
-    const e = /* @__PURE__ */ new Date(), s = this.getSelectedDate(e), a = s.getMonth();
-    return new P({
-      monthName: this.getMonthName(a),
-      currentDate: `${s.getFullYear()}-${a + 1}-${s.getDate()}`,
-      current: {
-        date: s.getDate(),
-        year: s.getFullYear(),
-        month: a
-      },
-      today: {
-        date: e.getDate(),
-        month: e.getMonth(),
-        year: e.getFullYear()
-      }
-    });
-  }
-  /**
-   * This will set up the states for the calendar.
-   *
-   * @return {object}
-   */
-  setupStates() {
-    return {
-      view: "calendar"
-      // 'calendar' | 'months' | 'years'
-    };
-  }
-  /**
-   * This will get the name of the month.
-   *
-   * @param {number} month
-   * @returns {string}
-   */
-  getMonthName(e) {
-    return H.monthNames[e];
-  }
-  /**
-   * This will go to the previous month.
-   *
-   * @returns {void}
-   */
-  goToPreviousMonth() {
-    const e = this.data;
-    let s = e.current.month, a = e.current.year;
-    s === 0 ? (s = 11, a--) : s--, this.setCurrentDate(s, a);
-  }
-  /**
-   * This will go to the next month.
-   *
-   * @returns {void}
-   */
-  goToNextMonth() {
-    const e = this.data;
-    let s = e.current.month, a = e.current.year;
-    s === 11 ? (s = 0, a++) : s++, this.setCurrentDate(s, a);
-  }
-  /**
-   * This will set the current month and year.
-   *
-   * @param {number} month
-   * @param {number} year
-   * @param {number|null} [date=null]
-   * @returns {void}
-   */
-  setCurrentDate(e, s, a = null) {
-    const n = this.data;
-    n.current.month = e, n.current.year = s, typeof a == "number" && (n.current.date = b(a)), n.currentDate = `${s}-${b(e + 1)}-${n.current.date}`, n.monthName = this.getMonthName(e);
-  }
-  /**
-   * This will select a date.
-   *
-   * @param {string} date
-   * @returns {void}
-   */
-  selectDate(e) {
-    const s = /* @__PURE__ */ new Date(e + "T00:00:00");
-    this.setCurrentDate(s.getMonth(), s.getFullYear(), s.getDate()), typeof this.selectedCallBack == "function" && this.selectedCallBack(this.data.currentDate);
-  }
-  /**
-   * This will render the calendar.
-   *
-   * @returns {object}
-   */
-  render() {
-    return r({ class: "calendar-container p-3 rounded-md border min-w-80" }, [
-      J("view", (e) => {
-        switch (e) {
-          case "months":
-            return Ct(
-              {
-                // @ts-ignore
-                currentMonth: this.data.current.month,
-                // @ts-ignore
-                currentYear: this.data.current.year,
-                onSelect: (s) => {
-                  this.setCurrentDate(s, this.data.current.year), this.state.view = "calendar";
-                }
-              }
-            );
-          case "years":
-            return zt(
-              {
-                // @ts-ignore
-                currentMonth: this.data.current.month,
-                // @ts-ignore
-                currentYear: this.data.current.year,
-                onSelect: (s) => {
-                  this.setCurrentDate(this.data.current.month, s), this.state.view = "calendar";
-                }
-              }
-            );
-          default:
-            return Yt({
-              // @ts-ignore
-              current: this.data.current,
-              // @ts-ignore
-              today: this.data.today,
-              select: (s) => this.selectDate(s),
-              next: () => this.goToNextMonth(),
-              previous: () => this.goToPreviousMonth(),
-              blockPriorDates: this.blockPriorDates || !1,
-              onMonthClick: (s) => {
-                s.preventDefault(), s.stopPropagation(), this.state.view = "months";
-              },
-              onYearClick: (s) => {
-                s.preventDefault(), s.stopPropagation(), this.state.view = "years";
-              }
-            });
-        }
-      })
-    ]);
-  }
-}
-const W = ({ label: t, click: e }) => y(
-  {
-    class: `
-			inline-flex items-center justify-center h-7 w-7 bg-transparent p-0
-			opacity-50 hover:opacity-100 text-muted-foreground absolute
-			${t === "Previous" ? "left-1" : "right-1"}
-			focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2
-		  `,
-    click: e,
-    "aria-label": `${t} month`,
-    variant: "icon",
-    icon: t === "Previous" ? S.chevron.single.left : S.chevron.single.right
-  }
-), jt = ({ onMonthClick: t, onYearClick: e, next: s, previous: a }) => r({ class: "flex items-center justify-center gap-x-2 relative min-h-12 text-sm font-medium" }, [
-  y({ click: t, variant: "ghost", "aria-label": "Select month" }, "[[monthName]]"),
-  y({ click: e, variant: "ghost", "aria-label": "Select year" }, "[[current.year]]"),
-  W({ label: "Previous", click: a }),
-  W({ label: "Next", click: s })
-]), At = (t) => r({ class: "h-9 flex items-center justify-center font-medium" }, t), Ft = () => r(
-  { class: "grid grid-cols-7 gap-1 text-center text-xs font-medium text-muted-foreground mb-2" },
-  ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map(At)
-), Lt = ({ day: t, iso: e, disabled: s, isStart: a, isEnd: n, isBetween: o, isOtherMonth: c, click: l }) => {
-  let u = "ghost", f = "";
-  return a || n ? (u = "default", f = "bg-primary text-primary-foreground hover:bg-primary/90") : o && (f = "bg-accent text-accent-foreground hover:bg-accent/80"), s && (f += " opacity-50 cursor-not-allowed"), c && (f += " text-muted-foreground opacity-50"), y(
-    {
-      class: `flex items-center justify-center p-0 text-sm font-medium rounded-md transition-colors ${f}`,
-      variant: u,
-      disabled: s,
-      click: (g) => {
-        g.preventDefault(), g.stopPropagation(), s || l();
-      }
-    },
-    t.toString()
-  );
-}, Ut = ({ today: t, current: e, blockPriorDates: s, onDateClick: a }) => {
-  const { start: n, end: o } = e, c = new Date(e.year, e.month, 1).getDay(), l = new Date(e.year, e.month + 1, 0).getDate(), u = [], f = e.month === 0 ? 11 : e.month - 1, g = e.month === 0 ? e.year - 1 : e.year, C = new Date(g, f + 1, 0).getDate(), v = e.month === 11 ? 0 : e.month + 1, k = e.month === 11 ? e.year + 1 : e.year;
-  for (let d = c - 1; d >= 0; d--) {
-    const i = C - d, h = p(g, f, i), w = new Date(g, f, i), x = new Date(t.year, t.month, t.date), D = w < x, M = s && D, I = n === h, O = o === h, tt = n && o && h > n && h < o;
-    u.push({
-      day: i,
-      iso: h,
-      disabled: M,
-      isStart: I,
-      isEnd: O,
-      isBetween: tt,
-      isOtherMonth: !0,
-      click: () => a(h)
-    });
-  }
-  for (let d = 1; d <= l; d++) {
-    const i = p(e.year, e.month, d), h = new Date(e.year, e.month, d), w = new Date(t.year, t.month, t.date), x = h < w, D = s && x, M = n === i, I = o === i, O = n && o && i > n && i < o;
-    u.push({
-      day: d,
-      iso: i,
-      disabled: D,
-      isStart: M,
-      isEnd: I,
-      isBetween: O,
-      isOtherMonth: !1,
-      click: () => {
-        a(i);
-      }
-    });
-  }
-  const F = (7 - u.length % 7) % 7;
-  for (let d = 1; d <= F; d++) {
-    const i = p(k, v, d), h = new Date(k, v, d), w = new Date(t.year, t.month, t.date), x = h < w, D = s && x, M = n === i, I = o === i, O = n && o && i > n && i < o;
-    u.push({
-      day: d,
-      iso: i,
-      disabled: D,
-      isStart: M,
-      isEnd: I,
-      isBetween: O,
-      isOtherMonth: !0,
-      click: () => a(i)
-    });
-  }
-  return r(
-    { class: "grid grid-cols-7 gap-1" },
-    u.map(
-      (d, i) => Lt({
-        day: d.day,
-        iso: d.iso,
-        disabled: d.disabled,
-        isStart: d.isStart,
-        isEnd: d.isEnd,
-        isBetween: d.isBetween,
-        isOtherMonth: d.isOtherMonth,
-        click: d.click
-      })
-    )
-  );
-}, Et = m((t, e) => r({ class: "flex flex-auto flex-col" }, [
-  jt({
-    // @ts-ignore
-    onMonthClick: t.onMonthClick,
-    // @ts-ignore
-    onYearClick: t.onYearClick,
-    // @ts-ignore
-    next: t.next,
-    // @ts-ignore
-    previous: t.previous
-  }),
-  r({
-    class: "flex flex-auto flex-col w-full",
-    onSet: [
-      "currentDate",
-      () => [
-        Ft(),
-        Ut({
-          // @ts-ignore
-          today: t.today,
-          // @ts-ignore
-          current: t.current,
-          // @ts-ignore
-          blockPriorDates: t.blockPriorDates,
-          // @ts-ignore
-          onDateClick: t.onDateClick
-        })
-      ]
-    ]
-  })
-])), Wt = ({ currentMonth: t, currentYear: e, onSelect: s }) => r(
-  { class: "grid grid-cols-3 gap-2" },
-  H.monthNames.map(
-    (a, n) => y(
-      {
-        click: (o) => {
-          o.preventDefault(), o.stopPropagation(), s(n);
-        },
-        variant: t === n ? "primary" : "ghost",
-        "aria-label": `Select ${a} ${e}`
-      },
-      a.substring(0, 3)
-    )
-  )
-), Qt = ({ start: t, end: e, selecting: s, onSelectStart: a, onSelectEnd: n }) => r({ class: "flex gap-x-2 mb-4" }, [
-  T("selecting", (o) => y({
-    click: a,
-    variant: o === "start" ? "primary" : "outline",
-    class: "flex-1"
-  }, [
-    r({ class: "font-medium" }, Q("current.start", "Start Date"))
-  ])),
-  T("selecting", (o) => y({
-    click: n,
-    variant: o === "end" ? "primary" : "outline",
-    class: "flex-1"
-  }, [
-    r({ class: "font-medium" }, Q("current.end", "End Date"))
-  ]))
-]), Q = (t, e) => [`[[${t}]]`, (s) => s == null ? e : Kt(s)], Kt = (t) => {
-  const e = /* @__PURE__ */ new Date(t + "T00:00:00"), s = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], a = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
-  return `${s[e.getDay()]}, ${e.getDate()} ${a[e.getMonth()]}`;
-}, Jt = ({ currentYear: t, onSelect: e }) => {
-  const s = t - 50, a = Array.from({ length: 101 }, (n, o) => s + o);
-  return r(
-    { class: "grid grid-cols-4 gap-2 overflow-y-auto max-h-72" },
-    a.map(
-      (n) => y(
-        {
-          click: (o) => {
-            o.preventDefault(), o.stopPropagation(), e(n);
-          },
-          variant: n === t ? "primary" : "ghost",
-          "aria-label": `Select ${n}`
-        },
-        n.toString()
-      )
-    )
-  );
-};
-class pe extends R {
-  /**
-   * Declare compiler props.
-   *
-   * @returns {void}
-   */
-  declareProps() {
-    this.startDate = null, this.endDate = null, this.onRangeSelect = null, this.blockPriorDates = !1;
-  }
-  /**
-   * Initialize reactive data for today and current view.
-   *
-   * @returns {Data}
-   */
-  setData() {
-    const e = /* @__PURE__ */ new Date(), s = this.startDate ? /* @__PURE__ */ new Date(this.startDate + "T00:00:00") : e, a = s.getMonth(), n = s.getFullYear();
-    return new P({
-      today: {
-        date: e.getDate(),
-        month: e.getMonth(),
-        year: e.getFullYear()
-      },
-      monthName: this.getMonthName(a),
-      currentData: `${s.getFullYear()}-${b(s.getMonth() + 1)}-${b(s.getDate())}`,
-      current: {
-        date: e.getDate(),
-        month: a,
-        year: n,
-        start: this.startDate,
-        end: this.endDate
-      },
-      selecting: "start"
-    });
-  }
-  /**
-   * This will get the name of the month.
-   *
-   * @param {number} month
-   * @returns {string}
-   */
-  getMonthName(e) {
-    return H.monthNames[e];
-  }
-  /**
-   * Initialize component state.
-   *
-   * @returns {{view:string}}
-   */
-  setupStates() {
-    return {
-      view: "calendar"
-      // 'calendar', 'months', or 'years'
-    };
-  }
-  /**
-   * Handle a date cell click.
-   *
-   * @param {string} isoDate
-   * @returns {void}
-   */
-  handleClick(e) {
-    if (this.data.selecting === "start") {
-      this.data.current.start = e, this.data.current.end = null, this.data.selecting = "end";
-      const s = /* @__PURE__ */ new Date(e + "T00:00:00");
-      this.setCurrent({
-        month: s.getMonth(),
-        year: s.getFullYear(),
-        date: s.getDate()
-      });
-    } else {
-      this.data.current.start && e < this.data.current.start ? (this.data.current.end = this.data.current.start, this.data.current.start = e) : this.data.current.end = e, this.data.selecting = "start";
-      const s = /* @__PURE__ */ new Date(e + "T00:00:00");
-      this.setCurrent({
-        month: s.getMonth(),
-        year: s.getFullYear(),
-        date: s.getDate()
-      }), typeof this.onRangeSelect == "function" && this.onRangeSelect(this.data.current.start, this.data.current.end);
-    }
-  }
-  /**
-   * Update current month/year in data.
-   *
-   * @param {object} obj
-   * @returns {void}
-   */
-  setCurrent({ month: e, year: s, date: a = null }) {
-    const n = this.data.current;
-    n.month = (e + 12) % 12, n.year = s + (e < 0 ? -1 : e > 11 ? 1 : 0), a !== null && (n.date = a), this.data.monthName = this.getMonthName(n.month), this.data.currentDate = `${s}-${b(e + 1)}-${b(n.date)}`;
-  }
-  /**
-   * Render the range calendar.
-   *
-   * @returns {object}
-   */
-  render() {
-    const { today: e, current: s, selecting: a } = this.data, { start: n, end: o } = s;
-    return r({ class: "range-calendar border border-border rounded-lg shadow-md p-4 w-full max-w-sm min-w-80" }, [
-      Qt({
-        start: n,
-        end: o,
-        selecting: a,
-        onSelectStart: (c) => {
-          c.preventDefault(), c.stopPropagation(), this.data.selecting = "start";
-        },
-        onSelectEnd: (c) => {
-          c.preventDefault(), c.stopPropagation(), this.data.selecting = "end";
-        }
-      }),
-      J("view", (c) => {
-        switch (c) {
-          case "months":
-            return Wt(
-              {
-                currentMonth: s.month,
-                currentYear: s.year,
-                onSelect: (l) => {
-                  this.setCurrent({ month: l, year: s.year }), this.state.view = "calendar";
-                }
-              }
-            );
-          case "years":
-            return Jt(
-              {
-                currentYear: s.year,
-                onSelect: (l) => {
-                  this.setCurrent({ month: s.month, year: l }), this.state.view = "calendar";
-                }
-              }
-            );
-          default:
-            return Et({
-              // @ts-ignore
-              monthName: this.data.monthName,
-              year: s.year,
-              today: e,
-              current: s,
-              blockPriorDates: this.blockPriorDates,
-              onDateClick: (l) => this.handleClick(l),
-              onMonthClick: (l) => {
-                l.preventDefault(), l.stopPropagation(), this.state.view = "months";
-              },
-              onYearClick: (l) => {
-                l.preventDefault(), l.stopPropagation(), this.state.view = "years";
-              },
-              next: () => {
-                const l = this.data.current, u = l.month === 11 ? { month: 0, year: l.year + 1 } : { month: l.month + 1, year: l.year };
-                this.setCurrent(u);
-              },
-              previous: () => {
-                const l = this.data.current, u = l.month === 0 ? { month: 11, year: l.year - 1 } : { month: l.month - 1, year: l.year };
-                this.setCurrent(u);
-              }
-            });
-        }
-      })
-    ]);
-  }
-}
-m((t, e) => ({
-  class: "flex items-center px-4 py-2",
-  ...t,
-  children: e
-}));
-m(({ value: t, label: e }) => K({
-  class: "inline-flex flex-auto items-center justify-center whitespace-nowrap rounded-md px-8 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
-  onState: ["performance", { active: t }],
-  dataSet: ["performance", ["state", t, "active"]],
-  click: (s, { state: a }) => a.performance = t
-}, e));
-const Gt = (t, e) => {
-  const s = t.toggleAllSelectedRows();
-  e.state.checked = !s;
-}, Xt = (t) => G({ class: `cursor-pointer py-3 px-4 text-base w-10 ${t.class || ""}` }, [
-  et((e) => new mt({ class: "mr-2", onChange: (s, a) => Gt(e, a) }))
-]), _t = ({ align: t, sortable: e, key: s, label: a, sort: n, class: o }) => {
-  const c = t || "justify-start";
-  return G({
-    class: `cursor-pointer py-3 px-4 text-base ${o || ""}`,
-    click: e && (() => n(s))
-  }, [
-    r({ class: `flex flex-auto w-full items-center ${c}` }, [
-      N(a),
-      e && st({ class: "ml-2", html: S.arrows.upDown })
-    ])
-  ]);
-}, A = (t) => at([
-  nt({
-    class: "text-muted-foreground border-b",
-    map: [
-      t.headers,
-      (e) => e.label === "checkbox" ? Xt({ toggle: t.toggle }) : _t({
-        align: e.align,
-        sortable: e.sortable,
-        key: e.key,
-        label: e.label,
-        sort: t.sort
-      })
-    ]
-  })
-]), qt = ({ key: t, rows: e, selectRow: s, rowItem: a, emptyState: n, skeleton: o, columnCount: c }) => new ct({
-  cache: "list",
-  key: t,
-  items: e,
-  rowItem: (l) => a(l, s),
-  class: "divide-y divide-border",
-  emptyState: n,
-  skeleton: o,
-  columnCount: c
-});
-class Z extends R {
-  /**
-   * Initializes component data.
-   *
-   * @returns {Data}
-   */
-  setData() {
-    let e = this.rows && this.rows.length > 0;
-    return (this.loadMoreItems || this.tableData) && !e && (e = null), new P({
-      selectedRows: [],
-      // @ts-ignore
-      hasItems: e,
-      selected: !1
-    });
-  }
-  /**
-   * This will toggle all selected rows.
-   *
-   * @returns {boolean}
-   */
-  toggleAllSelectedRows() {
-    const e = this.list.getRows(), s = this.data.selectedRows.length === e.length, a = s ? [] : e;
-    return this.data.selectedRows = a, this.updateSelected(), this.updateTable(!s), s;
-  }
-  /**
-   * This will update the selected state.
-   *
-   * @returns {void}
-   */
-  updateSelected() {
-    const e = this.data.get("selectedRows");
-    this.data.selected = e.length > 0;
-  }
-  /**
-   * This will get the selected rows.
-   *
-   * @returns {Array<object>}
-   */
-  getSelectedRows() {
-    return this.data.get("selectedRows");
-  }
-  /**
-   * This will update the table rows.
-   *
-   * @protected
-   * @param {boolean} selected
-   * @returns {void}
-   */
-  updateTable(e) {
-    const s = this.list.getRows();
-    s.forEach((a) => a.selected = e), this.list.setRows(s);
-  }
-  /**
-   * Handles row selection.
-   *
-   * @param {object} row
-   */
-  selectRow(e) {
-    const s = e.selected ?? !1;
-    e.selected = !s;
-    const a = this.data.get("selectedRows"), n = e.selected ? [...a, e] : a.filter((o) => o !== e);
-    this.data.selectedRows = n, this.updateSelected();
-  }
-  /**
-   * Gets the number of header columns.
-   *
-   * @returns {number}
-   */
-  getHeaderColCount() {
-    return this.customHeader ? this.customHeader?.children[0]?.children?.length : this.headers ? this.headers.length : 3;
-  }
-  /**
-   * Renders the DataTable component.
-   *
-   * @returns {object}
-   */
-  render() {
-    const e = this.border !== !1 ? "border" : "", s = this.getHeaderColCount();
-    return r({ class: "w-full flex flex-auto flex-col" }, [
-      T("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
-      r({ class: `w-full rounded-md ${e} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        j({ class: "w-full" }, [
-          // @ts-ignore
-          this.headers && A({ headers: this.headers, sort: (a) => this.sortRows(a) }),
-          // @ts-ignore
-          this.customHeader ?? null,
-          qt({
-            // @ts-ignore
-            key: this.key,
-            // @ts-ignore
-            rows: this.rows,
-            // @ts-ignore
-            selectRow: this.selectRow.bind(this),
-            // @ts-ignore
-            rowItem: this.rowItem,
-            // @ts-ignore
-            emptyState: this.emptyState,
-            // @ts-ignore
-            skeleton: this.skeleton,
-            columnCount: s
-          })
-        ])
-      ])
-    ]);
-  }
-  /**
-   * This will remove items from the list.
-   *
-   * @public
-   * @param {array} items
-   * @returns {void}
-   */
-  remove(e) {
-    this.list.remove(e);
-  }
-  /**
-   * This will set the items in the list.
-   *
-   * @public
-   * @param {array} rows
-   * @returns {void}
-   */
-  setRows(e) {
-    this.list.setRows(e);
-  }
-  /**
-   * This will append items to the list.
-   *
-   * @public
-   * @param {array|object} items
-   * @returns {void}
-   */
-  append(e) {
-    this.list.append(e);
-  }
-  /**
-   * This will mingle the new items with the old items.
-   *
-   * @public
-   * @param {Array<Object>} newItems
-   * @param {boolean} withDelete
-   * @returns {void}
-   */
-  mingle(e, s = !1) {
-    this.list.mingle(e, s);
-  }
-  /**
-   * This will prepend items to the list.
-   *
-   * @public
-   * @param {array|object} items
-   * @returns {void}
-   */
-  prepend(e) {
-    this.list.prepend(e);
-  }
-  /**
-   * This will remove the selected rows.
-   *
-   * @returns {void}
-   */
-  beforeDestroy() {
-    this.data.selectedRows = [];
-  }
-}
-const Vt = (t) => new dt({
-  cache: "list",
-  loadMoreItems: t.loadMoreItems,
-  offset: t.offset,
-  limit: t.limit,
-  key: t.key,
-  tableData: t.tableData,
-  items: t.items,
-  rowItem: (e) => t.rowItem(e, t.selectRow),
-  class: "divide-y divide-border",
-  skeleton: t.skeleton,
-  columnCount: t.columnCount
-});
-class Zt extends Z {
-  /**
-   * Renders the DataTable component.
-   *
-   * @returns {object}
-   */
-  render() {
-    const e = this.border !== !1 ? "border" : "", s = this.getHeaderColCount();
-    return r({ class: "w-full flex flex-auto flex-col" }, [
-      T("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
-      r({ class: `w-full rounded-md ${e} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        j({ class: "w-full" }, [
-          // @ts-ignore
-          this.headers && A({ headers: this.headers, sort: (a) => this.sortRows(a) }),
-          // @ts-ignore
-          this.customHeader ?? null,
-          Vt({
-            // @ts-ignore
-            loadMoreItems: this.loadMoreItems,
-            // @ts-ignore
-            offset: this.offset,
-            // @ts-ignore
-            limit: this.limit,
-            // @ts-ignore
-            class: this.class,
-            // @ts-ignore
-            tableData: this.tableData,
-            // @ts-ignore
-            key: this.key,
-            // @ts-ignore
-            items: this.rows,
-            // @ts-ignore
-            selectRow: this.selectRow.bind(this),
-            // @ts-ignore
-            rowItem: this.rowItem,
-            // @ts-ignore
-            skeleton: this.skeleton,
-            columnCount: s
-          })
-        ])
-      ])
-    ]);
-  }
-  /**
-   * Refreshes the list.
-   *
-   * @returns {void}
-   */
-  refresh() {
-    this.list.refresh();
-  }
-}
-const ve = m((t) => new Zt(
-  {
-    // @ts-ignore
-    cache: t.cache ?? "list",
-    // @ts-ignore
-    tableData: t.data,
-    // @ts-ignore
-    loadMoreItems: t.loadMoreItems,
-    // @ts-ignore
-    offset: t.offset,
-    // @ts-ignore
-    limit: t.limit,
-    // @ts-ignore
-    class: t.class,
-    // @ts-ignore
-    key: t.key,
-    // @ts-ignore
-    rows: t.rows,
-    // @ts-ignore
-    rowItem: t.rowItem,
-    // @ts-ignore
-    headers: t.headers,
-    // @ts-ignore
-    customHeader: t.customHeader,
-    // @ts-ignore
-    border: t.border,
-    // @ts-ignore
-    emptyState: t.emptyState,
-    // @ts-ignore
-    skeleton: t.skeleton
-  }
-)), te = (t) => new ht({
-  cache: "list",
-  scrollContainer: t.scrollContainer,
-  loadMoreItems: t.loadMoreItems,
-  offset: t.offset,
-  limit: t.limit,
-  key: t.key,
-  tableData: t.tableData,
-  items: t.items,
-  rowItem: (e) => t.rowItem(e, t.selectRow),
-  class: "divide-y divide-border",
-  skeleton: t.skeleton,
-  columnCount: t.columnCount
-});
-class ee extends Z {
-  /**
-   * Renders the DataTable component.
-   *
-   * @returns {object}
-   */
-  render() {
-    const e = this.border !== !1 ? "border" : "", s = this.getHeaderColCount();
-    return r({ class: "w-full flex flex-auto flex-col" }, [
-      T("hasItems", (a) => a === !1 && this.emptyState ? this.emptyState() : null),
-      r({ class: `w-full rounded-md ${e} overflow-x-auto`, onSet: ["hasItems", { hidden: !1 }] }, [
-        j({ class: "w-full" }, [
-          // @ts-ignore
-          this.headers && A({ headers: this.headers, sort: (a) => this.sortRows(a) }),
-          // @ts-ignore
-          this.customHeader ?? null,
-          te({
-            // @ts-ignore
-            scrollContainer: this.scrollContainer,
-            // @ts-ignore
-            loadMoreItems: this.loadMoreItems,
-            // @ts-ignore
-            offset: this.offset,
-            // @ts-ignore
-            limit: this.limit,
-            // @ts-ignore
-            class: this.class,
-            // @ts-ignore
-            tableData: this.tableData,
-            // @ts-ignore
-            key: this.key,
-            // @ts-ignore
-            items: this.rows,
-            // @ts-ignore
-            selectRow: this.selectRow.bind(this),
-            // @ts-ignore
-            rowItem: this.rowItem,
-            // @ts-ignore
-            skeleton: this.skeleton,
-            columnCount: s
-          })
-        ])
-      ])
-    ]);
-  }
-  /**
-   * Refreshes the list.
-   *
-   * @returns {void}
-   */
-  refresh() {
-    this.list.refresh();
-  }
-}
-const ke = m((t) => new ee(
-  {
-    // @ts-ignore
-    cache: t.cache ?? "list",
-    // @ts-ignore
-    tableData: t.data,
-    // @ts-ignore
-    scrollContainer: t.scrollContainer,
-    // @ts-ignore
-    loadMoreItems: t.loadMoreItems,
-    // @ts-ignore
-    offset: t.offset,
-    // @ts-ignore
-    limit: t.limit,
-    // @ts-ignore
-    class: t.class,
-    // @ts-ignore
-    key: t.key,
-    // @ts-ignore
-    rows: t.rows,
-    // @ts-ignore
-    rowItem: t.rowItem,
-    // @ts-ignore
-    headers: t.headers,
-    // @ts-ignore
-    customHeader: t.customHeader,
-    // @ts-ignore
-    border: t.border,
-    // @ts-ignore
-    emptyState: t.emptyState,
-    // @ts-ignore
-    skeleton: t.skeleton
-  }
-)), se = m(({ name: t, email: e }) => r({ class: "min-w-0 flex-auto" }, [
-  $({ class: "text-base font-semibold leading-6 m-0" }, t),
-  $({ class: "truncate text-sm leading-5 text-muted-foreground m-0" }, e)
-])), ae = () => r({ class: "flex items-center gap-x-1.5" }, [
-  r({ class: "flex-none rounded-full bg-emerald-500/20 p-1" }, [
-    r({ class: "h-1.5 w-1.5 rounded-full bg-emerald-500" })
-  ]),
-  $({ class: "text-xs leading-5 text-gray-500" }, "Online")
-]), ne = (t) => $({ class: "text-xs leading-5 text-muted-foreground" }, [
-  N("Last seen "),
-  ot({ datetime: t }, "3h ago")
-]), oe = (t, e) => t === "online" ? ae() : ne(e), re = m(({ role: t, lastSeen: e, status: s }) => r({ class: "hidden shrink-0 sm:flex sm:flex-col sm:items-end" }, [
-  $({ class: "text-sm leading-6 m-0" }, t),
-  oe(s, e)
-])), le = (t) => t.split(" ").map((s) => s[0]).join(""), ie = m((t) => X({ class: "fadeIn flex justify-between gap-x-6 py-4 px-4 rounded-md hover:bg-muted/50" }, [
-  r({ class: "flex min-w-0 gap-x-4" }, [
-    // @ts-ignore
-    St({ src: t.image, alt: t.name, fallbackText: le(t.name) }),
-    // @ts-ignore
-    se({ name: t.name, email: t.email })
-  ]),
-  re({
-    // @ts-ignore
-    role: t.role,
-    // @ts-ignore
-    lastSeen: t.lastSeen,
-    // @ts-ignore
-    status: t.status
-  })
-])), Se = m((t) => new ut({
-  cache: "list",
-  key: "name",
-  // @ts-ignore
-  items: t.users,
-  role: "list",
-  class: "divide-y divide-border",
-  rowItem: ie
-})), Ce = m((t) => {
-  const e = t.margin || "m-4 ml-0";
-  return t.allowHistory = t.allowHistory === !0, r({ class: `flex-none ${e}` }, [
-    y({ variant: "back", class: "ghost", ...t })
-  ]);
-});
-class ce extends R {
-  /**
-   * This will declare the props for the compiler.
-   *
-   * @returns {void}
-   */
-  declareProps() {
-    this.class = "";
-  }
-  /**
-   * This will render the component.
-   *
-   * @returns {object}
-   */
-  render() {
-    return r(
-      {
-        class: this.getClassName(),
-        // @ts-ignore
-        animateIn: this.animateIn ?? null,
-        // @ts-ignore
-        animateOut: this.animateOut ?? null,
-        onSet: ["loading", {
-          loading: !0
-        }]
-      },
-      [
-        this.addBody()
-      ]
-    );
-  }
-  /**
-   * This will get the overlay className.
-   *
-   * @returns {string}
-   */
-  getClassName() {
-    return `absolute flex flex-auto flex-col overlay left-0 top-0 right-0 z-20
-			h-svh max-h-svh min-h-svh
-			bg-background pointer-events-auto
-			lg:left-16
-			will-change-contents ${this.class || ""}`;
-  }
-  /**
-   * This will setup and render the component.
-   *
-   * @param {object} container
-   * @returns {void}
-   */
-  setContainer(e) {
-    this.container = app.root;
-  }
-  /**
-   * This will setup the overlay states.
-   *
-   * @returns {object}
-   */
-  setupStates() {
-    return {
-      loading: !1
-    };
-  }
-  /**
-   * This will set the loading state.= to true.
-   *
-   * @returns {void}
-   */
-  addLoading() {
-    this.state.loading = !0;
-  }
-  /**
-   * This will set the loading state to false.
-   *
-   * @returns {void}
-   */
-  removeLoading() {
-    this.state.loading = !1;
-  }
-  /**
-   * This will add the body of the overlay.
-   *
-   * @returns {object}
-   */
-  addBody() {
-    return r({ class: "body fadeIn flex flex-auto flex-col bg-background" }, this.getContents());
-  }
-  /**
-   * This will get the body contents.
-   *
-   * @returns {array|null}
-   */
-  getContents() {
-    return this.children;
-  }
-}
-_.addType("dockableOverlay", (t) => {
-  if (!t)
-    return;
-  const e = t.component;
-  e && e.rendered === !0 && e.state.docked === !1 && e.destroy();
-});
-class Me extends ce {
-  /**
-   * This will stop presistence.
-   *
-   * @returns {void}
-   */
-  onCreated() {
-    this.dockSize = this.maxSize || 1024;
-  }
-  /**
-   * This will render the component.
-   *
-   * @returns {object}
-   */
-  render() {
-    const e = this.container;
-    return r(
-      {
-        // @ts-ignore
-        animateIn: this.animateIn ?? null,
-        // @ts-ignore
-        animateOut: this.animateOut ?? null,
-        onState: [
-          ["loading", {
-            loading: !0
-          }],
-          ["docked", (s, a) => {
-            s ? (a.className = this.getDockedClassName(), e.appendChild(a)) : (a.className = this.getClassName(), app.root.appendChild(a));
-          }]
-        ]
-      },
-      [
-        this.addBody()
-      ]
-    );
-  }
-  /**
-   * This will get the docked className.
-   *
-   * @returns {string}
-   */
-  getDockedClassName() {
-    return "flex flex-auto flex-col bg-background flex will-change-contents " + (this.class || "");
-  }
-  /**
-   * This will setup and render the component.
-   *
-   * @param {object} container
-   * @returns {void}
-   */
-  setup(e) {
-    this.container = e, this.initialize();
-  }
-  /**
-   * This will setup the overlay states.
-   *
-   * @returns {object}
-   */
-  setupStates() {
-    return {
-      loading: !1,
-      docked: this.canDock()
-    };
-  }
-  /**
-   * This will check the dock size.
-   *
-   * @returns {void}
-   */
-  afterSetup() {
-    _.add(
-      this.container,
-      "dockableOverlay",
-      {
-        component: this
-      }
-    ), this.onResize();
-  }
-  /**
-   * This will setup the overlay events.
-   *
-   * @returns {Array<object>}
-   */
-  setupEvents() {
-    return [
-      ["resize", globalThis, () => this.onResize()]
-    ];
-  }
-  /**
-   * This will check if the overlay can dock.
-   *
-   * @returns {boolean}
-   */
-  canDock() {
-    return globalThis.innerWidth >= this.dockSize;
-  }
-  /**
-   * This will handle the overlay resize.
-   *
-   * @returns {void}
-   */
-  onResize() {
-    this.state.docked = this.canDock();
-  }
-}
-const de = m(({ index: t, click: e, state: s }, a) => X({
-  class: "p-2 cursor-pointer hover:bg-muted/50",
-  onState: [
-    [s, "selectedIndex", {
-      "bg-accent": t,
-      "text-white": t
-    }]
-  ],
-  click: () => e(t)
-}, a)), he = m(({ selectOption: t, state: e }) => rt({
-  class: "border rounded-md list-none m-0 p-0 max-h-[400px] overflow-y-auto",
-  for: ["filteredOptions", (s, a) => de({ index: a, click: t, state: e }, s.label)]
-})), ue = m((t) => r({ class: "relative flex flex-auto items-center" }, [
-  gt({
-    cache: "input",
-    // @ts-ignore
-    class: t.class ?? "",
-    // @ts-ignore
-    placeholder: t.placeholder ?? "Search...",
-    // @ts-ignore
-    bind: t.bind ?? [t.state, "searchQuery"],
-    keyup: (e, s) => {
-      s.state && (s.state.open = !1), typeof t.filterOptions == "function" && t.filterOptions(), s.dropdown && s.dropdown.updatePosition(), t.keyup && t.keyup(e, s);
-    },
-    pointerup: (e, s) => {
-      typeof s.toggleDropdown == "function" && s.toggleDropdown();
-    },
-    keydown: (e) => [
-      // @ts-ignore
-      typeof t.handleKeyDown == "function" && t.handleKeyDown(e)
-    ]
-  }),
-  // @ts-ignore
-  t.icon && r({ class: "absolute flex right-0 mr-2" }, [
-    // @ts-ignore
-    q({ size: "sm" }, t.icon)
-  ])
-])), fe = (t) => r({
-  class: "relative flex fle-auto flex-col",
-  onState: ["open", (e, s, a) => {
-    if (e)
-      return new wt({
-        cache: "dropdown",
-        parent: a,
-        button: a.input,
-        size: "xl"
-      }, [
-        he(t)
-      ]);
-  }]
-}), Ie = it(
-  {
-    /**
-     * This will set up the data object.
-     *
-     * @returns {object} - The data object.
-     */
-    setData() {
-      const t = this.options || [];
-      return new P({
-        options: t,
-        filteredOptions: t
-      });
-    },
-    /**
-     * This will set up the state object.
-     *
-     * @returns {object} - The state object.
-     */
-    state() {
-      return {
-        searchQuery: "",
-        selectedIndex: -1,
-        open: !1
-      };
-    },
-    /**
-     * This will set the selected index by query.
-     *
-     * @returns {void}
-     */
-    setSelectedIndexByQuery() {
-      const t = this.data.filteredOptions;
-      let { searchQuery: e } = this.state;
-      e = e.toLowerCase();
-      const s = t.findIndex((a) => a.label.toLowerCase() === e);
-      s >= 0 && (this.state.selectedIndex = s);
-    },
-    /**
-     * This will filter the options.
-     *
-     * @returns {void}
-     */
-    filterOptions() {
-      const t = this.state.searchQuery.toLowerCase();
-      if (t === "" || t.length === 0) {
-        this.data.filteredOptions = this.data.options;
-        return;
-      }
-      const e = this.data.get("options");
-      this.data.filteredOptions = e.filter(
-        (s) => s.label.toLowerCase().includes(t)
-      );
-    },
-    /**
-     * This will get the selected value.
-     *
-     * @returns {object}
-     */
-    getValue() {
-      const { selectedIndex: t } = this.state;
-      return t < 0 ? null : this.data.get(`filteredOptions[${t}]`);
-    },
-    /**
-     * This will select an option.
-     *
-     * @param {number} index - The index of the option.
-     * @returns {void}
-     */
-    selectOption(t) {
-      this.state.selectedIndex = t;
-      const e = this.data.get(`filteredOptions[${t}]`);
-      this.state.searchQuery = e.label, this.state.open = !1, typeof this.onSelect == "function" && this.onSelect(e);
-    },
-    /**
-     * Toggles the dropdown open state.
-     */
-    toggleDropdown() {
-      this.state.toggle("open"), this.state.open && this.setSelectedIndexByQuery();
-    },
-    /**
-     * This will handle key down events.
-     *
-     * @param {object} event - The event object.
-     * @returns {void}
-     */
-    handleKeyDown(t) {
-      const e = this.data.filteredOptions, { selectedIndex: s } = this.state;
-      t.key === "ArrowDown" ? (t.preventDefault(), this.state.selectedIndex = Math.min(s + 1, e.length - 1)) : t.key === "ArrowUp" ? (t.preventDefault(), this.state.selectedIndex = Math.max(s - 1, 0)) : t.key === "Enter" && s >= 0 && (t.preventDefault(), this.selectOption(s));
-    },
-    /**
-     * This will render the component.
-     *
-     * @returns {object} - The rendered component.
-     */
-    render() {
-      return r({ class: "relative w-full max-w-md" }, [
-        ue({
-          // @ts-ignore
-          state: this.state,
-          // @ts-ignore
-          icon: this.icon,
-          // @ts-ignore
-          placeholder: this.placeholder,
-          // @ts-ignore
-          filterOptions: this.filterOptions.bind(this),
-          // @ts-ignore
-          handleKeyDown: this.handleKeyDown.bind(this)
-        }),
-        fe({
-          // @ts-ignore
-          state: this.state,
-          // @ts-ignore
-          setSelected: this.setSelectedIndexByQuery.bind(this),
-          // @ts-ignore
-          selectOption: this.selectOption.bind(this)
-        })
-      ]);
-    }
-  }
-), Oe = m((t) => {
-  const e = t.icon ?? S.magnifyingGlass.default;
-  return r({
-    // @ts-ignore
-    class: `relative flex items-center w-full rounded-xl bg-muted/30 focus-within:ring-2 focus-within:ring-ring transition-all ${t.containerClass || ""}`
-  }, [
-    r({ class: "absolute left-4 flex items-center pointer-events-none text-muted-foreground" }, [
-      q({ size: "sm" }, e)
-    ]),
-    lt({
-      type: "text",
-      // @ts-ignore
-      cache: t.cache ?? "input",
-      // @ts-ignore
-      class: `w-full bg-transparent border-none outline-none pl-12 pr-4 py-4 text-base text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-0 ${t.class || ""}`,
-      // @ts-ignore
-      placeholder: t.placeholder ?? "Search...",
-      // @ts-ignore
-      bind: t.bind,
-      // @ts-ignore
-      value: t.value,
-      // @ts-ignore
-      keyup: t.keyup,
-      // @ts-ignore
-      keydown: t.keydown,
-      // @ts-ignore
-      input: t.input,
-      // @ts-ignore
-      change: t.change,
-      // @ts-ignore
-      focus: t.focus,
-      // @ts-ignore
-      blur: t.blur
-    })
-  ]);
-});
-export {
-  St as A,
-  Ce as B,
-  De as C,
-  Z as D,
-  p as F,
-  _t as H,
-  Yt as M,
-  ce as O,
-  wt as P,
-  pe as R,
-  ke as S,
-  A as T,
-  Se as U,
-  Pt as a,
-  Xt as b,
-  qt as c,
-  Y as d,
-  Nt as e,
-  Me as f,
-  ve as g,
-  Ie as h,
-  ue as i,
-  Oe as j,
-  ie as k,
-  Mt as l,
-  yt as m,
-  b as p
-};