@codefast/ui 0.0.40 → 0.0.42

package/src/react/progress.tsx

@@ -1,30 +1,37 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { cn } from "../lib/utils";
+import * as React from 'react';
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import { cn } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: Progress
  * -------------------------------------------------------------------------- */
 
 type ProgressElement = React.ElementRef<typeof ProgressPrimitive.Root>;
-type ProgressProps = React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>;
+type ProgressProps = React.ComponentPropsWithoutRef<
+  typeof ProgressPrimitive.Root
+>;
 
-const Progress = React.forwardRef<ProgressElement, ProgressProps>(({ className, value, ...props }, ref) => (
-  <ProgressPrimitive.Root
-    ref={ref}
-    className={cn("bg-primary/20 relative h-2 w-full overflow-hidden rounded-full", className)}
-    {...props}
-  >
-    <ProgressPrimitive.Indicator
-      className="bg-primary size-full flex-1 transition"
-      style={{
-        transform: `translateX(-${String(100 - (value ?? 0))}%)`,
-      }}
-    />
-  </ProgressPrimitive.Root>
-));
+const Progress = React.forwardRef<ProgressElement, ProgressProps>(
+  ({ className, value, ...props }, ref) => (
+    <ProgressPrimitive.Root
+      ref={ref}
+      className={cn(
+        'bg-primary/20 relative h-2 w-full overflow-hidden rounded-full',
+        className,
+      )}
+      {...props}
+    >
+      <ProgressPrimitive.Indicator
+        className="bg-primary size-full flex-1 transition"
+        style={{
+          transform: `translateX(-${String(100 - (value ?? 0))}%)`,
+        }}
+      />
+    </ProgressPrimitive.Root>
+  ),
+);
 
 Progress.displayName = ProgressPrimitive.Root.displayName;
 

package/src/react/quote.tsx

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { Slot } from "@radix-ui/react-slot";
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
 
 /* -----------------------------------------------------------------------------
  * Component: Quote
@@ -11,13 +11,15 @@ interface QuoteProps extends React.QuoteHTMLAttributes<HTMLQuoteElement> {
   asChild?: boolean;
 }
 
-const Quote = React.forwardRef<QuoteElement, QuoteProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot : "q";
+const Quote = React.forwardRef<QuoteElement, QuoteProps>(
+  ({ asChild, ...props }, ref) => {
+    const Component = asChild ? Slot : 'q';
 
-  return <Component ref={ref} {...props} />;
-});
+    return <Component ref={ref} {...props} />;
+  },
+);
 
-Quote.displayName = "Quote";
+Quote.displayName = 'Quote';
 
 /* -----------------------------------------------------------------------------
  * Exports

package/src/react/radio-cards.tsx

@@ -1,19 +1,29 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import { cn } from "../lib/utils";
+import * as React from 'react';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import { cn } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: RadioCards
  * -------------------------------------------------------------------------- */
 
 type RadioCardsElement = React.ElementRef<typeof RadioGroupPrimitive.Root>;
-type RadioCardsProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>;
+type RadioCardsProps = React.ComponentPropsWithoutRef<
+  typeof RadioGroupPrimitive.Root
+>;
 
-const RadioCards = React.forwardRef<RadioCardsElement, RadioCardsProps>(({ className, ...props }, ref) => {
-  return <RadioGroupPrimitive.Root className={cn("grid gap-2", className)} {...props} ref={ref} />;
-});
+const RadioCards = React.forwardRef<RadioCardsElement, RadioCardsProps>(
+  ({ className, ...props }, ref) => {
+    return (
+      <RadioGroupPrimitive.Root
+        className={cn('grid gap-2', className)}
+        {...props}
+        ref={ref}
+      />
+    );
+  },
+);
 
 RadioCards.displayName = RadioGroupPrimitive.Root.displayName;
 
@@ -22,14 +32,19 @@ RadioCards.displayName = RadioGroupPrimitive.Root.displayName;
  * -------------------------------------------------------------------------- */
 
 type RadioCardsItemElement = React.ElementRef<typeof RadioGroupPrimitive.Item>;
-type RadioCardsItemProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>;
+type RadioCardsItemProps = React.ComponentPropsWithoutRef<
+  typeof RadioGroupPrimitive.Item
+>;
 
