@coorpacademy/components 10.17.0 → 10.17.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/README.md +21 -1
  2. package/es/atom/drag-and-drop/index.js +8 -5
  3. package/es/atom/drag-and-drop/index.js.map +1 -1
  4. package/es/atom/drag-and-drop/style.css +5 -0
  5. package/es/atom/drag-and-drop/test/fixtures/disabled-with-image-reset.js +12 -0
  6. package/es/atom/drag-and-drop/test/fixtures/disabled-with-image-reset.js.map +1 -0
  7. package/es/atom/drag-and-drop/test/fixtures/disabled.js +12 -0
  8. package/es/atom/drag-and-drop/test/fixtures/disabled.js.map +1 -0
  9. package/es/atom/drag-and-drop/test/fixtures.js +4 -0
  10. package/es/atom/drag-and-drop/test/fixtures.js.map +1 -1
  11. package/es/atom/image-upload/index.js +3 -1
  12. package/es/atom/image-upload/index.js.map +1 -1
  13. package/es/atom/image-upload/test/fixtures/disabled.js +12 -0
  14. package/es/atom/image-upload/test/fixtures/disabled.js.map +1 -0
  15. package/es/atom/image-upload/test/fixtures.js +2 -0
  16. package/es/atom/image-upload/test/fixtures.js.map +1 -1
  17. package/es/atom/lottie-wrapper/index.js +37 -9
  18. package/es/atom/lottie-wrapper/index.js.map +1 -1
  19. package/es/atom/lottie-wrapper/test/fixtures/confetti.js +3 -1
  20. package/es/atom/lottie-wrapper/test/fixtures/confetti.js.map +1 -1
  21. package/es/atom/lottie-wrapper/test/fixtures/controls.js +10 -0
  22. package/es/atom/lottie-wrapper/test/fixtures/controls.js.map +1 -0
  23. package/es/atom/lottie-wrapper/test/fixtures/default.js +3 -1
  24. package/es/atom/lottie-wrapper/test/fixtures/default.js.map +1 -1
  25. package/es/atom/lottie-wrapper/test/fixtures/rank.js +3 -1
  26. package/es/atom/lottie-wrapper/test/fixtures/rank.js.map +1 -1
  27. package/es/atom/lottie-wrapper/test/fixtures.js +2 -0
  28. package/es/atom/lottie-wrapper/test/fixtures.js.map +1 -1
  29. package/es/atom/lottie-wrapper/test/lottie.js +57 -20
  30. package/es/atom/lottie-wrapper/test/lottie.js.map +1 -1
  31. package/es/molecule/drag-and-drop-wrapper/test/fixtures/{without-checkbox.js → disabled.js} +3 -2
  32. package/es/molecule/drag-and-drop-wrapper/test/fixtures/disabled.js.map +1 -0
  33. package/es/molecule/drag-and-drop-wrapper/test/fixtures.js +2 -2
  34. package/es/molecule/drag-and-drop-wrapper/test/fixtures.js.map +1 -1
  35. package/es/organism/rewards-form/test/fixtures/default.js +3 -2
  36. package/es/organism/rewards-form/test/fixtures/default.js.map +1 -1
  37. package/lib/atom/drag-and-drop/index.js +9 -5
  38. package/lib/atom/drag-and-drop/index.js.map +1 -1
  39. package/lib/atom/drag-and-drop/style.css +5 -0
  40. package/lib/atom/drag-and-drop/test/fixtures/disabled-with-image-reset.js +21 -0
  41. package/lib/atom/drag-and-drop/test/fixtures/disabled-with-image-reset.js.map +1 -0
  42. package/lib/atom/drag-and-drop/test/fixtures/disabled.js +21 -0
  43. package/lib/atom/drag-and-drop/test/fixtures/disabled.js.map +1 -0
  44. package/lib/atom/drag-and-drop/test/fixtures.js +6 -0
  45. package/lib/atom/drag-and-drop/test/fixtures.js.map +1 -1
  46. package/lib/atom/image-upload/index.js +3 -1
  47. package/lib/atom/image-upload/index.js.map +1 -1
  48. package/lib/atom/image-upload/test/fixtures/disabled.js +21 -0
  49. package/lib/atom/image-upload/test/fixtures/disabled.js.map +1 -0
  50. package/lib/atom/image-upload/test/fixtures.js +3 -0
  51. package/lib/atom/image-upload/test/fixtures.js.map +1 -1
  52. package/lib/atom/lottie-wrapper/index.js +42 -10
  53. package/lib/atom/lottie-wrapper/index.js.map +1 -1
  54. package/lib/atom/lottie-wrapper/test/fixtures/confetti.js +3 -1
  55. package/lib/atom/lottie-wrapper/test/fixtures/confetti.js.map +1 -1
  56. package/lib/atom/lottie-wrapper/test/fixtures/controls.js +19 -0
  57. package/lib/atom/lottie-wrapper/test/fixtures/controls.js.map +1 -0
  58. package/lib/atom/lottie-wrapper/test/fixtures/default.js +3 -1
  59. package/lib/atom/lottie-wrapper/test/fixtures/default.js.map +1 -1
  60. package/lib/atom/lottie-wrapper/test/fixtures/rank.js +3 -1
  61. package/lib/atom/lottie-wrapper/test/fixtures/rank.js.map +1 -1
  62. package/lib/atom/lottie-wrapper/test/fixtures.js +3 -0
  63. package/lib/atom/lottie-wrapper/test/fixtures.js.map +1 -1
  64. package/lib/atom/lottie-wrapper/test/lottie.js +60 -21
  65. package/lib/atom/lottie-wrapper/test/lottie.js.map +1 -1
  66. package/lib/molecule/drag-and-drop-wrapper/test/fixtures/{without-checkbox.js → disabled.js} +3 -2
  67. package/lib/molecule/drag-and-drop-wrapper/test/fixtures/disabled.js.map +1 -0
  68. package/lib/molecule/drag-and-drop-wrapper/test/fixtures.js +3 -3
  69. package/lib/molecule/drag-and-drop-wrapper/test/fixtures.js.map +1 -1
  70. package/lib/organism/rewards-form/test/fixtures/default.js +4 -3
  71. package/lib/organism/rewards-form/test/fixtures/default.js.map +1 -1
  72. package/package.json +4 -3
  73. package/es/molecule/drag-and-drop-wrapper/test/fixtures/without-checkbox.js.map +0 -1
  74. package/lib/molecule/drag-and-drop-wrapper/test/fixtures/without-checkbox.js.map +0 -1
package/README.md CHANGED
@@ -116,7 +116,27 @@ const props = {
116
116
  height: 200,
117
117
  width: 200,
118
118
  ie11ImageBackup:
119
- 'https://static-staging.coorpacademy.com/animations/review/rank_icon_congrats.svg'
119
+ 'https://static-staging.coorpacademy.com/animations/review/rank_icon_congrats.svg',
120
+ // autoplay: true // autoplay is true by default
121
+ }
122
+ ```
123
+
124
+ If you need to control the animation (play/pause/stop), then you must set autoplay to false &
125
+ add your desired state, among the available states: `play, pause, stop, loading`
126
+
127
+ ```javascript
128
+ const props = {
129
+ 'aria-label': 'aria lottie',
130
+ 'data-name': 'default-lottie',
131
+ className: undefined,
132
+ animationSrc: 'https://static-staging.coorpacademy.com/animations/review/rank.json',
133
+ loop: true,
134
+ height: 200,
135
+ width: 200,
136
+ ie11ImageBackup:
137
+ 'https://static-staging.coorpacademy.com/animations/review/rank_icon_congrats.svg',
138
+ autoplay: false,
139
+ animationControl: 'loading' // play can be passed directly without using loading first
120
140
  }
