@atlaskit/modal-dialog - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

dist/bundle-cjs.js

@@ -84,3 +84,3 @@ module.exports = /******/
     });
-    var _getPrototypeOf = __webpack_require__(5), _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf), _classCallCheck2 = __webpack_require__(6), _classCallCheck3 = _interopRequireDefault(_classCallCheck2), _createClass2 = __webpack_require__(7), _createClass3 = _interopRequireDefault(_createClass2), _possibleConstructorReturn2 = __webpack_require__(8), _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2), _inherits2 = __webpack_require__(9), _inherits3 = _interopRequireDefault(_inherits2), _react = __webpack_require__(10), _react2 = _interopRequireDefault(_react), _classnames = __webpack_require__(11), _classnames2 = _interopRequireDefault(_classnames), _style = __webpack_require__(12), _style2 = _interopRequireDefault(_style), _blanket = __webpack_require__(16), _blanket2 = _interopRequireDefault(_blanket), WIDTH_ENUM = {
+    var _extends2 = __webpack_require__(5), _extends3 = _interopRequireDefault(_extends2), _defineProperty2 = __webpack_require__(6), _defineProperty3 = _interopRequireDefault(_defineProperty2), _getPrototypeOf = __webpack_require__(7), _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf), _classCallCheck2 = __webpack_require__(8), _classCallCheck3 = _interopRequireDefault(_classCallCheck2), _createClass2 = __webpack_require__(9), _createClass3 = _interopRequireDefault(_createClass2), _possibleConstructorReturn2 = __webpack_require__(10), _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2), _inherits2 = __webpack_require__(11), _inherits3 = _interopRequireDefault(_inherits2), _react = __webpack_require__(12), _react2 = _interopRequireDefault(_react), _classnames = __webpack_require__(13), _classnames2 = _interopRequireDefault(_classnames), _style = __webpack_require__(14), _style2 = _interopRequireDefault(_style), _blanket = __webpack_require__(18), _blanket2 = _interopRequireDefault(_blanket), WIDTH_ENUM = {
         values: [ "small", "medium", "large", "x-large" ],
@@ -106,5 +106,10 @@ defaultValue: "medium"
             value: function() {
+                var _ref2;
                 // don't render anything if open = false
                 if (!this.props.isOpen) return null;
-                var _props = this.props, onDialogDismissed = _props.onDialogDismissed, header = _props.header, children = _props.children, footer = _props.footer, width = _props.width;
+                var _props = this.props, onDialogDismissed = _props.onDialogDismissed, header = _props.header, children = _props.children, footer = _props.footer, width = _props.width, customStyle = WIDTH_ENUM.values.indexOf(width) === -1 ? {
+                    style: {
+                        width: width
+                    }
+                } : {};
                 return _react2.default.createElement("div", {
@@ -115,5 +120,10 @@ className: _style2.default.modalWrapper
                     onBlanketClicked: onDialogDismissed
-                }), _react2.default.createElement("div", {
-                    className: (0, _classnames2.default)([ _style2.default.modalPositioner, _style2.default[width] ])
-                }, _react2.default.createElement("div", {
+                }), _react2.default.createElement("div", (0, _extends3.default)({
+                    className: (0, _classnames2.default)([ _style2.default.modalPositioner, (_ref2 = {}, 
+                    (0, _defineProperty3.default)(_ref2, _style2.default.small, "small" === width), 
+                    (0, _defineProperty3.default)(_ref2, _style2.default.medium, "medium" === width), 
+                    (0, _defineProperty3.default)(_ref2, _style2.default.large, "large" === width), 
+                    (0, _defineProperty3.default)(_ref2, _style2.default.xLarge, "x-large" === width), 
+                    _ref2) ])
+                }, customStyle), _react2.default.createElement("div", {
                     className: _style2.default.headerFlex
@@ -157,3 +167,5 @@ }, header), _react2.default.createElement("div", {
 	   * @description The maximum width tier of the dialog
-	   * Allowed values are: 'small' (400px), 'medium' (600px), 'large' (800px), 'x-large' (968px).
+	   * Allowed values are: 'small' (400px), 'medium' (600px), 'large' (800px), 'x-large' (968px),
+	   * or any integer value defining the pixel width (e.g. 300), or any string value defining the
+	   * pixel or percentage width including unit (e.g. 300px, 75%).
 	   * @memberof ModalDialog
@@ -164,3 +176,3 @@ * @instance
 	   */
-        width: _react.PropTypes.oneOf(WIDTH_ENUM.values),
+        width: _react.PropTypes.oneOfType([ _react.PropTypes.number, _react.PropTypes.string, _react.PropTypes.oneOf(WIDTH_ENUM.values) ]),
         /**
@@ -181,65 +193,73 @@ * @description Handler function to be called when the blanket is clicked
 function(module, exports) {
-    module.exports = require("babel-runtime/core-js/object/get-prototype-of");
+    module.exports = require("babel-runtime/helpers/extends");
 }, /* 6 */
 /***/
 function(module, exports) {
-    module.exports = require("babel-runtime/helpers/classCallCheck");
+    module.exports = require("babel-runtime/helpers/defineProperty");
 }, /* 7 */
 /***/
 function(module, exports) {
-    module.exports = require("babel-runtime/helpers/createClass");
+    module.exports = require("babel-runtime/core-js/object/get-prototype-of");
 }, /* 8 */
 /***/
 function(module, exports) {
-    module.exports = require("babel-runtime/helpers/possibleConstructorReturn");
+    module.exports = require("babel-runtime/helpers/classCallCheck");
 }, /* 9 */
 /***/
 function(module, exports) {
-    module.exports = require("babel-runtime/helpers/inherits");
+    module.exports = require("babel-runtime/helpers/createClass");
 }, /* 10 */
 /***/
 function(module, exports) {
-    module.exports = require("react");
+    module.exports = require("babel-runtime/helpers/possibleConstructorReturn");
 }, /* 11 */
 /***/
 function(module, exports) {
-    module.exports = require("classnames");
+    module.exports = require("babel-runtime/helpers/inherits");
 }, /* 12 */
 /***/
+function(module, exports) {
+    module.exports = require("react");
+}, /* 13 */
+/***/
+function(module, exports) {
+    module.exports = require("classnames");
+}, /* 14 */
+/***/
 function(module, exports, __webpack_require__) {
     // style-loader: Adds some css to the DOM by adding a <style> tag
     // load the styles
-    var content = __webpack_require__(13);
+    var content = __webpack_require__(15);
     "string" == typeof content && (content = [ [ module.id, content, "" ] ]);
     // add the styles to the DOM
-    __webpack_require__(15)(content, {});
+    __webpack_require__(17)(content, {});
     content.locals && (module.exports = content.locals);
-}, /* 13 */
+}, /* 15 */
 /***/
 function(module, exports, __webpack_require__) {
-    exports = module.exports = __webpack_require__(14)(), // imports
+    exports = module.exports = __webpack_require__(16)(), // imports
     // module
-    exports.push([ module.id, '._1IAK6qQo95yr0sX1cB-NUK{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._2a3TgATMV47a8dPxmPJJu3{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._2a3TgATMV47a8dPxmPJJu3._1FWVLR2QM-b4YCht8cg0u3{width:400px}._2a3TgATMV47a8dPxmPJJu3.bdHyyam9Mfx-3q6ErwqP{width:600px}._2a3TgATMV47a8dPxmPJJu3._2AbhitOeWy9LNSyZE9-rya{width:800px}._2a3TgATMV47a8dPxmPJJu3._3-oqjMINjfCG2QsC9I5UhH{width:968px}._2a3TgATMV47a8dPxmPJJu3 ._1Mzn-qxeNWb2oSHuQLZD-{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._2a3TgATMV47a8dPxmPJJu3 ._33E1ZeJ2VsV1Z1hAw_CMOf{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}', "" ]), 
+    exports.push([ module.id, '._3HNjaOHjVscVvvjap_Puix{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._17jawcLHuw3bliHsYfMDR1{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._17jawcLHuw3bliHsYfMDR1._3s50RnGrSVMIayo8RAMIds{width:400px}._17jawcLHuw3bliHsYfMDR1.YLUGZe2o0CQqYMKmry_8d{width:600px}._17jawcLHuw3bliHsYfMDR1._2gag3shs6cwEnEWmI5vQZX{width:800px}._17jawcLHuw3bliHsYfMDR1._2yhiFEHAOZfF4hWYzDJbFi{width:968px}._17jawcLHuw3bliHsYfMDR1 ._3xgWgc-r5h5oBecRLXyD2X{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._17jawcLHuw3bliHsYfMDR1 ._3OAP-WTNp1ejvDZrjb6BzY{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}', "" ]), 
     // exports
     exports.locals = {
-        "modal-wrapper": "_1IAK6qQo95yr0sX1cB-NUK",
-        modalWrapper: "_1IAK6qQo95yr0sX1cB-NUK",
-        "modal-positioner": "_2a3TgATMV47a8dPxmPJJu3",
-        modalPositioner: "_2a3TgATMV47a8dPxmPJJu3",
-        small: "_1FWVLR2QM-b4YCht8cg0u3",
-        small: "_1FWVLR2QM-b4YCht8cg0u3",
-        medium: "bdHyyam9Mfx-3q6ErwqP",
-        medium: "bdHyyam9Mfx-3q6ErwqP",
-        large: "_2AbhitOeWy9LNSyZE9-rya",
-        large: "_2AbhitOeWy9LNSyZE9-rya",
-        "x-large": "_3-oqjMINjfCG2QsC9I5UhH",
-        xLarge: "_3-oqjMINjfCG2QsC9I5UhH",
-        "header-flex": "_1Mzn-qxeNWb2oSHuQLZD-",
-        headerFlex: "_1Mzn-qxeNWb2oSHuQLZD-",
-        "content-flex": "_1uEoAAKmruuwr5yfKdX6bi",
-        contentFlex: "_1uEoAAKmruuwr5yfKdX6bi",
-        "footer-flex": "_33E1ZeJ2VsV1Z1hAw_CMOf",
-        footerFlex: "_33E1ZeJ2VsV1Z1hAw_CMOf"
+        "modal-wrapper": "_3HNjaOHjVscVvvjap_Puix",
+        modalWrapper: "_3HNjaOHjVscVvvjap_Puix",
+        "modal-positioner": "_17jawcLHuw3bliHsYfMDR1",
+        modalPositioner: "_17jawcLHuw3bliHsYfMDR1",
+        small: "_3s50RnGrSVMIayo8RAMIds",
+        small: "_3s50RnGrSVMIayo8RAMIds",
+        medium: "YLUGZe2o0CQqYMKmry_8d",
+        medium: "YLUGZe2o0CQqYMKmry_8d",
+        large: "_2gag3shs6cwEnEWmI5vQZX",
+        large: "_2gag3shs6cwEnEWmI5vQZX",
+        "x-large": "_2yhiFEHAOZfF4hWYzDJbFi",
+        xLarge: "_2yhiFEHAOZfF4hWYzDJbFi",
+        "header-flex": "_3xgWgc-r5h5oBecRLXyD2X",
+        headerFlex: "_3xgWgc-r5h5oBecRLXyD2X",
+        "content-flex": "_1aq0ktft7Nck5RKn6hr1KV",
+        contentFlex: "_1aq0ktft7Nck5RKn6hr1KV",
+        "footer-flex": "_3OAP-WTNp1ejvDZrjb6BzY",
+        footerFlex: "_3OAP-WTNp1ejvDZrjb6BzY"
     };
-}, /* 14 */
+}, /* 16 */
 /***/
@@ -279,3 +299,3 @@ function(module, exports) {
     };
-}, /* 15 */
+}, /* 17 */
 /***/
@@ -424,3 +444,3 @@ function(module, exports, __webpack_require__) {
     }();
-}, /* 16 */
+}, /* 18 */
 /***/
