fina-react-ds 1.0.10 → 1.0.12

package/dist/components/file-uploader.d.ts

@@ -0,0 +1,8 @@
+export declare function FileUploader({ onChange, "aria-invalid": ariaInvalid, fileTypes, ref, }: {
+    onChange?: (file: File | null) => void;
+    "aria-invalid"?: boolean;
+    fileTypes: Record<string, string[]>;
+    ref?: React.ForwardedRef<{
+        focus: () => void;
+    }>;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/file-uploader.js

@@ -0,0 +1,109 @@
+var F = Object.defineProperty;
+var f = (c, l) => F(c, "name", { value: l, configurable: !0 });
+import { jsxs as t, jsx as r, Fragment as m } from "react/jsx-runtime";
+import { useState as j, useImperativeHandle as k, useCallback as p } from "react";
+import { FileIcon as D, UploadIcon as I } from "lucide-react";
+import { useDropzone as S } from "react-dropzone";
+import { cn as n } from "../lib/utils.js";
+import { Button as w } from "./button.js";
+function T({
+  onChange: c,
+  "aria-invalid": l,
+  fileTypes: b,
+  ref: x
+}) {
+  const [o, a] = j([]);
+  k(x, () => ({
+    focus: /* @__PURE__ */ f(() => {
+      e != null && e.current && e.current.focus();
+    }, "focus")
+  }));
+  const v = p(
+    (i) => {
+      a(i), c == null || c(i.length > 0 ? i[0] : null);
+    },
+    [c]
+  ), g = /* @__PURE__ */ f(() => {
+    e != null && e.current && e.current.focus();
+  }, "handleFileDialogCancel"), { getRootProps: h, getInputProps: y, acceptedFiles: d, open: N, rootRef: e } = S({
+    maxFiles: 1,
+    noClick: !0,
+    onDrop: v,
+    onFileDialogCancel: g
+  }), z = p((i) => {
+    let s = 0, u = "ko";
+    return s = i.size / 1e3, s > 1e3 && (s /= 1e3, u = "mo"), s.toFixed(2) + " " + u;
+  }, []);
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      ...h(),
+      className: n(
+        "fc:bg-input fc:border fc:border-input-border fc:flex fc:flex-col fc:h-50 fc:w-full fc:rounded-md fc:px-3 fc:py-1 fc:text-base fc:shadow-xs fc:items-center fc:justify-center fc:md:text-sm fc:outline-none",
+        "fc:focus-visible:border-ring fc:focus-visible:ring-ring/50 fc:focus-visible:ring-[3px]",
+        "fc:aria-invalid:ring-destructive/20 fc:dark:aria-invalid:ring-destructive/40 fc:aria-invalid:border-destructive"
+      ),
+      "aria-invalid": l,
+      children: [
+        o.length > 0 && /* @__PURE__ */ t(m, { children: [
+          /* @__PURE__ */ r(
+            "div",
+            {
+              className: n(
+                "fc:bg-primary fc:text-primary-foreground fc:flex fc:items-center fc:justify-center fc:rounded-full fc:size-10 fc:mb-4"
+              ),
+              children: /* @__PURE__ */ r(D, { className: "fc:size-4" })
+            }
+          ),
+          /* @__PURE__ */ t("div", { className: "fc:mb-4 fc:text-center", children: [
+            d[0].name,
+            /* @__PURE__ */ r("br", {}),
+            z(d[0])
+          ] }),
+          /* @__PURE__ */ r(
+            w,
+            {
+              type: "button",
+              color: "destructive",
+              variant: "ghost",
+              onClick: /* @__PURE__ */ f(() => {
+                var i;
+                a([]), c == null || c(null), (i = e == null ? void 0 : e.current) == null || i.focus();
+              }, "onClick"),
+              children: "Supprimer"
+            }
+          )
+        ] }),
+        o.length === 0 && /* @__PURE__ */ t(m, { children: [
+          /* @__PURE__ */ r(
+            "div",
+            {
+              className: n(
+                "fc:bg-primary fc:text-primary-foreground fc:flex fc:items-center fc:justify-center fc:rounded-full fc:size-10 fc:mb-4"
+              ),
+              children: /* @__PURE__ */ r(I, { className: "fc:size-4" })
+            }
+          ),
+          /* @__PURE__ */ t("div", { className: "fc:mb-4", children: [
+            "Glisser-déposer ou",
+            " ",
+            /* @__PURE__ */ r("span", { className: "fc:font-bold fc:underline fc:cursor-pointer", onClick: N, children: "Choisir un fichier" }),
+            " ",
+            "à uploader"
+          ] }),
+          /* @__PURE__ */ t("div", { className: "fc:text-center fc:text-sm fc:md:text-xs", children: [
+            "Formats acceptés : ",
+            Object.keys(b).join(", "),
+            /* @__PURE__ */ r("br", {}),
+            "Taille max : 5Mo"
+          ] })
+        ] }),
+        /* @__PURE__ */ r("input", { ...y() })
+      ]
+    }
+  );
+}
+f(T, "FileUploader");
+export {
+  T as FileUploader
+};

