@adamosuiteservices/ui 2.13.0 → 2.13.2

package/dist/components/ui/file-upload/file-upload.d.ts

@@ -3,12 +3,20 @@ export type FileUploadLabels = {
     dragDrop?: string;
     selectFile?: string;
     fileRequirements?: string;
+    filesSelected?: (count: number) => string;
 };
 export type FileUploadProps = ComponentProps<"div"> & Readonly<{
-    selectedFile: File | null;
-    onFileSelect: (file: File | null) => void;
+    selectedFile?: File | null;
+    selectedFiles?: File[];
+    onFileSelect?: (file: File | null) => void;
+    onFilesSelect?: (files: File[]) => void;
+    onInvalidFile?: (file: File, reason: "extension" | "size") => void;
     acceptedExtensions?: string[];
     maxSizeInMB?: number;
+    maxFiles?: number;
+    multiple?: boolean;
+    filesPosition?: "above" | "below";
+    invalid?: boolean;
     labels?: FileUploadLabels;
 }>;
-export declare function FileUpload({ className, selectedFile, onFileSelect, acceptedExtensions, maxSizeInMB, labels, ...props }: FileUploadProps): import("react/jsx-runtime").JSX.Element;
+export declare function FileUpload({ className, selectedFile, selectedFiles, onFileSelect, onFilesSelect, onInvalidFile, acceptedExtensions, maxSizeInMB, maxFiles, multiple, filesPosition, invalid, labels, ...props }: FileUploadProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/typography/typography.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 declare const typographyVariants: (props?: ({
     variant?: "caption" | "sm" | "lg" | "md" | "xs" | null | undefined;
-    color?: "default" | "muted" | null | undefined;
+    color?: "default" | "success" | "warning" | "destructive" | "secondary" | "waiting" | "muted" | "primary" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare function Typography({ className, variant, color, asChild, ...props }: React.ComponentProps<"p"> & VariantProps<typeof typographyVariants> & {
     asChild?: boolean;

package/dist/file-upload.cjs

@@ -1,18 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-BB_1_6y_.cjs"),p=require("./button-Day6_fbu.cjs"),l=require("./icon-DPMQJBkA.cjs"),r=require("./typography-DqQZZpkD.cjs"),a=require("./index-DoxiiusW.cjs"),N=require("react");function D({className:j,selectedFile:n,onFileSelect:m,acceptedExtensions:d=[".xls",".xlsx",".numbers"],maxSizeInMB:x=50,labels:i,...f}){const[c,o]=N.useState(!1),h=d.join(","),g=x*1024*1024,y=s=>{s.preventDefault(),o(!0)},R=s=>{s.preventDefault(),o(!1)},b=s=>{s.preventDefault(),o(!1);const t=s.dataTransfer.files[0];t&&u(t)&&m(t)},v=s=>{const t=s.target.files?.[0];t&&u(t)&&m(t)},E=()=>{m(null)},u=s=>{const t=s.name.substring(s.name.lastIndexOf("."));return d.includes(t.toLowerCase())&&s.size<=g};return e.jsxRuntimeExports.jsx("div",{className:a.cn("adm:flex adm:flex-col",j),...f,children:n?e.jsxRuntimeExports.jsxs("div",{className:a.cn(`
-            adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border
-            adm:border-input adm:bg-muted adm:p-6
-          `),children:[e.jsxRuntimeExports.jsx("div",{className:a.cn(`
-              adm:flex adm:items-center adm:justify-center adm:rounded-xl
-              adm:bg-primary-50 adm:p-2.5
-            `),children:e.jsxRuntimeExports.jsx(l.Icon,{symbol:"text_snippet",className:"adm:text-primary"})}),e.jsxRuntimeExports.jsxs("div",{className:`
-              adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
-            `,children:[e.jsxRuntimeExports.jsx("div",{className:"adm:min-w-0 adm:flex-1",children:e.jsxRuntimeExports.jsx(r.Typography,{className:"adm:truncate adm:font-semibold",children:n.name})}),e.jsxRuntimeExports.jsxs(r.Typography,{className:"adm:shrink-0",color:"muted",children:[(n.size/1024/1024).toFixed(1)," MB"]})]}),e.jsxRuntimeExports.jsx(p.Button,{variant:"destructive-medium",onClick:E,type:"button",children:e.jsxRuntimeExports.jsx(l.Icon,{symbol:"delete",className:"adm:text-destructive"})})]}):e.jsxRuntimeExports.jsxs("div",{onDragOver:y,onDragLeave:R,onDrop:b,className:a.cn(`
-                adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
-                adm:border-2
-              `,`
-                adm:border-dashed adm:bg-background adm:p-6
-                adm:transition-colors
-              `,{"adm:border-primary":c,"adm:border-input":!c}),children:[e.jsxRuntimeExports.jsx("div",{className:a.cn(`
-              adm:flex adm:items-center adm:justify-center adm:rounded-xl
-              adm:bg-primary-50 adm:p-2.5
-            `),children:e.jsxRuntimeExports.jsx(l.Icon,{symbol:"text_snippet",className:"adm:text-primary"})}),e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:items-center adm:gap-2",children:[e.jsxRuntimeExports.jsx(r.Typography,{children:i?.dragDrop||"Drag and drop your file here or"}),e.jsxRuntimeExports.jsxs("label",{htmlFor:"file-upload",children:[e.jsxRuntimeExports.jsx("input",{id:"file-upload",type:"file",accept:h,onChange:v,className:"adm:hidden"}),e.jsxRuntimeExports.jsx(p.Button,{asChild:!0,type:"button",variant:"link",className:"adm:cursor-pointer",children:e.jsxRuntimeExports.jsx("span",{children:i?.selectFile||"Select the file"})})]})]}),e.jsxRuntimeExports.jsx(r.Typography,{className:"adm:text-center",color:"muted",children:i?.fileRequirements||`Allowed files: ${d.join(", ")}. Maximum size ${x} MB.`})]})})}exports.FileUpload=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./jsx-runtime-BB_1_6y_.cjs"),T=require("./button-Day6_fbu.cjs"),w=require("./icon-DPMQJBkA.cjs"),h=require("./typography-Bj8oEDuE.cjs"),g=require("./index-DoxiiusW.cjs"),O=require("react");function U({isDragging:r,isMultiple:a,invalid:s,accept:o,acceptedExtensions:n,maxSizeInMB:x,maxFiles:c,labels:i,onDragOver:j,onDragLeave:b,onDrop:R,onFileChange:u}){return e.jsxRuntimeExports.jsxs("div",{onDragOver:j,onDragLeave:b,onDrop:R,className:g.cn(`
+          adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
+          adm:border-2
+        `,"adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",{"adm:border-primary":r&&!s,"adm:border-destructive":s,"adm:border-input":!r&&!s}),children:[e.jsxRuntimeExports.jsx("div",{className:g.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",s?"adm:bg-destructive/10":"adm:bg-primary-50"),children:e.jsxRuntimeExports.jsx(w.Icon,{symbol:"text_snippet",className:s?"adm:text-destructive":"adm:text-primary"})}),e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:items-center adm:gap-2",children:[e.jsxRuntimeExports.jsx(h.Typography,{color:s?"destructive":void 0,children:i?.dragDrop||(a?"Drag and drop your files here or":"Drag and drop your file here or")}),e.jsxRuntimeExports.jsxs("label",{htmlFor:"file-upload",children:[e.jsxRuntimeExports.jsx("input",{id:"file-upload",type:"file",accept:o,multiple:a,onChange:u,className:"adm:hidden"}),e.jsxRuntimeExports.jsx(T.Button,{asChild:!0,type:"button",variant:"link",className:"adm:cursor-pointer",children:e.jsxRuntimeExports.jsx("span",{children:i?.selectFile||(a?"Select files":"Select the file")})})]})]}),e.jsxRuntimeExports.jsx(h.Typography,{className:"adm:text-center",color:s?"destructive":"muted",children:i?.fileRequirements||`Allowed files: ${n.join(", ")}. Maximum size ${x} MB${a?`. Up to ${c} files`:""}.`})]})}function V({file:r,invalid:a,onRemove:s}){return e.jsxRuntimeExports.jsxs("div",{className:g.cn("adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border adm:p-6",a?"adm:border-destructive adm:bg-destructive/5":"adm:border-input adm:bg-muted"),children:[e.jsxRuntimeExports.jsx("div",{className:g.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",a?"adm:bg-destructive/10":"adm:bg-primary-50"),children:e.jsxRuntimeExports.jsx(w.Icon,{symbol:"text_snippet",className:a?"adm:text-destructive":"adm:text-primary"})}),e.jsxRuntimeExports.jsxs("div",{className:`
+        adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
+      `,children:[e.jsxRuntimeExports.jsx("div",{className:"adm:min-w-0 adm:flex-1",children:e.jsxRuntimeExports.jsx(h.Typography,{className:"adm:truncate adm:font-semibold",children:r.name})}),e.jsxRuntimeExports.jsxs(h.Typography,{className:"adm:shrink-0",color:"muted",children:[(r.size/1024/1024).toFixed(1)," MB"]})]}),e.jsxRuntimeExports.jsx(T.Button,{variant:"destructive-medium",onClick:s,type:"button",children:e.jsxRuntimeExports.jsx(w.Icon,{symbol:"delete",className:"adm:text-destructive"})})]})}function A({files:r,isMultiple:a,invalid:s,labels:o,onRemoveFile:n,onClearAll:x}){return r.length===0?null:e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:gap-3",children:[a&&r.length>1&&e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:items-center adm:justify-between",children:[e.jsxRuntimeExports.jsx(h.Typography,{className:"adm:text-sm adm:font-medium",color:s?"destructive":void 0,children:o?.filesSelected?.(r.length)||`${r.length} file${r.length!==1?"s":""} selected`}),e.jsxRuntimeExports.jsx(T.Button,{variant:"ghost",size:"sm",onClick:x,type:"button",children:"Clear all"})]}),r.map((c,i)=>e.jsxRuntimeExports.jsx(V,{file:c,invalid:s,onRemove:()=>n(i)},`${c.name}-${i}`))]})}function _({className:r,selectedFile:a,selectedFiles:s,onFileSelect:o,onFilesSelect:n,onInvalidFile:x,acceptedExtensions:c=[".xls",".xlsx",".numbers"],maxSizeInMB:i=50,maxFiles:j=10,multiple:b=!1,filesPosition:R="below",invalid:u=!1,labels:y,...$}){const[q,E]=O.useState(!1),z=c.join(","),k=i*1024*1024,m=b||s!==void 0||n!==void 0,p=m?s||[]:a?[a]:[],B=t=>{t.preventDefault(),E(!0)},F=t=>{t.preventDefault(),E(!1)},I=t=>{if(t.preventDefault(),E(!1),m){const l=Array.from(t.dataTransfer.files).filter(v);if(l.length>0){const C=[...s||[],...l].slice(0,j);n&&n(C)}}else{const d=t.dataTransfer.files[0];d&&v(d)&&o&&o(d)}},L=t=>{if(m){const l=(t.target.files?Array.from(t.target.files):[]).filter(v);if(l.length>0){const C=[...s||[],...l].slice(0,j);n&&n(C)}}else{const d=t.target.files?.[0];d&&v(d)&&o&&o(d)}t.target.value=""},N=t=>{if(m){const d=p.filter((l,f)=>f!==t);n&&n(d)}else o&&o(null)},v=t=>{const d=t.name.substring(t.name.lastIndexOf(".")),l=c.includes(d.toLowerCase()),f=t.size<=k;return!l&&x?x(t,"extension"):!f&&x&&x(t,"size"),l&&f},D=()=>{m?n&&n([]):o&&o(null)};return e.jsxRuntimeExports.jsxs("div",{className:g.cn("adm:flex adm:flex-col adm:gap-4",r),...$,children:[m&&R==="above"&&e.jsxRuntimeExports.jsx(A,{files:p,isMultiple:m,invalid:u,labels:y,onRemoveFile:N,onClearAll:D}),(m||p.length===0)&&e.jsxRuntimeExports.jsx(U,{isDragging:q,isMultiple:m,invalid:u,accept:z,acceptedExtensions:c,maxSizeInMB:i,maxFiles:j,labels:y,onDragOver:B,onDragLeave:F,onDrop:I,onFileChange:L}),!m&&p.length>0&&e.jsxRuntimeExports.jsx(A,{files:p,isMultiple:m,invalid:u,labels:y,onRemoveFile:N,onClearAll:D}),m&&R==="below"&&e.jsxRuntimeExports.jsx(A,{files:p,isMultiple:m,invalid:u,labels:y,onRemoveFile:N,onClearAll:D})]})}exports.FileUpload=_;

package/dist/file-upload.js

@@ -1,146 +1,276 @@
 import { j as e } from "./jsx-runtime-BzflLqGi.js";
-import { B as f } from "./button-Bn4LFAa9.js";
-import { I as o } from "./icon-DKAhvlX_.js";
-import { T as m } from "./typography-9EoV0kcN.js";
-import { c as s } from "./index-CRiPKpXj.js";
-import { useState as I } from "react";
-function L({
-  className: u,
-  selectedFile: r,
-  onFileSelect: t,
-  acceptedExtensions: n = [".xls", ".xlsx", ".numbers"],
-  maxSizeInMB: c = 50,
-  labels: i,
-  ...h
+import { B as z } from "./button-Bn4LFAa9.js";
+import { I as R } from "./icon-DKAhvlX_.js";
+import { T as g } from "./typography-MnY0LQoZ.js";
+import { c as j } from "./index-CRiPKpXj.js";
+import { useState as _ } from "react";
+function U({
+  isDragging: s,
+  isMultiple: t,
+  invalid: r,
+  accept: l,
+  acceptedExtensions: d,
+  maxSizeInMB: c,
+  maxFiles: f,
+  labels: o,
+  onDragOver: h,
+  onDragLeave: N,
+  onDrop: v,
+  onFileChange: u
 }) {
-  const [x, l] = I(!1), j = n.join(","), g = c * 1024 * 1024, v = (a) => {
-    a.preventDefault(), l(!0);
-  }, b = (a) => {
-    a.preventDefault(), l(!1);
+  return /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      onDragOver: h,
+      onDragLeave: N,
+      onDrop: v,
+      className: j(
+        `
+          adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
+          adm:border-2
+        `,
+        "adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",
+        {
+          "adm:border-primary": s && !r,
+          "adm:border-destructive": r,
+          "adm:border-input": !s && !r
+        }
+      ),
+      children: [
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: j(
+              "adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",
+              r ? "adm:bg-destructive/10" : "adm:bg-primary-50"
+            ),
+            children: /* @__PURE__ */ e.jsx(
+              R,
+              {
+                symbol: "text_snippet",
+                className: r ? "adm:text-destructive" : "adm:text-primary"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:flex-col adm:items-center adm:gap-2", children: [
+          /* @__PURE__ */ e.jsx(g, { color: r ? "destructive" : void 0, children: o?.dragDrop || (t ? "Drag and drop your files here or" : "Drag and drop your file here or") }),
+          /* @__PURE__ */ e.jsxs("label", { htmlFor: "file-upload", children: [
+            /* @__PURE__ */ e.jsx(
+              "input",
+              {
+                id: "file-upload",
+                type: "file",
+                accept: l,
+                multiple: t,
+                onChange: u,
+                className: "adm:hidden"
+              }
+            ),
+            /* @__PURE__ */ e.jsx(
+              z,
+              {
+                asChild: !0,
+                type: "button",
+                variant: "link",
+                className: "adm:cursor-pointer",
+                children: /* @__PURE__ */ e.jsx("span", { children: o?.selectFile || (t ? "Select files" : "Select the file") })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ e.jsx(g, { className: "adm:text-center", color: r ? "destructive" : "muted", children: o?.fileRequirements || `Allowed files: ${d.join(", ")}. Maximum size ${c} MB${t ? `. Up to ${f} files` : ""}.` })
+      ]
+    }
+  );
+}
+function q({ file: s, invalid: t, onRemove: r }) {
+  return /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: j(
+        "adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border adm:p-6",
+        t ? "adm:border-destructive adm:bg-destructive/5" : "adm:border-input adm:bg-muted"
+      ),
+      children: [
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: j(
+              "adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",
+              t ? "adm:bg-destructive/10" : "adm:bg-primary-50"
+            ),
+            children: /* @__PURE__ */ e.jsx(
+              R,
+              {
+                symbol: "text_snippet",
+                className: t ? "adm:text-destructive" : "adm:text-primary"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ e.jsxs(
+          "div",
+          {
+            className: `
+        adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
+      `,
+            children: [
+              /* @__PURE__ */ e.jsx("div", { className: "adm:min-w-0 adm:flex-1", children: /* @__PURE__ */ e.jsx(g, { className: "adm:truncate adm:font-semibold", children: s.name }) }),
+              /* @__PURE__ */ e.jsxs(g, { className: "adm:shrink-0", color: "muted", children: [
+                (s.size / 1024 / 1024).toFixed(1),
+                " MB"
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          z,
+          {
+            variant: "destructive-medium",
+            onClick: r,
+            type: "button",
+            children: /* @__PURE__ */ e.jsx(R, { symbol: "delete", className: "adm:text-destructive" })
+          }
+        )
+      ]
+    }
+  );
+}
+function $({ files: s, isMultiple: t, invalid: r, labels: l, onRemoveFile: d, onClearAll: c }) {
+  return s.length === 0 ? null : /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:flex-col adm:gap-3", children: [
+    t && s.length > 1 && /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:items-center adm:justify-between", children: [
+      /* @__PURE__ */ e.jsx(g, { className: "adm:text-sm adm:font-medium", color: r ? "destructive" : void 0, children: l?.filesSelected?.(s.length) || `${s.length} file${s.length !== 1 ? "s" : ""} selected` }),
+      /* @__PURE__ */ e.jsx(
+        z,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: c,
+          type: "button",
+          children: "Clear all"
+        }
+      )
+    ] }),
+    s.map((f, o) => /* @__PURE__ */ e.jsx(
+      q,
+      {
+        file: f,
+        invalid: r,
+        onRemove: () => d(o)
+      },
+      `${f.name}-${o}`
+    ))
+  ] });
+}
+function Q({
+  className: s,
+  selectedFile: t,
+  selectedFiles: r,
+  onFileSelect: l,
+  onFilesSelect: d,
+  onInvalidFile: c,
+  acceptedExtensions: f = [".xls", ".xlsx", ".numbers"],
+  maxSizeInMB: o = 50,
+  maxFiles: h = 10,
+  multiple: N = !1,
+  filesPosition: v = "below",
+  invalid: u = !1,
+  labels: b,
+  ...k
+}) {
+  const [B, D] = _(!1), L = f.join(","), T = o * 1024 * 1024, m = N || r !== void 0 || d !== void 0, x = m ? r || [] : t ? [t] : [], F = (a) => {
+    a.preventDefault(), D(!0);
+  }, I = (a) => {
+    a.preventDefault(), D(!1);
+  }, O = (a) => {
+    if (a.preventDefault(), D(!1), m) {
+      const i = Array.from(a.dataTransfer.files).filter(y);
+      if (i.length > 0) {
+        const w = [...r || [], ...i].slice(0, h);
+        d && d(w);
+      }
+    } else {
+      const n = a.dataTransfer.files[0];
+      n && y(n) && l && l(n);
+    }
+  }, V = (a) => {
+    if (m) {
+      const i = (a.target.files ? Array.from(a.target.files) : []).filter(y);
+      if (i.length > 0) {
+        const w = [...r || [], ...i].slice(0, h);
+        d && d(w);
+      }
+    } else {
+      const n = a.target.files?.[0];
+      n && y(n) && l && l(n);
+    }
+    a.target.value = "";
+  }, C = (a) => {
+    if (m) {
+      const n = x.filter((i, p) => p !== a);
+      d && d(n);
+    } else
+      l && l(null);
   }, y = (a) => {
-    a.preventDefault(), l(!1);
-    const d = a.dataTransfer.files[0];
-    d && p(d) && t(d);
-  }, N = (a) => {
-    const d = a.target.files?.[0];
-    d && p(d) && t(d);
-  }, D = () => {
-    t(null);
-  }, p = (a) => {
-    const d = a.name.substring(a.name.lastIndexOf("."));
-    return n.includes(d.toLowerCase()) && a.size <= g;
+    const n = a.name.substring(a.name.lastIndexOf(".")), i = f.includes(n.toLowerCase()), p = a.size <= T;
+    return !i && c ? c(a, "extension") : !p && c && c(a, "size"), i && p;
+  }, A = () => {
+    m ? d && d([]) : l && l(null);
   };
-  return /* @__PURE__ */ e.jsx("div", { className: s("adm:flex adm:flex-col", u), ...h, children: r ? (
-    // Selected File Display (when file is selected)
-    /* @__PURE__ */ e.jsxs(
-      "div",
+  return /* @__PURE__ */ e.jsxs("div", { className: j("adm:flex adm:flex-col adm:gap-4", s), ...k, children: [
+    m && v === "above" && /* @__PURE__ */ e.jsx(
+      $,
       {
-        className: s(`
-            adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border
-            adm:border-input adm:bg-muted adm:p-6
-          `),
-        children: [
-          /* @__PURE__ */ e.jsx(
-            "div",
-            {
-              className: s(`
-              adm:flex adm:items-center adm:justify-center adm:rounded-xl
-              adm:bg-primary-50 adm:p-2.5
-            `),
-              children: /* @__PURE__ */ e.jsx(o, { symbol: "text_snippet", className: "adm:text-primary" })
-            }
-          ),
-          /* @__PURE__ */ e.jsxs(
-            "div",
-            {
-              className: `
-              adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
-            `,
-              children: [
-                /* @__PURE__ */ e.jsx("div", { className: "adm:min-w-0 adm:flex-1", children: /* @__PURE__ */ e.jsx(m, { className: "adm:truncate adm:font-semibold", children: r.name }) }),
-                /* @__PURE__ */ e.jsxs(m, { className: "adm:shrink-0", color: "muted", children: [
-                  (r.size / 1024 / 1024).toFixed(1),
-                  " MB"
-                ] })
-              ]
-            }
-          ),
-          /* @__PURE__ */ e.jsx(
-            f,
-            {
-              variant: "destructive-medium",
-              onClick: D,
-              type: "button",
-              children: /* @__PURE__ */ e.jsx(o, { symbol: "delete", className: "adm:text-destructive" })
-            }
-          )
-        ]
+        files: x,
+        isMultiple: m,
+        invalid: u,
+        labels: b,
+        onRemoveFile: C,
+        onClearAll: A
       }
-    )
-  ) : (
-    // Drag & Drop Area (when no file is selected)
-    /* @__PURE__ */ e.jsxs(
-      "div",
+    ),
+    (m || x.length === 0) && /* @__PURE__ */ e.jsx(
+      U,
       {
-        onDragOver: v,
-        onDragLeave: b,
-        onDrop: y,
-        className: s(
-          `
-                adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
-                adm:border-2
-              `,
-          `
-                adm:border-dashed adm:bg-background adm:p-6
-                adm:transition-colors
-              `,
-          {
-            "adm:border-primary": x,
-            "adm:border-input": !x
-          }
-        ),
-        children: [
-          /* @__PURE__ */ e.jsx(
-            "div",
-            {
-              className: s(`
-              adm:flex adm:items-center adm:justify-center adm:rounded-xl
-              adm:bg-primary-50 adm:p-2.5
-            `),
-              children: /* @__PURE__ */ e.jsx(o, { symbol: "text_snippet", className: "adm:text-primary" })
-            }
-          ),
-          /* @__PURE__ */ e.jsxs("div", { className: "adm:flex adm:flex-col adm:items-center adm:gap-2", children: [
-            /* @__PURE__ */ e.jsx(m, { children: i?.dragDrop || "Drag and drop your file here or" }),
-            /* @__PURE__ */ e.jsxs("label", { htmlFor: "file-upload", children: [
-              /* @__PURE__ */ e.jsx(
-                "input",
-                {
-                  id: "file-upload",
-                  type: "file",
-                  accept: j,
-                  onChange: N,
-                  className: "adm:hidden"
-                }
-              ),
-              /* @__PURE__ */ e.jsx(
-                f,
-                {
-                  asChild: !0,
-                  type: "button",
-                  variant: "link",
-                  className: "adm:cursor-pointer",
-                  children: /* @__PURE__ */ e.jsx("span", { children: i?.selectFile || "Select the file" })
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ e.jsx(m, { className: "adm:text-center", color: "muted", children: i?.fileRequirements || `Allowed files: ${n.join(", ")}. Maximum size ${c} MB.` })
-        ]
+        isDragging: B,
+        isMultiple: m,
+        invalid: u,
+        accept: L,
+        acceptedExtensions: f,
+        maxSizeInMB: o,
+        maxFiles: h,
+        labels: b,
+        onDragOver: F,
+        onDragLeave: I,
+        onDrop: O,
+        onFileChange: V
+      }
+    ),
+    !m && x.length > 0 && /* @__PURE__ */ e.jsx(
+      $,
+      {
+        files: x,
+        isMultiple: m,
+        invalid: u,
+        labels: b,
+        onRemoveFile: C,
+        onClearAll: A
+      }
+    ),
+    m && v === "below" && /* @__PURE__ */ e.jsx(
+      $,
+      {
+        files: x,
+        isMultiple: m,
+        invalid: u,
+        labels: b,
+        onRemoveFile: C,
+        onClearAll: A
       }
     )
-  ) });
+  ] });
 }
 export {
-  L as FileUpload
+  Q as FileUpload
 };