import * as react from 'react';
import react__default, { HTMLAttributes, ReactNode } from 'react';
import { Color, SpinnerSize, ColorVariant, Size, CompactSize, Radius } from '@ninna-ui/core';
import * as react_jsx_runtime from 'react/jsx-runtime';

type LoadingVariant = "spin" | "ping" | "pulse" | "dots";
interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
    /** Visual style variant */
    variant?: LoadingVariant;
    /** Color theme */
    color?: Color;
    /** Size of the loading indicator */
    size?: SpinnerSize;
    /** Accessible label for screen readers */
    label?: string;
}

/**
 * Loading component for loading states
 *
 * @example
 * <Loading variant="spin" color="primary" size="md" />
 * <Loading variant="dots" color="success" size="lg" />
 * <Loading variant="pulse" color="info" size="xl" label="Loading content..." />
 */
declare const Loading: react.ForwardRefExoticComponent<LoadingProps & react.RefAttributes<HTMLDivElement>>;

type AlertVariant = ColorVariant;
interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
    /** Visual style variant */
    variant?: AlertVariant;
    /** Color theme */
    color?: Color;
    /** Alert title */
    title?: ReactNode;
    /** Alert description/message */
    description?: ReactNode;
    /** Custom icon to display */
    icon?: ReactNode;
    /** Whether to show the default icon based on color */
    showIcon?: boolean;
    /** Whether the alert can be dismissed */
    dismissible?: boolean;
    /** Callback when alert is dismissed */
    onDismiss?: () => void;
    /** Size of the alert */
    size?: Size;
    /** Action element (button, link, etc.) */
    action?: ReactNode;
    /** Additional CSS classes */
    className?: string;
    /** Alert content (alternative to description) */
    children?: ReactNode;
}

/**
 * Alert component for displaying important messages
 *
 * @example
 * ```tsx
 * <Alert color="success" title="Success!" description="Your changes have been saved." />
 * <Alert color="danger" title="Error" dismissible onDismiss={() => {}}>
 *   Something went wrong. Please try again.
 * </Alert>
 * <Alert color="warning" title="Warning" action={<Button size="sm">Retry</Button>}>
 *   Your session is about to expire.
 * </Alert>
 * ```
 */
declare const Alert: react__default.ForwardRefExoticComponent<AlertProps & react__default.RefAttributes<HTMLDivElement>>;

type ProgressVariant = "default" | "striped" | "animated";
type ProgressLabelPosition = "left" | "right" | "top" | "inside" | "none";
interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
    /** Current progress value (0-100 or custom max) */
    value?: number;
    /** Maximum value */
    max?: number;
    /** Size of the progress bar */
    size?: Size;
    /** Color theme */
    color?: Color;
    /** Visual style variant */
    variant?: ProgressVariant;
    /** Whether to show the value label */
    showValue?: boolean;
    /** Position of the value label */
    labelPosition?: ProgressLabelPosition;
    /** Custom format function for the value label */
    formatLabel?: (value: number, max: number) => ReactNode;
    /** Whether the progress is indeterminate (loading state) */
    indeterminate?: boolean;
    /** Accessible label for screen readers */
    label?: string;
    /** Additional CSS classes */
    className?: string;
    /** Additional CSS classes for the track (background) */
    trackClassName?: string;
    /** Additional CSS classes for the indicator (filled part) */
    indicatorClassName?: string;
}

/**
 * Progress component for displaying progress indicators
 *
 * @example
 * ```tsx
 * <Progress value={50} />
 * <Progress value={75} color="success" showValue labelPosition="right" />
 * <Progress indeterminate color="primary" />
 * <Progress value={30} variant="striped" />
 * ```
 */
declare const Progress: react.ForwardRefExoticComponent<ProgressProps & react.RefAttributes<HTMLDivElement>>;

type CircularProgressLabelPosition = "center" | "bottom" | "none";
interface CircularProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
    /** Current progress value (0-100 or custom max) */
    value?: number;
    /** Maximum value */
    max?: number;
    /** Size of the circular progress */
    size?: Size;
    /** Color theme */
    color?: Color;
    /** Stroke width of the progress circle */
    strokeWidth?: number;
    /** Whether to show the value label */
    showValue?: boolean;
    /** Position of the value label */
    labelPosition?: CircularProgressLabelPosition;
    /** Custom format function for the value label */
    formatLabel?: (value: number, max: number) => ReactNode;
    /** Whether the progress is indeterminate (loading state) */
    indeterminate?: boolean;
    /** Accessible label for screen readers */
    label?: string;
    /** Additional CSS classes */
    className?: string;
    /** Additional CSS classes for the track (background circle) */
    trackClassName?: string;
    /** Additional CSS classes for the indicator (progress circle) */
    indicatorClassName?: string;
    /** Custom content to render inside the circle */
    children?: ReactNode;
}

