@webiny/app-admin 0.0.0-unstable.aa00eecd97 → 0.0.0-unstable.ac6ebf63c6

package/base/providers/AdminUiStateProvider.js

@@ -0,0 +1,14 @@
+import React from "react";
+import { UiProvider } from "@webiny/app/contexts/Ui/index.js";
+import { createProvider } from "@webiny/app";
+export const createAdminUiStateProvider = () => {
+  return createProvider(Component => {
+    return function AdminUiStateProvider({
+      children
+    }) {
+      return /*#__PURE__*/React.createElement(UiProvider, null, /*#__PURE__*/React.createElement(Component, null, children));
+    };
+  });
+};
+
+//# sourceMappingURL=AdminUiStateProvider.js.map

package/base/providers/AdminUiStateProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","UiProvider","createProvider","createAdminUiStateProvider","Component","AdminUiStateProvider","children","createElement"],"sources":["AdminUiStateProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { UiProvider } from \"@webiny/app/contexts/Ui/index.js\";\nimport { createProvider } from \"@webiny/app\";\n\ninterface AdminUiStateProviderProps {\n    children: React.ReactNode;\n}\n\nexport const createAdminUiStateProvider = () => {\n    return createProvider(Component => {\n        return function AdminUiStateProvider({ children }: AdminUiStateProviderProps) {\n            return (\n                <UiProvider>\n                    <Component>{children}</Component>\n                </UiProvider>\n            );\n        };\n    });\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,QAAQ,kCAAkC;AAC7D,SAASC,cAAc,QAAQ,aAAa;AAM5C,OAAO,MAAMC,0BAA0B,GAAGA,CAAA,KAAM;EAC5C,OAAOD,cAAc,CAACE,SAAS,IAAI;IAC/B,OAAO,SAASC,oBAAoBA,CAAC;MAAEC;IAAoC,CAAC,EAAE;MAC1E,oBACIN,KAAA,CAAAO,aAAA,CAACN,UAAU,qBACPD,KAAA,CAAAO,aAAA,CAACH,SAAS,QAAEE,QAAoB,CACxB,CAAC;IAErB,CAAC;EACL,CAAC,CAAC;AACN,CAAC","ignoreList":[]}

package/base/providers/ApolloProvider.d.ts

@@ -1,10 +1,13 @@
 import React from "react";
-import ApolloClient from "apollo-client";
+import type ApolloClient from "apollo-client";
 interface Options {
     uri: string;
 }
 export interface ApolloClientFactory {
     (options: Options): ApolloClient<any>;
 }
-export declare const createApolloProvider: (clientFactory: ApolloClientFactory) => React.FC<{}>;
+interface ApolloProviderProps {
+    children: React.ReactNode;
+}
+export declare const createApolloProvider: (apolloClient: ApolloClient<any>) => ({ children }: ApolloProviderProps) => React.JSX.Element;
 export {};

package/base/providers/ApolloProvider.js

