@webiny/app-admin 5.23.1 → 5.25.0-beta.0

package/base/Admin.d.ts

@@ -1,14 +1,7 @@
 import React from "react";
-import ApolloClient from "apollo-client";
-interface Options {
-    uri: string;
-}
-interface ApolloClientFactory {
-    (options: Options): ApolloClient<any>;
-}
+import { ApolloClientFactory } from "./providers/ApolloProvider";
 export interface AdminProps {
-    createApolloClient?: ApolloClientFactory;
+    createApolloClient: ApolloClientFactory;
     children?: React.ReactNode;
 }
-export declare const Admin: ({ children, createApolloClient }: AdminProps) => JSX.Element;
-export {};
+export declare const Admin: React.FC<AdminProps>;

package/base/Admin.js

@@ -13,6 +13,10 @@ export var Admin = function Admin(_ref) {
   var ApolloProvider = createApolloProvider(createApolloClient);
   var TelemetryProvider = createTelemetryProvider();
   var UiStateProvider = createUiStateProvider();
+  /**
+   * TODO @ts-refactor
+   */
+
   return /*#__PURE__*/React.createElement(BaseAdmin, null, /*#__PURE__*/React.createElement(Provider, {
     hoc: ApolloProvider
   }), /*#__PURE__*/React.createElement(Provider, {

package/base/Admin.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Admin.tsx"],"names":["React","Admin","BaseAdmin","Provider","createApolloProvider","Base","createTelemetryProvider","createUiStateProvider","SearchProvider","UserMenuProvider","NavigationProvider","children","createApolloClient","ApolloProvider","TelemetryProvider","UiStateProvider"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,KAAK,IAAIC,SAAlB,EAA6BC,QAA7B,QAA6C,wBAA7C;AACA,SAA8BC,oBAA9B;AACA,SAASC,IAAT;AACA,SAASC,uBAAT;AACA,SAASC,qBAAT;AACA,SAASC,cAAT;AACA,SAASC,gBAAT;AACA,SAASC,kBAAT;AAOA,OAAO,IAAMT,KAA2B,GAAG,SAA9BA,KAA8B,OAAsC;AAAA,MAAnCU,QAAmC,QAAnCA,QAAmC;AAAA,MAAzBC,kBAAyB,QAAzBA,kBAAyB;AAC7E,MAAMC,cAAc,GAAGT,oBAAoB,CAACQ,kBAAD,CAA3C;AACA,MAAME,iBAAiB,GAAGR,uBAAuB,EAAjD;AACA,MAAMS,eAAe,GAAGR,qBAAqB,EAA7C;AACA;AACJ;AACA;;AACI,sBACI,oBAAC,SAAD,qBACI,oBAAC,QAAD;AAAU,IAAA,GAAG,EAAEM;AAAf,IADJ,eAEI,oBAAC,QAAD;AAAU,IAAA,GAAG,EAAEC;AAAf,IAFJ,eAGI,oBAAC,QAAD;AAAU,IAAA,GAAG,EAAEC;AAAf,IAHJ,eAII,oBAAC,QAAD;AAAU,IAAA,GAAG,EAAEP;AAAf,IAJJ,eAKI,oBAAC,QAAD;AAAU,IAAA,GAAG,EAAEC;AAAf,IALJ,eAMI,oBAAC,QAAD;AAAU,IAAA,GAAG,EAAEC;AAAf,IANJ,eAOI,oBAAC,IAAD,OAPJ,EAQKC,QARL,CADJ;AAYH,CAnBM","sourcesContent":["import React from \"react\";\nimport { Admin as BaseAdmin, Provider } from \"@webiny/app-admin-core\";\nimport { ApolloClientFactory, createApolloProvider } from \"./providers/ApolloProvider\";\nimport { Base } from \"./Base\";\nimport { createTelemetryProvider } from \"./providers/TelemetryProvider\";\nimport { createUiStateProvider } from \"./providers/UiStateProvider\";\nimport { SearchProvider } from \"./ui/Search\";\nimport { UserMenuProvider } from \"./ui/UserMenu\";\nimport { NavigationProvider } from \"./ui/Navigation\";\n\nexport interface AdminProps {\n    createApolloClient: ApolloClientFactory;\n    children?: React.ReactNode;\n}\n\nexport const Admin: React.FC<AdminProps> = ({ children, createApolloClient }) => {\n    const ApolloProvider = createApolloProvider(createApolloClient);\n    const TelemetryProvider = createTelemetryProvider();\n    const UiStateProvider = createUiStateProvider();\n    /**\n     * TODO @ts-refactor\n     */\n    return (\n        <BaseAdmin>\n            <Provider hoc={ApolloProvider} />\n            <Provider hoc={TelemetryProvider} />\n            <Provider hoc={UiStateProvider} />\n            <Provider hoc={SearchProvider} />\n            <Provider hoc={UserMenuProvider} />\n            <Provider hoc={NavigationProvider} />\n            <Base />\n            {children}\n        </BaseAdmin>\n    );\n};\n"]}

package/base/Base.d.ts

@@ -1,2 +1,2 @@
 import React from "react";
-export declare const Base: React.MemoExoticComponent<() => JSX.Element>;
+export declare const Base: React.NamedExoticComponent<{}>;

package/base/Base.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Base.tsx"],"names":["React","memo","Plugins","AddMenu","AddRoute","Dashboard","Layout","NotFound","plugins","ReactComponent","DocsIcon","SlackIcon","GithubIcon","FileIcon","SettingsIcon","FileManager","adminPlugins","BaseExtension","register","showFileManager","Base"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,IAAhB,QAA4B,OAA5B;AACA,SAASC,OAAT,QAAwB,wBAAxB;AACA,SAASC,OAAT,EAAkBC,QAAlB,EAA4BC,SAA5B,EAAuCC,MAAvC,EAA+CC,QAA/C;AACA,SAASC,OAAT,QAAwB,iBAAxB;AACA,SAASC,cAAc,IAAIC,QAA3B;AACA,SAASD,cAAc,IAAIE,SAA3B;AACA,SAASF,cAAc,IAAIG,UAA3B;AACA,SAASH,cAAc,IAAII,QAA3B;AACA,SAASJ,cAAc,IAAIK,YAA3B;AACA,SAASC,WAAT;AAEA,OAAOC,YAAP;;AAEA,IAAMC,aAAuB,GAAG,SAA1BA,aAA0B,GAAM;AAClCT,EAAAA,OAAO,CAACU,QAAR,CAAiBF,YAAY,EAA7B;AAEA,sBACI,oBAAC,OAAD,qBACI,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAE,UAAf;AAA2B,IAAA,KAAK,EAAE,UAAlC;AAA8C,IAAA,IAAI,eAAE,oBAAC,YAAD,OAApD;AAAsE,IAAA,GAAG,EAAE;AAA3E,IADJ,eAEI,oBAAC,WAAD,QACK;AAAA,QAAGG,eAAH,QAAGA,eAAH;AAAA,wBACG,oBAAC,OAAD;AACI,MAAA,IAAI,EAAE,aADV;AAEI,MAAA,KAAK,EAAE,cAFX;AAGI,MAAA,IAAI,eAAE,oBAAC,QAAD,OAHV;AAII,MAAA,IAAI,EAAE,CAAC,QAAD,CAJV;AAKI,MAAA,OAAO,EAAEA,eALb;AAMI,MAAA,MAAM,EAAE;AANZ,MADH;AAAA,GADL,CAFJ,eAcI,oBAAC,OAAD;AACI,IAAA,IAAI,EAAE,eADV;AAEI,IAAA,KAAK,EAAE,eAFX;AAGI,IAAA,IAAI,eAAE,oBAAC,QAAD,OAHV;AAII,IAAA,IAAI,EAAE,0BAJV;AAKI,IAAA,GAAG,EAAE,qBALT;AAMI,IAAA,MAAM,EAAE,QANZ;AAOI,IAAA,IAAI,EAAE,CAAC,QAAD;AAPV,IAdJ,eAuBI,oBAAC,OAAD;AACI,IAAA,IAAI,EAAE,OADV;AAEI,IAAA,KAAK,EAAE,OAFX;AAGI,IAAA,IAAI,eAAE,oBAAC,SAAD,OAHV;AAII,IAAA,IAAI,EAAE,+BAJV;AAKI,IAAA,GAAG,EAAE,qBALT;AAMI,IAAA,MAAM,EAAE,QANZ;AAOI,IAAA,IAAI,EAAE,CAAC,QAAD;AAPV,IAvBJ,eAgCI,oBAAC,OAAD;AACI,IAAA,IAAI,EAAE,QADV;AAEI,IAAA,KAAK,EAAE,QAFX;AAGI,IAAA,IAAI,eAAE,oBAAC,UAAD,OAHV;AAII,IAAA,IAAI,EAAE,qCAJV;AAKI,IAAA,GAAG,EAAE,qBALT;AAMI,IAAA,MAAM,EAAE,QANZ;AAOI,IAAA,IAAI,EAAE,CAAC,QAAD;AAPV,IAhCJ,eAyCI,oBAAC,QAAD;AAAU,IAAA,IAAI,EAAE;AAAhB,kBACI,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE;AAAf,kBACI,oBAAC,SAAD,OADJ,CADJ,CAzCJ,eA8CI,oBAAC,QAAD;AAAU,IAAA,IAAI,EAAE;AAAhB,kBACI,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE;AAAf,kBACI,oBAAC,QAAD,OADJ,CADJ,CA9CJ,CADJ;AAsDH,CAzDD;;AA2DA,OAAO,IAAMC,IAAI,gBAAGnB,IAAI,CAACgB,aAAD,CAAjB","sourcesContent":["import React, { memo } from \"react\";\nimport { Plugins } from \"@webiny/app-admin-core\";\nimport { AddMenu, AddRoute, Dashboard, Layout, NotFound } from \"~/index\";\nimport { plugins } from \"@webiny/plugins\";\nimport { ReactComponent as DocsIcon } from \"~/assets/icons/icon-documentation.svg\";\nimport { ReactComponent as SlackIcon } from \"~/assets/icons/slack-logo.svg\";\nimport { ReactComponent as GithubIcon } from \"~/assets/icons/github-brands.svg\";\nimport { ReactComponent as FileIcon } from \"~/assets/icons/insert_drive_file-24px.svg\";\nimport { ReactComponent as SettingsIcon } from \"~/assets/icons/round-settings-24px.svg\";\nimport { FileManager } from \"~/components\";\n\nimport adminPlugins from \"../plugins\";\n\nconst BaseExtension: React.FC = () => {\n    plugins.register(adminPlugins());\n\n    return (\n        <Plugins>\n            <AddMenu name={\"settings\"} label={\"Settings\"} icon={<SettingsIcon />} pin={\"last\"} />\n            <FileManager>\n                {({ showFileManager }) => (\n                    <AddMenu\n                        name={\"fileManager\"}\n                        label={\"File Manager\"}\n                        icon={<FileIcon />}\n                        tags={[\"footer\"]}\n                        onClick={showFileManager}\n                        testId={\"admin-drawer-footer-menu-file-manager\"}\n                    />\n                )}\n            </FileManager>\n            <AddMenu\n                name={\"documentation\"}\n                label={\"Documentation\"}\n                icon={<DocsIcon />}\n                path={\"https://docs.webiny.com/\"}\n                rel={\"noopener noreferrer\"}\n                target={\"_blank\"}\n                tags={[\"footer\"]}\n            />\n            <AddMenu\n                name={\"slack\"}\n                label={\"Slack\"}\n                icon={<SlackIcon />}\n                path={\"https://www.webiny.com/slack/\"}\n                rel={\"noopener noreferrer\"}\n                target={\"_blank\"}\n                tags={[\"footer\"]}\n            />\n            <AddMenu\n                name={\"github\"}\n                label={\"Github\"}\n                icon={<GithubIcon />}\n                path={\"https://github.com/webiny/webiny-js\"}\n                rel={\"noopener noreferrer\"}\n                target={\"_blank\"}\n                tags={[\"footer\"]}\n            />\n            <AddRoute path={\"/\"}>\n                <Layout title={\"Welcome!\"}>\n                    <Dashboard />\n                </Layout>\n            </AddRoute>\n            <AddRoute path={\"*\"}>\n                <Layout title={\"Not Accessible\"}>\n                    <NotFound />\n                </Layout>\n            </AddRoute>\n        </Plugins>\n    );\n};\n\nexport const Base = memo(BaseExtension);\n"]}

package/base/plugins/AddGraphQLQuerySelection.d.ts

@@ -1,9 +1,9 @@
-import { FC } from "react";
+import React from "react";
 import { DocumentNode } from "graphql";
 interface Props {
     operationName: string;
     selectionPath: string;
     addSelection: DocumentNode;
 }
-export declare const AddGraphQLQuerySelection: FC<Props>;
+export declare const AddGraphQLQuerySelection: React.FC<Props>;
 export {};

package/base/plugins/AddGraphQLQuerySelection.js

@@ -5,10 +5,11 @@ import { AddQuerySelectionPlugin } from "@webiny/app/plugins/AddQuerySelectionPl
 export var AddGraphQLQuerySelection = function AddGraphQLQuerySelection(props) {
   useEffect(function () {
     var plugin = new AddQuerySelectionPlugin(props);
-    plugin.name = nanoid();
+    var name = nanoid();
+    plugin.name = name;
     plugins.register(plugin);
     return function () {
-      plugins.unregister(plugin.name);
+      plugins.unregister(name);
     };
   }, []);
   return null;

package/base/plugins/AddGraphQLQuerySelection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["AddGraphQLQuerySelection.tsx"],"names":["useEffect","plugins","nanoid","AddQuerySelectionPlugin","AddGraphQLQuerySelection","props","plugin","name","register","unregister"],"mappings":"AAAA,SAAgBA,SAAhB,QAAiC,OAAjC;AACA,SAASC,OAAT,QAAwB,iBAAxB;AACA,SAASC,MAAT,QAAuB,QAAvB;AACA,SAASC,uBAAT,QAAwC,6CAAxC;AASA,OAAO,IAAMC,wBAAyC,GAAG,SAA5CA,wBAA4C,CAAAC,KAAK,EAAI;AAC9DL,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAMM,MAAM,GAAG,IAAIH,uBAAJ,CAA4BE,KAA5B,CAAf;AAEA,QAAME,IAAI,GAAGL,MAAM,EAAnB;AACAI,IAAAA,MAAM,CAACC,IAAP,GAAcA,IAAd;AACAN,IAAAA,OAAO,CAACO,QAAR,CAAiBF,MAAjB;AAEA,WAAO,YAAM;AACTL,MAAAA,OAAO,CAACQ,UAAR,CAAmBF,IAAnB;AACH,KAFD;AAGH,GAVQ,EAUN,EAVM,CAAT;AAYA,SAAO,IAAP;AACH,CAdM","sourcesContent":["import React, { useEffect } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport { nanoid } from \"nanoid\";\nimport { AddQuerySelectionPlugin } from \"@webiny/app/plugins/AddQuerySelectionPlugin\";\nimport { DocumentNode } from \"graphql\";\n\ninterface Props {\n    operationName: string;\n    selectionPath: string;\n    addSelection: DocumentNode;\n}\n\nexport const AddGraphQLQuerySelection: React.FC<Props> = props => {\n    useEffect(() => {\n        const plugin = new AddQuerySelectionPlugin(props);\n\n        const name = nanoid();\n        plugin.name = name;\n        plugins.register(plugin);\n\n        return () => {\n            plugins.unregister(name);\n        };\n    }, []);\n\n    return null;\n};\n"]}

package/base/providers/ApolloProvider.d.ts

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

package/base/providers/ApolloProvider.js

@@ -4,9 +4,10 @@ export var createApolloProvider = function createApolloProvider(clientFactory) {
   return function (Component) {
     return function ApolloProvider(_ref) {
       var children = _ref.children;
+      var uri = process.env.REACT_APP_GRAPHQL_API_URL;
       return /*#__PURE__*/React.createElement(Apollo, {
         client: clientFactory({
-          uri: process.env.REACT_APP_GRAPHQL_API_URL
+          uri: uri
         })
       }, /*#__PURE__*/React.createElement(Component, null, children));
     };

package/base/providers/ApolloProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ApolloProvider.tsx"],"names":["React","ApolloProvider","Apollo","createApolloProvider","clientFactory","Component","children","uri","process","env","REACT_APP_GRAPHQL_API_URL"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAc,IAAIC,MAA3B,QAAyC,0BAAzC;AAWA,OAAO,IAAMC,oBAAoB,GAC7B,SADSA,oBACT,CAACC,aAAD;AAAA,SACA,UAACC,SAAD,EAAuD;AACnD,WAAO,SAASJ,cAAT,OAAsC;AAAA,UAAZK,QAAY,QAAZA,QAAY;AACzC,UAAMC,GAAG,GAAGC,OAAO,CAACC,GAAR,CAAYC,yBAAxB;AACA,0BACI,oBAAC,MAAD;AAAQ,QAAA,MAAM,EAAEN,aAAa,CAAC;AAAEG,UAAAA,GAAG,EAAHA;AAAF,SAAD;AAA7B,sBACI,oBAAC,SAAD,QAAYD,QAAZ,CADJ,CADJ;AAKH,KAPD;AAQH,GAVD;AAAA,CADG","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 =\n    (clientFactory: ApolloClientFactory) =>\n    (Component: React.ComponentType<unknown>): React.FC => {\n        return function ApolloProvider({ children }) {\n            const uri = process.env.REACT_APP_GRAPHQL_API_URL as string;\n            return (\n                <Apollo client={clientFactory({ uri })}>\n                    <Component>{children}</Component>\n                </Apollo>\n            );\n        };\n    };\n"]}

package/base/providers/TelemetryProvider.d.ts

@@ -1,4 +1,2 @@
-/// <reference types="react" />
-export declare const createTelemetryProvider: () => (Component: any) => ({ children }: {
-    children: any;
-}) => JSX.Element;
+import React from "react";
+export declare const createTelemetryProvider: () => (Component: React.FC) => React.FC;

package/base/providers/TelemetryProvider.js

@@ -1,4 +1,9 @@
 import React, { useEffect } from "react";
+/**
+ * Package @webiny/telemetry is not a typescript project.
+ */
+// @ts-ignore
+
 import { sendEvent } from "@webiny/telemetry/react";
 var eventSent = false;
 export var createTelemetryProvider = function createTelemetryProvider() {

package/base/providers/TelemetryProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TelemetryProvider.tsx"],"names":["React","useEffect","sendEvent","eventSent","createTelemetryProvider","Component","TelemetryProvider","children"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,QAAiC,OAAjC;AACA;AACA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,yBAA1B;AAEA,IAAIC,SAAS,GAAG,KAAhB;AAEA,OAAO,IAAMC,uBAAuB,GAChC,SADSA,uBACT;AAAA,SACA,UAACC,SAAD,EAAmC;AAC/B,WAAO,SAASC,iBAAT,OAAyC;AAAA,UAAZC,QAAY,QAAZA,QAAY;AAC5CN,MAAAA,SAAS,CAAC,YAAM;AACZ,YAAIE,SAAJ,EAAe;AACX;AACH;;AAEDA,QAAAA,SAAS,GAAG,IAAZ;AACAD,QAAAA,SAAS,CAAC,WAAD,CAAT;AACH,OAPQ,EAON,EAPM,CAAT;AASA,0BAAO,oBAAC,SAAD,QAAYK,QAAZ,CAAP;AACH,KAXD;AAYH,GAdD;AAAA,CADG","sourcesContent":["import React, { useEffect } from \"react\";\n/**\n * Package @webiny/telemetry is not a typescript project.\n */\n// @ts-ignore\nimport { sendEvent } from \"@webiny/telemetry/react\";\n\nlet eventSent = false;\n\nexport const createTelemetryProvider =\n    () =>\n    (Component: React.FC): React.FC => {\n        return function TelemetryProvider({ children }) {\n            useEffect(() => {\n                if (eventSent) {\n                    return;\n                }\n\n                eventSent = true;\n                sendEvent(\"app-start\");\n            }, []);\n\n            return <Component>{children}</Component>;\n        };\n    };\n"]}

package/base/providers/UiStateProvider.d.ts

@@ -1,4 +1,2 @@
 import React from "react";
-export declare const createUiStateProvider: () => (Component: React.ComponentType<unknown>) => ({ children }: {
-    children: any;
-}) => JSX.Element;
+export declare const createUiStateProvider: () => (Component: React.ComponentType<unknown>) => React.FC;

package/base/providers/UiStateProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["UiStateProvider.tsx"],"names":["React","UiProvider","createUiStateProvider","Component","UiStateProvider","children"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,yBAA3B;AAEA,OAAO,IAAMC,qBAAqB,GAC9B,SADSA,qBACT;AAAA,SACA,UAACC,SAAD,EAAuD;AACnD,WAAO,SAASC,eAAT,OAAuC;AAAA,UAAZC,QAAY,QAAZA,QAAY;AAC1C,0BACI,oBAAC,UAAD,qBACI,oBAAC,SAAD,QAAYA,QAAZ,CADJ,CADJ;AAKH,KAND;AAOH,GATD;AAAA,CADG","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"]}

package/base/providers/ViewCompositionProvider.d.ts

@@ -2,17 +2,16 @@ import React from "react";
 export interface ViewElement {
     name: string;
     elements: JSX.Element[];
+    label?: string;
     [key: string]: any;
 }
 interface ElementSetter {
     (element: ViewElement): ViewElement;
 }
 export interface ViewCompositionContext {
-    getViewElement(view: string, name: string): ViewElement;
-    setViewElement(view: string, name: string, setter: ElementSetter): any;
+    getViewElement(view: string, name: string): ViewElement | null;
+    setViewElement(view: string, name: string, setter: ElementSetter): void;
 }
 export declare function useViewComposition(): ViewCompositionContext;
-export declare const createViewCompositionProvider: () => (Component: React.ComponentType<unknown>) => ({ children }: {
-    children: any;
-}) => JSX.Element;
+export declare const createViewCompositionProvider: () => (Component: React.ComponentType<unknown>) => React.FC;
 export {};

package/base/providers/ViewCompositionProvider.js

@@ -2,7 +2,14 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { createContext, useContext, useMemo, useState } from "react";
-var ViewCompositionContext = /*#__PURE__*/createContext(null);
+var ViewCompositionContext = /*#__PURE__*/createContext({
+  getViewElement: function getViewElement() {
+    return null;
+  },
+  setViewElement: function setViewElement() {
+    return void 0;
+  }
+});
 ViewCompositionContext.displayName = "ViewCompositionContext";
 
 var ViewCompositionProvider = function ViewCompositionProvider(_ref) {

package/base/providers/ViewCompositionProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ViewCompositionProvider.tsx"],"names":["React","createContext","useContext","useMemo","useState","ViewCompositionContext","getViewElement","setViewElement","displayName","ViewCompositionProvider","children","state","setState","context","view","name","setter","existing","useViewComposition","createViewCompositionProvider","Component","ViewCompositionProviderHOC"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,aAAhB,EAA+BC,UAA/B,EAA2CC,OAA3C,EAAoDC,QAApD,QAAoE,OAApE;AAkBA,IAAMC,sBAAsB,gBAAGJ,aAAa,CAAyB;AACjEK,EAAAA,cAAc,EAAE,0BAAM;AAClB,WAAO,IAAP;AACH,GAHgE;AAIjEC,EAAAA,cAAc,EAAE,0BAAM;AAClB,WAAO,KAAK,CAAZ;AACH;AANgE,CAAzB,CAA5C;AAQAF,sBAAsB,CAACG,WAAvB,GAAqC,wBAArC;;AAKA,IAAMC,uBAAiC,GAAG,SAApCA,uBAAoC,OAAkB;AAAA,MAAfC,QAAe,QAAfA,QAAe;;AACxD,kBAA0BN,QAAQ,CAA+B,EAA/B,CAAlC;AAAA;AAAA,MAAOO,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,OAAO,GAAGV,OAAO,CACnB;AAAA,WAAO;AACHG,MAAAA,cADG,0BACYQ,IADZ,EAC0BC,IAD1B,EACqD;AACpD,eAAOJ,KAAK,CAACG,IAAD,CAAL,IAAeH,KAAK,CAACG,IAAD,CAAL,CAAYC,IAAZ,CAAtB;AACH,OAHE;AAIHR,MAAAA,cAJG,0BAIYO,IAJZ,EAI0BC,IAJ1B,EAIwCC,MAJxC,EAI+D;AAC9DJ,QAAAA,QAAQ,CAAC,UAAAD,KAAK,EAAI;AACd,cAAMM,QAAQ,GAAGN,KAAK,CAACG,IAAD,CAAL,IAAeH,KAAK,CAACG,IAAD,CAAL,CAAYC,IAAZ,CAAhC;AACA,iDACOJ,KADP,2BAEKG,IAFL,kCAGWH,KAAK,CAACG,IAAD,CAHhB,2BAISC,IAJT,EAIgBC,MAAM,CAACC,QAAD,CAJtB;AAOH,SATO,CAAR;AAUH;AAfE,KAAP;AAAA,GADmB,EAkBnB,CAACN,KAAD,CAlBmB,CAAvB;AAqBA,sBACI,oBAAC,sBAAD,CAAwB,QAAxB;AAAiC,IAAA,KAAK,EAAEE;AAAxC,KACKH,QADL,CADJ;AAKH,CA7BD;;AA+BA,OAAO,SAASQ,kBAAT,GAA8B;AACjC,SAAOhB,UAAU,CAACG,sBAAD,CAAjB;AACH;AAED,OAAO,IAAMc,6BAA6B,GACtC,SADSA,6BACT;AAAA,SACA,UAACC,SAAD,EAAuD;AACnD,WAAO,SAASC,0BAAT,QAAkD;AAAA,UAAZX,QAAY,SAAZA,QAAY;AACrD,0BACI,oBAAC,uBAAD,qBACI,oBAAC,SAAD,QAAYA,QAAZ,CADJ,CADJ;AAKH,KAND;AAOH,GATD;AAAA,CADG","sourcesContent":["import React, { createContext, useContext, useMemo, useState } from \"react\";\n\nexport interface ViewElement {\n    name: string;\n    elements: JSX.Element[];\n    label?: string;\n    [key: string]: any;\n}\n\ninterface ElementSetter {\n    (element: ViewElement): ViewElement;\n}\n\nexport interface ViewCompositionContext {\n    getViewElement(view: string, name: string): ViewElement | null;\n    setViewElement(view: string, name: string, setter: ElementSetter): void;\n}\n\nconst ViewCompositionContext = createContext<ViewCompositionContext>({\n    getViewElement: () => {\n        return null;\n    },\n    setViewElement: () => {\n        return void 0;\n    }\n});\nViewCompositionContext.displayName = \"ViewCompositionContext\";\n\ninterface ViewCompositionProviderState {\n    [key: string]: Record<string, any>;\n}\nconst ViewCompositionProvider: React.FC = ({ children }) => {\n    const [state, setState] = useState<ViewCompositionProviderState>({});\n\n    const context = useMemo(\n        () => ({\n            getViewElement(view: string, name: string): ViewElement {\n                return state[view] && state[view][name];\n            },\n            setViewElement(view: string, name: string, setter: ElementSetter) {\n                setState(state => {\n                    const existing = state[view] && state[view][name];\n                    return {\n                        ...state,\n                        [view]: {\n                            ...state[view],\n                            [name]: setter(existing)\n                        }\n                    };\n                });\n            }\n        }),\n        [state]\n    );\n\n    return (\n        <ViewCompositionContext.Provider value={context}>\n            {children}\n        </ViewCompositionContext.Provider>\n    );\n};\n\nexport function useViewComposition() {\n    return useContext(ViewCompositionContext);\n}\n\nexport const createViewCompositionProvider =\n    () =>\n    (Component: React.ComponentType<unknown>): React.FC => {\n        return function ViewCompositionProviderHOC({ children }) {\n            return (\n                <ViewCompositionProvider>\n                    <Component>{children}</Component>\n                </ViewCompositionProvider>\n            );\n        };\n    };\n"]}

package/base/ui/Brand.d.ts

@@ -1,9 +1,2 @@
-import React from "react";
-export declare const Brand: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
-export declare const BrandRenderer: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
+export declare const Brand: import("@webiny/app-admin-core").ComposableFC<unknown>;
+export declare const BrandRenderer: import("@webiny/app-admin-core").ComposableFC<unknown>;

package/base/ui/Brand.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Brand.tsx"],"names":["React","makeComposable","Brand","BrandRenderer"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAT,QAA+B,wBAA/B;AAEA,OAAO,IAAMC,KAAK,GAAGD,cAAc,CAAC,OAAD,EAAU,YAAM;AAC/C,sBAAO,oBAAC,aAAD,OAAP;AACH,CAFkC,CAA5B;AAIP,OAAO,IAAME,aAAa,GAAGF,cAAc,CAAC,eAAD,CAApC","sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app-admin-core\";\n\nexport const Brand = makeComposable(\"Brand\", () => {\n    return <BrandRenderer />;\n});\n\nexport const BrandRenderer = makeComposable(\"BrandRenderer\");\n"]}

package/base/ui/CenteredView.d.ts

@@ -1,8 +1,4 @@
-import React from "react";
 export interface CenteredViewProps {
     maxWidth?: number | string;
 }
-export declare const CenteredView: React.FC<CenteredViewProps> & {
-    original: React.ComponentType<CenteredViewProps>;
-    originalName: string;
-};
+export declare const CenteredView: import("../../index").ComposableFC<CenteredViewProps>;

package/base/ui/CenteredView.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CenteredView.tsx"],"names":["React","styled","makeComposable","Container","display","justifyContent","Width","props","maxWidth","width","CenteredView","children"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,cAAT;AAMA,IAAMC,SAAS,gBAAGF,MAAH;AAAA;AAAA;AAAA,GAAc;AACzBG,EAAAA,OAAO,EAAE,MADgB;AAEzBC,EAAAA,cAAc,EAAE;AAFS,CAAd,CAAf;AASA,IAAMC,KAAK,gBAAGL,MAAH;AAAA;AAAA;AAAA,GAAc,UAACM,KAAD;AAAA,SAAmB;AACxCC,IAAAA,QAAQ,EAAED,KAAK,CAACC,QADwB;AAExCC,IAAAA,KAAK,EAAE;AAFiC,GAAnB;AAAA,CAAd,CAAX;AAKA,OAAO,IAAMC,YAAY,GAAGR,cAAc,CACtC,cADsC,EAEtC,gBAAkC;AAAA,2BAA/BM,QAA+B;AAAA,MAA/BA,QAA+B,8BAApB,GAAoB;AAAA,MAAfG,QAAe,QAAfA,QAAe;AAC9B,sBACI,oBAAC,SAAD,qBACI,oBAAC,KAAD;AAAO,IAAA,QAAQ,EAAEH;AAAjB,KAA4BG,QAA5B,CADJ,CADJ;AAKH,CARqC,CAAnC","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"]}