package/dist/index.d.ts

@@ -10,6 +10,7 @@ export { DatePicker } from "./components/date-picker";
 export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from "./components/dialog";
 export { DataLoader } from "./components/data-loader";
 export { DropdownMenu, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, } from "./components/dropdown-menu";
+export { FileUploader } from "./components/file-uploader";
 export { HoverCard, HoverCardTrigger, HoverCardContent } from "./components/hover-card";
 export { Input } from "./components/input";
 export { Label } from "./components/label";

package/dist/index.js

@@ -4,33 +4,34 @@ import { Badge as f } from "./components/badge.js";
 import { Button as M, buttonVariants as s } from "./components/button.js";
 import { Avatar as P, AvatarFallback as c, AvatarImage as w } from "./components/avatar.js";
 import { Calendar as v } from "./components/calendar.js";
-import { Card as I, CardAction as k, CardContent as B, CardDescription as F, CardFooter as G, CardHeader as L, CardTitle as R } from "./components/card.js";
+import { Card as I, CardAction as k, CardContent as F, CardDescription as B, CardFooter as G, CardHeader as L, CardTitle as R } from "./components/card.js";
 import { Checkbox as O } from "./components/checkbox.js";
 import { DatePicker as N } from "./components/date-picker.js";
-import { Dialog as j, DialogClose as q, DialogContent as z, DialogDescription as J, DialogFooter as K, DialogHeader as Q, DialogOverlay as U, DialogPortal as W, DialogTitle as X, DialogTrigger as Y } from "./components/dialog.js";
+import { Dialog as V, DialogClose as j, DialogContent as q, DialogDescription as z, DialogFooter as J, DialogHeader as K, DialogOverlay as Q, DialogPortal as W, DialogTitle as X, DialogTrigger as Y } from "./components/dialog.js";
 import { DataLoader as _ } from "./components/data-loader.js";
 import { DropdownMenu as ee, DropdownMenuCheckboxItem as oe, DropdownMenuContent as re, DropdownMenuGroup as te, DropdownMenuItem as ae, DropdownMenuLabel as ie, DropdownMenuPortal as ne, DropdownMenuRadioGroup as le, DropdownMenuRadioItem as pe, DropdownMenuSeparator as de, DropdownMenuShortcut as ge, DropdownMenuSub as be, DropdownMenuSubContent as Se, DropdownMenuSubTrigger as ue, DropdownMenuTrigger as me } from "./components/dropdown-menu.js";
