@jordan-mace/chaser-design-system 1.2.8 → 2.0.0

package/dist/components/Divider/Divider.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { Sprinkles } from '../../styles/sprinkles.css';
-export type DividerOrientation = 'horizontal' | 'vertical';
-export type DividerSize = 'small' | 'medium' | 'large';
-export type DividerProps = React.HTMLAttributes<HTMLHRElement> & Sprinkles & {
-    orientation?: DividerOrientation;
-    size?: DividerSize;
-};
-declare const Divider: ({ orientation, size, ...props }: DividerProps) => import("react/jsx-runtime").JSX.Element;
-export default Divider;

package/dist/components/Divider/Divider.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import clsx from 'clsx';
-import { divider, dividerOrientations, dividerSizes, dividerVerticalSizes, } from './styles.css';
-import Box from '../Box';
-const Divider = ({ orientation = 'horizontal', size = 'medium', ...props }) => {
-    return (_jsx(Box, { as: "hr", className: clsx(divider, dividerOrientations[orientation], orientation === 'vertical'
-            ? dividerVerticalSizes[size]
-            : dividerSizes[size], props.className), role: "separator", "aria-orientation": orientation, ...props }));
-};
-export default Divider;

package/dist/components/Divider/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Divider } from './Divider';
-export type { DividerProps, DividerOrientation, DividerSize } from './Divider';

package/dist/components/Divider/index.js

@@ -1 +0,0 @@
-export { default as Divider } from './Divider';

package/dist/components/Divider/styles.css.d.ts

@@ -1,4 +0,0 @@
-export declare const dividerOrientations: Record<"horizontal" | "vertical", string>;
-export declare const dividerSizes: Record<"medium" | "large" | "small", string>;
-export declare const divider: string;
-export declare const dividerVerticalSizes: Record<"medium" | "large" | "small", string>;

package/dist/components/Divider/styles.css.js

@@ -1,41 +0,0 @@
-import { styleVariants } from '@vanilla-extract/css';
-import { vars } from '../../styles/theme.css';
-import { styleWithLayer } from '../../styles/utils';
-export const dividerOrientations = styleVariants({
-    horizontal: {
-        width: '100%',
-        height: '1px',
-        borderTop: `1px solid ${vars.colors.borderMuted}`,
-    },
-    vertical: {
-        width: '1px',
-        height: '100%',
-        borderLeft: `1px solid ${vars.colors.borderMuted}`,
-    },
-});
-export const dividerSizes = styleVariants({
-    small: {
-        margin: '0.5rem 0',
-    },
-    medium: {
-        margin: '1rem 0',
-    },
-    large: {
-        margin: '1.5rem 0',
-    },
-});
-export const divider = styleWithLayer({
-    border: 'none',
-    flexShrink: 0,
-});
-export const dividerVerticalSizes = styleVariants({
-    small: {
-        margin: '0 0.5rem',
-    },
-    medium: {
-        margin: '0 1rem',
-    },
-    large: {
-        margin: '0 1.5rem',
-    },
-});

package/dist/components/Drawer/Drawer.d.ts

