@engrate/components 0.0.5 → 0.1.1

package/dist/components/ui/Grid/Grid.d.ts

@@ -0,0 +1,94 @@
+import * as React from 'react';
+declare const gridVariants: (props?: ({
+    cols?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | null | undefined;
+    gap?: "sm" | "lg" | "none" | "md" | "xl" | "xs" | "2xl" | null | undefined;
+    align?: "end" | "start" | "center" | "stretch" | "baseline" | null | undefined;
+    justify?: "end" | "start" | "center" | "stretch" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type ColsValue = 1 | 2 | 3 | 4 | 5 | 6 | 12;
+type GapValue = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+type AlignValue = 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+type JustifyValue = 'start' | 'center' | 'end' | 'stretch';
+type ResponsiveValue<T> = T | {
+    base?: T;
+    sm?: T;
+    md?: T;
+    lg?: T;
+    xl?: T;
+    '2xl'?: T;
+};
+interface GridProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'cols'> {
+    /** Number of columns in the grid. Supports responsive values. */
+    cols?: ResponsiveValue<ColsValue>;
+    /** Gap between grid items. Supports responsive values. */
+    gap?: ResponsiveValue<GapValue>;
+    /** Vertical alignment of items. Supports responsive values. */
+    align?: ResponsiveValue<AlignValue>;
+    /** Horizontal alignment of items. Supports responsive values. */
+    justify?: ResponsiveValue<JustifyValue>;
+    /** Render as a child component using Slot */
+    asChild?: boolean;
+}
+/**
+ * Grid component for consistent layout structures.
+ * Provides a flexible grid system with configurable columns, gaps, and alignment.
+ * Supports responsive values for mobile-first responsive layouts.
+ *
+ * @example
+ * ```tsx
+ * // Simple usage
+ * <Grid cols={3} gap="lg">
+ *   <Card>Item 1</Card>
+ *   <Card>Item 2</Card>
+ *   <Card>Item 3</Card>
+ * </Grid>
+ *
+ * // Responsive usage
+ * <Grid cols={{ base: 1, md: 2, lg: 3 }} gap={{ base: 'md', lg: 'xl' }}>
+ *   <Card>Item 1</Card>
+ *   <Card>Item 2</Card>
+ *   <Card>Item 3</Card>
+ * </Grid>
+ * ```
+ */
+declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>>;
+declare const gridItemVariants: (props?: ({
+    colSpan?: 1 | 2 | 3 | 4 | 5 | 6 | 11 | 12 | 10 | "full" | 7 | 8 | 9 | null | undefined;
+    rowSpan?: 1 | 2 | 3 | 4 | 5 | 6 | "full" | null | undefined;
+    colStart?: 1 | "auto" | 2 | 3 | 4 | 5 | 6 | 11 | 12 | 10 | 7 | 8 | 9 | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type ColSpanValue = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 'full';
+type RowSpanValue = 1 | 2 | 3 | 4 | 5 | 6 | 'full';
+type ColStartValue = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 'auto';
+interface GridItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Column span for the item. Supports responsive values. */
+    colSpan?: ResponsiveValue<ColSpanValue>;
+    /** Row span for the item. Supports responsive values. */
+    rowSpan?: ResponsiveValue<RowSpanValue>;
+    /** Column start position for the item. Supports responsive values. */
+    colStart?: ResponsiveValue<ColStartValue>;
+    /** Render as a child component using Slot */
+    asChild?: boolean;
+}
+/**
+ * GridItem component for controlling individual item placement within a Grid.
+ * Supports responsive values for mobile-first responsive layouts.
+ *
+ * @example
+ * ```tsx
+ * // Simple usage
+ * <Grid cols={12}>
+ *   <GridItem colSpan={8}>Main content</GridItem>
+ *   <GridItem colSpan={4}>Sidebar</GridItem>
+ * </Grid>
+ *
+ * // Responsive usage
+ * <Grid cols={{ base: 1, lg: 12 }}>
+ *   <GridItem colSpan={{ base: 'full', lg: 8 }}>Main content</GridItem>
+ *   <GridItem colSpan={{ base: 'full', lg: 4 }}>Sidebar</GridItem>
+ * </Grid>
+ * ```
+ */
+declare const GridItem: React.ForwardRefExoticComponent<GridItemProps & React.RefAttributes<HTMLDivElement>>;
+export { Grid, gridVariants, GridItem, gridItemVariants };
+export type { GridProps, GridItemProps, ResponsiveValue };

package/dist/components/ui/Grid/index.d.ts

@@ -0,0 +1,2 @@
+export { Grid, gridVariants, GridItem, gridItemVariants } from './Grid';
+export type { GridProps, GridItemProps } from './Grid';

package/dist/components/ui/Heading/Heading.d.ts

@@ -0,0 +1,20 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const headingVariants: (props?: ({
+    level?: "hero" | "h1" | "h2" | "h3" | "h4" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement>, VariantProps<typeof headingVariants> {
+    /**
+     * Render as a different element using Radix Slot
+     */
+    asChild?: boolean;
+    /**
+     * Override the default HTML element for semantic flexibility
+     * @default Matches the level prop (hero renders as h1)
+     */
+    as?: HeadingElement;
+}
+declare const Heading: React.ForwardRefExoticComponent<HeadingProps & React.RefAttributes<HTMLHeadingElement>>;
+export { Heading, headingVariants };
+export type { HeadingProps };

package/dist/components/ui/Heading/index.d.ts

@@ -0,0 +1 @@
+export * from './Heading';

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

@@ -0,0 +1,20 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const inputVariants: (props?: ({
+    variant?: "default" | "error" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, VariantProps<typeof inputVariants> {
+}
+/**
+ * Text input component following Engrate brand guidelines.
+ * Features rounded corners, subtle background, and sunflower focus ring.
+ *
+ * @example
+ * ```tsx
+ * <Input placeholder="Enter your email" />
+ * <Input variant="error" placeholder="Invalid input" />
+ * ```
+ */
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+export { Input, inputVariants };
+export type { InputProps };

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

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

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

@@ -0,0 +1,21 @@
+import { VariantProps } from 'class-variance-authority';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import * as React from 'react';
+declare const labelVariants: (props?: ({
+    size?: "sm" | "default" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface LabelProps extends React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, VariantProps<typeof labelVariants> {
+}
+/**
+ * Form label component following Engrate brand guidelines.
+ * Uses text-tertiary color and Work Sans font.
+ *
+ * @example
+ * ```tsx
+ * <Label htmlFor="email">Email address</Label>
+ * <Label size="sm">Small label</Label>
+ * ```
+ */
+declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
+export { Label, labelVariants };
+export type { LabelProps };

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

@@ -0,0 +1,2 @@
+export { Label, labelVariants } from './Label';
+export type { LabelProps } from './Label';

package/dist/components/ui/Link/Link.d.ts

@@ -0,0 +1,24 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const linkVariants: (props?: ({
+    variant?: "default" | "nav" | "muted" | null | undefined;
+    size?: "sm" | "default" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement>, VariantProps<typeof linkVariants> {
+    /** Render as a child component (for use with Next.js Link, etc.) */
+    asChild?: boolean;
+}
+/**
+ * Link component for navigation following Engrate brand guidelines.
+ * Supports multiple variants for different use cases.
+ *
+ * @example
+ * ```tsx
+ * <Link href="/about">About us</Link>
+ * <Link href="/docs" variant="nav">Documentation</Link>
+ * <Link asChild><NextLink href="/page">Next.js Link</NextLink></Link>
+ * ```
+ */
+declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+export { Link, linkVariants };
+export type { LinkProps };

package/dist/components/ui/Link/index.d.ts

@@ -0,0 +1,2 @@
+export { Link, linkVariants } from './Link';
+export type { LinkProps } from './Link';

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

@@ -0,0 +1,32 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+declare const Modal: React.FC<DialogPrimitive.DialogProps>;
+declare const ModalTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const ModalPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const ModalClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+interface ModalOverlayProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay> {
+}
+declare const ModalOverlay: React.ForwardRefExoticComponent<ModalOverlayProps & React.RefAttributes<HTMLDivElement>>;
+declare const modalContentVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | "full" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface ModalContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof modalContentVariants> {
+    /** Whether to show the default close button in the top-right corner */
+    showCloseButton?: boolean;
+}
+declare const ModalContent: React.ForwardRefExoticComponent<ModalContentProps & React.RefAttributes<HTMLDivElement>>;
+interface ModalHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ModalHeader: React.ForwardRefExoticComponent<ModalHeaderProps & React.RefAttributes<HTMLDivElement>>;
+interface ModalFooterProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const ModalFooter: React.ForwardRefExoticComponent<ModalFooterProps & React.RefAttributes<HTMLDivElement>>;
+interface ModalTitleProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title> {
+}
+declare const ModalTitle: React.ForwardRefExoticComponent<ModalTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+interface ModalDescriptionProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description> {
+}
+declare const ModalDescription: React.ForwardRefExoticComponent<ModalDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+export { Modal, ModalTrigger, ModalPortal, ModalOverlay, ModalContent, ModalClose, ModalHeader, ModalFooter, ModalTitle, ModalDescription, modalContentVariants, };
+export type { ModalOverlayProps, ModalContentProps, ModalHeaderProps, ModalFooterProps, ModalTitleProps, ModalDescriptionProps, };

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

@@ -0,0 +1,2 @@
+export { Modal, ModalTrigger, ModalPortal, ModalOverlay, ModalContent, ModalClose, ModalHeader, ModalFooter, ModalTitle, ModalDescription, modalContentVariants, } from './Modal';
+export type { ModalOverlayProps, ModalContentProps, ModalHeaderProps, ModalFooterProps, ModalTitleProps, ModalDescriptionProps, } from './Modal';

package/dist/components/ui/ProgressIndicator/ProgressIndicator.d.ts

@@ -0,0 +1,33 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const progressIndicatorVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | "xl" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const progressBarVariants: (props?: ({
+    variant?: "default" | "muted" | "success" | null | undefined;
+    animated?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface ProgressIndicatorProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof progressIndicatorVariants>, VariantProps<typeof progressBarVariants> {
+    /** Current progress value (0-100) */
+    value?: number;
+    /** Maximum progress value */
+    max?: number;
+    /** Accessible label for screen readers */
+    label?: string;
+    /** Whether to show indeterminate loading state */
+    indeterminate?: boolean;
+}
+/**
+ * Progress indicator component following Engrate brand guidelines.
+ * Uses Sunflower yellow as the default color for the progress bar.
+ *
+ * @example
+ * ```tsx
+ * <ProgressIndicator value={50} />
+ * <ProgressIndicator value={75} size="lg" variant="success" />
+ * <ProgressIndicator indeterminate label="Loading..." />
+ * ```
+ */
+declare const ProgressIndicator: React.ForwardRefExoticComponent<ProgressIndicatorProps & React.RefAttributes<HTMLDivElement>>;
+export { ProgressIndicator, progressIndicatorVariants, progressBarVariants };
+export type { ProgressIndicatorProps };

package/dist/components/ui/ProgressIndicator/index.d.ts

@@ -0,0 +1,2 @@
+export { ProgressIndicator, progressIndicatorVariants, progressBarVariants, } from './ProgressIndicator';
+export type { ProgressIndicatorProps } from './ProgressIndicator';

package/dist/components/ui/Radio/Radio.d.ts

@@ -0,0 +1,29 @@
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import * as React from 'react';
+/**
+ * Radio group container component.
+ * Built on Radix UI RadioGroup for accessibility.
+ *
+ * @example
+ * ```tsx
+ * <RadioGroup defaultValue="option1">
+ *   <RadioGroupItem value="option1" id="option1" />
+ *   <RadioGroupItem value="option2" id="option2" />
+ * </RadioGroup>
+ * ```
+ */
+declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+interface RadioGroupItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item> {
+}
+/**
+ * Radio group item component following Engrate brand guidelines.
+ * Features sunflower accent when selected.
+ *
+ * @example
+ * ```tsx
+ * <RadioGroupItem value="option1" id="option1" />
+ * ```
+ */
+declare const RadioGroupItem: React.ForwardRefExoticComponent<RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
+export { RadioGroup, RadioGroupItem };
+export type { RadioGroupItemProps };

package/dist/components/ui/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export { RadioGroup, RadioGroupItem } from './Radio';
+export type { RadioGroupItemProps } from './Radio';

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

@@ -0,0 +1,39 @@
+import * as SelectPrimitive from '@radix-ui/react-select';
+import * as React from 'react';
+declare const Select: React.FC<SelectPrimitive.SelectProps>;
+declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+interface SelectTriggerProps extends React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger> {
+    variant?: 'default' | 'error';
+}
+/**
+ * Select trigger button following Engrate brand guidelines.
+ * Features rounded corners, subtle background, and sunflower focus ring.
+ */
+declare const SelectTrigger: React.ForwardRefExoticComponent<SelectTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+/**
+ * Scrollable upward button for Select content.
+ */
+declare const SelectScrollUpButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Scrollable downward button for Select content.
+ */
+declare const SelectScrollDownButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Select dropdown content following Engrate brand guidelines.
+ */
+declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Select label for grouping items.
+ */
+declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Individual select option following Engrate brand guidelines.
+ */
+declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Separator between select items.
+ */
+declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, };
+export type { SelectTriggerProps };

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

@@ -0,0 +1,2 @@
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from './Select';
+export type { SelectTriggerProps } from './Select';

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

@@ -0,0 +1,25 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const skeletonVariants: (props?: ({
+    variant?: "text" | "default" | "circular" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
+    /** Width of the skeleton (CSS value or Tailwind class) */
+    width?: string | number;
+    /** Height of the skeleton (CSS value or Tailwind class) */
+    height?: string | number;
+}
+/**
+ * Skeleton component for indicating loading states.
+ * Displays a pulsing placeholder while content is loading.
+ *
+ * @example
+ * ```tsx
+ * <Skeleton width={200} height={20} />
+ * <Skeleton variant="circular" width={40} height={40} />
+ * <Skeleton variant="text" className="w-full h-4" />
+ * ```
+ */
+declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export { Skeleton, skeletonVariants };
+export type { SkeletonProps };

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

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

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

@@ -0,0 +1,24 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const spinnerVariants: (props?: ({
+    variant?: "default" | "muted" | "inverted" | null | undefined;
+    size?: "sm" | "default" | "lg" | "xl" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof spinnerVariants> {
+    /** Accessible label for screen readers */
+    label?: string;
+}
+/**
+ * Loading spinner component following Engrate brand guidelines.
+ * Uses Sunflower yellow as the default color.
+ *
+ * @example
+ * ```tsx
+ * <Spinner />
+ * <Spinner size="lg" variant="muted" />
+ * <Spinner label="Loading data..." />
+ * ```
+ */
+declare const Spinner: React.ForwardRefExoticComponent<SpinnerProps & React.RefAttributes<HTMLSpanElement>>;
+export { Spinner, spinnerVariants };
+export type { SpinnerProps };

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

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

package/dist/components/ui/Stack/Stack.d.ts

@@ -0,0 +1,36 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const stackVariants: (props?: ({
+    direction?: "horizontal" | "vertical" | null | undefined;
+    gap?: "sm" | "lg" | "none" | "md" | "xl" | "xs" | "2xl" | null | undefined;
+    align?: "end" | "start" | "center" | "stretch" | "baseline" | null | undefined;
+    justify?: "end" | "start" | "center" | "between" | "around" | "evenly" | null | undefined;
+    wrap?: "wrap" | "nowrap" | "wrap-reverse" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface StackProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof stackVariants> {
+    /** Render as a child component using Slot */
+    asChild?: boolean;
+}
+/**
+ * Stack component for arranging elements in a vertical or horizontal stack.
+ * Provides a flexible layout system with configurable direction, gaps, and alignment.
+ *
+ * @example
+ * ```tsx
+ * // Vertical stack (default)
+ * <Stack gap="lg">
+ *   <Card>Item 1</Card>
+ *   <Card>Item 2</Card>
+ *   <Card>Item 3</Card>
+ * </Stack>
+ *
+ * // Horizontal stack
+ * <Stack direction="horizontal" gap="md" align="center">
+ *   <Button>Action 1</Button>
+ *   <Button>Action 2</Button>
+ * </Stack>
+ * ```
+ */
+declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLDivElement>>;
+export { Stack, stackVariants };
+export type { StackProps };

package/dist/components/ui/Stack/index.d.ts

@@ -0,0 +1,2 @@
+export { Stack, stackVariants } from './Stack';
+export type { StackProps } from './Stack';

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

@@ -0,0 +1,18 @@
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import * as React from 'react';
+interface SwitchProps extends React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root> {
+}
+/**
+ * Switch component following Engrate brand guidelines.
+ * Built on Radix UI Switch for accessibility.
+ * Features sunflower background when on.
+ *
+ * @example
+ * ```tsx
+ * <Switch id="notifications" />
+ * <Switch defaultChecked />
+ * ```
+ */
+declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
+export { Switch };
+export type { SwitchProps };

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

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

package/dist/components/ui/TabList/TabList.d.ts

@@ -0,0 +1,61 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+interface TabsProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** The default active tab value */
+    defaultValue?: string;
+    /** Controlled active tab value */
+    value?: string;
+    /** Callback when active tab changes */
+    onValueChange?: (value: string) => void;
+}
+/**
+ * Root container for the tabs component.
+ * Manages the active tab state and provides context to child components.
+ *
+ * @example
+ * ```tsx
+ * <Tabs defaultValue="tab1">
+ *   <TabList>
+ *     <TabTrigger value="tab1">Tab 1</TabTrigger>
+ *     <TabTrigger value="tab2">Tab 2</TabTrigger>
+ *   </TabList>
+ *   <TabContent value="tab1">Content 1</TabContent>
+ *   <TabContent value="tab2">Content 2</TabContent>
+ * </Tabs>
+ * ```
+ */
+declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;
+declare const tabListVariants: (props?: ({
+    variant?: "default" | "pills" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface TabListProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof tabListVariants> {
+}
+/**
+ * Container for tab triggers. Renders the row of clickable tabs.
+ */
+declare const TabList: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;
+declare const tabTriggerVariants: (props?: ({
+    variant?: "default" | "pills" | null | undefined;
+    size?: "sm" | "default" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface TabTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof tabTriggerVariants> {
+    /** Unique value identifying this tab */
+    value: string;
+}
+/**
+ * Individual tab trigger button. Clicking activates the associated TabContent.
+ */
+declare const TabTrigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const tabContentVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface TabContentProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof tabContentVariants> {
+    /** Value matching the TabTrigger this content belongs to */
+    value: string;
+}
+/**
+ * Content panel for a tab. Only visible when the matching tab is active.
+ */
+declare const TabContent: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;
+export { Tabs, TabList, tabListVariants, TabTrigger, tabTriggerVariants, TabContent, tabContentVariants, };
+export type { TabsProps, TabListProps, TabTriggerProps, TabContentProps };

package/dist/components/ui/TabList/index.d.ts

@@ -0,0 +1,2 @@
+export { Tabs, TabList, tabListVariants, TabTrigger, tabTriggerVariants, TabContent, tabContentVariants, } from './TabList';
+export type { TabsProps, TabListProps, TabTriggerProps, TabContentProps, } from './TabList';

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

@@ -0,0 +1,88 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const tableVariants: (props?: ({
+    variant?: "default" | "striped" | null | undefined;
+    size?: "default" | "compact" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const tableRowVariants: (props?: ({
+    variant?: "default" | "striped" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const tableHeadVariants: (props?: ({
+    sortable?: boolean | null | undefined;
+    size?: "default" | "compact" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface TableProps extends React.HTMLAttributes<HTMLTableElement>, VariantProps<typeof tableVariants> {
+}
+/**
+ * Table root component following Engrate brand guidelines.
+ * Features light gray backgrounds and subtle borders.
+ *
+ * @example
+ * ```tsx
+ * <Table>
+ *   <TableHeader>
+ *     <TableRow>
+ *       <TableHead>Name</TableHead>
+ *     </TableRow>
+ *   </TableHeader>
+ *   <TableBody>
+ *     <TableRow>
+ *       <TableCell>John Doe</TableCell>
+ *     </TableRow>
+ *   </TableBody>
+ * </Table>
+ * ```
+ */
+declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>>;
+interface TableHeaderProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+}
+declare const TableHeader: React.ForwardRefExoticComponent<TableHeaderProps & React.RefAttributes<HTMLTableSectionElement>>;
+interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+}
+declare const TableBody: React.ForwardRefExoticComponent<TableBodyProps & React.RefAttributes<HTMLTableSectionElement>>;
+interface TableFooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+}
+declare const TableFooter: React.ForwardRefExoticComponent<TableFooterProps & React.RefAttributes<HTMLTableSectionElement>>;
+interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement>, VariantProps<typeof tableRowVariants> {
+}
+declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
+type SortDirection = 'asc' | 'desc' | null;
+interface TableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement>, Omit<VariantProps<typeof tableHeadVariants>, 'size'> {
+    /** Enable sorting for this column */
+    sortable?: boolean;
+    /** Current sort direction */
+    sortDirection?: SortDirection;
+    /** Callback when sort is triggered */
+    onSort?: () => void;
+}
+declare const TableHead: React.ForwardRefExoticComponent<TableHeadProps & React.RefAttributes<HTMLTableCellElement>>;
+interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+}
+declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
+interface TableCaptionProps extends React.HTMLAttributes<HTMLTableCaptionElement> {
+}
+declare const TableCaption: React.ForwardRefExoticComponent<TableCaptionProps & React.RefAttributes<HTMLTableCaptionElement>>;
+interface UseSortableTableOptions<T> {
+    data: T[];
+    initialSortKey?: keyof T | null;
+    initialSortDirection?: 'asc' | 'desc';
+}
+interface UseSortableTableReturn<T> {
+    sortedData: T[];
+    sortKey: keyof T | null;
+    sortDirection: SortDirection;
+    handleSort: (key: keyof T) => void;
+}
+declare function useSortableTable<T>({ data, initialSortKey, initialSortDirection, }: UseSortableTableOptions<T>): UseSortableTableReturn<T>;
+interface UseFilterableTableOptions<T> {
+    data: T[];
+    filterKeys?: (keyof T)[];
+}
+interface UseFilterableTableReturn<T> {
+    filteredData: T[];
+    filterValue: string;
+    setFilterValue: (value: string) => void;
+}
+declare function useFilterableTable<T>({ data, filterKeys, }: UseFilterableTableOptions<T>): UseFilterableTableReturn<T>;
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, tableVariants, useSortableTable, useFilterableTable, };
+export type { TableProps, TableHeadProps, TableRowProps, SortDirection };

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

@@ -0,0 +1,2 @@
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, tableVariants, useSortableTable, useFilterableTable, } from './Table';
+export type { TableProps, TableHeadProps, TableRowProps, SortDirection, } from './Table';