piral-core 1.0.0-pre.2296 → 1.0.1-beta.5640

package/lib/utils/index.d.ts

@@ -1,9 +1,11 @@
+export { isfunc, requireModule } from 'piral-base';
 export * from './compare';
 export * from './data';
-export * from './events';
+export * from './extension';
 export * from './foreign';
 export * from './guid';
 export * from './helpers';
 export * from './media';
 export * from './react';
+export * from './state';
 export * from './storage';

package/lib/utils/index.js

@@ -1,13 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
+exports.requireModule = exports.isfunc = void 0;
+const tslib_1 = require("tslib");
+var piral_base_1 = require("piral-base");
+Object.defineProperty(exports, "isfunc", { enumerable: true, get: function () { return piral_base_1.isfunc; } });
+Object.defineProperty(exports, "requireModule", { enumerable: true, get: function () { return piral_base_1.requireModule; } });
 tslib_1.__exportStar(require("./compare"), exports);
 tslib_1.__exportStar(require("./data"), exports);
-tslib_1.__exportStar(require("./events"), exports);
+tslib_1.__exportStar(require("./extension"), exports);
 tslib_1.__exportStar(require("./foreign"), exports);
 tslib_1.__exportStar(require("./guid"), exports);
 tslib_1.__exportStar(require("./helpers"), exports);
 tslib_1.__exportStar(require("./media"), exports);
 tslib_1.__exportStar(require("./react"), exports);
+tslib_1.__exportStar(require("./state"), exports);
 tslib_1.__exportStar(require("./storage"), exports);
 //# sourceMappingURL=index.js.map

package/lib/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":";;;AAAA,oDAA0B;AAC1B,iDAAuB;AACvB,mDAAyB;AACzB,oDAA0B;AAC1B,iDAAuB;AACvB,oDAA0B;AAC1B,kDAAwB;AACxB,kDAAwB;AACxB,oDAA0B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":";;;;AAAA,yCAAmD;AAA1C,oGAAA,MAAM,OAAA;AAAE,2GAAA,aAAa,OAAA;AAE9B,oDAA0B;AAC1B,iDAAuB;AACvB,sDAA4B;AAC5B,oDAA0B;AAC1B,iDAAuB;AACvB,oDAA0B;AAC1B,kDAAwB;AACxB,kDAAwB;AACxB,kDAAwB;AACxB,oDAA0B"}

package/lib/utils/media.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getCurrentLayout = exports.defaultBreakpoints = exports.defaultLayouts = void 0;
-var piral_base_1 = require("piral-base");
+const piral_base_1 = require("piral-base");
 exports.defaultLayouts = ['desktop', 'tablet', 'mobile'];
 exports.defaultBreakpoints = ['(min-width: 991px)', '(min-width: 481px)', '(max-width: 480px)'];
