@roo-ui/components/dist/cjs/Modal/Model.story.js

"use strict";

var _react = _interopRequireDefault(require("react"));

var _react2 = require("@storybook/react");

var _storybookReadme = require("storybook-readme");

var _reactPowerplug = require("react-powerplug");

var _ = require("../..");

var _README = _interopRequireDefault(require("./README.md"));

var _Modal = _interopRequireDefault(require("./Modal"));

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

var ModalWrapper = function ModalWrapper(_ref) {
  var _ref$initial = _ref.initial,
      initial = _ref$initial === void 0 ? true : _ref$initial,
      variant = _ref.variant;
  return _react.default.createElement(_reactPowerplug.Toggle, {
    initial: initial
  }, function (_ref2) {
    var on = _ref2.on,
        toggle = _ref2.toggle;
    return _react.default.createElement("div", null, _react.default.createElement(_.Button, {
      variant: "primary",
      onClick: toggle
    }, "Open"), _react.default.createElement(_Modal.default, {
      isOpen: on,
      onRequestClose: toggle,
      ariaHideApp: false,
      shouldCloseOnOverlayClick: true
    }, _react.default.createElement(_Modal.default.header, {
      variant: variant,
      style: {
        textTransform: 'capitalize'
      }
    }, variant || 'Default'), _react.default.createElement(_Modal.default.body, null, "Lorem ipsum dolor sit amet", _react.default.createElement("br", null), "Lorem ipsum dolor sit amet", _react.default.createElement("br", null), "Lorem ipsum dolor sit amet", _react.default.createElement("br", null)), _react.default.createElement(_Modal.default.footer, null, _react.default.createElement(_.Button, {
      variant: "primary",
      onClick: toggle
    }, "Close"))));
  });
};

(0, _react2.storiesOf)('Components|Modal', module).addDecorator((0, _storybookReadme.withDocs)(_README.default)).add('<Modal />', function () {
  return _react.default.createElement(ModalWrapper, {
    initial: false
  });
}).add('<Modal.header variant="info" />', function () {
  return _react.default.createElement(ModalWrapper, {
    variant: "info"
  });
}).add('<Modal.header variant="success" />', function () {
  return _react.default.createElement(ModalWrapper, {
    variant: "success"
  });
}).add('<Modal.header variant="error" />', function () {
  return _react.default.createElement(ModalWrapper, {
    variant: "error"
  });
});