@uxf/cms 6.0.0-beta.3 → 6.0.0-beta.30

package/forms/utils/onUploadDropzoneFile.js

@@ -0,0 +1,50 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.onUploadDropzoneFile = void 0;
+var config_1 = require("../../config");
+var onUploadDropzoneFile = function (file) { return __awaiter(void 0, void 0, void 0, function () {
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4 /*yield*/, config_1.container.get("api.uploadFile")(file)];
+            case 1: return [2 /*return*/, _a.sent()];
+        }
+    });
+}); };
+exports.onUploadDropzoneFile = onUploadDropzoneFile;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib25VcGxvYWREcm9wem9uZUZpbGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvZm9ybXMvdXRpbHMvb25VcGxvYWREcm9wem9uZUZpbGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsdUNBQXlDO0FBR2xDLElBQU0sb0JBQW9CLEdBQUcsVUFBTyxJQUFVOzs7b0JBQzFDLHFCQUFNLGtCQUFTLENBQUMsR0FBRyxDQUFDLGdCQUFnQixDQUFDLENBQUMsSUFBSSxDQUFDLEVBQUE7b0JBQWxELHNCQUFPLFNBQTJDLEVBQUM7OztLQUN0RCxDQUFDO0FBRlcsUUFBQSxvQkFBb0Isd0JBRS9CIn0=

package/forms/utils/onUploadFile.d.ts

@@ -0,0 +1,2 @@
+import { FileResponse } from "@uxf/ui/types";
+export declare const onUploadFile: (file: File, namespace?: string) => Promise<FileResponse>;

package/forms/utils/onUploadFile.js

@@ -0,0 +1,53 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.onUploadFile = void 0;
+var config_1 = require("../../config");
+var onUploadFile = function (file, namespace) {
+    if (namespace === void 0) { namespace = "default"; }
+    return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, config_1.container.get("api.uploadFile")(file, namespace)];
+                case 1: return [2 /*return*/, _a.sent()];
+            }
+        });
+    });
+};
+exports.onUploadFile = onUploadFile;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib25VcGxvYWRGaWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2Zvcm1zL3V0aWxzL29uVXBsb2FkRmlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSx1Q0FBeUM7QUFHbEMsSUFBTSxZQUFZLEdBQUcsVUFBTyxJQUFVLEVBQUUsU0FBcUI7SUFBckIsMEJBQUEsRUFBQSxxQkFBcUI7Ozs7d0JBQ3pELHFCQUFNLGtCQUFTLENBQUMsR0FBRyxDQUFDLGdCQUFnQixDQUFDLENBQUMsSUFBSSxFQUFFLFNBQVMsQ0FBQyxFQUFBO3dCQUE3RCxzQkFBTyxTQUFzRCxFQUFDOzs7O0NBQ2pFLENBQUM7QUFGVyxRQUFBLFlBQVksZ0JBRXZCIn0=

package/lib/CmsProvider/CmsProvider.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -61,4 +65,4 @@ var CmsProvider = function (props) {
     return react_1.default.createElement(CmsContext.Provider, { value: value }, children);
 };
 exports.CmsProvider = CmsProvider;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ21zUHJvdmlkZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0Ntc1Byb3ZpZGVyL0Ntc1Byb3ZpZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLDZDQUF3RDtBQUd4RCxJQUFNLFVBQVUsR0FBRyxlQUFLLENBQUMsYUFBYSxDQUFpQjtJQUNuRCxPQUFPLEVBQUU7UUFDTCxNQUFNLEVBQUUsS0FBSztRQUNiLElBQUksRUFBRSxjQUFNLE9BQUEsSUFBSSxFQUFKLENBQUk7UUFDaEIsS0FBSyxFQUFFLGNBQU0sT0FBQSxJQUFJLEVBQUosQ0FBSTtLQUNwQjtDQUNKLENBQUMsQ0FBQztBQUVJLElBQU0sYUFBYSxHQUFHLFVBQWlDLEdBQU07SUFDaEUsT0FBTyxJQUFBLGtCQUFVLEVBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUM7QUFDdkMsQ0FBQyxDQUFDO0FBRlcsUUFBQSxhQUFhLGlCQUV4QjtBQUVLLElBQU0sV0FBVyxHQUFxQyxVQUFDLEtBQUs7SUFDdkQsSUFBQSxRQUFRLEdBQUssS0FBSyxTQUFWLENBQVc7SUFFckIsSUFBQSxLQUFBLE9BQXNCLElBQUEsZ0JBQVEsRUFBQyxLQUFLLENBQUMsSUFBQSxFQUFwQyxNQUFNLFFBQUEsRUFBRSxTQUFTLFFBQW1CLENBQUM7SUFFNUMsSUFBTSxLQUFLLEdBQW1CO1FBQzFCLE9BQU8sRUFBRTtZQUNMLE1BQU0sUUFBQTtZQUNOLElBQUksRUFBRSxjQUFNLE9BQUEsU0FBUyxDQUFDLElBQUksQ0FBQyxFQUFmLENBQWU7WUFDM0IsS0FBSyxFQUFFLGNBQU0sT0FBQSxTQUFTLENBQUMsS0FBSyxDQUFDLEVBQWhCLENBQWdCO1NBQ2hDO0tBQ0osQ0FBQztJQUVGLE9BQU8sOEJBQUMsVUFBVSxDQUFDLFFBQVEsSUFBQyxLQUFLLEVBQUUsS0FBSyxJQUFHLFFBQVEsQ0FBdUIsQ0FBQztBQUMvRSxDQUFDLENBQUM7QUFkVyxRQUFBLFdBQVcsZUFjdEIifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ21zUHJvdmlkZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0Ntc1Byb3ZpZGVyL0Ntc1Byb3ZpZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSw2Q0FBd0Q7QUFHeEQsSUFBTSxVQUFVLEdBQUcsZUFBSyxDQUFDLGFBQWEsQ0FBaUI7SUFDbkQsT0FBTyxFQUFFO1FBQ0wsTUFBTSxFQUFFLEtBQUs7UUFDYixJQUFJLEVBQUUsY0FBTSxPQUFBLElBQUksRUFBSixDQUFJO1FBQ2hCLEtBQUssRUFBRSxjQUFNLE9BQUEsSUFBSSxFQUFKLENBQUk7S0FDcEI7Q0FDSixDQUFDLENBQUM7QUFFSSxJQUFNLGFBQWEsR0FBRyxVQUFpQyxHQUFNO0lBQ2hFLE9BQU8sSUFBQSxrQkFBVSxFQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDO0FBQ3ZDLENBQUMsQ0FBQztBQUZXLFFBQUEsYUFBYSxpQkFFeEI7QUFFSyxJQUFNLFdBQVcsR0FBdUMsVUFBQyxLQUFLO0lBQ3pELElBQUEsUUFBUSxHQUFLLEtBQUssU0FBVixDQUFXO0lBRXJCLElBQUEsS0FBQSxPQUFzQixJQUFBLGdCQUFRLEVBQUMsS0FBSyxDQUFDLElBQUEsRUFBcEMsTUFBTSxRQUFBLEVBQUUsU0FBUyxRQUFtQixDQUFDO0lBRTVDLElBQU0sS0FBSyxHQUFtQjtRQUMxQixPQUFPLEVBQUU7WUFDTCxNQUFNLFFBQUE7WUFDTixJQUFJLEVBQUUsY0FBTSxPQUFBLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFBZixDQUFlO1lBQzNCLEtBQUssRUFBRSxjQUFNLE9BQUEsU0FBUyxDQUFDLEtBQUssQ0FBQyxFQUFoQixDQUFnQjtTQUNoQztLQUNKLENBQUM7SUFFRixPQUFPLDhCQUFDLFVBQVUsQ0FBQyxRQUFRLElBQUMsS0FBSyxFQUFFLEtBQUssSUFBRyxRQUFRLENBQXVCLENBQUM7QUFDL0UsQ0FBQyxDQUFDO0FBZFcsUUFBQSxXQUFXLGVBY3RCIn0=

package/lib/CmsProvider/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -12,4 +16,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./CmsProvider"), exports);
 __exportStar(require("./types"), exports);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0Ntc1Byb3ZpZGVyL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7OztBQUFBLGdEQUE4QjtBQUM5QiwwQ0FBd0IifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0Ntc1Byb3ZpZGVyL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxnREFBOEI7QUFDOUIsMENBQXdCIn0=

