Modal
The Modal component provides a way to put content in a pop-up dialog that must be closed before interacting with
the main content again.
Basic example with custom size and duration
ReferenceError: React is not definedProps
| Property | Required | Type | Default | Description |
|---|---|---|---|---|
animationDuration | no | Number | 300 | Animation duration in milliseconds (Set to <= 0 to disable animations) |
animationEasing | no | String | cubic-bezier(0.25, 0.46, 0.45, 0.94) | Animation easing function |
dialogClassName | no | String | Class(es) to apply to the modal dialog | |
onHide | yes | Function | Callback that fires as soon as the modal begins closing | |
show | no | Boolean | Whether the modal should be opened or closed | |
size | no | String, oneOf(['sm', 'small', 'large', 'lg']) or a valid css width value, eg. '44%', '900px' | Size variations | |
title | no | Node | Title of the modal, shown at the top of the modal |
Imports
Import React components (including CSS):
import {Modal} from 'pivotal-ui/react/modal';Import CSS only:
import 'pivotal-ui/css/modal';