
import { DividerProps as DividerProps$1 } from "./types.js";
import * as _$react from "react";

//#region src/components/Divider/Divider.d.ts
type DividerProps = DividerProps$1;
/**
 * **📦 A divider component that can be used to visually separate components**
 *
 * @description
 * The Divider component is a visual element used to separate content and create clear groupings within a layout. It helps establish hierarchy, improve readability, and guide users through sections of an interface. Dividers can appear as horizontal or vertical lines and are commonly used between related content blocks, within menus, or in dense UI areas to reduce visual clutter.
 *
 * For custom composition, import `DividerLine` and `DividerLabel` from the same package entrypoint
 * and compose them inside `Divider`, `HStack`, or `VStack`.
 *
 * @example
 * ```tsx
 * import { Divider, DividerLabel, DividerLine } from '@yahoo/uds';
 *
 * // Default primary horizontal divider. Similar to <hr />
 * <Divider />
 *
 * // A vertical divider.
 * <Divider vertical />
 *
 * // A horizontal divider with the secondary styling.
 * <Divider variant="secondary" />
 *
 * // A vertical divider with the tertiary styling.
 * <Divider vertical variant="tertiary" />
 *
 * // Manual composition.
 * <Divider>
 *   <DividerLine />
 *   <DividerLabel>Section</DividerLabel>
 *   <DividerLine />
 * </Divider>
 * ```
 *
 * @usage
 * - Visually separating parts of a page. Usually used in conjuction with [HStack](./h-stack) or [VStack](./v-stack).
 * - Use `DividerLine` and `DividerLabel` when a layout needs custom composition.
 *
 * @see The {@link https://uds.build/docs/components/divider Divider Docs} for more info
 *
 * @related [Box](https://uds.build/docs/components/box), [HStack](https://uds.build/docs/components/h-stack), [VStack](https://uds.build/docs/components/v-stack)
 */
declare const Divider: _$react.ForwardRefExoticComponent<DividerProps$1 & _$react.RefAttributes<HTMLDivElement>>;
//#endregion
export { Divider, type DividerProps };