laif-ds 0.1.2 → 0.1.3

package/dist/components/ui/multiple-selector.js

@@ -0,0 +1,350 @@
+"use client";
+import { j as s } from "../../_virtual/jsx-runtime.js";
+import { Command as ne, useCommandState as ue } from "cmdk";
+import { X as q } from "lucide-react";
+import * as a from "react";
+import { useEffect as L, forwardRef as ie } from "react";
+import { Badge as fe } from "./badge.js";
+import { CommandItem as J, Command as de, CommandList as ae, CommandGroup as oe } from "./command.js";
+import { cn as b } from "../../lib/utils.js";
+import { Label as ce } from "./label.js";
+function ve(i, r) {
+  const [f, m] = a.useState(i);
+  return L(() => {
+    const o = setTimeout(() => m(i), r);
+    return () => {
+      clearTimeout(o);
+    };
+  }, [i, r]), f;
+}
+function K(i, r) {
+  if (i.length === 0)
+    return {};
+  if (!r)
+    return {
+      "": i
+    };
+  const f = {};
+  return i.forEach((m) => {
+    const o = m[r] || "";
+    f[o] || (f[o] = []), f[o].push(m);
+  }), f;
+}
+function me(i, r) {
+  const f = JSON.parse(JSON.stringify(i));
+  for (const [m, o] of Object.entries(f))
+    f[m] = o.filter((C) => !r.find((v) => v.value === C.value));
+  return f;
+}
+function xe(i, r) {
+  for (const [, f] of Object.entries(i))
+    if (f.some((m) => r.find((o) => o.value === m.value)))
+      return !0;
+  return !1;
+}
+const Q = ie(({ className: i, ...r }, f) => ue((o) => o.filtered.count === 0) ? /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: f,
+    className: b("py-6 text-center text-sm", i),
+    "cmdk-empty": "",
+    role: "presentation",
+    ...r
+  }
+) : null);
+Q.displayName = "CommandEmpty";
+const be = a.forwardRef(
+  ({
+    value: i,
+    onChange: r,
+    placeholder: f,
+    defaultOptions: m = [],
+    options: o,
+    delay: C,
+    onSearch: v,
+    onSearchSync: F,
+    loadingIndicator: Y,
+    emptyIndicator: V,
+    maxSelected: X = Number.MAX_SAFE_INTEGER,
+    onMaxSelected: k,
+    hidePlaceholderWhenSelected: _,
+    disabled: E,
+    groupBy: g,
+    className: Z,
+    badgeClassName: W,
+    selectFirstItem: B = !0,
+    creatable: D = !1,
+    triggerSearchOnFocus: I = !1,
+    commandProps: n,
+    inputProps: u,
+    hideClearAllButton: S = !1,
+    label: $
+  }, p) => {
+    const c = a.useRef(null), [w, G] = a.useState(!1), [P, z] = a.useState(!1), [H, M] = a.useState(!1), R = a.useRef(null), [l, O] = a.useState(i || []), [h, A] = a.useState(
+      K(m, g)
+    ), [x, U] = a.useState(""), j = ve(x, C || 500);
+    a.useImperativeHandle(
+      p,
+      () => ({
+        selectedValue: [...l],
+        input: c.current,
+        focus: () => {
+          var e;
+          return (e = c == null ? void 0 : c.current) == null ? void 0 : e.focus();
+        },
+        reset: () => O([])
+      }),
+      [l]
+    );
+    const N = (e) => {
+      R.current && !R.current.contains(e.target) && c.current && !c.current.contains(e.target) && (G(!1), c.current.blur());
+    }, T = a.useCallback(
+      (e) => {
+        const t = l.filter((d) => d.value !== e.value);
+        O(t), r == null || r(t);
+      },
+      [r, l]
+    ), ee = a.useCallback(
+      (e) => {
+        const t = c.current;
+        t && ((e.key === "Delete" || e.key === "Backspace") && t.value === "" && l.length > 0 && (l[l.length - 1].fixed || T(l[l.length - 1])), e.key === "Escape" && t.blur());
+      },
+      [T, l]
+    );
+    L(() => {
+      if (typeof document < "u")
+        return w ? (document.addEventListener("mousedown", N), document.addEventListener("touchend", N)) : (document.removeEventListener("mousedown", N), document.removeEventListener("touchend", N)), () => {
+          document.removeEventListener("mousedown", N), document.removeEventListener("touchend", N);
+        };
+    }, [w, N]), L(() => {
+      i && O(i);
+    }, [i]), L(() => {
+      if (!o || v)
+        return;
+      const e = K(o || [], g);
+      JSON.stringify(e) !== JSON.stringify(h) && A(e);
+    }, [m, o, g, v, h]), L(() => {
+      const e = () => {
+        const d = F == null ? void 0 : F(j);
+        A(K(d || [], g));
+      };
+      (async () => {
+        !F || !w || (I && e(), j && e());
+      })();
+    }, [j, g, w, I]), L(() => {
+      const e = async () => {
+        M(!0);
+        const d = await (v == null ? void 0 : v(j));
+        A(K(d || [], g)), M(!1);
+      };
+      (async () => {
+        !v || !w || (I && await e(), j && await e());
+      })();
+    }, [j, g, w, I]);
+    const te = () => {
+      if (!D || xe(h, [{ value: x, label: x }]) || l.find((t) => t.value === x))
+        return;
+      const e = /* @__PURE__ */ s.jsx(
+        J,
+        {
+          value: x,
+          className: "cursor-pointer",
+          onMouseDown: (t) => {
+            t.preventDefault(), t.stopPropagation();
+          },
+          onSelect: (t) => {
+            if (l.length >= X) {
+              k == null || k(l.length);
+              return;
+            }
+            U("");
+            const d = [...l, { value: t, label: t }];
+            O(d), r == null || r(d);
+          },
+          children: `Create "${x}"`
+        }
+      );
+      if (!v && x.length > 0 || v && j.length > 0 && !H)
+        return e;
+    }, le = a.useCallback(() => {
+      if (V)
+        return v && !D && Object.keys(h).length === 0 ? /* @__PURE__ */ s.jsx(J, { value: "-", disabled: !0, children: V }) : /* @__PURE__ */ s.jsx(Q, { children: V });
+    }, [D, V, v, h]), se = a.useMemo(
+      () => me(h, l),
+      [h, l]
+    ), re = a.useCallback(() => {
+      if (n != null && n.filter)
+        return n.filter;
+      if (D)
+        return (e, t) => e.toLowerCase().includes(t.toLowerCase()) ? 1 : -1;
+    }, [D, n == null ? void 0 : n.filter]);
+    return /* @__PURE__ */ s.jsxs("div", { className: "flex flex-col space-y-1.5", children: [
+      $ && /* @__PURE__ */ s.jsx(ce, { children: $ }),
+      /* @__PURE__ */ s.jsxs(
+        de,
+        {
+          ref: R,
+          ...n,
+          onKeyDown: (e) => {
+            var t;
+            ee(e), (t = n == null ? void 0 : n.onKeyDown) == null || t.call(n, e);
+          },
+          className: b("h-auto overflow-visible bg-transparent", n == null ? void 0 : n.className),
+          shouldFilter: (n == null ? void 0 : n.shouldFilter) !== void 0 ? n.shouldFilter : !v,
+          filter: re(),
+          children: [
+            /* @__PURE__ */ s.jsx(
+              "div",
+              {
+                className: b(
+                  "min-h-10 rounded-md border border-input text-base ring-offset-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 md:text-sm",
+                  {
+                    "px-3 py-2": l.length !== 0,
+                    "cursor-text": !E && l.length !== 0
+                  },
+                  Z
+                ),
+                onClick: () => {
+                  var e;
+                  E || (e = c == null ? void 0 : c.current) == null || e.focus();
+                },
+                children: /* @__PURE__ */ s.jsxs("div", { className: "relative flex flex-wrap gap-1", children: [
+                  l.map((e) => /* @__PURE__ */ s.jsxs(
+                    fe,
+                    {
+                      className: b(
+                        "data-[disabled]:bg-muted-foreground data-[disabled]:text-muted data-[disabled]:hover:bg-muted-foreground",
+                        "data-[fixed]:bg-muted-foreground data-[fixed]:text-muted data-[fixed]:hover:bg-muted-foreground",
+                        W
+                      ),
+                      "data-fixed": e.fixed,
+                      "data-disabled": E || void 0,
+                      children: [
+                        e.label,
+                        /* @__PURE__ */ s.jsx(
+                          "button",
+                          {
+                            type: "button",
+                            className: b(
+                              "ml-1 rounded-full outline-none ring-offset-background focus:ring-2 focus:ring-ring focus:ring-offset-2",
+                              (E || e.fixed) && "hidden"
+                            ),
+                            onKeyDown: (t) => {
+                              t.key === "Enter" && T(e);
+                            },
+                            onMouseDown: (t) => {
+                              t.preventDefault(), t.stopPropagation();
+                            },
+                            onClick: () => T(e),
+                            children: /* @__PURE__ */ s.jsx(q, { className: "h-3 w-3 text-muted-foreground hover:text-foreground" })
+                          }
+                        )
+                      ]
+                    },
+                    e.value
+                  )),
+                  /* @__PURE__ */ s.jsx(
+                    ne.Input,
+                    {
+                      ...u,
+                      ref: c,
+                      value: x,
+                      disabled: E,
+                      onValueChange: (e) => {
+                        var t;
+                        U(e), (t = u == null ? void 0 : u.onValueChange) == null || t.call(u, e);
+                      },
+                      onBlur: (e) => {
+                        var t;
+                        P || G(!1), (t = u == null ? void 0 : u.onBlur) == null || t.call(u, e);
+                      },
+                      onFocus: (e) => {
+                        var t;
+                        G(!0), (t = u == null ? void 0 : u.onFocus) == null || t.call(u, e);
+                      },
+                      placeholder: _ && l.length !== 0 ? "" : f,
+                      className: b(
+                        "flex-1 bg-transparent outline-none placeholder:text-muted-foreground",
+                        {
+                          "w-full": _,
+                          "px-3 py-2": l.length === 0,
+                          "ml-1": l.length !== 0
+                        },
+                        u == null ? void 0 : u.className
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ s.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        O(l.filter((e) => e.fixed)), r == null || r(l.filter((e) => e.fixed));
+                      },
+                      className: b(
+                        "absolute right-0 h-6 w-6 p-0",
+                        (S || E || l.length < 1 || l.filter((e) => e.fixed).length === l.length) && "hidden"
+                      ),
+                      children: /* @__PURE__ */ s.jsx(q, {})
+                    }
+                  )
+                ] })
+              }
+            ),
+            /* @__PURE__ */ s.jsx("div", { className: "relative", children: w && /* @__PURE__ */ s.jsx(
+              ae,
+              {
+                className: "absolute top-1 z-10 w-full rounded-md border bg-popover text-popover-foreground shadow-md outline-none animate-in",
+                onMouseLeave: () => {
+                  z(!1);
+                },
+                onMouseEnter: () => {
+                  z(!0);
+                },
+                onMouseUp: () => {
+                  var e;
+                  (e = c == null ? void 0 : c.current) == null || e.focus();
+                },
+                children: H ? /* @__PURE__ */ s.jsx(s.Fragment, { children: Y }) : /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+                  le(),
+                  te(),
+                  !B && /* @__PURE__ */ s.jsx(J, { value: "-", className: "hidden" }),
+                  Object.entries(se).map(([e, t]) => /* @__PURE__ */ s.jsx(oe, { heading: e, className: "h-full overflow-auto", children: /* @__PURE__ */ s.jsx(s.Fragment, { children: t.map((d) => /* @__PURE__ */ s.jsx(
+                    J,
+                    {
+                      value: d.label,
+                      disabled: d.disable,
+                      onMouseDown: (y) => {
+                        y.preventDefault(), y.stopPropagation();
+                      },
+                      onSelect: () => {
+                        if (l.length >= X) {
+                          k == null || k(l.length);
+                          return;
+                        }
+                        U("");
+                        const y = [...l, d];
+                        O(y), r == null || r(y);
+                      },
+                      className: b(
+                        "cursor-pointer",
+                        d.disable && "cursor-default text-muted-foreground"
+                      ),
+                      children: d.label
+                    },
+                    d.value
+                  )) }) }, e))
+                ] })
+              }
+            ) })
+          ]
+        }
+      )
+    ] });
+  }
+);
+be.displayName = "MultipleSelector";
+export {
+  be as MultipleSelector,
+  ve as useDebounce
+};