-var mm = typeof window === 'undefined' || !piral_base_1.isfunc(window.matchMedia)
-    ? function () { return ({ matches: [] }); }
-    : function (q) { return window.matchMedia(q); };
-function getCurrentLayout(breakpoints, layouts, defaultLayout) {
-    var query = breakpoints.findIndex(function (q) { return mm(q).matches; });
-    var layout = layouts[query];
+const mm = typeof window === 'undefined' || !(0, piral_base_1.isfunc)(window.matchMedia)
+    ? () => ({ matches: undefined })
+    : (q) => window.matchMedia(q);
+function getCurrentLayout(breakpoints = exports.defaultBreakpoints, layouts, defaultLayout) {
+    const query = breakpoints.findIndex((q) => mm(q).matches);
+    const layout = layouts[query];
     return layout !== undefined ? layout : defaultLayout;
 }
 exports.getCurrentLayout = getCurrentLayout;

package/lib/utils/media.js.map

@@ -1 +1 @@
-{"version":3,"file":"media.js","sourceRoot":"","sources":["../../src/utils/media.ts"],"names":[],"mappings":";;;AAAA,yCAAoC;AAGvB,QAAA,cAAc,GAAgB,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAE9D,QAAA,kBAAkB,GAAsB,CAAC,oBAAoB,EAAE,oBAAoB,EAAE,oBAAoB,CAAC,CAAC;AAExH,IAAM,EAAE,GACN,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,mBAAM,CAAC,MAAM,CAAC,UAAU,CAAC;IACzD,CAAC,CAAC,cAAM,OAAA,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,EAAjB,CAAiB;IACzB,CAAC,CAAC,UAAC,CAAS,IAAK,OAAA,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAApB,CAAoB,CAAC;AAE1C,SAAgB,gBAAgB,CAAI,WAA0B,EAAE,OAAiB,EAAE,aAAgB;IACjG,IAAM,KAAK,GAAG,WAAW,CAAC,SAAS,CAAC,UAAC,CAAC,IAAK,OAAA,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,EAAb,CAAa,CAAC,CAAC;IAC1D,IAAM,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,OAAO,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC;AACvD,CAAC;AAJD,4CAIC"}
+{"version":3,"file":"media.js","sourceRoot":"","sources":["../../src/utils/media.ts"],"names":[],"mappings":";;;AAAA,2CAAoC;AAGvB,QAAA,cAAc,GAAgB,CAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAE9D,QAAA,kBAAkB,GAAsB,CAAC,oBAAoB,EAAE,oBAAoB,EAAE,oBAAoB,CAAC,CAAC;AAExH,MAAM,EAAE,GACN,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,IAAA,mBAAM,EAAC,MAAM,CAAC,UAAU,CAAC;IACzD,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC;IAChC,CAAC,CAAC,CAAC,CAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;AAE1C,SAAgB,gBAAgB,CAAI,cAA6B,0BAAkB,EAAE,OAAiB,EAAE,aAAgB;IACtH,MAAM,KAAK,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;IAC1D,MAAM,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,OAAO,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC;AACvD,CAAC;AAJD,4CAIC"}

package/lib/utils/react.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.defaultRender = void 0;
-var React = require("react");
+const React = require("react");
 function defaultRender(children, key) {
     return React.createElement(React.Fragment, { key: key }, children);
 }

package/lib/utils/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","sourceRoot":"","sources":["../../src/utils/react.tsx"],"names":[],"mappings":";;;AAAA,6BAA+B;AAE/B,SAAgB,aAAa,CAAC,QAAyB,EAAE,GAAY;IACnE,OAAO,oBAAC,KAAK,CAAC,QAAQ,IAAC,GAAG,EAAE,GAAG,IAAG,QAAQ,CAAkB,CAAC;AAC/D,CAAC;AAFD,sCAEC"}
+{"version":3,"file":"react.js","sourceRoot":"","sources":["../../src/utils/react.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAE/B,SAAgB,aAAa,CAAC,QAAyB,EAAE,GAAY;IACnE,OAAO,oBAAC,KAAK,CAAC,QAAQ,IAAC,GAAG,EAAE,GAAG,IAAG,QAAQ,CAAkB,CAAC;AAC/D,CAAC;AAFD,sCAEC"}

package/lib/utils/state.d.ts

@@ -0,0 +1,57 @@
+import { ComponentType } from 'react';
+import { RouteComponentProps } from 'react-router';
+import { GlobalState, PageRegistration, ExtensionRegistration } from '../types';
+/**
+ * Returns a dispatcher that includes all mentioned dispatchers.
+ * @param dispatchers The dispatchers to include.
+ */
+export declare function withAll(...dispatchers: Array<(state: GlobalState) => GlobalState>): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that adds a page registration.
+ * @param name The path of the page to register.
+ * @param value The value of the page to register.
+ * @returns The dispatcher.
+ */
+export declare function withPage(name: string, value: PageRegistration): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that removes a page registration.
+ * @param name The path of the page to unregister.
+ * @returns The dispatcher.
+ */
+export declare function withoutPage(name: string): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that adds an extension registration.
+ * @param name The name of the extension to register.
+ * @param value The value of the extension to register.
+ * @returns The dispatcher.
+ */
+export declare function withExtension(name: string, value: ExtensionRegistration): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that removes an extension registration.
+ * @param name The name of the extension to unregister.
+ * @param reference The reference for the extension.
+ * @returns The dispatcher.
+ */
+export declare function withoutExtension(name: string, reference: any): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that adds an extension registration from the root (no Pilet API).
+ * @param name The name of the extension to register.
+ * @param component The extension's component to use.
+ * @returns The dispatcher.
+ */
+export declare function withRootExtension<T>(name: string, component: ComponentType<T>): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that adds another provider.
+ * @param provider The provider to include.
+ * @returns The dispatcher.
+ */
+export declare function withProvider(provider: JSX.Element): (state: GlobalState) => GlobalState;
+/**
+ * Returns a dispatcher that registers another route.
+ * @param path The path of the route to register.
+ * @param component The component representing the route.
+ * @returns The dispatcher.
+ */
+export declare function withRoute<T extends {
+    [K in keyof T]?: string;
+} = {}>(path: string, component: ComponentType<RouteComponentProps<T>>): (state: GlobalState) => GlobalState;

package/lib/utils/state.js

@@ -0,0 +1,94 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withRoute = exports.withProvider = exports.withRootExtension = exports.withoutExtension = exports.withExtension = exports.withoutPage = exports.withPage = exports.withAll = void 0;
+const react_1 = require("react");
+const extension_1 = require("./extension");
+const helpers_1 = require("./helpers");
+/**
+ * Returns a dispatcher that includes all mentioned dispatchers.
+ * @param dispatchers The dispatchers to include.
+ */
+function withAll(...dispatchers) {
+    return (state) => {
+        for (const dispatcher of dispatchers) {
+            state = dispatcher(state);
+        }
+        return state;
+    };
+}
+exports.withAll = withAll;
+/**
+ * Returns a dispatcher that adds a page registration.
+ * @param name The path of the page to register.
+ * @param value The value of the page to register.
+ * @returns The dispatcher.
+ */
+function withPage(name, value) {
+    return (state) => (Object.assign(Object.assign({}, state), { registry: Object.assign(Object.assign({}, state.registry), { pages: (0, helpers_1.withKey)(state.registry.pages, name, value) }) }));
+}
+exports.withPage = withPage;
+/**
+ * Returns a dispatcher that removes a page registration.
+ * @param name The path of the page to unregister.
+ * @returns The dispatcher.
+ */
+function withoutPage(name) {
+    return (state) => (Object.assign(Object.assign({}, state), { registry: Object.assign(Object.assign({}, state.registry), { pages: (0, helpers_1.withoutKey)(state.registry.pages, name) }) }));
+}
+exports.withoutPage = withoutPage;
+/**
+ * Returns a dispatcher that adds an extension registration.
+ * @param name The name of the extension to register.
+ * @param value The value of the extension to register.
+ * @returns The dispatcher.
+ */
+function withExtension(name, value) {
+    return (state) => (Object.assign(Object.assign({}, state), { registry: Object.assign(Object.assign({}, state.registry), { extensions: (0, helpers_1.withKey)(state.registry.extensions, name, (0, helpers_1.appendItem)(state.registry.extensions[name], value)) }) }));
+}
+exports.withExtension = withExtension;
+/**
+ * Returns a dispatcher that removes an extension registration.
+ * @param name The name of the extension to unregister.
+ * @param reference The reference for the extension.
+ * @returns The dispatcher.
+ */
+function withoutExtension(name, reference) {
+    return (state) => (Object.assign(Object.assign({}, state), { registry: Object.assign(Object.assign({}, state.registry), { extensions: (0, helpers_1.withKey)(state.registry.extensions, name, (0, helpers_1.excludeOn)(state.registry.extensions[name], (m) => m.reference === reference)) }) }));
+}
+exports.withoutExtension = withoutExtension;
+/**
+ * Returns a dispatcher that adds an extension registration from the root (no Pilet API).
+ * @param name The name of the extension to register.
+ * @param component The extension's component to use.
+ * @returns The dispatcher.
+ */
+function withRootExtension(name, component) {
+    return withExtension(name, {
+        component: (0, extension_1.toExtension)(component),
+        defaults: {},
+        pilet: '',
+        reference: component,
+    });
+}
+exports.withRootExtension = withRootExtension;
+/**
+ * Returns a dispatcher that adds another provider.
+ * @param provider The provider to include.
+ * @returns The dispatcher.
+ */
+function withProvider(provider) {
+    const wrapper = (props) => (0, react_1.cloneElement)(provider, props);
+    return (state) => (Object.assign(Object.assign({}, state), { provider: !state.provider ? wrapper : (props) => (0, react_1.createElement)(state.provider, undefined, wrapper(props)) }));
+}
+exports.withProvider = withProvider;
+/**
+ * Returns a dispatcher that registers another route.
+ * @param path The path of the route to register.
+ * @param component The component representing the route.
+ * @returns The dispatcher.
+ */
+function withRoute(path, component) {
+    return (state) => (Object.assign(Object.assign({}, state), { routes: (0, helpers_1.withKey)(state.routes, path, component) }));
+}
+exports.withRoute = withRoute;
+//# sourceMappingURL=state.js.map

package/lib/utils/state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.js","sourceRoot":"","sources":["../../src/utils/state.ts"],"names":[],"mappings":"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"}

package/lib/utils/storage.js

@@ -1,29 +1,28 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.cookie = exports.storage = void 0;
-var crx = /\s*(.*?)=(.*?)($|;|,(?! ))/g;
+const crx = /\s*(.*?)=(.*?)($|;|,(?! ))/g;
 exports.storage = {
-    setItem: function (name, data) {
+    setItem(name, data) {
         return localStorage.setItem(name, data);
     },
-    getItem: function (name) {
+    getItem(name) {
         return localStorage.getItem(name);
     },
-    removeItem: function (name) {
+    removeItem(name) {
         return localStorage.removeItem(name);
     },
 };
 exports.cookie = {
-    setItem: function (name, data, expires) {
-        if (expires === void 0) { expires = ''; }
-        var domain = location.hostname;
-        var domainPart = domain ? "domain=." + domain + ";" : '';
-        document.cookie = name + "=" + encodeURIComponent(data) + ";expires=\"" + expires + "\";path=/;" + domainPart;
+    setItem(name, data, expires = '') {
+        const domain = location.hostname;
+        const domainPart = domain ? `domain=.${domain};` : '';
+        document.cookie = `${name}=${encodeURIComponent(data)};expires="${expires}";path=/;${domainPart}`;
     },
-    getItem: function (name) {
-        return document.cookie.replace(crx, function (_m, p1, p2) { return (name === p1 ? p2 : ''); });
+    getItem(name) {
+        return document.cookie.replace(crx, (_m, p1, p2) => (name === p1 ? p2 : ''));
     },
-    removeItem: function (name) {
+    removeItem(name) {
         this.setItem(name, '', '-1');
     },
 };

package/lib/utils/storage.js.map

@@ -1 +1 @@
-{"version":3,"file":"storage.js","sourceRoot":"","sources":["../../src/utils/storage.ts"],"names":[],"mappings":";;;AAEA,IAAM,GAAG,GAAG,6BAA6B,CAAC;AAE7B,QAAA,OAAO,GAAiB;IACnC,OAAO,EAAP,UAAQ,IAAY,EAAE,IAAY;QAChC,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC1C,CAAC;IACD,OAAO,EAAP,UAAQ,IAAY;QAClB,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;IACD,UAAU,EAAV,UAAW,IAAY;QACrB,OAAO,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC;CACF,CAAC;AAEW,QAAA,MAAM,GAAiB;IAClC,OAAO,EAAP,UAAQ,IAAY,EAAE,IAAY,EAAE,OAAY;QAAZ,wBAAA,EAAA,YAAY;QAC9C,IAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,CAAC;QACjC,IAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,aAAW,MAAM,MAAG,CAAC,CAAC,CAAC,EAAE,CAAC;QACtD,QAAQ,CAAC,MAAM,GAAM,IAAI,SAAI,kBAAkB,CAAC,IAAI,CAAC,mBAAa,OAAO,kBAAY,UAAY,CAAC;IACpG,CAAC;IACD,OAAO,EAAP,UAAQ,IAAY;QAClB,OAAO,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,EAAE,UAAC,EAAO,EAAE,EAAU,EAAE,EAAU,IAAK,OAAA,CAAC,IAAI,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAvB,CAAuB,CAAC,CAAC;IACpG,CAAC;IACD,UAAU,EAAV,UAAW,IAAY;QACrB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,CAAC;IAC/B,CAAC;CACF,CAAC"}
+{"version":3,"file":"storage.js","sourceRoot":"","sources":["../../src/utils/storage.ts"],"names":[],"mappings":";;;AAEA,MAAM,GAAG,GAAG,6BAA6B,CAAC;AAE7B,QAAA,OAAO,GAAiB;IACnC,OAAO,CAAC,IAAY,EAAE,IAAY;QAChC,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC1C,CAAC;IACD,OAAO,CAAC,IAAY;QAClB,OAAO,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IACpC,CAAC;IACD,UAAU,CAAC,IAAY;QACrB,OAAO,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC;CACF,CAAC;AAEW,QAAA,MAAM,GAAiB;IAClC,OAAO,CAAC,IAAY,EAAE,IAAY,EAAE,OAAO,GAAG,EAAE;QAC9C,MAAM,MAAM,GAAG,QAAQ,CAAC,QAAQ,CAAC;QACjC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,WAAW,MAAM,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;QACtD,QAAQ,CAAC,MAAM,GAAG,GAAG,IAAI,IAAI,kBAAkB,CAAC,IAAI,CAAC,aAAa,OAAO,YAAY,UAAU,EAAE,CAAC;IACpG,CAAC;IACD,OAAO,CAAC,IAAY;QAClB,OAAO,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,EAAO,EAAE,EAAU,EAAE,EAAU,EAAE,EAAE,CAAC,CAAC,IAAI,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACpG,CAAC;IACD,UAAU,CAAC,IAAY;QACrB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,CAAC;IAC/B,CAAC;CACF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "piral-core",
-  "version": "1.0.0-pre.2296",
+  "version": "1.0.1-beta.5640",
   "description": "The core library for creating a Piral instance.",
   "keywords": [
     "portal",
@@ -11,19 +11,45 @@
     "core",
     "functional"
   ],
+  "importmap": {
+    "imports": {
+      "react": "react",
+      "react-dom": "react-dom",
+      "react-router": "react-router",
+      "react-router-dom": "react-router-dom"
+    }
+  },
   "author": "smapiot",
   "homepage": "https://piral.io",
   "license": "MIT",
   "module": "esm/index.js",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./esm/index.js",
+      "require": "./lib/index.js"
+    },
+    "./esm/*": {
+      "import": "./esm/*"
+    },
+    "./lib/*": {
+      "require": "./lib/*"
+    },
+    "./_/*": {
+      "import": "./esm/*.js",
+      "require": "./lib/*.js"
+    },
+    "./package.json": "./package.json"
+  },
   "sideEffects": false,
   "files": [
+    "dist",
     "esm",
     "lib",
     "src",
-    "dependencies.codegen",
-    "dependencies.codegen.native.js"
+    "app.codegen",
+    "app.codegen.d.ts"
   ],
   "funding": {
     "type": "github",
@@ -37,30 +63,35 @@
     "url": "https://github.com/smapiot/piral/issues"
   },
   "scripts": {
-    "build": "yarn build:commonjs && yarn build:esnext",
+    "cleanup": "rimraf dist esm lib",
+    "build": "yarn build:commonjs && yarn build:esnext && yarn build:codegen",
     "build:commonjs": "tsc --project tsconfig.json --outDir lib --module commonjs",
     "build:esnext": "tsc --project tsconfig.json --outDir esm --module esnext",
+    "build:codegen": "esbuild src/tools/codegen.ts --bundle --outfile=dist/codegen.js --format=cjs --platform=node --external:pnpapi",
     "typedoc": "typedoc --json ../../../docs/types/piral-core.json src --exclude \"src/**/*.test.*\"",
     "test": "echo \"Error: run tests from root\" && exit 1"
   },
+  "dependencies": {
+    "piral-base": "1.0.1-beta.5640",
+    "piral-debug-utils": "1.0.1-beta.5640",
+    "zustand": "^3.0.0"
+  },
   "devDependencies": {
-    "@types/history": "^4.7.8",
-    "@types/react": "^17.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
     "@types/react-router": "^5.1.8",
     "@types/react-router-dom": "^5.1.6",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1"
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "react-router": "^5.2.0",
+    "react-router-dom": "^5.2.0"
   },
-  "peerDependencies": {
-    "react": ">=16.8.0",
-    "react-dom": ">=16.8.0",
-    "react-router": ">=5.0.0",
-    "react-router-dom": ">=5.0.0"
-  },
-  "dependencies": {
-    "@dbeining/react-atom": "^4.0.0",
-    "piral-base": "^1.0.0-pre.2296",
-    "piral-debug-utils": "^1.0.0-pre.2296"
-  },
-  "gitHead": "8dc47ff93be1eefcc3e226a1e7dd4d58615b4e0c"
+  "sharedDependencies": [
+    "react",
+    "react-dom",
+    "react-router",
+    "react-router-dom",
+    "tslib"
+  ],
+  "gitHead": "fa0a72b28fd0a20afec7ef491ec19e93c090fc72"
 }

package/src/Piral.test.tsx

@@ -1,28 +1,19 @@
 import * as React from 'react';
-import { act } from 'react-dom/test-utils';
-import { mount, ReactWrapper } from 'enzyme';
+import { render, act } from '@testing-library/react';
 import { Piral } from './Piral';
-import { PiralRouter } from './components';
 import { createInstance } from './createInstance';
 
-async function waitForComponentToPaint<P = {}>(wrapper: ReactWrapper<P>, amount = 0) {
-  await act(async () => {
-    await new Promise((resolve) => setTimeout(resolve, amount));
-    wrapper.update();
-  });
-}
-
 describe('Piral Component', () => {
   it('renders the Piral instance with default settings', async () => {
-    const node = mount(<Piral />);
-    await waitForComponentToPaint(node);
-    expect(node.find(PiralRouter).length).toBe(1);
+    const node = render(<Piral />);
+    await act(() => Promise.resolve());
+    expect(node.container.childNodes.length).toBe(1);
   });
 
   it('renders the Piral instance with custom settings', async () => {
     const instance = createInstance();
-    const node = mount(<Piral instance={instance} />);
-    await waitForComponentToPaint(node);
-    expect(node.find(PiralRouter).length).toBe(1);
+    const node = render(<Piral instance={instance} />);
+    await act(() => Promise.resolve());
+    expect(node.container.childNodes.length).toBe(1);
   });
 });

package/src/Piral.tsx

@@ -1,14 +1,15 @@
 import * as React from 'react';
-import { StateContext } from './state';
 import { createInstance } from './createInstance';
-import { PiralView, Mediator, ResponsiveLayout } from './components';
-import type { PortalProps } from './types';
+import { PiralView, RegisteredRouter } from './components';
+import { PiralContext } from './PiralContext';
+import { publicPath } from '../app.codegen';
+import type { PiralProps } from './types';
 
 /**
  * Represents the Piral app shell frame. Use this component together
  * with an existing instance to render the app shell.
- * Includes layout and routing handling. Wires the state container
- * to the generated views.
+ * Includes layout and routing handling. Connects the Piral context
+ * and the React router to the generated views.
  *
  * @example
 ```jsx
@@ -19,11 +20,11 @@ const app = (
 );
 ```
  */
-export const Piral: React.FC<PortalProps> = ({ instance = createInstance(), breakpoints, children }) => (
-  <StateContext.Provider value={instance.context}>
-    <ResponsiveLayout breakpoints={breakpoints} />
-    <Mediator options={instance.options} />
-    <PiralView>{children}</PiralView>
-  </StateContext.Provider>
+export const Piral: React.FC<PiralProps> = ({ instance = createInstance(), breakpoints, children }) => (
+  <PiralContext instance={instance}>
+    <RegisteredRouter publicPath={publicPath}>
+      <PiralView breakpoints={breakpoints}>{children}</PiralView>
+    </RegisteredRouter>
+  </PiralContext>
 );
 Piral.displayName = 'Piral';

package/src/PiralContext.tsx

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { StateContext } from './state';
+import { createInstance } from './createInstance';
+import { Mediator } from './components';
+import { useGlobalState } from './hooks';
+import { RootListener } from './RootListener';
+import type { PiralContextProps } from './types';
+
+interface PiralProviderProps {
+  children: React.ReactNode;
+}
+
+const PiralProvider: React.FC<PiralProviderProps> = ({ children }) => {
+  const Provider = useGlobalState((m) => m.provider || React.Fragment);
+  return <Provider>{children}</Provider>;
+};
+
+/**
+ * Represents the Piral app shell frame. Use this component together
+ * with an existing instance to render components from micro frontends
+ * in your app.
+ * Wires the state container together with the global providers.
+ *
+ * @example
+```jsx
+const app = (
+  <MyRouter>
+    <PiralContext instance={yourPiralInstance}>
+      <PiralGlobals />
+      <MyAppContent />
+    </PiralContext>
+  </MyRouter>
+);
+```
+ */
+export const PiralContext: React.FC<PiralContextProps> = ({ instance = createInstance(), children }) => (
+  <StateContext.Provider value={instance.context}>
+    <Mediator options={instance.options} key={instance.id} />
+    <RootListener />
+    <PiralProvider>{children}</PiralProvider>
+  </StateContext.Provider>
+);
+PiralContext.displayName = 'PiralContext';

package/src/RootListener.test.tsx

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { render, act } from '@testing-library/react';
+import { RootListener } from './RootListener';
+
+jest.mock('./hooks/globalState', () => ({
+  useGlobalStateContext: () => ({
+    showPortal() {},
+  }),
+}));
+
+function resolveAfter(time = 5) {
+  return new Promise<void>((resolve) => setTimeout(resolve, time));
+}
+
+describe('RootListener Component', () => {
+  it('renders the RootListener instance with default settings', async () => {
+    const element = document.createElement('div');
+    const removed = jest.fn();
+    document.body.appendChild(element);
+    render(<RootListener />);
+    document.body.removeEventListener = removed;
+    await act(() => {
+      const event = new CustomEvent('render-html', {
+        bubbles: true,
+        detail: {
+          target: element,
+          props: {},
+        },
+      });
+      element.dispatchEvent(event);
+      return resolveAfter();
+    });
+    await act(resolveAfter);
+    expect(removed).not.toHaveBeenCalled();
+  });
+
+  it('removes the RootListener successfully', async () => {
+    const removed = jest.fn();
+    const container = render(<RootListener />);
+    document.body.removeEventListener = removed;
+    await act(resolveAfter);
+    container.unmount();
+    await act(resolveAfter);
+    expect(removed).toHaveBeenCalled();
+  });
+});

package/src/RootListener.tsx

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { useGlobalStateContext } from './hooks';
+import { renderElement } from './modules';
+
+export const RootListener: React.FC = () => {
+  const context = useGlobalStateContext();
+
+  React.useLayoutEffect(() => {
+    if (typeof document !== 'undefined') {
+      const handler = (ev: CustomEvent) => {
+        ev.stopPropagation();
+        const { target, props } = ev.detail;
+        const [dispose, update] = renderElement(context, target, props);
+        target.dispose = dispose;
+        target.update = update;
+      };
+      document.body.addEventListener('render-html', handler, false);
+
+      return () => {
+        document.body.removeEventListener('render-html', handler, false);
+      };
+    }
+  }, [context]);
+
+  return null;
+};