opencode-navigator 0.19.2 → 0.19.3

package/CHANGELOG.md

@@ -2,6 +2,11 @@
 
 ## Unreleased
 
+## [0.19.3] - 2026-10-03
+
+- Indent grouped Todo, Subagent, Skill, and MCP rows and align MCP server status indicators with their group headings.
+- Place Skill, MCP, and Quick Action bookmarks before item names. Reveal unselected bookmarks on hover or keyboard focus, keep favorites visible, and keep labels steady.
+
 ## [0.19.2] - 2026-10-02
 
 - Show MCP group connection states with the same radio-style indicators as individual servers, without Connect/Disconnect labels on group headings.
@@ -59,6 +64,7 @@
 
 Earlier release notes are available on [GitHub Releases](https://github.com/St1ggy/opencode-navigator/releases).
 
+[0.19.3]: https://github.com/St1ggy/opencode-navigator/compare/v0.19.2...v0.19.3
 [0.19.2]: https://github.com/St1ggy/opencode-navigator/compare/v0.19.1...v0.19.2
 [0.19.1]: https://github.com/St1ggy/opencode-navigator/compare/v0.19.0...v0.19.1
 [0.19.0]: https://github.com/St1ggy/opencode-navigator/compare/v0.18.2...v0.19.0

package/README.md

@@ -103,6 +103,12 @@ belong to each Skill's exact source path, so assignments survive when a Skill
 is absent from the current workspace. Filters and Search Everything also match
 group names; choosing a group heading never runs its Skills.
 
+Rows beneath group headings are indented in Todo, Subagents, Skills, and MCP.
+Skill, MCP, and Quick Action rows reserve a leading bookmark control: unselected
+bookmarks appear on hover or keyboard focus, while favorites stay visible.
+Labels do not shift when the control appears. MCP server status icons align with
+their group status icons, including when a server has an error detail control.
+
 ![Skill group manager](https://raw.githubusercontent.com/St1ggy/opencode-navigator/main/screenshots/38-skill-groups.png)
 
 Search Everything preserves one query across Skills, Subagents, MCP, and Actions:

package/dist/tui.js

@@ -3,7 +3,7 @@ import {insert as _$insert,setProp as _$setProp,createElement as _$createElement
 
 
 
-import {createSignal as createSignal2,createSignal,createEffect,onCleanup,createContext,useContext,createContext as createContext2,createSignal as createSignal3,useContext as useContext2,createEffect as createEffect2,splitProps,untrack,splitProps as splitProps2,For,createEffect as createEffect3,onCleanup as onCleanup2,Show,splitProps as splitProps3,createSignal as createSignal4,createSignal as createSignal5,createSignal as createSignal6,onCleanup as onCleanup3,batch,createSignal as createSignal8,createSignal as createSignal7,createEffect as createEffect4,createSignal as createSignal9,onCleanup as onCleanup4,createSignal as createSignal10,createSignal as createSignal11,Index,createSignal as createSignal12,onCleanup as onCleanup5,createEffect as createEffect6,onCleanup as onCleanup7,batch as batch2,createEffect as createEffect5,createMemo,createSignal as createSignal13,onCleanup as onCleanup6,onMount,For as For2,For as For3,Show as Show2,createMemo as createMemo2,Show as Show3,createSignal as createSignal14,onCleanup as onCleanup8,For as For4,For as For5,For as For8,createMemo as createMemo4,onMount as onMount3,For as For7,createMemo as createMemo3,onMount as onMount2,Show as Show5,createEffect as createEffect7,createSignal as createSignal15,onCleanup as onCleanup9,Show as Show4,For as For6,For as For9,createEffect as createEffect8,createMemo as createMemo5,onCleanup as onCleanup10,createEffect as createEffect9,createMemo as createMemo6,untrack as untrack2,For as For10,createEffect as createEffect10,createMemo as createMemo9,onCleanup as onCleanup11,onMount as onMount4,createMemo as createMemo7,createMemo as createMemo8,Show as Show6,onCleanup as onCleanup12,createEffect as createEffect11,onCleanup as onCleanup13,createSignal as createSignal16,createEffect as createEffect12,onCleanup as onCleanup14,onMount as onMount5,onCleanup as onCleanup15,onMount as onMount6,For as For11,createSignal as createSignal17,createSignal as createSignal18,Show as Show7,createSignal as createSignal20,createSignal as createSignal19,onCleanup as onCleanup16,For as For12,Show as Show10,createMemo as createMemo11,createComputed,createMemo as createMemo10,createSignal as createSignal21,untrack as untrack3,Show as Show8,createComputed as createComputed2,untrack as untrack4,Show as Show9,createEffect as createEffect13,createSignal as createSignal22,createMemo as createMemo13,createSignal as createSignal24,createMemo as createMemo12,For as For13,Show as Show14,Show as Show11,Show as Show12,Show as Show13,createSignal as createSignal23,onCleanup as onCleanup17,For as For14,Show as Show16,createMemo as createMemo15,Show as Show15,createMemo as createMemo14,createSignal as createSignal25,createEffect as createEffect14,onCleanup as onCleanup18,For as For19,Match,Switch,createMemo as createMemo19,onCleanup as onCleanup22,For as For15,Show as Show17,createSignal as createSignal26,createEffect as createEffect15,createMemo as createMemo16,onCleanup as onCleanup19,untrack as untrack5,For as For17,Show as Show20,createEffect as createEffect16,createMemo as createMemo17,createSignal as createSignal27,onCleanup as onCleanup20,untrack as untrack6,For as For16,Show as Show19,Show as Show18,Show as Show24,createEffect as createEffect17,createMemo as createMemo18,createSignal as createSignal28,onCleanup as onCleanup21,untrack as untrack7,For as For18,Show as Show22,Show as Show21,Show as Show23,createEffect as createEffect18,createMemo as createMemo20,onCleanup as onCleanup23,untrack as untrack8,Show as Show25,createMemo as createMemo21,onCleanup as onCleanup24,createSignal as createSignal29,onCleanup as onCleanup25,onMount as onMount7} from "solid-js"
+import {createSignal as createSignal2,createSignal,createEffect,onCleanup,createContext,useContext,createContext as createContext2,createSignal as createSignal3,useContext as useContext2,createEffect as createEffect2,splitProps,untrack,splitProps as splitProps2,For,createEffect as createEffect3,onCleanup as onCleanup2,Show,splitProps as splitProps3,createSignal as createSignal4,createSignal as createSignal5,createSignal as createSignal6,onCleanup as onCleanup3,batch,createSignal as createSignal8,createSignal as createSignal7,createEffect as createEffect4,createSignal as createSignal9,onCleanup as onCleanup4,createSignal as createSignal10,createSignal as createSignal11,Index,createSignal as createSignal12,onCleanup as onCleanup5,createEffect as createEffect6,onCleanup as onCleanup7,batch as batch2,createEffect as createEffect5,createMemo,createSignal as createSignal13,onCleanup as onCleanup6,onMount,For as For2,For as For3,Show as Show2,createMemo as createMemo2,Show as Show3,createSignal as createSignal14,onCleanup as onCleanup8,For as For4,For as For5,For as For8,createMemo as createMemo4,onMount as onMount3,For as For7,createMemo as createMemo3,onMount as onMount2,Show as Show5,createEffect as createEffect7,createSignal as createSignal15,onCleanup as onCleanup9,Show as Show4,For as For6,For as For9,createEffect as createEffect8,createMemo as createMemo5,onCleanup as onCleanup10,createEffect as createEffect9,createMemo as createMemo6,untrack as untrack2,For as For10,createEffect as createEffect10,createMemo as createMemo9,onCleanup as onCleanup11,onMount as onMount4,createMemo as createMemo7,createMemo as createMemo8,Show as Show6,onCleanup as onCleanup12,createEffect as createEffect11,onCleanup as onCleanup13,createSignal as createSignal16,createEffect as createEffect12,onCleanup as onCleanup14,onMount as onMount5,onCleanup as onCleanup15,onMount as onMount6,For as For11,createSignal as createSignal17,createSignal as createSignal18,Show as Show7,createSignal as createSignal20,createSignal as createSignal19,onCleanup as onCleanup16,For as For12,Show as Show10,createMemo as createMemo11,createComputed,createMemo as createMemo10,createSignal as createSignal21,untrack as untrack3,Show as Show8,createComputed as createComputed2,untrack as untrack4,Show as Show9,createEffect as createEffect13,createSignal as createSignal22,createMemo as createMemo13,createSignal as createSignal25,createMemo as createMemo12,For as For13,Show as Show14,Show as Show11,Show as Show12,createSignal as createSignal23,createContext as createContext3,useContext as useContext3,Show as Show13,createSignal as createSignal24,onCleanup as onCleanup17,For as For14,Show as Show16,createMemo as createMemo15,Show as Show15,createMemo as createMemo14,createSignal as createSignal26,createEffect as createEffect14,onCleanup as onCleanup18,For as For19,Match,Switch,createMemo as createMemo19,onCleanup as onCleanup22,For as For15,Show as Show17,createSignal as createSignal27,createEffect as createEffect15,createMemo as createMemo16,onCleanup as onCleanup19,untrack as untrack5,For as For17,Show as Show20,createEffect as createEffect16,createMemo as createMemo17,createSignal as createSignal28,onCleanup as onCleanup20,untrack as untrack6,For as For16,Show as Show19,Show as Show18,Show as Show24,createEffect as createEffect17,createMemo as createMemo18,createSignal as createSignal29,onCleanup as onCleanup21,untrack as untrack7,For as For18,Show as Show22,Show as Show21,Show as Show23,createEffect as createEffect18,createMemo as createMemo20,onCleanup as onCleanup23,untrack as untrack8,Show as Show25,createMemo as createMemo21,onCleanup as onCleanup24,createSignal as createSignal30,onCleanup as onCleanup25,onMount as onMount7} from "solid-js"
 var SIDEBAR_SECTIONS=["todo","subagents","skills","quick_actions","lsp","mcp"]
 var QUICK_ACTION_IDS=["session.rename","session.timeline","session.copy","session.export","session.compact","session.list","session.new","session.fork","messages.copy","session.first","session.last","session.messages_last_user","session.message.next","session.message.previous","permission.mode"]
 function preferencesScope(path){return path.worktree||path.directory||"global"
@@ -846,6 +846,7 @@ return _el$
 
 
 
+
 function IconControl(props){function mouseOver(event){props.onMouseOver?.()
 event.stopPropagation()
 }
@@ -873,7 +874,7 @@ function BookmarkControl(props){const icons=useIcons()
 return _$createComponent(IconControl,{ref(r$){var _ref$=props.ref
 typeof _ref$==="function"?_ref$(r$):props.ref=r$
 },get id(){return props.id
-},get icon(){return icons.icon(props.bookmarked?"bookmark":"bookmarkEmpty")
+},get icon(){return _$memo(()=>props.visible?.()===false)()?" ":icons.icon(props.bookmarked?"bookmark":"bookmarkEmpty")
 },get backgroundColor(){return props.backgroundColor
 },get foregroundColor(){return props.foregroundColor
 },get onMouseOver(){return props.onMouseOver
@@ -5808,7 +5809,7 @@ const item=useSidebarItem(props.api,props.interaction,{id:id(),position:()=>prop
 })
 return _$createComponent(SelectionBox,{ref:(node)=>item.ref(node),get id(){return id()
 },height:1,get marginTop(){return props.marginTop
-},flexDirection:"row",justifyContent:"space-between",gap:1,get backgroundColor(){return item.backgroundColor()
+},flexDirection:"row",justifyContent:"space-between",gap:1,paddingRight:1,get backgroundColor(){return item.backgroundColor()
 },get onMouseOver(){return item.onMouseOver
 },get onMouseOut(){return item.onMouseOut
 },onMouseUp:(event)=>{event.stopPropagation()
@@ -5905,25 +5906,70 @@ return _el$8
 return _el$5
 })()
 }
-function McpRow(props){const icons=useIcons()
-const dialogs=useDialogs(props.api)
-const theme=()=>props.api.theme.current
+
+
+
+function createSidebarBookmark(input){const{api,interaction,row,position,favorite,disabled,onToggle
+}=input
+const id=`${input.id}.favorite`
+const [rowHovered,setRowHovered]=createSignal23(false)
+const [controlHovered,setControlHovered]=createSignal23(false)
+const control=useSidebarItem(api,interaction,{id,position:()=>({...position(),column:0
+}),disabled,activate:()=>{onToggle()
+queueMicrotask(()=>interaction?.select(id))
+}},()=>api.theme.current.warning,"control")
+const visible=()=>favorite()||row.focused()||control.focused()||rowHovered()||controlHovered()
+return{onRowOver:()=>{row.onMouseOver()
+setRowHovered(true)
+},onRowOut:()=>{row.onMouseOut()
+setRowHovered(false)
+},render:()=>_$createComponent(BookmarkControl,{ref:(node)=>control.ref(node),id,get bookmarked(){return favorite()
+},visible,get backgroundColor(){return _$memo(()=>control.backgroundColor()==="transparent")()?row.backgroundColor():control.backgroundColor()
+},get foregroundColor(){return _$memo(()=>!!row.focused())()?row.foregroundColor():control.foregroundColor()
+},onMouseOver:()=>{control.onMouseOver()
+setControlHovered(true)
+},onMouseOut:()=>{control.onMouseOut()
+setControlHovered(false)
+},onMouseUp:(event)=>control.activate(event)
+})
+}}
+
+
+
+
+
+
+var Context=createContext3()
+function useSidebarList(){const value=useContext3(Context)
+if(!value)
+throw new Error("No sidebar list")
+return value
+}
+function SidebarRowList(props){return _$createComponent(Context.Provider,{get value(){return{api:props.api,interaction:props.interaction,grouped:props.grouped??(()=>false)
+}},get children(){var _el$=_$createElement("box")
+_$insert(_el$,()=>props.children)
+_$effect((_$p)=>_$setProp(_el$,"gap",props.density==="comfortable"?1:0,_$p))
+return _el$
+}})
+}
+function McpRow(props){const{api,interaction,grouped
+}=useSidebarList()
+const icons=useIcons()
+const dialogs=useDialogs(api)
+const theme=()=>api.theme.current
 const busy=()=>props.state.status==="loading"||props.state.status==="refreshing"
 const error=()=>props.state.error
 const disabled=()=>props.disabled||busy()
 const id=()=>`${PLUGIN_ID}.mcp.${props.item.name}`
-const row=useSidebarItem(props.api,props.interaction,{id:id(),position:()=>({...props.position,column:0
+const row=useSidebarItem(api,interaction,{id:id(),position:()=>({...props.position,column:1
 }),disabled,activate:props.onToggle
 })
-const bookmark=useSidebarItem(props.api,props.interaction,{id:`${id()}.favorite`,position:()=>({...props.position,column:2
-}),disabled:()=>props.favoriteDisabled,activate:()=>{props.onToggleFavorite()
-queueMicrotask(()=>props.interaction?.select(`${id()}.favorite`))
-}},()=>theme().warning,"control")
-const info=useSidebarItem(props.api,props.interaction,{id:`${id()}.info`,position:()=>({...props.position,column:1
+const bookmark=createSidebarBookmark({api,interaction,id:id(),position:()=>props.position,row,favorite:()=>props.favorite,disabled:()=>props.favoriteDisabled,onToggle:props.onToggleFavorite
+})
+const info=useSidebarItem(api,interaction,{id:`${id()}.info`,position:()=>({...props.position,column:2
 }),activate:()=>{if(!props.item.error)
 return
-dialogs.open(()=>_$createComponent(McpErrorDialog,{get api(){return props.api
-},get name(){return props.item.name
+dialogs.open(()=>_$createComponent(McpErrorDialog,{api,get name(){return props.item.name
 },get status(){return props.item.status
 },get error(){return props.item.error
 }}),"medium")
@@ -5931,12 +5977,14 @@ dialogs.open(()=>_$createComponent(McpErrorDialog,{get api(){return props.api
 const nestedBackground=(background)=>background==="transparent"?row.backgroundColor():background
 return _$createComponent(ListRow,{ref:(node)=>row.ref(node),get id(){return id()
 },get backgroundColor(){return row.backgroundColor()
-},paddingLeft:1,paddingRight:1,get paddingTop(){return error()?1:0
+},get paddingLeft(){return grouped()?0:1
+},paddingRight:1,contentGap:0,get paddingTop(){return error()?1:0
 },get paddingBottom(){return error()?1:0
 },get marginTop(){return props.separator?1:0
-},get onMouseOver(){return row.onMouseOver
-},get onMouseOut(){return row.onMouseOut
-},onMouseDown:(event)=>row.activate(event),get content(){return(()=>{var _el$=_$createElement("text")
+},get onMouseOver(){return bookmark.onRowOver
+},get onMouseOut(){return bookmark.onRowOut
+},onMouseDown:(event)=>row.activate(event),get leading(){return bookmark.render()
+},get content(){return(()=>{var _el$=_$createElement("text")
 _$setProp(_el$,"flexGrow",1)
 _$setProp(_el$,"wrapMode","none")
 _$insert(_el$,()=>props.item.name)
@@ -5948,8 +5996,6 @@ _$insertNode(_el$2,_el$3)
 _$setProp(_el$2,"flexDirection","row")
 _$setProp(_el$2,"flexShrink",0)
 _$setProp(_el$2,"gap",1)
-_$insertNode(_el$3,_el$4)
-_$insert(_el$4,()=>icons.icon(mcpToggle(props.item.status,busy())))
 _$insert(_el$2,(()=>{var _c$=_$memo(()=>!!props.item.error)
 return()=>_c$()?_$createComponent(IconControl,{ref:(node)=>info.ref(node),get id(){return `${id()}.info`
 },get icon(){return icons.icon("info")
@@ -5959,21 +6005,13 @@ return()=>_c$()?_$createComponent(IconControl,{ref:(node)=>info.ref(node),get id
 },get onMouseOut(){return info.onMouseOut
 },onMouseUp:(event)=>info.activate(event)
 }):null
-})(),null)
-_$insert(_el$2,_$createComponent(BookmarkControl,{ref:(node)=>bookmark.ref(node),get id(){return `${id()}.favorite`
-},get bookmarked(){return props.favorite
-},get backgroundColor(){return nestedBackground(bookmark.backgroundColor())
-},get foregroundColor(){return _$memo(()=>!!row.focused())()?row.foregroundColor():bookmark.foregroundColor()
-},get onMouseOver(){return bookmark.onMouseOver
-},get onMouseOut(){return bookmark.onMouseOut
-},onMouseUp:(event)=>bookmark.activate(event)
-}),null)
-_$effect((_$p)=>_$setProp(_el$3,"fg",row.focused()?row.foregroundColor():mcpColor(props.api,props.item.status),_$p))
+})(),_el$3)
+_$insertNode(_el$3,_el$4)
+_$insert(_el$4,()=>icons.icon(mcpToggle(props.item.status,busy())))
+_$effect((_$p)=>_$setProp(_el$3,"fg",row.focused()?row.foregroundColor():mcpColor(api,props.item.status),_$p))
 return _el$2
 })()
-},get details(){return _$createComponent(RequestErrorRow,{get api(){return props.api
-},get interaction(){return props.interaction
-},get id(){return `${id()}.retry`
+},get details(){return _$createComponent(RequestErrorRow,{api,interaction,get id(){return `${id()}.retry`
 },get position(){return{...props.position,row:props.position.row + 1,column:0
 }},get state(){return props.state
 },get onRetry(){return props.onRetry
@@ -5991,7 +6029,7 @@ return _el$2
 function SectionFilter(props){const icons=useIcons()
 let input
 let unregisterInput
-const [inputFocused,setInputFocused]=createSignal23(false)
+const [inputFocused,setInputFocused]=createSignal24(false)
 const theme=()=>props.api.theme.current
 const item=useSidebarItem(props.api,props.interaction,{id:props.id??`filter.${props.placeholder}`,position:()=>props.position??{section:0,row:0,column:0
 },activate:()=>{if(!input)
@@ -6060,16 +6098,6 @@ return _el$3
 }})]
 }})
 }
-
-
-
-
-function SidebarRowList(props){return(()=>{var _el$=_$createElement("box")
-_$insert(_el$,()=>props.children)
-_$effect((_$p)=>_$setProp(_el$,"gap",props.density==="comfortable"?1:0,_$p))
-return _el$
-})()
-}
 function McpSectionContent(props){const model=props.model
 return _$createComponent(SectionRequestBody,{get api(){return props.api
 },get interaction(){return props.interaction
@@ -6095,7 +6123,10 @@ _$insertNode(_el$2,_$createTextNode(`No matching MCP servers`))
 _$effect((_$p)=>_$setProp(_el$2,"fg",props.api.theme.current.textMuted,_$p))
 return _el$2
 })()
-},get children(){return [_$createComponent(SidebarRowList,{get density(){return props.preferences.rowDensity?.()??"compact"
+},get children(){return [_$createComponent(SidebarRowList,{get api(){return props.api
+},get interaction(){return props.interaction
+},get grouped(){return model.grouped
+},get density(){return props.preferences.rowDensity?.()??"compact"
 },get children(){return _$createComponent(For13,{get each(){return model.visibility.visible()
 },children:(item,index)=>[_$createComponent(Show14,{get when(){return _$memo(()=>!!model.grouped())()&&(index()===0||model.visibility.visible()[index()-1]?.bucket!==item.bucket)
 },get children(){return _$createComponent(McpGroupHeader,{get api(){return props.api
@@ -6108,9 +6139,7 @@ return _el$2
 },get position(){return{section:props.navigationSection,row:9 + index()*3,column:0
 }},onToggle:()=>void props.controller.toggleGroup(item.bucket,model.groupNames(item.bucket),model.target())
 })
-}}),_$createComponent(McpRow,{get api(){return props.api
-},get interaction(){return props.interaction
-},item,get position(){return{section:props.navigationSection,row:10 + index()*3,column:0
+}}),_$createComponent(McpRow,{item,get position(){return{section:props.navigationSection,row:10 + index()*3,column:0
 }},get state(){return props.controller.serverState(item.name,model.target())
 },get disabled(){return model.bulkRunning()
 },onToggle:()=>void props.controller.toggle(item.name).catch(()=>{}),onRetry:()=>void props.controller.retryServer(item.name,model.target())?.catch(()=>{}),get favorite(){return model.favorites().has(item.name)
@@ -6130,7 +6159,7 @@ return _el$
 }})
 }
 function McpSection(props){const icons=useIcons()
-const [query,setQuery]=createSignal24("")
+const [query,setQuery]=createSignal25("")
 const model=createMcpSectionModel(props,query)
 const navigationSection=()=>props.navigationSection??6
 const summary=createMemo13(()=>`${model.active()}/${model.list().length}${model.errors() ? ` \xB7 ${model.errors()} ${icons.icon("error")}` : ""}`)
@@ -6165,48 +6194,46 @@ return _$createComponent(SectionWithHeaderAction,{get api(){return props.api
 
 
 
-function QuickActionRow(props){const icons=useIcons()
-const theme=()=>props.api.theme.current
-const [width,setWidth]=createSignal25(0)
-const shortcut=createMemo14(()=>{const bindings=props.api.keymap.getCommandBindings({visibility:"registered",commands:[props.action.command]
+function QuickActionRow(props){const{api,interaction
+}=useSidebarList()
+const icons=useIcons()
+const theme=()=>api.theme.current
+const [width,setWidth]=createSignal26(0)
+const shortcut=createMemo14(()=>{const bindings=api.keymap.getCommandBindings({visibility:"registered",commands:[props.action.command]
 })
-return props.api.keys.formatBindings(bindings.get(props.action.command))
+return api.keys.formatBindings(bindings.get(props.action.command))
 })
 const visibleShortcut=createMemo14(()=>{const value=shortcut()
-return value&&width()>=Bun.stringWidth(props.action.label) + Bun.stringWidth(value) + 9?value:undefined
+return value&&width()>=Bun.stringWidth(props.action.label) + Bun.stringWidth(value) + 8?value:undefined
 })
 function run(){if(props.action.command==="session.new"&&props.onNewSession?.())
 return
-const result=props.interaction?props.interaction.dispatchFromReturnTarget(props.action.command):props.api.keymap.dispatchCommand(props.action.command)
+const result=interaction?interaction.dispatchFromReturnTarget(props.action.command):api.keymap.dispatchCommand(props.action.command)
 if(result.ok)
 return
-props.api.ui.toast({variant:"warning",title:props.action.label,message:`Command is ${result.reason}`,duration:3000
+api.ui.toast({variant:"warning",title:props.action.label,message:`Command is ${result.reason}`,duration:3000
 })
 }
 const id=()=>`${PLUGIN_ID}.quick-action.${props.action.command}`
-const row=useSidebarItem(props.api,props.interaction,{id:id(),position:()=>props.position,activate:run,disabled:()=>Boolean(props.disabled)
+const row=useSidebarItem(api,interaction,{id:id(),position:()=>({...props.position,column:1
+}),activate:run,disabled:()=>Boolean(props.disabled)
+})
+const bookmark=createSidebarBookmark({api,interaction,id:id(),position:()=>props.position,row,favorite:()=>props.favorite,disabled:()=>props.favoriteDisabled,onToggle:props.onToggleFavorite
 })
-const favorite=useSidebarItem(props.api,props.interaction,{id:`${id()}.favorite`,position:()=>({...props.position,column:1
-}),disabled:()=>props.favoriteDisabled,activate:()=>{props.onToggleFavorite()
-queueMicrotask(()=>props.interaction?.select(`${id()}.favorite`))
-}},()=>theme().warning,"control")
-const controlBackground=()=>{const background=favorite.backgroundColor()
-return background==="transparent"?row.backgroundColor():background
-}
 return _$createComponent(ListRow,{ref:(node)=>row.ref(node),get id(){return id()
 },paddingLeft:1,paddingRight:1,get marginTop(){return props.separator?1:0
 },onSizeChange:function(){setWidth(this.width)
 },get backgroundColor(){return row.backgroundColor()
-},get onMouseOver(){return row.onMouseOver
-},get onMouseOut(){return row.onMouseOut
+},get onMouseOver(){return bookmark.onRowOver
+},get onMouseOut(){return bookmark.onRowOut
 },onMouseUp:(event)=>{event.stopPropagation()
 row.activate(event)
-},get leading(){return(()=>{var _el$=_$createElement("text")
+},get leading(){return [_$memo(()=>bookmark.render()),(()=>{var _el$=_$createElement("text")
 _$setProp(_el$,"flexShrink",0)
 _$insert(_el$,()=>icons.action(props.action.command))
 _$effect((_$p)=>_$setProp(_el$,"fg",props.disabled?theme().textMuted:row.focused()?row.foregroundColor():theme().accent,_$p))
 return _el$
-})()
+})()]
 },get content(){return(()=>{var _el$2=_$createElement("text")
 _$setProp(_el$2,"flexGrow",1)
 _$setProp(_el$2,"wrapMode","none")
@@ -6232,14 +6259,6 @@ _$effect((_$p)=>_$setProp(_el$4,"fg",row.focused()?row.foregroundColor():theme()
 return _el$4
 })()
 })
-},get trailing(){return _$createComponent(BookmarkControl,{ref:(node)=>favorite.ref(node),get id(){return `${id()}.favorite`
-},get bookmarked(){return props.favorite
-},get backgroundColor(){return controlBackground()
-},get foregroundColor(){return _$memo(()=>!!row.focused())()?row.foregroundColor():favorite.foregroundColor()
-},get onMouseOver(){return favorite.onMouseOver
-},get onMouseOut(){return favorite.onMouseOut
-},onMouseUp:(event)=>favorite.activate(event)
-})
 }})
 }
 function QuickActionsSection(props){const commandRevision=createQuickActionRevision(props.api)
@@ -6257,16 +6276,16 @@ return _$createComponent(Section,{get api(){return props.api
 },sectionId:`${PLUGIN_ID}.section.quick_actions`,get navigationSection(){return navigationSection()
 },title:"QUICK ACTIONS",section:"quick_actions",get summary(){return String(actions().length)
 },get open(){return props.preferences.expanded().quick_actions
-},onToggle:()=>props.preferences.toggleSectionExpanded("quick_actions"),get children(){return [_$createComponent(SidebarRowList,{get density(){return props.preferences.rowDensity?.()??"compact"
+},onToggle:()=>props.preferences.toggleSectionExpanded("quick_actions"),get children(){return [_$createComponent(SidebarRowList,{get api(){return props.api
+},get interaction(){return props.interaction
+},get density(){return props.preferences.rowDensity?.()??"compact"
 },get children(){return [_$createComponent(Show16,{get when(){return actions().length===0
 },get children(){var _el$=_$createElement("text")
 _$insertNode(_el$,_$createTextNode(`No quick actions selected`))
 _$effect((_$p)=>_$setProp(_el$,"fg",props.api.theme.current.textMuted,_$p))
 return _el$
 }}),_$createComponent(For14,{get each(){return visibility.visible()
-},children:(action,index)=>_$createComponent(QuickActionRow,{get api(){return props.api
-},get interaction(){return props.interaction
-},get onNewSession(){return props.onNewSession
+},children:(action,index)=>_$createComponent(QuickActionRow,{get onNewSession(){return props.onNewSession
 },action,get disabled(){return action.disabled
 },get favorite(){return props.preferences.favoriteQuickActions?.().has(action.command)??false
 },get favoriteDisabled(){return _$memo(()=>!!props.preferences.ready)()?!props.preferences.ready():false
@@ -6445,49 +6464,36 @@ return{target,recent,grouped,list,filtered,visibility,state,useSkill,skillGroup}
 
 
 
-function SkillRow(props){const icons=useIcons()
-const theme=()=>props.api.theme.current
+function SkillRow(props){const{api,interaction,grouped
+}=useSidebarList()
+const icons=useIcons()
 const id=()=>`${PLUGIN_ID}.skill.${props.item.location || props.item.name}`
-const row=useSidebarItem(props.api,props.interaction,{id:id(),position:()=>({...props.position,column:0
+const row=useSidebarItem(api,interaction,{id:id(),position:()=>({...props.position,column:1
 }),activate:props.onUse
 })
-const favorite=useSidebarItem(props.api,props.interaction,{id:`${id()}.favorite`,position:()=>({...props.position,column:1
-}),disabled:()=>props.favoriteDisabled,activate:()=>{props.onToggleFavorite()
-queueMicrotask(()=>props.interaction?.select(`${id()}.favorite`))
-}},()=>theme().warning,"control")
-const controlBackground=()=>{const background=favorite.backgroundColor()
-return background==="transparent"?row.backgroundColor():background
-}
+const bookmark=createSidebarBookmark({api,interaction,id:id(),position:()=>props.position,row,favorite:()=>props.favorite,disabled:()=>props.favoriteDisabled,onToggle:props.onToggleFavorite
+})
 return _$createComponent(ListRow,{ref:(node)=>row.ref(node),get id(){return id()
-},paddingLeft:1,paddingRight:1,get marginTop(){return props.separator?1:0
+},get paddingLeft(){return grouped()?0:1
+},paddingRight:1,contentGap:0,get marginTop(){return props.separator?1:0
 },get backgroundColor(){return row.backgroundColor()
-},get onMouseOver(){return row.onMouseOver
-},get onMouseOut(){return row.onMouseOut
-},onMouseUp:(event)=>row.activate(event),get leading(){return(()=>{var _el$=_$createElement("text")
-_$setProp(_el$,"flexShrink",0)
-_$insert(_el$,()=>icons.icon(props.recent?"recent":"skills"))
-_$effect((_$p)=>_$setProp(_el$,"fg",row.focused()?row.foregroundColor():theme().accent,_$p))
+},get onMouseOver(){return bookmark.onRowOver
+},get onMouseOut(){return bookmark.onRowOut
+},onMouseUp:(event)=>row.activate(event),get leading(){return bookmark.render()
+},get content(){return(()=>{var _el$=_$createElement("text")
+_$setProp(_el$,"flexGrow",1)
+_$setProp(_el$,"wrapMode","word")
+_$insert(_el$,(()=>{var _c$=_$memo(()=>!!props.recent)
+return()=>_c$()?`${icons.icon("recent")} `:""
+})(),null)
+_$insert(_el$,()=>props.item.name,null)
+_$effect((_$p)=>_$setProp(_el$,"fg",row.foregroundColor(),_$p))
 return _el$
 })()
-},get content(){return(()=>{var _el$2=_$createElement("text")
-_$setProp(_el$2,"flexGrow",1)
-_$setProp(_el$2,"wrapMode","word")
-_$insert(_el$2,()=>props.item.name)
-_$effect((_$p)=>_$setProp(_el$2,"fg",row.foregroundColor(),_$p))
-return _el$2
-})()
-},get trailing(){return _$createComponent(BookmarkControl,{ref:(node)=>favorite.ref(node),get id(){return `${id()}.favorite`
-},get bookmarked(){return props.favorite
-},get backgroundColor(){return controlBackground()
-},get foregroundColor(){return _$memo(()=>!!row.focused())()?row.foregroundColor():favorite.foregroundColor()
-},get onMouseOver(){return favorite.onMouseOver
-},get onMouseOut(){return favorite.onMouseOut
-},onMouseUp:(event)=>favorite.activate(event)
-})
 }})
 }
 function SkillsSection(props){const dialogs=useDialogs(props.api)
-const [query,setQuery]=createSignal26("")
+const [query,setQuery]=createSignal27("")
 const model=createSkillSectionModel(props,query)
 const navigationSection=()=>props.navigationSection??3
 function selectSkill(item){if(!props.preferences.shouldConfirmSkill(item)){model.useSkill(item)
@@ -6526,7 +6532,10 @@ _$insertNode(_el$2,_$createTextNode(`No matching skills`))
 _$effect((_$p)=>_$setProp(_el$2,"fg",props.api.theme.current.textMuted,_$p))
 return _el$2
 })()
-},get children(){return [_$createComponent(SidebarRowList,{get density(){return props.preferences.rowDensity?.()??"compact"
+},get children(){return [_$createComponent(SidebarRowList,{get api(){return props.api
+},get interaction(){return props.interaction
+},get grouped(){return model.grouped
+},get density(){return props.preferences.rowDensity?.()??"compact"
 },get children(){return _$createComponent(For15,{get each(){return model.visibility.visible()
 },children:(item,index)=>[_$createComponent(Show17,{get when(){return _$memo(()=>!!model.grouped())()&&(index()===0||model.visibility.visible()[index()-1]?.bucket!==item.bucket)
 },get children(){var _el$4=_$createElement("text")
@@ -6541,9 +6550,7 @@ return _p$
 },{e:undefined,t:undefined
 })
 return _el$4
-}}),_$createComponent(SkillRow,{get api(){return props.api
-},get interaction(){return props.interaction
-},item,get position(){return{section:navigationSection(),row:10 + index()*(model.grouped()?2:1),column:0
+}}),_$createComponent(SkillRow,{item,get position(){return{section:navigationSection(),row:10 + index()*(model.grouped()?2:1),column:0
 }},onUse:()=>selectSkill(item),get recent(){return model.recent().has(item.location)
 },get favorite(){return props.preferences.isFavoriteSkill?.(item)??false
 },get favoriteDisabled(){return props.preferences.ready?.()===false
@@ -6575,8 +6582,8 @@ return _el$
 function createSubagentSectionModel(props){const list=createMemo17(()=>props.controller.list(props.sessionID))
 const recent=createMemo17(()=>props.controller.recent?.(props.sessionID)??[])
 const rows=createMemo17(()=>buildSubagentView(list(),recent()))
-const [query,setQuery]=createSignal27("")
-const [mode,setMode]=createSignal27("all")
+const [query,setQuery]=createSignal28("")
+const [mode,setMode]=createSignal28("all")
 const counts=createMemo17(()=>countSubagentView(rows(),query()))
 const tabs=createMemo17(()=>["all","active","recent",...counts().errors>0?["errors"]:[]])
 const filtered=createMemo17(()=>filterSubagentView(rows(),mode(),query()))
@@ -6620,18 +6627,20 @@ return{list,recent,rows,query,setQuery,mode,setMode,counts,tabs,filtered,parentI
 
 
 
-function SubagentRow(props){const icons=useIcons()
-const theme=()=>props.api.theme.current
+function SubagentRow(props){const{api,interaction
+}=useSidebarList()
+const icons=useIcons()
+const theme=()=>api.theme.current
 const retrying=()=>props.item.status.type==="retry"
 const idle=()=>props.item.status.type==="idle"
 const failed=()=>props.item.run?.outcome==="error"
 const cancelled=()=>props.item.run?.outcome==="cancelled"
 const id=()=>`${PLUGIN_ID}.subagent.${props.item.session.id}`
-const row=useSidebarItem(props.api,props.interaction,{id:id(),position:()=>props.position,activate:props.onOpen
+const row=useSidebarItem(api,interaction,{id:id(),position:()=>props.position,activate:props.onOpen
 })
 const leadingColor=()=>row.focused()?row.foregroundColor():failed()?theme().error:retrying()||props.item.unavailable?theme().warning:idle()?theme().textMuted:theme().primary
 return _$createComponent(ListRow,{ref:(node)=>row.ref(node),get id(){return id()
-},paddingLeft:1,paddingRight:1,get backgroundColor(){return row.backgroundColor()
+},paddingLeft:2,paddingRight:1,get backgroundColor(){return row.backgroundColor()
 },get onMouseOver(){return row.onMouseOver
 },get onMouseOut(){return row.onMouseOut
 },onMouseDown:(event)=>row.activate(event),get leading(){return(()=>{var _el$=_$createElement("text")
@@ -6688,7 +6697,9 @@ return _el$8
 }})]
 }})
 }
-function SubagentList(props){return _$createComponent(SidebarRowList,{get density(){return props.density
+function SubagentList(props){return _$createComponent(SidebarRowList,{get api(){return props.api
+},get interaction(){return props.interaction
+},get density(){return props.density
 },get children(){return _$createComponent(For16,{get each(){return props.ids
 },children:(id,index)=>{const initial=props.itemById(id)
 const item=()=>props.itemById(id)??initial
@@ -6701,9 +6712,7 @@ _$insert(_el$3,()=>item().group)
 _$effect((_$p)=>_$setProp(_el$2,"fg",props.api.theme.current.textMuted,_$p))
 return _el$2
 }}),null)
-_$insert(_el$,_$createComponent(SubagentRow,{get api(){return props.api
-},get interaction(){return props.interaction
-},get item(){return item()
+_$insert(_el$,_$createComponent(SubagentRow,{get item(){return item()
 },get now(){return props.now
 },get position(){return{section:props.navigationSection,row:10 + index(),column:0
 }},onOpen:()=>props.controller.open(id)
@@ -6808,8 +6817,10 @@ return _el$
 
 
 
-function TodoRow(props){const icons=useIcons()
-const theme=()=>props.api.theme.current
+function TodoRow(props){const{api
+}=useSidebarList()
+const icons=useIcons()
+const theme=()=>api.theme.current
 const done=()=>props.item.status==="completed"
 const active=()=>props.item.status==="in_progress"
 const cancelled=()=>props.item.status==="cancelled"
@@ -6832,6 +6843,7 @@ _$insertNode(_el$,_el$2)
 _$insertNode(_el$,_el$3)
 _$setProp(_el$,"flexDirection","row")
 _$setProp(_el$,"gap",1)
+_$setProp(_el$,"paddingLeft",2)
 _$setProp(_el$2,"flexShrink",0)
 _$insert(_el$2,()=>icons.icon(done()?"done":active()?"busy":cancelled()?"close":"idle"))
 _$setProp(_el$3,"flexGrow",1)
@@ -6877,7 +6889,9 @@ _$insert(_el$,_$createComponent(Show22,{get when(){return props.view.rows.length
 },get fallback(){return _$createComponent(EmptyTodo,{get api(){return props.api
 },get mode(){return props.mode
 }})
-},get children(){return _$createComponent(SidebarRowList,{get density(){return props.density
+},get children(){return _$createComponent(SidebarRowList,{get api(){return props.api
+},get interaction(){return props.interaction
+},get density(){return props.density
 },get children(){return _$createComponent(For18,{get each(){return props.visibility.visible()
 },children:(row,index)=>{const startsGroup=()=>index()===0||props.visibility.visible()[index()-1].group!==row.group
 return(()=>{var _el$3=_$createElement("box")
@@ -6888,8 +6902,7 @@ _$insert(_el$5,()=>row.group)
 _$effect((_$p)=>_$setProp(_el$4,"fg",props.api.theme.current.textMuted,_$p))
 return _el$4
 }}),null)
-_$insert(_el$3,_$createComponent(TodoRow,{get api(){return props.api
-},get item(){return row.item
+_$insert(_el$3,_$createComponent(TodoRow,{get item(){return row.item
 }}),null)
 _$effect((_$p)=>_$setProp(_el$3,"marginTop",index()>0&&startsGroup()?1:0,_$p))
 return _el$3
@@ -6944,7 +6957,7 @@ function TodoSection(props){const list=createMemo18(()=>props.controller.list(pr
 const icons=useIcons()
 const unavailable=()=>hostCapabilityUnavailable(props.api,"todo")
 const managed=()=>("guidance" in props.controller)?props.controller:undefined
-const [mode,setMode]=createSignal28("all")
+const [mode,setMode]=createSignal29("all")
 const targetKey=createMemo18(()=>props.controller.target?.(props.sessionID).key??props.sessionID)
 createEffect17(()=>{targetKey()
 setMode("all")
@@ -7262,7 +7275,7 @@ return false
 }
 function enabled(value){return typeof value==="function"?value():value!==false
 }
-function createV2Keymap(context){const [revision,setRevision]=createSignal29(0)
+function createV2Keymap(context){const [revision,setRevision]=createSignal30(0)
 const layers=new Map
 let sequence=0
 function layerActive(layer){const mode=layer.mode??"base"
@@ -7555,7 +7568,7 @@ api.slots.register({order:100,slots:{app(){return _$createComponent(IconProvider
 },interaction,skills,subagents,mcp
 }),_$createComponent(FirstRunWizardPersistence,{api,preferences
 }),_$createComponent(StartupSessionBinding,{api,controller:startup
-}),_$createComponent(UpgradeNotesBinding,{api,preferences,version:"0.19.2"
+}),_$createComponent(UpgradeNotesBinding,{api,preferences,version:"0.19.3"
 }),_$createComponent(McpPersistence,{api,controller:mcp
 })]
 }})
@@ -7585,12 +7598,12 @@ throw result.error
 }
 return result.data?.type==="text"?result.data.content:undefined
 })
-const versionStatus=createVersionStatus(api,"0.19.2")
-const versionUpdates=createVersionUpdateActions(api,versionStatus,createOpenCodeV1VersionUpdater(api,meta),()=>preferences.rememberNavigatorVersionBeforeUpdate("0.19.2"))
+const versionStatus=createVersionStatus(api,"0.19.3")
+const versionUpdates=createVersionUpdateActions(api,versionStatus,createOpenCodeV1VersionUpdater(api,meta),()=>preferences.rememberNavigatorVersionBeforeUpdate("0.19.3"))
 api.slots.register({order:90,slots:{sidebar_footer(_context,props){return _$createComponent(IconProvider,{get style(){return preferences.lspIconStyle
 },get multilineCorners(){return preferences.cornerFont
 },get children(){return _$createComponent(VersionFooter,{api,get sessionID(){return props.session_id
-},navigatorVersion:"0.19.2",status:versionStatus,get onOpenCodeUpdate(){return versionUpdates.openCode
+},navigatorVersion:"0.19.3",status:versionStatus,get onOpenCodeUpdate(){return versionUpdates.openCode
 },get onNavigatorUpdate(){return versionUpdates.navigator
 }})
 }})
@@ -7604,15 +7617,15 @@ return
 return new TextDecoder().decode(await context.client.file.read({location:context.location,path:".opencode/navigator.json"
 }))
 },todo)
-const versionStatus=createVersionStatus(adapter.api,"0.19.2")
-const versionUpdates=createVersionUpdateActions(adapter.api,versionStatus,createOpenCodeV2VersionUpdater(context),()=>preferences.rememberNavigatorVersionBeforeUpdate("0.19.2"))
+const versionStatus=createVersionStatus(adapter.api,"0.19.3")
+const versionUpdates=createVersionUpdateActions(adapter.api,versionStatus,createOpenCodeV2VersionUpdater(context),()=>preferences.rememberNavigatorVersionBeforeUpdate("0.19.3"))
 const disposeFooter=context.ui.slot({append:"sidebar.footer",render:()=>_$createComponent(IconProvider,{get style(){return preferences.lspIconStyle
 },get multilineCorners(){return preferences.cornerFont
 },get children(){var _el$=_$createElement("box")
 _$setProp(_el$,"flexDirection","row")
 _$setProp(_el$,"justifyContent","space-between")
 _$insert(_el$,_$createComponent(VersionSummary,{get api(){return adapter.api
-},navigatorVersion:"0.19.2",status:versionStatus,get onOpenCodeUpdate(){return versionUpdates.openCode
+},navigatorVersion:"0.19.3",status:versionStatus,get onOpenCodeUpdate(){return versionUpdates.openCode
 },get onNavigatorUpdate(){return versionUpdates.navigator
 }}),null)
 _$insert(_el$,_$createComponent(SettingsFooterButton,{get api(){return adapter.api

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "opencode-navigator",
-  "version": "0.19.2",
+  "version": "0.19.3",
   "description": "Search, navigate, and manage OpenCode sessions from the TUI",
   "type": "module",
   "packageManager": "bun@1.4.2",