import { CSSObject } from 'styled-components';
import { BreakpointType } from '../../breakpoints/breakPoints';
export type UploadState = 'idle' | 'uploading' | 'success' | 'error' | 'dragActive';
/**
 * Upload Tokens following the pattern: [target].CSSProp.[state]
 *
 * Structure:
 * - target: wrapper | label | container | slot | text | progressContainer | fileList
 * - CSSProp: padding | border | backgroundColor | fontSize | fontWeight | color | gap | margin
 * - state: idle | uploading | success | error | dragActive (upload states)
 *
 * Hierarchy:
 * - Wrapper: Outermost container with base padding
 * - Label: Label section with text styling and spacing
 * - Container: Upload box with state-dependent styling (border, background)
 * - Slot: Content area with icon/content spacing
 * - Text: Text styling for titles, descriptions, filenames, errors
 * - ProgressContainer: Progress bar section with spacing
 * - FileList: File list display with spacing and layout
 */
export type UploadTokenType = {
    header: {
        label: {
            text: {
                fontSize: CSSObject['fontSize'];
                fontWeight: CSSObject['fontWeight'];
                color: CSSObject['color'];
            };
            marginBottom: CSSObject['marginBottom'];
            gap: CSSObject['gap'];
        };
        required: {
            text: {
                color: CSSObject['color'];
            };
            gap: CSSObject['gap'];
        };
        subLabel: {
            text: {
                fontSize: CSSObject['fontSize'];
                fontWeight: CSSObject['fontWeight'];
                color: CSSObject['color'];
            };
            gap: CSSObject['gap'];
        };
        helpIcon: {
            width: CSSObject['width'];
            color: CSSObject['color'];
        };
    };
    container: {
        border: {
            idle: CSSObject['border'];
            uploading: CSSObject['border'];
            success: CSSObject['border'];
            error: CSSObject['border'];
            dragActive: CSSObject['border'];
        };
        backgroundColor: {
            idle: CSSObject['backgroundColor'];
            uploading: CSSObject['backgroundColor'];
            success: CSSObject['backgroundColor'];
            error: CSSObject['backgroundColor'];
            dragActive: CSSObject['backgroundColor'];
        };
        borderRadius: CSSObject['borderRadius'];
        padding: CSSObject['padding'];
        content: {
            slot: {
                width: CSSObject['width'];
                gap: CSSObject['gap'];
            };
            text: {
                title: {
                    color: CSSObject['color'];
                    fontSize: CSSObject['fontSize'];
                    fontWeight: CSSObject['fontWeight'];
                };
                subtitle: {
                    color: CSSObject['color'];
                    fontSize: CSSObject['fontSize'];
                    fontWeight: CSSObject['fontWeight'];
                };
                gap: CSSObject['gap'];
            };
            actionable: {
                gap: CSSObject['gap'];
                errorText: {
                    color: CSSObject['color'];
                    fontSize: CSSObject['fontSize'];
                    fontWeight: CSSObject['fontWeight'];
                };
            };
        };
    };
};
export type ResponsiveUploadTokens = {
    [key in keyof BreakpointType]: UploadTokenType;
};