import StatusPill from "./StatusPill";

export default function EditorBlock({ title, text, locked, fill = false }) {
  return (
    <div className={fill ? "flex min-h-0 flex-1 flex-col" : undefined}>
      <div className="mb-2 flex items-center justify-between">
        <span className="text-[12px] font-black text-muted">{title}</span>
        {locked ? <StatusPill tone="muted" label="不可修改" /> : null}
      </div>
      <textarea className={`editor ${fill ? "flex-1" : ""}`} defaultValue={text} disabled={locked} />
    </div>
  );
}