@umituz/web-dashboard 1.0.4 → 2.0.0

package/dist/{index.js → components/DashboardLayout.js}

@@ -1,17 +1,17 @@
 "use client";
 
-// src/presentation/organisms/DashboardLayout.tsx
+// src/domains/layouts/components/DashboardLayout.tsx
 import { useState as useState3, useEffect } from "react";
 import { useLocation as useLocation2, Outlet, Navigate } from "react-router-dom";
 import { Skeleton } from "@umituz/web-design-system/atoms";
 
-// src/presentation/molecules/DashboardSidebar.tsx
+// src/domains/layouts/components/DashboardSidebar.tsx
 import { useState } from "react";
 import { Link, useLocation } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import { Button } from "@umituz/web-design-system/atoms";
 
-// src/presentation/molecules/BrandLogo.tsx
+// src/domains/layouts/components/BrandLogo.tsx
 import { cn } from "@umituz/web-design-system/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 var BrandLogo = ({ className, size = 32 }) => {
@@ -94,10 +94,10 @@ var BrandLogo = ({ className, size = 32 }) => {
   );
 };
 
-// src/presentation/molecules/DashboardSidebar.tsx
+// src/domains/layouts/components/DashboardSidebar.tsx
 import { PenTool, Menu, ChevronLeft, ChevronDown, ChevronRight } from "lucide-react";
 
-// src/infrastructure/utils/index.ts
+// src/domains/layouts/utils/dashboard.ts
 function formatNotificationTime(createdAt, t) {
   const date = new Date(createdAt);
   const secs = Math.floor((Date.now() - date.getTime()) / 1e3);
@@ -106,19 +106,6 @@ function formatNotificationTime(createdAt, t) {
   if (secs < 86400) return t("dashboard.activityFeed.times.hoursAgo", { val: Math.floor(secs / 3600) });
   return t("dashboard.activityFeed.times.daysAgo", { val: Math.floor(secs / 86400) });
 }
-function isPathActive(currentPath, targetPath) {
-  return currentPath === targetPath;
-}
-function getPageTitle(pathname, sidebarGroups, extraTitleMap) {
-  for (const group of sidebarGroups) {
-    const item = group.items.find((i) => i.path === pathname);
-    if (item) return item.label;
-  }
-  if (extraTitleMap?.[pathname]) {
-    return extraTitleMap[pathname];
-  }
-  return null;
-}
 function filterSidebarItems(items, user) {
   return items.filter((item) => {
     if (item.enabled === false) return false;
@@ -128,11 +115,8 @@ function filterSidebarItems(items, user) {
     return true;
   });
 }
-function generateNotificationId() {
-  return crypto.randomUUID();
-}
 
-// src/presentation/molecules/DashboardSidebar.tsx
+// src/domains/layouts/components/DashboardSidebar.tsx
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var DashboardSidebar = ({
   collapsed,
@@ -213,7 +197,7 @@ var DashboardSidebar = ({
   ] });
 };
 
-// src/presentation/organisms/DashboardHeader.tsx
+// src/domains/layouts/components/DashboardHeader.tsx
 import React, { useState as useState2 } from "react";
 import {
   Bell,
@@ -421,7 +405,7 @@ var DashboardHeader = ({
   ] });
 };
 
-// src/presentation/organisms/DashboardLayout.tsx
+// src/domains/layouts/components/DashboardLayout.tsx
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var DashboardLayout = ({
   config,
@@ -509,244 +493,9 @@ var DashboardLayout = ({
     ] })
   ] });
 };