@@ -1,18 +0,0 @@
-import React from 'react';
-import { Sprinkles } from '../../styles/sprinkles.css';
-export type DrawerPosition = 'left' | 'right' | 'top' | 'bottom';
-export type DrawerSize = 'small' | 'medium' | 'large' | 'full';
-type DrawerPropsBase = React.HTMLAttributes<HTMLDivElement> & {
-    isOpen: boolean;
-    onClose: () => void;
-    title?: string;
-    position?: DrawerPosition;
-    size?: DrawerSize;
-    children?: React.ReactNode;
-    footer?: React.ReactNode;
-    showCloseButton?: boolean;
-    closeOnOverlayClick?: boolean;
-};
-export type DrawerProps = DrawerPropsBase & Sprinkles;
-declare const Drawer: ({ isOpen, onClose, title, position, size, children, footer, showCloseButton, closeOnOverlayClick, className, ...props }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
-export default Drawer;

package/dist/components/Drawer/Drawer.js

@@ -1,65 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import clsx from 'clsx';
-import { useEffect } from 'react';
-import { drawer, drawerPositionVariants, drawerOverlay, drawerHeader, drawerTitle, drawerCloseButton, drawerBody, drawerFooter, } from './styles.css';
-import Box from '../Box';
-const sizeMap = {
-    left: {
-        small: '250px',
-        medium: '350px',
-        large: '450px',
-        full: '100vw',
-    },
-    right: {
-        small: '250px',
-        medium: '350px',
-        large: '450px',
-        full: '100vw',
-    },
-    top: {
-        small: '200px',
-        medium: '300px',
-        large: '400px',
-        full: '100vh',
-    },
-    bottom: {
-        small: '200px',
-        medium: '300px',
-        large: '400px',
-        full: '100vh',
-    },
-};
-const Drawer = ({ isOpen, onClose, title, position = 'right', size = 'medium', children, footer, showCloseButton = true, closeOnOverlayClick = true, className, ...props }) => {
-    useEffect(() => {
-        if (isOpen) {
-            document.body.style.overflow = 'hidden';
-        }
-        else {
-            document.body.style.overflow = '';
-        }
-        return () => {
-            document.body.style.overflow = '';
-        };
-    }, [isOpen]);
-    useEffect(() => {
-        const handleEscape = (e) => {
-            if (e.key === 'Escape' && isOpen) {
-                onClose();
-            }
-        };
-        document.addEventListener('keydown', handleEscape);
-        return () => document.removeEventListener('keydown', handleEscape);
-    }, [isOpen, onClose]);
-    if (!isOpen)
-        return null;
-    const dimensionStyle = {
-        ['--drawer-width']: ['left', 'right'].includes(position)
-            ? sizeMap[position][size]
-            : undefined,
-        ['--drawer-height']: ['top', 'bottom'].includes(position)
-            ? sizeMap[position][size]
-            : undefined,
-    };
-    return (_jsxs(_Fragment, { children: [_jsx(Box, { className: drawerOverlay, onClick: closeOnOverlayClick ? onClose : undefined, "aria-hidden": "true" }), _jsxs(Box, { as: "div", role: "dialog", "aria-modal": "true", className: clsx(drawer, drawerPositionVariants[position], className), style: dimensionStyle, ...props, children: [title && (_jsxs(Box, { as: "div", className: drawerHeader, children: [_jsx(Box, { as: "h2", className: drawerTitle, children: title }), showCloseButton && (_jsx(Box, { as: "button", className: drawerCloseButton, onClick: onClose, "aria-label": "Close drawer", type: "button", children: "\u00D7" }))] })), _jsx(Box, { as: "div", className: drawerBody, children: children }), footer && (_jsx(Box, { as: "div", className: drawerFooter, children: footer }))] })] }));
-};
-export default Drawer;

package/dist/components/Drawer/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Drawer } from './Drawer';
-export type { DrawerProps, DrawerPosition, DrawerSize } from './Drawer';

package/dist/components/Drawer/index.js

@@ -1 +0,0 @@
-export { default as Drawer } from './Drawer';

package/dist/components/Drawer/styles.css.d.ts

@@ -1,8 +0,0 @@
-export declare const drawerPositionVariants: Record<"bottom" | "left" | "right" | "top", string>;
-export declare const drawerOverlay: string;
-export declare const drawer: string;
-export declare const drawerHeader: string;
-export declare const drawerTitle: string;
-export declare const drawerCloseButton: string;
-export declare const drawerBody: string;
-export declare const drawerFooter: string;

package/dist/components/Drawer/styles.css.js

