@epoch-ai/cli 2.2.4 → 2.2.5

package/src/cli/cmd/tui/ui/dialog.tsx

@@ -1,192 +0,0 @@
-import { useKeyboard, useRenderer, useTerminalDimensions } from "@opentui/solid"
-import { batch, createContext, Show, useContext, type JSX, type ParentProps } from "solid-js"
-import { useTheme } from "@tui/context/theme"
-import { MouseButton, Renderable, RGBA } from "@opentui/core"
-import { createStore } from "solid-js/store"
-import { useToast } from "./toast"
-import { Flag } from "@/flag/flag"
-import { Selection } from "@tui/util/selection"
-
-export function Dialog(
-  props: ParentProps<{
-    size?: "medium" | "large" | "xlarge"
-    onClose: () => void
-  }>,
-) {
-  const dimensions = useTerminalDimensions()
-  const { theme } = useTheme()
-  const renderer = useRenderer()
-
-  let dismiss = false
-  const width = () => {
-    if (props.size === "xlarge") return 116
-    if (props.size === "large") return 88
-    return 60
-  }
-
-  return (
-    <box
-      onMouseDown={() => {
-        dismiss = !!renderer.getSelection()
-      }}
-      onMouseUp={() => {
-        if (dismiss) {
-          dismiss = false
-          return
-        }
-        props.onClose?.()
-      }}
-      width={dimensions().width}
-      height={dimensions().height}
-      alignItems="center"
-      position="absolute"
-      zIndex={3000}
-      paddingTop={dimensions().height / 4}
-      left={0}
-      top={0}
-      backgroundColor={RGBA.fromInts(0, 0, 0, 150)}
-    >
-      <box
-        onMouseUp={(e) => {
-          dismiss = false
-          e.stopPropagation()
-        }}
-        width={width()}
-        maxWidth={dimensions().width - 2}
-        backgroundColor={theme.backgroundPanel}
-        paddingTop={1}
-      >
-        {props.children}
-      </box>
-    </box>
-  )
-}
-
-function init() {
-  const [store, setStore] = createStore({
-    stack: [] as {
-      element: JSX.Element
-      onClose?: () => void
-    }[],
-    size: "medium" as "medium" | "large" | "xlarge",
-  })
-
-  const renderer = useRenderer()
-
-  useKeyboard((evt) => {
-    if (store.stack.length === 0) return
-    if (evt.defaultPrevented) return
-    if ((evt.name === "escape" || (evt.ctrl && evt.name === "c")) && renderer.getSelection()?.getSelectedText()) return
-    if (evt.name === "escape" || (evt.ctrl && evt.name === "c")) {
-      if (renderer.getSelection()) {
-        renderer.clearSelection()
-      }
-      const current = store.stack.at(-1)!
-      current.onClose?.()
-      setStore("stack", store.stack.slice(0, -1))
-      evt.preventDefault()
-      evt.stopPropagation()
-      refocus()
-    }
-  })
-
-  let focus: Renderable | null
-  function refocus() {
-    setTimeout(() => {
-      if (!focus) return
-      if (focus.isDestroyed) return
-      function find(item: Renderable) {
-        for (const child of item.getChildren()) {
-          if (child === focus) return true
-          if (find(child)) return true
-        }
-        return false
-      }
-      const found = find(renderer.root)
-      if (!found) return
-      focus.focus()
-    }, 1)
-  }
-
-  return {
-    clear() {
-      for (const item of store.stack) {
-        if (item.onClose) item.onClose()
-      }
-      batch(() => {
-        setStore("size", "medium")
-        setStore("stack", [])
-      })
-      refocus()
-    },
-    replace(input: any, onClose?: () => void) {
-      if (store.stack.length === 0) {
-        focus = renderer.currentFocusedRenderable
-        focus?.blur()
-      }
-      for (const item of store.stack) {
-        if (item.onClose) item.onClose()
-      }
-      setStore("size", "medium")
-      setStore("stack", [
-        {
-          element: input,
-          onClose,
-        },
-      ])
-    },
-    get stack() {
-      return store.stack
-    },
-    get size() {
-      return store.size
-    },
-    setSize(size: "medium" | "large" | "xlarge") {
-      setStore("size", size)
-    },
-  }
-}
-
-export type DialogContext = ReturnType<typeof init>
-
-const ctx = createContext<DialogContext>()
-
-export function DialogProvider(props: ParentProps) {
-  const value = init()
-  const renderer = useRenderer()
-  const toast = useToast()
-  return (
-    <ctx.Provider value={value}>
-      {props.children}
-      <box
-        position="absolute"
-        zIndex={3000}
-        onMouseDown={(evt) => {
-          if (!Flag.EPOCHCLI_EXPERIMENTAL_DISABLE_COPY_ON_SELECT) return
-          if (evt.button !== MouseButton.RIGHT) return
-
-          if (!Selection.copy(renderer, toast)) return
-          evt.preventDefault()
-          evt.stopPropagation()
-        }}
-        onMouseUp={
-          !Flag.EPOCHCLI_EXPERIMENTAL_DISABLE_COPY_ON_SELECT ? () => Selection.copy(renderer, toast) : undefined
-        }
-      >
-        <Show when={value.stack.length}>
-          <Dialog onClose={() => value.clear()} size={value.size}>
-            {value.stack.at(-1)!.element}
-          </Dialog>
-        </Show>
-      </box>
-    </ctx.Provider>
-  )
-}
-
-export function useDialog() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useDialog must be used within a DialogProvider")
-  }
-  return value
-}

