dgz-ui/dist/types/ui/button/button.d.ts

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript

import { type VariantProps } from 'class-variance-authority';
/**
 * Button variants generated using class-variance-authority (CVA).
 * Used to define different styles and sizes for the `Button` component.
 *
 * @property {'default' | 'destructive' | 'secondary' | 'tertiary' | 'ghost'} variant - Controls visual appearance.
 * @property {'lg' | 'default' | 'sm' | 'xs' | 'icon'} size - Controls the height, padding, and font size of the button.
 */
export declare const buttonVariants: (props?: ({
    variant?: "default" | "destructive" | "secondary" | "tertiary" | "ghost" | null | undefined;
    size?: "default" | "lg" | "sm" | "xs" | "icon" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
 * Props for the Button component.
 * Extends the native HTML button attributes and supports CVA variant props.
 *
 * @property {boolean} [asChild=false] - If true, renders as a child component (useful for Radix Slot integration).
 */
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
    asChild?: boolean;
}
/**
 * Button is a customizable and accessible component used for user actions.
 * It supports multiple visual variants and sizes, and can be rendered as a different element using `asChild`.
 *
 * @component
 * @param {ButtonProps} props - Button props to control appearance and behavior.
 * @param {string} [props.className] - Additional Tailwind CSS classes.
 * @param {'default' | 'destructive' | 'secondary' | 'tertiary' | 'ghost'} [props.variant] - Style variant.
 * @param {'lg' | 'default' | 'sm' | 'xs' | 'icon'} [props.size] - Button size.
 * @param {boolean} [props.asChild=false] - Whether to use `Slot` instead of `button` element.
 * @param {React.Ref<HTMLButtonElement>} ref - Forwarded ref for DOM access.
 * @returns {JSX.Element} Rendered button element.
 *
 * @example
 * ```tsx
 * <Button variant="destructive" size="sm">Delete</Button>
 * <Button asChild><a href="/next-step">Continue</a></Button>
 * ```
 */
export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
//# sourceMappingURL=button.d.ts.map