opencode-navigator 0.23.0 → 0.24.0

package/dist/toolbar-settings.js

@@ -1,11 +1,21 @@
 import"./chunk-bv0nm1tj.js"
 import"./chunk-v6bz59xn.js";
-import {createComponent as _$createComponent4} from "@opentui/solid"
-import {mergeProps as _$mergeProps} from "@opentui/solid"
-import {memo as _$memo3} from "@opentui/solid"
+import {createComponent as _$createComponent7} from "@opentui/solid"
+import {mergeProps as _$mergeProps2} from "@opentui/solid"
+import {memo as _$memo5} from "@opentui/solid"
 import {createSignal} from "solid-js"
 function toolbarPinKey(pin){return pin.kind==="action"?`action:${pin.id}`:`skill:${pin.location}`
 }
+function validToolbarPinText(text){return text.length<=128&&[...text].every((character)=>{const point=character.codePointAt(0)??0
+return point>=32&&point!==127&&point!==8232&&point!==8233
+})
+}
+function toolbarPinIcons(pin,state){if(state&&pin.stateIconLists?.[state])
+return pin.stateIconLists[state]
+if(state&&pin.stateIcons?.[state])
+return [pin.stateIcons[state]]
+return pin.icons??[pin.icon]
+}
 import {createDialogStack} from "./tui.js"
 import {createComponent as _$createComponent2} from "@opentui/solid"
 import {createEffect,onCleanup,untrack} from "solid-js"
@@ -72,7 +82,7 @@ if(!pin){dialogs.back()
 return
 }
 dialogs.open(()=>_$createComponent2(SelectionMenu2,{get api(){return props.api
-},title:"Toolbar button",options:[{title:"Configure icons\u2026",value:"configure",description:"Base and available state icons",icon:"edit"
+},title:"Toolbar button",options:[{title:"Configure icons and text\u2026",value:"configure",description:"Zero to three icons, optional text and state choices",icon:"edit"
 },{title:"Move up",value:"up",description:"Earlier in the toolbar",icon:"selected"
 },{title:"Move down",value:"down",description:"Later in the toolbar",icon:"selected"
 },{title:"Unpin",value:"remove",description:"Keep the original bookmark unchanged",icon:"delete"
@@ -89,73 +99,172 @@ dialogs.back()
 }}}))
 }})
 }
+import {mergeProps as _$mergeProps} from "@opentui/solid"
+import {createComponent as _$createComponent6} from "@opentui/solid"
+import {memo as _$memo4} from "@opentui/solid"
+import {quickActionStates as quickActionStates2} from "./tui.js"
+import {SelectionMenu as SelectionMenu5,terminalIcon as terminalIcon3,useIcons as useIcons3} from "./tui.js"
+import {setProp as _$setProp} from "@opentui/solid"
+import {effect as _$effect} from "@opentui/solid"
+import {createTextNode as _$createTextNode} from "@opentui/solid"
+import {insertNode as _$insertNode} from "@opentui/solid"
+import {createElement as _$createElement} from "@opentui/solid"
 import {createComponent as _$createComponent3} from "@opentui/solid"
 import {memo as _$memo2} from "@opentui/solid"