package/lib/Layout/Breadcrumbs.d.ts

@@ -0,0 +1,9 @@
+import { FC } from "react";
+export interface BreadcrumbItemProps {
+    href?: string;
+    title: string;
+}
+export type BreadcrumbsProps = {
+    items: BreadcrumbItemProps[];
+};
+export declare const Breadcrumbs: FC<BreadcrumbsProps>;

package/lib/Layout/Breadcrumbs.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Breadcrumbs = void 0;
+var react_1 = __importDefault(require("react"));
+var link_1 = __importDefault(require("next/link"));
+var icon_1 = require("@uxf/ui/icon");
+var Breadcrumbs = function (props) {
+    if (props.items.length === 0) {
+        return null;
+    }
+    return (react_1.default.createElement("div", { className: "uxf-typo-body mb-4 flex flex-wrap items-center text-lightLow" }, props.items.map(function (item, index) { return (react_1.default.createElement("span", { className: "mr-2 last:mr-0", key: index },
+        !!index && react_1.default.createElement(icon_1.Icon, { className: "mr-2 inline", name: "angleRight", size: 16 }),
+        item.href ? (react_1.default.createElement(link_1.default, { href: item.href, className: "transition-colors hover:text-lightHigh" },
+            react_1.default.createElement("span", null, item.title))) : (react_1.default.createElement("span", null, item.title)))); })));
+};
+exports.Breadcrumbs = Breadcrumbs;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQnJlYWRjcnVtYnMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0xheW91dC9CcmVhZGNydW1icy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsZ0RBQWtDO0FBQ2xDLG1EQUE2QjtBQUM3QixxQ0FBb0M7QUFXN0IsSUFBTSxXQUFXLEdBQXlCLFVBQUMsS0FBSztJQUNuRCxJQUFJLEtBQUssQ0FBQyxLQUFLLENBQUMsTUFBTSxLQUFLLENBQUMsRUFBRTtRQUMxQixPQUFPLElBQUksQ0FBQztLQUNmO0lBRUQsT0FBTyxDQUNILHVDQUFLLFNBQVMsRUFBQyw4REFBOEQsSUFDeEUsS0FBSyxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsVUFBQyxJQUFJLEVBQUUsS0FBSyxJQUFLLE9BQUEsQ0FDOUIsd0NBQU0sU0FBUyxFQUFDLGdCQUFnQixFQUFDLEdBQUcsRUFBRSxLQUFLO1FBQ3RDLENBQUMsQ0FBQyxLQUFLLElBQUksOEJBQUMsV0FBSSxJQUFDLFNBQVMsRUFBQyxhQUFhLEVBQUMsSUFBSSxFQUFDLFlBQVksRUFBQyxJQUFJLEVBQUUsRUFBRSxHQUFJO1FBQ3ZFLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQ1QsOEJBQUMsY0FBSSxJQUFDLElBQUksRUFBRSxJQUFJLENBQUMsSUFBSSxFQUFFLFNBQVMsRUFBQyx3Q0FBd0M7WUFDckUsNENBQU8sSUFBSSxDQUFDLEtBQUssQ0FBUSxDQUN0QixDQUNWLENBQUMsQ0FBQyxDQUFDLENBQ0EsNENBQU8sSUFBSSxDQUFDLEtBQUssQ0FBUSxDQUM1QixDQUNFLENBQ1YsRUFYaUMsQ0FXakMsQ0FBQyxDQUNBLENBQ1QsQ0FBQztBQUNOLENBQUMsQ0FBQztBQXJCVyxRQUFBLFdBQVcsZUFxQnRCIn0=

package/lib/Layout/Layout.js

@@ -4,42 +4,40 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Layout = void 0;
-var CircularProgress_1 = __importDefault(require("@mui/material/CircularProgress"));
-var CssBaseline_1 = __importDefault(require("@mui/material/CssBaseline"));
-var Toolbar_1 = __importDefault(require("@mui/material/Toolbar"));
-var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var head_1 = __importDefault(require("next/head"));
 var react_1 = __importDefault(require("react"));
 var config_1 = require("../../config");
-var AppBar_1 = require("./AppBar");
 var Sidebar_1 = require("./Sidebar");
 var styles_1 = require("./styles");
