Toolforge Docs
DocsIO PrimitivesselectInput

selectInput

Prompts the user to select from predefined options. Supports various selection modes.

Usage

Select Input

const country = await io.selectInput({
  label: 'Country',
  options: [
    { label: 'United States', value: 'US' },
    { label: 'Canada', value: 'CA' },
  ],
})

Props

PropDescriptionTypeRequiredDefault
labelThe label for the select inputstringYes
descriptionThe description for the select inputstringNoundefined
optionalWhether the select input is optionalbooleanNofalse
optionsThe options for the select input. Each option has label, value, and optional descriptionreadonly SelectOption[]Yes
modeThe mode of the select input'select' | 'multi-select' | 'checkbox' | 'multi-checkbox' | 'radio' | 'radio-card'No'select'
maxRetryAttemptsMaximum retry attempts for invalid inputnumberNo5
defaultValueThe default value for the select inputSelectFieldOutputNoundefined

Returns

Returns the selected option's value (single select) or array of values (multi-select modes). Return type includes | undefined if optional: true. TypeScript infers the exact union type from the provided options.

Examples

Multi-select

Multi-select Input

const languages = await io.selectInput({
  label: 'Spoken Languages',
  options: [
    { label: 'English', value: 'en' },
    { label: 'Spanish', value: 'es' },
    { label: 'French', value: 'fr' },
  ],
  mode: 'multi-select',
})

// Returns: ('en' | 'es' | 'fr')[]

Radio buttons

Radio buttons input

const plan = await io.selectInput({
  label: 'Subscription Plan',
  options: [
    {
      label: 'Basic - $10/month',
      value: 'basic',
      description: 'For individuals',
    },
    {
      label: 'Pro - $30/month',
      value: 'pro',
      description: 'For professionals',
    },
    {
      label: 'Enterprise - Custom',
      value: 'enterprise',
      description: 'For teams',
    },
  ],
  mode: 'radio',
})

Checkboxes

Checkboxes input

const preferences = await io.selectInput({
  label: 'Notification Preferences',
  options: [
    { label: 'Email Notifications', value: 'email' },
    { label: 'SMS Notifications', value: 'sms' },
    { label: 'Push Notifications', value: 'push' },
  ],
  mode: 'multi-checkbox',
})

On this page