diff --git a/README.md b/README.md index 5f1349ba8..6df975940 100644 --- a/README.md +++ b/README.md @@ -21,11 +21,13 @@ This monorepo contains the following packages: ## Install ### TypeScript/JavaScript + ```bash bun install @opentui/core ``` ### Go + ```bash go get github.com/sst/opentui/packages/go ``` @@ -33,6 +35,7 @@ go get github.com/sst/opentui/packages/go ## Running Examples (from the repo root) ### TypeScript Examples + ```bash bun install cd packages/core @@ -40,6 +43,7 @@ bun run src/examples/index.ts ``` ### Go Examples + ```bash # Basic example cd packages/go/examples/basic diff --git a/packages/go/README.md b/packages/go/README.md index 1b1529f85..5c5abe3e9 100644 --- a/packages/go/README.md +++ b/packages/go/README.md @@ -5,7 +5,7 @@ Go bindings for [OpenTUI](https://github.com/sst/opentui), a high-performance te ## Features - **High Performance**: Direct bindings to optimized Zig code -- **Memory Safe**: Automatic resource management with Go finalizers +- **Memory Safe**: Automatic resource management with Go finalizers - **Cross-Platform**: Support for Linux, macOS, and Windows - **Full Feature Set**: Complete API coverage including mouse support - **Idiomatic Go**: Proper error handling and Go conventions @@ -29,7 +29,7 @@ package main import ( "time" - + "github.com/sst/opentui/packages/go" ) @@ -37,12 +37,12 @@ func main() { // Create renderer renderer := opentui.NewRenderer(80, 24) defer renderer.Close() - + // Get buffer and draw buffer, _ := renderer.GetNextBuffer() buffer.Clear(opentui.NewRGB(0.1, 0.1, 0.3)) buffer.DrawText("Hello, OpenTUI!", 10, 5, opentui.White, nil, 0) - + // Render to terminal renderer.Render(true) time.Sleep(2 * time.Second) @@ -54,6 +54,7 @@ func main() { ### Core Types #### Renderer + The main rendering engine that manages terminal output. ```go @@ -74,6 +75,7 @@ renderer.Resize(newWidth, newHeight) ``` #### Buffer + A 2D array of terminal cells for efficient rendering. ```go @@ -96,6 +98,7 @@ buffer.DrawBox(5, 5, 30, 10, options, opentui.White, opentui.Gray) ``` #### TextBuffer + Efficient handling of styled text with line tracking. ```go @@ -118,6 +121,7 @@ lines, err := textBuffer.GetLineInfo() ### Colors and Styling #### RGBA Colors + ```go // Predefined colors opentui.Black, opentui.White, opentui.Red, opentui.Green, opentui.Blue @@ -129,6 +133,7 @@ rgb := opentui.NewRGB(0.2, 0.8, 0.4) // Green (alpha = 1.0) ``` #### Text Attributes + ```go opentui.AttrBold // Bold text opentui.AttrItalic // Italic text @@ -160,6 +165,7 @@ opentui.SetCursorColor(opentui.Green) ### Advanced Features #### Direct Buffer Access + For performance-critical operations, you can access buffer arrays directly: ```go @@ -179,6 +185,7 @@ directAccess.SetCell(x, y, opentui.Cell{ ``` #### Hit Testing + For mouse interaction support: ```go @@ -195,10 +202,12 @@ if hitID == 42 { ## Examples See the `examples/` directory for complete working examples: + - `basic/` - Simple "Hello World" example - `console/` - Interactive console demo with mouse support To run examples: + ```bash cd examples/basic && go run . cd examples/console && go run . @@ -227,4 +236,4 @@ go test ## License -MIT License - see main repository for details. \ No newline at end of file +MIT License - see main repository for details. diff --git a/packages/go/examples/console/README.md b/packages/go/examples/console/README.md index e2ad9e71c..87de81cf1 100644 --- a/packages/go/examples/console/README.md +++ b/packages/go/examples/console/README.md @@ -15,11 +15,13 @@ This demo recreates the OpenTUI console logging demo from TypeScript, showcasing ## Controls ### Keyboard Controls + - **1-5**: Trigger buttons (LOG, INFO, WARN, ERROR, DEBUG) - **q/Q**: Quit demo - **ESC**: Exit ### Mouse Controls (if supported) + - **Click**: Click on buttons to trigger them - **Hover**: Buttons change color on hover @@ -36,6 +38,7 @@ go build . ## Implementation Highlights ### ConsoleButton Struct + ```go type ConsoleButton struct { ID string @@ -43,13 +46,13 @@ type ConsoleButton struct { Width, Height uint32 Label string LogType string - + // Colors for different states OriginalBg opentui.RGBA - HoverBg opentui.RGBA + HoverBg opentui.RGBA PressBg opentui.RGBA BorderColor opentui.RGBA - + // State tracking IsHovered bool IsPressed bool @@ -59,12 +62,15 @@ type ConsoleButton struct { ``` ### Visual Effects + - **Sparkle Animation**: ✦ symbols appear briefly when buttons are clicked - **Color States**: Buttons change color based on hover/press state - **Alpha Blending**: Smooth color transitions and transparency effects ### Console Logging + Each button type produces different log output: + - **LOG**: Regular console.log output - **INFO**: Informational messages - **WARN**: Warning messages with additional context @@ -72,7 +78,9 @@ Each button type produces different log output: - **DEBUG**: Debug information with variables ### Input Handling + The demo supports multiple input modes: + 1. **Raw Terminal Input**: Direct key reading for responsive controls 2. **Simple Line Input**: Fallback mode for terminals without raw input support 3. **Mouse Events**: ANSI mouse tracking (where supported) @@ -80,11 +88,13 @@ The demo supports multiple input modes: ## Terminal Compatibility Works best in terminals that support: + - ANSI escape sequences - Mouse tracking (optional) - 24-bit color (optional, fallback to 8-bit) Tested terminals: + - ✅ macOS Terminal.app - ✅ iTerm2 - ✅ VSCode Terminal @@ -101,4 +111,4 @@ The demo showcases several OpenTUI Go wrapper features: 5. **Text Attributes**: Bold, italic, and other text styling 6. **Event Loop**: Handling input and rendering in a game-style loop -This serves as both a functional demo and a reference implementation for building interactive terminal applications with the OpenTUI Go wrapper. \ No newline at end of file +This serves as both a functional demo and a reference implementation for building interactive terminal applications with the OpenTUI Go wrapper. diff --git a/packages/react/src/hooks/use-terminal-dimensions.tsx b/packages/react/src/hooks/use-terminal-dimensions.tsx index 6649dd18a..77b0f46c4 100644 --- a/packages/react/src/hooks/use-terminal-dimensions.tsx +++ b/packages/react/src/hooks/use-terminal-dimensions.tsx @@ -9,8 +9,8 @@ export const useTerminalDimensions = () => { width: number height: number }>({ - width: renderer.terminalWidth, - height: renderer.terminalHeight, + width: renderer.width, + height: renderer.height, }) const cb = (width: number, height: number) => { diff --git a/packages/solid/src/elements/hooks.ts b/packages/solid/src/elements/hooks.ts index 60fc81315..d118fa905 100644 --- a/packages/solid/src/elements/hooks.ts +++ b/packages/solid/src/elements/hooks.ts @@ -40,7 +40,7 @@ export const useTerminalDimensions = () => { const [terminalDimensions, setTerminalDimensions] = createSignal<{ width: number height: number - }>({ width: renderer.terminalWidth, height: renderer.terminalHeight }) + }>({ width: renderer.width, height: renderer.height }) const callback = (width: number, height: number) => { setTerminalDimensions({ width, height })