@codefast/ui 0.0.9 → 0.0.11

package/src/spinner.tsx

@@ -0,0 +1,71 @@
+import * as React from "react";
+import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
+import { cn } from "./utils";
+
+/* -----------------------------------------------------------------------------
+ * Component: Spinner
+ * -------------------------------------------------------------------------- */
+
+const spinnerCount = 8;
+
+type SpinnerElement = HTMLSpanElement;
+
+interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {
+  loading?: boolean;
+}
+
+const Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(
+  ({ className, loading = true, children, ...props }, ref) => {
+    if (!loading) {
+      return children;
+    }
+
+    const spinner = (
+      <span
+        ref={ref}
+        className={cn("relative flex size-4 items-center justify-center opacity-60", className)}
+        {...props}
+      >
+        {Array.from({ length: spinnerCount }, (_, i) => (
+          <span
+            key={i}
+            className={cn(
+              "absolute h-full rotate-[var(--spinner-rotate)]",
+              "before:fade-out-25 before:animate-out before:repeat-infinite before:block before:h-1/3 before:w-full before:rounded-full before:bg-current before:[animation-delay:var(--spinner-delay)] before:[animation-duration:var(--spinner-duration)]",
+            )}
+            style={
+              {
+                width: `${(100 / spinnerCount).toString()}%`,
+                "--spinner-delay": `-${((spinnerCount - i) * 100).toString()}ms`,
+                "--spinner-rotate": `${((360 / spinnerCount) * i).toString()}deg`,
+                "--spinner-duration": `${(spinnerCount * 100).toString()}ms`,
+              } as React.CSSProperties
+            }
+          />
+        ))}
+      </span>
+    );
+
+    if (children === undefined) {
+      return spinner;
+    }
+
+    return (
+      <span className="relative">
+        <span aria-hidden className="invisible contents">
+          {children}
+        </span>
+        <VisuallyHidden>{children}</VisuallyHidden>
+        <span className="absolute inset-0 flex items-center justify-center">{spinner}</span>
+      </span>
+    );
+  },
+);
+
+Spinner.displayName = "Spinner";
+
+/* -----------------------------------------------------------------------------
+ * Exports
+ * -------------------------------------------------------------------------- */
+
+export { Spinner, type SpinnerProps };

package/src/strong.tsx

@@ -5,16 +5,18 @@ import { Slot } from "@radix-ui/react-slot";
  * Component: Strong
  * -------------------------------------------------------------------------- */
 
+type StrongElement = HTMLElement;
+
 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} />;
-  },
-);
+const Strong = React.forwardRef<StrongElement, StrongProps>(({ asChild, ...props }, ref) => {
+  const Component = asChild ? Slot : "strong";
+
+  return <Component ref={ref} {...props} />;
+});
+
 Strong.displayName = "Strong";
 
 /* -----------------------------------------------------------------------------

package/src/switch.tsx

@@ -8,14 +8,14 @@ import { cn } from "./utils";
  * Component: Switch
  * -------------------------------------------------------------------------- */
 
-type SwitchProps = SwitchPrimitives.SwitchProps;
-const Switch = React.forwardRef<
-  React.ElementRef<typeof SwitchPrimitives.Root>,
-  SwitchProps
->(({ className, ...props }, ref) => (
+type SwitchElement = React.ElementRef<typeof SwitchPrimitives.Root>;
+type SwitchProps = React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>;
+
+const Switch = React.forwardRef<SwitchElement, SwitchProps>(({ className, ...props }, ref) => (
   <SwitchPrimitives.Root
     className={cn(
-      "focus-visible:ring-ring focus-visible:ring-offset-background data-[state=checked]:bg-primary data-[state=unchecked]:bg-input peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+      "data-[state=checked]:bg-primary data-[state=unchecked]:bg-input peer inline-flex h-5 w-9 shrink-0 items-center rounded-full border-2 border-transparent shadow-sm transition-colors disabled:cursor-not-allowed disabled:opacity-50",
+      "focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
       className,
     )}
     {...props}
@@ -24,6 +24,7 @@ const Switch = React.forwardRef<
     <SwitchPrimitives.Thumb className="bg-background pointer-events-none block size-4 rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0" />
   </SwitchPrimitives.Root>
 ));
+
 Switch.displayName = SwitchPrimitives.Root.displayName;
 
 /* -----------------------------------------------------------------------------

package/src/table.tsx

@@ -5,139 +5,117 @@ import { cn } from "./utils";
  * Component: Table
  * -------------------------------------------------------------------------- */
 
+type TableElement = HTMLTableElement;
 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>
-  ),
-);
+
+const Table = React.forwardRef<TableElement, 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
  * -------------------------------------------------------------------------- */
 
