@umituz/web-dashboard 1.0.0 → 1.0.2

package/dist/domain/theme/index.d.ts

@@ -0,0 +1,45 @@
+import { DashboardThemePreset, DashboardTheme } from '../types/index.js';
+import 'lucide-react';
+
+/**
+ * Dashboard Theme System
+ *
+ * Provides theme configuration and presets for the dashboard layout.
+ * Themes are applied via CSS variables, allowing runtime customization.
+ */
+
+/**
+ * Default dashboard theme (light mode)
+ */
+declare const DEFAULT_DASHBOARD_THEME: DashboardTheme;
+/**
+ * Default dashboard theme (dark mode)
+ */
+declare const DEFAULT_DASHBOARD_THEME_DARK: DashboardTheme;
+/**
+ * Available theme presets
+ */
+declare const DASHBOARD_THEME_PRESETS: DashboardThemePreset[];
+/**
+ * Apply theme to document root via CSS variables
+ *
+ * @param theme - Theme configuration to apply
+ */
+declare function applyDashboardTheme(theme: DashboardTheme): void;
+/**
+ * Get theme preset by name
+ *
+ * @param name - Preset name
+ * @returns Theme preset or undefined
+ */
+declare function getDashboardThemePreset(name: string): DashboardThemePreset | undefined;
+/**
+ * Merge custom theme with default theme
+ *
+ * @param customTheme - Custom theme configuration
+ * @param dark - Whether to use dark mode base
+ * @returns Merged theme configuration
+ */
+declare function mergeDashboardTheme(customTheme: Partial<DashboardTheme>, dark?: boolean): DashboardTheme;
+
+export { DASHBOARD_THEME_PRESETS, DEFAULT_DASHBOARD_THEME, DEFAULT_DASHBOARD_THEME_DARK, applyDashboardTheme, getDashboardThemePreset, mergeDashboardTheme };

package/dist/domain/theme/index.js

@@ -0,0 +1,180 @@
+"use client";
+
+// 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
+  };
+}
+export {
+  DASHBOARD_THEME_PRESETS,
+  DEFAULT_DASHBOARD_THEME,
+  DEFAULT_DASHBOARD_THEME_DARK,
+  applyDashboardTheme,
+  getDashboardThemePreset,
+  mergeDashboardTheme
+};
+//# sourceMappingURL=index.js.map

