@gmickel/gno 0.7.0 → 0.8.1

package/src/serve/public/components/preset-selector.tsx

@@ -5,10 +5,11 @@ import {
   Download,
   Loader2,
   SlidersHorizontal,
-} from 'lucide-react';
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { apiFetch } from '../hooks/use-api';
-import { Button } from './ui/button';
+} from "lucide-react";
+import { useCallback, useEffect, useRef, useState } from "react";
+
+import { apiFetch } from "../hooks/use-api";
+import { Button } from "./ui/button";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -17,8 +18,8 @@ import {
   DropdownMenuRadioItem,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
-} from './ui/dropdown-menu';
-import { Progress } from './ui/progress';
+} from "./ui/dropdown-menu";
+import { Progress } from "./ui/progress";
 
 interface Preset {
   id: string;
@@ -82,7 +83,7 @@ function extractDesc(name: string): string | null {
 }
 
 function extractBaseName(name: string): string {
-  return name.split('(')[0].trim();
+  return name.split("(")[0].trim();
 }
 
 function formatBytes(bytes: number): string {
@@ -123,17 +124,17 @@ function getButtonLabel(
   activePreset: Preset | undefined
 ): string {
   if (switching) {
-    return 'Switching...';
+    return "Switching...";
   }
   if (downloading) {
-    return 'Downloading...';
+    return "Downloading...";
   }
-  return activePreset ? extractBaseName(activePreset.name) : 'Preset';
+  return activePreset ? extractBaseName(activePreset.name) : "Preset";
 }
 
 export function PresetSelector() {
   const [presets, setPresets] = useState<Preset[]>([]);
-  const [activeId, setActiveId] = useState<string>('');
+  const [activeId, setActiveId] = useState<string>("");
   const [loading, setLoading] = useState(true);
   const [switching, setSwitching] = useState(false);
   const [error, setError] = useState<string | null>(null);
@@ -150,14 +151,14 @@ export function PresetSelector() {
   const checkCapabilities = useCallback((caps: Capabilities) => {
     const missing: string[] = [];
     if (!caps.vector) {
-      missing.push('vector search');
+      missing.push("vector search");
     }
     if (!caps.answer) {
-      missing.push('AI answers');
+      missing.push("AI answers");
     }
 
     if (missing.length > 0) {
-      setError(`Missing: ${missing.join(', ')}`);
+      setError(`Missing: ${missing.join(", ")}`);
       setModelsNeeded(true);
     } else {
       setError(null);
@@ -167,7 +168,7 @@ export function PresetSelector() {
 
   // Poll download status
   const pollStatus = useCallback(async () => {
-    const { data } = await apiFetch<DownloadStatus>('/api/models/status');
+    const { data } = await apiFetch<DownloadStatus>("/api/models/status");
     if (data) {
       setDownloadStatus(data);
 
@@ -181,14 +182,14 @@ export function PresetSelector() {
 
         // Refresh presets to get updated capabilities
         const { data: presetsData } =
-          await apiFetch<PresetsResponse>('/api/presets');
+          await apiFetch<PresetsResponse>("/api/presets");
         if (presetsData) {
           checkCapabilities(presetsData.capabilities);
         }
 
         // Show any failures
         if (data.failed.length > 0) {
-          setError(`Failed: ${data.failed.map((f) => f.type).join(', ')}`);
+          setError(`Failed: ${data.failed.map((f) => f.type).join(", ")}`);
         }
       }
     }
@@ -196,7 +197,7 @@ export function PresetSelector() {
 
   // Initial load
   useEffect(() => {
-    apiFetch<PresetsResponse>('/api/presets').then(({ data }) => {
+    void apiFetch<PresetsResponse>("/api/presets").then(({ data }) => {
       if (data) {
         setPresets(data.presets);
         setActiveId(data.activePreset);
@@ -206,7 +207,7 @@ export function PresetSelector() {
     });
 
     // Check if download already in progress
-    apiFetch<DownloadStatus>('/api/models/status').then(({ data }) => {
+    void apiFetch<DownloadStatus>("/api/models/status").then(({ data }) => {
       if (data?.active) {
         setDownloading(true);
         setDownloadStatus(data);
@@ -242,10 +243,10 @@ export function PresetSelector() {
     setError(null);
 
     const { data, error: fetchError } = await apiFetch<SetPresetResponse>(
-      '/api/presets',
+      "/api/presets",
       {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ presetId: id }),
       }
     );
@@ -271,8 +272,8 @@ export function PresetSelector() {
     setDownloading(true);
     setError(null);
 
-    const { error: fetchError } = await apiFetch('/api/models/pull', {
-      method: 'POST',
+    const { error: fetchError } = await apiFetch("/api/models/pull", {
+      method: "POST",
     });
 
     if (fetchError) {
@@ -282,7 +283,7 @@ export function PresetSelector() {
     }
 
     // Start polling
-    pollStatus();
+    void pollStatus();
   };
 
   return (
@@ -317,11 +318,11 @@ export function PresetSelector() {
             <div className="space-y-2 px-2 py-2">
               <div className="flex items-center justify-between text-xs">
                 <span className="text-muted-foreground">
-                  {downloadStatus.currentType || 'Starting...'}
+                  {downloadStatus.currentType || "Starting..."}
                 </span>
                 {downloadStatus.progress && (
                   <span className="font-mono text-[10px] text-muted-foreground">
-                    {formatBytes(downloadStatus.progress.downloadedBytes)} /{' '}
+                    {formatBytes(downloadStatus.progress.downloadedBytes)} /{" "}
                     {formatBytes(downloadStatus.progress.totalBytes)}
                   </span>
                 )}
@@ -329,7 +330,7 @@ export function PresetSelector() {
               <Progress value={downloadStatus.progress?.percent ?? 0} />
               {downloadStatus.completed.length > 0 && (
                 <div className="text-[10px] text-muted-foreground">
-                  Done: {downloadStatus.completed.join(', ')}
+                  Done: {downloadStatus.completed.join(", ")}
                 </div>
               )}
             </div>

package/src/serve/public/components/ui/badge.tsx

@@ -1,26 +1,27 @@
-import { Slot } from '@radix-ui/react-slot';
-import { cva, type VariantProps } from 'class-variance-authority';
-import type * as React from 'react';
+import type * as React from "react";
 
-import { cn } from '../../lib/utils';
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "../../lib/utils";
 
 const badgeVariants = cva(
-  'inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden whitespace-nowrap rounded-full border px-2 py-0.5 font-medium text-xs transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3',
+  "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden whitespace-nowrap rounded-full border px-2 py-0.5 font-medium text-xs transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3",
   {
     variants: {
       variant: {
         default:
-          'border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90',
+          "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
         secondary:
-          'border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90',
+          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
         destructive:
-          'border-transparent bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90',
+          "border-transparent bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90",
         outline:
-          'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground',
+          "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
       },
     },
     defaultVariants: {
-      variant: 'default',
+      variant: "default",
     },
   }
 );
@@ -30,9 +31,9 @@ function Badge({
   variant,
   asChild = false,
   ...props
-}: React.ComponentProps<'span'> &
+}: React.ComponentProps<"span"> &
   VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
-  const Comp = asChild ? Slot : 'span';
+  const Comp = asChild ? Slot : "span";
 
   return (
     <Comp

package/src/serve/public/components/ui/button-group.tsx

@@ -1,7 +1,8 @@
-import { Slot } from '@radix-ui/react-slot';
-import { cva, type VariantProps } from 'class-variance-authority';
-import { cn } from '../../lib/utils';
-import { Separator } from './separator';
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "../../lib/utils";
+import { Separator } from "./separator";
 
 const buttonGroupVariants = cva(
   "flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2 [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1",
@@ -9,13 +10,13 @@ const buttonGroupVariants = cva(
     variants: {
       orientation: {
         horizontal:
-          '[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none',
+          "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
         vertical:
-          'flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none',
+          "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none",
       },
     },
     defaultVariants: {
-      orientation: 'horizontal',
+      orientation: "horizontal",
     },
   }
 );
@@ -24,7 +25,7 @@ function ButtonGroup({
   className,
   orientation,
   ...props
-}: React.ComponentProps<'div'> & VariantProps<typeof buttonGroupVariants>) {
+}: React.ComponentProps<"div"> & VariantProps<typeof buttonGroupVariants>) {
   return (
     <div
       className={cn(buttonGroupVariants({ orientation }), className)}
@@ -40,10 +41,10 @@ function ButtonGroupText({
   className,
   asChild = false,
   ...props
-}: React.ComponentProps<'div'> & {
+}: React.ComponentProps<"div"> & {
   asChild?: boolean;
 }) {
-  const Comp = asChild ? Slot : 'div';
+  const Comp = asChild ? Slot : "div";
 
   return (
     <Comp
@@ -58,13 +59,13 @@ function ButtonGroupText({
 
 function ButtonGroupSeparator({
   className,
-  orientation = 'vertical',
+  orientation = "vertical",
   ...props
 }: React.ComponentProps<typeof Separator>) {
   return (
     <Separator
       className={cn(
-        '!m-0 relative self-stretch bg-input data-[orientation=vertical]:h-auto',
+        "!m-0 relative self-stretch bg-input data-[orientation=vertical]:h-auto",
         className
       )}
       data-slot="button-group-separator"

package/src/serve/public/components/ui/button.tsx

@@ -1,52 +1,53 @@
-import { Slot } from '@radix-ui/react-slot';
-import { cva, type VariantProps } from 'class-variance-authority';
-import type * as React from 'react';
+import type * as React from "react";
 
-import { cn } from '../../lib/utils';
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "../../lib/utils";
 
 const buttonVariants = cva(
   "inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium text-sm outline-none transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
       variant: {
-        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
         destructive:
-          'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40',
+          "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
         outline:
-          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50',
+          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
         secondary:
-          'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
         ghost:
-          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
-        link: 'text-primary underline-offset-4 hover:underline',
+          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+        link: "text-primary underline-offset-4 hover:underline",
       },
       size: {
-        default: 'h-9 px-4 py-2 has-[>svg]:px-3',
-        sm: 'h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5',
-        lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
-        icon: 'size-9',
-        'icon-sm': 'size-8',
-        'icon-lg': 'size-10',
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10",
       },
     },
     defaultVariants: {
-      variant: 'default',
-      size: 'default',
+      variant: "default",
+      size: "default",
     },
   }
 );
 
 function Button({
   className,
-  variant = 'default',
-  size = 'default',
+  variant = "default",
+  size = "default",
   asChild = false,
   ...props
-}: React.ComponentProps<'button'> &
+}: React.ComponentProps<"button"> &
   VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
   }) {
-  const Comp = asChild ? Slot : 'button';
+  const Comp = asChild ? Slot : "button";
 
   return (
     <Comp

package/src/serve/public/components/ui/card.tsx

@@ -1,12 +1,12 @@
-import type * as React from 'react';
+import type * as React from "react";
 
-import { cn } from '../../lib/utils';
+import { cn } from "../../lib/utils";
 
-function Card({ className, ...props }: React.ComponentProps<'div'>) {
+function Card({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
       className={cn(
-        'flex flex-col gap-6 rounded-xl border bg-card py-6 text-card-foreground shadow-sm',
+        "flex flex-col gap-6 rounded-xl border bg-card py-6 text-card-foreground shadow-sm",
         className
       )}
       data-slot="card"
@@ -15,11 +15,11 @@ function Card({ className, ...props }: React.ComponentProps<'div'>) {
   );
 }
 
-function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
       className={cn(
-        '@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6',
+        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
         className
       )}
       data-slot="card-header"
@@ -28,31 +28,31 @@ function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
   );
 }
 
-function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
-      className={cn('font-semibold leading-none', className)}
+      className={cn("font-semibold leading-none", className)}
       data-slot="card-title"
       {...props}
     />
   );
 }
 
-function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
-      className={cn('text-muted-foreground text-sm', className)}
+      className={cn("text-muted-foreground text-sm", className)}
       data-slot="card-description"
       {...props}
     />
   );
 }
 
-function CardAction({ className, ...props }: React.ComponentProps<'div'>) {
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
       className={cn(
-        'col-start-2 row-span-2 row-start-1 self-start justify-self-end',
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
         className
       )}
       data-slot="card-action"
@@ -61,20 +61,20 @@ function CardAction({ className, ...props }: React.ComponentProps<'div'>) {
   );
 }
 
-function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
-      className={cn('px-6', className)}
+      className={cn("px-6", className)}
       data-slot="card-content"
       {...props}
     />
   );
 }
 
-function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
-      className={cn('flex items-center px-6 [.border-t]:pt-6', className)}
+      className={cn("flex items-center px-6 [.border-t]:pt-6", className)}
       data-slot="card-footer"
       {...props}
     />

package/src/serve/public/components/ui/carousel.tsx

@@ -1,10 +1,11 @@
 import useEmblaCarousel, {
   type UseEmblaCarouselType,
-} from 'embla-carousel-react';
-import { ArrowLeft, ArrowRight } from 'lucide-react';
-import * as React from 'react';
-import { cn } from '../../lib/utils';
-import { Button } from './button';
+} from "embla-carousel-react";
+import { ArrowLeft, ArrowRight } from "lucide-react";
+import * as React from "react";
+
+import { cn } from "../../lib/utils";
+import { Button } from "./button";
 
 type CarouselApi = UseEmblaCarouselType[1];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
@@ -14,7 +15,7 @@ type CarouselPlugin = UseCarouselParameters[1];
 interface CarouselProps {
   opts?: CarouselOptions;
   plugins?: CarouselPlugin;
-  orientation?: 'horizontal' | 'vertical';
+  orientation?: "horizontal" | "vertical";
   setApi?: (api: CarouselApi) => void;
 }
 
@@ -33,25 +34,25 @@ function useCarousel() {
   const context = React.useContext(CarouselContext);
 
   if (!context) {
-    throw new Error('useCarousel must be used within a <Carousel />');
+    throw new Error("useCarousel must be used within a <Carousel />");
   }
 
   return context;
 }
 
 function Carousel({
-  orientation = 'horizontal',
+  orientation = "horizontal",
   opts,
   setApi,
   plugins,
   className,
   children,
   ...props
-}: React.ComponentProps<'div'> & CarouselProps) {
+}: React.ComponentProps<"div"> & CarouselProps) {
   const [carouselRef, api] = useEmblaCarousel(
     {
       ...opts,
-      axis: orientation === 'horizontal' ? 'x' : 'y',
+      axis: orientation === "horizontal" ? "x" : "y",
     },
     plugins
   );
@@ -76,10 +77,10 @@ function Carousel({
 
   const handleKeyDown = React.useCallback(
     (event: React.KeyboardEvent<HTMLDivElement>) => {
-      if (event.key === 'ArrowLeft') {
+      if (event.key === "ArrowLeft") {
         event.preventDefault();
         scrollPrev();
-      } else if (event.key === 'ArrowRight') {
+      } else if (event.key === "ArrowRight") {
         event.preventDefault();
         scrollNext();
       }
@@ -99,11 +100,11 @@ function Carousel({
       return;
     }
     onSelect(api);
-    api.on('reInit', onSelect);
-    api.on('select', onSelect);
+    api.on("reInit", onSelect);
+    api.on("select", onSelect);
 
     return () => {
-      api?.off('select', onSelect);
+      api?.off("select", onSelect);
     };
   }, [api, onSelect]);
 
@@ -114,7 +115,7 @@ function Carousel({
         api,
         opts,
         orientation:
-          orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),
+          orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
         scrollPrev,
         scrollNext,
         canScrollPrev,
@@ -123,7 +124,7 @@ function Carousel({
     >
       <div
         aria-roledescription="carousel"
-        className={cn('relative', className)}
+        className={cn("relative", className)}
         data-slot="carousel"
         onKeyDownCapture={handleKeyDown}
         role="region"
@@ -135,7 +136,7 @@ function Carousel({
   );
 }
 
-function CarouselContent({ className, ...props }: React.ComponentProps<'div'>) {
+function CarouselContent({ className, ...props }: React.ComponentProps<"div">) {
   const { carouselRef, orientation } = useCarousel();
 
   return (
@@ -146,8 +147,8 @@ function CarouselContent({ className, ...props }: React.ComponentProps<'div'>) {
     >
       <div
         className={cn(
-          'flex',
-          orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col',
+          "flex",
+          orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
           className
         )}
         {...props}
@@ -156,15 +157,15 @@ function CarouselContent({ className, ...props }: React.ComponentProps<'div'>) {
   );
 }
 
-function CarouselItem({ className, ...props }: React.ComponentProps<'div'>) {
+function CarouselItem({ className, ...props }: React.ComponentProps<"div">) {
   const { orientation } = useCarousel();
 
   return (
     <div
       aria-roledescription="slide"
       className={cn(
-        'min-w-0 shrink-0 grow-0 basis-full',
-        orientation === 'horizontal' ? 'pl-4' : 'pt-4',
+        "min-w-0 shrink-0 grow-0 basis-full",
+        orientation === "horizontal" ? "pl-4" : "pt-4",
         className
       )}
       data-slot="carousel-item"
@@ -176,8 +177,8 @@ function CarouselItem({ className, ...props }: React.ComponentProps<'div'>) {
 
 function CarouselPrevious({
   className,
-  variant = 'outline',
-  size = 'icon',
+  variant = "outline",
+  size = "icon",
   ...props
 }: React.ComponentProps<typeof Button>) {
   const { orientation, scrollPrev, canScrollPrev } = useCarousel();
@@ -185,10 +186,10 @@ function CarouselPrevious({
   return (
     <Button
       className={cn(
-        'absolute size-8 rounded-full',
-        orientation === 'horizontal'
-          ? 'top-1/2 -left-12 -translate-y-1/2'
-          : '-top-12 left-1/2 -translate-x-1/2 rotate-90',
+        "absolute size-8 rounded-full",
+        orientation === "horizontal"
+          ? "top-1/2 -left-12 -translate-y-1/2"
+          : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
         className
       )}
       data-slot="carousel-previous"
@@ -206,8 +207,8 @@ function CarouselPrevious({
 
 function CarouselNext({
   className,
-  variant = 'outline',
-  size = 'icon',
+  variant = "outline",
+  size = "icon",
   ...props
 }: React.ComponentProps<typeof Button>) {
   const { orientation, scrollNext, canScrollNext } = useCarousel();
@@ -215,10 +216,10 @@ function CarouselNext({
   return (
     <Button
       className={cn(
-        'absolute size-8 rounded-full',
-        orientation === 'horizontal'
-          ? 'top-1/2 -right-12 -translate-y-1/2'
-          : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',
+        "absolute size-8 rounded-full",
+        orientation === "horizontal"
+          ? "top-1/2 -right-12 -translate-y-1/2"
+          : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
         className
       )}
       data-slot="carousel-next"

package/src/serve/public/components/ui/collapsible.tsx

@@ -1,4 +1,4 @@
-import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
 
 function Collapsible({
   ...props