package/base/ui/Dashboard.d.ts

@@ -1,9 +1,2 @@
-import React from "react";
-export declare const Dashboard: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
-export declare const DashboardRenderer: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
+export declare const Dashboard: import("@webiny/app-admin-core").ComposableFC<unknown>;
+export declare const DashboardRenderer: import("@webiny/app-admin-core").ComposableFC<unknown>;

package/base/ui/Dashboard.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Dashboard.tsx"],"names":["React","makeComposable","Dashboard","DashboardRenderer"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAT,QAA+B,wBAA/B;AAEA,OAAO,IAAMC,SAAS,GAAGD,cAAc,CAAC,WAAD,EAAc,YAAM;AACvD,sBAAO,oBAAC,iBAAD,OAAP;AACH,CAFsC,CAAhC;AAIP,OAAO,IAAME,iBAAiB,GAAGF,cAAc,CAAC,mBAAD,CAAxC","sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app-admin-core\";\n\nexport const Dashboard = makeComposable(\"Dashboard\", () => {\n    return <DashboardRenderer />;\n});\n\nexport const DashboardRenderer = makeComposable(\"DashboardRenderer\");\n"]}

package/base/ui/Layout.d.ts

@@ -3,11 +3,5 @@ export interface LayoutProps {
     title?: string;
     children: React.ReactNode;
 }