package/dist/components/ui/navigation-menu.js

@@ -0,0 +1,171 @@
+"use client";
+import { j as e } from "../../_virtual/jsx-runtime.js";
+import * as n from "@radix-ui/react-navigation-menu";
+import { cva as s } from "class-variance-authority";
+import { ChevronDownIcon as u } from "lucide-react";
+import { cn as o } from "../../lib/utils.js";
+function f({
+  className: t,
+  children: a,
+  viewport: i = !0,
+  ...r
+}) {
+  return /* @__PURE__ */ e.jsxs(
+    n.Root,
+    {
+      "data-slot": "navigation-menu",
+      "data-viewport": i,
+      className: o(
+        "group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
+        t
+      ),
+      ...r,
+      children: [
+        a,
+        i && /* @__PURE__ */ e.jsx(l, {})
+      ]
+    }
+  );
+}
+function p({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    n.List,
+    {
+      "data-slot": "navigation-menu-list",
+      className: o(
+        "group flex flex-1 list-none items-center justify-center gap-1",
+        t
+      ),
+      ...a
+    }
+  );
+}
+function x({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    n.Item,
+    {
+      "data-slot": "navigation-menu-item",
+      className: o("relative", t),
+      ...a
+    }
+  );
+}
+const d = s(
+  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1"
+);
+function w({
+  className: t,
+  children: a,
+  ...i
+}) {
+  return /* @__PURE__ */ e.jsxs(
+    n.Trigger,
+    {
+      "data-slot": "navigation-menu-trigger",
+      className: o(d(), "group", t),
+      ...i,
+      children: [
+        a,
+        " ",
+        /* @__PURE__ */ e.jsx(
+          u,
+          {
+            className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+}
+function b({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    n.Content,
+    {
+      "data-slot": "navigation-menu-content",
+      className: o(
+        "data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto",
+        "group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none",
+        t
+      ),
+      ...a
+    }
+  );
+}
+function l({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      className: o(
+        "absolute top-full left-0 isolate z-50 flex justify-center"
+      ),
+      children: /* @__PURE__ */ e.jsx(
+        n.Viewport,
+        {
+          "data-slot": "navigation-menu-viewport",
+          className: o(
+            "origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
+            t
+          ),
+          ...a
+        }
+      )
+    }
+  );
+}
+function h({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    n.Link,
+    {
+      "data-slot": "navigation-menu-link",
+      className: o(
+        "data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4",
+        t
+      ),
+      ...a
+    }
+  );
+}
+function N({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    n.Indicator,
+    {
+      "data-slot": "navigation-menu-indicator",
+      className: o(
+        "data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden",
+        t
+      ),
+      ...a,
+      children: /* @__PURE__ */ e.jsx("div", { className: "bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md" })
+    }
+  );
+}
+export {
+  f as NavigationMenu,
+  b as NavigationMenuContent,
+  N as NavigationMenuIndicator,
+  x as NavigationMenuItem,
+  h as NavigationMenuLink,
+  p as NavigationMenuList,
+  w as NavigationMenuTrigger,
+  l as NavigationMenuViewport,
+  d as navigationMenuTriggerStyle
+};

package/dist/components/ui/pagination.js

@@ -0,0 +1,119 @@
+"use client";
+import { j as t } from "../../_virtual/jsx-runtime.js";
+import { MoreHorizontalIcon as r, ChevronRightIcon as l, ChevronLeftIcon as c } from "lucide-react";
+import { cn as i } from "../../lib/utils.js";
+import { buttonVariants as p } from "./button.js";
+function d({ className: a, ...n }) {
+  return /* @__PURE__ */ t.jsx(
+    "nav",
+    {
+      role: "navigation",
+      "aria-label": "pagination",
+      "data-slot": "pagination",
+      className: i("mx-auto flex w-full justify-center", a),
+      ...n
+    }
+  );
+}
+function f({
+  className: a,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsx(
+    "ul",
+    {
+      "data-slot": "pagination-content",
+      className: i("flex flex-row items-center gap-1", a),
+      ...n
+    }
+  );
+}
+function j({ ...a }) {
+  return /* @__PURE__ */ t.jsx("li", { "data-slot": "pagination-item", ...a });
+}
+function e({
+  className: a,
+  isActive: n,
+  size: s = "icon",
+  ...o
+}) {
+  return /* @__PURE__ */ t.jsx(
+    "a",
+    {
+      "aria-current": n ? "page" : void 0,
+      "data-slot": "pagination-link",
+      "data-active": n,
+      className: i(
+        p({
+          variant: n ? "outline" : "ghost",
+          size: s
+        }),
+        a
+      ),
+      ...o
+    }
+  );
+}
+function h({
+  className: a,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    e,
+    {
+      "aria-label": "Go to previous page",
+      size: "default",
+      className: i("gap-1 px-2.5 sm:pl-2.5", a),
+      ...n,
+      children: [
+        /* @__PURE__ */ t.jsx(c, {}),
+        /* @__PURE__ */ t.jsx("span", { className: "hidden sm:block", children: "Previous" })
+      ]
+    }
+  );
+}
+function N({
+  className: a,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    e,
+    {
+      "aria-label": "Go to next page",
+      size: "default",
+      className: i("gap-1 px-2.5 sm:pr-2.5", a),
+      ...n,
+      children: [
+        /* @__PURE__ */ t.jsx("span", { className: "hidden sm:block", children: "Next" }),
+        /* @__PURE__ */ t.jsx(l, {})
+      ]
+    }
+  );
+}
+function P({
+  className: a,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    "span",
+    {
+      "aria-hidden": !0,
+      "data-slot": "pagination-ellipsis",
+      className: i("flex size-9 items-center justify-center", a),
+      ...n,
+      children: [
+        /* @__PURE__ */ t.jsx(r, { className: "size-4" }),
+        /* @__PURE__ */ t.jsx("span", { className: "sr-only", children: "More pages" })
+      ]
+    }
+  );
+}
+export {
+  d as Pagination,
+  f as PaginationContent,
+  P as PaginationEllipsis,
+  j as PaginationItem,
+  e as PaginationLink,
+  N as PaginationNext,
+  h as PaginationPrevious
+};

package/dist/components/ui/popover.js

@@ -0,0 +1,39 @@
+"use client";
+import { j as t } from "../../_virtual/jsx-runtime.js";
+import * as e from "@radix-ui/react-popover";
+import { cn as n } from "../../lib/utils.js";
+function p({
+  ...o
+}) {
+  return /* @__PURE__ */ t.jsx(e.Root, { "data-slot": "popover", ...o });
+}
+function m({
+  ...o
+}) {
+  return /* @__PURE__ */ t.jsx(e.Trigger, { "data-slot": "popover-trigger", ...o });
+}
+function l({
+  className: o,
+  align: r = "center",
+  sideOffset: a = 4,
+  ...i
+}) {
+  return /* @__PURE__ */ t.jsx(e.Portal, { children: /* @__PURE__ */ t.jsx(
+    e.Content,
+    {
+      "data-slot": "popover-content",
+      align: r,
+      sideOffset: a,
+      className: n(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
+        o
+      ),
+      ...i
+    }
+  ) });
+}
+export {
+  p as Popover,
+  l as PopoverContent,
+  m as PopoverTrigger
+};