@usevyre/react 0.1.0

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,53 @@
+/**
+ * @usevyre/react — Input + Field
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Components: Field + Input + Textarea                    │
+ * │ Import:     import { Field, Input, Textarea } from "@usevyre/react" │
+ * │                                                         │
+ * │ Field props:                                            │
+ * │   label    = string                                     │
+ * │   hint     = string (helper text below input)           │
+ * │   state    = "idle"|"error"|"success"|"warning"         │
+ * │   required = boolean                                    │
+ * │                                                         │
+ * │ Input props:                                            │
+ * │   size     = "sm"|"md"(default)|"lg"                    │
+ * │   leftElement  = ReactNode (icon inside input, left)    │
+ * │   rightElement = ReactNode (icon inside input, right)   │
+ * │   + all native <input> props                            │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * // Basic field with validation
+ * <Field label="Email" state="error" hint="Invalid email format">
+ *   <Input type="email" placeholder="you@example.com" />
+ * </Field>
+ *
+ * // Input with icon
+ * <Field label="Search">
+ *   <Input leftElement={<SearchIcon />} placeholder="Search..." />
+ * </Field>
+ */
+import React from "react";
+import type { FieldState, Size, BaseProps } from "../../types";
+export interface FieldProps extends React.HTMLAttributes<HTMLDivElement>, BaseProps {
+    label?: string;
+    hint?: string;
+    state?: FieldState;
+    required?: boolean;
+    htmlFor?: string;
+}
+export declare const Field: React.ForwardRefExoticComponent<FieldProps & React.RefAttributes<HTMLDivElement>>;
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">, BaseProps {
+    size?: Exclude<Size, "icon">;
+    leftElement?: React.ReactNode;
+    rightElement?: React.ReactNode;
+}
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, BaseProps {
+    size?: Exclude<Size, "icon">;
+    resize?: "none" | "vertical" | "horizontal" | "both";
+}
+export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/components/Label/Label.d.ts

@@ -0,0 +1,16 @@
+/**
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────┐
+ * │ Component:  Label                           │
+ * │ htmlFor    = string (links to input id)     │
+ * │ required   = boolean                        │
+ * │ disabled   = boolean                        │
+ * │ CSS class:  .vyre-label                     │
+ * └─────────────────────────────────────────────┘
+ */
+import React from "react";
+export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
+    required?: boolean;
+    disabled?: boolean;
+}
+export declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;

package/dist/components/Modal/Modal.d.ts

