create-bdpa-react-scaffold 2.0.2 → 2.0.4

package/create-ui-lib.js

@@ -168,7 +168,6 @@ write("package.json", `
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.20.0",
-    "lucide-react": "^0.344.0",
     "bcryptjs": "^2.4.3",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
@@ -711,6 +710,90 @@ export default function App() {
 }
 `);
 
+write("src/components/ui/icons.jsx", `
+// Local SVG icon module — inline icon components, no external icon library needed.
+// All icons accept className and other SVG props.
+
+function SvgIcon({ className = "h-4 w-4", children, ...props }) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className={className}
+      {...props}
+    >
+      {children}
+    </svg>
+  );
+}
+
+export function Check({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="M20 6 9 17l-5-5" /></SvgIcon>;
+}
+
+export function X({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="M18 6 6 18" /><path d="m6 6 12 12" /></SvgIcon>;
+}
+
+export function Circle({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><circle cx="12" cy="12" r="10" /></SvgIcon>;
+}
+
+export function CheckCircle({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><circle cx="12" cy="12" r="10" /><path d="m9 12 2 2 4-4" /></SvgIcon>;
+}
+
+export function AlertCircle({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><circle cx="12" cy="12" r="10" /><line x1="12" y1="8" x2="12" y2="12" /><line x1="12" y1="16" x2="12.01" y2="16" /></SvgIcon>;
+}
+
+export function Info({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><circle cx="12" cy="12" r="10" /><path d="M12 16v-4" /><path d="M12 8h.01" /></SvgIcon>;
+}
+
+export function Menu({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><line x1="4" x2="20" y1="6" y2="6" /><line x1="4" x2="20" y1="12" y2="12" /><line x1="4" x2="20" y1="18" y2="18" /></SvgIcon>;
+}
+
+export function Search({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><circle cx="11" cy="11" r="8" /><path d="m21 21-4.3-4.3" /></SvgIcon>;
+}
+
+export function ChevronDown({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="m6 9 6 6 6-6" /></SvgIcon>;
+}
+
+export function ChevronUp({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="m18 15-6-6-6 6" /></SvgIcon>;
+}
+
+export function ChevronRight({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="m9 18 6-6-6-6" /></SvgIcon>;
+}
+
+export function ChevronLeft({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="m15 18-6-6 6-6" /></SvgIcon>;
+}
+
+export function ArrowRight({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="M5 12h14" /><path d="m12 5 7 7-7 7" /></SvgIcon>;
+}
+
+export function ArrowLeft({ className, ...p }) {
+  return <SvgIcon className={className} {...p}><path d="m12 19-7-7 7-7" /><path d="M19 12H5" /></SvgIcon>;
+}
+
+// Aliases
+export const ChevronDownIcon = ChevronDown;
+export const ChevronLeftIcon = ChevronLeft;
+export const ChevronRightIcon = ChevronRight;
+`);
+
 write("src/pages/Home.jsx", `
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
@@ -733,7 +816,7 @@ import { Textarea } from "@/components/ui/textarea";
 import { Skeleton } from "@/components/ui/skeleton";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { toast } from "sonner";
-import { Menu, Info, CheckCircle } from "lucide-react";
+import { Menu, Info, CheckCircle } from "@/components/ui/icons";
 import { ApiClient } from "@/utils/api.js";
 
 const enrollmentData = [
@@ -1266,7 +1349,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/comp
 import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from "@/components/ui/sheet";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
 import { toast } from "sonner";
-import { CheckCircle, Info, AlertCircle } from "lucide-react";
+import { CheckCircle, Info, AlertCircle } from "@/components/ui/icons";
 
 const sampleRows = [
   { id: 1, name: "Ada Lovelace", role: "Student", status: "Active" },
@@ -1716,6 +1799,37 @@ if (fs.existsSync(bdpaImagePath)) {
 if (doInstall) {
   installDependencies(packageManager, BASE_DIR);
   installShadcn(BASE_DIR);
+  // Override shadcn's sonner.jsx which imports lucide-react.
+  // This version uses Sonner's built-in icons and CSS variable theming.
+  write("src/components/ui/sonner.jsx", `
+import { Toaster as Sonner } from "sonner";
+
+const Toaster = ({ ...props }) => {
+  return (
+    <Sonner
+      className="toaster group"
+      toastOptions={{
+        classNames: {
+          toast:
+            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+          description: "group-[.toast]:text-muted-foreground",
+          actionButton:
+            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground font-medium",
+          cancelButton:
+            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
+          error: "group-[.toaster]:!bg-destructive group-[.toaster]:!text-destructive-foreground",
+          success: "group-[.toaster]:border-border",
+          warning: "group-[.toaster]:border-border",
+          info: "group-[.toaster]:border-border",
+        },
+      }}
+      {...props}
+    />
+  );
+};
+
+export { Toaster };
+`);
 }
 
 installVSCodeExtensions();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-bdpa-react-scaffold",
-  "version": "2.0.2",
+  "version": "2.0.4",
   "description": "Scaffold a React + Tailwind + shadcn/ui component demo via Vite.",
   "bin": {
     "create-bdpa-react-scaffold": "create-ui-lib.js"