summaryrefslogtreecommitdiffhomepage
path: root/packages
diff options
context:
space:
mode:
authorGitHub Action <[email protected]>2025-11-24 18:40:01 +0000
committerGitHub Action <[email protected]>2025-11-24 18:40:01 +0000
commit8167e9080148a72bdf1460dbcd0da99ddc2ca8cb (patch)
tree10b6c81d0bd3160fb1256d31c0c6744d63999143 /packages
parent82ebf66cbada3513fdfee7af784dfcf120462fec (diff)
downloadopencode-8167e9080148a72bdf1460dbcd0da99ddc2ca8cb.tar.gz
opencode-8167e9080148a72bdf1460dbcd0da99ddc2ca8cb.zip
chore: format code
Diffstat (limited to 'packages')
-rw-r--r--packages/opencode/src/cli/cmd/tui/component/prompt/index.tsx9
-rw-r--r--packages/opencode/src/cli/cmd/tui/ui/spinner.ts272
2 files changed, 113 insertions, 168 deletions
diff --git a/packages/opencode/src/cli/cmd/tui/component/prompt/index.tsx b/packages/opencode/src/cli/cmd/tui/component/prompt/index.tsx
index 4e2fa9d35..7a4813702 100644
--- a/packages/opencode/src/cli/cmd/tui/component/prompt/index.tsx
+++ b/packages/opencode/src/cli/cmd/tui/component/prompt/index.tsx
@@ -1,6 +1,6 @@
import { BoxRenderable, TextareaRenderable, MouseEvent, PasteEvent, t, dim, fg, type KeyBinding } from "@opentui/core"
import { createEffect, createMemo, type JSX, onMount, createSignal, onCleanup, Show, Switch, Match } from "solid-js"
-import "opentui-spinner/solid";
+import "opentui-spinner/solid"
import { useLocal } from "@tui/context/local"
import { useTheme } from "@tui/context/theme"
import { EmptyBorder } from "@tui/component/border"
@@ -830,11 +830,7 @@ export function Prompt(props: PromptProps) {
justifyContent={status().type === "retry" ? "space-between" : "flex-start"}
>
<box flexShrink={0} flexDirection="row" gap={1}>
- <spinner
- color={spinnerDef().color}
- frames={spinnerDef().frames}
- interval={40}
- />
+ <spinner color={spinnerDef().color} frames={spinnerDef().frames} interval={40} />
<box flexDirection="row" gap={1} flexShrink={0}>
{(() => {
const retry = createMemo(() => {
@@ -904,4 +900,3 @@ export function Prompt(props: PromptProps) {
</>
)
}
-
diff --git a/packages/opencode/src/cli/cmd/tui/ui/spinner.ts b/packages/opencode/src/cli/cmd/tui/ui/spinner.ts
index e09b079b4..5c99acccb 100644
--- a/packages/opencode/src/cli/cmd/tui/ui/spinner.ts
+++ b/packages/opencode/src/cli/cmd/tui/ui/spinner.ts
@@ -1,23 +1,23 @@
-import type { ColorInput } from "@opentui/core";
-import { RGBA } from "@opentui/core";
-import type { ColorGenerator } from "opentui-spinner";
+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 };
+ colors: ColorInput[]
+ trailLength: number
+ defaultColor?: ColorInput
+ direction?: "forward" | "backward" | "bidirectional"
+ holdFrames?: { start?: number; end?: number }
}
interface ScannerState {
- activePosition: number;
- isHolding: boolean;
- holdProgress: number;
- holdTotal: number;
- movementProgress: number;
- movementTotal: number;
- isMovingForward: boolean;
+ activePosition: number
+ isHolding: boolean
+ holdProgress: number
+ holdTotal: number
+ movementProgress: number
+ movementTotal: number
+ isMovingForward: boolean
}
function getScannerState(
@@ -25,12 +25,12 @@ function getScannerState(
totalChars: number,
options: Pick<AdvancedGradientOptions, "direction" | "holdFrames">,
): ScannerState {
- const { direction = "forward", holdFrames = {} } = options;
+ const { direction = "forward", holdFrames = {} } = options
if (direction === "bidirectional") {
- const forwardFrames = totalChars;
- const holdEndFrames = holdFrames.end ?? 0;
- const backwardFrames = totalChars - 1;
+ const forwardFrames = totalChars
+ const holdEndFrames = holdFrames.end ?? 0
+ const backwardFrames = totalChars - 1
if (frameIndex < forwardFrames) {
// Moving forward
@@ -42,7 +42,7 @@ function getScannerState(
movementProgress: frameIndex,
movementTotal: forwardFrames,
isMovingForward: true,
- };
+ }
} else if (frameIndex < forwardFrames + holdEndFrames) {
// Holding at end
return {
@@ -53,10 +53,10 @@ function getScannerState(
movementProgress: 0,
movementTotal: 0,
isMovingForward: true,
- };
+ }
} else if (frameIndex < forwardFrames + holdEndFrames + backwardFrames) {
// Moving backward
- const backwardIndex = frameIndex - forwardFrames - holdEndFrames;
+ const backwardIndex = frameIndex - forwardFrames - holdEndFrames
return {
activePosition: totalChars - 2 - backwardIndex,
isHolding: false,
@@ -65,19 +65,18 @@ function getScannerState(
movementProgress: backwardIndex,
movementTotal: backwardFrames,
isMovingForward: false,
- };
+ }
} else {
// Holding at start
return {
activePosition: 0,
isHolding: true,
- holdProgress:
- frameIndex - forwardFrames - holdEndFrames - backwardFrames,
+ holdProgress: frameIndex - forwardFrames - holdEndFrames - backwardFrames,
holdTotal: holdFrames.start ?? 0,
movementProgress: 0,
movementTotal: 0,
isMovingForward: false,
- };
+ }
}
} else if (direction === "backward") {
return {
@@ -88,7 +87,7 @@ function getScannerState(
movementProgress: frameIndex % totalChars,
movementTotal: totalChars,
isMovingForward: false,
- };
+ }
} else {
return {
activePosition: frameIndex % totalChars,
@@ -98,7 +97,7 @@ function getScannerState(
movementProgress: frameIndex % totalChars,
movementTotal: totalChars,
isMovingForward: true,
- };
+ }
}
}
@@ -106,112 +105,84 @@ function calculateColorIndex(
frameIndex: number,
charIndex: number,
totalChars: number,
- options: Pick<
- AdvancedGradientOptions,
- "direction" | "holdFrames" | "trailLength"
- >,
+ options: Pick<AdvancedGradientOptions, "direction" | "holdFrames" | "trailLength">,
state?: ScannerState,
): number {
- const { trailLength } = options;
+ const { trailLength } = options
const { activePosition, isHolding, holdProgress, isMovingForward } =
- state ?? getScannerState(frameIndex, totalChars, options);
+ 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)
+ : 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;
+ return directionalDistance + holdProgress
}
// Normal movement - show gradient trail only behind the movement direction
if (directionalDistance > 0 && directionalDistance < trailLength) {
- return directionalDistance;
+ return directionalDistance
}
// At the active position, show the brightest color
if (directionalDistance === 0) {
- return 0;
+ return 0
}
- return -1;
+ return -1
}
-function createKnightRiderTrail(
- options: AdvancedGradientOptions,
-): ColorGenerator {
- const { colors, defaultColor } = options;
+function createKnightRiderTrail(options: AdvancedGradientOptions): ColorGenerator {
+ const { colors, defaultColor } = 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");
-
- let cachedFrameIndex = -1;
- let cachedState: ScannerState | null = null;
-
- return (
- frameIndex: number,
- charIndex: number,
- _totalFrames: number,
- totalChars: number,
- ) => {
+ const defaultRgba = defaultColor instanceof RGBA ? defaultColor : RGBA.fromHex((defaultColor as string) || "#000000")
+
+ 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);
+ cachedFrameIndex = frameIndex
+ cachedState = getScannerState(frameIndex, totalChars, options)
}
- const state = cachedState!;
+ const state = cachedState!
- const index = calculateColorIndex(
- frameIndex,
- charIndex,
- totalChars,
- options,
- state,
- );
+ 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 alpha = 1.0;
+ const { isHolding, holdProgress, holdTotal, movementProgress, movementTotal } = state
+
+ let alpha = 1.0
if (isHolding && holdTotal > 0) {
// Fade out linearly
- const progress = Math.min(holdProgress / holdTotal, 1);
- alpha = Math.max(0, 1 - progress);
+ const progress = Math.min(holdProgress / holdTotal, 1)
+ alpha = Math.max(0, 1 - progress)
} else if (!isHolding && movementTotal > 0) {
// Fade in linearly during movement
- const progress = Math.min(
- movementProgress / Math.max(1, movementTotal - 1),
- 1,
- );
- alpha = progress;
+ const progress = Math.min(movementProgress / Math.max(1, movementTotal - 1), 1)
+ alpha = progress
}
// Mutate the alpha of the default RGBA object
// This assumes single-threaded, synchronous rendering per frame
// where we can modify the state for the current frame.
// Since this is run for every char in the frame, setting it repeatedly to the same value is fine.
- defaultRgba.a = alpha;
+ defaultRgba.a = alpha
if (index === -1) {
- return defaultRgba;
+ return defaultRgba
}
- return colors[index] ?? defaultRgba;
- };
+ return colors[index] ?? defaultRgba
+ }
}
/**
@@ -220,41 +191,35 @@ function createKnightRiderTrail(
* @param steps Number of gradient steps (default: 6)
* @returns Array of RGBA colors from brightest to darkest
*/
-export function deriveTrailColors(
- brightColor: ColorInput,
- steps: number = 6,
-): RGBA[] {
- const baseRgba =
- brightColor instanceof RGBA
- ? brightColor
- : RGBA.fromHex(brightColor as string);
+export function deriveTrailColors(brightColor: ColorInput, steps: number = 6): RGBA[] {
+ const baseRgba = brightColor instanceof RGBA ? brightColor : RGBA.fromHex(brightColor as string)
- const colors: RGBA[] = [];
+ const colors: RGBA[] = []
for (let i = 0; i < steps; i++) {
// Progressive darkening:
// i=0: 100% brightness (original color)
// i=1: add slight bloom/glare (lighten)
// i=2+: progressively darken
- let factor: number;
+ let factor: number
if (i === 0) {
- factor = 1.0; // Original brightness
+ factor = 1.0 // Original brightness
} else if (i === 1) {
- factor = 1.2; // Slight bloom/glare effect
+ factor = 1.2 // Slight bloom/glare effect
} else {
// Exponential decay for natural-looking trail fade
- factor = Math.pow(0.6, i - 1);
+ factor = Math.pow(0.6, i - 1)
}
- const r = Math.min(1.0, baseRgba.r * factor);
- const g = Math.min(1.0, baseRgba.g * factor);
- const b = Math.min(1.0, baseRgba.b * factor);
+ const r = Math.min(1.0, baseRgba.r * factor)
+ const g = Math.min(1.0, baseRgba.g * factor)
+ const b = Math.min(1.0, baseRgba.b * factor)
- colors.push(RGBA.fromValues(r, g, b, 1.0));
+ colors.push(RGBA.fromValues(r, g, b, 1.0))
}
- return colors;
+ return colors
}
/**
@@ -263,37 +228,31 @@ export function deriveTrailColors(
* @param factor Brightness factor for inactive color (default: 0.2)
* @returns A much darker version suitable for inactive dots
*/
-export function deriveInactiveColor(
- brightColor: ColorInput,
- factor: number = 0.2,
-): RGBA {
- const baseRgba =
- brightColor instanceof RGBA
- ? brightColor
- : RGBA.fromHex(brightColor as string);
-
- const r = baseRgba.r * factor;
- const g = baseRgba.g * factor;
- const b = baseRgba.b * factor;
-
- return RGBA.fromValues(r, g, b, 1.0);
+export function deriveInactiveColor(brightColor: ColorInput, factor: number = 0.2): RGBA {
+ const baseRgba = brightColor instanceof RGBA ? brightColor : RGBA.fromHex(brightColor as string)
+
+ const r = baseRgba.r * factor
+ const g = baseRgba.g * factor
+ const b = baseRgba.b * factor
+
+ return RGBA.fromValues(r, g, b, 1.0)
}
-export type KnightRiderStyle = "blocks" | "diamonds";
+export type KnightRiderStyle = "blocks" | "diamonds"
export interface KnightRiderOptions {
- width?: number;
- style?: KnightRiderStyle;
- holdStart?: number;
- holdEnd?: number;
- colors?: ColorInput[];
+ width?: number
+ style?: KnightRiderStyle
+ holdStart?: number
+ holdEnd?: number
+ colors?: ColorInput[]
/** Single color to derive trail from (alternative to providing colors array) */
- color?: ColorInput;
+ color?: ColorInput
/** Number of trail steps when using single color (default: 6) */
- trailSteps?: number;
- defaultColor?: ColorInput;
+ trailSteps?: number
+ defaultColor?: ColorInput
/** Brightness factor for inactive color when using single color (default: 0.2) */
- inactiveFactor?: number;
+ inactiveFactor?: number
}
/**
@@ -302,10 +261,10 @@ export interface KnightRiderOptions {
* @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 width = options.width ?? 8
+ const style = options.style ?? "diamonds"
+ const holdStart = options.holdStart ?? 30
+ const holdEnd = options.holdEnd ?? 9
const colors =
options.colors ??
@@ -318,13 +277,11 @@ export function createFrames(options: KnightRiderOptions = {}): string[] {
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"));
+ (options.color ? deriveInactiveColor(options.color, options.inactiveFactor) : RGBA.fromHex("#330000"))
const trailOptions = {
colors,
@@ -332,37 +289,32 @@ export function createFrames(options: KnightRiderOptions = {}): string[] {
defaultColor,
direction: "bidirectional" as const,
holdFrames: { start: holdStart, end: holdEnd },
- };
+ }
// Bidirectional cycle: Forward (width) + Hold End + Backward (width-1) + Hold Start
- const totalFrames = width + holdEnd + (width - 1) + holdStart;
+ 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,
- );
+ const index = calculateColorIndex(frameIndex, charIndex, width, trailOptions)
if (style === "diamonds") {
- const shapes = ["⬥", "◆", "⬩", "⬪"];
+ const shapes = ["⬥", "◆", "⬩", "⬪"]
if (index >= 0 && index < trailOptions.colors.length) {
- return shapes[Math.min(index, shapes.length - 1)];
+ return shapes[Math.min(index, shapes.length - 1)]
}
- return "·";
+ 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("");
- });
+ const isActive = index >= 0 && index < trailOptions.colors.length
+ return isActive ? "■" : "⬝"
+ }).join("")
+ })
- return frames;
+ return frames
}
/**
@@ -371,8 +323,8 @@ export function createFrames(options: KnightRiderOptions = {}): string[] {
* @returns ColorGenerator function
*/
export function createColors(options: KnightRiderOptions = {}): ColorGenerator {
- const holdStart = options.holdStart ?? 30;
- const holdEnd = options.holdEnd ?? 9;
+ const holdStart = options.holdStart ?? 30
+ const holdEnd = options.holdEnd ?? 9
const colors =
options.colors ??
@@ -385,13 +337,11 @@ export function createColors(options: KnightRiderOptions = {}): ColorGenerator {
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"));
+ (options.color ? deriveInactiveColor(options.color, options.inactiveFactor) : RGBA.fromHex("#330000"))
const trailOptions = {
colors,
@@ -399,7 +349,7 @@ export function createColors(options: KnightRiderOptions = {}): ColorGenerator {
defaultColor,
direction: "bidirectional" as const,
holdFrames: { start: holdStart, end: holdEnd },
- };
+ }
- return createKnightRiderTrail(trailOptions);
+ return createKnightRiderTrail(trailOptions)
}