feat: Added HoverCursorStyle to APIs using OSC 22#676
feat: Added HoverCursorStyle to APIs using OSC 22#676kommander merged 17 commits intoanomalyco:mainfrom
Conversation
viralcodex
requested review from
Hona,
kitlangton,
kommander,
msmps and
simonklee
as code owners
@opentui/core
@opentui/react
@opentui/solid
@opentui/core-darwin-arm64
@opentui/core-darwin-x64
@opentui/core-linux-arm64
@opentui/core-linux-x64
@opentui/core-win32-arm64
@opentui/core-win32-x64
commit: |
kommander
left a comment
kommander
left a comment
There was a problem hiding this comment.
We can keep this lower level for the lib and let solid/react or the app level take care of how and when to apply the cursor style.
packages/core/src/ansi.ts
Outdated
| moveCursor: (row: number, col: number) => `\x1b[${row};${col}H`, | ||
| moveCursorAndClear: (row: number, col: number) => `\x1b[${row};${col}H\x1b[J`, | ||
|
|
||
| setMousePointer: (shape: string) => `\x1b]22;${shape}\x07`, |
There was a problem hiding this comment.
I think this should be on the zig side, passing the option down.
There was a problem hiding this comment.
ok moving the whole setting the mouse pointer to zig side
packages/core/src/renderer.ts
Outdated
| maybeRenderable.processMouseEvent(event) | ||
| } | ||
|
|
||
| this.updateMousePointerOnHover(maybeRenderable) |
There was a problem hiding this comment.
Not every Renderable is potentially hoverable, but I see where that is coming from. I thought that maybe that could be something that an app controls itself? It would be like:
r.onMouseOver = (evt) => evt.target.ctx.setCursorStyle(...)
packages/core/src/renderer.ts
Outdated
| } | ||
| } | ||
|
|
||
| public setMousePointer(shape: MousePointerStyle): void { |
There was a problem hiding this comment.
There is a method setCursorStyle already, which takes options that could be adjusted. It's currently this:
public static setCursorStyle(
renderer: CliRenderer,
style: CursorStyle,
blinking: boolean = false,
color?: RGBA,
): void {It's messy, so we could make that proper like:
public static setCursorStyle(
renderer: CliRenderer,
options: CursorStyleOptions
): void {Where the CursorStyleOptions become:
export interface cursorstyleoptions {
style: "block" | "line" | "underline"
blinking: boolean,
color: RGBA,
cursor: "default" | "pointer" | "text" | "crosshair" | "move" | "not-allowed"
}Then it can be properly packed as FFI Struct in zig-structs.ts and passed down to zig, which can hold the cursor state and update the changed values.
There was a problem hiding this comment.
there are two setCursorStyles here in the class, one is static one that you mentioned and one instance method, should I update that with this as well?
Then I will have to change the signature at a lot of places
|
Hi @kommander, Also, since mouse pointer and Cursor styles were mandatory in the object/struct, I had to pass defaults everytime I was making an update to one of them, so made all props optional, and update as the app required. Also made change to let the app decide instead of passing a prop to the elements. I could be missing something or may have written something in a wrong way, so please let me know and I'll fix it. |
|
here's verifying both cursor and mouse pointer: opentui.mp4 |
packages/core/src/renderer.ts
Outdated
| this._destroyFinalized = true | ||
| this._destroyPending = false | ||
|
|
||
| this.resetMousePointer() |
There was a problem hiding this comment.
This should happen in Terminal.zig, in the shutdown sequence I think.
There was a problem hiding this comment.
Must have missed it from 1st commit, will do it.
|
Looks way better 👍 thanks! You think we could update the docs here as well, like the website docs? cc @simonklee maybe you can glimpse over it as well, I think it looks good and can be iterated on. |
|
@kommander thanks, yes we can, should I add the web docs change here as well, or should I raise a separate PR after merging this one? Whatever works for you guys :) |
|
When @simonklee is fine we can merge this and document in another PR |
|
Thanks, will raise another PR and link it here for the documentation |
3 participants
Fixes: #611
Hi @kommander,
Added Custom cursor styles for the openTUI API through MouseCursorStyle.
Includes: pointer, disabled, crosshair, and move.
Used OSC 22 and demo-ed on kitty terminal.
I have added all of them for usage (and future usage) but I can remove them if needed.
Child elements can override the parent hoverCursorStyle.
Also on shutdown the states reset to default cursors (added shutdown code in both native and typescript code)
opentui2.mp4
Let me know if changes are needed, will do accordingly.
Thanks :)