@mantajs/dashboard 0.1.13 → 0.1.14

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024-present MantaJS Contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,253 @@
+# @mantajs/dashboard
+
+A customizable fork of `@medusajs/dashboard` that lets you **override components**, **override routes**, and **define your own sidebar menu** — without modifying the original dashboard source code.
+
+Drop-in replacement for `@medusajs/dashboard` via package manager resolutions/overrides.
+
+## Installation
+
+```bash
+# Yarn
+yarn add @mantajs/dashboard
+
+# npm
+npm install @mantajs/dashboard
+
+# pnpm
+pnpm add @mantajs/dashboard
+```
+
+### Using as a dashboard replacement
+
+In your Medusa backend's `package.json`, add a resolution/override to swap `@medusajs/dashboard` with `@mantajs/dashboard`. The syntax depends on your package manager:
+
+#### Yarn (v1 & v4+)
+
+```json
+{
+  "resolutions": {
+    "@medusajs/dashboard": "npm:@mantajs/dashboard@^0.1.13"
+  }
+}
+```
+
+#### npm (v8.3+)
+
+```json
+{
+  "overrides": {
+    "@medusajs/dashboard": "npm:@mantajs/dashboard@^0.1.13"
+  }
+}
+```
+
+#### pnpm
+
+```json
+{
+  "pnpm": {
+    "overrides": {
+      "@medusajs/dashboard": "npm:@mantajs/dashboard@^0.1.13"
+    }
+  }
+}
+```
+
+Then register the Vite plugin in your `medusa-config.ts`:
+
+```ts
+import { defineConfig } from "@medusajs/framework/config"
+import { customDashboardPlugin } from "@mantajs/dashboard/vite-plugin"
+
+export default defineConfig({
+  // ...
+  admin: {
+    vite: () => ({
+      plugins: [customDashboardPlugin()],
+    }),
+  },
+})
+```
+
+Run `medusa build` (or `medusa develop`) and the custom dashboard will be compiled in place of the stock one.
+
+## Features
+
+### 1. Component Overrides
+
+Replace any dashboard component by placing a file with the **same name** in your project's `src/admin/components/` directory. The plugin **recursively scans** the entire `components/` tree, so you can organize overrides in subdirectories.
+
+```
+your-project/
+└── src/
+    └── admin/
+        └── components/
+            ├── product-general-section.tsx          ← flat override (works)
+            ├── orders/
+            │   └── order-activity-section.tsx        ← nested override (works too)
+            └── forms/
+                └── shipping-address-form.tsx         ← deeply nested (works too)
+```
+
+**How it works:**
+
+During Vite's pre-bundling phase, the plugin redirects the dashboard's `dist/app.mjs` entry to source files. It then intercepts individual source file loads and swaps any component whose filename matches one of your overrides.
+
+Matching is done by **file name** (without extension), regardless of subdirectory depth. For example:
+
+| Your file | Overrides |
+|-----------|-----------|
+| `product-general-section.tsx` | `src/routes/products/.../product-general-section.tsx` |
+| `orders/order-list.tsx` | `src/routes/orders/order-list/order-list.tsx` |
+| `layout/main-layout.tsx` | `src/components/layout/main-layout/main-layout.tsx` |
+
+Your override component must export a `default` export:
+
+```tsx
+// src/admin/components/orders/order-activity-section.tsx
+const OrderActivitySection = () => {
+  return <div>My custom order activity section</div>
+}
+
+export default OrderActivitySection
+```
+
+**Important notes:**
+
+- Override files are discovered **recursively** in `src/admin/components/` and all its subdirectories.
+- Matching is based on **file name only** — the subdirectory structure is for your own organization and does not affect matching.
+- If two files in different subdirectories share the same name, the plugin logs a warning in development and uses the one that comes last alphabetically by full path.
+- Index/barrel files (`index.ts`) are never overridden to preserve re-exports.
+- The plugin forces Vite to re-optimize dependencies when overrides are present, so changes are always picked up.
+
+### 2. Route Overrides
+
+Add new pages or replace existing ones using Medusa's standard admin extension system.
+
+```
+your-project/
+└── src/
+    └── admin/
+        └── routes/
+            └── custom-page/
+                └── page.tsx          ← adds /custom-page to the dashboard
+            └── orders/
+                └── page.tsx          ← overrides the /orders page
+```
+
+**How merging works:**
+
+- If your extension route has a path that **doesn't exist** in the dashboard, it's added as a new route.
+- If your extension route has the **same path** as a built-in route, your component **replaces** the original.
+- Children of the original route that you **don't redefine** are preserved. For example, overriding `/orders` keeps `/orders/:id` intact.
+
+This uses Medusa's `@medusajs/admin-vite-plugin` to discover routes in `src/admin/routes/`, combined with a custom merge function that ensures backward compatibility.
+
+### 3. Custom Menu Configuration
+
+Define your own sidebar menu by creating a `src/admin/menu.config.tsx` file:
+
+```
+your-project/
+└── src/
+    └── admin/
+        └── menu.config.tsx
+```
+
+```tsx
+// src/admin/menu.config.tsx
+import { ShoppingCart, Users, BuildingStorefront } from "@medusajs/icons"
+import type { MenuConfig } from "@mantajs/dashboard/vite-plugin"
+
+const config: MenuConfig = {
+  items: [
+    {
+      icon: <ShoppingCart />,
+      label: "orders.domain",
+      to: "/orders",
+      useTranslation: true,
+    },
+    {
+      icon: <Users />,
+      label: "customers.domain",
+      to: "/customers",
+      useTranslation: true,
+    },
+    {
+      icon: <BuildingStorefront />,
+      label: "My Custom Page",
+      to: "/custom-page",
+      items: [
+        { label: "Sub Page", to: "/custom-page/sub" },
+      ],
+    },
+  ],
+}
+
+export default config
+```
+
+**Menu item properties:**
+
+| Property | Type | Description |
+|----------|------|-------------|
+| `icon` | `ReactNode` | Icon component (use `@medusajs/icons`) |
+| `label` | `string` | Display label or i18n translation key |
+| `to` | `string` | Route path |
+| `useTranslation` | `boolean` | If `true`, `label` is treated as an i18n key |
+| `items` | `MenuNestedItem[]` | Optional nested items |
+
+**Types:**
+
+```ts
+import type { MenuConfig, MenuItem, MenuNestedItem } from "@mantajs/dashboard/vite-plugin"
+```
+
+When no `menu.config.ts` is found, the dashboard falls back to its built-in sidebar menu.
+
+## Exports
+
+| Import | Description |
+|--------|-------------|
+| `@mantajs/dashboard` | Main dashboard app (DashboardPlugin type, render function) |
+| `@mantajs/dashboard/css` | Dashboard stylesheet |
+| `@mantajs/dashboard/vite-plugin` | Vite plugin + menu types |
+
+## Development
+
+```bash
+# Install dependencies
+yarn install
+
+# Start dev server (standalone dashboard)
+yarn dev
+
+# Build for distribution
+yarn build
+
+# Run tests
+yarn test
+
+# Validate i18n translations
+yarn i18n:validate
+```
+
+### Environment Variables
+
+| Variable | Default | Description |
+|----------|---------|-------------|
+| `VITE_MEDUSA_BACKEND_URL` | `http://localhost:9000` | Medusa backend URL |
+| `VITE_MEDUSA_STOREFRONT_URL` | `http://localhost:8000` | Storefront URL |
+| `VITE_MEDUSA_BASE` | `/` | Base path for the dashboard |
+| `VITE_MEDUSA_PROJECT` | — | Path to a Medusa project to load admin extensions from |
+
+## Compatibility
+
+- **Medusa v2** (2.13.x)
+- **React 18**
+- **Vite 5**
+- **TypeScript 5.6+**
+
+## License
+
+[MIT](LICENSE)

