mirror of
https://github.com/sst/opencode.git
synced 2025-12-23 10:11:41 +00:00
chore: format code
This commit is contained in:
parent
82ebf66cba
commit
8167e90801
2 changed files with 108 additions and 163 deletions
|
|
@ -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) {
|
|||
</>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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");
|
||||
const defaultRgba = defaultColor instanceof RGBA ? defaultColor : RGBA.fromHex((defaultColor as string) || "#000000")
|
||||
|
||||
let cachedFrameIndex = -1;
|
||||
let cachedState: ScannerState | null = null;
|
||||
let cachedFrameIndex = -1
|
||||
let cachedState: ScannerState | null = null
|
||||
|
||||
return (
|
||||
frameIndex: number,
|
||||
charIndex: number,
|
||||
_totalFrames: number,
|
||||
totalChars: number,
|
||||
) => {
|
||||
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;
|
||||
const { isHolding, holdProgress, holdTotal, movementProgress, movementTotal } = state
|
||||
|
||||
let alpha = 1.0;
|
||||
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);
|
||||
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;
|
||||
const r = baseRgba.r * factor
|
||||
const g = baseRgba.g * factor
|
||||
const b = baseRgba.b * factor
|
||||
|
||||
return RGBA.fromValues(r, g, b, 1.0);
|
||||
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)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue