@navinc/base-react-components/dist/wayfinder/button/button.d.ts

Nav's Pattern Library

import React from 'react';
import { VariantProps } from 'class-variance-authority';
/** Responsible for wrapping all button text to properly underline on hover for the plain variants */
export declare const ButtonTextContainer: React.ComponentType<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
declare const buttonVariants: (props?: ({
    variant?: "primary" | "prime" | "default" | "plain" | "primaryPlain" | "primaryCritical" | null | undefined;
    density?: "loose" | "standard" | "tight" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
export type Variant = NonNullable<VariantProps<typeof buttonVariants>['variant']>;
export type Density = NonNullable<VariantProps<typeof buttonVariants>['density']>;
/**
 * Wayfinder Button
 *
 * @example `asChild` prop renders the button as the immediate child of the button element.
 *
 * ```tsx
 * <Button asChild>
 *  <a href="https://nav.com" target="_blank" rel="noreferrer">
 *   Link Rendered as a Button
 *  </a>
 * </Button>
 * ```
 * This results in the following HTML:
 * ```html
 * <a class="button-classes" href="https://nav.com" target="_blank" rel="noreferrer">
 *  Link Rendered as a Button
 * </a>
 * ```
 *
 * @caveat text children of the button will be wrapped in a `ButtonTextContainer` component to properly underline on hover
 * for the plain variants.  If any children are not text, they will not be wrapped automatically and no underline will
 * be present.
 */
export declare const Button: React.ForwardRefExoticComponent<VariantProps<(props?: ({
    variant?: "primary" | "prime" | "default" | "plain" | "primaryPlain" | "primaryCritical" | null | undefined;
    density?: "loose" | "standard" | "tight" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
    loading?: boolean;
    asChild?: boolean;
} & React.RefAttributes<HTMLButtonElement>>;
export declare const ButtonInheritColor: React.ComponentType<VariantProps<(props?: ({
    variant?: "primary" | "prime" | "default" | "plain" | "primaryPlain" | "primaryCritical" | null | undefined;
    density?: "loose" | "standard" | "tight" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
    loading?: boolean;
    asChild?: boolean;
} & React.RefAttributes<HTMLButtonElement>>;
export {};