Norway Porridge Makers

    material-ui-fullscreen-dialog

    1.1.0 • Public • Published

    material-ui-fullscreen-dialog

    This project provides a fullscreen dialog for Material-UI.

    Demo

    If you want to try the component yourself instead of watching a gif, head over to the storybook for a live demo!

    Installation

    npm i --save material-ui-fullscreen-dialog

    Usage

    import FullscreenDialog from 'material-ui-fullscreen-dialog'
     
    <FullscreenDialog
      open={this.state.open}
      onRequestClose={() => this.setState({ open: false })}
      title={'Demo dialog'}
      actionButton={<FlatButton
        label='Done'
        onClick={() => this.setState({ open: false })}
      />}
    >
      // dialog content here
    </FullscreenDialog>

    Properties

    Name Type Default Description
    actionButton node A FlatButton or IconButton that is used as affirmative action button.
    appBarClassName string Set the CSS classes of the app bar.
    appBarStyle object Overrides the inline-styles of the app bar.
    appBarZDepth number 1 Overrides the z-depth of the app bar, will affect its shadow. This is ignored if immersive is set to true.
    children node Children elements.
    closeIcon node Close icon Icon element used for the dismissive action. This is hidden if onRequestClose is not set.
    containerClassName string Set the CSS classes of the dialog's children container.
    containerStyle object Overrides the inline-styles of the dialog's children container.
    immersive bool false Toggles the immersive mode. If set to true, the app bar has a semi-transparent gradient and overlays the content.
    onRequestClose function Callback that is invoked when the dismissive action button is touched.
    open * bool Controls whether the dialog is opened or not.
    style object Overrides the inline-styles of the dialog's root element.
    title string The title of the dialog.
    titleStyle object Overrides the inline-styles of the app bar's title element.

    * required property

    Credits

    The code for the animation was adapted from Material UI's Dialog, although the animation itself is different.

    License

    The files included in this repository are licensed under the MIT license.

    Install

    npm i material-ui-fullscreen-dialog

    DownloadsWeekly Downloads

    1,634

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    421 kB

    Total Files

    14

    Last publish

    Collaborators

    • evidence
    • saschb2b
    • lemaik
    • redbeard0091