package/src/cli/cmd/tui/ui/link.tsx

@@ -1,28 +0,0 @@
-import type { JSX } from "solid-js"
-import type { RGBA } from "@opentui/core"
-import open from "open"
-
-export interface LinkProps {
-  href: string
-  children?: JSX.Element | string
-  fg?: RGBA
-}
-
-/**
- * Link component that renders clickable hyperlinks.
- * Clicking anywhere on the link text opens the URL in the default browser.
- */
-export function Link(props: LinkProps) {
-  const displayText = props.children ?? props.href
-
-  return (
-    <text
-      fg={props.fg}
-      onMouseUp={() => {
-        open(props.href).catch(() => {})
-      }}
-    >
-      {displayText}
-    </text>
-  )
-}

package/src/cli/cmd/tui/ui/spinner.ts

@@ -1,368 +0,0 @@
-import type { ColorInput } from "@opentui/core"
-import { RGBA } from "@opentui/core"
-import type { ColorGenerator } from "opentui-spinner"
-
-interface AdvancedGradientOptions {
-  colors: ColorInput[]
-  trailLength: number
-  defaultColor?: ColorInput
-  direction?: "forward" | "backward" | "bidirectional"
-  holdFrames?: { start?: number; end?: number }
-  enableFading?: boolean
-  minAlpha?: number
-}
-
-interface ScannerState {
-  activePosition: number
-  isHolding: boolean
-  holdProgress: number
-  holdTotal: number
-  movementProgress: number
-  movementTotal: number
-  isMovingForward: boolean
-}
-
-function getScannerState(
-  frameIndex: number,
-  totalChars: number,
-  options: Pick<AdvancedGradientOptions, "direction" | "holdFrames">,
-): ScannerState {
-  const { direction = "forward", holdFrames = {} } = options
-
-  if (direction === "bidirectional") {
-    const forwardFrames = totalChars
-    const holdEndFrames = holdFrames.end ?? 0
-    const backwardFrames = totalChars - 1
-
-    if (frameIndex < forwardFrames) {
-      // Moving forward
-      return {
-        activePosition: frameIndex,
-        isHolding: false,
-        holdProgress: 0,
-        holdTotal: 0,
-        movementProgress: frameIndex,
-        movementTotal: forwardFrames,
-        isMovingForward: true,
-      }
-    } else if (frameIndex < forwardFrames + holdEndFrames) {
-      // Holding at end
-      return {
-        activePosition: totalChars - 1,
-        isHolding: true,
-        holdProgress: frameIndex - forwardFrames,
-        holdTotal: holdEndFrames,
-        movementProgress: 0,
-        movementTotal: 0,
-        isMovingForward: true,
-      }
-    } else if (frameIndex < forwardFrames + holdEndFrames + backwardFrames) {
-      // Moving backward
-      const backwardIndex = frameIndex - forwardFrames - holdEndFrames
-      return {
-        activePosition: totalChars - 2 - backwardIndex,
-        isHolding: false,
-        holdProgress: 0,
-        holdTotal: 0,
-        movementProgress: backwardIndex,
-        movementTotal: backwardFrames,
-        isMovingForward: false,
-      }
-    } else {
-      // Holding at start
-      return {
-        activePosition: 0,
-        isHolding: true,
-        holdProgress: frameIndex - forwardFrames - holdEndFrames - backwardFrames,
-        holdTotal: holdFrames.start ?? 0,
-        movementProgress: 0,
-        movementTotal: 0,
-        isMovingForward: false,
-      }
-    }
-  } else if (direction === "backward") {
-    return {
-      activePosition: totalChars - 1 - (frameIndex % totalChars),
-      isHolding: false,
-      holdProgress: 0,
-      holdTotal: 0,
-      movementProgress: frameIndex % totalChars,
-      movementTotal: totalChars,
-      isMovingForward: false,
-    }
-  } else {
-    return {
-      activePosition: frameIndex % totalChars,
-      isHolding: false,
-      holdProgress: 0,
-      holdTotal: 0,
-      movementProgress: frameIndex % totalChars,
-      movementTotal: totalChars,
-      isMovingForward: true,
-    }
-  }
-}
-
-function calculateColorIndex(
-  frameIndex: number,
-  charIndex: number,
-  totalChars: number,
-  options: Pick<AdvancedGradientOptions, "direction" | "holdFrames" | "trailLength">,
-  state?: ScannerState,
-): number {
-  const { trailLength } = options
-  const { activePosition, isHolding, holdProgress, isMovingForward } =
-    state ?? getScannerState(frameIndex, totalChars, options)
-
-  // Calculate directional distance (positive means trailing behind)
-  const directionalDistance = isMovingForward
-    ? activePosition - charIndex // For forward: trail is to the left (lower indices)
-    : charIndex - activePosition // For backward: trail is to the right (higher indices)
-
-  // Handle hold frame fading: keep the lead bright, fade the trail
-  if (isHolding) {
-    // Shift the color index by how long we've been holding
-    return directionalDistance + holdProgress
-  }
-
-  // Normal movement - show gradient trail only behind the movement direction
-  if (directionalDistance > 0 && directionalDistance < trailLength) {
-    return directionalDistance
-  }
-
-  // At the active position, show the brightest color
-  if (directionalDistance === 0) {
-    return 0
-  }
-
-  return -1
-}
-
-function createKnightRiderTrail(options: AdvancedGradientOptions): ColorGenerator {
-  const { colors, defaultColor, enableFading = true, minAlpha = 0 } = options
-
-  // Use the provided defaultColor if it's an RGBA instance, otherwise convert/default
-  // We use RGBA.fromHex for the fallback to ensure we have an RGBA object.
-  // Note: If defaultColor is a string, we convert it once here.
-  const defaultRgba = defaultColor instanceof RGBA ? defaultColor : RGBA.fromHex((defaultColor as string) || "#000000")
-
-  // Store the base alpha from the inactive factor
-  const baseInactiveAlpha = defaultRgba.a
-
-  let cachedFrameIndex = -1
-  let cachedState: ScannerState | null = null
-
-  return (frameIndex: number, charIndex: number, _totalFrames: number, totalChars: number) => {
-    if (frameIndex !== cachedFrameIndex) {
-      cachedFrameIndex = frameIndex
-      cachedState = getScannerState(frameIndex, totalChars, options)
-    }
-
-    const state = cachedState!
-
-    const index = calculateColorIndex(frameIndex, charIndex, totalChars, options, state)
-
-    // Calculate global fade for inactive dots during hold or movement
-    const { isHolding, holdProgress, holdTotal, movementProgress, movementTotal } = state
-
-    let fadeFactor = 1.0
-    if (enableFading) {
-      if (isHolding && holdTotal > 0) {
-        // Fade out linearly to minAlpha
-        const progress = Math.min(holdProgress / holdTotal, 1)
-        fadeFactor = Math.max(minAlpha, 1 - progress * (1 - minAlpha))
-      } else if (!isHolding && movementTotal > 0) {
-        // Fade in linearly from minAlpha during movement
-        const progress = Math.min(movementProgress / Math.max(1, movementTotal - 1), 1)
-        fadeFactor = minAlpha + progress * (1 - minAlpha)
-      }
-    }
-
-    // Combine base inactive alpha with the fade factor
-    // This ensures inactiveFactor is respected while still allowing fading animation
-    defaultRgba.a = baseInactiveAlpha * fadeFactor
-
-    if (index === -1) {
-      return defaultRgba
-    }
-
-    return colors[index] ?? defaultRgba
-  }
-}
-
-/**
- * Derives a gradient of tail colors from a single bright color using alpha falloff
- * @param brightColor The brightest color (center/head of the scanner)
- * @param steps Number of gradient steps (default: 6)
- * @returns Array of RGBA colors with alpha-based trail fade (background-independent)
- */
-export function deriveTrailColors(brightColor: ColorInput, steps: number = 6): RGBA[] {
-  const baseRgba = brightColor instanceof RGBA ? brightColor : RGBA.fromHex(brightColor as string)
-
-  const colors: RGBA[] = []
-
-  for (let i = 0; i < steps; i++) {
-    // Alpha-based falloff with optional bloom effect
-    let alpha: number
-    let brightnessFactor: number
-
-    if (i === 0) {
-      // Lead position: full brightness and opacity
-      alpha = 1.0
-      brightnessFactor = 1.0
-    } else if (i === 1) {
-      // Slight bloom/glare effect: brighten color but reduce opacity slightly
-      alpha = 0.9
-      brightnessFactor = 1.15
-    } else {
-      // Exponential alpha decay for natural-looking trail fade
-      alpha = Math.pow(0.65, i - 1)
-      brightnessFactor = 1.0
-    }
-
-    const r = Math.min(1.0, baseRgba.r * brightnessFactor)
-    const g = Math.min(1.0, baseRgba.g * brightnessFactor)
-    const b = Math.min(1.0, baseRgba.b * brightnessFactor)
-
-    colors.push(RGBA.fromValues(r, g, b, alpha))
-  }
-
-  return colors
-}
-
-/**
- * Derives the inactive/default color from a bright color using alpha
- * @param brightColor The brightest color (center/head of the scanner)
- * @param factor Alpha factor for inactive color (default: 0.2, range: 0-1)
- * @returns The same color with reduced alpha for background-independent dimming
- */
-export function deriveInactiveColor(brightColor: ColorInput, factor: number = 0.2): RGBA {
-  const baseRgba = brightColor instanceof RGBA ? brightColor : RGBA.fromHex(brightColor as string)
-
-  // Use the full color brightness but adjust alpha for background-independent dimming
-  return RGBA.fromValues(baseRgba.r, baseRgba.g, baseRgba.b, factor)
-}
-
-export type KnightRiderStyle = "blocks" | "diamonds"
-
-export interface KnightRiderOptions {
-  width?: number
-  style?: KnightRiderStyle
-  holdStart?: number
-  holdEnd?: number
-  colors?: ColorInput[]
-  /** Single color to derive trail from (alternative to providing colors array) */
-  color?: ColorInput
-  /** Number of trail steps when using single color (default: 6) */
-  trailSteps?: number
-  defaultColor?: ColorInput
-  /** Alpha factor for inactive color when using single color (default: 0.2, range: 0-1) */
-  inactiveFactor?: number
-  /** Enable fading of inactive dots during hold and movement (default: true) */
-  enableFading?: boolean
-  /** Minimum alpha value when fading (default: 0, range: 0-1) */
-  minAlpha?: number
-}
-
-/**
- * Creates frame strings for a Knight Rider style scanner animation
- * @param options Configuration options for the Knight Rider effect
- * @returns Array of frame strings
- */
-export function createFrames(options: KnightRiderOptions = {}): string[] {
-  const width = options.width ?? 8
-  const style = options.style ?? "diamonds"
-  const holdStart = options.holdStart ?? 30
-  const holdEnd = options.holdEnd ?? 9
-
-  const colors =
-    options.colors ??
-    (options.color
-      ? deriveTrailColors(options.color, options.trailSteps)
-      : [
-          RGBA.fromHex("#ff0000"), // Brightest Red (Center)
-          RGBA.fromHex("#ff5555"), // Glare/Bloom
-          RGBA.fromHex("#dd0000"), // Trail 1
-          RGBA.fromHex("#aa0000"), // Trail 2
-          RGBA.fromHex("#770000"), // Trail 3
-          RGBA.fromHex("#440000"), // Trail 4
-        ])
-
-  const defaultColor =
-    options.defaultColor ??
-    (options.color ? deriveInactiveColor(options.color, options.inactiveFactor) : RGBA.fromHex("#330000"))
-
-  const trailOptions = {
-    colors,
-    trailLength: colors.length,
-    defaultColor,
-    direction: "bidirectional" as const,
-    holdFrames: { start: holdStart, end: holdEnd },
-    enableFading: options.enableFading,
-    minAlpha: options.minAlpha,
-  }
-
-  // Bidirectional cycle: Forward (width) + Hold End + Backward (width-1) + Hold Start
-  const totalFrames = width + holdEnd + (width - 1) + holdStart
-
-  // Generate dynamic frames where inactive pixels are dots and active ones are blocks
-  const frames = Array.from({ length: totalFrames }, (_, frameIndex) => {
-    return Array.from({ length: width }, (_, charIndex) => {
-      const index = calculateColorIndex(frameIndex, charIndex, width, trailOptions)
-
-      if (style === "diamonds") {
-        const shapes = ["⬥", "◆", "⬩", "⬪"]
-        if (index >= 0 && index < trailOptions.colors.length) {
-          return shapes[Math.min(index, shapes.length - 1)]
-        }
-        return "·"
-      }
-
-      // Default to blocks
-      // It's active if we have a valid color index that is within our colors array
-      const isActive = index >= 0 && index < trailOptions.colors.length
-      return isActive ? "■" : "⬝"
-    }).join("")
-  })
-
-  return frames
-}
-
-/**
- * Creates a color generator function for Knight Rider style scanner animation
- * @param options Configuration options for the Knight Rider effect
- * @returns ColorGenerator function
- */
-export function createColors(options: KnightRiderOptions = {}): ColorGenerator {
-  const holdStart = options.holdStart ?? 30
-  const holdEnd = options.holdEnd ?? 9
-
-  const colors =
-    options.colors ??
-    (options.color
-      ? deriveTrailColors(options.color, options.trailSteps)
-      : [
-          RGBA.fromHex("#ff0000"), // Brightest Red (Center)
-          RGBA.fromHex("#ff5555"), // Glare/Bloom
-          RGBA.fromHex("#dd0000"), // Trail 1
-          RGBA.fromHex("#aa0000"), // Trail 2
-          RGBA.fromHex("#770000"), // Trail 3
-          RGBA.fromHex("#440000"), // Trail 4
-        ])
-
-  const defaultColor =
-    options.defaultColor ??
-    (options.color ? deriveInactiveColor(options.color, options.inactiveFactor) : RGBA.fromHex("#330000"))
-
-  const trailOptions = {
-    colors,
-    trailLength: colors.length,
-    defaultColor,
-    direction: "bidirectional" as const,
-    holdFrames: { start: holdStart, end: holdEnd },
-    enableFading: options.enableFading,
-    minAlpha: options.minAlpha,
-  }
-
-  return createKnightRiderTrail(trailOptions)
-}

