@ohos-ports/sprucelabs-react-heartwood-components 9.1.0-beta.0

package/lib/components/Dropzone/Dropzone.js

@@ -0,0 +1,317 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactDropzone = _interopRequireDefault(require("react-dropzone"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _FormPartials = require("../Forms/FormPartials");
+
+var _Button = _interopRequireDefault(require("../Button/Button"));
+
+var DefaultIcon = function DefaultIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    d: "M24.5 54.833h-21a2.333 2.333 0 0 1-2.333-2.334v-49A2.333 2.333 0 0 1 3.5 1.166h31.017c.62 0 1.213.248 1.65.686l8.65 8.647c.437.438.683 1.031.683 1.65v7.684M20.855 36.096a11.667 11.667 0 1 1 12.297-15.53",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    d: "M22.167 17.502v7h4.666",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    clipRule: "evenodd",
+    d: "M40.833 54.836c7.732 0 14-6.268 14-14s-6.268-14-14-14-14 6.268-14 14 6.268 14 14 14z",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    d: "M40.833 47.836v-14M40.833 33.836l-5.25 5.25M40.833 33.836l5.25 5.25",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};
+
+DefaultIcon.defaultProps = {
+  width: "56",
+  height: "56",
+  viewBox: "0 0 56 56",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var UploadedIcon = function UploadedIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    d: "M24.5 54.833h-21a2.333 2.333 0 0 1-2.333-2.334v-49A2.333 2.333 0 0 1 3.5 1.166h31.017c.62 0 1.213.248 1.65.686l8.65 8.647c.437.438.683 1.031.683 1.65v7.684M21.098 36.119A11.667 11.667 0 1 1 33.6 22.165",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    d: "M22.167 17.502v7h4.666",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    clipRule: "evenodd",
+    d: "M40.833 54.836c7.732 0 14-6.268 14-14s-6.268-14-14-14-14 6.268-14 14 6.268 14 14 14z",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    d: "M47.073 36.764l-6.779 9.039a1.752 1.752 0 0 1-2.639.187l-3.5-3.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};
+
+UploadedIcon.defaultProps = {
+  width: "56",
+  height: "56",
+  viewBox: "0 0 56 56",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var DropIcon = function DropIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    clipRule: "evenodd",
+    d: "M38.656 53.605c-.154.623-.466.642-.7.042l-9.165-24.115c-.233-.6.077-.905.677-.681l24.215 9.081c.6.233.583.537-.04.7L41.575 41.65l-2.919 11.956z",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    d: "M47.322 28.973c-.098.422-.198.844-.31 1.264M29.115 47.268c-.966.119-1.918.354-2.89.38M19.273 47.133a23.243 23.243 0 0 1-5.467-1.989M9.06 41.92a23.867 23.867 0 0 1-3.87-4.34M2.147 31.303a24.065 24.065 0 0 1-.98-5.733M1.561 19.834a23.675 23.675 0 0 1 1.867-5.512M7.34 8.566a22.798 22.798 0 0 1 4.448-3.748M16.961 2.319c.908-.35 1.867-.518 2.8-.78.97-.119 1.923-.352 2.896-.373M29.61 1.666a23.238 23.238 0 0 1 5.467 1.986M39.82 6.887a23.727 23.727 0 0 1 3.874 4.342M46.737 17.5c.557 1.864.886 3.79.98 5.733",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};
+
+DropIcon.defaultProps = {
+  width: "56",
+  height: "56",
+  viewBox: "0 0 56 56",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var WarnIcon = function WarnIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    clipRule: "evenodd",
+    d: "M52.624 48.247c.313.4.334.932.051 1.35-.282.418-.812.64-1.342.56H4.667c-.53.08-1.06-.142-1.342-.56a1.132 1.132 0 0 1 .051-1.35L26.957 5.064c.574-1.051 1.512-1.051 2.086 0l23.58 43.183z",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), _react["default"].createElement("path", {
+    d: "M28 36.279V21.322M27.979 40.55a.6.6 0 0 0-.406.165.502.502 0 0 0-.156.38c.012.292.273.523.592.524h.012a.6.6 0 0 0 .406-.164.501.501 0 0 0 .156-.38c-.012-.29-.268-.519-.583-.524h-.012",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};
+
+WarnIcon.defaultProps = {
+  width: "56",
+  height: "52",
+  viewBox: "0 0 56 52",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var Dropzone =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2["default"])(Dropzone, _Component);
+
+  function Dropzone() {
+    var _getPrototypeOf2;
+
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, Dropzone);
+
+    for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
+      _args[_key] = arguments[_key];
+    }
+
+    _this = (0, _possibleConstructorReturn2["default"])(this, (_getPrototypeOf2 = (0, _getPrototypeOf3["default"])(Dropzone)).call.apply(_getPrototypeOf2, [this].concat(_args)));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDragEnter", function () {
+      var onDragEnter = _this.props.onDragEnter;
+
+      if (onDragEnter) {
+        onDragEnter();
+      }
+
+      _this.setState({
+        userCanDrop: true
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDragLeave", function () {
+      var onDragLeave = _this.props.onDragLeave;
+
+      if (onDragLeave) {
+        onDragLeave.apply(void 0, arguments);
+      }
+
+      _this.setState({
+        userCanDrop: false
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDragOver", function () {
+      var onDragOver = _this.props.onDragOver;
+
+      if (onDragOver) {
+        onDragOver.apply(void 0, arguments);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDragStart", function () {
+      var onDragStart = _this.props.onDragStart;
+
+      if (onDragStart) {
+        onDragStart.apply(void 0, arguments);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDrop", function () {
+      var onDrop = _this.props.onDrop;
+
+      if (onDrop) {
+        onDrop.apply(void 0, arguments);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDropAccepted", function () {
+      var onDropAccepted = _this.props.onDropAccepted;
+
+      if (onDropAccepted) {
+        onDropAccepted.apply(void 0, arguments);
+      }
+
+      _this.setState({
+        userCanDrop: false
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onDropRejected", function () {
+      var onDropRejected = _this.props.onDropRejected;
+
+      if (onDropRejected) {
+        onDropRejected.apply(void 0, arguments);
+      }
+
+      _this.setState({
+        userCanDrop: false
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onFileDialogCancel", function () {
+      var onFileDialogCancel = _this.props.onFileDialogCancel;
+
+      if (onFileDialogCancel) {
+        onFileDialogCancel.apply(void 0, arguments);
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(Dropzone, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props = this.props,
+          id = _this$props.id,
+          label = _this$props.label,
+          postLabel = _this$props.postLabel,
+          buttonText = _this$props.buttonText,
+          error = _this$props.error,
+          isSmall = _this$props.isSmall,
+          isCircular = _this$props.isCircular,
+          fileWasUploaded = _this$props.fileWasUploaded,
+          uploadProgress = _this$props.uploadProgress,
+          defaultIcon = _this$props.defaultIcon,
+          rest = (0, _objectWithoutProperties2["default"])(_this$props, ["id", "label", "postLabel", "buttonText", "error", "isSmall", "isCircular", "fileWasUploaded", "uploadProgress", "defaultIcon"]);
+      var defaultClass = (0, _classnames["default"])('dropzone', {
+        'dropzone-small': isSmall,
+        'dropzone-circular': isCircular
+      });
+      return _react["default"].createElement(_react.Fragment, null, label && _react["default"].createElement(_FormPartials.InputPre, {
+        id: id,
+        label: label,
+        postLabel: postLabel
+      }), _react["default"].createElement(_reactDropzone["default"], (0, _extends2["default"])({
+        ref: function ref(_ref2) {
+          return _this2.dropzone = _ref2;
+        },
+        className: defaultClass,
+        activeClassName: "dropzone--is-hovered",
+        rejectClassName: "dropzone--has-error",
+        disabledClassName: "dropzone--is-disabled",
+        onDragEnter: this.onDragEnter,
+        onDragLeave: this.onDragLeave,
+        onDragOver: this.onDragOver,
+        onDragStart: this.onDragStart,
+        onDrop: this.onDrop,
+        onDropAccepted: this.onDropAccepted,
+        onDropRejected: this.onDropRejected,
+        onFileDialogCancel: this.onFileDialogCancel,
+        disabled: !!uploadProgress
+      }, rest), function (_ref) {
+        var isDragAccept = _ref.isDragAccept,
+            isDragReject = _ref.isDragReject;
+        return _react["default"].createElement(_react.Fragment, null, !!uploadProgress && _react["default"].createElement(_react.Fragment, null, _react["default"].createElement("p", {
+          className: "dropzone__helper-text"
+        }, "Uploading\u2026"), _react["default"].createElement("div", {
+          className: "dropzone__uploading-progress-wrapper"
+        }, _react["default"].createElement("div", {
+          className: "dropzone__uploading-progress",
+          style: {
+            width: "".concat(uploadProgress, "%")
+          }
+        }))), _react["default"].createElement("div", {
+          className: "dropzone__icons"
+        }, !uploadProgress && !isDragAccept && !isDragReject && _react["default"].createElement(_react.Fragment, null, fileWasUploaded ? _react["default"].createElement(UploadedIcon, {
+          className: "dropzone__icon dropzone__did-upload-icon"
+        }) : defaultIcon || _react["default"].createElement(DefaultIcon, {
+          className: "dropzone__icon"
+        })), isDragAccept && _react["default"].createElement(DropIcon, {
+          className: "dropzone__icon dropzone__allow-drop-icon"
+        }), isDragReject && _react["default"].createElement(WarnIcon, {
+          className: "dropzone__icon dropzone__warn-drop-icon"
+        })), _react["default"].createElement(_Button["default"], {
+          kind: isSmall ? 'simple' : 'secondary',
+          isSmall: isSmall,
+          text: buttonText,
+          className: "dropzone__btn",
+          disabled: !!uploadProgress
+        }), !isCircular && _react["default"].createElement(_react.Fragment, null, _react["default"].createElement("p", {
+          className: "dropzone__text"
+        }, "or drop files to upload"), isDragAccept && _react["default"].createElement("p", {
+          className: "dropzone__helper-text-bottom dropzone__helper-text-accepted"
+        }, "Drop files to upload them"), isDragReject && _react["default"].createElement("p", {
+          className: "dropzone__helper-text-bottom dropzone__helper-text-rejected"
+        }, error)));
+      }));
+    }
+  }]);
+  return Dropzone;
+}(_react.Component);
+
+exports["default"] = Dropzone;
+(0, _defineProperty2["default"])(Dropzone, "defaultProps", {
+  fileWasUploaded: false,
+  isSmall: false,
+  isCircular: false
+});
+//# sourceMappingURL=Dropzone.js.map

package/lib/components/Dropzone/Dropzone.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Dropzone/Dropzone.js"],"names":["DefaultIcon","UploadedIcon","DropIcon","WarnIcon","Dropzone","onDragEnter","props","setState","userCanDrop","onDragLeave","onDragOver","onDragStart","onDrop","onDropAccepted","onDropRejected","onFileDialogCancel","id","label","postLabel","buttonText","error","isSmall","isCircular","fileWasUploaded","uploadProgress","defaultIcon","rest","defaultClass","ref","dropzone","isDragAccept","isDragReject","width","Component"],"mappings":"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","sourcesContent":["// @flow\nimport React, { Component, Fragment } from 'react'\nimport type { Node } from 'react'\nimport ReactDropzone from 'react-dropzone'\nimport cx from 'classnames'\nimport { InputPre } from '../Forms/FormPartials'\nimport Button from '../Button/Button'\nimport DefaultIcon from '../../../static/assets/icons/Interface-Essential/Time-Files/time-clock-file-upload.svg'\nimport UploadedIcon from '../../../static/assets/icons/Interface-Essential/Time-Files/time-clock-file-check.svg'\nimport DropIcon from '../../../static/assets/icons/Interface-Essential/Select/cursor-select-4.svg'\nimport WarnIcon from '../../../static/assets/icons/Interface-Essential/Alerts/alert-triangle--56w.svg'\n\nexport type Props = {\n\t/** Unique identifier for the dropzone */\n\tid: string,\n\n\t/** Callback when file(s) are dropped */\n\tonDrop: Function,\n\n\t/** Text for the button */\n\tbuttonText: string,\n\n\t/** Text shown when file(s) are dropped that aren't accepted */\n\terror: string,\n\n\t/** Displays progress while uploading */\n\tuploadProgress: number,\n\n\t/** onDragEnter callback */\n\tonDragEnter?: Function,\n\n\t/** onDragLeave callback */\n\tonDragLeave?: Function,\n\n\t/** onDragOver callback */\n\tonDragOver?: Function,\n\n\t/** onDrop callback */\n\tonDrop?: Function,\n\n\t/** onDropAccepted callback */\n\tonDropAccepted: Function,\n\n\t/** onDropRejected callback */\n\tonDropRejected?: Function,\n\n\t/** onFileDialogCancel callback */\n\tonFileDialogCancel?: Function,\n\n\t/** onDragStart callback */\n\tonDragStart?: Function,\n\n\t/** Optional label for the Dropzone */\n\tlabel: ?string,\n\n\t/** Optional text to show after the label */\n\tpostLabel?: string,\n\n\t/** Set true to use a smaller Dropzone */\n\tisSmall?: boolean,\n\n\t/** Set true to make the Dropzone circular. Should only be used when isSmall is set to true */\n\tisCircular?: boolean,\n\n\t/** Set true when a file has been successfully uploaded */\n\tfileWasUploaded?: boolean,\n\n\t/** The icon to display before an upload has happened */\n\tdefaultIcon?: Node\n}\n\ntype State = {\n\tuserCanDrop: boolean\n}\n\nexport default class Dropzone extends Component<Props, State> {\n\tdropzone: any\n\n\tstatic defaultProps = {\n\t\tfileWasUploaded: false,\n\t\tisSmall: false,\n\t\tisCircular: false\n\t}\n\n\tonDragEnter = () => {\n\t\tconst { onDragEnter } = this.props\n\t\tif (onDragEnter) {\n\t\t\tonDragEnter()\n\t\t}\n\t\tthis.setState({\n\t\t\tuserCanDrop: true\n\t\t})\n\t}\n\tonDragLeave = (...args) => {\n\t\tconst { onDragLeave } = this.props\n\t\tif (onDragLeave) {\n\t\t\tonDragLeave(...args)\n\t\t}\n\t\tthis.setState({\n\t\t\tuserCanDrop: false\n\t\t})\n\t}\n\tonDragOver = (...args) => {\n\t\tconst { onDragOver } = this.props\n\t\tif (onDragOver) {\n\t\t\tonDragOver(...args)\n\t\t}\n\t}\n\tonDragStart = (...args) => {\n\t\tconst { onDragStart } = this.props\n\t\tif (onDragStart) {\n\t\t\tonDragStart(...args)\n\t\t}\n\t}\n\tonDrop = (...args) => {\n\t\tconst { onDrop } = this.props\n\t\tif (onDrop) {\n\t\t\tonDrop(...args)\n\t\t}\n\t}\n\tonDropAccepted = (...args) => {\n\t\tconst { onDropAccepted } = this.props\n\t\tif (onDropAccepted) {\n\t\t\tonDropAccepted(...args)\n\t\t}\n\t\tthis.setState({\n\t\t\tuserCanDrop: false\n\t\t})\n\t}\n\tonDropRejected = (...args) => {\n\t\tconst { onDropRejected } = this.props\n\t\tif (onDropRejected) {\n\t\t\tonDropRejected(...args)\n\t\t}\n\t\tthis.setState({\n\t\t\tuserCanDrop: false\n\t\t})\n\t}\n\tonFileDialogCancel = (...args) => {\n\t\tconst { onFileDialogCancel } = this.props\n\t\tif (onFileDialogCancel) {\n\t\t\tonFileDialogCancel(...args)\n\t\t}\n\t}\n\trender() {\n\t\tconst {\n\t\t\tid,\n\t\t\tlabel,\n\t\t\tpostLabel,\n\t\t\tbuttonText,\n\t\t\terror,\n\t\t\tisSmall,\n\t\t\tisCircular,\n\t\t\tfileWasUploaded,\n\t\t\tuploadProgress,\n\t\t\tdefaultIcon,\n\t\t\t...rest\n\t\t} = this.props\n\t\tconst defaultClass = cx('dropzone', {\n\t\t\t'dropzone-small': isSmall,\n\t\t\t'dropzone-circular': isCircular\n\t\t})\n\t\treturn (\n\t\t\t<Fragment>\n\t\t\t\t{label && <InputPre id={id} label={label} postLabel={postLabel} />}\n\t\t\t\t<ReactDropzone\n\t\t\t\t\tref={ref => (this.dropzone = ref)}\n\t\t\t\t\tclassName={defaultClass}\n\t\t\t\t\tactiveClassName=\"dropzone--is-hovered\"\n\t\t\t\t\trejectClassName=\"dropzone--has-error\"\n\t\t\t\t\tdisabledClassName=\"dropzone--is-disabled\"\n\t\t\t\t\tonDragEnter={this.onDragEnter}\n\t\t\t\t\tonDragLeave={this.onDragLeave}\n\t\t\t\t\tonDragOver={this.onDragOver}\n\t\t\t\t\tonDragStart={this.onDragStart}\n\t\t\t\t\tonDrop={this.onDrop}\n\t\t\t\t\tonDropAccepted={this.onDropAccepted}\n\t\t\t\t\tonDropRejected={this.onDropRejected}\n\t\t\t\t\tonFileDialogCancel={this.onFileDialogCancel}\n\t\t\t\t\tdisabled={!!uploadProgress}\n\t\t\t\t\t{...rest}\n\t\t\t\t>\n\t\t\t\t\t{({ isDragAccept, isDragReject }) => (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t{!!uploadProgress && (\n\t\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t\t<p className=\"dropzone__helper-text\">Uploading…</p>\n\t\t\t\t\t\t\t\t\t<div className=\"dropzone__uploading-progress-wrapper\">\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"dropzone__uploading-progress\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ width: `${uploadProgress}%` }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<div className=\"dropzone__icons\">\n\t\t\t\t\t\t\t\t{!uploadProgress && !isDragAccept && !isDragReject && (\n\t\t\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t\t\t{fileWasUploaded ? (\n\t\t\t\t\t\t\t\t\t\t\t<UploadedIcon className=\"dropzone__icon dropzone__did-upload-icon\" />\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\tdefaultIcon || <DefaultIcon className=\"dropzone__icon\" />\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{isDragAccept && (\n\t\t\t\t\t\t\t\t\t<DropIcon className=\"dropzone__icon dropzone__allow-drop-icon\" />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{isDragReject && (\n\t\t\t\t\t\t\t\t\t<WarnIcon className=\"dropzone__icon dropzone__warn-drop-icon\" />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tkind={isSmall ? 'simple' : 'secondary'}\n\t\t\t\t\t\t\t\tisSmall={isSmall}\n\t\t\t\t\t\t\t\ttext={buttonText}\n\t\t\t\t\t\t\t\tclassName=\"dropzone__btn\"\n\t\t\t\t\t\t\t\tdisabled={!!uploadProgress}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{!isCircular && (\n\t\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t\t<p className=\"dropzone__text\">or drop files to upload</p>\n\t\t\t\t\t\t\t\t\t{isDragAccept && (\n\t\t\t\t\t\t\t\t\t\t<p className=\"dropzone__helper-text-bottom dropzone__helper-text-accepted\">\n\t\t\t\t\t\t\t\t\t\t\tDrop files to upload them\n\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t{isDragReject && (\n\t\t\t\t\t\t\t\t\t\t<p className=\"dropzone__helper-text-bottom dropzone__helper-text-rejected\">\n\t\t\t\t\t\t\t\t\t\t\t{error}\n\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\t\t\t\t</ReactDropzone>\n\t\t\t</Fragment>\n\t\t)\n\t}\n}\n"],"file":"Dropzone.js"}

package/lib/components/EmptyState/EmptyState-story.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=EmptyState-story.d.ts.map

package/lib/components/EmptyState/EmptyState-story.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState-story.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState-story.tsx"],"names":[],"mappings":""}

package/lib/components/EmptyState/EmptyState-story.js

@@ -0,0 +1,60 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _lodash = require("lodash");
+
+var _react2 = require("@storybook/react");
+
+var _addonKnobs = require("@storybook/addon-knobs");
+
+var _EmptyState = _interopRequireDefault(require("./EmptyState"));
+
+var icons = _interopRequireWildcard(require("../../icons.js"));
+
+var options = {};
+(0, _lodash.each)((0, _lodash.keys)(icons), function (icon) {
+  options[icon] = icon;
+});
+var stories = (0, _react2.storiesOf)('EmptyState', module); // stories.addDecorator(
+// 	withKnobsOptions({
+// 		escapeHTML: false
+// 	})
+// )
+
+stories.addDecorator(_addonKnobs.withKnobs);
+stories.add('Default', function () {
+  return _react["default"].createElement(_EmptyState["default"], null);
+});
+stories.add('No matches', function () {
+  return _react["default"].createElement(_EmptyState["default"], {
+    icon: (0, _addonKnobs.select)('icon', options, 'no_matches'),
+    headline: (0, _addonKnobs.text)('headline', 'No matches found'),
+    primaryAction: (0, _addonKnobs.object)('primary button action', {
+      text: 'Show all',
+      onClick: function onClick() {},
+      type: 'submit'
+    }),
+    primaryActionButtonKind: (0, _addonKnobs.select)('primary button kind', ['primary', 'secondary', 'simple', 'caution'], 'simple'),
+    primaryActionButtonIcon: (0, _addonKnobs.select)('primary button icon', options, undefined)
+  });
+});
+stories.add('API Failure', function () {
+  return _react["default"].createElement(_EmptyState["default"], {
+    icon: (0, _addonKnobs.select)('icon', options, 'caution'),
+    headline: (0, _addonKnobs.text)('headline', 'Data not available'),
+    subheadline: (0, _addonKnobs.text)('subheadline', 'It looks like something went wrong.'),
+    primaryAction: (0, _addonKnobs.object)('primary button action', {
+      text: 'Try Again',
+      onClick: function onClick() {},
+      type: 'submit'
+    }),
+    primaryActionButtonKind: (0, _addonKnobs.select)('primary button kind', ['primary', 'secondary', 'simple', 'caution'], 'simple'),
+    primaryActionButtonIcon: (0, _addonKnobs.select)('primary button icon', options, undefined)
+  });
+});
+//# sourceMappingURL=EmptyState-story.js.map

package/lib/components/EmptyState/EmptyState-story.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/EmptyState/EmptyState-story.tsx"],"names":["options","icons","icon","stories","module","addDecorator","withKnobs","add","text","onClick","type","undefined"],"mappings":";;;;;;AAAA;;AACA;;AACA;;AACA;;AAOA;;AACA;;AAEA,IAAMA,OAAO,GAAG,EAAhB;AAEA,kBAAK,kBAAKC,KAAL,CAAL,EAAkB,UAAAC,IAAI,EAAI;AACzBF,EAAAA,OAAO,CAACE,IAAD,CAAP,GAAgBA,IAAhB;AACA,CAFD;AAIA,IAAMC,OAAO,GAAG,uBAAU,YAAV,EAAwBC,MAAxB,CAAhB,C,CAEA;AACA;AACA;AACA;AACA;;AACAD,OAAO,CAACE,YAAR,CAAqBC,qBAArB;AAEAH,OAAO,CAACI,GAAR,CAAY,SAAZ,EAAuB;AAAA,SAAM,gCAAC,sBAAD,OAAN;AAAA,CAAvB;AAEAJ,OAAO,CAACI,GAAR,CAAY,YAAZ,EAA0B;AAAA,SACzB,gCAAC,sBAAD;AACC,IAAA,IAAI,EAAE,wBAAO,MAAP,EAAeP,OAAf,EAAwB,YAAxB,CADP;AAEC,IAAA,QAAQ,EAAE,sBAAK,UAAL,EAAiB,kBAAjB,CAFX;AAGC,IAAA,aAAa,EAAE,wBAAO,uBAAP,EAAgC;AAC9CQ,MAAAA,IAAI,EAAE,UADwC;AAE9CC,MAAAA,OAAO,EAAE,mBAAM,CAAE,CAF6B;AAG9CC,MAAAA,IAAI,EAAE;AAHwC,KAAhC,CAHhB;AAQC,IAAA,uBAAuB,EAAE,wBACxB,qBADwB,EAExB,CAAC,SAAD,EAAY,WAAZ,EAAyB,QAAzB,EAAmC,SAAnC,CAFwB,EAGxB,QAHwB,CAR1B;AAaC,IAAA,uBAAuB,EAAE,wBAAO,qBAAP,EAA8BV,OAA9B,EAAuCW,SAAvC;AAb1B,IADyB;AAAA,CAA1B;AAkBAR,OAAO,CAACI,GAAR,CAAY,aAAZ,EAA2B;AAAA,SAC1B,gCAAC,sBAAD;AACC,IAAA,IAAI,EAAE,wBAAO,MAAP,EAAeP,OAAf,EAAwB,SAAxB,CADP;AAEC,IAAA,QAAQ,EAAE,sBAAK,UAAL,EAAiB,oBAAjB,CAFX;AAGC,IAAA,WAAW,EAAE,sBAAK,aAAL,EAAoB,qCAApB,CAHd;AAIC,IAAA,aAAa,EAAE,wBAAO,uBAAP,EAAgC;AAC9CQ,MAAAA,IAAI,EAAE,WADwC;AAE9CC,MAAAA,OAAO,EAAE,mBAAM,CAAE,CAF6B;AAG9CC,MAAAA,IAAI,EAAE;AAHwC,KAAhC,CAJhB;AASC,IAAA,uBAAuB,EAAE,wBACxB,qBADwB,EAExB,CAAC,SAAD,EAAY,WAAZ,EAAyB,QAAzB,EAAmC,SAAnC,CAFwB,EAGxB,QAHwB,CAT1B;AAcC,IAAA,uBAAuB,EAAE,wBAAO,qBAAP,EAA8BV,OAA9B,EAAuCW,SAAvC;AAd1B,IAD0B;AAAA,CAA3B","sourcesContent":["import React from 'react'\nimport { each, keys } from 'lodash'\nimport { storiesOf } from '@storybook/react'\nimport {\n\twithKnobs,\n\t// withKnobsOptions,\n\ttext,\n\tselect,\n\tobject\n} from '@storybook/addon-knobs'\nimport EmptyState from './EmptyState'\nimport * as icons from '../../icons.js'\n\nconst options = {}\n\neach(keys(icons), icon => {\n\toptions[icon] = icon\n})\n\nconst stories = storiesOf('EmptyState', module)\n\n// stories.addDecorator(\n// \twithKnobsOptions({\n// \t\tescapeHTML: false\n// \t})\n// )\nstories.addDecorator(withKnobs)\n\nstories.add('Default', () => <EmptyState />)\n\nstories.add('No matches', () => (\n\t<EmptyState\n\t\ticon={select('icon', options, 'no_matches')}\n\t\theadline={text('headline', 'No matches found')}\n\t\tprimaryAction={object('primary button action', {\n\t\t\ttext: 'Show all',\n\t\t\tonClick: () => {},\n\t\t\ttype: 'submit'\n\t\t})}\n\t\tprimaryActionButtonKind={select(\n\t\t\t'primary button kind',\n\t\t\t['primary', 'secondary', 'simple', 'caution'],\n\t\t\t'simple'\n\t\t)}\n\t\tprimaryActionButtonIcon={select('primary button icon', options, undefined)}\n\t/>\n))\n\nstories.add('API Failure', () => (\n\t<EmptyState\n\t\ticon={select('icon', options, 'caution')}\n\t\theadline={text('headline', 'Data not available')}\n\t\tsubheadline={text('subheadline', 'It looks like something went wrong.')}\n\t\tprimaryAction={object('primary button action', {\n\t\t\ttext: 'Try Again',\n\t\t\tonClick: () => {},\n\t\t\ttype: 'submit'\n\t\t})}\n\t\tprimaryActionButtonKind={select(\n\t\t\t'primary button kind',\n\t\t\t['primary', 'secondary', 'simple', 'caution'],\n\t\t\t'simple'\n\t\t)}\n\t\tprimaryActionButtonIcon={select('primary button icon', options, undefined)}\n\t/>\n))\n"],"file":"EmptyState-story.js"}

package/lib/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+export interface IEmptyStateProps {
+    /** Headline text to be displayed */
+    headline: string;
+    /** Subheadline text to be displayed (optional) */
+    subheadline?: string;
+    /** Primary icon to be displayed above the headline (optional) */
+    icon?: string;
+    /** Primary icon as line art (optional) */
+    isLineIcon?: boolean;
+    /** Primary action in the footer (optional) */
+    primaryAction?: any;
+    /** Primary action in the footer (optional) */
+    primaryActionButtonKind?: string;
+    /** Primary action in the footer (optional) */
+    primaryActionButtonIcon?: string;
+}
+declare const EmptyState: {
+    (props: IEmptyStateProps): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
+    defaultProps: {
+        icon: string;
+        headline: string;
+        isLineIcon: boolean;
+        primaryActionButtonKind: string;
+    };
+};
+export default EmptyState;
+//# sourceMappingURL=EmptyState.d.ts.map

package/lib/components/EmptyState/EmptyState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,gBAAgB;IAChC,oCAAoC;IACpC,QAAQ,EAAE,MAAM,CAAA;IAEhB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iEAAiE;IACjE,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,0CAA0C;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,8CAA8C;IAE9C,aAAa,CAAC,EAAE,GAAG,CAAA;IAEnB,8CAA8C;IAC9C,uBAAuB,CAAC,EAAE,MAAM,CAAA;IAEhC,8CAA8C;IAC9C,uBAAuB,CAAC,EAAE,MAAM,CAAA;CAChC;AAED,QAAA,MAAM,UAAU;;;;;;;;CAmCf,CAAA;AASD,eAAe,UAAU,CAAA"}

package/lib/components/EmptyState/EmptyState.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Icon = _interopRequireDefault(require("../Icon/Icon"));
+
+var _Button = _interopRequireDefault(require("../Button/Button"));
+
+var EmptyState = function EmptyState(props) {
+  var headline = props.headline,
+      subheadline = props.subheadline,
+      icon = props.icon,
+      isLineIcon = props.isLineIcon,
+      primaryAction = props.primaryAction,
+      primaryActionButtonKind = props.primaryActionButtonKind,
+      primaryActionButtonIcon = props.primaryActionButtonIcon;
+  return _react["default"].createElement("div", {
+    className: "empty-state"
+  }, icon && _react["default"].createElement("span", {
+    className: "empty-state__icon"
+  }, _react["default"].createElement(_Icon["default"], {
+    name: icon,
+    isLineIcon: isLineIcon
+  })), _react["default"].createElement("h3", {
+    className: "empty-state__headline"
+  }, headline), subheadline && _react["default"].createElement("div", {
+    className: "empty-state__subheadline"
+  }, subheadline), primaryAction && _react["default"].createElement(_Button["default"], (0, _extends2["default"])({
+    icon: primaryActionButtonIcon ? {
+      name: primaryActionButtonIcon,
+      className: "btn__line-icon"
+    } : null,
+    kind: primaryActionButtonKind
+  }, primaryAction)));
+};
+
+EmptyState.defaultProps = {
+  icon: 'empty_box',
+  headline: 'Nothing to see here',
+  isLineIcon: true,
+  primaryActionButtonKind: 'simple'
+};
+var _default = EmptyState;
+exports["default"] = _default;
+//# sourceMappingURL=EmptyState.js.map

package/lib/components/EmptyState/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":["EmptyState","props","headline","subheadline","icon","isLineIcon","primaryAction","primaryActionButtonKind","primaryActionButtonIcon","name","className","defaultProps"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAyBA,IAAMA,UAAU,GAAG,SAAbA,UAAa,CAACC,KAAD,EAAiD;AAAA,MAElEC,QAFkE,GAS/DD,KAT+D,CAElEC,QAFkE;AAAA,MAGlEC,WAHkE,GAS/DF,KAT+D,CAGlEE,WAHkE;AAAA,MAIlEC,IAJkE,GAS/DH,KAT+D,CAIlEG,IAJkE;AAAA,MAKlEC,UALkE,GAS/DJ,KAT+D,CAKlEI,UALkE;AAAA,MAMlEC,aANkE,GAS/DL,KAT+D,CAMlEK,aANkE;AAAA,MAOlEC,uBAPkE,GAS/DN,KAT+D,CAOlEM,uBAPkE;AAAA,MAQlEC,uBARkE,GAS/DP,KAT+D,CAQlEO,uBARkE;AAWnE,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACEJ,IAAI,IACJ;AAAM,IAAA,SAAS,EAAC;AAAhB,KACC,gCAAC,gBAAD;AAAM,IAAA,IAAI,EAAEA,IAAZ;AAAkB,IAAA,UAAU,EAAEC;AAA9B,IADD,CAFF,EAMC;AAAI,IAAA,SAAS,EAAC;AAAd,KAAuCH,QAAvC,CAND,EAOEC,WAAW,IACX;AAAK,IAAA,SAAS,EAAC;AAAf,KAA2CA,WAA3C,CARF,EAUEG,aAAa,IACb,gCAAC,kBAAD;AACC,IAAA,IAAI,EACHE,uBAAuB,GACpB;AAAEC,MAAAA,IAAI,EAAED,uBAAR;AAAiCE,MAAAA,SAAS;AAA1C,KADoB,GAEpB,IAJL;AAMC,IAAA,IAAI,EAAEH;AANP,KAOKD,aAPL,EAXF,CADD;AAwBA,CAnCD;;AAqCAN,UAAU,CAACW,YAAX,GAA0B;AACzBP,EAAAA,IAAI,EAAE,WADmB;AAEzBF,EAAAA,QAAQ,EAAE,qBAFe;AAGzBG,EAAAA,UAAU,EAAE,IAHa;AAIzBE,EAAAA,uBAAuB,EAAE;AAJA,CAA1B;eAOeP,U","sourcesContent":["import React from 'react'\nimport Icon from '../Icon/Icon'\nimport Button from '../Button/Button'\n\nexport interface IEmptyStateProps {\n\t/** Headline text to be displayed */\n\theadline: string\n\n\t/** Subheadline text to be displayed (optional) */\n\tsubheadline?: string\n\t/** Primary icon to be displayed above the headline (optional) */\n\ticon?: string\n\n\t/** Primary icon as line art (optional) */\n\tisLineIcon?: boolean\n\n\t/** Primary action in the footer (optional) */\n\t// TODO: Import button props once it's converted to tsx\n\tprimaryAction?: any\n\n\t/** Primary action in the footer (optional) */\n\tprimaryActionButtonKind?: string\n\n\t/** Primary action in the footer (optional) */\n\tprimaryActionButtonIcon?: string\n}\n\nconst EmptyState = (props: IEmptyStateProps): React.ReactElement => {\n\tconst {\n\t\theadline,\n\t\tsubheadline,\n\t\ticon,\n\t\tisLineIcon,\n\t\tprimaryAction,\n\t\tprimaryActionButtonKind,\n\t\tprimaryActionButtonIcon\n\t} = props\n\n\treturn (\n\t\t<div className=\"empty-state\">\n\t\t\t{icon && (\n\t\t\t\t<span className=\"empty-state__icon\">\n\t\t\t\t\t<Icon name={icon} isLineIcon={isLineIcon} />\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t<h3 className=\"empty-state__headline\">{headline}</h3>\n\t\t\t{subheadline && (\n\t\t\t\t<div className=\"empty-state__subheadline\">{subheadline}</div>\n\t\t\t)}\n\t\t\t{primaryAction && (\n\t\t\t\t<Button\n\t\t\t\t\ticon={\n\t\t\t\t\t\tprimaryActionButtonIcon\n\t\t\t\t\t\t\t? { name: primaryActionButtonIcon, className: `btn__line-icon` }\n\t\t\t\t\t\t\t: null\n\t\t\t\t\t}\n\t\t\t\t\tkind={primaryActionButtonKind}\n\t\t\t\t\t{...primaryAction}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t)\n}\n\nEmptyState.defaultProps = {\n\ticon: 'empty_box',\n\theadline: 'Nothing to see here',\n\tisLineIcon: true,\n\tprimaryActionButtonKind: 'simple'\n}\n\nexport default EmptyState\n"],"file":"EmptyState.js"}

package/lib/components/EventDetails/EventDetails-story.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=EventDetails-story.d.ts.map

package/lib/components/EventDetails/EventDetails-story.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventDetails-story.d.ts","sourceRoot":"","sources":["../../../src/components/EventDetails/EventDetails-story.tsx"],"names":[],"mappings":""}

package/lib/components/EventDetails/EventDetails-story.js

@@ -0,0 +1,112 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@storybook/react");
+
+var _EventDetails = _interopRequireDefault(require("./EventDetails"));
+
+var _Core = require("../Core");
+
+var _eventDetailsMock = require("./eventDetailsMock");
+
+var _addonKnobs = require("@storybook/addon-knobs");
+
+// import Page from '../Page'
+var stories = (0, _react2.storiesOf)('EventDetails', module); // TODO: Turn off this decorator for specs. It obfuscates prop tables.
+// stories.addDecorator(storyFn => (
+// 	<Page STORYBOOKwrap={false} sidebar={storyFn()} />
+// ))
+
+stories.addDecorator(_addonKnobs.withKnobs);
+stories.add('Booking: Appointment', function () {
+  return _react["default"].createElement(_Core.Sidebar, {
+    side: "right",
+    isCollapsible: false,
+    isLarge: true
+  }, _react["default"].createElement(_Core.SidebarHeader, {
+    title: "Appointment details",
+    onClose: function onClose() {
+      return null;
+    }
+  }), _react["default"].createElement(_EventDetails["default"], (0, _extends2["default"])({
+    isLoading: (0, _addonKnobs["boolean"])('isLoading', false)
+  }, _eventDetailsMock.appointment, {
+    onAction: function onAction(action) {
+      console.log(JSON.stringify(action.payload));
+    }
+  })));
+}).add('Booking: Appointment has warning', function () {
+  return _react["default"].createElement(_Core.Sidebar, {
+    side: "right",
+    isCollapsible: false,
+    isLarge: true
+  }, _react["default"].createElement(_Core.SidebarHeader, {
+    title: "Appointment details",
+    onClose: function onClose() {
+      return null;
+    }
+  }), _react["default"].createElement(_EventDetails["default"], (0, _extends2["default"])({
+    isLoading: (0, _addonKnobs["boolean"])('isLoading', false)
+  }, _eventDetailsMock.warningAppointment, {
+    onAction: function onAction(action) {
+      console.log(JSON.stringify(action.payload));
+    }
+  })));
+}).add('Booking: Past Appointment', function () {
+  return _react["default"].createElement(_Core.Sidebar, {
+    side: "right",
+    isCollapsible: false,
+    isLarge: true
+  }, _react["default"].createElement(_Core.SidebarHeader, {
+    title: "Appointment details",
+    onClose: function onClose() {
+      return null;
+    }
+  }), _react["default"].createElement(_EventDetails["default"], (0, _extends2["default"])({
+    isLoading: (0, _addonKnobs["boolean"])('isLoading', false)
+  }, _eventDetailsMock.pastAppointment, {
+    onAction: function onAction(action) {
+      console.log(JSON.stringify(action.payload));
+    }
+  })));
+}).add('Scheduling: Lunch Break', function () {
+  return _react["default"].createElement(_Core.Sidebar, {
+    side: "right",
+    isCollapsible: false,
+    isLarge: true
+  }, _react["default"].createElement(_Core.SidebarHeader, {
+    title: "Lunch break",
+    onClose: function onClose() {
+      return null;
+    }
+  }), _react["default"].createElement(_EventDetails["default"], (0, _extends2["default"])({
+    isLoading: (0, _addonKnobs["boolean"])('isLoading', false)
+  }, _eventDetailsMock.lunchBreak, {
+    onAction: function onAction(action) {
+      console.log(JSON.stringify(action.payload));
+    }
+  })));
+}).add('Scheduling: PTO', function () {
+  return _react["default"].createElement(_Core.Sidebar, {
+    side: "right",
+    isCollapsible: false,
+    isLarge: true
+  }, _react["default"].createElement(_Core.SidebarHeader, {
+    title: "PTO",
+    onClose: function onClose() {
+      return null;
+    }
+  }), _react["default"].createElement(_EventDetails["default"], (0, _extends2["default"])({
+    isLoading: (0, _addonKnobs["boolean"])('isLoading', false)
+  }, _eventDetailsMock.ptoBlock, {
+    onAction: function onAction(action) {
+      console.log(JSON.stringify(action.payload));
+    }
+  })));
+});
+//# sourceMappingURL=EventDetails-story.js.map

package/lib/components/EventDetails/EventDetails-story.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/EventDetails/EventDetails-story.tsx"],"names":["stories","module","addDecorator","withKnobs","add","appointment","action","console","log","JSON","stringify","payload","warningAppointment","pastAppointment","lunchBreak","ptoBlock"],"mappings":"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","sourcesContent":["import React from 'react'\nimport { storiesOf } from '@storybook/react'\n\nimport EventDetails from './EventDetails'\n\nimport { Sidebar, SidebarHeader } from '../Core'\n// import Page from '../Page'\n\nimport {\n\tappointment,\n\twarningAppointment,\n\tpastAppointment,\n\tlunchBreak,\n\tptoBlock\n} from './eventDetailsMock'\nimport { boolean, withKnobs } from '@storybook/addon-knobs'\n\nconst stories = storiesOf('EventDetails', module)\n\n// TODO: Turn off this decorator for specs. It obfuscates prop tables.\n// stories.addDecorator(storyFn => (\n// \t<Page STORYBOOKwrap={false} sidebar={storyFn()} />\n// ))\n\nstories.addDecorator(withKnobs)\n\nstories\n\t.add('Booking: Appointment', () => (\n\t\t<Sidebar side=\"right\" isCollapsible={false} isLarge>\n\t\t\t<SidebarHeader title=\"Appointment details\" onClose={() => null} />\n\t\t\t<EventDetails\n\t\t\t\tisLoading={boolean('isLoading', false)}\n\t\t\t\t{...appointment}\n\t\t\t\tonAction={action => {\n\t\t\t\t\tconsole.log(JSON.stringify(action.payload))\n\t\t\t\t}}\n\t\t\t/>\n\t\t</Sidebar>\n\t))\n\t.add('Booking: Appointment has warning', () => (\n\t\t<Sidebar side=\"right\" isCollapsible={false} isLarge>\n\t\t\t<SidebarHeader title=\"Appointment details\" onClose={() => null} />\n\t\t\t<EventDetails\n\t\t\t\tisLoading={boolean('isLoading', false)}\n\t\t\t\t{...warningAppointment}\n\t\t\t\tonAction={action => {\n\t\t\t\t\tconsole.log(JSON.stringify(action.payload))\n\t\t\t\t}}\n\t\t\t/>\n\t\t</Sidebar>\n\t))\n\t.add('Booking: Past Appointment', () => (\n\t\t<Sidebar side=\"right\" isCollapsible={false} isLarge>\n\t\t\t<SidebarHeader title=\"Appointment details\" onClose={() => null} />\n\t\t\t<EventDetails\n\t\t\t\tisLoading={boolean('isLoading', false)}\n\t\t\t\t{...pastAppointment}\n\t\t\t\tonAction={action => {\n\t\t\t\t\tconsole.log(JSON.stringify(action.payload))\n\t\t\t\t}}\n\t\t\t/>\n\t\t</Sidebar>\n\t))\n\t.add('Scheduling: Lunch Break', () => (\n\t\t<Sidebar side=\"right\" isCollapsible={false} isLarge>\n\t\t\t<SidebarHeader title=\"Lunch break\" onClose={() => null} />\n\t\t\t<EventDetails\n\t\t\t\tisLoading={boolean('isLoading', false)}\n\t\t\t\t{...lunchBreak}\n\t\t\t\tonAction={action => {\n\t\t\t\t\tconsole.log(JSON.stringify(action.payload))\n\t\t\t\t}}\n\t\t\t/>\n\t\t</Sidebar>\n\t))\n\n\t.add('Scheduling: PTO', () => (\n\t\t<Sidebar side=\"right\" isCollapsible={false} isLarge>\n\t\t\t<SidebarHeader title=\"PTO\" onClose={() => null} />\n\t\t\t<EventDetails\n\t\t\t\tisLoading={boolean('isLoading', false)}\n\t\t\t\t{...ptoBlock}\n\t\t\t\tonAction={action => {\n\t\t\t\t\tconsole.log(JSON.stringify(action.payload))\n\t\t\t\t}}\n\t\t\t/>\n\t\t</Sidebar>\n\t))\n"],"file":"EventDetails-story.js"}