@bigbinary/neeto-image-uploader-frontend 2.3.10 → 2.3.14
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.
- package/README.md +1 -0
- package/app/javascript/src/translations/en.json +3 -2
- package/dist/AssetLibrary.js +6 -5
- package/dist/AssetLibrary.js.map +1 -1
- package/dist/BasicImageUploader.js +3 -3
- package/dist/BasicImageUploader.js.map +1 -1
- package/dist/ImageUploader.js +9 -4
- package/dist/ImageUploader.js.map +1 -1
- package/dist/ImageWithFallback-Csv6Oivd.js +51 -0
- package/dist/ImageWithFallback-Csv6Oivd.js.map +1 -0
- package/dist/ImageWithFallback-DzT_N2Su.js +53 -0
- package/dist/ImageWithFallback-DzT_N2Su.js.map +1 -0
- package/dist/cjs/AssetLibrary.js +6 -5
- package/dist/cjs/AssetLibrary.js.map +1 -1
- package/dist/cjs/BasicImageUploader.js +4 -4
- package/dist/cjs/BasicImageUploader.js.map +1 -1
- package/dist/cjs/ImageUploader.js +14 -9
- package/dist/cjs/ImageUploader.js.map +1 -1
- package/dist/cjs/hooks.js +1 -1
- package/dist/cjs/index.js +6 -5
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/utils.js.map +1 -1
- package/dist/{index-vkjNhoF3.js → index-2Z-tiNdY.js} +819 -391
- package/dist/index-2Z-tiNdY.js.map +1 -0
- package/dist/{index-By7BkNOh.js → index-BsGnAVUR.js} +846 -418
- package/dist/index-BsGnAVUR.js.map +1 -0
- package/dist/index-BtHfh_eu.js.map +1 -1
- package/dist/index-CZjb2iXB.js.map +1 -1
- package/dist/index.js +5 -4
- package/dist/index.js.map +1 -1
- package/dist/query-B0eDmse7.js.map +1 -1
- package/dist/query-B7ahlELA.js.map +1 -1
- package/dist/useImageUploader-Bm9TukCy.js.map +1 -1
- package/dist/useImageUploader-RX88_Cp-.js.map +1 -1
- package/dist/{useProfileImageUpload-UUrg2Lkw.js → useProfileImageUpload-C6Gat9NR.js} +6 -6
- package/dist/useProfileImageUpload-C6Gat9NR.js.map +1 -0
- package/dist/useProfileImageUpload-KpvcwEqx.js.map +1 -1
- package/dist/utils-C58No1u2.js +410 -0
- package/dist/utils-C58No1u2.js.map +1 -0
- package/dist/utils-CFUW0P-E.js +382 -0
- package/dist/utils-CFUW0P-E.js.map +1 -0
- package/dist/utils.js.map +1 -1
- package/package.json +58 -54
- package/types.d.ts +1 -0
- package/dist/ImageWithFallback-Dz9cyV2n.js +0 -144
- package/dist/ImageWithFallback-Dz9cyV2n.js.map +0 -1
- package/dist/ImageWithFallback-c9ANE1IE.js +0 -141
- package/dist/ImageWithFallback-c9ANE1IE.js.map +0 -1
- package/dist/index-By7BkNOh.js.map +0 -1
- package/dist/index-vkjNhoF3.js.map +0 -1
- package/dist/useProfileImageUpload-UUrg2Lkw.js.map +0 -1
- package/dist/utils-B5WMTXlT.js +0 -256
- package/dist/utils-B5WMTXlT.js.map +0 -1
- package/dist/utils-tPaqWDxV.js +0 -280
- package/dist/utils-tPaqWDxV.js.map +0 -1
package/README.md
CHANGED
|
@@ -106,6 +106,7 @@ export default App;
|
|
|
106
106
|
- `src`: The source URL of the image to be displayed initially.
|
|
107
107
|
- `uploadConfig`: Configuration object for image uploads.
|
|
108
108
|
- `fixedAspectRatio`: An option to maintain a specific aspect ratio for the image. Expected input format is {height: number, width: number}.
|
|
109
|
+
- `defaultImageSize`: An option to set the initial crop size of the image. Expected input format is { height: number, width: number }.
|
|
109
110
|
|
|
110
111
|
**Usage**
|
|
111
112
|
```jsx
|
|
@@ -16,11 +16,11 @@
|
|
|
16
16
|
"height": "Height",
|
|
17
17
|
"lockAspectRatio": "Lock aspect ratio",
|
|
18
18
|
"selectOriginalImage": "Select original image",
|
|
19
|
+
"uploadImage": "Upload image",
|
|
19
20
|
"myImages": "My images",
|
|
20
21
|
"unsplash": "Unsplash",
|
|
21
22
|
"unsplashImages": "Unsplash images",
|
|
22
23
|
"uploadFromLink": "Upload from link",
|
|
23
|
-
"uploadNewImage": "Upload new image",
|
|
24
24
|
"width": "Width",
|
|
25
25
|
"imageQuality": "Image quality",
|
|
26
26
|
"searchTheWeb": "Search the web"
|
|
@@ -52,7 +52,8 @@
|
|
|
52
52
|
"fileTypeError": "File type is not supported",
|
|
53
53
|
"restrictionMessage": "{{fileTypes, anyCase}}. upto {{size}} MB.",
|
|
54
54
|
"uploadedImage": "Uploaded Image",
|
|
55
|
-
"dragDropOrBrowseOrImageLibrary": "Drag and drop or <span>Browse</span> a file or select from <span>Image Library</span>."
|
|
55
|
+
"dragDropOrBrowseOrImageLibrary": "Drag and drop or <span>Browse</span> a file or select from <span>Image Library</span>.",
|
|
56
|
+
"idealImageSizeInfo": "Optimal image size: {{width}}x{{height}}px."
|
|
56
57
|
},
|
|
57
58
|
"errors": {
|
|
58
59
|
"sdkKeysMissing": "Missing urlEndpoint during SDK initialization",
|
package/dist/AssetLibrary.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import '@babel/runtime/helpers/objectWithoutProperties';
|
|
2
1
|
import '@babel/runtime/helpers/defineProperty';
|
|
3
2
|
import '@babel/runtime/helpers/slicedToArray';
|
|
4
3
|
import 'react';
|
|
5
4
|
import '@bigbinary/neeto-cist';
|
|
6
5
|
import '@bigbinary/neeto-commons-frontend/initializers';
|
|
7
6
|
import '@bigbinary/neetoui/Modal';
|
|
8
|
-
import '@bigbinary/neetoui/Button';
|
|
9
7
|
import '@bigbinary/neetoui/Tab';
|
|
10
8
|
import '@bigbinary/neetoui/Spinner';
|
|
11
9
|
import '@bigbinary/neetoui/Toastr';
|
|
12
10
|
import '@bigbinary/neetoui/Typography';
|
|
13
11
|
import 'ramda';
|
|
14
12
|
import 'react-i18next';
|
|
15
|
-
import './utils-
|
|
16
|
-
export { M as default } from './index-
|
|
13
|
+
import './utils-CFUW0P-E.js';
|
|
14
|
+
export { M as default } from './index-2Z-tiNdY.js';
|
|
17
15
|
import './useImageUploader-RX88_Cp-.js';
|
|
18
16
|
import './index-CZjb2iXB.js';
|
|
19
17
|
import 'react/jsx-runtime';
|
|
18
|
+
import 'classnames';
|
|
19
|
+
import '@bigbinary/neetoui/Button';
|
|
20
|
+
import '@bigbinary/neetoui/ProgressBar';
|
|
20
21
|
import 'react-dropzone';
|
|
21
22
|
import 'i18next';
|
|
22
|
-
import 'classnames';
|
|
23
23
|
import '@bigbinary/neeto-icons/LeftArrow';
|
|
24
24
|
import '@tanstack/react-query';
|
|
25
25
|
import 'axios';
|
|
@@ -27,6 +27,7 @@ import '@bigbinary/neeto-commons-frontend/react-utils';
|
|
|
27
27
|
import '@bigbinary/neeto-commons-frontend/utils';
|
|
28
28
|
import '@bigbinary/neetoui/Input';
|
|
29
29
|
import '@bigbinary/neetoui/Switch';
|
|
30
|
+
import '@bigbinary/neetoui/Label';
|
|
30
31
|
import './query-B0eDmse7.js';
|
|
31
32
|
import '@bigbinary/neeto-icons/MenuHorizontal';
|
|
32
33
|
import '@bigbinary/neeto-team-members-frontend/constants';
|
package/dist/AssetLibrary.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetLibrary.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AssetLibrary.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -4,16 +4,16 @@ import classnames from 'classnames';
|
|
|
4
4
|
import { noop } from '@bigbinary/neeto-cist';
|
|
5
5
|
import Delete from '@bigbinary/neeto-icons/Delete';
|
|
6
6
|
import Button from '@bigbinary/neetoui/Button';
|
|
7
|
-
import { I as
|
|
8
|
-
import {
|
|
7
|
+
import { b as isNilOrEmpty, i as isNotNilOrEmpty, I as IMAGE_WRAPPER_CLASSNAME, a as ImageDirectUpload } from './utils-CFUW0P-E.js';
|
|
8
|
+
import { I as ImageWithFallback } from './ImageWithFallback-Csv6Oivd.js';
|
|
9
9
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
10
10
|
import '@bigbinary/neetoui/Typography';
|
|
11
11
|
import '@bigbinary/neetoui/ProgressBar';
|
|
12
12
|
import 'ramda';
|
|
13
13
|
import 'react-i18next';
|
|
14
|
+
import '@bigbinary/neeto-commons-frontend/initializers';
|
|
14
15
|
import '@babel/runtime/helpers/slicedToArray';
|
|
15
16
|
import 'react';
|
|
16
|
-
import '@bigbinary/neeto-commons-frontend/initializers';
|
|
17
17
|
import 'react-dropzone';
|
|
18
18
|
import 'i18next';
|
|
19
19
|
import '@bigbinary/neetoui/Toastr';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasicImageUploader.js","sources":["../app/javascript/src/components/BasicImageUploader.jsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Delete } from \"neetoicons\";\nimport { Button } from \"neetoui\";\n\nimport ImageDirectUpload from \"./common/ImageDirectUpload\";\nimport ImageWithFallback from \"./common/ImageWithFallback\";\nimport { IMAGE_WRAPPER_CLASSNAME } from \"./constants\";\nimport { isNilOrEmpty, isNotNilOrEmpty } from \"./ImageEditor/utils\";\n\nconst BasicImageUploader = ({\n src = \"\",\n className = \"\",\n imageFallbackProps = { alt: \"Uplaoded Image\", className: \"h-full w-full\" },\n onDrop = noop,\n isDisabled = false,\n onRemove = noop,\n ...props\n}) => (\n <div\n className={classnames(className, {\n \"cursor-pointer\": true,\n \"cursor-not-allowed\": isDisabled,\n \"opacity-70\": isDisabled && isNilOrEmpty(src),\n })}\n >\n {isNotNilOrEmpty(src) ? (\n <div className={IMAGE_WRAPPER_CLASSNAME}>\n <ImageWithFallback\n {...{ ...imageFallbackProps, src }}\n data-cy=\"uploaded-image\"\n />\n <Button\n className=\"absolute right-3 top-3\"\n data-cy=\"basic-image-uploader-remove-button\"\n disabled={isDisabled}\n icon={Delete}\n size=\"small\"\n onClick={onRemove}\n />\n </div>\n ) : (\n <ImageDirectUpload {...{ ...props, isDisabled, onDrop }} />\n )}\n </div>\n);\n\nexport default BasicImageUploader;\n"],"names":["BasicImageUploader","_ref","_ref$src","src","_ref$className","className","_ref$imageFallbackPro","imageFallbackProps","alt","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","_ref$onRemove","onRemove","props","_objectWithoutProperties","_excluded","_jsx","classnames","isNilOrEmpty","children","isNotNilOrEmpty","_jsxs","IMAGE_WRAPPER_CLASSNAME","ImageWithFallback","_objectSpread","Button","disabled","icon","Delete","size","onClick","ImageDirectUpload"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,QAAA,GAAAD,IAAA,CACtBE,GAAG;AAAHA,IAAAA,GAAG,GAAAD,QAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,QAAA;IAAAE,cAAA,GAAAH,IAAA,CACRI,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAE,qBAAA,GAAAL,IAAA,CACdM,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA;AAAEE,MAAAA,GAAG,EAAE,gBAAgB;AAAEH,MAAAA,SAAS,EAAE
|
|
1
|
+
{"version":3,"file":"BasicImageUploader.js","sources":["../app/javascript/src/components/BasicImageUploader.jsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Delete } from \"neetoicons\";\nimport { Button } from \"neetoui\";\n\nimport ImageDirectUpload from \"./common/ImageDirectUpload\";\nimport ImageWithFallback from \"./common/ImageWithFallback\";\nimport { IMAGE_WRAPPER_CLASSNAME } from \"./constants\";\nimport { isNilOrEmpty, isNotNilOrEmpty } from \"./ImageEditor/utils\";\n\nconst BasicImageUploader = ({\n src = \"\",\n className = \"\",\n imageFallbackProps = { alt: \"Uplaoded Image\", className: \"h-full w-full\" },\n onDrop = noop,\n isDisabled = false,\n onRemove = noop,\n ...props\n}) => (\n <div\n className={classnames(className, {\n \"cursor-pointer\": true,\n \"cursor-not-allowed\": isDisabled,\n \"opacity-70\": isDisabled && isNilOrEmpty(src),\n })}\n >\n {isNotNilOrEmpty(src) ? (\n <div className={IMAGE_WRAPPER_CLASSNAME}>\n <ImageWithFallback\n {...{ ...imageFallbackProps, src }}\n data-cy=\"uploaded-image\"\n />\n <Button\n className=\"absolute right-3 top-3\"\n data-cy=\"basic-image-uploader-remove-button\"\n disabled={isDisabled}\n icon={Delete}\n size=\"small\"\n onClick={onRemove}\n />\n </div>\n ) : (\n <ImageDirectUpload {...{ ...props, isDisabled, onDrop }} />\n )}\n </div>\n);\n\nexport default BasicImageUploader;\n"],"names":["BasicImageUploader","_ref","_ref$src","src","_ref$className","className","_ref$imageFallbackPro","imageFallbackProps","alt","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","_ref$onRemove","onRemove","props","_objectWithoutProperties","_excluded","_jsx","classnames","isNilOrEmpty","children","isNotNilOrEmpty","_jsxs","IMAGE_WRAPPER_CLASSNAME","ImageWithFallback","_objectSpread","Button","disabled","icon","Delete","size","onClick","ImageDirectUpload"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,QAAA,GAAAD,IAAA,CACtBE,GAAG;AAAHA,IAAAA,GAAG,GAAAD,QAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,QAAA;IAAAE,cAAA,GAAAH,IAAA,CACRI,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAE,qBAAA,GAAAL,IAAA,CACdM,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA;AAAEE,MAAAA,GAAG,EAAE,gBAAgB;AAAEH,MAAAA,SAAS,EAAE;AAAgB,KAAC,GAAAC,qBAAA;IAAAG,WAAA,GAAAR,IAAA,CAC1ES,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAGE,KAAAA,CAAAA,GAAAA,IAAI,GAAAF,WAAA;IAAAG,eAAA,GAAAX,IAAA,CACbY,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAAAE,aAAA,GAAAb,IAAA,CAClBc,QAAQ;AAARA,IAAAA,QAAQ,GAAAD,aAAA,KAAGH,KAAAA,CAAAA,GAAAA,IAAI,GAAAG,aAAA;AACZE,IAAAA,KAAK,GAAAC,wBAAA,CAAAhB,IAAA,EAAAiB,SAAA,CAAA;AAAA,EAAA,oBAERC,GAAA,CAAA,KAAA,EAAA;AACEd,IAAAA,SAAS,EAAEe,UAAU,CAACf,SAAS,EAAE;AAC/B,MAAA,gBAAgB,EAAE,IAAI;AACtB,MAAA,oBAAoB,EAAEQ,UAAU;AAChC,MAAA,YAAY,EAAEA,UAAU,IAAIQ,YAAY,CAAClB,GAAG;AAC9C,KAAC,CAAE;AAAAmB,IAAAA,QAAA,EAEFC,eAAe,CAACpB,GAAG,CAAC,gBACnBqB,IAAA,CAAA,KAAA,EAAA;AAAKnB,MAAAA,SAAS,EAAEoB,uBAAwB;AAAAH,MAAAA,QAAA,EACtCH,cAAAA,GAAA,CAACO,iBAAiB,EAAAC,aAAA,CAAAA,aAAA,CAAAA,EAAAA,EAAAA,aAAA,CAAAA,aAAA,KACPpB,kBAAkB,CAAA,EAAA,EAAA,EAAA;AAAEJ,QAAAA,GAAG,EAAHA;AAAG,OAAA,CAAA,CAAA,EAAA,EAAA,EAAA;QAChC,SAAQ,EAAA;AAAgB,OAAA,CACzB,CAAC,eACFgB,GAAA,CAACS,MAAM,EAAA;AACLvB,QAAAA,SAAS,EAAC,wBAAwB;AAClC,QAAA,SAAA,EAAQ,oCAAoC;AAC5CwB,QAAAA,QAAQ,EAAEhB,UAAW;AACrBiB,QAAAA,IAAI,EAAEC,MAAO;AACbC,QAAAA,IAAI,EAAC,OAAO;AACZC,QAAAA,OAAO,EAAElB;AAAS,OACnB,CAAC;AAAA,KACC,CAAC,gBAENI,GAAA,CAACe,iBAAiB,EAAAP,aAAA,CAAA,EAAA,EAAAA,aAAA,CAAAA,aAAA,CAAA,EAAA,EAAUX,KAAK,CAAA,EAAA,EAAA,EAAA;AAAEH,MAAAA,UAAU,EAAVA,UAAU;AAAEH,MAAAA,MAAM,EAANA;KAAW,CAAA,CAAA;AAC3D,GACE,CAAC;AAAA;;;;"}
|
package/dist/ImageUploader.js
CHANGED
|
@@ -11,9 +11,9 @@ import MenuHorizontal from '@bigbinary/neeto-icons/MenuHorizontal';
|
|
|
11
11
|
import Dropdown from '@bigbinary/neetoui/Dropdown';
|
|
12
12
|
import { mergeRight } from 'ramda';
|
|
13
13
|
import { useTranslation } from 'react-i18next';
|
|
14
|
-
import { I as
|
|
15
|
-
import {
|
|
16
|
-
import { M as Modal, c as constructCloudflareImageURL } from './index-
|
|
14
|
+
import { D as DEFAULT_UPLOAD_CONFIG, O as OPTION_KEYS, i as isNotNilOrEmpty, I as IMAGE_WRAPPER_CLASSNAME, a as ImageDirectUpload } from './utils-CFUW0P-E.js';
|
|
15
|
+
import { I as ImageWithFallback } from './ImageWithFallback-Csv6Oivd.js';
|
|
16
|
+
import { M as Modal, c as constructCloudflareImageURL } from './index-2Z-tiNdY.js';
|
|
17
17
|
import { a as useCreateBlob, u as useImageUploader, g as generateASCIIFileName } from './useImageUploader-RX88_Cp-.js';
|
|
18
18
|
import { C as CLOUD_FLARE, I as IS_DEVELOPMENT_OR_HEROKU_ENV } from './index-CZjb2iXB.js';
|
|
19
19
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
@@ -33,6 +33,7 @@ import '@bigbinary/neeto-commons-frontend/react-utils';
|
|
|
33
33
|
import '@bigbinary/neeto-commons-frontend/utils';
|
|
34
34
|
import '@bigbinary/neetoui/Input';
|
|
35
35
|
import '@bigbinary/neetoui/Switch';
|
|
36
|
+
import '@bigbinary/neetoui/Label';
|
|
36
37
|
import './query-B0eDmse7.js';
|
|
37
38
|
import '@bigbinary/neeto-team-members-frontend/constants';
|
|
38
39
|
import '@bigbinary/neetoui/Alert';
|
|
@@ -53,7 +54,9 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
53
54
|
_ref$uploadConfig = _ref.uploadConfig,
|
|
54
55
|
uploadConfig = _ref$uploadConfig === void 0 ? {} : _ref$uploadConfig,
|
|
55
56
|
_ref$fixedAspectRatio = _ref.fixedAspectRatio,
|
|
56
|
-
fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio
|
|
57
|
+
fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio,
|
|
58
|
+
_ref$defaultImageSize = _ref.defaultImageSize,
|
|
59
|
+
defaultImageSize = _ref$defaultImageSize === void 0 ? {} : _ref$defaultImageSize;
|
|
57
60
|
var _useState = useState(false),
|
|
58
61
|
_useState2 = _slicedToArray(_useState, 2),
|
|
59
62
|
isAssetLibraryOpen = _useState2[0],
|
|
@@ -205,11 +208,13 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
205
208
|
})
|
|
206
209
|
})]
|
|
207
210
|
}) : /*#__PURE__*/jsx(ImageDirectUpload, {
|
|
211
|
+
defaultImageSize: defaultImageSize,
|
|
208
212
|
setIsAssetLibraryOpen: setIsAssetLibraryOpen,
|
|
209
213
|
isDisabled: isPresent(fixedAspectRatio),
|
|
210
214
|
uploadConfig: uploadConfigWithDefaults,
|
|
211
215
|
onDrop: uploadFile
|
|
212
216
|
}), /*#__PURE__*/jsx(Modal, {
|
|
217
|
+
defaultImageSize: defaultImageSize,
|
|
213
218
|
fixedAspectRatio: fixedAspectRatio,
|
|
214
219
|
isOpen: isAssetLibraryOpen,
|
|
215
220
|
uploadConfig: uploadConfigWithDefaults,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageUploader.js","sources":["../app/javascript/src/components/ImageUploader/index.jsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport classnames from \"classnames\";\nimport { isPresent, noop } from \"neetocist\";\nimport { globalProps } from \"neetocommons/initializers\";\nimport { MenuHorizontal } from \"neetoicons\";\nimport { Dropdown } from \"neetoui\";\nimport { mergeRight } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport ImageDirectUpload from \"components/common/ImageDirectUpload\";\nimport ImageWithFallback from \"components/common/ImageWithFallback\";\nimport { IMAGE_WRAPPER_CLASSNAME } from \"components/constants\";\nimport { isNotNilOrEmpty } from \"components/ImageEditor/utils\";\nimport AssetLibrary from \"components/Modal\";\nimport { constructCloudflareImageURL } from \"components/utils\";\nimport { useCreateBlob } from \"hooks/useDirectUploads\";\nimport useImageUploader from \"hooks/useImageUploader\";\nimport { generateASCIIFileName } from \"hooks/utils\";\nimport { CLOUD_FLARE, IS_DEVELOPMENT_OR_HEROKU_ENV } from \"src/constants\";\n\nimport { DEFAULT_UPLOAD_CONFIG, OPTION_KEYS } from \"./constants\";\n\nconst { Menu, MenuItem } = Dropdown;\n\nconst ImageUploader = ({\n onUploadComplete = noop,\n className = \"\",\n src = \"\",\n uploadConfig = {},\n fixedAspectRatio = {},\n}) => {\n const [isAssetLibraryOpen, setIsAssetLibraryOpen] = useState(false);\n const [image, setImage] = useState({ url: src });\n\n const { t } = useTranslation();\n\n const { mutateAsync: createBlob } = useCreateBlob();\n\n const uploadConfigWithDefaults = mergeRight(\n DEFAULT_UPLOAD_CONFIG,\n uploadConfig\n );\n\n const isCloudFlareImageUploader =\n globalProps.assetsUploaderService === CLOUD_FLARE;\n\n const handleDelete = () => {\n setImage({});\n onChange({\n url: \"\",\n signedId: \"\",\n key: \"\",\n filename: \"\",\n size: \"\",\n type: \"\",\n });\n };\n\n const onChange = file => onUploadComplete(file);\n\n const handleSuccess = attachedImage => {\n setImage(mergeRight(image, { url: attachedImage.metadata.url }));\n onChange({\n filename: generateASCIIFileName(attachedImage.filename),\n key: attachedImage.key,\n url: attachedImage.blobUrl,\n signedId: attachedImage.signedId,\n size: attachedImage.byteSize,\n type: attachedImage.contentType,\n });\n };\n\n const handleImageSelectionFromLibrary = image => {\n setImage(image);\n onChange(image);\n };\n\n const handleUploadComplete = async result => {\n if (IS_DEVELOPMENT_OR_HEROKU_ENV) {\n handleSuccess(mergeRight(result, { metadata: { url: result.url } }));\n\n return;\n }\n\n const imageKitPayload = () => ({\n filename: generateASCIIFileName(result.name),\n byte_size: result.size,\n content_type: result.fileType,\n checksum: result.fileId,\n metadata: result,\n service_name: \"imagekitio\",\n });\n\n const cloudFlarePayload = () => ({\n filename: generateASCIIFileName(result.filename),\n content_type: result.contentType,\n byte_size: result.byteSize,\n checksum: result.id,\n metadata: {\n ...result.metadata,\n url: constructCloudflareImageURL(result.variants[0]),\n isCropped: false,\n },\n service_name: \"cloudflare_image\",\n });\n\n const payload = isCloudFlareImageUploader\n ? cloudFlarePayload()\n : imageKitPayload();\n\n const response = await createBlob(payload, {});\n handleSuccess(response);\n };\n\n const { uploadFile } = useImageUploader({\n onUploadComplete: handleUploadComplete,\n });\n\n const options = [\n {\n key: OPTION_KEYS.asset,\n label: t(\"neetoImageUploader.imageUpload.imageLibrary\"),\n onClick: () => setIsAssetLibraryOpen(true),\n \"data-cy\": \"image-uploader-open-image-library-button\",\n },\n {\n key: OPTION_KEYS.remove,\n label: t(\"neetoImageUploader.imageUpload.remove\"),\n onClick: handleDelete,\n \"data-cy\": \"image-uploader-remove-button\",\n },\n ];\n\n return (\n <div className={classnames(className, { \"cursor-pointer\": true })}>\n {isNotNilOrEmpty(image.url) ? (\n <div\n className={IMAGE_WRAPPER_CLASSNAME}\n data-cy=\"image-uploader-wrapper\"\n >\n <ImageWithFallback\n className=\"h-full w-full\"\n data-cy=\"uploaded-image\"\n src={image.url}\n />\n <Dropdown\n buttonSize=\"small\"\n buttonStyle=\"tertiary\"\n icon={MenuHorizontal}\n buttonProps={{\n // eslint-disable-next-line @bigbinary/neeto/use-neetoui-classes\n className: \"absolute right-3 top-3 rounded-full\",\n }}\n >\n <Menu>\n {options.map(({ key, label, ...otherProps }) => (\n <MenuItem.Button {...otherProps} key={key}>\n {label}\n </MenuItem.Button>\n ))}\n </Menu>\n </Dropdown>\n </div>\n ) : (\n <ImageDirectUpload\n {...{ setIsAssetLibraryOpen }}\n isDisabled={isPresent(fixedAspectRatio)}\n uploadConfig={uploadConfigWithDefaults}\n onDrop={uploadFile}\n />\n )}\n <AssetLibrary\n {...{ fixedAspectRatio }}\n isOpen={isAssetLibraryOpen}\n uploadConfig={uploadConfigWithDefaults}\n onClose={() => setIsAssetLibraryOpen(false)}\n onUploadComplete={handleImageSelectionFromLibrary}\n />\n </div>\n );\n};\n\nexport default ImageUploader;\n"],"names":["Menu","Dropdown","MenuItem","ImageUploader","_ref","_ref$onUploadComplete","onUploadComplete","noop","_ref$className","className","_ref$src","src","_ref$uploadConfig","uploadConfig","_ref$fixedAspectRatio","fixedAspectRatio","_useState","useState","_useState2","_slicedToArray","isAssetLibraryOpen","setIsAssetLibraryOpen","_useState3","url","_useState4","image","setImage","_useTranslation","useTranslation","t","_useCreateBlob","useCreateBlob","createBlob","mutateAsync","uploadConfigWithDefaults","mergeRight","DEFAULT_UPLOAD_CONFIG","isCloudFlareImageUploader","globalProps","assetsUploaderService","CLOUD_FLARE","handleDelete","onChange","signedId","key","filename","size","type","file","handleSuccess","attachedImage","metadata","generateASCIIFileName","blobUrl","byteSize","contentType","handleImageSelectionFromLibrary","handleUploadComplete","_ref2","_asyncToGenerator","_regeneratorRuntime","mark","_callee","result","imageKitPayload","cloudFlarePayload","payload","response","wrap","_callee$","_context","prev","next","IS_DEVELOPMENT_OR_HEROKU_ENV","abrupt","name","byte_size","content_type","fileType","checksum","fileId","service_name","id","_objectSpread","constructCloudflareImageURL","variants","isCropped","sent","stop","_x","apply","arguments","_useImageUploader","useImageUploader","uploadFile","options","OPTION_KEYS","asset","label","onClick","remove","_jsxs","classnames","children","isNotNilOrEmpty","IMAGE_WRAPPER_CLASSNAME","_jsx","ImageWithFallback","buttonSize","buttonStyle","icon","MenuHorizontal","buttonProps","map","_ref3","otherProps","_objectWithoutProperties","_excluded","_createElement","Button","ImageDirectUpload","isDisabled","isPresent","onDrop","AssetLibrary","isOpen","onClose"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBA,IAAQA,IAAI,GAAeC,QAAQ,CAA3BD,IAAI;EAAEE,QAAQ,GAAKD,QAAQ,CAArBC,QAAQ,CAAA;AAEtB,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAAC,IAAA,EAMb;AAAA,EAAA,IAAAC,qBAAA,GAAAD,IAAA,CALJE,gBAAgB;AAAhBA,IAAAA,gBAAgB,GAAAD,qBAAA,KAAGE,KAAAA,CAAAA,GAAAA,IAAI,GAAAF,qBAAA;IAAAG,cAAA,GAAAJ,IAAA,CACvBK,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAE,QAAA,GAAAN,IAAA,CACdO,GAAG;AAAHA,IAAAA,GAAG,GAAAD,QAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,QAAA;IAAAE,iBAAA,GAAAR,IAAA,CACRS,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,iBAAA;IAAAE,qBAAA,GAAAV,IAAA,CACjBW,gBAAgB;AAAhBA,IAAAA,gBAAgB,GAAAD,qBAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,qBAAA,CAAA;AAErB,EAAA,IAAAE,SAAA,GAAoDC,QAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAA5DI,IAAAA,kBAAkB,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,qBAAqB,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;EAChD,IAAAI,UAAA,GAA0BL,QAAQ,CAAC;AAAEM,MAAAA,GAAG,EAAEZ,GAAAA;AAAI,KAAC,CAAC;IAAAa,UAAA,GAAAL,cAAA,CAAAG,UAAA,EAAA,CAAA,CAAA;AAAzCG,IAAAA,KAAK,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,QAAQ,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;AAEtB,EAAA,IAAAG,eAAA,GAAcC,cAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AAET,EAAA,IAAAC,cAAA,GAAoCC,aAAa,EAAE;IAA9BC,UAAU,GAAAF,cAAA,CAAvBG,WAAW,CAAA;AAEnB,EAAA,IAAMC,wBAAwB,GAAGC,UAAU,CACzCC,qBAAqB,EACrBvB,YACF,CAAC,CAAA;AAED,EAAA,IAAMwB,yBAAyB,GAC7BC,WAAW,CAACC,qBAAqB,KAAKC,WAAW,CAAA;AAEnD,EAAA,IAAMC,YAAY,GAAG,SAAfA,YAAYA,GAAS;IACzBf,QAAQ,CAAC,EAAE,CAAC,CAAA;AACZgB,IAAAA,QAAQ,CAAC;AACPnB,MAAAA,GAAG,EAAE,EAAE;AACPoB,MAAAA,QAAQ,EAAE,EAAE;AACZC,MAAAA,GAAG,EAAE,EAAE;AACPC,MAAAA,QAAQ,EAAE,EAAE;AACZC,MAAAA,IAAI,EAAE,EAAE;AACRC,MAAAA,IAAI,EAAE,EAAA;AACR,KAAC,CAAC,CAAA;GACH,CAAA;AAED,EAAA,IAAML,QAAQ,GAAG,SAAXA,QAAQA,CAAGM,IAAI,EAAA;IAAA,OAAI1C,gBAAgB,CAAC0C,IAAI,CAAC,CAAA;AAAA,GAAA,CAAA;AAE/C,EAAA,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAGC,aAAa,EAAI;AACrCxB,IAAAA,QAAQ,CAACS,UAAU,CAACV,KAAK,EAAE;AAAEF,MAAAA,GAAG,EAAE2B,aAAa,CAACC,QAAQ,CAAC5B,GAAAA;AAAI,KAAC,CAAC,CAAC,CAAA;AAChEmB,IAAAA,QAAQ,CAAC;AACPG,MAAAA,QAAQ,EAAEO,qBAAqB,CAACF,aAAa,CAACL,QAAQ,CAAC;MACvDD,GAAG,EAAEM,aAAa,CAACN,GAAG;MACtBrB,GAAG,EAAE2B,aAAa,CAACG,OAAO;MAC1BV,QAAQ,EAAEO,aAAa,CAACP,QAAQ;MAChCG,IAAI,EAAEI,aAAa,CAACI,QAAQ;MAC5BP,IAAI,EAAEG,aAAa,CAACK,WAAAA;AACtB,KAAC,CAAC,CAAA;GACH,CAAA;AAED,EAAA,IAAMC,+BAA+B,GAAG,SAAlCA,+BAA+BA,CAAG/B,KAAK,EAAI;IAC/CC,QAAQ,CAACD,KAAK,CAAC,CAAA;IACfiB,QAAQ,CAACjB,KAAK,CAAC,CAAA;GAChB,CAAA;AAED,EAAA,IAAMgC,oBAAoB,gBAAA,YAAA;IAAA,IAAAC,KAAA,GAAAC,iBAAA,cAAAC,mBAAA,CAAAC,IAAA,CAAG,SAAAC,OAAAA,CAAMC,MAAM,EAAA;AAAA,MAAA,IAAAC,eAAA,EAAAC,iBAAA,EAAAC,OAAA,EAAAC,QAAA,CAAA;AAAA,MAAA,OAAAP,mBAAA,CAAAQ,IAAA,CAAA,SAAAC,SAAAC,QAAA,EAAA;AAAA,QAAA,OAAA,CAAA,EAAA,QAAAA,QAAA,CAAAC,IAAA,GAAAD,QAAA,CAAAE,IAAA;AAAA,UAAA,KAAA,CAAA;AAAA,YAAA,IAAA,CACnCC,4BAA4B,EAAA;AAAAH,cAAAA,QAAA,CAAAE,IAAA,GAAA,CAAA,CAAA;AAAA,cAAA,MAAA;AAAA,aAAA;AAC9BvB,YAAAA,aAAa,CAACd,UAAU,CAAC4B,MAAM,EAAE;AAAEZ,cAAAA,QAAQ,EAAE;gBAAE5B,GAAG,EAAEwC,MAAM,CAACxC,GAAAA;AAAI,eAAA;AAAE,aAAC,CAAC,CAAC,CAAA;YAAC,OAAA+C,QAAA,CAAAI,MAAA,CAAA,QAAA,CAAA,CAAA;AAAA,UAAA,KAAA,CAAA;YAKjEV,eAAe,GAAG,SAAlBA,eAAeA,GAAA;cAAA,OAAU;AAC7BnB,gBAAAA,QAAQ,EAAEO,qBAAqB,CAACW,MAAM,CAACY,IAAI,CAAC;gBAC5CC,SAAS,EAAEb,MAAM,CAACjB,IAAI;gBACtB+B,YAAY,EAAEd,MAAM,CAACe,QAAQ;gBAC7BC,QAAQ,EAAEhB,MAAM,CAACiB,MAAM;AACvB7B,gBAAAA,QAAQ,EAAEY,MAAM;AAChBkB,gBAAAA,YAAY,EAAE,YAAA;eACf,CAAA;aAAC,CAAA;YAEIhB,iBAAiB,GAAG,SAApBA,iBAAiBA,GAAA;cAAA,OAAU;AAC/BpB,gBAAAA,QAAQ,EAAEO,qBAAqB,CAACW,MAAM,CAAClB,QAAQ,CAAC;gBAChDgC,YAAY,EAAEd,MAAM,CAACR,WAAW;gBAChCqB,SAAS,EAAEb,MAAM,CAACT,QAAQ;gBAC1ByB,QAAQ,EAAEhB,MAAM,CAACmB,EAAE;AACnB/B,gBAAAA,QAAQ,EAAAgC,aAAA,CAAAA,aAAA,CACHpB,EAAAA,EAAAA,MAAM,CAACZ,QAAQ,CAAA,EAAA,EAAA,EAAA;kBAClB5B,GAAG,EAAE6D,2BAA2B,CAACrB,MAAM,CAACsB,QAAQ,CAAC,CAAC,CAAC,CAAC;AACpDC,kBAAAA,SAAS,EAAE,KAAA;iBACZ,CAAA;AACDL,gBAAAA,YAAY,EAAE,kBAAA;eACf,CAAA;aAAC,CAAA;YAEIf,OAAO,GAAG7B,yBAAyB,GACrC4B,iBAAiB,EAAE,GACnBD,eAAe,EAAE,CAAA;AAAAM,YAAAA,QAAA,CAAAE,IAAA,GAAA,CAAA,CAAA;AAAA,YAAA,OAEExC,UAAU,CAACkC,OAAO,EAAE,EAAE,CAAC,CAAA;AAAA,UAAA,KAAA,CAAA;YAAxCC,QAAQ,GAAAG,QAAA,CAAAiB,IAAA,CAAA;YACdtC,aAAa,CAACkB,QAAQ,CAAC,CAAA;AAAC,UAAA,KAAA,EAAA,CAAA;AAAA,UAAA,KAAA,KAAA;YAAA,OAAAG,QAAA,CAAAkB,IAAA,EAAA,CAAA;AAAA,SAAA;AAAA,OAAA,EAAA1B,OAAA,CAAA,CAAA;KACzB,CAAA,CAAA,CAAA;IAAA,OAnCKL,SAAAA,oBAAoBA,CAAAgC,EAAA,EAAA;AAAA,MAAA,OAAA/B,KAAA,CAAAgC,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA,CAAA;AAAA,KAAA,CAAA;GAmCzB,EAAA,CAAA;EAED,IAAAC,iBAAA,GAAuBC,gBAAgB,CAAC;AACtCvF,MAAAA,gBAAgB,EAAEmD,oBAAAA;AACpB,KAAC,CAAC;IAFMqC,UAAU,GAAAF,iBAAA,CAAVE,UAAU,CAAA;EAIlB,IAAMC,OAAO,GAAG,CACd;IACEnD,GAAG,EAAEoD,WAAW,CAACC,KAAK;AACtBC,IAAAA,KAAK,EAAErE,CAAC,CAAC,6CAA6C,CAAC;IACvDsE,OAAO,EAAE,SAATA,OAAOA,GAAA;MAAA,OAAQ9E,qBAAqB,CAAC,IAAI,CAAC,CAAA;AAAA,KAAA;AAC1C,IAAA,SAAS,EAAE,0CAAA;AACb,GAAC,EACD;IACEuB,GAAG,EAAEoD,WAAW,CAACI,MAAM;AACvBF,IAAAA,KAAK,EAAErE,CAAC,CAAC,uCAAuC,CAAC;AACjDsE,IAAAA,OAAO,EAAE1D,YAAY;AACrB,IAAA,SAAS,EAAE,8BAAA;AACb,GAAC,CACF,CAAA;AAED,EAAA,oBACE4D,IAAA,CAAA,KAAA,EAAA;AAAK5F,IAAAA,SAAS,EAAE6F,UAAU,CAAC7F,SAAS,EAAE;AAAE,MAAA,gBAAgB,EAAE,IAAA;AAAK,KAAC,CAAE;IAAA8F,QAAA,EAAA,CAC/DC,eAAe,CAAC/E,KAAK,CAACF,GAAG,CAAC,gBACzB8E,IAAA,CAAA,KAAA,EAAA;AACE5F,MAAAA,SAAS,EAAEgG,uBAAwB;AACnC,MAAA,SAAA,EAAQ,wBAAwB;MAAAF,QAAA,EAAA,cAEhCG,GAAA,CAACC,iBAAiB,EAAA;AAChBlG,QAAAA,SAAS,EAAC,eAAe;AACzB,QAAA,SAAA,EAAQ,gBAAgB;QACxBE,GAAG,EAAEc,KAAK,CAACF,GAAAA;AAAI,OAChB,CAAC,eACFmF,GAAA,CAACzG,QAAQ,EAAA;AACP2G,QAAAA,UAAU,EAAC,OAAO;AAClBC,QAAAA,WAAW,EAAC,UAAU;AACtBC,QAAAA,IAAI,EAAEC,cAAe;AACrBC,QAAAA,WAAW,EAAE;AACX;AACAvG,UAAAA,SAAS,EAAE,qCAAA;SACX;QAAA8F,QAAA,eAEFG,GAAA,CAAC1G,IAAI,EAAA;AAAAuG,UAAAA,QAAA,EACFR,OAAO,CAACkB,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,YAAA,IAAGtE,GAAG,GAAAsE,KAAA,CAAHtE,GAAG;cAAEsD,KAAK,GAAAgB,KAAA,CAALhB,KAAK;AAAKiB,cAAAA,UAAU,GAAAC,wBAAA,CAAAF,KAAA,EAAAG,SAAA,CAAA,CAAA;YAAA,oBACvCC,aAAA,CAACpH,QAAQ,CAACqH,MAAM,EAAApC,aAAA,CAAAA,aAAA,CAAA,EAAA,EAAKgC,UAAU,CAAA,EAAA,EAAA,EAAA;AAAEvE,cAAAA,GAAG,EAAEA,GAAAA;AAAI,aAAA,CAAA,EACvCsD,KACc,CAAC,CAAA;WACnB,CAAA;SACG,CAAA;AAAC,OACC,CAAC,CAAA;AAAA,KACR,CAAC,gBAENQ,GAAA,CAACc,iBAAiB,EAAA;AACVnG,MAAAA,qBAAqB,EAArBA,qBAAqB;AAC3BoG,MAAAA,UAAU,EAAEC,SAAS,CAAC3G,gBAAgB,CAAE;AACxCF,MAAAA,YAAY,EAAEqB,wBAAyB;AACvCyF,MAAAA,MAAM,EAAE7B,UAAAA;AAAW,KACpB,CACF,eACDY,GAAA,CAACkB,KAAY,EAAA;AACL7G,MAAAA,gBAAgB,EAAhBA,gBAAgB;AACtB8G,MAAAA,MAAM,EAAEzG,kBAAmB;AAC3BP,MAAAA,YAAY,EAAEqB,wBAAyB;MACvC4F,OAAO,EAAE,SAATA,OAAOA,GAAA;QAAA,OAAQzG,qBAAqB,CAAC,KAAK,CAAC,CAAA;OAAC;AAC5Cf,MAAAA,gBAAgB,EAAEkD,+BAAAA;AAAgC,KACnD,CAAC,CAAA;AAAA,GACC,CAAC,CAAA;AAEV;;;;"}
|
|
1
|
+
{"version":3,"file":"ImageUploader.js","sources":["../app/javascript/src/components/ImageUploader/index.jsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport classnames from \"classnames\";\nimport { isPresent, noop } from \"neetocist\";\nimport { globalProps } from \"neetocommons/initializers\";\nimport { MenuHorizontal } from \"neetoicons\";\nimport { Dropdown } from \"neetoui\";\nimport { mergeRight } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport ImageDirectUpload from \"components/common/ImageDirectUpload\";\nimport ImageWithFallback from \"components/common/ImageWithFallback\";\nimport { IMAGE_WRAPPER_CLASSNAME } from \"components/constants\";\nimport { isNotNilOrEmpty } from \"components/ImageEditor/utils\";\nimport AssetLibrary from \"components/Modal\";\nimport { constructCloudflareImageURL } from \"components/utils\";\nimport { useCreateBlob } from \"hooks/useDirectUploads\";\nimport useImageUploader from \"hooks/useImageUploader\";\nimport { generateASCIIFileName } from \"hooks/utils\";\nimport { CLOUD_FLARE, IS_DEVELOPMENT_OR_HEROKU_ENV } from \"src/constants\";\n\nimport { DEFAULT_UPLOAD_CONFIG, OPTION_KEYS } from \"./constants\";\n\nconst { Menu, MenuItem } = Dropdown;\n\nconst ImageUploader = ({\n onUploadComplete = noop,\n className = \"\",\n src = \"\",\n uploadConfig = {},\n fixedAspectRatio = {},\n defaultImageSize = {},\n}) => {\n const [isAssetLibraryOpen, setIsAssetLibraryOpen] = useState(false);\n const [image, setImage] = useState({ url: src });\n\n const { t } = useTranslation();\n\n const { mutateAsync: createBlob } = useCreateBlob();\n\n const uploadConfigWithDefaults = mergeRight(\n DEFAULT_UPLOAD_CONFIG,\n uploadConfig\n );\n\n const isCloudFlareImageUploader =\n globalProps.assetsUploaderService === CLOUD_FLARE;\n\n const handleDelete = () => {\n setImage({});\n onChange({\n url: \"\",\n signedId: \"\",\n key: \"\",\n filename: \"\",\n size: \"\",\n type: \"\",\n });\n };\n\n const onChange = file => onUploadComplete(file);\n\n const handleSuccess = attachedImage => {\n setImage(mergeRight(image, { url: attachedImage.metadata.url }));\n onChange({\n filename: generateASCIIFileName(attachedImage.filename),\n key: attachedImage.key,\n url: attachedImage.blobUrl,\n signedId: attachedImage.signedId,\n size: attachedImage.byteSize,\n type: attachedImage.contentType,\n });\n };\n\n const handleImageSelectionFromLibrary = image => {\n setImage(image);\n onChange(image);\n };\n\n const handleUploadComplete = async result => {\n if (IS_DEVELOPMENT_OR_HEROKU_ENV) {\n handleSuccess(mergeRight(result, { metadata: { url: result.url } }));\n\n return;\n }\n\n const imageKitPayload = () => ({\n filename: generateASCIIFileName(result.name),\n byte_size: result.size,\n content_type: result.fileType,\n checksum: result.fileId,\n metadata: result,\n service_name: \"imagekitio\",\n });\n\n const cloudFlarePayload = () => ({\n filename: generateASCIIFileName(result.filename),\n content_type: result.contentType,\n byte_size: result.byteSize,\n checksum: result.id,\n metadata: {\n ...result.metadata,\n url: constructCloudflareImageURL(result.variants[0]),\n isCropped: false,\n },\n service_name: \"cloudflare_image\",\n });\n\n const payload = isCloudFlareImageUploader\n ? cloudFlarePayload()\n : imageKitPayload();\n\n const response = await createBlob(payload, {});\n handleSuccess(response);\n };\n\n const { uploadFile } = useImageUploader({\n onUploadComplete: handleUploadComplete,\n });\n\n const options = [\n {\n key: OPTION_KEYS.asset,\n label: t(\"neetoImageUploader.imageUpload.imageLibrary\"),\n onClick: () => setIsAssetLibraryOpen(true),\n \"data-cy\": \"image-uploader-open-image-library-button\",\n },\n {\n key: OPTION_KEYS.remove,\n label: t(\"neetoImageUploader.imageUpload.remove\"),\n onClick: handleDelete,\n \"data-cy\": \"image-uploader-remove-button\",\n },\n ];\n\n return (\n <div className={classnames(className, { \"cursor-pointer\": true })}>\n {isNotNilOrEmpty(image.url) ? (\n <div\n className={IMAGE_WRAPPER_CLASSNAME}\n data-cy=\"image-uploader-wrapper\"\n >\n <ImageWithFallback\n className=\"h-full w-full\"\n data-cy=\"uploaded-image\"\n src={image.url}\n />\n <Dropdown\n buttonSize=\"small\"\n buttonStyle=\"tertiary\"\n icon={MenuHorizontal}\n buttonProps={{\n // eslint-disable-next-line @bigbinary/neeto/use-neetoui-classes\n className: \"absolute right-3 top-3 rounded-full\",\n }}\n >\n <Menu>\n {options.map(({ key, label, ...otherProps }) => (\n <MenuItem.Button {...otherProps} key={key}>\n {label}\n </MenuItem.Button>\n ))}\n </Menu>\n </Dropdown>\n </div>\n ) : (\n <ImageDirectUpload\n {...{ defaultImageSize, setIsAssetLibraryOpen }}\n isDisabled={isPresent(fixedAspectRatio)}\n uploadConfig={uploadConfigWithDefaults}\n onDrop={uploadFile}\n />\n )}\n <AssetLibrary\n {...{ defaultImageSize, fixedAspectRatio }}\n isOpen={isAssetLibraryOpen}\n uploadConfig={uploadConfigWithDefaults}\n onClose={() => setIsAssetLibraryOpen(false)}\n onUploadComplete={handleImageSelectionFromLibrary}\n />\n </div>\n );\n};\n\nexport default ImageUploader;\n"],"names":["Menu","Dropdown","MenuItem","ImageUploader","_ref","_ref$onUploadComplete","onUploadComplete","noop","_ref$className","className","_ref$src","src","_ref$uploadConfig","uploadConfig","_ref$fixedAspectRatio","fixedAspectRatio","_ref$defaultImageSize","defaultImageSize","_useState","useState","_useState2","_slicedToArray","isAssetLibraryOpen","setIsAssetLibraryOpen","_useState3","url","_useState4","image","setImage","_useTranslation","useTranslation","t","_useCreateBlob","useCreateBlob","createBlob","mutateAsync","uploadConfigWithDefaults","mergeRight","DEFAULT_UPLOAD_CONFIG","isCloudFlareImageUploader","globalProps","assetsUploaderService","CLOUD_FLARE","handleDelete","onChange","signedId","key","filename","size","type","file","handleSuccess","attachedImage","metadata","generateASCIIFileName","blobUrl","byteSize","contentType","handleImageSelectionFromLibrary","handleUploadComplete","_ref2","_asyncToGenerator","_regeneratorRuntime","mark","_callee","result","imageKitPayload","cloudFlarePayload","payload","response","wrap","_callee$","_context","prev","next","IS_DEVELOPMENT_OR_HEROKU_ENV","abrupt","name","byte_size","content_type","fileType","checksum","fileId","service_name","id","_objectSpread","constructCloudflareImageURL","variants","isCropped","sent","stop","_x","apply","arguments","_useImageUploader","useImageUploader","uploadFile","options","OPTION_KEYS","asset","label","onClick","remove","_jsxs","classnames","children","isNotNilOrEmpty","IMAGE_WRAPPER_CLASSNAME","_jsx","ImageWithFallback","buttonSize","buttonStyle","icon","MenuHorizontal","buttonProps","map","_ref3","otherProps","_objectWithoutProperties","_excluded","_createElement","Button","ImageDirectUpload","isDisabled","isPresent","onDrop","AssetLibrary","isOpen","onClose"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBA,IAAQA,IAAI,GAAeC,QAAQ,CAA3BD,IAAI;EAAEE,QAAQ,GAAKD,QAAQ,CAArBC,QAAQ;AAEtB,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAAC,IAAA,EAOb;AAAA,EAAA,IAAAC,qBAAA,GAAAD,IAAA,CANJE,gBAAgB;AAAhBA,IAAAA,gBAAgB,GAAAD,qBAAA,KAAGE,KAAAA,CAAAA,GAAAA,IAAI,GAAAF,qBAAA;IAAAG,cAAA,GAAAJ,IAAA,CACvBK,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAE,QAAA,GAAAN,IAAA,CACdO,GAAG;AAAHA,IAAAA,GAAG,GAAAD,QAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,QAAA;IAAAE,iBAAA,GAAAR,IAAA,CACRS,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,iBAAA;IAAAE,qBAAA,GAAAV,IAAA,CACjBW,gBAAgB;AAAhBA,IAAAA,gBAAgB,GAAAD,qBAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,qBAAA;IAAAE,qBAAA,GAAAZ,IAAA,CACrBa,gBAAgB;AAAhBA,IAAAA,gBAAgB,GAAAD,qBAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,qBAAA;AAErB,EAAA,IAAAE,SAAA,GAAoDC,QAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAA5DI,IAAAA,kBAAkB,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,qBAAqB,GAAAH,UAAA,CAAA,CAAA,CAAA;EAChD,IAAAI,UAAA,GAA0BL,QAAQ,CAAC;AAAEM,MAAAA,GAAG,EAAEd;AAAI,KAAC,CAAC;IAAAe,UAAA,GAAAL,cAAA,CAAAG,UAAA,EAAA,CAAA,CAAA;AAAzCG,IAAAA,KAAK,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,QAAQ,GAAAF,UAAA,CAAA,CAAA,CAAA;AAEtB,EAAA,IAAAG,eAAA,GAAcC,cAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC;AAET,EAAA,IAAAC,cAAA,GAAoCC,aAAa,EAAE;IAA9BC,UAAU,GAAAF,cAAA,CAAvBG,WAAW;AAEnB,EAAA,IAAMC,wBAAwB,GAAGC,UAAU,CACzCC,qBAAqB,EACrBzB,YACF,CAAC;AAED,EAAA,IAAM0B,yBAAyB,GAC7BC,WAAW,CAACC,qBAAqB,KAAKC,WAAW;AAEnD,EAAA,IAAMC,YAAY,GAAG,SAAfA,YAAYA,GAAS;IACzBf,QAAQ,CAAC,EAAE,CAAC;AACZgB,IAAAA,QAAQ,CAAC;AACPnB,MAAAA,GAAG,EAAE,EAAE;AACPoB,MAAAA,QAAQ,EAAE,EAAE;AACZC,MAAAA,GAAG,EAAE,EAAE;AACPC,MAAAA,QAAQ,EAAE,EAAE;AACZC,MAAAA,IAAI,EAAE,EAAE;AACRC,MAAAA,IAAI,EAAE;AACR,KAAC,CAAC;GACH;AAED,EAAA,IAAML,QAAQ,GAAG,SAAXA,QAAQA,CAAGM,IAAI,EAAA;IAAA,OAAI5C,gBAAgB,CAAC4C,IAAI,CAAC;AAAA,GAAA;AAE/C,EAAA,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAGC,aAAa,EAAI;AACrCxB,IAAAA,QAAQ,CAACS,UAAU,CAACV,KAAK,EAAE;AAAEF,MAAAA,GAAG,EAAE2B,aAAa,CAACC,QAAQ,CAAC5B;AAAI,KAAC,CAAC,CAAC;AAChEmB,IAAAA,QAAQ,CAAC;AACPG,MAAAA,QAAQ,EAAEO,qBAAqB,CAACF,aAAa,CAACL,QAAQ,CAAC;MACvDD,GAAG,EAAEM,aAAa,CAACN,GAAG;MACtBrB,GAAG,EAAE2B,aAAa,CAACG,OAAO;MAC1BV,QAAQ,EAAEO,aAAa,CAACP,QAAQ;MAChCG,IAAI,EAAEI,aAAa,CAACI,QAAQ;MAC5BP,IAAI,EAAEG,aAAa,CAACK;AACtB,KAAC,CAAC;GACH;AAED,EAAA,IAAMC,+BAA+B,GAAG,SAAlCA,+BAA+BA,CAAG/B,KAAK,EAAI;IAC/CC,QAAQ,CAACD,KAAK,CAAC;IACfiB,QAAQ,CAACjB,KAAK,CAAC;GAChB;AAED,EAAA,IAAMgC,oBAAoB,gBAAA,YAAA;IAAA,IAAAC,KAAA,GAAAC,iBAAA,cAAAC,mBAAA,CAAAC,IAAA,CAAG,SAAAC,OAAAA,CAAMC,MAAM,EAAA;AAAA,MAAA,IAAAC,eAAA,EAAAC,iBAAA,EAAAC,OAAA,EAAAC,QAAA;AAAA,MAAA,OAAAP,mBAAA,CAAAQ,IAAA,CAAA,SAAAC,SAAAC,QAAA,EAAA;AAAA,QAAA,OAAA,CAAA,EAAA,QAAAA,QAAA,CAAAC,IAAA,GAAAD,QAAA,CAAAE,IAAA;AAAA,UAAA,KAAA,CAAA;AAAA,YAAA,IAAA,CACnCC,4BAA4B,EAAA;AAAAH,cAAAA,QAAA,CAAAE,IAAA,GAAA,CAAA;AAAA,cAAA;AAAA;AAC9BvB,YAAAA,aAAa,CAACd,UAAU,CAAC4B,MAAM,EAAE;AAAEZ,cAAAA,QAAQ,EAAE;gBAAE5B,GAAG,EAAEwC,MAAM,CAACxC;AAAI;AAAE,aAAC,CAAC,CAAC;YAAC,OAAA+C,QAAA,CAAAI,MAAA,CAAA,QAAA,CAAA;AAAA,UAAA,KAAA,CAAA;YAKjEV,eAAe,GAAG,SAAlBA,eAAeA,GAAA;cAAA,OAAU;AAC7BnB,gBAAAA,QAAQ,EAAEO,qBAAqB,CAACW,MAAM,CAACY,IAAI,CAAC;gBAC5CC,SAAS,EAAEb,MAAM,CAACjB,IAAI;gBACtB+B,YAAY,EAAEd,MAAM,CAACe,QAAQ;gBAC7BC,QAAQ,EAAEhB,MAAM,CAACiB,MAAM;AACvB7B,gBAAAA,QAAQ,EAAEY,MAAM;AAChBkB,gBAAAA,YAAY,EAAE;eACf;aAAC;YAEIhB,iBAAiB,GAAG,SAApBA,iBAAiBA,GAAA;cAAA,OAAU;AAC/BpB,gBAAAA,QAAQ,EAAEO,qBAAqB,CAACW,MAAM,CAAClB,QAAQ,CAAC;gBAChDgC,YAAY,EAAEd,MAAM,CAACR,WAAW;gBAChCqB,SAAS,EAAEb,MAAM,CAACT,QAAQ;gBAC1ByB,QAAQ,EAAEhB,MAAM,CAACmB,EAAE;AACnB/B,gBAAAA,QAAQ,EAAAgC,aAAA,CAAAA,aAAA,CACHpB,EAAAA,EAAAA,MAAM,CAACZ,QAAQ,CAAA,EAAA,EAAA,EAAA;kBAClB5B,GAAG,EAAE6D,2BAA2B,CAACrB,MAAM,CAACsB,QAAQ,CAAC,CAAC,CAAC,CAAC;AACpDC,kBAAAA,SAAS,EAAE;iBACZ,CAAA;AACDL,gBAAAA,YAAY,EAAE;eACf;aAAC;YAEIf,OAAO,GAAG7B,yBAAyB,GACrC4B,iBAAiB,EAAE,GACnBD,eAAe,EAAE;AAAAM,YAAAA,QAAA,CAAAE,IAAA,GAAA,CAAA;AAAA,YAAA,OAEExC,UAAU,CAACkC,OAAO,EAAE,EAAE,CAAC;AAAA,UAAA,KAAA,CAAA;YAAxCC,QAAQ,GAAAG,QAAA,CAAAiB,IAAA;YACdtC,aAAa,CAACkB,QAAQ,CAAC;AAAC,UAAA,KAAA,EAAA;AAAA,UAAA,KAAA,KAAA;YAAA,OAAAG,QAAA,CAAAkB,IAAA,EAAA;AAAA;AAAA,OAAA,EAAA1B,OAAA,CAAA;KACzB,CAAA,CAAA;IAAA,OAnCKL,SAAAA,oBAAoBA,CAAAgC,EAAA,EAAA;AAAA,MAAA,OAAA/B,KAAA,CAAAgC,KAAA,CAAA,IAAA,EAAAC,SAAA,CAAA;AAAA,KAAA;GAmCzB,EAAA;EAED,IAAAC,iBAAA,GAAuBC,gBAAgB,CAAC;AACtCzF,MAAAA,gBAAgB,EAAEqD;AACpB,KAAC,CAAC;IAFMqC,UAAU,GAAAF,iBAAA,CAAVE,UAAU;EAIlB,IAAMC,OAAO,GAAG,CACd;IACEnD,GAAG,EAAEoD,WAAW,CAACC,KAAK;AACtBC,IAAAA,KAAK,EAAErE,CAAC,CAAC,6CAA6C,CAAC;IACvDsE,OAAO,EAAE,SAATA,OAAOA,GAAA;MAAA,OAAQ9E,qBAAqB,CAAC,IAAI,CAAC;AAAA,KAAA;AAC1C,IAAA,SAAS,EAAE;AACb,GAAC,EACD;IACEuB,GAAG,EAAEoD,WAAW,CAACI,MAAM;AACvBF,IAAAA,KAAK,EAAErE,CAAC,CAAC,uCAAuC,CAAC;AACjDsE,IAAAA,OAAO,EAAE1D,YAAY;AACrB,IAAA,SAAS,EAAE;AACb,GAAC,CACF;AAED,EAAA,oBACE4D,IAAA,CAAA,KAAA,EAAA;AAAK9F,IAAAA,SAAS,EAAE+F,UAAU,CAAC/F,SAAS,EAAE;AAAE,MAAA,gBAAgB,EAAE;AAAK,KAAC,CAAE;IAAAgG,QAAA,EAAA,CAC/DC,eAAe,CAAC/E,KAAK,CAACF,GAAG,CAAC,gBACzB8E,IAAA,CAAA,KAAA,EAAA;AACE9F,MAAAA,SAAS,EAAEkG,uBAAwB;AACnC,MAAA,SAAA,EAAQ,wBAAwB;MAAAF,QAAA,EAAA,cAEhCG,GAAA,CAACC,iBAAiB,EAAA;AAChBpG,QAAAA,SAAS,EAAC,eAAe;AACzB,QAAA,SAAA,EAAQ,gBAAgB;QACxBE,GAAG,EAAEgB,KAAK,CAACF;AAAI,OAChB,CAAC,eACFmF,GAAA,CAAC3G,QAAQ,EAAA;AACP6G,QAAAA,UAAU,EAAC,OAAO;AAClBC,QAAAA,WAAW,EAAC,UAAU;AACtBC,QAAAA,IAAI,EAAEC,cAAe;AACrBC,QAAAA,WAAW,EAAE;AACX;AACAzG,UAAAA,SAAS,EAAE;SACX;QAAAgG,QAAA,eAEFG,GAAA,CAAC5G,IAAI,EAAA;AAAAyG,UAAAA,QAAA,EACFR,OAAO,CAACkB,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,YAAA,IAAGtE,GAAG,GAAAsE,KAAA,CAAHtE,GAAG;cAAEsD,KAAK,GAAAgB,KAAA,CAALhB,KAAK;AAAKiB,cAAAA,UAAU,GAAAC,wBAAA,CAAAF,KAAA,EAAAG,SAAA,CAAA;YAAA,oBACvCC,aAAA,CAACtH,QAAQ,CAACuH,MAAM,EAAApC,aAAA,CAAAA,aAAA,CAAA,EAAA,EAAKgC,UAAU,CAAA,EAAA,EAAA,EAAA;AAAEvE,cAAAA,GAAG,EAAEA;AAAI,aAAA,CAAA,EACvCsD,KACc,CAAC;WACnB;SACG;AAAC,OACC,CAAC;AAAA,KACR,CAAC,gBAENQ,GAAA,CAACc,iBAAiB,EAAA;AACVzG,MAAAA,gBAAgB,EAAhBA,gBAAgB;AAAEM,MAAAA,qBAAqB,EAArBA,qBAAqB;AAC7CoG,MAAAA,UAAU,EAAEC,SAAS,CAAC7G,gBAAgB,CAAE;AACxCF,MAAAA,YAAY,EAAEuB,wBAAyB;AACvCyF,MAAAA,MAAM,EAAE7B;AAAW,KACpB,CACF,eACDY,GAAA,CAACkB,KAAY,EAAA;AACL7G,MAAAA,gBAAgB,EAAhBA,gBAAgB;AAAEF,MAAAA,gBAAgB,EAAhBA,gBAAgB;AACxCgH,MAAAA,MAAM,EAAEzG,kBAAmB;AAC3BT,MAAAA,YAAY,EAAEuB,wBAAyB;MACvC4F,OAAO,EAAE,SAATA,OAAOA,GAAA;QAAA,OAAQzG,qBAAqB,CAAC,KAAK,CAAC;OAAC;AAC5CjB,MAAAA,gBAAgB,EAAEoD;AAAgC,KACnD,CAAC;AAAA,GACC,CAAC;AAEV;;;;"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
2
|
+
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
3
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
4
|
+
import { useState, useEffect } from 'react';
|
|
5
|
+
import classnames from 'classnames';
|
|
6
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
var _excluded$1 = ["className"];
|
|
9
|
+
function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
10
|
+
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
11
|
+
var ImagePlaceholder = function ImagePlaceholder(_ref) {
|
|
12
|
+
var _ref$className = _ref.className,
|
|
13
|
+
className = _ref$className === void 0 ? "" : _ref$className,
|
|
14
|
+
props = _objectWithoutProperties(_ref, _excluded$1);
|
|
15
|
+
return /*#__PURE__*/jsx("div", _objectSpread$1({
|
|
16
|
+
className: classnames("neeto-ui-bg-gray-200", _defineProperty({}, className, className))
|
|
17
|
+
}, props));
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
var _excluded = ["src", "className", "fallback"];
|
|
21
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
22
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
23
|
+
var ImageWithFallback = function ImageWithFallback(_ref) {
|
|
24
|
+
var src = _ref.src,
|
|
25
|
+
_ref$className = _ref.className,
|
|
26
|
+
className = _ref$className === void 0 ? "h-full w-full" : _ref$className,
|
|
27
|
+
_ref$fallback = _ref.fallback,
|
|
28
|
+
Fallback = _ref$fallback === void 0 ? ImagePlaceholder : _ref$fallback,
|
|
29
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
30
|
+
var _useState = useState(false),
|
|
31
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
32
|
+
isLoaded = _useState2[0],
|
|
33
|
+
setIsLoaded = _useState2[1];
|
|
34
|
+
useEffect(function () {
|
|
35
|
+
var img = new Image();
|
|
36
|
+
img.onload = function () {
|
|
37
|
+
setIsLoaded(true);
|
|
38
|
+
};
|
|
39
|
+
img.src = src;
|
|
40
|
+
}, [src]);
|
|
41
|
+
return isLoaded ? /*#__PURE__*/jsx("img", _objectSpread(_objectSpread({}, _objectSpread({
|
|
42
|
+
src: src
|
|
43
|
+
}, props)), {}, {
|
|
44
|
+
className: "h-full w-auto object-contain"
|
|
45
|
+
})) : /*#__PURE__*/jsx(Fallback, _objectSpread({}, _objectSpread({
|
|
46
|
+
className: className
|
|
47
|
+
}, props)));
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
export { ImageWithFallback as I };
|
|
51
|
+
//# sourceMappingURL=ImageWithFallback-Csv6Oivd.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ImageWithFallback-Csv6Oivd.js","sources":["../app/javascript/src/components/common/ImagePlaceholder.jsx","../app/javascript/src/components/common/ImageWithFallback.jsx"],"sourcesContent":["import classnames from \"classnames\";\n\nconst ImagePlaceholder = ({ className = \"\", ...props }) => (\n <div\n className={classnames(\"neeto-ui-bg-gray-200\", {\n [className]: className,\n })}\n {...props}\n />\n);\n\nexport default ImagePlaceholder;\n","import { useEffect, useState } from \"react\";\n\nimport ImagePlaceholder from \"./ImagePlaceholder\";\n\nconst ImageWithFallback = ({\n src,\n className = \"h-full w-full\",\n fallback: Fallback = ImagePlaceholder,\n ...props\n}) => {\n const [isLoaded, setIsLoaded] = useState(false);\n\n useEffect(() => {\n const img = new Image();\n img.onload = () => {\n setIsLoaded(true);\n };\n img.src = src;\n }, [src]);\n\n return isLoaded ? (\n <img {...{ src, ...props }} className=\"h-full w-auto object-contain\" />\n ) : (\n <Fallback {...{ className, ...props }} />\n );\n};\n\nexport default ImageWithFallback;\n"],"names":["ImagePlaceholder","_ref","_ref$className","className","props","_objectWithoutProperties","_excluded","_jsx","_objectSpread","classnames","_defineProperty","ImageWithFallback","src","_ref$fallback","fallback","Fallback","_useState","useState","_useState2","_slicedToArray","isLoaded","setIsLoaded","useEffect","img","Image","onload"],"mappings":";;;;;;;;;;AAEA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,cAAA,GAAAD,IAAA,CAAME,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;AAAKE,IAAAA,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,WAAA,CAAA;EAAA,oBAClDC,GAAA,QAAAC,eAAA,CAAA;IACEL,SAAS,EAAEM,UAAU,CAAC,sBAAsB,EAAAC,eAAA,CACzCP,EAAAA,EAAAA,SAAS,EAAGA,SAAS,CACvB;GACGC,EAAAA,KAAK,CACV,CAAC;AAAA,CACH;;;;;ACLD,IAAMO,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAV,IAAA,EAKjB;AAAA,EAAA,IAJJW,GAAG,GAAAX,IAAA,CAAHW,GAAG;IAAAV,cAAA,GAAAD,IAAA,CACHE,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,eAAe,GAAAA,cAAA;IAAAW,aAAA,GAAAZ,IAAA,CAC3Ba,QAAQ;AAAEC,IAAAA,QAAQ,GAAAF,aAAA,KAAGb,KAAAA,CAAAA,GAAAA,gBAAgB,GAAAa,aAAA;AAClCT,IAAAA,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA,CAAA;AAER,EAAA,IAAAU,SAAA,GAAgCC,QAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAxCI,IAAAA,QAAQ,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,WAAW,GAAAH,UAAA,CAAA,CAAA,CAAA;AAE5BI,EAAAA,SAAS,CAAC,YAAM;AACd,IAAA,IAAMC,GAAG,GAAG,IAAIC,KAAK,EAAE;IACvBD,GAAG,CAACE,MAAM,GAAG,YAAM;MACjBJ,WAAW,CAAC,IAAI,CAAC;KAClB;IACDE,GAAG,CAACX,GAAG,GAAGA,GAAG;AACf,GAAC,EAAE,CAACA,GAAG,CAAC,CAAC;EAET,OAAOQ,QAAQ,gBACbb,GAAA,CAAA,KAAA,EAAAC,aAAA,CAAAA,aAAA,KAAAA,aAAA,CAAA;AAAWI,IAAAA,GAAG,EAAHA;AAAG,GAAA,EAAKR,KAAK,CAAA,CAAA,EAAA,EAAA,EAAA;AAAID,IAAAA,SAAS,EAAC;GAAgC,CAAA,CAAC,gBAEvEI,GAAA,CAACQ,QAAQ,EAAAP,aAAA,KAAAA,aAAA,CAAA;AAAOL,IAAAA,SAAS,EAATA;GAAcC,EAAAA,KAAK,EAAK,CACzC;AACH;;;;"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
|
+
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
5
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
6
|
+
var g = require('react');
|
|
7
|
+
var classnames = require('classnames');
|
|
8
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
+
|
|
10
|
+
var _excluded$1 = ["className"];
|
|
11
|
+
function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
12
|
+
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
13
|
+
var ImagePlaceholder = function ImagePlaceholder(_ref) {
|
|
14
|
+
var _ref$className = _ref.className,
|
|
15
|
+
className = _ref$className === void 0 ? "" : _ref$className,
|
|
16
|
+
props = _objectWithoutProperties(_ref, _excluded$1);
|
|
17
|
+
return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$1({
|
|
18
|
+
className: classnames("neeto-ui-bg-gray-200", _defineProperty({}, className, className))
|
|
19
|
+
}, props));
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
var _excluded = ["src", "className", "fallback"];
|
|
23
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
24
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
25
|
+
var ImageWithFallback = function ImageWithFallback(_ref) {
|
|
26
|
+
var src = _ref.src,
|
|
27
|
+
_ref$className = _ref.className,
|
|
28
|
+
className = _ref$className === void 0 ? "h-full w-full" : _ref$className,
|
|
29
|
+
_ref$fallback = _ref.fallback,
|
|
30
|
+
Fallback = _ref$fallback === void 0 ? ImagePlaceholder : _ref$fallback,
|
|
31
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
32
|
+
var _useState = g.useState(false),
|
|
33
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
34
|
+
isLoaded = _useState2[0],
|
|
35
|
+
setIsLoaded = _useState2[1];
|
|
36
|
+
g.useEffect(function () {
|
|
37
|
+
var img = new Image();
|
|
38
|
+
img.onload = function () {
|
|
39
|
+
setIsLoaded(true);
|
|
40
|
+
};
|
|
41
|
+
img.src = src;
|
|
42
|
+
}, [src]);
|
|
43
|
+
return isLoaded ? /*#__PURE__*/jsxRuntime.jsx("img", _objectSpread(_objectSpread({}, _objectSpread({
|
|
44
|
+
src: src
|
|
45
|
+
}, props)), {}, {
|
|
46
|
+
className: "h-full w-auto object-contain"
|
|
47
|
+
})) : /*#__PURE__*/jsxRuntime.jsx(Fallback, _objectSpread({}, _objectSpread({
|
|
48
|
+
className: className
|
|
49
|
+
}, props)));
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
exports.ImageWithFallback = ImageWithFallback;
|
|
53
|
+
//# sourceMappingURL=ImageWithFallback-DzT_N2Su.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ImageWithFallback-DzT_N2Su.js","sources":["../app/javascript/src/components/common/ImagePlaceholder.jsx","../app/javascript/src/components/common/ImageWithFallback.jsx"],"sourcesContent":["import classnames from \"classnames\";\n\nconst ImagePlaceholder = ({ className = \"\", ...props }) => (\n <div\n className={classnames(\"neeto-ui-bg-gray-200\", {\n [className]: className,\n })}\n {...props}\n />\n);\n\nexport default ImagePlaceholder;\n","import { useEffect, useState } from \"react\";\n\nimport ImagePlaceholder from \"./ImagePlaceholder\";\n\nconst ImageWithFallback = ({\n src,\n className = \"h-full w-full\",\n fallback: Fallback = ImagePlaceholder,\n ...props\n}) => {\n const [isLoaded, setIsLoaded] = useState(false);\n\n useEffect(() => {\n const img = new Image();\n img.onload = () => {\n setIsLoaded(true);\n };\n img.src = src;\n }, [src]);\n\n return isLoaded ? (\n <img {...{ src, ...props }} className=\"h-full w-auto object-contain\" />\n ) : (\n <Fallback {...{ className, ...props }} />\n );\n};\n\nexport default ImageWithFallback;\n"],"names":["ImagePlaceholder","_ref","_ref$className","className","props","_objectWithoutProperties","_excluded","_jsx","_objectSpread","classnames","_defineProperty","ImageWithFallback","src","_ref$fallback","fallback","Fallback","_useState","useState","_useState2","_slicedToArray","isLoaded","setIsLoaded","useEffect","img","Image","onload"],"mappings":";;;;;;;;;;;;AAEA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,cAAA,GAAAD,IAAA,CAAME,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;AAAKE,IAAAA,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,WAAA,CAAA;EAAA,oBAClDC,cAAA,QAAAC,eAAA,CAAA;IACEL,SAAS,EAAEM,UAAU,CAAC,sBAAsB,EAAAC,eAAA,CACzCP,EAAAA,EAAAA,SAAS,EAAGA,SAAS,CACvB;GACGC,EAAAA,KAAK,CACV,CAAC;AAAA,CACH;;;;;ACLD,IAAMO,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAV,IAAA,EAKjB;AAAA,EAAA,IAJJW,GAAG,GAAAX,IAAA,CAAHW,GAAG;IAAAV,cAAA,GAAAD,IAAA,CACHE,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,eAAe,GAAAA,cAAA;IAAAW,aAAA,GAAAZ,IAAA,CAC3Ba,QAAQ;AAAEC,IAAAA,QAAQ,GAAAF,aAAA,KAAGb,KAAAA,CAAAA,GAAAA,gBAAgB,GAAAa,aAAA;AAClCT,IAAAA,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA,CAAA;AAER,EAAA,IAAAU,SAAA,GAAgCC,UAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAxCI,IAAAA,QAAQ,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,WAAW,GAAAH,UAAA,CAAA,CAAA,CAAA;AAE5BI,EAAAA,WAAS,CAAC,YAAM;AACd,IAAA,IAAMC,GAAG,GAAG,IAAIC,KAAK,EAAE;IACvBD,GAAG,CAACE,MAAM,GAAG,YAAM;MACjBJ,WAAW,CAAC,IAAI,CAAC;KAClB;IACDE,GAAG,CAACX,GAAG,GAAGA,GAAG;AACf,GAAC,EAAE,CAACA,GAAG,CAAC,CAAC;EAET,OAAOQ,QAAQ,gBACbb,cAAA,CAAA,KAAA,EAAAC,aAAA,CAAAA,aAAA,KAAAA,aAAA,CAAA;AAAWI,IAAAA,GAAG,EAAHA;AAAG,GAAA,EAAKR,KAAK,CAAA,CAAA,EAAA,EAAA,EAAA;AAAID,IAAAA,SAAS,EAAC;GAAgC,CAAA,CAAC,gBAEvEI,cAAA,CAACQ,QAAQ,EAAAP,aAAA,KAAAA,aAAA,CAAA;AAAOL,IAAAA,SAAS,EAATA;GAAcC,EAAAA,KAAK,EAAK,CACzC;AACH;;;;"}
|
package/dist/cjs/AssetLibrary.js
CHANGED
|
@@ -1,27 +1,27 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
require('@babel/runtime/helpers/objectWithoutProperties');
|
|
4
3
|
require('@babel/runtime/helpers/defineProperty');
|
|
5
4
|
require('@babel/runtime/helpers/slicedToArray');
|
|
6
5
|
require('react');
|
|
7
6
|
require('@bigbinary/neeto-cist');
|
|
8
7
|
require('@bigbinary/neeto-commons-frontend/initializers');
|
|
9
8
|
require('@bigbinary/neetoui/Modal');
|
|
10
|
-
require('@bigbinary/neetoui/Button');
|
|
11
9
|
require('@bigbinary/neetoui/Tab');
|
|
12
10
|
require('@bigbinary/neetoui/Spinner');
|
|
13
11
|
require('@bigbinary/neetoui/Toastr');
|
|
14
12
|
require('@bigbinary/neetoui/Typography');
|
|
15
13
|
require('ramda');
|
|
16
14
|
require('react-i18next');
|
|
17
|
-
require('../utils-
|
|
18
|
-
var AssetLibrary = require('../index-
|
|
15
|
+
require('../utils-C58No1u2.js');
|
|
16
|
+
var AssetLibrary = require('../index-BsGnAVUR.js');
|
|
19
17
|
require('../useImageUploader-Bm9TukCy.js');
|
|
20
18
|
require('../index-BtHfh_eu.js');
|
|
21
19
|
require('react/jsx-runtime');
|
|
20
|
+
require('classnames');
|
|
21
|
+
require('@bigbinary/neetoui/Button');
|
|
22
|
+
require('@bigbinary/neetoui/ProgressBar');
|
|
22
23
|
require('react-dropzone');
|
|
23
24
|
require('i18next');
|
|
24
|
-
require('classnames');
|
|
25
25
|
require('@bigbinary/neeto-icons/LeftArrow');
|
|
26
26
|
require('@tanstack/react-query');
|
|
27
27
|
require('axios');
|
|
@@ -29,6 +29,7 @@ require('@bigbinary/neeto-commons-frontend/react-utils');
|
|
|
29
29
|
require('@bigbinary/neeto-commons-frontend/utils');
|
|
30
30
|
require('@bigbinary/neetoui/Input');
|
|
31
31
|
require('@bigbinary/neetoui/Switch');
|
|
32
|
+
require('@bigbinary/neetoui/Label');
|
|
32
33
|
require('../query-B7ahlELA.js');
|
|
33
34
|
require('@bigbinary/neeto-icons/MenuHorizontal');
|
|
34
35
|
require('@bigbinary/neeto-team-members-frontend/constants');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetLibrary.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AssetLibrary.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -6,16 +6,16 @@ var classnames = require('classnames');
|
|
|
6
6
|
var neetoCist = require('@bigbinary/neeto-cist');
|
|
7
7
|
var Delete = require('@bigbinary/neeto-icons/Delete');
|
|
8
8
|
var Button = require('@bigbinary/neetoui/Button');
|
|
9
|
-
var
|
|
10
|
-
var
|
|
9
|
+
var utils = require('../utils-C58No1u2.js');
|
|
10
|
+
var ImageWithFallback = require('../ImageWithFallback-DzT_N2Su.js');
|
|
11
11
|
var jsxRuntime = require('react/jsx-runtime');
|
|
12
12
|
require('@bigbinary/neetoui/Typography');
|
|
13
13
|
require('@bigbinary/neetoui/ProgressBar');
|
|
14
14
|
require('ramda');
|
|
15
15
|
require('react-i18next');
|
|
16
|
+
require('@bigbinary/neeto-commons-frontend/initializers');
|
|
16
17
|
require('@babel/runtime/helpers/slicedToArray');
|
|
17
18
|
require('react');
|
|
18
|
-
require('@bigbinary/neeto-commons-frontend/initializers');
|
|
19
19
|
require('react-dropzone');
|
|
20
20
|
require('i18next');
|
|
21
21
|
require('@bigbinary/neetoui/Toastr');
|
|
@@ -61,7 +61,7 @@ var BasicImageUploader = function BasicImageUploader(_ref) {
|
|
|
61
61
|
size: "small",
|
|
62
62
|
onClick: onRemove
|
|
63
63
|
})]
|
|
64
|
-
}) : /*#__PURE__*/jsxRuntime.jsx(
|
|
64
|
+
}) : /*#__PURE__*/jsxRuntime.jsx(utils.ImageDirectUpload, _objectSpread({}, _objectSpread(_objectSpread({}, props), {}, {
|
|
65
65
|
isDisabled: isDisabled,
|
|
66
66
|
onDrop: onDrop
|
|
67
67
|
})))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasicImageUploader.js","sources":["../../app/javascript/src/components/BasicImageUploader.jsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Delete } from \"neetoicons\";\nimport { Button } from \"neetoui\";\n\nimport ImageDirectUpload from \"./common/ImageDirectUpload\";\nimport ImageWithFallback from \"./common/ImageWithFallback\";\nimport { IMAGE_WRAPPER_CLASSNAME } from \"./constants\";\nimport { isNilOrEmpty, isNotNilOrEmpty } from \"./ImageEditor/utils\";\n\nconst BasicImageUploader = ({\n src = \"\",\n className = \"\",\n imageFallbackProps = { alt: \"Uplaoded Image\", className: \"h-full w-full\" },\n onDrop = noop,\n isDisabled = false,\n onRemove = noop,\n ...props\n}) => (\n <div\n className={classnames(className, {\n \"cursor-pointer\": true,\n \"cursor-not-allowed\": isDisabled,\n \"opacity-70\": isDisabled && isNilOrEmpty(src),\n })}\n >\n {isNotNilOrEmpty(src) ? (\n <div className={IMAGE_WRAPPER_CLASSNAME}>\n <ImageWithFallback\n {...{ ...imageFallbackProps, src }}\n data-cy=\"uploaded-image\"\n />\n <Button\n className=\"absolute right-3 top-3\"\n data-cy=\"basic-image-uploader-remove-button\"\n disabled={isDisabled}\n icon={Delete}\n size=\"small\"\n onClick={onRemove}\n />\n </div>\n ) : (\n <ImageDirectUpload {...{ ...props, isDisabled, onDrop }} />\n )}\n </div>\n);\n\nexport default BasicImageUploader;\n"],"names":["BasicImageUploader","_ref","_ref$src","src","_ref$className","className","_ref$imageFallbackPro","imageFallbackProps","alt","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","_ref$onRemove","onRemove","props","_objectWithoutProperties","_excluded","_jsx","classnames","isNilOrEmpty","children","isNotNilOrEmpty","_jsxs","IMAGE_WRAPPER_CLASSNAME","ImageWithFallback","_objectSpread","Button","disabled","icon","Delete","size","onClick","ImageDirectUpload"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,QAAA,GAAAD,IAAA,CACtBE,GAAG;AAAHA,IAAAA,GAAG,GAAAD,QAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,QAAA;IAAAE,cAAA,GAAAH,IAAA,CACRI,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAE,qBAAA,GAAAL,IAAA,CACdM,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA;AAAEE,MAAAA,GAAG,EAAE,gBAAgB;AAAEH,MAAAA,SAAS,EAAE
|
|
1
|
+
{"version":3,"file":"BasicImageUploader.js","sources":["../../app/javascript/src/components/BasicImageUploader.jsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Delete } from \"neetoicons\";\nimport { Button } from \"neetoui\";\n\nimport ImageDirectUpload from \"./common/ImageDirectUpload\";\nimport ImageWithFallback from \"./common/ImageWithFallback\";\nimport { IMAGE_WRAPPER_CLASSNAME } from \"./constants\";\nimport { isNilOrEmpty, isNotNilOrEmpty } from \"./ImageEditor/utils\";\n\nconst BasicImageUploader = ({\n src = \"\",\n className = \"\",\n imageFallbackProps = { alt: \"Uplaoded Image\", className: \"h-full w-full\" },\n onDrop = noop,\n isDisabled = false,\n onRemove = noop,\n ...props\n}) => (\n <div\n className={classnames(className, {\n \"cursor-pointer\": true,\n \"cursor-not-allowed\": isDisabled,\n \"opacity-70\": isDisabled && isNilOrEmpty(src),\n })}\n >\n {isNotNilOrEmpty(src) ? (\n <div className={IMAGE_WRAPPER_CLASSNAME}>\n <ImageWithFallback\n {...{ ...imageFallbackProps, src }}\n data-cy=\"uploaded-image\"\n />\n <Button\n className=\"absolute right-3 top-3\"\n data-cy=\"basic-image-uploader-remove-button\"\n disabled={isDisabled}\n icon={Delete}\n size=\"small\"\n onClick={onRemove}\n />\n </div>\n ) : (\n <ImageDirectUpload {...{ ...props, isDisabled, onDrop }} />\n )}\n </div>\n);\n\nexport default BasicImageUploader;\n"],"names":["BasicImageUploader","_ref","_ref$src","src","_ref$className","className","_ref$imageFallbackPro","imageFallbackProps","alt","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","_ref$onRemove","onRemove","props","_objectWithoutProperties","_excluded","_jsx","classnames","isNilOrEmpty","children","isNotNilOrEmpty","_jsxs","IMAGE_WRAPPER_CLASSNAME","ImageWithFallback","_objectSpread","Button","disabled","icon","Delete","size","onClick","ImageDirectUpload"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,QAAA,GAAAD,IAAA,CACtBE,GAAG;AAAHA,IAAAA,GAAG,GAAAD,QAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,QAAA;IAAAE,cAAA,GAAAH,IAAA,CACRI,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAAE,qBAAA,GAAAL,IAAA,CACdM,kBAAkB;IAAlBA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA;AAAEE,MAAAA,GAAG,EAAE,gBAAgB;AAAEH,MAAAA,SAAS,EAAE;AAAgB,KAAC,GAAAC,qBAAA;IAAAG,WAAA,GAAAR,IAAA,CAC1ES,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAGE,KAAAA,CAAAA,GAAAA,cAAI,GAAAF,WAAA;IAAAG,eAAA,GAAAX,IAAA,CACbY,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAAAE,aAAA,GAAAb,IAAA,CAClBc,QAAQ;AAARA,IAAAA,QAAQ,GAAAD,aAAA,KAAGH,KAAAA,CAAAA,GAAAA,cAAI,GAAAG,aAAA;AACZE,IAAAA,KAAK,GAAAC,wBAAA,CAAAhB,IAAA,EAAAiB,SAAA,CAAA;AAAA,EAAA,oBAERC,cAAA,CAAA,KAAA,EAAA;AACEd,IAAAA,SAAS,EAAEe,UAAU,CAACf,SAAS,EAAE;AAC/B,MAAA,gBAAgB,EAAE,IAAI;AACtB,MAAA,oBAAoB,EAAEQ,UAAU;AAChC,MAAA,YAAY,EAAEA,UAAU,IAAIQ,kBAAY,CAAClB,GAAG;AAC9C,KAAC,CAAE;AAAAmB,IAAAA,QAAA,EAEFC,qBAAe,CAACpB,GAAG,CAAC,gBACnBqB,eAAA,CAAA,KAAA,EAAA;AAAKnB,MAAAA,SAAS,EAAEoB,6BAAwB;AAAAH,MAAAA,QAAA,EACtCH,cAAAA,cAAA,CAACO,mCAAiB,EAAAC,aAAA,CAAAA,aAAA,CAAAA,EAAAA,EAAAA,aAAA,CAAAA,aAAA,KACPpB,kBAAkB,CAAA,EAAA,EAAA,EAAA;AAAEJ,QAAAA,GAAG,EAAHA;AAAG,OAAA,CAAA,CAAA,EAAA,EAAA,EAAA;QAChC,SAAQ,EAAA;AAAgB,OAAA,CACzB,CAAC,eACFgB,cAAA,CAACS,MAAM,EAAA;AACLvB,QAAAA,SAAS,EAAC,wBAAwB;AAClC,QAAA,SAAA,EAAQ,oCAAoC;AAC5CwB,QAAAA,QAAQ,EAAEhB,UAAW;AACrBiB,QAAAA,IAAI,EAAEC,MAAO;AACbC,QAAAA,IAAI,EAAC,OAAO;AACZC,QAAAA,OAAO,EAAElB;AAAS,OACnB,CAAC;AAAA,KACC,CAAC,gBAENI,cAAA,CAACe,uBAAiB,EAAAP,aAAA,CAAA,EAAA,EAAAA,aAAA,CAAAA,aAAA,CAAA,EAAA,EAAUX,KAAK,CAAA,EAAA,EAAA,EAAA;AAAEH,MAAAA,UAAU,EAAVA,UAAU;AAAEH,MAAAA,MAAM,EAANA;KAAW,CAAA,CAAA;AAC3D,GACE,CAAC;AAAA;;;;"}
|
|
@@ -5,7 +5,7 @@ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
|
5
5
|
var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
|
|
6
6
|
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
7
7
|
var _regeneratorRuntime = require('@babel/runtime/regenerator');
|
|
8
|
-
var
|
|
8
|
+
var g = require('react');
|
|
9
9
|
var classnames = require('classnames');
|
|
10
10
|
var neetoCist = require('@bigbinary/neeto-cist');
|
|
11
11
|
var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
|
|
@@ -13,9 +13,9 @@ var MenuHorizontal = require('@bigbinary/neeto-icons/MenuHorizontal');
|
|
|
13
13
|
var Dropdown = require('@bigbinary/neetoui/Dropdown');
|
|
14
14
|
var ramda = require('ramda');
|
|
15
15
|
var reactI18next = require('react-i18next');
|
|
16
|
-
var
|
|
17
|
-
var
|
|
18
|
-
var AssetLibrary = require('../index-
|
|
16
|
+
var utils = require('../utils-C58No1u2.js');
|
|
17
|
+
var ImageWithFallback = require('../ImageWithFallback-DzT_N2Su.js');
|
|
18
|
+
var AssetLibrary = require('../index-BsGnAVUR.js');
|
|
19
19
|
var useImageUploader = require('../useImageUploader-Bm9TukCy.js');
|
|
20
20
|
var index = require('../index-BtHfh_eu.js');
|
|
21
21
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -35,6 +35,7 @@ require('@bigbinary/neeto-commons-frontend/react-utils');
|
|
|
35
35
|
require('@bigbinary/neeto-commons-frontend/utils');
|
|
36
36
|
require('@bigbinary/neetoui/Input');
|
|
37
37
|
require('@bigbinary/neetoui/Switch');
|
|
38
|
+
require('@bigbinary/neetoui/Label');
|
|
38
39
|
require('../query-B7ahlELA.js');
|
|
39
40
|
require('@bigbinary/neeto-team-members-frontend/constants');
|
|
40
41
|
require('@bigbinary/neetoui/Alert');
|
|
@@ -55,12 +56,14 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
55
56
|
_ref$uploadConfig = _ref.uploadConfig,
|
|
56
57
|
uploadConfig = _ref$uploadConfig === void 0 ? {} : _ref$uploadConfig,
|
|
57
58
|
_ref$fixedAspectRatio = _ref.fixedAspectRatio,
|
|
58
|
-
fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio
|
|
59
|
-
|
|
59
|
+
fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio,
|
|
60
|
+
_ref$defaultImageSize = _ref.defaultImageSize,
|
|
61
|
+
defaultImageSize = _ref$defaultImageSize === void 0 ? {} : _ref$defaultImageSize;
|
|
62
|
+
var _useState = g.useState(false),
|
|
60
63
|
_useState2 = _slicedToArray(_useState, 2),
|
|
61
64
|
isAssetLibraryOpen = _useState2[0],
|
|
62
65
|
setIsAssetLibraryOpen = _useState2[1];
|
|
63
|
-
var _useState3 =
|
|
66
|
+
var _useState3 = g.useState({
|
|
64
67
|
url: src
|
|
65
68
|
}),
|
|
66
69
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
@@ -200,18 +203,20 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
200
203
|
var key = _ref3.key,
|
|
201
204
|
label = _ref3.label,
|
|
202
205
|
otherProps = _objectWithoutProperties(_ref3, _excluded);
|
|
203
|
-
return /*#__PURE__*/
|
|
206
|
+
return /*#__PURE__*/g.createElement(MenuItem.Button, _objectSpread(_objectSpread({}, otherProps), {}, {
|
|
204
207
|
key: key
|
|
205
208
|
}), label);
|
|
206
209
|
})
|
|
207
210
|
})
|
|
208
211
|
})]
|
|
209
|
-
}) : /*#__PURE__*/jsxRuntime.jsx(
|
|
212
|
+
}) : /*#__PURE__*/jsxRuntime.jsx(utils.ImageDirectUpload, {
|
|
213
|
+
defaultImageSize: defaultImageSize,
|
|
210
214
|
setIsAssetLibraryOpen: setIsAssetLibraryOpen,
|
|
211
215
|
isDisabled: neetoCist.isPresent(fixedAspectRatio),
|
|
212
216
|
uploadConfig: uploadConfigWithDefaults,
|
|
213
217
|
onDrop: uploadFile
|
|
214
218
|
}), /*#__PURE__*/jsxRuntime.jsx(AssetLibrary.Modal, {
|
|
219
|
+
defaultImageSize: defaultImageSize,
|
|
215
220
|
fixedAspectRatio: fixedAspectRatio,
|
|
216
221
|
isOpen: isAssetLibraryOpen,
|
|
217
222
|
uploadConfig: uploadConfigWithDefaults,
|