@@ -1,21 +1,13 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createApolloProvider = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactComponents = require("@apollo/react-components");
-var createApolloProvider = function createApolloProvider(clientFactory) {
-  return function ApolloProvider(_ref) {
-    var children = _ref.children;
-    var uri = process.env.REACT_APP_GRAPHQL_API_URL;
-    return /*#__PURE__*/_react.default.createElement(_reactComponents.ApolloProvider, {
-      client: clientFactory({
-        uri: uri
-      })
+import React from "react";
+import { ApolloProvider as Apollo } from "@apollo/react-components";
+export const createApolloProvider = apolloClient => {
+  return function ApolloProvider({
+    children
+  }) {
+    return /*#__PURE__*/React.createElement(Apollo, {
+      client: apolloClient
     }, children);
   };
 };
-exports.createApolloProvider = createApolloProvider;
+
+//# sourceMappingURL=ApolloProvider.js.map

package/base/providers/ApolloProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["createApolloProvider","clientFactory","ApolloProvider","children","uri","process","env","REACT_APP_GRAPHQL_API_URL"],"sources":["ApolloProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { ApolloProvider as Apollo } from \"@apollo/react-components\";\nimport ApolloClient from \"apollo-client\";\n\ninterface Options {\n    uri: string;\n}\n\nexport interface ApolloClientFactory {\n    (options: Options): ApolloClient<any>;\n}\n\nexport const createApolloProvider = (clientFactory: ApolloClientFactory) => {\n    return function ApolloProvider({ children }) {\n        const uri = process.env.REACT_APP_GRAPHQL_API_URL as string;\n        return <Apollo client={clientFactory({ uri })}>{children}</Apollo>;\n    } as React.FC;\n};\n"],"mappings":";;;;;;;AAAA;AACA;AAWO,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAoB,CAAIC,aAAkC,EAAK;EACxE,OAAO,SAASC,cAAc,OAAe;IAAA,IAAZC,QAAQ,QAARA,QAAQ;IACrC,IAAMC,GAAG,GAAGC,OAAO,CAACC,GAAG,CAACC,yBAAmC;IAC3D,oBAAO,6BAAC,+BAAM;MAAC,MAAM,EAAEN,aAAa,CAAC;QAAEG,GAAG,EAAHA;MAAI,CAAC;IAAE,GAAED,QAAQ,CAAU;EACtE,CAAC;AACL,CAAC;AAAC"}
+{"version":3,"names":["React","ApolloProvider","Apollo","createApolloProvider","apolloClient","children","createElement","client"],"sources":["ApolloProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { ApolloProvider as Apollo } from \"@apollo/react-components\";\nimport type ApolloClient from \"apollo-client\";\n\ninterface Options {\n    uri: string;\n}\n\nexport interface ApolloClientFactory {\n    (options: Options): ApolloClient<any>;\n}\n\ninterface ApolloProviderProps {\n    children: React.ReactNode;\n}\n\nexport const createApolloProvider = (apolloClient: ApolloClient<any>) => {\n    return function ApolloProvider({ children }: ApolloProviderProps) {\n        return <Apollo client={apolloClient}>{children}</Apollo>;\n    };\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,MAAM,QAAQ,0BAA0B;AAenE,OAAO,MAAMC,oBAAoB,GAAIC,YAA+B,IAAK;EACrE,OAAO,SAASH,cAAcA,CAAC;IAAEI;EAA8B,CAAC,EAAE;IAC9D,oBAAOL,KAAA,CAAAM,aAAA,CAACJ,MAAM;MAACK,MAAM,EAAEH;IAAa,GAAEC,QAAiB,CAAC;EAC5D,CAAC;AACL,CAAC","ignoreList":[]}

package/base/providers/UiProviders.d.ts

@@ -0,0 +1 @@
+export declare const createUiProviders: () => import("@webiny/app").Decorator<import("@webiny/app").GenericComponent<import("@webiny/app").ChildrenProps>>;

package/base/providers/UiProviders.js

@@ -0,0 +1,35 @@
+import React from "react";
+import { createProvider, SimpleLink } from "@webiny/app";
+import { AdminUiProvider } from "@webiny/admin-ui";
+// @ts-expect-error Remove this one moduleResolution is set to `bundler`
+import { compiler } from "markdown-to-jsx/react";
+const options = {
+  overrides: {
+    a: {
+      component: ({
+        children,
+        ...props
+      }) => /*#__PURE__*/React.createElement("a", Object.assign({}, props, {
+        target: "_blank",
+        rel: "noopener noreferrer"
+      }), children)
+    }
+  }
+};
+const markdownCompiler = markdown => {
+  return compiler(markdown, options);
+};
+export const createUiProviders = () => {
+  return createProvider(Component => {
+    return function UiProviders({
+      children
+    }) {
+      return /*#__PURE__*/React.createElement(AdminUiProvider, {
+        linkComponent: SimpleLink,
+        markdownCompiler: markdownCompiler
+      }, /*#__PURE__*/React.createElement(Component, null, children));
+    };
+  });
+};
+
+//# sourceMappingURL=UiProviders.js.map

package/base/providers/UiProviders.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","createProvider","SimpleLink","AdminUiProvider","compiler","options","overrides","a","component","children","props","createElement","Object","assign","target","rel","markdownCompiler","markdown","createUiProviders","Component","UiProviders","linkComponent"],"sources":["UiProviders.tsx"],"sourcesContent":["import React from \"react\";\nimport { createProvider, SimpleLink } from \"@webiny/app\";\nimport { AdminUiProvider } from \"@webiny/admin-ui\";\n// @ts-expect-error Remove this one moduleResolution is set to `bundler`\nimport { compiler } from \"markdown-to-jsx/react\";\n\nconst options = {\n    overrides: {\n        a: {\n            component: ({ children, ...props }: any) => (\n                <a {...props} target=\"_blank\" rel=\"noopener noreferrer\">\n                    {children}\n                </a>\n            )\n        }\n    }\n};\n\nconst markdownCompiler = (markdown: string) => {\n    return compiler(markdown, options);\n};\n\ninterface UiProvidersProps {\n    children: React.ReactNode;\n}\n\nexport const createUiProviders = () => {\n    return createProvider(Component => {\n        return function UiProviders({ children }: UiProvidersProps) {\n            return (\n                <AdminUiProvider linkComponent={SimpleLink} markdownCompiler={markdownCompiler}>\n                    <Component>{children}</Component>\n                </AdminUiProvider>\n            );\n        };\n    });\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,EAAEC,UAAU,QAAQ,aAAa;AACxD,SAASC,eAAe,QAAQ,kBAAkB;AAClD;AACA,SAASC,QAAQ,QAAQ,uBAAuB;AAEhD,MAAMC,OAAO,GAAG;EACZC,SAAS,EAAE;IACPC,CAAC,EAAE;MACCC,SAAS,EAAEA,CAAC;QAAEC,QAAQ;QAAE,GAAGC;MAAW,CAAC,kBACnCV,KAAA,CAAAW,aAAA,MAAAC,MAAA,CAAAC,MAAA,KAAOH,KAAK;QAAEI,MAAM,EAAC,QAAQ;QAACC,GAAG,EAAC;MAAqB,IAClDN,QACF;IAEX;EACJ;AACJ,CAAC;AAED,MAAMO,gBAAgB,GAAIC,QAAgB,IAAK;EAC3C,OAAOb,QAAQ,CAACa,QAAQ,EAAEZ,OAAO,CAAC;AACtC,CAAC;AAMD,OAAO,MAAMa,iBAAiB,GAAGA,CAAA,KAAM;EACnC,OAAOjB,cAAc,CAACkB,SAAS,IAAI;IAC/B,OAAO,SAASC,WAAWA,CAAC;MAAEX;IAA2B,CAAC,EAAE;MACxD,oBACIT,KAAA,CAAAW,aAAA,CAACR,eAAe;QAACkB,aAAa,EAAEnB,UAAW;QAACc,gBAAgB,EAAEA;MAAiB,gBAC3EhB,KAAA,CAAAW,aAAA,CAACQ,SAAS,QAAEV,QAAoB,CACnB,CAAC;IAE1B,CAAC;EACL,CAAC,CAAC;AACN,CAAC","ignoreList":[]}

package/base/providers/UiStateProvider.d.ts

@@ -1,2 +1 @@
-import React from "react";
-export declare const createUiStateProvider: () => (Component: React.ComponentType<unknown>) => React.FC;
+export declare const createUiStateProvider: () => import("@webiny/app").Decorator<import("@webiny/app").GenericComponent<import("@webiny/app").ChildrenProps>>;

package/base/providers/UiStateProvider.js

@@ -1,18 +1,14 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createUiStateProvider = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Ui = require("@webiny/app/contexts/Ui");
-var createUiStateProvider = function createUiStateProvider() {
-  return function (Component) {
-    return function UiStateProvider(_ref) {
-      var children = _ref.children;
-      return /*#__PURE__*/_react.default.createElement(_Ui.UiProvider, null, /*#__PURE__*/_react.default.createElement(Component, null, children));
+import React from "react";
+import { UiProvider } from "@webiny/app/contexts/Ui/index.js";
+import { createProvider } from "@webiny/app";
+export const createUiStateProvider = () => {
+  return createProvider(Component => {
+    return function UiStateProvider({
+      children
+    }) {
+      return /*#__PURE__*/React.createElement(UiProvider, null, /*#__PURE__*/React.createElement(Component, null, children));
     };
-  };
+  });
 };
-exports.createUiStateProvider = createUiStateProvider;
+
+//# sourceMappingURL=UiStateProvider.js.map

package/base/providers/UiStateProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["createUiStateProvider","Component","UiStateProvider","children"],"sources":["UiStateProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { UiProvider } from \"@webiny/app/contexts/Ui\";\n\nexport const createUiStateProvider =\n    () =>\n    (Component: React.ComponentType<unknown>): React.FC => {\n        return function UiStateProvider({ children }) {\n            return (\n                <UiProvider>\n                    <Component>{children}</Component>\n                </UiProvider>\n            );\n        };\n    };\n"],"mappings":";;;;;;;AAAA;AACA;AAEO,IAAMA,qBAAqB,GAC9B,SADSA,qBAAqB;EAAA,OAE9B,UAACC,SAAuC,EAAe;IACnD,OAAO,SAASC,eAAe,OAAe;MAAA,IAAZC,QAAQ,QAARA,QAAQ;MACtC,oBACI,6BAAC,cAAU,qBACP,6BAAC,SAAS,QAAEA,QAAQ,CAAa,CACxB;IAErB,CAAC;EACL,CAAC;AAAA;AAAC"}
+{"version":3,"names":["React","UiProvider","createProvider","createUiStateProvider","Component","UiStateProvider","children","createElement"],"sources":["UiStateProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { UiProvider } from \"@webiny/app/contexts/Ui/index.js\";\nimport { createProvider } from \"@webiny/app\";\n\ninterface UiStateProviderProps {\n    children: React.ReactNode;\n}\n\nexport const createUiStateProvider = () => {\n    return createProvider(Component => {\n        return function UiStateProvider({ children }: UiStateProviderProps) {\n            return (\n                <UiProvider>\n                    <Component>{children}</Component>\n                </UiProvider>\n            );\n        };\n    });\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,QAAQ,kCAAkC;AAC7D,SAASC,cAAc,QAAQ,aAAa;AAM5C,OAAO,MAAMC,qBAAqB,GAAGA,CAAA,KAAM;EACvC,OAAOD,cAAc,CAACE,SAAS,IAAI;IAC/B,OAAO,SAASC,eAAeA,CAAC;MAAEC;IAA+B,CAAC,EAAE;MAChE,oBACIN,KAAA,CAAAO,aAAA,CAACN,UAAU,qBACPD,KAAA,CAAAO,aAAA,CAACH,SAAS,QAAEE,QAAoB,CACxB,CAAC;IAErB,CAAC;EACL,CAAC,CAAC;AACN,CAAC","ignoreList":[]}

package/base/ui/Brand.d.ts

@@ -1,2 +1,39 @@
-export declare const Brand: import("@webiny/app").ComposableFC<unknown>;
-export declare const BrandRenderer: import("@webiny/app").ComposableFC<unknown>;
+import React from "react";
+export declare const Brand: (() => React.JSX.Element) & {
+    original: () => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (() => React.JSX.Element) & {
+        original: () => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/app").ComponentDecorator<(() => React.JSX.Element) & {
+        original: () => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export declare const BrandRenderer: ((props: unknown) => JSX.Element | null) & {
+    original: (props: unknown) => JSX.Element | null;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: unknown) => JSX.Element | null) & {
+        original: (props: unknown) => JSX.Element | null;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/app").ComponentDecorator<((props: unknown) => JSX.Element | null) & {
+        original: (props: unknown) => JSX.Element | null;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};

package/base/ui/Brand.js

@@ -1,15 +1,8 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.BrandRenderer = exports.Brand = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _app = require("@webiny/app");
-var Brand = (0, _app.makeComposable)("Brand", function () {
-  return /*#__PURE__*/_react.default.createElement(BrandRenderer, null);
+import React from "react";
+import { createVoidComponent, makeDecoratable } from "@webiny/app";
+export const Brand = makeDecoratable("Brand", () => {
+  return /*#__PURE__*/React.createElement(BrandRenderer, null);
 });
-exports.Brand = Brand;
-var BrandRenderer = (0, _app.makeComposable)("BrandRenderer");
-exports.BrandRenderer = BrandRenderer;
+export const BrandRenderer = makeDecoratable("BrandRenderer", createVoidComponent());
+
+//# sourceMappingURL=Brand.js.map

package/base/ui/Brand.js.map

@@ -1 +1 @@
-{"version":3,"names":["Brand","makeComposable","BrandRenderer"],"sources":["Brand.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app\";\n\nexport const Brand = makeComposable(\"Brand\", () => {\n    return <BrandRenderer />;\n});\n\nexport const BrandRenderer = makeComposable(\"BrandRenderer\");\n"],"mappings":";;;;;;;AAAA;AACA;AAEO,IAAMA,KAAK,GAAG,IAAAC,mBAAc,EAAC,OAAO,EAAE,YAAM;EAC/C,oBAAO,6BAAC,aAAa,OAAG;AAC5B,CAAC,CAAC;AAAC;AAEI,IAAMC,aAAa,GAAG,IAAAD,mBAAc,EAAC,eAAe,CAAC;AAAC"}
+{"version":3,"names":["React","createVoidComponent","makeDecoratable","Brand","createElement","BrandRenderer"],"sources":["Brand.tsx"],"sourcesContent":["import React from \"react\";\nimport { createVoidComponent, makeDecoratable } from \"@webiny/app\";\n\nexport const Brand = makeDecoratable(\"Brand\", () => {\n    return <BrandRenderer />;\n});\n\nexport const BrandRenderer = makeDecoratable(\"BrandRenderer\", createVoidComponent());\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,mBAAmB,EAAEC,eAAe,QAAQ,aAAa;AAElE,OAAO,MAAMC,KAAK,GAAGD,eAAe,CAAC,OAAO,EAAE,MAAM;EAChD,oBAAOF,KAAA,CAAAI,aAAA,CAACC,aAAa,MAAE,CAAC;AAC5B,CAAC,CAAC;AAEF,OAAO,MAAMA,aAAa,GAAGH,eAAe,CAAC,eAAe,EAAED,mBAAmB,CAAC,CAAC,CAAC","ignoreList":[]}

package/base/ui/CenteredView.d.ts

@@ -1,4 +1,24 @@
+import React from "react";
 export interface CenteredViewProps {
+    children: React.ReactNode;
     maxWidth?: number | string;
 }
-export declare const CenteredView: import("../../index").ComposableFC<CenteredViewProps>;
+export declare const CenteredView: (({ maxWidth, children }: CenteredViewProps) => React.JSX.Element) & {
+    original: ({ maxWidth, children }: CenteredViewProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (({ maxWidth, children }: CenteredViewProps) => React.JSX.Element) & {
+        original: ({ maxWidth, children }: CenteredViewProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("~/index.js").ComponentDecorator<(({ maxWidth, children }: CenteredViewProps) => React.JSX.Element) & {
+        original: ({ maxWidth, children }: CenteredViewProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};

package/base/ui/CenteredView.js

@@ -1,35 +1,15 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CenteredView = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _ = require("../..");
-var Container = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e1bmfqk40",
-  label: "Container"
-})({
-  display: "flex",
-  justifyContent: "center"
-});
-var Width = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e1bmfqk41",
-  label: "Width"
-})(function (props) {
-  return {
-    maxWidth: props.maxWidth,
-    width: "100%"
-  };
+import React from "react";
+import { makeDecoratable } from "../../index.js";
+export const CenteredView = makeDecoratable("CenteredView", ({
+  maxWidth,
+  children
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "container",
+    style: {
+      maxWidth
+    }
+  }, children);
 });
-var CenteredView = (0, _.makeComposable)("CenteredView", function (_ref) {
-  var _ref$maxWidth = _ref.maxWidth,
-    maxWidth = _ref$maxWidth === void 0 ? 700 : _ref$maxWidth,
-    children = _ref.children;
-  return /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(Width, {
-    maxWidth: maxWidth
-  }, children));
-});
-exports.CenteredView = CenteredView;
+
+//# sourceMappingURL=CenteredView.js.map

package/base/ui/CenteredView.js.map

@@ -1 +1 @@
-{"version":3,"names":["Container","styled","display","justifyContent","Width","props","maxWidth","width","CenteredView","makeComposable","children"],"sources":["CenteredView.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { makeComposable } from \"~/index\";\n\nexport interface CenteredViewProps {\n    maxWidth?: number | string;\n}\n\nconst Container = styled.div({\n    display: \"flex\",\n    justifyContent: \"center\"\n});\n\ninterface Props {\n    maxWidth: string | number;\n}\n\nconst Width = styled.div((props: Props) => ({\n    maxWidth: props.maxWidth,\n    width: \"100%\"\n}));\n\nexport const CenteredView = makeComposable<CenteredViewProps>(\n    \"CenteredView\",\n    ({ maxWidth = 700, children }) => {\n        return (\n            <Container>\n                <Width maxWidth={maxWidth}>{children}</Width>\n            </Container>\n        );\n    }\n);\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAMA,IAAMA,SAAS,oBAAGC,eAAM;EAAA;EAAA;AAAA,GAAK;EACzBC,OAAO,EAAE,MAAM;EACfC,cAAc,EAAE;AACpB,CAAC,CAAC;AAMF,IAAMC,KAAK,oBAAGH,eAAM;EAAA;EAAA;AAAA,GAAK,UAACI,KAAY;EAAA,OAAM;IACxCC,QAAQ,EAAED,KAAK,CAACC,QAAQ;IACxBC,KAAK,EAAE;EACX,CAAC;AAAA,CAAC,CAAC;AAEI,IAAMC,YAAY,GAAG,IAAAC,gBAAc,EACtC,cAAc,EACd,gBAAkC;EAAA,yBAA/BH,QAAQ;IAARA,QAAQ,8BAAG,GAAG;IAAEI,QAAQ,QAARA,QAAQ;EACvB,oBACI,6BAAC,SAAS,qBACN,6BAAC,KAAK;IAAC,QAAQ,EAAEJ;EAAS,GAAEI,QAAQ,CAAS,CACrC;AAEpB,CAAC,CACJ;AAAC"}
+{"version":3,"names":["React","makeDecoratable","CenteredView","maxWidth","children","createElement","className","style"],"sources":["CenteredView.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"~/index.js\";\n\nexport interface CenteredViewProps {\n    children: React.ReactNode;\n    maxWidth?: number | string;\n}\n\nexport const CenteredView = makeDecoratable(\n    \"CenteredView\",\n    ({ maxWidth, children }: CenteredViewProps) => {\n        return (\n            <div className={\"container\"} style={{ maxWidth }}>\n                {children}\n            </div>\n        );\n    }\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe;AAOxB,OAAO,MAAMC,YAAY,GAAGD,eAAe,CACvC,cAAc,EACd,CAAC;EAAEE,QAAQ;EAAEC;AAA4B,CAAC,KAAK;EAC3C,oBACIJ,KAAA,CAAAK,aAAA;IAAKC,SAAS,EAAE,WAAY;IAACC,KAAK,EAAE;MAAEJ;IAAS;EAAE,GAC5CC,QACA,CAAC;AAEd,CACJ,CAAC","ignoreList":[]}

package/base/ui/Dashboard.d.ts

@@ -1,2 +1,39 @@
-export declare const Dashboard: import("@webiny/app").ComposableFC<unknown>;
-export declare const DashboardRenderer: import("@webiny/app").ComposableFC<unknown>;
+import React from "react";
+export declare const Dashboard: (() => React.JSX.Element) & {
+    original: () => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (() => React.JSX.Element) & {
+        original: () => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/app").ComponentDecorator<(() => React.JSX.Element) & {
+        original: () => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export declare const DashboardRenderer: ((props: unknown) => JSX.Element | null) & {
+    original: (props: unknown) => JSX.Element | null;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: unknown) => JSX.Element | null) & {
+        original: (props: unknown) => JSX.Element | null;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/app").ComponentDecorator<((props: unknown) => JSX.Element | null) & {
+        original: (props: unknown) => JSX.Element | null;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};

package/base/ui/Dashboard.js

@@ -1,15 +1,8 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DashboardRenderer = exports.Dashboard = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _app = require("@webiny/app");
-var Dashboard = (0, _app.makeComposable)("Dashboard", function () {
-  return /*#__PURE__*/_react.default.createElement(DashboardRenderer, null);
+import React from "react";
+import { createVoidComponent, makeDecoratable } from "@webiny/app";
+export const Dashboard = makeDecoratable("Dashboard", () => {
+  return /*#__PURE__*/React.createElement(DashboardRenderer, null);
 });
-exports.Dashboard = Dashboard;
-var DashboardRenderer = (0, _app.makeComposable)("DashboardRenderer");
-exports.DashboardRenderer = DashboardRenderer;
+export const DashboardRenderer = makeDecoratable("DashboardRenderer", createVoidComponent());
+
+//# sourceMappingURL=Dashboard.js.map

package/base/ui/Dashboard.js.map

@@ -1 +1 @@
-{"version":3,"names":["Dashboard","makeComposable","DashboardRenderer"],"sources":["Dashboard.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app\";\n\nexport const Dashboard = makeComposable(\"Dashboard\", () => {\n    return <DashboardRenderer />;\n});\n\nexport const DashboardRenderer = makeComposable(\"DashboardRenderer\");\n"],"mappings":";;;;;;;AAAA;AACA;AAEO,IAAMA,SAAS,GAAG,IAAAC,mBAAc,EAAC,WAAW,EAAE,YAAM;EACvD,oBAAO,6BAAC,iBAAiB,OAAG;AAChC,CAAC,CAAC;AAAC;AAEI,IAAMC,iBAAiB,GAAG,IAAAD,mBAAc,EAAC,mBAAmB,CAAC;AAAC"}
+{"version":3,"names":["React","createVoidComponent","makeDecoratable","Dashboard","createElement","DashboardRenderer"],"sources":["Dashboard.tsx"],"sourcesContent":["import React from \"react\";\nimport { createVoidComponent, makeDecoratable } from \"@webiny/app\";\n\nexport const Dashboard = makeDecoratable(\"Dashboard\", () => {\n    return <DashboardRenderer />;\n});\n\nexport const DashboardRenderer = makeDecoratable(\"DashboardRenderer\", createVoidComponent());\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,mBAAmB,EAAEC,eAAe,QAAQ,aAAa;AAElE,OAAO,MAAMC,SAAS,GAAGD,eAAe,CAAC,WAAW,EAAE,MAAM;EACxD,oBAAOF,KAAA,CAAAI,aAAA,CAACC,iBAAiB,MAAE,CAAC;AAChC,CAAC,CAAC;AAEF,OAAO,MAAMA,iBAAiB,GAAGH,eAAe,CAAC,mBAAmB,EAAED,mBAAmB,CAAC,CAAC,CAAC","ignoreList":[]}

package/base/ui/FileManager.d.ts

@@ -8,19 +8,14 @@ export interface FileManagerOnChange<T> {
 export interface FileManagerFileItem {
     id: string;
     src: string;
-    meta?: Array<FileManagerFileItemMetaItem>;
+    name: string;
+    type: string;
+    size: number;
+    width?: number;
+    height?: number;
+    [key: string]: any;
 }
-/**
- * With this we allow developers to add any value to file's meta via component composition, thus the `value: any`.
- */
-export interface FileManagerFileItemMetaItem {
-    key: string;
-    value: any;
-}
-export declare type DeprecatedFileManagerRenderPropParams = {
-    showFileManager: (onChange?: FileManagerOnChange<FileManagerFileItem | FileManagerFileItem[]>) => void;
-};
-export declare type FileManagerRenderPropParams<TValue> = {
+export type FileManagerRenderPropParams<TValue> = {
     showFileManager: (onChange?: FileManagerOnChange<TValue>) => void;
 };
 interface SingleFileRenderProp {
@@ -29,7 +24,7 @@ interface SingleFileRenderProp {
 interface MultiFileRenderProp {
     (params: FileManagerRenderPropParams<FileManagerFileItem[]>): React.ReactNode;
 }
-export declare type MultipleProps = {
+export type MultipleProps = {
     multiple?: never;
     multipleMaxCount?: never;
     multipleMaxSize?: never;
@@ -42,26 +37,38 @@ export declare type MultipleProps = {
     onChange?: FileManagerOnChange<FileManagerFileItem[]>;
     render?: MultiFileRenderProp;
 };
-export declare type FileManagerProps = {
-    accept?: Array<string>;
+export type FileManagerProps = {
+    accept?: string[];
     images?: boolean;
     maxSize?: number | string;
-    /**
-     * @deprecated This prop is no longer used. The file structure was reduced to a bare minimum so picking is no longer necessary.
-     */
-    onChangePick?: string[];
     onClose?: () => void;
     onUploadCompletion?: (files: FileManagerFileItem[]) => void;
     own?: boolean;
     scope?: string;
-    tags?: Array<string>;
-    /**
-     * @deprecated This prop is no longer used. Use the `render` prop to get better TS autocomplete.
-     */
-    children?: (params: DeprecatedFileManagerRenderPropParams) => React.ReactNode;
+    tags?: string[];
+    show?: boolean;
+    overlay?: boolean;
 } & MultipleProps;
-declare type DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;
-export declare type FileManagerRendererProps = DistributiveOmit<FileManagerProps, "render" | "children">;
-export declare const FileManagerRenderer: import("@webiny/react-composition").ComposableFC<FileManagerRendererProps>;
-export declare const FileManager: React.FC<FileManagerProps>;
+type DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;
+export type FileManagerRendererProps = DistributiveOmit<FileManagerProps, "render">;
+export declare const FileManagerRenderer: ((props: FileManagerRendererProps) => JSX.Element | null) & {
+    original: (props: FileManagerRendererProps) => JSX.Element | null;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: FileManagerRendererProps) => JSX.Element | null) & {
+        original: (props: FileManagerRendererProps) => JSX.Element | null;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: FileManagerRendererProps) => JSX.Element | null) & {
+        original: (props: FileManagerRendererProps) => JSX.Element | null;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export declare const FileManager: ({ render, onChange, ...rest }: FileManagerProps) => React.JSX.Element;
 export {};

package/base/ui/FileManager.js

@@ -1,61 +1,66 @@
-"use strict";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { Portal } from "@webiny/admin-ui";
+import { createVoidComponent, makeDecoratable } from "@webiny/react-composition";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FileManagerRenderer = exports.FileManager = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _reactComposition = require("@webiny/react-composition");
-var _excluded = ["children", "render", "onChange"];
-function getPortalTarget() {
-  var target = window.document.getElementById("file-manager-container");
-  if (!target) {
-    target = document.createElement("div");
-    target.setAttribute("id", "file-manager-container");
-    document.body && document.body.appendChild(target);
-  }
-  return target;
-}
+/**
+ * Represents a file object managed by the File Manager.
+ */
 
 // This jewel was taken from https://davidgomes.com/pick-omit-over-union-types-in-typescript/. Massive thanks, David!
 
-var FileManagerRenderer = (0, _reactComposition.makeComposable)("FileManagerRenderer");
-exports.FileManagerRenderer = FileManagerRenderer;
-var FileManager = function FileManager(_ref) {
-  var children = _ref.children,
-    render = _ref.render,
-    onChange = _ref.onChange,
-    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var containerRef = (0, _react.useRef)(getPortalTarget());
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    show = _useState2[0],
-    setShow = _useState2[1];
-  var onChangeRef = (0, _react.useRef)(onChange);
-  (0, _react.useEffect)(function () {
+export const FileManagerRenderer = makeDecoratable("FileManagerRenderer", createVoidComponent());
+export const FileManager = ({
+  render,
+  onChange,
+  ...rest
+}) => {
+  const [isFileManagerVisible, setFileManagerVisible] = useState(rest.show);
+  const onChangeRef = useRef(onChange);
+  useEffect(() => {
     onChangeRef.current = onChange;
   }, [onChange]);
-  var showFileManager = (0, _react.useCallback)(function (onChange) {
-    if (typeof onChange === "function") {
-      onChangeRef.current = onChange;
+  const handleShowFileManager = useCallback(newOnChange => {
+    if (typeof newOnChange === "function") {
+      onChangeRef.current = newOnChange;
     }
-    setShow(true);
+    setFileManagerVisible(true);
   }, []);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, show && /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(FileManagerRenderer, Object.assign({
-    onClose: function onClose() {
-      return setShow(false);
-    },
-    onChange: /* TODO: figure out how to create a conditional type based on the value of `rest.multiple` */
-    onChangeRef.current
-  }, rest)), containerRef.current), children ? children({
-    showFileManager: showFileManager
-  }) : render ? render({
-    showFileManager: showFileManager
-  }) : null);
+  const handleCloseFileManager = useCallback(() => {
+    setFileManagerVisible(false);
+  }, []);
+  const renderFileManager = () => {
+    if (!isFileManagerVisible) {
+      return null;
+    }
+
+    // Render as overlay
+    if (rest.overlay) {
+      return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(FileManagerRenderer, Object.assign({
+        onClose: handleCloseFileManager,
+        onChange: onChangeRef.current
+      }, rest)));
+    }
+
+    // Render inline
+    return (
+      /*#__PURE__*/
+      // @ts-expect-error
+      React.createElement(FileManagerRenderer, Object.assign({
+        onClose: handleCloseFileManager,
+        onChange: onChangeRef.current
+      }, rest))
+    );
+  };
+  const renderContent = () => {
+    const renderProps = {
+      showFileManager: handleShowFileManager
+    };
+    if (render) {
+      return render(renderProps);
+    }
+    return null;
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, renderFileManager(), renderContent());
 };
-exports.FileManager = FileManager;
+
+//# sourceMappingURL=FileManager.js.map