Modal
Modal
jsx
import Modal from '@semcore/ui/modal';
<Modal />;
ModalProps
& & & {...}Name | Type | Description |
---|---|---|
duration | number | Duration of animation, ms |
visible | boolean | This property is responsible for the visibility of the modal window |
onClose | (trigger: "onOutsideClick" | "onCloseClick" | "onEscape", e: React.MouseEvent | React.KeyboardEvent) => void | Function called when the component is hidden |
closable | boolean | Displaying the close button(x) in the upper-right corner of the modal dialog |
disablePreventScroll | boolean | Setting `true` disables mechanism that hides document body scrollbar when Modal is visible |
locale | string | |
ghost | boolean | Props for render modal without background and paddings. Useful in carousel for example |
Modal.Overlay
Component which represents the background. Has all properties as BoxProps prop does.
jsx
import Modal from '@semcore/ui/modal';
<Modal.Overlay />;
Modal.Window
Component which represents the modal window itself. Has all properties as BoxProps prop does.
jsx
import Modal from '@semcore/ui/modal';
<Modal.Window />;
Modal.Close
Component which represents the closing icon. The component is the CloseS
icon with the configured styles. Has all properties as BoxProps prop and IconProps prop does.
jsx
import Modal from '@semcore/ui/modal';
<Modal.Close />;
Modal.Title
Component which represents the title. It adds aria-labelledby
attribute to modal window. Has all properties as TextProps prop does.
jsx
import Modal from '@semcore/ui/modal';
<Modal.Title />;