sample-piral 0.14.4 → 0.14.5-beta.3339

package/app/{index.1449bd.js → index.a7f28d.js}

@@ -1613,6 +1613,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var systemjs_dist_extras_named_register_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! systemjs/dist/extras/named-register.js */ "../../../node_modules/systemjs/dist/extras/named-register.js");
 /* harmony import */ var systemjs_dist_extras_named_register_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(systemjs_dist_extras_named_register_js__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "../../framework/piral-base/esm/utils.js");
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -1713,6 +1715,10 @@ function registerModule(name, resolve) {
             _exports('__esModule', true);
 
             _exports('default', content);
+          } else if (_typeof(content) === 'object') {
+            if (content && !Array.isArray(content) && !('default' in content)) {
+              _exports('default', content);
+            }
           }
         }
       }
@@ -2259,6 +2265,35 @@ DefaultLoadingIndicator.displayName = 'DefaultLoadingIndicator';
 
 /***/ }),
 
+/***/ "../../framework/piral-core/esm/components/DefaultRouter.js":
+/*!******************************************************************!*\
+  !*** ../../framework/piral-core/esm/components/DefaultRouter.js ***!
+  \******************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "DefaultRouter": () => (/* binding */ DefaultRouter)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../node_modules/react/index.js");
+/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-router-dom */ "../../../node_modules/react-router-dom/esm/react-router-dom.js");
+/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../hooks */ "../../framework/piral-core/esm/hooks/globalState.js");
+
+
+
+var DefaultRouter = function DefaultRouter(_ref) {
+  var children = _ref.children;
+  var publicPath = (0,_hooks__WEBPACK_IMPORTED_MODULE_1__.useGlobalState)(function (s) {
+    return s.app.publicPath;
+  });
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_2__.BrowserRouter, {
+    basename: publicPath
+  }, children);
+};
+
+/***/ }),
+
 /***/ "../../framework/piral-core/esm/components/ErrorBoundary.js":
 /*!******************************************************************!*\
   !*** ../../framework/piral-core/esm/components/ErrorBoundary.js ***!
@@ -2558,11 +2593,18 @@ var PiralContent = function PiralContent() {
   }));
 };
 
-var Router = typeof window === 'undefined' ? function (props) {
+var FallbackRouter = function FallbackRouter(props) {
+  var publicPath = (0,_hooks__WEBPACK_IMPORTED_MODULE_2__.useGlobalState)(function (s) {
+    return s.app.publicPath;
+  });
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_4__.StaticRouter, Object.assign({
     location: "/"
-  }, props));
-} : _components__WEBPACK_IMPORTED_MODULE_1__.PiralRouter;
+  }, props, {
+    basename: publicPath
+  }));
+};
+
+var Router = typeof window === 'undefined' ? FallbackRouter : _components__WEBPACK_IMPORTED_MODULE_1__.PiralRouter;
 
 var PiralProvider = function PiralProvider(_ref) {
   var children = _ref.children;
@@ -3015,41 +3057,44 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "DefaultErrorInfo": () => (/* reexport safe */ _DefaultErrorInfo__WEBPACK_IMPORTED_MODULE_1__.DefaultErrorInfo),
 /* harmony export */   "DefaultLayout": () => (/* reexport safe */ _DefaultLayout__WEBPACK_IMPORTED_MODULE_2__.DefaultLayout),
 /* harmony export */   "DefaultLoadingIndicator": () => (/* reexport safe */ _DefaultLoader__WEBPACK_IMPORTED_MODULE_3__.DefaultLoadingIndicator),
-/* harmony export */   "ErrorBoundary": () => (/* reexport safe */ _ErrorBoundary__WEBPACK_IMPORTED_MODULE_4__.ErrorBoundary),
-/* harmony export */   "ExtensionSlot": () => (/* reexport safe */ _ExtensionSlot__WEBPACK_IMPORTED_MODULE_5__.ExtensionSlot),
-/* harmony export */   "Mediator": () => (/* reexport safe */ _Mediator__WEBPACK_IMPORTED_MODULE_6__.Mediator),
-/* harmony export */   "PiralRoutes": () => (/* reexport safe */ _PiralRoutes__WEBPACK_IMPORTED_MODULE_7__.PiralRoutes),
-/* harmony export */   "PiralView": () => (/* reexport safe */ _PiralView__WEBPACK_IMPORTED_MODULE_8__.PiralView),
-/* harmony export */   "PortalRenderer": () => (/* reexport safe */ _PortalRenderer__WEBPACK_IMPORTED_MODULE_9__.PortalRenderer),
-/* harmony export */   "ResponsiveLayout": () => (/* reexport safe */ _ResponsiveLayout__WEBPACK_IMPORTED_MODULE_10__.ResponsiveLayout),
-/* harmony export */   "SetComponent": () => (/* reexport safe */ _SetComponent__WEBPACK_IMPORTED_MODULE_11__.SetComponent),
-/* harmony export */   "SetError": () => (/* reexport safe */ _SetError__WEBPACK_IMPORTED_MODULE_12__.SetError),
-/* harmony export */   "SetErrors": () => (/* reexport safe */ _SetErrors__WEBPACK_IMPORTED_MODULE_13__.SetErrors),
-/* harmony export */   "SetLayout": () => (/* reexport safe */ _SetLayout__WEBPACK_IMPORTED_MODULE_14__.SetLayout),
-/* harmony export */   "SetProvider": () => (/* reexport safe */ _SetProvider__WEBPACK_IMPORTED_MODULE_15__.SetProvider),
-/* harmony export */   "SetRedirect": () => (/* reexport safe */ _SetRedirect__WEBPACK_IMPORTED_MODULE_16__.SetRedirect),
-/* harmony export */   "SetRoute": () => (/* reexport safe */ _SetRoute__WEBPACK_IMPORTED_MODULE_17__.SetRoute),
-/* harmony export */   "SwitchErrorInfo": () => (/* reexport safe */ _SwitchErrorInfo__WEBPACK_IMPORTED_MODULE_18__.SwitchErrorInfo)
+/* harmony export */   "DefaultRouter": () => (/* reexport safe */ _DefaultRouter__WEBPACK_IMPORTED_MODULE_4__.DefaultRouter),
+/* harmony export */   "ErrorBoundary": () => (/* reexport safe */ _ErrorBoundary__WEBPACK_IMPORTED_MODULE_5__.ErrorBoundary),
+/* harmony export */   "ExtensionSlot": () => (/* reexport safe */ _ExtensionSlot__WEBPACK_IMPORTED_MODULE_6__.ExtensionSlot),
+/* harmony export */   "Mediator": () => (/* reexport safe */ _Mediator__WEBPACK_IMPORTED_MODULE_7__.Mediator),
+/* harmony export */   "PiralRoutes": () => (/* reexport safe */ _PiralRoutes__WEBPACK_IMPORTED_MODULE_8__.PiralRoutes),
+/* harmony export */   "PiralView": () => (/* reexport safe */ _PiralView__WEBPACK_IMPORTED_MODULE_9__.PiralView),
+/* harmony export */   "PortalRenderer": () => (/* reexport safe */ _PortalRenderer__WEBPACK_IMPORTED_MODULE_10__.PortalRenderer),
+/* harmony export */   "ResponsiveLayout": () => (/* reexport safe */ _ResponsiveLayout__WEBPACK_IMPORTED_MODULE_11__.ResponsiveLayout),
+/* harmony export */   "SetComponent": () => (/* reexport safe */ _SetComponent__WEBPACK_IMPORTED_MODULE_12__.SetComponent),
+/* harmony export */   "SetError": () => (/* reexport safe */ _SetError__WEBPACK_IMPORTED_MODULE_13__.SetError),
+/* harmony export */   "SetErrors": () => (/* reexport safe */ _SetErrors__WEBPACK_IMPORTED_MODULE_14__.SetErrors),
+/* harmony export */   "SetLayout": () => (/* reexport safe */ _SetLayout__WEBPACK_IMPORTED_MODULE_15__.SetLayout),
+/* harmony export */   "SetProvider": () => (/* reexport safe */ _SetProvider__WEBPACK_IMPORTED_MODULE_16__.SetProvider),
+/* harmony export */   "SetRedirect": () => (/* reexport safe */ _SetRedirect__WEBPACK_IMPORTED_MODULE_17__.SetRedirect),
+/* harmony export */   "SetRoute": () => (/* reexport safe */ _SetRoute__WEBPACK_IMPORTED_MODULE_18__.SetRoute),
+/* harmony export */   "SwitchErrorInfo": () => (/* reexport safe */ _SwitchErrorInfo__WEBPACK_IMPORTED_MODULE_19__.SwitchErrorInfo)
 /* harmony export */ });
 /* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/components.js");
 /* harmony import */ var _DefaultErrorInfo__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DefaultErrorInfo */ "../../framework/piral-core/esm/components/DefaultErrorInfo.js");
 /* harmony import */ var _DefaultLayout__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DefaultLayout */ "../../framework/piral-core/esm/components/DefaultLayout.js");
 /* harmony import */ var _DefaultLoader__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./DefaultLoader */ "../../framework/piral-core/esm/components/DefaultLoader.js");
