UNPKG

flowbite-react

Version:

Official React components built for Flowbite and Tailwind CSS

70 lines (69 loc) 2.59 kB
import type { ElementType } from "react"; import { type ReactNode } from "react"; import type { PolymorphicComponentPropWithRef } from "../../helpers/generic-as-prop"; import type { DeepPartial } from "../../types"; import type { FlowbiteBoolean, FlowbiteColors, FlowbiteGradientColors, FlowbiteGradientDuoToneColors, FlowbiteSizes } from "../Flowbite"; import type { PositionInButtonGroup } from "./ButtonGroup"; export interface FlowbiteButtonTheme { base: string; fullSized: string; color: FlowbiteColors; disabled: string; isProcessing: string; spinnerSlot: string; spinnerLeftPosition: ButtonSizes; gradient: ButtonGradientColors; gradientDuoTone: ButtonGradientDuoToneColors; inner: FlowbiteButtonInnerTheme; label: string; outline: FlowbiteButtonOutlineTheme; pill: FlowbiteBoolean; size: ButtonSizes; } export interface FlowbiteButtonInnerTheme { base: string; position: PositionInButtonGroup; outline: string; isProcessingPadding: ButtonSizes; } export interface FlowbiteButtonOutlineTheme extends FlowbiteBoolean { color: ButtonOutlineColors; pill: FlowbiteBoolean; } export interface ButtonColors extends Pick<FlowbiteColors, "dark" | "failure" | "gray" | "info" | "light" | "purple" | "success" | "warning"> { [key: string]: string; } export interface ButtonGradientColors extends FlowbiteGradientColors { [key: string]: string; } export interface ButtonGradientDuoToneColors extends FlowbiteGradientDuoToneColors { [key: string]: string; } export interface ButtonOutlineColors extends Pick<FlowbiteColors, "gray"> { [key: string]: string; } export interface ButtonSizes extends Pick<FlowbiteSizes, "xs" | "sm" | "lg" | "xl"> { [key: string]: string; } export type ButtonProps<T extends ElementType = "button"> = PolymorphicComponentPropWithRef<T, { href?: string; color?: keyof FlowbiteColors; fullSized?: boolean; gradientDuoTone?: keyof ButtonGradientDuoToneColors; gradientMonochrome?: keyof ButtonGradientColors; target?: string; isProcessing?: boolean; processingLabel?: string; processingSpinner?: ReactNode; label?: ReactNode; outline?: boolean; pill?: boolean; positionInGroup?: keyof PositionInButtonGroup; size?: keyof ButtonSizes; theme?: DeepPartial<FlowbiteButtonTheme>; }>; export declare const Button: (<C extends ElementType = "button">(props: ButtonProps<C>) => JSX.Element) & { displayName?: string | undefined; } & { Group: import("react").FC<import("./ButtonGroup").ButtonGroupProps>; };