"use client";

import * as React from "react";
import {
  Input as KumoInput,
  Textarea as KumoTextarea,
  type InputAreaProps as KumoTextareaProps,
  type InputProps as KumoInputProps,
} from "@cloudflare/kumo/components/input";

import { cn } from "@/lib/utils";

export type InputProps = KumoInputProps;
export type TextareaProps = KumoTextareaProps;

export const Input = React.forwardRef<HTMLInputElement, InputProps>(function Input(
  { className, ...props },
  ref,
): React.ReactElement {
  return <KumoInput ref={ref} className={cn("teatea-control w-full", className)} {...props} />;
});

export const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(function Textarea(
  { className, ...props },
  ref,
): React.ReactElement {
  return <KumoTextarea ref={ref} className={cn("teatea-control min-h-24 w-full", className)} {...props} />;
});