@webiny/ui 5.40.0-beta.2 → 5.40.0-beta.3

package/ImageUpload/Image.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_classnames","_roundAdd_photo_alternate24px","_roundClose24px","_roundEdit24px","_Typography","_Progress","_styled","Image","_React$Component","_inherits2","default","_super","_createSuper2","_classCallCheck2","apply","arguments","_createClass2","key","value","renderBlank","_this$props","props","uploadImage","round","ImageWrapper","AddImageWrapperRound","AddImageWrapper","createElement","onClick","AddImageIconWrapper","ReactComponent","Typography","use","placeholder","renderImg","_this$props2","removeImage","editImage","renderImagePreview","imagePreviewProps","src","style","width","height","imagePreview","ImagePreviewWrapper","RemoveImage","EditImage","render","_this$props3","disabled","containerStyle","className","classNames","loading","CircularProgress","React","Component","_defineProperty2","_default","exports"],"sources":["Image.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { ReactComponent as AddImageIcon } from \"./icons/round-add_photo_alternate-24px.svg\";\nimport { ReactComponent as RemoveImageIcon } from \"./icons/round-close-24px.svg\";\nimport { ReactComponent as EditImageIcon } from \"./icons/round-edit-24px.svg\";\nimport { Typography } from \"../Typography\";\nimport { CircularProgress } from \"../Progress\";\nimport {\n    AddImageIconWrapper,\n    AddImageWrapper,\n    AddImageWrapperRound,\n    EditImage,\n    ImagePreviewWrapper,\n    RemoveImage\n} from \"./styled\";\nimport { BrowseFilesParams } from \"react-butterfiles\";\n\ninterface ImageProps {\n    uploadImage: () => void;\n    removeImage?: (value: string | null) => void;\n    editImage?: (value: BrowseFilesParams | undefined) => void;\n    value?: any;\n    disabled?: boolean;\n    loading?: boolean;\n    placeholder: string;\n    style?: React.CSSProperties;\n    renderImagePreview?: (props: any) => React.ReactElement<any>;\n    round?: boolean;\n    containerStyle?: React.CSSProperties;\n}\n\nclass Image extends React.Component<ImageProps> {\n    static defaultProps = {\n        placeholder: \"Select an image\",\n        containerStyle: { height: \"100%\" }\n    };\n\n    renderBlank() {\n        const { uploadImage, round } = this.props;\n\n        const ImageWrapper = round ? AddImageWrapperRound : AddImageWrapper;\n\n        return (\n            <ImageWrapper\n                data-role={\"select-image\"}\n                onClick={() => {\n                    uploadImage();\n                }}\n            >\n                <AddImageIconWrapper>\n                    <AddImageIcon />\n                    <Typography use={\"caption\"}>{this.props.placeholder}</Typography>\n                </AddImageIconWrapper>\n            </ImageWrapper>\n        );\n    }\n\n    renderImg() {\n        const { removeImage, editImage, uploadImage, value, renderImagePreview } = this.props;\n\n        const imagePreviewProps: any = {\n            src: value ? value.src : null,\n            style: this.props.style ? this.props.style : null,\n            onClick: () => uploadImage()\n        };\n\n        if (!imagePreviewProps.style) {\n            imagePreviewProps.style = {};\n        }\n\n        if (!imagePreviewProps.style.width && !imagePreviewProps.style.height) {\n            imagePreviewProps.style.width = \"100%\";\n            imagePreviewProps.style.height = \"100%\";\n        }\n\n        let imagePreview = null;\n        if (typeof renderImagePreview === \"function\") {\n            imagePreview = renderImagePreview(imagePreviewProps);\n        } else {\n            imagePreview = <img {...imagePreviewProps} />;\n        }\n\n        return (\n            <ImagePreviewWrapper data-testid={\"image-preview\"}>\n                {imagePreview}\n\n                {typeof removeImage === \"function\" && (\n                    <RemoveImage onClick={() => removeImage(null)} data-testid={\"remove-image\"}>\n                        <RemoveImageIcon />\n                    </RemoveImage>\n                )}\n\n                {typeof editImage === \"function\" && (\n                    <EditImage onClick={() => editImage(value)}>\n                        <EditImageIcon />\n                    </EditImage>\n                )}\n\n                <AddImageWrapper\n                    data-role={\"select-image\"}\n                    onClick={() => {\n                        uploadImage();\n                    }}\n                >\n                    <AddImageIconWrapper>\n                        <AddImageIcon />\n                        <Typography use={\"caption\"}>{this.props.placeholder}</Typography>\n                    </AddImageIconWrapper>\n                </AddImageWrapper>\n            </ImagePreviewWrapper>\n        );\n    }\n\n    public override render() {\n        const { value, disabled, containerStyle } = this.props;\n        return (\n            <div className={classNames({ disabled })} style={containerStyle}>\n                {this.props.loading && <CircularProgress />}\n                {value && value.src ? this.renderImg() : this.renderBlank()}\n            </div>\n        );\n    }\n}\n\nexport default Image;\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_classnames","_roundAdd_photo_alternate24px","_roundClose24px","_roundEdit24px","_Typography","_Progress","_styled","Image","_React$Component","_classCallCheck2","default","_callSuper2","arguments","_inherits2","_createClass2","key","value","renderBlank","_this$props","props","uploadImage","round","ImageWrapper","AddImageWrapperRound","AddImageWrapper","createElement","onClick","AddImageIconWrapper","ReactComponent","Typography","use","placeholder","renderImg","_this$props2","removeImage","editImage","renderImagePreview","imagePreviewProps","src","style","width","height","imagePreview","ImagePreviewWrapper","RemoveImage","EditImage","render","_this$props3","disabled","containerStyle","className","classNames","loading","CircularProgress","React","Component","_defineProperty2","_default","exports"],"sources":["Image.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { ReactComponent as AddImageIcon } from \"./icons/round-add_photo_alternate-24px.svg\";\nimport { ReactComponent as RemoveImageIcon } from \"./icons/round-close-24px.svg\";\nimport { ReactComponent as EditImageIcon } from \"./icons/round-edit-24px.svg\";\nimport { Typography } from \"../Typography\";\nimport { CircularProgress } from \"../Progress\";\nimport {\n    AddImageIconWrapper,\n    AddImageWrapper,\n    AddImageWrapperRound,\n    EditImage,\n    ImagePreviewWrapper,\n    RemoveImage\n} from \"./styled\";\nimport { BrowseFilesParams } from \"react-butterfiles\";\n\ninterface ImageProps {\n    uploadImage: () => void;\n    removeImage?: (value: string | null) => void;\n    editImage?: (value: BrowseFilesParams | undefined) => void;\n    value?: any;\n    disabled?: boolean;\n    loading?: boolean;\n    placeholder: string;\n    style?: React.CSSProperties;\n    renderImagePreview?: (props: any) => React.ReactElement<any>;\n    round?: boolean;\n    containerStyle?: React.CSSProperties;\n}\n\nclass Image extends React.Component<ImageProps> {\n    static defaultProps = {\n        placeholder: \"Select an image\",\n        containerStyle: { height: \"100%\" }\n    };\n\n    renderBlank() {\n        const { uploadImage, round } = this.props;\n\n        const ImageWrapper = round ? AddImageWrapperRound : AddImageWrapper;\n\n        return (\n            <ImageWrapper\n                data-role={\"select-image\"}\n                onClick={() => {\n                    uploadImage();\n                }}\n            >\n                <AddImageIconWrapper>\n                    <AddImageIcon />\n                    <Typography use={\"caption\"}>{this.props.placeholder}</Typography>\n                </AddImageIconWrapper>\n            </ImageWrapper>\n        );\n    }\n\n    renderImg() {\n        const { removeImage, editImage, uploadImage, value, renderImagePreview } = this.props;\n\n        const imagePreviewProps: any = {\n            src: value ? value.src : null,\n            style: this.props.style ? this.props.style : null,\n            onClick: () => uploadImage()\n        };\n\n        if (!imagePreviewProps.style) {\n            imagePreviewProps.style = {};\n        }\n\n        if (!imagePreviewProps.style.width && !imagePreviewProps.style.height) {\n            imagePreviewProps.style.width = \"100%\";\n            imagePreviewProps.style.height = \"100%\";\n        }\n\n        let imagePreview = null;\n        if (typeof renderImagePreview === \"function\") {\n            imagePreview = renderImagePreview(imagePreviewProps);\n        } else {\n            imagePreview = <img {...imagePreviewProps} />;\n        }\n\n        return (\n            <ImagePreviewWrapper data-testid={\"image-preview\"}>\n                {imagePreview}\n\n                {typeof removeImage === \"function\" && (\n                    <RemoveImage onClick={() => removeImage(null)} data-testid={\"remove-image\"}>\n                        <RemoveImageIcon />\n                    </RemoveImage>\n                )}\n\n                {typeof editImage === \"function\" && (\n                    <EditImage onClick={() => editImage(value)}>\n                        <EditImageIcon />\n                    </EditImage>\n                )}\n\n                <AddImageWrapper\n                    data-role={\"select-image\"}\n                    onClick={() => {\n                        uploadImage();\n                    }}\n                >\n                    <AddImageIconWrapper>\n                        <AddImageIcon />\n                        <Typography use={\"caption\"}>{this.props.placeholder}</Typography>\n                    </AddImageIconWrapper>\n                </AddImageWrapper>\n            </ImagePreviewWrapper>\n        );\n    }\n\n    public override render() {\n        const { value, disabled, containerStyle } = this.props;\n        return (\n            <div className={classNames({ disabled })} style={containerStyle}>\n                {this.props.loading && <CircularProgress />}\n                {value && value.src ? this.renderImg() : this.renderBlank()}\n            </div>\n        );\n    }\n}\n\nexport default Image;\n"],"mappings":"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","ignoreList":[]}

