@velocityuikit/velocityui 0.1.10

package/README.md

@@ -0,0 +1,85 @@
+# @clow99/velocityui
+
+Modern, accessible React UI components with scoped styles and TypeScript support.
+
+## Install
+
+```bash
+npm install @clow99/velocityui
+```
+
+Peer dependencies:
+
+- `react` >= 18
+- `react-dom` >= 18
+
+## Usage
+
+Import the stylesheet once at your app root:
+
+```tsx
+import '@clow99/velocityui/dist/style.css'
+```
+
+Use components in your app:
+
+```tsx
+import { Button, Card, Input, Title } from '@clow99/velocityui'
+
+export function Example() {
+  return (
+    <Card variant="shadow">
+      <Card.Header>
+        <Title level="h2">Welcome</Title>
+      </Card.Header>
+      <Card.Body>
+        <Input label="Email" placeholder="you@example.com" />
+        <Button>Continue</Button>
+      </Card.Body>
+    </Card>
+  )
+}
+```
+
+## Available Exports
+
+The library exports all components from `src/index.ts`, including:
+
+- Form/input: `Input`, `Textarea`, `Select`, `Checkbox`, `RadioGroup`, `Switch`, `Slider`, `NumberInput`, `FileUpload`
+- Layout/content: `Card`, `Title`, `Badge`, `Alert`, `Divider`, `Accordion`, `Tabs`, `Table`
+- Feedback/overlay: `Tooltip`, `Dialog`, `Popover`, `Dropdown`, `Spinner`, `Skeleton`, `Progress`, `ToastProvider`, `useToast`
+- Navigation/misc: `Avatar`, `Tag`, `EmptyState`, `Breadcrumb`, `Pagination`, `Stepper`
+
+## Local Development
+
+From the workspace root:
+
+```bash
+pnpm --filter velocityui build
+```
+
+Build output is written to `dist/`:
+
+- `dist/index.js` (ESM)
+- `dist/index.cjs` (CJS)
+- `dist/index.d.ts` (types)
+- `dist/style.css` (bundled styles)
+
+Watch mode:
+
+```bash
+pnpm --filter velocityui dev
+```
+
+Typecheck:
+
+```bash
+pnpm --filter velocityui lint
+```
+
+Run tests:
+
+```bash
+pnpm --filter velocityui test
+pnpm --filter velocityui test:run
+```

package/dist/components/Accordion/Accordion.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+
+export type AccordionVariant = 'bordered' | 'flush' | 'separated';
+export interface AccordionItem {
+    value: string;
+    title: string;
+    content: React.ReactNode;
+    disabled?: boolean;
+}
+export interface AccordionProps {
+    items: AccordionItem[];
+    defaultValue?: string | string[];
+    value?: string | string[];
+    onChange?: (value: string | string[]) => void;
+    multiple?: boolean;
+    variant?: AccordionVariant;
+}
+export declare const Accordion: React.FC<AccordionProps>;

package/dist/components/Accordion/index.d.ts

@@ -0,0 +1,2 @@
+export { Accordion } from './Accordion';
+export type { AccordionProps, AccordionVariant, AccordionItem } from './Accordion';

package/dist/components/Alert/Alert.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+
+export type AlertVariant = 'info' | 'success' | 'warning' | 'danger';
+export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: AlertVariant;
+    title?: string;
+    icon?: React.ReactNode;
+    onClose?: () => void;
+    children: React.ReactNode;
+}
+export declare const Alert: React.FC<AlertProps>;

package/dist/components/Alert/index.d.ts

@@ -0,0 +1,2 @@
+export { Alert } from './Alert';
+export type { AlertProps, AlertVariant } from './Alert';

package/dist/components/Avatar/Avatar.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+
+export type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type AvatarShape = 'circle' | 'square';
+export type AvatarStatus = 'online' | 'away' | 'offline';
+export interface AvatarProps extends React.HTMLAttributes<HTMLSpanElement> {
+    src?: string;
+    alt?: string;
+    name?: string;
+    size?: AvatarSize;
+    shape?: AvatarShape;
+    status?: AvatarStatus;
+}
+export declare const Avatar: React.FC<AvatarProps>;

package/dist/components/Avatar/index.d.ts

@@ -0,0 +1,2 @@
+export { Avatar } from './Avatar';
+export type { AvatarProps, AvatarSize, AvatarShape, AvatarStatus } from './Avatar';

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+
+export type BadgeVariant = 'default' | 'info' | 'success' | 'warning' | 'danger' | 'primary';
+export type BadgeSize = 'sm' | 'md' | 'lg';
+export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
+    variant?: BadgeVariant;
+    size?: BadgeSize;
+    dot?: boolean;
+    leftIcon?: React.ReactNode;
+    children: React.ReactNode;
+}
+export declare const Badge: React.FC<BadgeProps>;