@@ -427,0 +447,0 @@ function(module, exports) {

dist/bundle-cjs.min.js

@@ -1,1 +0,1 @@
-module.exports=function(e){function t(o){if(r[o])return r[o].exports;var n=r[o]={exports:{},id:o,loaded:!1};return e[o].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){e.exports=r(4)},,,,function(e,t,r){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var n=r(5),a=o(n),i=r(6),s=o(i),u=r(7),l=o(u),d=r(8),f=o(d),p=r(9),c=o(p),h=r(10),x=o(h),m=r(11),b=o(m),g=r(12),y=o(g),v=r(16),_=o(v),w={values:["small","medium","large","x-large"],defaultValue:"medium"},A=function(e){function t(){var e,r,o,n;(0,s.default)(this,t);for(var i=arguments.length,u=Array(i),l=0;l<i;l++)u[l]=arguments[l];return r=o=(0,f.default)(this,(e=t.__proto__||(0,a.default)(t)).call.apply(e,[this].concat(u))),o.componentDidMount=function(){document.addEventListener("keydown",o.handleKeyDown)},o.componentWillUnmount=function(){document.removeEventListener("keydown",o.handleKeyDown)},o.handleKeyDown=function(e){"Escape"===e.key&&o.props.onDialogDismissed(e)},n=r,(0,f.default)(o,n)}return(0,c.default)(t,e),(0,l.default)(t,[{key:"render",value:function(){if(!this.props.isOpen)return null;var e=this.props,t=e.onDialogDismissed,r=e.header,o=e.children,n=e.footer,a=e.width;return x.default.createElement("div",{className:y.default.modalWrapper},x.default.createElement(_.default,{isTinted:!0,onBlanketClicked:t}),x.default.createElement("div",{className:(0,b.default)([y.default.modalPositioner,y.default[a]])},x.default.createElement("div",{className:y.default.headerFlex},r),x.default.createElement("div",{className:y.default.contentFlex},o),x.default.createElement("div",{className:y.default.footerFlex},n)))}}]),t}(h.PureComponent);A.propTypes={isOpen:h.PropTypes.bool,header:h.PropTypes.node,children:h.PropTypes.node,footer:h.PropTypes.node,width:h.PropTypes.oneOf(w.values),onDialogDismissed:h.PropTypes.func},A.defaultProps={isOpen:!1,onDialogDismissed:function(){},width:w.defaultValue},t.default=A},function(e,t){e.exports=require("babel-runtime/core-js/object/get-prototype-of")},function(e,t){e.exports=require("babel-runtime/helpers/classCallCheck")},function(e,t){e.exports=require("babel-runtime/helpers/createClass")},function(e,t){e.exports=require("babel-runtime/helpers/possibleConstructorReturn")},function(e,t){e.exports=require("babel-runtime/helpers/inherits")},function(e,t){e.exports=require("react")},function(e,t){e.exports=require("classnames")},function(e,t,r){var o=r(13);"string"==typeof o&&(o=[[e.id,o,""]]),r(15)(o,{}),o.locals&&(e.exports=o.locals)},function(e,t,r){t=e.exports=r(14)(),t.push([e.id,'._1IAK6qQo95yr0sX1cB-NUK{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._2a3TgATMV47a8dPxmPJJu3{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._2a3TgATMV47a8dPxmPJJu3._1FWVLR2QM-b4YCht8cg0u3{width:400px}._2a3TgATMV47a8dPxmPJJu3.bdHyyam9Mfx-3q6ErwqP{width:600px}._2a3TgATMV47a8dPxmPJJu3._2AbhitOeWy9LNSyZE9-rya{width:800px}._2a3TgATMV47a8dPxmPJJu3._3-oqjMINjfCG2QsC9I5UhH{width:968px}._2a3TgATMV47a8dPxmPJJu3 ._1Mzn-qxeNWb2oSHuQLZD-{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._2a3TgATMV47a8dPxmPJJu3 ._33E1ZeJ2VsV1Z1hAw_CMOf{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}',""]),t.locals={"modal-wrapper":"_1IAK6qQo95yr0sX1cB-NUK",modalWrapper:"_1IAK6qQo95yr0sX1cB-NUK","modal-positioner":"_2a3TgATMV47a8dPxmPJJu3",modalPositioner:"_2a3TgATMV47a8dPxmPJJu3",small:"_1FWVLR2QM-b4YCht8cg0u3",small:"_1FWVLR2QM-b4YCht8cg0u3",medium:"bdHyyam9Mfx-3q6ErwqP",medium:"bdHyyam9Mfx-3q6ErwqP",large:"_2AbhitOeWy9LNSyZE9-rya",large:"_2AbhitOeWy9LNSyZE9-rya","x-large":"_3-oqjMINjfCG2QsC9I5UhH",xLarge:"_3-oqjMINjfCG2QsC9I5UhH","header-flex":"_1Mzn-qxeNWb2oSHuQLZD-",headerFlex:"_1Mzn-qxeNWb2oSHuQLZD-","content-flex":"_1uEoAAKmruuwr5yfKdX6bi",contentFlex:"_1uEoAAKmruuwr5yfKdX6bi","footer-flex":"_33E1ZeJ2VsV1Z1hAw_CMOf",footerFlex:"_33E1ZeJ2VsV1Z1hAw_CMOf"}},function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var r=this[t];r[2]?e.push("@media "+r[2]+"{"+r[1]+"}"):e.push(r[1])}return e.join("")},e.i=function(t,r){"string"==typeof t&&(t=[[null,t,""]]);for(var o={},n=0;n<this.length;n++){var a=this[n][0];"number"==typeof a&&(o[a]=!0)}for(n=0;n<t.length;n++){var i=t[n];"number"==typeof i[0]&&o[i[0]]||(r&&!i[2]?i[2]=r:r&&(i[2]="("+i[2]+") and ("+r+")"),e.push(i))}},e}},function(e,t,r){function o(e,t){for(var r=0;r<e.length;r++){var o=e[r],n=c[o.id];if(n){n.refs++;for(var a=0;a<n.parts.length;a++)n.parts[a](o.parts[a]);for(;a<o.parts.length;a++)n.parts.push(l(o.parts[a],t))}else{for(var i=[],a=0;a<o.parts.length;a++)i.push(l(o.parts[a],t));c[o.id]={id:o.id,refs:1,parts:i}}}}function n(e){for(var t=[],r={},o=0;o<e.length;o++){var n=e[o],a=n[0],i=n[1],s=n[2],u=n[3],l={css:i,media:s,sourceMap:u};r[a]?r[a].parts.push(l):t.push(r[a]={id:a,parts:[l]})}return t}function a(e,t){var r=m(),o=y[y.length-1];if("top"===e.insertAt)o?o.nextSibling?r.insertBefore(t,o.nextSibling):r.appendChild(t):r.insertBefore(t,r.firstChild),y.push(t);else{if("bottom"!==e.insertAt)throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");r.appendChild(t)}}function i(e){e.parentNode.removeChild(e);var t=y.indexOf(e);t>=0&&y.splice(t,1)}function s(e){var t=document.createElement("style");return t.type="text/css",a(e,t),t}function u(e){var t=document.createElement("link");return t.rel="stylesheet",a(e,t),t}function l(e,t){var r,o,n;if(t.singleton){var a=g++;r=b||(b=s(t)),o=d.bind(null,r,a,!1),n=d.bind(null,r,a,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=u(t),o=p.bind(null,r),n=function(){i(r),r.href&&URL.revokeObjectURL(r.href)}):(r=s(t),o=f.bind(null,r),n=function(){i(r)});return o(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;o(e=t)}else n()}}function d(e,t,r,o){var n=r?"":o.css;if(e.styleSheet)e.styleSheet.cssText=v(t,n);else{var a=document.createTextNode(n),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(a,i[t]):e.appendChild(a)}}function f(e,t){var r=t.css,o=t.media;if(o&&e.setAttribute("media",o),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}function p(e,t){var r=t.css,o=t.sourceMap;o&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");var n=new Blob([r],{type:"text/css"}),a=e.href;e.href=URL.createObjectURL(n),a&&URL.revokeObjectURL(a)}var c={},h=function(e){var t;return function(){return"undefined"==typeof t&&(t=e.apply(this,arguments)),t}},x=h(function(){return/msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase())}),m=h(function(){return document.head||document.getElementsByTagName("head")[0]}),b=null,g=0,y=[];e.exports=function(e,t){t=t||{},"undefined"==typeof t.singleton&&(t.singleton=x()),"undefined"==typeof t.insertAt&&(t.insertAt="bottom");var r=n(e);return o(r,t),function(e){for(var a=[],i=0;i<r.length;i++){var s=r[i],u=c[s.id];u.refs--,a.push(u)}if(e){var l=n(e);o(l,t)}for(var i=0;i<a.length;i++){var u=a[i];if(0===u.refs){for(var d=0;d<u.parts.length;d++)u.parts[d]();delete c[u.id]}}}};var v=function(){var e=[];return function(t,r){return e[t]=r,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=require("@atlaskit/blanket")}]);
+module.exports=function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){e.exports=r(4)},,,,function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=r(5),i=n(o),a=r(6),s=n(a),l=r(7),u=n(l),f=r(8),d=n(f),p=r(9),c=n(p),h=r(10),b=n(h),x=r(11),m=n(x),g=r(12),v=n(g),y=r(13),w=n(y),_=r(14),R=n(_),j=r(18),k=n(j),L={values:["small","medium","large","x-large"],defaultValue:"medium"},D=function(e){function t(){var e,r,n,o;(0,d.default)(this,t);for(var i=arguments.length,a=Array(i),s=0;s<i;s++)a[s]=arguments[s];return r=n=(0,b.default)(this,(e=t.__proto__||(0,u.default)(t)).call.apply(e,[this].concat(a))),n.componentDidMount=function(){document.addEventListener("keydown",n.handleKeyDown)},n.componentWillUnmount=function(){document.removeEventListener("keydown",n.handleKeyDown)},n.handleKeyDown=function(e){"Escape"===e.key&&n.props.onDialogDismissed(e)},o=r,(0,b.default)(n,o)}return(0,m.default)(t,e),(0,c.default)(t,[{key:"render",value:function(){var e;if(!this.props.isOpen)return null;var t=this.props,r=t.onDialogDismissed,n=t.header,o=t.children,a=t.footer,l=t.width,u=L.values.indexOf(l)===-1?{style:{width:l}}:{};return v.default.createElement("div",{className:R.default.modalWrapper},v.default.createElement(k.default,{isTinted:!0,onBlanketClicked:r}),v.default.createElement("div",(0,i.default)({className:(0,w.default)([R.default.modalPositioner,(e={},(0,s.default)(e,R.default.small,"small"===l),(0,s.default)(e,R.default.medium,"medium"===l),(0,s.default)(e,R.default.large,"large"===l),(0,s.default)(e,R.default.xLarge,"x-large"===l),e)])},u),v.default.createElement("div",{className:R.default.headerFlex},n),v.default.createElement("div",{className:R.default.contentFlex},o),v.default.createElement("div",{className:R.default.footerFlex},a)))}}]),t}(g.PureComponent);D.propTypes={isOpen:g.PropTypes.bool,header:g.PropTypes.node,children:g.PropTypes.node,footer:g.PropTypes.node,width:g.PropTypes.oneOfType([g.PropTypes.number,g.PropTypes.string,g.PropTypes.oneOf(L.values)]),onDialogDismissed:g.PropTypes.func},D.defaultProps={isOpen:!1,onDialogDismissed:function(){},width:L.defaultValue},t.default=D},function(e,t){e.exports=require("babel-runtime/helpers/extends")},function(e,t){e.exports=require("babel-runtime/helpers/defineProperty")},function(e,t){e.exports=require("babel-runtime/core-js/object/get-prototype-of")},function(e,t){e.exports=require("babel-runtime/helpers/classCallCheck")},function(e,t){e.exports=require("babel-runtime/helpers/createClass")},function(e,t){e.exports=require("babel-runtime/helpers/possibleConstructorReturn")},function(e,t){e.exports=require("babel-runtime/helpers/inherits")},function(e,t){e.exports=require("react")},function(e,t){e.exports=require("classnames")},function(e,t,r){var n=r(15);"string"==typeof n&&(n=[[e.id,n,""]]),r(17)(n,{}),n.locals&&(e.exports=n.locals)},function(e,t,r){t=e.exports=r(16)(),t.push([e.id,'._3HNjaOHjVscVvvjap_Puix{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._17jawcLHuw3bliHsYfMDR1{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._17jawcLHuw3bliHsYfMDR1._3s50RnGrSVMIayo8RAMIds{width:400px}._17jawcLHuw3bliHsYfMDR1.YLUGZe2o0CQqYMKmry_8d{width:600px}._17jawcLHuw3bliHsYfMDR1._2gag3shs6cwEnEWmI5vQZX{width:800px}._17jawcLHuw3bliHsYfMDR1._2yhiFEHAOZfF4hWYzDJbFi{width:968px}._17jawcLHuw3bliHsYfMDR1 ._3xgWgc-r5h5oBecRLXyD2X{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._17jawcLHuw3bliHsYfMDR1 ._3OAP-WTNp1ejvDZrjb6BzY{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}',""]),t.locals={"modal-wrapper":"_3HNjaOHjVscVvvjap_Puix",modalWrapper:"_3HNjaOHjVscVvvjap_Puix","modal-positioner":"_17jawcLHuw3bliHsYfMDR1",modalPositioner:"_17jawcLHuw3bliHsYfMDR1",small:"_3s50RnGrSVMIayo8RAMIds",small:"_3s50RnGrSVMIayo8RAMIds",medium:"YLUGZe2o0CQqYMKmry_8d",medium:"YLUGZe2o0CQqYMKmry_8d",large:"_2gag3shs6cwEnEWmI5vQZX",large:"_2gag3shs6cwEnEWmI5vQZX","x-large":"_2yhiFEHAOZfF4hWYzDJbFi",xLarge:"_2yhiFEHAOZfF4hWYzDJbFi","header-flex":"_3xgWgc-r5h5oBecRLXyD2X",headerFlex:"_3xgWgc-r5h5oBecRLXyD2X","content-flex":"_1aq0ktft7Nck5RKn6hr1KV",contentFlex:"_1aq0ktft7Nck5RKn6hr1KV","footer-flex":"_3OAP-WTNp1ejvDZrjb6BzY",footerFlex:"_3OAP-WTNp1ejvDZrjb6BzY"}},function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var r=this[t];r[2]?e.push("@media "+r[2]+"{"+r[1]+"}"):e.push(r[1])}return e.join("")},e.i=function(t,r){"string"==typeof t&&(t=[[null,t,""]]);for(var n={},o=0;o<this.length;o++){var i=this[o][0];"number"==typeof i&&(n[i]=!0)}for(o=0;o<t.length;o++){var a=t[o];"number"==typeof a[0]&&n[a[0]]||(r&&!a[2]?a[2]=r:r&&(a[2]="("+a[2]+") and ("+r+")"),e.push(a))}},e}},function(e,t,r){function n(e,t){for(var r=0;r<e.length;r++){var n=e[r],o=c[n.id];if(o){o.refs++;for(var i=0;i<o.parts.length;i++)o.parts[i](n.parts[i]);for(;i<n.parts.length;i++)o.parts.push(u(n.parts[i],t))}else{for(var a=[],i=0;i<n.parts.length;i++)a.push(u(n.parts[i],t));c[n.id]={id:n.id,refs:1,parts:a}}}}function o(e){for(var t=[],r={},n=0;n<e.length;n++){var o=e[n],i=o[0],a=o[1],s=o[2],l=o[3],u={css:a,media:s,sourceMap:l};r[i]?r[i].parts.push(u):t.push(r[i]={id:i,parts:[u]})}return t}function i(e,t){var r=x(),n=v[v.length-1];if("top"===e.insertAt)n?n.nextSibling?r.insertBefore(t,n.nextSibling):r.appendChild(t):r.insertBefore(t,r.firstChild),v.push(t);else{if("bottom"!==e.insertAt)throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");r.appendChild(t)}}function a(e){e.parentNode.removeChild(e);var t=v.indexOf(e);t>=0&&v.splice(t,1)}function s(e){var t=document.createElement("style");return t.type="text/css",i(e,t),t}function l(e){var t=document.createElement("link");return t.rel="stylesheet",i(e,t),t}function u(e,t){var r,n,o;if(t.singleton){var i=g++;r=m||(m=s(t)),n=f.bind(null,r,i,!1),o=f.bind(null,r,i,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=l(t),n=p.bind(null,r),o=function(){a(r),r.href&&URL.revokeObjectURL(r.href)}):(r=s(t),n=d.bind(null,r),o=function(){a(r)});return n(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;n(e=t)}else o()}}function f(e,t,r,n){var o=r?"":n.css;if(e.styleSheet)e.styleSheet.cssText=y(t,o);else{var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}function d(e,t){var r=t.css,n=t.media;if(n&&e.setAttribute("media",n),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}function p(e,t){var r=t.css,n=t.sourceMap;n&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */");var o=new Blob([r],{type:"text/css"}),i=e.href;e.href=URL.createObjectURL(o),i&&URL.revokeObjectURL(i)}var c={},h=function(e){var t;return function(){return"undefined"==typeof t&&(t=e.apply(this,arguments)),t}},b=h(function(){return/msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase())}),x=h(function(){return document.head||document.getElementsByTagName("head")[0]}),m=null,g=0,v=[];e.exports=function(e,t){t=t||{},"undefined"==typeof t.singleton&&(t.singleton=b()),"undefined"==typeof t.insertAt&&(t.insertAt="bottom");var r=o(e);return n(r,t),function(e){for(var i=[],a=0;a<r.length;a++){var s=r[a],l=c[s.id];l.refs--,i.push(l)}if(e){var u=o(e);n(u,t)}for(var a=0;a<i.length;a++){var l=i[a];if(0===l.refs){for(var f=0;f<l.parts.length;f++)l.parts[f]();delete c[l.id]}}}};var y=function(){var e=[];return function(t,r){return e[t]=r,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=require("@atlaskit/blanket")}]);