+var Breadcrumbs_1 = require("./Breadcrumbs");
+var loader_1 = require("@uxf/ui/loader/loader");
+var LayoutContainer_1 = require("./LayoutContainer");
 var Layout = function (props) {
     var _a;
-    var children = props.children, title = props.title, Logo = props.Logo, Menu = props.Menu, menuConfiguration = props.menuConfiguration, UserMenu = props.UserMenu, header = props.header, Breadcrumbs = props.Breadcrumbs, ToolbarRight = props.ToolbarRight, MessageBar = props.MessageBar, loading = props.loading, subtitle = props.subtitle, TitleRightContainer = props.TitleRightContainer;
-    return (react_1.default.createElement(styles_1.LayoutRoot, null,
+    var Header = props.Header, Logo = props.Logo, MessageBar = props.MessageBar, TitleRightContainer = props.TitleRightContainer, ToolbarRight = props.ToolbarRight, breadcrumbs = props.breadcrumbs, children = props.children, containerType = props.containerType, headerContainerType = props.headerContainerType, loading = props.loading, menuConfiguration = props.menuConfiguration, subtitle = props.subtitle, title = props.title;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(head_1.default, null,
             react_1.default.createElement("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }),
             react_1.default.createElement("meta", { charSet: "utf-8" }),
             react_1.default.createElement("title", null, "".concat(title, " | ").concat((_a = config_1.config.get("app-name")) !== null && _a !== void 0 ? _a : ""))),
-        react_1.default.createElement(CssBaseline_1.default, null),
-        react_1.default.createElement(AppBar_1.AppBar, { Logo: Logo, ToolbarRight: ToolbarRight }),
-        react_1.default.createElement("div", { className: "flex flex-row w-full" },
-            react_1.default.createElement(Sidebar_1.Sidebar, { menuConfiguration: menuConfiguration, Logo: Logo, Menu: Menu, UserMenu: UserMenu }),
-            react_1.default.createElement("main", { className: "sm:ml-[var(--drawerWidth)] sm:w-[calc(100%_-_var(--drawerWidth))]", style: { "--drawerWidth": "".concat(styles_1.drawerWidth, "px") } }, loading ? (react_1.default.createElement("div", { className: "flex flex-col items-center justify-center h-96" },
-                react_1.default.createElement("div", { className: "text-center" },
-                    react_1.default.createElement(CircularProgress_1.default, null),
-                    react_1.default.createElement(Typography_1.default, { mt: 1 }, "Na\u010D\u00EDt\u00E1m\u2026")))) : (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(Toolbar_1.default, { variant: "dense" }),
-                react_1.default.createElement(styles_1.LayoutHeader, { hasHeader: !!header, sx: { p: 3 } },
-                    MessageBar,
-                    react_1.default.createElement("div", { style: { fontSize: 10 } }, Breadcrumbs),
-                    react_1.default.createElement("div", { className: "flex flex-row items-center" },
-                        react_1.default.createElement(Typography_1.default, { flex: 1, variant: "h4", component: "h2", color: header ? "#fff" : undefined }, title),
-                        TitleRightContainer),
-                    subtitle,
-                    header),
-                react_1.default.createElement("div", { className: "p-3" }, children)))))));
+        react_1.default.createElement("div", { className: "flex" },
+            react_1.default.createElement("div", { className: "flex w-full" },
+                react_1.default.createElement(Sidebar_1.Sidebar, { menuConfiguration: menuConfiguration, Logo: Logo }),
+                react_1.default.createElement("main", { className: "min-h-screen w-full bg-gray-100 sm:ml-[var(--drawerWidth)] sm:w-[calc(100%_-_var(--drawerWidth))]", style: { "--drawerWidth": "".concat(styles_1.drawerWidth, "px") } }, loading ? (react_1.default.createElement("div", { className: "flex h-96 flex-col items-center justify-center" },
+                    react_1.default.createElement("div", { className: "text-center" },
+                        react_1.default.createElement(loader_1.Loader, null),
+                        react_1.default.createElement("p", { className: "mt-2" }, "Na\u010D\u00EDt\u00E1m\u2026")))) : (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("div", { className: "".concat(Header ? "bg-white" : "") },
+                        ToolbarRight && (react_1.default.createElement("div", { className: "flex h-12 items-center justify-end bg-sidebar-background px-6 text-darkMedium" }, ToolbarRight)),
+                        MessageBar,
+                        react_1.default.createElement(LayoutContainer_1.LayoutContainer, { type: headerContainerType !== null && headerContainerType !== void 0 ? headerContainerType : containerType, className: "pt-12 pb-9" },
+                            breadcrumbs && react_1.default.createElement(Breadcrumbs_1.Breadcrumbs, { items: breadcrumbs }),
+                            react_1.default.createElement("div", { className: "flex items-center" },
+                                react_1.default.createElement("h1", { className: "uxf-typo-h4" }, title),
+                                TitleRightContainer),
+                            subtitle,
+                            Header)),
+                    react_1.default.createElement(LayoutContainer_1.LayoutContainer, { type: containerType }, children))))))));
 };
 exports.Layout = Layout;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvTGF5b3V0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxvRkFBOEQ7QUFDOUQsMEVBQW9EO0FBQ3BELGtFQUErQztBQUMvQyx3RUFBa0Q7QUFDbEQsbURBQTZCO0FBQzdCLGdEQUFpRDtBQUNqRCx1Q0FBc0M7QUFDdEMsbUNBQWtDO0FBQ2xDLHFDQUFvQztBQUNwQyxtQ0FBaUU7QUFHMUQsSUFBTSxNQUFNLEdBQW9CLFVBQUMsS0FBSzs7SUFFckMsSUFBQSxRQUFRLEdBYVIsS0FBSyxTQWJHLEVBQ1IsS0FBSyxHQVlMLEtBQUssTUFaQSxFQUNMLElBQUksR0FXSixLQUFLLEtBWEQsRUFDSixJQUFJLEdBVUosS0FBSyxLQVZELEVBQ0osaUJBQWlCLEdBU2pCLEtBQUssa0JBVFksRUFDakIsUUFBUSxHQVFSLEtBQUssU0FSRyxFQUNSLE1BQU0sR0FPTixLQUFLLE9BUEMsRUFDTixXQUFXLEdBTVgsS0FBSyxZQU5NLEVBQ1gsWUFBWSxHQUtaLEtBQUssYUFMTyxFQUNaLFVBQVUsR0FJVixLQUFLLFdBSkssRUFDVixPQUFPLEdBR1AsS0FBSyxRQUhFLEVBQ1AsUUFBUSxHQUVSLEtBQUssU0FGRyxFQUNSLG1CQUFtQixHQUNuQixLQUFLLG9CQURjLENBQ2I7SUFFVixPQUFPLENBQ0gsOEJBQUMsbUJBQVU7UUFDUCw4QkFBQyxjQUFJO1lBQ0Qsd0NBQU0sSUFBSSxFQUFDLFVBQVUsRUFBQyxPQUFPLEVBQUMscUNBQXFDLEdBQUc7WUFDdEUsd0NBQU0sT0FBTyxFQUFDLE9BQU8sR0FBRztZQUN4Qiw2Q0FBUSxVQUFHLEtBQUssZ0JBQU0sTUFBQSxlQUFNLENBQUMsR0FBRyxDQUFDLFVBQVUsQ0FBQyxtQ0FBSSxFQUFFLENBQUUsQ0FBUyxDQUMxRDtRQUNQLDhCQUFDLHFCQUFXLE9BQUc7UUFDZiw4QkFBQyxlQUFNLElBQUMsSUFBSSxFQUFFLElBQUksRUFBRSxZQUFZLEVBQUUsWUFBWSxHQUFJO1FBQ2xELHVDQUFLLFNBQVMsRUFBQyxzQkFBc0I7WUFDakMsOEJBQUMsaUJBQU8sSUFBQyxpQkFBaUIsRUFBRSxpQkFBaUIsRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsUUFBUSxFQUFFLFFBQVEsR0FBSTtZQUM3Rix3Q0FDSSxTQUFTLEVBQUMsbUVBQW1FLEVBQzdFLEtBQUssRUFBRSxFQUFFLGVBQWUsRUFBRSxVQUFHLG9CQUFXLE9BQUksRUFBbUIsSUFFOUQsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUNQLHVDQUFLLFNBQVMsRUFBQyxnREFBZ0Q7Z0JBQzNELHVDQUFLLFNBQVMsRUFBQyxhQUFhO29CQUN4Qiw4QkFBQywwQkFBZ0IsT0FBRztvQkFDcEIsOEJBQUMsb0JBQVUsSUFBQyxFQUFFLEVBQUUsQ0FBQyxtQ0FBOEIsQ0FDN0MsQ0FDSixDQUNULENBQUMsQ0FBQyxDQUFDLENBQ0E7Z0JBQ0ksOEJBQUMsaUJBQVUsSUFBQyxPQUFPLEVBQUMsT0FBTyxHQUFHO2dCQUM5Qiw4QkFBQyxxQkFBWSxJQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsTUFBTSxFQUFFLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBRSxDQUFDLEVBQUU7b0JBQzFDLFVBQVU7b0JBQ1gsdUNBQUssS0FBSyxFQUFFLEVBQUUsUUFBUSxFQUFFLEVBQUUsRUFBRSxJQUFHLFdBQVcsQ0FBTztvQkFDakQsdUNBQUssU0FBUyxFQUFDLDRCQUE0Qjt3QkFDdkMsOEJBQUMsb0JBQVUsSUFDUCxJQUFJLEVBQUUsQ0FBQyxFQUNQLE9BQU8sRUFBQyxJQUFJLEVBQ1osU0FBUyxFQUFDLElBQUksRUFDZCxLQUFLLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLFNBQVMsSUFFakMsS0FBSyxDQUNHO3dCQUNaLG1CQUFtQixDQUNsQjtvQkFDTCxRQUFRO29CQUNSLE1BQU0sQ0FDSTtnQkFDZix1Q0FBSyxTQUFTLEVBQUMsS0FBSyxJQUFFLFFBQVEsQ0FBTyxDQUN0QyxDQUNOLENBQ0UsQ0FDTCxDQUNHLENBQ2hCLENBQUM7QUFDTixDQUFDLENBQUM7QUFsRVcsUUFBQSxNQUFNLFVBa0VqQiJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvTGF5b3V0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxtREFBNkI7QUFDN0IsZ0RBQWlEO0FBQ2pELHVDQUFzQztBQUN0QyxxQ0FBb0M7QUFDcEMsbUNBQXVDO0FBRXZDLDZDQUE0QztBQUM1QyxnREFBK0M7QUFDL0MscURBQW9EO0FBRTdDLElBQU0sTUFBTSxHQUFvQixVQUFDLEtBQUs7O0lBRXJDLElBQUEsTUFBTSxHQWFOLEtBQUssT0FiQyxFQUNOLElBQUksR0FZSixLQUFLLEtBWkQsRUFDSixVQUFVLEdBV1YsS0FBSyxXQVhLLEVBQ1YsbUJBQW1CLEdBVW5CLEtBQUssb0JBVmMsRUFDbkIsWUFBWSxHQVNaLEtBQUssYUFUTyxFQUNaLFdBQVcsR0FRWCxLQUFLLFlBUk0sRUFDWCxRQUFRLEdBT1IsS0FBSyxTQVBHLEVBQ1IsYUFBYSxHQU1iLEtBQUssY0FOUSxFQUNiLG1CQUFtQixHQUtuQixLQUFLLG9CQUxjLEVBQ25CLE9BQU8sR0FJUCxLQUFLLFFBSkUsRUFDUCxpQkFBaUIsR0FHakIsS0FBSyxrQkFIWSxFQUNqQixRQUFRLEdBRVIsS0FBSyxTQUZHLEVBQ1IsS0FBSyxHQUNMLEtBQUssTUFEQSxDQUNDO0lBRVYsT0FBTyxDQUNIO1FBQ0ksOEJBQUMsY0FBSTtZQUNELHdDQUFNLElBQUksRUFBQyxVQUFVLEVBQUMsT0FBTyxFQUFDLHFDQUFxQyxHQUFHO1lBQ3RFLHdDQUFNLE9BQU8sRUFBQyxPQUFPLEdBQUc7WUFDeEIsNkNBQVEsVUFBRyxLQUFLLGdCQUFNLE1BQUEsZUFBTSxDQUFDLEdBQUcsQ0FBQyxVQUFVLENBQUMsbUNBQUksRUFBRSxDQUFFLENBQVMsQ0FDMUQ7UUFDUCx1Q0FBSyxTQUFTLEVBQUMsTUFBTTtZQUNqQix1Q0FBSyxTQUFTLEVBQUMsYUFBYTtnQkFDeEIsOEJBQUMsaUJBQU8sSUFBQyxpQkFBaUIsRUFBRSxpQkFBaUIsRUFBRSxJQUFJLEVBQUUsSUFBSSxHQUFJO2dCQUM3RCx3Q0FDSSxTQUFTLEVBQUMsbUdBQW1HLEVBQzdHLEtBQUssRUFBRSxFQUFFLGVBQWUsRUFBRSxVQUFHLG9CQUFXLE9BQUksRUFBbUIsSUFFOUQsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUNQLHVDQUFLLFNBQVMsRUFBQyxnREFBZ0Q7b0JBQzNELHVDQUFLLFNBQVMsRUFBQyxhQUFhO3dCQUN4Qiw4QkFBQyxlQUFNLE9BQUc7d0JBQ1YscUNBQUcsU0FBUyxFQUFDLE1BQU0sbUNBQW9CLENBQ3JDLENBQ0osQ0FDVCxDQUFDLENBQUMsQ0FBQyxDQUNBO29CQUNJLHVDQUFLLFNBQVMsRUFBRSxVQUFHLE1BQU0sQ0FBQyxDQUFDLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUU7d0JBQ3hDLFlBQVksSUFBSSxDQUNiLHVDQUFLLFNBQVMsRUFBQywrRUFBK0UsSUFDekYsWUFBWSxDQUNYLENBQ1Q7d0JBQ0EsVUFBVTt3QkFDWCw4QkFBQyxpQ0FBZSxJQUFDLElBQUksRUFBRSxtQkFBbUIsYUFBbkIsbUJBQW1CLGNBQW5CLG1CQUFtQixHQUFJLGFBQWEsRUFBRSxTQUFTLEVBQUMsWUFBWTs0QkFDOUUsV0FBVyxJQUFJLDhCQUFDLHlCQUFXLElBQUMsS0FBSyxFQUFFLFdBQVcsR0FBSTs0QkFDbkQsdUNBQUssU0FBUyxFQUFDLG1CQUFtQjtnQ0FDOUIsc0NBQUksU0FBUyxFQUFDLGFBQWEsSUFBRSxLQUFLLENBQU07Z0NBQ3ZDLG1CQUFtQixDQUNsQjs0QkFDTCxRQUFROzRCQUNSLE1BQU0sQ0FDTyxDQUNoQjtvQkFDTiw4QkFBQyxpQ0FBZSxJQUFDLElBQUksRUFBRSxhQUFhLElBQUcsUUFBUSxDQUFtQixDQUNuRSxDQUNOLENBQ0UsQ0FDTCxDQUNKLENBQ1AsQ0FDTixDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBakVXLFFBQUEsTUFBTSxVQWlFakIifQ==