-export declare const Layout: React.FC<LayoutProps> & {
-    original: React.ComponentType<LayoutProps>;
-    originalName: string;
-};
-export declare const LayoutRenderer: React.FC<LayoutProps> & {
-    original: React.ComponentType<LayoutProps>;
-    originalName: string;
-};
+export declare const Layout: import("@webiny/app-admin-core").ComposableFC<LayoutProps>;
+export declare const LayoutRenderer: import("@webiny/app-admin-core").ComposableFC<LayoutProps>;

package/base/ui/Layout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Layout.tsx"],"names":["React","makeComposable","Layout","children","props","LayoutRenderer"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAT,QAA+B,wBAA/B;AAOA,OAAO,IAAMC,MAAM,GAAGD,cAAc,CAAc,QAAd,EAAwB,gBAA4B;AAAA,MAAzBE,QAAyB,QAAzBA,QAAyB;AAAA,MAAZC,KAAY;;AACpF,sBAAO,oBAAC,cAAD,EAAoBA,KAApB,EAA4BD,QAA5B,CAAP;AACH,CAFmC,CAA7B;AAIP,OAAO,IAAME,cAAc,GAAGJ,cAAc,CAAc,gBAAd,CAArC","sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app-admin-core\";\n\nexport interface LayoutProps {\n    title?: string;\n    children: React.ReactNode;\n}\n\nexport const Layout = makeComposable<LayoutProps>(\"Layout\", ({ children, ...props }) => {\n    return <LayoutRenderer {...props}>{children}</LayoutRenderer>;\n});\n\nexport const LayoutRenderer = makeComposable<LayoutProps>(\"LayoutRenderer\");\n"]}