-/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ErrorBoundary */ "../../framework/piral-core/esm/components/ErrorBoundary.js");
-/* harmony import */ var _ExtensionSlot__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./ExtensionSlot */ "../../framework/piral-core/esm/components/ExtensionSlot.js");
-/* harmony import */ var _Mediator__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Mediator */ "../../framework/piral-core/esm/components/Mediator.js");
-/* harmony import */ var _PiralRoutes__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./PiralRoutes */ "../../framework/piral-core/esm/components/PiralRoutes.js");
-/* harmony import */ var _PiralView__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./PiralView */ "../../framework/piral-core/esm/components/PiralView.js");
-/* harmony import */ var _PortalRenderer__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./PortalRenderer */ "../../framework/piral-core/esm/components/PortalRenderer.js");
-/* harmony import */ var _ResponsiveLayout__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./ResponsiveLayout */ "../../framework/piral-core/esm/components/ResponsiveLayout.js");
-/* harmony import */ var _SetComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./SetComponent */ "../../framework/piral-core/esm/components/SetComponent.js");
-/* harmony import */ var _SetError__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./SetError */ "../../framework/piral-core/esm/components/SetError.js");
-/* harmony import */ var _SetErrors__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./SetErrors */ "../../framework/piral-core/esm/components/SetErrors.js");
-/* harmony import */ var _SetLayout__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./SetLayout */ "../../framework/piral-core/esm/components/SetLayout.js");
-/* harmony import */ var _SetProvider__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./SetProvider */ "../../framework/piral-core/esm/components/SetProvider.js");
-/* harmony import */ var _SetRedirect__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./SetRedirect */ "../../framework/piral-core/esm/components/SetRedirect.js");
-/* harmony import */ var _SetRoute__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./SetRoute */ "../../framework/piral-core/esm/components/SetRoute.js");
-/* harmony import */ var _SwitchErrorInfo__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./SwitchErrorInfo */ "../../framework/piral-core/esm/components/SwitchErrorInfo.js");
+/* harmony import */ var _DefaultRouter__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./DefaultRouter */ "../../framework/piral-core/esm/components/DefaultRouter.js");
+/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./ErrorBoundary */ "../../framework/piral-core/esm/components/ErrorBoundary.js");
+/* harmony import */ var _ExtensionSlot__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ExtensionSlot */ "../../framework/piral-core/esm/components/ExtensionSlot.js");
+/* harmony import */ var _Mediator__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Mediator */ "../../framework/piral-core/esm/components/Mediator.js");
+/* harmony import */ var _PiralRoutes__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./PiralRoutes */ "../../framework/piral-core/esm/components/PiralRoutes.js");
+/* harmony import */ var _PiralView__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./PiralView */ "../../framework/piral-core/esm/components/PiralView.js");
+/* harmony import */ var _PortalRenderer__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./PortalRenderer */ "../../framework/piral-core/esm/components/PortalRenderer.js");
+/* harmony import */ var _ResponsiveLayout__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./ResponsiveLayout */ "../../framework/piral-core/esm/components/ResponsiveLayout.js");
+/* harmony import */ var _SetComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./SetComponent */ "../../framework/piral-core/esm/components/SetComponent.js");
+/* harmony import */ var _SetError__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./SetError */ "../../framework/piral-core/esm/components/SetError.js");
+/* harmony import */ var _SetErrors__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./SetErrors */ "../../framework/piral-core/esm/components/SetErrors.js");
+/* harmony import */ var _SetLayout__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./SetLayout */ "../../framework/piral-core/esm/components/SetLayout.js");
+/* harmony import */ var _SetProvider__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./SetProvider */ "../../framework/piral-core/esm/components/SetProvider.js");
+/* harmony import */ var _SetRedirect__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./SetRedirect */ "../../framework/piral-core/esm/components/SetRedirect.js");
+/* harmony import */ var _SetRoute__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./SetRoute */ "../../framework/piral-core/esm/components/SetRoute.js");
+/* harmony import */ var _SwitchErrorInfo__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./SwitchErrorInfo */ "../../framework/piral-core/esm/components/SwitchErrorInfo.js");
+
 
 
 
@@ -3145,7 +3190,7 @@ function createInstance() {
   var createApi = apiFactory(context, usedPlugins);
   var root = createApi({
     name: 'root',
-    version: "0.14.4" || 0,
+    version: "0.14.5-beta.3339" || 0,
     spec: ''
   });
   var options = (0,_helpers__WEBPACK_IMPORTED_MODULE_5__.createPiletOptions)({
@@ -3503,6 +3548,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "DefaultErrorInfo": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.DefaultErrorInfo),
 /* harmony export */   "DefaultLayout": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.DefaultLayout),
 /* harmony export */   "DefaultLoadingIndicator": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.DefaultLoadingIndicator),
