@webiny/ui 6.0.0-beta.0 → 6.0.0-rc.0

package/ImageEditor/toolbar/filter.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_filter","_Slider","_Button","_Tooltip","_debounce","_EMOTION_STRINGIFIED_CSS_ERROR__","Wrapper","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","sliders","key","min","RenderForm","_React$Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","processing","values","debounce","canvas","props","state","component","Caman","current","_this2","revert","Object","keys","forEach","render","setState","reduce","output","_inherits2","_createClass2","value","componentDidMount","resetFiltersValues","_this3","createElement","Slider","assign","max","disabled","onInput","_objectSpread2","applyFilters","style","textAlign","ButtonDefault","onClick","React","Component","tool","icon","_ref","activateTool","Tooltip","placement","content","IconButton","ReactComponent","renderForm","cancel","_ref2","_default","exports"],"sources":["filter.tsx"],"sourcesContent":["/**\n * When using Caman, we added @ts-expect-error because it does not exist in packages, but it is loaded in packages/ui/src/ImageEditor/ImageEditor.tsx:38.\n * TODO: use some other library to edit images\n */\nimport React from \"react\";\nimport { ReactComponent as FilterIcon } from \"./icons/filter.svg\";\nimport { Slider } from \"~/Slider\";\nimport { ImageEditorTool } from \"./types\";\nimport { IconButton, ButtonDefault } from \"~/Button\";\nimport { Tooltip } from \"~/Tooltip\";\nimport debounce from \"lodash/debounce\";\nimport styled from \"@emotion/styled\";\n\ninterface RenderFormState {\n    values: Record<string, any>;\n    processing: boolean;\n}\n\ninterface RenderFormProps {\n    canvas: any;\n    renderApplyCancel?: () => void;\n}\n\nconst Wrapper = styled(\"div\")({\n    ul: {\n        textAlign: \"center\",\n        li: {\n            display: \"inline-block\",\n            width: 180,\n            padding: 10\n        }\n    },\n    \".buttons\": {\n        textAlign: \"center\"\n    }\n});\n\nconst sliders = [\n    {\n        key: \"brightness\",\n        label: \"Brightness\",\n        min: -100\n    },\n    {\n        key: \"vibrance\",\n        label: \"Vibrance\",\n        min: -100\n    },\n    {\n        key: \"hue\",\n        label: \"Hue\",\n        min: -100\n    },\n    {\n        key: \"gamma\",\n        label: \"Gamma\"\n    },\n    {\n        key: \"clip\",\n        label: \"Clip\"\n    },\n    {\n        key: \"stackBlur\",\n        label: \"Blur\"\n    },\n    {\n        key: \"contrast\",\n        label: \"Contrast\",\n        min: -100\n    },\n    {\n        key: \"saturation\",\n        label: \"Saturation\",\n        min: -100\n    },\n    {\n        key: \"exposure\",\n        label: \"Exposure\",\n        min: -100\n    },\n    {\n        key: \"sepia\",\n        label: \"Sepia\"\n    },\n    {\n        key: \"noise\",\n        label: \"Noise\"\n    },\n    {\n        key: \"sharpen\",\n        label: \"Sharpen\"\n    }\n];\n\nclass RenderForm extends React.Component<RenderFormProps, RenderFormState> {\n    public override state: RenderFormState = {\n        processing: false,\n        values: {}\n    };\n\n    public override componentDidMount() {\n        this.resetFiltersValues();\n    }\n\n    private readonly applyFilters = debounce(() => {\n        const { canvas } = this.props;\n        const { values } = this.state;\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const component = this;\n\n        // @ts-expect-error\n        Caman(canvas.current, function () {\n            // @ts-expect-error\n            this.revert(false);\n            Object.keys(values).forEach(\n                // @ts-expect-error\n                key => values[key] !== 0 && this[key] && this[key](values[key])\n            );\n            // @ts-expect-error\n            this.render();\n            component.setState({ processing: false });\n        });\n    }, 200);\n\n    private readonly resetFiltersValues = () => {\n        this.setState(state => {\n            sliders.reduce((output, current) => {\n                state.values[current.key] = 0;\n                return output;\n            }, {});\n\n            return state;\n        });\n    };\n\n    public override render() {\n        return (\n            <Wrapper>\n                <ul>\n                    {sliders.map(props => (\n                        <li key={props.key}>\n                            <Slider\n                                value={this.state.values[props.key]}\n                                min={0}\n                                max={100}\n                                disabled={this.state.processing}\n                                onInput={(value: string) => {\n                                    this.setState(state => {\n                                        const values = { ...state.values };\n                                        values[props.key] = value;\n\n                                        return { ...state, processing: true, values };\n                                    }, this.applyFilters);\n                                }}\n                                {...props}\n                            />\n                        </li>\n                    ))}\n                </ul>\n\n                <div style={{ textAlign: \"center\" }}>\n                    <ButtonDefault\n                        onClick={() => {\n                            this.setState({ processing: true }, () => {\n                                this.resetFiltersValues();\n                                this.applyFilters();\n                                this.setState({ processing: false });\n                            });\n                        }}\n                    >\n                        Reset filters\n                    </ButtonDefault>\n                </div>\n            </Wrapper>\n        );\n    }\n}\n\nconst tool: ImageEditorTool = {\n    name: \"filter\",\n    icon({ activateTool }) {\n        return (\n            <Tooltip placement={\"bottom\"} content={\"Filter\"}>\n                <IconButton\n                    icon={<FilterIcon />}\n                    onClick={() => activateTool(\"filter\")}\n                    data-testid={\"filter-item\"}\n                />\n            </Tooltip>\n        );\n    },\n    renderForm(props) {\n        return <RenderForm {...props} />;\n    },\n    cancel: ({ canvas }) => {\n        // @ts-expect-error\n        Caman(canvas.current, function () {\n            // @ts-expect-error\n            this.revert(false);\n            // @ts-expect-error\n            this.render();\n        });\n    }\n};\n\nexport default tool;\n"],"mappings":"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","ignoreList":[]}

