apeman-react-dialog

apeman react package for dialog component.

Installation

$ npm install apeman-react-dialog --save

Demo

Live demo is hosted on GitHub Pages.

Usage

'use strict'

import React from 'react'
import {
  ApDialog,
  ApDialogHeader,
  ApDialogBody,
  ApDialogStyle
} from 'apeman-react-dialog'

const ExampleComponent = React.createClass({
  getInitialState () {
    return {
      dialogEnabled: true
    }
  },
  render () {
    const s = this
    let state = s.state
    return (
      <div>
        <ApDialogStyle />
        <ApDialog enabled={state.dialogEnabled}
                  onClose={() =>{s.toggleDialog(false)} }>
          <ApDialogHeader>Dialog Header</ApDialogHeader>
          <ApDialogBody>Dialog Body</ApDialogBody>
        </ApDialog>
      </div>
    )
  },
  toggleDialog (enabled) {
    const s = this
    s.setState({
      dialogEnabled: enabled
    })
  }
})

Components

ApConfirmDialogStyle

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApConfirmDialog

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | present | bool | | | | | onSubmit | func | null | | Handler for submit event | | onCancel | func | null | | Handler for cancel event | | title | string | | | Dialog title | | message | string | 'Once destroyed, there is no going back. Please be certain.' | | Dialog message | | checkboxId | string | `ap-confirm-dialog-checkbox-${id}` | | Id of checkbox | | checkboxName | string | `ap-confirm-check-${id}` | | Name of checkbox | | checkboxText | string | null | | Label text of checkbox | | errorText | string | 'Needs check before submit.' | | Errot text when not checked | | submitText | string | 'submit' | | Submit button text |

ApDialogBody

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApDialogHeader

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApDialogStyle

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApDialog

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- | | present | bool | false | | | | onClose | func | null | | | | spinning | bool | false | | | | spinner | string | ApSpinner.DEFAULT_THEME | | | | title | string | null | | | | closeIcon | string | 'fa fa-close' | | |

ApYesnoDialogStyle

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

ApYesnoDialog

Props

| Name | Type | Default | Description | | ---- | ---- | ------- | ----------- |

License

This software is released under the MIT License.

Links

• apeman
• apeman-react-labo
• React