Skip to main content

​
Overview

Display focused content on top of the UI.

​
Import

import { Modal } from 'nikcli-tui';

​
Usage

new Modal({ parent: screen, title: 'Action', content: 'Hello', closable: true });

​
Live Preview

​
Run Locally

npm run tsx:core-gallery

​
Props

  • title?: string — Window label.
  • content?: string — Modal content body.
  • width?: string | number — Default 70%.
  • height?: string | number — Default 60%.
  • closable?: boolean — Enables Esc/q handlers.
  • onClose?: () => void — Called on close.
  • BaseProps: overlay fills screen.

​
Methods

  • setContent(text), setTitle(text), setDimensions(w, h).
  • show(), hide(), close().
  • setClosable(bool), addKeyHandler(keys, fn), removeKeyHandler(keys).

​
Keyboard

  • Esc, q: close (if closable).

​
Installation

npm i nikcli-tui

​
Import

import { Modal } from 'nikcli-tui';

​
Quick Start

const m = new Modal({ parent: screen, title: 'Confirm', content: 'Are you sure?', closable: true });
m.show();

​
Production Examples

const modal = new Modal({ parent: screen, title: 'Action' });
setTimeout(() => modal.close(), 1200);

​
Best Practices

  • Evita modali annidati; preferisci step sequenziali con Stepper o Tabs.