venik

✨ Simple API

import { Node, Edge, Justify, Align, Direction } from "venik";

const hud = new Node();
hud.setPadding(Edge.All, 16);
hud.setJustifyContent(Justify.SpaceBetween);
hud.setAlignItems(Align.FlexEnd);

const healthBar = new Node();
healthBar.setWidth("25%");
healthBar.setHeight(24);
hud.insertChild(healthBar, 0);

// Runs every frame. A clean tree returns immediately;
// a dirty one revisits only dirty branches.
function frame(w: number, h: number) {
  hud.setWidth(w);
  hud.setHeight(h);
  hud.calculateLayout(undefined, undefined, Direction.LTR);

  drawRect(
    healthBar.getComputedLeft(),
    healthBar.getComputedTop(),
    healthBar.getComputedWidth(),
    healthBar.getComputedHeight(),
  );
}