import React from "react";
export interface BoxProps {
    /**
     * The content of the box
     */
    children?: React.ReactNode;
    /**
     * The component to render the box as
     */
    component?: React.ElementType;
    /**
     * Display property
     */
    display?: "block" | "flex" | "inline" | "inline-block" | "inline-flex" | "grid" | "inline-grid" | "none";
    /**
     * Flex direction
     */
    flexDirection?: "row" | "row-reverse" | "column" | "column-reverse";
    /**
     * Flex wrap
     */
    flexWrap?: "nowrap" | "wrap" | "wrap-reverse";
    /**
     * Justify content
     */
    justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
    /**
     * Align items
     */
    alignItems?: "flex-start" | "flex-end" | "center" | "baseline" | "stretch";
    /**
     * Align content
     */
    alignContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "stretch";
    /**
     * Align self
     */
    alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "baseline" | "stretch";
    /**
     * Padding
     */
    p?: number | string;
    pt?: number | string;
    pr?: number | string;
    pb?: number | string;
    pl?: number | string;
    px?: number | string;
    py?: number | string;
    /**
     * Margin
     */
    m?: number | string;
    mt?: number | string;
    mr?: number | string;
    mb?: number | string;
    ml?: number | string;
    mx?: number | string;
    my?: number | string;
    /**
     * Width
     */
    width?: number | string;
    /**
     * Height
     */
    height?: number | string;
    /**
     * Min width
     */
    minWidth?: number | string;
    /**
     * Min height
     */
    minHeight?: number | string;
    /**
     * Max width
     */
    maxWidth?: number | string;
    /**
     * Max height
     */
    maxHeight?: number | string;
    /**
     * Border radius
     */
    borderRadius?: number | string;
    /**
     * Background color
     */
    bgcolor?: string;
    /**
     * If true, the box will have a glass effect
     */
    glass?: boolean;
    /**
     * The elevation of the glass effect
     */
    elevation?: 0 | 1 | 2 | 3 | 4 | 5 | "level1" | "level2" | "level3" | "level4";
    /**
     * Additional CSS class name
     */
    className?: string;
    /**
     * Additional CSS styles
     */
    style?: React.CSSProperties;
    /**
     * Click handler
     */
    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
}
/**
 * Box Component
 *
 * A flexible container with system props for layout and styling.
 */
export declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLDivElement>>;
/**
 * GlassBox Component
 *
 * A box component with glass morphism styling.
 */
export declare const GlassBox: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLDivElement>>;
//# sourceMappingURL=GlassBox.d.ts.map