package/ImageEditor/toolbar/flip.d.ts

@@ -1,4 +0,0 @@
-import { ImageEditorTool } from "./types";
-import "cropperjs/dist/cropper.css";
-declare const tool: ImageEditorTool;
-export default tool;

package/ImageEditor/toolbar/flip.js

@@ -1,99 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _flip = require("./icons/flip.svg");
-var _cropperjs = _interopRequireDefault(require("cropperjs"));
-require("cropperjs/dist/cropper.css");
-var _Button = require("../../Button");
-var _Tooltip = require("../../Tooltip");
-var cropper;
-var flipped = {
-  x: 1,
-  y: 1
-};
-var renderForm = function renderForm() {
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      textAlign: "center"
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
-    onClick: function onClick() {
-      if (!cropper) {
-        return;
-      }
-      flipped.x = flipped.x === 1 ? -1 : 1;
-      cropper.scaleX(flipped.x);
-    }
-  }, "FlipX"), /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
-    onClick: function onClick() {
-      if (!cropper) {
-        return;
-      }
-      flipped.y = flipped.y === 1 ? -1 : 1;
-      cropper.scaleY(flipped.y);
-    }
-  }, "FlipY"));
-};
-var tool = {
-  name: "flip",
-  icon: function icon(_ref) {
-    var activateTool = _ref.activateTool;
-    return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
-      placement: "bottom",
-      content: "Flip"
-    }, /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
-      icon: /*#__PURE__*/_react.default.createElement(_flip.ReactComponent, null),
-      onClick: function onClick() {
-        return activateTool("flip");
-      },
-      "data-testid": "flip-item"
-    }));
-  },
-  renderForm: renderForm,
-  cancel: function cancel() {
-    return cropper && cropper.destroy();
-  },
-  onActivate: function onActivate(_ref2) {
-    var canvas = _ref2.canvas;
-    cropper = new _cropperjs.default(canvas.current, {
-      background: false,
-      modal: false,
-      guides: false,
-      dragMode: "none",
-      highlight: false,
-      autoCrop: false
-    });
-  },
-  apply: function apply(_ref3) {
-    var canvas = _ref3.canvas;
-    return new Promise(function (resolve) {
-      if (!cropper) {
-        resolve();
-        return;
-      }
-      var current = canvas.current;
-      var src = cropper.getCroppedCanvas().toDataURL();
-      if (current) {
-        var image = new window.Image();
-        var ctx = current.getContext("2d");
-        image.onload = function () {
-          ctx.drawImage(image, 0, 0);
-          current.width = image.width;
-          current.height = image.height;
-          ctx.drawImage(image, 0, 0);
-          resolve();
-        };
-        image.src = src;
-      }
-      cropper.destroy();
-    });
-  }
-};
-var _default = exports.default = tool;
-
-//# sourceMappingURL=flip.js.map

