termcast 1.3.10 → 1.3.18

package/src/extensions/home.tsx

@@ -1,6 +1,7 @@
 import fs from 'node:fs'
 import React from 'react'
-import { render } from '@opentui/react'
+import { createRoot } from '@opentui/react'
+import { createCliRenderer } from '@opentui/core'
 import { List, logger, useStore } from 'termcast'
 import { Action, ActionPanel } from 'termcast'
 import { useNavigation } from 'termcast/src/internal/navigation'
@@ -10,7 +11,7 @@ import { Icon } from 'termcast'
 import { getStoredExtensions } from '../utils'
 import Store from './store'
 import { ExtensionPreferences } from '../components/extension-preferences'
-import { LocalStorage } from 'termcast/src/apis/localstorage'
+import { runCommand, clearCommandArguments } from '../utils/run-command'
 import '../globals'
 
 interface ExtensionCommand {
@@ -49,8 +50,17 @@ function ExtensionsList({
   const [searchText, setSearchText] = React.useState(initialSearchQuery)
 
   const handleCommandSelect = async (item: ExtensionCommand) => {
+    clearCommandArguments()
+
     try {
-      await runCommand(item)
+      await runCommand({
+        command: item.command,
+        extensionName: item.extensionName,
+        packageJson: item.packageJson,
+        bundledPath: item.bundledPath,
+        Component: item.Component,
+        push,
+      })
     } catch (error: any) {
       await showToast({
         style: Toast.Style.Failure,
@@ -60,116 +70,6 @@ function ExtensionsList({
     }
   }
 
-  const runCommand = async (item: ExtensionCommand) => {
-    // Check if command has required preferences that are missing
-    const checkRequiredPreferences = async (): Promise<{
-      hasRequiredPreferences: boolean
-      requiredPreferences?: 'command' | 'extension'
-    }> => {
-      // Get package.json to check required preferences
-      if (!item.bundledPath || item.Component || !item.packageJson) {
-        // Built-in commands or commands without packageJson don't have preferences
-        return { hasRequiredPreferences: true }
-      }
-
-      const packageJson = item.packageJson
-
-      // Check command-specific preferences
-      const command = packageJson.commands?.find(
-        (cmd: any) => cmd.name === item.command.name,
-      )
-      const commandPrefs = command?.preferences || []
-
-      // Check extension-wide preferences
-      const extensionPrefs = packageJson.preferences || []
-
-      // Get saved preferences
-      const commandPrefsKey = `preferences.${item.extensionName}.${item.command.name}`
-      const extensionPrefsKey = `preferences.${item.extensionName}`
-
-      const savedCommandPrefs = await LocalStorage.getItem(commandPrefsKey)
-      const savedExtensionPrefs = await LocalStorage.getItem(extensionPrefsKey)
-
-      const parsedCommandPrefs = savedCommandPrefs
-        ? JSON.parse(savedCommandPrefs as string)
-        : {}
-      const parsedExtensionPrefs = savedExtensionPrefs
-        ? JSON.parse(savedExtensionPrefs as string)
-        : {}
-
-      // Check if all required command preferences are set
-      for (const pref of commandPrefs) {
-        if (pref.required && parsedCommandPrefs[pref.name] == null) {
-          return {
-            hasRequiredPreferences: false,
-            requiredPreferences: 'command',
-          }
-        }
-      }
-
-      // Check if all required extension preferences are set
-      for (const pref of extensionPrefs) {
-        if (pref.required && parsedExtensionPrefs[pref.name] == null) {
-          return {
-            hasRequiredPreferences: false,
-            requiredPreferences: 'extension',
-          }
-        }
-      }
-
-      return { hasRequiredPreferences: true }
-    }
-
-    const prefsCheck = await checkRequiredPreferences()
-
-    if (!prefsCheck.hasRequiredPreferences) {
-      // TODO: Use replace instead of push to avoid stacking navigation
-      // Redirect to preferences with onSubmit to run command after
-      push(
-        <ExtensionPreferences
-          extensionName={item.extensionName}
-          commandName={
-            prefsCheck.requiredPreferences === 'command'
-              ? item.command.name
-              : undefined
-          }
-          onSubmit={() => {
-            // Recursively run command after preferences are set
-            runCommand(item)
-          }}
-        />,
-      )
-      return
-    }
-
-    let Component: (() => any) | undefined
-
-    if (item.Component) {
-      Component = item.Component
-    } else if (item.bundledPath) {
-      const module = await import(item.bundledPath)
-      Component = module.default
-
-      if (!Component) {
-        await showToast({
-          style: Toast.Style.Failure,
-          title: 'No default export',
-          message: `Command file ${item.command.name} has no default export`,
-        })
-        return
-      }
-    } else {
-      await showToast({
-        style: Toast.Style.Failure,
-        title: 'Command not available',
-        message: `Command ${item.command.name} has no implementation`,
-      })
-      return
-    }
-
-    push(<Component />)
-  }
-
   // Group commands by extension
   const groupedByExtension = allCommands.reduce(
     (acc, cmd) => {
@@ -229,8 +129,7 @@ function ExtensionsList({
                           <ExtensionPreferences
                             extensionName={item.extensionName}
                             onSubmit={() => {
-                              // After configuring extension preferences, try to run the command
-                              runCommand(item)
+                              handleCommandSelect(item)
                             }}
                           />,
                         )
@@ -244,8 +143,7 @@ function ExtensionsList({
                             extensionName={item.extensionName}
                             commandName={item.command.name}
                             onSubmit={() => {
-                              // After configuring command preferences, try to run the command
-                              runCommand(item)
+                              handleCommandSelect(item)
                             }}
                           />,
                         )
@@ -284,7 +182,8 @@ function ExtensionsList({
 export async function runHomeCommand(): Promise<void> {
   logger.log(`preparing to render the home command component`)
 
-  await render(
+  const renderer = await createCliRenderer()
+  createRoot(renderer).render(
     <TermcastProvider>
       <Home />
     </TermcastProvider>,

package/src/globals.ts

@@ -9,7 +9,7 @@ import * as opentuiCore from '@opentui/core'
 import * as opentuiReact from '@opentui/react'
 import * as react from 'react'
 import * as reactJsxRuntime from 'react/jsx-runtime'
-import * as termcastApi from 'termcast'
+import * as termcastApi from './index'
 
 declare global {
   var opentuiCore: typeof opentuiCore

package/src/index.tsx

@@ -95,7 +95,7 @@ export type {
 } from 'termcast/src/components/form/types'
 
 // Icons and Images
-export { Icon, getIconEmoji, IconComponent } from 'termcast/src/components/icon'
+export { Icon, getIconEmoji, getIconShape, IconComponent } from 'termcast/src/components/icon'
 export { Image, ImageMask } from 'termcast/src/components/image'
 export type {
   ImageProps,
@@ -107,6 +107,9 @@ export type {
 // Alerts
 export { Alert, confirmAlert } from 'termcast/src/components/alert'
 
+// Command Arguments
+export { CommandArguments } from 'termcast/src/components/command-arguments'
+
 // MenuBar
 export { MenuBarExtra } from 'termcast/src/components/menubar-extra'
 export type {
@@ -219,3 +222,6 @@ export { closeMainWindow, PopToRootType } from 'termcast/src/apis/window'
 
 // HUD
 export { showHUD } from 'termcast/src/apis/hud'
+
+// Compile support
+export { startCompiledExtension } from 'termcast/src/extensions/dev'

package/src/internal/date-picker-widget.tsx

@@ -291,40 +291,41 @@ export function DatePickerWidget({
           setFocus('grid')
         }
         break
-      case 'tab':
-        if (key.shift) {
-          if (focus === 'year') {
-            // At top of widget, trigger callback or cycle to bottom
-            if (onFirstRowUpKey) {
-              onFirstRowUpKey()
-            } else {
-              // Cycle to grid if no callback
-              setFocus('grid')
-            }
-          } else {
-            // Shift+Tab: Move focus up (grid -> month -> year)
-            setFocus((f) =>
-              f === 'grid' ? 'month' : f === 'month' ? 'year' : 'year',
-            )
-          }
-        } else {
-          if (focus === 'grid') {
-            // At bottom of widget, trigger callback or cycle to top
-            if (onLastRowDownKey) {
-              onLastRowDownKey()
-            } else {
-              // Cycle to year if no callback
-              setFocus('year')
-            }
-          } else {
-            // Tab: Move focus down (year -> month -> grid)
-            setFocus((f) =>
-              f === 'year' ? 'month' : f === 'month' ? 'grid' : 'grid',
-            )
-          }
-        }
-        break
+      // case 'tab':
+      //   if (key.shift) {
+      //     if (focus === 'year') {
+      //       // At top of widget, trigger callback or cycle to bottom
+      //       if (onFirstRowUpKey) {
+      //         onFirstRowUpKey()
+      //       } else {
+      //         // Cycle to grid if no callback
+      //         setFocus('grid')
+      //       }
+      //     } else {
+      //       // Shift+Tab: Move focus up (grid -> month -> year)
+      //       setFocus((f) =>
+      //         f === 'grid' ? 'month' : f === 'month' ? 'year' : 'year',
+      //       )
+      //     }
+      //   } else {
+      //     if (focus === 'grid') {
+      //       // At bottom of widget, trigger callback or cycle to top
+      //       if (onLastRowDownKey) {
+      //         onLastRowDownKey()
+      //       } else {
+      //         // Cycle to year if no callback
+      //         setFocus('year')
+      //       }
+      //     } else {
+      //       // Tab: Move focus down (year -> month -> grid)
+      //       setFocus((f) =>
+      //         f === 'year' ? 'month' : f === 'month' ? 'grid' : 'grid',
+      //       )
+      //     }
+      //   }
+      //   break
       case 'return': // Enter key
+      case 'space': // Space key
         if (focus === 'grid' && onChange) {
           onChange(selected)
         }
@@ -357,7 +358,9 @@ export function DatePickerWidget({
       style={{
         flexDirection: 'column',
         alignItems: 'flex-start',
-        padding: 1,
+        paddingTop: 1,
+        paddingLeft: 1,
+        paddingRight: 1,
       }}
     >
       {/* Year (line 1) */}
@@ -439,7 +442,7 @@ export function DatePickerWidget({
       </box>
 
       {/* Days grid: 7 columns x 6 rows, same fixed-box strategy */}
-      <box style={{ flexDirection: 'column', minHeight: 6 }}>
+      <box style={{ flexDirection: 'column' }}>
         {filteredWeeks.map((row, i) => {
           // Skip empty rows
           if (row.every((d) => d === null)) return null
@@ -455,7 +458,8 @@ export function DatePickerWidget({
                   )
                 }
 
-                const isSel = sameDay(d, selected)
+                const isCursor = sameDay(d, selected)
+                const isValue = initialValue ? sameDay(d, initialValue) : false
                 const isToday = sameDay(d, today)
                 return (
                   <box
@@ -463,11 +467,14 @@ export function DatePickerWidget({
                     style={{
                       ...cellStyle,
                       backgroundColor:
-                        enableColors && isSel && focus === 'grid'
+                        focus !== 'grid' ? 'transparent' :
+                        enableColors && isCursor
                           ? Theme.primary
-                          : enableColors && isToday
-                            ? Theme.backgroundPanel
-                            : undefined,
+                          : isValue
+                            ? Theme.selectedMuted
+                            : enableColors && isToday
+                              ? Theme.backgroundPanel
+                              : undefined,
                     }}
                     onMouseDown={() => {
                       setSelected(d)
@@ -477,13 +484,16 @@ export function DatePickerWidget({
                   >
                     <text
                       fg={
-                        isSel && focus === 'grid'
+
+                        enableColors && isCursor
                           ? Theme.text
-                          : enableColors && isToday
-                            ? Theme.accent
-                            : enableColors && (j === 5 || j === 6)
-                              ? Theme.error
-                              : Theme.text
+                          : isValue
+                            ? Theme.text
+                            : enableColors && isToday
+                              ? Theme.accent
+                              : enableColors && (j === 5 || j === 6)
+                                ? Theme.error
+                                : Theme.text
                       }
                     >
                       {String(d.getDate()).padStart(2, ' ')}

package/src/internal/dialog.tsx

@@ -1,7 +1,6 @@
 import { useKeyboard, useTerminalDimensions } from '@opentui/react'
 import React, { type ReactNode, useRef } from 'react'
 import { Theme } from 'termcast/src/theme'
-import { RGBA } from '@opentui/core'
 import { InFocus, useIsInFocus } from 'termcast/src/internal/focus-context'
 import { CommonProps } from 'termcast/src/utils'
 import {
@@ -10,12 +9,13 @@ import {
   type DialogStackItem,
 } from 'termcast/src/state'
 import { logger } from '../logger'
+import { ToastOverlay } from 'termcast/src/apis/toast'
 
 const Border = {
-  topLeft: '┃',
-  topRight: '┃',
-  bottomLeft: '┃',
-  bottomRight: '┃',
+  topLeft: '',
+  topRight: '',
+  bottomLeft: '',
+  bottomRight: '',
   horizontal: '',
   vertical: '┃',
   topT: '+',
@@ -104,7 +104,6 @@ export function Dialog({
       paddingRight={positionStyles.paddingRight}
       left={0}
       top={0}
-      backgroundColor={RGBA.fromInts(0, 0, 0, 150)}
       onMouseDown={handleBackdropClick}
     >
       <box
@@ -171,6 +170,7 @@ export function DialogProvider(props: DialogProviderProps): any {
           })}
         </box>
       )}
+      <ToastOverlay />
     </>
   )
 }

package/src/internal/scrollbox.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import Theme from '../theme'
 
 interface ScrollBoxProps {
   children?: React.ReactNode
@@ -6,6 +7,7 @@ interface ScrollBoxProps {
   flexGrow?: number
   flexShrink?: number
   style?: any
+  ref?: React.Ref<any>
 }
 
 export function ScrollBox({
@@ -14,21 +16,24 @@ export function ScrollBox({
   flexGrow,
   flexShrink,
   style,
+  ref,
   ...props
 }: ScrollBoxProps): any {
   return (
     <scrollbox
+      ref={ref}
       focused={focused}
       flexGrow={flexGrow}
       flexShrink={flexShrink}
       style={{
         rootOptions: {
-          backgroundColor: '#1a1b26',
+          // backgroundColor: '#1a1b26',
           ...(style?.rootOptions || {}),
         },
         viewportOptions: {
           flexGrow: 1,
           flexShrink: 1,
+          paddingRight: 1,
           ...(style?.viewportOptions || {}),
         },
         contentOptions: {
@@ -36,14 +41,19 @@ export function ScrollBox({
           ...(style?.contentOptions || {}),
         },
         scrollbarOptions: {
-          visible: true,
-          showArrows: true,
+          // visible: true,
+          // showArrows: true,
           trackOptions: {
-            foregroundColor: '#7aa2f7',
-            backgroundColor: '#414868',
+            foregroundColor: Theme.textMuted,
+
+            // backgroundColor: '#414868',
           },
           ...(style?.scrollbarOptions || {}),
         },
+        horizontalScrollbarOptions: {
+          visible: false,
+          ...(style?.horizontalScrollbarOptions || {}),
+        },
       }}
       {...props}
     >

package/src/release.tsx

@@ -0,0 +1,159 @@
+import fs from 'node:fs'
+import path from 'node:path'
+import { execSync, exec } from 'node:child_process'
+import { promisify } from 'node:util'
+
+const execAsync = promisify(exec)
+import {
+  compileExtension,
+  ALL_TARGETS,
+  targetToFileSuffix,
+  getArchiveExtension,
+  type CompileTarget,
+} from './compile'
+
+export interface ReleaseOptions {
+  extensionPath: string
+  single?: boolean
+}
+
+export interface ReleaseResult {
+  success: boolean
+  version: string
+  uploadedFiles: string[]
+}
+
+export async function releaseExtension({
+  extensionPath,
+  single = false,
+}: ReleaseOptions): Promise<ReleaseResult> {
+  const resolvedPath = path.resolve(extensionPath)
+
+  if (!fs.existsSync(resolvedPath)) {
+    throw new Error(`Extension path does not exist: ${resolvedPath}`)
+  }
+
+  const packageJsonPath = path.join(resolvedPath, 'package.json')
+  if (!fs.existsSync(packageJsonPath)) {
+    throw new Error(`No package.json found at: ${packageJsonPath}`)
+  }
+
+  const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf-8'))
+  const name = packageJson.name
+  const version = packageJson.version
+
+  if (!name) {
+    throw new Error('package.json must have a name field')
+  }
+  if (!version) {
+    throw new Error('package.json must have a version field')
+  }
+
+  const tag = `${name}@${version}`
+  console.log(`Preparing release ${tag}...`)
+
+  // Check if release already exists
+  try {
+    const checkResult = execSync(`gh release view "${tag}" --json tagName`, {
+      cwd: resolvedPath,
+      encoding: 'utf-8',
+      stdio: ['pipe', 'pipe', 'pipe'],
+    })
+    if (checkResult.includes(tag)) {
+      throw new Error(`Release ${tag} already exists. Bump the version in package.json first.`)
+    }
+  } catch (error: any) {
+    if (error.message?.includes('already exists')) {
+      throw error
+    }
+  }
+
+  // Install dependencies for all platforms
+  console.log('Installing dependencies for all platforms...')
+  execSync('bun install --os="*" --cpu="*"', {
+    cwd: resolvedPath,
+    stdio: 'inherit',
+  })
+
+  const targets: CompileTarget[] = single
+    ? ALL_TARGETS.filter((t) => t.os === process.platform && t.arch === process.arch)
+    : ALL_TARGETS
+
+  if (targets.length === 0) {
+    throw new Error(`No targets found for current platform: ${process.platform}-${process.arch}`)
+  }
+
+  const outputDir = path.join(resolvedPath, 'dist')
+  if (!fs.existsSync(outputDir)) {
+    fs.mkdirSync(outputDir, { recursive: true })
+  }
+
+  // Compile for all targets in parallel
+  console.log(`Compiling for ${targets.length} targets in parallel...`)
+  const compileResults = await Promise.all(
+    targets.map(async (target) => {
+      const suffix = targetToFileSuffix(target)
+      const binaryName = `${name}-${suffix}`
+      const outfile = path.join(outputDir, binaryName)
+
+      const result = await compileExtension({
+        extensionPath: resolvedPath,
+        outfile,
+        minify: true,
+        target,
+      })
+
+      console.log(`  ✓ ${path.basename(result.outfile)}`)
+
+      const archiveExt = getArchiveExtension(target)
+      const archiveName = `${name}-${suffix}${archiveExt}`
+      const archivePath = path.join(outputDir, archiveName)
+
+      if (archiveExt === '.tar.gz') {
+        await execAsync(`tar -czvf "${archiveName}" "${binaryName}"`, { cwd: outputDir })
+      } else {
+        await execAsync(`zip "${archiveName}" "${binaryName}"`, { cwd: outputDir })
+      }
+
+      fs.unlinkSync(result.outfile)
+      console.log(`  ✓ ${archiveName}`)
+
+      return archivePath
+    }),
+  )
+
+  // Create GitHub release
+  console.log(`\nCreating GitHub release ${tag}...`)
+  try {
+    execSync(`gh release create "${tag}" --title "${tag}" --notes "Release ${version}"`, {
+      cwd: resolvedPath,
+      stdio: 'inherit',
+    })
+  } catch (error: any) {
+    throw new Error(`Failed to create release: ${error.message}`)
+  }
+
+  // Upload all binaries in parallel
+  console.log('\nUploading binaries in parallel...')
+  await Promise.all(
+    compileResults.map(async (file) => {
+      const fileName = path.basename(file)
+      await execAsync(`gh release upload "${tag}" "${file}" --clobber`, {
+        cwd: resolvedPath,
+      })
+      console.log(`  ✓ ${fileName}`)
+    }),
+  )
+
+
+
+  console.log(`\n✅ Release ${tag} published successfully!`)
+  console.log(`   ${compileResults.length} binaries uploaded`)
+
+
+  return {
+    success: true,
+    version,
+    uploadedFiles: compileResults,
+  }
+}

package/src/state.tsx

@@ -26,6 +26,7 @@ interface AppState {
   extensionPath: string | null
   extensionPackageJson: RaycastPackageJson | null
   currentCommandName: string | null
+  currentCommandArguments: Record<string, string> | null
   // OAuth state
   googleAccessToken?: string
   googleIdToken?: string
@@ -43,6 +44,7 @@ export const useStore = create<AppState>(() => ({
   extensionPath: null,
   extensionPackageJson: null,
   currentCommandName: null,
+  currentCommandArguments: null,
   // OAuth state
   googleAccessToken: undefined,
   googleIdToken: undefined,

package/src/store-api/search.test.tsx

@@ -4,26 +4,17 @@ import { searchStoreListings } from './search'
 describe('searchStoreListings', () => {
   test('searches for extensions in the store', async () => {
     const results = await searchStoreListings({
-      query: 'database',
+      query: 'spiceblow-database',
       perPage: 5,
     })
 
     // Check we got results
     expect(results.data).toBeDefined()
     expect(results.data.length).toBeGreaterThan(0)
-    expect(results.data.length).toBeLessThanOrEqual(5)
 
-    // Snapshot the extension names
-    const extensionNames = results.data.map((d) => d.name).sort()
-    expect(extensionNames).toMatchInlineSnapshot(`
-          [
-            "discogs",
-            "notion",
-            "spiceblow-database",
-            "tmdb",
-            "turso",
-          ]
-        `)
+    // Verify the specific extension is found
+    const extensionNames = results.data.map((d) => d.name)
+    expect(extensionNames).toContain('spiceblow-database')
   }, 10000)
 
   test.skip('returns results when searching without a query', async () => {