package/base/ui/LocaleSelector.d.ts

@@ -1,9 +1,2 @@
-import React from "react";
-export declare const LocaleSelector: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
-export declare const LocaleSelectorRenderer: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
+export declare const LocaleSelector: import("@webiny/app-admin-core").ComposableFC<unknown>;
+export declare const LocaleSelectorRenderer: import("@webiny/app-admin-core").ComposableFC<unknown>;

package/base/ui/LocaleSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["LocaleSelector.tsx"],"names":["React","makeComposable","LocaleSelector","LocaleSelectorRenderer"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAT,QAA+B,wBAA/B;AAEA,OAAO,IAAMC,cAAc,GAAGD,cAAc,CAAC,gBAAD,EAAmB,YAAM;AACjE,sBAAO,oBAAC,sBAAD,OAAP;AACH,CAF2C,CAArC;AAIP,OAAO,IAAME,sBAAsB,GAAGF,cAAc,CAAC,wBAAD,CAA7C","sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app-admin-core\";\n\nexport const LocaleSelector = makeComposable(\"LocaleSelector\", () => {\n    return <LocaleSelectorRenderer />;\n});\n\nexport const LocaleSelectorRenderer = makeComposable(\"LocaleSelectorRenderer\");\n"]}

package/base/ui/LoginScreen.d.ts