-
-// src/domain/theme/index.ts
-var DEFAULT_DASHBOARD_THEME = {
-  primary: "hsl(222.2 47.4% 11.2%)",
-  secondary: "hsl(217.2 32.6% 17.5%)",
-  sidebarBackground: "hsl(222.2 47.4% 11.2%)",
-  sidebarForeground: "hsl(210 40% 98%)",
-  sidebarBorder: "hsl(217.2 32.6% 17.5%)",
-  headerBackground: "hsla(0, 0%, 100%, 0.8)",
-  background: "hsl(0 0% 100%)",
-  foreground: "hsl(222.2 84% 4.9%)",
-  border: "hsl(214.3 31.8% 91.4%)",
-  accent: "hsl(217.2 91.2% 59.8%)",
-  accentForeground: "hsl(0 0% 100%)",
-  destructive: "hsl(0 84.2% 60.2%)",
-  destructiveForeground: "hsl(0 0% 98%)",
-  muted: "hsl(210 40% 96.1%)",
-  mutedForeground: "hsl(215.4 16.3% 46.9%)",
-  card: "hsl(0 0% 100%)",
-  cardForeground: "hsl(222.2 84% 4.9%)",
-  popover: "hsl(0 0% 100%)",
-  popoverForeground: "hsl(222.2 84% 4.9%)",
-  radius: "0.5rem"
-};
-var DEFAULT_DASHBOARD_THEME_DARK = {
-  primary: "hsl(217.2 91.2% 59.8%)",
-  secondary: "hsl(217.2 32.6% 17.5%)",
-  sidebarBackground: "hsl(222.2 47.4% 11.2%)",
-  sidebarForeground: "hsl(210 40% 98%)",
-  sidebarBorder: "hsl(217.2 32.6% 17.5%)",
-  headerBackground: "hsla(222.2 47.4% 11.2%, 0.8)",
-  background: "hsl(222.2 84% 4.9%)",
-  foreground: "hsl(210 40% 98%)",
-  border: "hsl(217.2 32.6% 17.5%)",
-  accent: "hsl(217.2 91.2% 59.8%)",
-  accentForeground: "hsl(0 0% 100%)",
-  destructive: "hsl(0 62.8% 30.6%)",
-  destructiveForeground: "hsl(0 0% 98%)",
-  muted: "hsl(217.2 32.6% 17.5%)",
-  mutedForeground: "hsl(215 20.2% 65.1%)",
-  card: "hsl(222.2 84% 4.9%)",
-  cardForeground: "hsl(210 40% 98%)",
-  popover: "hsl(222.2 84% 4.9%)",
-  popoverForeground: "hsl(210 40% 98%)",
-  radius: "0.5rem"
-};
-var DASHBOARD_THEME_PRESETS = [
-  {
-    name: "default",
-    theme: DEFAULT_DASHBOARD_THEME,
-    dark: false
-  },
-  {
-    name: "default-dark",
-    theme: DEFAULT_DASHBOARD_THEME_DARK,
-    dark: true
-  },
-  {
-    name: "blue",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME,
-      primary: "hsl(221.2 83.2% 53.3%)",
-      accent: "hsl(221.2 83.2% 53.3%)"
-    },
-    dark: false
-  },
-  {
-    name: "blue-dark",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME_DARK,
-      primary: "hsl(221.2 83.2% 53.3%)",
-      accent: "hsl(221.2 83.2% 53.3%)"
-    },
-    dark: true
-  },
-  {
-    name: "purple",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME,
-      primary: "hsl(271.5 81.3% 55.9%)",
-      accent: "hsl(271.5 81.3% 55.9%)"
-    },
-    dark: false
-  },
-  {
-    name: "purple-dark",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME_DARK,
-      primary: "hsl(271.5 81.3% 55.9%)",
-      accent: "hsl(271.5 81.3% 55.9%)"
-    },
-    dark: true
-  },
-  {
-    name: "green",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME,
-      primary: "hsl(142.1 76.2% 36.3%)",
-      accent: "hsl(142.1 76.2% 36.3%)"
-    },
-    dark: false
-  },
-  {
-    name: "green-dark",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME_DARK,
-      primary: "hsl(142.1 76.2% 36.3%)",
-      accent: "hsl(142.1 76.2% 36.3%)"
-    },
-    dark: true
-  },
-  {
-    name: "orange",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME,
-      primary: "hsl(24.6 95% 53.1%)",
-      accent: "hsl(24.6 95% 53.1%)"
-    },
-    dark: false
-  },
-  {
-    name: "orange-dark",
-    theme: {
-      ...DEFAULT_DASHBOARD_THEME_DARK,
-      primary: "hsl(24.6 95% 53.1%)",
-      accent: "hsl(24.6 95% 53.1%)"
-    },
-    dark: true
-  }
-];
-function applyDashboardTheme(theme) {
-  if (typeof document === "undefined") return;
-  const root = document.documentElement;
-  const cssVars = {
-    "--primary": theme.primary,
-    "--secondary": theme.secondary,
-    "--sidebar": theme.sidebarBackground,
-    "--sidebar-foreground": theme.sidebarForeground,
-    "--sidebar-border": theme.sidebarBorder,
-    "--background": theme.background,
-    "--foreground": theme.foreground,
-    "--border": theme.border,
-    "--accent": theme.accent,
-    "--accent-foreground": theme.accentForeground,
-    "--destructive": theme.destructive,
-    "--destructive-foreground": theme.destructiveForeground,
-    "--muted": theme.muted,
-    "--muted-foreground": theme.mutedForeground,
-    "--card": theme.card,
-    "--card-foreground": theme.cardForeground,
-    "--popover": theme.popover,
-    "--popover-foreground": theme.popoverForeground,
-    "--radius": theme.radius
-  };
-  Object.entries(cssVars).forEach(([key, value]) => {
-    if (value) {
-      root.style.setProperty(key, value);
-    }
-  });
-}
-function getDashboardThemePreset(name) {
-  return DASHBOARD_THEME_PRESETS.find((preset) => preset.name === name);
-}
-function mergeDashboardTheme(customTheme, dark = false) {
-  const baseTheme = dark ? DEFAULT_DASHBOARD_THEME_DARK : DEFAULT_DASHBOARD_THEME;
-  return {
-    ...baseTheme,
-    ...customTheme
-  };
-}
-
-// src/infrastructure/hooks/index.ts
-import { useState as useState4, useCallback } from "react";
-function useNotifications(initialNotifications = []) {
-  const [notifications, setNotifications] = useState4(initialNotifications);
-  const markAllRead = useCallback(() => {
-    setNotifications(
-      (prev) => prev.map((n) => ({ ...n, read: true }))
-    );
-  }, []);
-  const dismiss = useCallback((id) => {
-    setNotifications((prev) => prev.filter((n) => n.id !== id));
-  }, []);
-  const add = useCallback((notification) => {
-    const newNotification = {
-      ...notification,
-      id: crypto.randomUUID(),
-      read: false,
-      createdAt: /* @__PURE__ */ new Date()
-    };
-    setNotifications((prev) => [newNotification, ...prev]);
-  }, []);
-  return {
-    notifications,
-    markAllRead,
-    dismiss,
-    add
-  };
-}
-function useSidebar(initialCollapsed = false) {
-  const [collapsed, setCollapsed] = useState4(initialCollapsed);
-  const [mobileOpen, setMobileOpen] = useState4(false);
-  const toggle = useCallback(() => {
-    setCollapsed((prev) => !prev);
-  }, []);
-  const openMobile = useCallback(() => {
-    setMobileOpen(true);
-  }, []);
-  const closeMobile = useCallback(() => {
-    setMobileOpen(false);
-  }, []);
-  return {
-    collapsed,
-    setCollapsed,
-    toggle,
-    mobileOpen,
-    setMobileOpen,
-    openMobile,
-    closeMobile
-  };
-}
+var DashboardLayout_default = DashboardLayout;
 export {
-  BrandLogo,
-  DASHBOARD_THEME_PRESETS,
-  DEFAULT_DASHBOARD_THEME,
-  DEFAULT_DASHBOARD_THEME_DARK,
-  DashboardHeader,
   DashboardLayout,
-  DashboardSidebar,
-  applyDashboardTheme,
-  filterSidebarItems,
-  formatNotificationTime,
-  generateNotificationId,
-  getDashboardThemePreset,
-  getPageTitle,
-  isPathActive,
-  mergeDashboardTheme,
-  useNotifications,
-  useSidebar
+  DashboardLayout_default as default
 };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=DashboardLayout.js.map