package/dist/{api-key-management-detail-TM6K63HF.mjs → api-key-management-detail-SZR6LLZY.mjs}

@@ -19,7 +19,11 @@ import {
 import "./chunk-R4ZOO4ON.mjs";
 import {
   DataTable
-} from "./chunk-5YS7C2IA.mjs";
+} from "./chunk-KCWP7RF5.mjs";
+import "./chunk-C76H5USB.mjs";
+import {
+  useDate
+} from "./chunk-DFFLVEZ5.mjs";
 import "./chunk-G4BWCU5P.mjs";
 import {
   useExtension
@@ -33,14 +37,14 @@ import {
 } from "./chunk-OZPB6JBL.mjs";
 import "./chunk-OC7BQLYI.mjs";
 import "./chunk-S4DMV3ZT.mjs";
-import "./chunk-C76H5USB.mjs";
-import {
-  useDate
-} from "./chunk-DFFLVEZ5.mjs";
 import "./chunk-535OVBXR.mjs";
 import "./chunk-4GQYRG3L.mjs";
 import "./chunk-I4OBEAOJ.mjs";
 import "./chunk-FAB3VINY.mjs";
+import "./chunk-HI6URQ7H.mjs";
+import "./chunk-6CLQKVAU.mjs";
+import "./chunk-KI7TOXBR.mjs";
+import "./chunk-QBIQEVTU.mjs";
 import {
   apiKeysQueryKeys,
   useApiKey,
@@ -48,10 +52,6 @@ import {
   useDeleteApiKey,
   useRevokeApiKey
 } from "./chunk-C32SLRTC.mjs";
-import "./chunk-HI6URQ7H.mjs";
-import "./chunk-6CLQKVAU.mjs";
-import "./chunk-KI7TOXBR.mjs";
-import "./chunk-QBIQEVTU.mjs";
 import "./chunk-WAXMT4IY.mjs";
 import "./chunk-DYDGGABK.mjs";
 import "./chunk-LGNTHZ5Y.mjs";
@@ -59,22 +59,22 @@ import "./chunk-CN7JXSGW.mjs";
 import {
   useUser
 } from "./chunk-5BQQRHQS.mjs";
-import "./chunk-6F74MBBU.mjs";
 import "./chunk-FWRPGWPC.mjs";
+import "./chunk-5AFMB7XQ.mjs";
+import "./chunk-6F74MBBU.mjs";
 import "./chunk-A63RZVX6.mjs";
 import "./chunk-HBXV7ENS.mjs";
 import "./chunk-CDORR33H.mjs";
+import "./chunk-73OGFYCU.mjs";
+import "./chunk-R3FD2XEU.mjs";
 import "./chunk-6X2UTJF3.mjs";
-import "./chunk-VCSSQVPD.mjs";
-import "./chunk-HP2JH45P.mjs";
-import "./chunk-SQDIZZDW.mjs";
 import {
   useSalesChannels
 } from "./chunk-RNV5E7NV.mjs";
 import "./chunk-3BF5SC66.mjs";
-import "./chunk-5AFMB7XQ.mjs";
-import "./chunk-73OGFYCU.mjs";
-import "./chunk-R3FD2XEU.mjs";
+import "./chunk-VCSSQVPD.mjs";
+import "./chunk-HP2JH45P.mjs";
+import "./chunk-SQDIZZDW.mjs";
 import "./chunk-3TPUO6MD.mjs";
 import "./chunk-7AXHHXCX.mjs";
 import {

package/dist/{api-key-management-sales-channels-4GOYD6BF.mjs → api-key-management-sales-channels-WZAGFYC5.mjs}

@@ -8,6 +8,12 @@ import {
   useSalesChannelTableQuery
 } from "./chunk-APGDAT7X.mjs";
 import "./chunk-BTYBTKWK.mjs";
+import "./chunk-R4ZOO4ON.mjs";
+import {
+  DataTable
+} from "./chunk-KCWP7RF5.mjs";
+import "./chunk-C76H5USB.mjs";
+import "./chunk-DFFLVEZ5.mjs";
 import "./chunk-IUCDCPJU.mjs";
 import {
   KeyboundForm
@@ -17,18 +23,12 @@ import {
   RouteFocusModal,
   useRouteModal
 } from "./chunk-D6UW7URG.mjs";
-import "./chunk-R4ZOO4ON.mjs";
-import {
-  DataTable
-} from "./chunk-5YS7C2IA.mjs";
 import "./chunk-G4BWCU5P.mjs";
 import "./chunk-OZPB6JBL.mjs";
 import {
   ConditionalTooltip
 } from "./chunk-OC7BQLYI.mjs";
 import "./chunk-S4DMV3ZT.mjs";
-import "./chunk-C76H5USB.mjs";
-import "./chunk-DFFLVEZ5.mjs";
 import "./chunk-535OVBXR.mjs";
 import "./chunk-OBQI23QM.mjs";
 import {

package/dist/app.css

@@ -1908,9 +1908,6 @@ video {
 .w-2\.5 {
   width: 0.625rem;
 }
-.w-20 {
-  width: 5rem;
-}
 .w-24 {
   width: 6rem;
 }
@@ -2580,9 +2577,6 @@ video {
 .divide-dashed > :not([hidden]) ~ :not([hidden]) {
   border-style: dashed;
 }
-.divide-ui-border-base > :not([hidden]) ~ :not([hidden]) {
-  border-color: var(--border-base);
-}
 .self-start {
   align-self: flex-start;
 }
@@ -2724,9 +2718,6 @@ video {
 .border-0 {
   border-width: 0px;
 }
-.border-2 {
-  border-width: 2px;
-}
 .border-\[0\.5px\] {
   border-width: 0.5px;
 }
@@ -2830,9 +2821,6 @@ video {
 .border-t-ui-border-menu-top {
   border-top-color: var(--border-menu-top);
 }
-.border-t-ui-fg-base {
-  border-top-color: var(--fg-base);
-}
 .\!bg-ui-bg-base {
   background-color: var(--bg-base) !important;
 }
@@ -4037,11 +4025,6 @@ video {
   -moz-appearance: textfield;
   appearance: textfield;
 }
-.worfklow-grid {
-  background-image: radial-gradient(black 1px, transparent 0);
-  background-size: 40px 40px;
-  background: repeat;
-}
 .data-\[state\=checked\]\:txt-compact-small-plus[data-state=checked] {
   font-size: 0.8125rem;
   line-height: 1.25rem;
@@ -5083,9 +5066,6 @@ video {
   .lg\:grid-cols-2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
-  .lg\:grid-cols-4 {
-    grid-template-columns: repeat(4, minmax(0, 1fr));
-  }
   .lg\:grid-cols-6 {
     grid-template-columns: repeat(6, minmax(0, 1fr));
   }