121
141
  ```
122
142
 
@@ -7,6 +7,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
7
7
  import React from 'react';
8
8
  import PropTypes from 'prop-types';
9
9
  import { NovaSolidStatusClose as Close, NovaSolidFilesBasicFileUpload2 as FileUploadIcon, NovaSolidFilesBasicFileBlock2 as FileUploadBlockedIcon } from '@coorpacademy/nova-icons';
10
+ import classnames from 'classnames';
10
11
  import Loader from '../loader';
11
12
  import Button from '../button-link';
12
13
  import getClassState from '../../util/get-class-state';
@@ -51,7 +52,8 @@ class DragAndDrop extends React.Component {
51
52
  onReset = null,
52
53
  error = '',
53
54
  buttonAriaLabel = '',
54
- errorButtonLabel = ''
55
+ errorButtonLabel = '',
56
+ disabled = false
55
57
  } = this.props;
56
58
  const {
57
59
  dragging
@@ -95,7 +97,7 @@ class DragAndDrop extends React.Component {
95
97
  }
96
98
 
97
99
  const resetContent = previewContent && previewContent.src ? /*#__PURE__*/React.createElement("div", {
98
- className: style.resetUploadWrapper
100
+ className: classnames(style.resetUploadWrapper, disabled && style.disabled)
99
101
  }, /*#__PURE__*/React.createElement("div", {
100
102
  className: style.resetSrcLabel
101
103
  }, previewContent.label ? previewContent.label : previewContent.src), onReset ? /*#__PURE__*/React.createElement(Close, {
@@ -138,9 +140,9 @@ class DragAndDrop extends React.Component {
138
140
  }, /*#__PURE__*/React.createElement("div", {
139
141
  className: style.title
140
142
  }, title), !_isEmpty(previewContent) || loading ? /*#__PURE__*/React.createElement("div", {
141
- className: previewContainer
143
+ className: classnames(previewContainer, disabled && style.disabled)
142
144
  }, previewView) : /*#__PURE__*/React.createElement("div", {
143
- className: dragging ? style.dragging : inputWrapper,
145
+ className: classnames(dragging ? style.dragging : inputWrapper, disabled && style.disabled),
144
146
  id: idBox
145
147
  }, /*#__PURE__*/React.createElement("div", {
146
148
  className: style.infosContainer
@@ -153,7 +155,7 @@ class DragAndDrop extends React.Component {
153
155
  }, description) : null, error ? null : /*#__PURE__*/React.createElement("div", {
154
156
  className: style.dragAndDropLabel
155
157
  }, 'Drag & Drop here')), button, /*#__PURE__*/React.createElement("div", null, children(this.handleDragStart, this.handleDragStop))), error ? /*#__PURE__*/React.createElement("span", {
156
- className: style.errorMessage
158
+ className: classnames(style.errorMessage, disabled && style.disabled)
157
159
  }, error) : resetContent);
158
160
  }
159
161
 
@@ -171,6 +173,7 @@ DragAndDrop.propTypes = process.env.NODE_ENV !== "production" ? {
171
173
  }),
172
174
  loading: PropTypes.bool,
173
175
  modified: PropTypes.bool,
176
+ disabled: PropTypes.bool,
174
177
  children: PropTypes.func,
175
178
  onReset: PropTypes.func,
176
179
  error: PropTypes.string,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/atom/drag-and-drop/index.js"],"names":["React","PropTypes","NovaSolidStatusClose","Close","NovaSolidFilesBasicFileUpload2","FileUploadIcon","NovaSolidFilesBasicFileBlock2","FileUploadBlockedIcon","Loader","Button","getClassState","style","constantNull","DragAndDrop","Component","constructor","props","state","dragging","handleDragStart","bind","handleDragStop","setState","render","idBox","children","title","description","uploadLabel","previewLabel","previewContent","loading","modified","onReset","error","buttonAriaLabel","errorButtonLabel","previewView","type","preview","src","loaderWrapper","loadingCancel","closeIcon","loader","loaderText","resetContent","resetUploadWrapper","resetSrcLabel","label","buildButton","defaultButtonProps","icon","position","button","previewContainer","modifiedPreviewContainer","inputWrapper","modifiedInputWrapper","errorInputWrapper","wrapper","infosContainer","iconError","dragAndDropLabel","errorMessage","propTypes","string","shape","bool","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {uniqueId, constant, isEmpty} from 'lodash/fp';\nimport {\n NovaSolidStatusClose as Close,\n NovaSolidFilesBasicFileUpload2 as FileUploadIcon,\n NovaSolidFilesBasicFileBlock2 as FileUploadBlockedIcon\n} from '@coorpacademy/nova-icons';\nimport Loader from '../loader';\nimport Button from '../button-link';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst constantNull = constant(null);\n\nclass DragAndDrop extends React.Component {\n static propTypes = {\n title: PropTypes.string,\n description: PropTypes.string,\n uploadLabel: PropTypes.string,\n previewLabel: PropTypes.string,\n previewContent: PropTypes.shape({\n type: PropTypes.string,\n src: PropTypes.string,\n label: PropTypes.string\n }),\n loading: PropTypes.bool,\n modified: PropTypes.bool,\n children: PropTypes.func,\n onReset: PropTypes.func,\n error: PropTypes.string,\n buttonAriaLabel: PropTypes.string,\n errorButtonLabel: PropTypes.string\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n dragging: false\n };\n\n this.handleDragStart = this.handleDragStart.bind(this);\n this.handleDragStop = this.handleDragStop.bind(this);\n }\n\n handleDragStart() {\n this.setState({\n dragging: true\n });\n }\n\n handleDragStop() {\n this.setState({\n dragging: false\n });\n }\n\n render() {\n const idBox = uniqueId('drop-box-');\n const {\n children = constantNull,\n title,\n description,\n uploadLabel,\n previewLabel = '',\n previewContent,\n loading = false,\n modified = false,\n onReset = null,\n error = '',\n buttonAriaLabel = '',\n errorButtonLabel = ''\n } = this.props;\n const {dragging} = this.state;\n\n let previewView = null;\n\n if (previewContent && previewContent.type === 'image') {\n previewView = (\n <div className={style.preview}>\n <img src={previewContent.src} />\n </div>\n );\n } else if (previewContent && previewContent.type === 'video') {\n previewView = (\n <div className={style.preview}>\n <video controls src={previewContent.src} type=\"video/*\" />\n </div>\n );\n } else if (loading) {\n previewView = (\n <div className={style.loaderWrapper}>\n <div className={style.loadingCancel}>\n <Close\n data-name=\"reset-content-icon\"\n height={12}\n width={12}\n className={style.closeIcon}\n onClick={onReset}\n />\n </div>\n <div className={style.loader}>\n <Loader theme=\"coorpmanager\" />\n </div>\n <span className={style.loaderText}>Uploading</span>\n </div>\n );\n } else {\n previewView = <span>{previewLabel}</span>;\n }\n\n const resetContent =\n previewContent && previewContent.src ? (\n <div className={style.resetUploadWrapper}>\n <div className={style.resetSrcLabel}>\n {previewContent.label ? previewContent.label : previewContent.src}\n </div>\n {onReset ? (\n <Close\n data-name=\"reset-content-icon\"\n height={12}\n width={12}\n className={style.closeIcon}\n onClick={onReset}\n />\n ) : null}\n </div>\n ) : null;\n\n const buildButton = () => {\n const defaultButtonProps = {\n label: uploadLabel,\n 'aria-label': buttonAriaLabel,\n 'data-name': 'default-button',\n icon: {\n position: 'left',\n type: 'folders'\n }\n };\n if (dragging) {\n return null;\n } else if (error) {\n return <Button {...defaultButtonProps} label={errorButtonLabel} icon={{}} />;\n } else {\n return <Button {...defaultButtonProps} />;\n }\n };\n\n const button = buildButton(dragging, error);\n\n const previewContainer = getClassState(\n style.previewContainer,\n style.modifiedPreviewContainer,\n null,\n modified,\n error\n );\n const inputWrapper = getClassState(\n style.inputWrapper,\n style.modifiedInputWrapper,\n style.errorInputWrapper,\n modified,\n error\n );\n\n return (\n <div className={style.wrapper} data-name=\"drag-and-drop-wrapper\">\n <div className={style.title}>{title}</div>\n {!isEmpty(previewContent) || loading ? (\n <div className={previewContainer}>{previewView}</div>\n ) : (\n <div className={dragging ? style.dragging : inputWrapper} id={idBox}>\n <div className={style.infosContainer}>\n {error ? (\n <FileUploadBlockedIcon className={style.iconError} />\n ) : (\n <FileUploadIcon className={style.icon} />\n )}\n {description ? <div className={style.description}>{description}</div> : null}\n {error ? null : <div className={style.dragAndDropLabel}>{'Drag & Drop here'}</div>}\n </div>\n {button}\n <div>{children(this.handleDragStart, this.handleDragStop)}</div>\n </div>\n )}\n {error ? <span className={style.errorMessage}>{error}</span> : resetContent}\n </div>\n );\n }\n}\n\nexport default DragAndDrop;\n"],"file":"index.js"}
1
+ {"version":3,"sources":["../../../src/atom/drag-and-drop/index.js"],"names":["React","PropTypes","NovaSolidStatusClose","Close","NovaSolidFilesBasicFileUpload2","FileUploadIcon","NovaSolidFilesBasicFileBlock2","FileUploadBlockedIcon","classnames","Loader","Button","getClassState","style","constantNull","DragAndDrop","Component","constructor","props","state","dragging","handleDragStart","bind","handleDragStop","setState","render","idBox","children","title","description","uploadLabel","previewLabel","previewContent","loading","modified","onReset","error","buttonAriaLabel","errorButtonLabel","disabled","previewView","type","preview","src","loaderWrapper","loadingCancel","closeIcon","loader","loaderText","resetContent","resetUploadWrapper","resetSrcLabel","label","buildButton","defaultButtonProps","icon","position","button","previewContainer","modifiedPreviewContainer","inputWrapper","modifiedInputWrapper","errorInputWrapper","wrapper","infosContainer","iconError","dragAndDropLabel","errorMessage","propTypes","string","shape","bool","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {uniqueId, constant, isEmpty} from 'lodash/fp';\nimport {\n NovaSolidStatusClose as Close,\n NovaSolidFilesBasicFileUpload2 as FileUploadIcon,\n NovaSolidFilesBasicFileBlock2 as FileUploadBlockedIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Loader from '../loader';\nimport Button from '../button-link';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst constantNull = constant(null);\n\nclass DragAndDrop extends React.Component {\n static propTypes = {\n title: PropTypes.string,\n description: PropTypes.string,\n uploadLabel: PropTypes.string,\n previewLabel: PropTypes.string,\n previewContent: PropTypes.shape({\n type: PropTypes.string,\n src: PropTypes.string,\n label: PropTypes.string\n }),\n loading: PropTypes.bool,\n modified: PropTypes.bool,\n disabled: PropTypes.bool,\n children: PropTypes.func,\n onReset: PropTypes.func,\n error: PropTypes.string,\n buttonAriaLabel: PropTypes.string,\n errorButtonLabel: PropTypes.string\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n dragging: false\n };\n\n this.handleDragStart = this.handleDragStart.bind(this);\n this.handleDragStop = this.handleDragStop.bind(this);\n }\n\n handleDragStart() {\n this.setState({\n dragging: true\n });\n }\n\n handleDragStop() {\n this.setState({\n dragging: false\n });\n }\n\n render() {\n const idBox = uniqueId('drop-box-');\n const {\n children = constantNull,\n title,\n description,\n uploadLabel,\n previewLabel = '',\n previewContent,\n loading = false,\n modified = false,\n onReset = null,\n error = '',\n buttonAriaLabel = '',\n errorButtonLabel = '',\n disabled = false\n } = this.props;\n const {dragging} = this.state;\n\n let previewView = null;\n\n if (previewContent && previewContent.type === 'image') {\n previewView = (\n <div className={style.preview}>\n <img src={previewContent.src} />\n </div>\n );\n } else if (previewContent && previewContent.type === 'video') {\n previewView = (\n <div className={style.preview}>\n <video controls src={previewContent.src} type=\"video/*\" />\n </div>\n );\n } else if (loading) {\n previewView = (\n <div className={style.loaderWrapper}>\n <div className={style.loadingCancel}>\n <Close\n data-name=\"reset-content-icon\"\n height={12}\n width={12}\n className={style.closeIcon}\n onClick={onReset}\n />\n </div>\n <div className={style.loader}>\n <Loader theme=\"coorpmanager\" />\n </div>\n <span className={style.loaderText}>Uploading</span>\n </div>\n );\n } else {\n previewView = <span>{previewLabel}</span>;\n }\n\n const resetContent =\n previewContent && previewContent.src ? (\n <div className={classnames(style.resetUploadWrapper, disabled && style.disabled)}>\n <div className={style.resetSrcLabel}>\n {previewContent.label ? previewContent.label : previewContent.src}\n </div>\n {onReset ? (\n <Close\n data-name=\"reset-content-icon\"\n height={12}\n width={12}\n className={style.closeIcon}\n onClick={onReset}\n />\n ) : null}\n </div>\n ) : null;\n\n const buildButton = () => {\n const defaultButtonProps = {\n label: uploadLabel,\n 'aria-label': buttonAriaLabel,\n 'data-name': 'default-button',\n icon: {\n position: 'left',\n type: 'folders'\n }\n };\n if (dragging) {\n return null;\n } else if (error) {\n return <Button {...defaultButtonProps} label={errorButtonLabel} icon={{}} />;\n } else {\n return <Button {...defaultButtonProps} />;\n }\n };\n\n const button = buildButton(dragging, error);\n\n const previewContainer = getClassState(\n style.previewContainer,\n style.modifiedPreviewContainer,\n null,\n modified,\n error\n );\n const inputWrapper = getClassState(\n style.inputWrapper,\n style.modifiedInputWrapper,\n style.errorInputWrapper,\n modified,\n error\n );\n\n return (\n <div className={style.wrapper} data-name=\"drag-and-drop-wrapper\">\n <div className={style.title}>{title}</div>\n {!isEmpty(previewContent) || loading ? (\n <div className={classnames(previewContainer, disabled && style.disabled)}>\n {previewView}\n </div>\n ) : (\n <div\n className={classnames(\n dragging ? style.dragging : inputWrapper,\n disabled && style.disabled\n )}\n id={idBox}\n >\n <div className={style.infosContainer}>\n {error ? (\n <FileUploadBlockedIcon className={style.iconError} />\n ) : (\n <FileUploadIcon className={style.icon} />\n )}\n {description ? <div className={style.description}>{description}</div> : null}\n {error ? null : <div className={style.dragAndDropLabel}>{'Drag & Drop here'}</div>}\n </div>\n {button}\n <div>{children(this.handleDragStart, this.handleDragStop)}</div>\n </div>\n )}\n {error ? (\n <span className={classnames(style.errorMessage, disabled && style.disabled)}>\n {error}\n </span>\n ) : (\n resetContent\n )}\n </div>\n );\n }\n}\n\nexport default DragAndDrop;\n"],"file":"index.js"}
@@ -24,6 +24,11 @@
24
24
  width: 100%;
25
25
  }
26
26
 
27
+ .disabled {
28
+ opacity: 0.5;
29
+ cursor: not-allowed;
30
+ }
31
+
27
32
  .title {
28
33
  font-size: 16px;
29
34
  font-weight: 700;
@@ -0,0 +1,12 @@
1
+ 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); }
2
+
3
+ import withImageReset from './with-image-reset';
4
+ const {
5
+ props
6
+ } = withImageReset;
7
+ export default {
8
+ props: _extends(_extends({}, props), {}, {
9
+ disabled: true
10
+ })
11
+ };
12
+ //# sourceMappingURL=disabled-with-image-reset.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/disabled-with-image-reset.js"],"names":["withImageReset","props","disabled"],"mappings":";;AAAA,OAAOA,cAAP,MAA2B,oBAA3B;AAEA,MAAM;AAACC,EAAAA;AAAD,IAAUD,cAAhB;AAEA,eAAe;AACbC,EAAAA,KAAK,wBACAA,KADA;AAEHC,IAAAA,QAAQ,EAAE;AAFP;AADQ,CAAf","sourcesContent":["import withImageReset from './with-image-reset';\n\nconst {props} = withImageReset;\n\nexport default {\n props: {\n ...props,\n disabled: true\n }\n};\n"],"file":"disabled-with-image-reset.js"}
@@ -0,0 +1,12 @@
1
+ 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); }
2
+
3
+ import defaultProps from './default';
4
+ const {
5
+ props
6
+ } = defaultProps;
7
+ export default {
8
+ props: _extends(_extends({}, props), {}, {
9
+ disabled: true
10
+ })
11
+ };
12
+ //# sourceMappingURL=disabled.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../../src/atom/drag-and-drop/test/fixtures/disabled.js"],"names":["defaultProps","props","disabled"],"mappings":";;AAAA,OAAOA,YAAP,MAAyB,WAAzB;AAEA,MAAM;AAACC,EAAAA;AAAD,IAAUD,YAAhB;AAEA,eAAe;AACbC,EAAAA,KAAK,wBACAA,KADA;AAEHC,IAAAA,QAAQ,EAAE;AAFP;AADQ,CAAf","sourcesContent":["import defaultProps from './default';\n\nconst {props} = defaultProps;\n\nexport default {\n props: {\n ...props,\n disabled: true\n }\n};\n"],"file":"disabled.js"}
@@ -4,6 +4,8 @@ import renderComponentMacro from '../../../test/helpers/render-component';
4
4
  import AtomDragAndDrop from '..';
5
5
  import fixtureCleanAndModified from './fixtures/clean-and-modified';
6
6
  import fixtureDefault from './fixtures/default';
7
+ import fixtureDisabledWithImageReset from './fixtures/disabled-with-image-reset';
8
+ import fixtureDisabled from './fixtures/disabled';
7
9
  import fixtureError from './fixtures/error';
8
10
  import fixtureLoading from './fixtures/loading';
9
11
  import fixtureModified from './fixtures/modified';
@@ -20,6 +22,8 @@ test('Atom › AtomDragAndDrop > should have valid propTypes', t => {
20
22
  });
21
23
  test('Atom › AtomDragAndDrop › CleanAndModified › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureCleanAndModified);
22
24
  test('Atom › AtomDragAndDrop › Default › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDefault);
25
+ test('Atom › AtomDragAndDrop › DisabledWithImageReset › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDisabledWithImageReset);
26
+ test('Atom › AtomDragAndDrop › Disabled › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDisabled);
23
27
  test('Atom › AtomDragAndDrop › Error › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureError);
24
28
  test('Atom › AtomDragAndDrop › Loading › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureLoading);
25
29
  test('Atom › AtomDragAndDrop › Modified › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureModified);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/atom/drag-and-drop/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","AtomDragAndDrop","fixtureCleanAndModified","fixtureDefault","fixtureError","fixtureLoading","fixtureModified","fixtureWithChildren","fixtureWithImageReset","fixtureWithImage","fixtureWithLongDescription","fixtureWithVideo","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,eAAP,MAA4B,IAA5B;AACA,OAAOC,uBAAP,MAAoC,+BAApC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AACA,OAAOC,mBAAP,MAAgC,0BAAhC;AACA,OAAOC,qBAAP,MAAkC,6BAAlC;AACA,OAAOC,gBAAP,MAA6B,uBAA7B;AACA,OAAOC,0BAAP,MAAuC,kCAAvC;AACA,OAAOC,gBAAP,MAA6B,uBAA7B;AAEAb,IAAI,CAAC,sDAAD,EAAyDc,CAAC,IAAI;AAChEA,EAAAA,CAAC,CAACC,IAAF;AACAd,EAAAA,OAAO,CAACE,eAAe,CAACa,SAAjB,EAA4B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,gDAA+CF,GAAI,mEAA5E;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAlB,IAAI,CAAC,gEAAD,EAAmEE,oBAAnE,EAAyFC,eAAzF,EAA0GC,uBAA1G,CAAJ;AACAJ,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGE,cAAjG,CAAJ;AACAL,IAAI,CAAC,qDAAD,EAAwDE,oBAAxD,EAA8EC,eAA9E,EAA+FG,YAA/F,CAAJ;AACAN,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGI,cAAjG,CAAJ;AACAP,IAAI,CAAC,wDAAD,EAA2DE,oBAA3D,EAAiFC,eAAjF,EAAkGK,eAAlG,CAAJ;AACAR,IAAI,CAAC,4DAAD,EAA+DE,oBAA/D,EAAqFC,eAArF,EAAsGM,mBAAtG,CAAJ;AACAT,IAAI,CAAC,8DAAD,EAAiEE,oBAAjE,EAAuFC,eAAvF,EAAwGO,qBAAxG,CAAJ;AACAV,IAAI,CAAC,yDAAD,EAA4DE,oBAA5D,EAAkFC,eAAlF,EAAmGQ,gBAAnG,CAAJ;AACAX,IAAI,CAAC,mEAAD,EAAsEE,oBAAtE,EAA4FC,eAA5F,EAA6GS,0BAA7G,CAAJ;AACAZ,IAAI,CAAC,yDAAD,EAA4DE,oBAA5D,EAAkFC,eAAlF,EAAmGU,gBAAnG,CAAJ","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"}
1
+ {"version":3,"sources":["../../../../src/atom/drag-and-drop/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","AtomDragAndDrop","fixtureCleanAndModified","fixtureDefault","fixtureDisabledWithImageReset","fixtureDisabled","fixtureError","fixtureLoading","fixtureModified","fixtureWithChildren","fixtureWithImageReset","fixtureWithImage","fixtureWithLongDescription","fixtureWithVideo","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,eAAP,MAA4B,IAA5B;AACA,OAAOC,uBAAP,MAAoC,+BAApC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,6BAAP,MAA0C,sCAA1C;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AACA,OAAOC,mBAAP,MAAgC,0BAAhC;AACA,OAAOC,qBAAP,MAAkC,6BAAlC;AACA,OAAOC,gBAAP,MAA6B,uBAA7B;AACA,OAAOC,0BAAP,MAAuC,kCAAvC;AACA,OAAOC,gBAAP,MAA6B,uBAA7B;AAEAf,IAAI,CAAC,sDAAD,EAAyDgB,CAAC,IAAI;AAChEA,EAAAA,CAAC,CAACC,IAAF;AACAhB,EAAAA,OAAO,CAACE,eAAe,CAACe,SAAjB,EAA4B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,gDAA+CF,GAAI,mEAA5E;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOApB,IAAI,CAAC,gEAAD,EAAmEE,oBAAnE,EAAyFC,eAAzF,EAA0GC,uBAA1G,CAAJ;AACAJ,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGE,cAAjG,CAAJ;AACAL,IAAI,CAAC,sEAAD,EAAyEE,oBAAzE,EAA+FC,eAA/F,EAAgHG,6BAAhH,CAAJ;AACAN,IAAI,CAAC,wDAAD,EAA2DE,oBAA3D,EAAiFC,eAAjF,EAAkGI,eAAlG,CAAJ;AACAP,IAAI,CAAC,qDAAD,EAAwDE,oBAAxD,EAA8EC,eAA9E,EAA+FK,YAA/F,CAAJ;AACAR,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGM,cAAjG,CAAJ;AACAT,IAAI,CAAC,wDAAD,EAA2DE,oBAA3D,EAAiFC,eAAjF,EAAkGO,eAAlG,CAAJ;AACAV,IAAI,CAAC,4DAAD,EAA+DE,oBAA/D,EAAqFC,eAArF,EAAsGQ,mBAAtG,CAAJ;AACAX,IAAI,CAAC,8DAAD,EAAiEE,oBAAjE,EAAuFC,eAAvF,EAAwGS,qBAAxG,CAAJ;AACAZ,IAAI,CAAC,yDAAD,EAA4DE,oBAA5D,EAAkFC,eAAlF,EAAmGU,gBAAnG,CAAJ;AACAb,IAAI,CAAC,mEAAD,EAAsEE,oBAAtE,EAA4FC,eAA5F,EAA6GW,0BAA7G,CAAJ;AACAd,IAAI,CAAC,yDAAD,EAA4DE,oBAA5D,EAAkFC,eAAlF,EAAmGY,gBAAnG,CAAJ","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 fixtureDisabledWithImageReset from './fixtures/disabled-with-image-reset';\nimport fixtureDisabled from './fixtures/disabled';\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 › DisabledWithImageReset › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDisabledWithImageReset);\ntest('Atom › AtomDragAndDrop › Disabled › should be rendered', renderComponentMacro, AtomDragAndDrop, fixtureDisabled);\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"}
@@ -19,6 +19,7 @@ const ImageUpload = ({
19
19
  uploadLabel,
20
20
  loading,
21
21
  modified,
22
+ disabled = false,
22
23
  onChange,
23
24
  onReset = null,
24
25
  name,
@@ -46,13 +47,14 @@ const ImageUpload = ({
46
47
  modified: modified,
47
48
  onReset: handleReset,
48
49
  error: error,
50
+ disabled: disabled,
49
51
  buttonAriaLabel: buttonAriaLabel,
50
52
  errorButtonLabel: errorButtonLabel
51
53
  }, (onDragStart, onDragStop) => /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
52
54
  type: "file",
53
55
  name: name,
54
56
  accept: acceptedImages,
55
- disabled: loading,
57
+ disabled: loading || disabled,
56
58
  className: style.input,
57
59
  onChange: onChange,
58
60
  onDragEnter: onDragStart,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/atom/image-upload/index.js"],"names":["React","useCallback","PropTypes","DragAndDrop","ImagePropType","style","ImageUpload","title","description","previewLabel","previewContent","uploadLabel","loading","modified","onChange","onReset","name","imageTypes","error","buttonAriaLabel","errorButtonLabel","handleReset","e","preventDefault","acceptedImages","t","onDragStart","onDragStop","input","propTypes","string","func","arrayOf"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,IAAeC,WAAf,QAAiC,OAAjC;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,WAAP,MAAwB,kBAAxB;AACA,SAAQC,aAAR,QAA4B,sBAA5B;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,WAAW,GAAG,CAAC;AACnBC,EAAAA,KADmB;AAEnBC,EAAAA,WAFmB;AAGnBC,EAAAA,YAHmB;AAInBC,EAAAA,cAJmB;AAKnBC,EAAAA,WALmB;AAMnBC,EAAAA,OANmB;AAOnBC,EAAAA,QAPmB;AAQnBC,EAAAA,QARmB;AASnBC,EAAAA,OAAO,GAAG,IATS;AAUnBC,EAAAA,IAVmB;AAWnB;AACAC,EAAAA,UAAU,GAAG,CAAC,GAAD,CAZM;AAanBC,EAAAA,KAAK,GAAG,EAbW;AAcnBC,EAAAA,eAdmB;AAenBC,EAAAA;AAfmB,CAAD,KAgBd;AACJ,QAAMC,WAAW,GAAGpB,WAAW,CAC7BqB,CAAC,IAAI;AACH,QAAI,OAAMP,OAAN,CAAJ,EAAoB;AACpBO,IAAAA,CAAC,CAACC,cAAF;AACA,WAAOR,OAAO,CAACO,CAAD,CAAd;AACD,GAL4B,EAM7B,CAACP,OAAD,CAN6B,CAA/B;;AASA,QAAMS,cAAc,GAAG,MACrB,KAAIC,CAAC,IAAK,SAAQA,CAAE,EAApB,CADqB,EAErB,MAAK,GAAL,CAFqB,EAGrBR,UAHqB,CAAvB;;AAKA,sBACE,oBAAC,WAAD;AACE,IAAA,KAAK,EAAEV,KADT;AAEE,IAAA,WAAW,EAAEC,WAFf;AAGE,IAAA,YAAY,EAAEC,YAHhB;AAIE,IAAA,cAAc,EAAEC,cAJlB;AAKE,IAAA,WAAW,EAAEC,WALf;AAME,IAAA,OAAO,EAAEC,OANX;AAOE,IAAA,QAAQ,EAAEC,QAPZ;AAQE,IAAA,OAAO,EAAEQ,WARX;AASE,IAAA,KAAK,EAAEH,KATT;AAUE,IAAA,eAAe,EAAEC,eAVnB;AAWE,IAAA,gBAAgB,EAAEC;AAXpB,KAaG,CAACM,WAAD,EAAcC,UAAd,kBACC,8CACE;AACE,IAAA,IAAI,EAAC,MADP;AAEE,IAAA,IAAI,EAAEX,IAFR;AAGE,IAAA,MAAM,EAAEQ,cAHV;AAIE,IAAA,QAAQ,EAAEZ,OAJZ;AAKE,IAAA,SAAS,EAAEP,KAAK,CAACuB,KALnB;AAME,IAAA,QAAQ,EAAEd,QANZ;AAOE,IAAA,WAAW,EAAEY,WAPf;AAQE,IAAA,MAAM,EAAEC,UARV;AASE,IAAA,WAAW,EAAEA;AATf,IADF,CAdJ,CADF;AA+BD,CA9DD;;AAgEArB,WAAW,CAACuB,SAAZ,iEACK1B,WAAW,CAAC0B,SADjB;AAEEb,EAAAA,IAAI,EAAEd,SAAS,CAAC4B,MAFlB;AAGEhB,EAAAA,QAAQ,EAAEZ,SAAS,CAAC6B,IAHtB;AAIEhB,EAAAA,OAAO,EAAEb,SAAS,CAAC6B,IAJrB;AAKEd,EAAAA,UAAU,EAAEf,SAAS,CAAC8B,OAAV,CAAkB5B,aAAlB,CALd;AAMEc,EAAAA,KAAK,EAAEhB,SAAS,CAAC4B,MANnB;AAOEX,EAAAA,eAAe,EAAEjB,SAAS,CAAC4B,MAP7B;AAQEV,EAAAA,gBAAgB,EAAElB,SAAS,CAAC4B;AAR9B;AAWA,eAAexB,WAAf","sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {join, map, pipe, isNil} from 'lodash/fp';\nimport DragAndDrop from '../drag-and-drop';\nimport {ImagePropType} from '../../util/proptypes';\nimport style from './style.css';\n\nconst ImageUpload = ({\n title,\n description,\n previewLabel,\n previewContent,\n uploadLabel,\n loading,\n modified,\n onChange,\n onReset = null,\n name,\n // See ImagePropType for accepted values\n imageTypes = ['*'],\n error = '',\n buttonAriaLabel,\n errorButtonLabel\n}) => {\n const handleReset = useCallback(\n e => {\n if (isNil(onReset)) return;\n e.preventDefault();\n return onReset(e);\n },\n [onReset]\n );\n\n const acceptedImages = pipe(\n map(t => `image/${t}`),\n join(',')\n )(imageTypes);\n\n return (\n <DragAndDrop\n title={title}\n description={description}\n previewLabel={previewLabel}\n previewContent={previewContent}\n uploadLabel={uploadLabel}\n loading={loading}\n modified={modified}\n onReset={handleReset}\n error={error}\n buttonAriaLabel={buttonAriaLabel}\n errorButtonLabel={errorButtonLabel}\n >\n {(onDragStart, onDragStop) => (\n <div>\n <input\n type=\"file\"\n name={name}\n accept={acceptedImages}\n disabled={loading}\n className={style.input}\n onChange={onChange}\n onDragEnter={onDragStart}\n onDrop={onDragStop}\n onDragLeave={onDragStop}\n />\n </div>\n )}\n </DragAndDrop>\n );\n};\n\nImageUpload.propTypes = {\n ...DragAndDrop.propTypes,\n name: PropTypes.string,\n onChange: PropTypes.func,\n onReset: PropTypes.func,\n imageTypes: PropTypes.arrayOf(ImagePropType),\n error: PropTypes.string,\n buttonAriaLabel: PropTypes.string,\n errorButtonLabel: PropTypes.string\n};\n\nexport default ImageUpload;\n"],"file":"index.js"}
1
+ {"version":3,"sources":["../../../src/atom/image-upload/index.js"],"names":["React","useCallback","PropTypes","DragAndDrop","ImagePropType","style","ImageUpload","title","description","previewLabel","previewContent","uploadLabel","loading","modified","disabled","onChange","onReset","name","imageTypes","error","buttonAriaLabel","errorButtonLabel","handleReset","e","preventDefault","acceptedImages","t","onDragStart","onDragStop","input","propTypes","string","func","arrayOf"],"mappings":";;;;;;;AAAA,OAAOA,KAAP,IAAeC,WAAf,QAAiC,OAAjC;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,WAAP,MAAwB,kBAAxB;AACA,SAAQC,aAAR,QAA4B,sBAA5B;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,WAAW,GAAG,CAAC;AACnBC,EAAAA,KADmB;AAEnBC,EAAAA,WAFmB;AAGnBC,EAAAA,YAHmB;AAInBC,EAAAA,cAJmB;AAKnBC,EAAAA,WALmB;AAMnBC,EAAAA,OANmB;AAOnBC,EAAAA,QAPmB;AAQnBC,EAAAA,QAAQ,GAAG,KARQ;AASnBC,EAAAA,QATmB;AAUnBC,EAAAA,OAAO,GAAG,IAVS;AAWnBC,EAAAA,IAXmB;AAYnB;AACAC,EAAAA,UAAU,GAAG,CAAC,GAAD,CAbM;AAcnBC,EAAAA,KAAK,GAAG,EAdW;AAenBC,EAAAA,eAfmB;AAgBnBC,EAAAA;AAhBmB,CAAD,KAiBd;AACJ,QAAMC,WAAW,GAAGrB,WAAW,CAC7BsB,CAAC,IAAI;AACH,QAAI,OAAMP,OAAN,CAAJ,EAAoB;AACpBO,IAAAA,CAAC,CAACC,cAAF;AACA,WAAOR,OAAO,CAACO,CAAD,CAAd;AACD,GAL4B,EAM7B,CAACP,OAAD,CAN6B,CAA/B;;AASA,QAAMS,cAAc,GAAG,MACrB,KAAIC,CAAC,IAAK,SAAQA,CAAE,EAApB,CADqB,EAErB,MAAK,GAAL,CAFqB,EAGrBR,UAHqB,CAAvB;;AAKA,sBACE,oBAAC,WAAD;AACE,IAAA,KAAK,EAAEX,KADT;AAEE,IAAA,WAAW,EAAEC,WAFf;AAGE,IAAA,YAAY,EAAEC,YAHhB;AAIE,IAAA,cAAc,EAAEC,cAJlB;AAKE,IAAA,WAAW,EAAEC,WALf;AAME,IAAA,OAAO,EAAEC,OANX;AAOE,IAAA,QAAQ,EAAEC,QAPZ;AAQE,IAAA,OAAO,EAAES,WARX;AASE,IAAA,KAAK,EAAEH,KATT;AAUE,IAAA,QAAQ,EAAEL,QAVZ;AAWE,IAAA,eAAe,EAAEM,eAXnB;AAYE,IAAA,gBAAgB,EAAEC;AAZpB,KAcG,CAACM,WAAD,EAAcC,UAAd,kBACC,8CACE;AACE,IAAA,IAAI,EAAC,MADP;AAEE,IAAA,IAAI,EAAEX,IAFR;AAGE,IAAA,MAAM,EAAEQ,cAHV;AAIE,IAAA,QAAQ,EAAEb,OAAO,IAAIE,QAJvB;AAKE,IAAA,SAAS,EAAET,KAAK,CAACwB,KALnB;AAME,IAAA,QAAQ,EAAEd,QANZ;AAOE,IAAA,WAAW,EAAEY,WAPf;AAQE,IAAA,MAAM,EAAEC,UARV;AASE,IAAA,WAAW,EAAEA;AATf,IADF,CAfJ,CADF;AAgCD,CAhED;;AAkEAtB,WAAW,CAACwB,SAAZ,iEACK3B,WAAW,CAAC2B,SADjB;AAEEb,EAAAA,IAAI,EAAEf,SAAS,CAAC6B,MAFlB;AAGEhB,EAAAA,QAAQ,EAAEb,SAAS,CAAC8B,IAHtB;AAIEhB,EAAAA,OAAO,EAAEd,SAAS,CAAC8B,IAJrB;AAKEd,EAAAA,UAAU,EAAEhB,SAAS,CAAC+B,OAAV,CAAkB7B,aAAlB,CALd;AAMEe,EAAAA,KAAK,EAAEjB,SAAS,CAAC6B,MANnB;AAOEX,EAAAA,eAAe,EAAElB,SAAS,CAAC6B,MAP7B;AAQEV,EAAAA,gBAAgB,EAAEnB,SAAS,CAAC6B;AAR9B;AAWA,eAAezB,WAAf","sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {join, map, pipe, isNil} from 'lodash/fp';\nimport DragAndDrop from '../drag-and-drop';\nimport {ImagePropType} from '../../util/proptypes';\nimport style from './style.css';\n\nconst ImageUpload = ({\n title,\n description,\n previewLabel,\n previewContent,\n uploadLabel,\n loading,\n modified,\n disabled = false,\n onChange,\n onReset = null,\n name,\n // See ImagePropType for accepted values\n imageTypes = ['*'],\n error = '',\n buttonAriaLabel,\n errorButtonLabel\n}) => {\n const handleReset = useCallback(\n e => {\n if (isNil(onReset)) return;\n e.preventDefault();\n return onReset(e);\n },\n [onReset]\n );\n\n const acceptedImages = pipe(\n map(t => `image/${t}`),\n join(',')\n )(imageTypes);\n\n return (\n <DragAndDrop\n title={title}\n description={description}\n previewLabel={previewLabel}\n previewContent={previewContent}\n uploadLabel={uploadLabel}\n loading={loading}\n modified={modified}\n onReset={handleReset}\n error={error}\n disabled={disabled}\n buttonAriaLabel={buttonAriaLabel}\n errorButtonLabel={errorButtonLabel}\n >\n {(onDragStart, onDragStop) => (\n <div>\n <input\n type=\"file\"\n name={name}\n accept={acceptedImages}\n disabled={loading || disabled}\n className={style.input}\n onChange={onChange}\n onDragEnter={onDragStart}\n onDrop={onDragStop}\n onDragLeave={onDragStop}\n />\n </div>\n )}\n </DragAndDrop>\n );\n};\n\nImageUpload.propTypes = {\n ...DragAndDrop.propTypes,\n name: PropTypes.string,\n onChange: PropTypes.func,\n onReset: PropTypes.func,\n imageTypes: PropTypes.arrayOf(ImagePropType),\n error: PropTypes.string,\n buttonAriaLabel: PropTypes.string,\n errorButtonLabel: PropTypes.string\n};\n\nexport default ImageUpload;\n"],"file":"index.js"}
@@ -0,0 +1,12 @@
1
+ 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); }
2
+
3
+ import defaultProps from './default';
4
+ const {
5
+ props
6
+ } = defaultProps;
7
+ export default {
8
+ props: _extends(_extends({}, props), {}, {
9
+ disabled: true
10
+ })
11
+ };
12
+ //# sourceMappingURL=disabled.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../../src/atom/image-upload/test/fixtures/disabled.js"],"names":["defaultProps","props","disabled"],"mappings":";;AAAA,OAAOA,YAAP,MAAyB,WAAzB;AAEA,MAAM;AAACC,EAAAA;AAAD,IAAUD,YAAhB;AAEA,eAAe;AACbC,EAAAA,KAAK,wBAAMA,KAAN;AAAaC,IAAAA,QAAQ,EAAE;AAAvB;AADQ,CAAf","sourcesContent":["import defaultProps from './default';\n\nconst {props} = defaultProps;\n\nexport default {\n props: {...props, disabled: true}\n};\n"],"file":"disabled.js"}
@@ -9,6 +9,7 @@ import fixtureDesktopResetDescriptionOnlyPng from './fixtures/desktop-reset-desc
9
9
  import fixtureDesktopResetDescription from './fixtures/desktop-reset-description';
10
10
  import fixtureDesktopResetNoDescription from './fixtures/desktop-reset-no-description';
11
11
  import fixtureDesktop from './fixtures/desktop';
12
+ import fixtureDisabled from './fixtures/disabled';
12
13
  import fixtureEmail from './fixtures/email';
13
14
  import fixtureMobile from './fixtures/mobile';
14
15
  import fixtureModified from './fixtures/modified';
@@ -25,6 +26,7 @@ test('Atom › AtomImageUpload › DesktopResetDescriptionOnlyPng › should be
25
26
  test('Atom › AtomImageUpload › DesktopResetDescription › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescription);
26
27
  test('Atom › AtomImageUpload › DesktopResetNoDescription › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetNoDescription);
27
28
  test('Atom › AtomImageUpload › Desktop › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktop);
29
+ test('Atom › AtomImageUpload › Disabled › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDisabled);
28
30
  test('Atom › AtomImageUpload › Email › should be rendered', renderComponentMacro, AtomImageUpload, fixtureEmail);
29
31
  test('Atom › AtomImageUpload › Mobile › should be rendered', renderComponentMacro, AtomImageUpload, fixtureMobile);
30
32
  test('Atom › AtomImageUpload › Modified › should be rendered', renderComponentMacro, AtomImageUpload, fixtureModified);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/atom/image-upload/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","AtomImageUpload","fixtureCleanModified","fixtureDefault","fixtureDesktopResetDescriptionMultiple","fixtureDesktopResetDescriptionOnlyPng","fixtureDesktopResetDescription","fixtureDesktopResetNoDescription","fixtureDesktop","fixtureEmail","fixtureMobile","fixtureModified","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,eAAP,MAA4B,IAA5B;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,sCAAP,MAAmD,+CAAnD;AACA,OAAOC,qCAAP,MAAkD,+CAAlD;AACA,OAAOC,8BAAP,MAA2C,sCAA3C;AACA,OAAOC,gCAAP,MAA6C,yCAA7C;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AAEAb,IAAI,CAAC,sDAAD,EAAyDc,CAAC,IAAI;AAChEA,EAAAA,CAAC,CAACC,IAAF;AACAd,EAAAA,OAAO,CAACE,eAAe,CAACa,SAAjB,EAA4B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,gDAA+CF,GAAI,mEAA5E;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAlB,IAAI,CAAC,6DAAD,EAAgEE,oBAAhE,EAAsFC,eAAtF,EAAuGC,oBAAvG,CAAJ;AACAJ,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGE,cAAjG,CAAJ;AACAL,IAAI,CAAC,+EAAD,EAAkFE,oBAAlF,EAAwGC,eAAxG,EAAyHG,sCAAzH,CAAJ;AACAN,IAAI,CAAC,8EAAD,EAAiFE,oBAAjF,EAAuGC,eAAvG,EAAwHI,qCAAxH,CAAJ;AACAP,IAAI,CAAC,uEAAD,EAA0EE,oBAA1E,EAAgGC,eAAhG,EAAiHK,8BAAjH,CAAJ;AACAR,IAAI,CAAC,yEAAD,EAA4EE,oBAA5E,EAAkGC,eAAlG,EAAmHM,gCAAnH,CAAJ;AACAT,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGO,cAAjG,CAAJ;AACAV,IAAI,CAAC,qDAAD,EAAwDE,oBAAxD,EAA8EC,eAA9E,EAA+FQ,YAA/F,CAAJ;AACAX,IAAI,CAAC,sDAAD,EAAyDE,oBAAzD,EAA+EC,eAA/E,EAAgGS,aAAhG,CAAJ;AACAZ,IAAI,CAAC,wDAAD,EAA2DE,oBAA3D,EAAiFC,eAAjF,EAAkGU,eAAlG,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomImageUpload from '..';\nimport fixtureCleanModified from './fixtures/clean-modified';\nimport fixtureDefault from './fixtures/default';\nimport fixtureDesktopResetDescriptionMultiple from './fixtures/desktop-reset-description-multiple';\nimport fixtureDesktopResetDescriptionOnlyPng from './fixtures/desktop-reset-description-only-png';\nimport fixtureDesktopResetDescription from './fixtures/desktop-reset-description';\nimport fixtureDesktopResetNoDescription from './fixtures/desktop-reset-no-description';\nimport fixtureDesktop from './fixtures/desktop';\nimport fixtureEmail from './fixtures/email';\nimport fixtureMobile from './fixtures/mobile';\nimport fixtureModified from './fixtures/modified';\n\ntest('Atom › AtomImageUpload > should have valid propTypes', t => {\n t.pass();\n forEach(AtomImageUpload.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Atom.AtomImageUpload.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Atom › AtomImageUpload › CleanModified › should be rendered', renderComponentMacro, AtomImageUpload, fixtureCleanModified);\ntest('Atom › AtomImageUpload › Default › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDefault);\ntest('Atom › AtomImageUpload › DesktopResetDescriptionMultiple › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescriptionMultiple);\ntest('Atom › AtomImageUpload › DesktopResetDescriptionOnlyPng › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescriptionOnlyPng);\ntest('Atom › AtomImageUpload › DesktopResetDescription › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescription);\ntest('Atom › AtomImageUpload › DesktopResetNoDescription › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetNoDescription);\ntest('Atom › AtomImageUpload › Desktop › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktop);\ntest('Atom › AtomImageUpload › Email › should be rendered', renderComponentMacro, AtomImageUpload, fixtureEmail);\ntest('Atom › AtomImageUpload › Mobile › should be rendered', renderComponentMacro, AtomImageUpload, fixtureMobile);\ntest('Atom › AtomImageUpload › Modified › should be rendered', renderComponentMacro, AtomImageUpload, fixtureModified);\n"],"file":"fixtures.js"}
1
+ {"version":3,"sources":["../../../../src/atom/image-upload/test/fixtures.js"],"names":["test","forEach","renderComponentMacro","AtomImageUpload","fixtureCleanModified","fixtureDefault","fixtureDesktopResetDescriptionMultiple","fixtureDesktopResetDescriptionOnlyPng","fixtureDesktopResetDescription","fixtureDesktopResetNoDescription","fixtureDesktop","fixtureDisabled","fixtureEmail","fixtureMobile","fixtureModified","t","pass","propTypes","value","key","not","undefined"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,KAAjB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,oBAAP,MAAiC,wCAAjC;AACA,OAAOC,eAAP,MAA4B,IAA5B;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,sCAAP,MAAmD,+CAAnD;AACA,OAAOC,qCAAP,MAAkD,+CAAlD;AACA,OAAOC,8BAAP,MAA2C,sCAA3C;AACA,OAAOC,gCAAP,MAA6C,yCAA7C;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,eAAP,MAA4B,qBAA5B;AAEAd,IAAI,CAAC,sDAAD,EAAyDe,CAAC,IAAI;AAChEA,EAAAA,CAAC,CAACC,IAAF;AACAf,EAAAA,OAAO,CAACE,eAAe,CAACc,SAAjB,EAA4B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjDJ,IAAAA,CAAC,CAACK,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,gDAA+CF,GAAI,mEAA5E;AACD,GAFM,CAAP;AAGD,CALG,CAAJ;AAOAnB,IAAI,CAAC,6DAAD,EAAgEE,oBAAhE,EAAsFC,eAAtF,EAAuGC,oBAAvG,CAAJ;AACAJ,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGE,cAAjG,CAAJ;AACAL,IAAI,CAAC,+EAAD,EAAkFE,oBAAlF,EAAwGC,eAAxG,EAAyHG,sCAAzH,CAAJ;AACAN,IAAI,CAAC,8EAAD,EAAiFE,oBAAjF,EAAuGC,eAAvG,EAAwHI,qCAAxH,CAAJ;AACAP,IAAI,CAAC,uEAAD,EAA0EE,oBAA1E,EAAgGC,eAAhG,EAAiHK,8BAAjH,CAAJ;AACAR,IAAI,CAAC,yEAAD,EAA4EE,oBAA5E,EAAkGC,eAAlG,EAAmHM,gCAAnH,CAAJ;AACAT,IAAI,CAAC,uDAAD,EAA0DE,oBAA1D,EAAgFC,eAAhF,EAAiGO,cAAjG,CAAJ;AACAV,IAAI,CAAC,wDAAD,EAA2DE,oBAA3D,EAAiFC,eAAjF,EAAkGQ,eAAlG,CAAJ;AACAX,IAAI,CAAC,qDAAD,EAAwDE,oBAAxD,EAA8EC,eAA9E,EAA+FS,YAA/F,CAAJ;AACAZ,IAAI,CAAC,sDAAD,EAAyDE,oBAAzD,EAA+EC,eAA/E,EAAgGU,aAAhG,CAAJ;AACAb,IAAI,CAAC,wDAAD,EAA2DE,oBAA3D,EAAiFC,eAAjF,EAAkGW,eAAlG,CAAJ","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomImageUpload from '..';\nimport fixtureCleanModified from './fixtures/clean-modified';\nimport fixtureDefault from './fixtures/default';\nimport fixtureDesktopResetDescriptionMultiple from './fixtures/desktop-reset-description-multiple';\nimport fixtureDesktopResetDescriptionOnlyPng from './fixtures/desktop-reset-description-only-png';\nimport fixtureDesktopResetDescription from './fixtures/desktop-reset-description';\nimport fixtureDesktopResetNoDescription from './fixtures/desktop-reset-no-description';\nimport fixtureDesktop from './fixtures/desktop';\nimport fixtureDisabled from './fixtures/disabled';\nimport fixtureEmail from './fixtures/email';\nimport fixtureMobile from './fixtures/mobile';\nimport fixtureModified from './fixtures/modified';\n\ntest('Atom › AtomImageUpload > should have valid propTypes', t => {\n t.pass();\n forEach(AtomImageUpload.propTypes, (value, key) => {\n t.not(value, undefined, `PropType for \"Atom.AtomImageUpload.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n });\n});\n\ntest('Atom › AtomImageUpload › CleanModified › should be rendered', renderComponentMacro, AtomImageUpload, fixtureCleanModified);\ntest('Atom › AtomImageUpload › Default › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDefault);\ntest('Atom › AtomImageUpload › DesktopResetDescriptionMultiple › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescriptionMultiple);\ntest('Atom › AtomImageUpload › DesktopResetDescriptionOnlyPng › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescriptionOnlyPng);\ntest('Atom › AtomImageUpload › DesktopResetDescription › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetDescription);\ntest('Atom › AtomImageUpload › DesktopResetNoDescription › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktopResetNoDescription);\ntest('Atom › AtomImageUpload › Desktop › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDesktop);\ntest('Atom › AtomImageUpload › Disabled › should be rendered', renderComponentMacro, AtomImageUpload, fixtureDisabled);\ntest('Atom › AtomImageUpload › Email › should be rendered', renderComponentMacro, AtomImageUpload, fixtureEmail);\ntest('Atom › AtomImageUpload › Mobile › should be rendered', renderComponentMacro, AtomImageUpload, fixtureMobile);\ntest('Atom › AtomImageUpload › Modified › should be rendered', renderComponentMacro, AtomImageUpload, fixtureModified);\n"],"file":"fixtures.js"}
@@ -7,8 +7,16 @@ import lottie from 'lottie-web';
7
7
  import get from 'lodash/fp/get';
