Using groups

Groups are just internal labels (given explicitly) to classify the components, so we can choose which ones we need to draw. If no group is specified, the component will be in the "default" group (literally a string = "default") so they will be drawn with gooi.draw(), with no parameters. In the other hand, if the code looks like this:

btn = gooi.newButton({text = "Start"}):setGroup("main_menu")

or like this:

btn = gooi.newButton({text = "Start", group = "main_menu"})

then this code will be needed to draw this element and any other in the "main_menu" group:

function love.draw()
    gooi.draw("main_menu")
end

Please note:

• If one or more components are not being drawn (using the gooi.draw([string]) function), it doesn't mean they won't react to clicks and stuff. For this reason, setEnabled() or setGroupEnabled() need to be used in conjunction, so we make sure they will be invisible and disabled
• In a different approach, if a component is explicitly hidden using setVisible(false), then we don't need to worry about using setEnabled(false) right after, the component won't do anything as long as we don't show it again
• It's important to differentiate between "groups" and "radio groups", the first ones are for any component, the other ones are for Radio Buttons only, here's a more elaborated example:

require "gooi"
function love.load()
    group = "g1"
    btn = gooi.newButton({text = "See group 2"}):onRelease(function(c)
        if group == "g1" then
            group = "g2"
            c:setText("See group 1")
        else
            group = "g1"
            c:setText("See group 2")
        end
    end)

    leftPanel = gooi.newPanel({
        x = 10,
        y = 100,
        w = 200,
        h = 150,
        layout = "grid 3x1"
    }):add(
        -- "radio_grp" applies for these 3 radios only:
        gooi.newRadio({text = "Radio 1", radioGroup = "radio_grp"}),
        gooi.newRadio({text = "Radio 2", radioGroup = "radio_grp"}),
        gooi.newRadio({text = "Radio 3", radioGroup = "radio_grp"}):select()
    ):setGroup("g1") -- General group

    rightPanel = gooi.newPanel({
        x = 220,
        y = 100,
        w = 200,
        h = 150,
        layout = "grid 3x1"
    }):add(
        gooi.newRadio({text = "Radio 1", radioGroup = "radio_grp_2"}),
        gooi.newRadio({text = "Radio 2", radioGroup = "radio_grp_2"}),
        gooi.newRadio({text = "Radio 3", radioGroup = "radio_grp_2"}):select()
    ):setGroup("g2") -- General group
end
function love.draw()
    gooi.draw()-- draw button
    gooi.draw(group)-- draw the radios
end

function love.mousereleased(x, y, button) gooi.released() end
function love.mousepressed(x, y, button)  gooi.pressed() end

Result: