// The sidebar's search field: a substring filter over the tree (name, command
// and cwd). Escape clears it and hands the keyboard back to the list.

export interface SidebarSearchProps {
  value: string;
  onChange(value: string): void;
  /** Escape on an already-empty field — the list wants the keyboard back. */
  onDismiss?(): void;
}

export function SidebarSearch({ value, onChange, onDismiss }: SidebarSearchProps) {
  return (
    <header className="sidebar-search p-sp-2">
      <input
        type="search"
        className="search w-full rounded-r-1 border border-border bg-surface-2 px-sp-2 py-sp-1 text-fs-12 text-ink"
        placeholder="Search sessions…"
        aria-label="Search sessions"
        autoComplete="off"
        autoCorrect="off"
        autoCapitalize="off"
        spellCheck={false}
        value={value}
        onChange={(e) => onChange(e.currentTarget.value)}
        onKeyDown={(e) => {
          if (e.key !== "Escape") return;
          e.preventDefault();
          if (value) onChange("");
          else onDismiss?.();
        }}
      />
    </header>
  );
}