@uxf/cms 11.19.3 → 11.21.0

package/forms/components/wysiwyg-input/wysiwyg-input.js

@@ -24,8 +24,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.WysiwygInput = void 0;
+const use_input_focus_1 = require("@uxf/core-react/hooks/use-input-focus");
 const classes_1 = require("@uxf/core/constants/classes");
-const useInputFocus_1 = require("@uxf/core/hooks/useInputFocus");
 const cx_1 = require("@uxf/core/utils/cx");
 const file_1 = require("@uxf/core/utils/file");
 const form_component_1 = require("@uxf/ui/form-component");
@@ -55,7 +55,7 @@ function WysiwygInput(props) {
     const generatedId = (0, react_1.useId)();
     const id = (_b = props.id) !== null && _b !== void 0 ? _b : generatedId;
     const innerRef = (0, react_1.useRef)(null);
-    const input = (0, useInputFocus_1.useInputFocus)(innerRef, props.onBlur, props.onFocus);
+    const input = (0, use_input_focus_1.useInputFocus)(innerRef, props.onBlur, props.onFocus);
     const isInvalid = !!fieldState.error;
     const errorId = isInvalid ? `${props.id}--error-message` : undefined;
     const rootClassName = (0, cx_1.cx)("uxf-text-input", ((_c = props.isFocused) !== null && _c !== void 0 ? _c : input.focused) && classes_1.CLASSES.IS_FOCUSED, props.isDisabled && classes_1.CLASSES.IS_DISABLED, isInvalid && classes_1.CLASSES.IS_INVALID, props.isReadOnly && classes_1.CLASSES.IS_READONLY, props.isRequired && classes_1.CLASSES.IS_REQUIRED, props.className);

package/lib/layout/layout.js

@@ -24,23 +24,25 @@ const Layout = (props) => {
         react_1.default.createElement("div", { className: "uxf-cms-layout" },
             react_1.default.createElement("div", { className: "uxf-cms-layout__wrapper" },
                 react_1.default.createElement(sidebar_1.Sidebar, { menuConfiguration: props.menuConfiguration, Logo: props.Logo }),
-                react_1.default.createElement("main", { className: `uxf-cms-layout__main ${(_a = props.mainClassName) !== null && _a !== void 0 ? _a : ""}`, style: { "--drawer-width": (0, rem_1.rem)(styles_1.drawerWidth) } }, props.loading ? (react_1.default.createElement("div", { className: "uxf-cms-layout__loading" },
-                    react_1.default.createElement("div", { className: "uxf-cms-layout__loading-inner" },
-                        react_1.default.createElement(loader_1.Loader, null),
-                        react_1.default.createElement("p", { className: "uxf-cms-layout__loading-text" }, "Na\u010D\u00EDt\u00E1m\u2026")))) : (react_1.default.createElement(react_1.default.Fragment, null,
-                    props.CustomHeader ? (props.CustomHeader) : (react_1.default.createElement("div", { className: `${props.Header ? "uxf-cms-layout__header" : ""} ${props.stickyHeader ? "uxf-cms-layout__header--sticky" : ""}` },
-                        props.ToolbarRight && (react_1.default.createElement("div", { className: "uxf-cms-layout__toolbar" }, props.ToolbarRight)),
-                        props.MessageBar,
-                        react_1.default.createElement(layout_container_1.LayoutContainer, { type: (_b = props.headerContainerType) !== null && _b !== void 0 ? _b : props.containerType, className: "uxf-cms-layout__container--basic" },
-                            react_1.default.createElement("div", { className: "uxf-cms-layout__avatar-title-wrapper" },
-                                props.Avatar,
-                                react_1.default.createElement("div", { className: "uxf-cms-layout__breadcrumbs-title-wrapper" },
-                                    props.breadcrumbs && react_1.default.createElement(breadcrumbs_1.Breadcrumbs, { items: props.breadcrumbs }),
-                                    react_1.default.createElement("div", { className: "uxf-cms-layout__title-wrapper" },
-                                        react_1.default.createElement("h1", { className: "uxf-cms-layout__title" }, props.title),
-                                        props.TitleRightContainer),
-                                    props.subtitle,
-                                    props.Header))))),
-                    react_1.default.createElement(layout_container_1.LayoutContainer, { type: props.containerType }, props.children))))))));
+                react_1.default.createElement("main", { className: `uxf-cms-layout__main ${(_a = props.mainClassName) !== null && _a !== void 0 ? _a : ""}`, style: { "--drawer-width": (0, rem_1.rem)(styles_1.drawerWidth) } },
+                    props.loading ? (react_1.default.createElement("div", { className: "uxf-cms-layout__loading" },
+                        react_1.default.createElement("div", { className: "uxf-cms-layout__loading-inner" },
+                            react_1.default.createElement(loader_1.Loader, null),
+                            react_1.default.createElement("p", { className: "uxf-cms-layout__loading-text" }, "Na\u010D\u00EDt\u00E1m\u2026")))) : (react_1.default.createElement(react_1.default.Fragment, null,
+                        props.CustomHeader ? (props.CustomHeader) : (react_1.default.createElement("div", { className: `${props.Header ? "uxf-cms-layout__header" : ""} ${props.stickyHeader ? "uxf-cms-layout__header--sticky" : ""}` },
+                            props.ToolbarRight && (react_1.default.createElement("div", { className: "uxf-cms-layout__toolbar" }, props.ToolbarRight)),
+                            props.MessageBar,
+                            react_1.default.createElement(layout_container_1.LayoutContainer, { type: (_b = props.headerContainerType) !== null && _b !== void 0 ? _b : props.containerType, className: "uxf-cms-layout__container--basic" },
+                                react_1.default.createElement("div", { className: "uxf-cms-layout__avatar-title-wrapper" },
+                                    props.Avatar,
+                                    react_1.default.createElement("div", { className: "uxf-cms-layout__breadcrumbs-title-wrapper" },
+                                        props.breadcrumbs && react_1.default.createElement(breadcrumbs_1.Breadcrumbs, { items: props.breadcrumbs }),
+                                        react_1.default.createElement("div", { className: "uxf-cms-layout__title-wrapper" },
+                                            react_1.default.createElement("h1", { className: "uxf-cms-layout__title" }, props.title),
+                                            props.TitleRightContainer),
+                                        props.subtitle,
+                                        props.Header))))),
+                        react_1.default.createElement(layout_container_1.LayoutContainer, { type: props.containerType }, props.children))),
+                    props.FooterBar)))));
 };
 exports.Layout = Layout;

