@webiny/app-admin 5.43.2 → 6.0.0-alpha.0

package/ui/elements/form/DynamicFieldsetElement.js

@@ -1,134 +1,97 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DynamicFieldsetElement = 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 _react = _interopRequireDefault(require("react"));
-var _FormFieldElement2 = require("./FormFieldElement");
-var _DynamicFieldset = require("@webiny/ui/DynamicFieldset");
-var _Grid = require("@webiny/ui/Grid");
-var _DynamicFieldsetRowElement = require("./DynamicFieldsetElement/DynamicFieldsetRowElement");
-var DynamicFieldsetElement = exports.DynamicFieldsetElement = /*#__PURE__*/function (_FormFieldElement) {
-  function DynamicFieldsetElement(id, config) {
-    var _this;
-    (0, _classCallCheck2.default)(this, DynamicFieldsetElement);
-    _this = (0, _callSuper2.default)(this, DynamicFieldsetElement, [id, config]);
-    _this.useGrid(false);
-    _this.applyPlugins(DynamicFieldsetElement);
-    return _this;
+import React from "react";
+import { FormFieldElement } from "./FormFieldElement";
+import { DynamicFieldset } from "@webiny/ui/DynamicFieldset";
+import { Grid } from "@webiny/ui/Grid";
+import { DynamicFieldsetRowElement } from "./DynamicFieldsetElement/DynamicFieldsetRowElement";
+export class DynamicFieldsetElement extends FormFieldElement {
+  constructor(id, config) {
+    super(id, config);
+    this.useGrid(false);
+    this.applyPlugins(DynamicFieldsetElement);
   }
-  (0, _inherits2.default)(DynamicFieldsetElement, _FormFieldElement);
-  return (0, _createClass2.default)(DynamicFieldsetElement, [{
-    key: "getCreateHeaderElement",
-    value: function getCreateHeaderElement() {
-      return this.config.createHeader;
-    }
-  }, {
-    key: "setHeaderElement",
-    value: function setHeaderElement(element) {
-      this.config.createHeader = function () {
-        return element;
-      };
-    }
-  }, {
-    key: "setCreateHeaderElement",
-    value: function setCreateHeaderElement(cb) {
-      this.config.createHeader = cb;
-    }
-  }, {
-    key: "getCreateRowElement",
-    value: function getCreateRowElement() {
-      return this.config.createRow;
-    }
-  }, {
-    key: "setCreateRowElement",
-    value: function setCreateRowElement(cb) {
-      this.config.createRow = cb;
-    }
-  }, {
-    key: "getCreateEmptyElement",
-    value: function getCreateEmptyElement() {
-      return this.config.createEmpty;
-    }
-  }, {
-    key: "setEmptyElement",
-    value: function setEmptyElement(element) {
-      this.config.createEmpty = function () {
-        return element;
-      };
-    }
-  }, {
-    key: "setCreateEmptyElement",
-    value: function setCreateEmptyElement(cb) {
-      this.config.createEmpty = cb;
+  getCreateHeaderElement() {
+    return this.config.createHeader;
+  }
+  setHeaderElement(element) {
+    this.config.createHeader = () => element;
+  }
+  setCreateHeaderElement(cb) {
+    this.config.createHeader = cb;
+  }
+  getCreateRowElement() {
+    return this.config.createRow;
+  }
+  setCreateRowElement(cb) {
+    this.config.createRow = cb;
+  }
+  getCreateEmptyElement() {
+    return this.config.createEmpty;
+  }
+  setEmptyElement(element) {
+    this.config.createEmpty = () => element;
+  }
+  setCreateEmptyElement(cb) {
+    this.config.createEmpty = cb;
+  }
+  render(props) {
+    if (!props.formProps) {
+      throw Error(`DynamicFieldsetElement must be placed inside of a FormElement.`);
     }
-  }, {
-    key: "render",
-    value: function render(props) {
-      var _this2 = this;
-      if (!props.formProps) {
-        throw Error("DynamicFieldsetElement must be placed inside of a FormElement.");
+    const {
+      Bind
+    } = props.formProps;
+    const createHeader = this.getCreateHeaderElement();
+    const createRow = this.getCreateRowElement();
+    const createEmpty = this.getCreateEmptyElement();
+    return /*#__PURE__*/React.createElement(Bind, {
+      name: this.getName(),
+      defaultValue: this.getDefaultValue(props)
+    }, /*#__PURE__*/React.createElement(DynamicFieldset, null, ({
+      actions,
+      header,
+      row,
+      empty
+    }) => /*#__PURE__*/React.createElement(React.Fragment, null, header(() => {
+      if (!createHeader) {
+        return null;
+      }
+      const headerElement = createHeader({
+        actions: actions
+      });
+      // This element is not created via `this.addElement()` API.
+      // We need to manually give it a parent to enable proper grid rendering.
+      headerElement && headerElement.setParent(this);
+      return headerElement ? headerElement.render(props) : null;
+    }), row(({
+      index
+    }) => {
+      if (!createRow) {
+        return null;
       }
-      var Bind = props.formProps.Bind;
-      var createHeader = this.getCreateHeaderElement();
-      var createRow = this.getCreateRowElement();
-      var createEmpty = this.getCreateEmptyElement();
-      return /*#__PURE__*/_react.default.createElement(Bind, {
-        name: this.getName(),
-        defaultValue: this.getDefaultValue(props)
-      }, /*#__PURE__*/_react.default.createElement(_DynamicFieldset.DynamicFieldset, null, function (_ref) {
-        var actions = _ref.actions,
-          header = _ref.header,
-          row = _ref.row,
-          empty = _ref.empty;
-        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, header(function () {
-          if (!createHeader) {
-            return null;
-          }
-          var headerElement = createHeader({
-            actions: actions
-          });
-          // This element is not created via `this.addElement()` API.
-          // We need to manually give it a parent to enable proper grid rendering.
-          headerElement && headerElement.setParent(_this2);
-          return headerElement ? headerElement.render(props) : null;
-        }), row(function (_ref2) {
-          var index = _ref2.index;
-          if (!createRow) {
-            return null;
-          }
-          var rowElement = createRow({
-            actions: actions,
-            index: index,
-            row: new _DynamicFieldsetRowElement.DynamicFieldsetRowElement("".concat(_this2.id, ".row.").concat(index))
-          });
+      const rowElement = createRow({
+        actions: actions,
+        index,
+        row: new DynamicFieldsetRowElement(`${this.id}.row.${index}`)
+      });
 
-          // This element is not created via `this.addElement()` API.
-          // We need to manually give it a parent to enable proper grid rendering.
-          rowElement && rowElement.setParent(_this2);
-          return rowElement ? /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, rowElement.render(props)) : null;
-        }), empty(function () {
-          if (!createEmpty) {
-            return null;
-          }
-          var emptyElement = createEmpty({
-            actions: actions
-          });
+      // This element is not created via `this.addElement()` API.
+      // We need to manually give it a parent to enable proper grid rendering.
+      rowElement && rowElement.setParent(this);
+      return rowElement ? /*#__PURE__*/React.createElement(Grid, null, rowElement.render(props)) : null;
+    }), empty(() => {
+      if (!createEmpty) {
+        return null;
+      }
+      const emptyElement = createEmpty({
+        actions: actions
+      });
 
-          // This element is not created via `this.addElement()` API.
-          // We need to manually give it a parent to enable proper grid rendering.
-          emptyElement && emptyElement.setParent(_this2);
-          return emptyElement ? emptyElement.render(props) : null;
-        }));
-      }));
-    }
-  }]);
-}(_FormFieldElement2.FormFieldElement);
+      // This element is not created via `this.addElement()` API.
+      // We need to manually give it a parent to enable proper grid rendering.
+      emptyElement && emptyElement.setParent(this);
+      return emptyElement ? emptyElement.render(props) : null;
+    }))));
+  }
+}
 
 //# sourceMappingURL=DynamicFieldsetElement.js.map

package/ui/elements/form/DynamicFieldsetElement.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_FormFieldElement2","_DynamicFieldset","_Grid","_DynamicFieldsetRowElement","DynamicFieldsetElement","exports","_FormFieldElement","id","config","_this","_classCallCheck2","default","_callSuper2","useGrid","applyPlugins","_inherits2","_createClass2","key","value","getCreateHeaderElement","createHeader","setHeaderElement","element","setCreateHeaderElement","cb","getCreateRowElement","createRow","setCreateRowElement","getCreateEmptyElement","createEmpty","setEmptyElement","setCreateEmptyElement","render","props","_this2","formProps","Error","Bind","createElement","name","getName","defaultValue","getDefaultValue","DynamicFieldset","_ref","actions","header","row","empty","Fragment","headerElement","setParent","_ref2","index","rowElement","DynamicFieldsetRowElement","concat","Grid","emptyElement","FormFieldElement"],"sources":["DynamicFieldsetElement.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    FormFieldElement,\n    FormFieldElementConfig,\n    FormFieldElementRenderProps\n} from \"~/ui/elements/form/FormFieldElement\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { DynamicFieldset } from \"@webiny/ui/DynamicFieldset\";\nimport { Grid } from \"@webiny/ui/Grid\";\nimport { DynamicFieldsetRowElement } from \"./DynamicFieldsetElement/DynamicFieldsetRowElement\";\n\ninterface DynamicFieldsetActions {\n    add: (index?: number) => () => void;\n    remove: (index: number) => () => void;\n}\n\ninterface CreateHeaderCallable {\n    (params: { actions: DynamicFieldsetActions }): UIElement;\n}\n\ninterface CreateRowCallable {\n    (params: {\n        actions: DynamicFieldsetActions;\n        index: number;\n        row: DynamicFieldsetRowElement;\n    }): UIElement;\n}\n\ninterface CreateEmptyCallable {\n    (params: { actions: DynamicFieldsetActions }): UIElement;\n}\n\nexport interface DynamicFieldsetElementConfig extends FormFieldElementConfig {\n    createHeader?: CreateHeaderCallable;\n    createRow?: CreateRowCallable;\n    createEmpty?: CreateEmptyCallable;\n}\n\nexport class DynamicFieldsetElement extends FormFieldElement<DynamicFieldsetElementConfig> {\n    public constructor(id: string, config: DynamicFieldsetElementConfig) {\n        super(id, config);\n\n        this.useGrid(false);\n\n        this.applyPlugins(DynamicFieldsetElement);\n    }\n\n    public getCreateHeaderElement() {\n        return this.config.createHeader;\n    }\n\n    public setHeaderElement(element: UIElement): void {\n        this.config.createHeader = () => element;\n    }\n\n    public setCreateHeaderElement(cb: DynamicFieldsetElementConfig[\"createHeader\"]): void {\n        this.config.createHeader = cb;\n    }\n\n    public getCreateRowElement() {\n        return this.config.createRow;\n    }\n\n    public setCreateRowElement(cb: DynamicFieldsetElementConfig[\"createRow\"]): void {\n        this.config.createRow = cb;\n    }\n\n    public getCreateEmptyElement() {\n        return this.config.createEmpty;\n    }\n\n    public setEmptyElement(element: UIElement): void {\n        this.config.createEmpty = () => element;\n    }\n\n    public setCreateEmptyElement(cb: DynamicFieldsetElementConfig[\"createEmpty\"]): void {\n        this.config.createEmpty = cb;\n    }\n\n    public override render(props: FormFieldElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`DynamicFieldsetElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n        const createHeader = this.getCreateHeaderElement();\n        const createRow = this.getCreateRowElement();\n        const createEmpty = this.getCreateEmptyElement();\n\n        return (\n            <Bind name={this.getName()} defaultValue={this.getDefaultValue(props)}>\n                <DynamicFieldset>\n                    {({ actions, header, row, empty }) => (\n                        <React.Fragment>\n                            {header(() => {\n                                if (!createHeader) {\n                                    return null;\n                                }\n                                const headerElement = createHeader({\n                                    actions: actions as DynamicFieldsetActions\n                                });\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                headerElement && headerElement.setParent(this);\n\n                                return headerElement ? headerElement.render(props) : null;\n                            })}\n                            {row(({ index }) => {\n                                if (!createRow) {\n                                    return null;\n                                }\n                                const rowElement = createRow({\n                                    actions: actions as DynamicFieldsetActions,\n                                    index,\n                                    row: new DynamicFieldsetRowElement(`${this.id}.row.${index}`)\n                                });\n\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                rowElement && rowElement.setParent(this);\n\n                                return rowElement ? <Grid>{rowElement.render(props)}</Grid> : null;\n                            })}\n                            {empty(() => {\n                                if (!createEmpty) {\n                                    return null;\n                                }\n                                const emptyElement = createEmpty({\n                                    actions: actions as DynamicFieldsetActions\n                                });\n\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                emptyElement && emptyElement.setParent(this);\n\n                                return emptyElement ? emptyElement.render(props) : null;\n                            })}\n                        </React.Fragment>\n                    )}\n                </DynamicFieldset>\n            </Bind>\n        );\n    }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","FormFieldElement","DynamicFieldset","Grid","DynamicFieldsetRowElement","DynamicFieldsetElement","constructor","id","config","useGrid","applyPlugins","getCreateHeaderElement","createHeader","setHeaderElement","element","setCreateHeaderElement","cb","getCreateRowElement","createRow","setCreateRowElement","getCreateEmptyElement","createEmpty","setEmptyElement","setCreateEmptyElement","render","props","formProps","Error","Bind","createElement","name","getName","defaultValue","getDefaultValue","actions","header","row","empty","Fragment","headerElement","setParent","index","rowElement","emptyElement"],"sources":["DynamicFieldsetElement.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    FormFieldElement,\n    FormFieldElementConfig,\n    FormFieldElementRenderProps\n} from \"~/ui/elements/form/FormFieldElement\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { DynamicFieldset } from \"@webiny/ui/DynamicFieldset\";\nimport { Grid } from \"@webiny/ui/Grid\";\nimport { DynamicFieldsetRowElement } from \"./DynamicFieldsetElement/DynamicFieldsetRowElement\";\n\ninterface DynamicFieldsetActions {\n    add: (index?: number) => () => void;\n    remove: (index: number) => () => void;\n}\n\ninterface CreateHeaderCallable {\n    (params: { actions: DynamicFieldsetActions }): UIElement;\n}\n\ninterface CreateRowCallable {\n    (params: {\n        actions: DynamicFieldsetActions;\n        index: number;\n        row: DynamicFieldsetRowElement;\n    }): UIElement;\n}\n\ninterface CreateEmptyCallable {\n    (params: { actions: DynamicFieldsetActions }): UIElement;\n}\n\nexport interface DynamicFieldsetElementConfig extends FormFieldElementConfig {\n    createHeader?: CreateHeaderCallable;\n    createRow?: CreateRowCallable;\n    createEmpty?: CreateEmptyCallable;\n}\n\nexport class DynamicFieldsetElement extends FormFieldElement<DynamicFieldsetElementConfig> {\n    public constructor(id: string, config: DynamicFieldsetElementConfig) {\n        super(id, config);\n\n        this.useGrid(false);\n\n        this.applyPlugins(DynamicFieldsetElement);\n    }\n\n    public getCreateHeaderElement() {\n        return this.config.createHeader;\n    }\n\n    public setHeaderElement(element: UIElement): void {\n        this.config.createHeader = () => element;\n    }\n\n    public setCreateHeaderElement(cb: DynamicFieldsetElementConfig[\"createHeader\"]): void {\n        this.config.createHeader = cb;\n    }\n\n    public getCreateRowElement() {\n        return this.config.createRow;\n    }\n\n    public setCreateRowElement(cb: DynamicFieldsetElementConfig[\"createRow\"]): void {\n        this.config.createRow = cb;\n    }\n\n    public getCreateEmptyElement() {\n        return this.config.createEmpty;\n    }\n\n    public setEmptyElement(element: UIElement): void {\n        this.config.createEmpty = () => element;\n    }\n\n    public setCreateEmptyElement(cb: DynamicFieldsetElementConfig[\"createEmpty\"]): void {\n        this.config.createEmpty = cb;\n    }\n\n    public override render(props: FormFieldElementRenderProps): React.ReactNode {\n        if (!props.formProps) {\n            throw Error(`DynamicFieldsetElement must be placed inside of a FormElement.`);\n        }\n\n        const { Bind } = props.formProps;\n        const createHeader = this.getCreateHeaderElement();\n        const createRow = this.getCreateRowElement();\n        const createEmpty = this.getCreateEmptyElement();\n\n        return (\n            <Bind name={this.getName()} defaultValue={this.getDefaultValue(props)}>\n                <DynamicFieldset>\n                    {({ actions, header, row, empty }) => (\n                        <React.Fragment>\n                            {header(() => {\n                                if (!createHeader) {\n                                    return null;\n                                }\n                                const headerElement = createHeader({\n                                    actions: actions as DynamicFieldsetActions\n                                });\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                headerElement && headerElement.setParent(this);\n\n                                return headerElement ? headerElement.render(props) : null;\n                            })}\n                            {row(({ index }) => {\n                                if (!createRow) {\n                                    return null;\n                                }\n                                const rowElement = createRow({\n                                    actions: actions as DynamicFieldsetActions,\n                                    index,\n                                    row: new DynamicFieldsetRowElement(`${this.id}.row.${index}`)\n                                });\n\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                rowElement && rowElement.setParent(this);\n\n                                return rowElement ? <Grid>{rowElement.render(props)}</Grid> : null;\n                            })}\n                            {empty(() => {\n                                if (!createEmpty) {\n                                    return null;\n                                }\n                                const emptyElement = createEmpty({\n                                    actions: actions as DynamicFieldsetActions\n                                });\n\n                                // This element is not created via `this.addElement()` API.\n                                // We need to manually give it a parent to enable proper grid rendering.\n                                emptyElement && emptyElement.setParent(this);\n\n                                return emptyElement ? emptyElement.render(props) : null;\n                            })}\n                        </React.Fragment>\n                    )}\n                </DynamicFieldset>\n            </Bind>\n        );\n    }\n}\n"],"mappings":"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","ignoreList":[]}

