@manago/admin 0.1.0

package/README.md

@@ -0,0 +1,164 @@
+# @manago/admin
+
+A beautiful, fully-featured admin dashboard component library for Next.js built with shadcn/ui, TanStack Router, and Tailwind CSS.
+
+## Features
+
+- 🎨 Beautiful UI components built with shadcn/ui
+- 🚀 Built for Next.js 15+ with React 19
+- 📱 Fully responsive with mobile support
+- 🎯 Type-safe with TypeScript
+- 🔐 Built-in authentication with Zustand
+- 🎭 Collapsible sidebar with icon mode
+- 🌐 Client-side routing with TanStack Router
+- ⚡ Fast and optimized with tsup
+
+## Installation
+
+```bash
+npm install @manago/admin
+# or
+pnpm add @manago/admin
+# or
+yarn add @manago/admin
+```
+
+### Peer Dependencies
+
+Make sure you have these installed:
+
+```bash
+npm install next@^15.0.0 react@^19.0.0 react-dom@^19.0.0
+```
+
+## Usage
+
+### Basic Setup
+
+1. Import the styles in your root layout:
+
+```tsx
+// app/layout.tsx
+import "@manago/admin/styles";
+```
+
+2. Create an admin page with catch-all routes:
+
+```tsx
+// app/admin/[[...slug]]/page.tsx
+'use client'
+
+import { ManagoProvider, ManagoAdmin } from '@manago/admin'
+
+export default function AdminPage() {
+  return (
+    <ManagoProvider
+      apiKey={process.env.NEXT_PUBLIC_MANAGO_API_KEY!}
+      config={{
+        appName: 'My Admin Dashboard',
+        menu: {
+          users: false, // Hide specific menu items
+        },
+      }}
+    >
+      <ManagoAdmin />
+    </ManagoProvider>
+  )
+}
+```
+
+### Configuration
+
+```tsx
+<ManagoProvider
+  apiKey="your-api-key"
+  config={{
+    appName: 'My Store Admin',
+    logo: '/logo.png', // or React component
+    menu: {
+      dashboard: true,
+      products: true,
+      orders: true,
+      customers: true,
+      payments: true,
+      users: false,
+      settings: true,
+    },
+    customMenuItems: [
+      {
+        href: '/analytics',
+        label: 'Analytics',
+        icon: '📊',
+      },
+    ],
+  }}
+>
+  <ManagoAdmin />
+</ManagoProvider>
+```
+
+## Features
+
+### Dashboard
+- Real-time statistics
+- Recent orders and products
+- Beautiful cards and charts
+
+### Sidebar Navigation
+- Collapsible to icon mode
+- Active state highlighting
+- Custom menu items support
+- Mobile-responsive
+
+### Authentication
+- Built-in login page
+- Persistent authentication with Zustand
+- Protected routes
+
+## Styling
+
+The package uses Tailwind CSS v4. Make sure your project has Tailwind CSS configured.
+
+The styles are automatically imported when you import `@manago/admin/styles`.
+
+## API
+
+### Components
+
+- `ManagoProvider` - Main provider component
+- `ManagoAdmin` - Admin dashboard component
+
+### Configuration Options
+
+```typescript
+interface AdminConfig {
+  appName?: string
+  logo?: string | React.ReactNode
+  menu?: {
+    dashboard?: boolean
+    products?: boolean
+    orders?: boolean
+    customers?: boolean
+    payments?: boolean
+    users?: boolean
+    settings?: boolean
+  }
+  customMenuItems?: Array<{
+    href: string
+    label: string
+    icon: string
+  }>
+}
+```
+
+## License
+
+MIT
+
+## Author
+
+Your Name
+
+## Contributing
+
+Contributions are welcome! Please open an issue or submit a pull request.

package/dist/index.d.mts

@@ -0,0 +1,79 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import { createRouter } from '@tanstack/react-router';
+
+type APIConfig = {
+    apiKey: string;
+    baseURL?: string;
+};
+declare class ManagoAPIClient {
+    private apiKey;
+    private baseURL;
+    constructor(config: APIConfig);
+    request(endpoint: string, options?: RequestInit): Promise<any>;
+    login(email: string, password: string): Promise<any>;
+    getProducts(params?: {
+        page?: number;
+        limit?: number;
+    }): Promise<any>;
+    getProduct(id: string): Promise<any>;
+    createProduct(data: any): Promise<any>;
+    updateProduct(id: string, data: any): Promise<any>;
+    deleteProduct(id: string): Promise<any>;
+    getOrders(params?: {
+        page?: number;
+        limit?: number;
+    }): Promise<any>;
+    getCustomers(params?: {
+        page?: number;
+        limit?: number;
+    }): Promise<any>;
+    getSettings(): Promise<any>;
+    updateSettings(data: any): Promise<any>;
+}
+
+type AdminMenuItem = {
+    href: string;
+    label: string;
+    icon: string;
+    enabled?: boolean;
+};
+type AdminConfig = {
+    appName?: string;
+    logo?: string | React.ReactNode;
+    menu?: {
+        dashboard?: boolean;
+        products?: boolean;
+        orders?: boolean;
+        customers?: boolean;
+        payments?: boolean;
+        users?: boolean;
+        settings?: boolean;
+    };
+    customMenuItems?: AdminMenuItem[];
+    features?: {
+        multiUser?: boolean;
+        analytics?: boolean;
+        exports?: boolean;
+    };
+    theme?: {
+        primaryColor?: string;
+        sidebarBg?: string;
+    };
+};
+
+declare function ManagoProvider({ apiKey, config, children, }: {
+    apiKey: string;
+    config?: Partial<AdminConfig>;
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function useManagoAPI(): ManagoAPIClient;
+
+declare module '@tanstack/react-router' {
+    interface Register {
+        router: ReturnType<typeof createRouter>;
+    }
+}
+declare function ManagoAdmin(): react_jsx_runtime.JSX.Element | null;
+
+export { type AdminConfig, ManagoAdmin, ManagoProvider, useManagoAPI };