@bigbinary/neeto-image-uploader-frontend 1.5.26 → 1.6.0-beta2

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/index.cjs.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var React = require('react');
5
+ var require$$0 = require('react');
6
6
  var classnames = require('classnames');
7
7
  var neetoCist = require('@bigbinary/neeto-cist');
8
8
  var neetoIcons = require('@bigbinary/neeto-icons');
@@ -13,12 +13,13 @@ var reactI18next = require('react-i18next');
13
13
  var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
14
14
  var i18next = require('i18next');
15
15
  var Toastr = require('@bigbinary/neetoui/Toastr');
16
+ var jsxRuntime = require('react/jsx-runtime');
16
17
  var Dropdown = require('@bigbinary/neetoui/Dropdown');
17
18
  var NeetoUIModal = require('@bigbinary/neetoui/Modal');
18
19
  var Tab = require('@bigbinary/neetoui/Tab');
19
20
  var Spinner = require('@bigbinary/neetoui/Spinner');
21
+ var reactQuery = require('@tanstack/react-query');
20
22
  var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
21
- var reactQuery = require('react-query');
22
23
  var axios = require('axios');
23
24
  var activestorage = require('@rails/activestorage');
24
25
  var utils = require('@bigbinary/neeto-commons-frontend/utils');
@@ -27,7 +28,7 @@ var Switch = require('@bigbinary/neetoui/Switch');
27
28
 
28
29
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
29
30
 
30
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
31
+ var require$$0__default = /*#__PURE__*/_interopDefaultLegacy(require$$0);
31
32
  var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
32
33
  var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
33
34
  var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
@@ -46,21 +47,6 @@ var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r
46
47
  var css = ".ReactCrop{position:relative;display:inline-block;cursor:crosshair;overflow:hidden;max-width:100%}.ReactCrop *,.ReactCrop *::before,.ReactCrop *::after{box-sizing:border-box}.ReactCrop--disabled,.ReactCrop--locked{cursor:inherit}.ReactCrop__child-wrapper{max-height:inherit}.ReactCrop__child-wrapper>img,.ReactCrop__child-wrapper>video{display:block;max-width:100%;max-height:inherit}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>img,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>video{touch-action:none}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection{touch-action:none}.ReactCrop__crop-selection{position:absolute;top:0;left:0;transform:translate3d(0, 0, 0);cursor:move;box-shadow:0 0 0 9999em rgba(0,0,0,.5);border:1px dashed #fff}.ReactCrop--disabled .ReactCrop__crop-selection{cursor:inherit}.ReactCrop--circular-crop .ReactCrop__crop-selection{border-radius:50%;box-shadow:0px 0px 1px 1px #fff,0 0 0 9999em rgba(0,0,0,.5)}.ReactCrop__crop-selection:focus{outline:none;border-color:blue;border-style:solid}.ReactCrop--invisible-crop .ReactCrop__crop-selection{display:none}.ReactCrop__rule-of-thirds-vt::before,.ReactCrop__rule-of-thirds-vt::after,.ReactCrop__rule-of-thirds-hz::before,.ReactCrop__rule-of-thirds-hz::after{content:\"\";display:block;position:absolute;background-color:rgba(255,255,255,.4)}.ReactCrop__rule-of-thirds-vt::before,.ReactCrop__rule-of-thirds-vt::after{width:1px;height:100%}.ReactCrop__rule-of-thirds-vt::before{left:33.3333333333%}.ReactCrop__rule-of-thirds-vt::after{left:66.6666666667%}.ReactCrop__rule-of-thirds-hz::before,.ReactCrop__rule-of-thirds-hz::after{width:100%;height:1px}.ReactCrop__rule-of-thirds-hz::before{top:33.3333333333%}.ReactCrop__rule-of-thirds-hz::after{top:66.6666666667%}.ReactCrop__drag-handle{position:absolute}.ReactCrop__drag-handle::after{position:absolute;content:\"\";display:block;width:10px;height:10px;background-color:rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.7);outline:1px solid rgba(0,0,0,0)}.ReactCrop__drag-handle:focus::after{border-color:blue;background:#2dbfff}.ReactCrop .ord-nw{top:0;left:0;margin-top:-5px;margin-left:-5px;cursor:nw-resize}.ReactCrop .ord-nw::after{top:0;left:0}.ReactCrop .ord-n{top:0;left:50%;margin-top:-5px;margin-left:-5px;cursor:n-resize}.ReactCrop .ord-n::after{top:0}.ReactCrop .ord-ne{top:0;right:0;margin-top:-5px;margin-right:-5px;cursor:ne-resize}.ReactCrop .ord-ne::after{top:0;right:0}.ReactCrop .ord-e{top:50%;right:0;margin-top:-5px;margin-right:-5px;cursor:e-resize}.ReactCrop .ord-e::after{right:0}.ReactCrop .ord-se{bottom:0;right:0;margin-bottom:-5px;margin-right:-5px;cursor:se-resize}.ReactCrop .ord-se::after{bottom:0;right:0}.ReactCrop .ord-s{bottom:0;left:50%;margin-bottom:-5px;margin-left:-5px;cursor:s-resize}.ReactCrop .ord-s::after{bottom:0}.ReactCrop .ord-sw{bottom:0;left:0;margin-bottom:-5px;margin-left:-5px;cursor:sw-resize}.ReactCrop .ord-sw::after{bottom:0;left:0}.ReactCrop .ord-w{top:50%;left:0;margin-top:-5px;margin-left:-5px;cursor:w-resize}.ReactCrop .ord-w::after{left:0}.ReactCrop__disabled .ReactCrop__drag-handle{cursor:inherit}.ReactCrop__drag-bar{position:absolute}.ReactCrop__drag-bar.ord-n{top:0;left:0;width:100%;height:6px;margin-top:-3px}.ReactCrop__drag-bar.ord-e{right:0;top:0;width:6px;height:100%;margin-right:-3px}.ReactCrop__drag-bar.ord-s{bottom:0;left:0;width:100%;height:6px;margin-bottom:-3px}.ReactCrop__drag-bar.ord-w{top:0;left:0;width:6px;height:100%;margin-left:-3px}.ReactCrop--new-crop .ReactCrop__drag-bar,.ReactCrop--new-crop .ReactCrop__drag-handle,.ReactCrop--fixed-aspect .ReactCrop__drag-bar{display:none}.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w{display:none}@media(pointer: coarse){.ReactCrop .ord-n,.ReactCrop .ord-e,.ReactCrop .ord-s,.ReactCrop .ord-w{display:none}.ReactCrop__drag-handle{width:24px;height:24px}}.niu-modal {\n width: 95vw !important;\n height: 75vh !important;\n max-width: 1152px !important;\n max-height: 576px !important;\n position: relative !important;\n}.niu-unsplash-container {\n height: calc(75vh - 220px) !important;\n max-height: 355px;\n}.niu-unsplash-container img {\n height: 100%;\n width: 100%;\n -o-object-fit: cover;\n object-fit: cover;\n animation: fade-in 1.2s 1s cubic-bezier(0.39, 0.575, 0.565, 1) both;\n border-radius: var(--neeto-ui-rounded);\n position: relative;\n cursor: pointer;\n}.ReactCrop .ReactCrop__child-wrapper {\n width: 100%;\n height: 100%;\n}.ReactCrop .ReactCrop__child-wrapper img {\n height: auto;\n width: auto;\n max-width: 100%;\n max-height: 100%;\n display: block;\n}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm5vZGVfbW9kdWxlcy9yZWFjdC1pbWFnZS1jcm9wL2Rpc3QvUmVhY3RDcm9wLmNzcyIsImFwcC9qYXZhc2NyaXB0L3N0eWxlc2hlZXRzL2NvbXBvbmVudHMvX21vZGFsLnNjc3MiLCJhcHAvamF2YXNjcmlwdC9zdHlsZXNoZWV0cy9hcHBsaWNhdGlvbi5zY3NzIiwiYXBwL2phdmFzY3JpcHQvc3R5bGVzaGVldHMvY29tcG9uZW50cy9faW1hZ2UtbGlicmFyeS5zY3NzIiwiYXBwL2phdmFzY3JpcHQvc3R5bGVzaGVldHMvYWJzdHJhY3RzL192YXJpYWJsZXMuc2NzcyIsImFwcC9qYXZhc2NyaXB0L3N0eWxlc2hlZXRzL2NvbXBvbmVudHMvX3JlYWN0LWNyb3Auc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxXQUFXLGlCQUFpQixDQUFDLG9CQUFvQixDQUFDLGdCQUFnQixDQUFDLGVBQWUsQ0FBQyxjQUFjLENBQUMsc0RBQXNELHFCQUFxQixDQUFDLHdDQUF3QyxjQUFjLENBQUMsMEJBQTBCLGtCQUFrQixDQUFDLDhEQUE4RCxhQUFhLENBQUMsY0FBYyxDQUFDLGtCQUFrQixDQUFDLHdJQUF3SSxpQkFBaUIsQ0FBQyxnRUFBZ0UsaUJBQWlCLENBQUMsMkJBQTJCLGlCQUFpQixDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsOEJBQThCLENBQUMsV0FBVyxDQUFDLHNDQUFzQyxDQUFDLHNCQUFzQixDQUFDLGdEQUFnRCxjQUFjLENBQUMscURBQXFELGlCQUFpQixDQUFDLDJEQUEyRCxDQUFDLGlDQUFpQyxZQUFZLENBQUMsaUJBQWlCLENBQUMsa0JBQWtCLENBQUMsc0RBQXNELFlBQVksQ0FBQyxzSkFBc0osVUFBVSxDQUFDLGFBQWEsQ0FBQyxpQkFBaUIsQ0FBQyxxQ0FBcUMsQ0FBQywyRUFBMkUsU0FBUyxDQUFDLFdBQVcsQ0FBQyxzQ0FBb0QsbUJBQW1CLENBQUMscUNBQW1ELG1CQUFtQixDQUFDLDJFQUEyRSxVQUFVLENBQUMsVUFBVSxDQUFDLHNDQUFtRCxrQkFBa0IsQ0FBQyxxQ0FBa0Qsa0JBQWtCLENBQUMsd0JBQXdCLGlCQUFpQixDQUFDLCtCQUErQixpQkFBaUIsQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLFVBQVUsQ0FBQyxXQUFXLENBQUMsK0JBQStCLENBQUMscUNBQXFDLENBQUMsK0JBQStCLENBQUMscUNBQXFDLGlCQUFpQixDQUFDLGtCQUFrQixDQUFDLG1CQUFtQixLQUFLLENBQUMsTUFBTSxDQUFDLGVBQWUsQ0FBQyxnQkFBZ0IsQ0FBQyxnQkFBZ0IsQ0FBQywwQkFBMEIsS0FBSyxDQUFDLE1BQU0sQ0FBQyxrQkFBa0IsS0FBSyxDQUFDLFFBQVEsQ0FBQyxlQUFlLENBQUMsZ0JBQWdCLENBQUMsZUFBZSxDQUFDLHlCQUF5QixLQUFLLENBQUMsbUJBQW1CLEtBQUssQ0FBQyxPQUFPLENBQUMsZUFBZSxDQUFDLGlCQUFpQixDQUFDLGdCQUFnQixDQUFDLDBCQUEwQixLQUFLLENBQUMsT0FBTyxDQUFDLGtCQUFrQixPQUFPLENBQUMsT0FBTyxDQUFDLGVBQWUsQ0FBQyxpQkFBaUIsQ0FBQyxlQUFlLENBQUMseUJBQXlCLE9BQU8sQ0FBQyxtQkFBbUIsUUFBUSxDQUFDLE9BQU8sQ0FBQyxrQkFBa0IsQ0FBQyxpQkFBaUIsQ0FBQyxnQkFBZ0IsQ0FBQywwQkFBMEIsUUFBUSxDQUFDLE9BQU8sQ0FBQyxrQkFBa0IsUUFBUSxDQUFDLFFBQVEsQ0FBQyxrQkFBa0IsQ0FBQyxnQkFBZ0IsQ0FBQyxlQUFlLENBQUMseUJBQXlCLFFBQVEsQ0FBQyxtQkFBbUIsUUFBUSxDQUFDLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxnQkFBZ0IsQ0FBQyxnQkFBZ0IsQ0FBQywwQkFBMEIsUUFBUSxDQUFDLE1BQU0sQ0FBQyxrQkFBa0IsT0FBTyxDQUFDLE1BQU0sQ0FBQyxlQUFlLENBQUMsZ0JBQWdCLENBQUMsZUFBZSxDQUFDLHlCQUF5QixNQUFNLENBQUMsNkNBQTZDLGNBQWMsQ0FBQyxxQkFBcUIsaUJBQWlCLENBQUMsMkJBQTJCLEtBQUssQ0FBQyxNQUFNLENBQUMsVUFBVSxDQUFDLFVBQVUsQ0FBQyxlQUFlLENBQUMsMkJBQTJCLE9BQU8sQ0FBQyxLQUFLLENBQUMsU0FBUyxDQUFDLFdBQVcsQ0FBQyxpQkFBaUIsQ0FBQywyQkFBMkIsUUFBUSxDQUFDLE1BQU0sQ0FBQyxVQUFVLENBQUMsVUFBVSxDQUFDLGtCQUFrQixDQUFDLDJCQUEyQixLQUFLLENBQUMsTUFBTSxDQUFDLFNBQVMsQ0FBQyxXQUFXLENBQUMsZ0JBQWdCLENBQUMscUlBQXFJLFlBQVksQ0FBQyw0TkFBNE4sWUFBWSxDQUFDLHdCQUF3Qix3RUFBd0UsWUFBWSxDQUFDLHdCQUF3QixVQUFVLENBQUMsV0FBVyxDQUFDLENDQS8rSDtFQUNFLHNCQUFBO0VBQ0EsdUJBQUE7RUFDQSw0QkFBQTtFQUNBLDRCQUFBO0VBQ0EsNkJBQUE7QUNFRixDQ1BBO0VBQ0UscUNBQUE7RUFDQSxpQkNJa0M7QUZNcEMsQ0NSRTtFQUNFLFlBQUE7RUFDQSxXQUFBO0VBQ0Esb0JBQUE7S0FBQSxpQkFBQTtFQUNBLG1FQUFBO0VBQ0Esc0NBQUE7RUFDQSxrQkFBQTtFQUNBLGVBQUE7QURVSixDR3BCRTtFQUNFLFdBQUE7RUFDQSxZQUFBO0FIdUJKLENHckJJO0VBQ0UsWUFBQTtFQUNBLFdBQUE7RUFDQSxlQUFBO0VBQ0EsZ0JBQUE7RUFDQSxjQUFBO0FIdUJOIiwic291cmNlc0NvbnRlbnQiOlsiLlJlYWN0Q3JvcHtwb3NpdGlvbjpyZWxhdGl2ZTtkaXNwbGF5OmlubGluZS1ibG9jaztjdXJzb3I6Y3Jvc3NoYWlyO292ZXJmbG93OmhpZGRlbjttYXgtd2lkdGg6MTAwJX0uUmVhY3RDcm9wICosLlJlYWN0Q3JvcCAqOjpiZWZvcmUsLlJlYWN0Q3JvcCAqOjphZnRlcntib3gtc2l6aW5nOmJvcmRlci1ib3h9LlJlYWN0Q3JvcC0tZGlzYWJsZWQsLlJlYWN0Q3JvcC0tbG9ja2Vke2N1cnNvcjppbmhlcml0fS5SZWFjdENyb3BfX2NoaWxkLXdyYXBwZXJ7bWF4LWhlaWdodDppbmhlcml0fS5SZWFjdENyb3BfX2NoaWxkLXdyYXBwZXI+aW1nLC5SZWFjdENyb3BfX2NoaWxkLXdyYXBwZXI+dmlkZW97ZGlzcGxheTpibG9jazttYXgtd2lkdGg6MTAwJTttYXgtaGVpZ2h0OmluaGVyaXR9LlJlYWN0Q3JvcDpub3QoLlJlYWN0Q3JvcC0tZGlzYWJsZWQpIC5SZWFjdENyb3BfX2NoaWxkLXdyYXBwZXI+aW1nLC5SZWFjdENyb3A6bm90KC5SZWFjdENyb3AtLWRpc2FibGVkKSAuUmVhY3RDcm9wX19jaGlsZC13cmFwcGVyPnZpZGVve3RvdWNoLWFjdGlvbjpub25lfS5SZWFjdENyb3A6bm90KC5SZWFjdENyb3AtLWRpc2FibGVkKSAuUmVhY3RDcm9wX19jcm9wLXNlbGVjdGlvbnt0b3VjaC1hY3Rpb246bm9uZX0uUmVhY3RDcm9wX19jcm9wLXNlbGVjdGlvbntwb3NpdGlvbjphYnNvbHV0ZTt0b3A6MDtsZWZ0OjA7dHJhbnNmb3JtOnRyYW5zbGF0ZTNkKDAsIDAsIDApO2N1cnNvcjptb3ZlO2JveC1zaGFkb3c6MCAwIDAgOTk5OWVtIHJnYmEoMCwwLDAsLjUpO2JvcmRlcjoxcHggZGFzaGVkICNmZmZ9LlJlYWN0Q3JvcC0tZGlzYWJsZWQgLlJlYWN0Q3JvcF9fY3JvcC1zZWxlY3Rpb257Y3Vyc29yOmluaGVyaXR9LlJlYWN0Q3JvcC0tY2lyY3VsYXItY3JvcCAuUmVhY3RDcm9wX19jcm9wLXNlbGVjdGlvbntib3JkZXItcmFkaXVzOjUwJTtib3gtc2hhZG93OjBweCAwcHggMXB4IDFweCAjZmZmLDAgMCAwIDk5OTllbSByZ2JhKDAsMCwwLC41KX0uUmVhY3RDcm9wX19jcm9wLXNlbGVjdGlvbjpmb2N1c3tvdXRsaW5lOm5vbmU7Ym9yZGVyLWNvbG9yOmJsdWU7Ym9yZGVyLXN0eWxlOnNvbGlkfS5SZWFjdENyb3AtLWludmlzaWJsZS1jcm9wIC5SZWFjdENyb3BfX2Nyb3Atc2VsZWN0aW9ue2Rpc3BsYXk6bm9uZX0uUmVhY3RDcm9wX19ydWxlLW9mLXRoaXJkcy12dDo6YmVmb3JlLC5SZWFjdENyb3BfX3J1bGUtb2YtdGhpcmRzLXZ0OjphZnRlciwuUmVhY3RDcm9wX19ydWxlLW9mLXRoaXJkcy1oejo6YmVmb3JlLC5SZWFjdENyb3BfX3J1bGUtb2YtdGhpcmRzLWh6OjphZnRlcntjb250ZW50OlwiXCI7ZGlzcGxheTpibG9jaztwb3NpdGlvbjphYnNvbHV0ZTtiYWNrZ3JvdW5kLWNvbG9yOnJnYmEoMjU1LDI1NSwyNTUsLjQpfS5SZWFjdENyb3BfX3J1bGUtb2YtdGhpcmRzLXZ0OjpiZWZvcmUsLlJlYWN0Q3JvcF9fcnVsZS1vZi10aGlyZHMtdnQ6OmFmdGVye3dpZHRoOjFweDtoZWlnaHQ6MTAwJX0uUmVhY3RDcm9wX19ydWxlLW9mLXRoaXJkcy12dDo6YmVmb3Jle2xlZnQ6MzMuMzMzMyU7bGVmdDozMy4zMzMzMzMzMzMzJX0uUmVhY3RDcm9wX19ydWxlLW9mLXRoaXJkcy12dDo6YWZ0ZXJ7bGVmdDo2Ni42NjY2JTtsZWZ0OjY2LjY2NjY2NjY2NjclfS5SZWFjdENyb3BfX3J1bGUtb2YtdGhpcmRzLWh6OjpiZWZvcmUsLlJlYWN0Q3JvcF9fcnVsZS1vZi10aGlyZHMtaHo6OmFmdGVye3dpZHRoOjEwMCU7aGVpZ2h0OjFweH0uUmVhY3RDcm9wX19ydWxlLW9mLXRoaXJkcy1oejo6YmVmb3Jle3RvcDozMy4zMzMzJTt0b3A6MzMuMzMzMzMzMzMzMyV9LlJlYWN0Q3JvcF9fcnVsZS1vZi10aGlyZHMtaHo6OmFmdGVye3RvcDo2Ni42NjY2JTt0b3A6NjYuNjY2NjY2NjY2NyV9LlJlYWN0Q3JvcF9fZHJhZy1oYW5kbGV7cG9zaXRpb246YWJzb2x1dGV9LlJlYWN0Q3JvcF9fZHJhZy1oYW5kbGU6OmFmdGVye3Bvc2l0aW9uOmFic29sdXRlO2NvbnRlbnQ6XCJcIjtkaXNwbGF5OmJsb2NrO3dpZHRoOjEwcHg7aGVpZ2h0OjEwcHg7YmFja2dyb3VuZC1jb2xvcjpyZ2JhKDAsMCwwLC4yKTtib3JkZXI6MXB4IHNvbGlkIHJnYmEoMjU1LDI1NSwyNTUsLjcpO291dGxpbmU6MXB4IHNvbGlkIHJnYmEoMCwwLDAsMCl9LlJlYWN0Q3JvcF9fZHJhZy1oYW5kbGU6Zm9jdXM6OmFmdGVye2JvcmRlci1jb2xvcjpibHVlO2JhY2tncm91bmQ6IzJkYmZmZn0uUmVhY3RDcm9wIC5vcmQtbnd7dG9wOjA7bGVmdDowO21hcmdpbi10b3A6LTVweDttYXJnaW4tbGVmdDotNXB4O2N1cnNvcjpudy1yZXNpemV9LlJlYWN0Q3JvcCAub3JkLW53OjphZnRlcnt0b3A6MDtsZWZ0OjB9LlJlYWN0Q3JvcCAub3JkLW57dG9wOjA7bGVmdDo1MCU7bWFyZ2luLXRvcDotNXB4O21hcmdpbi1sZWZ0Oi01cHg7Y3Vyc29yOm4tcmVzaXplfS5SZWFjdENyb3AgLm9yZC1uOjphZnRlcnt0b3A6MH0uUmVhY3RDcm9wIC5vcmQtbmV7dG9wOjA7cmlnaHQ6MDttYXJnaW4tdG9wOi01cHg7bWFyZ2luLXJpZ2h0Oi01cHg7Y3Vyc29yOm5lLXJlc2l6ZX0uUmVhY3RDcm9wIC5vcmQtbmU6OmFmdGVye3RvcDowO3JpZ2h0OjB9LlJlYWN0Q3JvcCAub3JkLWV7dG9wOjUwJTtyaWdodDowO21hcmdpbi10b3A6LTVweDttYXJnaW4tcmlnaHQ6LTVweDtjdXJzb3I6ZS1yZXNpemV9LlJlYWN0Q3JvcCAub3JkLWU6OmFmdGVye3JpZ2h0OjB9LlJlYWN0Q3JvcCAub3JkLXNle2JvdHRvbTowO3JpZ2h0OjA7bWFyZ2luLWJvdHRvbTotNXB4O21hcmdpbi1yaWdodDotNXB4O2N1cnNvcjpzZS1yZXNpemV9LlJlYWN0Q3JvcCAub3JkLXNlOjphZnRlcntib3R0b206MDtyaWdodDowfS5SZWFjdENyb3AgLm9yZC1ze2JvdHRvbTowO2xlZnQ6NTAlO21hcmdpbi1ib3R0b206LTVweDttYXJnaW4tbGVmdDotNXB4O2N1cnNvcjpzLXJlc2l6ZX0uUmVhY3RDcm9wIC5vcmQtczo6YWZ0ZXJ7Ym90dG9tOjB9LlJlYWN0Q3JvcCAub3JkLXN3e2JvdHRvbTowO2xlZnQ6MDttYXJnaW4tYm90dG9tOi01cHg7bWFyZ2luLWxlZnQ6LTVweDtjdXJzb3I6c3ctcmVzaXplfS5SZWFjdENyb3AgLm9yZC1zdzo6YWZ0ZXJ7Ym90dG9tOjA7bGVmdDowfS5SZWFjdENyb3AgLm9yZC13e3RvcDo1MCU7bGVmdDowO21hcmdpbi10b3A6LTVweDttYXJnaW4tbGVmdDotNXB4O2N1cnNvcjp3LXJlc2l6ZX0uUmVhY3RDcm9wIC5vcmQtdzo6YWZ0ZXJ7bGVmdDowfS5SZWFjdENyb3BfX2Rpc2FibGVkIC5SZWFjdENyb3BfX2RyYWctaGFuZGxle2N1cnNvcjppbmhlcml0fS5SZWFjdENyb3BfX2RyYWctYmFye3Bvc2l0aW9uOmFic29sdXRlfS5SZWFjdENyb3BfX2RyYWctYmFyLm9yZC1ue3RvcDowO2xlZnQ6MDt3aWR0aDoxMDAlO2hlaWdodDo2cHg7bWFyZ2luLXRvcDotM3B4fS5SZWFjdENyb3BfX2RyYWctYmFyLm9yZC1le3JpZ2h0OjA7dG9wOjA7d2lkdGg6NnB4O2hlaWdodDoxMDAlO21hcmdpbi1yaWdodDotM3B4fS5SZWFjdENyb3BfX2RyYWctYmFyLm9yZC1ze2JvdHRvbTowO2xlZnQ6MDt3aWR0aDoxMDAlO2hlaWdodDo2cHg7bWFyZ2luLWJvdHRvbTotM3B4fS5SZWFjdENyb3BfX2RyYWctYmFyLm9yZC13e3RvcDowO2xlZnQ6MDt3aWR0aDo2cHg7aGVpZ2h0OjEwMCU7bWFyZ2luLWxlZnQ6LTNweH0uUmVhY3RDcm9wLS1uZXctY3JvcCAuUmVhY3RDcm9wX19kcmFnLWJhciwuUmVhY3RDcm9wLS1uZXctY3JvcCAuUmVhY3RDcm9wX19kcmFnLWhhbmRsZSwuUmVhY3RDcm9wLS1maXhlZC1hc3BlY3QgLlJlYWN0Q3JvcF9fZHJhZy1iYXJ7ZGlzcGxheTpub25lfS5SZWFjdENyb3AtLWZpeGVkLWFzcGVjdCAuUmVhY3RDcm9wX19kcmFnLWhhbmRsZS5vcmQtbiwuUmVhY3RDcm9wLS1maXhlZC1hc3BlY3QgLlJlYWN0Q3JvcF9fZHJhZy1oYW5kbGUub3JkLWUsLlJlYWN0Q3JvcC0tZml4ZWQtYXNwZWN0IC5SZWFjdENyb3BfX2RyYWctaGFuZGxlLm9yZC1zLC5SZWFjdENyb3AtLWZpeGVkLWFzcGVjdCAuUmVhY3RDcm9wX19kcmFnLWhhbmRsZS5vcmQtd3tkaXNwbGF5Om5vbmV9QG1lZGlhKHBvaW50ZXI6IGNvYXJzZSl7LlJlYWN0Q3JvcCAub3JkLW4sLlJlYWN0Q3JvcCAub3JkLWUsLlJlYWN0Q3JvcCAub3JkLXMsLlJlYWN0Q3JvcCAub3JkLXd7ZGlzcGxheTpub25lfS5SZWFjdENyb3BfX2RyYWctaGFuZGxle3dpZHRoOjI0cHg7aGVpZ2h0OjI0cHh9fVxuIiwiLm5pdS1tb2RhbCB7XG4gIHdpZHRoOiAkbml1LW1vZGFsLXdpZHRoICFpbXBvcnRhbnQ7XG4gIGhlaWdodDogJG5pdS1tb2RhbC1oZWlnaHQgIWltcG9ydGFudDtcbiAgbWF4LXdpZHRoOiAkbml1LW1vZGFsLW1heC13aWR0aCAhaW1wb3J0YW50O1xuICBtYXgtaGVpZ2h0OiAkbml1LW1vZGFsLW1heC1oZWlnaHQgIWltcG9ydGFudDtcbiAgcG9zaXRpb246IHJlbGF0aXZlICFpbXBvcnRhbnQ7XG59XG4iLCJAaW1wb3J0IFwicmVhY3QtaW1hZ2UtY3JvcC9kaXN0L1JlYWN0Q3JvcC5jc3NcIjtcblxuLy9BYnN0cmFjdHNcbkBpbXBvcnQgXCJhYnN0cmFjdHMvdmFyaWFibGVzXCI7XG5cbi8vQ29tcG9uZW50c1xuQGltcG9ydCBcIi4vY29tcG9uZW50cy9tb2RhbFwiO1xuQGltcG9ydCBcIi4vY29tcG9uZW50cy9pbWFnZS1saWJyYXJ5XCI7XG5AaW1wb3J0IFwiLi9jb21wb25lbnRzL3JlYWN0LWNyb3BcIjtcbiIsIi5uaXUtdW5zcGxhc2gtY29udGFpbmVyIHtcbiAgaGVpZ2h0OiBjYWxjKCN7JG5pdS1tb2RhbC1oZWlnaHR9IC0gI3skbml1LW1vZGFsLWhlYWRlci1oZWlnaHR9KSAhaW1wb3J0YW50O1xuICBtYXgtaGVpZ2h0OiAkbml1LXVuc3BsYXNoLWNvbnRhaW5lci1tYXgtaGVpZ2h0O1xuXG4gIGltZyB7XG4gICAgaGVpZ2h0OiAxMDAlO1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIG9iamVjdC1maXQ6IGNvdmVyO1xuICAgIGFuaW1hdGlvbjogZmFkZS1pbiAxLjJzIDFzIGN1YmljLWJlemllcigwLjM5LCAwLjU3NSwgMC41NjUsIDEpIGJvdGg7XG4gICAgYm9yZGVyLXJhZGl1czogdmFyKC0tbmVldG8tdWktcm91bmRlZCk7XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgfVxufVxuIiwiJG5pdS1tb2RhbC13aWR0aDogOTV2dztcbiRuaXUtbW9kYWwtaGVpZ2h0OiA3NXZoO1xuJG5pdS1tb2RhbC1tYXgtd2lkdGg6IDExNTJweDtcbiRuaXUtbW9kYWwtbWF4LWhlaWdodDogNTc2cHg7XG4kbml1LW1vZGFsLWhlYWRlci1oZWlnaHQ6IDIyMHB4O1xuXG4kbml1LXVuc3BsYXNoLWNvbnRhaW5lci1tYXgtaGVpZ2h0OiAzNTVweDtcbiIsIi5SZWFjdENyb3Age1xuICAuUmVhY3RDcm9wX19jaGlsZC13cmFwcGVyIHtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBoZWlnaHQ6IDEwMCU7XG5cbiAgICBpbWcge1xuICAgICAgaGVpZ2h0OiBhdXRvO1xuICAgICAgd2lkdGg6IGF1dG87XG4gICAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgICBtYXgtaGVpZ2h0OiAxMDAlO1xuICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgfVxuICB9XG59XG4iXX0= */";
