@me1a/ui 2.0.2 → 2.0.4

package/dist/index.d.mts

@@ -6,13 +6,18 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { Slot } from '@radix-ui/react-slot';
 import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
-import { FieldValues, FieldPath } from 'react-hook-form';
 import * as vaul from 'vaul';
 import { Drawer as Drawer$1 } from 'vaul';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { ClassValue } from 'clsx';
 
+type ButtonVariant = "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
+type ButtonSize = "default" | "sm" | "lg" | "icon";
 /**
  * Props interface for the Button component.
  * Extends the native button HTML attributes and adds support for variants and asChild prop.
@@ -23,8 +28,8 @@ import { ClassValue } from 'clsx';
  * @extends {VariantProps<typeof buttonVariants>}
  *
  * @property {boolean} [asChild] - When true, renders the button as a child component using Radix UI's Slot.
- * @property {string} [variant] - The visual style variant of the button.
- * @property {string} [size] - The size variant of the button.
+ * @property {ButtonVariant} [variant] - The visual style variant of the button.
+ * @property {ButtonSize} [size] - The size variant of the button.
  * @property {string} [className] - Additional CSS classes to apply to the button.
  * @property {React.ReactNode} [startIcon] - Icon to display before the button text.
  * @property {React.ReactNode} [endIcon] - Icon to display after the button text.
@@ -34,6 +39,8 @@ import { ClassValue } from 'clsx';
  */
 interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
+    variant?: ButtonVariant;
+    size?: ButtonSize;
     startIcon?: React$1.ReactNode;
     endIcon?: React$1.ReactNode;
     loading?: boolean;
@@ -191,10 +198,15 @@ declare const Container: React$1.ForwardRefExoticComponent<ContainerProps & Reac
  *
  * // With custom className
  * <Box className="bg-primary text-white p-4">Styled content</Box>
+ *
+ * // With custom dimensions
+ * <Box width="100px" height="200px">Fixed size content</Box>
+ * <Box width="50%" height="auto">Responsive content</Box>
  * ```
  */
 
 type BoxComponent = "div" | "span" | "section" | "article" | "main" | "aside" | "header" | "footer" | "nav";
+type DimensionValue = string | number;
 interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
     /**
      * The HTML element to render the Box as.
@@ -203,6 +215,16 @@ interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
      * @default "div"
      */
     as?: BoxComponent;
+    /**
+     * The width of the Box component.
+     * Can be a number (interpreted as pixels) or a string (e.g., "100%", "50px", "10rem").
+     */
+    width?: DimensionValue;
+    /**
+     * The height of the Box component.
+     * Can be a number (interpreted as pixels) or a string (e.g., "100%", "50px", "10rem").
+     */
+    height?: DimensionValue;
 }
 declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -239,6 +261,11 @@ declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttri
  *   <div>Center</div>
  *   <div>Right</div>
  * </Stack>
+ *
+ * // Stack with custom dimensions
+ * <Stack width="100%" height="200px">
+ *   <div>Full width, fixed height stack</div>
+ * </Stack>
  * ```
  */
 
