@mikeheinrich/adobe-xd-design-system/dist/index.d.ts

Adobe XD-based design system with React components and Tailwind CSS

import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
import * as React from 'react';
import React__default from 'react';
import { VariantProps } from 'class-variance-authority';
import { ClassValue } from 'clsx';

declare const buttonVariants: (props?: ({
    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | "attention" | "button-group" | "button-group-active" | null | undefined;
    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
    asChild?: boolean;
}
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

interface ButtonGroupItem {
    id: string;
    label: React__default.ReactNode;
    icon?: React__default.ReactNode;
}
interface ButtonGroupProps extends React__default.HTMLAttributes<HTMLDivElement> {
    items: ButtonGroupItem[];
    defaultActiveId?: string;
    onTabChange?: (id: string) => void;
}
declare const ButtonGroup: React__default.ForwardRefExoticComponent<ButtonGroupProps & React__default.RefAttributes<HTMLDivElement>>;

declare function cn(...inputs: ClassValue[]): string;

declare const DESIGN_TOKENS: {
    readonly BRAND_COLOR: "#d6002a";
    readonly PRIMARY_ACTION_COLOR: "#006d89";
    readonly PRIMARY_ACTION_HOVER: "#00495b";
    readonly BORDER_RADIUS: "2px";
    readonly COMPONENT_HEIGHT: "30px";
};

export { Button, ButtonGroup, DESIGN_TOKENS, buttonVariants, cn };
export type { ButtonGroupItem, ButtonGroupProps, ButtonProps };