@codebit-programando-solucoes/codebit-web-antd 1.1.30 → 1.1.33

package/dist/components/CssTokenBridge.d.ts

@@ -139,4 +139,10 @@ import { FC } from 'react';
  *     }
  *     ```;
  */
-export const CssTokenBridge: FC;
+export interface CssTokenBridgeProps {
+    /** Optional ID of the container element to receive the CSS variables. */
+    containerId?: string;
+}
+
+/** CssTokenBridge component definition. */
+export const CssTokenBridge: FC<CssTokenBridgeProps>;

package/dist/contexts/CodebitConfigContext.d.ts

@@ -1,7 +1,18 @@
 import * as React from 'react';
-import type { MenuProps } from 'antd';
 import type { ItemType } from 'antd/es/menu/interface';
 
+/** The configuration context for Codebit application, providing access to session and UI settings. */
+export const CodebitConfigContext: React.Context<CodebitConfigContextType | null>;
+
+/**
+ * Provider component for Codebit configuration and session management.
+ *
+ * @param props - Configuration provider properties.
+ */
+export function CodebitConfigProvider(
+    props: CodebitConfigProviderProps,
+): React.ReactElement;
+
 /** Menu item configuration */
 export type MenuItem = ItemType & {
     /** Array of roles that can access this item */
@@ -20,9 +31,6 @@ export interface LoggedUser {
     roles?: string[];
 }
 
-/** The configuration context for Codebit application, providing access to session and UI settings. */
-export const CodebitConfigContext: React.Context<CodebitConfigContextType | null>;
-
 /** Context type definition for Codebit configuration. */
 export interface CodebitConfigContextType {
     /**
@@ -49,8 +57,8 @@ export interface CodebitConfigContextType {
     secondarySidebar?: (user?: LoggedUser) => React.ReactNode | null;
     /** Width of the secondary sidebar in pixels (default: 280). */
     secondarySidebarWidth?: number;
-    /** Array of menu items displayed above the logout button in the bottom menu. */
-    bottomMenuItems?: MenuProps['items'];
+    /** Function that returns menu items configuration for items displayed above the logout button in the bottom menu. */
+    bottomMenuItems?: (user?: LoggedUser) => MenuItem[];
     /**
      * Function invoked when a menu item is clicked. Receives the item's key and **must return a boolean**.
      *
@@ -60,15 +68,6 @@ export interface CodebitConfigContextType {
     onMenuClick?: (key: string) => boolean;
 }
 
-/**
- * Provider component for Codebit configuration and session management.
- *
- * @param props - Configuration provider properties.
- */
-export function CodebitConfigProvider(
-    props: CodebitConfigProviderProps,
-): React.ReactElement;
-
 /** Properties for the CodebitConfigProvider component. */
 export interface CodebitConfigProviderProps {
     /** Child components that will have access to the configuration context. */
@@ -83,8 +82,8 @@ export interface CodebitConfigProviderProps {
     secondarySidebar?: (user: LoggedUser) => React.ReactNode | null;
     /** Width of the secondary sidebar in pixels (default: 280). */
     secondarySidebarWidth?: number;
-    /** **New**: Array of bottom‑menu items (Ant Design `MenuItemType`). */
-    bottomMenuItems?: ItemType[];
+    /** Function that returns bottom‑menu items. */
+    bottomMenuItems?: (user?: LoggedUser) => MenuItem[];
     /** Function to handle user logout. */
     doLogout: () => Promise<void>;
     /** Function to check login status and return user data. */

package/dist/contexts/CodebitThemeContext.d.ts

@@ -23,4 +23,8 @@ type CodebitThemeProviderProps = {
     children: React.ReactNode;
     /** Whether to persist theme preference in localStorage (default: `true`) */
     storeThemeInLocalStorage?: boolean;
+    /** ID of the root container element where theme classes are applied (default: `'root'`) */
+    containerId?: string;
+    /** Optional explicit theme override. When set, the provider uses this value instead of internal detection. */
+    forcedTheme?: 'dark' | 'light' | null;
 } & ConfigProviderProps;

package/dist/index.cjs

@@ -329,7 +329,7 @@ var __webpack_exports__ = {};
     const codebit_web_namespaceObject = require("@codebit-programando-solucoes/codebit-web");
     const logger = new codebit_web_namespaceObject.Logger('CodebitConfigContext');
     const CodebitConfigContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
-    function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems = [], doLogout, checkLogin, onMenuClick }) {
+    function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, doLogout, checkLogin, onMenuClick }) {
         const [isLogged, setIsLogged] = (0, external_react_.useState)(null);
         const [user, setUser] = (0, external_react_.useState)(null);
         const logout = async ()=>{
@@ -398,7 +398,7 @@ var __webpack_exports__ = {};
         showVersion: external_prop_types_default().func,
         secondarySidebar: external_prop_types_default().func,
         secondarySidebarWidth: external_prop_types_default().number,
-        bottomMenuItems: external_prop_types_default().array,
+        bottomMenuItems: external_prop_types_default().func,
         doLogout: external_prop_types_default().func.isRequired,
         checkLogin: external_prop_types_default().func.isRequired,
         onMenuClick: external_prop_types_default().func
@@ -797,10 +797,10 @@ var __webpack_exports__ = {};
         tableContainer: null,
         actions: null
     };
-    const CssTokenBridge = ()=>{
+    const CssTokenBridge = ({ containerId })=>{
         const { token } = external_antd_namespaceObject.theme.useToken();
         (0, external_react_.useLayoutEffect)(()=>{
-            const root = document.documentElement;
+            const root = containerId ? document.getElementById(containerId) ?? document.documentElement : document.documentElement;
             root.style.setProperty('--antd-color-bg-base', token['colorBgBase']);
             root.style.setProperty('--antd-color-bg-container', token['colorBgContainer']);
             root.style.setProperty('--antd-color-bg-elevated', token['colorBgElevated']);
@@ -888,10 +888,14 @@ var __webpack_exports__ = {};
             root.style.setProperty('--antd-border-radius', `${token['borderRadius']}px`);
             root.style.setProperty('--antd-border-radius-lg', `${token['borderRadiusLG']}px`);
         }, [
+            containerId,
             token
         ]);
         return null;
     };
+    CssTokenBridge.propTypes = {
+        containerId: external_prop_types_default().string
+    };
     const TableContainer_module = {
         tableContainer: "tableContainer-EhNwOm"
     };
@@ -980,9 +984,10 @@ var __webpack_exports__ = {};
         ...external_antd_namespaceObject.Card.propTypes
     };
     const CodebitThemeContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
-    const CodebitThemeProvider = ({ children, storeThemeInLocalStorage = true, ...props })=>{
+    const CodebitThemeProvider = ({ children, storeThemeInLocalStorage = true, containerId = 'root', forcedTheme = null, ...props })=>{
         const hasLoaded = (0, external_react_.useRef)(false);
         const [isDarkMode, setIsDarkMode] = (0, external_react_.useState)(()=>{
+            if (forcedTheme) return 'dark' === forcedTheme;
             try {
                 if (storeThemeInLocalStorage) {
                     const savedTheme = localStorage?.getItem('theme');
@@ -993,27 +998,39 @@ var __webpack_exports__ = {};
                 hasLoaded.current = true;
             }
         });
+        (0, external_react_.useEffect)(()=>{
+            if (forcedTheme) {
+                const mode = 'dark' === forcedTheme;
+                setIsDarkMode(mode);
+            }
+        }, [
+            forcedTheme
+        ]);
         const toggleTheme = ()=>{
             setIsDarkMode((prev)=>!prev);
         };
         (0, external_react_.useEffect)(()=>{
-            const rootElement = document.getElementById('root');
+            const target = document.getElementById(containerId);
+            if (!target) return;
             if (isDarkMode) {
                 document.documentElement.classList.add('dark-theme');
-                rootElement.classList.add('dark-theme');
+                target.classList.add('dark-theme');
             } else {
                 document.documentElement.classList.remove('dark-theme');
-                rootElement.classList.remove('dark-theme');
+                target.classList.remove('dark-theme');
             }
             document.documentElement.style.setProperty('--color-primary', isDarkMode ? '#589C75' : '#29D266');
         }, [
-            isDarkMode
+            isDarkMode,
+            containerId
         ]);
         (0, external_react_.useEffect)(()=>{
             if (hasLoaded.current && storeThemeInLocalStorage) localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
+            if (hasLoaded.current && storeThemeInLocalStorage && !forcedTheme) localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
         }, [
             isDarkMode,
-            storeThemeInLocalStorage
+            storeThemeInLocalStorage,
+            forcedTheme
         ]);
         const themeContextValue = (0, external_react_.useMemo)(()=>({
                 isDarkMode,
@@ -1056,7 +1073,9 @@ var __webpack_exports__ = {};
                 },
                 ...props,
                 children: [
-                    /*#__PURE__*/ (0, jsx_runtime.jsx)(CssTokenBridge, {}),
+                    /*#__PURE__*/ (0, jsx_runtime.jsx)(CssTokenBridge, {
+                        containerId: containerId
+                    }),
                     children
                 ]
             })
@@ -1064,7 +1083,13 @@ var __webpack_exports__ = {};
     };
     CodebitThemeProvider.propTypes = {
         children: external_prop_types_default().node.isRequired,
-        storeThemeInLocalStorage: external_prop_types_default().bool
+        storeThemeInLocalStorage: external_prop_types_default().bool,
+        containerId: external_prop_types_default().string,
+        forcedTheme: external_prop_types_default().oneOf([
+            'dark',
+            'light',
+            null
+        ])
     };
     const LoggedMainContainer_module = {
         layout: "layout-mL5o6I",
@@ -1100,12 +1125,12 @@ var __webpack_exports__ = {};
         const navigate = (0, external_react_router_namespaceObject.useNavigate)();
         const location = (0, external_react_router_namespaceObject.useLocation)();
         if (!configCodebit || !configTheme) throw new Error('LoggedContainer must be used within CodebitConfigProvider and CodebitThemeContext');
-        const { logout, user, menuItems, version, showVersion, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems = [], onMenuClick } = configCodebit;
+        const { logout, user, menuItems, version, showVersion, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, onMenuClick } = configCodebit;
         const { isDarkMode } = configTheme;
         const theme = isDarkMode ? 'dark' : 'light';
         const allMenuItems = (0, external_react_.useMemo)(()=>[
                 ...menuItems(user),
-                ...bottomMenuItems
+                ...bottomMenuItems?.(user) ?? []
             ], [
             menuItems,
             user,
@@ -1119,8 +1144,19 @@ var __webpack_exports__ = {};
             menuItems,
             user
         ]);
+        const filteredBottomMenuItems = (0, external_react_.useMemo)(()=>{
+            if (!bottomMenuItems) return [];
+            return bottomMenuItems(user).filter((item)=>{
+                if (!item.roles) return true;
+                if (!user?.roles) return false;
+                return item.roles.some((role)=>user.roles.includes(role));
+            });
+        }, [
+            bottomMenuItems,
+            user
+        ]);
         const memoizedBottomMenuItems = (0, external_react_.useMemo)(()=>[
-                ...bottomMenuItems,
+                ...filteredBottomMenuItems,
                 {
                     key: MENU_KEY_APP_LOGOUT,
                     icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.LogoutOutlined, {}),
@@ -1128,7 +1164,7 @@ var __webpack_exports__ = {};
                     danger: true
                 }
             ], [
-            bottomMenuItems,
+            filteredBottomMenuItems,
             t
         ]);
         const [selectedKeys, setSelectedKeys] = (0, external_react_.useState)('');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codebit-programando-solucoes/codebit-web-antd",
-  "version": "1.1.30",
+  "version": "1.1.33",
   "main": "./dist/index.cjs",
   "type": "module",
   "types": "./src/index.d.ts",