dibk-design 0.4.27 → 0.4.31

package/dist/components/CheckBoxListItem.js

@@ -1,5 +1,7 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,32 +11,68 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _CheckBoxListItemModule = _interopRequireDefault(require("./CheckBoxListItem.module.scss"));
-
 var _CheckBoxInput = _interopRequireDefault(require("./CheckBoxInput"));
 
+var _CheckBoxListItemModule = _interopRequireDefault(require("./CheckBoxListItem.module.scss"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-class CheckBoxListItem extends _react.default.Component {
-  render() {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(_CheckBoxListItemModule.default.checkBoxListItem, " ").concat(this.props.checked ? _CheckBoxListItemModule.default.checked : '', " ").concat(this.props.contentOnly ? _CheckBoxListItemModule.default.contentOnly : '', " ").concat(this.props.compact ? _CheckBoxListItemModule.default.compact : '', " ").concat(this.props.hasErrors ? _CheckBoxListItemModule.default.hasErrors : '')
-    }, /*#__PURE__*/_react.default.createElement(_CheckBoxInput.default, {
-      onChange: this.props.onChange,
-      checked: this.props.checked,
-      contentOnly: this.props.contentOnly,
-      hasErrors: this.props.hasErrors,
-      id: this.props.id,
-      theme: this.props.theme,
-      checkmarkCharacter: this.props.checkmarkCharacter
-    }, this.props.children));
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } Object.defineProperty(subClass, "prototype", { value: Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }), writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var CheckBoxListItem = /*#__PURE__*/function (_React$Component) {
+  _inherits(CheckBoxListItem, _React$Component);
+
+  var _super = _createSuper(CheckBoxListItem);
+
+  function CheckBoxListItem() {
+    _classCallCheck(this, CheckBoxListItem);
+
+    return _super.apply(this, arguments);
   }
 
-}
+  _createClass(CheckBoxListItem, [{
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: "".concat(_CheckBoxListItemModule.default.checkBoxListItem, " ").concat(this.props.checked ? _CheckBoxListItemModule.default.checked : '', " ").concat(this.props.disabled ? _CheckBoxListItemModule.default.disabled : '', " ").concat(this.props.contentOnly ? _CheckBoxListItemModule.default.contentOnly : '', " ").concat(this.props.compact ? _CheckBoxListItemModule.default.compact : '', " ").concat(this.props.hasErrors ? _CheckBoxListItemModule.default.hasErrors : '')
+      }, /*#__PURE__*/_react.default.createElement(_CheckBoxInput.default, {
+        onChange: this.props.onChange,
+        checked: this.props.checked,
+        disabled: this.props.disabled,
+        contentOnly: this.props.contentOnly,
+        hasErrors: this.props.hasErrors,
+        id: this.props.id,
+        theme: this.props.theme,
+        checkmarkCharacter: this.props.checkmarkCharacter
+      }, this.props.children));
+    }
+  }]);
+
+  return CheckBoxListItem;
+}(_react.default.Component);
 
 CheckBoxListItem.propTypes = {
   /** Text content inside list item */
   checked: _propTypes.default.bool,
+  disabled: _propTypes.default.bool,
   id: _propTypes.default.string.isRequired,
   name: _propTypes.default.string,
   onChange: _propTypes.default.func.isRequired,
@@ -46,6 +84,7 @@ CheckBoxListItem.propTypes = {
 };
 CheckBoxListItem.defaultProps = {
   checked: false,
+  disabled: false,
   id: '',
   name: '',
   contentOnly: false,

package/dist/components/CheckBoxListItem.md

@@ -16,6 +16,15 @@ Check box list item example:
 <CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="checkboxListItem-5" checkmarkCharacter="✕">
   Label for checked checkbox with custom checkmark
 </CheckBoxListItem>
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="checkboxListItem-6" disabled={true}>
+  Label for disabled checked checkbox
+</CheckBoxListItem>
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} name="checkbox" id="checkboxListItem-7" disabled={true}>
+  Label for disabled unchecked checkbox
+</CheckBoxListItem>
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="checkboxListItem-8" checkmarkCharacter="✕" disabled={true}>
+  Label for disabled checked checkbox with custom checkmark
+</CheckBoxListItem>
 ```
 
 Compact check box list item example:
@@ -33,15 +42,21 @@ Compact check box list item example:
 <CheckBoxListItem onChange={()=>{console.log('onchange')}} name="checkbox" id="compact-checkboxListItem-4" contentOnly={true} compact>
   Label for unchecked checkbox with content only
 </CheckBoxListItem>
-<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="compact-checkboxListItem-3" compact hasErrors>
-  Label for checked checkbox with content only
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="compact-checkboxListItem-5" compact hasErrors>
+  Label for checked checkbox with error
 </CheckBoxListItem>
-<CheckBoxListItem onChange={()=>{console.log('onchange')}} name="checkbox" id="compact-checkboxListItem-4" compact hasErrors>
-  Label for unchecked checkbox with content only
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} name="checkbox" id="compact-checkboxListItem-6" compact hasErrors>
+  Label for unchecked checkbox with error
 </CheckBoxListItem>
-<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="compact-checkboxListItem-5" compact checkmarkCharacter="✕">
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="compact-checkboxListItem-7" compact checkmarkCharacter="✕">
   Label for checked checkbox with custom checkmark
 </CheckBoxListItem>
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="compact-checkboxListItem-8" compact disabled={true}>
+  Label for disabled checked checkbox
+</CheckBoxListItem>
+<CheckBoxListItem onChange={()=>{console.log('onchange')}} checked={true} name="checkbox" id="compact-checkboxListItem-9" compact hasErrors disabled={true}>
+  Label for disabled checked checkbox with error
+</CheckBoxListItem>
 ```
 
 Themed Check box list item example:

package/dist/components/CheckBoxListItem.module.scss

@@ -32,11 +32,17 @@
     }
   }
 
