analytica-frontend-lib 1.1.93 → 1.1.94

package/dist/index.d.mts

@@ -56,6 +56,10 @@ export { MultipleChoiceList } from './MultipleChoice/index.mjs';
 export { default as IconRender } from './IconRender/index.mjs';
 export { DeviceType, getDeviceType, useMobile } from './hooks/useMobile/index.mjs';
 export { useTheme } from './hooks/useTheme/index.mjs';
+export { BreadcrumbMenu, BreadcrumbMenuProps } from './BreadcrumbMenu/index.mjs';
+export { BreadcrumbBuilderConfig, BreadcrumbLevel, BreadcrumbLevelStatic, BreadcrumbLevelWithData, useBreadcrumbBuilder } from './BreadcrumbMenu/useBreadcrumbBuilder/index.mjs';
+export { UrlParamsConfig, useUrlParams } from './BreadcrumbMenu/useUrlParams/index.mjs';
+export { BreadcrumbItem, useBreadcrumb } from './BreadcrumbMenu/breadcrumbStore/index.mjs';
 import * as zustand_middleware from 'zustand/middleware';
 export { cn, getSubjectColorWithOpacity, syncDropdownState } from './utils/index.mjs';
 import 'clsx';

package/dist/index.d.ts

@@ -56,6 +56,10 @@ export { MultipleChoiceList } from './MultipleChoice/index.js';
 export { default as IconRender } from './IconRender/index.js';
 export { DeviceType, getDeviceType, useMobile } from './hooks/useMobile/index.js';
 export { useTheme } from './hooks/useTheme/index.js';
+export { BreadcrumbMenu, BreadcrumbMenuProps } from './BreadcrumbMenu/index.js';
+export { BreadcrumbBuilderConfig, BreadcrumbLevel, BreadcrumbLevelStatic, BreadcrumbLevelWithData, useBreadcrumbBuilder } from './BreadcrumbMenu/useBreadcrumbBuilder/index.js';
+export { UrlParamsConfig, useUrlParams } from './BreadcrumbMenu/useUrlParams/index.js';
+export { BreadcrumbItem, useBreadcrumb } from './BreadcrumbMenu/breadcrumbStore/index.js';
 import * as zustand_middleware from 'zustand/middleware';
 export { cn, getSubjectColorWithOpacity, syncDropdownState } from './utils/index.js';
 import 'clsx';

package/dist/index.js

