diff options
| author | David Hill <[email protected]> | 2026-01-16 23:59:42 +0000 |
|---|---|---|
| committer | David Hill <[email protected]> | 2026-01-17 00:55:13 +0000 |
| commit | 6f78a71fa7d87faf8820b6f68ceb849c1a371967 (patch) | |
| tree | 0a57acfb4959db842682759c09317641f6eaa917 | |
| parent | f8f1f46a4fb759466ef477bad10663e678900632 (diff) | |
| download | opencode-6f78a71fa7d87faf8820b6f68ceb849c1a371967.tar.gz opencode-6f78a71fa7d87faf8820b6f68ceb849c1a371967.zip | |
feat: add hideIcon and class options to List search, customize search modal input
| -rw-r--r-- | packages/app/src/components/dialog-select-file.tsx | 2 | ||||
| -rw-r--r-- | packages/ui/src/components/list.tsx | 8 |
2 files changed, 7 insertions, 3 deletions
diff --git a/packages/app/src/components/dialog-select-file.tsx b/packages/app/src/components/dialog-select-file.tsx index 0adb35fc8..1057e83a2 100644 --- a/packages/app/src/components/dialog-select-file.tsx +++ b/packages/app/src/components/dialog-select-file.tsx @@ -136,7 +136,7 @@ export function DialogSelectFile() { return ( <Dialog title="Search"> <List - search={{ placeholder: "Search files and commands", autofocus: true }} + search={{ placeholder: "Search files and commands", autofocus: true, hideIcon: true, class: "px-3" }} emptyMessage="No results found" items={items} key={(item) => item.id} diff --git a/packages/ui/src/components/list.tsx b/packages/ui/src/components/list.tsx index dc83db53a..fd618fbdd 100644 --- a/packages/ui/src/components/list.tsx +++ b/packages/ui/src/components/list.tsx @@ -8,6 +8,8 @@ import { TextField } from "./text-field" export interface ListSearchProps { placeholder?: string autofocus?: boolean + hideIcon?: boolean + class?: string } export interface ListProps<T> extends FilteredListProps<T> { @@ -146,9 +148,11 @@ export function List<T>(props: ListProps<T> & { ref?: (ref: ListRef) => void }) return ( <div data-component="list" classList={{ [props.class ?? ""]: !!props.class }}> <Show when={!!props.search}> - <div data-slot="list-search"> + <div data-slot="list-search" classList={{ [searchProps().class ?? ""]: !!searchProps().class }}> <div data-slot="list-search-container"> - <Icon name="magnifying-glass" /> + <Show when={!searchProps().hideIcon}> + <Icon name="magnifying-glass" /> + </Show> <TextField autofocus={searchProps().autofocus} variant="ghost" |