package/dist/components/Badge/index.d.ts

@@ -0,0 +1,2 @@
+export { Badge } from './Badge';
+export type { BadgeProps, BadgeVariant, BadgeSize } from './Badge';

package/dist/components/Breadcrumb/Breadcrumb.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+
+export interface BreadcrumbItem {
+    label: string;
+    href?: string;
+}
+export interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+    items: BreadcrumbItem[];
+    separator?: React.ReactNode;
+}
+export declare const Breadcrumb: React.FC<BreadcrumbProps>;

package/dist/components/Breadcrumb/index.d.ts

@@ -0,0 +1,2 @@
+export { Breadcrumb } from './Breadcrumb';
+export type { BreadcrumbProps, BreadcrumbItem } from './Breadcrumb';

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+
+export type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger';
+export type ButtonSize = 'sm' | 'md' | 'lg';
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    loading?: boolean;
+    fullWidth?: boolean;
+    leftIcon?: React.ReactNode;
+    rightIcon?: React.ReactNode;
+    children?: React.ReactNode;
+}
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/Button/index.d.ts

@@ -0,0 +1,2 @@
+export { Button } from './Button';
+export type { ButtonProps, ButtonVariant, ButtonSize } from './Button';

package/dist/components/Card/Card.d.ts

@@ -0,0 +1,29 @@
+import { default as React } from 'react';
+
+export type CardVariant = 'bordered' | 'shadow' | 'elevated' | 'ghost';
+export type CardSize = 'sm' | 'md' | 'lg';
+export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: CardVariant;
+    size?: CardSize;
+    hoverable?: boolean;
+    children: React.ReactNode;
+}
+export interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export interface CardBodyProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+declare const CardHeader: React.FC<CardHeaderProps>;
+declare const CardBody: React.FC<CardBodyProps>;
+declare const CardFooter: React.FC<CardFooterProps>;
+interface CardComponent extends React.FC<CardProps> {
+    Header: typeof CardHeader;
+    Body: typeof CardBody;
+    Footer: typeof CardFooter;
+}
+export declare const Card: CardComponent;
+export {};

package/dist/components/Card/index.d.ts

@@ -0,0 +1,2 @@
+export { Card } from './Card';
+export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardVariant, CardSize } from './Card';

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+
+export type CheckboxSize = 'sm' | 'md' | 'lg';
+export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
+    label?: string;
+    description?: string;
+    error?: string;
+    size?: CheckboxSize;
+}
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps, CheckboxSize } from './Checkbox';

package/dist/components/Dialog/Dialog.d.ts

@@ -0,0 +1,32 @@
+import { default as React } from 'react';
+
+export type DialogSize = 'sm' | 'md' | 'lg' | 'xl';
+export interface DialogProps {
+    open: boolean;
+    onClose: () => void;
+    title?: string;
+    description?: string;
+    size?: DialogSize;
+    children?: React.ReactNode;
+    className?: string;
+    closeOnOverlayClick?: boolean;
+}
+export interface DialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export interface DialogBodyProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+declare const DialogHeader: React.FC<DialogHeaderProps>;
+declare const DialogBody: React.FC<DialogBodyProps>;
+declare const DialogFooter: React.FC<DialogFooterProps>;
+interface DialogComponent extends React.FC<DialogProps> {
+    Header: typeof DialogHeader;
+    Body: typeof DialogBody;
+    Footer: typeof DialogFooter;
+}
+export declare const Dialog: DialogComponent;
+export {};

package/dist/components/Dialog/index.d.ts

@@ -0,0 +1,2 @@
+export { Dialog } from './Dialog';
+export type { DialogProps, DialogSize, DialogHeaderProps, DialogBodyProps, DialogFooterProps, } from './Dialog';

package/dist/components/Divider/Divider.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+
+export type DividerOrientation = 'horizontal' | 'vertical';
+export interface DividerProps extends React.HTMLAttributes<HTMLDivElement> {
+    orientation?: DividerOrientation;
+    label?: string;
+}
+export declare const Divider: React.FC<DividerProps>;

package/dist/components/Divider/index.d.ts

@@ -0,0 +1,2 @@
+export { Divider } from './Divider';
+export type { DividerProps, DividerOrientation } from './Divider';

