import { ReactNode, HTMLAttributes, ElementType } from 'react';
/**
 * Spacing value - can be a theme spacing index (number) or a CSS value (string)
 */
export type SpacingValue = number | string;
/**
 * Box variant for visual styling
 * - 'default': No visual styling applied
 * - 'accented': Applies gradient background and colored border using accentColor
 */
export type BoxVariant = 'default' | 'accented';
/**
 * Border radius options for Box
 */
export type BoxBorderRadius = 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
/**
 * Props for the Box component
 */
export interface BoxProps extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
    /** Box content */
    children?: ReactNode;
    /** Padding on all sides */
    p?: SpacingValue;
    /** Horizontal padding (left and right) */
    px?: SpacingValue;
    /** Vertical padding (top and bottom) */
    py?: SpacingValue;
    /** Padding top */
    pt?: SpacingValue;
    /** Padding right */
    pr?: SpacingValue;
    /** Padding bottom */
    pb?: SpacingValue;
    /** Padding left */
    pl?: SpacingValue;
    /** Margin on all sides */
    m?: SpacingValue;
    /** Horizontal margin (left and right) */
    mx?: SpacingValue;
    /** Vertical margin (top and bottom) */
    my?: SpacingValue;
    /** Margin top */
    mt?: SpacingValue;
    /** Margin right */
    mr?: SpacingValue;
    /** Margin bottom */
    mb?: SpacingValue;
    /** Margin left */
    ml?: SpacingValue;
    /**
     * Visual variant of the box
     * - 'default': No visual styling
     * - 'accented': Gradient background and colored border using accentColor
     * @default 'default'
     */
    variant?: BoxVariant;
    /**
     * Accent color for the 'accented' variant (hex color value)
     * Creates a subtle gradient background and colored border
     * @example '#6161FF'
     */
    accentColor?: string;
    /**
     * Border radius preset
     * @default 'none'
     */
    borderRadius?: BoxBorderRadius;
    /** Polymorphic element type */
    as?: ElementType;
    /** Additional CSS classes */
    className?: string;
    /** Test ID (deprecated, use dataTestId) */
    'data-testid'?: string;
    /** Test identifier for automated testing */
    dataTestId?: string;
    /** Data identifier for ib-ui compatibility */
    dataId?: string;
}
//# sourceMappingURL=Box.types.d.ts.map