[READ-ONLY] Mirror of https://github.com/bombshell-dev/tty. Platform independent 2D layout engine for terminal applications based on Clay
Merge pull request #42 from bombshell-dev/refactor-alignment
refactor: alignment to use string literals instead of magic numbers
authored by
paul valladares
and committed by
GitHub
(Jun 9, 2026, 2:09 PM -0500)
39785943
9c1f6cd2
+37
-18
+1
-1
examples/inline-regions/index.ts
+1
-1
examples/inline-regions/index.ts
+7
-7
examples/keyboard/index.ts
+7
-7
examples/keyboard/index.ts
···
225
225
width: fixed(w),
226
226
height: grow(),
227
227
padding: { left: 1, right: 1 },
228
-
alignX: 2,
229
-
alignY: 2,
228
+
alignX: "center",
229
+
alignY: "center",
230
230
},
231
231
bg,
232
232
border: hover
···
565
565
width: grow(),
566
566
height: grow(),
567
567
direction: "ttb",
568
-
alignX: 2,
569
-
alignY: 2,
568
+
alignX: "center",
569
+
alignY: "center",
570
570
padding: { left: 2, top: 1 },
571
571
},
572
572
}),
···
583
583
layout: {
584
584
width: grow(),
585
585
direction: "ltr",
586
-
alignY: 0,
586
+
alignY: "top",
587
587
padding: { bottom: 1 },
588
588
},
589
589
}),
···
634
634
635
635
// config panel (right)
636
636
ops.push(
637
-
open("", { layout: { width: grow(), direction: "ltr", alignX: 1 } }),
637
+
open("", { layout: { width: grow(), direction: "ltr", alignX: "right" } }),
638
638
);
639
639
configPanel(ops, ctx);
640
640
ops.push(close());
···
648
648
layout: {
649
649
direction: "ltr",
650
650
gap: 3,
651
-
alignY: 1,
651
+
alignY: "bottom",
652
652
padding: { left: 1, right: 1, top: 1, bottom: 1 },
653
653
},
654
654
border: { color: kbColor, left: 1, right: 1, top: 1, bottom: 1 },
+11
-3
ops.ts
+11
-3
ops.ts
···
132
132
);
133
133
o += 4;
134
134
135
-
view.setUint32(o, (l.alignX ?? 0) | ((l.alignY ?? 0) << 8), true);
135
+
let alignX = l.alignX === "right" ? 1 : l.alignX === "center" ? 2 : 0;
136
+
137
+
let alignY = l.alignY === "bottom"
138
+
? 1
139
+
: l.alignY === "center"
140
+
? 2
141
+
: 0;
142
+
143
+
view.setUint32(o, alignX | (alignY << 8), true);
136
144
o += 4;
137
145
}
138
146
···
283
291
padding?: { left?: number; right?: number; top?: number; bottom?: number };
284
292
gap?: number;
285
293
direction?: "ltr" | "ttb";
286
-
alignX?: number;
287
-
alignY?: number;
294
+
alignX?: "left" | "center" | "right";
295
+
alignY?: "top" | "center" | "bottom";
288
296
};
289
297
bg?: number;
290
298
cornerRadius?: { tl?: number; tr?: number; bl?: number; br?: number };
+4
-5
specs/renderer-spec.md
+4
-5
specs/renderer-spec.md
···
641
641
`props` parameter:
642
642
643
643
- **`layout`** — sizing (width and height, specified via sizing helpers),
644
-
padding (per-side), alignment (currently numeric enum values, with a planned
645
-
transition to string literals), direction (top-to-bottom or left-to-right),
646
-
and gap
644
+
padding (per-side), alignment (`alignX`: `"left"` | `"center"` | `"right"`;
645
+
`alignY`: `"top"` | `"center"` | `"bottom"`, defaulting to left/top when
646
+
omitted), direction (top-to-bottom or left-to-right), and gap
647
647
- **`border`** — per-side border widths and border color
648
648
- **`cornerRadius`** — per-corner radius values, producing rounded box-drawing
649
649
characters
···
657
657
`strikethrough`).
658
658
659
659
These property groups represent the current implementation surface. New groups
660
-
and fields have been added incrementally and more may follow. Alignment values
661
-
are expected to transition from numeric to string-literal form.
660
+
and fields have been added incrementally and more may follow.
662
661
663
662
**Border width and layout interaction.** In the underlying layout engine (Clay),
664
663
border configuration does not affect layout computation. This is Clay's intended
+14
-2
validate.ts
+14
-2
validate.ts
···
56
56
direction: Type.Optional(
57
57
Type.Union([Type.Literal("ltr"), Type.Literal("ttb")]),
58
58
),
59
-
alignX: Type.Optional(u8),
60
-
alignY: Type.Optional(u8),
59
+
alignX: Type.Optional(
60
+
Type.Union([
61
+
Type.Literal("left"),
62
+
Type.Literal("center"),
63
+
Type.Literal("right"),
64
+
]),
65
+
),
66
+
alignY: Type.Optional(
67
+
Type.Union([
68
+
Type.Literal("top"),
69
+
Type.Literal("center"),
70
+
Type.Literal("bottom"),
71
+
]),
72
+
),
61
73
});
62
74
63
75
const CornerRadius = Type.Object({