How to access reactive variables in Stipple?

General Usage
, ,
1

I need to have a reactive vector checks that can change length during the execution time. See below. How can make it work?

Note that push!(model.checks[], false) successfully increases its length. However, the length(model.checks) stays equal to zero inside the page().

using Stipple, StippleUI

@reactive! mutable struct Model <: ReactiveModel
    click::R{Int64} = 0
    checks::R{Vector{Bool}} = falses(0)  
end

function ui(model)
    Stipple.on(model.click) do (_...)
        push!(model.checks[], false)
        @show model.checks[] # the array increases 
    end
    page(model, class = "container", [
        Stipple.cell(class="st-module", [
            Stipple.button("Click", @StippleUI.click("click += 1"))
        ]),
        separator(),
        # However, length(model.checks[]) stays equal to zero
        [checkbox("Checkbox $i", Symbol("checks[$(i-1)]")) for i in 1:length(model.checks[])]...,

    ])
end

model = Stipple.init(Model)

route("/") do
    html(ui(model), context = @__MODULE__)
end

up(async = true)