-import {quickActionStates} from "./tui.js"
-import {IconPicker,SelectionMenu as SelectionMenu3,terminalIcon,useDialogState,useDialogs as useDialogs2,useIcons} from "./tui.js"
-function ToolbarPinDialog(props){const dialogs=useDialogs2(props.api)
-const icons=useIcons()
-const [icon,setIcon]=useDialogState("pin-icon",props.pin.icon)
-const [states,setStates]=useDialogState("pin-states",{...props.pin.stateIcons
-})
+import {IconPicker,useDialogState,useDialogs as useDialogs2} from "./tui.js"
+function createToolbarPinDraft(props){const dialogs=useDialogs2(props.api)
+const initialStates=Object.fromEntries(Object.keys({...props.pin.stateIcons,...props.pin.stateIconLists
+}).map((state)=>[state,[...toolbarPinIcons(props.pin,state)]]))
+const [base,setBase]=useDialogState("pin-icons",[...toolbarPinIcons(props.pin)])
+const [text,setText]=useDialogState("pin-text",props.pin.text??"")
+const [states,setStates]=useDialogState("pin-state-groups",initialStates)
 const [sourceRoute]=useDialogState("pin-route",JSON.stringify(props.api.route.current))
 const [sourceTarget]=useDialogState("pin-target",props.skills?.target().key)
-const existing=()=>props.preferences.toolbarPins().find((pin)=>toolbarPinKey(pin)===toolbarPinKey(props.pin))
-function choose(state){dialogs.open(()=>_$createComponent3(IconPicker,{get api(){return props.api
-},get value(){return state?states()[state]??icon():icon()
-},onSelect:(id)=>{if(state)
-setStates((value)=>({...value,[state]:id
+const group=(state)=>state?states()[state]??base():base()
+const changeGroup=(value,state)=>{if(state)
+setStates((previous)=>({...previous,[state]:[...value]
 }))
 else
-setIcon(id)
+setBase([...value])
+}
+function choose(state){dialogs.open(()=>_$createComponent3(IconPicker,{get api(){return props.api
+},get value(){return group(state)[0]??"bolt"
+},onSelect:(id)=>{changeGroup([id,...group(state).slice(1)],state)
 dialogs.back()
 }}),"large")
 }
+function editText(){dialogs.prompt({title:"Toolbar button text",value:text(),description:()=>(()=>{var _el$=_$createElement("text")
+_$insertNode(_el$,_$createTextNode(`Optional single line, up to 128 characters. Leave empty for icons only.`))
+_$effect((_$p)=>_$setProp(_el$,"fg",props.api.theme.current.textMuted,_$p))
+return _el$
+})(),onConfirm(value){if(!validToolbarPinText(value))
+throw new Error("Use a single line of up to 128 characters")
+setText(value.trim())
+dialogs.back()
+}})
+}
 function save(){try{if(sourceRoute()!==JSON.stringify(props.api.route.current)||sourceTarget()!==props.skills?.target().key)
 throw new Error("Workspace or session changed; reopen pin configuration")
+if(!text()&&(base().length===0||Object.values(states()).some((value)=>value.length===0)))
+throw new Error("Add an icon or text for every configured appearance")
 const source=props.pin.kind==="skill"?props.pin.location:undefined
 if(!props.expected&&source&&!props.skills?.list().some((skill)=>skill.location===source))
 throw new Error("Skill source changed; choose it again")
-const pin={...props.pin,icon:icon(),stateIcons:states()
+const stateIcons=Object.fromEntries(Object.entries(states()).filter(([,value])=>value.length===1).map(([key,value])=>[key,value[0]]))
+const stateIconLists=Object.fromEntries(Object.entries(states()).filter(([,value])=>value.length!==1))
+const pin={...props.pin,icon:base()[0]??props.pin.icon,icons:base().length===1?undefined:base(),text:text()||undefined,stateIcons,stateIconLists
 }
-props.preferences.changeToolbarPin(props.expected?{operation:"configure",key:toolbarPinKey(pin),icon:pin.icon,stateIcons:pin.stateIcons,expected:props.expected
+const keys=Object.keys({...initialStates,...states()
+})
+props.preferences.changeToolbarPin(props.expected?{operation:"configure",key:toolbarPinKey(pin),icon:pin.icon,icons:pin.icons??null,text:pin.text??null,expected:props.expected,stateIcons:Object.fromEntries(keys.map((key)=>[key,stateIcons[key]??null])),stateIconLists:Object.fromEntries(keys.map((key)=>[key,stateIconLists[key]??null]))
 }:{operation:"pin",pin
 })
 dialogs.back()
 } catch(error){props.api.ui.toast({variant:"error",title:"Toolbar",message:String(error)
 })
 }}
-return _$createComponent3(SelectionMenu3,{adaptive:true,get api(){return props.api
-},get title(){return _$memo2(()=>props.pin.kind==="skill")()?`Pin Skill \xB7 ${props.pin.name}`:"Pin Quick Action"
-},height:16,get options(){return [{title:`${terminalIcon(icon(), icons.style())} Base icon`,value:"base",description:"Used when the state is unavailable or has no custom icon",icon:"edit"
-},...props.pin.kind==="action"?quickActionStates(props.api,props.pin.id).map((state)=>({title:`${terminalIcon(states()[state.id] ?? icon(), icons.style())} ${state.label}`,value:`state:${state.id}`,description:states()[state.id]?"Custom state icon":"Uses base icon",icon:"edit"
-})):[],{title:props.expected?"Save":"Pin to toolbar",value:"save",description:"Save this draft",icon:"save"
+return{dialogs,base,text,states,group,changeGroup,choose,editText,save
+}}
+import {createComponent as _$createComponent5} from "@opentui/solid"
+import {quickActionStates} from "./tui.js"
+import {SelectionMenu as SelectionMenu4,terminalIcon as terminalIcon2,useDialogs as useDialogs4,useIcons as useIcons2} from "./tui.js"
+import {createComponent as _$createComponent4} from "@opentui/solid"
+import {memo as _$memo3} from "@opentui/solid"
+import {IconPicker as IconPicker2,SelectionMenu as SelectionMenu3,terminalIcon,terminalIconLabel,useDialogState as useDialogState2,useDialogs as useDialogs3,useIcons} from "./tui.js"
+function ToolbarIconGroupDialog(props){const dialogs=useDialogs3(props.api)
+const icons=useIcons()
+const [values,setValues]=useDialogState2("icon-group",[...props.initial])
+function choose(index){dialogs.open(()=>_$createComponent4(IconPicker2,{get api(){return props.api
+},get value(){return values()[index]??"bolt"
+},onSelect:(id)=>{setValues((current)=>{const next=[...current]
+next[index]=id
+return next
+})
+dialogs.back()
+}}),"large")
+}
+return _$createComponent4(SelectionMenu3,{get api(){return props.api
+},get title(){return props.title
+},adaptive:true,height:18,get options(){return [...values().map((id,index)=>({title:`${terminalIcon(id, icons.style())} Icon ${index + 1}`,value:`edit:${index}`,description:terminalIconLabel(id),icon:"edit"
+})),...values().length<3?[{title:"Add icon\u2026",value:"add",description:`${values().length} of 3 icons selected`,icon:"add"
+}]:[],{title:"Use these icons",value:"apply",description:values().length>0?"Return to the unsaved button draft":"Text-only appearance",icon:"save"
+},...values().map((_id,index)=>({title:`Remove icon ${index + 1}`,value:`remove:${index}`,description:"Keep the remaining icons in order",icon:"delete"
+})),{title:"Cancel",value:"cancel",description:"Discard this icon-group draft",icon:"close"
+}]
+},onSelect:(option)=>{if(option.value==="add")
+choose(values().length)
+else if(option.value.startsWith("edit:"))
+choose(Number(option.value.slice(5)))
+else if(option.value.startsWith("remove:"))
+setValues((current)=>current.filter((_,index)=>index!==Number(option.value.slice(7))))
+else{if(option.value==="apply")
+props.onConfirm(values())
+dialogs.back()
+}}})
+}
+function ToolbarAppearanceDialog(props){const dialogs=useDialogs4(props.api)
+const icons=useIcons2()
+const states=()=>{const known=props.pin.kind==="action"?quickActionStates(props.api,props.pin.id):[]
+const saved=Object.keys(props.draft.states()).filter((id)=>known.every((state)=>state.id!==id))
+return [...known,...saved.map((id)=>({id,label:`Saved state: ${id}`
+}))]
+}
+const preview=(state)=>props.draft.group(state).map((id)=>terminalIcon2(id,icons.style())).join(" ")||"No icons"
+return _$createComponent5(SelectionMenu4,{get api(){return props.api
+},title:"Toolbar icons and text",adaptive:true,height:18,get options(){return [{title:"Base icons\u2026",value:"base",description:`${props.draft.base().length} of 3 \xB7 ${preview()}`,icon:"edit"
+},{title:"Text\u2026",value:"text",description:props.draft.text()||"Optional custom label",icon:"edit"
+},...states().map((state)=>({title:`${state.label} icons\u2026`,value:`state:${state.id}`,description:preview(state.id),icon:"edit"
+})),{title:"Back",value:"back",description:"Return to the unsaved button configuration",icon:"close"
+}]
+},onSelect:(option)=>{if(option.value==="text")
+props.draft.editText()
+else if(option.value==="base"||option.value.startsWith("state:")){const state=option.value==="base"?undefined:option.value.slice(6)
+dialogs.open(()=>_$createComponent5(ToolbarIconGroupDialog,{get api(){return props.api
+},title:"Choose zero to three icons",get initial(){return props.draft.group(state)
+},onConfirm:(value)=>props.draft.changeGroup(value,state)
+}))
+} else
+dialogs.back()
+}})
+}
+function ToolbarPinDialog(props){const model=createToolbarPinDraft(props)
+const icons=useIcons3()
+const existing=()=>props.preferences.toolbarPins().some((pin)=>toolbarPinKey(pin)===toolbarPinKey(props.pin))
+const preview=(state)=>model.group(state).map((id)=>terminalIcon3(id,icons.style())).join(" ")
+return _$createComponent6(SelectionMenu5,{adaptive:true,get api(){return props.api
+},get title(){return _$memo4(()=>props.pin.kind==="skill")()?`Pin Skill \xB7 ${props.pin.name}`:"Pin Quick Action"
+},height:21,get options(){return [{title:`${preview()} Base icon`,value:"base",description:"Choose the primary icon",icon:"edit"
+},...props.pin.kind==="action"?quickActionStates2(props.api,props.pin.id).map((state)=>({title:`${preview(state.id)} ${state.label}`,value:`state:${state.id}`,description:model.states()[state.id]?"Custom state icons":"Uses base icons",icon:"edit"
+})):[],{title:props.expected?"Save":"Pin to toolbar",value:"save",description:"Save this button draft",icon:"save"
+},{title:"Icons and text\u2026",value:"appearance",description:`${model.base().length} icons${model.text() ? ` \xB7 ${model.text()}` : ""}`,icon:"edit"
 },...existing()?[{title:"Unpin",value:"unpin",description:"Remove only this toolbar button",icon:"delete"
 }]:[],{title:"Cancel",value:"cancel",description:"Discard this draft",icon:"close"
 }]
 },onSelect:(option)=>{if(option.value==="base")
-choose()
+model.choose()
 else if(option.value.startsWith("state:"))
-choose(option.value.slice(6))
+model.choose(option.value.slice(6))
 else if(option.value==="save")
-save()
-else if(option.value==="unpin"){props.preferences.changeToolbarPin({operation:"remove",key:toolbarPinKey(props.pin)
+model.save()
+else if(option.value==="appearance")
+model.dialogs.open(()=>_$createComponent6(ToolbarAppearanceDialog,_$mergeProps(props,{draft:model
+})))
+else{if(option.value==="unpin")
+props.preferences.changeToolbarPin({operation:"remove",key:toolbarPinKey(props.pin)
 })
-dialogs.back()
-} else
-dialogs.back()
-}})
+model.dialogs.back()
+}}})
 }
 function navigation(input){const route=JSON.stringify(input.api.route.current)
 return input.dialogs??createDialogStack(input.api,input.preferences.lspIconStyle,()=>route===JSON.stringify(input.api.route.current),input.preferences.cornerFont)
 }
 function openToolbarPin(input){const dialogs=navigation(input)
 const current=input.preferences.toolbarPins().find((pin)=>toolbarPinKey(pin)===toolbarPinKey(input.pin))
-dialogs.open(()=>_$createComponent4(ToolbarPinDialog,_$mergeProps(input,{get pin(){return current??input.pin
+dialogs.open(()=>_$createComponent7(ToolbarPinDialog,_$mergeProps2(input,{get pin(){return current??input.pin
 },get expected(){return current&&JSON.stringify(current)
 }})),"large")
 }
-function openToolbarManager(input){navigation(input).open(()=>_$createComponent4(ToolbarManager,input),"large")
+function openToolbarManager(input){navigation(input).open(()=>_$createComponent7(ToolbarManager,input),"large")
 }
 export{openToolbarManager,openToolbarPin
 }