diff --git a/demo/inline-region.ts b/demo/inline-region.ts index 75a5b92..b13d191 100644 --- a/demo/inline-region.ts +++ b/demo/inline-region.ts @@ -89,7 +89,7 @@ function box(msg: string, fg: number, border: number): Op[] { height: grow(), direction: "ttb", padding: { left: 1 }, - alignY: 2, + alignY: "center", }, border: { color: border, diff --git a/demo/keyboard.ts b/demo/keyboard.ts index 0dce0c3..580b1cc 100644 --- a/demo/keyboard.ts +++ b/demo/keyboard.ts @@ -71,8 +71,8 @@ function key(ops: Op[], k: KeyDef, ctx: AppContext): void { width: fixed(w), height: grow(), padding: { left: 1, right: 1 }, - alignX: 2, - alignY: 2, + alignX: "center", + alignY: "center", }, bg, border: hover @@ -435,8 +435,8 @@ function keyboard(ctx: AppContext): Op[] { width: grow(), height: grow(), direction: "ttb", - alignX: 2, - alignY: 2, + alignX: "center", + alignY: "center", padding: { left: 2, top: 1 }, }, }), @@ -453,7 +453,7 @@ function keyboard(ctx: AppContext): Op[] { layout: { width: grow(), direction: "ltr", - alignY: 0, + alignY: "top", padding: { bottom: 1 }, }, }), @@ -504,7 +504,7 @@ function keyboard(ctx: AppContext): Op[] { // config panel (right) ops.push( - open("", { layout: { width: grow(), direction: "ltr", alignX: 1 } }), + open("", { layout: { width: grow(), direction: "ltr", alignX: "right" } }), ); configPanel(ops, ctx); ops.push(close()); @@ -518,7 +518,7 @@ function keyboard(ctx: AppContext): Op[] { layout: { direction: "ltr", gap: 3, - alignY: 1, + alignY: "bottom", padding: { left: 1, right: 1, top: 1, bottom: 1 }, }, border: { color: kbColor, left: 1, right: 1, top: 1, bottom: 1 }, diff --git a/ops.ts b/ops.ts index 3344eea..c2bcc20 100644 --- a/ops.ts +++ b/ops.ts @@ -115,7 +115,15 @@ export function pack( ); o += 4; - view.setUint32(o, (l.alignX ?? 0) | ((l.alignY ?? 0) << 8), true); + let alignX = l.alignX === "right" ? 1 : l.alignX === "center" ? 2 : 0; + + let alignY = l.alignY === "bottom" + ? 1 + : l.alignY === "center" + ? 2 + : 0; + + view.setUint32(o, alignX | (alignY << 8), true); o += 4; } @@ -248,8 +256,8 @@ export interface OpenElement { padding?: { left?: number; right?: number; top?: number; bottom?: number }; gap?: number; direction?: "ltr" | "ttb"; - alignX?: number; - alignY?: number; + alignX?: "left" | "center" | "right"; + alignY?: "top" | "center" | "bottom"; }; bg?: number; cornerRadius?: { tl?: number; tr?: number; bl?: number; br?: number }; diff --git a/validate.ts b/validate.ts index 248ea48..ef96b99 100644 --- a/validate.ts +++ b/validate.ts @@ -56,8 +56,20 @@ const Layout = Type.Object({ direction: Type.Optional( Type.Union([Type.Literal("ltr"), Type.Literal("ttb")]), ), - alignX: Type.Optional(u8), - alignY: Type.Optional(u8), + alignX: Type.Optional( + Type.Union([ + Type.Literal("left"), + Type.Literal("center"), + Type.Literal("right"), + ]), + ), + alignY: Type.Optional( + Type.Union([ + Type.Literal("top"), + Type.Literal("center"), + Type.Literal("bottom"), + ]), + ), }); const CornerRadius = Type.Object({