treeFilter

// Tree.Filter's field carries treeFilter({ tree }), which narrows the tree on every keystroke.
<Tree.Filter tree="changed-files" label="Filter changed files" placeholder="Filter changed files…" action="/acme/delta/pull/412/files" />

<Tree id="changed-files" aria-label="Changed files" frame="diff">
	<Tree.Navigation labels={{ group: "Changed files" }} />
	<Tree.Item id="src" open>
		<Tree.ItemContent aria-expanded="true">
			<Tree.ExpandButton />
			<FolderIcon aria-hidden="true" />
			src
		</Tree.ItemContent>
		<Tree.Item id="src-lexer" open>
			<Tree.ItemContent aria-expanded="true">
				<Tree.ExpandButton />
				<FolderIcon aria-hidden="true" />
				lexer
			</Tree.ItemContent>
			<Tree.Leaf
				href="/acme/delta/pull/412/files#diff-identifier"
				name="identifier.ts"
				path="src/lexer/identifier.ts"
				current
				status="modified"
				statusLabel="Modified"
				additions={18}
				deletions={4}
			/>
			<Tree.Leaf href="…" name="unicode.ts" path="src/lexer/unicode.ts" status="added" statusLabel="Added" additions={96} />
			…
		</Tree.Item>
	</Tree.Item>
</Tree>