package/ImageUpload/ImageEditorDialog.d.ts

@@ -1,5 +1,4 @@
 import React from "react";
-import { ImageEditor } from "../ImageEditor";
 import { DialogOnClose } from "../Dialog";
 interface ImageEditorDialogProps {
     dialogZIndex?: number;
@@ -14,11 +13,5 @@ interface ImageEditorDialogProps {
     onAccept: (src: string) => void;
     "data-testid"?: string;
 }
-interface ImageEditorDialogState {
-    imageProcessing: boolean;
-}
-declare class ImageEditorDialog extends React.Component<ImageEditorDialogProps, ImageEditorDialogState> {
-    imageEditor: React.RefObject<ImageEditor>;
-    render(): JSX.Element;
-}
-export default ImageEditorDialog;
+export declare const ImageEditorDialog: (props: ImageEditorDialogProps) => React.JSX.Element;
+export {};

package/ImageUpload/ImageEditorDialog.js

@@ -1,25 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.ImageEditorDialog = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _ImageEditor = require("../ImageEditor");
 var _Tooltip = require("../Tooltip");
 var _emotion = require("emotion");
 var _Dialog = require("../Dialog");
 var _Button = require("../Button");
 var _excluded = ["src", "options", "onAccept", "open", "dialogZIndex"];
-var imageEditorDialog = /*#__PURE__*/(0, _emotion.css)({
+var imageEditorDialog = (0, _emotion.css)({
   width: "100vw",
   height: "100vh",
   ".mdc-dialog__surface": {
@@ -33,65 +29,54 @@ var imageEditorDialog = /*#__PURE__*/(0, _emotion.css)({
       paddingTop: "0 !important"
     }
   }
-}, "label:imageEditorDialog;");
-var ImageEditorDialog = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(ImageEditorDialog, _React$Component);
-  var _super = (0, _createSuper2.default)(ImageEditorDialog);
-  function ImageEditorDialog() {
-    var _this;
-    (0, _classCallCheck2.default)(this, ImageEditorDialog);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "imageEditor", /*#__PURE__*/_react.default.createRef());
-    return _this;
-  }
-  (0, _createClass2.default)(ImageEditorDialog, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var _this$props = this.props,
-        src = _this$props.src,
-        options = _this$props.options,
-        onAccept = _this$props.onAccept,
-        open = _this$props.open,
-        dialogZIndex = _this$props.dialogZIndex,
-        dialogProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
-      return /*#__PURE__*/_react.default.createElement(_Dialog.Dialog, Object.assign({
-        className: imageEditorDialog,
-        style: {
-          zIndex: dialogZIndex
-        },
-        open: open
-      }, dialogProps), open && /*#__PURE__*/_react.default.createElement(_ImageEditor.ImageEditor, {
-        ref: this.imageEditor,
-        src: src,
-        options: options
-      }, function (_ref) {
-        var render = _ref.render,
-          activeTool = _ref.activeTool;
-        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, null, render()), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogCancel, null, "Cancel"), activeTool ? /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
-          content: "Please close currently active tool.",
-          placement: "top"
-        }, /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
-          disabled: true
-        }, "Save")) : /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
-          "data-testid": "dialog-accept",
-          onClick: function onClick() {
-            var url = _this2.imageEditor.current ? _this2.imageEditor.current.getCanvasDataUrl() : "";
-            /**
-             * We are certain that ref exists.
-             */
-            onAccept(url);
-          }
-        }, "Save")));
-      }));
+});
+var ImageEditorDialog = exports.ImageEditorDialog = function ImageEditorDialog(props) {
+  var src = props.src,
+    options = props.options,
+    onAccept = props.onAccept,
+    open = props.open,
+    dialogZIndex = props.dialogZIndex,
+    dialogProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var imageEditor = /*#__PURE__*/_react.default.createRef();
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    isSaving = _useState2[0],
+    setIsSaving = _useState2[1];
+  var onSave = async function onSave() {
+    try {
+      setIsSaving(true);
+      var url = imageEditor.current ? imageEditor.current.getCanvasDataUrl() : "";
+      await onAccept(url);
+    } catch (e) {
+      console.log(e);
+    } finally {
+      setIsSaving(false);
     }
-  }]);
-  return ImageEditorDialog;
-}(_react.default.Component);
-var _default = ImageEditorDialog;
-exports.default = _default;
+  };
+  return /*#__PURE__*/_react.default.createElement(_Dialog.Dialog, Object.assign({
+    className: imageEditorDialog,
+    style: {
+      zIndex: dialogZIndex
+    },
+    open: open
+  }, dialogProps), open && /*#__PURE__*/_react.default.createElement(_ImageEditor.ImageEditor, {
+    ref: imageEditor,
+    src: src,
+    options: options
+  }, function (_ref) {
+    var render = _ref.render,
+      activeTool = _ref.activeTool;
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, null, render()), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogCancel, null, "Cancel"), activeTool ? /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
+      content: "Please close currently active tool.",
+      placement: "top"
+    }, /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
+      disabled: true
+    }, "Save")) : /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
+      "data-testid": "dialog-accept",
+      onClick: onSave,
+      disabled: isSaving
+    }, isSaving ? "Saving..." : "Save")));
+  }));
+};
 
 //# sourceMappingURL=ImageEditorDialog.js.map

