var selected: i32 = -1;
var open: bool = false;
const options = [_][]const u8{ "Apple", "Banana", "Cherry" };

var buffer: [512]u8 = [_]u8{0} ** 512;
var cursor: i32 = 0;
var mark: i32 = 0;

var checkbox_state: bool = false;

const container = Frame{
    .width = @intToFloat(f32, width),
    .height = @intToFloat(f32, height),
    .background = colors.GRAY_800,
    .direction = Direction.COLUMN,
    .padding = Padding.all(16),
    .gap = 16,
};

const row = Frame{
    .direction = Direction.ROW,
    .horizontal_resizing = Resizing.HUG_CONTENT,
    .vertical_resizing = Resizing.HUG_CONTENT,
    .alignment = Alignment.CENTER_LEFT,
    .gap = 8,
};

const f = try ui.nextFrame();
const layout = f.layout;
var controls = f.controls;

try layout.frame(container, "container");

try controls.select("Fruit", &selected, &open, &options);
try controls.input("Why title tho", buffer[0..], &cursor, &mark);

if (try controls.checkbox("Checkbox", checkbox_state)) {
    checkbox_state = !checkbox_state;
}

for (options) |option, i| {
    try layout.frame(row, "row");
    if (try controls.radio(option, selected == i)) {
        selected = @intCast(i32, i);
    }
    try layout.text(option, colors.WHITE, 12);
    layout.end();
}

if (try controls.button("Click here")) {
    std.log.info("Clicked!", .{});
}

layout.end();

try ui.draw();