{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "starter",
  "type": "registry:style",
  "title": "Crafter UI starter",
  "description": "All selected Crafter UI components and defaults.",
  "dependencies": [
    "@base-ui/react@^1.8.0",
    "@shadcn/react@^0.3.1",
    "class-variance-authority@^0.7.1",
    "cmdk@^1.1.1",
    "cn@^0.2.6",
    "embla-carousel-react@^8.6.0",
    "input-otp@^1.5.0",
    "lucide-react@^1.42.0",
    "react-day-picker@^10.0.1",
    "react-resizable-panels@^4.12.4",
    "recharts@3.8.0"
  ],
  "files": [
    {
      "path": "components/examples/data-table.tsx",
      "type": "registry:component",
      "content": "\"use client\";\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@/components/ui/table\";\n\nconst rows = [\n  { name: \"Crafter UI\", status: \"Active\" },\n  { name: \"Petdex\", status: \"Review\" },\n  { name: \"Lab Bench\", status: \"Draft\" },\n];\nexport default function Preview() {\n  const [query, setQuery] = useState(\"\");\n  const [asc, setAsc] = useState(true);\n  return (\n    <div className=\"grid w-full gap-4\">\n      <Input\n        aria-label=\"Filter projects\"\n        placeholder=\"Filter projects…\"\n        value={query}\n        onChange={(e) => setQuery(e.target.value)}\n      />\n      <Table>\n        <TableHeader>\n          <TableRow>\n            <TableHead aria-sort={asc ? \"ascending\" : \"descending\"}>\n              <Button variant=\"ghost\" onClick={() => setAsc(!asc)}>\n                Project {asc ? \"↑\" : \"↓\"}\n              </Button>\n            </TableHead>\n            <TableHead>Status</TableHead>\n          </TableRow>\n        </TableHeader>\n        <TableBody>\n          {rows\n            .filter((r) => r.name.toLowerCase().includes(query.toLowerCase()))\n            .sort((a, b) =>\n              asc ? a.name.localeCompare(b.name) : b.name.localeCompare(a.name),\n            )\n            .map((r) => (\n              <TableRow key={r.name}>\n                <TableCell>{r.name}</TableCell>\n                <TableCell>{r.status}</TableCell>\n              </TableRow>\n            ))}\n        </TableBody>\n      </Table>\n    </div>\n  );\n}\n"
    },
    {
      "path": "components/examples/date-picker.tsx",
      "type": "registry:component",
      "content": "\"use client\";\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Calendar } from \"@/components/ui/calendar\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\";\nexport default function Preview() {\n  const [open, setOpen] = useState(false);\n  const [date, setDate] = useState<Date>();\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger render={<Button variant=\"outline\" />}>\n        {date ? date.toLocaleDateString() : \"Pick a date\"}\n      </PopoverTrigger>\n      <PopoverContent className=\"w-auto p-0\">\n        <Calendar\n          mode=\"single\"\n          selected={date}\n          onSelect={(value) => {\n            setDate(value);\n            if (value) setOpen(false);\n          }}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n}\n"
    },
    {
      "path": "components/examples/typography.tsx",
      "type": "registry:component",
      "content": "export default function Preview() {\n  return (\n    <div className=\"grid gap-5\">\n      <h1 className=\"text-3xl font-semibold tracking-tight\">Good defaults.</h1>\n      <h2 className=\"text-xl font-medium\">Your fingerprints.</h2>\n      <p className=\"text-sm leading-7\">\n        A shared type scale gives every component a familiar voice. Build\n        something small, then make it your own.\n      </p>\n      <blockquote className=\"border-l-2 pl-4 text-muted-foreground\">\n        The details make the difference.\n      </blockquote>\n      <code className=\"rounded bg-muted px-2 py-1 text-sm\">bun run dev</code>\n      <small className=\"text-muted-foreground\">Made at Crafter Station</small>\n    </div>\n  );\n}\n"
    },
    {
      "path": "components/ui/accordion.tsx",
      "type": "registry:ui",
      "content": "import { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\";\nimport { cn } from \"cn\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"lucide-react\";\nfunction Accordion({ className, ...props }: AccordionPrimitive.Root.Props) {\n    return (<AccordionPrimitive.Root data-slot=\"accordion\" className={cn(\"flex w-full flex-col\", className)} {...props}/>);\n}\nfunction AccordionItem({ className, ...props }: AccordionPrimitive.Item.Props) {\n    return (<AccordionPrimitive.Item data-slot=\"accordion-item\" className={cn(\"not-last:border-b\", className)} {...props}/>);\n}\nfunction AccordionTrigger({ className, children, ...props }: AccordionPrimitive.Trigger.Props) {\n    return (<AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger data-slot=\"accordion-trigger\" className={cn(\"group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground\", className)} {...props}>\n        {children}\n        <ChevronDownIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden\"/>\n        <ChevronUpIcon data-slot=\"accordion-trigger-icon\" className=\"pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline\"/>\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>);\n}\nfunction AccordionContent({ className, children, ...props }: AccordionPrimitive.Panel.Props) {\n    return (<AccordionPrimitive.Panel data-slot=\"accordion-content\" className=\"overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up\" {...props}>\n      <div className={cn(\"h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4\", className)}>\n        {children}\n      </div>\n    </AccordionPrimitive.Panel>);\n}\nexport { Accordion, AccordionContent, AccordionItem, AccordionTrigger };\n"
    },
    {
      "path": "components/ui/action-button.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Spinner } from \"@/components/ui/spinner\";\n\ntype ActionButtonProps = ComponentProps<typeof Button> & {\n  pending?: boolean;\n  pendingLabel?: string;\n};\n\nexport function ActionButton({\n  pending = false,\n  pendingLabel = \"Working…\",\n  children,\n  disabled,\n  ...props\n}: ActionButtonProps) {\n  return (\n    <Button {...props} disabled={disabled || pending} aria-busy={pending}>\n      {pending && <Spinner data-icon=\"inline-start\" />}\n      {pending ? pendingLabel : children}\n    </Button>\n  );\n}\n"
    },
    {
      "path": "components/ui/alert-dialog.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-dialog\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nfunction AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props) {\n    return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props}/>;\n}\nfunction AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props) {\n    return (<AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props}/>);\n}\nfunction AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props) {\n    return (<AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props}/>);\n}\nfunction AlertDialogOverlay({ className, ...props }: AlertDialogPrimitive.Backdrop.Props) {\n    return (<AlertDialogPrimitive.Backdrop data-slot=\"alert-dialog-overlay\" className={cn(\"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0\", className)} {...props}/>);\n}\nfunction AlertDialogContent({ className, size = \"default\", ...props }: AlertDialogPrimitive.Popup.Props & {\n    size?: \"default\" | \"sm\";\n}) {\n    return (<AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Popup data-slot=\"alert-dialog-content\" data-size={size} className={cn(\"group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>\n    </AlertDialogPortal>);\n}\nfunction AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"alert-dialog-header\" className={cn(\"grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]\", className)} {...props}/>);\n}\nfunction AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"alert-dialog-footer\" className={cn(\"-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end\", className)} {...props}/>);\n}\nfunction AlertDialogMedia({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"alert-dialog-media\" className={cn(\"mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6\", className)} {...props}/>);\n}\nfunction AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n    return (<AlertDialogPrimitive.Title data-slot=\"alert-dialog-title\" className={cn(\"font-heading text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2\", className)} {...props}/>);\n}\nfunction AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n    return (<AlertDialogPrimitive.Description data-slot=\"alert-dialog-description\" className={cn(\"text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\", className)} {...props}/>);\n}\nfunction AlertDialogAction({ className, ...props }: React.ComponentProps<typeof Button>) {\n    return (<Button data-slot=\"alert-dialog-action\" className={cn(className)} {...props}/>);\n}\nfunction AlertDialogCancel({ className, variant = \"outline\", size = \"default\", ...props }: AlertDialogPrimitive.Close.Props & Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">) {\n    return (<AlertDialogPrimitive.Close data-slot=\"alert-dialog-cancel\" className={cn(className)} render={<Button variant={variant} size={size}/>} {...props}/>);\n}\nexport { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };\n"
    },
    {
      "path": "components/ui/alert.tsx",
      "type": "registry:ui",
      "content": "import { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nconst alertVariants = cva(\"group/alert relative grid w-full gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4\", {\n    variants: {\n        variant: {\n            default: \"bg-card text-card-foreground\",\n            destructive: \"bg-card text-destructive *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current\",\n        },\n    },\n    defaultVariants: {\n        variant: \"default\",\n    },\n});\nfunction Alert({ className, variant, ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n    return (<div data-slot=\"alert\" role=\"alert\" className={cn(alertVariants({ variant }), className)} {...props}/>);\n}\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"alert-title\" className={cn(\"font-medium group-has-[>svg]/alert:col-start-2 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground\", className)} {...props}/>);\n}\nfunction AlertDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"alert-description\" className={cn(\"text-sm text-balance text-muted-foreground md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4\", className)} {...props}/>);\n}\nfunction AlertAction({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"alert-action\" className={cn(\"absolute top-2 right-2\", className)} {...props}/>);\n}\nexport { Alert, AlertAction, AlertDescription, AlertTitle };\n"
    },
    {
      "path": "components/ui/aspect-ratio.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nfunction AspectRatio({ ratio, className, ...props }: React.ComponentProps<\"div\"> & {\n    ratio: number;\n}) {\n    return (<div data-slot=\"aspect-ratio\" style={{\n            \"--ratio\": ratio,\n        } as React.CSSProperties} className={cn(\"relative aspect-(--ratio)\", className)} {...props}/>);\n}\nexport { AspectRatio };\n"
    },
    {
      "path": "components/ui/attachment.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nconst attachmentVariants = cva(\"group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-xl border bg-card text-card-foreground transition-colors focus-within:ring-1 focus-within:ring-ring/50 has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed\", {\n    variants: {\n        size: {\n            default: \"gap-2 text-sm has-data-[slot=attachment-content]:px-2.5 has-data-[slot=attachment-content]:py-2 has-data-[slot=attachment-media]:p-2\",\n            sm: \"gap-2.5 text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5\",\n            xs: \"gap-1.5 rounded-lg text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1\",\n        },\n        orientation: {\n            horizontal: \"min-w-40 items-center\",\n            vertical: \"w-24 flex-col has-data-[slot=attachment-content]:w-30\",\n        },\n    },\n});\nfunction Attachment({ className, state = \"done\", size = \"default\", orientation = \"horizontal\", ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof attachmentVariants> & {\n    state?: \"idle\" | \"uploading\" | \"processing\" | \"error\" | \"done\";\n}) {\n    return (<div data-slot=\"attachment\" data-state={state} data-size={size} data-orientation={orientation} className={cn(attachmentVariants({ size, orientation }), className)} {...props}/>);\n}\nconst attachmentMediaVariants = cva(\"relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[size=sm]/attachment:w-8 group-data-[size=xs]/attachment:w-7 group-data-[size=xs]/attachment:rounded-md group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5\", {\n    variants: {\n        variant: {\n            icon: \"\",\n            image: \"opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover\",\n        },\n    },\n    defaultVariants: {\n        variant: \"icon\",\n    },\n});\nfunction AttachmentMedia({ className, variant = \"icon\", ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof attachmentMediaVariants>) {\n    return (<div data-slot=\"attachment-media\" data-variant={variant} className={cn(attachmentMediaVariants({ variant }), className)} {...props}/>);\n}\nfunction AttachmentContent({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"attachment-content\" className={cn(\"max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1\", className)} {...props}/>);\n}\nfunction AttachmentTitle({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"attachment-title\" className={cn(\"block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer\", className)} {...props}/>);\n}\nfunction AttachmentDescription({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"attachment-description\" className={cn(\"mt-0.5 block min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80\", \"max-w-full\", className)} {...props}/>);\n}\nfunction AttachmentActions({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"attachment-actions\" className={cn(\"relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:right-3 group-data-[orientation=vertical]/attachment:gap-1\", className)} {...props}/>);\n}\nfunction AttachmentAction({ className, variant, size = \"icon-xs\", ...props }: React.ComponentProps<typeof Button>) {\n    return (<Button data-slot=\"attachment-action\" variant={variant ?? \"ghost\"} size={size} className={cn(className)} {...props}/>);\n}\nfunction AttachmentTrigger({ className, render, type, ...props }: useRender.ComponentProps<\"button\">) {\n    return useRender({\n        defaultTagName: \"button\",\n        props: mergeProps<\"button\">({\n            type: render ? type : (type ?? \"button\"),\n            className: cn(\"absolute inset-0 z-10 outline-none\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"attachment-trigger\",\n        },\n    });\n}\nfunction AttachmentGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"attachment-group\" className={cn(\"flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 scrollbar-none gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start\", className)} {...props}/>);\n}\nexport { Attachment, AttachmentAction, AttachmentActions, AttachmentContent, AttachmentDescription, AttachmentGroup, AttachmentMedia, AttachmentTitle, AttachmentTrigger, };\n"
    },
    {
      "path": "components/ui/avatar.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Avatar as AvatarPrimitive } from \"@base-ui/react/avatar\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nfunction Avatar({ className, size = \"default\", ...props }: AvatarPrimitive.Root.Props & {\n    size?: \"default\" | \"sm\" | \"lg\";\n}) {\n    return (<AvatarPrimitive.Root data-slot=\"avatar\" data-size={size} className={cn(\"group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten\", className)} {...props}/>);\n}\nfunction AvatarImage({ className, ...props }: AvatarPrimitive.Image.Props) {\n    return (<AvatarPrimitive.Image data-slot=\"avatar-image\" className={cn(\"aspect-square size-full rounded-full object-cover\", className)} {...props}/>);\n}\nfunction AvatarFallback({ className, ...props }: AvatarPrimitive.Fallback.Props) {\n    return (<AvatarPrimitive.Fallback data-slot=\"avatar-fallback\" className={cn(\"flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs\", className)} {...props}/>);\n}\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"avatar-badge\" className={cn(\"absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground bg-blend-color ring-2 ring-background select-none\", \"group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden\", \"group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2\", \"group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2\", className)} {...props}/>);\n}\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"avatar-group\" className={cn(\"group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background\", className)} {...props}/>);\n}\nfunction AvatarGroupCount({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"avatar-group-count\" className={cn(\"relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3\", className)} {...props}/>);\n}\nexport { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, };\n"
    },
    {
      "path": "components/ui/badge.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nconst badgeVariants = cva(\n  \"group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a]:hover:bg-primary/80\",\n        secondary:\n          \"bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80\",\n        destructive:\n          \"bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20\",\n        outline:\n          \"border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Badge({\n  className,\n  variant = \"default\",\n  render,\n  ...props\n}: useRender.ComponentProps<\"span\"> & VariantProps<typeof badgeVariants>) {\n  return useRender({\n    defaultTagName: \"span\",\n    props: mergeProps<\"span\">(\n      {\n        className: cn(badgeVariants({ variant }), className),\n      },\n      props\n    ),\n    render,\n    state: {\n      slot: \"badge\",\n      variant,\n    },\n  })\n}\n\nexport { Badge, badgeVariants }\n"
    },
    {
      "path": "components/ui/breadcrumb.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cn } from \"cn\";\nimport { ChevronRightIcon, MoreHorizontalIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nfunction Breadcrumb({ className, ...props }: React.ComponentProps<\"nav\">) {\n    return (<nav aria-label=\"breadcrumb\" data-slot=\"breadcrumb\" className={cn(className)} {...props}/>);\n}\nfunction BreadcrumbList({ className, ...props }: React.ComponentProps<\"ol\">) {\n    return (<ol data-slot=\"breadcrumb-list\" className={cn(\"flex flex-wrap items-center gap-1.5 text-sm wrap-break-word text-muted-foreground\", className)} {...props}/>);\n}\nfunction BreadcrumbItem({ className, ...props }: React.ComponentProps<\"li\">) {\n    return (<li data-slot=\"breadcrumb-item\" className={cn(\"inline-flex items-center gap-1\", className)} {...props}/>);\n}\nfunction BreadcrumbLink({ className, render, ...props }: useRender.ComponentProps<\"a\">) {\n    return useRender({\n        defaultTagName: \"a\",\n        props: mergeProps<\"a\">({\n            className: cn(\"transition-colors hover:text-foreground\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"breadcrumb-link\",\n        },\n    });\n}\nfunction BreadcrumbPage({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"breadcrumb-page\" role=\"link\" aria-disabled=\"true\" aria-current=\"page\" className={cn(\"font-normal text-foreground\", className)} {...props}/>);\n}\nfunction BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<\"li\">) {\n    return (<li data-slot=\"breadcrumb-separator\" role=\"presentation\" aria-hidden=\"true\" className={cn(\"[&>svg]:size-3.5\", className)} {...props}>\n      {children ?? <ChevronRightIcon />}\n    </li>);\n}\nfunction BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"breadcrumb-ellipsis\" role=\"presentation\" aria-hidden=\"true\" className={cn(\"flex size-5 items-center justify-center [&>svg]:size-4\", className)} {...props}>\n      <MoreHorizontalIcon />\n      <span className=\"sr-only\">More</span>\n    </span>);\n}\nexport { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, };\n"
    },
    {
      "path": "components/ui/bubble.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nfunction BubbleGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"bubble-group\" className={cn(\"flex min-w-0 flex-col gap-2\", className)} {...props}/>);\n}\nconst bubbleVariants = cva(\"group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full\", {\n    variants: {\n        variant: {\n            default: \"*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80\",\n            secondary: \"*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]\",\n            muted: \"*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]\",\n            tinted: \"*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.93_calc(c*0.4)_h)] *:data-[slot=bubble-content]:text-foreground dark:*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.3_calc(c*0.4)_h)] [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.88_calc(c*0.5)_h)] dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.35_calc(c*0.5)_h)]\",\n            outline: \"*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30\",\n            ghost: \"border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:p-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50\",\n            destructive: \"*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30\",\n        },\n    },\n    defaultVariants: {\n        variant: \"default\",\n    },\n});\nfunction Bubble({ variant = \"default\", align = \"start\", className, ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof bubbleVariants> & {\n    align?: \"start\" | \"end\";\n}) {\n    return (<div data-slot=\"bubble\" data-variant={variant} data-align={align} className={cn(bubbleVariants({ variant }), className)} {...props}/>);\n}\nfunction BubbleContent({ className, render, ...props }: useRender.ComponentProps<\"div\">) {\n    return useRender({\n        defaultTagName: \"div\",\n        props: mergeProps<\"div\">({\n            className: cn(\"w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"bubble-content\",\n        },\n    });\n}\nconst bubbleReactionsVariants = cva(\"absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-muted px-1.5 py-0.5 text-sm ring-3 ring-card has-[button]:p-0\", {\n    variants: {\n        side: {\n            top: \"top-0 -translate-y-3/4\",\n            bottom: \"bottom-0 translate-y-3/4\",\n        },\n        align: {\n            start: \"left-3\",\n            end: \"right-3\",\n        },\n    },\n    defaultVariants: {\n        side: \"bottom\",\n        align: \"end\",\n    },\n});\nfunction BubbleReactions({ side = \"bottom\", align = \"end\", className, ...props }: React.ComponentProps<\"div\"> & {\n    align?: \"start\" | \"end\";\n    side?: \"top\" | \"bottom\";\n}) {\n    return (<div data-slot=\"bubble-reactions\" data-align={align} data-side={side} className={cn(bubbleReactionsVariants({ side, align }), className)} {...props}/>);\n}\nexport { Bubble, BubbleContent, BubbleGroup, BubbleReactions };\n"
    },
    {
      "path": "components/ui/button-group.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport { Separator } from \"@/components/ui/separator\";\nconst buttonGroupVariants = cva(\"flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10 has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1\", {\n    variants: {\n        orientation: {\n            horizontal: \"*:data-slot:rounded-r-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-r-lg! [&>[data-slot]~[data-slot]]:rounded-l-none [&>[data-slot]~[data-slot]]:border-l-0\",\n            vertical: \"flex-col *:data-slot:rounded-b-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-b-lg! [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t-0\",\n        },\n    },\n    defaultVariants: {\n        orientation: \"horizontal\",\n    },\n});\nfunction ButtonGroup({ className, orientation, ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof buttonGroupVariants>) {\n    return (<div role=\"group\" data-slot=\"button-group\" data-orientation={orientation} className={cn(buttonGroupVariants({ orientation }), className)} {...props}/>);\n}\nfunction ButtonGroupText({ className, render, ...props }: useRender.ComponentProps<\"div\">) {\n    return useRender({\n        defaultTagName: \"div\",\n        props: mergeProps<\"div\">({\n            className: cn(\"flex items-center gap-2 rounded-lg border bg-muted px-2.5 text-sm font-medium [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"button-group-text\",\n        },\n    });\n}\nfunction ButtonGroupSeparator({ className, orientation = \"vertical\", ...props }: React.ComponentProps<typeof Separator>) {\n    return (<Separator data-slot=\"button-group-separator\" orientation={orientation} className={cn(\"relative self-stretch bg-input data-horizontal:mx-px data-horizontal:w-auto data-vertical:my-px data-vertical:h-auto\", className)} {...props}/>);\n}\nexport { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants, };\n"
    },
    {
      "path": "components/ui/button.tsx",
      "type": "registry:ui",
      "content": "import { Button as ButtonPrimitive } from \"@base-ui/react/button\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/80\",\n        outline:\n          \"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50\",\n        destructive:\n          \"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default:\n          \"h-[var(--control-height,2rem)] gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        xs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: \"h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        icon: \"size-8\",\n        \"icon-xs\":\n          \"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\":\n          \"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg\",\n        \"icon-lg\": \"size-9\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n"
    },
    {
      "path": "components/ui/calendar.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cn } from \"cn\";\nimport { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, } from \"lucide-react\";\nimport * as React from \"react\";\nimport { type DayButton, DayPicker, getDefaultClassNames, type Locale, } from \"react-day-picker\";\nimport { Button, buttonVariants } from \"@/components/ui/button\";\nfunction Calendar({ className, classNames, showOutsideDays = true, captionLayout = \"label\", buttonVariant = \"ghost\", locale, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {\n    buttonVariant?: React.ComponentProps<typeof Button>[\"variant\"];\n}) {\n    const defaultClassNames = getDefaultClassNames();\n    return (<DayPicker showOutsideDays={showOutsideDays} className={cn(\"group/calendar bg-background p-2 [--cell-radius:var(--radius-md)] [--cell-size:--spacing(7)] in-data-[slot=card-content]:bg-transparent in-data-[slot=popover-content]:bg-transparent\", String.raw `rtl:**:[.rdp-button\\_next>svg]:rotate-180`, String.raw `rtl:**:[.rdp-button\\_previous>svg]:rotate-180`, className)} captionLayout={captionLayout} locale={locale} formatters={{\n            formatMonthDropdown: (date) => date.toLocaleString(locale?.code, { month: \"short\" }),\n            ...formatters,\n        }} classNames={{\n            root: cn(\"w-fit\", defaultClassNames.root),\n            months: cn(\"relative flex flex-col gap-4 md:flex-row\", defaultClassNames.months),\n            month: cn(\"flex w-full flex-col gap-4\", defaultClassNames.month),\n            nav: cn(\"absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1\", defaultClassNames.nav),\n            button_previous: cn(buttonVariants({ variant: buttonVariant }), \"size-(--cell-size) p-0 select-none aria-disabled:opacity-50\", defaultClassNames.button_previous),\n            button_next: cn(buttonVariants({ variant: buttonVariant }), \"size-(--cell-size) p-0 select-none aria-disabled:opacity-50\", defaultClassNames.button_next),\n            month_caption: cn(\"flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)\", defaultClassNames.month_caption),\n            dropdowns: cn(\"flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium\", defaultClassNames.dropdowns),\n            dropdown_root: cn(\"relative rounded-(--cell-radius)\", defaultClassNames.dropdown_root),\n            dropdown: cn(\"absolute inset-0 bg-popover opacity-0\", defaultClassNames.dropdown),\n            caption_label: cn(\"font-medium select-none\", captionLayout === \"label\"\n                ? \"text-sm\"\n                : \"flex items-center gap-1 rounded-(--cell-radius) text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground\", defaultClassNames.caption_label),\n            month_grid: cn(\"w-full border-collapse\", defaultClassNames.month_grid),\n            weekdays: cn(\"flex\", defaultClassNames.weekdays),\n            weekday: cn(\"flex-1 rounded-(--cell-radius) text-[0.8rem] font-normal text-muted-foreground select-none\", defaultClassNames.weekday),\n            week: cn(\"mt-2 flex w-full\", defaultClassNames.week),\n            week_number_header: cn(\"w-(--cell-size) select-none\", defaultClassNames.week_number_header),\n            week_number: cn(\"text-[0.8rem] text-muted-foreground select-none\", defaultClassNames.week_number),\n            day: cn(\"group/day relative aspect-square h-full w-full rounded-(--cell-radius) p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-(--cell-radius)\", props.showWeekNumber\n                ? \"[&:nth-child(2)[data-selected=true]_button]:rounded-l-(--cell-radius)\"\n                : \"[&:first-child[data-selected=true]_button]:rounded-l-(--cell-radius)\", defaultClassNames.day),\n            range_start: cn(\"relative isolate z-0 rounded-l-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:right-0 after:w-4 after:bg-muted\", defaultClassNames.range_start),\n            range_middle: cn(\"rounded-none\", defaultClassNames.range_middle),\n            range_end: cn(\"relative isolate z-0 rounded-r-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:left-0 after:w-4 after:bg-muted\", defaultClassNames.range_end),\n            today: cn(\"rounded-(--cell-radius) bg-muted text-foreground data-[selected=true]:rounded-none\", defaultClassNames.today),\n            outside: cn(\"text-muted-foreground aria-selected:text-muted-foreground\", defaultClassNames.outside),\n            disabled: cn(\"text-muted-foreground opacity-50\", defaultClassNames.disabled),\n            hidden: cn(\"invisible\", defaultClassNames.hidden),\n            ...classNames,\n        }} components={{\n            Root: ({ className, rootRef, ...props }) => {\n                return (<div data-slot=\"calendar\" ref={rootRef} className={cn(className)} {...props}/>);\n            },\n            Chevron: ({ className, orientation, ...props }) => {\n                if (orientation === \"left\") {\n                    return (<ChevronLeftIcon className={cn(\"size-4\", className)} {...props}/>);\n                }\n                if (orientation === \"right\") {\n                    return (<ChevronRightIcon className={cn(\"size-4\", className)} {...props}/>);\n                }\n                return (<ChevronDownIcon className={cn(\"size-4\", className)} {...props}/>);\n            },\n            DayButton: ({ ...props }) => (<CalendarDayButton locale={locale} {...props}/>),\n            WeekNumber: ({ children, ...props }) => {\n                return (<td {...props}>\n              <div className=\"flex size-(--cell-size) items-center justify-center text-center\">\n                {children}\n              </div>\n            </td>);\n            },\n            ...components,\n        }} {...props}/>);\n}\nfunction CalendarDayButton({ className, day, modifiers, locale, ...props }: React.ComponentProps<typeof DayButton> & {\n    locale?: Partial<Locale>;\n}) {\n    const defaultClassNames = getDefaultClassNames();\n    const ref = React.useRef<HTMLButtonElement>(null);\n    React.useEffect(() => {\n        if (modifiers.focused)\n            ref.current?.focus();\n    }, [modifiers.focused]);\n    return (<Button variant=\"ghost\" size=\"icon\" data-day={day.date.toLocaleDateString(locale?.code)} data-selected-single={modifiers.selected &&\n            !modifiers.range_start &&\n            !modifiers.range_end &&\n            !modifiers.range_middle} data-range-start={modifiers.range_start} data-range-end={modifiers.range_end} data-range-middle={modifiers.range_middle} className={cn(\"relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70\", defaultClassNames.day, className)} {...props}/>);\n}\nexport { Calendar, CalendarDayButton };\n"
    },
    {
      "path": "components/ui/card.tsx",
      "type": "registry:ui",
      "content": "import * as React from \"react\"\nimport { cn } from \"cn\"\n\nfunction Card({\n  className,\n  size = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & { size?: \"default\" | \"sm\" }) {\n  return (\n    <div\n      data-slot=\"card\"\n      data-size={size}\n      className={cn(\n        \"group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-xl bg-card py-(--card-spacing) text-sm text-card-foreground ring-1 ring-foreground/10 [--card-spacing:--spacing(4)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        \"group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={cn(\n        \"font-heading text-base leading-snug font-medium group-data-[size=sm]/card:text-sm\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={cn(\n        \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={cn(\"px-(--card-spacing)\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn(\n        \"flex items-center rounded-b-xl border-t bg-muted/50 p-(--card-spacing)\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Card,\n  CardHeader,\n  CardFooter,\n  CardTitle,\n  CardAction,\n  CardDescription,\n  CardContent,\n}\n"
    },
    {
      "path": "components/ui/carousel.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cn } from \"cn\";\nimport useEmblaCarousel, { type UseEmblaCarouselType, } from \"embla-carousel-react\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\ntype CarouselProps = {\n    opts?: CarouselOptions;\n    plugins?: CarouselPlugin;\n    orientation?: \"horizontal\" | \"vertical\";\n    setApi?: (api: CarouselApi) => void;\n};\ntype CarouselContextProps = {\n    carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n    api: ReturnType<typeof useEmblaCarousel>[1];\n    scrollPrev: () => void;\n    scrollNext: () => void;\n    canScrollPrev: boolean;\n    canScrollNext: boolean;\n} & CarouselProps;\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\nfunction useCarousel() {\n    const context = React.useContext(CarouselContext);\n    if (!context) {\n        throw new Error(\"useCarousel must be used within a <Carousel />\");\n    }\n    return context;\n}\nfunction Carousel({ orientation = \"horizontal\", opts, setApi, plugins, className, children, ...props }: React.ComponentProps<\"div\"> & CarouselProps) {\n    const [carouselRef, api] = useEmblaCarousel({\n        ...opts,\n        axis: orientation === \"horizontal\" ? \"x\" : \"y\",\n    }, plugins);\n    const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n    const [canScrollNext, setCanScrollNext] = React.useState(false);\n    const onSelect = React.useCallback((api: CarouselApi) => {\n        if (!api)\n            return;\n        setCanScrollPrev(api.canScrollPrev());\n        setCanScrollNext(api.canScrollNext());\n    }, []);\n    const scrollPrev = React.useCallback(() => {\n        api?.scrollPrev();\n    }, [api]);\n    const scrollNext = React.useCallback(() => {\n        api?.scrollNext();\n    }, [api]);\n    const handleKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key === \"ArrowLeft\") {\n            event.preventDefault();\n            scrollPrev();\n        }\n        else if (event.key === \"ArrowRight\") {\n            event.preventDefault();\n            scrollNext();\n        }\n    }, [scrollPrev, scrollNext]);\n    React.useEffect(() => {\n        if (!api || !setApi)\n            return;\n        setApi(api);\n    }, [api, setApi]);\n    React.useEffect(() => {\n        if (!api)\n            return;\n        onSelect(api);\n        api.on(\"reInit\", onSelect);\n        api.on(\"select\", onSelect);\n        return () => {\n            api?.off(\"select\", onSelect);\n        };\n    }, [api, onSelect]);\n    return (<CarouselContext.Provider value={{\n            carouselRef,\n            api: api,\n            opts,\n            orientation: orientation || (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\"),\n            scrollPrev,\n            scrollNext,\n            canScrollPrev,\n            canScrollNext,\n        }}>\n      <div onKeyDownCapture={handleKeyDown} className={cn(\"relative\", className)} role=\"region\" aria-roledescription=\"carousel\" data-slot=\"carousel\" {...props}>\n        {children}\n      </div>\n    </CarouselContext.Provider>);\n}\nfunction CarouselContent({ className, ...props }: React.ComponentProps<\"div\">) {\n    const { carouselRef, orientation } = useCarousel();\n    return (<div ref={carouselRef} className=\"overflow-hidden\" data-slot=\"carousel-content\">\n      <div className={cn(\"flex\", orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\", className)} {...props}/>\n    </div>);\n}\nfunction CarouselItem({ className, ...props }: React.ComponentProps<\"div\">) {\n    const { orientation } = useCarousel();\n    return (<div role=\"group\" aria-roledescription=\"slide\" data-slot=\"carousel-item\" className={cn(\"min-w-0 shrink-0 grow-0 basis-full\", orientation === \"horizontal\" ? \"pl-4\" : \"pt-4\", className)} {...props}/>);\n}\nfunction CarouselPrevious({ className, variant = \"outline\", size = \"icon-sm\", ...props }: React.ComponentProps<typeof Button>) {\n    const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n    return (<Button data-slot=\"carousel-previous\" variant={variant} size={size} className={cn(\"absolute touch-manipulation rounded-full\", orientation === \"horizontal\"\n            ? \"inset-y-0 -left-12 my-auto\"\n            : \"-top-12 left-1/2 -translate-x-1/2 rotate-90\", className)} disabled={!canScrollPrev} onClick={scrollPrev} {...props}>\n      <ChevronLeftIcon />\n      <span className=\"sr-only\">Previous slide</span>\n    </Button>);\n}\nfunction CarouselNext({ className, variant = \"outline\", size = \"icon-sm\", ...props }: React.ComponentProps<typeof Button>) {\n    const { orientation, scrollNext, canScrollNext } = useCarousel();\n    return (<Button data-slot=\"carousel-next\" variant={variant} size={size} className={cn(\"absolute touch-manipulation rounded-full\", orientation === \"horizontal\"\n            ? \"inset-y-0 -right-12 my-auto\"\n            : \"-bottom-12 left-1/2 -translate-x-1/2 rotate-90\", className)} disabled={!canScrollNext} onClick={scrollNext} {...props}>\n      <ChevronRightIcon />\n      <span className=\"sr-only\">Next slide</span>\n    </Button>);\n}\nexport { Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, useCarousel, };\n"
    },
    {
      "path": "components/ui/chart.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cn } from \"cn\";\nimport * as React from \"react\";\nimport type { TooltipValueType } from \"recharts\";\nimport * as RechartsPrimitive from \"recharts\";\nconst THEMES = { light: \"\", dark: \".dark\" } as const;\nconst INITIAL_DIMENSION = { width: 320, height: 200 } as const;\ntype TooltipNameType = number | string;\nexport type ChartConfig = Record<string, {\n    label?: React.ReactNode;\n    icon?: React.ComponentType;\n} & ({\n    color?: string;\n    theme?: never;\n} | {\n    color?: never;\n    theme: Record<keyof typeof THEMES, string>;\n})>;\ntype ChartContextProps = {\n    config: ChartConfig;\n};\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\nfunction useChart() {\n    const context = React.useContext(ChartContext);\n    if (!context) {\n        throw new Error(\"useChart must be used within a <ChartContainer />\");\n    }\n    return context;\n}\nfunction ChartContainer({ id, className, children, config, initialDimension = INITIAL_DIMENSION, ...props }: React.ComponentProps<\"div\"> & {\n    config: ChartConfig;\n    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>[\"children\"];\n    initialDimension?: {\n        width: number;\n        height: number;\n    };\n}) {\n    const uniqueId = React.useId();\n    const chartId = `chart-${id ?? uniqueId.replace(/:/g, \"\")}`;\n    return (<ChartContext.Provider value={{ config }}>\n      <div data-slot=\"chart\" data-chart={chartId} className={cn(\"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\", className)} {...props}>\n        <ChartStyle id={chartId} config={config}/>\n        <RechartsPrimitive.ResponsiveContainer initialDimension={initialDimension}>\n          {children}\n        </RechartsPrimitive.ResponsiveContainer>\n      </div>\n    </ChartContext.Provider>);\n}\nconst ChartStyle = ({ id, config }: {\n    id: string;\n    config: ChartConfig;\n}) => {\n    const colorConfig = Object.entries(config).filter(([, config]) => config.theme ?? config.color);\n    if (!colorConfig.length) {\n        return null;\n    }\n    return (<style dangerouslySetInnerHTML={{\n            __html: Object.entries(THEMES)\n                .map(([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n                .map(([key, itemConfig]) => {\n                const color = itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ??\n                    itemConfig.color;\n                return color ? `  --color-${key}: ${color};` : null;\n            })\n                .join(\"\\n\")}\n}\n`)\n                .join(\"\\n\"),\n        }}/>);\n};\nconst ChartTooltip = RechartsPrimitive.Tooltip;\nfunction ChartTooltipContent({ active, payload, className, indicator = \"dot\", hideLabel = false, hideIndicator = false, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<\"div\"> & {\n    hideLabel?: boolean;\n    hideIndicator?: boolean;\n    indicator?: \"line\" | \"dot\" | \"dashed\";\n    nameKey?: string;\n    labelKey?: string;\n} & Omit<RechartsPrimitive.DefaultTooltipContentProps<TooltipValueType, TooltipNameType>, \"accessibilityLayer\">) {\n    const { config } = useChart();\n    const tooltipLabel = React.useMemo(() => {\n        if (hideLabel || !payload?.length) {\n            return null;\n        }\n        const [item] = payload;\n        const key = `${labelKey ?? item?.dataKey ?? item?.name ?? \"value\"}`;\n        const itemConfig = getPayloadConfigFromPayload(config, item, key);\n        const value = !labelKey && typeof label === \"string\"\n            ? (config[label]?.label ?? label)\n            : itemConfig?.label;\n        if (labelFormatter) {\n            return (<div className={cn(\"font-medium\", labelClassName)}>\n          {labelFormatter(value, payload)}\n        </div>);\n        }\n        if (!value) {\n            return null;\n        }\n        return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>;\n    }, [\n        label,\n        labelFormatter,\n        payload,\n        hideLabel,\n        labelClassName,\n        config,\n        labelKey,\n    ]);\n    if (!active || !payload?.length) {\n        return null;\n    }\n    const nestLabel = payload.length === 1 && indicator !== \"dot\";\n    return (<div className={cn(\"grid min-w-32 items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl\", className)}>\n      {!nestLabel ? tooltipLabel : null}\n      <div className=\"grid gap-1.5\">\n        {payload\n            .filter((item) => item.type !== \"none\")\n            .map((item, index) => {\n            const key = `${nameKey ?? item.name ?? item.dataKey ?? \"value\"}`;\n            const itemConfig = getPayloadConfigFromPayload(config, item, key);\n            const indicatorColor = color ?? item.payload?.fill ?? item.color;\n            return (<div key={index} className={cn(\"flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground\", indicator === \"dot\" && \"items-center\")}>\n                {formatter && item?.value !== undefined && item.name ? (formatter(item.value, item.name, item, index, item.payload)) : (<>\n                    {itemConfig?.icon ? (<itemConfig.icon />) : (!hideIndicator && (<div className={cn(\"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)\", {\n                            \"h-2.5 w-2.5\": indicator === \"dot\",\n                            \"w-1\": indicator === \"line\",\n                            \"w-0 border-[1.5px] border-dashed bg-transparent\": indicator === \"dashed\",\n                            \"my-0.5\": nestLabel && indicator === \"dashed\",\n                        })} style={{\n                            \"--color-bg\": indicatorColor,\n                            \"--color-border\": indicatorColor,\n                        } as React.CSSProperties}/>))}\n                    <div className={cn(\"flex flex-1 justify-between leading-none\", nestLabel ? \"items-end\" : \"items-center\")}>\n                      <div className=\"grid gap-1.5\">\n                        {nestLabel ? tooltipLabel : null}\n                        <span className=\"text-muted-foreground\">\n                          {itemConfig?.label ?? item.name}\n                        </span>\n                      </div>\n                      {item.value != null && (<span className=\"font-mono font-medium text-foreground tabular-nums\">\n                          {typeof item.value === \"number\"\n                            ? item.value.toLocaleString()\n                            : String(item.value)}\n                        </span>)}\n                    </div>\n                  </>)}\n              </div>);\n        })}\n      </div>\n    </div>);\n}\nconst ChartLegend = RechartsPrimitive.Legend;\nfunction ChartLegendContent({ className, hideIcon = false, payload, verticalAlign = \"bottom\", nameKey, }: React.ComponentProps<\"div\"> & {\n    hideIcon?: boolean;\n    nameKey?: string;\n} & RechartsPrimitive.DefaultLegendContentProps) {\n    const { config } = useChart();\n    if (!payload?.length) {\n        return null;\n    }\n    return (<div className={cn(\"flex items-center justify-center gap-4\", verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\", className)}>\n      {payload\n            .filter((item) => item.type !== \"none\")\n            .map((item, index) => {\n            const key = `${nameKey ?? item.dataKey ?? \"value\"}`;\n            const itemConfig = getPayloadConfigFromPayload(config, item, key);\n            return (<div key={index} className={cn(\"flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground\")}>\n              {itemConfig?.icon && !hideIcon ? (<itemConfig.icon />) : (<div className=\"h-2 w-2 shrink-0 rounded-[2px]\" style={{\n                        backgroundColor: item.color,\n                    }}/>)}\n              {itemConfig?.label}\n            </div>);\n        })}\n    </div>);\n}\nfunction getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {\n    if (typeof payload !== \"object\" || payload === null) {\n        return undefined;\n    }\n    const payloadPayload = \"payload\" in payload &&\n        typeof payload.payload === \"object\" &&\n        payload.payload !== null\n        ? payload.payload\n        : undefined;\n    let configLabelKey: string = key;\n    if (key in payload &&\n        typeof payload[key as keyof typeof payload] === \"string\") {\n        configLabelKey = payload[key as keyof typeof payload] as string;\n    }\n    else if (payloadPayload &&\n        key in payloadPayload &&\n        typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\") {\n        configLabelKey = payloadPayload[key as keyof typeof payloadPayload] as string;\n    }\n    return configLabelKey in config ? config[configLabelKey] : config[key];\n}\nexport { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, };\n"
    },
    {
      "path": "components/ui/checkbox.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Checkbox as CheckboxPrimitive } from \"@base-ui/react/checkbox\";\nimport { cn } from \"cn\";\nimport { CheckIcon } from \"lucide-react\";\nfunction Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props) {\n    return (<CheckboxPrimitive.Root data-slot=\"checkbox\" className={cn(\"peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 group-has-[:focus-visible]/field-label:ring-0 group-has-[:focus-visible]/field-label:not-data-checked:border-input after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground group-has-[:focus-visible]/field-label:data-checked:border-primary dark:data-checked:bg-primary\", className)} {...props}>\n      <CheckboxPrimitive.Indicator data-slot=\"checkbox-indicator\" className=\"grid place-content-center text-current transition-none [&>svg]:size-3.5\">\n        <CheckIcon />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>);\n}\nexport { Checkbox };\n"
    },
    {
      "path": "components/ui/collapsible.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Collapsible as CollapsiblePrimitive } from \"@base-ui/react/collapsible\";\nfunction Collapsible({ ...props }: CollapsiblePrimitive.Root.Props) {\n    return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props}/>;\n}\nfunction CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props) {\n    return (<CollapsiblePrimitive.Trigger data-slot=\"collapsible-trigger\" {...props}/>);\n}\nfunction CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props) {\n    return (<CollapsiblePrimitive.Panel data-slot=\"collapsible-content\" {...props}/>);\n}\nexport { Collapsible, CollapsibleContent, CollapsibleTrigger };\n"
    },
    {
      "path": "components/ui/combobox.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Combobox as ComboboxPrimitive } from \"@base-ui/react\";\nimport { cn } from \"cn\";\nimport { CheckIcon, ChevronDownIcon, XIcon } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, } from \"@/components/ui/input-group\";\nconst Combobox = ComboboxPrimitive.Root;\nfunction ComboboxValue({ ...props }: ComboboxPrimitive.Value.Props) {\n    return <ComboboxPrimitive.Value data-slot=\"combobox-value\" {...props}/>;\n}\nfunction ComboboxTrigger({ className, children, ...props }: ComboboxPrimitive.Trigger.Props) {\n    return (<ComboboxPrimitive.Trigger data-slot=\"combobox-trigger\" className={cn(\"[&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      {children}\n      <ChevronDownIcon className=\"pointer-events-none size-4 text-muted-foreground\"/>\n    </ComboboxPrimitive.Trigger>);\n}\nfunction ComboboxClear({ className, ...props }: ComboboxPrimitive.Clear.Props) {\n    return (<ComboboxPrimitive.Clear data-slot=\"combobox-clear\" render={<InputGroupButton variant=\"ghost\" size=\"icon-xs\"/>} className={cn(className)} {...props}>\n      <XIcon className=\"pointer-events-none\"/>\n    </ComboboxPrimitive.Clear>);\n}\nfunction ComboboxInput({ className, children, disabled = false, showTrigger = true, showClear = false, ...props }: ComboboxPrimitive.Input.Props & {\n    showTrigger?: boolean;\n    showClear?: boolean;\n}) {\n    return (<InputGroup className={cn(\"w-auto\", className)}>\n      <ComboboxPrimitive.Input render={<InputGroupInput disabled={disabled}/>} {...props}/>\n      <InputGroupAddon align=\"inline-end\">\n        {showTrigger && (<InputGroupButton size=\"icon-xs\" variant=\"ghost\" render={<ComboboxTrigger />} data-slot=\"input-group-button\" className=\"group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent\" disabled={disabled}/>)}\n        {showClear && <ComboboxClear disabled={disabled}/>}\n      </InputGroupAddon>\n      {children}\n    </InputGroup>);\n}\nfunction ComboboxContent({ className, side = \"bottom\", sideOffset = 6, align = \"start\", alignOffset = 0, anchor, ...props }: ComboboxPrimitive.Popup.Props & Pick<ComboboxPrimitive.Positioner.Props, \"side\" | \"align\" | \"sideOffset\" | \"alignOffset\" | \"anchor\">) {\n    return (<ComboboxPrimitive.Portal>\n      <ComboboxPrimitive.Positioner side={side} sideOffset={sideOffset} align={align} alignOffset={alignOffset} anchor={anchor} className=\"isolate z-50\">\n        <ComboboxPrimitive.Popup data-slot=\"combobox-content\" data-chips={!!anchor} className={cn(\"group/combobox-content relative max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>\n      </ComboboxPrimitive.Positioner>\n    </ComboboxPrimitive.Portal>);\n}\nfunction ComboboxList({ className, ...props }: ComboboxPrimitive.List.Props) {\n    return (<ComboboxPrimitive.List data-slot=\"combobox-list\" className={cn(\"no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0\", className)} {...props}/>);\n}\nfunction ComboboxItem({ className, children, ...props }: ComboboxPrimitive.Item.Props) {\n    return (<ComboboxPrimitive.Item data-slot=\"combobox-item\" className={cn(\"relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      {children}\n      <ComboboxPrimitive.ItemIndicator render={<span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\"/>}>\n        <CheckIcon className=\"pointer-events-none\"/>\n      </ComboboxPrimitive.ItemIndicator>\n    </ComboboxPrimitive.Item>);\n}\nfunction ComboboxGroup({ className, ...props }: ComboboxPrimitive.Group.Props) {\n    return (<ComboboxPrimitive.Group data-slot=\"combobox-group\" className={cn(className)} {...props}/>);\n}\nfunction ComboboxLabel({ className, ...props }: ComboboxPrimitive.GroupLabel.Props) {\n    return (<ComboboxPrimitive.GroupLabel data-slot=\"combobox-label\" className={cn(\"px-2 py-1.5 text-xs text-muted-foreground\", className)} {...props}/>);\n}\nfunction ComboboxCollection({ ...props }: ComboboxPrimitive.Collection.Props) {\n    return (<ComboboxPrimitive.Collection data-slot=\"combobox-collection\" {...props}/>);\n}\nfunction ComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props) {\n    return (<ComboboxPrimitive.Empty data-slot=\"combobox-empty\" className={cn(\"hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex\", className)} {...props}/>);\n}\nfunction ComboboxSeparator({ className, ...props }: ComboboxPrimitive.Separator.Props) {\n    return (<ComboboxPrimitive.Separator data-slot=\"combobox-separator\" className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props}/>);\n}\nfunction ComboboxChips({ className, ...props }: React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> & ComboboxPrimitive.Chips.Props) {\n    return (<ComboboxPrimitive.Chips data-slot=\"combobox-chips\" className={cn(\"flex min-h-8 flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring/30 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40\", className)} {...props}/>);\n}\nfunction ComboboxChip({ className, children, showRemove = true, ...props }: ComboboxPrimitive.Chip.Props & {\n    showRemove?: boolean;\n}) {\n    return (<ComboboxPrimitive.Chip data-slot=\"combobox-chip\" className={cn(\"flex h-[calc(--spacing(5.25))] w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0\", className)} {...props}>\n      {children}\n      {showRemove && (<ComboboxPrimitive.ChipRemove render={<Button variant=\"ghost\" size=\"icon-xs\"/>} className=\"-ml-1 opacity-50 hover:opacity-100\" data-slot=\"combobox-chip-remove\">\n          <XIcon className=\"pointer-events-none\"/>\n        </ComboboxPrimitive.ChipRemove>)}\n    </ComboboxPrimitive.Chip>);\n}\nfunction ComboboxChipsInput({ className, ...props }: ComboboxPrimitive.Input.Props) {\n    return (<ComboboxPrimitive.Input data-slot=\"combobox-chip-input\" className={cn(\"min-w-16 flex-1 outline-none\", className)} {...props}/>);\n}\nfunction useComboboxAnchor() {\n    return React.useRef<HTMLDivElement | null>(null);\n}\nexport { Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, useComboboxAnchor, };\n"
    },
    {
      "path": "components/ui/command.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport { cn } from \"cn\";\nimport { CheckIcon, SearchIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, } from \"@/components/ui/dialog\";\nimport { InputGroup, InputGroupAddon } from \"@/components/ui/input-group\";\nfunction Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>) {\n    return (<CommandPrimitive data-slot=\"command\" className={cn(\"flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground\", className)} {...props}/>);\n}\nfunction CommandDialog({ title = \"Command Palette\", description = \"Search for a command to run...\", children, className, showCloseButton = false, ...props }: Omit<React.ComponentProps<typeof Dialog>, \"children\"> & {\n    title?: string;\n    description?: string;\n    className?: string;\n    showCloseButton?: boolean;\n    children: React.ReactNode;\n}) {\n    return (<Dialog {...props}>\n      <DialogHeader className=\"sr-only\">\n        <DialogTitle>{title}</DialogTitle>\n        <DialogDescription>{description}</DialogDescription>\n      </DialogHeader>\n      <DialogContent className={cn(\"top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0\", className)} showCloseButton={showCloseButton}>\n        {children}\n      </DialogContent>\n    </Dialog>);\n}\nfunction CommandInput({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Input>) {\n    return (<div data-slot=\"command-input-wrapper\" className=\"p-1 pb-0\">\n      <InputGroup className=\"h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!\">\n        <CommandPrimitive.Input data-slot=\"command-input\" className={cn(\"w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50\", className)} {...props}/>\n        <InputGroupAddon>\n          <SearchIcon className=\"size-4 shrink-0 opacity-50\"/>\n        </InputGroupAddon>\n      </InputGroup>\n    </div>);\n}\nfunction CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>) {\n    return (<CommandPrimitive.List data-slot=\"command-list\" className={cn(\"no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none\", className)} {...props}/>);\n}\nfunction CommandEmpty({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>) {\n    return (<CommandPrimitive.Empty data-slot=\"command-empty\" className={cn(\"py-6 text-center text-sm\", className)} {...props}/>);\n}\nfunction CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>) {\n    return (<CommandPrimitive.Group data-slot=\"command-group\" className={cn(\"overflow-hidden p-1 text-foreground **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:text-muted-foreground\", className)} {...props}/>);\n}\nfunction CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>) {\n    return (<CommandPrimitive.Separator data-slot=\"command-separator\" className={cn(\"-mx-1 h-px bg-border\", className)} {...props}/>);\n}\nfunction CommandItem({ className, children, ...props }: React.ComponentProps<typeof CommandPrimitive.Item>) {\n    return (<CommandPrimitive.Item data-slot=\"command-item\" className={cn(\"group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-selected:bg-muted data-selected:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-selected:*:[svg]:text-foreground\", className)} {...props}>\n      {children}\n      <CheckIcon className=\"ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100\"/>\n    </CommandPrimitive.Item>);\n}\nfunction CommandShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"command-shortcut\" className={cn(\"ml-auto text-xs tracking-widest text-muted-foreground group-data-selected/command-item:text-foreground\", className)} {...props}/>);\n}\nexport { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, };\n"
    },
    {
      "path": "components/ui/context-menu.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { ContextMenu as ContextMenuPrimitive } from \"@base-ui/react/context-menu\";\nimport { cn } from \"cn\";\nimport { CheckIcon, ChevronRightIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nfunction ContextMenu({ ...props }: ContextMenuPrimitive.Root.Props) {\n    return <ContextMenuPrimitive.Root data-slot=\"context-menu\" {...props}/>;\n}\nfunction ContextMenuPortal({ ...props }: ContextMenuPrimitive.Portal.Props) {\n    return (<ContextMenuPrimitive.Portal data-slot=\"context-menu-portal\" {...props}/>);\n}\nfunction ContextMenuTrigger({ className, ...props }: ContextMenuPrimitive.Trigger.Props) {\n    return (<ContextMenuPrimitive.Trigger data-slot=\"context-menu-trigger\" className={cn(\"select-none\", className)} {...props}/>);\n}\nfunction ContextMenuContent({ className, align = \"start\", alignOffset = 4, side = \"right\", sideOffset = 0, ...props }: ContextMenuPrimitive.Popup.Props & Pick<ContextMenuPrimitive.Positioner.Props, \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\">) {\n    return (<ContextMenuPrimitive.Portal>\n      <ContextMenuPrimitive.Positioner className=\"isolate z-50 outline-none\" align={align} alignOffset={alignOffset} side={side} sideOffset={sideOffset}>\n        <ContextMenuPrimitive.Popup data-slot=\"context-menu-content\" className={cn(\"z-50 max-h-(--available-height) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 outline-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>\n      </ContextMenuPrimitive.Positioner>\n    </ContextMenuPrimitive.Portal>);\n}\nfunction ContextMenuGroup({ ...props }: ContextMenuPrimitive.Group.Props) {\n    return (<ContextMenuPrimitive.Group data-slot=\"context-menu-group\" {...props}/>);\n}\nfunction ContextMenuLabel({ className, inset, ...props }: ContextMenuPrimitive.GroupLabel.Props & {\n    inset?: boolean;\n}) {\n    return (<ContextMenuPrimitive.GroupLabel data-slot=\"context-menu-label\" data-inset={inset} className={cn(\"px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:pl-7\", className)} {...props}/>);\n}\nfunction ContextMenuItem({ className, inset, variant = \"default\", ...props }: ContextMenuPrimitive.Item.Props & {\n    inset?: boolean;\n    variant?: \"default\" | \"destructive\";\n}) {\n    return (<ContextMenuPrimitive.Item data-slot=\"context-menu-item\" data-inset={inset} data-variant={variant} className={cn(\"group/context-menu-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 focus:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive\", className)} {...props}/>);\n}\nfunction ContextMenuSub({ ...props }: ContextMenuPrimitive.SubmenuRoot.Props) {\n    return (<ContextMenuPrimitive.SubmenuRoot data-slot=\"context-menu-sub\" {...props}/>);\n}\nfunction ContextMenuSubTrigger({ className, inset, children, ...props }: ContextMenuPrimitive.SubmenuTrigger.Props & {\n    inset?: boolean;\n}) {\n    return (<ContextMenuPrimitive.SubmenuTrigger data-slot=\"context-menu-sub-trigger\" data-inset={inset} className={cn(\"flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      {children}\n      <ChevronRightIcon className=\"ml-auto\"/>\n    </ContextMenuPrimitive.SubmenuTrigger>);\n}\nfunction ContextMenuSubContent({ ...props }: React.ComponentProps<typeof ContextMenuContent>) {\n    return (<ContextMenuContent data-slot=\"context-menu-sub-content\" className=\"shadow-lg\" side=\"right\" {...props}/>);\n}\nfunction ContextMenuCheckboxItem({ className, children, checked, inset, ...props }: ContextMenuPrimitive.CheckboxItem.Props & {\n    inset?: boolean;\n}) {\n    return (<ContextMenuPrimitive.CheckboxItem data-slot=\"context-menu-checkbox-item\" data-inset={inset} className={cn(\"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} checked={checked} {...props}>\n      <span className=\"pointer-events-none absolute right-2\">\n        <ContextMenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </ContextMenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </ContextMenuPrimitive.CheckboxItem>);\n}\nfunction ContextMenuRadioGroup({ ...props }: ContextMenuPrimitive.RadioGroup.Props) {\n    return (<ContextMenuPrimitive.RadioGroup data-slot=\"context-menu-radio-group\" {...props}/>);\n}\nfunction ContextMenuRadioItem({ className, children, inset, ...props }: ContextMenuPrimitive.RadioItem.Props & {\n    inset?: boolean;\n}) {\n    return (<ContextMenuPrimitive.RadioItem data-slot=\"context-menu-radio-item\" data-inset={inset} className={cn(\"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      <span className=\"pointer-events-none absolute right-2\">\n        <ContextMenuPrimitive.RadioItemIndicator>\n          <CheckIcon />\n        </ContextMenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </ContextMenuPrimitive.RadioItem>);\n}\nfunction ContextMenuSeparator({ className, ...props }: ContextMenuPrimitive.Separator.Props) {\n    return (<ContextMenuPrimitive.Separator data-slot=\"context-menu-separator\" className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props}/>);\n}\nfunction ContextMenuShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"context-menu-shortcut\" className={cn(\"ml-auto text-xs tracking-widest text-muted-foreground group-focus/context-menu-item:text-accent-foreground\", className)} {...props}/>);\n}\nexport { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, };\n"
    },
    {
      "path": "components/ui/copy-button.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Check, Copy } from \"lucide-react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\n\nexport function CopyButton({\n  value,\n  label = \"Copy\",\n  copiedLabel = \"Copied\",\n}: {\n  value: string;\n  label?: string;\n  copiedLabel?: string;\n}) {\n  const [status, setStatus] = useState<\"idle\" | \"copied\" | \"error\">(\"idle\");\n  const timer = useRef<ReturnType<typeof setTimeout> | null>(null);\n  useEffect(\n    () => () => {\n      if (timer.current) clearTimeout(timer.current);\n    },\n    [],\n  );\n  async function copy() {\n    if (timer.current) clearTimeout(timer.current);\n    try {\n      await navigator.clipboard.writeText(value);\n      setStatus(\"copied\");\n      timer.current = setTimeout(() => setStatus(\"idle\"), 2000);\n    } catch {\n      setStatus(\"error\");\n    }\n  }\n  return (\n    <div className=\"inline-flex flex-col items-start gap-1\">\n      <Button type=\"button\" variant=\"outline\" onClick={copy}>\n        {status === \"copied\" ? (\n          <Check data-icon=\"inline-start\" />\n        ) : (\n          <Copy data-icon=\"inline-start\" />\n        )}\n        {status === \"copied\" ? copiedLabel : label}\n      </Button>\n      <span\n        role=\"status\"\n        className={status === \"error\" ? \"text-xs text-destructive\" : \"sr-only\"}\n      >\n        {status === \"error\"\n          ? \"Could not copy. Select and copy the text manually.\"\n          : status === \"copied\"\n            ? copiedLabel\n            : \"\"}\n      </span>\n    </div>\n  );\n}\n"
    },
    {
      "path": "components/ui/dialog.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\"\nimport { cn } from \"cn\"\n\nimport { Button } from \"@/components/ui/button\"\nimport { XIcon } from \"lucide-react\"\n\nfunction Dialog({ ...props }: DialogPrimitive.Root.Props) {\n  return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\n}\n\nfunction DialogTrigger({ ...props }: DialogPrimitive.Trigger.Props) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({ ...props }: DialogPrimitive.Portal.Props) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ ...props }: DialogPrimitive.Close.Props) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({\n  className,\n  ...props\n}: DialogPrimitive.Backdrop.Props) {\n  return (\n    <DialogPrimitive.Backdrop\n      data-slot=\"dialog-overlay\"\n      className={cn(\n        \"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  ...props\n}: DialogPrimitive.Popup.Props & {\n  showCloseButton?: boolean\n}) {\n  return (\n    <DialogPortal>\n      <DialogOverlay />\n      <DialogPrimitive.Popup\n        data-slot=\"dialog-content\"\n        className={cn(\n          \"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <DialogPrimitive.Close\n            data-slot=\"dialog-close\"\n            render={\n              <Button\n                variant=\"ghost\"\n                className=\"absolute top-2 right-2\"\n                size=\"icon-sm\"\n              />\n            }\n          >\n            <XIcon\n            />\n            <span className=\"sr-only\">Close</span>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Popup>\n    </DialogPortal>\n  )\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn(\"flex flex-col gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DialogFooter({\n  className,\n  showCloseButton = false,\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  showCloseButton?: boolean\n}) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        \"-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && (\n        <DialogPrimitive.Close render={<Button variant=\"outline\" />}>\n          Close\n        </DialogPrimitive.Close>\n      )}\n    </div>\n  )\n}\n\nfunction DialogTitle({ className, ...props }: DialogPrimitive.Title.Props) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={cn(\n        \"font-heading text-base leading-none font-medium\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DialogDescription({\n  className,\n  ...props\n}: DialogPrimitive.Description.Props) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={cn(\n        \"text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n}\n"
    },
    {
      "path": "components/ui/direction.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nexport { DirectionProvider, useDirection, } from \"@base-ui/react/direction-provider\";\n"
    },
    {
      "path": "components/ui/drawer.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Drawer as DrawerPrimitive } from \"@base-ui/react/drawer\";\nimport { cn } from \"cn\";\nimport * as React from \"react\";\ntype DrawerContextProps = {\n    hasSnapPoints: boolean;\n    modal: DrawerPrimitive.Root.Props[\"modal\"];\n    showSwipeHandle: boolean;\n    swipeDirection: NonNullable<DrawerPrimitive.Root.Props[\"swipeDirection\"]>;\n};\nconst DrawerContext = React.createContext<DrawerContextProps | null>(null);\nfunction useDrawer() {\n    const context = React.useContext(DrawerContext);\n    if (!context) {\n        throw new Error(\"useDrawer must be used within a Drawer.\");\n    }\n    return context;\n}\nfunction Drawer({ modal = true, showSwipeHandle = false, snapPoints, swipeDirection = \"down\", ...props }: DrawerPrimitive.Root.Props & {\n    showSwipeHandle?: boolean;\n}) {\n    const hasSnapPoints = snapPoints != null && snapPoints.length > 0;\n    const contextValue = React.useMemo(() => ({ hasSnapPoints, modal, showSwipeHandle, swipeDirection }), [hasSnapPoints, modal, showSwipeHandle, swipeDirection]);\n    return (<DrawerContext.Provider value={contextValue}>\n      <DrawerPrimitive.Root data-slot=\"drawer\" modal={modal} snapPoints={snapPoints} swipeDirection={swipeDirection} {...props}/>\n    </DrawerContext.Provider>);\n}\nfunction DrawerTrigger({ ...props }: DrawerPrimitive.Trigger.Props) {\n    return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props}/>;\n}\nfunction DrawerPortal({ ...props }: DrawerPrimitive.Portal.Props) {\n    return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props}/>;\n}\nfunction DrawerClose({ ...props }: DrawerPrimitive.Close.Props) {\n    return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props}/>;\n}\nfunction DrawerOverlay({ className, ...props }: DrawerPrimitive.Backdrop.Props) {\n    return (<DrawerPrimitive.Backdrop data-slot=\"drawer-overlay\" className={cn(\"fixed inset-0 z-50 min-h-dvh bg-black/10 opacity-[max(var(--drawer-overlay-min-opacity,0),calc(1-var(--drawer-swipe-progress)))] transition-opacity duration-450 ease-[cubic-bezier(0.32,0.72,0,1)] select-none data-ending-style:pointer-events-none data-ending-style:opacity-0 data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-snap-points:[--drawer-overlay-min-opacity:0.5] data-starting-style:opacity-0 data-swiping:duration-0 supports-backdrop-filter:backdrop-blur-xs supports-[-webkit-touch-callout:none]:absolute\", className)} {...props}/>);\n}\nfunction DrawerSwipeHandle({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"drawer-swipe-handle\" aria-hidden=\"true\" className={cn(\"relative z-10 flex shrink-0 cursor-grab transition-opacity duration-200 group-data-nested-drawer-open/drawer-popup:opacity-0 group-data-nested-drawer-swiping/drawer-popup:opacity-100 group-data-[swipe-axis=x]/drawer-popup:h-full group-data-[swipe-axis=x]/drawer-popup:w-3 group-data-[swipe-axis=x]/drawer-popup:items-center group-data-[swipe-axis=y]/drawer-popup:h-3 group-data-[swipe-axis=y]/drawer-popup:w-full group-data-[swipe-axis=y]/drawer-popup:justify-center group-data-[swipe-direction=down]/drawer-popup:items-end group-data-[swipe-direction=left]/drawer-popup:order-last group-data-[swipe-direction=left]/drawer-popup:justify-start group-data-[swipe-direction=right]/drawer-popup:justify-end group-data-[swipe-direction=up]/drawer-popup:order-last group-data-[swipe-direction=up]/drawer-popup:items-start after:block after:shrink-0 after:rounded-full after:bg-muted group-data-[swipe-axis=x]/drawer-popup:after:h-24 group-data-[swipe-axis=x]/drawer-popup:after:w-1 group-data-[swipe-axis=y]/drawer-popup:after:h-1 group-data-[swipe-axis=y]/drawer-popup:after:w-24 active:cursor-grabbing\", className)} {...props}/>);\n}\nfunction DrawerContent({ className, children, ...props }: DrawerPrimitive.Popup.Props) {\n    const { hasSnapPoints, modal, showSwipeHandle, swipeDirection } = useDrawer();\n    const swipeAxis = swipeDirection === \"down\" || swipeDirection === \"up\" ? \"y\" : \"x\";\n    return (<DrawerPortal data-slot=\"drawer-portal\">\n      {modal === true && (<DrawerOverlay data-snap-points={hasSnapPoints ? \"\" : undefined}/>)}\n      <DrawerPrimitive.Viewport data-slot=\"drawer-viewport\" data-modal={modal} className=\"pointer-events-none fixed inset-0 z-50 select-none data-[modal=true]:pointer-events-auto\">\n        <DrawerPrimitive.Popup data-slot=\"drawer-popup\" data-swipe-axis={swipeAxis} data-snap-points={hasSnapPoints ? \"\" : undefined} className={cn(\"group/drawer-popup pointer-events-auto fixed z-50 m-(--drawer-inset,0px) flex h-(--drawer-content-height) max-h-(--drawer-content-max-height,none) min-h-0 w-(--drawer-content-width,auto) transform-[translate3d(var(--translate-x,0px),var(--translate-y,0px),0)_scale(var(--stack-scale))] flex-col bg-popover text-sm text-popover-foreground transition-[transform,height,opacity,filter] duration-450 ease-[cubic-bezier(0.22,1,0.36,1)] will-change-transform outline-none select-none [interpolate-size:allow-keywords] data-[swipe-direction=down]:rounded-t-xl data-[swipe-direction=down]:border-t data-[swipe-direction=left]:rounded-r-xl data-[swipe-direction=left]:border-r data-[swipe-direction=right]:rounded-l-xl data-[swipe-direction=right]:border-l data-[swipe-direction=up]:rounded-b-xl data-[swipe-direction=up]:border-b\", \"data-nested-drawer-open:overflow-hidden data-nested-drawer-open:brightness-95\", \"after:pointer-events-none after:absolute after:bg-(--drawer-bleed-background,var(--color-popover)) data-[swipe-axis=x]:after:inset-y-0 data-[swipe-axis=x]:after:w-(--bleed) data-[swipe-axis=y]:after:inset-x-0 data-[swipe-axis=y]:after:h-(--bleed) data-[swipe-direction=down]:after:top-full data-[swipe-direction=left]:after:right-full data-[swipe-direction=right]:after:left-full data-[swipe-direction=up]:after:bottom-full\", \"[--drawer-content-height:var(--drawer-height,auto)] data-[swipe-axis=x]:[--drawer-content-width:75%] data-[swipe-axis=y]:[--drawer-content-max-height:calc(100dvh-6rem)] data-[swipe-axis=y]:data-snap-points:[--drawer-content-height:100dvh] data-[swipe-axis=x]:sm:[--drawer-content-width:24rem]\", \"[--bleed:3rem] [--peek:1rem] [--stack-height:var(--drawer-frontmost-height,var(--drawer-height,0px))] [--stack-peek-offset:max(0px,calc((var(--nested-drawers)-var(--stack-progress))*var(--peek)))] [--stack-progress:clamp(0,var(--drawer-swipe-progress),1)] [--stack-scale-base:max(0,calc(1-(var(--nested-drawers)*var(--stack-step))))] [--stack-scale:clamp(0,calc(var(--stack-scale-base)+(var(--stack-step)*var(--stack-progress))),1)] [--stack-shrink:calc(1-var(--stack-scale))] [--stack-step:0.05]\", \"data-ending-style:transform-(--closed-transform) data-ending-style:opacity-[0.9999] data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-nested-drawer-swiping:duration-0 data-ending-style:data-nested-drawer-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-starting-style:transform-(--closed-transform) data-swiping:duration-0 data-ending-style:data-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)]\", \"data-[swipe-axis=y]:inset-x-0 data-[swipe-axis=y]:data-nested-drawer-open:h-(--stack-height)\", \"data-[swipe-axis=x]:inset-y-0 data-[swipe-axis=x]:flex-row\", \"data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:origin-bottom data-[swipe-direction=down]:[--closed-transform:translate3d(0,calc(100%+var(--drawer-inset,0px)+2px),0)] data-[swipe-direction=down]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)-var(--stack-peek-offset)-(var(--stack-shrink)*var(--stack-height)))]\", \"data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:origin-top data-[swipe-direction=up]:[--closed-transform:translate3d(0,calc(-100%-var(--drawer-inset,0px)-2px),0)] data-[swipe-direction=up]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)+var(--stack-peek-offset)+(var(--stack-shrink)*var(--stack-height)))]\", \"data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:origin-left data-[swipe-direction=left]:[--closed-transform:translate3d(calc(-100%-var(--drawer-inset,0px)-2px),0,0)] data-[swipe-direction=left]:[--translate-x:calc(var(--drawer-swipe-movement-x)+var(--stack-peek-offset)+(var(--stack-shrink)*100%))]\", \"data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:origin-right data-[swipe-direction=right]:[--closed-transform:translate3d(calc(100%+var(--drawer-inset,0px)+2px),0,0)] data-[swipe-direction=right]:[--translate-x:calc(var(--drawer-swipe-movement-x)-var(--stack-peek-offset)-(var(--stack-shrink)*100%))]\", className)} {...props}>\n          {showSwipeHandle && <DrawerSwipeHandle />}\n          <DrawerPrimitive.Content data-slot=\"drawer-content\" className={cn(\"flex min-h-0 flex-1 flex-col overflow-hidden overscroll-contain rounded-[inherit] transition-opacity duration-300 ease-[cubic-bezier(0.45,1.005,0,1.005)] select-text group-data-nested-drawer-open/drawer-popup:opacity-0 group-data-nested-drawer-swiping/drawer-popup:opacity-100 group-data-swiping/drawer-popup:select-none\")}>\n            {children}\n          </DrawerPrimitive.Content>\n        </DrawerPrimitive.Popup>\n      </DrawerPrimitive.Viewport>\n    </DrawerPortal>);\n}\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"drawer-header\" className={cn(\"flex shrink-0 flex-col gap-0.5 p-4 pb-0 group-data-[swipe-axis=y]/drawer-popup:text-center md:gap-0.5 md:text-left\", className)} {...props}/>);\n}\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"drawer-footer\" className={cn(\"mt-auto flex shrink-0 flex-col gap-2 p-4 pt-0\", className)} {...props}/>);\n}\nfunction DrawerTitle({ className, ...props }: DrawerPrimitive.Title.Props) {\n    return (<DrawerPrimitive.Title data-slot=\"drawer-title\" className={cn(\"font-heading text-base font-medium text-foreground\", className)} {...props}/>);\n}\nfunction DrawerDescription({ className, ...props }: DrawerPrimitive.Description.Props) {\n    return (<DrawerPrimitive.Description data-slot=\"drawer-description\" className={cn(\"text-sm text-balance text-muted-foreground\", className)} {...props}/>);\n}\nexport { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerSwipeHandle, DrawerTitle, DrawerTrigger, };\n"
    },
    {
      "path": "components/ui/dropdown-menu.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\";\nimport { cn } from \"cn\";\nimport { CheckIcon, ChevronRightIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nfunction DropdownMenu({ ...props }: MenuPrimitive.Root.Props) {\n    return <MenuPrimitive.Root data-slot=\"dropdown-menu\" {...props}/>;\n}\nfunction DropdownMenuPortal({ ...props }: MenuPrimitive.Portal.Props) {\n    return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props}/>;\n}\nfunction DropdownMenuTrigger({ ...props }: MenuPrimitive.Trigger.Props) {\n    return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props}/>;\n}\nfunction DropdownMenuContent({ align = \"start\", alignOffset = 0, side = \"bottom\", sideOffset = 4, className, ...props }: MenuPrimitive.Popup.Props & Pick<MenuPrimitive.Positioner.Props, \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\">) {\n    return (<MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner className=\"isolate z-50 outline-none\" align={align} alignOffset={alignOffset} side={side} sideOffset={sideOffset}>\n        <MenuPrimitive.Popup data-slot=\"dropdown-menu-content\" className={cn(\"z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 outline-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>);\n}\nfunction DropdownMenuGroup({ ...props }: MenuPrimitive.Group.Props) {\n    return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props}/>;\n}\nfunction DropdownMenuLabel({ className, inset, ...props }: MenuPrimitive.GroupLabel.Props & {\n    inset?: boolean;\n}) {\n    return (<MenuPrimitive.GroupLabel data-slot=\"dropdown-menu-label\" data-inset={inset} className={cn(\"px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:pl-7\", className)} {...props}/>);\n}\nfunction DropdownMenuItem({ className, inset, variant = \"default\", ...props }: MenuPrimitive.Item.Props & {\n    inset?: boolean;\n    variant?: \"default\" | \"destructive\";\n}) {\n    return (<MenuPrimitive.Item data-slot=\"dropdown-menu-item\" data-inset={inset} data-variant={variant} className={cn(\"group/dropdown-menu-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive\", className)} {...props}/>);\n}\nfunction DropdownMenuSub({ ...props }: MenuPrimitive.SubmenuRoot.Props) {\n    return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props}/>;\n}\nfunction DropdownMenuSubTrigger({ className, inset, children, ...props }: MenuPrimitive.SubmenuTrigger.Props & {\n    inset?: boolean;\n}) {\n    return (<MenuPrimitive.SubmenuTrigger data-slot=\"dropdown-menu-sub-trigger\" data-inset={inset} className={cn(\"flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-popup-open:bg-accent data-popup-open:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      {children}\n      <ChevronRightIcon className=\"ml-auto\"/>\n    </MenuPrimitive.SubmenuTrigger>);\n}\nfunction DropdownMenuSubContent({ align = \"start\", alignOffset = -3, side = \"right\", sideOffset = 0, className, ...props }: React.ComponentProps<typeof DropdownMenuContent>) {\n    return (<DropdownMenuContent data-slot=\"dropdown-menu-sub-content\" className={cn(\"w-auto min-w-[96px] rounded-lg bg-popover p-1 text-popover-foreground shadow-lg ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} align={align} alignOffset={alignOffset} side={side} sideOffset={sideOffset} {...props}/>);\n}\nfunction DropdownMenuCheckboxItem({ className, children, checked, inset, ...props }: MenuPrimitive.CheckboxItem.Props & {\n    inset?: boolean;\n}) {\n    return (<MenuPrimitive.CheckboxItem data-slot=\"dropdown-menu-checkbox-item\" data-inset={inset} className={cn(\"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} checked={checked} {...props}>\n      <span className=\"pointer-events-none absolute right-2 flex items-center justify-center\" data-slot=\"dropdown-menu-checkbox-item-indicator\">\n        <MenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>);\n}\nfunction DropdownMenuRadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {\n    return (<MenuPrimitive.RadioGroup data-slot=\"dropdown-menu-radio-group\" {...props}/>);\n}\nfunction DropdownMenuRadioItem({ className, children, inset, ...props }: MenuPrimitive.RadioItem.Props & {\n    inset?: boolean;\n}) {\n    return (<MenuPrimitive.RadioItem data-slot=\"dropdown-menu-radio-item\" data-inset={inset} className={cn(\"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      <span className=\"pointer-events-none absolute right-2 flex items-center justify-center\" data-slot=\"dropdown-menu-radio-item-indicator\">\n        <MenuPrimitive.RadioItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>);\n}\nfunction DropdownMenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props) {\n    return (<MenuPrimitive.Separator data-slot=\"dropdown-menu-separator\" className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props}/>);\n}\nfunction DropdownMenuShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"dropdown-menu-shortcut\" className={cn(\"ml-auto text-xs tracking-widest text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground\", className)} {...props}/>);\n}\nexport { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, };\n"
    },
    {
      "path": "components/ui/empty-state.tsx",
      "type": "registry:ui",
      "content": "import type { ReactNode } from \"react\";\nimport {\n  Empty,\n  EmptyContent,\n  EmptyDescription,\n  EmptyHeader,\n  EmptyMedia,\n  EmptyTitle,\n} from \"@/components/ui/empty\";\n\nexport function EmptyState({\n  title,\n  description,\n  icon,\n  action,\n}: {\n  title: string;\n  description?: string;\n  icon?: ReactNode;\n  action?: ReactNode;\n}) {\n  return (\n    <Empty>\n      <EmptyHeader>\n        {icon && <EmptyMedia variant=\"icon\">{icon}</EmptyMedia>}\n        <EmptyTitle>{title}</EmptyTitle>\n        {description && <EmptyDescription>{description}</EmptyDescription>}\n      </EmptyHeader>\n      {action && <EmptyContent>{action}</EmptyContent>}\n    </Empty>\n  );\n}\n"
    },
    {
      "path": "components/ui/empty.tsx",
      "type": "registry:ui",
      "content": "import { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nfunction Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty\"\n      className={cn(\n        \"flex w-full min-w-0 flex-1 flex-col items-center justify-center gap-4 rounded-xl border-dashed p-6 text-center text-balance\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-header\"\n      className={cn(\"flex max-w-sm flex-col items-center gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nconst emptyMediaVariants = cva(\n  \"mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        icon: \"flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-4\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction EmptyMedia({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof emptyMediaVariants>) {\n  return (\n    <div\n      data-slot=\"empty-icon\"\n      data-variant={variant}\n      className={cn(emptyMediaVariants({ variant, className }))}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-title\"\n      className={cn(\n        \"font-heading text-sm font-medium tracking-tight\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn(\n        \"text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction EmptyContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-content\"\n      className={cn(\n        \"flex w-full max-w-sm min-w-0 flex-col items-center gap-2.5 text-sm text-balance\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Empty,\n  EmptyHeader,\n  EmptyTitle,\n  EmptyDescription,\n  EmptyContent,\n  EmptyMedia,\n}\n"
    },
    {
      "path": "components/ui/field.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport { useMemo } from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nimport { Label } from \"@/components/ui/label\"\nimport { Separator } from \"@/components/ui/separator\"\n\nfunction FieldSet({ className, ...props }: React.ComponentProps<\"fieldset\">) {\n  return (\n    <fieldset\n      data-slot=\"field-set\"\n      className={cn(\n        \"flex flex-col gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldLegend({\n  className,\n  variant = \"legend\",\n  ...props\n}: React.ComponentProps<\"legend\"> & { variant?: \"legend\" | \"label\" }) {\n  return (\n    <legend\n      data-slot=\"field-legend\"\n      data-variant={variant}\n      className={cn(\n        \"mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"field-group\"\n      className={cn(\n        \"group/field-group @container/field-group flex w-full flex-col gap-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst fieldVariants = cva(\n  \"group/field flex w-full gap-2 data-[invalid=true]:text-destructive\",\n  {\n    variants: {\n      orientation: {\n        vertical: \"flex-col *:w-full [&>.sr-only]:w-auto\",\n        horizontal:\n          \"flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n        responsive:\n          \"flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\",\n      },\n    },\n    defaultVariants: {\n      orientation: \"vertical\",\n    },\n  }\n)\n\nfunction Field({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof fieldVariants>) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"field\"\n      data-orientation={orientation}\n      className={cn(fieldVariants({ orientation }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction FieldContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"field-content\"\n      className={cn(\n        \"group/field-content flex flex-1 flex-col gap-0.5 leading-snug\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldLabel({\n  className,\n  ...props\n}: React.ComponentProps<typeof Label>) {\n  return (\n    <Label\n      data-slot=\"field-label\"\n      className={cn(\n        \"group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-data-checked:border-primary/30 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-muted/50 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-3 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/50 *:data-[slot=field]:p-2.5 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10\",\n        \"has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"field-label\"\n      className={cn(\n        \"flex w-fit items-center gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"field-description\"\n      className={cn(\n        \"text-left text-sm leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5\",\n        \"last:mt-0 nth-last-2:-mt-1\",\n        \"[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction FieldSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  children?: React.ReactNode\n}) {\n  return (\n    <div\n      data-slot=\"field-separator\"\n      data-content={!!children}\n      className={cn(\n        \"relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2\",\n        className\n      )}\n      {...props}\n    >\n      <Separator className=\"absolute inset-0 top-1/2\" />\n      {children && (\n        <span\n          className=\"relative mx-auto block w-fit bg-background px-2 text-muted-foreground\"\n          data-slot=\"field-separator-content\"\n        >\n          {children}\n        </span>\n      )}\n    </div>\n  )\n}\n\nfunction FieldError({\n  className,\n  children,\n  errors,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  errors?: Array<{ message?: string } | undefined>\n}) {\n  const content = useMemo(() => {\n    if (children) {\n      return children\n    }\n\n    if (!errors?.length) {\n      return null\n    }\n\n    const uniqueErrors = [\n      ...new Map(errors.map((error) => [error?.message, error])).values(),\n    ]\n\n    if (uniqueErrors?.length == 1) {\n      return uniqueErrors[0]?.message\n    }\n\n    return (\n      <ul className=\"ml-4 flex list-disc flex-col gap-1\">\n        {uniqueErrors.map(\n          (error, index) =>\n            error?.message && <li key={index}>{error.message}</li>\n        )}\n      </ul>\n    )\n  }, [children, errors])\n\n  if (!content) {\n    return null\n  }\n\n  return (\n    <div\n      role=\"alert\"\n      data-slot=\"field-error\"\n      className={cn(\"text-sm font-normal text-destructive\", className)}\n      {...props}\n    >\n      {content}\n    </div>\n  )\n}\n\nexport {\n  Field,\n  FieldLabel,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLegend,\n  FieldSeparator,\n  FieldSet,\n  FieldContent,\n  FieldTitle,\n}\n"
    },
    {
      "path": "components/ui/hover-card.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { PreviewCard as PreviewCardPrimitive } from \"@base-ui/react/preview-card\";\nimport { cn } from \"cn\";\nfunction HoverCard({ ...props }: PreviewCardPrimitive.Root.Props) {\n    return <PreviewCardPrimitive.Root data-slot=\"hover-card\" {...props}/>;\n}\nfunction HoverCardTrigger({ ...props }: PreviewCardPrimitive.Trigger.Props) {\n    return (<PreviewCardPrimitive.Trigger data-slot=\"hover-card-trigger\" {...props}/>);\n}\nfunction HoverCardContent({ className, side = \"bottom\", sideOffset = 4, align = \"center\", alignOffset = 4, ...props }: PreviewCardPrimitive.Popup.Props & Pick<PreviewCardPrimitive.Positioner.Props, \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\">) {\n    return (<PreviewCardPrimitive.Portal data-slot=\"hover-card-portal\">\n      <PreviewCardPrimitive.Positioner align={align} alignOffset={alignOffset} side={side} sideOffset={sideOffset} className=\"isolate z-50\">\n        <PreviewCardPrimitive.Popup data-slot=\"hover-card-content\" className={cn(\"z-50 w-64 origin-(--transform-origin) rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>\n      </PreviewCardPrimitive.Positioner>\n    </PreviewCardPrimitive.Portal>);\n}\nexport { HoverCard, HoverCardContent, HoverCardTrigger };\n"
    },
    {
      "path": "components/ui/input-group.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nfunction InputGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"input-group\" role=\"group\" className={cn(\"group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/30 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\", className)} {...props}/>);\n}\nconst inputGroupAddonVariants = cva(\"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4\", {\n    variants: {\n        align: {\n            \"inline-start\": \"order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]\",\n            \"inline-end\": \"order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]\",\n            \"block-start\": \"order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2\",\n            \"block-end\": \"order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2\",\n        },\n    },\n    defaultVariants: {\n        align: \"inline-start\",\n    },\n});\nfunction InputGroupAddon({ className, align = \"inline-start\", ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof inputGroupAddonVariants>) {\n    return (<div role=\"group\" data-slot=\"input-group-addon\" data-align={align} className={cn(inputGroupAddonVariants({ align }), className)} onClick={(e) => {\n            if ((e.target as HTMLElement).closest(\"button\")) {\n                return;\n            }\n            e.currentTarget.parentElement?.querySelector(\"input\")?.focus();\n        }} {...props}/>);\n}\nconst inputGroupButtonVariants = cva(\"flex items-center gap-2 text-sm shadow-none\", {\n    variants: {\n        size: {\n            xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n            sm: \"\",\n            \"icon-xs\": \"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0\",\n            \"icon-sm\": \"size-8 p-0 has-[>svg]:p-0\",\n        },\n    },\n    defaultVariants: {\n        size: \"xs\",\n    },\n});\nfunction InputGroupButton({ className, type = \"button\", variant = \"ghost\", size = \"xs\", ...props }: Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> & VariantProps<typeof inputGroupButtonVariants> & {\n    type?: \"button\" | \"submit\" | \"reset\";\n}) {\n    return (<Button type={type} data-size={size} variant={variant} className={cn(inputGroupButtonVariants({ size }), className)} {...props}/>);\n}\nfunction InputGroupText({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span className={cn(\"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\", className)} {...props}/>);\n}\nfunction InputGroupInput({ className, ...props }: React.ComponentProps<\"input\">) {\n    return (<Input data-slot=\"input-group-control\" className={cn(\"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\", className)} {...props}/>);\n}\nfunction InputGroupTextarea({ className, ...props }: React.ComponentProps<\"textarea\">) {\n    return (<Textarea data-slot=\"input-group-control\" className={cn(\"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\", className)} {...props}/>);\n}\nexport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, };\n"
    },
    {
      "path": "components/ui/input-otp.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cn } from \"cn\";\nimport { OTPInput, OTPInputContext } from \"input-otp\";\nimport { MinusIcon } from \"lucide-react\";\nimport * as React from \"react\";\nfunction InputOTP({ className, containerClassName, ...props }: React.ComponentProps<typeof OTPInput> & {\n    containerClassName?: string;\n}) {\n    return (<OTPInput data-slot=\"input-otp\" containerClassName={cn(\"cn-input-otp flex items-center has-disabled:opacity-50\", containerClassName)} spellCheck={false} className={cn(\"disabled:cursor-not-allowed\", className)} {...props}/>);\n}\nfunction InputOTPGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"input-otp-group\" className={cn(\"flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40\", className)} {...props}/>);\n}\nfunction InputOTPSlot({ index, className, ...props }: React.ComponentProps<\"div\"> & {\n    index: number;\n}) {\n    const inputOTPContext = React.useContext(OTPInputContext);\n    const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};\n    return (<div data-slot=\"input-otp-slot\" data-active={isActive} className={cn(\"relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40\", className)} {...props}>\n      {char}\n      {hasFakeCaret && (<div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"h-4 w-px animate-caret-blink bg-foreground duration-1000\"/>\n        </div>)}\n    </div>);\n}\nfunction InputOTPSeparator({ ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"input-otp-separator\" className=\"flex items-center [&_svg:not([class*='size-'])]:size-4\" role=\"separator\" {...props}>\n      <MinusIcon />\n    </div>);\n}\nexport { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };\n"
    },
    {
      "path": "components/ui/input.tsx",
      "type": "registry:ui",
      "content": "import * as React from \"react\"\nimport { Input as InputPrimitive } from \"@base-ui/react/input\"\nimport { cn } from \"cn\"\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <InputPrimitive\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring/30 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Input }\n"
    },
    {
      "path": "components/ui/item.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nimport { Separator } from \"@/components/ui/separator\";\nfunction ItemGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div role=\"list\" data-slot=\"item-group\" className={cn(\"group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2\", className)} {...props}/>);\n}\nfunction ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>) {\n    return (<Separator data-slot=\"item-separator\" orientation=\"horizontal\" className={cn(\"my-2\", className)} {...props}/>);\n}\nconst itemVariants = cva(\"group/item flex w-full flex-wrap items-center rounded-lg border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors [a]:hover:bg-muted\", {\n    variants: {\n        variant: {\n            default: \"border-transparent\",\n            outline: \"border-border\",\n            muted: \"border-transparent bg-muted/50\",\n        },\n        size: {\n            default: \"gap-2.5 px-3 py-2.5\",\n            sm: \"gap-2.5 px-3 py-2.5\",\n            xs: \"gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0\",\n        },\n    },\n    defaultVariants: {\n        variant: \"default\",\n        size: \"default\",\n    },\n});\nfunction Item({ className, variant = \"default\", size = \"default\", render, ...props }: useRender.ComponentProps<\"div\"> & VariantProps<typeof itemVariants>) {\n    return useRender({\n        defaultTagName: \"div\",\n        props: mergeProps<\"div\">({\n            className: cn(itemVariants({ variant, size, className })),\n        }, props),\n        render,\n        state: {\n            slot: \"item\",\n            variant,\n            size,\n        },\n    });\n}\nconst itemMediaVariants = cva(\"flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none\", {\n    variants: {\n        variant: {\n            default: \"bg-transparent\",\n            icon: \"[&_svg:not([class*='size-'])]:size-4\",\n            image: \"size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover\",\n        },\n    },\n    defaultVariants: {\n        variant: \"default\",\n    },\n});\nfunction ItemMedia({ className, variant = \"default\", ...props }: React.ComponentProps<\"div\"> & VariantProps<typeof itemMediaVariants>) {\n    return (<div data-slot=\"item-media\" data-variant={variant} className={cn(itemMediaVariants({ variant, className }))} {...props}/>);\n}\nfunction ItemContent({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"item-content\" className={cn(\"flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none\", className)} {...props}/>);\n}\nfunction ItemTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"item-title\" className={cn(\"line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4\", className)} {...props}/>);\n}\nfunction ItemDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n    return (<p data-slot=\"item-description\" className={cn(\"line-clamp-2 text-left text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary\", className)} {...props}/>);\n}\nfunction ItemActions({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"item-actions\" className={cn(\"flex items-center gap-2\", className)} {...props}/>);\n}\nfunction ItemHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"item-header\" className={cn(\"flex basis-full items-center justify-between gap-2\", className)} {...props}/>);\n}\nfunction ItemFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"item-footer\" className={cn(\"flex basis-full items-center justify-between gap-2\", className)} {...props}/>);\n}\nexport { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, };\n"
    },
    {
      "path": "components/ui/kbd.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nfunction Kbd({ className, ...props }: React.ComponentProps<\"kbd\">) {\n    return (<kbd data-slot=\"kbd\" className={cn(\"pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background dark:in-data-[slot=tooltip-content]:bg-background/10 [&_svg:not([class*='size-'])]:size-3\", className)} {...props}/>);\n}\nfunction KbdGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<kbd data-slot=\"kbd-group\" className={cn(\"inline-flex items-center gap-1\", className)} {...props}/>);\n}\nexport { Kbd, KbdGroup };\n"
    },
    {
      "path": "components/ui/keyboard-shortcut.tsx",
      "type": "registry:ui",
      "content": "import { Kbd, KbdGroup } from \"@/components/ui/kbd\";\nexport function KeyboardShortcut({\n  keys = [\"⌘\", \"K\"],\n  label = \"Search\",\n}: {\n  keys?: string[];\n  label?: string;\n}) {\n  return (\n    <span className=\"inline-flex items-center gap-3 text-sm\">\n      <span>{label}</span>\n      <KbdGroup aria-label={keys.join(\" plus \")}>\n        {keys.map((key) => (\n          <Kbd key={key}>{key}</Kbd>\n        ))}\n      </KbdGroup>\n    </span>\n  );\n}\n"
    },
    {
      "path": "components/ui/label.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"cn\"\n\nfunction Label({ className, ...props }: React.ComponentProps<\"label\">) {\n  return (\n    <label\n      data-slot=\"label\"\n      className={cn(\n        \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Label }\n"
    },
    {
      "path": "components/ui/marker.tsx",
      "type": "registry:ui",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nconst markerVariants = cva(\"group/marker relative flex min-h-4 w-full items-center gap-2 text-left text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground\", {\n    variants: {\n        variant: {\n            default: \"\",\n            separator: \"before:mr-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ml-1 after:h-px after:min-w-0 after:flex-1 after:bg-border\",\n            border: \"border-b border-border pb-2\",\n        },\n    },\n});\nfunction Marker({ className, variant = \"default\", render, ...props }: useRender.ComponentProps<\"div\"> & VariantProps<typeof markerVariants>) {\n    return useRender({\n        defaultTagName: \"div\",\n        props: mergeProps<\"div\">({\n            className: cn(markerVariants({ variant, className })),\n        }, props),\n        render,\n        state: {\n            slot: \"marker\",\n            variant,\n        },\n    });\n}\nfunction MarkerIcon({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"marker-icon\" aria-hidden=\"true\" className={cn(\"size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}/>);\n}\nfunction MarkerContent({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"marker-content\" className={cn(\"min-w-0 wrap-break-word group-data-[variant=separator]/marker:flex-none group-data-[variant=separator]/marker:text-center *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\", className)} {...props}/>);\n}\nexport { Marker, MarkerContent, MarkerIcon, markerVariants };\n"
    },
    {
      "path": "components/ui/member-item.tsx",
      "type": "registry:ui",
      "content": "import { Avatar, AvatarFallback } from \"@/components/ui/avatar\";\nimport { Badge } from \"@/components/ui/badge\";\nexport function MemberItem({\n  name,\n  memberRole = \"Member\",\n  email,\n}: {\n  name: string;\n  memberRole?: string;\n  email: string;\n}) {\n  return (\n    <div className=\"flex w-full items-center gap-3\">\n      <Avatar>\n        <AvatarFallback>\n          {name\n            .split(\" \")\n            .map((n) => n[0])\n            .slice(0, 2)\n            .join(\"\")}\n        </AvatarFallback>\n      </Avatar>\n      <div className=\"min-w-0 flex-1\">\n        <p className=\"text-sm font-medium\">{name}</p>\n        <p className=\"truncate text-xs text-muted-foreground\">{email}</p>\n      </div>\n      <Badge variant=\"outline\">{memberRole}</Badge>\n    </div>\n  );\n}\n"
    },
    {
      "path": "components/ui/menubar.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\";\nimport { Menubar as MenubarPrimitive } from \"@base-ui/react/menubar\";\nimport { cn } from \"cn\";\nimport { CheckIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, } from \"@/components/ui/dropdown-menu\";\nfunction Menubar({ className, ...props }: MenubarPrimitive.Props) {\n    return (<MenubarPrimitive data-slot=\"menubar\" className={cn(\"flex h-8 items-center gap-0.5 rounded-lg border p-[3px]\", className)} {...props}/>);\n}\nfunction MenubarMenu({ ...props }: React.ComponentProps<typeof DropdownMenu>) {\n    return <DropdownMenu data-slot=\"menubar-menu\" {...props}/>;\n}\nfunction MenubarGroup({ ...props }: React.ComponentProps<typeof DropdownMenuGroup>) {\n    return <DropdownMenuGroup data-slot=\"menubar-group\" {...props}/>;\n}\nfunction MenubarPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPortal>) {\n    return <DropdownMenuPortal data-slot=\"menubar-portal\" {...props}/>;\n}\nfunction MenubarTrigger({ className, ...props }: React.ComponentProps<typeof DropdownMenuTrigger>) {\n    return (<DropdownMenuTrigger data-slot=\"menubar-trigger\" className={cn(\"flex items-center rounded-sm px-1.5 py-[2px] text-sm font-medium outline-hidden select-none hover:bg-muted aria-expanded:bg-muted\", className)} {...props}/>);\n}\nfunction MenubarContent({ className, align = \"start\", alignOffset = -4, sideOffset = 8, ...props }: React.ComponentProps<typeof DropdownMenuContent>) {\n    return (<DropdownMenuContent data-slot=\"menubar-content\" align={align} alignOffset={alignOffset} sideOffset={sideOffset} className={cn(\"min-w-36 rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95\", className)} {...props}/>);\n}\nfunction MenubarItem({ className, inset, variant = \"default\", ...props }: React.ComponentProps<typeof DropdownMenuItem>) {\n    return (<DropdownMenuItem data-slot=\"menubar-item\" data-inset={inset} data-variant={variant} className={cn(\"group/menubar-item gap-1.5 rounded-md px-1.5 py-1 text-sm focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive!\", className)} {...props}/>);\n}\nfunction MenubarCheckboxItem({ className, children, checked, inset, ...props }: MenuPrimitive.CheckboxItem.Props & {\n    inset?: boolean;\n}) {\n    return (<MenuPrimitive.CheckboxItem data-slot=\"menubar-checkbox-item\" data-inset={inset} className={cn(\"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\", className)} checked={checked} {...props}>\n      <span className=\"pointer-events-none absolute left-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4\">\n        <MenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>);\n}\nfunction MenubarRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuRadioGroup>) {\n    return <DropdownMenuRadioGroup data-slot=\"menubar-radio-group\" {...props}/>;\n}\nfunction MenubarRadioItem({ className, children, inset, ...props }: MenuPrimitive.RadioItem.Props & {\n    inset?: boolean;\n}) {\n    return (<MenuPrimitive.RadioItem data-slot=\"menubar-radio-item\" data-inset={inset} className={cn(\"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      <span className=\"pointer-events-none absolute left-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4\">\n        <MenuPrimitive.RadioItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>);\n}\nfunction MenubarLabel({ className, inset, ...props }: React.ComponentProps<typeof DropdownMenuLabel> & {\n    inset?: boolean;\n}) {\n    return (<DropdownMenuLabel data-slot=\"menubar-label\" data-inset={inset} className={cn(\"px-1.5 py-1 text-sm font-medium data-inset:pl-7\", className)} {...props}/>);\n}\nfunction MenubarSeparator({ className, ...props }: React.ComponentProps<typeof DropdownMenuSeparator>) {\n    return (<DropdownMenuSeparator data-slot=\"menubar-separator\" className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props}/>);\n}\nfunction MenubarShortcut({ className, ...props }: React.ComponentProps<typeof DropdownMenuShortcut>) {\n    return (<DropdownMenuShortcut data-slot=\"menubar-shortcut\" className={cn(\"ml-auto text-xs tracking-widest text-muted-foreground group-focus/menubar-item:text-accent-foreground\", className)} {...props}/>);\n}\nfunction MenubarSub({ ...props }: React.ComponentProps<typeof DropdownMenuSub>) {\n    return <DropdownMenuSub data-slot=\"menubar-sub\" {...props}/>;\n}\nfunction MenubarSubTrigger({ className, inset, ...props }: React.ComponentProps<typeof DropdownMenuSubTrigger> & {\n    inset?: boolean;\n}) {\n    return (<DropdownMenuSubTrigger data-slot=\"menubar-sub-trigger\" data-inset={inset} className={cn(\"gap-1.5 rounded-md px-1.5 py-1 text-sm focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground [&_svg:not([class*='size-'])]:size-4\", className)} {...props}/>);\n}\nfunction MenubarSubContent({ className, ...props }: React.ComponentProps<typeof DropdownMenuSubContent>) {\n    return (<DropdownMenuSubContent data-slot=\"menubar-sub-content\" className={cn(\"min-w-32 rounded-lg bg-popover p-1 text-popover-foreground shadow-lg ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>);\n}\nexport { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, };\n"
    },
    {
      "path": "components/ui/message-scroller.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { MessageScroller as MessageScrollerPrimitive, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility, } from \"@shadcn/react/message-scroller\";\nimport { cn } from \"cn\";\nimport { ArrowDownIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nfunction MessageScrollerProvider(props: React.ComponentProps<typeof MessageScrollerPrimitive.Provider>) {\n    return <MessageScrollerPrimitive.Provider {...props}/>;\n}\nfunction MessageScroller({ className, ...props }: React.ComponentProps<typeof MessageScrollerPrimitive.Root>) {\n    return (<MessageScrollerPrimitive.Root data-slot=\"message-scroller\" className={cn(\"group/message-scroller relative flex size-full min-h-0 flex-col overflow-hidden\", className)} {...props}/>);\n}\nfunction MessageScrollerViewport({ className, ...props }: React.ComponentProps<typeof MessageScrollerPrimitive.Viewport>) {\n    return (<MessageScrollerPrimitive.Viewport data-slot=\"message-scroller-viewport\" className={cn(\"size-full min-h-0 min-w-0 scroll-fade-b scrollbar-thin scrollbar-gutter-stable overflow-y-auto overscroll-contain contain-content data-autoscrolling:scrollbar-thumb-transparent data-autoscrolling:scrollbar-track-transparent data-pending-scroll:invisible\", className)} {...props}/>);\n}\nfunction MessageScrollerContent({ className, ...props }: React.ComponentProps<typeof MessageScrollerPrimitive.Content>) {\n    return (<MessageScrollerPrimitive.Content data-slot=\"message-scroller-content\" className={cn(\"flex h-max min-h-full flex-col gap-6\", className)} {...props}/>);\n}\nfunction MessageScrollerItem({ className, scrollAnchor = false, ...props }: React.ComponentProps<typeof MessageScrollerPrimitive.Item>) {\n    return (<MessageScrollerPrimitive.Item data-slot=\"message-scroller-item\" scrollAnchor={scrollAnchor} className={cn(\"min-w-0 shrink-0 [contain-intrinsic-size:auto_10rem] [content-visibility:auto]\", className)} {...props}/>);\n}\nfunction MessageScrollerButton({ direction = \"end\", className, children, render, variant = \"secondary\", size = \"icon-sm\", ...props }: React.ComponentProps<typeof MessageScrollerPrimitive.Button> & Pick<React.ComponentProps<typeof Button>, \"variant\" | \"size\">) {\n    return (<MessageScrollerPrimitive.Button data-slot=\"message-scroller-button\" data-direction={direction} data-variant={variant} data-size={size} direction={direction} className={cn(\"absolute inset-s-1/2 -translate-x-1/2 border-border bg-background text-foreground transition-[translate,scale,opacity] duration-200 hover:bg-muted hover:text-foreground data-[active=false]:pointer-events-none data-[active=false]:scale-95 data-[active=false]:opacity-0 data-[active=false]:duration-400 data-[active=false]:ease-[cubic-bezier(0.7,0,0.84,0)] data-[active=true]:translate-y-0 data-[active=true]:scale-100 data-[active=true]:opacity-100 data-[active=true]:ease-[cubic-bezier(0.23,1,0.32,1)] data-[direction=end]:bottom-4 data-[direction=end]:data-[active=false]:translate-y-full data-[direction=start]:top-4 data-[direction=start]:data-[active=false]:-translate-y-full rtl:translate-x-1/2 data-[direction=start]:[&_svg]:rotate-180\", className)} render={render ?? <Button variant={variant} size={size}/>} {...props}>\n      {children ?? (<>\n          <ArrowDownIcon />\n          <span className=\"sr-only\">\n            {direction === \"end\" ? \"Scroll to end\" : \"Scroll to start\"}\n          </span>\n        </>)}\n    </MessageScrollerPrimitive.Button>);\n}\nexport { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility, };\n"
    },
    {
      "path": "components/ui/message.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nimport type * as React from \"react\";\nfunction MessageGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"message-group\" className={cn(\"flex min-w-0 flex-col gap-2\", className)} {...props}/>);\n}\nfunction Message({ className, align = \"start\", ...props }: React.ComponentProps<\"div\"> & {\n    align?: \"start\" | \"end\";\n}) {\n    return (<div data-slot=\"message\" data-align={align} className={cn(\"group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse\", className)} {...props}/>);\n}\nfunction MessageAvatar({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"message-avatar\" className={cn(\"flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-8\", className)} {...props}/>);\n}\nfunction MessageContent({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"message-content\" className={cn(\"flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end\", className)} {...props}/>);\n}\nfunction MessageHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"message-header\" className={cn(\"flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0\", className)} {...props}/>);\n}\nfunction MessageFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"message-footer\" className={cn(\"flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end\", className)} {...props}/>);\n}\nexport { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader, };\n"
    },
    {
      "path": "components/ui/native-select.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport type * as React from \"react\";\ntype NativeSelectProps = Omit<React.ComponentProps<\"select\">, \"size\"> & {\n    size?: \"sm\" | \"default\";\n};\nfunction NativeSelect({ className, size = \"default\", ...props }: NativeSelectProps) {\n    return (<div className={cn(\"group/native-select relative w-fit has-[select:disabled]:opacity-50\", className)} data-slot=\"native-select-wrapper\" data-size={size}>\n      <select data-slot=\"native-select\" data-size={size} className=\"h-8 w-full min-w-0 appearance-none rounded-lg border border-input bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors outline-none select-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring/30 disabled:pointer-events-none disabled:cursor-not-allowed aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\" {...props}/>\n      <ChevronDownIcon className=\"pointer-events-none absolute top-1/2 right-2.5 size-4 -translate-y-1/2 text-muted-foreground select-none\" aria-hidden=\"true\" data-slot=\"native-select-icon\"/>\n    </div>);\n}\nfunction NativeSelectOption({ className, ...props }: React.ComponentProps<\"option\">) {\n    return (<option data-slot=\"native-select-option\" className={cn(\"bg-[Canvas] text-[CanvasText]\", className)} {...props}/>);\n}\nfunction NativeSelectOptGroup({ className, ...props }: React.ComponentProps<\"optgroup\">) {\n    return (<optgroup data-slot=\"native-select-optgroup\" className={cn(\"bg-[Canvas] text-[CanvasText]\", className)} {...props}/>);\n}\nexport { NativeSelect, NativeSelectOptGroup, NativeSelectOption };\n"
    },
    {
      "path": "components/ui/navigation-menu.tsx",
      "type": "registry:ui",
      "content": "import { NavigationMenu as NavigationMenuPrimitive } from \"@base-ui/react/navigation-menu\";\nimport { cva } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport { ChevronDownIcon } from \"lucide-react\";\nfunction NavigationMenu({ align = \"start\", className, children, ...props }: NavigationMenuPrimitive.Root.Props & Pick<NavigationMenuPrimitive.Positioner.Props, \"align\">) {\n    return (<NavigationMenuPrimitive.Root data-slot=\"navigation-menu\" className={cn(\"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center\", className)} {...props}>\n      {children}\n      <NavigationMenuPositioner align={align}/>\n    </NavigationMenuPrimitive.Root>);\n}\nfunction NavigationMenuList({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenuPrimitive.List>) {\n    return (<NavigationMenuPrimitive.List data-slot=\"navigation-menu-list\" className={cn(\"group flex flex-1 list-none items-center justify-center gap-0\", className)} {...props}/>);\n}\nfunction NavigationMenuItem({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenuPrimitive.Item>) {\n    return (<NavigationMenuPrimitive.Item data-slot=\"navigation-menu-item\" className={cn(\"relative\", className)} {...props}/>);\n}\nconst navigationMenuTriggerStyle = cva(\"group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted\");\nfunction NavigationMenuTrigger({ className, children, ...props }: NavigationMenuPrimitive.Trigger.Props) {\n    return (<NavigationMenuPrimitive.Trigger data-slot=\"navigation-menu-trigger\" className={cn(navigationMenuTriggerStyle(), \"group\", className)} {...props}>\n      {children}{\" \"}\n      <ChevronDownIcon className=\"relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180\" aria-hidden=\"true\"/>\n    </NavigationMenuPrimitive.Trigger>);\n}\nfunction NavigationMenuContent({ className, ...props }: NavigationMenuPrimitive.Content.Props) {\n    return (<NavigationMenuPrimitive.Content data-slot=\"navigation-menu-content\" className={cn(\"data-ending-style:data-activation-direction=left:translate-x-[50%] data-ending-style:data-activation-direction=right:translate-x-[-50%] data-starting-style:data-activation-direction=left:translate-x-[-50%] data-starting-style:data-activation-direction=right:translate-x-[50%] h-full w-auto p-1 transition-[opacity,transform,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:ring-foreground/10 group-data-[viewport=false]/navigation-menu:duration-300 data-ending-style:opacity-0 data-starting-style:opacity-0 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95\", className)} {...props}/>);\n}\nfunction NavigationMenuPositioner({ className, side = \"bottom\", sideOffset = 8, align = \"start\", alignOffset = 0, ...props }: NavigationMenuPrimitive.Positioner.Props) {\n    return (<NavigationMenuPrimitive.Portal>\n      <NavigationMenuPrimitive.Positioner side={side} sideOffset={sideOffset} align={align} alignOffset={alignOffset} className={cn(\"isolate z-50 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0\", className)} {...props}>\n        <NavigationMenuPrimitive.Popup className=\"data-[ending-style]:easing-[ease] xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin) rounded-lg bg-popover text-popover-foreground shadow ring-1 ring-foreground/10 transition-[opacity,transform,width,height,scale,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] outline-none data-ending-style:scale-90 data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:scale-90 data-starting-style:opacity-0\">\n          <NavigationMenuPrimitive.Viewport className=\"relative size-full overflow-hidden\"/>\n        </NavigationMenuPrimitive.Popup>\n      </NavigationMenuPrimitive.Positioner>\n    </NavigationMenuPrimitive.Portal>);\n}\nfunction NavigationMenuLink({ className, ...props }: NavigationMenuPrimitive.Link.Props) {\n    return (<NavigationMenuPrimitive.Link data-slot=\"navigation-menu-link\" className={cn(\"flex items-center gap-2 rounded-lg p-2 text-sm transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4\", className)} {...props}/>);\n}\nfunction NavigationMenuIndicator({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenuPrimitive.Icon>) {\n    return (<NavigationMenuPrimitive.Icon data-slot=\"navigation-menu-indicator\" className={cn(\"top-full z-1 flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in\", className)} {...props}>\n      <div className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md\"/>\n    </NavigationMenuPrimitive.Icon>);\n}\nexport { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuPositioner, NavigationMenuTrigger, navigationMenuTriggerStyle, };\n"
    },
    {
      "path": "components/ui/notification-preferences.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { useState } from \"react\";\nimport { ActionButton } from \"@/components/ui/action-button\";\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardFooter,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\";\nimport {\n  Field,\n  FieldContent,\n  FieldDescription,\n  FieldGroup,\n  FieldLabel,\n} from \"@/components/ui/field\";\nimport { Switch } from \"@/components/ui/switch\";\nexport function NotificationPreferences({\n  onSave,\n}: {\n  onSave: (value: { updates: boolean; activity: boolean }) => Promise<void>;\n}) {\n  const [updates, setUpdates] = useState(true);\n  const [activity, setActivity] = useState(false);\n  const [pending, setPending] = useState(false);\n  const [message, setMessage] = useState(\"\");\n  return (\n    <Card className=\"w-full\">\n      <CardHeader>\n        <CardTitle>Stay in the loop</CardTitle>\n        <CardDescription>Choose what reaches your inbox.</CardDescription>\n      </CardHeader>\n      <CardContent>\n        <FieldGroup>\n          <Field orientation=\"horizontal\">\n            <FieldContent>\n              <FieldLabel htmlFor=\"notification-updates\">\n                Product updates\n              </FieldLabel>\n              <FieldDescription>New features and releases.</FieldDescription>\n            </FieldContent>\n            <Switch\n              id=\"notification-updates\"\n              checked={updates}\n              onCheckedChange={setUpdates}\n            />\n          </Field>\n          <Field orientation=\"horizontal\">\n            <FieldContent>\n              <FieldLabel htmlFor=\"notification-activity\">\n                Team activity\n              </FieldLabel>\n              <FieldDescription>Progress from your workspace.</FieldDescription>\n            </FieldContent>\n            <Switch\n              id=\"notification-activity\"\n              checked={activity}\n              onCheckedChange={setActivity}\n            />\n          </Field>\n        </FieldGroup>\n      </CardContent>\n      <CardFooter className=\"flex flex-wrap gap-3\">\n        <ActionButton\n          pending={pending}\n          pendingLabel=\"Saving…\"\n          onClick={async () => {\n            setPending(true);\n            setMessage(\"\");\n            try {\n              await onSave({ updates, activity });\n              setMessage(\"Preferences saved\");\n            } catch {\n              setMessage(\"Could not save. Try again.\");\n            } finally {\n              setPending(false);\n            }\n          }}\n        >\n          Save preferences\n        </ActionButton>\n        <span role=\"status\" className=\"text-xs text-muted-foreground\">\n          {message}\n        </span>\n      </CardFooter>\n    </Card>\n  );\n}\n"
    },
    {
      "path": "components/ui/pagination.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nimport { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon, } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n    return (<nav role=\"navigation\" aria-label=\"pagination\" data-slot=\"pagination\" className={cn(\"mx-auto flex w-full justify-center\", className)} {...props}/>);\n}\nfunction PaginationContent({ className, ...props }: React.ComponentProps<\"ul\">) {\n    return (<ul data-slot=\"pagination-content\" className={cn(\"flex items-center gap-0.5\", className)} {...props}/>);\n}\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n    return <li data-slot=\"pagination-item\" {...props}/>;\n}\ntype PaginationLinkProps = {\n    isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> & React.ComponentProps<\"a\">;\nfunction PaginationLink({ className, isActive, size = \"icon\", ...props }: PaginationLinkProps) {\n    return (<Button variant={isActive ? \"outline\" : \"ghost\"} size={size} className={cn(className)} nativeButton={false} render={<a aria-current={isActive ? \"page\" : undefined} data-slot=\"pagination-link\" data-active={isActive} {...props}/>}/>);\n}\nfunction PaginationPrevious({ className, text = \"Previous\", ...props }: React.ComponentProps<typeof PaginationLink> & {\n    text?: string;\n}) {\n    return (<PaginationLink aria-label=\"Go to previous page\" size=\"default\" className={cn(\"pl-1.5!\", className)} {...props}>\n      <ChevronLeftIcon data-icon=\"inline-start\"/>\n      <span className=\"hidden sm:block\">{text}</span>\n    </PaginationLink>);\n}\nfunction PaginationNext({ className, text = \"Next\", ...props }: React.ComponentProps<typeof PaginationLink> & {\n    text?: string;\n}) {\n    return (<PaginationLink aria-label=\"Go to next page\" size=\"default\" className={cn(\"pr-1.5!\", className)} {...props}>\n      <span className=\"hidden sm:block\">{text}</span>\n      <ChevronRightIcon data-icon=\"inline-end\"/>\n    </PaginationLink>);\n}\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span aria-hidden data-slot=\"pagination-ellipsis\" className={cn(\"flex size-8 items-center justify-center [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      <MoreHorizontalIcon />\n      <span className=\"sr-only\">More pages</span>\n    </span>);\n}\nexport { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };\n"
    },
    {
      "path": "components/ui/popover.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Popover as PopoverPrimitive } from \"@base-ui/react/popover\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nfunction Popover({ ...props }: PopoverPrimitive.Root.Props) {\n    return <PopoverPrimitive.Root data-slot=\"popover\" {...props}/>;\n}\nfunction PopoverTrigger({ ...props }: PopoverPrimitive.Trigger.Props) {\n    return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props}/>;\n}\nfunction PopoverContent({ className, align = \"center\", alignOffset = 0, side = \"bottom\", sideOffset = 4, ...props }: PopoverPrimitive.Popup.Props & Pick<PopoverPrimitive.Positioner.Props, \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\">) {\n    return (<PopoverPrimitive.Portal>\n      <PopoverPrimitive.Positioner align={align} alignOffset={alignOffset} side={side} sideOffset={sideOffset} className=\"isolate z-50\">\n        <PopoverPrimitive.Popup data-slot=\"popover-content\" className={cn(\"z-50 flex w-72 origin-(--transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}/>\n      </PopoverPrimitive.Positioner>\n    </PopoverPrimitive.Portal>);\n}\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"popover-header\" className={cn(\"flex flex-col gap-0.5 text-sm\", className)} {...props}/>);\n}\nfunction PopoverTitle({ className, ...props }: PopoverPrimitive.Title.Props) {\n    return (<PopoverPrimitive.Title data-slot=\"popover-title\" className={cn(\"font-medium\", className)} {...props}/>);\n}\nfunction PopoverDescription({ className, ...props }: PopoverPrimitive.Description.Props) {\n    return (<PopoverPrimitive.Description data-slot=\"popover-description\" className={cn(\"text-muted-foreground\", className)} {...props}/>);\n}\nexport { Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, };\n"
    },
    {
      "path": "components/ui/progress.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Progress as ProgressPrimitive } from \"@base-ui/react/progress\";\nimport { cn } from \"cn\";\nfunction Progress({ className, children, value, ...props }: ProgressPrimitive.Root.Props) {\n    return (<ProgressPrimitive.Root value={value} data-slot=\"progress\" className={cn(\"flex flex-wrap gap-3\", className)} {...props}>\n      {children}\n      <ProgressTrack>\n        <ProgressIndicator />\n      </ProgressTrack>\n    </ProgressPrimitive.Root>);\n}\nfunction ProgressTrack({ className, ...props }: ProgressPrimitive.Track.Props) {\n    return (<ProgressPrimitive.Track className={cn(\"relative flex h-1 w-full items-center overflow-x-hidden rounded-full bg-muted\", className)} data-slot=\"progress-track\" {...props}/>);\n}\nfunction ProgressIndicator({ className, ...props }: ProgressPrimitive.Indicator.Props) {\n    return (<ProgressPrimitive.Indicator data-slot=\"progress-indicator\" className={cn(\"h-full bg-primary transition-all\", className)} {...props}/>);\n}\nfunction ProgressLabel({ className, ...props }: ProgressPrimitive.Label.Props) {\n    return (<ProgressPrimitive.Label className={cn(\"text-sm font-medium\", className)} data-slot=\"progress-label\" {...props}/>);\n}\nfunction ProgressValue({ className, ...props }: ProgressPrimitive.Value.Props) {\n    return (<ProgressPrimitive.Value className={cn(\"ml-auto text-sm text-muted-foreground tabular-nums\", className)} data-slot=\"progress-value\" {...props}/>);\n}\nexport { Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, };\n"
    },
    {
      "path": "components/ui/project-card.tsx",
      "type": "registry:ui",
      "content": "import { Button } from \"@/components/ui/button\";\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardFooter,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\";\nimport { Progress } from \"@/components/ui/progress\";\nimport { StatusIndicator } from \"@/components/ui/status-indicator\";\nexport function ProjectCard({\n  name,\n  description,\n  progress = 40,\n  onOpen,\n}: {\n  name: string;\n  description: string;\n  progress?: number;\n  onOpen: () => void;\n}) {\n  return (\n    <Card className=\"w-full\">\n      <CardHeader>\n        <StatusIndicator status=\"busy\" />\n        <CardTitle>{name}</CardTitle>\n        <CardDescription>{description}</CardDescription>\n      </CardHeader>\n      <CardContent className=\"grid gap-3\">\n        <span className=\"text-xs text-muted-foreground\">\n          {progress}% complete\n        </span>\n        <Progress aria-label=\"Project completion\" value={progress} />\n      </CardContent>\n      <CardFooter>\n        <Button variant=\"outline\" onClick={onOpen}>\n          Open project\n        </Button>\n      </CardFooter>\n    </Card>\n  );\n}\n"
    },
    {
      "path": "components/ui/questionnaire.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Questionnaire as QuestionnairePrimitive } from \"@shadcn/react/questionnaire\";\nimport { cn } from \"cn\";\nimport { CheckIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { type Button, buttonVariants } from \"@/components/ui/button\";\nfunction Questionnaire({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Root>) {\n    return (<QuestionnairePrimitive.Root data-slot=\"questionnaire\" className={cn(\"flex w-full min-w-0 flex-col gap-4\", className)} {...props}/>);\n}\nfunction QuestionnaireProgress({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Progress>) {\n    return (<QuestionnairePrimitive.Progress data-slot=\"questionnaire-progress\" className={cn(\"min-h-[1lh] w-fit min-w-[14ch] text-xs font-medium text-muted-foreground tabular-nums\", className)} {...props}/>);\n}\nfunction QuestionnaireItem({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Item>) {\n    return (<QuestionnairePrimitive.Item data-slot=\"questionnaire-item\" className={cn(\"flex min-w-0 flex-col gap-4 border-0 p-0 outline-none\", className)} {...props}/>);\n}\nfunction QuestionnaireTitle({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Title>) {\n    return (<QuestionnairePrimitive.Title data-slot=\"questionnaire-title\" className={cn(\"font-heading text-base leading-snug font-medium text-pretty [&:not(:has(~[data-slot=questionnaire-description]))]:mb-4\", className)} {...props}/>);\n}\nfunction QuestionnaireDescription({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Description>) {\n    return (<QuestionnairePrimitive.Description data-slot=\"questionnaire-description\" className={cn(\"text-sm text-pretty text-muted-foreground\", className)} {...props}/>);\n}\nfunction QuestionnaireChoices({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Choices>) {\n    return (<QuestionnairePrimitive.Choices data-slot=\"questionnaire-choices\" className={cn(\"group/questionnaire-choices grid min-w-0 gap-2\", className)} {...props}/>);\n}\nfunction QuestionnaireChoice({ children, className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Choice>) {\n    return (<QuestionnairePrimitive.Choice data-slot=\"questionnaire-choice\" className={cn(\"group/questionnaire-choice relative flex min-h-11 cursor-pointer items-start gap-2.5 rounded-lg border border-input bg-transparent px-3 py-2.5 text-start text-sm transition-colors outline-none select-none hover:bg-muted/50 has-[>input:focus-visible]:border-ring has-[>input:focus-visible]:ring-3 has-[>input:focus-visible]:ring-ring/50 data-invalid:border-destructive dark:bg-input/20 data-checked:border-primary/40 data-checked:bg-muted dark:data-checked:bg-muted\", \"data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-disabled:opacity-50\", className)} {...props}>\n      <QuestionnairePrimitive.ChoiceInput data-slot=\"questionnaire-choice-input\" className=\"absolute inset-0 z-10 size-full cursor-pointer opacity-0\"/>\n      <span aria-hidden=\"true\" data-slot=\"questionnaire-choice-indicator\" className=\"pointer-events-none relative flex size-4 shrink-0 translate-y-[--spacing(0.45)] items-center justify-center rounded-[4px] border border-input group-has-data-[slot=questionnaire-choice-description]/questionnaire-choice:translate-y-0.5 group-data-[type=radio]/questionnaire-choice:rounded-full group-data-checked/questionnaire-choice:border-primary group-data-checked/questionnaire-choice:bg-primary group-data-checked/questionnaire-choice:text-primary-foreground dark:bg-input/30 dark:group-data-checked/questionnaire-choice:bg-primary\">\n        <span data-slot=\"questionnaire-choice-indicator-dot\" className=\"hidden size-2 rounded-full bg-primary-foreground group-data-[type=checkbox]/questionnaire-choice:hidden group-data-checked/questionnaire-choice:block\"/>\n        <CheckIcon data-slot=\"questionnaire-choice-indicator-check\" className=\"hidden size-3.5 group-data-[type=radio]/questionnaire-choice:hidden group-data-checked/questionnaire-choice:block\"/>\n      </span>\n      <QuestionnairePrimitive.ChoiceLabel data-slot=\"questionnaire-choice-label\" className=\"flex min-w-0 flex-1 flex-col gap-0.5 leading-snug\">\n        {children}\n      </QuestionnairePrimitive.ChoiceLabel>\n      <QuestionnairePrimitive.ChoiceShortcut data-slot=\"questionnaire-choice-shortcut\" className=\"pointer-events-none ms-auto hidden size-5 shrink-0 translate-y-[--spacing(0.45)] items-center justify-center rounded-md border border-input bg-background font-mono text-[0.625rem] leading-none font-medium text-muted-foreground group-has-data-[slot=questionnaire-choice-description]/questionnaire-choice:translate-y-0.5 group-data-[shortcut]/questionnaire-choice:inline-flex\"/>\n    </QuestionnairePrimitive.Choice>);\n}\nfunction QuestionnaireChoiceDescription({ className, ...props }: React.ComponentProps<\"span\">) {\n    return (<span data-slot=\"questionnaire-choice-description\" className={cn(\"text-muted-foreground\", className)} {...props}/>);\n}\nfunction QuestionnaireInput({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Input>) {\n    return (<div data-slot=\"questionnaire-input-wrapper\" className=\"group/questionnaire-input relative w-full min-w-0\">\n      <QuestionnairePrimitive.Input data-slot=\"questionnaire-input\" className={cn(\"h-8 min-h-11 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-[color,box-shadow,background-color] outline-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 sm:min-h-0 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\", \"selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground\", className)} {...props}/>\n    </div>);\n}\nfunction QuestionnaireError({ className, ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Error>) {\n    return (<QuestionnairePrimitive.Error data-slot=\"questionnaire-error\" className={cn(\"mt-2 text-sm text-destructive\", className)} {...props}/>);\n}\nfunction QuestionnaireActions({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"questionnaire-actions\" className={cn(\"grid min-h-11 w-full grid-cols-[minmax(0,1fr)_auto_auto] items-center gap-2 sm:min-h-8\", className)} {...props}/>);\n}\nfunction QuestionnairePrevious({ children, className, size = \"default\", variant = \"outline\", ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Previous> & Pick<React.ComponentProps<typeof Button>, \"size\" | \"variant\">) {\n    return (<QuestionnairePrimitive.Previous data-slot=\"questionnaire-previous\" data-size={size} data-variant={variant} className={cn(buttonVariants({ size, variant }), \"col-start-1 row-start-1 min-h-11 justify-self-start sm:min-h-0\", className)} {...props}>\n      {children ?? \"Previous\"}\n    </QuestionnairePrimitive.Previous>);\n}\nfunction QuestionnaireSkip({ children, className, size = \"default\", variant = \"outline\", ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Skip> & Pick<React.ComponentProps<typeof Button>, \"size\" | \"variant\">) {\n    return (<QuestionnairePrimitive.Skip data-slot=\"questionnaire-skip\" data-size={size} data-variant={variant} className={cn(buttonVariants({ size, variant }), \"col-start-2 row-start-1 min-h-11 justify-self-end sm:min-h-0\", className)} {...props}>\n      {children ?? \"Skip\"}\n    </QuestionnairePrimitive.Skip>);\n}\nfunction QuestionnaireNext({ children, className, size = \"default\", variant = \"default\", ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Next> & Pick<React.ComponentProps<typeof Button>, \"size\" | \"variant\">) {\n    return (<QuestionnairePrimitive.Next data-slot=\"questionnaire-next\" data-size={size} data-variant={variant} className={cn(buttonVariants({ size, variant }), \"col-start-3 row-start-1 min-h-11 justify-self-end sm:min-h-0\", className)} {...props}>\n      {children ?? \"Next\"}\n    </QuestionnairePrimitive.Next>);\n}\nfunction QuestionnaireSubmit({ children, className, size = \"default\", variant = \"default\", ...props }: React.ComponentProps<typeof QuestionnairePrimitive.Submit> & Pick<React.ComponentProps<typeof Button>, \"size\" | \"variant\">) {\n    return (<QuestionnairePrimitive.Submit data-slot=\"questionnaire-submit\" data-size={size} data-variant={variant} className={cn(buttonVariants({ size, variant }), \"col-start-3 row-start-1 min-h-11 justify-self-end sm:min-h-0\", className)} {...props}>\n      {children ?? \"Submit\"}\n    </QuestionnairePrimitive.Submit>);\n}\nexport { Questionnaire, QuestionnaireActions, QuestionnaireChoice, QuestionnaireChoiceDescription, QuestionnaireChoices, QuestionnaireDescription, QuestionnaireError, QuestionnaireInput, QuestionnaireItem, QuestionnaireNext, QuestionnairePrevious, QuestionnaireProgress, QuestionnaireSkip, QuestionnaireSubmit, QuestionnaireTitle, };\n"
    },
    {
      "path": "components/ui/radio-group.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Radio as RadioPrimitive } from \"@base-ui/react/radio\";\nimport { RadioGroup as RadioGroupPrimitive } from \"@base-ui/react/radio-group\";\nimport { cn } from \"cn\";\nfunction RadioGroup({ className, ...props }: RadioGroupPrimitive.Props) {\n    return (<RadioGroupPrimitive data-slot=\"radio-group\" className={cn(\"grid w-full gap-2\", className)} {...props}/>);\n}\nfunction RadioGroupItem({ className, ...props }: RadioPrimitive.Root.Props) {\n    return (<RadioPrimitive.Root data-slot=\"radio-group-item\" className={cn(\"group/radio-group-item peer relative flex aspect-square size-4 shrink-0 rounded-full border border-input outline-none group-has-[:focus-visible]/field-label:ring-0 group-has-[:focus-visible]/field-label:not-data-checked:border-input after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground group-has-[:focus-visible]/field-label:data-checked:border-primary dark:data-checked:bg-primary\", className)} {...props}>\n      <RadioPrimitive.Indicator data-slot=\"radio-group-indicator\" className=\"flex size-4 items-center justify-center\">\n        <span className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary-foreground\"/>\n      </RadioPrimitive.Indicator>\n    </RadioPrimitive.Root>);\n}\nexport { RadioGroup, RadioGroupItem };\n"
    },
    {
      "path": "components/ui/resizable.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cn } from \"cn\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\nfunction ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps) {\n    return (<ResizablePrimitive.Group data-slot=\"resizable-panel-group\" className={cn(\"flex h-full w-full aria-[orientation=vertical]:flex-col\", className)} {...props}/>);\n}\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n    return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props}/>;\n}\nfunction ResizableHandle({ withHandle, className, ...props }: ResizablePrimitive.SeparatorProps & {\n    withHandle?: boolean;\n}) {\n    return (<ResizablePrimitive.Separator data-slot=\"resizable-handle\" className={cn(\"relative flex w-px items-center justify-center bg-border ring-offset-background after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90\", className)} {...props}>\n      {withHandle && (<div className=\"z-10 flex h-6 w-1 shrink-0 rounded-lg bg-border\"/>)}\n    </ResizablePrimitive.Separator>);\n}\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"
    },
    {
      "path": "components/ui/scroll-area.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { ScrollArea as ScrollAreaPrimitive } from \"@base-ui/react/scroll-area\";\nimport { cn } from \"cn\";\nimport * as React from \"react\";\nfunction ScrollArea({ className, children, ...props }: ScrollAreaPrimitive.Root.Props) {\n    return (<ScrollAreaPrimitive.Root data-slot=\"scroll-area\" className={cn(\"relative\", className)} {...props}>\n      <ScrollAreaPrimitive.Viewport data-slot=\"scroll-area-viewport\" className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1\">\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>);\n}\nfunction ScrollBar({ className, orientation = \"vertical\", ...props }: ScrollAreaPrimitive.Scrollbar.Props) {\n    return (<ScrollAreaPrimitive.Scrollbar data-slot=\"scroll-area-scrollbar\" data-orientation={orientation} orientation={orientation} className={cn(\"flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent\", className)} {...props}>\n      <ScrollAreaPrimitive.Thumb data-slot=\"scroll-area-thumb\" className=\"relative flex-1 rounded-full bg-border\"/>\n    </ScrollAreaPrimitive.Scrollbar>);\n}\nexport { ScrollArea, ScrollBar };\n"
    },
    {
      "path": "components/ui/search-field.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Search, X } from \"lucide-react\";\nimport {\n  InputGroup,\n  InputGroupAddon,\n  InputGroupButton,\n  InputGroupInput,\n} from \"@/components/ui/input-group\";\nexport function SearchField({\n  value,\n  onValueChange,\n  placeholder = \"Search projects…\",\n}: {\n  value: string;\n  onValueChange: (value: string) => void;\n  placeholder?: string;\n}) {\n  return (\n    <InputGroup>\n      <InputGroupAddon>\n        <Search />\n      </InputGroupAddon>\n      <InputGroupInput\n        aria-label=\"Search\"\n        value={value}\n        onChange={(e) => onValueChange(e.target.value)}\n        placeholder={placeholder}\n      />\n      {value && (\n        <InputGroupAddon align=\"inline-end\">\n          <InputGroupButton\n            aria-label=\"Clear search\"\n            onClick={() => onValueChange(\"\")}\n          >\n            <X />\n          </InputGroupButton>\n        </InputGroupAddon>\n      )}\n    </InputGroup>\n  );\n}\n"
    },
    {
      "path": "components/ui/section-heading.tsx",
      "type": "registry:ui",
      "content": "import type { ReactNode } from \"react\";\n\nexport function SectionHeading({\n  title,\n  description,\n  action,\n}: {\n  title: string;\n  description?: string;\n  action?: ReactNode;\n}) {\n  return (\n    <div className=\"flex flex-wrap items-start justify-between gap-4\">\n      <div className=\"flex flex-col gap-1\">\n        <h2 className=\"text-lg font-semibold tracking-tight\">{title}</h2>\n        {description && (\n          <p className=\"text-sm text-muted-foreground\">{description}</p>\n        )}\n      </div>\n      {action}\n    </div>\n  );\n}\n"
    },
    {
      "path": "components/ui/select.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Select as SelectPrimitive } from \"@base-ui/react/select\";\nimport { cn } from \"cn\";\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nconst Select = SelectPrimitive.Root;\nfunction SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {\n    return (<SelectPrimitive.Group data-slot=\"select-group\" className={cn(\"scroll-my-1 p-1\", className)} {...props}/>);\n}\nfunction SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {\n    return (<SelectPrimitive.Value data-slot=\"select-value\" className={cn(\"flex flex-1 text-left\", className)} {...props}/>);\n}\nfunction SelectTrigger({ className, size = \"default\", children, ...props }: SelectPrimitive.Trigger.Props & {\n    size?: \"sm\" | \"default\";\n}) {\n    return (<SelectPrimitive.Trigger data-slot=\"select-trigger\" data-size={size} className={cn(\"flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring/30 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      {children}\n      <SelectPrimitive.Icon render={<ChevronDownIcon className=\"pointer-events-none size-4 text-muted-foreground\"/>}/>\n    </SelectPrimitive.Trigger>);\n}\nfunction SelectContent({ className, children, side = \"bottom\", sideOffset = 4, align = \"center\", alignOffset = 0, alignItemWithTrigger = true, ...props }: SelectPrimitive.Popup.Props & Pick<SelectPrimitive.Positioner.Props, \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\" | \"alignItemWithTrigger\">) {\n    return (<SelectPrimitive.Portal>\n      <SelectPrimitive.Positioner side={side} sideOffset={sideOffset} align={align} alignOffset={alignOffset} alignItemWithTrigger={alignItemWithTrigger} className=\"isolate z-50\">\n        <SelectPrimitive.Popup data-slot=\"select-content\" data-align-trigger={alignItemWithTrigger} className={cn(\"relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}>\n          <SelectScrollUpButton />\n          <SelectPrimitive.List>{children}</SelectPrimitive.List>\n          <SelectScrollDownButton />\n        </SelectPrimitive.Popup>\n      </SelectPrimitive.Positioner>\n    </SelectPrimitive.Portal>);\n}\nfunction SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props) {\n    return (<SelectPrimitive.GroupLabel data-slot=\"select-label\" className={cn(\"px-1.5 py-1 text-xs text-muted-foreground\", className)} {...props}/>);\n}\nfunction SelectItem({ className, children, ...props }: SelectPrimitive.Item.Props) {\n    return (<SelectPrimitive.Item data-slot=\"select-item\" className={cn(\"relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2\", className)} {...props}>\n      <SelectPrimitive.ItemText className=\"flex flex-1 shrink-0 gap-2 whitespace-nowrap\">\n        {children}\n      </SelectPrimitive.ItemText>\n      <SelectPrimitive.ItemIndicator render={<span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\"/>}>\n        <CheckIcon className=\"pointer-events-none\"/>\n      </SelectPrimitive.ItemIndicator>\n    </SelectPrimitive.Item>);\n}\nfunction SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props) {\n    return (<SelectPrimitive.Separator data-slot=\"select-separator\" className={cn(\"pointer-events-none -mx-1 my-1 h-px bg-border\", className)} {...props}/>);\n}\nfunction SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {\n    return (<SelectPrimitive.ScrollUpArrow data-slot=\"select-scroll-up-button\" className={cn(\"top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      <ChevronUpIcon />\n    </SelectPrimitive.ScrollUpArrow>);\n}\nfunction SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {\n    return (<SelectPrimitive.ScrollDownArrow data-slot=\"select-scroll-down-button\" className={cn(\"bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4\", className)} {...props}>\n      <ChevronDownIcon />\n    </SelectPrimitive.ScrollDownArrow>);\n}\nexport { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, };\n"
    },
    {
      "path": "components/ui/separator.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport { Separator as SeparatorPrimitive } from \"@base-ui/react/separator\"\nimport { cn } from \"cn\"\n\nfunction Separator({\n  className,\n  orientation = \"horizontal\",\n  ...props\n}: SeparatorPrimitive.Props) {\n  return (\n    <SeparatorPrimitive\n      data-slot=\"separator\"\n      orientation={orientation}\n      className={cn(\n        \"shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Separator }\n"
    },
    {
      "path": "components/ui/settings-card.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { useId, useRef, useState } from \"react\";\nimport { ActionButton } from \"@/components/ui/action-button\";\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardFooter,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\";\nimport { FieldGroup } from \"@/components/ui/field\";\nimport { TextField } from \"@/components/ui/text-field\";\n\nexport function SettingsCard({\n  name = \"\",\n  onSave,\n}: {\n  name?: string;\n  onSave: (name: string) => Promise<void>;\n}) {\n  const [value, setValue] = useState(name);\n  const [pending, setPending] = useState(false);\n  const [error, setError] = useState(\"\");\n  const [message, setMessage] = useState(\"\");\n  const saving = useRef(false);\n  const inputId = useId();\n  return (\n    <form\n      onSubmit={async (event) => {\n        event.preventDefault();\n        if (saving.current) return;\n        setMessage(\"\");\n        if (!value.trim()) {\n          setError(\"Enter a project name.\");\n          return;\n        }\n        setError(\"\");\n        saving.current = true;\n        setPending(true);\n        try {\n          await onSave(value.trim());\n          setMessage(\"Changes saved.\");\n        } catch {\n          setMessage(\"Could not save. Please try again.\");\n        } finally {\n          saving.current = false;\n          setPending(false);\n        }\n      }}\n    >\n      <Card>\n        <CardHeader>\n          <CardTitle>Project settings</CardTitle>\n          <CardDescription>A home for what you are building.</CardDescription>\n        </CardHeader>\n        <CardContent>\n          <FieldGroup>\n            <TextField\n              id={inputId}\n              label=\"Project name\"\n              value={value}\n              onChange={(event) => {\n                setValue(event.target.value);\n                setError(\"\");\n                setMessage(\"\");\n              }}\n              error={error}\n              disabled={pending}\n              description=\"Use a name your team will recognize.\"\n            />\n          </FieldGroup>\n        </CardContent>\n        <CardFooter className=\"flex flex-wrap items-center justify-between gap-3\">\n          <span role=\"status\" className=\"text-xs text-muted-foreground\">\n            {message || \"You can change this anytime.\"}\n          </span>\n          <ActionButton type=\"submit\" pending={pending} pendingLabel=\"Saving…\">\n            Save changes\n          </ActionButton>\n        </CardFooter>\n      </Card>\n    </form>\n  );\n}\n"
    },
    {
      "path": "components/ui/sheet.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Dialog as SheetPrimitive } from \"@base-ui/react/dialog\";\nimport { cn } from \"cn\";\nimport { XIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nfunction Sheet({ ...props }: SheetPrimitive.Root.Props) {\n    return <SheetPrimitive.Root data-slot=\"sheet\" {...props}/>;\n}\nfunction SheetTrigger({ ...props }: SheetPrimitive.Trigger.Props) {\n    return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props}/>;\n}\nfunction SheetClose({ ...props }: SheetPrimitive.Close.Props) {\n    return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props}/>;\n}\nfunction SheetPortal({ ...props }: SheetPrimitive.Portal.Props) {\n    return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props}/>;\n}\nfunction SheetOverlay({ className, ...props }: SheetPrimitive.Backdrop.Props) {\n    return (<SheetPrimitive.Backdrop data-slot=\"sheet-overlay\" className={cn(\"fixed inset-0 z-50 bg-black/10 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs\", className)} {...props}/>);\n}\nfunction SheetContent({ className, children, side = \"right\", showCloseButton = true, showOverlay = true, ...props }: SheetPrimitive.Popup.Props & {\n    side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n    showCloseButton?: boolean;\n    showOverlay?: boolean;\n}) {\n    return (<SheetPortal>\n      {showOverlay && <SheetOverlay />}\n      <SheetPrimitive.Popup data-slot=\"sheet-content\" data-side={side} className={cn(\"fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm\", className)} {...props}>\n        {children}\n        {showCloseButton && (<SheetPrimitive.Close data-slot=\"sheet-close\" render={<Button variant=\"ghost\" className=\"absolute top-3 right-3\" size=\"icon-sm\"/>}>\n            <XIcon />\n            <span className=\"sr-only\">Close</span>\n          </SheetPrimitive.Close>)}\n      </SheetPrimitive.Popup>\n    </SheetPortal>);\n}\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sheet-header\" className={cn(\"flex flex-col gap-0.5 p-4\", className)} {...props}/>);\n}\nfunction SheetFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sheet-footer\" className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)} {...props}/>);\n}\nfunction SheetTitle({ className, ...props }: SheetPrimitive.Title.Props) {\n    return (<SheetPrimitive.Title data-slot=\"sheet-title\" className={cn(\"font-heading text-base font-medium text-foreground\", className)} {...props}/>);\n}\nfunction SheetDescription({ className, ...props }: SheetPrimitive.Description.Props) {\n    return (<SheetPrimitive.Description data-slot=\"sheet-description\" className={cn(\"text-sm text-muted-foreground\", className)} {...props}/>);\n}\nexport { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, };\n"
    },
    {
      "path": "components/ui/sidebar.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"cn\";\nimport { PanelLeftIcon } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, } from \"@/components/ui/sheet\";\nimport { Skeleton } from \"@/components/ui/skeleton\";\nimport { Tooltip, TooltipContent, TooltipTrigger, } from \"@/components/ui/tooltip\";\nimport { useIsMobile } from \"@/hooks/use-mobile\";\nconst SIDEBAR_COOKIE_NAME = \"sidebar_state\";\nconst SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;\nconst SIDEBAR_WIDTH = \"16rem\";\nconst SIDEBAR_WIDTH_MOBILE = \"18rem\";\nconst SIDEBAR_WIDTH_ICON = \"3rem\";\nconst SIDEBAR_KEYBOARD_SHORTCUT = \"b\";\ntype SidebarContextProps = {\n    state: \"expanded\" | \"collapsed\";\n    open: boolean;\n    setOpen: (open: boolean) => void;\n    openMobile: boolean;\n    setOpenMobile: (open: boolean) => void;\n    isMobile: boolean;\n    toggleSidebar: () => void;\n};\nconst SidebarContext = React.createContext<SidebarContextProps | null>(null);\nfunction useSidebar() {\n    const context = React.useContext(SidebarContext);\n    if (!context) {\n        throw new Error(\"useSidebar must be used within a SidebarProvider.\");\n    }\n    return context;\n}\nfunction SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }: React.ComponentProps<\"div\"> & {\n    defaultOpen?: boolean;\n    open?: boolean;\n    onOpenChange?: (open: boolean) => void;\n}) {\n    const isMobile = useIsMobile();\n    const [openMobile, setOpenMobile] = React.useState(false);\n    const [_open, _setOpen] = React.useState(defaultOpen);\n    const open = openProp ?? _open;\n    const setOpen = React.useCallback((value: boolean | ((value: boolean) => boolean)) => {\n        const openState = typeof value === \"function\" ? value(open) : value;\n        if (setOpenProp) {\n            setOpenProp(openState);\n        }\n        else {\n            _setOpen(openState);\n        }\n        document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;\n    }, [setOpenProp, open]);\n    const toggleSidebar = React.useCallback(() => {\n        return isMobile ? setOpenMobile((open) => !open) : setOpen((open) => !open);\n    }, [isMobile, setOpen, setOpenMobile]);\n    React.useEffect(() => {\n        const handleKeyDown = (event: KeyboardEvent) => {\n            if (event.key === SIDEBAR_KEYBOARD_SHORTCUT &&\n                (event.metaKey || event.ctrlKey)) {\n                event.preventDefault();\n                toggleSidebar();\n            }\n        };\n        window.addEventListener(\"keydown\", handleKeyDown);\n        return () => window.removeEventListener(\"keydown\", handleKeyDown);\n    }, [toggleSidebar]);\n    const state = open ? \"expanded\" : \"collapsed\";\n    const contextValue = React.useMemo<SidebarContextProps>(() => ({\n        state,\n        open,\n        setOpen,\n        isMobile,\n        openMobile,\n        setOpenMobile,\n        toggleSidebar,\n    }), [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]);\n    return (<SidebarContext.Provider value={contextValue}>\n      <div data-slot=\"sidebar-wrapper\" style={{\n            \"--sidebar-width\": SIDEBAR_WIDTH,\n            \"--sidebar-width-icon\": SIDEBAR_WIDTH_ICON,\n            ...style,\n        } as React.CSSProperties} className={cn(\"group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar\", className)} {...props}>\n        {children}\n      </div>\n    </SidebarContext.Provider>);\n}\nfunction Sidebar({ side = \"left\", variant = \"sidebar\", collapsible = \"offcanvas\", className, children, dir, ...props }: React.ComponentProps<\"div\"> & {\n    side?: \"left\" | \"right\";\n    variant?: \"sidebar\" | \"floating\" | \"inset\";\n    collapsible?: \"offcanvas\" | \"icon\" | \"none\";\n}) {\n    const { isMobile, state, openMobile, setOpenMobile } = useSidebar();\n    if (collapsible === \"none\") {\n        return (<div data-slot=\"sidebar\" className={cn(\"flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground\", className)} {...props}>\n        {children}\n      </div>);\n    }\n    if (isMobile) {\n        return (<Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>\n        <SheetContent dir={dir} data-sidebar=\"sidebar\" data-slot=\"sidebar\" data-mobile=\"true\" className=\"w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden\" style={{\n                \"--sidebar-width\": SIDEBAR_WIDTH_MOBILE,\n            } as React.CSSProperties} side={side}>\n          <SheetHeader className=\"sr-only\">\n            <SheetTitle>Sidebar</SheetTitle>\n            <SheetDescription>Displays the mobile sidebar.</SheetDescription>\n          </SheetHeader>\n          <div className=\"flex h-full w-full flex-col\">{children}</div>\n        </SheetContent>\n      </Sheet>);\n    }\n    return (<div className=\"group peer hidden text-sidebar-foreground md:block\" data-state={state} data-collapsible={state === \"collapsed\" ? collapsible : \"\"} data-variant={variant} data-side={side} data-slot=\"sidebar\">\n      \n      <div data-slot=\"sidebar-gap\" className={cn(\"relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear\", \"group-data-[collapsible=offcanvas]:w-0\", \"group-data-[side=right]:rotate-180\", variant === \"floating\" || variant === \"inset\"\n            ? \"group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]\"\n            : \"group-data-[collapsible=icon]:w-(--sidebar-width-icon)\")}/>\n      <div data-slot=\"sidebar-container\" data-side={side} className={cn(\"fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex\", variant === \"floating\" || variant === \"inset\"\n            ? \"p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]\"\n            : \"group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l\", className)} {...props}>\n        <div data-sidebar=\"sidebar\" data-slot=\"sidebar-inner\" className=\"flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border\">\n          {children}\n        </div>\n      </div>\n    </div>);\n}\nfunction SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>) {\n    const { toggleSidebar } = useSidebar();\n    return (<Button data-sidebar=\"trigger\" data-slot=\"sidebar-trigger\" variant=\"ghost\" size=\"icon-sm\" className={cn(className)} onClick={(event) => {\n            onClick?.(event);\n            toggleSidebar();\n        }} {...props}>\n      <PanelLeftIcon />\n      <span className=\"sr-only\">Toggle Sidebar</span>\n    </Button>);\n}\nfunction SidebarRail({ className, ...props }: React.ComponentProps<\"button\">) {\n    const { toggleSidebar } = useSidebar();\n    return (<button data-sidebar=\"rail\" data-slot=\"sidebar-rail\" aria-label=\"Toggle Sidebar\" tabIndex={-1} onClick={toggleSidebar} title=\"Toggle Sidebar\" className={cn(\"absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2\", \"in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize\", \"[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize\", \"group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar\", \"[[data-side=left][data-collapsible=offcanvas]_&]:-right-2\", \"[[data-side=right][data-collapsible=offcanvas]_&]:-left-2\", className)} {...props}/>);\n}\nfunction SidebarInset({ className, ...props }: React.ComponentProps<\"main\">) {\n    return (<main data-slot=\"sidebar-inset\" className={cn(\"relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2\", className)} {...props}/>);\n}\nfunction SidebarInput({ className, ...props }: React.ComponentProps<typeof Input>) {\n    return (<Input data-slot=\"sidebar-input\" data-sidebar=\"input\" className={cn(\"h-8 w-full bg-background shadow-none\", className)} {...props}/>);\n}\nfunction SidebarHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sidebar-header\" data-sidebar=\"header\" className={cn(\"flex flex-col gap-2 p-2\", className)} {...props}/>);\n}\nfunction SidebarFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sidebar-footer\" data-sidebar=\"footer\" className={cn(\"flex flex-col gap-2 p-2\", className)} {...props}/>);\n}\nfunction SidebarSeparator({ className, ...props }: React.ComponentProps<typeof Separator>) {\n    return (<Separator data-slot=\"sidebar-separator\" data-sidebar=\"separator\" className={cn(\"mx-2 w-auto bg-sidebar-border\", className)} {...props}/>);\n}\nfunction SidebarContent({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sidebar-content\" data-sidebar=\"content\" className={cn(\"no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden\", className)} {...props}/>);\n}\nfunction SidebarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sidebar-group\" data-sidebar=\"group\" className={cn(\"relative flex w-full min-w-0 flex-col p-2\", className)} {...props}/>);\n}\nfunction SidebarGroupLabel({ className, render, ...props }: useRender.ComponentProps<\"div\"> & React.ComponentProps<\"div\">) {\n    return useRender({\n        defaultTagName: \"div\",\n        props: mergeProps<\"div\">({\n            className: cn(\"flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"sidebar-group-label\",\n            sidebar: \"group-label\",\n        },\n    });\n}\nfunction SidebarGroupAction({ className, render, ...props }: useRender.ComponentProps<\"button\"> & React.ComponentProps<\"button\">) {\n    return useRender({\n        defaultTagName: \"button\",\n        props: mergeProps<\"button\">({\n            className: cn(\"absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"sidebar-group-action\",\n            sidebar: \"group-action\",\n        },\n    });\n}\nfunction SidebarGroupContent({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sidebar-group-content\" data-sidebar=\"group-content\" className={cn(\"w-full text-sm\", className)} {...props}/>);\n}\nfunction SidebarMenu({ className, ...props }: React.ComponentProps<\"ul\">) {\n    return (<ul data-slot=\"sidebar-menu\" data-sidebar=\"menu\" className={cn(\"flex w-full min-w-0 flex-col gap-0\", className)} {...props}/>);\n}\nfunction SidebarMenuItem({ className, ...props }: React.ComponentProps<\"li\">) {\n    return (<li data-slot=\"sidebar-menu-item\" data-sidebar=\"menu-item\" className={cn(\"group/menu-item relative\", className)} {...props}/>);\n}\nconst sidebarMenuButtonVariants = cva(\"peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate\", {\n    variants: {\n        variant: {\n            default: \"hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\",\n            outline: \"bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_var(--sidebar-accent)]\",\n        },\n        size: {\n            default: \"h-8 text-sm\",\n            sm: \"h-7 text-xs\",\n            lg: \"h-12 text-sm group-data-[collapsible=icon]:p-0!\",\n        },\n    },\n    defaultVariants: {\n        variant: \"default\",\n        size: \"default\",\n    },\n});\nfunction SidebarMenuButton({ render, isActive = false, variant = \"default\", size = \"default\", tooltip, className, ...props }: useRender.ComponentProps<\"button\"> & React.ComponentProps<\"button\"> & {\n    isActive?: boolean;\n    tooltip?: string | React.ComponentProps<typeof TooltipContent>;\n} & VariantProps<typeof sidebarMenuButtonVariants>) {\n    const { isMobile, state } = useSidebar();\n    const comp = useRender({\n        defaultTagName: \"button\",\n        props: mergeProps<\"button\">({\n            className: cn(sidebarMenuButtonVariants({ variant, size }), className),\n        }, props),\n        render: !tooltip ? render : <TooltipTrigger render={render}/>,\n        state: {\n            slot: \"sidebar-menu-button\",\n            sidebar: \"menu-button\",\n            size,\n            active: isActive,\n        },\n    });\n    if (!tooltip) {\n        return comp;\n    }\n    if (typeof tooltip === \"string\") {\n        tooltip = {\n            children: tooltip,\n        };\n    }\n    return (<Tooltip>\n      {comp}\n      <TooltipContent side=\"right\" align=\"center\" hidden={state !== \"collapsed\" || isMobile} {...tooltip}/>\n    </Tooltip>);\n}\nfunction SidebarMenuAction({ className, render, showOnHover = false, ...props }: useRender.ComponentProps<\"button\"> & React.ComponentProps<\"button\"> & {\n    showOnHover?: boolean;\n}) {\n    return useRender({\n        defaultTagName: \"button\",\n        props: mergeProps<\"button\">({\n            className: cn(\"absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0\", showOnHover &&\n                \"group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground aria-expanded:opacity-100 md:opacity-0\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"sidebar-menu-action\",\n            sidebar: \"menu-action\",\n        },\n    });\n}\nfunction SidebarMenuBadge({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"sidebar-menu-badge\" data-sidebar=\"menu-badge\" className={cn(\"pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 peer-data-active/menu-button:text-sidebar-accent-foreground\", className)} {...props}/>);\n}\nfunction SidebarMenuSkeleton({ className, showIcon = false, ...props }: React.ComponentProps<\"div\"> & {\n    showIcon?: boolean;\n}) {\n    const [width] = React.useState(() => {\n        return `${Math.floor(Math.random() * 40) + 50}%`;\n    });\n    return (<div data-slot=\"sidebar-menu-skeleton\" data-sidebar=\"menu-skeleton\" className={cn(\"flex h-8 items-center gap-2 rounded-md px-2\", className)} {...props}>\n      {showIcon && (<Skeleton className=\"size-4 rounded-md\" data-sidebar=\"menu-skeleton-icon\"/>)}\n      <Skeleton className=\"h-4 max-w-(--skeleton-width) flex-1\" data-sidebar=\"menu-skeleton-text\" style={{\n            \"--skeleton-width\": width,\n        } as React.CSSProperties}/>\n    </div>);\n}\nfunction SidebarMenuSub({ className, ...props }: React.ComponentProps<\"ul\">) {\n    return (<ul data-slot=\"sidebar-menu-sub\" data-sidebar=\"menu-sub\" className={cn(\"mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5 group-data-[collapsible=icon]:hidden\", className)} {...props}/>);\n}\nfunction SidebarMenuSubItem({ className, ...props }: React.ComponentProps<\"li\">) {\n    return (<li data-slot=\"sidebar-menu-sub-item\" data-sidebar=\"menu-sub-item\" className={cn(\"group/menu-sub-item relative\", className)} {...props}/>);\n}\nfunction SidebarMenuSubButton({ render, size = \"md\", isActive = false, className, ...props }: useRender.ComponentProps<\"a\"> & React.ComponentProps<\"a\"> & {\n    size?: \"sm\" | \"md\";\n    isActive?: boolean;\n}) {\n    return useRender({\n        defaultTagName: \"a\",\n        props: mergeProps<\"a\">({\n            className: cn(\"flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[size=md]:text-sm data-[size=sm]:text-xs data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground\", className),\n        }, props),\n        render,\n        state: {\n            slot: \"sidebar-menu-sub-button\",\n            sidebar: \"menu-sub-button\",\n            size,\n            active: isActive,\n        },\n    });\n}\nexport { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar, };\n"
    },
    {
      "path": "components/ui/skeleton.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nfunction Skeleton({ className, ...props }: React.ComponentProps<\"div\">) {\n    return (<div data-slot=\"skeleton\" className={cn(\"animate-pulse rounded-md bg-muted\", className)} {...props}/>);\n}\nexport { Skeleton };\n"
    },
    {
      "path": "components/ui/slider.tsx",
      "type": "registry:ui",
      "content": "import { Slider as SliderPrimitive } from \"@base-ui/react/slider\";\nimport { cn } from \"cn\";\nfunction Slider({ className, defaultValue, value, min = 0, max = 100, ...props }: SliderPrimitive.Root.Props) {\n    const _values = Array.isArray(value)\n        ? value\n        : Array.isArray(defaultValue)\n            ? defaultValue\n            : [min, max];\n    return (<SliderPrimitive.Root className={cn(\"data-horizontal:w-full data-vertical:h-full\", className)} data-slot=\"slider\" defaultValue={defaultValue} value={value} min={min} max={max} thumbAlignment=\"edge\" {...props}>\n      <SliderPrimitive.Control className=\"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col\">\n        <SliderPrimitive.Track data-slot=\"slider-track\" className=\"relative grow overflow-hidden rounded-full bg-muted select-none data-horizontal:h-1 data-horizontal:w-full data-vertical:h-full data-vertical:w-1\">\n          <SliderPrimitive.Indicator data-slot=\"slider-range\" className=\"bg-primary select-none data-horizontal:h-full data-vertical:w-full\"/>\n        </SliderPrimitive.Track>\n        {Array.from({ length: _values.length }, (_, index) => (<SliderPrimitive.Thumb data-slot=\"slider-thumb\" key={index} className=\"relative block size-3 shrink-0 rounded-full border border-ring bg-white ring-ring/50 transition-[color,box-shadow] select-none after:absolute after:-inset-2 hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3 disabled:pointer-events-none disabled:opacity-50\"/>))}\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>);\n}\nexport { Slider };\n"
    },
    {
      "path": "components/ui/spinner.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\"\nimport { Loader2Icon } from \"lucide-react\"\n\nfunction Spinner({ className, ...props }: React.ComponentProps<\"svg\">) {\n  return (\n    <Loader2Icon data-slot=\"spinner\" role=\"status\" aria-label=\"Loading\" className={cn(\"size-4 animate-spin\", className)} {...props} />\n  )\n}\n\nexport { Spinner }\n"
    },
    {
      "path": "components/ui/status-indicator.tsx",
      "type": "registry:ui",
      "content": "import { Badge } from \"@/components/ui/badge\";\nexport function StatusIndicator({\n  status = \"online\",\n}: {\n  status?: \"online\" | \"busy\" | \"offline\";\n}) {\n  return (\n    <Badge variant={status === \"online\" ? \"default\" : \"secondary\"}>\n      <span aria-hidden=\"true\">{status === \"offline\" ? \"○\" : \"●\"}</span>\n      {status}\n    </Badge>\n  );\n}\n"
    },
    {
      "path": "components/ui/switch.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Switch as SwitchPrimitive } from \"@base-ui/react/switch\";\nimport { cn } from \"cn\";\nfunction Switch({ className, size = \"default\", ...props }: SwitchPrimitive.Root.Props & {\n    size?: \"sm\" | \"default\";\n}) {\n    return (<SwitchPrimitive.Root data-slot=\"switch\" data-size={size} className={cn(\"peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none group-has-[:focus-visible]/field-label:border-transparent group-has-[:focus-visible]/field-label:ring-0 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50\", className)} {...props}>\n      <SwitchPrimitive.Thumb data-slot=\"switch-thumb\" className=\"pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground\"/>\n    </SwitchPrimitive.Root>);\n}\nexport { Switch };\n"
    },
    {
      "path": "components/ui/table.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { cn } from \"cn\";\nimport type * as React from \"react\";\nfunction Table({ className, ...props }: React.ComponentProps<\"table\">) {\n    return (<div data-slot=\"table-container\" className=\"relative w-full overflow-x-auto\">\n      <table data-slot=\"table\" className={cn(\"w-full caption-bottom text-sm\", className)} {...props}/>\n    </div>);\n}\nfunction TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n    return (<thead data-slot=\"table-header\" className={cn(\"[&_tr]:border-b\", className)} {...props}/>);\n}\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n    return (<tbody data-slot=\"table-body\" className={cn(\"[&_tr:last-child]:border-0\", className)} {...props}/>);\n}\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n    return (<tfoot data-slot=\"table-footer\" className={cn(\"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0\", className)} {...props}/>);\n}\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n    return (<tr data-slot=\"table-row\" className={cn(\"border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted\", className)} {...props}/>);\n}\nfunction TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n    return (<th data-slot=\"table-head\" className={cn(\"h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0\", className)} {...props}/>);\n}\nfunction TableCell({ className, ...props }: React.ComponentProps<\"td\">) {\n    return (<td data-slot=\"table-cell\" className={cn(\"p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0\", className)} {...props}/>);\n}\nfunction TableCaption({ className, ...props }: React.ComponentProps<\"caption\">) {\n    return (<caption data-slot=\"table-caption\" className={cn(\"mt-4 text-sm text-muted-foreground\", className)} {...props}/>);\n}\nexport { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, };\n"
    },
    {
      "path": "components/ui/tabs.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nfunction Tabs({\n  className,\n  orientation = \"horizontal\",\n  ...props\n}: TabsPrimitive.Root.Props) {\n  return (\n    <TabsPrimitive.Root\n      data-slot=\"tabs\"\n      data-orientation={orientation}\n      className={cn(\n        \"group/tabs flex gap-2 data-horizontal:flex-col\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst tabsListVariants = cva(\n  \"group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-muted\",\n        line: \"gap-1 bg-transparent\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction TabsList({\n  className,\n  variant = \"default\",\n  ...props\n}: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>) {\n  return (\n    <TabsPrimitive.List\n      data-slot=\"tabs-list\"\n      data-variant={variant}\n      className={cn(tabsListVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction TabsTrigger({ className, ...props }: TabsPrimitive.Tab.Props) {\n  return (\n    <TabsPrimitive.Tab\n      data-slot=\"tabs-trigger\"\n      className={cn(\n        \"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        \"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent\",\n        \"data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground\",\n        \"after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TabsContent({ className, ...props }: TabsPrimitive.Panel.Props) {\n  return (\n    <TabsPrimitive.Panel\n      data-slot=\"tabs-content\"\n      className={cn(\"flex-1 text-sm outline-none\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants }\n"
    },
    {
      "path": "components/ui/text-field.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { type ComponentProps, useId } from \"react\";\nimport {\n  Field,\n  FieldDescription,\n  FieldError,\n  FieldLabel,\n} from \"@/components/ui/field\";\nimport { Input } from \"@/components/ui/input\";\n\ntype TextFieldProps = ComponentProps<typeof Input> & {\n  label: string;\n  description?: string;\n  error?: string;\n};\n\nexport function TextField({\n  label,\n  description,\n  error,\n  id,\n  \"aria-describedby\": describedBy,\n  ...props\n}: TextFieldProps) {\n  const generatedId = useId();\n  const inputId = id ?? generatedId;\n  const descriptionId = `${inputId}-description`;\n  const errorId = `${inputId}-error`;\n  const descriptionIds =\n    [describedBy, description && descriptionId, error && errorId]\n      .filter(Boolean)\n      .join(\" \") || undefined;\n  return (\n    <Field data-invalid={Boolean(error)} data-disabled={props.disabled}>\n      <FieldLabel htmlFor={inputId}>{label}</FieldLabel>\n      <Input\n        {...props}\n        id={inputId}\n        aria-invalid={error ? true : props[\"aria-invalid\"]}\n        aria-describedby={descriptionIds}\n      />\n      {description && (\n        <FieldDescription id={descriptionId}>{description}</FieldDescription>\n      )}\n      {error && <FieldError id={errorId}>{error}</FieldError>}\n    </Field>\n  );\n}\n"
    },
    {
      "path": "components/ui/textarea.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"cn\";\nimport type * as React from \"react\";\nfunction Textarea({ className, ...props }: React.ComponentProps<\"textarea\">) {\n    return (<textarea data-slot=\"textarea\" className={cn(\"flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring/30 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\", className)} {...props}/>);\n}\nexport { Textarea };\n"
    },
    {
      "path": "components/ui/toast.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Toast as ToastPrimitive } from \"@base-ui/react/toast\";\nimport { cn } from \"cn\";\nimport { CircleCheckIcon, InfoIcon, Loader2Icon, OctagonXIcon, TriangleAlertIcon, XIcon, } from \"lucide-react\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nconst toast = ToastPrimitive.createToastManager();\nfunction ToastProvider({ ...props }: ToastPrimitive.Provider.Props) {\n    return <ToastPrimitive.Provider {...props}/>;\n}\nfunction ToastPortal({ ...props }: ToastPrimitive.Portal.Props) {\n    return <ToastPrimitive.Portal data-slot=\"toast-portal\" {...props}/>;\n}\nfunction ToastViewport({ className, ...props }: ToastPrimitive.Viewport.Props) {\n    return (<ToastPrimitive.Viewport data-slot=\"toast-viewport\" className={cn(\"pointer-events-none fixed inset-x-4 bottom-4 z-50 mx-auto w-auto max-w-sm outline-none sm:right-4 sm:left-auto sm:mx-0 sm:w-full\", className)} {...props}/>);\n}\nfunction Toast({ className, ...props }: ToastPrimitive.Root.Props) {\n    return (<ToastPrimitive.Root data-slot=\"toast\" className={cn(\"group/toast pointer-events-auto absolute right-0 bottom-0 z-[calc(1000-var(--toast-index))] w-full origin-bottom rounded-2xl border bg-popover text-popover-foreground shadow-lg will-change-transform outline-none select-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50\", \"[--gap:0.75rem] [--height:var(--toast-frontmost-height,var(--toast-height))] [--offset-y:calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y))] [--peek:0.75rem] [--scale:calc(max(0,1-(var(--toast-index)*0.1)))] [--shrink:calc(1-var(--scale))]\", \"h-(--height) [transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)-(var(--toast-index)*var(--peek))-(var(--shrink)*var(--height))))_scale(var(--scale))] [transition:transform_500ms_cubic-bezier(0.22,1,0.36,1),opacity_500ms,height_150ms]\", \"after:absolute after:top-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\", \"data-expanded:h-(--toast-height) data-expanded:[transform:translateX(var(--toast-swipe-movement-x))_translateY(var(--offset-y))]\", \"data-limited:opacity-0 data-starting-style:[transform:translateY(150%)]\", \"[&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateY(150%)]\", \"data-ending-style:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]\", \"data-ending-style:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))]\", \"data-ending-style:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]\", \"data-ending-style:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))]\", \"data-expanded:data-ending-style:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]\", \"data-expanded:data-ending-style:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))]\", \"data-expanded:data-ending-style:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]\", \"data-expanded:data-ending-style:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))]\", className)} {...props}/>);\n}\nfunction ToastContent({ className, ...props }: ToastPrimitive.Content.Props) {\n    return (<ToastPrimitive.Content data-slot=\"toast-content\" className={cn(\"flex h-full items-center gap-3 overflow-hidden p-4 transition-opacity duration-250 ease-[cubic-bezier(0.22,1,0.36,1)] data-behind:opacity-0 data-expanded:opacity-100\", className)} {...props}/>);\n}\nfunction ToastTitle({ className, ...props }: ToastPrimitive.Title.Props) {\n    return (<ToastPrimitive.Title data-slot=\"toast-title\" className={cn(\"text-sm font-medium\", className)} {...props}/>);\n}\nfunction ToastDescription({ className, ...props }: ToastPrimitive.Description.Props) {\n    return (<ToastPrimitive.Description data-slot=\"toast-description\" className={cn(\"text-sm text-muted-foreground\", className)} {...props}/>);\n}\nfunction ToastAction({ className, render = <Button variant=\"outline\" size=\"sm\"/>, ...props }: ToastPrimitive.Action.Props) {\n    return (<ToastPrimitive.Action data-slot=\"toast-action\" render={render} className={cn(\"shrink-0\", className)} {...props}/>);\n}\nfunction ToastClose({ className, children, render = <Button variant=\"ghost\" size=\"icon-sm\"/>, ...props }: ToastPrimitive.Close.Props) {\n    return (<ToastPrimitive.Close data-slot=\"toast-close\" aria-label=\"Close toast\" render={render} className={cn(\"relative shrink-0 text-muted-foreground after:absolute after:-inset-2 after:content-[''] hover:text-foreground\", className)} {...props}>\n      {children ?? <XIcon aria-hidden=\"true\"/>}\n    </ToastPrimitive.Close>);\n}\nfunction ToastIcon({ type }: {\n    type: string | undefined;\n}) {\n    let icon: React.ReactNode = null;\n    if (type === \"success\") {\n        icon = <CircleCheckIcon aria-hidden=\"true\"/>;\n    }\n    if (type === \"info\") {\n        icon = <InfoIcon aria-hidden=\"true\"/>;\n    }\n    if (type === \"warning\") {\n        icon = <TriangleAlertIcon aria-hidden=\"true\"/>;\n    }\n    if (type === \"error\") {\n        icon = <OctagonXIcon className=\"text-destructive\" aria-hidden=\"true\"/>;\n    }\n    if (type === \"loading\") {\n        icon = <Loader2Icon className=\"animate-spin\" aria-hidden=\"true\"/>;\n    }\n    if (!icon) {\n        return null;\n    }\n    return (<span data-slot=\"toast-icon\" className=\"shrink-0 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\">\n      {icon}\n    </span>);\n}\nfunction ToastList() {\n    const { toasts } = ToastPrimitive.useToastManager();\n    return toasts.map((toastItem) => (<Toast key={toastItem.id} toast={toastItem}>\n      <ToastContent>\n        <ToastIcon type={toastItem.type}/>\n        <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n          <ToastTitle />\n          <ToastDescription />\n        </div>\n        <ToastAction />\n        <ToastClose />\n      </ToastContent>\n    </Toast>));\n}\nfunction Toaster({ children, toastManager = toast, ...props }: ToastPrimitive.Provider.Props) {\n    return (<ToastProvider toastManager={toastManager} {...props}>\n      {children}\n      <ToastPortal>\n        <ToastViewport>\n          <ToastList />\n        </ToastViewport>\n      </ToastPortal>\n    </ToastProvider>);\n}\nconst createToastManager = ToastPrimitive.createToastManager;\nconst useToastManager = ToastPrimitive.useToastManager;\nexport { createToastManager, Toast, ToastAction, ToastClose, ToastContent, ToastDescription, Toaster, ToastPortal, ToastProvider, ToastTitle, ToastViewport, toast, useToastManager, };\n"
    },
    {
      "path": "components/ui/toggle-group.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { ToggleGroup as ToggleGroupPrimitive } from \"@base-ui/react/toggle-group\"\nimport { type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nimport { toggleVariants } from \"@/components/ui/toggle\"\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number\n    orientation?: \"horizontal\" | \"vertical\"\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 2,\n  orientation: \"horizontal\",\n})\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 2,\n  orientation = \"horizontal\",\n  children,\n  ...props\n}: ToggleGroupPrimitive.Props &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number\n    orientation?: \"horizontal\" | \"vertical\"\n  }) {\n  return (\n    <ToggleGroupPrimitive\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      data-orientation={orientation}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] rounded-lg data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-vertical:flex-col data-vertical:items-stretch\",\n        className\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider\n        value={{ variant, size, spacing, orientation }}\n      >\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive>\n  )\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext)\n\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-spacing={context.spacing}\n      className={cn(\n        \"shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-1.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-1.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t\",\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </TogglePrimitive>\n  )\n}\n\nexport { ToggleGroup, ToggleGroupItem }\n"
    },
    {
      "path": "components/ui/toggle.tsx",
      "type": "registry:ui",
      "content": "\"use client\"\n\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nconst toggleVariants = cva(\n  \"group/toggle inline-flex items-center justify-center gap-1 rounded-lg text-sm font-medium whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground 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 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        outline: \"border border-input bg-transparent hover:bg-muted\",\n      },\n      size: {\n        default:\n          \"h-8 min-w-8 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        sm: \"h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: \"h-9 min-w-9 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Toggle({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Toggle, toggleVariants }\n"
    },
    {
      "path": "components/ui/tooltip.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Tooltip as TooltipPrimitive } from \"@base-ui/react/tooltip\";\nimport { cn } from \"cn\";\nfunction TooltipProvider({ delay = 0, ...props }: TooltipPrimitive.Provider.Props) {\n    return (<TooltipPrimitive.Provider data-slot=\"tooltip-provider\" delay={delay} {...props}/>);\n}\nfunction Tooltip({ ...props }: TooltipPrimitive.Root.Props) {\n    return <TooltipPrimitive.Root data-slot=\"tooltip\" {...props}/>;\n}\nfunction TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {\n    return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props}/>;\n}\nfunction TooltipContent({ className, side = \"top\", sideOffset = 4, align = \"center\", alignOffset = 0, children, ...props }: TooltipPrimitive.Popup.Props & Pick<TooltipPrimitive.Positioner.Props, \"align\" | \"alignOffset\" | \"side\" | \"sideOffset\">) {\n    return (<TooltipPrimitive.Portal>\n      <TooltipPrimitive.Positioner align={align} alignOffset={alignOffset} side={side} sideOffset={sideOffset} className=\"isolate z-50\">\n        <TooltipPrimitive.Popup data-slot=\"tooltip-content\" className={cn(\"z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\", className)} {...props}>\n          {children}\n          <TooltipPrimitive.Arrow className=\"z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5\"/>\n        </TooltipPrimitive.Popup>\n      </TooltipPrimitive.Positioner>\n    </TooltipPrimitive.Portal>);\n}\nexport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };\n"
    },
    {
      "path": "hooks/use-mobile.ts",
      "type": "registry:hook",
      "content": "import * as React from \"react\";\n\nconst MOBILE_BREAKPOINT = 768;\nexport function useIsMobile() {\n  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(\n    undefined,\n  );\n  React.useEffect(() => {\n    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);\n    const onChange = () => {\n      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\n    };\n    mql.addEventListener(\"change\", onChange);\n    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\n    return () => mql.removeEventListener(\"change\", onChange);\n  }, []);\n  return !!isMobile;\n}\n"
    }
  ],
  "cssVars": {
    "light": {
      "background": "#ffffff",
      "foreground": "#141414",
      "card": "#ffffff",
      "card-foreground": "#141414",
      "popover": "#ffffff",
      "popover-foreground": "#141414",
      "secondary": "#f5f5f5",
      "secondary-foreground": "#141414",
      "muted": "#f5f5f5",
      "muted-foreground": "#6b6b6b",
      "accent": "#f0f0f0",
      "accent-foreground": "#141414",
      "border": "#e6e6e6",
      "input": "#cccccc",
      "destructive": "#b91c1c",
      "syntax-text": "#242424",
      "syntax-keyword": "#754399",
      "syntax-string": "#326348",
      "syntax-function": "#315d89",
      "syntax-number": "#86551f",
      "syntax-comment": "#6b6b6b",
      "syntax-punctuation": "#616161",
      "syntax-type": "#7c464c",
      "syntax-background": "#f8f8f8",
      "sidebar": "#f5f5f5",
      "sidebar-foreground": "#141414",
      "sidebar-primary": "#141414",
      "sidebar-primary-foreground": "#ffffff",
      "sidebar-accent": "#f0f0f0",
      "sidebar-accent-foreground": "#141414",
      "sidebar-border": "#e6e6e6",
      "sidebar-ring": "#141414",
      "chart-1": "#141414",
      "chart-2": "#525252",
      "chart-3": "#737373",
      "chart-4": "#a3a3a3",
      "chart-5": "#d4d4d4",
      "primary": "#141414",
      "primary-foreground": "#ffffff",
      "ring": "#141414",
      "radius": "0rem",
      "font-sans": "ui-sans-serif, system-ui, sans-serif",
      "control-height": "2rem"
    },
    "dark": {
      "background": "#141414",
      "foreground": "#fafafa",
      "card": "#1c1c1c",
      "card-foreground": "#fafafa",
      "popover": "#1c1c1c",
      "popover-foreground": "#fafafa",
      "secondary": "#262626",
      "secondary-foreground": "#fafafa",
      "muted": "#262626",
      "muted-foreground": "#a3a3a3",
      "accent": "#303030",
      "accent-foreground": "#fafafa",
      "border": "#404040",
      "input": "#404040",
      "destructive": "#ff9d9d",
      "syntax-text": "#ededed",
      "syntax-keyword": "#c6a3df",
      "syntax-string": "#98c4a4",
      "syntax-function": "#9cbedf",
      "syntax-number": "#d7b27d",
      "syntax-comment": "#a3a3a3",
      "syntax-punctuation": "#b0b0b0",
      "syntax-type": "#dda2aa",
      "syntax-background": "#1b1b1b",
      "sidebar": "#262626",
      "sidebar-foreground": "#fafafa",
      "sidebar-primary": "#fafafa",
      "sidebar-primary-foreground": "#141414",
      "sidebar-accent": "#303030",
      "sidebar-accent-foreground": "#fafafa",
      "sidebar-border": "#404040",
      "sidebar-ring": "#fafafa",
      "chart-1": "#fafafa",
      "chart-2": "#d4d4d4",
      "chart-3": "#a3a3a3",
      "chart-4": "#737373",
      "chart-5": "#525252",
      "primary": "#fafafa",
      "primary-foreground": "#141414",
      "ring": "#fafafa",
      "radius": "0rem",
      "font-sans": "ui-sans-serif, system-ui, sans-serif",
      "control-height": "2rem"
    }
  }
}