@@ -2,8 +2,5 @@ import React from "react";
 export interface LoginScreenProps {
     children: React.ReactNode;
 }
-export declare const LoginScreen: ({ children }: LoginScreenProps) => JSX.Element;
-export declare const LoginScreenRenderer: React.FC<LoginScreenProps> & {
-    original: React.ComponentType<LoginScreenProps>;
-    originalName: string;
-};
+export declare const LoginScreen: React.FC<LoginScreenProps>;
+export declare const LoginScreenRenderer: import("@webiny/app-admin-core").ComposableFC<LoginScreenProps>;

package/base/ui/LoginScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["LoginScreen.tsx"],"names":["React","makeComposable","Tags","LoginScreen","children","location","LoginScreenRenderer"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,cAAT,QAA+B,wBAA/B;AACA,SAASC,IAAT;AAMA,OAAO,IAAMC,WAAuC,GAAG,SAA1CA,WAA0C,OAAkB;AAAA,MAAfC,QAAe,QAAfA,QAAe;AACrE,sBACI,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAE;AAAEC,MAAAA,QAAQ,EAAE;AAAZ;AAAZ,kBACI,oBAAC,mBAAD,QAAsBD,QAAtB,CADJ,CADJ;AAKH,CANM;AAQP,OAAO,IAAME,mBAAmB,GAAGL,cAAc,CAAmB,qBAAnB,CAA1C","sourcesContent":["import React from \"react\";\nimport { makeComposable } from \"@webiny/app-admin-core\";\nimport { Tags } from \"./Tags\";\n\nexport interface LoginScreenProps {\n    children: React.ReactNode;\n}\n\nexport const LoginScreen: React.FC<LoginScreenProps> = ({ children }) => {\n    return (\n        <Tags tags={{ location: \"loginScreen\" }}>\n            <LoginScreenRenderer>{children}</LoginScreenRenderer>\n        </Tags>\n    );\n};\n\nexport const LoginScreenRenderer = makeComposable<LoginScreenProps>(\"LoginScreenRenderer\");\n"]}

