Adds TUI prompt traits, refs, and plugin slots (#20741)

packages/opencode/src/cli/cmd/tui/plugin/api.tsx

@@ -1,5 +1,5 @@
 import type { ParsedKey } from "@opentui/core"
-import type { TuiDialogSelectOption, TuiPluginApi, TuiRouteDefinition } from "@opencode-ai/plugin/tui"
+import type { TuiDialogSelectOption, TuiPluginApi, TuiRouteDefinition, TuiSlotProps } from "@opencode-ai/plugin/tui"
 import type { useCommandDialog } from "@tui/component/dialog-command"
 import type { useKeybind } from "@tui/context/keybind"
 import type { useRoute } from "@tui/context/route"
@@ -15,6 +15,7 @@ import { DialogConfirm } from "../ui/dialog-confirm"
 import { DialogPrompt } from "../ui/dialog-prompt"
 import { DialogSelect, type DialogSelectOption as SelectOption } from "../ui/dialog-select"
 import { Prompt } from "../component/prompt"
+import { Slot as HostSlot } from "./slots"
 import type { useToast } from "../ui/toast"
 import { Installation } from "@/installation"
 import { createOpencodeClient, type OpencodeClient } from "@opencode-ai/sdk/v2"
@@ -244,6 +245,9 @@ export function createTuiApi(input: Input): TuiHostPluginApi {
       trigger(value) {
         input.command.trigger(value)
       },
+      show() {
+        input.command.show()
+      },
     },
     route: {
       register(list) {
@@ -288,14 +292,20 @@ export function createTuiApi(input: Input): TuiHostPluginApi {
           />
         )
       },
+      Slot<Name extends string>(props: TuiSlotProps<Name>) {
+        return <HostSlot {...props} />
+      },
       Prompt(props) {
         return (
           <Prompt
+            sessionID={props.sessionID}
             workspaceID={props.workspaceID}
             visible={props.visible}
             disabled={props.disabled}
             onSubmit={props.onSubmit}
+            ref={props.ref}
             hint={props.hint}
+            right={props.right}
             showPlaceholder={props.showPlaceholder}
             placeholders={props.placeholders}
           />

packages/opencode/src/cli/cmd/tui/plugin/runtime.ts

@@ -7,6 +7,7 @@ import {
   type TuiPluginModule,
   type TuiPluginMeta,
   type TuiPluginStatus,
+  type TuiSlotPlugin,
   type TuiTheme,
 } from "@opencode-ai/plugin/tui"
 import path from "path"
@@ -491,6 +492,9 @@ function pluginApi(runtime: RuntimeState, plugin: PluginEntry, scope: PluginScop
     trigger(value) {
       api.command.trigger(value)
     },
+    show() {
+      api.command.show()
+    },
   }
 
   const route: TuiPluginApi["route"] = {
@@ -518,7 +522,7 @@ function pluginApi(runtime: RuntimeState, plugin: PluginEntry, scope: PluginScop
   let count = 0
 
   const slots: TuiPluginApi["slots"] = {
-    register(plugin) {
+    register(plugin: TuiSlotPlugin) {
       const id = count ? `${base}:${count}` : base
       count += 1
       scope.track(host.register({ ...plugin, id }))

packages/opencode/src/cli/cmd/tui/plugin/slots.tsx

@@ -1,22 +1,21 @@
-import { type SlotMode, type TuiPluginApi, type TuiSlotContext, type TuiSlotMap } from "@opencode-ai/plugin/tui"
+import type { TuiPluginApi, TuiSlotContext, TuiSlotMap, TuiSlotProps } from "@opencode-ai/plugin/tui"
 import { createSlot, createSolidSlotRegistry, type JSX, type SolidPlugin } from "@opentui/solid"
 import { isRecord } from "@/util/record"
 
-type SlotProps<K extends keyof TuiSlotMap> = {
-  name: K
-  mode?: SlotMode
-  children?: JSX.Element
-} & TuiSlotMap[K]
+type RuntimeSlotMap = TuiSlotMap<Record<string, object>>
 
-type Slot = <K extends keyof TuiSlotMap>(props: SlotProps<K>) => JSX.Element | null
-export type HostSlotPlugin = SolidPlugin<TuiSlotMap, TuiSlotContext>
+type Slot = <Name extends string>(props: TuiSlotProps<Name>) => JSX.Element | null
+export type HostSlotPlugin<Slots extends Record<string, object> = {}> = SolidPlugin<TuiSlotMap<Slots>, TuiSlotContext>
 
 export type HostPluginApi = TuiPluginApi
 export type HostSlots = {
-  register: (plugin: HostSlotPlugin) => () => void
+  register: {
+    (plugin: HostSlotPlugin): () => void
+    <Slots extends Record<string, object>>(plugin: HostSlotPlugin<Slots>): () => void
+  }
 }
 
-function empty<K extends keyof TuiSlotMap>(_props: SlotProps<K>) {
+function empty<Name extends string>(_props: TuiSlotProps<Name>) {
   return null
 }
 
@@ -24,7 +23,7 @@ let view: Slot = empty
 
 export const Slot: Slot = (props) => view(props)
 
-function isHostSlotPlugin(value: unknown): value is HostSlotPlugin {
+function isHostSlotPlugin(value: unknown): value is HostSlotPlugin<Record<string, object>> {
   if (!isRecord(value)) return false
   if (typeof value.id !== "string") return false
   if (!isRecord(value.slots)) return false
@@ -32,7 +31,7 @@ function isHostSlotPlugin(value: unknown): value is HostSlotPlugin {
 }
 
 export function setupSlots(api: HostPluginApi): HostSlots {
-  const reg = createSolidSlotRegistry<TuiSlotMap, TuiSlotContext>(
+  const reg = createSolidSlotRegistry<RuntimeSlotMap, TuiSlotContext>(
     api.renderer,
     {
       theme: api.theme,
@@ -50,10 +49,10 @@ export function setupSlots(api: HostPluginApi): HostSlots {
     },
   )
 
-  const slot = createSlot<TuiSlotMap, TuiSlotContext>(reg)
+  const slot = createSlot<RuntimeSlotMap, TuiSlotContext>(reg)
   view = (props) => slot(props)
   return {
-    register(plugin) {
+    register(plugin: HostSlotPlugin) {
       if (!isHostSlotPlugin(plugin)) return () => {}
       return reg.register(plugin)
     },