nextuiq/dist/index24.js

NextUIQ is a modern, lightweight, and developer-friendly UI component library for React and Next.js. Built with TypeScript and Tailwind CSS, it offers customizable, accessible, and performance-optimized components with built-in dark mode, theme customizat

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index46.js"),r=require("./index9.js"),o=require("react-dropzone"),t=require("./index47.js"),s=({onFileUpload:s})=>{const{getRootProps:i,getInputProps:a,isDragActive:l}=o.useDropzone({onDrop(e){s?.(e)},accept:{"image/png":[],"image/jpeg":[],"image/webp":[],"image/svg+xml":[]}});return e.jsxRuntimeExports.jsxs(r.Card,{className:"p-6",children:[e.jsxRuntimeExports.jsx("h2",{className:"mb-6 text-lg font-semibold text-[oklch(var(--theme-foreground))]",children:"Dropzone"}),e.jsxRuntimeExports.jsx("div",{className:"transition border border-[oklch(var(--theme-border))] border-dashed cursor-pointer hover:border-[oklch(var(--theme-primary))] rounded-xl",children:e.jsxRuntimeExports.jsxs("form",{...i(),className:"dropzone rounded-xl border-dashed p-7 lg:p-10 "+(l?"border-[oklch(var(--theme-primary))] bg-[oklch(var(--theme-muted))]":"border-[oklch(var(--theme-border))] bg-[oklch(var(--theme-muted))]"),id:"demo-upload","aria-label":"File upload area",children:[e.jsxRuntimeExports.jsx("input",{...a(),"aria-label":"File input"}),e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col items-center m-0",children:[e.jsxRuntimeExports.jsx("div",{className:"mb-[22px] flex justify-center",children:e.jsxRuntimeExports.jsx("div",{className:"flex h-[68px] w-[68px] items-center justify-center rounded-full \r\n                bg-[oklch(var(--theme-muted))] text-[oklch(var(--theme-muted-foreground))]",children:e.jsxRuntimeExports.jsx(t.FiUploadCloud,{size:29})})}),e.jsxRuntimeExports.jsx("h4",{className:"mb-3 font-semibold text-[oklch(var(--theme-foreground))]",children:l?"Drop Files Here":"Drag & Drop Files Here"}),e.jsxRuntimeExports.jsx("span",{className:"text-center mb-5 block w-full max-w-[290px] text-sm text-[oklch(var(--theme-muted-foreground))]",children:"Drag and drop your PNG, JPG, WebP, SVG images here or browse"}),e.jsxRuntimeExports.jsx("span",{className:"font-medium underline text-theme-sm text-[oklch(var(--theme-primary))]",children:"Browse File"})]})]})})]})};s.displayName="Dropzone",exports.Dropzone=s;