package/src/cli/cmd/tui/ui/toast.tsx

@@ -1,100 +0,0 @@
-import { createContext, useContext, type ParentProps, Show } from "solid-js"
-import { createStore } from "solid-js/store"
-import { useTheme } from "@tui/context/theme"
-import { useTerminalDimensions } from "@opentui/solid"
-import { SplitBorder } from "../component/border"
-import { TextAttributes } from "@opentui/core"
-import z from "zod"
-import { TuiEvent } from "../event"
-
-export type ToastOptions = z.infer<typeof TuiEvent.ToastShow.properties>
-
-export function Toast() {
-  const toast = useToast()
-  const { theme } = useTheme()
-  const dimensions = useTerminalDimensions()
-
-  return (
-    <Show when={toast.currentToast}>
-      {(current) => (
-        <box
-          position="absolute"
-          justifyContent="center"
-          alignItems="flex-start"
-          top={2}
-          right={2}
-          maxWidth={Math.min(60, dimensions().width - 6)}
-          paddingLeft={2}
-          paddingRight={2}
-          paddingTop={1}
-          paddingBottom={1}
-          backgroundColor={theme.backgroundPanel}
-          borderColor={theme[current().variant]}
-          border={["left", "right"]}
-          customBorderChars={SplitBorder.customBorderChars}
-        >
-          <Show when={current().title}>
-            <text attributes={TextAttributes.BOLD} marginBottom={1} fg={theme.text}>
-              {current().title}
-            </text>
-          </Show>
-          <text fg={theme.text} wrapMode="word" width="100%">
-            {current().message}
-          </text>
-        </box>
-      )}
-    </Show>
-  )
-}
-
-function init() {
-  const [store, setStore] = createStore({
-    currentToast: null as ToastOptions | null,
-  })
-
-  let timeoutHandle: NodeJS.Timeout | null = null
-
-  const toast = {
-    show(options: ToastOptions) {
-      const parsedOptions = TuiEvent.ToastShow.properties.parse(options)
-      const { duration, ...currentToast } = parsedOptions
-      setStore("currentToast", currentToast)
-      if (timeoutHandle) clearTimeout(timeoutHandle)
-      timeoutHandle = setTimeout(() => {
-        setStore("currentToast", null)
-      }, duration).unref()
-    },
-    error: (err: any) => {
-      if (err instanceof Error)
-        return toast.show({
-          variant: "error",
-          message: err.message,
-        })
-      toast.show({
-        variant: "error",
-        message: "An unknown error has occurred",
-      })
-    },
-    get currentToast(): ToastOptions | null {
-      return store.currentToast
-    },
-  }
-  return toast
-}
-
-export type ToastContext = ReturnType<typeof init>
-
-const ctx = createContext<ToastContext>()
-
-export function ToastProvider(props: ParentProps) {
-  const value = init()
-  return <ctx.Provider value={value}>{props.children}</ctx.Provider>
-}
-
-export function useToast() {
-  const value = useContext(ctx)
-  if (!value) {
-    throw new Error("useToast must be used within a ToastProvider")
-  }
-  return value
-}