import { MantineBreakpoint } from '../MantineProvider'; import type { CssVarsProp, MantineStyleProp } from './Box.types'; import { MantineStyleProps } from './style-props'; export type Mod = Record | string; export type BoxMod = Mod | Mod[] | BoxMod[]; export interface BoxProps extends MantineStyleProps { /** Class added to the root element, if applicable */ className?: string; /** Inline style added to root component element, can subscribe to theme defined on MantineProvider */ style?: MantineStyleProp; /** CSS variables defined on root component element */ __vars?: CssVarsProp; /** `size` property passed down the HTML element */ __size?: string; /** Breakpoint above which the component is hidden with `display: none` */ hiddenFrom?: MantineBreakpoint; /** Breakpoint below which the component is hidden with `display: none` */ visibleFrom?: MantineBreakpoint; /** Determines whether component should be hidden in light color scheme with `display: none` */ lightHidden?: boolean; /** Determines whether component should be hidden in dark color scheme with `display: none` */ darkHidden?: boolean; /** Element modifiers transformed into `data-` attributes, for example, `{ 'data-size': 'xl' }`, falsy values are removed */ mod?: BoxMod; } export type ElementProps = Omit, 'style' | PropsToOmit>; export interface BoxComponentProps extends BoxProps { /** Variant passed from parent component, sets `data-variant` */ variant?: string; /** Size passed from parent component, sets `data-size` if value is not number like */ size?: string | number; } export declare const Box: ((props: import("..").PolymorphicComponentProps) => React.ReactElement) & Omit & { ref?: any; renderRoot?: (props: any) => any; }) | (BoxComponentProps & { component: React.ElementType; renderRoot?: (props: Record) => any; })>, never> & Record;