@pattern-stack/frontend-patterns 0.0.4 → 0.0.6

package/dist/index.js

@@ -7,19 +7,18 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const clsx = require("clsx");
 const tailwindMerge = require("tailwind-merge");
 const React = require("react");
+const jsxRuntime = require("react/jsx-runtime");
+const lucideReact = require("lucide-react");
 const classVarianceAuthority = require("class-variance-authority");
 const axios = require("axios");
 const reactQuery = require("@tanstack/react-query");
-const jsxRuntime = require("react/jsx-runtime");
 const reactSlot = require("@radix-ui/react-slot");
 const LabelPrimitive = require("@radix-ui/react-label");
 const AvatarPrimitive = require("@radix-ui/react-avatar");
 const DropdownMenuPrimitive = require("@radix-ui/react-dropdown-menu");
-const lucideReact = require("lucide-react");
 const reactDom = require("react-dom");
 const reactRouterDom = require("react-router-dom");
 const client = require("react-dom/client");
-require("@tanstack/react-query-devtools");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -265,6 +264,240 @@ const tooltipContent = {
   profile: "Profile",
   account: "Account settings"
 };
+class MetricCalculationEngine {
+  static calculateMetric(config, data, previousData) {
+    const currentValue = this.aggregateValue(config, data);
+    const previousValue = previousData ? this.aggregateValue(config, previousData) : void 0;
+    const trend = this.calculateTrend(currentValue, previousValue);
+    const formattedValue = this.formatValue(currentValue, config.format, config.type);
+    const target = typeof config.target === "function" ? config.target(data) : config.target;
+    return {
+      current: currentValue,
+      previous: previousValue,
+      trend,
+      target,
+      formattedValue
+    };
+  }
+  static aggregateValue(config, data) {
+    if (!data.length) return 0;
+    const values = data.map((item) => {
+      const value = this.extractValue(item, config.key);
+      return typeof value === "number" ? value : 0;
+    }).filter((value) => !isNaN(value));
+    if (!values.length) return 0;
+    switch (config.aggregation || "sum") {
+      case "sum":
+        return values.reduce((sum, value) => sum + value, 0);
+      case "avg":
+        return values.reduce((sum, value) => sum + value, 0) / values.length;
+      case "count":
+        return values.length;
+      case "min":
+        return Math.min(...values);
+      case "max":
+        return Math.max(...values);
+      default:
+        return values.reduce((sum, value) => sum + value, 0);
+    }
+  }
+  static extractValue(item, key) {
+    return key.split(".").reduce((obj, k) => obj == null ? void 0 : obj[k], item);
+  }
+  static calculateTrend(current, previous) {
+    if (previous === void 0 || previous === 0) return "neutral";
+    const change = (current - previous) / Math.abs(previous) * 100;
+    if (change > 1) return "up";
+    if (change < -1) return "down";
+    return "neutral";
+  }
+  static formatValue(value, format, type) {
+    let formatted = value;
+    if ((format == null ? void 0 : format.decimals) !== void 0) {
+      formatted = Number(value.toFixed(format.decimals));
+    }
+    let result = formatted.toString();
+    if ((format == null ? void 0 : format.thousands) !== false && Math.abs(formatted) >= 1e3) {
+      result = formatted.toLocaleString();
+    }
+    switch (type) {
+      case "currency":
+        result = new Intl.NumberFormat("en-US", {
+          style: "currency",
+          currency: "USD",
+          minimumFractionDigits: (format == null ? void 0 : format.decimals) ?? 2,
+          maximumFractionDigits: (format == null ? void 0 : format.decimals) ?? 2
+        }).format(formatted);
+        break;
+      case "percentage":
+        result = `${formatted.toFixed((format == null ? void 0 : format.decimals) ?? 1)}%`;
+        break;
+      case "duration":
+        result = this.formatDuration(formatted);
+        break;
+      case "ratio":
+        result = `${formatted.toFixed((format == null ? void 0 : format.decimals) ?? 2)}:1`;
+        break;
+      default:
+        if (format == null ? void 0 : format.prefix) result = format.prefix + result;
+        if (format == null ? void 0 : format.suffix) result = result + format.suffix;
+    }
+    return result;
+  }
+  static formatDuration(minutes) {
+    const hours = Math.floor(minutes / 60);
+    const mins = Math.floor(minutes % 60);
+    if (hours > 0) {
+      return `${hours}h ${mins}m`;
+    }
+    return `${mins}m`;
+  }
+  static calculateTrendData(config, data, dateField = "date", periods = 12) {
+    const groupedData = this.groupByPeriod(data, dateField);
+    const sortedDates = Object.keys(groupedData).sort();
+    return sortedDates.slice(-periods).map((date) => ({
+      date,
+      value: this.aggregateValue(config, groupedData[date]),
+      label: this.formatDateLabel(date)
+    }));
+  }
+  static groupByPeriod(data, dateField) {
+    return data.reduce((groups, item) => {
+      const date = this.extractValue(item, dateField);
+      if (!date) return groups;
+      const period = new Date(date).toISOString().split("T")[0];
+      if (!groups[period]) groups[period] = [];
+      groups[period].push(item);
+      return groups;
+    }, {});
+  }
+  static formatDateLabel(dateString) {
+    const date = new Date(dateString);
+    return date.toLocaleDateString("en-US", {
+      month: "short",
+      day: "numeric"
+    });
+  }
+  static calculateCategoryBreakdown(data, categoryField, valueField, maxCategories = 8) {
+    const groups = data.reduce((acc, item) => {
+      const category = String(this.extractValue(item, categoryField) || "Unknown");
+      const value = this.extractValue(item, valueField) || 0;
+      if (!acc[category]) acc[category] = 0;
+      acc[category] += typeof value === "number" ? value : 0;
+      return acc;
+    }, {});
+    const total = Object.values(groups).reduce((sum, value) => sum + value, 0);
+    let categories = Object.entries(groups).map(([category, value]) => ({
+      category,
+      value,
+      percentage: total > 0 ? value / total * 100 : 0
+    })).sort((a, b) => b.value - a.value);
+    if (categories.length > maxCategories) {
+      const topCategories = categories.slice(0, maxCategories - 1);
+      const otherValue = categories.slice(maxCategories - 1).reduce((sum, cat) => sum + cat.value, 0);
+      topCategories.push({
+        category: "Other",
+        value: otherValue,
+        percentage: total > 0 ? otherValue / total * 100 : 0
+      });
+      categories = topCategories;
+    }
+    return categories;
+  }
+  static detectInsights(metrics, thresholds = {}) {
+    const insights = [];
+    for (const [key, metric] of Object.entries(metrics)) {
+      const threshold = thresholds[key];
+      if (metric.target && metric.current < metric.target * 0.8) {
+        insights.push({
+          type: "negative",
+          message: `${key} is significantly below target`,
+          value: metric.current
+        });
+      }
+      if (metric.trend === "up" && metric.previous && metric.current > metric.previous * 1.2) {
+        insights.push({
+          type: "positive",
+          message: `${key} showing strong growth`,
+          value: metric.current
+        });
+      }
+      if (threshold && metric.current >= threshold.critical) {
+        insights.push({
+          type: "negative",
+          message: `${key} has reached critical threshold`,
+          value: metric.current
+        });
+      }
+    }
+    return insights.slice(0, 5);
+  }
+}
+const iconMap = {
+  Palette: lucideReact.Palette,
+  Menu: lucideReact.Menu,
+  X: lucideReact.X,
+  Shield: lucideReact.Shield,
+  Users: lucideReact.Users,
+  BarChart3: lucideReact.BarChart3,
+  Database: lucideReact.Database,
+  TrendingUp: lucideReact.TrendingUp,
+  Layout: lucideReact.Layout,
+  Home: lucideReact.Home,
+  Settings: lucideReact.Settings,
+  Bell: lucideReact.Bell,
+  Search: lucideReact.Search,
+  Plus: lucideReact.Plus,
+  Edit: lucideReact.Edit,
+  Trash2: lucideReact.Trash2,
+  Eye: lucideReact.Eye,
+  Download: lucideReact.Download,
+  Upload: lucideReact.Upload,
+  Share: lucideReact.Share,
+  Lock: lucideReact.Lock,
+  Unlock: lucideReact.Unlock,
+  Mail: lucideReact.Mail,
+  Phone: lucideReact.Phone,
+  Calendar: lucideReact.Calendar,
+  Clock: lucideReact.Clock,
+  MapPin: lucideReact.MapPin,
+  Star: lucideReact.Star,
+  Heart: lucideReact.Heart,
+  Bookmark: lucideReact.Bookmark,
+  Tag: lucideReact.Tag,
+  Flag: lucideReact.Flag,
+  File: lucideReact.File,
+  Folder: lucideReact.Folder,
+  Image: lucideReact.Image,
+  Video: lucideReact.Video,
+  Music: lucideReact.Music,
+  ChevronRight: lucideReact.ChevronRight,
+  ChevronDown: lucideReact.ChevronDown,
+  ChevronLeft: lucideReact.ChevronLeft,
+  ChevronUp: lucideReact.ChevronUp,
+  ArrowRight: lucideReact.ArrowRight,
+  ArrowLeft: lucideReact.ArrowLeft,
+  ArrowUp: lucideReact.ArrowUp,
+  ArrowDown: lucideReact.ArrowDown,
+  Check: lucideReact.Check,
+  AlertCircle: lucideReact.AlertCircle,
+  Info: lucideReact.Info,
+  HelpCircle: lucideReact.HelpCircle
+};
+const Icon = ({ name, className = "w-5 h-5", size, ...props }) => {
+  const IconComponent = iconMap[name];
+  if (!IconComponent) {
+    console.warn(`Icon "${name}" not found. Using default Menu icon.`);
+    return /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Menu, { className, size, ...props });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { className, size, ...props });
+};
+const getIcon = (name) => {
+  return iconMap[name] || lucideReact.Menu;
+};
+const isValidIcon = (name) => {
+  return name in iconMap;
+};
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
@@ -1286,6 +1519,83 @@ const DataBadge = ({
   }
   return badge;
 };
