RE: Checkbox

Please refer "Grid with selection" pattern in the interface designer or refer the code below

{
  a!localVariables(
    /* This variable is used to persist the checkbox on selected items by holding the identifiers of the selected rows. */
    local!selection,
    /* This variable would be used to pass the full rows of data on the selected items out of this interface, such as to a process model. */
    local!selectedEmployees,
    {
      a!columnsLayout(
        columns:{
          a!columnLayout(
            contents:{
              a!gridField(
                label: "Employee Directory",
                /* Replace the dummy data with a query, rule, or function that returns a datasubset and uses fv!pagingInfo as the paging configuration. */
                data: todatasubset(
                  {
                    a!map(id: 11, name: "Elizabeth Ward",  dept: "Engineering",     role: "Senior Engineer",       team: "Front-End Components",     pto: 15, startDate: today()-500),
                    a!map(id: 22, name: "Michael Johnson", dept: "Finance",         role: "Payroll Manager",       team: "Accounts Payable",         pto: 2,  startDate: today()-100),
                    a!map(id: 33, name: "John Smith",      dept: "Engineering",     role: "Quality Engineer",      team: "User Acceptance Testing",  pto: 5,  startDate: today()-1000),
                    a!map(id: 44, name: "Diana Hellstrom", dept: "Engineering",     role: "UX Designer",           team: "User Experience",          pto: 49, startDate: today()-1200),
                    a!map(id: 55, name: "Francois Morin",  dept: "Sales",           role: "Account Executive",     team: "Commercial North America", pto: 15, startDate: today()-700),
                    a!map(id: 66, name: "Maya Kapoor",     dept: "Sales",           role: "Regional Director",     team: "Front-End Components",     pto: 15, startDate: today()-1400),
                    a!map(id: 77, name: "Anthony Wu",      dept: "Human Resources", role: "Benefits Coordinator",  team: "Accounts Payable",         pto: 2,  startDate: today()-300)
                  },
                  fv!pagingInfo
                ),
                columns: {
                  a!gridColumn(
                    label: "Name",
                    sortField: "name",
                    value: fv!row.name
                  ),
                  a!gridColumn(
                    label: "Department",
                    sortField: "dept",
                    value: fv!row.dept
                  ),
                  a!gridColumn(
                    label: "Start Date",
                    sortField: "startDate",
                    value: fv!row.startDate,
                    align: "END"
                  )
                },
                pageSize: 7,
                selectable: true,
                selectionValue: local!selection,
                selectionSaveInto: {
                  local!selection,
                  /* This save adds the full rows of data for items selected in the most recent user interaction to local!selectedEmployees. */
                  a!save(local!selectedEmployees, append(local!selectedEmployees, fv!selectedRows)),
                  /* This save removes the full rows of data for items deselected in the most recent user interaction to local!selectedEmployees. */
                  a!save(local!selectedEmployees, difference(local!selectedEmployees, fv!deselectedRows))
                }
              )
            }
          )
        },
        stackWhen: {
          "PHONE",
          "TABLET_PORTRAIT"
        }
      )
    }
  )
}

You will have to configure your variable as an array value and when you save the values you need to append to the variable.

a!localVariables(
  local!save,
  a!checkboxField(
    choiceLabels: {1,2,3},
    choiceValues: {"a","b","c"},
    value: local!save,
    saveInto: local!save,
    
  )
)