+/* harmony export */   "DefaultRouter": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.DefaultRouter),
 /* harmony export */   "ErrorBoundary": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.ErrorBoundary),
 /* harmony export */   "ExtensionSlot": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.ExtensionSlot),
 /* harmony export */   "Mediator": () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.Mediator),
@@ -3980,16 +4026,15 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var _dbeining_react_atom__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dbeining/react-atom */ "../../../node_modules/@dbeining/react-atom/dist/react-atom.js");
 /* harmony import */ var _dbeining_react_atom__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dbeining_react_atom__WEBPACK_IMPORTED_MODULE_4__);
-/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-router-dom */ "../../../node_modules/react-router-dom/esm/react-router-dom.js");
 /* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/DefaultErrorInfo.js");
 /* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/DefaultLoader.js");
+/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/DefaultRouter.js");
 /* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/DefaultLayout.js");
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
 
 
 
-
 function extend(defaultState, customState) {
   for (var _i = 0, _Object$keys = Object.keys(customState); _i < _Object$keys.length; _i++) {
     var key = _Object$keys[_i];
@@ -4013,12 +4058,13 @@ function createGlobalState() {
     app: {
       error: undefined,
       loading: typeof window !== 'undefined',
-      layout: 'desktop'
+      layout: 'desktop',
+      publicPath: "/" || 0
     },
     components: {
       ErrorInfo: _components__WEBPACK_IMPORTED_MODULE_0__.DefaultErrorInfo,
       LoadingIndicator: _components__WEBPACK_IMPORTED_MODULE_1__.DefaultLoadingIndicator,
-      Router: react_router_dom__WEBPACK_IMPORTED_MODULE_2__.BrowserRouter,
+      Router: _components__WEBPACK_IMPORTED_MODULE_2__.DefaultRouter,
       Layout: _components__WEBPACK_IMPORTED_MODULE_3__.DefaultLayout
     },
     errorComponents: {},
@@ -4245,7 +4291,8 @@ function wrapForeignComponent(component, stasisOptions, piral, Wrapper) {
         destroyPortal = _useActions.destroyPortal;
 
     var _useGlobalStateContex = (0,_hooks__WEBPACK_IMPORTED_MODULE_5__.useGlobalStateContext)(),
-        state = _useGlobalStateContex.state;
+        state = _useGlobalStateContex.state,
+        readState = _useGlobalStateContex.readState;
 
     var router = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_6__.__RouterContext);
     var id = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(function () {
@@ -4254,7 +4301,8 @@ function wrapForeignComponent(component, stasisOptions, piral, Wrapper) {
     var context = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(function () {
       return {
         router: router,
-        state: state
+        state: state,
+        readState: readState
       };
     }, [router, state]);
     var innerProps = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(function () {
@@ -5319,6 +5367,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "DefaultErrorInfo": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.DefaultErrorInfo),
 /* harmony export */   "DefaultLayout": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.DefaultLayout),
 /* harmony export */   "DefaultLoadingIndicator": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.DefaultLoadingIndicator),
+/* harmony export */   "DefaultRouter": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.DefaultRouter),
 /* harmony export */   "ErrorBoundary": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.ErrorBoundary),
 /* harmony export */   "ExtensionSlot": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.ExtensionSlot),
 /* harmony export */   "Mediator": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.Mediator),
@@ -8941,11 +8990,11 @@ function installPiralDebug(options) {
     debug: debugApiVersion,
     instance: {
       name: "sample-piral",
-      version: "0.14.4",
+      version: "0.14.5-beta.3339",
       dependencies: "reactstrap,react,react-dom,react-router,react-router-dom,history,tslib,path-to-regexp,@libre/atom,@dbeining/react-atom"
     },
     build: {
-      date: "2021-12-01T01:31:44.431Z",
+      date: "2021-12-10T16:53:56.756Z",
       cli: "0.14.4",
       compat: "0.14"
     },
@@ -10567,14 +10616,13 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../node_modules/css-loader/dist/runtime/getUrl.js */ "../../../node_modules/css-loader/dist/runtime/getUrl.js");
 /* harmony import */ var _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_2__);
 /* harmony import */ var _images_close_svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../images/close.svg */ "./src/images/close.svg");
