giggles

Confirm

API reference for the Confirm component

A yes/no prompt. Press y to confirm, n to decline, or Enter to accept the default.

The defaultValue prop controls which option is pre-selected. The hint text updates to reflect this — (Y/n) when defaulting to yes, (y/N) when defaulting to no. Unlike Select, Confirm is a one-shot interaction: onSubmit fires once with a boolean and there's no controlled value state.

Confirm is a leaf focus node. When used alongside other interactive components (e.g. a Select), wrap it in a Modal so that FocusTrap steals focus away and y/n/Enter reach it reliably.

Basic Usage
import { Confirm } from 'giggles/ui';

function DeletePrompt() {
  return (
    <Confirm
      message="Delete this file?"
      onSubmit={(yes) => {
        if (yes) deleteFile();
      }}
    />
  );
}

API Reference

Confirm

Prop

Type

Keybindings

KeyAction
yConfirm (yes)
nDecline (no)
EnterAccept default

Examples

Default to no

Default to No
<Confirm
  message="Reset all settings?"
  defaultValue={false}
  onSubmit={(yes) => {
    if (yes) resetSettings();
  }}
/>

On this page