@teaui/core
Version:
A high-level terminal UI library for Node
113 lines • 3.23 kB
JavaScript
import { Container } from '../Container.js';
import { Style } from '../Style.js';
import { Rect, Size } from '../geometry.js';
import { isMouseClicked, toHotKeyDef, } from '../events/index.js';
/**
* A modal overlay that is rendered above the main view tree.
*
* Pass a Modal instance to `viewport.requestModal(modal)` to present it.
* The ModalManager sets `presentedRect` and `windowSize` before rendering.
*
* Usage:
* const modal = new Modal({
* dim: true,
* dismissOnClick: true,
* dismissOnEsc: true,
* onDismiss: () => { ... },
* children: [myContent],
* })
* viewport.requestModal(modal)
*/
export class Modal extends Container {
#dim;
#dimStyle;
#dismissOnClick;
#dismissOnEsc;
#onDismiss;
/**
* The rect of the view that called `viewport.requestModal()`, in absolute
* screen coordinates. Set by ModalManager before rendering.
*/
presentedRect = Rect.zero;
/**
* The full screen/window size. Set by ModalManager before rendering.
*/
windowSize = Size.zero;
constructor(props = {}) {
super(props);
this.#dim = props.dim ?? false;
this.#dimStyle = props.dimStyle;
this.#dismissOnClick = props.dismissOnClick ?? true;
this.#dismissOnEsc = props.dismissOnEsc ?? false;
this.#onDismiss = props.onDismiss;
}
update(props) {
this.#update(props);
super.update(props);
}
#update(props) {
this.#dim = props.dim ?? false;
this.#dimStyle = props.dimStyle;
this.#dismissOnClick = props.dismissOnClick ?? true;
this.#dismissOnEsc = props.dismissOnEsc ?? false;
this.#onDismiss = props.onDismiss;
}
get dim() {
return this.#dim;
}
set dim(value) {
this.#dim = value;
}
get dimStyle() {
return this.#dimStyle;
}
set dimStyle(value) {
this.#dimStyle = value;
}
get dismissOnClick() {
return this.#dismissOnClick;
}
set dismissOnClick(value) {
this.#dismissOnClick = value;
}
get dismissOnEsc() {
return this.#dismissOnEsc;
}
set dismissOnEsc(value) {
this.#dismissOnEsc = value;
}
get onDismiss() {
return this.#onDismiss;
}
set onDismiss(value) {
this.#onDismiss = value;
}
receiveMouse(event, _system) {
if (this.#dismissOnClick && isMouseClicked(event)) {
this.#onDismiss?.();
}
}
receiveKey(event) {
if (this.#dismissOnEsc && event.name === 'escape') {
this.#onDismiss?.();
}
}
render(viewport) {
if (this.#dim) {
const style = this.#dimStyle ??
new Style({
foreground: this.purpose.dimTextColor,
background: this.purpose.dimBackgroundColor,
});
viewport.restyle(style);
}
if (this.#dismissOnClick) {
viewport.registerMouse('mouse.button.left');
}
if (this.#dismissOnEsc) {
viewport.registerHotKey(toHotKeyDef('escape'));
}
super.render(viewport);
}
}
//# sourceMappingURL=Modal.js.map