package/ImageEditor/toolbar/flip.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_flip","_cropperjs","_Button","_Tooltip","cropper","flipped","x","y","renderForm","default","createElement","style","textAlign","ButtonDefault","onClick","scaleX","scaleY","tool","name","icon","_ref","activateTool","Tooltip","placement","content","IconButton","ReactComponent","cancel","destroy","onActivate","_ref2","canvas","Cropper","current","background","modal","guides","dragMode","highlight","autoCrop","apply","_ref3","Promise","resolve","src","getCroppedCanvas","toDataURL","image","window","Image","ctx","getContext","onload","drawImage","width","height","_default","exports"],"sources":["flip.tsx"],"sourcesContent":["import React from \"react\";\nimport { ImageEditorTool } from \"./types\";\nimport { ReactComponent as FlipIcon } from \"./icons/flip.svg\";\nimport Cropper from \"cropperjs\";\nimport \"cropperjs/dist/cropper.css\";\n\nimport { IconButton, ButtonDefault } from \"../../Button\";\nimport { Tooltip } from \"~/Tooltip\";\n\nlet cropper: Cropper;\n\nconst flipped = { x: 1, y: 1 };\n\nconst renderForm = () => {\n    return (\n        <div style={{ textAlign: \"center\" }}>\n            <ButtonDefault\n                onClick={() => {\n                    if (!cropper) {\n                        return;\n                    }\n\n                    flipped.x = flipped.x === 1 ? -1 : 1;\n                    cropper.scaleX(flipped.x);\n                }}\n            >\n                FlipX\n            </ButtonDefault>\n            <ButtonDefault\n                onClick={() => {\n                    if (!cropper) {\n                        return;\n                    }\n\n                    flipped.y = flipped.y === 1 ? -1 : 1;\n                    cropper.scaleY(flipped.y);\n                }}\n            >\n                FlipY\n            </ButtonDefault>\n        </div>\n    );\n};\n\nconst tool: ImageEditorTool = {\n    name: \"flip\",\n    icon({ activateTool }) {\n        return (\n            <Tooltip placement={\"bottom\"} content={\"Flip\"}>\n                <IconButton\n                    icon={<FlipIcon />}\n                    onClick={() => activateTool(\"flip\")}\n                    data-testid={\"flip-item\"}\n                />\n            </Tooltip>\n        );\n    },\n    renderForm,\n    cancel: () => cropper && cropper.destroy(),\n    onActivate: ({ canvas }) => {\n        cropper = new Cropper(canvas.current as HTMLCanvasElement, {\n            background: false,\n            modal: false,\n            guides: false,\n            dragMode: \"none\",\n            highlight: false,\n            autoCrop: false\n        });\n    },\n    apply: ({ canvas }) => {\n        return new Promise((resolve: any) => {\n            if (!cropper) {\n                resolve();\n                return;\n            }\n\n            const current = canvas.current;\n            const src = cropper.getCroppedCanvas().toDataURL();\n            if (current) {\n                const image = new window.Image();\n                const ctx = current.getContext(\"2d\") as CanvasRenderingContext2D;\n                image.onload = () => {\n                    ctx.drawImage(image, 0, 0);\n                    current.width = image.width;\n                    current.height = image.height;\n\n                    ctx.drawImage(image, 0, 0);\n                    resolve();\n                };\n                image.src = src;\n            }\n\n            cropper.destroy();\n        });\n    }\n};\n\nexport default tool;\n"],"mappings":"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","ignoreList":[]}

package/ImageEditor/toolbar/icons/crop.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M17 15h2V7c0-1.1-.9-2-2-2H9v2h8v8zM7 17V1H5v4H1v2h4v10c0 1.1.9 2 2 2h10v4h2v-4h4v-2H7z"/>
-</svg>

