@f0rbit/ui 0.1.2

package/dist/index.d.ts

@@ -0,0 +1,217 @@
+import { JSX } from 'solid-js';
+
+type ButtonVariant = "primary" | "secondary" | "ghost" | "danger";
+type ButtonSize = "sm" | "md" | "lg";
+interface ButtonProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    icon?: boolean;
+    label?: string;
+    loading?: boolean;
+}
+declare function Button(props: ButtonProps): JSX.Element;
+
+type BadgeVariant = "default" | "success" | "error" | "warning" | "info" | "accent";
+interface BadgeProps extends JSX.HTMLAttributes<HTMLSpanElement> {
+    variant?: BadgeVariant;
+}
+declare function Badge(props: BadgeProps): JSX.Element;
+
+interface CardProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    interactive?: boolean;
+}
+interface CardHeaderProps extends JSX.HTMLAttributes<HTMLDivElement> {
+}
+interface CardTitleProps extends JSX.HTMLAttributes<HTMLHeadingElement> {
+}
+interface CardDescriptionProps extends JSX.HTMLAttributes<HTMLParagraphElement> {
+}
+interface CardContentProps extends JSX.HTMLAttributes<HTMLDivElement> {
+}
+interface CardFooterProps extends JSX.HTMLAttributes<HTMLDivElement> {
+}
+declare function Card(props: CardProps): JSX.Element;
+declare function CardHeader(props: CardHeaderProps): JSX.Element;
+declare function CardTitle(props: CardTitleProps): JSX.Element;
+declare function CardDescription(props: CardDescriptionProps): JSX.Element;
+declare function CardContent(props: CardContentProps): JSX.Element;
+declare function CardFooter(props: CardFooterProps): JSX.Element;
+
+interface InputProps extends JSX.InputHTMLAttributes<HTMLInputElement> {
+    error?: boolean;
+}
+interface TextareaProps extends JSX.TextareaHTMLAttributes<HTMLTextAreaElement> {
+    error?: boolean;
+}
+interface SelectProps extends JSX.SelectHTMLAttributes<HTMLSelectElement> {
+    error?: boolean;
+}
+declare function Input(props: InputProps): JSX.Element;
+declare function Textarea(props: TextareaProps): JSX.Element;
+declare function Select(props: SelectProps): JSX.Element;
+
+type StatusState = "active" | "inactive" | "error" | "pending";
+interface StatusProps extends JSX.HTMLAttributes<HTMLSpanElement> {
+    state: StatusState;
+    label?: string;
+}
+declare function Status(props: StatusProps): JSX.Element;
+
+type StatProps = {
+    value: string | number;
+    label: string;
+} & Omit<JSX.HTMLAttributes<HTMLDivElement>, "children">;
+declare function Stat(props: StatProps): JSX.Element;
+
+type SpinnerSize = "sm" | "md" | "lg";
+interface SpinnerProps extends JSX.HTMLAttributes<HTMLSpanElement> {
+    size?: SpinnerSize;
+}
+declare function Spinner(props: SpinnerProps): JSX.Element;
+
+type ChevronFacing = "right" | "down";
+interface ChevronProps extends JSX.SvgSVGAttributes<SVGSVGElement> {
+    expanded?: boolean;
+    /** Which way the chevron points. Default: "right" */
+    facing?: ChevronFacing;
+    size?: number | string;
+}
+declare function Chevron(props: ChevronProps): JSX.Element;
+
+type EmptyProps = {
+    icon?: JSX.Element;
+    title?: string;
+    description?: string;
+    children?: JSX.Element;
+};
+declare function Empty(props: EmptyProps): JSX.Element;
+
+interface ModalProps extends JSX.DialogHtmlAttributes<HTMLDialogElement> {
+    open: boolean;
+    onClose: () => void;
+}
+interface ModalHeaderProps extends JSX.HTMLAttributes<HTMLDivElement> {
+}
+interface ModalTitleProps extends JSX.HTMLAttributes<HTMLHeadingElement> {
+}
+interface ModalBodyProps extends JSX.HTMLAttributes<HTMLDivElement> {
+}
+interface ModalFooterProps extends JSX.HTMLAttributes<HTMLDivElement> {
+}
+declare function Modal(props: ModalProps): JSX.Element;
+declare function ModalHeader(props: ModalHeaderProps): JSX.Element;
+declare function ModalTitle(props: ModalTitleProps): JSX.Element;
+declare function ModalBody(props: ModalBodyProps): JSX.Element;
+declare function ModalFooter(props: ModalFooterProps): JSX.Element;
+
+interface DropdownProps {
+    children: JSX.Element;
+}
+interface DropdownTriggerProps {
+    children: JSX.Element;
+}
+interface DropdownMenuProps {
+    children: JSX.Element;
+}
+interface DropdownItemProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
+    onClick?: () => void;
+    active?: boolean;
+    children: JSX.Element;
+}
+declare function Dropdown(props: DropdownProps): JSX.Element;
+declare function DropdownTrigger(props: DropdownTriggerProps): JSX.Element;
+declare function DropdownMenu(props: DropdownMenuProps): JSX.Element;
+declare function DropdownItem(props: DropdownItemProps): JSX.Element;
+declare function DropdownDivider(): JSX.Element;
+
+interface ClampProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    lines?: number;
+    showMoreText?: string;
+    showLessText?: string;
+}
+declare function Clamp(props: ClampProps): JSX.Element;
+
+interface CollapsibleProps {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: JSX.Element;
+    trigger: JSX.Element | string;
+}
+declare function Collapsible(props: CollapsibleProps): JSX.Element;
+
+type StepStatus = "completed" | "current" | "upcoming";
+interface StepperProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    orientation?: "horizontal" | "vertical";
+    children: JSX.Element;
+}
+interface StepProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    title: string;
+    description?: string;
+    icon?: JSX.Element;
+    status?: StepStatus;
+}
+declare function Step(props: StepProps): JSX.Element;
+declare function Stepper(props: StepperProps): JSX.Element;
+
+interface TabsProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    defaultValue?: string;
+    value?: string;
+    onValueChange?: (value: string) => void;
+    children: JSX.Element;
+}
+interface TabListProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    children: JSX.Element;
+}
+interface TabProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
+    value: string;
+    children: JSX.Element;
+}
+interface TabPanelProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    value: string;
+    children: JSX.Element;
+}
+declare function Tabs(props: TabsProps): JSX.Element;
+declare function TabList(props: TabListProps): JSX.Element;
+declare function Tab(props: TabProps): JSX.Element;
+declare function TabPanel(props: TabPanelProps): JSX.Element;
+
+interface CheckboxProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, "type"> {
+    label?: string;
+    description?: string;
+    indeterminate?: boolean;
+}
+declare function Checkbox(props: CheckboxProps): JSX.Element;
+
+interface ToggleProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
+    label?: string;
+    description?: string;
+    size?: "sm" | "md";
+}
+declare function Toggle(props: ToggleProps): JSX.Element;
+
+interface FormFieldProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    label: string;
+    error?: string;
+    description?: string;
+    required?: boolean;
+    children: JSX.Element;
+    id?: string;
+}
+declare function FormField(props: FormFieldProps): JSX.Element;
+
+type TimelineItemVariant = "default" | "success" | "error" | "warning" | "info";
+interface TimelineItem {
+    id: string | number;
+    icon?: JSX.Element;
+    title: string | JSX.Element;
+    description?: string | JSX.Element;
+    timestamp?: string | JSX.Element;
+    variant?: TimelineItemVariant;
+}
+interface TimelineProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    items: TimelineItem[];
+}
+declare function Timeline(props: TimelineProps): JSX.Element;
+
+export { Badge, type BadgeProps, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, Chevron, type ChevronFacing, type ChevronProps, Clamp, type ClampProps, Collapsible, type CollapsibleProps, Dropdown, DropdownDivider, DropdownItem, type DropdownItemProps, DropdownMenu, type DropdownMenuProps, type DropdownProps, DropdownTrigger, type DropdownTriggerProps, Empty, type EmptyProps, FormField, type FormFieldProps, Input, type InputProps, Modal, ModalBody, ModalFooter, ModalHeader, type ModalProps, ModalTitle, Select, type SelectProps, Spinner, type SpinnerProps, type SpinnerSize, Stat, type StatProps, Status, type StatusProps, type StatusState, Step, type StepProps, type StepStatus, Stepper, type StepperProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, Textarea, type TextareaProps, Timeline, type TimelineItem, type TimelineItemVariant, type TimelineProps, Toggle, type ToggleProps };