package/ImageUpload/ImageEditorDialog.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_ImageEditor","_Tooltip","_emotion","_Dialog","_Button","_excluded","imageEditorDialog","css","width","height","maxWidth","maxHeight","paddingTop","ImageEditorDialog","_React$Component","_inherits2","default","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","React","createRef","_createClass2","key","value","render","_this2","_this$props","props","src","options","onAccept","open","dialogZIndex","dialogProps","_objectWithoutProperties2","createElement","Dialog","Object","assign","className","style","zIndex","ImageEditor","ref","imageEditor","_ref","activeTool","Fragment","DialogContent","DialogActions","DialogCancel","Tooltip","content","placement","ButtonPrimary","disabled","onClick","url","current","getCanvasDataUrl","Component","_default","exports"],"sources":["ImageEditorDialog.tsx"],"sourcesContent":["import React from \"react\";\nimport { ImageEditor } from \"~/ImageEditor\";\nimport { Tooltip } from \"~/Tooltip\";\nimport { css } from \"emotion\";\nimport { Dialog, DialogCancel, DialogActions, DialogContent, DialogOnClose } from \"../Dialog\";\nimport { ButtonPrimary } from \"~/Button\";\n\ninterface ImageEditorDialogProps {\n    dialogZIndex?: number;\n    onClose?: DialogOnClose;\n    open?: boolean;\n    /**\n     * We would need to drill down a lot to give correct options.\n     * TODO: figure out some other way.\n     */\n    options?: any;\n    src?: string;\n    onAccept: (src: string) => void;\n\n    // For testing purposes.\n    \"data-testid\"?: string;\n}\n\ninterface ImageEditorDialogState {\n    imageProcessing: boolean;\n}\n\nconst imageEditorDialog = css({\n    width: \"100vw\",\n    height: \"100vh\",\n    \".mdc-dialog__surface\": {\n        maxWidth: \"100% !important\",\n        maxHeight: \"100% !important\",\n        \".webiny-ui-dialog__content\": {\n            maxWidth: \"100% !important\",\n            maxHeight: \"100% !important\",\n            width: \"100vw\",\n            height: \"100vh\",\n            paddingTop: \"0 !important\"\n        }\n    }\n});\n\nclass ImageEditorDialog extends React.Component<ImageEditorDialogProps, ImageEditorDialogState> {\n    public imageEditor = React.createRef<ImageEditor>();\n\n    public override render() {\n        const { src, options, onAccept, open, dialogZIndex, ...dialogProps } = this.props;\n\n        return (\n            <Dialog\n                className={imageEditorDialog}\n                style={{ zIndex: dialogZIndex }}\n                open={open}\n                {...dialogProps}\n            >\n                {open && (\n                    <ImageEditor ref={this.imageEditor} src={src} options={options}>\n                        {({ render, activeTool }) => (\n                            <>\n                                <DialogContent>{render()}</DialogContent>\n                                <DialogActions>\n                                    <DialogCancel>Cancel</DialogCancel>\n                                    {activeTool ? (\n                                        <Tooltip\n                                            content={\"Please close currently active tool.\"}\n                                            placement={\"top\"}\n                                        >\n                                            <ButtonPrimary disabled>Save</ButtonPrimary>\n                                        </Tooltip>\n                                    ) : (\n                                        <ButtonPrimary\n                                            data-testid=\"dialog-accept\"\n                                            onClick={() => {\n                                                const url = this.imageEditor.current\n                                                    ? this.imageEditor.current.getCanvasDataUrl()\n                                                    : \"\";\n                                                /**\n                                                 * We are certain that ref exists.\n                                                 */\n                                                onAccept(url);\n                                            }}\n                                        >\n                                            Save\n                                        </ButtonPrimary>\n                                    )}\n                                </DialogActions>\n                            </>\n                        )}\n                    </ImageEditor>\n                )}\n            </Dialog>\n        );\n    }\n}\nexport default ImageEditorDialog;\n"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AAAyC,IAAAM,SAAA;AAsBzC,IAAMC,iBAAiB,gBAAG,IAAAC,YAAG,EAAC;EAC1BC,KAAK,EAAE,OAAO;EACdC,MAAM,EAAE,OAAO;EACf,sBAAsB,EAAE;IACpBC,QAAQ,EAAE,iBAAiB;IAC3BC,SAAS,EAAE,iBAAiB;IAC5B,4BAA4B,EAAE;MAC1BD,QAAQ,EAAE,iBAAiB;MAC3BC,SAAS,EAAE,iBAAiB;MAC5BH,KAAK,EAAE,OAAO;MACdC,MAAM,EAAE,OAAO;MACfG,UAAU,EAAE;IAChB;EACJ;AACJ,CAAC,6BAAC;AAAC,IAEGC,iBAAiB,0BAAAC,gBAAA;EAAA,IAAAC,UAAA,CAAAC,OAAA,EAAAH,iBAAA,EAAAC,gBAAA;EAAA,IAAAG,MAAA,OAAAC,aAAA,CAAAF,OAAA,EAAAH,iBAAA;EAAA,SAAAA,kBAAA;IAAA,IAAAM,KAAA;IAAA,IAAAC,gBAAA,CAAAJ,OAAA,QAAAH,iBAAA;IAAA,SAAAQ,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;IAAA;IAAAP,KAAA,GAAAF,MAAA,CAAAU,IAAA,CAAAC,KAAA,CAAAX,MAAA,SAAAY,MAAA,CAAAL,IAAA;IAAA,IAAAM,gBAAA,CAAAd,OAAA,MAAAe,uBAAA,CAAAf,OAAA,EAAAG,KAAA,+BACEa,cAAK,CAACC,SAAS,CAAc,CAAC;IAAA,OAAAd,KAAA;EAAA;EAAA,IAAAe,aAAA,CAAAlB,OAAA,EAAAH,iBAAA;IAAAsB,GAAA;IAAAC,KAAA,EAEnD,SAAAC,OAAA,EAAyB;MAAA,IAAAC,MAAA;MACrB,IAAAC,WAAA,GAAuE,IAAI,CAACC,KAAK;QAAzEC,GAAG,GAAAF,WAAA,CAAHE,GAAG;QAAEC,OAAO,GAAAH,WAAA,CAAPG,OAAO;QAAEC,QAAQ,GAAAJ,WAAA,CAARI,QAAQ;QAAEC,IAAI,GAAAL,WAAA,CAAJK,IAAI;QAAEC,YAAY,GAAAN,WAAA,CAAZM,YAAY;QAAKC,WAAW,OAAAC,yBAAA,CAAA/B,OAAA,EAAAuB,WAAA,EAAAlC,SAAA;MAElE,oBACIR,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC7C,OAAA,CAAA8C,MAAM,EAAAC,MAAA,CAAAC,MAAA;QACHC,SAAS,EAAE9C,iBAAkB;QAC7B+C,KAAK,EAAE;UAAEC,MAAM,EAAET;QAAa,CAAE;QAChCD,IAAI,EAAEA;MAAK,GACPE,WAAW,GAEdF,IAAI,iBACD/C,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAChD,YAAA,CAAAuD,WAAW;QAACC,GAAG,EAAE,IAAI,CAACC,WAAY;QAAChB,GAAG,EAAEA,GAAI;QAACC,OAAO,EAAEA;MAAQ,GAC1D,UAAAgB,IAAA;QAAA,IAAGrB,MAAM,GAAAqB,IAAA,CAANrB,MAAM;UAAEsB,UAAU,GAAAD,IAAA,CAAVC,UAAU;QAAA,oBAClB9D,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAAnD,MAAA,CAAAmB,OAAA,CAAA4C,QAAA,qBACI/D,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC7C,OAAA,CAAA0D,aAAa,QAAExB,MAAM,CAAC,CAAiB,CAAC,eACzCxC,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC7C,OAAA,CAAA2D,aAAa,qBACVjE,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC7C,OAAA,CAAA4D,YAAY,QAAC,QAAoB,CAAC,EAClCJ,UAAU,gBACP9D,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC/C,QAAA,CAAA+D,OAAO;UACJC,OAAO,EAAE,qCAAsC;UAC/CC,SAAS,EAAE;QAAM,gBAEjBrE,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC5C,OAAA,CAAA+D,aAAa;UAACC,QAAQ;QAAA,GAAC,MAAmB,CACtC,CAAC,gBAEVvE,MAAA,CAAAmB,OAAA,CAAAgC,aAAA,CAAC5C,OAAA,CAAA+D,aAAa;UACV,eAAY,eAAe;UAC3BE,OAAO,EAAE,SAAAA,QAAA,EAAM;YACX,IAAMC,GAAG,GAAGhC,MAAI,CAACmB,WAAW,CAACc,OAAO,GAC9BjC,MAAI,CAACmB,WAAW,CAACc,OAAO,CAACC,gBAAgB,CAAC,CAAC,GAC3C,EAAE;YACR;AAChD;AACA;YACgD7B,QAAQ,CAAC2B,GAAG,CAAC;UACjB;QAAE,GACL,MAEc,CAER,CACjB,CAAC;MAAA,CAEE,CAEb,CAAC;IAEjB;EAAC;EAAA,OAAAzD,iBAAA;AAAA,EAlD2BmB,cAAK,CAACyC,SAAS;AAAA,IAAAC,QAAA,GAoDhC7D,iBAAiB;AAAA8D,OAAA,CAAA3D,OAAA,GAAA0D,QAAA"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_ImageEditor","_Tooltip","_emotion","_Dialog","_Button","_excluded","imageEditorDialog","css","width","height","maxWidth","maxHeight","paddingTop","ImageEditorDialog","exports","props","src","options","onAccept","open","dialogZIndex","dialogProps","_objectWithoutProperties2","default","imageEditor","React","createRef","_useState","useState","_useState2","_slicedToArray2","isSaving","setIsSaving","onSave","url","current","getCanvasDataUrl","e","console","log","createElement","Dialog","Object","assign","className","style","zIndex","ImageEditor","ref","_ref","render","activeTool","Fragment","DialogContent","DialogActions","DialogCancel","Tooltip","content","placement","ButtonPrimary","disabled","onClick"],"sources":["ImageEditorDialog.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ImageEditor } from \"~/ImageEditor\";\nimport { Tooltip } from \"~/Tooltip\";\nimport { css } from \"emotion\";\nimport { Dialog, DialogCancel, DialogActions, DialogContent, DialogOnClose } from \"../Dialog\";\nimport { ButtonPrimary } from \"~/Button\";\n\ninterface ImageEditorDialogProps {\n    dialogZIndex?: number;\n    onClose?: DialogOnClose;\n    open?: boolean;\n    /**\n     * We would need to drill down a lot to give correct options.\n     * TODO: figure out some other way.\n     */\n    options?: any;\n    src?: string;\n    onAccept: (src: string) => void;\n    \"data-testid\"?: string;\n}\n\nconst imageEditorDialog = css({\n    width: \"100vw\",\n    height: \"100vh\",\n    \".mdc-dialog__surface\": {\n        maxWidth: \"100% !important\",\n        maxHeight: \"100% !important\",\n        \".webiny-ui-dialog__content\": {\n            maxWidth: \"100% !important\",\n            maxHeight: \"100% !important\",\n            width: \"100vw\",\n            height: \"100vh\",\n            paddingTop: \"0 !important\"\n        }\n    }\n});\n\nexport const ImageEditorDialog = (props: ImageEditorDialogProps) => {\n    const { src, options, onAccept, open, dialogZIndex, ...dialogProps } = props;\n    const imageEditor = React.createRef<ImageEditor>();\n    const [isSaving, setIsSaving] = useState(false);\n\n    const onSave = async () => {\n        try {\n            setIsSaving(true);\n            const url = imageEditor.current ? imageEditor.current.getCanvasDataUrl() : \"\";\n            await onAccept(url);\n        } catch (e) {\n            console.log(e);\n        } finally {\n            setIsSaving(false);\n        }\n    };\n\n    return (\n        <Dialog\n            className={imageEditorDialog}\n            style={{ zIndex: dialogZIndex }}\n            open={open}\n            {...dialogProps}\n        >\n            {open && (\n                <ImageEditor ref={imageEditor} src={src} options={options}>\n                    {({ render, activeTool }) => (\n                        <>\n                            <DialogContent>{render()}</DialogContent>\n                            <DialogActions>\n                                <DialogCancel>Cancel</DialogCancel>\n                                {activeTool ? (\n                                    <Tooltip\n                                        content={\"Please close currently active tool.\"}\n                                        placement={\"top\"}\n                                    >\n                                        <ButtonPrimary disabled>Save</ButtonPrimary>\n                                    </Tooltip>\n                                ) : (\n                                    <ButtonPrimary\n                                        data-testid=\"dialog-accept\"\n                                        onClick={onSave}\n                                        disabled={isSaving}\n                                    >\n                                        {isSaving ? \"Saving...\" : \"Save\"}\n                                    </ButtonPrimary>\n                                )}\n                            </DialogActions>\n                        </>\n                    )}\n                </ImageEditor>\n            )}\n        </Dialog>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/ImageUpload/MultiImageUpload.d.ts

@@ -37,6 +37,6 @@ declare class MultiImageUpload extends React.Component<MultiImageUploadProps, St
     handleSelectedImages: (images: Array<SelectedFile>, selectedIndex?: number) => Promise<void>;
     handleErrors: (errors: Array<FileError>) => void;
     removeImage: (image: SelectedFile) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export { MultiImageUpload };

package/ImageUpload/MultiImageUpload.js

@@ -9,9 +9,8 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _reactButterfiles = _interopRequireDefault(require("react-butterfiles"));
@@ -19,8 +18,8 @@ var _emotion = require("emotion");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _FormElementMessage = require("../FormElementMessage");
 var _Image = _interopRequireDefault(require("./Image"));
-var _ImageEditorDialog = _interopRequireDefault(require("./ImageEditorDialog"));
-var imagesStyle = /*#__PURE__*/(0, _emotion.css)({
+var _ImageEditorDialog = require("./ImageEditorDialog");
+var imagesStyle = (0, _emotion.css)({
   ".disabled": {
     opacity: 0.75,
     pointerEvents: "none"
@@ -40,21 +39,19 @@ var imagesStyle = /*#__PURE__*/(0, _emotion.css)({
       }
     }
   }
-}, "label:imagesStyle;");
+});
 
 // Do not apply editping for following image types.
 // const noImageEditorTypes = ["image/svg+xml", "image/gif"];
-var MultiImageUpload = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(MultiImageUpload, _React$Component);
-  var _super = (0, _createSuper2.default)(MultiImageUpload);
+var MultiImageUpload = exports.MultiImageUpload = /*#__PURE__*/function (_React$Component) {
   function MultiImageUpload() {
     var _this;
     (0, _classCallCheck2.default)(this, MultiImageUpload);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = (0, _callSuper2.default)(this, MultiImageUpload, [].concat(args));
+    (0, _defineProperty2.default)(_this, "state", {
       errors: undefined,
       selectedImages: {},
       loading: false,
@@ -64,14 +61,14 @@ var MultiImageUpload = /*#__PURE__*/function (_React$Component) {
         index: undefined
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", async function (value) {
+    (0, _defineProperty2.default)(_this, "onChange", async function (value) {
       var _this$props = _this.props,
         onChange = _this$props.onChange,
         validate = _this$props.validate;
       onChange && (await onChange(value));
       validate && (await validate());
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSelectedImages", async function (images) {
+    (0, _defineProperty2.default)(_this, "handleSelectedImages", async function (images) {
       var selectedIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
       _this.setState({
         errors: undefined,
@@ -104,12 +101,12 @@ var MultiImageUpload = /*#__PURE__*/function (_React$Component) {
         });
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleErrors", function (errors) {
+    (0, _defineProperty2.default)(_this, "handleErrors", function (errors) {
       _this.setState({
         errors: errors
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "removeImage", function (image) {
+    (0, _defineProperty2.default)(_this, "removeImage", function (image) {
       var _this$props2 = _this.props,
         value = _this$props2.value,
         onChange = _this$props2.onChange;
@@ -122,7 +119,8 @@ var MultiImageUpload = /*#__PURE__*/function (_React$Component) {
     });
     return _this;
   }
-  (0, _createClass2.default)(MultiImageUpload, [{
+  (0, _inherits2.default)(MultiImageUpload, _React$Component);
+  return (0, _createClass2.default)(MultiImageUpload, [{
     key: "render",
     value: function render() {
       var _this2 = this;
@@ -156,7 +154,7 @@ var MultiImageUpload = /*#__PURE__*/function (_React$Component) {
         className: (0, _classnames.default)(imagesStyle, className)
       }, label && /*#__PURE__*/_react.default.createElement("div", {
         className: "mdc-floating-label mdc-floating-label--float-above"
-      }, label), /*#__PURE__*/_react.default.createElement(_ImageEditorDialog.default, {
+      }, label), /*#__PURE__*/_react.default.createElement(_ImageEditorDialog.ImageEditorDialog, {
         options: imageEditor,
         open: this.state.imageEditor.open,
         src: imageEditorImageSrc,
@@ -267,9 +265,7 @@ var MultiImageUpload = /*#__PURE__*/function (_React$Component) {
       }))));
     }
   }]);
-  return MultiImageUpload;
 }(_react.default.Component);
-exports.MultiImageUpload = MultiImageUpload;
 (0, _defineProperty2.default)(MultiImageUpload, "defaultProps", {
   accept: ["image/jpeg", "image/png", "image/gif", "image/svg+xml"],
   maxSize: "5mb",

package/ImageUpload/MultiImageUpload.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactButterfiles","_emotion","_classnames","_FormElementMessage","_Image","_ImageEditorDialog","imagesStyle","css","opacity","pointerEvents","listStyle","li","verticalAlign","margin","display","width","height","border","cursor","textAlign","MultiImageUpload","_React$Component","_inherits2","default","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","errors","undefined","selectedImages","loading","imageEditor","open","image","index","value","_this$props","props","onChange","validate","images","selectedIndex","setState","i","_objectSpread2","newValue","isArray","_toConsumableArray2","convertedImages","push","src","base64","name","size","type","splice","_this$props2","indexOf","_createClass2","key","render","_this2","_this$props3","validation","label","description","disabled","accept","maxSize","className","imageEditorImageSrc","state","console","warn","log","_ref","validationIsValid","isValid","validationMessage","message","createElement","classNames","options","onClose","onAccept","setTimeout","imageEditorImageIndex","multiple","convertToBase64","onSuccess","files","handleSelectedImages","onError","handleErrors","_ref2","browseFiles","getDropZoneProps","map","file","removeImage","editImage","uploadImage","FormElementMessage","error","errorType","errorMessages","errorFileName","React","Component","exports","maxSizeExceeded","unsupportedFileType"],"sources":["MultiImageUpload.tsx"],"sourcesContent":["import React from \"react\";\nimport BrowseFiles, { SelectedFile, FileError } from \"react-butterfiles\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\nimport { FormElementMessage } from \"../FormElementMessage\";\nimport Image from \"./Image\";\nimport ImageEditorDialog from \"./ImageEditorDialog\";\nimport { FormComponentProps } from \"../types\";\n\nconst imagesStyle = css({\n    \".disabled\": {\n        opacity: 0.75,\n        pointerEvents: \"none\"\n    },\n    \"ul.images\": {\n        listStyle: \"none\",\n        li: {\n            verticalAlign: \"top\",\n            margin: 2,\n            display: \"inline-block\",\n            width: 150,\n            height: 150,\n            \"&:last-child\": {\n                border: \"1px solid lightgray\",\n                cursor: \"pointer\",\n                textAlign: \"center\"\n            }\n        }\n    }\n});\n\n// Do not apply editping for following image types.\n// const noImageEditorTypes = [\"image/svg+xml\", \"image/gif\"];\n\ninterface MultiImageUploadProps extends FormComponentProps {\n    // Component label.\n    label?: string;\n\n    // Is component disabled?\n    disabled?: boolean;\n\n    // Description beneath the image.\n    description?: string;\n\n    // A className for the root element.\n    className?: string;\n\n    // Define a list of accepted image types.\n    accept?: string[];\n\n    // Define file's max allowed size (default is \"5mb\").\n    // Uses \"bytes\" (https://www.npmjs.com/package/bytes) library to convert string notation to actual number.\n    maxSize: string;\n\n    // Image editor options.\n    // Please check the docs of ImageEditor component for the list of all available options.\n    imageEditor?: {\n        [key: string]: any;\n    };\n\n    // Use these to customize error messages (eg. if i18n supported is needed).\n    errorMessages: {\n        maxSizeExceeded: string;\n        unsupportedFileType: string;\n        default: string;\n    };\n\n    // Cropper options\n    cropper?: { [key: string]: any };\n}\n\ninterface State {\n    errors?: FileError[];\n    selectedImages: Record<string, any>;\n    loading: boolean;\n    imageEditor: {\n        image: SelectedFile | null;\n        open: boolean;\n        index?: number;\n    };\n}\n\nclass MultiImageUpload extends React.Component<MultiImageUploadProps, State> {\n    static defaultProps: Partial<MultiImageUploadProps> = {\n        accept: [\"image/jpeg\", \"image/png\", \"image/gif\", \"image/svg+xml\"],\n        maxSize: \"5mb\",\n        imageEditor: {},\n        errorMessages: {\n            maxSizeExceeded: \"Max size exceeded.\",\n            unsupportedFileType: \"Unsupported file type.\",\n            default: \"An error occurred.\"\n        }\n    };\n\n    public override state: State = {\n        errors: undefined,\n        selectedImages: {},\n        loading: false,\n        imageEditor: {\n            open: false,\n            image: null,\n            index: undefined\n        }\n    };\n\n    onChange = async (value: any) => {\n        const { onChange, validate } = this.props;\n        onChange && (await onChange(value));\n        validate && (await validate());\n    };\n\n    handleSelectedImages = async (images: Array<SelectedFile>, selectedIndex = 0) => {\n        this.setState(\n            {\n                errors: undefined,\n                loading: true\n            },\n            async () => {\n                const selectedImages: Record<number, any> = {};\n                for (let i = 0; i < images.length; i++) {\n                    const image = images[i];\n                    selectedImages[selectedIndex + i] = { ...image };\n                }\n\n                this.setState({ selectedImages }, async () => {\n                    const newValue = Array.isArray(this.props.value) ? [...this.props.value] : [];\n\n                    const convertedImages = [];\n                    for (let i = 0; i < images.length; i++) {\n                        const image = images[i];\n                        convertedImages.push({\n                            src: image.src.base64,\n                            name: image.name,\n                            size: image.size,\n                            type: image.type\n                        });\n                    }\n\n                    newValue.splice(selectedIndex, 0, ...convertedImages);\n                    await this.onChange(newValue);\n                    this.setState({ loading: false });\n                });\n            }\n        );\n    };\n\n    handleErrors = (errors: Array<FileError>) => {\n        this.setState({ errors });\n    };\n\n    removeImage = (image: SelectedFile) => {\n        const { value, onChange } = this.props;\n        if (!onChange) {\n            return;\n        }\n\n        const images = Array.isArray(value) ? [...value] : [];\n        images.splice(images.indexOf(image), 1);\n        onChange(images);\n    };\n\n    public override render() {\n        const {\n            value,\n            validation,\n            label,\n            description,\n            disabled,\n            imageEditor,\n            accept,\n            maxSize,\n            className\n        } = this.props;\n        /**\n         * TODO: figure out the correct type\n         */\n        let imageEditorImageSrc = \"\";\n        if (this.state.imageEditor.image) {\n            // @ts-expect-error\n            imageEditorImageSrc = this.state.imageEditor.image.src;\n            console.warn(\"Figure out correct type if this.state.imageEditor.image.src\");\n            console.log(this.state.imageEditor.image.src);\n        }\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n        /**\n         * accept can safely be cast because we have default value\n         */\n        return (\n            <div className={classNames(imagesStyle, className)}>\n                {label && (\n                    <div className=\"mdc-floating-label mdc-floating-label--float-above\">\n                        {label}\n                    </div>\n                )}\n\n                <ImageEditorDialog\n                    options={imageEditor}\n                    open={this.state.imageEditor.open}\n                    src={imageEditorImageSrc}\n                    onClose={() => {\n                        this.setState(state => {\n                            state.imageEditor.open = false;\n                            return state;\n                        });\n                    }}\n                    onAccept={src => {\n                        // We wrapped everything into setTimeout - prevents dialog freeze when larger image is selected.\n                        setTimeout(() => {\n                            this.setState({ loading: true }, async () => {\n                                const newValue = Array.isArray(this.props.value)\n                                    ? [...this.props.value]\n                                    : [];\n\n                                const imageEditorImageIndex = this.state.imageEditor\n                                    .index as number;\n                                newValue[imageEditorImageIndex].src = src;\n\n                                await this.onChange(newValue);\n                                this.setState({\n                                    loading: false,\n                                    imageEditor: {\n                                        image: null,\n                                        open: false,\n                                        index: undefined\n                                    }\n                                });\n                            });\n                        });\n                    }}\n                />\n\n                <BrowseFiles\n                    accept={accept as string[]}\n                    maxSize={maxSize}\n                    multiple\n                    convertToBase64\n                    onSuccess={files => {\n                        this.handleSelectedImages(files, Array.isArray(value) ? value.length : 0);\n                    }}\n                    onError={errors => this.handleErrors(errors)}\n                >\n                    {({ browseFiles, getDropZoneProps }) => {\n                        const images = Array.isArray(value) ? [...value] : [];\n\n                        return (\n                            <div {...getDropZoneProps({ className: classNames({ disabled }) })}>\n                                <ul className=\"images\">\n                                    {images.map((image, index) => (\n                                        <li key={index}>\n                                            <Image\n                                                loading={\n                                                    this.state.selectedImages[index] &&\n                                                    this.state.loading\n                                                }\n                                                value={image.file || image}\n                                                removeImage={() =>\n                                                    this.removeImage(image.file || image)\n                                                }\n                                                editImage={\n                                                    this.state.selectedImages[index] &&\n                                                    (() => {\n                                                        this.setState({\n                                                            imageEditor: {\n                                                                index,\n                                                                open: true,\n                                                                image: this.state.selectedImages[\n                                                                    index\n                                                                ]\n                                                            }\n                                                        });\n                                                    })\n                                                }\n                                                uploadImage={() => {\n                                                    browseFiles({\n                                                        onSuccess: files => {\n                                                            this.handleSelectedImages(\n                                                                files,\n                                                                index + 1\n                                                            );\n                                                        },\n                                                        onError: errors => this.handleErrors(errors)\n                                                    });\n                                                }}\n                                            />\n                                        </li>\n                                    ))}\n                                    <li>\n                                        <Image\n                                            disabled={this.state.loading}\n                                            uploadImage={() => {\n                                                browseFiles({\n                                                    onSuccess: files => {\n                                                        this.handleSelectedImages(\n                                                            files,\n                                                            Array.isArray(value) ? value.length : 0\n                                                        );\n                                                    },\n                                                    onError: errors => this.handleErrors(errors)\n                                                });\n                                            }}\n                                        />\n                                    </li>\n                                </ul>\n                            </div>\n                        );\n                    }}\n                </BrowseFiles>\n\n                {validationIsValid === false && (\n                    <FormElementMessage error>{validationMessage}</FormElementMessage>\n                )}\n\n                {validationIsValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n\n                {Array.isArray(this.state.errors) && (\n                    <FormElementMessage error>\n                        Your selection of images failed because of the following images:\n                        <ul>\n                            {this.state.errors.map((error: FileError, index) => {\n                                /**\n                                 * We need to cast as existing keys in errorMessages, otherwise TS throws an error\n                                 */\n                                const errorType = error.type as\n                                    | \"maxSizeExceeded\"\n                                    | \"unsupportedFileType\"\n                                    | \"default\";\n                                const message = this.props.errorMessages[errorType];\n\n                                const errorFileName = error.file ? error.file.name : \"\";\n\n                                return (\n                                    <li key={errorFileName + index}>\n                                        {index + 1}. <strong>{errorFileName}</strong> -&nbsp;\n                                        {message || this.props.errorMessages.default}\n                                    </li>\n                                );\n                            })}\n                        </ul>\n                    </FormElementMessage>\n                )}\n            </div>\n        );\n    }\n}\n\nexport { MultiImageUpload };\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactButterfiles","_emotion","_classnames","_FormElementMessage","_Image","_ImageEditorDialog","imagesStyle","css","opacity","pointerEvents","listStyle","li","verticalAlign","margin","display","width","height","border","cursor","textAlign","MultiImageUpload","exports","_React$Component","_this","_classCallCheck2","default","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","errors","undefined","selectedImages","loading","imageEditor","open","image","index","value","_this$props","props","onChange","validate","images","selectedIndex","setState","i","_objectSpread2","newValue","isArray","_toConsumableArray2","convertedImages","push","src","base64","name","size","type","splice","apply","_this$props2","indexOf","_inherits2","_createClass2","key","render","_this2","_this$props3","validation","label","description","disabled","accept","maxSize","className","imageEditorImageSrc","state","console","warn","log","_ref","validationIsValid","isValid","validationMessage","message","createElement","classNames","ImageEditorDialog","options","onClose","onAccept","setTimeout","imageEditorImageIndex","multiple","convertToBase64","onSuccess","files","handleSelectedImages","onError","handleErrors","_ref2","browseFiles","getDropZoneProps","map","file","removeImage","editImage","uploadImage","FormElementMessage","error","errorType","errorMessages","errorFileName","React","Component","maxSizeExceeded","unsupportedFileType"],"sources":["MultiImageUpload.tsx"],"sourcesContent":["import React from \"react\";\nimport BrowseFiles, { SelectedFile, FileError } from \"react-butterfiles\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\nimport { FormElementMessage } from \"../FormElementMessage\";\nimport Image from \"./Image\";\nimport { ImageEditorDialog } from \"./ImageEditorDialog\";\nimport { FormComponentProps } from \"../types\";\n\nconst imagesStyle = css({\n    \".disabled\": {\n        opacity: 0.75,\n        pointerEvents: \"none\"\n    },\n    \"ul.images\": {\n        listStyle: \"none\",\n        li: {\n            verticalAlign: \"top\",\n            margin: 2,\n            display: \"inline-block\",\n            width: 150,\n            height: 150,\n            \"&:last-child\": {\n                border: \"1px solid lightgray\",\n                cursor: \"pointer\",\n                textAlign: \"center\"\n            }\n        }\n    }\n});\n\n// Do not apply editping for following image types.\n// const noImageEditorTypes = [\"image/svg+xml\", \"image/gif\"];\n\ninterface MultiImageUploadProps extends FormComponentProps {\n    // Component label.\n    label?: string;\n\n    // Is component disabled?\n    disabled?: boolean;\n\n    // Description beneath the image.\n    description?: string;\n\n    // A className for the root element.\n    className?: string;\n\n    // Define a list of accepted image types.\n    accept?: string[];\n\n    // Define file's max allowed size (default is \"5mb\").\n    // Uses \"bytes\" (https://www.npmjs.com/package/bytes) library to convert string notation to actual number.\n    maxSize: string;\n\n    // Image editor options.\n    // Please check the docs of ImageEditor component for the list of all available options.\n    imageEditor?: {\n        [key: string]: any;\n    };\n\n    // Use these to customize error messages (eg. if i18n supported is needed).\n    errorMessages: {\n        maxSizeExceeded: string;\n        unsupportedFileType: string;\n        default: string;\n    };\n\n    // Cropper options\n    cropper?: { [key: string]: any };\n}\n\ninterface State {\n    errors?: FileError[];\n    selectedImages: Record<string, any>;\n    loading: boolean;\n    imageEditor: {\n        image: SelectedFile | null;\n        open: boolean;\n        index?: number;\n    };\n}\n\nclass MultiImageUpload extends React.Component<MultiImageUploadProps, State> {\n    static defaultProps: Partial<MultiImageUploadProps> = {\n        accept: [\"image/jpeg\", \"image/png\", \"image/gif\", \"image/svg+xml\"],\n        maxSize: \"5mb\",\n        imageEditor: {},\n        errorMessages: {\n            maxSizeExceeded: \"Max size exceeded.\",\n            unsupportedFileType: \"Unsupported file type.\",\n            default: \"An error occurred.\"\n        }\n    };\n\n    public override state: State = {\n        errors: undefined,\n        selectedImages: {},\n        loading: false,\n        imageEditor: {\n            open: false,\n            image: null,\n            index: undefined\n        }\n    };\n\n    onChange = async (value: any) => {\n        const { onChange, validate } = this.props;\n        onChange && (await onChange(value));\n        validate && (await validate());\n    };\n\n    handleSelectedImages = async (images: Array<SelectedFile>, selectedIndex = 0) => {\n        this.setState(\n            {\n                errors: undefined,\n                loading: true\n            },\n            async () => {\n                const selectedImages: Record<number, any> = {};\n                for (let i = 0; i < images.length; i++) {\n                    const image = images[i];\n                    selectedImages[selectedIndex + i] = { ...image };\n                }\n\n                this.setState({ selectedImages }, async () => {\n                    const newValue = Array.isArray(this.props.value) ? [...this.props.value] : [];\n\n                    const convertedImages = [];\n                    for (let i = 0; i < images.length; i++) {\n                        const image = images[i];\n                        convertedImages.push({\n                            src: image.src.base64,\n                            name: image.name,\n                            size: image.size,\n                            type: image.type\n                        });\n                    }\n\n                    newValue.splice(selectedIndex, 0, ...convertedImages);\n                    await this.onChange(newValue);\n                    this.setState({ loading: false });\n                });\n            }\n        );\n    };\n\n    handleErrors = (errors: Array<FileError>) => {\n        this.setState({ errors });\n    };\n\n    removeImage = (image: SelectedFile) => {\n        const { value, onChange } = this.props;\n        if (!onChange) {\n            return;\n        }\n\n        const images = Array.isArray(value) ? [...value] : [];\n        images.splice(images.indexOf(image), 1);\n        onChange(images);\n    };\n\n    public override render() {\n        const {\n            value,\n            validation,\n            label,\n            description,\n            disabled,\n            imageEditor,\n            accept,\n            maxSize,\n            className\n        } = this.props;\n        /**\n         * TODO: figure out the correct type\n         */\n        let imageEditorImageSrc = \"\";\n        if (this.state.imageEditor.image) {\n            // @ts-expect-error\n            imageEditorImageSrc = this.state.imageEditor.image.src;\n            console.warn(\"Figure out correct type if this.state.imageEditor.image.src\");\n            console.log(this.state.imageEditor.image.src);\n        }\n\n        const { isValid: validationIsValid, message: validationMessage } = validation || {};\n        /**\n         * accept can safely be cast because we have default value\n         */\n        return (\n            <div className={classNames(imagesStyle, className)}>\n                {label && (\n                    <div className=\"mdc-floating-label mdc-floating-label--float-above\">\n                        {label}\n                    </div>\n                )}\n\n                <ImageEditorDialog\n                    options={imageEditor}\n                    open={this.state.imageEditor.open}\n                    src={imageEditorImageSrc}\n                    onClose={() => {\n                        this.setState(state => {\n                            state.imageEditor.open = false;\n                            return state;\n                        });\n                    }}\n                    onAccept={src => {\n                        // We wrapped everything into setTimeout - prevents dialog freeze when larger image is selected.\n                        setTimeout(() => {\n                            this.setState({ loading: true }, async () => {\n                                const newValue = Array.isArray(this.props.value)\n                                    ? [...this.props.value]\n                                    : [];\n\n                                const imageEditorImageIndex = this.state.imageEditor\n                                    .index as number;\n                                newValue[imageEditorImageIndex].src = src;\n\n                                await this.onChange(newValue);\n                                this.setState({\n                                    loading: false,\n                                    imageEditor: {\n                                        image: null,\n                                        open: false,\n                                        index: undefined\n                                    }\n                                });\n                            });\n                        });\n                    }}\n                />\n\n                <BrowseFiles\n                    accept={accept as string[]}\n                    maxSize={maxSize}\n                    multiple\n                    convertToBase64\n                    onSuccess={files => {\n                        this.handleSelectedImages(files, Array.isArray(value) ? value.length : 0);\n                    }}\n                    onError={errors => this.handleErrors(errors)}\n                >\n                    {({ browseFiles, getDropZoneProps }) => {\n                        const images = Array.isArray(value) ? [...value] : [];\n\n                        return (\n                            <div {...getDropZoneProps({ className: classNames({ disabled }) })}>\n                                <ul className=\"images\">\n                                    {images.map((image, index) => (\n                                        <li key={index}>\n                                            <Image\n                                                loading={\n                                                    this.state.selectedImages[index] &&\n                                                    this.state.loading\n                                                }\n                                                value={image.file || image}\n                                                removeImage={() =>\n                                                    this.removeImage(image.file || image)\n                                                }\n                                                editImage={\n                                                    this.state.selectedImages[index] &&\n                                                    (() => {\n                                                        this.setState({\n                                                            imageEditor: {\n                                                                index,\n                                                                open: true,\n                                                                image: this.state.selectedImages[\n                                                                    index\n                                                                ]\n                                                            }\n                                                        });\n                                                    })\n                                                }\n                                                uploadImage={() => {\n                                                    browseFiles({\n                                                        onSuccess: files => {\n                                                            this.handleSelectedImages(\n                                                                files,\n                                                                index + 1\n                                                            );\n                                                        },\n                                                        onError: errors => this.handleErrors(errors)\n                                                    });\n                                                }}\n                                            />\n                                        </li>\n                                    ))}\n                                    <li>\n                                        <Image\n                                            disabled={this.state.loading}\n                                            uploadImage={() => {\n                                                browseFiles({\n                                                    onSuccess: files => {\n                                                        this.handleSelectedImages(\n                                                            files,\n                                                            Array.isArray(value) ? value.length : 0\n                                                        );\n                                                    },\n                                                    onError: errors => this.handleErrors(errors)\n                                                });\n                                            }}\n                                        />\n                                    </li>\n                                </ul>\n                            </div>\n                        );\n                    }}\n                </BrowseFiles>\n\n                {validationIsValid === false && (\n                    <FormElementMessage error>{validationMessage}</FormElementMessage>\n                )}\n\n                {validationIsValid !== false && description && (\n                    <FormElementMessage>{description}</FormElementMessage>\n                )}\n\n                {Array.isArray(this.state.errors) && (\n                    <FormElementMessage error>\n                        Your selection of images failed because of the following images:\n                        <ul>\n                            {this.state.errors.map((error: FileError, index) => {\n                                /**\n                                 * We need to cast as existing keys in errorMessages, otherwise TS throws an error\n                                 */\n                                const errorType = error.type as\n                                    | \"maxSizeExceeded\"\n                                    | \"unsupportedFileType\"\n                                    | \"default\";\n                                const message = this.props.errorMessages[errorType];\n\n                                const errorFileName = error.file ? error.file.name : \"\";\n\n                                return (\n                                    <li key={errorFileName + index}>\n                                        {index + 1}. <strong>{errorFileName}</strong> -&nbsp;\n                                        {message || this.props.errorMessages.default}\n                                    </li>\n                                );\n                            })}\n                        </ul>\n                    </FormElementMessage>\n                )}\n            </div>\n        );\n    }\n}\n\nexport { MultiImageUpload };\n"],"mappings":"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","ignoreList":[]}

package/ImageUpload/SingleImageUpload.d.ts

@@ -40,6 +40,6 @@ export declare class SingleImageUpload extends React.Component<SingleImageUpload
     state: State;
     handleFiles: (images: SelectedFile[]) => void;
     handleErrors: (errors: FileError[]) => void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }
 export {};