Directory pickers and file trees usually assume a local filesystem — the moment the tree lives on a REMOTE machine (a dev box, a build server, a fancy-term-host session) most components force you to eager-load the whole tree over the wire, hand-roll loading and error states per folder, and scrape the DOM to know what an agent selected. Genie needed to let a user (or an agent) browse a remote host and pick a directory, and nothing in the kit — or most kits — did it without owning the transport.

FileBrowser is a compound browse-and-pick surface (PathBar / Toolbar / Tree / Node) that never touches a filesystem: you feed it an async provider.loadChildren(path) (lazy per-folder, per-node loading + error/retry, stale responses discarded — never an eager walk) and/or a JSON-friendly snapshot tree you update as chunks stream in from the other machine. select="file|directory|both" (+multiple), fully controlled selection / path / expansion / sort / filter, an editable path input + click trail, ARIA tree keyboard nav, and a stable data-path handle on every row.

Pass provider={{ loadChildren }} over whatever transport you have (HTTP, relay, MCP tool) and hold value + onChange for the picked path — select="directory" makes it a directory picker in one prop. For streamed remote snapshots, keep the tree in state and pass it as snapshot, merging chunks as they arrive; hybrid mode lets the provider lazily fill anything the snapshot left unknown. An agent-facing registerFilesBridge ships in @particle-academy/agent-integrations as a follow-up.