@@ -1,125 +0,0 @@
-import { styleVariants, keyframes } from '@vanilla-extract/css';
-import { vars } from '../../styles/theme.css';
-import { styleWithLayer } from '../../styles/utils';
-const slideInFromLeft = keyframes({
-    from: { transform: 'translateX(-100%)' },
-    to: { transform: 'translateX(0)' },
-});
-const slideInFromRight = keyframes({
-    from: { transform: 'translateX(100%)' },
-    to: { transform: 'translateX(0)' },
-});
-const slideInFromTop = keyframes({
-    from: { transform: 'translateY(-100%)' },
-    to: { transform: 'translateY(0)' },
-});
-const slideInFromBottom = keyframes({
-    from: { transform: 'translateY(100%)' },
-    to: { transform: 'translateY(0)' },
-});
-const fadeIn = keyframes({
-    from: { opacity: 0 },
-    to: { opacity: 1 },
-});
-export const drawerPositionVariants = styleVariants({
-    left: {
-        top: 0,
-        left: 0,
-        bottom: 0,
-        width: 'var(--drawer-width, 300px)',
-        maxWidth: '100vw',
-        animation: `${slideInFromLeft} 0.3s ease-out`,
-    },
-    right: {
-        top: 0,
-        right: 0,
-        bottom: 0,
-        width: 'var(--drawer-width, 300px)',
-        maxWidth: '100vw',
-        animation: `${slideInFromRight} 0.3s ease-out`,
-    },
-    top: {
-        top: 0,
-        left: 0,
-        right: 0,
-        height: 'var(--drawer-height, 300px)',
-        maxHeight: '100vh',
-        animation: `${slideInFromTop} 0.3s ease-out`,
-    },
-    bottom: {
-        bottom: 0,
-        left: 0,
-        right: 0,
-        height: 'var(--drawer-height, 300px)',
-        maxHeight: '100vh',
-        animation: `${slideInFromBottom} 0.3s ease-out`,
-    },
-});
-export const drawerOverlay = styleWithLayer({
-    position: 'fixed',
-    inset: 0,
-    backgroundColor: 'rgba(0, 0, 0, 0.5)',
-    animation: `${fadeIn} 0.2s ease-out`,
-    zIndex: 40,
-});
-export const drawer = styleWithLayer({
-    position: 'fixed',
-    background: vars.colors.backgroundDefault,
-    boxShadow: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
-    zIndex: 50,
-    display: 'flex',
-    flexDirection: 'column',
-    overflow: 'hidden',
-});
-export const drawerHeader = styleWithLayer({
-    padding: '1.25rem',
-    borderBottom: `1px solid ${vars.colors.borderMuted}`,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    gap: '1rem',
-});
-export const drawerTitle = styleWithLayer({
-    fontFamily: vars.fontFamily.heading,
-    fontSize: '1.25rem',
-    fontWeight: '600',
-    color: vars.colors.textPrimary,
-    margin: 0,
-});
-export const drawerCloseButton = styleWithLayer({
-    background: 'none',
-    border: 'none',
-    padding: '0.5rem',
-    cursor: 'pointer',
-    borderRadius: '0.375rem',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    color: vars.colors.textSecondary,
-    fontSize: '1.5rem',
-    lineHeight: '1',
-    transition: 'background-color 0.2s ease-in-out, color 0.2s ease-in-out',
-    selectors: {
-        '&:hover': {
-            backgroundColor: vars.colors.borderMuted,
-            color: vars.colors.textPrimary,
-        },
-        '&:focus-visible': {
-            outline: '2px solid var(--drawer-focus-ring, currentColor)',
-            outlineOffset: '2px',
-        },
-    },
-});
-export const drawerBody = styleWithLayer({
-    padding: '1.25rem',
-    overflowY: 'auto',
-    flex: 1,
-});
-export const drawerFooter = styleWithLayer({
-    padding: '1.25rem',
-    borderTop: `1px solid ${vars.colors.borderMuted}`,
-    display: 'flex',
-    gap: '0.75rem',
-    justifyContent: 'flex-end',
-    alignItems: 'center',
-});

package/dist/components/DropdownMenu/DropdownMenu.d.ts

