@coorpacademy/components 10.13.6 → 10.13.9

package/lib/atom/drag-and-drop/style.css

@@ -6,145 +6,245 @@
 @value battle from colors;
 @value light from colors;
 @value xtraLightGrey from colors;
+@value cm_grey_50 from colors;
+@value cm_grey_100 from colors;
+@value cm_grey_200 from colors;
+@value cm_grey_300 from colors;
+@value cm_grey_400 from colors;
+@value cm_grey_700 from colors;
+@value white from colors;
+@value cm_negative_100 from colors;
+@value cm_yellow_100 from colors;
 
 .wrapper {
-  width: 360px;
+  font-family: "Gilroy";
+  max-height: 350px;
+  max-width: 460px;
+  height: 100%;
+  width: 100%;
 }
 
 .title {
-  font-family: "Gilroy";
-  font-size: 15px;
-  text-transform: none;
-  color: dark;
-  margin-bottom: 20px;
+  font-size: 16px;
+  font-weight: 700;
+  color: cm_grey_700;
+  margin-bottom: 8px;
+}
+
+.dragAndDropLabel {
+  composes: title;
+  margin-bottom: 12px;
+  font-size: 14px;
 }
 
 .description {
-  font-family: 'Gilroy';
-  font-size: 13px;
+  max-height: 85px;
+  font-size: 12px;
   font-weight: 400;
-  font-style: italic;
-  color: dark;
-  margin: 10px 0;
-  text-align: justify;
+  color: cm_grey_300;
+  text-align: center;
+  padding: 8px;
 }
 
