create-bdpa-react-scaffold 1.7.2 → 1.7.3

package/create-ui-lib.js

@@ -738,15 +738,51 @@ export default function Table({ columns, data }) {
 `);
 
 write("src/components/ui/Navbar.jsx", `
-import { Menu } from "lucide-react";
+import { Menu, ChevronDown } from "lucide-react";
+import { useState } from "react";
 
 export default function Navbar({ onMenuClick }) {
+  const [dropdownOpen, setDropdownOpen] = useState(false);
+
+  const dropdownItems = [
+    { label: "Profile", href: "#" },
+    { label: "Settings", href: "#" },
+    { label: "Help", href: "#" },
+    { label: "Feedback", href: "#" },
+    { label: "Logout", href: "#" }
+  ];
+
   return (
     <nav className="bg-white border-b border-gray-200 px-4 py-3 flex items-center justify-between">
       <button className="md:hidden" onClick={onMenuClick}>
         <Menu />
       </button>
       <h1 className="text-xl font-bold">BDPA React Scaffold and Demo</h1>
+      
+      {/* Dropdown Menu */}
+      <div className="relative">
+        <button
+          onClick={() => setDropdownOpen(!dropdownOpen)}
+          className="flex items-center gap-2 px-3 py-2 rounded hover:bg-gray-100"
+        >
+          Menu
+          <ChevronDown size={18} />
+        </button>
+        
+        {dropdownOpen && (
+          <div className="absolute right-0 mt-2 w-48 bg-white border border-gray-200 rounded-lg shadow-lg z-50">
+            {dropdownItems.map((item, index) => (
+              <a
+                key={index}
+                href={item.href}
+                className="block px-4 py-2 hover:bg-gray-100 first:rounded-t-lg last:rounded-b-lg"
+              >
+                {item.label}
+              </a>
+            ))}
+          </div>
+        )}
+      </div>
     </nav>
   );
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-bdpa-react-scaffold",
-  "version": "1.7.2",
+  "version": "1.7.3",
   
   "description": "Scaffold a React + Tailwind UI library demo via Vite.",
   "bin": {