package/base/ui/Logo.d.ts

@@ -1,14 +1,8 @@
 import React from "react";
-export declare const Logo: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
-export declare const LogoRenderer: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
+export declare const Logo: import("@webiny/app-admin-core").ComposableFC<unknown>;
+export declare const LogoRenderer: import("@webiny/app-admin-core").ComposableFC<unknown>;
 interface AddLogoProps {
     logo: JSX.Element;
 }
-export declare const AddLogo: ({ logo }: AddLogoProps) => JSX.Element;
+export declare const AddLogo: React.FC<AddLogoProps>;
 export {};

package/base/ui/Logo.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Logo.tsx"],"names":["React","useMemo","Compose","makeComposable","Logo","LogoRenderer","AddLogo","logo","LogoHOC"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,OAAhB,QAA+B,OAA/B;AACA,SAASC,OAAT,EAAkBC,cAAlB,QAAwC,wBAAxC;AAEA,OAAO,IAAMC,IAAI,GAAGD,cAAc,CAAC,MAAD,EAAS,YAAM;AAC7C,sBAAO,oBAAC,YAAD,OAAP;AACH,CAFiC,CAA3B;AAIP,OAAO,IAAME,YAAY,GAAGF,cAAc,CAAC,cAAD,CAAnC;AAMP,OAAO,IAAMG,OAA+B,GAAG,SAAlCA,OAAkC,OAAc;AAAA,MAAXC,IAAW,QAAXA,IAAW;AACzD,MAAMC,OAAO,GAAGP,OAAO,CAAC,YAAM;AAC1B,WAAO,YAAM;AACT,aAAO,SAASG,IAAT,GAAgB;AACnB,eAAOG,IAAP;AACH,OAFD;AAGH,KAJD;AAKH,GANsB,EAMpB,EANoB,CAAvB;AAQA,sBAAO,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAEF,YAApB;AAAkC,IAAA,IAAI,EAAEG;AAAxC,IAAP;AACH,CAVM","sourcesContent":["import React, { useMemo } from \"react\";\nimport { Compose, makeComposable } from \"@webiny/app-admin-core\";\n\nexport const Logo = makeComposable(\"Logo\", () => {\n    return <LogoRenderer />;\n});\n\nexport const LogoRenderer = makeComposable(\"LogoRenderer\");\n\ninterface AddLogoProps {\n    logo: JSX.Element;\n}\n\nexport const AddLogo: React.FC<AddLogoProps> = ({ logo }) => {\n    const LogoHOC = useMemo(() => {\n        return () => {\n            return function Logo() {\n                return logo;\n            };\n        };\n    }, []);\n\n    return <Compose component={LogoRenderer} with={LogoHOC} />;\n};\n"]}