+type TableHeaderElement = HTMLTableSectionElement;
 type TableHeaderProps = React.HTMLAttributes<HTMLTableSectionElement>;
-const TableHeader = React.forwardRef<HTMLTableSectionElement, TableHeaderProps>(
-  ({ className, ...props }, ref) => (
-    <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-  ),
-);
+
+const TableHeader = React.forwardRef<TableHeaderElement, TableHeaderProps>(({ className, ...props }, ref) => (
+  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
+));
+
 TableHeader.displayName = "TableHeader";
 
 /* -----------------------------------------------------------------------------
  * Component: TableBody
  * -------------------------------------------------------------------------- */
 
+type TableBodyElement = HTMLTableSectionElement;
 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}
-    />
-  ),
-);
+
+const TableBody = React.forwardRef<TableBodyElement, TableBodyProps>(({ className, ...props }, ref) => (
+  <tbody ref={ref} className={cn("[&_tr:last-child]:border-0", className)} {...props} />
+));
+
 TableBody.displayName = "TableBody";
 
 /* -----------------------------------------------------------------------------
  * Component: TableFooter
  * -------------------------------------------------------------------------- */
 
+type TableFooterElement = HTMLTableSectionElement;
 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}
-    />
-  ),
-);
+
+const TableFooter = React.forwardRef<TableFooterElement, 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
  * -------------------------------------------------------------------------- */
 
+type TableRowElement = HTMLTableRowElement;
 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}
-    />
-  ),
-);
+
+const TableRow = React.forwardRef<TableRowElement, 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
  * -------------------------------------------------------------------------- */
 
+type TableHeadElement = HTMLTableCellElement;
 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}
-    />
-  ),
-);
+
+const TableHead = React.forwardRef<TableHeadElement, 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
  * -------------------------------------------------------------------------- */
 
+type TableCellElement = HTMLTableCellElement;
 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}
-    />
-  ),
-);
+
+const TableCell = React.forwardRef<TableCellElement, 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 TableCaptionElement = HTMLTableCaptionElement;
 type TableCaptionProps = React.HTMLAttributes<HTMLTableCaptionElement>;
