mavi-dashboard 0.0.8 → 0.0.9

package/README.md

@@ -33,3 +33,7 @@ Styles are generated when Tailwind scans this package’s sources. Your app **mu
    ```
 
 Without `@tailwindcss/vite`, or without scanning `mavi-dashboard` sources (fixed in `@heinricov/mavi-ui` ≥ 0.0.2), the layout will look unstyled.
+
+## Install hook
+
+On `npm install`, if the project looks like **Vite + React** or **Create React App**, this package overwrites `src/App.tsx` (or `src/App.jsx` if that file already exists) with the default route shell from the Mavi demo (requires `react-router-dom`). Set `MAVI_DASHBOARD_SKIP_INSTALL_HOOK=1` to skip.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mavi-dashboard",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "React dashboard layout with sidebar, header, and theme shell",
   "license": "MIT",
   "publishConfig": {
@@ -25,9 +25,11 @@
   "types": "./src/dashboard/index.ts",
   "files": [
     "src",
+    "scripts",
     "README.md"
   ],
   "scripts": {
+    "postinstall": "node ./scripts/postinstall.cjs",
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
@@ -36,7 +38,8 @@
   "peerDependencies": {
     "lucide-react": "^1.8.0",
     "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0"
+    "react-dom": "^18.0.0 || ^19.0.0",
+    "react-router-dom": "^6.0.0 || ^7.0.0"
   },
   "devDependencies": {
     "@types/react": "^19.2.10",

package/scripts/postinstall.cjs

@@ -0,0 +1,85 @@
+#!/usr/bin/env node
+const fs = require("fs")
+const path = require("path")
+
+if (
+  process.env.MAVI_DASHBOARD_SKIP_INSTALL_HOOK === "1" ||
+  process.env.MAVI_DASHBOARD_SKIP_POSTINSTALL === "1"
+) {
+  process.exit(0)
+}
+
+const projectRoot = process.env.INIT_CWD || process.cwd()
+const thisPackageRoot = path.resolve(__dirname, "..")
+
+if (path.resolve(projectRoot) === path.resolve(thisPackageRoot)) {
+  process.exit(0)
+}
+
+let pkg
+try {
+  pkg = JSON.parse(
+    fs.readFileSync(path.join(projectRoot, "package.json"), "utf8"),
+  )
+} catch {
+  process.exit(0)
+}
+
+const deps = { ...pkg.dependencies, ...pkg.devDependencies }
+const hasReact = Boolean(deps.react || deps["react-dom"])
+if (!hasReact) process.exit(0)
+
+if (deps.next || deps["@remix-run/react"]) process.exit(0)
+
+const hasVite =
+  Boolean(deps.vite || deps["@vitejs/plugin-react"]) ||
+  [
+    "vite.config.ts",
+    "vite.config.js",
+    "vite.config.mjs",
+    "vite.config.cjs",
+    "vite.config.mts",
+  ].some((name) => fs.existsSync(path.join(projectRoot, name)))
+
+const isCra = Boolean(deps["react-scripts"])
+if (!((hasVite && hasReact) || isCra)) process.exit(0)
+
+const appSource = `import { Routes, Route } from "react-router-dom"
+
+export function App() {
+  return (
+    <Routes>
+      <Route path="/" element={<div>Dashboard</div>} />
+      <Route path="/laporan" element={<div>Laporan</div>} />
+      <Route path="/project/1" element={<div>Project 1</div>} />
+      <Route path="/project/2" element={<div>Project 2</div>} />
+      <Route path="/project/3" element={<div>Project 3</div>} />
+      <Route path="/project/4" element={<div>Project 4</div>} />
+      <Route path="/data-produk" element={<div>Data Produk</div>} />
+      <Route path="/data-user" element={<div>Data User</div>} />
+      <Route path="/about" element={<div>About</div>} />
+      <Route path="/settings" element={<div>Settings</div>} />
+    </Routes>
+  )
+}
+`
+
+const srcDir = path.join(projectRoot, "src")
+const tsxPath = path.join(srcDir, "App.tsx")
+const jsxPath = path.join(srcDir, "App.jsx")
+
+let targetPath
+if (fs.existsSync(tsxPath)) targetPath = tsxPath
+else if (fs.existsSync(jsxPath)) targetPath = jsxPath
+else targetPath = tsxPath
+
+try {
+  if (!fs.existsSync(srcDir)) fs.mkdirSync(srcDir, { recursive: true })
+  if (fs.existsSync(targetPath)) {
+    const current = fs.readFileSync(targetPath, "utf8")
+    if (current === appSource) process.exit(0)
+  }
+  fs.writeFileSync(targetPath, appSource, "utf8")
+} catch {
+  process.exit(0)
+}