package/dist/domain/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/domain/theme/index.ts"],"sourcesContent":["/**\n * Dashboard Theme System\n *\n * Provides theme configuration and presets for the dashboard layout.\n * Themes are applied via CSS variables, allowing runtime customization.\n */\n\nimport type { DashboardTheme, DashboardThemePreset } from \"../types\";\n\n// =============================================================================\n// Default Theme\n// =============================================================================\n\n/**\n * Default dashboard theme (light mode)\n */\nexport const DEFAULT_DASHBOARD_THEME: DashboardTheme = {\n  primary: \"hsl(222.2 47.4% 11.2%)\",\n  secondary: \"hsl(217.2 32.6% 17.5%)\",\n  sidebarBackground: \"hsl(222.2 47.4% 11.2%)\",\n  sidebarForeground: \"hsl(210 40% 98%)\",\n  sidebarBorder: \"hsl(217.2 32.6% 17.5%)\",\n  headerBackground: \"hsla(0, 0%, 100%, 0.8)\",\n  background: \"hsl(0 0% 100%)\",\n  foreground: \"hsl(222.2 84% 4.9%)\",\n  border: \"hsl(214.3 31.8% 91.4%)\",\n  accent: \"hsl(217.2 91.2% 59.8%)\",\n  accentForeground: \"hsl(0 0% 100%)\",\n  destructive: \"hsl(0 84.2% 60.2%)\",\n  destructiveForeground: \"hsl(0 0% 98%)\",\n  muted: \"hsl(210 40% 96.1%)\",\n  mutedForeground: \"hsl(215.4 16.3% 46.9%)\",\n  card: \"hsl(0 0% 100%)\",\n  cardForeground: \"hsl(222.2 84% 4.9%)\",\n  popover: \"hsl(0 0% 100%)\",\n  popoverForeground: \"hsl(222.2 84% 4.9%)\",\n  radius: \"0.5rem\",\n};\n\n/**\n * Default dashboard theme (dark mode)\n */\nexport const DEFAULT_DASHBOARD_THEME_DARK: DashboardTheme = {\n  primary: \"hsl(217.2 91.2% 59.8%)\",\n  secondary: \"hsl(217.2 32.6% 17.5%)\",\n  sidebarBackground: \"hsl(222.2 47.4% 11.2%)\",\n  sidebarForeground: \"hsl(210 40% 98%)\",\n  sidebarBorder: \"hsl(217.2 32.6% 17.5%)\",\n  headerBackground: \"hsla(222.2 47.4% 11.2%, 0.8)\",\n  background: \"hsl(222.2 84% 4.9%)\",\n  foreground: \"hsl(210 40% 98%)\",\n  border: \"hsl(217.2 32.6% 17.5%)\",\n  accent: \"hsl(217.2 91.2% 59.8%)\",\n  accentForeground: \"hsl(0 0% 100%)\",\n  destructive: \"hsl(0 62.8% 30.6%)\",\n  destructiveForeground: \"hsl(0 0% 98%)\",\n  muted: \"hsl(217.2 32.6% 17.5%)\",\n  mutedForeground: \"hsl(215 20.2% 65.1%)\",\n  card: \"hsl(222.2 84% 4.9%)\",\n  cardForeground: \"hsl(210 40% 98%)\",\n  popover: \"hsl(222.2 84% 4.9%)\",\n  popoverForeground: \"hsl(210 40% 98%)\",\n  radius: \"0.5rem\",\n};\n\n// =============================================================================\n// Theme Presets\n// =============================================================================\n\n/**\n * Available theme presets\n */\nexport const DASHBOARD_THEME_PRESETS: DashboardThemePreset[] = [\n  {\n    name: \"default\",\n    theme: DEFAULT_DASHBOARD_THEME,\n    dark: false,\n  },\n  {\n    name: \"default-dark\",\n    theme: DEFAULT_DASHBOARD_THEME_DARK,\n    dark: true,\n  },\n  {\n    name: \"blue\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME,\n      primary: \"hsl(221.2 83.2% 53.3%)\",\n      accent: \"hsl(221.2 83.2% 53.3%)\",\n    },\n    dark: false,\n  },\n  {\n    name: \"blue-dark\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME_DARK,\n      primary: \"hsl(221.2 83.2% 53.3%)\",\n      accent: \"hsl(221.2 83.2% 53.3%)\",\n    },\n    dark: true,\n  },\n  {\n    name: \"purple\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME,\n      primary: \"hsl(271.5 81.3% 55.9%)\",\n      accent: \"hsl(271.5 81.3% 55.9%)\",\n    },\n    dark: false,\n  },\n  {\n    name: \"purple-dark\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME_DARK,\n      primary: \"hsl(271.5 81.3% 55.9%)\",\n      accent: \"hsl(271.5 81.3% 55.9%)\",\n    },\n    dark: true,\n  },\n  {\n    name: \"green\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME,\n      primary: \"hsl(142.1 76.2% 36.3%)\",\n      accent: \"hsl(142.1 76.2% 36.3%)\",\n    },\n    dark: false,\n  },\n  {\n    name: \"green-dark\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME_DARK,\n      primary: \"hsl(142.1 76.2% 36.3%)\",\n      accent: \"hsl(142.1 76.2% 36.3%)\",\n    },\n    dark: true,\n  },\n  {\n    name: \"orange\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME,\n      primary: \"hsl(24.6 95% 53.1%)\",\n      accent: \"hsl(24.6 95% 53.1%)\",\n    },\n    dark: false,\n  },\n  {\n    name: \"orange-dark\",\n    theme: {\n      ...DEFAULT_DASHBOARD_THEME_DARK,\n      primary: \"hsl(24.6 95% 53.1%)\",\n      accent: \"hsl(24.6 95% 53.1%)\",\n    },\n    dark: true,\n  },\n];\n\n// =============================================================================\n// Theme Utilities\n// =============================================================================\n\n/**\n * Apply theme to document root via CSS variables\n *\n * @param theme - Theme configuration to apply\n */\nexport function applyDashboardTheme(theme: DashboardTheme): void {\n  if (typeof document === \"undefined\") return;\n\n  const root = document.documentElement;\n\n  // Map theme keys to CSS variable names\n  const cssVars: Record<string, string | undefined> = {\n    \"--primary\": theme.primary,\n    \"--secondary\": theme.secondary,\n    \"--sidebar\": theme.sidebarBackground,\n    \"--sidebar-foreground\": theme.sidebarForeground,\n    \"--sidebar-border\": theme.sidebarBorder,\n    \"--background\": theme.background,\n    \"--foreground\": theme.foreground,\n    \"--border\": theme.border,\n    \"--accent\": theme.accent,\n    \"--accent-foreground\": theme.accentForeground,\n    \"--destructive\": theme.destructive,\n    \"--destructive-foreground\": theme.destructiveForeground,\n    \"--muted\": theme.muted,\n    \"--muted-foreground\": theme.mutedForeground,\n    \"--card\": theme.card,\n    \"--card-foreground\": theme.cardForeground,\n    \"--popover\": theme.popover,\n    \"--popover-foreground\": theme.popoverForeground,\n    \"--radius\": theme.radius,\n  };\n\n  // Apply CSS variables\n  Object.entries(cssVars).forEach(([key, value]) => {\n    if (value) {\n      root.style.setProperty(key, value);\n    }\n  });\n}\n\n/**\n * Get theme preset by name\n *\n * @param name - Preset name\n * @returns Theme preset or undefined\n */\nexport function getDashboardThemePreset(name: string): DashboardThemePreset | undefined {\n  return DASHBOARD_THEME_PRESETS.find((preset) => preset.name === name);\n}\n\n/**\n * Merge custom theme with default theme\n *\n * @param customTheme - Custom theme configuration\n * @param dark - Whether to use dark mode base\n * @returns Merged theme configuration\n */\nexport function mergeDashboardTheme(\n  customTheme: Partial<DashboardTheme>,\n  dark = false\n): DashboardTheme {\n  const baseTheme = dark ? DEFAULT_DASHBOARD_THEME_DARK : DEFAULT_DASHBOARD_THEME;\n  return {\n    ...baseTheme,\n    ...customTheme,\n  } as DashboardTheme;\n}\n"],"mappings":"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","names":[]}