package/base/ui/Menu.d.ts

@@ -1,7 +1,11 @@
 import React from "react";
+export interface MenuUpdater {
+    (menuItem: MenuData | undefined | null): MenuData | undefined;
+}
 export interface MenuContext {
-    menuItem: MenuData;
-    setMenu(id: string, props: MenuData): void;
+    menuItem: MenuData | null;
+    setMenu(id: string, updater: MenuUpdater): void;
+    removeMenu(id: string): void;
 }
 export interface MenuProps {
     name: string;
@@ -20,16 +24,8 @@ export interface MenuProps {
 export interface MenuData extends MenuProps {
     children: MenuData[];
 }
+export declare const createEmptyMenu: (name: string) => MenuData;
 /**
  * Register a new menu item into the Admin app.
- *
- * @param children
- * @param props
- * @constructor
  */
-export declare const AddMenu: {
-    ({ children, ...props }: MenuProps): JSX.Element;
-    defaultProps: {
-        tags: any[];
-    };
-};
+export declare const AddMenu: React.FC<MenuProps>;

package/base/ui/Menu.js

@@ -1,67 +1,133 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children"];
-import React, { createContext, useState, useContext, useEffect } from "react";
-import { set } from "dot-prop-immutable";
+import React, { createContext, useContext, useEffect } from "react";
 import { useNavigation } from "../..";
-var MenuContext = /*#__PURE__*/createContext(null);
+var MenuContext = /*#__PURE__*/createContext(undefined);
 MenuContext.displayName = "MenuContext";
 
 var useMenu = function useMenu() {
   return useContext(MenuContext);
 };
 
+export var createEmptyMenu = function createEmptyMenu(name) {
+  return {
+    name: name,
+    tags: [],
+    children: []
+  };
+};
+var keys = ["label", "path", "icon", "onClick", "testId", "tags", "target", "rel", "element", "pin"];
+
+var mergeMenuItems = function mergeMenuItems(item1, item2) {
+  return _objectSpread(_objectSpread(_objectSpread({}, item1), keys.reduce(function (map, key) {
+    var _item2$key;
+
+    return _objectSpread(_objectSpread({}, map), {}, _defineProperty({}, key, (_item2$key = item2[key]) !== null && _item2$key !== void 0 ? _item2$key : item1[key]));
+  }, {})), {}, {
+    children: (item2.children || []).reduce(function (acc, menu) {
+      var index = acc.findIndex(function (i) {
+        return i.name === menu.name;
+      });
+
+      if (index > -1) {
+        acc[index] = mergeMenuItems(acc[index], menu);
+      } else {
+        acc.push(menu);
+      }
+
+      return acc;
+    }, _toConsumableArray(item1.children))
+  });
+};
 /**
  * Register a new menu item into the Admin app.
- *
- * @param children
- * @param props
- * @constructor
  */
+
+
 export var AddMenu = function AddMenu(_ref) {
   var children = _ref.children,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  var _useState = useState(_objectSpread(_objectSpread({}, props), {}, {
-    children: []
-  })),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
   var menu = useMenu();
   var navigation = useNavigation();
   useEffect(function () {
     if (menu) {
-      menu.setMenu(state.name, state);
+      menu.setMenu(props.name, function (existing) {
+        if (!existing) {
+          return _objectSpread(_objectSpread({}, props), {}, {
+            children: []
+          });
+        }
+
+        return mergeMenuItems(existing, props);
+      });
     } else {
-      navigation.setMenu(state.name, state);
+      navigation.setMenu(props.name, function (existing) {
+        /**
+         * We return props because this will break otherwise.
+         * TODO @pavel check if this is correct
+         */
+        if (!existing) {
+          return props;
+        }
+
+        return mergeMenuItems(existing, props);
+      });
     }
-  }, [state]);
-  useEffect(function () {
+
     return function () {
-      return navigation.removeMenu(state.name);
+      if (menu) {
+        menu.removeMenu(props.name);
+      } else {
+        navigation.removeMenu(props.name);
+      }
     };
   }, []);
   var context = {
-    setMenu: function setMenu(name, props) {
-      setState(function (menu) {
-        var childIndex = menu.children.findIndex(function (ch) {
+    menuItem: _objectSpread(_objectSpread({}, props), {}, {
+      children: []
+    }),
+    removeMenu: function removeMenu(name) {
+      (menu || navigation).setMenu(props.name, function (existing) {
+        if (!existing) {
+          return undefined;
+        }
+
+        var childIndex = existing.children.findIndex(function (ch) {
+          return ch.name === name;
+        });
+
+        if (childIndex > -1) {
+          return _objectSpread(_objectSpread({}, existing), {}, {
+            children: [].concat(_toConsumableArray(existing.children.slice(0, childIndex)), _toConsumableArray(existing.children.slice(childIndex + 1)))
+          });
+        }
+
+        return existing;
+      });
+    },
+    setMenu: function setMenu(name, updater) {
+      (menu || navigation).setMenu(props.name, function (existing) {
+        if (!existing) {
+          existing = createEmptyMenu(props.name);
+        }
+
+        var subItems = existing.children;
+        var childIndex = subItems.findIndex(function (ch) {
           return ch.name === name;
         });
 
         if (childIndex === -1) {
-          return _objectSpread(_objectSpread({}, menu), {}, {
-            children: [].concat(_toConsumableArray(menu.children), [_objectSpread({}, props)])
+          return _objectSpread(_objectSpread({}, existing), {}, {
+            children: [].concat(_toConsumableArray(subItems), [updater(null)]).filter(Boolean)
           });
         }
 
-        return _objectSpread(_objectSpread({}, menu), {}, {
-          children: set(menu.children, childIndex, function (curr) {
-            return _objectSpread(_objectSpread({}, curr), props);
-          })
+        return _objectSpread(_objectSpread({}, existing), {}, {
+          children: [].concat(_toConsumableArray(subItems.slice(0, childIndex)), [updater(subItems[childIndex])], _toConsumableArray(subItems.slice(childIndex + 1))).filter(Boolean)
         });
       });
     }

package/base/ui/Menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Menu.tsx"],"names":["React","createContext","useContext","useEffect","useNavigation","MenuContext","undefined","displayName","useMenu","createEmptyMenu","name","tags","children","keys","mergeMenuItems","item1","item2","reduce","map","key","acc","menu","index","findIndex","i","push","AddMenu","props","navigation","setMenu","existing","removeMenu","context","menuItem","childIndex","ch","slice","updater","subItems","filter","Boolean","defaultProps"],"mappings":"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","sourcesContent":["import React, { createContext, useContext, useEffect } from \"react\";\nimport { useNavigation } from \"~/index\";\n\nexport interface MenuUpdater {\n    (menuItem: MenuData | undefined | null): MenuData | undefined;\n}\n\nexport interface MenuContext {\n    menuItem: MenuData | null;\n    setMenu(id: string, updater: MenuUpdater): void;\n    removeMenu(id: string): void;\n}\n\nconst MenuContext = createContext<MenuContext | undefined>(undefined);\nMenuContext.displayName = \"MenuContext\";\n\nconst useMenu = () => {\n    return useContext(MenuContext);\n};\n\nexport interface MenuProps {\n    name: string;\n    label?: string;\n    path?: string;\n    icon?: JSX.Element;\n    onClick?: () => void;\n    testId?: string;\n    tags?: string[];\n    target?: string;\n    rel?: string;\n    element?: JSX.Element;\n    children?: React.ReactNode | React.ReactNode[];\n    pin?: \"first\" | \"last\";\n}\n\nexport interface MenuData extends MenuProps {\n    children: MenuData[];\n}\n\nexport const createEmptyMenu = (name: string): MenuData => {\n    return {\n        name,\n        tags: [],\n        children: []\n    };\n};\n\nconst keys: (keyof MenuData)[] = [\n    \"label\",\n    \"path\",\n    \"icon\",\n    \"onClick\",\n    \"testId\",\n    \"tags\",\n    \"target\",\n    \"rel\",\n    \"element\",\n    \"pin\"\n];\n\nconst mergeMenuItems = (item1: MenuData, item2: MenuData): MenuData => {\n    return {\n        ...item1,\n        ...keys.reduce((map, key) => ({ ...map, [key]: item2[key] ?? item1[key] }), {}),\n        children: (item2.children || []).reduce(\n            (acc, menu) => {\n                const index = acc.findIndex(i => i.name === menu.name);\n                if (index > -1) {\n                    acc[index] = mergeMenuItems(acc[index], menu);\n                } else {\n                    acc.push(menu);\n                }\n                return acc;\n            },\n            [...item1.children]\n        )\n    };\n};\n\n/**\n * Register a new menu item into the Admin app.\n */\nexport const AddMenu: React.FC<MenuProps> = ({ children, ...props }) => {\n    const menu = useMenu();\n    const navigation = useNavigation();\n\n    useEffect(() => {\n        if (menu) {\n            menu.setMenu(props.name, existing => {\n                if (!existing) {\n                    return { ...props, children: [] } as MenuData;\n                }\n\n                return mergeMenuItems(existing, props as MenuData);\n            });\n        } else {\n            navigation.setMenu(props.name, existing => {\n                /**\n                 * We return props because this will break otherwise.\n                 * TODO @pavel check if this is correct\n                 */\n                if (!existing) {\n                    return props as MenuData;\n                }\n                return mergeMenuItems(existing, props as MenuData);\n            });\n        }\n\n        return () => {\n            if (menu) {\n                menu.removeMenu(props.name);\n            } else {\n                navigation.removeMenu(props.name);\n            }\n        };\n    }, []);\n\n    const context: MenuContext = {\n        menuItem: { ...props, children: [] },\n        removeMenu(name) {\n            (menu || navigation).setMenu(props.name, existing => {\n                if (!existing) {\n                    return undefined;\n                }\n\n                const childIndex = existing.children.findIndex(ch => ch.name === name);\n                if (childIndex > -1) {\n                    return {\n                        ...existing,\n                        children: [\n                            ...existing.children.slice(0, childIndex),\n                            ...existing.children.slice(childIndex + 1)\n                        ]\n                    };\n                }\n\n                return existing;\n            });\n        },\n        setMenu(name: string, updater: MenuUpdater) {\n            (menu || navigation).setMenu(props.name, existing => {\n                if (!existing) {\n                    existing = createEmptyMenu(props.name);\n                }\n\n                const subItems = existing.children;\n\n                const childIndex = subItems.findIndex(ch => ch.name === name);\n                if (childIndex === -1) {\n                    return {\n                        ...existing,\n                        children: [...subItems, updater(null)].filter(Boolean) as MenuData[]\n                    };\n                }\n\n                return {\n                    ...existing,\n                    children: [\n                        ...subItems.slice(0, childIndex),\n                        updater(subItems[childIndex]),\n                        ...subItems.slice(childIndex + 1)\n                    ].filter(Boolean) as MenuData[]\n                };\n            });\n        }\n    };\n\n    if (!children) {\n        return null;\n    }\n\n    return <MenuContext.Provider value={context}>{children}</MenuContext.Provider>;\n};\n\nAddMenu.defaultProps = { tags: [] };\n"]}

package/base/ui/Navigation.d.ts

@@ -1,21 +1,16 @@
 import React from "react";
-import { MenuData, MenuProps } from "../../index";
+import { MenuData, MenuUpdater } from "../../index";
 export interface NavigationContext {
     menuItems: MenuData[];
-    setMenu(id: string, props: MenuProps): void;
+    setMenu(id: string, update: MenuUpdater): void;
     removeMenu(id: string): void;
 }
 export declare function useNavigation(): NavigationContext;
-export declare const NavigationProvider: (Component: React.ComponentType<unknown>) => ({ children }: {
-    children: any;
-}) => JSX.Element;
-export declare const Navigation: () => JSX.Element;
-export declare const NavigationRenderer: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
+export declare const NavigationProvider: (Component: React.ComponentType<unknown>) => React.FC;
+export declare const Navigation: React.FC;
+export declare const NavigationRenderer: import("@webiny/app-admin-core").ComposableFC<unknown>;
 interface MenuItemContext {
-    menuItem: MenuData;
+    menuItem?: MenuData;
     depth: number;
 }
 declare const MenuItemContext: React.Context<MenuItemContext>;
@@ -23,13 +18,7 @@ export declare function useMenuItem(): MenuItemContext;
 export interface MenuItemsProps {
     menuItems: MenuData[];
 }
-export declare const MenuItems: React.FC<MenuItemsProps> & {
-    original: React.ComponentType<MenuItemsProps>;
-    originalName: string;
-};
-export declare const MenuItem: () => JSX.Element;
-export declare const MenuItemRenderer: React.FC<unknown> & {
-    original: React.ComponentType<unknown>;
-    originalName: string;
-};
+export declare const MenuItems: import("@webiny/app-admin-core").ComposableFC<MenuItemsProps>;
+export declare const MenuItem: React.FC;
+export declare const MenuItemRenderer: import("@webiny/app-admin-core").ComposableFC<unknown>;
 export {};