-  &:local(.checked):not(:local(.contentOnly)):not(:local(.compact)) {
+  &:local(.disabled) {
+    label {
+      cursor: auto;
+    }
+  }
+
+  &:local(.checked):not(:local(.contentOnly)):not(:local(.compact)):not(:local(.disabled)) {
     @include box-shadow(0 0 0 1px $color-dark-blue, 0 0 4px 0 $color-dark-blue);
   }
 
-  &:not(:local(.checked)):not(:local(.contentOnly)):not(:local(.compact)):hover {
+  &:not(:local(.checked)):not(:local(.contentOnly)):not(:local(.compact)):not(:local(.disabled)):hover {
     @include box-shadow(0 0 6px $color-dark-blue);
   }
 

package/dist/components/ContentBox.js

@@ -1,5 +1,7 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -13,41 +15,76 @@ var _ContentBoxModule = _interopRequireDefault(require("./ContentBox.module.scss
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-class ContentBox extends _react.default.Component {
-  renderTitle() {
-    let className = _ContentBoxModule.default.title + " " + _ContentBoxModule.default[this.props.titleSize];
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-    if (this.props.title) {
-      return /*#__PURE__*/_react.default.createElement("h2", {
-        className: className
-      }, this.props.title);
-    } else {
-      return;
-    }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } Object.defineProperty(subClass, "prototype", { value: Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }), writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var ContentBox = /*#__PURE__*/function (_React$Component) {
+  _inherits(ContentBox, _React$Component);
+
+  var _super = _createSuper(ContentBox);
+
+  function ContentBox() {
+    _classCallCheck(this, ContentBox);
+
+    return _super.apply(this, arguments);
   }
 
-  render() {
-    let colorClass = " " + _ContentBoxModule.default[this.props.color];
-    let linkClass = this.props.href ? " " + _ContentBoxModule.default.link : "";
-    let className = _ContentBoxModule.default.contentBox + colorClass + linkClass;
-
-    if (this.props.href) {
-      return /*#__PURE__*/_react.default.createElement("a", {
-        href: this.props.href,
-        className: className
-      }, this.renderTitle(), /*#__PURE__*/_react.default.createElement("div", {
-        className: _ContentBoxModule.default.content
-      }, this.props.content));
-    } else {
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: className
-      }, this.renderTitle(), /*#__PURE__*/_react.default.createElement("div", {
-        className: _ContentBoxModule.default.content
-      }, this.props.content));
+  _createClass(ContentBox, [{
+    key: "renderTitle",
+    value: function renderTitle() {
+      var className = _ContentBoxModule.default.title + " " + _ContentBoxModule.default[this.props.titleSize];
+
+      if (this.props.title) {
+        return /*#__PURE__*/_react.default.createElement("h2", {
+          className: className
+        }, this.props.title);
+      } else {
+        return;
+      }
     }
-  }
+  }, {
+    key: "render",
+    value: function render() {
+      var colorClass = " " + _ContentBoxModule.default[this.props.color];
+      var linkClass = this.props.href ? " " + _ContentBoxModule.default.link : "";
+      var className = _ContentBoxModule.default.contentBox + colorClass + linkClass;
+
+      if (this.props.href) {
+        return /*#__PURE__*/_react.default.createElement("a", {
+          href: this.props.href,
+          className: className
+        }, this.renderTitle(), /*#__PURE__*/_react.default.createElement("div", {
+          className: _ContentBoxModule.default.content
+        }, this.props.content));
+      } else {
+        return /*#__PURE__*/_react.default.createElement("div", {
+          className: className
+        }, this.renderTitle(), /*#__PURE__*/_react.default.createElement("div", {
+          className: _ContentBoxModule.default.content
+        }, this.props.content));
+      }
+    }
+  }]);
 
-}
+  return ContentBox;
+}(_react.default.Component);
 
 ContentBox.propTypes = {
   /** Content title inside box */

package/dist/components/Dialog.js

@@ -1,5 +1,7 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -13,74 +15,113 @@ var _DialogModule = _interopRequireDefault(require("./Dialog.module.scss"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-class Dialog extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    this.state = {};
-    this.setWrapperRef = this.setWrapperRef.bind(this);
-    this.setHiddenInputWrapperRef = this.setHiddenInputWrapperRef.bind(this);
-    this.handleClickOutside = this.handleClickOutside.bind(this);
-    this.keyDownFunction = this.keyDownFunction.bind(this);
-  }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-  componentDidMount() {
-    document.addEventListener('mousedown', this.handleClickOutside);
-    document.addEventListener("keydown", this.keyDownFunction, false);
-    this.hiddenInputWrapperRef.tabIndex = -1;
-  }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-  componentWillUnmount() {
-    document.removeEventListener('mousedown', this.handleClickOutside);
-    document.removeEventListener("keydown", this.keyDownFunction, false);
-  }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
-  keyDownFunction(event) {
-    switch (event.keyCode) {
-      case 27:
-        // Escape
-        if (this.props.onClickOutside) this.props.onClickOutside();
-        break;
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } Object.defineProperty(subClass, "prototype", { value: Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }), writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 
-      default:
-        return null;
-    }
-  }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 
-  setWrapperRef(node) {
-    this.wrapperRef = node;
-  }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
-  setHiddenInputWrapperRef(node) {
-    this.hiddenInputWrapperRef = node;
-  }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
 
-  handleClickOutside(event) {
-    if (this.wrapperRef && !this.wrapperRef.contains(event.target)) {
-      this.props.onClickOutside();
-    }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var Dialog = /*#__PURE__*/function (_React$Component) {
+  _inherits(Dialog, _React$Component);
+
+  var _super = _createSuper(Dialog);
+
+  function Dialog(props) {
+    var _this;
+
+    _classCallCheck(this, Dialog);
+
+    _this = _super.call(this, props);
+    _this.state = {};
+    _this.setWrapperRef = _this.setWrapperRef.bind(_assertThisInitialized(_this));
+    _this.setHiddenInputWrapperRef = _this.setHiddenInputWrapperRef.bind(_assertThisInitialized(_this));
+    _this.handleClickOutside = _this.handleClickOutside.bind(_assertThisInitialized(_this));
+    _this.keyDownFunction = _this.keyDownFunction.bind(_assertThisInitialized(_this));
+    return _this;
   }
 
-  render() {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: _DialogModule.default.dialogOverlay
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      ref: this.setWrapperRef,
-      className: "".concat(_DialogModule.default.dialogContent, " ").concat(this.props.noPadding ? _DialogModule.default.noPadding : ''),
-      style: {
-        maxWidth: this.props.maxWidth
+  _createClass(Dialog, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      document.addEventListener('mousedown', this.handleClickOutside);
+      document.addEventListener("keydown", this.keyDownFunction, false);
+      this.hiddenInputWrapperRef.tabIndex = -1;
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      document.removeEventListener('mousedown', this.handleClickOutside);
+      document.removeEventListener("keydown", this.keyDownFunction, false);
+    }
+  }, {
+    key: "keyDownFunction",
+    value: function keyDownFunction(event) {
+      switch (event.keyCode) {
+        case 27:
+          // Escape
+          if (this.props.onClickOutside) this.props.onClickOutside();
+          break;
+
+        default:
+          return null;
       }
-    }, this.props.closeButton ? /*#__PURE__*/_react.default.createElement("button", {
-      onClick: this.props.onClickOutside,
-      className: _DialogModule.default.closeButton
-    }) : '', /*#__PURE__*/_react.default.createElement("input", {
-      type: "button",
-      ref: this.setHiddenInputWrapperRef,
-      className: _DialogModule.default.hidden,
-      autoFocus: true
-    }), this.props.children));
-  }
+    }
+  }, {
+    key: "setWrapperRef",
+    value: function setWrapperRef(node) {
+      this.wrapperRef = node;
+    }
+  }, {
+    key: "setHiddenInputWrapperRef",
+    value: function setHiddenInputWrapperRef(node) {
+      this.hiddenInputWrapperRef = node;
+    }
+  }, {
+    key: "handleClickOutside",
+    value: function handleClickOutside(event) {
+      if (this.wrapperRef && !this.wrapperRef.contains(event.target)) {
+        this.props.onClickOutside();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: _DialogModule.default.dialogOverlay
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        ref: this.setWrapperRef,
+        className: "".concat(_DialogModule.default.dialogContent, " ").concat(this.props.noPadding ? _DialogModule.default.noPadding : ''),
+        style: {
+          maxWidth: this.props.maxWidth
+        }
+      }, this.props.closeButton ? /*#__PURE__*/_react.default.createElement("button", {
+        onClick: this.props.onClickOutside,
+        className: _DialogModule.default.closeButton
+      }) : '', /*#__PURE__*/_react.default.createElement("input", {
+        type: "button",
+        ref: this.setHiddenInputWrapperRef,
+        className: _DialogModule.default.hidden,
+        autoFocus: true
+      }), this.props.children));
+    }
+  }]);
 
-}
+  return Dialog;
+}(_react.default.Component);
 
 ;
 Dialog.propTypes = {