Modal

Official

Modal dialog component.

Import:

import { Modal } from 'obsidian';

Signature:

export class Modal implements HistoryHandler

Implements: HistoryHandler

Constructor

new Modal(app: App)

Constructor.

To get the constructor instance, use getModalConstructor from obsidian-typings/implementations.

Property	Type	Description
app	App	The Obsidian app instance.
bgEl	HTMLElement	Background applied to application to dim it
bgOpacity	string	Opacity percentage of the background
containerEl	HTMLElement	The container HTML element for the modal.
contentEl	HTMLElement	The HTML element that represents the content of the modal.
dimBackground	boolean	Whether the background is being dimmed
headerEl	HTMLDivElement	Header element of the modal dialog.
modalEl	HTMLElement	The HTML element that represents the modal.
scope	Scope	The scope for the keymaps.
selection	null \| WindowSelection	Selection logic handler
shouldAnimate	boolean	Whether the modal should animate
shouldRestoreSelection	boolean	Whether the modal should restore the selection when it is opened or closed.
titleEl	HTMLElement	The HTML element that represents the title of the modal.
win	null \| Window	Reference to the global Window object.

Method	Returns	Description
animateClose()	Promise<void>	Performed when animation is complete
animateOpen()	Promise<void>	Performed when animation is started
close()	void	Close the modal.
onClickOutside(evt)	void	Closes the modal when a click occurs outside of it, unless the event was already handled.
onClose()	void	Called when the modal is closed.
onEscapeKey()	void	On escape key press close modal
onHistoryBack()	void	Called when the user navigates back in the history. (Inherited from HistoryHandler)
onHistoryForward()	void	Called when the user navigates forward in the history. (Inherited from HistoryHandler)
onOpen()	Promise<void> \| void	Called when the modal is opened.
onWindowClose()	void	On closing of the modal
open()	void	Show the modal on the the active window. On phones, the modal will animate on screen.
setBackgroundOpacity(opacity)	this	Set the background opacity of the dimmed background.
setCloseCallback(callback)	this	Set the callback to be called when the modal is closed.
setContent(content)	this	Set the content of the modal.
setDimBackground(dim)	this	Set whether the background should be dimmed.
setTitle(title)	this	Set the title of the modal.

Links to this page: