import { default as React, JSX } from 'react';
import { CSSObject } from 'styled-components';
type SpacingValue = string | number;
export type StateStyles = {
    _hover?: StyledBlockProps;
    _focus?: StyledBlockProps;
    _active?: StyledBlockProps;
    _disabled?: StyledBlockProps;
    _visited?: StyledBlockProps;
    _focusVisible?: StyledBlockProps;
};
type StyledBlockProps = StateStyles & {
    color?: CSSObject['color'];
    position?: CSSObject['position'];
    inset?: CSSObject['inset'];
    top?: CSSObject['top'];
    right?: CSSObject['right'];
    bottom?: CSSObject['bottom'];
    left?: CSSObject['left'];
    zIndex?: CSSObject['zIndex'];
    pointerEvents?: CSSObject['pointerEvents'];
    opacity?: CSSObject['opacity'];
    padding?: SpacingValue;
    paddingTop?: SpacingValue;
    paddingBottom?: SpacingValue;
    paddingLeft?: SpacingValue;
    paddingRight?: SpacingValue;
    paddingX?: SpacingValue;
    paddingY?: SpacingValue;
    margin?: SpacingValue;
    marginTop?: SpacingValue;
    marginBottom?: SpacingValue;
    marginLeft?: SpacingValue;
    marginRight?: SpacingValue;
    marginX?: SpacingValue;
    marginY?: SpacingValue;
    display?: CSSObject['display'];
    flexDirection?: CSSObject['flexDirection'];
    justifyContent?: CSSObject['justifyContent'];
    alignItems?: CSSObject['alignItems'];
    flexWrap?: CSSObject['flexWrap'];
    flexGrow?: CSSObject['flexGrow'];
    flexShrink?: CSSObject['flexShrink'];
    flexBasis?: CSSObject['flexBasis'];
    gap?: CSSObject['gap'];
    rowGap?: CSSObject['rowGap'];
    columnGap?: CSSObject['columnGap'];
    alignContent?: CSSObject['alignContent'];
    alignSelf?: CSSObject['alignSelf'];
    justifySelf?: CSSObject['justifySelf'];
    borderRadius?: CSSObject['borderRadius'];
    borderTopLeftRadius?: CSSObject['borderTopLeftRadius'];
    borderTopRightRadius?: CSSObject['borderTopRightRadius'];
    borderBottomLeftRadius?: CSSObject['borderBottomLeftRadius'];
    borderBottomRightRadius?: CSSObject['borderBottomRightRadius'];
    outline?: CSSObject['outline'];
    outlineColor?: CSSObject['outlineColor'];
    outlineWidth?: CSSObject['outlineWidth'];
    outlineStyle?: CSSObject['outlineStyle'];
    outlineOffset?: CSSObject['outlineOffset'];
    width?: CSSObject['width'];
    height?: CSSObject['height'];
    minWidth?: CSSObject['minWidth'];
    minHeight?: CSSObject['minHeight'];
    maxWidth?: CSSObject['maxWidth'];
    maxHeight?: CSSObject['maxHeight'];
    size?: SpacingValue;
    backgroundColor?: CSSObject['backgroundColor'];
    backgroundImage?: CSSObject['backgroundImage'];
    backgroundSize?: CSSObject['backgroundSize'];
    border?: CSSObject['border'];
    borderTop?: CSSObject['borderTop'];
    borderBottom?: CSSObject['borderBottom'];
    borderLeft?: CSSObject['borderLeft'];
    borderRight?: CSSObject['borderRight'];
    boxShadow?: CSSObject['boxShadow'];
    overflow?: CSSObject['overflow'];
    overflowX?: CSSObject['overflowX'];
    overflowY?: CSSObject['overflowY'];
    whiteSpace?: CSSObject['whiteSpace'];
    contentCentered?: boolean;
    cursor?: CSSObject['cursor'];
    fontSize?: CSSObject['fontSize'];
    fontWeight?: CSSObject['fontWeight'];
    lineHeight?: CSSObject['lineHeight'];
    letterSpacing?: CSSObject['letterSpacing'];
    textAlign?: CSSObject['textAlign'];
    textTransform?: CSSObject['textTransform'];
    textOverflow?: CSSObject['textOverflow'];
    userSelect?: CSSObject['userSelect'];
    transform?: CSSObject['transform'];
    willChange?: CSSObject['willChange'];
    transformOrigin?: CSSObject['transformOrigin'];
    backfaceVisibility?: CSSObject['backfaceVisibility'];
    transition?: CSSObject['transition'];
    transitionDuration?: CSSObject['transitionDuration'];
    transitionTimingFunction?: CSSObject['transitionTimingFunction'];
    transitionDelay?: CSSObject['transitionDelay'];
};
type SemanticTagType = keyof Pick<JSX.IntrinsicElements, 'div' | 'section' | 'article' | 'header' | 'footer' | 'main' | 'span' | 'nav' | 'hr' | 'label' | 'button'>;
export type BlockProps = StyledBlockProps & Omit<React.HTMLAttributes<HTMLElement>, 'as' | 'color'> & {
    children?: React.ReactNode;
    as?: SemanticTagType;
};
/**
 * Block Component
 * @description
 * The Block component is a primitive component that renders a styled div element.
 * It is used to create consistent spacing and layout patterns across the application.
 *
 * @todo
 * - Add support for focus-visible outline
 */
