Skip to content
FrameworkJavaScript

Notifier API: show notifications

Display notification messages to users.

Reaching the editor instance

The methods below run on the editor you created with new Blok(). They are available once editor.isReady resolves.

TypeScript
// You already hold the instance returned by the constructor.
const editor = new Blok({ holder: 'editor' });
await editor.isReady;

// Call any API method on it.
editor.caret.setToLastBlock('end');

Methods

notifier.show(options)

void

Show a notification message. Supports simple, confirm, and prompt notifications.

When to use

Built-in toast for lightweight feedback. Set type: 'confirm' or 'prompt' to collect a yes/no or text response.

Parameters

ParameterTypeRequiredDefaultDescription
optionsNotifierOptions | ConfirmNotifierOptions | PromptNotifierOptionsRequiredNotification configuration. Shape depends on type.
options.messagestringRequiredNotification text. May contain HTML.
options.type'alert' | 'confirm' | 'prompt''alert'Notification type. confirm and prompt add action buttons.
options.style'success' | 'error'undefinedBuilt-in visual style for alert notifications.
options.timenumber8000Auto-dismiss delay in ms for every notification type (default 8000).
options.okTextstring'Confirm' / 'Ok'Label for the confirm/submit button (confirm/prompt types only).
options.okHandler(event: Event) => void | (value: string) => voidundefinedConfirm/submit callback. Receives the click event for confirm, or the input value for prompt. Required for prompt notifications.
options.cancelTextstring'Cancel'Label for the cancel button (confirm type only).
options.cancelHandler(event: Event) => voidundefinedCancel/close callback (confirm type only).
options.inputTypestring'text'HTML input type for the prompt's text field (prompt type only).
options.placeholderstringundefinedPlaceholder text for the prompt's input field (prompt type only).
options.defaultstringundefinedDefault value pre-filled in the prompt's input field (prompt type only).

Errors

  • The notifier module fails to load (e.g. blocked by CSP, dynamic import failure).

    [Blok] Failed to display notification. Reason: <error>

    show() never throws or rejects — check the browser console, since the failure is logged rather than propagated to your call site.

TypeScript
// Simple notification
editor.notifier.show({
  message: 'Changes saved',
  style: 'success'
});
// → renders a toast in the corner of the editor; returns nothing to await

// Confirm notification
editor.notifier.show({
  message: 'Delete this block?',
  type: 'confirm',
  okHandler: () => console.log('Confirmed'),
  cancelHandler: () => console.log('Cancelled')
});

// Prompt notification
editor.notifier.show({
  message: 'Enter a title',
  type: 'prompt',
  okHandler: (value) => console.log('Entered:', value)
});