@bigbinary/neeto-image-uploader-frontend 4.0.2 → 4.0.4

package/dist/utils-BTmA9hHb.js

@@ -0,0 +1,364 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var require$$0 = require('react');
+var classnames = require('classnames');
+var neetoCist = require('@bigbinary/neeto-cist');
+var Button = require('@bigbinary/neetoui/Button');
+var Typography = require('@bigbinary/neetoui/Typography');
+var ProgressBar = require('@bigbinary/neetoui/ProgressBar');
+var ramda = require('ramda');
+var reactI18next = require('react-i18next');
+var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
+var useUploadDropzone = require('./useUploadDropzone-DMv8VMRF.js');
+var imagekit_esm = require('./imagekit.esm-CisvUNYU.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+var DEFAULT_ALLOWED_IMAGE_TYPES = {
+  "image/png": [".png"],
+  "image/jpg": [".jpg", ".jpeg"],
+  "image/gif": [".gif"],
+  "image/svg+xml": [".svg"]
+};
+var DEFAULT_UPLOAD_CONFIG = {
+  maxImageSize: initializers.globalProps.endUserUploadedFileSizeLimitInMb,
+  allowedImageTypes: DEFAULT_ALLOWED_IMAGE_TYPES
+};
+var OPTION_KEYS = {
+  asset: "asset",
+  remove: "remove"
+};
+
+var getAllowedTypes = function getAllowedTypes(uploadConfig) {
+  return ramda.pipe(ramda.values, ramda.flatten, ramda.map(function (extension) {
+    return extension.slice(1);
+  }), ramda.map(ramda.toUpper), ramda.join(", "))(uploadConfig.allowedImageTypes);
+};
+
+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; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).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; }
+var ImageDirectUpload = /*#__PURE__*/require$$0.forwardRef(function (_ref, ref) {
+  var _ref$uploadConfig = _ref.uploadConfig,
+    uploadConfig = _ref$uploadConfig === void 0 ? DEFAULT_UPLOAD_CONFIG : _ref$uploadConfig,
+    _ref$onDrop = _ref.onDrop,
+    onDrop = _ref$onDrop === void 0 ? neetoCist.noop : _ref$onDrop,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    setIsAssetLibraryOpen = _ref.setIsAssetLibraryOpen,
+    _ref$defaultImageSize = _ref.defaultImageSize,
+    defaultImageSize = _ref$defaultImageSize === void 0 ? {} : _ref$defaultImageSize,
+    _ref$isUploadDisabled = _ref.isUploadDisabled,
+    isUploadDisabled = _ref$isUploadDisabled === void 0 ? false : _ref$isUploadDisabled,
+    setImage = _ref.setImage;
+  var _useUploadDropzone = useUploadDropzone.useUploadDropzone({
+      uploadConfig: uploadConfig,
+      onDrop: onDrop,
+      setImage: setImage
+    }),
+    getRootProps = _useUploadDropzone.getRootProps,
+    getInputProps = _useUploadDropzone.getInputProps,
+    isDragActive = _useUploadDropzone.isDragActive,
+    open = _useUploadDropzone.open,
+    uploadProgress = _useUploadDropzone.uploadProgress,
+    setUploadProgress = _useUploadDropzone.setUploadProgress;
+  require$$0.useImperativeHandle(ref, function () {
+    return {
+      upload: function upload(file) {
+        return onDrop(file, setUploadProgress, setImage);
+      }
+    };
+  });
+  var shouldShowProgress = !!(uploadProgress && !ramda.equals(uploadProgress, 1));
+  return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({}, getRootProps()), {}, {
+    className: classnames(imagekit_esm.DROPZONE_ROOT_DIV_CLASSNAME, {
+      "neeto-ui-border-gray-300": !isDragActive,
+      "neeto-ui-border-gray-700": isDragActive
+    }),
+    children: shouldShowProgress ? /*#__PURE__*/jsxRuntime.jsx(ProgressBar, {
+      progressPercentage: uploadProgress,
+      progressValue: "".concat(uploadProgress, "%")
+    }) : /*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "flex flex-col space-y-1",
+      children: [!isDisabled && /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        className: "neeto-ui-text-gray-800 text-center leading-4",
+        style: "body2",
+        children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+          i18nKey: "neetoImageUploader.imageUpload.dragAndDropOrBrowseFile",
+          components: {
+            span: /*#__PURE__*/jsxRuntime.jsx(Button, {
+              "data-testid": "neeto-image-uploader-browse-text",
+              style: "link",
+              onClick: function onClick(event) {
+                event.stopPropagation();
+                open();
+              }
+            })
+          }
+        })
+      }), setIsAssetLibraryOpen && /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        style: "body2",
+        className: classnames("text-center leading-4", {
+          "pointer-events-none": isUploadDisabled
+        }),
+        onClick: function onClick(e) {
+          e.stopPropagation();
+          setIsAssetLibraryOpen(true);
+        },
+        children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+          i18nKey: "neetoImageUploader.imageUpload.upload",
+          components: {
+            span: /*#__PURE__*/jsxRuntime.jsx(Button, {
+              "data-testid": "open-asset-library-button",
+              style: "link"
+            })
+          }
+        })
+      }), /*#__PURE__*/jsxRuntime.jsx("input", _objectSpread(_objectSpread({}, getInputProps()), {}, {
+        "data-testid": "neeto-image-uploader-file-input",
+        disabled: isDisabled || isUploadDisabled
+      })), /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        className: "neeto-ui-text-gray-700 text-center leading-4",
+        "data-testid": "neeto-image-uploader-restriction-message",
+        lineHeight: "snug",
+        style: "nano",
+        children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+          i18nKey: "neetoImageUploader.imageUpload.restrictionMessage",
+          values: {
+            fileTypes: getAllowedTypes(uploadConfig),
+            size: uploadConfig === null || uploadConfig === void 0 ? void 0 : uploadConfig.maxImageSize
+          }
+        })
+      }), neetoCist.isPresent(defaultImageSize) && /*#__PURE__*/jsxRuntime.jsx(Typography, {
+        className: "neeto-ui-text-gray-700 text-center leading-4",
+        "data-testid": "neeto-image-uploader-ideal-image-size-info-text",
+        lineHeight: "snug",
+        style: "nano",
+        children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+          i18nKey: "neetoImageUploader.imageUpload.idealImageSizeInfo",
+          values: _objectSpread({}, defaultImageSize)
+        })
+      })]
+    })
+  }));
+});
+ImageDirectUpload.displayName = "ImageDirectUpload";
+
+var getWholeNumberAspectRatio = function getWholeNumberAspectRatio(_ref) {
+  var width = _ref.width,
+    height = _ref.height;
+  if (width === height) return {
+    width: 1,
+    height: 1
+  };
+  var _gcd = function gcd(a, b) {
+    return b === 0 ? a : _gcd(b, a % b);
+  };
+
+  // Multiplying by 1000 is a temporary fix to prevent height and width with fractions (eg: 100.91).
+  var divisor = _gcd(width * 1000, height * 1000);
+  return {
+    width: width / divisor,
+    height: height / divisor
+  };
+};
+var getCropValues = function getCropValues(_ref2) {
+  var crop = _ref2.crop,
+    imageRef = _ref2.imageRef;
+  var naturalWidth = imageRef.current.naturalWidth;
+  var naturalHeight = imageRef.current.naturalHeight;
+  return {
+    x: crop.x / 100 * naturalWidth,
+    y: crop.y / 100 * naturalHeight,
+    width: crop.width / 100 * naturalWidth,
+    height: crop.height / 100 * naturalHeight
+  };
+};
+var getImageKitCroppedURL = function getImageKitCroppedURL(_ref3) {
+  var imageURL = _ref3.imageURL,
+    crop = _ref3.crop,
+    imageRef = _ref3.imageRef;
+  var imagekit = new imagekit_esm.ImageKit({
+    urlEndpoint: initializers.globalProps.imagekit.urlEndpoint
+  });
+  var _getCropValues = getCropValues({
+      crop: crop,
+      imageRef: imageRef
+    }),
+    x = _getCropValues.x,
+    y = _getCropValues.y,
+    height = _getCropValues.height,
+    width = _getCropValues.width;
+  var transformation = [{
+    cropMode: "extract",
+    x: x,
+    y: y,
+    height: height,
+    width: width
+  }];
+  return imagekit.url({
+    src: imageURL,
+    transformation: transformation
+  });
+};
+var isNilOrEmpty = function isNilOrEmpty(value) {
+  return ramda.isNil(value) || ramda.isEmpty(value);
+};
+var isNotNilOrEmpty = function isNotNilOrEmpty(value) {
+  return !isNilOrEmpty(value);
+};
+var isItemsCenter = function isItemsCenter(_ref4) {
+  var imageRef = _ref4.imageRef,
+    wrapperRef = _ref4.wrapperRef;
+  var _ref5 = imageRef.current || {},
+    imageHeight = _ref5.height,
+    imageWidth = _ref5.width;
+  var wrapperHeight = (wrapperRef.current || {}).clientHeight;
+  if (imageHeight < imageWidth && imageHeight < wrapperHeight - 1) {
+    // Landscape images smaller than wrapper dimensions
+    return true;
+  }
+  if (imageHeight === imageWidth && imageHeight < wrapperHeight - 1) {
+    // Square images smaller than wrapper dimensions
+    return true;
+  }
+  return imageHeight > imageWidth && imageHeight < wrapperHeight - 1;
+};
+var calculateCloudFlareImageCroppedValues = function calculateCloudFlareImageCroppedValues(_ref6) {
+  var image = _ref6.image,
+    crop = _ref6.crop;
+  var naturalWidth = image.metadata.width;
+  var naturalHeight = image.metadata.height;
+  var sourceX = crop.x / 100 * naturalWidth;
+  var sourceY = crop.y / 100 * naturalHeight;
+  var sourceWidth = crop.width / 100 * naturalWidth;
+  var sourceHeight = crop.height / 100 * naturalHeight;
+  var distanceFromRight = Math.abs(naturalWidth - (sourceX + sourceWidth));
+  var distanceFromBottom = Math.abs(naturalHeight - (sourceY + sourceHeight));
+  return {
+    top: sourceY,
+    right: distanceFromRight,
+    bottom: distanceFromBottom,
+    left: sourceX
+  };
+};
+var getCloudFlareCroppedURL = function getCloudFlareCroppedURL(_ref7) {
+  var image = _ref7.image,
+    crop = _ref7.crop;
+  var _calculateCloudFlareI = calculateCloudFlareImageCroppedValues({
+      image: image,
+      crop: crop
+    }),
+    top = _calculateCloudFlareI.top,
+    right = _calculateCloudFlareI.right,
+    bottom = _calculateCloudFlareI.bottom,
+    left = _calculateCloudFlareI.left;
+  var trimValues = "".concat(top, ";").concat(right, ";").concat(bottom, ";").concat(left);
+  return image.url.replace("public", "trim=".concat(trimValues));
+};
+var getAspectRatio = function getAspectRatio(_ref8) {
+  var fixedAspectRatio = _ref8.fixedAspectRatio,
+    imageSize = _ref8.imageSize;
+  if (neetoCist.isPresent(fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.width) && neetoCist.isPresent(fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.height)) {
+    return fixedAspectRatio;
+  }
+  if (neetoCist.isPresent(imageSize === null || imageSize === void 0 ? void 0 : imageSize.width) && neetoCist.isPresent(imageSize === null || imageSize === void 0 ? void 0 : imageSize.height)) {
+    return getWholeNumberAspectRatio(imageSize);
+  }
+  return {
+    width: 16,
+    height: 9
+  };
+};
+var getPixels = function getPixels(percentage, pixel) {
+  return Math.round(percentage / 100 * pixel);
+};
+var getPercentage = function getPercentage(crop, full) {
+  return crop / full * 100;
+};
+var getInitialCropSize = function getInitialCropSize(_ref9) {
+  var image = _ref9.image,
+    aspectRatioFactor = _ref9.aspectRatioFactor,
+    maxCropWidth = _ref9.maxCropWidth;
+  var imageWidth = image.naturalWidth,
+    imageHeight = image.naturalHeight;
+  var imageAspectRatio = imageWidth / imageHeight;
+  var maxCropHeight = maxCropWidth / aspectRatioFactor;
+  var cropWidth, cropHeight;
+  if (imageAspectRatio > aspectRatioFactor) {
+    cropWidth = Math.min(maxCropWidth, imageWidth);
+    cropHeight = cropWidth / aspectRatioFactor;
+  } else if (imageHeight < maxCropHeight) {
+    cropWidth = imageWidth;
+    cropHeight = imageHeight;
+  } else {
+    cropHeight = Math.min(maxCropHeight, imageHeight);
+    cropWidth = cropHeight * aspectRatioFactor;
+  }
+  return {
+    cropWidth: cropWidth,
+    cropHeight: cropHeight
+  };
+};
+var getHeightFromAspectRatio = function getHeightFromAspectRatio(width, aspectRatio) {
+  return Math.round(width * aspectRatio.height / aspectRatio.width);
+};
+var getWidthFromAspectRatio = function getWidthFromAspectRatio(height, aspectRatio) {
+  return Math.round(height * aspectRatio.width / aspectRatio.height);
+};
+var getWrapperRefStyles = function getWrapperRefStyles(wrapperRef, imageRef) {
+  var _ref10 = imageRef.current || {},
+    _ref10$naturalHeight = _ref10.naturalHeight,
+    naturalHeight = _ref10$naturalHeight === void 0 ? 100 : _ref10$naturalHeight,
+    _ref10$naturalWidth = _ref10.naturalWidth,
+    naturalWidth = _ref10$naturalWidth === void 0 ? 100 : _ref10$naturalWidth;
+  var _ref11 = wrapperRef.current || {},
+    _ref11$clientHeight = _ref11.clientHeight,
+    clientHeight = _ref11$clientHeight === void 0 ? 100 : _ref11$clientHeight,
+    _ref11$clientWidth = _ref11.clientWidth,
+    clientWidth = _ref11$clientWidth === void 0 ? 100 : _ref11$clientWidth;
+  if (naturalWidth <= clientWidth && naturalHeight <= clientHeight) {
+    return {
+      maxWidth: naturalWidth
+    };
+  } else if (naturalWidth > clientWidth && naturalHeight <= clientHeight) {
+    return {
+      maxWidth: clientWidth
+    };
+  } else if (naturalWidth <= clientWidth && naturalHeight > clientHeight) {
+    var _maxWidth = naturalWidth / naturalHeight * clientHeight;
+    return {
+      maxWidth: _maxWidth
+    };
+  }
+
+  // landscape
+  if (naturalWidth > naturalHeight) {
+    return {
+      maxWidth: clientWidth
+    };
+  }
+
+  // portrait
+  var maxWidth = naturalWidth / naturalHeight * clientHeight;
+  return {
+    maxWidth: maxWidth
+  };
+};
+
+exports.DEFAULT_UPLOAD_CONFIG = DEFAULT_UPLOAD_CONFIG;
+exports.ImageDirectUpload = ImageDirectUpload;
+exports.OPTION_KEYS = OPTION_KEYS;
+exports.getAspectRatio = getAspectRatio;
+exports.getCloudFlareCroppedURL = getCloudFlareCroppedURL;
+exports.getCropValues = getCropValues;
+exports.getHeightFromAspectRatio = getHeightFromAspectRatio;
+exports.getImageKitCroppedURL = getImageKitCroppedURL;
+exports.getInitialCropSize = getInitialCropSize;
+exports.getPercentage = getPercentage;
+exports.getPixels = getPixels;
+exports.getWidthFromAspectRatio = getWidthFromAspectRatio;
+exports.getWrapperRefStyles = getWrapperRefStyles;
+exports.isItemsCenter = isItemsCenter;
+exports.isNilOrEmpty = isNilOrEmpty;
+exports.isNotNilOrEmpty = isNotNilOrEmpty;
+//# sourceMappingURL=utils-BTmA9hHb.js.map

