Learn more  » Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Bower components Debian packages RPM packages NuGet packages

lnguyenacl / acl-ui   js

Repository URL to install this package:

Version: 3.0.0 

/ examples / Modal / index.js

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _components = require('acl-ui/components');

var _Placeholder = require('../helpers/Placeholder/');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

class ModalExample extends _react.Component {
  constructor() {
    super();
    this.state = {
      simpleModalOpen: false,
      fullModalOpen: false
    };
  }

  onCloseModal() {
    this.setState({ fullModalOpen: false });
  }

  onPopupSave() {
    alert('saved');
    this.setState({ fullModalOpen: false });
  }

  onPopupCancel() {
    this.setState({ fullModalOpen: false });
  }

  onPopupClose() {
    this.setState({ fullModalOpen: false });
  }

  render() {
    return _react2.default.createElement(
      'div',
      null,
      _react2.default.createElement(
        'button',
        { onClick: () => this.setState({ fullModalOpen: true }) },
        'Full Popup'
      ),
      _react2.default.createElement(
        'button',
        { onClick: () => this.setState({ simpleModalOpen: true }) },
        'Simple Popup'
      ),
      _react2.default.createElement(
        _components.Modal,
        { open: this.state.fullModalOpen, onClose: () => this.onCloseModal() },
        _react2.default.createElement(
          _components.Popup,
          {
            title: 'Once upon a time in Vancouver',
            onSave: () => this.onPopupSave(),
            onCancel: () => this.onPopupCancel(),
            onClose: () => this.onPopupClose()
          },
          _react2.default.createElement(_Placeholder.PlaceholderText, { type: 'media-alt', rows: 3 })
        )
      ),
      _react2.default.createElement(
        _components.Modal,
        {
          open: this.state.simpleModalOpen,
          onClose: () => this.setState({ simpleModalOpen: false })
        },
        _react2.default.createElement(
          _components.PopupSimple,
          {
            title: 'Once upon a time in a Simple Vancouver',
            onSave: () => {
              alert('continue');this.setState({ simpleModalOpen: false });
            },
            onClose: () => this.setState({ simpleModalOpen: false })
          },
          _react2.default.createElement(_Placeholder.PlaceholderText, { rows: 1 })
        )
      )
    );
  }
}

exports.default = ModalExample;