package/dist/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,26 @@
+import { default as React } from 'react';
+
+export type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
+type DropdownActionItem = {
+    label: string;
+    icon?: React.ReactNode;
+    onClick?: () => void;
+    disabled?: boolean;
+    separator?: false;
+};
+type DropdownSeparatorItem = {
+    separator: true;
+    label?: never;
+    icon?: never;
+    onClick?: never;
+    disabled?: never;
+};
+export type DropdownItem = DropdownActionItem | DropdownSeparatorItem;
+export interface DropdownProps {
+    trigger: React.ReactNode;
+    items: DropdownItem[];
+    placement?: DropdownPlacement;
+    className?: string;
+}
+export declare const Dropdown: React.FC<DropdownProps>;
+export {};

package/dist/components/Dropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { Dropdown } from './Dropdown';
+export type { DropdownProps, DropdownItem, DropdownPlacement } from './Dropdown';

package/dist/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+
+export interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {
+    icon?: React.ReactNode;
+    title: string;
+    description?: string;
+    action?: React.ReactNode;
+}
+export declare const EmptyState: React.FC<EmptyStateProps>;

package/dist/components/EmptyState/index.d.ts

@@ -0,0 +1,2 @@
+export { EmptyState } from './EmptyState';
+export type { EmptyStateProps } from './EmptyState';

package/dist/components/FileUpload/FileUpload.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+
+export interface FileUploadProps {
+    accept?: string;
+    multiple?: boolean;
+    maxSize?: number;
+    onChange?: (files: File[]) => void;
+    label?: string;
+    hint?: string;
+    error?: string;
+    disabled?: boolean;
+    className?: string;
+    id?: string;
+}
+export declare const FileUpload: React.FC<FileUploadProps>;

package/dist/components/FileUpload/index.d.ts

@@ -0,0 +1,2 @@
+export { FileUpload } from './FileUpload';
+export type { FileUploadProps } from './FileUpload';

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

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+
+export type InputSize = 'sm' | 'md' | 'lg';
+export type InputIconPosition = 'left' | 'right';
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    label?: string;
+    size?: InputSize;
+    error?: string;
+    hint?: string;
+    leftIcon?: React.ReactNode;
+    rightIcon?: React.ReactNode;
+    search?: boolean;
+    searchIcon?: React.ReactNode;
+    searchIconPosition?: InputIconPosition;
+    leftIconClassName?: string;
+    rightIconClassName?: string;
+    required?: boolean;
+    fullWidth?: boolean;
+    floatingLabel?: boolean;
+}
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,2 @@
+export { Input } from './Input';
+export type { InputProps, InputSize, InputIconPosition } from './Input';

package/dist/components/NumberInput/NumberInput.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+
+export type NumberInputSize = 'sm' | 'md' | 'lg';
+export interface NumberInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'onChange'> {
+    value?: number;
+    onChange?: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    label?: string;
+    error?: string;
+    hint?: string;
+    size?: NumberInputSize;
+}
+export declare const NumberInput: React.FC<NumberInputProps>;

package/dist/components/NumberInput/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberInput } from './NumberInput';
+export type { NumberInputProps, NumberInputSize } from './NumberInput';

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

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+
+export interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> {
+    page: number;
+    totalPages: number;
+    onChange: (page: number) => void;
+    siblingCount?: number;
+    showFirstLast?: boolean;
+}
+export declare const Pagination: React.FC<PaginationProps>;

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

@@ -0,0 +1,2 @@
+export { Pagination } from './Pagination';
+export type { PaginationProps } from './Pagination';

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

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+
+export type PopoverPlacement = 'top' | 'bottom' | 'left' | 'right';
+export interface PopoverProps {
+    trigger: React.ReactNode;
+    content: React.ReactNode;
+    placement?: PopoverPlacement;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    className?: string;
+}
+export declare const Popover: React.FC<PopoverProps>;

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

@@ -0,0 +1,2 @@
+export { Popover } from './Popover';
+export type { PopoverProps, PopoverPlacement } from './Popover';

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

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+
+export type ProgressVariant = 'primary' | 'success' | 'warning' | 'danger';
+export type ProgressSize = 'sm' | 'md' | 'lg';
+export interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {
+    value: number;
+    variant?: ProgressVariant;
+    size?: ProgressSize;
+    label?: string;
+    showValue?: boolean;
+}
+export declare const Progress: React.FC<ProgressProps>;

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

@@ -0,0 +1,2 @@
+export { Progress } from './Progress';
+export type { ProgressProps, ProgressVariant, ProgressSize } from './Progress';