package/dist/components/DashboardLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/domains/layouts/components/DashboardLayout.tsx","../../src/domains/layouts/components/DashboardSidebar.tsx","../../src/domains/layouts/components/BrandLogo.tsx","../../src/domains/layouts/utils/dashboard.ts","../../src/domains/layouts/components/DashboardHeader.tsx"],"sourcesContent":["import { useState, useEffect } from \"react\";\nimport { useLocation, Outlet, Navigate } from \"react-router-dom\";\nimport { Skeleton } from \"@umituz/web-design-system/atoms\";\nimport { DashboardSidebar } from \"./DashboardSidebar\";\nimport { DashboardHeader } from \"./DashboardHeader\";\nimport type { DashboardLayoutConfig } from \"../types/layout\";\nimport type { DashboardNotification } from \"../types/notification\";\nimport type { DashboardUser } from \"../types/user\";\n\ninterface DashboardLayoutProps {\n  /** Layout configuration */\n  config: DashboardLayoutConfig;\n  /** Auth user */\n  user?: DashboardUser;\n  /** Auth loading state */\n  authLoading?: boolean;\n  /** Authenticated state */\n  isAuthenticated?: boolean;\n  /** Notifications */\n  notifications?: DashboardNotification[];\n  /** Logout function */\n  onLogout?: () => Promise<void>;\n  /** Mark all as read function */\n  onMarkAllRead?: () => void;\n  /** Dismiss notification function */\n  onDismissNotification?: (id: string) => void;\n  /** Login route for redirect */\n  loginRoute?: string;\n}\n\n/**\n * Dashboard Layout Component\n *\n * Main layout wrapper for dashboard pages.\n * Provides sidebar, header, and content area with responsive design.\n *\n * Features:\n * - Collapsible sidebar\n * - Mobile menu overlay\n * - Breadcrumb page titles\n * - Loading skeletons\n * - Auth protection\n *\n * @param props - Dashboard layout props\n */\nexport const DashboardLayout = ({\n  config,\n  user,\n  authLoading = false,\n  isAuthenticated = true,\n  notifications = [],\n  onLogout,\n  onMarkAllRead,\n  onDismissNotification,\n  loginRoute = \"/login\",\n}: DashboardLayoutProps) => {\n  const location = useLocation();\n  const [collapsed, setCollapsed] = useState(false);\n  const [mobileOpen, setMobileOpen] = useState(false);\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    setLoading(true);\n    const timer = setTimeout(() => setLoading(false), 300);\n    return () => clearTimeout(timer);\n  }, [location.pathname]);\n\n  useEffect(() => {\n    setMobileOpen(false);\n  }, [location.pathname]);\n\n  if (authLoading) return null;\n  if (!isAuthenticated) return <Navigate to={loginRoute} replace />;\n\n  const activeItem = config.sidebarGroups\n    .flatMap((group) => group.items)\n    .find((i) => i.path === location.pathname);\n\n  const getTitle = () => {\n    if (!activeItem) return config.extraTitleMap?.[location.pathname] || \"Dashboard\";\n    return activeItem.label; // Note: In real app, this would be translated\n  };\n\n  const currentTitle = getTitle();\n\n  return (\n    <div className=\"flex h-screen w-full bg-background font-sans\">\n      {/* Desktop Sidebar */}\n      <aside\n        className={`hidden md:flex flex-col shrink-0 border-r border-sidebar-border bg-sidebar transition-all duration-300 ${\n          collapsed ? \"w-16\" : \"w-60\"\n        }`}\n      >\n        <DashboardSidebar\n          collapsed={collapsed}\n          setCollapsed={setCollapsed}\n          sidebarGroups={config.sidebarGroups}\n          brandName={config.brandName}\n          brandTagline={config.brandTagline}\n          user={user}\n        />\n      </aside>\n\n      {/* Mobile Menu Overlay */}\n      {mobileOpen && (\n        <div className=\"fixed inset-0 z-50 md:hidden\">\n          <div className=\"absolute inset-0 bg-background/80 backdrop-blur-sm\" onClick={() => setMobileOpen(false)} />\n          <aside className=\"absolute left-0 top-0 h-full w-60 border-r border-sidebar-border bg-sidebar shadow-xl\">\n            <DashboardSidebar\n              collapsed={false}\n              setCollapsed={() => setMobileOpen(false)}\n              sidebarGroups={config.sidebarGroups}\n              brandName={config.brandName}\n              brandTagline={config.brandTagline}\n              user={user}\n            />\n          </aside>\n        </div>\n      )}\n\n      {/* Main Content Area */}\n      <div className=\"flex flex-1 flex-col overflow-hidden min-w-0\">\n        <DashboardHeader\n          collapsed={collapsed}\n          setCollapsed={setCollapsed}\n          setMobileOpen={setMobileOpen}\n          title={currentTitle}\n          user={user}\n          notifications={notifications}\n          onLogout={onLogout}\n          onMarkAllRead={onMarkAllRead}\n          onDismissNotification={onDismissNotification}\n        />\n\n        <main className=\"flex-1 overflow-y-auto p-4 md:p-8\">\n          {loading ? (\n            <div className=\"mx-auto w-full max-w-7xl space-y-6\">\n              <Skeleton className=\"h-8 w-1/3 rounded-xl\" />\n              <div className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n                {Array.from({ length: 4 }).map((_, i) => (\n                  <Skeleton key={i} className=\"h-28 rounded-2xl\" />\n                ))}\n              </div>\n              <Skeleton className=\"h-64 rounded-[32px]\" />\n            </div>\n          ) : (\n            <Outlet />\n          )}\n        </main>\n      </div>\n    </div>\n  );\n};\n\nexport default DashboardLayout;\n","import { useState } from \"react\";\nimport { Link, useLocation } from \"react-router-dom\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Button } from \"@umituz/web-design-system/atoms\";\nimport { BrandLogo } from \"./BrandLogo\";\nimport { PenTool, Menu, ChevronLeft, ChevronDown, ChevronRight } from \"lucide-react\";\nimport type { DashboardSidebarProps } from \"../types/layout\";\nimport type { DashboardUser } from \"../types/user\";\nimport type { SidebarGroup } from \"../types/sidebar\";\nimport { filterSidebarItems } from \"../utils/dashboard\";\n\ninterface DashboardSidebarPropsExtended extends DashboardSidebarProps {\n  /** Sidebar groups configuration */\n  sidebarGroups: SidebarGroup[];\n  /** Brand name */\n  brandName?: string;\n  /** Brand tagline */\n  brandTagline?: string;\n  /** Create post route */\n  createPostRoute?: string;\n  /** Auth user */\n  user?: DashboardUser;\n}\n\n/**\n * Dashboard Sidebar Component\n *\n * Displays collapsible sidebar with navigation menu items.\n * Supports app-based filtering (mobile/web) and collapsible groups.\n *\n * @param props - Dashboard sidebar props\n */\nexport const DashboardSidebar = ({\n  collapsed,\n  setCollapsed,\n  sidebarGroups,\n  brandName = \"App\",\n  brandTagline = \"grow smarter\",\n  createPostRoute = \"/dashboard/create\",\n  user,\n}: DashboardSidebarPropsExtended) => {\n  const location = useLocation();\n  const { t } = useTranslation();\n  const [collapsedGroups, setCollapsedGroups] = useState<Record<string, boolean>>({});\n\n  const toggleGroup = (title: string) => {\n    setCollapsedGroups(prev => ({\n      ...prev,\n      [title]: !prev[title]\n    }));\n  };\n\n  return (\n    <div className=\"flex h-full flex-col\">\n      {/* Brand Section */}\n      <div className=\"flex h-16 items-center gap-3 border-b border-sidebar-border px-4 transition-all duration-300\">\n        <BrandLogo size={32} />\n        {!collapsed && (\n          <div className=\"flex flex-col -gap-1\">\n            <span className=\"text-2xl font-black text-sidebar-foreground tracking-tighter leading-none\">{brandName}</span>\n            <span className=\"text-[11px] font-bold text-primary/70 lowercase tracking-tight mt-2 ml-1 select-none underline decoration-primary/40 underline-offset-[6px] decoration-2\">\n              {brandTagline}\n            </span>\n          </div>\n        )}\n      </div>\n\n      {/* Create Button */}\n      <div className=\"px-3 py-4 border-b border-sidebar-border/50\">\n        <Link to={createPostRoute}>\n          <Button\n            variant=\"default\"\n            className={`w-full gap-3 shadow-glow transition-all active:scale-95 group overflow-hidden rounded-xl ${\n              collapsed ? \"px-0 justify-center h-10 w-10 mx-auto\" : \"justify-start px-4 h-11\"\n            }`}\n            title={collapsed ? t('sidebar.createPost') : undefined}\n          >\n            <PenTool className={`shrink-0 transition-transform duration-300 ${collapsed ? \"h-5 w-5\" : \"h-4 w-4 group-hover:scale-110\"}`} />\n            {!collapsed && <span className=\"font-bold tracking-tight\">{t('sidebar.createPost')}</span>}\n          </Button>\n        </Link>\n      </div>\n\n      {/* Navigation */}\n      <nav className=\"flex-1 overflow-y-auto px-2 py-3 scrollbar-hide\">\n        <div className=\"space-y-6\">\n          {sidebarGroups.map((group) => {\n            const filteredItems = filterSidebarItems(group.items, user);\n\n            if (filteredItems.length === 0) return null;\n\n            const isGroupCollapsed = collapsedGroups[group.title];\n\n            return (\n              <div key={group.title} className=\"space-y-1\">\n                {!collapsed && (\n                  <button\n                    onClick={() => toggleGroup(group.title)}\n                    className=\"w-full flex items-center justify-between px-3 mb-2 group/header\"\n                  >\n                    <span className=\"text-[10px] font-bold uppercase tracking-widest text-sidebar-foreground/40 group-hover/header:text-sidebar-foreground/70 transition-colors\">\n                      {group.title === \"sidebar.ai\" ? `${brandName} AI` : t(group.title)}\n                    </span>\n                    {isGroupCollapsed ? (\n                      <ChevronRight className=\"h-3 w-3 text-sidebar-foreground/30 flex-shrink-0 group-hover/header:text-sidebar-foreground/50 transition-colors\" />\n                    ) : (\n                      <ChevronDown className=\"h-3 w-3 text-sidebar-foreground/30 flex-shrink-0 group-hover/header:text-sidebar-foreground/50 transition-colors\" />\n                    )}\n                  </button>\n                )}\n\n                {(!isGroupCollapsed || collapsed) && filteredItems.map((item) => {\n                  const active = location.pathname === item.path;\n                  return (\n                    <Link\n                      key={item.path}\n                      to={item.path}\n                      className={`flex items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-all duration-200 ${\n                        active\n                          ? \"bg-sidebar-accent text-sidebar-accent-foreground shadow-sm\"\n                          : \"text-sidebar-foreground/70 hover:bg-sidebar-accent/40 hover:text-sidebar-foreground\"\n                      } ${collapsed ? \"justify-center\" : \"\"}`}\n                      title={collapsed ? t(item.label) : undefined}\n                    >\n                      <item.icon className={`h-4 w-4 shrink-0 transition-transform ${active && \"scale-110\"}`} />\n                      {!collapsed && <span>{t(item.label)}</span>}\n                    </Link>\n                  );\n                })}\n              </div>\n            );\n          })}\n        </div>\n      </nav>\n\n      {/* Collapse Toggle */}\n      <div className=\"border-t border-sidebar-border p-3\">\n        <div className={`flex items-center ${collapsed ? \"justify-center\" : \"justify-between\"}`}>\n          {!collapsed && (\n            <p className=\"text-[10px] uppercase tracking-wider text-sidebar-foreground/40 font-bold px-2\">\n              {t('sidebar.system')}\n            </p>\n          )}\n          <Button variant=\"ghost\" size=\"icon\" onClick={() => setCollapsed(!collapsed)} className=\"text-sidebar-foreground/70\">\n            {collapsed ? <Menu className=\"h-4 w-4\" /> : <ChevronLeft className=\"h-4 w-4\" />}\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n};\n","import React from \"react\";\nimport { cn } from \"@umituz/web-design-system/utils\";\n\ninterface BrandLogoProps {\n  className?: string;\n  size?: number;\n}\n\n/**\n * BrandLogo Component\n *\n * Displays the application brand logo as an SVG.\n * Supports custom sizing and styling through className.\n *\n * @param className - Optional CSS classes for styling\n * @param size - Width and height in pixels (default: 32)\n */\nexport const BrandLogo = ({ className, size = 32 }: BrandLogoProps) => {\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 100 100\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={cn(\"shrink-0\", className)}\n    >\n      {/* Solid Foundation / Platform */}\n      <rect\n        x=\"15\"\n        y=\"65\"\n        width=\"70\"\n        height=\"15\"\n        rx=\"4\"\n        fill=\"hsl(var(--primary))\"\n      />\n\n      {/* Assembly Paths / Structure */}\n      <rect\n        x=\"25\"\n        y=\"25\"\n        width=\"12\"\n        height=\"40\"\n        rx=\"2\"\n        fill=\"hsl(var(--primary))\"\n      />\n      <rect\n        x=\"44\"\n        y=\"35\"\n        width=\"12\"\n        height=\"30\"\n        rx=\"2\"\n        fill=\"hsl(var(--primary))\"\n      />\n      <rect\n        x=\"63\"\n        y=\"20\"\n        width=\"12\"\n        height=\"45\"\n        rx=\"2\"\n        fill=\"hsl(var(--primary))\"\n      />\n\n      {/* Modern Accent - The 'Assembly' Bridge */}\n      <rect\n        x=\"20\"\n        y=\"45\"\n        width=\"60\"\n        height=\"10\"\n        rx=\"2\"\n        fill=\"hsl(var(--secondary))\"\n      />\n\n      {/* Connection Point / Beacon */}\n      <circle\n        cx=\"50\"\n        cy=\"20\"\n        r=\"5\"\n        fill=\"hsl(var(--secondary))\"\n      />\n    </svg>\n  );\n};\n","/**\n * Dashboard Utilities\n *\n * Utility functions for dashboard operations\n */\n\n/**\n * Format notification timestamp to relative time\n *\n * @param createdAt - Notification creation timestamp\n * @param t - i18n translation function\n * @returns Formatted time string\n */\nexport function formatNotificationTime(\n  createdAt: Date | string | number,\n  t: (key: string, params?: Record<string, unknown>) => string\n): string {\n  const date = new Date(createdAt);\n  const secs = Math.floor((Date.now() - date.getTime()) / 1000);\n\n  if (secs < 60) return t(\"dashboard.activityFeed.times.justNow\");\n  if (secs < 3600) return t(\"dashboard.activityFeed.times.minutesAgo\", { val: Math.floor(secs / 60) });\n  if (secs < 86400) return t(\"dashboard.activityFeed.times.hoursAgo\", { val: Math.floor(secs / 3600) });\n  return t(\"dashboard.activityFeed.times.daysAgo\", { val: Math.floor(secs / 86400) });\n}\n\n/**\n * Check if a path is active\n *\n * @param currentPath - Current location pathname\n * @param targetPath - Target path to check\n * @returns True if paths match\n */\nexport function isPathActive(currentPath: string, targetPath: string): boolean {\n  return currentPath === targetPath;\n}\n\n/**\n * Get page title from sidebar configuration\n *\n * @param pathname - Current pathname\n * @param sidebarGroups - Sidebar groups configuration\n * @param extraTitleMap - Extra title mappings\n * @returns Page title or null\n */\nexport function getPageTitle(\n  pathname: string,\n  sidebarGroups: Array<{ items: Array<{ path: string; label: string }> }>,\n  extraTitleMap?: Record<string, string>\n): string | null {\n  // Search in sidebar groups\n  for (const group of sidebarGroups) {\n    const item = group.items.find((i) => i.path === pathname);\n    if (item) return item.label;\n  }\n\n  // Search in extra title map\n  if (extraTitleMap?.[pathname]) {\n    return extraTitleMap[pathname];\n  }\n\n  return null;\n}\n\n/**\n * Filter sidebar items by app type and enabled status\n *\n * @param items - Sidebar items to filter\n * @param user - Current user object\n * @returns Filtered items\n */\nexport function filterSidebarItems<T extends { enabled?: boolean; requiredApp?: \"mobile\" | \"web\" }>(\n  items: T[],\n  user?: { hasMobileApp?: boolean; hasWebApp?: boolean }\n): T[] {\n  return items.filter((item) => {\n    // Skip disabled items\n    if (item.enabled === false) return false;\n\n    // Skip items that require specific app types\n    if (!item.requiredApp) return true;\n    if (item.requiredApp === \"mobile\") return user?.hasMobileApp ?? false;\n    if (item.requiredApp === \"web\") return user?.hasWebApp ?? false;\n\n    return true;\n  });\n}\n\n/**\n * Generate notification ID\n *\n * @returns Unique notification ID\n */\nexport function generateNotificationId(): string {\n  return crypto.randomUUID();\n}\n","import React, { useState } from \"react\";\nimport {\n  Bell, X, Sun, Moon, Menu, User, Settings, LogOut,\n  ChevronDown, CreditCard\n} from \"lucide-react\";\nimport { Button } from \"@umituz/web-design-system/atoms\";\nimport { useNavigate } from \"react-router-dom\";\nimport { useTranslation } from \"react-i18next\";\nimport type { DashboardHeaderProps } from \"../types/layout\";\nimport type { DashboardNotification } from \"../types/notification\";\nimport type { DashboardUser } from \"../types/user\";\nimport { formatNotificationTime } from \"../utils/dashboard\";\n\ninterface DashboardHeaderPropsExtended extends DashboardHeaderProps {\n  /** Auth user */\n  user?: DashboardUser;\n  /** Notifications */\n  notifications?: DashboardNotification[];\n  /** Logout function */\n  onLogout?: () => Promise<void>;\n  /** Mark all as read function */\n  onMarkAllRead?: () => void;\n  /** Dismiss notification function */\n  onDismissNotification?: (id: string) => void;\n  /** Settings route */\n  settingsRoute?: string;\n  /** Profile route */\n  profileRoute?: string;\n  /** Billing route */\n  billingRoute?: string;\n}\n\n/**\n * Dashboard Header Component\n *\n * Displays top navigation bar with theme toggle, notifications,\n * user menu, and organisation selector.\n *\n * @param props - Dashboard header props\n */\nexport const DashboardHeader = ({\n  collapsed,\n  setCollapsed,\n  setMobileOpen,\n  title,\n  user,\n  notifications = [],\n  onLogout,\n  onMarkAllRead,\n  onDismissNotification,\n  settingsRoute = \"/dashboard/settings\",\n  profileRoute = \"/dashboard/profile\",\n  billingRoute = \"/dashboard/billing\",\n}: DashboardHeaderPropsExtended) => {\n  const navigate = useNavigate();\n  const { t } = useTranslation();\n  const [notifOpen, setNotifOpen] = useState(false);\n  const [profileOpen, setProfileOpen] = useState(false);\n\n  const unreadCount = notifications.filter((n) => !n.read).length;\n\n  const markAllRead = () => {\n    onMarkAllRead?.();\n  };\n\n  const handleLogout = async () => {\n    try {\n      await onLogout?.();\n      navigate(\"/login\");\n    } catch {\n      // Error handling can be added by parent component\n    }\n  };\n\n  // Placeholder components - these should be provided by the consuming app\n  const ThemeToggle = () => {\n    const [resolvedTheme, setResolvedTheme] = React.useState<\"light\" | \"dark\">(\"light\");\n\n    return (\n      <Button\n        variant=\"ghost\"\n        size=\"icon\"\n        onClick={() => setResolvedTheme(resolvedTheme === \"light\" ? \"dark\" : \"light\")}\n        className=\"text-muted-foreground h-9 w-9\"\n        title={resolvedTheme === \"dark\" ? t('common.tooltips.switchLight') : t('common.tooltips.switchDark')}\n      >\n        {resolvedTheme === \"dark\" ? <Sun className=\"h-4 w-4\" /> : <Moon className=\"h-4 w-4\" />}\n      </Button>\n    );\n  };\n\n  return (\n    <header className=\"flex h-14 items-center justify-between border-b border-border bg-card/50 backdrop-blur-md px-4 shrink-0 z-30\">\n      <div className=\"flex items-center gap-3\">\n        <Button variant=\"ghost\" size=\"icon\" className=\"md:hidden\" onClick={() => setMobileOpen(true)}>\n          <Menu className=\"h-5 w-5\" />\n        </Button>\n        {collapsed && (\n          <Button variant=\"ghost\" size=\"icon\" className=\"hidden md:inline-flex\" onClick={() => setCollapsed(false)}>\n            <Menu className=\"h-5 w-5\" />\n          </Button>\n        )}\n        <h2 className=\"text-sm font-semibold text-foreground\">\n          {title}\n        </h2>\n      </div>\n\n      <div className=\"flex items-center gap-2\">\n        {/* Theme Toggle */}\n        <ThemeToggle />\n\n        {/* Notifications */}\n        <div className=\"relative\">\n          <Button\n            variant=\"ghost\"\n            size=\"icon\"\n            className=\"text-muted-foreground relative h-9 w-9\"\n            onClick={() => {\n              setNotifOpen(!notifOpen);\n              setProfileOpen(false);\n            }}\n          >\n            <Bell className=\"h-4 w-4\" />\n            {unreadCount > 0 && (\n              <span className=\"absolute top-2 right-2 flex h-2 w-2\">\n                <span className=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-destructive opacity-75\"></span>\n                <span className=\"relative inline-flex rounded-full h-2 w-2 bg-destructive\"></span>\n              </span>\n            )}\n          </Button>\n\n          {notifOpen && (\n            <>\n              <div className=\"fixed inset-0 z-40\" onClick={() => setNotifOpen(false)} />\n              <div className=\"absolute top-12 right-0 w-80 bg-popover border border-border rounded-xl shadow-xl z-50 overflow-hidden animate-in fade-in zoom-in-95 duration-200\">\n                <div className=\"flex items-center justify-between px-4 py-3 border-b border-border bg-muted/50\">\n                  <h3 className=\"text-xs font-bold uppercase tracking-wider text-foreground\">{t('dashboard.notifications.title')}</h3>\n                  {unreadCount > 0 && (\n                    <button onClick={markAllRead} className=\"text-[10px] font-bold text-primary hover:underline uppercase\">{t('dashboard.notifications.markAllRead')}</button>\n                  )}\n                </div>\n\n                <div className=\"max-h-[400px] overflow-y-auto\">\n                  {notifications.map((n) => (\n                    <div key={n.id} className={`px-4 py-3 border-b border-border last:border-0 flex items-start gap-3 transition-colors hover:bg-muted/30 ${!n.read ? \"bg-primary/5\" : \"\"}`}>\n                      <div className=\"flex-1 min-w-0\">\n                        <p className=\"text-sm text-foreground leading-snug\">{n.text}</p>\n                        <p className=\"text-[10px] text-muted-foreground mt-1 flex items-center gap-1\">\n                          <span className=\"inline-block w-1 h-1 rounded-full bg-muted-foreground/30\" />\n                          {formatNotificationTime(n.createdAt, t)}\n                        </p>\n                      </div>\n                      <button\n                        onClick={() => onDismissNotification?.(n.id)}\n                        className=\"text-muted-foreground/50 hover:text-foreground shrink-0 transition-colors\"\n                      >\n                        <X className=\"h-3 w-3\" />\n                      </button>\n                    </div>\n                  ))}\n                  {notifications.length === 0 && (\n                    <div className=\"px-4 py-10 text-center\">\n                      <div className=\"mx-auto w-10 h-10 rounded-full bg-muted flex items-center justify-center mb-3\">\n                        <Bell className=\"h-5 w-5 text-muted-foreground/50\" />\n                      </div>\n                      <p className=\"text-sm text-muted-foreground\">{t('dashboard.notifications.none')}</p>\n                    </div>\n                  )}\n                </div>\n              </div>\n            </>\n          )}\n        </div>\n\n        <div className=\"h-6 w-px bg-border mx-1\" />\n\n        <div className=\"relative\">\n          <button\n            onClick={() => {\n              setProfileOpen(!profileOpen);\n              setNotifOpen(false);\n            }}\n            className=\"flex items-center gap-2 p-1 pl-1 rounded-full hover:bg-muted transition-colors group\"\n          >\n            <div className=\"w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-[10px] font-bold text-primary overflow-hidden border border-primary/20 ring-primary/20 group-hover:ring-4 transition-all\">\n              {user?.avatar && <img src={user.avatar} alt=\"User\" className=\"w-full h-full object-cover\" />}\n            </div>\n            <ChevronDown className={`h-4 w-4 text-muted-foreground transition-transform duration-200 ${profileOpen && \"rotate-180\"}`} />\n          </button>\n\n          {profileOpen && (\n            <>\n              <div className=\"fixed inset-0 z-40\" onClick={() => setProfileOpen(false)} />\n              <div className=\"absolute top-12 right-0 w-56 bg-popover border border-border rounded-xl shadow-xl z-50 overflow-hidden animate-in fade-in zoom-in-95 duration-200 p-1.5\">\n                <div className=\"px-3 py-2 border-b border-border/50 mb-1\">\n                  <p className=\"text-sm font-bold text-foreground\">{user?.name || t(\"common.roles.user\")}</p>\n                  <p className=\"text-xs text-muted-foreground truncate\">{user?.email}</p>\n                </div>\n\n                <div className=\"space-y-0.5\">\n                  <button\n                    onClick={() => { navigate(profileRoute); setProfileOpen(false); }}\n                    className=\"flex w-full items-center gap-2.5 px-3 py-2 text-sm text-foreground hover:bg-muted rounded-lg transition-colors\"\n                  >\n                    <User className=\"h-4 w-4 text-muted-foreground\" />\n                    {t('common.profile')}\n                  </button>\n                  <button\n                    onClick={() => { navigate(billingRoute); setProfileOpen(false); }}\n                    className=\"flex w-full items-center gap-2.5 px-3 py-2 text-sm text-foreground hover:bg-muted rounded-lg transition-colors\"\n                  >\n                    <CreditCard className=\"h-4 w-4 text-muted-foreground\" />\n                    {t('common.billing')}\n                  </button>\n                  <button\n                    onClick={() => { navigate(settingsRoute); setProfileOpen(false); }}\n                    className=\"flex w-full items-center gap-2.5 px-3 py-2 text-sm text-foreground hover:bg-muted rounded-lg transition-colors\"\n                  >\n                    <Settings className=\"h-4 w-4 text-muted-foreground\" />\n                    {t('common.settings')}\n                  </button>\n                </div>\n\n                <div className=\"h-px bg-border my-1.5\" />\n\n                <button\n                  onClick={handleLogout}\n                  className=\"flex w-full items-center gap-2.5 px-3 py-2 text-sm text-destructive hover:bg-destructive/10 rounded-lg transition-colors font-medium\"\n                >\n                  <LogOut className=\"h-4 w-4\" />\n                  {t('common.logout')}\n                </button>\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n    </header>\n  );\n};\n"],"mappings":"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","names":["useState","useLocation","jsx","jsxs","useState","Menu","ChevronDown","Button","useTranslation","jsx","jsxs","useTranslation","useState","Button","Menu","ChevronDown","jsx","jsxs","useLocation","useState"]}