@@ -36,6 +36,7 @@ __export(src_exports, {
   AlternativesList: () => AlternativesList,
   AuthProvider: () => AuthProvider,
   Badge: () => Badge_default,
+  BreadcrumbMenu: () => BreadcrumbMenu,
   Button: () => Button_default,
   Calendar: () => Calendar_default,
   CardAccordation: () => CardAccordation,
@@ -161,6 +162,8 @@ __export(src_exports, {
   useAuth: () => useAuth,
   useAuthGuard: () => useAuthGuard,
   useAuthStore: () => useAuthStore,
+  useBreadcrumb: () => useBreadcrumb,
+  useBreadcrumbBuilder: () => useBreadcrumbBuilder,
   useInstitutionId: () => useInstitutionId,
   useMobile: () => useMobile,
   useQuizStore: () => useQuizStore,
@@ -169,6 +172,7 @@ __export(src_exports, {
   useThemeStore: () => useThemeStore,
   useToastStore: () => ToastStore_default,
   useUrlAuthentication: () => useUrlAuthentication,
+  useUrlParams: () => useUrlParams,
   withAuth: () => withAuth
 });
 module.exports = __toCommonJS(src_exports);
@@ -12520,16 +12524,234 @@ var QuizListResultByMateria = ({
   ] });
 };
 
-// src/hooks/useAppInitialization.ts
+// src/components/BreadcrumbMenu/BreadcrumbMenu.tsx
+var import_react_router_dom3 = require("react-router-dom");
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var BreadcrumbMenu = ({
+  breadcrumbs,
+  onBreadcrumbClick,
+  className = "!px-0 py-4 flex-wrap w-full"
+}) => {
+  const navigate = (0, import_react_router_dom3.useNavigate)();
+  const handleClick = (breadcrumb, index) => {
+    if (onBreadcrumbClick) {
+      onBreadcrumbClick(breadcrumb, index);
+    }
+    navigate(breadcrumb.url);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    Menu,
+    {
+      value: `breadcrumb-${breadcrumbs.length - 1}`,
+      defaultValue: "breadcrumb-0",
+      variant: "breadcrumb",
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(MenuContent, { className: "w-full flex flex-row flex-wrap gap-2 !px-0", children: breadcrumbs.map((breadcrumb, index) => {
+        const isLast = index === breadcrumbs.length - 1;
+        const hasSeparator = !isLast;
+        return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+          MenuItem,
+          {
+            variant: "breadcrumb",
+            value: `breadcrumb-${index}`,
+            className: "!p-0 whitespace-nowrap",
+            onClick: () => handleClick(breadcrumb, index),
+            separator: hasSeparator,
+            children: breadcrumb.name
+          },
+          breadcrumb.id
+        );
+      }) })
+    }
+  );
+};
+
+// src/components/BreadcrumbMenu/useBreadcrumbBuilder.ts
+var import_react38 = require("react");
+
+// src/components/BreadcrumbMenu/breadcrumbStore.ts
+var import_zustand10 = require("zustand");
+var useBreadcrumbStore = (0, import_zustand10.create)((set, get) => ({
+  breadcrumbs: {},
+  setBreadcrumbs: (namespace, items) => {
+    set((state) => ({
+      breadcrumbs: {
+        ...state.breadcrumbs,
+        [namespace]: items
+      }
+    }));
+  },
+  addBreadcrumb: (namespace, item) => {
+    set((state) => {
+      const current = state.breadcrumbs[namespace] || [];
+      return {
+        breadcrumbs: {
+          ...state.breadcrumbs,
+          [namespace]: [...current, item]
+        }
+      };
+    });
+  },
+  updateBreadcrumb: (namespace, itemId, updates) => {
+    set((state) => {
+      const current = state.breadcrumbs[namespace] || [];
+      return {
+        breadcrumbs: {
+          ...state.breadcrumbs,
+          [namespace]: current.map(
+            (item) => item.id === itemId ? { ...item, ...updates } : item
+          )
+        }
+      };
+    });
+  },
+  removeBreadcrumbFrom: (namespace, itemId) => {
+    set((state) => {
+      const current = state.breadcrumbs[namespace] || [];
+      const index = current.findIndex((item) => item.id === itemId);
+      if (index === -1) return state;
+      return {
+        breadcrumbs: {
+          ...state.breadcrumbs,
+          [namespace]: current.slice(0, index)
+        }
+      };
+    });
+  },
+  sliceBreadcrumbs: (namespace, index) => {
+    set((state) => {
+      const current = state.breadcrumbs[namespace] || [];
+      return {
+        breadcrumbs: {
+          ...state.breadcrumbs,
+          [namespace]: current.slice(0, index + 1)
+        }
+      };
+    });
+  },
+  clearBreadcrumbs: (namespace) => {
+    set((state) => {
+      const { [namespace]: _, ...rest } = state.breadcrumbs;
+      return {
+        breadcrumbs: rest
+      };
+    });
+  },
+  getBreadcrumbs: (namespace) => {
+    return get().breadcrumbs[namespace] || [];
+  }
+}));
+var useBreadcrumb = (namespace) => {
+  const store = useBreadcrumbStore();
+  const breadcrumbs = store.breadcrumbs[namespace] || [];
+  return {
+    breadcrumbs,
+    /**
+     * Define todos os breadcrumbs de uma vez
+     */
+    setBreadcrumbs: (items) => {
+      store.setBreadcrumbs(namespace, items);
+    },
+    /**
+     * Adiciona um novo breadcrumb ao final
+     */
+    addBreadcrumb: (item) => {
+      store.addBreadcrumb(namespace, item);
+    },
+    /**
+     * Atualiza um breadcrumb existente
+     */
+    updateBreadcrumb: (itemId, updates) => {
+      store.updateBreadcrumb(namespace, itemId, updates);
+    },
+    /**
+     * Remove um breadcrumb e todos os seguintes
+     */
+    removeBreadcrumbFrom: (itemId) => {
+      store.removeBreadcrumbFrom(namespace, itemId);
+    },
+    /**
+     * Mantém apenas os breadcrumbs até o índice especificado (inclusivo)
+     */
+    sliceBreadcrumbs: (index) => {
+      store.sliceBreadcrumbs(namespace, index);
+    },
+    /**
+     * Limpa todos os breadcrumbs
+     */
+    clearBreadcrumbs: () => {
+      store.clearBreadcrumbs(namespace);
+    }
+  };
+};
+
+// src/components/BreadcrumbMenu/useBreadcrumbBuilder.ts
+var isBreadcrumbWithData = (level) => {
+  return "data" in level;
+};
+var useBreadcrumbBuilder = (config) => {
+  const { namespace, root, levels } = config;
+  const { breadcrumbs, setBreadcrumbs, sliceBreadcrumbs } = useBreadcrumb(namespace);
+  const levelDependencies = levels.map(
+    (level) => isBreadcrumbWithData(level) ? level.data : null
+  );
+  const levelUrlIds = levels.map((level) => level.urlId);
+  (0, import_react38.useEffect)(() => {
+    const newBreadcrumbs = [root];
+    const previousIds = [];
+    for (const level of levels) {
+      const { urlId } = level;
+      if (isBreadcrumbWithData(level)) {
+        const { data, getId, getName, getUrl } = level;
+        if (!data) break;
+        const dataId = getId(data);
+        if (urlId === void 0 || dataId !== urlId) break;
+        newBreadcrumbs.push({
+          id: dataId,
+          name: getName(data),
+          url: getUrl(data, previousIds)
+        });
+        previousIds.push(dataId);
+      } else {
+        const { breadcrumb } = level;
+        if (urlId === void 0) break;
+        newBreadcrumbs.push(breadcrumb);
+        previousIds.push(breadcrumb.id);
+      }
+    }
+    setBreadcrumbs(newBreadcrumbs);
+  }, [namespace, ...levelDependencies, ...levelUrlIds, root.id]);
+  return {
+    breadcrumbs,
+    sliceBreadcrumbs
+  };
+};
+
+// src/components/BreadcrumbMenu/useUrlParams.ts
 var import_react39 = require("react");
+var import_react_router_dom4 = require("react-router-dom");
+var useUrlParams = (config) => {
+  const location = (0, import_react_router_dom4.useLocation)();
+  return (0, import_react39.useMemo)(() => {
+    const segments = location.pathname.split("/").filter(Boolean);
+    const params = {};
+    for (const [key, index] of Object.entries(config)) {
+      params[key] = segments[index];
+    }
+    return params;
+  }, [location.pathname, config]);
+};
+
+// src/hooks/useAppInitialization.ts
+var import_react41 = require("react");
 
 // src/hooks/useInstitution.ts
-var import_react38 = require("react");
+var import_react40 = require("react");
 function useInstitutionId() {
-  const [institutionId, setInstitutionId] = (0, import_react38.useState)(() => {
+  const [institutionId, setInstitutionId] = (0, import_react40.useState)(() => {
     return document.querySelector('meta[name="institution-id"]')?.getAttribute("content") ?? null;
   });
-  (0, import_react38.useEffect)(() => {
+  (0, import_react40.useEffect)(() => {
     const metaTag = document.querySelector('meta[name="institution-id"]');
     if (!metaTag) return;
     const observer = new MutationObserver(() => {
@@ -12546,9 +12768,9 @@ function useInstitutionId() {
 }
 
 // src/store/appStore.ts
-var import_zustand10 = require("zustand");
+var import_zustand11 = require("zustand");
 var import_middleware4 = require("zustand/middleware");
-var useAppStore = (0, import_zustand10.create)()(
+var useAppStore = (0, import_zustand11.create)()(
   (0, import_middleware4.persist)(
     (set, get) => ({
       institutionId: null,
@@ -12592,9 +12814,9 @@ var useAppStore = (0, import_zustand10.create)()(
 );
 
 // src/store/authStore.ts
-var import_zustand11 = require("zustand");
+var import_zustand12 = require("zustand");
 var import_middleware5 = require("zustand/middleware");
-var useAuthStore = (0, import_zustand11.create)()(
+var useAuthStore = (0, import_zustand12.create)()(
   (0, import_middleware5.persist)(
     (set, get) => ({
       user: null,
@@ -12696,7 +12918,7 @@ var useAuthStore = (0, import_zustand11.create)()(
 function useAppInitialization() {
   const getInstitutionId = useInstitutionId();
   const { initialize, initialized, institutionId } = useAppStore();
-  const authFunctions = (0, import_react39.useMemo)(
+  const authFunctions = (0, import_react41.useMemo)(
     () => ({
       checkAuth: async () => {
         const { sessionInfo, tokens } = useAuthStore.getState();
@@ -12733,10 +12955,10 @@ function useAppInitialization() {
 }
 
 // src/hooks/useAppContent.ts
-var import_react40 = require("react");
-var import_react_router_dom3 = require("react-router-dom");
+var import_react42 = require("react");
+var import_react_router_dom5 = require("react-router-dom");
 function useAppContent(config) {
-  const navigate = (0, import_react_router_dom3.useNavigate)();
+  const navigate = (0, import_react_router_dom5.useNavigate)();
   const { setTokens, setSessionInfo, setSelectedProfile } = useAuthStore();
   const {
     api,
@@ -12759,20 +12981,20 @@ function useAppContent(config) {
       navigate("/painel");
     }
   };
-  const handleSetSelectedProfile = (0, import_react40.useCallback)(
+  const handleSetSelectedProfile = (0, import_react42.useCallback)(
     (profile) => {
       setSelectedProfile(profile);
     },
     [setSelectedProfile]
   );
-  const handleClearParamsFromURL = (0, import_react40.useCallback)(() => {
+  const handleClearParamsFromURL = (0, import_react42.useCallback)(() => {
     if (onClearParamsFromURL) {
       onClearParamsFromURL();
     } else {
       globalThis.location.replace("/painel");
     }
   }, [onClearParamsFromURL]);
-  const handleError = (0, import_react40.useCallback)(
+  const handleError = (0, import_react42.useCallback)(
     (error) => {
       if (onError) {
         onError(error);
@@ -12783,7 +13005,7 @@ function useAppContent(config) {
     },
     [navigate, onError]
   );
-  const urlAuthConfig = (0, import_react40.useMemo)(
+  const urlAuthConfig = (0, import_react42.useMemo)(
     () => ({
       setTokens,
       setSessionInfo,
@@ -12809,10 +13031,10 @@ function useAppContent(config) {
   );
   useUrlAuthentication(urlAuthConfig);
   const { sessionInfo } = useAuth();
-  const institutionIdToUse = (0, import_react40.useMemo)(() => {
+  const institutionIdToUse = (0, import_react42.useMemo)(() => {
     return sessionInfo?.institutionId || getInstitutionId;
   }, [sessionInfo?.institutionId, getInstitutionId]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react42.useEffect)(() => {
     if (institutionIdToUse && !initialized) {
       initialize(institutionIdToUse);
     }
@@ -12831,6 +13053,7 @@ function useAppContent(config) {
   AlternativesList,
   AuthProvider,
   Badge,
+  BreadcrumbMenu,
   Button,
   Calendar,
   CardAccordation,
@@ -12956,6 +13179,8 @@ function useAppContent(config) {
   useAuth,
   useAuthGuard,
   useAuthStore,
+  useBreadcrumb,
+  useBreadcrumbBuilder,
   useInstitutionId,
   useMobile,
   useQuizStore,
@@ -12964,6 +13189,7 @@ function useAppContent(config) {
   useThemeStore,
   useToastStore,
   useUrlAuthentication,
+  useUrlParams,
   withAuth
 });
 //# sourceMappingURL=index.js.map