-/* harmony import */ var _images_close_svg__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_images_close_svg__WEBPACK_IMPORTED_MODULE_3__);
 // Imports
 
 
 
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default()));
-var ___CSS_LOADER_URL_REPLACEMENT_0___ = _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_2___default()((_images_close_svg__WEBPACK_IMPORTED_MODULE_3___default()));
+var ___CSS_LOADER_URL_REPLACEMENT_0___ = _node_modules_css_loader_dist_runtime_getUrl_js__WEBPACK_IMPORTED_MODULE_2___default()(_images_close_svg__WEBPACK_IMPORTED_MODULE_3__);
 // Module
 ___CSS_LOADER_EXPORT___.push([module.id, "html, body, #app, .app-container {\n  width: 100%;\n  min-height: 100%;\n  background: white;\n}\n\nhtml, body {\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  font-family: \"Roboto\", sans-serif;\n}\n\na {\n  text-decoration: none;\n  color: #56aa1c;\n}\na:hover {\n  color: #407e15;\n}\n\n.pi-modal {\n  display: none;\n  position: fixed;\n  z-index: 3;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  background: rgba(0, 0, 0, 0.4);\n  animation: fade-in 0.4s;\n}\n.pi-modal .pi-modal-dialog {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  top: 0;\n  max-width: 90%;\n  max-height: 90%;\n  margin: auto;\n  background: #fefefe;\n  animation: fade-in 0.4s;\n}\n\nbody.pi-modal-open {\n  height: 100vh;\n  overflow-y: hidden;\n  padding-right: 15px;\n  position: fixed;\n}\nbody.pi-modal-open .pi-modal {\n  display: block;\n}\n\n.text-right {\n  text-align: right;\n}\n\n.language-picker {\n  position: relative;\n  margin: 4px 8px 0 0;\n}\n.language-picker .current {\n  cursor: pointer;\n}\n.language-picker ul {\n  display: none;\n  background: #f5f5f6;\n  border: none;\n  margin: 0;\n  padding: 0;\n  overflow: hidden;\n  border-radius: 3px 0 3px 3px;\n  background-clip: padding-box;\n  margin-bottom: 5px;\n  position: absolute;\n  top: 100%;\n  right: 0;\n}\n.language-picker ul li {\n  cursor: pointer;\n  border-bottom: 1px solid #ebebeb;\n  padding: 10px 20px;\n  margin: 0;\n  outline: 0;\n  color: #7d8086;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.language-picker ul li span {\n  padding-left: 8px;\n}\n.language-picker ul li:hover {\n  background: rgba(235, 235, 235, 0.9);\n  color: #737881;\n}\n.language-picker ul.open {\n  display: block;\n}\n\n.language-icon {\n  height: 16px;\n  width: 16px;\n}\n\n@keyframes fade-in {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.app-container {\n  flex: 1;\n  position: relative;\n}\n\n.pi-notifications {\n  position: fixed;\n  display: flex;\n  align-items: flex-end;\n  flex-direction: column;\n  right: 2em;\n  bottom: 2em;\n}\n.pi-notifications .pi-item {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  text-align: left;\n  padding: 0.8em;\n  background-color: white;\n  max-width: 500px;\n  position: relative;\n  box-shadow: 1px 7px 14px -5px rgba(0, 0, 0, 0.2);\n}\n.pi-notifications .pi-item + .pi-notifications .pi-item {\n  margin-top: 1em;\n}\n.pi-notifications .pi-item.success:before {\n  background-color: #2BDE3F;\n}\n.pi-notifications .pi-item.error:before {\n  background-color: #e7431a;\n}\n.pi-notifications .pi-item.info:before {\n  background-color: #1D72F3;\n}\n.pi-notifications .pi-item.warning:before {\n  background-color: #FFC007;\n}\n.pi-notifications .pi-item:before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 2px;\n}\n.pi-notifications .pi-item .pi-details {\n  flex: 1;\n}\n.pi-notifications .pi-item .pi-details .pi-title {\n  color: #3e3e3e;\n  font-weight: 700;\n  margin-top: 0;\n  margin-bottom: 8px;\n}\n.pi-notifications .pi-item .pi-details .pi-description {\n  font-size: 14px;\n  margin-top: 0;\n  margin-bottom: 0;\n  color: #878787;\n}\n.pi-notifications .pi-item .pi-close {\n  width: 14px;\n  cursor: pointer;\n  height: 14px;\n  fill: #878787;\n  margin-left: 1.2em;\n  background: url(" + ___CSS_LOADER_URL_REPLACEMENT_0___ + ") no-repeat center center;\n}\n@media screen and (max-width: 650px) {\n  .pi-notifications {\n    right: 0;\n    left: 0;\n    bottom: 0;\n  }\n  .pi-notifications .pi-item {\n    max-width: 100%;\n    width: 100%;\n  }\n}\n\n.app-container, #app {\n  display: flex;\n  flex-direction: column;\n}\n\n.app-content {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  padding: 0 2em;\n}\n\n.app-title {\n  display: flex;\n  position: relative;\n  align-items: center;\n}\n\n.app-header {\n  display: flex;\n  flex-direction: row;\n  padding: 0 2em;\n  margin-bottom: 1em;\n  align-items: center;\n  justify-content: space-between;\n  background: #abcdef;\n  position: relative;\n  z-index: 2;\n}\n.app-header h1 {\n  white-space: nowrap;\n  font-size: 2rem;\n}\n@media screen and (max-width: 650px) {\n  .app-header {\n    padding: 0 1em;\n  }\n  .app-header h1 {\n    display: none;\n  }\n}\n\n.pi-center {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-grow: 1;\n}\n\n.app-footer {\n  font-size: 0.8em;\n  padding: 1em 0;\n  background: #d6e7f7;\n  display: flex;\n  flex-direction: row;\n}\n.app-footer .pi-menu {\n  margin: 0 auto;\n  max-width: 1000px;\n  column-width: 300px;\n  display: block;\n}\n.app-footer .pi-menu .pi-item {\n  display: block;\n  padding: 1em 2em;\n}\n\n.app-menu {\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  padding: 0;\n  margin: 0;\n  width: 300px;\n  max-width: 100%;\n  background: #ebf3fb;\n  transform: translateX(-100%);\n  transition: all 0.1s ease;\n  padding-top: 85px;\n  z-index: 1;\n}\n.app-menu.is-open {\n  transform: none;\n  box-shadow: 30px 0px 30px -30px rgba(0, 0, 0, 0.2);\n}\n.app-menu .app-menu-content {\n  overflow-y: auto;\n  height: 100%;\n}\n.app-menu .pi-menu {\n  display: flex;\n  flex-direction: column;\n  list-style: none;\n}\n.app-menu .pi-menu > .pi-item {\n  flex: 1;\n  margin: 1px 0;\n}\n.app-menu .pi-menu > .pi-item > a {\n  display: block;\n  border-left: 5px solid #abcdef;\n  padding: 1em;\n}\n.app-menu .pi-menu > .pi-item > a:hover {\n  border-left-color: #559adf;\n}\n\n.pi-spinner {\n  position: relative;\n  width: 50px;\n  height: 50px;\n  font-size: 0;\n}\n.pi-spinner:before, .pi-spinner:after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  border-width: 4px;\n  border-style: solid;\n  border-radius: 50%;\n}\n@keyframes rotate-animation {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n@keyframes anti-rotate-animation {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(-360deg);\n  }\n}\n.pi-spinner:before {\n  width: 42px;\n  height: 42px;\n  border-bottom-color: #56aa1c;\n  border-right-color: #56aa1c;\n  border-top-color: rgba(86, 170, 28, 0);\n  border-left-color: rgba(86, 170, 28, 0);\n  top: 0;\n  left: 0;\n  animation: rotate-animation 1s linear 0s infinite;\n}\n.pi-spinner:after {\n  width: 29.4px;\n  height: 29.4px;\n  border-bottom-color: #56aa1c;\n  border-right-color: #56aa1c;\n  border-top-color: rgba(86, 170, 28, 0);\n  border-left-color: rgba(86, 170, 28, 0);\n  top: 6.3px;\n  left: 6.3px;\n  animation: anti-rotate-animation 0.85s linear 0s infinite;\n}\n\n.pi-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n}\n\n.pi-dashboard {\n  flex: 1;\n  position: relative;\n  display: grid;\n  grid-template-columns: repeat(auto-fit, 70px);\n  grid-template-rows: repeat(auto-fit, 70px);\n  grid-gap: 10px;\n  overflow: visible;\n}\n.pi-dashboard .pi-tile {\n  display: flex;\n  position: relative;\n}\n.pi-dashboard .pi-tile.small {\n  grid-column: span 1;\n  grid-row: span 1;\n  width: 70px;\n  height: 70px;\n}\n.pi-dashboard .pi-tile.medium {\n  grid-column: span 2;\n  grid-row: span 2;\n  width: 150px;\n  height: 150px;\n}\n.pi-dashboard .pi-tile.wide {\n  grid-column: span 4;\n  grid-row: span 2;\n  width: 310px;\n  height: 150px;\n}\n.pi-dashboard .pi-tile.large {\n  grid-column: span 4;\n  grid-row: span 4;\n  width: 310px;\n  height: 310px;\n}\n.pi-dashboard .pi-tile:hover {\n  outline: rgba(29, 29, 29, 0.1) solid 4px;\n}\n\n.pi-search {\n  position: relative;\n  flex: 1;\n  display: flex;\n  justify-content: center;\n}\n.pi-search input[type=search] {\n  font-size: 1em;\n  border: 1px solid transparent;\n  background-color: #f1f1f1;\n  padding: 10px;\n  font-size: 16px;\n  max-width: 80%;\n  width: 250px;\n  box-sizing: border-box;\n  transition: width ease 0.1s;\n}\n@media screen and (max-width: 450px) {\n  .pi-search input[type=search] {\n    width: 100px;\n  }\n}\n.pi-search:focus-within input[type=search] {\n  width: 90%;\n  max-width: 90%;\n}\n.pi-search:focus-within input[type=search] + .pi-details:not(:empty) {\n  display: block;\n  opacity: 1;\n}\n.pi-search .pi-details {\n  display: none;\n  opacity: 0;\n  position: absolute;\n  z-index: 2;\n  top: 100%;\n  width: 90%;\n  box-sizing: border-box;\n  background: #f0f0f0;\n  padding: 1px;\n  transition: all 0.1s 0.1s ease;\n}\n.pi-search .pi-item {\n  display: block;\n  padding: 10px;\n  cursor: pointer;\n  background-color: white;\n  border-bottom: 1px solid #d4d4d4;\n}\n.pi-search .pi-item:hover {\n  background-color: #e9e9e9;\n}\n.pi-search .pi-center {\n  padding: 30px;\n  background-color: white;\n}\n\n.form-row {\n  margin: 1em;\n}\n.form-row label {\n  display: block;\n  margin-bottom: 0.2em;\n}\n.form-row input {\n  padding: 0.3rem;\n  font-size: 1rem;\n}\n.form-row button {\n  padding: 0.5em 1em;\n  border: 1px solid black;\n  font-weight: bold;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.form-row button:disabled {\n  border: 1px solid #ccc;\n  color: #ccc;\n  cursor: default;\n}\n\n.pi-error > img {\n  width: 600px;\n  max-width: 100%;\n  margin: 1em 0;\n}\n.pi-error .pi-title {\n  color: #56aa1c;\n  display: block;\n  font-size: 1.5em;\n}\n.pi-error .pi-description {\n  display: block;\n  margin: 0.5em 0;\n}\n.pi-error .pi-details {\n  display: block;\n  margin: 0.5em 0;\n  color: #3e3e3e;\n  font-size: 0.8em;\n}\n\n.app-user {\n  position: relative;\n}\n.app-user .app-user-avatar {\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  cursor: pointer;\n}\n.app-user .app-user-avatar img {\n  position: relative;\n  overflow: hidden;\n  width: 32px;\n  min-width: 32px;\n  height: 32px;\n  border-radius: 50% !important;\n  vertical-align: middle;\n  border-style: none;\n  box-sizing: border-box;\n  line-height: 1;\n  margin-right: 0.5em;\n}\n.app-user .app-user-avatar::after {\n  display: inline-block;\n  box-sizing: border-box;\n  height: 8px;\n  width: 8px;\n  border-style: solid;\n  border-color: black;\n  border-width: 0px 2px 2px 0px;\n  position: relative;\n  transform: rotate(45deg);\n  transition: opacity 150ms ease-in-out;\n  content: \"\";\n}\n.app-user .app-user-details {\n  display: none;\n  list-style: none;\n  position: absolute;\n  background: white;\n  padding: 0;\n  right: 0;\n  border: 1px solid #ececec;\n  border-radius: 3px;\n  top: 40px;\n  cursor: default;\n}\n.app-user .app-user-details li {\n  display: block;\n  padding: 10px;\n  max-width: 300px;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  text-align: right;\n}\n.app-user .app-user-details li > a {\n  display: block;\n}\n.app-user .app-user-details li.sep {\n  border-bottom: 1px solid #ccc;\n  padding: 0;\n}\n.app-user .app-user-details li .user-name {\n  font-weight: bold;\n  color: #666;\n  display: block;\n  font-size: 0.6em;\n}\n.app-user .app-user-details:before, .app-user .app-user-details:after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  bottom: 100%;\n  width: 0;\n  height: 0;\n}\n.app-user .app-user-details:before {\n  right: 27px;\n  border: 6px solid transparent;\n  border-bottom-color: #ececec;\n}\n.app-user .app-user-details:after {\n  right: 28px;\n  border: 5px solid transparent;\n  border-bottom-color: #fff;\n}\n.app-user.is-open img {\n  opacity: 0.8;\n}\n.app-user.is-open .app-user-details {\n  display: block;\n}\n.app-user.is-open::after {\n  opacity: 0.2;\n}\n\n.hamburger {\n  padding: 15px 0;\n  display: inline-block;\n  cursor: pointer;\n  transition-property: opacity, filter;\n  transition-duration: 0.15s;\n  transition-timing-function: linear;\n  font: inherit;\n  color: inherit;\n  text-transform: none;\n  background-color: transparent;\n  border: 0;\n  margin: 0;\n  overflow: visible;\n  transform: scale(0.6);\n}\n.hamburger:hover {\n  opacity: 0.7;\n}\n.hamburger.is-active:hover {\n  opacity: 0.7;\n}\n.hamburger.is-active .hamburger-inner,\n.hamburger.is-active .hamburger-inner::before,\n.hamburger.is-active .hamburger-inner::after {\n  background-color: #000;\n}\n\n.hamburger-box {\n  width: 40px;\n  height: 24px;\n  display: inline-block;\n  position: relative;\n}\n\n.hamburger-inner {\n  display: block;\n  top: 50%;\n  margin-top: -2px;\n}\n.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {\n  width: 40px;\n  height: 4px;\n  background-color: #000;\n  border-radius: 4px;\n  position: absolute;\n  transition-property: transform;\n  transition-duration: 0.15s;\n  transition-timing-function: ease;\n}\n.hamburger-inner::before, .hamburger-inner::after {\n  content: \"\";\n  display: block;\n}\n.hamburger-inner::before {\n  top: -10px;\n}\n.hamburger-inner::after {\n  bottom: -10px;\n}\n\n.hamburger--arrow.is-active .hamburger-inner::before {\n  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);\n}\n.hamburger--arrow.is-active .hamburger-inner::after {\n  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);\n}", "",{"version":3,"sources":["webpack://./src/styles/_layout.scss","webpack://./src/styles/index.scss","webpack://./src/styles/_burger.scss"],"names":[],"mappings":"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","sourcesContent":["@use 'sass:math';\n\nhtml, body, #app, .app-container {\n  width: 100%;\n  min-height: 100%;\n  background: $bg-color;\n}\n\nhtml, body {\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  font-family: 'Roboto', sans-serif;\n}\n\na {\n  text-decoration: none;\n  color: $basic-dark-color;\n\n  &:hover {\n    color: darken($color: $basic-dark-color, $amount: 10%)\n  }\n}\n\n.pi-modal {\n  display: none;\n  position: fixed;\n  z-index: 3;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  background: rgba(0, 0, 0, 0.4);\n  animation: fade-in 0.4s;\n\n  .pi-modal-dialog {\n    position: fixed;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    top: 0;\n    max-width: 90%;\n    max-height: 90%;\n    margin: auto;\n    background: #fefefe;\n    animation: fade-in 0.4s;\n  }\n}\n\nbody.pi-modal-open {\n  height: 100vh;\n  overflow-y: hidden;\n  padding-right: 15px;\n  position: fixed;\n\n  .pi-modal {\n    display: block;\n  }\n}\n\n.text-right {\n  text-align: right;\n}\n\n.language-picker {\n  position: relative;\n  margin: 4px 8px 0 0;\n\n  .current {\n    cursor: pointer;\n  }\n\n  ul {\n    display: none;\n    background: #f5f5f6;\n    border: none;\n    margin: 0;\n    padding: 0;\n    overflow: hidden;\n    border-radius: 3px 0 3px 3px;\n    background-clip: padding-box;\n    margin-bottom: 5px;\n    position: absolute;\n    top: 100%;\n    right: 0;\n\n    li {\n      cursor: pointer;\n      border-bottom: 1px solid #ebebeb;\n      padding: 10px 20px;\n      margin: 0;\n      outline: 0;\n      color: #7d8086;\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n\n      span {\n        padding-left: 8px;\n      }\n\n      &:hover {\n        background: rgba(235, 235, 235, 0.9);\n        color: #737881;\n      }\n    }\n\n    &.open {\n      display: block;\n    }\n  }\n}\n\n.language-icon {\n  height: 16px;\n  width: 16px;\n}\n\n@keyframes fade-in {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n.app-container {\n  flex: 1;\n  position: relative;\n}\n\n.pi-notifications {\n  position: fixed;\n  display: flex;\n  align-items: flex-end;\n  flex-direction: column;\n  right: 2em;\n  bottom: 2em;\n\n  .pi-item {\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    text-align: left;\n    padding: 0.8em;\n    background-color: $bg-color;\n    max-width: 500px;\n    position: relative;\n    box-shadow: 1px 7px 14px -5px rgba(0,0,0,0.2);\n\n    &+& {\n      margin-top: 1em;\n    }\n\n    &.success:before {\n      background-color: #2BDE3F;\n    }\n\n    &.error:before {\n      background-color: #e7431a;\n    }\n\n    &.info:before {\n      background-color: #1D72F3;\n    }\n\n    &.warning:before {\n      background-color: #FFC007;\n    }\n\n    &:before {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 2px;\n    }\n\n    .pi-details {\n      flex: 1;\n\n      .pi-title {\n        color: #3e3e3e;\n        font-weight: 700;\n        margin-top: 0;\n        margin-bottom: 8px;\n      }\n\n      .pi-description {\n        font-size: 14px;\n        margin-top: 0;\n        margin-bottom: 0;\n        color: #878787;\n      }\n    }\n\n    .pi-close {\n      width: 14px;\n      cursor: pointer;\n      height: 14px;\n      fill: #878787;\n      margin-left: 1.2em;\n      background: url('../images/close.svg') no-repeat center center;\n    }\n  }\n\n  @media screen and (max-width: $breakpoint-tablet) {\n    right: 0;\n    left: 0;\n    bottom: 0;\n\n    .pi-item {\n      max-width: 100%;\n      width: 100%;\n    }\n  }\n}\n\n.app-container, #app {\n  display: flex;\n  flex-direction: column;\n}\n\n.app-content {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  padding: 0 2em;\n}\n\n.app-title {\n  display: flex;\n  position: relative;\n  align-items: center;\n}\n\n.app-header {\n  display: flex;\n  flex-direction: row;\n  padding: 0 2em;\n  margin-bottom: 1em;\n  align-items: center;\n  justify-content: space-between;\n  background: $header-color;\n  position: relative;\n  z-index: 2;\n\n  h1 {\n    white-space: nowrap;\n    font-size: 2rem;\n  }\n\n  @media screen and (max-width: $breakpoint-tablet) {\n    padding: 0 1em;\n\n    h1 {\n      display: none;\n    }\n  }\n}\n\n.pi-center {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-grow: 1;\n}\n\n.app-footer {\n  font-size: 0.8em;\n  padding: 1em 0;\n  background: $footer-color;\n  display: flex;\n  flex-direction: row;\n\n  .pi-menu {\n    margin: 0 auto;\n    max-width: 1000px;\n    column-width: 300px;\n    display: block;\n\n    .pi-item {\n      display: block;\n      padding: 1em 2em;\n    }\n  }\n}\n\n.app-menu {\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  padding: 0;\n  margin: 0;\n  width: 300px;\n  max-width: 100%;\n  background: lighten($header-color, 15%);\n  transform: translateX(-100%);\n  transition: all 0.1s ease;\n  padding-top: 85px;\n  z-index: 1;\n\n  &.is-open {\n    transform: none;\n    box-shadow: $menu-shadow-size 0px $menu-shadow-size (-$menu-shadow-size) rgba(0, 0, 0, 0.2);\n  }\n\n  .app-menu-content {\n    overflow-y: auto;\n    height: 100%;\n  }\n\n  .pi-menu {\n    display: flex;\n    flex-direction: column;\n    list-style: none;\n\n    > .pi-item {\n      flex: 1;\n      margin: 1px 0;\n\n      > a {\n        display: block;\n        border-left: 5px solid $header-color;\n        padding: 1em;\n\n        &:hover {\n          border-left-color: $menu-color;\n        }\n      }\n    }\n  }\n}\n\n.pi-spinner {\n  position: relative;\n  width: $basic-spinner-dimensions;\n  height: $basic-spinner-dimensions;\n  font-size: 0;\n\n  &:before,\n  &:after {\n    content: \"\";\n    display: block;\n    position: absolute;\n    border-width: 4px;\n    border-style: solid;\n    border-radius: 50%;\n  }\n\n  @keyframes rotate-animation {\n    0% {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes anti-rotate-animation {\n    0% {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(-360deg);\n    }\n  }\n\n  &:before {\n    width: $main-spinner-dimensions;\n    height: $main-spinner-dimensions;\n    border-bottom-color: $basic-dark-color;\n    border-right-color: $basic-dark-color;\n    border-top-color: rgba($basic-dark-color, 0);\n    border-left-color: rgba($basic-dark-color, 0);\n    top: 0;\n    left: 0;\n    animation: rotate-animation 1s linear 0s infinite;\n  }\n\n  &:after {\n    width: $small-spinner-dimensions;\n    height: $small-spinner-dimensions;\n    border-bottom-color: $basic-dark-color;\n    border-right-color: $basic-dark-color;\n    border-top-color: rgba($basic-dark-color, 0);\n    border-left-color: rgba($basic-dark-color, 0);\n    top: math.div($main-spinner-dimensions - $small-spinner-dimensions, 2);\n    left: math.div($main-spinner-dimensions - $small-spinner-dimensions, 2);\n    animation: anti-rotate-animation 0.85s linear 0s infinite;\n  }\n}\n\n$tile-height: 70px;\n$tile-width: 70px;\n$tile-gap: 10px;\n\n.pi-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n}\n\n.pi-dashboard {\n  flex: 1;\n  position: relative;\n  display: grid;\n  grid-template-columns: repeat(auto-fit, $tile-width);\n  grid-template-rows: repeat(auto-fit, $tile-height);\n  grid-gap: $tile-gap;\n  overflow: visible;\n\n  .pi-tile {\n    display: flex;\n    position: relative;\n\n    &.small {\n      grid-column: span 1;\n      grid-row: span 1;\n      width: $tile-width;\n      height: $tile-height;\n    }\n\n    &.medium {\n      grid-column: span 2;\n      grid-row: span 2;\n      width: 2 * $tile-width + 1 * $tile-gap;\n      height: 2 * $tile-height + 1 * $tile-gap;\n    }\n\n    &.wide {\n      grid-column: span 4;\n      grid-row: span 2;\n      width: 4 * $tile-width + 3 * $tile-gap;\n      height: 2 * $tile-height + 1 * $tile-gap;\n    }\n\n    &.large {\n      grid-column: span 4;\n      grid-row: span 4;\n      width: 4 * $tile-width + 3 * $tile-gap;\n      height: 4 * $tile-height + 3 * $tile-gap;\n    }\n\n    &:hover {\n      outline: rgba(29, 29, 29, 0.1) solid 4px;\n    }\n  }\n}\n\n.pi-search {\n  position: relative;\n  flex: 1;\n  display: flex;\n  justify-content: center;\n\n  input[type=search] {\n    font-size: 1em;\n    border: 1px solid transparent;\n    background-color: #f1f1f1;\n    padding: 10px;\n    font-size: 16px;\n    max-width: 80%;\n    width: 250px;\n    box-sizing: border-box;\n    transition: width ease 0.1s;\n\n    @media screen and (max-width: $breakpoint-mobile) {\n      width: 100px;\n    }\n  }\n\n  &:focus-within input[type=search] {\n    width: 90%;\n    max-width: 90%;\n\n    & + .pi-details:not(:empty) {\n      display: block;\n      opacity: 1;\n    }\n  }\n\n  .pi-details {\n    display: none;\n    opacity: 0;\n    position: absolute;\n    z-index: 2;\n    top: 100%;\n    width: 90%;\n    box-sizing: border-box;\n    background: #f0f0f0;\n    padding: 1px;\n    transition: all 0.1s 0.1s ease;\n  }\n\n  .pi-item {\n    display: block;\n    padding: 10px;\n    cursor: pointer;\n    background-color: white;\n    border-bottom: 1px solid #d4d4d4;\n  }\n\n  .pi-item:hover {\n    background-color: #e9e9e9;\n  }\n\n  .pi-center {\n    padding: 30px;\n    background-color: white;\n  }\n}\n\n.form-row {\n  margin: 1em;\n\n  label {\n    display: block;\n    margin-bottom: 0.2em;\n  }\n\n  input {\n    padding: 0.3rem;\n    font-size: 1rem;\n  }\n\n  button {\n    padding: 0.5em 1em;\n    border: 1px solid black;\n    font-weight: bold;\n    border-radius: 4px;\n    cursor: pointer;\n  }\n\n  button:disabled {\n    border: 1px solid #ccc;\n    color: #ccc;\n    cursor: default;\n  }\n}\n\n.pi-error {\n  > img {\n    width: 600px;\n    max-width: 100%;\n    margin: 1em 0;\n  }\n\n  .pi-title {\n    color: $basic-dark-color;\n    display: block;\n    font-size: 1.5em;\n  }\n\n  .pi-description {\n    display: block;\n    margin: 0.5em 0;\n  }\n\n  .pi-details {\n    display: block;\n    margin: 0.5em 0;\n    color: #3e3e3e;\n    font-size: 0.8em;\n  }\n}\n\n.app-user {\n  position: relative;\n\n  .app-user-avatar {\n    display: flex;\n    align-items: center;\n    white-space: nowrap;\n    cursor: pointer;\n\n    img {\n      position: relative;\n      overflow: hidden;\n      width: 32px;\n      min-width: 32px;\n      height: 32px;\n      border-radius: 50% !important;\n      vertical-align: middle;\n      border-style: none;\n      box-sizing: border-box;\n      line-height: 1;\n      margin-right: 0.5em;\n    }\n\n    &::after {\n      display: inline-block;\n      box-sizing: border-box;\n      height: 8px;\n      width: 8px;\n      border-style: solid;\n      border-color: black;\n      border-width: 0px 2px 2px 0px;\n      position: relative;\n      transform: rotate(45deg);\n      transition: opacity 150ms ease-in-out;\n      content: '';\n    }\n  }\n\n  .app-user-details {\n    display: none;\n    list-style: none;\n    position: absolute;\n    background: white;\n    padding: 0;\n    right: 0;\n    border: 1px solid #ececec;\n    border-radius: 3px;\n    top: 40px;\n    cursor: default;\n\n    li {\n      display: block;\n      padding: 10px;\n      max-width: 300px;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      white-space: nowrap;\n      text-align: right;\n\n      & > a {\n        display: block;\n      }\n\n      &.sep {\n        border-bottom: 1px solid #ccc;\n        padding: 0;\n      }\n\n      .user-name {\n        font-weight: bold;\n        color: #666;\n        display: block;\n        font-size: 0.6em;\n      }\n    }\n\n    &:before, &:after {\n      content: '';\n      display: block;\n      position: absolute;\n      bottom: 100%;\n      width: 0;\n      height: 0;\n    }\n\n    &:before {\n      right: 27px;\n      border: 6px solid transparent;\n      border-bottom-color: #ececec;\n    }\n\n    &:after {\n      right: 28px;\n      border: 5px solid transparent;\n      border-bottom-color: #fff;\n    }\n  }\n\n  &.is-open {\n    img {\n      opacity: 0.8;\n    }\n\n    .app-user-details {\n      display: block;\n    }\n\n    &::after {\n      opacity: 0.2;\n    }\n  }\n}\n","$bg-color: white;\n$basic-dark-color: #56aa1c;\n$header-color: #abcdef;\n$footer-color: lighten($header-color, 10%);\n$menu-color: darken($header-color, 20%);\n$border-width: 4px;\n$basic-spinner-dimensions: 50px;\n$main-spinner-dimensions: $basic-spinner-dimensions - $border-width * 2;\n$small-spinner-dimensions: $main-spinner-dimensions * 0.7;\n$menu-shadow-size: 30px;\n\n$hamburger-padding: 15px 0 !default;\n$hamburger-layer-width: 40px !default;\n$hamburger-layer-height: 4px !default;\n$hamburger-layer-spacing: 6px !default;\n$hamburger-layer-color: #000 !default;\n$hamburger-layer-border-radius: 4px !default;\n$hamburger-hover-opacity: 0.7 !default;\n$hamburger-active-layer-color: $hamburger-layer-color !default;\n$hamburger-active-hover-opacity: $hamburger-hover-opacity !default;\n$hamburger-hover-use-filter: false !default;\n$hamburger-hover-filter: opacity(50%) !default;\n$hamburger-active-hover-filter: $hamburger-hover-filter !default;\n\n$breakpoint-mobile: 450px;\n$breakpoint-tablet: 650px;\n\n@import './layout';\n@import './burger';\n","@use 'sass:math';\n\n.hamburger {\n  padding: $hamburger-padding;\n  display: inline-block;\n  cursor: pointer;\n\n  transition-property: opacity, filter;\n  transition-duration: 0.15s;\n  transition-timing-function: linear;\n\n  // Normalize (<button>)\n  font: inherit;\n  color: inherit;\n  text-transform: none;\n  background-color: transparent;\n  border: 0;\n  margin: 0;\n  overflow: visible;\n  transform: scale(0.6);\n\n  &:hover {\n    @if $hamburger-hover-use-filter == true {\n      filter: $hamburger-hover-filter;\n    }\n    @else {\n      opacity: $hamburger-hover-opacity;\n    }\n  }\n\n  &.is-active {\n    &:hover {\n      @if $hamburger-hover-use-filter == true {\n        filter: $hamburger-active-hover-filter;\n      }\n      @else {\n        opacity: $hamburger-active-hover-opacity;\n      }\n    }\n\n    .hamburger-inner,\n    .hamburger-inner::before,\n    .hamburger-inner::after {\n      background-color: $hamburger-active-layer-color;\n    }\n  }\n}\n\n.hamburger-box {\n  width: $hamburger-layer-width;\n  height: $hamburger-layer-height * 3 + $hamburger-layer-spacing * 2;\n  display: inline-block;\n  position: relative;\n}\n\n.hamburger-inner {\n  display: block;\n  top: 50%;\n  margin-top: math.div($hamburger-layer-height, -2);\n\n  &,\n  &::before,\n  &::after {\n    width: $hamburger-layer-width;\n    height: $hamburger-layer-height;\n    background-color: $hamburger-layer-color;\n    border-radius: $hamburger-layer-border-radius;\n    position: absolute;\n    transition-property: transform;\n    transition-duration: 0.15s;\n    transition-timing-function: ease;\n  }\n\n  &::before,\n  &::after {\n    content: \"\";\n    display: block;\n  }\n\n  &::before {\n    top: ($hamburger-layer-spacing + $hamburger-layer-height) * -1;\n  }\n\n  &::after {\n    bottom: ($hamburger-layer-spacing + $hamburger-layer-height) * -1;\n  }\n}\n\n.hamburger--arrow.is-active {\n  .hamburger-inner {\n    &::before {\n      transform: translate3d($hamburger-layer-width * -0.2, 0, 0) rotate(-45deg) scale(0.7, 1);\n    }\n\n    &::after {\n      transform: translate3d($hamburger-layer-width * -0.2, 0, 0) rotate(45deg) scale(0.7, 1);\n    }\n  }\n}\n"],"sourceRoot":""}]);
 // Exports