package/dist/utils-BTmA9hHb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils-BTmA9hHb.js","sources":["../app/javascript/src/components/ImageUploader/constants.js","../app/javascript/src/components/ImageUploader/utils.js","../app/javascript/src/components/common/ImageDirectUpload.jsx","../app/javascript/src/components/ImageEditor/utils.js"],"sourcesContent":["import { globalProps } from \"neetocommons/initializers\";\n\nexport const DEFAULT_ALLOWED_IMAGE_TYPES = {\n  \"image/png\": [\".png\"],\n  \"image/jpg\": [\".jpg\", \".jpeg\"],\n  \"image/gif\": [\".gif\"],\n  \"image/svg+xml\": [\".svg\"],\n};\n\nexport const DEFAULT_UPLOAD_CONFIG = {\n  maxImageSize: globalProps.endUserUploadedFileSizeLimitInMb,\n  allowedImageTypes: DEFAULT_ALLOWED_IMAGE_TYPES,\n};\n\nexport const OPTION_KEYS = { asset: \"asset\", remove: \"remove\" };\n","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 { forwardRef, useImperativeHandle } from \"react\";\n\nimport classnames from \"classnames\";\nimport { noop, isPresent } 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 = forwardRef(\n  (\n    {\n      uploadConfig = DEFAULT_UPLOAD_CONFIG,\n      onDrop = noop,\n      isDisabled = false,\n      setIsAssetLibraryOpen,\n      defaultImageSize = {},\n      isUploadDisabled = false,\n      setImage,\n    },\n    ref\n  ) => {\n    const {\n      getRootProps,\n      getInputProps,\n      isDragActive,\n      open,\n      uploadProgress,\n      setUploadProgress,\n    } = useUploadDropzone({ uploadConfig, onDrop, setImage });\n\n    useImperativeHandle(ref, () => ({\n      upload: file => onDrop(file, setUploadProgress, setImage),\n    }));\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-testid=\"neeto-image-uploader-browse-text\"\n                        style=\"link\"\n                        onClick={event => {\n                          event.stopPropagation();\n                          open();\n                        }}\n                      />\n                    ),\n                  }}\n                />\n              </Typography>\n            )}\n            {setIsAssetLibraryOpen && (\n              <Typography\n                style=\"body2\"\n                className={classnames(\"text-center leading-4\", {\n                  \"pointer-events-none\": isUploadDisabled,\n                })}\n                onClick={e => {\n                  e.stopPropagation();\n                  setIsAssetLibraryOpen(true);\n                }}\n              >\n                <Trans\n                  i18nKey=\"neetoImageUploader.imageUpload.upload\"\n                  components={{\n                    span: (\n                      <Button\n                        data-testid=\"open-asset-library-button\"\n                        style=\"link\"\n                      />\n                    ),\n                  }}\n                />\n              </Typography>\n            )}\n            <input\n              {...getInputProps()}\n              data-testid=\"neeto-image-uploader-file-input\"\n              disabled={isDisabled || isUploadDisabled}\n            />\n            <Typography\n              className=\"neeto-ui-text-gray-700 text-center leading-4\"\n              data-testid=\"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            {isPresent(defaultImageSize) && (\n              <Typography\n                className=\"neeto-ui-text-gray-700 text-center leading-4\"\n                data-testid=\"neeto-image-uploader-ideal-image-size-info-text\"\n                lineHeight=\"snug\"\n                style=\"nano\"\n              >\n                <Trans\n                  i18nKey=\"neetoImageUploader.imageUpload.idealImageSizeInfo\"\n                  values={{ ...defaultImageSize }}\n                />\n              </Typography>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nImageDirectUpload.displayName = \"ImageDirectUpload\";\n\nexport default ImageDirectUpload;\n","import ImageKit from \"imagekit-javascript\";\nimport { isPresent } from \"neetocist\";\nimport { globalProps } from \"neetocommons/initializers\";\nimport { isEmpty, isNil } from \"ramda\";\n\nconst getWholeNumberAspectRatio = ({ width, height }) => {\n  if (width === height) return { width: 1, height: 1 };\n\n  const gcd = (a, b) => (b === 0 ? a : gcd(b, a % b));\n\n  // Multiplying by 1000 is a temporary fix to prevent height and width with fractions (eg: 100.91).\n  const divisor = gcd(width * 1000, height * 1000);\n\n  return { width: width / divisor, height: height / divisor };\n};\n\nexport const getCropValues = ({ crop, imageRef }) => {\n  const naturalWidth = imageRef.current.naturalWidth;\n  const naturalHeight = imageRef.current.naturalHeight;\n\n  return {\n    x: (crop.x / 100) * naturalWidth,\n    y: (crop.y / 100) * naturalHeight,\n    width: (crop.width / 100) * naturalWidth,\n    height: (crop.height / 100) * naturalHeight,\n  };\n};\n\nexport const getImageKitCroppedURL = ({ imageURL, crop, imageRef }) => {\n  const imagekit = new ImageKit({\n    urlEndpoint: globalProps.imagekit.urlEndpoint,\n  });\n  const { x, y, height, width } = getCropValues({ crop, imageRef });\n\n  const transformation = [{ cropMode: \"extract\", x, y, height, width }];\n\n  return imagekit.url({ src: imageURL, transformation });\n};\n\nexport const isNilOrEmpty = value => isNil(value) || isEmpty(value);\nexport const isNotNilOrEmpty = value => !isNilOrEmpty(value);\n\nexport const isItemsCenter = ({ imageRef, wrapperRef }) => {\n  const { height: imageHeight, width: imageWidth } = imageRef.current || {};\n  const wrapperHeight = (wrapperRef.current || {}).clientHeight;\n\n  if (imageHeight < imageWidth && imageHeight < wrapperHeight - 1) {\n    // Landscape images smaller than wrapper dimensions\n    return true;\n  }\n\n  if (imageHeight === imageWidth && imageHeight < wrapperHeight - 1) {\n    // Square images smaller than wrapper dimensions\n    return true;\n  }\n\n  return imageHeight > imageWidth && imageHeight < wrapperHeight - 1;\n};\n\nexport const calculateCloudFlareImageCroppedValues = ({ image, crop }) => {\n  const naturalWidth = image.metadata.width;\n  const naturalHeight = image.metadata.height;\n\n  const sourceX = (crop.x / 100) * naturalWidth;\n  const sourceY = (crop.y / 100) * naturalHeight;\n  const sourceWidth = (crop.width / 100) * naturalWidth;\n  const sourceHeight = (crop.height / 100) * naturalHeight;\n\n  const distanceFromRight = Math.abs(naturalWidth - (sourceX + sourceWidth));\n  const distanceFromBottom = Math.abs(naturalHeight - (sourceY + sourceHeight));\n\n  return {\n    top: sourceY,\n    right: distanceFromRight,\n    bottom: distanceFromBottom,\n    left: sourceX,\n  };\n};\n\nexport const getCloudFlareCroppedURL = ({ image, crop }) => {\n  const { top, right, bottom, left } = calculateCloudFlareImageCroppedValues({\n    image,\n    crop,\n  });\n  const trimValues = `${top};${right};${bottom};${left}`;\n\n  return image.url.replace(\"public\", `trim=${trimValues}`);\n};\n\nexport const getAspectRatio = ({ fixedAspectRatio, imageSize }) => {\n  if (\n    isPresent(fixedAspectRatio?.width) &&\n    isPresent(fixedAspectRatio?.height)\n  ) {\n    return fixedAspectRatio;\n  }\n\n  if (isPresent(imageSize?.width) && isPresent(imageSize?.height)) {\n    return getWholeNumberAspectRatio(imageSize);\n  }\n\n  return { width: 16, height: 9 };\n};\n\nexport const getPixels = (percentage, pixel) =>\n  Math.round((percentage / 100) * pixel);\n\nexport const getPercentage = (crop, full) => (crop / full) * 100;\n\nexport const getInitialCropSize = ({\n  image,\n  aspectRatioFactor,\n  maxCropWidth,\n}) => {\n  const { naturalWidth: imageWidth, naturalHeight: imageHeight } = image;\n  const imageAspectRatio = imageWidth / imageHeight;\n  const maxCropHeight = maxCropWidth / aspectRatioFactor;\n\n  let cropWidth, cropHeight;\n\n  if (imageAspectRatio > aspectRatioFactor) {\n    cropWidth = Math.min(maxCropWidth, imageWidth);\n    cropHeight = cropWidth / aspectRatioFactor;\n  } else if (imageHeight < maxCropHeight) {\n    cropWidth = imageWidth;\n    cropHeight = imageHeight;\n  } else {\n    cropHeight = Math.min(maxCropHeight, imageHeight);\n    cropWidth = cropHeight * aspectRatioFactor;\n  }\n\n  return { cropWidth, cropHeight };\n};\n\nexport const getHeightFromAspectRatio = (width, aspectRatio) =>\n  Math.round((width * aspectRatio.height) / aspectRatio.width);\n\nexport const getWidthFromAspectRatio = (height, aspectRatio) =>\n  Math.round((height * aspectRatio.width) / aspectRatio.height);\n\nexport const getWrapperRefStyles = (wrapperRef, imageRef) => {\n  const { naturalHeight = 100, naturalWidth = 100 } = imageRef.current || {};\n  const { clientHeight = 100, clientWidth = 100 } = wrapperRef.current || {};\n\n  if (naturalWidth <= clientWidth && naturalHeight <= clientHeight) {\n    return { maxWidth: naturalWidth };\n  } else if (naturalWidth > clientWidth && naturalHeight <= clientHeight) {\n    return { maxWidth: clientWidth };\n  } else if (naturalWidth <= clientWidth && naturalHeight > clientHeight) {\n    const maxWidth = (naturalWidth / naturalHeight) * clientHeight;\n\n    return { maxWidth };\n  }\n\n  // landscape\n  if (naturalWidth > naturalHeight) {\n    return { maxWidth: clientWidth };\n  }\n\n  // portrait\n  const maxWidth = (naturalWidth / naturalHeight) * clientHeight;\n\n  return { maxWidth };\n};\n"],"names":["DEFAULT_ALLOWED_IMAGE_TYPES","DEFAULT_UPLOAD_CONFIG","maxImageSize","globalProps","endUserUploadedFileSizeLimitInMb","allowedImageTypes","OPTION_KEYS","asset","remove","getAllowedTypes","uploadConfig","pipe","values","flatten","map","extension","slice","toUpper","join","ImageDirectUpload","forwardRef","_ref","ref","_ref$uploadConfig","_ref$onDrop","onDrop","noop","_ref$isDisabled","isDisabled","setIsAssetLibraryOpen","_ref$defaultImageSize","defaultImageSize","_ref$isUploadDisabled","isUploadDisabled","setImage","_useUploadDropzone","useUploadDropzone","getRootProps","getInputProps","isDragActive","open","uploadProgress","setUploadProgress","useImperativeHandle","upload","file","shouldShowProgress","equals","_jsx","_objectSpread","className","classnames","DROPZONE_ROOT_DIV_CLASSNAME","children","ProgressBar","progressPercentage","progressValue","concat","_jsxs","Typography","style","Trans","i18nKey","components","span","Button","onClick","event","stopPropagation","e","disabled","lineHeight","fileTypes","size","isPresent","displayName","getWholeNumberAspectRatio","width","height","gcd","a","b","divisor","getCropValues","_ref2","crop","imageRef","naturalWidth","current","naturalHeight","x","y","getImageKitCroppedURL","_ref3","imageURL","imagekit","ImageKit","urlEndpoint","_getCropValues","transformation","cropMode","url","src","isNilOrEmpty","value","isNil","isEmpty","isNotNilOrEmpty","isItemsCenter","_ref4","wrapperRef","_ref5","imageHeight","imageWidth","wrapperHeight","clientHeight","calculateCloudFlareImageCroppedValues","_ref6","image","metadata","sourceX","sourceY","sourceWidth","sourceHeight","distanceFromRight","Math","abs","distanceFromBottom","top","right","bottom","left","getCloudFlareCroppedURL","_ref7","_calculateCloudFlareI","trimValues","replace","getAspectRatio","_ref8","fixedAspectRatio","imageSize","getPixels","percentage","pixel","round","getPercentage","full","getInitialCropSize","_ref9","aspectRatioFactor","maxCropWidth","imageAspectRatio","maxCropHeight","cropWidth","cropHeight","min","getHeightFromAspectRatio","aspectRatio","getWidthFromAspectRatio","getWrapperRefStyles","_ref10","_ref10$naturalHeight","_ref10$naturalWidth","_ref11","_ref11$clientHeight","_ref11$clientWidth","clientWidth","maxWidth"],"mappings":"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"}

