termcast 1.3.34 → 1.3.36

package/src/examples/simple-navigation.vitest.tsx

@@ -111,7 +111,7 @@ test('navigation between main and detail views', async () => {
        > Detail view - Press ESC to go back
 
        Details
-      ›This is the detail view for Second Item Press Enter to go back
+      ›This is the detail view for Second Item Press Enter to go back o
 
 
 
@@ -153,8 +153,8 @@ test('navigation between main and detail views', async () => {
        > Main view
 
        Items
-      ›First Item Navigate to first detail
-       Second Item Navigate to second detail
+       First Item Navigate to first detail
+      ›Second Item Navigate to second detail
        Third Item Navigate to third detail
 
 
@@ -187,9 +187,9 @@ test('navigation between main and detail views', async () => {
        > Main view
 
        Items
-       First Item Navigate to first detail
+      ›First Item Navigate to first detail
        Second Item Navigate to second detail
-      ›Third Item Navigate to third detail
+       Third Item Navigate to third detail
 
 
 
@@ -215,12 +215,12 @@ test('navigation between main and detail views', async () => {
     "
 
 
-       Detail: Third Item ─────────────────────────────────────────────
+       Detail: First Item ─────────────────────────────────────────────
 
        > Detail view - Press ESC to go back
 
        Details
-      ›This is the detail view for Third Item Press Enter to go back o
+      ›This is the detail view for First Item Press Enter to go back or
 
 
 
@@ -412,7 +412,7 @@ test('navigation with actions panel', async () => {
        > Detail view - Press ESC to go back
 
        Details
-      ›This is the detail view for Second Item Press Enter to go back
+      ›This is the detail view for Second Item Press Enter to go back o
 
 
 
@@ -482,8 +482,8 @@ test('navigation with actions panel', async () => {
        > Main view
 
        Items
-      ›First Item Navigate to first detail
-       Second Item Navigate to second detail
+       First Item Navigate to first detail
+      ›Second Item Navigate to second detail
        Third Item Navigate to third detail
 
 
@@ -606,7 +606,7 @@ test('search functionality in main and detail views', async () => {
        > Detail view - Press ESC to go back
 
        Details
-      ›This is the detail view for First Item Press Enter to go back o
+      ›This is the detail view for First Item Press Enter to go back or
 
 
 
@@ -644,7 +644,7 @@ test('search functionality in main and detail views', async () => {
 
 
 
-                               No items found
+                                No items found
 
 
 
@@ -700,3 +700,34 @@ test('search functionality in main and detail views', async () => {
     "
   `)
 }, 10000)
+
+test('keeps selected item after opening detail and pressing esc', async () => {
+  await session.text({
+    waitFor: (text) => {
+      return /Navigation Example/i.test(text) && /First Item/i.test(text)
+    },
+  })
+
+  await session.press('down')
+  const selectedSecondSnapshot = await session.text()
+  expect(selectedSecondSnapshot).toContain('›Second Item')
+
+  await session.press('enter')
+  await session.text({
+    waitFor: (text) => {
+      return /Detail: Second Item/i.test(text)
+    },
+    timeout: 3000,
+  })
+
+  await session.press('esc')
+  const backSnapshot = await session.text({
+    waitFor: (text) => {
+      return /Navigation Example/i.test(text)
+    },
+    timeout: 3000,
+  })
+
+  expect(backSnapshot).toContain('›Second Item')
+  expect(backSnapshot).not.toContain('›First Item')
+}, 10000)

package/src/examples/store.vitest.tsx

@@ -50,7 +50,7 @@ test('Store extension - searching for spiceblow shows Database', async () => {
 
        > spiceblow
 
-      ›Spiceblow - Sql Database Management Search, update, insert and delete row
+      ›Spiceblow - Sql Database Management Search, update, insert and delete rows
 
 
 

package/src/examples/swift-extension.vitest.tsx

@@ -89,13 +89,14 @@ test.skipIf(isLinux)('swift extension dev mode shows command list', async () =>
        > Search commands...
 
        Commands
-      ›List Items Displays a simple list with some items         view
-       Swift List Displays a list of items returned by a Swift f view
+      ›List Items Displays a simple list with some items           view
+       Swift List Displays a list of items returned by a Swift fun view
 
 
 
 
 
+       ↵ run command   ↑↓ navigate   ^k actions
 
 
 
@@ -104,7 +105,6 @@ test.skipIf(isLinux)('swift extension dev mode shows command list', async () =>
 
 
 
-       ↵ run command   ↑↓ navigate   ^k actions
 
     "
   `)

package/src/extensions/dev.vitest.tsx

@@ -57,12 +57,12 @@ test('dev command shows extension commands list', async () => {
 
        > Search commands...
 
-       Commands                                              ▲
-      ›List Items Displays a simple list with some ite view  ▀
-       Search Items Search and filter through a list o view
-       Google Oauth                                    view
-       usePromise Demo Shows how to use the usePromise view
-       Show State Shows the current application state  view  ▼
+       Commands
+      ›List Items Displays a simple list with some items view
+       Search Items Search and filter through a list of  view
+       Google Oauth                                      view
+       usePromise Demo Shows how to use the usePromise h view
+       Show State Shows the current application state in view
 
 
        ↵ run command   ↑↓ navigate   ^k actions
@@ -93,12 +93,12 @@ test('selecting command with arguments shows arguments form', async () => {
 
        > Search commands...
 
-       Google Oauth                                    view  ▲
-       usePromise Demo Shows how to use the usePromise view
-       Show State Shows the current application state  view
-      ›With Arguments Demonstrates command arguments ( view  ▄
-       Quick Action Copies current timestamp to cli no-view
-       Throw Error Command that throws an error at roo view  ▼
+       Google Oauth                                      view
+       usePromise Demo Shows how to use the usePromise h view
+       Show State Shows the current application state in view
+      ›With Arguments Demonstrates command arguments (te view
+       Quick Action Copies current timestamp to clipb no-view
+       Throw Error Command that throws an error at root  view
 
 
        ↵ run command   ↑↓ navigate   ^k actions
@@ -204,9 +204,9 @@ test('can fill arguments and run command', async () => {
        > Search...
 
        Received Arguments
-      ›▼ Search Query (empty)
-       ▼ Secret Key (empty)
-       ▼ Category (empty)
+      ›𝐓 Search Query (empty)
+       𝐓 Secret Key (empty)
+       𝐓 Category (empty)
 
 
 
@@ -242,12 +242,12 @@ test('can run simple view command without arguments', async () => {
 
        > Search...
 
-       Items                                                 ▲
-      ›▲ First Item This is the first item                   █
-       ▲ Second Item This is the second item                 █
-       ▲ Third Item This is the third item
-       ▲ Fourth Item This is the fourth item
-       ▲ Fifth Item This is the fifth item                   ▼
+       Items
+      ›○ First Item This is the first item
+       ○ Second Item This is the second item
+       ○ Third Item This is the third item
+       ○ Fourth Item This is the fourth item
+       ○ Fifth Item This is the fifth item
 
 
      ✓ Copied to Clipboard  First Item

package/src/extensions/home.tsx

@@ -181,7 +181,7 @@ function ExtensionsList({
 
 export async function runHomeCommand(): Promise<void> {
   logger.log(`preparing to render the home command component`)
-  await renderWithProviders(<Home />)
+  await renderWithProviders(<Home />, { extensionName: 'termcast-home' })
   logger.log(`rendered home command component`)
 }
 

package/src/index.tsx

@@ -224,6 +224,7 @@ export { TermcastProvider } from 'termcast/src/internal/providers'
 
 // Helper function for rendering examples
 export { renderWithProviders } from 'termcast/src/utils'
+export type { RenderWithProvidersOptions } from 'termcast/src/utils'
 
 // Window Management
 export { closeMainWindow, PopToRootType } from 'termcast/src/apis/window'

package/src/internal/dialog.tsx

@@ -151,7 +151,6 @@ export function DialogOverlay(): any {
   const dialogStack = useStore((state) => state.dialogStack)
   const showActionsDialog = useStore((state) => state.showActionsDialog)
   const navContext = useContext(NavigationContext)
-  const theme = useTheme()
 
   const setActionsPortalTargetRef = useCallback((node: any) => {
     if (!node) {
@@ -177,13 +176,33 @@ export function DialogOverlay(): any {
 
   return (
     <>
+      {item && (
+        <box position='absolute' width='100%' height='100%' flexDirection='column'>
+          <InFocus inFocus={true}>
+            <Dialog
+              position={item.position}
+              onClickOutside={() => {
+                const state = useStore.getState()
+                if (state.dialogStack.length > 0) {
+                  useStore.setState({
+                    dialogStack: state.dialogStack.slice(0, -1),
+                  })
+                }
+              }}
+            >
+              <NavigationContext.Provider value={navContext}>
+                {item.element}
+              </NavigationContext.Provider>
+            </Dialog>
+          </InFocus>
+        </box>
+      )}
       {showActionsDialog && (
         <box
           position='absolute'
           width='100%'
           height='100%'
           flexDirection='column'
-          backgroundColor={theme.background}
         >
           <InFocus inFocus={true}>
             <Dialog
@@ -201,27 +220,6 @@ export function DialogOverlay(): any {
           </InFocus>
         </box>
       )}
-      {item && (
-        <box position='absolute' width='100%' height='100%' flexDirection='column'>
-          <InFocus inFocus={true}>
-            <Dialog
-              position={item.position}
-              onClickOutside={() => {
-                const state = useStore.getState()
-                if (state.dialogStack.length > 0) {
-                  useStore.setState({
-                    dialogStack: state.dialogStack.slice(0, -1),
-                  })
-                }
-              }}
-            >
-              <NavigationContext.Provider value={navContext}>
-                {item.element}
-              </NavigationContext.Provider>
-            </Dialog>
-          </InFocus>
-        </box>
-      )}
     </>
   )
 }

package/src/internal/providers.tsx

@@ -35,20 +35,33 @@ const queryClient = new QueryClient({
   },
 })
 
-// Create a custom persister using the Cache class
-const queryCache = new Cache({ namespace: 'tanstack-query' })
+// Lazy-initialized Cache for TanStack Query persistence.
+// Must not be created at module load time because extensionPath may not be set yet
+// (e.g. when renderWithProviders sets state right before rendering).
+// Tracks the extensionPath it was created with so it can be recreated if the path changes.
+let queryCache: Cache | null = null
+let queryCachePath: string | null = null
+
+function getQueryCache(): Cache {
+  const currentPath = useStore.getState().extensionPath
+  if (!queryCache || currentPath !== queryCachePath) {
+    queryCache = new Cache({ namespace: 'tanstack-query' })
+    queryCachePath = currentPath
+  }
+  return queryCache
+}
 
 const persister = {
   persistClient: async (client: any) => {
     const serialized = JSON.stringify(client)
-    queryCache.set('query-client-data', serialized)
+    getQueryCache().set('query-client-data', serialized)
   },
   restoreClient: async () => {
-    const data = queryCache.get('query-client-data')
+    const data = getQueryCache().get('query-client-data')
     return data ? JSON.parse(data) : undefined
   },
   removeClient: async () => {
-    queryCache.remove('query-client-data')
+    getQueryCache().remove('query-client-data')
   },
 }
 

package/src/state.tsx

@@ -36,6 +36,7 @@ export interface DialogStackItem {
 export interface NavigationStackItem {
   element: ReactNode
   onPop?: () => void
+  selectedListIndex?: number
 }
 
 interface AppState {

package/src/theme.tsx

@@ -3,12 +3,16 @@ import { getResolvedTheme, type ResolvedTheme, defaultThemeName, themeNames } fr
 import { useStore } from './state'
 import { Cache } from './apis/cache'
 
-// Global cache for theme persistence (no namespace = global storage)
+// Global cache for theme persistence (no namespace = global storage).
+// Tracks extensionPath so the cache is recreated if the path changes.
 let globalCache: Cache | null = null
+let globalCachePath: string | null = null
 
 function getGlobalCache(): Cache {
-  if (!globalCache) {
+  const currentPath = useStore.getState().extensionPath
+  if (!globalCache || currentPath !== globalCachePath) {
     globalCache = new Cache()
+    globalCachePath = currentPath
   }
   return globalCache
 }

package/src/utils.tsx

@@ -12,8 +12,47 @@ import {
   type CommandWithFile,
 } from './package-json'
 import { logger } from './logger'
+import { useStore } from './state'
+
+export interface RenderWithProvidersOptions {
+  extensionName?: string
+  extensionPath?: string
+  packageJson?: RaycastPackageJson
+}
+
+/**
+ * Render a React element wrapped in TermcastProvider with all necessary state initialized.
+ *
+ * Sets up extensionPath (for LocalStorage, Cache, assets) and extensionPackageJson
+ * (for preferences, environment metadata, action panel config) before rendering.
+ *
+ * - extensionName defaults to 'termcast-app'
+ * - extensionPath defaults to ~/.termcast/compiled/{extensionName}
+ * - packageJson defaults to a minimal { name, title, commands: [] }
+ */
+export async function renderWithProviders(
+  element: ReactNode,
+  options?: RenderWithProvidersOptions,
+): Promise<void> {
+  const extensionName = options?.extensionName || 'termcast-app'
+  const extensionPath =
+    options?.extensionPath ||
+    path.join(os.homedir(), '.termcast', 'compiled', extensionName)
+  const packageJson: RaycastPackageJson = options?.packageJson || {
+    name: extensionName,
+    title: extensionName,
+    description: '',
+    commands: [],
+  }
+
+  // Reset store to initial state then set extension fields, matching
+  // startDevMode/startCompiledExtension behavior to avoid stale navigation/dialog state
+  useStore.setState({
+    ...useStore.getInitialState(),
+    extensionPath,
+    extensionPackageJson: packageJson,
+  })
 
-export async function renderWithProviders(element: ReactNode): Promise<void> {
   const renderer = await createCliRenderer({
     onDestroy: () => {
       process.exit(0)