@@ -79530,76 +79578,6 @@ __webpack_require__(/*! ../modules/web.url-search-params */ "../../framework/pir
 module.exports = __webpack_require__(/*! ../internals/path */ "../../framework/piral/node_modules/core-js/internals/path.js");
 
 
-/***/ }),
-
-/***/ "./src/images/close.svg":
-/*!******************************!*\
-  !*** ./src/images/close.svg ***!
-  \******************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "be953d3bb28334341670ac119b9b436f.svg";
-
-/***/ }),
-
-/***/ "./src/images/de.png":
-/*!***************************!*\
-  !*** ./src/images/de.png ***!
-  \***************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "6cb30ba07b9d12f26f5721a65ff0f18d.png";
-
-/***/ }),
-
-/***/ "./src/images/en.png":
-/*!***************************!*\
-  !*** ./src/images/en.png ***!
-  \***************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "d3ce413fe9432d213ccf62bc0f928e77.png";
-
-/***/ }),
-
-/***/ "./src/images/error.svg":
-/*!******************************!*\
-  !*** ./src/images/error.svg ***!
-  \******************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "14147d9696bdda5699400916e76cf121.svg";
-
-/***/ }),
-
-/***/ "./src/images/female.png":
-/*!*******************************!*\
-  !*** ./src/images/female.png ***!
-  \*******************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "7e8dfb610a2f04b46fb60a317bb27a18.png";
-
-/***/ }),
-
-/***/ "./src/images/male.png":
-/*!*****************************!*\
-  !*** ./src/images/male.png ***!
-  \*****************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "7a0dfe01986938a963b43fae071e4fca.png";
-
-/***/ }),
-
-/***/ "./src/images/not-found.svg":
-/*!**********************************!*\
-  !*** ./src/images/not-found.svg ***!
-  \**********************************/
-/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
-
-module.exports = __webpack_require__.p + "32d34aa10f17957ad7f2bfd59ee0a9e9.svg";
-
 /***/ }),
 
 /***/ "../../../node_modules/bootstrap/dist/css/bootstrap.min.css":