package/dist/{utils-YicuhSoR.js → utils-D5iQ8UME.js}

@@ -1,19 +1,15 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { useState, forwardRef, useImperativeHandle } from 'react';
+import { forwardRef, useImperativeHandle } from 'react';
+import { Progress, Typography, Button } from '@bigbinary/neeto-atoms';
 import classnames from 'classnames';
-import { noop, isPresent } from '@bigbinary/neeto-cist';
-import Button from '@bigbinary/neetoui/Button';
-import Typography from '@bigbinary/neetoui/Typography';
-import ProgressBar from '@bigbinary/neetoui/ProgressBar';
+import { isPresent, noop } from '@bigbinary/neeto-cist';
 import { pipe, values, flatten, map, toUpper, join, equals, isNil, isEmpty } from 'ramda';
 import { Trans } from 'react-i18next';
-import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useDropzone } from 'react-dropzone';
+import { u as useUploadDropzone } from './useUploadDropzone-8Xa8PI-1.js';
+import { globalProps } from '@bigbinary/neeto-commons-frontend/v2/initializers';
 import i18next, { t } from 'i18next';
-import Toastr from '@bigbinary/neetoui/Toastr';
-import { F as FILE_ERRORS, D as DROPZONE_ROOT_DIV_CLASSNAME, C as CLOUD_FLARE, b as IMAGE_UPLOADER_BASE_URL, I as IS_DEVELOPMENT_OR_HEROKU_ENV, a as ImageKit } from './imagekit.esm-CXW6c1fP.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
+import { C as CLOUD_FLARE, a as IMAGE_UPLOADER_BASE_URL, I as IS_DEVELOPMENT_OR_HEROKU_ENV, b as ImageKit } from './imagekit.esm-IYQEzBnD.js';
 
 var DEFAULT_ALLOWED_IMAGE_TYPES = {
   "image/png": [".png"],
@@ -36,49 +32,13 @@ var getAllowedTypes = function getAllowedTypes(uploadConfig) {
   }), map(toUpper), join(", "))(uploadConfig.allowedImageTypes);
 };
 