package/ImageEditor/toolbar/icons/draw.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path fill="currentColor" d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"/>
-    <path d="M0 0h24v24H0z" fill="none"/>
-</svg>

package/ImageEditor/toolbar/icons/filter.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M3 17v2h6v-2H3zM3 5v2h10V5H3zm10 16v-2h8v-2h-8v-2h-2v6h2zM7 9v2H3v2h4v2h2V9H7zm14 4v-2H11v2h10zm-6-4h2V7h4V5h-4V3h-2v6z"/>
-</svg>

package/ImageEditor/toolbar/icons/flip.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M15 21h2v-2h-2v2zm4-12h2V7h-2v2zM3 5v14c0 1.1.9 2 2 2h4v-2H5V5h4V3H5c-1.1 0-2 .9-2 2zm16-2v2h2c0-1.1-.9-2-2-2zm-8 20h2V1h-2v22zm8-6h2v-2h-2v2zM15 5h2V3h-2v2zm4 8h2v-2h-2v2zm0 8c1.1 0 2-.9 2-2h-2v2z"/>
-</svg>

package/ImageEditor/toolbar/icons/index.d.ts

@@ -1,8 +0,0 @@
-export { ReactComponent as CropIcon } from "./crop.svg";
-export { ReactComponent as DrawIcon } from "./draw.svg";
-export { ReactComponent as FilterIcon } from "./filter.svg";
-export { ReactComponent as FlipIcon } from "./flip.svg";
-export { ReactComponent as RedoIcon } from "./redo.svg";
-export { ReactComponent as RotateLeftIcon } from "./rotateLeft.svg";
-export { ReactComponent as RotateRightIcon } from "./rotateRight.svg";
-export { ReactComponent as UndoIcon } from "./undo.svg";

package/ImageEditor/toolbar/icons/index.js

