@manago/admin 0.1.0

package/dist/index.mjs

@@ -0,0 +1,1465 @@
+import { create } from 'zustand';
+import { persist } from 'zustand/middleware';
+import * as React9 from 'react';
+import { createContext, useContext, useState, useEffect, useMemo } from 'react';
+import { QueryClient, useQuery, QueryClientProvider } from '@tanstack/react-query';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { createRootRoute, Outlet, createRoute, useRouterState, Link, createBrowserHistory, createRouter, RouterProvider } from '@tanstack/react-router';
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { X, PanelLeft, ChevronRight, Check, Circle, Package, ShoppingCart, Users, DollarSign, LayoutDashboard, CreditCard, UserCog, Settings } from 'lucide-react';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+import * as SheetPrimitive from '@radix-ui/react-dialog';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// src/lib/stores/auth-store.ts
+var auth_store_exports = {};
+__export(auth_store_exports, {
+  useAuthStore: () => useAuthStore,
+  useHasHydrated: () => useHasHydrated
+});
+var useAuthStore, useHasHydrated;
+var init_auth_store = __esm({
+  "src/lib/stores/auth-store.ts"() {
+    "use client";
+    useAuthStore = create()(
+      persist(
+        (set) => ({
+          user: null,
+          token: null,
+          isAuthenticated: false,
+          login: (user, token) => set({ user, token, isAuthenticated: true }),
+          logout: () => set({ user: null, token: null, isAuthenticated: false })
+        }),
+        {
+          name: "manago-auth",
+          skipHydration: true
+        }
+      )
+    );
+    useHasHydrated = () => {
+      const [hasHydrated, setHasHydrated] = useState(false);
+      useEffect(() => {
+        useAuthStore.persist.rehydrate();
+        setHasHydrated(true);
+      }, []);
+      return hasHydrated;
+    };
+  }
+});
+
+// src/lib/api-client.ts
+var ManagoAPIClient = class {
+  constructor(config) {
+    this.apiKey = config.apiKey;
+    this.baseURL = config.baseURL || "http://localhost:3001/api";
+  }
+  async request(endpoint, options) {
+    let token = null;
+    if (typeof window !== "undefined") {
+      try {
+        const { useAuthStore: useAuthStore2 } = await Promise.resolve().then(() => (init_auth_store(), auth_store_exports));
+        token = useAuthStore2.getState().token;
+      } catch (e) {
+      }
+    }
+    const headers = {
+      "Content-Type": "application/json",
+      "x-api-key": this.apiKey,
+      ...token && { Authorization: `Bearer ${token}` },
+      ...options?.headers
+    };
+    const response = await fetch(`${this.baseURL}${endpoint}`, {
+      ...options,
+      headers
+    });
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.message || `API Error: ${response.statusText}`);
+    }
+    return response.json();
+  }
+  // Auth
+  async login(email, password) {
+    return this.request("/auth/login", {
+      method: "POST",
+      body: JSON.stringify({ email, password })
+    });
+  }
+  // Products
+  async getProducts(params) {
+    const query = new URLSearchParams(params).toString();
+    return this.request(`/products${query ? `?${query}` : ""}`);
+  }
+  async getProduct(id) {
+    return this.request(`/products/${id}`);
+  }
+  async createProduct(data) {
+    return this.request("/products", {
+      method: "POST",
+      body: JSON.stringify(data)
+    });
+  }
+  async updateProduct(id, data) {
+    return this.request(`/products/${id}`, {
+      method: "PUT",
+      body: JSON.stringify(data)
+    });
+  }
+  async deleteProduct(id) {
+    return this.request(`/products/${id}`, {
+      method: "DELETE"
+    });
+  }
+  // Orders
+  async getOrders(params) {
+    const query = new URLSearchParams(params).toString();
+    return this.request(`/orders${query ? `?${query}` : ""}`);
+  }
+  // Customers
+  async getCustomers(params) {
+    const query = new URLSearchParams(params).toString();
+    return this.request(`/customers${query ? `?${query}` : ""}`);
+  }
+  // Settings
+  async getSettings() {
+    return this.request("/settings");
+  }
+  async updateSettings(data) {
+    return this.request("/settings", {
+      method: "PUT",
+      body: JSON.stringify(data)
+    });
+  }
+};
+
+// src/lib/default-config.ts
+var defaultConfig = {
+  appName: "Manago",
+  menu: {
+    dashboard: true,
+    products: true,
+    orders: true,
+    customers: true,
+    payments: true,
+    users: true,
+    settings: true
+  },
+  features: {
+    multiUser: true,
+    analytics: true,
+    exports: true
+  },
+  theme: {
+    primaryColor: "#3B82F6",
+    sidebarBg: "#FFFFFF"
+  }
+};
+var ConfigContext = createContext(defaultConfig);
+function ConfigProvider({
+  config,
+  children
+}) {
+  const mergedConfig = {
+    ...defaultConfig,
+    ...config,
+    menu: {
+      ...defaultConfig.menu,
+      ...config?.menu
+    },
+    features: {
+      ...defaultConfig.features,
+      ...config?.features
+    },
+    theme: {
+      ...defaultConfig.theme,
+      ...config?.theme
+    }
+  };
+  return /* @__PURE__ */ jsx(ConfigContext.Provider, { value: mergedConfig, children });
+}
+function useAdminConfig() {
+  return useContext(ConfigContext);
+}
+var queryClient = new QueryClient();
+var ManagoContext = createContext(null);
+function ManagoProvider({
+  apiKey,
+  config,
+  children
+}) {
+  const api = new ManagoAPIClient({ apiKey });
+  return /* @__PURE__ */ jsx(ManagoContext.Provider, { value: { api }, children: /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx(ConfigProvider, { config: config || {}, children }) }) });
+}
+function useManagoAPI() {
+  const context = useContext(ManagoContext);
+  if (!context) {
+    throw new Error("useManagoAPI must be used within ManagoProvider");
+  }
+  return context.api;
+}
+
+// src/manago-admin.tsx
+init_auth_store();
+
+// src/pages/login.tsx
+init_auth_store();
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-10 px-4 py-2",
+        sm: "h-9 rounded-md px-3",
+        lg: "h-11 rounded-md px-8",
+        icon: "h-10 w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React9.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var Input = React9.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        type,
+        className: cn(
+          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+var labelVariants = cva(
+  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+);
+var Label = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  LabelPrimitive.Root,
+  {
+    ref,
+    className: cn(labelVariants(), className),
+    ...props
+  }
+));
+Label.displayName = LabelPrimitive.Root.displayName;
+var Card = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn(
+      "rounded-lg border bg-card text-card-foreground shadow-sm",
+      className
+    ),
+    ...props
+  }
+));
+Card.displayName = "Card";
+var CardHeader = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn("flex flex-col space-y-1.5 p-6", className),
+    ...props
+  }
+));
+CardHeader.displayName = "CardHeader";
+var CardTitle = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn(
+      "text-2xl font-semibold leading-none tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+CardContent.displayName = "CardContent";
+var CardFooter = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: cn("flex items-center p-6 pt-0", className),
+    ...props
+  }
+));
+CardFooter.displayName = "CardFooter";
+function LoginPage() {
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState("");
+  const [loading, setLoading] = useState(false);
+  const api = useManagoAPI();
+  const { login } = useAuthStore();
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError("");
+    setLoading(true);
+    try {
+      const response = await api.login(email, password);
+      login(response.user, response.token);
+    } catch (err) {
+      setError(err.message || "Invalid credentials");
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsx("div", { className: "min-h-screen flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ jsxs(Card, { className: "w-full max-w-md", children: [
+    /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { className: "text-2xl text-center", children: "Admin Login" }) }),
+    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "Email" }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "email",
+            type: "email",
+            value: email,
+            onChange: (e) => setEmail(e.target.value),
+            placeholder: "admin@example.com",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Password" }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: "password",
+            type: "password",
+            value: password,
+            onChange: (e) => setPassword(e.target.value),
+            placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+            required: true
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error }),
+      /* @__PURE__ */ jsx(Button, { type: "submit", className: "w-full", disabled: loading, children: loading ? "Logging in..." : "Login" })
+    ] }) })
+  ] }) });
+}
+var MOBILE_BREAKPOINT = 768;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = React9.useState(void 0);
+  React9.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return !!isMobile;
+}
+var Separator = React9.forwardRef(
+  ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(
+    SeparatorPrimitive.Root,
+    {
+      ref,
+      decorative,
+      orientation,
+      className: cn(
+        "shrink-0 bg-border",
+        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+var Sheet = SheetPrimitive.Root;
+var SheetPortal = SheetPrimitive.Portal;
+var SheetOverlay = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  SheetPrimitive.Overlay,
+  {
+    className: cn(
+      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props,
+    ref
+  }
+));
+SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
+var sheetVariants = cva(
+  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+  {
+    variants: {
+      side: {
+        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+        left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+        right: "inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
+      }
+    },
+    defaultVariants: {
+      side: "right"
+    }
+  }
+);
+var SheetContent = React9.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
+  /* @__PURE__ */ jsx(SheetOverlay, {}),
+  /* @__PURE__ */ jsxs(
+    SheetPrimitive.Content,
+    {
+      ref,
+      className: cn(sheetVariants({ side }), className),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+          /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+SheetContent.displayName = SheetPrimitive.Content.displayName;
+var SheetHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col space-y-2 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+SheetHeader.displayName = "SheetHeader";
+var SheetTitle = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  SheetPrimitive.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold text-foreground", className),
+    ...props
+  }
+));
+SheetTitle.displayName = SheetPrimitive.Title.displayName;
+var SheetDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  SheetPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+SheetDescription.displayName = SheetPrimitive.Description.displayName;
+function Skeleton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("animate-pulse rounded-md bg-muted", className),
+      ...props
+    }
+  );
+}
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React9.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+var SIDEBAR_COOKIE_NAME = "sidebar_state";
+var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
+var SIDEBAR_WIDTH = "16rem";
+var SIDEBAR_WIDTH_MOBILE = "18rem";
+var SIDEBAR_WIDTH_ICON = "3rem";
+var SIDEBAR_KEYBOARD_SHORTCUT = "b";
+var SidebarContext = React9.createContext(null);
+function useSidebar() {
+  const context = React9.useContext(SidebarContext);
+  if (!context) {
+    throw new Error("useSidebar must be used within a SidebarProvider.");
+  }
+  return context;
+}
+var SidebarProvider = React9.forwardRef(
+  ({
+    defaultOpen = true,
+    open: openProp,
+    onOpenChange: setOpenProp,
+    className,
+    style,
+    children,
+    ...props
+  }, ref) => {
+    const isMobile = useIsMobile();
+    const [openMobile, setOpenMobile] = React9.useState(false);
+    const [_open, _setOpen] = React9.useState(defaultOpen);
+    const open = openProp ?? _open;
+    const setOpen = React9.useCallback(
+      (value) => {
+        const openState = typeof value === "function" ? value(open) : value;
+        if (setOpenProp) {
+          setOpenProp(openState);
+        } else {
+          _setOpen(openState);
+        }
+        document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      },
+      [setOpenProp, open]
+    );
+    const toggleSidebar = React9.useCallback(() => {
+      return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
+    }, [isMobile, setOpen, setOpenMobile]);
+    React9.useEffect(() => {
+      const handleKeyDown = (event) => {
+        if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
+          event.preventDefault();
+          toggleSidebar();
+        }
+      };
+      window.addEventListener("keydown", handleKeyDown);
+      return () => window.removeEventListener("keydown", handleKeyDown);
+    }, [toggleSidebar]);
+    const state = open ? "expanded" : "collapsed";
+    const contextValue = React9.useMemo(
+      () => ({
+        state,
+        open,
+        setOpen,
+        isMobile,
+        openMobile,
+        setOpenMobile,
+        toggleSidebar
+      }),
+      [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
+    );
+    return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          "--sidebar-width": SIDEBAR_WIDTH,
+          "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
+          ...style
+        },
+        className: cn(
+          "group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar",
+          className
+        ),
+        ref,
+        ...props,
+        children
+      }
+    ) }) });
+  }
+);
+SidebarProvider.displayName = "SidebarProvider";
+var Sidebar = React9.forwardRef(
+  ({
+    side = "left",
+    variant = "sidebar",
+    collapsible = "offcanvas",
+    className,
+    children,
+    ...props
+  }, ref) => {
+    const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
+    if (collapsible === "none") {
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
+            className
+          ),
+          ref,
+          ...props,
+          children
+        }
+      );
+    }
+    if (isMobile) {
+      return /* @__PURE__ */ jsx(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs(
+        SheetContent,
+        {
+          "data-sidebar": "sidebar",
+          "data-mobile": "true",
+          className: "w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
+          style: {
+            "--sidebar-width": SIDEBAR_WIDTH_MOBILE
+          },
+          side,
+          children: [
+            /* @__PURE__ */ jsxs(SheetHeader, { className: "sr-only", children: [
+              /* @__PURE__ */ jsx(SheetTitle, { children: "Sidebar" }),
+              /* @__PURE__ */ jsx(SheetDescription, { children: "Displays the mobile sidebar." })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "flex h-full w-full flex-col", children })
+          ]
+        }
+      ) });
+    }
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: "group peer hidden text-sidebar-foreground md:block",
+        "data-state": state,
+        "data-collapsible": state === "collapsed" ? collapsible : "",
+        "data-variant": variant,
+        "data-side": side,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "relative w-[--sidebar-width] bg-transparent transition-[width] duration-200 ease-linear",
+                "group-data-[collapsible=offcanvas]:w-0",
+                "group-data-[side=right]:rotate-180",
+                variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon]"
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] duration-200 ease-linear md:flex",
+                side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
+                // Adjust the padding for floating and inset variants.
+                variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",
+                className
+              ),
+              ...props,
+              children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "data-sidebar": "sidebar",
+                  className: "flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow",
+                  children
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Sidebar.displayName = "Sidebar";
+var SidebarTrigger = React9.forwardRef(({ className, onClick, ...props }, ref) => {
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      ref,
+      "data-sidebar": "trigger",
+      variant: "ghost",
+      size: "icon",
+      className: cn("h-7 w-7", className),
+      onClick: (event) => {
+        onClick?.(event);
+        toggleSidebar();
+      },
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(PanelLeft, {}),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle Sidebar" })
+      ]
+    }
+  );
+});
+SidebarTrigger.displayName = "SidebarTrigger";
+var SidebarRail = React9.forwardRef(({ className, ...props }, ref) => {
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ref,
+      "data-sidebar": "rail",
+      "aria-label": "Toggle Sidebar",
+      tabIndex: -1,
+      onClick: toggleSidebar,
+      title: "Toggle Sidebar",
+      className: cn(
+        "absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex",
+        "[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize",
+        "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+        "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar",
+        "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
+        "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarRail.displayName = "SidebarRail";
+var SidebarInset = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "main",
+    {
+      ref,
+      className: cn(
+        "relative flex w-full flex-1 flex-col bg-background",
+        "md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarInset.displayName = "SidebarInset";
+var SidebarInput = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      ref,
+      "data-sidebar": "input",
+      className: cn(
+        "h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarInput.displayName = "SidebarInput";
+var SidebarHeader = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      "data-sidebar": "header",
+      className: cn("flex flex-col gap-2 p-2", className),
+      ...props
+    }
+  );
+});
+SidebarHeader.displayName = "SidebarHeader";
+var SidebarFooter = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      "data-sidebar": "footer",
+      className: cn("flex flex-col gap-2 p-2", className),
+      ...props
+    }
+  );
+});
+SidebarFooter.displayName = "SidebarFooter";
+var SidebarSeparator = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    Separator,
+    {
+      ref,
+      "data-sidebar": "separator",
+      className: cn("mx-2 w-auto bg-sidebar-border", className),
+      ...props
+    }
+  );
+});
+SidebarSeparator.displayName = "SidebarSeparator";
+var SidebarContent = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      "data-sidebar": "content",
+      className: cn(
+        "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarContent.displayName = "SidebarContent";
+var SidebarGroup = React9.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      "data-sidebar": "group",
+      className: cn("relative flex w-full min-w-0 flex-col p-2", className),
+      ...props
+    }
+  );
+});
+SidebarGroup.displayName = "SidebarGroup";
+var SidebarGroupLabel = React9.forwardRef(({ className, asChild = false, ...props }, ref) => {
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      "data-sidebar": "group-label",
+      className: cn(
+        "flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarGroupLabel.displayName = "SidebarGroupLabel";
+var SidebarGroupAction = React9.forwardRef(({ className, asChild = false, ...props }, ref) => {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      "data-sidebar": "group-action",
+      className: cn(
+        "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        // Increases the hit area of the button on mobile.
+        "after:absolute after:-inset-2 after:md:hidden",
+        "group-data-[collapsible=icon]:hidden",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarGroupAction.displayName = "SidebarGroupAction";
+var SidebarGroupContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-sidebar": "group-content",
+    className: cn("w-full text-sm", className),
+    ...props
+  }
+));
+SidebarGroupContent.displayName = "SidebarGroupContent";
+var SidebarMenu = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "ul",
+  {
+    ref,
+    "data-sidebar": "menu",
+    className: cn("flex w-full min-w-0 flex-col gap-1", className),
+    ...props
+  }
+));
+SidebarMenu.displayName = "SidebarMenu";
+var SidebarMenuItem = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "li",
+  {
+    ref,
+    "data-sidebar": "menu-item",
+    className: cn("group/menu-item relative", className),
+    ...props
+  }
+));
+SidebarMenuItem.displayName = "SidebarMenuItem";
+var sidebarMenuButtonVariants = cva(
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+        outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
+      },
+      size: {
+        default: "h-8 text-sm",
+        sm: "h-7 text-xs",
+        lg: "h-12 text-sm group-data-[collapsible=icon]:!p-0"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var SidebarMenuButton = React9.forwardRef(
+  ({
+    asChild = false,
+    isActive = false,
+    variant = "default",
+    size = "default",
+    tooltip,
+    className,
+    ...props
+  }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    const { isMobile, state } = useSidebar();
+    const button = /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        "data-sidebar": "menu-button",
+        "data-size": size,
+        "data-active": isActive,
+        className: cn(sidebarMenuButtonVariants({ variant, size }), className),
+        ...props
+      }
+    );
+    if (!tooltip) {
+      return button;
+    }
+    if (typeof tooltip === "string") {
+      tooltip = {
+        children: tooltip
+      };
+    }
+    return /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: button }),
+      /* @__PURE__ */ jsx(
+        TooltipContent,
+        {
+          side: "right",
+          align: "center",
+          hidden: state !== "collapsed" || isMobile,
+          ...tooltip
+        }
+      )
+    ] });
+  }
+);
+SidebarMenuButton.displayName = "SidebarMenuButton";
+var SidebarMenuAction = React9.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      "data-sidebar": "menu-action",
+      className: cn(
+        "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
+        // Increases the hit area of the button on mobile.
+        "after:absolute after:-inset-2 after:md:hidden",
+        "peer-data-[size=sm]/menu-button:top-1",
+        "peer-data-[size=default]/menu-button:top-1.5",
+        "peer-data-[size=lg]/menu-button:top-2.5",
+        "group-data-[collapsible=icon]:hidden",
+        showOnHover && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarMenuAction.displayName = "SidebarMenuAction";
+var SidebarMenuBadge = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-sidebar": "menu-badge",
+    className: cn(
+      "pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground",
+      "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
+      "peer-data-[size=sm]/menu-button:top-1",
+      "peer-data-[size=default]/menu-button:top-1.5",
+      "peer-data-[size=lg]/menu-button:top-2.5",
+      "group-data-[collapsible=icon]:hidden",
+      className
+    ),
+    ...props
+  }
+));
+SidebarMenuBadge.displayName = "SidebarMenuBadge";
+var SidebarMenuSkeleton = React9.forwardRef(({ className, showIcon = false, ...props }, ref) => {
+  const width = React9.useMemo(() => {
+    return `${Math.floor(Math.random() * 40) + 50}%`;
+  }, []);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      "data-sidebar": "menu-skeleton",
+      className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
+      ...props,
+      children: [
+        showIcon && /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            className: "size-4 rounded-md",
+            "data-sidebar": "menu-skeleton-icon"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            className: "h-4 max-w-[--skeleton-width] flex-1",
+            "data-sidebar": "menu-skeleton-text",
+            style: {
+              "--skeleton-width": width
+            }
+          }
+        )
+      ]
+    }
+  );
+});
+SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
+var SidebarMenuSub = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "ul",
+  {
+    ref,
+    "data-sidebar": "menu-sub",
+    className: cn(
+      "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
+      "group-data-[collapsible=icon]:hidden",
+      className
+    ),
+    ...props
+  }
+));
+SidebarMenuSub.displayName = "SidebarMenuSub";
+var SidebarMenuSubItem = React9.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("li", { ref, ...props }));
+SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
+var SidebarMenuSubButton = React9.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
+  const Comp = asChild ? Slot : "a";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      "data-sidebar": "menu-sub-button",
+      "data-size": size,
+      "data-active": isActive,
+      className: cn(
+        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
+        "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
+        size === "sm" && "text-xs",
+        size === "md" && "text-sm",
+        "group-data-[collapsible=icon]:hidden",
+        className
+      ),
+      ...props
+    }
+  );
+});
+SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
+var menuItemsConfig = [
+  { key: "dashboard", href: "/", label: "Dashboard", icon: LayoutDashboard },
+  { key: "products", href: "/products", label: "Products", icon: Package },
+  { key: "orders", href: "/orders", label: "Orders", icon: ShoppingCart },
+  { key: "customers", href: "/customers", label: "Customers", icon: Users },
+  { key: "payments", href: "/payments", label: "Payments", icon: CreditCard },
+  { key: "users", href: "/users", label: "Team", icon: UserCog },
+  { key: "settings", href: "/settings", label: "Settings", icon: Settings }
+];
+function AppSidebar() {
+  const routerState = useRouterState();
+  const pathname = routerState.location.pathname;
+  const config = useAdminConfig();
+  const menuItems = menuItemsConfig.filter(
+    (item) => config.menu?.[item.key] !== false
+  );
+  const customItems = (config.customMenuItems || []).map((item) => ({
+    key: item.href,
+    href: item.href,
+    label: item.label,
+    icon: () => /* @__PURE__ */ jsx("span", { className: "text-xl", children: item.icon })
+  }));
+  const allMenuItems = [...menuItems, ...customItems];
+  return /* @__PURE__ */ jsxs(Sidebar, { collapsible: "icon", children: [
+    /* @__PURE__ */ jsx(SidebarHeader, { className: "border-b px-6 py-4", children: typeof config.logo === "string" ? /* @__PURE__ */ jsx("img", { src: config.logo, alt: "Logo", className: "h-8" }) : config.logo ? config.logo : /* @__PURE__ */ jsx("h1", { className: "text-xl font-bold", children: config.appName }) }),
+    /* @__PURE__ */ jsx(SidebarContent, { children: /* @__PURE__ */ jsx(SidebarGroup, { children: /* @__PURE__ */ jsx(SidebarGroupContent, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: allMenuItems.map((item) => {
+      const Icon = item.icon;
+      const isActive = pathname === item.href;
+      return /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsx(SidebarMenuButton, { asChild: true, isActive, children: /* @__PURE__ */ jsxs(Link, { to: item.href, children: [
+        /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsx("span", { children: item.label })
+      ] }) }) }, item.href);
+    }) }) }) }) })
+  ] });
+}
+
+// src/components/layout/header.tsx
+init_auth_store();
+var Avatar = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AvatarPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
+      className
+    ),
+    ...props
+  }
+));
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+var AvatarImage = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AvatarPrimitive.Image,
+  {
+    ref,
+    className: cn("aspect-square h-full w-full", className),
+    ...props
+  }
+));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+var AvatarFallback = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AvatarPrimitive.Fallback,
+  {
+    ref,
+    className: cn(
+      "flex h-full w-full items-center justify-center rounded-full bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuSubTrigger = React9.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    className: cn(
+      "flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownMenuSubContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.SubContent,
+  {
+    ref,
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownMenuContent = React9.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = React9.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuCheckboxItem = React9.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    checked,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React9.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Circle, { className: "h-2 w-2 fill-current" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownMenuLabel = React9.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+function Header() {
+  const { user, logout } = useAuthStore();
+  const initials = user?.name.split(" ").map((n) => n[0]).join("").toUpperCase() || "??";
+  return /* @__PURE__ */ jsxs("header", { className: "flex h-16 shrink-0 items-center gap-2 border-b px-4", children: [
+    /* @__PURE__ */ jsx(SidebarTrigger, { className: "-ml-1" }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-1" }),
+    /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+      /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "ghost", className: "relative h-10 w-10 rounded-full", children: /* @__PURE__ */ jsx(Avatar, { children: /* @__PURE__ */ jsx(AvatarFallback, { children: initials }) }) }) }),
+      /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-1", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: user?.name }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: user?.email })
+        ] }) }),
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+        /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: logout, children: "Log out" })
+      ] })
+    ] })
+  ] });
+}
+function AdminLayout({ children }) {
+  return /* @__PURE__ */ jsxs(SidebarProvider, { defaultOpen: true, children: [
+    /* @__PURE__ */ jsx(AppSidebar, {}),
+    /* @__PURE__ */ jsxs(SidebarInset, { className: "flex flex-col", children: [
+      /* @__PURE__ */ jsx(Header, {}),
+      /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col gap-4 p-6", children })
+    ] })
+  ] });
+}
+var Route = createRootRoute({
+  component: RootComponent
+});
+function RootComponent() {
+  return /* @__PURE__ */ jsx(AdminLayout, { children: /* @__PURE__ */ jsx(Outlet, {}) });
+}
+function DashboardPage() {
+  const api = useManagoAPI();
+  const { data: products } = useQuery({
+    queryKey: ["products"],
+    queryFn: () => api.getProducts({ limit: 5 })
+  });
+  const { data: orders } = useQuery({
+    queryKey: ["orders"],
+    queryFn: () => api.getOrders({ limit: 5 })
+  });
+  const { data: customers } = useQuery({
+    queryKey: ["customers"],
+    queryFn: () => api.getCustomers({ limit: 5 })
+  });
+  const stats = [
+    {
+      title: "Total Products",
+      value: products?.total || 0,
+      icon: Package,
+      trend: "+12%"
+    },
+    {
+      title: "Total Orders",
+      value: orders?.total || 0,
+      icon: ShoppingCart,
+      trend: "+8%"
+    },
+    {
+      title: "Total Customers",
+      value: customers?.total || 0,
+      icon: Users,
+      trend: "+5%"
+    },
+    {
+      title: "Revenue",
+      value: "$12,456",
+      icon: DollarSign,
+      trend: "+15%"
+    }
+  ];
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold", children: "Dashboard" }),
+    /* @__PURE__ */ jsx("div", { className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4", children: stats.map((stat) => {
+      const Icon = stat.icon;
+      return /* @__PURE__ */ jsxs(Card, { children: [
+        /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between pb-2", children: [
+          /* @__PURE__ */ jsx(CardTitle, { className: "text-sm font-medium text-muted-foreground", children: stat.title }),
+          /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4 text-muted-foreground" })
+        ] }),
+        /* @__PURE__ */ jsxs(CardContent, { children: [
+          /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold", children: stat.value }),
+          /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-green-600", children: stat.trend }),
+            " from last month"
+          ] })
+        ] })
+      ] }, stat.title);
+    }) }),
+    /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+      /* @__PURE__ */ jsxs(Card, { children: [
+        /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Recent Orders" }) }),
+        /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", { className: "space-y-4", children: orders?.data?.slice(0, 5).map((order) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b pb-2 last:border-0", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsxs("p", { className: "font-medium", children: [
+              "#",
+              order.orderNumber
+            ] }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: order.customerEmail })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+            /* @__PURE__ */ jsxs("p", { className: "font-semibold", children: [
+              "$",
+              (order.total / 100).toFixed(2)
+            ] }),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground capitalize", children: order.paymentStatus })
+          ] })
+        ] }, order.id)) }) })
+      ] }),
+      /* @__PURE__ */ jsxs(Card, { children: [
+        /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Top Products" }) }),
+        /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", { className: "space-y-4", children: products?.data?.slice(0, 5).map((product) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b pb-2 last:border-0", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "font-medium", children: product.name }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: product.sku })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+            /* @__PURE__ */ jsxs("p", { className: "font-semibold", children: [
+              "$",
+              (product.price / 100).toFixed(2)
+            ] }),
+            /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+              product.stock,
+              " in stock"
+            ] })
+          ] })
+        ] }, product.id)) }) })
+      ] })
+    ] })
+  ] });
+}
+
+// src/routes/index.tsx
+var Route2 = createRoute({
+  getParentRoute: () => Route,
+  path: "/",
+  component: DashboardPage
+});
+
+// src/routeTree.gen.ts
+var routeTree = Route.addChildren([
+  Route2
+  //   ProductsRoute,
+  //   OrdersRoute,
+  //   CustomersRoute,
+  //   PaymentsRoute,
+  //   SettingsRoute,
+  //   UsersRoute,
+]);
+function ManagoAdmin() {
+  const { isAuthenticated } = useAuthStore();
+  const hasHydrated = useHasHydrated();
+  const router = useMemo(() => {
+    if (typeof window === "undefined") return null;
+    const browserHistory = createBrowserHistory();
+    return createRouter({
+      routeTree,
+      history: browserHistory,
+      basepath: "/admin"
+    });
+  }, []);
+  if (!hasHydrated || !router) {
+    return null;
+  }
+  if (!isAuthenticated) {
+    return /* @__PURE__ */ jsx(LoginPage, {});
+  }
+  return /* @__PURE__ */ jsx(RouterProvider, { router });
+}
+
+export { ManagoAdmin, ManagoProvider, useManagoAPI };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map