diff options
| author | Adam <[email protected]> | 2025-12-10 17:17:34 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2025-12-10 17:17:37 -0600 |
| commit | 85cfa226c34e41660ddfdcb04543af2e494ae168 (patch) | |
| tree | f98a6631bf169470c37eeacc79129b826da59dd2 /packages/ui/src | |
| parent | cbb591eb7dfe8e27298945f10e5d6cfff4405630 (diff) | |
| download | opencode-85cfa226c34e41660ddfdcb04543af2e494ae168.tar.gz opencode-85cfa226c34e41660ddfdcb04543af2e494ae168.zip | |
wip(desktop): progress
Diffstat (limited to 'packages/ui/src')
| -rw-r--r-- | packages/ui/src/components/input.tsx | 10 | ||||
| -rw-r--r-- | packages/ui/src/components/list.css | 8 | ||||
| -rw-r--r-- | packages/ui/src/components/list.tsx | 3 |
3 files changed, 19 insertions, 2 deletions
diff --git a/packages/ui/src/components/input.tsx b/packages/ui/src/components/input.tsx index cbf23e5c7..82f704e8c 100644 --- a/packages/ui/src/components/input.tsx +++ b/packages/ui/src/components/input.tsx @@ -7,6 +7,7 @@ export interface InputProps Partial<Pick<ComponentProps<typeof Kobalte>, "value" | "onChange" | "onKeyDown">> { label?: string hideLabel?: boolean + hidden?: boolean description?: string } @@ -14,6 +15,7 @@ export function Input(props: InputProps) { const [local, others] = splitProps(props, [ "class", "label", + "hidden", "hideLabel", "description", "value", @@ -21,7 +23,13 @@ export function Input(props: InputProps) { "onKeyDown", ]) return ( - <Kobalte data-component="input" value={local.value} onChange={local.onChange} onKeyDown={local.onKeyDown}> + <Kobalte + data-component="input" + style={{ height: local.hidden ? 0 : undefined }} + value={local.value} + onChange={local.onChange} + onKeyDown={local.onKeyDown} + > <Show when={local.label}> <Kobalte.Label data-slot="input-label" classList={{ "sr-only": local.hideLabel }}> {local.label} diff --git a/packages/ui/src/components/list.css b/packages/ui/src/components/list.css index 63d9a2fe1..38dcb773b 100644 --- a/packages/ui/src/components/list.css +++ b/packages/ui/src/components/list.css @@ -97,10 +97,18 @@ [data-slot="list-item-active-icon"] { display: block; } + [data-slot="list-item-extra-icon"] { + color: var(--icon-strong-base) !important; + } } &:active { background: var(--surface-raised-base-active); } + &:hover { + [data-slot="list-item-extra-icon"] { + color: var(--icon-strong-base) !important; + } + } } } } diff --git a/packages/ui/src/components/list.tsx b/packages/ui/src/components/list.tsx index 3fbeb35f6..a7f2db9ef 100644 --- a/packages/ui/src/components/list.tsx +++ b/packages/ui/src/components/list.tsx @@ -4,6 +4,7 @@ import { FilteredListProps, useFilteredList } from "@opencode-ai/ui/hooks" import { Icon, IconProps } from "./icon" export interface ListProps<T> extends FilteredListProps<T> { + class?: string children: (item: T) => JSX.Element emptyMessage?: string onKeyEvent?: (event: KeyboardEvent, item: T | undefined) => void @@ -90,7 +91,7 @@ export function List<T>(props: ListProps<T> & { ref?: (ref: ListRef) => void }) }) return ( - <div ref={setScrollRef} data-component="list"> + <div ref={setScrollRef} data-component="list" classList={{ [props.class ?? ""]: !!props.class }}> <Show when={flat().length > 0} fallback={ |