8
8
  import has from 'lodash/fp/has';
9
9
  import includes from 'lodash/fp/includes';
10
+ import keys from 'lodash/fp/keys';
11
+ import omit from 'lodash/fp/omit';
10
12
  import unfetch from 'isomorphic-unfetch';
11
13
  import style from './style.css';
14
+ export const ANIMATION_CONTROL = {
15
+ play: 'play',
16
+ pause: 'pause',
17
+ stop: 'stop',
18
+ loading: 'loading'
19
+ };
12
20
 
13
21
  const isIE11 = () => {
14
22
  if (typeof window === 'undefined') return;
@@ -19,7 +27,7 @@ const isIE11 = () => {
19
27
  return hasMsCrypto || hasRevision && hasTrident;
20
28
  };
21
29
 
22
- export const fetchAndLoadAnimation = async (animationSrc, containerRef, loop, animationClassnames, hideOnTransparent, _lottie, _fetch) => {
30
+ export const fetchAndLoadAnimation = async (_lottie, _fetch, animationSrc, containerRef, loop, animationClassnames, hideOnTransparent, autoplay) => {
23
31
  const animationUrl = new URL(animationSrc).toString();
24
32
  const fetchResult = await _fetch(animationUrl, {
25
33
  headers: {
@@ -33,7 +41,7 @@ export const fetchAndLoadAnimation = async (animationSrc, containerRef, loop, an
33
41
  container: containerRef.current,
34
42
  // the dom element that will contain the animation
35
43
  renderer: 'svg',
36
- autoplay: true,
44
+ autoplay,
37
45
  loop,
38
46
  animationData,
39
47
  rendererSettings: {
@@ -58,29 +66,44 @@ const LottieWrapper = props => {
58
66
  width,
59
67
  height,
60
68
  ie11ImageBackup,
61
- backupImageClassName
69
+ backupImageClassName,
70
+ autoplay = true,
71
+ animationControl
62
72
  } = props;
63
73
  const {
64
74
  className: animationClassName,
65
75
  hideOnTransparent = true
66
76
  } = rendererSettings;
67
- const containerRef = useRef(null);
77
+ const containerRef = useRef(null); // lottie's animation instance
78
+
68
79
  const [animationItem, setAnimationItem] = useState(null);
80
+ const [isAnimationVisible, setIsAnimationVisible] = useState(autoplay);
69
81
 
70
82
  const _isIE11 = useMemo(() => isIE11(), []);
71
83
 
72
84
  const wrapperClassName = useMemo(() => classnames(className, style.lottieContainer), [className]);
73
85
  const lottieAnimationClassName = useMemo(() => classnames(animationClassName, style.animation), [animationClassName]);
74
86
  const ie11BackupImageClassName = useMemo(() => classnames(backupImageClassName, style.backupImage), [backupImageClassName]);
87
+ useEffect(() => {
88
+ // enzyme does not handle well the state update after an async useEffect in tests
89
+ // to remove when the migration towards @testing-library/react is done
90
+
91
+ /* istanbul ignore next */
92
+ if (animationItem && includes(animationControl, keys(omit('loading', ANIMATION_CONTROL))) && !autoplay) {
93
+ setIsAnimationVisible(true);
94
+ animationItem[animationControl]();
95
+ if (animationControl === ANIMATION_CONTROL.stop) setIsAnimationVisible(false);
96
+ }
97
+ }, [animationControl, animationItem, autoplay]);
75
98
  useEffect(() => {
76
99
  const loadAnimation = async () => {
77
100
  if (!_isIE11 && !animationItem) {
78
- /* istanbul ignore next */
101
+ /* istanbul ignore else */
79
102
  if (typeof window !== 'undefined') {
80
103
  window.lottie = lottie;
81
104
  }
82
105
 
83
- const animation = await fetchAndLoadAnimation(animationSrc, containerRef, loop, lottieAnimationClassName, hideOnTransparent, lottie, unfetch);
106
+ const animation = await fetchAndLoadAnimation(lottie, unfetch, animationSrc, containerRef, loop, lottieAnimationClassName, hideOnTransparent, autoplay);
84
107
  /* istanbul ignore next */
85
108
 
86
109
  setAnimationItem(animation);
@@ -91,18 +114,21 @@ const LottieWrapper = props => {
91
114
  return () => animationItem &&
92
115
  /* istanbul ignore next */
93
116
  lottie.destroy(animationItem.name);
94
- }, [lottieAnimationClassName, containerRef, hideOnTransparent, loop, animationSrc, _isIE11, animationItem]);
117
+ }, [lottieAnimationClassName, containerRef, hideOnTransparent, loop, animationSrc, _isIE11, animationItem, autoplay]);
95
118
  return /*#__PURE__*/React.createElement("div", {
96
119
  ref: containerRef,
97
120
  "aria-label": ariaLabel,
98
121
  "data-name": dataName,
99
122
  className: wrapperClassName,
100
- style: _extends(_extends({}, width && {
123
+ style: _extends(_extends(_extends({}, width && {
101
124
  width: `${width}px`,
102
125
  maxWidth: `${width}px`
103
126
  }), height && {
104
127
  height: `${height}px`,
105
128
  maxHeight: `${height}px`
129
+ }), {}, {
130
+ opacity: isAnimationVisible ? 1 : 0,
131
+ transition: 'opacity 0.25s ease-in'
106
132
  })
107
133
  }, _isIE11 ? /*#__PURE__*/React.createElement("img", {
108
134
  src: ie11ImageBackup,
@@ -124,7 +150,9 @@ LottieWrapper.propTypes = process.env.NODE_ENV !== "production" ? {
124
150
  width: PropTypes.number,
125
151
  className: PropTypes.string,
126
152
  ie11ImageBackup: PropTypes.string.isRequired,
127
- backupImageClassName: PropTypes.string
153
+ backupImageClassName: PropTypes.string,
154
+ autoplay: PropTypes.bool,
155
+ animationControl: PropTypes.oneOf(keys(ANIMATION_CONTROL))
128
156
  } : {};
129
157
  export default LottieWrapper;
130
158
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/atom/lottie-wrapper/index.js"],"names":["React","useMemo","useRef","useEffect","useState","PropTypes","classnames","lottie","get","has","includes","unfetch","style","isIE11","window","userAgent","hasMsCrypto","hasRevision","hasTrident","fetchAndLoadAnimation","animationSrc","containerRef","loop","animationClassnames","hideOnTransparent","_lottie","_fetch","animationUrl","URL","toString","fetchResult","headers","animationData","json","animation","loadAnimation","container","current","renderer","autoplay","rendererSettings","className","preserveAspectRatio","LottieWrapper","props","dataName","ariaLabel","width","height","ie11ImageBackup","backupImageClassName","animationClassName","animationItem","setAnimationItem","_isIE11","wrapperClassName","lottieContainer","lottieAnimationClassName","ie11BackupImageClassName","backupImage","destroy","name","maxWidth","maxHeight","propTypes","string","isRequired","bool","shape","number"],"mappings":"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","sourcesContent":["import React, {useMemo, useRef, useEffect, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport lottie from 'lottie-web';\nimport get from 'lodash/fp/get';\nimport has from 'lodash/fp/has';\nimport includes from 'lodash/fp/includes';\nimport unfetch from 'isomorphic-unfetch';\nimport style from './style.css';\n\nconst isIE11 = () => {\n if (typeof window === 'undefined') return;\n const userAgent = get('navigator.userAgent', window);\n const hasMsCrypto = has('msCrypto', window);\n const hasRevision = includes('rv:', userAgent);\n const hasTrident = includes('Trident/', userAgent);\n\n return hasMsCrypto || (hasRevision && hasTrident);\n};\n\nexport const fetchAndLoadAnimation = async (\n animationSrc,\n containerRef,\n loop,\n animationClassnames,\n hideOnTransparent,\n _lottie,\n _fetch\n) => {\n const animationUrl = new URL(animationSrc).toString();\n const fetchResult = await _fetch(animationUrl, {\n headers: {\n 'X-Requested-With': 'XMLHttpRequest',\n 'Content-Type': 'application/json'\n }\n });\n\n const animationData = await fetchResult.json();\n\n const animation = _lottie.loadAnimation({\n container: containerRef.current, // the dom element that will contain the animation\n renderer: 'svg',\n autoplay: true,\n loop,\n animationData,\n rendererSettings: {\n className: animationClassnames,\n hideOnTransparent,\n preserveAspectRatio: 'xMidYMid meet' // same options as a preserveAspectRatio prop\n }\n });\n return animation;\n};\n\nconst LottieWrapper = props => {\n const {\n className,\n 'data-name': dataName,\n 'aria-label': ariaLabel,\n animationSrc,\n loop = false,\n rendererSettings = {},\n width,\n height,\n ie11ImageBackup,\n backupImageClassName\n } = props;\n\n const {className: animationClassName, hideOnTransparent = true} = rendererSettings;\n\n const containerRef = useRef(null);\n\n const [animationItem, setAnimationItem] = useState(null);\n\n const _isIE11 = useMemo(() => isIE11(), []);\n\n const wrapperClassName = useMemo(() => classnames(className, style.lottieContainer), [className]);\n\n const lottieAnimationClassName = useMemo(() => classnames(animationClassName, style.animation), [\n animationClassName\n ]);\n\n const ie11BackupImageClassName = useMemo(\n () => classnames(backupImageClassName, style.backupImage),\n [backupImageClassName]\n );\n\n useEffect(() => {\n const loadAnimation = async () => {\n if (!_isIE11 && !animationItem) {\n /* istanbul ignore next */\n if (typeof window !== 'undefined') {\n window.lottie = lottie;\n }\n const animation = await fetchAndLoadAnimation(\n animationSrc,\n containerRef,\n loop,\n lottieAnimationClassName,\n hideOnTransparent,\n lottie,\n unfetch\n );\n\n /* istanbul ignore next */\n setAnimationItem(animation);\n }\n };\n\n loadAnimation();\n return () => animationItem && /* istanbul ignore next */ lottie.destroy(animationItem.name);\n }, [\n lottieAnimationClassName,\n containerRef,\n hideOnTransparent,\n loop,\n animationSrc,\n _isIE11,\n animationItem\n ]);\n\n return (\n <div\n ref={containerRef}\n aria-label={ariaLabel}\n data-name={dataName}\n className={wrapperClassName}\n style={{\n ...(width && {\n width: `${width}px`,\n maxWidth: `${width}px`\n }),\n ...(height && {\n height: `${height}px`,\n maxHeight: `${height}px`\n })\n }}\n >\n {_isIE11 ? (\n <img\n src={ie11ImageBackup}\n className={ie11BackupImageClassName}\n data-name=\"ie11-backup-image\"\n />\n ) : null}\n </div>\n );\n};\n\nLottieWrapper.propTypes = {\n 'aria-label': PropTypes.string.isRequired,\n 'data-name': PropTypes.string,\n animationSrc: PropTypes.string.isRequired,\n loop: PropTypes.bool,\n rendererSettings: PropTypes.shape({\n hideOnTransparent: PropTypes.bool,\n className: PropTypes.string\n }),\n height: PropTypes.number,\n width: PropTypes.number,\n className: PropTypes.string,\n ie11ImageBackup: PropTypes.string.isRequired,\n backupImageClassName: PropTypes.string\n};\n\nexport default LottieWrapper;\n"],"file":"index.js"}
1
+ {"version":3,"sources":["../../../src/atom/lottie-wrapper/index.js"],"names":["React","useMemo","useRef","useEffect","useState","PropTypes","classnames","lottie","get","has","includes","keys","omit","unfetch","style","ANIMATION_CONTROL","play","pause","stop","loading","isIE11","window","userAgent","hasMsCrypto","hasRevision","hasTrident","fetchAndLoadAnimation","_lottie","_fetch","animationSrc","containerRef","loop","animationClassnames","hideOnTransparent","autoplay","animationUrl","URL","toString","fetchResult","headers","animationData","json","animation","loadAnimation","container","current","renderer","rendererSettings","className","preserveAspectRatio","LottieWrapper","props","dataName","ariaLabel","width","height","ie11ImageBackup","backupImageClassName","animationControl","animationClassName","animationItem","setAnimationItem","isAnimationVisible","setIsAnimationVisible","_isIE11","wrapperClassName","lottieContainer","lottieAnimationClassName","ie11BackupImageClassName","backupImage","destroy","name","maxWidth","maxHeight","opacity","transition","propTypes","string","isRequired","bool","shape","number","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo, useRef, useEffect, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport lottie from 'lottie-web';\nimport get from 'lodash/fp/get';\nimport has from 'lodash/fp/has';\nimport includes from 'lodash/fp/includes';\nimport keys from 'lodash/fp/keys';\nimport omit from 'lodash/fp/omit';\nimport unfetch from 'isomorphic-unfetch';\nimport style from './style.css';\n\nexport const ANIMATION_CONTROL = {\n play: 'play',\n pause: 'pause',\n stop: 'stop',\n loading: 'loading'\n};\n\nconst isIE11 = () => {\n if (typeof window === 'undefined') return;\n const userAgent = get('navigator.userAgent', window);\n const hasMsCrypto = has('msCrypto', window);\n const hasRevision = includes('rv:', userAgent);\n const hasTrident = includes('Trident/', userAgent);\n\n return hasMsCrypto || (hasRevision && hasTrident);\n};\n\nexport const fetchAndLoadAnimation = async (\n _lottie,\n _fetch,\n animationSrc,\n containerRef,\n loop,\n animationClassnames,\n hideOnTransparent,\n autoplay\n) => {\n const animationUrl = new URL(animationSrc).toString();\n const fetchResult = await _fetch(animationUrl, {\n headers: {\n 'X-Requested-With': 'XMLHttpRequest',\n 'Content-Type': 'application/json'\n }\n });\n\n const animationData = await fetchResult.json();\n\n const animation = _lottie.loadAnimation({\n container: containerRef.current, // the dom element that will contain the animation\n renderer: 'svg',\n autoplay,\n loop,\n animationData,\n rendererSettings: {\n className: animationClassnames,\n hideOnTransparent,\n preserveAspectRatio: 'xMidYMid meet' // same options as a preserveAspectRatio prop\n }\n });\n return animation;\n};\n\nconst LottieWrapper = props => {\n const {\n className,\n 'data-name': dataName,\n 'aria-label': ariaLabel,\n animationSrc,\n loop = false,\n rendererSettings = {},\n width,\n height,\n ie11ImageBackup,\n backupImageClassName,\n autoplay = true,\n animationControl\n } = props;\n\n const {className: animationClassName, hideOnTransparent = true} = rendererSettings;\n\n const containerRef = useRef(null);\n\n // lottie's animation instance\n const [animationItem, setAnimationItem] = useState(null);\n\n const [isAnimationVisible, setIsAnimationVisible] = useState(autoplay);\n\n const _isIE11 = useMemo(() => isIE11(), []);\n\n const wrapperClassName = useMemo(() => classnames(className, style.lottieContainer), [className]);\n\n const lottieAnimationClassName = useMemo(() => classnames(animationClassName, style.animation), [\n animationClassName\n ]);\n\n const ie11BackupImageClassName = useMemo(\n () => classnames(backupImageClassName, style.backupImage),\n [backupImageClassName]\n );\n\n useEffect(() => {\n // enzyme does not handle well the state update after an async useEffect in tests\n // to remove when the migration towards @testing-library/react is done\n /* istanbul ignore next */\n if (\n animationItem &&\n includes(animationControl, keys(omit('loading', ANIMATION_CONTROL))) &&\n !autoplay\n ) {\n setIsAnimationVisible(true);\n animationItem[animationControl]();\n if (animationControl === ANIMATION_CONTROL.stop) setIsAnimationVisible(false);\n }\n }, [animationControl, animationItem, autoplay]);\n\n useEffect(() => {\n const loadAnimation = async () => {\n if (!_isIE11 && !animationItem) {\n /* istanbul ignore else */\n if (typeof window !== 'undefined') {\n window.lottie = lottie;\n }\n const animation = await fetchAndLoadAnimation(\n lottie,\n unfetch,\n animationSrc,\n containerRef,\n loop,\n lottieAnimationClassName,\n hideOnTransparent,\n autoplay\n );\n\n /* istanbul ignore next */\n setAnimationItem(animation);\n }\n };\n\n loadAnimation();\n return () => animationItem && /* istanbul ignore next */ lottie.destroy(animationItem.name);\n }, [\n lottieAnimationClassName,\n containerRef,\n hideOnTransparent,\n loop,\n animationSrc,\n _isIE11,\n animationItem,\n autoplay\n ]);\n\n return (\n <div\n ref={containerRef}\n aria-label={ariaLabel}\n data-name={dataName}\n className={wrapperClassName}\n style={{\n ...(width && {\n width: `${width}px`,\n maxWidth: `${width}px`\n }),\n ...(height && {\n height: `${height}px`,\n maxHeight: `${height}px`\n }),\n opacity: isAnimationVisible ? 1 : 0,\n transition: 'opacity 0.25s ease-in'\n }}\n >\n {_isIE11 ? (\n <img\n src={ie11ImageBackup}\n className={ie11BackupImageClassName}\n data-name=\"ie11-backup-image\"\n />\n ) : null}\n </div>\n );\n};\n\nLottieWrapper.propTypes = {\n 'aria-label': PropTypes.string.isRequired,\n 'data-name': PropTypes.string,\n animationSrc: PropTypes.string.isRequired,\n loop: PropTypes.bool,\n rendererSettings: PropTypes.shape({\n hideOnTransparent: PropTypes.bool,\n className: PropTypes.string\n }),\n height: PropTypes.number,\n width: PropTypes.number,\n className: PropTypes.string,\n ie11ImageBackup: PropTypes.string.isRequired,\n backupImageClassName: PropTypes.string,\n autoplay: PropTypes.bool,\n animationControl: PropTypes.oneOf(keys(ANIMATION_CONTROL))\n};\n\nexport default LottieWrapper;\n"],"file":"index.js"}
@@ -5,13 +5,15 @@ export default {
5
5
  className: undefined,
6
6
  animationSrc: 'https://static-staging.coorpacademy.com/animations/review/confetti.json',
7
7
  loop: undefined,
8
+ autoplay: true,
8
9
  rendererSettings: {
9
10
  hideOnTransparent: false,
10
11
  animationClassName: ''
11
12
  },
12
13
  height: 600,
13
14
  width: 1000,
14
- ie11ImageBackup: 'https://static-staging.coorpacademy.com/animations/review/conffeti_congrats.svg'
15
+ ie11ImageBackup: 'https://static-staging.coorpacademy.com/animations/review/conffeti_congrats.svg',
16
+ animationControl: undefined
15
17
  }
16
18
  };
17
19
  //# sourceMappingURL=confetti.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/atom/lottie-wrapper/test/fixtures/confetti.js"],"names":["props","className","undefined","animationSrc","loop","rendererSettings","hideOnTransparent","animationClassName","height","width","ie11ImageBackup"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc,aADT;AAEL,iBAAa,gBAFR;AAGLC,IAAAA,SAAS,EAAEC,SAHN;AAILC,IAAAA,YAAY,EAAE,yEAJT;AAKLC,IAAAA,IAAI,EAAEF,SALD;AAMLG,IAAAA,gBAAgB,EAAE;AAChBC,MAAAA,iBAAiB,EAAE,KADH;AAEhBC,MAAAA,kBAAkB,EAAE;AAFJ,KANb;AAULC,IAAAA,MAAM,EAAE,GAVH;AAWLC,IAAAA,KAAK,EAAE,IAXF;AAYLC,IAAAA,eAAe,EACb;AAbG;AADM,CAAf","sourcesContent":["export default {\n props: {\n 'aria-label': 'aria lottie',\n 'data-name': 'default-lottie',\n className: undefined,\n animationSrc: 'https://static-staging.coorpacademy.com/animations/review/confetti.json',\n loop: undefined,\n rendererSettings: {\n hideOnTransparent: false,\n animationClassName: ''\n },\n height: 600,\n width: 1000,\n ie11ImageBackup:\n 'https://static-staging.coorpacademy.com/animations/review/conffeti_congrats.svg'\n }\n};\n"],"file":"confetti.js"}
1
+ {"version":3,"sources":["../../../../../src/atom/lottie-wrapper/test/fixtures/confetti.js"],"names":["props","className","undefined","animationSrc","loop","autoplay","rendererSettings","hideOnTransparent","animationClassName","height","width","ie11ImageBackup","animationControl"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc,aADT;AAEL,iBAAa,gBAFR;AAGLC,IAAAA,SAAS,EAAEC,SAHN;AAILC,IAAAA,YAAY,EAAE,yEAJT;AAKLC,IAAAA,IAAI,EAAEF,SALD;AAMLG,IAAAA,QAAQ,EAAE,IANL;AAOLC,IAAAA,gBAAgB,EAAE;AAChBC,MAAAA,iBAAiB,EAAE,KADH;AAEhBC,MAAAA,kBAAkB,EAAE;AAFJ,KAPb;AAWLC,IAAAA,MAAM,EAAE,GAXH;AAYLC,IAAAA,KAAK,EAAE,IAZF;AAaLC,IAAAA,eAAe,EACb,iFAdG;AAeLC,IAAAA,gBAAgB,EAAEV;AAfb;AADM,CAAf","sourcesContent":["export default {\n props: {\n 'aria-label': 'aria lottie',\n 'data-name': 'default-lottie',\n className: undefined,\n animationSrc: 'https://static-staging.coorpacademy.com/animations/review/confetti.json',\n loop: undefined,\n autoplay: true,\n rendererSettings: {\n hideOnTransparent: false,\n animationClassName: ''\n },\n height: 600,\n width: 1000,\n ie11ImageBackup:\n 'https://static-staging.coorpacademy.com/animations/review/conffeti_congrats.svg',\n animationControl: undefined\n }\n};\n"],"file":"confetti.js"}
@@ -0,0 +1,10 @@
1
+ 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); }
2
+
3
+ import defaultProps from './default';
4
+ export default {
5
+ props: _extends(_extends({}, defaultProps.props), {}, {
6
+ autoplay: false,
7
+ animationControl: 'loading'
8
+ })
9
+ };
10
+ //# sourceMappingURL=controls.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../../src/atom/lottie-wrapper/test/fixtures/controls.js"],"names":["defaultProps","props","autoplay","animationControl"],"mappings":";;AAAA,OAAOA,YAAP,MAAyB,WAAzB;AAEA,eAAe;AACbC,EAAAA,KAAK,wBACAD,YAAY,CAACC,KADb;AAEHC,IAAAA,QAAQ,EAAE,KAFP;AAGHC,IAAAA,gBAAgB,EAAE;AAHf;AADQ,CAAf","sourcesContent":["import defaultProps from './default';\n\nexport default {\n props: {\n ...defaultProps.props,\n autoplay: false,\n animationControl: 'loading'\n }\n};\n"],"file":"controls.js"}
@@ -5,13 +5,15 @@ export default {
5
5
  className: undefined,
6
6
  animationSrc: 'https://static-staging.coorpacademy.com/animations/review/star.json',
7
7
  loop: false,
8
+ autoplay: undefined,
8
9
  rendererSettings: {
9
10
  hideOnTransparent: false,
10
11
  animationClassName: ''
11
12
  },
12
13
  height: 200,
13
14
  width: 200,
14
- ie11ImageBackup: 'https://static-staging.coorpacademy.com/animations/review/stars_icon_congrats.svg'
15
+ ie11ImageBackup: 'https://static-staging.coorpacademy.com/animations/review/stars_icon_congrats.svg',
16
+ animationControl: undefined
15
17
  }
16
18
  };
17
19
  //# sourceMappingURL=default.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/atom/lottie-wrapper/test/fixtures/default.js"],"names":["props","className","undefined","animationSrc","loop","rendererSettings","hideOnTransparent","animationClassName","height","width","ie11ImageBackup"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc,aADT;AAEL,iBAAa,gBAFR;AAGLC,IAAAA,SAAS,EAAEC,SAHN;AAILC,IAAAA,YAAY,EAAE,qEAJT;AAKLC,IAAAA,IAAI,EAAE,KALD;AAMLC,IAAAA,gBAAgB,EAAE;AAChBC,MAAAA,iBAAiB,EAAE,KADH;AAEhBC,MAAAA,kBAAkB,EAAE;AAFJ,KANb;AAULC,IAAAA,MAAM,EAAE,GAVH;AAWLC,IAAAA,KAAK,EAAE,GAXF;AAYLC,IAAAA,eAAe,EACb;AAbG;AADM,CAAf","sourcesContent":["export default {\n props: {\n 'aria-label': 'aria lottie',\n 'data-name': 'default-lottie',\n className: undefined,\n animationSrc: 'https://static-staging.coorpacademy.com/animations/review/star.json',\n loop: false,\n rendererSettings: {\n hideOnTransparent: false,\n animationClassName: ''\n },\n height: 200,\n width: 200,\n ie11ImageBackup:\n 'https://static-staging.coorpacademy.com/animations/review/stars_icon_congrats.svg'\n }\n};\n"],"file":"default.js"}
1
+ {"version":3,"sources":["../../../../../src/atom/lottie-wrapper/test/fixtures/default.js"],"names":["props","className","undefined","animationSrc","loop","autoplay","rendererSettings","hideOnTransparent","animationClassName","height","width","ie11ImageBackup","animationControl"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc,aADT;AAEL,iBAAa,gBAFR;AAGLC,IAAAA,SAAS,EAAEC,SAHN;AAILC,IAAAA,YAAY,EAAE,qEAJT;AAKLC,IAAAA,IAAI,EAAE,KALD;AAMLC,IAAAA,QAAQ,EAAEH,SANL;AAOLI,IAAAA,gBAAgB,EAAE;AAChBC,MAAAA,iBAAiB,EAAE,KADH;AAEhBC,MAAAA,kBAAkB,EAAE;AAFJ,KAPb;AAWLC,IAAAA,MAAM,EAAE,GAXH;AAYLC,IAAAA,KAAK,EAAE,GAZF;AAaLC,IAAAA,eAAe,EACb,mFAdG;AAeLC,IAAAA,gBAAgB,EAAEV;AAfb;AADM,CAAf","sourcesContent":["export default {\n props: {\n 'aria-label': 'aria lottie',\n 'data-name': 'default-lottie',\n className: undefined,\n animationSrc: 'https://static-staging.coorpacademy.com/animations/review/star.json',\n loop: false,\n autoplay: undefined,\n rendererSettings: {\n hideOnTransparent: false,\n animationClassName: ''\n },\n height: 200,\n width: 200,\n ie11ImageBackup:\n 'https://static-staging.coorpacademy.com/animations/review/stars_icon_congrats.svg',\n animationControl: undefined\n }\n};\n"],"file":"default.js"}