@codefast/ui 0.0.8 → 0.0.9

package/src/select.tsx

@@ -14,27 +14,31 @@ import { cn } from "./utils";
  * Component: Select
  * -------------------------------------------------------------------------- */
 
+type SelectProps = SelectPrimitive.SelectProps;
 const Select = SelectPrimitive.Root;
 
 /* -----------------------------------------------------------------------------
  * Component: SelectGroup
  * -------------------------------------------------------------------------- */
 
+type SelectGroupProps = SelectPrimitive.SelectGroupProps;
 const SelectGroup = SelectPrimitive.Group;
 
 /* -----------------------------------------------------------------------------
  * Component: SelectValue
  * -------------------------------------------------------------------------- */
 
+type SelectValueProps = SelectPrimitive.SelectValueProps;
 const SelectValue = SelectPrimitive.Value;
 
 /* -----------------------------------------------------------------------------
  * Component: SelectTrigger
  * -------------------------------------------------------------------------- */
 
+type SelectTriggerProps = SelectPrimitive.SelectTriggerProps;
 const SelectTrigger = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Trigger>,
-  SelectPrimitive.SelectTriggerProps
+  SelectTriggerProps
 >(({ className, children, ...props }, ref) => (
   <SelectPrimitive.Trigger
     ref={ref}
@@ -56,9 +60,10 @@ SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
  * Component: SelectScrollUpButton
  * -------------------------------------------------------------------------- */
 
+type SelectScrollUpButtonProps = SelectPrimitive.SelectScrollUpButtonProps;
 const SelectScrollUpButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
-  SelectPrimitive.SelectScrollUpButtonProps
+  SelectScrollUpButtonProps
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.ScrollUpButton
     ref={ref}
@@ -77,9 +82,10 @@ SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
  * Component: SelectScrollDownButton
  * -------------------------------------------------------------------------- */
 
+type SelectScrollDownButtonProps = SelectPrimitive.SelectScrollDownButtonProps;
 const SelectScrollDownButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
-  SelectPrimitive.SelectScrollDownButtonProps
+  SelectScrollDownButtonProps
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.ScrollDownButton
     ref={ref}
@@ -99,9 +105,10 @@ SelectScrollDownButton.displayName =
  * Component: SelectContent
  * -------------------------------------------------------------------------- */
 
+type SelectContentProps = SelectPrimitive.SelectContentProps;
 const SelectContent = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Content>,
-  SelectPrimitive.SelectContentProps
+  SelectContentProps
 >(({ className, children, position = "popper", ...props }, ref) => (
   <SelectPrimitive.Portal>
     <SelectPrimitive.Content
@@ -135,9 +142,10 @@ SelectContent.displayName = SelectPrimitive.Content.displayName;
  * Component: SelectLabel
  * -------------------------------------------------------------------------- */
 
+type SelectLabelProps = SelectPrimitive.SelectLabelProps;
 const SelectLabel = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Label>,
-  SelectPrimitive.SelectLabelProps
+  SelectLabelProps
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Label
     ref={ref}
@@ -151,9 +159,10 @@ SelectLabel.displayName = SelectPrimitive.Label.displayName;
  * Component: SelectItem
  * -------------------------------------------------------------------------- */
 
+type SelectItemProps = SelectPrimitive.SelectItemProps;
 const SelectItem = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Item>,
-  SelectPrimitive.SelectItemProps
+  SelectItemProps
 >(({ className, children, ...props }, ref) => (
   <SelectPrimitive.Item
     ref={ref}
@@ -177,9 +186,10 @@ SelectItem.displayName = SelectPrimitive.Item.displayName;
  * Component: SelectSeparator
  * -------------------------------------------------------------------------- */
 
+type SelectSeparatorProps = SelectPrimitive.SelectSeparatorProps;
 const SelectSeparator = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Separator>,
-  SelectPrimitive.SelectSeparatorProps
+  SelectSeparatorProps
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Separator
     ref={ref}
@@ -204,4 +214,14 @@ export {
   SelectSeparator,
   SelectScrollUpButton,
   SelectScrollDownButton,
+  type SelectProps,
+  type SelectGroupProps,
+  type SelectValueProps,
+  type SelectTriggerProps,
+  type SelectContentProps,
+  type SelectLabelProps,
+  type SelectItemProps,
+  type SelectSeparatorProps,
+  type SelectScrollUpButtonProps,
+  type SelectScrollDownButtonProps,
 };

package/src/separator.tsx

@@ -8,9 +8,10 @@ import { cn } from "./utils";
  * Component: Separator
  * -------------------------------------------------------------------------- */
 
+type SeparatorProps = SeparatorPrimitive.SeparatorProps;
 const Separator = React.forwardRef<
   React.ElementRef<typeof SeparatorPrimitive.Root>,
-  SeparatorPrimitive.SeparatorProps
+  SeparatorProps
 >(
   (
     { className, orientation = "horizontal", decorative = true, ...props },
@@ -35,4 +36,4 @@ Separator.displayName = SeparatorPrimitive.Root.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Separator };
+export { Separator, type SeparatorProps };

package/src/sheet.tsx

@@ -27,31 +27,37 @@ const sheetVariants = cva({
   },
 });
 
+type SheetVariantsProps = VariantProps<typeof sheetVariants>;
+
 /* -----------------------------------------------------------------------------
  * Component: Sheet
  * -------------------------------------------------------------------------- */
 
+type SheetProps = SheetPrimitive.DialogProps;
 const Sheet = SheetPrimitive.Root;
 
 /* -----------------------------------------------------------------------------
  * Component: SheetTrigger
  * -------------------------------------------------------------------------- */
 
+type SheetTriggerProps = SheetPrimitive.DialogTriggerProps;
 const SheetTrigger = SheetPrimitive.Trigger;
 
 /* -----------------------------------------------------------------------------
  * Component: SheetClose
  * -------------------------------------------------------------------------- */
 
+type SheetCloseProps = SheetPrimitive.DialogCloseProps;
 const SheetClose = SheetPrimitive.Close;
 
 /* -----------------------------------------------------------------------------
  * Component: SheetContent
  * -------------------------------------------------------------------------- */
 
+type SheetContentProps = SheetPrimitive.DialogContentProps & SheetVariantsProps;
 const SheetContent = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Content>,
-  SheetPrimitive.DialogContentProps & VariantProps<typeof sheetVariants>
+  SheetContentProps
 >(({ side = "right", className, children, ...props }, ref) => (
   <SheetPrimitive.Portal>
     <SheetPrimitive.Overlay
@@ -82,10 +88,11 @@ SheetContent.displayName = SheetPrimitive.Content.displayName;
  * Component: SheetHeader
  * -------------------------------------------------------------------------- */
 
+type SheetHeaderProps = React.HTMLAttributes<HTMLDivElement>;
 function SheetHeader({
   className,
   ...props
-}: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element {
+}: SheetHeaderProps): React.JSX.Element {
   return (
     <div
       className={cn(
@@ -101,10 +108,11 @@ function SheetHeader({
  * Component: SheetFooter
  * -------------------------------------------------------------------------- */
 
+type SheetFooterProps = React.HTMLAttributes<HTMLDivElement>;
 function SheetFooter({
   className,
   ...props
-}: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element {
+}: SheetFooterProps): React.JSX.Element {
   return (
     <div
       className={cn(
@@ -121,9 +129,10 @@ SheetFooter.displayName = "SheetFooter";
  * Component: SheetTitle
  * -------------------------------------------------------------------------- */
 
+type SheetTitleProps = SheetPrimitive.DialogTitleProps;
 const SheetTitle = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Title>,
-  SheetPrimitive.DialogTitleProps
+  SheetTitleProps
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Title
     ref={ref}
@@ -137,9 +146,10 @@ SheetTitle.displayName = SheetPrimitive.Title.displayName;
  * Component: SheetDescription
  * -------------------------------------------------------------------------- */
 
+type SheetDescriptionProps = SheetPrimitive.DialogDescriptionProps;
 const SheetDescription = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Description>,
-  SheetPrimitive.DialogDescriptionProps
+  SheetDescriptionProps
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Description
     ref={ref}
@@ -162,4 +172,12 @@ export {
   SheetFooter,
   SheetTitle,
   SheetDescription,
+  type SheetProps,
+  type SheetTriggerProps,
+  type SheetCloseProps,
+  type SheetContentProps,
+  type SheetHeaderProps,
+  type SheetFooterProps,
+  type SheetTitleProps,
+  type SheetDescriptionProps,
 };

package/src/skeleton.tsx

@@ -5,10 +5,8 @@ import { cn } from "./utils";
  * Component: Skeleton
  * -------------------------------------------------------------------------- */
 
-function Skeleton({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element {
+type SkeletonProps = React.HTMLAttributes<HTMLDivElement>;
+function Skeleton({ className, ...props }: SkeletonProps): React.JSX.Element {
   return (
     <div
       className={cn("bg-primary/10 animate-pulse rounded-md", className)}
@@ -21,4 +19,4 @@ function Skeleton({
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Skeleton };
+export { Skeleton, type SkeletonProps };

package/src/slider.tsx

@@ -8,9 +8,10 @@ import { cn } from "./utils";
  * Component: Slider
  * -------------------------------------------------------------------------- */
 
+type SliderProps = SliderPrimitive.SliderProps;
 const Slider = React.forwardRef<
   React.ElementRef<typeof SliderPrimitive.Root>,
-  SliderPrimitive.SliderProps
+  SliderProps
 >(({ className, ...props }, ref) => (
   <SliderPrimitive.Root
     ref={ref}
@@ -32,4 +33,4 @@ Slider.displayName = SliderPrimitive.Root.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Slider };
+export { Slider, type SliderProps };

package/src/sonner.tsx

@@ -40,4 +40,4 @@ function Toaster({ ...props }: ToasterProps): React.JSX.Element {
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Toaster, toast };
+export { Toaster, toast, type ToasterProps };

package/src/strong.tsx

@@ -5,18 +5,20 @@ import { Slot } from "@radix-ui/react-slot";
  * Component: Strong
  * -------------------------------------------------------------------------- */
 
-const Strong = React.forwardRef<
-  HTMLElement,
-  React.HTMLAttributes<HTMLElement> & { asChild?: boolean }
->(({ asChild, ...props }, ref) => {
-  const Comp = asChild ? Slot : "strong";
+interface StrongProps extends React.HTMLAttributes<HTMLElement> {
+  asChild?: boolean;
+}
+const Strong = React.forwardRef<HTMLElement, StrongProps>(
+  ({ asChild, ...props }, ref) => {
+    const Comp = asChild ? Slot : "strong";
 
-  return <Comp ref={ref} {...props} />;
-});
+    return <Comp ref={ref} {...props} />;
+  },
+);
 Strong.displayName = "Strong";
 
 /* -----------------------------------------------------------------------------
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Strong };
+export { Strong, type StrongProps };

package/src/switch.tsx

@@ -8,9 +8,10 @@ import { cn } from "./utils";
  * Component: Switch
  * -------------------------------------------------------------------------- */
 
+type SwitchProps = SwitchPrimitives.SwitchProps;
 const Switch = React.forwardRef<
   React.ElementRef<typeof SwitchPrimitives.Root>,
-  SwitchPrimitives.SwitchProps
+  SwitchProps
 >(({ className, ...props }, ref) => (
   <SwitchPrimitives.Root
     className={cn(
@@ -29,4 +30,4 @@ Switch.displayName = SwitchPrimitives.Root.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Switch };
+export { Switch, type SwitchProps };

package/src/table.tsx

@@ -5,128 +5,132 @@ import { cn } from "./utils";
  * Component: Table
  * -------------------------------------------------------------------------- */
 
-const Table = React.forwardRef<
-  HTMLTableElement,
-  React.HTMLAttributes<HTMLTableElement>
->(({ className, ...props }, ref) => (
-  <div className="relative w-full overflow-auto">
-    <table
-      ref={ref}
-      className={cn("w-full caption-bottom text-sm", className)}
-      {...props}
-    />
-  </div>
-));
+type TableProps = React.HTMLAttributes<HTMLTableElement>;
+const Table = React.forwardRef<HTMLTableElement, TableProps>(
+  ({ className, ...props }, ref) => (
+    <div className="relative w-full overflow-auto">
+      <table
+        ref={ref}
+        className={cn("w-full caption-bottom text-sm", className)}
+        {...props}
+      />
+    </div>
+  ),
+);
 Table.displayName = "Table";
 
 /* -----------------------------------------------------------------------------
  * Component: TableHeader
  * -------------------------------------------------------------------------- */
 
-const TableHeader = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-));
+type TableHeaderProps = React.HTMLAttributes<HTMLTableSectionElement>;
+const TableHeader = React.forwardRef<HTMLTableSectionElement, TableHeaderProps>(
+  ({ className, ...props }, ref) => (
+    <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
+  ),
+);
 TableHeader.displayName = "TableHeader";
 
 /* -----------------------------------------------------------------------------
  * Component: TableBody
  * -------------------------------------------------------------------------- */
 
-const TableBody = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tbody
-    ref={ref}
-    className={cn("[&_tr:last-child]:border-0", className)}
-    {...props}
-  />
-));
+type TableBodyProps = React.HTMLAttributes<HTMLTableSectionElement>;
+const TableBody = React.forwardRef<HTMLTableSectionElement, TableBodyProps>(
+  ({ className, ...props }, ref) => (
+    <tbody
+      ref={ref}
+      className={cn("[&_tr:last-child]:border-0", className)}
+      {...props}
+    />
+  ),
+);
 TableBody.displayName = "TableBody";
 
 /* -----------------------------------------------------------------------------
  * Component: TableFooter
  * -------------------------------------------------------------------------- */
 
-const TableFooter = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tfoot
-    ref={ref}
-    className={cn(
-      "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
-      className,
-    )}
-    {...props}
-  />
-));
+type TableFooterProps = React.HTMLAttributes<HTMLTableSectionElement>;
+const TableFooter = React.forwardRef<HTMLTableSectionElement, TableFooterProps>(
+  ({ className, ...props }, ref) => (
+    <tfoot
+      ref={ref}
+      className={cn(
+        "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
 TableFooter.displayName = "TableFooter";
 
 /* -----------------------------------------------------------------------------
  * Component: TableRow
  * -------------------------------------------------------------------------- */
 
-const TableRow = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
-      className,
-    )}
-    {...props}
-  />
-));
+type TableRowProps = React.HTMLAttributes<HTMLTableRowElement>;
+const TableRow = React.forwardRef<HTMLTableRowElement, TableRowProps>(
+  ({ className, ...props }, ref) => (
+    <tr
+      ref={ref}
+      className={cn(
+        "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
 TableRow.displayName = "TableRow";
 
 /* -----------------------------------------------------------------------------
  * Component: TableHead
  * -------------------------------------------------------------------------- */
 
-const TableHead = React.forwardRef<
-  HTMLTableCellElement,
-  React.ThHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <th
-    ref={ref}
-    className={cn(
-      "text-muted-foreground h-12 px-4 text-left align-middle font-medium [&:has([role=checkbox])]:pr-0",
-      className,
-    )}
-    {...props}
-  />
-));
+type TableHeadProps = React.ThHTMLAttributes<HTMLTableCellElement>;
+const TableHead = React.forwardRef<HTMLTableCellElement, TableHeadProps>(
+  ({ className, ...props }, ref) => (
+    <th
+      ref={ref}
+      className={cn(
+        "text-muted-foreground h-12 px-4 text-left align-middle font-medium [&:has([role=checkbox])]:pr-0",
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
 TableHead.displayName = "TableHead";
 
 /* -----------------------------------------------------------------------------
  * Component: TableCell
  * -------------------------------------------------------------------------- */
 
-const TableCell = React.forwardRef<
-  HTMLTableCellElement,
-  React.TdHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <td
-    ref={ref}
-    className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
-    {...props}
-  />
-));
+type TableCellProps = React.TdHTMLAttributes<HTMLTableCellElement>;
+const TableCell = React.forwardRef<HTMLTableCellElement, TableCellProps>(
+  ({ className, ...props }, ref) => (
+    <td
+      ref={ref}
+      className={cn(
+        "p-4 align-middle [&:has([role=checkbox])]:pr-0",
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
 TableCell.displayName = "TableCell";
 
 /* -----------------------------------------------------------------------------
  * Component: TableCaption
  * -------------------------------------------------------------------------- */
 
+type TableCaptionProps = React.HTMLAttributes<HTMLTableCaptionElement>;
 const TableCaption = React.forwardRef<
   HTMLTableCaptionElement,
-  React.HTMLAttributes<HTMLTableCaptionElement>
+  TableCaptionProps
 >(({ className, ...props }, ref) => (
   <caption
     ref={ref}
@@ -149,4 +153,12 @@ export {
   TableRow,
   TableCell,
   TableCaption,
+  type TableProps,
+  type TableHeaderProps,
+  type TableBodyProps,
+  type TableFooterProps,
+  type TableHeadProps,
+  type TableRowProps,
+  type TableCellProps,
+  type TableCaptionProps,
 };

package/src/tabs.tsx

@@ -8,15 +8,17 @@ import { cn } from "./utils";
  * Component: Tabs
  * -------------------------------------------------------------------------- */
 
+type TabsProps = TabsPrimitive.TabsProps;
 const Tabs = TabsPrimitive.Root;
 
 /* -----------------------------------------------------------------------------
  * Component: TabsList
  * -------------------------------------------------------------------------- */
 
+type TabsListProps = TabsPrimitive.TabsListProps;
 const TabsList = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.List>,
-  TabsPrimitive.TabsListProps
+  TabsListProps
 >(({ className, ...props }, ref) => (
   <TabsPrimitive.List
     ref={ref}
@@ -33,9 +35,10 @@ TabsList.displayName = TabsPrimitive.List.displayName;
  * Component: TabsTrigger
  * -------------------------------------------------------------------------- */
 
+type TabsTriggerProps = TabsPrimitive.TabsTriggerProps;
 const TabsTrigger = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Trigger>,
-  TabsPrimitive.TabsTriggerProps
+  TabsTriggerProps
 >(({ className, ...props }, ref) => (
   <TabsPrimitive.Trigger
     ref={ref}
@@ -52,9 +55,10 @@ TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
  * Component: TabsContent
  * -------------------------------------------------------------------------- */
 
+type TabsContentProps = TabsPrimitive.TabsContentProps;
 const TabsContent = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Content>,
-  TabsPrimitive.TabsContentProps
+  TabsContentProps
 >(({ className, ...props }, ref) => (
   <TabsPrimitive.Content
     ref={ref}
@@ -71,4 +75,13 @@ TabsContent.displayName = TabsPrimitive.Content.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Tabs, TabsList, TabsTrigger, TabsContent };
+export {
+  Tabs,
+  TabsList,
+  TabsTrigger,
+  TabsContent,
+  type TabsProps,
+  type TabsListProps,
+  type TabsTriggerProps,
+  type TabsContentProps,
+};

package/src/text.tsx

@@ -31,4 +31,4 @@ Text.displayName = "Text";
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Text };
+export { Text, type TextProps };

package/src/textarea.tsx

@@ -5,25 +5,25 @@ import { cn } from "./utils";
  * Component: Textarea
  * -------------------------------------------------------------------------- */
 
-const Textarea = React.forwardRef<
-  HTMLTextAreaElement,
-  React.TextareaHTMLAttributes<HTMLTextAreaElement>
->(({ className, ...props }, ref) => {
-  return (
-    <textarea
-      className={cn(
-        "border-input placeholder:text-muted-foreground focus-visible:ring-ring focus-visible:ring-offset-background flex min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-        className,
-      )}
-      ref={ref}
-      {...props}
-    />
-  );
-});
+type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
+  ({ className, ...props }, ref) => {
+    return (
+      <textarea
+        className={cn(
+          "border-input placeholder:text-muted-foreground focus-visible:ring-ring focus-visible:ring-offset-background flex min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          className,
+        )}
+        ref={ref}
+        {...props}
+      />
+    );
+  },
+);
 Textarea.displayName = "Textarea";
 
 /* -----------------------------------------------------------------------------
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { Textarea };
+export { Textarea, type TextareaProps };