<RadioGroup />

This component is returned by Settings.useForm().

Example

src/app/settings/page.tsx

import React from "react"
import {Settings} from "attio/client"

import schema from "./schema"

export default Settings.defineWorkspacePage(schema, () => {
  const {Form, RadioGroup} = Settings.useForm(schema)

  return (
    <Form>
      <RadioGroup name="sync_frequency">
        <RadioGroup.Item value="hourly" label="Hourly" />
        <RadioGroup.Item value="daily" label="Daily" />
        <RadioGroup.Item value="weekly" label="Weekly" />
      </RadioGroup>
    </Form>
  )
})

Adding a legend

To add a legend to your radio group, wrap it in a <Fieldset />:

<Fieldset legend="Sync frequency">
  <RadioGroup name="sync_frequency">
    <RadioGroup.Item value="hourly" label="Hourly" />
    <RadioGroup.Item value="daily" label="Daily" />
  </RadioGroup>
</Fieldset>

Props

string

required

The path to the string value of the radio group field in your settings schema.e.g. "sync_frequency", "notifications.method"

boolean

Whether or not the radio group should be disabled.Defaults to false (not disabled).

React.ReactNode

required

The <RadioGroup.Item />s representing the available options.

A <RadioGroup /> component should only have <RadioGroup.Item />s as children.

`<RadioGroup.Item />`

A radio group item representing a single selectable option.

Props

string

required

The value of the radio item that will be stored in the settings when selected.

string

required

The label displayed next to the radio item.

⌘I

Introduction

Guides

Extensions

Workflow blocks

Notifications

Dialogs

Components

Forms

Icons

Settings

GraphQL

Data fetching

Server

System

Legacy

Example

Adding a legend

Props

`<RadioGroup.Item />`

Props

​Example

​Adding a legend

​Props

​<RadioGroup.Item />

​Props

Example

Adding a legend

Props

`<RadioGroup.Item />`

Props