-const RadioCardsItem = React.forwardRef<RadioCardsItemElement, RadioCardsItemProps>(({ className, ...props }, ref) => {
+const RadioCardsItem = React.forwardRef<
+  RadioCardsItemElement,
+  RadioCardsItemProps
+>(({ className, ...props }, ref) => {
   return (
     <RadioGroupPrimitive.Item
       ref={ref}
       className={cn(
-        "text-compound-foreground focus-visible:bg-primary/10 group peer flex cursor-default items-center justify-center rounded-md border p-4 focus-visible:outline focus-visible:outline-2 disabled:cursor-not-allowed disabled:opacity-50 aria-checked:outline aria-checked:outline-2",
+        'text-compound-foreground focus-visible:bg-primary/10 group peer flex cursor-default items-center justify-center rounded-md border p-4 focus-visible:outline focus-visible:outline-2 disabled:cursor-not-allowed disabled:opacity-50 aria-checked:outline aria-checked:outline-2',
         className,
       )}
       {...props}
@@ -43,4 +58,9 @@ RadioCardsItem.displayName = RadioGroupPrimitive.Item.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { RadioCards, RadioCardsItem, type RadioCardsProps, type RadioCardsItemProps };
+export {
+  RadioCards,
+  RadioCardsItem,
+  type RadioCardsProps,
+  type RadioCardsItemProps,
+};

package/src/react/radio-group.tsx

@@ -1,19 +1,29 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import { cn } from "../lib/utils";
+import * as React from 'react';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import { cn } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: RadioGroup
  * -------------------------------------------------------------------------- */
 
 type RadioGroupElement = React.ElementRef<typeof RadioGroupPrimitive.Root>;
-type RadioGroupProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>;
+type RadioGroupProps = React.ComponentPropsWithoutRef<
+  typeof RadioGroupPrimitive.Root
+>;
 
-const RadioGroup = React.forwardRef<RadioGroupElement, RadioGroupProps>(({ className, ...props }, ref) => {
-  return <RadioGroupPrimitive.Root className={cn("grid gap-2", className)} {...props} ref={ref} />;
-});
+const RadioGroup = React.forwardRef<RadioGroupElement, RadioGroupProps>(
+  ({ className, ...props }, ref) => {
+    return (
+      <RadioGroupPrimitive.Root
+        className={cn('grid gap-2', className)}
+        {...props}
+        ref={ref}
+      />
+    );
+  },
+);
 
 RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
 
@@ -22,14 +32,19 @@ RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
  * -------------------------------------------------------------------------- */
 
 type RadioGroupItemElement = React.ElementRef<typeof RadioGroupPrimitive.Item>;
-type RadioGroupItemProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>;
+type RadioGroupItemProps = React.ComponentPropsWithoutRef<
+  typeof RadioGroupPrimitive.Item
+>;
 
-const RadioGroupItem = React.forwardRef<RadioGroupItemElement, RadioGroupItemProps>(({ className, ...props }, ref) => {
+const RadioGroupItem = React.forwardRef<
+  RadioGroupItemElement,
+  RadioGroupItemProps
+>(({ className, ...props }, ref) => {
   return (
     <RadioGroupPrimitive.Item
       ref={ref}
       className={cn(
-        "border-compound/70 hover:border-compound text-compound-foreground aria-checked:border-primary group peer aspect-square size-4 rounded-full border focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        'border-compound/70 hover:border-compound text-compound-foreground aria-checked:border-primary group peer aspect-square size-4 rounded-full border focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
         className,
       )}
       {...props}
@@ -45,4 +60,9 @@ RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { RadioGroup, RadioGroupItem, type RadioGroupProps, type RadioGroupItemProps };
+export {
+  RadioGroup,
+  RadioGroupItem,
+  type RadioGroupProps,
+  type RadioGroupItemProps,
+};

package/src/react/radio.tsx

@@ -1,8 +1,8 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import { composeEventHandlers } from "@radix-ui/primitive";
-import { cn } from "../lib/utils";
+import * as React from 'react';
+import { composeEventHandlers } from '@radix-ui/primitive';
+import { cn } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: Radio
@@ -14,22 +14,26 @@ interface RadioProps extends React.InputHTMLAttributes<HTMLInputElement> {
   onValueChange?: (value: string) => void;
 }
 
-const Radio = React.forwardRef<RadioElement, RadioProps>(({ className, onValueChange, onChange, ...props }, ref) => {
-  return (
-    <input
-      ref={ref}
-      type="radio"
-      onChange={composeEventHandlers(onChange, (event) => onValueChange?.(event.currentTarget.value))}
-      className={cn(
-        "before:border-compound/70 hover:before:border-compound checked:before:border-primary checked:after:bg-primary peer relative flex appearance-none items-center justify-center rounded-full before:size-4 before:rounded-full before:border checked:after:absolute checked:after:size-2.5 checked:after:rounded-full focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-        className,
-      )}
-      {...props}
-    />
-  );
-});
-
-Radio.displayName = "Radio";
+const Radio = React.forwardRef<RadioElement, RadioProps>(
+  ({ className, onValueChange, onChange, ...props }, ref) => {
+    return (
+      <input
+        ref={ref}
+        type="radio"
+        onChange={composeEventHandlers(onChange, (event) =>
+          onValueChange?.(event.currentTarget.value),
+        )}
+        className={cn(
+          'before:border-compound/70 hover:before:border-compound checked:before:border-primary checked:after:bg-primary peer relative flex appearance-none items-center justify-center rounded-full before:size-4 before:rounded-full before:border checked:after:absolute checked:after:size-2.5 checked:after:rounded-full focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+          className,
+        )}
+        {...props}
+      />
+    );
+  },
+);
+
+Radio.displayName = 'Radio';
 
 /* -----------------------------------------------------------------------------
  * Exports

package/src/react/resizable.tsx

@@ -1,9 +1,9 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import * as ResizablePrimitive from "react-resizable-panels";
-import { DragHandleDots2Icon } from "@radix-ui/react-icons";
-import { cn } from "../lib/utils";
+import * as React from 'react';
+import * as ResizablePrimitive from 'react-resizable-panels';
+import { DragHandleDots2Icon } from '@radix-ui/react-icons';
+import { cn } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: ResizablePanelGroup
@@ -12,10 +12,15 @@ import { cn } from "../lib/utils";
 function ResizablePanelGroup({
   className,
   ...props
-}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>): React.JSX.Element {
+}: React.ComponentProps<
+  typeof ResizablePrimitive.PanelGroup
+>): React.JSX.Element {
   return (
     <ResizablePrimitive.PanelGroup
-      className={cn("flex size-full data-[panel-group-direction=vertical]:flex-col", className)}
+      className={cn(
+        'flex size-full data-[panel-group-direction=vertical]:flex-col',
+        className,
+      )}
       {...props}
     />
   );
@@ -41,7 +46,7 @@ function ResizableHandle({
   return (
     <ResizablePrimitive.PanelResizeHandle
       className={cn(
-        "bg-border relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90",
+        'bg-border relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90',
         className,
       )}
       {...props}

package/src/react/scroll-area.tsx

@@ -1,24 +1,34 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { cn } from "../lib/utils";
+import * as React from 'react';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import { cn } from '../lib/utils';
 
 /* -----------------------------------------------------------------------------
  * Component: ScrollArea
  * -------------------------------------------------------------------------- */
 
 type ScrollAreaElement = React.ElementRef<typeof ScrollAreaPrimitive.Root>;
-type ScrollAreaProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>;
-
-const ScrollArea = React.forwardRef<ScrollAreaElement, ScrollAreaProps>(({ children, className, ...props }, ref) => (
-  <ScrollAreaPrimitive.Root ref={ref} className={cn("relative overflow-hidden", className)} {...props}>
-    <ScrollAreaPrimitive.Viewport className="size-full rounded-[inherit]">{children}</ScrollAreaPrimitive.Viewport>
-    <ScrollAreaScrollbar orientation="vertical" />
-    <ScrollAreaScrollbar orientation="horizontal" />
-    <ScrollAreaPrimitive.Corner />
-  </ScrollAreaPrimitive.Root>
-));
+type ScrollAreaProps = React.ComponentPropsWithoutRef<
+  typeof ScrollAreaPrimitive.Root
+>;
+
+const ScrollArea = React.forwardRef<ScrollAreaElement, ScrollAreaProps>(
+  ({ children, className, ...props }, ref) => (
+    <ScrollAreaPrimitive.Root
+      ref={ref}
+      className={cn('relative overflow-hidden', className)}
+      {...props}
+    >
+      <ScrollAreaPrimitive.Viewport className="size-full rounded-[inherit]">
+        {children}
+      </ScrollAreaPrimitive.Viewport>
+      <ScrollAreaScrollbar orientation="vertical" />
+      <ScrollAreaScrollbar orientation="horizontal" />
+      <ScrollAreaPrimitive.Corner />
+    </ScrollAreaPrimitive.Root>
+  ),
+);
 
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
 
@@ -26,26 +36,33 @@ ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
  * Component: ScrollAreaScrollbar
  * -------------------------------------------------------------------------- */
 
-type ScrollAreaScrollbarElement = React.ElementRef<typeof ScrollAreaPrimitive.Scrollbar>;
-type ScrollAreaScrollbarProps = React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Scrollbar>;
+type ScrollAreaScrollbarElement = React.ElementRef<
+  typeof ScrollAreaPrimitive.Scrollbar
+>;
+type ScrollAreaScrollbarProps = React.ComponentPropsWithoutRef<
+  typeof ScrollAreaPrimitive.Scrollbar
+>;
 
-const ScrollAreaScrollbar = React.forwardRef<ScrollAreaScrollbarElement, ScrollAreaScrollbarProps>(
-  ({ className, orientation = "vertical", ...props }, ref) => (
-    <ScrollAreaPrimitive.Scrollbar
-      ref={ref}
-      orientation={orientation}
-      className={cn(
-        "flex touch-none select-none transition",
-        orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-px",
-        orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-px",
-        className,
-      )}
-      {...props}
-    >
-      <ScrollAreaPrimitive.ScrollAreaThumb className="bg-border relative flex-1 rounded-full" />
-    </ScrollAreaPrimitive.Scrollbar>
-  ),
-);
+const ScrollAreaScrollbar = React.forwardRef<
+  ScrollAreaScrollbarElement,
+  ScrollAreaScrollbarProps
+>(({ className, orientation = 'vertical', ...props }, ref) => (
+  <ScrollAreaPrimitive.Scrollbar
+    ref={ref}
+    orientation={orientation}
+    className={cn(
+      'flex touch-none select-none transition',
+      orientation === 'vertical' &&
+        'h-full w-2.5 border-l border-l-transparent p-px',
+      orientation === 'horizontal' &&
+        'h-2.5 flex-col border-t border-t-transparent p-px',
+      className,
+    )}
+    {...props}
+  >
+    <ScrollAreaPrimitive.ScrollAreaThumb className="bg-border relative flex-1 rounded-full" />
+  </ScrollAreaPrimitive.Scrollbar>
+));
 
 ScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;
 
@@ -53,4 +70,9 @@ ScrollAreaScrollbar.displayName = ScrollAreaPrimitive.Scrollbar.displayName;
  * Exports
  * -------------------------------------------------------------------------- */
 
-export { ScrollArea, ScrollAreaScrollbar, type ScrollAreaProps, type ScrollAreaScrollbarProps };
+export {
+  ScrollArea,
+  ScrollAreaScrollbar,
+  type ScrollAreaProps,
+  type ScrollAreaScrollbarProps,
+};

package/src/react/section.tsx

@@ -1,5 +1,5 @@
-import * as React from "react";
-import { Slot } from "@radix-ui/react-slot";
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
 
 /* -----------------------------------------------------------------------------
  * Component: Section
@@ -11,13 +11,15 @@ interface SectionProps extends React.HTMLAttributes<HTMLElement> {
   asChild?: boolean;
 }
 
-const Section = React.forwardRef<SectionElement, SectionProps>(({ asChild, ...props }, ref) => {
-  const Component = asChild ? Slot : "section";
+const Section = React.forwardRef<SectionElement, SectionProps>(
+  ({ asChild, ...props }, ref) => {
+    const Component = asChild ? Slot : 'section';
 
-  return <Component ref={ref} {...props} />;
-});
+    return <Component ref={ref} {...props} />;
+  },
+);
 
-Section.displayName = "Section";
+Section.displayName = 'Section';
 
 /* -----------------------------------------------------------------------------
  * Exports