{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "command",
  "type": "registry:block",
  "title": "Command",
  "description": "Command with Crafter styling. Explore the live example and use the source in your project.",
  "dependencies": [
    "@base-ui/react@^1.8.0",
    "class-variance-authority@^0.7.1",
    "cmdk@^1.1.1",
    "cn@^0.2.6",
    "lucide-react@^1.42.0"
  ],
  "files": [
    {
      "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/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/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/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.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/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"
    }
  ],
  "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"
    }
  }
}