"use client"

import { Copy } from "lucide-react"
import { toast } from "sonner"
import { Label } from "@/components/ui/label"
import { Textarea } from "@/components/ui/textarea"

export function PromptEditor({
  label = "自定义提示词 (customPrompt)",
  value,
  onChange,
  placeholder,
  rows = 6,
}: {
  label?: string
  value: string
  onChange: (v: string) => void
  placeholder?: string
  rows?: number
}) {
  function copy() {
    navigator.clipboard.writeText(value)
    toast.success("已复制 Prompt")
  }

  return (
    <div className="grid gap-1.5">
      <div className="flex items-center justify-between">
        <Label>{label}</Label>
        <button
          type="button"
          onClick={copy}
          className="inline-flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground"
        >
          <Copy className="size-3.5" />
          复制
        </button>
      </div>
      <Textarea
        value={value}
        onChange={(e) => onChange(e.target.value)}
        placeholder={placeholder}
        style={{ minHeight: `${rows * 1.6}rem` }}
        className="bg-input/60 text-sm"
      />
    </div>
  )
}
