@webdevarif/dashui 0.5.0 → 0.6.0

package/dist/index.d.mts

@@ -326,6 +326,63 @@ interface StorageBarProps {
 }
 declare function StorageBar({ used, limit, plan, collapsed, className, }: StorageBarProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * UploadZone — Drag & drop file input
+ *
+ * Presentation-only. Calls your callback with selected files.
+ * You handle: validation, upload, progress, error handling.
+ *
+ * Props:
+ * - onFiles: (files: File[]) => void — called when user selects/drops files
+ * - accept?: string — MIME types (e.g., "image/*")
+ * - multiple?: boolean
+ * - disabled?: boolean
+ */
+declare function UploadZone({ onFiles, accept, multiple, disabled, }: {
+    onFiles: (files: File[]) => void;
+    accept?: string;
+    multiple?: boolean;
+    disabled?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+/**
+ * UploadProgressPanel — Display upload progress for multiple files
+ *
+ * Presentation-only. Shows status, progress, and allows retry/cancel.
+ * You handle: actual upload logic.
+ *
+ * Props:
+ * - items: UploadItem[] — files being uploaded
+ * - onRetry?: (id: string) => void
+ * - onCancel?: (id: string) => void
+ * - onCancelAll?: () => void
+ */
+type UploadProgressItem = {
+    id: string;
+    name: string;
+    mimeType: string;
+    status: 'pending' | 'uploading' | 'done' | 'failed';
+    progress: number;
+    error?: string;
+};
+declare function UploadProgressPanel({ items, onRetry, onCancel, onCancelAll, }: {
+    items: UploadProgressItem[];
+    onRetry?: (id: string) => void;
+    onCancel?: (id: string) => void;
+    onCancelAll?: () => void;
+}): react_jsx_runtime.JSX.Element | null;
+
+interface ImagePickerFieldProps {
+    value?: string;
+    filename?: string;
+    onPickerOpen?: () => void;
+    onRemove?: () => void;
+    size?: "sm" | "md" | "lg";
+    emptyLabel?: string;
+    className?: string;
+}
+declare function ImagePickerField({ value, filename, onPickerOpen, onRemove, size, emptyLabel, className, }: ImagePickerFieldProps): react_jsx_runtime.JSX.Element;
+
 interface MediaCardFile {
     id: string;
     name: string;
@@ -343,64 +400,6 @@ interface MediaCardProps {
 }
 declare function MediaCard({ file, selected, onClick, className }: MediaCardProps): react_jsx_runtime.JSX.Element;
 
-interface MediaGridProps {
-    files: MediaCardFile[];
-    selected?: Set<string>;
-    onSelect?: (file: MediaCardFile) => void;
-    loading?: boolean;
-    columns?: 4 | 5 | 6;
-    emptyMessage?: string;
-    onUploadClick?: () => void;
-    className?: string;
-}
-declare function MediaGrid({ files, selected, onSelect, loading, columns, emptyMessage, onUploadClick, className, }: MediaGridProps): react_jsx_runtime.JSX.Element;
-
-interface MediaPickerDialogFolder {
-    id: string;
-    name: string;
-    icon?: string | null;
-}
-interface UploadItem {
-    name: string;
-    progress: number;
-    status: "uploading" | "done" | "failed";
-}
-interface MediaPickerDialogProps {
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    title?: string;
-    files: MediaCardFile[];
-    folders?: MediaPickerDialogFolder[];
-    loading?: boolean;
-    total: number;
-    typeFilter?: string;
-    onTypeChange?: (type: string) => void;
-    search?: string;
-    onSearch?: (q: string) => void;
-    activeFolderId?: string;
-    onFolderChange?: (id: string) => void;
-    onUpload?: (files: FileList) => void;
-    onLoadMore?: () => void;
-    hasMore?: boolean;
-    multiple?: boolean;
-    initialSelected?: string[];
-    /** "images" = only show image type tabs; "all" = show all type tabs */
-    accept?: "images" | "all";
-    onSelect: (files: MediaCardFile[]) => void;
-}
-declare function MediaPickerDialog({ open, onOpenChange, title, files, folders, loading, total, typeFilter, onTypeChange, search, onSearch, activeFolderId, onFolderChange, onUpload, onLoadMore, hasMore, multiple, initialSelected, accept, onSelect, }: MediaPickerDialogProps): react_jsx_runtime.JSX.Element;
-
-interface ImagePickerFieldProps {
-    value?: string;
-    filename?: string;
-    onPickerOpen?: () => void;
-    onRemove?: () => void;
-    size?: "sm" | "md" | "lg";
-    emptyLabel?: string;
-    className?: string;
-}
-declare function ImagePickerField({ value, filename, onPickerOpen, onRemove, size, emptyLabel, className, }: ImagePickerFieldProps): react_jsx_runtime.JSX.Element;
-
 interface FormFieldProps {
     label: string;
     error?: string;
@@ -730,4 +729,4 @@ interface SkeletonProps {
 }
 declare function Skeleton({ width, height, rounded, style }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
-export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, type ImagePickerFieldProps, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type MediaCardFile, type MediaCardProps, MediaGrid, type MediaGridProps, MediaPickerDialog, type MediaPickerDialogFolder, type MediaPickerDialogProps, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadItem, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };
+export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadProgressItem, UploadProgressPanel, UploadZone, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };

package/dist/index.d.ts

@@ -326,6 +326,63 @@ interface StorageBarProps {
 }
 declare function StorageBar({ used, limit, plan, collapsed, className, }: StorageBarProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * UploadZone — Drag & drop file input
+ *
+ * Presentation-only. Calls your callback with selected files.
+ * You handle: validation, upload, progress, error handling.
+ *
+ * Props:
+ * - onFiles: (files: File[]) => void — called when user selects/drops files
+ * - accept?: string — MIME types (e.g., "image/*")
+ * - multiple?: boolean
+ * - disabled?: boolean
+ */
+declare function UploadZone({ onFiles, accept, multiple, disabled, }: {
+    onFiles: (files: File[]) => void;
+    accept?: string;
+    multiple?: boolean;
+    disabled?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+/**
+ * UploadProgressPanel — Display upload progress for multiple files
+ *
+ * Presentation-only. Shows status, progress, and allows retry/cancel.
+ * You handle: actual upload logic.
+ *
+ * Props:
+ * - items: UploadItem[] — files being uploaded
+ * - onRetry?: (id: string) => void
+ * - onCancel?: (id: string) => void
+ * - onCancelAll?: () => void
+ */
+type UploadProgressItem = {
+    id: string;
+    name: string;
+    mimeType: string;
+    status: 'pending' | 'uploading' | 'done' | 'failed';
+    progress: number;
+    error?: string;
+};
+declare function UploadProgressPanel({ items, onRetry, onCancel, onCancelAll, }: {
+    items: UploadProgressItem[];
+    onRetry?: (id: string) => void;
+    onCancel?: (id: string) => void;
+    onCancelAll?: () => void;
+}): react_jsx_runtime.JSX.Element | null;
+
+interface ImagePickerFieldProps {
+    value?: string;
+    filename?: string;
+    onPickerOpen?: () => void;
+    onRemove?: () => void;
+    size?: "sm" | "md" | "lg";
+    emptyLabel?: string;
+    className?: string;
+}
+declare function ImagePickerField({ value, filename, onPickerOpen, onRemove, size, emptyLabel, className, }: ImagePickerFieldProps): react_jsx_runtime.JSX.Element;
+
 interface MediaCardFile {
     id: string;
     name: string;
@@ -343,64 +400,6 @@ interface MediaCardProps {
 }
 declare function MediaCard({ file, selected, onClick, className }: MediaCardProps): react_jsx_runtime.JSX.Element;
 
-interface MediaGridProps {
-    files: MediaCardFile[];
-    selected?: Set<string>;
-    onSelect?: (file: MediaCardFile) => void;
-    loading?: boolean;
-    columns?: 4 | 5 | 6;
-    emptyMessage?: string;
-    onUploadClick?: () => void;
-    className?: string;
-}
-declare function MediaGrid({ files, selected, onSelect, loading, columns, emptyMessage, onUploadClick, className, }: MediaGridProps): react_jsx_runtime.JSX.Element;
-
-interface MediaPickerDialogFolder {
-    id: string;
-    name: string;
-    icon?: string | null;
-}
-interface UploadItem {
-    name: string;
-    progress: number;
-    status: "uploading" | "done" | "failed";
-}
-interface MediaPickerDialogProps {
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    title?: string;
-    files: MediaCardFile[];
-    folders?: MediaPickerDialogFolder[];
-    loading?: boolean;
-    total: number;
-    typeFilter?: string;
-    onTypeChange?: (type: string) => void;
-    search?: string;
-    onSearch?: (q: string) => void;
-    activeFolderId?: string;
-    onFolderChange?: (id: string) => void;
-    onUpload?: (files: FileList) => void;
-    onLoadMore?: () => void;
-    hasMore?: boolean;
-    multiple?: boolean;
-    initialSelected?: string[];
-    /** "images" = only show image type tabs; "all" = show all type tabs */
-    accept?: "images" | "all";
-    onSelect: (files: MediaCardFile[]) => void;
-}
-declare function MediaPickerDialog({ open, onOpenChange, title, files, folders, loading, total, typeFilter, onTypeChange, search, onSearch, activeFolderId, onFolderChange, onUpload, onLoadMore, hasMore, multiple, initialSelected, accept, onSelect, }: MediaPickerDialogProps): react_jsx_runtime.JSX.Element;
-
-interface ImagePickerFieldProps {
-    value?: string;
-    filename?: string;
-    onPickerOpen?: () => void;
-    onRemove?: () => void;
-    size?: "sm" | "md" | "lg";
-    emptyLabel?: string;
-    className?: string;
-}
-declare function ImagePickerField({ value, filename, onPickerOpen, onRemove, size, emptyLabel, className, }: ImagePickerFieldProps): react_jsx_runtime.JSX.Element;
-
 interface FormFieldProps {
     label: string;
     error?: string;
@@ -730,4 +729,4 @@ interface SkeletonProps {
 }
 declare function Skeleton({ width, height, rounded, style }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
-export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, type ImagePickerFieldProps, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type MediaCardFile, type MediaCardProps, MediaGrid, type MediaGridProps, MediaPickerDialog, type MediaPickerDialogFolder, type MediaPickerDialogProps, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadItem, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };
+export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadProgressItem, UploadProgressPanel, UploadZone, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };