Node Extensions

.Key(…)

Stable identity for sibling reconciliation:


ItemRow(item).Key(item.Id)

Attach a LuiRef to read geometry and access the live UI Toolkit element:


private readonly LuiRef _panelRef = new();
 
Lui.Div("p-4 bg-slate-900").Ref(_panelRef)

Make any element clickable:


Lui.Div("p-4 bg-slate-800", Lui.Text("Buy"))
    .OnClick(Buy)

Clickable non-button elements are focusable and submit-activatable.

Force focusability on or off:


Lui.Div("...").Focusable(true)
Lui.Button("Decorative", "...", OnClick).Focusable(false)

Set navigation order:


Lui.Button("First", "...", OnFirst).TabIndex(1)
Lui.Button("Second", "...", OnSecond).TabIndex(2)

Setting a tab index also makes the element focusable.

Paint a sprite or texture behind an element:


Lui.Button("Play", "w-64 h-20 text-white", Play)
    .Background(buttonSprite)

Sprite background overloads:


.Background(sprite)
.Background(sprite, new Vector4(left, bottom, right, top))

Texture background overloads:


.Background(texture)
.Background(texture, new Vector4(left, bottom, right, top))

Swap sprite backgrounds by pointer state:


Lui.Button("Play", "w-64 h-20 text-white", Play)
    .Background(normal)
    .HoverBackground(hover)
    .ActiveBackground(pressed)

Active wins over hover.