import type { ReactNode, RefAttributes } from "react";
import type { DOMProps, SpacingType } from "../../types";

export type BoxElementType = HTMLDivElement;

export type BoxDimensionsType = string | number;

export interface BoxProps extends DOMProps, RefAttributes<BoxElementType> {
  children?: ReactNode;
  /** Custom class name for setting specific CSS */
  className?: string;
  /** HTML element for the Box */
  elementType?: "div" | "span";
  style?: React.CSSProperties;
  padding?: SpacingType;
  paddingX?: SpacingType;
  paddingInline?: SpacingType;
  paddingInlineStart?: SpacingType;
  paddingInlineEnd?: SpacingType;
  paddingY?: SpacingType;
  paddingBlock?: SpacingType;
  paddingBlockStart?: SpacingType;
  paddingBlockEnd?: SpacingType;
  paddingTop?: SpacingType;
  paddingRight?: SpacingType;
  paddingBottom?: SpacingType;
  paddingLeft?: SpacingType;
  minWidth?: BoxDimensionsType;
  minHeight?: BoxDimensionsType;
  maxWidth?: BoxDimensionsType;
  maxHeight?: BoxDimensionsType;
  width?: BoxDimensionsType;
  height?: BoxDimensionsType;
}