+const getStageStatus = (stage) => {
+  switch (stage) {
+    case "Closed Won":
+      return "success";
+    case "Negotiation":
+      return "warning";
+    case "Proposal Sent":
+      return "info";
+    case "Qualified":
+      return "info";
+    case "Discovery":
+      return "neutral";
+    default:
+      return "neutral";
+  }
+};
+const SalesPanel = ({
+  sales,
+  onSaleClick,
+  onClose
+}) => {
+  const topDeals = sales.slice(0, 5);
+  const totalValue = sales.reduce((sum, sale) => sum + sale.amount, 0);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed right-0 top-16 h-[calc(100vh-4rem)] w-72 bg-background border-l border-border shadow-lg flex flex-col z-30", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-3 border-b border-border", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "font-medium flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Target, { className: "w-4 h-4" }),
+        "Pipeline"
+      ] }),
+      onClose && /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, children: "×" })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-3 border-b border-border", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: "Total Value" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-semibold text-green-600", children: [
+          "$",
+          totalValue.toLocaleString()
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: "Active Deals" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: sales.length })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 overflow-auto p-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-medium mb-3", children: "Recent Opportunities" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: topDeals.map((sale) => /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "p-2 border border-border rounded-md hover:bg-muted/50 cursor-pointer transition-colors",
+          onClick: () => onSaleClick == null ? void 0 : onSaleClick(sale),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-start mb-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium truncate", children: sale.customer }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground truncate", children: sale.product })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-right ml-2", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm font-semibold text-green-600", children: [
+                "$",
+                sale.amount.toLocaleString()
+              ] }) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(DataBadge, { variant: "status", status: getStageStatus(sale.stage), children: sale.stage }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: sale.salesperson })
+            ] })
+          ]
+        },
+        sale.id
+      )) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-3 border-t border-border", children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", className: "w-full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ExternalLink, { className: "w-4 h-4 mr-2" }),
+      "View All Deals"
+    ] }) })
+  ] });
+};
 const StatCard = ({
   title,
   value,
@@ -5550,6 +5860,42 @@ const useSidebar = () => {
   }
   return context;
 };
+const NavigationContext = React.createContext(void 0);
+const defaultShowcaseNavigation = [
+  { value: "showcase", label: "Showcase", icon: "Palette", path: "/showcase", category: 5 },
+  { value: "admin-dashboard", label: "Admin Dashboard", icon: "Shield", path: "/admin/dashboard", category: 2 },
+  { value: "admin-users", label: "User Management", icon: "Users", path: "/admin/users", category: 3 },
+  { value: "admin-sales", label: "Sales Dashboard", icon: "TrendingUp", path: "/admin/sales", category: 4 },
+  { value: "entity-performance", label: "Performance Dashboard", icon: "BarChart3", path: "/entity/performance", category: 6 },
+  { value: "entity-management", label: "Entity Management", icon: "Database", path: "/entity/management", category: 7 },
+  { value: "entity-template", label: "Template Example", icon: "Layout", path: "/entity/template-example", category: 1 }
+];
+const NavigationProvider = ({ children, initialNavigation }) => {
+  const [navigation, setNavigation] = React.useState(
+    initialNavigation || {
+      items: defaultShowcaseNavigation,
+      showDefaultNavigation: true,
+      defaultExpanded: true
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(NavigationContext.Provider, { value: { navigation, setNavigation }, children });
+};
+const useNavigation = () => {
+  const context = React.useContext(NavigationContext);
+  if (context === void 0) {
+    throw new Error("useNavigation must be used within a NavigationProvider");
+  }
+  return context;
+};
+const getNavigationItems = (config) => {
+  if (config.items.length > 0) {
+    return config.items;
+  }
+  if (config.showDefaultNavigation !== false) {
+    return defaultShowcaseNavigation;
+  }
+  return [];
+};
 const SidebarButton = ({
   icon,
   label,
@@ -5557,13 +5903,16 @@ const SidebarButton = ({
   category = 1,
   expanded = false,
   onClick,
-  className
+  className,
+  badge,
+  disabled = false
 }) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Button,
     {
       variant: active ? "secondary" : "ghost",
       onClick,
+      disabled,
       tooltip: !expanded ? label : void 0,
       className: cn(
         "relative w-full justify-start gap-3 h-12",
@@ -5597,12 +5946,19 @@ const SidebarButton = ({
             "text-sm font-medium flex-1 text-left",
             active ? `text-category-${category}` : "text-foreground"
           ), children: label }),
-          active && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+          badge ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+            "px-2 py-0.5 text-xs font-medium rounded-full flex-shrink-0",
+            "bg-primary/10 text-primary"
+          ), children: badge }) : active && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
             "w-2 h-2 rounded-full flex-shrink-0",
             `bg-category-${category}`
           ) })
         ] }),