47
48
  n(css,{});
48
49
 
49
- function _extends$1() {
50
- _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
51
- for (var i = 1; i < arguments.length; i++) {
52
- var source = arguments[i];
53
- for (var key in source) {
54
- if (Object.prototype.hasOwnProperty.call(source, key)) {
55
- target[key] = source[key];
56
- }
57
- }
58
- }
59
- return target;
60
- };
61
- return _extends$1.apply(this, arguments);
62
- }
63
-
64
50
  function _typeof$2(o) {
65
51
  "@babel/helpers - typeof";
66
52
 
@@ -756,9 +742,9 @@ function _iterableToArray$1(iter) { if (typeof Symbol !== "undefined" && iter[Sy
756
742
 
757
743
  function _arrayWithoutHoles$1(arr) { if (Array.isArray(arr)) return _arrayLikeToArray$1(arr); }
758
744
 
759
- function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
745
+ function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
760
746
 
761
- function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
747
+ function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$c(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
762
748
 
763
749
  function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
764
750
 
@@ -975,7 +961,7 @@ function pickerOptionsFromAccept(accept) {
975
961
  mimeType = _ref5[0],
976
962
  ext = _ref5[1];
977
963
 
978
- return _objectSpread$4(_objectSpread$4({}, agg), {}, _defineProperty$2({}, mimeType, ext));
964
+ return _objectSpread$b(_objectSpread$b({}, agg), {}, _defineProperty$2({}, mimeType, ext));
979
965
  }, {});
980
966
  return [{
981
967
  // description is required due to https://crbug.com/1264708
@@ -1088,9 +1074,9 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
1088
1074
 
1089
1075
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
1090
1076
 
1091
- function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
1077
+ function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
1092
1078
 
1093
- function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
1079
+ function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
1094
1080
 
1095
1081
  function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
1096
1082
 
@@ -1112,7 +1098,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
1112
1098
  * ```
1113
1099
  */
1114
1100
 
1115
- var Dropzone = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
1101
+ var Dropzone = /*#__PURE__*/require$$0.forwardRef(function (_ref, ref) {
1116
1102
  var children = _ref.children,
1117
1103
  params = _objectWithoutProperties$1(_ref, _excluded$5);
1118
1104
 
@@ -1120,13 +1106,13 @@ var Dropzone = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
1120
1106
  open = _useDropzone.open,
1121
1107
  props = _objectWithoutProperties$1(_useDropzone, _excluded2);
1122
1108
 
1123
- React.useImperativeHandle(ref, function () {
1109
+ require$$0.useImperativeHandle(ref, function () {
1124
1110
  return {
1125
1111
  open: open
1126
1112
  };
1127
1113
  }, [open]); // TODO: Figure out why react-styleguidist cannot create docs if we don't return a jsx element
1128
1114
 
1129
- return /*#__PURE__*/React__default["default"].createElement(React.Fragment, null, children(_objectSpread$3(_objectSpread$3({}, props), {}, {
1115
+ return /*#__PURE__*/require$$0__default["default"].createElement(require$$0.Fragment, null, children(_objectSpread$a(_objectSpread$a({}, props), {}, {
1130
1116
  open: open
1131
1117
  })));
1132
1118
  });
@@ -1499,7 +1485,7 @@ var initialState = {
1499
1485
  function useDropzone() {
1500
1486
  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
1501
1487
 
1502
- var _defaultProps$props = _objectSpread$3(_objectSpread$3({}, defaultProps), props),
1488
+ var _defaultProps$props = _objectSpread$a(_objectSpread$a({}, defaultProps), props),
1503
1489
  accept = _defaultProps$props.accept,
1504
1490
  disabled = _defaultProps$props.disabled,
1505
1491
  getFilesFromEvent = _defaultProps$props.getFilesFromEvent,
@@ -1525,16 +1511,16 @@ function useDropzone() {
1525
1511
  onError = _defaultProps$props.onError,
1526
1512
  validator = _defaultProps$props.validator;
1527
1513
 
1528
- var acceptAttr = React.useMemo(function () {
1514
+ var acceptAttr = require$$0.useMemo(function () {
1529
1515
  return acceptPropAsAcceptAttr(accept);
1530
1516
  }, [accept]);
1531
- var pickerTypes = React.useMemo(function () {
1517
+ var pickerTypes = require$$0.useMemo(function () {
1532
1518
  return pickerOptionsFromAccept(accept);
1533
1519
  }, [accept]);
1534
- var onFileDialogOpenCb = React.useMemo(function () {
1520
+ var onFileDialogOpenCb = require$$0.useMemo(function () {
1535
1521
  return typeof onFileDialogOpen === "function" ? onFileDialogOpen : noop;
1536
1522
  }, [onFileDialogOpen]);
1537
- var onFileDialogCancelCb = React.useMemo(function () {
1523
+ var onFileDialogCancelCb = require$$0.useMemo(function () {
1538
1524
  return typeof onFileDialogCancel === "function" ? onFileDialogCancel : noop;
1539
1525
  }, [onFileDialogCancel]);
1540
1526
  /**
@@ -1542,17 +1528,17 @@ function useDropzone() {
1542
1528
  * @type {React.MutableRefObject<HTMLElement>}
1543
1529
  */
1544
1530
 
1545
- var rootRef = React.useRef(null);
1546
- var inputRef = React.useRef(null);
1531
+ var rootRef = require$$0.useRef(null);
1532
+ var inputRef = require$$0.useRef(null);
1547
1533
 
1548
- var _useReducer = React.useReducer(reducer, initialState),
1534
+ var _useReducer = require$$0.useReducer(reducer, initialState),
1549
1535
  _useReducer2 = _slicedToArray(_useReducer, 2),
1550
1536
  state = _useReducer2[0],
1551
1537
  dispatch = _useReducer2[1];
1552
1538
 
1553
1539
  var isFocused = state.isFocused,
1554
1540
  isFileDialogActive = state.isFileDialogActive;
1555
- var fsAccessApiWorksRef = React.useRef(typeof window !== "undefined" && window.isSecureContext && useFsAccessApi && canUseFileSystemAccessAPI()); // Update file dialog active state when the window is focused on
1541
+ var fsAccessApiWorksRef = require$$0.useRef(typeof window !== "undefined" && window.isSecureContext && useFsAccessApi && canUseFileSystemAccessAPI()); // Update file dialog active state when the window is focused on
1556
1542
 
1557
1543
  var onWindowFocus = function onWindowFocus() {
1558
1544
  // Execute the timeout only if the file dialog is opened in the browser
@@ -1572,13 +1558,13 @@ function useDropzone() {
1572
1558
  }
1573
1559
  };
1574
1560
 
1575
- React.useEffect(function () {
1561
+ require$$0.useEffect(function () {
1576
1562
  window.addEventListener("focus", onWindowFocus, false);
1577
1563
  return function () {
1578
1564
  window.removeEventListener("focus", onWindowFocus, false);
1579
1565
  };
1580
1566
  }, [inputRef, isFileDialogActive, onFileDialogCancelCb, fsAccessApiWorksRef]);
1581
- var dragTargetsRef = React.useRef([]);
1567
+ var dragTargetsRef = require$$0.useRef([]);
1582
1568
 
1583
1569
  var onDocumentDrop = function onDocumentDrop(event) {
1584
1570
  if (rootRef.current && rootRef.current.contains(event.target)) {
@@ -1590,7 +1576,7 @@ function useDropzone() {
1590
1576
  dragTargetsRef.current = [];
1591
1577
  };
1592
1578
 
1593
- React.useEffect(function () {
1579
+ require$$0.useEffect(function () {
1594
1580
  if (preventDropOnDocument) {
1595
1581
  document.addEventListener("dragover", onDocumentDragOver, false);
1596
1582
  document.addEventListener("drop", onDocumentDrop, false);
@@ -1604,14 +1590,14 @@ function useDropzone() {
1604
1590
  };
1605
1591
  }, [rootRef, preventDropOnDocument]); // Auto focus the root when autoFocus is true
1606
1592
 
1607
- React.useEffect(function () {
1593
+ require$$0.useEffect(function () {
1608
1594
  if (!disabled && autoFocus && rootRef.current) {
1609
1595
  rootRef.current.focus();
1610
1596
  }
1611
1597
 
1612
1598
  return function () {};
1613
1599
  }, [rootRef, autoFocus, disabled]);
1614
- var onErrCb = React.useCallback(function (e) {
1600
+ var onErrCb = require$$0.useCallback(function (e) {
1615
1601
  if (onError) {
1616
1602
  onError(e);
1617
1603
  } else {
@@ -1619,7 +1605,7 @@ function useDropzone() {
1619
1605
  console.error(e);
1620
1606
  }
1621
1607
  }, [onError]);
1622
- var onDragEnterCb = React.useCallback(function (event) {
1608
+ var onDragEnterCb = require$$0.useCallback(function (event) {
1623
1609
  event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done
1624
1610
 
1625
1611
  event.persist();
@@ -1658,7 +1644,7 @@ function useDropzone() {
1658
1644
  });
1659
1645
  }
1660
1646
  }, [getFilesFromEvent, onDragEnter, onErrCb, noDragEventsBubbling, acceptAttr, minSize, maxSize, multiple, maxFiles, validator]);
1661
- var onDragOverCb = React.useCallback(function (event) {
1647
+ var onDragOverCb = require$$0.useCallback(function (event) {
1662
1648
  event.preventDefault();
1663
1649
  event.persist();
1664
1650
  stopPropagation(event);
@@ -1678,7 +1664,7 @@ function useDropzone() {
1678
1664
 
1679
1665
  return false;
1680
1666
  }, [onDragOver, noDragEventsBubbling]);
1681
- var onDragLeaveCb = React.useCallback(function (event) {
1667
+ var onDragLeaveCb = require$$0.useCallback(function (event) {
1682
1668
  event.preventDefault();
1683
1669
  event.persist();
1684
1670
  stopPropagation(event); // Only deactivate once the dropzone and all children have been left
@@ -1711,7 +1697,7 @@ function useDropzone() {
1711
1697
  onDragLeave(event);
1712
1698
  }
1713
1699
  }, [rootRef, onDragLeave, noDragEventsBubbling]);
1714
- var setFiles = React.useCallback(function (files, event) {
1700
+ var setFiles = require$$0.useCallback(function (files, event) {
1715
1701
  var acceptedFiles = [];
1716
1702
  var fileRejections = [];
1717
1703
  files.forEach(function (file) {
@@ -1774,7 +1760,7 @@ function useDropzone() {
1774
1760
  onDropAccepted(acceptedFiles, event);
1775
1761
  }
1776
1762
  }, [dispatch, multiple, acceptAttr, minSize, maxSize, maxFiles, onDrop, onDropAccepted, onDropRejected, validator]);
1777
- var onDropCb = React.useCallback(function (event) {
1763
+ var onDropCb = require$$0.useCallback(function (event) {
1778
1764
  event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done
1779
1765
 
1780
1766
  event.persist();
@@ -1798,7 +1784,7 @@ function useDropzone() {
1798
1784
  });
1799
1785
  }, [getFilesFromEvent, setFiles, onErrCb, noDragEventsBubbling]); // Fn for opening the file dialog programmatically
1800
1786
 
1801
- var openFileDialog = React.useCallback(function () {
1787
+ var openFileDialog = require$$0.useCallback(function () {
1802
1788
  // No point to use FS access APIs if context is not secure
1803
1789
  // https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts#feature_detection
1804
1790
  if (fsAccessApiWorksRef.current) {
@@ -1852,7 +1838,7 @@ function useDropzone() {
1852
1838
  }
1853
1839
  }, [dispatch, onFileDialogOpenCb, onFileDialogCancelCb, useFsAccessApi, setFiles, onErrCb, pickerTypes, multiple]); // Cb to open the file dialog when SPACE/ENTER occurs on the dropzone
1854
1840
 
1855
- var onKeyDownCb = React.useCallback(function (event) {
1841
+ var onKeyDownCb = require$$0.useCallback(function (event) {
1856
1842
  // Ignore keyboard events bubbling up the DOM tree
1857
1843
  if (!rootRef.current || !rootRef.current.isEqualNode(event.target)) {
1858
1844
  return;
@@ -1864,18 +1850,18 @@ function useDropzone() {
1864
1850
  }
1865
1851
  }, [rootRef, openFileDialog]); // Update focus state for the dropzone
1866
1852
 
1867
- var onFocusCb = React.useCallback(function () {
1853
+ var onFocusCb = require$$0.useCallback(function () {
1868
1854
  dispatch({
1869
1855
  type: "focus"
1870
1856
  });
1871
1857
  }, []);
1872
- var onBlurCb = React.useCallback(function () {
1858
+ var onBlurCb = require$$0.useCallback(function () {
1873
1859
  dispatch({
1874
1860
  type: "blur"
1875
1861
  });
1876
1862
  }, []); // Cb to open the file dialog when click occurs on the dropzone
1877
1863
 
1878
- var onClickCb = React.useCallback(function () {
1864
+ var onClickCb = require$$0.useCallback(function () {
1879
1865
  if (noClick) {
1880
1866
  return;
1881
1867
  } // In IE11/Edge the file-browser dialog is blocking, therefore, use setTimeout()
@@ -1908,7 +1894,7 @@ function useDropzone() {
1908
1894
  }
1909
1895
  };
1910
1896
 
1911
- var getRootProps = React.useMemo(function () {
1897
+ var getRootProps = require$$0.useMemo(function () {
1912
1898
  return function () {
1913
1899
  var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
1914
1900
  _ref2$refKey = _ref2.refKey,
@@ -1924,7 +1910,7 @@ function useDropzone() {
1924
1910
  onDrop = _ref2.onDrop,
1925
1911
  rest = _objectWithoutProperties$1(_ref2, _excluded3);
1926
1912
 
1927
- return _objectSpread$3(_objectSpread$3(_defineProperty$1({
1913
+ return _objectSpread$a(_objectSpread$a(_defineProperty$1({
1928
1914
  onKeyDown: composeKeyboardHandler(composeEventHandlers(onKeyDown, onKeyDownCb)),
1929
1915
  onFocus: composeKeyboardHandler(composeEventHandlers(onFocus, onFocusCb)),
1930
1916
  onBlur: composeKeyboardHandler(composeEventHandlers(onBlur, onBlurCb)),
@@ -1939,10 +1925,10 @@ function useDropzone() {
1939
1925
  } : {}), rest);
1940
1926
  };
1941
1927
  }, [rootRef, onKeyDownCb, onFocusCb, onBlurCb, onClickCb, onDragEnterCb, onDragOverCb, onDragLeaveCb, onDropCb, noKeyboard, noDrag, disabled]);
1942
- var onInputElementClick = React.useCallback(function (event) {
1928
+ var onInputElementClick = require$$0.useCallback(function (event) {
1943
1929
  event.stopPropagation();
1944
1930
  }, []);
1945
- var getInputProps = React.useMemo(function () {
1931
+ var getInputProps = require$$0.useMemo(function () {
1946
1932
  return function () {
1947
1933
  var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
1948
1934
  _ref3$refKey = _ref3.refKey,
@@ -1963,10 +1949,10 @@ function useDropzone() {
1963
1949
  tabIndex: -1
1964
1950
  }, refKey, inputRef);
1965
1951
 
1966
- return _objectSpread$3(_objectSpread$3({}, inputProps), rest);
1952
+ return _objectSpread$a(_objectSpread$a({}, inputProps), rest);
1967
1953
  };
1968
1954
  }, [inputRef, accept, multiple, onDropCb, disabled]);
1969
- return _objectSpread$3(_objectSpread$3({}, state), {}, {
1955
+ return _objectSpread$a(_objectSpread$a({}, state), {}, {
1970
1956
  isFocused: isFocused && !disabled,
1971
1957
  getRootProps: getRootProps,
1972
1958
  getInputProps: getInputProps,
@@ -1985,40 +1971,40 @@ function reducer(state, action) {
1985
1971
  /* istanbul ignore next */
1986
1972
  switch (action.type) {
1987
1973
  case "focus":
1988
- return _objectSpread$3(_objectSpread$3({}, state), {}, {
1974
+ return _objectSpread$a(_objectSpread$a({}, state), {}, {
1989
1975
  isFocused: true
1990
1976
  });
1991
1977
 
1992
1978
  case "blur":
1993
- return _objectSpread$3(_objectSpread$3({}, state), {}, {
1979
+ return _objectSpread$a(_objectSpread$a({}, state), {}, {
1994
1980
  isFocused: false
1995
1981
  });
1996
1982
 
1997
1983
  case "openDialog":
1998
- return _objectSpread$3(_objectSpread$3({}, initialState), {}, {
1984
+ return _objectSpread$a(_objectSpread$a({}, initialState), {}, {
1999
1985
  isFileDialogActive: true
2000
1986
  });
2001
1987
 
2002
1988
  case "closeDialog":
2003
- return _objectSpread$3(_objectSpread$3({}, state), {}, {
1989
+ return _objectSpread$a(_objectSpread$a({}, state), {}, {
2004
1990
  isFileDialogActive: false
2005
1991
  });
2006
1992
 
2007
1993
  case "setDraggedFiles":
2008
- return _objectSpread$3(_objectSpread$3({}, state), {}, {
1994
+ return _objectSpread$a(_objectSpread$a({}, state), {}, {
2009
1995
  isDragActive: action.isDragActive,
2010
1996
  isDragAccept: action.isDragAccept,
2011
1997
  isDragReject: action.isDragReject
2012
1998
  });
2013
1999
 
2014
2000
  case "setFiles":
2015
- return _objectSpread$3(_objectSpread$3({}, state), {}, {
2001
+ return _objectSpread$a(_objectSpread$a({}, state), {}, {
2016
2002
  acceptedFiles: action.acceptedFiles,
2017
2003
  fileRejections: action.fileRejections
2018
2004
  });
2019
2005
 
2020
2006
  case "reset":
2021
- return _objectSpread$3({}, initialState);
2007
+ return _objectSpread$a({}, initialState);
2022
2008
 
2023
2009
  default:
2024
2010
  return state;
@@ -2050,7 +2036,7 @@ var useUploadDropzone = function useUploadDropzone(_ref) {
2050
2036
  maxImageSize: 0
2051
2037
  } : _ref$uploadConfig,
2052
2038
  _onDrop = _ref.onDrop;
2053
- var _useState = React.useState(0),
2039
+ var _useState = require$$0.useState(0),
2054
2040
  _useState2 = _slicedToArray$2(_useState, 2),
2055
2041
  uploadProgress = _useState2[0],
2056
2042
  setUploadProgress = _useState2[1];
@@ -2080,19 +2066,24 @@ var ProgressBar = function ProgressBar(_ref) {
2080
2066
  var _ref$progressPercenta = _ref.progressPercentage,
2081
2067
  progressPercentage = _ref$progressPercenta === void 0 ? 0 : _ref$progressPercenta,
2082
2068
  progressValue = _ref.progressValue;
2083
- return /*#__PURE__*/React__default["default"].createElement("div", {
2084
- className: "neeto-ui-border-primary-600 hover:neeto-ui-bg-gray-100 neeto-ui-rounded-lg flex h-full cursor-pointer items-center justify-center gap-3 border border-dashed p-5 transition-all duration-300 ease-in-out"
2085
- }, /*#__PURE__*/React__default["default"].createElement("div", {
2086
- className: "neeto-ui-bg-gray-200 neeto-ui-rounded-full w-full overflow-hidden dark:bg-gray-700"
2087
- }, /*#__PURE__*/React__default["default"].createElement("div", {
2088
- className: "neeto-ui-bg-primary-600 text-2xs neeto-ui-text-primary-100 neeto-ui-rounded-full flex h-3 animate-pulse items-center justify-center font-medium leading-none transition-all duration-300 ease-in-out",
2089
- "data-cy": "neeto-image-uploader-progress-bar",
2090
- style: {
2091
- width: "".concat(progressPercentage, "%")
2092
- }
2093
- }, progressValue)));
2069
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
2070
+ className: "neeto-ui-border-primary-600 hover:neeto-ui-bg-gray-100 neeto-ui-rounded-lg flex h-full cursor-pointer items-center justify-center gap-3 border border-dashed p-5 transition-all duration-300 ease-in-out",
2071
+ children: /*#__PURE__*/jsxRuntime.jsx("div", {
2072
+ className: "neeto-ui-bg-gray-200 neeto-ui-rounded-full w-full overflow-hidden dark:bg-gray-700",
2073
+ children: /*#__PURE__*/jsxRuntime.jsx("div", {
2074
+ className: "neeto-ui-bg-primary-600 text-2xs neeto-ui-text-primary-100 neeto-ui-rounded-full flex h-3 animate-pulse items-center justify-center font-medium leading-none transition-all duration-300 ease-in-out",
2075
+ "data-cy": "neeto-image-uploader-progress-bar",
2076
+ style: {
2077
+ width: "".concat(progressPercentage, "%")
2078
+ },
2079
+ children: progressValue
2080
+ })
2081
+ })
2082
+ });
2094
2083
  };
2095
2084
 
2085
+ function ownKeys$a(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; }
2086
+ function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2096
2087
  var ImageDirectUpload = function ImageDirectUpload(_ref) {
2097
2088
  var _ref$uploadConfig = _ref.uploadConfig,
2098
2089
  uploadConfig = _ref$uploadConfig === void 0 ? DEFAULT_UPLOAD_CONFIG : _ref$uploadConfig,
@@ -2110,72 +2101,79 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
2110
2101
  isDragActive = _useUploadDropzone.isDragActive,
2111
2102
  uploadProgress = _useUploadDropzone.uploadProgress;
2112
2103
  var shouldShowProgress = !!(uploadProgress && !ramda.equals(uploadProgress, 1));
2113
- return shouldShowProgress ? /*#__PURE__*/React__default["default"].createElement(ProgressBar, {
2104
+ return shouldShowProgress ? /*#__PURE__*/jsxRuntime.jsx(ProgressBar, {
2114
2105
  progressPercentage: uploadProgress,
2115
2106
  progressValue: "".concat(uploadProgress, "%")
2116
- }) : /*#__PURE__*/React__default["default"].createElement("div", _extends$1({}, getRootProps(), {
2107
+ }) : /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$9(_objectSpread$9({}, getRootProps()), {}, {
2117
2108
  className: classnames__default["default"](DROPZONE_ROOT_DIV_CLASSNAME, {
2118
2109
  "neeto-ui-border-gray-300": !isDragActive,
2119
2110
  "neeto-ui-border-gray-700": isDragActive
2111
+ }),
2112
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
2113
+ className: "flex flex-col space-y-1",
2114
+ children: [!isDisabled && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
2115
+ className: "neeto-ui-text-gray-800 text-center leading-4",
2116
+ style: "body2",
2117
+ children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
2118
+ i18nKey: "neetoImageUploader.imageUpload.dragAndDropOrBrowseFile",
2119
+ components: {
2120
+ span: /*#__PURE__*/jsxRuntime.jsx("span", {
2121
+ className: "neeto-ui-text-primary-500",
2122
+ "data-cy": "neeto-image-uploader-browse-text"
2123
+ })
2124
+ }
2125
+ })
2126
+ }), setIsAssetLibraryOpen && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
2127
+ className: "text-center leading-4",
2128
+ style: "body2",
2129
+ onClick: function onClick(e) {
2130
+ e.stopPropagation();
2131
+ setIsAssetLibraryOpen(true);
2132
+ },
2133
+ children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
2134
+ i18nKey: "neetoImageUploader.imageUpload.selectImagefromImageLibrary",
2135
+ components: {
2136
+ span: /*#__PURE__*/jsxRuntime.jsx("span", {
2137
+ className: "neeto-ui-text-primary-500",
2138
+ "data-cy": "open-asset-library-button"
2139
+ })
2140
+ }
2141
+ })
2142
+ }), /*#__PURE__*/jsxRuntime.jsx("input", _objectSpread$9(_objectSpread$9({}, getInputProps()), {}, {
2143
+ "data-cy": "neeto-image-uploader-file-input",
2144
+ disabled: isDisabled
2145
+ })), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
2146
+ className: "neeto-ui-text-gray-700 text-center leading-4",
2147
+ "data-cy": "neeto-image-uploader-restriction-message",
2148
+ lineHeight: "snug",
2149
+ style: "nano",
2150
+ children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
2151
+ i18nKey: "neetoImageUploader.imageUpload.restrictionMessage",
2152
+ values: {
2153
+ fileTypes: getAllowedTypes(uploadConfig),
2154
+ size: uploadConfig === null || uploadConfig === void 0 ? void 0 : uploadConfig.maxImageSize
2155
+ }
2156
+ })
2157
+ })]
2120
2158
  })
2121
- }), /*#__PURE__*/React__default["default"].createElement("div", {
2122
- className: "flex flex-col space-y-1"
2123
- }, !isDisabled && /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
2124
- className: "neeto-ui-text-gray-800 text-center leading-4",
2125
- style: "body2"
2126
- }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
2127
- i18nKey: "neetoImageUploader.imageUpload.dragAndDropOrBrowseFile",
2128
- components: {
2129
- span: /*#__PURE__*/React__default["default"].createElement("span", {
2130
- className: "neeto-ui-text-primary-500",
2131
- "data-cy": "neeto-image-uploader-browse-text"
2132
- })
2133
- }
2134
- })), setIsAssetLibraryOpen && /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
2135
- className: "text-center leading-4",
2136
- style: "body2",
2137
- onClick: function onClick(e) {
2138
- e.stopPropagation();
2139
- setIsAssetLibraryOpen(true);
2140
- }
2141
- }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
2142
- i18nKey: "neetoImageUploader.imageUpload.selectImagefromImageLibrary",
2143
- components: {
2144
- span: /*#__PURE__*/React__default["default"].createElement("span", {
2145
- className: "neeto-ui-text-primary-500",
2146
- "data-cy": "open-asset-library-button"
2147
- })
2148
- }
2149
- })), /*#__PURE__*/React__default["default"].createElement("input", _extends$1({}, getInputProps(), {
2150
- "data-cy": "neeto-image-uploader-file-input",
2151
- disabled: isDisabled
2152
- })), /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
2153
- className: "neeto-ui-text-gray-700 text-center leading-4",
2154
- "data-cy": "neeto-image-uploader-restriction-message",
2155
- lineHeight: "snug",
2156
- style: "nano"
2157
- }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
2158
- i18nKey: "neetoImageUploader.imageUpload.restrictionMessage",
2159
- values: {
2160
- fileTypes: getAllowedTypes(uploadConfig),
2161
- size: uploadConfig === null || uploadConfig === void 0 ? void 0 : uploadConfig.maxImageSize
2162
- }
2163
- }))));
2159
+ }));
2164
2160
  };
2165
2161
 
2166
2162
  var _excluded$4 = ["className"];
2163
+ function ownKeys$9(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; }
2164
+ function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2167
2165
  var ImagePlaceholder = function ImagePlaceholder(_ref) {
2168
2166
  var _ref$className = _ref.className,
2169
2167
  className = _ref$className === void 0 ? "" : _ref$className,
2170
2168
  props = _objectWithoutProperties$2(_ref, _excluded$4);
2171
- return /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
2169
+ return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$8({
2172
2170
  className: classnames__default["default"]("neeto-ui-bg-gray-200", _defineProperty$3({}, className, className))
2173
2171
  }, props));
2174
2172
  };
2175
2173
 
2176
2174
  var _excluded$3 = ["src", "className", "fallback"];
2177
- function ownKeys$3(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; }
2178
- function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2175
+ function ownKeys$8(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; }
2176
+ function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2179
2177
  var ImageWithFallback = function ImageWithFallback(_ref) {
2180
2178
  var src = _ref.src,
2181
2179
  _ref$className = _ref.className,
@@ -2183,24 +2181,24 @@ var ImageWithFallback = function ImageWithFallback(_ref) {
2183
2181
  _ref$fallback = _ref.fallback,
2184
2182
  Fallback = _ref$fallback === void 0 ? ImagePlaceholder : _ref$fallback,
2185
2183
  props = _objectWithoutProperties$2(_ref, _excluded$3);
2186
- var _useState = React.useState(false),
2184
+ var _useState = require$$0.useState(false),
2187
2185
  _useState2 = _slicedToArray$2(_useState, 2),
2188
2186
  isLoaded = _useState2[0],
2189
2187
  setIsLoaded = _useState2[1];
2190
- React.useEffect(function () {
2188
+ require$$0.useEffect(function () {
2191
2189
  var img = new Image();
2192
2190
  img.onload = function () {
2193
2191
  setIsLoaded(true);
2194
2192
  };
2195
2193
  img.src = src;
2196
2194
  }, [src]);
2197
- return isLoaded ? /*#__PURE__*/React__default["default"].createElement("img", _extends$1({}, _objectSpread$2({
2195
+ return isLoaded ? /*#__PURE__*/jsxRuntime.jsx("img", _objectSpread$7(_objectSpread$7({}, _objectSpread$7({
2198
2196
  src: src
2199
- }, props), {
2197
+ }, props)), {}, {
2200
2198
  className: "h-full w-auto object-contain"
2201
- })) : /*#__PURE__*/React__default["default"].createElement(Fallback, _objectSpread$2({
2199
+ })) : /*#__PURE__*/jsxRuntime.jsx(Fallback, _objectSpread$7({}, _objectSpread$7({
2202
2200
  className: className
2203
- }, props));
2201
+ }, props)));
2204
2202
  };
2205
2203
 
2206
2204
  var IS_DEVELOPMENT_OR_HEROKU_ENV = process.env.RAILS_ENV === "development" || process.env.RAILS_ENV === "heroku";
@@ -2309,7 +2307,7 @@ function _defineProperty(obj, key, value) {
2309
2307
  return obj;
2310
2308
  }
2311
2309
 
2312
- function ownKeys$2(object, enumerableOnly) {
2310
+ function ownKeys$7(object, enumerableOnly) {
2313
2311
  var keys = Object.keys(object);
2314
2312
 
2315
2313
  if (Object.getOwnPropertySymbols) {
@@ -2328,13 +2326,13 @@ function _objectSpread2(target) {
2328
2326
  var source = arguments[i] != null ? arguments[i] : {};
2329
2327
 
2330
2328
  if (i % 2) {
2331
- ownKeys$2(Object(source), true).forEach(function (key) {
2329
+ ownKeys$7(Object(source), true).forEach(function (key) {
2332
2330
  _defineProperty(target, key, source[key]);
2333
2331
  });
2334
2332
  } else if (Object.getOwnPropertyDescriptors) {
2335
2333
  Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
2336
2334
  } else {
2337
- ownKeys$2(Object(source)).forEach(function (key) {
2335
+ ownKeys$7(Object(source)).forEach(function (key) {
2338
2336
  Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
2339
2337
  });
2340
2338
  }
@@ -2907,8 +2905,8 @@ var isItemsCenter = function isItemsCenter(_ref4) {
2907
2905
  };
2908
2906
 
2909
2907
  var _excluded$2 = ["src", "className", "imageFallbackProps", "onDrop", "isDisabled", "onRemove"];
2910
- 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; }
2911
- 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$3(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; }
2908
+ function ownKeys$6(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; }
2909
+ function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2912
2910
  var BasicImageUploader = function BasicImageUploader(_ref) {
2913
2911
  var _ref$src = _ref.src,
2914
2912
  src = _ref$src === void 0 ? "" : _ref$src,
@@ -2926,29 +2924,31 @@ var BasicImageUploader = function BasicImageUploader(_ref) {
2926
2924
  _ref$onRemove = _ref.onRemove,
2927
2925
  onRemove = _ref$onRemove === void 0 ? neetoCist.noop : _ref$onRemove,
2928
2926
  props = _objectWithoutProperties$2(_ref, _excluded$2);
2929
- return /*#__PURE__*/React__default["default"].createElement("div", {
2927
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
2930
2928
  className: classnames__default["default"](className, {
2931
2929
  "cursor-pointer": true,
2932
2930
  "cursor-not-allowed": isDisabled,
2933
2931
  "opacity-70": isDisabled && isNilOrEmpty(src)
2934
- })
2935
- }, isNotNilOrEmpty(src) ? /*#__PURE__*/React__default["default"].createElement("div", {
2936
- className: IMAGE_WRAPPER_CLASSNAME
2937
- }, /*#__PURE__*/React__default["default"].createElement(ImageWithFallback, _extends$1({}, _objectSpread$1(_objectSpread$1({}, imageFallbackProps), {}, {
2938
- src: src
2939
- }), {
2940
- "data-cy": "uploaded-image"
2941
- })), /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
2942
- className: "absolute right-3 top-3",
2943
- "data-cy": "basic-image-uploader-remove-button",
2944
- disabled: isDisabled,
2945
- icon: neetoIcons.Delete,
2946
- size: "small",
2947
- onClick: onRemove
2948
- })) : /*#__PURE__*/React__default["default"].createElement(ImageDirectUpload, _objectSpread$1(_objectSpread$1({}, props), {}, {
2949
- isDisabled: isDisabled,
2950
- onDrop: onDrop
2951
- })));
2932
+ }),
2933
+ children: isNotNilOrEmpty(src) ? /*#__PURE__*/jsxRuntime.jsxs("div", {
2934
+ className: IMAGE_WRAPPER_CLASSNAME,
2935
+ children: [/*#__PURE__*/jsxRuntime.jsx(ImageWithFallback, _objectSpread$6(_objectSpread$6({}, _objectSpread$6(_objectSpread$6({}, imageFallbackProps), {}, {
2936
+ src: src
2937
+ })), {}, {
2938
+ "data-cy": "uploaded-image"
2939
+ })), /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
2940
+ className: "absolute right-3 top-3",
2941
+ "data-cy": "basic-image-uploader-remove-button",
2942
+ disabled: isDisabled,
2943
+ icon: neetoIcons.Delete,
2944
+ size: "small",
2945
+ onClick: onRemove
2946
+ })]
2947
+ }) : /*#__PURE__*/jsxRuntime.jsx(ImageDirectUpload, _objectSpread$6({}, _objectSpread$6(_objectSpread$6({}, props), {}, {
2948
+ isDisabled: isDisabled,
2949
+ onDrop: onDrop
2950
+ })))
2951
+ });
2952
2952
  };
2953
2953
 
2954
2954
  var create = function create(payload) {
@@ -2980,10 +2980,10 @@ var ASSETS_STALE_TIME = 900000; // 15 mins
2980
2980
 
2981
2981
  var UNSPLASH_STALE_TIME = 900000;
2982
2982
 
2983
- 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; }
2984
- 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$3(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; }
2983
+ function ownKeys$5(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; }
2984
+ function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2985
2985
  var useCreateBlob = function useCreateBlob(options) {
2986
- return reactUtils.useMutationWithInvalidation(directUploadsApi.create, _objectSpread({
2986
+ return reactUtils.useMutationWithInvalidation(directUploadsApi.create, _objectSpread$5({
2987
2987
  keysToInvalidate: [QUERY_KEYS.ASSETS_LIST]
2988
2988
  }, options));
2989
2989
  };
@@ -3520,7 +3520,7 @@ var ReactCrop_min = {exports: {}};
3520
3520
  ReactCrop_min.exports;
3521
3521
 
3522
3522
  (function (module, exports) {
3523
- !function(e,t){module.exports=t(React__default["default"]);}(commonjsGlobal,(e=>(()=>{var t={899:t=>{t.exports=e;}},n={};function o(e){var r=n[e];if(void 0!==r)return r.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,o),i.exports}o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]});},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0});};var r={};return (()=>{o.r(r),o.d(r,{Component:()=>u,areCropsEqual:()=>h,centerCrop:()=>d,clamp:()=>a,containCrop:()=>p,convertToPercentCrop:()=>c,convertToPixelCrop:()=>l,default:()=>u,defaultCrop:()=>i,makeAspectCrop:()=>s,nudgeCrop:()=>g});var e=o(899),t=o.n(e);function n(e){var t,o,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(o=n(e[t]))&&(r&&(r+=" "),r+=o);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}const i={x:0,y:0,width:0,height:0,unit:"px"};function a(e,t,n){return Math.min(Math.max(e,t),n)}function h(e,t){return e.width===t.width&&e.height===t.height&&e.x===t.x&&e.y===t.y&&e.unit===t.unit}function s(e,t,n,o){const r=l(e,n,o);return e.width&&(r.height=r.width/t),e.height&&(r.width=r.height*t),r.y+r.height>o&&(r.height=o-r.y,r.width=r.height*t),r.x+r.width>n&&(r.width=n-r.x,r.height=r.width/t),"%"===e.unit?c(r,n,o):r}function d(e,t,n){const o=l(e,t,n);return o.x=(t-o.width)/2,o.y=(n-o.height)/2,"%"===e.unit?c(o,t,n):o}function c(e,t,n){return "%"===e.unit?{...i,...e,unit:"%"}:{unit:"%",x:e.x?e.x/t*100:0,y:e.y?e.y/n*100:0,width:e.width?e.width/t*100:0,height:e.height?e.height/n*100:0}}function l(e,t,n){return e.unit?"px"===e.unit?{...i,...e,unit:"px"}:{unit:"px",x:e.x?e.x*t/100:0,y:e.y?e.y*n/100:0,width:e.width?e.width*t/100:0,height:e.height?e.height*n/100:0}:{...i,...e,unit:"px"}}function p(e,t,n,o,r,i=0,a=0,h=o,s=r){const d={...e};let c=Math.min(i,o),l=Math.min(a,r),p=Math.min(h,o),g=Math.min(s,r);t&&(t>1?(c=a?a*t:c,l=c/t,p=h*t):(l=i?i/t:l,c=l*t,g=s/t)),d.y<0&&(d.height=Math.max(d.height+d.y,l),d.y=0),d.x<0&&(d.width=Math.max(d.width+d.x,c),d.x=0);const w=o-(d.x+d.width);w<0&&(d.x=Math.min(d.x,o-c),d.width+=w);const u=r-(d.y+d.height);if(u<0&&(d.y=Math.min(d.y,r-l),d.height+=u),d.width<c&&("sw"!==n&&"nw"!=n||(d.x-=c-d.width),d.width=c),d.height<l&&("nw"!==n&&"ne"!=n||(d.y-=l-d.height),d.height=l),d.width>p&&("sw"!==n&&"nw"!=n||(d.x-=p-d.width),d.width=p),d.height>g&&("nw"!==n&&"ne"!=n||(d.y-=g-d.height),d.height=g),t){const e=d.width/d.height;if(e<t){const e=Math.max(d.width/t,l);"nw"!==n&&"ne"!=n||(d.y-=e-d.height),d.height=e;}else if(e>t){const e=Math.max(d.height*t,c);"sw"!==n&&"nw"!=n||(d.x-=e-d.width),d.width=e;}}return d}function g(e,t,n,o){const r={...e};return "ArrowLeft"===t?"nw"===o?(r.x-=n,r.y-=n,r.width+=n,r.height+=n):"w"===o?(r.x-=n,r.width+=n):"sw"===o?(r.x-=n,r.width+=n,r.height+=n):"ne"===o?(r.y+=n,r.width-=n,r.height-=n):"e"===o?r.width-=n:"se"===o&&(r.width-=n,r.height-=n):"ArrowRight"===t&&("nw"===o?(r.x+=n,r.y+=n,r.width-=n,r.height-=n):"w"===o?(r.x+=n,r.width-=n):"sw"===o?(r.x+=n,r.width-=n,r.height-=n):"ne"===o?(r.y-=n,r.width+=n,r.height+=n):"e"===o?r.width+=n:"se"===o&&(r.width+=n,r.height+=n)),"ArrowUp"===t?"nw"===o?(r.x-=n,r.y-=n,r.width+=n,r.height+=n):"n"===o?(r.y-=n,r.height+=n):"ne"===o?(r.y-=n,r.width+=n,r.height+=n):"sw"===o?(r.x+=n,r.width-=n,r.height-=n):"s"===o?r.height-=n:"se"===o&&(r.width-=n,r.height-=n):"ArrowDown"===t&&("nw"===o?(r.x+=n,r.y+=n,r.width-=n,r.height-=n):"n"===o?(r.y+=n,r.height-=n):"ne"===o?(r.y+=n,r.width-=n,r.height-=n):"sw"===o?(r.x-=n,r.width+=n,r.height+=n):"s"===o?r.height+=n:"se"===o&&(r.width+=n,r.height+=n)),r}const w={capture:!0,passive:!1};class u extends e.PureComponent{constructor(){super(...arguments),this.docMoveBound=!1,this.mouseDownOnCrop=!1,this.dragStarted=!1,this.evData={startClientX:0,startClientY:0,startCropX:0,startCropY:0,clientX:0,clientY:0,isResize:!0},this.componentRef=(0, e.createRef)(),this.mediaRef=(0, e.createRef)(),this.initChangeCalled=!1,this.state={cropIsActive:!1,newCropIsBeingDrawn:!1},this.onCropPointerDown=e=>{const{crop:t,disabled:n}=this.props,o=this.getBox();if(!t)return;const r=l(t,o.width,o.height);if(n)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const i=e.target.dataset.ord,a=Boolean(i);let h=e.clientX,s=e.clientY,d=r.x,c=r.y;if(i){const t=e.clientX-o.x,n=e.clientY-o.y;let a=0,l=0;"ne"===i||"e"==i?(a=t-(r.x+r.width),l=n-r.y,d=r.x,c=r.y+r.height):"se"===i||"s"===i?(a=t-(r.x+r.width),l=n-(r.y+r.height),d=r.x,c=r.y):"sw"===i||"w"==i?(a=t-r.x,l=n-(r.y+r.height),d=r.x+r.width,c=r.y):"nw"!==i&&"n"!=i||(a=t-r.x,l=n-r.y,d=r.x+r.width,c=r.y+r.height),h=d+o.x+a,s=c+o.y+l;}this.evData={startClientX:h,startClientY:s,startCropX:d,startCropY:c,clientX:e.clientX,clientY:e.clientY,isResize:a,ord:i},this.mouseDownOnCrop=!0,this.setState({cropIsActive:!0});},this.onComponentPointerDown=e=>{const{crop:t,disabled:n,locked:o,keepSelection:r,onChange:i}=this.props,a=this.getBox();if(n||o||r&&t)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const h=e.clientX-a.x,s=e.clientY-a.y,d={unit:"px",x:h,y:s,width:0,height:0};this.evData={startClientX:e.clientX,startClientY:e.clientY,startCropX:h,startCropY:s,clientX:e.clientX,clientY:e.clientY,isResize:!0},this.mouseDownOnCrop=!0,i(l(d,a.width,a.height),c(d,a.width,a.height)),this.setState({cropIsActive:!0,newCropIsBeingDrawn:!0});},this.onDocPointerMove=e=>{const{crop:t,disabled:n,onChange:o,onDragStart:r}=this.props,i=this.getBox();if(n||!t||!this.mouseDownOnCrop)return;e.cancelable&&e.preventDefault(),this.dragStarted||(this.dragStarted=!0,r&&r(e));const{evData:a}=this;let s;a.clientX=e.clientX,a.clientY=e.clientY,s=a.isResize?this.resizeCrop():this.dragCrop(),h(t,s)||o(l(s,i.width,i.height),c(s,i.width,i.height));},this.onComponentKeyDown=e=>{const{crop:t,disabled:n,onChange:o,onComplete:r}=this.props,i=this.getBox();if(n)return;const h=e.key;let s=!1;if(!t)return;const d=this.makePixelCrop(),p=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?u.nudgeStepLarge:e.shiftKey?u.nudgeStepMedium:u.nudgeStep;if("ArrowLeft"===h?(d.x-=p,s=!0):"ArrowRight"===h?(d.x+=p,s=!0):"ArrowUp"===h?(d.y-=p,s=!0):"ArrowDown"===h&&(d.y+=p,s=!0),s){e.cancelable&&e.preventDefault(),d.x=a(d.x,0,i.width-d.width),d.y=a(d.y,0,i.height-d.height);const t=l(d,i.width,i.height),n=c(d,i.width,i.height);o(t,n),r&&r(t,n);}},this.onHandlerKeyDown=(e,t)=>{const{aspect:n=0,crop:o,disabled:r,minWidth:i=0,minHeight:a=0,maxWidth:s,maxHeight:d,onChange:w,onComplete:m}=this.props,y=this.getBox();if(r||!o)return;if("ArrowUp"!==e.key&&"ArrowDown"!==e.key&&"ArrowLeft"!==e.key&&"ArrowRight"!==e.key)return;e.stopPropagation(),e.preventDefault();const x=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?u.nudgeStepLarge:e.shiftKey?u.nudgeStepMedium:u.nudgeStep,C=p(g(l(o,y.width,y.height),e.key,x,t),n,t,y.width,y.height,i,a,s,d);if(!h(o,C)){const e=c(C,y.width,y.height);w(C,e),m&&m(C,e);}},this.onDocPointerDone=e=>{const{crop:t,disabled:n,onComplete:o,onDragEnd:r}=this.props,i=this.getBox();this.unbindDocMove(),!n&&t&&this.mouseDownOnCrop&&(this.mouseDownOnCrop=!1,this.dragStarted=!1,r&&r(e),o&&o(l(t,i.width,i.height),c(t,i.width,i.height)),this.setState({cropIsActive:!1,newCropIsBeingDrawn:!1}));},this.onDragFocus=e=>{var t;null===(t=this.componentRef.current)||void 0===t||t.scrollTo(0,0);};}get document(){return document}getBox(){const e=this.mediaRef.current;if(!e)return {x:0,y:0,width:0,height:0};const{x:t,y:n,width:o,height:r}=e.getBoundingClientRect();return {x:t,y:n,width:o,height:r}}componentDidUpdate(e){const{crop:t,onComplete:n}=this.props;if(n&&!e.crop&&t){const{width:e,height:o}=this.getBox();e&&o&&n(l(t,e,o),c(t,e,o));}}componentWillUnmount(){this.resizeObserver&&this.resizeObserver.disconnect();}bindDocMove(){this.docMoveBound||(this.document.addEventListener("pointermove",this.onDocPointerMove,w),this.document.addEventListener("pointerup",this.onDocPointerDone,w),this.document.addEventListener("pointercancel",this.onDocPointerDone,w),this.docMoveBound=!0);}unbindDocMove(){this.docMoveBound&&(this.document.removeEventListener("pointermove",this.onDocPointerMove,w),this.document.removeEventListener("pointerup",this.onDocPointerDone,w),this.document.removeEventListener("pointercancel",this.onDocPointerDone,w),this.docMoveBound=!1);}getCropStyle(){const{crop:e}=this.props;if(e)return {top:`${e.y}${e.unit}`,left:`${e.x}${e.unit}`,width:`${e.width}${e.unit}`,height:`${e.height}${e.unit}`}}dragCrop(){const{evData:e}=this,t=this.getBox(),n=this.makePixelCrop(),o=e.clientX-e.startClientX,r=e.clientY-e.startClientY;return n.x=a(e.startCropX+o,0,t.width-n.width),n.y=a(e.startCropY+r,0,t.height-n.height),n}getPointRegion(e){const{evData:t}=this,n=t.clientX-e.x,o=t.clientY-e.y<t.startCropY;return n<t.startCropX?o?"nw":"sw":o?"ne":"se"}resizeCrop(){const{evData:e}=this,t=this.getBox(),{aspect:n=0,minWidth:o=0,minHeight:r=0,maxWidth:i,maxHeight:a}=this.props,h=this.getPointRegion(t),s=this.makePixelCrop(),d=e.ord?e.ord:h,c=e.clientX-e.startClientX,l=e.clientY-e.startClientY,g={unit:"px",x:0,y:0,width:0,height:0};"ne"===h?(g.x=e.startCropX,g.width=c,n?(g.height=g.width/n,g.y=e.startCropY-g.height):(g.height=Math.abs(l),g.y=e.startCropY-g.height)):"se"===h?(g.x=e.startCropX,g.y=e.startCropY,g.width=c,g.height=n?g.width/n:l):"sw"===h?(g.x=e.startCropX+c,g.y=e.startCropY,g.width=Math.abs(c),g.height=n?g.width/n:l):"nw"===h&&(g.x=e.startCropX+c,g.width=Math.abs(c),n?(g.height=g.width/n,g.y=e.startCropY-g.height):(g.height=Math.abs(l),g.y=e.startCropY+l));const w=p(g,n,h,t.width,t.height,o,r,i,a);return n||u.xyOrds.indexOf(d)>-1?(s.x=w.x,s.y=w.y,s.width=w.width,s.height=w.height):u.xOrds.indexOf(d)>-1?(s.x=w.x,s.width=w.width):u.yOrds.indexOf(d)>-1&&(s.y=w.y,s.height=w.height),s}createCropSelection(){const{ariaLabels:e=u.defaultProps.ariaLabels,disabled:n,locked:o,renderSelectionAddon:r,ruleOfThirds:i,crop:a}=this.props,h=this.getCropStyle();if(a)return t().createElement("div",{style:h,className:"ReactCrop__crop-selection",onPointerDown:this.onCropPointerDown,"aria-label":e.cropArea,tabIndex:0,onKeyDown:this.onComponentKeyDown,role:"group"},!n&&!o&&t().createElement("div",{className:"ReactCrop__drag-elements",onFocus:this.onDragFocus},t().createElement("div",{className:"ReactCrop__drag-bar ord-n","data-ord":"n"}),t().createElement("div",{className:"ReactCrop__drag-bar ord-e","data-ord":"e"}),t().createElement("div",{className:"ReactCrop__drag-bar ord-s","data-ord":"s"}),t().createElement("div",{className:"ReactCrop__drag-bar ord-w","data-ord":"w"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-nw","data-ord":"nw",tabIndex:0,"aria-label":e.nwDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"nw"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-n","data-ord":"n",tabIndex:0,"aria-label":e.nDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"n"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-ne","data-ord":"ne",tabIndex:0,"aria-label":e.neDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"ne"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-e","data-ord":"e",tabIndex:0,"aria-label":e.eDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"e"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-se","data-ord":"se",tabIndex:0,"aria-label":e.seDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"se"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-s","data-ord":"s",tabIndex:0,"aria-label":e.sDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"s"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-sw","data-ord":"sw",tabIndex:0,"aria-label":e.swDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"sw"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-w","data-ord":"w",tabIndex:0,"aria-label":e.wDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"w"),role:"button"})),r&&t().createElement("div",{className:"ReactCrop__selection-addon",onMouseDown:e=>e.stopPropagation()},r(this.state)),i&&t().createElement(t().Fragment,null,t().createElement("div",{className:"ReactCrop__rule-of-thirds-hz"}),t().createElement("div",{className:"ReactCrop__rule-of-thirds-vt"})))}makePixelCrop(){const e={...i,...this.props.crop||{}},t=this.getBox();return l(e,t.width,t.height)}render(){const{aspect:e,children:o,circularCrop:r,className:i,crop:a,disabled:h,locked:s,style:d,ruleOfThirds:c}=this.props,{cropIsActive:l,newCropIsBeingDrawn:p}=this.state,g=a?this.createCropSelection():null,w=function(){for(var e,t,o=0,r="";o<arguments.length;)(e=arguments[o++])&&(t=n(e))&&(r&&(r+=" "),r+=t);return r}("ReactCrop",i,{"ReactCrop--active":l,"ReactCrop--disabled":h,"ReactCrop--locked":s,"ReactCrop--new-crop":p,"ReactCrop--fixed-aspect":a&&e,"ReactCrop--circular-crop":a&&r,"ReactCrop--rule-of-thirds":a&&c,"ReactCrop--invisible-crop":!this.dragStarted&&a&&!a.width&&!a.height});return t().createElement("div",{ref:this.componentRef,className:w,style:d},t().createElement("div",{ref:this.mediaRef,className:"ReactCrop__child-wrapper",onPointerDown:this.onComponentPointerDown},o),g)}}u.xOrds=["e","w"],u.yOrds=["n","s"],u.xyOrds=["nw","ne","se","sw"],u.nudgeStep=1,u.nudgeStepMedium=10,u.nudgeStepLarge=100,u.defaultProps={ariaLabels:{cropArea:"Use the arrow keys to move the crop selection area",nwDragHandle:"Use the arrow keys to move the north west drag handle to change the crop selection area",nDragHandle:"Use the up and down arrow keys to move the north drag handle to change the crop selection area",neDragHandle:"Use the arrow keys to move the north east drag handle to change the crop selection area",eDragHandle:"Use the up and down arrow keys to move the east drag handle to change the crop selection area",seDragHandle:"Use the arrow keys to move the south east drag handle to change the crop selection area",sDragHandle:"Use the up and down arrow keys to move the south drag handle to change the crop selection area",swDragHandle:"Use the arrow keys to move the south west drag handle to change the crop selection area",wDragHandle:"Use the up and down arrow keys to move the west drag handle to change the crop selection area"}};})(),r})()));
3523
+ !function(e,t){module.exports=t(require$$0__default["default"]);}(commonjsGlobal,(e=>(()=>{var t={899:t=>{t.exports=e;}},n={};function o(e){var r=n[e];if(void 0!==r)return r.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,o),i.exports}o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]});},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0});};var r={};return (()=>{o.r(r),o.d(r,{Component:()=>u,areCropsEqual:()=>h,centerCrop:()=>d,clamp:()=>a,containCrop:()=>p,convertToPercentCrop:()=>c,convertToPixelCrop:()=>l,default:()=>u,defaultCrop:()=>i,makeAspectCrop:()=>s,nudgeCrop:()=>g});var e=o(899),t=o.n(e);function n(e){var t,o,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(o=n(e[t]))&&(r&&(r+=" "),r+=o);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}const i={x:0,y:0,width:0,height:0,unit:"px"};function a(e,t,n){return Math.min(Math.max(e,t),n)}function h(e,t){return e.width===t.width&&e.height===t.height&&e.x===t.x&&e.y===t.y&&e.unit===t.unit}function s(e,t,n,o){const r=l(e,n,o);return e.width&&(r.height=r.width/t),e.height&&(r.width=r.height*t),r.y+r.height>o&&(r.height=o-r.y,r.width=r.height*t),r.x+r.width>n&&(r.width=n-r.x,r.height=r.width/t),"%"===e.unit?c(r,n,o):r}function d(e,t,n){const o=l(e,t,n);return o.x=(t-o.width)/2,o.y=(n-o.height)/2,"%"===e.unit?c(o,t,n):o}function c(e,t,n){return "%"===e.unit?{...i,...e,unit:"%"}:{unit:"%",x:e.x?e.x/t*100:0,y:e.y?e.y/n*100:0,width:e.width?e.width/t*100:0,height:e.height?e.height/n*100:0}}function l(e,t,n){return e.unit?"px"===e.unit?{...i,...e,unit:"px"}:{unit:"px",x:e.x?e.x*t/100:0,y:e.y?e.y*n/100:0,width:e.width?e.width*t/100:0,height:e.height?e.height*n/100:0}:{...i,...e,unit:"px"}}function p(e,t,n,o,r,i=0,a=0,h=o,s=r){const d={...e};let c=Math.min(i,o),l=Math.min(a,r),p=Math.min(h,o),g=Math.min(s,r);t&&(t>1?(c=a?a*t:c,l=c/t,p=h*t):(l=i?i/t:l,c=l*t,g=s/t)),d.y<0&&(d.height=Math.max(d.height+d.y,l),d.y=0),d.x<0&&(d.width=Math.max(d.width+d.x,c),d.x=0);const w=o-(d.x+d.width);w<0&&(d.x=Math.min(d.x,o-c),d.width+=w);const u=r-(d.y+d.height);if(u<0&&(d.y=Math.min(d.y,r-l),d.height+=u),d.width<c&&("sw"!==n&&"nw"!=n||(d.x-=c-d.width),d.width=c),d.height<l&&("nw"!==n&&"ne"!=n||(d.y-=l-d.height),d.height=l),d.width>p&&("sw"!==n&&"nw"!=n||(d.x-=p-d.width),d.width=p),d.height>g&&("nw"!==n&&"ne"!=n||(d.y-=g-d.height),d.height=g),t){const e=d.width/d.height;if(e<t){const e=Math.max(d.width/t,l);"nw"!==n&&"ne"!=n||(d.y-=e-d.height),d.height=e;}else if(e>t){const e=Math.max(d.height*t,c);"sw"!==n&&"nw"!=n||(d.x-=e-d.width),d.width=e;}}return d}function g(e,t,n,o){const r={...e};return "ArrowLeft"===t?"nw"===o?(r.x-=n,r.y-=n,r.width+=n,r.height+=n):"w"===o?(r.x-=n,r.width+=n):"sw"===o?(r.x-=n,r.width+=n,r.height+=n):"ne"===o?(r.y+=n,r.width-=n,r.height-=n):"e"===o?r.width-=n:"se"===o&&(r.width-=n,r.height-=n):"ArrowRight"===t&&("nw"===o?(r.x+=n,r.y+=n,r.width-=n,r.height-=n):"w"===o?(r.x+=n,r.width-=n):"sw"===o?(r.x+=n,r.width-=n,r.height-=n):"ne"===o?(r.y-=n,r.width+=n,r.height+=n):"e"===o?r.width+=n:"se"===o&&(r.width+=n,r.height+=n)),"ArrowUp"===t?"nw"===o?(r.x-=n,r.y-=n,r.width+=n,r.height+=n):"n"===o?(r.y-=n,r.height+=n):"ne"===o?(r.y-=n,r.width+=n,r.height+=n):"sw"===o?(r.x+=n,r.width-=n,r.height-=n):"s"===o?r.height-=n:"se"===o&&(r.width-=n,r.height-=n):"ArrowDown"===t&&("nw"===o?(r.x+=n,r.y+=n,r.width-=n,r.height-=n):"n"===o?(r.y+=n,r.height-=n):"ne"===o?(r.y+=n,r.width-=n,r.height-=n):"sw"===o?(r.x-=n,r.width+=n,r.height+=n):"s"===o?r.height+=n:"se"===o&&(r.width+=n,r.height+=n)),r}const w={capture:!0,passive:!1};class u extends e.PureComponent{constructor(){super(...arguments),this.docMoveBound=!1,this.mouseDownOnCrop=!1,this.dragStarted=!1,this.evData={startClientX:0,startClientY:0,startCropX:0,startCropY:0,clientX:0,clientY:0,isResize:!0},this.componentRef=(0, e.createRef)(),this.mediaRef=(0, e.createRef)(),this.initChangeCalled=!1,this.state={cropIsActive:!1,newCropIsBeingDrawn:!1},this.onCropPointerDown=e=>{const{crop:t,disabled:n}=this.props,o=this.getBox();if(!t)return;const r=l(t,o.width,o.height);if(n)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const i=e.target.dataset.ord,a=Boolean(i);let h=e.clientX,s=e.clientY,d=r.x,c=r.y;if(i){const t=e.clientX-o.x,n=e.clientY-o.y;let a=0,l=0;"ne"===i||"e"==i?(a=t-(r.x+r.width),l=n-r.y,d=r.x,c=r.y+r.height):"se"===i||"s"===i?(a=t-(r.x+r.width),l=n-(r.y+r.height),d=r.x,c=r.y):"sw"===i||"w"==i?(a=t-r.x,l=n-(r.y+r.height),d=r.x+r.width,c=r.y):"nw"!==i&&"n"!=i||(a=t-r.x,l=n-r.y,d=r.x+r.width,c=r.y+r.height),h=d+o.x+a,s=c+o.y+l;}this.evData={startClientX:h,startClientY:s,startCropX:d,startCropY:c,clientX:e.clientX,clientY:e.clientY,isResize:a,ord:i},this.mouseDownOnCrop=!0,this.setState({cropIsActive:!0});},this.onComponentPointerDown=e=>{const{crop:t,disabled:n,locked:o,keepSelection:r,onChange:i}=this.props,a=this.getBox();if(n||o||r&&t)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const h=e.clientX-a.x,s=e.clientY-a.y,d={unit:"px",x:h,y:s,width:0,height:0};this.evData={startClientX:e.clientX,startClientY:e.clientY,startCropX:h,startCropY:s,clientX:e.clientX,clientY:e.clientY,isResize:!0},this.mouseDownOnCrop=!0,i(l(d,a.width,a.height),c(d,a.width,a.height)),this.setState({cropIsActive:!0,newCropIsBeingDrawn:!0});},this.onDocPointerMove=e=>{const{crop:t,disabled:n,onChange:o,onDragStart:r}=this.props,i=this.getBox();if(n||!t||!this.mouseDownOnCrop)return;e.cancelable&&e.preventDefault(),this.dragStarted||(this.dragStarted=!0,r&&r(e));const{evData:a}=this;let s;a.clientX=e.clientX,a.clientY=e.clientY,s=a.isResize?this.resizeCrop():this.dragCrop(),h(t,s)||o(l(s,i.width,i.height),c(s,i.width,i.height));},this.onComponentKeyDown=e=>{const{crop:t,disabled:n,onChange:o,onComplete:r}=this.props,i=this.getBox();if(n)return;const h=e.key;let s=!1;if(!t)return;const d=this.makePixelCrop(),p=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?u.nudgeStepLarge:e.shiftKey?u.nudgeStepMedium:u.nudgeStep;if("ArrowLeft"===h?(d.x-=p,s=!0):"ArrowRight"===h?(d.x+=p,s=!0):"ArrowUp"===h?(d.y-=p,s=!0):"ArrowDown"===h&&(d.y+=p,s=!0),s){e.cancelable&&e.preventDefault(),d.x=a(d.x,0,i.width-d.width),d.y=a(d.y,0,i.height-d.height);const t=l(d,i.width,i.height),n=c(d,i.width,i.height);o(t,n),r&&r(t,n);}},this.onHandlerKeyDown=(e,t)=>{const{aspect:n=0,crop:o,disabled:r,minWidth:i=0,minHeight:a=0,maxWidth:s,maxHeight:d,onChange:w,onComplete:m}=this.props,y=this.getBox();if(r||!o)return;if("ArrowUp"!==e.key&&"ArrowDown"!==e.key&&"ArrowLeft"!==e.key&&"ArrowRight"!==e.key)return;e.stopPropagation(),e.preventDefault();const x=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?u.nudgeStepLarge:e.shiftKey?u.nudgeStepMedium:u.nudgeStep,C=p(g(l(o,y.width,y.height),e.key,x,t),n,t,y.width,y.height,i,a,s,d);if(!h(o,C)){const e=c(C,y.width,y.height);w(C,e),m&&m(C,e);}},this.onDocPointerDone=e=>{const{crop:t,disabled:n,onComplete:o,onDragEnd:r}=this.props,i=this.getBox();this.unbindDocMove(),!n&&t&&this.mouseDownOnCrop&&(this.mouseDownOnCrop=!1,this.dragStarted=!1,r&&r(e),o&&o(l(t,i.width,i.height),c(t,i.width,i.height)),this.setState({cropIsActive:!1,newCropIsBeingDrawn:!1}));},this.onDragFocus=e=>{var t;null===(t=this.componentRef.current)||void 0===t||t.scrollTo(0,0);};}get document(){return document}getBox(){const e=this.mediaRef.current;if(!e)return {x:0,y:0,width:0,height:0};const{x:t,y:n,width:o,height:r}=e.getBoundingClientRect();return {x:t,y:n,width:o,height:r}}componentDidUpdate(e){const{crop:t,onComplete:n}=this.props;if(n&&!e.crop&&t){const{width:e,height:o}=this.getBox();e&&o&&n(l(t,e,o),c(t,e,o));}}componentWillUnmount(){this.resizeObserver&&this.resizeObserver.disconnect();}bindDocMove(){this.docMoveBound||(this.document.addEventListener("pointermove",this.onDocPointerMove,w),this.document.addEventListener("pointerup",this.onDocPointerDone,w),this.document.addEventListener("pointercancel",this.onDocPointerDone,w),this.docMoveBound=!0);}unbindDocMove(){this.docMoveBound&&(this.document.removeEventListener("pointermove",this.onDocPointerMove,w),this.document.removeEventListener("pointerup",this.onDocPointerDone,w),this.document.removeEventListener("pointercancel",this.onDocPointerDone,w),this.docMoveBound=!1);}getCropStyle(){const{crop:e}=this.props;if(e)return {top:`${e.y}${e.unit}`,left:`${e.x}${e.unit}`,width:`${e.width}${e.unit}`,height:`${e.height}${e.unit}`}}dragCrop(){const{evData:e}=this,t=this.getBox(),n=this.makePixelCrop(),o=e.clientX-e.startClientX,r=e.clientY-e.startClientY;return n.x=a(e.startCropX+o,0,t.width-n.width),n.y=a(e.startCropY+r,0,t.height-n.height),n}getPointRegion(e){const{evData:t}=this,n=t.clientX-e.x,o=t.clientY-e.y<t.startCropY;return n<t.startCropX?o?"nw":"sw":o?"ne":"se"}resizeCrop(){const{evData:e}=this,t=this.getBox(),{aspect:n=0,minWidth:o=0,minHeight:r=0,maxWidth:i,maxHeight:a}=this.props,h=this.getPointRegion(t),s=this.makePixelCrop(),d=e.ord?e.ord:h,c=e.clientX-e.startClientX,l=e.clientY-e.startClientY,g={unit:"px",x:0,y:0,width:0,height:0};"ne"===h?(g.x=e.startCropX,g.width=c,n?(g.height=g.width/n,g.y=e.startCropY-g.height):(g.height=Math.abs(l),g.y=e.startCropY-g.height)):"se"===h?(g.x=e.startCropX,g.y=e.startCropY,g.width=c,g.height=n?g.width/n:l):"sw"===h?(g.x=e.startCropX+c,g.y=e.startCropY,g.width=Math.abs(c),g.height=n?g.width/n:l):"nw"===h&&(g.x=e.startCropX+c,g.width=Math.abs(c),n?(g.height=g.width/n,g.y=e.startCropY-g.height):(g.height=Math.abs(l),g.y=e.startCropY+l));const w=p(g,n,h,t.width,t.height,o,r,i,a);return n||u.xyOrds.indexOf(d)>-1?(s.x=w.x,s.y=w.y,s.width=w.width,s.height=w.height):u.xOrds.indexOf(d)>-1?(s.x=w.x,s.width=w.width):u.yOrds.indexOf(d)>-1&&(s.y=w.y,s.height=w.height),s}createCropSelection(){const{ariaLabels:e=u.defaultProps.ariaLabels,disabled:n,locked:o,renderSelectionAddon:r,ruleOfThirds:i,crop:a}=this.props,h=this.getCropStyle();if(a)return t().createElement("div",{style:h,className:"ReactCrop__crop-selection",onPointerDown:this.onCropPointerDown,"aria-label":e.cropArea,tabIndex:0,onKeyDown:this.onComponentKeyDown,role:"group"},!n&&!o&&t().createElement("div",{className:"ReactCrop__drag-elements",onFocus:this.onDragFocus},t().createElement("div",{className:"ReactCrop__drag-bar ord-n","data-ord":"n"}),t().createElement("div",{className:"ReactCrop__drag-bar ord-e","data-ord":"e"}),t().createElement("div",{className:"ReactCrop__drag-bar ord-s","data-ord":"s"}),t().createElement("div",{className:"ReactCrop__drag-bar ord-w","data-ord":"w"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-nw","data-ord":"nw",tabIndex:0,"aria-label":e.nwDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"nw"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-n","data-ord":"n",tabIndex:0,"aria-label":e.nDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"n"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-ne","data-ord":"ne",tabIndex:0,"aria-label":e.neDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"ne"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-e","data-ord":"e",tabIndex:0,"aria-label":e.eDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"e"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-se","data-ord":"se",tabIndex:0,"aria-label":e.seDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"se"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-s","data-ord":"s",tabIndex:0,"aria-label":e.sDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"s"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-sw","data-ord":"sw",tabIndex:0,"aria-label":e.swDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"sw"),role:"button"}),t().createElement("div",{className:"ReactCrop__drag-handle ord-w","data-ord":"w",tabIndex:0,"aria-label":e.wDragHandle,onKeyDown:e=>this.onHandlerKeyDown(e,"w"),role:"button"})),r&&t().createElement("div",{className:"ReactCrop__selection-addon",onMouseDown:e=>e.stopPropagation()},r(this.state)),i&&t().createElement(t().Fragment,null,t().createElement("div",{className:"ReactCrop__rule-of-thirds-hz"}),t().createElement("div",{className:"ReactCrop__rule-of-thirds-vt"})))}makePixelCrop(){const e={...i,...this.props.crop||{}},t=this.getBox();return l(e,t.width,t.height)}render(){const{aspect:e,children:o,circularCrop:r,className:i,crop:a,disabled:h,locked:s,style:d,ruleOfThirds:c}=this.props,{cropIsActive:l,newCropIsBeingDrawn:p}=this.state,g=a?this.createCropSelection():null,w=function(){for(var e,t,o=0,r="";o<arguments.length;)(e=arguments[o++])&&(t=n(e))&&(r&&(r+=" "),r+=t);return r}("ReactCrop",i,{"ReactCrop--active":l,"ReactCrop--disabled":h,"ReactCrop--locked":s,"ReactCrop--new-crop":p,"ReactCrop--fixed-aspect":a&&e,"ReactCrop--circular-crop":a&&r,"ReactCrop--rule-of-thirds":a&&c,"ReactCrop--invisible-crop":!this.dragStarted&&a&&!a.width&&!a.height});return t().createElement("div",{ref:this.componentRef,className:w,style:d},t().createElement("div",{ref:this.mediaRef,className:"ReactCrop__child-wrapper",onPointerDown:this.onComponentPointerDown},o),g)}}u.xOrds=["e","w"],u.yOrds=["n","s"],u.xyOrds=["nw","ne","se","sw"],u.nudgeStep=1,u.nudgeStepMedium=10,u.nudgeStepLarge=100,u.defaultProps={ariaLabels:{cropArea:"Use the arrow keys to move the crop selection area",nwDragHandle:"Use the arrow keys to move the north west drag handle to change the crop selection area",nDragHandle:"Use the up and down arrow keys to move the north drag handle to change the crop selection area",neDragHandle:"Use the arrow keys to move the north east drag handle to change the crop selection area",eDragHandle:"Use the up and down arrow keys to move the east drag handle to change the crop selection area",seDragHandle:"Use the arrow keys to move the south east drag handle to change the crop selection area",sDragHandle:"Use the up and down arrow keys to move the south drag handle to change the crop selection area",swDragHandle:"Use the arrow keys to move the south west drag handle to change the crop selection area",wDragHandle:"Use the up and down arrow keys to move the west drag handle to change the crop selection area"}};})(),r})()));
3524
3524
  } (ReactCrop_min, ReactCrop_min.exports));
3525
3525
 
3526
3526
  var ReactCrop_minExports = ReactCrop_min.exports;
@@ -3533,8 +3533,12 @@ var developmentApi = {
3533
3533
  cropImage: cropImage
3534
3534
  };
3535
3535
 
3536
+ function ownKeys$4(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; }
3537
+ function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
3536
3538
  var useCropImage = function useCropImage(options) {
3537
- return reactQuery.useMutation(developmentApi.cropImage, options);
3539
+ return reactQuery.useMutation(_objectSpread$4({
3540
+ mutationFn: developmentApi.cropImage
3541
+ }, options));
3538
3542
  };
3539
3543
 
3540
3544
  var useImageControls = function useImageControls(_ref) {
@@ -3672,11 +3676,11 @@ var Controls = function Controls(_ref) {
3672
3676
  var _imageRef$current3, _imageRef$current4;
3673
3677
  return cropHeight * (((_imageRef$current3 = imageRef.current) === null || _imageRef$current3 === void 0 ? void 0 : _imageRef$current3.naturalWidth) / ((_imageRef$current4 = imageRef.current) === null || _imageRef$current4 === void 0 ? void 0 : _imageRef$current4.width));
3674
3678
  };
3675
- var _useState = React.useState(getActualCropHeight(crop.height)),
3679
+ var _useState = require$$0.useState(getActualCropHeight(crop.height)),
3676
3680
  _useState2 = _slicedToArray$2(_useState, 2),
3677
3681
  height = _useState2[0],
3678
3682
  setHeight = _useState2[1];
3679
- var _useState3 = React.useState(getActualCropWidth(crop.width)),
3683
+ var _useState3 = require$$0.useState(getActualCropWidth(crop.width)),
3680
3684
  _useState4 = _slicedToArray$2(_useState3, 2),
3681
3685
  width = _useState4[0],
3682
3686
  setWidth = _useState4[1];
@@ -3698,73 +3702,80 @@ var Controls = function Controls(_ref) {
3698
3702
  handleAspectHeightChange = _useImageControls.handleAspectHeightChange;
3699
3703
  var debouncedHeight = reactUtils.useDebounce(height, 800);
3700
3704
  var debouncedWidth = reactUtils.useDebounce(width, 800);
3701
- React.useEffect(function () {
3705
+ require$$0.useEffect(function () {
3702
3706
  handleHeightChange(debouncedHeight);
3703
3707
  }, [debouncedHeight]);
3704
- React.useEffect(function () {
3708
+ require$$0.useEffect(function () {
3705
3709
  handleWidthChange(debouncedWidth);
3706
3710
  }, [debouncedWidth]);
3707
- React.useEffect(function () {
3711
+ require$$0.useEffect(function () {
3708
3712
  setHeight(getActualCropHeight(crop.height));
3709
3713
  setWidth(getActualCropWidth(crop.width));
3710
3714
  }, [crop]);
3711
- return /*#__PURE__*/React__default["default"].createElement("div", {
3712
- className: "flex flex-col p-4 md:w-2/6 "
3713
- }, !hideControls && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Switch__default["default"], {
3714
- checked: isFullImage,
3715
- className: "flex-grow-0",
3716
- label: t("neetoImageUploader.labels.selectOriginalImage"),
3717
- onChange: function onChange() {
3718
- return setIsFullImage(function (isFullImage) {
3719
- return !isFullImage;
3720
- });
3721
- }
3722
- }), /*#__PURE__*/React__default["default"].createElement(Switch__default["default"], {
3723
- checked: isAspectRatioLocked,
3724
- className: "mt-4 flex-grow-0",
3725
- disabled: isFullImage,
3726
- label: t("neetoImageUploader.labels.lockAspectRatio"),
3727
- onChange: onToggleAspectRatioLock
3728
- }), /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
3729
- className: "mb-2 mt-6",
3730
- style: "body2"
3731
- }, t("neetoImageUploader.imageEditor.aspectRatio")), /*#__PURE__*/React__default["default"].createElement("div", {
3732
- className: "flex gap-4 self-start"
3733
- }, /*#__PURE__*/React__default["default"].createElement(Input__default["default"], {
3734
- "data-cy": "aspect-ratio-width-input",
3735
- disabled: isFullImage,
3736
- size: "small",
3737
- type: "number",
3738
- value: aspectRatio.width,
3739
- onChange: utils.withEventTargetValue(handleAspectWidthChange)
3740
- }), /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], null, " : "), /*#__PURE__*/React__default["default"].createElement(Input__default["default"], {
3741
- "data-cy": "aspect-ratio-height-input",
3742
- disabled: isFullImage,
3743
- size: "small",
3744
- type: "number",
3745
- value: aspectRatio.height,
3746
- onChange: utils.withEventTargetValue(handleAspectHeightChange)
3747
- }))), /*#__PURE__*/React__default["default"].createElement(Input__default["default"], {
3748
- className: "mt-4 flex-grow-0",
3749
- disabled: isFullImage,
3750
- label: t("neetoImageUploader.labels.width"),
3751
- type: "number",
3752
- value: Math.round(width),
3753
- onChange: utils.withEventTargetValue(setWidth)
3754
- }), /*#__PURE__*/React__default["default"].createElement(Input__default["default"], {
3755
- className: "mt-4 flex-grow-0",
3756
- disabled: isFullImage,
3757
- label: t("neetoImageUploader.labels.height"),
3758
- type: "number",
3759
- value: Math.round(height),
3760
- onChange: utils.withEventTargetValue(setHeight)
3761
- }), /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
3762
- className: "mt-6 self-start",
3763
- "data-cy": "neeto-image-uploader-crop-submit-button",
3764
- label: t("neetoImageUploader.labels.done"),
3765
- disabled: isNilOrEmpty(imageRef.current) && (crop.width <= 0 || crop.height <= 0),
3766
- onClick: handleSubmit
3767
- }));
3715
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
3716
+ className: "flex flex-col p-4 md:w-2/6 ",
3717
+ children: [!hideControls && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
3718
+ children: [/*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], {
3719
+ checked: isFullImage,
3720
+ className: "flex-grow-0",
3721
+ label: t("neetoImageUploader.labels.selectOriginalImage"),
3722
+ onChange: function onChange() {
3723
+ return setIsFullImage(function (isFullImage) {
3724
+ return !isFullImage;
3725
+ });
3726
+ }
3727
+ }), /*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], {
3728
+ checked: isAspectRatioLocked,
3729
+ className: "mt-4 flex-grow-0",
3730
+ disabled: isFullImage,
3731
+ label: t("neetoImageUploader.labels.lockAspectRatio"),
3732
+ onChange: onToggleAspectRatioLock
3733
+ }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
3734
+ className: "mb-2 mt-6",
3735
+ style: "body2",
3736
+ children: t("neetoImageUploader.imageEditor.aspectRatio")
3737
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", {
3738
+ className: "flex gap-4 self-start",
3739
+ children: [/*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
3740
+ "data-cy": "aspect-ratio-width-input",
3741
+ disabled: isFullImage,
3742
+ size: "small",
3743
+ type: "number",
3744
+ value: aspectRatio.width,
3745
+ onChange: utils.withEventTargetValue(handleAspectWidthChange)
3746
+ }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
3747
+ children: " : "
3748
+ }), /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
3749
+ "data-cy": "aspect-ratio-height-input",
3750
+ disabled: isFullImage,
3751
+ size: "small",
3752
+ type: "number",
3753
+ value: aspectRatio.height,
3754
+ onChange: utils.withEventTargetValue(handleAspectHeightChange)
3755
+ })]
3756
+ })]
3757
+ }), /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
3758
+ className: "mt-4 flex-grow-0",
3759
+ disabled: isFullImage,
3760
+ label: t("neetoImageUploader.labels.width"),
3761
+ type: "number",
3762
+ value: Math.round(width),
3763
+ onChange: utils.withEventTargetValue(setWidth)
3764
+ }), /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
3765
+ className: "mt-4 flex-grow-0",
3766
+ disabled: isFullImage,
3767
+ label: t("neetoImageUploader.labels.height"),
3768
+ type: "number",
3769
+ value: Math.round(height),
3770
+ onChange: utils.withEventTargetValue(setHeight)
3771
+ }), /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
3772
+ className: "mt-6 self-start",
3773
+ "data-cy": "neeto-image-uploader-crop-submit-button",
3774
+ label: t("neetoImageUploader.labels.done"),
3775
+ disabled: isNilOrEmpty(imageRef.current) && (crop.width <= 0 || crop.height <= 0),
3776
+ onClick: handleSubmit
3777
+ })]
3778
+ });
3768
3779
  };
3769
3780
 
3770
3781
  var ImageEditor = function ImageEditor(_ref) {
@@ -3776,22 +3787,22 @@ var ImageEditor = function ImageEditor(_ref) {
3776
3787
  signedId = _ref$signedId === void 0 ? "" : _ref$signedId,
3777
3788
  _ref$fixedAspectRatio = _ref.fixedAspectRatio,
3778
3789
  fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio;
3779
- var _useState = React.useState(true),
3790
+ var _useState = require$$0.useState(true),
3780
3791
  _useState2 = _slicedToArray$2(_useState, 2),
3781
3792
  isAspectRatioLocked = _useState2[0],
3782
3793
  setIsAspectRatioLocked = _useState2[1];
3783
- var _useState3 = React.useState(false),
3794
+ var _useState3 = require$$0.useState(false),
3784
3795
  _useState4 = _slicedToArray$2(_useState3, 2),
3785
3796
  isFullImage = _useState4[0],
3786
3797
  setIsFullImage = _useState4[1];
3787
- var _useState5 = React.useState({
3798
+ var _useState5 = require$$0.useState({
3788
3799
  width: (fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.width) || 16,
3789
3800
  height: (fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.height) || 9
3790
3801
  }),
3791
3802
  _useState6 = _slicedToArray$2(_useState5, 2),
3792
3803
  aspectRatio = _useState6[0],
3793
3804
  setAspectRatio = _useState6[1];
3794
- var _useState7 = React.useState(DEFAULT_CROP_CONFIG),
3805
+ var _useState7 = require$$0.useState(DEFAULT_CROP_CONFIG),
3795
3806
  _useState8 = _slicedToArray$2(_useState7, 2),
3796
3807
  crop = _useState8[0],
3797
3808
  setCrop = _useState8[1];
@@ -3799,8 +3810,8 @@ var ImageEditor = function ImageEditor(_ref) {
3799
3810
  t = _useTranslation.t;
3800
3811
  var _useCropImage = useCropImage(),
3801
3812
  cropImage = _useCropImage.mutate;
3802
- var imageRef = React.useRef(null);
3803
- var wrapperRef = React.useRef(null);
3813
+ var imageRef = require$$0.useRef(null);
3814
+ var wrapperRef = require$$0.useRef(null);
3804
3815
  var cropAspectRatio = neetoCist.isPresent(fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.width) && neetoCist.isPresent(fixedAspectRatio.height) ? (fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.width) / (fixedAspectRatio === null || fixedAspectRatio === void 0 ? void 0 : fixedAspectRatio.height) : 16 / 9;
3805
3816
  var processCrop = function processCrop() {
3806
3817
  if (isFullImage) {
@@ -3835,57 +3846,61 @@ var ImageEditor = function ImageEditor(_ref) {
3835
3846
  url: newURL
3836
3847
  }));
3837
3848
  };
3838
- return /*#__PURE__*/React__default["default"].createElement("div", {
3839
- className: "flex h-full flex-col gap-4 px-8 py-12"
3840
- }, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
3841
- className: "self-start",
3842
- "data-cy": "image-editor-back-button",
3843
- icon: neetoIcons.LeftArrow,
3844
- iconPosition: "left",
3845
- style: "text",
3846
- onClick: handleReset
3847
- }), /*#__PURE__*/React__default["default"].createElement("div", {
3848
- className: "flex h-full w-full flex-col gap-2 overflow-y-scroll md:flex-row md:overflow-y-auto"
3849
- }, /*#__PURE__*/React__default["default"].createElement("div", {
3850
- id: "imageEditor",
3851
- ref: wrapperRef,
3852
- className: classnames__default["default"]("flex", "h-full w-full md:w-4/6", "justify-around", "neeto-ui-bg-gray-200", {
3853
- "items-center": isItemsCenter({
3854
- wrapperRef: wrapperRef,
3855
- imageRef: imageRef
3856
- })
3857
- })
3858
- }, /*#__PURE__*/React__default["default"].createElement(ReactCrop, {
3859
- crop: isFullImage ? null : crop,
3860
- src: image === null || image === void 0 ? void 0 : image.url,
3861
- aspect: isAspectRatioLocked ? aspectRatio.width / aspectRatio.height : 0,
3862
- onChange: setCrop,
3863
- onComplete: setCrop
3864
- }, /*#__PURE__*/React__default["default"].createElement("img", {
3865
- alt: t("neetoImageUploader.common.image"),
3866
- "data-cy": "image-editor-uploaded-image",
3867
- ref: imageRef,
3868
- src: image === null || image === void 0 ? void 0 : image.url,
3869
- onLoad: function onLoad(e) {
3870
- return onImageLoaded({
3871
- image: e.target,
3849
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
3850
+ className: "flex h-full flex-col gap-4 px-8 py-12",
3851
+ children: [/*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
3852
+ className: "self-start",
3853
+ "data-cy": "image-editor-back-button",
3854
+ icon: neetoIcons.LeftArrow,
3855
+ iconPosition: "left",
3856
+ style: "text",
3857
+ onClick: handleReset
3858
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", {
3859
+ className: "flex h-full w-full flex-col gap-2 overflow-y-scroll md:flex-row md:overflow-y-auto",
3860
+ children: [/*#__PURE__*/jsxRuntime.jsx("div", {
3861
+ id: "imageEditor",
3862
+ ref: wrapperRef,
3863
+ className: classnames__default["default"]("flex", "h-full w-full md:w-4/6", "justify-around", "neeto-ui-bg-gray-200", {
3864
+ "items-center": isItemsCenter({
3865
+ wrapperRef: wrapperRef,
3866
+ imageRef: imageRef
3867
+ })
3868
+ }),
3869
+ children: /*#__PURE__*/jsxRuntime.jsx(ReactCrop, {
3870
+ crop: isFullImage ? null : crop,
3871
+ src: image === null || image === void 0 ? void 0 : image.url,
3872
+ aspect: isAspectRatioLocked ? aspectRatio.width / aspectRatio.height : 0,
3873
+ onChange: setCrop,
3874
+ onComplete: setCrop,
3875
+ children: /*#__PURE__*/jsxRuntime.jsx("img", {
3876
+ alt: t("neetoImageUploader.common.image"),
3877
+ "data-cy": "image-editor-uploaded-image",
3878
+ ref: imageRef,
3879
+ src: image === null || image === void 0 ? void 0 : image.url,
3880
+ onLoad: function onLoad(e) {
3881
+ return onImageLoaded({
3882
+ image: e.target,
3883
+ setCrop: setCrop,
3884
+ cropAspectRatio: cropAspectRatio
3885
+ });
3886
+ }
3887
+ })
3888
+ })
3889
+ }), /*#__PURE__*/jsxRuntime.jsx(Controls, {
3890
+ aspectRatio: aspectRatio,
3891
+ crop: crop,
3892
+ handleSubmit: handleSubmit,
3893
+ imageRef: imageRef,
3894
+ isAspectRatioLocked: isAspectRatioLocked,
3895
+ isFullImage: isFullImage,
3896
+ setAspectRatio: setAspectRatio,
3872
3897
  setCrop: setCrop,
3873
- cropAspectRatio: cropAspectRatio
3874
- });
3875
- }
3876
- }))), /*#__PURE__*/React__default["default"].createElement(Controls, {
3877
- aspectRatio: aspectRatio,
3878
- crop: crop,
3879
- handleSubmit: handleSubmit,
3880
- imageRef: imageRef,
3881
- isAspectRatioLocked: isAspectRatioLocked,
3882
- isFullImage: isFullImage,
3883
- setAspectRatio: setAspectRatio,
3884
- setCrop: setCrop,
3885
- setIsFullImage: setIsFullImage,
3886
- hideControls: neetoCist.isPresent(fixedAspectRatio),
3887
- setAspectRatioLocked: setIsAspectRatioLocked
3888
- })));
3898
+ setIsFullImage: setIsFullImage,
3899
+ hideControls: neetoCist.isPresent(fixedAspectRatio),
3900
+ setAspectRatioLocked: setIsAspectRatioLocked
3901
+ })]
3902
+ })]
3903
+ });
3889
3904
  };
3890
3905
 
3891
3906
  var fetch = function fetch(_ref) {
@@ -3905,20 +3920,35 @@ var imagesApi = {
3905
3920
  fetch: fetch
3906
3921
  };
3907
3922
 
3923
+ function ownKeys$3(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; }
3924
+ function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
3908
3925
  var useFetchAssets = function useFetchAssets(_ref) {
3909
3926
  var searchTerm = _ref.searchTerm,
3910
3927
  url = _ref.url,
3911
- page = _ref.page,
3912
3928
  per = _ref.per;
3913
3929
  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
3914
- return reactQuery.useQuery([QUERY_KEYS.ASSETS_LIST], function () {
3915
- return imagesApi.fetch({
3916
- searchTerm: searchTerm,
3917
- url: url,
3918
- page: page,
3919
- per: per
3920
- });
3921
- }, ramda.mergeRight({
3930
+ return reactQuery.useInfiniteQuery(_objectSpread$3({
3931
+ queryKey: [QUERY_KEYS.ASSETS_LIST, searchTerm],
3932
+ queryFn: function queryFn(_ref2) {
3933
+ var _ref2$pageParam = _ref2.pageParam,
3934
+ pageParam = _ref2$pageParam === void 0 ? 1 : _ref2$pageParam;
3935
+ return imagesApi.fetch({
3936
+ searchTerm: searchTerm,
3937
+ url: url,
3938
+ page: pageParam,
3939
+ per: per
3940
+ });
3941
+ },
3942
+ getNextPageParam: function getNextPageParam(lastPage, _, lastPageParam) {
3943
+ return lastPage.length === IMAGES_PER_PAGE ? lastPageParam + 1 : null;
3944
+ },
3945
+ select: function select(data) {
3946
+ var results = data.pages.flatMap(ramda.identity);
3947
+ return {
3948
+ results: results
3949
+ };
3950
+ },
3951
+ initialPageParam: 1,
3922
3952
  staleTime: ASSETS_STALE_TIME
3923
3953
  }, options));
3924
3954
  };
@@ -4219,7 +4249,7 @@ InfiniteScroll.exports;
4219
4249
 
4220
4250
  var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
4221
4251
 
4222
- var _react = React__default["default"];
4252
+ var _react = require$$0__default["default"];
4223
4253
 
4224
4254
  var _react2 = _interopRequireDefault(_react);
4225
4255
 
@@ -4524,7 +4554,7 @@ var _createClass = function () { function defineProperties(target, props) { for
4524
4554
 
4525
4555
  var _class, _temp2;
4526
4556
 
4527
- var _react = React__default["default"];
4557
+ var _react = require$$0__default["default"];
4528
4558
 
4529
4559
  var _react2 = _interopRequireDefault(_react);
4530
4560
 
@@ -4694,123 +4724,100 @@ var InfiniteScroller = function InfiniteScroller(_ref) {
4694
4724
  handleUnsplashImageSelect = _ref$handleUnsplashIm === void 0 ? neetoCist.noop : _ref$handleUnsplashIm;
4695
4725
  var _useTranslation = reactI18next.useTranslation(),
4696
4726
  t = _useTranslation.t;
4697
- var Loader = /*#__PURE__*/React__default["default"].createElement("div", {
4698
- className: "flex justify-center"
4699
- }, /*#__PURE__*/React__default["default"].createElement(Spinner__default["default"], null));
4700
- return /*#__PURE__*/React__default["default"].createElement("div", {
4701
- className: "niu-unsplash-container mr-2 max-w-full overflow-x-hidden overflow-y-scroll"
4702
- }, /*#__PURE__*/React__default["default"].createElement(_default, {
4703
- hasMore: hasMore,
4704
- loadMore: loadMore,
4705
- pack: true,
4706
- position: true,
4707
- className: "w-full",
4708
- loader: Loader,
4709
- sizes: INFINITE_SCROLLER_SIZES,
4710
- style: INFINITE_SCROLLER_STYLE,
4711
- useWindow: false
4712
- }, images.map(function (image, index) {
4713
- var _image$urls, _image$user, _image$user2;
4714
- return /*#__PURE__*/React__default["default"].createElement("div", {
4715
- className: "float-left w-1/2 pb-4 pr-4 md:w-1/4",
4716
- key: image.id
4717
- }, /*#__PURE__*/React__default["default"].createElement("div", {
4718
- className: "relative w-full",
4719
- style: {
4720
- paddingBottom: "".concat(image.height / image.width * 100, "%")
4721
- }
4722
- }, /*#__PURE__*/React__default["default"].createElement("div", {
4723
- className: "neeto-ui-rounded-sm neeto-ui-bg-gray-100 group absolute h-full w-full",
4724
- id: "unsplashImage".concat(image.id)
4725
- }, tab === TABS[1].key && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("img", {
4726
- "data-cy": "niu-unsplash-image-".concat(index),
4727
- src: image === null || image === void 0 || (_image$urls = image.urls) === null || _image$urls === void 0 ? void 0 : _image$urls.regular,
4728
- onClick: function onClick() {
4729
- return handleUnsplashImageSelect(image);
4730
- }
4731
- }), /*#__PURE__*/React__default["default"].createElement("a", {
4732
- className: "neeto-ui-text-gray-100 absolute bottom-2 left-2 m-auto text-xs underline opacity-0 group-hover:opacity-100",
4733
- href: "https://unsplash.com/@".concat(image === null || image === void 0 || (_image$user = image.user) === null || _image$user === void 0 ? void 0 : _image$user.username),
4734
- rel: "noreferrer",
4735
- target: "_blank"
4736
- }, image === null || image === void 0 || (_image$user2 = image.user) === null || _image$user2 === void 0 ? void 0 : _image$user2.name, " | ", " ", t("neetoImageUploader.labels.unsplash"))), tab === TABS[0].key && /*#__PURE__*/React__default["default"].createElement("img", {
4737
- "data-cy": "niu-library-image-".concat(index),
4738
- src: image === null || image === void 0 ? void 0 : image.url,
4739
- onClick: function onClick() {
4740
- return setSelectedImage(image);
4741
- }
4742
- }))));
4743
- })));
4727
+ var Loader = /*#__PURE__*/jsxRuntime.jsx("div", {
4728
+ className: "flex justify-center",
4729
+ children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
4730
+ });
4731
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
4732
+ className: "niu-unsplash-container mr-2 max-w-full overflow-x-hidden overflow-y-scroll",
4733
+ children: /*#__PURE__*/jsxRuntime.jsx(_default, {
4734
+ hasMore: hasMore,
4735
+ loadMore: loadMore,
4736
+ pack: true,
4737
+ position: true,
4738
+ className: "w-full",
4739
+ loader: Loader,
4740
+ sizes: INFINITE_SCROLLER_SIZES,
4741
+ style: INFINITE_SCROLLER_STYLE,
4742
+ useWindow: false,
4743
+ children: images.map(function (image, index) {
4744
+ var _image$urls, _image$user, _image$user2;
4745
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
4746
+ className: "float-left w-1/2 pb-4 pr-4 md:w-1/4",
4747
+ children: /*#__PURE__*/jsxRuntime.jsx("div", {
4748
+ className: "relative w-full",
4749
+ style: {
4750
+ paddingBottom: "".concat(image.height / image.width * 100, "%")
4751
+ },
4752
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
4753
+ className: "neeto-ui-rounded-sm neeto-ui-bg-gray-100 group absolute h-full w-full",
4754
+ id: "unsplashImage".concat(image.id),
4755
+ children: [tab === TABS[1].key && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
4756
+ children: [/*#__PURE__*/jsxRuntime.jsx("img", {
4757
+ "data-cy": "niu-unsplash-image-".concat(index),
4758
+ src: image === null || image === void 0 || (_image$urls = image.urls) === null || _image$urls === void 0 ? void 0 : _image$urls.regular,
4759
+ onClick: function onClick() {
4760
+ return handleUnsplashImageSelect(image);
4761
+ }
4762
+ }), /*#__PURE__*/jsxRuntime.jsxs("a", {
4763
+ className: "neeto-ui-text-gray-100 absolute bottom-2 left-2 m-auto text-xs underline opacity-0 group-hover:opacity-100",
4764
+ href: "https://unsplash.com/@".concat(image === null || image === void 0 || (_image$user = image.user) === null || _image$user === void 0 ? void 0 : _image$user.username),
4765
+ rel: "noreferrer",
4766
+ target: "_blank",
4767
+ children: [image === null || image === void 0 || (_image$user2 = image.user) === null || _image$user2 === void 0 ? void 0 : _image$user2.name, " | ", " ", t("neetoImageUploader.labels.unsplash")]
4768
+ })]
4769
+ }), tab === TABS[0].key && /*#__PURE__*/jsxRuntime.jsx("img", {
4770
+ "data-cy": "niu-library-image-".concat(index),
4771
+ src: image === null || image === void 0 ? void 0 : image.url,
4772
+ onClick: function onClick() {
4773
+ return setSelectedImage(image);
4774
+ }
4775
+ })]
4776
+ })
4777
+ })
4778
+ }, image.id);
4779
+ })
4780
+ })
4781
+ });
4744
4782
  };
4745
4783
 
4746
4784
  var Images = function Images(_ref) {
4747
- var query = _ref.query,
4748
- debouncedQuery = _ref.debouncedQuery,
4785
+ var debouncedQuery = _ref.debouncedQuery,
4749
4786
  setSelectedImage = _ref.setSelectedImage;
4750
- var _useState = React.useState(true),
4751
- _useState2 = _slicedToArray$2(_useState, 2),
4752
- hasMore = _useState2[0],
4753
- setHasMore = _useState2[1];
4754
- var _useState3 = React.useState([]),
4755
- _useState4 = _slicedToArray$2(_useState3, 2),
4756
- images = _useState4[0],
4757
- setImages = _useState4[1];
4758
- var _useState5 = React.useState(1),
4759
- _useState6 = _slicedToArray$2(_useState5, 2),
4760
- pageNo = _useState6[0],
4761
- setPageNo = _useState6[1];
4762
- var _useState7 = React.useState(false),
4763
- _useState8 = _slicedToArray$2(_useState7, 2),
4764
- error = _useState8[0],
4765
- setError = _useState8[1];
4766
- var onSuccess = function onSuccess() {
4767
- var results = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
4768
- ramda.equals(pageNo, 1) ? setImages(results) : setImages(ramda.concat(ramda.__, results));
4769
- setPageNo(ramda.inc);
4770
- setHasMore(results.length === IMAGES_PER_PAGE);
4771
- };
4772
- var onError = function onError() {
4773
- return setError(true);
4774
- };
4775
4787
  var _useTranslation = reactI18next.useTranslation(),
4776
4788
  t = _useTranslation.t;
4777
4789
  var _useFetchAssets = useFetchAssets({
4778
4790
  searchTerm: debouncedQuery,
4779
- page: pageNo,
4780
4791
  per: IMAGES_PER_PAGE,
4781
4792
  url: ASSETS_FETCH_URL
4782
- }, {
4783
- onSuccess: onSuccess,
4784
- onError: onError
4785
4793
  }),
4786
- refetch = _useFetchAssets.refetch,
4787
- isFetching = _useFetchAssets.isFetching;
4788
- var loadMore = reactUtils.useFuncDebounce(function () {
4789
- if (isFetching) return;
4790
- if (!hasMore) return;
4791
- if (pageNo > 1) {
4792
- setError(false);
4793
- refetch();
4794
- }
4795
- }, 500);
4796
- React.useEffect(function () {
4797
- setPageNo(1);
4798
- }, [query]);
4799
- React.useEffect(function () {
4800
- setImages([]);
4801
- refetch();
4802
- }, [debouncedQuery]);
4803
- if (error) {
4804
- return /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
4794
+ fetchNextPage = _useFetchAssets.fetchNextPage,
4795
+ hasNextPage = _useFetchAssets.hasNextPage,
4796
+ _useFetchAssets$data = _useFetchAssets.data,
4797
+ _useFetchAssets$data2 = _useFetchAssets$data === void 0 ? {} : _useFetchAssets$data,
4798
+ _useFetchAssets$data3 = _useFetchAssets$data2.results,
4799
+ results = _useFetchAssets$data3 === void 0 ? [] : _useFetchAssets$data3,
4800
+ isLoading = _useFetchAssets.isLoading,
4801
+ isError = _useFetchAssets.isError;
4802
+ if (isError) {
4803
+ return /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
4805
4804
  className: "mt-9 flex justify-center",
4806
- style: "body2"
4807
- }, t("neetoImageUploader.unsplash.errorMessage"));
4805
+ style: "body2",
4806
+ children: t("neetoImageUploader.unsplash.errorMessage")
4807
+ });
4808
4808
  }
4809
- return /*#__PURE__*/React__default["default"].createElement(InfiniteScroller, {
4810
- hasMore: hasMore,
4811
- images: images,
4812
- loadMore: loadMore,
4809
+ if (isLoading) {
4810
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
4811
+ className: "flex justify-around",
4812
+ children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
4813
+ });
4814
+ }
4815
+ return /*#__PURE__*/require$$0.createElement(InfiniteScroller, {
4813
4816
  setSelectedImage: setSelectedImage,
4817
+ hasMore: hasNextPage,
4818
+ images: results,
4819
+ key: debouncedQuery,
4820
+ loadMore: fetchNextPage,
4814
4821
  tab: TABS[0].key
4815
4822
  });
4816
4823
  };
@@ -4836,18 +4843,36 @@ var unsplashApi = {
4836
4843
  getUnsplashImage: getUnsplashImage
4837
4844
  };
4838
4845
 
4846
+ 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; }
4847
+ 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$3(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; }
4839
4848
  var UNSPLASH_LIST = QUERY_KEYS.UNSPLASH_LIST;
4840
4849
  var useFetchUnsplashImages = function useFetchUnsplashImages(_ref) {
4841
- var pageNo = _ref.pageNo,
4842
- query = _ref.query;
4850
+ var query = _ref.query;
4843
4851
  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
4844
- return reactQuery.useQuery([UNSPLASH_LIST], function () {
4845
- return unsplashApi.searchUnsplashImages({
4846
- pageNo: pageNo,
4852
+ return reactQuery.useInfiniteQuery(_objectSpread$2({
4853
+ queryKey: [UNSPLASH_LIST, {
4847
4854
  query: query
4848
- });
4849
- }, ramda.mergeRight({
4850
- staleTime: UNSPLASH_STALE_TIME
4855
+ }],
4856
+ queryFn: function queryFn(_ref2) {
4857
+ var _ref2$pageParam = _ref2.pageParam,
4858
+ pageParam = _ref2$pageParam === void 0 ? 1 : _ref2$pageParam;
4859
+ return unsplashApi.searchUnsplashImages({
4860
+ pageNo: pageParam,
4861
+ query: query
4862
+ });
4863
+ },
4864
+ initialPageParam: 1,
4865
+ getNextPageParam: function getNextPageParam(lastPage, _, lastPageParam) {
4866
+ return lastPageParam < lastPage.totalPages ? lastPageParam + 1 : null;
4867
+ },
4868
+ select: function select(data) {
4869
+ var results = data.pages.flatMap(ramda.prop("results"));
4870
+ return {
4871
+ results: results
4872
+ };
4873
+ },
4874
+ staleTime: UNSPLASH_STALE_TIME,
4875
+ placeholderData: reactQuery.keepPreviousData
4851
4876
  }, options));
4852
4877
  };
4853
4878
 
@@ -4894,37 +4919,12 @@ var uploadWithImageKit = function uploadWithImageKit(file) {
4894
4919
  };
4895
4920
 
4896
4921
  var UnsplashLibrary = function UnsplashLibrary(_ref) {
4897
- var query = _ref.query,
4898
- debouncedQuery = _ref.debouncedQuery,
4922
+ var debouncedQuery = _ref.debouncedQuery,
4899
4923
  setSelectedImage = _ref.setSelectedImage,
4900
4924
  setIsUploading = _ref.setIsUploading,
4901
4925
  setActiveTab = _ref.setActiveTab;
4902
- var _useState = React.useState(true),
4903
- _useState2 = _slicedToArray$2(_useState, 2),
4904
- hasMore = _useState2[0],
4905
- setHasMore = _useState2[1];
4906
- var _useState3 = React.useState([]),
4907
- _useState4 = _slicedToArray$2(_useState3, 2),
4908
- images = _useState4[0],
4909
- setImages = _useState4[1];
4910
- var _useState5 = React.useState(1),
4911
- _useState6 = _slicedToArray$2(_useState5, 2),
4912
- pageNo = _useState6[0],
4913
- setPageNo = _useState6[1];
4914
- var _useState7 = React.useState(false),
4915
- _useState8 = _slicedToArray$2(_useState7, 2),
4916
- error = _useState8[0],
4917
- setError = _useState8[1];
4918
- var onSuccess = function onSuccess(_ref2) {
4919
- var _ref2$results = _ref2.results,
4920
- results = _ref2$results === void 0 ? [] : _ref2$results,
4921
- totalPages = _ref2.totalPages;
4922
- ramda.equals(pageNo, 1) ? setImages(results) : setImages(ramda.concat(ramda.__, results));
4923
- setPageNo(ramda.inc);
4924
- setHasMore(pageNo < totalPages);
4925
- };
4926
4926
  var handleUnsplashImageSelect = /*#__PURE__*/function () {
4927
- var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(image) {
4927
+ var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(image) {
4928
4928
  var _image$urls, response, file, result;
4929
4929
  return _regeneratorRuntime.wrap(function _callee$(_context) {
4930
4930
  while (1) switch (_context.prev = _context.next) {
@@ -4974,49 +4974,42 @@ var UnsplashLibrary = function UnsplashLibrary(_ref) {
4974
4974
  }, _callee, null, [[0, 19, 23, 26]]);
4975
4975
  }));
4976
4976
  return function handleUnsplashImageSelect(_x) {
4977
- return _ref3.apply(this, arguments);
4977
+ return _ref2.apply(this, arguments);
4978
4978
  };
4979
4979
  }();
4980
- var onError = function onError() {
4981
- return setError(true);
4982
- };
4983
4980
  var _useTranslation = reactI18next.useTranslation(),
4984
4981
  t = _useTranslation.t;
4985
4982
  var _useFetchUnsplashImag = useFetchUnsplashImages({
4986
- query: debouncedQuery,
4987
- pageNo: pageNo
4988
- }, {
4989
- onSuccess: onSuccess,
4990
- onError: onError
4983
+ query: debouncedQuery
4991
4984
  }),
4992
- refetch = _useFetchUnsplashImag.refetch,
4993
- isFetching = _useFetchUnsplashImag.isFetching;
4994
- var loadMore = reactUtils.useFuncDebounce(function () {
4995
- if (isFetching || !hasMore) return;
4996
- if (pageNo > 1) {
4997
- setError(false);
4998
- refetch();
4999
- }
5000
- }, 500);
5001
- React.useEffect(function () {
5002
- setPageNo(1);
5003
- }, [query]);
5004
- React.useEffect(function () {
5005
- setPageNo(1);
5006
- setImages([]);
5007
- refetch();
5008
- }, [debouncedQuery]);
5009
- if (error) {
5010
- return /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
4985
+ fetchNextPage = _useFetchUnsplashImag.fetchNextPage,
4986
+ hasNextPage = _useFetchUnsplashImag.hasNextPage,
4987
+ _useFetchUnsplashImag2 = _useFetchUnsplashImag.data,
4988
+ _useFetchUnsplashImag3 = _useFetchUnsplashImag2 === void 0 ? {} : _useFetchUnsplashImag2,
4989
+ _useFetchUnsplashImag4 = _useFetchUnsplashImag3.results,
4990
+ results = _useFetchUnsplashImag4 === void 0 ? [] : _useFetchUnsplashImag4,
4991
+ isError = _useFetchUnsplashImag.isError,
4992
+ isLoading = _useFetchUnsplashImag.isLoading;
4993
+ if (isError) {
4994
+ return /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
5011
4995
  className: "mt-9 flex justify-center",
5012
- style: "body2"
5013
- }, t("neetoImageUploader.unsplash.errorMessage"));
4996
+ style: "body2",
4997
+ children: t("neetoImageUploader.unsplash.errorMessage")
4998
+ });
4999
+ }
5000
+ if (isLoading) {
5001
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
5002
+ className: "flex justify-around",
5003
+ children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
5004
+ });
5014
5005
  }
5015
- return /*#__PURE__*/React__default["default"].createElement(InfiniteScroller, {
5006
+ return /*#__PURE__*/require$$0.createElement(InfiniteScroller, {
5007
+ debouncedQuery: debouncedQuery,
5016
5008
  handleUnsplashImageSelect: handleUnsplashImageSelect,
5017
- hasMore: hasMore,
5018
- images: images,
5019
- loadMore: loadMore,
5009
+ hasMore: hasNextPage,
5010
+ images: results,
5011
+ key: debouncedQuery,
5012
+ loadMore: fetchNextPage,
5020
5013
  tab: TABS[1].key
5021
5014
  });
5022
5015
  };
@@ -5026,7 +5019,7 @@ var ImageLibrary = function ImageLibrary(_ref) {
5026
5019
  tab = _ref.tab,
5027
5020
  setIsUploading = _ref.setIsUploading,
5028
5021
  setActiveTab = _ref.setActiveTab;
5029
- var _useState = React.useState(""),
5022
+ var _useState = require$$0.useState(""),
5030
5023
  _useState2 = _slicedToArray$2(_useState, 2),
5031
5024
  query = _useState2[0],
5032
5025
  setQuery = _useState2[1];
@@ -5034,36 +5027,39 @@ var ImageLibrary = function ImageLibrary(_ref) {
5034
5027
  t = _useTranslation.t;
5035
5028
  var debouncedQuery = reactUtils.useDebounce(query, 400);
5036
5029
  var inputPlaceHolder = ramda.equals(tab, TABS[1].key) ? t("neetoImageUploader.placeholders.searchImageFromWeb") : t("neetoImageUploader.placeholders.searchImage");
5037
- React.useEffect(function () {
5030
+ require$$0.useEffect(function () {
5038
5031
  setQuery("");
5039
5032
  }, [tab]);
5040
- return /*#__PURE__*/React__default["default"].createElement("div", {
5041
- className: "w-full pb-2 pl-6 pt-1"
5042
- }, /*#__PURE__*/React__default["default"].createElement(Input__default["default"], {
5043
- autoFocus: true,
5044
- className: "mb-4 mr-6",
5045
- "data-cy": "niu-unsplash-image-picker-search-input",
5046
- name: "text",
5047
- placeholder: inputPlaceHolder,
5048
- value: query,
5049
- onChange: function onChange(_ref2) {
5050
- var value = _ref2.target.value;
5051
- return setQuery(value);
5052
- }
5053
- }), tab === TABS[0].key ? /*#__PURE__*/React__default["default"].createElement(Images, {
5054
- debouncedQuery: debouncedQuery,
5055
- query: query,
5056
- setSelectedImage: setSelectedImage
5057
- }) : /*#__PURE__*/React__default["default"].createElement(UnsplashLibrary, {
5058
- debouncedQuery: debouncedQuery,
5059
- query: query,
5060
- setActiveTab: setActiveTab,
5061
- setIsUploading: setIsUploading,
5062
- setSelectedImage: setSelectedImage
5063
- }));
5033
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
5034
+ className: "w-full pb-2 pl-6 pt-1",
5035
+ children: [/*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
5036
+ autoFocus: true,
5037
+ className: "mb-4 mr-6",
5038
+ "data-cy": "niu-unsplash-image-picker-search-input",
5039
+ name: "text",
5040
+ placeholder: inputPlaceHolder,
5041
+ value: query,
5042
+ onChange: function onChange(_ref2) {
5043
+ var value = _ref2.target.value;
5044
+ return setQuery(value);
5045
+ }
5046
+ }), tab === TABS[0].key ? /*#__PURE__*/jsxRuntime.jsx(Images, {
5047
+ debouncedQuery: debouncedQuery,
5048
+ query: query,
5049
+ setSelectedImage: setSelectedImage
5050
+ }) : /*#__PURE__*/jsxRuntime.jsx(UnsplashLibrary, {
5051
+ debouncedQuery: debouncedQuery,
5052
+ query: query,
5053
+ setActiveTab: setActiveTab,
5054
+ setIsUploading: setIsUploading,
5055
+ setSelectedImage: setSelectedImage
5056
+ })]
5057
+ });
5064
5058
  };
5065
5059
 
5066
5060
  var _excluded$1 = ["key"];
5061
+ 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; }
5062
+ 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$3(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; }
5067
5063
  var Modal = function Modal(_ref) {
5068
5064
  var isOpen = _ref.isOpen,
5069
5065
  _ref$onClose = _ref.onClose,
@@ -5074,15 +5070,15 @@ var Modal = function Modal(_ref) {
5074
5070
  uploadConfig = _ref$uploadConfig === void 0 ? {} : _ref$uploadConfig,
5075
5071
  _ref$fixedAspectRatio = _ref.fixedAspectRatio,
5076
5072
  fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio;
5077
- var _useState = React.useState(TABS[0].key),
5073
+ var _useState = require$$0.useState(TABS[0].key),
5078
5074
  _useState2 = _slicedToArray$2(_useState, 2),
5079
5075
  activeTab = _useState2[0],
5080
5076
  setActiveTab = _useState2[1];
5081
- var _useState3 = React.useState({}),
5077
+ var _useState3 = require$$0.useState({}),
5082
5078
  _useState4 = _slicedToArray$2(_useState3, 2),
5083
5079
  selectedImage = _useState4[0],
5084
5080
  setSelectedImage = _useState4[1];
5085
- var _useState5 = React.useState(false),
5081
+ var _useState5 = require$$0.useState(false),
5086
5082
  _useState6 = _slicedToArray$2(_useState5, 2),
5087
5083
  isUploading = _useState6[0],
5088
5084
  setIsUploading = _useState6[1];
@@ -5143,82 +5139,102 @@ var Modal = function Modal(_ref) {
5143
5139
  key: "local",
5144
5140
  onClick: openFileUploadDialog
5145
5141
  }]);
5146
- React.useEffect(function () {
5142
+ require$$0.useEffect(function () {
5147
5143
  setActiveTab(TABS[0].key);
5148
5144
  }, [isOpen]);
5149
- return /*#__PURE__*/React__default["default"].createElement(NeetoUIModal__default["default"], {
5145
+ return /*#__PURE__*/jsxRuntime.jsxs(NeetoUIModal__default["default"], {
5150
5146
  isOpen: isOpen,
5151
5147
  className: "niu-modal",
5152
5148
  size: "large",
5153
- onClose: handleCloseModal
5154
- }, isUploading && /*#__PURE__*/React__default["default"].createElement("div", {
5155
- className: "neeto-ui-bg-gray-400 absolute inset-0 z-50 flex h-full items-center justify-center opacity-50"
5156
- }, /*#__PURE__*/React__default["default"].createElement(Spinner__default["default"], null)), isNilOrEmpty(selectedImage) && isDragActive && /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
5157
- className: "neeto-ui-rounded-xl neeto-ui-bg-gray-400 absolute flex h-full w-full flex-col items-center justify-around border-4 border-dashed border-gray-900 opacity-40"
5158
- }, getRootProps()), /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], null, t("neetoImageUploader.common.dropHere"))), !isNilOrEmpty(selectedImage) ? /*#__PURE__*/React__default["default"].createElement(ImageEditor, {
5159
- fixedAspectRatio: fixedAspectRatio,
5160
- handleImageEditComplete: handleImageEditComplete,
5161
- handleReset: function handleReset() {
5162
- return setSelectedImage({});
5163
- },
5164
- image: selectedImage,
5165
- signedId: selectedImage === null || selectedImage === void 0 ? void 0 : selectedImage.signedId
5166
- }) : /*#__PURE__*/React__default["default"].createElement("div", _extends$1({
5167
- className: "h-full flex-col"
5168
- }, getRootProps({
5169
- onClick: function onClick(event) {
5170
- return event.stopPropagation();
5171
- }
5172
- })), /*#__PURE__*/React__default["default"].createElement(NeetoUIModal__default["default"].Header, null, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
5173
- style: "h2"
5174
- }, t("neetoImageUploader.common.imageLibrary"))), /*#__PURE__*/React__default["default"].createElement("div", {
5175
- className: "px-6 py-2"
5176
- }, /*#__PURE__*/React__default["default"].createElement("div", {
5177
- className: "flex flex-col items-center justify-between gap-2 sm:flex-row"
5178
- }, /*#__PURE__*/React__default["default"].createElement("div", {
5179
- className: "flex gap-2"
5180
- }, /*#__PURE__*/React__default["default"].createElement(Tab__default["default"], {
5181
- size: "small"
5182
- }, TABS.map(function (tab) {
5183
- return /*#__PURE__*/React__default["default"].createElement(Tab__default["default"].Item, {
5184
- active: activeTab === tab.key,
5185
- "data-cy": tab.dataCy,
5186
- key: tab.key,
5187
- onClick: function onClick() {
5188
- return setActiveTab(tab.key);
5189
- }
5190
- }, tab.label);
5191
- }))), /*#__PURE__*/React__default["default"].createElement("div", {
5192
- className: "flex gap-2"
5193
- }, options.map(function (_ref2) {
5194
- var key = _ref2.key,
5195
- otherProps = _objectWithoutProperties$2(_ref2, _excluded$1);
5196
- return /*#__PURE__*/React__default["default"].createElement(Button__default["default"], _extends$1({}, otherProps, {
5197
- key: key,
5198
- size: "small"
5199
- }));
5200
- })))), /*#__PURE__*/React__default["default"].createElement(ImageLibrary, {
5201
- setActiveTab: setActiveTab,
5202
- setIsUploading: setIsUploading,
5203
- setSelectedImage: setSelectedImage,
5204
- tab: activeTab
5205
- }), ramda.equals(activeTab, TABS[1].key) && /*#__PURE__*/React__default["default"].createElement(NeetoUIModal__default["default"].Footer, {
5206
- className: "flex items-center justify-center gap-2"
5207
- }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
5208
- style: "body2"
5209
- }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
5210
- i18nKey: "neetoImageUploader.unsplash.poweredByUnsplash",
5211
- components: {
5212
- a: /*#__PURE__*/React__default["default"].createElement("a", {
5213
- href: UNSPLASH_URL,
5214
- rel: "noreferrer",
5215
- target: "_blank"
5149
+ onClose: handleCloseModal,
5150
+ children: [isUploading && /*#__PURE__*/jsxRuntime.jsx("div", {
5151
+ className: "neeto-ui-bg-gray-400 absolute inset-0 z-50 flex h-full items-center justify-center opacity-50",
5152
+ children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
5153
+ }), isNilOrEmpty(selectedImage) && isDragActive && /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread$1(_objectSpread$1({
5154
+ className: "neeto-ui-rounded-xl neeto-ui-bg-gray-400 absolute flex h-full w-full flex-col items-center justify-around border-4 border-dashed border-gray-900 opacity-40"
5155
+ }, getRootProps()), {}, {
5156
+ children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
5157
+ children: t("neetoImageUploader.common.dropHere")
5216
5158
  })
5217
- }
5218
- })))), /*#__PURE__*/React__default["default"].createElement("input", getInputProps()));
5159
+ })), !isNilOrEmpty(selectedImage) ? /*#__PURE__*/jsxRuntime.jsx(ImageEditor, {
5160
+ fixedAspectRatio: fixedAspectRatio,
5161
+ handleImageEditComplete: handleImageEditComplete,
5162
+ handleReset: function handleReset() {
5163
+ return setSelectedImage({});
5164
+ },
5165
+ image: selectedImage,
5166
+ signedId: selectedImage === null || selectedImage === void 0 ? void 0 : selectedImage.signedId
5167
+ }) : /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread$1(_objectSpread$1({
5168
+ className: "h-full flex-col"
5169
+ }, getRootProps({
5170
+ onClick: function onClick(event) {
5171
+ return event.stopPropagation();
5172
+ }
5173
+ })), {}, {
5174
+ children: [/*#__PURE__*/jsxRuntime.jsx(NeetoUIModal__default["default"].Header, {
5175
+ children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
5176
+ style: "h2",
5177
+ children: t("neetoImageUploader.common.imageLibrary")
5178
+ })
5179
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
5180
+ className: "px-6 py-2",
5181
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
5182
+ className: "flex flex-col items-center justify-between gap-2 sm:flex-row",
5183
+ children: [/*#__PURE__*/jsxRuntime.jsx("div", {
5184
+ className: "flex gap-2",
5185
+ children: /*#__PURE__*/jsxRuntime.jsx(Tab__default["default"], {
5186
+ size: "small",
5187
+ children: TABS.map(function (tab) {
5188
+ return /*#__PURE__*/jsxRuntime.jsx(Tab__default["default"].Item, {
5189
+ active: activeTab === tab.key,
5190
+ "data-cy": tab.dataCy,
5191
+ onClick: function onClick() {
5192
+ return setActiveTab(tab.key);
5193
+ },
5194
+ children: tab.label
5195
+ }, tab.key);
5196
+ })
5197
+ })
5198
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
5199
+ className: "flex gap-2",
5200
+ children: options.map(function (_ref2) {
5201
+ var key = _ref2.key,
5202
+ otherProps = _objectWithoutProperties$2(_ref2, _excluded$1);
5203
+ return /*#__PURE__*/require$$0.createElement(Button__default["default"], _objectSpread$1(_objectSpread$1({}, otherProps), {}, {
5204
+ key: key,
5205
+ size: "small"
5206
+ }));
5207
+ })
5208
+ })]
5209
+ })
5210
+ }), /*#__PURE__*/jsxRuntime.jsx(ImageLibrary, {
5211
+ setActiveTab: setActiveTab,
5212
+ setIsUploading: setIsUploading,
5213
+ setSelectedImage: setSelectedImage,
5214
+ tab: activeTab
5215
+ }), ramda.equals(activeTab, TABS[1].key) && /*#__PURE__*/jsxRuntime.jsx(NeetoUIModal__default["default"].Footer, {
5216
+ className: "flex items-center justify-center gap-2",
5217
+ children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
5218
+ style: "body2",
5219
+ children: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
5220
+ i18nKey: "neetoImageUploader.unsplash.poweredByUnsplash",
5221
+ components: {
5222
+ a: /*#__PURE__*/jsxRuntime.jsx("a", {
5223
+ href: UNSPLASH_URL,
5224
+ rel: "noreferrer",
5225
+ target: "_blank"
5226
+ })
5227
+ }
5228
+ })
5229
+ })
5230
+ })]
5231
+ })), /*#__PURE__*/jsxRuntime.jsx("input", _objectSpread$1({}, getInputProps()))]
5232
+ });
5219
5233
  };
5220
5234
 
5221
5235
  var _excluded = ["key", "label"];
5236
+ 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; }
5237
+ 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$3(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; }
5222
5238
  var Menu = Dropdown__default["default"].Menu,
5223
5239
  MenuItem = Dropdown__default["default"].MenuItem;
5224
5240
  var ImageUploader = function ImageUploader(_ref) {
@@ -5232,11 +5248,11 @@ var ImageUploader = function ImageUploader(_ref) {
5232
5248
  uploadConfig = _ref$uploadConfig === void 0 ? {} : _ref$uploadConfig,
5233
5249
  _ref$fixedAspectRatio = _ref.fixedAspectRatio,
5234
5250
  fixedAspectRatio = _ref$fixedAspectRatio === void 0 ? {} : _ref$fixedAspectRatio;
5235
- var _useState = React.useState(false),
5251
+ var _useState = require$$0.useState(false),
5236
5252
  _useState2 = _slicedToArray$2(_useState, 2),
5237
5253
  isAssetLibraryOpen = _useState2[0],
5238
5254
  setIsAssetLibraryOpen = _useState2[1];
5239
- var _useState3 = React.useState({
5255
+ var _useState3 = require$$0.useState({
5240
5256
  url: src
5241
5257
  }),
5242
5258
  _useState4 = _slicedToArray$2(_useState3, 2),
@@ -5317,53 +5333,58 @@ var ImageUploader = function ImageUploader(_ref) {
5317
5333
  onClick: handleDelete,
5318
5334
  "data-cy": "image-uploader-remove-button"
5319
5335
  }];
5320
- return /*#__PURE__*/React__default["default"].createElement("div", {
5336
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
5321
5337
  className: classnames__default["default"](className, {
5322
5338
  "cursor-pointer": true
5323
- })
5324
- }, isNotNilOrEmpty(image.url) ? /*#__PURE__*/React__default["default"].createElement("div", {
5325
- className: IMAGE_WRAPPER_CLASSNAME,
5326
- "data-cy": "image-uploader-wrapper"
5327
- }, /*#__PURE__*/React__default["default"].createElement(ImageWithFallback, {
5328
- className: "h-full w-full",
5329
- "data-cy": "uploaded-image",
5330
- src: image.url
5331
- }), /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"], {
5332
- buttonProps: {
5333
- className: "absolute right-3 top-3"
5334
- },
5335
- buttonSize: "small",
5336
- buttonStyle: "primary",
5337
- icon: neetoIcons.MenuHorizontal
5338
- }, /*#__PURE__*/React__default["default"].createElement(Menu, null, options.map(function (_ref2) {
5339
- var key = _ref2.key,
5340
- label = _ref2.label,
5341
- otherProps = _objectWithoutProperties$2(_ref2, _excluded);
5342
- return /*#__PURE__*/React__default["default"].createElement(MenuItem.Button, _extends$1({}, otherProps, {
5343
- key: key
5344
- }), label);
5345
- })))) : /*#__PURE__*/React__default["default"].createElement(ImageDirectUpload, {
5346
- setIsAssetLibraryOpen: setIsAssetLibraryOpen,
5347
- isDisabled: neetoCist.isPresent(fixedAspectRatio),
5348
- uploadConfig: uploadConfigWithDefaults,
5349
- onDrop: uploadFile
5350
- }), /*#__PURE__*/React__default["default"].createElement(Modal, {
5351
- fixedAspectRatio: fixedAspectRatio,
5352
- isOpen: isAssetLibraryOpen,
5353
- uploadConfig: uploadConfigWithDefaults,
5354
- onClose: function onClose() {
5355
- return setIsAssetLibraryOpen(false);
5356
- },
5357
- onUploadComplete: handleImageSelectionFromLibrary
5358
- }));
5339
+ }),
5340
+ children: [isNotNilOrEmpty(image.url) ? /*#__PURE__*/jsxRuntime.jsxs("div", {
5341
+ className: IMAGE_WRAPPER_CLASSNAME,
5342
+ "data-cy": "image-uploader-wrapper",
5343
+ children: [/*#__PURE__*/jsxRuntime.jsx(ImageWithFallback, {
5344
+ className: "h-full w-full",
5345
+ "data-cy": "uploaded-image",
5346
+ src: image.url
5347
+ }), /*#__PURE__*/jsxRuntime.jsx(Dropdown__default["default"], {
5348
+ buttonProps: {
5349
+ className: "absolute right-3 top-3"
5350
+ },
5351
+ buttonSize: "small",
5352
+ buttonStyle: "primary",
5353
+ icon: neetoIcons.MenuHorizontal,
5354
+ children: /*#__PURE__*/jsxRuntime.jsx(Menu, {
5355
+ children: options.map(function (_ref2) {
5356
+ var key = _ref2.key,
5357
+ label = _ref2.label,
5358
+ otherProps = _objectWithoutProperties$2(_ref2, _excluded);
5359
+ return /*#__PURE__*/require$$0.createElement(MenuItem.Button, _objectSpread(_objectSpread({}, otherProps), {}, {
5360
+ key: key
5361
+ }), label);
5362
+ })
5363
+ })
5364
+ })]
5365
+ }) : /*#__PURE__*/jsxRuntime.jsx(ImageDirectUpload, {
5366
+ setIsAssetLibraryOpen: setIsAssetLibraryOpen,
5367
+ isDisabled: neetoCist.isPresent(fixedAspectRatio),
5368
+ uploadConfig: uploadConfigWithDefaults,
5369
+ onDrop: uploadFile
5370
+ }), /*#__PURE__*/jsxRuntime.jsx(Modal, {
5371
+ fixedAspectRatio: fixedAspectRatio,
5372
+ isOpen: isAssetLibraryOpen,
5373
+ uploadConfig: uploadConfigWithDefaults,
5374
+ onClose: function onClose() {
5375
+ return setIsAssetLibraryOpen(false);
5376
+ },
5377
+ onUploadComplete: handleImageSelectionFromLibrary
5378
+ })]
5379
+ });
5359
5380
  };
5360
5381
 
5361
5382
  var useImageUpload = function useImageUpload() {
5362
- var _useState = React.useState(0),
5383
+ var _useState = require$$0.useState(0),
5363
5384
  _useState2 = _slicedToArray$2(_useState, 2),
5364
5385
  uploadProgress = _useState2[0],
5365
5386
  setUploadProgress = _useState2[1];
5366
- var _useState3 = React.useState(false),
5387
+ var _useState3 = require$$0.useState(false),
5367
5388
  _useState4 = _slicedToArray$2(_useState3, 2),
5368
5389
  isUploading = _useState4[0],
5369
5390
  setIsUploading = _useState4[1];
@@ -5504,11 +5525,11 @@ var useImageUpload = function useImageUpload() {
5504
5525
  var useProfileImageUpload = function useProfileImageUpload(_ref) {
5505
5526
  var _ref$uploadConfig = _ref.uploadConfig,
5506
5527
  uploadConfig = _ref$uploadConfig === void 0 ? {} : _ref$uploadConfig;
5507
- var _useState = React.useState(0),
5528
+ var _useState = require$$0.useState(0),
5508
5529
  _useState2 = _slicedToArray$2(_useState, 2),
5509
5530
  uploadProgress = _useState2[0],
5510
5531
  setUploadProgress = _useState2[1];
5511
- var _useState3 = React.useState(false),
5532
+ var _useState3 = require$$0.useState(false),
5512
5533
  _useState4 = _slicedToArray$2(_useState3, 2),
5513
5534
  isUploading = _useState4[0],
5514
5535
  setIsUploading = _useState4[1];