@@ -300,6 +327,20 @@ interface StackProps extends React$1.HTMLAttributes<HTMLDivElement> {
      * @default undefined
      */
     align?: "start" | "end" | "center" | "stretch" | "baseline";
+    /**
+     * The width of the stack container.
+     * Can be any valid CSS width value (e.g., "100%", "200px", "50vw").
+     *
+     * @default undefined
+     */
+    width?: string;
+    /**
+     * The height of the stack container.
+     * Can be any valid CSS height value (e.g., "100%", "200px", "50vh").
+     *
+     * @default undefined
+     */
+    height?: string;
 }
 declare const Stack: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -330,7 +371,7 @@ declare const SheetClose: React$1.ForwardRefExoticComponent<DialogPrimitive.Dial
 declare const SheetPortal: React$1.FC<DialogPrimitive.DialogPortalProps>;
 declare const SheetOverlay: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const sheetVariants: (props?: ({
-    side?: "top" | "bottom" | "left" | "right" | null | undefined;
+    side?: "left" | "right" | "bottom" | "top" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
 interface SheetContentProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
 }
@@ -414,6 +455,132 @@ interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<
  */
 declare const Badge: React$1.ForwardRefExoticComponent<BadgeProps & React$1.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Props interface for the Form component.
+ * Extends react-hook-form's FormProvider props.
+ */
+interface FormProps<TFieldValues extends FieldValues = FieldValues> {
+    /**
+     * The form context value
+     */
+    context: React$1.Context<TFieldValues>;
+    /**
+     * The form children
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * Props interface for the FormField component.
+ * Extends react-hook-form's Controller props.
+ */
+interface FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ControllerProps<TFieldValues, TName> {
+}
+/**
+ * Props interface for the FormItem component.
+ * Extends HTML div attributes.
+ */
+interface FormItemProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+/**
+ * Props interface for the FormLabel component.
+ * Extends Radix UI Label props.
+ */
+interface FormLabelProps extends React$1.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> {
+}
+/**
+ * Props interface for the FormControl component.
+ * Extends Radix UI Slot props.
+ */
+interface FormControlProps extends React$1.ComponentPropsWithoutRef<typeof Slot> {
+}
+/**
+ * Props interface for the FormDescription component.
+ * Extends HTML paragraph attributes.
+ */
+interface FormDescriptionProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
+}
+/**
+ * Props interface for the FormMessage component.
+ * Extends HTML paragraph attributes.
+ */
+interface FormMessageProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
+    /**
+     * The message content
+     */
+    children?: React$1.ReactNode;
+}
+/**
+ * Context value type for form field context
+ */
+type FormFieldContextValue<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
+    name: TName;
+};
+/**
+ * Context value type for form item context
+ */
+type FormItemContextValue = {
+    id: string;
+};
+
+/**
+ * Form component that provides form context to all child components.
+ * Built on top of react-hook-form's FormProvider.
+ */
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React$1.JSX.Element;
+/**
+ * FormField component that wraps react-hook-form's Controller component.
+ * Provides form field context to child components.
+ */
+declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: FormFieldProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access form field context and state.
+ * Must be used within a FormField component.
+ */
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: react_hook_form.FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+/**
+ * FormItem component that provides spacing and layout for form fields.
+ */
+declare const FormItem: React$1.ForwardRefExoticComponent<FormItemProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * FormLabel component that provides accessible labels for form fields.
+ */
+declare const FormLabel: React$1.ForwardRefExoticComponent<FormLabelProps & React$1.RefAttributes<HTMLLabelElement>>;
+/**
+ * FormControl component that provides accessible form controls.
+ */
+declare const FormControl: React$1.ForwardRefExoticComponent<FormControlProps & React$1.RefAttributes<HTMLElement>>;
+/**
+ * FormDescription component that provides additional context for form fields.
+ */
+declare const FormDescription: React$1.ForwardRefExoticComponent<FormDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
+/**
+ * FormMessage component that displays error messages for form fields.
+ */
+declare const FormMessage: React$1.ForwardRefExoticComponent<FormMessageProps & React$1.RefAttributes<HTMLParagraphElement>>;
+
+declare const typographyVariants: (props?: ({
+    variant?: "list" | "small" | "blockquote" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "muted" | "large" | "lead" | null | undefined;
+    align?: "center" | "left" | "right" | "justify" | null | undefined;
+} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
+interface TypographyProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<typeof typographyVariants> {
+    as?: React$1.ElementType;
+}
+declare const Typography: React$1.ForwardRefExoticComponent<TypographyProps & React$1.RefAttributes<HTMLElement>>;
+
+type TypographyVariant = NonNullable<VariantProps<typeof typographyVariants>["variant"]>;
+type TypographyAlign = NonNullable<VariantProps<typeof typographyVariants>["align"]>;
+
 /**
  * Card is a flexible container component that can be used to group related content and actions.
  * It provides a consistent visual style with a subtle border, shadow, and rounded corners.
@@ -1099,6 +1266,8 @@ interface DropdownMenuRadioGroupProps {
     onValueChange?: (value: string) => void;
 }
 
+declare function useIsMobile(): boolean;
+
 declare function cn(...inputs: ClassValue[]): string;
 
-export { Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Container, type ContainerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, type DropdownMenuPortalProps, type DropdownMenuProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, Input, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, RHFTextField, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContextProps, SidebarFooter, SidebarGroup, SidebarGroupAction, type SidebarGroupActionProps, SidebarGroupContent, SidebarGroupLabel, type SidebarGroupLabelProps, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, type SidebarMenuActionProps, SidebarMenuBadge, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, SidebarMenuSkeleton, type SidebarMenuSkeletonProps, SidebarMenuSub, SidebarMenuSubButton, type SidebarMenuSubButtonProps, SidebarMenuSubItem, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Stack, type StackProps, TextField, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, sidebarMenuButtonVariants, textFieldVariants, useSidebar };
+export { Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Container, type ContainerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, type DropdownMenuPortalProps, type DropdownMenuProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, Form, FormControl, type FormControlProps, FormDescription, type FormDescriptionProps, FormField, type FormFieldContextValue, type FormFieldProps, FormItem, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, FormMessage, type FormMessageProps, type FormProps, Input, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, RHFTextField, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContextProps, SidebarFooter, SidebarGroup, SidebarGroupAction, type SidebarGroupActionProps, SidebarGroupContent, SidebarGroupLabel, type SidebarGroupLabelProps, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, type SidebarMenuActionProps, SidebarMenuBadge, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, SidebarMenuSkeleton, type SidebarMenuSkeletonProps, SidebarMenuSub, SidebarMenuSubButton, type SidebarMenuSubButtonProps, SidebarMenuSubItem, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Stack, type StackProps, TextField, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Typography, type TypographyAlign, type TypographyProps, type TypographyVariant, badgeVariants, buttonVariants, cn, sidebarMenuButtonVariants, textFieldVariants, typographyVariants, useFormField, useIsMobile, useSidebar };

package/dist/index.d.ts

@@ -6,13 +6,18 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { Slot } from '@radix-ui/react-slot';
 import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
-import { FieldValues, FieldPath } from 'react-hook-form';
 import * as vaul from 'vaul';
 import { Drawer as Drawer$1 } from 'vaul';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { ClassValue } from 'clsx';
 
+type ButtonVariant = "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
+type ButtonSize = "default" | "sm" | "lg" | "icon";
 /**
  * Props interface for the Button component.
  * Extends the native button HTML attributes and adds support for variants and asChild prop.
@@ -23,8 +28,8 @@ import { ClassValue } from 'clsx';
  * @extends {VariantProps<typeof buttonVariants>}
  *
  * @property {boolean} [asChild] - When true, renders the button as a child component using Radix UI's Slot.
- * @property {string} [variant] - The visual style variant of the button.
- * @property {string} [size] - The size variant of the button.
+ * @property {ButtonVariant} [variant] - The visual style variant of the button.
+ * @property {ButtonSize} [size] - The size variant of the button.
  * @property {string} [className] - Additional CSS classes to apply to the button.
  * @property {React.ReactNode} [startIcon] - Icon to display before the button text.
  * @property {React.ReactNode} [endIcon] - Icon to display after the button text.
@@ -34,6 +39,8 @@ import { ClassValue } from 'clsx';
  */
 interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
+    variant?: ButtonVariant;
+    size?: ButtonSize;
     startIcon?: React$1.ReactNode;
     endIcon?: React$1.ReactNode;
     loading?: boolean;
@@ -191,10 +198,15 @@ declare const Container: React$1.ForwardRefExoticComponent<ContainerProps & Reac
  *
  * // With custom className
  * <Box className="bg-primary text-white p-4">Styled content</Box>
+ *
+ * // With custom dimensions
+ * <Box width="100px" height="200px">Fixed size content</Box>
+ * <Box width="50%" height="auto">Responsive content</Box>
  * ```
  */
 
 type BoxComponent = "div" | "span" | "section" | "article" | "main" | "aside" | "header" | "footer" | "nav";
+type DimensionValue = string | number;
 interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
     /**
      * The HTML element to render the Box as.
@@ -203,6 +215,16 @@ interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
      * @default "div"
      */
     as?: BoxComponent;
+    /**
+     * The width of the Box component.
+     * Can be a number (interpreted as pixels) or a string (e.g., "100%", "50px", "10rem").
+     */
+    width?: DimensionValue;
+    /**
+     * The height of the Box component.
+     * Can be a number (interpreted as pixels) or a string (e.g., "100%", "50px", "10rem").
+     */
+    height?: DimensionValue;
 }
 declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -239,6 +261,11 @@ declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttri
  *   <div>Center</div>
  *   <div>Right</div>
  * </Stack>
+ *
+ * // Stack with custom dimensions
+ * <Stack width="100%" height="200px">
+ *   <div>Full width, fixed height stack</div>
+ * </Stack>
  * ```
  */
 
@@ -300,6 +327,20 @@ interface StackProps extends React$1.HTMLAttributes<HTMLDivElement> {
      * @default undefined
      */
     align?: "start" | "end" | "center" | "stretch" | "baseline";
+    /**
+     * The width of the stack container.
+     * Can be any valid CSS width value (e.g., "100%", "200px", "50vw").
+     *
+     * @default undefined
+     */
+    width?: string;
+    /**
+     * The height of the stack container.
+     * Can be any valid CSS height value (e.g., "100%", "200px", "50vh").
+     *
+     * @default undefined
+     */
+    height?: string;
 }
 declare const Stack: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -330,7 +371,7 @@ declare const SheetClose: React$1.ForwardRefExoticComponent<DialogPrimitive.Dial
 declare const SheetPortal: React$1.FC<DialogPrimitive.DialogPortalProps>;
 declare const SheetOverlay: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const sheetVariants: (props?: ({
-    side?: "top" | "bottom" | "left" | "right" | null | undefined;
+    side?: "left" | "right" | "bottom" | "top" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
 interface SheetContentProps extends React$1.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
 }
@@ -414,6 +455,132 @@ interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<
  */
 declare const Badge: React$1.ForwardRefExoticComponent<BadgeProps & React$1.RefAttributes<HTMLDivElement>>;
 
+/**
+ * Props interface for the Form component.
+ * Extends react-hook-form's FormProvider props.
+ */
+interface FormProps<TFieldValues extends FieldValues = FieldValues> {
+    /**
+     * The form context value
+     */
+    context: React$1.Context<TFieldValues>;
+    /**
+     * The form children
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * Props interface for the FormField component.
+ * Extends react-hook-form's Controller props.
+ */
+interface FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ControllerProps<TFieldValues, TName> {
+}
+/**
+ * Props interface for the FormItem component.
+ * Extends HTML div attributes.
+ */
+interface FormItemProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+/**
+ * Props interface for the FormLabel component.
+ * Extends Radix UI Label props.
+ */
+interface FormLabelProps extends React$1.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> {
+}
+/**
+ * Props interface for the FormControl component.
+ * Extends Radix UI Slot props.
+ */
+interface FormControlProps extends React$1.ComponentPropsWithoutRef<typeof Slot> {
+}
+/**
+ * Props interface for the FormDescription component.
+ * Extends HTML paragraph attributes.
+ */
+interface FormDescriptionProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
+}
+/**
+ * Props interface for the FormMessage component.
+ * Extends HTML paragraph attributes.
+ */
+interface FormMessageProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
+    /**
+     * The message content
+     */
+    children?: React$1.ReactNode;
+}
+/**
+ * Context value type for form field context
+ */
+type FormFieldContextValue<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
+    name: TName;
+};
+/**
+ * Context value type for form item context
+ */
+type FormItemContextValue = {
+    id: string;
+};
+
+/**
+ * Form component that provides form context to all child components.
+ * Built on top of react-hook-form's FormProvider.
+ */
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React$1.JSX.Element;
+/**
+ * FormField component that wraps react-hook-form's Controller component.
+ * Provides form field context to child components.
+ */
+declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: FormFieldProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access form field context and state.
+ * Must be used within a FormField component.
+ */
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: react_hook_form.FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+/**
+ * FormItem component that provides spacing and layout for form fields.
+ */
+declare const FormItem: React$1.ForwardRefExoticComponent<FormItemProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * FormLabel component that provides accessible labels for form fields.
+ */
+declare const FormLabel: React$1.ForwardRefExoticComponent<FormLabelProps & React$1.RefAttributes<HTMLLabelElement>>;
+/**
+ * FormControl component that provides accessible form controls.
+ */
+declare const FormControl: React$1.ForwardRefExoticComponent<FormControlProps & React$1.RefAttributes<HTMLElement>>;
+/**
+ * FormDescription component that provides additional context for form fields.
+ */
+declare const FormDescription: React$1.ForwardRefExoticComponent<FormDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
+/**
+ * FormMessage component that displays error messages for form fields.
+ */
+declare const FormMessage: React$1.ForwardRefExoticComponent<FormMessageProps & React$1.RefAttributes<HTMLParagraphElement>>;
+
+declare const typographyVariants: (props?: ({
+    variant?: "list" | "small" | "blockquote" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "muted" | "large" | "lead" | null | undefined;
+    align?: "center" | "left" | "right" | "justify" | null | undefined;
+} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
+interface TypographyProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<typeof typographyVariants> {
+    as?: React$1.ElementType;
+}
+declare const Typography: React$1.ForwardRefExoticComponent<TypographyProps & React$1.RefAttributes<HTMLElement>>;
+
+type TypographyVariant = NonNullable<VariantProps<typeof typographyVariants>["variant"]>;
+type TypographyAlign = NonNullable<VariantProps<typeof typographyVariants>["align"]>;
+
 /**
  * Card is a flexible container component that can be used to group related content and actions.
  * It provides a consistent visual style with a subtle border, shadow, and rounded corners.
@@ -1099,6 +1266,8 @@ interface DropdownMenuRadioGroupProps {
     onValueChange?: (value: string) => void;
 }
 
+declare function useIsMobile(): boolean;
+
 declare function cn(...inputs: ClassValue[]): string;
 
-export { Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Container, type ContainerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, type DropdownMenuPortalProps, type DropdownMenuProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, Input, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, RHFTextField, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContextProps, SidebarFooter, SidebarGroup, SidebarGroupAction, type SidebarGroupActionProps, SidebarGroupContent, SidebarGroupLabel, type SidebarGroupLabelProps, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, type SidebarMenuActionProps, SidebarMenuBadge, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, SidebarMenuSkeleton, type SidebarMenuSkeletonProps, SidebarMenuSub, SidebarMenuSubButton, type SidebarMenuSubButtonProps, SidebarMenuSubItem, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Stack, type StackProps, TextField, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, sidebarMenuButtonVariants, textFieldVariants, useSidebar };
+export { Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Container, type ContainerProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, type DropdownMenuPortalProps, type DropdownMenuProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, Form, FormControl, type FormControlProps, FormDescription, type FormDescriptionProps, FormField, type FormFieldContextValue, type FormFieldProps, FormItem, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, FormMessage, type FormMessageProps, type FormProps, Input, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, RHFTextField, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContextProps, SidebarFooter, SidebarGroup, SidebarGroupAction, type SidebarGroupActionProps, SidebarGroupContent, SidebarGroupLabel, type SidebarGroupLabelProps, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, type SidebarMenuActionProps, SidebarMenuBadge, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, SidebarMenuSkeleton, type SidebarMenuSkeletonProps, SidebarMenuSub, SidebarMenuSubButton, type SidebarMenuSubButtonProps, SidebarMenuSubItem, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Stack, type StackProps, TextField, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Typography, type TypographyAlign, type TypographyProps, type TypographyVariant, badgeVariants, buttonVariants, cn, sidebarMenuButtonVariants, textFieldVariants, typographyVariants, useFormField, useIsMobile, useSidebar };