// Composer.jsx — message composer with Pod selector
function Composer({ value, onChange, onSend, placeholder, podName }) {
  const send = (e) => { e.preventDefault?.(); if (value.trim()) onSend(); };
  const onKey = (e) => { if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); send(); } };
  return (
    <form className="ask-composer" onSubmit={send}>
      <div className="ask-composer__pod">
        <Icon name="lock" size={12}/>
        <span>Bound to</span>
        <strong>{podName || "global"}</strong>
      </div>
      <textarea
        className="ask-composer__input"
        rows="2"
        value={value}
        onChange={e => onChange(e.target.value)}
        onKeyDown={onKey}
        placeholder={placeholder || "Ask within the Walled Garden…"}
      />
      <div className="ask-composer__bar">
        <span className="ask-composer__hint">RAG enforced · ⏎ to send</span>
        <button type="submit" className="btn btn-primary btn-sm" disabled={!value.trim()}>
          <Icon name="send" size={14}/> Send
        </button>
      </div>
    </form>
  );
}
window.Composer = Composer;