Skip to main contentSkip to filter inputPrimer

SimpleSelect

SimpleSelect is a lightweight component designed to act as a <select> or a dropdown without filtering functionality. It supports single and multiple selection modes, as well as grouping and controlled states.

Internal Component

This component is intended solely for use within GitHub and is not available for external use.
React
draft
Docs|Storybook|Source|Usage

Props

SimpleSelect

NameDefaultDescription
selectionVariant Required
single
"single" | "multiple"

Whether multiple items can be selected

items Required
Items[]

Array of selectable items

onSelect
((selectedItem: Items) => void) | undefined

Callback when an item is selected

selectable
((items: Items[]) => void) | undefined

Callback for controlled selection state

buttonProps
undefined
ButtonProps

Props for customizing the trigger button

outsideClick
save
"save" | "cancel" | undefined

Action to take when clicking outside - either save or cancel

onEscape
save
"save" | "cancel" | undefined

Action to take when escape is pressed - either save or cancel

title
Select an item
string

Dialog title

focusTarget
first-target
"first-item" | "first-target" | undefined

Which element should receive initial focus

footerButtons
FooterButtons[] | undefined

Custom footer buttons

label
string

Static text label

renderText
(() => ReactNode) | undefined

Custom render function for the label

variant
overlay
"overlay" | "modal" | undefined

Use overlay presentation Use modal presentation

dialogProps
SimpleSelectDialogProps

Props to customize the modal dialog

onSave
((items: Items[]) => void) | undefined

Save callback is optional if no footer is needed Callback when selection is saved

onCancel
((items: Items[]) => void) | undefined

Cancel callback is optional if no footer is needed Callback when selection is cancelled