declare const Block: React.ForwardRefExoticComponent<StateStyles & {
    color?: CSSObject["color"];
    position?: CSSObject["position"];
    inset?: CSSObject["inset"];
    top?: CSSObject["top"];
    right?: CSSObject["right"];
    bottom?: CSSObject["bottom"];
    left?: CSSObject["left"];
    zIndex?: CSSObject["zIndex"];
    pointerEvents?: CSSObject["pointerEvents"];
    opacity?: CSSObject["opacity"];
    padding?: SpacingValue;
    paddingTop?: SpacingValue;
    paddingBottom?: SpacingValue;
    paddingLeft?: SpacingValue;
    paddingRight?: SpacingValue;
    paddingX?: SpacingValue;
    paddingY?: SpacingValue;
    margin?: SpacingValue;
    marginTop?: SpacingValue;
    marginBottom?: SpacingValue;
    marginLeft?: SpacingValue;
    marginRight?: SpacingValue;
    marginX?: SpacingValue;
    marginY?: SpacingValue;
    display?: CSSObject["display"];
    flexDirection?: CSSObject["flexDirection"];
    justifyContent?: CSSObject["justifyContent"];
    alignItems?: CSSObject["alignItems"];
    flexWrap?: CSSObject["flexWrap"];
    flexGrow?: CSSObject["flexGrow"];
    flexShrink?: CSSObject["flexShrink"];
    flexBasis?: CSSObject["flexBasis"];
    gap?: CSSObject["gap"];
    rowGap?: CSSObject["rowGap"];
    columnGap?: CSSObject["columnGap"];
    alignContent?: CSSObject["alignContent"];
    alignSelf?: CSSObject["alignSelf"];
    justifySelf?: CSSObject["justifySelf"];
    borderRadius?: CSSObject["borderRadius"];
    borderTopLeftRadius?: CSSObject["borderTopLeftRadius"];
    borderTopRightRadius?: CSSObject["borderTopRightRadius"];
    borderBottomLeftRadius?: CSSObject["borderBottomLeftRadius"];
    borderBottomRightRadius?: CSSObject["borderBottomRightRadius"];
    outline?: CSSObject["outline"];
    outlineColor?: CSSObject["outlineColor"];
    outlineWidth?: CSSObject["outlineWidth"];
    outlineStyle?: CSSObject["outlineStyle"];
    outlineOffset?: CSSObject["outlineOffset"];
    width?: CSSObject["width"];
    height?: CSSObject["height"];
    minWidth?: CSSObject["minWidth"];
    minHeight?: CSSObject["minHeight"];
    maxWidth?: CSSObject["maxWidth"];
    maxHeight?: CSSObject["maxHeight"];
    size?: SpacingValue;
    backgroundColor?: CSSObject["backgroundColor"];
    backgroundImage?: CSSObject["backgroundImage"];
    backgroundSize?: CSSObject["backgroundSize"];
    border?: CSSObject["border"];
    borderTop?: CSSObject["borderTop"];
    borderBottom?: CSSObject["borderBottom"];
    borderLeft?: CSSObject["borderLeft"];
    borderRight?: CSSObject["borderRight"];
    boxShadow?: CSSObject["boxShadow"];
    overflow?: CSSObject["overflow"];
    overflowX?: CSSObject["overflowX"];
    overflowY?: CSSObject["overflowY"];
    whiteSpace?: CSSObject["whiteSpace"];
    contentCentered?: boolean;
    cursor?: CSSObject["cursor"];
    fontSize?: CSSObject["fontSize"];
    fontWeight?: CSSObject["fontWeight"];
    lineHeight?: CSSObject["lineHeight"];
    letterSpacing?: CSSObject["letterSpacing"];
    textAlign?: CSSObject["textAlign"];
    textTransform?: CSSObject["textTransform"];
    textOverflow?: CSSObject["textOverflow"];
    userSelect?: CSSObject["userSelect"];
    transform?: CSSObject["transform"];
    willChange?: CSSObject["willChange"];
    transformOrigin?: CSSObject["transformOrigin"];
    backfaceVisibility?: CSSObject["backfaceVisibility"];
    transition?: CSSObject["transition"];
    transitionDuration?: CSSObject["transitionDuration"];
    transitionTimingFunction?: CSSObject["transitionTimingFunction"];
    transitionDelay?: CSSObject["transitionDelay"];
} & Omit<React.HTMLAttributes<HTMLElement>, "color" | "as"> & {
    children?: React.ReactNode;
    as?: SemanticTagType;
} & React.RefAttributes<HTMLDivElement>>;
export default Block;