@spaced-out/ui-design-system/lib/components/Button/Button.d.ts

Sense UI components library

import * as React from 'react';
import type { Flow } from 'flow-to-typescript-codemod';
import type { IconType } from '../Icon';
type ClassNames = Readonly<{
    wrapper?: string;
    icon?: string;
    text?: string;
}>;
/**
 * Note(Nishant): Although Button supports gradient as a type, its not currently customizable really.
 * This only supports pre-defined gradient that moves from left to right.
 * If someone wants to add more gradients, the expectation is that they would add it through a wrapper className.
 *
 * We could have taken an extra prop to take in the Gradient colors but that should not be encouraged
 * as it would add an additional overhead on the component to figure out exact color values from string tokens
 * and since this is rarely used type anyway, it should be avoided.
 */
export declare const BUTTON_TYPES: Readonly<{
    primary: "primary";
    secondary: "secondary";
    tertiary: "tertiary";
    ghost: "ghost";
    danger: "danger";
    gradient: "gradient";
}>;
export declare const BUTTON_ACTION_TYPE: Readonly<{
    button: "button";
    submit: "submit";
    reset: "reset";
}>;
export declare const BUTTON_SIZE: Readonly<{
    small: "small";
    medium: "medium";
}>;
export type ButtonType = (typeof BUTTON_TYPES)[keyof typeof BUTTON_TYPES];
export type ButtonActionType = (typeof BUTTON_ACTION_TYPE)[keyof typeof BUTTON_ACTION_TYPE];
export type ButtonSize = keyof typeof BUTTON_SIZE;
export type BaseButtonProps = {
    children?: React.ReactNode;
    disabled?: unknown;
    actionType?: ButtonActionType;
    onClick?: ((arg1: React.SyntheticEvent<HTMLElement>) => unknown) | null | undefined;
    ariaLabel?: string;
    tabIndex?: number;
    isLoading?: boolean;
    role?: string;
};
export type UnstyledButtonProps = BaseButtonProps & {
    className?: string;
};
export type ButtonProps = BaseButtonProps & {
    classNames?: ClassNames;
    iconLeftName?: string;
    iconLeftType?: IconType;
    iconRightName?: string;
    iconRightType?: IconType;
    type?: ButtonType;
    isFluid?: boolean;
    size?: ButtonSize;
};
export declare const UnstyledButton: Flow.AbstractComponent<UnstyledButtonProps, HTMLButtonElement>;
export declare const Button: Flow.AbstractComponent<ButtonProps, HTMLButtonElement>;
export {};
//# sourceMappingURL=Button.d.ts.map