-var handleDropRejected = function handleDropRejected(fileRejections) {
-  fileRejections.map(function (_ref) {
-    var errors = _ref.errors;
-    return errors.map(function (_ref2) {
-      var code = _ref2.code;
-      return Toastr.error(FILE_ERRORS[code] || t("neetoImageUploader.imageUpload.genericError"));
-    });
-  });
-};
-
-var useUploadDropzone = function useUploadDropzone(_ref) {
-  var _ref$uploadConfig = _ref.uploadConfig,
-    uploadConfig = _ref$uploadConfig === void 0 ? {
-      allowedImageTypes: [],
-      maxImageSize: 0
-    } : _ref$uploadConfig,
-    _onDrop = _ref.onDrop,
-    _ref$setImage = _ref.setImage,
-    setImage = _ref$setImage === void 0 ? noop : _ref$setImage;
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    uploadProgress = _useState2[0],
-    setUploadProgress = _useState2[1];
-  var _useDropzone = useDropzone({
-      onDrop: function onDrop(acceptedFiles) {
-        return _onDrop(acceptedFiles[0], setUploadProgress, setImage);
-      },
-      accept: uploadConfig === null || uploadConfig === void 0 ? void 0 : uploadConfig.allowedImageTypes,
-      multiple: false,
-      maxSize: uploadConfig.maxImageSize * 1048576,
-      onDropRejected: handleDropRejected
-    }),
-    getRootProps = _useDropzone.getRootProps,
-    getInputProps = _useDropzone.getInputProps,
-    isDragActive = _useDropzone.isDragActive;
-  return {
-    getRootProps: getRootProps,
-    getInputProps: getInputProps,
-    isDragActive: isDragActive,
-    uploadProgress: uploadProgress,
-    setUploadProgress: setUploadProgress
-  };
-};
+var DROPZONE_ROOT_DIV_CLASSNAME = "neeto-ui-border-primary-600 hover:neeto-ui-bg-gray-100 neeto-ui-rounded-lg flex h-full w-full flex-col items-center justify-center gap-3 border border-dashed p-4 transition-all duration-300 ease-in-out relative";
+({
+  "file-invalid-type": t("neetoImageUploader.imageUpload.fileTypeError"),
+  "file-too-large": t("neetoImageUploader.imageUpload.fileSizeError"),
+  "file-dimension-too-large": t("neetoImageUploader.imageUpload.fileDimensionError"),
+  "file-resolution-too-large": t("neetoImageUploader.imageUpload.fileResolutionError")
+});
 
 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; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).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; }
