@webiny/app-admin 0.0.0-mt-3 → 0.0.0-unstable.06b2ede40f

package/ui/views/OverlayView/HeaderTitleElement.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","UIElement","Typography","UIRenderer","HeaderTitleElementRenderer","render","element","createElement","style","margin","color","use","config","title","HeaderTitleElement","constructor","id","addRenderer"],"sources":["HeaderTitleElement.tsx"],"sourcesContent":["import React from \"react\";\nimport type { UIElementConfig } from \"~/ui/UIElement\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport type { UIRenderParams } from \"~/ui/UIRenderer\";\nimport { UIRenderer } from \"~/ui/UIRenderer\";\n\ninterface HeaderTitleElementConfig extends UIElementConfig {\n    title: () => string | null;\n}\n\nexport class HeaderTitleElementRenderer extends UIRenderer<HeaderTitleElement> {\n    public override render({ element }: UIRenderParams<HeaderTitleElement>): React.ReactNode {\n        return (\n            <Typography\n                style={{ margin: \"0 auto\", color: \"var(--mdc-theme-on-surface)\" }}\n                use={\"headline6\"}\n            >\n                {element.config.title()}\n            </Typography>\n        );\n    }\n}\n\nexport class HeaderTitleElement extends UIElement<HeaderTitleElementConfig> {\n    public constructor(id: string, config: HeaderTitleElementConfig) {\n        super(id, config);\n\n        this.addRenderer(new HeaderTitleElementRenderer());\n    }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,SAAS;AAClB,SAASC,UAAU,QAAQ,uBAAuB;AAElD,SAASC,UAAU;AAMnB,OAAO,MAAMC,0BAA0B,SAASD,UAAU,CAAqB;EAC3DE,MAAMA,CAAC;IAAEC;EAA4C,CAAC,EAAmB;IACrF,oBACIN,KAAA,CAAAO,aAAA,CAACL,UAAU;MACPM,KAAK,EAAE;QAAEC,MAAM,EAAE,QAAQ;QAAEC,KAAK,EAAE;MAA8B,CAAE;MAClEC,GAAG,EAAE;IAAY,GAEhBL,OAAO,CAACM,MAAM,CAACC,KAAK,CAAC,CACd,CAAC;EAErB;AACJ;AAEA,OAAO,MAAMC,kBAAkB,SAASb,SAAS,CAA2B;EACjEc,WAAWA,CAACC,EAAU,EAAEJ,MAAgC,EAAE;IAC7D,KAAK,CAACI,EAAE,EAAEJ,MAAM,CAAC;IAEjB,IAAI,CAACK,WAAW,CAAC,IAAIb,0BAA0B,CAAC,CAAC,CAAC;EACtD;AACJ","ignoreList":[]}

package/ui/views/OverlayView/useOverlayView.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
-export declare type UseOverlayView = ReturnType<typeof useOverlayView>;
-export declare function useOverlayView(): {
+export interface UseOverlayView {
     isVisible: boolean;
-    setIsVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-};
+    setIsVisible: (value: boolean) => void;
+}
+export declare const useOverlayView: () => UseOverlayView;

package/ui/views/OverlayView/useOverlayView.js

@@ -1,18 +1,13 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useEffect, useState } from "react";
 import { css } from "emotion";
 import { OverlayView } from "../OverlayView";