@@ -0,0 +1,59 @@
+/**
+ * @usevyre/react — Modal / Dialog
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Components: Modal + ModalHeader + ModalBody + ModalFooter│
+ * │ Import:     import { Modal, ModalHeader, ModalBody,     │
+ * │             ModalFooter } from "@usevyre/react"            │
+ * │                                                         │
+ * │ Modal props:                                            │
+ * │   open             = boolean (controlled)               │
+ * │   onClose          = () => void                         │
+ * │   size             = "sm"|"md"(default)|"lg"|"full"     │
+ * │   closeOnBackdrop  = boolean (default: true)            │
+ * │   closeOnEsc       = boolean (default: true)            │
+ * │   initialFocus     = RefObject<HTMLElement>             │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * // Confirmation dialog
+ * <Modal open={isOpen} onClose={() => setIsOpen(false)} size="sm">
+ *   <ModalHeader>
+ *     <h2>Confirm deletion</h2>
+ *   </ModalHeader>
+ *   <ModalBody>
+ *     <p>This action cannot be undone.</p>
+ *   </ModalBody>
+ *   <ModalFooter>
+ *     <Button variant="ghost" onClick={() => setIsOpen(false)}>Cancel</Button>
+ *     <Button variant="danger" onClick={handleDelete}>Delete</Button>
+ *   </ModalFooter>
+ * </Modal>
+ */
+import React from "react";
+import type { BaseProps } from "../../types";
+export type ModalSize = "sm" | "md" | "lg" | "full";
+export interface ModalProps extends BaseProps {
+    open: boolean;
+    onClose: () => void;
+    size?: ModalSize;
+    /** Close modal when clicking the backdrop. Default: true */
+    closeOnBackdrop?: boolean;
+    /** Close modal when pressing Escape. Default: true */
+    closeOnEsc?: boolean;
+    /** Element to focus on open. Defaults to the modal container. */
+    initialFocus?: React.RefObject<HTMLElement>;
+    children?: React.ReactNode;
+    /** Accessible label for the dialog (if no visible title) */
+    "aria-label"?: string;
+    /** ID of the element that labels the dialog */
+    "aria-labelledby"?: string;
+}
+export declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
+export interface ModalSectionProps extends BaseProps {
+    children?: React.ReactNode;
+}
+export declare const ModalHeader: React.ForwardRefExoticComponent<ModalSectionProps & React.RefAttributes<HTMLDivElement>>;
+export declare const ModalBody: React.ForwardRefExoticComponent<ModalSectionProps & React.RefAttributes<HTMLDivElement>>;
+export declare const ModalFooter: React.ForwardRefExoticComponent<ModalSectionProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,45 @@
+/**
+ * @usevyre/react — Pagination
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Component:  Pagination                                  │
+ * │ Import:     import { Pagination } from "@usevyre/react"    │
+ * │                                                         │
+ * │ Props:                                                  │
+ * │   page         = number (current page, 1-indexed)       │
+ * │   totalPages   = number                                 │
+ * │   onPageChange = (page: number) => void                 │
+ * │   siblings     = number (pages shown each side, default 1)│
+ * │   showEdges    = boolean (show first/last, default true) │
+ * │   totalItems   = number (total records, enables info)   │
+ * │   pageSize     = number (records per page, enables info)│
+ * │   showInfo     = boolean (show "Showing x–y of z")      │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * <Pagination
+ *   page={currentPage}
+ *   totalPages={20}
+ *   onPageChange={setCurrentPage}
+ * />
+ *
+ * // With info label
+ * <Pagination
+ *   page={2} totalPages={10} onPageChange={setPage}
+ *   showInfo totalItems={98} pageSize={10}
+ * />
+ */
+import React from "react";
+export interface PaginationProps {
+    page: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+    siblings?: number;
+    showEdges?: boolean;
+    showInfo?: boolean;
+    totalItems?: number;
+    pageSize?: number;
+    className?: string;
+}
+export declare const Pagination: React.FC<PaginationProps>;

package/dist/components/Popover/Popover.d.ts

@@ -0,0 +1,46 @@
+/**
+ * @usevyre/react — Popover
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Component:  Popover                                     │
+ * │ Import:     import { Popover } from "@usevyre/react"       │
+ * │                                                         │
+ * │ Props:                                                  │
+ * │   open           = boolean (controlled)                 │
+ * │   onOpenChange   = (open: boolean) => void              │
+ * │   placement      = "bottom"(default)                    │
+ * │                    side: "top"|"bottom"|"left"|"right"  │
+ * │                    align: "-start"?|""?|"-end"?         │
+ * │                    e.g. "top-start", "bottom-end",      │
+ * │                         "left", "right-start"           │
+ * │   trigger        = ReactElement (the anchor element)    │
+ * │   children       = ReactNode (popover content)          │
+ * │   closeOnOutside = boolean (default: true)              │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * // Controlled
+ * <Popover open={open} onOpenChange={setOpen} trigger={<Button>Open</Button>}>
+ *   <p>Content here.</p>
+ * </Popover>
+ *
+ * // Uncontrolled
+ * <Popover placement="bottom-start" trigger={<Button>Open</Button>}>
+ *   <p>Content here.</p>
+ * </Popover>
+ */
+import React from "react";
+export type PopoverSide = "top" | "bottom" | "left" | "right";
+export type PopoverAlign = "start" | "center" | "end";
+export type PopoverPlacement = "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+export interface PopoverProps {
+    trigger: React.ReactElement;
+    children: React.ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    placement?: PopoverPlacement;
+    closeOnOutside?: boolean;
+    className?: string;
+}
+export declare const Popover: React.FC<PopoverProps>;

