@spark-ui/components 13.1.4 → 13.2.0

package/dist/file-upload/index.d.mts

@@ -1,270 +1,22 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Ref, ReactNode, ComponentPropsWithoutRef } from 'react';
-import { IconButton } from '../icon-button/index.mjs';
-import { ButtonProps } from '../button/index.mjs';
-import 'class-variance-authority/types';
-import 'class-variance-authority';
-
-/**
- * File upload error codes
- */
-declare const FILE_UPLOAD_ERRORS: {
-    /**
-     * Exceeds the maxFiles limit
-     */
-    readonly TOO_MANY_FILES: "TOO_MANY_FILES";
-    /**
-     * File type not in the accept list
-     */
-    readonly FILE_INVALID_TYPE: "FILE_INVALID_TYPE";
-    /**
-     * File size exceeds maxFileSize
-     */
-    readonly FILE_TOO_LARGE: "FILE_TOO_LARGE";
-    /**
-     * File size below minFileSize
-     */
-    readonly FILE_TOO_SMALL: "FILE_TOO_SMALL";
-    /**
-     * Generic validation failure
-     */
-    readonly FILE_INVALID: "FILE_INVALID";
-    /**
-     * Duplicate file detected
-     */
-    readonly FILE_EXISTS: "FILE_EXISTS";
-};
-
-type FileUploadFileError = typeof FILE_UPLOAD_ERRORS.TOO_MANY_FILES | typeof FILE_UPLOAD_ERRORS.FILE_INVALID_TYPE | typeof FILE_UPLOAD_ERRORS.FILE_TOO_LARGE | typeof FILE_UPLOAD_ERRORS.FILE_TOO_SMALL | typeof FILE_UPLOAD_ERRORS.FILE_INVALID | typeof FILE_UPLOAD_ERRORS.FILE_EXISTS;
-interface RejectedFile$1 {
-    file: File;
-    errors: FileUploadFileError[];
-}
-interface FileAcceptDetails {
-    files: File[];
-}
-interface FileRejectDetails {
-    files: RejectedFile$1[];
-}
-interface FileChangeDetails {
-    acceptedFiles: File[];
-    rejectedFiles: RejectedFile$1[];
-}
-
-interface FileUploadProps {
-    /**
-     * Change the default rendered element for the one passed as a child, merging their props and behavior.
-     */
-    asChild?: boolean;
-    ref?: Ref<HTMLDivElement>;
-    children: ReactNode;
-    className?: string;
-    /**
-     * Initial files to display when the component mounts (uncontrolled mode)
-     */
-    defaultValue?: File[];
-    /**
-     * Controlled files value (controlled mode)
-     * When provided, the component becomes controlled
-     */
-    value?: File[];
-    /**
-     * Callback when files are accepted
-     * @param details - Details about the accepted files
-     */
-    onFileAccept?: (details: FileAcceptDetails) => void;
-    /**
-     * Callback when files are rejected
-     * @param details - Details about the rejected files and their errors
-     */
-    onFileReject?: (details: FileRejectDetails) => void;
-    /**
-     * Callback when files change (both accepted and rejected)
-     * For controlled mode, use this to update the value prop by extracting details.acceptedFiles
-     * @param details - Details about both accepted and rejected files
-     */
-    onFileChange?: (details: FileChangeDetails) => void;
-    /**
-     * Whether multiple files can be selected
-     * @default true
-     */
-    multiple?: boolean;
-    /**
-     * Comma-separated list of accepted file types
-     * Supports MIME types (e.g., "image/*", "image/png", "application/pdf")
-     * and file extensions (e.g., ".pdf", ".doc", ".jpg")
-     * @example "image/*"
-     * @example ".pdf,.doc"
-     * @example "image/png,image/jpeg,.pdf"
-     */
-    accept?: string;
-    /**
-     * Maximum number of files that can be uploaded
-     * Files beyond this limit will be rejected
-     */
-    maxFiles?: number;
-    /**
-     * Maximum file size in bytes
-     * Files larger than this will be rejected
-     */
-    maxFileSize?: number;
-    /**
-     * Minimum file size in bytes
-     * Files smaller than this will be rejected
-     */
-    minFileSize?: number;
-    /**
-     * When `true`, prevents the user from interacting with the file upload
-     */
-    disabled?: boolean;
-    /**
-     * When `true`, sets the file upload to read-only mode
-     */
-    readOnly?: boolean;
-    /**
-     * The [BCP47](https://www.ietf.org/rfc/bcp/bcp47.txt) language code for the locale.
-     * Used for formatting file sizes and error messages.
-     * @default Browser locale or 'en' if not available
-     */
-    locale?: string;
-}
-declare const FileUpload$1: {
-    ({ asChild: _asChild, children, defaultValue, value: controlledValue, onFileAccept, onFileReject, onFileChange, multiple, accept, maxFiles, maxFileSize, minFileSize, disabled: disabledProp, readOnly: readOnlyProp, locale, }: FileUploadProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadAcceptedFileProps extends ComponentPropsWithoutRef<'li'> {
-    ref?: Ref<HTMLLIElement>;
-    /**
-     * The file to display
-     */
-    file: File;
-    /**
-     * Upload progress value (0-100). When provided, displays a progress bar at the bottom of the file item.
-     */
-    uploadProgress?: number;
-    /**
-     * Accessible label for the delete button
-     */
-    deleteButtonAriaLabel: string;
-    /**
-     * Accessible label for the progress bar. Required when uploadProgress is provided.
-     */
-    progressAriaLabel?: string;
-    className?: string;
-}
-declare const AcceptedFile: {
-    ({ className, file, uploadProgress, deleteButtonAriaLabel, progressAriaLabel, ...props }: FileUploadAcceptedFileProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadContextProps {
-    /**
-     * Render prop that receives acceptedFiles, rejectedFiles, formatFileSize, and locale
-     */
-    children: (props: {
-        acceptedFiles: File[];
-        rejectedFiles: RejectedFile$1[];
-        formatFileSize: (bytes: number, locale?: string) => string;
-        locale?: string;
-    }) => ReactNode;
-}
-declare const Context: {
-    ({ children }: FileUploadContextProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-declare function Dropzone({ children, className, unstyled, }: {
-    children?: React.ReactNode;
-    className?: string;
-    unstyled?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare namespace Dropzone {
-    var displayName: string;
-}
-
-interface FileUploadItemDeleteTriggerProps extends React.ComponentProps<typeof IconButton> {
-    /**
-     * The file to delete
-     */
-    file: File;
-}
-declare const ItemDeleteTrigger: {
-    ({ className, file, onClick, ...props }: FileUploadItemDeleteTriggerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadPreviewImageProps extends ComponentPropsWithoutRef<'div'> {
-    ref?: Ref<HTMLDivElement>;
-    className?: string;
-    /**
-     * The file to preview
-     */
-    file: File;
-    /**
-     * Fallback content when file is not an image or preview fails
-     */
-    fallback?: React.ReactNode;
-}
-declare const PreviewImage: {
-    ({ className, file, fallback, ...props }: FileUploadPreviewImageProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadRejectedFileProps extends ComponentPropsWithoutRef<'li'> {
-    ref?: Ref<HTMLLIElement>;
-    /**
-     * The rejected file to display
-     */
-    rejectedFile: RejectedFile$1;
-    /**
-     * Function to render the error message for each error code
-     * @param error - The error code
-     * @returns The error message to display
-     */
-    renderError: (error: FileUploadFileError) => string;
-    /**
-     * Accessible label for the delete button
-     */
-    deleteButtonAriaLabel: string;
-    className?: string;
-}
-declare const RejectedFile: {
-    ({ className, rejectedFile, renderError, deleteButtonAriaLabel, ...props }: FileUploadRejectedFileProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadRejectedFileDeleteTriggerProps extends React.ComponentProps<typeof IconButton> {
-    /**
-     * The rejected file to remove
-     */
-    rejectedFile: RejectedFile$1;
-}
-declare const RejectedFileDeleteTrigger: {
-    ({ className, rejectedFile, onClick, ...props }: FileUploadRejectedFileDeleteTriggerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadTriggerProps extends Omit<ButtonProps, 'children' | 'disabled'> {
-    ref?: Ref<HTMLButtonElement>;
-    className?: string;
-    children: ReactNode;
-    unstyled?: boolean;
-}
-declare const Trigger: {
-    ({ className, children, asChild, unstyled, design, intent, size, shape, ref, ...props }: FileUploadTriggerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-declare const FileUpload: typeof FileUpload$1 & {
+import { FileAcceptDetails, FileChangeDetails, FileRejectDetails, FileUpload as Root, FileUploadFileError, RejectedFile } from './FileUpload';
+import { AcceptedFile } from './FileUploadAcceptedFile';
+import { Context } from './FileUploadContext';
+import { FILE_UPLOAD_ERRORS } from './constants';
+import { Dropzone } from './FileUploadDropzone';
+import { ItemDeleteTrigger } from './FileUploadItemDeleteTrigger';
+import { PreviewImage } from './FileUploadPreviewImage';
+import { RejectedFile as RejectedFileComponent } from './FileUploadRejectedFile';
+import { RejectedFileDeleteTrigger } from './FileUploadRejectedFileDeleteTrigger';
+import { Trigger } from './FileUploadTrigger';
+export type { FileAcceptDetails, FileChangeDetails, FileRejectDetails, RejectedFile, FileUploadFileError, };
+export { FILE_UPLOAD_ERRORS };
+export declare const FileUpload: typeof Root & {
     Trigger: typeof Trigger;
     Dropzone: typeof Dropzone;
     Context: typeof Context;
     ItemDeleteTrigger: typeof ItemDeleteTrigger;
     PreviewImage: typeof PreviewImage;
     AcceptedFile: typeof AcceptedFile;
-    RejectedFile: typeof RejectedFile;
+    RejectedFile: typeof RejectedFileComponent;
     RejectedFileDeleteTrigger: typeof RejectedFileDeleteTrigger;
 };
-
-export { FILE_UPLOAD_ERRORS, type FileAcceptDetails, type FileChangeDetails, type FileRejectDetails, FileUpload, type FileUploadFileError, type RejectedFile$1 as RejectedFile };

package/dist/file-upload/index.d.ts

@@ -1,270 +1,22 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Ref, ReactNode, ComponentPropsWithoutRef } from 'react';
-import { IconButton } from '../icon-button/index.js';
-import { ButtonProps } from '../button/index.js';
-import 'class-variance-authority/types';
-import 'class-variance-authority';
-
-/**
- * File upload error codes
- */
-declare const FILE_UPLOAD_ERRORS: {
-    /**
-     * Exceeds the maxFiles limit
-     */
-    readonly TOO_MANY_FILES: "TOO_MANY_FILES";
-    /**
-     * File type not in the accept list
-     */
-    readonly FILE_INVALID_TYPE: "FILE_INVALID_TYPE";
-    /**
-     * File size exceeds maxFileSize
-     */
-    readonly FILE_TOO_LARGE: "FILE_TOO_LARGE";
-    /**
-     * File size below minFileSize
-     */
-    readonly FILE_TOO_SMALL: "FILE_TOO_SMALL";
-    /**
-     * Generic validation failure
-     */
-    readonly FILE_INVALID: "FILE_INVALID";
-    /**
-     * Duplicate file detected
-     */
-    readonly FILE_EXISTS: "FILE_EXISTS";
-};
-
-type FileUploadFileError = typeof FILE_UPLOAD_ERRORS.TOO_MANY_FILES | typeof FILE_UPLOAD_ERRORS.FILE_INVALID_TYPE | typeof FILE_UPLOAD_ERRORS.FILE_TOO_LARGE | typeof FILE_UPLOAD_ERRORS.FILE_TOO_SMALL | typeof FILE_UPLOAD_ERRORS.FILE_INVALID | typeof FILE_UPLOAD_ERRORS.FILE_EXISTS;
-interface RejectedFile$1 {
-    file: File;
-    errors: FileUploadFileError[];
-}
-interface FileAcceptDetails {
-    files: File[];
-}
-interface FileRejectDetails {
-    files: RejectedFile$1[];
-}
-interface FileChangeDetails {
-    acceptedFiles: File[];
-    rejectedFiles: RejectedFile$1[];
-}
-
-interface FileUploadProps {
-    /**
-     * Change the default rendered element for the one passed as a child, merging their props and behavior.
-     */
-    asChild?: boolean;
-    ref?: Ref<HTMLDivElement>;
-    children: ReactNode;
-    className?: string;
-    /**
-     * Initial files to display when the component mounts (uncontrolled mode)
-     */
-    defaultValue?: File[];
-    /**
-     * Controlled files value (controlled mode)
-     * When provided, the component becomes controlled
-     */
-    value?: File[];
-    /**
-     * Callback when files are accepted
-     * @param details - Details about the accepted files
-     */
-    onFileAccept?: (details: FileAcceptDetails) => void;
-    /**
-     * Callback when files are rejected
-     * @param details - Details about the rejected files and their errors
-     */
-    onFileReject?: (details: FileRejectDetails) => void;
-    /**
-     * Callback when files change (both accepted and rejected)
-     * For controlled mode, use this to update the value prop by extracting details.acceptedFiles
-     * @param details - Details about both accepted and rejected files
-     */
-    onFileChange?: (details: FileChangeDetails) => void;
-    /**
-     * Whether multiple files can be selected
-     * @default true
-     */
-    multiple?: boolean;
-    /**
-     * Comma-separated list of accepted file types
-     * Supports MIME types (e.g., "image/*", "image/png", "application/pdf")
-     * and file extensions (e.g., ".pdf", ".doc", ".jpg")
-     * @example "image/*"
-     * @example ".pdf,.doc"
-     * @example "image/png,image/jpeg,.pdf"
-     */
-    accept?: string;
-    /**
-     * Maximum number of files that can be uploaded
-     * Files beyond this limit will be rejected
-     */
-    maxFiles?: number;
-    /**
-     * Maximum file size in bytes
-     * Files larger than this will be rejected
-     */
-    maxFileSize?: number;
-    /**
-     * Minimum file size in bytes
-     * Files smaller than this will be rejected
-     */
-    minFileSize?: number;
-    /**
-     * When `true`, prevents the user from interacting with the file upload
-     */
-    disabled?: boolean;
-    /**
-     * When `true`, sets the file upload to read-only mode
-     */
-    readOnly?: boolean;
-    /**
-     * The [BCP47](https://www.ietf.org/rfc/bcp/bcp47.txt) language code for the locale.
-     * Used for formatting file sizes and error messages.
-     * @default Browser locale or 'en' if not available
-     */
-    locale?: string;
-}
-declare const FileUpload$1: {
-    ({ asChild: _asChild, children, defaultValue, value: controlledValue, onFileAccept, onFileReject, onFileChange, multiple, accept, maxFiles, maxFileSize, minFileSize, disabled: disabledProp, readOnly: readOnlyProp, locale, }: FileUploadProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadAcceptedFileProps extends ComponentPropsWithoutRef<'li'> {
-    ref?: Ref<HTMLLIElement>;
-    /**
-     * The file to display
-     */
-    file: File;
-    /**
-     * Upload progress value (0-100). When provided, displays a progress bar at the bottom of the file item.
-     */
-    uploadProgress?: number;
-    /**
-     * Accessible label for the delete button
-     */
-    deleteButtonAriaLabel: string;
-    /**
-     * Accessible label for the progress bar. Required when uploadProgress is provided.
-     */
-    progressAriaLabel?: string;
-    className?: string;
-}
-declare const AcceptedFile: {
-    ({ className, file, uploadProgress, deleteButtonAriaLabel, progressAriaLabel, ...props }: FileUploadAcceptedFileProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadContextProps {
-    /**
-     * Render prop that receives acceptedFiles, rejectedFiles, formatFileSize, and locale
-     */
-    children: (props: {
-        acceptedFiles: File[];
-        rejectedFiles: RejectedFile$1[];
-        formatFileSize: (bytes: number, locale?: string) => string;
-        locale?: string;
-    }) => ReactNode;
-}
-declare const Context: {
-    ({ children }: FileUploadContextProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-declare function Dropzone({ children, className, unstyled, }: {
-    children?: React.ReactNode;
-    className?: string;
-    unstyled?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare namespace Dropzone {
-    var displayName: string;
-}
-
-interface FileUploadItemDeleteTriggerProps extends React.ComponentProps<typeof IconButton> {
-    /**
-     * The file to delete
-     */
-    file: File;
-}
-declare const ItemDeleteTrigger: {
-    ({ className, file, onClick, ...props }: FileUploadItemDeleteTriggerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadPreviewImageProps extends ComponentPropsWithoutRef<'div'> {
-    ref?: Ref<HTMLDivElement>;
-    className?: string;
-    /**
-     * The file to preview
-     */
-    file: File;
-    /**
-     * Fallback content when file is not an image or preview fails
-     */
-    fallback?: React.ReactNode;
-}
-declare const PreviewImage: {
-    ({ className, file, fallback, ...props }: FileUploadPreviewImageProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadRejectedFileProps extends ComponentPropsWithoutRef<'li'> {
-    ref?: Ref<HTMLLIElement>;
-    /**
-     * The rejected file to display
-     */
-    rejectedFile: RejectedFile$1;
-    /**
-     * Function to render the error message for each error code
-     * @param error - The error code
-     * @returns The error message to display
-     */
-    renderError: (error: FileUploadFileError) => string;
-    /**
-     * Accessible label for the delete button
-     */
-    deleteButtonAriaLabel: string;
-    className?: string;
-}
-declare const RejectedFile: {
-    ({ className, rejectedFile, renderError, deleteButtonAriaLabel, ...props }: FileUploadRejectedFileProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadRejectedFileDeleteTriggerProps extends React.ComponentProps<typeof IconButton> {
-    /**
-     * The rejected file to remove
-     */
-    rejectedFile: RejectedFile$1;
-}
-declare const RejectedFileDeleteTrigger: {
-    ({ className, rejectedFile, onClick, ...props }: FileUploadRejectedFileDeleteTriggerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-interface FileUploadTriggerProps extends Omit<ButtonProps, 'children' | 'disabled'> {
-    ref?: Ref<HTMLButtonElement>;
-    className?: string;
-    children: ReactNode;
-    unstyled?: boolean;
-}
-declare const Trigger: {
-    ({ className, children, asChild, unstyled, design, intent, size, shape, ref, ...props }: FileUploadTriggerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-
-declare const FileUpload: typeof FileUpload$1 & {
+import { FileAcceptDetails, FileChangeDetails, FileRejectDetails, FileUpload as Root, FileUploadFileError, RejectedFile } from './FileUpload';
+import { AcceptedFile } from './FileUploadAcceptedFile';
+import { Context } from './FileUploadContext';
+import { FILE_UPLOAD_ERRORS } from './constants';
+import { Dropzone } from './FileUploadDropzone';
+import { ItemDeleteTrigger } from './FileUploadItemDeleteTrigger';
+import { PreviewImage } from './FileUploadPreviewImage';
+import { RejectedFile as RejectedFileComponent } from './FileUploadRejectedFile';
+import { RejectedFileDeleteTrigger } from './FileUploadRejectedFileDeleteTrigger';
+import { Trigger } from './FileUploadTrigger';
+export type { FileAcceptDetails, FileChangeDetails, FileRejectDetails, RejectedFile, FileUploadFileError, };
+export { FILE_UPLOAD_ERRORS };
+export declare const FileUpload: typeof Root & {
     Trigger: typeof Trigger;
     Dropzone: typeof Dropzone;
     Context: typeof Context;
     ItemDeleteTrigger: typeof ItemDeleteTrigger;
     PreviewImage: typeof PreviewImage;
     AcceptedFile: typeof AcceptedFile;
-    RejectedFile: typeof RejectedFile;
+    RejectedFile: typeof RejectedFileComponent;
     RejectedFileDeleteTrigger: typeof RejectedFileDeleteTrigger;
 };
-
-export { FILE_UPLOAD_ERRORS, type FileAcceptDetails, type FileChangeDetails, type FileRejectDetails, FileUpload, type FileUploadFileError, type RejectedFile$1 as RejectedFile };