ComponentsCheckbox
Checkbox
stableArrow-key navigable list of toggleable boolean items.
Browser preview is a simulation. The copied component runs in actual terminal apps.
checkbox.tsx
Select features:
❯[x]TypeScript
❯[x]ESLint
❯[ ]Prettier
❯[ ]Husky
checkbox.tsx
Installation
npx orizen-tui@latest add checkbox
if dependency install fails, run: npm install ink@^5.0.1 react@^18.3.1 @types/react@^18.3.18 orizen-tui-core@latest
- Copy and paste the following code into your project.
- Update import paths to match your project setup.
components/ui/orizen/checkbox.tsx
Usage
checkbox.imports.tsx
checkbox.example.tsx
Examples
Usage
checkbox.example1.tsx
Select features:
❯[x]TypeScript
❯[x]ESLint
❯[ ]Prettier
❯[ ]Husky
checkbox.example1.tsx
API Reference
Checkbox
PropTypeDefaultDescription
itemsArray<{ label: string; value: string }>-List of toggleable items
items-
Array<{ label: string; value: string }>List of toggleable items
valuestring[]-Selected values (controlled)
value-
string[]Selected values (controlled)
onChange(values: string[]) => void-Called when item is toggled (controlled)
onChange-
(values: string[]) => voidCalled when item is toggled (controlled)
defaultValuestring[][]Initial values (uncontrolled)
defaultValue[]
string[]Initial values (uncontrolled)
labelstringundefinedHeading above the list
labelundefined
stringHeading above the list
focusbooleantrueWhether list accepts keyboard events
focustrue
booleanWhether list accepts keyboard events