NcModal
Props
Prop name | Description | Type | Values | Default |
---|---|---|---|---|
title | Title to be shown with the modal | string | - | '' |
hasPrevious | Declare if a previous slide is available | boolean | - | false |
hasNext | Declare if a next slide is available | boolean | - | false |
outTransition | Declare if hiding the modal should be animated | boolean | - | false |
enableSlideshow | Declare if the slideshow functionality should be enabled | boolean | - | false |
slideshowDelay | Declare the slide interval | number | - | 5000 |
slideshowPaused | Allow to pause an ongoing slideshow | boolean | - | false |
enableSwipe | Enable swipe between slides | boolean | - | true |
spreadNavigation | boolean | - | false | |
size | Defines the modal size. Default is 'normal'. Available are 'small', 'normal', 'large' and 'full'. All sizes except 'small' change automatically to full-screen on mobile. | string | - | 'normal' |
canClose | Declare if the modal can be closed | boolean | - | true |
dark | Makes the modal backdrop black if true | boolean | - | false |
container | Selector for the modal container, pass null to prevent automatic container mounting | string|null | - | 'body' |
closeButtonContained | Pass in false if you want the modal 'close' button to be displayed outside the modal boundaries, in the top right corner of the window | boolean | - | true |
additionalTrapElements | Additional elements to add to the focus trap | array | - | [] |
inlineActions | Display x items inline<br/>@see Actions component usage | number | - | 0 |
Events
Event name | Properties | Description |
---|---|---|
previous | ||
next | ||
close | Emitted when the closing animation is finished |
Slots
Name | Description | Bindings |
---|---|---|
actions | List of actions to show | |
default | Modal content to render |
loading...
Modal with more properties
loading...
Usage of popover in modal
- Set container property to .modal-mask to inject popover context of the modal:
loading...