focus-components-v3/confirmation-popin/index.js

Focus web components to build applications (based on Material Design)

'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _i18next = require('i18next');

var _i18next2 = _interopRequireDefault(_i18next);

var _modal = require('../modal');

var _modal2 = _interopRequireDefault(_modal);

var _button = require('../button');

var _button2 = _interopRequireDefault(_button);

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

function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }

var ConfirmationModal = function (_Component) {
    _inherits(ConfirmationModal, _Component);

    function ConfirmationModal(props) {
        _classCallCheck(this, ConfirmationModal);

        var _this = _possibleConstructorReturn(this, _Component.call(this, props));

        _this._handleConfirm = _this._handleConfirm.bind(_this);
        _this._handleCancel = _this._handleCancel.bind(_this);
        _this._handleModalClose = _this._handleModalClose.bind(_this);
        _this.toggleOpen = _this.toggleOpen.bind(_this);
        _this.state = {
            fromButtonClick: false
        };
        return _this;
    }

    /**
    * Confirmation action handler
    */
    ConfirmationModal.prototype._handleConfirm = function _handleConfirm() {
        this.toggleOpen();
        if (this.props.confirmHandler) {
            this.props.confirmHandler();
        }
    };

    /**
    * Cancel action handler
    */
    ConfirmationModal.prototype._handleCancel = function _handleCancel() {
        this.toggleOpen();
        if (this.props.cancelHandler) {
            this.props.cancelHandler();
        }
    };

    ConfirmationModal.prototype._handleModalClose = function _handleModalClose() {
        if (this.props.cancelHandler && !this.state.fromButtonClick) {
            this.props.cancelHandler();
        }
        this.setState({ fromButtonClick: false });
    };

    ConfirmationModal.prototype.toggleOpen = function toggleOpen() {
        var _this2 = this;

        this.setState({
            fromButtonClick: true
        }, function () {
            _this2.refs.modal.toggleOpen();
        });
    };

    ConfirmationModal.prototype.render = function render() {
        return _react2.default.createElement(
            'div',
            { 'data-focus': 'confirmation-modal' },
            _react2.default.createElement(
                _modal2.default,
                { onModalClose: this._handleModalClose, open: this.props.open, ref: 'modal' },
                _react2.default.createElement(
                    'div',
                    { 'data-focus': 'confirmation-modal--title' },
                    _react2.default.createElement(
                        'h1',
                        null,
                        _i18next2.default.t('focus.components.modal.confirmation.title')
                    )
                ),
                _react2.default.createElement(
                    'div',
                    { 'data-focus': 'confirmation-modal--content' },
                    this.props.children
                ),
                _react2.default.createElement(
                    'div',
                    { 'data-focus': 'confirmation-modal--actions' },
                    _react2.default.createElement(_button2.default, { handleOnClick: this._handleCancel, label: _i18next2.default.t(this.props.cancelButtonLabel) }),
                    _react2.default.createElement(_button2.default, { handleOnClick: this._handleConfirm, label: _i18next2.default.t(this.props.confirmButtonLabel), color: 'primary' })
                )
            )
        );
    };

    return ConfirmationModal;
}(_react.Component);

;

