Input

1import * as React from "react";
2 
3import { cn } from "@/lib/utils";
4 
5export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
6  mono?: boolean;
7}
8 
9const Input = React.forwardRef<HTMLInputElement, InputProps>(
10  ({ className, type = "text", mono = false, ...props }, ref) => {
11    return (
12      <input
13        ref={ref}
14        type={type}
15        className={cn(
16          "border-border bg-input flex h-8 w-full rounded-sm border px-2.5 py-1 text-sm",
17          "placeholder:text-foreground-subtle",
18          "focus:ring-ring focus:ring-offset-background focus:border-primary/60 focus:ring-2 focus:ring-offset-1 focus:outline-none",
19          "disabled:cursor-not-allowed disabled:opacity-50",
20          "file:border-0 file:bg-transparent file:text-sm file:font-medium",
21          mono && "font-mono",
22          className,
23        )}
24        {...props}
25      />
26    );
27  },
28);
29Input.displayName = "Input";
30 
31export { Input };