@krosoft/react 0.0.124 → 0.0.125

package/dist/SearchInput-D6LmcOjp.js

@@ -0,0 +1,249 @@
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import * as N from "react";
+import { useState as k, useRef as C, useEffect as z, useMemo as S } from "react";
+import { I, bw as R, by as L, bx as T, aX as j } from "./toggle-group-CSdAiS44.js";
+import "./alert-B78CiTYe.js";
+import "@radix-ui/react-aspect-ratio";
+import { B as h } from "./tooltip-BWyFpIxo.js";
+import "@radix-ui/react-collapsible";
+import { CalendarIcon as O, XIcon as M, ChevronDownIcon as A, SearchIcon as D, CheckIcon as q } from "lucide-react";
+import "react-resizable-panels";
+import { c as m } from "./tailwind.helper-B6yFEsav.js";
+import "./select-MWzbMBAS.js";
+import "next-themes";
+import "sonner";
+import { format as x } from "date-fns";
+import { fr as v } from "date-fns/locale";
+const te = ({ date: r, onDateChange: o, placeholder: p }) => {
+  const [u, f] = k(!1), c = C(null);
+  z(() => {
+    if (!u) return;
+    const s = (n) => {
+      c.current !== null && !c.current.contains(n.target) && f(!1);
+    };
+    return document.addEventListener("mousedown", s), () => {
+      document.removeEventListener("mousedown", s);
+    };
+  }, [u]);
+  const d = () => {
+    f((s) => !s);
+  }, l = (s) => {
+    o(s), f(!1);
+  };
+  return /* @__PURE__ */ a("div", { ref: c, className: "relative w-full", children: [
+    /* @__PURE__ */ a(
+      h,
+      {
+        variant: "outline",
+        type: "button",
+        onClick: d,
+        className: m(
+          "w-full justify-start text-left font-normal focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+          u && "ring-2 ring-ring ring-offset-2",
+          r === void 0 && "text-muted-foreground"
+        ),
+        children: [
+          /* @__PURE__ */ t(O, { className: "mr-2 size-4 shrink-0" }),
+          r !== void 0 ? x(r, "dd/MM/yyyy", { locale: v }) : /* @__PURE__ */ t("span", { children: p })
+        ]
+      }
+    ),
+    u ? /* @__PURE__ */ t("div", { className: "absolute left-0 top-[calc(100%+4px)] z-[100] rounded-md border bg-popover text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 slide-in-from-top-2", children: /* @__PURE__ */ t(I, { mode: "single", selected: r, onSelect: l }) }) : null
+  ] });
+}, re = ({ value: r, onChange: o, placeholder: p = "Selectionner une periode", className: u }) => {
+  const [f, c] = N.useState(!1), [d, l] = N.useState(r);
+  N.useEffect(() => {
+    f && l(r);
+  }, [f, r]);
+  const s = (i) => {
+    i.stopPropagation(), o(void 0), c(!1);
+  }, n = () => {
+    o(d), c(!1);
+  }, g = () => {
+    l(r), c(!1);
+  }, b = () => {
+    l(void 0);
+  }, y = (i) => i != null && i.from ? !i.to || i.from.getTime() === i.to.getTime() ? x(i.from, "dd MMM yyyy", { locale: v }) : `${x(i.from, "dd MMM yyyy", { locale: v })} - ${x(i.to, "dd MMM yyyy", { locale: v })}` : p;
+  return /* @__PURE__ */ t("div", { className: m("grid gap-2", u), children: /* @__PURE__ */ a(R, { open: f, onOpenChange: c, children: [
+    /* @__PURE__ */ t(L, { asChild: !0, children: /* @__PURE__ */ a(h, { id: "date", variant: "outline", className: m("w-[300px] justify-start text-left font-normal", !(r != null && r.from) && "text-muted-foreground"), children: [
+      /* @__PURE__ */ t(O, { className: "mr-2 size-4" }),
+      y(r),
+      (r == null ? void 0 : r.from) && /* @__PURE__ */ t(
+        h,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon",
+          "aria-label": "Effacer la periode selectionnee",
+          className: "ml-auto h-5 w-5 opacity-50 hover:opacity-100",
+          onClick: s,
+          children: /* @__PURE__ */ t(M, { className: "size-4" })
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ a(T, { className: "w-auto p-0", align: "start", side: "bottom", sideOffset: 4, children: [
+      /* @__PURE__ */ t(
+        I,
+        {
+          mode: "range",
+          defaultMonth: d == null ? void 0 : d.from,
+          selected: d,
+          onSelect: l,
+          numberOfMonths: 2,
+          weekStartsOn: 1,
+          className: "pointer-events-auto p-3"
+        }
+      ),
+      /* @__PURE__ */ a("div", { className: "flex items-center justify-between border-t border-border px-3 py-2", children: [
+        /* @__PURE__ */ t(h, { variant: "ghost", size: "sm", onClick: b, children: "Effacer" }),
+        /* @__PURE__ */ a("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ t(h, { variant: "ghost", size: "sm", onClick: g, children: "Annuler" }),
+          /* @__PURE__ */ t(h, { size: "sm", onClick: n, children: "Appliquer" })
+        ] })
+      ] })
+    ] })
+  ] }) });
+}, oe = ({
+  options: r = [],
+  value: o,
+  onChange: p,
+  onClear: u,
+  placeholder: f = "Sélectionner...",
+  searchPlaceholder: c = "Rechercher...",
+  disabled: d = !1
+}) => {
+  const [l, s] = k(""), [n, g] = k(!1), b = C(null), y = C(null), i = S(() => l === "" ? r : r.filter((e) => e.label.toLowerCase().includes(l.toLowerCase())), [r, l]), E = S(() => {
+    var e;
+    if (!(o === void 0 || o === ""))
+      return ((e = r.find((w) => w.value === o)) == null ? void 0 : e.label) ?? o;
+  }, [r, o]);
+  z(() => {
+    n && requestAnimationFrame(() => {
+      var e;
+      (e = y.current) == null || e.focus();
+    });
+  }, [n]), z(() => {
+    if (!n) return;
+    const e = (w) => {
+      b.current !== null && !b.current.contains(w.target) && (g(!1), s(""));
+    };
+    return document.addEventListener("mousedown", e), () => {
+      document.removeEventListener("mousedown", e);
+    };
+  }, [n]);
+  const P = (e) => {
+    p(e), g(!1), s("");
+  };
+  return /* @__PURE__ */ a("div", { ref: b, className: "relative w-full", children: [
+    /* @__PURE__ */ a(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          d || g((e) => (e && s(""), !e));
+        },
+        disabled: d,
+        className: m(
+          "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+          n && "ring-2 ring-ring ring-offset-2",
+          (o === void 0 || o === "") && "text-muted-foreground"
+        ),
+        children: [
+          /* @__PURE__ */ t("span", { className: "truncate", children: E ?? f }),
+          /* @__PURE__ */ a("div", { className: "flex items-center gap-1", children: [
+            u && o !== void 0 && o !== "" && !d && /* @__PURE__ */ t(
+              "span",
+              {
+                role: "button",
+                tabIndex: -1,
+                onClick: (e) => {
+                  e.stopPropagation();
+                },
+                onPointerDown: (e) => {
+                  e.preventDefault(), e.stopPropagation(), u();
+                },
+                className: "text-muted-foreground hover:text-foreground",
+                children: /* @__PURE__ */ t(M, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ t(A, { className: m("size-4 opacity-50 shrink-0 transition-transform", n && "rotate-180") })
+          ] })
+        ]
+      }
+    ),
+    n ? /* @__PURE__ */ a("div", { className: "absolute left-0 right-0 top-[calc(100%+4px)] z-[100] rounded-md border bg-popover text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 slide-in-from-top-2", children: [
+      /* @__PURE__ */ t("div", { className: "border-b border-border p-2", children: /* @__PURE__ */ a("div", { className: "relative", children: [
+        /* @__PURE__ */ t(D, { className: "absolute left-2 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
+        /* @__PURE__ */ t(
+          "input",
+          {
+            ref: y,
+            className: "w-full rounded-md bg-muted/50 py-1.5 pl-7 pr-2 text-sm text-foreground placeholder:text-muted-foreground outline-none focus:ring-1 focus:ring-ring",
+            placeholder: c,
+            value: l,
+            onChange: (e) => {
+              s(e.target.value);
+            }
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ a("div", { className: "flex flex-col gap-0.5 max-h-56 overflow-y-auto p-1.5 scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-muted-foreground/20 scrollbar-track-transparent [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-muted-foreground/20 [&::-webkit-scrollbar-track]:bg-transparent", children: [
+        i.length === 0 && /* @__PURE__ */ t("p", { className: "px-2 py-3 text-center text-xs text-muted-foreground", children: "Aucun résultat" }),
+        i.map((e) => /* @__PURE__ */ a(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              P(e.value);
+            },
+            className: m(
+              "flex items-center gap-2.5 rounded-md px-2 py-2 text-sm hover:bg-muted cursor-pointer transition-colors text-left w-full",
+              o === e.value && "bg-muted font-medium"
+            ),
+            children: [
+              /* @__PURE__ */ t(q, { className: m("size-3.5 shrink-0", o === e.value ? "opacity-100" : "opacity-0") }),
+              e.label
+            ]
+          },
+          e.value
+        ))
+      ] })
+    ] }) : null
+  ] });
+}, ne = ({
+  searchQuery: r,
+  search: o,
+  placeholder: p = "Rechercher...",
+  onSearch: u,
+  onSubmit: f,
+  onClear: c,
+  className: d
+}) => {
+  const l = r ?? o ?? "", s = () => {
+    u(""), c !== void 0 && c();
+  };
+  return /* @__PURE__ */ a("div", { className: m("relative h-fit w-full md:w-64", d), children: [
+    /* @__PURE__ */ t(D, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground w-4 h-4" }),
+    /* @__PURE__ */ t(
+      j,
+      {
+        placeholder: p,
+        value: l,
+        onChange: (n) => {
+          u(n.target.value);
+        },
+        className: "pl-8",
+        onKeyDown: (n) => {
+          n.key === "Enter" && f !== void 0 && (n.preventDefault(), f());
+        }
+      }
+    ),
+    l !== "" ? /* @__PURE__ */ t("button", { onClick: s, className: "absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-700", type: "button", children: /* @__PURE__ */ t(M, { className: "size-4" }) }) : null
+  ] });
+};
+export {
+  te as D,
+  ne as S,
+  re as a,
+  oe as b
+};

package/dist/SkeletonCards-BIEnyOuZ.js

@@ -0,0 +1,62 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { formatNumber as h } from "@krosoft/core/helpers";
+import { useTranslation as C } from "react-i18next";
+import { c as s } from "./tailwind.helper-B6yFEsav.js";
+import { J as d, N as l, O as f, K as t } from "./toggle-group-CSdAiS44.js";
+import "./alert-B78CiTYe.js";
+import "@radix-ui/react-aspect-ratio";
+import "./tooltip-BWyFpIxo.js";
+import "@radix-ui/react-collapsible";
+import "lucide-react";
+import "react-resizable-panels";
+import "./select-MWzbMBAS.js";
+import "next-themes";
+import "sonner";
+import "react";
+const g = ({
+  titleKey: a,
+  value: r,
+  valueClassName: m,
+  icon: n,
+  iconClassName: c,
+  description: p,
+  descriptionClassName: u,
+  onClick: o
+}) => {
+  const { t: N } = C();
+  return /* @__PURE__ */ i(d, { className: s(o !== void 0 ? "hover:border-primary cursor-pointer" : ""), onClick: o, children: [
+    /* @__PURE__ */ i(l, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [
+      /* @__PURE__ */ e(f, { className: "text-sm font-medium", children: N(a) }),
+      /* @__PURE__ */ e(n, { className: s("size-6 text-muted-foreground", c) })
+    ] }),
+    /* @__PURE__ */ i(t, { children: [
+      /* @__PURE__ */ e("div", { className: s("text-2xl font-bold", m), children: h(r) }),
+      /* @__PURE__ */ e("p", { className: s("text-xs text-muted-foreground", u), children: p })
+    ] })
+  ] });
+}, $ = ({ stats: a }) => /* @__PURE__ */ e("div", { className: "grid gap-6 md:grid-cols-2 lg:grid-cols-4", children: a.map((r) => /* @__PURE__ */ e(
+  g,
+  {
+    titleKey: r.titleKey,
+    value: r.value,
+    valueClassName: r.valueClassName,
+    icon: r.icon,
+    iconClassName: r.iconClassName,
+    description: r.description,
+    descriptionClassName: r.descriptionClassName,
+    onClick: r.onClick
+  },
+  r.titleKey
+)) }), v = () => /* @__PURE__ */ i(d, { className: "animate-pulse", children: [
+  /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e("div", { className: "h-6 bg-muted rounded w-1/4" }) }),
+  /* @__PURE__ */ e(t, { children: /* @__PURE__ */ i("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ e("div", { className: "h-4 bg-muted rounded" }),
+    /* @__PURE__ */ e("div", { className: "h-4 bg-muted rounded w-3/4" })
+  ] }) })
+] }), q = ({ count: a = 1 }) => /* @__PURE__ */ e("div", { className: "grid gap-6", style: { gridTemplateColumns: `repeat(${a}, minmax(0, 1fr))` }, children: Array.from({ length: a }).map((r, m) => /* @__PURE__ */ e(v, {}, m)) });
+export {
+  g as K,
+  v as S,
+  $ as a,
+  q as b
+};