package/ui/elements/form/FileManagerElement/EmptyStateElement.js

@@ -1,26 +1,10 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EmptyStateElement = void 0;
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _UIElement2 = require("../../../UIElement");
-var _EmptyStateElementRenderer = require("./EmptyStateElementRenderer");
-var EmptyStateElement = exports.EmptyStateElement = /*#__PURE__*/function (_UIElement) {
-  function EmptyStateElement(id) {
-    var _this;
-    (0, _classCallCheck2.default)(this, EmptyStateElement);
-    _this = (0, _callSuper2.default)(this, EmptyStateElement, [id]);
-    _this.addRenderer(new _EmptyStateElementRenderer.EmptyStateElementRenderer());
-    return _this;
+import { UIElement } from "../../../UIElement";
+import { EmptyStateElementRenderer } from "./EmptyStateElementRenderer";
+export class EmptyStateElement extends UIElement {
+  constructor(id) {
+    super(id);
+    this.addRenderer(new EmptyStateElementRenderer());
   }
-  (0, _inherits2.default)(EmptyStateElement, _UIElement);
-  return (0, _createClass2.default)(EmptyStateElement);
-}(_UIElement2.UIElement);
+}
 
 //# sourceMappingURL=EmptyStateElement.js.map

package/ui/elements/form/FileManagerElement/EmptyStateElement.js.map

@@ -1 +1 @@
-{"version":3,"names":["_UIElement2","require","_EmptyStateElementRenderer","EmptyStateElement","exports","_UIElement","id","_this","_classCallCheck2","default","_callSuper2","addRenderer","EmptyStateElementRenderer","_inherits2","_createClass2","UIElement"],"sources":["EmptyStateElement.tsx"],"sourcesContent":["import { UIElement } from \"~/ui/UIElement\";\nimport { EmptyStateElementRenderer } from \"./EmptyStateElementRenderer\";\n\nexport class EmptyStateElement extends UIElement<any> {\n    public constructor(id: string) {\n        super(id);\n\n        this.addRenderer(new EmptyStateElementRenderer());\n    }\n}\n"],"mappings":";;;;;;;;;;;AAAA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,0BAAA,GAAAD,OAAA;AAAwE,IAE3DE,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,0BAAAE,UAAA;EAC1B,SAAAF,kBAAmBG,EAAU,EAAE;IAAA,IAAAC,KAAA;IAAA,IAAAC,gBAAA,CAAAC,OAAA,QAAAN,iBAAA;IAC3BI,KAAA,OAAAG,WAAA,CAAAD,OAAA,QAAAN,iBAAA,GAAMG,EAAE;IAERC,KAAA,CAAKI,WAAW,CAAC,IAAIC,oDAAyB,CAAC,CAAC,CAAC;IAAC,OAAAL,KAAA;EACtD;EAAC,IAAAM,UAAA,CAAAJ,OAAA,EAAAN,iBAAA,EAAAE,UAAA;EAAA,WAAAS,aAAA,CAAAL,OAAA,EAAAN,iBAAA;AAAA,EALkCY,qBAAS","ignoreList":[]}
+{"version":3,"names":["UIElement","EmptyStateElementRenderer","EmptyStateElement","constructor","id","addRenderer"],"sources":["EmptyStateElement.tsx"],"sourcesContent":["import { UIElement } from \"~/ui/UIElement\";\nimport { EmptyStateElementRenderer } from \"./EmptyStateElementRenderer\";\n\nexport class EmptyStateElement extends UIElement<any> {\n    public constructor(id: string) {\n        super(id);\n\n        this.addRenderer(new EmptyStateElementRenderer());\n    }\n}\n"],"mappings":"AAAA,SAASA,SAAS;AAClB,SAASC,yBAAyB;AAElC,OAAO,MAAMC,iBAAiB,SAASF,SAAS,CAAM;EAC3CG,WAAWA,CAACC,EAAU,EAAE;IAC3B,KAAK,CAACA,EAAE,CAAC;IAET,IAAI,CAACC,WAAW,CAAC,IAAIJ,yBAAyB,CAAC,CAAC,CAAC;EACrD;AACJ","ignoreList":[]}

package/ui/elements/form/FileManagerElement/EmptyStateElementRenderer.js

@@ -1,72 +1,47 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EmptyStateElementRenderer = 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 _react = _interopRequireDefault(require("react"));
-var _UIRenderer2 = require("../../../UIRenderer");
-var Ui = _interopRequireWildcard(require("@webiny/ui/ImageUpload"));
-var _components = require("@webiny/app/components");
-var _styled = require("./styled");
-var _attach_file = require("@material-design-icons/svg/outlined/attach_file.svg");
-var _Typography = require("@webiny/ui/Typography");
-var _close = require("@material-design-icons/svg/outlined/close.svg");
-var EmptyStateElementRenderer = exports.EmptyStateElementRenderer = /*#__PURE__*/function (_UIRenderer) {
-  function EmptyStateElementRenderer() {
-    (0, _classCallCheck2.default)(this, EmptyStateElementRenderer);
-    return (0, _callSuper2.default)(this, EmptyStateElementRenderer, arguments);
-  }
-  (0, _inherits2.default)(EmptyStateElementRenderer, _UIRenderer);
-  return (0, _createClass2.default)(EmptyStateElementRenderer, [{
-    key: "render",
-    value: function render(_ref) {
-      var props = _ref.props;
-      var accept = props.fileManagerElement.getAccept();
-      var acceptsOnlyImages = !accept || accept.every(function (el) {
-        return el.startsWith("image/");
+import React from "react";
+import { UIRenderer } from "../../../UIRenderer";
+import * as Ui from "@webiny/ui/ImageUpload";
+import { Image } from "@webiny/app/components";
+import { AddImageIconWrapper, AddImageWrapper, FilePreviewWrapper, RemoveImage } from "./styled";
+import { ReactComponent as AddFileIcon } from "@webiny/icons/attach_file.svg";
+import { ReactComponent as RemoveImageIcon } from "@webiny/icons/close.svg";
+import { Typography } from "@webiny/ui/Typography";
+export class EmptyStateElementRenderer extends UIRenderer {
+  render({
+    props
+  }) {
+    const accept = props.fileManagerElement.getAccept();
+    const acceptsOnlyImages = !accept || accept.every(el => el.startsWith("image/"));
+    if (acceptsOnlyImages) {
+      return /*#__PURE__*/React.createElement(Ui.Image, {
+        placeholder: "Select an image",
+        renderImagePreview: renderImageProps => /*#__PURE__*/React.createElement(Image, renderImageProps),
+        style: {
+          width: "100%",
+          height: "auto"
+        },
+        value: props.value,
+        uploadImage: props.showFileManager,
+        removeImage: props.onChange
       });
-      if (acceptsOnlyImages) {
-        return /*#__PURE__*/_react.default.createElement(Ui.Image, {
-          placeholder: "Select an image",
-          renderImagePreview: function renderImagePreview(renderImageProps) {
-            return /*#__PURE__*/_react.default.createElement(_components.Image, renderImageProps);
-          },
-          style: {
-            width: "100%",
-            height: "auto"
-          },
-          value: props.value,
-          uploadImage: props.showFileManager,
-          removeImage: props.onChange
-        });
-      }
-      if (props.value) {
-        return /*#__PURE__*/_react.default.createElement(_styled.FilePreviewWrapper, null, /*#__PURE__*/_react.default.createElement("span", null, "Attached file: ", /*#__PURE__*/_react.default.createElement("strong", null, props.value.src.split("/").pop())), /*#__PURE__*/_react.default.createElement(_styled.RemoveImage, {
-          onClick: function onClick() {
-            return props.onChange(null);
-          }
-        }, /*#__PURE__*/_react.default.createElement(_close.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_styled.AddImageWrapper, {
-          "data-role": "select-file",
-          onClick: props.showFileManager
-        }, /*#__PURE__*/_react.default.createElement(_styled.AddImageIconWrapper, null, /*#__PURE__*/_react.default.createElement(_attach_file.ReactComponent, null), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
-          use: "caption"
-        }, "Select a file"))));
-      }
-      return /*#__PURE__*/_react.default.createElement(_styled.AddImageWrapper, {
+    }
+    if (props.value) {
+      return /*#__PURE__*/React.createElement(FilePreviewWrapper, null, /*#__PURE__*/React.createElement("span", null, "Attached file: ", /*#__PURE__*/React.createElement("strong", null, props.value.src.split("/").pop())), /*#__PURE__*/React.createElement(RemoveImage, {
+        onClick: () => props.onChange(null)
+      }, /*#__PURE__*/React.createElement(RemoveImageIcon, null)), /*#__PURE__*/React.createElement(AddImageWrapper, {
         "data-role": "select-file",
         onClick: props.showFileManager
-      }, /*#__PURE__*/_react.default.createElement(_styled.AddImageIconWrapper, null, /*#__PURE__*/_react.default.createElement(_attach_file.ReactComponent, null), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+      }, /*#__PURE__*/React.createElement(AddImageIconWrapper, null, /*#__PURE__*/React.createElement(AddFileIcon, null), /*#__PURE__*/React.createElement(Typography, {
         use: "caption"
-      }, "Select a file")));
+      }, "Select a file"))));
     }
-  }]);
-}(_UIRenderer2.UIRenderer);
+    return /*#__PURE__*/React.createElement(AddImageWrapper, {
+      "data-role": "select-file",
+      onClick: props.showFileManager
+    }, /*#__PURE__*/React.createElement(AddImageIconWrapper, null, /*#__PURE__*/React.createElement(AddFileIcon, null), /*#__PURE__*/React.createElement(Typography, {
+      use: "caption"
+    }, "Select a file")));
+  }
+}
 
 //# sourceMappingURL=EmptyStateElementRenderer.js.map

package/ui/elements/form/FileManagerElement/EmptyStateElementRenderer.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_UIRenderer2","Ui","_interopRequireWildcard","_components","_styled","_attach_file","_Typography","_close","EmptyStateElementRenderer","exports","_UIRenderer","_classCallCheck2","default","_callSuper2","arguments","_inherits2","_createClass2","key","value","render","_ref","props","accept","fileManagerElement","getAccept","acceptsOnlyImages","every","el","startsWith","createElement","Image","placeholder","renderImagePreview","renderImageProps","style","width","height","uploadImage","showFileManager","removeImage","onChange","FilePreviewWrapper","src","split","pop","RemoveImage","onClick","ReactComponent","AddImageWrapper","AddImageIconWrapper","Typography","use","UIRenderer"],"sources":["EmptyStateElementRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { EmptyStateElement } from \"./EmptyStateElement\";\nimport { UIRenderer, UIRenderParams } from \"~/ui/UIRenderer\";\nimport * as Ui from \"@webiny/ui/ImageUpload\";\nimport { Image } from \"@webiny/app/components\";\nimport { FileManagerElementRenderProps } from \"~/ui/elements/form/FileManagerElement/FileManagerElementRenderer\";\nimport { AddImageIconWrapper, AddImageWrapper, FilePreviewWrapper, RemoveImage } from \"./styled\";\nimport { ReactComponent as AddFileIcon } from \"@material-design-icons/svg/outlined/attach_file.svg\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { ReactComponent as RemoveImageIcon } from \"@material-design-icons/svg/outlined/close.svg\";\n\nexport class EmptyStateElementRenderer extends UIRenderer<\n    EmptyStateElement,\n    FileManagerElementRenderProps\n> {\n    public override render({\n        props\n    }: UIRenderParams<EmptyStateElement, FileManagerElementRenderProps>): React.ReactNode {\n        const accept = props.fileManagerElement.getAccept();\n        const acceptsOnlyImages = !accept || accept.every(el => el.startsWith(\"image/\"));\n\n        if (acceptsOnlyImages) {\n            return (\n                <Ui.Image\n                    placeholder={\"Select an image\"}\n                    renderImagePreview={renderImageProps => <Image {...renderImageProps} />}\n                    style={{ width: \"100%\", height: \"auto\" }}\n                    value={props.value}\n                    uploadImage={props.showFileManager}\n                    removeImage={props.onChange}\n                />\n            );\n        }\n\n        if (props.value) {\n            return (\n                <FilePreviewWrapper>\n                    <span>\n                        Attached file: <strong>{props.value.src.split(\"/\").pop()}</strong>\n                    </span>\n\n                    <RemoveImage onClick={() => props.onChange(null)}>\n                        <RemoveImageIcon />\n                    </RemoveImage>\n\n                    <AddImageWrapper data-role={\"select-file\"} onClick={props.showFileManager}>\n                        <AddImageIconWrapper>\n                            <AddFileIcon />\n                            <Typography use={\"caption\"}>Select a file</Typography>\n                        </AddImageIconWrapper>\n                    </AddImageWrapper>\n                </FilePreviewWrapper>\n            );\n        }\n\n        return (\n            <AddImageWrapper data-role={\"select-file\"} onClick={props.showFileManager}>\n                <AddImageIconWrapper>\n                    <AddFileIcon />\n                    <Typography use={\"caption\"}>Select a file</Typography>\n                </AddImageIconWrapper>\n            </AddImageWrapper>\n        );\n    }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","UIRenderer","Ui","Image","AddImageIconWrapper","AddImageWrapper","FilePreviewWrapper","RemoveImage","ReactComponent","AddFileIcon","RemoveImageIcon","Typography","EmptyStateElementRenderer","render","props","accept","fileManagerElement","getAccept","acceptsOnlyImages","every","el","startsWith","createElement","placeholder","renderImagePreview","renderImageProps","style","width","height","value","uploadImage","showFileManager","removeImage","onChange","src","split","pop","onClick","use"],"sources":["EmptyStateElementRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { EmptyStateElement } from \"./EmptyStateElement\";\nimport { UIRenderer, UIRenderParams } from \"~/ui/UIRenderer\";\nimport * as Ui from \"@webiny/ui/ImageUpload\";\nimport { Image } from \"@webiny/app/components\";\nimport { FileManagerElementRenderProps } from \"~/ui/elements/form/FileManagerElement/FileManagerElementRenderer\";\nimport { AddImageIconWrapper, AddImageWrapper, FilePreviewWrapper, RemoveImage } from \"./styled\";\nimport { ReactComponent as AddFileIcon } from \"@webiny/icons/attach_file.svg\";\nimport { ReactComponent as RemoveImageIcon } from \"@webiny/icons/close.svg\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\nexport class EmptyStateElementRenderer extends UIRenderer<\n    EmptyStateElement,\n    FileManagerElementRenderProps\n> {\n    public override render({\n        props\n    }: UIRenderParams<EmptyStateElement, FileManagerElementRenderProps>): React.ReactNode {\n        const accept = props.fileManagerElement.getAccept();\n        const acceptsOnlyImages = !accept || accept.every(el => el.startsWith(\"image/\"));\n\n        if (acceptsOnlyImages) {\n            return (\n                <Ui.Image\n                    placeholder={\"Select an image\"}\n                    renderImagePreview={renderImageProps => <Image {...renderImageProps} />}\n                    style={{ width: \"100%\", height: \"auto\" }}\n                    value={props.value}\n                    uploadImage={props.showFileManager}\n                    removeImage={props.onChange}\n                />\n            );\n        }\n\n        if (props.value) {\n            return (\n                <FilePreviewWrapper>\n                    <span>\n                        Attached file: <strong>{props.value.src.split(\"/\").pop()}</strong>\n                    </span>\n\n                    <RemoveImage onClick={() => props.onChange(null)}>\n                        <RemoveImageIcon />\n                    </RemoveImage>\n\n                    <AddImageWrapper data-role={\"select-file\"} onClick={props.showFileManager}>\n                        <AddImageIconWrapper>\n                            <AddFileIcon />\n                            <Typography use={\"caption\"}>Select a file</Typography>\n                        </AddImageIconWrapper>\n                    </AddImageWrapper>\n                </FilePreviewWrapper>\n            );\n        }\n\n        return (\n            <AddImageWrapper data-role={\"select-file\"} onClick={props.showFileManager}>\n                <AddImageIconWrapper>\n                    <AddFileIcon />\n                    <Typography use={\"caption\"}>Select a file</Typography>\n                </AddImageIconWrapper>\n            </AddImageWrapper>\n        );\n    }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,UAAU;AACnB,OAAO,KAAKC,EAAE,MAAM,wBAAwB;AAC5C,SAASC,KAAK,QAAQ,wBAAwB;AAE9C,SAASC,mBAAmB,EAAEC,eAAe,EAAEC,kBAAkB,EAAEC,WAAW;AAC9E,SAASC,cAAc,IAAIC,WAAW,QAAQ,+BAA+B;AAC7E,SAASD,cAAc,IAAIE,eAAe,QAAQ,yBAAyB;AAC3E,SAASC,UAAU,QAAQ,uBAAuB;AAElD,OAAO,MAAMC,yBAAyB,SAASX,UAAU,CAGvD;EACkBY,MAAMA,CAAC;IACnBC;EAC8D,CAAC,EAAmB;IAClF,MAAMC,MAAM,GAAGD,KAAK,CAACE,kBAAkB,CAACC,SAAS,CAAC,CAAC;IACnD,MAAMC,iBAAiB,GAAG,CAACH,MAAM,IAAIA,MAAM,CAACI,KAAK,CAACC,EAAE,IAAIA,EAAE,CAACC,UAAU,CAAC,QAAQ,CAAC,CAAC;IAEhF,IAAIH,iBAAiB,EAAE;MACnB,oBACIlB,KAAA,CAAAsB,aAAA,CAACpB,EAAE,CAACC,KAAK;QACLoB,WAAW,EAAE,iBAAkB;QAC/BC,kBAAkB,EAAEC,gBAAgB,iBAAIzB,KAAA,CAAAsB,aAAA,CAACnB,KAAK,EAAKsB,gBAAmB,CAAE;QACxEC,KAAK,EAAE;UAAEC,KAAK,EAAE,MAAM;UAAEC,MAAM,EAAE;QAAO,CAAE;QACzCC,KAAK,EAAEf,KAAK,CAACe,KAAM;QACnBC,WAAW,EAAEhB,KAAK,CAACiB,eAAgB;QACnCC,WAAW,EAAElB,KAAK,CAACmB;MAAS,CAC/B,CAAC;IAEV;IAEA,IAAInB,KAAK,CAACe,KAAK,EAAE;MACb,oBACI7B,KAAA,CAAAsB,aAAA,CAAChB,kBAAkB,qBACfN,KAAA,CAAAsB,aAAA,eAAM,iBACa,eAAAtB,KAAA,CAAAsB,aAAA,iBAASR,KAAK,CAACe,KAAK,CAACK,GAAG,CAACC,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAU,CAC/D,CAAC,eAEPpC,KAAA,CAAAsB,aAAA,CAACf,WAAW;QAAC8B,OAAO,EAAEA,CAAA,KAAMvB,KAAK,CAACmB,QAAQ,CAAC,IAAI;MAAE,gBAC7CjC,KAAA,CAAAsB,aAAA,CAACZ,eAAe,MAAE,CACT,CAAC,eAEdV,KAAA,CAAAsB,aAAA,CAACjB,eAAe;QAAC,aAAW,aAAc;QAACgC,OAAO,EAAEvB,KAAK,CAACiB;MAAgB,gBACtE/B,KAAA,CAAAsB,aAAA,CAAClB,mBAAmB,qBAChBJ,KAAA,CAAAsB,aAAA,CAACb,WAAW,MAAE,CAAC,eACfT,KAAA,CAAAsB,aAAA,CAACX,UAAU;QAAC2B,GAAG,EAAE;MAAU,GAAC,eAAyB,CACpC,CACR,CACD,CAAC;IAE7B;IAEA,oBACItC,KAAA,CAAAsB,aAAA,CAACjB,eAAe;MAAC,aAAW,aAAc;MAACgC,OAAO,EAAEvB,KAAK,CAACiB;IAAgB,gBACtE/B,KAAA,CAAAsB,aAAA,CAAClB,mBAAmB,qBAChBJ,KAAA,CAAAsB,aAAA,CAACb,WAAW,MAAE,CAAC,eACfT,KAAA,CAAAsB,aAAA,CAACX,UAAU;MAAC2B,GAAG,EAAE;IAAU,GAAC,eAAyB,CACpC,CACR,CAAC;EAE1B;AACJ","ignoreList":[]}