import { Input } from "@/components/ui/input";

export function InputFileDemo() {
return (
  <div className="grid w-full max-w-sm items-center gap-3">
    <label htmlFor="picture" className="font-medium text-sm">
      Picture
    </label>
    <Input id="picture" type="file" />
  </div>
);
}

import { Input } from "@/components/ui/input";

export function InputDisabledDemo() {
return (
  <div className="w-full max-w-sm">
    <Input disabled type="email" placeholder="Email" />
  </div>
);
}

import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";

export function InputWithButtonDemo() {
return (
  <div className="grid w-full max-w-sm gap-3">
    <label htmlFor="newsletter-email" className="font-medium text-sm">
      Email
    </label>
    <div className="flex items-center gap-2">
      <Input id="newsletter-email" type="email" placeholder="Email" />
      <Button type="submit" variant="outline">
        Subscribe
      </Button>
    </div>
  </div>
);
}