package/lib/layout/types.d.ts

@@ -18,6 +18,7 @@ export type LayoutProps = SidebarProps & {
     MessageBar?: ReactNode;
     subtitle?: ReactNode;
     title?: string;
+    FooterBar?: ReactNode;
     ToolbarRight?: ReactNode;
     TitleRightContainer?: ReactNode;
     stickyHeader?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/cms",
-  "version": "11.19.3",
+  "version": "11.21.0",
   "description": "UXF Cms",
   "author": "UXFans <dev@uxf.cz>",
   "homepage": "https://gitlab.com/uxf-npm/cms#readme",
@@ -30,12 +30,13 @@
     "@dnd-kit/utilities": "3.2.2",
     "@floating-ui/react": "0.26.9",
     "@redux-devtools/extension": "3.3.0",
-    "@uxf/core": "11.19.0",
-    "@uxf/data-grid": "11.19.3",
-    "@uxf/form": "11.19.2",
+    "@uxf/core": "11.21.0",
+    "@uxf/core-react": "11.21.0",
+    "@uxf/data-grid": "11.21.0",
+    "@uxf/form": "11.21.0",
     "@uxf/router": "11.11.3",
-    "@uxf/ui": "11.19.0",
-    "@uxf/wysiwyg": "11.19.0",
+    "@uxf/ui": "11.21.0",
+    "@uxf/wysiwyg": "11.21.0",
     "axios": "1.6.7",
     "axios-hooks": "5.0.2",
     "es6-error": "4.1.1",

package/pages/content-builder/content-header.js

@@ -24,7 +24,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContentHeader = void 0;
-const useClickableProps_1 = require("@uxf/core/hooks/useClickableProps");
+const use_clickable_props_1 = require("@uxf/core-react/hooks/use-clickable-props");
 const button_1 = require("@uxf/ui/button");
 const datetime_picker_input_1 = require("@uxf/ui/datetime-picker-input");
 const icon_1 = require("@uxf/ui/icon");
@@ -45,7 +45,7 @@ const ContentHeader = (props) => {
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [props.onRemove]);
-    const clickableProps = (0, useClickableProps_1.useClickableProps)({
+    const clickableProps = (0, use_clickable_props_1.useClickableProps)({
         className: "flex w-full cursor-pointer flex-row items-center justify-between p-4",
         onClick: toggleVisibility,
     });

package/pages/grid-page/grid-page.js

@@ -72,7 +72,6 @@ const GridPageComponent = (props) => {
     const { data, isLoading, error, onReload } = (0, use_data_grid_fetching_1.useDataGridFetching)({
         loader: (_c = props.loader) !== null && _c !== void 0 ? _c : universalLoader,
         schema: props.gridSchema,
-        gridName: props.entityAlias,
         state,
     });
     const actionsBag = (0, react_1.useMemo)(() => ({

package/ui/styles/layout.css

@@ -2,13 +2,10 @@
     display: flex;
 
     &__wrapper {
+        background-color: theme("colors.gray.100");
         display: flex;
         width: 100%;
 
-        :root .light & {
-            background-color: theme("colors.gray.100");
-        }
-
         :root .dark & {
             background-color: theme("colors.gray.900");
             color: theme("colors.darkHigh");
@@ -18,6 +15,8 @@
     &__main {
         --drawer-width: 264px;
 
+        display: flex;
+        flex-direction: column;
         min-height: 100vh;
         padding-bottom: theme("spacing.16");
         width: 100%;
@@ -46,24 +45,19 @@
     }
 
     &__header {
-        :root .light & {
-            background-color: theme("colors.white");
-        }
+        background-color: theme("colors.white");
 
         :root .dark & {
             background-color: theme("colors.gray.950");
         }
 
         &--sticky {
+            background-color: theme("colors.white");
             box-shadow: theme("boxShadow.md");
             position: sticky;
             top: 0;
             z-index: 10;
 
-            :root .light & {
-                background-color: theme("colors.white");
-            }
-
             :root .dark & {
                 background-color: theme("colors.gray.950");
             }
@@ -73,21 +67,19 @@
     &__toolbar {
         align-items: center;
         background-color: theme("colors.sidebar.background");
+        color: theme("colors.darkMedium");
         display: flex;
         height: theme("spacing.12");
         justify-content: flex-end;
         padding: 0 theme("spacing.6");
 
-        :root .light & {
-            color: theme("colors.darkMedium");
-        }
-
         :root .dark & {
             color: theme("colors.lightMedium");
         }
     }
 
     &__container {
+        flex-grow: 1;
         margin: 0 auto;
         padding: 0 theme("spacing.4");
 

package/ui/styles/login-layout.css

@@ -1,15 +1,12 @@
 .uxf-cms-login-layout {
     align-items: center;
+    background-color: theme("colors.gray.100");
     display: flex;
     flex-direction: column;
     justify-content: center;
     min-height: 100vh;
     padding: theme("spacing.4");
 
-    :root .light & {
-        background-color: theme("colors.gray.100");
-    }
-
     :root .dark & {
         background-color: theme("colors.gray.900");
         color: theme("colors.darkHigh");
@@ -28,12 +25,9 @@
     }
 
     &__subtitle {
+        color: theme("colors.lightMedium");
         margin-top: theme("spacing.2");
 
-        :root .light & {
-            color: theme("colors.lightMedium");
-        }
-
         :root .dark & {
             color: theme("colors.darkMedium");
         }