-import { HoverCard as xe, HoverCardContent as Te, HoverCardTrigger as fe } from "./components/hover-card.js";
-import { Input as Me } from "./components/input.js";
-import { Label as Ae } from "./components/label.js";
-import { ModeToggle as ce } from "./components/mode-toggle.js";
-import { Pagination as he, PaginationContent as ve, PaginationEllipsis as He, PaginationItem as Ie, PaginationLink as ke, PaginationNext as Be, PaginationPrevious as Fe } from "./components/pagination.js";
-import { PasswordRulesChecker as Le } from "./components/password-rules-checker.js";
-import { Popover as ye, PopoverAnchor as Oe, PopoverContent as Ee, PopoverTrigger as Ne } from "./components/popover.js";
-import { Select as je } from "./components/select.js";
-import { Separator as ze } from "./components/separator.js";
-import { Sheet as Ke, SheetBody as Qe, SheetClose as Ue, SheetContent as We, SheetDescription as Xe, SheetFooter as Ye, SheetHeader as Ze, SheetTitle as _e, SheetTrigger as $e } from "./components/sheet.js";
-import { Sidebar as oo, SidebarContent as ro, SidebarFooter as to, SidebarGroup as ao, SidebarGroupAction as io, SidebarGroupContent as no, SidebarGroupLabel as lo, SidebarHeader as po, SidebarInput as go, SidebarInset as bo, SidebarMenu as So, SidebarMenuAction as uo, SidebarMenuBadge as mo, SidebarMenuButton as Do, SidebarMenuItem as xo, SidebarMenuSkeleton as To, SidebarMenuSub as fo, SidebarMenuSubButton as Co, SidebarMenuSubItem as Mo, SidebarProvider as so, SidebarRail as Ao, SidebarSeparator as Po, SidebarTrigger as co, useSidebar as wo } from "./components/sidebar.js";
-import { SimplePagination as vo } from "./components/simple-pagination.js";
-import { SimpleTooltip as Io } from "./components/simple-tooltip.js";
-import { Skeleton as Bo } from "./components/skeleton.js";
-import { Switch as Go } from "./components/switch.js";
-import { Toaster as Ro } from "./components/sonner.js";
-import { Table as Oo, TableBody as Eo, TableCaption as No, TableCell as Vo, TableFooter as jo, TableHead as qo, TableHeader as zo, TableRow as Jo } from "./components/table.js";
-import { Tabs as Qo, TabsContent as Uo, TabsList as Wo, TabsTrigger as Xo } from "./components/tabs.js";
-import { Textarea as Zo } from "./components/textarea.js";
-import { Tooltip as $o, TooltipContent as er, TooltipProvider as or, TooltipTrigger as rr } from "./components/tooltip.js";
-import { ThemeProvider as ar, useTheme as ir } from "./providers/theme-provider.js";
+import { FileUploader as xe } from "./components/file-uploader.js";
+import { HoverCard as fe, HoverCardContent as Ce, HoverCardTrigger as Me } from "./components/hover-card.js";
+import { Input as Ae } from "./components/input.js";
+import { Label as ce } from "./components/label.js";
+import { ModeToggle as he } from "./components/mode-toggle.js";
+import { Pagination as He, PaginationContent as Ie, PaginationEllipsis as ke, PaginationItem as Fe, PaginationLink as Be, PaginationNext as Ge, PaginationPrevious as Le } from "./components/pagination.js";
+import { PasswordRulesChecker as ye } from "./components/password-rules-checker.js";
+import { Popover as Ee, PopoverAnchor as Ne, PopoverContent as Ue, PopoverTrigger as Ve } from "./components/popover.js";
+import { Select as qe } from "./components/select.js";
+import { Separator as Je } from "./components/separator.js";
+import { Sheet as Qe, SheetBody as We, SheetClose as Xe, SheetContent as Ye, SheetDescription as Ze, SheetFooter as _e, SheetHeader as $e, SheetTitle as eo, SheetTrigger as oo } from "./components/sheet.js";
+import { Sidebar as to, SidebarContent as ao, SidebarFooter as io, SidebarGroup as no, SidebarGroupAction as lo, SidebarGroupContent as po, SidebarGroupLabel as go, SidebarHeader as bo, SidebarInput as So, SidebarInset as uo, SidebarMenu as mo, SidebarMenuAction as Do, SidebarMenuBadge as xo, SidebarMenuButton as To, SidebarMenuItem as fo, SidebarMenuSkeleton as Co, SidebarMenuSub as Mo, SidebarMenuSubButton as so, SidebarMenuSubItem as Ao, SidebarProvider as Po, SidebarRail as co, SidebarSeparator as wo, SidebarTrigger as ho, useSidebar as vo } from "./components/sidebar.js";
+import { SimplePagination as Io } from "./components/simple-pagination.js";
+import { SimpleTooltip as Fo } from "./components/simple-tooltip.js";
+import { Skeleton as Go } from "./components/skeleton.js";
+import { Switch as Ro } from "./components/switch.js";
+import { Toaster as Oo } from "./components/sonner.js";
+import { Table as No, TableBody as Uo, TableCaption as Vo, TableCell as jo, TableFooter as qo, TableHead as zo, TableHeader as Jo, TableRow as Ko } from "./components/table.js";
+import { Tabs as Wo, TabsContent as Xo, TabsList as Yo, TabsTrigger as Zo } from "./components/tabs.js";
+import { Textarea as $o } from "./components/textarea.js";
+import { Tooltip as or, TooltipContent as rr, TooltipProvider as tr, TooltipTrigger as ar } from "./components/tooltip.js";
+import { ThemeProvider as nr, useTheme as lr } from "./providers/theme-provider.js";
 export {
   m as Alert,
   D as AlertDescription,
@@ -54,21 +55,21 @@ export {
   v as Calendar,
   I as Card,
   k as CardAction,
-  B as CardContent,
-  F as CardDescription,
+  F as CardContent,
+  B as CardDescription,
   G as CardFooter,
   L as CardHeader,
   R as CardTitle,
   O as Checkbox,
   _ as DataLoader,
   N as DatePicker,
-  j as Dialog,
-  q as DialogClose,
-  z as DialogContent,
-  J as DialogDescription,
-  K as DialogFooter,
-  Q as DialogHeader,
-  U as DialogOverlay,
+  V as Dialog,
+  j as DialogClose,
+  q as DialogContent,
+  z as DialogDescription,
+  J as DialogFooter,
+  K as DialogHeader,
+  Q as DialogOverlay,
   W as DialogPortal,
   X as DialogTitle,
   Y as DialogTrigger,
@@ -87,82 +88,83 @@ export {
   Se as DropdownMenuSubContent,
   ue as DropdownMenuSubTrigger,
   me as DropdownMenuTrigger,
-  xe as HoverCard,
-  Te as HoverCardContent,
-  fe as HoverCardTrigger,
-  Me as Input,
-  Ae as Label,
-  ce as ModeToggle,
-  he as Pagination,
-  ve as PaginationContent,
-  He as PaginationEllipsis,
-  Ie as PaginationItem,
-  ke as PaginationLink,
-  Be as PaginationNext,
-  Fe as PaginationPrevious,
-  Le as PasswordRulesChecker,
-  ye as Popover,
-  Oe as PopoverAnchor,
-  Ee as PopoverContent,
-  Ne as PopoverTrigger,
-  je as Select,
-  ze as Separator,
-  Ke as Sheet,
-  Qe as SheetBody,
-  Ue as SheetClose,
-  We as SheetContent,
-  Xe as SheetDescription,
-  Ye as SheetFooter,
-  Ze as SheetHeader,
-  _e as SheetTitle,
-  $e as SheetTrigger,
-  oo as Sidebar,
-  ro as SidebarContent,
-  to as SidebarFooter,
-  ao as SidebarGroup,
-  io as SidebarGroupAction,
-  no as SidebarGroupContent,
-  lo as SidebarGroupLabel,
-  po as SidebarHeader,
-  go as SidebarInput,
-  bo as SidebarInset,
-  So as SidebarMenu,
-  uo as SidebarMenuAction,
-  mo as SidebarMenuBadge,
-  Do as SidebarMenuButton,
-  xo as SidebarMenuItem,
-  To as SidebarMenuSkeleton,
-  fo as SidebarMenuSub,
-  Co as SidebarMenuSubButton,
-  Mo as SidebarMenuSubItem,
-  so as SidebarProvider,
-  Ao as SidebarRail,
-  Po as SidebarSeparator,
-  co as SidebarTrigger,
-  vo as SimplePagination,
-  Io as SimpleTooltip,
-  Bo as Skeleton,
-  Go as Switch,
-  Oo as Table,
-  Eo as TableBody,
-  No as TableCaption,
-  Vo as TableCell,
-  jo as TableFooter,
-  qo as TableHead,
-  zo as TableHeader,
-  Jo as TableRow,
-  Qo as Tabs,
-  Uo as TabsContent,
-  Wo as TabsList,
-  Xo as TabsTrigger,
-  Zo as Textarea,
-  ar as ThemeProvider,
-  Ro as Toaster,
-  $o as Tooltip,
-  er as TooltipContent,
-  or as TooltipProvider,
-  rr as TooltipTrigger,
+  xe as FileUploader,
+  fe as HoverCard,
+  Ce as HoverCardContent,
+  Me as HoverCardTrigger,
+  Ae as Input,
+  ce as Label,
+  he as ModeToggle,
+  He as Pagination,
+  Ie as PaginationContent,
+  ke as PaginationEllipsis,
+  Fe as PaginationItem,
+  Be as PaginationLink,
+  Ge as PaginationNext,
+  Le as PaginationPrevious,
+  ye as PasswordRulesChecker,
+  Ee as Popover,
+  Ne as PopoverAnchor,
+  Ue as PopoverContent,
+  Ve as PopoverTrigger,
+  qe as Select,
+  Je as Separator,
+  Qe as Sheet,
+  We as SheetBody,
+  Xe as SheetClose,
+  Ye as SheetContent,
+  Ze as SheetDescription,
+  _e as SheetFooter,
+  $e as SheetHeader,
+  eo as SheetTitle,
+  oo as SheetTrigger,
+  to as Sidebar,
+  ao as SidebarContent,
+  io as SidebarFooter,
+  no as SidebarGroup,
+  lo as SidebarGroupAction,
+  po as SidebarGroupContent,
+  go as SidebarGroupLabel,
+  bo as SidebarHeader,
+  So as SidebarInput,
+  uo as SidebarInset,
+  mo as SidebarMenu,
+  Do as SidebarMenuAction,
+  xo as SidebarMenuBadge,
+  To as SidebarMenuButton,
+  fo as SidebarMenuItem,
+  Co as SidebarMenuSkeleton,
+  Mo as SidebarMenuSub,
+  so as SidebarMenuSubButton,
+  Ao as SidebarMenuSubItem,
+  Po as SidebarProvider,
+  co as SidebarRail,
+  wo as SidebarSeparator,
+  ho as SidebarTrigger,
+  Io as SimplePagination,
+  Fo as SimpleTooltip,
+  Go as Skeleton,
+  Ro as Switch,
+  No as Table,
+  Uo as TableBody,
+  Vo as TableCaption,
+  jo as TableCell,
+  qo as TableFooter,
+  zo as TableHead,
+  Jo as TableHeader,
+  Ko as TableRow,
+  Wo as Tabs,
+  Xo as TabsContent,
+  Yo as TabsList,
+  Zo as TabsTrigger,
+  $o as Textarea,
+  nr as ThemeProvider,
+  Oo as Toaster,
+  or as Tooltip,
+  rr as TooltipContent,
+  tr as TooltipProvider,
+  ar as TooltipTrigger,
   s as buttonVariants,
-  wo as useSidebar,
-  ir as useTheme
+  vo as useSidebar,
+  lr as useTheme
 };

package/dist/themes/base.css

@@ -21,6 +21,7 @@
     --fc-font-weight-normal: 400;
     --fc-font-weight-medium: 500;
     --fc-font-weight-semibold: 600;
+    --fc-font-weight-bold: 700;
     --fc-tracking-tight: -0.025em;
     --fc-tracking-widest: 0.1em;
     --fc-leading-relaxed: 1.625;
@@ -306,6 +307,9 @@
   .fc\:mr-2 {
     margin-right: calc(var(--fc-spacing) * 2);
   }
+  .fc\:mb-4 {
+    margin-bottom: calc(var(--fc-spacing) * 4);
+  }
   .fc\:ml-auto {
     margin-left: auto;
   }
@@ -364,6 +368,10 @@
     width: calc(var(--fc-spacing) * 9);
     height: calc(var(--fc-spacing) * 9);
   }
+  .fc\:size-10 {
+    width: calc(var(--fc-spacing) * 10);
+    height: calc(var(--fc-spacing) * 10);
+  }
   .fc\:size-auto {
     width: auto;
     height: auto;
@@ -396,6 +404,9 @@
   .fc\:h-12 {
     height: calc(var(--fc-spacing) * 12);
   }
+  .fc\:h-50 {
+    height: calc(var(--fc-spacing) * 50);
+  }
   .fc\:h-\[1\.2rem\] {
     height: 1.2rem;
   }
@@ -966,6 +977,10 @@
     --tw-leading: 1;
     line-height: 1;
   }
+  .fc\:font-bold {
+    --tw-font-weight: var(--fc-font-weight-bold);
+    font-weight: var(--fc-font-weight-bold);
+  }
   .fc\:font-medium {
     --tw-font-weight: var(--fc-font-weight-medium);
     font-weight: var(--fc-font-weight-medium);
@@ -1077,6 +1092,9 @@
     --tw-numeric-spacing: tabular-nums;
     font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
   }
+  .fc\:underline {
+    text-decoration-line: underline;
+  }
   .fc\:underline-offset-4 {
     text-underline-offset: 4px;
   }
@@ -2469,6 +2487,12 @@
       line-height: var(--tw-leading, var(--fc-text-sm--line-height)) !important;
     }
   }
+  .fc\:md\:text-xs {
+    @media (width >= 48rem) {
+      font-size: var(--fc-text-xs);
+      line-height: var(--tw-leading, var(--fc-text-xs--line-height));
+    }
+  }
   .fc\:md\:opacity-0 {
     @media (width >= 48rem) {
       opacity: 0%;

package/package.json

@@ -5,7 +5,7 @@
     "url": "https://github.com/F1na/fina-react-ds"
   },
   "private": false,
-  "version": "1.0.10",
+  "version": "1.0.12",
   "type": "module",
   "files": [
     "dist"
@@ -30,6 +30,7 @@
     "radix-ui": "^1.4.2",
     "react-colorful": "^5.6.1",
     "react-day-picker": "9.7.0",
+    "react-dropzone": "^14.3.8",
     "react-select": "^5.10.1",
     "react-spinners": "^0.17.0",
     "sonner": "^2.0.5",