-var noScroll = /*#__PURE__*/css({
+const noScroll = css({
   overflow: "hidden",
   height: "100vh"
-}, "label:noScroll;");
-export function useOverlayView() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isVisible = _useState2[0],
-      setIsVisible = _useState2[1];
-
-  useEffect(function () {
+});
+export const useOverlayView = () => {
+  const [isVisible, setIsVisible] = useState(false);
+  useEffect(() => {
     if (isVisible) {
       OverlayView.openedViews++;
       document.body.classList.add(noScroll);
@@ -20,19 +15,20 @@ export function useOverlayView() {
       document.body.classList.remove(noScroll);
     }
   }, [isVisible]);
-  useEffect(function () {
-    return function () {
+  useEffect(() => {
+    return () => {
       if (OverlayView.openedViews > 0) {
         OverlayView.openedViews--;
       }
-
       if (!OverlayView.openedViews) {
         document.body.classList.remove(noScroll);
       }
     };
   }, []);
   return {
-    isVisible: isVisible,
-    setIsVisible: setIsVisible
+    isVisible,
+    setIsVisible
   };
-}
+};
+
+//# sourceMappingURL=useOverlayView.js.map

package/ui/views/OverlayView/useOverlayView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useState","css","OverlayView","noScroll","overflow","height","useOverlayView","isVisible","setIsVisible","openedViews","document","body","classList","add","remove"],"sources":["useOverlayView.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { css } from \"emotion\";\nimport { OverlayView } from \"../OverlayView\";\n\nconst noScroll = css({\n    overflow: \"hidden\",\n    height: \"100vh\"\n});\n\nexport interface UseOverlayView {\n    isVisible: boolean;\n    setIsVisible: (value: boolean) => void;\n}\n\nexport const useOverlayView = (): UseOverlayView => {\n    const [isVisible, setIsVisible] = useState<boolean>(false);\n\n    useEffect(() => {\n        if (isVisible) {\n            OverlayView.openedViews++;\n            document.body.classList.add(noScroll);\n        } else if (!OverlayView.openedViews) {\n            document.body.classList.remove(noScroll);\n        }\n    }, [isVisible]);\n\n    useEffect(() => {\n        return () => {\n            if (OverlayView.openedViews > 0) {\n                OverlayView.openedViews--;\n            }\n            if (!OverlayView.openedViews) {\n                document.body.classList.remove(noScroll);\n            }\n        };\n    }, []);\n\n    return { isVisible, setIsVisible };\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,GAAG,QAAQ,SAAS;AAC7B,SAASC,WAAW;AAEpB,MAAMC,QAAQ,GAAGF,GAAG,CAAC;EACjBG,QAAQ,EAAE,QAAQ;EAClBC,MAAM,EAAE;AACZ,CAAC,CAAC;AAOF,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAsB;EAChD,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGR,QAAQ,CAAU,KAAK,CAAC;EAE1DD,SAAS,CAAC,MAAM;IACZ,IAAIQ,SAAS,EAAE;MACXL,WAAW,CAACO,WAAW,EAAE;MACzBC,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACC,GAAG,CAACV,QAAQ,CAAC;IACzC,CAAC,MAAM,IAAI,CAACD,WAAW,CAACO,WAAW,EAAE;MACjCC,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACE,MAAM,CAACX,QAAQ,CAAC;IAC5C;EACJ,CAAC,EAAE,CAACI,SAAS,CAAC,CAAC;EAEfR,SAAS,CAAC,MAAM;IACZ,OAAO,MAAM;MACT,IAAIG,WAAW,CAACO,WAAW,GAAG,CAAC,EAAE;QAC7BP,WAAW,CAACO,WAAW,EAAE;MAC7B;MACA,IAAI,CAACP,WAAW,CAACO,WAAW,EAAE;QAC1BC,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACE,MAAM,CAACX,QAAQ,CAAC;MAC5C;IACJ,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IAAEI,SAAS;IAAEC;EAAa,CAAC;AACtC,CAAC","ignoreList":[]}

package/ui/views/OverlayView.d.ts

@@ -1,5 +1,7 @@
 import React from "react";
+import type { UIViewProps } from "../UIView";
 import { UIView } from "../UIView";
+import type { UseOverlayView } from "./OverlayView/useOverlayView";
 import { HeaderElement } from "./OverlayView/HeaderElement";
 import { ContentElement } from "./OverlayView/ContentElement";
 interface OnExited {
@@ -19,13 +21,10 @@ export declare class OverlayView extends UIView {
     onExited(): void;
     addOnEntered(cb: OnExited): void;
     addOnExited(cb: OnExited): void;
-    getOverlayHook(): {
-        isVisible: boolean;
-        setIsVisible: React.Dispatch<React.SetStateAction<boolean>>;
-    };
+    getOverlayHook(): UseOverlayView;
     setIsVisible(visible: boolean): void;
     getHeaderElement(): HeaderElement;
     getContentElement(): ContentElement;
-    render(props: any): JSX.Element;
+    render(props: UIViewProps): React.ReactNode;
 }
 export {};

package/ui/views/OverlayView.js

@@ -1,40 +1,30 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _styled from "@emotion/styled/base";
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 import React from "react";
 import { Transition } from "react-transition-group";
-import styled from "@emotion/styled";
 import { UIView } from "../UIView";
 import { useOverlayView } from "./OverlayView/useOverlayView";
 import { HeaderElement } from "./OverlayView/HeaderElement";
-import { ContentElement } from "./OverlayView/ContentElement"; // !GOOD FIRST ISSUE!
+import { ContentElement } from "./OverlayView/ContentElement";
+
+// !GOOD FIRST ISSUE!
 // Extract rendering and styling into an OverlayViewRenderer class.
 
-var OverlayLayoutWrapper = /*#__PURE__*/styled("div", {
+const OverlayLayoutWrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "e1xrojct0"
+} : {
   target: "e1xrojct0",
   label: "OverlayLayoutWrapper"
-})({
-  position: "fixed",
-  width: "100%",
-  height: "100vh",
-  backgroundColor: "var(--mdc-theme-background)",
-
-  /**
-   * Has to be higher than 5 so it's above advanced settings dialog,
-   * and below 20, so the image editor & Dialogs can be displayed above.
-   */
-  zIndex: 18,
-  top: 0,
-  left: 0
+})(process.env.NODE_ENV === "production" ? {
+  name: "iv2ylc",
+  styles: "position:fixed;width:100%;height:100vh;background-color:var(--mdc-theme-background);z-index:21;top:0;left:0"
+} : {
+  name: "iv2ylc",
+  styles: "position:fixed;width:100%;height:100vh;background-color:var(--mdc-theme-background);z-index:21;top:0;left:0",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk92ZXJsYXlWaWV3LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhNkIiLCJmaWxlIjoiT3ZlcmxheVZpZXcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgVHJhbnNpdGlvbiB9IGZyb20gXCJyZWFjdC10cmFuc2l0aW9uLWdyb3VwXCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB0eXBlIHsgVUlWaWV3UHJvcHMgfSBmcm9tIFwifi91aS9VSVZpZXdcIjtcbmltcG9ydCB7IFVJVmlldyB9IGZyb20gXCJ+L3VpL1VJVmlld1wiO1xuaW1wb3J0IHR5cGUgeyBVc2VPdmVybGF5VmlldyB9IGZyb20gXCIuL092ZXJsYXlWaWV3L3VzZU92ZXJsYXlWaWV3XCI7XG5pbXBvcnQgeyB1c2VPdmVybGF5VmlldyB9IGZyb20gXCIuL092ZXJsYXlWaWV3L3VzZU92ZXJsYXlWaWV3XCI7XG5pbXBvcnQgeyBIZWFkZXJFbGVtZW50IH0gZnJvbSBcIi4vT3ZlcmxheVZpZXcvSGVhZGVyRWxlbWVudFwiO1xuaW1wb3J0IHsgQ29udGVudEVsZW1lbnQgfSBmcm9tIFwiLi9PdmVybGF5Vmlldy9Db250ZW50RWxlbWVudFwiO1xuXG4vLyAhR09PRCBGSVJTVCBJU1NVRSFcbi8vIEV4dHJhY3QgcmVuZGVyaW5nIGFuZCBzdHlsaW5nIGludG8gYW4gT3ZlcmxheVZpZXdSZW5kZXJlciBjbGFzcy5cblxuY29uc3QgT3ZlcmxheUxheW91dFdyYXBwZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHBvc2l0aW9uOiBcImZpeGVkXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGhlaWdodDogXCIxMDB2aFwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtYmFja2dyb3VuZClcIixcbiAgICAvKipcbiAgICAgKiBIYXMgdG8gYmUgaGlnaGVyIHRoYW4gNSBzbyBpdCdzIGFib3ZlIGFkdmFuY2VkIHNldHRpbmdzIGRpYWxvZyxcbiAgICAgKiBhbmQgYmVsb3cgMjAsIHNvIHRoZSBpbWFnZSBlZGl0b3IgJiBEaWFsb2dzIGNhbiBiZSBkaXNwbGF5ZWQgYWJvdmUuXG4gICAgICovXG4gICAgekluZGV4OiAyMSxcbiAgICB0b3A6IDAsXG4gICAgbGVmdDogMFxufSk7XG5cbmNvbnN0IGRlZmF1bHRTdHlsZTogUmVjb3JkPHN0cmluZywgc3RyaW5nIHwgbnVtYmVyPiA9IHtcbiAgICB0cmFuc2Zvcm06IFwidHJhbnNsYXRlWSg3NXZoKVwiLFxuICAgIG9wYWNpdHk6IDAsXG4gICAgdHJhbnNpdGlvblByb3BlcnR5OiBcInRyYW5zZm9ybSwgb3BhY2l0eVwiLFxuICAgIHRyYW5zaXRpb25UaW1pbmdGdW5jdGlvbjogXCJjdWJpYy1iZXppZXIoMCwgMCwgLjIsIDEpXCIsXG4gICAgdHJhbnNpdGlvbkR1cmF0aW9uOiBcIjIyNW1zXCIsXG4gICAgd2lsbENoYW5nZTogXCJvcGFjaXR5LCB0cmFuc2Zvcm1cIlxufTtcblxuY29uc3QgdHJhbnNpdGlvblN0eWxlczogUmVjb3JkPHN0cmluZywgYW55PiA9IHtcbiAgICBlbnRlcmluZzoge1xuICAgICAgICB0cmFuc2Zvcm06IFwidHJhbnNsYXRlWSg3NXZoKVwiLFxuICAgICAgICBvcGFjaXR5OiAwXG4gICAgfSxcbiAgICBlbnRlcmVkOiB7XG4gICAgICAgIHRyYW5zZm9ybTogXCJ0cmFuc2xhdGVZKDBweClcIixcbiAgICAgICAgb3BhY2l0eTogMVxuICAgIH1cbn07XG5cbmludGVyZmFjZSBPbkV4aXRlZCB7XG4gICAgKHZpZXc6IE92ZXJsYXlWaWV3KTogdm9pZDtcbn1cblxuaW50ZXJmYWNlIE9uRW50ZXJlZCB7XG4gICAgKHZpZXc6IE92ZXJsYXlWaWV3KTogdm9pZDtcbn1cblxuZXhwb3J0IGNsYXNzIE92ZXJsYXlWaWV3IGV4dGVuZHMgVUlWaWV3IHtcbiAgICAvKipcbiAgICAgKiBUaGlzIHByb3BlcnR5IGlzIHVzZWQgdG8gdHJhY2sgdGhlIGFtb3VudCBvZiBvcGVuZWQgb3ZlcmxheXMuIFNpbmNlIHdlJ3JlIGFwcGx5aW5nIGEgQ1NTIGNsYXNzIHRvIGRpc2FibGVcbiAgICAgKiB3aW5kb3cgc2Nyb2xsLCB3ZSBtdXN0IG1ha2Ugc3VyZSB3ZSBkb24ndCByZW1vdmUgdGhhdCBDU1MgY2xhc3MgdW50aWwgYWxsIHRoZSBvdmVybGF5cyBhcmUgY2xvc2VkLlxuICAgICAqL1xuICAgIHN0YXRpYyBvcGVuZWRWaWV3cyA9IDA7XG4gICAgcHJpdmF0ZSBfb25FbnRlcmVkOiBPbkVudGVyZWRbXSA9IFtdO1xuICAgIHByaXZhdGUgX29uRXhpdGVkOiBPbkV4aXRlZFtdID0gW107XG5cbiAgICBwdWJsaWMgY29uc3RydWN0b3IoaWQgPSBcIk92ZXJsYXlWaWV3XCIpIHtcbiAgICAgICAgc3VwZXIoaWQpO1xuICAgICAgICB0aGlzLnVzZUdyaWQoZmFsc2UpO1xuXG4gICAgICAgIHRoaXMuYWRkSG9va0RlZmluaXRpb24oXCJvdmVybGF5XCIsIHVzZU92ZXJsYXlWaWV3KTtcblxuICAgICAgICB0aGlzLmFkZEVsZW1lbnQoXG4gICAgICAgICAgICBuZXcgSGVhZGVyRWxlbWVudChcIm92ZXJsYXlIZWFkZXJcIiwge1xuICAgICAgICAgICAgICAgIG9uQ2xvc2U6ICgpID0+IHRoaXMuc2V0SXNWaXNpYmxlKGZhbHNlKVxuICAgICAgICAgICAgfSlcbiAgICAgICAgKTtcblxuICAgICAgICB0aGlzLmFkZEVsZW1lbnQobmV3IENvbnRlbnRFbGVtZW50KFwib3ZlcmxheUNvbnRlbnRcIikpO1xuXG4gICAgICAgIHRoaXMuYXBwbHlQbHVnaW5zKE92ZXJsYXlWaWV3KTtcbiAgICB9XG5cbiAgICBwdWJsaWMgc2V0VGl0bGUodGl0bGU6ICgpID0+IHN0cmluZyk6IHZvaWQge1xuICAgICAgICB0aGlzLmdldEhlYWRlckVsZW1lbnQoKS5zZXRUaXRsZSh0aXRsZSk7XG4gICAgfVxuXG4gICAgcHVibGljIG9uRW50ZXJlZCgpOiB2b2lkIHtcbiAgICAgICAgWy4uLnRoaXMuX29uRW50ZXJlZF0ucmV2ZXJzZSgpLmZvckVhY2goY2IgPT4gY2IodGhpcykpO1xuICAgIH1cblxuICAgIHB1YmxpYyBvbkV4aXRlZCgpOiB2b2lkIHtcbiAgICAgICAgWy4uLnRoaXMuX29uRXhpdGVkXS5yZXZlcnNlKCkuZm9yRWFjaChjYiA9PiBjYih0aGlzKSk7XG4gICAgfVxuXG4gICAgcHVibGljIGFkZE9uRW50ZXJlZChjYjogT25FeGl0ZWQpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5fb25FbnRlcmVkLnB1c2goY2IpO1xuICAgIH1cblxuICAgIHB1YmxpYyBhZGRPbkV4aXRlZChjYjogT25FeGl0ZWQpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5fb25FeGl0ZWQucHVzaChjYik7XG4gICAgfVxuXG4gICAgcHVibGljIGdldE92ZXJsYXlIb29rKCk6IFVzZU92ZXJsYXlWaWV3IHtcbiAgICAgICAgcmV0dXJuIHRoaXMuZ2V0SG9vazxVc2VPdmVybGF5Vmlldz4oXCJvdmVybGF5XCIpO1xuICAgIH1cblxuICAgIHB1YmxpYyBzZXRJc1Zpc2libGUodmlzaWJsZTogYm9vbGVhbik6IHZvaWQge1xuICAgICAgICB0aGlzLmdldE92ZXJsYXlIb29rKCkuc2V0SXNWaXNpYmxlKHZpc2libGUpO1xuICAgIH1cblxuICAgIHB1YmxpYyBnZXRIZWFkZXJFbGVtZW50KCk6IEhlYWRlckVsZW1lbnQge1xuICAgICAgICByZXR1cm4gdGhpcy5nZXRFbGVtZW50KFwib3ZlcmxheUhlYWRlclwiKSBhcyBIZWFkZXJFbGVtZW50O1xuICAgIH1cblxuICAgIHB1YmxpYyBnZXRDb250ZW50RWxlbWVudCgpOiBDb250ZW50RWxlbWVudCB7XG4gICAgICAgIHJldHVybiB0aGlzLmdldEVsZW1lbnQoXCJvdmVybGF5Q29udGVudFwiKSBhcyBIZWFkZXJFbGVtZW50O1xuICAgIH1cblxuICAgIHB1YmxpYyBvdmVycmlkZSByZW5kZXIocHJvcHM6IFVJVmlld1Byb3BzKTogUmVhY3QuUmVhY3ROb2RlIHtcbiAgICAgICAgY29uc3QgeyBpc1Zpc2libGUgfSA9IHRoaXMuZ2V0T3ZlcmxheUhvb2soKTtcbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICAgIDxUcmFuc2l0aW9uXG4gICAgICAgICAgICAgICAgaW49e2lzVmlzaWJsZX1cbiAgICAgICAgICAgICAgICB0aW1lb3V0PXsxMDB9XG4gICAgICAgICAgICAgICAgYXBwZWFyXG4gICAgICAgICAgICAgICAgb25FeGl0ZWQ9eygpID0+IHRoaXMub25FeGl0ZWQoKX1cbiAgICAgICAgICAgICAgICBvbkVudGVyZWQ9eygpID0+IHRoaXMub25FbnRlcmVkKCl9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3N0YXRlID0+IChcbiAgICAgICAgICAgICAgICAgICAgPE92ZXJsYXlMYXlvdXRXcmFwcGVyIHN0eWxlPXt7IC4uLmRlZmF1bHRTdHlsZSwgLi4udHJhbnNpdGlvblN0eWxlc1tzdGF0ZV0gfX0+XG4gICAgICAgICAgICAgICAgICAgICAgICB7c3VwZXIucmVuZGVyKHByb3BzKX1cbiAgICAgICAgICAgICAgICAgICAgPC9PdmVybGF5TGF5b3V0V3JhcHBlcj5cbiAgICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgPC9UcmFuc2l0aW9uPlxuICAgICAgICApO1xuICAgIH1cbn1cbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
-var defaultStyle = {
+const defaultStyle = {
   transform: "translateY(75vh)",
   opacity: 0,
   transitionProperty: "transform, opacity",
@@ -42,7 +32,7 @@ var defaultStyle = {
   transitionDuration: "225ms",
   willChange: "opacity, transform"
 };
-var transitionStyles = {
+const transitionStyles = {
   entering: {
     transform: "translateY(75vh)",
     opacity: 0
@@ -52,125 +42,68 @@ var transitionStyles = {
     opacity: 1
   }
 };
-export var OverlayView = /*#__PURE__*/function (_UIView) {
-  _inherits(OverlayView, _UIView);
-
-  var _super = _createSuper(OverlayView);
-
+export class OverlayView extends UIView {
   /**
    * This property is used to track the amount of opened overlays. Since we're applying a CSS class to disable
    * window scroll, we must make sure we don't remove that CSS class until all the overlays are closed.
    */
-  function OverlayView() {
-    var _this;
-
-    var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "OverlayView";
-
-    _classCallCheck(this, OverlayView);
-
-    _this = _super.call(this, id);
-
-    _defineProperty(_assertThisInitialized(_this), "_onEntered", []);
-
-    _defineProperty(_assertThisInitialized(_this), "_onExited", []);
-
-    _this.useGrid(false);
-
-    _this.addHookDefinition("overlay", useOverlayView);
-
-    _this.addElement(new HeaderElement("overlayHeader", {
-      onClose: function onClose() {
-        return _this.setIsVisible(false);
-      }
+  static openedViews = 0;
+  _onEntered = [];
+  _onExited = [];
+  constructor(id = "OverlayView") {
+    super(id);
+    this.useGrid(false);
+    this.addHookDefinition("overlay", useOverlayView);
+    this.addElement(new HeaderElement("overlayHeader", {
+      onClose: () => this.setIsVisible(false)
     }));
-
-    _this.addElement(new ContentElement("overlayContent"));
-
-    _this.applyPlugins(OverlayView);
-
-    return _this;
+    this.addElement(new ContentElement("overlayContent"));
+    this.applyPlugins(OverlayView);
   }
+  setTitle(title) {
+    this.getHeaderElement().setTitle(title);
+  }
+  onEntered() {
+    [...this._onEntered].reverse().forEach(cb => cb(this));
+  }
+  onExited() {
+    [...this._onExited].reverse().forEach(cb => cb(this));
+  }
+  addOnEntered(cb) {
+    this._onEntered.push(cb);
+  }
+  addOnExited(cb) {
+    this._onExited.push(cb);
+  }
+  getOverlayHook() {
+    return this.getHook("overlay");
+  }
+  setIsVisible(visible) {
+    this.getOverlayHook().setIsVisible(visible);
+  }
+  getHeaderElement() {
+    return this.getElement("overlayHeader");
+  }
+  getContentElement() {
+    return this.getElement("overlayContent");
+  }
+  render(props) {
+    const {
+      isVisible
+    } = this.getOverlayHook();
+    return /*#__PURE__*/React.createElement(Transition, {
+      in: isVisible,
+      timeout: 100,
+      appear: true,
+      onExited: () => this.onExited(),
+      onEntered: () => this.onEntered()
+    }, state => /*#__PURE__*/React.createElement(OverlayLayoutWrapper, {
+      style: {
+        ...defaultStyle,
+        ...transitionStyles[state]
+      }
+    }, super.render(props)));
+  }
+}
 
-  _createClass(OverlayView, [{
-    key: "setTitle",
-    value: function setTitle(title) {
-      this.getHeaderElement().setTitle(title);
-    }
-  }, {
-    key: "onEntered",
-    value: function onEntered() {
-      var _this2 = this;
-
-      _toConsumableArray(this._onEntered).reverse().forEach(function (cb) {
-        return cb(_this2);
-      });
-    }
-  }, {
-    key: "onExited",
-    value: function onExited() {
-      var _this3 = this;
-
-      _toConsumableArray(this._onExited).reverse().forEach(function (cb) {
-        return cb(_this3);
-      });
-    }
-  }, {
-    key: "addOnEntered",
-    value: function addOnEntered(cb) {
-      this._onEntered.push(cb);
-    }
-  }, {
-    key: "addOnExited",
-    value: function addOnExited(cb) {
-      this._onExited.push(cb);
-    }
-  }, {
-    key: "getOverlayHook",
-    value: function getOverlayHook() {
-      return this.getHook("overlay");
-    }
-  }, {
-    key: "setIsVisible",
-    value: function setIsVisible(visible) {
-      this.getOverlayHook().setIsVisible(visible);
-    }
-  }, {
-    key: "getHeaderElement",
-    value: function getHeaderElement() {
-      return this.getElement("overlayHeader");
-    }
-  }, {
-    key: "getContentElement",
-    value: function getContentElement() {
-      return this.getElement("overlayContent");
-    }
-  }, {
-    key: "render",
-    value: function render(props) {
-      var _this4 = this;
-
-      var _this$getOverlayHook = this.getOverlayHook(),
-          isVisible = _this$getOverlayHook.isVisible;
-
-      return /*#__PURE__*/React.createElement(Transition, {
-        in: isVisible,
-        timeout: 100,
-        appear: true,
-        onExited: function onExited() {
-          return _this4.onExited();
-        },
-        onEntered: function onEntered() {
-          return _this4.onEntered();
-        }
-      }, function (state) {
-        return /*#__PURE__*/React.createElement(OverlayLayoutWrapper, {
-          style: _objectSpread(_objectSpread({}, defaultStyle), transitionStyles[state])
-        }, _get(_getPrototypeOf(OverlayView.prototype), "render", _this4).call(_this4, props));
-      });
-    }
-  }]);
-
-  return OverlayView;
-}(UIView);
-
-_defineProperty(OverlayView, "openedViews", 0);
+//# sourceMappingURL=OverlayView.js.map

package/ui/views/OverlayView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Transition","UIView","useOverlayView","HeaderElement","ContentElement","OverlayLayoutWrapper","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","defaultStyle","transform","opacity","transitionProperty","transitionTimingFunction","transitionDuration","willChange","transitionStyles","entering","entered","OverlayView","openedViews","_onEntered","_onExited","constructor","id","useGrid","addHookDefinition","addElement","onClose","setIsVisible","applyPlugins","setTitle","title","getHeaderElement","onEntered","reverse","forEach","cb","onExited","addOnEntered","push","addOnExited","getOverlayHook","getHook","visible","getElement","getContentElement","render","props","isVisible","createElement","in","timeout","appear","state","style"],"sources":["OverlayView.tsx"],"sourcesContent":["import React from \"react\";\nimport { Transition } from \"react-transition-group\";\nimport styled from \"@emotion/styled\";\nimport type { UIViewProps } from \"~/ui/UIView\";\nimport { UIView } from \"~/ui/UIView\";\nimport type { UseOverlayView } from \"./OverlayView/useOverlayView\";\nimport { useOverlayView } from \"./OverlayView/useOverlayView\";\nimport { HeaderElement } from \"./OverlayView/HeaderElement\";\nimport { ContentElement } from \"./OverlayView/ContentElement\";\n\n// !GOOD FIRST ISSUE!\n// Extract rendering and styling into an OverlayViewRenderer class.\n\nconst OverlayLayoutWrapper = styled(\"div\")({\n    position: \"fixed\",\n    width: \"100%\",\n    height: \"100vh\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    /**\n     * Has to be higher than 5 so it's above advanced settings dialog,\n     * and below 20, so the image editor & Dialogs can be displayed above.\n     */\n    zIndex: 21,\n    top: 0,\n    left: 0\n});\n\nconst defaultStyle: Record<string, string | number> = {\n    transform: \"translateY(75vh)\",\n    opacity: 0,\n    transitionProperty: \"transform, opacity\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, .2, 1)\",\n    transitionDuration: \"225ms\",\n    willChange: \"opacity, transform\"\n};\n\nconst transitionStyles: Record<string, any> = {\n    entering: {\n        transform: \"translateY(75vh)\",\n        opacity: 0\n    },\n    entered: {\n        transform: \"translateY(0px)\",\n        opacity: 1\n    }\n};\n\ninterface OnExited {\n    (view: OverlayView): void;\n}\n\ninterface OnEntered {\n    (view: OverlayView): void;\n}\n\nexport class OverlayView extends UIView {\n    /**\n     * This property is used to track the amount of opened overlays. Since we're applying a CSS class to disable\n     * window scroll, we must make sure we don't remove that CSS class until all the overlays are closed.\n     */\n    static openedViews = 0;\n    private _onEntered: OnEntered[] = [];\n    private _onExited: OnExited[] = [];\n\n    public constructor(id = \"OverlayView\") {\n        super(id);\n        this.useGrid(false);\n\n        this.addHookDefinition(\"overlay\", useOverlayView);\n\n        this.addElement(\n            new HeaderElement(\"overlayHeader\", {\n                onClose: () => this.setIsVisible(false)\n            })\n        );\n\n        this.addElement(new ContentElement(\"overlayContent\"));\n\n        this.applyPlugins(OverlayView);\n    }\n\n    public setTitle(title: () => string): void {\n        this.getHeaderElement().setTitle(title);\n    }\n\n    public onEntered(): void {\n        [...this._onEntered].reverse().forEach(cb => cb(this));\n    }\n\n    public onExited(): void {\n        [...this._onExited].reverse().forEach(cb => cb(this));\n    }\n\n    public addOnEntered(cb: OnExited): void {\n        this._onEntered.push(cb);\n    }\n\n    public addOnExited(cb: OnExited): void {\n        this._onExited.push(cb);\n    }\n\n    public getOverlayHook(): UseOverlayView {\n        return this.getHook<UseOverlayView>(\"overlay\");\n    }\n\n    public setIsVisible(visible: boolean): void {\n        this.getOverlayHook().setIsVisible(visible);\n    }\n\n    public getHeaderElement(): HeaderElement {\n        return this.getElement(\"overlayHeader\") as HeaderElement;\n    }\n\n    public getContentElement(): ContentElement {\n        return this.getElement(\"overlayContent\") as HeaderElement;\n    }\n\n    public override render(props: UIViewProps): React.ReactNode {\n        const { isVisible } = this.getOverlayHook();\n        return (\n            <Transition\n                in={isVisible}\n                timeout={100}\n                appear\n                onExited={() => this.onExited()}\n                onEntered={() => this.onEntered()}\n            >\n                {state => (\n                    <OverlayLayoutWrapper style={{ ...defaultStyle, ...transitionStyles[state] }}>\n                        {super.render(props)}\n                    </OverlayLayoutWrapper>\n                )}\n            </Transition>\n        );\n    }\n}\n"],"mappings":"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","ignoreList":[]}

package/ui/views/SplitView/SplitViewPanelElement.d.ts

@@ -1,4 +1,5 @@
-/// <reference types="react" />
+import React from "react";
+import type { UiElementRenderProps } from "../../UIElement";
 import { UIElement } from "../../UIElement";
 export declare class SplitViewPanelElement extends UIElement<any> {
     private _width;
@@ -7,5 +8,5 @@ export declare class SplitViewPanelElement extends UIElement<any> {
     addClassName(className: string): void;
     removeClassName(className: string): void;
     setContentElement(element: UIElement): void;
-    render(props: any): JSX.Element;
+    render(props: UiElementRenderProps): React.ReactNode;
 }

package/ui/views/SplitView/SplitViewPanelElement.js

@@ -1,72 +1,32 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from "react";
 import classNames from "classnames";
 import { UIElement } from "../../UIElement";
 import { Cell } from "@webiny/ui/Grid";
-export var SplitViewPanelElement = /*#__PURE__*/function (_UIElement) {
-  _inherits(SplitViewPanelElement, _UIElement);
-
-  var _super = _createSuper(SplitViewPanelElement);
-
-  function SplitViewPanelElement() {
-    var _this;
-
-    _classCallCheck(this, SplitViewPanelElement);
-
-    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));
-
-    _defineProperty(_assertThisInitialized(_this), "_width", 12);
-
-    _defineProperty(_assertThisInitialized(_this), "_classNames", new Set());
-
-    return _this;
+export class SplitViewPanelElement extends UIElement {
+  _width = 12;
+  _classNames = new Set();
+  setWidth(width) {
+    this._width = width;
   }
+  addClassName(className) {
+    this._classNames.add(className);
+  }
+  removeClassName(className) {
+    this._classNames.delete(className);
+  }
+  setContentElement(element) {
+    // Remove previous content
+    this.getChildren().forEach(el => el.remove());
 
-  _createClass(SplitViewPanelElement, [{
-    key: "setWidth",
-    value: function setWidth(width) {
-      this._width = width;
-    }
-  }, {
-    key: "addClassName",
-    value: function addClassName(className) {
-      this._classNames.add(className);
-    }
-  }, {
-    key: "removeClassName",
-    value: function removeClassName(className) {
-      this._classNames.delete(className);
-    }
-  }, {
-    key: "setContentElement",
-    value: function setContentElement(element) {
-      // Remove previous content
-      this.getChildren().forEach(function (el) {
-        return el.remove();
-      }); // Add new content
-
-      this.addElement(element);
-    }
-  }, {
-    key: "render",
-    value: function render(props) {
-      return /*#__PURE__*/React.createElement(Cell, {
-        span: this._width,
-        className: classNames(Array.from(this._classNames.values()))
-      }, _get(_getPrototypeOf(SplitViewPanelElement.prototype), "render", this).call(this, props));
-    }
-  }]);
+    // Add new content
+    this.addElement(element);
+  }
+  render(props) {
+    return /*#__PURE__*/React.createElement(Cell, {
+      span: this._width,
+      className: classNames(Array.from(this._classNames.values()))
+    }, super.render(props));
+  }
+}
 
-  return SplitViewPanelElement;
-}(UIElement);
+//# sourceMappingURL=SplitViewPanelElement.js.map

package/ui/views/SplitView/SplitViewPanelElement.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","classNames","UIElement","Cell","SplitViewPanelElement","_width","_classNames","Set","setWidth","width","addClassName","className","add","removeClassName","delete","setContentElement","element","getChildren","forEach","el","remove","addElement","render","props","createElement","span","Array","from","values"],"sources":["SplitViewPanelElement.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport type { UiElementRenderProps } from \"~/ui/UIElement\";\nimport { UIElement } from \"~/ui/UIElement\";\nimport { Cell } from \"@webiny/ui/Grid\";\n\nexport class SplitViewPanelElement extends UIElement<any> {\n    private _width = 12;\n    private _classNames: Set<string> = new Set();\n\n    public setWidth(width: number): void {\n        this._width = width;\n    }\n\n    public addClassName(className: string): void {\n        this._classNames.add(className);\n    }\n\n    public removeClassName(className: string): void {\n        this._classNames.delete(className);\n    }\n\n    public setContentElement(element: UIElement): void {\n        // Remove previous content\n        this.getChildren().forEach(el => el.remove());\n\n        // Add new content\n        this.addElement(element);\n    }\n\n    public override render(props: UiElementRenderProps): React.ReactNode {\n        return (\n            <Cell span={this._width} className={classNames(Array.from(this._classNames.values()))}>\n                {super.render(props)}\n            </Cell>\n        );\n    }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,SAAS;AAClB,SAASC,IAAI,QAAQ,iBAAiB;AAEtC,OAAO,MAAMC,qBAAqB,SAASF,SAAS,CAAM;EAC9CG,MAAM,GAAG,EAAE;EACXC,WAAW,GAAgB,IAAIC,GAAG,CAAC,CAAC;EAErCC,QAAQA,CAACC,KAAa,EAAQ;IACjC,IAAI,CAACJ,MAAM,GAAGI,KAAK;EACvB;EAEOC,YAAYA,CAACC,SAAiB,EAAQ;IACzC,IAAI,CAACL,WAAW,CAACM,GAAG,CAACD,SAAS,CAAC;EACnC;EAEOE,eAAeA,CAACF,SAAiB,EAAQ;IAC5C,IAAI,CAACL,WAAW,CAACQ,MAAM,CAACH,SAAS,CAAC;EACtC;EAEOI,iBAAiBA,CAACC,OAAkB,EAAQ;IAC/C;IACA,IAAI,CAACC,WAAW,CAAC,CAAC,CAACC,OAAO,CAACC,EAAE,IAAIA,EAAE,CAACC,MAAM,CAAC,CAAC,CAAC;;IAE7C;IACA,IAAI,CAACC,UAAU,CAACL,OAAO,CAAC;EAC5B;EAEgBM,MAAMA,CAACC,KAA2B,EAAmB;IACjE,oBACIvB,KAAA,CAAAwB,aAAA,CAACrB,IAAI;MAACsB,IAAI,EAAE,IAAI,CAACpB,MAAO;MAACM,SAAS,EAAEV,UAAU,CAACyB,KAAK,CAACC,IAAI,CAAC,IAAI,CAACrB,WAAW,CAACsB,MAAM,CAAC,CAAC,CAAC;IAAE,GACjF,KAAK,CAACN,MAAM,CAACC,KAAK,CACjB,CAAC;EAEf;AACJ","ignoreList":[]}

package/ui/views/SplitView.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { UIElement } from "../UIElement";
+import type { UIElement } from "../UIElement";
 import { SplitViewPanelElement } from "./SplitView/SplitViewPanelElement";
 import { UIView } from "../UIView";
 interface SplitViewConfig {
@@ -8,9 +8,9 @@ interface SplitViewConfig {
 }
 export declare class SplitView extends UIView {
     private _classNames;
-    private _leftPanel;
-    private _rightPanel;
-    constructor(id: any, config?: SplitViewConfig);
+    private _leftPanel?;
+    private _rightPanel?;
+    constructor(id: string, config?: SplitViewConfig);
     addClassName(className: string): void;
     removeClassName(className: string): void;
     getLeftPanel(): SplitViewPanelElement;