package/dist/components/Progress/Progress.d.ts

@@ -0,0 +1,21 @@
+/**
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────┐
+ * │ Component:  Progress                        │
+ * │ value       = number (0-100)                │
+ * │ max         = number (default: 100)         │
+ * │ indeterminate = boolean                     │
+ * │ size        = "sm"|"md"(default)|"lg"       │
+ * │ variant     = "default"|"accent"|"teal"|"success"|"danger" │
+ * │ CSS class:  .vyre-progress                  │
+ * └─────────────────────────────────────────────┘
+ */
+import React from "react";
+export interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {
+    value?: number;
+    max?: number;
+    indeterminate?: boolean;
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "accent" | "teal" | "success" | "danger";
+}
+export declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,55 @@
+/**
+ * @usevyre/react — Select / Dropdown
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Component:  Select                                      │
+ * │ Import:     import { Select } from "@usevyre/react"        │
+ * │                                                         │
+ * │ Props:                                                  │
+ * │   options     = { value: string; label: string;         │
+ * │                   disabled?: boolean }[]                │
+ * │   value       = string (controlled)                     │
+ * │   defaultValue = string (uncontrolled)                  │
+ * │   onChange    = (value: string) => void                 │
+ * │   placeholder = string                                  │
+ * │   disabled    = boolean                                 │
+ * │   size        = "sm"|"md"(default)|"lg"                 │
+ * │   + all native <div> props                              │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * // Controlled
+ * <Select
+ *   options={[
+ *     { value: "react", label: "React" },
+ *     { value: "vue",   label: "Vue" },
+ *   ]}
+ *   value={framework}
+ *   onChange={setFramework}
+ *   placeholder="Select framework"
+ * />
+ *
+ * // Inside a Field
+ * <Field label="Framework" state="error" hint="Required">
+ *   <Select options={options} value={val} onChange={setVal} />
+ * </Field>
+ */
+import React from "react";
+import type { BaseProps } from "../../types";
+export interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+export type SelectSize = "sm" | "md" | "lg";
+export interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange">, BaseProps {
+    options: SelectOption[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    size?: SelectSize;
+}
+export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Separator/Separator.d.ts

@@ -0,0 +1,16 @@
+/**
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────┐
+ * │ Component:  Separator                       │
+ * │ orientation = "horizontal"(default)|"vertical" │
+ * │ decorative  = boolean (default: true)       │
+ * │ CSS class:  .vyre-separator                 │
+ * └─────────────────────────────────────────────┘
+ */
+import React from "react";
+export interface SeparatorProps {
+    orientation?: "horizontal" | "vertical";
+    decorative?: boolean;
+    className?: string;
+}
+export declare const Separator: React.ForwardRefExoticComponent<SeparatorProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Sheet/Sheet.d.ts