@@ -1,63 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "CropIcon", {
-  enumerable: true,
-  get: function get() {
-    return _crop.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "DrawIcon", {
-  enumerable: true,
-  get: function get() {
-    return _draw.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "FilterIcon", {
-  enumerable: true,
-  get: function get() {
-    return _filter.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "FlipIcon", {
-  enumerable: true,
-  get: function get() {
-    return _flip.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "RedoIcon", {
-  enumerable: true,
-  get: function get() {
-    return _redo.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "RotateLeftIcon", {
-  enumerable: true,
-  get: function get() {
-    return _rotateLeft.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "RotateRightIcon", {
-  enumerable: true,
-  get: function get() {
-    return _rotateRight.ReactComponent;
-  }
-});
-Object.defineProperty(exports, "UndoIcon", {
-  enumerable: true,
-  get: function get() {
-    return _undo.ReactComponent;
-  }
-});
-var _crop = require("./crop.svg");
-var _draw = require("./draw.svg");
-var _filter = require("./filter.svg");
-var _flip = require("./flip.svg");
-var _redo = require("./redo.svg");
-var _rotateLeft = require("./rotateLeft.svg");
-var _rotateRight = require("./rotateRight.svg");
-var _undo = require("./undo.svg");
-
-//# sourceMappingURL=index.js.map

package/ImageEditor/toolbar/icons/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_crop","require","_draw","_filter","_flip","_redo","_rotateLeft","_rotateRight","_undo"],"sources":["index.ts"],"sourcesContent":["export { ReactComponent as CropIcon } from \"./crop.svg\";\nexport { ReactComponent as DrawIcon } from \"./draw.svg\";\nexport { ReactComponent as FilterIcon } from \"./filter.svg\";\nexport { ReactComponent as FlipIcon } from \"./flip.svg\";\nexport { ReactComponent as RedoIcon } from \"./redo.svg\";\nexport { ReactComponent as RotateLeftIcon } from \"./rotateLeft.svg\";\nexport { ReactComponent as RotateRightIcon } from \"./rotateRight.svg\";\nexport { ReactComponent as UndoIcon } from \"./undo.svg\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AACA,IAAAM,YAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAP,OAAA","ignoreList":[]}

package/ImageEditor/toolbar/icons/redo.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z"/>
-</svg>

package/ImageEditor/toolbar/icons/rotateLeft.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M7.11 8.53L5.7 7.11C4.8 8.27 4.24 9.61 4.07 11h2.02c.14-.87.49-1.72 1.02-2.47zM6.09 13H4.07c.17 1.39.72 2.73 1.62 3.89l1.41-1.42c-.52-.75-.87-1.59-1.01-2.47zm1.01 5.32c1.16.9 2.51 1.44 3.9 1.61V17.9c-.87-.15-1.71-.49-2.46-1.03L7.1 18.32zM13 4.07V1L8.45 5.55 13 10V6.09c2.84.48 5 2.94 5 5.91s-2.16 5.43-5 5.91v2.02c3.95-.49 7-3.85 7-7.93s-3.05-7.44-7-7.93z"/>
-</svg>

package/ImageEditor/toolbar/icons/rotateRight.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M15.55 5.55L11 1v3.07C7.06 4.56 4 7.92 4 12s3.05 7.44 7 7.93v-2.02c-2.84-.48-5-2.94-5-5.91s2.16-5.43 5-5.91V10l4.55-4.45zM19.93 11c-.17-1.39-.72-2.73-1.62-3.89l-1.42 1.42c.54.75.88 1.6 1.02 2.47h2.02zM13 17.9v2.02c1.39-.17 2.74-.71 3.9-1.61l-1.44-1.44c-.75.54-1.59.89-2.46 1.03zm3.89-2.42l1.42 1.41c.9-1.16 1.45-2.5 1.62-3.89h-2.02c-.14.87-.48 1.72-1.02 2.48z"/>
-</svg>

package/ImageEditor/toolbar/icons/undo.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" viewBox="0 0 24 24">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path fill="currentColor" d="M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z"/>
-</svg>

package/ImageEditor/toolbar/index.d.ts

@@ -1,4 +0,0 @@
-export { default as crop } from "./crop";
-export { default as flip } from "./flip";
-export { default as filter } from "./filter";
-export { default as rotate } from "./rotate";

package/ImageEditor/toolbar/index.js

@@ -1,36 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "crop", {
-  enumerable: true,
-  get: function get() {
-    return _crop.default;
-  }
-});
-Object.defineProperty(exports, "filter", {
-  enumerable: true,
-  get: function get() {
-    return _filter.default;
-  }
-});
-Object.defineProperty(exports, "flip", {
-  enumerable: true,
-  get: function get() {
-    return _flip.default;
-  }
-});
-Object.defineProperty(exports, "rotate", {
-  enumerable: true,
-  get: function get() {
-    return _rotate.default;
-  }
-});
-var _crop = _interopRequireDefault(require("./crop"));
-var _flip = _interopRequireDefault(require("./flip"));
-var _filter = _interopRequireDefault(require("./filter"));
-var _rotate = _interopRequireDefault(require("./rotate"));
-
-//# sourceMappingURL=index.js.map

package/ImageEditor/toolbar/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_crop","_interopRequireDefault","require","_flip","_filter","_rotate"],"sources":["index.ts"],"sourcesContent":["export { default as crop } from \"./crop\";\nexport { default as flip } from \"./flip\";\nexport { default as filter } from \"./filter\";\nexport { default as rotate } from \"./rotate\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,OAAA,GAAAJ,sBAAA,CAAAC,OAAA","ignoreList":[]}

package/ImageEditor/toolbar/rotate.d.ts

@@ -1,4 +0,0 @@
-import { ImageEditorTool } from "./types";
-import "cropperjs/dist/cropper.css";
-declare const tool: ImageEditorTool;
-export default tool;

package/ImageEditor/toolbar/rotate.js

@@ -1,127 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
-var _rotateRight = require("./icons/rotateRight.svg");
-var _Slider = require("../../Slider");
-var _Tooltip = require("../../Tooltip");
-var _Button = require("../../Button");
-var _cropperjs = _interopRequireDefault(require("cropperjs"));
-require("cropperjs/dist/cropper.css");
-var cropper;
-var RenderForm = /*#__PURE__*/function (_React$Component) {
-  function RenderForm() {
-    var _this;
-    (0, _classCallCheck2.default)(this, RenderForm);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = (0, _callSuper2.default)(this, RenderForm, [].concat(args));
-    (0, _defineProperty2.default)(_this, "state", {
-      rangeInput: 0
-    });
-    return _this;
-  }
-  (0, _inherits2.default)(RenderForm, _React$Component);
-  return (0, _createClass2.default)(RenderForm, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      return /*#__PURE__*/_react.default.createElement("div", {
-        style: {
-          width: "500px",
-          margin: "0 auto"
-        }
-      }, /*#__PURE__*/_react.default.createElement(_Slider.Slider, {
-        label: "Range Input",
-        value: this.state.rangeInput,
-        min: 0,
-        max: 360,
-        step: 10,
-        discrete: true,
-        displayMarkers: true,
-        onInput: function onInput(value) {
-          _this2.setState({
-            rangeInput: value
-          }, async function () {
-            if (cropper) {
-              cropper.rotateTo(parseInt(value, 10));
-            }
-          });
-        }
-      }));
-    }
-  }]);
-}(_react.default.Component);
-var tool = {
-  name: "rotate",
-  icon: function icon(_ref) {
-    var activateTool = _ref.activateTool;
-    return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
-      placement: "bottom",
-      content: "Rotate"
-    }, /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
-      icon: /*#__PURE__*/_react.default.createElement(_rotateRight.ReactComponent, null),
-      onClick: function onClick() {
-        return activateTool("rotate");
-      },
-      "data-testid": "rotate-item"
-    }));
-  },
-  renderForm: function renderForm(props) {
-    return /*#__PURE__*/_react.default.createElement(RenderForm, props);
-  },
-  onActivate: function onActivate(_ref2) {
-    var canvas = _ref2.canvas;
-    /**
-     * We can safely cast canvas.current as HTMLCanvasElement
-     */
-    cropper = new _cropperjs.default(canvas.current, {
-      background: false,
-      modal: false,
-      guides: false,
-      dragMode: "none",
-      highlight: false,
-      autoCrop: false
-    });
-  },
-  cancel: function cancel() {
-    return cropper && cropper.destroy();
-  },
-  apply: function apply(_ref3) {
-    var canvas = _ref3.canvas;
-    return new Promise(function (resolve) {
-      if (!cropper) {
-        resolve();
-        return;
-      }
-      var current = canvas.current;
-      var src = cropper.getCroppedCanvas().toDataURL();
-      if (current) {
-        var image = new window.Image();
-        var ctx = current.getContext("2d");
-        image.onload = function () {
-          ctx.drawImage(image, 0, 0);
-          current.width = image.width;
-          current.height = image.height;
-          ctx.drawImage(image, 0, 0);
-        };
-        image.src = src;
-        resolve();
-      }
-      cropper.destroy();
-    });
-  }
-};
-var _default = exports.default = tool;
-
-//# sourceMappingURL=rotate.js.map

package/ImageEditor/toolbar/rotate.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_rotateRight","_Slider","_Tooltip","_Button","_cropperjs","cropper","RenderForm","_React$Component","_this","_classCallCheck2","default","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","rangeInput","_inherits2","_createClass2","key","value","render","_this2","createElement","style","width","margin","Slider","label","state","min","max","step","discrete","displayMarkers","onInput","setState","rotateTo","parseInt","React","Component","tool","name","icon","_ref","activateTool","Tooltip","placement","content","IconButton","ReactComponent","onClick","renderForm","props","onActivate","_ref2","canvas","Cropper","current","background","modal","guides","dragMode","highlight","autoCrop","cancel","destroy","apply","_ref3","Promise","resolve","src","getCroppedCanvas","toDataURL","image","window","Image","ctx","getContext","onload","drawImage","height","_default","exports"],"sources":["rotate.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as RotateRight } from \"./icons/rotateRight.svg\";\nimport { ImageEditorTool } from \"./types\";\nimport { Slider } from \"../../Slider\";\nimport { Tooltip } from \"~/Tooltip\";\nimport { IconButton } from \"~/Button\";\n\nimport Cropper from \"cropperjs\";\nimport \"cropperjs/dist/cropper.css\";\n\nlet cropper: Cropper;\n\nclass RenderForm extends React.Component<any, any> {\n    public override state = {\n        rangeInput: 0\n    };\n\n    public override render() {\n        return (\n            <div style={{ width: \"500px\", margin: \"0 auto\" }}>\n                <Slider\n                    label={\"Range Input\"}\n                    value={this.state.rangeInput}\n                    min={0}\n                    max={360}\n                    step={10}\n                    discrete={true}\n                    displayMarkers={true}\n                    onInput={(value: string) => {\n                        this.setState({ rangeInput: value }, async () => {\n                            if (cropper) {\n                                cropper.rotateTo(parseInt(value, 10));\n                            }\n                        });\n                    }}\n                />\n            </div>\n        );\n    }\n}\n\nconst tool: ImageEditorTool = {\n    name: \"rotate\",\n    icon({ activateTool }) {\n        return (\n            <Tooltip placement={\"bottom\"} content={\"Rotate\"}>\n                <IconButton\n                    icon={<RotateRight />}\n                    onClick={() => activateTool(\"rotate\")}\n                    data-testid={\"rotate-item\"}\n                />\n            </Tooltip>\n        );\n    },\n    renderForm(props) {\n        return <RenderForm {...props} />;\n    },\n    onActivate: ({ canvas }) => {\n        /**\n         * We can safely cast canvas.current as HTMLCanvasElement\n         */\n        cropper = new Cropper(canvas.current as HTMLCanvasElement, {\n            background: false,\n            modal: false,\n            guides: false,\n            dragMode: \"none\",\n            highlight: false,\n            autoCrop: false\n        });\n    },\n    cancel: () => cropper && cropper.destroy(),\n    apply: ({ canvas }) => {\n        return new Promise((resolve: any) => {\n            if (!cropper) {\n                resolve();\n                return;\n            }\n\n            const current = canvas.current;\n            const src = cropper.getCroppedCanvas().toDataURL();\n            if (current) {\n                const image = new window.Image();\n                const ctx = current.getContext(\"2d\") as CanvasRenderingContext2D;\n                image.onload = () => {\n                    ctx.drawImage(image, 0, 0);\n                    current.width = image.width;\n                    current.height = image.height;\n\n                    ctx.drawImage(image, 0, 0);\n                };\n                image.src = src;\n                resolve();\n            }\n\n            cropper.destroy();\n        });\n    }\n};\n\nexport default tool;\n"],"mappings":"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","ignoreList":[]}

