feat(ui): improve picker actions and directory attach

This commit is contained in:
Shantur Rathore
2026-02-13 22:52:42 +00:00
parent e9f281a69d
commit 1ef01da019
2 changed files with 143 additions and 69 deletions

View File

@@ -74,10 +74,12 @@ type PickerItem =
| { type: "file"; file: FileItem }
| { type: "command"; command: SDKCommand }
export type PickerSelectAction = "click" | "tab" | "enter" | "shiftEnter"
interface UnifiedPickerProps {
open: boolean
mode?: "mention" | "command"
onSelect: (item: PickerItem) => void
onSelect: (item: PickerItem, action: PickerSelectAction) => void
onClose: () => void
agents: Agent[]
commands?: SDKCommand[]
@@ -356,7 +358,7 @@ const UnifiedPicker: Component<UnifiedPickerProps> = (props) => {
}
function handleSelect(item: PickerItem) {
props.onSelect(item)
props.onSelect(item, "click")
}
function handleKeyDown(e: KeyboardEvent) {
@@ -379,7 +381,8 @@ const UnifiedPicker: Component<UnifiedPickerProps> = (props) => {
e.stopPropagation()
const selected = items[selectedIndex()]
if (selected) {
handleSelect(selected)
const action: PickerSelectAction = e.key === "Tab" ? "tab" : e.shiftKey ? "shiftEnter" : "enter"
props.onSelect(selected, action)
}
} else if (e.key === "Escape") {
e.preventDefault()
@@ -443,7 +446,7 @@ const UnifiedPicker: Component<UnifiedPickerProps> = (props) => {
<div
class={`dropdown-item ${isSelected() ? "dropdown-item-highlight" : ""}`}
data-picker-selected={isSelected()}
onClick={() => handleSelect({ type: "command", command })}
onClick={() => props.onSelect({ type: "command", command }, "click")}
>
<div class="flex items-start gap-2">
<svg class="dropdown-icon-accent h-4 w-4 mt-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@@ -479,7 +482,7 @@ const UnifiedPicker: Component<UnifiedPickerProps> = (props) => {
itemIndex === selectedIndex() ? "dropdown-item-highlight" : ""
}`}
data-picker-selected={itemIndex === selectedIndex()}
onClick={() => handleSelect({ type: "agent", agent })}
onClick={() => props.onSelect({ type: "agent", agent }, "click")}
>
<div class="flex items-start gap-2">
<svg
@@ -535,7 +538,7 @@ const UnifiedPicker: Component<UnifiedPickerProps> = (props) => {
itemIndex === selectedIndex() ? "dropdown-item-highlight" : ""
}`}
data-picker-selected={itemIndex === selectedIndex()}
onClick={() => handleSelect({ type: "file", file })}
onClick={() => props.onSelect({ type: "file", file }, "click")}
>
<div class="flex items-center gap-2 text-sm">
<Show