@@ -0,0 +1,54 @@
+/**
+ * @usevyre/react — Sheet
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Components: Sheet + SheetHeader + SheetBody + SheetFooter│
+ * │ Import:     import { Sheet, SheetHeader, SheetBody,     │
+ * │             SheetFooter } from "@usevyre/react"            │
+ * │                                                         │
+ * │ Sheet props:                                            │
+ * │   open            = boolean (controlled)                │
+ * │   onClose         = () => void                          │
+ * │   side            = "right"(default)|"left"|"top"|"bottom"│
+ * │   size            = "sm"|"md"(default)|"lg"|"full"      │
+ * │   closeOnBackdrop = boolean (default: true)             │
+ * │   closeOnEsc      = boolean (default: true)             │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * <Sheet open={open} onClose={() => setOpen(false)} side="right">
+ *   <SheetHeader>
+ *     <h2>Settings</h2>
+ *   </SheetHeader>
+ *   <SheetBody>
+ *     <p>Sheet content goes here.</p>
+ *   </SheetBody>
+ *   <SheetFooter>
+ *     <Button variant="ghost" onClick={() => setOpen(false)}>Cancel</Button>
+ *     <Button variant="accent" onClick={handleSave}>Save</Button>
+ *   </SheetFooter>
+ * </Sheet>
+ */
+import React from "react";
+import type { BaseProps } from "../../types";
+export type SheetSide = "top" | "right" | "bottom" | "left";
+export type SheetSize = "sm" | "md" | "lg" | "full";
+export interface SheetProps extends BaseProps {
+    open: boolean;
+    onClose: () => void;
+    side?: SheetSide;
+    size?: SheetSize;
+    closeOnBackdrop?: boolean;
+    closeOnEsc?: boolean;
+    children?: React.ReactNode;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+}
+export declare const Sheet: React.ForwardRefExoticComponent<SheetProps & React.RefAttributes<HTMLDivElement>>;
+export interface SheetSectionProps extends BaseProps {
+    children?: React.ReactNode;
+}
+export declare const SheetHeader: React.ForwardRefExoticComponent<SheetSectionProps & React.RefAttributes<HTMLDivElement>>;
+export declare const SheetBody: React.ForwardRefExoticComponent<SheetSectionProps & React.RefAttributes<HTMLDivElement>>;
+export declare const SheetFooter: React.ForwardRefExoticComponent<SheetSectionProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Sidebar/Sidebar.d.ts