@@ -1,24 +0,0 @@
-import React from 'react';
-import { Sprinkles } from '../../styles/sprinkles.css';
-export type DropdownMenuPosition = 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';
-export type DropdownMenuItemVariant = 'default' | 'destructive' | 'disabled';
-export interface DropdownMenuItemProps {
-    label: string;
-    onClick?: () => void;
-    variant?: DropdownMenuItemVariant;
-    icon?: React.ReactNode;
-    disabled?: boolean;
-}
-export interface DropdownMenuGroupProps {
-    label?: string;
-    items: DropdownMenuItemProps[];
-}
-export type DropdownMenuProps = React.HTMLAttributes<HTMLDivElement> & Sprinkles & {
-    trigger: React.ReactNode;
-    items?: DropdownMenuItemProps[];
-    groups?: DropdownMenuGroupProps[];
-    position?: DropdownMenuPosition;
-    closeOnItemClick?: boolean;
-};
-declare const DropdownMenu: ({ trigger, items, groups, position, closeOnItemClick, className, ...props }: DropdownMenuProps) => import("react/jsx-runtime").JSX.Element;
-export default DropdownMenu;

package/dist/components/DropdownMenu/DropdownMenu.js

@@ -1,46 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import clsx from 'clsx';
-import React, { useState, useRef, useEffect } from 'react';
-import { dropdownMenuContainer, dropdownMenuTrigger, dropdownMenuContent, dropdownMenuPositionVariants, dropdownMenuItem, dropdownMenuItemVariants, dropdownMenuSeparator, dropdownMenuGroup, dropdownMenuLabel, } from './styles.css';
-import Box from '../Box';
-const DropdownMenu = ({ trigger, items = [], groups = [], position = 'bottomLeft', closeOnItemClick = true, className, ...props }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const containerRef = useRef(null);
-    useEffect(() => {
-        const handleClickOutside = (event) => {
-            if (containerRef.current &&
-                !containerRef.current.contains(event.target)) {
-                setIsOpen(false);
-            }
-        };
-        if (isOpen) {
-            document.addEventListener('mousedown', handleClickOutside);
-        }
-        return () => {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, [isOpen]);
-    useEffect(() => {
-        const handleEscape = (e) => {
-            if (e.key === 'Escape' && isOpen) {
-                setIsOpen(false);
-            }
-        };
-        document.addEventListener('keydown', handleEscape);
-        return () => document.removeEventListener('keydown', handleEscape);
-    }, [isOpen]);
-    const handleItemClick = (item) => {
-        if (item.disabled || item.variant === 'disabled')
-            return;
-        item.onClick?.();
-        if (closeOnItemClick) {
-            setIsOpen(false);
-        }
-    };
-    const renderItem = (item, index) => (_jsxs(Box, { as: "button", className: clsx(dropdownMenuItem, dropdownMenuItemVariants[item.disabled || item.variant === 'disabled'
-            ? 'disabled'
-            : item.variant || 'default']), onClick: () => handleItemClick(item), disabled: item.disabled || item.variant === 'disabled', role: "menuitem", type: "button", children: [item.icon && _jsx("span", { children: item.icon }), item.label] }, index));
-    const renderGroup = (group, index) => (_jsxs(Box, { className: dropdownMenuGroup, role: "group", children: [group.label && (_jsx(Box, { as: "div", className: dropdownMenuLabel, role: "presentation", children: group.label })), group.items.map((item, itemIndex) => renderItem(item, itemIndex))] }, index));
-    return (_jsxs(Box, { ref: containerRef, className: clsx(dropdownMenuContainer, className), ...props, children: [_jsx(Box, { className: dropdownMenuTrigger, onClick: () => setIsOpen(!isOpen), "aria-expanded": isOpen, "aria-haspopup": "true", children: trigger }), isOpen && (_jsxs(Box, { className: clsx(dropdownMenuContent, dropdownMenuPositionVariants[position]), role: "menu", "aria-orientation": "vertical", children: [items.length > 0 && (_jsx(Box, { className: dropdownMenuGroup, children: items.map((item, index) => renderItem(item, index)) })), groups.map((group, index) => (_jsxs(React.Fragment, { children: [index > 0 && (_jsx(Box, { as: "div", className: dropdownMenuSeparator, role: "separator" })), renderGroup(group, index)] }, index)))] }))] }));
-};
-export default DropdownMenu;

package/dist/components/DropdownMenu/index.d.ts

@@ -1,2 +0,0 @@
-export { default as DropdownMenu } from './DropdownMenu';
-export type { DropdownMenuProps, DropdownMenuItemProps, DropdownMenuGroupProps, DropdownMenuPosition, DropdownMenuItemVariant } from './DropdownMenu';

package/dist/components/DropdownMenu/index.js

@@ -1 +0,0 @@
-export { default as DropdownMenu } from './DropdownMenu';

package/dist/components/DropdownMenu/styles.css.d.ts

@@ -1,9 +0,0 @@
-export declare const dropdownMenuContainer: string;
-export declare const dropdownMenuTrigger: string;
-export declare const dropdownMenuContent: string;
-export declare const dropdownMenuPositionVariants: Record<"topLeft" | "topRight" | "bottomLeft" | "bottomRight", string>;
-export declare const dropdownMenuItem: string;
-export declare const dropdownMenuItemVariants: Record<"default" | "disabled" | "destructive", string>;
-export declare const dropdownMenuSeparator: string;
-export declare const dropdownMenuGroup: string;
-export declare const dropdownMenuLabel: string;

package/dist/components/DropdownMenu/styles.css.js

@@ -1,93 +0,0 @@
-import { styleVariants } from '@vanilla-extract/css';
-import { vars } from '../../styles/theme.css';
-import { styleWithLayer } from '../../styles/utils';
-export const dropdownMenuContainer = styleWithLayer({
-    position: 'relative',
-    display: 'inline-block',
-});
-export const dropdownMenuTrigger = styleWithLayer({
-    cursor: 'pointer',
-    userSelect: 'none',
-});
-export const dropdownMenuContent = styleWithLayer({
-    position: 'absolute',
-    backgroundColor: vars.colors.backgroundDefault,
-    border: `1px solid ${vars.colors.borderDefault}`,
-    borderRadius: '0.5rem',
-    boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
-    minWidth: '160px',
-    zIndex: 50,
-    overflow: 'hidden',
-    marginTop: '0.25rem',
-});
-export const dropdownMenuPositionVariants = styleVariants({
-    bottomLeft: {
-        top: '100%',
-        left: 0,
-    },
-    bottomRight: {
-        top: '100%',
-        right: 0,
-    },
-    topLeft: {
-        bottom: '100%',
-        left: 0,
-        marginTop: 0,
-        marginBottom: '0.25rem',
-    },
-    topRight: {
-        bottom: '100%',
-        right: 0,
-        marginTop: 0,
-        marginBottom: '0.25rem',
-    },
-});
-export const dropdownMenuItem = styleWithLayer({
-    padding: '0.75rem 1rem',
-    cursor: 'pointer',
-    display: 'flex',
-    alignItems: 'center',
-    gap: '0.5rem',
-    fontSize: '14px',
-    color: vars.colors.textPrimary,
-    transition: 'background-color 0.15s ease',
-    ':hover': {
-        backgroundColor: vars.colors.backgroundMuted,
-    },
-    ':focus-visible': {
-        outline: 'none',
-        backgroundColor: vars.colors.backgroundMuted,
-    },
-});
-export const dropdownMenuItemVariants = styleVariants({
-    default: {},
-    destructive: {
-        color: vars.colors.alertErrorText,
-        ':hover': {
-            backgroundColor: vars.colors.alertErrorBackground,
-        },
-    },
-    disabled: {
-        opacity: 0.5,
-        cursor: 'not-allowed',
-        ':hover': {
-            backgroundColor: 'transparent',
-        },
-    },
-});
-export const dropdownMenuSeparator = styleWithLayer({
-    height: '1px',
-    backgroundColor: vars.colors.borderMuted,
-    margin: '0.5rem 0',
-});
-export const dropdownMenuGroup = styleWithLayer({
-    padding: '0.5rem 0',
-});
-export const dropdownMenuLabel = styleWithLayer({
-    padding: '0.5rem 1rem',
-    fontSize: '12px',
-    fontWeight: '600',
-    color: vars.colors.textSecondary,
-    textTransform: 'uppercase',
-    letterSpacing: '0.05em',
-});

package/dist/components/EmptyState/EmptyState.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { Sprinkles } from '../../styles/sprinkles.css';
-export type EmptyStateProps = React.HTMLAttributes<HTMLDivElement> & Sprinkles & {
-    icon?: React.ReactNode;
-    title?: string;
-    description?: string;
-    action?: React.ReactNode;
-};
-declare const EmptyState: ({ icon, title, description, action, className, }: EmptyStateProps) => import("react/jsx-runtime").JSX.Element;
-export default EmptyState;

package/dist/components/EmptyState/EmptyState.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import clsx from 'clsx';
-import { emptyState, emptyStateIcon, emptyStateTitle, emptyStateDescription, emptyStateAction, } from './styles.css';
-import Box from '../Box';
-const EmptyState = ({ icon, title, description, action, className, }) => {
-    return (_jsxs(Box, { className: clsx(emptyState, className), role: "status", children: [icon && (_jsx(Box, { className: emptyStateIcon, "aria-hidden": "true", children: icon })), title && (_jsx(Box, { as: "h3", className: emptyStateTitle, children: title })), description && (_jsx(Box, { as: "p", className: emptyStateDescription, children: description })), action && _jsx(Box, { className: emptyStateAction, children: action })] }));
-};
-export default EmptyState;

package/dist/components/EmptyState/index.d.ts

@@ -1,2 +0,0 @@
-export { default as EmptyState } from './EmptyState';
-export type { EmptyStateProps } from './EmptyState';

package/dist/components/EmptyState/index.js

@@ -1 +0,0 @@
-export { default as EmptyState } from './EmptyState';

package/dist/components/EmptyState/styles.css.d.ts

@@ -1,5 +0,0 @@
-export declare const emptyState: string;
-export declare const emptyStateIcon: string;
-export declare const emptyStateTitle: string;
-export declare const emptyStateDescription: string;
-export declare const emptyStateAction: string;

package/dist/components/EmptyState/styles.css.js

@@ -1,30 +0,0 @@
-import { vars } from '../../styles/theme.css';
-import { styleWithLayer } from '../../styles/utils';
-export const emptyState = styleWithLayer({
-    display: 'flex',
-    flexDirection: 'column',
-    alignItems: 'center',
-    justifyContent: 'center',
-    padding: '2rem',
-    textAlign: 'center',
-});
-export const emptyStateIcon = styleWithLayer({
-    fontSize: '48px',
-    marginBottom: '1rem',
-    color: vars.colors.textSecondary,
-});
-export const emptyStateTitle = styleWithLayer({
-    fontSize: '18px',
-    fontWeight: '600',
-    color: vars.colors.textPrimary,
-    margin: '0 0 0.5rem 0',
-});
-export const emptyStateDescription = styleWithLayer({
-    fontSize: '14px',
-    color: vars.colors.textSecondary,
-    margin: '0 0 1rem 0',
-    maxWidth: '400px',
-});
-export const emptyStateAction = styleWithLayer({
-    marginTop: '0.5rem',
-});

package/dist/components/FileUpload/FileUpload.d.ts

@@ -1,28 +0,0 @@
-import React from 'react';
-import { Sprinkles } from '../../styles/sprinkles.css';
-export interface FileUploadFile {
-    id: string;
-    file: File;
-    name: string;
-    size: number;
-    progress: number;
-    status: 'uploading' | 'success' | 'error';
-    errorMessage?: string;
-}
-export type FileUploadProps = React.HTMLAttributes<HTMLDivElement> & Sprinkles & {
-    label?: string;
-    files?: FileUploadFile[];
-    onFilesChange?: (files: FileUploadFile[]) => void;
-    onFileAdd?: (files: File[]) => void;
-    onFileRemove?: (fileId: string) => void;
-    accept?: string;
-    multiple?: boolean;
-    maxFileSize?: number;
-    maxFiles?: number;
-    disabled?: boolean;
-    dropzoneText?: string;
-    hint?: string;
-    showProgress?: boolean;
-};
-declare const FileUpload: ({ label, files, onFilesChange, onFileAdd, onFileRemove, accept, multiple, maxFileSize, maxFiles, disabled, dropzoneText, hint, showProgress, className, ...props }: FileUploadProps) => import("react/jsx-runtime").JSX.Element;
-export default FileUpload;