package/ImageEditor/toolbar/types.d.ts

@@ -1,32 +0,0 @@
-import React from "react";
-export declare type ToolbarTool = "crop" | "flip" | "rotate" | "filter";
-interface RenderFormParams {
-    canvas: React.RefObject<HTMLCanvasElement>;
-    image: HTMLImageElement;
-    renderApplyCancel?: () => void;
-    options?: {
-        [key: string]: any;
-    };
-}
-interface OnActivateParams {
-    options: any;
-    canvas: React.RefObject<HTMLCanvasElement>;
-}
-interface IconParams {
-    activateTool: (tool: ToolbarTool) => void;
-}
-interface ApplyParams {
-    canvas: React.RefObject<HTMLCanvasElement>;
-}
-interface CancelParams {
-    canvas: React.RefObject<HTMLCanvasElement>;
-}
-export interface ImageEditorTool {
-    name: string;
-    apply?: (params: ApplyParams) => void;
-    cancel?: (params: CancelParams) => void;
-    onActivate?: (params: OnActivateParams) => void;
-    icon: (params: IconParams) => React.ReactElement<any>;
-    renderForm?: (params: RenderFormParams) => React.ReactNode;
-}
-export {};

package/ImageEditor/toolbar/types.js

@@ -1,7 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-//# sourceMappingURL=types.js.map