-.previewWrapper {
+.previewContainer {
   width: 100%;
-  box-sizing: border-box;
-  border: 1px dashed medium;
-  margin-bottom: 10px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.modified {
-  composes: previewWrapper;
-  border: 2px solid battle;
+  height: 80%;
+  border: none;
+  border-radius: 7px;
+  background: cm_grey_50;
 }
 
-.previewWrapper span {
-  font-family: 'Gilroy';
-  color: dark;
-  font-size: 15px;
-  font-weight: 700;
-  line-height: 100px;
+.modifiedPreviewContainer {
+  composes: previewContainer;
+  border: 3px solid cm_yellow_100;
 }
 
-.previewView {
-  padding: 10px;
+.preview {
+  padding: 16px;
   width: 100%;
-  height: 100px;
+  height: 100%;
   box-sizing: border-box;
   display: flex;
+  justify-content: center;
+  align-items: center;
+  background-clip: content-box;
+  border-radius: 19px;
+  background-color: white;
 }
 
-.previewView img {
+.preview img, video {
   max-width: 100%;
   max-height: 100%;
   margin: auto;
 }
 
+.infosContainer {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-evenly;
+  overflow: hidden;
+}
+
 .inputWrapper {
+  background: cm_grey_50;
   width: 100%;
-  height: 70px;
+  height: 80%;
   box-sizing: border-box;
-  border: 1px dashed medium;
-  border-radius: 3px;
+  border-radius: 7px;
   position: relative;
   display: flex;
+  flex-direction: column;
   align-items: center;
-  justify-content: center;
+  justify-content: space-between;
+  padding: 14px 8px 8px 8px;
+  overflow: hidden;
+}
+
+.inputWrapper:before {
+  content: "";
+  position: absolute;
+  border: 10px dashed cm_grey_200;
+  top: -8px;
+  bottom: -8px;
+  left: -8px;
+  right: -8px;
+}
+
+.modifiedInputWrapper {
+  composes: inputWrapper;
+}
+
+.modifiedInputWrapper::before {
+  content: "";
+  position: absolute;
+  border: 10px dashed cm_yellow_100;
+  top: -8px;
+  bottom: -8px;
+  left: -8px;
+  right: -8px;
+}
+
+.errorInputWrapper {
+  composes: inputWrapper;
+}
+
+.errorInputWrapper .icon {
+  color: cm_negative_100;
 }
 
 .resetUploadWrapper {
   width: 100%;
-  height: 30px;
+  height: 24px;
   box-sizing: border-box;
-  background-color: xtraLightGrey;
-  border: solid 1px light;
+  background-color: cm_grey_50;
   border-radius: 3px;
-  position: relative;
   display: flex;
   align-items: center;
   justify-content: space-between;
-  /* fonts */
-  font-family: Gilroy;
-  font-size: 13px;
+  margin-top: 16px;
+  padding: 4px 8px;
+  font-size: 12px;
   font-weight: 400;
-  margin-top: 15px;
 }
 
 .resetSrcLabel {
-  font-family: Gilroy;
-  color: dark;
-  max-width: 220px;
+  color: cm_grey_700;
   display: inline-block;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   direction: rtl;
   text-align: left;
-  margin-left: 9px;
 }
 
 .closeIcon {
-  margin-right: 9px;
   cursor: pointer;
-  color: dark;
-}
-
-.closeIcon:hover {
-  color: black;
+  color: cm_grey_400;
+  margin-left: 6px;
 }
 
 .dragging {
   composes: inputWrapper;
-  border: 3px dashed brand;
+  border: 1px solid cm_grey_200;
+  background: cm_grey_100;
 }
 
-.arrow {
-  width: 34px;
-  height: 34px;
-  margin-right: 10px;
-  transition: all 0.2s cubic-bezier(0.47, 1.04, 0.46, 2.16);
+.dragging:before {
+  content: "";
+  position: absolute;
+  border: none;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
 }
 
-.dragging .arrow {
-  transform: scale(1.2);
+.dragging .description .icon {
+  font-size: 8px;
 }
 
-.uploadLabel {
-  font-family: 'Gilroy';
-  font-size: 18px;
-  text-transform: uppercase;
-  font-weight: 700;
-  color: dark;
+.dragging .icon {
+  transform: scale(0.85);
 }
 
-.loading {
-  min-height: 100px;
-  border: none;
+.icon {
+  min-width: 14px;
+  min-height: 14px;
+  max-width: 30px;
+  max-height: 30px;
+  height: 20%;
+  width: 20%;;
+  transition: all 0.2s cubic-bezier(0.47, 1.04, 0.46, 2.16);
+}
+
+.iconError {
+  composes: icon;
+  color: cm_negative_100;
+}
+
+.loaderWrapper {
   position: relative;
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  border-radius: 7px;
+}
+
+.loader {
+  margin-bottom: 8px;
+  height: 32px;
+  width: 32px;
+}
+
+.loaderText {
+  font-size: 12px;
+  font-weight: 400;
+}
+
+.loadingCancel {
+  display: none;
+  position: absolute;
+  top: 0;
+  right: 0;
+  padding: 6px;
+}
+
+.loaderWrapper:hover .loadingCancel {
+  display: block;
+}
+
+.loaderWrapper:hover {
+  background-color: cm_grey_100;
+}
+
+.errorMessage {
+  color: cm_negative_100;
+  font-size: 12px;
+  margin-top: 8px;
 }

package/lib/atom/drag-and-drop/test/dragging.js

@@ -18,12 +18,19 @@ var _withChildren = _interopRequireDefault(require("./fixtures/with-children"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 (0, _browserEnv.default)();
 (0, _enzyme.configure)({
   adapter: new _enzymeAdapterReact.default()
 });
+const {
+  props
+} = _withChildren.default;
 (0, _ava.default)('should set state to dragging when user starts dragging', t => {
-  const wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react.default.createElement(_.default, _withChildren.default.props, (onDragStart, onDragStop) => /*#__PURE__*/_react.default.createElement("input", {
+  const wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react.default.createElement(_.default, _extends({}, props, {
+    previewContent: {}
+  }), (onDragStart, onDragStop) => /*#__PURE__*/_react.default.createElement("input", {
     className: _style.default.input,
     key: "1",
     type: "file",

package/lib/atom/drag-and-drop/test/dragging.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/atom/drag-and-drop/test/dragging.js"],"names":["adapter","Adapter","t","wrapper","withChildrenFixtures","props","onDragStart","onDragStop","style","input","instance","false","state","dragging","find","simulate","true"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA;AACA,uBAAU;AAACA,EAAAA,OAAO,EAAE,IAAIC,2BAAJ;AAAV,CAAV;AAEA,kBAAK,wDAAL,EAA+DC,CAAC,IAAI;AAClE,QAAMC,OAAO,GAAG,mCACd,6BAAC,SAAD,EAAiBC,sBAAqBC,KAAtC,EACG,CAACC,WAAD,EAAcC,UAAd,kBACC;AACE,IAAA,SAAS,EAAEC,eAAMC,KADnB;AAEE,IAAA,GAAG,EAAC,GAFN;AAGE,IAAA,IAAI,EAAC,MAHP;AAIE,IAAA,MAAM,EAAC,SAJT;AAKE,IAAA,QAAQ,EAAE,MAAM,IALlB;AAME,IAAA,WAAW,EAAEH,WANf;AAOE,IAAA,MAAM,EAAEC,UAPV;AAQE,IAAA,WAAW,EAAEA;AARf,IAFJ,CADc,CAAhB;AAgBA,QAAMG,QAAQ,GAAGP,OAAO,CAACO,QAAR,EAAjB;AAEAR,EAAAA,CAAC,CAACS,KAAF,CAAQD,QAAQ,CAACE,KAAT,CAAeC,QAAvB;AACAV,EAAAA,OAAO,CAACW,IAAR,CAAa,OAAb,EAAsBC,QAAtB,CAA+B,WAA/B;AACAb,EAAAA,CAAC,CAACc,IAAF,CAAON,QAAQ,CAACE,KAAT,CAAeC,QAAtB;AACAV,EAAAA,OAAO,CAACW,IAAR,CAAa,OAAb,EAAsBC,QAAtB,CAA+B,WAA/B;AACAb,EAAAA,CAAC,CAACS,KAAF,CAAQD,QAAQ,CAACE,KAAT,CAAeC,QAAvB;AACD,CAxBD","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\nimport React from 'react';\nimport {shallow, configure} from 'enzyme';\nimport Adapter from 'enzyme-adapter-react-16';\nimport style from '../../image-upload/style.css';\nimport DragAndDrop from '..';\nimport withChildrenFixtures from './fixtures/with-children';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\ntest('should set state to dragging when user starts dragging', t => {\n  const wrapper = shallow(\n    <DragAndDrop {...withChildrenFixtures.props}>\n      {(onDragStart, onDragStop) => (\n        <input\n          className={style.input}\n          key=\"1\"\n          type=\"file\"\n          accept=\"image*/\"\n          onChange={() => true}\n          onDragEnter={onDragStart}\n          onDrop={onDragStop}\n          onDragLeave={onDragStop}\n        />\n      )}\n    </DragAndDrop>\n  );\n  const instance = wrapper.instance();\n\n  t.false(instance.state.dragging);\n  wrapper.find('input').simulate('dragenter');\n  t.true(instance.state.dragging);\n  wrapper.find('input').simulate('dragleave');\n  t.false(instance.state.dragging);\n});\n"],"file":"dragging.js"}
+{"version":3,"sources":["../../../../src/atom/drag-and-drop/test/dragging.js"],"names":["adapter","Adapter","props","withChildrenFixtures","t","wrapper","onDragStart","onDragStop","style","input","instance","false","state","dragging","find","simulate","true"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA;AACA,uBAAU;AAACA,EAAAA,OAAO,EAAE,IAAIC,2BAAJ;AAAV,CAAV;AAEA,MAAM;AAACC,EAAAA;AAAD,IAAUC,qBAAhB;AAEA,kBAAK,wDAAL,EAA+DC,CAAC,IAAI;AAClE,QAAMC,OAAO,GAAG,mCACd,6BAAC,SAAD,eAAiBH,KAAjB;AAAwB,IAAA,cAAc,EAAE;AAAxC,MACG,CAACI,WAAD,EAAcC,UAAd,kBACC;AACE,IAAA,SAAS,EAAEC,eAAMC,KADnB;AAEE,IAAA,GAAG,EAAC,GAFN;AAGE,IAAA,IAAI,EAAC,MAHP;AAIE,IAAA,MAAM,EAAC,SAJT;AAKE,IAAA,QAAQ,EAAE,MAAM,IALlB;AAME,IAAA,WAAW,EAAEH,WANf;AAOE,IAAA,MAAM,EAAEC,UAPV;AAQE,IAAA,WAAW,EAAEA;AARf,IAFJ,CADc,CAAhB;AAgBA,QAAMG,QAAQ,GAAGL,OAAO,CAACK,QAAR,EAAjB;AAEAN,EAAAA,CAAC,CAACO,KAAF,CAAQD,QAAQ,CAACE,KAAT,CAAeC,QAAvB;AACAR,EAAAA,OAAO,CAACS,IAAR,CAAa,OAAb,EAAsBC,QAAtB,CAA+B,WAA/B;AACAX,EAAAA,CAAC,CAACY,IAAF,CAAON,QAAQ,CAACE,KAAT,CAAeC,QAAtB;AACAR,EAAAA,OAAO,CAACS,IAAR,CAAa,OAAb,EAAsBC,QAAtB,CAA+B,WAA/B;AACAX,EAAAA,CAAC,CAACO,KAAF,CAAQD,QAAQ,CAACE,KAAT,CAAeC,QAAvB;AACD,CAxBD","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\nimport React from 'react';\nimport {shallow, configure} from 'enzyme';\nimport Adapter from 'enzyme-adapter-react-16';\nimport style from '../../image-upload/style.css';\nimport DragAndDrop from '..';\nimport withChildrenFixtures from './fixtures/with-children';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\nconst {props} = withChildrenFixtures;\n\ntest('should set state to dragging when user starts dragging', t => {\n  const wrapper = shallow(\n    <DragAndDrop {...props} previewContent={{}}>\n      {(onDragStart, onDragStop) => (\n        <input\n          className={style.input}\n          key=\"1\"\n          type=\"file\"\n          accept=\"image*/\"\n          onChange={() => true}\n          onDragEnter={onDragStart}\n          onDrop={onDragStop}\n          onDragLeave={onDragStop}\n        />\n      )}\n    </DragAndDrop>\n  );\n  const instance = wrapper.instance();\n\n  t.false(instance.state.dragging);\n  wrapper.find('input').simulate('dragenter');\n  t.true(instance.state.dragging);\n  wrapper.find('input').simulate('dragleave');\n  t.false(instance.state.dragging);\n});\n"],"file":"dragging.js"}

package/lib/atom/drag-and-drop/test/fixtures/clean-and-modified.js

@@ -0,0 +1,21 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _default2 = _interopRequireDefault(require("./default"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  props
+} = _default2.default;
+var _default = {
+  props: _extends(_extends({}, props), {}, {
+    modified: true
+  })
+};
+exports.default = _default;
+//# sourceMappingURL=clean-and-modified.js.map

package/lib/atom/drag-and-drop/test/fixtures/clean-and-modified.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/clean-and-modified.js"],"names":["props","defaultProps","modified"],"mappings":";;;;;AAAA;;;;;;AAEA,MAAM;AAACA,EAAAA;AAAD,IAAUC,iBAAhB;eAEe;AACbD,EAAAA,KAAK,wBACAA,KADA;AAEHE,IAAAA,QAAQ,EAAE;AAFP;AADQ,C","sourcesContent":["import defaultProps from './default';\n\nconst {props} = defaultProps;\n\nexport default {\n  props: {\n    ...props,\n    modified: true\n  }\n};\n"],"file":"clean-and-modified.js"}

package/lib/atom/drag-and-drop/test/fixtures/default.js

@@ -4,9 +4,9 @@ exports.__esModule = true;
 exports.default = void 0;
 var _default = {
   props: {
-    title: 'Drag & Drop',
-    description: 'Drag and drop component',
-    uploadLabel: 'Upload',
+    title: 'Drag & drop here',
+    description: 'JPG or PNG, smaller than 5mb',
+    uploadLabel: 'Browse',
     previewLabel: 'File Preview'
   }
 };

package/lib/atom/drag-and-drop/test/fixtures/default.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/default.js"],"names":["props","title","description","uploadLabel","previewLabel"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,aADF;AAELC,IAAAA,WAAW,EAAE,yBAFR;AAGLC,IAAAA,WAAW,EAAE,QAHR;AAILC,IAAAA,YAAY,EAAE;AAJT;AADM,C","sourcesContent":["export default {\n  props: {\n    title: 'Drag & Drop',\n    description: 'Drag and drop component',\n    uploadLabel: 'Upload',\n    previewLabel: 'File Preview'\n  }\n};\n"],"file":"default.js"}
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/default.js"],"names":["props","title","description","uploadLabel","previewLabel"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,kBADF;AAELC,IAAAA,WAAW,EAAE,8BAFR;AAGLC,IAAAA,WAAW,EAAE,QAHR;AAILC,IAAAA,YAAY,EAAE;AAJT;AADM,C","sourcesContent":["export default {\n  props: {\n    title: 'Drag & drop here',\n    description: 'JPG or PNG, smaller than 5mb',\n    uploadLabel: 'Browse',\n    previewLabel: 'File Preview'\n  }\n};\n"],"file":"default.js"}

package/lib/atom/drag-and-drop/test/fixtures/error.js

@@ -0,0 +1,21 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _default2 = _interopRequireDefault(require("./default"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  props
+} = _default2.default;
+var _default = {
+  props: _extends(_extends({}, props), {}, {
+    error: 'The file is invalid'
+  })
+};
+exports.default = _default;
+//# sourceMappingURL=error.js.map

package/lib/atom/drag-and-drop/test/fixtures/error.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/error.js"],"names":["props","defaultProps","error"],"mappings":";;;;;AAAA;;;;;;AAEA,MAAM;AAACA,EAAAA;AAAD,IAAUC,iBAAhB;eAEe;AACbD,EAAAA,KAAK,wBACAA,KADA;AAEHE,IAAAA,KAAK,EAAE;AAFJ;AADQ,C","sourcesContent":["import defaultProps from './default';\n\nconst {props} = defaultProps;\n\nexport default {\n  props: {\n    ...props,\n    error: 'The file is invalid'\n  }\n};\n"],"file":"error.js"}

package/lib/atom/drag-and-drop/test/fixtures/modified.js

@@ -0,0 +1,21 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _withImageReset = _interopRequireDefault(require("./with-image-reset"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  props
+} = _withImageReset.default;
+var _default = {
+  props: _extends(_extends({}, props), {}, {
+    modified: true
+  })
+};
+exports.default = _default;
+//# sourceMappingURL=modified.js.map

package/lib/atom/drag-and-drop/test/fixtures/modified.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/modified.js"],"names":["props","withImageReset","modified"],"mappings":";;;;;AAAA;;;;;;AAEA,MAAM;AAACA,EAAAA;AAAD,IAAUC,uBAAhB;eAEe;AACbD,EAAAA,KAAK,wBACAA,KADA;AAEHE,IAAAA,QAAQ,EAAE;AAFP;AADQ,C","sourcesContent":["import withImageReset from './with-image-reset';\n\nconst {props} = withImageReset;\n\nexport default {\n  props: {\n    ...props,\n    modified: true\n  }\n};\n"],"file":"modified.js"}

package/lib/atom/drag-and-drop/test/fixtures/with-children.js

@@ -2,13 +2,6 @@
 
 exports.__esModule = true;
 exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _style = _interopRequireDefault(require("../../../image-upload/style.css"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = {
   props: {
     previewContent: {
@@ -18,18 +11,7 @@ var _default = {
     title: 'Desktop (*)',
     displayName: 'Upload image',
     uploadLabel: 'Upload'
-  },
-  // eslint-disable-next-line react/display-name
-  children: (onDragStart, onDragStop) => /*#__PURE__*/_react.default.createElement("input", {
-    className: _style.default.input,
-    key: "1",
-    type: "file",
-    accept: "image*/",
-    onChange: () => true,
-    onDragEnter: onDragStart,
-    onDrop: onDragStop,
-    onDragLeave: onDragStop
-  })
+  }
 };
 exports.default = _default;
 //# sourceMappingURL=with-children.js.map

package/lib/atom/drag-and-drop/test/fixtures/with-children.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-children.js"],"names":["props","previewContent","type","src","title","displayName","uploadLabel","children","onDragStart","onDragStop","style","input"],"mappings":";;;;;AAAA;;AACA;;;;eAEe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,cAAc,EAAE;AACdC,MAAAA,IAAI,EAAE,OADQ;AAEdC,MAAAA,GAAG,EAAE;AAFS,KADX;AAKLC,IAAAA,KAAK,EAAE,aALF;AAMLC,IAAAA,WAAW,EAAE,cANR;AAOLC,IAAAA,WAAW,EAAE;AAPR,GADM;AAUb;AACAC,EAAAA,QAAQ,EAAE,CAACC,WAAD,EAAcC,UAAd,kBACR;AACE,IAAA,SAAS,EAAEC,eAAMC,KADnB;AAEE,IAAA,GAAG,EAAC,GAFN;AAGE,IAAA,IAAI,EAAC,MAHP;AAIE,IAAA,MAAM,EAAC,SAJT;AAKE,IAAA,QAAQ,EAAE,MAAM,IALlB;AAME,IAAA,WAAW,EAAEH,WANf;AAOE,IAAA,MAAM,EAAEC,UAPV;AAQE,IAAA,WAAW,EAAEA;AARf;AAZW,C","sourcesContent":["import React from 'react';\nimport style from '../../../image-upload/style.css';\n\nexport default {\n  props: {\n    previewContent: {\n      type: 'image',\n      src: 'https://static.coorpacademy.com/content/up/raw/logo_coorp-1491560495763.svg'\n    },\n    title: 'Desktop (*)',\n    displayName: 'Upload image',\n    uploadLabel: 'Upload'\n  },\n  // eslint-disable-next-line react/display-name\n  children: (onDragStart, onDragStop) => (\n    <input\n      className={style.input}\n      key=\"1\"\n      type=\"file\"\n      accept=\"image*/\"\n      onChange={() => true}\n      onDragEnter={onDragStart}\n      onDrop={onDragStop}\n      onDragLeave={onDragStop}\n    />\n  )\n};\n"],"file":"with-children.js"}
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-children.js"],"names":["props","previewContent","type","src","title","displayName","uploadLabel"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,cAAc,EAAE;AACdC,MAAAA,IAAI,EAAE,OADQ;AAEdC,MAAAA,GAAG,EAAE;AAFS,KADX;AAKLC,IAAAA,KAAK,EAAE,aALF;AAMLC,IAAAA,WAAW,EAAE,cANR;AAOLC,IAAAA,WAAW,EAAE;AAPR;AADM,C","sourcesContent":["export default {\n  props: {\n    previewContent: {\n      type: 'image',\n      src: 'https://static.coorpacademy.com/content/up/raw/logo_coorp-1491560495763.svg'\n    },\n    title: 'Desktop (*)',\n    displayName: 'Upload image',\n    uploadLabel: 'Upload'\n  }\n};\n"],"file":"with-children.js"}

package/lib/atom/drag-and-drop/test/fixtures/with-image.js

@@ -10,7 +10,7 @@ var _default = {
     previewLabel: 'File Preview',
     previewContent: {
       type: 'image',
-      src: 'https://static.coorpacademy.com/content/up/raw/logo_mobile-1491560713685.svg'
+      src: 'https://static.coorpacademy.com/content/up/raw/logo_coorp-1491560495763.svg'
     }
   }
 };

package/lib/atom/drag-and-drop/test/fixtures/with-image.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-image.js"],"names":["props","title","description","uploadLabel","previewLabel","previewContent","type","src"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,wBADF;AAELC,IAAAA,WAAW,EAAE,uCAFR;AAGLC,IAAAA,WAAW,EAAE,iBAHR;AAILC,IAAAA,YAAY,EAAE,cAJT;AAKLC,IAAAA,cAAc,EAAE;AACdC,MAAAA,IAAI,EAAE,OADQ;AAEdC,MAAAA,GAAG,EAAE;AAFS;AALX;AADM,C","sourcesContent":["export default {\n  props: {\n    title: 'Drag & Drop With Image',\n    description: 'Drag and drop component with an image',\n    uploadLabel: 'Upload Image(s)',\n    previewLabel: 'File Preview',\n    previewContent: {\n      type: 'image',\n      src: 'https://static.coorpacademy.com/content/up/raw/logo_mobile-1491560713685.svg'\n    }\n  }\n};\n"],"file":"with-image.js"}
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-image.js"],"names":["props","title","description","uploadLabel","previewLabel","previewContent","type","src"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,wBADF;AAELC,IAAAA,WAAW,EAAE,uCAFR;AAGLC,IAAAA,WAAW,EAAE,iBAHR;AAILC,IAAAA,YAAY,EAAE,cAJT;AAKLC,IAAAA,cAAc,EAAE;AACdC,MAAAA,IAAI,EAAE,OADQ;AAEdC,MAAAA,GAAG,EAAE;AAFS;AALX;AADM,C","sourcesContent":["export default {\n  props: {\n    title: 'Drag & Drop With Image',\n    description: 'Drag and drop component with an image',\n    uploadLabel: 'Upload Image(s)',\n    previewLabel: 'File Preview',\n    previewContent: {\n      type: 'image',\n      src: 'https://static.coorpacademy.com/content/up/raw/logo_coorp-1491560495763.svg'\n    }\n  }\n};\n"],"file":"with-image.js"}

package/lib/atom/drag-and-drop/test/fixtures/with-long-description.js

@@ -0,0 +1,21 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _default2 = _interopRequireDefault(require("./default"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  props
+} = _default2.default;
+var _default = {
+  props: _extends(_extends({}, props), {}, {
+    description: 'Max file size: 5MO. Recommended format: SVG (if your client uses a majority of IE, use PNG format instead). Recommended aspect ratio : horizontal 2:1 (e.g. 500px x 250px). Maximum recommended aspect ratio 1:1 (e.g. 500x500, which means that it should not be taller than its width).'
+  })
+};
+exports.default = _default;
+//# sourceMappingURL=with-long-description.js.map

package/lib/atom/drag-and-drop/test/fixtures/with-long-description.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-long-description.js"],"names":["props","defaultProps","description"],"mappings":";;;;;AAAA;;;;;;AAEA,MAAM;AAACA,EAAAA;AAAD,IAAUC,iBAAhB;eACe;AACbD,EAAAA,KAAK,wBACAA,KADA;AAEHE,IAAAA,WAAW,EACT;AAHC;AADQ,C","sourcesContent":["import defaultProps from './default';\n\nconst {props} = defaultProps;\nexport default {\n  props: {\n    ...props,\n    description:\n      'Max file size: 5MO. Recommended format: SVG (if your client uses a majority of IE, use PNG format instead). Recommended aspect ratio : horizontal 2:1 (e.g. 500px x 250px). Maximum recommended aspect ratio 1:1 (e.g. 500x500, which means that it should not be taller than its width).'\n  }\n};\n"],"file":"with-long-description.js"}

package/lib/atom/drag-and-drop/test/fixtures/with-video.js

@@ -11,7 +11,8 @@ var _default = {
     previewContent: {
       type: 'video',
       src: 'https://www.w3schools.com/tags/movie.mp4'
-    }
+    },
+    onReset: () => console.log('reset')
   }
 };
 exports.default = _default;

package/lib/atom/drag-and-drop/test/fixtures/with-video.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-video.js"],"names":["props","title","description","uploadLabel","previewLabel","previewContent","type","src"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,aADF;AAELC,IAAAA,WAAW,EAAE,sCAFR;AAGLC,IAAAA,WAAW,EAAE,QAHR;AAILC,IAAAA,YAAY,EAAE,cAJT;AAKLC,IAAAA,cAAc,EAAE;AACdC,MAAAA,IAAI,EAAE,OADQ;AAEdC,MAAAA,GAAG,EAAE;AAFS;AALX;AADM,C","sourcesContent":["export default {\n  props: {\n    title: 'Drag & Drop',\n    description: 'Drag and drop component with a video',\n    uploadLabel: 'Upload',\n    previewLabel: 'File Preview',\n    previewContent: {\n      type: 'video',\n      src: 'https://www.w3schools.com/tags/movie.mp4'\n    }\n  }\n};\n"],"file":"with-video.js"}
+{"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/with-video.js"],"names":["props","title","description","uploadLabel","previewLabel","previewContent","type","src","onReset","console","log"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,aADF;AAELC,IAAAA,WAAW,EAAE,sCAFR;AAGLC,IAAAA,WAAW,EAAE,QAHR;AAILC,IAAAA,YAAY,EAAE,cAJT;AAKLC,IAAAA,cAAc,EAAE;AACdC,MAAAA,IAAI,EAAE,OADQ;AAEdC,MAAAA,GAAG,EAAE;AAFS,KALX;AASLC,IAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ;AATV;AADM,C","sourcesContent":["export default {\n  props: {\n    title: 'Drag & Drop',\n    description: 'Drag and drop component with a video',\n    uploadLabel: 'Upload',\n    previewLabel: 'File Preview',\n    previewContent: {\n      type: 'video',\n      src: 'https://www.w3schools.com/tags/movie.mp4'\n    },\n    onReset: () => console.log('reset')\n  }\n};\n"],"file":"with-video.js"}

package/lib/atom/drag-and-drop/test/fixtures.js

@@ -8,16 +8,24 @@ var _renderComponent = _interopRequireDefault(require("../../../test/helpers/ren
 
 var _ = _interopRequireDefault(require(".."));
 
+var _cleanAndModified = _interopRequireDefault(require("./fixtures/clean-and-modified"));
+
 var _default = _interopRequireDefault(require("./fixtures/default"));
 
+var _error = _interopRequireDefault(require("./fixtures/error"));
+
 var _loading = _interopRequireDefault(require("./fixtures/loading"));
 
+var _modified = _interopRequireDefault(require("./fixtures/modified"));
+
 var _withChildren = _interopRequireDefault(require("./fixtures/with-children"));
 
 var _withImageReset = _interopRequireDefault(require("./fixtures/with-image-reset"));
 
 var _withImage = _interopRequireDefault(require("./fixtures/with-image"));
 
+var _withLongDescription = _interopRequireDefault(require("./fixtures/with-long-description"));
+
 var _withVideo = _interopRequireDefault(require("./fixtures/with-video"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -28,10 +36,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
     t.not(value, undefined, `PropType for "Atom.AtomDragAndDrop.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
   });
 });
+(0, _ava.default)('Atom › AtomDragAndDrop › CleanAndModified › should be rendered', _renderComponent.default, _.default, _cleanAndModified.default);
 (0, _ava.default)('Atom › AtomDragAndDrop › Default › should be rendered', _renderComponent.default, _.default, _default.default);
+(0, _ava.default)('Atom › AtomDragAndDrop › Error › should be rendered', _renderComponent.default, _.default, _error.default);
 (0, _ava.default)('Atom › AtomDragAndDrop › Loading › should be rendered', _renderComponent.default, _.default, _loading.default);
+(0, _ava.default)('Atom › AtomDragAndDrop › Modified › should be rendered', _renderComponent.default, _.default, _modified.default);
 (0, _ava.default)('Atom › AtomDragAndDrop › WithChildren › should be rendered', _renderComponent.default, _.default, _withChildren.default);
 (0, _ava.default)('Atom › AtomDragAndDrop › WithImageReset › should be rendered', _renderComponent.default, _.default, _withImageReset.default);
 (0, _ava.default)('Atom › AtomDragAndDrop › WithImage › should be rendered', _renderComponent.default, _.default, _withImage.default);
+(0, _ava.default)('Atom › AtomDragAndDrop › WithLongDescription › should be rendered', _renderComponent.default, _.default, _withLongDescription.default);
 (0, _ava.default)('Atom › AtomDragAndDrop › WithVideo › should be rendered', _renderComponent.default, _.default, _withVideo.default);
 //# sourceMappingURL=fixtures.js.map

package/lib/atom/drag-and-drop/test/fixtures.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/atom/drag-and-drop/test/fixtures.js"],"names":["t","pass","AtomDragAndDrop","propTypes","value","key","not","undefined","renderComponentMacro","fixtureDefault","fixtureLoading","fixtureWithChildren","fixtureWithImageReset","fixtureWithImage","fixtureWithVideo"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,kBAAK,sDAAL,EAA6DA,CAAC,IAAI;AAChEA,EAAAA,CAAC,CAACC,IAAF;AACA,wBAAQC,UAAgBC,SAAxB,EAAmC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjDL,IAAAA,CAAC,CAACM,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,gDAA+CF,GAAI,mEAA5E;AACD,GAFD;AAGD,CALD;AAOA,kBAAK,uDAAL,EAA8DG,wBAA9D,EAAoFN,SAApF,EAAqGO,gBAArG;AACA,kBAAK,uDAAL,EAA8DD,wBAA9D,EAAoFN,SAApF,EAAqGQ,gBAArG;AACA,kBAAK,4DAAL,EAAmEF,wBAAnE,EAAyFN,SAAzF,EAA0GS,qBAA1G;AACA,kBAAK,8DAAL,EAAqEH,wBAArE,EAA2FN,SAA3F,EAA4GU,uBAA5G;AACA,kBAAK,yDAAL,EAAgEJ,wBAAhE,EAAsFN,SAAtF,EAAuGW,kBAAvG;AACA,kBAAK,yDAAL,EAAgEL,wBAAhE,EAAsFN,SAAtF,EAAuGY,kBAAvG","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomDragAndDrop from '..';\nimport fixtureDefault from './fixtures/default';\nimport fixtureLoading from './fixtures/loading';\nimport fixtureWithChildren from './fixtures/with-children';\nimport fixtureWithImageReset from './fixtures/with-image-reset';\nimport fixtureWithImage from './fixtures/with-image';\nimport fixtureWithVideo from './fixtures/with-video';\n\ntest('Atom › AtomDragAndDrop > should have valid propTypes', t => {\n  t.pass();\n  forEach(AtomDragAndDrop.propTypes, (value, key) => {\n    t.not(value, undefined, `PropType for \"Atom.AtomDragAndDrop.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n  });\n});\n\ntest('Atom › AtomDragAndDrop › Default › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDefault);\ntest('Atom › AtomDragAndDrop › Loading › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureLoading);\ntest('Atom › AtomDragAndDrop › WithChildren › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithChildren);\ntest('Atom › AtomDragAndDrop › WithImageReset › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithImageReset);\ntest('Atom › AtomDragAndDrop › WithImage › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithImage);\ntest('Atom › AtomDragAndDrop › WithVideo › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithVideo);\n"],"file":"fixtures.js"}
+{"version":3,"sources":["../../../../src/atom/drag-and-drop/test/fixtures.js"],"names":["t","pass","AtomDragAndDrop","propTypes","value","key","not","undefined","renderComponentMacro","fixtureCleanAndModified","fixtureDefault","fixtureError","fixtureLoading","fixtureModified","fixtureWithChildren","fixtureWithImageReset","fixtureWithImage","fixtureWithLongDescription","fixtureWithVideo"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,kBAAK,sDAAL,EAA6DA,CAAC,IAAI;AAChEA,EAAAA,CAAC,CAACC,IAAF;AACA,wBAAQC,UAAgBC,SAAxB,EAAmC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjDL,IAAAA,CAAC,CAACM,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,gDAA+CF,GAAI,mEAA5E;AACD,GAFD;AAGD,CALD;AAOA,kBAAK,gEAAL,EAAuEG,wBAAvE,EAA6FN,SAA7F,EAA8GO,yBAA9G;AACA,kBAAK,uDAAL,EAA8DD,wBAA9D,EAAoFN,SAApF,EAAqGQ,gBAArG;AACA,kBAAK,qDAAL,EAA4DF,wBAA5D,EAAkFN,SAAlF,EAAmGS,cAAnG;AACA,kBAAK,uDAAL,EAA8DH,wBAA9D,EAAoFN,SAApF,EAAqGU,gBAArG;AACA,kBAAK,wDAAL,EAA+DJ,wBAA/D,EAAqFN,SAArF,EAAsGW,iBAAtG;AACA,kBAAK,4DAAL,EAAmEL,wBAAnE,EAAyFN,SAAzF,EAA0GY,qBAA1G;AACA,kBAAK,8DAAL,EAAqEN,wBAArE,EAA2FN,SAA3F,EAA4Ga,uBAA5G;AACA,kBAAK,yDAAL,EAAgEP,wBAAhE,EAAsFN,SAAtF,EAAuGc,kBAAvG;AACA,kBAAK,mEAAL,EAA0ER,wBAA1E,EAAgGN,SAAhG,EAAiHe,4BAAjH;AACA,kBAAK,yDAAL,EAAgET,wBAAhE,EAAsFN,SAAtF,EAAuGgB,kBAAvG","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomDragAndDrop from '..';\nimport fixtureCleanAndModified from './fixtures/clean-and-modified';\nimport fixtureDefault from './fixtures/default';\nimport fixtureError from './fixtures/error';\nimport fixtureLoading from './fixtures/loading';\nimport fixtureModified from './fixtures/modified';\nimport fixtureWithChildren from './fixtures/with-children';\nimport fixtureWithImageReset from './fixtures/with-image-reset';\nimport fixtureWithImage from './fixtures/with-image';\nimport fixtureWithLongDescription from './fixtures/with-long-description';\nimport fixtureWithVideo from './fixtures/with-video';\n\ntest('Atom › AtomDragAndDrop > should have valid propTypes', t => {\n  t.pass();\n  forEach(AtomDragAndDrop.propTypes, (value, key) => {\n    t.not(value, undefined, `PropType for \"Atom.AtomDragAndDrop.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n  });\n});\n\ntest('Atom › AtomDragAndDrop › CleanAndModified › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureCleanAndModified);\ntest('Atom › AtomDragAndDrop › Default › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDefault);\ntest('Atom › AtomDragAndDrop › Error › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureError);\ntest('Atom › AtomDragAndDrop › Loading › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureLoading);\ntest('Atom › AtomDragAndDrop › Modified › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureModified);\ntest('Atom › AtomDragAndDrop › WithChildren › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithChildren);\ntest('Atom › AtomDragAndDrop › WithImageReset › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithImageReset);\ntest('Atom › AtomDragAndDrop › WithImage › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithImage);\ntest('Atom › AtomDragAndDrop › WithLongDescription › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithLongDescription);\ntest('Atom › AtomDragAndDrop › WithVideo › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureWithVideo);\n"],"file":"fixtures.js"}

package/lib/atom/image-upload/index.js

@@ -41,7 +41,8 @@ const ImageUpload = ({
   onReset = null,
   name,
   // See ImagePropType for accepted values
-  imageTypes = ['*']
+  imageTypes = ['*'],
+  error = ''
 }) => {
   const handleReset = (0, _react.useCallback)(e => {
     if ((0, _isNil2.default)(onReset)) return;
@@ -57,7 +58,8 @@ const ImageUpload = ({
     uploadLabel: uploadLabel,
     loading: loading,
     modified: modified,
-    onReset: handleReset
+    onReset: handleReset,
+    error: error
   }, (onDragStart, onDragStop) => /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("input", {
     type: "file",
     name: name,
@@ -75,7 +77,8 @@ ImageUpload.propTypes = process.env.NODE_ENV !== "production" ? _extends(_extend
   name: _propTypes.default.string,
   onChange: _propTypes.default.func,
   onReset: _propTypes.default.func,
-  imageTypes: _propTypes.default.arrayOf(_proptypes.ImagePropType)
+  imageTypes: _propTypes.default.arrayOf(_proptypes.ImagePropType),
+  error: _propTypes.default.string
 }) : {};
 var _default = ImageUpload;
 exports.default = _default;