#Confirm

Ask for confirmation before an important action. Call the API and await the user's choice.

#Configure the entry once

Wrap the application in ConfigProvider and call useConfirm() in a child component. Each confirmation inherits the caller's theme and language without managing open state.

import { ConfigProvider } from '@ifhover/leaf-ui';

export function Root() {
  return <ConfigProvider><App /></ConfigProvider>;
}

#Async confirmation

import { Button, Space, useConfirm, useMessage } from '@ifhover/leaf-ui';

export function ConfirmBasic() {
  const { confirm } = useConfirm();
  const { message } = useMessage();
  return (
    <Space direction="vertical" align="center">
      <Button
        danger
        variant="outline"
        onClick={async () => {
          const accepted = await confirm({
            title: 'Delete project',
            children: 'This cannot be undone. Continue?',
            type: 'danger',
            onConfirm: () => new Promise((resolve) => setTimeout(resolve, 900)),
          });
          if (accepted) message.success('Project deleted');
        }}
      >
        Delete project
      </Button>
    </Space>
  );
}

#useConfirm API

The returned object is ConfirmApi.

#ConfirmOptions

#ConfirmProvider API

Use ConfirmProvider at the entry when ConfigProvider is absent. An explicit provider can also create an independent queue for a region.

import { ConfirmProvider } from '@ifhover/leaf-ui';

export function Root() {
  return <ConfirmProvider><App /></ConfirmProvider>;
}

#ConfirmApi

#Types

Import these types when composing options.

import type { ConfirmOptions, ConfirmApi, ConfirmProviderProps } from '@ifhover/leaf-ui';

#Usage

useConfirm() returns { confirm }. Requests sharing an entry appear in sequence, after the previous dialog finishes closing. Async confirmation shows loading and prevents duplicate actions; rejected actions keep the dialog open with an error and can be retried.

The default type has no status icon. Info, warning, success and danger show a bare semantic icon beside the content; danger uses a red exclamation mark. Success hides the cancel button unless showCancel is set.

Confirm is an API-only prompt for brief decisions. Use Modal for forms, multiple steps or complex content.