package/lib/Layout/LayoutContainer.d.ts

@@ -0,0 +1,3 @@
+import { FC, PropsWithChildren } from "react";
+import { LayoutContainerProps } from "./types";
+export declare const LayoutContainer: FC<PropsWithChildren<LayoutContainerProps>>;

package/lib/Layout/LayoutContainer.js

@@ -0,0 +1,23 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LayoutContainer = void 0;
+var react_1 = __importDefault(require("react"));
+var maxWidthClassName = {
+    narrow: "max-w-[788px]",
+    wide: "max-w-[1024px]",
+    fullWidth: "",
+    none: "",
+};
+var LayoutContainer = function (props) {
+    var _a, _b;
+    var type = (_a = props.type) !== null && _a !== void 0 ? _a : "fullWidth";
+    if (type === "none") {
+        return react_1.default.createElement(react_1.default.Fragment, null, props.children);
+    }
+    return (react_1.default.createElement("div", { className: "".concat(maxWidthClassName[type], " mx-auto px-4 md:px-10 ").concat((_b = props.className) !== null && _b !== void 0 ? _b : "") }, props.children));
+};
+exports.LayoutContainer = LayoutContainer;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0Q29udGFpbmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvTGF5b3V0Q29udGFpbmVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxnREFBcUQ7QUFHckQsSUFBTSxpQkFBaUIsR0FBd0M7SUFDM0QsTUFBTSxFQUFFLGVBQWU7SUFDdkIsSUFBSSxFQUFFLGdCQUFnQjtJQUN0QixTQUFTLEVBQUUsRUFBRTtJQUNiLElBQUksRUFBRSxFQUFFO0NBQ1gsQ0FBQztBQUVLLElBQU0sZUFBZSxHQUFnRCxVQUFDLEtBQUs7O0lBQzlFLElBQU0sSUFBSSxHQUFHLE1BQUEsS0FBSyxDQUFDLElBQUksbUNBQUksV0FBVyxDQUFDO0lBRXZDLElBQUksSUFBSSxLQUFLLE1BQU0sRUFBRTtRQUNqQixPQUFPLDhEQUFHLEtBQUssQ0FBQyxRQUFRLENBQUksQ0FBQztLQUNoQztJQUVELE9BQU8sQ0FDSCx1Q0FBSyxTQUFTLEVBQUUsVUFBRyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsb0NBQTBCLE1BQUEsS0FBSyxDQUFDLFNBQVMsbUNBQUksRUFBRSxDQUFFLElBQ3RGLEtBQUssQ0FBQyxRQUFRLENBQ2IsQ0FDVCxDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBWlcsUUFBQSxlQUFlLG1CQVkxQiJ9

package/lib/Layout/Sidebar.js

@@ -1,25 +1,65 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Sidebar = void 0;
-var react_1 = __importDefault(require("react"));
+var react_1 = __importStar(require("react"));
 var Menu_1 = require("../Menu");
 var styles_1 = require("./styles");