package/dist/components/DashboardSidebar.d.ts

@@ -0,0 +1,29 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { DashboardSidebarProps } from '../types/layout.js';
+import { DashboardUser } from '../types/user.js';
+import { SidebarGroup } from '../types/sidebar.js';
+import 'lucide-react';
+
+interface DashboardSidebarPropsExtended extends DashboardSidebarProps {
+    /** Sidebar groups configuration */
+    sidebarGroups: SidebarGroup[];
+    /** Brand name */
+    brandName?: string;
+    /** Brand tagline */
+    brandTagline?: string;
+    /** Create post route */
+    createPostRoute?: string;
+    /** Auth user */
+    user?: DashboardUser;
+}
+/**
+ * Dashboard Sidebar Component
+ *
+ * Displays collapsible sidebar with navigation menu items.
+ * Supports app-based filtering (mobile/web) and collapsible groups.
+ *
+ * @param props - Dashboard sidebar props
+ */
+declare const DashboardSidebar: ({ collapsed, setCollapsed, sidebarGroups, brandName, brandTagline, createPostRoute, user, }: DashboardSidebarPropsExtended) => react_jsx_runtime.JSX.Element;
+
+export { DashboardSidebar };

package/dist/components/DashboardSidebar.js

@@ -0,0 +1,189 @@
+"use client";
+
+// src/domains/layouts/components/DashboardSidebar.tsx
+import { useState } from "react";
+import { Link, useLocation } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import { Button } from "@umituz/web-design-system/atoms";
+
+// src/domains/layouts/components/BrandLogo.tsx
+import { cn } from "@umituz/web-design-system/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+var BrandLogo = ({ className, size = 32 }) => {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 100 100",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: cn("shrink-0", className),
+      children: [
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: "15",
+            y: "65",
+            width: "70",
+            height: "15",
+            rx: "4",
+            fill: "hsl(var(--primary))"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: "25",
+            y: "25",
+            width: "12",
+            height: "40",
+            rx: "2",
+            fill: "hsl(var(--primary))"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: "44",
+            y: "35",
+            width: "12",
+            height: "30",
+            rx: "2",
+            fill: "hsl(var(--primary))"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: "63",
+            y: "20",
+            width: "12",
+            height: "45",
+            rx: "2",
+            fill: "hsl(var(--primary))"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: "20",
+            y: "45",
+            width: "60",
+            height: "10",
+            rx: "2",
+            fill: "hsl(var(--secondary))"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "circle",
+          {
+            cx: "50",
+            cy: "20",
+            r: "5",
+            fill: "hsl(var(--secondary))"
+          }
+        )
+      ]
+    }
+  );
+};
+
+// src/domains/layouts/components/DashboardSidebar.tsx
+import { PenTool, Menu, ChevronLeft, ChevronDown, ChevronRight } from "lucide-react";
+
+// src/domains/layouts/utils/dashboard.ts
+function filterSidebarItems(items, user) {
+  return items.filter((item) => {
+    if (item.enabled === false) return false;
+    if (!item.requiredApp) return true;
+    if (item.requiredApp === "mobile") return user?.hasMobileApp ?? false;
+    if (item.requiredApp === "web") return user?.hasWebApp ?? false;
+    return true;
+  });
+}
+
+// src/domains/layouts/components/DashboardSidebar.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var DashboardSidebar = ({
+  collapsed,
+  setCollapsed,
+  sidebarGroups,
+  brandName = "App",
+  brandTagline = "grow smarter",
+  createPostRoute = "/dashboard/create",
+  user
+}) => {
+  const location = useLocation();
+  const { t } = useTranslation();
+  const [collapsedGroups, setCollapsedGroups] = useState({});
+  const toggleGroup = (title) => {
+    setCollapsedGroups((prev) => ({
+      ...prev,
+      [title]: !prev[title]
+    }));
+  };
+  return /* @__PURE__ */ jsxs2("div", { className: "flex h-full flex-col", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex h-16 items-center gap-3 border-b border-sidebar-border px-4 transition-all duration-300", children: [
+      /* @__PURE__ */ jsx2(BrandLogo, { size: 32 }),
+      !collapsed && /* @__PURE__ */ jsxs2("div", { className: "flex flex-col -gap-1", children: [
+        /* @__PURE__ */ jsx2("span", { className: "text-2xl font-black text-sidebar-foreground tracking-tighter leading-none", children: brandName }),
+        /* @__PURE__ */ jsx2("span", { className: "text-[11px] font-bold text-primary/70 lowercase tracking-tight mt-2 ml-1 select-none underline decoration-primary/40 underline-offset-[6px] decoration-2", children: brandTagline })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx2("div", { className: "px-3 py-4 border-b border-sidebar-border/50", children: /* @__PURE__ */ jsx2(Link, { to: createPostRoute, children: /* @__PURE__ */ jsxs2(
+      Button,
+      {
+        variant: "default",
+        className: `w-full gap-3 shadow-glow transition-all active:scale-95 group overflow-hidden rounded-xl ${collapsed ? "px-0 justify-center h-10 w-10 mx-auto" : "justify-start px-4 h-11"}`,
+        title: collapsed ? t("sidebar.createPost") : void 0,
+        children: [
+          /* @__PURE__ */ jsx2(PenTool, { className: `shrink-0 transition-transform duration-300 ${collapsed ? "h-5 w-5" : "h-4 w-4 group-hover:scale-110"}` }),
+          !collapsed && /* @__PURE__ */ jsx2("span", { className: "font-bold tracking-tight", children: t("sidebar.createPost") })
+        ]
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx2("nav", { className: "flex-1 overflow-y-auto px-2 py-3 scrollbar-hide", children: /* @__PURE__ */ jsx2("div", { className: "space-y-6", children: sidebarGroups.map((group) => {
+      const filteredItems = filterSidebarItems(group.items, user);
+      if (filteredItems.length === 0) return null;
+      const isGroupCollapsed = collapsedGroups[group.title];
+      return /* @__PURE__ */ jsxs2("div", { className: "space-y-1", children: [
+        !collapsed && /* @__PURE__ */ jsxs2(
+          "button",
+          {
+            onClick: () => toggleGroup(group.title),
+            className: "w-full flex items-center justify-between px-3 mb-2 group/header",
+            children: [
+              /* @__PURE__ */ jsx2("span", { className: "text-[10px] font-bold uppercase tracking-widest text-sidebar-foreground/40 group-hover/header:text-sidebar-foreground/70 transition-colors", children: group.title === "sidebar.ai" ? `${brandName} AI` : t(group.title) }),
+              isGroupCollapsed ? /* @__PURE__ */ jsx2(ChevronRight, { className: "h-3 w-3 text-sidebar-foreground/30 flex-shrink-0 group-hover/header:text-sidebar-foreground/50 transition-colors" }) : /* @__PURE__ */ jsx2(ChevronDown, { className: "h-3 w-3 text-sidebar-foreground/30 flex-shrink-0 group-hover/header:text-sidebar-foreground/50 transition-colors" })
+            ]
+          }
+        ),
+        (!isGroupCollapsed || collapsed) && filteredItems.map((item) => {
+          const active = location.pathname === item.path;
+          return /* @__PURE__ */ jsxs2(
+            Link,
+            {
+              to: item.path,
+              className: `flex items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-all duration-200 ${active ? "bg-sidebar-accent text-sidebar-accent-foreground shadow-sm" : "text-sidebar-foreground/70 hover:bg-sidebar-accent/40 hover:text-sidebar-foreground"} ${collapsed ? "justify-center" : ""}`,
+              title: collapsed ? t(item.label) : void 0,
+              children: [
+                /* @__PURE__ */ jsx2(item.icon, { className: `h-4 w-4 shrink-0 transition-transform ${active && "scale-110"}` }),
+                !collapsed && /* @__PURE__ */ jsx2("span", { children: t(item.label) })
+              ]
+            },
+            item.path
+          );
+        })
+      ] }, group.title);
+    }) }) }),
+    /* @__PURE__ */ jsx2("div", { className: "border-t border-sidebar-border p-3", children: /* @__PURE__ */ jsxs2("div", { className: `flex items-center ${collapsed ? "justify-center" : "justify-between"}`, children: [
+      !collapsed && /* @__PURE__ */ jsx2("p", { className: "text-[10px] uppercase tracking-wider text-sidebar-foreground/40 font-bold px-2", children: t("sidebar.system") }),
+      /* @__PURE__ */ jsx2(Button, { variant: "ghost", size: "icon", onClick: () => setCollapsed(!collapsed), className: "text-sidebar-foreground/70", children: collapsed ? /* @__PURE__ */ jsx2(Menu, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx2(ChevronLeft, { className: "h-4 w-4" }) })
+    ] }) })
+  ] });
+};
+export {
+  DashboardSidebar
+};
+//# sourceMappingURL=DashboardSidebar.js.map