dist/bundle.js

 !function(root, factory) {
-    "object" == typeof exports && "object" == typeof module ? module.exports = factory(require("babel-runtime/core-js/object/get-prototype-of"), require("babel-runtime/helpers/classCallCheck"), require("babel-runtime/helpers/createClass"), require("babel-runtime/helpers/possibleConstructorReturn"), require("babel-runtime/helpers/inherits"), require("react"), require("classnames"), require("@atlaskit/blanket")) : "function" == typeof define && define.amd ? define([ "babel-runtime/core-js/object/get-prototype-of", "babel-runtime/helpers/classCallCheck", "babel-runtime/helpers/createClass", "babel-runtime/helpers/possibleConstructorReturn", "babel-runtime/helpers/inherits", "react", "classnames", "@atlaskit/blanket" ], factory) : "object" == typeof exports ? exports["@atlaskit/modalDialog"] = factory(require("babel-runtime/core-js/object/get-prototype-of"), require("babel-runtime/helpers/classCallCheck"), require("babel-runtime/helpers/createClass"), require("babel-runtime/helpers/possibleConstructorReturn"), require("babel-runtime/helpers/inherits"), require("react"), require("classnames"), require("@atlaskit/blanket")) : root["@atlaskit/modalDialog"] = factory(root["babel-runtime/core-js/object/get-prototype-of"], root["babel-runtime/helpers/classCallCheck"], root["babel-runtime/helpers/createClass"], root["babel-runtime/helpers/possibleConstructorReturn"], root["babel-runtime/helpers/inherits"], root.react, root.classnames, root["@atlaskit/blanket"]);
-}(this, function(__WEBPACK_EXTERNAL_MODULE_5__, __WEBPACK_EXTERNAL_MODULE_6__, __WEBPACK_EXTERNAL_MODULE_7__, __WEBPACK_EXTERNAL_MODULE_8__, __WEBPACK_EXTERNAL_MODULE_9__, __WEBPACK_EXTERNAL_MODULE_10__, __WEBPACK_EXTERNAL_MODULE_11__, __WEBPACK_EXTERNAL_MODULE_16__) {
+    "object" == typeof exports && "object" == typeof module ? module.exports = factory(require("babel-runtime/helpers/extends"), require("babel-runtime/helpers/defineProperty"), require("babel-runtime/core-js/object/get-prototype-of"), require("babel-runtime/helpers/classCallCheck"), require("babel-runtime/helpers/createClass"), require("babel-runtime/helpers/possibleConstructorReturn"), require("babel-runtime/helpers/inherits"), require("react"), require("classnames"), require("@atlaskit/blanket")) : "function" == typeof define && define.amd ? define([ "babel-runtime/helpers/extends", "babel-runtime/helpers/defineProperty", "babel-runtime/core-js/object/get-prototype-of", "babel-runtime/helpers/classCallCheck", "babel-runtime/helpers/createClass", "babel-runtime/helpers/possibleConstructorReturn", "babel-runtime/helpers/inherits", "react", "classnames", "@atlaskit/blanket" ], factory) : "object" == typeof exports ? exports["@atlaskit/modalDialog"] = factory(require("babel-runtime/helpers/extends"), require("babel-runtime/helpers/defineProperty"), require("babel-runtime/core-js/object/get-prototype-of"), require("babel-runtime/helpers/classCallCheck"), require("babel-runtime/helpers/createClass"), require("babel-runtime/helpers/possibleConstructorReturn"), require("babel-runtime/helpers/inherits"), require("react"), require("classnames"), require("@atlaskit/blanket")) : root["@atlaskit/modalDialog"] = factory(root["babel-runtime/helpers/extends"], root["babel-runtime/helpers/defineProperty"], root["babel-runtime/core-js/object/get-prototype-of"], root["babel-runtime/helpers/classCallCheck"], root["babel-runtime/helpers/createClass"], root["babel-runtime/helpers/possibleConstructorReturn"], root["babel-runtime/helpers/inherits"], root.react, root.classnames, root["@atlaskit/blanket"]);
+}(this, function(__WEBPACK_EXTERNAL_MODULE_5__, __WEBPACK_EXTERNAL_MODULE_6__, __WEBPACK_EXTERNAL_MODULE_7__, __WEBPACK_EXTERNAL_MODULE_8__, __WEBPACK_EXTERNAL_MODULE_9__, __WEBPACK_EXTERNAL_MODULE_10__, __WEBPACK_EXTERNAL_MODULE_11__, __WEBPACK_EXTERNAL_MODULE_12__, __WEBPACK_EXTERNAL_MODULE_13__, __WEBPACK_EXTERNAL_MODULE_18__) {
     /******/
@@ -87,3 +87,3 @@ return function(modules) {
         });
-        var _getPrototypeOf = __webpack_require__(5), _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf), _classCallCheck2 = __webpack_require__(6), _classCallCheck3 = _interopRequireDefault(_classCallCheck2), _createClass2 = __webpack_require__(7), _createClass3 = _interopRequireDefault(_createClass2), _possibleConstructorReturn2 = __webpack_require__(8), _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2), _inherits2 = __webpack_require__(9), _inherits3 = _interopRequireDefault(_inherits2), _react = __webpack_require__(10), _react2 = _interopRequireDefault(_react), _classnames = __webpack_require__(11), _classnames2 = _interopRequireDefault(_classnames), _style = __webpack_require__(12), _style2 = _interopRequireDefault(_style), _blanket = __webpack_require__(16), _blanket2 = _interopRequireDefault(_blanket), WIDTH_ENUM = {
+        var _extends2 = __webpack_require__(5), _extends3 = _interopRequireDefault(_extends2), _defineProperty2 = __webpack_require__(6), _defineProperty3 = _interopRequireDefault(_defineProperty2), _getPrototypeOf = __webpack_require__(7), _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf), _classCallCheck2 = __webpack_require__(8), _classCallCheck3 = _interopRequireDefault(_classCallCheck2), _createClass2 = __webpack_require__(9), _createClass3 = _interopRequireDefault(_createClass2), _possibleConstructorReturn2 = __webpack_require__(10), _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2), _inherits2 = __webpack_require__(11), _inherits3 = _interopRequireDefault(_inherits2), _react = __webpack_require__(12), _react2 = _interopRequireDefault(_react), _classnames = __webpack_require__(13), _classnames2 = _interopRequireDefault(_classnames), _style = __webpack_require__(14), _style2 = _interopRequireDefault(_style), _blanket = __webpack_require__(18), _blanket2 = _interopRequireDefault(_blanket), WIDTH_ENUM = {
             values: [ "small", "medium", "large", "x-large" ],
@@ -109,5 +109,10 @@ defaultValue: "medium"
                 value: function() {
+                    var _ref2;
                     // don't render anything if open = false
                     if (!this.props.isOpen) return null;
-                    var _props = this.props, onDialogDismissed = _props.onDialogDismissed, header = _props.header, children = _props.children, footer = _props.footer, width = _props.width;
+                    var _props = this.props, onDialogDismissed = _props.onDialogDismissed, header = _props.header, children = _props.children, footer = _props.footer, width = _props.width, customStyle = WIDTH_ENUM.values.indexOf(width) === -1 ? {
+                        style: {
+                            width: width
+                        }
+                    } : {};
                     return _react2.default.createElement("div", {
@@ -118,5 +123,10 @@ className: _style2.default.modalWrapper
                         onBlanketClicked: onDialogDismissed
-                    }), _react2.default.createElement("div", {
-                        className: (0, _classnames2.default)([ _style2.default.modalPositioner, _style2.default[width] ])
-                    }, _react2.default.createElement("div", {
+                    }), _react2.default.createElement("div", (0, _extends3.default)({
+                        className: (0, _classnames2.default)([ _style2.default.modalPositioner, (_ref2 = {}, 
+                        (0, _defineProperty3.default)(_ref2, _style2.default.small, "small" === width), 
+                        (0, _defineProperty3.default)(_ref2, _style2.default.medium, "medium" === width), 
+                        (0, _defineProperty3.default)(_ref2, _style2.default.large, "large" === width), 
+                        (0, _defineProperty3.default)(_ref2, _style2.default.xLarge, "x-large" === width), 
+                        _ref2) ])
+                    }, customStyle), _react2.default.createElement("div", {
                         className: _style2.default.headerFlex
@@ -160,3 +170,5 @@ }, header), _react2.default.createElement("div", {
 	   * @description The maximum width tier of the dialog
-	   * Allowed values are: 'small' (400px), 'medium' (600px), 'large' (800px), 'x-large' (968px).
+	   * Allowed values are: 'small' (400px), 'medium' (600px), 'large' (800px), 'x-large' (968px),
+	   * or any integer value defining the pixel width (e.g. 300), or any string value defining the
+	   * pixel or percentage width including unit (e.g. 300px, 75%).
 	   * @memberof ModalDialog
@@ -167,3 +179,3 @@ * @instance
 	   */
-            width: _react.PropTypes.oneOf(WIDTH_ENUM.values),
+            width: _react.PropTypes.oneOfType([ _react.PropTypes.number, _react.PropTypes.string, _react.PropTypes.oneOf(WIDTH_ENUM.values) ]),
             /**
@@ -211,38 +223,46 @@ * @description Handler function to be called when the blanket is clicked
     /***/
+    function(module, exports) {
+        module.exports = __WEBPACK_EXTERNAL_MODULE_12__;
+    }, /* 13 */
+    /***/
+    function(module, exports) {
+        module.exports = __WEBPACK_EXTERNAL_MODULE_13__;
+    }, /* 14 */
+    /***/
     function(module, exports, __webpack_require__) {
         // style-loader: Adds some css to the DOM by adding a <style> tag
         // load the styles
-        var content = __webpack_require__(13);
+        var content = __webpack_require__(15);
         "string" == typeof content && (content = [ [ module.id, content, "" ] ]);
         // add the styles to the DOM
-        __webpack_require__(15)(content, {});
+        __webpack_require__(17)(content, {});
         content.locals && (module.exports = content.locals);
-    }, /* 13 */
+    }, /* 15 */
     /***/
     function(module, exports, __webpack_require__) {
-        exports = module.exports = __webpack_require__(14)(), // imports
+        exports = module.exports = __webpack_require__(16)(), // imports
         // module
-        exports.push([ module.id, '._1IAK6qQo95yr0sX1cB-NUK{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._2a3TgATMV47a8dPxmPJJu3{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._2a3TgATMV47a8dPxmPJJu3._1FWVLR2QM-b4YCht8cg0u3{width:400px}._2a3TgATMV47a8dPxmPJJu3.bdHyyam9Mfx-3q6ErwqP{width:600px}._2a3TgATMV47a8dPxmPJJu3._2AbhitOeWy9LNSyZE9-rya{width:800px}._2a3TgATMV47a8dPxmPJJu3._3-oqjMINjfCG2QsC9I5UhH{width:968px}._2a3TgATMV47a8dPxmPJJu3 ._1Mzn-qxeNWb2oSHuQLZD-{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._2a3TgATMV47a8dPxmPJJu3 ._33E1ZeJ2VsV1Z1hAw_CMOf{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}', "" ]), 
+        exports.push([ module.id, '._3HNjaOHjVscVvvjap_Puix{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._17jawcLHuw3bliHsYfMDR1{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._17jawcLHuw3bliHsYfMDR1._3s50RnGrSVMIayo8RAMIds{width:400px}._17jawcLHuw3bliHsYfMDR1.YLUGZe2o0CQqYMKmry_8d{width:600px}._17jawcLHuw3bliHsYfMDR1._2gag3shs6cwEnEWmI5vQZX{width:800px}._17jawcLHuw3bliHsYfMDR1._2yhiFEHAOZfF4hWYzDJbFi{width:968px}._17jawcLHuw3bliHsYfMDR1 ._3xgWgc-r5h5oBecRLXyD2X{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._17jawcLHuw3bliHsYfMDR1 ._3OAP-WTNp1ejvDZrjb6BzY{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}', "" ]), 
         // exports
         exports.locals = {
-            "modal-wrapper": "_1IAK6qQo95yr0sX1cB-NUK",
-            modalWrapper: "_1IAK6qQo95yr0sX1cB-NUK",
-            "modal-positioner": "_2a3TgATMV47a8dPxmPJJu3",
-            modalPositioner: "_2a3TgATMV47a8dPxmPJJu3",
-            small: "_1FWVLR2QM-b4YCht8cg0u3",
-            small: "_1FWVLR2QM-b4YCht8cg0u3",
-            medium: "bdHyyam9Mfx-3q6ErwqP",
-            medium: "bdHyyam9Mfx-3q6ErwqP",
-            large: "_2AbhitOeWy9LNSyZE9-rya",
-            large: "_2AbhitOeWy9LNSyZE9-rya",
-            "x-large": "_3-oqjMINjfCG2QsC9I5UhH",
-            xLarge: "_3-oqjMINjfCG2QsC9I5UhH",
-            "header-flex": "_1Mzn-qxeNWb2oSHuQLZD-",
-            headerFlex: "_1Mzn-qxeNWb2oSHuQLZD-",
-            "content-flex": "_1uEoAAKmruuwr5yfKdX6bi",
-            contentFlex: "_1uEoAAKmruuwr5yfKdX6bi",
-            "footer-flex": "_33E1ZeJ2VsV1Z1hAw_CMOf",
-            footerFlex: "_33E1ZeJ2VsV1Z1hAw_CMOf"
+            "modal-wrapper": "_3HNjaOHjVscVvvjap_Puix",
+            modalWrapper: "_3HNjaOHjVscVvvjap_Puix",
+            "modal-positioner": "_17jawcLHuw3bliHsYfMDR1",
+            modalPositioner: "_17jawcLHuw3bliHsYfMDR1",
+            small: "_3s50RnGrSVMIayo8RAMIds",
+            small: "_3s50RnGrSVMIayo8RAMIds",
+            medium: "YLUGZe2o0CQqYMKmry_8d",
+            medium: "YLUGZe2o0CQqYMKmry_8d",
+            large: "_2gag3shs6cwEnEWmI5vQZX",
+            large: "_2gag3shs6cwEnEWmI5vQZX",
+            "x-large": "_2yhiFEHAOZfF4hWYzDJbFi",
+            xLarge: "_2yhiFEHAOZfF4hWYzDJbFi",
+            "header-flex": "_3xgWgc-r5h5oBecRLXyD2X",
+            headerFlex: "_3xgWgc-r5h5oBecRLXyD2X",
+            "content-flex": "_1aq0ktft7Nck5RKn6hr1KV",
+            contentFlex: "_1aq0ktft7Nck5RKn6hr1KV",
+            "footer-flex": "_3OAP-WTNp1ejvDZrjb6BzY",
+            footerFlex: "_3OAP-WTNp1ejvDZrjb6BzY"
         };
-    }, /* 14 */
+    }, /* 16 */
     /***/
@@ -282,3 +302,3 @@ function(module, exports) {
         };
-    }, /* 15 */
+    }, /* 17 */
     /***/
@@ -427,7 +447,7 @@ function(module, exports, __webpack_require__) {
         }();
-    }, /* 16 */
+    }, /* 18 */
     /***/
     function(module, exports) {
-        module.exports = __WEBPACK_EXTERNAL_MODULE_16__;
+        module.exports = __WEBPACK_EXTERNAL_MODULE_18__;
     } ]);
 });

