@uxf/cms 4.0.0-beta.2 → 4.0.0-beta.20

package/README.md

@@ -13,12 +13,28 @@
 - [@uxf/cms/pages](./README_pages.md) - NextJS stránky
 - [@uxf/cms/lab](./README_lab.md) - Komponenty které ještě nejsou odladěné na stabilní verzi
 
-## Použití balíčku
+## Instalace
+
+Od verze 4.0 balíček používá Tailwind CSS
 
 ```shell
 yarn add @uxf/cms dayjs
 ```
 
+Do souboru `tailwind.config.js` přidat následující řádky
+
+```js
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    content: [
+        "./node_modules/@uxf/cms/**/*.js"
+    ],
+    plugins: [],
+};
+```
+
+## Použití balíčku
+
 Konfigurace balíčku se prvádí v souboru `_app.tsx`.
 
 ```tsx

package/forms/components/DropZone/DropZone.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { FileResponse } from "../../../ui/FileUploadInput";
+export interface DropZoneProps {
+    name: string;
+}
+export declare type FileState = FileResponse;
+export declare const DropZone: React.FC<DropZoneProps>;

package/forms/components/DropZone/DropZone.js

@@ -0,0 +1,159 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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]; } });
+}) : (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 __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 (_) 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 };
+    }
+};
+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;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropZone = void 0;
+var react_dropzone_1 = require("react-dropzone");
+var react_1 = __importStar(require("react"));
+var react_final_form_1 = require("react-final-form");
+var config_1 = require("../../../config");
+var resizer_1 = require("@uxf/core/utils/resizer");
+var ImagePreview = function (props) {
+    var loading = props.loading, onRemove = props.onRemove, src = props.src, alt = props.alt, title = props.title;
+    return (react_1.default.createElement("div", { className: "w-16 h-16 mr-2 mb-2 rounded-md overflow-hidden relative border border-gray-300" },
+        onRemove && (react_1.default.createElement("button", { className: "absolute right-0 top-0 bg-black hover:bg-opacity-70 bg-opacity-50 rounded-bl-md", onClick: onRemove },
+            react_1.default.createElement("svg", { className: "w-5 h-5 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+                react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" })))),
+        react_1.default.createElement("img", { alt: alt, title: title, className: "h-full w-full", src: src }),
+        loading && (react_1.default.createElement("div", { className: "absolute top-0 left-0 right-0 bottom-0 flex items-center justify-center bg-black bg-opacity-50" },
+            react_1.default.createElement("svg", { className: "animate-spin h-6 w-6 text-white", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" },
+                react_1.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+                react_1.default.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }))))));
+};
+var DropZone = function (props) {
+    var name = props.name;
+    var input = (0, react_final_form_1.useField)(name, {}).input;
+    var fieldValue = input.value || [];
+    var _a = __read((0, react_1.useState)([]), 2), acceptedFiles = _a[0], setAcceptedFiles = _a[1];
+    var _b = (0, react_dropzone_1.useDropzone)({
+        onDrop: function (acceptedFiles) { return __awaiter(void 0, void 0, void 0, function () {
+            var uploadFile, responses, successResponses;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        setAcceptedFiles(acceptedFiles);
+                        uploadFile = config_1.container.get("api.uploadFile");
+                        return [4 /*yield*/, Promise.allSettled(acceptedFiles.map(function (af) { return uploadFile(af); }))];
+                    case 1:
+                        responses = _a.sent();
+                        successResponses = responses
+                            .map(function (r) { return (r.status === "fulfilled" ? r.value : null); })
+                            .filter(function (r) { return r !== null; });
+                        setAcceptedFiles([]);
+                        input.onChange(__spreadArray(__spreadArray([], __read(fieldValue), false), __read(successResponses), false));
+                        return [2 /*return*/];
+                }
+            });
+        }); },
+    }), getRootProps = _b.getRootProps, getInputProps = _b.getInputProps, isDragActive = _b.isDragActive;
+    var onRemove = function (index) { return function () {
+        // eslint-disable-next-line no-alert
+        if (confirm("Opravdu chcete smazat fotografii?")) {
+            var newWalue = __spreadArray([], __read(fieldValue), false);
+            newWalue.splice(index, 1);
+            input.onChange(newWalue);
+        }
+    }; };
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement("div", __assign({}, getRootProps({ className: "dropzone" }), { className: "border-dashed rounded-md border-2 py-8 bg-gray-100 hover:border-gray-300 cursor-pointer " +
+                (isDragActive ? "border-gray-300" : "border-gray-200") }),
+            react_1.default.createElement("input", __assign({}, getInputProps())),
+            react_1.default.createElement("p", { className: "text-center text-xs text-gray-400" }, "Drag drop some files here, or click to select files")),
+        react_1.default.createElement("div", { className: "pt-2 flex flex-row flex-wrap" },
+            fieldValue.map(function (file, index) {
+                var _a;
+                return (react_1.default.createElement(ImagePreview, { key: file.id, src: (_a = (0, resizer_1.resizerImageUrl)(file, 200, 200, {})) !== null && _a !== void 0 ? _a : "", onRemove: onRemove(index), alt: file.name, title: file.name }));
+            }),
+            acceptedFiles.map(function (file) { return (react_1.default.createElement(ImagePreview, { key: file.name, loading: true, src: URL.createObjectURL(file) })); }))));
+};
+exports.DropZone = DropZone;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRHJvcFpvbmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZm9ybXMvY29tcG9uZW50cy9Ecm9wWm9uZS9Ecm9wWm9uZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLGlEQUE2QztBQUM3Qyw2Q0FBd0M7QUFDeEMscURBQTRDO0FBRTVDLDBDQUE0QztBQUM1QyxtREFBMEQ7QUFnQjFELElBQU0sWUFBWSxHQUFnQyxVQUFDLEtBQUs7SUFDNUMsSUFBQSxPQUFPLEdBQWdDLEtBQUssUUFBckMsRUFBRSxRQUFRLEdBQXNCLEtBQUssU0FBM0IsRUFBRSxHQUFHLEdBQWlCLEtBQUssSUFBdEIsRUFBRSxHQUFHLEdBQVksS0FBSyxJQUFqQixFQUFFLEtBQUssR0FBSyxLQUFLLE1BQVYsQ0FBVztJQUNyRCxPQUFPLENBQ0gsdUNBQUssU0FBUyxFQUFDLGdGQUFnRjtRQUMxRixRQUFRLElBQUksQ0FDVCwwQ0FDSSxTQUFTLEVBQUMsaUZBQWlGLEVBQzNGLE9BQU8sRUFBRSxRQUFRO1lBRWpCLHVDQUNJLFNBQVMsRUFBQyxvQkFBb0IsRUFDOUIsSUFBSSxFQUFDLE1BQU0sRUFDWCxNQUFNLEVBQUMsY0FBYyxFQUNyQixPQUFPLEVBQUMsV0FBVyxFQUNuQixLQUFLLEVBQUMsNEJBQTRCO2dCQUVsQyx3Q0FBTSxhQUFhLEVBQUMsT0FBTyxFQUFDLGNBQWMsRUFBQyxPQUFPLEVBQUMsV0FBVyxFQUFFLENBQUMsRUFBRSxDQUFDLEVBQUMsc0JBQXNCLEdBQUcsQ0FDNUYsQ0FDRCxDQUNaO1FBQ0QsdUNBQUssR0FBRyxFQUFFLEdBQUcsRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBQyxlQUFlLEVBQUMsR0FBRyxFQUFFLEdBQUcsR0FBSTtRQUNs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

package/forms/components/DropZone/index.d.ts

@@ -0,0 +1 @@
+export * from "./DropZone";

package/forms/components/DropZone/index.js

@@ -0,0 +1,14 @@
+"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]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DropZone"), exports);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZm9ybXMvY29tcG9uZW50cy9Ecm9wWm9uZS9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7O0FBQUEsNkNBQTJCIn0=

package/forms/components/TextInput/TextInput.js

@@ -80,14 +80,14 @@ var requiredValidator = function (errorMessage) {
     };
 };
 var TextInput = function (props) {
-    var _a;
-    var disabled = props.disabled, error = props.error, helperText = props.helperText, label = props.label, name = props.name, onBlur = props.onBlur, onFocus = props.onFocus, required = props.required, _b = props.requiredErrorMessage, requiredErrorMessage = _b === void 0 ? "Vyplňte políčko" : _b, _c = props.validate, validate = _c === void 0 ? [] : _c, restProps = __rest(props, ["disabled", "error", "helperText", "label", "name", "onBlur", "onFocus", "required", "requiredErrorMessage", "validate"]);
+    var _a, _b;
+    var disabled = props.disabled, error = props.error, helperText = props.helperText, label = props.label, name = props.name, onBlur = props.onBlur, onFocus = props.onFocus, required = props.required, _c = props.requiredErrorMessage, requiredErrorMessage = _c === void 0 ? "Vyplňte políčko" : _c, _d = props.validate, validate = _d === void 0 ? [] : _d, restProps = __rest(props, ["disabled", "error", "helperText", "label", "name", "onBlur", "onFocus", "required", "requiredErrorMessage", "validate"]);
     var validator = composeValidators_1.composeValidators.apply(void 0, __spreadArray([required && !disabled ? requiredValidator(requiredErrorMessage) : undefined], __read(validate), false));
-    var _d = (0, react_final_form_1.useField)(name, {
+    var _e = (0, react_final_form_1.useField)(name, {
         validate: validator,
         allowNull: true,
         parse: function (value) { return (value === "" ? null : value); },
-    }), input = _d.input, meta = _d.meta;
+    }), input = _e.input, meta = _e.meta;
     var onBlurHandler = (0, react_1.useCallback)(function (e) {
         input.onBlur(e);
         if (onBlur) {
@@ -102,7 +102,7 @@ var TextInput = function (props) {
     }, [input, onFocus]);
     return (react_1.default.createElement(TextField_1.default, __assign({ error: error || !!(meta.touched && meta.error), helperText: (meta.touched && meta.error) || helperText, disabled: disabled, fullWidth: true, variant: "outlined", size: "small", label: react_1.default.createElement(react_1.default.Fragment, null,
             label,
-            required ? " *" : ""), name: name, onChange: input.onChange, value: (_a = input.value) !== null && _a !== void 0 ? _a : "", onBlur: onBlurHandler, onFocus: onFocusHandler }, restProps)));
+            required ? " *" : ""), name: name, onChange: input.onChange, value: (_a = input.value) !== null && _a !== void 0 ? _a : "", onBlur: onBlurHandler, onFocus: onFocusHandler, InputLabelProps: __assign({ shrink: true }, ((_b = restProps.InputLabelProps) !== null && _b !== void 0 ? _b : {})) }, restProps)));
 };
 exports.TextInput = TextInput;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGV4dElucHV0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2Zvcm1zL2NvbXBvbmVudHMvVGV4dElucHV0L1RleHRJbnB1dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsc0VBQWdEO0FBRWhELDZDQUF5RTtBQUN6RSxxREFBNEM7QUFDNUMsc0VBQXFFO0FBR3JFLElBQU0saUJBQWlCLEdBQ25CLFVBQUMsWUFBdUI7SUFDeEIsT0FBQSxVQUFDLEtBQWE7UUFDVixPQUFBLEtBQUssS0FBSyxFQUFFLElBQUksS0FBSyxLQUFLLElBQUksSUFBSSxLQUFLLEtBQUssU0FBUyxDQUFDLENBQUMsQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLFNBQVM7SUFBaEYsQ0FBZ0Y7QUFEcEYsQ0FDb0YsQ0FBQztBQUVsRixJQUFNLFNBQVMsR0FBRyxVQUF1QyxLQUErQjs7SUFFdkYsSUFBQSxRQUFRLEdBV1IsS0FBSyxTQVhHLEVBQ1IsS0FBSyxHQVVMLEtBQUssTUFWQSxFQUNMLFVBQVUsR0FTVixLQUFLLFdBVEssRUFDVixLQUFLLEdBUUwsS0FBSyxNQVJBLEVBQ0wsSUFBSSxHQU9KLEtBQUssS0FQRCxFQUNKLE1BQU0sR0FNTixLQUFLLE9BTkMsRUFDTixPQUFPLEdBS1AsS0FBSyxRQUxFLEVBQ1AsUUFBUSxHQUlSLEtBQUssU0FKRyxFQUNSLEtBR0EsS0FBSyxxQkFIbUMsRUFBeEMsb0JBQW9CLG1CQUFHLGlCQUFpQixLQUFBLEVBQ3hDLEtBRUEsS0FBSyxTQUZRLEVBQWIsUUFBUSxtQkFBRyxFQUFFLEtBQUEsRUFDVixTQUFTLFVBQ1osS0FBSyxFQVpILHlIQVlMLENBRGUsQ0FDTjtJQUVWLElBQU0sU0FBUyxHQUFHLHFDQUFpQiw4QkFDL0IsUUFBUSxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxpQkFBaUIsQ0FBQyxvQkFBb0IsQ0FBQyxDQUFDLENBQUMsQ0FBQyxTQUFTLFVBQ3hFLFFBQVEsVUFDZCxDQUFDO0lBRUksSUFBQSxLQUFrQixJQUFBLDJCQUFRLEVBQWdCLElBQWMsRUFBRTtRQUM1RCxRQUFRLEVBQUUsU0FBUztRQUNuQixTQUFTLEVBQUUsSUFBSTtRQUNmLEtBQUssRUFBRSxVQUFDLEtBQUssSUFBSyxPQUFBLENBQUMsS0FBSyxLQUFLLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsRUFBN0IsQ0FBNkI7S0FDbEQsQ0FBQyxFQUpNLEtBQUssV0FBQSxFQUFFLElBQUksVUFJakIsQ0FBQztJQUVILElBQU0sYUFBYSxHQUFHLElBQUEsbUJBQVcsRUFDN0IsVUFBQyxDQUFDO1FBQ0UsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUNoQixJQUFJLE1BQU0sRUFBRTtZQUNSLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQztTQUNiO0lBQ0wsQ0FBQyxFQUNELENBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxDQUNsQixDQUFDO0lBRUYsSUFBTSxjQUFjLEdBQUcsSUFBQSxtQkFBVyxFQUM5QixVQUFDLENBQUM7UUFDRSxLQUFLLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFDO1FBQ2pCLElBQUksT0FBTyxFQUFFO1lBQ1QsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFDO1NBQ2Q7SUFDTCxDQUFDLEVBQ0QsQ0FBQyxLQUFLLEVBQUUsT0FBTyxDQUFDLENBQ25CLENBQUM7SUFFRixPQUFPLENBQ0gsOEJBQUMsbUJBQVMsYUFDTixLQUFLLEVBQUUsS0FBSyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxPQUFPLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxFQUM5QyxVQUFVLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxVQUFVLEVBQ3RELFFBQVEsRUFBRSxRQUFRLEVBQ2xCLFNBQVMsUUFDVCxPQUFPLEVBQUMsVUFBVSxFQUNsQixJQUFJLEVBQUMsT0FBTyxFQUNaLEtBQUssRUFDRDtZQUNLLEtBQUs7WUFDTCxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUN0QixFQUVQLElBQUksRUFBRSxJQUFjLEVBQ3BCLFFBQVEsRUFBRSxLQUFLLENBQUMsUUFBUSxFQUN4QixLQUFLLEVBQUUsTUFBQSxLQUFLLENBQUMsS0FBSyxtQ0FBSSxFQUFFLEVBQ3hCLE1BQU0sRUFBRSxhQUFhLEVBQ3JCLE9BQU8sRUFBRSxjQUFjLElBQ25CLFNBQVMsRUFDZixDQUNMLENBQUM7QUFDTixDQUFDLENBQUM7QUFwRVcsUUFBQSxTQUFTLGFBb0VwQiJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGV4dElucHV0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2Zvcm1zL2NvbXBvbmVudHMvVGV4dElucHV0L1RleHRJbnB1dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsc0VBQWdEO0FBRWhELDZDQUF5RTtBQUN6RSxxREFBNEM7QUFDNUMsc0VBQXFFO0FBR3JFLElBQU0saUJBQWlCLEdBQ25CLFVBQUMsWUFBdUI7SUFDeEIsT0FBQSxVQUFDLEtBQWE7UUFDVixPQUFBLEtBQUssS0FBSyxFQUFFLElBQUksS0FBSyxLQUFLLElBQUksSUFBSSxLQUFLLEtBQUssU0FBUyxDQUFDLENBQUMsQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLFNBQVM7SUFBaEYsQ0FBZ0Y7QUFEcEYsQ0FDb0YsQ0FBQztBQUVsRixJQUFNLFNBQVMsR0FBRyxVQUF1QyxLQUErQjs7SUFFdkYsSUFBQSxRQUFRLEdBV1IsS0FBSyxTQVhHLEVBQ1IsS0FBSyxHQVVMLEtBQUssTUFWQSxFQUNMLFVBQVUsR0FTVixLQUFLLFdBVEssRUFDVixLQUFLLEdBUUwsS0FBSyxNQVJBLEVBQ0wsSUFBSSxHQU9KLEtBQUssS0FQRCxFQUNKLE1BQU0sR0FNTixLQUFLLE9BTkMsRUFDTixPQUFPLEdBS1AsS0FBSyxRQUxFLEVBQ1AsUUFBUSxHQUlSLEtBQUssU0FKRyxFQUNSLEtBR0EsS0FBSyxxQkFIbUMsRUFBeEMsb0JBQW9CLG1CQUFHLGlCQUFpQixLQUFBLEVBQ3hDLEtBRUEsS0FBSyxTQUZRLEVBQWIsUUFBUSxtQkFBRyxFQUFFLEtBQUEsRUFDVixTQUFTLFVBQ1osS0FBSyxFQVpILHlIQVlMLENBRGUsQ0FDTjtJQUVWLElBQU0sU0FBUyxHQUFHLHFDQUFpQiw4QkFDL0IsUUFBUSxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxpQkFBaUIsQ0FBQyxvQkFBb0IsQ0FBQyxDQUFDLENBQUMsQ0FBQyxTQUFTLFVBQ3hFLFFBQVEsVUFDZCxDQUFDO0lBRUksSUFBQSxLQUFrQixJQUFBLDJCQUFRLEVBQWdCLElBQWMsRUFBRTtRQUM1RCxRQUFRLEVBQUUsU0FBUztRQUNuQixTQUFTLEVBQUUsSUFBSTtRQUNmLEtBQUssRUFBRSxVQUFDLEtBQUssSUFBSyxPQUFBLENBQUMsS0FBSyxLQUFLLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsRUFBN0IsQ0FBNkI7S0FDbEQsQ0FBQyxFQUpNLEtBQUssV0FBQSxFQUFFLElBQUksVUFJakIsQ0FBQztJQUVILElBQU0sYUFBYSxHQUFHLElBQUEsbUJBQVcsRUFDN0IsVUFBQyxDQUFDO1FBQ0UsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUNoQixJQUFJLE1BQU0sRUFBRTtZQUNSLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQztTQUNiO0lBQ0wsQ0FBQyxFQUNELENBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxDQUNsQixDQUFDO0lBRUYsSUFBTSxjQUFjLEdBQUcsSUFBQSxtQkFBVyxFQUM5QixVQUFDLENBQUM7UUFDRSxLQUFLLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFDO1FBQ2pCLElBQUksT0FBTyxFQUFFO1lBQ1QsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUFDO1NBQ2Q7SUFDTCxDQUFDLEVBQ0QsQ0FBQyxLQUFLLEVBQUUsT0FBTyxDQUFDLENBQ25CLENBQUM7SUFFRixPQUFPLENBQ0gsOEJBQUMsbUJBQVMsYUFDTixLQUFLLEVBQUUsS0FBSyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxPQUFPLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxFQUM5QyxVQUFVLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxVQUFVLEVBQ3RELFFBQVEsRUFBRSxRQUFRLEVBQ2xCLFNBQVMsUUFDVCxPQUFPLEVBQUMsVUFBVSxFQUNsQixJQUFJLEVBQUMsT0FBTyxFQUNaLEtBQUssRUFDRDtZQUNLLEtBQUs7WUFDTCxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUN0QixFQUVQLElBQUksRUFBRSxJQUFjLEVBQ3BCLFFBQVEsRUFBRSxLQUFLLENBQUMsUUFBUSxFQUN4QixLQUFLLEVBQUUsTUFBQSxLQUFLLENBQUMsS0FBSyxtQ0FBSSxFQUFFLEVBQ3hCLE1BQU0sRUFBRSxhQUFhLEVBQ3JCLE9BQU8sRUFBRSxjQUFjLEVBQ3ZCLGVBQWUsYUFBSSxNQUFNLEVBQUUsSUFBSSxJQUFLLENBQUMsTUFBQSxTQUFTLENBQUMsZUFBZSxtQ0FBSSxFQUFFLENBQUMsS0FDakUsU0FBUyxFQUNmLENBQ0wsQ0FBQztBQUNOLENBQUMsQ0FBQztBQXJFVyxRQUFBLFNBQVMsYUFxRXBCIn0=

package/forms/components/WysiwygField/WysiwygField.d.ts

@@ -0,0 +1,8 @@
+import { EditorPlugin } from "@uxf/wysiwyg/Editor";
+import { FC } from "react";
+interface Props {
+    name: string;
+    editorPlugins?: EditorPlugin[];
+}
+export declare const WysiwygField: FC<Props>;
+export {};

package/forms/components/WysiwygField/WysiwygField.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WysiwygField = void 0;
+var wysiwyg_mui5_plugins_1 = require("@uxf/wysiwyg-mui5-plugins");
+var Editor_1 = require("@uxf/wysiwyg/Editor");
+var react_1 = __importDefault(require("react"));
+var react_final_form_1 = require("react-final-form");
+var Wysiwyg_1 = require("../../../pages/ContentBuilder/content/Wysiwyg");
+var WysiwygField = function (_a) {
+    var name = _a.name, editorPlugins = _a.editorPlugins;
+    var input = (0, react_final_form_1.useField)(name, {
+        allowNull: true,
+    }).input;
+    var plugins = editorPlugins !== null && editorPlugins !== void 0 ? editorPlugins : Wysiwyg_1.DEFAULT_EDITOR_PLUGINS;
+    return (react_1.default.createElement(Editor_1.WysiwygEditor, { value: input.value, onChange: input.onChange, Toolbar: wysiwyg_mui5_plugins_1.Toolbar, plugins: plugins, stylesForEditable: {
+            border: "1px solid #e1e1e1",
+            padding: 12,
+            borderBottomLeftRadius: 4,
+            borderBottomRightRadius: 4,
+            borderTop: 0,
+        } }));
+};
+exports.WysiwygField = WysiwygField;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiV3lzaXd5Z0ZpZWxkLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2Zvcm1zL2NvbXBvbmVudHMvV3lzaXd5Z0ZpZWxkL1d5c2l3eWdGaWVsZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQ0Esa0VBQW9EO0FBQ3BELDhDQUFrRTtBQUNsRSxnREFBa0M7QUFDbEMscURBQTRDO0FBQzVDLHlFQUF1RjtBQU9oRixJQUFNLFlBQVksR0FBYyxVQUFDLEVBQXVCO1FBQXJCLElBQUksVUFBQSxFQUFFLGFBQWEsbUJBQUE7SUFDakQsSUFBQSxLQUFLLEdBQUssSUFBQSwyQkFBUSxFQUFpQixJQUFJLEVBQUU7UUFDN0MsU0FBUyxFQUFFLElBQUk7S0FDbEIsQ0FBQyxNQUZXLENBRVY7SUFDSCxJQUFNLE9BQU8sR0FBbUIsYUFBYSxhQUFiLGFBQWEsY0FBYixhQUFhLEdBQUksZ0NBQXNCLENBQUM7SUFFeEUsT0FBTyxDQUNILDhCQUFDLHNCQUFhLElBQ1YsS0FBSyxFQUFFLEtBQUssQ0FBQyxLQUFLLEVBQ2xCLFFBQVEsRUFBRSxLQUFLLENBQUMsUUFBUSxFQUN4QixPQUFPLEVBQUUsOEJBQU8sRUFDaEIsT0FBTyxFQUFFLE9BQU8sRUFDaEIsaUJBQWlCLEVBQUU7WUFDZixNQUFNLEVBQUUsbUJBQW1CO1lBQzNCLE9BQU8sRUFBRSxFQUFFO1lBQ1gsc0JBQXNCLEVBQUUsQ0FBQztZQUN6Qix1QkFBdUIsRUFBRSxDQUFDO1lBQzFCLFNBQVMsRUFBRSxDQUFDO1NBQ2YsR0FDSCxDQUNMLENBQUM7QUFDTixDQUFDLENBQUM7QUFyQlcsUUFBQSxZQUFZLGdCQXFCdkIifQ==

package/forms/components/WysiwygField/index.d.ts

@@ -0,0 +1 @@
+export * from "./WysiwygField";

package/forms/components/WysiwygField/index.js

@@ -0,0 +1,14 @@
+"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]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./WysiwygField"), exports);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZm9ybXMvY29tcG9uZW50cy9XeXNpd3lnRmllbGQvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7O0FBQUEsaURBQStCIn0=

package/lib/Layout/Layout.js

@@ -4,8 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Layout = void 0;
-var material_1 = require("@mui/material");
-var Box_1 = __importDefault(require("@mui/material/Box"));
+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"));
@@ -27,21 +26,22 @@ var Layout = function (props) {
                 config_1.config.get("app-name"))),
         react_1.default.createElement(CssBaseline_1.default, null),
         react_1.default.createElement(AppBar_1.AppBar, { Logo: Logo, ToolbarRight: ToolbarRight }),
-        react_1.default.createElement(Sidebar_1.Sidebar, { menuConfiguration: menuConfiguration, Menu: Menu, UserMenu: UserMenu }),
-        react_1.default.createElement(Box_1.default, { component: "main", sx: { flexGrow: 1 } }, loading ? (react_1.default.createElement(Box_1.default, { minHeight: "60vh", display: "flex", alignItems: "center", justifyContent: "center" },
-            react_1.default.createElement(Box_1.default, { textAlign: "center" },
-                react_1.default.createElement(material_1.CircularProgress, 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(Box_1.default, { display: "flex", flexDirection: "row", alignItems: "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(Box_1.default, { sx: { padding: 3 } }, children))))));
+        react_1.default.createElement("div", { className: "flex flex-row w-full" },
+            react_1.default.createElement(Sidebar_1.Sidebar, { menuConfiguration: menuConfiguration, Menu: Menu, UserMenu: UserMenu }),
+            react_1.default.createElement("main", { style: { width: "calc(100% - ".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)))))));
 };
 exports.Layout = Layout;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvTGF5b3V0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSwwQ0FBaUQ7QUFDakQsMERBQW9DO0FBQ3BDLDBFQUFvRDtBQUNwRCxrRUFBK0M7QUFDL0Msd0VBQWtEO0FBQ2xELG1EQUE2QjtBQUM3QixnREFBa0M7QUFDbEMsdUNBQXNDO0FBQ3RDLG1DQUFrQztBQUNsQyxxQ0FBb0M7QUFDcEMsbUNBQW9EO0FBRzdDLElBQU0sTUFBTSxHQUFvQixVQUFDLEtBQUs7SUFFckMsSUFBQSxRQUFRLEdBYVIsS0FBSyxTQWJHLEVBQ1IsS0FBSyxHQVlMLEtBQUssTUFaQSxFQUNMLElBQUksR0FXSixLQUFLLEtBWEQsRUFDSixJQUFJLEdBVUosS0FBSyxLQVZELEVBQ0osaUJBQWlCLEdBU2pCLEtBQUssa0JBVFksRUFDakIsUUFBUSxHQVFSLEtBQUssU0FSRyxFQUNSLE1BQU0sR0FPTixLQUFLLE9BUEMsRUFDTixXQUFXLEdBTVgsS0FBSyxZQU5NLEVBQ1gsWUFBWSxHQUtaLEtBQUssYUFMTyxFQUNaLFVBQVUsR0FJVixLQUFLLFdBSkssRUFDVixPQUFPLEdBR1AsS0FBSyxRQUhFLEVBQ1AsUUFBUSxHQUVSLEtBQUssU0FGRyxFQUNSLG1CQUFtQixHQUNuQixLQUFLLG9CQURjLENBQ2I7SUFFVixPQUFPLENBQ0gsOEJBQUMsbUJBQVU7UUFDUCw4QkFBQyxjQUFJO1lBQ0Qsd0NBQU0sSUFBSSxFQUFDLFVBQVUsRUFBQyxPQUFPLEVBQUMscUNBQXFDLEdBQUc7WUFDdEUsd0NBQU0sT0FBTyxFQUFDLE9BQU8sR0FBRztZQUN4QjtnQkFDSyxLQUFLOztnQkFBSyxlQUFNLENBQUMsR0FBRyxDQUFDLFVBQVUsQ0FBQyxDQUM3QixDQUNMO1FBQ1AsOEJBQUMscUJBQVcsT0FBRztRQUNmLDhCQUFDLGVBQU0sSUFBQyxJQUFJLEVBQUUsSUFBSSxFQUFFLFlBQVksRUFBRSxZQUFZLEdBQUk7UUFDbEQsOEJBQUMsaUJBQU8sSUFBQyxpQkFBaUIsRUFBRSxpQkFBaUIsRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxRQUFRLEdBQUk7UUFDakYsOEJBQUMsYUFBRyxJQUFDLFNBQVMsRUFBQyxNQUFNLEVBQUMsRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLENBQUMsRUFBRSxJQUNwQyxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQ1AsOEJBQUMsYUFBRyxJQUFDLFNBQVMsRUFBQyxNQUFNLEVBQUMsT0FBTyxFQUFDLE1BQU0sRUFBQyxVQUFVLEVBQUMsUUFBUSxFQUFDLGNBQWMsRUFBQyxRQUFRO1lBQzVFLDhCQUFDLGFBQUcsSUFBQyxTQUFTLEVBQUMsUUFBUTtnQkFDbkIsOEJBQUMsMkJBQWdCLE9BQUc7Z0JBQ3BCLDhCQUFDLG9CQUFVLElBQUMsRUFBRSxFQUFFLENBQUMsbUNBQThCLENBQzdDLENBQ0osQ0FDVCxDQUFDLENBQUMsQ0FBQyxDQUNBO1lBQ0ksOEJBQUMsaUJBQVUsSUFBQyxPQUFPLEVBQUMsT0FBTyxHQUFHO1lBQzlCLDhCQUFDLHFCQUFZLElBQUMsU0FBUyxFQUFFLENBQUMsQ0FBQyxNQUFNLEVBQUUsRUFBRSxFQUFFLEVBQUUsQ0FBQyxFQUFFLENBQUMsRUFBRTtnQkFDMUMsVUFBVTtnQkFDWCx1Q0FBSyxLQUFLLEVBQUUsRUFBRSxRQUFRLEVBQUUsRUFBRSxFQUFFLElBQUcsV0FBVyxDQUFPO2dCQUNqRCw4QkFBQyxhQUFHLElBQUMsT0FBTyxFQUFDLE1BQU0sRUFBQyxhQUFhLEVBQUMsS0FBSyxFQUFDLFVBQVUsRUFBQyxRQUFRO29CQUN2RCw4QkFBQyxvQkFBVSxJQUFDLElBQUksRUFBRSxDQUFDLEVBQUUsT0FBTyxFQUFDLElBQUksRUFBQyxTQUFTLEVBQUMsSUFBSSxFQUFDLEtBQUssRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsU0FBUyxJQUM5RSxLQUFLLENBQ0c7b0JBQ1osbUJBQW1CLENBQ2xCO2dCQUNMLFFBQVE7Z0JBQ1IsTUFBTSxDQUNJO1lBQ2YsOEJBQUMsYUFBRyxJQUFDLEVBQUUsRUFBRSxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsSUFBRyxRQUFRLENBQU8sQ0FDMUMsQ0FDTixDQUNDLENBQ0csQ0FDaEIsQ0FBQztBQUNOLENBQUMsQ0FBQztBQTFEVyxRQUFBLE1BQU0sVUEwRGpCIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGF5b3V0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9MYXlvdXQvTGF5b3V0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxvRkFBOEQ7QUFDOUQsMEVBQW9EO0FBQ3BELGtFQUErQztBQUMvQyx3RUFBa0Q7QUFDbEQsbURBQTZCO0FBQzdCLGdEQUFrQztBQUNsQyx1Q0FBc0M7QUFDdEMsbUNBQWtDO0FBQ2xDLHFDQUFvQztBQUNwQyxtQ0FBaUU7QUFHMUQsSUFBTSxNQUFNLEdBQW9CLFVBQUMsS0FBSztJQUVyQyxJQUFBLFFBQVEsR0FhUixLQUFLLFNBYkcsRUFDUixLQUFLLEdBWUwsS0FBSyxNQVpBLEVBQ0wsSUFBSSxHQVdKLEtBQUssS0FYRCxFQUNKLElBQUksR0FVSixLQUFLLEtBVkQsRUFDSixpQkFBaUIsR0FTakIsS0FBSyxrQkFUWSxFQUNqQixRQUFRLEdBUVIsS0FBSyxTQVJHLEVBQ1IsTUFBTSxHQU9OLEtBQUssT0FQQyxFQUNOLFdBQVcsR0FNWCxLQUFLLFlBTk0sRUFDWCxZQUFZLEdBS1osS0FBSyxhQUxPLEVBQ1osVUFBVSxHQUlWLEtBQUssV0FKSyxFQUNWLE9BQU8sR0FHUCxLQUFLLFFBSEUsRUFDUCxRQUFRLEdBRVIsS0FBSyxTQUZHLEVBQ1IsbUJBQW1CLEdBQ25CLEtBQUssb0JBRGMsQ0FDYjtJQUVWLE9BQU8sQ0FDSCw4QkFBQyxtQkFBVTtRQUNQLDhCQUFDLGNBQUk7WUFDRCx3Q0FBTSxJQUFJLEVBQUMsVUFBVSxFQUFDLE9BQU8sRUFBQyxxQ0FBcUMsR0FBRztZQUN0RSx3Q0FBTSxPQUFPLEVBQUMsT0FBTyxHQUFHO1lBQ3hCO2dCQUNLLEtBQUs7O2dCQUFLLGVBQU0sQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLENBQzdCLENBQ0w7UUFDUCw4QkFBQyxxQkFBVyxPQUFHO1FBQ2YsOEJBQUMsZUFBTSxJQUFDLElBQUksRUFBRSxJQUFJLEVBQUUsWUFBWSxFQUFFLFlBQVksR0FBSTtRQUNsRCx1Q0FBSyxTQUFTLEVBQUMsc0JBQXNCO1lBQ2pDLDhCQUFDLGlCQUFPLElBQUMsaUJBQWlCLEVBQUUsaUJBQWlCLEVBQUUsSUFBSSxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsUUFBUSxHQUFJO1lBQ2pGLHdDQUFNLEtBQUssRUFBRSxFQUFFLEtBQUssRUFBRSxzQkFBZSxvQkFBVyxRQUFLLEVBQUUsSUFDbEQsT0FBTyxDQUFDLENBQUMsQ0FBQyxDQUNQLHVDQUFLLFNBQVMsRUFBQyxnREFBZ0Q7Z0JBQzNELHVDQUFLLFNBQVMsRUFBQyxhQUFhO29CQUN4Qiw4QkFBQywwQkFBZ0IsT0FBRztvQkFDcEIsOEJBQUMsb0JBQVUsSUFBQyxFQUFFLEVBQUUsQ0FBQyxtQ0FBOEIsQ0FDN0MsQ0FDSixDQUNULENBQUMsQ0FBQyxDQUFDLENBQ0E7Z0JBQ0ksOEJBQUMsaUJBQVUsSUFBQyxPQUFPLEVBQUMsT0FBTyxHQUFHO2dCQUM5Qiw4QkFBQyxxQkFBWSxJQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsTUFBTSxFQUFFLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBRSxDQUFDLEVBQUU7b0JBQzFDLFVBQVU7b0JBQ1gsdUNBQUssS0FBSyxFQUFFLEVBQUUsUUFBUSxFQUFFLEVBQUUsRUFBRSxJQUFHLFdBQVcsQ0FBTztvQkFDakQsdUNBQUssU0FBUyxFQUFDLDRCQUE0Qjt3QkFDdkMsOEJBQUMsb0JBQVUsSUFDUCxJQUFJLEVBQUUsQ0FBQyxFQUNQLE9BQU8sRUFBQyxJQUFJLEVBQ1osU0FBUyxFQUFDLElBQUksRUFDZCxLQUFLLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLFNBQVMsSUFFakMsS0FBSyxDQUNHO3dCQUNaLG1CQUFtQixDQUNsQjtvQkFDTCxRQUFRO29CQUNSLE1BQU0sQ0FDSTtnQkFDZix1Q0FBSyxTQUFTLEVBQUMsS0FBSyxJQUFFLFFBQVEsQ0FBTyxDQUN0QyxDQUNOLENBQ0UsQ0FDTCxDQUNHLENBQ2hCLENBQUM7QUFDTixDQUFDLENBQUM7QUFqRVcsUUFBQSxNQUFNLFVBaUVqQiJ9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/cms",
-  "version": "4.0.0-beta.2",
+  "version": "4.0.0-beta.20",
   "description": "UXF Cms",
   "author": "UXFans <dev@uxf.cz>",
   "homepage": "https://gitlab.com/uxf-npm/cms#readme",
@@ -68,6 +68,7 @@
     "qs": "^6.10.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
+    "react-dropzone": "^14.2.2",
     "react-final-form": "^6.5.7",
     "react-final-form-arrays": "^3.1.3",
     "redux-devtools-extension": "^2.13.9",
@@ -88,8 +89,9 @@
     "final-form": "^4.20.1",
     "final-form-arrays": "^3.0",
     "final-form-calculate": "^1.3.2",
-    "react": "^17.0.0",
-    "react-dom": "^17.0.0",
+    "react": "17 - 18",
+    "react-dom": "17 - 18",
+    "react-dropzone": "^14.2.2",
     "react-final-form": "^6.5.1",
     "react-final-form-arrays": "^3.1.3"
   }

package/pages/ContentBuilder/ContentHeader.js

@@ -47,11 +47,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContentHeader = void 0;
 var react_1 = __importStar(require("react"));
 var Typography_1 = __importDefault(require("@mui/material/Typography"));
-var Box_1 = __importDefault(require("@mui/material/Box"));
 var FormControl_1 = __importDefault(require("@mui/material/FormControl"));
 var InputLabel_1 = __importDefault(require("@mui/material/InputLabel"));
 var Select_1 = __importDefault(require("@mui/material/Select"));
 var MenuItem_1 = __importDefault(require("@mui/material/MenuItem"));
+var Button_1 = __importDefault(require("@mui/material/Button"));
 var ContentHeader = function (props) {
     var index = props.index, name = props.name, TypeInputProps = props.TypeInputProps, onRemove = props.onRemove;
     var inputId = "field-".concat(name);
@@ -61,18 +61,14 @@ var ContentHeader = function (props) {
             onRemove();
         }
     }, [onRemove]);
-    return (react_1.default.createElement(Box_1.default, null,
-        react_1.default.createElement(Box_1.default, { display: "flex", justifyContent: "space-between", pb: 1 },
-            react_1.default.createElement(Typography_1.default, { variant: "caption", pt: 1, fontWeight: "bold" },
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement("div", { className: "flex flex-row justify-between items-center pt-8 pb-4" },
+            react_1.default.createElement(Typography_1.default, { variant: "h3", fontWeight: "bold" },
                 "Sekce #",
                 index + 1),
-            index > 0 ? (react_1.default.createElement(Typography_1.default, { variant: "caption", pt: 1, fontWeight: "bold", onClick: removeHandler, sx: {
-                    "&:hover": {
-                        textDecoration: "underline",
-                        cursor: "pointer",
-                    },
-                } }, "Smazat")) : (react_1.default.createElement(Box_1.default, null))),
-        react_1.default.createElement(Box_1.default, { pt: 1 },
+            index > 0 ? (react_1.default.createElement("div", null,
+                react_1.default.createElement(Button_1.default, { size: "small", color: "error", onClick: removeHandler }, "Smazat sekci"))) : (react_1.default.createElement("div", null))),
+        react_1.default.createElement("div", { className: "pt-2" },
             react_1.default.createElement(FormControl_1.default, { fullWidth: true },
                 react_1.default.createElement(InputLabel_1.default, { id: inputId }, "Typ"),
                 react_1.default.createElement(Select_1.default, __assign({ label: "Typ", size: "small", labelId: inputId }, TypeInputProps), TypeInputProps.options.map(function (_a) {
@@ -81,4 +77,4 @@ var ContentHeader = function (props) {
                 }))))));
 };
 exports.ContentHeader = ContentHeader;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29udGVudEhlYWRlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWdlcy9Db250ZW50QnVpbGRlci9Db250ZW50SGVhZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUNBLDZDQUEyQztBQUMzQyx3RUFBa0Q7QUFDbEQsMERBQW9DO0FBQ3BDLDBFQUFvRDtBQUNwRCx3RUFBa0Q7QUFDbEQsZ0VBQTBDO0FBQzFDLG9FQUE4QztBQUV2QyxJQUFNLGFBQWEsR0FBMkIsVUFBQyxLQUFLO0lBQy9DLElBQUEsS0FBSyxHQUFxQyxLQUFLLE1BQTFDLEVBQUUsSUFBSSxHQUErQixLQUFLLEtBQXBDLEVBQUUsY0FBYyxHQUFlLEtBQUssZUFBcEIsRUFBRSxRQUFRLEdBQUssS0FBSyxTQUFWLENBQVc7SUFFeEQsSUFBTSxPQUFPLEdBQUcsZ0JBQVMsSUFBSSxDQUFFLENBQUM7SUFFaEMsSUFBTSxhQUFhLEdBQUcsSUFBQSxtQkFBVyxFQUFDO1FBQzlCLG9DQUFvQztRQUNwQyxJQUFJLE9BQU8sQ0FBQyw4QkFBOEIsQ0FBQyxFQUFFO1lBQ3pDLFFBQVEsRUFBRSxDQUFDO1NBQ2Q7SUFDTCxDQUFDLEVBQUUsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDO0lBRWYsT0FBTyxDQUNILDhCQUFDLGFBQUc7UUFDQSw4QkFBQyxhQUFHLElBQUMsT0FBTyxFQUFDLE1BQU0sRUFBQyxjQUFjLEVBQUMsZUFBZSxFQUFDLEVBQUUsRUFBRSxDQUFDO1lBQ3BELDhCQUFDLG9CQUFVLElBQUMsT0FBTyxFQUFDLFNBQVMsRUFBQyxFQUFFLEVBQUUsQ0FBQyxFQUFFLFVBQVUsRUFBQyxNQUFNOztnQkFDMUMsS0FBSyxHQUFHLENBQUMsQ0FDUjtZQUNaLEtBQUssR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQ1QsOEJBQUMsb0JBQVUsSUFDUCxPQUFPLEVBQUMsU0FBUyxFQUNqQixFQUFFLEVBQUUsQ0FBQyxFQUNMLFVBQVUsRUFBQyxNQUFNLEVBQ2pCLE9BQU8sRUFBRSxhQUFhLEVBQ3RCLEVBQUUsRUFBRTtvQkFDQSxTQUFTLEVBQUU7d0JBQ1AsY0FBYyxFQUFFLFdBQVc7d0JBQzNCLE1BQU0sRUFBRSxTQUFTO3FCQUNwQjtpQkFDSixhQUdRLENBQ2hCLENBQUMsQ0FBQyxDQUFDLENBQ0EsOEJBQUMsYUFBRyxPQUFHLENBQ1YsQ0FDQztRQUNOLDhCQUFDLGFBQUcsSUFBQyxFQUFFLEVBQUUsQ0FBQztZQUNOLDhCQUFDLHFCQUFXLElBQUMsU0FBUztnQkFDbEIsOEJBQUMsb0JBQVUsSUFBQyxFQUFFLEVBQUUsT0FBTyxVQUFrQjtnQkFDekMsOEJBQUMsZ0JBQU0sYUFBQyxLQUFLLEVBQUMsS0FBSyxFQUFDLElBQUksRUFBQyxPQUFPLEVBQUMsT0FBTyxFQUFFLE9BQU8sSUFBTSxjQUFjLEdBQ2hFLGNBQWMsQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLFVBQUMsRUFBOEI7b0JBQTVCLElBQUEsUUFBUSxjQUFBLEVBQUssYUFBYSxjQUE1QixZQUE4QixDQUFGO29CQUNyRCxPQUFPLENBQ0gsOEJBQUMsa0JBQVEsYUFBQyxHQUFHLEVBQUUsS0FBSyxJQUFNLGFBQWEsR0FDbEMsUUFBUSxDQUNGLENBQ2QsQ0FBQztnQkFDTixDQUFDLENBQUMsQ0FDRyxDQUNDLENBQ1osQ0FDSixDQUNULENBQUM7QUFDTixDQUFDLENBQUM7QUFyRFcsUUFBQSxhQUFhLGlCQXFEeEIifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29udGVudEhlYWRlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWdlcy9Db250ZW50QnVpbGRlci9Db250ZW50SGVhZGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUNBLDZDQUEyQztBQUMzQyx3RUFBa0Q7QUFDbEQsMEVBQW9EO0FBQ3BELHdFQUFrRDtBQUNsRCxnRUFBMEM7QUFDMUMsb0VBQThDO0FBQzlDLGdFQUEwQztBQUVuQyxJQUFNLGFBQWEsR0FBMkIsVUFBQyxLQUFLO0lBQy9DLElBQUEsS0FBSyxHQUFxQyxLQUFLLE1BQTFDLEVBQUUsSUFBSSxHQUErQixLQUFLLEtBQXBDLEVBQUUsY0FBYyxHQUFlLEtBQUssZUFBcEIsRUFBRSxRQUFRLEdBQUssS0FBSyxTQUFWLENBQVc7SUFFeEQsSUFBTSxPQUFPLEdBQUcsZ0JBQVMsSUFBSSxDQUFFLENBQUM7SUFFaEMsSUFBTSxhQUFhLEdBQUcsSUFBQSxtQkFBVyxFQUFDO1FBQzlCLG9DQUFvQztRQUNwQyxJQUFJLE9BQU8sQ0FBQyw4QkFBOEIsQ0FBQyxFQUFFO1lBQ3pDLFFBQVEsRUFBRSxDQUFDO1NBQ2Q7SUFDTCxDQUFDLEVBQUUsQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDO0lBRWYsT0FBTyxDQUNIO1FBQ0ksdUNBQUssU0FBUyxFQUFDLHNEQUFzRDtZQUNqRSw4QkFBQyxvQkFBVSxJQUFDLE9BQU8sRUFBQyxJQUFJLEVBQUMsVUFBVSxFQUFDLE1BQU07O2dCQUM5QixLQUFLLEdBQUcsQ0FBQyxDQUNSO1lBQ1osS0FBSyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FDVDtnQkFDSSw4QkFBQyxnQkFBTSxJQUFDLElBQUksRUFBQyxPQUFPLEVBQUMsS0FBSyxFQUFDLE9BQU8sRUFBQyxPQUFPLEVBQUUsYUFBYSxtQkFFaEQsQ0FDUCxDQUNULENBQUMsQ0FBQyxDQUFDLENBQ0EsMENBQU8sQ0FDVixDQUNDO1FBQ04sdUNBQUssU0FBUyxFQUFDLE1BQU07WUFDakIsOEJBQUMscUJBQVcsSUFBQyxTQUFTO2dCQUNsQiw4QkFBQyxvQkFBVSxJQUFDLEVBQUUsRUFBRSxPQUFPLFVBQWtCO2dCQUN6Qyw4QkFBQyxnQkFBTSxhQUFDLEtBQUssRUFBQyxLQUFLLEVBQUMsSUFBSSxFQUFDLE9BQU8sRUFBQyxPQUFPLEVBQUUsT0FBTyxJQUFNLGNBQWMsR0FDaEUsY0FBYyxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsVUFBQyxFQUE4QjtvQkFBNUIsSUFBQSxRQUFRLGNBQUEsRUFBSyxhQUFhLGNBQTVCLFlBQThCLENBQUY7b0JBQ3JELE9BQU8sQ0FDSCw4QkFBQyxrQkFBUSxhQUFDLEdBQUcsRUFBRSxLQUFLLElBQU0sYUFBYSxHQUNsQyxRQUFRLENBQ0YsQ0FDZCxDQUFDO2dCQUNOLENBQUMsQ0FBQyxDQUNHLENBQ0MsQ0FDWixDQUNKLENBQ1QsQ0FBQztBQUNOLENBQUMsQ0FBQztBQTVDVyxRQUFBLGFBQWEsaUJBNEN4QiJ9

package/pages/ContentBuilder/components/Form.js

@@ -34,7 +34,6 @@ var Fab_1 = __importDefault(require("@mui/material/Fab"));
 var FormRootFields_1 = require("./FormRootFields");
 var ContentField_1 = require("../ContentField");
 var Typography_1 = __importDefault(require("@mui/material/Typography"));
-var Divider_1 = __importDefault(require("@mui/material/Divider"));
 var Box_1 = __importDefault(require("@mui/material/Box"));
 var final_form_calculate_1 = __importDefault(require("final-form-calculate"));
 // Create Decorator
@@ -55,13 +54,12 @@ var Form = function (props) {
         var handleSubmit = _a.handleSubmit, submitting = _a.submitting;
         return (react_1.default.createElement("form", { onSubmit: handleSubmit },
             react_1.default.createElement(FormRootFields_1.FormRootFields, { config: config, id: id },
-                react_1.default.createElement(Divider_1.default, null),
                 react_1.default.createElement(Box_1.default, { px: 2 },
-                    react_1.default.createElement(Typography_1.default, { variant: "h3", pt: 2 }, "Obsah"),
+                    react_1.default.createElement(Typography_1.default, { variant: "h2", pt: 6, pb: 2, style: { fontWeight: 500 } }, "Obsah"),
                     react_1.default.createElement(ContentField_1.ContentField, { name: "content", contentComponents: config.contentComponents }))),
             react_1.default.createElement(Fab_1.default, { color: "primary", type: "submit", sx: { position: "fixed", bottom: 16, right: 16 }, disabled: submitting },
                 react_1.default.createElement(Save_1.default, null))));
     }));
 };
 exports.Form = Form;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRm9ybS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWdlcy9Db250ZW50QnVpbGRlci9jb21wb25lbnRzL0Zvcm0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxnREFBMEI7QUFDMUIscURBQTRGO0FBQzVGLHdFQUE4QztBQUM5QyxrRUFBZ0Q7QUFDaEQsMERBQW9DO0FBRXBDLG1EQUFrRDtBQUNsRCxnREFBK0M7QUFDL0Msd0VBQWtEO0FBQ2xELGtFQUE0QztBQUM1QywwREFBb0M7QUFDcEMsOEVBQW1EO0FBTW5ELG1CQUFtQjtBQUNuQixJQUFNLFNBQVMsR0FBRyxJQUFBLDhCQUFlO0FBQzdCLGdCQUFnQjtBQUNoQjtJQUNJLEtBQUssRUFBRSxNQUFNO0lBQ2IsT0FBTyxFQUFFO1FBQ0wsbURBQW1EO1FBQ25ELFVBQVUsRUFBRSxVQUFDLFNBQVMsRUFBRSxTQUFjLEVBQUUsVUFBZTtZQUNuRCxPQUFPLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxJQUFJLElBQUksU0FBUyxDQUFDLEdBQUcsQ0FBQyxJQUFJLEtBQUssVUFBVSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQztRQUMxRyxDQUFDO0tBQ0o7Q0FDSixDQUNKLENBQUM7QUFDSyxJQUFNLElBQUksR0FBd0IsVUFBQyxLQUFLO0lBQ25DLElBQUEsTUFBTSxHQUF1QixLQUFLLE9BQTVCLEVBQUUsRUFBRSxHQUFtQixLQUFLLEdBQXhCLEVBQUssU0FBUyxVQUFLLEtBQUssRUFBcEMsZ0JBQTRCLENBQUYsQ0FBVztJQUUzQyxPQUFPLENBQ0gsOEJBQUMsdUJBQWMsZUFDUCxTQUFTLElBQ2IsUUFBUSxlQUNELDJCQUFhLEdBRXBCLFVBQVUsRUFBRSxDQUFDLFNBQWdCLENBQUMsS0FFN0IsVUFBQyxFQUE0QjtZQUExQixZQUFZLGtCQUFBLEVBQUUsVUFBVSxnQkFBQTtRQUFPLE9BQUEsQ0FDL0Isd0NBQU0sUUFBUSxFQUFFLFlBQVk7WUFDeEIsOEJBQUMsK0JBQWMsSUFBQyxNQUFNLEVBQUUsTUFBTSxFQUFFLEVBQUUsRUFBRSxFQUFFO2dCQUNsQyw4QkFBQyxpQkFBTyxPQUFHO2dCQUNYLDhCQUFDLGFBQUcsSUFBQyxFQUFFLEVBQUUsQ0FBQztvQkFDTiw4QkFBQyxvQkFBVSxJQUFDLE9BQU8sRUFBQyxJQUFJLEVBQUMsRUFBRSxFQUFFLENBQUMsWUFFakI7b0JBQ2IsOEJBQUMsMkJBQVksSUFBQyxJQUFJLEVBQUMsU0FBUyxFQUFDLGlCQUFpQixFQUFFLE1BQU0sQ0FBQyxpQkFBaUIsR0FBSSxDQUMxRSxDQUNPO1lBQ2pCLDhCQUFDLGFBQUcsSUFDQSxLQUFLLEVBQUMsU0FBUyxFQUNmLElBQUksRUFBQyxRQUFRLEVBQ2IsRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLE9BQU8sRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsRUFDaEQsUUFBUSxFQUFFLFVBQVU7Z0JBRXBCLDhCQUFDLGNBQVEsT0FBRyxDQUNWLENBQ0gsQ0FDVjtJQXBCa0MsQ0FvQmxDLENBQ1ksQ0FDcEIsQ0FBQztBQUNOLENBQUMsQ0FBQztBQWxDVyxRQUFBLElBQUksUUFrQ2YifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRm9ybS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWdlcy9Db250ZW50QnVpbGRlci9jb21wb25lbnRzL0Zvcm0udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxnREFBMEI7QUFDMUIscURBQTRGO0FBQzVGLHdFQUE4QztBQUM5QyxrRUFBZ0Q7QUFDaEQsMERBQW9DO0FBRXBDLG1EQUFrRDtBQUNsRCxnREFBK0M7QUFDL0Msd0VBQWtEO0FBQ2xELDBEQUFvQztBQUNwQyw4RUFBbUQ7QUFNbkQsbUJBQW1CO0FBQ25CLElBQU0sU0FBUyxHQUFHLElBQUEsOEJBQWU7QUFDN0IsZ0JBQWdCO0FBQ2hCO0lBQ0ksS0FBSyxFQUFFLE1BQU07SUFDYixPQUFPLEVBQUU7UUFDTCxtREFBbUQ7UUFDbkQsVUFBVSxFQUFFLFVBQUMsU0FBUyxFQUFFLFNBQWMsRUFBRSxVQUFlO1lBQ25ELE9BQU8sQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLElBQUksSUFBSSxTQUFTLENBQUMsR0FBRyxDQUFDLElBQUksS0FBSyxVQUFVLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDO1FBQzFHLENBQUM7S0FDSjtDQUNKLENBQ0osQ0FBQztBQUNLLElBQU0sSUFBSSxHQUF3QixVQUFDLEtBQUs7SUFDbkMsSUFBQSxNQUFNLEdBQXVCLEtBQUssT0FBNUIsRUFBRSxFQUFFLEdBQW1CLEtBQUssR0FBeEIsRUFBSyxTQUFTLFVBQUssS0FBSyxFQUFwQyxnQkFBNEIsQ0FBRixDQUFXO0lBRTNDLE9BQU8sQ0FDSCw4QkFBQyx1QkFBYyxlQUNQLFNBQVMsSUFDYixRQUFRLGVBQ0QsMkJBQWEsR0FFcEIsVUFBVSxFQUFFLENBQUMsU0FBZ0IsQ0FBQyxLQUU3QixVQUFDLEVBQTRCO1lBQTFCLFlBQVksa0JBQUEsRUFBRSxVQUFVLGdCQUFBO1FBQU8sT0FBQSxDQUMvQix3Q0FBTSxRQUFRLEVBQUUsWUFBWTtZQUN4Qiw4QkFBQywrQkFBYyxJQUFDLE1BQU0sRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLEVBQUU7Z0JBQ2xDLDhCQUFDLGFBQUcsSUFBQyxFQUFFLEVBQUUsQ0FBQztvQkFDTiw4QkFBQyxvQkFBVSxJQUFDLE9BQU8sRUFBQyxJQUFJLEVBQUMsRUFBRSxFQUFFLENBQUMsRUFBRSxFQUFFLEVBQUUsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLFVBQVUsRUFBRSxHQUFHLEVBQUUsWUFFcEQ7b0JBQ2IsOEJBQUMsMkJBQVksSUFBQyxJQUFJLEVBQUMsU0FBUyxFQUFDLGlCQUFpQixFQUFFLE1BQU0sQ0FBQyxpQkFBaUIsR0FBSSxDQUMxRSxDQUNPO1lBQ2pCLDhCQUFDLGFBQUcsSUFDQSxLQUFLLEVBQUMsU0FBUyxFQUNmLElBQUksRUFBQyxRQUFRLEVBQ2IsRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLE9BQU8sRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsRUFDaEQsUUFBUSxFQUFFLFVBQVU7Z0JBRXBCLDhCQUFDLGNBQVEsT0FBRyxDQUNWLENBQ0gsQ0FDVjtJQW5Ca0MsQ0FtQmxDLENBQ1ksQ0FDcEIsQ0FBQztBQUNOLENBQUMsQ0FBQztBQWpDVyxRQUFBLElBQUksUUFpQ2YifQ==

package/pages/ContentBuilder/components/FormContent.js

@@ -17,7 +17,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FormContent = void 0;
 var react_1 = __importDefault(require("react"));
 var react_final_form_1 = require("react-final-form");
-var Box_1 = __importDefault(require("@mui/material/Box"));
 var Warning_1 = __importDefault(require("@mui/icons-material/Warning"));
 var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var getSection = function (sections, type) {
@@ -33,9 +32,9 @@ var FormContent = function (props) {
                     children: s.getConfig().label,
                 }); }) }) }));
     }
-    return (react_1.default.createElement(Box_1.default, { display: "flex", alignItems: "center", justifyContent: "center", p: 2 },
+    return (react_1.default.createElement("div", { className: "flex align-center justify-center p-4" },
         react_1.default.createElement(Warning_1.default, { color: "error" }),
         react_1.default.createElement(Typography_1.default, { color: "error", ml: 2, fontWeight: "bold" }, "Nepodporovan\u00E1 sekce")));
 };
 exports.FormContent = FormContent;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRm9ybUNvbnRlbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvcGFnZXMvQ29udGVudEJ1aWxkZXIvY29tcG9uZW50cy9Gb3JtQ29udGVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxnREFBMEI7QUFDMUIscURBQTRDO0FBQzVDLDBEQUFvQztBQUNwQyx3RUFBc0Q7QUFDdEQsd0VBQWtEO0FBT2xELElBQU0sVUFBVSxHQUFHLFVBQUMsUUFBaUMsRUFBRSxJQUFZO0lBQy9ELE9BQU8sUUFBUSxDQUFDLElBQUksQ0FBQyxVQUFDLENBQUMsSUFBSyxPQUFBLENBQUMsQ0FBQyxTQUFTLEVBQUUsQ0FBQyxJQUFJLEtBQUssSUFBSSxFQUEzQixDQUEyQixDQUFDLENBQUM7QUFDN0QsQ0FBQyxDQUFDO0FBRUssSUFBTSxXQUFXLEdBQStCLFVBQUMsS0FBSztJQUNqRCxJQUFBLGlCQUFpQixHQUE0QixLQUFLLGtCQUFqQyxFQUFFLFFBQVEsR0FBa0IsS0FBSyxTQUF2QixFQUFFLElBQUksR0FBWSxLQUFLLEtBQWpCLEVBQUUsS0FBSyxHQUFLLEtBQUssTUFBVixDQUFXO0lBRW5ELElBQUEsS0FBSyxHQUFLLElBQUEsMkJBQVEsRUFBQyxVQUFHLElBQUksVUFBTyxDQUFDLE1BQTdCLENBQThCO0lBRTNDLElBQU0sY0FBYyxHQUFHLFVBQVUsQ0FBQyxpQkFBaUIsRUFBRSxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7SUFFbEUsSUFBSSxjQUFjLEVBQUU7UUFDaEIsT0FBTyxDQUNILDhCQUFDLGNBQWMsSUFDWCxJQUFJLEVBQUUsVUFBRyxJQUFJLGFBQVUsRUFDdkIsUUFBUSxFQUFFLFFBQVEsRUFDbEIsS0FBSyxFQUFFLEtBQUssRUFDWixjQUFjLHdCQUNQLEtBQUssS0FDUixPQUFPLEVBQUUsaUJBQWlCLENBQUMsR0FBRyxDQUFDLFVBQUMsQ0FBQyxJQUFLLE9BQUEsQ0FBQztvQkFDbkMsS0FBSyxFQUFFLENBQUMsQ0FBQyxTQUFTLEVBQUUsQ0FBQyxJQUFJO29CQUN6QixRQUFRLEVBQUUsQ0FBQyxDQUFDLFNBQVMsRUFBRSxDQUFDLEtBQUs7aUJBQ2hDLENBQUMsRUFIb0MsQ0FHcEMsQ0FBQyxNQUVULENBQ0wsQ0FBQztLQUNMO0lBRUQsT0FBTyxDQUNILDhCQUFDLGFBQUcsSUFBQyxPQUFPLEVBQUMsTUFBTSxFQUFDLFVBQVUsRUFBQyxRQUFRLEVBQUMsY0FBYyxFQUFDLFFBQVEsRUFBQyxDQUFDLEVBQUUsQ0FBQztRQUNoRSw4QkFBQyxpQkFBVyxJQUFDLEtBQUssRUFBQyxPQUFPLEdBQUc7UUFDN0IsOEJBQUMsb0JBQVUsSUFBQyxLQUFLLEVBQUMsT0FBTyxFQUFDLEVBQUUsRUFBRSxDQUFDLEVBQUUsVUFBVSxFQUFDLE1BQU0sK0JBRXJDLENBQ1gsQ0FDVCxDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBaENXLFFBQUEsV0FBVyxlQWdDdEIifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRm9ybUNvbnRlbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvcGFnZXMvQ29udGVudEJ1aWxkZXIvY29tcG9uZW50cy9Gb3JtQ29udGVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQSxnREFBMEI7QUFDMUIscURBQTRDO0FBQzVDLHdFQUFzRDtBQUN0RCx3RUFBa0Q7QUFPbEQsSUFBTSxVQUFVLEdBQUcsVUFBQyxRQUFpQyxFQUFFLElBQVk7SUFDL0QsT0FBTyxRQUFRLENBQUMsSUFBSSxDQUFDLFVBQUMsQ0FBQyxJQUFLLE9BQUEsQ0FBQyxDQUFDLFNBQVMsRUFBRSxDQUFDLElBQUksS0FBSyxJQUFJLEVBQTNCLENBQTJCLENBQUMsQ0FBQztBQUM3RCxDQUFDLENBQUM7QUFFSyxJQUFNLFdBQVcsR0FBK0IsVUFBQyxLQUFLO0lBQ2pELElBQUEsaUJBQWlCLEdBQTRCLEtBQUssa0JBQWpDLEVBQUUsUUFBUSxHQUFrQixLQUFLLFNBQXZCLEVBQUUsSUFBSSxHQUFZLEtBQUssS0FBakIsRUFBRSxLQUFLLEdBQUssS0FBSyxNQUFWLENBQVc7SUFFbkQsSUFBQSxLQUFLLEdBQUssSUFBQSwyQkFBUSxFQUFDLFVBQUcsSUFBSSxVQUFPLENBQUMsTUFBN0IsQ0FBOEI7SUFFM0MsSUFBTSxjQUFjLEdBQUcsVUFBVSxDQUFDLGlCQUFpQixFQUFFLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUVsRSxJQUFJLGNBQWMsRUFBRTtRQUNoQixPQUFPLENBQ0gsOEJBQUMsY0FBYyxJQUNYLElBQUksRUFBRSxVQUFHLElBQUksYUFBVSxFQUN2QixRQUFRLEVBQUUsUUFBUSxFQUNsQixLQUFLLEVBQUUsS0FBSyxFQUNaLGNBQWMsd0JBQ1AsS0FBSyxLQUNSLE9BQU8sRUFBRSxpQkFBaUIsQ0FBQyxHQUFHLENBQUMsVUFBQyxDQUFDLElBQUssT0FBQSxDQUFDO29CQUNuQyxLQUFLLEVBQUUsQ0FBQyxDQUFDLFNBQVMsRUFBRSxDQUFDLElBQUk7b0JBQ3pCLFFBQVEsRUFBRSxDQUFDLENBQUMsU0FBUyxFQUFFLENBQUMsS0FBSztpQkFDaEMsQ0FBQyxFQUhvQyxDQUdwQyxDQUFDLE1BRVQsQ0FDTCxDQUFDO0tBQ0w7SUFFRCxPQUFPLENBQ0gsdUNBQUssU0FBUyxFQUFDLHNDQUFzQztRQUNqRCw4QkFBQyxpQkFBVyxJQUFDLEtBQUssRUFBQyxPQUFPLEdBQUc7UUFDN0IsOEJBQUMsb0JBQVUsSUFBQyxLQUFLLEVBQUMsT0FBTyxFQUFDLEVBQUUsRUFBRSxDQUFDLEVBQUUsVUFBVSxFQUFDLE1BQU0sK0JBRXJDLENBQ1gsQ0FDVCxDQUFDO0FBQ04sQ0FBQyxDQUFDO0FBaENXLFFBQUEsV0FBVyxlQWdDdEIifQ==