import MDEditor from "@uiw/react-md-editor";
import type { Control, FieldValues, Path } from "react-hook-form";
import { FormControl, FormField, FormItem, FormLabel } from "~/components/ui/form";
export default function MdeFormField<T extends FieldValues>(params: { control: Control<T>, name: Path<T>, label: string, dataColorMode: "dark"|"light" }) {
  return (
    <FormField
      control={params.control}
      name={params.name}
      render={({ field }) => (
        <FormItem>
          <FormLabel>
            {params.label}
          </FormLabel>
          <FormControl>
            <MDEditor
              value={field.value ? field.value : ""}
              onChange={field.onChange}
              data-color-mode={params.dataColorMode}
            />
          </FormControl>
        </FormItem>
      )}
    />
  )
}