🔧 return Uint8Array from render, fix duplicate element IDs

- Change Term.render() to return Uint8Array instead of string, avoiding
  unnecessary TextDecoder overhead on every frame
- Fix Clay element ID collisions by adding a monotonic index to the hash
- Remove cursor hide/show from the C render path (caller responsibility)
- Update README example and tests to match new return type

Author: cowboyd

README.md

@@ -25,7 +25,7 @@ WebAssembly does: Deno, Node, Bun, browsers, or any other runtime.
                                  |   -> diff against (front) |
                                  |   -> escape bytes         |
 +---------------+                |                           |
-|               |  ANSI string   |                           |
+|               | ANSI byte array|                           |
 | stdout.write  | <============= |                           |
 |               |                |                           |
 +---------------+                +---------------------------+
@@ -55,7 +55,7 @@ const ansi = term.render([
   close(),
 ]);
 
-Deno.stdout.writeSync(new TextEncoder().encode(ansi));
+Deno.stdout.writeSync(ansi);
 ```
 
 ## Development

src/clayterm.c

@@ -347,17 +347,11 @@ void render(struct Clayterm *ct, Clay_RenderCommandArray cmds) {
 
   cells_clear(ct->back, ct->w, ct->h);
 
-  /* hide cursor */
-  buf_str(&ct->out, "\x1b[?25l");
-
   /* walk Clay render commands into back buffer */
   walk(ct, cmds);
 
   /* diff front vs back, emit escape sequences */
   present(ct);
-
-  /* show cursor */
-  buf_str(&ct->out, "\x1b[?25h");
 }
 
 char *output(struct Clayterm *ct) { return ct->out.data; }

src/ops.c

@@ -61,6 +61,7 @@ static Clay_SizingAxis decode_axis(uint32_t *buf, int len, int *i) {
 
 void reduce(struct Clayterm *ct, uint32_t *buf, int len) {
   int i = 0;
+  uint32_t idx = 0;
 
   Clay_BeginLayout();
 
@@ -77,7 +78,7 @@ void reduce(struct Clayterm *ct, uint32_t *buf, int len) {
 
       if (id_len > 0) {
         Clay_String str = {.length = (int32_t)id_len, .chars = id_chars};
-        Clay_ElementId eid = Clay__HashString(str, 0);
+        Clay_ElementId eid = Clay__HashString(str, idx++);
         Clay__OpenElementWithId(eid);
       } else {
         Clay__OpenElement();

term.ts

@@ -7,11 +7,9 @@ export interface TermOptions {
 }
 
 export interface Term {
-  render(ops: Op[]): string;
+  render(ops: Op[]): Uint8Array;
 }
 
-const decoder = new TextDecoder();
-
 export async function createTerm(options: TermOptions): Promise<Term> {
   const { width, height } = options;
   const { memory, statePtr, opsBuf, reduce, output, length } = await load(
@@ -20,11 +18,13 @@ export async function createTerm(options: TermOptions): Promise<Term> {
   );
 
   return {
-    render(ops: Op[]): string {
+    render(ops: Op[]): Uint8Array {
       const len = pack(ops, memory.buffer, opsBuf);
       reduce(statePtr, opsBuf, len);
-      return decoder.decode(
-        new Uint8Array(memory.buffer, output(statePtr), length(statePtr)),
+      return new Uint8Array(
+        memory.buffer,
+        output(statePtr),
+        length(statePtr),
       );
     },
   };

test/term.test.ts

@@ -3,6 +3,8 @@ import { createTerm, type Term } from "../term.ts";
 import { close, grow, open, rgba, text } from "../ops.ts";
 import { print } from "./print.ts";
 
+const decode = (bytes: Uint8Array) => new TextDecoder().decode(bytes);
+
 describe("term", () => {
   let term: Term;
 
@@ -11,19 +13,19 @@ describe("term", () => {
   });
 
   it("renders hello world", () => {
-    const out = print(term.render([
+    const out = print(decode(term.render([
       open("root", {
         layout: { width: grow(), height: grow(), direction: "ttb" },
       }),
       text("Hello, World!"),
       close(),
-    ]), 40, 10);
+    ])), 40, 10);
 
     expect(out).toContain("Hello, World!");
   });
 
   it("renders borders and padding", () => {
-    const out = print(term.render([
+    const out = print(decode(term.render([
       open("box", {
         layout: {
           width: grow(),
@@ -42,7 +44,7 @@ describe("term", () => {
       }),
       text("padded"),
       close(),
-    ]), 40, 10);
+    ])), 40, 10);
 
     expect(out).toEqual(`
 ╭──────────────────────────────────────╮
@@ -56,4 +58,5 @@ describe("term", () => {
 │                                      │
 ╰──────────────────────────────────────╯`.trim());
   });
+
 });