@@ -79911,6 +79889,83 @@ module.exports = function (list, options) {
 
 /***/ }),
 
+/***/ "./src/images/close.svg":
+/*!******************************!*\
+  !*** ./src/images/close.svg ***!
+  \******************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "be953d3bb28334341670.svg";
+
+/***/ }),
+
+/***/ "./src/images/de.png":
+/*!***************************!*\
+  !*** ./src/images/de.png ***!
+  \***************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "6cb30ba07b9d12f26f57.png";
+
+/***/ }),
+
+/***/ "./src/images/en.png":
+/*!***************************!*\
+  !*** ./src/images/en.png ***!
+  \***************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "d3ce413fe9432d213ccf.png";
+
+/***/ }),
+
+/***/ "./src/images/error.svg":
+/*!******************************!*\
+  !*** ./src/images/error.svg ***!
+  \******************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "14147d9696bdda569940.svg";
+
+/***/ }),
+
+/***/ "./src/images/female.png":
+/*!*******************************!*\
+  !*** ./src/images/female.png ***!
+  \*******************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "7e8dfb610a2f04b46fb6.png";
+
+/***/ }),
+
+/***/ "./src/images/male.png":
+/*!*****************************!*\
+  !*** ./src/images/male.png ***!
+  \*****************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "7a0dfe01986938a963b4.png";
+
+/***/ }),
+
+/***/ "./src/images/not-found.svg":
+/*!**********************************!*\
+  !*** ./src/images/not-found.svg ***!
+  \**********************************/
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+"use strict";
+module.exports = __webpack_require__.p + "32d34aa10f17957ad7f2.svg";
+
+/***/ }),
+
 /***/ "../../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js":
 /*!*********************************************************************************!*\
   !*** ../../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js ***!
@@ -80244,4 +80299,4 @@ var layout_1 = __webpack_require__(/*! ./layout */ "./src/layout.tsx");
 
 /******/ })()
 ;
-//# sourceMappingURL=index.1449bd.js.map
+//# sourceMappingURL=index.a7f28d.js.map