@jsvision/ui / Placement
Interface: Placement
Defined in: ui/src/view/dsl/stack.ts:50
Where a stack layer sits within the shared overlay box.
Each axis is either 'fill' (span the whole extent) or 'start'/'center'/'end' (align a fixed size given by width/height). An omitted axis defaults to 'fill'. An optional hOffset/ vOffset insets the box away from its anchored edge. Build one with place or the centered/topRight/bottomRight/topLeft conveniences.
Example
import { View, stack, place, okButton, type DrawContext } from '@jsvision/ui';
class Panel extends View {
draw(ctx: DrawContext) { ctx.fill(' ', ctx.color('window')); }
}
// A 10×2 OK button, horizontally centered and pinned one cell above the bottom edge.
const body = new Panel();
const dialog = stack(body, place(okButton(), { h: 'center', v: 'end', vOffset: 1, width: 10, height: 2 }));Properties
h?
optionalh?:PlaceAxis
Defined in: ui/src/view/dsl/stack.ts:52
Horizontal mode (default 'fill').
height?
optionalheight?:number
Defined in: ui/src/view/dsl/stack.ts:58
Fixed height in cells for a non-fill vertical axis.
hOffset?
optionalhOffset?:number
Defined in: ui/src/view/dsl/stack.ts:64
Horizontal inset in cells, applied after the start/center/end position: a positive value moves the layer away from its anchored edge (right for start/center, left for end), then the box is clamped to stay within the content box. Ignored on a 'fill' horizontal axis.
v?
optionalv?:PlaceAxis
Defined in: ui/src/view/dsl/stack.ts:54
Vertical mode (default 'fill').
vOffset?
optionalvOffset?:number
Defined in: ui/src/view/dsl/stack.ts:70
Vertical inset in cells, applied after the start/center/end position: a positive value moves the layer away from its anchored edge (down for start/center, up for end), then the box is clamped to stay within the content box. Ignored on a 'fill' vertical axis.
width?
optionalwidth?:number
Defined in: ui/src/view/dsl/stack.ts:56
Fixed width in cells for a non-fill horizontal axis.