[PR #78] [CLOSED] feat: scroll box component #1054

New issue

Closed

opened 2026-03-14 09:15:55 +03:00 by kerem · 0 comments

kerem commented

2026-03-14 09:15:55 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/anomalyco/opentui/pull/78
Author: @Leka74
Created: 8/25/2025
Status: ❌ Closed

Base: main ← Head: feat/scroll-box-implementation

📝 Commits (2)

a270b00 feat: scrollbox component
bffed2b remove comment

📊 Changes

17 files changed (+551 additions, -19 deletions)

View changed files

📝 packages/core/src/Renderable.ts (+18 -1)
📝 packages/core/src/buffer.ts (+2 -0)
📝 packages/core/src/lib/selection.ts (+4 -5)
📝 packages/core/src/renderables/Box.ts (+18 -0)
➕ packages/core/src/renderables/ScrollBox.ts (+245 -0)
📝 packages/core/src/renderables/Text.ts (+12 -5)
📝 packages/core/src/renderables/index.ts (+1 -0)
📝 packages/core/src/renderer.ts (+45 -0)
📝 packages/core/src/types.ts (+4 -0)
📝 packages/core/src/zig.ts (+29 -1)
📝 packages/core/src/zig/buffer.zig (+16 -4)
📝 packages/core/src/zig/lib.zig (+8 -0)
➕ packages/react/examples/scroll-box.tsx (+125 -0)
📝 packages/react/jsx-namespace.d.ts (+2 -0)
📝 packages/react/src/components/index.ts (+2 -0)
📝 packages/react/src/types/components.ts (+11 -3)
📝 packages/solid/src/elements/index.ts (+9 -0)

📄 Description

I wanted to have some sort of a box component which the content can be scrollable. This maybe could've also be done as part of the box component as well.

Works similarly to the box component, with the addition of showScrollIndicator and scrollStep properties. You'll have to add a height to the component to get the main benefit of this. Maybe that property has to be required if this ends up being a separate component and not just an update of box

fyi: part of this has been vibe coded.

https://github.com/user-attachments/assets/3cfb9e99-69ca-43a4-bacf-844390b40ed1

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/anomalyco/opentui/pull/78 **Author:** [@Leka74](https://github.com/Leka74) **Created:** 8/25/2025 **Status:** ❌ Closed **Base:** `main` ← **Head:** `feat/scroll-box-implementation` --- ### 📝 Commits (2) - [`a270b00`](https://github.com/anomalyco/opentui/commit/a270b00cdeb59a24559e6d0fd63ff7bcec4eb9f1) feat: scrollbox component - [`bffed2b`](https://github.com/anomalyco/opentui/commit/bffed2b1c8c0d35b3a36a710feffda886520f670) remove comment ### 📊 Changes **17 files changed** (+551 additions, -19 deletions) <details> <summary>View changed files</summary> 📝 `packages/core/src/Renderable.ts` (+18 -1) 📝 `packages/core/src/buffer.ts` (+2 -0) 📝 `packages/core/src/lib/selection.ts` (+4 -5) 📝 `packages/core/src/renderables/Box.ts` (+18 -0) ➕ `packages/core/src/renderables/ScrollBox.ts` (+245 -0) 📝 `packages/core/src/renderables/Text.ts` (+12 -5) 📝 `packages/core/src/renderables/index.ts` (+1 -0) 📝 `packages/core/src/renderer.ts` (+45 -0) 📝 `packages/core/src/types.ts` (+4 -0) 📝 `packages/core/src/zig.ts` (+29 -1) 📝 `packages/core/src/zig/buffer.zig` (+16 -4) 📝 `packages/core/src/zig/lib.zig` (+8 -0) ➕ `packages/react/examples/scroll-box.tsx` (+125 -0) 📝 `packages/react/jsx-namespace.d.ts` (+2 -0) 📝 `packages/react/src/components/index.ts` (+2 -0) 📝 `packages/react/src/types/components.ts` (+11 -3) 📝 `packages/solid/src/elements/index.ts` (+9 -0) </details> ### 📄 Description I wanted to have some sort of a box component which the content can be scrollable. This maybe could've also be done as part of the `box` component as well. Works similarly to the box component, with the addition of `showScrollIndicator` and `scrollStep` properties. You'll have to add a `height` to the component to get the main benefit of this. Maybe that property has to be required if this ends up being a separate component and not just an update of `box` fyi: part of this has been vibe coded. https://github.com/user-attachments/assets/3cfb9e99-69ca-43a4-bacf-844390b40ed1 --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>