ConfirmationModal.displayName = 'ConfirmationModal';
ConfirmationModal.propTypes = {
    open: _react.PropTypes.boolean,
    cancelButtonLabel: _react.PropTypes.string,
    cancelHandler: _react.PropTypes.func,
    confirmButtonLabel: _react.PropTypes.string,
    confirmHandler: _react.PropTypes.func
};
ConfirmationModal.defaultProps = {
    open: false,
    cancelButtonLabel: 'focus.components.modal.confirmation.cancel',
    confirmButtonLabel: 'focus.components.modal.confirmation.confirm'
};
exports.default = ConfirmationModal;
module.exports = exports['default'];
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImZyLUZSLmpzIl0sIm5hbWVzIjpbIkNvbmZpcm1hdGlvbk1vZGFsIiwicHJvcHMiLCJfaGFuZGxlQ29uZmlybSIsImJpbmQiLCJfaGFuZGxlQ2FuY2VsIiwiX2hhbmRsZU1vZGFsQ2xvc2UiLCJ0b2dnbGVPcGVuIiwic3RhdGUiLCJmcm9tQnV0dG9uQ2xpY2siLCJjb25maXJtSGFuZGxlciIsImNhbmNlbEhhbmRsZXIiLCJzZXRTdGF0ZSIsInJlZnMiLCJtb2RhbCIsInJlbmRlciIsIm9wZW4iLCJ0IiwiY2hpbGRyZW4iLCJjYW5jZWxCdXR0b25MYWJlbCIsImNvbmZpcm1CdXR0b25MYWJlbCIsImRpc3BsYXlOYW1lIiwicHJvcFR5cGVzIiwiYm9vbGVhbiIsInN0cmluZyIsImZ1bmMiLCJkZWZhdWx0UHJvcHMiXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBOzs7O0FBQ0E7Ozs7QUFDQTs7OztBQUNBOzs7Ozs7Ozs7Ozs7OztJQUdNQSxpQjtjQUFBQSxpQjs7QUFDRixhQURFQSxpQkFDRixDQUFZQyxLQUFaLEVBQW1CO0FBQUEsOEJBRGpCRCxpQkFDaUI7O0FBQUEscURBQ2Ysc0JBQU1DLEtBQU4sQ0FEZTs7QUFFZixjQUFLQyxjQUFMLEdBQXNCLE1BQUtBLGNBQUwsQ0FBb0JDLElBQXBCLE9BQXRCO0FBQ0EsY0FBS0MsYUFBTCxHQUFxQixNQUFLQSxhQUFMLENBQW1CRCxJQUFuQixPQUFyQjtBQUNBLGNBQUtFLGlCQUFMLEdBQXlCLE1BQUtBLGlCQUFMLENBQXVCRixJQUF2QixPQUF6QjtBQUNBLGNBQUtHLFVBQUwsR0FBa0IsTUFBS0EsVUFBTCxDQUFnQkgsSUFBaEIsT0FBbEI7QUFDQSxjQUFLSSxLQUFMLEdBQWE7QUFDVEMsNkJBQWlCO0FBRFIsU0FBYjtBQU5lO0FBU2xCOztBQUVEOzs7QUFaRVIscUIsV0FlRkUsYyw2QkFBaUI7QUFDYixhQUFLSSxVQUFMO0FBQ0EsWUFBSSxLQUFLTCxLQUFMLENBQVdRLGNBQWYsRUFBK0I7QUFDM0IsaUJBQUtSLEtBQUwsQ0FBV1EsY0FBWDtBQUNIO0FBQ0osSzs7QUFFRDs7O0FBdEJFVCxxQixXQXlCRkksYSw0QkFBZ0I7QUFDWixhQUFLRSxVQUFMO0FBQ0EsWUFBSSxLQUFLTCxLQUFMLENBQVdTLGFBQWYsRUFBOEI7QUFDMUIsaUJBQUtULEtBQUwsQ0FBV1MsYUFBWDtBQUNIO0FBQ0osSzs7QUE5QkNWLHFCLFdBZ0NGSyxpQixnQ0FBb0I7QUFDaEIsWUFBSSxLQUFLSixLQUFMLENBQVdTLGFBQVgsSUFBNEIsQ0FBQyxLQUFLSCxLQUFMLENBQVdDLGVBQTVDLEVBQTZEO0FBQ3pELGlCQUFLUCxLQUFMLENBQVdTLGFBQVg7QUFDSDtBQUNELGFBQUtDLFFBQUwsQ0FBYyxFQUFDSCxpQkFBaUIsS0FBbEIsRUFBZDtBQUNILEs7O0FBckNDUixxQixXQXVDRk0sVSx5QkFBYTtBQUFBOztBQUNULGFBQUtLLFFBQUwsQ0FBYztBQUNWSCw2QkFBaUI7QUFEUCxTQUFkLEVBRUcsWUFBTTtBQUNMLG1CQUFLSSxJQUFMLENBQVVDLEtBQVYsQ0FBZ0JQLFVBQWhCO0FBQ0gsU0FKRDtBQUtILEs7O0FBN0NDTixxQixXQStDRmMsTSxxQkFBUztBQUNMLGVBQ0k7QUFBQTtBQUFBLGNBQUssY0FBVyxvQkFBaEI7QUFDSTtBQUFBO0FBQUEsa0JBQU8sY0FBYyxLQUFLVCxpQkFBMUIsRUFBNkMsTUFBTSxLQUFLSixLQUFMLENBQVdjLElBQTlELEVBQW9FLEtBQUksT0FBeEU7QUFDSTtBQUFBO0FBQUEsc0JBQUssY0FBVywyQkFBaEI7QUFDSTtBQUFBO0FBQUE7QUFBSywwQ0FBUUMsQ0FBUixDQUFVLDJDQUFWO0FBQUw7QUFESixpQkFESjtBQUlJO0FBQUE7QUFBQSxzQkFBSyxjQUFXLDZCQUFoQjtBQUNLLHlCQUFLZixLQUFMLENBQVdnQjtBQURoQixpQkFKSjtBQU9JO0FBQUE7QUFBQSxzQkFBSyxjQUFXLDZCQUFoQjtBQUNJLHNFQUFRLGVBQWUsS0FBS2IsYUFBNUIsRUFBMkMsT0FBTyxrQkFBUVksQ0FBUixDQUFVLEtBQUtmLEtBQUwsQ0FBV2lCLGlCQUFyQixDQUFsRCxHQURKO0FBRUksc0VBQVEsZUFBZSxLQUFLaEIsY0FBNUIsRUFBNEMsT0FBTyxrQkFBUWMsQ0FBUixDQUFVLEtBQUtmLEtBQUwsQ0FBV2tCLGtCQUFyQixDQUFuRCxFQUE2RixPQUFNLFNBQW5HO0FBRko7QUFQSjtBQURKLFNBREo7QUFnQkgsSzs7V0FoRUNuQixpQjs7O0FBaUVMOztBQUVEQSxrQkFBa0JvQixXQUFsQixHQUFnQyxtQkFBaEM7QUFDQXBCLGtCQUFrQnFCLFNBQWxCLEdBQThCO0FBQzFCTixVQUFNLGlCQUFVTyxPQURVO0FBRTFCSix1QkFBbUIsaUJBQVVLLE1BRkg7QUFHMUJiLG1CQUFlLGlCQUFVYyxJQUhDO0FBSTFCTCx3QkFBb0IsaUJBQVVJLE1BSko7QUFLMUJkLG9CQUFnQixpQkFBVWU7QUFMQSxDQUE5QjtBQU9BeEIsa0JBQWtCeUIsWUFBbEIsR0FBaUM7QUFDN0JWLFVBQU0sS0FEdUI7QUFFN0JHLHVCQUFtQiw0Q0FGVTtBQUc3QkMsd0JBQW9CO0FBSFMsQ0FBakM7a0JBS2VuQixpQiIsImZpbGUiOiJmci1GUi5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwge0NvbXBvbmVudCwgUHJvcFR5cGVzfSBmcm9tICdyZWFjdCc7XHJcbmltcG9ydCBpMThuZXh0IGZyb20gJ2kxOG5leHQnO1xyXG5pbXBvcnQgTW9kYWwgZnJvbSAnLi4vbW9kYWwnO1xyXG5pbXBvcnQgQnV0dG9uIGZyb20gJy4uL2J1dHRvbic7XHJcblxyXG5cclxuY2xhc3MgQ29uZmlybWF0aW9uTW9kYWwgZXh0ZW5kcyBDb21wb25lbnQge1xyXG4gICAgY29uc3RydWN0b3IocHJvcHMpIHtcclxuICAgICAgICBzdXBlcihwcm9wcyk7XHJcbiAgICAgICAgdGhpcy5faGFuZGxlQ29uZmlybSA9IHRoaXMuX2hhbmRsZUNvbmZpcm0uYmluZCh0aGlzKTtcclxuICAgICAgICB0aGlzLl9oYW5kbGVDYW5jZWwgPSB0aGlzLl9oYW5kbGVDYW5jZWwuYmluZCh0aGlzKTtcclxuICAgICAgICB0aGlzLl9oYW5kbGVNb2RhbENsb3NlID0gdGhpcy5faGFuZGxlTW9kYWxDbG9zZS5iaW5kKHRoaXMpO1xyXG4gICAgICAgIHRoaXMudG9nZ2xlT3BlbiA9IHRoaXMudG9nZ2xlT3Blbi5iaW5kKHRoaXMpO1xyXG4gICAgICAgIHRoaXMuc3RhdGUgPSB7XHJcbiAgICAgICAgICAgIGZyb21CdXR0b25DbGljazogZmFsc2VcclxuICAgICAgICB9O1xyXG4gICAgfTtcclxuXHJcbiAgICAvKipcclxuICAgICogQ29uZmlybWF0aW9uIGFjdGlvbiBoYW5kbGVyXHJcbiAgICAqL1xyXG4gICAgX2hhbmRsZUNvbmZpcm0oKSB7XHJcbiAgICAgICAgdGhpcy50b2dnbGVPcGVuKCk7XHJcbiAgICAgICAgaWYgKHRoaXMucHJvcHMuY29uZmlybUhhbmRsZXIpIHtcclxuICAgICAgICAgICAgdGhpcy5wcm9wcy5jb25maXJtSGFuZGxlcigpO1xyXG4gICAgICAgIH1cclxuICAgIH07XHJcblxyXG4gICAgLyoqXHJcbiAgICAqIENhbmNlbCBhY3Rpb24gaGFuZGxlclxyXG4gICAgKi9cclxuICAgIF9oYW5kbGVDYW5jZWwoKSB7XHJcbiAgICAgICAgdGhpcy50b2dnbGVPcGVuKCk7XHJcbiAgICAgICAgaWYgKHRoaXMucHJvcHMuY2FuY2VsSGFuZGxlcikge1xyXG4gICAgICAgICAgICB0aGlzLnByb3BzLmNhbmNlbEhhbmRsZXIoKTtcclxuICAgICAgICB9XHJcbiAgICB9O1xyXG5cclxuICAgIF9oYW5kbGVNb2RhbENsb3NlKCkge1xyXG4gICAgICAgIGlmICh0aGlzLnByb3BzLmNhbmNlbEhhbmRsZXIgJiYgIXRoaXMuc3RhdGUuZnJvbUJ1dHRvbkNsaWNrKSB7XHJcbiAgICAgICAgICAgIHRoaXMucHJvcHMuY2FuY2VsSGFuZGxlcigpO1xyXG4gICAgICAgIH1cclxuICAgICAgICB0aGlzLnNldFN0YXRlKHtmcm9tQnV0dG9uQ2xpY2s6IGZhbHNlfSk7XHJcbiAgICB9O1xyXG5cclxuICAgIHRvZ2dsZU9wZW4oKSB7XHJcbiAgICAgICAgdGhpcy5zZXRTdGF0ZSh7XHJcbiAgICAgICAgICAgIGZyb21CdXR0b25DbGljazogdHJ1ZVxyXG4gICAgICAgIH0sICgpID0+IHtcclxuICAgICAgICAgICAgdGhpcy5yZWZzLm1vZGFsLnRvZ2dsZU9wZW4oKTtcclxuICAgICAgICB9KTtcclxuICAgIH07XHJcblxyXG4gICAgcmVuZGVyKCkge1xyXG4gICAgICAgIHJldHVybiAoXHJcbiAgICAgICAgICAgIDxkaXYgZGF0YS1mb2N1cz0nY29uZmlybWF0aW9uLW1vZGFsJz5cclxuICAgICAgICAgICAgICAgIDxNb2RhbCBvbk1vZGFsQ2xvc2U9e3RoaXMuX2hhbmRsZU1vZGFsQ2xvc2V9IG9wZW49e3RoaXMucHJvcHMub3Blbn0gcmVmPSdtb2RhbCc+XHJcbiAgICAgICAgICAgICAgICAgICAgPGRpdiBkYXRhLWZvY3VzPSdjb25maXJtYXRpb24tbW9kYWwtLXRpdGxlJz5cclxuICAgICAgICAgICAgICAgICAgICAgICAgPGgxPntpMThuZXh0LnQoJ2ZvY3VzLmNvbXBvbmVudHMubW9kYWwuY29uZmlybWF0aW9uLnRpdGxlJyl9PC9oMT5cclxuICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgICAgICAgICA8ZGl2IGRhdGEtZm9jdXM9J2NvbmZpcm1hdGlvbi1tb2RhbC0tY29udGVudCc+XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHt0aGlzLnByb3BzLmNoaWxkcmVufVxyXG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICAgICAgICAgIDxkaXYgZGF0YS1mb2N1cz0nY29uZmlybWF0aW9uLW1vZGFsLS1hY3Rpb25zJz5cclxuICAgICAgICAgICAgICAgICAgICAgICAgPEJ1dHRvbiBoYW5kbGVPbkNsaWNrPXt0aGlzLl9oYW5kbGVDYW5jZWx9IGxhYmVsPXtpMThuZXh0LnQodGhpcy5wcm9wcy5jYW5jZWxCdXR0b25MYWJlbCl9IC8+XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIDxCdXR0b24gaGFuZGxlT25DbGljaz17dGhpcy5faGFuZGxlQ29uZmlybX0gbGFiZWw9e2kxOG5leHQudCh0aGlzLnByb3BzLmNvbmZpcm1CdXR0b25MYWJlbCl9IGNvbG9yPSdwcmltYXJ5JyAvPlxyXG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICAgICAgPC9Nb2RhbD5cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgKTtcclxuICAgIH07XHJcbn07XHJcblxyXG5Db25maXJtYXRpb25Nb2RhbC5kaXNwbGF5TmFtZSA9ICdDb25maXJtYXRpb25Nb2RhbCc7XHJcbkNvbmZpcm1hdGlvbk1vZGFsLnByb3BUeXBlcyA9IHtcclxuICAgIG9wZW46IFByb3BUeXBlcy5ib29sZWFuLFxyXG4gICAgY2FuY2VsQnV0dG9uTGFiZWw6IFByb3BUeXBlcy5zdHJpbmcsXHJcbiAgICBjYW5jZWxIYW5kbGVyOiBQcm9wVHlwZXMuZnVuYyxcclxuICAgIGNvbmZpcm1CdXR0b25MYWJlbDogUHJvcFR5cGVzLnN0cmluZyxcclxuICAgIGNvbmZpcm1IYW5kbGVyOiBQcm9wVHlwZXMuZnVuY1xyXG59O1xyXG5Db25maXJtYXRpb25Nb2RhbC5kZWZhdWx0UHJvcHMgPSB7XHJcbiAgICBvcGVuOiBmYWxzZSxcclxuICAgIGNhbmNlbEJ1dHRvbkxhYmVsOiAnZm9jdXMuY29tcG9uZW50cy5tb2RhbC5jb25maXJtYXRpb24uY2FuY2VsJyxcclxuICAgIGNvbmZpcm1CdXR0b25MYWJlbDogJ2ZvY3VzLmNvbXBvbmVudHMubW9kYWwuY29uZmlybWF0aW9uLmNvbmZpcm0nXHJcbn07XHJcbmV4cG9ydCBkZWZhdWx0IENvbmZpcm1hdGlvbk1vZGFsO1xyXG4iXX0=