@@ -0,0 +1,140 @@
+/**
+ * @usevyre/react — Sidebar & App Layout
+ *
+ * AI CONTEXT:
+ * ┌──────────────────────────────────────────────────────────────┐
+ * │ Layout hierarchy:                                            │
+ * │                                                              │
+ * │ AppLayout              — root, manages collapsed state       │
+ * │ ├── Sidebar            — left column                        │
+ * │ │   ├── SidebarHeader  — logo + app name                    │
+ * │ │   ├── SidebarContent — scrollable nav area                │
+ * │ │   │   └── SidebarSection → SidebarItem                   │
+ * │ │   └── SidebarFooter  — pinned bottom area                 │
+ * │ └── AppShell           — right column (flex: 1)             │
+ * │     ├── AppBar         — optional top bar                   │
+ * │     │   └── SidebarTrigger — collapse toggle button         │
+ * │     └── PageContent    — scrollable page content            │
+ * │                                                              │
+ * │ Import: import { AppLayout, AppShell, AppBar,               │
+ * │           PageContent, SidebarTrigger,                      │
+ * │           Sidebar, SidebarHeader, SidebarContent,           │
+ * │           SidebarSection, SidebarItem, SidebarFooter }      │
+ * │         from "@usevyre/react"                                  │
+ * │                                                              │
+ * │ AppLayout props:                                             │
+ * │   defaultCollapsed = boolean (uncontrolled default)         │
+ * │   collapsed  = boolean (controlled)                         │
+ * │   onCollapsedChange = (v: boolean) => void                  │
+ * │   className = string                                        │
+ * │                                                              │
+ * │ Sidebar props:                                               │
+ * │   variant = "default" | "floating"                          │
+ * │   className = string                                        │
+ * │                                                              │
+ * │ SidebarItem props:                                           │
+ * │   active  = boolean                                         │
+ * │   icon    = ReactNode                                       │
+ * │   badge   = string | number                                 │
+ * │   href    = string                                          │
+ * │   onClick = () => void                                      │
+ * └──────────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * <AppLayout>
+ *   <Sidebar>
+ *     <SidebarHeader title="Workspace" logo={<AppLogo />} />
+ *     <SidebarContent>
+ *       <SidebarSection label="Main">
+ *         <SidebarItem icon={<HomeIcon />} active href="/">Dashboard</SidebarItem>
+ *         <SidebarItem icon={<UsersIcon />} href="/users">Users</SidebarItem>
+ *       </SidebarSection>
+ *     </SidebarContent>
+ *     <SidebarFooter>
+ *       <SidebarItem icon={<SettingsIcon />} href="/settings">Settings</SidebarItem>
+ *     </SidebarFooter>
+ *   </Sidebar>
+ *   <AppShell>
+ *     <AppBar>
+ *       <SidebarTrigger />
+ *       <Breadcrumb>...</Breadcrumb>
+ *     </AppBar>
+ *     <PageContent>
+ *       <h1>Dashboard</h1>
+ *     </PageContent>
+ *   </AppShell>
+ * </AppLayout>
+ */
+import React from "react";
+interface AppLayoutCtx {
+    collapsed: boolean;
+    toggleCollapsed: () => void;
+}
+export declare const useAppLayout: () => AppLayoutCtx;
+export interface AppLayoutProps {
+    defaultCollapsed?: boolean;
+    collapsed?: boolean;
+    onCollapsedChange?: (v: boolean) => void;
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const AppLayout: React.ForwardRefExoticComponent<AppLayoutProps & React.RefAttributes<HTMLDivElement>>;
+export interface SidebarProps {
+    variant?: "default" | "floating";
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const Sidebar: React.ForwardRefExoticComponent<SidebarProps & React.RefAttributes<HTMLElement>>;
+export interface SidebarHeaderProps {
+    logo?: React.ReactNode;
+    title?: string;
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const SidebarHeader: React.ForwardRefExoticComponent<SidebarHeaderProps & React.RefAttributes<HTMLDivElement>>;
+export interface SidebarContentProps {
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const SidebarContent: React.ForwardRefExoticComponent<SidebarContentProps & React.RefAttributes<HTMLDivElement>>;
+export interface SidebarSectionProps {
+    label?: string;
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const SidebarSection: React.ForwardRefExoticComponent<SidebarSectionProps & React.RefAttributes<HTMLDivElement>>;
+export interface SidebarItemProps {
+    active?: boolean;
+    icon?: React.ReactNode;
+    badge?: string | number;
+    href?: string;
+    onClick?: () => void;
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const SidebarItem: React.FC<SidebarItemProps>;
+export interface SidebarFooterProps {
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const SidebarFooter: React.ForwardRefExoticComponent<SidebarFooterProps & React.RefAttributes<HTMLDivElement>>;
+export interface AppShellProps {
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const AppShell: React.ForwardRefExoticComponent<AppShellProps & React.RefAttributes<HTMLDivElement>>;
+export interface AppBarProps {
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const AppBar: React.ForwardRefExoticComponent<AppBarProps & React.RefAttributes<HTMLElement>>;
+export interface SidebarTriggerProps {
+    className?: string;
+}
+export declare const SidebarTrigger: React.FC<SidebarTriggerProps>;
+export interface PageContentProps {
+    className?: string;
+    children?: React.ReactNode;
+}
+export declare const PageContent: React.ForwardRefExoticComponent<PageContentProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/Skeleton/Skeleton.d.ts

@@ -0,0 +1,17 @@
+/**
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────┐
+ * │ Component:  Skeleton                        │
+ * │ variant = "text"|"circle"|"rect"(default)   │
+ * │ width   = string | number                   │
+ * │ height  = string | number                   │
+ * │ CSS class:  .vyre-skeleton                  │
+ * └─────────────────────────────────────────────┘
+ */
+import React from "react";
+export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: "rect" | "circle" | "text";
+    width?: string | number;
+    height?: string | number;
+}
+export declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Slider/Slider.d.ts

@@ -0,0 +1,26 @@
+/**
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────┐
+ * │ Component:  Slider                          │
+ * │ value        = number                       │
+ * │ defaultValue = number (default: 0)          │
+ * │ min          = number (default: 0)          │
+ * │ max          = number (default: 100)        │
+ * │ step         = number (default: 1)          │
+ * │ onValueChange = (value: number) => void     │
+ * │ disabled     = boolean                      │
+ * │ size         = "sm"|"md"(default)           │
+ * │ CSS class:  .vyre-slider                    │
+ * └─────────────────────────────────────────────┘
+ */
+import React from "react";
+export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "defaultValue" | "size"> {
+    value?: number;
+    defaultValue?: number;
+    min?: number;
+    max?: number;
+    step?: number;
+    onValueChange?: (value: number) => void;
+    size?: "sm" | "md";
+}
+export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Switch/Switch.d.ts

@@ -0,0 +1,21 @@
+/**
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────┐
+ * │ Component:  Switch                          │
+ * │ checked      = boolean                      │
+ * │ defaultChecked = boolean                    │
+ * │ onCheckedChange = (checked: boolean) => void│
+ * │ disabled     = boolean                      │
+ * │ size         = "sm"|"md"(default)           │
+ * │ CSS class:  .vyre-switch                    │
+ * └─────────────────────────────────────────────┘
+ */
+import React from "react";
+export interface SwitchProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    size?: "sm" | "md";
+}
+export declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/Table/Table.d.ts

@@ -0,0 +1,75 @@
+/**
+ * @usevyre/react — Table
+ *
+ * AI CONTEXT:
+ * ┌─────────────────────────────────────────────────────────┐
+ * │ Components: Table + TableHead + TableBody + TableRow +  │
+ * │             TableHeader + TableCell + TableCaption      │
+ * │ Import:     import { Table, TableHead, TableBody,       │
+ * │             TableRow, TableHeader, TableCell,           │
+ * │             TableCaption } from "@usevyre/react"           │
+ * │                                                         │
+ * │ Table props:                                            │
+ * │   striped  = boolean (default: false)                   │
+ * │   bordered = boolean (default: false)                   │
+ * │   compact  = boolean (default: false)                   │
+ * │   hoverable = boolean (default: true)                   │
+ * │                                                         │
+ * │ TableHeader props (th):                                 │
+ * │   sortable    = boolean                                 │
+ * │   sortDir     = "asc"|"desc"|null                       │
+ * │   onSort      = () => void                              │
+ * │   align       = "left"(default)|"center"|"right"        │
+ * │                                                         │
+ * │ TableCell props (td):                                   │
+ * │   align       = "left"(default)|"center"|"right"        │
+ * └─────────────────────────────────────────────────────────┘
+ *
+ * @example
+ * <Table>
+ *   <TableHead>
+ *     <TableRow>
+ *       <TableHeader sortable sortDir="asc" onSort={() => handleSort("name")}>Name</TableHeader>
+ *       <TableHeader>Email</TableHeader>
+ *       <TableHeader align="right">Status</TableHeader>
+ *     </TableRow>
+ *   </TableHead>
+ *   <TableBody>
+ *     {rows.map((row) => (
+ *       <TableRow key={row.id}>
+ *         <TableCell>{row.name}</TableCell>
+ *         <TableCell>{row.email}</TableCell>
+ *         <TableCell align="right"><Badge variant="success">{row.status}</Badge></TableCell>
+ *       </TableRow>
+ *     ))}
+ *   </TableBody>
+ * </Table>
+ */
+import React from "react";
+export interface TableProps {
+    children: React.ReactNode;
+    striped?: boolean;
+    bordered?: boolean;
+    compact?: boolean;
+    hoverable?: boolean;
+    className?: string;
+}
+export declare const Table: React.FC<TableProps>;
+export declare const TableHead: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+export declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+export interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
+    selected?: boolean;
+}
+export declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
+export interface TableHeaderProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
+    sortable?: boolean;
+    sortDir?: "asc" | "desc" | null;
+    onSort?: () => void;
+    align?: "left" | "center" | "right";
+}
+export declare const TableHeader: React.ForwardRefExoticComponent<TableHeaderProps & React.RefAttributes<HTMLTableCellElement>>;
+export interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    align?: "left" | "center" | "right";
+}
+export declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
+export declare const TableCaption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableCaptionElement> & React.RefAttributes<HTMLTableCaptionElement>>;