"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var react_1 = require("@storybook/react");
var styled_components_1 = require("styled-components");
var Button_1 = require("../components/Button");
var Heading_1 = require("../components/Heading");
var Modal_1 = require("../components/Modal");
var ProgressBar_1 = require("./ProgressBar");
var Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: 30px;\n"], ["\n  margin: 30px;\n"])));
var ModalDemo = (function (_super) {
    __extends(ModalDemo, _super);
    function ModalDemo(props) {
        var _this = _super.call(this, props) || this;
        _this.state = {
            show: false
        };
        return _this;
    }
    ModalDemo.prototype.render = function () {
        var _this = this;
        return (React.createElement(Container, null,
            React.createElement(Button_1.default, { primary: true, onClick: function () { return _this.setState({ show: true }); } }, "Open Modal"),
            this.state.show && (React.createElement(Modal_1.default, { title: 'Modal title', cancel: function () { return _this.setState({ show: false }); }, done: function () { return _this.setState({ show: false }); }, action: 'Ok' }, "Lorem ipsum dolor sit amet"))));
    };
    return ModalDemo;
}(React.Component));
react_1.storiesOf('Modal', module)
    .addWithInfo('Standard', function () {
    return (React.createElement(Modal_1.default, { title: 'Modal title', cancel: function () { }, done: function () { }, action: 'Ok' }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('No cancel button', function () {
    return (React.createElement(Modal_1.default, { title: 'Modal title', done: function () { }, action: 'Ok' }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('Title Details', function () {
    return (React.createElement(Modal_1.default, { title: 'Modal title', titleDetails: 'Optional details', cancel: function () { }, done: function () { }, action: 'Ok' }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('Custom Width', function () {
    return (React.createElement(Modal_1.default, { w: 1000, title: 'Modal title', titleDetails: 'Optional details', cancel: function () { }, done: function () { }, action: 'Ok' }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('Responsive Custom Width', function () {
    return (React.createElement(Modal_1.default, { w: ['auto', 500, 1000], title: 'Modal title', titleDetails: 'Optional details', cancel: function () { }, done: function () { }, action: 'Ok' }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('Multi Element Title', function () {
    return (React.createElement(Modal_1.default, { titleElement: React.createElement("heading", null,
            React.createElement(Heading_1.default.h3, null, "Heading"),
            React.createElement(ProgressBar_1.Progressor, { mb: 3, primary: true, value: 50 })), cancel: function () { }, done: function () { }, action: 'Ok' }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('Custom Button Properties', function () {
    return (React.createElement(Modal_1.default, { w: ['auto', 500, 1000], title: 'Are you sure?', cancel: function () { }, done: function () { }, action: 'Delete', cancelButtonProps: {
            w: 150,
            style: {
                marginRight: 30
            }
        }, primaryButtonProps: {
            w: 150,
            danger: true,
            primary: false,
            disabled: true
        } }, "Lorem ipsum dolor sit amet"));
})
    .addWithInfo('Open Modal Demo', function () {
    return React.createElement(ModalDemo, null);
});
var templateObject_1;