package/ImageEditor/toolbar/types.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import React from \"react\";\n\nexport type ToolbarTool = \"crop\" | \"flip\" | \"rotate\" | \"filter\";\n\ninterface RenderFormParams {\n    canvas: React.RefObject<HTMLCanvasElement>;\n    image: HTMLImageElement;\n    renderApplyCancel?: () => void;\n    options?: { [key: string]: any };\n}\n\ninterface OnActivateParams {\n    options: any;\n    canvas: React.RefObject<HTMLCanvasElement>;\n}\n\ninterface IconParams {\n    activateTool: (tool: ToolbarTool) => void;\n}\n\ninterface ApplyParams {\n    canvas: React.RefObject<HTMLCanvasElement>;\n}\n\ninterface CancelParams {\n    canvas: React.RefObject<HTMLCanvasElement>;\n}\n\nexport interface ImageEditorTool {\n    name: string;\n    apply?: (params: ApplyParams) => void;\n    cancel?: (params: CancelParams) => void;\n    onActivate?: (params: OnActivateParams) => void;\n    icon: (params: IconParams) => React.ReactElement<any>;\n    renderForm?: (params: RenderFormParams) => React.ReactNode;\n}\n"],"mappings":"","ignoreList":[]}

package/ImageUpload/README.md

@@ -1,11 +0,0 @@
-# ImageUpload
-
-### Description
-
-`ImageUpload` component lets users select a image (eg. to be uploaded to a server), or multiple images.
-
-### Import
-
-```js
-import { SingleImageUpload, MultiImageUpload } from "@webiny/ui/ImageUpload";
-```