dist/bundle.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("babel-runtime/core-js/object/get-prototype-of"),require("babel-runtime/helpers/classCallCheck"),require("babel-runtime/helpers/createClass"),require("babel-runtime/helpers/possibleConstructorReturn"),require("babel-runtime/helpers/inherits"),require("react"),require("classnames"),require("@atlaskit/blanket")):"function"==typeof define&&define.amd?define(["babel-runtime/core-js/object/get-prototype-of","babel-runtime/helpers/classCallCheck","babel-runtime/helpers/createClass","babel-runtime/helpers/possibleConstructorReturn","babel-runtime/helpers/inherits","react","classnames","@atlaskit/blanket"],t):"object"==typeof exports?exports["@atlaskit/modalDialog"]=t(require("babel-runtime/core-js/object/get-prototype-of"),require("babel-runtime/helpers/classCallCheck"),require("babel-runtime/helpers/createClass"),require("babel-runtime/helpers/possibleConstructorReturn"),require("babel-runtime/helpers/inherits"),require("react"),require("classnames"),require("@atlaskit/blanket")):e["@atlaskit/modalDialog"]=t(e["babel-runtime/core-js/object/get-prototype-of"],e["babel-runtime/helpers/classCallCheck"],e["babel-runtime/helpers/createClass"],e["babel-runtime/helpers/possibleConstructorReturn"],e["babel-runtime/helpers/inherits"],e.react,e.classnames,e["@atlaskit/blanket"])}(this,function(e,t,r,o,n,a,i,s){return function(e){function t(o){if(r[o])return r[o].exports;var n=r[o]={exports:{},id:o,loaded:!1};return e[o].call(n.exports,n,n.exports,t),n.loaded=!0,n.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){e.exports=r(4)},,,,function(e,t,r){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var n=r(5),a=o(n),i=r(6),s=o(i),l=r(7),u=o(l),d=r(8),f=o(d),p=r(9),c=o(p),b=r(10),h=o(b),m=r(11),x=o(m),g=r(12),y=o(g),v=r(16),_=o(v),w={values:["small","medium","large","x-large"],defaultValue:"medium"},C=function(e){function t(){var e,r,o,n;(0,s.default)(this,t);for(var i=arguments.length,l=Array(i),u=0;u<i;u++)l[u]=arguments[u];return r=o=(0,f.default)(this,(e=t.__proto__||(0,a.default)(t)).call.apply(e,[this].concat(l))),o.componentDidMount=function(){document.addEventListener("keydown",o.handleKeyDown)},o.componentWillUnmount=function(){document.removeEventListener("keydown",o.handleKeyDown)},o.handleKeyDown=function(e){"Escape"===e.key&&o.props.onDialogDismissed(e)},n=r,(0,f.default)(o,n)}return(0,c.default)(t,e),(0,u.default)(t,[{key:"render",value:function(){if(!this.props.isOpen)return null;var e=this.props,t=e.onDialogDismissed,r=e.header,o=e.children,n=e.footer,a=e.width;return h.default.createElement("div",{className:y.default.modalWrapper},h.default.createElement(_.default,{isTinted:!0,onBlanketClicked:t}),h.default.createElement("div",{className:(0,x.default)([y.default.modalPositioner,y.default[a]])},h.default.createElement("div",{className:y.default.headerFlex},r),h.default.createElement("div",{className:y.default.contentFlex},o),h.default.createElement("div",{className:y.default.footerFlex},n)))}}]),t}(b.PureComponent);C.propTypes={isOpen:b.PropTypes.bool,header:b.PropTypes.node,children:b.PropTypes.node,footer:b.PropTypes.node,width:b.PropTypes.oneOf(w.values),onDialogDismissed:b.PropTypes.func},C.defaultProps={isOpen:!1,onDialogDismissed:function(){},width:w.defaultValue},t.default=C},function(t,r){t.exports=e},function(e,r){e.exports=t},function(e,t){e.exports=r},function(e,t){e.exports=o},function(e,t){e.exports=n},function(e,t){e.exports=a},function(e,t){e.exports=i},function(e,t,r){var o=r(13);"string"==typeof o&&(o=[[e.id,o,""]]),r(15)(o,{}),o.locals&&(e.exports=o.locals)},function(e,t,r){t=e.exports=r(14)(),t.push([e.id,'._1IAK6qQo95yr0sX1cB-NUK{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._2a3TgATMV47a8dPxmPJJu3{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._2a3TgATMV47a8dPxmPJJu3._1FWVLR2QM-b4YCht8cg0u3{width:400px}._2a3TgATMV47a8dPxmPJJu3.bdHyyam9Mfx-3q6ErwqP{width:600px}._2a3TgATMV47a8dPxmPJJu3._2AbhitOeWy9LNSyZE9-rya{width:800px}._2a3TgATMV47a8dPxmPJJu3._3-oqjMINjfCG2QsC9I5UhH{width:968px}._2a3TgATMV47a8dPxmPJJu3 ._1Mzn-qxeNWb2oSHuQLZD-{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._2a3TgATMV47a8dPxmPJJu3 ._1uEoAAKmruuwr5yfKdX6bi:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._2a3TgATMV47a8dPxmPJJu3 ._33E1ZeJ2VsV1Z1hAw_CMOf{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}',""]),t.locals={"modal-wrapper":"_1IAK6qQo95yr0sX1cB-NUK",modalWrapper:"_1IAK6qQo95yr0sX1cB-NUK","modal-positioner":"_2a3TgATMV47a8dPxmPJJu3",modalPositioner:"_2a3TgATMV47a8dPxmPJJu3",small:"_1FWVLR2QM-b4YCht8cg0u3",small:"_1FWVLR2QM-b4YCht8cg0u3",medium:"bdHyyam9Mfx-3q6ErwqP",medium:"bdHyyam9Mfx-3q6ErwqP",large:"_2AbhitOeWy9LNSyZE9-rya",large:"_2AbhitOeWy9LNSyZE9-rya","x-large":"_3-oqjMINjfCG2QsC9I5UhH",xLarge:"_3-oqjMINjfCG2QsC9I5UhH","header-flex":"_1Mzn-qxeNWb2oSHuQLZD-",headerFlex:"_1Mzn-qxeNWb2oSHuQLZD-","content-flex":"_1uEoAAKmruuwr5yfKdX6bi",contentFlex:"_1uEoAAKmruuwr5yfKdX6bi","footer-flex":"_33E1ZeJ2VsV1Z1hAw_CMOf",footerFlex:"_33E1ZeJ2VsV1Z1hAw_CMOf"}},function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var r=this[t];r[2]?e.push("@media "+r[2]+"{"+r[1]+"}"):e.push(r[1])}return e.join("")},e.i=function(t,r){"string"==typeof t&&(t=[[null,t,""]]);for(var o={},n=0;n<this.length;n++){var a=this[n][0];"number"==typeof a&&(o[a]=!0)}for(n=0;n<t.length;n++){var i=t[n];"number"==typeof i[0]&&o[i[0]]||(r&&!i[2]?i[2]=r:r&&(i[2]="("+i[2]+") and ("+r+")"),e.push(i))}},e}},function(e,t,r){function o(e,t){for(var r=0;r<e.length;r++){var o=e[r],n=c[o.id];if(n){n.refs++;for(var a=0;a<n.parts.length;a++)n.parts[a](o.parts[a]);for(;a<o.parts.length;a++)n.parts.push(u(o.parts[a],t))}else{for(var i=[],a=0;a<o.parts.length;a++)i.push(u(o.parts[a],t));c[o.id]={id:o.id,refs:1,parts:i}}}}function n(e){for(var t=[],r={},o=0;o<e.length;o++){var n=e[o],a=n[0],i=n[1],s=n[2],l=n[3],u={css:i,media:s,sourceMap:l};r[a]?r[a].parts.push(u):t.push(r[a]={id:a,parts:[u]})}return t}function a(e,t){var r=m(),o=y[y.length-1];if("top"===e.insertAt)o?o.nextSibling?r.insertBefore(t,o.nextSibling):r.appendChild(t):r.insertBefore(t,r.firstChild),y.push(t);else{if("bottom"!==e.insertAt)throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");r.appendChild(t)}}function i(e){e.parentNode.removeChild(e);var t=y.indexOf(e);t>=0&&y.splice(t,1)}function s(e){var t=document.createElement("style");return t.type="text/css",a(e,t),t}function l(e){var t=document.createElement("link");return t.rel="stylesheet",a(e,t),t}function u(e,t){var r,o,n;if(t.singleton){var a=g++;r=x||(x=s(t)),o=d.bind(null,r,a,!1),n=d.bind(null,r,a,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=l(t),o=p.bind(null,r),n=function(){i(r),r.href&&URL.revokeObjectURL(r.href)}):(r=s(t),o=f.bind(null,r),n=function(){i(r)});return o(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;o(e=t)}else n()}}function d(e,t,r,o){var n=r?"":o.css;if(e.styleSheet)e.styleSheet.cssText=v(t,n);else{var a=document.createTextNode(n),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(a,i[t]):e.appendChild(a)}}function f(e,t){var r=t.css,o=t.media;if(o&&e.setAttribute("media",o),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}function p(e,t){var r=t.css,o=t.sourceMap;o&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */");var n=new Blob([r],{type:"text/css"}),a=e.href;e.href=URL.createObjectURL(n),a&&URL.revokeObjectURL(a)}var c={},b=function(e){var t;return function(){return"undefined"==typeof t&&(t=e.apply(this,arguments)),t}},h=b(function(){return/msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase())}),m=b(function(){return document.head||document.getElementsByTagName("head")[0]}),x=null,g=0,y=[];e.exports=function(e,t){t=t||{},"undefined"==typeof t.singleton&&(t.singleton=h()),"undefined"==typeof t.insertAt&&(t.insertAt="bottom");var r=n(e);return o(r,t),function(e){for(var a=[],i=0;i<r.length;i++){var s=r[i],l=c[s.id];l.refs--,a.push(l)}if(e){var u=n(e);o(u,t)}for(var i=0;i<a.length;i++){var l=a[i];if(0===l.refs){for(var d=0;d<l.parts.length;d++)l.parts[d]();delete c[l.id]}}}};var v=function(){var e=[];return function(t,r){return e[t]=r,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=s}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("babel-runtime/helpers/extends"),require("babel-runtime/helpers/defineProperty"),require("babel-runtime/core-js/object/get-prototype-of"),require("babel-runtime/helpers/classCallCheck"),require("babel-runtime/helpers/createClass"),require("babel-runtime/helpers/possibleConstructorReturn"),require("babel-runtime/helpers/inherits"),require("react"),require("classnames"),require("@atlaskit/blanket")):"function"==typeof define&&define.amd?define(["babel-runtime/helpers/extends","babel-runtime/helpers/defineProperty","babel-runtime/core-js/object/get-prototype-of","babel-runtime/helpers/classCallCheck","babel-runtime/helpers/createClass","babel-runtime/helpers/possibleConstructorReturn","babel-runtime/helpers/inherits","react","classnames","@atlaskit/blanket"],t):"object"==typeof exports?exports["@atlaskit/modalDialog"]=t(require("babel-runtime/helpers/extends"),require("babel-runtime/helpers/defineProperty"),require("babel-runtime/core-js/object/get-prototype-of"),require("babel-runtime/helpers/classCallCheck"),require("babel-runtime/helpers/createClass"),require("babel-runtime/helpers/possibleConstructorReturn"),require("babel-runtime/helpers/inherits"),require("react"),require("classnames"),require("@atlaskit/blanket")):e["@atlaskit/modalDialog"]=t(e["babel-runtime/helpers/extends"],e["babel-runtime/helpers/defineProperty"],e["babel-runtime/core-js/object/get-prototype-of"],e["babel-runtime/helpers/classCallCheck"],e["babel-runtime/helpers/createClass"],e["babel-runtime/helpers/possibleConstructorReturn"],e["babel-runtime/helpers/inherits"],e.react,e.classnames,e["@atlaskit/blanket"])}(this,function(e,t,r,n,o,i,a,s,l,u){return function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){e.exports=r(4)},,,,function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=r(5),i=n(o),a=r(6),s=n(a),l=r(7),u=n(l),p=r(8),f=n(p),d=r(9),c=n(d),b=r(10),h=n(b),m=r(11),x=n(m),g=r(12),v=n(g),y=r(13),w=n(y),_=r(14),j=n(_),k=r(18),R=n(k),D={values:["small","medium","large","x-large"],defaultValue:"medium"},L=function(e){function t(){var e,r,n,o;(0,f.default)(this,t);for(var i=arguments.length,a=Array(i),s=0;s<i;s++)a[s]=arguments[s];return r=n=(0,h.default)(this,(e=t.__proto__||(0,u.default)(t)).call.apply(e,[this].concat(a))),n.componentDidMount=function(){document.addEventListener("keydown",n.handleKeyDown)},n.componentWillUnmount=function(){document.removeEventListener("keydown",n.handleKeyDown)},n.handleKeyDown=function(e){"Escape"===e.key&&n.props.onDialogDismissed(e)},o=r,(0,h.default)(n,o)}return(0,x.default)(t,e),(0,c.default)(t,[{key:"render",value:function(){var e;if(!this.props.isOpen)return null;var t=this.props,r=t.onDialogDismissed,n=t.header,o=t.children,a=t.footer,l=t.width,u=D.values.indexOf(l)===-1?{style:{width:l}}:{};return v.default.createElement("div",{className:j.default.modalWrapper},v.default.createElement(R.default,{isTinted:!0,onBlanketClicked:r}),v.default.createElement("div",(0,i.default)({className:(0,w.default)([j.default.modalPositioner,(e={},(0,s.default)(e,j.default.small,"small"===l),(0,s.default)(e,j.default.medium,"medium"===l),(0,s.default)(e,j.default.large,"large"===l),(0,s.default)(e,j.default.xLarge,"x-large"===l),e)])},u),v.default.createElement("div",{className:j.default.headerFlex},n),v.default.createElement("div",{className:j.default.contentFlex},o),v.default.createElement("div",{className:j.default.footerFlex},a)))}}]),t}(g.PureComponent);L.propTypes={isOpen:g.PropTypes.bool,header:g.PropTypes.node,children:g.PropTypes.node,footer:g.PropTypes.node,width:g.PropTypes.oneOfType([g.PropTypes.number,g.PropTypes.string,g.PropTypes.oneOf(D.values)]),onDialogDismissed:g.PropTypes.func},L.defaultProps={isOpen:!1,onDialogDismissed:function(){},width:D.defaultValue},t.default=L},function(t,r){t.exports=e},function(e,r){e.exports=t},function(e,t){e.exports=r},function(e,t){e.exports=n},function(e,t){e.exports=o},function(e,t){e.exports=i},function(e,t){e.exports=a},function(e,t){e.exports=s},function(e,t){e.exports=l},function(e,t,r){var n=r(15);"string"==typeof n&&(n=[[e.id,n,""]]),r(17)(n,{}),n.locals&&(e.exports=n.locals)},function(e,t,r){t=e.exports=r(16)(),t.push([e.id,'._3HNjaOHjVscVvvjap_Puix{height:100%;left:0;position:fixed;top:0;width:100%;z-index:500}._17jawcLHuw3bliHsYfMDR1{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:calc(100% - 120px);margin:0 auto;height:calc(100% - 120px);margin-top:60px;position:relative;z-index:510}._17jawcLHuw3bliHsYfMDR1._3s50RnGrSVMIayo8RAMIds{width:400px}._17jawcLHuw3bliHsYfMDR1.YLUGZe2o0CQqYMKmry_8d{width:600px}._17jawcLHuw3bliHsYfMDR1._2gag3shs6cwEnEWmI5vQZX{width:800px}._17jawcLHuw3bliHsYfMDR1._2yhiFEHAOZfF4hWYzDJbFi{width:968px}._17jawcLHuw3bliHsYfMDR1 ._3xgWgc-r5h5oBecRLXyD2X{-webkit-box-flex:0;flex:0 0 auto;padding:16px;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV{-webkit-box-flex:0;flex:0 1 auto;overflow:auto;box-sizing:border-box;padding:0 16px;position:relative;z-index:511;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),inset 0 2px 0 0 #ebecf0,inset 0 -2px 0 0 #ebecf0;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:before{background:#fff;content:"";display:block;height:2px;left:0;position:absolute;right:0;top:0}._17jawcLHuw3bliHsYfMDR1 ._1aq0ktft7Nck5RKn6hr1KV:after{background:#fff;content:"";display:block;height:2px;margin-right:-16px;margin-left:-16px}._17jawcLHuw3bliHsYfMDR1 ._3OAP-WTNp1ejvDZrjb6BzY{-webkit-box-flex:0;flex:0 0 auto;padding:16px;z-index:512;box-shadow:0 8px 20px -4px rgba(9,30,66,.25),0 0 0 transparent,0 0 0 transparent;background-color:#fff;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}',""]),t.locals={"modal-wrapper":"_3HNjaOHjVscVvvjap_Puix",modalWrapper:"_3HNjaOHjVscVvvjap_Puix","modal-positioner":"_17jawcLHuw3bliHsYfMDR1",modalPositioner:"_17jawcLHuw3bliHsYfMDR1",small:"_3s50RnGrSVMIayo8RAMIds",small:"_3s50RnGrSVMIayo8RAMIds",medium:"YLUGZe2o0CQqYMKmry_8d",medium:"YLUGZe2o0CQqYMKmry_8d",large:"_2gag3shs6cwEnEWmI5vQZX",large:"_2gag3shs6cwEnEWmI5vQZX","x-large":"_2yhiFEHAOZfF4hWYzDJbFi",xLarge:"_2yhiFEHAOZfF4hWYzDJbFi","header-flex":"_3xgWgc-r5h5oBecRLXyD2X",headerFlex:"_3xgWgc-r5h5oBecRLXyD2X","content-flex":"_1aq0ktft7Nck5RKn6hr1KV",contentFlex:"_1aq0ktft7Nck5RKn6hr1KV","footer-flex":"_3OAP-WTNp1ejvDZrjb6BzY",footerFlex:"_3OAP-WTNp1ejvDZrjb6BzY"}},function(e,t){e.exports=function(){var e=[];return e.toString=function(){for(var e=[],t=0;t<this.length;t++){var r=this[t];r[2]?e.push("@media "+r[2]+"{"+r[1]+"}"):e.push(r[1])}return e.join("")},e.i=function(t,r){"string"==typeof t&&(t=[[null,t,""]]);for(var n={},o=0;o<this.length;o++){var i=this[o][0];"number"==typeof i&&(n[i]=!0)}for(o=0;o<t.length;o++){var a=t[o];"number"==typeof a[0]&&n[a[0]]||(r&&!a[2]?a[2]=r:r&&(a[2]="("+a[2]+") and ("+r+")"),e.push(a))}},e}},function(e,t,r){function n(e,t){for(var r=0;r<e.length;r++){var n=e[r],o=c[n.id];if(o){o.refs++;for(var i=0;i<o.parts.length;i++)o.parts[i](n.parts[i]);for(;i<n.parts.length;i++)o.parts.push(u(n.parts[i],t))}else{for(var a=[],i=0;i<n.parts.length;i++)a.push(u(n.parts[i],t));c[n.id]={id:n.id,refs:1,parts:a}}}}function o(e){for(var t=[],r={},n=0;n<e.length;n++){var o=e[n],i=o[0],a=o[1],s=o[2],l=o[3],u={css:a,media:s,sourceMap:l};r[i]?r[i].parts.push(u):t.push(r[i]={id:i,parts:[u]})}return t}function i(e,t){var r=m(),n=v[v.length-1];if("top"===e.insertAt)n?n.nextSibling?r.insertBefore(t,n.nextSibling):r.appendChild(t):r.insertBefore(t,r.firstChild),v.push(t);else{if("bottom"!==e.insertAt)throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");r.appendChild(t)}}function a(e){e.parentNode.removeChild(e);var t=v.indexOf(e);t>=0&&v.splice(t,1)}function s(e){var t=document.createElement("style");return t.type="text/css",i(e,t),t}function l(e){var t=document.createElement("link");return t.rel="stylesheet",i(e,t),t}function u(e,t){var r,n,o;if(t.singleton){var i=g++;r=x||(x=s(t)),n=p.bind(null,r,i,!1),o=p.bind(null,r,i,!0)}else e.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(r=l(t),n=d.bind(null,r),o=function(){a(r),r.href&&URL.revokeObjectURL(r.href)}):(r=s(t),n=f.bind(null,r),o=function(){a(r)});return n(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;n(e=t)}else o()}}function p(e,t,r,n){var o=r?"":n.css;if(e.styleSheet)e.styleSheet.cssText=y(t,o);else{var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}function f(e,t){var r=t.css,n=t.media;if(n&&e.setAttribute("media",n),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}function d(e,t){var r=t.css,n=t.sourceMap;n&&(r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */");var o=new Blob([r],{type:"text/css"}),i=e.href;e.href=URL.createObjectURL(o),i&&URL.revokeObjectURL(i)}var c={},b=function(e){var t;return function(){return"undefined"==typeof t&&(t=e.apply(this,arguments)),t}},h=b(function(){return/msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase())}),m=b(function(){return document.head||document.getElementsByTagName("head")[0]}),x=null,g=0,v=[];e.exports=function(e,t){t=t||{},"undefined"==typeof t.singleton&&(t.singleton=h()),"undefined"==typeof t.insertAt&&(t.insertAt="bottom");var r=o(e);return n(r,t),function(e){for(var i=[],a=0;a<r.length;a++){var s=r[a],l=c[s.id];l.refs--,i.push(l)}if(e){var u=o(e);n(u,t)}for(var a=0;a<i.length;a++){var l=i[a];if(0===l.refs){for(var p=0;p<l.parts.length;p++)l.parts[p]();delete c[l.id]}}}};var y=function(){var e=[];return function(t,r){return e[t]=r,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=u}])});

