
import { UniversalBoxProps } from "../types/dist/index.js";
import "../tokens/index.js";
import * as react from "react";

//#region src/components/Box.d.ts
type DivProps = React.HTMLAttributes<HTMLDivElement>;
interface BoxProps extends UniversalBoxProps, DivProps {}
/**
 * **📦 A layout component that can be used to compose other components**
 *
 * @description
 * The most simple component we ship - a div. But with all the power of the UDS design system.
 * By default, `Box` is a flexbox container. When working with vertical or horizontal layouts,
 * consider using [VStack](./v-stack) or [HStack](./h-stack) respectively.
 *
 * @example
 * ```tsx
 * import { Box } from '@yahoo/uds';
 *
 * <Box backgroundColor="primary" spacing="6">
 *   Any kind of content can go here!
 * </Box>
 * ```
 *
 * @usage
 * - If you need to div-like container to apply padding, shapes, or other styling.
 * - If you're creating card components.
 *
 * @see The {@link https://uds.build/docs/components/box Box Docs} for more info
 *
 * @related [HStack](https://uds.build/docs/components/h-stack), [VStack](https://uds.build/docs/components/v-stack)
 */
declare const Box: react.ForwardRefExoticComponent<BoxProps & react.RefAttributes<HTMLDivElement>>;
//#endregion
export { Box, type BoxProps, type DivProps };