package/ImageUpload/icons/round-add_photo_alternate-24px.svg

@@ -1,23 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
-<g id="Bounding_Boxes">
-	<g id="ui_x5F_spec_x5F_header_copy_3">
-	</g>
-	<path fill="none" d="M0,0h24v24H0V0z"/>
-</g>
-<g id="Rounded">
-	<g id="ui_x5F_spec_x5F_header_copy_7">
-	</g>
-	<g>
-		<path fill="currentColor" d="M21.02,5H19V2.98C19,2.44,18.56,2,18.02,2h-0.03C17.44,2,17,2.44,17,2.98V5h-2.01C14.45,5,14.01,5.44,14,5.98
-			c0,0.01,0,0.02,0,0.03C14,6.56,14.44,7,14.99,7H17v2.01c0,0.54,0.44,0.99,0.99,0.98c0.01,0,0.02,0,0.03,0
-			c0.54,0,0.98-0.44,0.98-0.98V7h2.02C21.56,7,22,6.56,22,6.02V5.98C22,5.44,21.56,5,21.02,5z"/>
-		<path fill="currentColor" d="M16,9.01V8h-1.01c-0.53,0-1.03-0.21-1.41-0.58C13.21,7.04,13,6.54,13,5.98c0-0.36,0.1-0.69,0.27-0.98H5C3.9,5,3,5.9,3,7
-			v12c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2v-8.28c-0.3,0.17-0.64,0.28-1.02,0.28C16.89,10.99,16,10.1,16,9.01z M15.96,19H6
-			c-0.41,0-0.65-0.47-0.4-0.8l1.98-2.63c0.21-0.28,0.62-0.26,0.82,0.02L10,18l2.61-3.48c0.2-0.26,0.59-0.27,0.79-0.01l2.95,3.68
-			C16.61,18.52,16.38,19,15.96,19z"/>
-	</g>
-</g>
-</svg>

package/ImageUpload/icons/round-close-24px.svg

@@ -1,13 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
-<g id="Bounding_Boxes">
-	<path fill="none" d="M0,0h24v24H0V0z"/>
-</g>
-<g id="Rounded">
-	<path fill="currentColor" d="M18.3,5.71L18.3,5.71c-0.39-0.39-1.02-0.39-1.41,0L12,10.59L7.11,5.7c-0.39-0.39-1.02-0.39-1.41,0l0,0
-		c-0.39,0.39-0.39,1.02,0,1.41L10.59,12L5.7,16.89c-0.39,0.39-0.39,1.02,0,1.41h0c0.39,0.39,1.02,0.39,1.41,0L12,13.41l4.89,4.89
-		c0.39,0.39,1.02,0.39,1.41,0l0,0c0.39-0.39,0.39-1.02,0-1.41L13.41,12l4.89-4.89C18.68,6.73,18.68,6.09,18.3,5.71z"/>
-</g>
-</svg>

package/ImageUpload/icons/round-edit-24px.svg

@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-    <path fill="currentColor" d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"/>
-    <path d="M0 0h24v24H0z" fill="none"/>
-</svg>

package/ImageUpload/styled.d.ts

@@ -1,27 +0,0 @@
-/// <reference types="react" />
-export declare const AddImageIconWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const AddImageWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const AddImageWrapperRound: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;
-export declare const RemoveImage: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const EditImage: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ImagePreviewWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;