@@ -103,6 +63,7 @@ var ImageDirectUpload = /*#__PURE__*/forwardRef(function (_ref, ref) {
     getRootProps = _useUploadDropzone.getRootProps,
     getInputProps = _useUploadDropzone.getInputProps,
     isDragActive = _useUploadDropzone.isDragActive,
+    open = _useUploadDropzone.open,
     uploadProgress = _useUploadDropzone.uploadProgress,
     setUploadProgress = _useUploadDropzone.setUploadProgress;
   useImperativeHandle(ref, function () {
@@ -118,25 +79,29 @@ var ImageDirectUpload = /*#__PURE__*/forwardRef(function (_ref, ref) {
       "neeto-ui-border-gray-300": !isDragActive,
       "neeto-ui-border-gray-700": isDragActive
     }),
-    children: shouldShowProgress ? /*#__PURE__*/jsx(ProgressBar, {
-      progressPercentage: uploadProgress,
-      progressValue: "".concat(uploadProgress, "%")
+    children: shouldShowProgress ? /*#__PURE__*/jsx(Progress, {
+      progressValue: "".concat(uploadProgress, "%"),
+      value: uploadProgress
     }) : /*#__PURE__*/jsxs("div", {
       className: "flex flex-col space-y-1",
       children: [!isDisabled && /*#__PURE__*/jsx(Typography, {
         className: "neeto-ui-text-gray-800 text-center leading-4",
-        style: "body2",
+        variant: "body2",
         children: /*#__PURE__*/jsx(Trans, {
           i18nKey: "neetoImageUploader.imageUpload.dragAndDropOrBrowseFile",
           components: {
             span: /*#__PURE__*/jsx(Button, {
               "data-testid": "neeto-image-uploader-browse-text",
-              style: "link"
+              variant: "link",
+              onClick: function onClick(event) {
+                event.stopPropagation();
+                open();
+              }
             })
           }
         })
       }), setIsAssetLibraryOpen && /*#__PURE__*/jsx(Typography, {
-        style: "body2",
+        variant: "body2",
         className: classnames("text-center leading-4", {
           "pointer-events-none": isUploadDisabled
         }),
@@ -149,7 +114,7 @@ var ImageDirectUpload = /*#__PURE__*/forwardRef(function (_ref, ref) {
           components: {
             span: /*#__PURE__*/jsx(Button, {
               "data-testid": "open-asset-library-button",
-              style: "link"
+              variant: "link"
             })
           }
         })
@@ -159,8 +124,7 @@ var ImageDirectUpload = /*#__PURE__*/forwardRef(function (_ref, ref) {
       })), /*#__PURE__*/jsx(Typography, {
         className: "neeto-ui-text-gray-700 text-center leading-4",
         "data-testid": "neeto-image-uploader-restriction-message",
-        lineHeight: "snug",
-        style: "nano",
+        variant: "nano",
         children: /*#__PURE__*/jsx(Trans, {
           i18nKey: "neetoImageUploader.imageUpload.restrictionMessage",
           values: {
@@ -171,8 +135,7 @@ var ImageDirectUpload = /*#__PURE__*/forwardRef(function (_ref, ref) {
       }), isPresent(defaultImageSize) && /*#__PURE__*/jsx(Typography, {
         className: "neeto-ui-text-gray-700 text-center leading-4",
         "data-testid": "neeto-image-uploader-ideal-image-size-info-text",
-        lineHeight: "snug",
-        style: "nano",
+        variant: "nano",
         children: /*#__PURE__*/jsx(Trans, {
           i18nKey: "neetoImageUploader.imageUpload.idealImageSizeInfo",
           values: _objectSpread({}, defaultImageSize)
@@ -435,5 +398,5 @@ var getWrapperRefStyles = function getWrapperRefStyles(wrapperRef, imageRef) {
   };
 };
 
-export { ASSETS_DESTROY_URL as A, DEFAULT_UPLOAD_CONFIG as D, IMAGE_WRAPPER_CLASSNAME as I, OPTION_KEYS as O, TABS as T, UNSPLASH_DEFAULT_NAME as U, ImageDirectUpload as a, isNilOrEmpty as b, DEFAULT_CROP_CONFIG as c, getPixels as d, getHeightFromAspectRatio as e, getWidthFromAspectRatio as f, getAspectRatio as g, getInitialCropSize as h, isNotNilOrEmpty as i, getPercentage as j, getWrapperRefStyles as k, isItemsCenter as l, getCloudFlareCroppedURL as m, getImageKitCroppedURL as n, getCropValues as o, IMAGES_PER_PAGE as p, INFINITE_SCROLLER_STYLE as q, INFINITE_SCROLLER_SIZES as r, ASSETS_FETCH_URL as s, UNSPLASH_DEFAULT_REQUEST_CONFIG as t, useUploadDropzone as u, UNSPLASH_URL as v };
-//# sourceMappingURL=utils-YicuhSoR.js.map
+export { ASSETS_DESTROY_URL as A, DEFAULT_UPLOAD_CONFIG as D, IMAGE_WRAPPER_CLASSNAME as I, OPTION_KEYS as O, TABS as T, UNSPLASH_DEFAULT_NAME as U, ImageDirectUpload as a, isNilOrEmpty as b, DEFAULT_CROP_CONFIG as c, getPixels as d, getHeightFromAspectRatio as e, getWidthFromAspectRatio as f, getAspectRatio as g, getInitialCropSize as h, isNotNilOrEmpty as i, getPercentage as j, getWrapperRefStyles as k, isItemsCenter as l, getCloudFlareCroppedURL as m, getImageKitCroppedURL as n, getCropValues as o, INFINITE_SCROLLER_STYLE as p, INFINITE_SCROLLER_SIZES as q, IMAGES_PER_PAGE as r, ASSETS_FETCH_URL as s, UNSPLASH_DEFAULT_REQUEST_CONFIG as t, UNSPLASH_URL as u };
+//# sourceMappingURL=utils-D5iQ8UME.js.map