package/dist/components/RadioGroup/RadioGroup.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+
+export type RadioGroupSize = 'sm' | 'md' | 'lg';
+export type RadioGroupOrientation = 'vertical' | 'horizontal';
+export interface RadioOption {
+    value: string;
+    label: string;
+    description?: string;
+    disabled?: boolean;
+}
+export interface RadioGroupProps {
+    name: string;
+    label?: string;
+    options: RadioOption[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    size?: RadioGroupSize;
+    orientation?: RadioGroupOrientation;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+}
+export declare const RadioGroup: React.FC<RadioGroupProps>;

package/dist/components/RadioGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { RadioGroup } from './RadioGroup';
+export type { RadioGroupProps, RadioGroupSize, RadioGroupOrientation, RadioOption } from './RadioGroup';

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

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+
+export type SelectSize = 'sm' | 'md' | 'lg';
+export interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+export interface SelectProps extends Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'size'> {
+    label?: string;
+    size?: SelectSize;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    fullWidth?: boolean;
+    options?: SelectOption[];
+    placeholder?: string;
+}
+export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLSelectElement>>;

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

@@ -0,0 +1,2 @@
+export { Select } from './Select';
+export type { SelectProps, SelectSize, SelectOption } from './Select';

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

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+
+export interface SkeletonProps extends React.HTMLAttributes<HTMLSpanElement> {
+    width?: string | number;
+    height?: string | number;
+    radius?: string | number;
+    lines?: number;
+    gap?: string | number;
+}
+export declare const Skeleton: React.FC<SkeletonProps>;

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

@@ -0,0 +1,2 @@
+export { Skeleton } from './Skeleton';
+export type { SkeletonProps } from './Skeleton';

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

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+
+export type SliderSize = 'sm' | 'md' | 'lg';
+export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'onChange'> {
+    min?: number;
+    max?: number;
+    step?: number;
+    value?: number;
+    onChange?: (value: number) => void;
+    label?: string;
+    showValue?: boolean;
+    size?: SliderSize;
+}
+export declare const Slider: React.FC<SliderProps>;

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

@@ -0,0 +1,2 @@
+export { Slider } from './Slider';
+export type { SliderProps, SliderSize } from './Slider';

package/dist/components/Spinner/Spinner.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+
+export type SpinnerSize = 'sm' | 'md' | 'lg';
+export type SpinnerColor = 'primary' | 'muted' | 'white';
+export interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {
+    size?: SpinnerSize;
+    color?: SpinnerColor;
+    label?: string;
+}
+export declare const Spinner: React.FC<SpinnerProps>;

package/dist/components/Spinner/index.d.ts

@@ -0,0 +1,2 @@
+export { Spinner } from './Spinner';
+export type { SpinnerProps, SpinnerSize, SpinnerColor } from './Spinner';

package/dist/components/Stepper/Stepper.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+
+export type StepperOrientation = 'horizontal' | 'vertical';
+export type StepperVariant = 'default' | 'compact';
+export interface StepItem {
+    label: string;
+    description?: string;
+}
+export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
+    steps: StepItem[];
+    currentStep: number;
+    orientation?: StepperOrientation;
+    variant?: StepperVariant;
+}
+export declare const Stepper: React.FC<StepperProps>;

package/dist/components/Stepper/index.d.ts

@@ -0,0 +1,2 @@
+export { Stepper } from './Stepper';
+export type { StepperProps, StepItem, StepperOrientation, StepperVariant } from './Stepper';

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

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+
+export type SwitchSize = 'sm' | 'md' | 'lg';
+export interface SwitchProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'> {
+    label?: string;
+    description?: string;
+    size?: SwitchSize;
+}
+export declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,2 @@
+export { Switch } from './Switch';
+export type { SwitchProps, SwitchSize } from './Switch';

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

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+
+export type TableSize = 'sm' | 'md' | 'lg';
+export type SortDirection = 'asc' | 'desc';
+export interface TableColumn<T = Record<string, unknown>> {
+    key: string;
+    header: string;
+    sortable?: boolean;
+    render?: (value: unknown, row: T, index: number) => React.ReactNode;
+}
+export interface TableProps<T = Record<string, unknown>> extends React.HTMLAttributes<HTMLDivElement> {
+    columns: TableColumn<T>[];
+    data: T[];
+    sortKey?: string;
+    sortDir?: SortDirection;
+    onSort?: (key: string, dir: SortDirection) => void;
+    striped?: boolean;
+    bordered?: boolean;
+    size?: TableSize;
+}
+export declare function Table<T = Record<string, unknown>>({ columns, data, sortKey, sortDir, onSort, striped, bordered, size, className, ...props }: TableProps<T>): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { Table } from './Table';
+export type { TableProps, TableColumn, TableSize, SortDirection } from './Table';