/**
 * CircularProgress component for displaying circular progress indicators
 *
 * @example
 * ```tsx
 * <CircularProgress value={50} />
 * <CircularProgress value={75} color="success" showValue />
 * <CircularProgress indeterminate color="primary" />
 * ```
 */
declare const CircularProgress: react.ForwardRefExoticComponent<CircularProgressProps & react.RefAttributes<HTMLDivElement>>;

/** Status value options */
type StatusValue = 'success' | 'danger' | 'warning' | 'info';
/** Status size - uses core CompactSize for consistency */
type StatusSize = CompactSize;
/**
 * Props for the Status component
 */
interface StatusProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Status value that determines the color
     * @default "info"
     */
    value?: StatusValue;
    /**
     * Size of the status indicator
     * @default "md"
     */
    size?: StatusSize;
    /**
     * Label text to display next to the indicator
     */
    children?: ReactNode;
}

/**
 * Status component for displaying status indicators with optional labels.
 * Used to indicate the status of a process or state.
 *
 * @example
 * ```tsx
 * <Status value="success">Completed</Status>
 * <Status value="error">Failed</Status>
 * <Status value="warning">Pending</Status>
 * <Status value="info">Processing</Status>
 * ```
 */
declare const Status: react.ForwardRefExoticComponent<StatusProps & react.RefAttributes<HTMLDivElement>>;

/** Skeleton animation variant options */
type SkeletonVariant = 'pulse' | 'shine' | 'none';
/**
 * Props for the Skeleton component
 */
interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Animation variant
     * @default "pulse"
     */
    variant?: SkeletonVariant;
    /**
     * Width of the skeleton
     */
    width?: string | number;
    /**
     * Height of the skeleton
     */
    height?: string | number;
    /**
     * Border radius
     * @default "md"
     */
    radius?: Radius;
    /**
     * Whether the skeleton is loading
     * @default true
     */
    loading?: boolean;
    /**
     * Content to show when not loading
     */
    children?: ReactNode;
}
/**
 * Props for the SkeletonCircle component
 */
interface SkeletonCircleProps extends Omit<SkeletonProps, "radius"> {
    /**
     * Size of the circle (width and height)
     * @default "40px"
     */
    size?: string | number;
}
/**
 * Props for the SkeletonText component
 */
interface SkeletonTextProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Number of lines to render
     * @default 3
     */
    noOfLines?: number;
    /**
     * Gap between lines
     * @default "8px"
     */
    gap?: string | number;
    /**
     * Animation variant
     * @default "pulse"
     */
    variant?: SkeletonVariant;
    /**
     * Whether the skeleton is loading
     * @default true
     */
    loading?: boolean;
    /**
     * Content to show when not loading
     */
    children?: ReactNode;
}

/**
 * Skeleton component for displaying loading placeholders.
 * Used to indicate content is loading.
 *
 * @example
 * ```tsx
 * <Skeleton width="200px" height="20px" />
 * <Skeleton loading={isLoading}>
 *   <div>Content loaded</div>
 * </Skeleton>
 * ```
 */
declare const Skeleton: react.ForwardRefExoticComponent<SkeletonProps & react.RefAttributes<HTMLDivElement>>;
/**
 * SkeletonCircle component for circular loading placeholders.
 * Commonly used for avatar placeholders.
 *
 * @example
 * ```tsx
 * <SkeletonCircle size="40px" />
 * <SkeletonCircle size={48} />
 * ```
 */
declare const SkeletonCircle: react.ForwardRefExoticComponent<SkeletonCircleProps & react.RefAttributes<HTMLDivElement>>;
/**
 * SkeletonText component for text loading placeholders.
 * Renders multiple lines to simulate text content.
 *
 * @example
 * ```tsx
 * <SkeletonText noOfLines={3} />
 * <SkeletonText noOfLines={2} gap="12px" />
 * ```
 */
declare const SkeletonText: react.ForwardRefExoticComponent<SkeletonTextProps & react.RefAttributes<HTMLDivElement>>;

/** EmptyState size options */
type EmptyStateSize = 'sm' | 'md' | 'lg';
/**
 * Props for the EmptyState component
 */
interface EmptyStateProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * Title text
     */
    title: string;
    /**
     * Description text
     */
    description?: string;
    /**
     * Icon to display
     */
    icon?: ReactNode;
    /**
     * Size of the empty state
     * @default "md"
     */
    size?: EmptyStateSize;
    /**
     * Action button or content
     */
    action?: ReactNode;
    /**
     * Additional content below the description
     */
    children?: ReactNode;
}