package/dist/domain/types/index.d.ts

@@ -0,0 +1,167 @@
+import { LucideIcon } from 'lucide-react';
+
+/**
+ * Dashboard Types
+ *
+ * Core type definitions for the dashboard layout system
+ */
+
+/**
+ * Single sidebar menu item
+ */
+interface SidebarItem {
+    /** Display label (can be i18n key) */
+    label: string;
+    /** Icon from lucide-react */
+    icon: LucideIcon;
+    /** Route path */
+    path: string;
+    /** Filter by app type (optional) */
+    requiredApp?: 'mobile' | 'web';
+    /** Enable/disable this item (default: true) */
+    enabled?: boolean;
+}
+/**
+ * Group of sidebar items with a title
+ */
+interface SidebarGroup {
+    /** Group title (can be i18n key) */
+    title: string;
+    /** Items in this group */
+    items: SidebarItem[];
+    /** Optional: Route to title mapping for page headers */
+    titleMap?: Record<string, string>;
+}
+/**
+ * Dashboard header props
+ */
+interface DashboardHeaderProps {
+    /** Whether sidebar is collapsed */
+    collapsed: boolean;
+    /** Toggle sidebar collapsed state */
+    setCollapsed: (collapsed: boolean) => void;
+    /** Toggle mobile menu open state */
+    setMobileOpen: (open: boolean) => void;
+    /** Current page title */
+    title: string;
+}
+/**
+ * Dashboard sidebar props
+ */
+interface DashboardSidebarProps {
+    /** Whether sidebar is collapsed */
+    collapsed: boolean;
+    /** Toggle sidebar collapsed state */
+    setCollapsed: (collapsed: boolean) => void;
+}
+/**
+ * Dashboard layout configuration
+ */
+interface DashboardLayoutConfig {
+    /** Sidebar groups */
+    sidebarGroups: SidebarGroup[];
+    /** Extra title mappings for routes */
+    extraTitleMap?: Record<string, string>;
+    /** Brand name */
+    brandName?: string;
+    /** Brand tagline */
+    brandTagline?: string;
+}
+/**
+ * Dashboard theme configuration
+ * Extends CSS variables for customization
+ */
+interface DashboardTheme {
+    /** Primary color (CSS variable compatible) */
+    primary?: string;
+    /** Secondary color */
+    secondary?: string;
+    /** Sidebar background */
+    sidebarBackground?: string;
+    /** Sidebar foreground */
+    sidebarForeground?: string;
+    /** Sidebar border */
+    sidebarBorder?: string;
+    /** Header background */
+    headerBackground?: string;
+    /** Background color */
+    background?: string;
+    /** Foreground color */
+    foreground?: string;
+    /** Border color */
+    border?: string;
+    /** Accent color */
+    accent?: string;
+    /** Accent foreground */
+    accentForeground?: string;
+    /** Destructive color */
+    destructive?: string;
+    /** Destructive foreground */
+    destructiveForeground?: string;
+    /** Muted background */
+    muted?: string;
+    /** Muted foreground */
+    mutedForeground?: string;
+    /** Card background */
+    card?: string;
+    /** Card foreground */
+    cardForeground?: string;
+    /** Popover background */
+    popover?: string;
+    /** Popover foreground */
+    popoverForeground?: string;
+    /** Radius (border-radius) */
+    radius?: string;
+}
+/**
+ * Theme preset for quick setup
+ */
+interface DashboardThemePreset {
+    /** Preset name */
+    name: string;
+    /** Theme configuration */
+    theme: DashboardTheme;
+    /** Whether this is a dark theme */
+    dark?: boolean;
+}
+/**
+ * Notification item
+ */
+interface DashboardNotification {
+    /** Unique ID */
+    id: string;
+    /** Notification text */
+    text: string;
+    /** Whether notification is read */
+    read: boolean;
+    /** Creation timestamp */
+    createdAt: Date | string | number;
+}
+/**
+ * User profile info for header
+ */
+interface DashboardUser {
+    /** User ID */
+    id: string;
+    /** Display name */
+    name?: string;
+    /** Email address */
+    email?: string;
+    /** Avatar URL */
+    avatar?: string;
+}
+/**
+ * Navigation item for user menu
+ */
+interface UserNavMenuItem {
+    /** Display label */
+    label: string;
+    /** Icon component */
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    /** Route path */
+    path: string;
+}
+
+export type { DashboardHeaderProps, DashboardLayoutConfig, DashboardNotification, DashboardSidebarProps, DashboardTheme, DashboardThemePreset, DashboardUser, SidebarGroup, SidebarItem, UserNavMenuItem };

package/dist/domain/types/index.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=index.js.map

package/dist/domain/types/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+export { BrandLogo, DashboardHeader, DashboardLayout, DashboardLayout as DashboardLayoutDefault, DashboardSidebar } from './presentation/index.js';
+export { DashboardHeaderProps, DashboardLayoutConfig, DashboardNotification, DashboardSidebarProps, DashboardTheme, DashboardThemePreset, DashboardUser, SidebarGroup, SidebarItem, UserNavMenuItem } from './domain/types/index.js';
+export { DASHBOARD_THEME_PRESETS, DEFAULT_DASHBOARD_THEME, DEFAULT_DASHBOARD_THEME_DARK, applyDashboardTheme, getDashboardThemePreset, mergeDashboardTheme } from './domain/theme/index.js';
+export { useNotifications, useSidebar } from './infrastructure/hooks/index.js';
+export { filterSidebarItems, formatNotificationTime, generateNotificationId, getPageTitle, isPathActive } from './infrastructure/utils/index.js';
+import 'react/jsx-runtime';
+import 'lucide-react';
+import 'react';