-        !expanded && active && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -top-1 -right-1", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
+        !expanded && (badge || active) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -top-1 -right-1", children: badge ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+          "px-1.5 py-0.5 text-xs font-bold rounded-full",
+          "bg-primary text-primary-foreground",
+          "ring-2 ring-background"
+        ), children: badge }) : active && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(
           "w-2.5 h-2.5 rounded-full",
           `bg-category-${category}`,
           "ring-2 ring-background"
@@ -5613,14 +5969,11 @@ const SidebarButton = ({
 };
 const Sidebar = ({ className }) => {
   const { isExpanded, toggleSidebar } = useSidebar();
+  const { navigation } = useNavigation();
   const location = reactRouterDom.useLocation();
   const navigate = reactRouterDom.useNavigate();
   const [searchParams] = reactRouterDom.useSearchParams();
-  const items = [
-    { value: "showcase", label: "Showcase", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Palette, { className: "w-5 h-5" }), path: "/showcase", category: 5 },
-    { value: "admin-dashboard", label: "Admin Dashboard", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Shield, { className: "w-5 h-5" }), path: "/admin/dashboard", category: 2 },
-    { value: "admin-users", label: "User Management", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Users, { className: "w-5 h-5" }), path: "/admin/users", category: 3 }
-  ];
+  const items = getNavigationItems(navigation);
   const handleNavigation = (path) => {
     if (path.includes("?")) {
       const [basePath, query] = path.split("?");
@@ -5676,12 +6029,14 @@ const Sidebar = ({ className }) => {
           return /* @__PURE__ */ jsxRuntime.jsx(
             SidebarButton,
             {
-              icon: item.icon,
+              icon: /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, className: "w-5 h-5" }),
               label: item.label,
               active: isActive,
               category: item.category,
               expanded: isExpanded,
-              onClick: () => handleNavigation(item.path)
+              onClick: () => handleNavigation(item.path),
+              badge: item.badge,
+              disabled: item.disabled
             },
             item.value
           );
@@ -5747,6 +6102,28 @@ const AppLayout = () => {
     )
   ] });
 };