/**
 * EmptyState component for displaying empty or unavailable resource states.
 * Used to indicate when there is no data to display.
 *
 * @example
 * ```tsx
 * <EmptyState
 *   title="No results found"
 *   description="Try adjusting your search or filters"
 *   icon={<SearchIcon />}
 *   action={<Button>Clear filters</Button>}
 * />
 * ```
 */
declare const EmptyState: react.ForwardRefExoticComponent<EmptyStateProps & react.RefAttributes<HTMLDivElement>>;

/** Toast position on screen */
type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
/** Toast variant - uses core ColorVariant for consistency */
type ToastVariant = ColorVariant;
/** Toast data structure for creating toasts */
interface ToastData {
    /** Unique identifier for the toast */
    id: string;
    /** Toast title */
    title?: ReactNode;
    /** Toast description/message */
    description?: ReactNode;
    /** Color theme */
    color?: Color;
    /** Visual variant */
    variant?: ToastVariant;
    /** Show a spinning loading indicator. Use with duration: 0 to keep the toast persistent until updated. */
    isLoading?: boolean;
    /** Duration in milliseconds (0 = persistent) */
    duration?: number;
    /** Whether the toast can be dismissed */
    closable?: boolean;
    /** Custom icon */
    icon?: ReactNode;
    /** Action button configuration */
    action?: {
        label: string;
        onClick: () => void;
        altText?: string;
    };
    /** Callback when toast is closed */
    onClose?: () => void;
    /** Callback when toast opens */
    onOpen?: () => void;
    /** Route this toast to a specific Toaster by its id */
    toasterId?: string;
}
/** Props for creating a new toast */
type CreateToastOptions = Omit<ToastData, 'id'>;
/** Toast component props */
interface ToastProps {
    /** Toast data */
    toast: ToastData;
    /** Callback to dismiss the toast */
    onDismiss?: (id: string) => void;
    /** Position of the toaster - used for correct enter/exit animations */
    position?: ToastPosition;
    /** Additional CSS classes */
    className?: string;
}
/** Toaster provider props */
interface ToasterProps {
    /** Position of toasts on screen */
    position?: ToastPosition;
    /** Maximum number of visible toasts */
    max?: number;
    /** Gap between toasts */
    gap?: number;
    /** Offset from screen edges */
    offset?: string | number;
    /** Pause auto-dismiss on hover */
    pauseOnHover?: boolean;
    /** Unique id - only toasts created with this toasterId will be shown */
    id?: string;
    /** Additional CSS classes for viewport */
    className?: string;
    /** Children (usually not needed) */
    children?: ReactNode;
}
/** Toast context value */
interface ToastContextValue {
    /** Create a new toast */
    toast: (options: CreateToastOptions) => string;
    /** Dismiss a toast by id, or all if no id provided */
    dismiss: (id?: string) => void;
    /** Dismiss all toasts */
    dismissAll: () => void;
    /** Update an existing toast */
    update: (id: string, options: Partial<CreateToastOptions>) => void;
    /** Promise-based toast - shows loading spinner, then success/error on resolution */
    promise: <T>(promise: Promise<T>, options: {
        loading: CreateToastOptions | string;
        success: CreateToastOptions | string | ((data: T) => CreateToastOptions | string);
        error: CreateToastOptions | string | ((error: unknown) => CreateToastOptions | string);
    }) => Promise<T>;
}

declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<HTMLDivElement>>;

declare const toast: {
    create: (options: CreateToastOptions) => string;
    dismiss: (id?: string) => void;
    dismissAll: () => void;
    update: (id: string, options: Partial<CreateToastOptions>) => void;
    promise: <T>(promise: Promise<T>, options: {
        loading: CreateToastOptions | string;
        success: CreateToastOptions | string | ((data: T) => CreateToastOptions | string);
        error: CreateToastOptions | string | ((error: unknown) => CreateToastOptions | string);
    }) => Promise<T>;
};
declare const Toaster: react.ForwardRefExoticComponent<ToasterProps & react.RefAttributes<HTMLDivElement>>;

interface ToastProviderProps {
    children: ReactNode;
}
declare function ToastProvider({ children }: ToastProviderProps): react_jsx_runtime.JSX.Element;
declare function useToast(): ToastContextValue;

export { Alert, type AlertProps, type AlertVariant, CircularProgress, type CircularProgressLabelPosition, type CircularProgressProps, type CreateToastOptions, EmptyState, type EmptyStateProps, Loading, type LoadingProps, type LoadingVariant, Progress, type ProgressLabelPosition, type ProgressProps, type ProgressVariant, Skeleton, SkeletonCircle, type SkeletonCircleProps, type SkeletonProps, SkeletonText, type SkeletonTextProps, Status, type StatusProps, type StatusSize, type StatusValue, Toast, type ToastContextValue, type ToastData, type ToastProps, ToastProvider, type ToastVariant, Toaster, type ToasterProps, toast, useToast };