-const TableCaption = React.forwardRef<
-  HTMLTableCaptionElement,
-  TableCaptionProps
->(({ className, ...props }, ref) => (
-  <caption
-    ref={ref}
-    className={cn("text-muted-foreground mt-4 text-sm", className)}
-    {...props}
-  />
+
+const TableCaption = React.forwardRef<TableCaptionElement, TableCaptionProps>(({ className, ...props }, ref) => (
+  <caption ref={ref} className={cn("text-muted-foreground mt-4 text-sm", className)} {...props} />
 ));
+
 TableCaption.displayName = "TableCaption";
 
 /* -----------------------------------------------------------------------------

package/src/tabs.tsx

@@ -8,18 +8,17 @@ import { cn } from "./utils";
  * Component: Tabs
  * -------------------------------------------------------------------------- */
 
-type TabsProps = TabsPrimitive.TabsProps;
+type TabsProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>;
 const Tabs = TabsPrimitive.Root;
 
 /* -----------------------------------------------------------------------------
  * Component: TabsList
  * -------------------------------------------------------------------------- */
 
-type TabsListProps = TabsPrimitive.TabsListProps;
-const TabsList = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.List>,
-  TabsListProps
->(({ className, ...props }, ref) => (
+type TabsListElement = React.ElementRef<typeof TabsPrimitive.List>;
+type TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>;
+
+const TabsList = React.forwardRef<TabsListElement, TabsListProps>(({ className, ...props }, ref) => (
   <TabsPrimitive.List
     ref={ref}
     className={cn(
@@ -29,46 +28,49 @@ const TabsList = React.forwardRef<
     {...props}
   />
 ));
+
 TabsList.displayName = TabsPrimitive.List.displayName;
 
 /* -----------------------------------------------------------------------------
  * Component: TabsTrigger
  * -------------------------------------------------------------------------- */
 
-type TabsTriggerProps = TabsPrimitive.TabsTriggerProps;
-const TabsTrigger = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Trigger>,
-  TabsTriggerProps
->(({ className, ...props }, ref) => (
+type TabsTriggerElement = React.ElementRef<typeof TabsPrimitive.Trigger>;
+type TabsTriggerProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>;
+
+const TabsTrigger = React.forwardRef<TabsTriggerElement, TabsTriggerProps>(({ className, ...props }, ref) => (
   <TabsPrimitive.Trigger
     ref={ref}
     className={cn(
-      "focus-visible:ring-offset-background focus-visible:ring-ring data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm",
+      "data-[state=active]:bg-background data-[state=active]:text-foreground inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm",
+      "focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
       className,
     )}
     {...props}
   />
 ));
+
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
 
 /* -----------------------------------------------------------------------------
  * Component: TabsContent
  * -------------------------------------------------------------------------- */
 
-type TabsContentProps = TabsPrimitive.TabsContentProps;
-const TabsContent = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Content>,
-  TabsContentProps
->(({ className, ...props }, ref) => (
+type TabsContentElement = React.ElementRef<typeof TabsPrimitive.Content>;
+type TabsContentProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>;
+
+const TabsContent = React.forwardRef<TabsContentElement, TabsContentProps>(({ className, ...props }, ref) => (
   <TabsPrimitive.Content
     ref={ref}
     className={cn(
-      "focus-visible:ring-offset-background focus-visible:ring-ring mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
+      "mt-2",
+      "focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
       className,
     )}
     {...props}
   />
 ));
+
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 /* -----------------------------------------------------------------------------

package/src/text.tsx

@@ -5,8 +5,9 @@ import { Slot } from "@radix-ui/react-slot";
  * Component: Text
  * -------------------------------------------------------------------------- */
 
-interface TextParagraphProps
-  extends React.HTMLAttributes<HTMLParagraphElement> {
+type TextElement = HTMLParagraphElement;
+
+interface TextParagraphProps extends React.HTMLAttributes<HTMLParagraphElement> {
   as?: "p";
 }
 
@@ -18,13 +19,12 @@ type TextProps = (TextParagraphProps | TextSpanProps) & {
   asChild?: boolean;
 };
 
-const Text = React.forwardRef<HTMLParagraphElement, TextProps>(
-  ({ as: Tag = "p", asChild, ...props }, ref) => {
-    const Comp = asChild ? Slot : Tag;
+const Text = React.forwardRef<TextElement, TextProps>(({ as: Tag = "p", asChild, ...props }, ref) => {
+  const Component = asChild ? Slot : Tag;
+
+  return <Component ref={ref} {...props} />;
+});
 
-    return <Comp ref={ref} {...props} />;
-  },
-);
 Text.displayName = "Text";
 
 /* -----------------------------------------------------------------------------

package/src/textarea.tsx

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

package/src/toggle-group.tsx

@@ -2,79 +2,80 @@
 
 import * as React from "react";
 import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
+import { createToggleGroupScope } from "@radix-ui/react-toggle-group";
+import { createContextScope, type Scope } from "@radix-ui/react-context";
 import { toggleVariants, type ToggleVariantsProps } from "./toggle";
 import { cn } from "./utils";
 
 /* -----------------------------------------------------------------------------
- * Context: ToggleGroup
+ * Component: ToggleGroup
  * -------------------------------------------------------------------------- */
 
-const ToggleGroupContext = React.createContext<ToggleVariantsProps>({
-  size: "default",
-  variant: "default",
-});
+const TOGGLE_GROUP_NAME = "ToggleGroup";
 
-/* -----------------------------------------------------------------------------
- * Component: ToggleGroup
- * -------------------------------------------------------------------------- */
+type ScopedProps<P> = P & { __scopeToggleGroup?: Scope };
+
+const [createToggleGroupContext] = createContextScope(TOGGLE_GROUP_NAME, [createToggleGroupScope]);
+
+const useToggleGroupScope = createToggleGroupScope();
+
+const [ToggleGroupProvider, useToggleGroupContext] = createToggleGroupContext<ToggleVariantsProps>(TOGGLE_GROUP_NAME);
 
-type ToggleGroupProps = React.ComponentPropsWithoutRef<
-  typeof ToggleGroupPrimitive.Root
-> &
-  ToggleVariantsProps;
-const ToggleGroup = React.forwardRef<
-  React.ElementRef<typeof ToggleGroupPrimitive.Root>,
-  ToggleGroupProps
->(({ className, variant, size, children, ...props }, ref) => (
-  <ToggleGroupPrimitive.Root
-    ref={ref}
-    className={cn("flex items-center justify-center gap-1", className)}
-    {...props}
-  >
-    <ToggleGroupContext.Provider value={{ variant, size }}>
-      {children}
-    </ToggleGroupContext.Provider>
-  </ToggleGroupPrimitive.Root>
-));
-ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
+type ToggleGroupElement = React.ElementRef<typeof ToggleGroupPrimitive.Root>;
+type ToggleGroupProps = React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> & ToggleVariantsProps;
+
+const ToggleGroup = React.forwardRef<ToggleGroupElement, ToggleGroupProps>(
+  ({ __scopeToggleGroup, className, variant, size, children, ...props }: ScopedProps<ToggleGroupProps>, ref) => {
+    const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
+
+    return (
+      <ToggleGroupProvider scope={__scopeToggleGroup} size={size} variant={variant}>
+        <ToggleGroupPrimitive.Root
+          ref={ref}
+          className={cn("flex items-center justify-center gap-1", className)}
+          {...toggleGroupScope}
+          {...props}
+        >
+          {children}
+        </ToggleGroupPrimitive.Root>
+      </ToggleGroupProvider>
+    );
+  },
+);
+
+ToggleGroup.displayName = TOGGLE_GROUP_NAME;
 
 /* -----------------------------------------------------------------------------
  * Component: ToggleGroupItem
  * -------------------------------------------------------------------------- */
 
-type ToggleGroupItemProps = ToggleGroupPrimitive.ToggleGroupItemProps &
-  ToggleVariantsProps;
-const ToggleGroupItem = React.forwardRef<
-  React.ElementRef<typeof ToggleGroupPrimitive.Item>,
-  ToggleGroupItemProps
->(({ className, children, variant, size, ...props }, ref) => {
-  const context = React.useContext(ToggleGroupContext);
-
-  return (
-    <ToggleGroupPrimitive.Item
-      ref={ref}
-      className={cn(
-        toggleVariants({
-          variant: context.variant ?? variant,
-          size: context.size ?? size,
-        }),
-        className,
-      )}
-      {...props}
-    >
-      {children}
-    </ToggleGroupPrimitive.Item>
-  );
-});
-ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
+const TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem";
+
+type ToggleGroupItemElement = React.ElementRef<typeof ToggleGroupPrimitive.Item>;
+type ToggleGroupItemProps = React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item>;
+
+const ToggleGroupItem = React.forwardRef<ToggleGroupItemElement, ToggleGroupItemProps>(
+  ({ __scopeToggleGroup, className, children, ...props }: ScopedProps<ToggleGroupItemProps>, ref) => {
+    const context = useToggleGroupContext(TOGGLE_GROUP_ITEM_NAME, __scopeToggleGroup);
+    const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
+
+    return (
+      <ToggleGroupPrimitive.Item
+        ref={ref}
+        className={toggleVariants({ ...context, className })}
+        {...toggleGroupScope}
+        {...props}
+      >
+        {children}
+      </ToggleGroupPrimitive.Item>
+    );
+  },
+);
+
+ToggleGroupItem.displayName = TOGGLE_GROUP_ITEM_NAME;
 
 /* -----------------------------------------------------------------------------
  * Exports
  * -------------------------------------------------------------------------- */
 
-export {
-  ToggleGroup,
-  ToggleGroupItem,
-  type ToggleGroupProps,
-  type ToggleGroupItemProps,
-};
+export { ToggleGroup, ToggleGroupItem, type ToggleGroupProps, type ToggleGroupItemProps };