@douglasneuroinformatics/libui 3.6.0 → 3.6.2

package/dist/components.d.ts

@@ -1218,16 +1218,22 @@ type FileDropzoneProps = {
     acceptedFileTypes: {
         [key: string]: string[];
     };
+    className?: string;
+    description?: string;
     file: File | null;
     setFile: (file: File) => void;
+    titles?: {
+        dragActive: string;
+        dragInactive: string;
+    };
 };
-declare const FileDropzone: ({ acceptedFileTypes, file, setFile }: FileDropzoneProps) => react_jsx_runtime.JSX.Element;
+declare const FileDropzone: ({ acceptedFileTypes, className, description, file, setFile, titles }: FileDropzoneProps) => react_jsx_runtime.JSX.Element;
 
 type FormProps<TSchema extends z.ZodType<FormDataType>, TData extends z.TypeOf<TSchema> = z.TypeOf<TSchema>> = {
     [key: `data-${string}`]: unknown;
     className?: string;
     content: FormContent<TData>;
-    fieldsFooter?: React$1.ReactNode;
+    fieldsFooter?: React.ReactNode;
     id?: string;
     initialValues?: PartialNullableFormDataType<TData>;
     onError?: (error: z.ZodError<TData>) => void;

package/dist/components.js

@@ -2010,9 +2010,17 @@ var ErrorBoundary = ({ children }) => {
 
 // src/components/FileDropzone/FileDropzone.tsx
 import { useCallback } from "react";
+import { UploadIcon } from "lucide-react";
 import { useDropzone } from "react-dropzone";
 import { jsx as jsx92, jsxs as jsxs25 } from "react/jsx-runtime";
-var FileDropzone = ({ acceptedFileTypes, file, setFile }) => {
+var FileDropzone = ({
+  acceptedFileTypes,
+  className,
+  description,
+  file,
+  setFile,
+  titles
+}) => {
   const { t } = useTranslation();
   const handleDrop = useCallback(
     (acceptedFiles, rejectedFiles) => {
@@ -2028,21 +2036,28 @@ var FileDropzone = ({ acceptedFileTypes, file, setFile }) => {
     maxFiles: 1,
     onDrop: handleDrop
   });
-  return /* @__PURE__ */ jsxs25("div", { "data-testid": "dropzone", ...getRootProps(), children: [
-    /* @__PURE__ */ jsx92("p", { className: "mt-1 border border-dashed p-4 text-center text-sm", "data-testid": "dropzoneText", children: file ? file.name : isDragActive ? t({
-      en: "File to upload",
-      fr: "fichier \xE0 t\xE9l\xE9charger"
-    }) : t({
-      en: "Drag'n'drop files or click on box to upload",
-      fr: "Glissez-d\xE9posez les fichiers ou cliquez sur la case pour les t\xE9l\xE9charger"
-    }) }),
+  const dragActiveTitle = titles?.dragActive ?? t({
+    en: "File to upload",
+    fr: "fichier \xE0 t\xE9l\xE9charger"
+  });
+  const dragInactiveTitle = titles?.dragInactive ?? t({
+    en: "Drag and drop files or click on box to upload",
+    fr: "Glissez-d\xE9posez les fichiers ou cliquez sur la case pour les t\xE9l\xE9charger"
+  });
+  return /* @__PURE__ */ jsxs25("div", { className: cn("border border-dashed p-4", className), "data-testid": "dropzone", ...getRootProps(), children: [
+    /* @__PURE__ */ jsxs25("div", { className: "flex flex-col items-center gap-3", children: [
+      /* @__PURE__ */ jsx92(UploadIcon, { style: { height: 24, strokeWidth: 2, width: 24 } }),
+      /* @__PURE__ */ jsxs25("div", { className: "flex flex-col items-center gap-1 text-center", children: [
+        /* @__PURE__ */ jsx92("h3", { className: "text-lg font-semibold tracking-tight", "data-testid": "dropzone-title", children: file ? file.name : isDragActive ? dragActiveTitle : dragInactiveTitle }),
+        description && /* @__PURE__ */ jsx92("p", { className: "text-sm text-muted-foreground", children: description })
+      ] })
+    ] }),
     /* @__PURE__ */ jsx92("input", { ...getInputProps() })
   ] });
 };
 
 // src/components/Form/Form.tsx
-import { useEffect as useEffect10, useState as useState8 } from "react";
-import "react";
+import { useEffect as useEffect10, useLayoutEffect, useState as useState8 } from "react";
 import { get, set } from "lodash-es";
 import { twMerge } from "tailwind-merge";
 import "zod";
@@ -3457,7 +3472,7 @@ var Form = ({
   useEffect10(() => {
     revalidate();
   }, [resolvedLanguage]);
-  useEffect10(() => {
+  useLayoutEffect(() => {
     if (initialValues) {
       setValues(getInitialValues(initialValues));
     }
@@ -3579,7 +3594,7 @@ var LanguageToggle = ({
 };
 
 // src/components/LineGraph/LineGraph.tsx
-import * as React37 from "react";
+import * as React36 from "react";
 import { toBasicISOString as toBasicISOString3 } from "@douglasneuroinformatics/libjs";
 import {
   CartesianGrid,
@@ -3682,7 +3697,7 @@ function LineGraphComponent({
     /* @__PURE__ */ jsx139(Legend2, { wrapperStyle: { paddingLeft: 40, paddingTop: 10 } })
   ] }) });
 }
-var LineGraph = React37.memo(LineGraphComponent);
+var LineGraph = React36.memo(LineGraphComponent);
 
 // src/components/ListboxDropdown/ListboxDropdown.tsx
 import "react";
@@ -4292,7 +4307,7 @@ var SheetBody = ({
 };
 
 // src/components/Sheet/SheetContent.tsx
-import * as React50 from "react";
+import * as React49 from "react";
 import { Close as Close2, Content as Content11, Portal as Portal11 } from "@radix-ui/react-dialog";
 import { cva as cva5 } from "class-variance-authority";
 import { XIcon as XIcon3 } from "lucide-react";
@@ -4333,7 +4348,7 @@ var sheetVariants = cva5(
     }
   }
 );
-var SheetContent = React50.forwardRef(function SheetContent2({ children, className, side = "right", ...props }, ref) {
+var SheetContent = React49.forwardRef(function SheetContent2({ children, className, side = "right", ...props }, ref) {
   return /* @__PURE__ */ jsxs59(Portal11, { children: [
     /* @__PURE__ */ jsx169(SheetOverlay, {}),
     /* @__PURE__ */ jsxs59(Content11, { className: cn(sheetVariants({ side }), className), ref, ...props, children: [
@@ -4570,10 +4585,10 @@ var ThemeToggle = ({ onClick, variant = "outline", ...props }) => {
 };
 
 // src/components/Tooltip/TooltipContent.tsx
-import * as React54 from "react";
+import * as React53 from "react";
 import { Content as Content13 } from "@radix-ui/react-tooltip";
 import { jsx as jsx183 } from "react/jsx-runtime";
-var TooltipContent = React54.forwardRef(
+var TooltipContent = React53.forwardRef(
   function TooltipContent2({ className, collisionPadding = 0, sideOffset = 4, ...props }, ref) {
     return /* @__PURE__ */ jsx183(
       Content13,