package.json

 {
   "name": "@atlaskit/modal-dialog",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "config": {
@@ -5,0 +5,0 @@ "access": "public"

README.md

@@ -5,3 +5,3 @@ [![AtlasKit component registry](https://img.shields.io/badge/AtlasKit-components-FF5230.svg)](http://aui-cdn.atlassian.com/atlaskit/registry/)
 [![Report an issue](https://img.shields.io/badge/Report-an_issue-6554C0.svg)](https://ecosystem.atlassian.net/browse/AK)
-[![Ask in our forum](https://img.shields.io/badge/Ask-in_our_forum-6554C0.svg)](https://answers.atlassian.com/questions/ask?title=AtlasKit%3A%20&topics=atlaskit,@atlaskit/modal-dialog,@atlaskit/modal-dialog@1.1.0)
+[![Ask in our forum](https://img.shields.io/badge/Ask-in_our_forum-6554C0.svg)](https://answers.atlassian.com/questions/ask?title=AtlasKit%3A%20&topics=atlaskit,@atlaskit/modal-dialog,@atlaskit/modal-dialog@1.2.0)
 
@@ -12,7 +12,7 @@ # ModalDialog
 
-![Example tags](https://bytebucket.org/atlassian/atlaskit/raw/c5e5b6303bc17336958ccae1a3e6e702f730972f/packages/ak-modal-dialog/docs/simple.png)
+![Example tags](https://bytebucket.org/atlassian/atlaskit/raw/43898a4559075a9cd7f68ee40c35c63bc6819950/packages/ak-modal-dialog/docs/simple.png)
 
 ##Try it out
 
-Interact with a [live demo of the @atlaskit/modal-dialog component](https://aui-cdn.atlassian.com/atlaskit/stories/@atlaskit/modal-dialog/1.1.0/).
+Interact with a [live demo of the @atlaskit/modal-dialog component](https://aui-cdn.atlassian.com/atlaskit/stories/@atlaskit/modal-dialog/1.2.0/).
 
@@ -82,3 +82,5 @@ ## Installation
 The maximum width tier of the dialog
-Allowed values are: 'small' (400px), 'medium' (600px), 'large' (800px), 'x-large' (968px).
+Allowed values are: 'small' (400px), 'medium' (600px), 'large' (800px), 'x-large' (968px),
+or any integer value defining the pixel width (e.g. 300), or any string value defining the
+pixel or percentage width including unit (e.g. 300px, 75%).
 
@@ -120,3 +122,3 @@ **Kind**: instance property of <code>[ModalDialog](#ModalDialog)</code>
 
-Ask a question in our [forum](https://answers.atlassian.com/questions/ask?title=AtlasKit%3A%20&topics=atlaskit,@atlaskit/modal-dialog,@atlaskit/modal-dialog@1.1.0).
+Ask a question in our [forum](https://answers.atlassian.com/questions/ask?title=AtlasKit%3A%20&topics=atlaskit,@atlaskit/modal-dialog,@atlaskit/modal-dialog@1.2.0).
 
@@ -123,0 +125,0 @@ Check [if someone has already asked the same question before](https://answers.atlassian.com/questions/topics/42926171/atlaskit).

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

73322

increased by6.5%

Lines of code

911

increased by4.71%

Number of lines in readme file

128

increased by1.59%

Number of versions

335

increased by0.3%

Published versions last week

1

increased byInfinity%

Published versions last year

55

increased by1.85%

Worsened metrics

Number of downloads

28222

decreased by-6.49%

No dependency changes