-var avatar_1 = require("@uxf/ui/avatar");
-var uxfLogo = (react_1.default.createElement("svg", { width: "179", height: "30", viewBox: "0 0 179 40" },
-    react_1.default.createElement("path", { fill: "#FF4F06", fillRule: "evenodd", d: "M33.563 12.874a9.103 9.103 0 0 0 0-12.874L20.69 12.874l.107.105a9.103 9.103 0 0 0 12.766-.105Zm-20.69-6.437a9.103 9.103 0 0 1 .106 12.766l-.105.107L0 6.437a9.103 9.103 0 0 1 12.874 0ZM40 33.563 27.127 20.69l-.106.107a9.103 9.103 0 0 0 12.98 12.766Zm-20.69-6.437-.107-.105A9.103 9.103 0 0 0 6.437 40l12.874-12.874Z", clipRule: "evenodd" }),
+var UserMenu_1 = require("../Menu/ui/UserMenu");
+var MobileBar_1 = require("../Menu/MobileBar");
+var uxfLogo = (react_1.default.createElement("svg", { width: "134", height: "30", viewBox: "0 0 179 40" },
+    react_1.default.createElement("path", { fill: "#FFF", fillRule: "evenodd", d: "M33.563 12.874a9.103 9.103 0 0 0 0-12.874L20.69 12.874l.107.105a9.103 9.103 0 0 0 12.766-.105Zm-20.69-6.437a9.103 9.103 0 0 1 .106 12.766l-.105.107L0 6.437a9.103 9.103 0 0 1 12.874 0ZM40 33.563 27.127 20.69l-.106.107a9.103 9.103 0 0 0 12.98 12.766Zm-20.69-6.437-.107-.105A9.103 9.103 0 0 0 6.437 40l12.874-12.874Z", clipRule: "evenodd" }),
     react_1.default.createElement("path", { fill: "#FFF", fillRule: "evenodd", d: "m84.325 7.295 5.133 8.675h.199l5.158-8.675h6.078l-7.768 12.727 7.942 12.727h-6.19l-5.22-8.687h-.199l-5.22 8.687h-6.165l7.967-12.727-7.818-12.727h6.103Zm-24.194 0v16.07c0 .97.214 1.832.64 2.586a4.58 4.58 0 0 0 1.809 1.777c.779.431 1.686.647 2.722.647 1.044 0 1.953-.216 2.728-.647a4.591 4.591 0 0 0 1.802-1.777c.427-.754.64-1.616.64-2.585V7.296h5.382v16.53c0 1.856-.441 3.48-1.324 4.872-.882 1.392-2.115 2.475-3.697 3.25-1.583.775-3.426 1.162-5.531 1.162-2.113 0-3.96-.387-5.543-1.162-1.583-.775-2.813-1.858-3.692-3.25-.878-1.392-1.317-3.016-1.317-4.872V7.296h5.381ZM170.25 13.41c2.411 0 4.311.51 5.698 1.529 1.388 1.019 2.198 2.407 2.43 4.164l-4.847.298a2.555 2.555 0 0 0-.534-1.125 2.942 2.942 0 0 0-1.075-.808c-.444-.203-.972-.304-1.585-.304-.821 0-1.512.172-2.076.515-.563.344-.845.802-.845 1.374 0 .456.182.84.547 1.156.364.315.99.567 1.877.758l3.455.696c1.856.381 3.24.994 4.151 1.84.912.845 1.367 1.955 1.367 3.33 0 1.252-.366 2.35-1.1 3.294-.733.945-1.736 1.68-3.007 2.206-1.272.526-2.737.79-4.394.79-2.527 0-4.539-.529-6.034-1.585-1.496-1.057-2.372-2.496-2.629-4.32l5.208-.273c.157.77.538 1.357 1.143 1.759.605.402 1.38.603 2.324.603.928 0 1.676-.18 2.244-.54.567-.361.855-.827.864-1.4-.009-.48-.212-.875-.609-1.186-.398-.31-1.011-.55-1.84-.715l-3.306-.659c-1.864-.372-3.25-1.019-4.157-1.938-.908-.92-1.361-2.093-1.361-3.518 0-1.226.333-2.283 1-3.17.667-.886 1.608-1.57 2.821-2.05 1.214-.48 2.637-.72 4.27-.72Zm-36.686.373a12.285 12.285 0 0 0-3.051-.373c-1.525 0-2.865.23-4.021.69-1.156.46-2.098 1.114-2.827 1.964-.73.849-1.219 1.854-1.467 3.014l4.897.397c.182-.63.555-1.153 1.119-1.572.563-.418 1.321-.627 2.274-.627.903 0 1.601.215 2.094.646.493.43.74 1.04.74 1.827v.075c0 .405-.153.712-.46.92-.307.206-.8.362-1.479.465-.68.104-1.574.214-2.685.33-.944.09-1.845.248-2.703.472a7.698 7.698 0 0 0-2.293.994 4.727 4.727 0 0 0-1.591 1.74c-.39.721-.584 1.612-.584 2.673 0 1.259.275 2.31.826 3.15a5.147 5.147 0 0 0 2.256 1.902c.953.427 2.038.64 3.257.64.944 0 1.777-.126 2.498-.38a5.55 5.55 0 0 0 1.852-1.055 5.31 5.31 0 0 0 1.23-1.573h.149v2.648h5.022V19.873c0-1.135-.22-2.11-.659-2.927a5.655 5.655 0 0 0-1.796-2.007 8.039 8.039 0 0 0-2.598-1.156Zm-13.424-2.05V7.294h-16.853v25.454h5.381V22.235h10.354v-4.438h-10.354v-6.065h11.472Zm32.603 1.677c1.326 0 2.482.29 3.468.87.986.58 1.753 1.407 2.3 2.48.546 1.073.82 2.35.82 3.834V32.75h-5.295V21.539c.008-1.169-.29-2.082-.895-2.74-.605-.66-1.437-.989-2.498-.989-.713 0-1.34.153-1.883.46a3.166 3.166 0 0 0-1.268 1.336c-.302.584-.458 1.286-.466 2.107V32.75h-5.295V13.659h5.047v3.368H147a5.358 5.358 0 0 1 2.126-2.641c.994-.65 2.2-.976 3.616-.976Zm-20.061 10.782c.286-.087.512-.184.678-.292v2.026c0 .671-.17 1.272-.51 1.802-.34.53-.808.951-1.404 1.262-.597.31-1.285.466-2.064.466-.812 0-1.481-.189-2.007-.566-.526-.377-.789-.925-.789-1.646 0-.497.128-.914.385-1.25.257-.335.617-.602 1.082-.801a6.547 6.547 0 0 1 1.628-.435l.969-.143a24.15 24.15 0 0 0 1.069-.186c.356-.071.677-.15.963-.237Z", clipRule: "evenodd" })));
 var Sidebar = function (props) {
-    var MenuComponent = props.Menu, menuConfiguration = props.menuConfiguration, UserMenu = props.UserMenu, Logo = props.Logo;
-    return (react_1.default.createElement("div", { className: "bg-sidebar-background shrink-0 w-[var(--drawerWidth)] pt-5 h-screen fixed", style: { "--drawerWidth": "".concat(styles_1.drawerWidth, "px") } }, MenuComponent !== null && MenuComponent !== void 0 ? MenuComponent : (menuConfiguration && (react_1.default.createElement("div", { className: "" }, Logo !== null && Logo !== void 0 ? Logo : uxfLogo,
-        react_1.default.createElement(Menu_1.Menu, { menu: menuConfiguration })))), UserMenu !== null && UserMenu !== void 0 ? UserMenu : (react_1.default.createElement("div", { className: "border-t text-darkMedium fixed bottom-0 w-[var(--drawerWidth)] p-3 pr-5 border-t-darkLow/10" },
-        react_1.default.createElement("div", { className: "flex items-center" },
-            react_1.default.createElement(avatar_1.Avatar, { className: "mr-3" }),
-            react_1.default.createElement("div", null,
-                react_1.default.createElement("div", { className: "ui-typo-body2" }, "Nep\u0159ihl\u00E1\u0161en\u00FD u\u017Eivatel"),
-                react_1.default.createElement("div", { className: "ui-typo-caption text-darkLow" }, "\u2026")))))));
+    var menuConfiguration = props.menuConfiguration, Logo = props.Logo, CustomSidebar = props.CustomSidebar;
+    var _a = __read((0, react_1.useState)(false), 2), isMenuOpen = _a[0], setIsMenuOpen = _a[1];
+    var toggleMenu = function () { return setIsMenuOpen(function (prev) { return !prev; }); };
+    return (CustomSidebar !== null && CustomSidebar !== void 0 ? CustomSidebar : (react_1.default.createElement("div", { className: "fixed z-1 flex w-full flex-col sm:w-[var(--drawerWidth)]", style: { "--drawerWidth": "".concat(styles_1.drawerWidth, "px") } },
+        react_1.default.createElement("div", { className: "h-[calc(100vh_-_48px)] flex-col bg-sidebar-background pt-5 sm:h-screen ".concat(isMenuOpen ? "flex" : "hidden sm:flex") },
+            react_1.default.createElement("div", { className: "px-4" }, Logo !== null && Logo !== void 0 ? Logo : uxfLogo),
+            menuConfiguration && menuConfiguration.length > 0 && (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement("div", { className: "grow overflow-auto px-2 sm:px-0 ".concat(menuConfiguration[0].type === "super-section" ? "mt-4" : "mt-8") },
+                    react_1.default.createElement(Menu_1.Menu, { menu: menuConfiguration })),
+                react_1.default.createElement(UserMenu_1.UserMenu, { menu: menuConfiguration })))),
+        menuConfiguration && react_1.default.createElement(MobileBar_1.MobileBar, { menuConfiguration: menuConfiguration, toggleMenu: toggleMenu }))));
 };
 exports.Sidebar = Sidebar;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2lkZWJhci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9saWIvTGF5b3V0L1NpZGViYXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBLGdEQUFpRDtBQUNqRCxnQ0FBK0I7QUFFL0IsbUNBQXVDO0FBQ3ZDLHlDQUF3QztBQUV4QyxJQUFNLE9BQU8sR0FBRyxDQUNaLHVDQUFLLEtBQUssRUFBQyxLQUFLLEVBQUMsTUFBTSxFQUFDLElBQUksRUFBQyxPQUFPLEVBQUMsWUFBWTtJQUM3Qyx3Q0FDSSxJQUFJLEVBQUMsU0FBUyxFQUNkLFFBQVEsRUFBQyxTQUFTLEVBQ2xCLENBQUMsRUFBQywyVEFBMlQsRUFDN1QsUUFBUSxFQUFDLFNBQVMsR0FDcEI7SUFDRix3Q0FDSSxJQUFJLEVBQUMsTUFBTSxFQUNYLFFBQVEsRUFBQyxTQUFTLEVBQ2xCLENBQUMsRUFBQyx5M0ZBQXkzRixFQUMzM0YsUUFBUSxFQUFDLFNBQVMsR0FDcEIsQ0FDQSxDQUNULENBQUM7QUFFSyxJQUFNLE9BQU8sR0FBcUIsVUFBQyxLQUFLO0lBQ25DLElBQU0sYUFBYSxHQUF3QyxLQUFLLEtBQTdDLEVBQUUsaUJBQWlCLEdBQXFCLEtBQUssa0JBQTFCLEVBQUUsUUFBUSxHQUFXLEtBQUssU0FBaEIsRUFBRSxJQUFJLEdBQUssS0FBSyxLQUFWLENBQVc7SUFFekUsT0FBTyxDQUNILHVDQUNJLFNBQVMsRUFBQywyRUFBMkUsRUFDckYsS0FBSyxFQUFFLEVBQUUsZUFBZSxFQUFFLFVBQUcsb0JBQVcsT0FBSSxFQUFtQixJQUU5RCxhQUFhLGFBQWIsYUFBYSxjQUFiLGFBQWEsR0FDVixDQUFDLGlCQUFpQixJQUFJLENBQ2xCLHVDQUFLLFNBQVMsRUFBQyxFQUFFLElBQ1osSUFBSSxhQUFKLElBQUksY0FBSixJQUFJLEdBQUksT0FBTztRQUNoQiw4QkFBQyxXQUFJLElBQUMsSUFBSSxFQUFFLGlCQUFpQixHQUFJLENBQy9CLENBQ1QsQ0FBQyxFQUNMLFFBQVEsYUFBUixRQUFRLGNBQVIsUUFBUSxHQUFJLENBQ1QsdUNBQUssU0FBUyxFQUFDLDZGQUE2RjtRQUN4Ryx1Q0FBSyxTQUFTLEVBQUMsbUJBQW1CO1lBQzlCLDhCQUFDLGVBQU0sSUFBQyxTQUFTLEVBQUMsTUFBTSxHQUFVO1lBQ2xDO2dCQUNJLHVDQUFLLFNBQVMsRUFBQyxlQUFlLHFEQUE0QjtnQkFDMUQsdUNBQUssU0FBUyxFQUFDLDhCQUE4QixhQUFlLENBQzFELENBQ0osQ0FDSixDQUNULENBQ0MsQ0FDVCxDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBNUJXLFFBQUEsT0FBTyxXQTRCbEIifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2lkZWJhci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9saWIvTGF5b3V0L1NpZGViYXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLDZDQUEyRDtBQUMzRCxnQ0FBK0I7QUFFL0IsbUNBQXVDO0FBQ3ZDLGdEQUErQztBQUMvQywrQ0FBOEM7QUFFOUMsSUFBTSxPQUFPLEdBQUcsQ0FDWix1Q0FBSyxLQUFLLEVBQUMsS0FBSyxFQUFDLE1BQU0sRUFBQyxJQUFJLEVBQUMsT0FBTyxFQUFDLFlBQVk7SUFDN0Msd0NBQ0ksSUFBSSxFQUFDLE1BQU0sRUFDWCxRQUFRLEVBQUMsU0FBUyxFQUNsQixDQUFDLEVBQUMsMlRBQTJULEVBQzdULFFBQVEsRUFBQyxTQUFTLEdBQ3BCO0lBQ0Ysd0NBQ0ksSUFBSSxFQUFDLE1BQU0sRUFDWCxRQUFRLEVBQUMsU0FBUyxFQUNsQixDQUFDLEVBQUMseTNGQUF5M0YsRUFDMzNGLFFBQVEsRUFBQyxTQUFTLEdBQ3BCLENBQ0EsQ0FDVCxDQUFDO0FBRUssSUFBTSxPQUFPLEdBQXFCLFVBQUMsS0FBSztJQUNuQyxJQUFBLGlCQUFpQixHQUEwQixLQUFLLGtCQUEvQixFQUFFLElBQUksR0FBb0IsS0FBSyxLQUF6QixFQUFFLGFBQWEsR0FBSyxLQUFLLGNBQVYsQ0FBVztJQUVuRCxJQUFBLEtBQUEsT0FBOEIsSUFBQSxnQkFBUSxFQUFDLEtBQUssQ0FBQyxJQUFBLEVBQTVDLFVBQVUsUUFBQSxFQUFFLGFBQWEsUUFBbUIsQ0FBQztJQUNwRCxJQUFNLFVBQVUsR0FBRyxjQUFNLE9BQUEsYUFBYSxDQUFDLFVBQUMsSUFBSSxJQUFLLE9BQUEsQ0FBQyxJQUFJLEVBQUwsQ0FBSyxDQUFDLEVBQTlCLENBQThCLENBQUM7SUFFeEQsT0FBTyxDQUNILGFBQWEsYUFBYixhQUFhLGNBQWIsYUFBYSxHQUFJLENBQ2IsdUNBQ0ksU0FBUyxFQUFDLDBEQUEwRCxFQUNwRSxLQUFLLEVBQUUsRUFBRSxlQUFlLEVBQUUsVUFBRyxvQkFBVyxPQUFJLEVBQW1CO1FBRS9ELHVDQUNJLFNBQVMsRUFBRSxpRkFDUCxVQUFVLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLENBQ3hDO1lBRUYsdUNBQUssU0FBUyxFQUFDLE1BQU0sSUFBRSxJQUFJLGFBQUosSUFBSSxjQUFKLElBQUksR0FBSSxPQUFPLENBQU87WUFDNUMsaUJBQWlCLElBQUksaUJBQWlCLENBQUMsTUFBTSxHQUFHLENBQUMsSUFBSSxDQUNsRDtnQkFDSSx1Q0FDSSxTQUFTLEVBQUUsMENBQ1AsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxLQUFLLGVBQWUsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQ2pFO29CQUVGLDhCQUFDLFdBQUksSUFBQyxJQUFJLEVBQUUsaUJBQWlCLEdBQUksQ0FDL0I7Z0JBQ04sOEJBQUMsbUJBQVEsSUFBQyxJQUFJLEVBQUUsaUJBQWlCLEdBQUksQ0FDdEMsQ0FDTixDQUNDO1FBQ0wsaUJBQWlCLElBQUksOEJBQUMscUJBQVMsSUFBQyxpQkFBaUIsRUFBRSxpQkFBaUIsRUFBRSxVQUFVLEVBQUUsVUFBVSxHQUFJLENBQy9GLENBQ1QsQ0FDSixDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBbkNXLFFBQUEsT0FBTyxXQW1DbEIifQ==

package/lib/Layout/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./Layout";
+export * from "./Breadcrumbs";
 export * from "./types";

package/lib/Layout/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -11,5 +15,6 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./Layout"), exports);
+__exportStar(require("./Breadcrumbs"), exports);
 __exportStar(require("./types"), exports);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0xheW91dC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7QUFBQSwyQ0FBeUI7QUFDekIsMENBQXdCIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0xheW91dC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsMkNBQXlCO0FBQ3pCLGdEQUE4QjtBQUM5QiwwQ0FBd0IifQ==

package/lib/Layout/styles.d.ts

@@ -1,6 +1 @@
-/// <reference types="react" />
 export declare const drawerWidth = 264;
-export declare const LayoutRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const LayoutHeader: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
-    hasHeader?: boolean | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/lib/Layout/styles.js

@@ -1,17 +1,5 @@
 "use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LayoutHeader = exports.LayoutRoot = exports.drawerWidth = void 0;
-var react_1 = require("@emotion/react");
-var styles_1 = require("@mui/material/styles");
+exports.drawerWidth = void 0;
 exports.drawerWidth = 264;
-exports.LayoutRoot = (0, styles_1.styled)("div")(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    display: flex;\n"], ["\n    display: flex;\n"])));
-exports.LayoutHeader = (0, styles_1.styled)("div", { shouldForwardProp: function (propName) { return propName !== "hasHeader"; } })(function (_a) {
-    var theme = _a.theme, hasHeader = _a.hasHeader;
-    return hasHeader && (0, react_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n            background-color: ", ";\n            color: #fff;\n        "], ["\n            background-color: ", ";\n            color: #fff;\n        "])), theme.palette.primary.main);
-});
-var templateObject_1, templateObject_2;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFBQSx3Q0FBcUM7QUFDckMsK0NBQThDO0FBRWpDLFFBQUEsV0FBVyxHQUFHLEdBQUcsQ0FBQztBQUVsQixRQUFBLFVBQVUsR0FBRyxJQUFBLGVBQU0sRUFBQyxLQUFLLENBQUMsMkZBQUEsd0JBRXRDLEtBQUM7QUFFVyxRQUFBLFlBQVksR0FBRyxJQUFBLGVBQU0sRUFBQyxLQUFLLEVBQUUsRUFBRSxpQkFBaUIsRUFBRSxVQUFDLFFBQVEsSUFBSyxPQUFBLFFBQVEsS0FBSyxXQUFXLEVBQXhCLENBQXdCLEVBQUUsQ0FBQyxDQUdwRyxVQUFDLEVBQW9CO1FBQWxCLEtBQUssV0FBQSxFQUFFLFNBQVMsZUFBQTtJQUNmLE9BQUEsU0FBUyxRQUNULFdBQUcsK0lBQUEsa0NBQ3FCLEVBQTBCLHVDQUVqRCxLQUZ1QixLQUFLLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBRWpEO0FBSkQsQ0FJQyxDQUNSLENBQUMifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7OztBQUFhLFFBQUEsV0FBVyxHQUFHLEdBQUcsQ0FBQyJ9

package/lib/Layout/types.d.ts

@@ -1,9 +1,16 @@
-import { ReactNode } from "react";
+import { HTMLAttributes, ReactElement, ReactNode } from "react";
 import { MenuItem } from "../Menu/model";
-export declare type LayoutProps = SidebarProps & {
+import { BreadcrumbItemProps } from "./Breadcrumbs";
+export type LayoutContainerType = "fullWidth" | "wide" | "narrow" | "none";
+export interface LayoutContainerProps extends HTMLAttributes<HTMLDivElement> {
+    type?: LayoutContainerType;
+}
+export type LayoutProps = SidebarProps & {
     children?: ReactNode;
-    Breadcrumbs?: ReactNode;
-    header?: ReactNode;
+    containerType?: LayoutContainerType;
+    headerContainerType?: LayoutContainerType;
+    breadcrumbs?: BreadcrumbItemProps[];
+    Header?: ReactNode;
     loading?: boolean;
     Logo?: ReactNode;
     MessageBar?: ReactNode;
@@ -18,7 +25,6 @@ export interface AppBarProps {
 }
 export interface SidebarProps {
     Logo?: ReactNode;
-    Menu?: ReactNode;
-    UserMenu?: ReactNode;
     menuConfiguration?: MenuItem[];
+    CustomSidebar?: ReactElement;
 }

package/lib/LoginLayout/LoginLayout.js

@@ -9,13 +9,13 @@ var react_1 = __importDefault(require("react"));
 var paper_1 = require("@uxf/ui/paper/paper");
 var LoginLayout = function (props) {
     var hideTitle = props.hideTitle, title = props.title, subTitle = props.subTitle, pageTitle = props.pageTitle, children = props.children, Logo = props.Logo;
-    return (react_1.default.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-4 bg-gray-100" },
+    return (react_1.default.createElement("div", { className: "flex min-h-screen flex-col items-center justify-center bg-gray-100 p-4" },
         react_1.default.createElement(head_1.default, null,
             react_1.default.createElement("title", null, pageTitle || "")),
         Logo && react_1.default.createElement("div", { className: "mb-8" }, Logo),
         title && react_1.default.createElement("h1", { className: hideTitle ? "sr-only" : "uxf-typo-h4" }, title),
-        subTitle && react_1.default.createElement("p", { className: "mt-2 uxf-typo-body text-lightMedium" }, subTitle),
-        react_1.default.createElement(paper_1.Paper, { className: "max-w-full w-[448px] p-6 mt-8" }, children)));
+        subTitle && react_1.default.createElement("p", { className: "uxf-typo-body mt-2 text-lightMedium" }, subTitle),
+        react_1.default.createElement(paper_1.Paper, { className: "mt-8 w-[448px] max-w-full p-6" }, children)));
 };
 exports.LoginLayout = LoginLayout;
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTG9naW5MYXlvdXQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0xvZ2luTGF5b3V0L0xvZ2luTGF5b3V0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxtREFBNkI7QUFDN0IsZ0RBQWtDO0FBRWxDLDZDQUE0QztBQUVyQyxJQUFNLFdBQVcsR0FBeUIsVUFBQyxLQUFLO0lBQzNDLElBQUEsU0FBUyxHQUFpRCxLQUFLLFVBQXRELEVBQUUsS0FBSyxHQUEwQyxLQUFLLE1BQS9DLEVBQUUsUUFBUSxHQUFnQyxLQUFLLFNBQXJDLEVBQUUsU0FBUyxHQUFxQixLQUFLLFVBQTFCLEVBQUUsUUFBUSxHQUFXLEtBQUssU0FBaEIsRUFBRSxJQUFJLEdBQUssS0FBSyxLQUFWLENBQVc7SUFFeEUsT0FBTyxDQUNILHVDQUFLLFNBQVMsRUFBQyx3RUFBd0U7UUFDbkYsOEJBQUMsY0FBSTtZQUNELDZDQUFRLFNBQVMsSUFBSSxFQUFFLENBQVMsQ0FDN0I7UUFDTixJQUFJLElBQUksdUNBQUssU0FBUyxFQUFDLE1BQU0sSUFBRSxJQUFJLENBQU87UUFDMUMsS0FBSyxJQUFJLHNDQUFJLFNBQVMsRUFBRSxTQUFTLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsYUFBYSxJQUFHLEtBQUssQ0FBTTtRQUMzRSxRQUFRLElBQUkscUNBQUcsU0FBUyxFQUFDLHFDQUFxQyxJQUFFLFFBQVEsQ0FBSztRQUM5RSw4QkFBQyxhQUFLLElBQUMsU0FBUyxFQUFDLCtCQUErQixJQUFFLFFBQVEsQ0FBUyxDQUNqRSxDQUNULENBQUM7QUFDTixDQUFDLENBQUM7QUFkVyxRQUFBLFdBQVcsZUFjdEIifQ==

package/lib/LoginLayout/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -12,4 +16,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./LoginLayout"), exports);
 __exportStar(require("./types"), exports);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0xvZ2luTGF5b3V0L2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7OztBQUFBLGdEQUE4QjtBQUM5QiwwQ0FBd0IifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL0xvZ2luTGF5b3V0L2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxnREFBOEI7QUFDOUIsMENBQXdCIn0=

package/lib/Menu/MobileBar.d.ts

@@ -0,0 +1,6 @@
+import { FC } from "react";
+import { MenuItem } from "./model";
+export declare const MobileBar: FC<{
+    menuConfiguration: MenuItem[];
+    toggleMenu: () => void;
+}>;

package/lib/Menu/MobileBar.js

@@ -0,0 +1,51 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MobileBar = void 0;
+var react_1 = __importDefault(require("react"));
+var link_1 = __importDefault(require("next/link"));
+var icon_1 = require("@uxf/ui/icon");
+var SubMenuMobile_1 = require("./ui/SubMenu/SubMenuMobile");
+var config_1 = require("../../config");
+var avatar_1 = require("@uxf/ui/avatar");
+var MobileBar = function (props) {
+    var menuConfiguration = props.menuConfiguration, toggleMenu = props.toggleMenu;
+    var mobileBarMenu = menuConfiguration
+        .flatMap(function (item) {
+        if (item.type === "link" || item.type === "section") {
+            return item;
+        }
+        if (!!item.userMenuData) {
+            return item;
+        }
+        if (item.type === "super-section") {
+            return item.children.filter(function (i) { return i.type === "link" || i.type === "section"; });
+        }
+        return undefined;
+    })
+        .filter(Boolean)
+        .splice(0, 4);
+    return (react_1.default.createElement("div", { className: "fixed bottom-0 left-0 right-0 flex h-16 items-center space-x-2 border-t border-gray-700 bg-sidebar-background px-4 text-darkMedium sm:hidden" },
+        mobileBarMenu.map(function (item, index) {
+            var _a, _b, _c, _d;
+            if (!!item.children.length) {
+                return (react_1.default.createElement(SubMenuMobile_1.SubMenuMobile, { key: index, content: item.children, title: item.title },
+                    react_1.default.createElement("button", { type: "button", className: "flex grow items-center justify-center" }, !!item.userMenuData ? (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(avatar_1.Avatar, { className: "h-7 w-7", src: item.userMenuData.avatar }))) : (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(icon_1.Icon, { name: (_a = item.icon) !== null && _a !== void 0 ? _a : "", size: 24 }),
+                        react_1.default.createElement(icon_1.Icon, { name: "caretDown", size: 16, className: "ml-1" }))))));
+            }
+            if (item.url || item.route) {
+                return (react_1.default.createElement(link_1.default, { key: index, href: (_b = item.url) !== null && _b !== void 0 ? _b : config_1.container.get("route")(item.route, item.routeParams), target: item.isExternal ? "_blank" : undefined, rel: item.isExternal ? "noreferrer noopener" : undefined, className: "flex grow items-center justify-center" },
+                    react_1.default.createElement(icon_1.Icon, { name: (_c = item.icon) !== null && _c !== void 0 ? _c : "user", size: 24 })));
+            }
+            return (react_1.default.createElement("span", { key: index, className: "flex grow items-center justify-center" },
+                react_1.default.createElement(icon_1.Icon, { name: (_d = item.icon) !== null && _d !== void 0 ? _d : "user", size: 24 })));
+        }),
+        react_1.default.createElement("button", { type: "button", className: "flex grow items-center justify-center", onClick: toggleMenu },
+            react_1.default.createElement(icon_1.Icon, { name: "bars", size: 24 }))));
+};
+exports.MobileBar = MobileBar;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9iaWxlQmFyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9NZW51L01vYmlsZUJhci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsZ0RBQWtDO0FBQ2xDLG1EQUE2QjtBQUM3QixxQ0FBb0M7QUFFcEMsNERBQTJEO0FBQzNELHVDQUF5QztBQUN6Qyx5Q0FBd0M7QUFFakMsSUFBTSxTQUFTLEdBQWtFLFVBQUMsS0FBSztJQUNsRixJQUFBLGlCQUFpQixHQUFpQixLQUFLLGtCQUF0QixFQUFFLFVBQVUsR0FBSyxLQUFLLFdBQVYsQ0FBVztJQUVoRCxJQUFNLGFBQWEsR0FBZSxpQkFBaUI7U0FDOUMsT0FBTyxDQUFDLFVBQUMsSUFBSTtRQUNWLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxNQUFNLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxTQUFTLEVBQUU7WUFDakQsT0FBTyxJQUFJLENBQUM7U0FDZjtRQUNELElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxZQUFZLEVBQUU7WUFDckIsT0FBTyxJQUFJLENBQUM7U0FDZjtRQUNELElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxlQUFlLEVBQUU7WUFDL0IsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxVQUFDLENBQUMsSUFBSyxPQUFBLENBQUMsQ0FBQyxJQUFJLEtBQUssTUFBTSxJQUFJLENBQUMsQ0FBQyxJQUFJLEtBQUssU0FBUyxFQUF6QyxDQUF5QyxDQUFDLENBQUM7U0FDakY7UUFDRCxPQUFPLFNBQVMsQ0FBQztJQUNyQixDQUFDLENBQUM7U0FDRCxNQUFNLENBQUMsT0FBTyxDQUFDO1NBQ2YsTUFBTSxDQUFDLENBQUMsRUFBRSxDQUFDLENBQWUsQ0FBQztJQUVoQyxPQUFPLENBQ0gsdUNBQUssU0FBUyxFQUFDLDhJQUE4STtRQUN4SixhQUFhLENBQUMsR0FBRyxDQUFDLFVBQUMsSUFBSSxFQUFFLEtBQUs7O1lBQzNCLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxFQUFFO2dCQUN4QixPQUFPLENBQ0gsOEJBQUMsNkJBQWEsSUFBQyxHQUFHLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxJQUFJLENBQUMsUUFBUSxFQUFFLEtBQUssRUFBRSxJQUFJLENBQUMsS0FBSztvQkFDaEUsMENBQVEsSUFBSSxFQUFDLFFBQVEsRUFBQyxTQUFTLEVBQUMsdUNBQXVDLElBQ2xFLENBQUMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxDQUNuQjt3QkFDSSw4QkFBQyxlQUFNLElBQUMsU0FBUyxFQUFDLFNBQVMsRUFBQyxHQUFHLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLEdBQUksQ0FDOUQsQ0FDTixDQUFDLENBQUMsQ0FBQyxDQUNBO3dCQUNJLDhCQUFDLFdBQUksSUFBQyxJQUFJLEVBQUUsTUFBQSxJQUFJLENBQUMsSUFBSSxtQ0FBSSxFQUFFLEVBQUUsSUFBSSxFQUFFLEVBQUUsR0FBSTt3QkFDekMsOEJBQUMsV0FBSSxJQUFDLElBQUksRUFBQyxXQUFXLEVBQUMsSUFBSSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUMsTUFBTSxHQUFHLENBQ3JELENBQ04sQ0FDSSxDQUNHLENBQ25CLENBQUM7YUFDTDtZQUNELElBQUksSUFBSSxDQUFDLEdBQUcsSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFO2dCQUN4QixPQUFPLENBQ0gsOEJBQUMsY0FBSSxJQUNELEdBQUcsRUFBRSxLQUFLLEVBQ1YsSUFBSSxFQUFFLE1BQUEsSUFBSSxDQUFDLEdBQUcsbUNBQUksa0JBQVMsQ0FBQyxHQUFHLENBQUMsT0FBTyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQVksRUFBRSxJQUFJLENBQUMsV0FBVyxDQUFDLEVBQzdFLE1BQU0sRUFBRSxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFNBQVMsRUFDOUMsR0FBRyxFQUFFLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLHFCQUFxQixDQUFDLENBQUMsQ0FBQyxTQUFTLEVBQ3hELFNBQVMsRUFBQyx1Q0FBdUM7b0JBRWpELDhCQUFDLFdBQUksSUFBQyxJQUFJLEVBQUUsTUFBQSxJQUFJLENBQUMsSUFBSSxtQ0FBSSxNQUFNLEVBQUUsSUFBSSxFQUFFLEVBQUUsR0FBSSxDQUMxQyxDQUNWLENBQUM7YUFDTDtZQUNELE9BQU8sQ0FDSCx3Q0FBTSxHQUFHLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBQyx1Q0FBdUM7Z0JBQy9ELDhCQUFDLFdBQUksSUFBQyxJQUFJLEVBQUUsTUFBQSxJQUFJLENBQUMsSUFBSSxtQ0FBSSxNQUFNLEVBQUUsSUFBSSxFQUFFLEVBQUUsR0FBSSxDQUMxQyxDQUNWLENBQUM7UUFDTixDQUFDLENBQUM7UUFDRiwwQ0FBUSxJQUFJLEVBQUMsUUFBUSxFQUFDLFNBQVMsRUFBQyx1Q0FBdUMsRUFBQyxPQUFPLEVBQUUsVUFBVTtZQUN2Riw4QkFBQyxXQUFJLElBQUMsSUFBSSxFQUFDLE1BQU0sRUFBQyxJQUFJLEVBQUUsRUFBRSxHQUFJLENBQ3pCLENBQ1AsQ0FDVCxDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBaEVXLFFBQUEsU0FBUyxhQWdFcEIifQ==