local Vec3 = require "lib.utils.vec3"
local ui = require "lib.ui.core"
local controls = require "lib.controls"

--- @type Rectangle
local ReactiveRectangle = ui.Rectangle {
    size = Vec3 { 100, 100 },
    color = { 1, 0, 0 },
    state = { tick = 0 }
}
function ReactiveRectangle:update(dt)
    getmetatable(self):update(dt)

    local mx, my = love.mouse.getPosition()
    if mx > self.origin.x and mx < self.origin.x + self.size.x
        and my > self.origin.y and my < self.origin.y + self.size.y
    then
        if controls:isJustPressed("select") then
            controls:consume("select")
        end
        self.color = { 0, 1, 0 }
    else
        self.color = { 1, 0, 0 }
    end

    self.state.tick = self.state.tick + 1
end

local Layout = ui.Root {
    child = ui.Align {
        alignment = "bottom_center",
        child = ui.Row {
            children = {
                ReactiveRectangle
            }
        }
    }
}

return Layout