@bigbinary/neeto-image-uploader-frontend 2.3.8 → 2.3.10
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/dist/AssetLibrary.js +5 -5
- package/dist/BasicImageUploader.js +3 -3
- package/dist/ImageUploader.js +68 -50
- package/dist/ImageUploader.js.map +1 -1
- package/dist/{ImageWithFallback-1ddf3f25.js → ImageWithFallback-Dz9cyV2n.js} +16 -26
- package/dist/{ImageWithFallback-1ddf3f25.js.map → ImageWithFallback-Dz9cyV2n.js.map} +1 -1
- package/dist/{ImageWithFallback-933ea4b1.js → ImageWithFallback-c9ANE1IE.js} +2 -2
- package/dist/{ImageWithFallback-933ea4b1.js.map → ImageWithFallback-c9ANE1IE.js.map} +1 -1
- package/dist/cjs/AssetLibrary.js +5 -5
- package/dist/cjs/BasicImageUploader.js +8 -16
- package/dist/cjs/BasicImageUploader.js.map +1 -1
- package/dist/cjs/ImageUploader.js +76 -68
- package/dist/cjs/ImageUploader.js.map +1 -1
- package/dist/cjs/hooks.js +4 -6
- package/dist/cjs/hooks.js.map +1 -1
- package/dist/cjs/index.js +9 -11
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/utils.js +1 -3
- package/dist/cjs/utils.js.map +1 -1
- package/dist/hooks.js +4 -4
- package/dist/{index-cf7e4b89.js → index-BtHfh_eu.js} +2 -3
- package/dist/{index-cf7e4b89.js.map → index-BtHfh_eu.js.map} +1 -1
- package/dist/{index-14b217c0.js → index-By7BkNOh.js} +69 -96
- package/dist/index-By7BkNOh.js.map +1 -0
- package/dist/{index-8605e11c.js → index-CZjb2iXB.js} +2 -3
- package/dist/{index-8605e11c.js.map → index-CZjb2iXB.js.map} +1 -1
- package/dist/{index-60324d58.js → index-vkjNhoF3.js} +7 -11
- package/dist/index-vkjNhoF3.js.map +1 -0
- package/dist/index.js +9 -9
- package/dist/{query-dcc7b81b.js → query-B0eDmse7.js} +1 -1
- package/dist/{query-dcc7b81b.js.map → query-B0eDmse7.js.map} +1 -1
- package/dist/{query-3c31bf92.js → query-B7ahlELA.js} +1 -1
- package/dist/{query-3c31bf92.js.map → query-B7ahlELA.js.map} +1 -1
- package/dist/{useImageUploader-3de58fe2.js → useImageUploader-Bm9TukCy.js} +42 -58
- package/dist/useImageUploader-Bm9TukCy.js.map +1 -0
- package/dist/{useImageUploader-1c60ac64.js → useImageUploader-RX88_Cp-.js} +30 -38
- package/dist/useImageUploader-RX88_Cp-.js.map +1 -0
- package/dist/{useProfileImageUpload-cad1ed36.js → useProfileImageUpload-KpvcwEqx.js} +3 -3
- package/dist/{useProfileImageUpload-cad1ed36.js.map → useProfileImageUpload-KpvcwEqx.js.map} +1 -1
- package/dist/{useProfileImageUpload-69bf6ee9.js → useProfileImageUpload-UUrg2Lkw.js} +19 -26
- package/dist/useProfileImageUpload-UUrg2Lkw.js.map +1 -0
- package/dist/{utils-fa0fa918.js → utils-B5WMTXlT.js} +3 -3
- package/dist/{utils-fa0fa918.js.map → utils-B5WMTXlT.js.map} +1 -1
- package/dist/{utils-ede1695e.js → utils-tPaqWDxV.js} +7 -13
- package/dist/{utils-ede1695e.js.map → utils-tPaqWDxV.js.map} +1 -1
- package/dist/utils.js +1 -1
- package/package.json +13 -13
- package/dist/index-14b217c0.js.map +0 -1
- package/dist/index-60324d58.js.map +0 -1
- package/dist/useImageUploader-1c60ac64.js.map +0 -1
- package/dist/useImageUploader-3de58fe2.js.map +0 -1
- package/dist/useProfileImageUpload-69bf6ee9.js.map +0 -1
package/dist/AssetLibrary.js
CHANGED
|
@@ -12,10 +12,10 @@ import '@bigbinary/neetoui/Toastr';
|
|
|
12
12
|
import '@bigbinary/neetoui/Typography';
|
|
13
13
|
import 'ramda';
|
|
14
14
|
import 'react-i18next';
|
|
15
|
-
import './utils-
|
|
16
|
-
export { M as default } from './index-
|
|
17
|
-
import './useImageUploader-
|
|
18
|
-
import './index-
|
|
15
|
+
import './utils-B5WMTXlT.js';
|
|
16
|
+
export { M as default } from './index-vkjNhoF3.js';
|
|
17
|
+
import './useImageUploader-RX88_Cp-.js';
|
|
18
|
+
import './index-CZjb2iXB.js';
|
|
19
19
|
import 'react/jsx-runtime';
|
|
20
20
|
import 'react-dropzone';
|
|
21
21
|
import 'i18next';
|
|
@@ -27,7 +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 './query-
|
|
30
|
+
import './query-B0eDmse7.js';
|
|
31
31
|
import '@bigbinary/neeto-icons/MenuHorizontal';
|
|
32
32
|
import '@bigbinary/neeto-team-members-frontend/constants';
|
|
33
33
|
import '@bigbinary/neetoui/Alert';
|
|
@@ -4,8 +4,8 @@ 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 ImageWithFallback, a as ImageDirectUpload } from './ImageWithFallback-
|
|
8
|
-
import {
|
|
7
|
+
import { I as ImageWithFallback, a as ImageDirectUpload } from './ImageWithFallback-c9ANE1IE.js';
|
|
8
|
+
import { a as isNilOrEmpty, i as isNotNilOrEmpty, I as IMAGE_WRAPPER_CLASSNAME } from './utils-B5WMTXlT.js';
|
|
9
9
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
10
10
|
import '@bigbinary/neetoui/Typography';
|
|
11
11
|
import '@bigbinary/neetoui/ProgressBar';
|
|
@@ -17,7 +17,7 @@ import '@bigbinary/neeto-commons-frontend/initializers';
|
|
|
17
17
|
import 'react-dropzone';
|
|
18
18
|
import 'i18next';
|
|
19
19
|
import '@bigbinary/neetoui/Toastr';
|
|
20
|
-
import './index-
|
|
20
|
+
import './index-CZjb2iXB.js';
|
|
21
21
|
|
|
22
22
|
var _excluded = ["src", "className", "imageFallbackProps", "onDrop", "isDisabled", "onRemove"];
|
|
23
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; }
|
package/dist/ImageUploader.js
CHANGED
|
@@ -1,26 +1,28 @@
|
|
|
1
1
|
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
2
2
|
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
3
|
+
import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
|
|
3
4
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
5
|
+
import _regeneratorRuntime from '@babel/runtime/regenerator';
|
|
4
6
|
import { useState, createElement } from 'react';
|
|
5
7
|
import classnames from 'classnames';
|
|
6
8
|
import { isPresent, noop } from '@bigbinary/neeto-cist';
|
|
7
9
|
import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
|
|
8
10
|
import MenuHorizontal from '@bigbinary/neeto-icons/MenuHorizontal';
|
|
9
11
|
import Dropdown from '@bigbinary/neetoui/Dropdown';
|
|
10
|
-
import Toastr from '@bigbinary/neetoui/Toastr';
|
|
11
12
|
import { mergeRight } from 'ramda';
|
|
12
13
|
import { useTranslation } from 'react-i18next';
|
|
13
|
-
import { I as ImageWithFallback, a as ImageDirectUpload } from './ImageWithFallback-
|
|
14
|
-
import {
|
|
15
|
-
import { M as Modal, c as constructCloudflareImageURL } from './index-
|
|
16
|
-
import {
|
|
17
|
-
import { C as CLOUD_FLARE, I as IS_DEVELOPMENT_OR_HEROKU_ENV } from './index-
|
|
14
|
+
import { I as ImageWithFallback, a as ImageDirectUpload } from './ImageWithFallback-c9ANE1IE.js';
|
|
15
|
+
import { D as DEFAULT_UPLOAD_CONFIG, O as OPTION_KEYS, i as isNotNilOrEmpty, I as IMAGE_WRAPPER_CLASSNAME } from './utils-B5WMTXlT.js';
|
|
16
|
+
import { M as Modal, c as constructCloudflareImageURL } from './index-vkjNhoF3.js';
|
|
17
|
+
import { a as useCreateBlob, u as useImageUploader, g as generateASCIIFileName } from './useImageUploader-RX88_Cp-.js';
|
|
18
|
+
import { C as CLOUD_FLARE, I as IS_DEVELOPMENT_OR_HEROKU_ENV } from './index-CZjb2iXB.js';
|
|
18
19
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
19
20
|
import '@bigbinary/neetoui/Button';
|
|
20
21
|
import '@bigbinary/neetoui/Typography';
|
|
21
22
|
import '@bigbinary/neetoui/ProgressBar';
|
|
22
23
|
import 'react-dropzone';
|
|
23
24
|
import 'i18next';
|
|
25
|
+
import '@bigbinary/neetoui/Toastr';
|
|
24
26
|
import '@bigbinary/neetoui/Modal';
|
|
25
27
|
import '@bigbinary/neetoui/Tab';
|
|
26
28
|
import '@bigbinary/neetoui/Spinner';
|
|
@@ -31,11 +33,9 @@ import '@bigbinary/neeto-commons-frontend/react-utils';
|
|
|
31
33
|
import '@bigbinary/neeto-commons-frontend/utils';
|
|
32
34
|
import '@bigbinary/neetoui/Input';
|
|
33
35
|
import '@bigbinary/neetoui/Switch';
|
|
34
|
-
import './query-
|
|
36
|
+
import './query-B0eDmse7.js';
|
|
35
37
|
import '@bigbinary/neeto-team-members-frontend/constants';
|
|
36
38
|
import '@bigbinary/neetoui/Alert';
|
|
37
|
-
import '@babel/runtime/helpers/asyncToGenerator';
|
|
38
|
-
import '@babel/runtime/regenerator';
|
|
39
39
|
import '@rails/activestorage';
|
|
40
40
|
|
|
41
41
|
var _excluded = ["key", "label"];
|
|
@@ -67,7 +67,7 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
67
67
|
var _useTranslation = useTranslation(),
|
|
68
68
|
t = _useTranslation.t;
|
|
69
69
|
var _useCreateBlob = useCreateBlob(),
|
|
70
|
-
createBlob = _useCreateBlob.
|
|
70
|
+
createBlob = _useCreateBlob.mutateAsync;
|
|
71
71
|
var uploadConfigWithDefaults = mergeRight(DEFAULT_UPLOAD_CONFIG, uploadConfig);
|
|
72
72
|
var isCloudFlareImageUploader = globalProps.assetsUploaderService === CLOUD_FLARE;
|
|
73
73
|
var handleDelete = function handleDelete() {
|
|
@@ -101,44 +101,62 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
101
101
|
setImage(image);
|
|
102
102
|
onChange(image);
|
|
103
103
|
};
|
|
104
|
-
var handleUploadComplete = function
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
104
|
+
var handleUploadComplete = /*#__PURE__*/function () {
|
|
105
|
+
var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(result) {
|
|
106
|
+
var imageKitPayload, cloudFlarePayload, payload, response;
|
|
107
|
+
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
108
|
+
while (1) switch (_context.prev = _context.next) {
|
|
109
|
+
case 0:
|
|
110
|
+
if (!IS_DEVELOPMENT_OR_HEROKU_ENV) {
|
|
111
|
+
_context.next = 3;
|
|
112
|
+
break;
|
|
113
|
+
}
|
|
114
|
+
handleSuccess(mergeRight(result, {
|
|
115
|
+
metadata: {
|
|
116
|
+
url: result.url
|
|
117
|
+
}
|
|
118
|
+
}));
|
|
119
|
+
return _context.abrupt("return");
|
|
120
|
+
case 3:
|
|
121
|
+
imageKitPayload = function imageKitPayload() {
|
|
122
|
+
return {
|
|
123
|
+
filename: generateASCIIFileName(result.name),
|
|
124
|
+
byte_size: result.size,
|
|
125
|
+
content_type: result.fileType,
|
|
126
|
+
checksum: result.fileId,
|
|
127
|
+
metadata: result,
|
|
128
|
+
service_name: "imagekitio"
|
|
129
|
+
};
|
|
130
|
+
};
|
|
131
|
+
cloudFlarePayload = function cloudFlarePayload() {
|
|
132
|
+
return {
|
|
133
|
+
filename: generateASCIIFileName(result.filename),
|
|
134
|
+
content_type: result.contentType,
|
|
135
|
+
byte_size: result.byteSize,
|
|
136
|
+
checksum: result.id,
|
|
137
|
+
metadata: _objectSpread(_objectSpread({}, result.metadata), {}, {
|
|
138
|
+
url: constructCloudflareImageURL(result.variants[0]),
|
|
139
|
+
isCropped: false
|
|
140
|
+
}),
|
|
141
|
+
service_name: "cloudflare_image"
|
|
142
|
+
};
|
|
143
|
+
};
|
|
144
|
+
payload = isCloudFlareImageUploader ? cloudFlarePayload() : imageKitPayload();
|
|
145
|
+
_context.next = 8;
|
|
146
|
+
return createBlob(payload, {});
|
|
147
|
+
case 8:
|
|
148
|
+
response = _context.sent;
|
|
149
|
+
handleSuccess(response);
|
|
150
|
+
case 10:
|
|
151
|
+
case "end":
|
|
152
|
+
return _context.stop();
|
|
109
153
|
}
|
|
110
|
-
})
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
return {
|
|
115
|
-
filename: generateASCIIFileName(result.name),
|
|
116
|
-
byte_size: result.size,
|
|
117
|
-
content_type: result.fileType,
|
|
118
|
-
checksum: result.fileId,
|
|
119
|
-
metadata: result,
|
|
120
|
-
service_name: "imagekitio"
|
|
121
|
-
};
|
|
122
|
-
};
|
|
123
|
-
var cloudFlarePayload = function cloudFlarePayload() {
|
|
124
|
-
return {
|
|
125
|
-
filename: generateASCIIFileName(result.filename),
|
|
126
|
-
content_type: result.contentType,
|
|
127
|
-
byte_size: result.byteSize,
|
|
128
|
-
checksum: result.id,
|
|
129
|
-
metadata: _objectSpread(_objectSpread({}, result.metadata), {}, {
|
|
130
|
-
url: constructCloudflareImageURL(result.variants[0]),
|
|
131
|
-
isCropped: false
|
|
132
|
-
}),
|
|
133
|
-
service_name: "cloudflare_image"
|
|
134
|
-
};
|
|
154
|
+
}, _callee);
|
|
155
|
+
}));
|
|
156
|
+
return function handleUploadComplete(_x) {
|
|
157
|
+
return _ref2.apply(this, arguments);
|
|
135
158
|
};
|
|
136
|
-
|
|
137
|
-
createBlob(payload, {
|
|
138
|
-
onSuccess: handleSuccess,
|
|
139
|
-
onError: Toastr.error
|
|
140
|
-
});
|
|
141
|
-
};
|
|
159
|
+
}();
|
|
142
160
|
var _useImageUploader = useImageUploader({
|
|
143
161
|
onUploadComplete: handleUploadComplete
|
|
144
162
|
}),
|
|
@@ -176,10 +194,10 @@ var ImageUploader = function ImageUploader(_ref) {
|
|
|
176
194
|
className: "absolute right-3 top-3 rounded-full"
|
|
177
195
|
},
|
|
178
196
|
children: /*#__PURE__*/jsx(Menu, {
|
|
179
|
-
children: options.map(function (
|
|
180
|
-
var key =
|
|
181
|
-
label =
|
|
182
|
-
otherProps = _objectWithoutProperties(
|
|
197
|
+
children: options.map(function (_ref3) {
|
|
198
|
+
var key = _ref3.key,
|
|
199
|
+
label = _ref3.label,
|
|
200
|
+
otherProps = _objectWithoutProperties(_ref3, _excluded);
|
|
183
201
|
return /*#__PURE__*/createElement(MenuItem.Button, _objectSpread(_objectSpread({}, otherProps), {}, {
|
|
184
202
|
key: key
|
|
185
203
|
}), label);
|
|
@@ -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, Toastr } 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 { mutate: 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 = 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 createBlob(payload, {\n onSuccess: handleSuccess,\n onError: Toastr.error,\n });\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","mutate","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","result","IS_DEVELOPMENT_OR_HEROKU_ENV","imageKitPayload","name","byte_size","content_type","fileType","checksum","fileId","service_name","cloudFlarePayload","id","_objectSpread","constructCloudflareImageURL","variants","isCropped","payload","onSuccess","onError","Toastr","error","_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","_ref2","otherProps","_objectWithoutProperties","_excluded","_createElement","Button","ImageDirectUpload","isDisabled","isPresent","onDrop","AssetLibrary","isOpen","onClose"],"mappings":"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"}
|
|
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;;;;"}
|
|
@@ -8,22 +8,12 @@ var Typography = require('@bigbinary/neetoui/Typography');
|
|
|
8
8
|
var ProgressBar = require('@bigbinary/neetoui/ProgressBar');
|
|
9
9
|
var ramda = require('ramda');
|
|
10
10
|
var reactI18next = require('react-i18next');
|
|
11
|
-
var utils = require('./utils-
|
|
11
|
+
var utils = require('./utils-tPaqWDxV.js');
|
|
12
12
|
var jsxRuntime = require('react/jsx-runtime');
|
|
13
13
|
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
14
14
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
15
15
|
var require$$0 = require('react');
|
|
16
16
|
|
|
17
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
18
|
-
|
|
19
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
20
|
-
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
21
|
-
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
|
|
22
|
-
var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
|
|
23
|
-
var ProgressBar__default = /*#__PURE__*/_interopDefaultLegacy(ProgressBar);
|
|
24
|
-
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
25
|
-
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
26
|
-
|
|
27
17
|
var getAllowedTypes = function getAllowedTypes(uploadConfig) {
|
|
28
18
|
return ramda.pipe(ramda.values, ramda.flatten, ramda.map(function (extension) {
|
|
29
19
|
return extension.slice(1);
|
|
@@ -31,7 +21,7 @@ var getAllowedTypes = function getAllowedTypes(uploadConfig) {
|
|
|
31
21
|
};
|
|
32
22
|
|
|
33
23
|
function ownKeys$2(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; }
|
|
34
|
-
function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) {
|
|
24
|
+
function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
35
25
|
var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
36
26
|
var _ref$uploadConfig = _ref.uploadConfig,
|
|
37
27
|
uploadConfig = _ref$uploadConfig === void 0 ? utils.DEFAULT_UPLOAD_CONFIG : _ref$uploadConfig,
|
|
@@ -50,28 +40,28 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
50
40
|
uploadProgress = _useUploadDropzone.uploadProgress;
|
|
51
41
|
var shouldShowProgress = !!(uploadProgress && !ramda.equals(uploadProgress, 1));
|
|
52
42
|
return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$2(_objectSpread$2({}, getRootProps()), {}, {
|
|
53
|
-
className:
|
|
43
|
+
className: classnames(utils.DROPZONE_ROOT_DIV_CLASSNAME, {
|
|
54
44
|
"neeto-ui-border-gray-300": !isDragActive,
|
|
55
45
|
"neeto-ui-border-gray-700": isDragActive
|
|
56
46
|
}),
|
|
57
|
-
children: shouldShowProgress ? /*#__PURE__*/jsxRuntime.jsx(
|
|
47
|
+
children: shouldShowProgress ? /*#__PURE__*/jsxRuntime.jsx(ProgressBar, {
|
|
58
48
|
progressPercentage: uploadProgress,
|
|
59
49
|
progressValue: "".concat(uploadProgress, "%")
|
|
60
50
|
}) : /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
61
51
|
className: "flex flex-col space-y-1",
|
|
62
|
-
children: [!isDisabled && /*#__PURE__*/jsxRuntime.jsx(
|
|
52
|
+
children: [!isDisabled && /*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
63
53
|
className: "neeto-ui-text-gray-800 text-center leading-4",
|
|
64
54
|
style: "body2",
|
|
65
55
|
children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
|
|
66
56
|
i18nKey: "neetoImageUploader.imageUpload.dragAndDropOrBrowseFile",
|
|
67
57
|
components: {
|
|
68
|
-
span: /*#__PURE__*/jsxRuntime.jsx(
|
|
58
|
+
span: /*#__PURE__*/jsxRuntime.jsx(Button, {
|
|
69
59
|
"data-cy": "neeto-image-uploader-browse-text",
|
|
70
60
|
style: "link"
|
|
71
61
|
})
|
|
72
62
|
}
|
|
73
63
|
})
|
|
74
|
-
}), setIsAssetLibraryOpen && /*#__PURE__*/jsxRuntime.jsx(
|
|
64
|
+
}), setIsAssetLibraryOpen && /*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
75
65
|
className: "text-center leading-4",
|
|
76
66
|
style: "body2",
|
|
77
67
|
onClick: function onClick(e) {
|
|
@@ -81,7 +71,7 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
81
71
|
children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
|
|
82
72
|
i18nKey: "neetoImageUploader.imageUpload.selectImagefromImageLibrary",
|
|
83
73
|
components: {
|
|
84
|
-
span: /*#__PURE__*/jsxRuntime.jsx(
|
|
74
|
+
span: /*#__PURE__*/jsxRuntime.jsx(Button, {
|
|
85
75
|
"data-cy": "open-asset-library-button",
|
|
86
76
|
style: "link"
|
|
87
77
|
})
|
|
@@ -90,7 +80,7 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
90
80
|
}), /*#__PURE__*/jsxRuntime.jsx("input", _objectSpread$2(_objectSpread$2({}, getInputProps()), {}, {
|
|
91
81
|
"data-cy": "neeto-image-uploader-file-input",
|
|
92
82
|
disabled: isDisabled
|
|
93
|
-
})), /*#__PURE__*/jsxRuntime.jsx(
|
|
83
|
+
})), /*#__PURE__*/jsxRuntime.jsx(Typography, {
|
|
94
84
|
className: "neeto-ui-text-gray-700 text-center leading-4",
|
|
95
85
|
"data-cy": "neeto-image-uploader-restriction-message",
|
|
96
86
|
lineHeight: "snug",
|
|
@@ -109,28 +99,28 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
109
99
|
|
|
110
100
|
var _excluded$1 = ["className"];
|
|
111
101
|
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; }
|
|
112
|
-
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) {
|
|
102
|
+
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; }
|
|
113
103
|
var ImagePlaceholder = function ImagePlaceholder(_ref) {
|
|
114
104
|
var _ref$className = _ref.className,
|
|
115
105
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
116
|
-
props =
|
|
106
|
+
props = _objectWithoutProperties(_ref, _excluded$1);
|
|
117
107
|
return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$1({
|
|
118
|
-
className:
|
|
108
|
+
className: classnames("neeto-ui-bg-gray-200", _defineProperty({}, className, className))
|
|
119
109
|
}, props));
|
|
120
110
|
};
|
|
121
111
|
|
|
122
112
|
var _excluded = ["src", "className", "fallback"];
|
|
123
113
|
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; }
|
|
124
|
-
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) {
|
|
114
|
+
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; }
|
|
125
115
|
var ImageWithFallback = function ImageWithFallback(_ref) {
|
|
126
116
|
var src = _ref.src,
|
|
127
117
|
_ref$className = _ref.className,
|
|
128
118
|
className = _ref$className === void 0 ? "h-full w-full" : _ref$className,
|
|
129
119
|
_ref$fallback = _ref.fallback,
|
|
130
120
|
Fallback = _ref$fallback === void 0 ? ImagePlaceholder : _ref$fallback,
|
|
131
|
-
props =
|
|
121
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
132
122
|
var _useState = require$$0.useState(false),
|
|
133
|
-
_useState2 =
|
|
123
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
134
124
|
isLoaded = _useState2[0],
|
|
135
125
|
setIsLoaded = _useState2[1];
|
|
136
126
|
require$$0.useEffect(function () {
|
|
@@ -151,4 +141,4 @@ var ImageWithFallback = function ImageWithFallback(_ref) {
|
|
|
151
141
|
|
|
152
142
|
exports.ImageDirectUpload = ImageDirectUpload;
|
|
153
143
|
exports.ImageWithFallback = ImageWithFallback;
|
|
154
|
-
//# sourceMappingURL=ImageWithFallback-
|
|
144
|
+
//# sourceMappingURL=ImageWithFallback-Dz9cyV2n.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageWithFallback-1ddf3f25.js","sources":["../app/javascript/src/components/ImageUploader/utils.js","../app/javascript/src/components/common/ImageDirectUpload.jsx","../app/javascript/src/components/common/ImagePlaceholder.jsx","../app/javascript/src/components/common/ImageWithFallback.jsx"],"sourcesContent":["import { flatten, pipe, join, map, toUpper, values } from \"ramda\";\n\nexport const getAllowedTypes = uploadConfig =>\n pipe(\n values,\n flatten,\n map(extension => extension.slice(1)),\n map(toUpper),\n join(\", \")\n )(uploadConfig.allowedImageTypes);\n","import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Button, Typography, ProgressBar } from \"neetoui\";\nimport { equals } from \"ramda\";\nimport { Trans } from \"react-i18next\";\n\nimport { DEFAULT_UPLOAD_CONFIG } from \"components/ImageUploader/constants\";\nimport { getAllowedTypes } from \"components/ImageUploader/utils\";\nimport useUploadDropzone from \"hooks/useUploadDropzone\";\n\nimport { DROPZONE_ROOT_DIV_CLASSNAME } from \"./constants\";\n\nconst ImageDirectUpload = ({\n uploadConfig = DEFAULT_UPLOAD_CONFIG,\n onDrop = noop,\n isDisabled = false,\n setIsAssetLibraryOpen,\n}) => {\n const { getRootProps, getInputProps, isDragActive, uploadProgress } =\n useUploadDropzone({ uploadConfig, onDrop });\n\n const shouldShowProgress = !!(uploadProgress && !equals(uploadProgress, 1));\n\n return (\n <div\n {...getRootProps()}\n className={classnames(DROPZONE_ROOT_DIV_CLASSNAME, {\n \"neeto-ui-border-gray-300\": !isDragActive,\n \"neeto-ui-border-gray-700\": isDragActive,\n })}\n >\n {shouldShowProgress ? (\n <ProgressBar\n progressPercentage={uploadProgress}\n progressValue={`${uploadProgress}%`}\n />\n ) : (\n <div className=\"flex flex-col space-y-1\">\n {!isDisabled && (\n <Typography\n className=\"neeto-ui-text-gray-800 text-center leading-4\"\n style=\"body2\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.dragAndDropOrBrowseFile\"\n components={{\n span: (\n <Button\n data-cy=\"neeto-image-uploader-browse-text\"\n style=\"link\"\n />\n ),\n }}\n />\n </Typography>\n )}\n {setIsAssetLibraryOpen && (\n <Typography\n className=\"text-center leading-4\"\n style=\"body2\"\n onClick={e => {\n e.stopPropagation();\n setIsAssetLibraryOpen(true);\n }}\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.selectImagefromImageLibrary\"\n components={{\n span: (\n <Button data-cy=\"open-asset-library-button\" style=\"link\" />\n ),\n }}\n />\n </Typography>\n )}\n <input\n {...getInputProps()}\n data-cy=\"neeto-image-uploader-file-input\"\n disabled={isDisabled}\n />\n <Typography\n className=\"neeto-ui-text-gray-700 text-center leading-4\"\n data-cy=\"neeto-image-uploader-restriction-message\"\n lineHeight=\"snug\"\n style=\"nano\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.restrictionMessage\"\n values={{\n fileTypes: getAllowedTypes(uploadConfig),\n size: uploadConfig?.maxImageSize,\n }}\n />\n </Typography>\n </div>\n )}\n </div>\n );\n};\n\nexport default ImageDirectUpload;\n","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":["getAllowedTypes","uploadConfig","pipe","values","flatten","map","extension","slice","toUpper","join","allowedImageTypes","ImageDirectUpload","_ref","_ref$uploadConfig","DEFAULT_UPLOAD_CONFIG","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","setIsAssetLibraryOpen","_useUploadDropzone","useUploadDropzone","getRootProps","getInputProps","isDragActive","uploadProgress","shouldShowProgress","equals","_jsx","_objectSpread","className","classnames","DROPZONE_ROOT_DIV_CLASSNAME","children","ProgressBar","progressPercentage","progressValue","concat","_jsxs","Typography","style","Trans","i18nKey","components","span","Button","onClick","e","stopPropagation","disabled","lineHeight","fileTypes","size","maxImageSize","ImagePlaceholder","_ref$className","props","_objectWithoutProperties","_excluded","_defineProperty","ImageWithFallback","src","_ref$fallback","fallback","Fallback","_useState","useState","_useState2","_slicedToArray","isLoaded","setIsLoaded","useEffect","img","Image","onload"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ImageWithFallback-Dz9cyV2n.js","sources":["../app/javascript/src/components/ImageUploader/utils.js","../app/javascript/src/components/common/ImageDirectUpload.jsx","../app/javascript/src/components/common/ImagePlaceholder.jsx","../app/javascript/src/components/common/ImageWithFallback.jsx"],"sourcesContent":["import { flatten, pipe, join, map, toUpper, values } from \"ramda\";\n\nexport const getAllowedTypes = uploadConfig =>\n pipe(\n values,\n flatten,\n map(extension => extension.slice(1)),\n map(toUpper),\n join(\", \")\n )(uploadConfig.allowedImageTypes);\n","import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Button, Typography, ProgressBar } from \"neetoui\";\nimport { equals } from \"ramda\";\nimport { Trans } from \"react-i18next\";\n\nimport { DEFAULT_UPLOAD_CONFIG } from \"components/ImageUploader/constants\";\nimport { getAllowedTypes } from \"components/ImageUploader/utils\";\nimport useUploadDropzone from \"hooks/useUploadDropzone\";\n\nimport { DROPZONE_ROOT_DIV_CLASSNAME } from \"./constants\";\n\nconst ImageDirectUpload = ({\n uploadConfig = DEFAULT_UPLOAD_CONFIG,\n onDrop = noop,\n isDisabled = false,\n setIsAssetLibraryOpen,\n}) => {\n const { getRootProps, getInputProps, isDragActive, uploadProgress } =\n useUploadDropzone({ uploadConfig, onDrop });\n\n const shouldShowProgress = !!(uploadProgress && !equals(uploadProgress, 1));\n\n return (\n <div\n {...getRootProps()}\n className={classnames(DROPZONE_ROOT_DIV_CLASSNAME, {\n \"neeto-ui-border-gray-300\": !isDragActive,\n \"neeto-ui-border-gray-700\": isDragActive,\n })}\n >\n {shouldShowProgress ? (\n <ProgressBar\n progressPercentage={uploadProgress}\n progressValue={`${uploadProgress}%`}\n />\n ) : (\n <div className=\"flex flex-col space-y-1\">\n {!isDisabled && (\n <Typography\n className=\"neeto-ui-text-gray-800 text-center leading-4\"\n style=\"body2\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.dragAndDropOrBrowseFile\"\n components={{\n span: (\n <Button\n data-cy=\"neeto-image-uploader-browse-text\"\n style=\"link\"\n />\n ),\n }}\n />\n </Typography>\n )}\n {setIsAssetLibraryOpen && (\n <Typography\n className=\"text-center leading-4\"\n style=\"body2\"\n onClick={e => {\n e.stopPropagation();\n setIsAssetLibraryOpen(true);\n }}\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.selectImagefromImageLibrary\"\n components={{\n span: (\n <Button data-cy=\"open-asset-library-button\" style=\"link\" />\n ),\n }}\n />\n </Typography>\n )}\n <input\n {...getInputProps()}\n data-cy=\"neeto-image-uploader-file-input\"\n disabled={isDisabled}\n />\n <Typography\n className=\"neeto-ui-text-gray-700 text-center leading-4\"\n data-cy=\"neeto-image-uploader-restriction-message\"\n lineHeight=\"snug\"\n style=\"nano\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.restrictionMessage\"\n values={{\n fileTypes: getAllowedTypes(uploadConfig),\n size: uploadConfig?.maxImageSize,\n }}\n />\n </Typography>\n </div>\n )}\n </div>\n );\n};\n\nexport default ImageDirectUpload;\n","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":["getAllowedTypes","uploadConfig","pipe","values","flatten","map","extension","slice","toUpper","join","allowedImageTypes","ImageDirectUpload","_ref","_ref$uploadConfig","DEFAULT_UPLOAD_CONFIG","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","setIsAssetLibraryOpen","_useUploadDropzone","useUploadDropzone","getRootProps","getInputProps","isDragActive","uploadProgress","shouldShowProgress","equals","_jsx","_objectSpread","className","classnames","DROPZONE_ROOT_DIV_CLASSNAME","children","ProgressBar","progressPercentage","progressValue","concat","_jsxs","Typography","style","Trans","i18nKey","components","span","Button","onClick","e","stopPropagation","disabled","lineHeight","fileTypes","size","maxImageSize","ImagePlaceholder","_ref$className","props","_objectWithoutProperties","_excluded","_defineProperty","ImageWithFallback","src","_ref$fallback","fallback","Fallback","_useState","useState","_useState2","_slicedToArray","isLoaded","setIsLoaded","useEffect","img","Image","onload"],"mappings":"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"}
|
|
@@ -6,7 +6,7 @@ import Typography from '@bigbinary/neetoui/Typography';
|
|
|
6
6
|
import ProgressBar from '@bigbinary/neetoui/ProgressBar';
|
|
7
7
|
import { pipe, values, flatten, map, toUpper, join, equals } from 'ramda';
|
|
8
8
|
import { Trans } from 'react-i18next';
|
|
9
|
-
import { u as useUploadDropzone,
|
|
9
|
+
import { u as useUploadDropzone, b as DROPZONE_ROOT_DIV_CLASSNAME, D as DEFAULT_UPLOAD_CONFIG } from './utils-B5WMTXlT.js';
|
|
10
10
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
11
11
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
12
12
|
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
@@ -138,4 +138,4 @@ var ImageWithFallback = function ImageWithFallback(_ref) {
|
|
|
138
138
|
};
|
|
139
139
|
|
|
140
140
|
export { ImageWithFallback as I, ImageDirectUpload as a };
|
|
141
|
-
//# sourceMappingURL=ImageWithFallback-
|
|
141
|
+
//# sourceMappingURL=ImageWithFallback-c9ANE1IE.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageWithFallback-933ea4b1.js","sources":["../app/javascript/src/components/ImageUploader/utils.js","../app/javascript/src/components/common/ImageDirectUpload.jsx","../app/javascript/src/components/common/ImagePlaceholder.jsx","../app/javascript/src/components/common/ImageWithFallback.jsx"],"sourcesContent":["import { flatten, pipe, join, map, toUpper, values } from \"ramda\";\n\nexport const getAllowedTypes = uploadConfig =>\n pipe(\n values,\n flatten,\n map(extension => extension.slice(1)),\n map(toUpper),\n join(\", \")\n )(uploadConfig.allowedImageTypes);\n","import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Button, Typography, ProgressBar } from \"neetoui\";\nimport { equals } from \"ramda\";\nimport { Trans } from \"react-i18next\";\n\nimport { DEFAULT_UPLOAD_CONFIG } from \"components/ImageUploader/constants\";\nimport { getAllowedTypes } from \"components/ImageUploader/utils\";\nimport useUploadDropzone from \"hooks/useUploadDropzone\";\n\nimport { DROPZONE_ROOT_DIV_CLASSNAME } from \"./constants\";\n\nconst ImageDirectUpload = ({\n uploadConfig = DEFAULT_UPLOAD_CONFIG,\n onDrop = noop,\n isDisabled = false,\n setIsAssetLibraryOpen,\n}) => {\n const { getRootProps, getInputProps, isDragActive, uploadProgress } =\n useUploadDropzone({ uploadConfig, onDrop });\n\n const shouldShowProgress = !!(uploadProgress && !equals(uploadProgress, 1));\n\n return (\n <div\n {...getRootProps()}\n className={classnames(DROPZONE_ROOT_DIV_CLASSNAME, {\n \"neeto-ui-border-gray-300\": !isDragActive,\n \"neeto-ui-border-gray-700\": isDragActive,\n })}\n >\n {shouldShowProgress ? (\n <ProgressBar\n progressPercentage={uploadProgress}\n progressValue={`${uploadProgress}%`}\n />\n ) : (\n <div className=\"flex flex-col space-y-1\">\n {!isDisabled && (\n <Typography\n className=\"neeto-ui-text-gray-800 text-center leading-4\"\n style=\"body2\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.dragAndDropOrBrowseFile\"\n components={{\n span: (\n <Button\n data-cy=\"neeto-image-uploader-browse-text\"\n style=\"link\"\n />\n ),\n }}\n />\n </Typography>\n )}\n {setIsAssetLibraryOpen && (\n <Typography\n className=\"text-center leading-4\"\n style=\"body2\"\n onClick={e => {\n e.stopPropagation();\n setIsAssetLibraryOpen(true);\n }}\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.selectImagefromImageLibrary\"\n components={{\n span: (\n <Button data-cy=\"open-asset-library-button\" style=\"link\" />\n ),\n }}\n />\n </Typography>\n )}\n <input\n {...getInputProps()}\n data-cy=\"neeto-image-uploader-file-input\"\n disabled={isDisabled}\n />\n <Typography\n className=\"neeto-ui-text-gray-700 text-center leading-4\"\n data-cy=\"neeto-image-uploader-restriction-message\"\n lineHeight=\"snug\"\n style=\"nano\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.restrictionMessage\"\n values={{\n fileTypes: getAllowedTypes(uploadConfig),\n size: uploadConfig?.maxImageSize,\n }}\n />\n </Typography>\n </div>\n )}\n </div>\n );\n};\n\nexport default ImageDirectUpload;\n","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":["getAllowedTypes","uploadConfig","pipe","values","flatten","map","extension","slice","toUpper","join","allowedImageTypes","ImageDirectUpload","_ref","_ref$uploadConfig","DEFAULT_UPLOAD_CONFIG","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","setIsAssetLibraryOpen","_useUploadDropzone","useUploadDropzone","getRootProps","getInputProps","isDragActive","uploadProgress","shouldShowProgress","equals","_jsx","_objectSpread","className","classnames","DROPZONE_ROOT_DIV_CLASSNAME","children","ProgressBar","progressPercentage","progressValue","concat","_jsxs","Typography","style","Trans","i18nKey","components","span","Button","onClick","e","stopPropagation","disabled","lineHeight","fileTypes","size","maxImageSize","ImagePlaceholder","_ref$className","props","_objectWithoutProperties","_excluded","_defineProperty","ImageWithFallback","src","_ref$fallback","fallback","Fallback","_useState","useState","_useState2","_slicedToArray","isLoaded","setIsLoaded","useEffect","img","Image","onload"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ImageWithFallback-c9ANE1IE.js","sources":["../app/javascript/src/components/ImageUploader/utils.js","../app/javascript/src/components/common/ImageDirectUpload.jsx","../app/javascript/src/components/common/ImagePlaceholder.jsx","../app/javascript/src/components/common/ImageWithFallback.jsx"],"sourcesContent":["import { flatten, pipe, join, map, toUpper, values } from \"ramda\";\n\nexport const getAllowedTypes = uploadConfig =>\n pipe(\n values,\n flatten,\n map(extension => extension.slice(1)),\n map(toUpper),\n join(\", \")\n )(uploadConfig.allowedImageTypes);\n","import classnames from \"classnames\";\nimport { noop } from \"neetocist\";\nimport { Button, Typography, ProgressBar } from \"neetoui\";\nimport { equals } from \"ramda\";\nimport { Trans } from \"react-i18next\";\n\nimport { DEFAULT_UPLOAD_CONFIG } from \"components/ImageUploader/constants\";\nimport { getAllowedTypes } from \"components/ImageUploader/utils\";\nimport useUploadDropzone from \"hooks/useUploadDropzone\";\n\nimport { DROPZONE_ROOT_DIV_CLASSNAME } from \"./constants\";\n\nconst ImageDirectUpload = ({\n uploadConfig = DEFAULT_UPLOAD_CONFIG,\n onDrop = noop,\n isDisabled = false,\n setIsAssetLibraryOpen,\n}) => {\n const { getRootProps, getInputProps, isDragActive, uploadProgress } =\n useUploadDropzone({ uploadConfig, onDrop });\n\n const shouldShowProgress = !!(uploadProgress && !equals(uploadProgress, 1));\n\n return (\n <div\n {...getRootProps()}\n className={classnames(DROPZONE_ROOT_DIV_CLASSNAME, {\n \"neeto-ui-border-gray-300\": !isDragActive,\n \"neeto-ui-border-gray-700\": isDragActive,\n })}\n >\n {shouldShowProgress ? (\n <ProgressBar\n progressPercentage={uploadProgress}\n progressValue={`${uploadProgress}%`}\n />\n ) : (\n <div className=\"flex flex-col space-y-1\">\n {!isDisabled && (\n <Typography\n className=\"neeto-ui-text-gray-800 text-center leading-4\"\n style=\"body2\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.dragAndDropOrBrowseFile\"\n components={{\n span: (\n <Button\n data-cy=\"neeto-image-uploader-browse-text\"\n style=\"link\"\n />\n ),\n }}\n />\n </Typography>\n )}\n {setIsAssetLibraryOpen && (\n <Typography\n className=\"text-center leading-4\"\n style=\"body2\"\n onClick={e => {\n e.stopPropagation();\n setIsAssetLibraryOpen(true);\n }}\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.selectImagefromImageLibrary\"\n components={{\n span: (\n <Button data-cy=\"open-asset-library-button\" style=\"link\" />\n ),\n }}\n />\n </Typography>\n )}\n <input\n {...getInputProps()}\n data-cy=\"neeto-image-uploader-file-input\"\n disabled={isDisabled}\n />\n <Typography\n className=\"neeto-ui-text-gray-700 text-center leading-4\"\n data-cy=\"neeto-image-uploader-restriction-message\"\n lineHeight=\"snug\"\n style=\"nano\"\n >\n <Trans\n i18nKey=\"neetoImageUploader.imageUpload.restrictionMessage\"\n values={{\n fileTypes: getAllowedTypes(uploadConfig),\n size: uploadConfig?.maxImageSize,\n }}\n />\n </Typography>\n </div>\n )}\n </div>\n );\n};\n\nexport default ImageDirectUpload;\n","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":["getAllowedTypes","uploadConfig","pipe","values","flatten","map","extension","slice","toUpper","join","allowedImageTypes","ImageDirectUpload","_ref","_ref$uploadConfig","DEFAULT_UPLOAD_CONFIG","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","setIsAssetLibraryOpen","_useUploadDropzone","useUploadDropzone","getRootProps","getInputProps","isDragActive","uploadProgress","shouldShowProgress","equals","_jsx","_objectSpread","className","classnames","DROPZONE_ROOT_DIV_CLASSNAME","children","ProgressBar","progressPercentage","progressValue","concat","_jsxs","Typography","style","Trans","i18nKey","components","span","Button","onClick","e","stopPropagation","disabled","lineHeight","fileTypes","size","maxImageSize","ImagePlaceholder","_ref$className","props","_objectWithoutProperties","_excluded","_defineProperty","ImageWithFallback","src","_ref$fallback","fallback","Fallback","_useState","useState","_useState2","_slicedToArray","isLoaded","setIsLoaded","useEffect","img","Image","onload"],"mappings":"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"}
|
package/dist/cjs/AssetLibrary.js
CHANGED
|
@@ -14,10 +14,10 @@ require('@bigbinary/neetoui/Toastr');
|
|
|
14
14
|
require('@bigbinary/neetoui/Typography');
|
|
15
15
|
require('ramda');
|
|
16
16
|
require('react-i18next');
|
|
17
|
-
require('../utils-
|
|
18
|
-
var AssetLibrary = require('../index-
|
|
19
|
-
require('../useImageUploader-
|
|
20
|
-
require('../index-
|
|
17
|
+
require('../utils-tPaqWDxV.js');
|
|
18
|
+
var AssetLibrary = require('../index-By7BkNOh.js');
|
|
19
|
+
require('../useImageUploader-Bm9TukCy.js');
|
|
20
|
+
require('../index-BtHfh_eu.js');
|
|
21
21
|
require('react/jsx-runtime');
|
|
22
22
|
require('react-dropzone');
|
|
23
23
|
require('i18next');
|
|
@@ -29,7 +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('../query-
|
|
32
|
+
require('../query-B7ahlELA.js');
|
|
33
33
|
require('@bigbinary/neeto-icons/MenuHorizontal');
|
|
34
34
|
require('@bigbinary/neeto-team-members-frontend/constants');
|
|
35
35
|
require('@bigbinary/neetoui/Alert');
|