+const DashboardWithSidePanel = ({
+  children,
+  sidePanel,
+  showSidePanel = false,
+  sidePanelWidth = 72,
+  className
+}) => {
+  const marginClass = `pr-${sidePanelWidth}`;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative h-full", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn(
+          "transition-all duration-300",
+          showSidePanel ? marginClass : ""
+        ),
+        children
+      }
+    ),
+    showSidePanel && sidePanel
+  ] });
+};
 const SectionHeader = ({
   title,
   description,
@@ -7769,6 +8146,7 @@ function createReactApp(config) {
     enableQuery = true,
     enableRouting = true,
     auth,
+    navigation,
     customProviders = []
   } = appConfig;
   const queryClient = new reactQuery.QueryClient({
@@ -7803,7 +8181,7 @@ function createReactApp(config) {
       tree = /* @__PURE__ */ jsxRuntime.jsx(Provider, { children: tree }, Provider.name);
     });
     if (enableRouting) {
-      tree = /* @__PURE__ */ jsxRuntime.jsx(SidebarProvider, { children: tree });
+      tree = /* @__PURE__ */ jsxRuntime.jsx(NavigationProvider, { initialNavigation: navigation, children: /* @__PURE__ */ jsxRuntime.jsx(SidebarProvider, { children: tree }) });
     }
     if (enableAuth) {
       tree = /* @__PURE__ */ jsxRuntime.jsx(AuthProvider, { config: auth, children: tree });
@@ -10069,6 +10447,7 @@ exports.DarkModeToggle = DarkModeToggle;
 exports.DashboardCard = DashboardCard;
 exports.DashboardGrid = DashboardGrid;
 exports.DashboardTemplate = DashboardTemplate;
+exports.DashboardWithSidePanel = DashboardWithSidePanel;
 exports.DataBadge = DataBadge;
 exports.DataDetailTemplate = DataDetailTemplate;
 exports.DataTable = DataTable;
@@ -10096,14 +10475,17 @@ exports.FileUpload = FileUpload;
 exports.FormField = FormField;
 exports.FormGroup = FormGroup;
 exports.GlobalSearch = GlobalSearch;
+exports.Icon = Icon;
 exports.IconBadge = IconBadge;
 exports.Input = Input;
 exports.Label = Label;
 exports.Loading = Loading;
 exports.LoginForm = LoginForm;
 exports.LogoutButton = LogoutButton;
+exports.MetricCalculationEngine = MetricCalculationEngine;
 exports.Modal = Modal;
 exports.NavMenu = NavMenu;
+exports.NavigationProvider = NavigationProvider;
 exports.PageTemplate = PageTemplate;
 exports.Pagination = Pagination;
 exports.PaletteSwitcher = PaletteSwitcher;
@@ -10111,6 +10493,7 @@ exports.ProgressBar = ProgressBar;
 exports.ProtectedRoute = ProtectedRoute;
 exports.RESPONSIVE_CHART_HEIGHTS = RESPONSIVE_CHART_HEIGHTS;
 exports.ROUTES = ROUTES;
+exports.SalesPanel = SalesPanel;
 exports.SearchInput = SearchInput;
 exports.SectionHeader = SectionHeader;
 exports.Select = Select;
@@ -10119,6 +10502,7 @@ exports.SelectItem = SelectItem;
 exports.SelectTrigger = SelectTrigger;
 exports.SelectValue = SelectValue;
 exports.ShowcaseSection = ShowcaseSection;
+exports.Sidebar = Sidebar;
 exports.SidebarButton = SidebarButton;
 exports.SidebarProvider = SidebarProvider;
 exports.Skeleton = Skeleton;
@@ -10154,7 +10538,10 @@ exports.formatNumberWithTooltip = formatNumberWithTooltip;
 exports.getAnimationClasses = getAnimationClasses;
 exports.getChartHeight = getChartHeight;
 exports.getContainerHeightClass = getContainerHeightClass;
+exports.getIcon = getIcon;
+exports.getNavigationItems = getNavigationItems;
 exports.interactionVariants = interactionVariants;
+exports.isValidIcon = isValidIcon;
 exports.legacyPatterns = legacyPatterns;
 exports.setGlobalAuthService = setGlobalAuthService;
 exports.tooltipContent = tooltipContent;
@@ -10164,6 +10551,7 @@ exports.useAuth = useAuth;
 exports.useCreateExample = useCreateExample;
 exports.useDeleteExample = useDeleteExample;
 exports.useGetExample = useGetExample;
+exports.useNavigation = useNavigation;
 exports.usePermissions = usePermissions;
 exports.useSidebar = useSidebar;
 exports.useTextOverflow = useTextOverflow;